@justeattakeaway/pie-modal 0.21.0 → 0.22.0

package/dist/index.js

@@ -1,192 +1,115 @@
-import { css as B, LitElement as L, html as F, nothing as u, unsafeCSS as pe } from "lit";
-import { html as g, unsafeStatic as ge } from "lit/static-html.js";
-import { property as s, query as I } from "lit/decorators.js";
-import { property as me } from "lit/decorators/property.js";
-var fe = Object.defineProperty, ve = Object.getOwnPropertyDescriptor, be = (e, t, o, i) => {
-  for (var n = i > 1 ? void 0 : i ? ve(t, o) : t, a = e.length - 1, r; a >= 0; a--)
-    (r = e[a]) && (n = (i ? r(t, o, n) : r(n)) || n);
-  return i && n && fe(t, o, n), n;
-};
-const ye = (e) => {
-  class t extends e {
-    constructor() {
-      var i;
-      super(...arguments), this.dir = ((i = document == null ? void 0 : document.documentElement) == null ? void 0 : i.dir) ?? "ltr";
-    }
+import { isServer as te, css as I, LitElement as O, html as M, unsafeCSS as ie, nothing as c } from "lit";
+import { html as p, unsafeStatic as oe } from "lit/static-html.js";
+import { property as r, query as $ } from "lit/decorators.js";
+const ne = (n) => {
+  class e extends n {
     /**
-     * Returns true if the element is in Right to Left mode.
-     * If a dir attribute is not explicitly set on the web component
-     * then it falls back to the nearest parent with a dir attribute set.
+     * A getter to determine whether the text direction is right-to-left (RTL).
+     * If the `dir` property is present on the component, it will be used to determine the text direction.
+     * If running on the client-side (not SSR) and the `dir` property is not present, the text direction will be inferred
+     * from the document's root element. This inference is not available during SSR.
+     * In all other cases, it will return `false`, indicating a left-to-right (LTR) text direction.
      *
-     * A dir attribute being set will result in a reactive property.
-     * If the component falls back to a parent dir attribute then the value
-     * will not be reactive and is only computed once
+     * @returns {boolean} - Returns `true` if the text direction is RTL, otherwise `false`.
      */
     get isRTL() {
-      return this.dir === "rtl";
+      return this.dir ? this.dir === "rtl" : !te && !this.dir ? document.documentElement.getAttribute("dir") === "rtl" : !1;
     }
   }
-  return be([
-    me({ type: String, reflect: !0 })
-  ], t.prototype, "dir", 2), t;
-}, N = (e, t, o) => function(n, a) {
-  const r = `#${a}`;
-  Object.defineProperty(n, a, {
+  return e;
+}, E = (n, e, t) => function(o, a) {
+  const l = `#${a}`;
+  Object.defineProperty(o, a, {
     get() {
-      return this[r];
+      return this[l];
     },
     set(h) {
-      const p = this[r];
-      t.includes(h) ? this[r] = h : (console.error(
-        `<${e}> Invalid value "${h}" provided for property "${a}".`,
-        `Must be one of: ${t.join(" | ")}.`,
-        `Falling back to default value: "${o}"`
-      ), this[r] = o), this.requestUpdate(a, p);
+      const u = this[l];
+      e.includes(h) ? this[l] = h : (console.error(
+        `<${n}> Invalid value "${h}" provided for property "${a}".`,
+        `Must be one of: ${e.join(" | ")}.`,
+        `Falling back to default value: "${t}"`
+      ), this[l] = t), this.requestUpdate(a, u);
     }
   });
-}, we = (e) => function(o, i) {
-  const n = `#${i}`;
-  Object.defineProperty(o, i, {
+}, ae = (n) => function(t, i) {
+  const o = `#${i}`;
+  Object.defineProperty(t, i, {
     get() {
-      return this[n];
+      return this[o];
     },
     set(a) {
-      const r = this[n];
-      (a == null || typeof a == "string" && a.trim() === "") && console.error(`<${e}> Missing required attribute "${i}"`), this[n] = a, this.requestUpdate(i, r);
+      const l = this[o];
+      (a == null || typeof a == "string" && a.trim() === "") && console.error(`<${n}> Missing required attribute "${i}"`), this[o] = a, this.requestUpdate(i, l);
     }
   });
-};
-function _e(e) {
-  if (Array.isArray(e)) {
-    for (var t = 0, o = Array(e.length); t < e.length; t++)
-      o[t] = e[t];
-    return o;
-  } else
-    return Array.from(e);
-}
-var R = !1;
-if (typeof window < "u") {
-  var W = {
-    get passive() {
-      R = !0;
-    }
-  };
-  window.addEventListener("testPassive", null, W), window.removeEventListener("testPassive", null, W);
-}
-var G = typeof window < "u" && window.navigator && window.navigator.platform && (/iP(ad|hone|od)/.test(window.navigator.platform) || window.navigator.platform === "MacIntel" && window.navigator.maxTouchPoints > 1), m = [], S = !1, J = -1, w = void 0, _ = void 0, Q = function(t) {
-  return m.some(function(o) {
-    return !!(o.options.allowTouchMove && o.options.allowTouchMove(t));
-  });
-}, O = function(t) {
-  var o = t || window.event;
-  return Q(o.target) || o.touches.length > 1 ? !0 : (o.preventDefault && o.preventDefault(), !1);
-}, ke = function(t) {
-  if (_ === void 0) {
-    var o = !!t && t.reserveScrollBarGap === !0, i = window.innerWidth - document.documentElement.clientWidth;
-    o && i > 0 && (_ = document.body.style.paddingRight, document.body.style.paddingRight = i + "px");
-  }
-  w === void 0 && (w = document.body.style.overflow, document.body.style.overflow = "hidden");
-}, xe = function() {
-  _ !== void 0 && (document.body.style.paddingRight = _, _ = void 0), w !== void 0 && (document.body.style.overflow = w, w = void 0);
-}, Ee = function(t) {
-  return t ? t.scrollHeight - t.scrollTop <= t.clientHeight : !1;
-}, Me = function(t, o) {
-  var i = t.targetTouches[0].clientY - J;
-  return Q(t.target) ? !1 : o && o.scrollTop === 0 && i > 0 || Ee(o) && i < 0 ? O(t) : (t.stopPropagation(), !0);
-}, Ce = function(t, o) {
-  if (!t) {
-    console.error("disableBodyScroll unsuccessful - targetElement must be provided when calling disableBodyScroll on IOS devices.");
-    return;
-  }
-  if (!m.some(function(n) {
-    return n.targetElement === t;
-  })) {
-    var i = {
-      targetElement: t,
-      options: o || {}
-    };
-    m = [].concat(_e(m), [i]), G ? (t.ontouchstart = function(n) {
-      n.targetTouches.length === 1 && (J = n.targetTouches[0].clientY);
-    }, t.ontouchmove = function(n) {
-      n.targetTouches.length === 1 && Me(n, t);
-    }, S || (document.addEventListener("touchmove", O, R ? { passive: !1 } : void 0), S = !0)) : ke(o);
-  }
-}, ze = function(t) {
-  if (!t) {
-    console.error("enableBodyScroll unsuccessful - targetElement must be provided when calling enableBodyScroll on IOS devices.");
-    return;
-  }
-  m = m.filter(function(o) {
-    return o.targetElement !== t;
-  }), G ? (t.ontouchstart = null, t.ontouchmove = null, S && m.length === 0 && (document.removeEventListener("touchmove", O, R ? { passive: !1 } : void 0), S = !1)) : m.length || xe();
-};
-const A = {
+}, _ = {
   xs: 16,
   s: 20,
   m: 24,
   l: 28,
   xl: 32,
   xxl: 40
-}, ee = Object.keys(A), te = "xs", oe = 8, D = 32;
-function Se(e, t, o) {
-  const i = parseInt(e, 10), n = i % o === 0;
-  return i >= t && n;
+}, W = Object.keys(_), Y = "xs", U = 8, z = 32;
+function le(n, e, t) {
+  const i = parseInt(n, 10), o = i % t === 0;
+  return i >= e && o;
 }
-const ie = {
-  large: (e) => Se(e, D, oe),
-  regular: (e) => ee.includes(e)
+const H = {
+  large: (n) => le(n, z, U),
+  regular: (n) => W.includes(n)
 };
-function Oe(e) {
-  const t = ie.large(e);
-  return { isValid: t, size: t ? e : D };
+function re(n) {
+  const e = H.large(n);
+  return { isValid: e, size: e ? n : z };
 }
-function Ae(e) {
-  const t = ie.regular(e), o = t ? A[e] : A[te];
-  return { isValid: t, size: o };
+function se(n) {
+  const e = H.regular(n), t = e ? _[n] : _[Y];
+  return { isValid: e, size: t };
 }
-const b = (e, t, o, i) => {
-  const n = e.endsWith("Large") || e.endsWith("-large");
-  let a, r;
-  if (o) {
-    if ({ isValid: a, size: r } = n ? Oe(o) : Ae(o), !a) {
-      const h = n ? `Invalid prop "size" value supplied to "${i}". The prop value should be a number equal or greater than ${D} and multiple of ${oe}.` : `Invalid prop "size" value supplied to "${i}". The prop value should be one of the following values: ${ee.join(", ")}.`;
+const m = (n, e, t, i) => {
+  const o = n.endsWith("Large") || n.endsWith("-large");
+  let a, l;
+  if (t) {
+    if ({ isValid: a, size: l } = o ? re(t) : se(t), !a) {
+      const h = o ? `Invalid prop "size" value supplied to "${i}". The prop value should be a number equal or greater than ${z} and multiple of ${U}.` : `Invalid prop "size" value supplied to "${i}". The prop value should be one of the following values: ${W.join(", ")}.`;
       console.error(h);
     }
   } else
-    r = n ? D : A[te];
+    l = o ? z : _[Y];
   return {
-    class: [e, t].filter(Boolean).join(" "),
-    width: r,
-    height: r
+    class: [n, e].filter(Boolean).join(" "),
+    width: l,
+    height: l
   };
 };
-var De = Object.defineProperty, Le = Object.getOwnPropertyDescriptor, j = (e, t, o, i) => {
-  for (var n = i > 1 ? void 0 : i ? Le(t, o) : t, a = e.length - 1, r; a >= 0; a--)
-    (r = e[a]) && (n = (i ? r(t, o, n) : r(n)) || n);
-  return i && n && De(t, o, n), n;
+var de = Object.defineProperty, ce = Object.getOwnPropertyDescriptor, P = (n, e, t, i) => {
+  for (var o = i > 1 ? void 0 : i ? ce(e, t) : e, a = n.length - 1, l; a >= 0; a--)
+    (l = n[a]) && (o = (i ? l(e, t, o) : l(o)) || o);
+  return i && o && de(e, t, o), o;
 };
-const U = "icon-close";
-let x = class extends L {
+const R = "icon-close";
+let b = class extends O {
   constructor() {
     super(...arguments), this.size = "xs", this.class = "c-pieIcon c-pieIcon--close";
   }
   connectedCallback() {
-    var t, o, i;
-    if (super.connectedCallback(), ((t = this._svg) == null ? void 0 : t.getAttribute("width")) === null) {
-      const n = b("c-pieIcon c-pieIcon--close", "", null, "IconClose");
-      (o = this._svg) == null || o.setAttribute("width", n.width), (i = this._svg) == null || i.setAttribute("height", n.height);
+    var e, t, i;
+    if (super.connectedCallback(), ((e = this._svg) == null ? void 0 : e.getAttribute("width")) === null) {
+      const o = m("c-pieIcon c-pieIcon--close", "", null, "IconClose");
+      (t = this._svg) == null || t.setAttribute("width", o.width), (i = this._svg) == null || i.setAttribute("height", o.height);
     }
   }
-  updated(t) {
-    var o, i;
-    let n;
-    t.has("size") && (n = b("c-pieIcon c-pieIcon--close", "", this.size, "IconClose"), (o = this._svg) == null || o.setAttribute("width", n.width), (i = this._svg) == null || i.setAttribute("height", n.height));
+  updated(e) {
+    var t, i;
+    let o;
+    e.has("size") && (o = m("c-pieIcon c-pieIcon--close", "", this.size, "IconClose"), (t = this._svg) == null || t.setAttribute("width", o.width), (i = this._svg) == null || i.setAttribute("height", o.height));
   }
   render() {
-    return F`<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--close"><path d="M11.868 3.205 8 7.072 4.133 3.205l-.928.927L7.073 8l-3.868 3.867.928.928L8 8.927l3.868 3.868.927-.928L8.928 8l3.867-3.868-.927-.927Z"></path></svg>`;
+    return M`<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--close"><path d="M11.868 3.205 8 7.072 4.133 3.205l-.928.927L7.073 8l-3.868 3.867.928.928L8 8.927l3.868 3.868.927-.928L8.928 8l3.867-3.868-.927-.927Z"></path></svg>`;
   }
 };
-x.styles = B`
+b.styles = I`
         :host-context(pie-icon-button) svg,
         :host-context(pie-button) svg {
             display: block;
@@ -194,43 +117,43 @@ x.styles = B`
             height: var(--btn-icon-size);
         }
     `;
-j([
-  s({ type: String, reflect: !0 })
-], x.prototype, "size", 2);
-j([
-  s({ type: String, reflect: !0 })
-], x.prototype, "class", 2);
-j([
-  I("svg")
-], x.prototype, "_svg", 2);
-customElements.get(U) === void 0 && customElements.define(U, x);
-var Ie = Object.defineProperty, $e = Object.getOwnPropertyDescriptor, H = (e, t, o, i) => {
-  for (var n = i > 1 ? void 0 : i ? $e(t, o) : t, a = e.length - 1, r; a >= 0; a--)
-    (r = e[a]) && (n = (i ? r(t, o, n) : r(n)) || n);
-  return i && n && Ie(t, o, n), n;
+P([
+  r({ type: String, reflect: !0 })
+], b.prototype, "size", 2);
+P([
+  r({ type: String, reflect: !0 })
+], b.prototype, "class", 2);
+P([
+  $("svg")
+], b.prototype, "_svg", 2);
+customElements.get(R) === void 0 && customElements.define(R, b);
+var he = Object.defineProperty, pe = Object.getOwnPropertyDescriptor, D = (n, e, t, i) => {
+  for (var o = i > 1 ? void 0 : i ? pe(e, t) : e, a = n.length - 1, l; a >= 0; a--)
+    (l = n[a]) && (o = (i ? l(e, t, o) : l(o)) || o);
+  return i && o && he(e, t, o), o;
 };
-const Y = "icon-chevron-left";
-class E extends L {
+const N = "icon-chevron-left";
+class w extends O {
   constructor() {
     super(...arguments), this.size = "xs", this.class = "c-pieIcon c-pieIcon--chevronLeft";
   }
   connectedCallback() {
-    var t, o, i;
-    if (super.connectedCallback(), ((t = this._svg) == null ? void 0 : t.getAttribute("width")) === null) {
-      const n = b("c-pieIcon c-pieIcon--chevronLeft", "", null, "IconChevronLeft");
-      (o = this._svg) == null || o.setAttribute("width", n.width), (i = this._svg) == null || i.setAttribute("height", n.height);
+    var e, t, i;
+    if (super.connectedCallback(), ((e = this._svg) == null ? void 0 : e.getAttribute("width")) === null) {
+      const o = m("c-pieIcon c-pieIcon--chevronLeft", "", null, "IconChevronLeft");
+      (t = this._svg) == null || t.setAttribute("width", o.width), (i = this._svg) == null || i.setAttribute("height", o.height);
     }
   }
-  updated(t) {
-    var o, i;
-    let n;
-    t.has("size") && (n = b("c-pieIcon c-pieIcon--chevronLeft", "", this.size, "IconChevronLeft"), (o = this._svg) == null || o.setAttribute("width", n.width), (i = this._svg) == null || i.setAttribute("height", n.height));
+  updated(e) {
+    var t, i;
+    let o;
+    e.has("size") && (o = m("c-pieIcon c-pieIcon--chevronLeft", "", this.size, "IconChevronLeft"), (t = this._svg) == null || t.setAttribute("width", o.width), (i = this._svg) == null || i.setAttribute("height", o.height));
   }
   render() {
-    return F`<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--chevronLeft"><path d="M10.96 2.82 5.605 8l5.399 5.197-.875.963-5.565-5.364a1.164 1.164 0 0 1 0-1.671l5.495-5.25.901.945Z"></path></svg>`;
+    return M`<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--chevronLeft"><path d="M10.96 2.82 5.605 8l5.399 5.197-.875.963-5.565-5.364a1.164 1.164 0 0 1 0-1.671l5.495-5.25.901.945Z"></path></svg>`;
   }
 }
-E.styles = B`
+w.styles = I`
         :host-context(pie-icon-button) svg,
         :host-context(pie-button) svg {
             display: block;
@@ -238,43 +161,43 @@ E.styles = B`
             height: var(--btn-icon-size);
         }
     `;
-H([
-  s({ type: String, reflect: !0 })
-], E.prototype, "size", 2);
-H([
-  s({ type: String, reflect: !0 })
-], E.prototype, "class", 2);
-H([
-  I("svg")
-], E.prototype, "_svg", 2);
-customElements.get(Y) === void 0 && customElements.define(Y, E);
-var Pe = Object.defineProperty, Te = Object.getOwnPropertyDescriptor, V = (e, t, o, i) => {
-  for (var n = i > 1 ? void 0 : i ? Te(t, o) : t, a = e.length - 1, r; a >= 0; a--)
-    (r = e[a]) && (n = (i ? r(t, o, n) : r(n)) || n);
-  return i && n && Pe(t, o, n), n;
+D([
+  r({ type: String, reflect: !0 })
+], w.prototype, "size", 2);
+D([
+  r({ type: String, reflect: !0 })
+], w.prototype, "class", 2);
+D([
+  $("svg")
+], w.prototype, "_svg", 2);
+customElements.get(N) === void 0 && customElements.define(N, w);
+var ge = Object.defineProperty, ue = Object.getOwnPropertyDescriptor, T = (n, e, t, i) => {
+  for (var o = i > 1 ? void 0 : i ? ue(e, t) : e, a = n.length - 1, l; a >= 0; a--)
+    (l = n[a]) && (o = (i ? l(e, t, o) : l(o)) || o);
+  return i && o && ge(e, t, o), o;
 };
-const K = "icon-chevron-right";
-class M extends L {
+const q = "icon-chevron-right";
+class y extends O {
   constructor() {
     super(...arguments), this.size = "xs", this.class = "c-pieIcon c-pieIcon--chevronRight";
   }
   connectedCallback() {
-    var t, o, i;
-    if (super.connectedCallback(), ((t = this._svg) == null ? void 0 : t.getAttribute("width")) === null) {
-      const n = b("c-pieIcon c-pieIcon--chevronRight", "", null, "IconChevronRight");
-      (o = this._svg) == null || o.setAttribute("width", n.width), (i = this._svg) == null || i.setAttribute("height", n.height);
+    var e, t, i;
+    if (super.connectedCallback(), ((e = this._svg) == null ? void 0 : e.getAttribute("width")) === null) {
+      const o = m("c-pieIcon c-pieIcon--chevronRight", "", null, "IconChevronRight");
+      (t = this._svg) == null || t.setAttribute("width", o.width), (i = this._svg) == null || i.setAttribute("height", o.height);
     }
   }
-  updated(t) {
-    var o, i;
-    let n;
-    t.has("size") && (n = b("c-pieIcon c-pieIcon--chevronRight", "", this.size, "IconChevronRight"), (o = this._svg) == null || o.setAttribute("width", n.width), (i = this._svg) == null || i.setAttribute("height", n.height));
+  updated(e) {
+    var t, i;
+    let o;
+    e.has("size") && (o = m("c-pieIcon c-pieIcon--chevronRight", "", this.size, "IconChevronRight"), (t = this._svg) == null || t.setAttribute("width", o.width), (i = this._svg) == null || i.setAttribute("height", o.height));
   }
   render() {
-    return F`<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--chevronRight"><path d="M5.044 13.18 10.399 8 5 2.82l.875-.962 5.539 5.346a1.164 1.164 0 0 1 0 1.636l-5.469 5.285-.901-.945Z"></path></svg>`;
+    return M`<svg xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" fill="currentColor" viewBox="0 0 16 16" class="c-pieIcon c-pieIcon--chevronRight"><path d="M5.044 13.18 10.399 8 5 2.82l.875-.962 5.539 5.346a1.164 1.164 0 0 1 0 1.636l-5.469 5.285-.901-.945Z"></path></svg>`;
   }
 }
-M.styles = B`
+y.styles = I`
         :host-context(pie-icon-button) svg,
         :host-context(pie-button) svg {
             display: block;
@@ -282,495 +205,164 @@ M.styles = B`
             height: var(--btn-icon-size);
         }
     `;
-V([
-  s({ type: String, reflect: !0 })
-], M.prototype, "size", 2);
-V([
-  s({ type: String, reflect: !0 })
-], M.prototype, "class", 2);
-V([
-  I("svg")
-], M.prototype, "_svg", 2);
-customElements.get(K) === void 0 && customElements.define(K, M);
-var v = window.CustomEvent;
-(!v || typeof v == "object") && (v = function(t, o) {
-  o = o || {};
-  var i = document.createEvent("CustomEvent");
-  return i.initCustomEvent(t, !!o.bubbles, !!o.cancelable, o.detail || null), i;
-}, v.prototype = window.Event.prototype);
-function ne(e, t) {
-  var o = "on" + t.type.toLowerCase();
-  return typeof e[o] == "function" && e[o](t), e.dispatchEvent(t);
-}
-function Be(e) {
-  for (; e && e !== document.body; ) {
-    var t = window.getComputedStyle(e), o = function(i, n) {
-      return !(t[i] === void 0 || t[i] === n);
-    };
-    if (t.opacity < 1 || o("zIndex", "auto") || o("transform", "none") || o("mixBlendMode", "normal") || o("filter", "none") || o("perspective", "none") || t.isolation === "isolate" || t.position === "fixed" || t.webkitOverflowScrolling === "touch")
-      return !0;
-    e = e.parentElement;
-  }
-  return !1;
-}
-function k(e) {
-  for (; e; ) {
-    if (e.localName === "dialog")
-      return (
-        /** @type {HTMLDialogElement} */
-        e
-      );
-    e.parentElement ? e = e.parentElement : e.parentNode ? e = e.parentNode.host : e = null;
-  }
-  return null;
-}
-function ae(e) {
-  for (; e && e.shadowRoot && e.shadowRoot.activeElement; )
-    e = e.shadowRoot.activeElement;
-  e && e.blur && e !== document.body && e.blur();
-}
-function Fe(e, t) {
-  for (var o = 0; o < e.length; ++o)
-    if (e[o] === t)
-      return !0;
-  return !1;
+T([
+  r({ type: String, reflect: !0 })
+], y.prototype, "size", 2);
+T([
+  r({ type: String, reflect: !0 })
+], y.prototype, "class", 2);
+T([
+  $("svg")
+], y.prototype, "_svg", 2);
+customElements.get(q) === void 0 && customElements.define(q, y);
+function me(n) {
+  if (Array.isArray(n)) {
+    for (var e = 0, t = Array(n.length); e < n.length; e++)
+      t[e] = n[e];
+    return t;
+  } else
+    return Array.from(n);
 }
-function $(e) {
-  return !e || !e.hasAttribute("method") ? !1 : e.getAttribute("method").toLowerCase() === "dialog";
+var j = !1;
+if (typeof window < "u") {
+  var V = {
+    get passive() {
+      j = !0;
+    }
+  };
+  window.addEventListener("testPassive", null, V), window.removeEventListener("testPassive", null, V);
 }
-function re(e) {
-  var t = ["button", "input", "keygen", "select", "textarea"], o = t.map(function(r) {
-    return r + ":not([disabled])";
+var Z = typeof window < "u" && window.navigator && window.navigator.platform && (/iP(ad|hone|od)/.test(window.navigator.platform) || window.navigator.platform === "MacIntel" && window.navigator.maxTouchPoints > 1), g = [], C = !1, G = -1, v = void 0, f = void 0, X = function(e) {
+  return g.some(function(t) {
+    return !!(t.options.allowTouchMove && t.options.allowTouchMove(e));
   });
-  o.push('[tabindex]:not([disabled]):not([tabindex=""])');
-  var i = e.querySelector(o.join(", "));
-  if (!i && "attachShadow" in Element.prototype)
-    for (var n = e.querySelectorAll("*"), a = 0; a < n.length && !(n[a].tagName && n[a].shadowRoot && (i = re(n[a].shadowRoot), i)); a++)
-      ;
-  return i;
-}
-function X(e) {
-  return e.isConnected || document.body.contains(e);
-}
-function le(e) {
-  if (e.submitter)
-    return e.submitter;
-  var t = e.target;
-  if (!(t instanceof HTMLFormElement))
-    return null;
-  var o = l.formSubmitter;
-  if (!o) {
-    var i = e.target, n = "getRootNode" in i && i.getRootNode() || document;
-    o = n.activeElement;
-  }
-  return !o || o.form !== t ? null : o;
-}
-function Ne(e) {
-  if (!e.defaultPrevented) {
-    var t = (
-      /** @type {!HTMLFormElement} */
-      e.target
-    ), o = l.imagemapUseValue, i = le(e);
-    o === null && i && (o = i.value);
-    var n = k(t);
-    if (n) {
-      var a = i && i.getAttribute("formmethod") || t.getAttribute("method");
-      a === "dialog" && (e.preventDefault(), o != null ? n.close(o) : n.close());
-    }
+}, A = function(e) {
+  var t = e || window.event;
+  return X(t.target) || t.touches.length > 1 ? !0 : (t.preventDefault && t.preventDefault(), !1);
+}, ve = function(e) {
+  if (f === void 0) {
+    var t = !!e && e.reserveScrollBarGap === !0, i = window.innerWidth - document.documentElement.clientWidth;
+    t && i > 0 && (f = document.body.style.paddingRight, document.body.style.paddingRight = i + "px");
+  }
+  v === void 0 && (v = document.body.style.overflow, document.body.style.overflow = "hidden");
+}, fe = function() {
+  f !== void 0 && (document.body.style.paddingRight = f, f = void 0), v !== void 0 && (document.body.style.overflow = v, v = void 0);
+}, be = function(e) {
+  return e ? e.scrollHeight - e.scrollTop <= e.clientHeight : !1;
+}, we = function(e, t) {
+  var i = e.targetTouches[0].clientY - G;
+  return X(e.target) ? !1 : t && t.scrollTop === 0 && i > 0 || be(t) && i < 0 ? A(e) : (e.stopPropagation(), !0);
+}, ye = function(e, t) {
+  if (!e) {
+    console.error("disableBodyScroll unsuccessful - targetElement must be provided when calling disableBodyScroll on IOS devices.");
+    return;
   }
-}
-function se(e) {
-  if (this.dialog_ = e, this.replacedStyleTop_ = !1, this.openAsModal_ = !1, e.hasAttribute("role") || e.setAttribute("role", "dialog"), e.show = this.show.bind(this), e.showModal = this.showModal.bind(this), e.close = this.close.bind(this), e.addEventListener("submit", Ne, !1), "returnValue" in e || (e.returnValue = ""), "MutationObserver" in window) {
-    var t = new MutationObserver(this.maybeHideModal.bind(this));
-    t.observe(e, { attributes: !0, attributeFilter: ["open"] });
-  } else {
-    var o = !1, i = function() {
-      o ? this.downgradeModal() : this.maybeHideModal(), o = !1;
-    }.bind(this), n, a = function(r) {
-      if (r.target === e) {
-        var h = "DOMNodeRemoved";
-        o |= r.type.substr(0, h.length) === h, window.clearTimeout(n), n = window.setTimeout(i, 0);
-      }
+  if (!g.some(function(o) {
+    return o.targetElement === e;
+  })) {
+    var i = {
+      targetElement: e,
+      options: t || {}
     };
-    ["DOMAttrModified", "DOMNodeRemoved", "DOMNodeRemovedFromDocument"].forEach(function(r) {
-      e.addEventListener(r, a);
-    });
-  }
-  Object.defineProperty(e, "open", {
-    set: this.setOpen.bind(this),
-    get: e.hasAttribute.bind(e, "open")
-  }), this.backdrop_ = document.createElement("div"), this.backdrop_.className = "backdrop", this.backdrop_.addEventListener("mouseup", this.backdropMouseEvent_.bind(this)), this.backdrop_.addEventListener("mousedown", this.backdropMouseEvent_.bind(this)), this.backdrop_.addEventListener("click", this.backdropMouseEvent_.bind(this));
-}
-se.prototype = /** @type {HTMLDialogElement.prototype} */
-{
-  get dialog() {
-    return this.dialog_;
-  },
-  /**
-   * Maybe remove this dialog from the modal top layer. This is called when
-   * a modal dialog may no longer be tenable, e.g., when the dialog is no
-   * longer open or is no longer part of the DOM.
-   */
-  maybeHideModal: function() {
-    this.dialog_.hasAttribute("open") && X(this.dialog_) || this.downgradeModal();
-  },
-  /**
-   * Remove this dialog from the modal top layer, leaving it as a non-modal.
-   */
-  downgradeModal: function() {
-    this.openAsModal_ && (this.openAsModal_ = !1, this.dialog_.style.zIndex = "", this.replacedStyleTop_ && (this.dialog_.style.top = "", this.replacedStyleTop_ = !1), this.backdrop_.parentNode && this.backdrop_.parentNode.removeChild(this.backdrop_), l.dm.removeDialog(this));
-  },
-  /**
-   * @param {boolean} value whether to open or close this dialog
-   */
-  setOpen: function(e) {
-    e ? this.dialog_.hasAttribute("open") || this.dialog_.setAttribute("open", "") : (this.dialog_.removeAttribute("open"), this.maybeHideModal());
-  },
-  /**
-   * Handles mouse events ('mouseup', 'mousedown', 'click') on the fake .backdrop element, redirecting them as if
-   * they were on the dialog itself.
-   *
-   * @param {!Event} e to redirect
-   */
-  backdropMouseEvent_: function(e) {
-    if (this.dialog_.hasAttribute("tabindex"))
-      this.dialog_.focus();
-    else {
-      var t = document.createElement("div");
-      this.dialog_.insertBefore(t, this.dialog_.firstChild), t.tabIndex = -1, t.focus(), this.dialog_.removeChild(t);
-    }
-    var o = document.createEvent("MouseEvents");
-    o.initMouseEvent(
-      e.type,
-      e.bubbles,
-      e.cancelable,
-      window,
-      e.detail,
-      e.screenX,
-      e.screenY,
-      e.clientX,
-      e.clientY,
-      e.ctrlKey,
-      e.altKey,
-      e.shiftKey,
-      e.metaKey,
-      e.button,
-      e.relatedTarget
-    ), this.dialog_.dispatchEvent(o), e.stopPropagation();
-  },
-  /**
-   * Focuses on the first focusable element within the dialog. This will always blur the current
-   * focus, even if nothing within the dialog is found.
-   */
-  focus_: function() {
-    var e = this.dialog_.querySelector("[autofocus]:not([disabled])");
-    !e && this.dialog_.tabIndex >= 0 && (e = this.dialog_), e || (e = re(this.dialog_)), ae(document.activeElement), e && e.focus();
-  },
-  /**
-   * Sets the zIndex for the backdrop and dialog.
-   *
-   * @param {number} dialogZ
-   * @param {number} backdropZ
-   */
-  updateZIndex: function(e, t) {
-    if (e < t)
-      throw new Error("dialogZ should never be < backdropZ");
-    this.dialog_.style.zIndex = e, this.backdrop_.style.zIndex = t;
-  },
-  /**
-   * Shows the dialog. If the dialog is already open, this does nothing.
-   */
-  show: function() {
-    this.dialog_.open || (this.setOpen(!0), this.focus_());
-  },
-  /**
-   * Show this dialog modally.
-   */
-  showModal: function() {
-    if (this.dialog_.hasAttribute("open"))
-      throw new Error("Failed to execute 'showModal' on dialog: The element is already open, and therefore cannot be opened modally.");
-    if (!X(this.dialog_))
-      throw new Error("Failed to execute 'showModal' on dialog: The element is not in a Document.");
-    if (!l.dm.pushDialog(this))
-      throw new Error("Failed to execute 'showModal' on dialog: There are too many open modal dialogs.");
-    Be(this.dialog_.parentElement) && console.warn("A dialog is being shown inside a stacking context. This may cause it to be unusable. For more information, see this link: https://github.com/GoogleChrome/dialog-polyfill/#stacking-context"), this.setOpen(!0), this.openAsModal_ = !0, l.needsCentering(this.dialog_) ? (l.reposition(this.dialog_), this.replacedStyleTop_ = !0) : this.replacedStyleTop_ = !1, this.dialog_.parentNode.insertBefore(this.backdrop_, this.dialog_.nextSibling), this.focus_();
-  },
-  /**
-   * Closes this HTMLDialogElement. This is optional vs clearing the open
-   * attribute, however this fires a 'close' event.
-   *
-   * @param {string=} opt_returnValue to use as the returnValue
-   */
-  close: function(e) {
-    if (!this.dialog_.hasAttribute("open"))
-      throw new Error("Failed to execute 'close' on dialog: The element does not have an 'open' attribute, and therefore cannot be closed.");
-    this.setOpen(!1), e !== void 0 && (this.dialog_.returnValue = e);
-    var t = new v("close", {
-      bubbles: !1,
-      cancelable: !1
-    });
-    ne(this.dialog_, t);
-  }
-};
-var l = {};
-l.reposition = function(e) {
-  var t = document.body.scrollTop || document.documentElement.scrollTop, o = t + (window.innerHeight - e.offsetHeight) / 2;
-  e.style.top = Math.max(t, o) + "px";
-};
-l.isInlinePositionSetByStylesheet = function(e) {
-  for (var t = 0; t < document.styleSheets.length; ++t) {
-    var o = document.styleSheets[t], i = null;
-    try {
-      i = o.cssRules;
-    } catch {
-    }
-    if (i)
-      for (var n = 0; n < i.length; ++n) {
-        var a = i[n], r = null;
-        try {
-          r = document.querySelectorAll(a.selectorText);
-        } catch {
-        }
-        if (!(!r || !Fe(r, e))) {
-          var h = a.style.getPropertyValue("top"), p = a.style.getPropertyValue("bottom");
-          if (h && h !== "auto" || p && p !== "auto")
-            return !0;
-        }
-      }
-  }
-  return !1;
-};
-l.needsCentering = function(e) {
-  var t = window.getComputedStyle(e);
-  return t.position !== "absolute" || e.style.top !== "auto" && e.style.top !== "" || e.style.bottom !== "auto" && e.style.bottom !== "" ? !1 : !l.isInlinePositionSetByStylesheet(e);
-};
-l.forceRegisterDialog = function(e) {
-  if ((window.HTMLDialogElement || e.showModal) && console.warn("This browser already supports <dialog>, the polyfill may not work correctly", e), e.localName !== "dialog")
-    throw new Error("Failed to register dialog: The element is not a dialog.");
-  new se(
-    /** @type {!HTMLDialogElement} */
-    e
-  );
-};
-l.registerDialog = function(e) {
-  e.showModal || l.forceRegisterDialog(e);
-};
-l.DialogManager = function() {
-  this.pendingDialogStack = [];
-  var e = this.checkDOM_.bind(this);
-  this.overlay = document.createElement("div"), this.overlay.className = "_dialog_overlay", this.overlay.addEventListener("click", function(t) {
-    this.forwardTab_ = void 0, t.stopPropagation(), e([]);
-  }.bind(this)), this.handleKey_ = this.handleKey_.bind(this), this.handleFocus_ = this.handleFocus_.bind(this), this.zIndexLow_ = 1e5, this.zIndexHigh_ = 1e5 + 150, this.forwardTab_ = void 0, "MutationObserver" in window && (this.mo_ = new MutationObserver(function(t) {
-    var o = [];
-    t.forEach(function(i) {
-      for (var n = 0, a; a = i.removedNodes[n]; ++n) {
-        if (a instanceof Element)
-          a.localName === "dialog" && o.push(a);
-        else
-          continue;
-        o = o.concat(a.querySelectorAll("dialog"));
-      }
-    }), o.length && e(o);
-  }));
-};
-l.DialogManager.prototype.blockDocument = function() {
-  document.documentElement.addEventListener("focus", this.handleFocus_, !0), document.addEventListener("keydown", this.handleKey_), this.mo_ && this.mo_.observe(document, { childList: !0, subtree: !0 });
-};
-l.DialogManager.prototype.unblockDocument = function() {
-  document.documentElement.removeEventListener("focus", this.handleFocus_, !0), document.removeEventListener("keydown", this.handleKey_), this.mo_ && this.mo_.disconnect();
-};
-l.DialogManager.prototype.updateStacking = function() {
-  for (var e = this.zIndexHigh_, t = 0, o; o = this.pendingDialogStack[t]; ++t)
-    o.updateZIndex(--e, --e), t === 0 && (this.overlay.style.zIndex = --e);
-  var i = this.pendingDialogStack[0];
-  if (i) {
-    var n = i.dialog.parentNode || document.body;
-    n.appendChild(this.overlay);
-  } else
-    this.overlay.parentNode && this.overlay.parentNode.removeChild(this.overlay);
-};
-l.DialogManager.prototype.containedByTopDialog_ = function(e) {
-  for (; e = k(e); ) {
-    for (var t = 0, o; o = this.pendingDialogStack[t]; ++t)
-      if (o.dialog === e)
-        return t === 0;
-    e = e.parentElement;
-  }
-  return !1;
-};
-l.DialogManager.prototype.handleFocus_ = function(e) {
-  var t = e.composedPath ? e.composedPath()[0] : e.target;
-  if (!this.containedByTopDialog_(t) && document.activeElement !== document.documentElement && (e.preventDefault(), e.stopPropagation(), ae(
-    /** @type {Element} */
-    t
-  ), this.forwardTab_ !== void 0)) {
-    var o = this.pendingDialogStack[0], i = o.dialog, n = i.compareDocumentPosition(t);
-    return n & Node.DOCUMENT_POSITION_PRECEDING && (this.forwardTab_ ? o.focus_() : t !== document.documentElement && document.documentElement.focus()), !1;
+    g = [].concat(me(g), [i]), Z ? (e.ontouchstart = function(o) {
+      o.targetTouches.length === 1 && (G = o.targetTouches[0].clientY);
+    }, e.ontouchmove = function(o) {
+      o.targetTouches.length === 1 && we(o, e);
+    }, C || (document.addEventListener("touchmove", A, j ? { passive: !1 } : void 0), C = !0)) : ve(t);
+  }
+}, ke = function(e) {
+  if (!e) {
+    console.error("enableBodyScroll unsuccessful - targetElement must be provided when calling enableBodyScroll on IOS devices.");
+    return;
   }
+  g = g.filter(function(t) {
+    return t.targetElement !== e;
+  }), Z ? (e.ontouchstart = null, e.ontouchmove = null, C && g.length === 0 && (document.removeEventListener("touchmove", A, j ? { passive: !1 } : void 0), C = !1)) : g.length || fe();
 };
-l.DialogManager.prototype.handleKey_ = function(e) {
-  if (this.forwardTab_ = void 0, e.keyCode === 27) {
-    e.preventDefault(), e.stopPropagation();
-    var t = new v("cancel", {
-      bubbles: !1,
-      cancelable: !0
-    }), o = this.pendingDialogStack[0];
-    o && ne(o.dialog, t) && o.dialog.close();
-  } else
-    e.keyCode === 9 && (this.forwardTab_ = !e.shiftKey);
-};
-l.DialogManager.prototype.checkDOM_ = function(e) {
-  var t = this.pendingDialogStack.slice();
-  t.forEach(function(o) {
-    e.indexOf(o.dialog) !== -1 ? o.downgradeModal() : o.maybeHideModal();
-  });
-};
-l.DialogManager.prototype.pushDialog = function(e) {
-  var t = (this.zIndexHigh_ - this.zIndexLow_) / 2 - 1;
-  return this.pendingDialogStack.length >= t ? !1 : (this.pendingDialogStack.unshift(e) === 1 && this.blockDocument(), this.updateStacking(), !0);
-};
-l.DialogManager.prototype.removeDialog = function(e) {
-  var t = this.pendingDialogStack.indexOf(e);
-  t !== -1 && (this.pendingDialogStack.splice(t, 1), this.pendingDialogStack.length === 0 && this.unblockDocument(), this.updateStacking());
-};
-l.dm = new l.DialogManager();
-l.formSubmitter = null;
-l.imagemapUseValue = null;
-if (window.HTMLDialogElement === void 0) {
-  var Z = document.createElement("form");
-  if (Z.setAttribute("method", "dialog"), Z.method !== "dialog") {
-    var f = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, "method");
-    if (f) {
-      var Re = f.get;
-      f.get = function() {
-        return $(this) ? "dialog" : Re.call(this);
-      };
-      var je = f.set;
-      f.set = function(e) {
-        return typeof e == "string" && e.toLowerCase() === "dialog" ? this.setAttribute("method", e) : je.call(this, e);
-      }, Object.defineProperty(HTMLFormElement.prototype, "method", f);
-    }
-  }
-  document.addEventListener("click", function(e) {
-    if (l.formSubmitter = null, l.imagemapUseValue = null, !e.defaultPrevented) {
-      var t = (
-        /** @type {Element} */
-        e.target
-      );
-      if ("composedPath" in e) {
-        var o = e.composedPath();
-        t = o.shift() || t;
-      }
-      if (!(!t || !$(t.form))) {
-        var i = t.type === "submit" && ["button", "input"].indexOf(t.localName) > -1;
-        if (!i) {
-          if (!(t.localName === "input" && t.type === "image"))
-            return;
-          l.imagemapUseValue = e.offsetX + "," + e.offsetY;
-        }
-        var n = k(t);
-        n && (l.formSubmitter = t);
-      }
-    }
-  }, !1), document.addEventListener("submit", function(e) {
-    var t = e.target, o = k(t);
-    if (!o) {
-      var i = le(e), n = i && i.getAttribute("formmethod") || t.getAttribute("method");
-      n === "dialog" && e.preventDefault();
-    }
-  });
-  var He = HTMLFormElement.prototype.submit, Ve = function() {
-    if (!$(this))
-      return He.call(this);
-    var e = k(this);
-    e && e.close();
-  };
-  HTMLFormElement.prototype.submit = Ve;
-}
-const qe = `dialog{position:absolute;left:0;right:0;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;margin:auto;border:solid;padding:1em;background:white;color:#000;display:block}dialog:not([open]){display:none}dialog+.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.1)}._dialog_overlay{position:fixed;top:0;right:0;bottom:0;left:0}dialog.fixed{position:fixed;top:50%;transform:translateY(-50%)}*,*:before,*:after{box-sizing:border-box}@keyframes rotate360{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.c-modal{--modal-size-s: 450px;--modal-size-m: 600px;--modal-size-l: 1080px;--modal-border-radius: var(--dt-radius-rounded-d);--modal-font: var(--dt-font-interactive-m-family);--modal-bg-color: var(--dt-color-container-default);--modal-elevation: var(--dt-elevation-04);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-font-smoothing:antialiased;border-radius:var(--modal-border-radius);border:none;box-shadow:var(--modal-elevation);font-family:var(--modal-font);background-color:var(--modal-bg-color);padding:0;--modal-margin-none: var(--dt-spacing-none);--modal-margin-small: var(--dt-spacing-g);--modal-margin-large: var(--dt-spacing-j);--modal-margin-block: var(--modal-margin-small);--modal-block-size: fit-content;--modal-inline-size: 75%;--modal-max-block-size: calc(100vh - calc(var(--modal-margin-block) * 2));--modal-max-inline-size: var(--modal-size-m);block-size:var(--modal-block-size);inline-size:var(--modal-inline-size);max-block-size:var(--modal-max-block-size);max-inline-size:var(--modal-max-inline-size)}.c-modal:focus-visible{outline:none}@media (max-width: 768px){.c-modal pie-icon-button{--btn-dimension: 40px}}.c-modal[open]{display:flex;flex-direction:column}@media (min-width: 768px){.c-modal{--modal-margin-block: var(--modal-margin-large)}}.c-modal[size=small]{--modal-max-inline-size: var(--modal-size-s)}@media (min-width: 768px){.c-modal[size=small]{--modal-margin-block: var(--modal-margin-large)}}@media (max-width: 767px){.c-modal[size=medium][isfullwidthbelowmid]{--modal-margin-block: var(--modal-margin-none);--modal-border-radius: var(--dt-radius-rounded-none);--modal-block-size: 100%;--modal-inline-size: 100%;--modal-max-inline-size: 100%}}.c-modal[size=large]{--modal-inline-size: 75%;--modal-max-inline-size: var(--modal-size-l);--modal-margin-block: var(--modal-margin-large)}@media (max-width: 767px){.c-modal[size=large]{--modal-margin-block: var(--modal-margin-none);--modal-border-radius: var(--dt-radius-rounded-none);--modal-block-size: 100%;--modal-inline-size: 100%}}.c-modal[position=top]{margin-block-start:var(--dt-spacing-j)}@media (max-width: 767px){.c-modal[position=top][isfullwidthbelowmid]{margin-block-start:var(--dt-spacing-none)}}.c-modal::backdrop{background:rgba(0,0,0,.5)}.c-modal .c-modal-footer{--modal-button-spacing: var(--dt-spacing-d);--modal-footer-padding: var(--dt-spacing-d);display:flex;flex-flow:row-reverse;flex-wrap:wrap;gap:var(--modal-button-spacing);padding:var(--modal-footer-padding)}@media (min-width: 768px){.c-modal .c-modal-footer{--modal-footer-padding: var(--dt-spacing-e)}}@media (max-width: 767px){.c-modal[hasstackedactions] .c-modal-footer{flex-direction:column}}.c-modal .c-modal-header{padding-inline:var(--dt-spacing-d);padding-block:14px;display:grid;grid-template-areas:"back heading close" ". heading .";grid-template-columns:minmax(0,max-content) minmax(0,1fr) minmax(0,max-content);align-items:center}@media (min-width: 768px){.c-modal .c-modal-header{padding-inline:var(--dt-spacing-e);padding-block:20px}}.c-modal[hasbackbutton] .c-modal-header{padding-block:var(--dt-spacing-b);padding-inline-start:var(--dt-spacing-b)}@media (min-width: 768px){.c-modal[hasbackbutton] .c-modal-header{padding-block:var(--dt-spacing-c);padding-inline-start:var(--dt-spacing-c)}}.c-modal[isdismissible] .c-modal-header{padding-block:var(--dt-spacing-b);padding-inline-end:var(--dt-spacing-b)}@media (min-width: 768px){.c-modal[isdismissible] .c-modal-header{padding-block:var(--dt-spacing-c);padding-inline-end:var(--dt-spacing-c)}}.c-modal .c-modal-heading{--modal-header-font-size: calc(var(--dt-font-heading-m-size--wide) * 1px);--modal-header-font-line-height: calc(var(--dt-font-heading-m-line-height--wide) * 1px);--modal-header-font-weight: var(--dt-font-heading-m-weight);font-size:var(--modal-header-font-size);line-height:var(--modal-header-font-line-height);font-weight:var(--modal-header-font-weight);margin:0;grid-area:heading}.c-modal[hasbackbutton] .c-modal-heading{padding-inline-start:var(--dt-spacing-b)}@media (min-width: 768px){.c-modal[hasbackbutton] .c-modal-heading{padding-inline-start:var(--dt-spacing-c)}}.c-modal[isdismissible] .c-modal-heading{padding-inline-end:var(--dt-spacing-d)}@media (min-width: 768px){.c-modal[isdismissible] .c-modal-heading{padding-inline-end:var(--dt-spacing-e)}}.c-modal .c-modal-backBtn{grid-area:back}.c-modal .c-modal-closeBtn{grid-area:close}.c-modal[isfooterpinned] .c-modal-content,.c-modal .c-modal-scrollContainer{overflow-y:auto}.c-modal .c-modal-scrollContainer{--bg-scroll-start: linear-gradient(var(--dt-color-container-default) 30%, rgba(255, 255, 255, 0));--bg-scroll-end: linear-gradient(rgba(255, 255, 255, 0), var(--dt-color-container-default) 70%) 0 100%;--bg-scroll-top: radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0));--bg-scroll-bottom: radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0)) 0 100%;--bg-size-scroll-start: 100% 40px;--bg-size-scroll-end: 100% 40px;--bg-size-scroll-top: 100% 16px;--bg-size-scroll-bottom: 100% 16px;background:var(--bg-scroll-start),var(--bg-scroll-end),var(--bg-scroll-top),var(--bg-scroll-bottom);background-repeat:no-repeat;background-color:var(--dt-color-container-default);background-size:var(--bg-size-scroll-start),var(--bg-size-scroll-end),var(--bg-size-scroll-top),var(--bg-size-scroll-bottom);background-attachment:local,local,scroll,scroll}.c-modal .c-modal-content{--modal-content-font-size: calc(var(--dt-font-size-16) * 1px);--modal-content-font-weight: var(--dt-font-weight-regular);--modal-content-line-height: calc(var(--dt-font-size-16-line-height) * 1px);--modal-content-padding: var(--dt-spacing-e);--modal-content-padding-block: var(--dt-spacing-a);--spinner-size: 48px;--spinner-border-width: 6px;--spinner-base-color-h: var(--dt-color-content-interactive-secondary-h);--spinner-base-color-s: var(--dt-color-content-interactive-secondary-s);--spinner-base-color-l: var(--dt-color-content-interactive-secondary-l);--spinner-left-color-opacity: .35;--spinner-left-color: hsl(var(--spinner-base-color-h), var(--spinner-base-color-s), var(--spinner-base-color-l), var(--spinner-left-color-opacity));--spinner-right-color: hsl(var(--spinner-base-color-h), var(--spinner-base-color-s), var(--spinner-base-color-l), 1);--spinner-animation-duration: 1.15s;--spinner-animation-timing-function: linear;--spinner-animation-iteration-count: infinite;position:relative;min-block-size:var(--dt-spacing-j);font-size:var(--modal-content-font-size);line-height:var(--modal-content-line-height);font-weight:var(--modal-content-font-weight);padding-inline:var(--modal-content-padding);padding-block:var(--modal-content-padding-block)}.c-modal .c-modal-content--scrollable{background:linear-gradient(to bottom,transparent,var(--dt-color-container-default) 75%) center bottom,linear-gradient(transparent,var(--dt-color-border-strong)) center bottom;background-repeat:no-repeat;background-size:100% 48px,100% 12px;background-attachment:local,scroll}.c-modal .c-modal-content:before{content:"";position:absolute;left:50%;top:50%;translate:-50% -50%;height:var(--spinner-size);width:var(--spinner-size);display:block;background-color:transparent;border-radius:50%;border-color:var(--spinner-left-color) var(--spinner-right-color) var(--spinner-right-color) var(--spinner-left-color);border-width:var(--spinner-border-width);border-style:solid;will-change:transform;opacity:0}.c-modal[isLoading] .c-modal-content:before{animation:rotate360 var(--spinner-animation-duration) var(--spinner-animation-timing-function) var(--spinner-animation-iteration-count);opacity:1}.c-modal[isLoading] .c-modal-content .c-modal-contentInner{opacity:0}
-`, We = ["h1", "h2", "h3", "h4", "h5", "h6"], Ue = ["small", "medium", "large"], Ye = ["top", "center"], P = "pie-modal-close", z = "pie-modal-open", T = "pie-modal-back", Ke = "pie-modal-leading-action-click", Xe = "pie-modal-supporting-action-click";
-var Ze = Object.defineProperty, Ge = Object.getOwnPropertyDescriptor, c = (e, t, o, i) => {
-  for (var n = i > 1 ? void 0 : i ? Ge(t, o) : t, a = e.length - 1, r; a >= 0; a--)
-    (r = e[a]) && (n = (i ? r(t, o, n) : r(n)) || n);
-  return i && n && Ze(t, o, n), n;
+const xe = `dialog{position:absolute;left:0;right:0;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;margin:auto;border:solid;padding:1em;background:white;color:#000;display:block}dialog:not([open]){display:none}dialog+.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.1)}._dialog_overlay{position:fixed;top:0;right:0;bottom:0;left:0}dialog.fixed{position:fixed;top:50%;transform:translateY(-50%)}*,*:before,*:after{box-sizing:border-box}@keyframes rotate360{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.c-modal{--modal-size-s: 450px;--modal-size-m: 600px;--modal-size-l: 1080px;--modal-border-radius: var(--dt-radius-rounded-d);--modal-font: var(--dt-font-interactive-m-family);--modal-bg-color: var(--dt-color-container-default);--modal-elevation: var(--dt-elevation-04);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-font-smoothing:antialiased;border-radius:var(--modal-border-radius);border:none;box-shadow:var(--modal-elevation);font-family:var(--modal-font);background-color:var(--modal-bg-color);padding:0;--modal-margin-none: var(--dt-spacing-none);--modal-margin-small: var(--dt-spacing-g);--modal-margin-large: var(--dt-spacing-j);--modal-margin-block: var(--modal-margin-small);--modal-block-size: fit-content;--modal-inline-size: 75%;--modal-max-block-size: calc(100vh - calc(var(--modal-margin-block) * 2));--modal-max-inline-size: var(--modal-size-m);block-size:var(--modal-block-size);inline-size:var(--modal-inline-size);max-block-size:var(--modal-max-block-size);max-inline-size:var(--modal-max-inline-size)}.c-modal:focus-visible{outline:none}@media (max-width: 768px){.c-modal pie-icon-button{--btn-dimension: 40px}}.c-modal[open]{display:flex;flex-direction:column}@media (min-width: 768px){.c-modal{--modal-margin-block: var(--modal-margin-large)}}.c-modal[size=small]{--modal-max-inline-size: var(--modal-size-s)}@media (min-width: 768px){.c-modal[size=small]{--modal-margin-block: var(--modal-margin-large)}}@media (max-width: 767px){.c-modal[size=medium][isfullwidthbelowmid]{--modal-margin-block: var(--modal-margin-none);--modal-border-radius: var(--dt-radius-rounded-none);--modal-block-size: 100%;--modal-inline-size: 100%;--modal-max-inline-size: 100%}}.c-modal[size=large]{--modal-inline-size: 75%;--modal-max-inline-size: var(--modal-size-l);--modal-margin-block: var(--modal-margin-large)}@media (max-width: 767px){.c-modal[size=large]{--modal-margin-block: var(--modal-margin-none);--modal-border-radius: var(--dt-radius-rounded-none);--modal-block-size: 100%;--modal-inline-size: 100%}}.c-modal[position=top]{margin-block-start:var(--dt-spacing-j)}@media (max-width: 767px){.c-modal[position=top][isfullwidthbelowmid]{margin-block-start:var(--dt-spacing-none)}}.c-modal::backdrop{background:rgba(0,0,0,.5)}.c-modal .c-modal-footer{--modal-button-spacing: var(--dt-spacing-d);--modal-footer-padding: var(--dt-spacing-d);display:flex;flex-flow:row-reverse;flex-wrap:wrap;gap:var(--modal-button-spacing);padding:var(--modal-footer-padding)}@media (min-width: 768px){.c-modal .c-modal-footer{--modal-footer-padding: var(--dt-spacing-e)}}@media (max-width: 767px){.c-modal[hasstackedactions] .c-modal-footer{flex-direction:column}}.c-modal .c-modal-header{padding-inline:var(--dt-spacing-d);padding-block:14px;display:grid;grid-template-areas:"back heading close" ". heading .";grid-template-columns:minmax(0,max-content) minmax(0,1fr) minmax(0,max-content);align-items:center}@media (min-width: 768px){.c-modal .c-modal-header{padding-inline:var(--dt-spacing-e);padding-block:20px}}.c-modal[hasbackbutton] .c-modal-header{padding-block:var(--dt-spacing-b);padding-inline-start:var(--dt-spacing-b)}@media (min-width: 768px){.c-modal[hasbackbutton] .c-modal-header{padding-block:var(--dt-spacing-c);padding-inline-start:var(--dt-spacing-c)}}.c-modal[isdismissible] .c-modal-header{padding-block:var(--dt-spacing-b);padding-inline-end:var(--dt-spacing-b)}@media (min-width: 768px){.c-modal[isdismissible] .c-modal-header{padding-block:var(--dt-spacing-c);padding-inline-end:var(--dt-spacing-c)}}.c-modal .c-modal-heading{--modal-header-font-size: calc(var(--dt-font-heading-m-size--wide) * 1px);--modal-header-font-line-height: calc(var(--dt-font-heading-m-line-height--wide) * 1px);--modal-header-font-weight: var(--dt-font-heading-m-weight);font-size:var(--modal-header-font-size);line-height:var(--modal-header-font-line-height);font-weight:var(--modal-header-font-weight);margin:0;grid-area:heading}.c-modal[hasbackbutton] .c-modal-heading{padding-inline-start:var(--dt-spacing-b)}@media (min-width: 768px){.c-modal[hasbackbutton] .c-modal-heading{padding-inline-start:var(--dt-spacing-c)}}.c-modal[isdismissible] .c-modal-heading{padding-inline-end:var(--dt-spacing-d)}@media (min-width: 768px){.c-modal[isdismissible] .c-modal-heading{padding-inline-end:var(--dt-spacing-e)}}.c-modal .c-modal-backBtn{grid-area:back}.c-modal .c-modal-closeBtn{grid-area:close}.c-modal[isfooterpinned] .c-modal-content,.c-modal .c-modal-scrollContainer{overflow-y:auto}.c-modal .c-modal-scrollContainer{--bg-scroll-start: linear-gradient(var(--dt-color-container-default) 30%, rgba(255, 255, 255, 0));--bg-scroll-end: linear-gradient(rgba(255, 255, 255, 0), var(--dt-color-container-default) 70%) 0 100%;--bg-scroll-top: radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0));--bg-scroll-bottom: radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0)) 0 100%;--bg-size-scroll-start: 100% 40px;--bg-size-scroll-end: 100% 40px;--bg-size-scroll-top: 100% 16px;--bg-size-scroll-bottom: 100% 16px;background:var(--bg-scroll-start),var(--bg-scroll-end),var(--bg-scroll-top),var(--bg-scroll-bottom);background-repeat:no-repeat;background-color:var(--dt-color-container-default);background-size:var(--bg-size-scroll-start),var(--bg-size-scroll-end),var(--bg-size-scroll-top),var(--bg-size-scroll-bottom);background-attachment:local,local,scroll,scroll}.c-modal .c-modal-content{--modal-content-font-size: calc(var(--dt-font-size-16) * 1px);--modal-content-font-weight: var(--dt-font-weight-regular);--modal-content-line-height: calc(var(--dt-font-size-16-line-height) * 1px);--modal-content-padding: var(--dt-spacing-e);--modal-content-padding-block: var(--dt-spacing-a);--spinner-size: 48px;--spinner-border-width: 6px;--spinner-base-color-h: var(--dt-color-content-interactive-secondary-h);--spinner-base-color-s: var(--dt-color-content-interactive-secondary-s);--spinner-base-color-l: var(--dt-color-content-interactive-secondary-l);--spinner-left-color-opacity: .35;--spinner-left-color: hsl(var(--spinner-base-color-h), var(--spinner-base-color-s), var(--spinner-base-color-l), var(--spinner-left-color-opacity));--spinner-right-color: hsl(var(--spinner-base-color-h), var(--spinner-base-color-s), var(--spinner-base-color-l), 1);--spinner-animation-duration: 1.15s;--spinner-animation-timing-function: linear;--spinner-animation-iteration-count: infinite;position:relative;min-block-size:var(--dt-spacing-j);font-size:var(--modal-content-font-size);line-height:var(--modal-content-line-height);font-weight:var(--modal-content-font-weight);padding-inline:var(--modal-content-padding);padding-block:var(--modal-content-padding-block)}.c-modal .c-modal-content--scrollable{background:linear-gradient(to bottom,transparent,var(--dt-color-container-default) 75%) center bottom,linear-gradient(transparent,var(--dt-color-border-strong)) center bottom;background-repeat:no-repeat;background-size:100% 48px,100% 12px;background-attachment:local,scroll}.c-modal .c-modal-content:before{content:"";position:absolute;left:50%;top:50%;translate:-50% -50%;height:var(--spinner-size);width:var(--spinner-size);display:block;background-color:transparent;border-radius:50%;border-color:var(--spinner-left-color) var(--spinner-right-color) var(--spinner-right-color) var(--spinner-left-color);border-width:var(--spinner-border-width);border-style:solid;will-change:transform;opacity:0}.c-modal[isLoading] .c-modal-content:before{animation:rotate360 var(--spinner-animation-duration) var(--spinner-animation-timing-function) var(--spinner-animation-iteration-count);opacity:1}.c-modal[isLoading] .c-modal-content .c-modal-contentInner{opacity:0}
+`, _e = ["h1", "h2", "h3", "h4", "h5", "h6"], ze = ["small", "medium", "large"], Ce = ["top", "center"], S = "pie-modal-close", x = "pie-modal-open", B = "pie-modal-back", Ae = "pie-modal-leading-action-click", Oe = "pie-modal-supporting-action-click";
+var $e = Object.defineProperty, Le = Object.getOwnPropertyDescriptor, d = (n, e, t, i) => {
+  for (var o = i > 1 ? void 0 : i ? Le(e, t) : e, a = n.length - 1, l; a >= 0; a--)
+    (l = n[a]) && (o = (i ? l(e, t, o) : l(o)) || o);
+  return i && o && $e(e, t, o), o;
 };
-const C = "pie-modal";
-class d extends ye(L) {
+const k = "pie-modal";
+class s extends ne(O) {
   constructor() {
-    super(), this.headingLevel = "h2", this.hasBackButton = !1, this.hasStackedActions = !1, this.isDismissible = !1, this.isFooterPinned = !0, this.isFullWidthBelowMid = !1, this.isLoading = !1, this.isOpen = !1, this.position = "center", this.size = "medium", this._backButtonClicked = !1, this._handleDialogCancelEvent = (t) => {
-      this.isDismissible || t.preventDefault();
-    }, this._handleDialogLightDismiss = (t) => {
-      var p;
+    super(...arguments), this.headingLevel = "h2", this.hasBackButton = !1, this.hasStackedActions = !1, this.isDismissible = !1, this.isFooterPinned = !0, this.isFullWidthBelowMid = !1, this.isLoading = !1, this.isOpen = !1, this.position = "center", this.size = "medium", this._backButtonClicked = !1, this._handleDialogCancelEvent = (e) => {
+      this.isDismissible || e.preventDefault();
+    }, this._handleDialogLightDismiss = (e) => {
+      var u;
       if (!this.isDismissible)
         return;
-      const o = (p = this._dialog) == null ? void 0 : p.getBoundingClientRect(), {
+      const t = (u = this._dialog) == null ? void 0 : u.getBoundingClientRect(), {
         top: i = 0,
-        bottom: n = 0,
+        bottom: o = 0,
         left: a = 0,
-        right: r = 0
-      } = o || {};
-      if (i === 0 && n === 0 && a === 0 && r === 0)
+        right: l = 0
+      } = t || {};
+      if (i === 0 && o === 0 && a === 0 && l === 0)
         return;
-      (t.clientY < i || t.clientY > n || t.clientX < a || t.clientX > r) && (this.isOpen = !1);
-    }, this._dispatchModalCustomEvent = (t) => {
-      const o = new CustomEvent(t, {
+      (e.clientY < i || e.clientY > o || e.clientX < a || e.clientX > l) && (this.isOpen = !1);
+    }, this._dispatchModalCustomEvent = (e) => {
+      const t = new CustomEvent(e, {
         bubbles: !0,
         composed: !0
       });
-      this.dispatchEvent(o);
-    }, this.addEventListener("click", (t) => this._handleDialogLightDismiss(t));
+      this.dispatchEvent(t);
+    };
   }
   connectedCallback() {
-    super.connectedCallback(), document.addEventListener(z, this._handleModalOpened.bind(this)), document.addEventListener(P, this._handleModalClosed.bind(this)), document.addEventListener(T, this._handleModalClosed.bind(this));
+    super.connectedCallback(), this.addEventListener("click", (e) => this._handleDialogLightDismiss(e)), document.addEventListener(x, this._handleModalOpened.bind(this)), document.addEventListener(S, this._handleModalClosed.bind(this)), document.addEventListener(B, this._handleModalClosed.bind(this));
   }
   disconnectedCallback() {
-    document.removeEventListener(z, this._handleModalOpened.bind(this)), document.removeEventListener(P, this._handleModalClosed.bind(this)), document.removeEventListener(T, this._handleModalClosed.bind(this)), super.disconnectedCallback();
+    document.removeEventListener(x, this._handleModalOpened.bind(this)), document.removeEventListener(S, this._handleModalClosed.bind(this)), document.removeEventListener(B, this._handleModalClosed.bind(this)), super.disconnectedCallback();
   }
-  firstUpdated(t) {
-    this._dialog && (l.registerDialog(this._dialog), this._dialog.addEventListener("cancel", (o) => this._handleDialogCancelEvent(o)), this._dialog.addEventListener("close", () => {
+  async firstUpdated(e) {
+    super.firstUpdated(e), this._dialog && ((await import("./dialog-polyfill.esm-29edb142.js").then((i) => i.default)).registerDialog(this._dialog), this._dialog.addEventListener("cancel", (i) => this._handleDialogCancelEvent(i)), this._dialog.addEventListener("close", () => {
       this.isOpen = !1;
-    })), this._handleModalOpenStateOnFirstRender(t);
+    })), this._handleModalOpenStateOnFirstRender(e);
   }
-  updated(t) {
-    this._handleModalOpenStateChanged(t);
+  updated(e) {
+    super.updated(e), this._handleModalOpenStateChanged(e);
   }
   /**
    * Opens the dialog element and disables page scrolling
    */
   _handleModalOpened() {
-    var o, i, n, a;
-    const t = (o = this._dialog) == null ? void 0 : o.querySelector(".c-modal-scrollContainer");
-    t && Ce(t), !((i = this._dialog) != null && i.hasAttribute("open") || !((n = this._dialog) != null && n.isConnected)) && ((a = this._dialog) == null || a.showModal());
+    var t, i, o, a;
+    const e = (t = this._dialog) == null ? void 0 : t.querySelector(".c-modal-scrollContainer");
+    e && ye(e), !((i = this._dialog) != null && i.hasAttribute("open") || !((o = this._dialog) != null && o.isConnected)) && ((a = this._dialog) == null || a.showModal());
   }
   /**
    * Closes the dialog element and re-enables page scrolling
    */
   _handleModalClosed() {
-    var o, i;
-    const t = (o = this._dialog) == null ? void 0 : o.querySelector(".c-modal-scrollContainer");
-    t && ze(t), (i = this._dialog) == null || i.close(), this._returnFocus();
+    var t, i;
+    const e = (t = this._dialog) == null ? void 0 : t.querySelector(".c-modal-scrollContainer");
+    e && ke(e), (i = this._dialog) == null || i.close(), this._returnFocus();
   }
   // Handles the value of the isOpen property on first render of the component
-  _handleModalOpenStateOnFirstRender(t) {
-    t.get("isOpen") === void 0 && this.isOpen && this._dispatchModalCustomEvent(z);
+  _handleModalOpenStateOnFirstRender(e) {
+    e.get("isOpen") === void 0 && this.isOpen && this._dispatchModalCustomEvent(x);
   }
   // Handles changes to the modal isOpen property by dispatching any appropriate events
-  _handleModalOpenStateChanged(t) {
-    const o = t.get("isOpen");
-    o !== void 0 && (o ? this._backButtonClicked ? (this._backButtonClicked = !1, this._dispatchModalCustomEvent(T)) : this._dispatchModalCustomEvent(P) : this._dispatchModalCustomEvent(z));
+  _handleModalOpenStateChanged(e) {
+    const t = e.get("isOpen");
+    t !== void 0 && (t ? this._backButtonClicked ? (this._backButtonClicked = !1, this._dispatchModalCustomEvent(B)) : this._dispatchModalCustomEvent(S) : this._dispatchModalCustomEvent(x));
   }
-  _handleActionClick(t) {
-    var o, i;
-    t === "leading" ? ((o = this._dialog) == null || o.close("leading"), this._dispatchModalCustomEvent(Ke)) : t === "supporting" && ((i = this._dialog) == null || i.close("supporting"), this._dispatchModalCustomEvent(Xe));
+  _handleActionClick(e) {
+    var t, i;
+    e === "leading" ? ((t = this._dialog) == null || t.close("leading"), this._dispatchModalCustomEvent(Ae)) : e === "supporting" && ((i = this._dialog) == null || i.close("supporting"), this._dispatchModalCustomEvent(Oe));
   }
   /**
    * Return focus to the specified element, providing the selector is valid
    * and the chosen element can be found.
    */
   _returnFocus() {
-    var o, i;
-    const t = (o = this.returnFocusAfterCloseSelector) == null ? void 0 : o.trim();
-    t && ((i = document.querySelector(t)) == null || i.focus());
+    var t, i;
+    const e = (t = this.returnFocusAfterCloseSelector) == null ? void 0 : t.trim();
+    e && ((i = document.querySelector(e)) == null || i.focus());
   }
   /**
    * Template for the close button element. Called within the
@@ -779,15 +371,15 @@ class d extends ye(L) {
    * @private
    */
   renderCloseButton() {
-    var t;
-    return g`
+    var e;
+    return p`
             <pie-icon-button
                 @click="${() => {
       this.isOpen = !1;
     }}"
                 variant="ghost-secondary"
                 class="c-modal-closeBtn"
-                aria-label="${((t = this.aria) == null ? void 0 : t.close) || u}"
+                aria-label="${((e = this.aria) == null ? void 0 : e.close) || c}"
                 data-test-id="modal-close-button">
                 <icon-close></icon-close>
             </pie-icon-button>`;
@@ -799,17 +391,17 @@ class d extends ye(L) {
    * @private
    */
   renderBackButton() {
-    var t;
-    return g`
+    var e;
+    return p`
             <pie-icon-button
                 @click="${() => {
       this._backButtonClicked = !0, this.isOpen = !1;
     }}"
                 variant="ghost-secondary"
                 class="c-modal-backBtn"
-                aria-label="${((t = this.aria) == null ? void 0 : t.back) || u}"
+                aria-label="${((e = this.aria) == null ? void 0 : e.back) || c}"
                 data-test-id="modal-back-button">
-                ${this.isRTL ? g`<icon-chevron-right></icon-chevron-right>` : g`<icon-chevron-left></icon-chevron-left>`}
+                ${this.isRTL ? p`<icon-chevron-right></icon-chevron-right>` : p`<icon-chevron-left></icon-chevron-left>`}
             </pie-icon-button>
         `;
   }
@@ -823,18 +415,18 @@ class d extends ye(L) {
    * @private
    */
   renderLeadingAction() {
-    const { text: t, variant: o = "primary", ariaLabel: i } = this.leadingAction;
-    return t ? g`
+    const { text: e, variant: t = "primary", ariaLabel: i } = this.leadingAction;
+    return e ? p`
             <pie-button
-                variant="${o}"
-                aria-label="${i || u}"
+                variant="${t}"
+                aria-label="${i || c}"
                 type="submit"
                 ?isFullWidth="${this.hasStackedActions}"
                 @click="${() => this._handleActionClick("leading")}"
                 data-test-id="modal-leading-action">
-                ${t}
+                ${e}
             </pie-button>
-        ` : u;
+        ` : c;
   }
   /**
    * Render supportingAction button depending on prop availability.
@@ -848,76 +440,76 @@ class d extends ye(L) {
    * @private
    */
   renderSupportingAction() {
-    const { text: t, variant: o = "ghost", ariaLabel: i } = this.supportingAction;
-    return t ? this.leadingAction ? g`
+    const { text: e, variant: t = "ghost", ariaLabel: i } = this.supportingAction;
+    return e ? this.leadingAction ? p`
             <pie-button
-                variant="${o}"
-                aria-label="${i || u}"
+                variant="${t}"
+                aria-label="${i || c}"
                 type="reset"
                 ?isFullWidth="${this.hasStackedActions}"
                 @click="${() => this._handleActionClick("supporting")}"
                 data-test-id="modal-supporting-action">
-                ${t}
+                ${e}
             </pie-button>
-        ` : (console.warn("Use `leadingAction` instead of `supportingAction`. `supportingAction` is being ignored."), u) : u;
+        ` : (console.warn("Use `leadingAction` instead of `supportingAction`. `supportingAction` is being ignored."), c) : c;
   }
   /**
    * Renders the modal inner content and footer of the modal.
    * @private
    */
   renderModalContentAndFooter() {
-    return g`
+    return p`
         <article class="c-modal-scrollContainer c-modal-content c-modal-content--scrollable">
             <div class="c-modal-contentInner">
                 <slot></slot>
             </div>
         </article>
         <footer class="c-modal-footer">
-            ${this.leadingAction ? this.renderLeadingAction() : u}
-            ${this.supportingAction ? this.renderSupportingAction() : u}
+            ${this.leadingAction ? this.renderLeadingAction() : c}
+            ${this.supportingAction ? this.renderSupportingAction() : c}
         </footer>`;
   }
   render() {
     const {
-      aria: t,
-      hasBackButton: o,
+      aria: e,
+      hasBackButton: t,
       hasStackedActions: i,
-      heading: n,
+      heading: o,
       headingLevel: a = "h2",
-      isDismissible: r,
+      isDismissible: l,
       isFooterPinned: h,
-      isFullWidthBelowMid: p,
-      isLoading: y,
-      leadingAction: de,
-      position: ce,
-      size: he,
-      supportingAction: ue
-    } = this, q = ge(a);
-    return g`
+      isFullWidthBelowMid: u,
+      isLoading: L,
+      leadingAction: J,
+      position: Q,
+      size: K,
+      supportingAction: ee
+    } = this, F = oe(a);
+    return p`
         <dialog
             id="dialog"
             class="c-modal"
-            size="${he}"
-            position="${ce}"
-            ?hasActions=${de || ue}
-            ?hasBackButton=${o}
+            size="${K}"
+            position="${Q}"
+            ?hasActions=${J || ee}
+            ?hasBackButton=${t}
             ?hasStackedActions=${i}
-            ?isDismissible=${r}
+            ?isDismissible=${l}
             ?isFooterPinned=${h}
-            ?isFullWidthBelowMid=${p}
-            ?isLoading=${y}
-            aria-busy="${y ? "true" : "false"}"
-            aria-label="${y && (t == null ? void 0 : t.loading) || u}"
+            ?isFullWidthBelowMid=${u}
+            ?isLoading=${L}
+            aria-busy="${L ? "true" : "false"}"
+            aria-label="${L && (e == null ? void 0 : e.loading) || c}"
             data-test-id="pie-modal">
             <header class="c-modal-header">
-                ${o ? this.renderBackButton() : u}
-                <${q} class="c-modal-heading">
-                    ${n}
-                </${q}>
-                ${r ? this.renderCloseButton() : u}
+                ${t ? this.renderBackButton() : c}
+                <${F} class="c-modal-heading">
+                    ${o}
+                </${F}>
+                ${l ? this.renderCloseButton() : c}
             </header>
             ${// We need to wrap the remaining content in a shared scrollable container if the footer is not pinned
-    h ? this.renderModalContentAndFooter() : g`
+    h ? this.renderModalContentAndFooter() : p`
                         <div class="c-modal-scrollContainer">
                             ${this.renderModalContentAndFooter()}
                         </div>
@@ -925,68 +517,68 @@ class d extends ye(L) {
         </dialog>`;
   }
 }
-d.styles = pe(qe);
-c([
-  s({ type: Object })
-], d.prototype, "aria", 2);
-c([
-  s({ type: String }),
-  we(C)
-], d.prototype, "heading", 2);
-c([
-  s(),
-  N(C, We, "h2")
-], d.prototype, "headingLevel", 2);
-c([
-  s({ type: Boolean })
-], d.prototype, "hasBackButton", 2);
-c([
-  s({ type: Boolean })
-], d.prototype, "hasStackedActions", 2);
-c([
-  s({ type: Boolean, reflect: !0 })
-], d.prototype, "isDismissible", 2);
-c([
-  s({ type: Boolean })
-], d.prototype, "isFooterPinned", 2);
-c([
-  s({ type: Boolean })
-], d.prototype, "isFullWidthBelowMid", 2);
-c([
-  s({ type: Boolean, reflect: !0 })
-], d.prototype, "isLoading", 2);
-c([
-  s({ type: Boolean })
-], d.prototype, "isOpen", 2);
-c([
-  s({ type: Object })
-], d.prototype, "leadingAction", 2);
-c([
-  s(),
-  N(C, Ye, "center")
-], d.prototype, "position", 2);
-c([
-  s()
-], d.prototype, "returnFocusAfterCloseSelector", 2);
-c([
-  s(),
-  N(C, Ue, "medium")
-], d.prototype, "size", 2);
-c([
-  s({ type: Object })
-], d.prototype, "supportingAction", 2);
-c([
-  I("dialog")
-], d.prototype, "_dialog", 2);
-customElements.define(C, d);
+s.styles = ie(xe);
+d([
+  r({ type: Object })
+], s.prototype, "aria", 2);
+d([
+  r({ type: String }),
+  ae(k)
+], s.prototype, "heading", 2);
+d([
+  r(),
+  E(k, _e, "h2")
+], s.prototype, "headingLevel", 2);
+d([
+  r({ type: Boolean })
+], s.prototype, "hasBackButton", 2);
+d([
+  r({ type: Boolean })
+], s.prototype, "hasStackedActions", 2);
+d([
+  r({ type: Boolean, reflect: !0 })
+], s.prototype, "isDismissible", 2);
+d([
+  r({ type: Boolean })
+], s.prototype, "isFooterPinned", 2);
+d([
+  r({ type: Boolean })
+], s.prototype, "isFullWidthBelowMid", 2);
+d([
+  r({ type: Boolean, reflect: !0 })
+], s.prototype, "isLoading", 2);
+d([
+  r({ type: Boolean })
+], s.prototype, "isOpen", 2);
+d([
+  r({ type: Object })
+], s.prototype, "leadingAction", 2);
+d([
+  r(),
+  E(k, Ce, "center")
+], s.prototype, "position", 2);
+d([
+  r()
+], s.prototype, "returnFocusAfterCloseSelector", 2);
+d([
+  r(),
+  E(k, ze, "medium")
+], s.prototype, "size", 2);
+d([
+  r({ type: Object })
+], s.prototype, "supportingAction", 2);
+d([
+  $("dialog")
+], s.prototype, "_dialog", 2);
+customElements.define(k, s);
 export {
-  T as ON_MODAL_BACK_EVENT,
-  P as ON_MODAL_CLOSE_EVENT,
-  Ke as ON_MODAL_LEADING_ACTION_CLICK,
-  z as ON_MODAL_OPEN_EVENT,
-  Xe as ON_MODAL_SUPPORTING_ACTION_CLICK,
-  d as PieModal,
-  We as headingLevels,
-  Ye as positions,
-  Ue as sizes
+  B as ON_MODAL_BACK_EVENT,
+  S as ON_MODAL_CLOSE_EVENT,
+  Ae as ON_MODAL_LEADING_ACTION_CLICK,
+  x as ON_MODAL_OPEN_EVENT,
+  Oe as ON_MODAL_SUPPORTING_ACTION_CLICK,
+  s as PieModal,
+  _e as headingLevels,
+  Ce as positions,
+  ze as sizes
 };