@cal.macconnachie/web-components 2.4.7 → 2.4.9

package/dist/index.js

@@ -249,12 +249,12 @@ let $e = class extends HTMLElement {
 $e.elementStyles = [], $e.shadowRootOptions = { mode: "open" }, $e[Be("elementProperties")] = /* @__PURE__ */ new Map(), $e[Be("finalized")] = /* @__PURE__ */ new Map(), hs?.({ ReactiveElement: $e }), (ct.reactiveElementVersions ??= []).push("2.1.1");
 const Ot = globalThis, nt = Ot.trustedTypes, Qt = nt ? nt.createPolicy("lit-html", { createHTML: (r) => r }) : void 0, Cr = "$lit$", ce = `lit$${Math.random().toFixed(9).slice(2)}$`, Er = "?" + ce, ps = `<${Er}>`, ve = document, Ne = () => ve.createComment(""), qe = (r) => r === null || typeof r != "object" && typeof r != "function", Rt = Array.isArray, us = (r) => Rt(r) || typeof r?.[Symbol.iterator] == "function", yt = `[ 	
 \f\r]`, Me = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, er = /-->/g, tr = />/g, ue = RegExp(`>|${yt}(?:([^\\s"'>=/]+)(${yt}*=${yt}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`, "g"), rr = /'/g, sr = /"/g, Ar = /^(?:script|style|textarea|title)$/i, gs = (r) => (e, ...t) => ({ _$litType$: r, strings: e, values: t }), m = gs(1), oe = Symbol.for("lit-noChange"), k = Symbol.for("lit-nothing"), ir = /* @__PURE__ */ new WeakMap(), me = ve.createTreeWalker(ve, 129);
+\f\r"'\`<>=]|("|')|))|$)`, "g"), rr = /'/g, sr = /"/g, Ar = /^(?:script|style|textarea|title)$/i, ms = (r) => (e, ...t) => ({ _$litType$: r, strings: e, values: t }), g = ms(1), oe = Symbol.for("lit-noChange"), k = Symbol.for("lit-nothing"), ir = /* @__PURE__ */ new WeakMap(), ge = ve.createTreeWalker(ve, 129);
 function Tr(r, e) {
   if (!Rt(r) || !r.hasOwnProperty("raw")) throw Error("invalid template strings array");
   return Qt !== void 0 ? Qt.createHTML(e) : e;
 }
-const ms = (r, e) => {
+const gs = (r, e) => {
   const t = r.length - 1, i = [];
   let s, o = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", a = Me;
   for (let n = 0; n < t; n++) {
@@ -271,22 +271,22 @@ class Fe {
     let s;
     this.parts = [];
     let o = 0, a = 0;
-    const n = e.length - 1, c = this.parts, [p, d] = ms(e, t);
-    if (this.el = Fe.createElement(p, i), me.currentNode = this.el.content, t === 2 || t === 3) {
+    const n = e.length - 1, c = this.parts, [p, d] = gs(e, t);
+    if (this.el = Fe.createElement(p, i), ge.currentNode = this.el.content, t === 2 || t === 3) {
       const h = this.el.content.firstChild;
       h.replaceWith(...h.childNodes);
     }
-    for (; (s = me.nextNode()) !== null && c.length < n; ) {
+    for (; (s = ge.nextNode()) !== null && c.length < n; ) {
       if (s.nodeType === 1) {
         if (s.hasAttributes()) for (const h of s.getAttributeNames()) if (h.endsWith(Cr)) {
-          const b = d[a++], y = s.getAttribute(h).split(ce), g = /([.?@])?(.*)/.exec(b);
-          c.push({ type: 1, index: o, name: g[2], strings: y, ctor: g[1] === "." ? bs : g[1] === "?" ? vs : g[1] === "@" ? ys : dt }), s.removeAttribute(h);
+          const b = d[a++], y = s.getAttribute(h).split(ce), m = /([.?@])?(.*)/.exec(b);
+          c.push({ type: 1, index: o, name: m[2], strings: y, ctor: m[1] === "." ? bs : m[1] === "?" ? vs : m[1] === "@" ? ys : dt }), s.removeAttribute(h);
         } else h.startsWith(ce) && (c.push({ type: 6, index: o }), s.removeAttribute(h));
         if (Ar.test(s.tagName)) {
           const h = s.textContent.split(ce), b = h.length - 1;
           if (b > 0) {
             s.textContent = nt ? nt.emptyScript : "";
-            for (let y = 0; y < b; y++) s.append(h[y], Ne()), me.nextNode(), c.push({ type: 2, index: ++o });
+            for (let y = 0; y < b; y++) s.append(h[y], Ne()), ge.nextNode(), c.push({ type: 2, index: ++o });
             s.append(h[b], Ne());
           }
         }
@@ -321,16 +321,16 @@ let fs = class {
   }
   u(e) {
     const { el: { content: t }, parts: i } = this._$AD, s = (e?.creationScope ?? ve).importNode(t, !0);
-    me.currentNode = s;
-    let o = me.nextNode(), a = 0, n = 0, c = i[0];
+    ge.currentNode = s;
+    let o = ge.nextNode(), a = 0, n = 0, c = i[0];
     for (; c !== void 0; ) {
       if (a === c.index) {
         let p;
         c.type === 2 ? p = new _e(o, o.nextSibling, this, e) : c.type === 1 ? p = new c.ctor(o, c.name, c.strings, this, e) : c.type === 6 && (p = new ws(o, this, e)), this._$AV.push(p), c = i[++n];
       }
-      a !== c?.index && (o = me.nextNode(), a++);
+      a !== c?.index && (o = ge.nextNode(), a++);
     }
-    return me.currentNode = ve, s;
+    return ge.currentNode = ve, s;
   }
   p(e) {
     let t = 0;
@@ -575,7 +575,7 @@ const { I: As } = xs, or = () => document.createComment(""), Ie = (r, e, t) => {
     }
   }
   return t;
-}, ge = (r, e, t = r) => (r._$AI(e, t), r), Ts = {}, Ds = (r, e = Ts) => r._$AH = e, Ps = (r) => r._$AH, wt = (r) => {
+}, me = (r, e, t = r) => (r._$AI(e, t), r), Ts = {}, Ds = (r, e = Ts) => r._$AH = e, Ps = (r) => r._$AH, wt = (r) => {
   r._$AR(), r._$AA.remove();
 };
 const ar = (r, e, t) => {
@@ -601,25 +601,25 @@ const ar = (r, e, t) => {
     const s = Ps(r), { values: o, keys: a } = this.dt(e, t, i);
     if (!Array.isArray(s)) return this.ut = a, o;
     const n = this.ut ??= [], c = [];
-    let p, d, h = 0, b = s.length - 1, y = 0, g = o.length - 1;
-    for (; h <= b && y <= g; ) if (s[h] === null) h++;
+    let p, d, h = 0, b = s.length - 1, y = 0, m = o.length - 1;
+    for (; h <= b && y <= m; ) if (s[h] === null) h++;
     else if (s[b] === null) b--;
-    else if (n[h] === a[y]) c[y] = ge(s[h], o[y]), h++, y++;
-    else if (n[b] === a[g]) c[g] = ge(s[b], o[g]), b--, g--;
-    else if (n[h] === a[g]) c[g] = ge(s[h], o[g]), Ie(r, c[g + 1], s[h]), h++, g--;
-    else if (n[b] === a[y]) c[y] = ge(s[b], o[y]), Ie(r, s[h], s[b]), b--, y++;
-    else if (p === void 0 && (p = ar(a, y, g), d = ar(n, h, b)), p.has(n[h])) if (p.has(n[b])) {
+    else if (n[h] === a[y]) c[y] = me(s[h], o[y]), h++, y++;
+    else if (n[b] === a[m]) c[m] = me(s[b], o[m]), b--, m--;
+    else if (n[h] === a[m]) c[m] = me(s[h], o[m]), Ie(r, c[m + 1], s[h]), h++, m--;
+    else if (n[b] === a[y]) c[y] = me(s[b], o[y]), Ie(r, s[h], s[b]), b--, y++;
+    else if (p === void 0 && (p = ar(a, y, m), d = ar(n, h, b)), p.has(n[h])) if (p.has(n[b])) {
       const v = d.get(a[y]), f = v !== void 0 ? s[v] : null;
       if (f === null) {
         const x = Ie(r, s[h]);
-        ge(x, o[y]), c[y] = x;
-      } else c[y] = ge(f, o[y]), Ie(r, s[h], f), s[v] = null;
+        me(x, o[y]), c[y] = x;
+      } else c[y] = me(f, o[y]), Ie(r, s[h], f), s[v] = null;
       y++;
     } else wt(s[b]), b--;
     else wt(s[h]), h++;
-    for (; y <= g; ) {
-      const v = Ie(r, c[g + 1]);
-      ge(v, o[y]), c[y++] = v;
+    for (; y <= m; ) {
+      const v = Ie(r, c[m + 1]);
+      me(v, o[y]), c[y++] = v;
     }
     for (; h <= b; ) {
       const v = s[h++];
@@ -689,7 +689,7 @@ const z = ({
       password: h,
       accessToken: b,
       refreshToken: y,
-      idToken: g
+      idToken: m
     }) => {
       const v = await fetch(`${r}${e.login}`, {
         method: "POST",
@@ -702,7 +702,7 @@ const z = ({
           password: h,
           accessToken: b,
           refreshToken: y,
-          idToken: g
+          idToken: m
         })
       });
       if (!v.ok) {
@@ -775,7 +775,7 @@ const z = ({
       password: h,
       phone_number: b,
       family_name: y,
-      given_name: g,
+      given_name: m,
       code: v
     }) => {
       const f = await fetch(`${r}${e.register}`, {
@@ -789,7 +789,7 @@ const z = ({
           password: h,
           phone_number: b,
           family_name: y,
-          given_name: g,
+          given_name: m,
           code: v
         })
       });
@@ -834,8 +834,8 @@ const z = ({
         })
       });
       if (!y.ok) {
-        const g = await y.json();
-        throw new Error(g.message || g.error || "Failed to reset password");
+        const m = await y.json();
+        throw new Error(m.message || m.error || "Failed to reset password");
       }
       return y.json();
     }
@@ -898,7 +898,7 @@ const z = ({
   }, y = async () => {
     const x = await b();
     window.location.href = x;
-  }, g = (x) => {
+  }, m = (x) => {
     const _ = sessionStorage.getItem("oauth_state");
     return sessionStorage.removeItem("oauth_state"), _ === x;
   }, v = () => {
@@ -908,7 +908,7 @@ const z = ({
   return {
     redirectToGoogleAuth: h,
     redirectToAppleAuth: y,
-    validateState: g,
+    validateState: m,
     getCodeVerifier: v,
     exchangeCodeForTokens: async (x) => {
       const _ = v();
@@ -1362,8 +1362,8 @@ class E extends L {
     }
   }
   render() {
-    return this.isLoading && this.hasHandledOAuthCallback ? m`
-        ${this.logoUrl.length > 0 ? m`
+    return this.isLoading && this.hasHandledOAuthCallback ? g`
+        ${this.logoUrl.length > 0 ? g`
               <header class="modal-header">
                 <div class="auth-header">
                 <img
@@ -1393,9 +1393,9 @@ class E extends L {
             ${this.renderAlerts()}
           </div>
         </div>
-      ` : this.isLoggedIn ? m`
+      ` : this.isLoggedIn ? g`
         <!-- Header -->
-        ${this.logoUrl.length > 0 ? m`
+        ${this.logoUrl.length > 0 ? g`
               <header class="modal-header">
                 <div class="auth-header">
                 <img
@@ -1425,9 +1425,9 @@ class E extends L {
             ${this.renderAlerts()}
           </div>
         </div>
-      ` : m`
+      ` : g`
       <!-- Header -->
-      ${(!this.mode || this.resetStep === "none") && this.logoUrl.length > 0 && this.mode === "signin" ? m`
+      ${(!this.mode || this.resetStep === "none") && this.logoUrl.length > 0 && this.mode === "signin" ? g`
             <header class="modal-header">
 
                 <div class="auth-header">
@@ -1461,7 +1461,7 @@ class E extends L {
   }
   renderFormContent() {
     if (this.resetStep === "none" && (!this.mode || this.mode === "signin" || this.signupStep === "form"))
-      return m`
+      return g`
         <!-- Email -->
         <base-input
           id="email-input"
@@ -1487,7 +1487,7 @@ class E extends L {
           @input=${(e) => this.password = e.detail.value}
         ></base-input>
 
-        ${this.mode === "signin" && this.error ? m`
+        ${this.mode === "signin" && this.error ? g`
               <div class="forgot-row">
                 <button type="button" class="text-btn" @click=${this.startReset}>
                   Forgot your password?
@@ -1495,7 +1495,7 @@ class E extends L {
               </div>
             ` : k}
 
-        ${this.mode === "signup" ? m`
+        ${this.mode === "signup" ? g`
               <!-- Confirm Password -->
               <base-input
                 type="password"
@@ -1534,14 +1534,14 @@ class E extends L {
             ` : k}
       `;
     if (this.mode === "signup" && this.signupStep === "otp")
-      return m`
+      return g`
         <div class="otp-section">
           <label class="otp-label">Enter 6-digit code</label>
           <div class="otp-inputs" role="group" aria-label="One time code">
             ${nr(
         Array.from({ length: 6 }, (e, t) => t),
         (e) => e,
-        (e) => m`
+        (e) => g`
                 <input
                   class="otp-input signup-otp-input ${this.errors.signup_otp ? "otp-input--error" : ""}"
                   type="text"
@@ -1558,7 +1558,7 @@ class E extends L {
               `
       )}
           </div>
-          ${this.errors.signup_otp ? m`<p class="otp-error">${this.errors.signup_otp}</p>` : k}
+          ${this.errors.signup_otp ? g`<p class="otp-error">${this.errors.signup_otp}</p>` : k}
         </div>
         <div class="forgot-row">
           <button type="button" class="text-btn" @click=${this.backToSignupForm}>
@@ -1567,7 +1567,7 @@ class E extends L {
         </div>
       `;
     if (this.resetStep === "request")
-      return m`
+      return g`
         <base-input
           id="email-input"
           type="email"
@@ -1587,7 +1587,7 @@ class E extends L {
       `;
     if (this.resetStep === "confirm") {
       const e = this.otpDigits.every((t) => /^\d$/.test(t));
-      return m`
+      return g`
         <base-input
           type="email"
           label="Email Address"
@@ -1605,7 +1605,7 @@ class E extends L {
             ${nr(
         Array.from({ length: 6 }, (t, i) => i),
         (t) => t,
-        (t) => m`
+        (t) => g`
                 <input
                   class="otp-input reset-otp-input ${this.errors.otp ? "otp-input--error" : ""}"
                   type="text"
@@ -1622,10 +1622,10 @@ class E extends L {
               `
       )}
           </div>
-          ${this.errors.otp ? m`<p class="otp-error">${this.errors.otp}</p>` : k}
+          ${this.errors.otp ? g`<p class="otp-error">${this.errors.otp}</p>` : k}
         </div>
 
-        ${e ? m`
+        ${e ? g`
               <div class="new-password-fields">
                 <base-input
                   type="password"
@@ -1662,7 +1662,7 @@ class E extends L {
   }
   renderActions() {
     if (this.resetStep === "request")
-      return m`
+      return g`
         <base-button
           type="submit"
           variant="primary"
@@ -1675,7 +1675,7 @@ class E extends L {
         </base-button>
       `;
     if (this.resetStep === "confirm")
-      return this.otpDigits.every((t) => /^\d$/.test(t)) ? m`
+      return this.otpDigits.every((t) => /^\d$/.test(t)) ? g`
           <base-button
             type="submit"
             variant="primary"
@@ -1689,7 +1689,7 @@ class E extends L {
         ` : k;
     if (this.mode === "signup" && this.signupStep === "otp") {
       const e = this.signupOtpDigits.every((t) => /^\d$/.test(t));
-      return m`
+      return g`
         <base-button
           type="submit"
           variant="primary"
@@ -1702,7 +1702,7 @@ class E extends L {
         </base-button>
       `;
     }
-    return m`
+    return g`
       <base-button
         type="submit"
         variant="primary"
@@ -1714,7 +1714,7 @@ class E extends L {
         ${this.isLoading ? "Loading..." : this.mode === "signup" ? "Continue" : "Sign In"}
       </base-button>
 
-      ${this.isOAuthConfigured() && this.mode === "signin" ? m`
+      ${this.isOAuthConfigured() && this.mode === "signin" ? g`
             <div class="button-row">
               <button
                 type="button"
@@ -1738,8 +1738,8 @@ class E extends L {
     `;
   }
   renderAlerts() {
-    return m`
-      ${this.notice ? m`
+    return g`
+      ${this.notice ? g`
             <div class="alert alert--success">
               ${this.notice}
               <button class="alert-close" @click=${() => this.notice = ""} aria-label="Dismiss">
@@ -1747,7 +1747,7 @@ class E extends L {
               </button>
             </div>
           ` : k}
-      ${this.error && !this.isLoading ? m`
+      ${this.error && !this.isLoading ? g`
             <div class="alert alert--error">
               ${this.error}
               <button class="alert-close" @click=${() => this.error = ""} aria-label="Dismiss">
@@ -1758,7 +1758,7 @@ class E extends L {
     `;
   }
   renderFooter() {
-    return this.isLoggedIn ? k : this.resetStep === "none" && (!this.mode || this.mode === "signin" || this.signupStep === "form") ? this.disableSignup ? k : m`
+    return this.isLoggedIn ? k : this.resetStep === "none" && (!this.mode || this.mode === "signin" || this.signupStep === "form") ? this.disableSignup ? k : g`
         <div class="auth-footer">
           <p class="toggle-text">
             ${this.mode === "signup" ? "Already have an account?" : "Don't have an account?"}
@@ -1767,7 +1767,7 @@ class E extends L {
             ${this.mode === "signup" ? "Sign In" : "Sign Up"}
           </button>
         </div>
-      ` : m`
+      ` : g`
       <div class="auth-footer">
         <p class="toggle-text">
           Having trouble? Email
@@ -1777,7 +1777,7 @@ class E extends L {
     `;
   }
   renderGoogleIcon() {
-    return m`
+    return g`
       <svg viewBox="-0.5 0 48 48" width="18" height="18" fill="none">
         <path d="M9.82727273,24 C9.82727273,22.4757333 10.0804318,21.0144 10.5322727,19.6437333 L2.62345455,13.6042667 C1.08206818,16.7338667 0.213636364,20.2602667 0.213636364,24 C0.213636364,27.7365333 1.081,31.2608 2.62025,34.3882667 L10.5247955,28.3370667 C10.0772273,26.9728 9.82727273,25.5168 9.82727273,24" fill="#FBBC05"></path>
         <path d="M23.7136364,10.1333333 C27.025,10.1333333 30.0159091,11.3066667 32.3659091,13.2266667 L39.2022727,6.4 C35.0363636,2.77333333 29.6954545,0.533333333 23.7136364,0.533333333 C14.4268636,0.533333333 6.44540909,5.84426667 2.62345455,13.6042667 L10.5322727,19.6437333 C12.3545909,14.112 17.5491591,10.1333333 23.7136364,10.1333333" fill="#EB4335"></path>
@@ -1787,7 +1787,7 @@ class E extends L {
     `;
   }
   renderAppleIcon() {
-    return m`
+    return g`
       <svg viewBox="-3.5 0 48 48" width="18" height="18" class="apple-icon">
         <path d="M231.174735,567.792499 C232.740177,565.771699 233.926883,562.915484 233.497649,560 C230.939077,560.177808 227.948466,561.814769 226.203475,563.948463 C224.612784,565.88177 223.305444,568.757742 223.816036,571.549042 C226.613071,571.636535 229.499881,569.960061 231.174735,567.792499 L231.174735,567.792499 Z M245,595.217241 C243.880625,597.712195 243.341978,598.827022 241.899976,601.03692 C239.888467,604.121745 237.052156,607.962958 233.53412,607.991182 C230.411652,608.02505 229.606488,605.94498 225.367451,605.970382 C221.128414,605.99296 220.244696,608.030695 217.116618,607.999649 C213.601387,607.968603 210.913765,604.502761 208.902256,601.417937 C203.27452,592.79849 202.68257,582.680377 206.152914,577.298162 C208.621711,573.476705 212.515678,571.241407 216.173986,571.241407 C219.89682,571.241407 222.239372,573.296075 225.322563,573.296075 C228.313175,573.296075 230.133913,571.235762 234.440281,571.235762 C237.700215,571.235762 241.153726,573.022307 243.611302,576.10431 C235.554045,580.546683 236.85858,592.121127 245,595.217241 L245,595.217241 Z" transform="translate(-204.000000, -560.000000)" fill="#0b0b0a"></path>
       </svg>
@@ -2623,7 +2623,7 @@ class de extends L {
       "base-button--loading": this.loading,
       [`base-button--hover-${this.hover}`]: !!this.hover
     };
-    return m`
+    return g`
       <button
         class=${S(e)}
         type=${this.type}
@@ -2633,7 +2633,7 @@ class de extends L {
           <span class=${S({ "button-text": !0, hidden: this.loading })}>
             <slot></slot>
           </span>
-          ${this.loading ? m`
+          ${this.loading ? g`
                 <span class="loading-container">
                   <slot name="loading">
                     <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
@@ -2909,9 +2909,9 @@ class Ce extends L {
       [`base-card--padding-${this.padding}`]: !0,
       "base-card--hoverable": this.hoverable,
       "base-card--expandable": this.expandable
-    }, t = m`
+    }, t = g`
       <div class=${S(e)}>
-        ${this.expandable && !this.isExpanded ? m`
+        ${this.expandable && !this.isExpanded ? g`
               <button
                 class="expand-btn"
                 aria-label="Expand card"
@@ -2925,7 +2925,7 @@ class Ce extends L {
         <slot></slot>
       </div>
     `;
-    return this.isExpanded ? m`
+    return this.isExpanded ? g`
         <div class="expanded-overlay" @click=${this.handleOverlayClick}>
           <div class="expanded-card">
             ${t}
@@ -3561,12 +3561,12 @@ class D extends L {
       "date-display--empty": !this.value,
       "date-disabled": this.disabled
     };
-    return m`
+    return g`
       <div class="date-picker-group">
-        ${this.label ? m`
+        ${this.label ? g`
               <label for=${this.inputId} class="date-picker-label">
                 ${this.label}
-                ${this.required ? m`<span class="required-indicator" aria-label="required">*</span>` : ""}
+                ${this.required ? g`<span class="required-indicator" aria-label="required">*</span>` : ""}
               </label>
             ` : ""}
 
@@ -3590,7 +3590,7 @@ class D extends L {
             <base-icon name="calendar-day" size="20px"></base-icon>
           </div>
 
-          ${this.isOpen ? m`
+          ${this.isOpen ? g`
                 <div class="calendar-overlay" @click=${this.closeCalendar}></div>
                 <div
                   class=${S({
@@ -3601,12 +3601,12 @@ class D extends L {
                   role="dialog"
                   aria-label="Choose date"
                 >
-                  ${this.showMonthPicker ? m`
+                  ${this.showMonthPicker ? g`
                         <div class="picker-overlay">
                           <div class="month-picker-container">
                             <div class="month-picker-grid">
                               ${this.monthNames.map(
-      (s, o) => m`
+      (s, o) => g`
                                   <div
                                     class=${S({
         "month-item": !0,
@@ -3621,7 +3621,7 @@ class D extends L {
                             </div>
                           </div>
                         </div>
-                      ` : this.showYearPicker ? m`
+                      ` : this.showYearPicker ? g`
                           <div class="picker-overlay">
                             <div class="year-picker-container">
                               <div class="year-picker-header">
@@ -3645,7 +3645,7 @@ class D extends L {
                               </div>
                               <div class="year-picker-grid">
                                 ${this.yearRange.map(
-      (s) => m`
+      (s) => g`
                                     <div
                                       class=${S({
         "year-item": !0,
@@ -3660,7 +3660,7 @@ class D extends L {
                               </div>
                             </div>
                           </div>
-                        ` : m`
+                        ` : g`
                           <div class="calendar-header">
                             <button
                               type="button"
@@ -3689,12 +3689,12 @@ class D extends L {
                           </div>
 
                           <div class="calendar-weekdays">
-                            ${this.weekDays.map((s) => m`<div class="calendar-weekday">${s}</div>`)}
+                            ${this.weekDays.map((s) => g`<div class="calendar-weekday">${s}</div>`)}
                           </div>
 
                           <div class="calendar-days">
                             ${this.calendarDays.map(
-      (s) => s ? m`
+      (s) => s ? g`
                                       <div
                                         class=${S({
         "calendar-day": !0,
@@ -3706,7 +3706,7 @@ class D extends L {
                                       >
                                         ${s}
                                       </div>
-                                    ` : m`<div class="calendar-day day-empty"></div>`
+                                    ` : g`<div class="calendar-day day-empty"></div>`
     )}
                           </div>
 
@@ -3724,11 +3724,11 @@ class D extends L {
               ` : ""}
         </div>
 
-        ${e ? m`
+        ${e ? g`
               <div id="${this.inputId}-error" class="date-picker-error" role="alert">
                 ${this.error}
               </div>
-            ` : this.hint ? m` <div class="date-picker-hint">${this.hint}</div> ` : ""}
+            ` : this.hint ? g` <div class="date-picker-hint">${this.hint}</div> ` : ""}
       </div>
     `;
   }
@@ -4131,12 +4131,12 @@ class M extends L {
       "time-display--empty": !this.value,
       "time-disabled": this.disabled
     };
-    return m`
+    return g`
       <div class="time-picker-group">
-        ${this.label ? m`
+        ${this.label ? g`
               <label for=${this.inputId} class="time-picker-label">
                 ${this.label}
-                ${this.required ? m`<span class="required-indicator" aria-label="required">*</span>` : ""}
+                ${this.required ? g`<span class="required-indicator" aria-label="required">*</span>` : ""}
               </label>
             ` : ""}
 
@@ -4166,7 +4166,7 @@ class M extends L {
             </svg>
           </div>
 
-          ${this.isOpen ? m`
+          ${this.isOpen ? g`
                 <div class="time-overlay" @click=${this.closeTimePicker}></div>
                 <div
                   class=${S({
@@ -4182,7 +4182,7 @@ class M extends L {
                       <div class="time-column-label">Hour</div>
                       <div class="time-scroll">
                         ${this.hours.map(
-      (s) => m`
+      (s) => g`
                             <div
                               class=${S({
         "time-option": !0,
@@ -4201,7 +4201,7 @@ class M extends L {
                       <div class="time-column-label">Minute</div>
                       <div class="time-scroll">
                         ${this.minutes.map(
-      (s) => m`
+      (s) => g`
                             <div
                               class=${S({
         "time-option": !0,
@@ -4216,12 +4216,12 @@ class M extends L {
                       </div>
                     </div>
 
-                    ${this.format === "12" ? m`
+                    ${this.format === "12" ? g`
                           <div class="time-column">
                             <div class="time-column-label">Period</div>
                             <div class="time-scroll">
                               ${["AM", "PM"].map(
-      (s) => m`
+      (s) => g`
                                   <div
                                     class=${S({
         "time-option": !0,
@@ -4247,11 +4247,11 @@ class M extends L {
               ` : ""}
         </div>
 
-        ${e ? m`
+        ${e ? g`
               <div id="${this.inputId}-error" class="time-picker-error" role="alert">
                 ${this.error}
               </div>
-            ` : this.hint ? m` <div class="time-picker-hint">${this.hint}</div> ` : ""}
+            ` : this.hint ? g` <div class="time-picker-hint">${this.hint}</div> ` : ""}
       </div>
     `;
   }
@@ -4501,12 +4501,12 @@ class N extends L {
       "datetime-pickers--error": e,
       "datetime-pickers--disabled": this.disabled
     };
-    return m`
+    return g`
       <div class="datetime-picker-group">
-        ${this.label ? m`
+        ${this.label ? g`
               <label for=${this.inputId} class="datetime-picker-label">
                 ${this.label}
-                ${this.required ? m`<span class="required-indicator" aria-label="required">*</span>` : ""}
+                ${this.required ? g`<span class="required-indicator" aria-label="required">*</span>` : ""}
               </label>
             ` : ""}
 
@@ -4546,11 +4546,11 @@ class N extends L {
           </div>
         </div>
 
-        ${e ? m`
+        ${e ? g`
               <div id="${this.inputId}-error" class="datetime-picker-error" role="alert">
                 ${this.error}
               </div>
-            ` : this.hint ? m` <div class="datetime-picker-hint">${this.hint}</div> ` : ""}
+            ` : this.hint ? g` <div class="datetime-picker-hint">${this.hint}</div> ` : ""}
       </div>
     `;
   }
@@ -4662,16 +4662,16 @@ class j extends L {
       let c;
       e < 0 ? c = o + n : c = o - n;
       let p = this.currentDetentIndex;
-      const d = 0.5, h = 1, b = this.isClosable(), y = s[0], g = this.currentDetentIndex === 0;
+      const d = 0.5, h = 1, b = this.isClosable(), y = s[0], m = this.currentDetentIndex === 0;
       if (i > d && Math.abs(e) > 30)
-        e > 0 ? b ? i > h && g && e > 50 || c < y * 0.8 ? p = -1 : p = Math.max(0, this.currentDetentIndex - 1) : p = Math.max(0, this.currentDetentIndex - 1) : p = Math.min(s.length - 1, this.currentDetentIndex + 1);
+        e > 0 ? b ? i > h && m && e > 50 || c < y * 0.8 ? p = -1 : p = Math.max(0, this.currentDetentIndex - 1) : p = Math.max(0, this.currentDetentIndex - 1) : p = Math.min(s.length - 1, this.currentDetentIndex + 1);
       else {
         let _ = 0, C = Math.abs(c - s[0]);
         for (let T = 1; T < s.length; T++) {
           const B = Math.abs(c - s[T]);
           B < C && (C = B, _ = T);
         }
-        p = _, b && (g && c < y * 0.7 || c < y - 5) && (p = -1);
+        p = _, b && (m && c < y * 0.7 || c < y - 5) && (p = -1);
       }
       const v = p < 0, f = this.modalContainer, x = v ? 0 : s[p];
       if (f.style.transition = "none", e < 0) {
@@ -4819,7 +4819,7 @@ class j extends L {
       "modal-container--dragging": this.isDragging,
       [`modal-container--${this.size}`]: !0
     }, i = this.getCurrentDetentHeight(), s = this.getActiveDetents(), o = this.isClosable() || s.length > 1;
-    return m`
+    return g`
       <!-- Drawer Overlay -->
       <div
         class=${S(e)}
@@ -4832,7 +4832,7 @@ class j extends L {
           aria-modal="true"
         >
           <!-- Drawer Handle -->
-          ${o ? m`
+          ${o ? g`
             <div
               class="drawer-handle"
               @click=${this.handleHandleClick}
@@ -4858,6 +4858,10 @@ class j extends L {
   }
   static {
     this.styles = F`
+  :host {
+      --transition-slow: 300ms;
+    }
+
     /* Body scroll lock */
     :host(.modal-open) {
       overflow: hidden;
@@ -4896,15 +4900,12 @@ class j extends L {
       border-top-right-radius: var(--radius-xl);
       box-shadow: 0 -4px 6px -1px rgba(0, 0, 0, 0.1), 0 -2px 4px -1px rgba(0, 0, 0, 0.06);
       width: 100vw;
-      max-width: 100vw;
-      height: 85dvh;
       display: flex;
       flex-direction: column;
       overflow: hidden;
       animation: slideUp var(--transition-slow);
       transform-origin: bottom center;
       transition: height var(--transition-slow) cubic-bezier(0.4, 0, 0.2, 1);
-      padding-bottom: env(safe-area-inset-bottom);
     }
 
     .modal-container--closing {
@@ -5001,7 +5002,7 @@ class j extends L {
 
     @media (max-width: 640px) {
       .modal-container {
-        height: 80dvh;
+        padding-bottom: env(safe-area-inset-bottom);
       }
     }
 
@@ -5270,7 +5271,7 @@ const Gs = `<?xml version="1.0" encoding="UTF-8"?>
     </style>
   </defs>
   <path class="cls-1" d="M75.04,27.92s0-.04-.01-.06c0,0,0,0,0-.01,0,0,0-.01,0-.02-.34-1.04-1.31-1.74-2.4-1.74h0l-55.76.13c-.82,0-1.56.51-1.86,1.28s-.09,1.64.52,2.2l13.55,12.38-3.13,19.53c-.13.8.24,1.6.93,2.02.32.2.68.29,1.04.29.42,0,.83-.13,1.18-.38l45.03-32.88c.86-.63,1.23-1.72.94-2.73ZM21.99,30.2l38.9-.09-29.19,8.97-9.71-8.88ZM32.97,42.87l30.41-9.34-32.75,23.91,2.34-14.57Z"/>
-</svg>`, gi = `<?xml version="1.0" encoding="UTF-8"?>
+</svg>`, mi = `<?xml version="1.0" encoding="UTF-8"?>
 <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 90">
   <defs>
     <style>
@@ -5281,7 +5282,7 @@ const Gs = `<?xml version="1.0" encoding="UTF-8"?>
   </defs>
   <path class="cls-1" d="M77.83,43.24l-12.92-12.29c-.8-.76-2.06-.73-2.83.07-.76.8-.73,2.07.07,2.83l9.2,8.75-37.76.11c-1.1,0-2,.9-1.99,2.01,0,1.1.9,1.99,2,1.99h0l38.09-.11c.07,0,.14-.01.21-.02l-9.19,9.66c-.76.8-.73,2.07.07,2.83.39.37.88.55,1.38.55.53,0,1.06-.21,1.45-.62l12.29-12.92c.76-.8.73-2.07-.07-2.83Z"/>
   <path class="cls-1" d="M54.17,51.76c-1.1,0-2,.9-2,2v15.88c0,2.5-2.03,4.53-4.53,4.53h-27.57c-2.5,0-4.53-2.03-4.53-4.53V20.36c0-2.5,2.03-4.53,4.53-4.53h27.57c2.5,0,4.53,2.03,4.53,4.53v15.25c0,1.1.9,2,2,2s2-.9,2-2v-15.25c0-4.7-3.83-8.53-8.53-8.53h-27.57c-4.7,0-8.53,3.83-8.53,8.53v49.28c0,4.7,3.83,8.53,8.53,8.53h27.57c4.7,0,8.53-3.83,8.53-8.53v-15.88c0-1.1-.9-2-2-2Z"/>
-</svg>`, mi = `<?xml version="1.0" encoding="UTF-8"?>
+</svg>`, gi = `<?xml version="1.0" encoding="UTF-8"?>
 <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 90">
   <defs>
     <style>
@@ -5376,8 +5377,8 @@ const xi = /* @__PURE__ */ Object.assign({
   "../../public/icons/paperclip.svg": hi,
   "../../public/icons/reply.svg": pi,
   "../../public/icons/send.svg": ui,
-  "../../public/icons/share.svg": gi,
-  "../../public/icons/shopping-cart.svg": mi,
+  "../../public/icons/share.svg": mi,
+  "../../public/icons/shopping-cart.svg": gi,
   "../../public/icons/suitcase.svg": fi,
   "../../public/icons/sun.svg": bi,
   "../../public/icons/trash-can.svg": vi,
@@ -5435,7 +5436,7 @@ class Ee extends L {
     }
   }
   render() {
-    return m`
+    return g`
       <div
         style="
           --icon-size: ${this.size};
@@ -5650,12 +5651,12 @@ class G extends L {
       "base-input--error": e,
       "base-input--disabled": this.disabled
     };
-    return m`
+    return g`
       <div class="input-group">
-        ${this.label ? m`
+        ${this.label ? g`
               <label for=${this.inputId} class="input-label">
                 ${this.label}
-                ${this.required ? m`<span class="required-indicator" aria-label="required">*</span>` : ""}
+                ${this.required ? g`<span class="required-indicator" aria-label="required">*</span>` : ""}
               </label>
             ` : ""}
 
@@ -5681,11 +5682,11 @@ class G extends L {
           </div>
         </div>
 
-        ${e ? m`
+        ${e ? g`
               <div id="${this.inputId}-error" class="input-error" role="alert">
                 ${this.error}
               </div>
-            ` : this.hint ? m` <div class="input-hint">${this.hint}</div> ` : ""}
+            ` : this.hint ? g` <div class="input-hint">${this.hint}</div> ` : ""}
       </div>
     `;
   }
@@ -6089,12 +6090,12 @@ class R extends L {
       "select-input--visible": this.searchable && this.isOpen,
       "select-disabled": this.disabled
     };
-    return m`
+    return g`
       <div class="select-group">
-        ${this.label ? m`
+        ${this.label ? g`
               <label for=${this.selectId} class="select-label">
                 ${this.label}
-                ${this.required ? m`<span class="required-indicator" aria-label="required">*</span>` : ""}
+                ${this.required ? g`<span class="required-indicator" aria-label="required">*</span>` : ""}
               </label>
             ` : ""}
 
@@ -6136,7 +6137,7 @@ class R extends L {
             </svg>
           </div>
 
-          ${this.isOpen ? m`
+          ${this.isOpen ? g`
                 <div class="dropdown-overlay" @click=${this.closeDropdown}></div>
                 <div
                   class=${S({
@@ -6146,8 +6147,8 @@ class R extends L {
     })}
                   role="listbox"
                 >
-                  ${this.filteredOptions.length === 0 ? m` <div class="dropdown-no-results">No options found</div> ` : this.filteredOptions.map(
-      (o, a) => m`
+                  ${this.filteredOptions.length === 0 ? g` <div class="dropdown-no-results">No options found</div> ` : this.filteredOptions.map(
+      (o, a) => g`
                           <div
                             class=${S({
         "dropdown-option": !0,
@@ -6166,11 +6167,11 @@ class R extends L {
               ` : ""}
         </div>
 
-        ${e ? m`
+        ${e ? g`
               <div id="${this.selectId}-error" class="select-error" role="alert">
                 ${this.error}
               </div>
-            ` : this.hint ? m` <div class="select-hint">${this.hint}</div> ` : ""}
+            ` : this.hint ? g` <div class="select-hint">${this.hint}</div> ` : ""}
 
         <!-- Hidden slot for option elements -->
         <slot @slotchange=${this.parseSlottedOptions}></slot>
@@ -6291,7 +6292,7 @@ class Ae extends L {
     );
   }
   render() {
-    return m`
+    return g`
       <div
         class="base-tab"
         id="tabpanel-${this.id}"
@@ -6906,7 +6907,7 @@ class ie extends L {
       "tab-button": !0,
       "tab-button--active": i
     };
-    return m`
+    return g`
       <button
         role="tab"
         aria-selected=${i}
@@ -6917,9 +6918,9 @@ class ie extends L {
         @click=${() => this.handleTabClick(e.id)}
         @keydown=${(a) => this.handleKeyDown(a, t)}
       >
-        ${e.icon ? m`<span class="tab-icon">${Pr(e.icon)}</span>` : k}
-        ${s || this.variant !== "sidebar" || this.isMobile ? m`<span class="tab-label">${e.label}</span>` : k}
-        ${e.badge !== void 0 && e.badge > 0 && (s || this.variant !== "sidebar" || this.isMobile) ? m`<span class="tab-badge">${e.badge}</span>` : k}
+        ${e.icon ? g`<span class="tab-icon">${Pr(e.icon)}</span>` : k}
+        ${s || this.variant !== "sidebar" || this.isMobile ? g`<span class="tab-label">${e.label}</span>` : k}
+        ${e.badge !== void 0 && e.badge > 0 && (s || this.variant !== "sidebar" || this.isMobile) ? g`<span class="tab-badge">${e.badge}</span>` : k}
       </button>
     `;
   }
@@ -6934,9 +6935,9 @@ class ie extends L {
       "sidebar-toggle": !0,
       "sidebar-toggle--hidden": this.forceExpanded
     };
-    return m`
+    return g`
       <div class=${S(e)} role="tablist" aria-label=${this.ariaLabel}>
-        ${this.variant === "sidebar" ? m`
+        ${this.variant === "sidebar" ? g`
               <div class=${S(i)}>
                 <!-- Sidebar Header -->
                 <div class="sidebar-header">
@@ -6966,7 +6967,7 @@ class ie extends L {
                   <slot name="sidebar-footer"></slot>
                 </div>
               </div>
-            ` : m`
+            ` : g`
               <div class="tabs-header">
                 ${this.tabs.map((o, a) => this.renderTabButton(o, a))}
               </div>
@@ -7231,12 +7232,12 @@ class K extends L {
       "character-count--warning": s && !o,
       "character-count--error": o
     };
-    return m`
+    return g`
       <div class="textarea-group">
-        ${this.label ? m`
+        ${this.label ? g`
               <label for=${this.textareaId} class="textarea-label">
                 ${this.label}
-                ${this.required ? m`<span class="required-indicator" aria-label="required">*</span>` : ""}
+                ${this.required ? g`<span class="required-indicator" aria-label="required">*</span>` : ""}
               </label>
             ` : ""}
 
@@ -7257,18 +7258,18 @@ class K extends L {
             @focus=${this.handleFocus}
           ></textarea>
 
-          ${i ? m`
+          ${i ? g`
                 <div class=${S(n)}>
                   ${t}${this.maxlength ? ` / ${this.maxlength}` : ""}
                 </div>
               ` : ""}
         </div>
 
-        ${e ? m`
+        ${e ? g`
               <div id="${this.textareaId}-error" class="textarea-error" role="alert">
                 ${this.error}
               </div>
-            ` : this.hint ? m` <div class="textarea-hint">${this.hint}</div> ` : ""}
+            ` : this.hint ? g` <div class="textarea-hint">${this.hint}</div> ` : ""}
       </div>
     `;
   }
@@ -7723,13 +7724,13 @@ class Te extends L {
   `;
   }
   render() {
-    return m`
+    return g`
       <div class="toast-container ${this.variant}">
-        ${this.dismiss !== "manual" ? m`
+        ${this.dismiss !== "manual" ? g`
             <div class="toast-progress"></div>
           ` : ""}
         <slot></slot>
-        ${this.dismiss === "manual" ? m`
+        ${this.dismiss === "manual" ? g`
             <button
               class="toast-dismiss-btn ${this.variant}"
               aria-label="Dismiss toast"
@@ -7969,7 +7970,7 @@ class De extends L {
       "quantity-input": !0,
       [`quantity-input--${this.size}`]: !0
     };
-    return m`
+    return g`
       <div class=${S(e)}>
         <button
           type="button"
@@ -8082,7 +8083,7 @@ class Pe extends L {
   }
   render() {
     const e = (this.currentTheme + 1) % this.themes.length, t = this.themes[e], i = `Switch to ${t?.theme ?? "next"} theme`;
-    return m`
+    return g`
       <button
         class="theme-toggle ${this.getSizeClass()} ${this.getVariantClass()}"
         @click=${this.toggleTheme}
@@ -8266,7 +8267,7 @@ function Or(r, e) {
 const { toString: Ui } = Object.prototype, { getPrototypeOf: Bt } = Object, { iterator: pt, toStringTag: Rr } = Symbol, ut = /* @__PURE__ */ ((r) => (e) => {
   const t = Ui.call(e);
   return r[t] || (r[t] = t.slice(8, -1).toLowerCase());
-})(/* @__PURE__ */ Object.create(null)), te = (r) => (r = r.toLowerCase(), (e) => ut(e) === r), gt = (r) => (e) => typeof e === r, { isArray: Oe } = Array, Se = gt("undefined");
+})(/* @__PURE__ */ Object.create(null)), te = (r) => (r = r.toLowerCase(), (e) => ut(e) === r), mt = (r) => (e) => typeof e === r, { isArray: Oe } = Array, Se = mt("undefined");
 function We(r) {
   return r !== null && !Se(r) && r.constructor !== null && !Se(r.constructor) && Y(r.constructor.isBuffer) && r.constructor.isBuffer(r);
 }
@@ -8275,7 +8276,7 @@ function Ni(r) {
   let e;
   return typeof ArrayBuffer < "u" && ArrayBuffer.isView ? e = ArrayBuffer.isView(r) : e = r && r.buffer && zr(r.buffer), e;
 }
-const qi = gt("string"), Y = gt("function"), Mr = gt("number"), Ke = (r) => r !== null && typeof r == "object", Fi = (r) => r === !0 || r === !1, st = (r) => {
+const qi = mt("string"), Y = mt("function"), Mr = mt("number"), Ke = (r) => r !== null && typeof r == "object", Fi = (r) => r === !0 || r === !1, st = (r) => {
   if (ut(r) !== "object")
     return !1;
   const e = Bt(r);
@@ -8377,13 +8378,13 @@ const ro = (r, e, t, { allOwnKeys: i } = {}) => (Je(e, (s, o) => {
   function(t, i, s) {
     return i.toUpperCase() + s;
   }
-), lr = (({ hasOwnProperty: r }) => (e, t) => r.call(e, t))(Object.prototype), go = te("RegExp"), Br = (r, e) => {
+), lr = (({ hasOwnProperty: r }) => (e, t) => r.call(e, t))(Object.prototype), mo = te("RegExp"), Br = (r, e) => {
   const t = Object.getOwnPropertyDescriptors(r), i = {};
   Je(t, (s, o) => {
     let a;
     (a = e(s, o, r)) !== !1 && (i[o] = a || s);
   }), Object.defineProperties(r, i);
-}, mo = (r) => {
+}, go = (r) => {
   Br(r, (e, t) => {
     if (Y(r) && ["arguments", "caller", "callee"].indexOf(t) !== -1)
       return !1;
@@ -8456,7 +8457,7 @@ const wo = (r) => {
   isDate: ji,
   isFile: Vi,
   isBlob: Zi,
-  isRegExp: go,
+  isRegExp: mo,
   isFunction: Y,
   isStream: Wi,
   isURLSearchParams: Ji,
@@ -8480,7 +8481,7 @@ const wo = (r) => {
   hasOwnProp: lr,
   // an alias to avoid ESLint no-prototype-builtins detection
   reduceDescriptors: Br,
-  freezeMethods: mo,
+  freezeMethods: go,
   toObjectSet: fo,
   toCamelCase: uo,
   noop: bo,
@@ -8566,7 +8567,7 @@ function Co(r) {
 const Eo = l.toFlatObject(l, {}, null, function(e) {
   return /^is[A-Z]/.test(e);
 });
-function mt(r, e, t) {
+function gt(r, e, t) {
   if (!l.isObject(r))
     throw new TypeError("target must be an object");
   e = e || new FormData(), t = l.toFlatObject(t, {
@@ -8579,22 +8580,22 @@ function mt(r, e, t) {
   const i = t.metaTokens, s = t.visitor || d, o = t.dots, a = t.indexes, c = (t.Blob || typeof Blob < "u" && Blob) && l.isSpecCompliantForm(e);
   if (!l.isFunction(s))
     throw new TypeError("visitor must be a function");
-  function p(g) {
-    if (g === null) return "";
-    if (l.isDate(g))
-      return g.toISOString();
-    if (l.isBoolean(g))
-      return g.toString();
-    if (!c && l.isBlob(g))
+  function p(m) {
+    if (m === null) return "";
+    if (l.isDate(m))
+      return m.toISOString();
+    if (l.isBoolean(m))
+      return m.toString();
+    if (!c && l.isBlob(m))
       throw new $("Blob is not supported. Use a Buffer instead.");
-    return l.isArrayBuffer(g) || l.isTypedArray(g) ? c && typeof Blob == "function" ? new Blob([g]) : Buffer.from(g) : g;
+    return l.isArrayBuffer(m) || l.isTypedArray(m) ? c && typeof Blob == "function" ? new Blob([m]) : Buffer.from(m) : m;
   }
-  function d(g, v, f) {
-    let x = g;
-    if (g && !f && typeof g == "object") {
+  function d(m, v, f) {
+    let x = m;
+    if (m && !f && typeof m == "object") {
       if (l.endsWith(v, "{}"))
-        v = i ? v : v.slice(0, -2), g = JSON.stringify(g);
-      else if (l.isArray(g) && Co(g) || (l.isFileList(g) || l.endsWith(v, "[]")) && (x = l.toArray(g)))
+        v = i ? v : v.slice(0, -2), m = JSON.stringify(m);
+      else if (l.isArray(m) && Co(m) || (l.isFileList(m) || l.endsWith(v, "[]")) && (x = l.toArray(m)))
         return v = Fr(v), x.forEach(function(C, T) {
           !(l.isUndefined(C) || C === null) && e.append(
             // eslint-disable-next-line no-nested-ternary
@@ -8603,18 +8604,18 @@ function mt(r, e, t) {
           );
         }), !1;
     }
-    return Ct(g) ? !0 : (e.append(cr(f, v, o), p(g)), !1);
+    return Ct(m) ? !0 : (e.append(cr(f, v, o), p(m)), !1);
   }
   const h = [], b = Object.assign(Eo, {
     defaultVisitor: d,
     convertValue: p,
     isVisitable: Ct
   });
-  function y(g, v) {
-    if (!l.isUndefined(g)) {
-      if (h.indexOf(g) !== -1)
+  function y(m, v) {
+    if (!l.isUndefined(m)) {
+      if (h.indexOf(m) !== -1)
         throw Error("Circular reference detected in " + v.join("."));
-      h.push(g), l.forEach(g, function(x, _) {
+      h.push(m), l.forEach(m, function(x, _) {
         (!(l.isUndefined(x) || x === null) && s.call(
           e,
           x,
@@ -8644,7 +8645,7 @@ function dr(r) {
   });
 }
 function Ut(r, e) {
-  this._pairs = [], r && mt(r, this, e);
+  this._pairs = [], r && gt(r, this, e);
 }
 const Hr = Ut.prototype;
 Hr.append = function(e, t) {
@@ -8755,7 +8756,7 @@ self instanceof WorkerGlobalScope && typeof self.importScripts == "function", Mo
   ...Oo
 };
 function Lo(r, e) {
-  return mt(r, new q.classes.URLSearchParams(), {
+  return gt(r, new q.classes.URLSearchParams(), {
     visitor: function(t, i, s, o) {
       return q.isNode && l.isBuffer(t) ? (this.append(i, t.toString("base64")), !1) : o.defaultVisitor.apply(this, arguments);
     },
@@ -8818,7 +8819,7 @@ const Xe = {
         return Lo(e, this.formSerializer).toString();
       if ((n = l.isFileList(e)) || i.indexOf("multipart/form-data") > -1) {
         const c = this.env && this.env.FormData;
-        return mt(
+        return gt(
           n ? { "files[]": e } : e,
           c && new c(),
           this.formSerializer
@@ -9153,7 +9154,7 @@ const lt = (r, e, t = 3) => {
     total: r,
     loaded: i
   }), e[1]];
-}, gr = (r) => (...e) => l.asap(() => r(...e)), Jo = q.hasStandardBrowserEnv ? /* @__PURE__ */ ((r, e) => (t) => (t = new URL(t, q.origin), r.protocol === t.protocol && r.host === t.host && (e || r.port === t.port)))(
+}, mr = (r) => (...e) => l.asap(() => r(...e)), Jo = q.hasStandardBrowserEnv ? /* @__PURE__ */ ((r, e) => (t) => (t = new URL(t, q.origin), r.protocol === t.protocol && r.host === t.host && (e || r.port === t.port)))(
   new URL(q.origin),
   q.navigator && /(msie|trident)/i.test(q.navigator.userAgent)
 ) : () => !0, Xo = q.hasStandardBrowserEnv ? (
@@ -9195,7 +9196,7 @@ function Kr(r, e, t) {
   let i = !Go(e);
   return r && (i || t == !1) ? Qo(r, e) : e;
 }
-const mr = (r) => r instanceof W ? { ...r } : r;
+const gr = (r) => r instanceof W ? { ...r } : r;
 function ye(r, e) {
   e = e || {};
   const t = {};
@@ -9253,7 +9254,7 @@ function ye(r, e) {
     socketPath: a,
     responseEncoding: a,
     validateStatus: n,
-    headers: (p, d, h) => s(mr(p), mr(d), h, !0)
+    headers: (p, d, h) => s(gr(p), gr(d), h, !0)
   };
   return l.forEach(Object.keys({ ...r, ...e }), function(d) {
     const h = c[d] || s, b = h(r[d], e[d], d);
@@ -9286,9 +9287,9 @@ const Jr = (r) => {
     const s = Jr(r);
     let o = s.data;
     const a = W.from(s.headers).normalize();
-    let { responseType: n, onUploadProgress: c, onDownloadProgress: p } = s, d, h, b, y, g;
+    let { responseType: n, onUploadProgress: c, onDownloadProgress: p } = s, d, h, b, y, m;
     function v() {
-      y && y(), g && g(), s.cancelToken && s.cancelToken.unsubscribe(d), s.signal && s.signal.removeEventListener("abort", d);
+      y && y(), m && m(), s.cancelToken && s.cancelToken.unsubscribe(d), s.signal && s.signal.removeEventListener("abort", d);
     }
     let f = new XMLHttpRequest();
     f.open(s.method.toUpperCase(), s.url, !0), f.timeout = s.timeout;
@@ -9329,7 +9330,7 @@ const Jr = (r) => {
       )), f = null;
     }, o === void 0 && a.setContentType(null), "setRequestHeader" in f && l.forEach(a.toJSON(), function(T, B) {
       f.setRequestHeader(B, T);
-    }), l.isUndefined(s.withCredentials) || (f.withCredentials = !!s.withCredentials), n && n !== "json" && (f.responseType = s.responseType), p && ([b, g] = lt(p, !0), f.addEventListener("progress", b)), c && f.upload && ([h, y] = lt(c), f.upload.addEventListener("progress", h), f.upload.addEventListener("loadend", y)), (s.cancelToken || s.signal) && (d = (C) => {
+    }), l.isUndefined(s.withCredentials) || (f.withCredentials = !!s.withCredentials), n && n !== "json" && (f.responseType = s.responseType), p && ([b, m] = lt(p, !0), f.addEventListener("progress", b)), c && f.upload && ([h, y] = lt(c), f.upload.addEventListener("progress", h), f.upload.addEventListener("loadend", y)), (s.cancelToken || s.signal) && (d = (C) => {
       f && (i(!C || C.type ? new Re(null, r, f) : C), f.abort(), f = null);
     }, s.cancelToken && s.cancelToken.subscribe(d), s.signal && (s.signal.aborted ? d() : s.signal.addEventListener("abort", d)));
     const _ = Yo(s.url);
@@ -9438,46 +9439,46 @@ const Jr = (r) => {
   const { fetch: e, Request: t, Response: i } = r, s = e ? tt(e) : typeof fetch == "function", o = tt(t), a = tt(i);
   if (!s)
     return !1;
-  const n = s && tt(vr), c = s && (typeof yr == "function" ? /* @__PURE__ */ ((g) => (v) => g.encode(v))(new yr()) : async (g) => new Uint8Array(await new t(g).arrayBuffer())), p = o && n && wr(() => {
-    let g = !1;
+  const n = s && tt(vr), c = s && (typeof yr == "function" ? /* @__PURE__ */ ((m) => (v) => m.encode(v))(new yr()) : async (m) => new Uint8Array(await new t(m).arrayBuffer())), p = o && n && wr(() => {
+    let m = !1;
     const v = new t(q.origin, {
       body: new vr(),
       method: "POST",
       get duplex() {
-        return g = !0, "half";
+        return m = !0, "half";
       }
     }).headers.has("Content-Type");
-    return g && !v;
+    return m && !v;
   }), d = a && n && wr(() => l.isReadableStream(new i("").body)), h = {
-    stream: d && ((g) => g.body)
+    stream: d && ((m) => m.body)
   };
-  s && ["text", "arrayBuffer", "blob", "formData", "stream"].forEach((g) => {
-    !h[g] && (h[g] = (v, f) => {
-      let x = v && v[g];
+  s && ["text", "arrayBuffer", "blob", "formData", "stream"].forEach((m) => {
+    !h[m] && (h[m] = (v, f) => {
+      let x = v && v[m];
       if (x)
         return x.call(v);
-      throw new $(`Response type '${g}' is not supported`, $.ERR_NOT_SUPPORT, f);
+      throw new $(`Response type '${m}' is not supported`, $.ERR_NOT_SUPPORT, f);
     });
   });
-  const b = async (g) => {
-    if (g == null)
+  const b = async (m) => {
+    if (m == null)
       return 0;
-    if (l.isBlob(g))
-      return g.size;
-    if (l.isSpecCompliantForm(g))
+    if (l.isBlob(m))
+      return m.size;
+    if (l.isSpecCompliantForm(m))
       return (await new t(q.origin, {
         method: "POST",
-        body: g
+        body: m
       }).arrayBuffer()).byteLength;
-    if (l.isArrayBufferView(g) || l.isArrayBuffer(g))
-      return g.byteLength;
-    if (l.isURLSearchParams(g) && (g = g + ""), l.isString(g))
-      return (await c(g)).byteLength;
-  }, y = async (g, v) => {
-    const f = l.toFiniteNumber(g.getContentLength());
+    if (l.isArrayBufferView(m) || l.isArrayBuffer(m))
+      return m.byteLength;
+    if (l.isURLSearchParams(m) && (m = m + ""), l.isString(m))
+      return (await c(m)).byteLength;
+  }, y = async (m, v) => {
+    const f = l.toFiniteNumber(m.getContentLength());
     return f ?? b(v);
   };
-  return async (g) => {
+  return async (m) => {
     let {
       url: v,
       method: f,
@@ -9491,7 +9492,7 @@ const Jr = (r) => {
       headers: bt,
       withCredentials: Ge = "same-origin",
       fetchOptions: Ht
-    } = Jr(g), jt = e || fetch;
+    } = Jr(m), jt = e || fetch;
     J = J ? (J + "").toLowerCase() : "text";
     let Qe = ra([_, C && C.toAbortSignal()], T), ze = null;
     const pe = Qe && Qe.unsubscribe && (() => {
@@ -9508,7 +9509,7 @@ const Jr = (r) => {
         if (l.isFormData(x) && (xe = le.headers.get("content-type")) && bt.setContentType(xe), le.body) {
           const [vt, et] = ur(
             Vt,
-            lt(gr(he))
+            lt(mr(he))
           );
           x = fr(le.body, br, vt, et);
         }
@@ -9533,7 +9534,7 @@ const Jr = (r) => {
         });
         const xe = l.toFiniteNumber(ne.headers.get("content-length")), [vt, et] = B && ur(
           xe,
-          lt(gr(B), !0)
+          lt(mr(B), !0)
         ) || [];
         ne = new i(
           fr(ne.body, br, vt, () => {
@@ -9543,24 +9544,24 @@ const Jr = (r) => {
         );
       }
       J = J || "text";
-      let ts = await h[l.findKey(h, J) || "text"](ne, g);
+      let ts = await h[l.findKey(h, J) || "text"](ne, m);
       return !Yt && pe && pe(), await new Promise((le, xe) => {
         Wr(le, xe, {
           data: ts,
           headers: W.from(ne.headers),
           status: ne.status,
           statusText: ne.statusText,
-          config: g,
+          config: m,
           request: ze
         });
       });
     } catch (re) {
       throw pe && pe(), re && re.name === "TypeError" && /Load failed|fetch/i.test(re.message) ? Object.assign(
-        new $("Network Error", $.ERR_NETWORK, g, ze),
+        new $("Network Error", $.ERR_NETWORK, m, ze),
         {
           cause: re.cause || re
         }
-      ) : $.from(re, re && re.code, g, ze);
+      ) : $.from(re, re && re.code, m, ze);
     }
   };
 }, la = /* @__PURE__ */ new Map(), Xr = (r) => {
@@ -9753,8 +9754,8 @@ class be {
     );
     o && l.forEach(
       ["delete", "get", "head", "post", "put", "patch", "common"],
-      (g) => {
-        delete o[g];
+      (m) => {
+        delete o[m];
       }
     ), t.headers = W.concat(a, o);
     const n = [];
@@ -9768,17 +9769,17 @@ class be {
     });
     let d, h = 0, b;
     if (!c) {
-      const g = [$r.bind(this), void 0];
-      for (g.unshift(...n), g.push(...p), b = g.length, d = Promise.resolve(t); h < b; )
-        d = d.then(g[h++], g[h++]);
+      const m = [$r.bind(this), void 0];
+      for (m.unshift(...n), m.push(...p), b = m.length, d = Promise.resolve(t); h < b; )
+        d = d.then(m[h++], m[h++]);
       return d;
     }
     b = n.length;
     let y = t;
     for (; h < b; ) {
-      const g = n[h++], v = n[h++];
+      const m = n[h++], v = n[h++];
       try {
-        y = g(y);
+        y = m(y);
       } catch (f) {
         v.call(this, f);
         break;
@@ -9786,8 +9787,8 @@ class be {
     }
     try {
       d = $r.call(this, y);
-    } catch (g) {
-      return Promise.reject(g);
+    } catch (m) {
+      return Promise.reject(m);
     }
     for (h = 0, b = p.length; h < b; )
       d = d.then(p[h++], p[h++]);
@@ -9990,7 +9991,7 @@ P.CanceledError = Re;
 P.CancelToken = Ft;
 P.isCancel = Yr;
 P.VERSION = Qr;
-P.toFormData = mt;
+P.toFormData = gt;
 P.AxiosError = $;
 P.Cancel = P.CanceledError;
 P.all = function(e) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cal.macconnachie/web-components",
-  "version": "2.4.7",
+  "version": "2.4.9",
   "description": "Web components hosted on a CDN",
   "keywords": [
     "web-components",