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

package/lib/cjs/appui-react/statusbar/useUiItemsProviderStatusBarItems.js

@@ -3,18 +3,16 @@
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
-/* eslint-disable deprecation/deprecation */
 /** @packageDocumentation
  * @module StatusBar
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useUiItemsProviderStatusBarItems = void 0;
 const React = require("react");
-const appui_abstract_1 = require("@itwin/appui-abstract");
 const useActiveStageId_1 = require("../hooks/useActiveStageId");
 const useAvailableUiItemsProviders_1 = require("../hooks/useAvailableUiItemsProviders");
-const FrontstageManager_1 = require("../frontstage/FrontstageManager");
-// cspell:ignore setxxx
+const UiFramework_1 = require("../UiFramework");
+const UiItemsManager_1 = require("../ui-items-provider/UiItemsManager");
 /** Hook that returns items from [[StatusBarItemsManager]].
  * @public
  */
@@ -31,25 +29,21 @@ const useUiItemsProviderStatusBarItems = (manager) => {
         // istanbul ignore else
         if (providersRef.current !== uiProviders || currentStageRef.current !== stageId) {
             currentStageRef.current = stageId;
-            const frontstageDef = FrontstageManager_1.FrontstageManager.activeFrontstageDef;
+            const frontstageDef = UiFramework_1.UiFramework.frontstages.activeFrontstageDef;
             // istanbul ignore else
             if (frontstageDef) {
                 providersRef.current = uiProviders;
-                const statusBarItems = appui_abstract_1.UiItemsManager.getStatusBarItems(stageId, frontstageDef.usage, frontstageDef.applicationData);
+                const statusBarItems = UiItemsManager_1.UiItemsManager.getStatusBarItems(stageId, frontstageDef.usage);
                 manager.loadItems(statusBarItems);
                 setItems(manager.items);
             }
         }
     }, [manager, uiItemProviderIds, stageId]);
-    // handle item changes caused by calls to UiFramework.addonStatusBarItemsManager.setxxx
+    // handle item changes caused by setter calls to UiFramework.addonStatusBarItemsManager
     React.useEffect(() => {
-        const handleChanged = (args) => {
+        return manager.onItemsChanged.addListener((args) => {
             setItems(args.items);
-        };
-        manager.onItemsChanged.addListener(handleChanged);
-        return () => {
-            manager.onItemsChanged.removeListener(handleChanged);
-        };
+        });
     }, [manager]);
     return items;
 };

package/lib/cjs/appui-react/statusbar/useUiItemsProviderStatusBarItems.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUiItemsProviderStatusBarItems.js","sourceRoot":"","sources":["../../../../src/appui-react/statusbar/useUiItemsProviderStatusBarItems.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F,4CAA4C;AAC5C;;GAEG;;;AAEH,+BAA+B;AAC/B,0DAE+B;AAC/B,gEAA6D;AAC7D,wFAAqF;AACrF,uEAAoE;AAEpE,uBAAuB;AAEvB;;GAEG;AACI,MAAM,gCAAgC,GAAG,CAAC,OAA8B,EAAkC,EAAE;IACjH,MAAM,iBAAiB,GAAG,IAAA,2DAA4B,GAAE,CAAC;IACzD,MAAM,OAAO,GAAG,IAAA,mCAAgB,GAAE,CAAC;IACnC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACtC,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACzC,wHAAwH;IACxH,2DAA2D;IAC3D,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,WAAW,GAAG,iBAAiB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAChD,uBAAuB;QACvB,IAAI,YAAY,CAAC,OAAO,KAAK,WAAW,IAAI,eAAe,CAAC,OAAO,KAAK,OAAO,EAAE;YAC/E,eAAe,CAAC,OAAO,GAAG,OAAO,CAAC;YAClC,MAAM,aAAa,GAAG,qCAAiB,CAAC,mBAAmB,CAAC;YAC5D,uBAAuB;YACvB,IAAI,aAAa,EAAE;gBACjB,YAAY,CAAC,OAAO,GAAG,WAAW,CAAC;gBACnC,MAAM,cAAc,GAAG,+BAAc,CAAC,iBAAiB,CAAC,OAAO,EAAE,aAAa,CAAC,KAAK,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC;gBACrH,OAAO,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;gBAClC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;aACzB;SACF;IAEH,CAAC,EAAE,CAAC,OAAO,EAAE,iBAAiB,EAAE,OAAO,CAAC,CAAC,CAAC;IAC1C,uFAAuF;IACvF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,aAAa,GAAG,CAAC,IAA+B,EAAE,EAAE;YACxD,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC,CAAC;QACF,OAAO,CAAC,cAAc,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;QAClD,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,cAAc,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;QACvD,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IACd,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAnCW,QAAA,gCAAgC,oCAmC3C","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/* eslint-disable deprecation/deprecation */\r\n/** @packageDocumentation\r\n * @module StatusBar\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport {\r\n  CommonStatusBarItem, StatusBarItemsChangedArgs, StatusBarItemsManager, UiItemsManager,\r\n} from \"@itwin/appui-abstract\";\r\nimport { useActiveStageId } from \"../hooks/useActiveStageId\";\r\nimport { useAvailableUiItemsProviders } from \"../hooks/useAvailableUiItemsProviders\";\r\nimport { FrontstageManager } from \"../frontstage/FrontstageManager\";\r\n\r\n// cspell:ignore setxxx\r\n\r\n/** Hook that returns items from [[StatusBarItemsManager]].\r\n * @public\r\n */\r\nexport const useUiItemsProviderStatusBarItems = (manager: StatusBarItemsManager): readonly CommonStatusBarItem[] => {\r\n  const uiItemProviderIds = useAvailableUiItemsProviders();\r\n  const stageId = useActiveStageId();\r\n  const [items, setItems] = React.useState(manager.items);\r\n  const providersRef = React.useRef(\"\");\r\n  const currentStageRef = React.useRef(\"\");\r\n  // gathers items from registered extensions - dependent on when a UiItemsProvider is register or unregistered and if the\r\n  // current stage's composer allows entries from extensions.\r\n  React.useEffect(() => {\r\n    const uiProviders = uiItemProviderIds.join(\"-\");\r\n    // istanbul ignore else\r\n    if (providersRef.current !== uiProviders || currentStageRef.current !== stageId) {\r\n      currentStageRef.current = stageId;\r\n      const frontstageDef = FrontstageManager.activeFrontstageDef;\r\n      // istanbul ignore else\r\n      if (frontstageDef) {\r\n        providersRef.current = uiProviders;\r\n        const statusBarItems = UiItemsManager.getStatusBarItems(stageId, frontstageDef.usage, frontstageDef.applicationData);\r\n        manager.loadItems(statusBarItems);\r\n        setItems(manager.items);\r\n      }\r\n    }\r\n\r\n  }, [manager, uiItemProviderIds, stageId]);\r\n  // handle item changes caused by calls to UiFramework.addonStatusBarItemsManager.setxxx\r\n  React.useEffect(() => {\r\n    const handleChanged = (args: StatusBarItemsChangedArgs) => {\r\n      setItems(args.items);\r\n    };\r\n    manager.onItemsChanged.addListener(handleChanged);\r\n    return () => {\r\n      manager.onItemsChanged.removeListener(handleChanged);\r\n    };\r\n  }, [manager]);\r\n  return items;\r\n};\r\n"]}
+{"version":3,"file":"useUiItemsProviderStatusBarItems.js","sourceRoot":"","sources":["../../../../src/appui-react/statusbar/useUiItemsProviderStatusBarItems.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,+BAA+B;AAE/B,gEAA6D;AAC7D,wFAAqF;AACrF,gDAA6C;AAE7C,wEAAqE;AAErE;;GAEG;AACI,MAAM,gCAAgC,GAAG,CAAC,OAA8B,EAA+B,EAAE;IAC9G,MAAM,iBAAiB,GAAG,IAAA,2DAA4B,GAAE,CAAC;IACzD,MAAM,OAAO,GAAG,IAAA,mCAAgB,GAAE,CAAC;IACnC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACtC,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACzC,wHAAwH;IACxH,2DAA2D;IAC3D,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,WAAW,GAAG,iBAAiB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAChD,uBAAuB;QACvB,IAAI,YAAY,CAAC,OAAO,KAAK,WAAW,IAAI,eAAe,CAAC,OAAO,KAAK,OAAO,EAAE;YAC/E,eAAe,CAAC,OAAO,GAAG,OAAO,CAAC;YAClC,MAAM,aAAa,GAAG,yBAAW,CAAC,WAAW,CAAC,mBAAmB,CAAC;YAClE,uBAAuB;YACvB,IAAI,aAAa,EAAE;gBACjB,YAAY,CAAC,OAAO,GAAG,WAAW,CAAC;gBACnC,MAAM,cAAc,GAAG,+BAAc,CAAC,iBAAiB,CAAC,OAAO,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;gBACtF,OAAO,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;gBAClC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;aACzB;SACF;IAEH,CAAC,EAAE,CAAC,OAAO,EAAE,iBAAiB,EAAE,OAAO,CAAC,CAAC,CAAC;IAC1C,uFAAuF;IACvF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,OAAO,OAAO,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE;YACjD,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IACd,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AA/BW,QAAA,gCAAgC,oCA+B3C","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 * as React from \"react\";\r\nimport { StatusBarItemsManager } from \"@itwin/appui-abstract\";\r\nimport { useActiveStageId } from \"../hooks/useActiveStageId\";\r\nimport { useAvailableUiItemsProviders } from \"../hooks/useAvailableUiItemsProviders\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { AnyStatusBarItem } from \"./StatusBarItem\";\r\nimport { UiItemsManager } from \"../ui-items-provider/UiItemsManager\";\r\n\r\n/** Hook that returns items from [[StatusBarItemsManager]].\r\n * @public\r\n */\r\nexport const useUiItemsProviderStatusBarItems = (manager: StatusBarItemsManager): readonly AnyStatusBarItem[] => {\r\n  const uiItemProviderIds = useAvailableUiItemsProviders();\r\n  const stageId = useActiveStageId();\r\n  const [items, setItems] = React.useState(manager.items);\r\n  const providersRef = React.useRef(\"\");\r\n  const currentStageRef = React.useRef(\"\");\r\n  // gathers items from registered extensions - dependent on when a UiItemsProvider is register or unregistered and if the\r\n  // current stage's composer allows entries from extensions.\r\n  React.useEffect(() => {\r\n    const uiProviders = uiItemProviderIds.join(\"-\");\r\n    // istanbul ignore else\r\n    if (providersRef.current !== uiProviders || currentStageRef.current !== stageId) {\r\n      currentStageRef.current = stageId;\r\n      const frontstageDef = UiFramework.frontstages.activeFrontstageDef;\r\n      // istanbul ignore else\r\n      if (frontstageDef) {\r\n        providersRef.current = uiProviders;\r\n        const statusBarItems = UiItemsManager.getStatusBarItems(stageId, frontstageDef.usage);\r\n        manager.loadItems(statusBarItems);\r\n        setItems(manager.items);\r\n      }\r\n    }\r\n\r\n  }, [manager, uiItemProviderIds, stageId]);\r\n  // handle item changes caused by setter calls to UiFramework.addonStatusBarItemsManager\r\n  React.useEffect(() => {\r\n    return manager.onItemsChanged.addListener((args) => {\r\n      setItems(args.items);\r\n    });\r\n  }, [manager]);\r\n  return items;\r\n};\r\n"]}

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

@@ -1,28 +1,10 @@
 /** @packageDocumentation
  * @module Notification
  */
-import * as React from "react";
-import { NotifyMessageType } from "../messages/ReactNotifyMessageDetails";
-import { StatusFieldProps } from "./StatusFieldProps";
-/** State for the [[ActivityCenterField]] component
- * @internal
- */
-interface ActivityCenterState {
-    message: NotifyMessageType;
-    percentage: number;
-    isActivityMessageVisible: boolean;
-}
+/// <reference types="react" />
+import { CommonProps } from "@itwin/core-react";
 /** Activity Center Field React component.
  * @public
  */
-export declare class ActivityCenterField extends React.Component<StatusFieldProps, ActivityCenterState> {
-    constructor(p: StatusFieldProps);
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    private _handleActivityMessageEvent;
-    private _handleActivityMessageCancelledEvent;
-    private _openActivityMessage;
-    render(): React.ReactNode;
-}
-export {};
+export declare function ActivityCenterField(props: CommonProps): JSX.Element | null;
 //# sourceMappingURL=ActivityCenter.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ActivityCenter.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/ActivityCenter.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAE1E,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD;;GAEG;AACH,UAAU,mBAAmB;IAC3B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,wBAAwB,EAAE,OAAO,CAAC;CACnC;AAED;;GAEG;AACH,qBAAa,mBAAoB,SAAQ,KAAK,CAAC,SAAS,CAAC,gBAAgB,EAAE,mBAAmB,CAAC;gBACjF,CAAC,EAAE,gBAAgB;IASf,iBAAiB;IAKjB,oBAAoB;IAKpC,OAAO,CAAC,2BAA2B,CAMjC;IAEF,OAAO,CAAC,oCAAoC,CAI1C;IAEF,OAAO,CAAC,oBAAoB,CAE1B;IAEc,MAAM,IAAI,KAAK,CAAC,SAAS;CA2B1C"}
+{"version":3,"file":"ActivityCenter.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/ActivityCenter.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAIH,OAAO,EAAY,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAM1D;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,WAAW,sBAqDrD"}

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

@@ -11,58 +11,50 @@ exports.ActivityCenterField = void 0;
 const classnames_1 = require("classnames");
 const React = require("react");
 const core_react_1 = require("@itwin/core-react");
-const appui_layout_react_1 = require("@itwin/appui-layout-react");
 const MessageManager_1 = require("../messages/MessageManager");
 const UiFramework_1 = require("../UiFramework");
+const itwinui_react_1 = require("@itwin/itwinui-react");
 /** Activity Center Field React component.
  * @public
  */
-class ActivityCenterField extends React.Component {
-    constructor(p) {
-        super(p);
-        this._handleActivityMessageEvent = (args) => {
-            this.setState({
-                message: args.message,
-                percentage: args.percentage,
-                isActivityMessageVisible: true,
-            });
-        };
-        this._handleActivityMessageCancelledEvent = () => {
-            this.setState({
-                isActivityMessageVisible: false,
-            });
-        };
-        this._openActivityMessage = () => {
-            MessageManager_1.MessageManager.setupActivityMessageValues(this.state.message, this.state.percentage, true);
-        };
-        this.state = {
-            message: "",
-            percentage: 0,
-            isActivityMessageVisible: true,
-        };
-    }
-    componentDidMount() {
-        MessageManager_1.MessageManager.onActivityMessageUpdatedEvent.addListener(this._handleActivityMessageEvent);
-        MessageManager_1.MessageManager.onActivityMessageCancelledEvent.addListener(this._handleActivityMessageCancelledEvent);
-    }
-    componentWillUnmount() {
-        MessageManager_1.MessageManager.onActivityMessageUpdatedEvent.removeListener(this._handleActivityMessageEvent);
-        MessageManager_1.MessageManager.onActivityMessageCancelledEvent.removeListener(this._handleActivityMessageCancelledEvent);
-    }
-    render() {
-        let footerMessages;
-        const isPercentageValid = (this.state.percentage > 0 && this.state.percentage < 100);
-        if (this.state.isActivityMessageVisible && isPercentageValid) {
-            const moreDetails = UiFramework_1.UiFramework.translate("activityCenter.moreDetails");
-            const tooltip = `${this.state.message}-${moreDetails}`;
-            footerMessages = (React.createElement(core_react_1.Centered, { className: (0, classnames_1.default)("open-activity-message", this.props.className), style: this.props.style, onClick: this._openActivityMessage, title: tooltip },
-                React.createElement(appui_layout_react_1.MessageLayout, { progress: React.createElement(appui_layout_react_1.MessageProgress, { status: appui_layout_react_1.Status.Information, progress: this.state.percentage }) })));
-        }
-        else {
-            footerMessages = React.createElement("div", null);
-        }
-        return footerMessages;
-    }
+function ActivityCenterField(props) {
+    const [message, setMessage] = React.useState("");
+    const [percentage, setPercentage] = React.useState(0);
+    const [isVisible, setIsVisible] = React.useState(true);
+    const [label] = React.useState(UiFramework_1.UiFramework.translate("activityCenter.percentComplete"));
+    React.useEffect(() => {
+        return MessageManager_1.MessageManager.onActivityMessageUpdatedEvent.addListener((args) => {
+            setMessage(args.message);
+            setPercentage(args.percentage);
+            setIsVisible(true);
+        });
+    }, []);
+    React.useEffect(() => {
+        return MessageManager_1.MessageManager.onActivityMessageCancelledEvent.addListener(() => {
+            setIsVisible(false);
+        });
+    }, []);
+    const openActivityMessage = () => {
+        MessageManager_1.MessageManager.setupActivityMessageValues(message, percentage, true);
+    };
+    const isPercentageValid = (percentage > 0 && percentage < 100);
+    if (!isVisible || !isPercentageValid)
+        return null;
+    const moreDetails = UiFramework_1.UiFramework.translate("activityCenter.moreDetails");
+    const tooltip = `${message}-${moreDetails}`;
+    return (React.createElement(core_react_1.Centered, { className: (0, classnames_1.default)("open-activity-message", props.className), style: {
+            height: "100%",
+            minWidth: 120,
+            padding: "0 8px",
+            alignItems: "end",
+            ...props.style,
+        }, onClick: openActivityMessage, title: tooltip },
+        React.createElement(itwinui_react_1.ProgressLinear, { style: {
+                flex: "1",
+            }, value: percentage, labels: [React.createElement(itwinui_react_1.Small, { key: 0 },
+                    percentage,
+                    " ",
+                    label)] })));
 }
 exports.ActivityCenterField = ActivityCenterField;
 //# sourceMappingURL=ActivityCenter.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ActivityCenter.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/ActivityCenter.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAC/B,kDAA6C;AAC7C,kEAAmF;AACnF,+DAAsF;AAEtF,gDAA6C;AAY7C;;GAEG;AACH,MAAa,mBAAoB,SAAQ,KAAK,CAAC,SAAgD;IAC7F,YAAY,CAAmB;QAC7B,KAAK,CAAC,CAAC,CAAC,CAAC;QAkBH,gCAA2B,GAAG,CAAC,IAA8B,EAAE,EAAE;YACvE,IAAI,CAAC,QAAQ,CAAC;gBACZ,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,UAAU,EAAE,IAAI,CAAC,UAAU;gBAC3B,wBAAwB,EAAE,IAAI;aAC/B,CAAC,CAAC;QACL,CAAC,CAAC;QAEM,yCAAoC,GAAG,GAAG,EAAE;YAClD,IAAI,CAAC,QAAQ,CAAC;gBACZ,wBAAwB,EAAE,KAAK;aAChC,CAAC,CAAC;QACL,CAAC,CAAC;QAEM,yBAAoB,GAAG,GAAG,EAAE;YAClC,+BAAc,CAAC,0BAA0B,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;QAC7F,CAAC,CAAC;QAjCA,IAAI,CAAC,KAAK,GAAG;YACX,OAAO,EAAE,EAAE;YACX,UAAU,EAAE,CAAC;YACb,wBAAwB,EAAE,IAAI;SAC/B,CAAC;IACJ,CAAC;IAEe,iBAAiB;QAC/B,+BAAc,CAAC,6BAA6B,CAAC,WAAW,CAAC,IAAI,CAAC,2BAA2B,CAAC,CAAC;QAC3F,+BAAc,CAAC,+BAA+B,CAAC,WAAW,CAAC,IAAI,CAAC,oCAAoC,CAAC,CAAC;IACxG,CAAC;IAEe,oBAAoB;QAClC,+BAAc,CAAC,6BAA6B,CAAC,cAAc,CAAC,IAAI,CAAC,2BAA2B,CAAC,CAAC;QAC9F,+BAAc,CAAC,+BAA+B,CAAC,cAAc,CAAC,IAAI,CAAC,oCAAoC,CAAC,CAAC;IAC3G,CAAC;IAoBe,MAAM;QACpB,IAAI,cAA+B,CAAC;QACpC,MAAM,iBAAiB,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,CAAC,CAAC;QACrF,IAAI,IAAI,CAAC,KAAK,CAAC,wBAAwB,IAAI,iBAAiB,EAAE;YAC5D,MAAM,WAAW,GAAG,yBAAW,CAAC,SAAS,CAAC,4BAA4B,CAAC,CAAC;YACxE,MAAM,OAAO,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,WAAW,EAAE,CAAC;YAEvD,cAAc,GAAG,CACf,oBAAC,qBAAQ,IAAC,SAAS,EAAE,IAAA,oBAAU,EAAC,uBAAuB,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAC5E,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,KAAK,EAAE,OAAO;gBAElD,oBAAC,kCAAa,IACZ,QAAQ,EACN,oBAAC,oCAAe,IACd,MAAM,EAAE,2BAAM,CAAC,WAAW,EAC1B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,GAC/B,GAEJ,CACO,CACZ,CAAC;SACH;aAAM;YACL,cAAc,GAAG,gCAAO,CAAC;SAC1B;QACD,OAAO,cAAc,CAAC;IACxB,CAAC;CACF;AAjED,kDAiEC","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 Notification\r\n */\r\n\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { Centered } from \"@itwin/core-react\";\r\nimport { MessageLayout, MessageProgress, Status } from \"@itwin/appui-layout-react\";\r\nimport { ActivityMessageEventArgs, MessageManager } from \"../messages/MessageManager\";\r\nimport { NotifyMessageType } from \"../messages/ReactNotifyMessageDetails\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { StatusFieldProps } from \"./StatusFieldProps\";\r\n\r\n/** State for the [[ActivityCenterField]] component\r\n * @internal\r\n */\r\ninterface ActivityCenterState {\r\n  message: NotifyMessageType;\r\n  percentage: number;\r\n  isActivityMessageVisible: boolean;\r\n}\r\n\r\n/** Activity Center Field React component.\r\n * @public\r\n */\r\nexport class ActivityCenterField extends React.Component<StatusFieldProps, ActivityCenterState> {\r\n  constructor(p: StatusFieldProps) {\r\n    super(p);\r\n    this.state = {\r\n      message: \"\",\r\n      percentage: 0,\r\n      isActivityMessageVisible: true,\r\n    };\r\n  }\r\n\r\n  public override componentDidMount() {\r\n    MessageManager.onActivityMessageUpdatedEvent.addListener(this._handleActivityMessageEvent);\r\n    MessageManager.onActivityMessageCancelledEvent.addListener(this._handleActivityMessageCancelledEvent);\r\n  }\r\n\r\n  public override componentWillUnmount() {\r\n    MessageManager.onActivityMessageUpdatedEvent.removeListener(this._handleActivityMessageEvent);\r\n    MessageManager.onActivityMessageCancelledEvent.removeListener(this._handleActivityMessageCancelledEvent);\r\n  }\r\n\r\n  private _handleActivityMessageEvent = (args: ActivityMessageEventArgs) => {\r\n    this.setState({\r\n      message: args.message,\r\n      percentage: args.percentage,\r\n      isActivityMessageVisible: true,\r\n    });\r\n  };\r\n\r\n  private _handleActivityMessageCancelledEvent = () => {\r\n    this.setState({\r\n      isActivityMessageVisible: false,\r\n    });\r\n  };\r\n\r\n  private _openActivityMessage = () => {\r\n    MessageManager.setupActivityMessageValues(this.state.message, this.state.percentage, true);\r\n  };\r\n\r\n  public override render(): React.ReactNode {\r\n    let footerMessages: React.ReactNode;\r\n    const isPercentageValid = (this.state.percentage > 0 && this.state.percentage < 100);\r\n    if (this.state.isActivityMessageVisible && isPercentageValid) {\r\n      const moreDetails = UiFramework.translate(\"activityCenter.moreDetails\");\r\n      const tooltip = `${this.state.message}-${moreDetails}`;\r\n\r\n      footerMessages = (\r\n        <Centered className={classnames(\"open-activity-message\", this.props.className)}\r\n          style={this.props.style}\r\n          onClick={this._openActivityMessage} title={tooltip}\r\n        >\r\n          <MessageLayout\r\n            progress={\r\n              <MessageProgress\r\n                status={Status.Information}\r\n                progress={this.state.percentage}\r\n              />\r\n            }\r\n          />\r\n        </Centered>\r\n      );\r\n    } else {\r\n      footerMessages = <div />;\r\n    }\r\n    return footerMessages;\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"ActivityCenter.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/ActivityCenter.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,2CAAoC;AACpC,+BAA+B;AAC/B,kDAA0D;AAC1D,+DAA4D;AAE5D,gDAA6C;AAC7C,wDAA6D;AAE7D;;GAEG;AACH,SAAgB,mBAAmB,CAAC,KAAkB;IACpD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAoB,EAAE,CAAC,CAAC;IACpE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,CAAC,CAAC,CAAC;IAC9D,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAU,IAAI,CAAC,CAAC;IAChE,MAAM,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,yBAAW,CAAC,SAAS,CAAC,gCAAgC,CAAC,CAAC,CAAC;IAExF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,OAAO,+BAAc,CAAC,6BAA6B,CAAC,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE;YACvE,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACzB,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YAC/B,YAAY,CAAC,IAAI,CAAC,CAAC;QACrB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,OAAO,+BAAc,CAAC,+BAA+B,CAAC,WAAW,CAAC,GAAG,EAAE;YACrE,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,+BAAc,CAAC,0BAA0B,CAAC,OAAO,EAAE,UAAU,EAAE,IAAI,CAAC,CAAC;IACvE,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,UAAU,GAAG,CAAC,IAAI,UAAU,GAAG,GAAG,CAAC,CAAC;IAC/D,IAAI,CAAC,SAAS,IAAI,CAAC,iBAAiB;QAClC,OAAO,IAAI,CAAC;IAEd,MAAM,WAAW,GAAG,yBAAW,CAAC,SAAS,CAAC,4BAA4B,CAAC,CAAC;IACxE,MAAM,OAAO,GAAG,GAAG,OAAO,IAAI,WAAW,EAAE,CAAC;IAE5C,OAAO,CACL,oBAAC,qBAAQ,IACP,SAAS,EAAE,IAAA,oBAAU,EAAC,uBAAuB,EAAE,KAAK,CAAC,SAAS,CAAC,EAC/D,KAAK,EAAE;YACL,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,GAAG;YACb,OAAO,EAAE,OAAO;YAChB,UAAU,EAAE,KAAK;YACjB,GAAG,KAAK,CAAC,KAAK;SACf,EACD,OAAO,EAAE,mBAAmB,EAC5B,KAAK,EAAE,OAAO;QAEd,oBAAC,8BAAc,IACb,KAAK,EAAE;gBACL,IAAI,EAAE,GAAG;aACV,EACD,KAAK,EAAE,UAAU,EACjB,MAAM,EAAE,CAAC,oBAAC,qBAAK,IAAC,GAAG,EAAE,CAAC;oBAAG,UAAU;;oBAAG,KAAK,CAAS,CAAC,GACrD,CACO,CACZ,CAAC;AACJ,CAAC;AArDD,kDAqDC","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 Notification\r\n */\r\n\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { Centered, CommonProps } from \"@itwin/core-react\";\r\nimport { MessageManager } from \"../messages/MessageManager\";\r\nimport { NotifyMessageType } from \"../messages/ReactNotifyMessageDetails\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { ProgressLinear, Small } from \"@itwin/itwinui-react\";\r\n\r\n/** Activity Center Field React component.\r\n * @public\r\n */\r\nexport function ActivityCenterField(props: CommonProps) {\r\n  const [message, setMessage] = React.useState<NotifyMessageType>(\"\");\r\n  const [percentage, setPercentage] = React.useState<number>(0);\r\n  const [isVisible, setIsVisible] = React.useState<boolean>(true);\r\n  const [label] = React.useState(UiFramework.translate(\"activityCenter.percentComplete\"));\r\n\r\n  React.useEffect(() => {\r\n    return MessageManager.onActivityMessageUpdatedEvent.addListener((args) => {\r\n      setMessage(args.message);\r\n      setPercentage(args.percentage);\r\n      setIsVisible(true);\r\n    });\r\n  }, []);\r\n\r\n  React.useEffect(() => {\r\n    return MessageManager.onActivityMessageCancelledEvent.addListener(() => {\r\n      setIsVisible(false);\r\n    });\r\n  }, []);\r\n\r\n  const openActivityMessage = () => {\r\n    MessageManager.setupActivityMessageValues(message, percentage, true);\r\n  };\r\n\r\n  const isPercentageValid = (percentage > 0 && percentage < 100);\r\n  if (!isVisible || !isPercentageValid)\r\n    return null;\r\n\r\n  const moreDetails = UiFramework.translate(\"activityCenter.moreDetails\");\r\n  const tooltip = `${message}-${moreDetails}`;\r\n\r\n  return (\r\n    <Centered\r\n      className={classnames(\"open-activity-message\", props.className)}\r\n      style={{\r\n        height: \"100%\",\r\n        minWidth: 120,\r\n        padding: \"0 8px\",\r\n        alignItems: \"end\",\r\n        ...props.style,\r\n      }}\r\n      onClick={openActivityMessage}\r\n      title={tooltip}\r\n    >\r\n      <ProgressLinear\r\n        style={{\r\n          flex: \"1\",\r\n        }}\r\n        value={percentage}\r\n        labels={[<Small key={0}>{percentage} {label}</Small>]}\r\n      />\r\n    </Centered>\r\n  );\r\n}\r\n"]}

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

@@ -2,7 +2,7 @@
  * @module Notification
  */
 import * as React from "react";
-import { StatusFieldProps } from "./StatusFieldProps";
+import { CommonProps } from "@itwin/core-react";
 /** Enum for the [[MessageCenterField]] active tab
  * @internal
  */
@@ -17,27 +17,17 @@ interface MessageCenterState {
     activeTab: MessageCenterActiveTab;
     target: HTMLDivElement | null;
     messageCount: number;
-    openWidget: string | null;
-}
-/** Properties for withMessageCenterFieldProps HOC.
- * @public
- */
-export interface MessageCenterFieldProps extends StatusFieldProps {
-    /** Message center dialog target.
-     * @deprecated in 3.3. Use `MessageManager.registerAnimateOutToElement` to register this ref in the related component.
-    */
-    targetRef?: React.Ref<HTMLElement>;
+    isOpen: boolean;
 }
 /** Message Center Field React component.
  * @public
  */
-export declare class MessageCenterField extends React.Component<MessageCenterFieldProps, MessageCenterState> {
-    private _className;
+export declare class MessageCenterField extends React.Component<CommonProps, MessageCenterState> {
     private _indicator;
     private _title;
     private _unloadMessagesUpdatedHandler?;
     private _removeOpenMessagesCenterHandler?;
-    constructor(p: MessageCenterFieldProps);
+    constructor(p: CommonProps);
     /** @internal */
     componentDidMount(): void;
     /** @internal */
@@ -45,14 +35,13 @@ export declare class MessageCenterField extends React.Component<MessageCenterFie
     private _handleMessagesUpdatedEvent;
     private _handleOpenMessageCenterEvent;
     render(): React.ReactNode;
-    private _handleTargetRef;
     private _handleClose;
     private _handleOutsideClick;
     private _handleMessageIndicatorClick;
     private _changeActiveTab;
     private getMessages;
     private isProblemStatus;
-    private setOpenWidget;
+    private setIsOpen;
 }
 export {};
 //# sourceMappingURL=MessageCenter.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"MessageCenter.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/MessageCenter.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD;;GAEG;AACH,aAAK,sBAAsB;IACzB,WAAW,IAAA;IACX,QAAQ,IAAA;CACT;AAED;;GAEG;AACH,UAAU,kBAAkB;IAC1B,SAAS,EAAE,sBAAsB,CAAC;IAClC,MAAM,EAAE,cAAc,GAAG,IAAI,CAAC;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B;AAED;;GAEG;AACH,MAAM,WAAW,uBAAwB,SAAQ,gBAAgB;IAC/D;;MAEE;IACF,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CACpC;AAED;;GAEG;AACH,qBAAa,kBAAmB,SAAQ,KAAK,CAAC,SAAS,CAAC,uBAAuB,EAAE,kBAAkB,CAAC;IAClG,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,UAAU,CAAqC;IACvD,OAAO,CAAC,MAAM,CAAmD;IACjE,OAAO,CAAC,6BAA6B,CAAC,CAAa;IACnD,OAAO,CAAC,gCAAgC,CAAC,CAAa;gBAE1C,CAAC,EAAE,uBAAuB;IAetC,gBAAgB;IACA,iBAAiB;IAMjC,gBAAgB;IACA,oBAAoB;IAapC,OAAO,CAAC,2BAA2B,CAIjC;IAEF,OAAO,CAAC,6BAA6B,CAEnC;IAEc,MAAM,IAAI,KAAK,CAAC,SAAS;IAyDzC,OAAO,CAAC,gBAAgB,CAQtB;IAEF,OAAO,CAAC,YAAY,CAElB;IAEF,OAAO,CAAC,mBAAmB,CAOzB;IAEF,OAAO,CAAC,4BAA4B,CAOlC;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,WAAW;IA+BnB,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,aAAa;CAKtB"}
+{"version":3,"file":"MessageCenter.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/MessageCenter.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD;;GAEG;AACH,aAAK,sBAAsB;IACzB,WAAW,IAAA;IACX,QAAQ,IAAA;CACT;AAED;;GAEG;AACH,UAAU,kBAAkB;IAC1B,SAAS,EAAE,sBAAsB,CAAC;IAClC,MAAM,EAAE,cAAc,GAAG,IAAI,CAAC;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,OAAO,CAAC;CACjB;AAED;;GAEG;AACH,qBAAa,kBAAmB,SAAQ,KAAK,CAAC,SAAS,CAAC,WAAW,EAAE,kBAAkB,CAAC;IACtF,OAAO,CAAC,UAAU,CAAqC;IACvD,OAAO,CAAC,MAAM,CAAmD;IACjE,OAAO,CAAC,6BAA6B,CAAC,CAAa;IACnD,OAAO,CAAC,gCAAgC,CAAC,CAAa;gBAE1C,CAAC,EAAE,WAAW;IAW1B,gBAAgB;IACA,iBAAiB;IAMjC,gBAAgB;IACA,oBAAoB;IAapC,OAAO,CAAC,2BAA2B,CAIjC;IAEF,OAAO,CAAC,6BAA6B,CAEnC;IAEc,MAAM,IAAI,KAAK,CAAC,SAAS;IAqDzC,OAAO,CAAC,YAAY,CAElB;IAEF,OAAO,CAAC,mBAAmB,CAOzB;IAEF,OAAO,CAAC,4BAA4B,CAElC;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,WAAW;IA+BnB,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,SAAS;CAGlB"}

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

@@ -27,7 +27,6 @@ var MessageCenterActiveTab;
  */
 class MessageCenterField extends React.Component {
     constructor(p) {
-        var _a;
         super(p);
         this._indicator = React.createRef();
         this._title = UiFramework_1.UiFramework.translate("messageCenter.messages");
@@ -37,19 +36,10 @@ class MessageCenterField extends React.Component {
                 this.setState({ messageCount: MessageManager_1.MessageManager.messages.length });
         };
         this._handleOpenMessageCenterEvent = () => {
-            this.setOpenWidget(this._className);
-        };
-        this._handleTargetRef = (target) => {
-            // eslint-disable-next-line deprecation/deprecation
-            const ref = this.props.targetRef;
-            if (typeof ref === "function")
-                ref(target);
-            else if (ref)
-                ref.current = target;
-            this.setState({ target });
+            this.setIsOpen(true);
         };
         this._handleClose = () => {
-            this.setOpenWidget(null);
+            this.setIsOpen(false);
         };
         this._handleOutsideClick = (e) => {
             if (!this._indicator.current ||
@@ -59,25 +49,16 @@ class MessageCenterField extends React.Component {
             this._handleClose();
         };
         this._handleMessageIndicatorClick = () => {
-            var _a;
-            // eslint-disable-next-line deprecation/deprecation
-            const isOpen = ((_a = this.props.openWidget) !== null && _a !== void 0 ? _a : this.state.openWidget) === this._className;
-            if (isOpen)
-                this.setOpenWidget(null);
-            else
-                this.setOpenWidget(this._className);
+            this.setIsOpen(!this.state.isOpen);
         };
         this._changeActiveTab = (tab) => {
             this.setState({ activeTab: tab });
         };
-        const instance = this.constructor;
-        this._className = instance.name;
         this.state = {
             activeTab: MessageCenterActiveTab.AllMessages,
             target: null,
             messageCount: MessageManager_1.MessageManager.messages.length,
-            // eslint-disable-next-line deprecation/deprecation
-            openWidget: (_a = p.openWidget) !== null && _a !== void 0 ? _a : null,
+            isOpen: false,
         };
     }
     /** @internal */
@@ -100,18 +81,12 @@ class MessageCenterField extends React.Component {
         }
     }
     render() {
-        var _a, _b, _c;
         const tooltip = `${this.state.messageCount} ${this._title}`;
         const divStyle = { ...this.props.style, height: "100%" };
         const footerMessages = (React.createElement(React.Fragment, null,
-            React.createElement("div", { className: this.props.className, style: divStyle, title: tooltip, ref: this._handleTargetRef },
-                React.createElement(appui_layout_react_1.MessageCenter, { indicatorRef: this._indicator, 
-                    // eslint-disable-next-line deprecation/deprecation
-                    isInFooterMode: (_a = this.props.isInFooterMode) !== null && _a !== void 0 ? _a : true, 
-                    // eslint-disable-next-line deprecation/deprecation
-                    label: ((_b = this.props.isInFooterMode) !== null && _b !== void 0 ? _b : true) ? this._title : undefined, onClick: this._handleMessageIndicatorClick }, this.state.messageCount.toString())),
-            React.createElement(appui_layout_react_1.FooterPopup // eslint-disable-line deprecation/deprecation
-            , { isOpen: ((_c = this.props.openWidget) !== null && _c !== void 0 ? _c : this.state.openWidget) === this._className, onClose: this._handleClose, onOutsideClick: this._handleOutsideClick, target: this.state.target },
+            React.createElement("div", { className: this.props.className, style: divStyle, title: tooltip },
+                React.createElement(appui_layout_react_1.MessageCenter, { indicatorRef: this._indicator, label: this._title, onClick: this._handleMessageIndicatorClick }, this.state.messageCount.toString())),
+            React.createElement(appui_layout_react_1.FooterPopup, { isOpen: this.state.isOpen, onClose: this._handleClose, onOutsideClick: this._handleOutsideClick, target: this._indicator.current },
                 React.createElement(appui_layout_react_1.MessageCenterDialog, { prompt: UiFramework_1.UiFramework.translate("messageCenter.prompt"), tabs: React.createElement(React.Fragment, null,
                         React.createElement(appui_layout_react_1.MessageCenterTab, { isActive: this.state.activeTab === MessageCenterActiveTab.AllMessages, onClick: () => this._changeActiveTab(MessageCenterActiveTab.AllMessages) }, UiFramework_1.UiFramework.translate("messageCenter.all")),
                         React.createElement(appui_layout_react_1.MessageCenterTab, { isActive: this.state.activeTab === MessageCenterActiveTab.Problems, onClick: () => this._changeActiveTab(MessageCenterActiveTab.Problems) }, UiFramework_1.UiFramework.translate("messageCenter.errors"))), title: this._title }, this.getMessages()))));
@@ -130,7 +105,7 @@ class MessageCenterField extends React.Component {
                     details.detailedMessage &&
                         React.createElement(React.Fragment, null,
                             React.createElement("br", null),
-                            React.createElement(MessageSpan_1.MessageSpan, { className: "uicore-text-small", message: details.detailedMessage }))));
+                            React.createElement(MessageSpan_1.MessageSpan, { className: "iui-text-small", message: details.detailedMessage }))));
             }
         });
         return tabRows;
@@ -141,11 +116,8 @@ class MessageCenterField extends React.Component {
             return true;
         return false;
     }
-    setOpenWidget(openWidget) {
-        var _a, _b;
-        // eslint-disable-next-line deprecation/deprecation
-        (_b = (_a = this.props).onOpenWidget) === null || _b === void 0 ? void 0 : _b.call(_a, openWidget);
-        this.setState({ openWidget });
+    setIsOpen(isOpen) {
+        this.setState({ isOpen });
     }
 }
 exports.MessageCenterField = MessageCenterField;

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

@@ -1 +1 @@
-{"version":3,"file":"MessageCenter.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/MessageCenter.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 Notification\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { OutputMessagePriority } from \"@itwin/core-frontend\";\r\nimport { FooterPopup, MessageCenter, MessageCenterDialog, MessageCenterMessage, MessageCenterTab } from \"@itwin/appui-layout-react\";\r\nimport { MessageManager } from \"../messages/MessageManager\";\r\nimport { MessageSpan } from \"../messages/MessageSpan\";\r\nimport { NotifyMessageDetailsType } from \"../messages/ReactNotifyMessageDetails\";\r\nimport { StatusBarFieldId } from \"../statusbar/StatusBarWidgetControl\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { StatusFieldProps } from \"./StatusFieldProps\";\r\n\r\n/** Enum for the [[MessageCenterField]] active tab\r\n * @internal\r\n */\r\nenum MessageCenterActiveTab {\r\n  AllMessages,\r\n  Problems,\r\n}\r\n\r\n/** State for the [[MessageCenterField]] React component\r\n * @internal\r\n */\r\ninterface MessageCenterState {\r\n  activeTab: MessageCenterActiveTab;\r\n  target: HTMLDivElement | null;\r\n  messageCount: number;\r\n  openWidget: string | null;\r\n}\r\n\r\n/** Properties for withMessageCenterFieldProps HOC.\r\n * @public\r\n */\r\nexport interface MessageCenterFieldProps extends StatusFieldProps {\r\n  /** Message center dialog target.\r\n   * @deprecated in 3.3. Use `MessageManager.registerAnimateOutToElement` to register this ref in the related component.\r\n  */\r\n  targetRef?: React.Ref<HTMLElement>;\r\n}\r\n\r\n/** Message Center Field React component.\r\n * @public\r\n */\r\nexport class MessageCenterField extends React.Component<MessageCenterFieldProps, MessageCenterState> {\r\n  private _className: string;\r\n  private _indicator = React.createRef<HTMLDivElement>();\r\n  private _title = UiFramework.translate(\"messageCenter.messages\");\r\n  private _unloadMessagesUpdatedHandler?: () => void;\r\n  private _removeOpenMessagesCenterHandler?: () => void;\r\n\r\n  constructor(p: MessageCenterFieldProps) {\r\n    super(p);\r\n\r\n    const instance = this.constructor;\r\n    this._className = instance.name;\r\n\r\n    this.state = {\r\n      activeTab: MessageCenterActiveTab.AllMessages,\r\n      target: null,\r\n      messageCount: MessageManager.messages.length,\r\n      // eslint-disable-next-line deprecation/deprecation\r\n      openWidget: p.openWidget ?? null,\r\n    };\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._unloadMessagesUpdatedHandler = MessageManager.onMessagesUpdatedEvent.addListener(this._handleMessagesUpdatedEvent, this);\r\n    this._removeOpenMessagesCenterHandler = MessageManager.onOpenMessageCenterEvent.addListener(this._handleOpenMessageCenterEvent, this);\r\n    MessageManager.registerAnimateOutToElement(this._indicator.current);\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    // istanbul ignore else\r\n    if (this._unloadMessagesUpdatedHandler) {\r\n      this._unloadMessagesUpdatedHandler();\r\n      this._unloadMessagesUpdatedHandler = undefined;\r\n    }\r\n    // istanbul ignore else\r\n    if (this._removeOpenMessagesCenterHandler) {\r\n      this._removeOpenMessagesCenterHandler();\r\n      this._removeOpenMessagesCenterHandler = undefined;\r\n    }\r\n  }\r\n\r\n  private _handleMessagesUpdatedEvent = () => {\r\n    // istanbul ignore else\r\n    if (this._unloadMessagesUpdatedHandler)\r\n      this.setState({ messageCount: MessageManager.messages.length });\r\n  };\r\n\r\n  private _handleOpenMessageCenterEvent = () => {\r\n    this.setOpenWidget(this._className);\r\n  };\r\n\r\n  public override render(): React.ReactNode {\r\n    const tooltip = `${this.state.messageCount} ${this._title}`;\r\n    const divStyle = { ...this.props.style, height: \"100%\" };\r\n    const footerMessages = (\r\n      <>\r\n        <div\r\n          className={this.props.className}\r\n          style={divStyle}\r\n          title={tooltip}\r\n          ref={this._handleTargetRef}\r\n        >\r\n          <MessageCenter\r\n            indicatorRef={this._indicator}\r\n            // eslint-disable-next-line deprecation/deprecation\r\n            isInFooterMode={this.props.isInFooterMode ?? true}\r\n            // eslint-disable-next-line deprecation/deprecation\r\n            label={(this.props.isInFooterMode ?? true) ? this._title : undefined}\r\n            onClick={this._handleMessageIndicatorClick}\r\n          >\r\n            {this.state.messageCount.toString()}\r\n          </MessageCenter>\r\n        </div>\r\n        <FooterPopup // eslint-disable-line deprecation/deprecation\r\n          isOpen={(this.props.openWidget ?? this.state.openWidget) === this._className} // eslint-disable-line deprecation/deprecation\r\n          onClose={this._handleClose}\r\n          onOutsideClick={this._handleOutsideClick}\r\n          target={this.state.target}\r\n        >\r\n          <MessageCenterDialog\r\n            prompt={UiFramework.translate(\"messageCenter.prompt\")}\r\n            tabs={\r\n              <>\r\n                <MessageCenterTab\r\n                  isActive={this.state.activeTab === MessageCenterActiveTab.AllMessages}\r\n                  onClick={() => this._changeActiveTab(MessageCenterActiveTab.AllMessages)}\r\n                >\r\n                  {UiFramework.translate(\"messageCenter.all\")}\r\n                </MessageCenterTab>\r\n                <MessageCenterTab\r\n                  isActive={this.state.activeTab === MessageCenterActiveTab.Problems}\r\n                  onClick={() => this._changeActiveTab(MessageCenterActiveTab.Problems)}\r\n                >\r\n                  {UiFramework.translate(\"messageCenter.errors\")}\r\n                </MessageCenterTab>\r\n              </>\r\n            }\r\n            title={this._title}\r\n          >\r\n            {this.getMessages()}\r\n          </MessageCenterDialog>\r\n        </FooterPopup>\r\n      </>\r\n    );\r\n\r\n    return footerMessages;\r\n  }\r\n\r\n  private _handleTargetRef = (target: HTMLDivElement | null) => {\r\n    // eslint-disable-next-line deprecation/deprecation\r\n    const ref = this.props.targetRef;\r\n    if (typeof ref === \"function\")\r\n      ref(target);\r\n    else if (ref)\r\n      (ref as React.MutableRefObject<HTMLElement | null>).current = target;\r\n    this.setState({ target });\r\n  };\r\n\r\n  private _handleClose = () => {\r\n    this.setOpenWidget(null);\r\n  };\r\n\r\n  private _handleOutsideClick = (e: MouseEvent) => {\r\n    if (!this._indicator.current ||\r\n      !(e.target instanceof Node) ||\r\n      this._indicator.current.contains(e.target))\r\n      return;\r\n\r\n    this._handleClose();\r\n  };\r\n\r\n  private _handleMessageIndicatorClick = () => {\r\n    // eslint-disable-next-line deprecation/deprecation\r\n    const isOpen = (this.props.openWidget ?? this.state.openWidget) === this._className;\r\n    if (isOpen)\r\n      this.setOpenWidget(null);\r\n    else\r\n      this.setOpenWidget(this._className);\r\n  };\r\n\r\n  private _changeActiveTab = (tab: MessageCenterActiveTab) => {\r\n    this.setState({ activeTab: tab });\r\n  };\r\n\r\n  private getMessages(): React.ReactChild[] {\r\n    const messages = MessageManager.messages.slice(0).reverse();\r\n    const tabRows: React.ReactChild[] = new Array<React.ReactChild>();\r\n\r\n    messages.forEach((details: NotifyMessageDetailsType, index: number) => {\r\n      /* istanbul ignore else */\r\n      if (this.state.activeTab === MessageCenterActiveTab.AllMessages || this.isProblemStatus(details.priority)) {\r\n\r\n        const iconClassName = MessageManager.getIconClassName(details);\r\n        const message = details.briefMessage;\r\n\r\n        tabRows.push(\r\n          <MessageCenterMessage\r\n            key={index.toString()}\r\n            icon={<i className={iconClassName} />}\r\n          >\r\n            <MessageSpan message={message} />\r\n            {details.detailedMessage &&\r\n              <>\r\n                <br />\r\n                <MessageSpan className=\"uicore-text-small\" message={details.detailedMessage} />\r\n              </>\r\n            }\r\n          </MessageCenterMessage>,\r\n        );\r\n      }\r\n    });\r\n\r\n    return tabRows;\r\n  }\r\n\r\n  private isProblemStatus(priority: OutputMessagePriority): boolean {\r\n    // See priority values in DgnPlatform defined in NotificationManager\r\n\r\n    if (priority === OutputMessagePriority.Error || priority === OutputMessagePriority.Fatal)\r\n      return true;\r\n\r\n    return false;\r\n  }\r\n\r\n  private setOpenWidget(openWidget: StatusBarFieldId) {\r\n    // eslint-disable-next-line deprecation/deprecation\r\n    this.props.onOpenWidget?.(openWidget);\r\n    this.setState({openWidget});\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"MessageCenter.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/MessageCenter.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 Notification\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { OutputMessagePriority } from \"@itwin/core-frontend\";\r\nimport { FooterPopup, MessageCenter, MessageCenterDialog, MessageCenterMessage, MessageCenterTab } from \"@itwin/appui-layout-react\";\r\nimport { MessageManager } from \"../messages/MessageManager\";\r\nimport { MessageSpan } from \"../messages/MessageSpan\";\r\nimport { NotifyMessageDetailsType } from \"../messages/ReactNotifyMessageDetails\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\n\r\n/** Enum for the [[MessageCenterField]] active tab\r\n * @internal\r\n */\r\nenum MessageCenterActiveTab {\r\n  AllMessages,\r\n  Problems,\r\n}\r\n\r\n/** State for the [[MessageCenterField]] React component\r\n * @internal\r\n */\r\ninterface MessageCenterState {\r\n  activeTab: MessageCenterActiveTab;\r\n  target: HTMLDivElement | null;\r\n  messageCount: number;\r\n  isOpen: boolean;\r\n}\r\n\r\n/** Message Center Field React component.\r\n * @public\r\n */\r\nexport class MessageCenterField extends React.Component<CommonProps, MessageCenterState> {\r\n  private _indicator = React.createRef<HTMLDivElement>();\r\n  private _title = UiFramework.translate(\"messageCenter.messages\");\r\n  private _unloadMessagesUpdatedHandler?: () => void;\r\n  private _removeOpenMessagesCenterHandler?: () => void;\r\n\r\n  constructor(p: CommonProps) {\r\n    super(p);\r\n\r\n    this.state = {\r\n      activeTab: MessageCenterActiveTab.AllMessages,\r\n      target: null,\r\n      messageCount: MessageManager.messages.length,\r\n      isOpen: false,\r\n    };\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._unloadMessagesUpdatedHandler = MessageManager.onMessagesUpdatedEvent.addListener(this._handleMessagesUpdatedEvent, this);\r\n    this._removeOpenMessagesCenterHandler = MessageManager.onOpenMessageCenterEvent.addListener(this._handleOpenMessageCenterEvent, this);\r\n    MessageManager.registerAnimateOutToElement(this._indicator.current);\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    // istanbul ignore else\r\n    if (this._unloadMessagesUpdatedHandler) {\r\n      this._unloadMessagesUpdatedHandler();\r\n      this._unloadMessagesUpdatedHandler = undefined;\r\n    }\r\n    // istanbul ignore else\r\n    if (this._removeOpenMessagesCenterHandler) {\r\n      this._removeOpenMessagesCenterHandler();\r\n      this._removeOpenMessagesCenterHandler = undefined;\r\n    }\r\n  }\r\n\r\n  private _handleMessagesUpdatedEvent = () => {\r\n    // istanbul ignore else\r\n    if (this._unloadMessagesUpdatedHandler)\r\n      this.setState({ messageCount: MessageManager.messages.length });\r\n  };\r\n\r\n  private _handleOpenMessageCenterEvent = () => {\r\n    this.setIsOpen(true);\r\n  };\r\n\r\n  public override render(): React.ReactNode {\r\n    const tooltip = `${this.state.messageCount} ${this._title}`;\r\n    const divStyle = { ...this.props.style, height: \"100%\" };\r\n    const footerMessages = (\r\n      <>\r\n        <div\r\n          className={this.props.className}\r\n          style={divStyle}\r\n          title={tooltip}\r\n        >\r\n          <MessageCenter\r\n            indicatorRef={this._indicator}\r\n            label={this._title}\r\n            onClick={this._handleMessageIndicatorClick}\r\n          >\r\n            {this.state.messageCount.toString()}\r\n          </MessageCenter>\r\n        </div>\r\n        <FooterPopup\r\n          isOpen={this.state.isOpen}\r\n          onClose={this._handleClose}\r\n          onOutsideClick={this._handleOutsideClick}\r\n          target={this._indicator.current}\r\n        >\r\n          <MessageCenterDialog\r\n            prompt={UiFramework.translate(\"messageCenter.prompt\")}\r\n            tabs={\r\n              <>\r\n                <MessageCenterTab\r\n                  isActive={this.state.activeTab === MessageCenterActiveTab.AllMessages}\r\n                  onClick={() => this._changeActiveTab(MessageCenterActiveTab.AllMessages)}\r\n                >\r\n                  {UiFramework.translate(\"messageCenter.all\")}\r\n                </MessageCenterTab>\r\n                <MessageCenterTab\r\n                  isActive={this.state.activeTab === MessageCenterActiveTab.Problems}\r\n                  onClick={() => this._changeActiveTab(MessageCenterActiveTab.Problems)}\r\n                >\r\n                  {UiFramework.translate(\"messageCenter.errors\")}\r\n                </MessageCenterTab>\r\n              </>\r\n            }\r\n            title={this._title}\r\n          >\r\n            {this.getMessages()}\r\n          </MessageCenterDialog>\r\n        </FooterPopup>\r\n      </>\r\n    );\r\n\r\n    return footerMessages;\r\n  }\r\n\r\n  private _handleClose = () => {\r\n    this.setIsOpen(false);\r\n  };\r\n\r\n  private _handleOutsideClick = (e: MouseEvent) => {\r\n    if (!this._indicator.current ||\r\n      !(e.target instanceof Node) ||\r\n      this._indicator.current.contains(e.target))\r\n      return;\r\n\r\n    this._handleClose();\r\n  };\r\n\r\n  private _handleMessageIndicatorClick = () => {\r\n    this.setIsOpen(!this.state.isOpen);\r\n  };\r\n\r\n  private _changeActiveTab = (tab: MessageCenterActiveTab) => {\r\n    this.setState({ activeTab: tab });\r\n  };\r\n\r\n  private getMessages(): React.ReactChild[] {\r\n    const messages = MessageManager.messages.slice(0).reverse();\r\n    const tabRows: React.ReactChild[] = new Array<React.ReactChild>();\r\n\r\n    messages.forEach((details: NotifyMessageDetailsType, index: number) => {\r\n      /* istanbul ignore else */\r\n      if (this.state.activeTab === MessageCenterActiveTab.AllMessages || this.isProblemStatus(details.priority)) {\r\n\r\n        const iconClassName = MessageManager.getIconClassName(details);\r\n        const message = details.briefMessage;\r\n\r\n        tabRows.push(\r\n          <MessageCenterMessage\r\n            key={index.toString()}\r\n            icon={<i className={iconClassName} />}\r\n          >\r\n            <MessageSpan message={message} />\r\n            {details.detailedMessage &&\r\n              <>\r\n                <br />\r\n                <MessageSpan className=\"iui-text-small\" message={details.detailedMessage} />\r\n              </>\r\n            }\r\n          </MessageCenterMessage>,\r\n        );\r\n      }\r\n    });\r\n\r\n    return tabRows;\r\n  }\r\n\r\n  private isProblemStatus(priority: OutputMessagePriority): boolean {\r\n    // See priority values in DgnPlatform defined in NotificationManager\r\n\r\n    if (priority === OutputMessagePriority.Error || priority === OutputMessagePriority.Fatal)\r\n      return true;\r\n\r\n    return false;\r\n  }\r\n\r\n  private setIsOpen(isOpen: boolean) {\r\n    this.setState({isOpen});\r\n  }\r\n}\r\n"]}

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

@@ -3,11 +3,11 @@
  */
 /// <reference types="react" />
 import "./SectionsField.scss";
-import { StatusFieldProps } from "./StatusFieldProps";
+import { CommonProps } from "@itwin/core-react";
 /** Sections Status Field Props
  * @beta
  */
-export interface SectionsStatusFieldProps extends StatusFieldProps {
+export interface SectionsStatusFieldProps extends CommonProps {
     hideWhenUnused?: boolean;
 }
 /** Status Field for showing section extra tools for clearing and showing manipulators

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

@@ -1 +1 @@
-{"version":3,"file":"SectionsField.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SectionsField.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,sBAAsB,CAAC;AAS9B,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAGtD;;GAEG;AACH,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB;IAChE,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,eAiFlE"}
+{"version":3,"file":"SectionsField.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SectionsField.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,sBAAsB,CAAC;AAK9B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAMhD;;GAEG;AACH,MAAM,WAAW,wBAAyB,SAAQ,WAAW;IAC3D,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,eAgFlE"}

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

@@ -11,21 +11,21 @@ exports.SectionsStatusField = void 0;
 require("./SectionsField.scss");
 const classnames_1 = require("classnames");
 const React = require("react");
-const core_frontend_1 = require("@itwin/core-frontend");
 const appui_layout_react_1 = require("@itwin/appui-layout-react");
+const core_frontend_1 = require("@itwin/core-frontend");
 const itwinui_react_1 = require("@itwin/itwinui-react");
 const useActiveViewport_1 = require("../hooks/useActiveViewport");
 const UiFramework_1 = require("../UiFramework");
-const Indicator_1 = require("./Indicator");
-const Dialog_1 = require("../statusbar/dialog/Dialog");
+const LabelIndicator_1 = require("../statusbar/LabelIndicator");
 /** Status Field for showing section extra tools for clearing and showing manipulators
  * @beta
  */
 function SectionsStatusField(props) {
-    var _a;
-    const [toolTip] = React.useState(UiFramework_1.UiFramework.translate("tools.sectionTools"));
-    const [clearLabel] = React.useState(UiFramework_1.UiFramework.translate("tools.sectionClear"));
-    const [showHandlesLabel] = React.useState(UiFramework_1.UiFramework.translate("tools.sectionShowHandles"));
+    const [toolTip, clearLabel, showHandlesLabel] = React.useMemo(() => [
+        UiFramework_1.UiFramework.translate("tools.sectionTools"),
+        UiFramework_1.UiFramework.translate("tools.sectionClear"),
+        UiFramework_1.UiFramework.translate("tools.sectionShowHandles")
+    ], []);
     const activeViewport = (0, useActiveViewport_1.useActiveViewport)();
     const [showIndicator, setShowIndicator] = React.useState(false);
     const [isPopupOpen, setPopupOpen] = React.useState(false);
@@ -65,12 +65,9 @@ function SectionsStatusField(props) {
     return (React.createElement("div", { className: "uifw-section-footer-popup-container" }, showIndicator &&
         React.createElement(React.Fragment, null,
             React.createElement("div", { ref: targetDiv, title: toolTip },
-                React.createElement(Indicator_1.Indicator, { className: classes, iconName: "icon-section-tool", onClick: () => setPopupOpen(!isPopupOpen), opened: isPopupOpen, 
-                    // eslint-disable-next-line deprecation/deprecation
-                    isInFooterMode: (_a = props.isInFooterMode) !== null && _a !== void 0 ? _a : true })),
-            React.createElement(appui_layout_react_1.FooterPopup // eslint-disable-line deprecation/deprecation
-            , { target: targetDiv.current, onClose: () => setPopupOpen(false), isOpen: isPopupOpen },
-                React.createElement(Dialog_1.StatusBarDialog, { titleBar: React.createElement(Dialog_1.StatusBarDialog.TitleBar, { title: toolTip }) },
+                React.createElement(LabelIndicator_1.StatusBarLabelIndicator, { className: classes, iconSpec: "icon-section-tool", onClick: () => setPopupOpen(!isPopupOpen) })),
+            React.createElement(appui_layout_react_1.FooterPopup, { target: targetDiv.current, onClose: () => setPopupOpen(false), isOpen: isPopupOpen },
+                React.createElement(appui_layout_react_1.Dialog, { titleBar: React.createElement(appui_layout_react_1.TitleBar, { title: toolTip }) },
                     React.createElement("div", { className: "uifw-sections-footer-contents" },
                         React.createElement(itwinui_react_1.Button, { onClick: handleClear }, clearLabel),
                         React.createElement("div", { className: "uifw-uifw-sections-toggle-container" },

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

@@ -1 +1 @@
-{"version":3,"file":"SectionsField.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SectionsField.tsx"],"names":[],"mappings":"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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 StatusBar\r\n */\r\n\r\nimport \"./SectionsField.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { ClipEventType, IModelApp, ViewClipClearTool, ViewClipDecoration, ViewClipDecorationProvider, Viewport } from \"@itwin/core-frontend\";\r\nimport { FooterPopup } from \"@itwin/appui-layout-react\";\r\nimport { Button, ToggleSwitch } from \"@itwin/itwinui-react\";\r\nimport { useActiveViewport } from \"../hooks/useActiveViewport\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { Indicator } from \"./Indicator\";\r\nimport { StatusFieldProps } from \"./StatusFieldProps\";\r\nimport { StatusBarDialog } from \"../statusbar/dialog/Dialog\";\r\n\r\n/** Sections Status Field Props\r\n * @beta\r\n */\r\nexport interface SectionsStatusFieldProps extends StatusFieldProps {\r\n  hideWhenUnused?: boolean;\r\n}\r\n\r\n/** Status Field for showing section extra tools for clearing and showing manipulators\r\n * @beta\r\n */\r\nexport function SectionsStatusField(props: SectionsStatusFieldProps) {\r\n  const [toolTip] = React.useState(UiFramework.translate(\"tools.sectionTools\"));\r\n  const [clearLabel] = React.useState(UiFramework.translate(\"tools.sectionClear\"));\r\n  const [showHandlesLabel] = React.useState(UiFramework.translate(\"tools.sectionShowHandles\"));\r\n  const activeViewport = useActiveViewport();\r\n  const [showIndicator, setShowIndicator] = React.useState(false);\r\n  const [isPopupOpen, setPopupOpen] = React.useState(false);\r\n  const targetDiv = React.useRef<HTMLDivElement>(null);\r\n  const classes = (showIndicator) ? \"uifw-indicator-fade-in\" : \"uifw-indicator-fade-out\";\r\n  const [hasManipulatorsShown, setHasManipulatorsShown] = React.useState(false);\r\n\r\n  React.useEffect(() => {\r\n    // istanbul ignore next\r\n    const onClipChanged = (viewport: Viewport, _eventType: ClipEventType, _provider: ViewClipDecorationProvider) => {\r\n      if (viewport !== activeViewport)\r\n        return;\r\n\r\n      setHasManipulatorsShown(!!ViewClipDecoration.get(activeViewport));\r\n      const isClipActive = !!activeViewport.view.getViewClip();\r\n      setShowIndicator(isClipActive || !props.hideWhenUnused);\r\n    };\r\n\r\n    const clipActive = !!activeViewport && /* istanbul ignore next */ !!activeViewport.view.getViewClip();\r\n    setShowIndicator(clipActive || !props.hideWhenUnused);\r\n    setHasManipulatorsShown(clipActive && /* istanbul ignore next */ !!activeViewport && /* istanbul ignore next */ !!ViewClipDecoration.get(activeViewport));\r\n\r\n    ViewClipDecorationProvider.create().onActiveClipChanged.addListener(onClipChanged);\r\n    return () => {\r\n      // Get or create static ViewClipDecorationProvider\r\n      ViewClipDecorationProvider.create().onActiveClipChanged.removeListener(onClipChanged);\r\n    };\r\n  }, [activeViewport, props.hideWhenUnused, isPopupOpen]);\r\n\r\n  // istanbul ignore next\r\n  const toggleManipulators = async (e: React.ChangeEvent<HTMLInputElement>) => {\r\n    if (activeViewport) {\r\n      setHasManipulatorsShown(e.target.checked);\r\n      await ViewClipDecorationProvider.create().toggleDecoration(activeViewport);\r\n    }\r\n  };\r\n\r\n  // istanbul ignore next\r\n  const handleClear = async () => {\r\n    await IModelApp.tools.run(ViewClipClearTool.toolId, ViewClipDecorationProvider.create());\r\n    setPopupOpen(false);\r\n  };\r\n\r\n  return (\r\n    <div className=\"uifw-section-footer-popup-container\">\r\n      {showIndicator &&\r\n        <>\r\n          <div ref={targetDiv} title={toolTip}>\r\n            <Indicator className={classes} // eslint-disable-line deprecation/deprecation\r\n              iconName=\"icon-section-tool\"\r\n              onClick={() => setPopupOpen(!isPopupOpen)}\r\n              opened={isPopupOpen}\r\n              // eslint-disable-next-line deprecation/deprecation\r\n              isInFooterMode={props.isInFooterMode ?? true}\r\n            />\r\n          </div>\r\n          <FooterPopup // eslint-disable-line deprecation/deprecation\r\n            target={targetDiv.current}\r\n            onClose={() => setPopupOpen(false)}\r\n            isOpen={isPopupOpen}>\r\n            <StatusBarDialog\r\n              titleBar={\r\n                <StatusBarDialog.TitleBar title={toolTip} />\r\n              }>\r\n              <div className=\"uifw-sections-footer-contents\">\r\n                <Button onClick={handleClear}>{clearLabel}</Button>\r\n                <div className=\"uifw-uifw-sections-toggle-container\">\r\n                  <div className={classnames(\"uifw-sections-label\")}>{showHandlesLabel}</div>\r\n                  <ToggleSwitch className=\"uifw-sections-toggle\" onChange={toggleManipulators} checked={hasManipulatorsShown} />\r\n                </div>\r\n              </div>\r\n            </StatusBarDialog>\r\n          </FooterPopup>\r\n        </>\r\n      }\r\n    </div>\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"SectionsField.js","sourceRoot":"","sources":["../../../../src/appui-react/statusfields/SectionsField.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 StatusBar\r\n */\r\n\r\nimport \"./SectionsField.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { Dialog, FooterPopup, TitleBar } from \"@itwin/appui-layout-react\";\r\nimport { ClipEventType, IModelApp, ViewClipClearTool, ViewClipDecoration, ViewClipDecorationProvider, Viewport } from \"@itwin/core-frontend\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\nimport { Button, ToggleSwitch } from \"@itwin/itwinui-react\";\r\nimport { useActiveViewport } from \"../hooks/useActiveViewport\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { StatusBarLabelIndicator } from \"../statusbar/LabelIndicator\";\r\n\r\n/** Sections Status Field Props\r\n * @beta\r\n */\r\nexport interface SectionsStatusFieldProps extends CommonProps {\r\n  hideWhenUnused?: boolean;\r\n}\r\n\r\n/** Status Field for showing section extra tools for clearing and showing manipulators\r\n * @beta\r\n */\r\nexport function SectionsStatusField(props: SectionsStatusFieldProps) {\r\n  const [toolTip, clearLabel, showHandlesLabel] = React.useMemo(() => [\r\n    UiFramework.translate(\"tools.sectionTools\"),\r\n    UiFramework.translate(\"tools.sectionClear\"),\r\n    UiFramework.translate(\"tools.sectionShowHandles\")], []);\r\n  const activeViewport = useActiveViewport();\r\n  const [showIndicator, setShowIndicator] = React.useState(false);\r\n  const [isPopupOpen, setPopupOpen] = React.useState(false);\r\n  const targetDiv = React.useRef<HTMLDivElement>(null);\r\n  const classes = (showIndicator) ? \"uifw-indicator-fade-in\" : \"uifw-indicator-fade-out\";\r\n  const [hasManipulatorsShown, setHasManipulatorsShown] = React.useState(false);\r\n\r\n  React.useEffect(() => {\r\n    // istanbul ignore next\r\n    const onClipChanged = (viewport: Viewport, _eventType: ClipEventType, _provider: ViewClipDecorationProvider) => {\r\n      if (viewport !== activeViewport)\r\n        return;\r\n\r\n      setHasManipulatorsShown(!!ViewClipDecoration.get(activeViewport));\r\n      const isClipActive = !!activeViewport.view.getViewClip();\r\n      setShowIndicator(isClipActive || !props.hideWhenUnused);\r\n    };\r\n\r\n    const clipActive = !!activeViewport && /* istanbul ignore next */ !!activeViewport.view.getViewClip();\r\n    setShowIndicator(clipActive || !props.hideWhenUnused);\r\n    setHasManipulatorsShown(clipActive && /* istanbul ignore next */ !!activeViewport && /* istanbul ignore next */ !!ViewClipDecoration.get(activeViewport));\r\n\r\n    ViewClipDecorationProvider.create().onActiveClipChanged.addListener(onClipChanged);\r\n    return () => {\r\n      // Get or create static ViewClipDecorationProvider\r\n      ViewClipDecorationProvider.create().onActiveClipChanged.removeListener(onClipChanged);\r\n    };\r\n  }, [activeViewport, props.hideWhenUnused, isPopupOpen]);\r\n\r\n  // istanbul ignore next\r\n  const toggleManipulators = async (e: React.ChangeEvent<HTMLInputElement>) => {\r\n    if (activeViewport) {\r\n      setHasManipulatorsShown(e.target.checked);\r\n      await ViewClipDecorationProvider.create().toggleDecoration(activeViewport);\r\n    }\r\n  };\r\n\r\n  // istanbul ignore next\r\n  const handleClear = async () => {\r\n    await IModelApp.tools.run(ViewClipClearTool.toolId, ViewClipDecorationProvider.create());\r\n    setPopupOpen(false);\r\n  };\r\n\r\n  return (\r\n    <div className=\"uifw-section-footer-popup-container\">\r\n      {showIndicator &&\r\n        <>\r\n          <div ref={targetDiv} title={toolTip}>\r\n            <StatusBarLabelIndicator\r\n              className={classes}\r\n              iconSpec=\"icon-section-tool\"\r\n              onClick={() => setPopupOpen(!isPopupOpen)}\r\n            />\r\n          </div>\r\n          <FooterPopup\r\n            target={targetDiv.current}\r\n            onClose={() => setPopupOpen(false)}\r\n            isOpen={isPopupOpen}>\r\n            <Dialog\r\n              titleBar={\r\n                <TitleBar title={toolTip} />\r\n              }>\r\n              <div className=\"uifw-sections-footer-contents\">\r\n                <Button onClick={handleClear}>{clearLabel}</Button>\r\n                <div className=\"uifw-uifw-sections-toggle-container\">\r\n                  <div className={classnames(\"uifw-sections-label\")}>{showHandlesLabel}</div>\r\n                  <ToggleSwitch className=\"uifw-sections-toggle\" onChange={toggleManipulators} checked={hasManipulatorsShown} />\r\n                </div>\r\n              </div>\r\n            </Dialog>\r\n          </FooterPopup>\r\n        </>\r\n      }\r\n    </div>\r\n  );\r\n}\r\n"]}