@hortiview/shared-components 2.21.0 → 2.22.0

package/dist/components/Modal/Modal.js

@@ -1,37 +1,38 @@
-import { jsx as E, jsxs as Yt, Fragment as Jt } from "react/jsx-runtime";
-import { G as J } from "../../index.es-Z0aF-7Cn.js";
-import { I as Ht } from "../../index.es-CkB4776y.js";
-import { _ as Qt, a as Xt, c as x, P as l } from "../../index-Df2FYN-K.js";
-import { _ as Rt } from "../../slicedToArray-DC6VAZtW.js";
-import m, { forwardRef as Zt, useRef as wt, useImperativeHandle as te, useState as kt, useEffect as _, useCallback as Q, useMemo as tt, Fragment as ee } from "react";
-import { w as Mt, r as ne, c as D, a as oe } from "../../index.es-C6I3L4U4.js";
-import { b as xt, c as Pt, d as ie } from "../../tslib.es6-BDCynO9F.js";
+import { jsx as g, jsxs as Rt, Fragment as wt } from "react/jsx-runtime";
+import { G as X } from "../../index.es-Z0aF-7Cn.js";
+import { I as $t } from "../../index.es-CkB4776y.js";
+import { _ as Qt, a as Xt, c as U, P as l } 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 E, 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 se, c as le, m as ce } from "../../component-DYpB_4EP.js";
-import { A as ue } from "../../animationframe-CqXArbwZ.js";
-import { P as de } from "../../index.es-DgncYOqO.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 { Iconify as fe } from "../Iconify/Iconify.js";
-import { OfflineView as pe } from "../OfflineView/OfflineView.js";
-import '../../assets/Modal.css';function he(o, e, t) {
+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) {
   return e(o, { initialFocusEl: t });
 }
-function ge(o) {
+function _e(o) {
   return o ? o.scrollHeight > o.offsetHeight : !1;
 }
 function Ce(o) {
   return o ? o.scrollTop === 0 : !1;
 }
-function _e(o) {
+function Ee(o) {
   return o ? Math.ceil(o.scrollHeight - o.scrollTop) === o.clientHeight : !1;
 }
-function Ee(o) {
+function ve(o) {
   var e = /* @__PURE__ */ new Set();
   return [].forEach.call(o, function(t) {
     return e.add(t.offsetTop);
   }), e.size > 1;
 }
-var X = "mdc-dom-focus-sentinel", ve = (
+var tt = "mdc-dom-focus-sentinel", Se = (
   /** @class */
   (function() {
     function o(e, t) {
@@ -43,7 +44,7 @@ var X = "mdc-dom-focus-sentinel", ve = (
         throw new Error("FocusTrap: Element must have at least one focusable child.");
       this.elFocusedBeforeTrapFocus = document.activeElement instanceof HTMLElement ? document.activeElement : null, this.wrapTabFocus(this.root), this.options.skipInitialFocus || this.focusInitialElement(e, this.options.initialFocusEl);
     }, o.prototype.releaseFocus = function() {
-      [].slice.call(this.root.querySelectorAll("." + X)).forEach(function(e) {
+      [].slice.call(this.root.querySelectorAll("." + tt)).forEach(function(e) {
         e.parentElement.removeChild(e);
       }), !this.options.skipRestoreFocus && this.elFocusedBeforeTrapFocus && this.elFocusedBeforeTrapFocus.focus();
     }, o.prototype.wrapTabFocus = function(e) {
@@ -61,16 +62,16 @@ var X = "mdc-dom-focus-sentinel", ve = (
     }, 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(X) && !i, d = !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, u = !1;
         if (a) {
           var h = getComputedStyle(n);
-          d = h.display === "none" || h.visibility === "hidden";
+          u = h.display === "none" || h.visibility === "hidden";
         }
-        return a && !d;
+        return a && !u;
       });
     }, o.prototype.createSentinel = function() {
       var e = document.createElement("div");
-      return e.setAttribute("tabindex", "0"), e.setAttribute("aria-hidden", "true"), e.classList.add(X), e;
+      return e.setAttribute("tabindex", "0"), e.setAttribute("aria-hidden", "true"), e.classList.add(tt), e;
     }, o;
   })()
 );
@@ -107,7 +108,7 @@ var s = {
   // to prevent interactions with the content behind this scrim, and to capture
   // scrim clicks.
   SCRIM_HIDDEN: "mdc-dialog__scrim--hidden"
-}, O = {
+}, A = {
   ACTION_ATTRIBUTE: "data-mdc-dialog-action",
   BUTTON_DEFAULT_ATTRIBUTE: "data-mdc-dialog-button-default",
   BUTTON_SELECTOR: ".mdc-dialog__button",
@@ -127,21 +128,21 @@ var s = {
     ".mdc-menu .mdc-deprecated-list-item"
   ].join(", "),
   SURFACE_SELECTOR: ".mdc-dialog__surface"
-}, Z = {
+}, et = {
   DIALOG_ANIMATION_CLOSE_TIME_MS: 75,
   DIALOG_ANIMATION_OPEN_TIME_MS: 150
 };
-var $;
+var G;
 (function(o) {
   o.POLL_SCROLL_POS = "poll_scroll_position", o.POLL_LAYOUT_CHANGE = "poll_layout_change";
-})($ || ($ = {}));
-var $t = (
+})(G || (G = {}));
+var Gt = (
   /** @class */
   (function(o) {
-    xt(e, o);
+    Ut(e, o);
     function e(t) {
-      var n = o.call(this, Pt(Pt({}, e.defaultAdapter), t)) || this;
-      return n.dialogOpen = !1, n.isFullscreen = !1, n.animationFrame = 0, n.animationTimer = 0, n.escapeKeyAction = O.CLOSE_ACTION, n.scrimClickAction = O.CLOSE_ACTION, n.autoStackButtons = !0, n.areButtonsStacked = !1, n.suppressDefaultPressSelector = O.SUPPRESS_DEFAULT_PRESS_SELECTOR, n.animFrame = new ue(), n.contentScrollHandler = function() {
+      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() {
         n.handleScrollEvent();
       }, n.windowResizeHandler = function() {
         n.layout();
@@ -157,13 +158,13 @@ var $t = (
       configurable: !0
     }), Object.defineProperty(e, "strings", {
       get: function() {
-        return O;
+        return A;
       },
       enumerable: !1,
       configurable: !0
     }), Object.defineProperty(e, "numbers", {
       get: function() {
-        return Z;
+        return et;
       },
       enumerable: !1,
       configurable: !0
@@ -233,19 +234,19 @@ var $t = (
     }), e.prototype.init = function() {
       this.adapter.hasClass(s.STACKED) && this.setAutoStackButtons(!1), this.isFullscreen = this.adapter.hasClass(s.FULLSCREEN);
     }, e.prototype.destroy = function() {
-      this.dialogOpen && this.close(O.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);
+      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(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();
-        }, Z.DIALOG_ANIMATION_OPEN_TIME_MS);
+        }, 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(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);
-      }, Z.DIALOG_ANIMATION_CLOSE_TIME_MS));
+      }, et.DIALOG_ANIMATION_CLOSE_TIME_MS));
     }, e.prototype.showSurfaceScrim = function() {
       var t = this;
       this.adapter.addClass(s.SURFACE_SCRIM_SHOWING), this.runNextAnimationFrame(function() {
@@ -275,11 +276,11 @@ var $t = (
       this.suppressDefaultPressSelector = t;
     }, e.prototype.layout = function() {
       var t = this;
-      this.animFrame.request($.POLL_LAYOUT_CHANGE, function() {
+      this.animFrame.request(G.POLL_LAYOUT_CHANGE, function() {
         t.layoutInternal();
       });
     }, e.prototype.handleClick = function(t) {
-      var n = this.adapter.eventTargetMatches(t.target, O.SCRIM_SELECTOR);
+      var n = this.adapter.eventTargetMatches(t.target, A.SCRIM_SELECTOR);
       if (n && this.scrimClickAction !== "")
         this.close(this.scrimClickAction);
       else {
@@ -291,8 +292,8 @@ var $t = (
       if (n) {
         var i = this.adapter.getActionFromEvent(t);
         if (!i) {
-          var a = t.composedPath ? t.composedPath()[0] : t.target, d = this.suppressDefaultPressSelector ? !this.adapter.eventTargetMatches(a, this.suppressDefaultPressSelector) : !0;
-          n && d && this.adapter.clickDefaultButton();
+          var a = t.composedPath ? t.composedPath()[0] : t.target, u = this.suppressDefaultPressSelector ? !this.adapter.eventTargetMatches(a, this.suppressDefaultPressSelector) : !0;
+          n && u && this.adapter.clickDefaultButton();
         }
       }
     }, e.prototype.handleDocumentKeydown = function(t) {
@@ -300,7 +301,7 @@ var $t = (
       n && this.escapeKeyAction !== "" && this.close(this.escapeKeyAction);
     }, e.prototype.handleScrollEvent = function() {
       var t = this;
-      this.animFrame.request($.POLL_SCROLL_POS, function() {
+      this.animFrame.request(G.POLL_SCROLL_POS, function() {
         t.toggleScrollDividerHeader(), t.toggleScrollDividerFooter();
       });
     }, e.prototype.layoutInternal = function() {
@@ -325,10 +326,10 @@ var $t = (
     }, e;
   })(ae)
 );
-var f = $t.strings, Se = (
+var f = Gt.strings, ye = (
   /** @class */
   (function(o) {
-    xt(e, o);
+    Ut(e, o);
     function e() {
       return o !== null && o.apply(this, arguments) || this;
     }
@@ -369,30 +370,30 @@ var f = $t.strings, Se = (
       return new e(t);
     }, e.prototype.initialize = function(t) {
       var n, i;
-      t === void 0 && (t = function(g, S) {
-        return new ve(g, S);
+      t === void 0 && (t = function(_, S) {
+        return new Se(_, 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 d = ie(this.buttons), h = d.next(); !h.done; h = d.next()) {
-          var y = h.value;
-          this.buttonRipples.push(new se(y));
+        for (var u = ie(this.buttons), h = u.next(); !h.done; h = u.next()) {
+          var O = h.value;
+          this.buttonRipples.push(new se(O));
         }
-      } catch (g) {
-        n = { error: g };
+      } catch (_) {
+        n = { error: _ };
       } finally {
         try {
-          h && !h.done && (i = d.return) && i.call(d);
+          h && !h.done && (i = u.return) && i.call(u);
         } finally {
           if (n) throw n.error;
         }
       }
     }, e.prototype.initialSyncWithDOM = function() {
       var t = this;
-      this.focusTrap = he(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 = 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() {
         document.addEventListener("keydown", t.handleDocumentKeydown);
       }, this.handleClosing = function() {
         document.removeEventListener("keydown", t.handleDocumentKeydown);
@@ -416,7 +417,7 @@ var f = $t.strings, Se = (
           return t.root.classList.add(i);
         },
         areButtonsStacked: function() {
-          return Ee(t.buttons);
+          return ve(t.buttons);
         },
         clickDefaultButton: function() {
           t.defaultButton && t.defaultButton.click();
@@ -437,7 +438,7 @@ var f = $t.strings, Se = (
           return t.root.classList.contains(i);
         },
         isContentScrollable: function() {
-          return ge(t.content);
+          return _e(t.content);
         },
         notifyClosed: function(i) {
           return t.emit(f.CLOSED_EVENT, i ? { action: i } : {});
@@ -478,7 +479,7 @@ var f = $t.strings, Se = (
           return Ce(t.content);
         },
         isScrollableContentAtBottom: function() {
-          return _e(t.content);
+          return Ee(t.content);
         },
         registerWindowEventHandler: function(i, a) {
           window.addEventListener(i, a);
@@ -487,12 +488,12 @@ var f = $t.strings, Se = (
           window.removeEventListener(i, a);
         }
       };
-      return new $t(n);
+      return new Gt(n);
     }, e.prototype.getInitialFocusEl = function() {
       return this.root.querySelector("[" + f.INITIAL_FOCUS_ATTRIBUTE + "]");
     }, e;
   })(re)
-), ye = {
+), Oe = {
   /**
    * 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.
    *
@@ -655,7 +656,7 @@ var f = $t.strings, Se = (
    * Defaults to **null**.
    */
   title: l.string
-}, Oe = {
+}, Ae = {
   actionButton: null,
   backButton: null,
   badge: void 0,
@@ -683,172 +684,174 @@ var f = $t.strings, Se = (
   returnFocusSelector: null,
   scrollable: !1,
   title: null
-}, Ae = ["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 = Oe, et = /* @__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, d = o.badge, h = d === void 0 ? r.badge : d, y = o.backButton, g = y === void 0 ? r.backButton : y, S = o.children, B = S === void 0 ? r.children : S, v = o.className, U = v === void 0 ? r.className : v, nt = o.content, ot = nt === void 0 ? r.content : nt, it = o.defaultButton, T = it === void 0 ? r.defaultButton : it, at = o.dismissiveButton, F = at === void 0 ? r.dismissiveButton : at, rt = o.footerSupplemental, L = rt === void 0 ? r.footerSupplemental : rt, st = o.headerActions, lt = st === void 0 ? r.headerActions : st, ct = o.hideCloseIcon, G = ct === void 0 ? r.hideCloseIcon : ct, ut = o.indicator, Ut = ut === void 0 ? r.indicator : ut, dt = o.initialFocus, b = dt === void 0 ? r.initialFocus : dt, mt = o.mobileStackedButtons, K = mt === void 0 ? r.mobileStackedButtons : mt, ft = o.modalSize, C = ft === void 0 ? r.modalSize : ft, pt = o.nextButton, I = pt === void 0 ? r.nextButton : pt, ht = o.noActions, N = ht === void 0 ? r.noActions : ht, gt = o.onClose, W = gt === void 0 ? r.onClose : gt, Ct = o.onClosed, V = Ct === void 0 ? r.onClosed : Ct, _t = o.onOpen, R = _t === void 0 ? r.onOpen : _t, Et = o.onOpened, w = Et === void 0 ? r.onOpened : Et, vt = o.open, St = vt === void 0 ? r.open : vt, yt = o.preventClose, z = yt === void 0 ? r.preventClose : yt, Ot = o.preventPrimaryAccept, At = Ot === void 0 ? r.preventPrimaryAccept : Ot, Tt = o.primaryButton, u = 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, Dt = o.title, Bt = Dt === void 0 ? r.title : Dt, Gt = Qt(o, Ae), k = wt(), c = wt();
+}, 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, K = T === void 0 ? r.className : T, v = o.content, L = v === void 0 ? r.content : v, 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, st = o.headerActions, lt = st === void 0 ? r.headerActions : st, ct = o.hideCloseIcon, W = 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, V = 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, z = gt === void 0 ? r.onClose : gt, _t = o.onClosed, j = _t === void 0 ? r.onClosed : _t, Ct = o.onOpen, k = Ct === void 0 ? r.onOpen : Ct, Et = o.onOpened, M = Et === void 0 ? r.onOpened : Et, vt = o.open, St = vt === void 0 ? r.open : vt, yt = o.preventClose, q = 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, Y = 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() {
-    return k.current;
+    return P.current;
   }, []);
-  var Kt = kt(), Ft = Rt(Kt, 2), q = Ft[0], Wt = Ft[1], Vt = kt(function() {
-    return I || g;
-  }), Lt = Rt(Vt, 2), Y = Lt[0], zt = Lt[1];
-  _(function() {
-    zt(I || g);
-  }, [I, g]);
-  var M = Q(function() {
-    Mt() && Wt(window.innerWidth <= 600);
+  var Vt = Pt(), Ft = kt(Vt, 2), J = Ft[0], zt = Ft[1], jt = Pt(function() {
+    return N || _;
+  }), Lt = kt(jt, 2), Q = Lt[0], qt = Lt[1];
+  E(function() {
+    qt(N || _);
+  }, [N, _]);
+  var H = Z(function() {
+    Ht() && zt(window.innerWidth <= 600);
   }, []);
-  _(function() {
-    return Mt() ? (M(), window.addEventListener("resize", M), function() {
-      window.removeEventListener("resize", M);
+  E(function() {
+    return Ht() ? (H(), window.addEventListener("resize", H), function() {
+      window.removeEventListener("resize", H);
     }) : function() {
     };
-  }, [M]), _(function() {
-    return c.current = Se.attachTo(k.current), function() {
+  }, [H]), E(function() {
+    return c.current = ye.attachTo(P.current), function() {
       c.current.destroy();
     };
-  }, [c, k]), _(function() {
-    c.current.foundation.setAutoStackButtons(K);
-  }, [K]), _(function() {
-    N && (c.current.foundation.adapter.trapFocus = function() {
+  }, [c, P]), E(function() {
+    c.current.foundation.setAutoStackButtons(V);
+  }, [V]), E(function() {
+    B && (c.current.foundation.adapter.trapFocus = function() {
     });
-  }, [N]), _(function() {
-    c.current.scrimClickAction = z ? "" : "close", c.current.escapeKeyAction = z ? "" : "close";
-  }, [z]);
-  var P = Q(function(p) {
-    W && W(p);
-  }, [W]), H = Q(function(p) {
-    j && ne(j), V && V(p);
-  }, [j, V]);
-  _(function() {
-    return c.current.unlisten("MDCDialog: opening", R), c.current.listen("MDCDialog: opening", R), function() {
-      c.current.unlisten("MDCDialog: opening", R);
+  }, [B]), E(function() {
+    c.current.scrimClickAction = q ? "" : "close", c.current.escapeKeyAction = q ? "" : "close";
+  }, [q]);
+  var x = Z(function(p) {
+    z && z(p);
+  }, [z]), $ = Z(function(p) {
+    Y && ne(Y), j && j(p);
+  }, [Y, j]);
+  E(function() {
+    return c.current.unlisten("MDCDialog: opening", k), c.current.listen("MDCDialog: opening", k), function() {
+      c.current.unlisten("MDCDialog: opening", k);
     };
-  }, [c, R]), _(function() {
-    return c.current.unlisten("MDCDialog:opened", w), c.current.listen("MDCDialog:opened", w), function() {
-      c.current.unlisten("MDCDialog:opened", w);
+  }, [c, k]), E(function() {
+    return c.current.unlisten("MDCDialog:opened", M), c.current.listen("MDCDialog:opened", M), function() {
+      c.current.unlisten("MDCDialog:opened", M);
     };
-  }, [c, w]), _(function() {
-    return c.current.unlisten("MDCDialog:closing", P), c.current.listen("MDCDialog:closing", P), function() {
-      c.current.unlisten("MDCDialog:closing", P);
+  }, [c, M]), E(function() {
+    return c.current.unlisten("MDCDialog:closing", x), c.current.listen("MDCDialog:closing", x), function() {
+      c.current.unlisten("MDCDialog:closing", x);
     };
-  }, [c, P]), _(function() {
-    return c.current.unlisten("MDCDialog:closed", H), c.current.listen("MDCDialog:closed", H), function() {
-      c.current.unlisten("MDCDialog:closed", H);
+  }, [c, x]), E(function() {
+    return c.current.unlisten("MDCDialog:closed", $), c.current.listen("MDCDialog:closed", $), function() {
+      c.current.unlisten("MDCDialog:closed", $);
     };
-  }, [c, H]), _(function() {
+  }, [c, $]), E(function() {
     St ? c.current.open() : c.current.close();
   }, [c, St]);
-  var jt = tt(function() {
+  var Yt = 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 T === "action" && (p["data-mdc-dialog-button-default"] = !0), b === "action" && (p["data-mdc-dialog-initial-focus"] = !0), p;
+      return b === "action" && (p["data-mdc-dialog-button-default"] = !0), I === "action" && (p["data-mdc-dialog-initial-focus"] = !0), p;
     };
-  }, [n?.props.elevation, n?.props.variant, T, b]), qt = tt(function() {
+  }, [n?.props.elevation, n?.props.variant, b, I]), Jt = nt(function() {
     return function() {
       var p = {
         className: "lmnt-modal__button mdc-dialog__button",
         "data-mdc-dialog-action": At ? "" : "accept",
-        elevation: u?.props.elevation !== "default" ? u?.props.elevation : "flat",
-        variant: u?.props.variant || "filled"
+        elevation: d?.props.elevation !== "default" ? d?.props.elevation : "flat",
+        variant: d?.props.variant || "filled"
       };
-      return T === "primary" && (p["data-mdc-dialog-button-default"] = !0), b === "primary" && (p["data-mdc-dialog-initial-focus"] = !0), p;
+      return b === "primary" && (p["data-mdc-dialog-button-default"] = !0), I === "primary" && (p["data-mdc-dialog-initial-focus"] = !0), p;
     };
-  }, [At, T, b, u?.props.elevation, u?.props.variant]);
+  }, [At, b, I, d?.props.elevation, d?.props.variant]);
   return /* @__PURE__ */ m.createElement("aside", Xt({
-    ref: k,
-    className: x("lmnt", "lmnt-modal", "mdc-dialog", Nt && "lmnt-modal--scrollable mdc-dialog--scrollable", U),
+    ref: P,
+    className: U("lmnt", "lmnt-modal", "mdc-dialog", Nt && "lmnt-modal--scrollable mdc-dialog--scrollable", K),
     role: "alertdialog"
-  }, Gt), /* @__PURE__ */ m.createElement("div", {
-    className: x("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", N && "lmnt-modal-no-actions")
+  }, Wt), /* @__PURE__ */ m.createElement("div", {
+    className: U("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" || J) && "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: x("lmnt-modal__title", "mdc-dialog__title", (C === "dialog" || G) && "lmnt-modal_title-hide-close-icon", a && "lmnt-modal_title-actionsIcons", Nt && "lmnt-modal__title-scrollable", (G || C === "dialog" || N) && "lmnt-modal--no-close-icon")
-  }, !G && C !== "dialog" && !N && /* @__PURE__ */ m.createElement(Ht, {
+    className: U("lmnt-modal__title", "mdc-dialog__title", (C === "dialog" || W) && "lmnt-modal_title-hide-close-icon", a && "lmnt-modal_title-actionsIcons", Nt && "lmnt-modal__title-scrollable", (W || C === "dialog" || B) && "lmnt-modal--no-close-icon")
+  }, !W && C !== "dialog" && !B && /* @__PURE__ */ m.createElement($t, {
     className: "mdc-icon-button material-icons mdc-dialog__close",
     "data-mdc-dialog-action": "close",
     icon: "clear"
-  }), Bt && /* @__PURE__ */ m.createElement("div", null, Bt), lt && /* @__PURE__ */ m.createElement("div", {
+  }), Dt && /* @__PURE__ */ m.createElement("div", null, Dt), lt && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__title-actions"
   }, lt), h && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-badge--modal",
     style: {
       marginLeft: "0"
     }
-  }, h)), (ot || B) && /* @__PURE__ */ m.createElement("section", {
+  }, h)), (L || F) && /* @__PURE__ */ m.createElement("section", {
     className: "lmnt-modal__content mdc-dialog__content"
-  }, ot || B), Ut, (n || g || F || I || u || L) && /* @__PURE__ */ m.createElement("footer", {
-    className: x("lmnt-modal__actions", "mdc-dialog__actions", q && "lmnt-dialog__actions__mobile", L && "lmnt-modal__actions--supplemental-btn", q && K && "lmnt-modal_actions-mobile-stacked")
-  }, !Y && L && /* @__PURE__ */ m.createElement("div", {
+  }, L || F), Kt, (n || _ || R || N || d || w) && /* @__PURE__ */ m.createElement("footer", {
+    className: U("lmnt-modal__actions", "mdc-dialog__actions", J && "lmnt-dialog__actions__mobile", w && "lmnt-modal__actions--supplemental-btn", J && V && "lmnt-modal_actions-mobile-stacked")
+  }, !Q && w && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__actions__supplemental"
-  }, D(L, function() {
+  }, D(w, function() {
     var p = {};
-    return T === "footerSupplemental" && (p["data-mdc-dialog-button-default"] = !0), b === "footerSupplemental" && (p["data-mdc-dialog-initial-focus"] = !0), p;
-  })), !Y && (n || F || u) && /* @__PURE__ */ m.createElement("div", {
+    return b === "footerSupplemental" && (p["data-mdc-dialog-button-default"] = !0), I === "footerSupplemental" && (p["data-mdc-dialog-initial-focus"] = !0), p;
+  })), !Q && (n || R || d) && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__actions__right-align lmnt-modal_actions_button"
-  }, F && D(F, {
+  }, R && D(R, {
     variant: "text",
     className: "lmnt-modal__button mdc-dialog__button",
     "data-mdc-dialog-action": "close"
-  }), n && !u && D(n, jt), u && D(u, qt)), Y && /* @__PURE__ */ m.createElement("div", {
+  }), n && !d && D(n, Yt), d && D(d, Jt)), Q && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-modal_actions_button lmnt-dialog__actions__directional"
-  }, /* @__PURE__ */ m.createElement("div", null, oe(g, "lmnt-modal__button")), /* @__PURE__ */ m.createElement("div", null, D(I, {
+  }, /* @__PURE__ */ m.createElement("div", null, oe(_, "lmnt-modal__button")), /* @__PURE__ */ m.createElement("div", null, D(N, {
     className: "lmnt-modal__button",
     "data-mdc-dialog-initial-focus": !0
   })))))), /* @__PURE__ */ m.createElement("div", {
     className: "mdc-dialog__scrim"
   }));
 });
-et.displayName = "Modal";
-et.propTypes = ye;
-const Te = "_modal_mu9y6_1", be = "_gap_mu9y6_14", Ie = "_title_mu9y6_18", Ne = "_titleWithoutCloseIcon_mu9y6_31", De = "_closeButton_mu9y6_35", A = {
-  modal: Te,
-  gap: be,
-  title: Ie,
-  titleWithoutCloseIcon: Ne,
-  closeButton: De
-}, Ve = ({
+ot.displayName = "Modal";
+ot.propTypes = Oe;
+const be = "_modal_1yn30_1", Ie = "_gap_1yn30_14", Ne = "_title_1yn30_18", Be = "_titleWithoutCloseIcon_1yn30_31", De = "_closeButton_1yn30_35", Fe = "_errorBanner_1yn30_47", y = {
+  modal: be,
+  gap: Ie,
+  title: Ne,
+  titleWithoutCloseIcon: Be,
+  closeButton: De,
+  errorBanner: Fe
+}, qe = ({
   onClose: o,
   title: e,
   headerActions: t,
   actionButton: n,
   hideCloseIcon: i,
   closeIcon: a = "close",
-  leadingIcon: d,
+  leadingIcon: u,
   isOnline: h = !0,
-  offlineViewProps: y,
-  children: g,
-  ...S
+  offlineViewProps: O,
+  children: _,
+  errorBannerProps: { hasError: S, ...F } = { hasError: !1 },
+  ...T
 }) => {
-  const B = tt(() => {
+  const K = nt(() => {
     const v = {
       id: "base",
-      action: /* @__PURE__ */ Yt(
-        J,
+      action: /* @__PURE__ */ Rt(
+        X,
         {
           primaryAlign: "center",
           secondaryAlign: "center",
-          className: A.gap,
+          className: y.gap,
           children: [
-            !i && /* @__PURE__ */ E(
-              Ht,
+            !i && /* @__PURE__ */ g(
+              $t,
               {
                 icon: a,
                 onClick: () => o?.(),
                 type: "button",
-                className: A.closeButton
+                className: y.closeButton
               }
             ),
-            d ? /* @__PURE__ */ E(de, { customPadding: "0.25rem 0 0 0.75rem", children: /* @__PURE__ */ E(fe, { icon: d }) }) : /* @__PURE__ */ E(Jt, {}),
-            /* @__PURE__ */ E(
+            u ? /* @__PURE__ */ g(ue, { customPadding: "0.25rem 0 0 0.75rem", children: /* @__PURE__ */ g(pe, { icon: u }) }) : /* @__PURE__ */ g(wt, {}),
+            /* @__PURE__ */ g(
               me,
               {
                 level: 6,
-                className: i && !d ? A.titleWithoutCloseIcon : "",
+                className: i && !u ? y.titleWithoutCloseIcon : "",
                 children: e
               }
             )
@@ -859,26 +862,29 @@ const Te = "_modal_mu9y6_1", be = "_gap_mu9y6_14", Ie = "_title_mu9y6_18", Ne =
     };
     if (!t) return [v];
     if (!Array.isArray(t)) return [v, { id: "action", action: t }];
-    const U = {
+    const L = {
       id: "action-group",
-      action: /* @__PURE__ */ E(J, { className: A.gap, children: t }, "action-group")
+      action: /* @__PURE__ */ g(X, { className: y.gap, children: t }, "action-group")
     };
-    return [v, U];
-  }, [t, i, a, d, o, e]);
-  return /* @__PURE__ */ E(
-    et,
+    return [v, L];
+  }, [t, i, a, u, o, e]);
+  return /* @__PURE__ */ g(
+    ot,
     {
-      ...S,
+      ...T,
       "data-testid": "modal",
-      className: `${A.modal} ${A.title} ${S.className ?? ""}`,
+      className: `${y.modal} ${y.title} ${T.className ?? ""}`,
       hideCloseIcon: !0,
       actionButton: n,
-      headerActions: /* @__PURE__ */ E(J, { primaryAlign: "space-between", secondaryAlign: "center", children: B.map((v) => /* @__PURE__ */ E(ee, { children: v.action }, v.id)) }, "header-group"),
+      headerActions: /* @__PURE__ */ g(X, { primaryAlign: "space-between", secondaryAlign: "center", children: K.map((v) => /* @__PURE__ */ g(ee, { children: v.action }, v.id)) }, "header-group"),
       preventClose: !0,
-      children: h ? g : /* @__PURE__ */ E(pe, { ...y })
+      children: h ? /* @__PURE__ */ Rt(wt, { children: [
+        S && /* @__PURE__ */ g("div", { className: y.errorBanner, children: /* @__PURE__ */ g(fe, { ...F, isOpen: S }) }),
+        _
+      ] }) : /* @__PURE__ */ g(he, { ...O })
     }
   );
 };
 export {
-  Ve as Modal
+  qe as Modal
 };