@itwin/appui-react 3.6.0-dev.36 → 3.6.0-dev.38

package/lib/esm/appui-react/messages/ReactNotifyMessageDetails.js

@@ -1,64 +1,64 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Notification
- */
-import { NotifyMessageDetails, OutputMessageAlert, OutputMessageType } from "@itwin/core-frontend";
-import { RelativePosition } from "@itwin/appui-abstract";
-/** Describes a message to be displayed to the user and adds support for React components in messages.
- * @public
- */
-export class ReactNotifyMessageDetails {
-    /** Constructor
-     *  @param priority           The priority this message should be accorded by the NotificationManager.
-     *  @param briefMessage       A short message that conveys the simplest explanation of the issue.
-     *  @param detailedMessage    A comprehensive message that explains the issue in detail and potentially offers a solution.
-     *  @param msgType            The type of message.
-     *  @param openAlert          Whether an alert box should be displayed or not, and if so what kind.
-     */
-    constructor(priority, briefMessage, detailedMessage, msgType = OutputMessageType.Toast, openAlert = OutputMessageAlert.None) {
-        this.priority = priority;
-        this.briefMessage = briefMessage;
-        this.detailedMessage = detailedMessage;
-        this.msgType = msgType;
-        this.openAlert = openAlert;
-        /** Create an internal NotifyMessageDetails */
-        this._notifyMessageDetails = new NotifyMessageDetails(priority, "", undefined, msgType, openAlert);
-    }
-    /** @internal */
-    get messageDetails() { return this._notifyMessageDetails; }
-    /** Amount of time a Toast message is displayed */
-    get displayTime() { return this._notifyMessageDetails.displayTime; }
-    set displayTime(duration) { this._notifyMessageDetails.displayTime = duration; }
-    /** Anchor viewport for a Pointer message */
-    get viewport() { return this._notifyMessageDetails.viewport; }
-    /** Point for a Pointer message */
-    get displayPoint() { return this._notifyMessageDetails.displayPoint; }
-    /** Relative position for a Pointer message */
-    get relativePosition() { return this._notifyMessageDetails.relativePosition; }
-    /** Anchor input field for an Input Field message */
-    get inputField() { return this._notifyMessageDetails.inputField; }
-    /** Set OutputMessageType.Pointer message details.
-     * @param viewport            Viewport over which to display the Pointer type message.
-     * @param displayPoint        Point at which to display the Pointer type message.
-     * @param relativePosition    Position relative to displayPoint at which to display the Pointer type message.
-     */
-    setPointerTypeDetails(viewport, displayPoint, relativePosition = RelativePosition.TopRight) {
-        this._notifyMessageDetails.setPointerTypeDetails(viewport, displayPoint, relativePosition);
-    }
-    /** Set OutputMessageType.InputField message details.
-     * @param inputField          Input field that message pertains. The message will be shown just below this input field element.
-     */
-    setInputFieldTypeDetails(inputField) {
-        this._notifyMessageDetails.setInputFieldTypeDetails(inputField);
-    }
-}
-/** ReactNotifyMessageDetails type guard.
- * @internal
- */
-export const isReactNotifyMessageDetails = (details) => {
-    return details.messageDetails !== undefined;
-};
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Notification
+ */
+import { NotifyMessageDetails, OutputMessageAlert, OutputMessageType } from "@itwin/core-frontend";
+import { RelativePosition } from "@itwin/appui-abstract";
+/** Describes a message to be displayed to the user and adds support for React components in messages.
+ * @public
+ */
+export class ReactNotifyMessageDetails {
+    /** Constructor
+     *  @param priority           The priority this message should be accorded by the NotificationManager.
+     *  @param briefMessage       A short message that conveys the simplest explanation of the issue.
+     *  @param detailedMessage    A comprehensive message that explains the issue in detail and potentially offers a solution.
+     *  @param msgType            The type of message.
+     *  @param openAlert          Whether an alert box should be displayed or not, and if so what kind.
+     */
+    constructor(priority, briefMessage, detailedMessage, msgType = OutputMessageType.Toast, openAlert = OutputMessageAlert.None) {
+        this.priority = priority;
+        this.briefMessage = briefMessage;
+        this.detailedMessage = detailedMessage;
+        this.msgType = msgType;
+        this.openAlert = openAlert;
+        /** Create an internal NotifyMessageDetails */
+        this._notifyMessageDetails = new NotifyMessageDetails(priority, "", undefined, msgType, openAlert);
+    }
+    /** @internal */
+    get messageDetails() { return this._notifyMessageDetails; }
+    /** Amount of time a Toast message is displayed */
+    get displayTime() { return this._notifyMessageDetails.displayTime; }
+    set displayTime(duration) { this._notifyMessageDetails.displayTime = duration; }
+    /** Anchor viewport for a Pointer message */
+    get viewport() { return this._notifyMessageDetails.viewport; }
+    /** Point for a Pointer message */
+    get displayPoint() { return this._notifyMessageDetails.displayPoint; }
+    /** Relative position for a Pointer message */
+    get relativePosition() { return this._notifyMessageDetails.relativePosition; }
+    /** Anchor input field for an Input Field message */
+    get inputField() { return this._notifyMessageDetails.inputField; }
+    /** Set OutputMessageType.Pointer message details.
+     * @param viewport            Viewport over which to display the Pointer type message.
+     * @param displayPoint        Point at which to display the Pointer type message.
+     * @param relativePosition    Position relative to displayPoint at which to display the Pointer type message.
+     */
+    setPointerTypeDetails(viewport, displayPoint, relativePosition = RelativePosition.TopRight) {
+        this._notifyMessageDetails.setPointerTypeDetails(viewport, displayPoint, relativePosition);
+    }
+    /** Set OutputMessageType.InputField message details.
+     * @param inputField          Input field that message pertains. The message will be shown just below this input field element.
+     */
+    setInputFieldTypeDetails(inputField) {
+        this._notifyMessageDetails.setInputFieldTypeDetails(inputField);
+    }
+}
+/** ReactNotifyMessageDetails type guard.
+ * @internal
+ */
+export const isReactNotifyMessageDetails = (details) => {
+    return details.messageDetails !== undefined;
+};
 //# sourceMappingURL=ReactNotifyMessageDetails.js.map

package/lib/esm/appui-react/messages/ReactNotifyMessageDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReactNotifyMessageDetails.js","sourceRoot":"","sources":["../../../../src/appui-react/messages/ReactNotifyMessageDetails.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAIH,OAAO,EAAE,oBAAoB,EAAE,kBAAkB,EAAyB,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAC1H,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAazD;;GAEG;AACH,MAAM,OAAO,yBAAyB;IAmBpC;;;;;;OAMG;IACH,YACS,QAA+B,EAC/B,YAA+B,EAC/B,eAAmC,EACnC,UAAU,iBAAiB,CAAC,KAAK,EACjC,YAAY,kBAAkB,CAAC,IAAI;QAJnC,aAAQ,GAAR,QAAQ,CAAuB;QAC/B,iBAAY,GAAZ,YAAY,CAAmB;QAC/B,oBAAe,GAAf,eAAe,CAAoB;QACnC,YAAO,GAAP,OAAO,CAA0B;QACjC,cAAS,GAAT,SAAS,CAA0B;QAC1C,8CAA8C;QAC9C,IAAI,CAAC,qBAAqB,GAAG,IAAI,oBAAoB,CAAC,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC;IACrG,CAAC;IA/BD,gBAAgB;IAChB,IAAW,cAAc,KAA2B,OAAO,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC;IAExF,kDAAkD;IAClD,IAAW,WAAW,KAAiB,OAAO,IAAI,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC;IACvF,IAAW,WAAW,CAAC,QAAoB,IAAI,IAAI,CAAC,qBAAqB,CAAC,WAAW,GAAG,QAAQ,CAAC,CAAC,CAAC;IAEnG,4CAA4C;IAC5C,IAAW,QAAQ,KAA8B,OAAO,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,CAAC,CAAC;IAC9F,kCAAkC;IAClC,IAAW,YAAY,KAA0B,OAAO,IAAI,CAAC,qBAAqB,CAAC,YAAY,CAAC,CAAC,CAAC;IAClG,8CAA8C;IAC9C,IAAW,gBAAgB,KAAuB,OAAO,IAAI,CAAC,qBAAqB,CAAC,gBAAgB,CAAC,CAAC,CAAC;IACvG,oDAAoD;IACpD,IAAW,UAAU,KAA8B,OAAO,IAAI,CAAC,qBAAqB,CAAC,UAAU,CAAC,CAAC,CAAC;IAmBlG;;;;OAIG;IACI,qBAAqB,CAAC,QAAqB,EAAE,YAAmB,EAAE,gBAAgB,GAAG,gBAAgB,CAAC,QAAQ;QACnH,IAAI,CAAC,qBAAqB,CAAC,qBAAqB,CAAC,QAAQ,EAAE,YAAY,EAAE,gBAAgB,CAAC,CAAC;IAC7F,CAAC;IAED;;OAEG;IACI,wBAAwB,CAAC,UAAuB;QACrD,IAAI,CAAC,qBAAqB,CAAC,wBAAwB,CAAC,UAAU,CAAC,CAAC;IAClE,CAAC;CACF;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,OAAY,EAAwC,EAAE;IAChG,OAAQ,OAAqC,CAAC,cAAc,KAAK,SAAS,CAAC;AAC7E,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Notification\n */\n\nimport { BeDuration } from \"@itwin/core-bentley\";\nimport { Point2d, XAndY } from \"@itwin/core-geometry\";\nimport { NotifyMessageDetails, OutputMessageAlert, OutputMessagePriority, OutputMessageType } from \"@itwin/core-frontend\";\nimport { RelativePosition } from \"@itwin/appui-abstract\";\nimport { MessageType } from \"@itwin/core-react\";\n\n/** Types for message in [[MessageManager]]\n * @public\n */\nexport type NotifyMessageType = MessageType;\n\n/** Types for NotifyMessageDetails.\n * @public\n */\nexport type NotifyMessageDetailsType = NotifyMessageDetails | ReactNotifyMessageDetails;\n\n/** Describes a message to be displayed to the user and adds support for React components in messages.\n * @public\n */\nexport class ReactNotifyMessageDetails {\n  private _notifyMessageDetails: NotifyMessageDetails;\n\n  /** @internal */\n  public get messageDetails(): NotifyMessageDetails { return this._notifyMessageDetails; }\n\n  /** Amount of time a Toast message is displayed */\n  public get displayTime(): BeDuration { return this._notifyMessageDetails.displayTime; }\n  public set displayTime(duration: BeDuration) { this._notifyMessageDetails.displayTime = duration; }\n\n  /** Anchor viewport for a Pointer message */\n  public get viewport(): HTMLElement | undefined { return this._notifyMessageDetails.viewport; }\n  /** Point for a Pointer message */\n  public get displayPoint(): Point2d | undefined { return this._notifyMessageDetails.displayPoint; }\n  /** Relative position for a Pointer message */\n  public get relativePosition(): RelativePosition { return this._notifyMessageDetails.relativePosition; }\n  /** Anchor input field for an Input Field message */\n  public get inputField(): HTMLElement | undefined { return this._notifyMessageDetails.inputField; }\n\n  /** Constructor\n   *  @param priority           The priority this message should be accorded by the NotificationManager.\n   *  @param briefMessage       A short message that conveys the simplest explanation of the issue.\n   *  @param detailedMessage    A comprehensive message that explains the issue in detail and potentially offers a solution.\n   *  @param msgType            The type of message.\n   *  @param openAlert          Whether an alert box should be displayed or not, and if so what kind.\n   */\n  public constructor(\n    public priority: OutputMessagePriority,\n    public briefMessage: NotifyMessageType,\n    public detailedMessage?: NotifyMessageType,\n    public msgType = OutputMessageType.Toast,\n    public openAlert = OutputMessageAlert.None) {\n    /** Create an internal NotifyMessageDetails */\n    this._notifyMessageDetails = new NotifyMessageDetails(priority, \"\", undefined, msgType, openAlert);\n  }\n\n  /** Set OutputMessageType.Pointer message details.\n   * @param viewport            Viewport over which to display the Pointer type message.\n   * @param displayPoint        Point at which to display the Pointer type message.\n   * @param relativePosition    Position relative to displayPoint at which to display the Pointer type message.\n   */\n  public setPointerTypeDetails(viewport: HTMLElement, displayPoint: XAndY, relativePosition = RelativePosition.TopRight) {\n    this._notifyMessageDetails.setPointerTypeDetails(viewport, displayPoint, relativePosition);\n  }\n\n  /** Set OutputMessageType.InputField message details.\n   * @param inputField          Input field that message pertains. The message will be shown just below this input field element.\n   */\n  public setInputFieldTypeDetails(inputField: HTMLElement) {\n    this._notifyMessageDetails.setInputFieldTypeDetails(inputField);\n  }\n}\n\n/** ReactNotifyMessageDetails type guard.\n * @internal\n */\nexport const isReactNotifyMessageDetails = (details: any): details is ReactNotifyMessageDetails => {\n  return (details as ReactNotifyMessageDetails).messageDetails !== undefined;\n};\n"]}
+{"version":3,"file":"ReactNotifyMessageDetails.js","sourceRoot":"","sources":["../../../../src/appui-react/messages/ReactNotifyMessageDetails.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAIH,OAAO,EAAE,oBAAoB,EAAE,kBAAkB,EAAyB,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAC1H,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAazD;;GAEG;AACH,MAAM,OAAO,yBAAyB;IAmBpC;;;;;;OAMG;IACH,YACS,QAA+B,EAC/B,YAA+B,EAC/B,eAAmC,EACnC,UAAU,iBAAiB,CAAC,KAAK,EACjC,YAAY,kBAAkB,CAAC,IAAI;QAJnC,aAAQ,GAAR,QAAQ,CAAuB;QAC/B,iBAAY,GAAZ,YAAY,CAAmB;QAC/B,oBAAe,GAAf,eAAe,CAAoB;QACnC,YAAO,GAAP,OAAO,CAA0B;QACjC,cAAS,GAAT,SAAS,CAA0B;QAC1C,8CAA8C;QAC9C,IAAI,CAAC,qBAAqB,GAAG,IAAI,oBAAoB,CAAC,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC;IACrG,CAAC;IA/BD,gBAAgB;IAChB,IAAW,cAAc,KAA2B,OAAO,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC;IAExF,kDAAkD;IAClD,IAAW,WAAW,KAAiB,OAAO,IAAI,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC;IACvF,IAAW,WAAW,CAAC,QAAoB,IAAI,IAAI,CAAC,qBAAqB,CAAC,WAAW,GAAG,QAAQ,CAAC,CAAC,CAAC;IAEnG,4CAA4C;IAC5C,IAAW,QAAQ,KAA8B,OAAO,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,CAAC,CAAC;IAC9F,kCAAkC;IAClC,IAAW,YAAY,KAA0B,OAAO,IAAI,CAAC,qBAAqB,CAAC,YAAY,CAAC,CAAC,CAAC;IAClG,8CAA8C;IAC9C,IAAW,gBAAgB,KAAuB,OAAO,IAAI,CAAC,qBAAqB,CAAC,gBAAgB,CAAC,CAAC,CAAC;IACvG,oDAAoD;IACpD,IAAW,UAAU,KAA8B,OAAO,IAAI,CAAC,qBAAqB,CAAC,UAAU,CAAC,CAAC,CAAC;IAmBlG;;;;OAIG;IACI,qBAAqB,CAAC,QAAqB,EAAE,YAAmB,EAAE,gBAAgB,GAAG,gBAAgB,CAAC,QAAQ;QACnH,IAAI,CAAC,qBAAqB,CAAC,qBAAqB,CAAC,QAAQ,EAAE,YAAY,EAAE,gBAAgB,CAAC,CAAC;IAC7F,CAAC;IAED;;OAEG;IACI,wBAAwB,CAAC,UAAuB;QACrD,IAAI,CAAC,qBAAqB,CAAC,wBAAwB,CAAC,UAAU,CAAC,CAAC;IAClE,CAAC;CACF;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,OAAY,EAAwC,EAAE;IAChG,OAAQ,OAAqC,CAAC,cAAc,KAAK,SAAS,CAAC;AAC7E,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 Notification\r\n */\r\n\r\nimport { BeDuration } from \"@itwin/core-bentley\";\r\nimport { Point2d, XAndY } from \"@itwin/core-geometry\";\r\nimport { NotifyMessageDetails, OutputMessageAlert, OutputMessagePriority, OutputMessageType } from \"@itwin/core-frontend\";\r\nimport { RelativePosition } from \"@itwin/appui-abstract\";\r\nimport { MessageType } from \"@itwin/core-react\";\r\n\r\n/** Types for message in [[MessageManager]]\r\n * @public\r\n */\r\nexport type NotifyMessageType = MessageType;\r\n\r\n/** Types for NotifyMessageDetails.\r\n * @public\r\n */\r\nexport type NotifyMessageDetailsType = NotifyMessageDetails | ReactNotifyMessageDetails;\r\n\r\n/** Describes a message to be displayed to the user and adds support for React components in messages.\r\n * @public\r\n */\r\nexport class ReactNotifyMessageDetails {\r\n  private _notifyMessageDetails: NotifyMessageDetails;\r\n\r\n  /** @internal */\r\n  public get messageDetails(): NotifyMessageDetails { return this._notifyMessageDetails; }\r\n\r\n  /** Amount of time a Toast message is displayed */\r\n  public get displayTime(): BeDuration { return this._notifyMessageDetails.displayTime; }\r\n  public set displayTime(duration: BeDuration) { this._notifyMessageDetails.displayTime = duration; }\r\n\r\n  /** Anchor viewport for a Pointer message */\r\n  public get viewport(): HTMLElement | undefined { return this._notifyMessageDetails.viewport; }\r\n  /** Point for a Pointer message */\r\n  public get displayPoint(): Point2d | undefined { return this._notifyMessageDetails.displayPoint; }\r\n  /** Relative position for a Pointer message */\r\n  public get relativePosition(): RelativePosition { return this._notifyMessageDetails.relativePosition; }\r\n  /** Anchor input field for an Input Field message */\r\n  public get inputField(): HTMLElement | undefined { return this._notifyMessageDetails.inputField; }\r\n\r\n  /** Constructor\r\n   *  @param priority           The priority this message should be accorded by the NotificationManager.\r\n   *  @param briefMessage       A short message that conveys the simplest explanation of the issue.\r\n   *  @param detailedMessage    A comprehensive message that explains the issue in detail and potentially offers a solution.\r\n   *  @param msgType            The type of message.\r\n   *  @param openAlert          Whether an alert box should be displayed or not, and if so what kind.\r\n   */\r\n  public constructor(\r\n    public priority: OutputMessagePriority,\r\n    public briefMessage: NotifyMessageType,\r\n    public detailedMessage?: NotifyMessageType,\r\n    public msgType = OutputMessageType.Toast,\r\n    public openAlert = OutputMessageAlert.None) {\r\n    /** Create an internal NotifyMessageDetails */\r\n    this._notifyMessageDetails = new NotifyMessageDetails(priority, \"\", undefined, msgType, openAlert);\r\n  }\r\n\r\n  /** Set OutputMessageType.Pointer message details.\r\n   * @param viewport            Viewport over which to display the Pointer type message.\r\n   * @param displayPoint        Point at which to display the Pointer type message.\r\n   * @param relativePosition    Position relative to displayPoint at which to display the Pointer type message.\r\n   */\r\n  public setPointerTypeDetails(viewport: HTMLElement, displayPoint: XAndY, relativePosition = RelativePosition.TopRight) {\r\n    this._notifyMessageDetails.setPointerTypeDetails(viewport, displayPoint, relativePosition);\r\n  }\r\n\r\n  /** Set OutputMessageType.InputField message details.\r\n   * @param inputField          Input field that message pertains. The message will be shown just below this input field element.\r\n   */\r\n  public setInputFieldTypeDetails(inputField: HTMLElement) {\r\n    this._notifyMessageDetails.setInputFieldTypeDetails(inputField);\r\n  }\r\n}\r\n\r\n/** ReactNotifyMessageDetails type guard.\r\n * @internal\r\n */\r\nexport const isReactNotifyMessageDetails = (details: any): details is ReactNotifyMessageDetails => {\r\n  return (details as ReactNotifyMessageDetails).messageDetails !== undefined;\r\n};\r\n"]}

package/lib/esm/appui-react/messages/StatusMessageManager.d.ts

@@ -1,25 +1,25 @@
-/** @packageDocumentation
- * @module Notification
- */
-import { NotifyMessageDetailsType } from "./ReactNotifyMessageDetails";
-import { MessageSeverity } from "@itwin/appui-abstract";
-/** Interface for Status Message
- * @internal
- */
-export interface StatusMessage {
-    id: string;
-    messageDetails: NotifyMessageDetailsType;
-    severity: MessageSeverity;
-}
-/** Manager for Status messages
- * @internal
- */
-export declare class StatusMessageManager {
-    private _messages;
-    private _messageId;
-    initialize(): void;
-    get messages(): readonly StatusMessage[];
-    add(messageDetails: NotifyMessageDetailsType): void;
-    remove(id: string): boolean;
-}
+/** @packageDocumentation
+ * @module Notification
+ */
+import { NotifyMessageDetailsType } from "./ReactNotifyMessageDetails";
+import { MessageSeverity } from "@itwin/appui-abstract";
+/** Interface for Status Message
+ * @internal
+ */
+export interface StatusMessage {
+    id: string;
+    messageDetails: NotifyMessageDetailsType;
+    severity: MessageSeverity;
+}
+/** Manager for Status messages
+ * @internal
+ */
+export declare class StatusMessageManager {
+    private _messages;
+    private _messageId;
+    initialize(): void;
+    get messages(): readonly StatusMessage[];
+    add(messageDetails: NotifyMessageDetailsType): void;
+    remove(id: string): boolean;
+}
 //# sourceMappingURL=StatusMessageManager.d.ts.map

package/lib/esm/appui-react/messages/StatusMessageManager.js

@@ -1,52 +1,52 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Notification
- */
-import { MessageManager } from "./MessageManager";
-import { OutputMessageType } from "@itwin/core-frontend";
-/** Manager for Status messages
- * @internal
- */
-export class StatusMessageManager {
-    constructor() {
-        this._messages = [];
-        this._messageId = 0;
-    }
-    initialize() {
-        this._messages = [];
-        this._messageId = 0;
-    }
-    get messages() { return this._messages; }
-    add(messageDetails) {
-        const id = this._messageId.toString();
-        const severity = MessageManager.getSeverity(messageDetails);
-        const messages = this._messages.slice();
-        messages.splice(0, 0, { id, messageDetails, severity }); // Insert at beginning
-        this._messages = messages;
-        this._messageId++;
-        /** Remove Sticky messages beyond the max displayed */
-        const stickyMessages = this._messages.filter((message) => message.messageDetails.msgType === OutputMessageType.Sticky);
-        if (stickyMessages.length > MessageManager.maxDisplayedStickyMessages) {
-            const removeMessages = stickyMessages.slice(MessageManager.maxDisplayedStickyMessages);
-            for (const removeMessage of removeMessages) {
-                this.remove(removeMessage.id);
-            }
-        }
-    }
-    remove(id) {
-        let result = false;
-        const foundIndex = this._messages.findIndex((message) => message.id === id);
-        // istanbul ignore else
-        if (foundIndex >= 0) {
-            const messages = this._messages.slice();
-            messages.splice(foundIndex, 1);
-            this._messages = messages;
-            result = true;
-        }
-        return result;
-    }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Notification
+ */
+import { MessageManager } from "./MessageManager";
+import { OutputMessageType } from "@itwin/core-frontend";
+/** Manager for Status messages
+ * @internal
+ */
+export class StatusMessageManager {
+    constructor() {
+        this._messages = [];
+        this._messageId = 0;
+    }
+    initialize() {
+        this._messages = [];
+        this._messageId = 0;
+    }
+    get messages() { return this._messages; }
+    add(messageDetails) {
+        const id = this._messageId.toString();
+        const severity = MessageManager.getSeverity(messageDetails);
+        const messages = this._messages.slice();
+        messages.splice(0, 0, { id, messageDetails, severity }); // Insert at beginning
+        this._messages = messages;
+        this._messageId++;
+        /** Remove Sticky messages beyond the max displayed */
+        const stickyMessages = this._messages.filter((message) => message.messageDetails.msgType === OutputMessageType.Sticky);
+        if (stickyMessages.length > MessageManager.maxDisplayedStickyMessages) {
+            const removeMessages = stickyMessages.slice(MessageManager.maxDisplayedStickyMessages);
+            for (const removeMessage of removeMessages) {
+                this.remove(removeMessage.id);
+            }
+        }
+    }
+    remove(id) {
+        let result = false;
+        const foundIndex = this._messages.findIndex((message) => message.id === id);
+        // istanbul ignore else
+        if (foundIndex >= 0) {
+            const messages = this._messages.slice();
+            messages.splice(foundIndex, 1);
+            this._messages = messages;
+            result = true;
+        }
+        return result;
+    }
+}
 //# sourceMappingURL=StatusMessageManager.js.map

package/lib/esm/appui-react/messages/StatusMessageManager.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusMessageManager.js","sourceRoot":"","sources":["../../../../src/appui-react/messages/StatusMessageManager.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAIH,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAWzD;;GAEG;AACH,MAAM,OAAO,oBAAoB;IAAjC;QACU,cAAS,GAAiC,EAAE,CAAC;QAC7C,eAAU,GAAW,CAAC,CAAC;IA2CjC,CAAC;IAzCQ,UAAU;QACf,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;QACpB,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC;IACtB,CAAC;IAED,IAAW,QAAQ,KAAK,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;IAEzC,GAAG,CAAC,cAAwC;QACjD,MAAM,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,CAAC;QACtC,MAAM,QAAQ,GAAG,cAAc,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;QAE5D,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;QACxC,QAAQ,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAE,sBAAsB;QAChF,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;QAE1B,IAAI,CAAC,UAAU,EAAE,CAAC;QAElB,sDAAsD;QACtD,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,cAAc,CAAC,OAAO,KAAK,iBAAiB,CAAC,MAAM,CAAC,CAAC;QACvH,IAAI,cAAc,CAAC,MAAM,GAAG,cAAc,CAAC,0BAA0B,EAAE;YACrE,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,cAAc,CAAC,0BAA0B,CAAC,CAAC;YACvF,KAAK,MAAM,aAAa,IAAI,cAAc,EAAE;gBAC1C,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;aAC/B;SACF;IACH,CAAC;IAEM,MAAM,CAAC,EAAU;QACtB,IAAI,MAAM,GAAG,KAAK,CAAC;QACnB,MAAM,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,OAAsB,EAAE,EAAE,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;QAE3F,uBAAuB;QACvB,IAAI,UAAU,IAAI,CAAC,EAAE;YACnB,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;YACxC,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;YAC/B,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;YAC1B,MAAM,GAAG,IAAI,CAAC;SACf;QAED,OAAO,MAAM,CAAC;IAChB,CAAC;CACF","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Notification\n */\n\nimport { NotifyMessageDetailsType } from \"./ReactNotifyMessageDetails\";\nimport { MessageSeverity } from \"@itwin/appui-abstract\";\nimport { MessageManager } from \"./MessageManager\";\nimport { OutputMessageType } from \"@itwin/core-frontend\";\n\n/** Interface for Status Message\n * @internal\n */\nexport interface StatusMessage {\n  id: string;\n  messageDetails: NotifyMessageDetailsType;\n  severity: MessageSeverity;\n}\n\n/** Manager for Status messages\n * @internal\n */\nexport class StatusMessageManager {\n  private _messages: ReadonlyArray<StatusMessage> = [];\n  private _messageId: number = 0;\n\n  public initialize() {\n    this._messages = [];\n    this._messageId = 0;\n  }\n\n  public get messages() { return this._messages; }\n\n  public add(messageDetails: NotifyMessageDetailsType): void {\n    const id = this._messageId.toString();\n    const severity = MessageManager.getSeverity(messageDetails);\n\n    const messages = this._messages.slice();\n    messages.splice(0, 0, { id, messageDetails, severity });  // Insert at beginning\n    this._messages = messages;\n\n    this._messageId++;\n\n    /** Remove Sticky messages beyond the max displayed */\n    const stickyMessages = this._messages.filter((message) => message.messageDetails.msgType === OutputMessageType.Sticky);\n    if (stickyMessages.length > MessageManager.maxDisplayedStickyMessages) {\n      const removeMessages = stickyMessages.slice(MessageManager.maxDisplayedStickyMessages);\n      for (const removeMessage of removeMessages) {\n        this.remove(removeMessage.id);\n      }\n    }\n  }\n\n  public remove(id: string): boolean {\n    let result = false;\n    const foundIndex = this._messages.findIndex((message: StatusMessage) => message.id === id);\n\n    // istanbul ignore else\n    if (foundIndex >= 0) {\n      const messages = this._messages.slice();\n      messages.splice(foundIndex, 1);\n      this._messages = messages;\n      result = true;\n    }\n\n    return result;\n  }\n}\n"]}
+{"version":3,"file":"StatusMessageManager.js","sourceRoot":"","sources":["../../../../src/appui-react/messages/StatusMessageManager.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAIH,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAWzD;;GAEG;AACH,MAAM,OAAO,oBAAoB;IAAjC;QACU,cAAS,GAAiC,EAAE,CAAC;QAC7C,eAAU,GAAW,CAAC,CAAC;IA2CjC,CAAC;IAzCQ,UAAU;QACf,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;QACpB,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC;IACtB,CAAC;IAED,IAAW,QAAQ,KAAK,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;IAEzC,GAAG,CAAC,cAAwC;QACjD,MAAM,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,CAAC;QACtC,MAAM,QAAQ,GAAG,cAAc,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;QAE5D,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;QACxC,QAAQ,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAE,sBAAsB;QAChF,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;QAE1B,IAAI,CAAC,UAAU,EAAE,CAAC;QAElB,sDAAsD;QACtD,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,cAAc,CAAC,OAAO,KAAK,iBAAiB,CAAC,MAAM,CAAC,CAAC;QACvH,IAAI,cAAc,CAAC,MAAM,GAAG,cAAc,CAAC,0BAA0B,EAAE;YACrE,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,cAAc,CAAC,0BAA0B,CAAC,CAAC;YACvF,KAAK,MAAM,aAAa,IAAI,cAAc,EAAE;gBAC1C,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;aAC/B;SACF;IACH,CAAC;IAEM,MAAM,CAAC,EAAU;QACtB,IAAI,MAAM,GAAG,KAAK,CAAC;QACnB,MAAM,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,OAAsB,EAAE,EAAE,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;QAE3F,uBAAuB;QACvB,IAAI,UAAU,IAAI,CAAC,EAAE;YACnB,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;YACxC,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;YAC/B,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;YAC1B,MAAM,GAAG,IAAI,CAAC;SACf;QAED,OAAO,MAAM,CAAC;IAChB,CAAC;CACF","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 { NotifyMessageDetailsType } from \"./ReactNotifyMessageDetails\";\r\nimport { MessageSeverity } from \"@itwin/appui-abstract\";\r\nimport { MessageManager } from \"./MessageManager\";\r\nimport { OutputMessageType } from \"@itwin/core-frontend\";\r\n\r\n/** Interface for Status Message\r\n * @internal\r\n */\r\nexport interface StatusMessage {\r\n  id: string;\r\n  messageDetails: NotifyMessageDetailsType;\r\n  severity: MessageSeverity;\r\n}\r\n\r\n/** Manager for Status messages\r\n * @internal\r\n */\r\nexport class StatusMessageManager {\r\n  private _messages: ReadonlyArray<StatusMessage> = [];\r\n  private _messageId: number = 0;\r\n\r\n  public initialize() {\r\n    this._messages = [];\r\n    this._messageId = 0;\r\n  }\r\n\r\n  public get messages() { return this._messages; }\r\n\r\n  public add(messageDetails: NotifyMessageDetailsType): void {\r\n    const id = this._messageId.toString();\r\n    const severity = MessageManager.getSeverity(messageDetails);\r\n\r\n    const messages = this._messages.slice();\r\n    messages.splice(0, 0, { id, messageDetails, severity });  // Insert at beginning\r\n    this._messages = messages;\r\n\r\n    this._messageId++;\r\n\r\n    /** Remove Sticky messages beyond the max displayed */\r\n    const stickyMessages = this._messages.filter((message) => message.messageDetails.msgType === OutputMessageType.Sticky);\r\n    if (stickyMessages.length > MessageManager.maxDisplayedStickyMessages) {\r\n      const removeMessages = stickyMessages.slice(MessageManager.maxDisplayedStickyMessages);\r\n      for (const removeMessage of removeMessages) {\r\n        this.remove(removeMessage.id);\r\n      }\r\n    }\r\n  }\r\n\r\n  public remove(id: string): boolean {\r\n    let result = false;\r\n    const foundIndex = this._messages.findIndex((message: StatusMessage) => message.id === id);\r\n\r\n    // istanbul ignore else\r\n    if (foundIndex >= 0) {\r\n      const messages = this._messages.slice();\r\n      messages.splice(foundIndex, 1);\r\n      this._messages = messages;\r\n      result = true;\r\n    }\r\n\r\n    return result;\r\n  }\r\n}\r\n"]}

package/lib/esm/appui-react/messages/StatusMessageRenderer.d.ts

@@ -1,22 +1,22 @@
-/** @packageDocumentation
- * @module Notification
- */
-/// <reference types="react" />
-import "./StatusMessageRenderer.scss";
-import { CommonProps } from "@itwin/core-react";
-/** Properties for [[StatusMessageRenderer]] component
- * @deprecated Props of a deprecated component.
- * @public
- */
-export interface StatusMessageRendererProps extends CommonProps {
-    closeMessage?: (id: string) => void;
-    cancelActivityMessage?: () => void;
-    dismissActivityMessage?: () => void;
-}
-/** Message Popup React component that renders one or more Toast or Sticky messages and an Activity message without a StatusBar.
- * @note This component was formerly named MessageRenderer in previous releases.
- * @public
- * @deprecated Use `toaster` from iTwinui-react to display status messages.
- */
-export declare function StatusMessageRenderer({ closeMessage, cancelActivityMessage: cancelActivityMessageProp, dismissActivityMessage, }: StatusMessageRendererProps): JSX.Element;
+/** @packageDocumentation
+ * @module Notification
+ */
+/// <reference types="react" />
+import "./StatusMessageRenderer.scss";
+import { CommonProps } from "@itwin/core-react";
+/** Properties for [[StatusMessageRenderer]] component
+ * @deprecated Props of a deprecated component.
+ * @public
+ */
+export interface StatusMessageRendererProps extends CommonProps {
+    closeMessage?: (id: string) => void;
+    cancelActivityMessage?: () => void;
+    dismissActivityMessage?: () => void;
+}
+/** Message Popup React component that renders one or more Toast or Sticky messages and an Activity message without a StatusBar.
+ * @note This component was formerly named MessageRenderer in previous releases.
+ * @public
+ * @deprecated Use `toaster` from iTwinui-react to display status messages.
+ */
+export declare function StatusMessageRenderer({ closeMessage, cancelActivityMessage: cancelActivityMessageProp, dismissActivityMessage, }: StatusMessageRendererProps): JSX.Element;
 //# sourceMappingURL=StatusMessageRenderer.d.ts.map

package/lib/esm/appui-react/messages/StatusMessageRenderer.js

@@ -1,72 +1,72 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Notification
- */
-import "./StatusMessageRenderer.scss";
-import * as React from "react";
-import { MessageManager } from "./MessageManager";
-import { useActivityMessage } from "./ActivityMessage";
-/** Message Popup React component that renders one or more Toast or Sticky messages and an Activity message without a StatusBar.
- * @note This component was formerly named MessageRenderer in previous releases.
- * @public
- * @deprecated Use `toaster` from iTwinui-react to display status messages.
- */
-export function StatusMessageRenderer({ closeMessage, cancelActivityMessage: cancelActivityMessageProp, dismissActivityMessage, }) {
-    const messages = React.useRef([]);
-    const [activityMessageInfo, setActivityMessageInfo] = React.useState(undefined);
-    const updateMessages = () => {
-        const updatedMessages = [...messages.current];
-        messages.current.forEach((m) => {
-            if (!MessageManager.activeMessageManager.messages.some((msg) => m.id === msg.id)) {
-                m.close();
-                const index = updatedMessages.findIndex((msg) => msg.id === m.id);
-                updatedMessages.splice(index, 1);
-            }
-        });
-        messages.current = updatedMessages;
-    };
-    React.useEffect(() => {
-        const handleMessageAddedEvent = ({ message }) => {
-            updateMessages();
-            const messagesToAdd = MessageManager.activeMessageManager.messages.filter((msg) => !messages.current.find((m) => m.id === msg.id));
-            messagesToAdd.forEach((msg) => {
-                const displayedMessage = MessageManager.displayMessage(message, { onRemove: () => onRemove(msg.id) }, { placement: "top", order: "descending" });
-                if (!!displayedMessage)
-                    messages.current.push({ close: displayedMessage.close, id: msg.id });
-            });
-        };
-        return MessageManager.onMessageAddedEvent.addListener(handleMessageAddedEvent);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    React.useEffect(() => {
-        /** Respond to clearing the message list */
-        return MessageManager.onMessagesUpdatedEvent.addListener(updateMessages);
-    }, []);
-    React.useEffect(() => {
-        const handleActivityMessageUpdatedEvent = (args) => {
-            setActivityMessageInfo(args);
-        };
-        return MessageManager.onActivityMessageUpdatedEvent.addListener(handleActivityMessageUpdatedEvent);
-    }, []);
-    React.useEffect(() => {
-        const handleActivityMessageCancelledEvent = () => {
-            setActivityMessageInfo(undefined);
-        };
-        return MessageManager.onActivityMessageCancelledEvent.addListener(handleActivityMessageCancelledEvent);
-    }, []);
-    const onRemove = React.useCallback((id) => {
-        MessageManager.activeMessageManager.remove(id);
-        MessageManager.updateMessages();
-        closeMessage === null || closeMessage === void 0 ? void 0 : closeMessage(id);
-    }, [closeMessage]);
-    const cancelActivityMessage = React.useCallback(() => {
-        MessageManager.endActivityMessage(false);
-        cancelActivityMessageProp && cancelActivityMessageProp();
-    }, [cancelActivityMessageProp]);
-    useActivityMessage({ activityMessageInfo, cancelActivityMessage, dismissActivityMessage });
-    return React.createElement(React.Fragment, null);
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Notification
+ */
+import "./StatusMessageRenderer.scss";
+import * as React from "react";
+import { MessageManager } from "./MessageManager";
+import { useActivityMessage } from "./ActivityMessage";
+/** Message Popup React component that renders one or more Toast or Sticky messages and an Activity message without a StatusBar.
+ * @note This component was formerly named MessageRenderer in previous releases.
+ * @public
+ * @deprecated Use `toaster` from iTwinui-react to display status messages.
+ */
+export function StatusMessageRenderer({ closeMessage, cancelActivityMessage: cancelActivityMessageProp, dismissActivityMessage, }) {
+    const messages = React.useRef([]);
+    const [activityMessageInfo, setActivityMessageInfo] = React.useState(undefined);
+    const updateMessages = () => {
+        const updatedMessages = [...messages.current];
+        messages.current.forEach((m) => {
+            if (!MessageManager.activeMessageManager.messages.some((msg) => m.id === msg.id)) {
+                m.close();
+                const index = updatedMessages.findIndex((msg) => msg.id === m.id);
+                updatedMessages.splice(index, 1);
+            }
+        });
+        messages.current = updatedMessages;
+    };
+    React.useEffect(() => {
+        const handleMessageAddedEvent = ({ message }) => {
+            updateMessages();
+            const messagesToAdd = MessageManager.activeMessageManager.messages.filter((msg) => !messages.current.find((m) => m.id === msg.id));
+            messagesToAdd.forEach((msg) => {
+                const displayedMessage = MessageManager.displayMessage(message, { onRemove: () => onRemove(msg.id) }, { placement: "top", order: "descending" });
+                if (!!displayedMessage)
+                    messages.current.push({ close: displayedMessage.close, id: msg.id });
+            });
+        };
+        return MessageManager.onMessageAddedEvent.addListener(handleMessageAddedEvent);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    React.useEffect(() => {
+        /** Respond to clearing the message list */
+        return MessageManager.onMessagesUpdatedEvent.addListener(updateMessages);
+    }, []);
+    React.useEffect(() => {
+        const handleActivityMessageUpdatedEvent = (args) => {
+            setActivityMessageInfo(args);
+        };
+        return MessageManager.onActivityMessageUpdatedEvent.addListener(handleActivityMessageUpdatedEvent);
+    }, []);
+    React.useEffect(() => {
+        const handleActivityMessageCancelledEvent = () => {
+            setActivityMessageInfo(undefined);
+        };
+        return MessageManager.onActivityMessageCancelledEvent.addListener(handleActivityMessageCancelledEvent);
+    }, []);
+    const onRemove = React.useCallback((id) => {
+        MessageManager.activeMessageManager.remove(id);
+        MessageManager.updateMessages();
+        closeMessage === null || closeMessage === void 0 ? void 0 : closeMessage(id);
+    }, [closeMessage]);
+    const cancelActivityMessage = React.useCallback(() => {
+        MessageManager.endActivityMessage(false);
+        cancelActivityMessageProp && cancelActivityMessageProp();
+    }, [cancelActivityMessageProp]);
+    useActivityMessage({ activityMessageInfo, cancelActivityMessage, dismissActivityMessage });
+    return React.createElement(React.Fragment, null);
+}
 //# sourceMappingURL=StatusMessageRenderer.js.map

package/lib/esm/appui-react/messages/StatusMessageRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusMessageRenderer.js","sourceRoot":"","sources":["../../../../src/appui-react/messages/StatusMessageRenderer.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Notification\n */\n\nimport \"./StatusMessageRenderer.scss\";\nimport * as React from \"react\";\nimport { ActivityMessageEventArgs, MessageAddedEventArgs, MessageManager } from \"./MessageManager\";\nimport { CommonProps } from \"@itwin/core-react\";\nimport { useActivityMessage } from \"./ActivityMessage\";\n\n/** Message type for the [[StatusMessageRenderer]] React component\n * @internal\n */\ninterface StatusMessageRendererrMessage {\n  close: () => void;\n  id: string;\n}\n\n/** Properties for [[StatusMessageRenderer]] component\n * @deprecated Props of a deprecated component.\n * @public\n */\nexport interface StatusMessageRendererProps extends CommonProps {\n  closeMessage?: (id: string) => void;\n  cancelActivityMessage?: () => void;\n  dismissActivityMessage?: () => void;\n}\n\n/** Message Popup React component that renders one or more Toast or Sticky messages and an Activity message without a StatusBar.\n * @note This component was formerly named MessageRenderer in previous releases.\n * @public\n * @deprecated Use `toaster` from iTwinui-react to display status messages.\n */\nexport function StatusMessageRenderer({\n  closeMessage,\n  cancelActivityMessage: cancelActivityMessageProp,\n  dismissActivityMessage,\n}: StatusMessageRendererProps) { // eslint-disable-line deprecation/deprecation\n  const messages = React.useRef<StatusMessageRendererrMessage[]>([]);\n  const [activityMessageInfo, setActivityMessageInfo] = React.useState<ActivityMessageEventArgs | undefined>(undefined);\n\n  const updateMessages = () => {\n    const updatedMessages = [...messages.current];\n    messages.current.forEach((m) => {\n      if (!MessageManager.activeMessageManager.messages.some((msg) => m.id === msg.id)) {\n        m.close();\n        const index = updatedMessages.findIndex((msg) => msg.id === m.id);\n        updatedMessages.splice(index, 1);\n      }\n    });\n\n    messages.current = updatedMessages;\n  };\n\n  React.useEffect(() => {\n    const handleMessageAddedEvent = ({ message }: MessageAddedEventArgs) => {\n      updateMessages();\n      const messagesToAdd = MessageManager.activeMessageManager.messages.filter((msg) => !messages.current.find((m) => m.id === msg.id));\n      messagesToAdd.forEach((msg) => {\n        const displayedMessage = MessageManager.displayMessage(\n          message,\n          { onRemove: () => onRemove(msg.id) },\n          { placement: \"top\", order: \"descending\" }\n        );\n        if (!!displayedMessage)\n          messages.current.push({ close: displayedMessage.close, id: msg.id });\n      });\n    };\n\n    return MessageManager.onMessageAddedEvent.addListener(handleMessageAddedEvent);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  React.useEffect(() => {\n    /** Respond to clearing the message list */\n    return MessageManager.onMessagesUpdatedEvent.addListener(updateMessages);\n  }, []);\n\n  React.useEffect(() => {\n    const handleActivityMessageUpdatedEvent = (args: ActivityMessageEventArgs) => {\n      setActivityMessageInfo(args);\n    };\n\n    return MessageManager.onActivityMessageUpdatedEvent.addListener(handleActivityMessageUpdatedEvent);\n  }, []);\n\n  React.useEffect(() => {\n    const handleActivityMessageCancelledEvent = () => {\n      setActivityMessageInfo(undefined);\n    };\n\n    return MessageManager.onActivityMessageCancelledEvent.addListener(handleActivityMessageCancelledEvent);\n  }, []);\n\n  const onRemove = React.useCallback((id: string) => {\n    MessageManager.activeMessageManager.remove(id);\n    MessageManager.updateMessages();\n    closeMessage?.(id);\n  }, [closeMessage]);\n\n  const cancelActivityMessage = React.useCallback(() => {\n    MessageManager.endActivityMessage(false);\n    cancelActivityMessageProp && cancelActivityMessageProp();\n  }, [cancelActivityMessageProp]);\n\n  useActivityMessage({ activityMessageInfo, cancelActivityMessage, dismissActivityMessage });\n\n  return <></>;\n}\n"]}
+{"version":3,"file":"StatusMessageRenderer.js","sourceRoot":"","sources":["../../../../src/appui-react/messages/StatusMessageRenderer.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 \"./StatusMessageRenderer.scss\";\r\nimport * as React from \"react\";\r\nimport { ActivityMessageEventArgs, MessageAddedEventArgs, MessageManager } from \"./MessageManager\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\nimport { useActivityMessage } from \"./ActivityMessage\";\r\n\r\n/** Message type for the [[StatusMessageRenderer]] React component\r\n * @internal\r\n */\r\ninterface StatusMessageRendererrMessage {\r\n  close: () => void;\r\n  id: string;\r\n}\r\n\r\n/** Properties for [[StatusMessageRenderer]] component\r\n * @deprecated Props of a deprecated component.\r\n * @public\r\n */\r\nexport interface StatusMessageRendererProps extends CommonProps {\r\n  closeMessage?: (id: string) => void;\r\n  cancelActivityMessage?: () => void;\r\n  dismissActivityMessage?: () => void;\r\n}\r\n\r\n/** Message Popup React component that renders one or more Toast or Sticky messages and an Activity message without a StatusBar.\r\n * @note This component was formerly named MessageRenderer in previous releases.\r\n * @public\r\n * @deprecated Use `toaster` from iTwinui-react to display status messages.\r\n */\r\nexport function StatusMessageRenderer({\r\n  closeMessage,\r\n  cancelActivityMessage: cancelActivityMessageProp,\r\n  dismissActivityMessage,\r\n}: StatusMessageRendererProps) { // eslint-disable-line deprecation/deprecation\r\n  const messages = React.useRef<StatusMessageRendererrMessage[]>([]);\r\n  const [activityMessageInfo, setActivityMessageInfo] = React.useState<ActivityMessageEventArgs | undefined>(undefined);\r\n\r\n  const updateMessages = () => {\r\n    const updatedMessages = [...messages.current];\r\n    messages.current.forEach((m) => {\r\n      if (!MessageManager.activeMessageManager.messages.some((msg) => m.id === msg.id)) {\r\n        m.close();\r\n        const index = updatedMessages.findIndex((msg) => msg.id === m.id);\r\n        updatedMessages.splice(index, 1);\r\n      }\r\n    });\r\n\r\n    messages.current = updatedMessages;\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    const handleMessageAddedEvent = ({ message }: MessageAddedEventArgs) => {\r\n      updateMessages();\r\n      const messagesToAdd = MessageManager.activeMessageManager.messages.filter((msg) => !messages.current.find((m) => m.id === msg.id));\r\n      messagesToAdd.forEach((msg) => {\r\n        const displayedMessage = MessageManager.displayMessage(\r\n          message,\r\n          { onRemove: () => onRemove(msg.id) },\r\n          { placement: \"top\", order: \"descending\" }\r\n        );\r\n        if (!!displayedMessage)\r\n          messages.current.push({ close: displayedMessage.close, id: msg.id });\r\n      });\r\n    };\r\n\r\n    return MessageManager.onMessageAddedEvent.addListener(handleMessageAddedEvent);\r\n    // eslint-disable-next-line react-hooks/exhaustive-deps\r\n  }, []);\r\n\r\n  React.useEffect(() => {\r\n    /** Respond to clearing the message list */\r\n    return MessageManager.onMessagesUpdatedEvent.addListener(updateMessages);\r\n  }, []);\r\n\r\n  React.useEffect(() => {\r\n    const handleActivityMessageUpdatedEvent = (args: ActivityMessageEventArgs) => {\r\n      setActivityMessageInfo(args);\r\n    };\r\n\r\n    return MessageManager.onActivityMessageUpdatedEvent.addListener(handleActivityMessageUpdatedEvent);\r\n  }, []);\r\n\r\n  React.useEffect(() => {\r\n    const handleActivityMessageCancelledEvent = () => {\r\n      setActivityMessageInfo(undefined);\r\n    };\r\n\r\n    return MessageManager.onActivityMessageCancelledEvent.addListener(handleActivityMessageCancelledEvent);\r\n  }, []);\r\n\r\n  const onRemove = React.useCallback((id: string) => {\r\n    MessageManager.activeMessageManager.remove(id);\r\n    MessageManager.updateMessages();\r\n    closeMessage?.(id);\r\n  }, [closeMessage]);\r\n\r\n  const cancelActivityMessage = React.useCallback(() => {\r\n    MessageManager.endActivityMessage(false);\r\n    cancelActivityMessageProp && cancelActivityMessageProp();\r\n  }, [cancelActivityMessageProp]);\r\n\r\n  useActivityMessage({ activityMessageInfo, cancelActivityMessage, dismissActivityMessage });\r\n\r\n  return <></>;\r\n}\r\n"]}

package/lib/esm/appui-react/messages/StatusMessageRenderer.scss

@@ -1,28 +1,28 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "~@itwin/core-react/lib/cjs/core-react/z-index";
-
-.uifw-message-renderer {
-  width: 100%;
-  margin-left: auto;
-  margin-right: auto;
-  left: 0;
-  top: 0;
-  right: 0;
-  position: fixed;
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-  justify-content: center;
-  @include uicore-z-index(dialog-popup);
-}
-
-@media screen and (min-width: 401px) {
-  .uifw-message-renderer {
-    min-width: 400px;
-    max-width: 640px;
-    margin-top: 24px;
-  }
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/core-react/lib/cjs/core-react/z-index";
+
+.uifw-message-renderer {
+  width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  left: 0;
+  top: 0;
+  right: 0;
+  position: fixed;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  @include uicore-z-index(dialog-popup);
+}
+
+@media screen and (min-width: 401px) {
+  .uifw-message-renderer {
+    min-width: 400px;
+    max-width: 640px;
+    margin-top: 24px;
+  }
 }