@hortiview/shared-components 2.26.0 → 2.26.2

package/dist/components/Modal/Modal.js

@@ -1,38 +1,38 @@
-import { jsx as g, Fragment as Rt, jsxs as wt } from "react/jsx-runtime";
-import { G as U } from "../../index.es-Z0aF-7Cn.js";
-import { I as $t } from "../../index.es-CkB4776y.js";
-import { _ as Qt, a as Xt, c as G, P as s } from "../../index-Df2FYN-K.js";
-import { _ as kt } from "../../slicedToArray-DC6VAZtW.js";
-import m, { forwardRef as Zt, useRef as Mt, useImperativeHandle as te, useState as Pt, useEffect as v, useCallback as Z, useMemo as nt, Fragment as ee } from "react";
-import { w as Ht, r as ne, c as D, a as oe } from "../../index.es-C6I3L4U4.js";
-import { b as Ut, c as xt, d as ie } from "../../tslib.es6-BDCynO9F.js";
-import { M as ae, a as re } from "../../component-By6nyiBU.js";
-import { M as le, c as se, m as ce } from "../../component-DYpB_4EP.js";
-import { A as de } from "../../animationframe-CqXArbwZ.js";
-import { P as ue } from "../../index.es-DgncYOqO.js";
-import { b as me } from "../../index.es-DUrjyxNI.js";
-import { ErrorBanner as fe } from "../ErrorBanner/ErrorBanner.js";
-import { Iconify as pe } from "../Iconify/Iconify.js";
-import { OfflineView as he } from "../OfflineView/OfflineView.js";
-import '../../assets/Modal.css';function ge(o, e, t) {
+import { jsx as g, Fragment as wt, jsxs as kt } from "react/jsx-runtime";
+import { G as U } from "../../index.es-BE1XL1dD.js";
+import { I as Ut } from "../../index.es-BZkGOjEo.js";
+import { _ as Zt, a as te, c as G, P as l } from "../../index-_-9ybP20.js";
+import { _ as Mt } from "../../slicedToArray-C2Ed3239.js";
+import m, { forwardRef as ee, useRef as Pt, useImperativeHandle as ne, useState as Ht, useEffect as v, useCallback as Z, useMemo as nt, Fragment as oe } from "react";
+import { w as xt, j as ie, c as D, a as ae } from "../../index.es-DRC-9PLs.js";
+import { b as Gt, c as $t, d as re } from "../../tslib.es6-BDCynO9F.js";
+import { M as le, a as se } from "../../component-By6nyiBU.js";
+import { M as ce, c as ue, m as de } from "../../component-DYpB_4EP.js";
+import { A as me } from "../../animationframe-CqXArbwZ.js";
+import { P as fe } from "../../index.es-C8AExypY.js";
+import { b as pe } from "../../index.es-EXzC8zuP.js";
+import { ErrorBanner as he } from "../ErrorBanner/ErrorBanner.js";
+import { Iconify as ge } from "../Iconify/Iconify.js";
+import { OfflineView as _e } from "../OfflineView/OfflineView.js";
+import '../../assets/Modal.css';function Ce(o, e, t) {
   return e(o, { initialFocusEl: t });
 }
-function _e(o) {
+function ve(o) {
   return o ? o.scrollHeight > o.offsetHeight : !1;
 }
-function Ce(o) {
+function Ee(o) {
   return o ? o.scrollTop === 0 : !1;
 }
-function ve(o) {
+function Se(o) {
   return o ? Math.ceil(o.scrollHeight - o.scrollTop) === o.clientHeight : !1;
 }
-function Ee(o) {
+function ye(o) {
   var e = /* @__PURE__ */ new Set();
   return [].forEach.call(o, function(t) {
     return e.add(t.offsetTop);
   }), e.size > 1;
 }
-var tt = "mdc-dom-focus-sentinel", Se = (
+var tt = "mdc-dom-focus-sentinel", Oe = (
   /** @class */
   (function() {
     function o(e, t) {
@@ -62,12 +62,12 @@ var tt = "mdc-dom-focus-sentinel", Se = (
     }, o.prototype.getFocusableElements = function(e) {
       var t = [].slice.call(e.querySelectorAll("[autofocus], [tabindex], a, input, textarea, select, button"));
       return t.filter(function(n) {
-        var i = n.getAttribute("aria-disabled") === "true" || n.getAttribute("disabled") != null || n.getAttribute("hidden") != null || n.getAttribute("aria-hidden") === "true", a = n.tabIndex >= 0 && n.getBoundingClientRect().width > 0 && !n.classList.contains(tt) && !i, u = !1;
+        var i = n.getAttribute("aria-disabled") === "true" || n.getAttribute("disabled") != null || n.getAttribute("hidden") != null || n.getAttribute("aria-hidden") === "true", a = n.tabIndex >= 0 && n.getBoundingClientRect().width > 0 && !n.classList.contains(tt) && !i, d = !1;
         if (a) {
           var h = getComputedStyle(n);
-          u = h.display === "none" || h.visibility === "hidden";
+          d = h.display === "none" || h.visibility === "hidden";
         }
-        return a && !u;
+        return a && !d;
       });
     }, o.prototype.createSentinel = function() {
       var e = document.createElement("div");
@@ -75,7 +75,7 @@ var tt = "mdc-dom-focus-sentinel", Se = (
     }, o;
   })()
 );
-var l = {
+var s = {
   CLOSING: "mdc-dialog--closing",
   OPEN: "mdc-dialog--open",
   OPENING: "mdc-dialog--opening",
@@ -136,13 +136,13 @@ var K;
 (function(o) {
   o.POLL_SCROLL_POS = "poll_scroll_position", o.POLL_LAYOUT_CHANGE = "poll_layout_change";
 })(K || (K = {}));
-var Gt = (
+var Kt = (
   /** @class */
   (function(o) {
-    Ut(e, o);
+    Gt(e, o);
     function e(t) {
-      var n = o.call(this, xt(xt({}, e.defaultAdapter), t)) || this;
-      return n.dialogOpen = !1, n.isFullscreen = !1, n.animationFrame = 0, n.animationTimer = 0, n.escapeKeyAction = A.CLOSE_ACTION, n.scrimClickAction = A.CLOSE_ACTION, n.autoStackButtons = !0, n.areButtonsStacked = !1, n.suppressDefaultPressSelector = A.SUPPRESS_DEFAULT_PRESS_SELECTOR, n.animFrame = new de(), n.contentScrollHandler = function() {
+      var n = o.call(this, $t($t({}, e.defaultAdapter), t)) || this;
+      return n.dialogOpen = !1, n.isFullscreen = !1, n.animationFrame = 0, n.animationTimer = 0, n.escapeKeyAction = A.CLOSE_ACTION, n.scrimClickAction = A.CLOSE_ACTION, n.autoStackButtons = !0, n.areButtonsStacked = !1, n.suppressDefaultPressSelector = A.SUPPRESS_DEFAULT_PRESS_SELECTOR, n.animFrame = new me(), n.contentScrollHandler = function() {
         n.handleScrollEvent();
       }, n.windowResizeHandler = function() {
         n.layout();
@@ -152,7 +152,7 @@ var Gt = (
     }
     return Object.defineProperty(e, "cssClasses", {
       get: function() {
-        return l;
+        return s;
       },
       enumerable: !1,
       configurable: !0
@@ -232,30 +232,30 @@ var Gt = (
       enumerable: !1,
       configurable: !0
     }), e.prototype.init = function() {
-      this.adapter.hasClass(l.STACKED) && this.setAutoStackButtons(!1), this.isFullscreen = this.adapter.hasClass(l.FULLSCREEN);
+      this.adapter.hasClass(s.STACKED) && this.setAutoStackButtons(!1), this.isFullscreen = this.adapter.hasClass(s.FULLSCREEN);
     }, e.prototype.destroy = function() {
       this.dialogOpen && this.close(A.DESTROY_ACTION), this.animationTimer && (clearTimeout(this.animationTimer), this.handleAnimationTimerEnd()), this.isFullscreen && this.adapter.deregisterContentEventHandler("scroll", this.contentScrollHandler), this.animFrame.cancelAll(), this.adapter.deregisterWindowEventHandler("resize", this.windowResizeHandler), this.adapter.deregisterWindowEventHandler("orientationchange", this.windowOrientationChangeHandler);
     }, e.prototype.open = function(t) {
       var n = this;
-      this.dialogOpen = !0, this.adapter.notifyOpening(), this.adapter.addClass(l.OPENING), this.isFullscreen && this.adapter.registerContentEventHandler("scroll", this.contentScrollHandler), t && t.isAboveFullscreenDialog && this.adapter.addClass(l.SCRIM_HIDDEN), this.adapter.registerWindowEventHandler("resize", this.windowResizeHandler), this.adapter.registerWindowEventHandler("orientationchange", this.windowOrientationChangeHandler), this.runNextAnimationFrame(function() {
-        n.adapter.addClass(l.OPEN), n.adapter.addBodyClass(l.SCROLL_LOCK), n.layout(), n.animationTimer = setTimeout(function() {
+      this.dialogOpen = !0, this.adapter.notifyOpening(), this.adapter.addClass(s.OPENING), this.isFullscreen && this.adapter.registerContentEventHandler("scroll", this.contentScrollHandler), t && t.isAboveFullscreenDialog && this.adapter.addClass(s.SCRIM_HIDDEN), this.adapter.registerWindowEventHandler("resize", this.windowResizeHandler), this.adapter.registerWindowEventHandler("orientationchange", this.windowOrientationChangeHandler), this.runNextAnimationFrame(function() {
+        n.adapter.addClass(s.OPEN), n.adapter.addBodyClass(s.SCROLL_LOCK), n.layout(), n.animationTimer = setTimeout(function() {
           n.handleAnimationTimerEnd(), n.adapter.trapFocus(n.adapter.getInitialFocusEl()), n.adapter.notifyOpened();
         }, et.DIALOG_ANIMATION_OPEN_TIME_MS);
       });
     }, e.prototype.close = function(t) {
       var n = this;
-      t === void 0 && (t = ""), this.dialogOpen && (this.dialogOpen = !1, this.adapter.notifyClosing(t), this.adapter.addClass(l.CLOSING), this.adapter.removeClass(l.OPEN), this.adapter.removeBodyClass(l.SCROLL_LOCK), this.isFullscreen && this.adapter.deregisterContentEventHandler("scroll", this.contentScrollHandler), this.adapter.deregisterWindowEventHandler("resize", this.windowResizeHandler), this.adapter.deregisterWindowEventHandler("orientationchange", this.windowOrientationChangeHandler), cancelAnimationFrame(this.animationFrame), this.animationFrame = 0, clearTimeout(this.animationTimer), this.animationTimer = setTimeout(function() {
+      t === void 0 && (t = ""), this.dialogOpen && (this.dialogOpen = !1, this.adapter.notifyClosing(t), this.adapter.addClass(s.CLOSING), this.adapter.removeClass(s.OPEN), this.adapter.removeBodyClass(s.SCROLL_LOCK), this.isFullscreen && this.adapter.deregisterContentEventHandler("scroll", this.contentScrollHandler), this.adapter.deregisterWindowEventHandler("resize", this.windowResizeHandler), this.adapter.deregisterWindowEventHandler("orientationchange", this.windowOrientationChangeHandler), cancelAnimationFrame(this.animationFrame), this.animationFrame = 0, clearTimeout(this.animationTimer), this.animationTimer = setTimeout(function() {
         n.adapter.releaseFocus(), n.handleAnimationTimerEnd(), n.adapter.notifyClosed(t);
       }, et.DIALOG_ANIMATION_CLOSE_TIME_MS));
     }, e.prototype.showSurfaceScrim = function() {
       var t = this;
-      this.adapter.addClass(l.SURFACE_SCRIM_SHOWING), this.runNextAnimationFrame(function() {
-        t.adapter.addClass(l.SURFACE_SCRIM_SHOWN);
+      this.adapter.addClass(s.SURFACE_SCRIM_SHOWING), this.runNextAnimationFrame(function() {
+        t.adapter.addClass(s.SURFACE_SCRIM_SHOWN);
       });
     }, e.prototype.hideSurfaceScrim = function() {
-      this.adapter.removeClass(l.SURFACE_SCRIM_SHOWN), this.adapter.addClass(l.SURFACE_SCRIM_HIDING);
+      this.adapter.removeClass(s.SURFACE_SCRIM_SHOWN), this.adapter.addClass(s.SURFACE_SCRIM_HIDING);
     }, e.prototype.handleSurfaceScrimTransitionEnd = function() {
-      this.adapter.removeClass(l.SURFACE_SCRIM_HIDING), this.adapter.removeClass(l.SURFACE_SCRIM_SHOWING);
+      this.adapter.removeClass(s.SURFACE_SCRIM_HIDING), this.adapter.removeClass(s.SURFACE_SCRIM_SHOWING);
     }, e.prototype.isOpen = function() {
       return this.dialogOpen;
     }, e.prototype.getEscapeKeyAction = function() {
@@ -292,8 +292,8 @@ var Gt = (
       if (n) {
         var i = this.adapter.getActionFromEvent(t);
         if (!i) {
-          var a = t.composedPath ? t.composedPath()[0] : t.target, u = this.suppressDefaultPressSelector ? !this.adapter.eventTargetMatches(a, this.suppressDefaultPressSelector) : !0;
-          n && u && this.adapter.clickDefaultButton();
+          var a = t.composedPath ? t.composedPath()[0] : t.target, d = this.suppressDefaultPressSelector ? !this.adapter.eventTargetMatches(a, this.suppressDefaultPressSelector) : !0;
+          n && d && this.adapter.clickDefaultButton();
         }
       }
     }, e.prototype.handleDocumentKeydown = function(t) {
@@ -307,29 +307,29 @@ var Gt = (
     }, e.prototype.layoutInternal = function() {
       this.autoStackButtons && this.detectStackedButtons(), this.toggleScrollableClasses();
     }, e.prototype.handleAnimationTimerEnd = function() {
-      this.animationTimer = 0, this.adapter.removeClass(l.OPENING), this.adapter.removeClass(l.CLOSING);
+      this.animationTimer = 0, this.adapter.removeClass(s.OPENING), this.adapter.removeClass(s.CLOSING);
     }, e.prototype.runNextAnimationFrame = function(t) {
       var n = this;
       cancelAnimationFrame(this.animationFrame), this.animationFrame = requestAnimationFrame(function() {
         n.animationFrame = 0, clearTimeout(n.animationTimer), n.animationTimer = setTimeout(t, 0);
       });
     }, e.prototype.detectStackedButtons = function() {
-      this.adapter.removeClass(l.STACKED);
+      this.adapter.removeClass(s.STACKED);
       var t = this.adapter.areButtonsStacked();
-      t && this.adapter.addClass(l.STACKED), t !== this.areButtonsStacked && (this.adapter.reverseButtons(), this.areButtonsStacked = t);
+      t && this.adapter.addClass(s.STACKED), t !== this.areButtonsStacked && (this.adapter.reverseButtons(), this.areButtonsStacked = t);
     }, e.prototype.toggleScrollableClasses = function() {
-      this.adapter.removeClass(l.SCROLLABLE), this.adapter.isContentScrollable() && (this.adapter.addClass(l.SCROLLABLE), this.isFullscreen && (this.toggleScrollDividerHeader(), this.toggleScrollDividerFooter()));
+      this.adapter.removeClass(s.SCROLLABLE), this.adapter.isContentScrollable() && (this.adapter.addClass(s.SCROLLABLE), this.isFullscreen && (this.toggleScrollDividerHeader(), this.toggleScrollDividerFooter()));
     }, e.prototype.toggleScrollDividerHeader = function() {
-      this.adapter.isScrollableContentAtTop() ? this.adapter.hasClass(l.SCROLL_DIVIDER_HEADER) && this.adapter.removeClass(l.SCROLL_DIVIDER_HEADER) : this.adapter.addClass(l.SCROLL_DIVIDER_HEADER);
+      this.adapter.isScrollableContentAtTop() ? this.adapter.hasClass(s.SCROLL_DIVIDER_HEADER) && this.adapter.removeClass(s.SCROLL_DIVIDER_HEADER) : this.adapter.addClass(s.SCROLL_DIVIDER_HEADER);
     }, e.prototype.toggleScrollDividerFooter = function() {
-      this.adapter.isScrollableContentAtBottom() ? this.adapter.hasClass(l.SCROLL_DIVIDER_FOOTER) && this.adapter.removeClass(l.SCROLL_DIVIDER_FOOTER) : this.adapter.addClass(l.SCROLL_DIVIDER_FOOTER);
+      this.adapter.isScrollableContentAtBottom() ? this.adapter.hasClass(s.SCROLL_DIVIDER_FOOTER) && this.adapter.removeClass(s.SCROLL_DIVIDER_FOOTER) : this.adapter.addClass(s.SCROLL_DIVIDER_FOOTER);
     }, e;
-  })(ae)
+  })(le)
 );
-var f = Gt.strings, ye = (
+var f = Kt.strings, Ae = (
   /** @class */
   (function(o) {
-    Ut(e, o);
+    Gt(e, o);
     function e() {
       return o !== null && o.apply(this, arguments) || this;
     }
@@ -371,29 +371,29 @@ var f = Gt.strings, ye = (
     }, e.prototype.initialize = function(t) {
       var n, i;
       t === void 0 && (t = function(_, S) {
-        return new Se(_, S);
+        return new Oe(_, S);
       });
       var a = this.root.querySelector(f.CONTAINER_SELECTOR);
       if (!a)
         throw new Error("Dialog component requires a " + f.CONTAINER_SELECTOR + " container element");
       this.container = a, this.content = this.root.querySelector(f.CONTENT_SELECTOR), this.buttons = [].slice.call(this.root.querySelectorAll(f.BUTTON_SELECTOR)), this.defaultButton = this.root.querySelector("[" + f.BUTTON_DEFAULT_ATTRIBUTE + "]"), this.focusTrapFactory = t, this.buttonRipples = [];
       try {
-        for (var u = ie(this.buttons), h = u.next(); !h.done; h = u.next()) {
+        for (var d = re(this.buttons), h = d.next(); !h.done; h = d.next()) {
           var O = h.value;
-          this.buttonRipples.push(new le(O));
+          this.buttonRipples.push(new ce(O));
         }
       } catch (_) {
         n = { error: _ };
       } finally {
         try {
-          h && !h.done && (i = u.return) && i.call(u);
+          h && !h.done && (i = d.return) && i.call(d);
         } finally {
           if (n) throw n.error;
         }
       }
     }, e.prototype.initialSyncWithDOM = function() {
       var t = this;
-      this.focusTrap = ge(this.container, this.focusTrapFactory, this.getInitialFocusEl() || void 0), this.handleClick = this.foundation.handleClick.bind(this.foundation), this.handleKeydown = this.foundation.handleKeydown.bind(this.foundation), this.handleDocumentKeydown = this.foundation.handleDocumentKeydown.bind(this.foundation), this.handleOpening = function() {
+      this.focusTrap = Ce(this.container, this.focusTrapFactory, this.getInitialFocusEl() || void 0), this.handleClick = this.foundation.handleClick.bind(this.foundation), this.handleKeydown = this.foundation.handleKeydown.bind(this.foundation), this.handleDocumentKeydown = this.foundation.handleDocumentKeydown.bind(this.foundation), this.handleOpening = function() {
         document.addEventListener("keydown", t.handleDocumentKeydown);
       }, this.handleClosing = function() {
         document.removeEventListener("keydown", t.handleDocumentKeydown);
@@ -417,18 +417,18 @@ var f = Gt.strings, ye = (
           return t.root.classList.add(i);
         },
         areButtonsStacked: function() {
-          return Ee(t.buttons);
+          return ye(t.buttons);
         },
         clickDefaultButton: function() {
           t.defaultButton && t.defaultButton.click();
         },
         eventTargetMatches: function(i, a) {
-          return i ? ce(i, a) : !1;
+          return i ? de(i, a) : !1;
         },
         getActionFromEvent: function(i) {
           if (!i.target)
             return "";
-          var a = se(i.target, "[" + f.ACTION_ATTRIBUTE + "]");
+          var a = ue(i.target, "[" + f.ACTION_ATTRIBUTE + "]");
           return a && a.getAttribute(f.ACTION_ATTRIBUTE);
         },
         getInitialFocusEl: function() {
@@ -438,7 +438,7 @@ var f = Gt.strings, ye = (
           return t.root.classList.contains(i);
         },
         isContentScrollable: function() {
-          return _e(t.content);
+          return ve(t.content);
         },
         notifyClosed: function(i) {
           return t.emit(f.CLOSED_EVENT, i ? { action: i } : {});
@@ -476,10 +476,10 @@ var f = Gt.strings, ye = (
           t.content instanceof HTMLElement && t.content.removeEventListener(i, a);
         },
         isScrollableContentAtTop: function() {
-          return Ce(t.content);
+          return Ee(t.content);
         },
         isScrollableContentAtBottom: function() {
-          return ve(t.content);
+          return Se(t.content);
         },
         registerWindowEventHandler: function(i, a) {
           window.addEventListener(i, a);
@@ -488,175 +488,181 @@ var f = Gt.strings, ye = (
           window.removeEventListener(i, a);
         }
       };
-      return new Gt(n);
+      return new Kt(n);
     }, e.prototype.getInitialFocusEl = function() {
       return this.root.querySelector("[" + f.INITIAL_FOCUS_ATTRIBUTE + "]");
     }, e;
-  })(re)
-), Oe = {
+  })(se)
+), be = {
   /**
    * An action button that will not automatically trigger a dismiss or accept. It is meant to be used only in certain circumstances where more control of the modal is required such as validating forms. If primaryButton is sent with actionButton, actionButton will be ignored.
    *
    * Defaults to **null**.
    */
-  actionButton: s.node,
+  actionButton: l.node,
   /**
    * Button for any navigating to the previous page in a Directional modal.
    *
    * Defaults to **null**.
    */
-  backButton: s.node,
+  backButton: l.node,
   /**
    * The custom modal label badge to be rendered.
    *
    * Defaults to **undefined**.
    */
-  badge: s.node,
+  badge: l.node,
   /**
    * Accepts any valid markup. Optionally, `content` may be used instead. If `content` and `children` are both set, `content` will take priority.
    *
    * Defaults to **null**.
    */
-  children: s.node,
+  children: l.node,
   /**
    * Primary content of the dialog. Accepts any valid markup. Optionally, `children` may be used instead. If content and `children` are both set, content will take priority.
    *
    * Defaults to **null**.
    */
-  content: s.node,
+  content: l.node,
   /**
    * Button that is the default action, triggered by pressing the Enter key.
    *
    * Defaults to **'primary'**.
    */
-  defaultButton: s.oneOf(["close", "primary", "action", "footerSupplemental"]),
+  defaultButton: l.oneOf(["close", "primary", "action", "footerSupplemental"]),
   /**
    * Button to cancel or close the modal.
    *
    * Defaults to **null**.
    */
-  dismissiveButton: s.node,
+  dismissiveButton: l.node,
   /**
    * Button to be displayed in left corner of the modal footer. Should be a text button.
    *
    * Defaults to **null**.
    */
-  footerSupplemental: s.node,
+  footerSupplemental: l.node,
   /**
    * Content to be displayed in right corner of the modal header. Should be a text button or a group of up to 3 icon buttons.
    *
    * Defaults to **null**.
    */
-  headerActions: s.node,
+  headerActions: l.node,
   /**
    * If true, the close icon in the upper left corner will not be rendered.
    *
    * Defaults to **false**.
    */
-  hideCloseIcon: s.bool,
+  hideCloseIcon: l.bool,
+  /**
+   * Choose between the classic Material Icons (default), newer Material Symbols, or custom.
+   *
+   * Defaults to **'material-icons'**.
+   */
+  iconSource: l.oneOf(["material-icons", "material-symbols"]),
   /**
    * A slot for StepperIndicator.
    *
    * Defaults to **null**.
    */
-  indicator: s.node,
+  indicator: l.node,
   /**
    * Button to initially focus on after the dialog has opened. If left null, the initial focus will be on the first focusable element in the modal. As an alternative you can add the prop `data-mdc-dialog-initial-focus='true'` to any element within the modal to make that element the initial focus. If it is a directional modal, the initial focus will be on the nextButton.
    *
    * Defaults to **null**.
    */
-  initialFocus: s.oneOf(["null", "primary", "action", "footerSupplemental"]),
+  initialFocus: l.oneOf(["null", "primary", "action", "footerSupplemental"]),
   /**
    * If true, the buttons in the footer will be full width and stacked on mobile.
    *
    * Defaults to **false**.
    */
-  mobileStackedButtons: s.bool,
+  mobileStackedButtons: l.bool,
   /**
    * String to determine the size of the modal.
    *
    * Defaults to **'max'**.
    */
-  modalSize: s.oneOf(["fullscreen", "max", "xlarge", "large", "medium", "small", "dialog"]),
+  modalSize: l.oneOf(["fullscreen", "max", "xlarge", "large", "medium", "small", "dialog"]),
   /**
    * Button for navigating to the next page in a Directional modal or closing on the last page.
    *
    * Defaults to **null**.
    */
-  nextButton: s.node,
+  nextButton: l.node,
   /**
    * Set to true if the modal will not have any actions. Should be used sparingly and the modal should be closed programmatically. For example, can be used to stop the user from interacting or navigating away while a payment is processing.
    *
    * Defaults to **null**.
    */
-  noActions: s.bool,
+  noActions: l.bool,
   /**
    * Fired when the Dialog begins its closing animation. Where event.detail.action is the action which closed the dialog (close or accept).
    *
    * Defaults to **null**.
    */
-  onClose: s.func,
+  onClose: l.func,
   /**
    * Fired when the Dialog finishes its closing animation. Where event.detail.action is the action which closed the dialog (close or accept).
    *
    * Defaults to **null**.
    */
-  onClosed: s.func,
+  onClosed: l.func,
   /**
    * Fired when the Dialog begins its opening animation.
    *
    * Defaults to **null**.
    */
-  onOpen: s.func,
+  onOpen: l.func,
   /**
    * Fired when the Dialog finishes its opening animation.
    *
    * Defaults to **null**.
    */
-  onOpened: s.func,
+  onOpened: l.func,
   /**
    * If true, the Modal will be visible on screen.
    *
    * Defaults to **false**.
    */
-  open: s.bool,
+  open: l.bool,
   /**
    * Prevents the user from closing the dialog by hitting escape or clicking the scrim. Use caution when using this as the modal should always have a way for the user to close it.
    *
    * Defaults to **false**.
    */
-  preventClose: s.bool,
+  preventClose: l.bool,
   /**
    * Prevents the default behavior which adds an event listener for the Enter key to the Primary button. Any onEnter/submission behavior will need to be added by the developer (including closing the Modal).
    *
    * Defaults to **false**.
    */
-  preventPrimaryAccept: s.bool,
+  preventPrimaryAccept: l.bool,
   /**
    * Button for the primary action of the modal.
    *
    * Defaults to **null**.
    */
-  primaryButton: s.node,
+  primaryButton: l.node,
   /**
    * DOM selector to provide a target to return focus. Accepts any valid _query_ (see mdn docs for Element.querySelector). If omitted focus will return to the last focused element upon closing.
    *
    * Defaults to **null**.
    */
-  returnFocusSelector: s.string,
+  returnFocusSelector: l.string,
   /**
    * If true, wrapping will be disabled and a scrollable area will be created.
    *
    * Defaults to **false**.
    */
-  scrollable: s.bool,
+  scrollable: l.bool,
   /**
    * String for the modal title.
    *
    * Defaults to **null**.
    */
-  title: s.string
-}, Ae = {
+  title: l.string
+}, Te = {
   actionButton: null,
   backButton: null,
   badge: void 0,
@@ -667,6 +673,7 @@ var f = Gt.strings, ye = (
   footerSupplemental: null,
   headerActions: null,
   hideCloseIcon: !1,
+  iconSource: "material-icons",
   indicator: null,
   initialFocus: null,
   mobileStackedButtons: !1,
@@ -684,27 +691,27 @@ var f = Gt.strings, ye = (
   returnFocusSelector: null,
   scrollable: !1,
   title: null
-}, Te = ["actionButton", "actionIcons", "badge", "backButton", "children", "className", "content", "defaultButton", "dismissiveButton", "footerSupplemental", "headerActions", "hideCloseIcon", "indicator", "initialFocus", "mobileStackedButtons", "modalSize", "nextButton", "noActions", "onClose", "onClosed", "onOpen", "onOpened", "open", "preventClose", "preventPrimaryAccept", "primaryButton", "returnFocusSelector", "scrollable", "title"], r = Ae, ot = /* @__PURE__ */ Zt(function(o, e) {
-  var t = o.actionButton, n = t === void 0 ? r.actionButton : t, i = o.actionIcons, a = i === void 0 ? r.actionIcons : i, u = o.badge, h = u === void 0 ? r.badge : u, O = o.backButton, _ = O === void 0 ? r.backButton : O, S = o.children, F = S === void 0 ? r.children : S, T = o.className, W = T === void 0 ? r.className : T, E = o.content, L = E === void 0 ? r.content : E, it = o.defaultButton, b = it === void 0 ? r.defaultButton : it, at = o.dismissiveButton, R = at === void 0 ? r.dismissiveButton : at, rt = o.footerSupplemental, w = rt === void 0 ? r.footerSupplemental : rt, lt = o.headerActions, st = lt === void 0 ? r.headerActions : lt, ct = o.hideCloseIcon, V = ct === void 0 ? r.hideCloseIcon : ct, dt = o.indicator, Kt = dt === void 0 ? r.indicator : dt, ut = o.initialFocus, I = ut === void 0 ? r.initialFocus : ut, mt = o.mobileStackedButtons, z = mt === void 0 ? r.mobileStackedButtons : mt, ft = o.modalSize, C = ft === void 0 ? r.modalSize : ft, pt = o.nextButton, N = pt === void 0 ? r.nextButton : pt, ht = o.noActions, B = ht === void 0 ? r.noActions : ht, gt = o.onClose, j = gt === void 0 ? r.onClose : gt, _t = o.onClosed, q = _t === void 0 ? r.onClosed : _t, Ct = o.onOpen, k = Ct === void 0 ? r.onOpen : Ct, vt = o.onOpened, M = vt === void 0 ? r.onOpened : vt, Et = o.open, St = Et === void 0 ? r.open : Et, yt = o.preventClose, Y = yt === void 0 ? r.preventClose : yt, Ot = o.preventPrimaryAccept, At = Ot === void 0 ? r.preventPrimaryAccept : Ot, Tt = o.primaryButton, d = Tt === void 0 ? r.primaryButton : Tt, bt = o.returnFocusSelector, J = bt === void 0 ? r.returnFocusSelector : bt, It = o.scrollable, Nt = It === void 0 ? r.scrollable : It, Bt = o.title, Dt = Bt === void 0 ? r.title : Bt, Wt = Qt(o, Te), P = Mt(), c = Mt();
-  te(e, function() {
+}, Ie = ["actionButton", "actionIcons", "badge", "backButton", "children", "className", "content", "defaultButton", "dismissiveButton", "footerSupplemental", "headerActions", "hideCloseIcon", "indicator", "initialFocus", "mobileStackedButtons", "modalSize", "nextButton", "noActions", "onClose", "onClosed", "onOpen", "onOpened", "open", "preventClose", "preventPrimaryAccept", "primaryButton", "returnFocusSelector", "scrollable", "title", "iconSource"], r = Te, ot = /* @__PURE__ */ ee(function(o, e) {
+  var t = o.actionButton, n = t === void 0 ? r.actionButton : t, i = o.actionIcons, a = i === void 0 ? r.actionIcons : i, d = o.badge, h = d === void 0 ? r.badge : d, O = o.backButton, _ = O === void 0 ? r.backButton : O, S = o.children, F = S === void 0 ? r.children : S, b = o.className, W = b === void 0 ? r.className : b, E = o.content, L = E === void 0 ? r.content : E, it = o.defaultButton, T = it === void 0 ? r.defaultButton : it, at = o.dismissiveButton, R = at === void 0 ? r.dismissiveButton : at, rt = o.footerSupplemental, w = rt === void 0 ? r.footerSupplemental : rt, lt = o.headerActions, st = lt === void 0 ? r.headerActions : lt, ct = o.hideCloseIcon, V = ct === void 0 ? r.hideCloseIcon : ct, ut = o.indicator, Wt = ut === void 0 ? r.indicator : ut, dt = o.initialFocus, I = dt === void 0 ? r.initialFocus : dt, mt = o.mobileStackedButtons, z = mt === void 0 ? r.mobileStackedButtons : mt, ft = o.modalSize, C = ft === void 0 ? r.modalSize : ft, pt = o.nextButton, N = pt === void 0 ? r.nextButton : pt, ht = o.noActions, B = ht === void 0 ? r.noActions : ht, gt = o.onClose, j = gt === void 0 ? r.onClose : gt, _t = o.onClosed, q = _t === void 0 ? r.onClosed : _t, Ct = o.onOpen, k = Ct === void 0 ? r.onOpen : Ct, vt = o.onOpened, M = vt === void 0 ? r.onOpened : vt, Et = o.open, St = Et === void 0 ? r.open : Et, yt = o.preventClose, Y = yt === void 0 ? r.preventClose : yt, Ot = o.preventPrimaryAccept, At = Ot === void 0 ? r.preventPrimaryAccept : Ot, bt = o.primaryButton, u = bt === void 0 ? r.primaryButton : bt, Tt = o.returnFocusSelector, J = Tt === void 0 ? r.returnFocusSelector : Tt, It = o.scrollable, Nt = It === void 0 ? r.scrollable : It, Bt = o.title, Dt = Bt === void 0 ? r.title : Bt, Ft = o.iconSource, Vt = Ft === void 0 ? r.iconSource : Ft, zt = Zt(o, Ie), P = Pt(), c = Pt();
+  ne(e, function() {
     return P.current;
   }, []);
-  var Vt = Pt(), Ft = kt(Vt, 2), Q = Ft[0], zt = Ft[1], jt = Pt(function() {
+  var jt = Ht(), Lt = Mt(jt, 2), Q = Lt[0], qt = Lt[1], Yt = Ht(function() {
     return N || _;
-  }), Lt = kt(jt, 2), X = Lt[0], qt = Lt[1];
+  }), Rt = Mt(Yt, 2), X = Rt[0], Jt = Rt[1];
   v(function() {
-    qt(N || _);
+    Jt(N || _);
   }, [N, _]);
   var H = Z(function() {
-    Ht() && zt(window.innerWidth <= 600);
+    xt() && qt(window.innerWidth <= 600);
   }, []);
   v(function() {
-    return Ht() ? (H(), window.addEventListener("resize", H), function() {
+    return xt() ? (H(), window.addEventListener("resize", H), function() {
       window.removeEventListener("resize", H);
     }) : function() {
     };
   }, [H]), v(function() {
-    return c.current = ye.attachTo(P.current), function() {
+    return c.current = Ae.attachTo(P.current), function() {
       c.current.destroy();
     };
   }, [c, P]), v(function() {
@@ -718,7 +725,7 @@ var f = Gt.strings, ye = (
   var x = Z(function(p) {
     j && j(p);
   }, [j]), $ = Z(function(p) {
-    J && ne(J), q && q(p);
+    J && ie(J), q && q(p);
   }, [J, q]);
   v(function() {
     return c.current.unlisten("MDCDialog: opening", k), c.current.listen("MDCDialog: opening", k), function() {
@@ -739,40 +746,41 @@ var f = Gt.strings, ye = (
   }, [c, $]), v(function() {
     St ? c.current.open() : c.current.close();
   }, [c, St]);
-  var Yt = nt(function() {
+  var Qt = nt(function() {
     return function() {
       var p = {
         className: "lmnt-modal__button mdc-dialog__button",
         elevation: n?.props.elevation !== "default" ? n?.props.elevation : "flat",
         variant: n?.props.variant || "filled"
       };
-      return b === "action" && (p["data-mdc-dialog-button-default"] = !0), I === "action" && (p["data-mdc-dialog-initial-focus"] = !0), p;
+      return T === "action" && (p["data-mdc-dialog-button-default"] = !0), I === "action" && (p["data-mdc-dialog-initial-focus"] = !0), p;
     };
-  }, [n?.props.elevation, n?.props.variant, b, I]), Jt = nt(function() {
+  }, [n?.props.elevation, n?.props.variant, T, I]), Xt = nt(function() {
     return function() {
       var p = {
         className: "lmnt-modal__button mdc-dialog__button",
         "data-mdc-dialog-action": At ? "" : "accept",
-        elevation: d?.props.elevation !== "default" ? d?.props.elevation : "flat",
-        variant: d?.props.variant || "filled"
+        elevation: u?.props.elevation !== "default" ? u?.props.elevation : "flat",
+        variant: u?.props.variant || "filled"
       };
-      return b === "primary" && (p["data-mdc-dialog-button-default"] = !0), I === "primary" && (p["data-mdc-dialog-initial-focus"] = !0), p;
+      return T === "primary" && (p["data-mdc-dialog-button-default"] = !0), I === "primary" && (p["data-mdc-dialog-initial-focus"] = !0), p;
     };
-  }, [At, b, I, d?.props.elevation, d?.props.variant]);
-  return /* @__PURE__ */ m.createElement("aside", Xt({
+  }, [At, T, I, u?.props.elevation, u?.props.variant]);
+  return /* @__PURE__ */ m.createElement("aside", te({
     ref: P,
     className: G("lmnt", "lmnt-modal", "mdc-dialog", Nt && "lmnt-modal--scrollable mdc-dialog--scrollable", W),
     role: "alertdialog"
-  }, Wt), /* @__PURE__ */ m.createElement("div", {
+  }, zt), /* @__PURE__ */ m.createElement("div", {
     className: G("lmnt-modal__container", "mdc-dialog__container", C === "fullscreen" && "mdc-dialog--fullscreen", C === "max" && "lmnt-modal__max", C === "xlarge" && "lmnt-modal__xl", C === "large" && "lmnt-modal__lg", C === "medium" && "lmnt-modal__md", C === "small" && "lmnt-modal__sm", (C === "mobile" || Q) && "lmnt-modal__mobile", C === "dialog" && "lmnt-modal__dialog", B && "lmnt-modal-no-actions")
   }, /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-modal__surface mdc-dialog__surface"
   }, /* @__PURE__ */ m.createElement("header", {
     className: G("lmnt-modal__title", "mdc-dialog__title", (C === "dialog" || V) && "lmnt-modal_title-hide-close-icon", a && "lmnt-modal_title-actionsIcons", Nt && "lmnt-modal__title-scrollable", (V || C === "dialog" || B) && "lmnt-modal--no-close-icon")
-  }, !V && C !== "dialog" && !B && /* @__PURE__ */ m.createElement($t, {
+  }, !V && C !== "dialog" && !B && /* @__PURE__ */ m.createElement(Ut, {
     className: "mdc-icon-button material-icons mdc-dialog__close",
     "data-mdc-dialog-action": "close",
-    icon: "clear"
+    icon: "clear",
+    iconSource: Vt
   }), Dt && /* @__PURE__ */ m.createElement("div", null, Dt), st && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__title-actions"
   }, st), h && /* @__PURE__ */ m.createElement("div", {
@@ -782,22 +790,22 @@ var f = Gt.strings, ye = (
     }
   }, h)), (L || F) && /* @__PURE__ */ m.createElement("section", {
     className: "lmnt-modal__content mdc-dialog__content"
-  }, L || F), Kt, (n || _ || R || N || d || w) && /* @__PURE__ */ m.createElement("footer", {
+  }, L || F), Wt, (n || _ || R || N || u || w) && /* @__PURE__ */ m.createElement("footer", {
     className: G("lmnt-modal__actions", "mdc-dialog__actions", Q && "lmnt-dialog__actions__mobile", w && "lmnt-modal__actions--supplemental-btn", Q && z && "lmnt-modal_actions-mobile-stacked")
   }, !X && w && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__actions__supplemental"
   }, D(w, function() {
     var p = {};
-    return b === "footerSupplemental" && (p["data-mdc-dialog-button-default"] = !0), I === "footerSupplemental" && (p["data-mdc-dialog-initial-focus"] = !0), p;
-  })), !X && (n || R || d) && /* @__PURE__ */ m.createElement("div", {
+    return T === "footerSupplemental" && (p["data-mdc-dialog-button-default"] = !0), I === "footerSupplemental" && (p["data-mdc-dialog-initial-focus"] = !0), p;
+  })), !X && (n || R || u) && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__actions__right-align lmnt-modal_actions_button"
   }, R && D(R, {
     variant: "text",
     className: "lmnt-modal__button mdc-dialog__button",
     "data-mdc-dialog-action": "close"
-  }), n && !d && D(n, Yt), d && D(d, Jt)), X && /* @__PURE__ */ m.createElement("div", {
+  }), n && !u && D(n, Qt), u && D(u, Xt)), X && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-modal_actions_button lmnt-dialog__actions__directional"
-  }, /* @__PURE__ */ m.createElement("div", null, oe(_, "lmnt-modal__button")), /* @__PURE__ */ m.createElement("div", null, D(N, {
+  }, /* @__PURE__ */ m.createElement("div", null, ae(_, "lmnt-modal__button")), /* @__PURE__ */ m.createElement("div", null, D(N, {
     className: "lmnt-modal__button",
     "data-mdc-dialog-initial-focus": !0
   })))))), /* @__PURE__ */ m.createElement("div", {
@@ -805,32 +813,32 @@ var f = Gt.strings, ye = (
   }));
 });
 ot.displayName = "Modal";
-ot.propTypes = Oe;
-const be = "_modal_1l955_1", Ie = "_gap_1l955_18", Ne = "_title_1l955_23", Be = "_titleWithoutCloseIcon_1l955_36", De = "_closeButton_1l955_40", Fe = "_errorBanner_1l955_52", y = {
-  modal: be,
-  gap: Ie,
-  title: Ne,
-  titleWithoutCloseIcon: Be,
-  closeButton: De,
-  errorBanner: Fe
-}, qe = ({
+ot.propTypes = be;
+const Ne = "_modal_1l955_1", Be = "_gap_1l955_18", De = "_title_1l955_23", Fe = "_titleWithoutCloseIcon_1l955_36", Le = "_closeButton_1l955_40", Re = "_errorBanner_1l955_52", y = {
+  modal: Ne,
+  gap: Be,
+  title: De,
+  titleWithoutCloseIcon: Fe,
+  closeButton: Le,
+  errorBanner: Re
+}, Je = ({
   onClose: o,
   title: e,
   headerActions: t,
   actionButton: n,
   hideCloseIcon: i,
   closeIcon: a = "close",
-  leadingIcon: u,
+  leadingIcon: d,
   isOnline: h = !0,
   offlineViewProps: O,
   children: _,
   errorBannerProps: { hasError: S, ...F } = { hasError: !1 },
-  ...T
+  ...b
 }) => {
   const W = nt(() => {
     const E = {
       id: "base",
-      action: /* @__PURE__ */ wt(
+      action: /* @__PURE__ */ kt(
         U,
         {
           primaryAlign: "center",
@@ -838,7 +846,7 @@ const be = "_modal_1l955_1", Ie = "_gap_1l955_18", Ne = "_title_1l955_23", Be =
           className: y.gap,
           children: [
             !i && /* @__PURE__ */ g(
-              $t,
+              Ut,
               {
                 icon: a,
                 onClick: () => o?.(),
@@ -846,12 +854,12 @@ const be = "_modal_1l955_1", Ie = "_gap_1l955_18", Ne = "_title_1l955_23", Be =
                 className: y.closeButton
               }
             ),
-            u ? /* @__PURE__ */ g(ue, { customPadding: "0.25rem 0 0 0.75rem", children: /* @__PURE__ */ g(pe, { icon: u }) }) : /* @__PURE__ */ g(Rt, {}),
+            d ? /* @__PURE__ */ g(fe, { customPadding: "0.25rem 0 0 0.75rem", children: /* @__PURE__ */ g(ge, { icon: d }) }) : /* @__PURE__ */ g(wt, {}),
             /* @__PURE__ */ g(
-              me,
+              pe,
               {
                 level: 6,
-                className: i && !u ? y.titleWithoutCloseIcon : "",
+                className: i && !d ? y.titleWithoutCloseIcon : "",
                 children: e
               }
             )
@@ -867,24 +875,24 @@ const be = "_modal_1l955_1", Ie = "_gap_1l955_18", Ne = "_title_1l955_23", Be =
       action: /* @__PURE__ */ g(U, { className: y.gap, children: t }, "action-group")
     };
     return [E, L];
-  }, [t, i, a, u, o, e]);
+  }, [t, i, a, d, o, e]);
   return /* @__PURE__ */ g(
     ot,
     {
-      ...T,
+      ...b,
       "data-testid": "modal",
-      className: `${y.modal} ${y.title} ${T.className ?? ""}`,
+      className: `${y.modal} ${y.title} ${b.className ?? ""}`,
       hideCloseIcon: !0,
       actionButton: n,
-      headerActions: /* @__PURE__ */ wt(U, { fullWidth: !0, gap: "none", direction: "vertical", children: [
-        /* @__PURE__ */ g(U, { fullWidth: !0, primaryAlign: "space-between", secondaryAlign: "center", children: W.map((E) => /* @__PURE__ */ g(ee, { children: E.action }, E.id)) }),
-        S && /* @__PURE__ */ g("div", { className: y.errorBanner, children: /* @__PURE__ */ g(fe, { ...F, isOpen: S }) })
+      headerActions: /* @__PURE__ */ kt(U, { fullWidth: !0, gap: "none", direction: "vertical", children: [
+        /* @__PURE__ */ g(U, { fullWidth: !0, primaryAlign: "space-between", secondaryAlign: "center", children: W.map((E) => /* @__PURE__ */ g(oe, { children: E.action }, E.id)) }),
+        S && /* @__PURE__ */ g("div", { className: y.errorBanner, children: /* @__PURE__ */ g(he, { ...F, isOpen: S }) })
       ] }, "header-group"),
       preventClose: !0,
-      children: h ? /* @__PURE__ */ g(Rt, { children: _ }) : /* @__PURE__ */ g(he, { ...O })
+      children: h ? /* @__PURE__ */ g(wt, { children: _ }) : /* @__PURE__ */ g(_e, { ...O })
     }
   );
 };
 export {
-  qe as Modal
+  Je as Modal
 };