tree-renderer: better workaround for focus manager

Changing the focus manager at runtime doesn't work as expected, so we
work around with a css hack instead.

src/utils/tree-renderer.scss

@@ -0,0 +1,11 @@
+// SPDX-License-Identifier: MIT
+// Copyright (c) 2022 The Pybricks Authors
+
+@import '../variables.scss';
+
+// HACK: work around https://github.com/palantir/blueprint/issues/5229
+// TODO: this can be removed when https://github.com/palantir/blueprint/pull/5235 is merged and released
+
+.#{$ns}-focus-disabled .pb-focus-manager-ignore :focus {
+    outline: $pt-outline-color auto 2px !important;
+}

src/utils/tree-renderer.tsx

@@ -6,11 +6,11 @@
 // based on https://github.com/lukasbach/react-complex-tree/blob/239fb0c5f49f3c24e307142fb3d7e828440c3f55/packages/blueprintjs-renderers/src/renderers.tsx
 // Copyright (c) 2021 Lukas Bach
 
+import './tree-renderer.scss';
 import {
     Button,
     Classes,
     Colors,
-    FocusStyleManager,
     Icon,
     IconName,
     InputGroup,
@@ -44,9 +44,7 @@ export const renderers: Omit<
 > = {
     renderTreeContainer: (props) => (
         <div
-            className={cx(Classes.TREE)}
-            onFocus={FocusStyleManager.alwaysShowFocus}
-            onBlur={FocusStyleManager.onlyShowFocusOnTabs}
+            className={cx(Classes.TREE, 'pb-focus-manager-ignore')}
             {...props.containerProps}
         >
             {props.children}