@itwin/appui-react 4.0.0-dev.9 → 4.0.0

package/lib/cjs/appui-react/widget-panels/Toolbars.js

@@ -1,25 +1,25 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Item
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.WidgetPanelsToolbars = void 0;
-require("./Toolbars.scss");
-const React = require("react");
-const FrontstageDef_1 = require("../frontstage/FrontstageDef");
-/** @internal */
-function WidgetPanelsToolbars() {
-    var _a, _b;
-    const frontstageDef = (0, FrontstageDef_1.useActiveFrontstageDef)();
-    const tools = (_a = frontstageDef === null || frontstageDef === void 0 ? void 0 : frontstageDef.contentManipulation) === null || _a === void 0 ? void 0 : _a.reactNode;
-    const navigation = (_b = frontstageDef === null || frontstageDef === void 0 ? void 0 : frontstageDef.viewNavigation) === null || _b === void 0 ? void 0 : _b.reactNode;
-    return (React.createElement("div", { className: "uifw-widgetPanels-toolbars" },
-        tools,
-        navigation));
-}
-exports.WidgetPanelsToolbars = WidgetPanelsToolbars;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Item
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WidgetPanelsToolbars = void 0;
+require("./Toolbars.scss");
+const React = require("react");
+const FrontstageDef_1 = require("../frontstage/FrontstageDef");
+/** @internal */
+function WidgetPanelsToolbars() {
+    var _a, _b;
+    const frontstageDef = (0, FrontstageDef_1.useActiveFrontstageDef)();
+    const tools = (_a = frontstageDef === null || frontstageDef === void 0 ? void 0 : frontstageDef.contentManipulation) === null || _a === void 0 ? void 0 : _a.reactNode;
+    const navigation = (_b = frontstageDef === null || frontstageDef === void 0 ? void 0 : frontstageDef.viewNavigation) === null || _b === void 0 ? void 0 : _b.reactNode;
+    return (React.createElement("div", { className: "uifw-widgetPanels-toolbars" },
+        tools,
+        navigation));
+}
+exports.WidgetPanelsToolbars = WidgetPanelsToolbars;
 //# sourceMappingURL=Toolbars.js.map

package/lib/cjs/appui-react/widget-panels/useTransientState.d.ts

@@ -1,8 +1,8 @@
-/** @packageDocumentation
- * @module Widget
- */
-/** Hook that allows to save and restore transient DOM state (i.e. scroll offset) of a widget.
- * @beta
- */
-export declare function useTransientState(onSave?: () => void, onRestore?: () => void): void;
+/** @packageDocumentation
+ * @module Widget
+ */
+/** Hook that allows to save and restore transient DOM state (i.e. scroll offset) of a widget.
+ * @beta
+ */
+export declare function useTransientState(onSave?: () => void, onRestore?: () => void): void;
 //# sourceMappingURL=useTransientState.d.ts.map

package/lib/cjs/appui-react/widget-panels/useTransientState.js

@@ -1,19 +1,19 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* 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
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useTransientState = void 0;
-const appui_layout_react_1 = require("@itwin/appui-layout-react");
-/** Hook that allows to save and restore transient DOM state (i.e. scroll offset) of a widget.
- * @beta
- */
-function useTransientState(onSave, onRestore) {
-    (0, appui_layout_react_1.useTransientState)(onSave, onRestore);
-}
-exports.useTransientState = useTransientState;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* 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
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTransientState = void 0;
+const appui_layout_react_1 = require("@itwin/appui-layout-react");
+/** Hook that allows to save and restore transient DOM state (i.e. scroll offset) of a widget.
+ * @beta
+ */
+function useTransientState(onSave, onRestore) {
+    (0, appui_layout_react_1.useTransientState)(onSave, onRestore);
+}
+exports.useTransientState = useTransientState;
 //# sourceMappingURL=useTransientState.js.map

package/lib/cjs/appui-react/widget-panels/useWidgetDirection.d.ts

@@ -1,9 +1,9 @@
-/** @packageDocumentation
- * @module Widget
- */
-/** Returns widget direction.
- * I.e. "horizontal" when widget is in bottom/top stage panel.
- * @alpha
- */
-export declare function useWidgetDirection(): "horizontal" | "vertical";
+/** @packageDocumentation
+ * @module Widget
+ */
+/** Returns widget direction.
+ * I.e. "horizontal" when widget is in bottom/top stage panel.
+ * @alpha
+ */
+export declare function useWidgetDirection(): "horizontal" | "vertical";
 //# sourceMappingURL=useWidgetDirection.d.ts.map

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

@@ -1,30 +1,30 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* 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
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useWidgetDirection = void 0;
-const React = require("react");
-const appui_layout_react_1 = require("@itwin/appui-layout-react");
-const core_bentley_1 = require("@itwin/core-bentley");
-/** Returns widget direction.
- * I.e. "horizontal" when widget is in bottom/top stage panel.
- * @alpha
- */
-function useWidgetDirection() {
-    const tabId = React.useContext(appui_layout_react_1.TabIdContext);
-    (0, core_bentley_1.assert)(!!tabId);
-    return (0, appui_layout_react_1.useLayout)((state) => {
-        const tabLocation = (0, appui_layout_react_1.getTabLocation)(state, tabId);
-        if (tabLocation && ("side" in tabLocation) && (0, appui_layout_react_1.isHorizontalPanelSide)(tabLocation.side)) {
-            return "horizontal";
-        }
-        return "vertical";
-    });
-}
-exports.useWidgetDirection = useWidgetDirection;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* 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
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useWidgetDirection = void 0;
+const React = require("react");
+const appui_layout_react_1 = require("@itwin/appui-layout-react");
+const core_bentley_1 = require("@itwin/core-bentley");
+/** Returns widget direction.
+ * I.e. "horizontal" when widget is in bottom/top stage panel.
+ * @alpha
+ */
+function useWidgetDirection() {
+    const tabId = React.useContext(appui_layout_react_1.TabIdContext);
+    (0, core_bentley_1.assert)(!!tabId);
+    return (0, appui_layout_react_1.useLayout)((state) => {
+        const tabLocation = (0, appui_layout_react_1.getTabLocation)(state, tabId);
+        if (tabLocation && ("side" in tabLocation) && (0, appui_layout_react_1.isHorizontalPanelSide)(tabLocation.side)) {
+            return "horizontal";
+        }
+        return "vertical";
+    });
+}
+exports.useWidgetDirection = useWidgetDirection;
 //# sourceMappingURL=useWidgetDirection.js.map

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

@@ -1,22 +1,23 @@
-/** @packageDocumentation
- * @module Widget
- */
-/// <reference types="react" />
-/**
- * Properties for the [[BackstageAppButton]] React component
- * @public
- */
-export interface BackstageAppButtonProps {
-    /** Icon specification for the App button */
-    icon?: string;
-    /** 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/cjs/appui-react/widgets/BackstageAppButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BackstageAppButton.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BackstageAppButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AASH;;;GAGG;AACH,MAAM,WAAW,uBAAuB;IACtC,4CAA4C;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6EAA6E;IAC7E,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,eA0ChE"}
+{"version":3,"file":"BackstageAppButton.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BackstageAppButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAKH,OAAO,EAAQ,QAAQ,EAA2B,MAAM,mBAAmB,CAAC;AAI5E;;;GAGG;AACH,MAAM,WAAW,uBAAuB;IACtC,4CAA4C;IAC5C,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6EAA6E;IAC7E,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,eA0ChE"}

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

@@ -1,52 +1,52 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* 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
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BackstageAppButton = void 0;
-const React = require("react");
-const home_svg_1 = require("@bentley/icons-generic/icons/home.svg");
-const appui_abstract_1 = require("@itwin/appui-abstract");
-const core_react_1 = require("@itwin/core-react");
-const appui_layout_react_1 = require("@itwin/appui-layout-react");
-const UiFramework_1 = require("../UiFramework");
-/**
- * BackstageAppButton used to toggle display of Backstage and is shown in the corner of the ToolWidget.
- * @public
- */
-function BackstageAppButton(props) {
-    const backstageToggleCommand = React.useMemo(() => UiFramework_1.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 : appui_abstract_1.IconSpecUtilities.createWebComponentIconSpec(home_svg_1.default));
-    const isInitialMount = React.useRef(true);
-    const divClassName = "uifw-app-button-small";
-    const { onElementRef, proximityScale } = (0, core_react_1.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 : appui_abstract_1.IconSpecUtilities.createWebComponentIconSpec(home_svg_1.default));
-        }
-    }, [props.icon, onElementRef]);
-    let buttonProximityScale;
-    if (UiFramework_1.UiFramework.visibility.useProximityOpacity && !UiFramework_1.UiFramework.isMobile()) {
-        buttonProximityScale = proximityScale;
-    }
-    return (React.createElement("div", { ref: ref, className: divClassName },
-        React.createElement(appui_layout_react_1.AppButton, { small: true, mouseProximity: buttonProximityScale, onClick: handleClick, icon: React.createElement(core_react_1.Icon, { iconSpec: icon }), title: backstageLabel })));
-}
-exports.BackstageAppButton = BackstageAppButton;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* 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
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BackstageAppButton = void 0;
+const React = require("react");
+const home_svg_1 = require("@bentley/icons-generic/icons/home.svg");
+const appui_abstract_1 = require("@itwin/appui-abstract");
+const core_react_1 = require("@itwin/core-react");
+const appui_layout_react_1 = require("@itwin/appui-layout-react");
+const UiFramework_1 = require("../UiFramework");
+/**
+ * BackstageAppButton used to toggle display of Backstage and is shown in the corner of the ToolWidget.
+ * @public
+ */
+function BackstageAppButton(props) {
+    const backstageToggleCommand = React.useMemo(() => UiFramework_1.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 : appui_abstract_1.IconSpecUtilities.createWebComponentIconSpec(home_svg_1.default));
+    const isInitialMount = React.useRef(true);
+    const divClassName = "uifw-app-button-small";
+    const { onElementRef, proximityScale } = (0, core_react_1.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 : appui_abstract_1.IconSpecUtilities.createWebComponentIconSpec(home_svg_1.default));
+        }
+    }, [props.icon, onElementRef]);
+    let buttonProximityScale;
+    if (UiFramework_1.UiFramework.visibility.useProximityOpacity && !UiFramework_1.UiFramework.isMobile()) {
+        buttonProximityScale = proximityScale;
+    }
+    return (React.createElement("div", { ref: ref, className: divClassName },
+        React.createElement(appui_layout_react_1.AppButton, { small: true, mouseProximity: buttonProximityScale, onClick: handleClick, icon: React.createElement(core_react_1.Icon, { iconSpec: icon }), title: backstageLabel })));
+}
+exports.BackstageAppButton = BackstageAppButton;
 //# sourceMappingURL=BackstageAppButton.js.map

package/lib/cjs/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,+BAA+B;AAC/B,oEAAkE;AAClE,0DAA0D;AAC1D,kDAAkE;AAClE,kEAAsD;AACtD,gDAA6C;AAe7C;;;GAGG;AACH,SAAgB,kBAAkB,CAAC,KAA8B;IAC/D,MAAM,sBAAsB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,yBAAW,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,kCAAiB,CAAC,0BAA0B,CAAC,kBAAa,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,IAAA,oCAAuB,GAAE,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,kCAAiB,CAAC,0BAA0B,CAAC,kBAAa,CAAC,CAAC,CAAC;SAChG;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC;IAE/B,IAAI,oBAAwC,CAAC;IAE7C,IAAI,yBAAW,CAAC,UAAU,CAAC,mBAAmB,IAAI,CAAC,yBAAW,CAAC,QAAQ,EAAE,EAAE;QACzE,oBAAoB,GAAG,cAAc,CAAC;KACvC;IAED,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,YAAY;QACpC,oBAAC,8BAAS,IACR,KAAK,EAAE,IAAI,EACX,cAAc,EAAE,oBAAoB,EACpC,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE,oBAAC,iBAAI,IAAC,QAAQ,EAAE,IAAI,GAAI,EAC9B,KAAK,EAAE,cAAc,GAAI,CACvB,CACP,CAAC;AACJ,CAAC;AA1CD,gDA0CC","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, 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?: string;\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,+BAA+B;AAC/B,oEAAkE;AAClE,0DAA0D;AAC1D,kDAA4E;AAC5E,kEAAsD;AACtD,gDAA6C;AAe7C;;;GAGG;AACH,SAAgB,kBAAkB,CAAC,KAA8B;IAC/D,MAAM,sBAAsB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,yBAAW,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,kCAAiB,CAAC,0BAA0B,CAAC,kBAAa,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,IAAA,oCAAuB,GAAE,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,kCAAiB,CAAC,0BAA0B,CAAC,kBAAa,CAAC,CAAC,CAAC;SAChG;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC;IAE/B,IAAI,oBAAwC,CAAC;IAE7C,IAAI,yBAAW,CAAC,UAAU,CAAC,mBAAmB,IAAI,CAAC,yBAAW,CAAC,QAAQ,EAAE,EAAE;QACzE,oBAAoB,GAAG,cAAc,CAAC;KACvC;IAED,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,YAAY;QACpC,oBAAC,8BAAS,IACR,KAAK,EAAE,IAAI,EACX,cAAc,EAAE,oBAAoB,EACpC,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE,oBAAC,iBAAI,IAAC,QAAQ,EAAE,IAAI,GAAI,EAC9B,KAAK,EAAE,cAAc,GAAI,CACvB,CACP,CAAC;AACJ,CAAC;AA1CD,gDA0CC","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"]}

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

@@ -1,20 +1,20 @@
-/** @packageDocumentation
- * @module Widget
- */
-/// <reference types="react" />
-import { CommonToolbarItem } from "@itwin/appui-abstract";
-/** Properties that can be used to append items to the default set of toolbar items of [[DefaultNavigationWidget]].
- * @public
- */
-export interface BasicNavigationWidgetProps {
-    /** optional set of additional items to include in horizontal toolbar */
-    additionalHorizontalItems?: CommonToolbarItem[];
-    /** optional set of additional items to include in vertical toolbar */
-    additionalVerticalItems?: CommonToolbarItem[];
-}
-/** 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/cjs/appui-react/widgets/BasicNavigationWidget.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BasicNavigationWidget.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BasicNavigationWidget.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAIH,OAAO,EAAE,iBAAiB,EAAoC,MAAM,uBAAuB,CAAC;AAO5F;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,wEAAwE;IACxE,yBAAyB,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAChD,sEAAsE;IACtE,uBAAuB,CAAC,EAAE,iBAAiB,EAAE,CAAC;CAC/C;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,eAsDtE"}
+{"version":3,"file":"BasicNavigationWidget.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BasicNavigationWidget.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AASH,OAAO,EAAE,WAAW,EAAoC,MAAM,wBAAwB,CAAC;AAEvF;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,wEAAwE;IACxE,yBAAyB,CAAC,EAAE,WAAW,EAAE,CAAC;IAC1C,sEAAsE;IACtE,uBAAuB,CAAC,EAAE,WAAW,EAAE,CAAC;CACzC;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,eAsDtE"}

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

@@ -1,61 +1,61 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* 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
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BasicNavigationWidget = void 0;
-const classnames_1 = require("classnames");
-const React = require("react");
-const appui_abstract_1 = require("@itwin/appui-abstract");
-const CoreToolDefinitions_1 = require("../tools/CoreToolDefinitions");
-const ToolbarComposer_1 = require("../toolbar/ToolbarComposer");
-const ToolbarHelper_1 = require("../toolbar/ToolbarHelper");
-const useUiVisibility_1 = require("../hooks/useUiVisibility");
-const NavigationWidgetComposer_1 = require("./NavigationWidgetComposer");
-/** 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
- */
-function BasicNavigationWidget(props) {
-    const getHorizontalToolbarItems = React.useCallback(() => {
-        const items = ToolbarHelper_1.ToolbarHelper.createToolbarItemsFromItemDefs([
-            CoreToolDefinitions_1.CoreTools.rotateViewCommand,
-            CoreToolDefinitions_1.CoreTools.panViewCommand,
-            CoreToolDefinitions_1.CoreTools.fitViewCommand,
-            CoreToolDefinitions_1.CoreTools.windowAreaCommand,
-            CoreToolDefinitions_1.CoreTools.viewUndoCommand,
-            CoreToolDefinitions_1.CoreTools.viewRedoCommand,
-        ]);
-        if (props.additionalHorizontalItems)
-            items.push(...props.additionalHorizontalItems);
-        return items;
-    }, [props.additionalHorizontalItems]);
-    const getVerticalToolbarItems = React.useCallback(() => {
-        const items = [];
-        items.push(ToolbarHelper_1.ToolbarHelper.createToolbarItemFromItemDef(10, CoreToolDefinitions_1.CoreTools.walkViewCommand), ToolbarHelper_1.ToolbarHelper.createToolbarItemFromItemDef(20, CoreToolDefinitions_1.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 = (0, useUiVisibility_1.useUiVisibility)();
-    // istanbul ignore next
-    const className = (0, classnames_1.default)(!uiIsVisible && "nz-hidden");
-    return (React.createElement(NavigationWidgetComposer_1.NavigationWidgetComposer, { className: className, horizontalToolbar: React.createElement(ToolbarComposer_1.ToolbarComposer, { items: horizontalItems, usage: appui_abstract_1.ToolbarUsage.ViewNavigation, orientation: appui_abstract_1.ToolbarOrientation.Horizontal }), verticalToolbar: React.createElement(ToolbarComposer_1.ToolbarComposer, { items: verticalItems, usage: appui_abstract_1.ToolbarUsage.ViewNavigation, orientation: appui_abstract_1.ToolbarOrientation.Vertical }) }));
-}
-exports.BasicNavigationWidget = BasicNavigationWidget;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* 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
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BasicNavigationWidget = void 0;
+const classnames_1 = require("classnames");
+const React = require("react");
+const CoreToolDefinitions_1 = require("../tools/CoreToolDefinitions");
+const ToolbarComposer_1 = require("../toolbar/ToolbarComposer");
+const ToolbarHelper_1 = require("../toolbar/ToolbarHelper");
+const useUiVisibility_1 = require("../hooks/useUiVisibility");
+const NavigationWidgetComposer_1 = require("./NavigationWidgetComposer");
+const ToolbarItem_1 = require("../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
+ */
+function BasicNavigationWidget(props) {
+    const getHorizontalToolbarItems = React.useCallback(() => {
+        const items = ToolbarHelper_1.ToolbarHelper.createToolbarItemsFromItemDefs([
+            CoreToolDefinitions_1.CoreTools.rotateViewCommand,
+            CoreToolDefinitions_1.CoreTools.panViewCommand,
+            CoreToolDefinitions_1.CoreTools.fitViewCommand,
+            CoreToolDefinitions_1.CoreTools.windowAreaCommand,
+            CoreToolDefinitions_1.CoreTools.viewUndoCommand,
+            CoreToolDefinitions_1.CoreTools.viewRedoCommand,
+        ]);
+        if (props.additionalHorizontalItems)
+            items.push(...props.additionalHorizontalItems);
+        return items;
+    }, [props.additionalHorizontalItems]);
+    const getVerticalToolbarItems = React.useCallback(() => {
+        const items = [];
+        items.push(ToolbarHelper_1.ToolbarHelper.createToolbarItemFromItemDef(10, CoreToolDefinitions_1.CoreTools.walkViewCommand), ToolbarHelper_1.ToolbarHelper.createToolbarItemFromItemDef(20, CoreToolDefinitions_1.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 = (0, useUiVisibility_1.useUiVisibility)();
+    // istanbul ignore next
+    const className = (0, classnames_1.default)(!uiIsVisible && "nz-hidden");
+    return (React.createElement(NavigationWidgetComposer_1.NavigationWidgetComposer, { className: className, horizontalToolbar: React.createElement(ToolbarComposer_1.ToolbarComposer, { items: horizontalItems, usage: ToolbarItem_1.ToolbarUsage.ViewNavigation, orientation: ToolbarItem_1.ToolbarOrientation.Horizontal }), verticalToolbar: React.createElement(ToolbarComposer_1.ToolbarComposer, { items: verticalItems, usage: ToolbarItem_1.ToolbarUsage.ViewNavigation, orientation: ToolbarItem_1.ToolbarOrientation.Vertical }) }));
+}
+exports.BasicNavigationWidget = BasicNavigationWidget;
 //# sourceMappingURL=BasicNavigationWidget.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BasicNavigationWidget.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BasicNavigationWidget.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAC/B,0DAA4F;AAC5F,sEAAyD;AACzD,gEAA6D;AAC7D,4DAAyD;AACzD,8DAA2D;AAC3D,yEAAsE;AAYtE;;;GAGG;AACH,SAAgB,qBAAqB,CAAC,KAAiC;IAErE,MAAM,yBAAyB,GAAG,KAAK,CAAC,WAAW,CACjD,GAAwB,EAAE;QACxB,MAAM,KAAK,GAAwB,6BAAa,CAAC,8BAA8B,CAAC;YAC9E,+BAAS,CAAC,iBAAiB;YAC3B,+BAAS,CAAC,cAAc;YACxB,+BAAS,CAAC,cAAc;YACxB,+BAAS,CAAC,iBAAiB;YAC3B,+BAAS,CAAC,eAAe;YACzB,+BAAS,CAAC,eAAe;SAC1B,CAAC,CAAC;QACH,IAAI,KAAK,CAAC,yBAAyB;YACjC,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,yBAAyB,CAAC,CAAC;QACjD,OAAO,KAAK,CAAC;IACf,CAAC,EAAE,CAAC,KAAK,CAAC,yBAAyB,CAAC,CAAC,CAAC;IAExC,MAAM,uBAAuB,GAAG,KAAK,CAAC,WAAW,CAC/C,GAAwB,EAAE;QACxB,MAAM,KAAK,GAAwB,EAAE,CAAC;QACtC,KAAK,CAAC,IAAI,CACR,6BAAa,CAAC,4BAA4B,CAAC,EAAE,EAAE,+BAAS,CAAC,eAAe,CAAC,EACzE,6BAAa,CAAC,4BAA4B,CAAC,EAAE,EAAE,+BAAS,CAAC,uBAAuB,CAAC,CAClF,CAAC;QACF,IAAI,KAAK,CAAC,uBAAuB;YAC/B,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,uBAAuB,CAAC,CAAC;QAC/C,OAAO,KAAK,CAAC;IACf,CAAC,EAAE,CAAC,KAAK,CAAC,uBAAuB,CAAC,CAAC,CAAC;IAEtC,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,yBAAyB,EAAE,CAAC,CAAC;IAChG,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,uBAAuB,EAAE,CAAC,CAAC;IAE1F,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC1C,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,cAAc,CAAC,OAAO;YACxB,cAAc,CAAC,OAAO,GAAG,KAAK,CAAC;aAC5B;YACH,kBAAkB,CAAC,yBAAyB,EAAE,CAAC,CAAC;YAChD,gBAAgB,CAAC,uBAAuB,EAAE,CAAC,CAAC;SAC7C;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,yBAAyB,EAAE,KAAK,CAAC,uBAAuB,EAAE,yBAAyB,EAAE,uBAAuB,CAAC,CAAC,CAAC;IAEzH,MAAM,WAAW,GAAG,IAAA,iCAAe,GAAE,CAAC;IACtC,uBAAuB;IACvB,MAAM,SAAS,GAAG,IAAA,oBAAU,EAC1B,CAAC,WAAW,IAAI,WAAW,CAC5B,CAAC;IAEF,OAAO,CACL,oBAAC,mDAAwB,IAAC,SAAS,EAAE,SAAS,EAC5C,iBAAiB,EAAE,oBAAC,iCAAe,IAAC,KAAK,EAAE,eAAe,EAAE,KAAK,EAAE,6BAAY,CAAC,cAAc,EAAE,WAAW,EAAE,mCAAkB,CAAC,UAAU,GAAI,EAC9I,eAAe,EAAE,oBAAC,iCAAe,IAAC,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,6BAAY,CAAC,cAAc,EAAE,WAAW,EAAE,mCAAkB,CAAC,QAAQ,GAAI,GACxI,CACH,CAAC;AACJ,CAAC;AAtDD,sDAsDC","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 { ToolbarComposer } from \"../toolbar/ToolbarComposer\";\r\nimport { ToolbarHelper } from \"../toolbar/ToolbarHelper\";\r\nimport { useUiVisibility } from \"../hooks/useUiVisibility\";\r\nimport { NavigationWidgetComposer } from \"./NavigationWidgetComposer\";\r\n\r\n/** Properties that can be used to append items to the default set of toolbar items of [[DefaultNavigationWidget]].\r\n * @public\r\n */\r\nexport interface BasicNavigationWidgetProps {\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/** 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    (): CommonToolbarItem[] => {\r\n      const items: CommonToolbarItem[] = 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    (): CommonToolbarItem[] => {\r\n      const items: CommonToolbarItem[] = [];\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} />} // eslint-disable-line deprecation/deprecation\r\n      verticalToolbar={<ToolbarComposer items={verticalItems} usage={ToolbarUsage.ViewNavigation} orientation={ToolbarOrientation.Vertical} />} // eslint-disable-line deprecation/deprecation\r\n    />\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"BasicNavigationWidget.js","sourceRoot":"","sources":["../../../../src/appui-react/widgets/BasicNavigationWidget.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAC/B,sEAAyD;AACzD,gEAA6D;AAC7D,4DAAyD;AACzD,8DAA2D;AAC3D,yEAAsE;AACtE,wDAAuF;AAYvF;;;GAGG;AACH,SAAgB,qBAAqB,CAAC,KAAiC;IAErE,MAAM,yBAAyB,GAAG,KAAK,CAAC,WAAW,CACjD,GAAkB,EAAE;QAClB,MAAM,KAAK,GAAkB,6BAAa,CAAC,8BAA8B,CAAC;YACxE,+BAAS,CAAC,iBAAiB;YAC3B,+BAAS,CAAC,cAAc;YACxB,+BAAS,CAAC,cAAc;YACxB,+BAAS,CAAC,iBAAiB;YAC3B,+BAAS,CAAC,eAAe;YACzB,+BAAS,CAAC,eAAe;SAC1B,CAAC,CAAC;QACH,IAAI,KAAK,CAAC,yBAAyB;YACjC,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,yBAAyB,CAAC,CAAC;QACjD,OAAO,KAAK,CAAC;IACf,CAAC,EAAE,CAAC,KAAK,CAAC,yBAAyB,CAAC,CAAC,CAAC;IAExC,MAAM,uBAAuB,GAAG,KAAK,CAAC,WAAW,CAC/C,GAAkB,EAAE;QAClB,MAAM,KAAK,GAAkB,EAAE,CAAC;QAChC,KAAK,CAAC,IAAI,CACR,6BAAa,CAAC,4BAA4B,CAAC,EAAE,EAAE,+BAAS,CAAC,eAAe,CAAC,EACzE,6BAAa,CAAC,4BAA4B,CAAC,EAAE,EAAE,+BAAS,CAAC,uBAAuB,CAAC,CAClF,CAAC;QACF,IAAI,KAAK,CAAC,uBAAuB;YAC/B,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,uBAAuB,CAAC,CAAC;QAC/C,OAAO,KAAK,CAAC;IACf,CAAC,EAAE,CAAC,KAAK,CAAC,uBAAuB,CAAC,CAAC,CAAC;IAEtC,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,yBAAyB,EAAE,CAAC,CAAC;IAChG,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,uBAAuB,EAAE,CAAC,CAAC;IAE1F,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC1C,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,cAAc,CAAC,OAAO;YACxB,cAAc,CAAC,OAAO,GAAG,KAAK,CAAC;aAC5B;YACH,kBAAkB,CAAC,yBAAyB,EAAE,CAAC,CAAC;YAChD,gBAAgB,CAAC,uBAAuB,EAAE,CAAC,CAAC;SAC7C;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,yBAAyB,EAAE,KAAK,CAAC,uBAAuB,EAAE,yBAAyB,EAAE,uBAAuB,CAAC,CAAC,CAAC;IAEzH,MAAM,WAAW,GAAG,IAAA,iCAAe,GAAE,CAAC;IACtC,uBAAuB;IACvB,MAAM,SAAS,GAAG,IAAA,oBAAU,EAC1B,CAAC,WAAW,IAAI,WAAW,CAC5B,CAAC;IAEF,OAAO,CACL,oBAAC,mDAAwB,IAAC,SAAS,EAAE,SAAS,EAC5C,iBAAiB,EAAE,oBAAC,iCAAe,IAAC,KAAK,EAAE,eAAe,EAAE,KAAK,EAAE,0BAAY,CAAC,cAAc,EAAE,WAAW,EAAE,gCAAkB,CAAC,UAAU,GAAI,EAC9I,eAAe,EAAE,oBAAC,iCAAe,IAAC,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,0BAAY,CAAC,cAAc,EAAE,WAAW,EAAE,gCAAkB,CAAC,QAAQ,GAAI,GACxI,CACH,CAAC;AACJ,CAAC;AAtDD,sDAsDC","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"]}

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

@@ -1,24 +1,24 @@
-/** @packageDocumentation
- * @module Widget
- */
-/// <reference types="react" />
-import { CommonToolbarItem } from "@itwin/appui-abstract";
-/** Properties that can be used to append items to the default set of toolbar items of [[ReviewToolWidget]].
- * @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?: CommonToolbarItem[];
-    /** optional set of additional items to include in vertical toolbar */
-    additionalVerticalItems?: CommonToolbarItem[];
-}
-/** 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