@itwin/tree-widget-react 2.3.2 → 3.0.0-dev.1

package/lib/cjs/components/trees/common/components/TreeNodeRenderer.d.ts

@@ -0,0 +1,13 @@
+import { TreeNodeRenderer as CoreTreeNodeRenderer } from "@itwin/presentation-hierarchies-react";
+import { TreeNodeCheckbox } from "./TreeNodeCheckbox";
+import type { ComponentPropsWithoutRef } from "react";
+type TreeNodeCheckboxProps = ComponentPropsWithoutRef<typeof TreeNodeCheckbox>;
+interface TreeNodeRendererOwnProps {
+    checkboxProps?: Omit<TreeNodeCheckboxProps, "node">;
+}
+type CoreTreeNodeRendererProps = ComponentPropsWithoutRef<typeof CoreTreeNodeRenderer>;
+type TreeNodeRendererProps = CoreTreeNodeRendererProps & TreeNodeRendererOwnProps;
+/** @internal */
+export declare function TreeNodeRenderer({ checkboxProps, ...props }: TreeNodeRendererProps): JSX.Element;
+export {};
+//# sourceMappingURL=TreeNodeRenderer.d.ts.map

package/lib/cjs/components/trees/common/components/TreeNodeRenderer.js

@@ -0,0 +1,20 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TreeNodeRenderer = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+const classnames_1 = __importDefault(require("classnames"));
+const presentation_hierarchies_react_1 = require("@itwin/presentation-hierarchies-react");
+const TreeNodeCheckbox_1 = require("./TreeNodeCheckbox");
+/** @internal */
+function TreeNodeRenderer({ checkboxProps, ...props }) {
+    return ((0, jsx_runtime_1.jsx)(presentation_hierarchies_react_1.TreeNodeRenderer, { ...props, nodeProps: { className: (0, classnames_1.default)("tw-tree-node", props.isSelected && "selected", props.className) }, actionButtonsClassName: "tw-tree-node-action-buttons", checkbox: checkboxProps ? (0, jsx_runtime_1.jsx)(TreeNodeCheckbox_1.TreeNodeCheckbox, { ...checkboxProps, node: props.node }) : null, contentProps: { className: "tw-tree-node-content" }, checkboxProps: { className: "tw-tree-node-checkbox-container" } }));
+}
+exports.TreeNodeRenderer = TreeNodeRenderer;
+//# sourceMappingURL=TreeNodeRenderer.js.map

package/lib/cjs/components/trees/common/components/TreeNodeRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeNodeRenderer.js","sourceRoot":"","sources":["../../../../../../src/components/trees/common/components/TreeNodeRenderer.tsx"],"names":[],"mappings":";;;;;;;AAAA;;;gGAGgG;AAEhG,4DAA4B;AAC5B,0FAAiG;AACjG,yDAAsD;AAatD,gBAAgB;AAChB,SAAgB,gBAAgB,CAAC,EAAE,aAAa,EAAE,GAAG,KAAK,EAAyB;IACjF,OAAO,CACL,uBAAC,iDAAoB,OACf,KAAK,EACT,SAAS,EAAE,EAAE,SAAS,EAAE,IAAA,oBAAE,EAAC,cAAc,EAAE,KAAK,CAAC,UAAU,IAAI,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,EAC7F,sBAAsB,EAAC,6BAA6B,EACpD,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,uBAAC,mCAAgB,OAAK,aAAa,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,GAAI,CAAC,CAAC,CAAC,IAAI,EAC1F,YAAY,EAAE,EAAE,SAAS,EAAE,sBAAsB,EAAE,EACnD,aAAa,EAAE,EAAE,SAAS,EAAE,iCAAiC,EAAE,GAC/D,CACH,CAAC;AACJ,CAAC;AAXD,4CAWC","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 cx from \"classnames\";\nimport { TreeNodeRenderer as CoreTreeNodeRenderer } from \"@itwin/presentation-hierarchies-react\";\nimport { TreeNodeCheckbox } from \"./TreeNodeCheckbox\";\n\nimport type { ComponentPropsWithoutRef } from \"react\";\n\ntype TreeNodeCheckboxProps = ComponentPropsWithoutRef<typeof TreeNodeCheckbox>;\n\ninterface TreeNodeRendererOwnProps {\n  checkboxProps?: Omit<TreeNodeCheckboxProps, \"node\">;\n}\n\ntype CoreTreeNodeRendererProps = ComponentPropsWithoutRef<typeof CoreTreeNodeRenderer>;\ntype TreeNodeRendererProps = CoreTreeNodeRendererProps & TreeNodeRendererOwnProps;\n\n/** @internal */\nexport function TreeNodeRenderer({ checkboxProps, ...props }: TreeNodeRendererProps) {\n  return (\n    <CoreTreeNodeRenderer\n      {...props}\n      nodeProps={{ className: cx(\"tw-tree-node\", props.isSelected && \"selected\", props.className) }}\n      actionButtonsClassName=\"tw-tree-node-action-buttons\"\n      checkbox={checkboxProps ? <TreeNodeCheckbox {...checkboxProps} node={props.node} /> : null}\n      contentProps={{ className: \"tw-tree-node-content\" }}\n      checkboxProps={{ className: \"tw-tree-node-checkbox-container\" }}\n    />\n  );\n}\n"]}

package/lib/cjs/components/trees/common/components/TreeRenderer.d.ts

@@ -0,0 +1,19 @@
+import "./TreeRenderer.scss";
+import { Tree } from "@itwin/itwinui-react";
+import { LocalizationContextProvider } from "@itwin/presentation-hierarchies-react";
+import { TreeNodeRenderer } from "./TreeNodeRenderer";
+import type { ComponentPropsWithoutRef } from "react";
+import type { PresentationHierarchyNode, PresentationTreeNode, RenderedTreeNode } from "@itwin/presentation-hierarchies-react";
+interface TreeRendererOwnProps {
+    rootNodes: PresentationTreeNode[];
+    isNodeSelected: (nodeId: string) => boolean;
+    onNodeDoubleClick?: (node: PresentationHierarchyNode, isSelected: boolean) => void;
+}
+type TreeRendererProps = Pick<TreeNodeRendererProps, "expandNode" | "onNodeClick" | "onNodeKeyDown" | "onFilterClick" | "getIcon" | "getLabel" | "getSublabel" | "getHierarchyLevelDetails" | "checkboxProps"> & Omit<TreeProps<RenderedTreeNode>, "data" | "nodeRenderer" | "getNode"> & Pick<LocalizationContextProviderProps, "localizedStrings"> & TreeRendererOwnProps;
+/** @internal */
+export declare function TreeRenderer({ rootNodes, expandNode, onNodeClick, onNodeKeyDown, onNodeDoubleClick, isNodeSelected, onFilterClick, getIcon, getLabel, getSublabel, getHierarchyLevelDetails, checkboxProps, localizedStrings, ...props }: TreeRendererProps): JSX.Element;
+type TreeProps<T> = ComponentPropsWithoutRef<typeof Tree<T>>;
+type TreeNodeRendererProps = ComponentPropsWithoutRef<typeof TreeNodeRenderer>;
+type LocalizationContextProviderProps = ComponentPropsWithoutRef<typeof LocalizationContextProvider>;
+export {};
+//# sourceMappingURL=TreeRenderer.d.ts.map

package/lib/cjs/components/trees/common/components/TreeRenderer.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TreeRenderer = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+require("./TreeRenderer.scss");
+const react_1 = require("react");
+const itwinui_react_1 = require("@itwin/itwinui-react");
+const presentation_hierarchies_react_1 = require("@itwin/presentation-hierarchies-react");
+const TreeNodeRenderer_1 = require("./TreeNodeRenderer");
+/** @internal */
+function TreeRenderer({ rootNodes, expandNode, onNodeClick, onNodeKeyDown, onNodeDoubleClick, isNodeSelected, onFilterClick, getIcon, getLabel, getSublabel, getHierarchyLevelDetails, checkboxProps, localizedStrings, ...props }) {
+    const nodeRenderer = (0, react_1.useCallback)((nodeProps) => {
+        return ((0, jsx_runtime_1.jsx)(TreeNodeRenderer_1.TreeNodeRenderer, { ...nodeProps, onNodeClick: (node, isSelected, event) => {
+                if (onNodeDoubleClick && event.detail === 2) {
+                    onNodeDoubleClick?.(node, !!nodeProps.isSelected);
+                    // Click node to not lose selection
+                    return onNodeClick?.(node, true, event);
+                }
+                onNodeClick?.(node, isSelected, event);
+            }, expandNode: expandNode, onNodeKeyDown: onNodeKeyDown, getIcon: getIcon, getLabel: getLabel, getSublabel: getSublabel, onFilterClick: onFilterClick, getHierarchyLevelDetails: getHierarchyLevelDetails, checkboxProps: checkboxProps, className: getSublabel ? "with-description" : "without-description" }));
+    }, [expandNode, onNodeClick, onNodeKeyDown, onNodeDoubleClick, getHierarchyLevelDetails, getIcon, getLabel, getSublabel, onFilterClick, checkboxProps]);
+    const getNode = (0, react_1.useCallback)((node) => (0, presentation_hierarchies_react_1.createRenderedTreeNodeData)(node, isNodeSelected), [isNodeSelected]);
+    return ((0, jsx_runtime_1.jsx)(presentation_hierarchies_react_1.LocalizationContextProvider, { localizedStrings: localizedStrings, children: (0, jsx_runtime_1.jsx)(itwinui_react_1.Tree, { ...props, className: "tw-tree-renderer", data: rootNodes, nodeRenderer: nodeRenderer, getNode: getNode, enableVirtualization: true }) }));
+}
+exports.TreeRenderer = TreeRenderer;
+//# sourceMappingURL=TreeRenderer.js.map

package/lib/cjs/components/trees/common/components/TreeRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeRenderer.js","sourceRoot":"","sources":["../../../../../../src/components/trees/common/components/TreeRenderer.tsx"],"names":[],"mappings":";;;;AAAA;;;gGAGgG;AAEhG,+BAA6B;AAC7B,iCAAoC;AACpC,wDAA4C;AAC5C,0FAAgH;AAChH,yDAAsD;AAmBtD,gBAAgB;AAChB,SAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,UAAU,EACV,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,aAAa,EACb,OAAO,EACP,QAAQ,EACR,WAAW,EACX,wBAAwB,EACxB,aAAa,EACb,gBAAgB,EAChB,GAAG,KAAK,EACU;IAClB,MAAM,YAAY,GAAG,IAAA,mBAAW,EAC9B,CAAC,SAAS,EAAE,EAAE;QACZ,OAAO,CACL,uBAAC,mCAAgB,OACX,SAAS,EACb,WAAW,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE;gBACvC,IAAI,iBAAiB,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;oBAC3C,iBAAiB,EAAE,CAAC,IAAI,EAAE,CAAC,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;oBAClD,mCAAmC;oBACnC,OAAO,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;iBACzC;gBACD,WAAW,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;YACzC,CAAC,EACD,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,wBAAwB,EAAE,wBAAwB,EAClD,aAAa,EAAE,aAAa,EAC5B,SAAS,EAAE,WAAW,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,qBAAqB,GACnE,CACH,CAAC;IACJ,CAAC,EACD,CAAC,UAAU,EAAE,WAAW,EAAE,aAAa,EAAE,iBAAiB,EAAE,wBAAwB,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,aAAa,EAAE,aAAa,CAAC,CACpJ,CAAC;IAEF,MAAM,OAAO,GAAG,IAAA,mBAAW,EAAyC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAA,2DAA0B,EAAC,IAAI,EAAE,cAAc,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAElJ,OAAO,CACL,uBAAC,4DAA2B,IAAC,gBAAgB,EAAE,gBAAgB,YAC7D,uBAAC,oBAAI,OACC,KAAK,EACT,SAAS,EAAC,kBAAkB,EAC5B,IAAI,EAAE,SAAS,EACf,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,EAChB,oBAAoB,EAAE,IAAI,GAC1B,GAC0B,CAC/B,CAAC;AACJ,CAAC;AA1DD,oCA0DC","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 \"./TreeRenderer.scss\";\nimport { useCallback } from \"react\";\nimport { Tree } from \"@itwin/itwinui-react\";\nimport { createRenderedTreeNodeData, LocalizationContextProvider } from \"@itwin/presentation-hierarchies-react\";\nimport { TreeNodeRenderer } from \"./TreeNodeRenderer\";\n\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { PresentationHierarchyNode, PresentationTreeNode, RenderedTreeNode } from \"@itwin/presentation-hierarchies-react\";\n\ninterface TreeRendererOwnProps {\n  rootNodes: PresentationTreeNode[];\n  isNodeSelected: (nodeId: string) => boolean;\n  onNodeDoubleClick?: (node: PresentationHierarchyNode, isSelected: boolean) => void;\n}\n\ntype TreeRendererProps = Pick<\n  TreeNodeRendererProps,\n  \"expandNode\" | \"onNodeClick\" | \"onNodeKeyDown\" | \"onFilterClick\" | \"getIcon\" | \"getLabel\" | \"getSublabel\" | \"getHierarchyLevelDetails\" | \"checkboxProps\"\n> &\n  Omit<TreeProps<RenderedTreeNode>, \"data\" | \"nodeRenderer\" | \"getNode\"> &\n  Pick<LocalizationContextProviderProps, \"localizedStrings\"> &\n  TreeRendererOwnProps;\n\n/** @internal */\nexport function TreeRenderer({\n  rootNodes,\n  expandNode,\n  onNodeClick,\n  onNodeKeyDown,\n  onNodeDoubleClick,\n  isNodeSelected,\n  onFilterClick,\n  getIcon,\n  getLabel,\n  getSublabel,\n  getHierarchyLevelDetails,\n  checkboxProps,\n  localizedStrings,\n  ...props\n}: TreeRendererProps) {\n  const nodeRenderer = useCallback<TreeProps<RenderedTreeNode>[\"nodeRenderer\"]>(\n    (nodeProps) => {\n      return (\n        <TreeNodeRenderer\n          {...nodeProps}\n          onNodeClick={(node, isSelected, event) => {\n            if (onNodeDoubleClick && event.detail === 2) {\n              onNodeDoubleClick?.(node, !!nodeProps.isSelected);\n              // Click node to not lose selection\n              return onNodeClick?.(node, true, event);\n            }\n            onNodeClick?.(node, isSelected, event);\n          }}\n          expandNode={expandNode}\n          onNodeKeyDown={onNodeKeyDown}\n          getIcon={getIcon}\n          getLabel={getLabel}\n          getSublabel={getSublabel}\n          onFilterClick={onFilterClick}\n          getHierarchyLevelDetails={getHierarchyLevelDetails}\n          checkboxProps={checkboxProps}\n          className={getSublabel ? \"with-description\" : \"without-description\"}\n        />\n      );\n    },\n    [expandNode, onNodeClick, onNodeKeyDown, onNodeDoubleClick, getHierarchyLevelDetails, getIcon, getLabel, getSublabel, onFilterClick, checkboxProps],\n  );\n\n  const getNode = useCallback<TreeProps<RenderedTreeNode>[\"getNode\"]>((node) => createRenderedTreeNodeData(node, isNodeSelected), [isNodeSelected]);\n\n  return (\n    <LocalizationContextProvider localizedStrings={localizedStrings}>\n      <Tree<RenderedTreeNode>\n        {...props}\n        className=\"tw-tree-renderer\"\n        data={rootNodes}\n        nodeRenderer={nodeRenderer}\n        getNode={getNode}\n        enableVirtualization={true}\n      />\n    </LocalizationContextProvider>\n  );\n}\n\ntype TreeProps<T> = ComponentPropsWithoutRef<typeof Tree<T>>;\ntype TreeNodeRendererProps = ComponentPropsWithoutRef<typeof TreeNodeRenderer>;\ntype LocalizationContextProviderProps = ComponentPropsWithoutRef<typeof LocalizationContextProvider>;\n"]}

package/lib/cjs/components/trees/common/components/TreeRenderer.scss

@@ -0,0 +1,62 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+
+.tw-tree-renderer {
+  width: fit-content;
+  min-width: 100%;
+
+  .tw-tree-node.without-description {
+    height: 36px;
+  }
+
+  .tw-tree-node.with-description {
+    height: 42px;
+  }
+
+  .tw-tree-node-checkbox-container {
+    position: sticky;
+    left: 0;
+    z-index: 1;
+    background-color: var(--iui-color-background);
+    padding-left: calc(var(--iui-size-2xs) + var(--iui-size-3xs));
+    height: calc(100% - var(--iui-size-2xs));
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .tw-tree-node-checkbox::before {
+    background-color: var(--iui-color-background);
+    inset: calc(-1 * var(--iui-size-xs)) calc(-1 * var(--iui-size-xs) / 2);
+    z-index: -1;
+  }
+
+  .tw-tree-node-action-buttons {
+    position: sticky;
+    right: 0;
+    z-index: 1;
+    background-color: var(--iui-color-background);
+  }
+
+  .tw-tree-node-content {
+    overflow: visible;
+  }
+
+  .tw-tree-node.selected {
+    .tw-tree-node-checkbox-container,
+    .tw-tree-node-checkbox::before,
+    .tw-tree-node-action-buttons {
+      background-color: var(--iui-color-background-accent-muted);
+    }
+  }
+
+  .tw-tree-node:not(.selected):hover {
+    .tw-tree-node-checkbox-container,
+    .tw-tree-node-checkbox::before,
+    .tw-tree-node-action-buttons {
+      background-color: var(--iui-color-background-hover);
+    }
+  }
+}

package/lib/cjs/components/trees/common/components/VisibilityTree.d.ts

@@ -0,0 +1,14 @@
+import { useHierarchyVisibility } from "../UseHierarchyVisibility";
+import { BaseTree } from "./BaseTree";
+import type { ECClassHierarchyInspector } from "@itwin/presentation-shared";
+import type { HierarchyVisibilityHandler } from "../UseHierarchyVisibility";
+import type { ComponentPropsWithoutRef } from "react";
+type BaseTreeProps = ComponentPropsWithoutRef<typeof BaseTree>;
+type UseHierarchyVisibilityProps = Parameters<typeof useHierarchyVisibility>[0];
+type VisibilityTreeProps = Omit<BaseTreeProps, "treeRenderer" | "imodelAccess"> & Omit<UseHierarchyVisibilityProps, "visibilityHandlerFactory"> & {
+    visibilityHandlerFactory: (imodelAccess: ECClassHierarchyInspector) => HierarchyVisibilityHandler;
+};
+/** @internal */
+export declare function VisibilityTree({ visibilityHandlerFactory, onPerformanceMeasured, ...props }: VisibilityTreeProps): JSX.Element;
+export {};
+//# sourceMappingURL=VisibilityTree.d.ts.map

package/lib/cjs/components/trees/common/components/VisibilityTree.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VisibilityTree = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+const react_1 = require("react");
+const UseFeatureReporting_1 = require("../UseFeatureReporting");
+const UseHierarchyVisibility_1 = require("../UseHierarchyVisibility");
+const UseMultiCheckboxHandler_1 = require("../UseMultiCheckboxHandler");
+const Utils_1 = require("../Utils");
+const BaseTree_1 = require("./BaseTree");
+const TreeRenderer_1 = require("./TreeRenderer");
+/** @internal */
+function VisibilityTree({ visibilityHandlerFactory, onPerformanceMeasured, ...props }) {
+    const { imodel, getSchemaContext } = props;
+    const imodelAccess = (0, react_1.useMemo)(() => (0, Utils_1.createIModelAccess)({ imodel, getSchemaContext }), [imodel, getSchemaContext]);
+    const { getCheckboxState, onCheckboxClicked, triggerRefresh } = (0, UseHierarchyVisibility_1.useHierarchyVisibility)({
+        visibilityHandlerFactory: (0, react_1.useCallback)(() => visibilityHandlerFactory(imodelAccess), [visibilityHandlerFactory, imodelAccess]),
+    });
+    return ((0, jsx_runtime_1.jsx)(BaseTree_1.BaseTree, { ...props, onPerformanceMeasured: (action, duration) => {
+            onPerformanceMeasured?.(action, duration);
+            if (action === "reload") {
+                triggerRefresh();
+            }
+        }, imodelAccess: imodelAccess, treeRenderer: (treeProps) => (0, jsx_runtime_1.jsx)(VisibilityTreeRenderer, { ...treeProps, getCheckboxState: getCheckboxState, onCheckboxClicked: onCheckboxClicked }) }));
+}
+exports.VisibilityTree = VisibilityTree;
+function VisibilityTreeRenderer({ getCheckboxState, onCheckboxClicked: onClick, reportUsage, ...props }) {
+    const { onCheckboxClicked } = (0, UseMultiCheckboxHandler_1.useMultiCheckboxHandler)({ rootNodes: props.rootNodes, isNodeSelected: props.isNodeSelected, onClick });
+    const reportingOnCheckboxClicked = (0, UseFeatureReporting_1.useReportingAction)({ featureId: "visibility-change", action: onCheckboxClicked, reportUsage });
+    const checkboxProps = (0, react_1.useMemo)(() => ({
+        variant: "eyeball",
+        getCheckboxState,
+        onCheckboxClicked: reportingOnCheckboxClicked,
+    }), [getCheckboxState, reportingOnCheckboxClicked]);
+    return (0, jsx_runtime_1.jsx)(TreeRenderer_1.TreeRenderer, { ...props, checkboxProps: checkboxProps });
+}
+//# sourceMappingURL=VisibilityTree.js.map

package/lib/cjs/components/trees/common/components/VisibilityTree.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisibilityTree.js","sourceRoot":"","sources":["../../../../../../src/components/trees/common/components/VisibilityTree.tsx"],"names":[],"mappings":";;;;AAAA;;;gGAGgG;AAEhG,iCAA6C;AAC7C,gEAA4D;AAC5D,sEAAmE;AACnE,wEAAqE;AACrE,oCAA8C;AAC9C,yCAAsC;AACtC,iDAA8C;AAa9C,gBAAgB;AAChB,SAAgB,cAAc,CAAC,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,GAAG,KAAK,EAAuB;IAC/G,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,GAAG,KAAK,CAAC;IAC3C,MAAM,YAAY,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,IAAA,0BAAkB,EAAC,EAAE,MAAM,EAAE,gBAAgB,EAAE,CAAC,EAAE,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC,CAAC;IACjH,MAAM,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,IAAA,+CAAsB,EAAC;QACrF,wBAAwB,EAAE,IAAA,mBAAW,EAAC,GAAG,EAAE,CAAC,wBAAwB,CAAC,YAAY,CAAC,EAAE,CAAC,wBAAwB,EAAE,YAAY,CAAC,CAAC;KAC9H,CAAC,CAAC;IAEH,OAAO,CACL,uBAAC,mBAAQ,OACH,KAAK,EACT,qBAAqB,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE;YAC1C,qBAAqB,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;YAC1C,IAAI,MAAM,KAAK,QAAQ,EAAE;gBACvB,cAAc,EAAE,CAAC;aAClB;QACH,CAAC,EACD,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,uBAAC,sBAAsB,OAAK,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,iBAAiB,GAAI,GAChJ,CACH,CAAC;AACJ,CAAC;AApBD,wCAoBC;AAID,SAAS,sBAAsB,CAAC,EAC9B,gBAAgB,EAChB,iBAAiB,EAAE,OAAO,EAC1B,WAAW,EACX,GAAG,KAAK,EAC2I;IACnJ,MAAM,EAAE,iBAAiB,EAAE,GAAG,IAAA,iDAAuB,EAAC,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,cAAc,EAAE,KAAK,CAAC,cAAc,EAAE,OAAO,EAAE,CAAC,CAAC;IACrI,MAAM,0BAA0B,GAAG,IAAA,wCAAkB,EAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,EAAE,iBAAiB,EAAE,WAAW,EAAE,CAAC,CAAC;IAElI,MAAM,aAAa,GAAuC,IAAA,eAAO,EAC/D,GAAG,EAAE,CAAC,CAAC;QACL,OAAO,EAAE,SAAS;QAClB,gBAAgB;QAChB,iBAAiB,EAAE,0BAA0B;KAC9C,CAAC,EACF,CAAC,gBAAgB,EAAE,0BAA0B,CAAC,CAC/C,CAAC;IAEF,OAAO,uBAAC,2BAAY,OAAK,KAAK,EAAE,aAAa,EAAE,aAAa,GAAI,CAAC;AACnE,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 { useCallback, useMemo } from \"react\";\nimport { useReportingAction } from \"../UseFeatureReporting\";\nimport { useHierarchyVisibility } from \"../UseHierarchyVisibility\";\nimport { useMultiCheckboxHandler } from \"../UseMultiCheckboxHandler\";\nimport { createIModelAccess } from \"../Utils\";\nimport { BaseTree } from \"./BaseTree\";\nimport { TreeRenderer } from \"./TreeRenderer\";\n\nimport type { ECClassHierarchyInspector } from \"@itwin/presentation-shared\";\nimport type { HierarchyVisibilityHandler } from \"../UseHierarchyVisibility\";\nimport type { ComponentPropsWithoutRef } from \"react\";\n\ntype BaseTreeProps = ComponentPropsWithoutRef<typeof BaseTree>;\ntype UseHierarchyVisibilityProps = Parameters<typeof useHierarchyVisibility>[0];\ntype VisibilityTreeProps = Omit<BaseTreeProps, \"treeRenderer\" | \"imodelAccess\"> &\n  Omit<UseHierarchyVisibilityProps, \"visibilityHandlerFactory\"> & {\n    visibilityHandlerFactory: (imodelAccess: ECClassHierarchyInspector) => HierarchyVisibilityHandler;\n  };\n\n/** @internal */\nexport function VisibilityTree({ visibilityHandlerFactory, onPerformanceMeasured, ...props }: VisibilityTreeProps) {\n  const { imodel, getSchemaContext } = props;\n  const imodelAccess = useMemo(() => createIModelAccess({ imodel, getSchemaContext }), [imodel, getSchemaContext]);\n  const { getCheckboxState, onCheckboxClicked, triggerRefresh } = useHierarchyVisibility({\n    visibilityHandlerFactory: useCallback(() => visibilityHandlerFactory(imodelAccess), [visibilityHandlerFactory, imodelAccess]),\n  });\n\n  return (\n    <BaseTree\n      {...props}\n      onPerformanceMeasured={(action, duration) => {\n        onPerformanceMeasured?.(action, duration);\n        if (action === \"reload\") {\n          triggerRefresh();\n        }\n      }}\n      imodelAccess={imodelAccess}\n      treeRenderer={(treeProps) => <VisibilityTreeRenderer {...treeProps} getCheckboxState={getCheckboxState} onCheckboxClicked={onCheckboxClicked} />}\n    />\n  );\n}\n\ntype TreeRendererProps = ComponentPropsWithoutRef<typeof TreeRenderer>;\n\nfunction VisibilityTreeRenderer({\n  getCheckboxState,\n  onCheckboxClicked: onClick,\n  reportUsage,\n  ...props\n}: TreeRendererProps & Pick<ReturnType<typeof useHierarchyVisibility>, \"getCheckboxState\" | \"onCheckboxClicked\"> & Pick<BaseTreeProps, \"reportUsage\">) {\n  const { onCheckboxClicked } = useMultiCheckboxHandler({ rootNodes: props.rootNodes, isNodeSelected: props.isNodeSelected, onClick });\n  const reportingOnCheckboxClicked = useReportingAction({ featureId: \"visibility-change\", action: onCheckboxClicked, reportUsage });\n\n  const checkboxProps: TreeRendererProps[\"checkboxProps\"] = useMemo(\n    () => ({\n      variant: \"eyeball\",\n      getCheckboxState,\n      onCheckboxClicked: reportingOnCheckboxClicked,\n    }),\n    [getCheckboxState, reportingOnCheckboxClicked],\n  );\n\n  return <TreeRenderer {...props} checkboxProps={checkboxProps} />;\n}\n"]}

package/lib/cjs/components/trees/external-sources-tree/ExternalSourcesTree.d.ts

@@ -1,39 +1,15 @@
 /// <reference types="react" />
-import "../VisibilityTreeBase.scss";
-import type { Ruleset } from "@itwin/presentation-common";
-import type { BaseTreeProps, HierarchyLevelConfig } from "../common/Types";
-/**
- * Presentation rules used by ControlledCategoriesTree
- * @internal
- */
-export declare const RULESET_EXTERNAL_SOURCES: Ruleset;
-/**
- * Props for the [[ExternalSourcesTree]] component
- * @alpha
- */
-export interface ExternalSourcesTreeProps extends BaseTreeProps {
-    /**
-     * Props for configuring hierarchy level.
-     * @beta
-     */
-    hierarchyLevelConfig?: HierarchyLevelConfig;
-    /**
-     * Reports performance of a feature.
-     * @param featureId ID of the feature.
-     * @param elapsedTime Elapsed time of the feature.
-     * @beta
-     */
-    onPerformanceMeasured?: (featureId: string, elapsedTime: number) => void;
-    /**
-     * Callback that is invoked when a tracked feature is used.
-     * @param featureId ID of the feature.
-     * @beta
-     */
+import { BaseTree } from "../common/components/BaseTree";
+interface ExternalSourcesTreeOwnProps {
+    hierarchyLevelConfig?: {
+        sizeLimit?: number;
+    };
+    onPerformanceMeasured?: (featureId: string, duration: number) => void;
     onFeatureUsed?: (feature: string) => void;
 }
-/**
- * Tree which displays a hierarchy of ExternalSources and their elements.
- * @alpha
- */
-export declare function ExternalSourcesTree(props: ExternalSourcesTreeProps): JSX.Element | null;
+type BaseTreeProps = Parameters<typeof BaseTree>[0];
+type ExternalSourcesTreeProps = ExternalSourcesTreeOwnProps & Pick<BaseTreeProps, "imodel" | "getSchemaContext" | "height" | "width" | "density" | "selectionMode">;
+/** @internal */
+export declare function ExternalSourcesTree({ onPerformanceMeasured, onFeatureUsed, ...props }: ExternalSourcesTreeProps): JSX.Element;
+export {};
 //# sourceMappingURL=ExternalSourcesTree.d.ts.map

package/lib/cjs/components/trees/external-sources-tree/ExternalSourcesTree.js

@@ -1,95 +1,41 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ExternalSourcesTree = exports.RULESET_EXTERNAL_SOURCES = void 0;
+exports.ExternalSourcesTree = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 /*---------------------------------------------------------------------------------------------
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-require("../VisibilityTreeBase.scss");
-const react_1 = require("react");
-const components_react_1 = require("@itwin/components-react");
-const presentation_components_1 = require("@itwin/presentation-components");
-const ReportingTreeEventHandler_1 = require("../common/ReportingTreeEventHandler");
-const TreeRenderer_1 = require("../common/TreeRenderer");
+const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
+const BaseTree_1 = require("../common/components/BaseTree");
 const UseFeatureReporting_1 = require("../common/UseFeatureReporting");
-const UsePerformanceReporting_1 = require("../common/UsePerformanceReporting");
-const Utils_1 = require("../common/Utils");
-const RULESET_EXTERNAL_SOURCES_IMPORT = __importStar(require("./ExternalSources.json"));
 const ExternalSourcesTreeComponent_1 = require("./ExternalSourcesTreeComponent");
-/**
- * Presentation rules used by ControlledCategoriesTree
- * @internal
- */
-exports.RULESET_EXTERNAL_SOURCES = RULESET_EXTERNAL_SOURCES_IMPORT;
-const PAGING_SIZE = 20;
-/**
- * Tree which displays a hierarchy of ExternalSources and their elements.
- * @alpha
- */
-function ExternalSourcesTree(props) {
-    const { hierarchyLevelConfig, contextMenuItems, nodeLabelRenderer, density, onFeatureUsed } = props;
-    const { reportUsage } = (0, UseFeatureReporting_1.useFeatureReporting)({ treeIdentifier: ExternalSourcesTreeComponent_1.ExternalSourcesTreeComponent.id, onFeatureUsed });
-    const { onNodeLoaded } = (0, UsePerformanceReporting_1.usePerformanceReporting)({
-        treeIdentifier: ExternalSourcesTreeComponent_1.ExternalSourcesTreeComponent.id,
-        onPerformanceMeasured: props.onPerformanceMeasured,
-    });
-    const eventHandlerFactory = (0, react_1.useCallback)((handlerProps) => {
-        const eventHandler = new presentation_components_1.UnifiedSelectionTreeEventHandler({ nodeLoader: handlerProps.nodeLoader });
-        return new ReportingTreeEventHandler_1.ReportingTreeEventHandler({
-            nodeLoader: handlerProps.nodeLoader,
-            eventHandler,
-            reportUsage,
-        });
-    }, [reportUsage]);
-    const state = (0, presentation_components_1.usePresentationTreeState)({
-        imodel: props.iModel,
-        ruleset: exports.RULESET_EXTERNAL_SOURCES,
-        pagingSize: PAGING_SIZE,
-        eventHandlerFactory,
-        customizeTreeNodeItem,
-        hierarchyLevelSizeLimit: hierarchyLevelConfig?.sizeLimit,
-        enableHierarchyAutoUpdate: true,
-        onNodeLoaded,
-    });
-    const treeRendererProps = {
-        contextMenuItems,
-        nodeLabelRenderer,
-        density,
-    };
-    if (!state) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsx)("div", { className: "tree-widget-tree-container", children: (0, jsx_runtime_1.jsx)(presentation_components_1.PresentationTree, { width: props.width, height: props.height, state: state, selectionMode: props.selectionMode ?? components_react_1.SelectionMode.Extended, iconsEnabled: true, treeRenderer: (treeProps) => hierarchyLevelConfig?.isFilteringEnabled ? ((0, jsx_runtime_1.jsx)(TreeRenderer_1.FilterableTreeRenderer, { ...treeProps, ...treeRendererProps, nodeLoader: state.nodeLoader, nodeRenderer: (nodeRendererProps) => (0, jsx_runtime_1.jsx)(presentation_components_1.PresentationTreeNodeRenderer, { ...nodeRendererProps }) })) : ((0, jsx_runtime_1.jsx)(TreeRenderer_1.TreeRenderer, { ...treeProps, ...treeRendererProps })) }) }));
+const ExternalSourcesTreeDefinition_1 = require("./ExternalSourcesTreeDefinition");
+/** @internal */
+function ExternalSourcesTree({ onPerformanceMeasured, onFeatureUsed, ...props }) {
+    const { reportUsage } = (0, UseFeatureReporting_1.useFeatureReporting)({ onFeatureUsed, treeIdentifier: ExternalSourcesTreeComponent_1.ExternalSourcesTreeComponent.id });
+    return ((0, jsx_runtime_1.jsx)(BaseTree_1.BaseTree, { ...props, treeName: ExternalSourcesTreeComponent_1.ExternalSourcesTreeComponent.id, getHierarchyDefinition: getDefinitionsProvider, getIcon: getIcon, selectionMode: props.selectionMode ?? "none", onPerformanceMeasured: (action, duration) => {
+            onPerformanceMeasured?.(`${ExternalSourcesTreeComponent_1.ExternalSourcesTreeComponent.id}-${action}`, duration);
+        }, reportUsage: reportUsage }));
 }
 exports.ExternalSourcesTree = ExternalSourcesTree;
-const customizeTreeNodeItem = (0, Utils_1.combineTreeNodeItemCustomizations)([
-    Utils_1.addCustomTreeNodeItemLabelRenderer,
-    (item, node) => {
-        item.icon = node.extendedData?.imageId;
-    },
-]);
+function getDefinitionsProvider(props) {
+    return new ExternalSourcesTreeDefinition_1.ExternalSourcesTreeDefinition(props);
+}
+function getIcon(node) {
+    if (node.extendedData?.imageId === undefined) {
+        return undefined;
+    }
+    switch (node.extendedData.imageId) {
+        case "icon-item":
+            return (0, jsx_runtime_1.jsx)(itwinui_icons_react_1.SvgItem, {});
+        case "icon-ec-class":
+            return (0, jsx_runtime_1.jsx)(itwinui_icons_react_1.SvgItem, {});
+        case "icon-document":
+            return (0, jsx_runtime_1.jsx)(itwinui_icons_react_1.SvgDocument, {});
+        case "icon-ec-schema":
+            return (0, jsx_runtime_1.jsx)(itwinui_icons_react_1.SvgDetails, {});
+    }
+    return undefined;
+}
 //# sourceMappingURL=ExternalSourcesTree.js.map

package/lib/cjs/components/trees/external-sources-tree/ExternalSourcesTree.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalSourcesTree.js","sourceRoot":"","sources":["../../../../../src/components/trees/external-sources-tree/ExternalSourcesTree.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;gGAGgG;AAEhG,sCAAoC;AACpC,iCAAoC;AACpC,8DAAwD;AACxD,4EAA4J;AAC5J,mFAAgF;AAChF,yDAA8E;AAC9E,uEAAoE;AACpE,+EAA4E;AAC5E,2CAAwG;AACxG,wFAA0E;AAC1E,iFAA8E;AAK9E;;;GAGG;AACU,QAAA,wBAAwB,GAAG,+BAA0C,CAAC;AAEnF,MAAM,WAAW,GAAG,EAAE,CAAC;AA2BvB;;;GAGG;AACH,SAAgB,mBAAmB,CAAC,KAA+B;IACjE,MAAM,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,OAAO,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;IAEpG,MAAM,EAAE,WAAW,EAAE,GAAG,IAAA,yCAAmB,EAAC,EAAE,cAAc,EAAE,2DAA4B,CAAC,EAAE,EAAE,aAAa,EAAE,CAAC,CAAC;IAChH,MAAM,EAAE,YAAY,EAAE,GAAG,IAAA,iDAAuB,EAAC;QAC/C,cAAc,EAAE,2DAA4B,CAAC,EAAE;QAC/C,qBAAqB,EAAE,KAAK,CAAC,qBAAqB;KACnD,CAAC,CAAC;IAEH,MAAM,mBAAmB,GAAG,IAAA,mBAAW,EACrC,CAAC,YAA+C,EAAE,EAAE;QAClD,MAAM,YAAY,GAAG,IAAI,0DAAgC,CAAC,EAAE,UAAU,EAAE,YAAY,CAAC,UAAU,EAAE,CAAC,CAAC;QACnG,OAAO,IAAI,qDAAyB,CAAC;YACnC,UAAU,EAAE,YAAY,CAAC,UAAU;YACnC,YAAY;YACZ,WAAW;SACZ,CAAC,CAAC;IACL,CAAC,EACD,CAAC,WAAW,CAAC,CACd,CAAC;IAEF,MAAM,KAAK,GAAG,IAAA,kDAAwB,EAAC;QACrC,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,OAAO,EAAE,gCAAwB;QACjC,UAAU,EAAE,WAAW;QACvB,mBAAmB;QACnB,qBAAqB;QACrB,uBAAuB,EAAE,oBAAoB,EAAE,SAAS;QACxD,yBAAyB,EAAE,IAAI;QAC/B,YAAY;KACb,CAAC,CAAC;IAEH,MAAM,iBAAiB,GAAG;QACxB,gBAAgB;QAChB,iBAAiB;QACjB,OAAO;KACR,CAAC;IAEF,IAAI,CAAC,KAAK,EAAE;QACV,OAAO,IAAI,CAAC;KACb;IAED,OAAO,CACL,gCAAK,SAAS,EAAC,4BAA4B,YACzC,uBAAC,0CAAgB,IACf,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,KAAK,CAAC,aAAa,IAAI,gCAAa,CAAC,QAAQ,EAC5D,YAAY,EAAE,IAAI,EAClB,YAAY,EAAE,CAAC,SAAS,EAAE,EAAE,CAC1B,oBAAoB,EAAE,kBAAkB,CAAC,CAAC,CAAC,CACzC,uBAAC,qCAAsB,OACjB,SAAS,KACT,iBAAiB,EACrB,UAAU,EAAE,KAAK,CAAC,UAAU,EAC5B,YAAY,EAAE,CAAC,iBAAiB,EAAE,EAAE,CAAC,uBAAC,sDAA4B,OAAK,iBAAiB,GAAI,GAC5F,CACH,CAAC,CAAC,CAAC,CACF,uBAAC,2BAAY,OAAK,SAAS,KAAM,iBAAiB,GAAI,CACvD,GAEH,GACE,CACP,CAAC;AACJ,CAAC;AAjED,kDAiEC;AAED,MAAM,qBAAqB,GAAG,IAAA,yCAAiC,EAAC;IAC9D,0CAAkC;IAClC,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;QACb,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,OAAO,CAAC;IACzC,CAAC;CACF,CAAC,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 \"../VisibilityTreeBase.scss\";\nimport { useCallback } from \"react\";\nimport { SelectionMode } from \"@itwin/components-react\";\nimport { PresentationTree, PresentationTreeNodeRenderer, UnifiedSelectionTreeEventHandler, usePresentationTreeState } from \"@itwin/presentation-components\";\nimport { ReportingTreeEventHandler } from \"../common/ReportingTreeEventHandler\";\nimport { FilterableTreeRenderer, TreeRenderer } from \"../common/TreeRenderer\";\nimport { useFeatureReporting } from \"../common/UseFeatureReporting\";\nimport { usePerformanceReporting } from \"../common/UsePerformanceReporting\";\nimport { addCustomTreeNodeItemLabelRenderer, combineTreeNodeItemCustomizations } from \"../common/Utils\";\nimport * as RULESET_EXTERNAL_SOURCES_IMPORT from \"./ExternalSources.json\";\nimport { ExternalSourcesTreeComponent } from \"./ExternalSourcesTreeComponent\";\n\nimport type { Ruleset } from \"@itwin/presentation-common\";\nimport type { PresentationTreeEventHandlerProps } from \"@itwin/presentation-components\";\nimport type { BaseTreeProps, HierarchyLevelConfig } from \"../common/Types\";\n/**\n * Presentation rules used by ControlledCategoriesTree\n * @internal\n */\nexport const RULESET_EXTERNAL_SOURCES = RULESET_EXTERNAL_SOURCES_IMPORT as Ruleset;\n\nconst PAGING_SIZE = 20;\n\n/**\n * Props for the [[ExternalSourcesTree]] component\n * @alpha\n */\nexport interface ExternalSourcesTreeProps extends BaseTreeProps {\n  /**\n   * Props for configuring hierarchy level.\n   * @beta\n   */\n  hierarchyLevelConfig?: HierarchyLevelConfig;\n  /**\n   * Reports performance of a feature.\n   * @param featureId ID of the feature.\n   * @param elapsedTime Elapsed time of the feature.\n   * @beta\n   */\n  onPerformanceMeasured?: (featureId: string, elapsedTime: number) => void;\n  /**\n   * Callback that is invoked when a tracked feature is used.\n   * @param featureId ID of the feature.\n   * @beta\n   */\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/**\n * Tree which displays a hierarchy of ExternalSources and their elements.\n * @alpha\n */\nexport function ExternalSourcesTree(props: ExternalSourcesTreeProps) {\n  const { hierarchyLevelConfig, contextMenuItems, nodeLabelRenderer, density, onFeatureUsed } = props;\n\n  const { reportUsage } = useFeatureReporting({ treeIdentifier: ExternalSourcesTreeComponent.id, onFeatureUsed });\n  const { onNodeLoaded } = usePerformanceReporting({\n    treeIdentifier: ExternalSourcesTreeComponent.id,\n    onPerformanceMeasured: props.onPerformanceMeasured,\n  });\n\n  const eventHandlerFactory = useCallback(\n    (handlerProps: PresentationTreeEventHandlerProps) => {\n      const eventHandler = new UnifiedSelectionTreeEventHandler({ nodeLoader: handlerProps.nodeLoader });\n      return new ReportingTreeEventHandler({\n        nodeLoader: handlerProps.nodeLoader,\n        eventHandler,\n        reportUsage,\n      });\n    },\n    [reportUsage],\n  );\n\n  const state = usePresentationTreeState({\n    imodel: props.iModel,\n    ruleset: RULESET_EXTERNAL_SOURCES,\n    pagingSize: PAGING_SIZE,\n    eventHandlerFactory,\n    customizeTreeNodeItem,\n    hierarchyLevelSizeLimit: hierarchyLevelConfig?.sizeLimit,\n    enableHierarchyAutoUpdate: true,\n    onNodeLoaded,\n  });\n\n  const treeRendererProps = {\n    contextMenuItems,\n    nodeLabelRenderer,\n    density,\n  };\n\n  if (!state) {\n    return null;\n  }\n\n  return (\n    <div className=\"tree-widget-tree-container\">\n      <PresentationTree\n        width={props.width}\n        height={props.height}\n        state={state}\n        selectionMode={props.selectionMode ?? SelectionMode.Extended}\n        iconsEnabled={true}\n        treeRenderer={(treeProps) =>\n          hierarchyLevelConfig?.isFilteringEnabled ? (\n            <FilterableTreeRenderer\n              {...treeProps}\n              {...treeRendererProps}\n              nodeLoader={state.nodeLoader}\n              nodeRenderer={(nodeRendererProps) => <PresentationTreeNodeRenderer {...nodeRendererProps} />}\n            />\n          ) : (\n            <TreeRenderer {...treeProps} {...treeRendererProps} />\n          )\n        }\n      />\n    </div>\n  );\n}\n\nconst customizeTreeNodeItem = combineTreeNodeItemCustomizations([\n  addCustomTreeNodeItemLabelRenderer,\n  (item, node) => {\n    item.icon = node.extendedData?.imageId;\n  },\n]);\n"]}
+{"version":3,"file":"ExternalSourcesTree.js","sourceRoot":"","sources":["../../../../../src/components/trees/external-sources-tree/ExternalSourcesTree.tsx"],"names":[],"mappings":";;;;AAAA;;;gGAGgG;AAEhG,oEAA8E;AAC9E,4DAAyD;AACzD,uEAAoE;AACpE,iFAA8E;AAC9E,mFAAgF;AAkBhF,gBAAgB;AAChB,SAAgB,mBAAmB,CAAC,EAAE,qBAAqB,EAAE,aAAa,EAAE,GAAG,KAAK,EAA4B;IAC9G,MAAM,EAAE,WAAW,EAAE,GAAG,IAAA,yCAAmB,EAAC,EAAE,aAAa,EAAE,cAAc,EAAE,2DAA4B,CAAC,EAAE,EAAE,CAAC,CAAC;IAChH,OAAO,CACL,uBAAC,mBAAQ,OACH,KAAK,EACT,QAAQ,EAAE,2DAA4B,CAAC,EAAE,EACzC,sBAAsB,EAAE,sBAAsB,EAC9C,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,KAAK,CAAC,aAAa,IAAI,MAAM,EAC5C,qBAAqB,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE;YAC1C,qBAAqB,EAAE,CAAC,GAAG,2DAA4B,CAAC,EAAE,IAAI,MAAM,EAAE,EAAE,QAAQ,CAAC,CAAC;QACpF,CAAC,EACD,WAAW,EAAE,WAAW,GACxB,CACH,CAAC;AACJ,CAAC;AAfD,kDAeC;AAED,SAAS,sBAAsB,CAAC,KAA6D;IAC3F,OAAO,IAAI,6DAA6B,CAAC,KAAK,CAAC,CAAC;AAClD,CAAC;AAED,SAAS,OAAO,CAAC,IAA+B;IAC9C,IAAI,IAAI,CAAC,YAAY,EAAE,OAAO,KAAK,SAAS,EAAE;QAC5C,OAAO,SAAS,CAAC;KAClB;IAED,QAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE;QACjC,KAAK,WAAW;YACd,OAAO,uBAAC,6BAAO,KAAG,CAAC;QACrB,KAAK,eAAe;YAClB,OAAO,uBAAC,6BAAO,KAAG,CAAC;QACrB,KAAK,eAAe;YAClB,OAAO,uBAAC,iCAAW,KAAG,CAAC;QACzB,KAAK,gBAAgB;YACnB,OAAO,uBAAC,gCAAU,KAAG,CAAC;KACzB;IAED,OAAO,SAAS,CAAC;AACnB,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 { SvgDetails, SvgDocument, SvgItem } from \"@itwin/itwinui-icons-react\";\nimport { BaseTree } from \"../common/components/BaseTree\";\nimport { useFeatureReporting } from \"../common/UseFeatureReporting\";\nimport { ExternalSourcesTreeComponent } from \"./ExternalSourcesTreeComponent\";\nimport { ExternalSourcesTreeDefinition } from \"./ExternalSourcesTreeDefinition\";\n\nimport type { ReactElement } from \"react\";\nimport type { PresentationHierarchyNode } from \"@itwin/presentation-hierarchies-react\";\n\ninterface ExternalSourcesTreeOwnProps {\n  hierarchyLevelConfig?: {\n    sizeLimit?: number;\n  };\n  onPerformanceMeasured?: (featureId: string, duration: number) => void;\n  onFeatureUsed?: (feature: string) => void;\n}\n\ntype BaseTreeProps = Parameters<typeof BaseTree>[0];\ntype GetHierarchyDefinitionsProviderCallback = BaseTreeProps[\"getHierarchyDefinition\"];\ntype ExternalSourcesTreeProps = ExternalSourcesTreeOwnProps &\n  Pick<BaseTreeProps, \"imodel\" | \"getSchemaContext\" | \"height\" | \"width\" | \"density\" | \"selectionMode\">;\n\n/** @internal */\nexport function ExternalSourcesTree({ onPerformanceMeasured, onFeatureUsed, ...props }: ExternalSourcesTreeProps) {\n  const { reportUsage } = useFeatureReporting({ onFeatureUsed, treeIdentifier: ExternalSourcesTreeComponent.id });\n  return (\n    <BaseTree\n      {...props}\n      treeName={ExternalSourcesTreeComponent.id}\n      getHierarchyDefinition={getDefinitionsProvider}\n      getIcon={getIcon}\n      selectionMode={props.selectionMode ?? \"none\"}\n      onPerformanceMeasured={(action, duration) => {\n        onPerformanceMeasured?.(`${ExternalSourcesTreeComponent.id}-${action}`, duration);\n      }}\n      reportUsage={reportUsage}\n    />\n  );\n}\n\nfunction getDefinitionsProvider(props: Parameters<GetHierarchyDefinitionsProviderCallback>[0]) {\n  return new ExternalSourcesTreeDefinition(props);\n}\n\nfunction getIcon(node: PresentationHierarchyNode): ReactElement | undefined {\n  if (node.extendedData?.imageId === undefined) {\n    return undefined;\n  }\n\n  switch (node.extendedData.imageId) {\n    case \"icon-item\":\n      return <SvgItem />;\n    case \"icon-ec-class\":\n      return <SvgItem />;\n    case \"icon-document\":\n      return <SvgDocument />;\n    case \"icon-ec-schema\":\n      return <SvgDetails />;\n  }\n\n  return undefined;\n}\n"]}

package/lib/cjs/components/trees/external-sources-tree/ExternalSourcesTreeComponent.d.ts

@@ -1,26 +1,26 @@
-/// <reference types="react" />
-import "../VisibilityTreeBase.scss";
-import type { ExternalSourcesTreeProps } from "./ExternalSourcesTree";
+import { ExternalSourcesTree } from "./ExternalSourcesTree";
+import type { ComponentPropsWithoutRef } from "react";
+import type { SelectionStorage } from "@itwin/presentation-hierarchies-react";
+type ExternalSourcesTreeProps = ComponentPropsWithoutRef<typeof ExternalSourcesTree>;
+interface ExternalSourcesTreeComponentProps extends Pick<ExternalSourcesTreeProps, "getSchemaContext" | "density" | "hierarchyLevelConfig" | "selectionMode" | "onPerformanceMeasured" | "onFeatureUsed"> {
+    selectionStorage: SelectionStorage;
+}
 /**
- * Props for [[ExternalSourcesTreeComponent]].
- * @alpha
- */
-export type ExternalSourcesTreeComponentProps = Omit<ExternalSourcesTreeProps, "iModel" | "width" | "height">;
-/**
- * A component that displays an External Sources tree and any necessary "chrome".
- * @alpha
+ * A component that renders `ExternalSourcesTree`.
+ * @beta
  */
 export declare const ExternalSourcesTreeComponent: {
     (props: ExternalSourcesTreeComponentProps): JSX.Element | null;
     /**
-     * Id of the component. May be used when a creating a [[TreeDefinition]] for [[ExternalSourcesTreeComponent]].
-     * @alpha
+     * Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.
+     * @beta
      */
     id: string;
     /**
-     * Label of the component. May be used when a creating a [[TreeDefinition]] for [[ExternalSourcesTreeComponent]].
-     * @alpha
+     * Label of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.
+     * @beta
      */
     getLabel(): string;
 };
+export {};
 //# sourceMappingURL=ExternalSourcesTreeComponent.d.ts.map

package/lib/cjs/components/trees/external-sources-tree/ExternalSourcesTreeComponent.js

@@ -6,31 +6,31 @@ const jsx_runtime_1 = require("react/jsx-runtime");
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-require("../VisibilityTreeBase.scss");
 const appui_react_1 = require("@itwin/appui-react");
+const presentation_hierarchies_react_1 = require("@itwin/presentation-hierarchies-react");
 const TreeWidget_1 = require("../../../TreeWidget");
 const AutoSizer_1 = require("../../utils/AutoSizer");
 const ExternalSourcesTree_1 = require("./ExternalSourcesTree");
 /**
- * A component that displays an External Sources tree and any necessary "chrome".
- * @alpha
+ * A component that renders `ExternalSourcesTree`.
+ * @beta
  */
 const ExternalSourcesTreeComponent = (props) => {
-    const iModel = (0, appui_react_1.useActiveIModelConnection)();
-    if (!iModel) {
+    const imodel = (0, appui_react_1.useActiveIModelConnection)();
+    if (!imodel) {
         return null;
     }
-    return (0, jsx_runtime_1.jsx)(AutoSizer_1.AutoSizer, { children: ({ width, height }) => (0, jsx_runtime_1.jsx)(ExternalSourcesTree_1.ExternalSourcesTree, { ...props, iModel: iModel, width: width, height: height }) });
+    return ((0, jsx_runtime_1.jsx)(presentation_hierarchies_react_1.UnifiedSelectionProvider, { storage: props.selectionStorage, children: (0, jsx_runtime_1.jsx)(AutoSizer_1.AutoSizer, { children: ({ width, height }) => (0, jsx_runtime_1.jsx)(ExternalSourcesTree_1.ExternalSourcesTree, { ...props, imodel: imodel, width: width, height: height }) }) }));
 };
 exports.ExternalSourcesTreeComponent = ExternalSourcesTreeComponent;
 /**
- * Id of the component. May be used when a creating a [[TreeDefinition]] for [[ExternalSourcesTreeComponent]].
- * @alpha
+ * Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.
+ * @beta
  */
-exports.ExternalSourcesTreeComponent.id = "external-sources-tree";
+exports.ExternalSourcesTreeComponent.id = "external-sources-tree-v2";
 /**
- * Label of the component. May be used when a creating a [[TreeDefinition]] for [[ExternalSourcesTreeComponent]].
- * @alpha
+ * Label of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.
+ * @beta
  */
-exports.ExternalSourcesTreeComponent.getLabel = () => TreeWidget_1.TreeWidget.translate("externalSources");
+exports.ExternalSourcesTreeComponent.getLabel = () => TreeWidget_1.TreeWidget.translate("externalSourcesTree.label");
 //# sourceMappingURL=ExternalSourcesTreeComponent.js.map

package/lib/cjs/components/trees/external-sources-tree/ExternalSourcesTreeComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalSourcesTreeComponent.js","sourceRoot":"","sources":["../../../../../src/components/trees/external-sources-tree/ExternalSourcesTreeComponent.tsx"],"names":[],"mappings":";;;;AAAA;;;gGAGgG;AAEhG,sCAAoC;AACpC,oDAA+D;AAC/D,oDAAiD;AACjD,qDAAkD;AAClD,+DAA4D;AAU5D;;;GAGG;AACI,MAAM,4BAA4B,GAAG,CAAC,KAAwC,EAAE,EAAE;IACvF,MAAM,MAAM,GAAG,IAAA,uCAAyB,GAAE,CAAC;IAC3C,IAAI,CAAC,MAAM,EAAE;QACX,OAAO,IAAI,CAAC;KACb;IAED,OAAO,uBAAC,qBAAS,cAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,uBAAC,yCAAmB,OAAK,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,GAAI,GAAa,CAAC;AAC1I,CAAC,CAAC;AAPW,QAAA,4BAA4B,gCAOvC;AAEF;;;GAGG;AACH,oCAA4B,CAAC,EAAE,GAAG,uBAAuB,CAAC;AAE1D;;;GAGG;AACH,oCAA4B,CAAC,QAAQ,GAAG,GAAG,EAAE,CAAC,uBAAU,CAAC,SAAS,CAAC,iBAAiB,CAAC,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 \"../VisibilityTreeBase.scss\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { TreeWidget } from \"../../../TreeWidget\";\nimport { AutoSizer } from \"../../utils/AutoSizer\";\nimport { ExternalSourcesTree } from \"./ExternalSourcesTree\";\n\nimport type { ExternalSourcesTreeProps } from \"./ExternalSourcesTree\";\n\n/**\n * Props for [[ExternalSourcesTreeComponent]].\n * @alpha\n */\nexport type ExternalSourcesTreeComponentProps = Omit<ExternalSourcesTreeProps, \"iModel\" | \"width\" | \"height\">;\n\n/**\n * A component that displays an External Sources tree and any necessary \"chrome\".\n * @alpha\n */\nexport const ExternalSourcesTreeComponent = (props: ExternalSourcesTreeComponentProps) => {\n  const iModel = useActiveIModelConnection();\n  if (!iModel) {\n    return null;\n  }\n\n  return <AutoSizer>{({ width, height }) => <ExternalSourcesTree {...props} iModel={iModel} width={width} height={height} />}</AutoSizer>;\n};\n\n/**\n * Id of the component. May be used when a creating a [[TreeDefinition]] for [[ExternalSourcesTreeComponent]].\n * @alpha\n */\nExternalSourcesTreeComponent.id = \"external-sources-tree\";\n\n/**\n * Label of the component. May be used when a creating a [[TreeDefinition]] for [[ExternalSourcesTreeComponent]].\n * @alpha\n */\nExternalSourcesTreeComponent.getLabel = () => TreeWidget.translate(\"externalSources\");\n"]}
+{"version":3,"file":"ExternalSourcesTreeComponent.js","sourceRoot":"","sources":["../../../../../src/components/trees/external-sources-tree/ExternalSourcesTreeComponent.tsx"],"names":[],"mappings":";;;;AAAA;;;gGAGgG;AAEhG,oDAA+D;AAC/D,0FAAiF;AACjF,oDAAiD;AACjD,qDAAkD;AAClD,+DAA4D;AAa5D;;;GAGG;AACI,MAAM,4BAA4B,GAAG,CAAC,KAAwC,EAAE,EAAE;IACvF,MAAM,MAAM,GAAG,IAAA,uCAAyB,GAAE,CAAC;IAE3C,IAAI,CAAC,MAAM,EAAE;QACX,OAAO,IAAI,CAAC;KACb;IAED,OAAO,CACL,uBAAC,yDAAwB,IAAC,OAAO,EAAE,KAAK,CAAC,gBAAgB,YACvD,uBAAC,qBAAS,cAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,uBAAC,yCAAmB,OAAK,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,GAAI,GAAa,GACvG,CAC5B,CAAC;AACJ,CAAC,CAAC;AAZW,QAAA,4BAA4B,gCAYvC;AAEF;;;GAGG;AACH,oCAA4B,CAAC,EAAE,GAAG,0BAA0B,CAAC;AAE7D;;;GAGG;AACH,oCAA4B,CAAC,QAAQ,GAAG,GAAG,EAAE,CAAC,uBAAU,CAAC,SAAS,CAAC,2BAA2B,CAAC,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 { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { UnifiedSelectionProvider } from \"@itwin/presentation-hierarchies-react\";\nimport { TreeWidget } from \"../../../TreeWidget\";\nimport { AutoSizer } from \"../../utils/AutoSizer\";\nimport { ExternalSourcesTree } from \"./ExternalSourcesTree\";\n\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { SelectionStorage } from \"@itwin/presentation-hierarchies-react\";\ntype ExternalSourcesTreeProps = ComponentPropsWithoutRef<typeof ExternalSourcesTree>;\ninterface ExternalSourcesTreeComponentProps\n  extends Pick<\n    ExternalSourcesTreeProps,\n    \"getSchemaContext\" | \"density\" | \"hierarchyLevelConfig\" | \"selectionMode\" | \"onPerformanceMeasured\" | \"onFeatureUsed\"\n  > {\n  selectionStorage: SelectionStorage;\n}\n\n/**\n * A component that renders `ExternalSourcesTree`.\n * @beta\n */\nexport const ExternalSourcesTreeComponent = (props: ExternalSourcesTreeComponentProps) => {\n  const imodel = useActiveIModelConnection();\n\n  if (!imodel) {\n    return null;\n  }\n\n  return (\n    <UnifiedSelectionProvider storage={props.selectionStorage}>\n      <AutoSizer>{({ width, height }) => <ExternalSourcesTree {...props} imodel={imodel} width={width} height={height} />}</AutoSizer>\n    </UnifiedSelectionProvider>\n  );\n};\n\n/**\n * Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @beta\n */\nExternalSourcesTreeComponent.id = \"external-sources-tree-v2\";\n\n/**\n * Label of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @beta\n */\nExternalSourcesTreeComponent.getLabel = () => TreeWidget.translate(\"externalSourcesTree.label\");\n"]}

package/lib/cjs/components/trees/external-sources-tree/ExternalSourcesTreeDefinition.d.ts

@@ -0,0 +1,24 @@
+import type { ECClassHierarchyInspector, ECSchemaProvider } from "@itwin/presentation-shared";
+import type { DefineHierarchyLevelProps, HierarchyDefinition, HierarchyLevelDefinition, LimitingECSqlQueryExecutor, ProcessedHierarchyNode } from "@itwin/presentation-hierarchies";
+interface ExternalSourcesTreeDefinitionProps {
+    imodelAccess: ECSchemaProvider & ECClassHierarchyInspector & LimitingECSqlQueryExecutor;
+}
+export declare class ExternalSourcesTreeDefinition implements HierarchyDefinition {
+    private _impl;
+    private _selectQueryFactory;
+    private _nodeLabelSelectClauseFactory;
+    private _queryExecutor;
+    private _isSupported?;
+    constructor(props: ExternalSourcesTreeDefinitionProps);
+    postProcessNode(node: ProcessedHierarchyNode): Promise<ProcessedHierarchyNode>;
+    defineHierarchyLevel(props: DefineHierarchyLevelProps): Promise<HierarchyLevelDefinition>;
+    private createRootHierarchyLevelDefinition;
+    private createExternalSourcesGroupChildrenQuery;
+    private createExternalSourceChildrenQuery;
+    private createExternalSourceSupportsFilteringSelector;
+    private createElementsNodeChildrenQuery;
+    private createCompositeLabelSelectClause;
+    private isSupported;
+}
+export {};
+//# sourceMappingURL=ExternalSourcesTreeDefinition.d.ts.map