@itwin/tree-widget-react 3.2.3 → 3.3.0

package/lib/esm/components/tree-header/TreeHeader.js

@@ -8,15 +8,14 @@ import classnames from "classnames";
 import { Children, useEffect, useRef, useState } from "react";
 import { SvgCaretDownSmall, SvgCaretUpSmall, SvgMore } from "@itwin/itwinui-icons-react";
 import { ButtonGroup, Divider, DropdownMenu, IconButton, SearchBox } from "@itwin/itwinui-react";
-import { TreeWidget } from "../../TreeWidget";
-import { useFocusedInstancesContext } from "../trees/common/FocusedInstancesContext";
+import { TreeWidget } from "../../TreeWidget.js";
+import { useFocusedInstancesContext } from "../trees/common/FocusedInstancesContext.js";
 export function TreeHeader(props) {
     const { filteringProps, density, className, children } = props;
     const [isSearchOpen, setIsSearchOpen] = useState(false);
     const { enabled: instanceFocusEnabled } = useFocusedInstancesContext();
     const size = density === "enlarged" ? "large" : "small";
     useEffect(() => {
-        // istanbul ignore if
         if (filteringProps?.isDisabled) {
             setIsSearchOpen(false);
         }

package/lib/esm/components/tree-header/TreeHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeHeader.js","sourceRoot":"","sources":["../../../../src/components/tree-header/TreeHeader.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 \"./TreeHeader.scss\";\nimport classnames from \"classnames\";\nimport { Children, useEffect, useRef, useState } from \"react\";\nimport { SvgCaretDownSmall, SvgCaretUpSmall, SvgMore } from \"@itwin/itwinui-icons-react\";\nimport { ButtonGroup, Divider, DropdownMenu, IconButton, SearchBox } from \"@itwin/itwinui-react\";\nimport { TreeWidget } from \"../../TreeWidget\";\nimport { useFocusedInstancesContext } from \"../trees/common/FocusedInstancesContext\";\n\nimport type { PropsWithChildren } from \"react\";\nimport type { Viewport } from \"@itwin/core-frontend\";\n\n/** @public */\nexport interface TreeHeaderButtonProps {\n  viewport: Viewport;\n  density?: \"default\" | \"enlarged\";\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/** @beta */\nexport interface TreeFilteringProps {\n  /** Filtering is cleared after everything's loaded */\n  onFilterStart: (newFilter: string) => void;\n  /** listens for onClick event for Clear (x) icon */\n  onFilterClear: () => void;\n  /** Total number of results/entries */\n  resultCount?: number;\n  /** Current selected result index */\n  selectedIndex?: number;\n  /** Callback to currently selected result/entry change */\n  onSelectedChanged?: (index: number) => void;\n  /** Should the search box be disabled */\n  isDisabled?: boolean;\n}\n\ninterface TreeHeaderProps {\n  filteringProps?: TreeFilteringProps;\n  /** Modifies the density of tree header. `enlarged` header contains larger content */\n  density?: \"default\" | \"enlarged\";\n  className?: string;\n}\n\nexport function TreeHeader(props: PropsWithChildren<TreeHeaderProps>) {\n  const { filteringProps, density, className, children } = props;\n  const [isSearchOpen, setIsSearchOpen] = useState<boolean>(false);\n  const { enabled: instanceFocusEnabled } = useFocusedInstancesContext();\n  const size = density === \"enlarged\" ? \"large\" : \"small\";\n\n  useEffect(() => {\n    // istanbul ignore if\n    if (filteringProps?.isDisabled) {\n      setIsSearchOpen(false);\n    }\n  }, [filteringProps?.isDisabled]);\n\n  return (\n    <div className={classnames(\"tree-widget-tree-header\", className)}>\n      <HeaderButtons contracted={isSearchOpen} size={size}>\n        {children}\n      </HeaderButtons>\n      {filteringProps ? (\n        <DebouncedSearchBox\n          isOpened={isSearchOpen}\n          onOpen={() => setIsSearchOpen(true)}\n          onClose={() => setIsSearchOpen(false)}\n          onChange={(value) => (value ? filteringProps.onFilterStart(value) : filteringProps.onFilterClear())}\n          delay={500}\n          selectedResultIndex={filteringProps.selectedIndex}\n          resultCount={filteringProps.resultCount}\n          onSelectedResultChanged={(index) => filteringProps.onSelectedChanged?.(index)}\n          size={size}\n          isDisabled={instanceFocusEnabled || props.filteringProps?.isDisabled}\n        />\n      ) : null}\n    </div>\n  );\n}\n\ninterface DebouncedSearchBoxProps {\n  isOpened: boolean;\n  onOpen: () => void;\n  onClose: () => void;\n  onChange: (value: string) => void;\n  delay: number;\n  selectedResultIndex?: number;\n  resultCount?: number;\n  onSelectedResultChanged: (index: number) => void;\n  size: \"large\" | \"small\";\n  isDisabled?: boolean;\n}\n\nfunction DebouncedSearchBox({\n  isOpened,\n  selectedResultIndex,\n  resultCount,\n  onSelectedResultChanged,\n  onChange,\n  onOpen,\n  onClose,\n  delay,\n  size,\n  isDisabled,\n}: DebouncedSearchBoxProps) {\n  const [inputValue, setInputValue] = useState<string>(\"\");\n  const onChangeRef = useRef(onChange);\n  // save latest `onChange` reference into `useRef` to avoid restarting timeout when `onChange` reference changes.\n  onChangeRef.current = onChange;\n\n  useEffect(() => {\n    if (!inputValue) {\n      onChangeRef.current(\"\");\n      return;\n    }\n\n    const timeoutId = setTimeout(() => {\n      onChangeRef.current(inputValue);\n    }, delay);\n\n    return () => {\n      clearTimeout(timeoutId);\n    };\n  }, [inputValue, delay]);\n\n  return (\n    <SearchBox\n      expandable\n      isExpanded={isOpened}\n      onExpand={onOpen}\n      onCollapse={onClose}\n      size={size}\n      className={classnames(\"tree-widget-search-box\", !isOpened && \"contracted\")}\n      isDisabled={isDisabled}\n    >\n      <SearchBox.CollapsedState>\n        <SearchBox.ExpandButton\n          title={TreeWidget.translate(\"header.searchBox.searchForSomething\")}\n          aria-label={TreeWidget.translate(\"header.searchBox.open\")}\n          size={size}\n          styleType=\"borderless\"\n        />\n      </SearchBox.CollapsedState>\n      <SearchBox.ExpandedState>\n        <SearchBox.Input placeholder={TreeWidget.translate(\"header.searchBox.search\")} onChange={(e) => setInputValue(e.currentTarget.value)} />\n        <SearchResultStepper selectedIndex={selectedResultIndex} total={resultCount} onStep={onSelectedResultChanged} size={size} />\n        <SearchBox.CollapseButton\n          onClick={() => {\n            setInputValue(\"\");\n            onClose();\n          }}\n          size={size}\n          aria-label={TreeWidget.translate(\"header.searchBox.close\")}\n        />\n      </SearchBox.ExpandedState>\n    </SearchBox>\n  );\n}\n\ninterface HeaderButtonsProps {\n  contracted: boolean;\n  size: \"large\" | \"small\";\n}\n\nfunction HeaderButtons(props: PropsWithChildren<HeaderButtonsProps>) {\n  const className = classnames(\"button-container\", props.contracted && \"contracted\");\n\n  return (\n    <ButtonGroup\n      className={className}\n      overflowButton={(overflowStart) => (\n        <DropdownMenu\n          menuItems={() =>\n            Children.toArray(props.children)\n              .slice(overflowStart)\n              .map((btn, index) => (\n                <li key={index} className=\"dropdown-item\" role=\"menuitem\">\n                  {btn}\n                </li>\n              ))\n          }\n          className=\"tree-header-button-dropdown-container\"\n        >\n          <IconButton label={TreeWidget.translate(\"header.dropdownMore\")} styleType=\"borderless\" size={props.size}>\n            <SvgMore />\n          </IconButton>\n        </DropdownMenu>\n      )}\n    >\n      {props.children}\n    </ButtonGroup>\n  );\n}\n\ninterface SearchResultStepperProps {\n  total?: number;\n  onStep: (newIndex: number) => void;\n  selectedIndex?: number;\n  size: \"large\" | \"small\";\n}\n\nfunction SearchResultStepper(props: SearchResultStepperProps) {\n  const { selectedIndex = 1, total, onStep } = props;\n  if (!total) {\n    return null;\n  }\n\n  return (\n    <>\n      <span className=\"searchbox-stepping-count\">{`${selectedIndex}/${total}`}</span>\n      <Divider orientation=\"vertical\" />\n      <SearchBox.Button\n        title={TreeWidget.translate(\"header.searchBox.previous\")}\n        size={props.size}\n        onClick={() => {\n          if (selectedIndex > 1) {\n            onStep(selectedIndex - 1);\n          }\n        }}\n      >\n        <SvgCaretUpSmall />\n      </SearchBox.Button>\n      <SearchBox.Button\n        title={TreeWidget.translate(\"header.searchBox.next\")}\n        size={props.size}\n        onClick={() => {\n          if (selectedIndex < total) {\n            onStep(selectedIndex + 1);\n          }\n        }}\n      >\n        <SvgCaretDownSmall />\n      </SearchBox.Button>\n    </>\n  );\n}\n"]}
+{"version":3,"file":"TreeHeader.js","sourceRoot":"","sources":["../../../../src/components/tree-header/TreeHeader.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 \"./TreeHeader.scss\";\nimport classnames from \"classnames\";\nimport { Children, useEffect, useRef, useState } from \"react\";\nimport { SvgCaretDownSmall, SvgCaretUpSmall, SvgMore } from \"@itwin/itwinui-icons-react\";\nimport { ButtonGroup, Divider, DropdownMenu, IconButton, SearchBox } from \"@itwin/itwinui-react\";\nimport { TreeWidget } from \"../../TreeWidget.js\";\nimport { useFocusedInstancesContext } from \"../trees/common/FocusedInstancesContext.js\";\n\nimport type { PropsWithChildren } from \"react\";\nimport type { Viewport } from \"@itwin/core-frontend\";\n\n/** @public */\nexport interface TreeHeaderButtonProps {\n  viewport: Viewport;\n  density?: \"default\" | \"enlarged\";\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/** @beta */\nexport interface TreeFilteringProps {\n  /** Filtering is cleared after everything's loaded */\n  onFilterStart: (newFilter: string) => void;\n  /** listens for onClick event for Clear (x) icon */\n  onFilterClear: () => void;\n  /** Total number of results/entries */\n  resultCount?: number;\n  /** Current selected result index */\n  selectedIndex?: number;\n  /** Callback to currently selected result/entry change */\n  onSelectedChanged?: (index: number) => void;\n  /** Should the search box be disabled */\n  isDisabled?: boolean;\n}\n\ninterface TreeHeaderProps {\n  filteringProps?: TreeFilteringProps;\n  /** Modifies the density of tree header. `enlarged` header contains larger content */\n  density?: \"default\" | \"enlarged\";\n  className?: string;\n}\n\nexport function TreeHeader(props: PropsWithChildren<TreeHeaderProps>) {\n  const { filteringProps, density, className, children } = props;\n  const [isSearchOpen, setIsSearchOpen] = useState<boolean>(false);\n  const { enabled: instanceFocusEnabled } = useFocusedInstancesContext();\n  const size = density === \"enlarged\" ? \"large\" : \"small\";\n\n  useEffect(() => {\n    if (filteringProps?.isDisabled) {\n      setIsSearchOpen(false);\n    }\n  }, [filteringProps?.isDisabled]);\n\n  return (\n    <div className={classnames(\"tree-widget-tree-header\", className)}>\n      <HeaderButtons contracted={isSearchOpen} size={size}>\n        {children}\n      </HeaderButtons>\n      {filteringProps ? (\n        <DebouncedSearchBox\n          isOpened={isSearchOpen}\n          onOpen={() => setIsSearchOpen(true)}\n          onClose={() => setIsSearchOpen(false)}\n          onChange={(value) => (value ? filteringProps.onFilterStart(value) : filteringProps.onFilterClear())}\n          delay={500}\n          selectedResultIndex={filteringProps.selectedIndex}\n          resultCount={filteringProps.resultCount}\n          onSelectedResultChanged={(index) => filteringProps.onSelectedChanged?.(index)}\n          size={size}\n          isDisabled={instanceFocusEnabled || props.filteringProps?.isDisabled}\n        />\n      ) : null}\n    </div>\n  );\n}\n\ninterface DebouncedSearchBoxProps {\n  isOpened: boolean;\n  onOpen: () => void;\n  onClose: () => void;\n  onChange: (value: string) => void;\n  delay: number;\n  selectedResultIndex?: number;\n  resultCount?: number;\n  onSelectedResultChanged: (index: number) => void;\n  size: \"large\" | \"small\";\n  isDisabled?: boolean;\n}\n\nfunction DebouncedSearchBox({\n  isOpened,\n  selectedResultIndex,\n  resultCount,\n  onSelectedResultChanged,\n  onChange,\n  onOpen,\n  onClose,\n  delay,\n  size,\n  isDisabled,\n}: DebouncedSearchBoxProps) {\n  const [inputValue, setInputValue] = useState<string>(\"\");\n  const onChangeRef = useRef(onChange);\n  // save latest `onChange` reference into `useRef` to avoid restarting timeout when `onChange` reference changes.\n  onChangeRef.current = onChange;\n\n  useEffect(() => {\n    if (!inputValue) {\n      onChangeRef.current(\"\");\n      return;\n    }\n\n    const timeoutId = setTimeout(() => {\n      onChangeRef.current(inputValue);\n    }, delay);\n\n    return () => {\n      clearTimeout(timeoutId);\n    };\n  }, [inputValue, delay]);\n\n  return (\n    <SearchBox\n      expandable\n      isExpanded={isOpened}\n      onExpand={onOpen}\n      onCollapse={onClose}\n      size={size}\n      className={classnames(\"tree-widget-search-box\", !isOpened && \"contracted\")}\n      isDisabled={isDisabled}\n    >\n      <SearchBox.CollapsedState>\n        <SearchBox.ExpandButton\n          title={TreeWidget.translate(\"header.searchBox.searchForSomething\")}\n          aria-label={TreeWidget.translate(\"header.searchBox.open\")}\n          size={size}\n          styleType=\"borderless\"\n        />\n      </SearchBox.CollapsedState>\n      <SearchBox.ExpandedState>\n        <SearchBox.Input placeholder={TreeWidget.translate(\"header.searchBox.search\")} onChange={(e) => setInputValue(e.currentTarget.value)} />\n        <SearchResultStepper selectedIndex={selectedResultIndex} total={resultCount} onStep={onSelectedResultChanged} size={size} />\n        <SearchBox.CollapseButton\n          onClick={() => {\n            setInputValue(\"\");\n            onClose();\n          }}\n          size={size}\n          aria-label={TreeWidget.translate(\"header.searchBox.close\")}\n        />\n      </SearchBox.ExpandedState>\n    </SearchBox>\n  );\n}\n\ninterface HeaderButtonsProps {\n  contracted: boolean;\n  size: \"large\" | \"small\";\n}\n\nfunction HeaderButtons(props: PropsWithChildren<HeaderButtonsProps>) {\n  const className = classnames(\"button-container\", props.contracted && \"contracted\");\n\n  return (\n    <ButtonGroup\n      className={className}\n      overflowButton={(overflowStart) => (\n        <DropdownMenu\n          menuItems={() =>\n            Children.toArray(props.children)\n              .slice(overflowStart)\n              .map((btn, index) => (\n                <li key={index} className=\"dropdown-item\" role=\"menuitem\">\n                  {btn}\n                </li>\n              ))\n          }\n          className=\"tree-header-button-dropdown-container\"\n        >\n          <IconButton label={TreeWidget.translate(\"header.dropdownMore\")} styleType=\"borderless\" size={props.size}>\n            <SvgMore />\n          </IconButton>\n        </DropdownMenu>\n      )}\n    >\n      {props.children}\n    </ButtonGroup>\n  );\n}\n\ninterface SearchResultStepperProps {\n  total?: number;\n  onStep: (newIndex: number) => void;\n  selectedIndex?: number;\n  size: \"large\" | \"small\";\n}\n\nfunction SearchResultStepper(props: SearchResultStepperProps) {\n  const { selectedIndex = 1, total, onStep } = props;\n  if (!total) {\n    return null;\n  }\n\n  return (\n    <>\n      <span className=\"searchbox-stepping-count\">{`${selectedIndex}/${total}`}</span>\n      <Divider orientation=\"vertical\" />\n      <SearchBox.Button\n        title={TreeWidget.translate(\"header.searchBox.previous\")}\n        size={props.size}\n        onClick={() => {\n          if (selectedIndex > 1) {\n            onStep(selectedIndex - 1);\n          }\n        }}\n      >\n        <SvgCaretUpSmall />\n      </SearchBox.Button>\n      <SearchBox.Button\n        title={TreeWidget.translate(\"header.searchBox.next\")}\n        size={props.size}\n        onClick={() => {\n          if (selectedIndex < total) {\n            onStep(selectedIndex + 1);\n          }\n        }}\n      >\n        <SvgCaretDownSmall />\n      </SearchBox.Button>\n    </>\n  );\n}\n"]}

package/lib/esm/components/tree-header/TreeWithHeader.d.ts

@@ -1,6 +1,6 @@
 import "./TreeWithHeader.scss";
 import type { PropsWithChildren, ReactNode } from "react";
-import type { TreeFilteringProps } from "./TreeHeader";
+import type { TreeFilteringProps } from "./TreeHeader.js";
 /** @beta */
 interface TreeWithHeaderProps {
     density?: "enlarged" | "default";

package/lib/esm/components/tree-header/TreeWithHeader.js

@@ -5,7 +5,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  *--------------------------------------------------------------------------------------------*/
 import "./TreeWithHeader.scss";
 import classNames from "classnames";
-import { TreeHeader } from "./TreeHeader";
+import { TreeHeader } from "./TreeHeader.js";
 /** @beta */
 export function TreeWithHeader({ filteringProps, buttons, density, children }) {
     return (_jsxs("div", { className: classNames("tw-tree-with-header", density === "enlarged" && "enlarge"), children: [_jsx(TreeHeader, { filteringProps: filteringProps, density: density, children: buttons }), _jsx("div", { className: "tw-tree-content", children: children })] }));

package/lib/esm/components/tree-header/TreeWithHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeWithHeader.js","sourceRoot":"","sources":["../../../../src/components/tree-header/TreeWithHeader.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,uBAAuB,CAAC;AAC/B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAY1C,YAAY;AACZ,MAAM,UAAU,cAAc,CAAC,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAA0C;IACnH,OAAO,CACL,eAAK,SAAS,EAAE,UAAU,CAAC,qBAAqB,EAAE,OAAO,KAAK,UAAU,IAAI,SAAS,CAAC,aACpF,KAAC,UAAU,IAAC,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO,YACzD,OAAO,GACG,EACb,cAAK,SAAS,EAAC,iBAAiB,YAAE,QAAQ,GAAO,IAC7C,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 \"./TreeWithHeader.scss\";\nimport classNames from \"classnames\";\nimport { TreeHeader } from \"./TreeHeader\";\n\nimport type { PropsWithChildren, ReactNode } from \"react\";\nimport type { TreeFilteringProps } from \"./TreeHeader\";\n\n/** @beta */\ninterface TreeWithHeaderProps {\n  density?: \"enlarged\" | \"default\";\n  filteringProps?: TreeFilteringProps;\n  buttons?: ReactNode;\n}\n\n/** @beta */\nexport function TreeWithHeader({ filteringProps, buttons, density, children }: PropsWithChildren<TreeWithHeaderProps>) {\n  return (\n    <div className={classNames(\"tw-tree-with-header\", density === \"enlarged\" && \"enlarge\")}>\n      <TreeHeader filteringProps={filteringProps} density={density}>\n        {buttons}\n      </TreeHeader>\n      <div className=\"tw-tree-content\">{children}</div>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"TreeWithHeader.js","sourceRoot":"","sources":["../../../../src/components/tree-header/TreeWithHeader.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,uBAAuB,CAAC;AAC/B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAY7C,YAAY;AACZ,MAAM,UAAU,cAAc,CAAC,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAA0C;IACnH,OAAO,CACL,eAAK,SAAS,EAAE,UAAU,CAAC,qBAAqB,EAAE,OAAO,KAAK,UAAU,IAAI,SAAS,CAAC,aACpF,KAAC,UAAU,IAAC,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO,YACzD,OAAO,GACG,EACb,cAAK,SAAS,EAAC,iBAAiB,YAAE,QAAQ,GAAO,IAC7C,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 \"./TreeWithHeader.scss\";\nimport classNames from \"classnames\";\nimport { TreeHeader } from \"./TreeHeader.js\";\n\nimport type { PropsWithChildren, ReactNode } from \"react\";\nimport type { TreeFilteringProps } from \"./TreeHeader.js\";\n\n/** @beta */\ninterface TreeWithHeaderProps {\n  density?: \"enlarged\" | \"default\";\n  filteringProps?: TreeFilteringProps;\n  buttons?: ReactNode;\n}\n\n/** @beta */\nexport function TreeWithHeader({ filteringProps, buttons, density, children }: PropsWithChildren<TreeWithHeaderProps>) {\n  return (\n    <div className={classNames(\"tw-tree-with-header\", density === \"enlarged\" && \"enlarge\")}>\n      <TreeHeader filteringProps={filteringProps} density={density}>\n        {buttons}\n      </TreeHeader>\n      <div className=\"tw-tree-content\">{children}</div>\n    </div>\n  );\n}\n"]}

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { UseCategoriesTreeProps } from "./UseCategoriesTree";
-import type { VisibilityTreeProps } from "../common/components/VisibilityTree";
+import type { UseCategoriesTreeProps } from "./UseCategoriesTree.js";
+import type { VisibilityTreeProps } from "../common/components/VisibilityTree.js";
 /** @beta */
 export type CategoriesTreeProps = Pick<VisibilityTreeProps, "imodel" | "getSchemaContext" | "selectionStorage" | "density" | "selectionMode"> & UseCategoriesTreeProps & {
     hierarchyLevelConfig?: {

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

@@ -3,9 +3,9 @@ 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.
  *--------------------------------------------------------------------------------------------*/
-import { VisibilityTree } from "../common/components/VisibilityTree";
-import { VisibilityTreeRenderer } from "../common/components/VisibilityTreeRenderer";
-import { useCategoriesTree } from "./UseCategoriesTree";
+import { VisibilityTree } from "../common/components/VisibilityTree.js";
+import { VisibilityTreeRenderer } from "../common/components/VisibilityTreeRenderer.js";
+import { useCategoriesTree } from "./UseCategoriesTree.js";
 /** @beta */
 export function CategoriesTree({ imodel, getSchemaContext, selectionStorage, activeView, filter, density, hierarchyLevelConfig, selectionMode, onCategoriesFiltered, }) {
     const { categoriesTreeProps, rendererProps } = useCategoriesTree({

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

@@ -1 +1 @@
-{"version":3,"file":"CategoriesTree.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesTree.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6CAA6C,CAAC;AACrF,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAaxD,YAAY;AACZ,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,EACN,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,MAAM,EACN,OAAO,EACP,oBAAoB,EACpB,aAAa,EACb,oBAAoB,GACA;IACpB,MAAM,EAAE,mBAAmB,EAAE,aAAa,EAAE,GAAG,iBAAiB,CAAC;QAC/D,MAAM;QACN,UAAU;QACV,oBAAoB;KACrB,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,cAAc,OACT,mBAAmB,EACvB,MAAM,EAAE,MAAM,EACd,gBAAgB,EAAE,gBAAgB,EAClC,gBAAgB,EAAE,gBAAgB,EAClC,uBAAuB,EAAE,oBAAoB,EAAE,SAAS,EACxD,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,IAAI,MAAM,EACtC,YAAY,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,KAAC,sBAAsB,OAAK,SAAS,KAAM,aAAa,GAAI,GACzF,CACH,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport { VisibilityTree } from \"../common/components/VisibilityTree\";\nimport { VisibilityTreeRenderer } from \"../common/components/VisibilityTreeRenderer\";\nimport { useCategoriesTree } from \"./UseCategoriesTree\";\n\nimport type { UseCategoriesTreeProps } from \"./UseCategoriesTree\";\nimport type { VisibilityTreeProps } from \"../common/components/VisibilityTree\";\n\n/** @beta */\nexport type CategoriesTreeProps = Pick<VisibilityTreeProps, \"imodel\" | \"getSchemaContext\" | \"selectionStorage\" | \"density\" | \"selectionMode\"> &\n  UseCategoriesTreeProps & {\n    hierarchyLevelConfig?: {\n      sizeLimit?: number;\n    };\n  };\n\n/** @beta */\nexport function CategoriesTree({\n  imodel,\n  getSchemaContext,\n  selectionStorage,\n  activeView,\n  filter,\n  density,\n  hierarchyLevelConfig,\n  selectionMode,\n  onCategoriesFiltered,\n}: CategoriesTreeProps) {\n  const { categoriesTreeProps, rendererProps } = useCategoriesTree({\n    filter,\n    activeView,\n    onCategoriesFiltered,\n  });\n\n  return (\n    <VisibilityTree\n      {...categoriesTreeProps}\n      imodel={imodel}\n      selectionStorage={selectionStorage}\n      getSchemaContext={getSchemaContext}\n      hierarchyLevelSizeLimit={hierarchyLevelConfig?.sizeLimit}\n      density={density}\n      selectionMode={selectionMode ?? \"none\"}\n      treeRenderer={(treeProps) => <VisibilityTreeRenderer {...treeProps} {...rendererProps} />}\n    />\n  );\n}\n"]}
+{"version":3,"file":"CategoriesTree.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesTree.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,sBAAsB,EAAE,MAAM,gDAAgD,CAAC;AACxF,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAa3D,YAAY;AACZ,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,EACN,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,MAAM,EACN,OAAO,EACP,oBAAoB,EACpB,aAAa,EACb,oBAAoB,GACA;IACpB,MAAM,EAAE,mBAAmB,EAAE,aAAa,EAAE,GAAG,iBAAiB,CAAC;QAC/D,MAAM;QACN,UAAU;QACV,oBAAoB;KACrB,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,cAAc,OACT,mBAAmB,EACvB,MAAM,EAAE,MAAM,EACd,gBAAgB,EAAE,gBAAgB,EAClC,gBAAgB,EAAE,gBAAgB,EAClC,uBAAuB,EAAE,oBAAoB,EAAE,SAAS,EACxD,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,IAAI,MAAM,EACtC,YAAY,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,KAAC,sBAAsB,OAAK,SAAS,KAAM,aAAa,GAAI,GACzF,CACH,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport { VisibilityTree } from \"../common/components/VisibilityTree.js\";\nimport { VisibilityTreeRenderer } from \"../common/components/VisibilityTreeRenderer.js\";\nimport { useCategoriesTree } from \"./UseCategoriesTree.js\";\n\nimport type { UseCategoriesTreeProps } from \"./UseCategoriesTree.js\";\nimport type { VisibilityTreeProps } from \"../common/components/VisibilityTree.js\";\n\n/** @beta */\nexport type CategoriesTreeProps = Pick<VisibilityTreeProps, \"imodel\" | \"getSchemaContext\" | \"selectionStorage\" | \"density\" | \"selectionMode\"> &\n  UseCategoriesTreeProps & {\n    hierarchyLevelConfig?: {\n      sizeLimit?: number;\n    };\n  };\n\n/** @beta */\nexport function CategoriesTree({\n  imodel,\n  getSchemaContext,\n  selectionStorage,\n  activeView,\n  filter,\n  density,\n  hierarchyLevelConfig,\n  selectionMode,\n  onCategoriesFiltered,\n}: CategoriesTreeProps) {\n  const { categoriesTreeProps, rendererProps } = useCategoriesTree({\n    filter,\n    activeView,\n    onCategoriesFiltered,\n  });\n\n  return (\n    <VisibilityTree\n      {...categoriesTreeProps}\n      imodel={imodel}\n      selectionStorage={selectionStorage}\n      getSchemaContext={getSchemaContext}\n      hierarchyLevelSizeLimit={hierarchyLevelConfig?.sizeLimit}\n      density={density}\n      selectionMode={selectionMode ?? \"none\"}\n      treeRenderer={(treeProps) => <VisibilityTreeRenderer {...treeProps} {...rendererProps} />}\n    />\n  );\n}\n"]}

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { CategoryInfo } from "../common/CategoriesVisibilityUtils";
-import type { TreeHeaderButtonProps } from "../../tree-header/TreeHeader";
+import type { CategoryInfo } from "../common/CategoriesVisibilityUtils.js";
+import type { TreeHeaderButtonProps } from "../../tree-header/TreeHeader.js";
 import type { Viewport } from "@itwin/core-frontend";
 /**
  * Props that get passed to `CategoriesTreeComponent` header button renderer.

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

@@ -7,8 +7,8 @@ import { useMemo, useState } from "react";
 import { useAsyncValue } from "@itwin/components-react";
 import { SvgVisibilityHalf, SvgVisibilityHide, SvgVisibilityShow } from "@itwin/itwinui-icons-react";
 import { IconButton } from "@itwin/itwinui-react";
-import { TreeWidget } from "../../../TreeWidget";
-import { hideAllCategories, invertAllCategories, loadCategoriesFromViewport, showAllCategories } from "../common/CategoriesVisibilityUtils";
+import { TreeWidget } from "../../../TreeWidget.js";
+import { hideAllCategories, invertAllCategories, loadCategoriesFromViewport, showAllCategories } from "../common/CategoriesVisibilityUtils.js";
 /**
  * Custom hook that creates props required to render `CategoriesTreeComponent` header button.
  *

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

@@ -1 +1 @@
-{"version":3,"file":"CategoriesTreeButtons.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesTreeButtons.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport { useMemo, useState } from \"react\";\nimport { useAsyncValue } from \"@itwin/components-react\";\nimport { SvgVisibilityHalf, SvgVisibilityHide, SvgVisibilityShow } from \"@itwin/itwinui-icons-react\";\nimport { IconButton } from \"@itwin/itwinui-react\";\nimport { TreeWidget } from \"../../../TreeWidget\";\nimport { hideAllCategories, invertAllCategories, loadCategoriesFromViewport, showAllCategories } from \"../common/CategoriesVisibilityUtils\";\n\nimport type { CategoryInfo } from \"../common/CategoriesVisibilityUtils\";\nimport type { TreeHeaderButtonProps } from \"../../tree-header/TreeHeader\";\nimport type { Viewport } from \"@itwin/core-frontend\";\n\n/**\n * Props that get passed to `CategoriesTreeComponent` header button renderer.\n * @see CategoriesTreeComponentProps.headerButtons\n * @public\n */\nexport interface CategoriesTreeHeaderButtonProps extends TreeHeaderButtonProps {\n  /** A list of categories available in the iModel */\n  categories: CategoryInfo[];\n}\n\n/**\n * Custom hook that creates props required to render `CategoriesTreeComponent` header button.\n *\n * Example:\n * ```tsx\n * const { buttonProps, onCategoriesFiltered } = useCategoriesTreeButtonProps({ viewport });\n * <TreeWithHeader\n *   buttons={[\n *     <CategoriesTreeComponent.ShowAllButton {...buttonProps} />,\n *     <CategoriesTreeComponent.HideAllButton {...buttonProps} />,\n *   ]}\n * >\n *   <CategoriesTree {...treeProps} onCategoriesFiltered={onCategoriesFiltered} />\n * </TreeWithHeader>\n * ```\n *\n * @public\n */\nexport function useCategoriesTreeButtonProps({ viewport }: { viewport: Viewport }): {\n  buttonProps: Pick<CategoriesTreeHeaderButtonProps, \"categories\" | \"viewport\">;\n  onCategoriesFiltered: (categories: CategoryInfo[] | undefined) => void;\n} {\n  const [filteredCategories, setFilteredCategories] = useState<CategoryInfo[] | undefined>();\n  const categories = useCategories(viewport);\n  return {\n    buttonProps: {\n      viewport,\n      categories: filteredCategories ?? categories,\n    },\n    onCategoriesFiltered: setFilteredCategories,\n  };\n}\n\n/** @public */\nexport type CategoriesTreeHeaderButtonType = (props: CategoriesTreeHeaderButtonProps) => JSX.Element | null;\n\n/** @public */\nexport function ShowAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      label={TreeWidget.translate(\"categoriesTree.buttons.showAll.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(`categories-tree-showall`);\n        void showAllCategories(\n          props.categories.map((category) => category.categoryId),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityShow />\n    </IconButton>\n  );\n}\n\n/** @public */\nexport function HideAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      label={TreeWidget.translate(\"categoriesTree.buttons.hideAll.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(`categories-tree-hideall`);\n        void hideAllCategories(\n          props.categories.map((category) => category.categoryId),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityHide />\n    </IconButton>\n  );\n}\n\n/** @public */\nexport function InvertAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      label={TreeWidget.translate(\"categoriesTree.buttons.invert.tooltip\")}\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      onClick={() => {\n        props.onFeatureUsed?.(`categories-tree-invert`);\n        void invertAllCategories(props.categories, props.viewport);\n      }}\n    >\n      <SvgVisibilityHalf />\n    </IconButton>\n  );\n}\n\nconst EMPTY_CATEGORIES_ARRAY: CategoryInfo[] = [];\n\nexport function useCategories(viewport: Viewport) {\n  const categoriesPromise = useMemo(async () => loadCategoriesFromViewport(viewport), [viewport]);\n  return useAsyncValue(categoriesPromise) ?? EMPTY_CATEGORIES_ARRAY;\n}\n"]}
+{"version":3,"file":"CategoriesTreeButtons.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesTreeButtons.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AACrG,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,0BAA0B,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAgB/I;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,4BAA4B,CAAC,EAAE,QAAQ,EAA0B;IAI/E,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,EAA8B,CAAC;IAC3F,MAAM,UAAU,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;IAC3C,OAAO;QACL,WAAW,EAAE;YACX,QAAQ;YACR,UAAU,EAAE,kBAAkB,IAAI,UAAU;SAC7C;QACD,oBAAoB,EAAE,qBAAqB;KAC5C,CAAC;AACJ,CAAC;AAKD,cAAc;AACd,MAAM,UAAU,aAAa,CAAC,KAAsC;IAClE,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,wCAAwC,CAAC,EACrE,OAAO,EAAE,GAAG,EAAE;YACZ,KAAK,CAAC,aAAa,EAAE,CAAC,yBAAyB,CAAC,CAAC;YACjD,KAAK,iBAAiB,CACpB,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,UAAU,CAAC,EACvD,KAAK,CAAC,QAAQ,CACf,CAAC;QACJ,CAAC,YAED,KAAC,iBAAiB,KAAG,GACV,CACd,CAAC;AACJ,CAAC;AAED,cAAc;AACd,MAAM,UAAU,aAAa,CAAC,KAAsC;IAClE,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,wCAAwC,CAAC,EACrE,OAAO,EAAE,GAAG,EAAE;YACZ,KAAK,CAAC,aAAa,EAAE,CAAC,yBAAyB,CAAC,CAAC;YACjD,KAAK,iBAAiB,CACpB,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,UAAU,CAAC,EACvD,KAAK,CAAC,QAAQ,CACf,CAAC;QACJ,CAAC,YAED,KAAC,iBAAiB,KAAG,GACV,CACd,CAAC;AACJ,CAAC;AAED,cAAc;AACd,MAAM,UAAU,eAAe,CAAC,KAAsC;IACpE,OAAO,CACL,KAAC,UAAU,IACT,KAAK,EAAE,UAAU,CAAC,SAAS,CAAC,uCAAuC,CAAC,EACpE,IAAI,EAAE,KAAK,CAAC,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACtD,SAAS,EAAC,YAAY,EACtB,OAAO,EAAE,GAAG,EAAE;YACZ,KAAK,CAAC,aAAa,EAAE,CAAC,wBAAwB,CAAC,CAAC;YAChD,KAAK,mBAAmB,CAAC,KAAK,CAAC,UAAU,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;QAC7D,CAAC,YAED,KAAC,iBAAiB,KAAG,GACV,CACd,CAAC;AACJ,CAAC;AAED,MAAM,sBAAsB,GAAmB,EAAE,CAAC;AAElD,MAAM,UAAU,aAAa,CAAC,QAAkB;IAC9C,MAAM,iBAAiB,GAAG,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC,0BAA0B,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAChG,OAAO,aAAa,CAAC,iBAAiB,CAAC,IAAI,sBAAsB,CAAC;AACpE,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 { useMemo, useState } from \"react\";\nimport { useAsyncValue } from \"@itwin/components-react\";\nimport { SvgVisibilityHalf, SvgVisibilityHide, SvgVisibilityShow } from \"@itwin/itwinui-icons-react\";\nimport { IconButton } from \"@itwin/itwinui-react\";\nimport { TreeWidget } from \"../../../TreeWidget.js\";\nimport { hideAllCategories, invertAllCategories, loadCategoriesFromViewport, showAllCategories } from \"../common/CategoriesVisibilityUtils.js\";\n\nimport type { CategoryInfo } from \"../common/CategoriesVisibilityUtils.js\";\nimport type { TreeHeaderButtonProps } from \"../../tree-header/TreeHeader.js\";\nimport type { Viewport } from \"@itwin/core-frontend\";\n\n/**\n * Props that get passed to `CategoriesTreeComponent` header button renderer.\n * @see CategoriesTreeComponentProps.headerButtons\n * @public\n */\nexport interface CategoriesTreeHeaderButtonProps extends TreeHeaderButtonProps {\n  /** A list of categories available in the iModel */\n  categories: CategoryInfo[];\n}\n\n/**\n * Custom hook that creates props required to render `CategoriesTreeComponent` header button.\n *\n * Example:\n * ```tsx\n * const { buttonProps, onCategoriesFiltered } = useCategoriesTreeButtonProps({ viewport });\n * <TreeWithHeader\n *   buttons={[\n *     <CategoriesTreeComponent.ShowAllButton {...buttonProps} />,\n *     <CategoriesTreeComponent.HideAllButton {...buttonProps} />,\n *   ]}\n * >\n *   <CategoriesTree {...treeProps} onCategoriesFiltered={onCategoriesFiltered} />\n * </TreeWithHeader>\n * ```\n *\n * @public\n */\nexport function useCategoriesTreeButtonProps({ viewport }: { viewport: Viewport }): {\n  buttonProps: Pick<CategoriesTreeHeaderButtonProps, \"categories\" | \"viewport\">;\n  onCategoriesFiltered: (categories: CategoryInfo[] | undefined) => void;\n} {\n  const [filteredCategories, setFilteredCategories] = useState<CategoryInfo[] | undefined>();\n  const categories = useCategories(viewport);\n  return {\n    buttonProps: {\n      viewport,\n      categories: filteredCategories ?? categories,\n    },\n    onCategoriesFiltered: setFilteredCategories,\n  };\n}\n\n/** @public */\nexport type CategoriesTreeHeaderButtonType = (props: CategoriesTreeHeaderButtonProps) => JSX.Element | null;\n\n/** @public */\nexport function ShowAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      label={TreeWidget.translate(\"categoriesTree.buttons.showAll.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(`categories-tree-showall`);\n        void showAllCategories(\n          props.categories.map((category) => category.categoryId),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityShow />\n    </IconButton>\n  );\n}\n\n/** @public */\nexport function HideAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      label={TreeWidget.translate(\"categoriesTree.buttons.hideAll.tooltip\")}\n      onClick={() => {\n        props.onFeatureUsed?.(`categories-tree-hideall`);\n        void hideAllCategories(\n          props.categories.map((category) => category.categoryId),\n          props.viewport,\n        );\n      }}\n    >\n      <SvgVisibilityHide />\n    </IconButton>\n  );\n}\n\n/** @public */\nexport function InvertAllButton(props: CategoriesTreeHeaderButtonProps) {\n  return (\n    <IconButton\n      label={TreeWidget.translate(\"categoriesTree.buttons.invert.tooltip\")}\n      size={props.density === \"enlarged\" ? \"large\" : \"small\"}\n      styleType=\"borderless\"\n      onClick={() => {\n        props.onFeatureUsed?.(`categories-tree-invert`);\n        void invertAllCategories(props.categories, props.viewport);\n      }}\n    >\n      <SvgVisibilityHalf />\n    </IconButton>\n  );\n}\n\nconst EMPTY_CATEGORIES_ARRAY: CategoryInfo[] = [];\n\nexport function useCategories(viewport: Viewport) {\n  const categoriesPromise = useMemo(async () => loadCategoriesFromViewport(viewport), [viewport]);\n  return useAsyncValue(categoriesPromise) ?? EMPTY_CATEGORIES_ARRAY;\n}\n"]}

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { CategoriesTreeProps } from "./CategoriesTree";
-import type { CategoriesTreeHeaderButtonProps, CategoriesTreeHeaderButtonType } from "./CategoriesTreeButtons";
+import type { CategoriesTreeProps } from "./CategoriesTree.js";
+import type { CategoriesTreeHeaderButtonProps, CategoriesTreeHeaderButtonType } from "./CategoriesTreeButtons.js";
 /** @public */
 interface CategoriesTreeComponentProps extends Pick<CategoriesTreeProps, "getSchemaContext" | "selectionStorage" | "density" | "hierarchyLevelConfig" | "selectionMode"> {
     /**

package/lib/esm/components/trees/categories-tree/CategoriesTreeComponent.js

@@ -6,13 +6,13 @@ import { jsx as _jsx } from "react/jsx-runtime";
  *--------------------------------------------------------------------------------------------*/
 import { Fragment } from "react";
 import { useActiveIModelConnection } from "@itwin/appui-react";
-import { TreeWidget } from "../../../TreeWidget";
-import { TreeWithHeader } from "../../tree-header/TreeWithHeader";
-import { useActiveViewport } from "../common/UseActiveViewport";
-import { useFiltering } from "../common/UseFiltering";
-import { TelemetryContextProvider } from "../common/UseTelemetryContext";
-import { CategoriesTree } from "./CategoriesTree";
-import { HideAllButton, InvertAllButton, ShowAllButton, useCategoriesTreeButtonProps } from "./CategoriesTreeButtons";
+import { TreeWidget } from "../../../TreeWidget.js";
+import { TreeWithHeader } from "../../tree-header/TreeWithHeader.js";
+import { useActiveViewport } from "../common/UseActiveViewport.js";
+import { useFiltering } from "../common/UseFiltering.js";
+import { TelemetryContextProvider } from "../common/UseTelemetryContext.js";
+import { CategoriesTree } from "./CategoriesTree.js";
+import { HideAllButton, InvertAllButton, ShowAllButton, useCategoriesTreeButtonProps } from "./CategoriesTreeButtons.js";
 /**
  * A component that renders `CategoriesTree` and a header with filtering capabilities and header buttons.
  * @public

package/lib/esm/components/trees/categories-tree/CategoriesTreeComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategoriesTreeComponent.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesTreeComponent.tsx"],"names":[],"mappings":";;AAAA;;;gGAGgG;AAEhG,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,aAAa,EAAE,4BAA4B,EAAE,MAAM,yBAAyB,CAAC;AAyBtH;;;GAGG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,KAAmC,EAAE,EAAE;IAC7E,MAAM,MAAM,GAAG,yBAAyB,EAAE,CAAC;IAC3C,MAAM,QAAQ,GAAG,iBAAiB,EAAE,CAAC;IAErC,IAAI,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE;QACxB,OAAO,IAAI,CAAC;KACb;IAED,OAAO,KAAC,2BAA2B,OAAK,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC;AACxF,CAAC,CAAC;AAEF;;;GAGG;AACH,uBAAuB,CAAC,aAAa,GAAG,aAA+C,CAAC;AAExF;;;GAGG;AACH,uBAAuB,CAAC,aAAa,GAAG,aAA+C,CAAC;AAExF;;;GAGG;AACH,uBAAuB,CAAC,eAAe,GAAG,eAAiD,CAAC;AAE5F;;;GAGG;AACH,uBAAuB,CAAC,EAAE,GAAG,oBAAoB,CAAC;AAElD;;;GAGG;AACH,uBAAuB,CAAC,QAAQ,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,SAAS,CAAC,sBAAsB,CAAC,CAAC;AAEtF,SAAS,2BAA2B,CAAC,EACnC,MAAM,EACN,QAAQ,EACR,aAAa,EACb,qBAAqB,EACrB,aAAa,EACb,GAAG,SAAS,EAC0E;IACtF,MAAM,EAAE,WAAW,EAAE,oBAAoB,EAAE,GAAG,4BAA4B,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC;IACzF,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,YAAY,EAAE,CAAC;IAC5D,MAAM,OAAO,GAAG,SAAS,CAAC,OAAO,CAAC;IAElC,MAAM,OAAO,GAAc,aAAa;QACtC,CAAC,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,KAAC,QAAQ,cAAc,GAAG,CAAC,EAAE,GAAG,WAAW,EAAE,aAAa,EAAE,CAAC,IAA9C,KAAK,CAAqD,CAAC;QAC9G,CAAC,CAAC;YACE,eAAC,aAAa,OAAK,WAAW,EAAE,GAAG,EAAC,cAAc,EAAC,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,GAAI;YACrG,eAAC,aAAa,OAAK,WAAW,EAAE,GAAG,EAAC,cAAc,EAAC,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,GAAI;YACrG,eAAC,eAAe,OAAK,WAAW,EAAE,GAAG,EAAC,gBAAgB,EAAC,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,GAAI;SAC1G,CAAC;IAEN,OAAO,CACL,KAAC,wBAAwB,IAAC,mBAAmB,EAAE,uBAAuB,CAAC,EAAE,EAAE,aAAa,EAAE,aAAa,EAAE,qBAAqB,EAAE,qBAAqB,YACnJ,KAAC,cAAc,IACb,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE;gBACd,aAAa,EAAE,WAAW;gBAC1B,aAAa,EAAE,WAAW;aAC3B,YAED,KAAC,cAAc,OAAK,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,oBAAoB,EAAE,oBAAoB,GAAI,GACpH,GACQ,CAC5B,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport { Fragment } from \"react\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { TreeWidget } from \"../../../TreeWidget\";\nimport { TreeWithHeader } from \"../../tree-header/TreeWithHeader\";\nimport { useActiveViewport } from \"../common/UseActiveViewport\";\nimport { useFiltering } from \"../common/UseFiltering\";\nimport { TelemetryContextProvider } from \"../common/UseTelemetryContext\";\nimport { CategoriesTree } from \"./CategoriesTree\";\nimport { HideAllButton, InvertAllButton, ShowAllButton, useCategoriesTreeButtonProps } from \"./CategoriesTreeButtons\";\n\nimport type { CategoriesTreeProps } from \"./CategoriesTree\";\nimport type { ReactNode } from \"react\";\nimport type { IModelConnection, ScreenViewport } from \"@itwin/core-frontend\";\nimport type { CategoriesTreeHeaderButtonProps, CategoriesTreeHeaderButtonType } from \"./CategoriesTreeButtons\";\n\n/** @public */\ninterface CategoriesTreeComponentProps\n  extends Pick<CategoriesTreeProps, \"getSchemaContext\" | \"selectionStorage\" | \"density\" | \"hierarchyLevelConfig\" | \"selectionMode\"> {\n  /**\n   * Renderers of header buttons. Defaults to:\n   * ```ts\n   * [\n   *   CategoriesTreeComponent.ShowAllButton,\n   *   CategoriesTreeComponent.HideAllButton,\n   *   CategoriesTreeComponent.InvertAllButton,\n   * ]\n   * ```\n   */\n  headerButtons?: Array<(props: CategoriesTreeHeaderButtonProps) => React.ReactNode>;\n  onPerformanceMeasured?: (featureId: string, duration: number) => void;\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/**\n * A component that renders `CategoriesTree` and a header with filtering capabilities and header buttons.\n * @public\n */\nexport const CategoriesTreeComponent = (props: CategoriesTreeComponentProps) => {\n  const iModel = useActiveIModelConnection();\n  const viewport = useActiveViewport();\n\n  if (!iModel || !viewport) {\n    return null;\n  }\n\n  return <CategoriesTreeComponentImpl {...props} iModel={iModel} viewport={viewport} />;\n};\n\n/**\n * Renders a \"Show all\" button that enables display of all categories and their subcategories.\n * @public\n */\nCategoriesTreeComponent.ShowAllButton = ShowAllButton as CategoriesTreeHeaderButtonType;\n\n/**\n * Renders a \"Hide all\" button that disables display of all categories.\n * @public\n */\nCategoriesTreeComponent.HideAllButton = HideAllButton as CategoriesTreeHeaderButtonType;\n\n/**\n * Renders an \"Invert all\" button that inverts display of all categories.\n * @public\n */\nCategoriesTreeComponent.InvertAllButton = InvertAllButton as CategoriesTreeHeaderButtonType;\n\n/**\n * Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nCategoriesTreeComponent.id = \"categories-tree-v2\";\n\n/**\n * Label of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nCategoriesTreeComponent.getLabel = () => TreeWidget.translate(\"categoriesTree.label\");\n\nfunction CategoriesTreeComponentImpl({\n  iModel,\n  viewport,\n  headerButtons,\n  onPerformanceMeasured,\n  onFeatureUsed,\n  ...treeProps\n}: CategoriesTreeComponentProps & { iModel: IModelConnection; viewport: ScreenViewport }) {\n  const { buttonProps, onCategoriesFiltered } = useCategoriesTreeButtonProps({ viewport });\n  const { filter, applyFilter, clearFilter } = useFiltering();\n  const density = treeProps.density;\n\n  const buttons: ReactNode = headerButtons\n    ? headerButtons.map((btn, index) => <Fragment key={index}>{btn({ ...buttonProps, onFeatureUsed })}</Fragment>)\n    : [\n        <ShowAllButton {...buttonProps} key=\"show-all-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n        <HideAllButton {...buttonProps} key=\"hide-all-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n        <InvertAllButton {...buttonProps} key=\"invert-all-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n      ];\n\n  return (\n    <TelemetryContextProvider componentIdentifier={CategoriesTreeComponent.id} onFeatureUsed={onFeatureUsed} onPerformanceMeasured={onPerformanceMeasured}>\n      <TreeWithHeader\n        buttons={buttons}\n        density={density}\n        filteringProps={{\n          onFilterStart: applyFilter,\n          onFilterClear: clearFilter,\n        }}\n      >\n        <CategoriesTree {...treeProps} imodel={iModel} activeView={viewport} filter={filter} onCategoriesFiltered={onCategoriesFiltered} />\n      </TreeWithHeader>\n    </TelemetryContextProvider>\n  );\n}\n"]}
+{"version":3,"file":"CategoriesTreeComponent.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesTreeComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n\nimport { Fragment } from \"react\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { TreeWidget } from \"../../../TreeWidget.js\";\nimport { TreeWithHeader } from \"../../tree-header/TreeWithHeader.js\";\nimport { useActiveViewport } from \"../common/UseActiveViewport.js\";\nimport { useFiltering } from \"../common/UseFiltering.js\";\nimport { TelemetryContextProvider } from \"../common/UseTelemetryContext.js\";\nimport { CategoriesTree } from \"./CategoriesTree.js\";\nimport { HideAllButton, InvertAllButton, ShowAllButton, useCategoriesTreeButtonProps } from \"./CategoriesTreeButtons.js\";\n\nimport type { CategoriesTreeProps } from \"./CategoriesTree.js\";\nimport type { ReactNode } from \"react\";\nimport type { IModelConnection, ScreenViewport } from \"@itwin/core-frontend\";\nimport type { CategoriesTreeHeaderButtonProps, CategoriesTreeHeaderButtonType } from \"./CategoriesTreeButtons.js\";\n\n/** @public */\ninterface CategoriesTreeComponentProps\n  extends Pick<CategoriesTreeProps, \"getSchemaContext\" | \"selectionStorage\" | \"density\" | \"hierarchyLevelConfig\" | \"selectionMode\"> {\n  /**\n   * Renderers of header buttons. Defaults to:\n   * ```ts\n   * [\n   *   CategoriesTreeComponent.ShowAllButton,\n   *   CategoriesTreeComponent.HideAllButton,\n   *   CategoriesTreeComponent.InvertAllButton,\n   * ]\n   * ```\n   */\n  headerButtons?: Array<(props: CategoriesTreeHeaderButtonProps) => React.ReactNode>;\n  onPerformanceMeasured?: (featureId: string, duration: number) => void;\n  onFeatureUsed?: (feature: string) => void;\n}\n\n/**\n * A component that renders `CategoriesTree` and a header with filtering capabilities and header buttons.\n * @public\n */\nexport const CategoriesTreeComponent = (props: CategoriesTreeComponentProps) => {\n  const iModel = useActiveIModelConnection();\n  const viewport = useActiveViewport();\n\n  if (!iModel || !viewport) {\n    return null;\n  }\n\n  return <CategoriesTreeComponentImpl {...props} iModel={iModel} viewport={viewport} />;\n};\n\n/**\n * Renders a \"Show all\" button that enables display of all categories and their subcategories.\n * @public\n */\nCategoriesTreeComponent.ShowAllButton = ShowAllButton as CategoriesTreeHeaderButtonType;\n\n/**\n * Renders a \"Hide all\" button that disables display of all categories.\n * @public\n */\nCategoriesTreeComponent.HideAllButton = HideAllButton as CategoriesTreeHeaderButtonType;\n\n/**\n * Renders an \"Invert all\" button that inverts display of all categories.\n * @public\n */\nCategoriesTreeComponent.InvertAllButton = InvertAllButton as CategoriesTreeHeaderButtonType;\n\n/**\n * Id of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nCategoriesTreeComponent.id = \"categories-tree-v2\";\n\n/**\n * Label of the component. May be used when a creating a `TreeDefinition` for `SelectableTree`.\n * @public\n */\nCategoriesTreeComponent.getLabel = () => TreeWidget.translate(\"categoriesTree.label\");\n\nfunction CategoriesTreeComponentImpl({\n  iModel,\n  viewport,\n  headerButtons,\n  onPerformanceMeasured,\n  onFeatureUsed,\n  ...treeProps\n}: CategoriesTreeComponentProps & { iModel: IModelConnection; viewport: ScreenViewport }) {\n  const { buttonProps, onCategoriesFiltered } = useCategoriesTreeButtonProps({ viewport });\n  const { filter, applyFilter, clearFilter } = useFiltering();\n  const density = treeProps.density;\n\n  const buttons: ReactNode = headerButtons\n    ? headerButtons.map((btn, index) => <Fragment key={index}>{btn({ ...buttonProps, onFeatureUsed })}</Fragment>)\n    : [\n        <ShowAllButton {...buttonProps} key=\"show-all-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n        <HideAllButton {...buttonProps} key=\"hide-all-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n        <InvertAllButton {...buttonProps} key=\"invert-all-btn\" density={density} onFeatureUsed={onFeatureUsed} />,\n      ];\n\n  return (\n    <TelemetryContextProvider componentIdentifier={CategoriesTreeComponent.id} onFeatureUsed={onFeatureUsed} onPerformanceMeasured={onPerformanceMeasured}>\n      <TreeWithHeader\n        buttons={buttons}\n        density={density}\n        filteringProps={{\n          onFilterStart: applyFilter,\n          onFilterClear: clearFilter,\n        }}\n      >\n        <CategoriesTree {...treeProps} imodel={iModel} activeView={viewport} filter={filter} onCategoriesFiltered={onCategoriesFiltered} />\n      </TreeWithHeader>\n    </TelemetryContextProvider>\n  );\n}\n"]}

package/lib/esm/components/trees/categories-tree/CategoriesTreeDefinition.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import { createNodesQueryClauseFactory, createPredicateBasedHierarchyDefinition } from "@itwin/presentation-hierarchies";
 import { createBisInstanceLabelSelectClauseFactory, ECSql } from "@itwin/presentation-shared";
-import { FilterLimitExceededError } from "../common/TreeErrors";
+import { FilterLimitExceededError } from "../common/TreeErrors.js";
 const MAX_FILTERING_INSTANCE_KEY_COUNT = 100;
 export class CategoriesTreeDefinition {
     constructor(props) {
@@ -129,13 +129,18 @@ function getClassesByView(viewType) {
 }
 async function createInstanceKeyPathsFromInstanceLabel(props) {
     const { categoryClass, categoryElementClass } = getClassesByView(props.viewType);
+    const adjustedLabel = props.label.replace(/[%_\\]/g, "\\$&");
     const reader = props.imodelAccess.createQueryReader({
         ctes: [
-            `RootCategories(ClassName, ECInstanceId, ChildCount) as (
+            `RootCategoriesWithLabels(ClassName, ECInstanceId, ChildCount, DisplayLabel) as (
           SELECT
             ec_classname(this.ECClassId, 's.c'),
             this.ECInstanceId,
-            COUNT(sc.ECInstanceId)
+            COUNT(sc.ECInstanceId),
+            ${await props.labelsFactory.createSelectClause({
+                classAlias: "this",
+                className: categoryClass,
+            })}
           FROM ${categoryClass} this
           JOIN BisCore.Model m ON m.ECInstanceId = this.Model.Id
           JOIN BisCore.SubCategory sc ON sc.Parent.Id = this.ECInstanceId
@@ -159,17 +164,30 @@ async function createInstanceKeyPathsFromInstanceLabel(props) {
         )`,
         ],
         ecsql: `
+      SELECT * FROM (
         SELECT
           c.ClassName AS CategoryClass,
           c.ECInstanceId AS CategoryId,
-          IIF(c.ChildCount > 1, sc.ClassName, NULL) AS SubcategoryClass,
-          IIF(c.ChildCount > 1, sc.ECInstanceId, NULL) AS SubcategoryId
-        FROM RootCategories c
+          sc.ClassName AS SubcategoryClass,
+          sc.ECInstanceId AS SubcategoryId
+        FROM RootCategoriesWithLabels c
         JOIN SubCategoriesWithLabels sc ON sc.ParentId = c.ECInstanceId
-        WHERE sc.DisplayLabel LIKE '%' || ? || '%' ESCAPE '\\'
+        WHERE c.ChildCount > 1 AND sc.DisplayLabel LIKE '%' || ? || '%' ESCAPE '\\'
+        UNION ALL
+        SELECT
+          c.ClassName AS CategoryClass,
+          c.ECInstanceId AS CategoryId,
+          CAST(NULL AS TEXT) AS SubcategoryClass,
+          CAST(NULL AS TEXT) AS SubcategoryId
+        FROM RootCategoriesWithLabels c
+        WHERE c.DisplayLabel LIKE '%' || ? || '%' ESCAPE '\\'
+        )
         LIMIT ${MAX_FILTERING_INSTANCE_KEY_COUNT + 1}
       `,
-        bindings: [{ type: "string", value: props.label.replace(/[%_\\]/g, "\\$&") }],
+        bindings: [
+            { type: "string", value: adjustedLabel },
+            { type: "string", value: adjustedLabel },
+        ],
     }, { restartToken: "tree-widget/categories-tree/filter-by-label-query" });
     const paths = [];
     for await (const row of reader) {

package/lib/esm/components/trees/categories-tree/CategoriesTreeDefinition.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategoriesTreeDefinition.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesTreeDefinition.ts"],"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 { createNodesQueryClauseFactory, createPredicateBasedHierarchyDefinition } from \"@itwin/presentation-hierarchies\";\nimport { createBisInstanceLabelSelectClauseFactory, ECSql } from \"@itwin/presentation-shared\";\nimport { FilterLimitExceededError } from \"../common/TreeErrors\";\n\nimport type { ECClassHierarchyInspector, ECSchemaProvider, IInstanceLabelSelectClauseFactory } from \"@itwin/presentation-shared\";\nimport type {\n  DefineHierarchyLevelProps,\n  DefineInstanceNodeChildHierarchyLevelProps,\n  DefineRootHierarchyLevelProps,\n  HierarchyDefinition,\n  HierarchyFilteringPath,\n  HierarchyLevelDefinition,\n  LimitingECSqlQueryExecutor,\n  NodesQueryClauseFactory,\n} from \"@itwin/presentation-hierarchies\";\n\nconst MAX_FILTERING_INSTANCE_KEY_COUNT = 100;\n\ninterface CategoriesTreeDefinitionProps {\n  imodelAccess: ECSchemaProvider & ECClassHierarchyInspector;\n  viewType: \"2d\" | \"3d\";\n}\n\ninterface CategoriesTreeInstanceKeyPathsFromInstanceLabelProps {\n  imodelAccess: ECClassHierarchyInspector & LimitingECSqlQueryExecutor;\n  label: string;\n  viewType: \"2d\" | \"3d\";\n}\n\nexport class CategoriesTreeDefinition implements HierarchyDefinition {\n  private _impl: HierarchyDefinition;\n  private _selectQueryFactory: NodesQueryClauseFactory;\n  private _nodeLabelSelectClauseFactory: IInstanceLabelSelectClauseFactory;\n\n  public constructor(props: CategoriesTreeDefinitionProps) {\n    this._impl = createPredicateBasedHierarchyDefinition({\n      classHierarchyInspector: props.imodelAccess,\n      hierarchy: {\n        rootNodes: async (requestProps) => this.createRootHierarchyLevelDefinition({ ...requestProps, viewType: props.viewType }),\n        childNodes: [\n          {\n            parentInstancesNodePredicate: \"BisCore.Category\",\n            definitions: async (requestProps: DefineInstanceNodeChildHierarchyLevelProps) => this.createSubcategoryQuery(requestProps),\n          },\n        ],\n      },\n    });\n    this._nodeLabelSelectClauseFactory = createBisInstanceLabelSelectClauseFactory({ classHierarchyInspector: props.imodelAccess });\n    this._selectQueryFactory = createNodesQueryClauseFactory({\n      imodelAccess: props.imodelAccess,\n      instanceLabelSelectClauseFactory: this._nodeLabelSelectClauseFactory,\n    });\n  }\n\n  public async defineHierarchyLevel(props: DefineHierarchyLevelProps) {\n    return this._impl.defineHierarchyLevel(props);\n  }\n\n  private async createRootHierarchyLevelDefinition(props: DefineRootHierarchyLevelProps & { viewType: \"2d\" | \"3d\" }): Promise<HierarchyLevelDefinition> {\n    const { categoryClass, categoryElementClass } = getClassesByView(props.viewType);\n    const instanceFilterClauses = await this._selectQueryFactory.createFilterClauses({\n      filter: props.instanceFilter,\n      contentClass: { fullName: categoryClass, alias: \"this\" },\n    });\n    return [\n      {\n        fullClassName: categoryClass,\n        query: {\n          ecsql: `\n            SELECT\n              ${await this._selectQueryFactory.createSelectClause({\n                ecClassId: { selector: ECSql.createRawPropertyValueSelector(\"this\", \"ECClassId\") },\n                ecInstanceId: { selector: \"this.ECInstanceId\" },\n                nodeLabel: {\n                  selector: await this._nodeLabelSelectClauseFactory.createSelectClause({\n                    classAlias: \"this\",\n                    className: categoryClass,\n                  }),\n                },\n                hasChildren: {\n                  selector: `\n                    IFNULL((\n                      SELECT 1\n                      FROM (\n                        SELECT COUNT(1) AS ChildCount\n                        FROM BisCore.SubCategory sc\n                        WHERE sc.Parent.Id = this.ECInstanceId\n                      )\n                      WHERE ChildCount > 1\n                    ), 0)\n                  `,\n                },\n                extendedData: {\n                  description: { selector: \"this.Description\" },\n                },\n                supportsFiltering: true,\n              })}\n            FROM ${instanceFilterClauses.from} this\n            ${instanceFilterClauses.joins}\n            JOIN BisCore.Model m ON m.ECInstanceId = this.Model.Id\n            WHERE\n              NOT this.IsPrivate\n              AND (NOT m.IsPrivate OR m.ECClassId IS (BisCore.DictionaryModel))\n              AND EXISTS (SELECT 1 FROM ${categoryElementClass} e WHERE e.Category.Id = this.ECInstanceId)\n              ${instanceFilterClauses.where ? `AND ${instanceFilterClauses.where}` : \"\"}\n          `,\n        },\n      },\n    ];\n  }\n\n  private async createSubcategoryQuery({\n    parentNodeInstanceIds: elementIds,\n    instanceFilter,\n  }: DefineInstanceNodeChildHierarchyLevelProps): Promise<HierarchyLevelDefinition> {\n    const instanceFilterClauses = await this._selectQueryFactory.createFilterClauses({\n      filter: instanceFilter,\n      contentClass: { fullName: \"BisCore.SubCategory\", alias: \"this\" },\n    });\n    return [\n      {\n        fullClassName: \"BisCore.SubCategory\",\n        query: {\n          ecsql: `\n            SELECT\n              ${await this._selectQueryFactory.createSelectClause({\n                ecClassId: { selector: \"this.ECClassId\" },\n                ecInstanceId: { selector: \"this.ECInstanceId\" },\n                nodeLabel: {\n                  selector: await this._nodeLabelSelectClauseFactory.createSelectClause({\n                    classAlias: \"this\",\n                    className: \"BisCore.SubCategory\",\n                  }),\n                },\n                extendedData: {\n                  categoryId: { selector: \"printf('0x%x', this.Parent.Id)\" },\n                },\n                supportsFiltering: false,\n              })}\n            FROM ${instanceFilterClauses.from} this\n            ${instanceFilterClauses.joins}\n            WHERE\n              NOT this.IsPrivate AND this.Parent.Id IN (${elementIds.map(() => \"?\").join(\",\")})\n              ${instanceFilterClauses.where ? `AND ${instanceFilterClauses.where}` : \"\"}\n          `,\n          bindings: elementIds.map((id) => ({ type: \"id\", value: id })),\n        },\n      },\n    ];\n  }\n\n  public static async createInstanceKeyPaths(props: CategoriesTreeInstanceKeyPathsFromInstanceLabelProps) {\n    const labelsFactory = createBisInstanceLabelSelectClauseFactory({ classHierarchyInspector: props.imodelAccess });\n    return createInstanceKeyPathsFromInstanceLabel({ ...props, labelsFactory });\n  }\n}\n\nfunction getClassesByView(viewType: \"2d\" | \"3d\") {\n  return viewType === \"2d\"\n    ? { categoryClass: \"BisCore.DrawingCategory\", categoryElementClass: \"BisCore:GeometricElement2d\" }\n    : { categoryClass: \"BisCore.SpatialCategory\", categoryElementClass: \"BisCore:GeometricElement3d\" };\n}\n\nasync function createInstanceKeyPathsFromInstanceLabel(\n  props: CategoriesTreeInstanceKeyPathsFromInstanceLabelProps & { labelsFactory: IInstanceLabelSelectClauseFactory },\n) {\n  const { categoryClass, categoryElementClass } = getClassesByView(props.viewType);\n  const reader = props.imodelAccess.createQueryReader(\n    {\n      ctes: [\n        `RootCategories(ClassName, ECInstanceId, ChildCount) as (\n          SELECT\n            ec_classname(this.ECClassId, 's.c'),\n            this.ECInstanceId,\n            COUNT(sc.ECInstanceId)\n          FROM ${categoryClass} this\n          JOIN BisCore.Model m ON m.ECInstanceId = this.Model.Id\n          JOIN BisCore.SubCategory sc ON sc.Parent.Id = this.ECInstanceId\n          WHERE\n            NOT this.IsPrivate\n            AND (NOT m.IsPrivate OR m.ECClassId IS (BisCore.DictionaryModel))\n            AND EXISTS (SELECT 1 FROM ${categoryElementClass} e WHERE e.Category.Id = this.ECInstanceId)\n          GROUP BY this.ECInstanceId\n        )`,\n        `SubCategoriesWithLabels(ClassName, ECInstanceId, ParentId, DisplayLabel) as (\n          SELECT\n            ec_classname(this.ECClassId, 's.c'),\n            this.ECInstanceId,\n            this.Parent.Id,\n            ${await props.labelsFactory.createSelectClause({\n              classAlias: \"this\",\n              className: \"BisCore.SubCategory\",\n            })}\n          FROM BisCore.SubCategory this\n          WHERE NOT this.IsPrivate\n        )`,\n      ],\n      ecsql: `\n        SELECT\n          c.ClassName AS CategoryClass,\n          c.ECInstanceId AS CategoryId,\n          IIF(c.ChildCount > 1, sc.ClassName, NULL) AS SubcategoryClass,\n          IIF(c.ChildCount > 1, sc.ECInstanceId, NULL) AS SubcategoryId\n        FROM RootCategories c\n        JOIN SubCategoriesWithLabels sc ON sc.ParentId = c.ECInstanceId\n        WHERE sc.DisplayLabel LIKE '%' || ? || '%' ESCAPE '\\\\'\n        LIMIT ${MAX_FILTERING_INSTANCE_KEY_COUNT + 1}\n      `,\n      bindings: [{ type: \"string\", value: props.label.replace(/[%_\\\\]/g, \"\\\\$&\") }],\n    },\n    { restartToken: \"tree-widget/categories-tree/filter-by-label-query\" },\n  );\n  const paths: HierarchyFilteringPath[] = [];\n  for await (const row of reader) {\n    const path = { path: [{ className: row.CategoryClass, id: row.CategoryId }], options: { autoExpand: true } };\n    row.SubcategoryId && path.path.push({ className: row.SubcategoryClass, id: row.SubcategoryId });\n    paths.push(path);\n  }\n  if (paths.length > MAX_FILTERING_INSTANCE_KEY_COUNT) {\n    throw new FilterLimitExceededError(MAX_FILTERING_INSTANCE_KEY_COUNT);\n  }\n  return paths;\n}\n"]}
+{"version":3,"file":"CategoriesTreeDefinition.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesTreeDefinition.ts"],"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 { createNodesQueryClauseFactory, createPredicateBasedHierarchyDefinition } from \"@itwin/presentation-hierarchies\";\nimport { createBisInstanceLabelSelectClauseFactory, ECSql } from \"@itwin/presentation-shared\";\nimport { FilterLimitExceededError } from \"../common/TreeErrors.js\";\n\nimport type { ECClassHierarchyInspector, ECSchemaProvider, IInstanceLabelSelectClauseFactory } from \"@itwin/presentation-shared\";\nimport type {\n  DefineHierarchyLevelProps,\n  DefineInstanceNodeChildHierarchyLevelProps,\n  DefineRootHierarchyLevelProps,\n  HierarchyDefinition,\n  HierarchyFilteringPath,\n  HierarchyLevelDefinition,\n  LimitingECSqlQueryExecutor,\n  NodesQueryClauseFactory,\n} from \"@itwin/presentation-hierarchies\";\n\nconst MAX_FILTERING_INSTANCE_KEY_COUNT = 100;\n\ninterface CategoriesTreeDefinitionProps {\n  imodelAccess: ECSchemaProvider & ECClassHierarchyInspector;\n  viewType: \"2d\" | \"3d\";\n}\n\ninterface CategoriesTreeInstanceKeyPathsFromInstanceLabelProps {\n  imodelAccess: ECClassHierarchyInspector & LimitingECSqlQueryExecutor;\n  label: string;\n  viewType: \"2d\" | \"3d\";\n}\n\nexport class CategoriesTreeDefinition implements HierarchyDefinition {\n  private _impl: HierarchyDefinition;\n  private _selectQueryFactory: NodesQueryClauseFactory;\n  private _nodeLabelSelectClauseFactory: IInstanceLabelSelectClauseFactory;\n\n  public constructor(props: CategoriesTreeDefinitionProps) {\n    this._impl = createPredicateBasedHierarchyDefinition({\n      classHierarchyInspector: props.imodelAccess,\n      hierarchy: {\n        rootNodes: async (requestProps) => this.createRootHierarchyLevelDefinition({ ...requestProps, viewType: props.viewType }),\n        childNodes: [\n          {\n            parentInstancesNodePredicate: \"BisCore.Category\",\n            definitions: async (requestProps: DefineInstanceNodeChildHierarchyLevelProps) => this.createSubcategoryQuery(requestProps),\n          },\n        ],\n      },\n    });\n    this._nodeLabelSelectClauseFactory = createBisInstanceLabelSelectClauseFactory({ classHierarchyInspector: props.imodelAccess });\n    this._selectQueryFactory = createNodesQueryClauseFactory({\n      imodelAccess: props.imodelAccess,\n      instanceLabelSelectClauseFactory: this._nodeLabelSelectClauseFactory,\n    });\n  }\n\n  public async defineHierarchyLevel(props: DefineHierarchyLevelProps) {\n    return this._impl.defineHierarchyLevel(props);\n  }\n\n  private async createRootHierarchyLevelDefinition(props: DefineRootHierarchyLevelProps & { viewType: \"2d\" | \"3d\" }): Promise<HierarchyLevelDefinition> {\n    const { categoryClass, categoryElementClass } = getClassesByView(props.viewType);\n    const instanceFilterClauses = await this._selectQueryFactory.createFilterClauses({\n      filter: props.instanceFilter,\n      contentClass: { fullName: categoryClass, alias: \"this\" },\n    });\n    return [\n      {\n        fullClassName: categoryClass,\n        query: {\n          ecsql: `\n            SELECT\n              ${await this._selectQueryFactory.createSelectClause({\n                ecClassId: { selector: ECSql.createRawPropertyValueSelector(\"this\", \"ECClassId\") },\n                ecInstanceId: { selector: \"this.ECInstanceId\" },\n                nodeLabel: {\n                  selector: await this._nodeLabelSelectClauseFactory.createSelectClause({\n                    classAlias: \"this\",\n                    className: categoryClass,\n                  }),\n                },\n                hasChildren: {\n                  selector: `\n                    IFNULL((\n                      SELECT 1\n                      FROM (\n                        SELECT COUNT(1) AS ChildCount\n                        FROM BisCore.SubCategory sc\n                        WHERE sc.Parent.Id = this.ECInstanceId\n                      )\n                      WHERE ChildCount > 1\n                    ), 0)\n                  `,\n                },\n                extendedData: {\n                  description: { selector: \"this.Description\" },\n                },\n                supportsFiltering: true,\n              })}\n            FROM ${instanceFilterClauses.from} this\n            ${instanceFilterClauses.joins}\n            JOIN BisCore.Model m ON m.ECInstanceId = this.Model.Id\n            WHERE\n              NOT this.IsPrivate\n              AND (NOT m.IsPrivate OR m.ECClassId IS (BisCore.DictionaryModel))\n              AND EXISTS (SELECT 1 FROM ${categoryElementClass} e WHERE e.Category.Id = this.ECInstanceId)\n              ${instanceFilterClauses.where ? `AND ${instanceFilterClauses.where}` : \"\"}\n          `,\n        },\n      },\n    ];\n  }\n\n  private async createSubcategoryQuery({\n    parentNodeInstanceIds: elementIds,\n    instanceFilter,\n  }: DefineInstanceNodeChildHierarchyLevelProps): Promise<HierarchyLevelDefinition> {\n    const instanceFilterClauses = await this._selectQueryFactory.createFilterClauses({\n      filter: instanceFilter,\n      contentClass: { fullName: \"BisCore.SubCategory\", alias: \"this\" },\n    });\n    return [\n      {\n        fullClassName: \"BisCore.SubCategory\",\n        query: {\n          ecsql: `\n            SELECT\n              ${await this._selectQueryFactory.createSelectClause({\n                ecClassId: { selector: \"this.ECClassId\" },\n                ecInstanceId: { selector: \"this.ECInstanceId\" },\n                nodeLabel: {\n                  selector: await this._nodeLabelSelectClauseFactory.createSelectClause({\n                    classAlias: \"this\",\n                    className: \"BisCore.SubCategory\",\n                  }),\n                },\n                extendedData: {\n                  categoryId: { selector: \"printf('0x%x', this.Parent.Id)\" },\n                },\n                supportsFiltering: false,\n              })}\n            FROM ${instanceFilterClauses.from} this\n            ${instanceFilterClauses.joins}\n            WHERE\n              NOT this.IsPrivate AND this.Parent.Id IN (${elementIds.map(() => \"?\").join(\",\")})\n              ${instanceFilterClauses.where ? `AND ${instanceFilterClauses.where}` : \"\"}\n          `,\n          bindings: elementIds.map((id) => ({ type: \"id\", value: id })),\n        },\n      },\n    ];\n  }\n\n  public static async createInstanceKeyPaths(props: CategoriesTreeInstanceKeyPathsFromInstanceLabelProps) {\n    const labelsFactory = createBisInstanceLabelSelectClauseFactory({ classHierarchyInspector: props.imodelAccess });\n    return createInstanceKeyPathsFromInstanceLabel({ ...props, labelsFactory });\n  }\n}\n\nfunction getClassesByView(viewType: \"2d\" | \"3d\") {\n  return viewType === \"2d\"\n    ? { categoryClass: \"BisCore.DrawingCategory\", categoryElementClass: \"BisCore:GeometricElement2d\" }\n    : { categoryClass: \"BisCore.SpatialCategory\", categoryElementClass: \"BisCore:GeometricElement3d\" };\n}\n\nasync function createInstanceKeyPathsFromInstanceLabel(\n  props: CategoriesTreeInstanceKeyPathsFromInstanceLabelProps & { labelsFactory: IInstanceLabelSelectClauseFactory },\n) {\n  const { categoryClass, categoryElementClass } = getClassesByView(props.viewType);\n  const adjustedLabel = props.label.replace(/[%_\\\\]/g, \"\\\\$&\");\n  const reader = props.imodelAccess.createQueryReader(\n    {\n      ctes: [\n        `RootCategoriesWithLabels(ClassName, ECInstanceId, ChildCount, DisplayLabel) as (\n          SELECT\n            ec_classname(this.ECClassId, 's.c'),\n            this.ECInstanceId,\n            COUNT(sc.ECInstanceId),\n            ${await props.labelsFactory.createSelectClause({\n              classAlias: \"this\",\n              className: categoryClass,\n            })}\n          FROM ${categoryClass} this\n          JOIN BisCore.Model m ON m.ECInstanceId = this.Model.Id\n          JOIN BisCore.SubCategory sc ON sc.Parent.Id = this.ECInstanceId\n          WHERE\n            NOT this.IsPrivate\n            AND (NOT m.IsPrivate OR m.ECClassId IS (BisCore.DictionaryModel))\n            AND EXISTS (SELECT 1 FROM ${categoryElementClass} e WHERE e.Category.Id = this.ECInstanceId)\n          GROUP BY this.ECInstanceId\n        )`,\n        `SubCategoriesWithLabels(ClassName, ECInstanceId, ParentId, DisplayLabel) as (\n          SELECT\n            ec_classname(this.ECClassId, 's.c'),\n            this.ECInstanceId,\n            this.Parent.Id,\n            ${await props.labelsFactory.createSelectClause({\n              classAlias: \"this\",\n              className: \"BisCore.SubCategory\",\n            })}\n          FROM BisCore.SubCategory this\n          WHERE NOT this.IsPrivate\n        )`,\n      ],\n      ecsql: `\n      SELECT * FROM (\n        SELECT\n          c.ClassName AS CategoryClass,\n          c.ECInstanceId AS CategoryId,\n          sc.ClassName AS SubcategoryClass,\n          sc.ECInstanceId AS SubcategoryId\n        FROM RootCategoriesWithLabels c\n        JOIN SubCategoriesWithLabels sc ON sc.ParentId = c.ECInstanceId\n        WHERE c.ChildCount > 1 AND sc.DisplayLabel LIKE '%' || ? || '%' ESCAPE '\\\\'\n        UNION ALL\n        SELECT\n          c.ClassName AS CategoryClass,\n          c.ECInstanceId AS CategoryId,\n          CAST(NULL AS TEXT) AS SubcategoryClass,\n          CAST(NULL AS TEXT) AS SubcategoryId\n        FROM RootCategoriesWithLabels c\n        WHERE c.DisplayLabel LIKE '%' || ? || '%' ESCAPE '\\\\'\n        )\n        LIMIT ${MAX_FILTERING_INSTANCE_KEY_COUNT + 1}\n      `,\n      bindings: [\n        { type: \"string\", value: adjustedLabel },\n        { type: \"string\", value: adjustedLabel },\n      ],\n    },\n    { restartToken: \"tree-widget/categories-tree/filter-by-label-query\" },\n  );\n  const paths: HierarchyFilteringPath[] = [];\n  for await (const row of reader) {\n    const path = { path: [{ className: row.CategoryClass, id: row.CategoryId }], options: { autoExpand: true } };\n    row.SubcategoryId && path.path.push({ className: row.SubcategoryClass, id: row.SubcategoryId });\n    paths.push(path);\n  }\n  if (paths.length > MAX_FILTERING_INSTANCE_KEY_COUNT) {\n    throw new FilterLimitExceededError(MAX_FILTERING_INSTANCE_KEY_COUNT);\n  }\n  return paths;\n}\n"]}

package/lib/esm/components/trees/categories-tree/CategoriesVisibilityHandler.d.ts

@@ -1,7 +1,7 @@
 import { BeEvent } from "@itwin/core-bentley";
 import { HierarchyNode } from "@itwin/presentation-hierarchies";
 import type { Viewport } from "@itwin/core-frontend";
-import type { HierarchyVisibilityHandler, VisibilityStatus } from "../common/UseHierarchyVisibility";
+import type { HierarchyVisibilityHandler, VisibilityStatus } from "../common/UseHierarchyVisibility.js";
 interface CategoriesVisibilityHandlerProps {
     viewport: Viewport;
 }

package/lib/esm/components/trees/categories-tree/CategoriesVisibilityHandler.js

@@ -4,8 +4,8 @@
  *--------------------------------------------------------------------------------------------*/
 import { BeEvent } from "@itwin/core-bentley";
 import { HierarchyNode } from "@itwin/presentation-hierarchies";
-import { enableCategoryDisplay, enableSubCategoryDisplay } from "../common/CategoriesVisibilityUtils";
-import { createVisibilityStatus } from "../common/Tooltip";
+import { enableCategoryDisplay, enableSubCategoryDisplay } from "../common/CategoriesVisibilityUtils.js";
+import { createVisibilityStatus } from "../common/Tooltip.js";
 /** @internal */
 export class CategoriesVisibilityHandler {
     constructor(props) {
@@ -75,7 +75,7 @@ export class CategoriesVisibilityHandler {
         }, 0);
     }
     static getInstanceIdFromHierarchyNode(node) {
-        return HierarchyNode.isInstancesNode(node) && node.key.instanceKeys.length > 0 ? node.key.instanceKeys[0].id : /* istanbul ignore next */ "";
+        return HierarchyNode.isInstancesNode(node) && node.key.instanceKeys.length > 0 ? node.key.instanceKeys[0].id : "";
     }
     async enableCategory(ids, enabled, enableAllSubCategories = true) {
         await enableCategoryDisplay(this._viewport, ids, enabled, enableAllSubCategories);

package/lib/esm/components/trees/categories-tree/CategoriesVisibilityHandler.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategoriesVisibilityHandler.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesVisibilityHandler.ts"],"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 { BeEvent } from \"@itwin/core-bentley\";\nimport { HierarchyNode } from \"@itwin/presentation-hierarchies\";\nimport { enableCategoryDisplay, enableSubCategoryDisplay } from \"../common/CategoriesVisibilityUtils\";\nimport { createVisibilityStatus } from \"../common/Tooltip\";\n\nimport type { Viewport } from \"@itwin/core-frontend\";\nimport type { HierarchyVisibilityHandler, VisibilityStatus } from \"../common/UseHierarchyVisibility\";\n\ninterface CategoriesVisibilityHandlerProps {\n  viewport: Viewport;\n}\n\n/** @internal */\nexport class CategoriesVisibilityHandler implements HierarchyVisibilityHandler {\n  private _pendingVisibilityChange: any;\n  private _viewport: Viewport;\n\n  constructor(props: CategoriesVisibilityHandlerProps) {\n    this._viewport = props.viewport;\n    this._viewport.onDisplayStyleChanged.addListener(this.onDisplayStyleChanged);\n    this._viewport.onViewedCategoriesChanged.addListener(this.onViewedCategoriesChanged);\n  }\n\n  public dispose() {\n    this._viewport.onDisplayStyleChanged.removeListener(this.onDisplayStyleChanged);\n    this._viewport.onViewedCategoriesChanged.removeListener(this.onViewedCategoriesChanged);\n    clearTimeout(this._pendingVisibilityChange);\n  }\n\n  public onVisibilityChange = new BeEvent();\n\n  /** Returns visibility status of the tree node. */\n  public getVisibilityStatus(node: HierarchyNode): Promise<VisibilityStatus> | VisibilityStatus {\n    if (!HierarchyNode.isInstancesNode(node)) {\n      return { state: \"hidden\", isDisabled: true };\n    }\n    return createVisibilityStatus(node.parentKeys.length ? this.getSubCategoryVisibility(node) : this.getCategoryVisibility(node));\n  }\n\n  public async changeVisibility(node: HierarchyNode, on: boolean) {\n    if (!HierarchyNode.isInstancesNode(node)) {\n      return;\n    }\n\n    // handle subcategory visibility change\n    if (node.parentKeys.length) {\n      const childId = CategoriesVisibilityHandler.getInstanceIdFromHierarchyNode(node);\n      const parentCategoryId = node.extendedData?.categoryId;\n\n      // make sure parent category is enabled\n      if (on && parentCategoryId) {\n        await this.enableCategory([parentCategoryId], true, false);\n      }\n\n      this.enableSubCategory(childId, on);\n      return;\n    }\n\n    const instanceId = CategoriesVisibilityHandler.getInstanceIdFromHierarchyNode(node);\n    await this.enableCategory([instanceId], on, true);\n  }\n\n  public getSubCategoryVisibility(node: HierarchyNode) {\n    const parentCategoryId = node.extendedData?.categoryId;\n    if (!parentCategoryId) {\n      return \"hidden\";\n    }\n\n    const subcategoryId = CategoriesVisibilityHandler.getInstanceIdFromHierarchyNode(node);\n    const isVisible = this._viewport.view.viewsCategory(parentCategoryId) && this._viewport.isSubCategoryVisible(subcategoryId);\n    return isVisible ? \"visible\" : \"hidden\";\n  }\n\n  public getCategoryVisibility(node: HierarchyNode) {\n    const instanceId = CategoriesVisibilityHandler.getInstanceIdFromHierarchyNode(node);\n    return this._viewport.view.viewsCategory(instanceId) ? \"visible\" : \"hidden\";\n  }\n\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  private onDisplayStyleChanged = () => {\n    this.onVisibilityChangeInternal();\n  };\n\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  private onViewedCategoriesChanged = () => {\n    this.onVisibilityChangeInternal();\n  };\n\n  private onVisibilityChangeInternal() {\n    if (this._pendingVisibilityChange) {\n      return;\n    }\n\n    this._pendingVisibilityChange = setTimeout(() => {\n      this.onVisibilityChange.raiseEvent();\n      this._pendingVisibilityChange = undefined;\n    }, 0);\n  }\n\n  public static getInstanceIdFromHierarchyNode(node: HierarchyNode) {\n    return HierarchyNode.isInstancesNode(node) && node.key.instanceKeys.length > 0 ? node.key.instanceKeys[0].id : /* istanbul ignore next */ \"\";\n  }\n\n  public async enableCategory(ids: string[], enabled: boolean, enableAllSubCategories = true) {\n    await enableCategoryDisplay(this._viewport, ids, enabled, enableAllSubCategories);\n  }\n\n  public enableSubCategory(key: string, enabled: boolean) {\n    enableSubCategoryDisplay(this._viewport, key, enabled);\n  }\n}\n"]}
+{"version":3,"file":"CategoriesVisibilityHandler.js","sourceRoot":"","sources":["../../../../../src/components/trees/categories-tree/CategoriesVisibilityHandler.ts"],"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 { BeEvent } from \"@itwin/core-bentley\";\nimport { HierarchyNode } from \"@itwin/presentation-hierarchies\";\nimport { enableCategoryDisplay, enableSubCategoryDisplay } from \"../common/CategoriesVisibilityUtils.js\";\nimport { createVisibilityStatus } from \"../common/Tooltip.js\";\n\nimport type { Viewport } from \"@itwin/core-frontend\";\nimport type { HierarchyVisibilityHandler, VisibilityStatus } from \"../common/UseHierarchyVisibility.js\";\n\ninterface CategoriesVisibilityHandlerProps {\n  viewport: Viewport;\n}\n\n/** @internal */\nexport class CategoriesVisibilityHandler implements HierarchyVisibilityHandler {\n  private _pendingVisibilityChange: any;\n  private _viewport: Viewport;\n\n  constructor(props: CategoriesVisibilityHandlerProps) {\n    this._viewport = props.viewport;\n    this._viewport.onDisplayStyleChanged.addListener(this.onDisplayStyleChanged);\n    this._viewport.onViewedCategoriesChanged.addListener(this.onViewedCategoriesChanged);\n  }\n\n  public dispose() {\n    this._viewport.onDisplayStyleChanged.removeListener(this.onDisplayStyleChanged);\n    this._viewport.onViewedCategoriesChanged.removeListener(this.onViewedCategoriesChanged);\n    clearTimeout(this._pendingVisibilityChange);\n  }\n\n  public onVisibilityChange = new BeEvent();\n\n  /** Returns visibility status of the tree node. */\n  public getVisibilityStatus(node: HierarchyNode): Promise<VisibilityStatus> | VisibilityStatus {\n    if (!HierarchyNode.isInstancesNode(node)) {\n      return { state: \"hidden\", isDisabled: true };\n    }\n    return createVisibilityStatus(node.parentKeys.length ? this.getSubCategoryVisibility(node) : this.getCategoryVisibility(node));\n  }\n\n  public async changeVisibility(node: HierarchyNode, on: boolean) {\n    if (!HierarchyNode.isInstancesNode(node)) {\n      return;\n    }\n\n    // handle subcategory visibility change\n    if (node.parentKeys.length) {\n      const childId = CategoriesVisibilityHandler.getInstanceIdFromHierarchyNode(node);\n      const parentCategoryId = node.extendedData?.categoryId;\n\n      // make sure parent category is enabled\n      if (on && parentCategoryId) {\n        await this.enableCategory([parentCategoryId], true, false);\n      }\n\n      this.enableSubCategory(childId, on);\n      return;\n    }\n\n    const instanceId = CategoriesVisibilityHandler.getInstanceIdFromHierarchyNode(node);\n    await this.enableCategory([instanceId], on, true);\n  }\n\n  public getSubCategoryVisibility(node: HierarchyNode) {\n    const parentCategoryId = node.extendedData?.categoryId;\n    if (!parentCategoryId) {\n      return \"hidden\";\n    }\n\n    const subcategoryId = CategoriesVisibilityHandler.getInstanceIdFromHierarchyNode(node);\n    const isVisible = this._viewport.view.viewsCategory(parentCategoryId) && this._viewport.isSubCategoryVisible(subcategoryId);\n    return isVisible ? \"visible\" : \"hidden\";\n  }\n\n  public getCategoryVisibility(node: HierarchyNode) {\n    const instanceId = CategoriesVisibilityHandler.getInstanceIdFromHierarchyNode(node);\n    return this._viewport.view.viewsCategory(instanceId) ? \"visible\" : \"hidden\";\n  }\n\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  private onDisplayStyleChanged = () => {\n    this.onVisibilityChangeInternal();\n  };\n\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  private onViewedCategoriesChanged = () => {\n    this.onVisibilityChangeInternal();\n  };\n\n  private onVisibilityChangeInternal() {\n    if (this._pendingVisibilityChange) {\n      return;\n    }\n\n    this._pendingVisibilityChange = setTimeout(() => {\n      this.onVisibilityChange.raiseEvent();\n      this._pendingVisibilityChange = undefined;\n    }, 0);\n  }\n\n  public static getInstanceIdFromHierarchyNode(node: HierarchyNode) {\n    return HierarchyNode.isInstancesNode(node) && node.key.instanceKeys.length > 0 ? node.key.instanceKeys[0].id : \"\";\n  }\n\n  public async enableCategory(ids: string[], enabled: boolean, enableAllSubCategories = true) {\n    await enableCategoryDisplay(this._viewport, ids, enabled, enableAllSubCategories);\n  }\n\n  public enableSubCategory(key: string, enabled: boolean) {\n    enableSubCategoryDisplay(this._viewport, key, enabled);\n  }\n}\n"]}

package/lib/esm/components/trees/categories-tree/UseCategoriesTree.d.ts

@@ -1,7 +1,7 @@
-import type { VisibilityTreeProps } from "../common/components/VisibilityTree";
+import type { VisibilityTreeProps } from "../common/components/VisibilityTree.js";
 import type { Viewport } from "@itwin/core-frontend";
-import type { VisibilityTreeRendererProps } from "../common/components/VisibilityTreeRenderer";
-import type { CategoryInfo } from "../common/CategoriesVisibilityUtils";
+import type { VisibilityTreeRendererProps } from "../common/components/VisibilityTreeRenderer.js";
+import type { CategoryInfo } from "../common/CategoriesVisibilityUtils.js";
 /** @beta */
 export interface UseCategoriesTreeProps {
     filter: string;

package/lib/esm/components/trees/categories-tree/UseCategoriesTree.js

@@ -7,11 +7,11 @@ import { useCallback, useMemo, useState } from "react";
 import { SvgLayers } from "@itwin/itwinui-icons-react";
 import { Text } from "@itwin/itwinui-react";
 import { HierarchyNodeIdentifier } from "@itwin/presentation-hierarchies";
-import { TreeWidget } from "../../../TreeWidget";
-import { FilterLimitExceededError } from "../common/TreeErrors";
-import { useTelemetryContext } from "../common/UseTelemetryContext";
-import { CategoriesTreeDefinition } from "./CategoriesTreeDefinition";
-import { CategoriesVisibilityHandler } from "./CategoriesVisibilityHandler";
+import { TreeWidget } from "../../../TreeWidget.js";
+import { FilterLimitExceededError } from "../common/TreeErrors.js";
+import { useTelemetryContext } from "../common/UseTelemetryContext.js";
+import { CategoriesTreeDefinition } from "./CategoriesTreeDefinition.js";
+import { CategoriesVisibilityHandler } from "./CategoriesVisibilityHandler.js";
 /**
  * Custom hook to create and manage state for the categories tree.
  * @beta