@itwin/tree-widget-react 4.0.0-alpha.0 → 4.0.0-alpha.10

package/CHANGELOG.md

@@ -1,9 +1,92 @@
 # Change Log - @itwin/tree-widget-react
 
-This log was last generated on Mon, 27 Jan 2025 18:30:40 GMT and should not be manually modified.
+This log was last generated on Thu, 15 May 2025 05:33:32 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## 3.8.0
+
+Thu, 15 May 2025 05:33:32 GMT
+
+### Minor changes
+
+- Fixed merged (categories and models) nodes visibility. Changed `@beta` APIs in a **breaking** way: `ModelsTreeVisibilityHandlerOverrides.getModelDisplayStatus` and `ModelsTreeVisibilityHandlerOverrides.getCategoryDisplayStatus` - `id` and `categoryId` props are now of `Id64Arg` type instead of `Id64String`. Use `Id64` from `@itwin/core-bentley` to access individual IDs. ([#1311](https://github.com/iTwin/viewer-components-react/pull/1311))
+
+### Patches
+
+- update presentation deps to versions that properly support core @ 5.0-rc ([#1304](https://github.com/iTwin/viewer-components-react/pull/1304))
+
+## 3.7.0
+
+Mon, 28 Apr 2025 16:18:43 GMT
+
+### Minor changes
+
+- Added ability to disabled hierarchy level filtering in `ModelsTree`. ([#1297](https://github.com/iTwin/viewer-components-react/pull/1297))
+
+## 3.6.1
+
+Fri, 18 Apr 2025 17:06:22 GMT
+
+### Patches
+
+- Fixed Categories tree not reacting to Category display changes from Models tree, when they're made on per-model category overrides. ([#1284](https://github.com/iTwin/viewer-components-react/pull/1284))
+- Fixed `ModelsTree` and `CategoriesTree` not applying custom hierarchy level size limit. ([#1292](https://github.com/iTwin/viewer-components-react/pull/1292))
+
+## 3.6.0
+
+Fri, 21 Mar 2025 11:37:20 GMT
+
+### Minor changes
+
+- Add ability to remove root Subject node from Models and iModel content trees by setting `hideRootSubject: true` in the `hierarchyConfig` prop. ([#1251](https://github.com/iTwin/viewer-components-react/pull/1251))
+
+### Patches
+
+- Fixed Models tree showing that modeled elements have children, when their sub model is private or when sub model does not have any elements. Now it shows that modeled element has children only when it's sub model has children and is not private. ([#1253](https://github.com/iTwin/viewer-components-react/pull/1253))
+- Fixed Categories tree showing definition containers that contain categories without elements. Now it displays definition containers only when they have categories that contain elements. ([#1248](https://github.com/iTwin/viewer-components-react/pull/1248))
+
+## 3.5.1
+
+Thu, 06 Mar 2025 12:37:44 GMT
+
+### Patches
+
+- Update import to use `@itwin/core-bentley` for types that are reexported by `@itwin/core-common` ([#1232](https://github.com/iTwin/viewer-components-react/pull/1232))
+
+## 3.5.0
+
+Wed, 19 Feb 2025 21:08:10 GMT
+
+### Minor changes
+
+- `CategoriesTree` component rendered `Categories` as a flat list, where each `Category` had zero or more child `SubCategories`. Some iTwin.js applications started to group `Categories` under `DefinitionContainers` and wanted to see them displayed in `CategoriesTree` component. Added `DefinitionContainers` to `CategoriesTree` component. This change doesn't affect applications that don't have `DefinitionContainers`. ([#1172](https://github.com/iTwin/viewer-components-react/pull/1172))
+
+## 3.4.2
+
+Fri, 14 Feb 2025 15:54:49 GMT
+
+### Patches
+
+- Adjusted modeled element / sub-model visibility controls. Now, if visibility of modeled element is changed, visibility of sub-model is adjusted accordingly and vice versa. ([#1183](https://github.com/iTwin/viewer-components-react/pull/1183))
+
+## 3.4.1
+
+Thu, 06 Feb 2025 13:36:20 GMT
+
+### Patches
+
+- Removed horizontal scroll from trees. ([#1180](https://github.com/iTwin/viewer-components-react/pull/1180))
+
+## 3.4.0
+
+Tue, 04 Feb 2025 15:29:52 GMT
+
+### Minor changes
+
+- Expose `FocusedInstancesContextProvider` and `useFocusedInstancesContext` to allow using `ModelsTreeComponent.ToggleInstancesFocusButton` from outside of `ModelsTreeComponent` and accesing the context from other React components. ([#1175](https://github.com/iTwin/viewer-components-react/pull/1175))
+- Add `filterButtonsVisibility` prop to `TreeRenderer`. The prop allows to control visibility of hierarchy level filtering buttons in the tree: `show-on-hover` (default) shows them on hover or focus, `hide` only shows them when a node is filtered. ([#1178](https://github.com/iTwin/viewer-components-react/pull/1178))
+
 ## 3.3.0
 
 Mon, 27 Jan 2025 18:30:40 GMT

package/README.md

@@ -144,6 +144,7 @@ This package provides building blocks for custom models tree:
 Example:
 
 ```tsx
+import { useCallback } from "react";
 import { TreeWithHeader, useModelsTree, useModelsTreeButtonProps, VisibilityTree, VisibilityTreeRenderer } from "@itwin/tree-widget-react";
 import type { SelectionStorage } from "@itwin/unified-selection";
 import type { IModelConnection, Viewport } from "@itwin/core-frontend";
@@ -161,7 +162,8 @@ function CustomModelsTreeRenderer(props: CustomModelsTreeRendererProps) {
     },
     [getLabel],
   );
-  return <VisibilityTreeRenderer {...props} getLabel={getLabelCallback} getSublabel={getSublabel} />;
+  const getSublabelCallback = useCallback<Required<VisibilityTreeRendererProps>["getSublabel"]>((node) => <>Sublabel - {node.label}</>, []);
+  return <VisibilityTreeRenderer {...props} getLabel={getLabelCallback} getSublabel={getSublabelCallback} />;
 }
 
 interface CustomModelsTreeProps {
@@ -291,11 +293,9 @@ function CustomCategoriesTreeRenderer(props: CustomCategoriesTreeRendererProps)
     },
     [getLabel],
   );
-
   const getSublabel = useCallback<Required<VisibilityTreeRendererProps>["getSublabel"]>(() => {
     return <>Custom sub label</>;
   }, []);
-
   return <VisibilityTreeRenderer {...props} getLabel={getLabelCallback} getSublabel={getSublabel} />;
 }
 
@@ -309,7 +309,6 @@ interface CustomCategoriesTreeProps {
 function CustomCategoriesTreeComponent({ imodel, viewport, getSchemaContext, selectionStorage }: CustomCategoriesTreeProps) {
   const { buttonProps } = useCategoriesTreeButtonProps({ viewport });
   const { categoriesTreeProps, rendererProps } = useCategoriesTree({ activeView: viewport, filter: "" });
-
   return (
     <TreeWithHeader
       buttons={[

package/lib/esm/tree-widget-react/TreeWidget.d.ts

@@ -1,24 +1,29 @@
 import type { Localization, TranslationOptions } from "@itwin/core-common";
+import type { ILogger } from "@itwin/presentation-shared";
 /**
  * Entry point for static initialization required by various components used in the package.
  * @public
  */
 export declare class TreeWidget {
     private static _i18n?;
+    private static _logger?;
     private static _initialized?;
     /**
      * Called by IModelApp to initialize the Tree Widget
      * @param i18n - The internationalization service created by the IModelApp.
+     * @param logger - The logger to use for logging messages. Defaults to `Logger` from `@itwin/core-bentley`.
      */
-    static initialize(i18n?: Localization): Promise<void>;
+    static initialize(i18n?: Localization, logger?: ILogger): Promise<void>;
     /** Unregisters the TreeWidget internationalization service namespace */
     static terminate(): void;
+    /** The logger used by this components in this package. */
+    static get logger(): ILogger;
     /** The internationalization service created by the IModelApp. */
     static get i18n(): Localization;
     /** The internationalization service namespace. */
     static get i18nNamespace(): string;
     /** Calls i18n.translateWithNamespace with the "TreeWidget" namespace. Do NOT include the namespace in the key.
      */
-    static translate(key: string | string[], options?: TranslationOptions): string;
+    static translate(key: string, options?: TranslationOptions): string;
 }
 //# sourceMappingURL=TreeWidget.d.ts.map

package/lib/esm/tree-widget-react/TreeWidget.js

@@ -2,22 +2,32 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import { BentleyError, BentleyStatus } from "@itwin/core-common";
+import { BentleyError, BentleyStatus, Logger } from "@itwin/core-bentley";
 import { IModelApp } from "@itwin/core-frontend";
+import { createLogger } from "@itwin/presentation-core-interop";
+import { setLogger as setHierarchiesLogger } from "@itwin/presentation-hierarchies";
+import { setLogger as setHierarchiesReactLogger } from "@itwin/presentation-hierarchies-react";
 /**
  * Entry point for static initialization required by various components used in the package.
  * @public
  */
 export class TreeWidget {
+    static _i18n;
+    static _logger;
+    static _initialized;
     /**
      * Called by IModelApp to initialize the Tree Widget
      * @param i18n - The internationalization service created by the IModelApp.
+     * @param logger - The logger to use for logging messages. Defaults to `Logger` from `@itwin/core-bentley`.
      */
-    static async initialize(i18n) {
+    static async initialize(i18n, logger) {
         if (this._initialized) {
             return;
         }
         TreeWidget._initialized = true;
+        TreeWidget._logger = logger ?? createLogger(Logger);
+        setHierarchiesLogger(TreeWidget._logger);
+        setHierarchiesReactLogger(TreeWidget._logger);
         TreeWidget._i18n = i18n ?? IModelApp.localization;
         return TreeWidget._i18n.registerNamespace(TreeWidget.i18nNamespace);
     }
@@ -27,8 +37,18 @@ export class TreeWidget {
             TreeWidget._i18n.unregisterNamespace(TreeWidget.i18nNamespace);
             TreeWidget._i18n = undefined;
         }
+        TreeWidget._logger = undefined;
+        setHierarchiesLogger(undefined);
+        setHierarchiesReactLogger(undefined);
         TreeWidget._initialized = false;
     }
+    /** The logger used by this components in this package. */
+    static get logger() {
+        if (!TreeWidget._logger) {
+            throw new BentleyError(BentleyStatus.ERROR, "TreeWidget not initialized");
+        }
+        return TreeWidget._logger;
+    }
     /** The internationalization service created by the IModelApp. */
     static get i18n() {
         if (!TreeWidget._i18n) {

package/lib/esm/tree-widget-react/TreeWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeWidget.js","sourceRoot":"","sources":["../../../src/tree-widget-react/TreeWidget.ts"],"names":[],"mappings":"AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAIjD;;;GAGG;AACH,MAAM,OAAO,UAAU;IAIrB;;;OAGG;IACI,MAAM,CAAC,KAAK,CAAC,UAAU,CAAC,IAAmB;QAChD,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,OAAO;SACR;QAED,UAAU,CAAC,YAAY,GAAG,IAAI,CAAC;QAC/B,UAAU,CAAC,KAAK,GAAG,IAAI,IAAI,SAAS,CAAC,YAAY,CAAC;QAClD,OAAO,UAAU,CAAC,KAAK,CAAC,iBAAiB,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IACtE,CAAC;IAED,wEAAwE;IACjE,MAAM,CAAC,SAAS;QACrB,IAAI,UAAU,CAAC,KAAK,EAAE;YACpB,UAAU,CAAC,KAAK,CAAC,mBAAmB,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;YAC/D,UAAU,CAAC,KAAK,GAAG,SAAS,CAAC;SAC9B;QAED,UAAU,CAAC,YAAY,GAAG,KAAK,CAAC;IAClC,CAAC;IAED,iEAAiE;IAC1D,MAAM,KAAK,IAAI;QACpB,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE;YACrB,MAAM,IAAI,YAAY,CAAC,aAAa,CAAC,KAAK,EAAE,4BAA4B,CAAC,CAAC;SAC3E;QACD,OAAO,UAAU,CAAC,KAAK,CAAC;IAC1B,CAAC;IAED,kDAAkD;IAC3C,MAAM,KAAK,aAAa;QAC7B,OAAO,YAAY,CAAC;IACtB,CAAC;IAED;OACG;IACI,MAAM,CAAC,SAAS,CAAC,GAAsB,EAAE,OAA4B;QAC1E,MAAM,SAAS,GAAG,GAAG,UAAU,CAAC,aAAa,IAAI,GAAG,EAAE,CAAC;QACvD,OAAO,UAAU,CAAC,IAAI,CAAC,kBAAkB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;IAChE,CAAC;CACF","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport { BentleyError, BentleyStatus } from \"@itwin/core-common\";\nimport { IModelApp } from \"@itwin/core-frontend\";\n\nimport type { Localization, TranslationOptions } from \"@itwin/core-common\";\n\n/**\n * Entry point for static initialization required by various components used in the package.\n * @public\n */\nexport class TreeWidget {\n  private static _i18n?: Localization;\n  private static _initialized?: boolean;\n\n  /**\n   * Called by IModelApp to initialize the Tree Widget\n   * @param i18n - The internationalization service created by the IModelApp.\n   */\n  public static async initialize(i18n?: Localization): Promise<void> {\n    if (this._initialized) {\n      return;\n    }\n\n    TreeWidget._initialized = true;\n    TreeWidget._i18n = i18n ?? IModelApp.localization;\n    return TreeWidget._i18n.registerNamespace(TreeWidget.i18nNamespace);\n  }\n\n  /** Unregisters the TreeWidget internationalization service namespace */\n  public static terminate() {\n    if (TreeWidget._i18n) {\n      TreeWidget._i18n.unregisterNamespace(TreeWidget.i18nNamespace);\n      TreeWidget._i18n = undefined;\n    }\n\n    TreeWidget._initialized = false;\n  }\n\n  /** The internationalization service created by the IModelApp. */\n  public static get i18n(): Localization {\n    if (!TreeWidget._i18n) {\n      throw new BentleyError(BentleyStatus.ERROR, \"TreeWidget not initialized\");\n    }\n    return TreeWidget._i18n;\n  }\n\n  /** The internationalization service namespace. */\n  public static get i18nNamespace(): string {\n    return \"TreeWidget\";\n  }\n\n  /** Calls i18n.translateWithNamespace with the \"TreeWidget\" namespace. Do NOT include the namespace in the key.\n   */\n  public static translate(key: string | string[], options?: TranslationOptions): string {\n    const stringKey = `${TreeWidget.i18nNamespace}:${key}`;\n    return TreeWidget.i18n.getLocalizedString(stringKey, options);\n  }\n}\n"]}
+{"version":3,"file":"TreeWidget.js","sourceRoot":"","sources":["../../../src/tree-widget-react/TreeWidget.ts"],"names":[],"mappings":"AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC1E,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,SAAS,IAAI,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACpF,OAAO,EAAE,SAAS,IAAI,yBAAyB,EAAE,MAAM,uCAAuC,CAAC;AAK/F;;;GAGG;AACH,MAAM,OAAO,UAAU;IACb,MAAM,CAAC,KAAK,CAAgB;IAC5B,MAAM,CAAC,OAAO,CAAW;IACzB,MAAM,CAAC,YAAY,CAAW;IAEtC;;;;OAIG;IACI,MAAM,CAAC,KAAK,CAAC,UAAU,CAAC,IAAmB,EAAE,MAAgB;QAClE,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,OAAO;QACT,CAAC;QAED,UAAU,CAAC,YAAY,GAAG,IAAI,CAAC;QAE/B,UAAU,CAAC,OAAO,GAAG,MAAM,IAAI,YAAY,CAAC,MAAM,CAAC,CAAC;QACpD,oBAAoB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QACzC,yBAAyB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QAE9C,UAAU,CAAC,KAAK,GAAG,IAAI,IAAI,SAAS,CAAC,YAAY,CAAC;QAClD,OAAO,UAAU,CAAC,KAAK,CAAC,iBAAiB,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IACtE,CAAC;IAED,wEAAwE;IACjE,MAAM,CAAC,SAAS;QACrB,IAAI,UAAU,CAAC,KAAK,EAAE,CAAC;YACrB,UAAU,CAAC,KAAK,CAAC,mBAAmB,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;YAC/D,UAAU,CAAC,KAAK,GAAG,SAAS,CAAC;QAC/B,CAAC;QAED,UAAU,CAAC,OAAO,GAAG,SAAS,CAAC;QAC/B,oBAAoB,CAAC,SAAS,CAAC,CAAC;QAChC,yBAAyB,CAAC,SAAS,CAAC,CAAC;QAErC,UAAU,CAAC,YAAY,GAAG,KAAK,CAAC;IAClC,CAAC;IAED,0DAA0D;IACnD,MAAM,KAAK,MAAM;QACtB,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;YACxB,MAAM,IAAI,YAAY,CAAC,aAAa,CAAC,KAAK,EAAE,4BAA4B,CAAC,CAAC;QAC5E,CAAC;QACD,OAAO,UAAU,CAAC,OAAO,CAAC;IAC5B,CAAC;IAED,iEAAiE;IAC1D,MAAM,KAAK,IAAI;QACpB,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;YACtB,MAAM,IAAI,YAAY,CAAC,aAAa,CAAC,KAAK,EAAE,4BAA4B,CAAC,CAAC;QAC5E,CAAC;QACD,OAAO,UAAU,CAAC,KAAK,CAAC;IAC1B,CAAC;IAED,kDAAkD;IAC3C,MAAM,KAAK,aAAa;QAC7B,OAAO,YAAY,CAAC;IACtB,CAAC;IAED;OACG;IACI,MAAM,CAAC,SAAS,CAAC,GAAW,EAAE,OAA4B;QAC/D,MAAM,SAAS,GAAG,GAAG,UAAU,CAAC,aAAa,IAAI,GAAG,EAAE,CAAC;QACvD,OAAO,UAAU,CAAC,IAAI,CAAC,kBAAkB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;IAChE,CAAC;CACF","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport { BentleyError, BentleyStatus, Logger } from \"@itwin/core-bentley\";\nimport { IModelApp } from \"@itwin/core-frontend\";\nimport { createLogger } from \"@itwin/presentation-core-interop\";\nimport { setLogger as setHierarchiesLogger } from \"@itwin/presentation-hierarchies\";\nimport { setLogger as setHierarchiesReactLogger } from \"@itwin/presentation-hierarchies-react\";\n\nimport type { Localization, TranslationOptions } from \"@itwin/core-common\";\nimport type { ILogger } from \"@itwin/presentation-shared\";\n\n/**\n * Entry point for static initialization required by various components used in the package.\n * @public\n */\nexport class TreeWidget {\n  private static _i18n?: Localization;\n  private static _logger?: ILogger;\n  private static _initialized?: boolean;\n\n  /**\n   * Called by IModelApp to initialize the Tree Widget\n   * @param i18n - The internationalization service created by the IModelApp.\n   * @param logger - The logger to use for logging messages. Defaults to `Logger` from `@itwin/core-bentley`.\n   */\n  public static async initialize(i18n?: Localization, logger?: ILogger): Promise<void> {\n    if (this._initialized) {\n      return;\n    }\n\n    TreeWidget._initialized = true;\n\n    TreeWidget._logger = logger ?? createLogger(Logger);\n    setHierarchiesLogger(TreeWidget._logger);\n    setHierarchiesReactLogger(TreeWidget._logger);\n\n    TreeWidget._i18n = i18n ?? IModelApp.localization;\n    return TreeWidget._i18n.registerNamespace(TreeWidget.i18nNamespace);\n  }\n\n  /** Unregisters the TreeWidget internationalization service namespace */\n  public static terminate() {\n    if (TreeWidget._i18n) {\n      TreeWidget._i18n.unregisterNamespace(TreeWidget.i18nNamespace);\n      TreeWidget._i18n = undefined;\n    }\n\n    TreeWidget._logger = undefined;\n    setHierarchiesLogger(undefined);\n    setHierarchiesReactLogger(undefined);\n\n    TreeWidget._initialized = false;\n  }\n\n  /** The logger used by this components in this package. */\n  public static get logger(): ILogger {\n    if (!TreeWidget._logger) {\n      throw new BentleyError(BentleyStatus.ERROR, \"TreeWidget not initialized\");\n    }\n    return TreeWidget._logger;\n  }\n\n  /** The internationalization service created by the IModelApp. */\n  public static get i18n(): Localization {\n    if (!TreeWidget._i18n) {\n      throw new BentleyError(BentleyStatus.ERROR, \"TreeWidget not initialized\");\n    }\n    return TreeWidget._i18n;\n  }\n\n  /** The internationalization service namespace. */\n  public static get i18nNamespace(): string {\n    return \"TreeWidget\";\n  }\n\n  /** Calls i18n.translateWithNamespace with the \"TreeWidget\" namespace. Do NOT include the namespace in the key.\n   */\n  public static translate(key: string, options?: TranslationOptions): string {\n    const stringKey = `${TreeWidget.i18nNamespace}:${key}`;\n    return TreeWidget.i18n.getLocalizedString(stringKey, options);\n  }\n}\n"]}

package/lib/esm/tree-widget-react/components/{SelectableTree.scss → TreeWidgetComponentImpl.css}

@@ -4,7 +4,6 @@
 *--------------------------------------------------------------------------------------------*/
 
 .tree-widget-selectable-tree {
-  padding: var(--iui-size-xs);
   width: 100%;
   height: 100%;
   box-sizing: border-box;

package/lib/esm/tree-widget-react/components/{SelectableTree.d.ts → TreeWidgetComponentImpl.d.ts}

@@ -1,12 +1,11 @@
-/// <reference types="react" />
-import "./SelectableTree.scss";
+import "./TreeWidgetComponentImpl.css";
 import type { IModelConnection } from "@itwin/core-frontend";
 /**
  * Props for rendering trees
  * @public
  */
-export interface SelectableTreeRenderProps {
-    density?: "enlarged" | "default";
+export interface TreeRenderProps {
+    filter?: string;
     onPerformanceMeasured?: (featureId: string, elapsedTime: number) => void;
     onFeatureUsed?: (feature: string) => void;
 }
@@ -14,34 +13,39 @@ export interface SelectableTreeRenderProps {
  * Definition of a tree component displayed in `SelectableTree`.
  * @public
  */
-export interface SelectableTreeDefinition {
+export interface TreeDefinition {
     /** Id of the tree */
     id: string;
     /** Callback that is used to get tree label */
     getLabel: () => string;
     /** Callback that is used to render tree component */
-    render: (props: SelectableTreeRenderProps) => React.ReactNode;
+    render: (props: TreeRenderProps) => React.ReactNode;
     /**
      * Callback that is used to determine if tree should be shown for current active iModel connection.
      * If callback is `undefined` tree is shown for all iModel connections.
      */
     shouldShow?: (imodel: IModelConnection) => Promise<boolean>;
+    /**
+     *  Flag to determine if search box should be rendered.
+     *  - false or undefined, the search box will not be rendered.
+     *  - true, the search box will be rendered.
+     */
+    isSearchable?: boolean;
     /** Icon to render before tree label in tree selector */
     startIcon?: React.ReactNode;
 }
 /**
- * Props for `SelectableTree`
- * @public
+ * Props for `TreeWidgetComponent`
+ * @internal
  */
-export interface SelectableTreeProps {
-    trees: SelectableTreeDefinition[];
-    density?: "enlarged" | "default";
+export interface TreeWidgetComponentImplProps {
+    trees: TreeDefinition[];
     onPerformanceMeasured?: (feature: string, elapsedTime: number) => void;
     onFeatureUsed?: (feature: string) => void;
 }
 /**
  * A component that renders a tree (combo box) selector and the selected tree component.
- * @public
+ * @internal
  */
-export declare function SelectableTree(props: SelectableTreeProps): import("react/jsx-runtime").JSX.Element | null;
-//# sourceMappingURL=SelectableTree.d.ts.map
+export declare function TreeWidgetComponentImpl(props: TreeWidgetComponentImplProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=TreeWidgetComponentImpl.d.ts.map

package/lib/esm/tree-widget-react/components/{SelectableTree.js → TreeWidgetComponentImpl.js}

@@ -1,29 +1,38 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 /*---------------------------------------------------------------------------------------------
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import "./SelectableTree.scss";
-import { useEffect, useState } from "react";
+import "./TreeWidgetComponentImpl.css";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { useActiveIModelConnection } from "@itwin/appui-react";
-import { Spinner } from "@itwin/itwinui-react/bricks";
+import { Skeleton } from "@stratakit/bricks";
 import { TreeWidget } from "../TreeWidget.js";
-import { TreeSelector } from "./TreeSelector.js";
+import { SelectableTree } from "./tree-header/SelectableTree.js";
+import { WidgetHeader } from "./tree-header/WidgetHeader.js";
+import { SkeletonTree } from "./trees/common/components/SkeletonTree.js";
 /**
  * A component that renders a tree (combo box) selector and the selected tree component.
- * @public
+ * @internal
  */
-export function SelectableTree(props) {
+export function TreeWidgetComponentImpl(props) {
     const imodel = useActiveIModelConnection();
     if (!imodel) {
         return null;
     }
     return _jsx(SelectableTreeContent, { ...props, imodel: imodel });
 }
-function SelectableTreeContent(props) {
-    const { trees: treeDefinitions, imodel } = props;
-    const trees = useActiveTrees(treeDefinitions, imodel);
-    return (_jsx("div", { className: "tree-widget-selectable-tree", children: _jsx(TreeSelector, { ...getTreeSelectorProps(trees), onPerformanceMeasured: props.onPerformanceMeasured, onFeatureUsed: props.onFeatureUsed }) }));
+function SelectableTreeContent({ onPerformanceMeasured, onFeatureUsed, trees: treeDefinitions, imodel, }) {
+    const activeTrees = useActiveTrees(treeDefinitions, imodel);
+    const { trees, defaultSelectedContentId } = useMemo(() => getWidgetWithHeaderProps(activeTrees), [activeTrees]);
+    const [searchValue, setSearchValue] = useState(undefined);
+    const [selectedContentId, setSelectedContentId] = useState(defaultSelectedContentId);
+    const selectedContent = useMemo(() => trees.find((c) => c.id === selectedContentId) ?? trees[0], [selectedContentId, trees]);
+    const onSelect = useCallback((treeId) => {
+        onFeatureUsed?.(`choose-${treeId}`);
+        setSelectedContentId(treeId);
+    }, [onFeatureUsed]);
+    return (_jsx("div", { className: "tree-widget-selectable-tree", children: _jsxs("div", { className: "tw-content", children: [_jsx(WidgetHeader, { trees: trees, defaultSelectedContentId: defaultSelectedContentId, onSearch: setSearchValue, onSelect: onSelect, isLoading: selectedContent.id === "loading" }), _jsx("div", { className: "tw-content-wrapper", children: selectedContent?.render({ onPerformanceMeasured, onFeatureUsed, filter: searchValue }) })] }) }));
 }
 function useActiveTrees(treeDefinitions, imodel) {
     const [trees, setTrees] = useState();
@@ -48,6 +57,7 @@ async function getActiveTrees(treeDefinitions, imodel) {
         }
         return {
             id: treeDef.id,
+            isSearchable: treeDef.isSearchable,
             label: treeDef.getLabel(),
             render: treeDef.render,
             startIcon: treeDef.startIcon,
@@ -55,7 +65,7 @@ async function getActiveTrees(treeDefinitions, imodel) {
     };
     return (await Promise.all(treeDefinitions.map(handleDefinition))).filter((tree) => tree !== undefined);
 }
-function getTreeSelectorProps(trees) {
+function getWidgetWithHeaderProps(trees) {
     if (trees === undefined) {
         return {
             defaultSelectedContentId: "loading",
@@ -63,7 +73,8 @@ function getTreeSelectorProps(trees) {
                 {
                     id: "loading",
                     label: "",
-                    render: () => (_jsx(Delayed, { children: _jsx(Spinner, {}) })),
+                    isSearchable: false,
+                    render: () => _jsx(LoadingTree, {}),
                 },
             ],
         };
@@ -74,6 +85,7 @@ function getTreeSelectorProps(trees) {
             trees: [
                 {
                     id: "no-trees",
+                    isSearchable: false,
                     label: "",
                     render: () => (_jsx("div", { style: { display: "flex", justifyContent: "center", alignItems: "center" }, className: "tree-widget-no-trees-container", children: TreeWidget.translate("selectableTree.noTrees") })),
                 },
@@ -85,19 +97,7 @@ function getTreeSelectorProps(trees) {
         trees,
     };
 }
-function Delayed({ delay = 200, children }) {
-    const [show, setShow] = useState(false);
-    useEffect(() => {
-        const id = setTimeout(() => {
-            setShow(true);
-        }, delay);
-        return () => {
-            clearTimeout(id);
-        };
-    }, [delay]);
-    if (!show) {
-        return null;
-    }
-    return _jsx(_Fragment, { children: children });
+function LoadingTree() {
+    return (_jsx(SelectableTree, { buttons: _jsxs(_Fragment, { children: [_jsx(Skeleton, { variant: "object", size: "medium" }), _jsx(Skeleton, { variant: "object", size: "medium" }), _jsx(Skeleton, { variant: "object", size: "medium" }), _jsx(Skeleton, { variant: "object", size: "medium" }), _jsx(Skeleton, { variant: "object", size: "medium" }), _jsx(Skeleton, { variant: "object", size: "medium" })] }), children: _jsx(SkeletonTree, {}) }));
 }
-//# sourceMappingURL=SelectableTree.js.map
+//# sourceMappingURL=TreeWidgetComponentImpl.js.map

package/lib/esm/tree-widget-react/components/TreeWidgetComponentImpl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeWidgetComponentImpl.js","sourceRoot":"","sources":["../../../../src/tree-widget-react/components/TreeWidgetComponentImpl.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport \"./TreeWidgetComponentImpl.css\";\nimport { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { Skeleton } from \"@stratakit/bricks\";\nimport { TreeWidget } from \"../TreeWidget.js\";\nimport { SelectableTree } from \"./tree-header/SelectableTree.js\";\nimport { WidgetHeader } from \"./tree-header/WidgetHeader.js\";\nimport { SkeletonTree } from \"./trees/common/components/SkeletonTree.js\";\n\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport type { TreeContentDefinition, TreeSelectionProps } from \"./tree-header/WidgetHeader.js\";\n/**\n * Props for rendering trees\n * @public\n */\nexport interface TreeRenderProps {\n  filter?: string;\n  onPerformanceMeasured?: (featureId: string, elapsedTime: number) => void;\n  onFeatureUsed?: (feature: string) => void;\n}\n\n// TODO: fix interface so startIcon type is taken from this interface for `TreeSelector`\n/**\n * Definition of a tree component displayed in `SelectableTree`.\n * @public\n */\nexport interface TreeDefinition {\n  /** Id of the tree */\n  id: string;\n  /** Callback that is used to get tree label */\n  getLabel: () => string;\n  /** Callback that is used to render tree component */\n  render: (props: TreeRenderProps) => React.ReactNode;\n  /**\n   * Callback that is used to determine if tree should be shown for current active iModel connection.\n   * If callback is `undefined` tree is shown for all iModel connections.\n   */\n  shouldShow?: (imodel: IModelConnection) => Promise<boolean>;\n  /**\n   *  Flag to determine if search box should be rendered.\n   *  - false or undefined, the search box will not be rendered.\n   *  - true, the search box will be rendered.\n   */\n  isSearchable?: boolean;\n  /** Icon to render before tree label in tree selector */\n  startIcon?: React.ReactNode;\n}\n\n/**\n * Props for `TreeWidgetComponent`\n * @internal\n */\nexport interface TreeWidgetComponentImplProps {\n  trees: TreeDefinition[];\n  onPerformanceMeasured?: (feature: string, elapsedTime: number) => void;\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/**\n * A component that renders a tree (combo box) selector and the selected tree component.\n * @internal\n */\nexport function TreeWidgetComponentImpl(props: TreeWidgetComponentImplProps) {\n  const imodel = useActiveIModelConnection();\n  if (!imodel) {\n    return null;\n  }\n  return <SelectableTreeContent {...props} imodel={imodel} />;\n}\n\nfunction SelectableTreeContent({\n  onPerformanceMeasured,\n  onFeatureUsed,\n  trees: treeDefinitions,\n  imodel,\n}: TreeWidgetComponentImplProps & { imodel: IModelConnection }) {\n  const activeTrees = useActiveTrees(treeDefinitions, imodel);\n  const { trees, defaultSelectedContentId } = useMemo(() => getWidgetWithHeaderProps(activeTrees), [activeTrees]);\n  const [searchValue, setSearchValue] = useState<string | undefined>(undefined);\n  const [selectedContentId, setSelectedContentId] = useState<string | undefined>(defaultSelectedContentId);\n  const selectedContent = useMemo(() => trees.find((c) => c.id === selectedContentId) ?? trees[0], [selectedContentId, trees]);\n\n  const onSelect = useCallback(\n    (treeId: string) => {\n      onFeatureUsed?.(`choose-${treeId}`);\n      setSelectedContentId(treeId);\n    },\n    [onFeatureUsed],\n  );\n\n  return (\n    <div className=\"tree-widget-selectable-tree\">\n      <div className=\"tw-content\">\n        <WidgetHeader\n          trees={trees}\n          defaultSelectedContentId={defaultSelectedContentId}\n          onSearch={setSearchValue}\n          onSelect={onSelect}\n          isLoading={selectedContent.id === \"loading\"}\n        />\n        <div className=\"tw-content-wrapper\">{selectedContent?.render({ onPerformanceMeasured, onFeatureUsed, filter: searchValue })}</div>\n      </div>\n    </div>\n  );\n}\n\nfunction useActiveTrees(treeDefinitions: TreeDefinition[], imodel: IModelConnection) {\n  const [trees, setTrees] = useState<TreeContentDefinition[]>();\n\n  useEffect(() => {\n    let disposed = false;\n    void (async () => {\n      const visibleTrees = await getActiveTrees(treeDefinitions, imodel);\n      if (!disposed) {\n        setTrees(visibleTrees);\n      }\n    })();\n\n    return () => {\n      disposed = true;\n    };\n  }, [treeDefinitions, imodel]);\n\n  return trees;\n}\n\nasync function getActiveTrees(treeDefinitions: TreeDefinition[], imodel: IModelConnection): Promise<TreeContentDefinition[]> {\n  const handleDefinition = async (treeDef: TreeDefinition) => {\n    if (treeDef.shouldShow !== undefined && !(await treeDef.shouldShow(imodel))) {\n      return undefined;\n    }\n    return {\n      id: treeDef.id,\n      isSearchable: treeDef.isSearchable,\n      label: treeDef.getLabel(),\n      render: treeDef.render,\n      startIcon: treeDef.startIcon,\n    };\n  };\n\n  return (await Promise.all(treeDefinitions.map(handleDefinition))).filter((tree) => tree !== undefined) as TreeContentDefinition[];\n}\n\nfunction getWidgetWithHeaderProps(trees?: TreeContentDefinition[]): TreeSelectionProps {\n  if (trees === undefined) {\n    return {\n      defaultSelectedContentId: \"loading\",\n      trees: [\n        {\n          id: \"loading\",\n          label: \"\",\n          isSearchable: false,\n          render: () => <LoadingTree />,\n        },\n      ],\n    };\n  }\n\n  if (trees.length === 0) {\n    return {\n      defaultSelectedContentId: \"no-trees\",\n      trees: [\n        {\n          id: \"no-trees\",\n          isSearchable: false,\n          label: \"\",\n          render: () => (\n            <div style={{ display: \"flex\", justifyContent: \"center\", alignItems: \"center\" }} className=\"tree-widget-no-trees-container\">\n              {TreeWidget.translate(\"selectableTree.noTrees\")}\n            </div>\n          ),\n        },\n      ],\n    };\n  }\n\n  return {\n    defaultSelectedContentId: trees[0].id,\n    trees,\n  };\n}\n\nfunction LoadingTree() {\n  return (\n    <SelectableTree\n      buttons={\n        <>\n          <Skeleton variant={\"object\"} size={\"medium\"} />\n          <Skeleton variant={\"object\"} size={\"medium\"} />\n          <Skeleton variant={\"object\"} size={\"medium\"} />\n          <Skeleton variant={\"object\"} size={\"medium\"} />\n          <Skeleton variant={\"object\"} size={\"medium\"} />\n          <Skeleton variant={\"object\"} size={\"medium\"} />\n        </>\n      }\n    >\n      <SkeletonTree />\n    </SelectableTree>\n  );\n}\n"]}

package/lib/esm/tree-widget-react/components/TreeWidgetUiItemsProvider.d.ts

@@ -1,6 +1,6 @@
-import "./TreeWidgetUiItemsProvider.scss";
+import "./TreeWidgetUiItemsProvider.css";
 import type { Widget } from "@itwin/appui-react";
-import type { SelectableTreeDefinition, SelectableTreeProps } from "./SelectableTree.js";
+import type { TreeDefinition } from "./TreeWidgetComponentImpl.js";
 /**
  * Props for `createWidget`.
  * @public
@@ -13,9 +13,7 @@ interface TreeWidgetProps {
      * @see ExternalSourcesTreeComponent
      * @see IModelContentTreeComponent
      */
-    trees: SelectableTreeDefinition[];
-    /** Modifies the density of the tree widget. `enlarged` widget contains larger content */
-    density?: "enlarged" | "default";
+    trees: TreeDefinition[];
     /** Callback that is invoked when performance of tracked feature is measured. */
     onPerformanceMeasured?: (feature: string, elapsedTime: number) => void;
     /** Callback that is invoked when a tracked feature is used. */
@@ -30,6 +28,6 @@ export declare function createTreeWidget(props: TreeWidgetProps): Widget;
  * Tree widget component which allows selecting which tree to render.
  * @public
  */
-export declare function TreeWidgetComponent(props: SelectableTreeProps): import("react/jsx-runtime").JSX.Element;
+export declare function TreeWidgetComponent(props: TreeWidgetProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=TreeWidgetUiItemsProvider.d.ts.map

package/lib/esm/tree-widget-react/components/TreeWidgetUiItemsProvider.js

@@ -1,15 +1,17 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 /*---------------------------------------------------------------------------------------------
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import "./TreeWidgetUiItemsProvider.scss";
+import "./TreeWidgetUiItemsProvider.css";
 import { useRef } from "react";
 import { ErrorBoundary } from "react-error-boundary";
 import { StagePanelLocation, StagePanelSection, useTransientState } from "@itwin/appui-react";
-import { SvgHierarchyTree } from "@itwin/itwinui-icons-react";
+import { Icon } from "@stratakit/foundations";
+import hierarchyTreeSvg from "@stratakit/icons/hierarchy-tree.svg";
 import { TreeWidget } from "../TreeWidget.js";
-import { SelectableTree } from "./SelectableTree.js";
+import { ErrorState } from "./tree-header/ErrorState.js";
+import { TreeWidgetComponentImpl } from "./TreeWidgetComponentImpl.js";
 /**
  * Creates a tree widget definition that should be returned from `UiItemsProvider.getWidgets()`.
  * @public
@@ -18,14 +20,14 @@ export function createTreeWidget(props) {
     return {
         id: "tree-widget-react:trees",
         label: TreeWidget.translate("widget.label"),
-        icon: _jsx(SvgHierarchyTree, {}),
+        icon: _jsx(Icon, { href: hierarchyTreeSvg }),
         layouts: {
             standard: {
                 section: StagePanelSection.Start,
                 location: StagePanelLocation.Right,
             },
         },
-        content: (_jsx(TreeWidgetComponent, { trees: props.trees, density: props.density, onPerformanceMeasured: props.onPerformanceMeasured, onFeatureUsed: props.onFeatureUsed })),
+        content: _jsx(TreeWidgetComponent, { trees: props.trees, onPerformanceMeasured: props.onPerformanceMeasured, onFeatureUsed: props.onFeatureUsed }),
     };
 }
 /**
@@ -34,10 +36,7 @@ export function createTreeWidget(props) {
  */
 export function TreeWidgetComponent(props) {
     const ref = useTreeWidgetTransientState();
-    return (_jsx("div", { ref: ref, className: "tree-widget", children: _jsx(ErrorBoundary, { FallbackComponent: ErrorState, children: _jsx(SelectableTree, { ...props }) }) }));
-}
-function ErrorState({}) {
-    return _jsx(_Fragment, { children: " ERROR WINDOW TBD " });
+    return (_jsx("div", { ref: ref, className: "tree-widget", children: _jsx(ErrorBoundary, { FallbackComponent: ErrorState, children: _jsx(TreeWidgetComponentImpl, { ...props }) }) }));
 }
 function useTreeWidgetTransientState() {
     const { ref, persist, restore } = useTreeStorage();

package/lib/esm/tree-widget-react/components/TreeWidgetUiItemsProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeWidgetUiItemsProvider.js","sourceRoot":"","sources":["../../../../src/tree-widget-react/components/TreeWidgetUiItemsProvider.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,kCAAkC,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAC9F,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AA4BrD;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAAsB;IACrD,OAAO;QACL,EAAE,EAAE,yBAAyB;QAC7B,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,cAAc,CAAC;QAC3C,IAAI,EAAE,KAAC,gBAAgB,KAAG;QAC1B,OAAO,EAAE;YACP,QAAQ,EAAE;gBACR,OAAO,EAAE,iBAAiB,CAAC,KAAK;gBAChC,QAAQ,EAAE,kBAAkB,CAAC,KAAK;aACnC;SACF;QACD,OAAO,EAAE,CACP,KAAC,mBAAmB,IAClB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,qBAAqB,EAAE,KAAK,CAAC,qBAAqB,EAClD,aAAa,EAAE,KAAK,CAAC,aAAa,GAClC,CACH;KACF,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,mBAAmB,CAAC,KAA0B;IAC5D,MAAM,GAAG,GAAG,2BAA2B,EAAE,CAAC;IAC1C,OAAO,CACL,cAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAC,aAAa,YACpC,KAAC,aAAa,IAAC,iBAAiB,EAAE,UAAU,YAC1C,KAAC,cAAc,OAAK,KAAK,GAAI,GACf,GACZ,CACP,CAAC;AACJ,CAAC;AAED,SAAS,UAAU,CAAC,EAAiB;IACnC,OAAO,mDAAuB,CAAC;AACjC,CAAC;AAED,SAAS,2BAA2B;IAClC,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,cAAc,EAAE,CAAC;IACnD,iBAAiB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACpC,OAAO,GAAG,CAAC;AACb,CAAC;AAQD,SAAS,cAAc;IACrB,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,SAAS,GAAG,MAAM,EAAsB,CAAC;IAE/C,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,OAAO,GAAG,CAAC,OAAO,EAAE,aAAa,CAAC,6BAA6B,CAAC,CAAC;IACnE,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;QACjC,SAAS,CAAC,OAAO,GAAG,SAAS,EAAE,SAAS,CAAC;IAC3C,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,UAAU,CAAC,GAAG,EAAE;YACd,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;YACjC,IAAI,SAAS,IAAI,SAAS,CAAC,OAAO,EAAE;gBAClC,SAAS,CAAC,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC;aACzC;QACH,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC;AACnC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport \"./TreeWidgetUiItemsProvider.scss\";\nimport { useRef } from \"react\";\nimport { ErrorBoundary } from \"react-error-boundary\";\nimport { StagePanelLocation, StagePanelSection, useTransientState } from \"@itwin/appui-react\";\nimport { SvgHierarchyTree } from \"@itwin/itwinui-icons-react\";\nimport { TreeWidget } from \"../TreeWidget.js\";\nimport { SelectableTree } from \"./SelectableTree.js\";\n\nimport type { Widget } from \"@itwin/appui-react\";\nimport type { SelectableTreeDefinition, SelectableTreeProps } from \"./SelectableTree.js\";\nimport type { FallbackProps } from \"react-error-boundary\";\nimport type { Ref } from \"react\";\n\n/**\n * Props for `createWidget`.\n * @public\n */\ninterface TreeWidgetProps {\n  /**\n   * Trees to show in the widget.\n   * @see ModelsTreeComponent\n   * @see CategoriesTreeComponent\n   * @see ExternalSourcesTreeComponent\n   * @see IModelContentTreeComponent\n   */\n  trees: SelectableTreeDefinition[];\n  /** Modifies the density of the tree widget. `enlarged` widget contains larger content */\n  density?: \"enlarged\" | \"default\";\n  /** Callback that is invoked when performance of tracked feature is measured. */\n  onPerformanceMeasured?: (feature: string, elapsedTime: number) => void;\n  /** Callback that is invoked when a tracked feature is used. */\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/**\n * Creates a tree widget definition that should be returned from `UiItemsProvider.getWidgets()`.\n * @public\n */\nexport function createTreeWidget(props: TreeWidgetProps): Widget {\n  return {\n    id: \"tree-widget-react:trees\",\n    label: TreeWidget.translate(\"widget.label\"),\n    icon: <SvgHierarchyTree />,\n    layouts: {\n      standard: {\n        section: StagePanelSection.Start,\n        location: StagePanelLocation.Right,\n      },\n    },\n    content: (\n      <TreeWidgetComponent\n        trees={props.trees}\n        density={props.density}\n        onPerformanceMeasured={props.onPerformanceMeasured}\n        onFeatureUsed={props.onFeatureUsed}\n      />\n    ),\n  };\n}\n\n/**\n * Tree widget component which allows selecting which tree to render.\n * @public\n */\nexport function TreeWidgetComponent(props: SelectableTreeProps) {\n  const ref = useTreeWidgetTransientState();\n  return (\n    <div ref={ref} className=\"tree-widget\">\n      <ErrorBoundary FallbackComponent={ErrorState}>\n        <SelectableTree {...props} />\n      </ErrorBoundary>\n    </div>\n  );\n}\n\nfunction ErrorState({}: FallbackProps) {\n  return <> ERROR WINDOW TBD </>;\n}\n\nfunction useTreeWidgetTransientState() {\n  const { ref, persist, restore } = useTreeStorage();\n  useTransientState(persist, restore);\n  return ref;\n}\n\ninterface UseTreeStorageResult {\n  ref: Ref<HTMLDivElement>;\n  persist: () => void;\n  restore: () => void;\n}\n\nfunction useTreeStorage(): UseTreeStorageResult {\n  const ref = useRef<HTMLDivElement>(null);\n  const scrollTop = useRef<number | undefined>();\n\n  const getContainer = () => {\n    return ref.current?.querySelector(\"#tw-tree-renderer-container\");\n  };\n\n  const persist = () => {\n    const container = getContainer();\n    scrollTop.current = container?.scrollTop;\n  };\n\n  const restore = () => {\n    setTimeout(() => {\n      const container = getContainer();\n      if (container && scrollTop.current) {\n        container.scrollTop = scrollTop.current;\n      }\n    });\n  };\n\n  return { ref, persist, restore };\n}\n"]}
+{"version":3,"file":"TreeWidgetUiItemsProvider.js","sourceRoot":"","sources":["../../../../src/tree-widget-react/components/TreeWidgetUiItemsProvider.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,iCAAiC,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAC9F,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,gBAAgB,MAAM,qCAAqC,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AACzD,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AAyBvE;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAAsB;IACrD,OAAO;QACL,EAAE,EAAE,yBAAyB;QAC7B,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,cAAc,CAAC;QAC3C,IAAI,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,gBAAgB,GAAI;QACtC,OAAO,EAAE;YACP,QAAQ,EAAE;gBACR,OAAO,EAAE,iBAAiB,CAAC,KAAK;gBAChC,QAAQ,EAAE,kBAAkB,CAAC,KAAK;aACnC;SACF;QACD,OAAO,EAAE,KAAC,mBAAmB,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,qBAAqB,EAAE,KAAK,CAAC,qBAAqB,EAAE,aAAa,EAAE,KAAK,CAAC,aAAa,GAAI;KAC7I,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,mBAAmB,CAAC,KAAsB;IACxD,MAAM,GAAG,GAAG,2BAA2B,EAAE,CAAC;IAC1C,OAAO,CACL,cAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAC,aAAa,YACpC,KAAC,aAAa,IAAC,iBAAiB,EAAE,UAAU,YAC1C,KAAC,uBAAuB,OAAK,KAAK,GAAI,GACxB,GACZ,CACP,CAAC;AACJ,CAAC;AAED,SAAS,2BAA2B;IAClC,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,cAAc,EAAE,CAAC;IACnD,iBAAiB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACpC,OAAO,GAAG,CAAC;AACb,CAAC;AAQD,SAAS,cAAc;IACrB,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,SAAS,GAAG,MAAM,EAAsB,CAAC;IAE/C,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,OAAO,GAAG,CAAC,OAAO,EAAE,aAAa,CAAC,6BAA6B,CAAC,CAAC;IACnE,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;QACjC,SAAS,CAAC,OAAO,GAAG,SAAS,EAAE,SAAS,CAAC;IAC3C,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,UAAU,CAAC,GAAG,EAAE;YACd,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;YACjC,IAAI,SAAS,IAAI,SAAS,CAAC,OAAO,EAAE,CAAC;gBACnC,SAAS,CAAC,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC;YAC1C,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC;AACnC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport \"./TreeWidgetUiItemsProvider.css\";\nimport { useRef } from \"react\";\nimport { ErrorBoundary } from \"react-error-boundary\";\nimport { StagePanelLocation, StagePanelSection, useTransientState } from \"@itwin/appui-react\";\nimport { Icon } from \"@stratakit/foundations\";\nimport hierarchyTreeSvg from \"@stratakit/icons/hierarchy-tree.svg\";\nimport { TreeWidget } from \"../TreeWidget.js\";\nimport { ErrorState } from \"./tree-header/ErrorState.js\";\nimport { TreeWidgetComponentImpl } from \"./TreeWidgetComponentImpl.js\";\n\nimport type { Ref } from \"react\";\nimport type { Widget } from \"@itwin/appui-react\";\nimport type { TreeDefinition } from \"./TreeWidgetComponentImpl.js\";\n/**\n * Props for `createWidget`.\n * @public\n */\ninterface TreeWidgetProps {\n  /**\n   * Trees to show in the widget.\n   * @see ModelsTreeComponent\n   * @see CategoriesTreeComponent\n   * @see ExternalSourcesTreeComponent\n   * @see IModelContentTreeComponent\n   */\n  trees: TreeDefinition[];\n  /** Callback that is invoked when performance of tracked feature is measured. */\n  onPerformanceMeasured?: (feature: string, elapsedTime: number) => void;\n  /** Callback that is invoked when a tracked feature is used. */\n  onFeatureUsed?: (feature: string) => void;\n}\n\n\n/**\n * Creates a tree widget definition that should be returned from `UiItemsProvider.getWidgets()`.\n * @public\n */\nexport function createTreeWidget(props: TreeWidgetProps): Widget {\n  return {\n    id: \"tree-widget-react:trees\",\n    label: TreeWidget.translate(\"widget.label\"),\n    icon: <Icon href={hierarchyTreeSvg} />,\n    layouts: {\n      standard: {\n        section: StagePanelSection.Start,\n        location: StagePanelLocation.Right,\n      },\n    },\n    content: <TreeWidgetComponent trees={props.trees} onPerformanceMeasured={props.onPerformanceMeasured} onFeatureUsed={props.onFeatureUsed} />,\n  };\n}\n\n/**\n * Tree widget component which allows selecting which tree to render.\n * @public\n */\nexport function TreeWidgetComponent(props: TreeWidgetProps) {\n  const ref = useTreeWidgetTransientState();\n  return (\n    <div ref={ref} className=\"tree-widget\">\n      <ErrorBoundary FallbackComponent={ErrorState}>\n        <TreeWidgetComponentImpl {...props} />\n      </ErrorBoundary>\n    </div>\n  );\n}\n\nfunction useTreeWidgetTransientState() {\n  const { ref, persist, restore } = useTreeStorage();\n  useTransientState(persist, restore);\n  return ref;\n}\n\ninterface UseTreeStorageResult {\n  ref: Ref<HTMLDivElement>;\n  persist: () => void;\n  restore: () => void;\n}\n\nfunction useTreeStorage(): UseTreeStorageResult {\n  const ref = useRef<HTMLDivElement>(null);\n  const scrollTop = useRef<number | undefined>();\n\n  const getContainer = () => {\n    return ref.current?.querySelector(\"#tw-tree-renderer-container\");\n  };\n\n  const persist = () => {\n    const container = getContainer();\n    scrollTop.current = container?.scrollTop;\n  };\n\n  const restore = () => {\n    setTimeout(() => {\n      const container = getContainer();\n      if (container && scrollTop.current) {\n        container.scrollTop = scrollTop.current;\n      }\n    });\n  };\n\n  return { ref, persist, restore };\n}\n"]}

package/lib/esm/tree-widget-react/components/tree-header/ErrorState.d.ts

@@ -0,0 +1,4 @@
+import type { FallbackProps } from "react-error-boundary";
+/** @internal */
+export declare function ErrorState({ resetErrorBoundary }: FallbackProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ErrorState.d.ts.map

package/lib/esm/tree-widget-react/components/tree-header/ErrorState.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+import { Button, Text } from "@stratakit/bricks";
+import { Icon } from "@stratakit/foundations";
+import errorSvg from "@stratakit/icons/status-error.svg";
+import { TreeWidget } from "../../TreeWidget.js";
+/** @internal */
+export function ErrorState({ resetErrorBoundary }) {
+    return (_jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", height: "100%", gap: "0.5rem" }, children: [_jsx(Icon, { href: errorSvg, size: "large" }), _jsx(Text, { variant: "body-sm", children: TreeWidget.translate("errorState.description") }), _jsx(Button, { onClick: resetErrorBoundary, children: TreeWidget.translate("errorState.retryButtonLabel") })] }));
+}
+//# sourceMappingURL=ErrorState.js.map

package/lib/esm/tree-widget-react/components/tree-header/ErrorState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorState.js","sourceRoot":"","sources":["../../../../../src/tree-widget-react/components/tree-header/ErrorState.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,QAAQ,MAAM,mCAAmC,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAIjD,gBAAgB;AAChB,MAAM,UAAU,UAAU,CAAC,EAAE,kBAAkB,EAAiB;IAC9D,OAAO,CACL,eAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,QAAQ,EAAE,aACrI,KAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAC,OAAO,GAAG,EACrC,KAAC,IAAI,IAAC,OAAO,EAAE,SAAS,YAAG,UAAU,CAAC,SAAS,CAAC,wBAAwB,CAAC,GAAQ,EACjF,KAAC,MAAM,IAAC,OAAO,EAAE,kBAAkB,YAAG,UAAU,CAAC,SAAS,CAAC,6BAA6B,CAAC,GAAU,IAC/F,CACP,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport { Button, Text } from \"@stratakit/bricks\";\nimport { Icon } from \"@stratakit/foundations\";\nimport errorSvg from \"@stratakit/icons/status-error.svg\";\nimport { TreeWidget } from \"../../TreeWidget.js\";\n\nimport type { FallbackProps } from \"react-error-boundary\";\n\n/** @internal */\nexport function ErrorState({ resetErrorBoundary }: FallbackProps) {\n  return (\n    <div style={{ display: \"flex\", flexDirection: \"column\", alignItems: \"center\", justifyContent: \"center\", height: \"100%\", gap: \"0.5rem\" }}>\n      <Icon href={errorSvg} size=\"large\" />\n      <Text variant={\"body-sm\"}>{TreeWidget.translate(\"errorState.description\")}</Text>\n      <Button onClick={resetErrorBoundary}>{TreeWidget.translate(\"errorState.retryButtonLabel\")}</Button>\n    </div>\n  );\n}\n"]}

package/lib/esm/tree-widget-react/components/tree-header/SearchBox.d.ts

@@ -0,0 +1,11 @@
+interface DebouncedSearchBoxProps {
+    isOpened: boolean;
+    setIsOpened: (value: boolean) => void;
+    onSearch: (value?: string) => void;
+    delay: number;
+    className?: string;
+}
+/** @internal */
+export declare function DebouncedSearchBox({ isOpened, onSearch, setIsOpened, delay, className }: DebouncedSearchBoxProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SearchBox.d.ts.map