@itwin/appui-react 4.0.0-dev.2 → 4.0.0-dev.3

package/lib/esm/appui-react/widgets/BasicToolWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"BasicToolWidget.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BasicToolWidget.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/** @packageDocumentation\n * @module Widget\n */\n\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { CommonToolbarItem, ToolbarOrientation, ToolbarUsage } from \"@itwin/appui-abstract\";\nimport { CoreTools } from \"../tools/CoreToolDefinitions\";\nimport { SelectionContextToolDefinitions } from \"../selection/SelectionContextItemDef\";\nimport { ToolbarComposer } from \"../toolbar/ToolbarComposer\";\nimport { ToolbarHelper } from \"../toolbar/ToolbarHelper\";\nimport { ToolWidgetComposer } from \"./ToolWidgetComposer\";\nimport { BackstageAppButton } from \"./BackstageAppButton\";\nimport { useUiVisibility } from \"../hooks/useUiVisibility\";\n\n/** Properties that can be used to append items to the default set of toolbar items of [[ReviewToolWidget]].\n * @public\n */\nexport interface BasicToolWidgetProps {\n  /** if true include hide/isolate Models and Categories */\n  showCategoryAndModelsContextTools?: boolean;\n  /** Name of icon WebFont entry or if specifying an imported SVG symbol use \"webSvg:\" prefix to imported symbol Id. */\n  icon?: string;\n  /** optional set of additional items to include in horizontal toolbar */\n  additionalHorizontalItems?: CommonToolbarItem[];\n  /** optional set of additional items to include in vertical toolbar */\n  additionalVerticalItems?: CommonToolbarItem[];\n}\n\n/** Default Tool Widget for standard \"review\" applications. Provides standard tools to review, and measure elements.\n * This definition will also show a overflow button if there is not enough room to display all the toolbar buttons.\n * @public\n */\nexport function BasicToolWidget(props: BasicToolWidgetProps) {\n  const getHorizontalToolbarItems = React.useCallback(\n    (useCategoryAndModelsContextTools: boolean): CommonToolbarItem[] => {\n      const items: CommonToolbarItem[] = [];\n      if (useCategoryAndModelsContextTools) {\n        items.push(\n          ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.clearSelectionItemDef),\n          ToolbarHelper.createToolbarItemFromItemDef(20, SelectionContextToolDefinitions.clearHideIsolateEmphasizeElementsItemDef),\n          ToolbarHelper.createToolbarItemFromItemDef(30, SelectionContextToolDefinitions.hideSectionToolGroup),\n          ToolbarHelper.createToolbarItemFromItemDef(40, SelectionContextToolDefinitions.isolateSelectionToolGroup),\n          ToolbarHelper.createToolbarItemFromItemDef(50, SelectionContextToolDefinitions.emphasizeElementsItemDef),\n        );\n      } else {\n        items.push(\n          ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.clearSelectionItemDef),\n          ToolbarHelper.createToolbarItemFromItemDef(20, SelectionContextToolDefinitions.clearHideIsolateEmphasizeElementsItemDef),\n          ToolbarHelper.createToolbarItemFromItemDef(30, SelectionContextToolDefinitions.hideElementsItemDef),\n          ToolbarHelper.createToolbarItemFromItemDef(40, SelectionContextToolDefinitions.isolateElementsItemDef),\n          ToolbarHelper.createToolbarItemFromItemDef(50, SelectionContextToolDefinitions.emphasizeElementsItemDef),\n        );\n      }\n      if (props.additionalHorizontalItems)\n        items.push(...props.additionalHorizontalItems);\n      return items;\n    }, [props.additionalHorizontalItems]);\n\n  const getVerticalToolbarItems = React.useCallback(\n    (): CommonToolbarItem[] => {\n      const items: CommonToolbarItem[] = [];\n      items.push(\n        ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.selectElementCommand),\n        ToolbarHelper.createToolbarItemFromItemDef(20, CoreTools.measureToolGroup),\n        ToolbarHelper.createToolbarItemFromItemDef(30, CoreTools.sectionToolGroup),\n      );\n      if (props.additionalVerticalItems)\n        items.push(...props.additionalVerticalItems);\n      return items;\n    }, [props.additionalVerticalItems]);\n\n  const [horizontalItems, setHorizontalItems] = React.useState(() => getHorizontalToolbarItems(!!props.showCategoryAndModelsContextTools));\n  const [verticalItems, setVerticalItems] = React.useState(() => getVerticalToolbarItems());\n\n  const isInitialMount = React.useRef(true);\n  React.useEffect(() => {\n    if (isInitialMount.current)\n      isInitialMount.current = false;\n    else {\n      setHorizontalItems(getHorizontalToolbarItems(!!props.showCategoryAndModelsContextTools));\n      setVerticalItems(getVerticalToolbarItems());\n    }\n  }, [props.showCategoryAndModelsContextTools, props.additionalHorizontalItems, props.additionalVerticalItems, getHorizontalToolbarItems, getVerticalToolbarItems]);\n\n  const uiIsVisible = useUiVisibility();\n  // istanbul ignore next\n  const className = classnames(\n    !uiIsVisible && \"nz-hidden\",\n  );\n  return (\n    <ToolWidgetComposer className={className}\n      cornerItem={<BackstageAppButton icon={props.icon} />}\n      horizontalToolbar={<ToolbarComposer items={horizontalItems} usage={ToolbarUsage.ContentManipulation} orientation={ToolbarOrientation.Horizontal} />}\n      verticalToolbar={<ToolbarComposer items={verticalItems} usage={ToolbarUsage.ContentManipulation} orientation={ToolbarOrientation.Vertical} />}\n    />\n  );\n}\n"]}
+{"version":3,"file":"BasicToolWidget.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BasicToolWidget.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Widget\r\n */\r\n\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { CommonToolbarItem, ToolbarOrientation, ToolbarUsage } from \"@itwin/appui-abstract\";\r\nimport { CoreTools } from \"../tools/CoreToolDefinitions\";\r\nimport { SelectionContextToolDefinitions } from \"../selection/SelectionContextItemDef\";\r\nimport { ToolbarComposer } from \"../toolbar/ToolbarComposer\";\r\nimport { ToolbarHelper } from \"../toolbar/ToolbarHelper\";\r\nimport { ToolWidgetComposer } from \"./ToolWidgetComposer\";\r\nimport { BackstageAppButton } from \"./BackstageAppButton\";\r\nimport { useUiVisibility } from \"../hooks/useUiVisibility\";\r\n\r\n/** Properties that can be used to append items to the default set of toolbar items of [[ReviewToolWidget]].\r\n * @public\r\n */\r\nexport interface BasicToolWidgetProps {\r\n  /** if true include hide/isolate Models and Categories */\r\n  showCategoryAndModelsContextTools?: boolean;\r\n  /** Name of icon WebFont entry or if specifying an imported SVG symbol use \"webSvg:\" prefix to imported symbol Id. */\r\n  icon?: string;\r\n  /** optional set of additional items to include in horizontal toolbar */\r\n  additionalHorizontalItems?: CommonToolbarItem[];\r\n  /** optional set of additional items to include in vertical toolbar */\r\n  additionalVerticalItems?: CommonToolbarItem[];\r\n}\r\n\r\n/** Default Tool Widget for standard \"review\" applications. Provides standard tools to review, and measure elements.\r\n * This definition will also show a overflow button if there is not enough room to display all the toolbar buttons.\r\n * @public\r\n */\r\nexport function BasicToolWidget(props: BasicToolWidgetProps) {\r\n  const getHorizontalToolbarItems = React.useCallback(\r\n    (useCategoryAndModelsContextTools: boolean): CommonToolbarItem[] => {\r\n      const items: CommonToolbarItem[] = [];\r\n      if (useCategoryAndModelsContextTools) {\r\n        items.push(\r\n          ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.clearSelectionItemDef),\r\n          ToolbarHelper.createToolbarItemFromItemDef(20, SelectionContextToolDefinitions.clearHideIsolateEmphasizeElementsItemDef),\r\n          ToolbarHelper.createToolbarItemFromItemDef(30, SelectionContextToolDefinitions.hideSectionToolGroup),\r\n          ToolbarHelper.createToolbarItemFromItemDef(40, SelectionContextToolDefinitions.isolateSelectionToolGroup),\r\n          ToolbarHelper.createToolbarItemFromItemDef(50, SelectionContextToolDefinitions.emphasizeElementsItemDef),\r\n        );\r\n      } else {\r\n        items.push(\r\n          ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.clearSelectionItemDef),\r\n          ToolbarHelper.createToolbarItemFromItemDef(20, SelectionContextToolDefinitions.clearHideIsolateEmphasizeElementsItemDef),\r\n          ToolbarHelper.createToolbarItemFromItemDef(30, SelectionContextToolDefinitions.hideElementsItemDef),\r\n          ToolbarHelper.createToolbarItemFromItemDef(40, SelectionContextToolDefinitions.isolateElementsItemDef),\r\n          ToolbarHelper.createToolbarItemFromItemDef(50, SelectionContextToolDefinitions.emphasizeElementsItemDef),\r\n        );\r\n      }\r\n      if (props.additionalHorizontalItems)\r\n        items.push(...props.additionalHorizontalItems);\r\n      return items;\r\n    }, [props.additionalHorizontalItems]);\r\n\r\n  const getVerticalToolbarItems = React.useCallback(\r\n    (): CommonToolbarItem[] => {\r\n      const items: CommonToolbarItem[] = [];\r\n      items.push(\r\n        ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.selectElementCommand),\r\n        ToolbarHelper.createToolbarItemFromItemDef(20, CoreTools.measureToolGroup),\r\n        ToolbarHelper.createToolbarItemFromItemDef(30, CoreTools.sectionToolGroup),\r\n      );\r\n      if (props.additionalVerticalItems)\r\n        items.push(...props.additionalVerticalItems);\r\n      return items;\r\n    }, [props.additionalVerticalItems]);\r\n\r\n  const [horizontalItems, setHorizontalItems] = React.useState(() => getHorizontalToolbarItems(!!props.showCategoryAndModelsContextTools));\r\n  const [verticalItems, setVerticalItems] = React.useState(() => getVerticalToolbarItems());\r\n\r\n  const isInitialMount = React.useRef(true);\r\n  React.useEffect(() => {\r\n    if (isInitialMount.current)\r\n      isInitialMount.current = false;\r\n    else {\r\n      setHorizontalItems(getHorizontalToolbarItems(!!props.showCategoryAndModelsContextTools));\r\n      setVerticalItems(getVerticalToolbarItems());\r\n    }\r\n  }, [props.showCategoryAndModelsContextTools, props.additionalHorizontalItems, props.additionalVerticalItems, getHorizontalToolbarItems, getVerticalToolbarItems]);\r\n\r\n  const uiIsVisible = useUiVisibility();\r\n  // istanbul ignore next\r\n  const className = classnames(\r\n    !uiIsVisible && \"nz-hidden\",\r\n  );\r\n  return (\r\n    <ToolWidgetComposer className={className}\r\n      cornerItem={<BackstageAppButton icon={props.icon} />}\r\n      horizontalToolbar={<ToolbarComposer items={horizontalItems} usage={ToolbarUsage.ContentManipulation} orientation={ToolbarOrientation.Horizontal} />}\r\n      verticalToolbar={<ToolbarComposer items={verticalItems} usage={ToolbarUsage.ContentManipulation} orientation={ToolbarOrientation.Vertical} />}\r\n    />\r\n  );\r\n}\r\n"]}

package/lib/esm/appui-react/widgets/ContentToolWidgetComposer.d.ts

@@ -1,38 +1,38 @@
-/** @packageDocumentation
- * @module Widget
- */
-import * as React from "react";
-/**
- * Props for [[ContentToolWidgetComposer]].
- * @public
- */
-export interface ContentToolWidgetComposerProps {
-    /** If default backstage button is desired use <BackstageAppButton />. */
-    cornerButton?: React.ReactNode;
-}
-/**
- * ContentToolWidgetComposer composes a Tool Widget with no tools defined by default. UiItemsProviders
- * are used to populate the toolbars. See [[StandardContentToolsProvider]].
- * @example
- * ToolWidget with no corner button
- * ```
- * <ContentToolWidgetComposer />
- * ```
- * ToolWidget with corner button
- * ```
- * const cornerButton = <BackstageAppButton icon={"icon-bentley-systems"} />;
- * <ContentToolWidgetComposer cornerButton={cornerButton} />
- * ```
- * ToolWidget with custom corner button
- * ```
- * const cornerButton = <BackstageAppButton icon={"icon-bentley-systems"}
- *   label="Toggle Backstage display",
- *   execute={() => BackstageManager.getBackstageToggleCommand().execute()} />;
- * <ContentToolWidgetComposer cornerButton={cornerButton} />
- * ```
- *
- * BackstageCornerButton,
- * @public
- */
-export declare function ContentToolWidgetComposer(props: ContentToolWidgetComposerProps): JSX.Element;
+/** @packageDocumentation
+ * @module Widget
+ */
+import * as React from "react";
+/**
+ * Props for [[ContentToolWidgetComposer]].
+ * @public
+ */
+export interface ContentToolWidgetComposerProps {
+    /** If default backstage button is desired use <BackstageAppButton />. */
+    cornerButton?: React.ReactNode;
+}
+/**
+ * ContentToolWidgetComposer composes a Tool Widget with no tools defined by default. UiItemsProviders
+ * are used to populate the toolbars. See [[StandardContentToolsProvider]].
+ * @example
+ * ToolWidget with no corner button
+ * ```
+ * <ContentToolWidgetComposer />
+ * ```
+ * ToolWidget with corner button
+ * ```
+ * const cornerButton = <BackstageAppButton icon={"icon-bentley-systems"} />;
+ * <ContentToolWidgetComposer cornerButton={cornerButton} />
+ * ```
+ * ToolWidget with custom corner button
+ * ```
+ * const cornerButton = <BackstageAppButton icon={"icon-bentley-systems"}
+ *   label="Toggle Backstage display",
+ *   execute={() => BackstageManager.getBackstageToggleCommand().execute()} />;
+ * <ContentToolWidgetComposer cornerButton={cornerButton} />
+ * ```
+ *
+ * BackstageCornerButton,
+ * @public
+ */
+export declare function ContentToolWidgetComposer(props: ContentToolWidgetComposerProps): JSX.Element;
 //# sourceMappingURL=ContentToolWidgetComposer.d.ts.map

package/lib/esm/appui-react/widgets/ContentToolWidgetComposer.js

@@ -1,45 +1,45 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Widget
- */
-import classnames from "classnames";
-import * as React from "react";
-import { ToolbarOrientation, ToolbarUsage } from "@itwin/appui-abstract";
-import { ToolbarComposer } from "../toolbar/ToolbarComposer";
-import { ToolWidgetComposer } from "./ToolWidgetComposer";
-import { useUiVisibility } from "../hooks/useUiVisibility";
-/**
- * ContentToolWidgetComposer composes a Tool Widget with no tools defined by default. UiItemsProviders
- * are used to populate the toolbars. See [[StandardContentToolsProvider]].
- * @example
- * ToolWidget with no corner button
- * ```
- * <ContentToolWidgetComposer />
- * ```
- * ToolWidget with corner button
- * ```
- * const cornerButton = <BackstageAppButton icon={"icon-bentley-systems"} />;
- * <ContentToolWidgetComposer cornerButton={cornerButton} />
- * ```
- * ToolWidget with custom corner button
- * ```
- * const cornerButton = <BackstageAppButton icon={"icon-bentley-systems"}
- *   label="Toggle Backstage display",
- *   execute={() => BackstageManager.getBackstageToggleCommand().execute()} />;
- * <ContentToolWidgetComposer cornerButton={cornerButton} />
- * ```
- *
- * BackstageCornerButton,
- * @public
- */
-export function ContentToolWidgetComposer(props) {
-    const { cornerButton } = props;
-    const uiIsVisible = useUiVisibility();
-    // istanbul ignore next
-    const className = classnames(!uiIsVisible && "nz-hidden");
-    return (React.createElement(ToolWidgetComposer, { className: className, cornerItem: cornerButton, horizontalToolbar: React.createElement(ToolbarComposer, { items: [], usage: ToolbarUsage.ContentManipulation, orientation: ToolbarOrientation.Horizontal }), verticalToolbar: React.createElement(ToolbarComposer, { items: [], usage: ToolbarUsage.ContentManipulation, orientation: ToolbarOrientation.Vertical }) }));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Widget
+ */
+import classnames from "classnames";
+import * as React from "react";
+import { ToolbarOrientation, ToolbarUsage } from "@itwin/appui-abstract";
+import { ToolbarComposer } from "../toolbar/ToolbarComposer";
+import { ToolWidgetComposer } from "./ToolWidgetComposer";
+import { useUiVisibility } from "../hooks/useUiVisibility";
+/**
+ * ContentToolWidgetComposer composes a Tool Widget with no tools defined by default. UiItemsProviders
+ * are used to populate the toolbars. See [[StandardContentToolsProvider]].
+ * @example
+ * ToolWidget with no corner button
+ * ```
+ * <ContentToolWidgetComposer />
+ * ```
+ * ToolWidget with corner button
+ * ```
+ * const cornerButton = <BackstageAppButton icon={"icon-bentley-systems"} />;
+ * <ContentToolWidgetComposer cornerButton={cornerButton} />
+ * ```
+ * ToolWidget with custom corner button
+ * ```
+ * const cornerButton = <BackstageAppButton icon={"icon-bentley-systems"}
+ *   label="Toggle Backstage display",
+ *   execute={() => BackstageManager.getBackstageToggleCommand().execute()} />;
+ * <ContentToolWidgetComposer cornerButton={cornerButton} />
+ * ```
+ *
+ * BackstageCornerButton,
+ * @public
+ */
+export function ContentToolWidgetComposer(props) {
+    const { cornerButton } = props;
+    const uiIsVisible = useUiVisibility();
+    // istanbul ignore next
+    const className = classnames(!uiIsVisible && "nz-hidden");
+    return (React.createElement(ToolWidgetComposer, { className: className, cornerItem: cornerButton, horizontalToolbar: React.createElement(ToolbarComposer, { items: [], usage: ToolbarUsage.ContentManipulation, orientation: ToolbarOrientation.Horizontal }), verticalToolbar: React.createElement(ToolbarComposer, { items: [], usage: ToolbarUsage.ContentManipulation, orientation: ToolbarOrientation.Vertical }) }));
+}
 //# sourceMappingURL=ContentToolWidgetComposer.js.map

package/lib/esm/appui-react/widgets/ContentToolWidgetComposer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContentToolWidgetComposer.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/ContentToolWidgetComposer.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAW3D;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,UAAU,yBAAyB,CAAC,KAAqC;IAC7E,MAAM,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC;IAC/B,MAAM,WAAW,GAAG,eAAe,EAAE,CAAC;IACtC,uBAAuB;IACvB,MAAM,SAAS,GAAG,UAAU,CAC1B,CAAC,WAAW,IAAI,WAAW,CAC5B,CAAC;IACF,OAAO,CACL,oBAAC,kBAAkB,IAAC,SAAS,EAAE,SAAS,EACtC,UAAU,EAAE,YAAY,EACxB,iBAAiB,EAAE,oBAAC,eAAe,IAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,YAAY,CAAC,mBAAmB,EAAE,WAAW,EAAE,kBAAkB,CAAC,UAAU,GAAI,EACtI,eAAe,EAAE,oBAAC,eAAe,IAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,YAAY,CAAC,mBAAmB,EAAE,WAAW,EAAE,kBAAkB,CAAC,QAAQ,GAAI,GAClI,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/** @packageDocumentation\n * @module Widget\n */\n\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { ToolbarOrientation, ToolbarUsage } from \"@itwin/appui-abstract\";\nimport { ToolbarComposer } from \"../toolbar/ToolbarComposer\";\nimport { ToolWidgetComposer } from \"./ToolWidgetComposer\";\nimport { useUiVisibility } from \"../hooks/useUiVisibility\";\n\n/**\n * Props for [[ContentToolWidgetComposer]].\n * @public\n */\nexport interface ContentToolWidgetComposerProps {\n  /** If default backstage button is desired use <BackstageAppButton />. */\n  cornerButton?: React.ReactNode;\n}\n\n/**\n * ContentToolWidgetComposer composes a Tool Widget with no tools defined by default. UiItemsProviders\n * are used to populate the toolbars. See [[StandardContentToolsProvider]].\n * @example\n * ToolWidget with no corner button\n * ```\n * <ContentToolWidgetComposer />\n * ```\n * ToolWidget with corner button\n * ```\n * const cornerButton = <BackstageAppButton icon={\"icon-bentley-systems\"} />;\n * <ContentToolWidgetComposer cornerButton={cornerButton} />\n * ```\n * ToolWidget with custom corner button\n * ```\n * const cornerButton = <BackstageAppButton icon={\"icon-bentley-systems\"}\n *   label=\"Toggle Backstage display\",\n *   execute={() => BackstageManager.getBackstageToggleCommand().execute()} />;\n * <ContentToolWidgetComposer cornerButton={cornerButton} />\n * ```\n *\n * BackstageCornerButton,\n * @public\n */\nexport function ContentToolWidgetComposer(props: ContentToolWidgetComposerProps) {\n  const { cornerButton } = props;\n  const uiIsVisible = useUiVisibility();\n  // istanbul ignore next\n  const className = classnames(\n    !uiIsVisible && \"nz-hidden\",\n  );\n  return (\n    <ToolWidgetComposer className={className}\n      cornerItem={cornerButton}\n      horizontalToolbar={<ToolbarComposer items={[]} usage={ToolbarUsage.ContentManipulation} orientation={ToolbarOrientation.Horizontal} />}\n      verticalToolbar={<ToolbarComposer items={[]} usage={ToolbarUsage.ContentManipulation} orientation={ToolbarOrientation.Vertical} />}\n    />\n  );\n}\n"]}
+{"version":3,"file":"ContentToolWidgetComposer.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/ContentToolWidgetComposer.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAW3D;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,UAAU,yBAAyB,CAAC,KAAqC;IAC7E,MAAM,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC;IAC/B,MAAM,WAAW,GAAG,eAAe,EAAE,CAAC;IACtC,uBAAuB;IACvB,MAAM,SAAS,GAAG,UAAU,CAC1B,CAAC,WAAW,IAAI,WAAW,CAC5B,CAAC;IACF,OAAO,CACL,oBAAC,kBAAkB,IAAC,SAAS,EAAE,SAAS,EACtC,UAAU,EAAE,YAAY,EACxB,iBAAiB,EAAE,oBAAC,eAAe,IAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,YAAY,CAAC,mBAAmB,EAAE,WAAW,EAAE,kBAAkB,CAAC,UAAU,GAAI,EACtI,eAAe,EAAE,oBAAC,eAAe,IAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,YAAY,CAAC,mBAAmB,EAAE,WAAW,EAAE,kBAAkB,CAAC,QAAQ,GAAI,GAClI,CACH,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Widget\r\n */\r\n\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { ToolbarOrientation, ToolbarUsage } from \"@itwin/appui-abstract\";\r\nimport { ToolbarComposer } from \"../toolbar/ToolbarComposer\";\r\nimport { ToolWidgetComposer } from \"./ToolWidgetComposer\";\r\nimport { useUiVisibility } from \"../hooks/useUiVisibility\";\r\n\r\n/**\r\n * Props for [[ContentToolWidgetComposer]].\r\n * @public\r\n */\r\nexport interface ContentToolWidgetComposerProps {\r\n  /** If default backstage button is desired use <BackstageAppButton />. */\r\n  cornerButton?: React.ReactNode;\r\n}\r\n\r\n/**\r\n * ContentToolWidgetComposer composes a Tool Widget with no tools defined by default. UiItemsProviders\r\n * are used to populate the toolbars. See [[StandardContentToolsProvider]].\r\n * @example\r\n * ToolWidget with no corner button\r\n * ```\r\n * <ContentToolWidgetComposer />\r\n * ```\r\n * ToolWidget with corner button\r\n * ```\r\n * const cornerButton = <BackstageAppButton icon={\"icon-bentley-systems\"} />;\r\n * <ContentToolWidgetComposer cornerButton={cornerButton} />\r\n * ```\r\n * ToolWidget with custom corner button\r\n * ```\r\n * const cornerButton = <BackstageAppButton icon={\"icon-bentley-systems\"}\r\n *   label=\"Toggle Backstage display\",\r\n *   execute={() => BackstageManager.getBackstageToggleCommand().execute()} />;\r\n * <ContentToolWidgetComposer cornerButton={cornerButton} />\r\n * ```\r\n *\r\n * BackstageCornerButton,\r\n * @public\r\n */\r\nexport function ContentToolWidgetComposer(props: ContentToolWidgetComposerProps) {\r\n  const { cornerButton } = props;\r\n  const uiIsVisible = useUiVisibility();\r\n  // istanbul ignore next\r\n  const className = classnames(\r\n    !uiIsVisible && \"nz-hidden\",\r\n  );\r\n  return (\r\n    <ToolWidgetComposer className={className}\r\n      cornerItem={cornerButton}\r\n      horizontalToolbar={<ToolbarComposer items={[]} usage={ToolbarUsage.ContentManipulation} orientation={ToolbarOrientation.Horizontal} />}\r\n      verticalToolbar={<ToolbarComposer items={[]} usage={ToolbarUsage.ContentManipulation} orientation={ToolbarOrientation.Vertical} />}\r\n    />\r\n  );\r\n}\r\n"]}

package/lib/esm/appui-react/widgets/NavigationWidgetComposer.d.ts

@@ -1,39 +1,39 @@
-/** @packageDocumentation
- * @module Widget
- */
-import * as React from "react";
-import { CommonProps } from "@itwin/core-react";
-/** Properties for the [[NavigationAidHost]] React component
- * @public
- */
-export interface NavigationAidHostProps {
-    /** Navigation Aid Host minimum width. Defaults to "64px". */
-    minWidth?: string;
-    /** Navigation Aid Host minimum height. Defaults to "64px". */
-    minHeight?: string;
-}
-/**
- * NavigationAidHost is a component that hosts a NavigationAid that is specific to the active content control.
- * @public
- */
-export declare function NavigationAidHost(props: NavigationAidHostProps): JSX.Element;
-/** Properties for the [[NavigationWidgetComposer]] React components
- * @public
- */
-export interface NavigationWidgetComposerProps extends CommonProps {
-    /** Optional Horizontal Toolbar */
-    horizontalToolbar?: React.ReactNode;
-    /** Optional Vertical Toolbar */
-    verticalToolbar?: React.ReactNode;
-    /** Optional Navigation Aid host. If not specified a default host is provided which will use registered Navigation Aids and the active content control to determine which if any Navigation Aid to display. */
-    navigationAidHost?: React.ReactNode;
-    /** If true no navigation aid will be shown. Defaults to false. */
-    hideNavigationAid?: boolean;
-}
-/**
- * Component that Composes a NavigationWidget typically using toolbars generated via [[ToolbarComposer]] class. The Navigation widget is shown in the top right of the content area
- * and typically holds tools to visually navigate, orient, and zoom to specific content.
- * @public
- */
-export declare function NavigationWidgetComposer(props: NavigationWidgetComposerProps): JSX.Element;
+/** @packageDocumentation
+ * @module Widget
+ */
+import * as React from "react";
+import { CommonProps } from "@itwin/core-react";
+/** Properties for the [[NavigationAidHost]] React component
+ * @public
+ */
+export interface NavigationAidHostProps {
+    /** Navigation Aid Host minimum width. Defaults to "64px". */
+    minWidth?: string;
+    /** Navigation Aid Host minimum height. Defaults to "64px". */
+    minHeight?: string;
+}
+/**
+ * NavigationAidHost is a component that hosts a NavigationAid that is specific to the active content control.
+ * @public
+ */
+export declare function NavigationAidHost(props: NavigationAidHostProps): JSX.Element;
+/** Properties for the [[NavigationWidgetComposer]] React components
+ * @public
+ */
+export interface NavigationWidgetComposerProps extends CommonProps {
+    /** Optional Horizontal Toolbar */
+    horizontalToolbar?: React.ReactNode;
+    /** Optional Vertical Toolbar */
+    verticalToolbar?: React.ReactNode;
+    /** Optional Navigation Aid host. If not specified a default host is provided which will use registered Navigation Aids and the active content control to determine which if any Navigation Aid to display. */
+    navigationAidHost?: React.ReactNode;
+    /** If true no navigation aid will be shown. Defaults to false. */
+    hideNavigationAid?: boolean;
+}
+/**
+ * Component that Composes a NavigationWidget typically using toolbars generated via [[ToolbarComposer]] class. The Navigation widget is shown in the top right of the content area
+ * and typically holds tools to visually navigate, orient, and zoom to specific content.
+ * @public
+ */
+export declare function NavigationWidgetComposer(props: NavigationWidgetComposerProps): JSX.Element;
 //# sourceMappingURL=NavigationWidgetComposer.d.ts.map

package/lib/esm/appui-react/widgets/NavigationWidgetComposer.js

@@ -1,105 +1,105 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Widget
- */
-import * as React from "react";
-import { ViewportComponentEvents } from "@itwin/imodel-components-react";
-import { useProximityToMouse, useWidgetOpacityContext, WidgetElementSet, WidgetOpacityContext } from "@itwin/core-react";
-import { NavigationArea } from "@itwin/appui-layout-react";
-import { ConfigurableUiManager } from "../configurableui/ConfigurableUiManager";
-import { ContentViewManager } from "../content/ContentViewManager";
-import { FrontstageManager } from "../frontstage/FrontstageManager";
-import { UiFramework } from "../UiFramework";
-import { UiShowHideManager } from "../utils/UiShowHideManager";
-function createNavigationAidControl(activeContentControl, navigationAidId, activeViewport) {
-    // istanbul ignore else
-    if (!activeContentControl || !navigationAidId || (activeViewport !== activeContentControl.viewport))
-        return undefined;
-    const viewport = activeContentControl.viewport;
-    const imodel = viewport ? viewport.iModel : /* istanbul ignore next */ UiFramework.getIModelConnection();
-    const navigationAidControl = ConfigurableUiManager.createControl(navigationAidId, navigationAidId, { imodel, viewport });
-    navigationAidControl.initialize();
-    return navigationAidControl;
-}
-/**
- * NavigationAidHost is a component that hosts a NavigationAid that is specific to the active content control.
- * @public
- */
-export function NavigationAidHost(props) {
-    const [activeContentControl, setActiveContentControl] = React.useState(() => ContentViewManager.getActiveContentControl());
-    const [activeContentViewport, setActiveContentViewport] = React.useState(() => /* istanbul ignore next */ activeContentControl === null || activeContentControl === void 0 ? void 0 : activeContentControl.viewport);
-    const [navigationAidId, setNavigationAidId] = React.useState(() => activeContentControl ? activeContentControl.navigationAidControl : /* istanbul ignore next */ "");
-    React.useEffect(() => {
-        // istanbul ignore next
-        const handleContentControlActivated = (args) => {
-            setActiveContentControl(args.activeContentControl);
-            setActiveContentViewport(args.activeContentControl.viewport);
-            setNavigationAidId(args.activeContentControl.navigationAidControl);
-        };
-        FrontstageManager.onContentControlActivatedEvent.addListener(handleContentControlActivated);
-        return () => {
-            FrontstageManager.onContentControlActivatedEvent.removeListener(handleContentControlActivated);
-        };
-    }, []);
-    const [activeViewClass, setActiveViewClass] = React.useState(() => {
-        const content = ContentViewManager.getActiveContentControl();
-        if (content && content.viewport)
-            return content.viewport.view.classFullName;
-        return "";
-    });
-    React.useEffect(() => {
-        // istanbul ignore next
-        const handleViewClassFullNameChange = (args) => {
-            setActiveViewClass(args.newName);
-        };
-        ViewportComponentEvents.onViewClassFullNameChangedEvent.addListener(handleViewClassFullNameChange);
-        return () => {
-            ViewportComponentEvents.onViewClassFullNameChangedEvent.removeListener(handleViewClassFullNameChange);
-        };
-    }, [activeViewClass]);
-    const navigationAidControl = React.useMemo(() => createNavigationAidControl(activeContentControl, navigationAidId, activeContentViewport), [activeContentControl, navigationAidId, activeContentViewport]);
-    const ref = React.useRef(null);
-    const isInitialMount = React.useRef(true);
-    const { onElementRef, proximityScale } = useWidgetOpacityContext();
-    React.useEffect(() => {
-        // istanbul ignore else
-        if (isInitialMount.current) {
-            isInitialMount.current = false;
-            onElementRef(ref);
-        }
-    }, [onElementRef]);
-    const divStyle = {
-        minWidth: props.minWidth ? /* istanbul ignore next */ props.minWidth : "64px",
-        minHeight: props.minHeight ? /* istanbul ignore next */ props.minHeight : "64px",
-    };
-    // istanbul ignore else
-    if (UiShowHideManager.useProximityOpacity && !UiFramework.isMobile()) {
-        const navigationAidOpacity = (0.30 * proximityScale) + 0.70;
-        divStyle.opacity = `${navigationAidOpacity}`;
-    }
-    return (React.createElement("div", { style: divStyle, ref: ref }, navigationAidControl && navigationAidControl.reactNode));
-}
-/**
- * Component that Composes a NavigationWidget typically using toolbars generated via [[ToolbarComposer]] class. The Navigation widget is shown in the top right of the content area
- * and typically holds tools to visually navigate, orient, and zoom to specific content.
- * @public
- */
-export function NavigationWidgetComposer(props) {
-    const { navigationAidHost, horizontalToolbar, verticalToolbar, hideNavigationAid, ...otherProps } = props;
-    const [elementSet] = React.useState(new WidgetElementSet());
-    const handleChildRef = React.useCallback((elementRef) => {
-        elementSet.add(elementRef);
-    }, [elementSet]);
-    const proximityScale = useProximityToMouse(elementSet, UiShowHideManager.snapWidgetOpacity);
-    /* istanbul ignore next */
-    const navigationAid = hideNavigationAid ? undefined : navigationAidHost !== null && navigationAidHost !== void 0 ? navigationAidHost : React.createElement(NavigationAidHost, null);
-    return (React.createElement(WidgetOpacityContext.Provider, { value: {
-            onElementRef: handleChildRef,
-            proximityScale,
-        } },
-        React.createElement(NavigationArea, { navigationAid: navigationAid, horizontalToolbar: horizontalToolbar, verticalToolbar: verticalToolbar, ...otherProps, onMouseEnter: UiShowHideManager.handleWidgetMouseEnter })));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Widget
+ */
+import * as React from "react";
+import { ViewportComponentEvents } from "@itwin/imodel-components-react";
+import { useProximityToMouse, useWidgetOpacityContext, WidgetElementSet, WidgetOpacityContext } from "@itwin/core-react";
+import { NavigationArea } from "@itwin/appui-layout-react";
+import { ConfigurableUiManager } from "../configurableui/ConfigurableUiManager";
+import { ContentViewManager } from "../content/ContentViewManager";
+import { FrontstageManager } from "../frontstage/FrontstageManager";
+import { UiFramework } from "../UiFramework";
+import { UiShowHideManager } from "../utils/UiShowHideManager";
+function createNavigationAidControl(activeContentControl, navigationAidId, activeViewport) {
+    // istanbul ignore else
+    if (!activeContentControl || !navigationAidId || (activeViewport !== activeContentControl.viewport))
+        return undefined;
+    const viewport = activeContentControl.viewport;
+    const imodel = viewport ? viewport.iModel : /* istanbul ignore next */ UiFramework.getIModelConnection();
+    const navigationAidControl = ConfigurableUiManager.createControl(navigationAidId, navigationAidId, { imodel, viewport });
+    navigationAidControl.initialize();
+    return navigationAidControl;
+}
+/**
+ * NavigationAidHost is a component that hosts a NavigationAid that is specific to the active content control.
+ * @public
+ */
+export function NavigationAidHost(props) {
+    const [activeContentControl, setActiveContentControl] = React.useState(() => ContentViewManager.getActiveContentControl());
+    const [activeContentViewport, setActiveContentViewport] = React.useState(() => /* istanbul ignore next */ activeContentControl === null || activeContentControl === void 0 ? void 0 : activeContentControl.viewport);
+    const [navigationAidId, setNavigationAidId] = React.useState(() => activeContentControl ? activeContentControl.navigationAidControl : /* istanbul ignore next */ "");
+    React.useEffect(() => {
+        // istanbul ignore next
+        const handleContentControlActivated = (args) => {
+            setActiveContentControl(args.activeContentControl);
+            setActiveContentViewport(args.activeContentControl.viewport);
+            setNavigationAidId(args.activeContentControl.navigationAidControl);
+        };
+        FrontstageManager.onContentControlActivatedEvent.addListener(handleContentControlActivated);
+        return () => {
+            FrontstageManager.onContentControlActivatedEvent.removeListener(handleContentControlActivated);
+        };
+    }, []);
+    const [activeViewClass, setActiveViewClass] = React.useState(() => {
+        const content = ContentViewManager.getActiveContentControl();
+        if (content && content.viewport)
+            return content.viewport.view.classFullName;
+        return "";
+    });
+    React.useEffect(() => {
+        // istanbul ignore next
+        const handleViewClassFullNameChange = (args) => {
+            setActiveViewClass(args.newName);
+        };
+        ViewportComponentEvents.onViewClassFullNameChangedEvent.addListener(handleViewClassFullNameChange);
+        return () => {
+            ViewportComponentEvents.onViewClassFullNameChangedEvent.removeListener(handleViewClassFullNameChange);
+        };
+    }, [activeViewClass]);
+    const navigationAidControl = React.useMemo(() => createNavigationAidControl(activeContentControl, navigationAidId, activeContentViewport), [activeContentControl, navigationAidId, activeContentViewport]);
+    const ref = React.useRef(null);
+    const isInitialMount = React.useRef(true);
+    const { onElementRef, proximityScale } = useWidgetOpacityContext();
+    React.useEffect(() => {
+        // istanbul ignore else
+        if (isInitialMount.current) {
+            isInitialMount.current = false;
+            onElementRef(ref);
+        }
+    }, [onElementRef]);
+    const divStyle = {
+        minWidth: props.minWidth ? /* istanbul ignore next */ props.minWidth : "64px",
+        minHeight: props.minHeight ? /* istanbul ignore next */ props.minHeight : "64px",
+    };
+    // istanbul ignore else
+    if (UiShowHideManager.useProximityOpacity && !UiFramework.isMobile()) {
+        const navigationAidOpacity = (0.30 * proximityScale) + 0.70;
+        divStyle.opacity = `${navigationAidOpacity}`;
+    }
+    return (React.createElement("div", { style: divStyle, ref: ref }, navigationAidControl && navigationAidControl.reactNode));
+}
+/**
+ * Component that Composes a NavigationWidget typically using toolbars generated via [[ToolbarComposer]] class. The Navigation widget is shown in the top right of the content area
+ * and typically holds tools to visually navigate, orient, and zoom to specific content.
+ * @public
+ */
+export function NavigationWidgetComposer(props) {
+    const { navigationAidHost, horizontalToolbar, verticalToolbar, hideNavigationAid, ...otherProps } = props;
+    const [elementSet] = React.useState(new WidgetElementSet());
+    const handleChildRef = React.useCallback((elementRef) => {
+        elementSet.add(elementRef);
+    }, [elementSet]);
+    const proximityScale = useProximityToMouse(elementSet, UiShowHideManager.snapWidgetOpacity);
+    /* istanbul ignore next */
+    const navigationAid = hideNavigationAid ? undefined : navigationAidHost !== null && navigationAidHost !== void 0 ? navigationAidHost : React.createElement(NavigationAidHost, null);
+    return (React.createElement(WidgetOpacityContext.Provider, { value: {
+            onElementRef: handleChildRef,
+            proximityScale,
+        } },
+        React.createElement(NavigationArea, { navigationAid: navigationAid, horizontalToolbar: horizontalToolbar, verticalToolbar: verticalToolbar, ...otherProps, onMouseEnter: UiShowHideManager.handleWidgetMouseEnter })));
+}
 //# sourceMappingURL=NavigationWidgetComposer.js.map

package/lib/esm/appui-react/widgets/NavigationWidgetComposer.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationWidgetComposer.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/NavigationWidgetComposer.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/** @packageDocumentation\n * @module Widget\n */\n\nimport * as React from \"react\";\nimport { ScreenViewport } from \"@itwin/core-frontend\";\nimport { ViewClassFullNameChangedEventArgs, ViewportComponentEvents } from \"@itwin/imodel-components-react\";\nimport { CommonProps, useProximityToMouse, useWidgetOpacityContext, WidgetElementSet, WidgetOpacityContext } from \"@itwin/core-react\";\nimport { NavigationArea } from \"@itwin/appui-layout-react\";\nimport { ConfigurableUiManager } from \"../configurableui/ConfigurableUiManager\";\nimport { ContentControl, ContentControlActivatedEventArgs } from \"../content/ContentControl\";\nimport { ContentViewManager } from \"../content/ContentViewManager\";\nimport { FrontstageManager } from \"../frontstage/FrontstageManager\";\nimport { NavigationAidControl } from \"../navigationaids/NavigationAidControl\";\nimport { UiFramework } from \"../UiFramework\";\nimport { UiShowHideManager } from \"../utils/UiShowHideManager\";\n\nfunction createNavigationAidControl(activeContentControl: ContentControl | undefined, navigationAidId: string, activeViewport: ScreenViewport | undefined): NavigationAidControl | undefined {\n  // istanbul ignore else\n  if (!activeContentControl || !navigationAidId || (activeViewport !== activeContentControl.viewport))\n    return undefined;\n\n  const viewport = activeContentControl.viewport;\n  const imodel = viewport ? viewport.iModel : /* istanbul ignore next */ UiFramework.getIModelConnection();\n  const navigationAidControl = ConfigurableUiManager.createControl(navigationAidId, navigationAidId, { imodel, viewport }) as NavigationAidControl;\n\n  navigationAidControl.initialize();\n  return navigationAidControl;\n}\n\n/** Properties for the [[NavigationAidHost]] React component\n * @public\n */\nexport interface NavigationAidHostProps {\n  /** Navigation Aid Host minimum width. Defaults to \"64px\". */\n  minWidth?: string;\n  /** Navigation Aid Host minimum height. Defaults to \"64px\". */\n  minHeight?: string;\n}\n\n/**\n * NavigationAidHost is a component that hosts a NavigationAid that is specific to the active content control.\n * @public\n */\nexport function NavigationAidHost(props: NavigationAidHostProps) {\n  const [activeContentControl, setActiveContentControl] = React.useState(() => ContentViewManager.getActiveContentControl());\n  const [activeContentViewport, setActiveContentViewport] = React.useState(() => /* istanbul ignore next */ activeContentControl?.viewport);\n  const [navigationAidId, setNavigationAidId] = React.useState(() => activeContentControl ? activeContentControl.navigationAidControl : /* istanbul ignore next */ \"\");\n\n  React.useEffect(() => {\n    // istanbul ignore next\n    const handleContentControlActivated = (args: ContentControlActivatedEventArgs) => {\n      setActiveContentControl(args.activeContentControl);\n      setActiveContentViewport(args.activeContentControl.viewport);\n      setNavigationAidId(args.activeContentControl.navigationAidControl);\n    };\n\n    FrontstageManager.onContentControlActivatedEvent.addListener(handleContentControlActivated);\n    return () => {\n      FrontstageManager.onContentControlActivatedEvent.removeListener(handleContentControlActivated);\n    };\n  }, []);\n\n  const [activeViewClass, setActiveViewClass] = React.useState(() => {\n    const content = ContentViewManager.getActiveContentControl();\n    if (content && content.viewport)\n      return content.viewport.view.classFullName;\n    return \"\";\n  });\n\n  React.useEffect(() => {\n    // istanbul ignore next\n    const handleViewClassFullNameChange = (args: ViewClassFullNameChangedEventArgs) => {\n      setActiveViewClass(args.newName);\n    };\n\n    ViewportComponentEvents.onViewClassFullNameChangedEvent.addListener(handleViewClassFullNameChange);\n    return () => {\n      ViewportComponentEvents.onViewClassFullNameChangedEvent.removeListener(handleViewClassFullNameChange);\n    };\n  }, [activeViewClass]);\n\n  const navigationAidControl = React.useMemo(() => createNavigationAidControl(activeContentControl, navigationAidId, activeContentViewport), [activeContentControl, navigationAidId, activeContentViewport]);\n\n  const ref = React.useRef<HTMLDivElement>(null);\n\n  const isInitialMount = React.useRef(true);\n  const { onElementRef, proximityScale } = useWidgetOpacityContext();\n\n  React.useEffect(() => {\n    // istanbul ignore else\n    if (isInitialMount.current) {\n      isInitialMount.current = false;\n      onElementRef(ref);\n    }\n  }, [onElementRef]);\n\n  const divStyle: React.CSSProperties = {\n    minWidth: props.minWidth ? /* istanbul ignore next */ props.minWidth : \"64px\",\n    minHeight: props.minHeight ? /* istanbul ignore next */ props.minHeight : \"64px\",\n  };\n\n  // istanbul ignore else\n  if (UiShowHideManager.useProximityOpacity && !UiFramework.isMobile()) {\n    const navigationAidOpacity = (0.30 * proximityScale) + 0.70;\n    divStyle.opacity = `${navigationAidOpacity}`;\n  }\n\n  return (\n    <div style={divStyle} ref={ref}>\n      {navigationAidControl && navigationAidControl.reactNode}\n    </div>\n  );\n}\n\n/** Properties for the [[NavigationWidgetComposer]] React components\n * @public\n */\nexport interface NavigationWidgetComposerProps extends CommonProps {\n  /** Optional Horizontal Toolbar */\n  horizontalToolbar?: React.ReactNode;\n  /** Optional Vertical Toolbar */\n  verticalToolbar?: React.ReactNode;\n  /** Optional Navigation Aid host. If not specified a default host is provided which will use registered Navigation Aids and the active content control to determine which if any Navigation Aid to display. */\n  navigationAidHost?: React.ReactNode;\n  /** If true no navigation aid will be shown. Defaults to false. */\n  hideNavigationAid?: boolean;\n}\n\n/**\n * Component that Composes a NavigationWidget typically using toolbars generated via [[ToolbarComposer]] class. The Navigation widget is shown in the top right of the content area\n * and typically holds tools to visually navigate, orient, and zoom to specific content.\n * @public\n */\nexport function NavigationWidgetComposer(props: NavigationWidgetComposerProps) {\n  const { navigationAidHost, horizontalToolbar, verticalToolbar, hideNavigationAid, ...otherProps } = props;\n  const [elementSet] = React.useState(new WidgetElementSet());\n  const handleChildRef = React.useCallback((elementRef: React.RefObject<Element>) => {\n    elementSet.add(elementRef);\n  }, [elementSet]);\n  const proximityScale = useProximityToMouse(elementSet, UiShowHideManager.snapWidgetOpacity);\n  /* istanbul ignore next */\n  const navigationAid = hideNavigationAid ? undefined : navigationAidHost ?? <NavigationAidHost />;\n\n  return (\n    <WidgetOpacityContext.Provider\n      value={{\n        onElementRef: handleChildRef,\n        proximityScale,\n      }}\n    >\n      <NavigationArea\n        navigationAid={navigationAid}\n        horizontalToolbar={horizontalToolbar}\n        verticalToolbar={verticalToolbar}\n        {...otherProps}\n        onMouseEnter={UiShowHideManager.handleWidgetMouseEnter}\n      />\n    </WidgetOpacityContext.Provider>\n  );\n}\n"]}
+{"version":3,"file":"NavigationWidgetComposer.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/NavigationWidgetComposer.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Widget\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { ScreenViewport } from \"@itwin/core-frontend\";\r\nimport { ViewClassFullNameChangedEventArgs, ViewportComponentEvents } from \"@itwin/imodel-components-react\";\r\nimport { CommonProps, useProximityToMouse, useWidgetOpacityContext, WidgetElementSet, WidgetOpacityContext } from \"@itwin/core-react\";\r\nimport { NavigationArea } from \"@itwin/appui-layout-react\";\r\nimport { ConfigurableUiManager } from \"../configurableui/ConfigurableUiManager\";\r\nimport { ContentControl, ContentControlActivatedEventArgs } from \"../content/ContentControl\";\r\nimport { ContentViewManager } from \"../content/ContentViewManager\";\r\nimport { FrontstageManager } from \"../frontstage/FrontstageManager\";\r\nimport { NavigationAidControl } from \"../navigationaids/NavigationAidControl\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { UiShowHideManager } from \"../utils/UiShowHideManager\";\r\n\r\nfunction createNavigationAidControl(activeContentControl: ContentControl | undefined, navigationAidId: string, activeViewport: ScreenViewport | undefined): NavigationAidControl | undefined {\r\n  // istanbul ignore else\r\n  if (!activeContentControl || !navigationAidId || (activeViewport !== activeContentControl.viewport))\r\n    return undefined;\r\n\r\n  const viewport = activeContentControl.viewport;\r\n  const imodel = viewport ? viewport.iModel : /* istanbul ignore next */ UiFramework.getIModelConnection();\r\n  const navigationAidControl = ConfigurableUiManager.createControl(navigationAidId, navigationAidId, { imodel, viewport }) as NavigationAidControl;\r\n\r\n  navigationAidControl.initialize();\r\n  return navigationAidControl;\r\n}\r\n\r\n/** Properties for the [[NavigationAidHost]] React component\r\n * @public\r\n */\r\nexport interface NavigationAidHostProps {\r\n  /** Navigation Aid Host minimum width. Defaults to \"64px\". */\r\n  minWidth?: string;\r\n  /** Navigation Aid Host minimum height. Defaults to \"64px\". */\r\n  minHeight?: string;\r\n}\r\n\r\n/**\r\n * NavigationAidHost is a component that hosts a NavigationAid that is specific to the active content control.\r\n * @public\r\n */\r\nexport function NavigationAidHost(props: NavigationAidHostProps) {\r\n  const [activeContentControl, setActiveContentControl] = React.useState(() => ContentViewManager.getActiveContentControl());\r\n  const [activeContentViewport, setActiveContentViewport] = React.useState(() => /* istanbul ignore next */ activeContentControl?.viewport);\r\n  const [navigationAidId, setNavigationAidId] = React.useState(() => activeContentControl ? activeContentControl.navigationAidControl : /* istanbul ignore next */ \"\");\r\n\r\n  React.useEffect(() => {\r\n    // istanbul ignore next\r\n    const handleContentControlActivated = (args: ContentControlActivatedEventArgs) => {\r\n      setActiveContentControl(args.activeContentControl);\r\n      setActiveContentViewport(args.activeContentControl.viewport);\r\n      setNavigationAidId(args.activeContentControl.navigationAidControl);\r\n    };\r\n\r\n    FrontstageManager.onContentControlActivatedEvent.addListener(handleContentControlActivated);\r\n    return () => {\r\n      FrontstageManager.onContentControlActivatedEvent.removeListener(handleContentControlActivated);\r\n    };\r\n  }, []);\r\n\r\n  const [activeViewClass, setActiveViewClass] = React.useState(() => {\r\n    const content = ContentViewManager.getActiveContentControl();\r\n    if (content && content.viewport)\r\n      return content.viewport.view.classFullName;\r\n    return \"\";\r\n  });\r\n\r\n  React.useEffect(() => {\r\n    // istanbul ignore next\r\n    const handleViewClassFullNameChange = (args: ViewClassFullNameChangedEventArgs) => {\r\n      setActiveViewClass(args.newName);\r\n    };\r\n\r\n    ViewportComponentEvents.onViewClassFullNameChangedEvent.addListener(handleViewClassFullNameChange);\r\n    return () => {\r\n      ViewportComponentEvents.onViewClassFullNameChangedEvent.removeListener(handleViewClassFullNameChange);\r\n    };\r\n  }, [activeViewClass]);\r\n\r\n  const navigationAidControl = React.useMemo(() => createNavigationAidControl(activeContentControl, navigationAidId, activeContentViewport), [activeContentControl, navigationAidId, activeContentViewport]);\r\n\r\n  const ref = React.useRef<HTMLDivElement>(null);\r\n\r\n  const isInitialMount = React.useRef(true);\r\n  const { onElementRef, proximityScale } = useWidgetOpacityContext();\r\n\r\n  React.useEffect(() => {\r\n    // istanbul ignore else\r\n    if (isInitialMount.current) {\r\n      isInitialMount.current = false;\r\n      onElementRef(ref);\r\n    }\r\n  }, [onElementRef]);\r\n\r\n  const divStyle: React.CSSProperties = {\r\n    minWidth: props.minWidth ? /* istanbul ignore next */ props.minWidth : \"64px\",\r\n    minHeight: props.minHeight ? /* istanbul ignore next */ props.minHeight : \"64px\",\r\n  };\r\n\r\n  // istanbul ignore else\r\n  if (UiShowHideManager.useProximityOpacity && !UiFramework.isMobile()) {\r\n    const navigationAidOpacity = (0.30 * proximityScale) + 0.70;\r\n    divStyle.opacity = `${navigationAidOpacity}`;\r\n  }\r\n\r\n  return (\r\n    <div style={divStyle} ref={ref}>\r\n      {navigationAidControl && navigationAidControl.reactNode}\r\n    </div>\r\n  );\r\n}\r\n\r\n/** Properties for the [[NavigationWidgetComposer]] React components\r\n * @public\r\n */\r\nexport interface NavigationWidgetComposerProps extends CommonProps {\r\n  /** Optional Horizontal Toolbar */\r\n  horizontalToolbar?: React.ReactNode;\r\n  /** Optional Vertical Toolbar */\r\n  verticalToolbar?: React.ReactNode;\r\n  /** Optional Navigation Aid host. If not specified a default host is provided which will use registered Navigation Aids and the active content control to determine which if any Navigation Aid to display. */\r\n  navigationAidHost?: React.ReactNode;\r\n  /** If true no navigation aid will be shown. Defaults to false. */\r\n  hideNavigationAid?: boolean;\r\n}\r\n\r\n/**\r\n * Component that Composes a NavigationWidget typically using toolbars generated via [[ToolbarComposer]] class. The Navigation widget is shown in the top right of the content area\r\n * and typically holds tools to visually navigate, orient, and zoom to specific content.\r\n * @public\r\n */\r\nexport function NavigationWidgetComposer(props: NavigationWidgetComposerProps) {\r\n  const { navigationAidHost, horizontalToolbar, verticalToolbar, hideNavigationAid, ...otherProps } = props;\r\n  const [elementSet] = React.useState(new WidgetElementSet());\r\n  const handleChildRef = React.useCallback((elementRef: React.RefObject<Element>) => {\r\n    elementSet.add(elementRef);\r\n  }, [elementSet]);\r\n  const proximityScale = useProximityToMouse(elementSet, UiShowHideManager.snapWidgetOpacity);\r\n  /* istanbul ignore next */\r\n  const navigationAid = hideNavigationAid ? undefined : navigationAidHost ?? <NavigationAidHost />;\r\n\r\n  return (\r\n    <WidgetOpacityContext.Provider\r\n      value={{\r\n        onElementRef: handleChildRef,\r\n        proximityScale,\r\n      }}\r\n    >\r\n      <NavigationArea\r\n        navigationAid={navigationAid}\r\n        horizontalToolbar={horizontalToolbar}\r\n        verticalToolbar={verticalToolbar}\r\n        {...otherProps}\r\n        onMouseEnter={UiShowHideManager.handleWidgetMouseEnter}\r\n      />\r\n    </WidgetOpacityContext.Provider>\r\n  );\r\n}\r\n"]}

package/lib/esm/appui-react/widgets/StableWidgetDef.d.ts

@@ -1,9 +1,9 @@
-/** @packageDocumentation
- * @module Widget
- */
-import { WidgetDef } from "./WidgetDef";
-/** Proxy will return `stableId` if target [[WidgetDef]] id is auto-generated.
- * @internal
- */
-export declare function createStableWidgetDef(widgetDef: WidgetDef, stableId: string): WidgetDef;
+/** @packageDocumentation
+ * @module Widget
+ */
+import { WidgetDef } from "./WidgetDef";
+/** Proxy will return `stableId` if target [[WidgetDef]] id is auto-generated.
+ * @internal
+ */
+export declare function createStableWidgetDef(widgetDef: WidgetDef, stableId: string): WidgetDef;
 //# sourceMappingURL=StableWidgetDef.d.ts.map