@itwin/tree-widget-react 4.0.0-alpha.18 → 4.0.0-alpha.19

package/CHANGELOG.md

@@ -1,9 +1,59 @@
 # Change Log - @itwin/tree-widget-react
 
-<!-- This log was last generated on Tue, 07 Oct 2025 08:45:29 GMT and should not be manually modified. -->
+<!-- This log was last generated on Tue, 18 Nov 2025 15:20:07 GMT and should not be manually modified. -->
 
 <!-- Start content -->
 
+## 3.17.2
+
+Tue, 18 Nov 2025 15:20:07 GMT
+
+### Patches
+
+- Models tree: Fixed an issue where models/subjects with child-only categories would have partial visibility (instead of hidden) when elements from other models were added to the exclusive always drawn list. ([#1514](https://github.com/iTwin/viewer-components-react/pull/1514))
+
+## 3.17.1
+
+Thu, 13 Nov 2025 09:36:43 GMT
+
+### Patches
+
+- Models and Categories trees: reduce main thread blockage for large iModels when determining visibility. ([#1499](https://github.com/iTwin/viewer-components-react/pull/1499))
+- Models tree: Fixed parent / child elements visibility controls. Now, changing element visibility also changes visibility of all nested children. Also, determining element visibility takes into account all child elements that are in the always/never drawn sets. ([#1477](https://github.com/iTwin/viewer-components-react/pull/1477))
+
+## 3.17.0
+
+Mon, 03 Nov 2025 07:50:14 GMT
+
+### Minor changes
+
+- Categories tree: Add option to show categories that don't contain any elements. This option can be provided to `CategoriesTree`, `CategoriesTreeComponent` or `useCategoriesTree`. It can be provided as `hierarchyConfig` property called `showEmptyCategories` ([#1486](https://github.com/iTwin/viewer-components-react/pull/1486))
+
+### Patches
+
+- Tree widget: change caches of categories and models trees to use observables. ([#1494](https://github.com/iTwin/viewer-components-react/pull/1494))
+- Fix tree scrollbar not persisting when switching widgets ([#1497](https://github.com/iTwin/viewer-components-react/pull/1497))
+
+## 3.16.1
+
+Wed, 22 Oct 2025 08:09:53 GMT
+
+### Patches
+
+- Fix category elements count query being cancelled due to restart token. ([#1484](https://github.com/iTwin/viewer-components-react/pull/1484))
+
+## 3.16.0
+
+Fri, 17 Oct 2025 15:36:01 GMT
+
+### Minor changes
+
+- Tree widget: fix issue with queries being cancelled due to the same restart token. Fixed by adding a unique guid to each restart token. Changed `showAllModels` to now accept optional componentId, which is used in the restart tokens. ([#1478](https://github.com/iTwin/viewer-components-react/pull/1478))
+
+### Patches
+
+- Bump versions of presentation packages ([#1480](https://github.com/iTwin/viewer-components-react/pull/1480))
+
 ## 3.15.1
 
 Tue, 07 Oct 2025 08:45:29 GMT

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

@@ -5,9 +5,7 @@ import type { ILogger } from "@itwin/presentation-shared";
  * @public
  */
 export declare class TreeWidget {
-    private static _i18n?;
-    private static _logger?;
-    private static _initialized?;
+    #private;
     /**
      * Called by IModelApp to initialize the Tree Widget
      * @param i18n - The internationalization service created by the IModelApp.

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

@@ -12,49 +12,49 @@ import { setLogger as setHierarchiesReactLogger } from "@itwin/presentation-hier
  * @public
  */
 export class TreeWidget {
-    static _i18n;
-    static _logger;
-    static _initialized;
+    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, logger) {
-        if (this._initialized) {
+        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);
+        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);
     }
     /** Unregisters the TreeWidget internationalization service namespace */
     static terminate() {
-        if (TreeWidget._i18n) {
-            TreeWidget._i18n.unregisterNamespace(TreeWidget.i18nNamespace);
-            TreeWidget._i18n = undefined;
+        if (TreeWidget.#i18n) {
+            TreeWidget.#i18n.unregisterNamespace(TreeWidget.i18nNamespace);
+            TreeWidget.#i18n = undefined;
         }
-        TreeWidget._logger = undefined;
+        TreeWidget.#logger = undefined;
         setHierarchiesLogger(undefined);
         setHierarchiesReactLogger(undefined);
-        TreeWidget._initialized = false;
+        TreeWidget.#initialized = false;
     }
     /** The logger used by this components in this package. */
     static get logger() {
-        if (!TreeWidget._logger) {
+        if (!TreeWidget.#logger) {
             throw new BentleyError(BentleyStatus.ERROR, "TreeWidget not initialized");
         }
-        return TreeWidget._logger;
+        return TreeWidget.#logger;
     }
     /** The internationalization service created by the IModelApp. */
     static get i18n() {
-        if (!TreeWidget._i18n) {
+        if (!TreeWidget.#i18n) {
             throw new BentleyError(BentleyStatus.ERROR, "TreeWidget not initialized");
         }
-        return TreeWidget._i18n;
+        return TreeWidget.#i18n;
     }
     /** The internationalization service namespace. */
     static get i18nNamespace() {

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,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"]}
+{"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;IACrB,MAAM,CAAC,KAAK,CAAgB;IAC5B,MAAM,CAAC,OAAO,CAAW;IACzB,MAAM,CAAC,YAAY,CAAW;IAE9B;;;;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  static #i18n?: Localization;\n  static #logger?: ILogger;\n  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/TreeWidgetComponentImpl.d.ts

@@ -6,6 +6,7 @@ import type { IModelConnection } from "@itwin/core-frontend";
  */
 export interface TreeRenderProps {
     filter?: string;
+    treeLabel: string;
     onPerformanceMeasured?: (featureId: string, elapsedTime: number) => void;
     onFeatureUsed?: (feature: string) => void;
 }

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

@@ -32,7 +32,7 @@ function SelectableTreeContent({ onPerformanceMeasured, onFeatureUsed, trees: tr
         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 }) })] }) }));
+    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, treeLabel: selectedContent.label }) })] }) }));
 }
 function useActiveTrees(treeDefinitions, imodel) {
     const [trees, setTrees] = useState();

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

@@ -1 +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"]}
+{"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\";\n\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/**\n * Props for rendering trees\n * @public\n */\nexport interface TreeRenderProps {\n  filter?: string;\n  treeLabel: 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\">\n          {selectedContent?.render({ onPerformanceMeasured, onFeatureUsed, filter: searchValue, treeLabel: selectedContent.label })}\n        </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.js

@@ -47,7 +47,7 @@ function useTreeStorage() {
     const ref = useRef(null);
     const scrollTop = useRef();
     const getContainer = () => {
-        return ref.current?.querySelector("#tw-tree-renderer-container");
+        return ref.current?.querySelector("#tw-tree-renderer");
     };
     const persist = () => {
         const container = getContainer();

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,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;AAwBvE;;;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 * 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"]}
+{"version":3,"file":"TreeWidgetUiItemsProvider.js","sourceRoot":"","sources":["../../../../src/tree-widget-react/components/TreeWidgetUiItemsProvider.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,iCAAiC,CAAC;AAEzC,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,mBAAmB,CAAC,CAAC;IACzD,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\";\n\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/**\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 * 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\");\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/SearchBox.js

@@ -5,7 +5,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  *--------------------------------------------------------------------------------------------*/
 import { useEffect, useRef, useState } from "react";
 import { IconButton, TextBox } from "@stratakit/bricks";
-import closeSvg from "@stratakit/icons/close.svg";
+import dismissSvg from "@stratakit/icons/dismiss.svg";
 import searchSvg from "@stratakit/icons/search.svg";
 import { TreeWidget } from "../../TreeWidget.js";
 /** @internal */
@@ -25,7 +25,7 @@ export function DebouncedSearchBox({ isOpened, onSearch, setIsOpened, delay, cla
     return !isOpened ? (_jsx(IconButton, { className: "tw-search-box-button", variant: "ghost", label: TreeWidget.translate("header.searchBox.searchForSomething"), icon: searchSvg, onClick: () => {
             setIsOpened(true);
             setInputValue("");
-        } })) : (_jsxs(_Fragment, { children: [_jsx(TextBox.Root, { className: className, children: _jsx(TextBox.Input, { type: "text", onChange: (e) => setInputValue(e.currentTarget.value), placeholder: TreeWidget.translate("header.searchBox.search") }) }), _jsx(IconButton, { className: "tw-search-box-button", variant: "ghost", label: TreeWidget.translate("header.searchBox.close"), icon: closeSvg, onClick: () => {
+        } })) : (_jsxs(_Fragment, { children: [_jsx(TextBox.Root, { className: className, children: _jsx(TextBox.Input, { type: "text", onChange: (e) => setInputValue(e.currentTarget.value), placeholder: TreeWidget.translate("header.searchBox.search") }) }), _jsx(IconButton, { className: "tw-search-box-button", variant: "ghost", label: TreeWidget.translate("header.searchBox.close"), icon: dismissSvg, onClick: () => {
                     setIsOpened(false);
                     setInputValue(undefined);
                 } })] }));

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

@@ -1 +1 @@
-{"version":3,"file":"SearchBox.js","sourceRoot":"","sources":["../../../../../src/tree-widget-react/components/tree-header/SearchBox.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,QAAQ,MAAM,4BAA4B,CAAC;AAClD,OAAO,SAAS,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAUjD,gBAAgB;AAChB,MAAM,UAAU,kBAAkB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAA2B;IAC/G,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAqB,SAAS,CAAC,CAAC;IAC5E,MAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IACrC,gHAAgH;IAChH,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAC;IAE/B,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,WAAW,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;QAClC,CAAC,EAAE,KAAK,CAAC,CAAC;QAEV,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,SAAS,CAAC,CAAC;QAC1B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC;IAExB,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CACjB,KAAC,UAAU,IACT,SAAS,EAAE,sBAAsB,EACjC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,qCAAqC,CAAC,EAClE,IAAI,EAAE,SAAS,EACf,OAAO,EAAE,GAAG,EAAE;YACZ,WAAW,CAAC,IAAI,CAAC,CAAC;YAClB,aAAa,CAAC,EAAE,CAAC,CAAC;QACpB,CAAC,GACD,CACH,CAAC,CAAC,CAAC,CACF,8BACE,KAAC,OAAO,CAAC,IAAI,IAAC,SAAS,EAAE,SAAS,YAChC,KAAC,OAAO,CAAC,KAAK,IAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE,WAAW,EAAE,UAAU,CAAC,SAAS,CAAC,yBAAyB,CAAC,GAAI,GACvI,EACf,KAAC,UAAU,IACT,SAAS,EAAE,sBAAsB,EACjC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,wBAAwB,CAAC,EACrD,IAAI,EAAE,QAAQ,EACd,OAAO,EAAE,GAAG,EAAE;oBACZ,WAAW,CAAC,KAAK,CAAC,CAAC;oBACnB,aAAa,CAAC,SAAS,CAAC,CAAC;gBAC3B,CAAC,GACD,IACD,CACJ,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 { useEffect, useRef, useState } from \"react\";\nimport { IconButton, TextBox } from \"@stratakit/bricks\";\nimport closeSvg from \"@stratakit/icons/close.svg\";\nimport searchSvg from \"@stratakit/icons/search.svg\";\nimport { TreeWidget } from \"../../TreeWidget.js\";\n\ninterface DebouncedSearchBoxProps {\n  isOpened: boolean;\n  setIsOpened: (value: boolean) => void;\n  onSearch: (value?: string) => void;\n  delay: number;\n  className?: string;\n}\n\n/** @internal */\nexport function DebouncedSearchBox({ isOpened, onSearch, setIsOpened, delay, className }: DebouncedSearchBoxProps) {\n  const [inputValue, setInputValue] = useState<string | undefined>(undefined);\n  const onChangeRef = useRef(onSearch);\n  // save latest `onChange` reference into `useRef` to avoid restarting timeout when `onChange` reference changes.\n  onChangeRef.current = onSearch;\n\n  useEffect(() => {\n    const timeoutId = setTimeout(() => {\n      onChangeRef.current(inputValue);\n    }, delay);\n\n    return () => {\n      clearTimeout(timeoutId);\n    };\n  }, [inputValue, delay]);\n\n  return !isOpened ? (\n    <IconButton\n      className={\"tw-search-box-button\"}\n      variant={\"ghost\"}\n      label={TreeWidget.translate(\"header.searchBox.searchForSomething\")}\n      icon={searchSvg}\n      onClick={() => {\n        setIsOpened(true);\n        setInputValue(\"\");\n      }}\n    />\n  ) : (\n    <>\n      <TextBox.Root className={className}>\n        <TextBox.Input type={\"text\"} onChange={(e) => setInputValue(e.currentTarget.value)} placeholder={TreeWidget.translate(\"header.searchBox.search\")} />\n      </TextBox.Root>\n      <IconButton\n        className={\"tw-search-box-button\"}\n        variant={\"ghost\"}\n        label={TreeWidget.translate(\"header.searchBox.close\")}\n        icon={closeSvg}\n        onClick={() => {\n          setIsOpened(false);\n          setInputValue(undefined);\n        }}\n      />\n    </>\n  );\n}\n"]}
+{"version":3,"file":"SearchBox.js","sourceRoot":"","sources":["../../../../../src/tree-widget-react/components/tree-header/SearchBox.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,UAAU,MAAM,8BAA8B,CAAC;AACtD,OAAO,SAAS,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAUjD,gBAAgB;AAChB,MAAM,UAAU,kBAAkB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAA2B;IAC/G,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAqB,SAAS,CAAC,CAAC;IAC5E,MAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IACrC,gHAAgH;IAChH,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAC;IAE/B,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,WAAW,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;QAClC,CAAC,EAAE,KAAK,CAAC,CAAC;QAEV,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,SAAS,CAAC,CAAC;QAC1B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC;IAExB,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CACjB,KAAC,UAAU,IACT,SAAS,EAAE,sBAAsB,EACjC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,qCAAqC,CAAC,EAClE,IAAI,EAAE,SAAS,EACf,OAAO,EAAE,GAAG,EAAE;YACZ,WAAW,CAAC,IAAI,CAAC,CAAC;YAClB,aAAa,CAAC,EAAE,CAAC,CAAC;QACpB,CAAC,GACD,CACH,CAAC,CAAC,CAAC,CACF,8BACE,KAAC,OAAO,CAAC,IAAI,IAAC,SAAS,EAAE,SAAS,YAChC,KAAC,OAAO,CAAC,KAAK,IAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE,WAAW,EAAE,UAAU,CAAC,SAAS,CAAC,yBAAyB,CAAC,GAAI,GACvI,EACf,KAAC,UAAU,IACT,SAAS,EAAE,sBAAsB,EACjC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,wBAAwB,CAAC,EACrD,IAAI,EAAE,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE;oBACZ,WAAW,CAAC,KAAK,CAAC,CAAC;oBACnB,aAAa,CAAC,SAAS,CAAC,CAAC;gBAC3B,CAAC,GACD,IACD,CACJ,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 { useEffect, useRef, useState } from \"react\";\nimport { IconButton, TextBox } from \"@stratakit/bricks\";\nimport dismissSvg from \"@stratakit/icons/dismiss.svg\";\nimport searchSvg from \"@stratakit/icons/search.svg\";\nimport { TreeWidget } from \"../../TreeWidget.js\";\n\ninterface DebouncedSearchBoxProps {\n  isOpened: boolean;\n  setIsOpened: (value: boolean) => void;\n  onSearch: (value?: string) => void;\n  delay: number;\n  className?: string;\n}\n\n/** @internal */\nexport function DebouncedSearchBox({ isOpened, onSearch, setIsOpened, delay, className }: DebouncedSearchBoxProps) {\n  const [inputValue, setInputValue] = useState<string | undefined>(undefined);\n  const onChangeRef = useRef(onSearch);\n  // save latest `onChange` reference into `useRef` to avoid restarting timeout when `onChange` reference changes.\n  onChangeRef.current = onSearch;\n\n  useEffect(() => {\n    const timeoutId = setTimeout(() => {\n      onChangeRef.current(inputValue);\n    }, delay);\n\n    return () => {\n      clearTimeout(timeoutId);\n    };\n  }, [inputValue, delay]);\n\n  return !isOpened ? (\n    <IconButton\n      className={\"tw-search-box-button\"}\n      variant={\"ghost\"}\n      label={TreeWidget.translate(\"header.searchBox.searchForSomething\")}\n      icon={searchSvg}\n      onClick={() => {\n        setIsOpened(true);\n        setInputValue(\"\");\n      }}\n    />\n  ) : (\n    <>\n      <TextBox.Root className={className}>\n        <TextBox.Input type={\"text\"} onChange={(e) => setInputValue(e.currentTarget.value)} placeholder={TreeWidget.translate(\"header.searchBox.search\")} />\n      </TextBox.Root>\n      <IconButton\n        className={\"tw-search-box-button\"}\n        variant={\"ghost\"}\n        label={TreeWidget.translate(\"header.searchBox.close\")}\n        icon={dismissSvg}\n        onClick={() => {\n          setIsOpened(false);\n          setInputValue(undefined);\n        }}\n      />\n    </>\n  );\n}\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"SelectableTree.js","sourceRoot":"","sources":["../../../../../src/tree-widget-react/components/tree-header/SelectableTree.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,sBAAsB,CAAC;AAC9B,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAgB7C,YAAY;AACZ,MAAM,UAAU,cAAc,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAsC;IACtF,OAAO,CACL,eAAK,SAAS,EAAE,sBAAsB,aACnC,OAAO,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,iBAAiB,YAAG,OAAO,GAAO,CAAC,CAAC,CAAC,mBAAK,EACrE,KAAC,OAAO,KAAG,EACX,KAAC,aAAa,IAAC,iBAAiB,EAAE,UAAU,YAC1C,cAAK,SAAS,EAAC,iBAAiB,YAAE,QAAQ,GAAO,GACnC,IACZ,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 \"./SelectableTree.css\";\nimport { ErrorBoundary } from \"react-error-boundary\";\nimport { Divider } from \"@stratakit/bricks\";\nimport { ErrorState } from \"./ErrorState.js\";\n\nimport type { PropsWithChildren, ReactNode } from \"react\";\nimport type { TreeWidgetViewport } from \"../trees/common/TreeWidgetViewport.js\";\n\n/** @public */\nexport interface TreeToolbarButtonProps {\n  viewport: TreeWidgetViewport;\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/** @beta */\ninterface TreeHeaderProps {\n  buttons?: ReactNode;\n}\n\n/** @beta */\nexport function SelectableTree({ buttons, children }: PropsWithChildren<TreeHeaderProps>) {\n  return (\n    <div className={\"tw-tree-with-toolbar\"}>\n      {buttons ? <div className={\"tw-tree-toolbar\"}>{buttons}</div> : <></>}\n      <Divider />\n      <ErrorBoundary FallbackComponent={ErrorState}>\n        <div className=\"tw-tree-content\">{children}</div>\n      </ErrorBoundary>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"SelectableTree.js","sourceRoot":"","sources":["../../../../../src/tree-widget-react/components/tree-header/SelectableTree.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,sBAAsB,CAAC;AAE9B,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAgB7C,YAAY;AACZ,MAAM,UAAU,cAAc,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAsC;IACtF,OAAO,CACL,eAAK,SAAS,EAAE,sBAAsB,aACnC,OAAO,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,iBAAiB,YAAG,OAAO,GAAO,CAAC,CAAC,CAAC,mBAAK,EACrE,KAAC,OAAO,KAAG,EACX,KAAC,aAAa,IAAC,iBAAiB,EAAE,UAAU,YAC1C,cAAK,SAAS,EAAC,iBAAiB,YAAE,QAAQ,GAAO,GACnC,IACZ,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 \"./SelectableTree.css\";\n\nimport { ErrorBoundary } from \"react-error-boundary\";\nimport { Divider } from \"@stratakit/bricks\";\nimport { ErrorState } from \"./ErrorState.js\";\n\nimport type { PropsWithChildren, ReactNode } from \"react\";\nimport type { TreeWidgetViewport } from \"../trees/common/TreeWidgetViewport.js\";\n\n/** @public */\nexport interface TreeToolbarButtonProps {\n  viewport: TreeWidgetViewport;\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/** @beta */\ninterface TreeHeaderProps {\n  buttons?: ReactNode;\n}\n\n/** @beta */\nexport function SelectableTree({ buttons, children }: PropsWithChildren<TreeHeaderProps>) {\n  return (\n    <div className={\"tw-tree-with-toolbar\"}>\n      {buttons ? <div className={\"tw-tree-toolbar\"}>{buttons}</div> : <></>}\n      <Divider />\n      <ErrorBoundary FallbackComponent={ErrorState}>\n        <div className=\"tw-tree-content\">{children}</div>\n      </ErrorBoundary>\n    </div>\n  );\n}\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"WidgetHeader.js","sourceRoot":"","sources":["../../../../../src/tree-widget-react/components/tree-header/WidgetHeader.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,oBAAoB,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAoCpD;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,wBAAwB,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAqB;IACrG,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,wBAAwB,CAAC,CAAC;IACrF,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,iBAAiB,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;IAClF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAEjE,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,eAAe,CAAC,EAAE,KAAK,SAAS,EAAE,CAAC;QAC3D,OAAO,KAAC,aAAa,KAAG,CAAC;IAC3B,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAC,mBAAmB,aAC/B,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,YAAY,IAAI,CACpC,KAAC,MAAM,CAAC,IAAI,IAAC,SAAS,EAAE,4BAA4B,YAClD,KAAC,MAAM,CAAC,UAAU,IAChB,KAAK,EAAE,iBAAiB,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;wBACd,MAAM,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;wBAC9B,QAAQ,CAAC,MAAM,CAAC,CAAC;wBACjB,oBAAoB,CAAC,MAAM,CAAC,CAAC;oBAC/B,CAAC,YAEA,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,iBAAsB,KAAK,EAAE,IAAI,CAAC,EAAE,YACjC,IAAI,CAAC,KAAK,IADA,IAAI,CAAC,EAAE,CAEX,CACV,CAAC,GACgB,GACR,CACf,EACA,eAAe,CAAC,YAAY,IAAI,CAC/B,KAAC,kBAAkB,IAAC,SAAS,EAAE,0BAA0B,EAAE,QAAQ,EAAE,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,GAAI,CACnJ,IACG,CACP,CAAC;AACJ,CAAC;AAED,SAAS,aAAa;IACpB,OAAO,CACL,eAAK,SAAS,EAAC,mBAAmB,aAChC,KAAC,QAAQ,IAAC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,GAAI,EAC7C,KAAC,QAAQ,IAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,GAAI,IAC3C,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 \"./WidgetHeader.css\";\nimport { useState } from \"react\";\nimport { Select, Skeleton } from \"@stratakit/bricks\";\nimport { DebouncedSearchBox } from \"./SearchBox.js\";\n\nimport type { TreeRenderProps } from \"../TreeWidgetComponentImpl.js\";\n\n// cspell:words xlarge\n\n/**\n * A definition for trees displayed in `WidgetWithHeader`\n * @internal\n */\nexport interface TreeContentDefinition {\n  id: string;\n  label: string;\n  isSearchable?: boolean;\n  render: (props: TreeRenderProps) => React.ReactNode;\n}\n\n/**\n * Props for `WidgetWithHeader`\n * @internal\n */\nexport interface TreeSelectionProps {\n  defaultSelectedContentId: string;\n  trees: TreeContentDefinition[];\n}\n\n/**\n * Props for `WidgetWithHeader`\n * @internal\n */\nexport type WidgetHeaderProps = {\n  onSearch: (value?: string) => void;\n  onSelect: (value: string) => void;\n  isLoading?: boolean;\n} & TreeSelectionProps;\n\n/**\n * A component that accepts a list of trees and renders a select box at the top,\n * allowing to choose which of the provided tree components should be rendered at the bottom.\n * @internal\n */\nexport function WidgetHeader({ defaultSelectedContentId, trees, onSelect, onSearch }: WidgetHeaderProps) {\n  const [selectedContentId, setSelectedContentId] = useState(defaultSelectedContentId);\n  const selectedContent = trees.find((c) => c.id === selectedContentId) ?? trees[0];\n  const [isSearchOpen, setIsSearchOpen] = useState<boolean>(false);\n\n  if (trees.length === 0 || selectedContent.id === \"loading\") {\n    return <LoadingHeader />;\n  }\n\n  return (\n    <div className=\"tw-content-header\">\n      {trees.length > 0 && !isSearchOpen && (\n        <Select.Root className={\"tw-content-header-selector\"}>\n          <Select.HtmlSelect\n            value={selectedContentId}\n            onChange={(e) => {\n              const treeId = e.target.value;\n              onSelect(treeId);\n              setSelectedContentId(treeId);\n            }}\n          >\n            {trees.map((tree) => (\n              <option key={tree.id} value={tree.id}>\n                {tree.label}\n              </option>\n            ))}\n          </Select.HtmlSelect>\n        </Select.Root>\n      )}\n      {selectedContent.isSearchable && (\n        <DebouncedSearchBox className={\"tw-content-header-search\"} isOpened={isSearchOpen} setIsOpened={setIsSearchOpen} onSearch={onSearch} delay={20} />\n      )}\n    </div>\n  );\n}\n\nfunction LoadingHeader() {\n  return (\n    <div className=\"tw-content-header\">\n      <Skeleton variant={\"text\"} size={\"xlarge\"} />\n      <Skeleton variant={\"object\"} size={\"medium\"} />\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"WidgetHeader.js","sourceRoot":"","sources":["../../../../../src/tree-widget-react/components/tree-header/WidgetHeader.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,oBAAoB,CAAC;AAE5B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAoCpD;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,wBAAwB,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAqB;IACrG,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,wBAAwB,CAAC,CAAC;IACrF,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,iBAAiB,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;IAClF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAEjE,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,eAAe,CAAC,EAAE,KAAK,SAAS,EAAE,CAAC;QAC3D,OAAO,KAAC,aAAa,KAAG,CAAC;IAC3B,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAC,mBAAmB,aAC/B,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,YAAY,IAAI,CACpC,KAAC,MAAM,CAAC,IAAI,IAAC,SAAS,EAAE,4BAA4B,YAClD,KAAC,MAAM,CAAC,UAAU,IAChB,KAAK,EAAE,iBAAiB,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;wBACd,MAAM,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;wBAC9B,QAAQ,CAAC,MAAM,CAAC,CAAC;wBACjB,oBAAoB,CAAC,MAAM,CAAC,CAAC;oBAC/B,CAAC,YAEA,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,iBAAsB,KAAK,EAAE,IAAI,CAAC,EAAE,YACjC,IAAI,CAAC,KAAK,IADA,IAAI,CAAC,EAAE,CAEX,CACV,CAAC,GACgB,GACR,CACf,EACA,eAAe,CAAC,YAAY,IAAI,CAC/B,KAAC,kBAAkB,IAAC,SAAS,EAAE,0BAA0B,EAAE,QAAQ,EAAE,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,GAAI,CACnJ,IACG,CACP,CAAC;AACJ,CAAC;AAED,SAAS,aAAa;IACpB,OAAO,CACL,eAAK,SAAS,EAAC,mBAAmB,aAChC,KAAC,QAAQ,IAAC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,GAAI,EAC7C,KAAC,QAAQ,IAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,GAAI,IAC3C,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 \"./WidgetHeader.css\";\n\nimport { useState } from \"react\";\nimport { Select, Skeleton } from \"@stratakit/bricks\";\nimport { DebouncedSearchBox } from \"./SearchBox.js\";\n\nimport type { TreeRenderProps } from \"../TreeWidgetComponentImpl.js\";\n\n// cspell:words xlarge\n\n/**\n * A definition for trees displayed in `WidgetWithHeader`\n * @internal\n */\nexport interface TreeContentDefinition {\n  id: string;\n  label: string;\n  isSearchable?: boolean;\n  render: (props: TreeRenderProps) => React.ReactNode;\n}\n\n/**\n * Props for `WidgetWithHeader`\n * @internal\n */\nexport interface TreeSelectionProps {\n  defaultSelectedContentId: string;\n  trees: TreeContentDefinition[];\n}\n\n/**\n * Props for `WidgetWithHeader`\n * @internal\n */\nexport type WidgetHeaderProps = {\n  onSearch: (value?: string) => void;\n  onSelect: (value: string) => void;\n  isLoading?: boolean;\n} & TreeSelectionProps;\n\n/**\n * A component that accepts a list of trees and renders a select box at the top,\n * allowing to choose which of the provided tree components should be rendered at the bottom.\n * @internal\n */\nexport function WidgetHeader({ defaultSelectedContentId, trees, onSelect, onSearch }: WidgetHeaderProps) {\n  const [selectedContentId, setSelectedContentId] = useState(defaultSelectedContentId);\n  const selectedContent = trees.find((c) => c.id === selectedContentId) ?? trees[0];\n  const [isSearchOpen, setIsSearchOpen] = useState<boolean>(false);\n\n  if (trees.length === 0 || selectedContent.id === \"loading\") {\n    return <LoadingHeader />;\n  }\n\n  return (\n    <div className=\"tw-content-header\">\n      {trees.length > 0 && !isSearchOpen && (\n        <Select.Root className={\"tw-content-header-selector\"}>\n          <Select.HtmlSelect\n            value={selectedContentId}\n            onChange={(e) => {\n              const treeId = e.target.value;\n              onSelect(treeId);\n              setSelectedContentId(treeId);\n            }}\n          >\n            {trees.map((tree) => (\n              <option key={tree.id} value={tree.id}>\n                {tree.label}\n              </option>\n            ))}\n          </Select.HtmlSelect>\n        </Select.Root>\n      )}\n      {selectedContent.isSearchable && (\n        <DebouncedSearchBox className={\"tw-content-header-search\"} isOpened={isSearchOpen} setIsOpened={setIsSearchOpen} onSearch={onSearch} delay={20} />\n      )}\n    </div>\n  );\n}\n\nfunction LoadingHeader() {\n  return (\n    <div className=\"tw-content-header\">\n      <Skeleton variant={\"text\"} size={\"xlarge\"} />\n      <Skeleton variant={\"object\"} size={\"medium\"} />\n    </div>\n  );\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTree.d.ts

@@ -1,12 +1,12 @@
+import type { VisibilityTreeProps } from "../common/components/VisibilityTree.js";
 import type { VisibilityTreeRendererProps } from "../common/components/VisibilityTreeRenderer.js";
 import type { UseCategoriesTreeProps } from "./UseCategoriesTree.js";
-import type { VisibilityTreeProps } from "../common/components/VisibilityTree.js";
 /** @beta */
-export type CategoriesTreeProps = Pick<VisibilityTreeProps, "imodel" | "selectionStorage" | "selectionMode" | "emptyTreeContent"> & Pick<VisibilityTreeRendererProps, "getInlineActions" | "getMenuActions" | "getDecorations"> & UseCategoriesTreeProps & {
+export type CategoriesTreeProps = Pick<VisibilityTreeProps, "imodel" | "selectionStorage" | "selectionMode" | "emptyTreeContent"> & Pick<VisibilityTreeRendererProps, "getInlineActions" | "getMenuActions" | "getDecorations" | "treeLabel"> & UseCategoriesTreeProps & {
     hierarchyLevelConfig?: {
         sizeLimit?: number;
     };
 };
 /** @beta */
-export declare function CategoriesTree({ imodel, selectionStorage, activeView, filter, hierarchyLevelConfig, selectionMode, onCategoriesFiltered, emptyTreeContent, getDecorations, getInlineActions, getMenuActions, hierarchyConfig, }: CategoriesTreeProps): import("react/jsx-runtime").JSX.Element;
+export declare function CategoriesTree({ imodel, selectionStorage, activeView, filter, hierarchyLevelConfig, hierarchyConfig, selectionMode, onCategoriesFiltered, emptyTreeContent, getDecorations, getInlineActions, getMenuActions, treeLabel, }: CategoriesTreeProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=CategoriesTree.d.ts.map

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTree.js

@@ -7,7 +7,7 @@ import { VisibilityTree } from "../common/components/VisibilityTree.js";
 import { VisibilityTreeRenderer } from "../common/components/VisibilityTreeRenderer.js";
 import { useCategoriesTree } from "./UseCategoriesTree.js";
 /** @beta */
-export function CategoriesTree({ imodel, selectionStorage, activeView, filter, hierarchyLevelConfig, selectionMode, onCategoriesFiltered, emptyTreeContent, getDecorations, getInlineActions, getMenuActions, hierarchyConfig, }) {
+export function CategoriesTree({ imodel, selectionStorage, activeView, filter, hierarchyLevelConfig, hierarchyConfig, selectionMode, onCategoriesFiltered, emptyTreeContent, getDecorations, getInlineActions, getMenuActions, treeLabel, }) {
     const { categoriesTreeProps, rendererProps } = useCategoriesTree({
         filter,
         activeView,
@@ -15,6 +15,6 @@ export function CategoriesTree({ imodel, selectionStorage, activeView, filter, h
         emptyTreeContent,
         hierarchyConfig,
     });
-    return (_jsx(VisibilityTree, { ...categoriesTreeProps, imodel: imodel, selectionStorage: selectionStorage, hierarchyLevelSizeLimit: hierarchyLevelConfig?.sizeLimit, selectionMode: selectionMode ?? "none", treeRenderer: (treeProps) => (_jsx(VisibilityTreeRenderer, { ...treeProps, ...rendererProps, getInlineActions: getInlineActions, getMenuActions: getMenuActions, getDecorations: getDecorations ?? rendererProps.getDecorations })) }));
+    return (_jsx(VisibilityTree, { ...categoriesTreeProps, imodel: imodel, selectionStorage: selectionStorage, hierarchyLevelSizeLimit: hierarchyLevelConfig?.sizeLimit, selectionMode: selectionMode ?? "none", treeRenderer: (treeProps) => (_jsx(VisibilityTreeRenderer, { ...treeProps, ...rendererProps, treeLabel: treeLabel, getInlineActions: getInlineActions, getMenuActions: getMenuActions, getDecorations: getDecorations ?? rendererProps.getDecorations })) }));
 }
 //# sourceMappingURL=CategoriesTree.js.map

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTree.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategoriesTree.js","sourceRoot":"","sources":["../../../../../../src/tree-widget-react/components/trees/categories-tree/CategoriesTree.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,sBAAsB,EAAE,MAAM,gDAAgD,CAAC;AACxF,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAe3D,YAAY;AACZ,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,EACN,gBAAgB,EAChB,UAAU,EACV,MAAM,EACN,oBAAoB,EACpB,aAAa,EACb,oBAAoB,EACpB,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,cAAc,EACd,eAAe,GACK;IACpB,MAAM,EAAE,mBAAmB,EAAE,aAAa,EAAE,GAAG,iBAAiB,CAAC;QAC/D,MAAM;QACN,UAAU;QACV,oBAAoB;QACpB,gBAAgB;QAChB,eAAe;KAChB,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,cAAc,OACT,mBAAmB,EACvB,MAAM,EAAE,MAAM,EACd,gBAAgB,EAAE,gBAAgB,EAClC,uBAAuB,EAAE,oBAAoB,EAAE,SAAS,EACxD,aAAa,EAAE,aAAa,IAAI,MAAM,EACtC,YAAY,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,CAC3B,KAAC,sBAAsB,OACjB,SAAS,KACT,aAAa,EACjB,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,IAAI,aAAa,CAAC,cAAc,GAC9D,CACH,GACD,CACH,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 { VisibilityTree } from \"../common/components/VisibilityTree.js\";\nimport { VisibilityTreeRenderer } from \"../common/components/VisibilityTreeRenderer.js\";\nimport { useCategoriesTree } from \"./UseCategoriesTree.js\";\n\nimport type { VisibilityTreeRendererProps } from \"../common/components/VisibilityTreeRenderer.js\";\nimport type { UseCategoriesTreeProps } from \"./UseCategoriesTree.js\";\nimport type { VisibilityTreeProps } from \"../common/components/VisibilityTree.js\";\n\n/** @beta */\nexport type CategoriesTreeProps = Pick<VisibilityTreeProps, \"imodel\" | \"selectionStorage\" | \"selectionMode\" | \"emptyTreeContent\"> &\n  Pick<VisibilityTreeRendererProps, \"getInlineActions\" | \"getMenuActions\" | \"getDecorations\"> &\n  UseCategoriesTreeProps & {\n    hierarchyLevelConfig?: {\n      sizeLimit?: number;\n    };\n  };\n\n/** @beta */\nexport function CategoriesTree({\n  imodel,\n  selectionStorage,\n  activeView,\n  filter,\n  hierarchyLevelConfig,\n  selectionMode,\n  onCategoriesFiltered,\n  emptyTreeContent,\n  getDecorations,\n  getInlineActions,\n  getMenuActions,\n  hierarchyConfig,\n}: CategoriesTreeProps) {\n  const { categoriesTreeProps, rendererProps } = useCategoriesTree({\n    filter,\n    activeView,\n    onCategoriesFiltered,\n    emptyTreeContent,\n    hierarchyConfig,\n  });\n\n  return (\n    <VisibilityTree\n      {...categoriesTreeProps}\n      imodel={imodel}\n      selectionStorage={selectionStorage}\n      hierarchyLevelSizeLimit={hierarchyLevelConfig?.sizeLimit}\n      selectionMode={selectionMode ?? \"none\"}\n      treeRenderer={(treeProps) => (\n        <VisibilityTreeRenderer\n          {...treeProps}\n          {...rendererProps}\n          getInlineActions={getInlineActions}\n          getMenuActions={getMenuActions}\n          getDecorations={getDecorations ?? rendererProps.getDecorations}\n        />\n      )}\n    />\n  );\n}\n"]}
+{"version":3,"file":"CategoriesTree.js","sourceRoot":"","sources":["../../../../../../src/tree-widget-react/components/trees/categories-tree/CategoriesTree.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,sBAAsB,EAAE,MAAM,gDAAgD,CAAC;AACxF,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAe3D,YAAY;AACZ,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,EACN,gBAAgB,EAChB,UAAU,EACV,MAAM,EACN,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,oBAAoB,EACpB,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,cAAc,EACd,SAAS,GACW;IACpB,MAAM,EAAE,mBAAmB,EAAE,aAAa,EAAE,GAAG,iBAAiB,CAAC;QAC/D,MAAM;QACN,UAAU;QACV,oBAAoB;QACpB,gBAAgB;QAChB,eAAe;KAChB,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,cAAc,OACT,mBAAmB,EACvB,MAAM,EAAE,MAAM,EACd,gBAAgB,EAAE,gBAAgB,EAClC,uBAAuB,EAAE,oBAAoB,EAAE,SAAS,EACxD,aAAa,EAAE,aAAa,IAAI,MAAM,EACtC,YAAY,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,CAC3B,KAAC,sBAAsB,OACjB,SAAS,KACT,aAAa,EACjB,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,IAAI,aAAa,CAAC,cAAc,GAC9D,CACH,GACD,CACH,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 { VisibilityTree } from \"../common/components/VisibilityTree.js\";\nimport { VisibilityTreeRenderer } from \"../common/components/VisibilityTreeRenderer.js\";\nimport { useCategoriesTree } from \"./UseCategoriesTree.js\";\n\nimport type { VisibilityTreeProps } from \"../common/components/VisibilityTree.js\";\nimport type { VisibilityTreeRendererProps } from \"../common/components/VisibilityTreeRenderer.js\";\nimport type { UseCategoriesTreeProps } from \"./UseCategoriesTree.js\";\n\n/** @beta */\nexport type CategoriesTreeProps = Pick<VisibilityTreeProps, \"imodel\" | \"selectionStorage\" | \"selectionMode\" | \"emptyTreeContent\"> &\n  Pick<VisibilityTreeRendererProps, \"getInlineActions\" | \"getMenuActions\" | \"getDecorations\" | \"treeLabel\"> &\n  UseCategoriesTreeProps & {\n    hierarchyLevelConfig?: {\n      sizeLimit?: number;\n    };\n  };\n\n/** @beta */\nexport function CategoriesTree({\n  imodel,\n  selectionStorage,\n  activeView,\n  filter,\n  hierarchyLevelConfig,\n  hierarchyConfig,\n  selectionMode,\n  onCategoriesFiltered,\n  emptyTreeContent,\n  getDecorations,\n  getInlineActions,\n  getMenuActions,\n  treeLabel,\n}: CategoriesTreeProps) {\n  const { categoriesTreeProps, rendererProps } = useCategoriesTree({\n    filter,\n    activeView,\n    onCategoriesFiltered,\n    emptyTreeContent,\n    hierarchyConfig,\n  });\n\n  return (\n    <VisibilityTree\n      {...categoriesTreeProps}\n      imodel={imodel}\n      selectionStorage={selectionStorage}\n      hierarchyLevelSizeLimit={hierarchyLevelConfig?.sizeLimit}\n      selectionMode={selectionMode ?? \"none\"}\n      treeRenderer={(treeProps) => (\n        <VisibilityTreeRenderer\n          {...treeProps}\n          {...rendererProps}\n          treeLabel={treeLabel}\n          getInlineActions={getInlineActions}\n          getMenuActions={getMenuActions}\n          getDecorations={getDecorations ?? rendererProps.getDecorations}\n        />\n      )}\n    />\n  );\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTreeButtons.d.ts

@@ -48,6 +48,4 @@ export declare function ShowAllButton(props: CategoriesTreeHeaderButtonProps): i
 export declare function HideAllButton(props: CategoriesTreeHeaderButtonProps): import("react/jsx-runtime").JSX.Element;
 /** @public */
 export declare function InvertAllButton(props: CategoriesTreeHeaderButtonProps): import("react/jsx-runtime").JSX.Element;
-/** @internal */
-export declare function useCategories(viewport: TreeWidgetViewport): CategoryInfo[];
 //# sourceMappingURL=CategoriesTreeButtons.d.ts.map

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTreeButtons.js

@@ -12,6 +12,7 @@ import visibilityInvertSvg from "@stratakit/icons/visibility-invert.svg";
 import visibilityShowSvg from "@stratakit/icons/visibility-show.svg";
 import { TreeWidget } from "../../../TreeWidget.js";
 import { hideAllCategories, invertAllCategories } from "../common/CategoriesVisibilityUtils.js";
+import { useGuid } from "../common/internal/useGuid.js";
 import { getClassesByView } from "../common/internal/Utils.js";
 import { loadCategoriesFromViewport } from "../common/internal/VisibilityUtils.js";
 import { hideAllModels, showAll } from "../common/Utils.js";
@@ -36,8 +37,9 @@ import { hideAllModels, showAll } from "../common/Utils.js";
 export function useCategoriesTreeButtonProps({ viewport }) {
     const [filteredCategories, setFilteredCategories] = useState();
     const [filteredModels, setFilteredModels] = useState();
-    const categories = useCategories(viewport);
-    const models = useAvailableModels(viewport);
+    const componentId = useGuid();
+    const categories = useCategories(viewport, componentId);
+    const models = useAvailableModels(viewport, componentId);
     return {
         buttonProps: {
             viewport,
@@ -52,10 +54,11 @@ export function useCategoriesTreeButtonProps({ viewport }) {
 }
 /** @public */
 export function ShowAllButton(props) {
+    const componentId = useGuid();
     return (_jsx(IconButton, { variant: "ghost", label: TreeWidget.translate("categoriesTree.buttons.showAll.tooltip"), onClick: () => {
             // cspell:disable-next-line
             props.onFeatureUsed?.(`categories-tree-showall`);
-            void showAll({ models: props.models, viewport: props.viewport, categories: props.categories.map((category) => category.categoryId) });
+            void showAll({ models: props.models, viewport: props.viewport, categories: props.categories.map((category) => category.categoryId), componentId });
         }, icon: visibilityShowSvg }));
 }
 /** @public */
@@ -75,27 +78,26 @@ export function InvertAllButton(props) {
         }, icon: visibilityInvertSvg }));
 }
 const EMPTY_CATEGORIES_ARRAY = [];
-/** @internal */
-export function useCategories(viewport) {
-    const categoriesPromise = useMemo(async () => loadCategoriesFromViewport(viewport), [viewport]);
+function useCategories(viewport, componentId) {
+    const categoriesPromise = useMemo(async () => loadCategoriesFromViewport(viewport, componentId), [viewport, componentId]);
     return useAsyncValue(categoriesPromise) ?? EMPTY_CATEGORIES_ARRAY;
 }
-function useAvailableModels(viewport) {
+function useAvailableModels(viewport, componentId) {
     const [availableModels, setAvailableModels] = useState([]);
     const imodel = viewport.iModel;
     const viewType = viewport.viewType === "2d" ? "2d" : "3d";
     useEffect(() => {
-        queryModelsForHeaderActions(imodel, viewType)
+        queryModelsForHeaderActions(imodel, viewType, componentId)
             .then((models) => {
             setAvailableModels(models);
         })
             .catch(() => {
             setAvailableModels([]);
         });
-    }, [imodel, viewType]);
+    }, [imodel, viewType, componentId]);
     return availableModels;
 }
-async function queryModelsForHeaderActions(iModel, viewType) {
+async function queryModelsForHeaderActions(iModel, viewType, componentId) {
     const { modelClass } = getClassesByView(viewType);
     const models = new Array();
     const query = `
@@ -107,7 +109,7 @@ async function queryModelsForHeaderActions(iModel, viewType) {
       m.IsPrivate = false
   `;
     for await (const _row of iModel.createQueryReader(query, undefined, {
-        restartToken: "tree-widget/categories-tree/all-models-query",
+        restartToken: `CategoriesTreeButtons/${componentId}/all-models`,
         rowFormat: QueryRowFormat.UseECSqlPropertyNames,
     })) {
         models.push(_row.id);

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTreeButtons.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategoriesTreeButtons.js","sourceRoot":"","sources":["../../../../../../src/tree-widget-react/components/trees/categories-tree/CategoriesTreeButtons.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 { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { useAsyncValue } from \"@itwin/components-react\";\nimport { QueryRowFormat } from \"@itwin/core-common\";\nimport { IconButton } from \"@stratakit/bricks\";\nimport visibilityHideSvg from \"@stratakit/icons/visibility-hide.svg\";\nimport visibilityInvertSvg from \"@stratakit/icons/visibility-invert.svg\";\nimport visibilityShowSvg from \"@stratakit/icons/visibility-show.svg\";\nimport { TreeWidget } from \"../../../TreeWidget.js\";\nimport { hideAllCategories, invertAllCategories } from \"../common/CategoriesVisibilityUtils.js\";\nimport { getClassesByView } from \"../common/internal/Utils.js\";\nimport { loadCategoriesFromViewport } from \"../common/internal/VisibilityUtils.js\";\nimport { hideAllModels, showAll } from \"../common/Utils.js\";\n\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport type { Id64Array } from \"@itwin/core-bentley\";\nimport type { TreeToolbarButtonProps } from \"../../tree-header/SelectableTree.js\";\nimport type { CategoryInfo } from \"../common/CategoriesVisibilityUtils.js\";\nimport type { ModelId } from \"../common/internal/Types.js\";\nimport type { TreeWidgetViewport } from \"../common/TreeWidgetViewport.js\";\n\n/**\n * Props that get passed to `CategoriesTreeComponent` header button renderer.\n * @see CategoriesTreeComponentProps.headerButtons\n * @public\n */\nexport interface CategoriesTreeHeaderButtonProps extends TreeToolbarButtonProps {\n  /** A list of categories available in the iModel */\n  categories: CategoryInfo[];\n  /** A list of models available in the iModel. */\n  models: Id64Array;\n}\n\n/**\n * Custom hook that creates props required to render `CategoriesTreeComponent` header button.\n *\n * Example:\n * ```tsx\n * const { buttonProps, onCategoriesFiltered } = useCategoriesTreeButtonProps({ viewport });\n * <TreeWithHeader\n *   buttons={[\n *     <CategoriesTreeComponent.ShowAllButton {...buttonProps} />,\n *     <CategoriesTreeComponent.HideAllButton {...buttonProps} />,\n *   ]}\n * >\n *   <CategoriesTree {...treeProps} onCategoriesFiltered={onCategoriesFiltered} />\n * </TreeWithHeader>\n * ```\n *\n * @public\n */\nexport function useCategoriesTreeButtonProps({ viewport }: { viewport: TreeWidgetViewport }): {\n  buttonProps: Pick<CategoriesTreeHeaderButtonProps, \"categories\" | \"viewport\" | \"models\">;\n  onCategoriesFiltered: (props: { categories: CategoryInfo[] | undefined; models?: Id64Array }) => void;\n} {\n  const [filteredCategories, setFilteredCategories] = useState<CategoryInfo[] | undefined>();\n  const [filteredModels, setFilteredModels] = useState<Id64Array | undefined>();\n\n  const categories = useCategories(viewport);\n  const models = useAvailableModels(viewport);\n  return {\n    buttonProps: {\n      viewport,\n      categories: filteredCategories ?? categories,\n      models: filteredModels ?? models,\n    },\n    onCategoriesFiltered: useCallback((props) => {\n      setFilteredCategories(props.categories);\n      setFilteredModels(props.models);\n    }, []),\n  };\n}\n\n/** @public */\nexport type CategoriesTreeHeaderButtonType = (props: CategoriesTreeHeaderButtonProps) => React.ReactElement | null;\n\n/** @public */\nexport function ShowAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      variant={\"ghost\"}\n      label={TreeWidget.translate(\"categoriesTree.buttons.showAll.tooltip\")}\n      onClick={() => {\n        // cspell:disable-next-line\n        props.onFeatureUsed?.(`categories-tree-showall`);\n        void showAll({ models: props.models, viewport: props.viewport, categories: props.categories.map((category) => category.categoryId) });\n      }}\n      icon={visibilityShowSvg}\n    />\n  );\n}\n\n/** @public */\nexport function HideAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      variant={\"ghost\"}\n      label={TreeWidget.translate(\"categoriesTree.buttons.hideAll.tooltip\")}\n      onClick={() => {\n        // cspell:disable-next-line\n        props.onFeatureUsed?.(`categories-tree-hideall`);\n        void hideAllCategories(\n          props.categories.map((category) => category.categoryId),\n          props.viewport,\n        );\n        hideAllModels(props.models, props.viewport);\n      }}\n      icon={visibilityHideSvg}\n    />\n  );\n}\n\n/** @public */\nexport function InvertAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      variant={\"ghost\"}\n      label={TreeWidget.translate(\"categoriesTree.buttons.invert.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(`categories-tree-invert`);\n        void invertAllCategories(props.categories, props.viewport);\n      }}\n      icon={visibilityInvertSvg}\n    />\n  );\n}\n\nconst EMPTY_CATEGORIES_ARRAY: CategoryInfo[] = [];\n\n/** @internal */\nexport function useCategories(viewport: TreeWidgetViewport) {\n  const categoriesPromise = useMemo(async () => loadCategoriesFromViewport(viewport), [viewport]);\n  return useAsyncValue(categoriesPromise) ?? EMPTY_CATEGORIES_ARRAY;\n}\n\nfunction useAvailableModels(viewport: TreeWidgetViewport): Array<ModelId> {\n  const [availableModels, setAvailableModels] = useState<Array<ModelId>>([]);\n  const imodel = viewport.iModel;\n  const viewType = viewport.viewType === \"2d\" ? \"2d\" : \"3d\";\n  useEffect(() => {\n    queryModelsForHeaderActions(imodel, viewType)\n      .then((models) => {\n        setAvailableModels(models);\n      })\n      .catch(() => {\n        setAvailableModels([]);\n      });\n  }, [imodel, viewType]);\n\n  return availableModels;\n}\n\nasync function queryModelsForHeaderActions(iModel: IModelConnection, viewType: \"2d\" | \"3d\"): Promise<Array<ModelId>> {\n  const { modelClass } = getClassesByView(viewType);\n  const models = new Array<ModelId>();\n  const query = `\n    SELECT\n      m.ECInstanceId id\n    FROM\n      ${modelClass} m\n    WHERE\n      m.IsPrivate = false\n  `;\n  for await (const _row of iModel.createQueryReader(query, undefined, {\n    restartToken: \"tree-widget/categories-tree/all-models-query\",\n    rowFormat: QueryRowFormat.UseECSqlPropertyNames,\n  })) {\n    models.push(_row.id);\n  }\n  return models;\n}\n"]}
+{"version":3,"file":"CategoriesTreeButtons.js","sourceRoot":"","sources":["../../../../../../src/tree-widget-react/components/trees/categories-tree/CategoriesTreeButtons.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 { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { useAsyncValue } from \"@itwin/components-react\";\nimport { QueryRowFormat } from \"@itwin/core-common\";\nimport { IconButton } from \"@stratakit/bricks\";\nimport visibilityHideSvg from \"@stratakit/icons/visibility-hide.svg\";\nimport visibilityInvertSvg from \"@stratakit/icons/visibility-invert.svg\";\nimport visibilityShowSvg from \"@stratakit/icons/visibility-show.svg\";\nimport { TreeWidget } from \"../../../TreeWidget.js\";\nimport { hideAllCategories, invertAllCategories } from \"../common/CategoriesVisibilityUtils.js\";\nimport { useGuid } from \"../common/internal/useGuid.js\";\nimport { getClassesByView } from \"../common/internal/Utils.js\";\nimport { loadCategoriesFromViewport } from \"../common/internal/VisibilityUtils.js\";\nimport { hideAllModels, showAll } from \"../common/Utils.js\";\n\nimport type { GuidString, Id64Array } from \"@itwin/core-bentley\";\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport type { TreeToolbarButtonProps } from \"../../tree-header/SelectableTree.js\";\nimport type { CategoryInfo } from \"../common/CategoriesVisibilityUtils.js\";\nimport type { ModelId } from \"../common/internal/Types.js\";\nimport type { TreeWidgetViewport } from \"../common/TreeWidgetViewport.js\";\n\n/**\n * Props that get passed to `CategoriesTreeComponent` header button renderer.\n * @see CategoriesTreeComponentProps.headerButtons\n * @public\n */\nexport interface CategoriesTreeHeaderButtonProps extends TreeToolbarButtonProps {\n  /** A list of categories available in the iModel */\n  categories: CategoryInfo[];\n  /** A list of models available in the iModel. */\n  models: Id64Array;\n}\n\n/**\n * Custom hook that creates props required to render `CategoriesTreeComponent` header button.\n *\n * Example:\n * ```tsx\n * const { buttonProps, onCategoriesFiltered } = useCategoriesTreeButtonProps({ viewport });\n * <TreeWithHeader\n *   buttons={[\n *     <CategoriesTreeComponent.ShowAllButton {...buttonProps} />,\n *     <CategoriesTreeComponent.HideAllButton {...buttonProps} />,\n *   ]}\n * >\n *   <CategoriesTree {...treeProps} onCategoriesFiltered={onCategoriesFiltered} />\n * </TreeWithHeader>\n * ```\n *\n * @public\n */\nexport function useCategoriesTreeButtonProps({ viewport }: { viewport: TreeWidgetViewport }): {\n  buttonProps: Pick<CategoriesTreeHeaderButtonProps, \"categories\" | \"viewport\" | \"models\">;\n  onCategoriesFiltered: (props: { categories: CategoryInfo[] | undefined; models?: Id64Array }) => void;\n} {\n  const [filteredCategories, setFilteredCategories] = useState<CategoryInfo[] | undefined>();\n  const [filteredModels, setFilteredModels] = useState<Id64Array | undefined>();\n\n  const componentId = useGuid();\n  const categories = useCategories(viewport, componentId);\n  const models = useAvailableModels(viewport, componentId);\n\n  return {\n    buttonProps: {\n      viewport,\n      categories: filteredCategories ?? categories,\n      models: filteredModels ?? models,\n    },\n    onCategoriesFiltered: useCallback((props) => {\n      setFilteredCategories(props.categories);\n      setFilteredModels(props.models);\n    }, []),\n  };\n}\n\n/** @public */\nexport type CategoriesTreeHeaderButtonType = (props: CategoriesTreeHeaderButtonProps) => React.ReactElement | null;\n\n/** @public */\nexport function ShowAllButton(props: CategoriesTreeHeaderButtonProps) {\n  const componentId = useGuid();\n  return (\n    <IconButton\n      variant={\"ghost\"}\n      label={TreeWidget.translate(\"categoriesTree.buttons.showAll.tooltip\")}\n      onClick={() => {\n        // cspell:disable-next-line\n        props.onFeatureUsed?.(`categories-tree-showall`);\n        void showAll({ models: props.models, viewport: props.viewport, categories: props.categories.map((category) => category.categoryId), componentId });\n      }}\n      icon={visibilityShowSvg}\n    />\n  );\n}\n\n/** @public */\nexport function HideAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      variant={\"ghost\"}\n      label={TreeWidget.translate(\"categoriesTree.buttons.hideAll.tooltip\")}\n      onClick={() => {\n        // cspell:disable-next-line\n        props.onFeatureUsed?.(`categories-tree-hideall`);\n        void hideAllCategories(\n          props.categories.map((category) => category.categoryId),\n          props.viewport,\n        );\n        hideAllModels(props.models, props.viewport);\n      }}\n      icon={visibilityHideSvg}\n    />\n  );\n}\n\n/** @public */\nexport function InvertAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      variant={\"ghost\"}\n      label={TreeWidget.translate(\"categoriesTree.buttons.invert.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(`categories-tree-invert`);\n        void invertAllCategories(props.categories, props.viewport);\n      }}\n      icon={visibilityInvertSvg}\n    />\n  );\n}\n\nconst EMPTY_CATEGORIES_ARRAY: CategoryInfo[] = [];\n\nfunction useCategories(viewport: TreeWidgetViewport, componentId: GuidString) {\n  const categoriesPromise = useMemo(async () => loadCategoriesFromViewport(viewport, componentId), [viewport, componentId]);\n  return useAsyncValue(categoriesPromise) ?? EMPTY_CATEGORIES_ARRAY;\n}\n\nfunction useAvailableModels(viewport: TreeWidgetViewport, componentId: GuidString): Array<ModelId> {\n  const [availableModels, setAvailableModels] = useState<Array<ModelId>>([]);\n  const imodel = viewport.iModel;\n  const viewType = viewport.viewType === \"2d\" ? \"2d\" : \"3d\";\n  useEffect(() => {\n    queryModelsForHeaderActions(imodel, viewType, componentId)\n      .then((models) => {\n        setAvailableModels(models);\n      })\n      .catch(() => {\n        setAvailableModels([]);\n      });\n  }, [imodel, viewType, componentId]);\n\n  return availableModels;\n}\n\nasync function queryModelsForHeaderActions(iModel: IModelConnection, viewType: \"2d\" | \"3d\", componentId: GuidString): Promise<Array<ModelId>> {\n  const { modelClass } = getClassesByView(viewType);\n  const models = new Array<ModelId>();\n  const query = `\n    SELECT\n      m.ECInstanceId id\n    FROM\n      ${modelClass} m\n    WHERE\n      m.IsPrivate = false\n  `;\n  for await (const _row of iModel.createQueryReader(query, undefined, {\n    restartToken: `CategoriesTreeButtons/${componentId}/all-models`,\n    rowFormat: QueryRowFormat.UseECSqlPropertyNames,\n  })) {\n    models.push(_row.id);\n  }\n  return models;\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTreeComponent.d.ts

@@ -2,7 +2,7 @@ import type { TreeWidgetViewport } from "../common/TreeWidgetViewport.js";
 import type { CategoriesTreeProps } from "./CategoriesTree.js";
 import type { CategoriesTreeHeaderButtonProps, CategoriesTreeHeaderButtonType } from "./CategoriesTreeButtons.js";
 /** @public */
-interface CategoriesTreeComponentProps extends Pick<CategoriesTreeProps, "selectionStorage" | "hierarchyLevelConfig" | "selectionMode" | "filter" | "emptyTreeContent" | "getInlineActions" | "getMenuActions" | "getDecorations" | "hierarchyConfig"> {
+interface CategoriesTreeComponentProps extends Pick<CategoriesTreeProps, "selectionStorage" | "hierarchyLevelConfig" | "selectionMode" | "filter" | "emptyTreeContent" | "getInlineActions" | "getMenuActions" | "getDecorations" | "hierarchyConfig" | "treeLabel"> {
     /**
      * Renderers of header buttons. Defaults to:
      * ```ts