npm - @itwin/tree-widget-react - Versions diffs - 4.0.0-alpha.24 → 4.0.0-alpha.26 - Mend

@itwin/tree-widget-react 4.0.0-alpha.24 → 4.0.0-alpha.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (205) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,9 +1,43 @@
 # Change Log - @itwin/tree-widget-react
-<!-- This log was last generated on Thu, 20 Nov 2025 11:23:22 GMT and should not be manually modified. -->
+<!-- This log was last generated on Tue, 24 Feb 2026 07:54:06 GMT and should not be manually modified. -->
 <!-- Start content -->
+## 3.17.7
+Tue, 24 Feb 2026 07:54:06 GMT
+### Patches
+- Consume the latest iTwin.js Core patch that improves performance of category display changes. Requires iTwin.js Core packages @ `5.7.0`. ([#1605](https://github.com/iTwin/viewer-components-react/pull/1605))
+## 3.17.6
+Mon, 09 Feb 2026 12:17:01 GMT
+### Patches
+- Bump dependencies ([#1583](https://github.com/iTwin/viewer-components-react/pull/1583))
+- Models tree: use cached category ids to query model children. ([#1585](https://github.com/iTwin/viewer-components-react/pull/1585))
+## 3.17.5
+Wed, 21 Jan 2026 12:50:36 GMT
+### Patches
+- Fix enabling category display in categories tree making other categories also visible, when their elements are under hidden model. ([#1556](https://github.com/iTwin/viewer-components-react/pull/1556))
+## 3.17.4
+Thu, 15 Jan 2026 14:30:28 GMT
+### Patches
+- Models tree: Improve performance of loading element nodes ([#1544](https://github.com/iTwin/viewer-components-react/pull/1544))
+- Models tree: Remove unnecessary checks when ModelsTreeVisibilityHandlerOverrides are provided. ([#1546](https://github.com/iTwin/viewer-components-react/pull/1546))
 ## 3.17.3
 Thu, 20 Nov 2025 11:23:22 GMT

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

@@ -11,6 +11,7 @@ import { Icon } from "@stratakit/foundations";
 import hierarchyTreeSvg from "@stratakit/icons/hierarchy-tree.svg";
 import { TreeWidget } from "../TreeWidget.js";
 import { ErrorState } from "./tree-header/ErrorState.js";
+import { SharedTreeContextProvider } from "./trees/index.js";
 import { TreeWidgetComponentImpl } from "./TreeWidgetComponentImpl.js";
 /**
  * Creates a tree widget definition that should be returned from `UiItemsProvider.getWidgets()`.
@@ -36,7 +37,7 @@ export function createTreeWidget(props) {
  */
 export function TreeWidgetComponent(props) {
     const ref = useTreeWidgetTransientState();
-    return (_jsx("div", { ref: ref, className: "tree-widget", children: _jsx(ErrorBoundary, { FallbackComponent: ErrorState, children: _jsx(TreeWidgetComponentImpl, { ...props }) }) }));
+    return (_jsx("div", { ref: ref, className: "tree-widget", children: _jsx(ErrorBoundary, { FallbackComponent: ErrorState, children: _jsx(SharedTreeContextProvider, { children: _jsx(TreeWidgetComponentImpl, { ...props }) }) }) }));
 }
 function useTreeWidgetTransientState() {
     const { ref, persist, restore } = useTreeStorage();

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

	@@ -1 +1 @@
1	- {"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"]}
1	+ {"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,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAC7D,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,yBAAyB,cACxB,KAAC,uBAAuB,OAAK,KAAK,GAAI,GACZ,GACd,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 { SharedTreeContextProvider } from \"./trees/index.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 <SharedTreeContextProvider>\n <TreeWidgetComponentImpl {...props} />\n </SharedTreeContextProvider>\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/WidgetHeader.js CHANGED Viewed

@@ -23,7 +23,7 @@ export function WidgetHeader({ defaultSelectedContentId, trees, onSelect, onSear
                         const treeId = e.target.value;
                         onSelect(treeId);
                         setSelectedContentId(treeId);
-                    }, children: trees.map((tree) => (_jsx("option", { value: tree.id, children: tree.label }, tree.id))) }) })), selectedContent.isSearchable && (_jsx(DebouncedSearchBox, { className: "tw-content-header-search", isOpened: isSearchOpen, setIsOpened: setIsSearchOpen, onSearch: onSearch, delay: 20 }))] }));
+                    }, children: trees.map((tree) => (_jsx("option", { value: tree.id, children: tree.label }, tree.id))) }) })), selectedContent.isSearchable && (_jsx(DebouncedSearchBox, { className: "tw-content-header-search", isOpened: isSearchOpen, setIsOpened: setIsSearchOpen, onSearch: onSearch, delay: 300 }))] }));
 }
 function LoadingHeader() {
     return (_jsxs("div", { className: "tw-content-header", children: [_jsx(Skeleton, { variant: "text", size: "xlarge" }), _jsx(Skeleton, { variant: "object", size: "medium" })] }));

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

	@@ -1 +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;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"]}
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;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,GAAG,GAAI,CACpJ,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={300} />\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 CHANGED Viewed

@@ -7,6 +7,9 @@ export type CategoriesTreeProps = Pick<ExtendedVisibilityTreeRendererProps, "get
         sizeLimit?: number;
     };
 };
-/** @beta */
+/**
+ * Requires `SharedTreeContextProvider` to be present in component above.
+ * @beta
+ */
 export declare function CategoriesTree({ imodel, selectionStorage, activeView, searchText, hierarchyLevelConfig, hierarchyConfig, selectionMode, onCategoriesFiltered, emptyTreeContent, getInlineActions, getMenuActions, getContextMenuActions, getTreeItemProps, 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 CHANGED Viewed

@@ -6,7 +6,10 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { VisibilityTree } from "../common/components/VisibilityTree.js";
 import { VisibilityTreeRenderer } from "../common/components/VisibilityTreeRenderer.js";
 import { useCategoriesTree } from "./UseCategoriesTree.js";
-/** @beta */
+/**
+ * Requires `SharedTreeContextProvider` to be present in component above.
+ * @beta
+ */
 export function CategoriesTree({ imodel, selectionStorage, activeView, searchText, hierarchyLevelConfig, hierarchyConfig, selectionMode, onCategoriesFiltered, emptyTreeContent, getInlineActions, getMenuActions, getContextMenuActions, getTreeItemProps, treeLabel, }) {
     const categoriesTree = useCategoriesTree({
         searchText,

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

	@@ -1 +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;AAkB3D~~,YAAY~~;~~AACZ~~,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,EACN,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,oBAAoB,EACpB,gBAAgB,EAChB,gBAAgB,EAChB,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAChB,SAAS,GACW;IACpB,MAAM,cAAc,GAAG,iBAAiB,CAAC;QACvC,UAAU;QACV,UAAU;QACV,oBAAoB;QACpB,gBAAgB;QAChB,eAAe;QACf,gBAAgB;KACjB,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,cAAc,OACT,cAAc,CAAC,SAAS,EAC5B,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,EACb,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,gBAAgB,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAC5F,cAAc,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,cAAc,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EACtF,qBAAqB,EAAE,qBAAqB,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,qBAAqB,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAC3G,gBAAgB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,cAAc,CAAC,gBAAgB,CAAC,IAAI,EAAE,SAAS,CAAC,GAC5E,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 { ExtendedVisibilityTreeRendererProps } from \"../common/components/VisibilityTreeRenderer.js\";\nimport type { UseCategoriesTreeProps } from \"./UseCategoriesTree.js\";\n\n/** @beta /\nexport type CategoriesTreeProps = Pick<\n ExtendedVisibilityTreeRendererProps,\n \"getInlineActions\" \| \"getMenuActions\" \| \"getContextMenuActions\" \| \"getTreeItemProps\" \| \"treeLabel\"\n> &\n Pick<VisibilityTreeProps, \"imodel\" \| \"selectionStorage\" \| \"selectionMode\" \| \"emptyTreeContent\"> &\n UseCategoriesTreeProps & {\n hierarchyLevelConfig?: {\n sizeLimit?: number;\n };\n };\n\n/* @beta */\nexport function CategoriesTree({\n imodel,\n selectionStorage,\n activeView,\n searchText,\n hierarchyLevelConfig,\n hierarchyConfig,\n selectionMode,\n onCategoriesFiltered,\n emptyTreeContent,\n getInlineActions,\n getMenuActions,\n getContextMenuActions,\n getTreeItemProps,\n treeLabel,\n}: CategoriesTreeProps) {\n const categoriesTree = useCategoriesTree({\n searchText,\n activeView,\n onCategoriesFiltered,\n emptyTreeContent,\n hierarchyConfig,\n getTreeItemProps,\n });\n\n return (\n <VisibilityTree\n {...categoriesTree.treeProps}\n imodel={imodel}\n selectionStorage={selectionStorage}\n hierarchyLevelSizeLimit={hierarchyLevelConfig?.sizeLimit}\n selectionMode={selectionMode ?? \"none\"}\n treeRenderer={(treeProps) => (\n <VisibilityTreeRenderer\n {...treeProps}\n treeLabel={treeLabel}\n getInlineActions={getInlineActions ? (node) => getInlineActions(node, treeProps) : undefined}\n getMenuActions={getMenuActions ? (node) => getMenuActions(node, treeProps) : undefined}\n getContextMenuActions={getContextMenuActions ? (node) => getContextMenuActions(node, treeProps) : undefined}\n getTreeItemProps={(node) => categoriesTree.getTreeItemProps(node, treeProps)}\n />\n )}\n />\n );\n}\n"]}
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;AAkB3D;;;GAGG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,EACN,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,oBAAoB,EACpB,gBAAgB,EAChB,gBAAgB,EAChB,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAChB,SAAS,GACW;IACpB,MAAM,cAAc,GAAG,iBAAiB,CAAC;QACvC,UAAU;QACV,UAAU;QACV,oBAAoB;QACpB,gBAAgB;QAChB,eAAe;QACf,gBAAgB;KACjB,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,cAAc,OACT,cAAc,CAAC,SAAS,EAC5B,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,EACb,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,gBAAgB,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAC5F,cAAc,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,cAAc,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EACtF,qBAAqB,EAAE,qBAAqB,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,qBAAqB,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAC3G,gBAAgB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,cAAc,CAAC,gBAAgB,CAAC,IAAI,EAAE,SAAS,CAAC,GAC5E,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 { ExtendedVisibilityTreeRendererProps } from \"../common/components/VisibilityTreeRenderer.js\";\nimport type { UseCategoriesTreeProps } from \"./UseCategoriesTree.js\";\n\n/** @beta /\nexport type CategoriesTreeProps = Pick<\n ExtendedVisibilityTreeRendererProps,\n \"getInlineActions\" \| \"getMenuActions\" \| \"getContextMenuActions\" \| \"getTreeItemProps\" \| \"treeLabel\"\n> &\n Pick<VisibilityTreeProps, \"imodel\" \| \"selectionStorage\" \| \"selectionMode\" \| \"emptyTreeContent\"> &\n UseCategoriesTreeProps & {\n hierarchyLevelConfig?: {\n sizeLimit?: number;\n };\n };\n\n/\n Requires `SharedTreeContextProvider` to be present in component above.\n * @beta\n */\nexport function CategoriesTree({\n imodel,\n selectionStorage,\n activeView,\n searchText,\n hierarchyLevelConfig,\n hierarchyConfig,\n selectionMode,\n onCategoriesFiltered,\n emptyTreeContent,\n getInlineActions,\n getMenuActions,\n getContextMenuActions,\n getTreeItemProps,\n treeLabel,\n}: CategoriesTreeProps) {\n const categoriesTree = useCategoriesTree({\n searchText,\n activeView,\n onCategoriesFiltered,\n emptyTreeContent,\n hierarchyConfig,\n getTreeItemProps,\n });\n\n return (\n <VisibilityTree\n {...categoriesTree.treeProps}\n imodel={imodel}\n selectionStorage={selectionStorage}\n hierarchyLevelSizeLimit={hierarchyLevelConfig?.sizeLimit}\n selectionMode={selectionMode ?? \"none\"}\n treeRenderer={(treeProps) => (\n <VisibilityTreeRenderer\n {...treeProps}\n treeLabel={treeLabel}\n getInlineActions={getInlineActions ? (node) => getInlineActions(node, treeProps) : undefined}\n getMenuActions={getMenuActions ? (node) => getMenuActions(node, treeProps) : undefined}\n getContextMenuActions={getContextMenuActions ? (node) => getContextMenuActions(node, treeProps) : undefined}\n getTreeItemProps={(node) => categoriesTree.getTreeItemProps(node, treeProps)}\n />\n )}\n />\n );\n}\n"]}

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

@@ -29,6 +29,7 @@ export interface CategoriesTreeHeaderButtonProps extends TreeToolbarButtonProps
  * </TreeWithHeader>
  * ```
  *
+ * **Note:** Requires `SharedTreeContextProvider` to be present in components tree above.
  * @public
  */
 export declare function useCategoriesTreeButtonProps({ viewport }: {

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

@@ -4,18 +4,18 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import { useCallback, useEffect, useMemo, useState } from "react";
+import { firstValueFrom, forkJoin, mergeAll, mergeMap, of, toArray } from "rxjs";
 import { useAsyncValue } from "@itwin/components-react";
-import { QueryRowFormat } from "@itwin/core-common";
 import { IconButton } from "@stratakit/bricks";
 import visibilityHideSvg from "@stratakit/icons/visibility-hide.svg";
 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 { isBeSqliteInterruptError, useErrorState } from "../common/internal/UseErrorState.js";
+import { useSharedTreeContextInternal } from "../common/internal/SharedTreeContextProviderInternal.js";
+import { useErrorState } from "../common/internal/UseErrorState.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";
 /**
  * Custom hook that creates props required to render `CategoriesTreeComponent` header button.
@@ -33,14 +33,14 @@ import { hideAllModels, showAll } from "../common/Utils.js";
  * </TreeWithHeader>
  * ```
  *
+ * **Note:** Requires `SharedTreeContextProvider` to be present in components tree above.
  * @public
  */
 export function useCategoriesTreeButtonProps({ viewport }) {
     const [filteredCategories, setFilteredCategories] = useState();
     const [filteredModels, setFilteredModels] = useState();
-    const componentId = useGuid();
-    const categories = useCategories(viewport, componentId);
-    const models = useAvailableModels(viewport, componentId);
+    const categories = useCategories(viewport);
+    const models = useAvailableModels(viewport);
     return {
         buttonProps: {
             viewport,
@@ -84,61 +84,50 @@ export function InvertAllButton(props) {
         }, icon: visibilityInvertSvg }));
 }
 const EMPTY_CATEGORIES_ARRAY = [];
-function useCategories(viewport, componentId) {
+function useCategories(viewport) {
     const setErrorState = useErrorState();
+    const { getBaseIdsCache } = useSharedTreeContextInternal();
+    const baseIdsCache = viewport.viewType !== "other"
+        ? getBaseIdsCache({ imodel: viewport.iModel, elementClassName: getClassesByView(viewport.viewType).elementClass, type: viewport.viewType })
+        : undefined;
     const categoriesPromise = useMemo(async () => {
         try {
-            return await loadCategoriesFromViewport(viewport, componentId);
+            if (baseIdsCache) {
+                return await firstValueFrom(baseIdsCache.getAllCategoriesOfElements().pipe(mergeAll(), mergeMap((categoryId) => forkJoin({ categoryId: of(categoryId), subCategories: baseIdsCache.getSubCategories({ categoryId }) })), toArray()));
+            }
+            return [];
         }
         catch (error) {
             setErrorState(error);
             return [];
         }
-    }, [viewport, componentId, setErrorState]);
+    }, [baseIdsCache, setErrorState]);
     return useAsyncValue(categoriesPromise) ?? EMPTY_CATEGORIES_ARRAY;
 }
-function useAvailableModels(viewport, componentId) {
+function useAvailableModels(viewport) {
     const [availableModels, setAvailableModels] = useState([]);
     const setErrorState = useErrorState();
     const imodel = viewport.iModel;
-    const viewType = viewport.viewType === "2d" ? "2d" : "3d";
+    const { getBaseIdsCache } = useSharedTreeContextInternal();
+    const baseIdsCache = viewport.viewType !== "other"
+        ? getBaseIdsCache({ imodel: viewport.iModel, elementClassName: getClassesByView(viewport.viewType).elementClass, type: viewport.viewType })
+        : undefined;
     useEffect(() => {
-        queryModelsForHeaderActions(imodel, viewType, componentId)
-            .then((models) => {
-            setAvailableModels(models);
-        })
-            .catch((error) => {
-            setErrorState(error);
-            setAvailableModels([]);
-        });
-    }, [imodel, viewType, componentId, setErrorState]);
+        const getModels = async () => {
+            try {
+                if (baseIdsCache) {
+                    const models = await firstValueFrom(baseIdsCache.getAllModels());
+                    setAvailableModels(models);
+                }
+                return;
+            }
+            catch (error) {
+                setErrorState(error);
+                setAvailableModels([]);
+            }
+        };
+        void getModels();
+    }, [imodel, baseIdsCache, setErrorState]);
     return availableModels;
 }
-async function queryModelsForHeaderActions(iModel, viewType, componentId) {
-    const { modelClass } = getClassesByView(viewType);
-    const models = new Array();
-    try {
-        const query = `
-      SELECT
-        m.ECInstanceId id
-      FROM
-        ${modelClass} m
-      WHERE
-        m.IsPrivate = false
-    `;
-        for await (const _row of iModel.createQueryReader(query, undefined, {
-            restartToken: `CategoriesTreeButtons/${componentId}/all-models`,
-            rowFormat: QueryRowFormat.UseECSqlPropertyNames,
-        })) {
-            models.push(_row.id);
-        }
-        return models;
-    }
-    catch (error) {
-        if (isBeSqliteInterruptError(error)) {
-            return [];
-        }
-        throw error;
-    }
-}
 //# sourceMappingURL=CategoriesTreeButtons.js.map

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

	@@ -1 +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 { isBeSqliteInterruptError, useErrorState } from \"../common/internal/UseErrorState.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({\n models: props.models,\n viewport: props.viewport,\n categories: props.categories.map((category) => category.categoryId),\n componentId,\n }).catch(() => {});\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 setErrorState = useErrorState();\n\n const categoriesPromise = useMemo(async () => {\n try {\n return await loadCategoriesFromViewport(viewport, componentId);\n } catch (error) {\n setErrorState(error);\n return [];\n }\n }, [viewport, componentId, setErrorState]);\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 setErrorState = useErrorState();\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((error) => {\n setErrorState(error);\n setAvailableModels([]);\n });\n }, [imodel, viewType, componentId, setErrorState]);\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 try {\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 } catch (error) {\n if (isBeSqliteInterruptError(error)) {\n return [];\n }\n throw error;\n }\n}\n"]}
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 { firstValueFrom, forkJoin, mergeAll, mergeMap, of, toArray } from \"rxjs\";\nimport { useAsyncValue } from \"@itwin/components-react\";\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 { useSharedTreeContextInternal } from \"../common/internal/SharedTreeContextProviderInternal.js\";\nimport { useErrorState } from \"../common/internal/UseErrorState.js\";\nimport { useGuid } from \"../common/internal/useGuid.js\";\nimport { getClassesByView } from \"../common/internal/Utils.js\";\nimport { hideAllModels, showAll } from \"../common/Utils.js\";\n\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 Note: Requires `SharedTreeContextProvider` to be present in components tree above.\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\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({\n models: props.models,\n viewport: props.viewport,\n categories: props.categories.map((category) => category.categoryId),\n componentId,\n }).catch(() => {});\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) {\n const setErrorState = useErrorState();\n const { getBaseIdsCache } = useSharedTreeContextInternal();\n const baseIdsCache =\n viewport.viewType !== \"other\"\n ? getBaseIdsCache({ imodel: viewport.iModel, elementClassName: getClassesByView(viewport.viewType).elementClass, type: viewport.viewType })\n : undefined;\n const categoriesPromise = useMemo(async () => {\n try {\n if (baseIdsCache) {\n return await firstValueFrom(\n baseIdsCache.getAllCategoriesOfElements().pipe(\n mergeAll(),\n mergeMap((categoryId) => forkJoin({ categoryId: of(categoryId), subCategories: baseIdsCache.getSubCategories({ categoryId }) })),\n toArray(),\n ),\n );\n }\n return [];\n } catch (error) {\n setErrorState(error);\n return [];\n }\n }, [baseIdsCache, setErrorState]);\n return useAsyncValue(categoriesPromise) ?? EMPTY_CATEGORIES_ARRAY;\n}\n\nfunction useAvailableModels(viewport: TreeWidgetViewport): Array<ModelId> {\n const [availableModels, setAvailableModels] = useState<Array<ModelId>>([]);\n const setErrorState = useErrorState();\n const imodel = viewport.iModel;\n const { getBaseIdsCache } = useSharedTreeContextInternal();\n const baseIdsCache =\n viewport.viewType !== \"other\"\n ? getBaseIdsCache({ imodel: viewport.iModel, elementClassName: getClassesByView(viewport.viewType).elementClass, type: viewport.viewType })\n : undefined;\n useEffect(() => {\n const getModels = async () => {\n try {\n if (baseIdsCache) {\n const models = await firstValueFrom(baseIdsCache.getAllModels());\n setAvailableModels(models);\n }\n return;\n } catch (error) {\n setErrorState(error);\n setAvailableModels([]);\n }\n };\n void getModels();\n }, [imodel, baseIdsCache, setErrorState]);\n\n return availableModels;\n}\n"]}

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

@@ -25,6 +25,8 @@ interface CategoriesTreeComponentProps extends Pick<CategoriesTreeProps, "select
 }
 /**
  * A component that renders `CategoriesTree` and a header with search capabilities and header buttons.
+ *
+ * **Note:** Wrap tree components with a single `SharedTreeContextProvider` to improve trees' performance.`
  * @public
  */
 export declare const CategoriesTreeComponent: {

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTreeComponent.js CHANGED Viewed

@@ -8,12 +8,15 @@ import { Fragment } from "react";
 import { useActiveIModelConnection } from "@itwin/appui-react";
 import { TreeWidget } from "../../../TreeWidget.js";
 import { SelectableTree } from "../../tree-header/SelectableTree.js";
+import { SharedTreeContextProviderInternal } from "../common/internal/SharedTreeContextProviderInternal.js";
 import { useActiveTreeWidgetViewport } from "../common/internal/UseActiveTreeWidgetViewport.js";
 import { TelemetryContextProvider } from "../common/UseTelemetryContext.js";
 import { CategoriesTree } from "./CategoriesTree.js";
 import { HideAllButton, InvertAllButton, ShowAllButton, useCategoriesTreeButtonProps } from "./CategoriesTreeButtons.js";
 /**
  * A component that renders `CategoriesTree` and a header with search capabilities and header buttons.
+ *
+ * **Note:** Wrap tree components with a single `SharedTreeContextProvider` to improve trees' performance.`
  * @public
  */
 export const CategoriesTreeComponent = (props) => {
@@ -22,7 +25,7 @@ export const CategoriesTreeComponent = (props) => {
     if (!iModel || !viewport) {
         return null;
     }
-    return _jsx(CategoriesTreeComponentImpl, { ...props, iModel: iModel, viewport: viewport });
+    return (_jsx(SharedTreeContextProviderInternal, { showWarning: true, children: _jsx(CategoriesTreeComponentImpl, { ...props, iModel: iModel, viewport: viewport }) }));
 };
 /**
  * Renders a "Show all" button that enables display of all categories and their subcategories.

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTreeComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CategoriesTreeComponent.js","sourceRoot":"","sources":["../../../../../../src/tree-widget-react/components/trees/categories-tree/CategoriesTreeComponent.tsx"],"names":[],"mappings":";;AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,2BAA2B,EAAE,MAAM,mDAAmD,CAAC;AAChG,OAAO,EAAE,wBAAwB,EAAE,MAAM,kCAAkC,CAAC;AAC5E,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,aAAa,EAAE,4BAA4B,EAAE,MAAM,4BAA4B,CAAC;~~AA6CzH;;;GAGG~~;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,KAAmC,EAAE,EAAE;IAC7E,MAAM,MAAM,GAAG,yBAAyB,EAAE,CAAC;IAC3C,MAAM,QAAQ,GAAG,2BAA2B,CAAC,EAAE,kBAAkB,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;IAErF,IAAI,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC;QACzB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,KAAC,2BAA2B,OAAK,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC;~~AACxF~~,CAAC,CAAC;AAEF;;;GAGG;AACH,uBAAuB,CAAC,aAAa,GAAG,aAA+C,CAAC;AAExF;;;GAGG;AACH,uBAAuB,CAAC,aAAa,GAAG,aAA+C,CAAC;AAExF;;;GAGG;AACH,uBAAuB,CAAC,eAAe,GAAG,eAAiD,CAAC;AAE5F;;;GAGG;AACH,uBAAuB,CAAC,EAAE,GAAG,oBAAoB,CAAC;AAElD;;;GAGG;AACH,uBAAuB,CAAC,QAAQ,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,SAAS,CAAC,sBAAsB,CAAC,CAAC;AAEtF,SAAS,2BAA2B,CAAC,EACnC,MAAM,EACN,QAAQ,EACR,aAAa,EACb,qBAAqB,EACrB,aAAa,EACb,UAAU,EACV,SAAS,EACT,GAAG,SAAS,EAC8E;IAC1F,MAAM,EAAE,WAAW,EAAE,oBAAoB,EAAE,GAAG,4BAA4B,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC;IAEzF,MAAM,OAAO,GAAc,aAAa;QACtC,CAAC,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,KAAC,QAAQ,cAAc,GAAG,CAAC,EAAE,GAAG,WAAW,EAAE,aAAa,EAAE,CAAC,IAA9C,KAAK,CAAqD,CAAC;QAC9G,CAAC,CAAC;YACE,eAAC,aAAa,OAAK,WAAW,EAAE,GAAG,EAAC,cAAc,EAAC,aAAa,EAAE,aAAa,GAAI;YACnF,eAAC,aAAa,OAAK,WAAW,EAAE,GAAG,EAAC,cAAc,EAAC,aAAa,EAAE,aAAa,GAAI;YACnF,eAAC,eAAe,OAAK,WAAW,EAAE,GAAG,EAAC,gBAAgB,EAAC,aAAa,EAAE,aAAa,GAAI;SACxF,CAAC;IAEN,OAAO,CACL,KAAC,wBAAwB,IAAC,mBAAmB,EAAE,uBAAuB,CAAC,EAAE,EAAE,aAAa,EAAE,aAAa,EAAE,qBAAqB,EAAE,qBAAqB,YACnJ,KAAC,cAAc,IAAC,OAAO,EAAE,OAAO,YAC9B,KAAC,cAAc,OACT,SAAS,EACb,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,QAAQ,EACpB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,oBAAoB,EAAE,oBAAoB,GAC1C,GACa,GACQ,CAC5B,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 { Fragment } from \"react\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { TreeWidget } from \"../../../TreeWidget.js\";\nimport { SelectableTree } from \"../../tree-header/SelectableTree.js\";\nimport { useActiveTreeWidgetViewport } from \"../common/internal/UseActiveTreeWidgetViewport.js\";\nimport { TelemetryContextProvider } from \"../common/UseTelemetryContext.js\";\nimport { CategoriesTree } from \"./CategoriesTree.js\";\nimport { HideAllButton, InvertAllButton, ShowAllButton, useCategoriesTreeButtonProps } from \"./CategoriesTreeButtons.js\";\n\nimport type { ReactNode } from \"react\";\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport type { TreeWidgetViewport } from \"../common/TreeWidgetViewport.js\";\nimport type { CategoriesTreeProps } from \"./CategoriesTree.js\";\nimport type { CategoriesTreeHeaderButtonProps, CategoriesTreeHeaderButtonType } from \"./CategoriesTreeButtons.js\";\n\n/** @public /\ninterface CategoriesTreeComponentProps\n extends Pick<\n CategoriesTreeProps,\n \| \"selectionStorage\"\n \| \"hierarchyLevelConfig\"\n \| \"selectionMode\"\n \| \"searchText\"\n \| \"emptyTreeContent\"\n \| \"getInlineActions\"\n \| \"getMenuActions\"\n \| \"getContextMenuActions\"\n \| \"getTreeItemProps\"\n \| \"hierarchyConfig\"\n \| \"treeLabel\"\n > {\n /\n Renderers of header buttons. Defaults to:\n * ```ts\n * [\n * CategoriesTreeComponent.ShowAllButton,\n * CategoriesTreeComponent.HideAllButton,\n * CategoriesTreeComponent.InvertAllButton,\n * ]\n * ```\n /\n headerButtons?: Array<(props: CategoriesTreeHeaderButtonProps) => React.ReactNode>;\n /\n Viewport used for visibility controls.\n \n When viewport is not provided, `IModelApp.viewManager.selectedView` will be used.\n /\n viewport?: TreeWidgetViewport;\n onPerformanceMeasured?: (featureId: string, duration: number) => void;\n onFeatureUsed?: (feature: string) => void;\n}\n\n/\n A component that renders `CategoriesTree` and a header with search capabilities and header buttons.\n * @public\n /\nexport const CategoriesTreeComponent = (props: CategoriesTreeComponentProps) => {\n const iModel = useActiveIModelConnection();\n const viewport = useActiveTreeWidgetViewport({ treeWidgetViewport: props.viewport });\n\n if (!iModel \|\| !viewport) {\n return null;\n }\n\n return <CategoriesTreeComponentImpl {...props} iModel={iModel} viewport={viewport} ~~/>;\~~n};\n\n/\n Renders a \"Show all\" button that enables display of all categories and their subcategories.\n * @public\n /\nCategoriesTreeComponent.ShowAllButton = ShowAllButton as CategoriesTreeHeaderButtonType;\n\n/\n Renders a \"Hide all\" button that disables display of all categories.\n * @public\n /\nCategoriesTreeComponent.HideAllButton = HideAllButton as CategoriesTreeHeaderButtonType;\n\n/\n Renders an \"Invert all\" button that inverts display of all categories.\n * @public\n /\nCategoriesTreeComponent.InvertAllButton = InvertAllButton as CategoriesTreeHeaderButtonType;\n\n/\n Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n /\nCategoriesTreeComponent.id = \"categories-tree-v2\";\n\n/\n Label of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nCategoriesTreeComponent.getLabel = () => TreeWidget.translate(\"categoriesTree.label\");\n\nfunction CategoriesTreeComponentImpl({\n iModel,\n viewport,\n headerButtons,\n onPerformanceMeasured,\n onFeatureUsed,\n searchText,\n treeLabel,\n ...treeProps\n}: CategoriesTreeComponentProps & { iModel: IModelConnection; viewport: TreeWidgetViewport }) {\n const { buttonProps, onCategoriesFiltered } = useCategoriesTreeButtonProps({ viewport });\n\n const buttons: ReactNode = headerButtons\n ? headerButtons.map((btn, index) => <Fragment key={index}>{btn({ ...buttonProps, onFeatureUsed })}</Fragment>)\n : [\n <ShowAllButton {...buttonProps} key=\"show-all-btn\" onFeatureUsed={onFeatureUsed} />,\n <HideAllButton {...buttonProps} key=\"hide-all-btn\" onFeatureUsed={onFeatureUsed} />,\n <InvertAllButton {...buttonProps} key=\"invert-all-btn\" onFeatureUsed={onFeatureUsed} />,\n ];\n\n return (\n <TelemetryContextProvider componentIdentifier={CategoriesTreeComponent.id} onFeatureUsed={onFeatureUsed} onPerformanceMeasured={onPerformanceMeasured}>\n <SelectableTree buttons={buttons}>\n <CategoriesTree\n {...treeProps}\n imodel={iModel}\n activeView={viewport}\n searchText={searchText}\n treeLabel={treeLabel}\n onCategoriesFiltered={onCategoriesFiltered}\n />\n </SelectableTree>\n </TelemetryContextProvider>\n );\n}\n"]}
1	+ {"version":3,"file":"CategoriesTreeComponent.js","sourceRoot":"","sources":["../../../../../../src/tree-widget-react/components/trees/categories-tree/CategoriesTreeComponent.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 { Fragment } from \"react\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { TreeWidget } from \"../../../TreeWidget.js\";\nimport { SelectableTree } from \"../../tree-header/SelectableTree.js\";\nimport { SharedTreeContextProviderInternal } from \"../common/internal/SharedTreeContextProviderInternal.js\";\nimport { useActiveTreeWidgetViewport } from \"../common/internal/UseActiveTreeWidgetViewport.js\";\nimport { TelemetryContextProvider } from \"../common/UseTelemetryContext.js\";\nimport { CategoriesTree } from \"./CategoriesTree.js\";\nimport { HideAllButton, InvertAllButton, ShowAllButton, useCategoriesTreeButtonProps } from \"./CategoriesTreeButtons.js\";\n\nimport type { ReactNode } from \"react\";\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport type { TreeWidgetViewport } from \"../common/TreeWidgetViewport.js\";\nimport type { CategoriesTreeProps } from \"./CategoriesTree.js\";\nimport type { CategoriesTreeHeaderButtonProps, CategoriesTreeHeaderButtonType } from \"./CategoriesTreeButtons.js\";\n\n/** @public /\ninterface CategoriesTreeComponentProps extends Pick<\n CategoriesTreeProps,\n \| \"selectionStorage\"\n \| \"hierarchyLevelConfig\"\n \| \"selectionMode\"\n \| \"searchText\"\n \| \"emptyTreeContent\"\n \| \"getInlineActions\"\n \| \"getMenuActions\"\n \| \"getContextMenuActions\"\n \| \"getTreeItemProps\"\n \| \"hierarchyConfig\"\n \| \"treeLabel\"\n> {\n /\n Renderers of header buttons. Defaults to:\n * ```ts\n * [\n * CategoriesTreeComponent.ShowAllButton,\n * CategoriesTreeComponent.HideAllButton,\n * CategoriesTreeComponent.InvertAllButton,\n * ]\n * ```\n /\n headerButtons?: Array<(props: CategoriesTreeHeaderButtonProps) => React.ReactNode>;\n /\n Viewport used for visibility controls.\n \n When viewport is not provided, `IModelApp.viewManager.selectedView` will be used.\n /\n viewport?: TreeWidgetViewport;\n onPerformanceMeasured?: (featureId: string, duration: number) => void;\n onFeatureUsed?: (feature: string) => void;\n}\n\n/\n A component that renders `CategoriesTree` and a header with search capabilities and header buttons.\n \n Note: Wrap tree components with a single `SharedTreeContextProvider` to improve trees' performance.`\n * @public\n /\nexport const CategoriesTreeComponent = (props: CategoriesTreeComponentProps) => {\n const iModel = useActiveIModelConnection();\n const viewport = useActiveTreeWidgetViewport({ treeWidgetViewport: props.viewport });\n\n if (!iModel \|\| !viewport) {\n return null;\n }\n\n return (\n <SharedTreeContextProviderInternal showWarning={true}>\n <CategoriesTreeComponentImpl {...props} iModel={iModel} viewport={viewport} />\n </SharedTreeContextProviderInternal>\n );\n};\n\n/\n Renders a \"Show all\" button that enables display of all categories and their subcategories.\n * @public\n /\nCategoriesTreeComponent.ShowAllButton = ShowAllButton as CategoriesTreeHeaderButtonType;\n\n/\n Renders a \"Hide all\" button that disables display of all categories.\n * @public\n /\nCategoriesTreeComponent.HideAllButton = HideAllButton as CategoriesTreeHeaderButtonType;\n\n/\n Renders an \"Invert all\" button that inverts display of all categories.\n * @public\n /\nCategoriesTreeComponent.InvertAllButton = InvertAllButton as CategoriesTreeHeaderButtonType;\n\n/\n Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n /\nCategoriesTreeComponent.id = \"categories-tree-v2\";\n\n/\n Label of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nCategoriesTreeComponent.getLabel = () => TreeWidget.translate(\"categoriesTree.label\");\n\nfunction CategoriesTreeComponentImpl({\n iModel,\n viewport,\n headerButtons,\n onPerformanceMeasured,\n onFeatureUsed,\n searchText,\n treeLabel,\n ...treeProps\n}: CategoriesTreeComponentProps & { iModel: IModelConnection; viewport: TreeWidgetViewport }) {\n const { buttonProps, onCategoriesFiltered } = useCategoriesTreeButtonProps({ viewport });\n\n const buttons: ReactNode = headerButtons\n ? headerButtons.map((btn, index) => <Fragment key={index}>{btn({ ...buttonProps, onFeatureUsed })}</Fragment>)\n : [\n <ShowAllButton {...buttonProps} key=\"show-all-btn\" onFeatureUsed={onFeatureUsed} />,\n <HideAllButton {...buttonProps} key=\"hide-all-btn\" onFeatureUsed={onFeatureUsed} />,\n <InvertAllButton {...buttonProps} key=\"invert-all-btn\" onFeatureUsed={onFeatureUsed} />,\n ];\n\n return (\n <TelemetryContextProvider componentIdentifier={CategoriesTreeComponent.id} onFeatureUsed={onFeatureUsed} onPerformanceMeasured={onPerformanceMeasured}>\n <SelectableTree buttons={buttons}>\n <CategoriesTree\n {...treeProps}\n imodel={iModel}\n activeView={viewport}\n searchText={searchText}\n treeLabel={treeLabel}\n onCategoriesFiltered={onCategoriesFiltered}\n />\n </SelectableTree>\n </TelemetryContextProvider>\n );\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/categories-tree/CategoriesTreeDefinition.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import { ProcessedHierarchyNode } from "@itwin/presentation-hierarchies";
 import type { GuidString } from "@itwin/core-bentley";
-import type { DefineHierarchyLevelProps, HierarchyDefinition, HierarchyLevelDefinition, LimitingECSqlQueryExecutor } from "@itwin/presentation-hierarchies";
+import type { DefineHierarchyLevelProps, HierarchyDefinition, HierarchyLevelDefinition, LimitingECSqlQueryExecutor, NodePreProcessor } from "@itwin/presentation-hierarchies";
 import type { ECClassHierarchyInspector, ECSchemaProvider } from "@itwin/presentation-shared";
 import type { NormalizedHierarchySearchPath } from "../common/Utils.js";
 import type { CategoriesTreeIdsCache } from "./internal/CategoriesTreeIdsCache.js";
@@ -38,16 +38,18 @@ export declare const defaultHierarchyConfiguration: CategoriesTreeHierarchyConfi
 export declare class CategoriesTreeDefinition implements HierarchyDefinition {
     #private;
     constructor(props: CategoriesTreeDefinitionProps);
+    preProcessNode: NodePreProcessor;
     postProcessNode(node: ProcessedHierarchyNode): Promise<ProcessedHierarchyNode>;
     private getHierarchyDefinition;
     defineHierarchyLevel(props: DefineHierarchyLevelProps): Promise<HierarchyLevelDefinition>;
     private createISubModeledElementChildrenQuery;
-    private createGeometricModel3dChildrenQuery;
+    private createGeometricModelChildrenQuery;
     private createDefinitionContainersAndCategoriesQuery;
     private createDefinitionContainersQuery;
     private createCategoriesQuery;
     private createCategoryChildrenQuery;
     private createSubCategoriesQuery;
+    private createElementChildrenCountSelector;
     private createCategoryElementsQuery;
     private createElementChildrenQuery;
     static createInstanceKeyPaths(props: CategoriesTreeInstanceKeyPathsFromInstanceLabelProps): Promise<NormalizedHierarchySearchPath[]>;