@itwin/tree-widget-react 4.0.0-alpha.2 → 4.0.0-alpha.20

package/lib/esm/tree-widget-react/components/trees/common/components/BaseTreeRenderer.js

@@ -3,12 +3,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-/* eslint-disable @itwin/no-internal */
-import { LocalizationContextProvider, TreeRenderer as PresentationTree } from "@itwin/presentation-hierarchies-react";
-import { useHierarchiesLocalization } from "../UseHierarchiesLocalization.js";
+import { StrataKitTreeRenderer as PresentationTree } from "@itwin/presentation-hierarchies-react";
+import { useHierarchiesLocalization } from "../internal/UseHierarchiesLocalization.js";
 /** @internal */
-export function BaseTreeRenderer({ rootNodes, onNodeClick, expandNode, actions, ...props }) {
+export function BaseTreeRenderer(props) {
     const localizedStrings = useHierarchiesLocalization();
-    return (_jsx(LocalizationContextProvider, { localizedStrings: localizedStrings, children: _jsx(PresentationTree, { ...props, onNodeClick: onNodeClick, expandNode: expandNode, rootNodes: rootNodes, actions: actions }) }));
+    return _jsx(PresentationTree, { ...props, localizedStrings: localizedStrings });
 }
 //# sourceMappingURL=BaseTreeRenderer.js.map

package/lib/esm/tree-widget-react/components/trees/common/components/BaseTreeRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseTreeRenderer.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/BaseTreeRenderer.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG,uCAAuC;AAEvC,OAAO,EAAE,2BAA2B,EAAE,YAAY,IAAI,gBAAgB,EAAE,MAAM,uCAAuC,CAAC;AACtH,OAAO,EAAE,0BAA0B,EAAE,MAAM,kCAAkC,CAAC;AAK9E,gBAAgB;AAChB,MAAM,UAAU,gBAAgB,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,UAAU,EAAE,OAAO,EAAE,GAAG,KAAK,EAAyB;IAC/G,MAAM,gBAAgB,GAAG,0BAA0B,EAAE,CAAC;IACtD,OAAO,CACL,KAAC,2BAA2B,IAAC,gBAAgB,EAAE,gBAAgB,YAC7D,KAAC,gBAAgB,OAAK,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,GAAI,GAC7F,CAC/B,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/* eslint-disable @itwin/no-internal */\n\nimport { LocalizationContextProvider, TreeRenderer as PresentationTree } from \"@itwin/presentation-hierarchies-react\";\nimport { useHierarchiesLocalization } from \"../UseHierarchiesLocalization.js\";\n\n/** @beta */\nexport type BaseTreeRendererProps = React.ComponentPropsWithoutRef<typeof PresentationTree>;\n\n/** @internal */\nexport function BaseTreeRenderer({ rootNodes, onNodeClick, expandNode, actions, ...props }: BaseTreeRendererProps) {\n  const localizedStrings = useHierarchiesLocalization();\n  return (\n    <LocalizationContextProvider localizedStrings={localizedStrings}>\n      <PresentationTree {...props} onNodeClick={onNodeClick} expandNode={expandNode} rootNodes={rootNodes} actions={actions} />\n    </LocalizationContextProvider>\n  );\n}\n"]}
+{"version":3,"file":"BaseTreeRenderer.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/BaseTreeRenderer.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,qBAAqB,IAAI,gBAAgB,EAAE,MAAM,uCAAuC,CAAC;AAClG,OAAO,EAAE,0BAA0B,EAAE,MAAM,2CAA2C,CAAC;AAKvF,gBAAgB;AAChB,MAAM,UAAU,gBAAgB,CAAC,KAA4B;IAC3D,MAAM,gBAAgB,GAAG,0BAA0B,EAAE,CAAC;IACtD,OAAO,KAAC,gBAAgB,OAAK,KAAK,EAAE,gBAAgB,EAAE,gBAAgB,GAAI,CAAC;AAC7E,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 { StrataKitTreeRenderer as PresentationTree } from \"@itwin/presentation-hierarchies-react\";\nimport { useHierarchiesLocalization } from \"../internal/UseHierarchiesLocalization.js\";\n\n/** @beta */\nexport type BaseTreeRendererProps = React.ComponentPropsWithoutRef<typeof PresentationTree>;\n\n/** @internal */\nexport function BaseTreeRenderer(props: BaseTreeRendererProps) {\n  const localizedStrings = useHierarchiesLocalization();\n  return <PresentationTree {...props} localizedStrings={localizedStrings} />;\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/common/components/Delayed.d.ts

@@ -1,4 +1,5 @@
 import type { PropsWithChildren } from "react";
+/** @internal */
 export declare function Delayed({ show, children }: PropsWithChildren<{
     show: boolean;
 }>): import("react/jsx-runtime").JSX.Element | null;

package/lib/esm/tree-widget-react/components/trees/common/components/Delayed.js

@@ -4,6 +4,7 @@ import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import { useLayoutEffect, useState } from "react";
+/** @internal */
 export function Delayed({ show, children }) {
     const [visible, setVisible] = useState(false);
     useLayoutEffect(() => {

package/lib/esm/tree-widget-react/components/trees/common/components/Delayed.js.map

@@ -1 +1 @@
-{"version":3,"file":"Delayed.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/Delayed.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAIlD,MAAM,UAAU,OAAO,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAwC;IAC9E,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,IAAI,EAAE;YACT,UAAU,CAAC,KAAK,CAAC,CAAC;YAClB,OAAO;SACR;QAED,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE;YAC5B,UAAU,CAAC,IAAI,CAAC,CAAC;QACnB,CAAC,EAAE,GAAG,CAAC,CAAC;QACR,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAI,CAAC,OAAO,EAAE;QACZ,OAAO,IAAI,CAAC;KACb;IAED,OAAO,4BAAG,QAAQ,GAAI,CAAC;AACzB,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 { useLayoutEffect, useState } from \"react\";\n\nimport type { PropsWithChildren } from \"react\";\n\nexport function Delayed({ show, children }: PropsWithChildren<{ show: boolean }>) {\n  const [visible, setVisible] = useState(false);\n\n  useLayoutEffect(() => {\n    if (!show) {\n      setVisible(false);\n      return;\n    }\n\n    const timer = setTimeout(() => {\n      setVisible(show);\n    }, 250);\n    return () => {\n      clearTimeout(timer);\n    };\n  }, [show]);\n\n  if (!visible) {\n    return null;\n  }\n\n  return <>{children}</>;\n}\n"]}
+{"version":3,"file":"Delayed.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/Delayed.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAIlD,gBAAgB;AAChB,MAAM,UAAU,OAAO,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAwC;IAC9E,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,UAAU,CAAC,KAAK,CAAC,CAAC;YAClB,OAAO;QACT,CAAC;QAED,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE;YAC5B,UAAU,CAAC,IAAI,CAAC,CAAC;QACnB,CAAC,EAAE,GAAG,CAAC,CAAC;QACR,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,4BAAG,QAAQ,GAAI,CAAC;AACzB,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 { useLayoutEffect, useState } from \"react\";\n\nimport type { PropsWithChildren } from \"react\";\n\n/** @internal */\nexport function Delayed({ show, children }: PropsWithChildren<{ show: boolean }>) {\n  const [visible, setVisible] = useState(false);\n\n  useLayoutEffect(() => {\n    if (!show) {\n      setVisible(false);\n      return;\n    }\n\n    const timer = setTimeout(() => {\n      setVisible(show);\n    }, 250);\n    return () => {\n      clearTimeout(timer);\n    };\n  }, [show]);\n\n  if (!visible) {\n    return null;\n  }\n\n  return <>{children}</>;\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/common/components/EmptyTree.css

@@ -0,0 +1,25 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+
+.tw-filter-empty-tree-container {
+  display: flex;
+  flex-direction: column;
+  gap: var(--iui-size-s);
+  text-align: center;
+  padding-right: var(--iui-size-xl);
+  padding-left: var(--iui-size-xl);
+  padding-top: var(--iui-size-xs);
+}
+
+.tw-empty-tree-container {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  padding: var(--iui-size-s);
+  gap: var(--iui-size-xs);
+  width: 100%;
+  height: 100%;
+}

package/lib/esm/tree-widget-react/components/trees/common/components/EmptyTree.d.ts

@@ -0,0 +1,27 @@
+import "./EmptyTree.css";
+interface FilterEmptyTreeProps {
+    base: string;
+}
+/** @internal */
+export declare function TooManyFilterMatches({ base }: FilterEmptyTreeProps): import("react/jsx-runtime").JSX.Element;
+/** @internal */
+export declare function NoFilterMatches({ base }: FilterEmptyTreeProps): import("react/jsx-runtime").JSX.Element;
+/** @internal */
+export declare function FilterUnknownError({ base }: FilterEmptyTreeProps): import("react/jsx-runtime").JSX.Element;
+/** @internal */
+export declare function TooManyInstancesFocused({ base }: FilterEmptyTreeProps): import("react/jsx-runtime").JSX.Element;
+/** @internal */
+export declare function UnknownInstanceFocusError({ base }: FilterEmptyTreeProps): import("react/jsx-runtime").JSX.Element;
+interface SubTreeErrorProps {
+    base: string;
+    error: string;
+}
+/** @internal */
+export declare function SubTreeError({ base, error }: SubTreeErrorProps): import("react/jsx-runtime").JSX.Element;
+interface EmptyTreeContentProps {
+    icon?: string;
+}
+/** @internal */
+export declare function EmptyTreeContent({ icon }: EmptyTreeContentProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=EmptyTree.d.ts.map

package/lib/esm/tree-widget-react/components/trees/common/components/EmptyTree.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+import "./EmptyTree.css";
+import { Anchor, Text } from "@stratakit/bricks";
+import { Icon } from "@stratakit/foundations";
+import { TreeWidget } from "../../../../TreeWidget.js";
+import { useFocusedInstancesContext } from "../FocusedInstancesContext.js";
+/** @internal */
+export function TooManyFilterMatches({ base }) {
+    return (_jsxs("div", { className: "tw-filter-empty-tree-container", children: [_jsx(Text, { variant: "body-sm", children: TreeWidget.translate(`${base}.filtering.tooManyFilterMatches`) }), _jsx(Text, { variant: "body-sm", children: TreeWidget.translate(`${base}.filtering.tooManyFilterMatchesRetry`) })] }));
+}
+/** @internal */
+export function NoFilterMatches({ base }) {
+    return (_jsxs("div", { className: "tw-filter-empty-tree-container", children: [_jsx(Text, { variant: "body-sm", children: TreeWidget.translate(`${base}.filtering.noMatches`) }), _jsx(Text, { variant: "body-sm", children: TreeWidget.translate(`${base}.filtering.noMatchesRetry`) })] }));
+}
+/** @internal */
+export function FilterUnknownError({ base }) {
+    return (_jsx("div", { className: "tw-filter-empty-tree-container", children: _jsx(Text, { variant: "body-sm", children: TreeWidget.translate(`${base}.filtering.unknownFilterError`) }) }));
+}
+/** @internal */
+export function TooManyInstancesFocused({ base }) {
+    const { toggle } = useFocusedInstancesContext();
+    return (_jsxs(Text, { variant: "body-sm", className: "tw-filter-empty-tree-container", children: [TreeWidget.translate(`${base}.filtering.tooManyInstancesFocused`), _jsx(Anchor, { onClick: (e) => {
+                    e.stopPropagation();
+                    toggle();
+                }, render: _jsx("button", {}), children: TreeWidget.translate(`${base}.filtering.disableInstanceFocusMode`) })] }));
+}
+/** @internal */
+export function UnknownInstanceFocusError({ base }) {
+    const { toggle } = useFocusedInstancesContext();
+    return (_jsxs(Text, { variant: "body-sm", className: "tw-filter-empty-tree-container", children: [TreeWidget.translate(`${base}.filtering.unknownInstanceFocusError`), _jsx(Anchor, { onClick: (e) => {
+                    e.stopPropagation();
+                    toggle();
+                }, render: _jsx("button", {}), children: TreeWidget.translate(`${base}.filtering.disableInstanceFocusMode`) })] }));
+}
+/** @internal */
+export function SubTreeError({ base, error }) {
+    return (_jsx("div", { className: "tw-filter-empty-tree-container", children: _jsx(Text, { variant: "body-sm", children: TreeWidget.translate(`${base}.subTree.${error}`) }) }));
+}
+/** @internal */
+export function EmptyTreeContent({ icon }) {
+    return (_jsxs("div", { className: "tw-empty-tree-container", children: [icon ? _jsx(Icon, { size: "large", href: icon }) : null, _jsx(Text, { variant: "body-sm", style: { textAlign: "center" }, children: TreeWidget.translate("baseTree.dataIsNotAvailable") })] }));
+}
+//# sourceMappingURL=EmptyTree.js.map

package/lib/esm/tree-widget-react/components/trees/common/components/EmptyTree.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyTree.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/EmptyTree.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 \"./EmptyTree.css\";\n\nimport { Anchor, Text } from \"@stratakit/bricks\";\nimport { Icon } from \"@stratakit/foundations\";\nimport { TreeWidget } from \"../../../../TreeWidget.js\";\nimport { useFocusedInstancesContext } from \"../FocusedInstancesContext.js\";\n\ninterface FilterEmptyTreeProps {\n  base: string;\n}\n\n/** @internal */\nexport function TooManyFilterMatches({ base }: FilterEmptyTreeProps) {\n  return (\n    <div className={\"tw-filter-empty-tree-container\"}>\n      <Text variant={\"body-sm\"}>{TreeWidget.translate(`${base}.filtering.tooManyFilterMatches`)}</Text>\n      <Text variant={\"body-sm\"}>{TreeWidget.translate(`${base}.filtering.tooManyFilterMatchesRetry`)}</Text>\n    </div>\n  );\n}\n\n/** @internal */\nexport function NoFilterMatches({ base }: FilterEmptyTreeProps) {\n  return (\n    <div className={\"tw-filter-empty-tree-container\"}>\n      <Text variant={\"body-sm\"}>{TreeWidget.translate(`${base}.filtering.noMatches`)}</Text>\n      <Text variant={\"body-sm\"}>{TreeWidget.translate(`${base}.filtering.noMatchesRetry`)}</Text>\n    </div>\n  );\n}\n\n/** @internal */\nexport function FilterUnknownError({ base }: FilterEmptyTreeProps) {\n  return (\n    <div className={\"tw-filter-empty-tree-container\"}>\n      <Text variant={\"body-sm\"}>{TreeWidget.translate(`${base}.filtering.unknownFilterError`)}</Text>\n    </div>\n  );\n}\n\n/** @internal */\nexport function TooManyInstancesFocused({ base }: FilterEmptyTreeProps) {\n  const { toggle } = useFocusedInstancesContext();\n  return (\n    <Text variant=\"body-sm\" className={\"tw-filter-empty-tree-container\"}>\n      {TreeWidget.translate(`${base}.filtering.tooManyInstancesFocused`)}\n      <Anchor\n        onClick={(e) => {\n          e.stopPropagation();\n          toggle();\n        }}\n        render={<button />}\n      >\n        {TreeWidget.translate(`${base}.filtering.disableInstanceFocusMode`)}\n      </Anchor>\n    </Text>\n  );\n}\n\n/** @internal */\nexport function UnknownInstanceFocusError({ base }: FilterEmptyTreeProps) {\n  const { toggle } = useFocusedInstancesContext();\n  return (\n    <Text variant=\"body-sm\" className={\"tw-filter-empty-tree-container\"}>\n      {TreeWidget.translate(`${base}.filtering.unknownInstanceFocusError`)}\n      <Anchor\n        onClick={(e) => {\n          e.stopPropagation();\n          toggle();\n        }}\n        render={<button />}\n      >\n        {TreeWidget.translate(`${base}.filtering.disableInstanceFocusMode`)}\n      </Anchor>\n    </Text>\n  );\n}\n\ninterface SubTreeErrorProps {\n  base: string;\n  error: string;\n}\n\n/** @internal */\nexport function SubTreeError({ base, error }: SubTreeErrorProps) {\n  return (\n    <div className={\"tw-filter-empty-tree-container\"}>\n      <Text variant={\"body-sm\"}>{TreeWidget.translate(`${base}.subTree.${error}`)}</Text>\n    </div>\n  );\n}\n\ninterface EmptyTreeContentProps {\n  icon?: string;\n}\n\n/** @internal */\nexport function EmptyTreeContent({ icon }: EmptyTreeContentProps) {\n  return (\n    <div className={\"tw-empty-tree-container\"}>\n      {icon ? <Icon size=\"large\" href={icon} /> : null}\n      <Text variant={\"body-sm\"} style={{ textAlign: \"center\" }}>\n        {TreeWidget.translate(\"baseTree.dataIsNotAvailable\")}\n      </Text>\n    </div>\n  );\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/common/components/ProgressOverlay.d.ts

@@ -1,3 +1,4 @@
 import "./ProgressOverlay.css";
+/** @internal */
 export declare function ProgressOverlay(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ProgressOverlay.d.ts.map

package/lib/esm/tree-widget-react/components/trees/common/components/ProgressOverlay.js

@@ -4,9 +4,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import "./ProgressOverlay.css";
-import { Spinner } from "@itwin/itwinui-react/bricks";
-// TODO: replace spinner with ProgressLinear equivalent
+import { ProgressBar, VisuallyHidden } from "@stratakit/bricks";
+import { TreeWidget } from "../../../../TreeWidget.js";
+/** @internal */
 export function ProgressOverlay() {
-    return (_jsxs("div", { className: "tw-progress-overlay-container", children: [_jsx(Spinner, {}), _jsx("div", { className: "tw-progress-overlay-backdrop" })] }));
+    return (_jsxs("div", { className: "tw-progress-overlay-container", children: [_jsx(ProgressBar, { "aria-labelledby": "tw-progress-bar", tone: "accent" }), _jsx(VisuallyHidden, { id: "tw-progress-bar", children: TreeWidget.translate("loading.filter") }), _jsx("div", { className: "tw-progress-overlay-backdrop" })] }));
 }
 //# sourceMappingURL=ProgressOverlay.js.map

package/lib/esm/tree-widget-react/components/trees/common/components/ProgressOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressOverlay.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/ProgressOverlay.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,uBAAuB,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AAEtD,uDAAuD;AACvD,MAAM,UAAU,eAAe;IAC7B,OAAO,CACL,eAAK,SAAS,EAAC,+BAA+B,aAC5C,KAAC,OAAO,KAAG,EACX,cAAK,SAAS,EAAC,8BAA8B,GAAG,IAC5C,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 \"./ProgressOverlay.css\";\nimport { Spinner } from \"@itwin/itwinui-react/bricks\";\n\n// TODO: replace spinner with ProgressLinear equivalent\nexport function ProgressOverlay() {\n  return (\n    <div className=\"tw-progress-overlay-container\">\n      <Spinner />\n      <div className=\"tw-progress-overlay-backdrop\" />\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"ProgressOverlay.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/ProgressOverlay.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,uBAAuB,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAEvD,gBAAgB;AAChB,MAAM,UAAU,eAAe;IAC7B,OAAO,CACL,eAAK,SAAS,EAAC,+BAA+B,aAC5C,KAAC,WAAW,uBAAkB,iBAAiB,EAAE,IAAI,EAAE,QAAQ,GAAI,EACnE,KAAC,cAAc,IAAC,EAAE,EAAE,iBAAiB,YAAG,UAAU,CAAC,SAAS,CAAC,gBAAgB,CAAC,GAAkB,EAChG,cAAK,SAAS,EAAC,8BAA8B,GAAG,IAC5C,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 \"./ProgressOverlay.css\";\n\nimport { ProgressBar, VisuallyHidden } from \"@stratakit/bricks\";\nimport { TreeWidget } from \"../../../../TreeWidget.js\";\n\n/** @internal */\nexport function ProgressOverlay() {\n  return (\n    <div className=\"tw-progress-overlay-container\">\n      <ProgressBar aria-labelledby={\"tw-progress-bar\"} tone={\"accent\"} />\n      <VisuallyHidden id={\"tw-progress-bar\"}>{TreeWidget.translate(\"loading.filter\")}</VisuallyHidden>\n      <div className=\"tw-progress-overlay-backdrop\" />\n    </div>\n  );\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/common/components/SkeletonTree.css

@@ -0,0 +1,16 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+
+.tw-skeleton-container {
+  padding-top: var(--iui-size-xs);
+
+  .tw-skeleton-row {
+    display: flex;
+    gap: var(--iui-size-2xs);
+    height: 28px;
+    align-items: center;
+    padding: 0 var(--iui-size-s);
+  }
+}

package/lib/esm/tree-widget-react/components/trees/common/components/SkeletonTree.d.ts

@@ -0,0 +1,7 @@
+import "./SkeletonTree.css";
+/**
+ * Represents the loaded tree content before it finishes loading.
+ * @beta
+ */
+export declare function SkeletonTree(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SkeletonTree.d.ts.map

package/lib/esm/tree-widget-react/components/trees/common/components/SkeletonTree.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+import "./SkeletonTree.css";
+import { Skeleton, VisuallyHidden } from "@stratakit/bricks";
+import { TreeWidget } from "../../../../TreeWidget.js";
+/**
+ * Represents the loaded tree content before it finishes loading.
+ * @beta
+ */
+export function SkeletonTree() {
+    return (_jsxs("div", { className: "tw-skeleton-container", children: [Array.from({ length: 20 }, (_, index) => (_jsx(SkeletonRow, {}, index))), _jsx(VisuallyHidden, { id: "tw-progress-bar", children: TreeWidget.translate("loading.skeleton") })] }));
+}
+function SkeletonRow() {
+    return (_jsxs("div", { className: "tw-skeleton-row", children: [_jsx(Skeleton, { variant: "object", size: "small" }), _jsx(Skeleton, { variant: "text" })] }));
+}
+//# sourceMappingURL=SkeletonTree.js.map

package/lib/esm/tree-widget-react/components/trees/common/components/SkeletonTree.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonTree.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/SkeletonTree.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,oBAAoB,CAAC;AAE5B,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAEvD;;;GAGG;AACH,MAAM,UAAU,YAAY;IAC1B,OAAO,CACL,eAAK,SAAS,EAAC,uBAAuB,aACnC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CACxC,KAAC,WAAW,MAAM,KAAK,CAAI,CAC5B,CAAC,EACF,KAAC,cAAc,IAAC,EAAE,EAAE,iBAAiB,YAAG,UAAU,CAAC,SAAS,CAAC,kBAAkB,CAAC,GAAkB,IAC9F,CACP,CAAC;AACJ,CAAC;AAED,SAAS,WAAW;IAClB,OAAO,CACL,eAAK,SAAS,EAAC,iBAAiB,aAC9B,KAAC,QAAQ,IAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,GAAI,EAC9C,KAAC,QAAQ,IAAC,OAAO,EAAE,MAAM,GAAI,IACzB,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 \"./SkeletonTree.css\";\n\nimport { Skeleton, VisuallyHidden } from \"@stratakit/bricks\";\nimport { TreeWidget } from \"../../../../TreeWidget.js\";\n\n/**\n * Represents the loaded tree content before it finishes loading.\n * @beta\n */\nexport function SkeletonTree() {\n  return (\n    <div className=\"tw-skeleton-container\">\n      {Array.from({ length: 20 }, (_, index) => (\n        <SkeletonRow key={index} />\n      ))}\n      <VisuallyHidden id={\"tw-progress-bar\"}>{TreeWidget.translate(\"loading.skeleton\")}</VisuallyHidden>\n    </div>\n  );\n}\n\nfunction SkeletonRow() {\n  return (\n    <div className=\"tw-skeleton-row\">\n      <Skeleton variant={\"object\"} size={\"small\"} />\n      <Skeleton variant={\"text\"} />\n    </div>\n  );\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/common/components/Tree.css

@@ -0,0 +1,11 @@
+/*---------------------------------------------------------------------------------------------
+ * 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-container {
+  height: 100%;
+  padding-top: var(--iui-size-xs);
+  display: flex;
+  flex-direction: column;
+}

package/lib/esm/tree-widget-react/components/trees/common/components/Tree.d.ts

@@ -1,16 +1,13 @@
-import type { BaseTreeRendererProps } from "./BaseTreeRenderer.js";
-import type { FunctionProps } from "../Utils.js";
+import "./Tree.css";
 import type { ReactNode } from "react";
 import type { IModelConnection } from "@itwin/core-frontend";
-import type { SchemaContext } from "@itwin/ecschema-metadata";
-import type { PresentationHierarchyNode, SelectionStorage, useIModelTree, useSelectionHandler } from "@itwin/presentation-hierarchies-react";
-import type { HighlightInfo } from "../UseNodeHighlighting.js";
+import type { PresentationHierarchyNode, SelectionStorage, TreeRendererProps, useIModelTree, useSelectionHandler } from "@itwin/presentation-hierarchies-react";
+import type { FunctionProps } from "../Utils.js";
+import type { BaseTreeRendererProps } from "./BaseTreeRenderer.js";
 /** @beta */
 export type TreeProps = Pick<FunctionProps<typeof useIModelTree>, "getFilteredPaths" | "getHierarchyDefinition"> & Partial<Pick<FunctionProps<typeof useSelectionHandler>, "selectionMode">> & {
     /** iModel connection that should be used to pull data from. */
     imodel: IModelConnection;
-    /** Callback for getting `SchemaContext` for specific iModel. */
-    getSchemaContext: (imodel: IModelConnection) => SchemaContext;
     /** Unique tree component name that will be used as unified selection change event source when selecting node. */
     treeName: string;
     /** Unified selection storage that should be used by tree to handle tree selection changes. */
@@ -21,7 +18,7 @@ export type TreeProps = Pick<FunctionProps<typeof useIModelTree>, "getFilteredPa
      */
     selectionPredicate?: (node: PresentationHierarchyNode) => boolean;
     /** Tree renderer that should be used to render tree data. */
-    treeRenderer: (treeProps: Required<Pick<BaseTreeRendererProps, "rootNodes" | "expandNode" | "getLabel" | "onFilterClick" | "selectNodes" | "selectionMode" | "isNodeSelected" | "getHierarchyLevelDetails" | "getLabel">>) => ReactNode;
+    treeRenderer: (treeProps: Required<Pick<BaseTreeRendererProps, "getLabel" | "onFilterClick" | "selectionMode" | "getLabel"> & TreeRendererProps>) => ReactNode;
     /** Custom iModel access that is stored outside tree component. If not provided it new iModel access will be created using `imodel` prop. */
     imodelAccess?: FunctionProps<typeof useIModelTree>["imodelAccess"];
     /** Size limit that should be applied on each hierarchy level. Default to `1000`. */
@@ -30,12 +27,12 @@ export type TreeProps = Pick<FunctionProps<typeof useIModelTree>, "getFilteredPa
     emptyTreeContent?: ReactNode;
     /** Callback that this invoked when tree reloads. */
     onReload?: () => void;
-    /** Options for highlighting node labels. */
-    highlight?: HighlightInfo;
+    /** Text that should be highlighted in node labels. */
+    highlightText?: string;
 };
 /**
  * Default tree component that manages tree state and renders using supplied `treeRenderer`.
- * @Beta
+ * @beta
  */
-export declare function Tree({ getSchemaContext, hierarchyLevelSizeLimit, selectionStorage, imodelAccess: providedIModelAccess, ...props }: TreeProps): import("react/jsx-runtime").JSX.Element;
+export declare function Tree({ hierarchyLevelSizeLimit, getHierarchyDefinition, getFilteredPaths, selectionStorage, imodelAccess: providedIModelAccess, treeName, onReload, ...props }: TreeProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Tree.d.ts.map

package/lib/esm/tree-widget-react/components/trees/common/components/Tree.js

@@ -1,46 +1,46 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 /*---------------------------------------------------------------------------------------------
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import { useCallback, useMemo, useState } from "react";
+import "./Tree.css";
+import { useCallback, useState } from "react";
 import { BeEvent } from "@itwin/core-bentley";
-import { Spinner } from "@itwin/itwinui-react/bricks";
 import { SchemaMetadataContextProvider } from "@itwin/presentation-components";
-import { useIModelUnifiedSelectionTree } from "@itwin/presentation-hierarchies-react";
-import { UnifiedSelectionContextProvider } from "@itwin/unified-selection-react";
-import { useHierarchiesLocalization } from "../UseHierarchiesLocalization.js";
-import { useHierarchyLevelFiltering } from "../UseHierarchyFiltering.js";
-import { useIModelChangeListener } from "../UseIModelChangeListener.js";
-import { useNodeHighlighting } from "../UseNodeHighlighting.js";
+import { StrataKitRootErrorRenderer, useIModelUnifiedSelectionTree, useNodeHighlighting } from "@itwin/presentation-hierarchies-react";
+import { TreeWidget } from "../../../../TreeWidget.js";
+import { useHierarchiesLocalization } from "../internal/UseHierarchiesLocalization.js";
+import { useHierarchyLevelFiltering } from "../internal/UseHierarchyFiltering.js";
+import { useIModelAccess } from "../internal/UseIModelAccess.js";
+import { useIModelChangeListener } from "../internal/UseIModelChangeListener.js";
 import { useReportingAction, useTelemetryContext } from "../UseTelemetryContext.js";
-import { createIModelAccess } from "../Utils.js";
+import { LOGGING_NAMESPACE } from "../Utils.js";
 import { Delayed } from "./Delayed.js";
-import { EmptyTreeContent } from "./EmptyTreeContent.js";
+import { EmptyTreeContent } from "./EmptyTree.js";
 import { ProgressOverlay } from "./ProgressOverlay.js";
+import { SkeletonTree } from "./SkeletonTree.js";
 /**
  * Default tree component that manages tree state and renders using supplied `treeRenderer`.
- * @Beta
+ * @beta
  */
-export function Tree({ getSchemaContext, hierarchyLevelSizeLimit, selectionStorage, imodelAccess: providedIModelAccess, ...props }) {
-    const defaultHierarchyLevelSizeLimit = hierarchyLevelSizeLimit ?? 1000;
-    const imodelAccess = useMemo(() => {
-        return providedIModelAccess ?? createIModelAccess({ getSchemaContext, imodel: props.imodel });
-    }, [providedIModelAccess, getSchemaContext, props.imodel]);
-    return (_jsx(SchemaMetadataContextProvider, { imodel: props.imodel, schemaContextProvider: getSchemaContext, children: _jsx(TreeImpl, { ...props, selectionStorage: selectionStorage, imodelAccess: imodelAccess, defaultHierarchyLevelSizeLimit: defaultHierarchyLevelSizeLimit }) }));
-}
-function TreeImpl({ imodel, imodelAccess, treeName, emptyTreeContent, getFilteredPaths, defaultHierarchyLevelSizeLimit, getHierarchyDefinition, selectionPredicate, selectionMode, onReload, treeRenderer, selectionStorage, highlight, }) {
-    const localizedStrings = useHierarchiesLocalization();
+export function Tree({ hierarchyLevelSizeLimit, getHierarchyDefinition, getFilteredPaths, selectionStorage, imodelAccess: providedIModelAccess, treeName, onReload, ...props }) {
     const { onFeatureUsed, onPerformanceMeasured } = useTelemetryContext();
     const [imodelChanged] = useState(new BeEvent());
-    const { rootNodes, getNode, isLoading, selectNodes: selectNodesAction, setFormatter: _setFormatter, expandNode, ...treeProps } = useIModelUnifiedSelectionTree({
+    const localizedStrings = useHierarchiesLocalization();
+    const { imodelAccess, currentHierarchyLevelSizeLimit } = useIModelAccess({
+        imodel: props.imodel,
+        imodelAccess: providedIModelAccess,
+        treeName,
+        hierarchyLevelSizeLimit,
+    });
+    const { getNode, setFormatter: _setFormatter, isReloading, ...treeProps } = useIModelUnifiedSelectionTree({
         imodelAccess,
         imodelChanged,
-        selectionStorage,
         getHierarchyDefinition,
         getFilteredPaths,
         sourceName: treeName,
         localizedStrings,
+        selectionStorage,
         onPerformanceMeasured: (action, duration) => {
             if (action === "reload") {
                 onReload?.();
@@ -54,35 +54,52 @@ function TreeImpl({ imodel, imodelAccess, treeName, emptyTreeContent, getFiltere
             onFeatureUsed({ featureId: `error-${type}`, reportInteraction: false });
         },
     });
-    useIModelChangeListener({ imodel, action: useCallback(() => imodelChanged.raiseEvent(), [imodelChanged]) });
+    useIModelChangeListener({
+        imodel: props.imodel,
+        action: useCallback(() => {
+            TreeWidget.logger.logTrace(`${LOGGING_NAMESPACE}.${treeName}`, `iModel data changed`);
+            imodelChanged.raiseEvent();
+        }, [imodelChanged, treeName]),
+    });
+    if (treeProps.rootErrorRendererProps !== undefined) {
+        return _jsx(StrataKitRootErrorRenderer, { ...treeProps.rootErrorRendererProps });
+    }
+    return (_jsx(TreeBase, { ...props, isReloading: isReloading, treeRendererProps: treeProps.treeRendererProps, getNode: getNode, currentHierarchyLevelSizeLimit: currentHierarchyLevelSizeLimit }));
+}
+/** @internal */
+function TreeBase({ treeRendererProps, ...props }) {
+    const getSchemaContext = useCallback(() => props.imodel.schemaContext, [props.imodel]);
+    if (treeRendererProps === undefined) {
+        return _jsx(SkeletonTree, {});
+    }
+    return (_jsx(SchemaMetadataContextProvider, { imodel: props.imodel, schemaContextProvider: getSchemaContext, children: _jsx(TreeBaseImpl, { ...props, treeRendererProps: treeRendererProps }) }));
+}
+function TreeBaseImpl({ imodel, emptyTreeContent, currentHierarchyLevelSizeLimit, selectionPredicate, selectionMode, treeRenderer, highlightText, treeRendererProps, isReloading, getNode, }) {
     const selectNodes = useSelectionPredicate({
-        action: useReportingAction({ action: selectNodesAction }),
+        action: useReportingAction({ action: treeRendererProps.selectNodes }),
         predicate: selectionPredicate,
         getNode,
     });
     const { filteringDialog, onFilterClick } = useHierarchyLevelFiltering({
         imodel,
-        defaultHierarchyLevelSizeLimit,
+        defaultHierarchyLevelSizeLimit: currentHierarchyLevelSizeLimit,
     });
-    const reportingExpandNode = useReportingAction({ action: expandNode });
+    const reportingExpandNode = useReportingAction({ action: treeRendererProps.expandNode });
     const reportingOnFilterClicked = useReportingAction({ action: onFilterClick });
-    const { getLabel } = useNodeHighlighting({ rootNodes, highlight });
-    if (rootNodes === undefined) {
-        return (_jsx("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", flexDirection: "column", width: "100%", height: "100%" }, children: _jsx(Delayed, { show: true, children: _jsx(Spinner, {}) }) }));
+    // Don't highlight nodes if tree is reloading
+    const { getLabel } = useNodeHighlighting({ highlightText: isReloading ? undefined : highlightText });
+    if (treeRendererProps.rootNodes.length === 0 && !isReloading) {
+        return _jsx(_Fragment, { children: emptyTreeContent ? emptyTreeContent : _jsx(EmptyTreeContent, {}) });
     }
-    if (rootNodes.length === 0 && !isLoading) {
-        return (_jsx("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", flexDirection: "column", width: "100%", height: "100%" }, children: emptyTreeContent ? emptyTreeContent : _jsx(EmptyTreeContent, {}) }));
-    }
-    const treeRendererProps = {
-        ...treeProps,
-        rootNodes,
-        selectionMode: selectionMode ?? "single",
+    const treeRenderProps = {
+        ...treeRendererProps,
         selectNodes,
+        selectionMode: selectionMode ?? "single",
         expandNode: reportingExpandNode,
         onFilterClick: reportingOnFilterClicked,
         getLabel,
     };
-    return (_jsx(UnifiedSelectionContextProvider, { storage: selectionStorage, children: _jsxs("div", { style: { position: "relative", height: "100%", overflow: "hidden" }, children: [_jsxs("div", { id: "tw-tree-renderer-container", style: { overflow: "auto", height: "100%" }, children: [treeRenderer(treeRendererProps), filteringDialog] }), _jsx(Delayed, { show: isLoading, children: _jsx(ProgressOverlay, {}) })] }) }));
+    return (_jsxs("div", { style: { position: "relative", height: "100%", overflow: "hidden" }, children: [_jsxs("div", { className: "tw-tree-renderer-container", id: "tw-tree-renderer-container", children: [treeRenderer(treeRenderProps), filteringDialog] }), _jsx(Delayed, { show: isReloading, children: _jsx(ProgressOverlay, {}) })] }));
 }
 function useSelectionPredicate({ action, predicate, getNode, }) {
     return useCallback((nodeIds, changeType) => action(nodeIds.filter((nodeId) => {

package/lib/esm/tree-widget-react/components/trees/common/components/Tree.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tree.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/Tree.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAC/E,OAAO,EAAE,6BAA6B,EAAE,MAAM,uCAAuC,CAAC;AACtF,OAAO,EAAE,+BAA+B,EAAE,MAAM,gCAAgC,CAAC;AACjF,OAAO,EAAE,0BAA0B,EAAE,MAAM,kCAAkC,CAAC;AAC9E,OAAO,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAC;AACzE,OAAO,EAAE,uBAAuB,EAAE,MAAM,+BAA+B,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAChE,OAAO,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AACpF,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAwDvD;;;GAGG;AACH,MAAM,UAAU,IAAI,CAAC,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,YAAY,EAAE,oBAAoB,EAAE,GAAG,KAAK,EAAa;IAC3I,MAAM,8BAA8B,GAAG,uBAAuB,IAAI,IAAI,CAAC;IAEvE,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE;QAChC,OAAO,oBAAoB,IAAI,kBAAkB,CAAC,EAAE,gBAAgB,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC;IAChG,CAAC,EAAE,CAAC,oBAAoB,EAAE,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAE3D,OAAO,CACL,KAAC,6BAA6B,IAAC,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,qBAAqB,EAAE,gBAAgB,YAC1F,KAAC,QAAQ,OAAK,KAAK,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,YAAY,EAAE,YAAY,EAAE,8BAA8B,EAAE,8BAA8B,GAAI,GACzH,CACjC,CAAC;AACJ,CAAC;AAED,SAAS,QAAQ,CAAC,EAChB,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,gBAAgB,EAChB,gBAAgB,EAChB,8BAA8B,EAC9B,sBAAsB,EACtB,kBAAkB,EAClB,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,SAAS,GACsG;IAC/G,MAAM,gBAAgB,GAAG,0BAA0B,EAAE,CAAC;IACtD,MAAM,EAAE,aAAa,EAAE,qBAAqB,EAAE,GAAG,mBAAmB,EAAE,CAAC;IACvE,MAAM,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAC,IAAI,OAAO,EAAc,CAAC,CAAC;IAC5D,MAAM,EACJ,SAAS,EACT,OAAO,EACP,SAAS,EACT,WAAW,EAAE,iBAAiB,EAC9B,YAAY,EAAE,aAAa,EAC3B,UAAU,EACV,GAAG,SAAS,EACb,GAAG,6BAA6B,CAAC;QAChC,YAAY;QACZ,aAAa;QACb,gBAAgB;QAChB,sBAAsB;QACtB,gBAAgB;QAChB,UAAU,EAAE,QAAQ;QACpB,gBAAgB;QAChB,qBAAqB,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE;YAC1C,IAAI,MAAM,KAAK,QAAQ,EAAE;gBACvB,QAAQ,EAAE,EAAE,CAAC;aACd;YACD,qBAAqB,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QAC1C,CAAC;QACD,wBAAwB,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,EAAE,SAAS,EAAE,gCAAgC,EAAE,iBAAiB,EAAE,KAAK,EAAE,CAAC;QACxH,oBAAoB,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE;YACxC,sCAAsC;YACtC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YACrB,aAAa,CAAC,EAAE,SAAS,EAAE,SAAS,IAAI,EAAE,EAAE,iBAAiB,EAAE,KAAK,EAAE,CAAC,CAAC;QAC1E,CAAC;KACF,CAAC,CAAC;IACH,uBAAuB,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,CAAC,GAAG,EAAE,CAAC,aAAa,CAAC,UAAU,EAAE,EAAE,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC;IAE5G,MAAM,WAAW,GAAG,qBAAqB,CAAC;QACxC,MAAM,EAAE,kBAAkB,CAAC,EAAE,MAAM,EAAE,iBAAiB,EAAE,CAAC;QACzD,SAAS,EAAE,kBAAkB;QAC7B,OAAO;KACR,CAAC,CAAC;IACH,MAAM,EAAE,eAAe,EAAE,aAAa,EAAE,GAAG,0BAA0B,CAAC;QACpE,MAAM;QACN,8BAA8B;KAC/B,CAAC,CAAC;IACH,MAAM,mBAAmB,GAAG,kBAAkB,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,CAAC,CAAC;IACvE,MAAM,wBAAwB,GAAG,kBAAkB,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,CAAC,CAAC;IAC/E,MAAM,EAAE,QAAQ,EAAE,GAAG,mBAAmB,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,CAAC;IAEnE,IAAI,SAAS,KAAK,SAAS,EAAE;QAC3B,OAAO,CACL,cAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,YACrI,KAAC,OAAO,IAAC,IAAI,EAAE,IAAI,YACjB,KAAC,OAAO,KAAG,GACH,GACN,CACP,CAAC;KACH;IAED,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,SAAS,EAAE;QACxC,OAAO,CACL,cAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,YACpI,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAAC,gBAAgB,KAAG,GACvD,CACP,CAAC;KACH;IAED,MAAM,iBAAiB,GAA6C;QAClE,GAAG,SAAS;QACZ,SAAS;QACT,aAAa,EAAE,aAAa,IAAI,QAAQ;QACxC,WAAW;QACX,UAAU,EAAE,mBAAmB;QAC/B,aAAa,EAAE,wBAAwB;QACvC,QAAQ;KACT,CAAC;IAEF,OAAO,CACL,KAAC,+BAA+B,IAAC,OAAO,EAAE,gBAAgB,YACxD,eAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,aACtE,eAAK,EAAE,EAAC,4BAA4B,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,aAC7E,YAAY,CAAC,iBAAiB,CAAC,EAC/B,eAAe,IACZ,EACN,KAAC,OAAO,IAAC,IAAI,EAAE,SAAS,YACtB,KAAC,eAAe,KAAG,GACX,IACN,GAC0B,CACnC,CAAC;AACJ,CAAC;AAED,SAAS,qBAAqB,CAAC,EAC7B,MAAM,EACN,SAAS,EACT,OAAO,GAKR;IACC,OAAO,WAAW,CAChB,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CACtB,MAAM,CACJ,OAAO,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE;QACxB,MAAM,IAAI,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;QAC7B,OAAO,IAAI,IAAI,CAAC,CAAC,SAAS,IAAI,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;IACjD,CAAC,CAAC,EACF,UAAU,CACX,EACH,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,CAAC,CAC7B,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 { useCallback, useMemo, useState } from \"react\";\nimport { BeEvent } from \"@itwin/core-bentley\";\nimport { Spinner } from \"@itwin/itwinui-react/bricks\";\nimport { SchemaMetadataContextProvider } from \"@itwin/presentation-components\";\nimport { useIModelUnifiedSelectionTree } from \"@itwin/presentation-hierarchies-react\";\nimport { UnifiedSelectionContextProvider } from \"@itwin/unified-selection-react\";\nimport { useHierarchiesLocalization } from \"../UseHierarchiesLocalization.js\";\nimport { useHierarchyLevelFiltering } from \"../UseHierarchyFiltering.js\";\nimport { useIModelChangeListener } from \"../UseIModelChangeListener.js\";\nimport { useNodeHighlighting } from \"../UseNodeHighlighting.js\";\nimport { useReportingAction, useTelemetryContext } from \"../UseTelemetryContext.js\";\nimport { createIModelAccess } from \"../Utils.js\";\nimport { Delayed } from \"./Delayed.js\";\nimport { EmptyTreeContent } from \"./EmptyTreeContent.js\";\nimport { ProgressOverlay } from \"./ProgressOverlay.js\";\n\nimport type { BaseTreeRendererProps } from \"./BaseTreeRenderer.js\";\nimport type { MarkRequired } from \"@itwin/core-bentley\";\nimport type { FunctionProps } from \"../Utils.js\";\nimport type { ReactNode } from \"react\";\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport type { SchemaContext } from \"@itwin/ecschema-metadata\";\nimport type { PresentationHierarchyNode, SelectionStorage, useIModelTree, useSelectionHandler } from \"@itwin/presentation-hierarchies-react\";\nimport type { HighlightInfo } from \"../UseNodeHighlighting.js\";\n\n/** @beta */\nexport type TreeProps = Pick<FunctionProps<typeof useIModelTree>, \"getFilteredPaths\" | \"getHierarchyDefinition\"> &\n  Partial<Pick<FunctionProps<typeof useSelectionHandler>, \"selectionMode\">> & {\n    /** iModel connection that should be used to pull data from. */\n    imodel: IModelConnection;\n    /** Callback for getting `SchemaContext` for specific iModel. */\n    getSchemaContext: (imodel: IModelConnection) => SchemaContext;\n    /** Unique tree component name that will be used as unified selection change event source when selecting node. */\n    treeName: string;\n    /** Unified selection storage that should be used by tree to handle tree selection changes. */\n    selectionStorage: SelectionStorage;\n    /**\n     * An optional predicate to allow or prohibit selection of a node.\n     * When not supplied, all nodes are selectable.\n     */\n    selectionPredicate?: (node: PresentationHierarchyNode) => boolean;\n    /** Tree renderer that should be used to render tree data. */\n    treeRenderer: (\n      treeProps: Required<\n        Pick<\n          BaseTreeRendererProps,\n          | \"rootNodes\"\n          | \"expandNode\"\n          | \"getLabel\"\n          | \"onFilterClick\"\n          | \"selectNodes\"\n          | \"selectionMode\"\n          | \"isNodeSelected\"\n          | \"getHierarchyLevelDetails\"\n          | \"getLabel\"\n        >\n      >,\n    ) => ReactNode;\n    /** Custom iModel access that is stored outside tree component. If not provided it new iModel access will be created using `imodel` prop. */\n    imodelAccess?: FunctionProps<typeof useIModelTree>[\"imodelAccess\"];\n    /** Size limit that should be applied on each hierarchy level. Default to `1000`. */\n    hierarchyLevelSizeLimit?: number;\n    /** Component that should be renderer if there are no tree nodes. */\n    emptyTreeContent?: ReactNode;\n    /** Callback that this invoked when tree reloads. */\n    onReload?: () => void;\n    /** Options for highlighting node labels. */\n    highlight?: HighlightInfo;\n  };\n\n/**\n * Default tree component that manages tree state and renders using supplied `treeRenderer`.\n * @Beta\n */\nexport function Tree({ getSchemaContext, hierarchyLevelSizeLimit, selectionStorage, imodelAccess: providedIModelAccess, ...props }: TreeProps) {\n  const defaultHierarchyLevelSizeLimit = hierarchyLevelSizeLimit ?? 1000;\n\n  const imodelAccess = useMemo(() => {\n    return providedIModelAccess ?? createIModelAccess({ getSchemaContext, imodel: props.imodel });\n  }, [providedIModelAccess, getSchemaContext, props.imodel]);\n\n  return (\n    <SchemaMetadataContextProvider imodel={props.imodel} schemaContextProvider={getSchemaContext}>\n      <TreeImpl {...props} selectionStorage={selectionStorage} imodelAccess={imodelAccess} defaultHierarchyLevelSizeLimit={defaultHierarchyLevelSizeLimit} />\n    </SchemaMetadataContextProvider>\n  );\n}\n\nfunction TreeImpl({\n  imodel,\n  imodelAccess,\n  treeName,\n  emptyTreeContent,\n  getFilteredPaths,\n  defaultHierarchyLevelSizeLimit,\n  getHierarchyDefinition,\n  selectionPredicate,\n  selectionMode,\n  onReload,\n  treeRenderer,\n  selectionStorage,\n  highlight,\n}: MarkRequired<Omit<TreeProps, \"getSchemaContext\">, \"imodelAccess\"> & { defaultHierarchyLevelSizeLimit: number }) {\n  const localizedStrings = useHierarchiesLocalization();\n  const { onFeatureUsed, onPerformanceMeasured } = useTelemetryContext();\n  const [imodelChanged] = useState(new BeEvent<() => void>());\n  const {\n    rootNodes,\n    getNode,\n    isLoading,\n    selectNodes: selectNodesAction,\n    setFormatter: _setFormatter,\n    expandNode,\n    ...treeProps\n  } = useIModelUnifiedSelectionTree({\n    imodelAccess,\n    imodelChanged,\n    selectionStorage,\n    getHierarchyDefinition,\n    getFilteredPaths,\n    sourceName: treeName,\n    localizedStrings,\n    onPerformanceMeasured: (action, duration) => {\n      if (action === \"reload\") {\n        onReload?.();\n      }\n      onPerformanceMeasured(action, duration);\n    },\n    onHierarchyLimitExceeded: () => onFeatureUsed({ featureId: \"hierarchy-level-size-limit-hit\", reportInteraction: false }),\n    onHierarchyLoadError: ({ type, error }) => {\n      // eslint-disable-next-line no-console\n      console.error(error);\n      onFeatureUsed({ featureId: `error-${type}`, reportInteraction: false });\n    },\n  });\n  useIModelChangeListener({ imodel, action: useCallback(() => imodelChanged.raiseEvent(), [imodelChanged]) });\n\n  const selectNodes = useSelectionPredicate({\n    action: useReportingAction({ action: selectNodesAction }),\n    predicate: selectionPredicate,\n    getNode,\n  });\n  const { filteringDialog, onFilterClick } = useHierarchyLevelFiltering({\n    imodel,\n    defaultHierarchyLevelSizeLimit,\n  });\n  const reportingExpandNode = useReportingAction({ action: expandNode });\n  const reportingOnFilterClicked = useReportingAction({ action: onFilterClick });\n  const { getLabel } = useNodeHighlighting({ rootNodes, highlight });\n\n  if (rootNodes === undefined) {\n    return (\n      <div style={{ display: \"flex\", alignItems: \"center\", justifyContent: \"center\", flexDirection: \"column\", width: \"100%\", height: \"100%\" }}>\n        <Delayed show={true}>\n          <Spinner />\n        </Delayed>\n      </div>\n    );\n  }\n\n  if (rootNodes.length === 0 && !isLoading) {\n    return (\n      <div style={{ display: \"flex\", alignItems: \"center\", justifyContent: \"center\", flexDirection: \"column\", width: \"100%\", height: \"100%\" }}>\n        {emptyTreeContent ? emptyTreeContent : <EmptyTreeContent />}\n      </div>\n    );\n  }\n\n  const treeRendererProps: FunctionProps<TreeProps[\"treeRenderer\"]> = {\n    ...treeProps,\n    rootNodes,\n    selectionMode: selectionMode ?? \"single\",\n    selectNodes,\n    expandNode: reportingExpandNode,\n    onFilterClick: reportingOnFilterClicked,\n    getLabel,\n  };\n\n  return (\n    <UnifiedSelectionContextProvider storage={selectionStorage}>\n      <div style={{ position: \"relative\", height: \"100%\", overflow: \"hidden\" }}>\n        <div id=\"tw-tree-renderer-container\" style={{ overflow: \"auto\", height: \"100%\" }}>\n          {treeRenderer(treeRendererProps)}\n          {filteringDialog}\n        </div>\n        <Delayed show={isLoading}>\n          <ProgressOverlay />\n        </Delayed>\n      </div>\n    </UnifiedSelectionContextProvider>\n  );\n}\n\nfunction useSelectionPredicate({\n  action,\n  predicate,\n  getNode,\n}: {\n  action: (...args: any[]) => void;\n  predicate?: (node: PresentationHierarchyNode) => boolean;\n  getNode: (nodeId: string) => PresentationHierarchyNode | undefined;\n}): ReturnType<typeof useIModelUnifiedSelectionTree>[\"selectNodes\"] {\n  return useCallback(\n    (nodeIds, changeType) =>\n      action(\n        nodeIds.filter((nodeId) => {\n          const node = getNode(nodeId);\n          return node && (!predicate || predicate(node));\n        }),\n        changeType,\n      ),\n    [action, getNode, predicate],\n  );\n}\n"]}
+{"version":3,"file":"Tree.js","sourceRoot":"","sources":["../../../../../../../src/tree-widget-react/components/trees/common/components/Tree.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 \"./Tree.css\";\n\nimport { useCallback, useState } from \"react\";\nimport { BeEvent } from \"@itwin/core-bentley\";\nimport { SchemaMetadataContextProvider } from \"@itwin/presentation-components\";\nimport { StrataKitRootErrorRenderer, useIModelUnifiedSelectionTree, useNodeHighlighting } from \"@itwin/presentation-hierarchies-react\";\nimport { TreeWidget } from \"../../../../TreeWidget.js\";\nimport { useHierarchiesLocalization } from \"../internal/UseHierarchiesLocalization.js\";\nimport { useHierarchyLevelFiltering } from \"../internal/UseHierarchyFiltering.js\";\nimport { useIModelAccess } from \"../internal/UseIModelAccess.js\";\nimport { useIModelChangeListener } from \"../internal/UseIModelChangeListener.js\";\nimport { useReportingAction, useTelemetryContext } from \"../UseTelemetryContext.js\";\nimport { LOGGING_NAMESPACE } from \"../Utils.js\";\nimport { Delayed } from \"./Delayed.js\";\nimport { EmptyTreeContent } from \"./EmptyTree.js\";\nimport { ProgressOverlay } from \"./ProgressOverlay.js\";\nimport { SkeletonTree } from \"./SkeletonTree.js\";\n\nimport type { ReactNode } from \"react\";\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport type {\n  PresentationHierarchyNode,\n  SelectionStorage,\n  TreeRendererProps,\n  useIModelTree,\n  useSelectionHandler,\n  useTree,\n} from \"@itwin/presentation-hierarchies-react\";\nimport type { FunctionProps } from \"../Utils.js\";\nimport type { BaseTreeRendererProps } from \"./BaseTreeRenderer.js\";\n\n/** @beta */\nexport type TreeProps = Pick<FunctionProps<typeof useIModelTree>, \"getFilteredPaths\" | \"getHierarchyDefinition\"> &\n  Partial<Pick<FunctionProps<typeof useSelectionHandler>, \"selectionMode\">> & {\n    /** iModel connection that should be used to pull data from. */\n    imodel: IModelConnection;\n    /** Unique tree component name that will be used as unified selection change event source when selecting node. */\n    treeName: string;\n    /** Unified selection storage that should be used by tree to handle tree selection changes. */\n    selectionStorage: SelectionStorage;\n    /**\n     * An optional predicate to allow or prohibit selection of a node.\n     * When not supplied, all nodes are selectable.\n     */\n    selectionPredicate?: (node: PresentationHierarchyNode) => boolean;\n    /** Tree renderer that should be used to render tree data. */\n    treeRenderer: (\n      treeProps: Required<Pick<BaseTreeRendererProps, \"getLabel\" | \"onFilterClick\" | \"selectionMode\" | \"getLabel\"> & TreeRendererProps>,\n    ) => ReactNode;\n    /** Custom iModel access that is stored outside tree component. If not provided it new iModel access will be created using `imodel` prop. */\n    imodelAccess?: FunctionProps<typeof useIModelTree>[\"imodelAccess\"];\n    /** Size limit that should be applied on each hierarchy level. Default to `1000`. */\n    hierarchyLevelSizeLimit?: number;\n    /** Component that should be renderer if there are no tree nodes. */\n    emptyTreeContent?: ReactNode;\n    /** Callback that this invoked when tree reloads. */\n    onReload?: () => void;\n    /** Text that should be highlighted in node labels. */\n    highlightText?: string;\n  };\n\n/**\n * Default tree component that manages tree state and renders using supplied `treeRenderer`.\n * @beta\n */\nexport function Tree({\n  hierarchyLevelSizeLimit,\n  getHierarchyDefinition,\n  getFilteredPaths,\n  selectionStorage,\n  imodelAccess: providedIModelAccess,\n  treeName,\n  onReload,\n  ...props\n}: TreeProps) {\n  const { onFeatureUsed, onPerformanceMeasured } = useTelemetryContext();\n  const [imodelChanged] = useState(new BeEvent<() => void>());\n  const localizedStrings = useHierarchiesLocalization();\n\n  const { imodelAccess, currentHierarchyLevelSizeLimit } = useIModelAccess({\n    imodel: props.imodel,\n    imodelAccess: providedIModelAccess,\n    treeName,\n    hierarchyLevelSizeLimit,\n  });\n\n  const {\n    getNode,\n    setFormatter: _setFormatter,\n    isReloading,\n    ...treeProps\n  } = useIModelUnifiedSelectionTree({\n    imodelAccess,\n    imodelChanged,\n    getHierarchyDefinition,\n    getFilteredPaths,\n    sourceName: treeName,\n    localizedStrings,\n    selectionStorage,\n    onPerformanceMeasured: (action, duration) => {\n      if (action === \"reload\") {\n        onReload?.();\n      }\n      onPerformanceMeasured(action, duration);\n    },\n    onHierarchyLimitExceeded: () => onFeatureUsed({ featureId: \"hierarchy-level-size-limit-hit\", reportInteraction: false }),\n    onHierarchyLoadError: ({ type, error }) => {\n      // eslint-disable-next-line no-console\n      console.error(error);\n      onFeatureUsed({ featureId: `error-${type}`, reportInteraction: false });\n    },\n  });\n  useIModelChangeListener({\n    imodel: props.imodel,\n    action: useCallback(() => {\n      TreeWidget.logger.logTrace(`${LOGGING_NAMESPACE}.${treeName}`, `iModel data changed`);\n      imodelChanged.raiseEvent();\n    }, [imodelChanged, treeName]),\n  });\n\n  if (treeProps.rootErrorRendererProps !== undefined) {\n    return <StrataKitRootErrorRenderer {...treeProps.rootErrorRendererProps} />;\n  }\n\n  return (\n    <TreeBase\n      {...props}\n      isReloading={isReloading}\n      treeRendererProps={treeProps.treeRendererProps}\n      getNode={getNode}\n      currentHierarchyLevelSizeLimit={currentHierarchyLevelSizeLimit}\n    />\n  );\n}\n\ntype TreeBaseProps = {\n  currentHierarchyLevelSizeLimit: number;\n  getNode: (nodeId: string) => PresentationHierarchyNode | undefined;\n  treeRendererProps?: TreeRendererProps;\n} & Omit<TreeProps, \"selectionStorage\" | \"treeName\" | \"getHierarchyDefinition\"> &\n  Pick<ReturnType<typeof useTree>, \"getNode\" | \"isReloading\">;\n\n/** @internal */\nfunction TreeBase({ treeRendererProps, ...props }: TreeBaseProps) {\n  const getSchemaContext = useCallback(() => props.imodel.schemaContext, [props.imodel]);\n\n  if (treeRendererProps === undefined) {\n    return <SkeletonTree />;\n  }\n\n  return (\n    <SchemaMetadataContextProvider imodel={props.imodel} schemaContextProvider={getSchemaContext}>\n      <TreeBaseImpl {...props} treeRendererProps={treeRendererProps} />\n    </SchemaMetadataContextProvider>\n  );\n}\n\nfunction TreeBaseImpl({\n  imodel,\n  emptyTreeContent,\n  currentHierarchyLevelSizeLimit,\n  selectionPredicate,\n  selectionMode,\n  treeRenderer,\n  highlightText,\n  treeRendererProps,\n  isReloading,\n  getNode,\n}: Omit<TreeBaseProps, \"getSchemaContext\" | \"treeRendererProps\"> & Required<Pick<TreeBaseProps, \"treeRendererProps\">>) {\n  const selectNodes = useSelectionPredicate({\n    action: useReportingAction({ action: treeRendererProps.selectNodes }),\n    predicate: selectionPredicate,\n    getNode,\n  });\n  const { filteringDialog, onFilterClick } = useHierarchyLevelFiltering({\n    imodel,\n    defaultHierarchyLevelSizeLimit: currentHierarchyLevelSizeLimit,\n  });\n  const reportingExpandNode = useReportingAction({ action: treeRendererProps.expandNode });\n  const reportingOnFilterClicked = useReportingAction({ action: onFilterClick });\n  // Don't highlight nodes if tree is reloading\n  const { getLabel } = useNodeHighlighting({ highlightText: isReloading ? undefined : highlightText });\n\n  if (treeRendererProps.rootNodes.length === 0 && !isReloading) {\n    return <>{emptyTreeContent ? emptyTreeContent : <EmptyTreeContent />}</>;\n  }\n\n  const treeRenderProps: FunctionProps<TreeProps[\"treeRenderer\"]> = {\n    ...treeRendererProps,\n    selectNodes,\n    selectionMode: selectionMode ?? \"single\",\n    expandNode: reportingExpandNode,\n    onFilterClick: reportingOnFilterClicked,\n    getLabel,\n  };\n\n  return (\n    <div style={{ position: \"relative\", height: \"100%\", overflow: \"hidden\" }}>\n      <div className={\"tw-tree-renderer-container\"} id=\"tw-tree-renderer-container\">\n        {treeRenderer(treeRenderProps)}\n        {filteringDialog}\n      </div>\n      <Delayed show={isReloading}>\n        <ProgressOverlay />\n      </Delayed>\n    </div>\n  );\n}\n\nfunction useSelectionPredicate({\n  action,\n  predicate,\n  getNode,\n}: {\n  action: (...args: any[]) => void;\n  predicate?: (node: PresentationHierarchyNode) => boolean;\n  getNode: (nodeId: string) => PresentationHierarchyNode | undefined;\n}): TreeRendererProps[\"selectNodes\"] {\n  return useCallback(\n    (nodeIds, changeType) =>\n      action(\n        nodeIds.filter((nodeId) => {\n          const node = getNode(nodeId);\n          return node && (!predicate || predicate(node));\n        }),\n        changeType,\n      ),\n    [action, getNode, predicate],\n  );\n}\n"]}

package/lib/esm/tree-widget-react/components/trees/common/components/TreeNodeVisibilityButton.css

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
-.tw-tree-node-visibility-button-hidden, .tw-tree-node-visibility-button-partial  {
+.tw-tree-node-visibility-button-hidden,
+.tw-tree-node-visibility-button-partial {
   visibility: visible;
 }

package/lib/esm/tree-widget-react/components/trees/common/components/TreeNodeVisibilityButton.d.ts

@@ -1,22 +1,38 @@
 import "./TreeNodeVisibilityButton.css";
-import type { PresentationHierarchyNode, TreeItemAction } from "@itwin/presentation-hierarchies-react";
+import type { PropsWithChildren } from "react";
+import type { PresentationHierarchyNode, TreeActionBaseAttributes } from "@itwin/presentation-hierarchies-react";
+/** @beta */
+interface LoadedTreeItemVisibilityButtonState {
+    state: "visible" | "hidden" | "partial";
+    isDisabled?: boolean;
+}
 /**
  * Data structure that describes tree node checkbox state.
  * @beta
  */
-interface TreeItemVisibilityButtonState {
-    state: "visible" | "partial" | "hidden";
-    isDisabled?: boolean;
+export type TreeItemVisibilityButtonState = (LoadedTreeItemVisibilityButtonState | {
+    isLoading: true;
+}) & {
     tooltip?: string;
-}
+};
+/**
+ * React component that renders a visibility action for a tree item.
+ * Should be used with `VisibilityTreeRenderer`.
+ * @beta
+ */
+export declare const VisibilityAction: import("react").NamedExoticComponent<{
+    node: PresentationHierarchyNode;
+} & TreeActionBaseAttributes>;
 /** @beta */
-export interface TreeItemVisibilityButtonProps {
+export interface VisibilityContext {
     /** Callback that should be invoked when checkbox is clicked. */
-    onVisibilityButtonClick: (node: PresentationHierarchyNode, state: TreeItemVisibilityButtonState["state"]) => void;
+    onVisibilityButtonClick: (node: PresentationHierarchyNode, state: LoadedTreeItemVisibilityButtonState["state"]) => void;
     /** Callback that should be used to determine current checkbox state. */
     getVisibilityButtonState: (node: PresentationHierarchyNode) => TreeItemVisibilityButtonState;
 }
 /** @internal */
-export declare function createVisibilityAction({ getVisibilityButtonState, onVisibilityButtonClick, }: TreeItemVisibilityButtonProps): (node: PresentationHierarchyNode) => TreeItemAction;
+export declare const useVisibilityContext: () => VisibilityContext | undefined;
+/** @internal */
+export declare function VisibilityContextProvider({ onVisibilityButtonClick, getVisibilityButtonState, children }: PropsWithChildren<VisibilityContext>): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=TreeNodeVisibilityButton.d.ts.map