@itwin/appui-react 4.1.0-dev.1 → 4.1.0

package/lib/cjs/appui-react/settings/quantityformatting/QuantityFormat.scss

@@ -1,119 +1,119 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "~@itwin/core-react/lib/cjs/core-react/inputs/variables";
-@import "~@itwin/core-react/lib/cjs/core-react/style/themecolors";
-
-.quantity-formatting-container {
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  width: 100%;
-  background: var(--iui-color-background);
-
-  *,
-  *:before,
-  *:after {
-    box-sizing: inherit;
-  }
-
-  .quantity-unit-system-selector-container {
-    padding: 20px 20px;
-    display: flex;
-    flex-direction: column;
-
-    > span.uicore-label {
-      font-size: 18px;
-    }
-  }
-
-  .uifw-quantity-format-section-label {
-    font-size: 18px;
-    margin-left: 20px;
-  }
-
-  .uifw-quantity-types-container {
-    display: flex;
-    height: 100%;
-    width: auto;
-
-    > .left-panel {
-      flex-direction: column;
-      min-width: 260px;
-      width: auto;
-      padding: 10px 50px 20px 20px;
-      height: auto;
-
-      ul.core-listbox.uifw-quantity-types {
-        height: 100%;
-
-        li.core-listbox-item {
-          line-height: 2em;
-        }
-      }
-    }
-
-    > .right-panel {
-      display: flex;
-      flex-direction: column;
-      width: auto;
-      height: auto;
-      min-width: 410px;
-      padding: 10px 20px 20px 0;
-
-      .uifw-quantity-types-right-top {
-        display: flex;
-        padding-bottom: 10px;
-
-        .uifw-quantity-types-right-top-sample {
-          display: grid;
-          grid-template-columns: auto 1fr;
-          row-gap: 0;
-          column-gap: 6px;
-          align-items: center;
-
-          .components-quantity-persistence-input {
-            width: 6.5em;
-
-            &.iui-input {
-              padding: $uicore-iui-input-padding;
-            }
-          }
-
-          span.components-quantity-formatted-sample {
-            margin-left: 10px;
-          }
-
-          > span.components-inline {
-            display: flex;
-            flex-direction: row;
-            align-items: center;
-            gap: 4px;
-            margin-right: 10px;
-          }
-        }
-      }
-
-      .uifw-quantity-types-formats {
-        display: flex;
-        flex-direction: column;
-        border: 1px solid var(--iui-color-border-subtle);
-        border-radius: var(--iui-border-radius-1);
-        height: auto;
-        overflow-y: auto;
-        box-sizing: border-box;
-        padding: 6px;
-        flex: 1 1 auto;
-      }
-
-      .components-button-panel {
-        padding-top: 6px;
-        display: flex;
-        justify-content: flex-end;
-        gap: 6px;
-      }
-    }
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/core-react/lib/cjs/core-react/inputs/variables";
+@import "~@itwin/core-react/lib/cjs/core-react/style/themecolors";
+
+.quantity-formatting-container {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  width: 100%;
+  background: var(--iui-color-background);
+
+  *,
+  *:before,
+  *:after {
+    box-sizing: inherit;
+  }
+
+  .quantity-unit-system-selector-container {
+    padding: 20px 20px;
+    display: flex;
+    flex-direction: column;
+
+    > span.uicore-label {
+      font-size: 18px;
+    }
+  }
+
+  .uifw-quantity-format-section-label {
+    font-size: 18px;
+    margin-left: 20px;
+  }
+
+  .uifw-quantity-types-container {
+    display: flex;
+    height: 100%;
+    width: auto;
+
+    > .left-panel {
+      flex-direction: column;
+      min-width: 260px;
+      width: auto;
+      padding: 10px 50px 20px 20px;
+      height: auto;
+
+      ul.core-listbox.uifw-quantity-types {
+        height: 100%;
+
+        li.core-listbox-item {
+          line-height: 2em;
+        }
+      }
+    }
+
+    > .right-panel {
+      display: flex;
+      flex-direction: column;
+      width: auto;
+      height: auto;
+      min-width: 410px;
+      padding: 10px 20px 20px 0;
+
+      .uifw-quantity-types-right-top {
+        display: flex;
+        padding-bottom: 10px;
+
+        .uifw-quantity-types-right-top-sample {
+          display: grid;
+          grid-template-columns: auto 1fr;
+          row-gap: 0;
+          column-gap: 6px;
+          align-items: center;
+
+          .components-quantity-persistence-input {
+            width: 6.5em;
+
+            &.iui-input {
+              padding: $uicore-iui-input-padding;
+            }
+          }
+
+          span.components-quantity-formatted-sample {
+            margin-left: 10px;
+          }
+
+          > span.components-inline {
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            gap: 4px;
+            margin-right: 10px;
+          }
+        }
+      }
+
+      .uifw-quantity-types-formats {
+        display: flex;
+        flex-direction: column;
+        border: 1px solid var(--iui-color-border-subtle);
+        border-radius: var(--iui-border-radius-1);
+        height: auto;
+        overflow-y: auto;
+        box-sizing: border-box;
+        padding: 6px;
+        flex: 1 1 auto;
+      }
+
+      .components-button-panel {
+        padding-top: 6px;
+        display: flex;
+        justify-content: flex-end;
+        gap: 6px;
+      }
+    }
+  }
+}

package/lib/cjs/appui-react/settings/quantityformatting/UnitSystemSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"UnitSystemSelector.js","sourceRoot":"","sources":["../../../../../src/appui-react/settings/quantityformatting/UnitSystemSelector.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,+BAA+B;AAC/B,mDAAgD;AAGhD,wDAA8C;AAW9C;;GAEG;AACH,SAAgB,kBAAkB,CAAC,KAA8B;IAC/D,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,yBAAW,CAAC,SAAS,CAAC,uCAAuC,CAAC,CAAC,CAAC;IAC3F,MAAM,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,GAAG,KAAK,CAAC;IACpF,MAAM,wBAAwB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,QAAuB,EAAE,EAAE;QAC7E,oBAAoB,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;IACzD,CAAC,EAAE,CAAC,oBAAoB,CAAC,CAAC,CAAC;IAE3B,MAAM,kBAAkB,GAAkC,CAAC,GAAG,oBAAoB,CAAC,MAAM,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;QACvG,QAAQ,GAAG,EAAE;YACX,KAAK,UAAU;gBACb,OAAO;oBACL,KAAK,EAAE,UAAU;oBACjB,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,wCAAwC,CAAC;iBACvE,CAAC;YACJ,KAAK,aAAa;gBAChB,OAAO;oBACL,KAAK,EAAE,aAAa;oBACpB,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,oCAAoC,CAAC;iBACnE,CAAC;YACJ,KAAK,UAAU;gBACb,OAAO;oBACL,KAAK,EAAE,UAAU;oBACjB,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,iCAAiC,CAAC;iBAChE,CAAC;YACJ,KAAK,QAAQ,CAAC;YACd;gBACE,OAAO;oBACL,KAAK,EAAE,QAAQ;oBACf,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,+BAA+B,CAAC;iBAC9D,CAAC;SACL;IACH,CAAC,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,oBAAoB,CAAC,GAAG,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IAE5H,OAAO,CACL,6BAAK,SAAS,EAAC,yCAAyC;QACtD,8BAAM,SAAS,EAAE,cAAc,IAAG,KAAK,CAAC,OAAO,CAAQ;QACvD,oBAAC,sBAAM,mBAAa,oBAAoB,EACtC,KAAK,EAAE,aAAa,EACpB,OAAO,EAAE,kBAAkB,EAAE,QAAQ,EAAE,wBAAwB,EAC/D,IAAI,EAAC,OAAO,GACZ,CACE,CACP,CAAC;AACJ,CAAC;AA7CD,gDA6CC","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 Settings\n */\n\nimport * as React from \"react\";\nimport { UiFramework } from \"../../UiFramework\";\nimport type { UnitSystemKey } from \"@itwin/core-quantity\";\nimport type { SelectOption } from \"@itwin/itwinui-react\";\nimport { Select } from \"@itwin/itwinui-react\";\n\n/** Props for [[UnitSystemSelector]]\n * @beta\n */\nexport interface UnitSystemSelectorProps {\n  selectedUnitSystemKey: UnitSystemKey;\n  onUnitSystemSelected: (unitSystem: UnitSystemKey) => void;\n  availableUnitSystems: Set<UnitSystemKey>;\n}\n\n/** Select control to set the \"active\" Presentation Unit System. This setting determine what units are display for quantity values (i.e. foot vs meter).\n * @alpha\n */\nexport function UnitSystemSelector(props: UnitSystemSelectorProps) { // eslint-disable-line @typescript-eslint/naming-convention\n  const label = React.useRef(UiFramework.translate(\"presentationUnitSystem.selector-label\"));\n  const { selectedUnitSystemKey, onUnitSystemSelected, availableUnitSystems } = props;\n  const handleUnitSystemSelected = React.useCallback((newValue: UnitSystemKey) => {\n    onUnitSystemSelected && onUnitSystemSelected(newValue);\n  }, [onUnitSystemSelected]);\n\n  const displayUnitSystems: SelectOption<UnitSystemKey>[] = [...availableUnitSystems.values()].map((sys) => {\n    switch (sys) {\n      case \"imperial\":\n        return {\n          value: \"imperial\",\n          label: UiFramework.translate(\"presentationUnitSystem.BritishImperial\"),\n        };\n      case \"usCustomary\":\n        return {\n          value: \"usCustomary\",\n          label: UiFramework.translate(\"presentationUnitSystem.USCustomary\"),\n        };\n      case \"usSurvey\":\n        return {\n          value: \"usSurvey\",\n          label: UiFramework.translate(\"presentationUnitSystem.USSurvey\"),\n        };\n      case \"metric\":\n      default:\n        return {\n          value: \"metric\",\n          label: UiFramework.translate(\"presentationUnitSystem.Metric\"),\n        };\n    }\n  });\n\n  const unitSystemKey = availableUnitSystems.has(selectedUnitSystemKey) ? selectedUnitSystemKey : displayUnitSystems[0].value;\n\n  return (\n    <div className=\"quantity-unit-system-selector-container\">\n      <span className={\"uicore-label\"}>{label.current}</span>\n      <Select data-testid=\"unitSystemSelector\"\n        value={unitSystemKey}\n        options={displayUnitSystems} onChange={handleUnitSystemSelected}\n        size=\"small\"\n      />\n    </div>\n  );\n}\n\n"]}
+{"version":3,"file":"UnitSystemSelector.js","sourceRoot":"","sources":["../../../../../src/appui-react/settings/quantityformatting/UnitSystemSelector.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,+BAA+B;AAC/B,mDAAgD;AAGhD,wDAA8C;AAW9C;;GAEG;AACH,SAAgB,kBAAkB,CAAC,KAA8B;IAC/D,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,yBAAW,CAAC,SAAS,CAAC,uCAAuC,CAAC,CAAC,CAAC;IAC3F,MAAM,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,GAAG,KAAK,CAAC;IACpF,MAAM,wBAAwB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,QAAuB,EAAE,EAAE;QAC7E,oBAAoB,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;IACzD,CAAC,EAAE,CAAC,oBAAoB,CAAC,CAAC,CAAC;IAE3B,MAAM,kBAAkB,GAAkC,CAAC,GAAG,oBAAoB,CAAC,MAAM,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;QACvG,QAAQ,GAAG,EAAE;YACX,KAAK,UAAU;gBACb,OAAO;oBACL,KAAK,EAAE,UAAU;oBACjB,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,wCAAwC,CAAC;iBACvE,CAAC;YACJ,KAAK,aAAa;gBAChB,OAAO;oBACL,KAAK,EAAE,aAAa;oBACpB,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,oCAAoC,CAAC;iBACnE,CAAC;YACJ,KAAK,UAAU;gBACb,OAAO;oBACL,KAAK,EAAE,UAAU;oBACjB,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,iCAAiC,CAAC;iBAChE,CAAC;YACJ,KAAK,QAAQ,CAAC;YACd;gBACE,OAAO;oBACL,KAAK,EAAE,QAAQ;oBACf,KAAK,EAAE,yBAAW,CAAC,SAAS,CAAC,+BAA+B,CAAC;iBAC9D,CAAC;SACL;IACH,CAAC,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,oBAAoB,CAAC,GAAG,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IAE5H,OAAO,CACL,6BAAK,SAAS,EAAC,yCAAyC;QACtD,8BAAM,SAAS,EAAE,cAAc,IAAG,KAAK,CAAC,OAAO,CAAQ;QACvD,oBAAC,sBAAM,mBAAa,oBAAoB,EACtC,KAAK,EAAE,aAAa,EACpB,OAAO,EAAE,kBAAkB,EAAE,QAAQ,EAAE,wBAAwB,EAC/D,IAAI,EAAC,OAAO,GACZ,CACE,CACP,CAAC;AACJ,CAAC;AA7CD,gDA6CC","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 Settings\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { UiFramework } from \"../../UiFramework\";\r\nimport type { UnitSystemKey } from \"@itwin/core-quantity\";\r\nimport type { SelectOption } from \"@itwin/itwinui-react\";\r\nimport { Select } from \"@itwin/itwinui-react\";\r\n\r\n/** Props for [[UnitSystemSelector]]\r\n * @beta\r\n */\r\nexport interface UnitSystemSelectorProps {\r\n  selectedUnitSystemKey: UnitSystemKey;\r\n  onUnitSystemSelected: (unitSystem: UnitSystemKey) => void;\r\n  availableUnitSystems: Set<UnitSystemKey>;\r\n}\r\n\r\n/** Select control to set the \"active\" Presentation Unit System. This setting determine what units are display for quantity values (i.e. foot vs meter).\r\n * @alpha\r\n */\r\nexport function UnitSystemSelector(props: UnitSystemSelectorProps) { // eslint-disable-line @typescript-eslint/naming-convention\r\n  const label = React.useRef(UiFramework.translate(\"presentationUnitSystem.selector-label\"));\r\n  const { selectedUnitSystemKey, onUnitSystemSelected, availableUnitSystems } = props;\r\n  const handleUnitSystemSelected = React.useCallback((newValue: UnitSystemKey) => {\r\n    onUnitSystemSelected && onUnitSystemSelected(newValue);\r\n  }, [onUnitSystemSelected]);\r\n\r\n  const displayUnitSystems: SelectOption<UnitSystemKey>[] = [...availableUnitSystems.values()].map((sys) => {\r\n    switch (sys) {\r\n      case \"imperial\":\r\n        return {\r\n          value: \"imperial\",\r\n          label: UiFramework.translate(\"presentationUnitSystem.BritishImperial\"),\r\n        };\r\n      case \"usCustomary\":\r\n        return {\r\n          value: \"usCustomary\",\r\n          label: UiFramework.translate(\"presentationUnitSystem.USCustomary\"),\r\n        };\r\n      case \"usSurvey\":\r\n        return {\r\n          value: \"usSurvey\",\r\n          label: UiFramework.translate(\"presentationUnitSystem.USSurvey\"),\r\n        };\r\n      case \"metric\":\r\n      default:\r\n        return {\r\n          value: \"metric\",\r\n          label: UiFramework.translate(\"presentationUnitSystem.Metric\"),\r\n        };\r\n    }\r\n  });\r\n\r\n  const unitSystemKey = availableUnitSystems.has(selectedUnitSystemKey) ? selectedUnitSystemKey : displayUnitSystems[0].value;\r\n\r\n  return (\r\n    <div className=\"quantity-unit-system-selector-container\">\r\n      <span className={\"uicore-label\"}>{label.current}</span>\r\n      <Select data-testid=\"unitSystemSelector\"\r\n        value={unitSystemKey}\r\n        options={displayUnitSystems} onChange={handleUnitSystemSelected}\r\n        size=\"small\"\r\n      />\r\n    </div>\r\n  );\r\n}\r\n\r\n"]}

package/lib/cjs/appui-react/settings/ui/UiSettingsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"UiSettingsPage.js","sourceRoot":"","sources":["../../../../../src/appui-react/settings/ui/UiSettingsPage.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 Settings\n */\n\n// cSpell:ignore configurableui checkmark\n\nimport widowSettingsIconSvg from \"@bentley/icons-generic/icons/window-settings.svg\";\nimport \"./UiSettingsPage.scss\";\nimport * as React from \"react\";\nimport type { SettingsTabEntry } from \"@itwin/core-react\";\nimport { UiFramework } from \"../../UiFramework\";\nimport { ColorTheme, SYSTEM_PREFERRED_COLOR_THEME } from \"../../theme/ThemeManager\";\nimport { SyncUiEventDispatcher, SyncUiEventId } from \"../../syncui/SyncUiEventDispatcher\";\nimport type { UiSyncEventArgs } from \"@itwin/appui-abstract\";\nimport { IconSpecUtilities } from \"@itwin/appui-abstract\";\nimport type { SelectOption} from \"@itwin/itwinui-react\";\nimport { Select, Slider, ToggleSwitch } from \"@itwin/itwinui-react\";\n\n/** UiSettingsPage displaying the active UI settings. This page lets users set the following settings.\n *\n * - theme - Dark, Light, or based on OS preference.\n * - auto hide - Starts a timer and blanks out ui components that overlay content if there is no mouse movement for a period of time.\n * - drag interaction - If set, toolbar group buttons require a press and drag or a long press to open. In this mode a child action\n * item is shown as the group button and is activated when button is clicked. If a different child item is selected, it becomes the\n * active group button item.\n * - use proximity - Changes the opacity of toolbar from transparent to opaque as the mouse moves closer.\n * - snap widget opacity - triggers an abrupt change from transparent to opaque for tool and navigation widgets, instead of a gradual change based on mouse location.\n * - widget opacity - determines how transparent floating widgets in V2 and all widgets in V1 become when the mouse in not in them.\n * - UI version - if allowed by props, the UI version can be toggled between V1 and V2.\n *\n * @beta\n */\nexport function UiSettingsPage() {\n  const themeTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.themeTitle\"));\n  const themeDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.themeDescription\"));\n  const autoHideTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.autoHideTitle\"));\n  const autoHideDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.autoHideDescription\"));\n  const dragInteractionTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.dragInteractionTitle\"));\n  const dragInteractionDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.dragInteractionDescription\"));\n  const useProximityOpacityTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.useProximityOpacityTitle\"));\n  const useProximityOpacityDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.useProximityOpacityDescription\"));\n  const snapWidgetOpacityTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.snapWidgetOpacityTitle\"));\n  const snapWidgetOpacityDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.snapWidgetOpacityDescription\"));\n  const darkLabel = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.dark\"));\n  const lightLabel = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.light\"));\n  const systemPreferredLabel = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.systemPreferred\"));\n  const widgetOpacityTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.widgetOpacityTitle\"));\n  const widgetOpacityDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.widgetOpacityDescription\"));\n  const widgetIconTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.widgetIconTitle\"));\n  const widgetIconDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.widgetIconDescription\"));\n  const autoCollapseUnpinnedPanelsTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.autoCollapseUnpinnedPanelsTitle\"));\n  const autoCollapseUnpinnedPanelsDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.autoCollapseUnpinnedPanelsDescription\"));\n  const animateToolSettingsTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.animateToolSettingsTitle\"));\n  const animateToolSettingsDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.animateToolSettingsDescription\"));\n  const useToolAsToolSettingsLabelTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.useToolAsToolSettingsLabelTitle\"));\n  const useToolAsToolSettingsLabelDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.useToolAsToolSettingsLabelDescription\"));\n  const toolbarOpacityTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.toolbarOpacityTitle\"));\n  const toolbarOpacityDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.toolbarOpacityDescription\"));\n\n  const [theme, setTheme] = React.useState(() => UiFramework.getColorTheme());\n  const [useDragInteraction, setUseDragInteraction] = React.useState(() => UiFramework.useDragInteraction);\n  const [showWidgetIcon, setShowWidgetIcon] = React.useState(() => UiFramework.showWidgetIcon);\n  const [autoCollapseUnpinnedPanels, setAutoCollapseUnpinnedPanels] = React.useState(() => UiFramework.autoCollapseUnpinnedPanels);\n  const [animateToolSettings, setAnimateToolSettings] = React.useState(() => UiFramework.animateToolSettings);\n  const [useToolAsToolSettingsLabel, setUseToolAsToolSettingsLabel] = React.useState(() => UiFramework.useToolAsToolSettingsLabel);\n  const [widgetOpacity, setWidgetOpacity] = React.useState(() => UiFramework.getWidgetOpacity());\n  const [autoHideUi, setAutoHideUi] = React.useState(() => UiFramework.visibility.autoHideUi);\n  const [useProximityOpacity, setUseProximityOpacity] = React.useState(() => UiFramework.visibility.useProximityOpacity);\n  const [snapWidgetOpacity, setSnapWidgetOpacity] = React.useState(() => UiFramework.visibility.snapWidgetOpacity);\n  const [toolbarOpacity, setToolbarOpacity] = React.useState(() => UiFramework.getToolbarOpacity());\n\n  React.useEffect(() => {\n    const syncIdsOfInterest = [\"configurableui:set_theme\", \"configurableui:set_widget_opacity\", \"configurableui:set-show-widget-icon\",\n      \"configurableui:set-drag-interaction\", \"configurableui:set-framework-version\",\n      \"configurableui:set-auto-collapse-unpinned-panels\", \"configurableui:set-animate-tool-settings\",\n      \"configurableui:set-use-tool-as-tool-settings-label\", \"configurableui:set-toolbar-opacity\", SyncUiEventId.ShowHideManagerSettingChange];\n\n    const handleSyncUiEvent = (args: UiSyncEventArgs) => {\n      // istanbul ignore else\n      if (syncIdsOfInterest.some((value: string): boolean => args.eventIds.has(value))) {\n        if (UiFramework.getColorTheme() !== theme)\n          setTheme(UiFramework.getColorTheme());\n        if (UiFramework.visibility.autoHideUi !== autoHideUi)\n          setAutoHideUi(UiFramework.visibility.autoHideUi);\n        if (UiFramework.useDragInteraction !== useDragInteraction)\n          setUseDragInteraction(UiFramework.useDragInteraction);\n        if (UiFramework.showWidgetIcon !== showWidgetIcon)\n          setShowWidgetIcon(UiFramework.showWidgetIcon);\n        if (UiFramework.autoCollapseUnpinnedPanels !== autoCollapseUnpinnedPanels)\n          setAutoCollapseUnpinnedPanels(UiFramework.autoCollapseUnpinnedPanels);\n        if (UiFramework.getWidgetOpacity() !== widgetOpacity)\n          setWidgetOpacity(UiFramework.getWidgetOpacity());\n        if (UiFramework.visibility.autoHideUi !== autoHideUi)\n          setAutoHideUi(UiFramework.visibility.autoHideUi);\n        if (UiFramework.visibility.useProximityOpacity !== useProximityOpacity)\n          setUseProximityOpacity(UiFramework.visibility.useProximityOpacity);\n        if (UiFramework.visibility.snapWidgetOpacity !== snapWidgetOpacity)\n          setSnapWidgetOpacity(UiFramework.visibility.snapWidgetOpacity);\n        if (UiFramework.animateToolSettings !== animateToolSettings)\n          setAnimateToolSettings(UiFramework.animateToolSettings);\n        if (UiFramework.useToolAsToolSettingsLabel !== useToolAsToolSettingsLabel)\n          setUseToolAsToolSettingsLabel(UiFramework.useToolAsToolSettingsLabel);\n        if (UiFramework.getToolbarOpacity() !== toolbarOpacity)\n          setToolbarOpacity(UiFramework.getToolbarOpacity());\n      }\n    };\n    return SyncUiEventDispatcher.onSyncUiEvent.addListener(handleSyncUiEvent);\n  }, [autoCollapseUnpinnedPanels, autoHideUi, showWidgetIcon, snapWidgetOpacity, theme,\n    useDragInteraction, useProximityOpacity, widgetOpacity, animateToolSettings, useToolAsToolSettingsLabel, toolbarOpacity]);\n\n  const defaultThemeOption = { label: systemPreferredLabel.current, value: SYSTEM_PREFERRED_COLOR_THEME };\n  const themeOptions: SelectOption<string>[] = [\n    defaultThemeOption,\n    { label: lightLabel.current, value: ColorTheme.Light },\n    { label: darkLabel.current, value: ColorTheme.Dark },\n  ];\n\n  const onThemeChange = React.useCallback((newValue: string) => {\n    UiFramework.setColorTheme(newValue);\n  }, []);\n\n  const onAutoHideChange = React.useCallback(async () => {\n    UiFramework.visibility.autoHideUi = !autoHideUi;\n  }, [autoHideUi]);\n\n  const onUseProximityOpacityChange = React.useCallback(async () => {\n    UiFramework.visibility.useProximityOpacity = !useProximityOpacity;\n  }, [useProximityOpacity]);\n\n  const onSnapWidgetOpacityChange = React.useCallback(async () => {\n    UiFramework.visibility.snapWidgetOpacity = !snapWidgetOpacity;\n  }, [snapWidgetOpacity]);\n\n  const onWidgetIconChange = React.useCallback(async () => {\n    UiFramework.setShowWidgetIcon(!showWidgetIcon);\n  }, [showWidgetIcon]);\n\n  const onAutoCollapseUnpinnedPanelsChange = React.useCallback(async () => {\n    UiFramework.setAutoCollapseUnpinnedPanels(!autoCollapseUnpinnedPanels);\n  }, [autoCollapseUnpinnedPanels]);\n\n  const onWidgetOpacityChange = React.useCallback(async (values: readonly number[]) => {\n    // istanbul ignore else\n    if (values.length > 0) {\n      UiFramework.setWidgetOpacity(values[0]);\n    }\n  }, []);\n\n  const onToggleDragInteraction = React.useCallback(async () => {\n    UiFramework.setUseDragInteraction(!useDragInteraction);\n  }, [useDragInteraction]);\n\n  const OnToggleAnimateToolSettings = React.useCallback(async () => {\n    UiFramework.setAnimateToolSettings(!animateToolSettings);\n  }, [animateToolSettings]);\n  const currentTheme = UiFramework.getColorTheme();\n\n  const OnToggleUseToolAsToolSettingsLabel = React.useCallback(async () => {\n    UiFramework.setUseToolAsToolSettingsLabel(!useToolAsToolSettingsLabel);\n  }, [useToolAsToolSettingsLabel]);\n\n  const onToolbarOpacityChange = React.useCallback(async (values: readonly number[]) => {\n    // istanbul ignore else\n    if (values.length > 0) {\n      UiFramework.setToolbarOpacity(values[0]);\n    }\n  }, []);\n\n  return (\n    <div className=\"uifw-settings\">\n      <SettingsItem title={themeTitle.current} description={themeDescription.current}\n        settingUi={\n          <div data-testid=\"select-theme-container\" className=\"select-theme-container\">\n            <Select\n              value={currentTheme}\n              onChange={onThemeChange}\n              options={themeOptions}\n              data-testid=\"select-theme\"\n              size=\"small\"\n            />\n          </div>\n        }\n      />\n      <SettingsItem title={autoHideTitle.current} description={autoHideDescription.current}\n        settingUi={<ToggleSwitch checked={autoHideUi} onChange={onAutoHideChange} />}\n      />\n      <SettingsItem title={dragInteractionTitle.current} description={dragInteractionDescription.current}\n        settingUi={<ToggleSwitch checked={useDragInteraction} onChange={onToggleDragInteraction} />}\n      />\n      <SettingsItem title={useProximityOpacityTitle.current} description={useProximityOpacityDescription.current}\n        settingUi={<ToggleSwitch checked={useProximityOpacity} onChange={onUseProximityOpacityChange} />}\n      />\n      <SettingsItem title={snapWidgetOpacityTitle.current} description={snapWidgetOpacityDescription.current}\n        settingUi={<ToggleSwitch checked={snapWidgetOpacity} onChange={onSnapWidgetOpacityChange} />}\n      />\n      <SettingsItem title={widgetIconTitle.current} description={widgetIconDescription.current}\n        settingUi={<ToggleSwitch checked={showWidgetIcon} onChange={onWidgetIconChange} />}\n      />\n      <SettingsItem title={autoCollapseUnpinnedPanelsTitle.current} description={autoCollapseUnpinnedPanelsDescription.current}\n        settingUi={<ToggleSwitch checked={autoCollapseUnpinnedPanels} onChange={onAutoCollapseUnpinnedPanelsChange} />}\n      />\n      <SettingsItem title={animateToolSettingsTitle.current} description={animateToolSettingsDescription.current}\n        settingUi={<ToggleSwitch checked={animateToolSettings} onChange={OnToggleAnimateToolSettings} />}\n      />\n      <SettingsItem title={useToolAsToolSettingsLabelTitle.current} description={useToolAsToolSettingsLabelDescription.current}\n        settingUi={<ToggleSwitch checked={useToolAsToolSettingsLabel} onChange={OnToggleUseToolAsToolSettingsLabel} />}\n      />\n      <SettingsItem title={toolbarOpacityTitle.current} description={toolbarOpacityDescription.current}\n        settingUi={\n          <Slider style={{ flex: \"1\" }} values={[toolbarOpacity]} step={0.05} onChange={onToolbarOpacityChange}\n            min={0.20} max={1.0} maxLabel=\"1.0\" tickLabels={[\"\", \"\", \"\", \"\", \"\"]} />\n        }\n      />\n      <SettingsItem title={widgetOpacityTitle.current} description={widgetOpacityDescription.current}\n        settingUi={\n          <Slider style={{ flex: \"1\" }} values={[widgetOpacity]} step={0.05} onChange={onWidgetOpacityChange}\n            min={0.20} max={1.0} maxLabel=\"1.0\" tickLabels={[\"\", \"\", \"\", \"\", \"\"]} />\n        }\n      />\n    </div>\n  );\n}\n\ninterface SettingsItemProps {\n  title: string;\n  description: string;\n  settingUi: React.ReactNode;\n}\n\nfunction SettingsItem(props: SettingsItemProps) {\n  const { title, description, settingUi } = props;\n\n  return (\n    <div className=\"uifw-settings-item\">\n      <div className=\"panel left-panel\">\n        <span className=\"title\">{title}</span>\n        <span className=\"description\">{description}</span>\n      </div>\n      <div className=\"panel right-panel\">\n        {settingUi}\n      </div>\n    </div>\n  );\n}\n\n/**\n * Return a SettingsTabEntry that can be used to define the available settings that can be set for an application.\n * @param itemPriority - Used to define the order of the entry in the Settings Stage\n * @beta\n */\nexport function getUiSettingsManagerEntry(itemPriority: number): SettingsTabEntry {\n  return {\n    itemPriority, tabId: \"uifw:UiStateStorage\",\n    label: UiFramework.translate(\"settings.uiSettingsPage.label\"),\n    icon: IconSpecUtilities.createWebComponentIconSpec(widowSettingsIconSvg),\n    page: <UiSettingsPage />,\n    isDisabled: false,\n    tooltip: UiFramework.translate(\"settings.uiSettingsPage.tooltip\"),\n  };\n}\n"]}
+{"version":3,"file":"UiSettingsPage.js","sourceRoot":"","sources":["../../../../../src/appui-react/settings/ui/UiSettingsPage.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Settings\r\n */\r\n\r\n// cSpell:ignore configurableui checkmark\r\n\r\nimport widowSettingsIconSvg from \"@bentley/icons-generic/icons/window-settings.svg\";\r\nimport \"./UiSettingsPage.scss\";\r\nimport * as React from \"react\";\r\nimport type { SettingsTabEntry } from \"@itwin/core-react\";\r\nimport { UiFramework } from \"../../UiFramework\";\r\nimport { ColorTheme, SYSTEM_PREFERRED_COLOR_THEME } from \"../../theme/ThemeManager\";\r\nimport { SyncUiEventDispatcher, SyncUiEventId } from \"../../syncui/SyncUiEventDispatcher\";\r\nimport type { UiSyncEventArgs } from \"@itwin/appui-abstract\";\r\nimport { IconSpecUtilities } from \"@itwin/appui-abstract\";\r\nimport type { SelectOption} from \"@itwin/itwinui-react\";\r\nimport { Select, Slider, ToggleSwitch } from \"@itwin/itwinui-react\";\r\n\r\n/** UiSettingsPage displaying the active UI settings. This page lets users set the following settings.\r\n *\r\n * - theme - Dark, Light, or based on OS preference.\r\n * - auto hide - Starts a timer and blanks out ui components that overlay content if there is no mouse movement for a period of time.\r\n * - drag interaction - If set, toolbar group buttons require a press and drag or a long press to open. In this mode a child action\r\n * item is shown as the group button and is activated when button is clicked. If a different child item is selected, it becomes the\r\n * active group button item.\r\n * - use proximity - Changes the opacity of toolbar from transparent to opaque as the mouse moves closer.\r\n * - snap widget opacity - triggers an abrupt change from transparent to opaque for tool and navigation widgets, instead of a gradual change based on mouse location.\r\n * - widget opacity - determines how transparent floating widgets in V2 and all widgets in V1 become when the mouse in not in them.\r\n * - UI version - if allowed by props, the UI version can be toggled between V1 and V2.\r\n *\r\n * @beta\r\n */\r\nexport function UiSettingsPage() {\r\n  const themeTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.themeTitle\"));\r\n  const themeDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.themeDescription\"));\r\n  const autoHideTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.autoHideTitle\"));\r\n  const autoHideDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.autoHideDescription\"));\r\n  const dragInteractionTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.dragInteractionTitle\"));\r\n  const dragInteractionDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.dragInteractionDescription\"));\r\n  const useProximityOpacityTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.useProximityOpacityTitle\"));\r\n  const useProximityOpacityDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.useProximityOpacityDescription\"));\r\n  const snapWidgetOpacityTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.snapWidgetOpacityTitle\"));\r\n  const snapWidgetOpacityDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.snapWidgetOpacityDescription\"));\r\n  const darkLabel = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.dark\"));\r\n  const lightLabel = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.light\"));\r\n  const systemPreferredLabel = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.systemPreferred\"));\r\n  const widgetOpacityTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.widgetOpacityTitle\"));\r\n  const widgetOpacityDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.widgetOpacityDescription\"));\r\n  const widgetIconTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.widgetIconTitle\"));\r\n  const widgetIconDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.widgetIconDescription\"));\r\n  const autoCollapseUnpinnedPanelsTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.autoCollapseUnpinnedPanelsTitle\"));\r\n  const autoCollapseUnpinnedPanelsDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.autoCollapseUnpinnedPanelsDescription\"));\r\n  const animateToolSettingsTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.animateToolSettingsTitle\"));\r\n  const animateToolSettingsDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.animateToolSettingsDescription\"));\r\n  const useToolAsToolSettingsLabelTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.useToolAsToolSettingsLabelTitle\"));\r\n  const useToolAsToolSettingsLabelDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.useToolAsToolSettingsLabelDescription\"));\r\n  const toolbarOpacityTitle = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.toolbarOpacityTitle\"));\r\n  const toolbarOpacityDescription = React.useRef(UiFramework.translate(\"settings.uiSettingsPage.toolbarOpacityDescription\"));\r\n\r\n  const [theme, setTheme] = React.useState(() => UiFramework.getColorTheme());\r\n  const [useDragInteraction, setUseDragInteraction] = React.useState(() => UiFramework.useDragInteraction);\r\n  const [showWidgetIcon, setShowWidgetIcon] = React.useState(() => UiFramework.showWidgetIcon);\r\n  const [autoCollapseUnpinnedPanels, setAutoCollapseUnpinnedPanels] = React.useState(() => UiFramework.autoCollapseUnpinnedPanels);\r\n  const [animateToolSettings, setAnimateToolSettings] = React.useState(() => UiFramework.animateToolSettings);\r\n  const [useToolAsToolSettingsLabel, setUseToolAsToolSettingsLabel] = React.useState(() => UiFramework.useToolAsToolSettingsLabel);\r\n  const [widgetOpacity, setWidgetOpacity] = React.useState(() => UiFramework.getWidgetOpacity());\r\n  const [autoHideUi, setAutoHideUi] = React.useState(() => UiFramework.visibility.autoHideUi);\r\n  const [useProximityOpacity, setUseProximityOpacity] = React.useState(() => UiFramework.visibility.useProximityOpacity);\r\n  const [snapWidgetOpacity, setSnapWidgetOpacity] = React.useState(() => UiFramework.visibility.snapWidgetOpacity);\r\n  const [toolbarOpacity, setToolbarOpacity] = React.useState(() => UiFramework.getToolbarOpacity());\r\n\r\n  React.useEffect(() => {\r\n    const syncIdsOfInterest = [\"configurableui:set_theme\", \"configurableui:set_widget_opacity\", \"configurableui:set-show-widget-icon\",\r\n      \"configurableui:set-drag-interaction\", \"configurableui:set-framework-version\",\r\n      \"configurableui:set-auto-collapse-unpinned-panels\", \"configurableui:set-animate-tool-settings\",\r\n      \"configurableui:set-use-tool-as-tool-settings-label\", \"configurableui:set-toolbar-opacity\", SyncUiEventId.ShowHideManagerSettingChange];\r\n\r\n    const handleSyncUiEvent = (args: UiSyncEventArgs) => {\r\n      // istanbul ignore else\r\n      if (syncIdsOfInterest.some((value: string): boolean => args.eventIds.has(value))) {\r\n        if (UiFramework.getColorTheme() !== theme)\r\n          setTheme(UiFramework.getColorTheme());\r\n        if (UiFramework.visibility.autoHideUi !== autoHideUi)\r\n          setAutoHideUi(UiFramework.visibility.autoHideUi);\r\n        if (UiFramework.useDragInteraction !== useDragInteraction)\r\n          setUseDragInteraction(UiFramework.useDragInteraction);\r\n        if (UiFramework.showWidgetIcon !== showWidgetIcon)\r\n          setShowWidgetIcon(UiFramework.showWidgetIcon);\r\n        if (UiFramework.autoCollapseUnpinnedPanels !== autoCollapseUnpinnedPanels)\r\n          setAutoCollapseUnpinnedPanels(UiFramework.autoCollapseUnpinnedPanels);\r\n        if (UiFramework.getWidgetOpacity() !== widgetOpacity)\r\n          setWidgetOpacity(UiFramework.getWidgetOpacity());\r\n        if (UiFramework.visibility.autoHideUi !== autoHideUi)\r\n          setAutoHideUi(UiFramework.visibility.autoHideUi);\r\n        if (UiFramework.visibility.useProximityOpacity !== useProximityOpacity)\r\n          setUseProximityOpacity(UiFramework.visibility.useProximityOpacity);\r\n        if (UiFramework.visibility.snapWidgetOpacity !== snapWidgetOpacity)\r\n          setSnapWidgetOpacity(UiFramework.visibility.snapWidgetOpacity);\r\n        if (UiFramework.animateToolSettings !== animateToolSettings)\r\n          setAnimateToolSettings(UiFramework.animateToolSettings);\r\n        if (UiFramework.useToolAsToolSettingsLabel !== useToolAsToolSettingsLabel)\r\n          setUseToolAsToolSettingsLabel(UiFramework.useToolAsToolSettingsLabel);\r\n        if (UiFramework.getToolbarOpacity() !== toolbarOpacity)\r\n          setToolbarOpacity(UiFramework.getToolbarOpacity());\r\n      }\r\n    };\r\n    return SyncUiEventDispatcher.onSyncUiEvent.addListener(handleSyncUiEvent);\r\n  }, [autoCollapseUnpinnedPanels, autoHideUi, showWidgetIcon, snapWidgetOpacity, theme,\r\n    useDragInteraction, useProximityOpacity, widgetOpacity, animateToolSettings, useToolAsToolSettingsLabel, toolbarOpacity]);\r\n\r\n  const defaultThemeOption = { label: systemPreferredLabel.current, value: SYSTEM_PREFERRED_COLOR_THEME };\r\n  const themeOptions: SelectOption<string>[] = [\r\n    defaultThemeOption,\r\n    { label: lightLabel.current, value: ColorTheme.Light },\r\n    { label: darkLabel.current, value: ColorTheme.Dark },\r\n  ];\r\n\r\n  const onThemeChange = React.useCallback((newValue: string) => {\r\n    UiFramework.setColorTheme(newValue);\r\n  }, []);\r\n\r\n  const onAutoHideChange = React.useCallback(async () => {\r\n    UiFramework.visibility.autoHideUi = !autoHideUi;\r\n  }, [autoHideUi]);\r\n\r\n  const onUseProximityOpacityChange = React.useCallback(async () => {\r\n    UiFramework.visibility.useProximityOpacity = !useProximityOpacity;\r\n  }, [useProximityOpacity]);\r\n\r\n  const onSnapWidgetOpacityChange = React.useCallback(async () => {\r\n    UiFramework.visibility.snapWidgetOpacity = !snapWidgetOpacity;\r\n  }, [snapWidgetOpacity]);\r\n\r\n  const onWidgetIconChange = React.useCallback(async () => {\r\n    UiFramework.setShowWidgetIcon(!showWidgetIcon);\r\n  }, [showWidgetIcon]);\r\n\r\n  const onAutoCollapseUnpinnedPanelsChange = React.useCallback(async () => {\r\n    UiFramework.setAutoCollapseUnpinnedPanels(!autoCollapseUnpinnedPanels);\r\n  }, [autoCollapseUnpinnedPanels]);\r\n\r\n  const onWidgetOpacityChange = React.useCallback(async (values: readonly number[]) => {\r\n    // istanbul ignore else\r\n    if (values.length > 0) {\r\n      UiFramework.setWidgetOpacity(values[0]);\r\n    }\r\n  }, []);\r\n\r\n  const onToggleDragInteraction = React.useCallback(async () => {\r\n    UiFramework.setUseDragInteraction(!useDragInteraction);\r\n  }, [useDragInteraction]);\r\n\r\n  const OnToggleAnimateToolSettings = React.useCallback(async () => {\r\n    UiFramework.setAnimateToolSettings(!animateToolSettings);\r\n  }, [animateToolSettings]);\r\n  const currentTheme = UiFramework.getColorTheme();\r\n\r\n  const OnToggleUseToolAsToolSettingsLabel = React.useCallback(async () => {\r\n    UiFramework.setUseToolAsToolSettingsLabel(!useToolAsToolSettingsLabel);\r\n  }, [useToolAsToolSettingsLabel]);\r\n\r\n  const onToolbarOpacityChange = React.useCallback(async (values: readonly number[]) => {\r\n    // istanbul ignore else\r\n    if (values.length > 0) {\r\n      UiFramework.setToolbarOpacity(values[0]);\r\n    }\r\n  }, []);\r\n\r\n  return (\r\n    <div className=\"uifw-settings\">\r\n      <SettingsItem title={themeTitle.current} description={themeDescription.current}\r\n        settingUi={\r\n          <div data-testid=\"select-theme-container\" className=\"select-theme-container\">\r\n            <Select\r\n              value={currentTheme}\r\n              onChange={onThemeChange}\r\n              options={themeOptions}\r\n              data-testid=\"select-theme\"\r\n              size=\"small\"\r\n            />\r\n          </div>\r\n        }\r\n      />\r\n      <SettingsItem title={autoHideTitle.current} description={autoHideDescription.current}\r\n        settingUi={<ToggleSwitch checked={autoHideUi} onChange={onAutoHideChange} />}\r\n      />\r\n      <SettingsItem title={dragInteractionTitle.current} description={dragInteractionDescription.current}\r\n        settingUi={<ToggleSwitch checked={useDragInteraction} onChange={onToggleDragInteraction} />}\r\n      />\r\n      <SettingsItem title={useProximityOpacityTitle.current} description={useProximityOpacityDescription.current}\r\n        settingUi={<ToggleSwitch checked={useProximityOpacity} onChange={onUseProximityOpacityChange} />}\r\n      />\r\n      <SettingsItem title={snapWidgetOpacityTitle.current} description={snapWidgetOpacityDescription.current}\r\n        settingUi={<ToggleSwitch checked={snapWidgetOpacity} onChange={onSnapWidgetOpacityChange} />}\r\n      />\r\n      <SettingsItem title={widgetIconTitle.current} description={widgetIconDescription.current}\r\n        settingUi={<ToggleSwitch checked={showWidgetIcon} onChange={onWidgetIconChange} />}\r\n      />\r\n      <SettingsItem title={autoCollapseUnpinnedPanelsTitle.current} description={autoCollapseUnpinnedPanelsDescription.current}\r\n        settingUi={<ToggleSwitch checked={autoCollapseUnpinnedPanels} onChange={onAutoCollapseUnpinnedPanelsChange} />}\r\n      />\r\n      <SettingsItem title={animateToolSettingsTitle.current} description={animateToolSettingsDescription.current}\r\n        settingUi={<ToggleSwitch checked={animateToolSettings} onChange={OnToggleAnimateToolSettings} />}\r\n      />\r\n      <SettingsItem title={useToolAsToolSettingsLabelTitle.current} description={useToolAsToolSettingsLabelDescription.current}\r\n        settingUi={<ToggleSwitch checked={useToolAsToolSettingsLabel} onChange={OnToggleUseToolAsToolSettingsLabel} />}\r\n      />\r\n      <SettingsItem title={toolbarOpacityTitle.current} description={toolbarOpacityDescription.current}\r\n        settingUi={\r\n          <Slider style={{ flex: \"1\" }} values={[toolbarOpacity]} step={0.05} onChange={onToolbarOpacityChange}\r\n            min={0.20} max={1.0} maxLabel=\"1.0\" tickLabels={[\"\", \"\", \"\", \"\", \"\"]} />\r\n        }\r\n      />\r\n      <SettingsItem title={widgetOpacityTitle.current} description={widgetOpacityDescription.current}\r\n        settingUi={\r\n          <Slider style={{ flex: \"1\" }} values={[widgetOpacity]} step={0.05} onChange={onWidgetOpacityChange}\r\n            min={0.20} max={1.0} maxLabel=\"1.0\" tickLabels={[\"\", \"\", \"\", \"\", \"\"]} />\r\n        }\r\n      />\r\n    </div>\r\n  );\r\n}\r\n\r\ninterface SettingsItemProps {\r\n  title: string;\r\n  description: string;\r\n  settingUi: React.ReactNode;\r\n}\r\n\r\nfunction SettingsItem(props: SettingsItemProps) {\r\n  const { title, description, settingUi } = props;\r\n\r\n  return (\r\n    <div className=\"uifw-settings-item\">\r\n      <div className=\"panel left-panel\">\r\n        <span className=\"title\">{title}</span>\r\n        <span className=\"description\">{description}</span>\r\n      </div>\r\n      <div className=\"panel right-panel\">\r\n        {settingUi}\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\n/**\r\n * Return a SettingsTabEntry that can be used to define the available settings that can be set for an application.\r\n * @param itemPriority - Used to define the order of the entry in the Settings Stage\r\n * @beta\r\n */\r\nexport function getUiSettingsManagerEntry(itemPriority: number): SettingsTabEntry {\r\n  return {\r\n    itemPriority, tabId: \"uifw:UiStateStorage\",\r\n    label: UiFramework.translate(\"settings.uiSettingsPage.label\"),\r\n    icon: IconSpecUtilities.createWebComponentIconSpec(widowSettingsIconSvg),\r\n    page: <UiSettingsPage />,\r\n    isDisabled: false,\r\n    tooltip: UiFramework.translate(\"settings.uiSettingsPage.tooltip\"),\r\n  };\r\n}\r\n"]}

package/lib/cjs/appui-react/settings/ui/UiSettingsPage.scss

@@ -1,65 +1,65 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "~@itwin/core-react/lib/cjs/core-react/base/base";
-
-// cspell:ignore leftpanel rightpanel
-
-$settings-leftpanel-width: 225px;
-$settings-rightpanel-width: 220px;
-
-.components-settings-container {
-  height: calc(100% - 50px);
-  overflow: hidden;
-}
-
-.uifw-settings {
-  background: var(--iui-color-background);
-  color: var(--iui-color-text);
-  border-radius: var(--iui-border-radius-1);
-  font-size: var(--iui-font-size-1);
-  display: flex;
-  flex-direction: column;
-}
-
-.uifw-settings-item {
-  display: flex;
-
-  > .panel {
-    flex: 1;
-    display: flex;
-    box-sizing: border-box;
-  }
-
-  > .left-panel {
-    flex-direction: column;
-    min-width: $settings-leftpanel-width;
-    padding: 20px 15px 20px 15px;
-
-    > .title {
-      font-size: 18px;
-    }
-
-    > .description {
-      margin-top: 10px;
-      font-size: 12px;
-      color: var(--iui-color-text-muted);
-    }
-  }
-
-  > .right-panel {
-    display: flex;
-    align-items: center;
-    min-width: $settings-rightpanel-width;
-    padding: 30px 50px 30px 30px;
-
-    .toggle {
-      margin-right: 10px;
-    }
-
-    .select-theme-container {
-      flex: 1;
-    }
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/core-react/lib/cjs/core-react/base/base";
+
+// cspell:ignore leftpanel rightpanel
+
+$settings-leftpanel-width: 225px;
+$settings-rightpanel-width: 220px;
+
+.components-settings-container {
+  height: calc(100% - 50px);
+  overflow: hidden;
+}
+
+.uifw-settings {
+  background: var(--iui-color-background);
+  color: var(--iui-color-text);
+  border-radius: var(--iui-border-radius-1);
+  font-size: var(--iui-font-size-1);
+  display: flex;
+  flex-direction: column;
+}
+
+.uifw-settings-item {
+  display: flex;
+
+  > .panel {
+    flex: 1;
+    display: flex;
+    box-sizing: border-box;
+  }
+
+  > .left-panel {
+    flex-direction: column;
+    min-width: $settings-leftpanel-width;
+    padding: 20px 15px 20px 15px;
+
+    > .title {
+      font-size: 18px;
+    }
+
+    > .description {
+      margin-top: 10px;
+      font-size: 12px;
+      color: var(--iui-color-text-muted);
+    }
+  }
+
+  > .right-panel {
+    display: flex;
+    align-items: center;
+    min-width: $settings-rightpanel-width;
+    padding: 30px 50px 30px 30px;
+
+    .toggle {
+      margin-right: 10px;
+    }
+
+    .select-theme-container {
+      flex: 1;
+    }
+  }
+}

package/lib/cjs/appui-react/shared/ActionButtonItemDef.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionButtonItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/ActionButtonItemDef.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAIH,kDAAgD;AAChD,+CAA4C;AAG5C;;GAEG;AACH,MAAsB,mBAAoB,SAAQ,yBAAW;IAY3D,YAAY,SAAoB,EAAE,cAAmC;QACnE,KAAK,CAAC,SAAS,CAAC,CAAC;QAoBnB,qFAAqF;QAC9E,oBAAe,GAAG,CAAC,IAAe,EAAE,EAAE;YAC3C,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACnB,CAAC,CAAC;QArBA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACvC,IAAI,CAAC,eAAe,GAAG,cAAc,CAAC;IACxC,CAAC;IAED,mEAAmE;IAC5D,OAAO;QACZ,IAAI,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE;YACxD,IAAI,IAAI,CAAC,eAAe,CAAC,cAAc;gBACrC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,cAAc,EAAE,CAAC,CAAC;;gBAEpE,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;SACjE;QAED,uBAAuB;QACvB,IAAI,IAAI,CAAC,eAAe;YACtB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IAC/B,CAAC;IAOD,sDAAsD;IAC/C,YAAY,CAAC,WAAwB;QAC1C,IAAI,SAAS,GAAG,mBAAmB,CAAC,iBAAiB,CAAC;QACtD,IAAI,IAAI,CAAC,IAAI;YACX,SAAS,GAAG,CAAC,WAAW,KAAK,wBAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC;QAE5F,OAAO,SAAS,CAAC;IACnB,CAAC;;AApCD,qDAAqD;AACvC,qCAAiB,GAAG,EAAE,AAAL,CAAM;AAVjB,kDAAmB","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 Item\n */\n\nimport type { CommandHandler, OnItemExecutedFunc } from \"@itwin/appui-abstract\";\nimport type { SizeProps } from \"@itwin/core-react\";\nimport { Orientation } from \"@itwin/core-react\";\nimport { ItemDefBase } from \"./ItemDefBase\";\nimport type { ItemProps } from \"./ItemProps\";\n\n/** Abstract base class that is used by classes to execute an action when pressed.\n * @public\n */\nexport abstract class ActionButtonItemDef extends ItemDefBase {\n  private _onItemExecuted?: OnItemExecutedFunc;\n\n  /** Command Handler for the action button */\n  protected _commandHandler?: CommandHandler;\n  /** Parameters passed to the Command Handler */\n  public parameters?: any;\n  /** Size of the action button, as set by handleSizeKnown */\n  public size?: SizeProps;\n  /** The default button size for all action buttons */\n  public static defaultButtonSize = 42;\n\n  constructor(itemProps: ItemProps, onItemExecuted?: OnItemExecutedFunc) {\n    super(itemProps);\n\n    this.execute = this.execute.bind(this);\n    this._onItemExecuted = onItemExecuted;\n  }\n\n  /** Called when the action button is invoked by a click or touch */\n  public execute(): void {\n    if (this._commandHandler && this._commandHandler.execute) {\n      if (this._commandHandler.getCommandArgs)\n        this._commandHandler.execute(this._commandHandler.getCommandArgs());\n      else\n        this._commandHandler.execute(this._commandHandler.parameters);\n    }\n\n    // istanbul ignore else\n    if (this._onItemExecuted)\n      this._onItemExecuted(this);\n  }\n\n  /** Called when the size of the action button is initialized and the size is known */\n  public handleSizeKnown = (size: SizeProps) => {\n    this.size = size;\n  };\n\n  /** Determines the dimension in a given orientation */\n  public getDimension(orientation: Orientation): number {\n    let dimension = ActionButtonItemDef.defaultButtonSize;\n    if (this.size)\n      dimension = (orientation === Orientation.Horizontal) ? this.size.width : this.size.height;\n\n    return dimension;\n  }\n}\n"]}
+{"version":3,"file":"ActionButtonItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/ActionButtonItemDef.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAIH,kDAAgD;AAChD,+CAA4C;AAG5C;;GAEG;AACH,MAAsB,mBAAoB,SAAQ,yBAAW;IAY3D,YAAY,SAAoB,EAAE,cAAmC;QACnE,KAAK,CAAC,SAAS,CAAC,CAAC;QAoBnB,qFAAqF;QAC9E,oBAAe,GAAG,CAAC,IAAe,EAAE,EAAE;YAC3C,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACnB,CAAC,CAAC;QArBA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACvC,IAAI,CAAC,eAAe,GAAG,cAAc,CAAC;IACxC,CAAC;IAED,mEAAmE;IAC5D,OAAO;QACZ,IAAI,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE;YACxD,IAAI,IAAI,CAAC,eAAe,CAAC,cAAc;gBACrC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,cAAc,EAAE,CAAC,CAAC;;gBAEpE,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;SACjE;QAED,uBAAuB;QACvB,IAAI,IAAI,CAAC,eAAe;YACtB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IAC/B,CAAC;IAOD,sDAAsD;IAC/C,YAAY,CAAC,WAAwB;QAC1C,IAAI,SAAS,GAAG,mBAAmB,CAAC,iBAAiB,CAAC;QACtD,IAAI,IAAI,CAAC,IAAI;YACX,SAAS,GAAG,CAAC,WAAW,KAAK,wBAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC;QAE5F,OAAO,SAAS,CAAC;IACnB,CAAC;;AApCD,qDAAqD;AACvC,qCAAiB,GAAG,EAAE,AAAL,CAAM;AAVjB,kDAAmB","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 Item\r\n */\r\n\r\nimport type { CommandHandler, OnItemExecutedFunc } from \"@itwin/appui-abstract\";\r\nimport type { SizeProps } from \"@itwin/core-react\";\r\nimport { Orientation } from \"@itwin/core-react\";\r\nimport { ItemDefBase } from \"./ItemDefBase\";\r\nimport type { ItemProps } from \"./ItemProps\";\r\n\r\n/** Abstract base class that is used by classes to execute an action when pressed.\r\n * @public\r\n */\r\nexport abstract class ActionButtonItemDef extends ItemDefBase {\r\n  private _onItemExecuted?: OnItemExecutedFunc;\r\n\r\n  /** Command Handler for the action button */\r\n  protected _commandHandler?: CommandHandler;\r\n  /** Parameters passed to the Command Handler */\r\n  public parameters?: any;\r\n  /** Size of the action button, as set by handleSizeKnown */\r\n  public size?: SizeProps;\r\n  /** The default button size for all action buttons */\r\n  public static defaultButtonSize = 42;\r\n\r\n  constructor(itemProps: ItemProps, onItemExecuted?: OnItemExecutedFunc) {\r\n    super(itemProps);\r\n\r\n    this.execute = this.execute.bind(this);\r\n    this._onItemExecuted = onItemExecuted;\r\n  }\r\n\r\n  /** Called when the action button is invoked by a click or touch */\r\n  public execute(): void {\r\n    if (this._commandHandler && this._commandHandler.execute) {\r\n      if (this._commandHandler.getCommandArgs)\r\n        this._commandHandler.execute(this._commandHandler.getCommandArgs());\r\n      else\r\n        this._commandHandler.execute(this._commandHandler.parameters);\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (this._onItemExecuted)\r\n      this._onItemExecuted(this);\r\n  }\r\n\r\n  /** Called when the size of the action button is initialized and the size is known */\r\n  public handleSizeKnown = (size: SizeProps) => {\r\n    this.size = size;\r\n  };\r\n\r\n  /** Determines the dimension in a given orientation */\r\n  public getDimension(orientation: Orientation): number {\r\n    let dimension = ActionButtonItemDef.defaultButtonSize;\r\n    if (this.size)\r\n      dimension = (orientation === Orientation.Horizontal) ? this.size.width : this.size.height;\r\n\r\n    return dimension;\r\n  }\r\n}\r\n"]}

package/lib/cjs/appui-react/shared/AnyItemDef.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnyItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/AnyItemDef.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG","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 Item\n */\n\nimport type { GroupItemDef } from \"../toolbar/GroupItem\";\nimport type { ActionButtonItemDef } from \"./ActionButtonItemDef\";\nimport type { CommandItemDef } from \"./CommandItemDef\";\nimport type { ToolItemDef } from \"./ToolItemDef\";\n\n/** Union of all Item definitions that can be specified in a GroupItem\n * @public\n */\nexport type AnyItemDef = GroupItemDef | CommandItemDef | ToolItemDef | ActionButtonItemDef;\n"]}
+{"version":3,"file":"AnyItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/AnyItemDef.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG","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 Item\r\n */\r\n\r\nimport type { GroupItemDef } from \"../toolbar/GroupItem\";\r\nimport type { ActionButtonItemDef } from \"./ActionButtonItemDef\";\r\nimport type { CommandItemDef } from \"./CommandItemDef\";\r\nimport type { ToolItemDef } from \"./ToolItemDef\";\r\n\r\n/** Union of all Item definitions that can be specified in a GroupItem\r\n * @public\r\n */\r\nexport type AnyItemDef = GroupItemDef | CommandItemDef | ToolItemDef | ActionButtonItemDef;\r\n"]}

package/lib/cjs/appui-react/shared/AnyToolbarItemDef.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnyToolbarItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/AnyToolbarItemDef.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG","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 Item\n */\n\nimport type { AnyItemDef } from \"./AnyItemDef\";\nimport type { CustomItemDef } from \"./CustomItemDef\";\n\n/** Union of all Item definitions that can be specified in a Toolbar\n * @public\n */\nexport type AnyToolbarItemDef = AnyItemDef | CustomItemDef;\n"]}
+{"version":3,"file":"AnyToolbarItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/AnyToolbarItemDef.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG","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 Item\r\n */\r\n\r\nimport type { AnyItemDef } from \"./AnyItemDef\";\r\nimport type { CustomItemDef } from \"./CustomItemDef\";\r\n\r\n/** Union of all Item definitions that can be specified in a Toolbar\r\n * @public\r\n */\r\nexport type AnyToolbarItemDef = AnyItemDef | CustomItemDef;\r\n"]}

package/lib/cjs/appui-react/shared/CommandItemDef.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/CommandItemDef.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAGH,+DAA4D;AAG5D;;GAEG;AACH,MAAa,cAAe,SAAQ,yCAAmB;IAKrD,YAAY,gBAAkC,EAAE,cAAmC;QACjF,KAAK,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC;QAHnC,cAAS,GAAW,EAAE,CAAC;QAK5B,IAAI,gBAAgB,CAAC,OAAO,EAAE;YAC5B,IAAI,CAAC,eAAe,GAAG,EAAE,OAAO,EAAE,gBAAgB,CAAC,OAAO,EAAE,UAAU,EAAE,gBAAgB,CAAC,UAAU,EAAE,cAAc,EAAE,gBAAgB,CAAC,cAAc,EAAE,CAAC;SACxJ;QAED,IAAI,gBAAgB,CAAC,SAAS;YAC5B,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC,SAAS,CAAC;aACzC;YACH,cAAc,CAAC,IAAI,EAAE,CAAC;YACtB,IAAI,CAAC,SAAS,GAAG,cAAc,CAAC,eAAe,GAAG,cAAc,CAAC,IAAI,CAAC;SACvE;IACH,CAAC;IAED,IAAW,EAAE;QACX,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;;AArBc,mBAAI,GAAG,CAAC,AAAJ,CAAK;AACV,8BAAe,GAAG,UAAU,AAAb,CAAc;AAFhC,wCAAc","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 Item\n */\n\nimport type { OnItemExecutedFunc } from \"@itwin/appui-abstract\";\nimport { ActionButtonItemDef } from \"./ActionButtonItemDef\";\nimport type { CommandItemProps } from \"./ItemProps\";\n\n/** An Item that executes a Command.\n * @public\n */\nexport class CommandItemDef extends ActionButtonItemDef {\n  private static _sId = 0;\n  public static commandIdPrefix = \"Command-\";\n  public commandId: string = \"\";\n\n  constructor(commandItemProps: CommandItemProps, onItemExecuted?: OnItemExecutedFunc) {\n    super(commandItemProps, onItemExecuted);\n\n    if (commandItemProps.execute) {\n      this._commandHandler = { execute: commandItemProps.execute, parameters: commandItemProps.parameters, getCommandArgs: commandItemProps.getCommandArgs };\n    }\n\n    if (commandItemProps.commandId)\n      this.commandId = commandItemProps.commandId;\n    else {\n      CommandItemDef._sId++;\n      this.commandId = CommandItemDef.commandIdPrefix + CommandItemDef._sId;\n    }\n  }\n\n  public get id(): string {\n    return this.commandId;\n  }\n}\n"]}
+{"version":3,"file":"CommandItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/CommandItemDef.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAGH,+DAA4D;AAG5D;;GAEG;AACH,MAAa,cAAe,SAAQ,yCAAmB;IAKrD,YAAY,gBAAkC,EAAE,cAAmC;QACjF,KAAK,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC;QAHnC,cAAS,GAAW,EAAE,CAAC;QAK5B,IAAI,gBAAgB,CAAC,OAAO,EAAE;YAC5B,IAAI,CAAC,eAAe,GAAG,EAAE,OAAO,EAAE,gBAAgB,CAAC,OAAO,EAAE,UAAU,EAAE,gBAAgB,CAAC,UAAU,EAAE,cAAc,EAAE,gBAAgB,CAAC,cAAc,EAAE,CAAC;SACxJ;QAED,IAAI,gBAAgB,CAAC,SAAS;YAC5B,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC,SAAS,CAAC;aACzC;YACH,cAAc,CAAC,IAAI,EAAE,CAAC;YACtB,IAAI,CAAC,SAAS,GAAG,cAAc,CAAC,eAAe,GAAG,cAAc,CAAC,IAAI,CAAC;SACvE;IACH,CAAC;IAED,IAAW,EAAE;QACX,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;;AArBc,mBAAI,GAAG,CAAC,AAAJ,CAAK;AACV,8BAAe,GAAG,UAAU,AAAb,CAAc;AAFhC,wCAAc","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 Item\r\n */\r\n\r\nimport type { OnItemExecutedFunc } from \"@itwin/appui-abstract\";\r\nimport { ActionButtonItemDef } from \"./ActionButtonItemDef\";\r\nimport type { CommandItemProps } from \"./ItemProps\";\r\n\r\n/** An Item that executes a Command.\r\n * @public\r\n */\r\nexport class CommandItemDef extends ActionButtonItemDef {\r\n  private static _sId = 0;\r\n  public static commandIdPrefix = \"Command-\";\r\n  public commandId: string = \"\";\r\n\r\n  constructor(commandItemProps: CommandItemProps, onItemExecuted?: OnItemExecutedFunc) {\r\n    super(commandItemProps, onItemExecuted);\r\n\r\n    if (commandItemProps.execute) {\r\n      this._commandHandler = { execute: commandItemProps.execute, parameters: commandItemProps.parameters, getCommandArgs: commandItemProps.getCommandArgs };\r\n    }\r\n\r\n    if (commandItemProps.commandId)\r\n      this.commandId = commandItemProps.commandId;\r\n    else {\r\n      CommandItemDef._sId++;\r\n      this.commandId = CommandItemDef.commandIdPrefix + CommandItemDef._sId;\r\n    }\r\n  }\r\n\r\n  public get id(): string {\r\n    return this.commandId;\r\n  }\r\n}\r\n"]}

package/lib/cjs/appui-react/shared/CustomItemDef.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/CustomItemDef.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAGH,+DAA4D;AAG5D;;GAEG;AACH,MAAa,aAAc,SAAQ,yCAAmB;IAMpD,YAAY,KAAsB;QAChC,KAAK,CAAC,KAAK,CAAC,CAAC;QAEb,IAAI,KAAK,CAAC,QAAQ;YAChB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC;aAC5B;YACH,aAAa,CAAC,IAAI,EAAE,CAAC;YACrB,IAAI,CAAC,QAAQ,GAAG,aAAa,CAAC,cAAc,GAAG,aAAa,CAAC,IAAI,CAAC;SACnE;QAED,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC;IAC7C,CAAC;IAED,IAAW,EAAE;QACX,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;;AApBc,kBAAI,GAAG,CAAC,CAAC;AACV,4BAAc,GAAG,SAAS,CAAC;AAF9B,sCAAa","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 Item\n */\n\nimport type * as React from \"react\";\nimport { ActionButtonItemDef } from \"./ActionButtonItemDef\";\nimport type { CustomItemProps } from \"./CustomItemProps\";\n\n/** An Item that renders a React component.\n * @public\n */\nexport class CustomItemDef extends ActionButtonItemDef {\n  private static _sId = 0;\n  public static customIdPrefix = \"Custom-\";\n  public customId: string;\n  public popupPanelNode?: React.ReactNode;\n\n  constructor(props: CustomItemProps) {\n    super(props);\n\n    if (props.customId)\n      this.customId = props.customId;\n    else {\n      CustomItemDef._sId++;\n      this.customId = CustomItemDef.customIdPrefix + CustomItemDef._sId;\n    }\n\n    this.popupPanelNode = props.popupPanelNode;\n  }\n\n  public get id(): string {\n    return this.customId;\n  }\n}\n"]}
+{"version":3,"file":"CustomItemDef.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/CustomItemDef.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAGH,+DAA4D;AAG5D;;GAEG;AACH,MAAa,aAAc,SAAQ,yCAAmB;IAMpD,YAAY,KAAsB;QAChC,KAAK,CAAC,KAAK,CAAC,CAAC;QAEb,IAAI,KAAK,CAAC,QAAQ;YAChB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC;aAC5B;YACH,aAAa,CAAC,IAAI,EAAE,CAAC;YACrB,IAAI,CAAC,QAAQ,GAAG,aAAa,CAAC,cAAc,GAAG,aAAa,CAAC,IAAI,CAAC;SACnE;QAED,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC;IAC7C,CAAC;IAED,IAAW,EAAE;QACX,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;;AApBc,kBAAI,GAAG,CAAC,CAAC;AACV,4BAAc,GAAG,SAAS,CAAC;AAF9B,sCAAa","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 Item\r\n */\r\n\r\nimport type * as React from \"react\";\r\nimport { ActionButtonItemDef } from \"./ActionButtonItemDef\";\r\nimport type { CustomItemProps } from \"./CustomItemProps\";\r\n\r\n/** An Item that renders a React component.\r\n * @public\r\n */\r\nexport class CustomItemDef extends ActionButtonItemDef {\r\n  private static _sId = 0;\r\n  public static customIdPrefix = \"Custom-\";\r\n  public customId: string;\r\n  public popupPanelNode?: React.ReactNode;\r\n\r\n  constructor(props: CustomItemProps) {\r\n    super(props);\r\n\r\n    if (props.customId)\r\n      this.customId = props.customId;\r\n    else {\r\n      CustomItemDef._sId++;\r\n      this.customId = CustomItemDef.customIdPrefix + CustomItemDef._sId;\r\n    }\r\n\r\n    this.popupPanelNode = props.popupPanelNode;\r\n  }\r\n\r\n  public get id(): string {\r\n    return this.customId;\r\n  }\r\n}\r\n"]}

package/lib/cjs/appui-react/shared/CustomItemProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomItemProps.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/CustomItemProps.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG","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 Item\n */\n\nimport type { ItemProps } from \"./ItemProps\";\n\n/** Definition for a Custom item that renders a React component.\n * @public\n */\nexport interface CustomItemProps extends ItemProps {\n  customId?: string;\n  popupPanelNode?: React.ReactNode;\n}\n"]}
+{"version":3,"file":"CustomItemProps.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/CustomItemProps.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG","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 Item\r\n */\r\n\r\nimport type { ItemProps } from \"./ItemProps\";\r\n\r\n/** Definition for a Custom item that renders a React component.\r\n * @public\r\n */\r\nexport interface CustomItemProps extends ItemProps {\r\n  customId?: string;\r\n  popupPanelNode?: React.ReactNode;\r\n}\r\n"]}

package/lib/cjs/appui-react/shared/GroupItemProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupItemProps.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/GroupItemProps.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG","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 Item\n */\n\nimport type { StringGetter } from \"@itwin/appui-abstract\";\nimport type { AnyItemDef } from \"./AnyItemDef\";\nimport type { ItemProps } from \"./ItemProps\";\n\n/** Definition for a Group item that opens a group of items.\n * @public\n */\nexport interface GroupItemProps extends ItemProps {\n  defaultActiveItemId?: string;\n  groupId?: string;\n  items: AnyItemDef[];\n  itemsInColumn?: number;\n  /** if set, it is used to explicitly set a label at top of open group component. */\n  panelLabel?: string | StringGetter;\n  /** if set, it is used to define a key that is used to look up a localized string. This value is used only if panelLabel is not explicitly set. */\n  panelLabelKey?: string;\n}\n"]}
+{"version":3,"file":"GroupItemProps.js","sourceRoot":"","sources":["../../../../src/appui-react/shared/GroupItemProps.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG","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 Item\r\n */\r\n\r\nimport type { StringGetter } from \"@itwin/appui-abstract\";\r\nimport type { AnyItemDef } from \"./AnyItemDef\";\r\nimport type { ItemProps } from \"./ItemProps\";\r\n\r\n/** Definition for a Group item that opens a group of items.\r\n * @public\r\n */\r\nexport interface GroupItemProps extends ItemProps {\r\n  defaultActiveItemId?: string;\r\n  groupId?: string;\r\n  items: AnyItemDef[];\r\n  itemsInColumn?: number;\r\n  /** if set, it is used to explicitly set a label at top of open group component. */\r\n  panelLabel?: string | StringGetter;\r\n  /** if set, it is used to define a key that is used to look up a localized string. This value is used only if panelLabel is not explicitly set. */\r\n  panelLabelKey?: string;\r\n}\r\n"]}