@itwin/appui-react 4.0.0-dev.12 → 4.0.0-dev.13

package/lib/esm/appui-react/widget-panels/useWidgetDirection.js

@@ -1,26 +1,26 @@
-/*---------------------------------------------------------------------------------------------
-* 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 { getTabLocation, isHorizontalPanelSide, TabIdContext, useLayout } from "@itwin/appui-layout-react";
-import { assert } from "@itwin/core-bentley";
-/** Returns widget direction.
- * I.e. "horizontal" when widget is in bottom/top stage panel.
- * @alpha
- */
-export function useWidgetDirection() {
-    const tabId = React.useContext(TabIdContext);
-    assert(!!tabId);
-    return useLayout((state) => {
-        const tabLocation = getTabLocation(state, tabId);
-        if (tabLocation && ("side" in tabLocation) && isHorizontalPanelSide(tabLocation.side)) {
-            return "horizontal";
-        }
-        return "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 * as React from "react";
+import { getTabLocation, isHorizontalPanelSide, TabIdContext, useLayout } from "@itwin/appui-layout-react";
+import { assert } from "@itwin/core-bentley";
+/** Returns widget direction.
+ * I.e. "horizontal" when widget is in bottom/top stage panel.
+ * @alpha
+ */
+export function useWidgetDirection() {
+    const tabId = React.useContext(TabIdContext);
+    assert(!!tabId);
+    return useLayout((state) => {
+        const tabLocation = getTabLocation(state, tabId);
+        if (tabLocation && ("side" in tabLocation) && isHorizontalPanelSide(tabLocation.side)) {
+            return "horizontal";
+        }
+        return "vertical";
+    });
+}
 //# sourceMappingURL=useWidgetDirection.js.map

package/lib/esm/appui-react/widget-panels/useWidgetDirection.js.map

@@ -1 +1 @@
-{"version":3,"file":"useWidgetDirection.js","sourceRoot":"","sources":["../../../../src/appui-react/widget-panels/useWidgetDirection.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAC3G,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C;;;GAGG;AACH,MAAM,UAAU,kBAAkB;IAChC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;IAC7C,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IAChB,OAAO,SAAS,CAAC,CAAC,KAAK,EAAE,EAAE;QACzB,MAAM,WAAW,GAAG,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;QACjD,IAAI,WAAW,IAAI,CAAC,MAAM,IAAI,WAAW,CAAC,IAAI,qBAAqB,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE;YACrF,OAAO,YAAY,CAAC;SACrB;QACD,OAAO,UAAU,CAAC;IACpB,CAAC,CAAC,CAAC;AACL,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 * as React from \"react\";\r\nimport { getTabLocation, isHorizontalPanelSide, TabIdContext, useLayout } from \"@itwin/appui-layout-react\";\r\nimport { assert } from \"@itwin/core-bentley\";\r\n\r\n/** Returns widget direction.\r\n * I.e. \"horizontal\" when widget is in bottom/top stage panel.\r\n * @alpha\r\n */\r\nexport function useWidgetDirection(): \"horizontal\" | \"vertical\" {\r\n  const tabId = React.useContext(TabIdContext);\r\n  assert(!!tabId);\r\n  return useLayout((state) => {\r\n    const tabLocation = getTabLocation(state, tabId);\r\n    if (tabLocation && (\"side\" in tabLocation) && isHorizontalPanelSide(tabLocation.side)) {\r\n      return \"horizontal\";\r\n    }\r\n    return \"vertical\";\r\n  });\r\n}\r\n"]}
+{"version":3,"file":"useWidgetDirection.js","sourceRoot":"","sources":["../../../../src/appui-react/widget-panels/useWidgetDirection.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAC3G,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C;;;GAGG;AACH,MAAM,UAAU,kBAAkB;IAChC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;IAC7C,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IAChB,OAAO,SAAS,CAAC,CAAC,KAAK,EAAE,EAAE;QACzB,MAAM,WAAW,GAAG,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;QACjD,IAAI,WAAW,IAAI,CAAC,MAAM,IAAI,WAAW,CAAC,IAAI,qBAAqB,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE;YACrF,OAAO,YAAY,CAAC;SACrB;QACD,OAAO,UAAU,CAAC;IACpB,CAAC,CAAC,CAAC;AACL,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 * as React from \"react\";\nimport { getTabLocation, isHorizontalPanelSide, TabIdContext, useLayout } from \"@itwin/appui-layout-react\";\nimport { assert } from \"@itwin/core-bentley\";\n\n/** Returns widget direction.\n * I.e. \"horizontal\" when widget is in bottom/top stage panel.\n * @alpha\n */\nexport function useWidgetDirection(): \"horizontal\" | \"vertical\" {\n  const tabId = React.useContext(TabIdContext);\n  assert(!!tabId);\n  return useLayout((state) => {\n    const tabLocation = getTabLocation(state, tabId);\n    if (tabLocation && (\"side\" in tabLocation) && isHorizontalPanelSide(tabLocation.side)) {\n      return \"horizontal\";\n    }\n    return \"vertical\";\n  });\n}\n"]}

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

@@ -1,23 +1,23 @@
-/** @packageDocumentation
- * @module Widget
- */
-/// <reference types="react" />
-import { IconSpec } from "@itwin/core-react";
-/**
- * Properties for the [[BackstageAppButton]] React component
- * @public
- */
-export interface BackstageAppButtonProps {
-    /** Icon specification for the App button */
-    icon?: IconSpec;
-    /** If specified overrides the default label shown in tooltip. */
-    label?: string;
-    /** If specified overrides the default action that displays the backstage. */
-    execute?: () => void;
-}
-/**
- * BackstageAppButton used to toggle display of Backstage and is shown in the corner of the ToolWidget.
- * @public
- */
-export declare function BackstageAppButton(props: BackstageAppButtonProps): JSX.Element;
+/** @packageDocumentation
+ * @module Widget
+ */
+/// <reference types="react" />
+import { IconSpec } from "@itwin/core-react";
+/**
+ * Properties for the [[BackstageAppButton]] React component
+ * @public
+ */
+export interface BackstageAppButtonProps {
+    /** Icon specification for the App button */
+    icon?: IconSpec;
+    /** If specified overrides the default label shown in tooltip. */
+    label?: string;
+    /** If specified overrides the default action that displays the backstage. */
+    execute?: () => void;
+}
+/**
+ * BackstageAppButton used to toggle display of Backstage and is shown in the corner of the ToolWidget.
+ * @public
+ */
+export declare function BackstageAppButton(props: BackstageAppButtonProps): JSX.Element;
 //# sourceMappingURL=BackstageAppButton.d.ts.map

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

@@ -1,48 +1,48 @@
-/*---------------------------------------------------------------------------------------------
-* 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 widgetIconSvg from "@bentley/icons-generic/icons/home.svg";
-import { IconSpecUtilities } from "@itwin/appui-abstract";
-import { Icon, useWidgetOpacityContext } from "@itwin/core-react";
-import { AppButton } from "@itwin/appui-layout-react";
-import { UiFramework } from "../UiFramework";
-/**
- * BackstageAppButton used to toggle display of Backstage and is shown in the corner of the ToolWidget.
- * @public
- */
-export function BackstageAppButton(props) {
-    const backstageToggleCommand = React.useMemo(() => UiFramework.backstage.getBackstageToggleCommand(props.icon), [props.icon]);
-    const backstageLabel = React.useMemo(() => props.label || backstageToggleCommand.tooltip, [backstageToggleCommand.tooltip, props.label]);
-    const [icon, setIcon] = React.useState(props.icon ? props.icon : IconSpecUtilities.createWebComponentIconSpec(widgetIconSvg));
-    const isInitialMount = React.useRef(true);
-    const divClassName = "uifw-app-button-small";
-    const { onElementRef, proximityScale } = useWidgetOpacityContext();
-    const ref = React.useRef(null);
-    const handleClick = React.useCallback(() => {
-        if (props.execute)
-            props.execute();
-        else
-            backstageToggleCommand.execute();
-    }, [backstageToggleCommand, props]);
-    React.useEffect(() => {
-        if (isInitialMount.current) {
-            isInitialMount.current = false;
-            onElementRef(ref);
-        }
-        else {
-            setIcon(props.icon ? props.icon : IconSpecUtilities.createWebComponentIconSpec(widgetIconSvg));
-        }
-    }, [props.icon, onElementRef]);
-    let buttonProximityScale;
-    if (UiFramework.visibility.useProximityOpacity && !UiFramework.isMobile()) {
-        buttonProximityScale = proximityScale;
-    }
-    return (React.createElement("div", { ref: ref, className: divClassName },
-        React.createElement(AppButton, { small: true, mouseProximity: buttonProximityScale, onClick: handleClick, icon: React.createElement(Icon, { iconSpec: icon }), title: backstageLabel })));
-}
+/*---------------------------------------------------------------------------------------------
+* 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 widgetIconSvg from "@bentley/icons-generic/icons/home.svg";
+import { IconSpecUtilities } from "@itwin/appui-abstract";
+import { Icon, useWidgetOpacityContext } from "@itwin/core-react";
+import { AppButton } from "@itwin/appui-layout-react";
+import { UiFramework } from "../UiFramework";
+/**
+ * BackstageAppButton used to toggle display of Backstage and is shown in the corner of the ToolWidget.
+ * @public
+ */
+export function BackstageAppButton(props) {
+    const backstageToggleCommand = React.useMemo(() => UiFramework.backstage.getBackstageToggleCommand(props.icon), [props.icon]);
+    const backstageLabel = React.useMemo(() => props.label || backstageToggleCommand.tooltip, [backstageToggleCommand.tooltip, props.label]);
+    const [icon, setIcon] = React.useState(props.icon ? props.icon : IconSpecUtilities.createWebComponentIconSpec(widgetIconSvg));
+    const isInitialMount = React.useRef(true);
+    const divClassName = "uifw-app-button-small";
+    const { onElementRef, proximityScale } = useWidgetOpacityContext();
+    const ref = React.useRef(null);
+    const handleClick = React.useCallback(() => {
+        if (props.execute)
+            props.execute();
+        else
+            backstageToggleCommand.execute();
+    }, [backstageToggleCommand, props]);
+    React.useEffect(() => {
+        if (isInitialMount.current) {
+            isInitialMount.current = false;
+            onElementRef(ref);
+        }
+        else {
+            setIcon(props.icon ? props.icon : IconSpecUtilities.createWebComponentIconSpec(widgetIconSvg));
+        }
+    }, [props.icon, onElementRef]);
+    let buttonProximityScale;
+    if (UiFramework.visibility.useProximityOpacity && !UiFramework.isMobile()) {
+        buttonProximityScale = proximityScale;
+    }
+    return (React.createElement("div", { ref: ref, className: divClassName },
+        React.createElement(AppButton, { small: true, mouseProximity: buttonProximityScale, onClick: handleClick, icon: React.createElement(Icon, { iconSpec: icon }), title: backstageLabel })));
+}
 //# sourceMappingURL=BackstageAppButton.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BackstageAppButton.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BackstageAppButton.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,aAAa,MAAM,uCAAuC,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAY,uBAAuB,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAe7C;;;GAGG;AACH,MAAM,UAAU,kBAAkB,CAAC,KAA8B;IAC/D,MAAM,sBAAsB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,SAAS,CAAC,yBAAyB,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;IAC9H,MAAM,cAAc,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,IAAI,sBAAsB,CAAC,OAAO,EAAE,CAAC,sBAAsB,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IACzI,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,aAAa,CAAC,CAAC,CAAC;IAC9H,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC1C,MAAM,YAAY,GAAG,uBAAuB,CAAC;IAC7C,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,uBAAuB,EAAE,CAAC;IACnE,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE/C,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACzC,IAAI,KAAK,CAAC,OAAO;YACf,KAAK,CAAC,OAAO,EAAE,CAAC;;YAGhB,sBAAsB,CAAC,OAAO,EAAE,CAAC;IACrC,CAAC,EAAE,CAAC,sBAAsB,EAAE,KAAK,CAAC,CAAC,CAAC;IAEpC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,cAAc,CAAC,OAAO,EAAE;YAC1B,cAAc,CAAC,OAAO,GAAG,KAAK,CAAC;YAC/B,YAAY,CAAC,GAAG,CAAC,CAAC;SACnB;aAAM;YACL,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,aAAa,CAAC,CAAC,CAAC;SAChG;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC;IAE/B,IAAI,oBAAwC,CAAC;IAE7C,IAAI,WAAW,CAAC,UAAU,CAAC,mBAAmB,IAAI,CAAC,WAAW,CAAC,QAAQ,EAAE,EAAE;QACzE,oBAAoB,GAAG,cAAc,CAAC;KACvC;IAED,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,YAAY;QACpC,oBAAC,SAAS,IACR,KAAK,EAAE,IAAI,EACX,cAAc,EAAE,oBAAoB,EACpC,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE,oBAAC,IAAI,IAAC,QAAQ,EAAE,IAAI,GAAI,EAC9B,KAAK,EAAE,cAAc,GAAI,CACvB,CACP,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 * as React from \"react\";\r\nimport widgetIconSvg from \"@bentley/icons-generic/icons/home.svg\";\r\nimport { IconSpecUtilities } from \"@itwin/appui-abstract\";\r\nimport { Icon, IconSpec, useWidgetOpacityContext } from \"@itwin/core-react\";\r\nimport { AppButton } from \"@itwin/appui-layout-react\";\r\nimport { UiFramework } from \"../UiFramework\";\r\n\r\n/**\r\n * Properties for the [[BackstageAppButton]] React component\r\n * @public\r\n */\r\nexport interface BackstageAppButtonProps {\r\n  /** Icon specification for the App button */\r\n  icon?: IconSpec;\r\n  /** If specified overrides the default label shown in tooltip. */\r\n  label?: string;\r\n  /** If specified overrides the default action that displays the backstage. */\r\n  execute?: () => void;\r\n}\r\n\r\n/**\r\n * BackstageAppButton used to toggle display of Backstage and is shown in the corner of the ToolWidget.\r\n * @public\r\n */\r\nexport function BackstageAppButton(props: BackstageAppButtonProps) {\r\n  const backstageToggleCommand = React.useMemo(() => UiFramework.backstage.getBackstageToggleCommand(props.icon), [props.icon]);\r\n  const backstageLabel = React.useMemo(() => props.label || backstageToggleCommand.tooltip, [backstageToggleCommand.tooltip, props.label]);\r\n  const [icon, setIcon] = React.useState(props.icon ? props.icon : IconSpecUtilities.createWebComponentIconSpec(widgetIconSvg));\r\n  const isInitialMount = React.useRef(true);\r\n  const divClassName = \"uifw-app-button-small\";\r\n  const { onElementRef, proximityScale } = useWidgetOpacityContext();\r\n  const ref = React.useRef<HTMLDivElement>(null);\r\n\r\n  const handleClick = React.useCallback(() => {\r\n    if (props.execute)\r\n      props.execute();\r\n\r\n    else\r\n      backstageToggleCommand.execute();\r\n  }, [backstageToggleCommand, props]);\r\n\r\n  React.useEffect(() => {\r\n    if (isInitialMount.current) {\r\n      isInitialMount.current = false;\r\n      onElementRef(ref);\r\n    } else {\r\n      setIcon(props.icon ? props.icon : IconSpecUtilities.createWebComponentIconSpec(widgetIconSvg));\r\n    }\r\n  }, [props.icon, onElementRef]);\r\n\r\n  let buttonProximityScale: number | undefined;\r\n\r\n  if (UiFramework.visibility.useProximityOpacity && !UiFramework.isMobile()) {\r\n    buttonProximityScale = proximityScale;\r\n  }\r\n\r\n  return (\r\n    <div ref={ref} className={divClassName}>\r\n      <AppButton\r\n        small={true}\r\n        mouseProximity={buttonProximityScale}\r\n        onClick={handleClick}\r\n        icon={<Icon iconSpec={icon} />}\r\n        title={backstageLabel} />\r\n    </div>\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"BackstageAppButton.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BackstageAppButton.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,aAAa,MAAM,uCAAuC,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAY,uBAAuB,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAe7C;;;GAGG;AACH,MAAM,UAAU,kBAAkB,CAAC,KAA8B;IAC/D,MAAM,sBAAsB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,SAAS,CAAC,yBAAyB,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;IAC9H,MAAM,cAAc,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,IAAI,sBAAsB,CAAC,OAAO,EAAE,CAAC,sBAAsB,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IACzI,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,aAAa,CAAC,CAAC,CAAC;IAC9H,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC1C,MAAM,YAAY,GAAG,uBAAuB,CAAC;IAC7C,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,uBAAuB,EAAE,CAAC;IACnE,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE/C,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACzC,IAAI,KAAK,CAAC,OAAO;YACf,KAAK,CAAC,OAAO,EAAE,CAAC;;YAGhB,sBAAsB,CAAC,OAAO,EAAE,CAAC;IACrC,CAAC,EAAE,CAAC,sBAAsB,EAAE,KAAK,CAAC,CAAC,CAAC;IAEpC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,cAAc,CAAC,OAAO,EAAE;YAC1B,cAAc,CAAC,OAAO,GAAG,KAAK,CAAC;YAC/B,YAAY,CAAC,GAAG,CAAC,CAAC;SACnB;aAAM;YACL,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,aAAa,CAAC,CAAC,CAAC;SAChG;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC;IAE/B,IAAI,oBAAwC,CAAC;IAE7C,IAAI,WAAW,CAAC,UAAU,CAAC,mBAAmB,IAAI,CAAC,WAAW,CAAC,QAAQ,EAAE,EAAE;QACzE,oBAAoB,GAAG,cAAc,CAAC;KACvC;IAED,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,YAAY;QACpC,oBAAC,SAAS,IACR,KAAK,EAAE,IAAI,EACX,cAAc,EAAE,oBAAoB,EACpC,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE,oBAAC,IAAI,IAAC,QAAQ,EAAE,IAAI,GAAI,EAC9B,KAAK,EAAE,cAAc,GAAI,CACvB,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/** @packageDocumentation\n * @module Widget\n */\n\nimport * as React from \"react\";\nimport widgetIconSvg from \"@bentley/icons-generic/icons/home.svg\";\nimport { IconSpecUtilities } from \"@itwin/appui-abstract\";\nimport { Icon, IconSpec, useWidgetOpacityContext } from \"@itwin/core-react\";\nimport { AppButton } from \"@itwin/appui-layout-react\";\nimport { UiFramework } from \"../UiFramework\";\n\n/**\n * Properties for the [[BackstageAppButton]] React component\n * @public\n */\nexport interface BackstageAppButtonProps {\n  /** Icon specification for the App button */\n  icon?: IconSpec;\n  /** If specified overrides the default label shown in tooltip. */\n  label?: string;\n  /** If specified overrides the default action that displays the backstage. */\n  execute?: () => void;\n}\n\n/**\n * BackstageAppButton used to toggle display of Backstage and is shown in the corner of the ToolWidget.\n * @public\n */\nexport function BackstageAppButton(props: BackstageAppButtonProps) {\n  const backstageToggleCommand = React.useMemo(() => UiFramework.backstage.getBackstageToggleCommand(props.icon), [props.icon]);\n  const backstageLabel = React.useMemo(() => props.label || backstageToggleCommand.tooltip, [backstageToggleCommand.tooltip, props.label]);\n  const [icon, setIcon] = React.useState(props.icon ? props.icon : IconSpecUtilities.createWebComponentIconSpec(widgetIconSvg));\n  const isInitialMount = React.useRef(true);\n  const divClassName = \"uifw-app-button-small\";\n  const { onElementRef, proximityScale } = useWidgetOpacityContext();\n  const ref = React.useRef<HTMLDivElement>(null);\n\n  const handleClick = React.useCallback(() => {\n    if (props.execute)\n      props.execute();\n\n    else\n      backstageToggleCommand.execute();\n  }, [backstageToggleCommand, props]);\n\n  React.useEffect(() => {\n    if (isInitialMount.current) {\n      isInitialMount.current = false;\n      onElementRef(ref);\n    } else {\n      setIcon(props.icon ? props.icon : IconSpecUtilities.createWebComponentIconSpec(widgetIconSvg));\n    }\n  }, [props.icon, onElementRef]);\n\n  let buttonProximityScale: number | undefined;\n\n  if (UiFramework.visibility.useProximityOpacity && !UiFramework.isMobile()) {\n    buttonProximityScale = proximityScale;\n  }\n\n  return (\n    <div ref={ref} className={divClassName}>\n      <AppButton\n        small={true}\n        mouseProximity={buttonProximityScale}\n        onClick={handleClick}\n        icon={<Icon iconSpec={icon} />}\n        title={backstageLabel} />\n    </div>\n  );\n}\n"]}

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

@@ -1,20 +1,20 @@
-/** @packageDocumentation
- * @module Widget
- */
-/// <reference types="react" />
-import { ToolbarItem } from "../toolbar/ToolbarItem";
-/** Properties that can be used to append items to the default set of toolbar items.
- * @public
- */
-export interface BasicNavigationWidgetProps {
-    /** optional set of additional items to include in horizontal toolbar */
-    additionalHorizontalItems?: ToolbarItem[];
-    /** optional set of additional items to include in vertical toolbar */
-    additionalVerticalItems?: ToolbarItem[];
-}
-/** Basic Navigation Widget that provides standard tools to manipulate views containing element data.
- * Supports the specification of additional horizontal and vertical toolbar items through props.
- * @public
- */
-export declare function BasicNavigationWidget(props: BasicNavigationWidgetProps): JSX.Element;
+/** @packageDocumentation
+ * @module Widget
+ */
+/// <reference types="react" />
+import { ToolbarItem } from "../toolbar/ToolbarItem";
+/** Properties that can be used to append items to the default set of toolbar items.
+ * @public
+ */
+export interface BasicNavigationWidgetProps {
+    /** optional set of additional items to include in horizontal toolbar */
+    additionalHorizontalItems?: ToolbarItem[];
+    /** optional set of additional items to include in vertical toolbar */
+    additionalVerticalItems?: ToolbarItem[];
+}
+/** Basic Navigation Widget that provides standard tools to manipulate views containing element data.
+ * Supports the specification of additional horizontal and vertical toolbar items through props.
+ * @public
+ */
+export declare function BasicNavigationWidget(props: BasicNavigationWidgetProps): JSX.Element;
 //# sourceMappingURL=BasicNavigationWidget.d.ts.map

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

@@ -1,57 +1,57 @@
-/*---------------------------------------------------------------------------------------------
-* 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 { CoreTools } from "../tools/CoreToolDefinitions";
-import { ToolbarComposer } from "../toolbar/ToolbarComposer";
-import { ToolbarHelper } from "../toolbar/ToolbarHelper";
-import { useUiVisibility } from "../hooks/useUiVisibility";
-import { NavigationWidgetComposer } from "./NavigationWidgetComposer";
-import { ToolbarOrientation, ToolbarUsage } from "../toolbar/ToolbarItem";
-/** Basic Navigation Widget that provides standard tools to manipulate views containing element data.
- * Supports the specification of additional horizontal and vertical toolbar items through props.
- * @public
- */
-export function BasicNavigationWidget(props) {
-    const getHorizontalToolbarItems = React.useCallback(() => {
-        const items = ToolbarHelper.createToolbarItemsFromItemDefs([
-            CoreTools.rotateViewCommand,
-            CoreTools.panViewCommand,
-            CoreTools.fitViewCommand,
-            CoreTools.windowAreaCommand,
-            CoreTools.viewUndoCommand,
-            CoreTools.viewRedoCommand,
-        ]);
-        if (props.additionalHorizontalItems)
-            items.push(...props.additionalHorizontalItems);
-        return items;
-    }, [props.additionalHorizontalItems]);
-    const getVerticalToolbarItems = React.useCallback(() => {
-        const items = [];
-        items.push(ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.walkViewCommand), ToolbarHelper.createToolbarItemFromItemDef(20, CoreTools.toggleCameraViewCommand));
-        if (props.additionalVerticalItems)
-            items.push(...props.additionalVerticalItems);
-        return items;
-    }, [props.additionalVerticalItems]);
-    const [horizontalItems, setHorizontalItems] = React.useState(() => getHorizontalToolbarItems());
-    const [verticalItems, setVerticalItems] = React.useState(() => getVerticalToolbarItems());
-    const isInitialMount = React.useRef(true);
-    React.useEffect(() => {
-        if (isInitialMount.current)
-            isInitialMount.current = false;
-        else {
-            setHorizontalItems(getHorizontalToolbarItems());
-            setVerticalItems(getVerticalToolbarItems());
-        }
-    }, [props.additionalHorizontalItems, props.additionalVerticalItems, getHorizontalToolbarItems, getVerticalToolbarItems]);
-    const uiIsVisible = useUiVisibility();
-    // istanbul ignore next
-    const className = classnames(!uiIsVisible && "nz-hidden");
-    return (React.createElement(NavigationWidgetComposer, { className: className, horizontalToolbar: React.createElement(ToolbarComposer, { items: horizontalItems, usage: ToolbarUsage.ViewNavigation, orientation: ToolbarOrientation.Horizontal }), verticalToolbar: React.createElement(ToolbarComposer, { items: verticalItems, usage: ToolbarUsage.ViewNavigation, 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 { CoreTools } from "../tools/CoreToolDefinitions";
+import { ToolbarComposer } from "../toolbar/ToolbarComposer";
+import { ToolbarHelper } from "../toolbar/ToolbarHelper";
+import { useUiVisibility } from "../hooks/useUiVisibility";
+import { NavigationWidgetComposer } from "./NavigationWidgetComposer";
+import { ToolbarOrientation, ToolbarUsage } from "../toolbar/ToolbarItem";
+/** Basic Navigation Widget that provides standard tools to manipulate views containing element data.
+ * Supports the specification of additional horizontal and vertical toolbar items through props.
+ * @public
+ */
+export function BasicNavigationWidget(props) {
+    const getHorizontalToolbarItems = React.useCallback(() => {
+        const items = ToolbarHelper.createToolbarItemsFromItemDefs([
+            CoreTools.rotateViewCommand,
+            CoreTools.panViewCommand,
+            CoreTools.fitViewCommand,
+            CoreTools.windowAreaCommand,
+            CoreTools.viewUndoCommand,
+            CoreTools.viewRedoCommand,
+        ]);
+        if (props.additionalHorizontalItems)
+            items.push(...props.additionalHorizontalItems);
+        return items;
+    }, [props.additionalHorizontalItems]);
+    const getVerticalToolbarItems = React.useCallback(() => {
+        const items = [];
+        items.push(ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.walkViewCommand), ToolbarHelper.createToolbarItemFromItemDef(20, CoreTools.toggleCameraViewCommand));
+        if (props.additionalVerticalItems)
+            items.push(...props.additionalVerticalItems);
+        return items;
+    }, [props.additionalVerticalItems]);
+    const [horizontalItems, setHorizontalItems] = React.useState(() => getHorizontalToolbarItems());
+    const [verticalItems, setVerticalItems] = React.useState(() => getVerticalToolbarItems());
+    const isInitialMount = React.useRef(true);
+    React.useEffect(() => {
+        if (isInitialMount.current)
+            isInitialMount.current = false;
+        else {
+            setHorizontalItems(getHorizontalToolbarItems());
+            setVerticalItems(getVerticalToolbarItems());
+        }
+    }, [props.additionalHorizontalItems, props.additionalVerticalItems, getHorizontalToolbarItems, getVerticalToolbarItems]);
+    const uiIsVisible = useUiVisibility();
+    // istanbul ignore next
+    const className = classnames(!uiIsVisible && "nz-hidden");
+    return (React.createElement(NavigationWidgetComposer, { className: className, horizontalToolbar: React.createElement(ToolbarComposer, { items: horizontalItems, usage: ToolbarUsage.ViewNavigation, orientation: ToolbarOrientation.Horizontal }), verticalToolbar: React.createElement(ToolbarComposer, { items: verticalItems, usage: ToolbarUsage.ViewNavigation, orientation: ToolbarOrientation.Vertical }) }));
+}
 //# sourceMappingURL=BasicNavigationWidget.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BasicNavigationWidget.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BasicNavigationWidget.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 { CoreTools } from \"../tools/CoreToolDefinitions\";\r\nimport { ToolbarComposer } from \"../toolbar/ToolbarComposer\";\r\nimport { ToolbarHelper } from \"../toolbar/ToolbarHelper\";\r\nimport { useUiVisibility } from \"../hooks/useUiVisibility\";\r\nimport { NavigationWidgetComposer } from \"./NavigationWidgetComposer\";\r\nimport { ToolbarItem, ToolbarOrientation, ToolbarUsage } from \"../toolbar/ToolbarItem\";\r\n\r\n/** Properties that can be used to append items to the default set of toolbar items.\r\n * @public\r\n */\r\nexport interface BasicNavigationWidgetProps {\r\n  /** optional set of additional items to include in horizontal toolbar */\r\n  additionalHorizontalItems?: ToolbarItem[];\r\n  /** optional set of additional items to include in vertical toolbar */\r\n  additionalVerticalItems?: ToolbarItem[];\r\n}\r\n\r\n/** Basic Navigation Widget that provides standard tools to manipulate views containing element data.\r\n * Supports the specification of additional horizontal and vertical toolbar items through props.\r\n * @public\r\n */\r\nexport function BasicNavigationWidget(props: BasicNavigationWidgetProps) {\r\n\r\n  const getHorizontalToolbarItems = React.useCallback(\r\n    (): ToolbarItem[] => {\r\n      const items: ToolbarItem[] = ToolbarHelper.createToolbarItemsFromItemDefs([\r\n        CoreTools.rotateViewCommand,\r\n        CoreTools.panViewCommand,\r\n        CoreTools.fitViewCommand,\r\n        CoreTools.windowAreaCommand,\r\n        CoreTools.viewUndoCommand,\r\n        CoreTools.viewRedoCommand,\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    (): ToolbarItem[] => {\r\n      const items: ToolbarItem[] = [];\r\n      items.push(\r\n        ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.walkViewCommand),\r\n        ToolbarHelper.createToolbarItemFromItemDef(20, CoreTools.toggleCameraViewCommand),\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());\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());\r\n      setVerticalItems(getVerticalToolbarItems());\r\n    }\r\n  }, [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\r\n  return (\r\n    <NavigationWidgetComposer className={className}\r\n      horizontalToolbar={<ToolbarComposer items={horizontalItems} usage={ToolbarUsage.ViewNavigation} orientation={ToolbarOrientation.Horizontal} />}\r\n      verticalToolbar={<ToolbarComposer items={verticalItems} usage={ToolbarUsage.ViewNavigation} orientation={ToolbarOrientation.Vertical} />}\r\n    />\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"BasicNavigationWidget.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BasicNavigationWidget.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 { CoreTools } from \"../tools/CoreToolDefinitions\";\nimport { ToolbarComposer } from \"../toolbar/ToolbarComposer\";\nimport { ToolbarHelper } from \"../toolbar/ToolbarHelper\";\nimport { useUiVisibility } from \"../hooks/useUiVisibility\";\nimport { NavigationWidgetComposer } from \"./NavigationWidgetComposer\";\nimport { ToolbarItem, ToolbarOrientation, ToolbarUsage } from \"../toolbar/ToolbarItem\";\n\n/** Properties that can be used to append items to the default set of toolbar items.\n * @public\n */\nexport interface BasicNavigationWidgetProps {\n  /** optional set of additional items to include in horizontal toolbar */\n  additionalHorizontalItems?: ToolbarItem[];\n  /** optional set of additional items to include in vertical toolbar */\n  additionalVerticalItems?: ToolbarItem[];\n}\n\n/** Basic Navigation Widget that provides standard tools to manipulate views containing element data.\n * Supports the specification of additional horizontal and vertical toolbar items through props.\n * @public\n */\nexport function BasicNavigationWidget(props: BasicNavigationWidgetProps) {\n\n  const getHorizontalToolbarItems = React.useCallback(\n    (): ToolbarItem[] => {\n      const items: ToolbarItem[] = ToolbarHelper.createToolbarItemsFromItemDefs([\n        CoreTools.rotateViewCommand,\n        CoreTools.panViewCommand,\n        CoreTools.fitViewCommand,\n        CoreTools.windowAreaCommand,\n        CoreTools.viewUndoCommand,\n        CoreTools.viewRedoCommand,\n      ]);\n      if (props.additionalHorizontalItems)\n        items.push(...props.additionalHorizontalItems);\n      return items;\n    }, [props.additionalHorizontalItems]);\n\n  const getVerticalToolbarItems = React.useCallback(\n    (): ToolbarItem[] => {\n      const items: ToolbarItem[] = [];\n      items.push(\n        ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.walkViewCommand),\n        ToolbarHelper.createToolbarItemFromItemDef(20, CoreTools.toggleCameraViewCommand),\n      );\n      if (props.additionalVerticalItems)\n        items.push(...props.additionalVerticalItems);\n      return items;\n    }, [props.additionalVerticalItems]);\n\n  const [horizontalItems, setHorizontalItems] = React.useState(() => getHorizontalToolbarItems());\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());\n      setVerticalItems(getVerticalToolbarItems());\n    }\n  }, [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\n  return (\n    <NavigationWidgetComposer className={className}\n      horizontalToolbar={<ToolbarComposer items={horizontalItems} usage={ToolbarUsage.ViewNavigation} orientation={ToolbarOrientation.Horizontal} />}\n      verticalToolbar={<ToolbarComposer items={verticalItems} usage={ToolbarUsage.ViewNavigation} orientation={ToolbarOrientation.Vertical} />}\n    />\n  );\n}\n"]}

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

@@ -1,24 +1,24 @@
-/** @packageDocumentation
- * @module Widget
- */
-/// <reference types="react" />
-import { ToolbarItem } from "../toolbar/ToolbarItem";
-/** Properties that can be used to append items to the default set of toolbar items.
- * @public
- */
-export interface BasicToolWidgetProps {
-    /** if true include hide/isolate Models and Categories */
-    showCategoryAndModelsContextTools?: boolean;
-    /** Name of icon WebFont entry or if specifying an imported SVG symbol use "webSvg:" prefix to imported symbol Id. */
-    icon?: string;
-    /** optional set of additional items to include in horizontal toolbar */
-    additionalHorizontalItems?: ToolbarItem[];
-    /** optional set of additional items to include in vertical toolbar */
-    additionalVerticalItems?: ToolbarItem[];
-}
-/** Default Tool Widget for standard "review" applications. Provides standard tools to review, and measure elements.
- * This definition will also show a overflow button if there is not enough room to display all the toolbar buttons.
- * @public
- */
-export declare function BasicToolWidget(props: BasicToolWidgetProps): JSX.Element;
+/** @packageDocumentation
+ * @module Widget
+ */
+/// <reference types="react" />
+import { ToolbarItem } from "../toolbar/ToolbarItem";
+/** Properties that can be used to append items to the default set of toolbar items.
+ * @public
+ */
+export interface BasicToolWidgetProps {
+    /** if true include hide/isolate Models and Categories */
+    showCategoryAndModelsContextTools?: boolean;
+    /** Name of icon WebFont entry or if specifying an imported SVG symbol use "webSvg:" prefix to imported symbol Id. */
+    icon?: string;
+    /** optional set of additional items to include in horizontal toolbar */
+    additionalHorizontalItems?: ToolbarItem[];
+    /** optional set of additional items to include in vertical toolbar */
+    additionalVerticalItems?: ToolbarItem[];
+}
+/** Default Tool Widget for standard "review" applications. Provides standard tools to review, and measure elements.
+ * This definition will also show a overflow button if there is not enough room to display all the toolbar buttons.
+ * @public
+ */
+export declare function BasicToolWidget(props: BasicToolWidgetProps): JSX.Element;
 //# sourceMappingURL=BasicToolWidget.d.ts.map

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

@@ -1,58 +1,58 @@
-/*---------------------------------------------------------------------------------------------
-* 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 { CoreTools } from "../tools/CoreToolDefinitions";
-import { SelectionContextToolDefinitions } from "../selection/SelectionContextItemDef";
-import { ToolbarComposer } from "../toolbar/ToolbarComposer";
-import { ToolbarHelper } from "../toolbar/ToolbarHelper";
-import { ToolWidgetComposer } from "./ToolWidgetComposer";
-import { BackstageAppButton } from "./BackstageAppButton";
-import { useUiVisibility } from "../hooks/useUiVisibility";
-import { ToolbarOrientation, ToolbarUsage } from "../toolbar/ToolbarItem";
-/** Default Tool Widget for standard "review" applications. Provides standard tools to review, and measure elements.
- * This definition will also show a overflow button if there is not enough room to display all the toolbar buttons.
- * @public
- */
-export function BasicToolWidget(props) {
-    const getHorizontalToolbarItems = React.useCallback((useCategoryAndModelsContextTools) => {
-        const items = [];
-        if (useCategoryAndModelsContextTools) {
-            items.push(ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.clearSelectionItemDef), ToolbarHelper.createToolbarItemFromItemDef(20, SelectionContextToolDefinitions.clearHideIsolateEmphasizeElementsItemDef), ToolbarHelper.createToolbarItemFromItemDef(30, SelectionContextToolDefinitions.hideSectionToolGroup), ToolbarHelper.createToolbarItemFromItemDef(40, SelectionContextToolDefinitions.isolateSelectionToolGroup), ToolbarHelper.createToolbarItemFromItemDef(50, SelectionContextToolDefinitions.emphasizeElementsItemDef));
-        }
-        else {
-            items.push(ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.clearSelectionItemDef), ToolbarHelper.createToolbarItemFromItemDef(20, SelectionContextToolDefinitions.clearHideIsolateEmphasizeElementsItemDef), ToolbarHelper.createToolbarItemFromItemDef(30, SelectionContextToolDefinitions.hideElementsItemDef), ToolbarHelper.createToolbarItemFromItemDef(40, SelectionContextToolDefinitions.isolateElementsItemDef), ToolbarHelper.createToolbarItemFromItemDef(50, SelectionContextToolDefinitions.emphasizeElementsItemDef));
-        }
-        if (props.additionalHorizontalItems)
-            items.push(...props.additionalHorizontalItems);
-        return items;
-    }, [props.additionalHorizontalItems]);
-    const getVerticalToolbarItems = React.useCallback(() => {
-        const items = [];
-        items.push(ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.selectElementCommand), ToolbarHelper.createToolbarItemFromItemDef(20, CoreTools.measureToolGroup), ToolbarHelper.createToolbarItemFromItemDef(30, CoreTools.sectionToolGroup));
-        if (props.additionalVerticalItems)
-            items.push(...props.additionalVerticalItems);
-        return items;
-    }, [props.additionalVerticalItems]);
-    const [horizontalItems, setHorizontalItems] = React.useState(() => getHorizontalToolbarItems(!!props.showCategoryAndModelsContextTools));
-    const [verticalItems, setVerticalItems] = React.useState(() => getVerticalToolbarItems());
-    const isInitialMount = React.useRef(true);
-    React.useEffect(() => {
-        if (isInitialMount.current)
-            isInitialMount.current = false;
-        else {
-            setHorizontalItems(getHorizontalToolbarItems(!!props.showCategoryAndModelsContextTools));
-            setVerticalItems(getVerticalToolbarItems());
-        }
-    }, [props.showCategoryAndModelsContextTools, props.additionalHorizontalItems, props.additionalVerticalItems, getHorizontalToolbarItems, getVerticalToolbarItems]);
-    const uiIsVisible = useUiVisibility();
-    // istanbul ignore next
-    const className = classnames(!uiIsVisible && "nz-hidden");
-    return (React.createElement(ToolWidgetComposer, { className: className, cornerItem: React.createElement(BackstageAppButton, { icon: props.icon }), horizontalToolbar: React.createElement(ToolbarComposer, { items: horizontalItems, usage: ToolbarUsage.ContentManipulation, orientation: ToolbarOrientation.Horizontal }), verticalToolbar: React.createElement(ToolbarComposer, { items: verticalItems, 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 { CoreTools } from "../tools/CoreToolDefinitions";
+import { SelectionContextToolDefinitions } from "../selection/SelectionContextItemDef";
+import { ToolbarComposer } from "../toolbar/ToolbarComposer";
+import { ToolbarHelper } from "../toolbar/ToolbarHelper";
+import { ToolWidgetComposer } from "./ToolWidgetComposer";
+import { BackstageAppButton } from "./BackstageAppButton";
+import { useUiVisibility } from "../hooks/useUiVisibility";
+import { ToolbarOrientation, ToolbarUsage } from "../toolbar/ToolbarItem";
+/** Default Tool Widget for standard "review" applications. Provides standard tools to review, and measure elements.
+ * This definition will also show a overflow button if there is not enough room to display all the toolbar buttons.
+ * @public
+ */
+export function BasicToolWidget(props) {
+    const getHorizontalToolbarItems = React.useCallback((useCategoryAndModelsContextTools) => {
+        const items = [];
+        if (useCategoryAndModelsContextTools) {
+            items.push(ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.clearSelectionItemDef), ToolbarHelper.createToolbarItemFromItemDef(20, SelectionContextToolDefinitions.clearHideIsolateEmphasizeElementsItemDef), ToolbarHelper.createToolbarItemFromItemDef(30, SelectionContextToolDefinitions.hideSectionToolGroup), ToolbarHelper.createToolbarItemFromItemDef(40, SelectionContextToolDefinitions.isolateSelectionToolGroup), ToolbarHelper.createToolbarItemFromItemDef(50, SelectionContextToolDefinitions.emphasizeElementsItemDef));
+        }
+        else {
+            items.push(ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.clearSelectionItemDef), ToolbarHelper.createToolbarItemFromItemDef(20, SelectionContextToolDefinitions.clearHideIsolateEmphasizeElementsItemDef), ToolbarHelper.createToolbarItemFromItemDef(30, SelectionContextToolDefinitions.hideElementsItemDef), ToolbarHelper.createToolbarItemFromItemDef(40, SelectionContextToolDefinitions.isolateElementsItemDef), ToolbarHelper.createToolbarItemFromItemDef(50, SelectionContextToolDefinitions.emphasizeElementsItemDef));
+        }
+        if (props.additionalHorizontalItems)
+            items.push(...props.additionalHorizontalItems);
+        return items;
+    }, [props.additionalHorizontalItems]);
+    const getVerticalToolbarItems = React.useCallback(() => {
+        const items = [];
+        items.push(ToolbarHelper.createToolbarItemFromItemDef(10, CoreTools.selectElementCommand), ToolbarHelper.createToolbarItemFromItemDef(20, CoreTools.measureToolGroup), ToolbarHelper.createToolbarItemFromItemDef(30, CoreTools.sectionToolGroup));
+        if (props.additionalVerticalItems)
+            items.push(...props.additionalVerticalItems);
+        return items;
+    }, [props.additionalVerticalItems]);
+    const [horizontalItems, setHorizontalItems] = React.useState(() => getHorizontalToolbarItems(!!props.showCategoryAndModelsContextTools));
+    const [verticalItems, setVerticalItems] = React.useState(() => getVerticalToolbarItems());
+    const isInitialMount = React.useRef(true);
+    React.useEffect(() => {
+        if (isInitialMount.current)
+            isInitialMount.current = false;
+        else {
+            setHorizontalItems(getHorizontalToolbarItems(!!props.showCategoryAndModelsContextTools));
+            setVerticalItems(getVerticalToolbarItems());
+        }
+    }, [props.showCategoryAndModelsContextTools, props.additionalHorizontalItems, props.additionalVerticalItems, getHorizontalToolbarItems, getVerticalToolbarItems]);
+    const uiIsVisible = useUiVisibility();
+    // istanbul ignore next
+    const className = classnames(!uiIsVisible && "nz-hidden");
+    return (React.createElement(ToolWidgetComposer, { className: className, cornerItem: React.createElement(BackstageAppButton, { icon: props.icon }), horizontalToolbar: React.createElement(ToolbarComposer, { items: horizontalItems, usage: ToolbarUsage.ContentManipulation, orientation: ToolbarOrientation.Horizontal }), verticalToolbar: React.createElement(ToolbarComposer, { items: verticalItems, usage: ToolbarUsage.ContentManipulation, orientation: ToolbarOrientation.Vertical }) }));
+}
 //# sourceMappingURL=BasicToolWidget.js.map