@itwin/tree-widget-react 3.0.0-dev.2 → 3.0.0-dev.3

package/lib/esm/components/trees/models-tree/ModelsTreeButtons.js

@@ -4,9 +4,10 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import { useEffect, useMemo, useState } from "react";
-import { SvgVisibilityHalf, SvgVisibilityHide, SvgVisibilityShow } from "@itwin/itwinui-icons-react";
+import { SvgCursorClick, SvgVisibilityHalf, SvgVisibilityHide, SvgVisibilityShow } from "@itwin/itwinui-icons-react";
 import { Button, IconButton } from "@itwin/itwinui-react";
 import { TreeWidget } from "../../../TreeWidget";
+import { useFocusedInstancesContext } from "../common/FocusedInstancesContext";
 import { areAllModelsVisible, hideAllModels, invertAllModels, showAllModels, toggleModels } from "./internal/ModelsTreeVisibilityHandler";
 /** @internal */
 export function useAvailableModels(imodel) {
@@ -38,28 +39,28 @@ async function queryModelsForHeaderActions(iModel) {
     const modelProps = await iModel.models.queryProps(queryParams);
     return modelProps.map(({ id, isPlanProjection }) => ({ id, isPlanProjection })).filter(({ id }) => id);
 }
-/** @internal */
+/** @public */
 export function ShowAllButton(props) {
     return (_jsx(IconButton, { size: props.density === "enlarged" ? "large" : "small", styleType: "borderless", title: TreeWidget.translate("modelsTree.buttons.showAll.tooltip"), onClick: () => {
             props.onFeatureUsed?.("models-tree-showall");
             void showAllModels(props.models.map((model) => model.id), props.viewport);
         }, children: _jsx(SvgVisibilityShow, {}) }));
 }
-/** @internal */
+/** @public */
 export function HideAllButton(props) {
     return (_jsx(IconButton, { size: props.density === "enlarged" ? "large" : "small", styleType: "borderless", title: TreeWidget.translate("modelsTree.buttons.hideAll.tooltip"), onClick: () => {
             props.onFeatureUsed?.("models-tree-hideall");
             void hideAllModels(props.models.map((model) => model.id), props.viewport);
         }, children: _jsx(SvgVisibilityHide, {}) }));
 }
-/** @internal */
+/** @public */
 export function InvertButton(props) {
     return (_jsx(IconButton, { size: props.density === "enlarged" ? "large" : "small", styleType: "borderless", title: TreeWidget.translate("modelsTree.buttons.invert.tooltip"), onClick: () => {
             props.onFeatureUsed?.("models-tree-invert");
             void invertAllModels(props.models.map((model) => model.id), props.viewport);
         }, children: _jsx(SvgVisibilityHalf, {}) }));
 }
-/** @internal */
+/** @public */
 export function View2DButton(props) {
     const models2d = useMemo(() => {
         return props.models.filter((model) => model.isPlanProjection).map((model) => model.id);
@@ -74,7 +75,7 @@ export function View2DButton(props) {
             void toggleModels(models2d, is2dToggleActive, props.viewport);
         }, disabled: models2d.length === 0, endIcon: is2dToggleActive ? _jsx(SvgVisibilityShow, {}) : _jsx(SvgVisibilityHide, {}), children: TreeWidget.translate("modelsTree.buttons.toggle2d.label") }));
 }
-/** @internal */
+/** @public */
 export function View3DButton(props) {
     const models3d = useMemo(() => {
         return props.models.filter((model) => !model.isPlanProjection).map((model) => model.id);
@@ -89,4 +90,15 @@ export function View3DButton(props) {
             void toggleModels(models3d, is3dToggleActive, props.viewport);
         }, disabled: models3d.length === 0, endIcon: is3dToggleActive ? _jsx(SvgVisibilityShow, {}) : _jsx(SvgVisibilityHide, {}), children: TreeWidget.translate("modelsTree.buttons.toggle3d.label") }));
 }
+/** @public */
+export function ToggleInstancesFocusButton({ density, onFeatureUsed }) {
+    const { enabled, toggle } = useFocusedInstancesContext();
+    const title = enabled
+        ? TreeWidget.translate("modelsTree.buttons.toggleFocusMode.disable.tooltip")
+        : TreeWidget.translate("modelsTree.buttons.toggleFocusMode.enable.tooltip");
+    return (_jsx(IconButton, { styleType: "borderless", size: density === "enlarged" ? "large" : "small", title: title, onClick: () => {
+            onFeatureUsed?.("models-tree-instancesfocus");
+            toggle();
+        }, isActive: enabled, children: _jsx(SvgCursorClick, {}) }));
+}
 //# sourceMappingURL=ModelsTreeButtons.js.map

package/lib/esm/components/trees/models-tree/ModelsTreeButtons.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModelsTreeButtons.js","sourceRoot":"","sources":["../../../../../src/components/trees/models-tree/ModelsTreeButtons.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AACrG,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,aAAa,EAAE,eAAe,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAyB1I,gBAAgB;AAChB,MAAM,UAAU,kBAAkB,CAAC,MAAwB;IACzD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAc,EAAE,CAAC,CAAC;IAExE,SAAS,CAAC,GAAG,EAAE;QACb,2BAA2B,CAAC,MAAM,CAAC;aAChC,IAAI,CAAC,CAAC,UAAuB,EAAE,EAAE;YAChC,kBAAkB,CAAC,UAAU,CAAC,CAAC;QACjC,CAAC,CAAC;aACD,KAAK,CAAC,GAAG,EAAE;YACV,kBAAkB,CAAC,EAAE,CAAC,CAAC;QACzB,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,eAAe,CAAC;AACzB,CAAC;AAED,KAAK,UAAU,2BAA2B,CAAC,MAAwB;IACjE,MAAM,WAAW,GAAqB;QACpC,IAAI,EAAE,0BAA0B;QAChC,KAAK,EAAE;;;;;;;OAOJ;QACH,WAAW,EAAE,KAAK;KACnB,CAAC;IAEF,MAAM,UAAU,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/D,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,gBAAgB,EAAyB,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,gBAAgB,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,CAAgB,CAAC;AAC/I,CAAC;AAED,gBAAgB;AAChB,MAAM,UAAU,aAAa,CAAC,KAAkC;IAC9D,OAAO,CACL,KAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACtD,SAAS,EAAC,YAAY,EACtB,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,oCAAoC,CAAC,EACjE,OAAO,EAAE,GAAG,EAAE;YACZ,KAAK,CAAC,aAAa,EAAE,CAAC,qBAAqB,CAAC,CAAC;YAC7C,KAAK,aAAa,CAChB,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,EACrC,KAAK,CAAC,QAAQ,CACf,CAAC;QACJ,CAAC,YAED,KAAC,iBAAiB,KAAG,GACV,CACd,CAAC;AACJ,CAAC;AAED,gBAAgB;AAChB,MAAM,UAAU,aAAa,CAAC,KAAkC;IAC9D,OAAO,CACL,KAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACtD,SAAS,EAAC,YAAY,EACtB,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,oCAAoC,CAAC,EACjE,OAAO,EAAE,GAAG,EAAE;YACZ,KAAK,CAAC,aAAa,EAAE,CAAC,qBAAqB,CAAC,CAAC;YAC7C,KAAK,aAAa,CAChB,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,EACrC,KAAK,CAAC,QAAQ,CACf,CAAC;QACJ,CAAC,YAED,KAAC,iBAAiB,KAAG,GACV,CACd,CAAC;AACJ,CAAC;AAED,gBAAgB;AAChB,MAAM,UAAU,YAAY,CAAC,KAAkC;IAC7D,OAAO,CACL,KAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACtD,SAAS,EAAC,YAAY,EACtB,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,mCAAmC,CAAC,EAChE,OAAO,EAAE,GAAG,EAAE;YACZ,KAAK,CAAC,aAAa,EAAE,CAAC,oBAAoB,CAAC,CAAC;YAC5C,KAAK,eAAe,CAClB,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,EACrC,KAAK,CAAC,QAAQ,CACf,CAAC;QACJ,CAAC,YAED,KAAC,iBAAiB,KAAG,GACV,CACd,CAAC;AACJ,CAAC;AAED,gBAAgB;AAChB,MAAM,UAAU,YAAY,CAAC,KAAkC;IAC7D,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5B,OAAO,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACzF,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAEnB,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhE,SAAS,CAAC,GAAG,EAAE;QACb,mBAAmB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;QACnE,OAAO,KAAK,CAAC,QAAQ,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,EAAY,EAAE,EAAE,CAAC,mBAAmB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;IACpI,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IAE/B,OAAO,CACL,KAAC,MAAM,IACL,IAAI,EAAE,KAAK,CAAC,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACtD,SAAS,EAAC,YAAY,EACtB,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,qCAAqC,CAAC,EAClE,OAAO,EAAE,GAAG,EAAE;YACZ,KAAK,CAAC,aAAa,EAAE,CAAC,oBAAoB,CAAC,CAAC;YAC5C,KAAK,YAAY,CAAC,QAAQ,EAAE,gBAAgB,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;QAChE,CAAC,EACD,QAAQ,EAAE,QAAQ,CAAC,MAAM,KAAK,CAAC,EAC/B,OAAO,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAC,iBAAiB,KAAG,CAAC,CAAC,CAAC,KAAC,iBAAiB,KAAG,YAExE,UAAU,CAAC,SAAS,CAAC,mCAAmC,CAAC,GACnD,CACV,CAAC;AACJ,CAAC;AAED,gBAAgB;AAChB,MAAM,UAAU,YAAY,CAAC,KAAkC;IAC7D,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5B,OAAO,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAC1F,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAEnB,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhE,SAAS,CAAC,GAAG,EAAE;QACb,mBAAmB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;QACnE,OAAO,KAAK,CAAC,QAAQ,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,EAAY,EAAE,EAAE,CAAC,mBAAmB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;IACpI,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IAE/B,OAAO,CACL,KAAC,MAAM,IACL,IAAI,EAAE,KAAK,CAAC,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACtD,SAAS,EAAC,YAAY,EACtB,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,qCAAqC,CAAC,EAClE,OAAO,EAAE,GAAG,EAAE;YACZ,KAAK,CAAC,aAAa,EAAE,CAAC,oBAAoB,CAAC,CAAC;YAC5C,KAAK,YAAY,CAAC,QAAQ,EAAE,gBAAgB,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;QAChE,CAAC,EACD,QAAQ,EAAE,QAAQ,CAAC,MAAM,KAAK,CAAC,EAC/B,OAAO,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAC,iBAAiB,KAAG,CAAC,CAAC,CAAC,KAAC,iBAAiB,KAAG,YAExE,UAAU,CAAC,SAAS,CAAC,mCAAmC,CAAC,GACnD,CACV,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport { useEffect, useMemo, useState } from \"react\";\nimport { SvgVisibilityHalf, SvgVisibilityHide, SvgVisibilityShow } from \"@itwin/itwinui-icons-react\";\nimport { Button, IconButton } from \"@itwin/itwinui-react\";\nimport { TreeWidget } from \"../../../TreeWidget\";\nimport { areAllModelsVisible, hideAllModels, invertAllModels, showAllModels, toggleModels } from \"./internal/ModelsTreeVisibilityHandler\";\n\nimport type { GeometricModel3dProps, ModelQueryParams } from \"@itwin/core-common\";\nimport type { TreeHeaderButtonProps } from \"../../tree-header/TreeHeader\";\nimport type { IModelConnection, Viewport } from \"@itwin/core-frontend\";\n\n/**\n * Information about a single Model.\n * @public\n */\nexport interface ModelInfo {\n  id: string;\n  isPlanProjection?: boolean;\n}\n\n/**\n * Props that get passed to `ModelsTreeComponent` header button renderer.\n * @see ModelTreeComponentProps.headerButtons\n * @public\n */\nexport interface ModelsTreeHeaderButtonProps extends TreeHeaderButtonProps {\n  /** A list of models available in the iModel. */\n  models: ModelInfo[];\n}\n\n/** @internal */\nexport function useAvailableModels(imodel: IModelConnection) {\n  const [availableModels, setAvailableModels] = useState<ModelInfo[]>([]);\n\n  useEffect(() => {\n    queryModelsForHeaderActions(imodel)\n      .then((modelInfos: ModelInfo[]) => {\n        setAvailableModels(modelInfos);\n      })\n      .catch(() => {\n        setAvailableModels([]);\n      });\n  }, [imodel]);\n\n  return availableModels;\n}\n\nasync function queryModelsForHeaderActions(iModel: IModelConnection) {\n  const queryParams: ModelQueryParams = {\n    from: \"BisCore.GeometricModel3d\",\n    where: `\n        EXISTS (\n          SELECT 1\n          FROM BisCore.Element e\n          WHERE e.ECClassId IS (BisCore.GeometricElement3d, BisCore.InformationPartitionElement)\n            AND e.ECInstanceId = GeometricModel3d.ModeledElement.Id\n        )\n      `,\n    wantPrivate: false,\n  };\n\n  const modelProps = await iModel.models.queryProps(queryParams);\n  return modelProps.map(({ id, isPlanProjection }: GeometricModel3dProps) => ({ id, isPlanProjection })).filter(({ id }) => id) as ModelInfo[];\n}\n\n/** @internal */\nexport function ShowAllButton(props: ModelsTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.showAll.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-showall\");\n        void showAllModels(\n          props.models.map((model) => model.id),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityShow />\n    </IconButton>\n  );\n}\n\n/** @internal */\nexport function HideAllButton(props: ModelsTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.hideAll.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-hideall\");\n        void hideAllModels(\n          props.models.map((model) => model.id),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityHide />\n    </IconButton>\n  );\n}\n\n/** @internal */\nexport function InvertButton(props: ModelsTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.invert.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-invert\");\n        void invertAllModels(\n          props.models.map((model) => model.id),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityHalf />\n    </IconButton>\n  );\n}\n\n/** @internal */\nexport function View2DButton(props: ModelsTreeHeaderButtonProps) {\n  const models2d = useMemo(() => {\n    return props.models.filter((model) => model.isPlanProjection).map((model) => model.id);\n  }, [props.models]);\n\n  const [is2dToggleActive, setIs2dToggleActive] = useState(false);\n\n  useEffect(() => {\n    setIs2dToggleActive(areAllModelsVisible(models2d, props.viewport));\n    return props.viewport.onViewedModelsChanged.addListener((vp: Viewport) => setIs2dToggleActive(areAllModelsVisible(models2d, vp)));\n  }, [models2d, props.viewport]);\n\n  return (\n    <Button\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.toggle2d.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-view2d\");\n        void toggleModels(models2d, is2dToggleActive, props.viewport);\n      }}\n      disabled={models2d.length === 0}\n      endIcon={is2dToggleActive ? <SvgVisibilityShow /> : <SvgVisibilityHide />}\n    >\n      {TreeWidget.translate(\"modelsTree.buttons.toggle2d.label\")}\n    </Button>\n  );\n}\n\n/** @internal */\nexport function View3DButton(props: ModelsTreeHeaderButtonProps) {\n  const models3d = useMemo(() => {\n    return props.models.filter((model) => !model.isPlanProjection).map((model) => model.id);\n  }, [props.models]);\n\n  const [is3dToggleActive, setIs3dToggleActive] = useState(false);\n\n  useEffect(() => {\n    setIs3dToggleActive(areAllModelsVisible(models3d, props.viewport));\n    return props.viewport.onViewedModelsChanged.addListener((vp: Viewport) => setIs3dToggleActive(areAllModelsVisible(models3d, vp)));\n  }, [models3d, props.viewport]);\n\n  return (\n    <Button\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.toggle3d.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-view3d\");\n        void toggleModels(models3d, is3dToggleActive, props.viewport);\n      }}\n      disabled={models3d.length === 0}\n      endIcon={is3dToggleActive ? <SvgVisibilityShow /> : <SvgVisibilityHide />}\n    >\n      {TreeWidget.translate(\"modelsTree.buttons.toggle3d.label\")}\n    </Button>\n  );\n}\n"]}
+{"version":3,"file":"ModelsTreeButtons.js","sourceRoot":"","sources":["../../../../../src/components/trees/models-tree/ModelsTreeButtons.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 { useEffect, useMemo, useState } from \"react\";\nimport { SvgCursorClick, SvgVisibilityHalf, SvgVisibilityHide, SvgVisibilityShow } from \"@itwin/itwinui-icons-react\";\nimport { Button, IconButton } from \"@itwin/itwinui-react\";\nimport { TreeWidget } from \"../../../TreeWidget\";\nimport { useFocusedInstancesContext } from \"../common/FocusedInstancesContext\";\nimport { areAllModelsVisible, hideAllModels, invertAllModels, showAllModels, toggleModels } from \"./internal/ModelsTreeVisibilityHandler\";\n\nimport type { GeometricModel3dProps, ModelQueryParams } from \"@itwin/core-common\";\nimport type { TreeHeaderButtonProps } from \"../../tree-header/TreeHeader\";\nimport type { IModelConnection, Viewport } from \"@itwin/core-frontend\";\n/**\n * Information about a single Model.\n * @public\n */\nexport interface ModelInfo {\n  id: string;\n  isPlanProjection?: boolean;\n}\n\n/**\n * Props that get passed to `ModelsTreeComponent` header button renderer.\n * @see ModelTreeComponentProps.headerButtons\n * @public\n */\nexport interface ModelsTreeHeaderButtonProps extends TreeHeaderButtonProps {\n  /** A list of models available in the iModel. */\n  models: ModelInfo[];\n}\n\n/** @internal */\nexport function useAvailableModels(imodel: IModelConnection) {\n  const [availableModels, setAvailableModels] = useState<ModelInfo[]>([]);\n\n  useEffect(() => {\n    queryModelsForHeaderActions(imodel)\n      .then((modelInfos: ModelInfo[]) => {\n        setAvailableModels(modelInfos);\n      })\n      .catch(() => {\n        setAvailableModels([]);\n      });\n  }, [imodel]);\n\n  return availableModels;\n}\n\nasync function queryModelsForHeaderActions(iModel: IModelConnection) {\n  const queryParams: ModelQueryParams = {\n    from: \"BisCore.GeometricModel3d\",\n    where: `\n        EXISTS (\n          SELECT 1\n          FROM BisCore.Element e\n          WHERE e.ECClassId IS (BisCore.GeometricElement3d, BisCore.InformationPartitionElement)\n            AND e.ECInstanceId = GeometricModel3d.ModeledElement.Id\n        )\n      `,\n    wantPrivate: false,\n  };\n\n  const modelProps = await iModel.models.queryProps(queryParams);\n  return modelProps.map(({ id, isPlanProjection }: GeometricModel3dProps) => ({ id, isPlanProjection })).filter(({ id }) => id) as ModelInfo[];\n}\n\n/** @public */\nexport function ShowAllButton(props: ModelsTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.showAll.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-showall\");\n        void showAllModels(\n          props.models.map((model) => model.id),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityShow />\n    </IconButton>\n  );\n}\n\n/** @public */\nexport function HideAllButton(props: ModelsTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.hideAll.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-hideall\");\n        void hideAllModels(\n          props.models.map((model) => model.id),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityHide />\n    </IconButton>\n  );\n}\n\n/** @public */\nexport function InvertButton(props: ModelsTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.invert.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-invert\");\n        void invertAllModels(\n          props.models.map((model) => model.id),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityHalf />\n    </IconButton>\n  );\n}\n\n/** @public */\nexport function View2DButton(props: ModelsTreeHeaderButtonProps) {\n  const models2d = useMemo(() => {\n    return props.models.filter((model) => model.isPlanProjection).map((model) => model.id);\n  }, [props.models]);\n\n  const [is2dToggleActive, setIs2dToggleActive] = useState(false);\n\n  useEffect(() => {\n    setIs2dToggleActive(areAllModelsVisible(models2d, props.viewport));\n    return props.viewport.onViewedModelsChanged.addListener((vp: Viewport) => setIs2dToggleActive(areAllModelsVisible(models2d, vp)));\n  }, [models2d, props.viewport]);\n\n  return (\n    <Button\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.toggle2d.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-view2d\");\n        void toggleModels(models2d, is2dToggleActive, props.viewport);\n      }}\n      disabled={models2d.length === 0}\n      endIcon={is2dToggleActive ? <SvgVisibilityShow /> : <SvgVisibilityHide />}\n    >\n      {TreeWidget.translate(\"modelsTree.buttons.toggle2d.label\")}\n    </Button>\n  );\n}\n\n/** @public */\nexport function View3DButton(props: ModelsTreeHeaderButtonProps) {\n  const models3d = useMemo(() => {\n    return props.models.filter((model) => !model.isPlanProjection).map((model) => model.id);\n  }, [props.models]);\n\n  const [is3dToggleActive, setIs3dToggleActive] = useState(false);\n\n  useEffect(() => {\n    setIs3dToggleActive(areAllModelsVisible(models3d, props.viewport));\n    return props.viewport.onViewedModelsChanged.addListener((vp: Viewport) => setIs3dToggleActive(areAllModelsVisible(models3d, vp)));\n  }, [models3d, props.viewport]);\n\n  return (\n    <Button\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      title={TreeWidget.translate(\"modelsTree.buttons.toggle3d.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(\"models-tree-view3d\");\n        void toggleModels(models3d, is3dToggleActive, props.viewport);\n      }}\n      disabled={models3d.length === 0}\n      endIcon={is3dToggleActive ? <SvgVisibilityShow /> : <SvgVisibilityHide />}\n    >\n      {TreeWidget.translate(\"modelsTree.buttons.toggle3d.label\")}\n    </Button>\n  );\n}\n\n/** @public */\nexport function ToggleInstancesFocusButton({ density, onFeatureUsed }: { density?: \"default\" | \"enlarged\"; onFeatureUsed?: (feature: string) => void }) {\n  const { enabled, toggle } = useFocusedInstancesContext();\n  const title = enabled\n    ? TreeWidget.translate(\"modelsTree.buttons.toggleFocusMode.disable.tooltip\")\n    : TreeWidget.translate(\"modelsTree.buttons.toggleFocusMode.enable.tooltip\");\n  return (\n    <IconButton\n      styleType=\"borderless\"\n      size={density === \"enlarged\" ? \"large\" : \"small\"}\n      title={title}\n      onClick={() => {\n        onFeatureUsed?.(\"models-tree-instancesfocus\");\n        toggle();\n      }}\n      isActive={enabled}\n    >\n      <SvgCursorClick />\n    </IconButton>\n  );\n}\n"]}

package/lib/esm/components/trees/models-tree/ModelsTreeComponent.d.ts

@@ -1,11 +1,10 @@
 import "../Tree.scss";
 import { ModelsTree } from "./ModelsTree";
-import { HideAllButton, InvertButton, ShowAllButton, View2DButton, View3DButton } from "./ModelsTreeButtons";
+import { HideAllButton, InvertButton, ShowAllButton, ToggleInstancesFocusButton, View2DButton, View3DButton } from "./ModelsTreeButtons";
 import type { ComponentPropsWithoutRef } from "react";
-import type { SelectionStorage } from "@itwin/presentation-hierarchies-react";
 import type { ModelsTreeHeaderButtonProps } from "./ModelsTreeButtons";
-type ModelsTreeProps = ComponentPropsWithoutRef<typeof ModelsTree>;
-interface ModelsTreeComponentProps extends Pick<ModelsTreeProps, "getSchemaContext" | "density" | "hierarchyLevelConfig" | "selectionMode" | "onPerformanceMeasured" | "onFeatureUsed" | "hierarchyConfig"> {
+/** @public */
+interface ModelsTreeComponentProps extends Pick<ComponentPropsWithoutRef<typeof ModelsTree>, "getSchemaContext" | "selectionStorage" | "density" | "hierarchyLevelConfig" | "selectionMode" | "hierarchyConfig" | "visibilityHandlerOverrides"> {
     /**
      * Renderers of header buttons. Defaults to:
      * ```ts
@@ -15,11 +14,13 @@ interface ModelsTreeComponentProps extends Pick<ModelsTreeProps, "getSchemaConte
      *   ModelsTreeComponent.InvertButton,
      *   ModelsTreeComponent.View2DButton,
      *   ModelsTreeComponent.View3DButton,
+     *   ModelsTreeComponent.ToggleInstancesFocusButton,
      * ]
      * ```
      */
     headerButtons?: Array<(props: ModelsTreeHeaderButtonProps) => React.ReactNode>;
-    selectionStorage: SelectionStorage;
+    onPerformanceMeasured?: (featureId: string, duration: number) => void;
+    onFeatureUsed?: (feature: string) => void;
 }
 /**
  * A component that renders `ModelsTree` and a header with filtering capabilities
@@ -54,6 +55,11 @@ export declare const ModelsTreeComponent: {
      * @public
      */
     View3DButton: typeof View3DButton;
+    /**
+     * Renders a "Enable/Disable instances focus" button that enables/disables instances focusing mode.
+     * @public
+     */
+    ToggleInstancesFocusButton: typeof ToggleInstancesFocusButton;
     /**
      * Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.
      * @public

package/lib/esm/components/trees/models-tree/ModelsTreeComponent.js

@@ -7,17 +7,14 @@ import "../Tree.scss";
 import classNames from "classnames";
 import { Fragment } from "react";
 import { useActiveIModelConnection, useActiveViewport } from "@itwin/appui-react";
-import { SvgCursorClick } from "@itwin/itwinui-icons-react";
-import { IconButton } from "@itwin/itwinui-react";
-import { UnifiedSelectionProvider } from "@itwin/presentation-hierarchies-react";
 import { TreeWidget } from "../../../TreeWidget";
 import { TreeHeader } from "../../tree-header/TreeHeader";
 import { AutoSizer } from "../../utils/AutoSizer";
-import { useFocusedInstancesContext } from "../common/FocusedInstancesContext";
 import { FocusedInstancesContextProvider } from "../common/FocusedInstancesContextProvider";
 import { useFiltering } from "../common/UseFiltering";
+import { TelemetryContextProvider } from "../common/UseTelemetryContext";
 import { ModelsTree } from "./ModelsTree";
-import { HideAllButton, InvertButton, ShowAllButton, useAvailableModels, View2DButton, View3DButton } from "./ModelsTreeButtons";
+import { HideAllButton, InvertButton, ShowAllButton, ToggleInstancesFocusButton, useAvailableModels, View2DButton, View3DButton, } from "./ModelsTreeButtons";
 /**
  * A component that renders `ModelsTree` and a header with filtering capabilities
  * and header buttons.
@@ -57,6 +54,11 @@ ModelsTreeComponent.View2DButton = View2DButton;
  * @public
  */
 ModelsTreeComponent.View3DButton = View3DButton;
+/**
+ * Renders a "Enable/Disable instances focus" button that enables/disables instances focusing mode.
+ * @public
+ */
+ModelsTreeComponent.ToggleInstancesFocusButton = ToggleInstancesFocusButton;
 /**
  * Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.
  * @public
@@ -67,29 +69,19 @@ ModelsTreeComponent.id = "models-tree-v2";
  * @public
  */
 ModelsTreeComponent.getLabel = () => TreeWidget.translate("modelsTree.label");
-function ModelsTreeComponentImpl({ iModel, viewport, headerButtons, selectionStorage, ...treeProps }) {
+function ModelsTreeComponentImpl({ iModel, viewport, headerButtons, onFeatureUsed, onPerformanceMeasured, ...treeProps }) {
     const availableModels = useAvailableModels(iModel);
     const { filter, applyFilter, clearFilter } = useFiltering();
     const density = treeProps.density;
-    return (_jsx("div", { className: classNames("tw-tree-with-header", density === "enlarged" && "enlarge"), children: _jsx(UnifiedSelectionProvider, { storage: selectionStorage, children: _jsxs(FocusedInstancesContextProvider, { selectionStorage: selectionStorage, imodelKey: iModel.key, children: [_jsx(TreeHeader, { onFilterStart: applyFilter, onFilterClear: clearFilter, onSelectedChanged: () => { }, density: density, children: headerButtons
-                            ? headerButtons.map((btn, index) => (_jsx(Fragment, { children: btn({ viewport, models: availableModels, onFeatureUsed: treeProps.onFeatureUsed }) }, index)))
+    return (_jsx(TelemetryContextProvider, { componentIdentifier: ModelsTreeComponent.id, onFeatureUsed: onFeatureUsed, onPerformanceMeasured: onPerformanceMeasured, children: _jsx("div", { className: classNames("tw-tree-with-header", density === "enlarged" && "enlarge"), children: _jsxs(FocusedInstancesContextProvider, { selectionStorage: treeProps.selectionStorage, imodelKey: iModel.key, children: [_jsx(TreeHeader, { onFilterStart: applyFilter, onFilterClear: clearFilter, onSelectedChanged: () => { }, density: density, children: headerButtons
+                            ? headerButtons.map((btn, index) => _jsx(Fragment, { children: btn({ viewport, models: availableModels, onFeatureUsed }) }, index))
                             : [
-                                _jsx(ShowAllButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: treeProps.onFeatureUsed }, "show-all-btn"),
-                                _jsx(HideAllButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: treeProps.onFeatureUsed }, "hide-all-btn"),
-                                _jsx(InvertButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: treeProps.onFeatureUsed }, "invert-all-btn"),
-                                _jsx(View2DButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: treeProps.onFeatureUsed }, "view-2d-btn"),
-                                _jsx(View3DButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: treeProps.onFeatureUsed }, "view-3d-btn"),
-                                _jsx(ToggleInstancesFocusButton, { density: density, onFeatureUsed: treeProps.onFeatureUsed }, "toggle-instances-focus-btn"),
+                                _jsx(ShowAllButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: onFeatureUsed }, "show-all-btn"),
+                                _jsx(HideAllButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: onFeatureUsed }, "hide-all-btn"),
+                                _jsx(InvertButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: onFeatureUsed }, "invert-all-btn"),
+                                _jsx(View2DButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: onFeatureUsed }, "view-2d-btn"),
+                                _jsx(View3DButton, { viewport: viewport, models: availableModels, density: density, onFeatureUsed: onFeatureUsed }, "view-3d-btn"),
+                                _jsx(ToggleInstancesFocusButton, { density: density, onFeatureUsed: onFeatureUsed }, "toggle-instances-focus-btn"),
                             ] }), _jsx("div", { className: "tw-tree-content", children: _jsx(AutoSizer, { children: ({ width, height }) => _jsx(ModelsTree, { ...treeProps, imodel: iModel, activeView: viewport, width: width, height: height, filter: filter }) }) })] }) }) }));
 }
-function ToggleInstancesFocusButton({ density, onFeatureUsed }) {
-    const { enabled, toggle } = useFocusedInstancesContext();
-    const title = enabled
-        ? TreeWidget.translate("modelsTree.buttons.toggleFocusMode.disable.tooltip")
-        : TreeWidget.translate("modelsTree.buttons.toggleFocusMode.enable.tooltip");
-    return (_jsx(IconButton, { styleType: "borderless", size: density === "enlarged" ? "large" : "small", title: title, onClick: () => {
-            onFeatureUsed?.("models-tree-instancesfocus");
-            toggle();
-        }, isActive: enabled, children: _jsx(SvgCursorClick, {}) }));
-}
 //# sourceMappingURL=ModelsTreeComponent.js.map

package/lib/esm/components/trees/models-tree/ModelsTreeComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModelsTreeComponent.js","sourceRoot":"","sources":["../../../../../src/components/trees/models-tree/ModelsTreeComponent.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.scss\";\nimport classNames from \"classnames\";\nimport { Fragment } from \"react\";\nimport { useActiveIModelConnection, useActiveViewport } from \"@itwin/appui-react\";\nimport { SvgCursorClick } from \"@itwin/itwinui-icons-react\";\nimport { IconButton } from \"@itwin/itwinui-react\";\nimport { UnifiedSelectionProvider } from \"@itwin/presentation-hierarchies-react\";\nimport { TreeWidget } from \"../../../TreeWidget\";\nimport { TreeHeader } from \"../../tree-header/TreeHeader\";\nimport { AutoSizer } from \"../../utils/AutoSizer\";\nimport { useFocusedInstancesContext } from \"../common/FocusedInstancesContext\";\nimport { FocusedInstancesContextProvider } from \"../common/FocusedInstancesContextProvider\";\nimport { useFiltering } from \"../common/UseFiltering\";\nimport { ModelsTree } from \"./ModelsTree\";\nimport { HideAllButton, InvertButton, ShowAllButton, useAvailableModels, View2DButton, View3DButton } from \"./ModelsTreeButtons\";\n\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { IModelConnection, ScreenViewport } from \"@itwin/core-frontend\";\nimport type { SelectionStorage } from \"@itwin/presentation-hierarchies-react\";\nimport type { ModelsTreeHeaderButtonProps } from \"./ModelsTreeButtons\";\n\ntype ModelsTreeProps = ComponentPropsWithoutRef<typeof ModelsTree>;\n\ninterface ModelsTreeComponentProps\n  extends Pick<\n    ModelsTreeProps,\n    \"getSchemaContext\" | \"density\" | \"hierarchyLevelConfig\" | \"selectionMode\" | \"onPerformanceMeasured\" | \"onFeatureUsed\" | \"hierarchyConfig\"\n  > {\n  /**\n   * Renderers of header buttons. Defaults to:\n   * ```ts\n   * [\n   *   ModelsTreeComponent.ShowAllButton,\n   *   ModelsTreeComponent.HideAllButton,\n   *   ModelsTreeComponent.InvertButton,\n   *   ModelsTreeComponent.View2DButton,\n   *   ModelsTreeComponent.View3DButton,\n   * ]\n   * ```\n   */\n  headerButtons?: Array<(props: ModelsTreeHeaderButtonProps) => React.ReactNode>;\n  selectionStorage: SelectionStorage;\n}\n\n/**\n * A component that renders `ModelsTree` and a header with filtering capabilities\n * and header buttons.\n *\n * @public\n */\nexport const ModelsTreeComponent = (props: ModelsTreeComponentProps) => {\n  const iModel = useActiveIModelConnection();\n  const viewport = useActiveViewport();\n\n  if (!iModel || !viewport) {\n    return null;\n  }\n\n  return <ModelsTreeComponentImpl {...props} iModel={iModel} viewport={viewport} />;\n};\n\n/**\n * Renders a \"Show all\" button that enables display of all models.\n * @public\n */\nModelsTreeComponent.ShowAllButton = ShowAllButton;\n\n/**\n * Renders a \"Hide all\" button that disables display of all models.\n * @public\n */\nModelsTreeComponent.HideAllButton = HideAllButton;\n\n/**\n * Renders an \"Invert all\" button that inverts display of all models.\n * @public\n */\nModelsTreeComponent.InvertButton = InvertButton;\n\n/**\n * Renders a \"View 2D\" button that enables display of all plan projection models and disables all others.\n * @public\n */\nModelsTreeComponent.View2DButton = View2DButton;\n\n/**\n * Renders a \"View 3D\" button that enables display of all non-plan projection models and disables all plan projection ones.\n * @public\n */\nModelsTreeComponent.View3DButton = View3DButton;\n\n/**\n * Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nModelsTreeComponent.id = \"models-tree-v2\";\n\n/**\n * Label of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nModelsTreeComponent.getLabel = () => TreeWidget.translate(\"modelsTree.label\");\n\nfunction ModelsTreeComponentImpl({\n  iModel,\n  viewport,\n  headerButtons,\n  selectionStorage,\n  ...treeProps\n}: ModelsTreeComponentProps & { iModel: IModelConnection; viewport: ScreenViewport }) {\n  const availableModels = useAvailableModels(iModel);\n  const { filter, applyFilter, clearFilter } = useFiltering();\n  const density = treeProps.density;\n  return (\n    <div className={classNames(\"tw-tree-with-header\", density === \"enlarged\" && \"enlarge\")}>\n      <UnifiedSelectionProvider storage={selectionStorage}>\n        <FocusedInstancesContextProvider selectionStorage={selectionStorage} imodelKey={iModel.key}>\n          <TreeHeader onFilterStart={applyFilter} onFilterClear={clearFilter} onSelectedChanged={() => {}} density={density}>\n            {headerButtons\n              ? headerButtons.map((btn, index) => (\n                  <Fragment key={index}>{btn({ viewport, models: availableModels, onFeatureUsed: treeProps.onFeatureUsed })}</Fragment>\n                ))\n              : [\n                  <ShowAllButton viewport={viewport} models={availableModels} key=\"show-all-btn\" density={density} onFeatureUsed={treeProps.onFeatureUsed} />,\n                  <HideAllButton viewport={viewport} models={availableModels} key=\"hide-all-btn\" density={density} onFeatureUsed={treeProps.onFeatureUsed} />,\n                  <InvertButton viewport={viewport} models={availableModels} key=\"invert-all-btn\" density={density} onFeatureUsed={treeProps.onFeatureUsed} />,\n                  <View2DButton viewport={viewport} models={availableModels} key=\"view-2d-btn\" density={density} onFeatureUsed={treeProps.onFeatureUsed} />,\n                  <View3DButton viewport={viewport} models={availableModels} key=\"view-3d-btn\" density={density} onFeatureUsed={treeProps.onFeatureUsed} />,\n                  <ToggleInstancesFocusButton key=\"toggle-instances-focus-btn\" density={density} onFeatureUsed={treeProps.onFeatureUsed} />,\n                ]}\n          </TreeHeader>\n          <div className=\"tw-tree-content\">\n            <AutoSizer>\n              {({ width, height }) => <ModelsTree {...treeProps} imodel={iModel} activeView={viewport} width={width} height={height} filter={filter} />}\n            </AutoSizer>\n          </div>\n        </FocusedInstancesContextProvider>\n      </UnifiedSelectionProvider>\n    </div>\n  );\n}\n\nfunction ToggleInstancesFocusButton({ density, onFeatureUsed }: { density?: \"default\" | \"enlarged\"; onFeatureUsed?: (feature: string) => void }) {\n  const { enabled, toggle } = useFocusedInstancesContext();\n  const title = enabled\n    ? TreeWidget.translate(\"modelsTree.buttons.toggleFocusMode.disable.tooltip\")\n    : TreeWidget.translate(\"modelsTree.buttons.toggleFocusMode.enable.tooltip\");\n  return (\n    <IconButton\n      styleType=\"borderless\"\n      size={density === \"enlarged\" ? \"large\" : \"small\"}\n      title={title}\n      onClick={() => {\n        onFeatureUsed?.(\"models-tree-instancesfocus\");\n        toggle();\n      }}\n      isActive={enabled}\n    >\n      <SvgCursorClick />\n    </IconButton>\n  );\n}\n"]}
+{"version":3,"file":"ModelsTreeComponent.js","sourceRoot":"","sources":["../../../../../src/components/trees/models-tree/ModelsTreeComponent.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.scss\";\nimport classNames from \"classnames\";\nimport { Fragment } from \"react\";\nimport { useActiveIModelConnection, useActiveViewport } from \"@itwin/appui-react\";\nimport { TreeWidget } from \"../../../TreeWidget\";\nimport { TreeHeader } from \"../../tree-header/TreeHeader\";\nimport { AutoSizer } from \"../../utils/AutoSizer\";\nimport { FocusedInstancesContextProvider } from \"../common/FocusedInstancesContextProvider\";\nimport { useFiltering } from \"../common/UseFiltering\";\nimport { TelemetryContextProvider } from \"../common/UseTelemetryContext\";\nimport { ModelsTree } from \"./ModelsTree\";\nimport {\n  HideAllButton, InvertButton, ShowAllButton, ToggleInstancesFocusButton, useAvailableModels, View2DButton, View3DButton,\n} from \"./ModelsTreeButtons\";\n\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { IModelConnection, ScreenViewport } from \"@itwin/core-frontend\";\nimport type { ModelsTreeHeaderButtonProps } from \"./ModelsTreeButtons\";\n\n/** @public */\ninterface ModelsTreeComponentProps\n  extends Pick<\n    ComponentPropsWithoutRef<typeof ModelsTree>,\n    \"getSchemaContext\" | \"selectionStorage\" | \"density\" | \"hierarchyLevelConfig\" | \"selectionMode\" | \"hierarchyConfig\" | \"visibilityHandlerOverrides\"\n  > {\n  /**\n   * Renderers of header buttons. Defaults to:\n   * ```ts\n   * [\n   *   ModelsTreeComponent.ShowAllButton,\n   *   ModelsTreeComponent.HideAllButton,\n   *   ModelsTreeComponent.InvertButton,\n   *   ModelsTreeComponent.View2DButton,\n   *   ModelsTreeComponent.View3DButton,\n   *   ModelsTreeComponent.ToggleInstancesFocusButton,\n   * ]\n   * ```\n   */\n  headerButtons?: Array<(props: ModelsTreeHeaderButtonProps) => React.ReactNode>;\n  onPerformanceMeasured?: (featureId: string, duration: number) => void;\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/**\n * A component that renders `ModelsTree` and a header with filtering capabilities\n * and header buttons.\n *\n * @public\n */\nexport const ModelsTreeComponent = (props: ModelsTreeComponentProps) => {\n  const iModel = useActiveIModelConnection();\n  const viewport = useActiveViewport();\n\n  if (!iModel || !viewport) {\n    return null;\n  }\n\n  return <ModelsTreeComponentImpl {...props} iModel={iModel} viewport={viewport} />;\n};\n\n/**\n * Renders a \"Show all\" button that enables display of all models.\n * @public\n */\nModelsTreeComponent.ShowAllButton = ShowAllButton;\n\n/**\n * Renders a \"Hide all\" button that disables display of all models.\n * @public\n */\nModelsTreeComponent.HideAllButton = HideAllButton;\n\n/**\n * Renders an \"Invert all\" button that inverts display of all models.\n * @public\n */\nModelsTreeComponent.InvertButton = InvertButton;\n\n/**\n * Renders a \"View 2D\" button that enables display of all plan projection models and disables all others.\n * @public\n */\nModelsTreeComponent.View2DButton = View2DButton;\n\n/**\n * Renders a \"View 3D\" button that enables display of all non-plan projection models and disables all plan projection ones.\n * @public\n */\nModelsTreeComponent.View3DButton = View3DButton;\n\n/**\n * Renders a \"Enable/Disable instances focus\" button that enables/disables instances focusing mode.\n * @public\n */\nModelsTreeComponent.ToggleInstancesFocusButton = ToggleInstancesFocusButton;\n\n/**\n * Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nModelsTreeComponent.id = \"models-tree-v2\";\n\n/**\n * Label of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nModelsTreeComponent.getLabel = () => TreeWidget.translate(\"modelsTree.label\");\n\nfunction ModelsTreeComponentImpl({\n  iModel,\n  viewport,\n  headerButtons,\n  onFeatureUsed,\n  onPerformanceMeasured,\n  ...treeProps\n}: ModelsTreeComponentProps & { iModel: IModelConnection; viewport: ScreenViewport }) {\n  const availableModels = useAvailableModels(iModel);\n  const { filter, applyFilter, clearFilter } = useFiltering();\n  const density = treeProps.density;\n  return (\n    <TelemetryContextProvider componentIdentifier={ModelsTreeComponent.id} onFeatureUsed={onFeatureUsed} onPerformanceMeasured={onPerformanceMeasured}>\n      <div className={classNames(\"tw-tree-with-header\", density === \"enlarged\" && \"enlarge\")}>\n        <FocusedInstancesContextProvider selectionStorage={treeProps.selectionStorage} imodelKey={iModel.key}>\n          <TreeHeader onFilterStart={applyFilter} onFilterClear={clearFilter} onSelectedChanged={() => {}} density={density}>\n            {headerButtons\n              ? headerButtons.map((btn, index) => <Fragment key={index}>{btn({ viewport, models: availableModels, onFeatureUsed })}</Fragment>)\n              : [\n                  <ShowAllButton viewport={viewport} models={availableModels} key=\"show-all-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n                  <HideAllButton viewport={viewport} models={availableModels} key=\"hide-all-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n                  <InvertButton viewport={viewport} models={availableModels} key=\"invert-all-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n                  <View2DButton viewport={viewport} models={availableModels} key=\"view-2d-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n                  <View3DButton viewport={viewport} models={availableModels} key=\"view-3d-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n                  <ToggleInstancesFocusButton key=\"toggle-instances-focus-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n                ]}\n          </TreeHeader>\n          <div className=\"tw-tree-content\">\n            <AutoSizer>\n              {({ width, height }) => <ModelsTree {...treeProps} imodel={iModel} activeView={viewport} width={width} height={height} filter={filter} />}\n            </AutoSizer>\n          </div>\n        </FocusedInstancesContextProvider>\n      </div>\n    </TelemetryContextProvider>\n  );\n}\n"]}

package/lib/esm/components/trees/models-tree/ModelsTreeDefinition.d.ts

@@ -2,7 +2,11 @@ import type { Id64String } from "@itwin/core-bentley";
 import type { DefineHierarchyLevelProps, HierarchyDefinition, HierarchyLevelDefinition, HierarchyNodeIdentifiersPath, LimitingECSqlQueryExecutor, ProcessedHierarchyNode } from "@itwin/presentation-hierarchies";
 import type { ECClassHierarchyInspector, ECSchemaProvider, InstanceKey } from "@itwin/presentation-shared";
 import type { ModelsTreeIdsCache } from "./internal/ModelsTreeIdsCache";
-interface HierarchyConfiguration {
+/**
+ * Defines hierarchy configuration supported by `ModelsTree`.
+ * @beta
+ */
+export interface ModelsTreeHierarchyConfiguration {
     /** Should element nodes be grouped by class. Defaults to `enable`. */
     elementClassGrouping: "enable" | "enableWithCounts" | "disable";
     /** Full class name of a `GeometricElement3d` sub-class that should be used to load element nodes. Defaults to `BisCore.GeometricElement3d` */
@@ -10,11 +14,11 @@ interface HierarchyConfiguration {
     /** Should models without elements be shown. Defaults to `false` */
     showEmptyModels: boolean;
 }
-export declare const defaultHierarchyConfiguration: HierarchyConfiguration;
+export declare const defaultHierarchyConfiguration: ModelsTreeHierarchyConfiguration;
 interface ModelsTreeDefinitionProps {
     imodelAccess: ECSchemaProvider & ECClassHierarchyInspector & LimitingECSqlQueryExecutor;
     idsCache: ModelsTreeIdsCache;
-    hierarchyConfig: HierarchyConfiguration;
+    hierarchyConfig: ModelsTreeHierarchyConfiguration;
 }
 export interface ElementsGroupInfo {
     parent: {
@@ -31,13 +35,13 @@ interface ModelsTreeInstanceKeyPathsFromInstanceKeysProps {
     imodelAccess: ECClassHierarchyInspector & LimitingECSqlQueryExecutor;
     idsCache: ModelsTreeIdsCache;
     keys: Array<InstanceKey | ElementsGroupInfo>;
-    hierarchyConfig: HierarchyConfiguration;
+    hierarchyConfig: ModelsTreeHierarchyConfiguration;
 }
 interface ModelsTreeInstanceKeyPathsFromInstanceLabelProps {
     imodelAccess: ECClassHierarchyInspector & LimitingECSqlQueryExecutor;
     idsCache: ModelsTreeIdsCache;
     label: string;
-    hierarchyConfig: HierarchyConfiguration;
+    hierarchyConfig: ModelsTreeHierarchyConfiguration;
 }
 export type ModelsTreeInstanceKeyPathsProps = ModelsTreeInstanceKeyPathsFromInstanceKeysProps | ModelsTreeInstanceKeyPathsFromInstanceLabelProps;
 export declare namespace ModelsTreeInstanceKeyPathsProps {