@itwin/appui-react 3.7.2 → 3.7.4

package/CHANGELOG.md

@@ -1,6 +1,18 @@
 # Change Log - @itwin/appui-react
 
-This log was last generated on Wed, 12 Apr 2023 13:12:42 GMT and should not be manually modified.
+This log was last generated on Tue, 25 Apr 2023 17:50:35 GMT and should not be manually modified.
+
+## 3.7.4
+Tue, 25 Apr 2023 17:50:35 GMT
+
+_Version update only_
+
+## 3.7.3
+Thu, 20 Apr 2023 13:19:28 GMT
+
+### Updates
+
+- Fix stale options of SelectionScopeField.
 
 ## 3.7.2
 Wed, 12 Apr 2023 13:12:42 GMT

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

@@ -1,8 +1,8 @@
 /** @packageDocumentation
  * @module StatusBar
  */
+/// <reference types="react" />
 import "./SelectionScope.scss";
-import * as React from "react";
 import { PresentationSelectionScope } from "../redux/SessionState";
 import { StatusFieldProps } from "./StatusFieldProps";
 /** Defines properties supported by the SelectionScopeField Component.
@@ -20,19 +20,12 @@ interface SelectionScopeFieldProps extends StatusFieldProps {
  * in the Redux state.
  * @public
  */
-declare class SelectionScopeFieldComponent extends React.Component<SelectionScopeFieldProps> {
-    private _label;
-    private _toolTip;
-    private _scopeOptions;
-    constructor(props: SelectionScopeFieldProps);
-    private _updateSelectValue;
-    render(): React.ReactNode;
-}
+declare function SelectionScopeFieldComponent(props: SelectionScopeFieldProps): JSX.Element;
 /**
  * SelectionScopeField React component. This component is designed to be specified in a status bar definition. It will
  * display the active selection scope that is used by the PresentationManager to determine what elements are added to the selection nap mode.
  * This React component is Redux connected.
  * @public
- */ export declare const SelectionScopeField: import("react-redux").ConnectedComponent<typeof SelectionScopeFieldComponent, import("react-redux").Omit<React.ClassAttributes<SelectionScopeFieldComponent> & SelectionScopeFieldProps, "availableSelectionScopes" | "activeSelectionScope">>;
+ */ export declare const SelectionScopeField: import("react-redux").ConnectedComponent<typeof SelectionScopeFieldComponent, import("react-redux").Omit<SelectionScopeFieldProps, "availableSelectionScopes" | "activeSelectionScope">>;
 export {};
 //# sourceMappingURL=SelectionScope.d.ts.map

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;AAE/B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AAEnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD;;GAEG;AACH,UAAU,wBAAyB,SAAQ,gBAAgB;IAEzD,oBAAoB,EAAE,MAAM,CAAC;IAC7B,wBAAwB,EAAE,0BAA0B,EAAE,CAAC;CACxD;AAED;;;;;;;GAOG;AACH,cAAM,4BAA6B,SAAQ,KAAK,CAAC,SAAS,CAAC,wBAAwB,CAAC;IAClF,OAAO,CAAC,MAAM,CAAsD;IACpE,OAAO,CAAC,QAAQ,CAAwD;IACxE,OAAO,CAAC,aAAa,CAA8B;gBAEvC,KAAK,EAAE,wBAAwB;IAQ3C,OAAO,CAAC,kBAAkB,CAKxB;IAEc,MAAM,IAAI,KAAK,CAAC,SAAS;CA0B1C;AAaD;;;;;GAKG,CACH,eAAO,MAAM,mBAAmB,gPAAyD,CAAC"}
+{"version":3,"file":"SelectionScope.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,uBAAuB,CAAC;AAM/B,OAAO,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AAEnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD;;GAEG;AACH,UAAU,wBAAyB,SAAQ,gBAAgB;IACzD,oBAAoB,EAAE,MAAM,CAAC;IAC7B,wBAAwB,EAAE,0BAA0B,EAAE,CAAC;CACxD;AAED;;;;;;;GAOG;AACH,iBAAS,4BAA4B,CAAC,KAAK,EAAE,wBAAwB,eAqCpE;AAYD;;;;;GAKG,CACH,eAAO,MAAM,mBAAmB,0LAAyD,CAAC"}

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

@@ -23,35 +23,28 @@ const UiFramework_1 = require("../UiFramework");
  * in the Redux state.
  * @public
  */
-class SelectionScopeFieldComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        this._label = UiFramework_1.UiFramework.translate("selectionScopeField.label");
-        this._toolTip = UiFramework_1.UiFramework.translate("selectionScopeField.toolTip");
-        this._scopeOptions = [];
-        this._updateSelectValue = (newValue) => {
-            // istanbul ignore else
-            if (newValue) {
-                UiFramework_1.UiFramework.setActiveSelectionScope(newValue);
-            }
-        };
-        this._scopeOptions = this.props.availableSelectionScopes.map((scope) => {
-            const label = !!scope.label ? scope.label : UiFramework_1.UiFramework.translate(`selectionScopeLabels.${scope.id}`);
-            return { value: scope.id, label };
-        });
-    }
-    render() {
-        var _a, _b;
-        return (React.createElement(appui_layout_react_1.FooterIndicator // eslint-disable-line deprecation/deprecation
-        , { className: (0, classnames_1.default)("uifw-statusFields-selectionScope", this.props.className), style: this.props.style, 
-            // eslint-disable-next-line deprecation/deprecation
-            isInFooterMode: (_a = this.props.isInFooterMode) !== null && _a !== void 0 ? _a : true },
-            ((_b = this.props.isInFooterMode) !== null && _b !== void 0 ? _b : true) &&
-                React.createElement("label", { className: "uifw-statusFields-selectionScope-label" },
-                    this._label,
-                    ":"),
-            React.createElement(itwinui_react_1.Select, { className: "uifw-statusFields-selectionScope-selector", value: this.props.activeSelectionScope, options: this._scopeOptions, onChange: this._updateSelectValue, "data-testid": "components-selectionScope-selector", title: this._toolTip, size: "small" })));
-    }
+function SelectionScopeFieldComponent(props) {
+    var _a, _b;
+    const label = UiFramework_1.UiFramework.translate("selectionScopeField.label");
+    const toolTip = UiFramework_1.UiFramework.translate("selectionScopeField.toolTip");
+    const options = React.useMemo(() => props.availableSelectionScopes.map((scope) => {
+        return { value: scope.id, label: scope.label };
+    }), [props.availableSelectionScopes]);
+    const updateSelectValue = (newValue) => {
+        // istanbul ignore else
+        if (newValue) {
+            UiFramework_1.UiFramework.setActiveSelectionScope(newValue);
+        }
+    };
+    return (React.createElement(appui_layout_react_1.FooterIndicator // eslint-disable-line deprecation/deprecation
+    , { className: (0, classnames_1.default)("uifw-statusFields-selectionScope", props.className), style: props.style, 
+        // eslint-disable-next-line deprecation/deprecation
+        isInFooterMode: (_a = props.isInFooterMode) !== null && _a !== void 0 ? _a : true },
+        ((_b = props.isInFooterMode) !== null && _b !== void 0 ? _b : true) &&
+            React.createElement("label", { className: "uifw-statusFields-selectionScope-label" },
+                label,
+                ":"),
+        React.createElement(itwinui_react_1.Select, { className: "uifw-statusFields-selectionScope-selector", value: props.activeSelectionScope, options: options, onChange: updateSelectValue, "data-testid": "components-selectionScope-selector", title: toolTip, size: "small" })));
 }
 /** 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/SelectionScope.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionScope.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,iCAA+B;AAC/B,2CAAoC;AACpC,+BAA+B;AAC/B,6CAAsC;AACtC,kEAA4D;AAC5D,wDAA4D;AAE5D,gDAA6C;AAY7C;;;;;;;GAOG;AACH,MAAM,4BAA6B,SAAQ,KAAK,CAAC,SAAmC;IAKlF,YAAY,KAA+B;QACzC,KAAK,CAAC,KAAK,CAAC,CAAC;QALP,WAAM,GAAG,yBAAW,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;QAC5D,aAAQ,GAAG,yBAAW,CAAC,SAAS,CAAC,6BAA6B,CAAC,CAAC;QAChE,kBAAa,GAA2B,EAAE,CAAC;QAU3C,uBAAkB,GAAG,CAAC,QAAgB,EAAE,EAAE;YAChD,uBAAuB;YACvB,IAAI,QAAQ,EAAE;gBACZ,yBAAW,CAAC,uBAAuB,CAAC,QAAQ,CAAC,CAAC;aAC/C;QACH,CAAC,CAAC;QAXA,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,GAAG,CAAC,CAAC,KAAiC,EAAE,EAAE;YACjG,MAAM,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,yBAAW,CAAC,SAAS,CAAC,wBAAwB,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;YACtG,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,CAAC;QACpC,CAAC,CAAC,CAAC;IACL,CAAC;IASe,MAAM;;QAEpB,OAAO,CACL,oBAAC,oCAAe,CAAC,8CAA8C;YAC7D,SAAS,EAAE,IAAA,oBAAU,EAAC,kCAAkC,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAC/E,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACvB,mDAAmD;YACnD,cAAc,EAAE,MAAA,IAAI,CAAC,KAAK,CAAC,cAAc,mCAAI,IAAI;YAG/C,CAAC,MAAA,IAAI,CAAC,KAAK,CAAC,cAAc,mCAAI,IAAI,CAAC;gBACnC,+BAAO,SAAS,EAAC,wCAAwC;oBACtD,IAAI,CAAC,MAAM;wBACN;YAEV,oBAAC,sBAAM,IACL,SAAS,EAAC,2CAA2C,EACrD,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,oBAAoB,EACtC,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,QAAQ,EAAE,IAAI,CAAC,kBAAkB,iBACrB,oCAAoC,EAChD,KAAK,EAAE,IAAI,CAAC,QAAQ,EACpB,IAAI,EAAC,OAAO,GAAG,CACA,CACpB,CAAC;IACJ,CAAC;CACF;AAED,+GAA+G;AAC/G,SAAS,eAAe,CAAC,KAAU;IACjC,MAAM,cAAc,GAAG,KAAK,CAAC,yBAAW,CAAC,iBAAiB,CAAC,CAAC,CAAE,8CAA8C;IAC5G,0BAA0B;IAC1B,IAAI,CAAC,cAAc;QACjB,OAAO,SAAS,CAAC;IAEnB,OAAO,EAAE,oBAAoB,EAAE,cAAc,CAAC,YAAY,CAAC,oBAAoB,EAAE,wBAAwB,EAAE,cAAc,CAAC,YAAY,CAAC,wBAAwB,EAAE,CAAC;AACpK,CAAC;AAED,4EAA4E;AAC5E;;;;;GAKG,CAAC,gEAAgE;AACvD,QAAA,mBAAmB,GAAG,IAAA,qBAAO,EAAC,eAAe,CAAC,CAAC,4BAA4B,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module StatusBar\r\n */\r\n\r\nimport \"./SelectionScope.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport { FooterIndicator } from \"@itwin/appui-layout-react\";\r\nimport { Select, SelectOption } from \"@itwin/itwinui-react\";\r\nimport { PresentationSelectionScope } from \"../redux/SessionState\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { StatusFieldProps } from \"./StatusFieldProps\";\r\n\r\n/** Defines properties supported by the SelectionScopeField Component.\r\n * @public\r\n */\r\ninterface SelectionScopeFieldProps extends StatusFieldProps {\r\n\r\n  activeSelectionScope: string;\r\n  availableSelectionScopes: PresentationSelectionScope[];\r\n}\r\n\r\n/**\r\n * Status Field React component. This component is designed to be specified in a status bar definition.\r\n * It is used to display the number of selected items based on the Presentation Rules Selection Manager.\r\n * The IModelApp should call either UiFramework.setIModelConnection or SyncUiEventDispatcher.initializeConnectionEvents\r\n * with the active iModelConnection each time a new iModel is opened so the selection scope data is properly updated\r\n * in the Redux state.\r\n * @public\r\n */\r\nclass SelectionScopeFieldComponent extends React.Component<SelectionScopeFieldProps> {\r\n  private _label = UiFramework.translate(\"selectionScopeField.label\");\r\n  private _toolTip = UiFramework.translate(\"selectionScopeField.toolTip\");\r\n  private _scopeOptions: SelectOption<string>[] = [];\r\n\r\n  constructor(props: SelectionScopeFieldProps) {\r\n    super(props);\r\n    this._scopeOptions = this.props.availableSelectionScopes.map((scope: PresentationSelectionScope) => {\r\n      const label = !!scope.label ? scope.label : UiFramework.translate(`selectionScopeLabels.${scope.id}`);\r\n      return { value: scope.id, label };\r\n    });\r\n  }\r\n\r\n  private _updateSelectValue = (newValue: string) => {\r\n    // istanbul ignore else\r\n    if (newValue) {\r\n      UiFramework.setActiveSelectionScope(newValue);\r\n    }\r\n  };\r\n\r\n  public override render(): React.ReactNode {\r\n\r\n    return (\r\n      <FooterIndicator // eslint-disable-line deprecation/deprecation\r\n        className={classnames(\"uifw-statusFields-selectionScope\", this.props.className)}\r\n        style={this.props.style}\r\n        // eslint-disable-next-line deprecation/deprecation\r\n        isInFooterMode={this.props.isInFooterMode ?? true}\r\n      >\r\n        {// eslint-disable-next-line deprecation/deprecation\r\n          (this.props.isInFooterMode ?? true) &&\r\n          <label className=\"uifw-statusFields-selectionScope-label\">\r\n            {this._label}:\r\n          </label>\r\n        }\r\n        <Select\r\n          className=\"uifw-statusFields-selectionScope-selector\"\r\n          value={this.props.activeSelectionScope}\r\n          options={this._scopeOptions}\r\n          onChange={this._updateSelectValue}\r\n          data-testid=\"components-selectionScope-selector\"\r\n          title={this._toolTip}\r\n          size=\"small\" />\r\n      </FooterIndicator >\r\n    );\r\n  }\r\n}\r\n\r\n/** Function used by Redux to map state data in Redux store to props that are used to render this component. */\r\nfunction mapStateToProps(state: any) {\r\n  const frameworkState = state[UiFramework.frameworkStateKey];  // since app sets up key, don't hard-code name\r\n  /* istanbul ignore next */\r\n  if (!frameworkState)\r\n    return undefined;\r\n\r\n  return { activeSelectionScope: frameworkState.sessionState.activeSelectionScope, availableSelectionScopes: frameworkState.sessionState.availableSelectionScopes };\r\n}\r\n\r\n// we declare the variable and export that rather than using export default.\r\n/**\r\n * SelectionScopeField React component. This component is designed to be specified in a status bar definition. It will\r\n * display the active selection scope that is used by the PresentationManager to determine what elements are added to the selection nap mode.\r\n * This React component is Redux connected.\r\n * @public\r\n */ // eslint-disable-next-line @typescript-eslint/naming-convention\r\nexport const SelectionScopeField = connect(mapStateToProps)(SelectionScopeFieldComponent);\r\n"]}
+{"version":3,"file":"SelectionScope.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,iCAA+B;AAC/B,2CAAoC;AACpC,+BAA+B;AAC/B,6CAAsC;AACtC,kEAA4D;AAC5D,wDAA8C;AAE9C,gDAA6C;AAW7C;;;;;;;GAOG;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,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,wBAAwB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;QAC/E,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC;IACjD,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC;IAEtC,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;IACF,OAAO,CACL,oBAAC,oCAAe,CAAC,8CAA8C;QAC7D,SAAS,EAAE,IAAA,oBAAU,EAAC,kCAAkC,EAAE,KAAK,CAAC,SAAS,CAAC,EAC1E,KAAK,EAAE,KAAK,CAAC,KAAK;QAClB,mDAAmD;QACnD,cAAc,EAAE,MAAA,KAAK,CAAC,cAAc,mCAAI,IAAI;QAG1C,CAAC,MAAA,KAAK,CAAC,cAAc,mCAAI,IAAI,CAAC;YAC9B,+BAAO,SAAS,EAAC,wCAAwC;gBACtD,KAAK;oBACA;QAEV,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,GAAG,CACA,CACpB,CAAC;AACJ,CAAC;AACD,+GAA+G;AAC/G,SAAS,eAAe,CAAC,KAAU;IACjC,MAAM,cAAc,GAAG,KAAK,CAAC,yBAAW,CAAC,iBAAiB,CAAC,CAAC,CAAE,8CAA8C;IAC5G,0BAA0B;IAC1B,IAAI,CAAC,cAAc;QACjB,OAAO,SAAS,CAAC;IAEnB,OAAO,EAAE,oBAAoB,EAAE,cAAc,CAAC,YAAY,CAAC,oBAAoB,EAAE,wBAAwB,EAAE,cAAc,CAAC,YAAY,CAAC,wBAAwB,EAAE,CAAC;AACpK,CAAC;AAED,4EAA4E;AAC5E;;;;;GAKG,CAAC,gEAAgE;AACvD,QAAA,mBAAmB,GAAG,IAAA,qBAAO,EAAC,eAAe,CAAC,CAAC,4BAA4B,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module StatusBar\r\n */\r\n\r\nimport \"./SelectionScope.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport { FooterIndicator } from \"@itwin/appui-layout-react\";\r\nimport { Select } from \"@itwin/itwinui-react\";\r\nimport { PresentationSelectionScope } from \"../redux/SessionState\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { StatusFieldProps } from \"./StatusFieldProps\";\r\n\r\n/** Defines properties supported by the SelectionScopeField Component.\r\n * @public\r\n */\r\ninterface SelectionScopeFieldProps extends StatusFieldProps {\r\n  activeSelectionScope: string;\r\n  availableSelectionScopes: PresentationSelectionScope[];\r\n}\r\n\r\n/**\r\n * Status Field React component. This component is designed to be specified in a status bar definition.\r\n * It is used to display the number of selected items based on the Presentation Rules Selection Manager.\r\n * The IModelApp should call either UiFramework.setIModelConnection or SyncUiEventDispatcher.initializeConnectionEvents\r\n * with the active iModelConnection each time a new iModel is opened so the selection scope data is properly updated\r\n * in the Redux state.\r\n * @public\r\n */\r\nfunction SelectionScopeFieldComponent(props: SelectionScopeFieldProps) {\r\n  const label = UiFramework.translate(\"selectionScopeField.label\");\r\n  const toolTip = UiFramework.translate(\"selectionScopeField.toolTip\");\r\n\r\n  const options = React.useMemo(() => props.availableSelectionScopes.map((scope) => {\r\n    return { value: scope.id, label: scope.label };\r\n  }), [props.availableSelectionScopes]);\r\n\r\n  const updateSelectValue = (newValue: string) => {\r\n    // istanbul ignore else\r\n    if (newValue) {\r\n      UiFramework.setActiveSelectionScope(newValue);\r\n    }\r\n  };\r\n  return (\r\n    <FooterIndicator // eslint-disable-line deprecation/deprecation\r\n      className={classnames(\"uifw-statusFields-selectionScope\", props.className)}\r\n      style={props.style}\r\n      // eslint-disable-next-line deprecation/deprecation\r\n      isInFooterMode={props.isInFooterMode ?? true}\r\n    >\r\n      {// eslint-disable-next-line deprecation/deprecation\r\n        (props.isInFooterMode ?? true) &&\r\n        <label className=\"uifw-statusFields-selectionScope-label\">\r\n          {label}:\r\n        </label>\r\n      }\r\n      <Select\r\n        className=\"uifw-statusFields-selectionScope-selector\"\r\n        value={props.activeSelectionScope}\r\n        options={options}\r\n        onChange={updateSelectValue}\r\n        data-testid=\"components-selectionScope-selector\"\r\n        title={toolTip}\r\n        size=\"small\" />\r\n    </FooterIndicator >\r\n  );\r\n}\r\n/** Function used by Redux to map state data in Redux store to props that are used to render this component. */\r\nfunction mapStateToProps(state: any) {\r\n  const frameworkState = state[UiFramework.frameworkStateKey];  // since app sets up key, don't hard-code name\r\n  /* istanbul ignore next */\r\n  if (!frameworkState)\r\n    return undefined;\r\n\r\n  return { activeSelectionScope: frameworkState.sessionState.activeSelectionScope, availableSelectionScopes: frameworkState.sessionState.availableSelectionScopes };\r\n}\r\n\r\n// we declare the variable and export that rather than using export default.\r\n/**\r\n * SelectionScopeField React component. This component is designed to be specified in a status bar definition. It will\r\n * display the active selection scope that is used by the PresentationManager to determine what elements are added to the selection nap mode.\r\n * This React component is Redux connected.\r\n * @public\r\n */ // eslint-disable-next-line @typescript-eslint/naming-convention\r\nexport const SelectionScopeField = connect(mapStateToProps)(SelectionScopeFieldComponent);\r\n"]}

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

@@ -1,8 +1,8 @@
 /** @packageDocumentation
  * @module StatusBar
  */
+/// <reference types="react" />
 import "./SelectionScope.scss";
-import * as React from "react";
 import { PresentationSelectionScope } from "../redux/SessionState";
 import { StatusFieldProps } from "./StatusFieldProps";
 /** Defines properties supported by the SelectionScopeField Component.
@@ -20,19 +20,12 @@ interface SelectionScopeFieldProps extends StatusFieldProps {
  * in the Redux state.
  * @public
  */
-declare class SelectionScopeFieldComponent extends React.Component<SelectionScopeFieldProps> {
-    private _label;
-    private _toolTip;
-    private _scopeOptions;
-    constructor(props: SelectionScopeFieldProps);
-    private _updateSelectValue;
-    render(): React.ReactNode;
-}
+declare function SelectionScopeFieldComponent(props: SelectionScopeFieldProps): JSX.Element;
 /**
  * SelectionScopeField React component. This component is designed to be specified in a status bar definition. It will
  * display the active selection scope that is used by the PresentationManager to determine what elements are added to the selection nap mode.
  * This React component is Redux connected.
  * @public
- */ export declare const SelectionScopeField: import("react-redux").ConnectedComponent<typeof SelectionScopeFieldComponent, import("react-redux").Omit<React.ClassAttributes<SelectionScopeFieldComponent> & SelectionScopeFieldProps, "availableSelectionScopes" | "activeSelectionScope">>;
+ */ export declare const SelectionScopeField: import("react-redux").ConnectedComponent<typeof SelectionScopeFieldComponent, import("react-redux").Omit<SelectionScopeFieldProps, "availableSelectionScopes" | "activeSelectionScope">>;
 export {};
 //# sourceMappingURL=SelectionScope.d.ts.map

package/lib/esm/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;AAE/B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AAEnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD;;GAEG;AACH,UAAU,wBAAyB,SAAQ,gBAAgB;IAEzD,oBAAoB,EAAE,MAAM,CAAC;IAC7B,wBAAwB,EAAE,0BAA0B,EAAE,CAAC;CACxD;AAED;;;;;;;GAOG;AACH,cAAM,4BAA6B,SAAQ,KAAK,CAAC,SAAS,CAAC,wBAAwB,CAAC;IAClF,OAAO,CAAC,MAAM,CAAsD;IACpE,OAAO,CAAC,QAAQ,CAAwD;IACxE,OAAO,CAAC,aAAa,CAA8B;gBAEvC,KAAK,EAAE,wBAAwB;IAQ3C,OAAO,CAAC,kBAAkB,CAKxB;IAEc,MAAM,IAAI,KAAK,CAAC,SAAS;CA0B1C;AAaD;;;;;GAKG,CACH,eAAO,MAAM,mBAAmB,gPAAyD,CAAC"}
+{"version":3,"file":"SelectionScope.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,uBAAuB,CAAC;AAM/B,OAAO,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AAEnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD;;GAEG;AACH,UAAU,wBAAyB,SAAQ,gBAAgB;IACzD,oBAAoB,EAAE,MAAM,CAAC;IAC7B,wBAAwB,EAAE,0BAA0B,EAAE,CAAC;CACxD;AAED;;;;;;;GAOG;AACH,iBAAS,4BAA4B,CAAC,KAAK,EAAE,wBAAwB,eAqCpE;AAYD;;;;;GAKG,CACH,eAAO,MAAM,mBAAmB,0LAAyD,CAAC"}

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

@@ -20,35 +20,28 @@ import { UiFramework } from "../UiFramework";
  * in the Redux state.
  * @public
  */
-class SelectionScopeFieldComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        this._label = UiFramework.translate("selectionScopeField.label");
-        this._toolTip = UiFramework.translate("selectionScopeField.toolTip");
-        this._scopeOptions = [];
-        this._updateSelectValue = (newValue) => {
-            // istanbul ignore else
-            if (newValue) {
-                UiFramework.setActiveSelectionScope(newValue);
-            }
-        };
-        this._scopeOptions = this.props.availableSelectionScopes.map((scope) => {
-            const label = !!scope.label ? scope.label : UiFramework.translate(`selectionScopeLabels.${scope.id}`);
-            return { value: scope.id, label };
-        });
-    }
-    render() {
-        var _a, _b;
-        return (React.createElement(FooterIndicator // eslint-disable-line deprecation/deprecation
-        , { className: classnames("uifw-statusFields-selectionScope", this.props.className), style: this.props.style, 
-            // eslint-disable-next-line deprecation/deprecation
-            isInFooterMode: (_a = this.props.isInFooterMode) !== null && _a !== void 0 ? _a : true },
-            ((_b = this.props.isInFooterMode) !== null && _b !== void 0 ? _b : true) &&
-                React.createElement("label", { className: "uifw-statusFields-selectionScope-label" },
-                    this._label,
-                    ":"),
-            React.createElement(Select, { className: "uifw-statusFields-selectionScope-selector", value: this.props.activeSelectionScope, options: this._scopeOptions, onChange: this._updateSelectValue, "data-testid": "components-selectionScope-selector", title: this._toolTip, size: "small" })));
-    }
+function SelectionScopeFieldComponent(props) {
+    var _a, _b;
+    const label = UiFramework.translate("selectionScopeField.label");
+    const toolTip = UiFramework.translate("selectionScopeField.toolTip");
+    const options = React.useMemo(() => props.availableSelectionScopes.map((scope) => {
+        return { value: scope.id, label: scope.label };
+    }), [props.availableSelectionScopes]);
+    const updateSelectValue = (newValue) => {
+        // istanbul ignore else
+        if (newValue) {
+            UiFramework.setActiveSelectionScope(newValue);
+        }
+    };
+    return (React.createElement(FooterIndicator // eslint-disable-line deprecation/deprecation
+    , { className: classnames("uifw-statusFields-selectionScope", props.className), style: props.style, 
+        // eslint-disable-next-line deprecation/deprecation
+        isInFooterMode: (_a = props.isInFooterMode) !== null && _a !== void 0 ? _a : true },
+        ((_b = props.isInFooterMode) !== null && _b !== void 0 ? _b : true) &&
+            React.createElement("label", { className: "uifw-statusFields-selectionScope-label" },
+                label,
+                ":"),
+        React.createElement(Select, { className: "uifw-statusFields-selectionScope-selector", value: props.activeSelectionScope, options: options, onChange: updateSelectValue, "data-testid": "components-selectionScope-selector", title: toolTip, size: "small" })));
 }
 /** 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/esm/appui-react/statusfields/SelectionScope.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionScope.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAC/B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAgB,MAAM,sBAAsB,CAAC;AAE5D,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAY7C;;;;;;;GAOG;AACH,MAAM,4BAA6B,SAAQ,KAAK,CAAC,SAAmC;IAKlF,YAAY,KAA+B;QACzC,KAAK,CAAC,KAAK,CAAC,CAAC;QALP,WAAM,GAAG,WAAW,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;QAC5D,aAAQ,GAAG,WAAW,CAAC,SAAS,CAAC,6BAA6B,CAAC,CAAC;QAChE,kBAAa,GAA2B,EAAE,CAAC;QAU3C,uBAAkB,GAAG,CAAC,QAAgB,EAAE,EAAE;YAChD,uBAAuB;YACvB,IAAI,QAAQ,EAAE;gBACZ,WAAW,CAAC,uBAAuB,CAAC,QAAQ,CAAC,CAAC;aAC/C;QACH,CAAC,CAAC;QAXA,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,GAAG,CAAC,CAAC,KAAiC,EAAE,EAAE;YACjG,MAAM,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,SAAS,CAAC,wBAAwB,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;YACtG,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,CAAC;QACpC,CAAC,CAAC,CAAC;IACL,CAAC;IASe,MAAM;;QAEpB,OAAO,CACL,oBAAC,eAAe,CAAC,8CAA8C;YAC7D,SAAS,EAAE,UAAU,CAAC,kCAAkC,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAC/E,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACvB,mDAAmD;YACnD,cAAc,EAAE,MAAA,IAAI,CAAC,KAAK,CAAC,cAAc,mCAAI,IAAI;YAG/C,CAAC,MAAA,IAAI,CAAC,KAAK,CAAC,cAAc,mCAAI,IAAI,CAAC;gBACnC,+BAAO,SAAS,EAAC,wCAAwC;oBACtD,IAAI,CAAC,MAAM;wBACN;YAEV,oBAAC,MAAM,IACL,SAAS,EAAC,2CAA2C,EACrD,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,oBAAoB,EACtC,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,QAAQ,EAAE,IAAI,CAAC,kBAAkB,iBACrB,oCAAoC,EAChD,KAAK,EAAE,IAAI,CAAC,QAAQ,EACpB,IAAI,EAAC,OAAO,GAAG,CACA,CACpB,CAAC;IACJ,CAAC;CACF;AAED,+GAA+G;AAC/G,SAAS,eAAe,CAAC,KAAU;IACjC,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC,CAAE,8CAA8C;IAC5G,0BAA0B;IAC1B,IAAI,CAAC,cAAc;QACjB,OAAO,SAAS,CAAC;IAEnB,OAAO,EAAE,oBAAoB,EAAE,cAAc,CAAC,YAAY,CAAC,oBAAoB,EAAE,wBAAwB,EAAE,cAAc,CAAC,YAAY,CAAC,wBAAwB,EAAE,CAAC;AACpK,CAAC;AAED,4EAA4E;AAC5E;;;;;GAKG,CAAC,gEAAgE;AACpE,MAAM,CAAC,MAAM,mBAAmB,GAAG,OAAO,CAAC,eAAe,CAAC,CAAC,4BAA4B,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module StatusBar\r\n */\r\n\r\nimport \"./SelectionScope.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport { FooterIndicator } from \"@itwin/appui-layout-react\";\r\nimport { Select, SelectOption } from \"@itwin/itwinui-react\";\r\nimport { PresentationSelectionScope } from \"../redux/SessionState\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { StatusFieldProps } from \"./StatusFieldProps\";\r\n\r\n/** Defines properties supported by the SelectionScopeField Component.\r\n * @public\r\n */\r\ninterface SelectionScopeFieldProps extends StatusFieldProps {\r\n\r\n  activeSelectionScope: string;\r\n  availableSelectionScopes: PresentationSelectionScope[];\r\n}\r\n\r\n/**\r\n * Status Field React component. This component is designed to be specified in a status bar definition.\r\n * It is used to display the number of selected items based on the Presentation Rules Selection Manager.\r\n * The IModelApp should call either UiFramework.setIModelConnection or SyncUiEventDispatcher.initializeConnectionEvents\r\n * with the active iModelConnection each time a new iModel is opened so the selection scope data is properly updated\r\n * in the Redux state.\r\n * @public\r\n */\r\nclass SelectionScopeFieldComponent extends React.Component<SelectionScopeFieldProps> {\r\n  private _label = UiFramework.translate(\"selectionScopeField.label\");\r\n  private _toolTip = UiFramework.translate(\"selectionScopeField.toolTip\");\r\n  private _scopeOptions: SelectOption<string>[] = [];\r\n\r\n  constructor(props: SelectionScopeFieldProps) {\r\n    super(props);\r\n    this._scopeOptions = this.props.availableSelectionScopes.map((scope: PresentationSelectionScope) => {\r\n      const label = !!scope.label ? scope.label : UiFramework.translate(`selectionScopeLabels.${scope.id}`);\r\n      return { value: scope.id, label };\r\n    });\r\n  }\r\n\r\n  private _updateSelectValue = (newValue: string) => {\r\n    // istanbul ignore else\r\n    if (newValue) {\r\n      UiFramework.setActiveSelectionScope(newValue);\r\n    }\r\n  };\r\n\r\n  public override render(): React.ReactNode {\r\n\r\n    return (\r\n      <FooterIndicator // eslint-disable-line deprecation/deprecation\r\n        className={classnames(\"uifw-statusFields-selectionScope\", this.props.className)}\r\n        style={this.props.style}\r\n        // eslint-disable-next-line deprecation/deprecation\r\n        isInFooterMode={this.props.isInFooterMode ?? true}\r\n      >\r\n        {// eslint-disable-next-line deprecation/deprecation\r\n          (this.props.isInFooterMode ?? true) &&\r\n          <label className=\"uifw-statusFields-selectionScope-label\">\r\n            {this._label}:\r\n          </label>\r\n        }\r\n        <Select\r\n          className=\"uifw-statusFields-selectionScope-selector\"\r\n          value={this.props.activeSelectionScope}\r\n          options={this._scopeOptions}\r\n          onChange={this._updateSelectValue}\r\n          data-testid=\"components-selectionScope-selector\"\r\n          title={this._toolTip}\r\n          size=\"small\" />\r\n      </FooterIndicator >\r\n    );\r\n  }\r\n}\r\n\r\n/** Function used by Redux to map state data in Redux store to props that are used to render this component. */\r\nfunction mapStateToProps(state: any) {\r\n  const frameworkState = state[UiFramework.frameworkStateKey];  // since app sets up key, don't hard-code name\r\n  /* istanbul ignore next */\r\n  if (!frameworkState)\r\n    return undefined;\r\n\r\n  return { activeSelectionScope: frameworkState.sessionState.activeSelectionScope, availableSelectionScopes: frameworkState.sessionState.availableSelectionScopes };\r\n}\r\n\r\n// we declare the variable and export that rather than using export default.\r\n/**\r\n * SelectionScopeField React component. This component is designed to be specified in a status bar definition. It will\r\n * display the active selection scope that is used by the PresentationManager to determine what elements are added to the selection nap mode.\r\n * This React component is Redux connected.\r\n * @public\r\n */ // eslint-disable-next-line @typescript-eslint/naming-convention\r\nexport const SelectionScopeField = connect(mapStateToProps)(SelectionScopeFieldComponent);\r\n"]}
+{"version":3,"file":"SelectionScope.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SelectionScope.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAC/B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAW7C;;;;;;;GAOG;AACH,SAAS,4BAA4B,CAAC,KAA+B;;IACnE,MAAM,KAAK,GAAG,WAAW,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;IACjE,MAAM,OAAO,GAAG,WAAW,CAAC,SAAS,CAAC,6BAA6B,CAAC,CAAC;IAErE,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,wBAAwB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;QAC/E,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC;IACjD,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC;IAEtC,MAAM,iBAAiB,GAAG,CAAC,QAAgB,EAAE,EAAE;QAC7C,uBAAuB;QACvB,IAAI,QAAQ,EAAE;YACZ,WAAW,CAAC,uBAAuB,CAAC,QAAQ,CAAC,CAAC;SAC/C;IACH,CAAC,CAAC;IACF,OAAO,CACL,oBAAC,eAAe,CAAC,8CAA8C;QAC7D,SAAS,EAAE,UAAU,CAAC,kCAAkC,EAAE,KAAK,CAAC,SAAS,CAAC,EAC1E,KAAK,EAAE,KAAK,CAAC,KAAK;QAClB,mDAAmD;QACnD,cAAc,EAAE,MAAA,KAAK,CAAC,cAAc,mCAAI,IAAI;QAG1C,CAAC,MAAA,KAAK,CAAC,cAAc,mCAAI,IAAI,CAAC;YAC9B,+BAAO,SAAS,EAAC,wCAAwC;gBACtD,KAAK;oBACA;QAEV,oBAAC,MAAM,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,GAAG,CACA,CACpB,CAAC;AACJ,CAAC;AACD,+GAA+G;AAC/G,SAAS,eAAe,CAAC,KAAU;IACjC,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC,CAAE,8CAA8C;IAC5G,0BAA0B;IAC1B,IAAI,CAAC,cAAc;QACjB,OAAO,SAAS,CAAC;IAEnB,OAAO,EAAE,oBAAoB,EAAE,cAAc,CAAC,YAAY,CAAC,oBAAoB,EAAE,wBAAwB,EAAE,cAAc,CAAC,YAAY,CAAC,wBAAwB,EAAE,CAAC;AACpK,CAAC;AAED,4EAA4E;AAC5E;;;;;GAKG,CAAC,gEAAgE;AACpE,MAAM,CAAC,MAAM,mBAAmB,GAAG,OAAO,CAAC,eAAe,CAAC,CAAC,4BAA4B,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module StatusBar\r\n */\r\n\r\nimport \"./SelectionScope.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport { FooterIndicator } from \"@itwin/appui-layout-react\";\r\nimport { Select } from \"@itwin/itwinui-react\";\r\nimport { PresentationSelectionScope } from \"../redux/SessionState\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { StatusFieldProps } from \"./StatusFieldProps\";\r\n\r\n/** Defines properties supported by the SelectionScopeField Component.\r\n * @public\r\n */\r\ninterface SelectionScopeFieldProps extends StatusFieldProps {\r\n  activeSelectionScope: string;\r\n  availableSelectionScopes: PresentationSelectionScope[];\r\n}\r\n\r\n/**\r\n * Status Field React component. This component is designed to be specified in a status bar definition.\r\n * It is used to display the number of selected items based on the Presentation Rules Selection Manager.\r\n * The IModelApp should call either UiFramework.setIModelConnection or SyncUiEventDispatcher.initializeConnectionEvents\r\n * with the active iModelConnection each time a new iModel is opened so the selection scope data is properly updated\r\n * in the Redux state.\r\n * @public\r\n */\r\nfunction SelectionScopeFieldComponent(props: SelectionScopeFieldProps) {\r\n  const label = UiFramework.translate(\"selectionScopeField.label\");\r\n  const toolTip = UiFramework.translate(\"selectionScopeField.toolTip\");\r\n\r\n  const options = React.useMemo(() => props.availableSelectionScopes.map((scope) => {\r\n    return { value: scope.id, label: scope.label };\r\n  }), [props.availableSelectionScopes]);\r\n\r\n  const updateSelectValue = (newValue: string) => {\r\n    // istanbul ignore else\r\n    if (newValue) {\r\n      UiFramework.setActiveSelectionScope(newValue);\r\n    }\r\n  };\r\n  return (\r\n    <FooterIndicator // eslint-disable-line deprecation/deprecation\r\n      className={classnames(\"uifw-statusFields-selectionScope\", props.className)}\r\n      style={props.style}\r\n      // eslint-disable-next-line deprecation/deprecation\r\n      isInFooterMode={props.isInFooterMode ?? true}\r\n    >\r\n      {// eslint-disable-next-line deprecation/deprecation\r\n        (props.isInFooterMode ?? true) &&\r\n        <label className=\"uifw-statusFields-selectionScope-label\">\r\n          {label}:\r\n        </label>\r\n      }\r\n      <Select\r\n        className=\"uifw-statusFields-selectionScope-selector\"\r\n        value={props.activeSelectionScope}\r\n        options={options}\r\n        onChange={updateSelectValue}\r\n        data-testid=\"components-selectionScope-selector\"\r\n        title={toolTip}\r\n        size=\"small\" />\r\n    </FooterIndicator >\r\n  );\r\n}\r\n/** Function used by Redux to map state data in Redux store to props that are used to render this component. */\r\nfunction mapStateToProps(state: any) {\r\n  const frameworkState = state[UiFramework.frameworkStateKey];  // since app sets up key, don't hard-code name\r\n  /* istanbul ignore next */\r\n  if (!frameworkState)\r\n    return undefined;\r\n\r\n  return { activeSelectionScope: frameworkState.sessionState.activeSelectionScope, availableSelectionScopes: frameworkState.sessionState.availableSelectionScopes };\r\n}\r\n\r\n// we declare the variable and export that rather than using export default.\r\n/**\r\n * SelectionScopeField React component. This component is designed to be specified in a status bar definition. It will\r\n * display the active selection scope that is used by the PresentationManager to determine what elements are added to the selection nap mode.\r\n * This React component is Redux connected.\r\n * @public\r\n */ // eslint-disable-next-line @typescript-eslint/naming-convention\r\nexport const SelectionScopeField = connect(mapStateToProps)(SelectionScopeFieldComponent);\r\n"]}

package/lib/public/locales/en/UiFramework.json

@@ -62,11 +62,6 @@
     "label": "Scope",
     "toolTip": "Selection Scope"
   },
-  "selectionScopeLabels": {
-    "element": "Element",
-    "assembly": "Assembly",
-    "top-assembly": "Top Assembly"
-  },
   "tests": {
     "singleContent": "Single Content",
     "label": "Test Label",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itwin/appui-react",
-  "version": "3.7.2",
+  "version": "3.7.4",
   "description": "UI framework",
   "main": "lib/cjs/appui-react.js",
   "module": "lib/esm/appui-react.js",
@@ -20,19 +20,19 @@
     "url": "http://www.bentley.com"
   },
   "peerDependencies": {
-    "@itwin/appui-abstract": "^3.7.2",
-    "@itwin/appui-layout-react": "^3.7.2",
-    "@itwin/components-react": "^3.7.2",
-    "@itwin/core-bentley": "^3.7.2",
-    "@itwin/core-common": "^3.7.2",
-    "@itwin/core-frontend": "^3.7.2",
-    "@itwin/core-geometry": "^3.7.2",
-    "@itwin/core-markup": "^3.7.2",
-    "@itwin/core-quantity": "^3.7.2",
-    "@itwin/core-react": "^3.7.2",
-    "@itwin/imodel-components-react": "^3.7.2",
-    "@itwin/presentation-common": "^3.7.2",
-    "@itwin/presentation-frontend": "^3.7.2",
+    "@itwin/appui-abstract": "^3.7.4",
+    "@itwin/appui-layout-react": "^3.7.4",
+    "@itwin/components-react": "^3.7.4",
+    "@itwin/core-bentley": "^3.7.4",
+    "@itwin/core-common": "^3.7.4",
+    "@itwin/core-frontend": "^3.7.4",
+    "@itwin/core-geometry": "^3.7.4",
+    "@itwin/core-markup": "^3.7.4",
+    "@itwin/core-quantity": "^3.7.4",
+    "@itwin/core-react": "^3.7.4",
+    "@itwin/imodel-components-react": "^3.7.4",
+    "@itwin/presentation-common": "^3.7.4",
+    "@itwin/presentation-frontend": "^3.7.4",
     "react": "^17.0.0",
     "react-dom": "^17.0.0",
     "react-redux": "^7.2.2",
@@ -43,22 +43,22 @@
     "NOTE: All tools used by scripts in this package must be listed as devDependencies"
   ],
   "devDependencies": {
-    "@itwin/appui-abstract": "3.7.2",
-    "@itwin/appui-layout-react": "3.7.2",
-    "@itwin/build-tools": "3.7.2",
-    "@itwin/components-react": "3.7.2",
-    "@itwin/core-bentley": "3.7.2",
-    "@itwin/core-common": "3.7.2",
-    "@itwin/core-frontend": "3.7.2",
-    "@itwin/core-geometry": "3.7.2",
-    "@itwin/core-markup": "3.7.2",
-    "@itwin/core-quantity": "3.7.2",
-    "@itwin/core-react": "3.7.2",
-    "@itwin/eslint-plugin": "3.7.2",
-    "@itwin/imodel-components-react": "3.7.2",
-    "@itwin/presentation-common": "3.7.2",
-    "@itwin/presentation-frontend": "3.7.2",
-    "@itwin/presentation-testing": "3.7.2",
+    "@itwin/appui-abstract": "3.7.4",
+    "@itwin/appui-layout-react": "3.7.4",
+    "@itwin/build-tools": "3.7.4",
+    "@itwin/components-react": "3.7.4",
+    "@itwin/core-bentley": "3.7.4",
+    "@itwin/core-common": "3.7.4",
+    "@itwin/core-frontend": "3.7.4",
+    "@itwin/core-geometry": "3.7.4",
+    "@itwin/core-markup": "3.7.4",
+    "@itwin/core-quantity": "3.7.4",
+    "@itwin/core-react": "3.7.4",
+    "@itwin/eslint-plugin": "3.7.4",
+    "@itwin/imodel-components-react": "3.7.4",
+    "@itwin/presentation-common": "3.7.4",
+    "@itwin/presentation-frontend": "3.7.4",
+    "@itwin/presentation-testing": "3.7.4",
     "@testing-library/react": "^12.0.0",
     "@testing-library/react-hooks": "^7.0.2",
     "@testing-library/user-event": "^14.4.2",
@@ -114,8 +114,8 @@
   "dependencies": {
     "@bentley/icons-generic": "^1.0.15",
     "@bentley/icons-generic-webfont": "^1.0.15",
-    "@itwin/core-telemetry": "3.7.2",
-    "@itwin/presentation-components": "3.7.2",
+    "@itwin/core-telemetry": "3.7.4",
+    "@itwin/presentation-components": "3.7.4",
     "@itwin/itwinui-css": "0.x",
     "@itwin/itwinui-react": "~1.46.0",
     "@itwin/itwinui-icons-react": "^1.15.0",