@itwin/appui-react 4.9.0-dev.1 → 4.10.0-dev.1

package/lib/cjs/appui-react/statusfields/SectionsField.d.ts

@@ -1,9 +1,9 @@
 /** @packageDocumentation
  * @module StatusBar
  */
-/// <reference types="react" />
-import "./SectionsField.scss";
 import type { CommonProps } from "@itwin/core-react";
+import * as React from "react";
+import "./SectionsField.scss";
 /** Sections Status Field Props
  * @beta
  */
@@ -13,5 +13,5 @@ export interface SectionsStatusFieldProps extends CommonProps {
 /** Status Field for showing section extra tools for clearing and showing manipulators
  * @beta
  */
-export declare function SectionsStatusField(props: SectionsStatusFieldProps): JSX.Element;
+export declare function SectionsStatusField(props: SectionsStatusFieldProps): React.JSX.Element;
 //# sourceMappingURL=SectionsField.d.ts.map

package/lib/cjs/appui-react/statusfields/SectionsField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SectionsField.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SectionsField.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,sBAAsB,CAAC;AAW9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAOrD;;GAEG;AACH,MAAM,WAAW,wBAAyB,SAAQ,WAAW;IAC3D,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,eA0GlE"}
+{"version":3,"file":"SectionsField.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SectionsField.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAUH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGrD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,sBAAsB,CAAC;AAE9B;;GAEG;AACH,MAAM,WAAW,wBAAyB,SAAQ,WAAW;IAC3D,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,qBA4GlE"}

package/lib/cjs/appui-react/statusfields/SectionsField.js

@@ -8,16 +8,17 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SectionsStatusField = void 0;
-require("./SectionsField.scss");
-const classnames_1 = require("classnames");
-const React = require("react");
-const appui_layout_react_1 = require("@itwin/appui-layout-react");
+const section_tool_svg_1 = require("@bentley/icons-generic/icons/section-tool.svg");
 const core_frontend_1 = require("@itwin/core-frontend");
 const itwinui_react_1 = require("@itwin/itwinui-react");
-const useActiveViewport_1 = require("../hooks/useActiveViewport");
+const classnames_1 = require("classnames");
+const React = require("react");
 const UiFramework_1 = require("../UiFramework");
+const useActiveViewport_1 = require("../hooks/useActiveViewport");
 const LabelIndicator_1 = require("../statusbar/LabelIndicator");
-const section_tool_svg_1 = require("@bentley/icons-generic/icons/section-tool.svg");
+const StatusBar_1 = require("../statusbar/StatusBar");
+const Dialog_1 = require("../statusbar/dialog/Dialog");
+require("./SectionsField.scss");
 /** Status Field for showing section extra tools for clearing and showing manipulators
  * @beta
  */
@@ -69,8 +70,8 @@ function SectionsStatusField(props) {
     return (React.createElement("div", { className: "uifw-section-footer-popup-container" }, showIndicator && (React.createElement(React.Fragment, null,
         React.createElement("div", { ref: targetDiv, title: toolTip },
             React.createElement(LabelIndicator_1.StatusBarLabelIndicator, { className: classes, iconSpec: section_tool_svg_1.default, onClick: () => setPopupOpen(!isPopupOpen) })),
-        React.createElement(appui_layout_react_1.FooterPopup, { target: targetDiv.current, onClose: () => setPopupOpen(false), isOpen: isPopupOpen },
-            React.createElement(appui_layout_react_1.Dialog, { titleBar: React.createElement(appui_layout_react_1.TitleBar, { title: toolTip }) },
+        React.createElement(StatusBar_1.StatusBar.Popup, { target: targetDiv.current, onClose: () => setPopupOpen(false), isOpen: isPopupOpen },
+            React.createElement(Dialog_1.StatusBarDialog, { titleBar: React.createElement(Dialog_1.StatusBarDialog.TitleBar, { title: toolTip }) },
                 React.createElement("div", { className: "uifw-sections-footer-contents" },
                     React.createElement(itwinui_react_1.Button, { onClick: handleClear }, clearLabel),
                     React.createElement("div", { className: "uifw-uifw-sections-toggle-container" },

package/lib/cjs/appui-react/statusfields/SectionsField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionsField.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SectionsField.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAEH,gCAA8B;AAC9B,2CAAoC;AACpC,+BAA+B;AAC/B,kEAA0E;AAE1E,wDAK8B;AAE9B,wDAA4D;AAC5D,kEAA+D;AAC/D,gDAA6C;AAC7C,gEAAsE;AACtE,oFAA2E;AAS3E;;GAEG;AACH,SAAgB,mBAAmB,CAAC,KAA+B;IACjE,MAAM,CAAC,OAAO,EAAE,UAAU,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,OAAO,CAC3D,GAAG,EAAE,CAAC;QACJ,yBAAW,CAAC,SAAS,CAAC,oBAAoB,CAAC;QAC3C,yBAAW,CAAC,SAAS,CAAC,oBAAoB,CAAC;QAC3C,yBAAW,CAAC,SAAS,CAAC,0BAA0B,CAAC;KAClD,EACD,EAAE,CACH,CAAC;IACF,MAAM,cAAc,GAAG,IAAA,qCAAiB,GAAE,CAAC;IAC3C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChE,MAAM,CAAC,WAAW,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1D,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IACrD,MAAM,OAAO,GAAG,aAAa,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB,CAAC;IAC7E,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9E,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,uBAAuB;QACvB,MAAM,aAAa,GAAG,CACpB,QAAkB,EAClB,UAAyB,EACzB,SAAqC,EACrC,EAAE;YACF,IAAI,QAAQ,KAAK,cAAc;gBAAE,OAAO;YAExC,uBAAuB,CAAC,CAAC,CAAC,kCAAkB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,CAAC;YAClE,MAAM,YAAY,GAAG,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YACzD,gBAAgB,CAAC,YAAY,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;QAC1D,CAAC,CAAC;QAEF,MAAM,UAAU,GACd,CAAC,CAAC,cAAc;YAChB,0BAA0B,CAAC,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;QACjE,gBAAgB,CAAC,UAAU,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;QACtD,uBAAuB,CACrB,UAAU;YACR,0BAA0B,CAAC,CAAC,CAAC,cAAc;YAC3C,0BAA0B,CAAC,CAAC,CAAC,kCAAkB,CAAC,GAAG,CAAC,cAAc,CAAC,CACtE,CAAC;QAEF,0CAA0B,CAAC,MAAM,EAAE,CAAC,mBAAmB,CAAC,WAAW,CACjE,aAAa,CACd,CAAC;QACF,OAAO,GAAG,EAAE;YACV,kDAAkD;YAClD,0CAA0B,CAAC,MAAM,EAAE,CAAC,mBAAmB,CAAC,cAAc,CACpE,aAAa,CACd,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,cAAc,EAAE,KAAK,CAAC,cAAc,EAAE,WAAW,CAAC,CAAC,CAAC;IAExD,uBAAuB;IACvB,MAAM,kBAAkB,GAAG,KAAK,EAAE,CAAsC,EAAE,EAAE;QAC1E,IAAI,cAAc,EAAE;YAClB,uBAAuB,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;YAC1C,MAAM,0CAA0B,CAAC,MAAM,EAAE,CAAC,gBAAgB,CACxD,cAAc,CACf,CAAC;SACH;IACH,CAAC,CAAC;IAEF,uBAAuB;IACvB,MAAM,WAAW,GAAG,KAAK,IAAI,EAAE;QAC7B,MAAM,yBAAS,CAAC,KAAK,CAAC,GAAG,CACvB,iCAAiB,CAAC,MAAM,EACxB,0CAA0B,CAAC,MAAM,EAAE,CACpC,CAAC;QACF,YAAY,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO,CACL,6BAAK,SAAS,EAAC,qCAAqC,IACjD,aAAa,IAAI,CAChB;QACE,6BAAK,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO;YACjC,oBAAC,wCAAuB,IACtB,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,0BAAc,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,CAAC,WAAW,CAAC,GACzC,CACE;QACN,oBAAC,gCAAW,IACV,MAAM,EAAE,SAAS,CAAC,OAAO,EACzB,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,EAClC,MAAM,EAAE,WAAW;YAEnB,oBAAC,2BAAM,IAAC,QAAQ,EAAE,oBAAC,6BAAQ,IAAC,KAAK,EAAE,OAAO,GAAI;gBAC5C,6BAAK,SAAS,EAAC,+BAA+B;oBAC5C,oBAAC,sBAAM,IAAC,OAAO,EAAE,WAAW,IAAG,UAAU,CAAU;oBACnD,6BAAK,SAAS,EAAC,qCAAqC;wBAClD,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,qBAAqB,CAAC,IAC9C,gBAAgB,CACb;wBACN,oBAAC,4BAAY,IACX,SAAS,EAAC,sBAAsB,EAChC,QAAQ,EAAE,kBAAkB,EAC5B,OAAO,EAAE,oBAAoB,GAC7B,CACE,CACF,CACC,CACG,CACb,CACJ,CACG,CACP,CAAC;AACJ,CAAC;AA1GD,kDA0GC","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 StatusBar\n */\n\nimport \"./SectionsField.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Dialog, FooterPopup, TitleBar } from \"@itwin/appui-layout-react\";\nimport type { ClipEventType, Viewport } from \"@itwin/core-frontend\";\nimport {\n  IModelApp,\n  ViewClipClearTool,\n  ViewClipDecoration,\n  ViewClipDecorationProvider,\n} from \"@itwin/core-frontend\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Button, ToggleSwitch } from \"@itwin/itwinui-react\";\nimport { useActiveViewport } from \"../hooks/useActiveViewport\";\nimport { UiFramework } from \"../UiFramework\";\nimport { StatusBarLabelIndicator } from \"../statusbar/LabelIndicator\";\nimport svgSectionTool from \"@bentley/icons-generic/icons/section-tool.svg\";\n\n/** Sections Status Field Props\n * @beta\n */\nexport interface SectionsStatusFieldProps extends CommonProps {\n  hideWhenUnused?: boolean;\n}\n\n/** Status Field for showing section extra tools for clearing and showing manipulators\n * @beta\n */\nexport function SectionsStatusField(props: SectionsStatusFieldProps) {\n  const [toolTip, clearLabel, showHandlesLabel] = React.useMemo(\n    () => [\n      UiFramework.translate(\"tools.sectionTools\"),\n      UiFramework.translate(\"tools.sectionClear\"),\n      UiFramework.translate(\"tools.sectionShowHandles\"),\n    ],\n    []\n  );\n  const activeViewport = useActiveViewport();\n  const [showIndicator, setShowIndicator] = React.useState(false);\n  const [isPopupOpen, setPopupOpen] = React.useState(false);\n  const targetDiv = React.useRef<HTMLDivElement>(null);\n  const classes = showIndicator ? \"uifw-field-fade-in\" : \"uifw-field-fade-out\";\n  const [hasManipulatorsShown, setHasManipulatorsShown] = React.useState(false);\n\n  React.useEffect(() => {\n    // istanbul ignore next\n    const onClipChanged = (\n      viewport: Viewport,\n      _eventType: ClipEventType,\n      _provider: ViewClipDecorationProvider\n    ) => {\n      if (viewport !== activeViewport) return;\n\n      setHasManipulatorsShown(!!ViewClipDecoration.get(activeViewport));\n      const isClipActive = !!activeViewport.view.getViewClip();\n      setShowIndicator(isClipActive || !props.hideWhenUnused);\n    };\n\n    const clipActive =\n      !!activeViewport &&\n      /* istanbul ignore next */ !!activeViewport.view.getViewClip();\n    setShowIndicator(clipActive || !props.hideWhenUnused);\n    setHasManipulatorsShown(\n      clipActive &&\n        /* istanbul ignore next */ !!activeViewport &&\n        /* istanbul ignore next */ !!ViewClipDecoration.get(activeViewport)\n    );\n\n    ViewClipDecorationProvider.create().onActiveClipChanged.addListener(\n      onClipChanged\n    );\n    return () => {\n      // Get or create static ViewClipDecorationProvider\n      ViewClipDecorationProvider.create().onActiveClipChanged.removeListener(\n        onClipChanged\n      );\n    };\n  }, [activeViewport, props.hideWhenUnused, isPopupOpen]);\n\n  // istanbul ignore next\n  const toggleManipulators = async (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (activeViewport) {\n      setHasManipulatorsShown(e.target.checked);\n      await ViewClipDecorationProvider.create().toggleDecoration(\n        activeViewport\n      );\n    }\n  };\n\n  // istanbul ignore next\n  const handleClear = async () => {\n    await IModelApp.tools.run(\n      ViewClipClearTool.toolId,\n      ViewClipDecorationProvider.create()\n    );\n    setPopupOpen(false);\n  };\n\n  return (\n    <div className=\"uifw-section-footer-popup-container\">\n      {showIndicator && (\n        <>\n          <div ref={targetDiv} title={toolTip}>\n            <StatusBarLabelIndicator\n              className={classes}\n              iconSpec={svgSectionTool}\n              onClick={() => setPopupOpen(!isPopupOpen)}\n            />\n          </div>\n          <FooterPopup\n            target={targetDiv.current}\n            onClose={() => setPopupOpen(false)}\n            isOpen={isPopupOpen}\n          >\n            <Dialog titleBar={<TitleBar title={toolTip} />}>\n              <div className=\"uifw-sections-footer-contents\">\n                <Button onClick={handleClear}>{clearLabel}</Button>\n                <div className=\"uifw-uifw-sections-toggle-container\">\n                  <div className={classnames(\"uifw-sections-label\")}>\n                    {showHandlesLabel}\n                  </div>\n                  <ToggleSwitch\n                    className=\"uifw-sections-toggle\"\n                    onChange={toggleManipulators}\n                    checked={hasManipulatorsShown}\n                  />\n                </div>\n              </div>\n            </Dialog>\n          </FooterPopup>\n        </>\n      )}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"SectionsField.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SectionsField.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 StatusBar\n */\n\nimport svgSectionTool from \"@bentley/icons-generic/icons/section-tool.svg\";\nimport type { ClipEventType, Viewport } from \"@itwin/core-frontend\";\nimport {\n  IModelApp,\n  ViewClipClearTool,\n  ViewClipDecoration,\n  ViewClipDecorationProvider,\n} from \"@itwin/core-frontend\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Button, ToggleSwitch } from \"@itwin/itwinui-react\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { UiFramework } from \"../UiFramework\";\nimport { useActiveViewport } from \"../hooks/useActiveViewport\";\nimport { StatusBarLabelIndicator } from \"../statusbar/LabelIndicator\";\nimport { StatusBar } from \"../statusbar/StatusBar\";\nimport { StatusBarDialog } from \"../statusbar/dialog/Dialog\";\nimport \"./SectionsField.scss\";\n\n/** Sections Status Field Props\n * @beta\n */\nexport interface SectionsStatusFieldProps extends CommonProps {\n  hideWhenUnused?: boolean;\n}\n\n/** Status Field for showing section extra tools for clearing and showing manipulators\n * @beta\n */\nexport function SectionsStatusField(props: SectionsStatusFieldProps) {\n  const [toolTip, clearLabel, showHandlesLabel] = React.useMemo(\n    () => [\n      UiFramework.translate(\"tools.sectionTools\"),\n      UiFramework.translate(\"tools.sectionClear\"),\n      UiFramework.translate(\"tools.sectionShowHandles\"),\n    ],\n    []\n  );\n  const activeViewport = useActiveViewport();\n  const [showIndicator, setShowIndicator] = React.useState(false);\n  const [isPopupOpen, setPopupOpen] = React.useState(false);\n  const targetDiv = React.useRef<HTMLDivElement>(null);\n  const classes = showIndicator ? \"uifw-field-fade-in\" : \"uifw-field-fade-out\";\n  const [hasManipulatorsShown, setHasManipulatorsShown] = React.useState(false);\n\n  React.useEffect(() => {\n    // istanbul ignore next\n    const onClipChanged = (\n      viewport: Viewport,\n      _eventType: ClipEventType,\n      _provider: ViewClipDecorationProvider\n    ) => {\n      if (viewport !== activeViewport) return;\n\n      setHasManipulatorsShown(!!ViewClipDecoration.get(activeViewport));\n      const isClipActive = !!activeViewport.view.getViewClip();\n      setShowIndicator(isClipActive || !props.hideWhenUnused);\n    };\n\n    const clipActive =\n      !!activeViewport &&\n      /* istanbul ignore next */ !!activeViewport.view.getViewClip();\n    setShowIndicator(clipActive || !props.hideWhenUnused);\n    setHasManipulatorsShown(\n      clipActive &&\n        /* istanbul ignore next */ !!activeViewport &&\n        /* istanbul ignore next */ !!ViewClipDecoration.get(activeViewport)\n    );\n\n    ViewClipDecorationProvider.create().onActiveClipChanged.addListener(\n      onClipChanged\n    );\n    return () => {\n      // Get or create static ViewClipDecorationProvider\n      ViewClipDecorationProvider.create().onActiveClipChanged.removeListener(\n        onClipChanged\n      );\n    };\n  }, [activeViewport, props.hideWhenUnused, isPopupOpen]);\n\n  // istanbul ignore next\n  const toggleManipulators = async (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (activeViewport) {\n      setHasManipulatorsShown(e.target.checked);\n      await ViewClipDecorationProvider.create().toggleDecoration(\n        activeViewport\n      );\n    }\n  };\n\n  // istanbul ignore next\n  const handleClear = async () => {\n    await IModelApp.tools.run(\n      ViewClipClearTool.toolId,\n      ViewClipDecorationProvider.create()\n    );\n    setPopupOpen(false);\n  };\n\n  return (\n    <div className=\"uifw-section-footer-popup-container\">\n      {showIndicator && (\n        <>\n          <div ref={targetDiv} title={toolTip}>\n            <StatusBarLabelIndicator\n              className={classes}\n              iconSpec={svgSectionTool}\n              onClick={() => setPopupOpen(!isPopupOpen)}\n            />\n          </div>\n          <StatusBar.Popup\n            target={targetDiv.current}\n            onClose={() => setPopupOpen(false)}\n            isOpen={isPopupOpen}\n          >\n            <StatusBarDialog\n              titleBar={<StatusBarDialog.TitleBar title={toolTip} />}\n            >\n              <div className=\"uifw-sections-footer-contents\">\n                <Button onClick={handleClear}>{clearLabel}</Button>\n                <div className=\"uifw-uifw-sections-toggle-container\">\n                  <div className={classnames(\"uifw-sections-label\")}>\n                    {showHandlesLabel}\n                  </div>\n                  <ToggleSwitch\n                    className=\"uifw-sections-toggle\"\n                    onChange={toggleManipulators}\n                    checked={hasManipulatorsShown}\n                  />\n                </div>\n              </div>\n            </StatusBarDialog>\n          </StatusBar.Popup>\n        </>\n      )}\n    </div>\n  );\n}\n"]}

package/lib/cjs/appui-react/statusfields/SelectionCount.d.ts

@@ -1,10 +1,10 @@
 /** @packageDocumentation
  * @module StatusBar
  */
-/// <reference types="react" />
-import "./SelectionCount.scss";
 import type { IModelConnection } from "@itwin/core-frontend";
 import type { CommonProps } from "@itwin/core-react";
+import * as React from "react";
+import "./SelectionCount.scss";
 /** Properties for the [[SelectionCountField]] component.
  * @beta
  */
@@ -15,7 +15,7 @@ export interface SelectionCountFieldProps extends CommonProps {
  * @note Use [[useSelectionSetSize]] hook to get the selection count.
  * @beta
  */
-export declare function SelectionCountField(props: SelectionCountFieldProps): JSX.Element;
+export declare function SelectionCountField(props: SelectionCountFieldProps): React.JSX.Element;
 /** Arguments for [[useSelectionSetSize]] hook.
  * @beta
  */

package/lib/cjs/appui-react/statusfields/SelectionCount.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionCount.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionCount.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,uBAAuB,CAAC;AAI/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIrD;;GAEG;AACH,MAAM,WAAW,wBAAyB,SAAQ,WAAW;IAC3D,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,eAWlE;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,MAAM,EAAE,gBAAgB,GAAG,SAAS,CAAC;CACtC;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,uBAAuB,GAAG,MAAM,CAiBzE"}
+{"version":3,"file":"SelectionCount.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionCount.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIrD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,uBAAuB,CAAC;AAE/B;;GAEG;AACH,MAAM,WAAW,wBAAyB,SAAQ,WAAW;IAC3D,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,qBAWlE;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,MAAM,EAAE,gBAAgB,GAAG,SAAS,CAAC;CACtC;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,uBAAuB,GAAG,MAAM,CAiBzE"}

package/lib/cjs/appui-react/statusfields/SelectionCount.js

@@ -8,19 +8,19 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useSelectionSetSize = exports.SelectionCountField = void 0;
-require("./SelectionCount.scss");
-const classnames_1 = require("classnames");
-const React = require("react");
-const appui_layout_react_1 = require("@itwin/appui-layout-react");
 const core_react_1 = require("@itwin/core-react");
 const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
+const classnames_1 = require("classnames");
+const React = require("react");
+const Indicator_1 = require("../layout/footer/Indicator");
+require("./SelectionCount.scss");
 /** Status field component used to display the number of selected items.
  * @note Use [[useSelectionSetSize]] hook to get the selection count.
  * @beta
  */
 function SelectionCountField(props) {
     const className = (0, classnames_1.default)("uifw-statusFields-selectionCount", props.className);
-    return (React.createElement(appui_layout_react_1.FooterIndicator, { className: className, style: props.style },
+    return (React.createElement(Indicator_1.FooterIndicator, { className: className, style: props.style },
         React.createElement(core_react_1.Icon, { iconSpec: React.createElement(itwinui_icons_react_1.SvgCursor, null) }),
         props.count));
 }

package/lib/cjs/appui-react/statusfields/SelectionCount.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionCount.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionCount.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAEH,iCAA+B;AAC/B,2CAAoC;AACpC,+BAA+B;AAC/B,kEAA4D;AAG5D,kDAAyC;AACzC,oEAAuD;AASvD;;;GAGG;AACH,SAAgB,mBAAmB,CAAC,KAA+B;IACjE,MAAM,SAAS,GAAG,IAAA,oBAAU,EAC1B,kCAAkC,EAClC,KAAK,CAAC,SAAS,CAChB,CAAC;IACF,OAAO,CACL,oBAAC,oCAAe,IAAC,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK;QACvD,oBAAC,iBAAI,IAAC,QAAQ,EAAE,oBAAC,+BAAS,OAAG,GAAI;QAChC,KAAK,CAAC,KAAK,CACI,CACnB,CAAC;AACJ,CAAC;AAXD,kDAWC;AASD;;GAEG;AACH,SAAgB,mBAAmB,CAAC,IAA6B;IAC/D,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAC1C,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IACxB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,MAAM,EAAE;YACX,OAAO,CAAC,CAAC,CAAC,CAAC;YACX,OAAO;SACR;QACD,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;IACpC,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IACb,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,MAAM;YAAE,OAAO;QACpB,OAAO,MAAM,CAAC,YAAY,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,EAAE,EAAE,EAAE;YACtD,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IACb,OAAO,IAAI,CAAC;AACd,CAAC;AAjBD,kDAiBC","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 StatusBar\n */\n\nimport \"./SelectionCount.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { FooterIndicator } from \"@itwin/appui-layout-react\";\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon } from \"@itwin/core-react\";\nimport { SvgCursor } from \"@itwin/itwinui-icons-react\";\n\n/** Properties for the [[SelectionCountField]] component.\n * @beta\n */\nexport interface SelectionCountFieldProps extends CommonProps {\n  count: number;\n}\n\n/** Status field component used to display the number of selected items.\n * @note Use [[useSelectionSetSize]] hook to get the selection count.\n * @beta\n */\nexport function SelectionCountField(props: SelectionCountFieldProps) {\n  const className = classnames(\n    \"uifw-statusFields-selectionCount\",\n    props.className\n  );\n  return (\n    <FooterIndicator className={className} style={props.style}>\n      <Icon iconSpec={<SvgCursor />} />\n      {props.count}\n    </FooterIndicator>\n  );\n}\n\n/** Arguments for [[useSelectionSetSize]] hook.\n * @beta\n */\nexport interface UseSelectionSetSizeArgs {\n  iModel: IModelConnection | undefined;\n}\n\n/** React hook that returns element count of a selection set.\n * @beta\n */\nexport function useSelectionSetSize(args: UseSelectionSetSizeArgs): number {\n  const [size, setSize] = React.useState(0);\n  const { iModel } = args;\n  React.useEffect(() => {\n    if (!iModel) {\n      setSize(0);\n      return;\n    }\n    setSize(iModel.selectionSet.size);\n  }, [iModel]);\n  React.useEffect(() => {\n    if (!iModel) return;\n    return iModel.selectionSet.onChanged.addListener((ev) => {\n      setSize(ev.set.size);\n    });\n  }, [iModel]);\n  return size;\n}\n"]}
+{"version":3,"file":"SelectionCount.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionCount.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAIH,kDAAyC;AACzC,oEAAuD;AACvD,2CAAoC;AACpC,+BAA+B;AAC/B,0DAA6D;AAC7D,iCAA+B;AAS/B;;;GAGG;AACH,SAAgB,mBAAmB,CAAC,KAA+B;IACjE,MAAM,SAAS,GAAG,IAAA,oBAAU,EAC1B,kCAAkC,EAClC,KAAK,CAAC,SAAS,CAChB,CAAC;IACF,OAAO,CACL,oBAAC,2BAAe,IAAC,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK;QACvD,oBAAC,iBAAI,IAAC,QAAQ,EAAE,oBAAC,+BAAS,OAAG,GAAI;QAChC,KAAK,CAAC,KAAK,CACI,CACnB,CAAC;AACJ,CAAC;AAXD,kDAWC;AASD;;GAEG;AACH,SAAgB,mBAAmB,CAAC,IAA6B;IAC/D,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAC1C,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IACxB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,MAAM,EAAE;YACX,OAAO,CAAC,CAAC,CAAC,CAAC;YACX,OAAO;SACR;QACD,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;IACpC,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IACb,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,MAAM;YAAE,OAAO;QACpB,OAAO,MAAM,CAAC,YAAY,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,EAAE,EAAE,EAAE;YACtD,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IACb,OAAO,IAAI,CAAC;AACd,CAAC;AAjBD,kDAiBC","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 StatusBar\n */\n\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Icon } from \"@itwin/core-react\";\nimport { SvgCursor } from \"@itwin/itwinui-icons-react\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { FooterIndicator } from \"../layout/footer/Indicator\";\nimport \"./SelectionCount.scss\";\n\n/** Properties for the [[SelectionCountField]] component.\n * @beta\n */\nexport interface SelectionCountFieldProps extends CommonProps {\n  count: number;\n}\n\n/** Status field component used to display the number of selected items.\n * @note Use [[useSelectionSetSize]] hook to get the selection count.\n * @beta\n */\nexport function SelectionCountField(props: SelectionCountFieldProps) {\n  const className = classnames(\n    \"uifw-statusFields-selectionCount\",\n    props.className\n  );\n  return (\n    <FooterIndicator className={className} style={props.style}>\n      <Icon iconSpec={<SvgCursor />} />\n      {props.count}\n    </FooterIndicator>\n  );\n}\n\n/** Arguments for [[useSelectionSetSize]] hook.\n * @beta\n */\nexport interface UseSelectionSetSizeArgs {\n  iModel: IModelConnection | undefined;\n}\n\n/** React hook that returns element count of a selection set.\n * @beta\n */\nexport function useSelectionSetSize(args: UseSelectionSetSizeArgs): number {\n  const [size, setSize] = React.useState(0);\n  const { iModel } = args;\n  React.useEffect(() => {\n    if (!iModel) {\n      setSize(0);\n      return;\n    }\n    setSize(iModel.selectionSet.size);\n  }, [iModel]);\n  React.useEffect(() => {\n    if (!iModel) return;\n    return iModel.selectionSet.onChanged.addListener((ev) => {\n      setSize(ev.set.size);\n    });\n  }, [iModel]);\n  return size;\n}\n"]}

package/lib/cjs/appui-react/statusfields/SelectionInfo.d.ts

@@ -1,7 +1,7 @@
 /** @packageDocumentation
  * @module StatusBar
  */
-/// <reference types="react" />
+import * as React from "react";
 import type { CommonProps } from "@itwin/core-react";
 /**
  * SelectionInfo Status Field React component. This component is designed to be specified in a status bar definition.
@@ -10,5 +10,5 @@ import type { CommonProps } from "@itwin/core-react";
  * @note Use [[SelectionCountField]] to display custom selection count.
  * @public
  */
-export declare function SelectionInfoField(props: CommonProps): JSX.Element;
+export declare function SelectionInfoField(props: CommonProps): React.JSX.Element;
 //# sourceMappingURL=SelectionInfo.d.ts.map

package/lib/cjs/appui-react/statusfields/SelectionInfo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionInfo.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionInfo.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAGH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAMrD;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,WAAW,eAepD"}
+{"version":3,"file":"SelectionInfo.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionInfo.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAMrD;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,WAAW,qBAepD"}

package/lib/cjs/appui-react/statusfields/SelectionScope.d.ts

@@ -1,11 +1,11 @@
 /** @packageDocumentation
  * @module StatusBar
  */
-/// <reference types="react" />
-import "./SelectionScope.scss";
+import type { CommonProps } from "@itwin/core-react";
+import * as React from "react";
 import type { ConnectedComponent } from "react-redux";
 import type { PresentationSelectionScope } from "../redux/SessionState";
-import type { CommonProps } from "@itwin/core-react";
+import "./SelectionScope.scss";
 /** Defines properties supported by the SelectionScopeField Component.
  * @public
  */
@@ -16,7 +16,7 @@ interface SelectionScopeFieldProps extends CommonProps {
 /**
  * Status Field React component. This component is designed to be specified in a status bar definition.
  */
-declare function SelectionScopeFieldComponent(props: SelectionScopeFieldProps): JSX.Element;
+declare function SelectionScopeFieldComponent(props: SelectionScopeFieldProps): React.JSX.Element;
 /**
  * SelectionScopeField React component. This component is designed to be specified in a status bar definition. It will
  * display the active selection scope from `UiFramework.getActiveSelectionScope()`, and display the stored list of scopes from

package/lib/cjs/appui-react/statusfields/SelectionScope.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionScope.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,uBAAuB,CAAC;AAG/B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAItD,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AAExE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD;;GAEG;AACH,UAAU,wBAAyB,SAAQ,WAAW;IACpD,oBAAoB,EAAE,MAAM,CAAC;IAC7B,wBAAwB,EAAE,0BAA0B,EAAE,CAAC;CACxD;AAED;;GAEG;AACH,iBAAS,4BAA4B,CAAC,KAAK,EAAE,wBAAwB,eAuCpE;AAeD;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB,EAAE,kBAAkB,CAClD,OAAO,4BAA4B,EACnC,WAAW,CAC6C,CAAC"}
+{"version":3,"file":"SelectionScope.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGrD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAItD,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AACxE,OAAO,uBAAuB,CAAC;AAE/B;;GAEG;AACH,UAAU,wBAAyB,SAAQ,WAAW;IACpD,oBAAoB,EAAE,MAAM,CAAC;IAC7B,wBAAwB,EAAE,0BAA0B,EAAE,CAAC;CACxD;AAED;;GAEG;AACH,iBAAS,4BAA4B,CAAC,KAAK,EAAE,wBAAwB,qBAuCpE;AAeD;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB,EAAE,kBAAkB,CAClD,OAAO,4BAA4B,EACnC,WAAW,CAC6C,CAAC"}

package/lib/cjs/appui-react/statusfields/SelectionScope.js

@@ -8,13 +8,13 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SelectionScopeField = void 0;
-require("./SelectionScope.scss");
+const itwinui_react_1 = require("@itwin/itwinui-react");
 const classnames_1 = require("classnames");
 const React = require("react");
 const react_redux_1 = require("react-redux");
-const appui_layout_react_1 = require("@itwin/appui-layout-react");
-const itwinui_react_1 = require("@itwin/itwinui-react");
 const UiFramework_1 = require("../UiFramework");
+const Indicator_1 = require("../layout/footer/Indicator");
+require("./SelectionScope.scss");
 /**
  * Status Field React component. This component is designed to be specified in a status bar definition.
  */
@@ -30,7 +30,7 @@ function SelectionScopeFieldComponent(props) {
             UiFramework_1.UiFramework.setActiveSelectionScope(newValue);
         }
     };
-    return (React.createElement(appui_layout_react_1.FooterIndicator, { className: (0, classnames_1.default)("uifw-statusFields-selectionScope", props.className), style: props.style },
+    return (React.createElement(Indicator_1.FooterIndicator, { className: (0, classnames_1.default)("uifw-statusFields-selectionScope", props.className), style: props.style },
         React.createElement("label", { className: "uifw-statusFields-selectionScope-label" },
             label,
             ":"),

package/lib/cjs/appui-react/statusfields/SelectionScope.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionScope.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAEH,iCAA+B;AAC/B,2CAAoC;AACpC,+BAA+B;AAE/B,6CAAsC;AACtC,kEAA4D;AAC5D,wDAA8C;AAE9C,gDAA6C;AAW7C;;GAEG;AACH,SAAS,4BAA4B,CAAC,KAA+B;IACnE,MAAM,KAAK,GAAG,yBAAW,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;IACjE,MAAM,OAAO,GAAG,yBAAW,CAAC,SAAS,CAAC,6BAA6B,CAAC,CAAC;IAErE,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAC3B,GAAG,EAAE,CACH,KAAK,CAAC,wBAAwB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;QAC3C,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC;IACjD,CAAC,CAAC,EACJ,CAAC,KAAK,CAAC,wBAAwB,CAAC,CACjC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,QAAgB,EAAE,EAAE;QAC7C,uBAAuB;QACvB,IAAI,QAAQ,EAAE;YACZ,yBAAW,CAAC,uBAAuB,CAAC,QAAQ,CAAC,CAAC;SAC/C;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,oCAAe,IACd,SAAS,EAAE,IAAA,oBAAU,EACnB,kCAAkC,EAClC,KAAK,CAAC,SAAS,CAChB,EACD,KAAK,EAAE,KAAK,CAAC,KAAK;QAElB,+BAAO,SAAS,EAAC,wCAAwC;YAAE,KAAK;gBAAU;QAC1E,oBAAC,sBAAM,IACL,SAAS,EAAC,2CAA2C,EACrD,KAAK,EAAE,KAAK,CAAC,oBAAoB,EACjC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,iBAAiB,iBACf,oCAAoC,EAChD,KAAK,EAAE,OAAO,EACd,IAAI,EAAC,OAAO,GACZ,CACc,CACnB,CAAC;AACJ,CAAC;AAED,+GAA+G;AAC/G,SAAS,eAAe,CAAC,KAAU;IACjC,MAAM,cAAc,GAAG,KAAK,CAAC,yBAAW,CAAC,iBAAiB,CAAC,CAAC,CAAC,8CAA8C;IAC3G,0BAA0B;IAC1B,IAAI,CAAC,cAAc;QAAE,OAAO,SAAS,CAAC;IAEtC,OAAO;QACL,oBAAoB,EAAE,cAAc,CAAC,YAAY,CAAC,oBAAoB;QACtE,wBAAwB,EACtB,cAAc,CAAC,YAAY,CAAC,wBAAwB;KACvD,CAAC;AACJ,CAAC;AAED;;;;;;GAMG;AACU,QAAA,mBAAmB,GAG5B,IAAA,qBAAO,EAAC,eAAe,CAAC,CAAC,4BAA4B,CAAC,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 StatusBar\n */\n\nimport \"./SelectionScope.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { ConnectedComponent } from \"react-redux\";\nimport { connect } from \"react-redux\";\nimport { FooterIndicator } from \"@itwin/appui-layout-react\";\nimport { Select } from \"@itwin/itwinui-react\";\nimport type { PresentationSelectionScope } from \"../redux/SessionState\";\nimport { UiFramework } from \"../UiFramework\";\nimport type { CommonProps } from \"@itwin/core-react\";\n\n/** Defines properties supported by the SelectionScopeField Component.\n * @public\n */\ninterface SelectionScopeFieldProps extends CommonProps {\n  activeSelectionScope: string;\n  availableSelectionScopes: PresentationSelectionScope[];\n}\n\n/**\n * Status Field React component. This component is designed to be specified in a status bar definition.\n */\nfunction SelectionScopeFieldComponent(props: SelectionScopeFieldProps) {\n  const label = UiFramework.translate(\"selectionScopeField.label\");\n  const toolTip = UiFramework.translate(\"selectionScopeField.toolTip\");\n\n  const options = React.useMemo(\n    () =>\n      props.availableSelectionScopes.map((scope) => {\n        return { value: scope.id, label: scope.label };\n      }),\n    [props.availableSelectionScopes]\n  );\n\n  const updateSelectValue = (newValue: string) => {\n    // istanbul ignore else\n    if (newValue) {\n      UiFramework.setActiveSelectionScope(newValue);\n    }\n  };\n\n  return (\n    <FooterIndicator\n      className={classnames(\n        \"uifw-statusFields-selectionScope\",\n        props.className\n      )}\n      style={props.style}\n    >\n      <label className=\"uifw-statusFields-selectionScope-label\">{label}:</label>\n      <Select\n        className=\"uifw-statusFields-selectionScope-selector\"\n        value={props.activeSelectionScope}\n        options={options}\n        onChange={updateSelectValue}\n        data-testid=\"components-selectionScope-selector\"\n        title={toolTip}\n        size=\"small\"\n      />\n    </FooterIndicator>\n  );\n}\n\n/** Function used by Redux to map state data in Redux store to props that are used to render this component. */\nfunction mapStateToProps(state: any) {\n  const frameworkState = state[UiFramework.frameworkStateKey]; // since app sets up key, don't hard-code name\n  /* istanbul ignore next */\n  if (!frameworkState) return undefined;\n\n  return {\n    activeSelectionScope: frameworkState.sessionState.activeSelectionScope,\n    availableSelectionScopes:\n      frameworkState.sessionState.availableSelectionScopes,\n  };\n}\n\n/**\n * SelectionScopeField React component. This component is designed to be specified in a status bar definition. It will\n * display the active selection scope from `UiFramework.getActiveSelectionScope()`, and display the stored list of scopes from\n * `UiFramework.getAvailableSelectionScopes()` to allow the user to change the active selection scope, using `UiFramework.setActiveSelectionScope()`.\n * This React component is Redux connected.\n * @public\n */\nexport const SelectionScopeField: ConnectedComponent<\n  typeof SelectionScopeFieldComponent,\n  CommonProps\n> = connect(mapStateToProps)(SelectionScopeFieldComponent);\n"]}
+{"version":3,"file":"SelectionScope.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAGH,wDAA8C;AAC9C,2CAAoC;AACpC,+BAA+B;AAE/B,6CAAsC;AACtC,gDAA6C;AAC7C,0DAA6D;AAE7D,iCAA+B;AAU/B;;GAEG;AACH,SAAS,4BAA4B,CAAC,KAA+B;IACnE,MAAM,KAAK,GAAG,yBAAW,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;IACjE,MAAM,OAAO,GAAG,yBAAW,CAAC,SAAS,CAAC,6BAA6B,CAAC,CAAC;IAErE,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAC3B,GAAG,EAAE,CACH,KAAK,CAAC,wBAAwB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;QAC3C,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC;IACjD,CAAC,CAAC,EACJ,CAAC,KAAK,CAAC,wBAAwB,CAAC,CACjC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,QAAgB,EAAE,EAAE;QAC7C,uBAAuB;QACvB,IAAI,QAAQ,EAAE;YACZ,yBAAW,CAAC,uBAAuB,CAAC,QAAQ,CAAC,CAAC;SAC/C;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,2BAAe,IACd,SAAS,EAAE,IAAA,oBAAU,EACnB,kCAAkC,EAClC,KAAK,CAAC,SAAS,CAChB,EACD,KAAK,EAAE,KAAK,CAAC,KAAK;QAElB,+BAAO,SAAS,EAAC,wCAAwC;YAAE,KAAK;gBAAU;QAC1E,oBAAC,sBAAM,IACL,SAAS,EAAC,2CAA2C,EACrD,KAAK,EAAE,KAAK,CAAC,oBAAoB,EACjC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,iBAAiB,iBACf,oCAAoC,EAChD,KAAK,EAAE,OAAO,EACd,IAAI,EAAC,OAAO,GACZ,CACc,CACnB,CAAC;AACJ,CAAC;AAED,+GAA+G;AAC/G,SAAS,eAAe,CAAC,KAAU;IACjC,MAAM,cAAc,GAAG,KAAK,CAAC,yBAAW,CAAC,iBAAiB,CAAC,CAAC,CAAC,8CAA8C;IAC3G,0BAA0B;IAC1B,IAAI,CAAC,cAAc;QAAE,OAAO,SAAS,CAAC;IAEtC,OAAO;QACL,oBAAoB,EAAE,cAAc,CAAC,YAAY,CAAC,oBAAoB;QACtE,wBAAwB,EACtB,cAAc,CAAC,YAAY,CAAC,wBAAwB;KACvD,CAAC;AACJ,CAAC;AAED;;;;;;GAMG;AACU,QAAA,mBAAmB,GAG5B,IAAA,qBAAO,EAAC,eAAe,CAAC,CAAC,4BAA4B,CAAC,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 StatusBar\n */\n\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Select } from \"@itwin/itwinui-react\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { ConnectedComponent } from \"react-redux\";\nimport { connect } from \"react-redux\";\nimport { UiFramework } from \"../UiFramework\";\nimport { FooterIndicator } from \"../layout/footer/Indicator\";\nimport type { PresentationSelectionScope } from \"../redux/SessionState\";\nimport \"./SelectionScope.scss\";\n\n/** Defines properties supported by the SelectionScopeField Component.\n * @public\n */\ninterface SelectionScopeFieldProps extends CommonProps {\n  activeSelectionScope: string;\n  availableSelectionScopes: PresentationSelectionScope[];\n}\n\n/**\n * Status Field React component. This component is designed to be specified in a status bar definition.\n */\nfunction SelectionScopeFieldComponent(props: SelectionScopeFieldProps) {\n  const label = UiFramework.translate(\"selectionScopeField.label\");\n  const toolTip = UiFramework.translate(\"selectionScopeField.toolTip\");\n\n  const options = React.useMemo(\n    () =>\n      props.availableSelectionScopes.map((scope) => {\n        return { value: scope.id, label: scope.label };\n      }),\n    [props.availableSelectionScopes]\n  );\n\n  const updateSelectValue = (newValue: string) => {\n    // istanbul ignore else\n    if (newValue) {\n      UiFramework.setActiveSelectionScope(newValue);\n    }\n  };\n\n  return (\n    <FooterIndicator\n      className={classnames(\n        \"uifw-statusFields-selectionScope\",\n        props.className\n      )}\n      style={props.style}\n    >\n      <label className=\"uifw-statusFields-selectionScope-label\">{label}:</label>\n      <Select\n        className=\"uifw-statusFields-selectionScope-selector\"\n        value={props.activeSelectionScope}\n        options={options}\n        onChange={updateSelectValue}\n        data-testid=\"components-selectionScope-selector\"\n        title={toolTip}\n        size=\"small\"\n      />\n    </FooterIndicator>\n  );\n}\n\n/** Function used by Redux to map state data in Redux store to props that are used to render this component. */\nfunction mapStateToProps(state: any) {\n  const frameworkState = state[UiFramework.frameworkStateKey]; // since app sets up key, don't hard-code name\n  /* istanbul ignore next */\n  if (!frameworkState) return undefined;\n\n  return {\n    activeSelectionScope: frameworkState.sessionState.activeSelectionScope,\n    availableSelectionScopes:\n      frameworkState.sessionState.availableSelectionScopes,\n  };\n}\n\n/**\n * SelectionScopeField React component. This component is designed to be specified in a status bar definition. It will\n * display the active selection scope from `UiFramework.getActiveSelectionScope()`, and display the stored list of scopes from\n * `UiFramework.getAvailableSelectionScopes()` to allow the user to change the active selection scope, using `UiFramework.setActiveSelectionScope()`.\n * This React component is Redux connected.\n * @public\n */\nexport const SelectionScopeField: ConnectedComponent<\n  typeof SelectionScopeFieldComponent,\n  CommonProps\n> = connect(mapStateToProps)(SelectionScopeFieldComponent);\n"]}

package/lib/cjs/appui-react/statusfields/SelectionScope.scss

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 @import "~@itwin/core-react/lib/cjs/core-react/style/breakpoints";
-@import "~@itwin/appui-layout-react/lib/cjs/appui-layout-react/footer/variables";
+@import "../layout/footer/variables";
 
 .uifw-statusFields-selectionScope {
   $font-size-medium: var(--iui-font-size-0);

package/lib/cjs/appui-react/statusfields/SnapMode.d.ts

@@ -1,8 +1,8 @@
 /** @packageDocumentation
  * @module StatusBar
  */
-/// <reference types="react" />
 import type { CommonProps } from "@itwin/core-react";
+import * as React from "react";
 /** Defines properties supported by the SnapMode Field Component.
  */
 interface SnapModeFieldProps extends CommonProps {
@@ -12,7 +12,7 @@ interface SnapModeFieldProps extends CommonProps {
  * Snap Mode Field React component. This component is designed to be specified in a status bar definition. It will
  * display the active snap mode that AccuSnap will use and allow the user to select a new snap mode.
  */
-declare function SnapModeFieldComponent(props: SnapModeFieldProps): JSX.Element;
+declare function SnapModeFieldComponent(props: SnapModeFieldProps): React.JSX.Element;
 /**
  * Snap Mode Field React component. This component is designed to be specified in a status bar definition. It will
  * display the active snap mode that AccuSnap will use and allow the user to select a new snap mode.

package/lib/cjs/appui-react/statusfields/SnapMode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SnapMode.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SnapMode.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAOH,OAAO,KAAK,EAAE,WAAW,EAAY,MAAM,mBAAmB,CAAC;AAa/D;GACG;AACH,UAAU,kBAAmB,SAAQ,WAAW;IAC9C,QAAQ,EAAE,MAAM,CAAC;CAClB;AAqCD;;;GAGG;AACH,iBAAS,sBAAsB,CAAC,KAAK,EAAE,kBAAkB,eAuFxD;AAYD;;;;;GAKG;AACH,eAAO,MAAM,aAAa,qIAAmD,CAAC"}
+{"version":3,"file":"SnapMode.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SnapMode.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAUH,OAAO,KAAK,EAAE,WAAW,EAAY,MAAM,mBAAmB,CAAC;AAE/D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B;GACG;AACH,UAAU,kBAAmB,SAAQ,WAAW;IAC9C,QAAQ,EAAE,MAAM,CAAC;CAClB;AAqCD;;;GAGG;AACH,iBAAS,sBAAsB,CAAC,KAAK,EAAE,kBAAkB,qBAuFxD;AAYD;;;;;GAKG;AACH,eAAO,MAAM,aAAa,qIAAmD,CAAC"}

package/lib/cjs/appui-react/statusfields/SnapMode.js

@@ -8,20 +8,21 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SnapModeField = void 0;
+const snaps_bisector_svg_1 = require("@bentley/icons-generic/icons/snaps-bisector.svg");
+const snaps_center_svg_1 = require("@bentley/icons-generic/icons/snaps-center.svg");
+const snaps_intersection_svg_1 = require("@bentley/icons-generic/icons/snaps-intersection.svg");
+const snaps_midpoint_svg_1 = require("@bentley/icons-generic/icons/snaps-midpoint.svg");
+const snaps_nearest_svg_1 = require("@bentley/icons-generic/icons/snaps-nearest.svg");
+const snaps_origin_svg_1 = require("@bentley/icons-generic/icons/snaps-origin.svg");
+const snaps_svg_1 = require("@bentley/icons-generic/icons/snaps.svg");
+const core_frontend_1 = require("@itwin/core-frontend");
+const core_react_1 = require("@itwin/core-react");
 const React = require("react");
 const react_redux_1 = require("react-redux");
-const core_frontend_1 = require("@itwin/core-frontend");
-const appui_layout_react_1 = require("@itwin/appui-layout-react");
 const UiFramework_1 = require("../UiFramework");
-const core_react_1 = require("@itwin/core-react");
+const Panel_1 = require("../layout/footer/snap-mode/Panel");
+const Snap_1 = require("../layout/footer/snap-mode/Snap");
 const LabelIndicator_1 = require("../statusbar/LabelIndicator");
-const snaps_svg_1 = require("@bentley/icons-generic/icons/snaps.svg");
-const snaps_intersection_svg_1 = require("@bentley/icons-generic/icons/snaps-intersection.svg");
-const snaps_center_svg_1 = require("@bentley/icons-generic/icons/snaps-center.svg");
-const snaps_nearest_svg_1 = require("@bentley/icons-generic/icons/snaps-nearest.svg");
-const snaps_origin_svg_1 = require("@bentley/icons-generic/icons/snaps-origin.svg");
-const snaps_midpoint_svg_1 = require("@bentley/icons-generic/icons/snaps-midpoint.svg");
-const snaps_bisector_svg_1 = require("@bentley/icons-generic/icons/snaps-bisector.svg");
 function getIconFromIconName(iconName) {
     let iconSpec = snaps_svg_1.default;
     switch (iconName) {
@@ -104,7 +105,7 @@ function SnapModeFieldComponent(props) {
         return "placeholder";
     }, [snapModes]);
     const title = UiFramework_1.UiFramework.translate("snapModeField.snapMode");
-    return (React.createElement(LabelIndicator_1.StatusBarLabelIndicator, { iconSpec: getIconFromIconName(getSnapModeIconNameFromMode(props.snapMode)), title: title, label: title, popup: React.createElement(appui_layout_react_1.SnapModePanel, { title: title }, snapModes.map((item, index) => (React.createElement(appui_layout_react_1.Snap, { key: `SM_${index}`, onClick: () => UiFramework_1.UiFramework.setAccudrawSnapMode(item.value), isActive: (props.snapMode & item.value) === item.value, icon: React.createElement(core_react_1.Icon, { className: `icon`, iconSpec: getIconFromIconName(item.iconName) }) }, item.label)))) }));
+    return (React.createElement(LabelIndicator_1.StatusBarLabelIndicator, { iconSpec: getIconFromIconName(getSnapModeIconNameFromMode(props.snapMode)), title: title, label: title, popup: React.createElement(Panel_1.SnapModePanel, { title: title }, snapModes.map((item, index) => (React.createElement(Snap_1.Snap, { key: `SM_${index}`, onClick: () => UiFramework_1.UiFramework.setAccudrawSnapMode(item.value), isActive: (props.snapMode & item.value) === item.value, icon: React.createElement(core_react_1.Icon, { className: `icon`, iconSpec: getIconFromIconName(item.iconName) }) }, item.label)))) }));
 }
 /** Function used by Redux to map state data in Redux store to props that are used to render this component. */
 function mapStateToProps(state) {

package/lib/cjs/appui-react/statusfields/SnapMode.js.map

@@ -1 +1 @@
-{"version":3,"file":"SnapMode.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SnapMode.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 StatusBar\n */\n\nimport * as React from \"react\";\nimport { connect } from \"react-redux\";\nimport { SnapMode } from \"@itwin/core-frontend\";\nimport { Snap, SnapModePanel } from \"@itwin/appui-layout-react\";\nimport { UiFramework } from \"../UiFramework\";\nimport type { CommonProps, IconSpec } from \"@itwin/core-react\";\nimport { Icon } from \"@itwin/core-react\";\nimport { StatusBarLabelIndicator } from \"../statusbar/LabelIndicator\";\nimport snapModeKeypoint from \"@bentley/icons-generic/icons/snaps.svg\";\nimport snapModeIntersection from \"@bentley/icons-generic/icons/snaps-intersection.svg\";\nimport snapModeCenter from \"@bentley/icons-generic/icons/snaps-center.svg\";\nimport snapModeNearest from \"@bentley/icons-generic/icons/snaps-nearest.svg\";\nimport snapModeOrigin from \"@bentley/icons-generic/icons/snaps-origin.svg\";\nimport snapModeMidpoint from \"@bentley/icons-generic/icons/snaps-midpoint.svg\";\nimport snapModeBisector from \"@bentley/icons-generic/icons/snaps-bisector.svg\";\n\n// cSpell:ignore multione\n\n/** Defines properties supported by the SnapMode Field Component.\n */\ninterface SnapModeFieldProps extends CommonProps {\n  snapMode: number;\n}\n\n/** Define the properties that will be used to represent the available snap modes. */\ninterface SnapModeFieldEntry {\n  label: string;\n  value: number;\n  iconName: string;\n}\n\nfunction getIconFromIconName(iconName: string): IconSpec {\n  let iconSpec = snapModeKeypoint;\n  switch (iconName) {\n    case \"snaps\":\n      iconSpec = snapModeKeypoint;\n      break;\n    case \"snaps-intersection\":\n      iconSpec = snapModeIntersection;\n      break;\n    case \"snaps-center\":\n      iconSpec = snapModeCenter;\n      break;\n    case \"snaps-nearest\":\n      iconSpec = snapModeNearest;\n      break;\n    case \"snaps-origin\":\n      iconSpec = snapModeOrigin;\n      break;\n    case \"snaps-midpoint\":\n      iconSpec = snapModeMidpoint;\n      break;\n    case \"snaps-bisector\":\n      iconSpec = snapModeBisector;\n      break;\n  }\n  return iconSpec;\n}\n\n/**\n * Snap Mode Field React component. This component is designed to be specified in a status bar definition. It will\n * display the active snap mode that AccuSnap will use and allow the user to select a new snap mode.\n */\nfunction SnapModeFieldComponent(props: SnapModeFieldProps) {\n  const snapModes: SnapModeFieldEntry[] = React.useMemo(\n    () => [\n      {\n        label: UiFramework.translate(\"snapModeField.keypoint\"),\n        value: SnapMode.NearestKeypoint as number,\n        iconName: \"snaps\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.intersection\"),\n        value: SnapMode.Intersection as number,\n        iconName: \"snaps-intersection\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.center\"),\n        value: SnapMode.Center as number,\n        iconName: \"snaps-center\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.nearest\"),\n        value: SnapMode.Nearest as number,\n        iconName: \"snaps-nearest\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.origin\"),\n        value: SnapMode.Origin as number,\n        iconName: \"snaps-origin\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.midpoint\"),\n        value: SnapMode.MidPoint as number,\n        iconName: \"snaps-midpoint\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.bisector\"),\n        value: SnapMode.Bisector as number,\n        iconName: \"snaps-bisector\",\n      },\n    ],\n    []\n  );\n\n  /** Return icon class name for a specific snapMode. */\n  const getSnapModeIconNameFromMode = React.useCallback(\n    function (snapMode: number): string {\n      for (const mode of snapModes) {\n        if (mode.value === snapMode) return mode.iconName;\n      }\n\n      /* istanbul ignore else */\n      if (snapMode > 0) return \"snaps-multione\";\n\n      /* istanbul ignore next */\n      return \"placeholder\";\n    },\n    [snapModes]\n  );\n\n  const title = UiFramework.translate(\"snapModeField.snapMode\");\n  return (\n    <StatusBarLabelIndicator\n      iconSpec={getIconFromIconName(\n        getSnapModeIconNameFromMode(props.snapMode)\n      )}\n      title={title}\n      label={title}\n      popup={\n        <SnapModePanel title={title}>\n          {snapModes.map((item, index) => (\n            <Snap\n              key={`SM_${index}`}\n              onClick={() => UiFramework.setAccudrawSnapMode(item.value)}\n              isActive={(props.snapMode & item.value) === item.value}\n              icon={\n                <Icon\n                  className={`icon`}\n                  iconSpec={getIconFromIconName(item.iconName)}\n                />\n              }\n            >\n              {item.label}\n            </Snap>\n          ))}\n        </SnapModePanel>\n      }\n    />\n  );\n}\n\n/** Function used by Redux to map state data in Redux store to props that are used to render this component. */\nfunction mapStateToProps(state: any) {\n  const frameworkState = state[UiFramework.frameworkStateKey]; // since app sets up key, don't hard-code name\n  /* istanbul ignore next */\n  if (!frameworkState) return undefined;\n\n  return { snapMode: frameworkState.configurableUiState.snapMode };\n}\n\n// we declare the variable and export that rather than using export default.\n/**\n * Snap Mode Field React component. This component is designed to be specified in a status bar definition. It will\n * display the active snap mode that AccuSnap will use and allow the user to select a new snap mode.\n * This Field React component is Redux connected.\n * @public\n */\nexport const SnapModeField = connect(mapStateToProps)(SnapModeFieldComponent);\n"]}
+{"version":3,"file":"SnapMode.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SnapMode.tsx"],"names":[],"mappings":";AAAA;;;gGAGgG;AAChG;;GAEG;;;AAEH,wFAA+E;AAC/E,oFAA2E;AAC3E,gGAAuF;AACvF,wFAA+E;AAC/E,sFAA6E;AAC7E,oFAA2E;AAC3E,sEAAsE;AACtE,wDAAgD;AAEhD,kDAAyC;AACzC,+BAA+B;AAC/B,6CAAsC;AACtC,gDAA6C;AAC7C,4DAAiE;AACjE,0DAAuD;AACvD,gEAAsE;AAiBtE,SAAS,mBAAmB,CAAC,QAAgB;IAC3C,IAAI,QAAQ,GAAG,mBAAgB,CAAC;IAChC,QAAQ,QAAQ,EAAE;QAChB,KAAK,OAAO;YACV,QAAQ,GAAG,mBAAgB,CAAC;YAC5B,MAAM;QACR,KAAK,oBAAoB;YACvB,QAAQ,GAAG,gCAAoB,CAAC;YAChC,MAAM;QACR,KAAK,cAAc;YACjB,QAAQ,GAAG,0BAAc,CAAC;YAC1B,MAAM;QACR,KAAK,eAAe;YAClB,QAAQ,GAAG,2BAAe,CAAC;YAC3B,MAAM;QACR,KAAK,cAAc;YACjB,QAAQ,GAAG,0BAAc,CAAC;YAC1B,MAAM;QACR,KAAK,gBAAgB;YACnB,QAAQ,GAAG,4BAAgB,CAAC;YAC5B,MAAM;QACR,KAAK,gBAAgB;YACnB,QAAQ,GAAG,4BAAgB,CAAC;YAC5B,MAAM;KACT;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC;AAED;;;GAGG;AACH,SAAS,sBAAsB,CAAC,KAAyB;IACvD,MAAM,SAAS,GAAyB,KAAK,CAAC,OAAO,CACnD,GAAG,EAAE,CAAC;QACJ;YACE,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,wBAAwB,CAAC;YACtD,KAAK,EAAE,wBAAQ,CAAC,eAAyB;YACzC,QAAQ,EAAE,OAAO;SAClB;QACD;YACE,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,4BAA4B,CAAC;YAC1D,KAAK,EAAE,wBAAQ,CAAC,YAAsB;YACtC,QAAQ,EAAE,oBAAoB;SAC/B;QACD;YACE,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,sBAAsB,CAAC;YACpD,KAAK,EAAE,wBAAQ,CAAC,MAAgB;YAChC,QAAQ,EAAE,cAAc;SACzB;QACD;YACE,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,uBAAuB,CAAC;YACrD,KAAK,EAAE,wBAAQ,CAAC,OAAiB;YACjC,QAAQ,EAAE,eAAe;SAC1B;QACD;YACE,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,sBAAsB,CAAC;YACpD,KAAK,EAAE,wBAAQ,CAAC,MAAgB;YAChC,QAAQ,EAAE,cAAc;SACzB;QACD;YACE,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,wBAAwB,CAAC;YACtD,KAAK,EAAE,wBAAQ,CAAC,QAAkB;YAClC,QAAQ,EAAE,gBAAgB;SAC3B;QACD;YACE,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,wBAAwB,CAAC;YACtD,KAAK,EAAE,wBAAQ,CAAC,QAAkB;YAClC,QAAQ,EAAE,gBAAgB;SAC3B;KACF,EACD,EAAE,CACH,CAAC;IAEF,sDAAsD;IACtD,MAAM,2BAA2B,GAAG,KAAK,CAAC,WAAW,CACnD,UAAU,QAAgB;QACxB,KAAK,MAAM,IAAI,IAAI,SAAS,EAAE;YAC5B,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ;gBAAE,OAAO,IAAI,CAAC,QAAQ,CAAC;SACnD;QAED,0BAA0B;QAC1B,IAAI,QAAQ,GAAG,CAAC;YAAE,OAAO,gBAAgB,CAAC;QAE1C,0BAA0B;QAC1B,OAAO,aAAa,CAAC;IACvB,CAAC,EACD,CAAC,SAAS,CAAC,CACZ,CAAC;IAEF,MAAM,KAAK,GAAG,yBAAW,CAAC,SAAS,CAAC,wBAAwB,CAAC,CAAC;IAC9D,OAAO,CACL,oBAAC,wCAAuB,IACtB,QAAQ,EAAE,mBAAmB,CAC3B,2BAA2B,CAAC,KAAK,CAAC,QAAQ,CAAC,CAC5C,EACD,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,KAAK,EACH,oBAAC,qBAAa,IAAC,KAAK,EAAE,KAAK,IACxB,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAC9B,oBAAC,WAAI,IACH,GAAG,EAAE,MAAM,KAAK,EAAE,EAClB,OAAO,EAAE,GAAG,EAAE,CAAC,yBAAW,CAAC,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,EAC1D,QAAQ,EAAE,CAAC,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC,KAAK,EACtD,IAAI,EACF,oBAAC,iBAAI,IACH,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,mBAAmB,CAAC,IAAI,CAAC,QAAQ,CAAC,GAC5C,IAGH,IAAI,CAAC,KAAK,CACN,CACR,CAAC,CACY,GAElB,CACH,CAAC;AACJ,CAAC;AAED,+GAA+G;AAC/G,SAAS,eAAe,CAAC,KAAU;IACjC,MAAM,cAAc,GAAG,KAAK,CAAC,yBAAW,CAAC,iBAAiB,CAAC,CAAC,CAAC,8CAA8C;IAC3G,0BAA0B;IAC1B,IAAI,CAAC,cAAc;QAAE,OAAO,SAAS,CAAC;IAEtC,OAAO,EAAE,QAAQ,EAAE,cAAc,CAAC,mBAAmB,CAAC,QAAQ,EAAE,CAAC;AACnE,CAAC;AAED,4EAA4E;AAC5E;;;;;GAKG;AACU,QAAA,aAAa,GAAG,IAAA,qBAAO,EAAC,eAAe,CAAC,CAAC,sBAAsB,CAAC,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 StatusBar\n */\n\nimport snapModeBisector from \"@bentley/icons-generic/icons/snaps-bisector.svg\";\nimport snapModeCenter from \"@bentley/icons-generic/icons/snaps-center.svg\";\nimport snapModeIntersection from \"@bentley/icons-generic/icons/snaps-intersection.svg\";\nimport snapModeMidpoint from \"@bentley/icons-generic/icons/snaps-midpoint.svg\";\nimport snapModeNearest from \"@bentley/icons-generic/icons/snaps-nearest.svg\";\nimport snapModeOrigin from \"@bentley/icons-generic/icons/snaps-origin.svg\";\nimport snapModeKeypoint from \"@bentley/icons-generic/icons/snaps.svg\";\nimport { SnapMode } from \"@itwin/core-frontend\";\nimport type { CommonProps, IconSpec } from \"@itwin/core-react\";\nimport { Icon } from \"@itwin/core-react\";\nimport * as React from \"react\";\nimport { connect } from \"react-redux\";\nimport { UiFramework } from \"../UiFramework\";\nimport { SnapModePanel } from \"../layout/footer/snap-mode/Panel\";\nimport { Snap } from \"../layout/footer/snap-mode/Snap\";\nimport { StatusBarLabelIndicator } from \"../statusbar/LabelIndicator\";\n\n// cSpell:ignore multione\n\n/** Defines properties supported by the SnapMode Field Component.\n */\ninterface SnapModeFieldProps extends CommonProps {\n  snapMode: number;\n}\n\n/** Define the properties that will be used to represent the available snap modes. */\ninterface SnapModeFieldEntry {\n  label: string;\n  value: number;\n  iconName: string;\n}\n\nfunction getIconFromIconName(iconName: string): IconSpec {\n  let iconSpec = snapModeKeypoint;\n  switch (iconName) {\n    case \"snaps\":\n      iconSpec = snapModeKeypoint;\n      break;\n    case \"snaps-intersection\":\n      iconSpec = snapModeIntersection;\n      break;\n    case \"snaps-center\":\n      iconSpec = snapModeCenter;\n      break;\n    case \"snaps-nearest\":\n      iconSpec = snapModeNearest;\n      break;\n    case \"snaps-origin\":\n      iconSpec = snapModeOrigin;\n      break;\n    case \"snaps-midpoint\":\n      iconSpec = snapModeMidpoint;\n      break;\n    case \"snaps-bisector\":\n      iconSpec = snapModeBisector;\n      break;\n  }\n  return iconSpec;\n}\n\n/**\n * Snap Mode Field React component. This component is designed to be specified in a status bar definition. It will\n * display the active snap mode that AccuSnap will use and allow the user to select a new snap mode.\n */\nfunction SnapModeFieldComponent(props: SnapModeFieldProps) {\n  const snapModes: SnapModeFieldEntry[] = React.useMemo(\n    () => [\n      {\n        label: UiFramework.translate(\"snapModeField.keypoint\"),\n        value: SnapMode.NearestKeypoint as number,\n        iconName: \"snaps\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.intersection\"),\n        value: SnapMode.Intersection as number,\n        iconName: \"snaps-intersection\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.center\"),\n        value: SnapMode.Center as number,\n        iconName: \"snaps-center\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.nearest\"),\n        value: SnapMode.Nearest as number,\n        iconName: \"snaps-nearest\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.origin\"),\n        value: SnapMode.Origin as number,\n        iconName: \"snaps-origin\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.midpoint\"),\n        value: SnapMode.MidPoint as number,\n        iconName: \"snaps-midpoint\",\n      },\n      {\n        label: UiFramework.translate(\"snapModeField.bisector\"),\n        value: SnapMode.Bisector as number,\n        iconName: \"snaps-bisector\",\n      },\n    ],\n    []\n  );\n\n  /** Return icon class name for a specific snapMode. */\n  const getSnapModeIconNameFromMode = React.useCallback(\n    function (snapMode: number): string {\n      for (const mode of snapModes) {\n        if (mode.value === snapMode) return mode.iconName;\n      }\n\n      /* istanbul ignore else */\n      if (snapMode > 0) return \"snaps-multione\";\n\n      /* istanbul ignore next */\n      return \"placeholder\";\n    },\n    [snapModes]\n  );\n\n  const title = UiFramework.translate(\"snapModeField.snapMode\");\n  return (\n    <StatusBarLabelIndicator\n      iconSpec={getIconFromIconName(\n        getSnapModeIconNameFromMode(props.snapMode)\n      )}\n      title={title}\n      label={title}\n      popup={\n        <SnapModePanel title={title}>\n          {snapModes.map((item, index) => (\n            <Snap\n              key={`SM_${index}`}\n              onClick={() => UiFramework.setAccudrawSnapMode(item.value)}\n              isActive={(props.snapMode & item.value) === item.value}\n              icon={\n                <Icon\n                  className={`icon`}\n                  iconSpec={getIconFromIconName(item.iconName)}\n                />\n              }\n            >\n              {item.label}\n            </Snap>\n          ))}\n        </SnapModePanel>\n      }\n    />\n  );\n}\n\n/** Function used by Redux to map state data in Redux store to props that are used to render this component. */\nfunction mapStateToProps(state: any) {\n  const frameworkState = state[UiFramework.frameworkStateKey]; // since app sets up key, don't hard-code name\n  /* istanbul ignore next */\n  if (!frameworkState) return undefined;\n\n  return { snapMode: frameworkState.configurableUiState.snapMode };\n}\n\n// we declare the variable and export that rather than using export default.\n/**\n * Snap Mode Field React component. This component is designed to be specified in a status bar definition. It will\n * display the active snap mode that AccuSnap will use and allow the user to select a new snap mode.\n * This Field React component is Redux connected.\n * @public\n */\nexport const SnapModeField = connect(mapStateToProps)(SnapModeFieldComponent);\n"]}

package/lib/cjs/appui-react/statusfields/ViewAttributes.d.ts

@@ -25,7 +25,7 @@ export declare class ViewAttributesStatusField extends React.Component<CommonPro
     private getFlagState;
     private getToggleCameraItem;
     private getViewFlags;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export {};
 //# sourceMappingURL=ViewAttributes.d.ts.map

package/lib/cjs/appui-react/statusfields/tileloading/TileLoadingIndicator.d.ts

@@ -26,7 +26,7 @@ export declare class TileLoadingIndicator extends React.PureComponent<CommonProp
     componentDidMount(): void;
     componentWillUnmount(): void;
     /** Renders TileLoadingIndicator */
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export {};
 //# sourceMappingURL=TileLoadingIndicator.d.ts.map

package/lib/cjs/appui-react/statusfields/toolassistance/ToolAssistanceField.d.ts

@@ -1,11 +1,11 @@
 /** @packageDocumentation
  * @module Notification
  */
-import "./ToolAssistanceField.scss";
-import * as React from "react";
 import type { ToolAssistanceInstruction, ToolAssistanceInstructions } from "@itwin/core-frontend";
 import type { CommonProps, UiStateStorage } from "@itwin/core-react";
+import * as React from "react";
 import { UiStateStorageContext } from "../../uistate/useUiStateStorage";
+import "./ToolAssistanceField.scss";
 /** Properties of [[ToolAssistanceField]] component.
  * @public
  */

package/lib/cjs/appui-react/statusfields/toolassistance/ToolAssistanceField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToolAssistanceField.d.ts","sourceRoot":"","sources":["../../../../../src/appui-react/statusfields/toolassistance/ToolAssistanceField.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ToolAssistanceField.d.ts","sourceRoot":"","sources":["../../../../../src/appui-react/statusfields/toolassistance/ToolAssistanceField.tsx"],"names":[],"mappings":"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"}

package/lib/cjs/appui-react/statusfields/toolassistance/ToolAssistanceField.js

@@ -8,18 +8,25 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ToolAssistanceField = void 0;
-require("./ToolAssistanceField.scss");
-const classnames_1 = require("classnames");
-const React = require("react");
 const core_bentley_1 = require("@itwin/core-bentley");
 const core_frontend_1 = require("@itwin/core-frontend");
 const core_react_1 = require("@itwin/core-react");
-const appui_layout_react_1 = require("@itwin/appui-layout-react");
 const itwinui_react_1 = require("@itwin/itwinui-react");
+const classnames_1 = require("classnames");
+const React = require("react");
+const UiFramework_1 = require("../../UiFramework");
 const CursorPrompt_1 = require("../../cursor/cursorprompt/CursorPrompt");
 const MessageManager_1 = require("../../messages/MessageManager");
-const UiFramework_1 = require("../../UiFramework");
 const useUiStateStorage_1 = require("../../uistate/useUiStateStorage");
+require("./ToolAssistanceField.scss");
+const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
+const Dialog_1 = require("../../layout/footer/tool-assistance/Dialog");
+const Indicator_1 = require("../../layout/footer/tool-assistance/Indicator");
+const Instruction_1 = require("../../layout/footer/tool-assistance/Instruction");
+const Item_1 = require("../../layout/footer/tool-assistance/Item");
+const Separator_1 = require("../../layout/footer/tool-assistance/Separator");
+const StatusBar_1 = require("../../statusbar/StatusBar");
+const Dialog_2 = require("../../statusbar/dialog/Dialog");
 const accept_point_svg_1 = require("./accept-point.svg");
 const cursor_click_svg_1 = require("./cursor-click.svg");
 const gesture_one_finger_drag_svg_1 = require("./gesture-one-finger-drag.svg");
@@ -36,8 +43,6 @@ const mouse_click_wheel_drag_svg_1 = require("./mouse-click-wheel-drag.svg");
 const mouse_click_wheel_svg_1 = require("./mouse-click-wheel.svg");
 const touch_cursor_pan_svg_1 = require("./touch-cursor-pan.svg");
 const touch_cursor_point_svg_1 = require("./touch-cursor-point.svg");
-const Dialog_1 = require("../../statusbar/dialog/Dialog");
-const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
 /** Tool Assistance Field React component.
  * @public
  */
@@ -245,18 +250,18 @@ class ToolAssistanceField extends React.Component {
                 this.state.showMouseTouchTabs && (React.createElement(itwinui_react_1.Tabs.Wrapper, { type: "pill", value: String(this.state.mouseTouchTabIndex) },
                     React.createElement(itwinui_react_1.Tabs.TabList, { className: "uifw-toolAssistance-tabs" }, [mouseLabel, touchLabel].map((label, index) => (React.createElement(itwinui_react_1.Tabs.Tab, { key: index, className: "uifw-tab", value: String(index), label: label, onClick: async () => this._handleMouseTouchTab(index) })))))),
                 React.createElement("div", { className: "uifw-toolAssistance-content" },
-                    React.createElement(appui_layout_react_1.ToolAssistanceInstruction, { key: "main", image: ToolAssistanceField.getInstructionImage(instructions.mainInstruction), text: instructions.mainInstruction.text, isNew: instructions.mainInstruction.isNew }),
+                    React.createElement(Instruction_1.ToolAssistanceInstruction, { key: "main", image: ToolAssistanceField.getInstructionImage(instructions.mainInstruction), text: instructions.mainInstruction.text, isNew: instructions.mainInstruction.isNew }),
                     displayableSections &&
                         displayableSections.map((section, index1) => {
                             return (React.createElement(React.Fragment, { key: index1.toString() },
-                                React.createElement(appui_layout_react_1.ToolAssistanceSeparator, { key: index1.toString() }, section.label),
+                                React.createElement(Separator_1.ToolAssistanceSeparator, { key: index1.toString() }, section.label),
                                 this._getDisplayableInstructions(section).map((instruction, index2) => {
-                                    return (React.createElement(appui_layout_react_1.ToolAssistanceInstruction, { key: `${index1.toString()}-${index2.toString()}`, image: ToolAssistanceField.getInstructionImage(instruction), text: instruction.text, isNew: instruction.isNew }));
+                                    return (React.createElement(Instruction_1.ToolAssistanceInstruction, { key: `${index1.toString()}-${index2.toString()}`, image: ToolAssistanceField.getInstructionImage(instruction), text: instruction.text, isNew: instruction.isNew }));
                                 })));
                         }),
                     this.props.includePromptAtCursor && (React.createElement(React.Fragment, null,
-                        React.createElement(appui_layout_react_1.ToolAssistanceSeparator, { key: "prompt-sep" }),
-                        React.createElement(appui_layout_react_1.ToolAssistanceItem, { key: "prompt-item" },
+                        React.createElement(Separator_1.ToolAssistanceSeparator, { key: "prompt-sep" }),
+                        React.createElement(Item_1.ToolAssistanceItem, { key: "prompt-item" },
                             React.createElement(itwinui_react_1.ToggleSwitch, { label: UiFramework_1.UiFramework.translate("toolAssistance.promptAtCursor"), labelPosition: "right", checked: this.state.showPromptAtCursor, onChange: this._onPromptAtCursorChange })))))));
         }
         if (prompt)
@@ -271,12 +276,12 @@ class ToolAssistanceField extends React.Component {
         tooltip += UiFramework_1.UiFramework.translate("toolAssistance.moreInfo");
         return (React.createElement(React.Fragment, null,
             React.createElement("div", { style: { height: "100%" }, ref: this._handleTargetRef },
-                React.createElement(appui_layout_react_1.ToolAssistance, { icons: React.createElement(React.Fragment, null, toolIcon), indicatorRef: this._indicator, className: (0, classnames_1.default)("uifw-statusFields-toolassistance", this.props.className), style: this.props.style, onClick: this._handleToolAssistanceIndicatorClick, title: tooltip }, prompt)),
-            React.createElement(appui_layout_react_1.FooterPopup, { isOpen: this.state.isOpen, onClose: this._handleClose, onOutsideClick: this._handleOutsideClick, target: this._target, isPinned: this.state.isPinned },
-                React.createElement(appui_layout_react_1.ToolAssistanceDialog, { buttons: React.createElement(React.Fragment, null,
-                        !this.state.isPinned && (React.createElement(Dialog_1.StatusBarDialog.TitleBarButton, { onClick: this._handlePinButtonClick, title: UiFramework_1.UiFramework.translate("toolAssistance.pin") },
+                React.createElement(Indicator_1.ToolAssistance, { icons: React.createElement(React.Fragment, null, toolIcon), indicatorRef: this._indicator, className: (0, classnames_1.default)("uifw-statusFields-toolassistance", this.props.className), style: this.props.style, onClick: this._handleToolAssistanceIndicatorClick, title: tooltip }, prompt)),
+            React.createElement(StatusBar_1.StatusBar.Popup, { isOpen: this.state.isOpen, onClose: this._handleClose, onOutsideClick: this._handleOutsideClick, target: this._target, isPinned: this.state.isPinned },
+                React.createElement(Dialog_1.ToolAssistanceDialog, { buttons: React.createElement(React.Fragment, null,
+                        !this.state.isPinned && (React.createElement(Dialog_2.StatusBarDialog.TitleBarButton, { onClick: this._handlePinButtonClick, title: UiFramework_1.UiFramework.translate("toolAssistance.pin") },
                             React.createElement(core_react_1.Icon, { iconSpec: React.createElement(itwinui_icons_react_1.SvgPin, null) }))),
-                        this.state.isPinned && (React.createElement(Dialog_1.StatusBarDialog.TitleBarButton, { onClick: this._handleCloseButtonClick, title: core_react_1.UiCore.translate("dialog.close") },
+                        this.state.isPinned && (React.createElement(Dialog_2.StatusBarDialog.TitleBarButton, { onClick: this._handleCloseButtonClick, title: core_react_1.UiCore.translate("dialog.close") },
                             React.createElement(core_react_1.Icon, { iconSpec: React.createElement(itwinui_icons_react_1.SvgClose, null) })))), title: dialogTitle }, dialogContent))));
     }
     setIsOpen(isOpen) {
@@ -314,7 +319,7 @@ class ToolAssistanceField extends React.Component {
                     ? "uifw-toolassistance-svg"
                     : "uifw-toolassistance-icon-large";
                 image = (React.createElement("div", { className: className },
-                    React.createElement(core_react_1.Icon, { iconSpec: svgSource !== null && svgSource !== void 0 ? svgSource : instruction.image })));
+                    React.createElement(core_react_1.Icon, { iconSpec: svgSource ?? instruction.image })));
             }
         }
         else if (instruction.image === core_frontend_1.ToolAssistanceImage.Keyboard) {