monobill-mintui 0.1.2 → 0.1.3

package/dist/index.js

@@ -1,4 +1,5 @@
-class B extends HTMLElement {
+import { g as O } from "./check-DU-jKCe4.js";
+class q extends HTMLElement {
   constructor() {
     super(), this._darkModeObserver = null;
   }
@@ -34,17 +35,17 @@ class B extends HTMLElement {
     const e = this.getSize(), t = this.getAttribute("size") || "default", i = !!(this.style.width && this.style.height), s = this.getAttribute("data-button-variant"), r = document.documentElement.classList.contains("dark");
     let n;
     if (i) {
-      const h = this.getAttribute("data-button-tone") || "neutral";
-      s === "solid" ? h === "neutral" ? n = r ? "#ffffff" : "#0f172a" : n = "#ffffff" : n = r ? "#ffffff" : "#0f172a";
+      const l = this.getAttribute("data-button-tone") || "neutral";
+      s === "solid" ? l === "neutral" ? n = r ? "#ffffff" : "#0f172a" : n = "#ffffff" : n = r ? "#ffffff" : "#0f172a";
     } else
       n = r ? "#e2e8f0" : "#0f172a";
-    const a = t === "large" ? "2" : "4", l = !!(this.style.width && this.style.height), o = `
+    const a = t === "large" ? "2" : "4", c = !!(this.style.width && this.style.height), o = `
       <svg 
         xmlns="http://www.w3.org/2000/svg" 
         fill="none" 
         viewBox="0 0 24 24"
-        class="animate-spin ${l ? "" : e}"
-        style="${l ? `width: ${this.style.width}; height: ${this.style.height}; animation-duration: 0.8s;` : "animation-duration: 0.8s;"}"
+        class="animate-spin ${c ? "" : e}"
+        style="${c ? `width: ${this.style.width}; height: ${this.style.height}; animation-duration: 0.8s;` : "animation-duration: 0.8s;"}"
       >
         <circle
           cx="12"
@@ -85,15 +86,8 @@ class B extends HTMLElement {
     this.innerHTML = o.trim();
   }
 }
-customElements.get("mint-spinner") || customElements.define("mint-spinner", B);
-const F = /* @__PURE__ */ new Map();
-function P(x) {
-  F.set(x.name, x);
-}
-function z(x) {
-  return F.get(x);
-}
-class V extends HTMLElement {
+customElements.get("mint-spinner") || customElements.define("mint-spinner", q);
+class B extends HTMLElement {
   constructor() {
     super(), this._darkModeObserver = null;
   }
@@ -130,17 +124,17 @@ class V extends HTMLElement {
     return e ? `${e}/${this.getName()}.svg` : `/icons/${this.getName()}.svg`;
   }
   render() {
-    var a, l;
+    var a, c;
     const e = this.getName();
     if (!e) {
       this.innerHTML = "", this.style.maskImage = "", this.style.webkitMaskImage = "";
       return;
     }
-    if (!z(e)) {
+    if (!O(e)) {
       console.warn(`Icon "${e}" not found. Make sure you've imported the icon: import '@monobill-mintui/icon/icons/${e}'`), this.innerHTML = "", this.style.maskImage = "", this.style.webkitMaskImage = "";
       return;
     }
-    const i = this.closest("mint-button") || ((a = this.parentElement) == null ? void 0 : a.closest("mint-button")), s = this.closest("mint-switch") || ((l = this.parentElement) == null ? void 0 : l.closest("mint-switch"));
+    const i = this.closest("mint-button") || ((a = this.parentElement) == null ? void 0 : a.closest("mint-button")), s = this.closest("mint-switch") || ((c = this.parentElement) == null ? void 0 : c.closest("mint-switch"));
     let r;
     s ? r = "w-3 h-3" : i ? r = "w-5 h-5" : r = "w-[1.3em] h-[1.3em]", this.classList.remove("w-4", "h-4", "w-5", "h-5", "w-[1em]", "h-[1em]"), r.split(" ").forEach((o) => {
       o && this.classList.add(o);
@@ -151,14 +145,14 @@ class V extends HTMLElement {
     else if (i)
       this.classList.remove("text-gray-100", "text-gray-900");
     else {
-      const h = document.documentElement.classList.contains("dark") ? "text-gray-100" : "text-gray-900";
-      this.classList.remove("text-gray-100", "text-gray-900"), this.classList.add(h);
+      const l = document.documentElement.classList.contains("dark") ? "text-gray-100" : "text-gray-900";
+      this.classList.remove("text-gray-100", "text-gray-900"), this.classList.add(l);
     }
     this.innerHTML = "";
   }
 }
-customElements.get("mint-icon") || customElements.define("mint-icon", V);
-class R extends HTMLElement {
+customElements.get("mint-icon") || customElements.define("mint-icon", B);
+class z extends HTMLElement {
   constructor() {
     super(), this._button = null, this._clickHandler = null, this._isHandlingClick = !1, this._handleMouseDown = () => {
       this._button && !this.isDisabled() && !this.isLoading() && this._button.classList.add("mint-button-active");
@@ -216,11 +210,11 @@ class R extends HTMLElement {
     const t = (s = this._button) == null ? void 0 : s.querySelector(".mint-button-content");
     if (t && ((r = t.textContent) != null && r.trim())) return !1;
     if (this._button)
-      for (let l = this._button.firstChild; l; l = l.nextSibling) {
-        if (l.nodeType === Node.TEXT_NODE && ((n = l.textContent) != null && n.trim()))
+      for (let c = this._button.firstChild; c; c = c.nextSibling) {
+        if (c.nodeType === Node.TEXT_NODE && ((n = c.textContent) != null && n.trim()))
           return !1;
-        if (l.nodeType === Node.ELEMENT_NODE) {
-          const o = l;
+        if (c.nodeType === Node.ELEMENT_NODE) {
+          const o = c;
           if (o.tagName !== "MINT-ICON" && o.tagName !== "MINT-SPINNER" && !o.querySelector("mint-spinner") && !o.hasAttribute("slot") && o.className !== "mint-button-icon" && !(o.className === "mr-2" && o.querySelector("mint-spinner")) && (a = o.textContent) != null && a.trim())
             return !1;
         }
@@ -536,14 +530,14 @@ class R extends HTMLElement {
         "border-transparent"
         // Match other button border width
       ]
-    }, n = `${t}-${s}`, a = r[n] || r["solid-neutral"], l = [
+    }, n = `${t}-${s}`, a = r[n] || r["solid-neutral"], c = [
       ...i,
       ...a
     ];
-    return this.isFullWidth() && l.push("w-full"), l.join(" ");
+    return this.isFullWidth() && c.push("w-full"), c.join(" ");
   }
   render() {
-    var h, c, d, u, f;
+    var l, d, h, u, b;
     const e = this.isDisabled() || this.isLoading(), t = this.getType();
     if (!this._button) {
       for (this._button = document.createElement("button"); this.firstChild; )
@@ -556,12 +550,12 @@ class R extends HTMLElement {
       if (i)
         i.setAttribute("data-button-variant", this.getVariant()), i.setAttribute("data-button-tone", this.getTone()), "render" in i && typeof i.render == "function" && i.render();
       else {
-        const g = document.createElement("span");
-        g.className = "mr-2 inline-flex items-center";
+        const f = document.createElement("span");
+        f.className = "mr-2 inline-flex items-center";
         const _ = document.createElement("mint-spinner");
-        _.setAttribute("size", "default"), _.setAttribute("data-button-variant", this.getVariant()), _.setAttribute("data-button-tone", this.getTone()), _.style.width = "0.875rem", _.style.height = "0.875rem", g.appendChild(_), this._button.insertBefore(g, this._button.firstChild);
+        _.setAttribute("size", "default"), _.setAttribute("data-button-variant", this.getVariant()), _.setAttribute("data-button-tone", this.getTone()), _.style.width = "0.875rem", _.style.height = "0.875rem", f.appendChild(_), this._button.insertBefore(f, this._button.firstChild);
       }
-    else i && ((h = i.parentElement) == null || h.remove());
+    else i && ((l = i.parentElement) == null || l.remove());
     for (; this.firstChild && this.firstChild !== this._button; )
       this._button.appendChild(this.firstChild);
     const s = this.getIcon();
@@ -570,38 +564,38 @@ class R extends HTMLElement {
     const n = this.getIconPosition();
     let a = this._button.querySelector(".mint-button-content");
     if (a) {
-      const g = r && r.tagName === "MINT-ICON";
+      const f = r && r.tagName === "MINT-ICON";
       if (r && !r.parentElement) {
         const _ = (u = this._button.querySelector("mint-spinner")) == null ? void 0 : u.parentElement;
-        g || n === "left" ? _ ? _.insertAdjacentElement("afterend", r) : this._button.insertBefore(r, a) : a.insertAdjacentElement("afterend", r);
-      } else if (r && (g || n === "left") && r.nextSibling !== a) {
+        f || n === "left" ? _ ? _.insertAdjacentElement("afterend", r) : this._button.insertBefore(r, a) : a.insertAdjacentElement("afterend", r);
+      } else if (r && (f || n === "left") && r.nextSibling !== a) {
         r.remove();
-        const _ = (f = this._button.querySelector("mint-spinner")) == null ? void 0 : f.parentElement;
+        const _ = (b = this._button.querySelector("mint-spinner")) == null ? void 0 : b.parentElement;
         _ ? _.insertAdjacentElement("afterend", r) : this._button.insertBefore(r, a);
-      } else r && !g && n === "right" && r.previousSibling !== a && (r.remove(), a.insertAdjacentElement("afterend", r));
+      } else r && !f && n === "right" && r.previousSibling !== a && (r.remove(), a.insertAdjacentElement("afterend", r));
     } else {
-      const g = [];
+      const f = [];
       for (let _ = this._button.firstChild; _; _ = _.nextSibling) {
         if (_.nodeType !== Node.ELEMENT_NODE) {
-          g.push(_);
+          f.push(_);
           continue;
         }
         const m = _;
-        m.tagName !== "MINT-SPINNER" && !m.querySelector("mint-spinner") && _ !== r && !m.hasAttribute("slot") && !(m.className === "mr-2" && m.querySelector("mint-spinner")) && g.push(_);
+        m.tagName !== "MINT-SPINNER" && !m.querySelector("mint-spinner") && _ !== r && !m.hasAttribute("slot") && !(m.className === "mr-2" && m.querySelector("mint-spinner")) && f.push(_);
       }
-      if (g.length > 0) {
-        a = document.createElement("span"), a.className = "mint-button-content inline-flex items-center", g.forEach((m) => {
+      if (f.length > 0) {
+        a = document.createElement("span"), a.className = "mint-button-content inline-flex items-center", f.forEach((m) => {
           a.appendChild(m);
         });
-        const _ = (c = this._button.querySelector("mint-spinner")) == null ? void 0 : c.parentElement;
+        const _ = (d = this._button.querySelector("mint-spinner")) == null ? void 0 : d.parentElement;
         r && n === "left" ? _ ? (_.insertAdjacentElement("afterend", r), r.insertAdjacentElement("afterend", a)) : (this._button.insertBefore(r, this._button.firstChild), r.insertAdjacentElement("afterend", a)) : r && n === "right" ? _ ? (_.insertAdjacentElement("afterend", a), a.insertAdjacentElement("afterend", r)) : (this._button.insertBefore(a, this._button.firstChild), a.insertAdjacentElement("afterend", r)) : _ ? _.insertAdjacentElement("afterend", a) : this._button.insertBefore(a, this._button.firstChild);
       } else if (r && r.tagName === "MINT-ICON" && !r.parentElement) {
-        const _ = (d = this._button.querySelector("mint-spinner")) == null ? void 0 : d.parentElement;
+        const _ = (h = this._button.querySelector("mint-spinner")) == null ? void 0 : h.parentElement;
         _ ? _.insertAdjacentElement("afterend", r) : this._button.insertBefore(r, this._button.firstChild);
       }
     }
-    const l = this.isIconOnly();
-    r && (r.classList.contains("mint-button-icon") || r.classList.add("mint-button-icon"), r.classList.remove("mr-1.5", "ml-1.5"), l ? r.tagName === "MINT-ICON" ? (r.style.width = "1rem", r.style.height = "1rem", r.style.maxWidth = "1rem", r.style.maxHeight = "1rem", r.style.flexShrink = "0") : (r.style.maxWidth = "1rem", r.style.maxHeight = "1rem", r.style.flexShrink = "0", r.tagName === "svg" && (r.style.width = "1rem", r.style.height = "1rem")) : n === "left" ? r.classList.add("mr-1.5") : r.classList.add("ml-1.5"));
+    const c = this.isIconOnly();
+    r && (r.classList.contains("mint-button-icon") || r.classList.add("mint-button-icon"), r.classList.remove("mr-1.5", "ml-1.5"), c ? r.tagName === "MINT-ICON" ? (r.style.width = "1rem", r.style.height = "1rem", r.style.maxWidth = "1rem", r.style.maxHeight = "1rem", r.style.flexShrink = "0") : (r.style.maxWidth = "1rem", r.style.maxHeight = "1rem", r.style.flexShrink = "0", r.tagName === "svg" && (r.style.width = "1rem", r.style.height = "1rem")) : n === "left" ? r.classList.add("mr-1.5") : r.classList.add("ml-1.5"));
     const o = this.getButtonClasses();
     this._button.className = o;
   }
@@ -632,8 +626,8 @@ class R extends HTMLElement {
     });
   }
 }
-customElements.get("mint-button") || customElements.define("mint-button", R);
-class W extends HTMLElement {
+customElements.get("mint-button") || customElements.define("mint-button", z);
+class V extends HTMLElement {
   constructor() {
     super(), this._button = null, this._checked = !1;
   }
@@ -735,8 +729,8 @@ class W extends HTMLElement {
     if (s) {
       let a = n;
       a || (a = document.createElement("span"), a.className = this.getIconClasses(), r.appendChild(a));
-      let l = a.querySelector("mint-icon");
-      l || (l = document.createElement("mint-icon"), a.appendChild(l)), l.setAttribute("name", s);
+      let c = a.querySelector("mint-icon");
+      c || (c = document.createElement("mint-icon"), a.appendChild(c)), c.setAttribute("name", s);
     } else n && n.remove();
   }
   setupEventListeners() {
@@ -761,8 +755,8 @@ class W extends HTMLElement {
     ));
   }
 }
-customElements.get("mint-switch") || customElements.define("mint-switch", W);
-class j extends HTMLElement {
+customElements.get("mint-switch") || customElements.define("mint-switch", V);
+class R extends HTMLElement {
   // Store classes set via class attribute
   constructor() {
     super(), this._darkModeObserver = null, this._userClasses = /* @__PURE__ */ new Set();
@@ -868,12 +862,12 @@ class j extends HTMLElement {
       // Scales between 1rem (16px) and 1.125rem (18px)
       regular: "clamp(0.875rem, 1vw + 0.5rem, 0.875rem)"
       // Scales between 0.875rem (14px) and 0.875rem (14px)
-    }, l = a[e] || a.regular;
-    this.style.setProperty("font-size", l);
+    }, c = a[e] || a.regular;
+    this.style.setProperty("font-size", c);
   }
 }
-customElements.get("mint-text") || customElements.define("mint-text", j);
-class $ extends HTMLElement {
+customElements.get("mint-text") || customElements.define("mint-text", R);
+class W extends HTMLElement {
   constructor() {
     super(), this._childObserver = null;
   }
@@ -978,8 +972,8 @@ class $ extends HTMLElement {
     });
   }
 }
-customElements.get("mint-stack") || customElements.define("mint-stack", $);
-class Y extends HTMLElement {
+customElements.get("mint-stack") || customElements.define("mint-stack", W);
+class j extends HTMLElement {
   static get observedAttributes() {
     return [];
   }
@@ -996,8 +990,8 @@ class Y extends HTMLElement {
     this.classList.add("rounded-lg", "shadow", "bg-white", "dark:bg-gray-800", "border", "border-gray-200", "dark:border-gray-700", "overflow-hidden", "transition-colors", "duration-200");
   }
 }
-customElements.get("mint-card") || customElements.define("mint-card", Y);
-class U extends HTMLElement {
+customElements.get("mint-card") || customElements.define("mint-card", j);
+class $ extends HTMLElement {
   constructor() {
     super(), this._link = null, this._contentObserver = null;
   }
@@ -1063,8 +1057,8 @@ class U extends HTMLElement {
     });
   }
 }
-customElements.get("mint-link") || customElements.define("mint-link", U);
-class J extends HTMLElement {
+customElements.get("mint-link") || customElements.define("mint-link", $);
+class Y extends HTMLElement {
   constructor() {
     super(), this._button = null, this._historyDepth = 0, this._maxBackAttempts = 10, this._backAttempts = 0, this._initialUrl = "", this._initialOrigin = "", this._popstateHandler = null;
   }
@@ -1164,17 +1158,20 @@ class J extends HTMLElement {
     this._button || (this._button = document.createElement("mint-button"), this._button.setAttribute("variant", "neutral"), this._button.setAttribute("icon", "arrow-left"), this._button.addEventListener("click", (e) => this.handleClick(e)), this.appendChild(this._button));
   }
 }
-customElements.get("mint-back-button") || customElements.define("mint-back-button", J);
-class G extends HTMLElement {
+customElements.get("mint-back-button") || customElements.define("mint-back-button", Y);
+class U extends HTMLElement {
   constructor() {
     super(), this._pageContainer = null, this._header = null, this._titleElement = null, this._headingText = null, this._actionsSlot = null, this._bodySlot = null, this._darkModeObserver = null;
   }
   static get observedAttributes() {
-    return ["heading", "fallback-href", "show-back-button"];
+    return ["heading", "fallback-href", "show-back-button", "containered"];
   }
   connectedCallback() {
     this.classList.add("box-border", "m-0", "p-0", "border-0", "align-baseline", "block"), this.render(), this._observeDarkMode();
   }
+  attributeChangedCallback(e, t, i) {
+    t !== i && this.render();
+  }
   disconnectedCallback() {
     this._darkModeObserver && (this._darkModeObserver.disconnect(), this._darkModeObserver = null);
   }
@@ -1189,7 +1186,7 @@ class G extends HTMLElement {
   }
   render() {
     const e = this.getHeading();
-    this._pageContainer || (this._pageContainer = document.createElement("div"), this._pageContainer.className = "min-h-screen p-8 transition-colors duration-200", this.appendChild(this._pageContainer)), this._header || (this._header = document.createElement("div"), this._header.className = "flex justify-between mb-8", this._pageContainer.appendChild(this._header)), this._titleElement || (this._titleElement = document.createElement("div"), this._titleElement.className = "flex gap-4 min-w-0 flex-1", this._header.appendChild(this._titleElement));
+    this._pageContainer || (this._pageContainer = document.createElement("div"), this.appendChild(this._pageContainer)), this._applyContainerClasses(), this._header || (this._header = document.createElement("div"), this._header.className = "flex justify-between mb-8", this._pageContainer.appendChild(this._header)), this._titleElement || (this._titleElement = document.createElement("div"), this._titleElement.className = "flex gap-4 min-w-0 flex-1", this._header.appendChild(this._titleElement));
     let t = this._titleElement.querySelector("mint-back-button");
     if (this.shouldShowBackButton()) {
       t || (t = document.createElement("mint-back-button"), this._titleElement.insertBefore(t, this._titleElement.firstChild));
@@ -1199,11 +1196,14 @@ class G extends HTMLElement {
     e ? (this._headingText ? (this._headingText.classList.add("truncate", "min-w-0"), t && t.parentElement === this._titleElement ? this._headingText.previousSibling !== t && this._titleElement.insertBefore(this._headingText, t.nextSibling) : this._headingText.previousSibling && this._titleElement.insertBefore(this._headingText, this._titleElement.firstChild)) : (this._headingText = document.createElement("mint-text"), this._headingText.setAttribute("size", "heading"), this._headingText.setAttribute("bold", ""), this._headingText.classList.add("truncate", "min-w-0"), t && t.parentElement === this._titleElement ? this._titleElement.insertBefore(this._headingText, t.nextSibling) : this._titleElement.insertBefore(this._headingText, this._titleElement.firstChild)), this._headingText.textContent = e) : this._headingText && (this._headingText.remove(), this._headingText = null), this._actionsSlot ? this._actionsSlot.classList.contains("ml-4") || this._actionsSlot.classList.add("ml-4") : (this._actionsSlot = document.createElement("div"), this._actionsSlot.className = "flex gap-2 items-center ml-4", this._actionsSlot.setAttribute("slot", "actions"), this._header.appendChild(this._actionsSlot)), Array.from(this.children).filter(
       (n) => n !== this._pageContainer && n !== this._actionsSlot && n.getAttribute("slot") === "actions"
     ).forEach((n) => {
-      n.parentElement !== this._actionsSlot && this._actionsSlot.appendChild(n);
+      this._actionsSlot && n.parentElement !== this._actionsSlot && this._actionsSlot.appendChild(n);
     }), this._bodySlot || (this._bodySlot = document.createElement("div"), this._pageContainer.appendChild(this._bodySlot)), Array.from(this.children).forEach((n) => {
       n !== this._pageContainer && n.getAttribute("slot") !== "actions" && n !== this._actionsSlot && n !== this._header && n !== this._bodySlot && n !== this._headingText && n.parentElement !== this._bodySlot && n.parentElement !== this._pageContainer && this._bodySlot.appendChild(n);
     }), this._updateBackgroundColor();
   }
+  _applyContainerClasses() {
+    this._pageContainer && (this._pageContainer.classList.add("min-h-screen", "p-8", "transition-colors", "duration-200"), this.hasAttribute("containered") ? this._pageContainer.classList.add("max-w-6xl", "mx-auto", "w-full") : this._pageContainer.classList.remove("max-w-6xl", "mx-auto"));
+  }
   _updateBackgroundColor() {
     if (!this._pageContainer) return;
     document.documentElement.classList.contains("dark") ? (this._pageContainer.classList.remove("bg-gray-20"), this._pageContainer.classList.add("bg-gray-900")) : (this._pageContainer.classList.remove("bg-gray-900"), this._pageContainer.classList.add("bg-gray-20"));
@@ -1217,8 +1217,8 @@ class G extends HTMLElement {
     }));
   }
 }
-customElements.get("mint-page") || customElements.define("mint-page", G);
-class X extends HTMLElement {
+customElements.get("mint-page") || customElements.define("mint-page", U);
+class G extends HTMLElement {
   static get observedAttributes() {
     return ["columns", "sm", "md", "lg", "xl", "gap"];
   }
@@ -1271,16 +1271,8 @@ class X extends HTMLElement {
     });
   }
 }
-customElements.get("mint-grid") || customElements.define("mint-grid", X);
-const K = {
-  name: "close",
-  viewBox: "0 0 24 24",
-  path: "M6 18L18 6M6 6l12 12",
-  strokeLinecap: "round",
-  strokeLinejoin: "round"
-};
-P(K);
-class Z extends HTMLElement {
+customElements.get("mint-grid") || customElements.define("mint-grid", G);
+class J extends HTMLElement {
   constructor() {
     super(), this._overlay = null, this._modal = null, this._header = null, this._headingSlot = null, this._bodySlot = null, this._actionsSlot = null, this._closeButton = null, this._darkModeObserver = null;
   }
@@ -1314,31 +1306,31 @@ class Z extends HTMLElement {
   render() {
     const e = this.getId(), t = this.getHeading(), i = this.isOpen();
     if (e && (this.id = e), this._overlay || (this._overlay = document.createElement("div"), this._overlay.className = "fixed inset-0 bg-black bg-opacity-50 transition-opacity duration-200 z-40", this._overlay.addEventListener("click", () => this.close()), this.appendChild(this._overlay)), this._modal || (this._modal = document.createElement("div"), this._modal.className = "fixed inset-0 flex items-center justify-center p-2 pointer-events-none z-50", this.appendChild(this._modal)), i) {
-      let c = this._modal.querySelector(".modal-content");
-      c || (c = document.createElement("div"), c.className = "modal-content bg-white dark:bg-gray-800 rounded-lg shadow-xl max-w-2xl w-full max-h-[90vh] flex flex-col pointer-events-auto transition-all duration-200 ease-out transform", this._modal.appendChild(c)), this._animateEnter();
+      let d = this._modal.querySelector(".modal-content");
+      d || (d = document.createElement("div"), d.className = "modal-content bg-white dark:bg-gray-800 rounded-lg shadow-xl max-w-2xl w-full max-h-[90vh] flex flex-col pointer-events-auto transition-all duration-200 ease-out transform", this._modal.appendChild(d)), this._animateEnter();
     } else
       this._animateExit();
     let s = this._modal.querySelector(".modal-content");
     s || (s = document.createElement("div"), s.className = "modal-content bg-white dark:bg-gray-800 rounded-lg shadow-xl max-w-2xl w-full max-h-[90vh] flex flex-col pointer-events-auto transition-all duration-200 ease-out transform", this._modal.appendChild(s)), this._header || (this._header = document.createElement("div"), this._header.className = "flex items-center justify-between p-4 border-b border-gray-200 dark:border-gray-700", s.appendChild(this._header)), this._headingSlot || (this._headingSlot = document.createElement("div"), this._headingSlot.className = "flex-1", this._headingSlot.setAttribute("slot", "heading"), this._header.appendChild(this._headingSlot));
     let r = this._headingSlot.querySelector("mint-text");
     t ? (r || (r = document.createElement("mint-text"), r.setAttribute("size", "sub-heading"), r.setAttribute("bold", ""), this._headingSlot.appendChild(r)), r.textContent = t) : r && r.remove(), Array.from(this.children).filter(
-      (c) => c !== this._overlay && c !== this._modal && c !== this._headingSlot && c.getAttribute("slot") === "heading"
-    ).forEach((c) => {
-      c.parentElement !== this._headingSlot && this._headingSlot.appendChild(c);
+      (d) => d !== this._overlay && d !== this._modal && d !== this._headingSlot && d.getAttribute("slot") === "heading"
+    ).forEach((d) => {
+      d.parentElement !== this._headingSlot && this._headingSlot.appendChild(d);
     }), this._closeButton || (this._closeButton = document.createElement("mint-button"), this._closeButton.setAttribute("variant", "ghost"), this._closeButton.setAttribute("icon", "close"), this._closeButton.addEventListener("click", () => this.close()), this._header.appendChild(this._closeButton)), this._bodySlot || (this._bodySlot = document.createElement("div"), this._bodySlot.className = "flex-1 overflow-y-auto p-4", this._bodySlot.setAttribute("slot", "body"), s.appendChild(this._bodySlot)), Array.from(this.children).filter(
-      (c) => c !== this._overlay && c !== this._modal && c !== this._bodySlot && c.getAttribute("slot") === "body"
-    ).forEach((c) => {
-      c.parentElement !== this._bodySlot && this._bodySlot.appendChild(c);
+      (d) => d !== this._overlay && d !== this._modal && d !== this._bodySlot && d.getAttribute("slot") === "body"
+    ).forEach((d) => {
+      d.parentElement !== this._bodySlot && this._bodySlot.appendChild(d);
     }), this._actionsSlot || (this._actionsSlot = document.createElement("div"), this._actionsSlot.className = "p-4 border-t border-gray-200 dark:border-gray-700", this._actionsSlot.setAttribute("slot", "actions"), s.appendChild(this._actionsSlot));
-    let l = this._actionsSlot.querySelector("mint-stack");
-    l || (l = document.createElement("mint-stack"), l.setAttribute("direction", "horizontal"), l.className = "justify-end", this._actionsSlot.appendChild(l)), Array.from(this.children).filter(
-      (c) => c !== this._overlay && c !== this._modal && c !== this._actionsSlot && c.getAttribute("slot") === "actions"
-    ).forEach((c) => {
-      Array.from(c.children).forEach((u) => {
-        u.parentElement !== l && l.appendChild(u);
-      }), c.parentElement && c.remove();
-    }), Array.from(this.children).forEach((c) => {
-      c !== this._overlay && c !== this._modal && c.getAttribute("slot") !== "heading" && c.getAttribute("slot") !== "body" && c.getAttribute("slot") !== "actions" && c !== this._headingSlot && c !== this._bodySlot && c !== this._actionsSlot && c.parentElement !== this._bodySlot && this._bodySlot.appendChild(c);
+    let c = this._actionsSlot.querySelector("mint-stack");
+    c || (c = document.createElement("mint-stack"), c.setAttribute("direction", "horizontal"), c.className = "justify-end", this._actionsSlot.appendChild(c)), Array.from(this.children).filter(
+      (d) => d !== this._overlay && d !== this._modal && d !== this._actionsSlot && d.getAttribute("slot") === "actions"
+    ).forEach((d) => {
+      Array.from(d.children).forEach((u) => {
+        u.parentElement !== c && c.appendChild(u);
+      }), d.parentElement && d.remove();
+    }), Array.from(this.children).forEach((d) => {
+      d !== this._overlay && d !== this._modal && d.getAttribute("slot") !== "heading" && d.getAttribute("slot") !== "body" && d.getAttribute("slot") !== "actions" && d !== this._headingSlot && d !== this._bodySlot && d !== this._actionsSlot && d.parentElement !== this._bodySlot && this._bodySlot.appendChild(d);
     }), this._updateBackgroundColor();
   }
   _updateBackgroundColor() {
@@ -1375,8 +1367,8 @@ class Z extends HTMLElement {
     }, 200);
   }
 }
-customElements.get("mint-modal") || customElements.define("mint-modal", Z);
-class Q extends HTMLElement {
+customElements.get("mint-modal") || customElements.define("mint-modal", J);
+class X extends HTMLElement {
   constructor() {
     super(), this._overlay = null, this._popover = null, this._triggerElement = null, this._darkModeObserver = null, this._clickOutsideHandler = null, this._triggerClickHandler = null, this._triggerHoverEnterHandler = null, this._triggerHoverLeaveHandler = null, this._popoverHoverEnterHandler = null, this._popoverHoverLeaveHandler = null, this._hoverCloseTimeout = null, this._scrollHandler = null, this._resizeHandler = null;
   }
@@ -1488,38 +1480,38 @@ class Q extends HTMLElement {
     if (!t) return { top: 0, left: 0, direction: "down" };
     this.classList.contains("hidden") && (this.classList.remove("hidden"), this._popover.style.visibility = "hidden");
     const s = t.getBoundingClientRect(), r = window.innerWidth, n = window.innerHeight, a = 8;
-    let l = this.getDirection(), o = 0, h = 0;
-    switch (l) {
+    let c = this.getDirection(), o = 0, l = 0;
+    switch (c) {
       case "down":
-        if (o = e.bottom + a, h = e.left + e.width / 2 - s.width / 2, o + s.height > n) {
-          const c = e.top - s.height - a;
-          c >= 0 ? (l = "up", o = c) : (o = Math.max(0, n - s.height - a), o + s.height > n && (o = 0));
+        if (o = e.bottom + a, l = e.left + e.width / 2 - s.width / 2, o + s.height > n) {
+          const d = e.top - s.height - a;
+          d >= 0 ? (c = "up", o = d) : (o = Math.max(0, n - s.height - a), o + s.height > n && (o = 0));
         }
-        h < 0 && (h = a), h + s.width > r && (h = Math.max(a, r - s.width - a), h + s.width > r && (h = r - s.width));
+        l < 0 && (l = a), l + s.width > r && (l = Math.max(a, r - s.width - a), l + s.width > r && (l = r - s.width));
         break;
       case "up":
-        if (o = e.top - s.height - a, h = e.left + e.width / 2 - s.width / 2, o < 0) {
-          const c = e.bottom + a;
-          c + s.height <= n ? (l = "down", o = c) : (o = Math.min(n - s.height - a, n - s.height), o < 0 && (o = n - s.height));
+        if (o = e.top - s.height - a, l = e.left + e.width / 2 - s.width / 2, o < 0) {
+          const d = e.bottom + a;
+          d + s.height <= n ? (c = "down", o = d) : (o = Math.min(n - s.height - a, n - s.height), o < 0 && (o = n - s.height));
         }
-        h < 0 && (h = a), h + s.width > r && (h = Math.max(a, r - s.width - a), h + s.width > r && (h = r - s.width));
+        l < 0 && (l = a), l + s.width > r && (l = Math.max(a, r - s.width - a), l + s.width > r && (l = r - s.width));
         break;
       case "right":
-        if (o = e.top + e.height / 2 - s.height / 2, h = e.right + a, h + s.width > r) {
-          const c = e.left - s.width - a;
-          c >= 0 ? (l = "left", h = c) : (h = Math.max(0, r - s.width - a), h + s.width > r && (h = r - s.width));
+        if (o = e.top + e.height / 2 - s.height / 2, l = e.right + a, l + s.width > r) {
+          const d = e.left - s.width - a;
+          d >= 0 ? (c = "left", l = d) : (l = Math.max(0, r - s.width - a), l + s.width > r && (l = r - s.width));
         }
         o < 0 && (o = a), o + s.height > n && (o = Math.max(a, n - s.height - a), o + s.height > n && (o = n - s.height));
         break;
       case "left":
-        if (o = e.top + e.height / 2 - s.height / 2, h = e.left - s.width - a, h < 0) {
-          const c = e.right + a;
-          c + s.width <= r ? (l = "right", h = c) : (h = Math.min(r - s.width - a, r - s.width), h < 0 && (h = 0));
+        if (o = e.top + e.height / 2 - s.height / 2, l = e.left - s.width - a, l < 0) {
+          const d = e.right + a;
+          d + s.width <= r ? (c = "right", l = d) : (l = Math.min(r - s.width - a, r - s.width), l < 0 && (l = 0));
         }
         o < 0 && (o = a), o + s.height > n && (o = Math.max(a, n - s.height - a), o + s.height > n && (o = n - s.height));
         break;
     }
-    return { top: o, left: h, direction: l };
+    return { top: o, left: l, direction: c };
   }
   render() {
     const e = this.getId(), t = this.isOpen(), i = this.getPadding();
@@ -1527,8 +1519,8 @@ class Q extends HTMLElement {
       if (this.classList.remove("hidden"), this.style.pointerEvents = "auto", !this._clickOutsideHandler) {
         const n = this;
         this._clickOutsideHandler = function(a) {
-          const l = a.composedPath(), o = l.includes(n);
-          if (!(n._triggerElement && l.includes(n._triggerElement)) && !o) {
+          const c = a.composedPath(), o = c.includes(n);
+          if (!(n._triggerElement && c.includes(n._triggerElement)) && !o) {
             n.close();
             return;
           }
@@ -1543,8 +1535,8 @@ class Q extends HTMLElement {
     if (!s)
       s = document.createElement("div"), s.className = `popover-content bg-white dark:bg-gray-800 rounded-lg shadow-xl ${i} transition-all duration-200 ease-out transform`, this._popover.appendChild(s);
     else {
-      const n = s.className.split(" "), a = ["p-0", "p-0.5", "p-1", "p-1.5", "p-2", "p-2.5", "p-3", "p-3.5", "p-4", "p-5", "p-6", "p-8", "p-10", "p-12", "p-16", "p-20", "p-24"], l = n.filter((o) => !a.includes(o));
-      s.className = [...l, i].join(" ");
+      const n = s.className.split(" "), a = ["p-0", "p-0.5", "p-1", "p-1.5", "p-2", "p-2.5", "p-3", "p-3.5", "p-4", "p-5", "p-6", "p-8", "p-10", "p-12", "p-16", "p-20", "p-24"], c = n.filter((o) => !a.includes(o));
+      s.className = [...c, i].join(" ");
     }
     Array.from(this.children).forEach((n) => {
       n !== this._overlay && n !== this._popover && n.parentElement === this && s.appendChild(n);
@@ -1612,16 +1604,8 @@ class Q extends HTMLElement {
     });
   }
 }
-customElements.get("mint-popover") || customElements.define("mint-popover", Q);
-const ee = {
-  name: "check",
-  viewBox: "0 0 24 24",
-  path: "M5 13l4 4L19 7",
-  strokeLinecap: "round",
-  strokeLinejoin: "round"
-};
-P(ee);
-class te extends HTMLElement {
+customElements.get("mint-popover") || customElements.define("mint-popover", X);
+class K extends HTMLElement {
   constructor() {
     super(), this._checkbox = null, this._checked = !1, this._clickHandler = null, this._changeHandler = null, this._mousedownHandler = null, this._mouseupHandler = null, this._mouseleaveHandler = null, this._touchstartHandler = null, this._touchendHandler = null, this._focusHandler = null, this._blurHandler = null;
   }
@@ -1711,20 +1695,20 @@ class te extends HTMLElement {
     n ? this._checkbox.name = n : this._checkbox.removeAttribute("name");
     const a = this.getValue();
     a ? this._checkbox.value = a : this._checkbox.removeAttribute("value"), e ? this._checkbox.setAttribute("aria-label", e) : this._checkbox.removeAttribute("aria-label"), s.className = `mint-checkbox-wrapper ${this.getCheckboxClasses()}`, s.style.pointerEvents = "none", this._checkbox.style.pointerEvents = "auto";
-    let l = s.querySelector("mint-icon");
-    l || (l = document.createElement("mint-icon"), l.setAttribute("name", "check"), l.className = "w-3.5 h-3.5 text-white pointer-events-none absolute inset-0 m-auto", l.style.transition = "opacity 200ms ease-out, transform 200ms ease-out", l.style.zIndex = "1", s.appendChild(l)), this.updateVisualState();
+    let c = s.querySelector("mint-icon");
+    c || (c = document.createElement("mint-icon"), c.setAttribute("name", "check"), c.className = "w-3.5 h-3.5 text-white pointer-events-none absolute inset-0 m-auto", c.style.transition = "opacity 200ms ease-out, transform 200ms ease-out", c.style.zIndex = "1", s.appendChild(c)), this.updateVisualState();
     let o = this.querySelector(".mint-checkbox-label-container");
     if (e || t) {
       o || (o = document.createElement("div"), o.className = "mint-checkbox-label-container flex flex-col gap-0.5 flex-1", this.appendChild(o));
-      let h = o.querySelector(".mint-checkbox-label");
-      e ? (h || (h = document.createElement("span"), h.className = "mint-checkbox-label text-sm font-medium text-gray-900 dark:text-gray-100 cursor-pointer select-none", o.insertBefore(h, o.firstChild)), h.textContent = e, i ? h.classList.add("opacity-40") : h.classList.remove("opacity-40")) : h && h.remove();
-      let c = o.querySelector(".mint-checkbox-info");
-      if (t ? (c || (c = document.createElement("span"), c.className = "mint-checkbox-info text-xs text-gray-500 dark:text-gray-400 cursor-pointer select-none", o.appendChild(c)), c.textContent = t, i ? c.classList.add("opacity-40") : c.classList.remove("opacity-40")) : c && c.remove(), i)
+      let l = o.querySelector(".mint-checkbox-label");
+      e ? (l || (l = document.createElement("span"), l.className = "mint-checkbox-label text-sm font-medium text-gray-900 dark:text-gray-100 cursor-pointer select-none", o.insertBefore(l, o.firstChild)), l.textContent = e, i ? l.classList.add("opacity-40") : l.classList.remove("opacity-40")) : l && l.remove();
+      let d = o.querySelector(".mint-checkbox-info");
+      if (t ? (d || (d = document.createElement("span"), d.className = "mint-checkbox-info text-xs text-gray-500 dark:text-gray-400 cursor-pointer select-none", o.appendChild(d)), d.textContent = t, i ? d.classList.add("opacity-40") : d.classList.remove("opacity-40")) : d && d.remove(), i)
         o.style.cursor = "default", o._clickHandler && (o.removeEventListener("click", o._clickHandler), o._clickHandler = null);
       else {
         o.style.cursor = "pointer";
-        const d = o._clickHandler;
-        d && o.removeEventListener("click", d), o._clickHandler = (u) => {
+        const h = o._clickHandler;
+        h && o.removeEventListener("click", h), o._clickHandler = (u) => {
           this._checkbox && (u.target === this._checkbox || this._checkbox.contains(u.target) || u.composedPath().includes(this._checkbox)) || this.toggle();
         }, o.addEventListener("click", o._clickHandler);
       }
@@ -1787,8 +1771,8 @@ class te extends HTMLElement {
     }
   }
 }
-customElements.get("mint-checkbox") || customElements.define("mint-checkbox", te);
-class ie extends HTMLElement {
+customElements.get("mint-checkbox") || customElements.define("mint-checkbox", K);
+class Z extends HTMLElement {
   constructor() {
     super(), this._radio = null, this._checked = !1, this._changeHandler = null, this._groupChangeHandler = null, this._clickHandler = null, this._mousedownHandler = null, this._mouseupHandler = null, this._mouseleaveHandler = null, this._touchstartHandler = null, this._touchendHandler = null, this._focusHandler = null, this._blurHandler = null;
   }
@@ -1878,20 +1862,20 @@ class ie extends HTMLElement {
     n ? this._radio.name = n : this._radio.removeAttribute("name");
     const a = this.getValue();
     a ? this._radio.value = a : this._radio.removeAttribute("value"), e ? this._radio.setAttribute("aria-label", e) : this._radio.removeAttribute("aria-label"), s.className = `mint-choice-wrapper ${this.getChoiceClasses()}`, s.style.pointerEvents = "none", this._radio.style.pointerEvents = "auto";
-    let l = s.querySelector(".mint-choice-indicator");
-    l || (l = document.createElement("div"), l.className = "mint-choice-indicator w-2.5 h-2.5 rounded-full bg-white pointer-events-none absolute inset-0 m-auto", l.style.transition = "opacity 200ms ease-out, transform 200ms ease-out", l.style.zIndex = "1", s.appendChild(l)), l.style.opacity = this._checked ? "1" : "0", l.style.transform = this._checked ? "scale(1)" : "scale(0.8)", this.updateVisualState();
+    let c = s.querySelector(".mint-choice-indicator");
+    c || (c = document.createElement("div"), c.className = "mint-choice-indicator w-2.5 h-2.5 rounded-full bg-white pointer-events-none absolute inset-0 m-auto", c.style.transition = "opacity 200ms ease-out, transform 200ms ease-out", c.style.zIndex = "1", s.appendChild(c)), c.style.opacity = this._checked ? "1" : "0", c.style.transform = this._checked ? "scale(1)" : "scale(0.8)", this.updateVisualState();
     let o = this.querySelector(".mint-choice-label-container");
     if (e || t) {
       o || (o = document.createElement("div"), o.className = "mint-choice-label-container flex flex-col gap-0.5 flex-1", this.appendChild(o));
-      let h = o.querySelector(".mint-choice-label");
-      e ? (h || (h = document.createElement("span"), h.className = "mint-choice-label text-sm font-medium text-gray-900 dark:text-gray-100 cursor-pointer select-none", o.insertBefore(h, o.firstChild)), h.textContent = e, i ? h.classList.add("opacity-40") : h.classList.remove("opacity-40")) : h && h.remove();
-      let c = o.querySelector(".mint-choice-info");
-      if (t ? (c || (c = document.createElement("span"), c.className = "mint-choice-info text-xs text-gray-500 dark:text-gray-400 cursor-pointer select-none", o.appendChild(c)), c.textContent = t, i ? c.classList.add("opacity-40") : c.classList.remove("opacity-40")) : c && c.remove(), i)
+      let l = o.querySelector(".mint-choice-label");
+      e ? (l || (l = document.createElement("span"), l.className = "mint-choice-label text-sm font-medium text-gray-900 dark:text-gray-100 cursor-pointer select-none", o.insertBefore(l, o.firstChild)), l.textContent = e, i ? l.classList.add("opacity-40") : l.classList.remove("opacity-40")) : l && l.remove();
+      let d = o.querySelector(".mint-choice-info");
+      if (t ? (d || (d = document.createElement("span"), d.className = "mint-choice-info text-xs text-gray-500 dark:text-gray-400 cursor-pointer select-none", o.appendChild(d)), d.textContent = t, i ? d.classList.add("opacity-40") : d.classList.remove("opacity-40")) : d && d.remove(), i)
         o.style.cursor = "default", o._clickHandler && (o.removeEventListener("click", o._clickHandler), o._clickHandler = null);
       else {
         o.style.cursor = "pointer";
-        const d = o._clickHandler;
-        d && o.removeEventListener("click", d), o._clickHandler = (u) => {
+        const h = o._clickHandler;
+        h && o.removeEventListener("click", h), o._clickHandler = (u) => {
           this._radio && (u.target === this._radio || this._radio.contains(u.target) || u.composedPath().includes(this._radio)) || this.select();
         }, o.addEventListener("click", o._clickHandler);
       }
@@ -1988,8 +1972,8 @@ class ie extends HTMLElement {
     }
   }
 }
-customElements.get("mint-choice") || customElements.define("mint-choice", ie);
-class se extends HTMLElement {
+customElements.get("mint-choice") || customElements.define("mint-choice", Z);
+class Q extends HTMLElement {
   constructor() {
     super(), this._input = null, this._textarea = null, this._element = null, this._wrapper = null, this._icon = null, this._colorPicker = null, this._colorTextInput = null, this._colorContainer = null, this._colorPickerWrapper = null, this._numberSpinnerContainer = null, this._numberIncrementButton = null, this._numberDecrementButton = null, this._focusHandler = null, this._blurHandler = null, this._clickHandler = null, this._clickOutsideHandler = null;
   }
@@ -2106,19 +2090,19 @@ class se extends HTMLElement {
     ], a = [
       "border-2",
       r ? "border-red-300 dark:border-red-300" : "border-gray-200 dark:border-gray-600"
-    ], l = [
+    ], c = [
       "focus-visible:ring-2",
       "focus-visible:ring-offset-1",
       r ? "focus-visible:ring-red-400 dark:focus-visible:ring-red-500" : "focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500"
     ];
-    return [...n, ...a, ...l].filter(Boolean).join(" ");
+    return [...n, ...a, ...c].filter(Boolean).join(" ");
   }
   render() {
-    var v, C, S, y;
+    var v, E, S, y;
     this.getType();
-    const e = this._getNormalizedType(), t = this._isTextarea(), i = this._isMoney(), s = this._isColor(), r = this.getPlaceholder(), n = this.isDisabled(), a = this.isReadonly(), l = this.isRequired(), o = this.getId(), h = this.getName(), c = this.getAttribute("value") || (s ? "#000000" : ""), d = this.getRows(), u = this.getIcon(), f = this.getLabel(), g = this.getInfo();
+    const e = this._getNormalizedType(), t = this._isTextarea(), i = this._isMoney(), s = this._isColor(), r = this.getPlaceholder(), n = this.isDisabled(), a = this.isReadonly(), c = this.isRequired(), o = this.getId(), l = this.getName(), d = this.getAttribute("value") || (s ? "#000000" : ""), h = this.getRows(), u = this.getIcon(), b = this.getLabel(), f = this.getInfo();
     if (s) {
-      this._input && (this._input.remove(), this._input = null), this._textarea && (this._textarea.remove(), this._textarea = null), this._wrapper || (this._wrapper = document.createElement("div"), this._wrapper.className = "relative w-full", this.appendChild(this._wrapper)), this._colorContainer && (this._colorContainer.remove(), this._colorContainer = null), this._colorPickerWrapper && !s && (this._colorPickerWrapper.remove(), this._colorPickerWrapper = null), this._colorPickerWrapper || (this._colorPickerWrapper = document.createElement("div"), this._colorPickerWrapper.className = "mint-color-picker-wrapper absolute left-[.65rem] top-1/2 -translate-y-1/2 w-6 h-6 rounded cursor-pointer disabled:opacity-40 disabled:cursor-not-allowed outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", this._colorPickerWrapper.style.backgroundColor = c || "#000000", this._wrapper.appendChild(this._colorPickerWrapper), this._colorPicker = document.createElement("input"), this._colorPicker.type = "color", this._colorPicker.className = "absolute inset-0 w-full h-full opacity-0 cursor-pointer", this._colorPicker.style.cssText = "position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; z-index: 10; pointer-events: auto; margin: 0; padding: 0; border: none;", this._colorPickerWrapper.appendChild(this._colorPicker), this._focusHandler = (p) => {
+      this._input && (this._input.remove(), this._input = null), this._textarea && (this._textarea.remove(), this._textarea = null), this._wrapper || (this._wrapper = document.createElement("div"), this._wrapper.className = "relative w-full", this.appendChild(this._wrapper)), this._colorContainer && (this._colorContainer.remove(), this._colorContainer = null), this._colorPickerWrapper && !s && (this._colorPickerWrapper.remove(), this._colorPickerWrapper = null), this._colorPickerWrapper || (this._colorPickerWrapper = document.createElement("div"), this._colorPickerWrapper.className = "mint-color-picker-wrapper absolute left-[.65rem] top-1/2 -translate-y-1/2 w-6 h-6 rounded cursor-pointer disabled:opacity-40 disabled:cursor-not-allowed outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", this._colorPickerWrapper.style.backgroundColor = d || "#000000", this._wrapper.appendChild(this._colorPickerWrapper), this._colorPicker = document.createElement("input"), this._colorPicker.type = "color", this._colorPicker.className = "absolute inset-0 w-full h-full opacity-0 cursor-pointer", this._colorPicker.style.cssText = "position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; z-index: 10; pointer-events: auto; margin: 0; padding: 0; border: none;", this._colorPickerWrapper.appendChild(this._colorPicker), this._focusHandler = (p) => {
         this._colorPickerWrapper && this._colorPicker && this._colorPicker.matches(":focus-visible") && requestAnimationFrame(() => {
           var k;
           this._colorPicker && this._colorPicker.matches(":focus-visible") && ((k = this._colorPickerWrapper) == null || k.classList.add("ring-2", "ring-offset-1", "ring-gray-400", "dark:ring-gray-500"));
@@ -2150,18 +2134,18 @@ class se extends HTMLElement {
           cancelable: !0
         })));
       }), this._colorTextInput.addEventListener("blur", () => {
-        var k, E;
+        var k, x;
         const p = ((k = this._colorTextInput) == null ? void 0 : k.value) || "";
         /^#[0-9A-Fa-f]{6}$/.test(p) ? (this._colorPicker && (this._colorPicker.value = p), this.setAttribute("value", p)) : this._colorPicker && this._colorTextInput && (this._colorTextInput.value = this._colorPicker.value), this.dispatchEvent(new CustomEvent("change", {
-          detail: { value: ((E = this._colorPicker) == null ? void 0 : E.value) || "#000000" },
+          detail: { value: ((x = this._colorPicker) == null ? void 0 : x.value) || "#000000" },
           bubbles: !0,
           cancelable: !0
         }));
       }));
-      const b = c || "#000000";
-      if (this._colorPicker && this._colorPicker.value !== b && (this._colorPicker.value = b), this._colorPickerWrapper && (this._colorPickerWrapper.style.backgroundColor = b), this._colorTextInput && this._colorTextInput.value !== b && (this._colorTextInput.value = b), this._colorPicker && (this._colorPicker.disabled = n), this._colorPickerWrapper && (n ? (this._colorPickerWrapper.classList.add("opacity-40", "cursor-not-allowed"), this._colorPickerWrapper.classList.remove("cursor-pointer")) : (this._colorPickerWrapper.classList.remove("opacity-40", "cursor-not-allowed"), this._colorPickerWrapper.classList.add("cursor-pointer"))), this._colorTextInput && (this._colorTextInput.disabled = n, this._colorTextInput.readOnly = a, this._colorTextInput.required = l), this._colorTextInput) {
+      const g = d || "#000000";
+      if (this._colorPicker && this._colorPicker.value !== g && (this._colorPicker.value = g), this._colorPickerWrapper && (this._colorPickerWrapper.style.backgroundColor = g), this._colorTextInput && this._colorTextInput.value !== g && (this._colorTextInput.value = g), this._colorPicker && (this._colorPicker.disabled = n), this._colorPickerWrapper && (n ? (this._colorPickerWrapper.classList.add("opacity-40", "cursor-not-allowed"), this._colorPickerWrapper.classList.remove("cursor-pointer")) : (this._colorPickerWrapper.classList.remove("opacity-40", "cursor-not-allowed"), this._colorPickerWrapper.classList.add("cursor-pointer"))), this._colorTextInput && (this._colorTextInput.disabled = n, this._colorTextInput.readOnly = a, this._colorTextInput.required = c), this._colorTextInput) {
         const p = this._colorTextInput;
-        o ? p.id = o : p.removeAttribute("id"), h ? p.name = h : p.removeAttribute("name"), p.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), this._element = p;
+        o ? p.id = o : p.removeAttribute("id"), l ? p.name = l : p.removeAttribute("name"), p.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), this._element = p;
       }
       this._renderErrorState();
       return;
@@ -2169,51 +2153,51 @@ class se extends HTMLElement {
     if (this._wrapper || (this._wrapper = document.createElement("div"), this._wrapper.className = "relative w-full", this.appendChild(this._wrapper)), this._colorContainer && (this._colorContainer.remove(), this._colorContainer = null, this._colorPicker = null, this._colorTextInput = null), this._colorPickerWrapper && !s && (this._colorPickerWrapper.remove(), this._colorPickerWrapper = null, this._colorPicker = null, this._colorTextInput = null), u && !t ? this._icon ? this._icon.setAttribute("name", u) : (this._icon = document.createElement("mint-icon"), this._icon.setAttribute("name", u), this._icon.className = "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400 dark:text-gray-500 pointer-events-none", this._wrapper.appendChild(this._icon)) : this._icon && (this._icon.remove(), this._icon = null), this._isNumber() && !t) {
       if (!this._numberSpinnerContainer) {
         this._numberSpinnerContainer = document.createElement("div"), this._numberSpinnerContainer.className = "absolute right-1 top-1/2 -translate-y-1/2 flex flex-col h-8 pointer-events-none", this._wrapper.appendChild(this._numberSpinnerContainer), this._numberIncrementButton = document.createElement("button"), this._numberIncrementButton.type = "button", this._numberIncrementButton.className = "flex items-center justify-center w-5 h-4 text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-300 disabled:opacity-40 disabled:cursor-not-allowed transition-colors pointer-events-auto bg-gray-100 dark:bg-gray-600 active:bg-gray-200 dark:active:bg-gray-500 rounded";
-        const b = document.createElement("mint-icon");
-        b.setAttribute("name", "caret-up"), b.className = "w-[1rem] h-[1rem]", this._numberIncrementButton.appendChild(b), this._numberSpinnerContainer.appendChild(this._numberIncrementButton), this._numberDecrementButton = document.createElement("button"), this._numberDecrementButton.type = "button", this._numberDecrementButton.className = "flex items-center justify-center w-5 h-4 text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-300 disabled:opacity-40 disabled:cursor-not-allowed transition-colors pointer-events-auto bg-gray-100 dark:bg-gray-600 active:bg-gray-200 dark:active:bg-gray-500 rounded";
+        const g = document.createElement("mint-icon");
+        g.setAttribute("name", "caret-up"), g.className = "w-[1rem] h-[1rem]", this._numberIncrementButton.appendChild(g), this._numberSpinnerContainer.appendChild(this._numberIncrementButton), this._numberDecrementButton = document.createElement("button"), this._numberDecrementButton.type = "button", this._numberDecrementButton.className = "flex items-center justify-center w-5 h-4 text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-300 disabled:opacity-40 disabled:cursor-not-allowed transition-colors pointer-events-auto bg-gray-100 dark:bg-gray-600 active:bg-gray-200 dark:active:bg-gray-500 rounded";
         const p = document.createElement("mint-icon");
         p.setAttribute("name", "caret-down"), p.className = "w-[1rem] h-[1rem]", this._numberDecrementButton.appendChild(p), this._numberSpinnerContainer.appendChild(this._numberDecrementButton), this._numberIncrementButton.addEventListener("click", (k) => {
           if (k.preventDefault(), k.stopPropagation(), this._input && !this._input.disabled && !this._input.readOnly) {
-            const E = parseFloat(this._input.value) || 0, I = parseFloat(this._input.step) || 1, w = this._input.min ? parseFloat(this._input.min) : void 0, A = this._input.max ? parseFloat(this._input.max) : void 0;
-            let L = E + I;
-            A !== void 0 && L > A && (L = A), w !== void 0 && L < w && (L = w), this._input.value = L.toString(), this.setAttribute("value", L.toString()), this._input.dispatchEvent(new Event("input", { bubbles: !0 })), this._input.dispatchEvent(new Event("change", { bubbles: !0 }));
+            const x = parseFloat(this._input.value) || 0, I = parseFloat(this._input.step) || 1, C = this._input.min ? parseFloat(this._input.min) : void 0, w = this._input.max ? parseFloat(this._input.max) : void 0;
+            let L = x + I;
+            w !== void 0 && L > w && (L = w), C !== void 0 && L < C && (L = C), this._input.value = L.toString(), this.setAttribute("value", L.toString()), this._input.dispatchEvent(new Event("input", { bubbles: !0 })), this._input.dispatchEvent(new Event("change", { bubbles: !0 }));
           }
         }), this._numberDecrementButton.addEventListener("click", (k) => {
           if (k.preventDefault(), k.stopPropagation(), this._input && !this._input.disabled && !this._input.readOnly) {
-            const E = parseFloat(this._input.value) || 0, I = parseFloat(this._input.step) || 1, w = this._input.min ? parseFloat(this._input.min) : void 0, A = this._input.max ? parseFloat(this._input.max) : void 0;
-            let L = E - I;
-            w !== void 0 && L < w && (L = w), A !== void 0 && L > A && (L = A), this._input.value = L.toString(), this.setAttribute("value", L.toString()), this._input.dispatchEvent(new Event("input", { bubbles: !0 })), this._input.dispatchEvent(new Event("change", { bubbles: !0 }));
+            const x = parseFloat(this._input.value) || 0, I = parseFloat(this._input.step) || 1, C = this._input.min ? parseFloat(this._input.min) : void 0, w = this._input.max ? parseFloat(this._input.max) : void 0;
+            let L = x - I;
+            C !== void 0 && L < C && (L = C), w !== void 0 && L > w && (L = w), this._input.value = L.toString(), this.setAttribute("value", L.toString()), this._input.dispatchEvent(new Event("input", { bubbles: !0 })), this._input.dispatchEvent(new Event("change", { bubbles: !0 }));
           }
         });
       }
       this._numberIncrementButton && (this._numberIncrementButton.disabled = n || a), this._numberDecrementButton && (this._numberDecrementButton.disabled = n || a);
     } else this._numberSpinnerContainer && (this._numberSpinnerContainer.remove(), this._numberSpinnerContainer = null, this._numberIncrementButton = null, this._numberDecrementButton = null);
     if (t) {
-      if (this._input && (this._input.remove(), this._input = null), this._textarea || (this._textarea = document.createElement("textarea"), this._wrapper.appendChild(this._textarea), this.setupEventListeners()), this._element = this._textarea, this._textarea.placeholder = r, this._textarea.disabled = n, this._textarea.readOnly = a, this._textarea.required = l, this._textarea.rows = d, this._textarea.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), c !== this._textarea.value && (this._textarea.value = c), o ? this._textarea.id = o : this._textarea.removeAttribute("id"), h ? this._textarea.name = h : this._textarea.removeAttribute("name"), this._textarea.className = this.getInputClasses(), this.firstChild && this.firstChild !== this._wrapper && this.firstChild.nodeType === Node.TEXT_NODE) {
-        const b = this.firstChild.textContent;
-        b && !this._textarea.value && (this._textarea.value = b.trim()), this.removeChild(this.firstChild);
+      if (this._input && (this._input.remove(), this._input = null), this._textarea || (this._textarea = document.createElement("textarea"), this._wrapper.appendChild(this._textarea), this.setupEventListeners()), this._element = this._textarea, this._textarea.placeholder = r, this._textarea.disabled = n, this._textarea.readOnly = a, this._textarea.required = c, this._textarea.rows = h, this._textarea.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), d !== this._textarea.value && (this._textarea.value = d), o ? this._textarea.id = o : this._textarea.removeAttribute("id"), l ? this._textarea.name = l : this._textarea.removeAttribute("name"), this._textarea.className = this.getInputClasses(), this.firstChild && this.firstChild !== this._wrapper && this.firstChild.nodeType === Node.TEXT_NODE) {
+        const g = this.firstChild.textContent;
+        g && !this._textarea.value && (this._textarea.value = g.trim()), this.removeChild(this.firstChild);
       }
-    } else if (this._textarea && (this._textarea.remove(), this._textarea = null), this._input || (this._input = document.createElement("input"), this._wrapper.appendChild(this._input), this.setupEventListeners()), this._element = this._input, this._input.type = e, this._input.placeholder = r, this._input.disabled = n, this._input.readOnly = a, this._input.required = l, this._input.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), i ? (this._input.inputMode = "decimal", this._input.pattern = "[0-9]*\\.?[0-9]*") : (this._input.removeAttribute("inputmode"), this._input.removeAttribute("pattern")), c !== this._input.value && (this._input.value = c), o ? this._input.id = o : this._input.removeAttribute("id"), h ? this._input.name = h : this._input.removeAttribute("name"), this._input.className = this.getInputClasses(), this.firstChild && this.firstChild !== this._wrapper && this.firstChild.nodeType === Node.TEXT_NODE) {
-      const b = this.firstChild.textContent;
-      b && !this._input.value && (this._input.value = b.trim()), this.removeChild(this.firstChild);
+    } else if (this._textarea && (this._textarea.remove(), this._textarea = null), this._input || (this._input = document.createElement("input"), this._wrapper.appendChild(this._input), this.setupEventListeners()), this._element = this._input, this._input.type = e, this._input.placeholder = r, this._input.disabled = n, this._input.readOnly = a, this._input.required = c, this._input.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), i ? (this._input.inputMode = "decimal", this._input.pattern = "[0-9]*\\.?[0-9]*") : (this._input.removeAttribute("inputmode"), this._input.removeAttribute("pattern")), d !== this._input.value && (this._input.value = d), o ? this._input.id = o : this._input.removeAttribute("id"), l ? this._input.name = l : this._input.removeAttribute("name"), this._input.className = this.getInputClasses(), this.firstChild && this.firstChild !== this._wrapper && this.firstChild.nodeType === Node.TEXT_NODE) {
+      const g = this.firstChild.textContent;
+      g && !this._input.value && (this._input.value = g.trim()), this.removeChild(this.firstChild);
     }
     let m = this.querySelector(".mint-input-label-container");
-    if (f || g) {
+    if (b || f) {
       m || (m = document.createElement("div"), m.className = "mint-input-label-container flex flex-col gap-0.5 mb-[.25rem]", this._wrapper && this._wrapper.parentElement === this ? this.insertBefore(m, this._wrapper) : this.insertBefore(m, this.firstChild));
-      let b = m.querySelector(".mint-input-label");
-      if (f) {
-        b || (b = document.createElement("label"), b.className = "mint-input-label text-sm font-medium text-gray-900 dark:text-gray-100 select-none", m.insertBefore(b, m.firstChild)), b.textContent = f;
-        const k = o || ((v = this._element) == null ? void 0 : v.id) || ((C = this._colorTextInput) == null ? void 0 : C.id) || ((S = this._input) == null ? void 0 : S.id) || ((y = this._textarea) == null ? void 0 : y.id);
+      let g = m.querySelector(".mint-input-label");
+      if (b) {
+        g || (g = document.createElement("label"), g.className = "mint-input-label text-sm font-medium text-gray-900 dark:text-gray-100 select-none", m.insertBefore(g, m.firstChild)), g.textContent = b;
+        const k = o || ((v = this._element) == null ? void 0 : v.id) || ((E = this._colorTextInput) == null ? void 0 : E.id) || ((S = this._input) == null ? void 0 : S.id) || ((y = this._textarea) == null ? void 0 : y.id);
         if (k)
-          b.setAttribute("for", k);
+          g.setAttribute("for", k);
         else {
-          const E = `mint-input-${Math.random().toString(36).substr(2, 9)}`;
-          this._element ? this._element.id = E : this._colorTextInput ? this._colorTextInput.id = E : this._input ? this._input.id = E : this._textarea && (this._textarea.id = E), b.setAttribute("for", E);
+          const x = `mint-input-${Math.random().toString(36).substr(2, 9)}`;
+          this._element ? this._element.id = x : this._colorTextInput ? this._colorTextInput.id = x : this._input ? this._input.id = x : this._textarea && (this._textarea.id = x), g.setAttribute("for", x);
         }
-        n ? b.classList.add("opacity-40") : b.classList.remove("opacity-40");
-      } else b && b.remove();
+        n ? g.classList.add("opacity-40") : g.classList.remove("opacity-40");
+      } else g && g.remove();
       let p = m.querySelector(".mint-input-info");
-      g ? (p || (p = document.createElement("span"), p.className = "mint-input-info text-xs text-gray-500 dark:text-gray-400 select-none", m.appendChild(p)), p.textContent = g, n ? p.classList.add("opacity-40") : p.classList.remove("opacity-40")) : p && p.remove();
+      f ? (p || (p = document.createElement("span"), p.className = "mint-input-info text-xs text-gray-500 dark:text-gray-400 select-none", m.appendChild(p)), p.textContent = f, n ? p.classList.add("opacity-40") : p.classList.remove("opacity-40")) : p && p.remove();
     } else m && m.remove();
     this._renderErrorState();
   }
@@ -2253,8 +2237,8 @@ class se extends HTMLElement {
     this._isColor() && this._colorTextInput ? this._colorTextInput.blur() : (e = this._element) == null || e.blur();
   }
 }
-customElements.get("mint-input") || customElements.define("mint-input", se);
-class re extends HTMLElement {
+customElements.get("mint-input") || customElements.define("mint-input", Q);
+class ee extends HTMLElement {
   constructor() {
     super(), this._input = null, this._textInput = null, this._popover = null, this._calendarContainer = null, this._iconButton = null, this._hiddenInput = null, this._startPartInputs = [], this._endPartInputs = [], this._displayEl = null, this._inputsWrapperEl = null, this._fieldsContainer = null, this._resetHandler = null, this._isInputMode = !1, this._currentMonth = (/* @__PURE__ */ new Date()).getMonth(), this._currentYear = (/* @__PURE__ */ new Date()).getFullYear(), this._viewMode = "calendar", this._selectedStartDate = null, this._selectedEndDate = null, this._isRange = !1, this._popoverObserver = null, this._focusTrapHandler = null, this._escapeHandler = null;
   }
@@ -2413,17 +2397,17 @@ class re extends HTMLElement {
   _applyDateToParts(e, t, i, s) {
     if (!t.length) return;
     if (!e) {
-      t.forEach((l) => l.value = "");
+      t.forEach((c) => c.value = "");
       return;
     }
     const r = this._formatDate(e, s);
     let n = 0, a = 0;
-    i.forEach((l) => {
-      if (l.type === "sep")
-        n += l.value.length;
+    i.forEach((c) => {
+      if (c.type === "sep")
+        n += c.value.length;
       else {
-        const o = r.substr(n, l.len);
-        t[a] && (t[a].value = o), a++, n += l.len;
+        const o = r.substr(n, c.len);
+        t[a] && (t[a].value = o), a++, n += c.len;
       }
     });
   }
@@ -2458,8 +2442,8 @@ class re extends HTMLElement {
       }), s.addEventListener("blur", (a) => {
         var o;
         this._syncHiddenInput();
-        const l = a.relatedTarget;
-        l && i.contains(l) || (this._handleBlur(((o = this._hiddenInput) == null ? void 0 : o.value) || ""), this._exitInputMode());
+        const c = a.relatedTarget;
+        c && i.contains(c) || (this._handleBlur(((o = this._hiddenInput) == null ? void 0 : o.value) || ""), this._exitInputMode());
       });
     });
   }
@@ -2472,8 +2456,8 @@ class re extends HTMLElement {
     if (this._isRange) {
       const [s, r] = this._splitRangeInput(e, t), n = s ? this._parseDateString(s, t) : null, a = r ? this._parseDateString(r, t) : null;
       if (n && a) {
-        const [l, o] = n <= a ? [n, a] : [a, n];
-        this._selectedStartDate = l, this._selectedEndDate = o, this._currentMonth = l.getMonth(), this._currentYear = l.getFullYear();
+        const [c, o] = n <= a ? [n, a] : [a, n];
+        this._selectedStartDate = c, this._selectedEndDate = o, this._currentMonth = c.getMonth(), this._currentYear = c.getFullYear();
       } else n && (this._selectedStartDate = n, this._selectedEndDate = null, this._currentMonth = n.getMonth(), this._currentYear = n.getFullYear());
       this._applyDateToParts(this._selectedStartDate, this._startPartInputs, i, t), this._applyDateToParts(this._selectedEndDate, this._endPartInputs, i, t);
     } else {
@@ -2487,53 +2471,53 @@ class re extends HTMLElement {
     if (i.test(e)) {
       const _ = e.split(i).filter((v) => v.length > 0), m = t.split(/[\/\-\.\s]+/).filter((v) => v.length > 0);
       if (_.length === m.length) {
-        let v = 0, C = 0, S = 0;
+        let v = 0, E = 0, S = 0;
         for (let y = 0; y < m.length; y++) {
-          const b = m[y].toLowerCase(), p = _[y];
-          if (b.includes("d"))
+          const g = m[y].toLowerCase(), p = _[y];
+          if (g.includes("d"))
             v = parseInt(p, 10);
-          else if (b.includes("m"))
-            C = parseInt(p, 10) - 1;
-          else if (b.includes("y")) {
+          else if (g.includes("m"))
+            E = parseInt(p, 10) - 1;
+          else if (g.includes("y")) {
             let k = parseInt(p, 10);
-            const E = b.length, I = p.length;
-            I === 2 && E === 4 ? k = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + k : I === 2 && E === 2 && (k = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + k), S = k;
+            const x = g.length, I = p.length;
+            I === 2 && x === 4 ? k = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + k : I === 2 && x === 2 && (k = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + k), S = k;
           }
         }
-        if (v && C >= 0 && C <= 11 && S) {
-          const y = new Date(S, C, v);
-          if (!isNaN(y.getTime()) && y.getDate() === v && y.getMonth() === C && y.getFullYear() === S)
+        if (v && E >= 0 && E <= 11 && S) {
+          const y = new Date(S, E, v);
+          if (!isNaN(y.getTime()) && y.getDate() === v && y.getMonth() === E && y.getFullYear() === S)
             return y;
         }
       }
     }
     const r = e.replace(/[\/\-\.]/g, ""), n = t.replace(/[\/\-\.]/g, "").toLowerCase();
-    let a = n.indexOf("d"), l = n.indexOf("m"), o = n.indexOf("y");
-    const h = [
+    let a = n.indexOf("d"), c = n.indexOf("m"), o = n.indexOf("y");
+    const l = [
       { char: "d", index: a },
-      { char: "m", index: l },
+      { char: "m", index: c },
       { char: "y", index: o }
     ].sort((_, m) => _.index - m.index);
-    let c = 0, d = 0, u = 0, f = 0;
+    let d = 0, h = 0, u = 0, b = 0;
     n.length, r.length;
-    for (const _ of h)
+    for (const _ of l)
       if (_.char === "d") {
-        const m = n.lastIndexOf("d") - n.indexOf("d") + 1, v = r.substr(f, m);
+        const m = n.lastIndexOf("d") - n.indexOf("d") + 1, v = r.substr(b, m);
         if (v.length === 0) return null;
-        c = parseInt(v, 10), f += v.length;
+        d = parseInt(v, 10), b += v.length;
       } else if (_.char === "m") {
-        const m = n.lastIndexOf("m") - n.indexOf("m") + 1, v = r.substr(f, m);
+        const m = n.lastIndexOf("m") - n.indexOf("m") + 1, v = r.substr(b, m);
         if (v.length === 0) return null;
-        d = parseInt(v, 10) - 1, f += v.length;
+        h = parseInt(v, 10) - 1, b += v.length;
       } else if (_.char === "y") {
-        const m = n.lastIndexOf("y") - n.indexOf("y") + 1, v = r.substr(f), C = Math.min(m, v.length), S = v.substr(0, C);
+        const m = n.lastIndexOf("y") - n.indexOf("y") + 1, v = r.substr(b), E = Math.min(m, v.length), S = v.substr(0, E);
         if (S.length === 0) return null;
         let y = parseInt(S, 10);
-        C === 2 && m === 4 ? y = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + y : C === 2 && m === 2 && (y = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + y), u = y, f += C;
+        E === 2 && m === 4 ? y = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + y : E === 2 && m === 2 && (y = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + y), u = y, b += E;
       }
-    if (!c || d < 0 || d > 11 || !u) return null;
-    const g = new Date(u, d, c);
-    return isNaN(g.getTime()) || g.getDate() !== c || g.getMonth() !== d || g.getFullYear() !== u ? null : g;
+    if (!d || h < 0 || h > 11 || !u) return null;
+    const f = new Date(u, h, d);
+    return isNaN(f.getTime()) || f.getDate() !== d || f.getMonth() !== h || f.getFullYear() !== u ? null : f;
   }
   _formatDate(e, t) {
     const i = e.getDate(), s = e.getMonth() + 1, r = e.getFullYear(), n = t.toLowerCase();
@@ -2542,102 +2526,102 @@ class re extends HTMLElement {
   }
   // PHP-style formatter for display mode
   _formatDatePhp(e, t) {
-    const i = e.getDate(), s = e.getMonth() + 1, r = e.getFullYear(), n = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], a = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], l = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], o = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], h = (u, f = 2) => u.toString().padStart(f, "0"), c = (u) => {
-      const f = u % 10, g = u % 100;
-      return f === 1 && g !== 11 ? "st" : f === 2 && g !== 12 ? "nd" : f === 3 && g !== 13 ? "rd" : "th";
+    const i = e.getDate(), s = e.getMonth() + 1, r = e.getFullYear(), n = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], a = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], c = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], o = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], l = (u, b = 2) => u.toString().padStart(b, "0"), d = (u) => {
+      const b = u % 10, f = u % 100;
+      return b === 1 && f !== 11 ? "st" : b === 2 && f !== 12 ? "nd" : b === 3 && f !== 13 ? "rd" : "th";
     };
-    let d = "";
+    let h = "";
     for (let u = 0; u < t.length; u++) {
-      const f = t[u];
-      if (f === "\\" && u + 1 < t.length) {
-        d += t[u + 1], u++;
+      const b = t[u];
+      if (b === "\\" && u + 1 < t.length) {
+        h += t[u + 1], u++;
         continue;
       }
-      switch (f) {
+      switch (b) {
         case "Y":
-          d += r.toString();
+          h += r.toString();
           break;
         case "y":
-          d += r.toString().slice(-2);
+          h += r.toString().slice(-2);
           break;
         case "m":
-          d += h(s);
+          h += l(s);
           break;
         case "n":
-          d += s.toString();
+          h += s.toString();
           break;
         case "M":
-          d += o[s - 1];
+          h += o[s - 1];
           break;
         case "F":
-          d += l[s - 1];
+          h += c[s - 1];
           break;
         case "d":
-          d += h(i);
+          h += l(i);
           break;
         case "j":
-          d += i.toString();
+          h += i.toString();
           break;
         case "D":
-          d += a[e.getDay()];
+          h += a[e.getDay()];
           break;
         case "l":
-          d += n[e.getDay()];
+          h += n[e.getDay()];
           break;
         case "S":
-          d += c(i);
+          h += d(i);
           break;
         default:
-          d += f;
+          h += b;
           break;
       }
     }
-    return d;
+    return h;
   }
   _validateDateString(e, t) {
     const i = this._parseDateString(e, t);
     return i !== null && !isNaN(i.getTime());
   }
   render() {
-    const e = this.getLabel(), t = this.getInfo(), i = this.getValue(), s = this.isDisabled(), r = this.isReadonly(), n = this.isRequired(), a = this.getId(), l = this.getName(), o = this.getFormat(), h = this.hasError(), c = this.getErrorMessage();
+    const e = this.getLabel(), t = this.getInfo(), i = this.getValue(), s = this.isDisabled(), r = this.isReadonly(), n = this.isRequired(), a = this.getId(), c = this.getName(), o = this.getFormat(), l = this.hasError(), d = this.getErrorMessage();
     this._isRange = this.isRange(), this._input || (this._input = document.createElement("div"), this._input.className = "relative w-full", this.appendChild(this._input));
-    let d = this.querySelector(".mint-date-picker-label-container");
+    let h = this.querySelector(".mint-date-picker-label-container");
     if (e || t) {
-      d || (d = document.createElement("div"), d.className = "mint-date-picker-label-container flex flex-col gap-0.5 mb-[.25rem]", this.insertBefore(d, this._input));
-      let m = d.querySelector(".mint-date-picker-label");
-      e ? (m || (m = document.createElement("label"), m.className = "mint-date-picker-label text-sm font-medium text-gray-900 dark:text-gray-100 select-none", d.insertBefore(m, d.firstChild)), m.textContent = e, a && this._textInput && m.setAttribute("for", a)) : m && m.remove();
-      let v = d.querySelector(".mint-date-picker-info");
-      t ? (v || (v = document.createElement("span"), v.className = "mint-date-picker-info text-xs text-gray-500 dark:text-gray-400 select-none", d.appendChild(v)), v.textContent = t) : v && v.remove();
-    } else d && d.remove();
-    this._hiddenInput || (this._hiddenInput = document.createElement("input"), this._hiddenInput.type = "hidden", this._hiddenInput.value = i || "", this._textInput = this._hiddenInput, this._input.appendChild(this._hiddenInput)), a && (this._hiddenInput.id = a), l && (this._hiddenInput.name = l), this._hiddenInput.value = i || "", this._hiddenInput.setAttribute("aria-invalid", h ? "true" : "false");
+      h || (h = document.createElement("div"), h.className = "mint-date-picker-label-container flex flex-col gap-0.5 mb-[.25rem]", this.insertBefore(h, this._input));
+      let m = h.querySelector(".mint-date-picker-label");
+      e ? (m || (m = document.createElement("label"), m.className = "mint-date-picker-label text-sm font-medium text-gray-900 dark:text-gray-100 select-none", h.insertBefore(m, h.firstChild)), m.textContent = e, a && this._textInput && m.setAttribute("for", a)) : m && m.remove();
+      let v = h.querySelector(".mint-date-picker-info");
+      t ? (v || (v = document.createElement("span"), v.className = "mint-date-picker-info text-xs text-gray-500 dark:text-gray-400 select-none", h.appendChild(v)), v.textContent = t) : v && v.remove();
+    } else h && h.remove();
+    this._hiddenInput || (this._hiddenInput = document.createElement("input"), this._hiddenInput.type = "hidden", this._hiddenInput.value = i || "", this._textInput = this._hiddenInput, this._input.appendChild(this._hiddenInput)), a && (this._hiddenInput.id = a), c && (this._hiddenInput.name = c), this._hiddenInput.value = i || "", this._hiddenInput.setAttribute("aria-invalid", l ? "true" : "false");
     let u = this._input.querySelector(".mint-date-fields");
-    u || (u = document.createElement("div"), this._input.appendChild(u)), this._fieldsContainer = u, this._applyErrorVisuals(h, c, s), u.innerHTML = "", this._displayEl = document.createElement("div"), this._displayEl.className = "flex-1 text-gray-900 dark:text-white cursor-text select-none focus:outline-none", this._displayEl.tabIndex = s ? -1 : 0, this._displayEl.addEventListener("click", () => {
+    u || (u = document.createElement("div"), this._input.appendChild(u)), this._fieldsContainer = u, this._applyErrorVisuals(l, d, s), u.innerHTML = "", this._displayEl = document.createElement("div"), this._displayEl.className = "flex-1 text-gray-900 dark:text-white cursor-text select-none focus:outline-none", this._displayEl.tabIndex = s ? -1 : 0, this._displayEl.addEventListener("click", () => {
       s || r || this._enterInputMode();
     }), this._displayEl.addEventListener("keydown", (m) => {
       s || r || (m.key === "Enter" || m.key === " ") && (m.preventDefault(), this._enterInputMode());
     }), this._inputsWrapperEl = document.createElement("div"), this._inputsWrapperEl.className = "flex items-center gap-1 w-full";
-    const f = this._getFormatTokens(o);
+    const b = this._getFormatTokens(o);
     this._startPartInputs = [], this._endPartInputs = [];
-    const g = (m) => {
+    const f = (m) => {
       const v = document.createDocumentFragment();
-      return f.forEach((C) => {
-        if (C.type === "sep") {
+      return b.forEach((E) => {
+        if (E.type === "sep") {
           const S = document.createElement("span");
-          S.textContent = C.value, S.className = "text-gray-400 dark:text-gray-500 select-none", v.appendChild(S);
+          S.textContent = E.value, S.className = "text-gray-400 dark:text-gray-500 select-none", v.appendChild(S);
         } else {
-          const S = C.part === "d" ? "dd" : C.part === "m" ? "mm" : C.len === 2 ? "yy" : "yyyy", y = this._createPartInput(C.len, S, s, r, n);
+          const S = E.part === "d" ? "dd" : E.part === "m" ? "mm" : E.len === 2 ? "yy" : "yyyy", y = this._createPartInput(E.len, S, s, r, n);
           m === "start" ? this._startPartInputs.push(y) : this._endPartInputs.push(y), v.appendChild(y);
         }
       }), v;
     };
-    if (this._inputsWrapperEl.appendChild(g("start")), this._isRange) {
+    if (this._inputsWrapperEl.appendChild(f("start")), this._isRange) {
       const m = document.createElement("span");
-      m.textContent = " - ", m.className = "text-gray-400 dark:text-gray-500 select-none", this._inputsWrapperEl.appendChild(m), this._inputsWrapperEl.appendChild(g("end"));
+      m.textContent = " - ", m.className = "text-gray-400 dark:text-gray-500 select-none", this._inputsWrapperEl.appendChild(m), this._inputsWrapperEl.appendChild(f("end"));
     }
     const _ = document.createElement("div");
     if (_.className = "flex flex-col w-full", this._displayEl.style.display = this._isInputMode ? "none" : "flex", this._inputsWrapperEl.style.display = this._isInputMode ? "flex" : "none", _.appendChild(this._displayEl), _.appendChild(this._inputsWrapperEl), u.appendChild(_), u.addEventListener("click", () => {
       this._isInputMode || s || r || this._enterInputMode();
-    }), this._attachPartInputHandlers(this._startPartInputs, f, u), this._isRange && this._attachPartInputHandlers(this._endPartInputs, f, u), this._parseValue(i), this._syncHiddenInput(), this._updateDisplayText(), this._iconButton)
+    }), this._attachPartInputHandlers(this._startPartInputs, b, u), this._isRange && this._attachPartInputHandlers(this._endPartInputs, b, u), this._parseValue(i), this._syncHiddenInput(), this._updateDisplayText(), this._iconButton)
       this._iconButton.disabled = s || r, !s && !r ? this._iconButton.tabIndex = 0 : this._iconButton.tabIndex = -1;
     else {
       this._iconButton = document.createElement("button"), this._iconButton.type = "button", this._iconButton.tabIndex = 0, this._iconButton.className = "absolute left-2 top-2 text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-300 cursor-pointer z-10 focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500 pointer-events-auto disabled:opacity-40 disabled:cursor-not-allowed flex items-center justify-center rounded-sm";
@@ -2648,7 +2632,7 @@ class re extends HTMLElement {
         s || r || this._enterInputMode();
       }), this._input.prepend(this._iconButton), this._iconButton.disabled = s || r;
     }
-    this._renderErrorState(h, c);
+    this._renderErrorState(l, d);
   }
   _renderErrorState(e, t) {
     let i = this.querySelector(".mint-date-picker-error");
@@ -2696,8 +2680,8 @@ class re extends HTMLElement {
     if (this._isRange) {
       const [i, s] = this._splitRangeInput(e, t), r = i ? this._parseDateString(i, t) : null, n = s ? this._parseDateString(s, t) : null;
       if (r && n) {
-        const [a, l] = r <= n ? [r, n] : [n, r], o = this._formatDate(a, t), h = this._formatDate(l, t), c = `${o} - ${h}`;
-        this.setValue(c), this._applyDateToParts(a, this._startPartInputs, this._getFormatTokens(t), t), this._applyDateToParts(l, this._endPartInputs, this._getFormatTokens(t), t), this._selectedStartDate = a, this._selectedEndDate = l, this._currentMonth = a.getMonth(), this._currentYear = a.getFullYear();
+        const [a, c] = r <= n ? [r, n] : [n, r], o = this._formatDate(a, t), l = this._formatDate(c, t), d = `${o} - ${l}`;
+        this.setValue(d), this._applyDateToParts(a, this._startPartInputs, this._getFormatTokens(t), t), this._applyDateToParts(c, this._endPartInputs, this._getFormatTokens(t), t), this._selectedStartDate = a, this._selectedEndDate = c, this._currentMonth = a.getMonth(), this._currentYear = a.getFullYear();
       } else if (r) {
         const a = this._formatDate(r, t);
         this.setValue(a), this._applyDateToParts(r, this._startPartInputs, this._getFormatTokens(t), t), this._applyDateToParts(null, this._endPartInputs, this._getFormatTokens(t), t), this._selectedStartDate = r, this._selectedEndDate = null, this._currentMonth = r.getMonth(), this._currentYear = r.getFullYear();
@@ -2796,61 +2780,61 @@ class re extends HTMLElement {
     this._calendarContainer.className = n ? "mint-date-calendar bg-white dark:bg-gray-800 rounded-lg p-4 w-[18rem] md:w-auto md:min-w-[28rem]" : "mint-date-calendar bg-white dark:bg-gray-800 rounded-lg p-4 w-[18rem] md:min-w-[18rem]";
     const a = document.createElement("div");
     a.className = "flex flex-col md:flex-row md:gap-6 md:items-start";
-    const l = document.createElement("div");
-    l.className = "flex-1 min-w-0";
+    const c = document.createElement("div");
+    c.className = "flex-1 min-w-0";
     const o = document.createElement("div");
     o.className = "flex items-center justify-between mb-4";
-    const h = document.createElement("button");
-    h.type = "button", h.tabIndex = 0, h.className = "p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-700 text-gray-600 dark:text-gray-300 transition-colors flex items-center focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", h.setAttribute("data-keep-popover-open", "true");
-    const c = document.createElement("mint-icon");
-    c.setAttribute("name", "caret-left"), c.className = "w-4 h-4", h.appendChild(c), h.addEventListener("click", () => {
+    const l = document.createElement("button");
+    l.type = "button", l.tabIndex = 0, l.className = "p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-700 text-gray-600 dark:text-gray-300 transition-colors flex items-center focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", l.setAttribute("data-keep-popover-open", "true");
+    const d = document.createElement("mint-icon");
+    d.setAttribute("name", "caret-left"), d.className = "w-4 h-4", l.appendChild(d), l.addEventListener("click", () => {
       this._currentMonth === 0 ? (this._currentMonth = 11, this._currentYear--) : this._currentMonth--, this._buildCalendar();
-    }), o.appendChild(h);
-    const d = document.createElement("div");
-    d.className = "flex items-center gap-2";
+    }), o.appendChild(l);
+    const h = document.createElement("div");
+    h.className = "flex items-center gap-2";
     const u = document.createElement("button");
     u.type = "button", u.tabIndex = 0, u.className = "text-sm font-medium text-gray-900 dark:text-gray-100 hover:text-gray-600 dark:hover:text-gray-300 transition-colors flex items-center focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", u.setAttribute("data-keep-popover-open", "true"), u.textContent = i[this._currentMonth], u.addEventListener("click", () => {
       this._viewMode = "month", this._buildCalendar();
-    }), d.appendChild(u);
-    const f = document.createElement("button");
-    f.type = "button", f.tabIndex = 0, f.className = "text-sm font-medium text-gray-900 dark:text-gray-100 hover:text-gray-600 dark:hover:text-gray-300 transition-colors flex items-center focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", f.setAttribute("data-keep-popover-open", "true"), f.textContent = String(this._currentYear), f.addEventListener("click", () => {
+    }), h.appendChild(u);
+    const b = document.createElement("button");
+    b.type = "button", b.tabIndex = 0, b.className = "text-sm font-medium text-gray-900 dark:text-gray-100 hover:text-gray-600 dark:hover:text-gray-300 transition-colors flex items-center focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", b.setAttribute("data-keep-popover-open", "true"), b.textContent = String(this._currentYear), b.addEventListener("click", () => {
       this._viewMode = "year", this._buildCalendar();
-    }), d.appendChild(f), o.appendChild(d);
-    const g = document.createElement("button");
-    g.type = "button", g.tabIndex = 0, g.className = "p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-700 text-gray-600 dark:text-gray-300 transition-colors flex items-center focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", g.setAttribute("data-keep-popover-open", "true");
+    }), h.appendChild(b), o.appendChild(h);
+    const f = document.createElement("button");
+    f.type = "button", f.tabIndex = 0, f.className = "p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-700 text-gray-600 dark:text-gray-300 transition-colors flex items-center focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", f.setAttribute("data-keep-popover-open", "true");
     const _ = document.createElement("mint-icon");
-    _.setAttribute("name", "caret-right"), _.className = "w-4 h-4", g.appendChild(_), g.addEventListener("click", () => {
+    _.setAttribute("name", "caret-right"), _.className = "w-4 h-4", f.appendChild(_), f.addEventListener("click", () => {
       this._currentMonth === 11 ? (this._currentMonth = 0, this._currentYear++) : this._currentMonth++, this._buildCalendar();
-    }), o.appendChild(g);
+    }), o.appendChild(f);
     const m = document.createElement("div");
     m.className = "grid grid-cols-7 mb-2", s.forEach((y) => {
-      const b = document.createElement("div");
-      b.className = "text-xs font-medium text-gray-500 dark:text-gray-400 text-center py-1", b.textContent = y, m.appendChild(b);
+      const g = document.createElement("div");
+      g.className = "text-xs font-medium text-gray-500 dark:text-gray-400 text-center py-1", g.textContent = y, m.appendChild(g);
     });
     const v = document.createElement("div");
     v.className = "grid grid-cols-7";
     for (let y = 0; y < t; y++) {
-      const b = document.createElement("div");
-      b.className = "w-8 h-8", v.appendChild(b);
+      const g = document.createElement("div");
+      g.className = "w-8 h-8", v.appendChild(g);
     }
-    const C = this.getMin() ? this._parseDateString(this.getMin(), this.getFormat()) : null, S = this.getMax() ? this._parseDateString(this.getMax(), this.getFormat()) : null;
+    const E = this.getMin() ? this._parseDateString(this.getMin(), this.getFormat()) : null, S = this.getMax() ? this._parseDateString(this.getMax(), this.getFormat()) : null;
     for (let y = 1; y <= e; y++) {
-      const b = new Date(this._currentYear, this._currentMonth, y), p = this._isToday(b), k = this._isDateSelected(b), E = this._isDateInRange(b), I = C && b < C || S && b > S;
-      let w = "rounded-md";
+      const g = new Date(this._currentYear, this._currentMonth, y), p = this._isToday(g), k = this._isDateSelected(g), x = this._isDateInRange(g), I = E && g < E || S && g > S;
+      let C = "rounded-md";
       if (this._isRange && this._selectedStartDate && this._selectedEndDate) {
-        const L = this._isSameDate(b, this._selectedStartDate), M = this._isSameDate(b, this._selectedEndDate);
-        L && M ? w = "rounded-md" : L ? w = "rounded-l-md" : M ? w = "rounded-r-md" : E && (w = "rounded-none");
-      } else k && !this._isRange && (w = "rounded-md");
-      const A = document.createElement("button");
-      A.type = "button", A.disabled = !!I, A.tabIndex = I ? -1 : 0, A.className = `w-full h-8 ${w} border-0 text-sm font-medium transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500 ${k ? "bg-slate-800 dark:bg-slate-600 text-white" : E ? "bg-slate-100 dark:bg-slate-700 text-slate-800 dark:text-slate-200" : p ? "text-gray-900 dark:text-gray-100 font-semibold" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"} ${I ? "opacity-40 cursor-not-allowed" : ""}`, A.textContent = y.toString(), I || A.addEventListener("click", () => {
-        this._handleDateClick(b);
-      }), v.appendChild(A);
+        const L = this._isSameDate(g, this._selectedStartDate), M = this._isSameDate(g, this._selectedEndDate);
+        L && M ? C = "rounded-md" : L ? C = "rounded-l-md" : M ? C = "rounded-r-md" : x && (C = "rounded-none");
+      } else k && !this._isRange && (C = "rounded-md");
+      const w = document.createElement("button");
+      w.type = "button", w.disabled = !!I, w.tabIndex = I ? -1 : 0, w.className = `w-full h-8 ${C} border-0 text-sm font-medium transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500 ${k ? "bg-slate-800 dark:bg-slate-600 text-white" : x ? "bg-slate-100 dark:bg-slate-700 text-slate-800 dark:text-slate-200" : p ? "text-gray-900 dark:text-gray-100 font-semibold" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"} ${I ? "opacity-40 cursor-not-allowed" : ""}`, w.textContent = y.toString(), I || w.addEventListener("click", () => {
+        this._handleDateClick(g);
+      }), v.appendChild(w);
     }
     if (n) {
       const y = document.createElement("div");
       y.className = "mb-4 pb-4 border-b border-gray-200 dark:border-gray-700 md:mb-0 md:pb-0 md:border-b-0 md:border-r md:border-r-gray-200 dark:md:border-r-gray-700 md:pr-6 md:mr-0 md:w-32 md:flex-shrink-0 md:h-full md:flex md:flex-col";
-      const b = document.createElement("div");
-      b.className = "relative md:relative md:flex-1 md:min-h-0";
+      const g = document.createElement("div");
+      g.className = "relative md:relative md:flex-1 md:min-h-0";
       const p = document.createElement("div");
       p.className = "flex gap-2 overflow-x-auto pb-1 md:flex-col md:overflow-x-visible md:overflow-y-auto md:pb-0 md:gap-2", p.style.scrollbarWidth = "none", p.style.msOverflowStyle = "none", p.style.setProperty("-webkit-overflow-scrolling", "touch");
       const k = document.createElement("style");
@@ -2879,21 +2863,21 @@ class re extends HTMLElement {
           }
         }
       `, p.classList.add("mint-date-shortcuts-row"), document.head.querySelector("style[data-mint-date-shortcuts]") || (k.setAttribute("data-mint-date-shortcuts", "true"), document.head.appendChild(k));
-      const E = document.createElement("div");
-      E.className = "absolute left-0 top-0 bottom-0 w-8 pointer-events-none z-10 bg-gradient-to-r from-white dark:from-gray-800 to-transparent opacity-0 transition-opacity duration-200 md:hidden", b.appendChild(E);
+      const x = document.createElement("div");
+      x.className = "absolute left-0 top-0 bottom-0 w-8 pointer-events-none z-10 bg-gradient-to-r from-white dark:from-gray-800 to-transparent opacity-0 transition-opacity duration-200 md:hidden", g.appendChild(x);
       const I = document.createElement("div");
-      I.className = "absolute right-0 top-0 bottom-0 w-8 pointer-events-none z-10 bg-gradient-to-l from-white dark:from-gray-800 to-transparent opacity-100 transition-opacity duration-200 md:hidden", b.appendChild(I);
+      I.className = "absolute right-0 top-0 bottom-0 w-8 pointer-events-none z-10 bg-gradient-to-l from-white dark:from-gray-800 to-transparent opacity-100 transition-opacity duration-200 md:hidden", g.appendChild(I);
+      const C = document.createElement("div");
+      C.className = "hidden md:block absolute top-0 left-0 right-0 h-8 pointer-events-none z-10 bg-gradient-to-b from-white dark:from-gray-800 to-transparent opacity-0 transition-opacity duration-200", g.appendChild(C);
       const w = document.createElement("div");
-      w.className = "hidden md:block absolute top-0 left-0 right-0 h-8 pointer-events-none z-10 bg-gradient-to-b from-white dark:from-gray-800 to-transparent opacity-0 transition-opacity duration-200", b.appendChild(w);
-      const A = document.createElement("div");
-      A.className = "hidden md:block absolute bottom-0 left-0 right-0 h-8 pointer-events-none z-10 bg-gradient-to-t from-white dark:from-gray-800 to-transparent opacity-100 transition-opacity duration-200", b.appendChild(A);
+      w.className = "hidden md:block absolute bottom-0 left-0 right-0 h-8 pointer-events-none z-10 bg-gradient-to-t from-white dark:from-gray-800 to-transparent opacity-100 transition-opacity duration-200", g.appendChild(w);
       const L = () => {
         if (window.innerWidth >= 768) {
           const T = p.scrollTop, H = p.scrollHeight, D = p.clientHeight;
-          T > 0 ? w.style.opacity = "1" : w.style.opacity = "0", T + D < H - 1 ? A.style.opacity = "1" : A.style.opacity = "0", E.style.opacity = "0", I.style.opacity = "0";
+          T > 0 ? C.style.opacity = "1" : C.style.opacity = "0", T + D < H - 1 ? w.style.opacity = "1" : w.style.opacity = "0", x.style.opacity = "0", I.style.opacity = "0";
         } else {
           const T = p.scrollLeft, H = p.scrollWidth, D = p.clientWidth;
-          T > 0 ? E.style.opacity = "1" : E.style.opacity = "0", T + D < H - 1 ? I.style.opacity = "1" : I.style.opacity = "0", w.style.opacity = "0", A.style.opacity = "0";
+          T > 0 ? x.style.opacity = "1" : x.style.opacity = "0", T + D < H - 1 ? I.style.opacity = "1" : I.style.opacity = "0", C.style.opacity = "0", w.style.opacity = "0";
         }
       };
       p.addEventListener("scroll", L), window.addEventListener("resize", L), setTimeout(L, 0), r.forEach((M) => {
@@ -2903,8 +2887,8 @@ class re extends HTMLElement {
           if (H) {
             if (this._isRange && "start" in H && "end" in H) {
               this._selectedStartDate = H.start, this._selectedEndDate = H.end;
-              const D = this.getFormat(), N = this._formatDate(H.start, D), O = this._formatDate(H.end, D), q = `${N} - ${O}`;
-              this.setValue(q), this._currentMonth = H.start.getMonth(), this._currentYear = H.start.getFullYear();
+              const D = this.getFormat(), N = this._formatDate(H.start, D), F = this._formatDate(H.end, D), P = `${N} - ${F}`;
+              this.setValue(P), this._currentMonth = H.start.getMonth(), this._currentYear = H.start.getFullYear();
             } else if (H instanceof Date) {
               this._selectedStartDate = H, this._selectedEndDate = null;
               const D = this.getFormat(), N = this._formatDate(H, D);
@@ -2921,9 +2905,9 @@ class re extends HTMLElement {
             }));
           }
         }), p.appendChild(T);
-      }), b.appendChild(p), y.appendChild(b), a.appendChild(y);
+      }), g.appendChild(p), y.appendChild(g), a.appendChild(y);
     }
-    l.appendChild(o), l.appendChild(m), l.appendChild(v), a.appendChild(l), this._calendarContainer.appendChild(a);
+    c.appendChild(o), c.appendChild(m), c.appendChild(v), a.appendChild(c), this._calendarContainer.appendChild(a);
   }
   _buildMonthView() {
     if (!this._calendarContainer) return;
@@ -2945,15 +2929,15 @@ class re extends HTMLElement {
     a.setAttribute("name", "caret-right"), a.className = "w-4 h-4", n.appendChild(a), n.addEventListener("click", () => {
       this._currentYear++, this._buildCalendar();
     }), t.appendChild(n);
-    const l = document.createElement("div");
-    l.className = "grid grid-cols-3 gap-2", e.forEach((o, h) => {
-      const c = document.createElement("button");
-      c.type = "button", c.tabIndex = 0, c.setAttribute("data-keep-popover-open", "true");
-      const d = this._currentMonth === h;
-      c.className = `p-2 rounded text-sm font-medium transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500 ${d ? "bg-slate-800 dark:bg-slate-600 text-white" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"}`, c.textContent = o, c.addEventListener("click", () => {
-        this._currentMonth = h, this._viewMode = "calendar", this._buildCalendar();
-      }), l.appendChild(c);
-    }), this._calendarContainer.appendChild(t), this._calendarContainer.appendChild(l);
+    const c = document.createElement("div");
+    c.className = "grid grid-cols-3 gap-2", e.forEach((o, l) => {
+      const d = document.createElement("button");
+      d.type = "button", d.tabIndex = 0, d.setAttribute("data-keep-popover-open", "true");
+      const h = this._currentMonth === l;
+      d.className = `p-2 rounded text-sm font-medium transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500 ${h ? "bg-slate-800 dark:bg-slate-600 text-white" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"}`, d.textContent = o, d.addEventListener("click", () => {
+        this._currentMonth = l, this._viewMode = "calendar", this._buildCalendar();
+      }), c.appendChild(d);
+    }), this._calendarContainer.appendChild(t), this._calendarContainer.appendChild(c);
   }
   _buildYearView() {
     if (!this._calendarContainer) return;
@@ -2969,19 +2953,19 @@ class re extends HTMLElement {
     n.className = "text-sm font-medium text-gray-900 dark:text-gray-100", n.textContent = `${e} - ${t}`, i.appendChild(n);
     const a = document.createElement("button");
     a.type = "button", a.tabIndex = 0, a.className = "p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-700 text-gray-600 dark:text-gray-300 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", a.setAttribute("data-keep-popover-open", "true");
-    const l = document.createElement("mint-icon");
-    l.setAttribute("name", "caret-right"), l.className = "w-4 h-4", a.appendChild(l), a.addEventListener("click", () => {
+    const c = document.createElement("mint-icon");
+    c.setAttribute("name", "caret-right"), c.className = "w-4 h-4", a.appendChild(c), a.addEventListener("click", () => {
       this._currentYear += 12, this._buildCalendar();
     }), i.appendChild(a);
     const o = document.createElement("div");
     o.className = "grid grid-cols-3 gap-2";
-    for (let h = e; h <= t; h++) {
-      const c = document.createElement("button");
-      c.type = "button", c.tabIndex = 0, c.setAttribute("data-keep-popover-open", "true");
-      const d = this._currentYear === h;
-      c.className = `p-2 rounded text-sm font-medium transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500 ${d ? "bg-slate-800 dark:bg-slate-600 text-white" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"}`, c.textContent = String(h), c.addEventListener("click", () => {
-        this._currentYear = h, this._viewMode = "calendar", this._buildCalendar();
-      }), o.appendChild(c);
+    for (let l = e; l <= t; l++) {
+      const d = document.createElement("button");
+      d.type = "button", d.tabIndex = 0, d.setAttribute("data-keep-popover-open", "true");
+      const h = this._currentYear === l;
+      d.className = `p-2 rounded text-sm font-medium transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500 ${h ? "bg-slate-800 dark:bg-slate-600 text-white" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"}`, d.textContent = String(l), d.addEventListener("click", () => {
+        this._currentYear = l, this._viewMode = "calendar", this._buildCalendar();
+      }), o.appendChild(d);
     }
     this._calendarContainer.appendChild(i), this._calendarContainer.appendChild(o);
   }
@@ -3074,7 +3058,7 @@ class re extends HTMLElement {
     this._removeFocusTrap();
     const e = this;
     this._focusTrapHandler = function(t) {
-      var l;
+      var c;
       if (t.key !== "Tab") return;
       if (!e._popover || !e._popover.hasAttribute("open")) {
         e._removeFocusTrap();
@@ -3083,7 +3067,7 @@ class re extends HTMLElement {
       const i = e._getFocusableElements();
       if (i.length === 0) return;
       const s = i[0], r = i[i.length - 1], n = document.activeElement;
-      if (!(((l = e._calendarContainer) == null ? void 0 : l.contains(n)) || !1)) {
+      if (!(((c = e._calendarContainer) == null ? void 0 : c.contains(n)) || !1)) {
         t.preventDefault(), s.focus();
         return;
       }
@@ -3106,8 +3090,8 @@ class re extends HTMLElement {
     this._focusTrapHandler && (document.removeEventListener("keydown", this._focusTrapHandler, !0), this._focusTrapHandler = null), this._escapeHandler && (document.removeEventListener("keydown", this._escapeHandler, !0), this._escapeHandler = null);
   }
 }
-customElements.get("mint-date-picker") || customElements.define("mint-date-picker", re);
-class ne extends HTMLElement {
+customElements.get("mint-date-picker") || customElements.define("mint-date-picker", ee);
+class te extends HTMLElement {
   constructor() {
     super(), this._select = null, this._wrapper = null, this._caretUpIcon = null, this._caretDownIcon = null, this._changeHandler = null;
   }
@@ -3202,32 +3186,32 @@ class ne extends HTMLElement {
   }
   render() {
     const e = [];
-    this._select && Array.from(this._select.options).forEach((d) => {
-      e.push(d.cloneNode(!0));
+    this._select && Array.from(this._select.children).forEach((h) => {
+      (h.tagName === "OPTION" || h.tagName === "OPTGROUP") && e.push(h.cloneNode(!0));
     });
-    const t = Array.from(this.querySelectorAll("option")).filter((d) => d.parentElement === this).map((d) => d.cloneNode(!0));
+    const t = Array.from(this.children).filter((h) => h.tagName === "OPTION" || h.tagName === "OPTGROUP").map((h) => h.cloneNode(!0));
     for (; this.firstChild; )
       this.removeChild(this.firstChild);
     this._wrapper = null, this._select = null;
-    const i = this.getLabel(), s = this.getInfo(), r = this.getId(), n = this.getName(), a = this.getValue(), l = this.isDisabled(), o = this.isMultiple(), h = this.hasError();
+    const i = this.getLabel(), s = this.getInfo(), r = this.getId(), n = this.getName(), a = this.getValue(), c = this.isDisabled(), o = this.isMultiple(), l = this.hasError();
     if (i) {
-      const d = document.createElement("label");
-      d.className = "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", r && d.setAttribute("for", r);
+      const h = document.createElement("label");
+      h.className = "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1", r && h.setAttribute("for", r);
       const u = document.createTextNode(i);
-      d.appendChild(u), this.appendChild(d);
+      h.appendChild(u), this.appendChild(h);
     }
-    this._wrapper = document.createElement("div"), this._wrapper.className = "relative w-full", this.appendChild(this._wrapper), this._select = document.createElement("select"), this._select.className = this.getSelectClasses(), r && (this._select.id = r), n && (this._select.name = n), l && (this._select.disabled = !0), o && (this._select.multiple = !0), a && (this._select.value = a), this._select.setAttribute("aria-invalid", h ? "true" : "false");
-    const c = e.length > 0 ? e : t;
-    if (c.length > 0 && c.forEach((d) => {
-      this._select.appendChild(d);
+    this._wrapper = document.createElement("div"), this._wrapper.className = "relative w-full", this.appendChild(this._wrapper), this._select = document.createElement("select"), this._select.className = this.getSelectClasses(), r && (this._select.id = r), n && (this._select.name = n), c && (this._select.disabled = !0), o && (this._select.multiple = !0), a && (this._select.value = a), this._select.setAttribute("aria-invalid", l ? "true" : "false");
+    const d = e.length > 0 ? e : t;
+    if (d.length > 0 && d.forEach((h) => {
+      this._select.appendChild(h);
     }), this._select.options.length === 0) {
-      const d = document.createElement("option");
-      d.value = "", d.textContent = "Select an option", d.disabled = !0, d.selected = !0, this._select.appendChild(d);
+      const h = document.createElement("option");
+      h.value = "", h.textContent = "Select an option", h.disabled = !0, h.selected = !0, this._select.appendChild(h);
     }
-    if (this._changeHandler && this._select && this._select.removeEventListener("change", this._changeHandler), this._changeHandler = (d) => {
-      const f = d.target.value;
-      f ? this.setAttribute("value", f) : this.removeAttribute("value"), this.dispatchEvent(new CustomEvent("change", {
-        detail: { value: f },
+    if (this._changeHandler && this._select && this._select.removeEventListener("change", this._changeHandler), this._changeHandler = (h) => {
+      const b = h.target.value;
+      b ? this.setAttribute("value", b) : this.removeAttribute("value"), this.dispatchEvent(new CustomEvent("change", {
+        detail: { value: b },
         bubbles: !0,
         cancelable: !0,
         composed: !0
@@ -3235,12 +3219,12 @@ class ne extends HTMLElement {
     }, this._select.addEventListener("change", this._changeHandler), this._wrapper.appendChild(this._select), o)
       this._caretUpIcon = null, this._caretDownIcon = null;
     else {
-      const d = document.createElement("div");
-      d.className = "absolute right-2 top-1/2 -translate-y-1/2 pointer-events-none z-10 flex flex-col", this._caretUpIcon = document.createElement("mint-icon"), this._caretUpIcon.setAttribute("name", "caret-up"), this._caretUpIcon.className = "w-[.9em] h-[.9em] text-gray-400 dark:text-gray-500 mb-[-.2rem]", d.appendChild(this._caretUpIcon), this._caretDownIcon = document.createElement("mint-icon"), this._caretDownIcon.setAttribute("name", "caret-down"), this._caretDownIcon.className = "w-[.9em] h-[.9em] text-gray-400 dark:text-gray-500 mt-[-.2rem]", d.appendChild(this._caretDownIcon), this._wrapper.appendChild(d);
+      const h = document.createElement("div");
+      h.className = "absolute right-2 top-1/2 -translate-y-1/2 pointer-events-none z-10 flex flex-col", this._caretUpIcon = document.createElement("mint-icon"), this._caretUpIcon.setAttribute("name", "caret-up"), this._caretUpIcon.className = "w-[.9em] h-[.9em] text-gray-400 dark:text-gray-500 mb-[-.2rem]", h.appendChild(this._caretUpIcon), this._caretDownIcon = document.createElement("mint-icon"), this._caretDownIcon.setAttribute("name", "caret-down"), this._caretDownIcon.className = "w-[.9em] h-[.9em] text-gray-400 dark:text-gray-500 mt-[-.2rem]", h.appendChild(this._caretDownIcon), this._wrapper.appendChild(h);
     }
     if (s) {
-      const d = document.createElement("div");
-      d.className = "mt-1 text-xs text-gray-500 dark:text-gray-400", d.textContent = s, this.appendChild(d);
+      const h = document.createElement("div");
+      h.className = "mt-1 text-xs text-gray-500 dark:text-gray-400", h.textContent = s, this.appendChild(h);
     }
     this._renderErrorState();
   }
@@ -3250,8 +3234,8 @@ class ne extends HTMLElement {
     e && t ? (i || (i = document.createElement("div"), i.className = "mint-select-error mt-1 text-xs text-red-600 dark:text-red-400", this.appendChild(i)), i.textContent = t) : i && i.remove();
   }
 }
-customElements.get("mint-select") || customElements.define("mint-select", ne);
-class ae extends HTMLElement {
+customElements.get("mint-select") || customElements.define("mint-select", te);
+class ie extends HTMLElement {
   constructor() {
     super(), this._dropzone = null, this._fileInput = null, this._previewContainer = null, this._isDragging = !1, this._wasDragging = !1, this._isUpdatingFiles = !1, this._listenersInitialized = !1, this._selectedFiles = [], this._previewUrls = [], this._resetHandler = null;
   }
@@ -3304,18 +3288,18 @@ class ae extends HTMLElement {
     return this.hasAttribute("disabled");
   }
   render() {
-    const e = this.getLabel(), t = this.getAccept(), i = this.isMultiple(), s = this.isDisabled(), r = this.getWidth(), n = this.getHeight(), a = this.getName(), l = this.hasError(), o = this.getErrorMessage();
-    this._dropzone || (this._dropzone = document.createElement("div"), this.appendChild(this._dropzone)), this._updateDragStateClass(), this._dropzone.setAttribute("aria-invalid", l ? "true" : "false"), this._dropzone.style.width = r, this._dropzone.style.height = n, this._dropzone.style.minWidth = r, this._dropzone.style.minHeight = n, this._fileInput || (this._fileInput = document.createElement("input"), this._fileInput.type = "file", this._fileInput.style.display = "none", this._dropzone.appendChild(this._fileInput)), this._fileInput.accept = t, this._fileInput.multiple = i, this._fileInput.disabled = s, a ? this._fileInput.name = a : this._fileInput.removeAttribute("name"), this._fileInput.setAttribute("aria-invalid", l ? "true" : "false");
-    const h = this._dropzone.querySelector(".mint-dropzone-icon"), c = this._dropzone.querySelector(".mint-dropzone-label");
-    h && h.remove(), c && c.remove();
-    const d = document.createElement("div");
-    d.className = "mint-dropzone-icon flex items-center justify-center mt-2 mb-2 flex-shrink-0";
+    const e = this.getLabel(), t = this.getAccept(), i = this.isMultiple(), s = this.isDisabled(), r = this.getWidth(), n = this.getHeight(), a = this.getName(), c = this.hasError(), o = this.getErrorMessage();
+    this._dropzone || (this._dropzone = document.createElement("div"), this.appendChild(this._dropzone)), this._updateDragStateClass(), this._dropzone.setAttribute("aria-invalid", c ? "true" : "false"), this._dropzone.style.width = r, this._dropzone.style.height = n, this._dropzone.style.minWidth = r, this._dropzone.style.minHeight = n, this._fileInput || (this._fileInput = document.createElement("input"), this._fileInput.type = "file", this._fileInput.style.display = "none", this._dropzone.appendChild(this._fileInput)), this._fileInput.accept = t, this._fileInput.multiple = i, this._fileInput.disabled = s, a ? this._fileInput.name = a : this._fileInput.removeAttribute("name"), this._fileInput.setAttribute("aria-invalid", c ? "true" : "false");
+    const l = this._dropzone.querySelector(".mint-dropzone-icon"), d = this._dropzone.querySelector(".mint-dropzone-label");
+    l && l.remove(), d && d.remove();
+    const h = document.createElement("div");
+    h.className = "mint-dropzone-icon flex items-center justify-center mt-2 mb-2 flex-shrink-0";
     const u = document.createElement("mint-icon");
-    if (u.setAttribute("name", "upload"), u.className = "w-12 h-12 text-gray-400 dark:text-gray-500", d.appendChild(u), this._dropzone.appendChild(d), e) {
-      const f = document.createElement("div");
-      f.className = "mint-dropzone-label text-sm font-medium text-gray-600 dark:text-gray-400 text-center px-4 flex-shrink-0", f.textContent = e, this._dropzone.appendChild(f);
+    if (u.setAttribute("name", "upload"), u.className = "w-12 h-12 text-gray-400 dark:text-gray-500", h.appendChild(u), this._dropzone.appendChild(h), e) {
+      const b = document.createElement("div");
+      b.className = "mint-dropzone-label text-sm font-medium text-gray-600 dark:text-gray-400 text-center px-4 flex-shrink-0", b.textContent = e, this._dropzone.appendChild(b);
     }
-    this.setupEventListeners(), this._renderErrorState(l, o), this._renderPreviews();
+    this.setupEventListeners(), this._renderErrorState(c, o), this._renderPreviews();
   }
   _updateDragState() {
     this._dropzone && this._updateDragStateClass();
@@ -3326,8 +3310,8 @@ class ae extends HTMLElement {
   }
   _updateDragStateClass() {
     if (!this._dropzone) return;
-    const e = this.isDisabled(), t = this.hasError(), r = `relative border-2 border-dashed rounded-lg transition-all duration-200 flex flex-col items-center ${this._selectedFiles.length > 0 ? "justify-start" : "justify-center"} cursor-pointer overflow-hidden`, n = this._isDragging ? "border-gray-400 dark:border-gray-500 bg-gray-50 dark:bg-gray-800" : "border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 hover:border-gray-400 dark:hover:border-gray-500", a = t ? "border-red-300 dark:border-red-300 bg-red-50/50 dark:bg-red-900/30" : "", l = e ? "opacity-40 cursor-not-allowed" : "";
-    this._dropzone.className = `${r} ${t ? a : n} ${l}`.trim();
+    const e = this.isDisabled(), t = this.hasError(), r = `relative border-2 border-dashed rounded-lg transition-all duration-200 flex flex-col items-center ${this._selectedFiles.length > 0 ? "justify-start" : "justify-center"} cursor-pointer overflow-hidden`, n = this._isDragging ? "border-gray-400 dark:border-gray-500 bg-gray-50 dark:bg-gray-800" : "border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 hover:border-gray-400 dark:hover:border-gray-500", a = t ? "border-red-300 dark:border-red-300 bg-red-50/50 dark:bg-red-900/30" : "", c = e ? "opacity-40 cursor-not-allowed" : "";
+    this._dropzone.className = `${r} ${t ? a : n} ${c}`.trim();
   }
   setupEventListeners() {
     this._listenersInitialized || (this._listenersInitialized = !0, this.removeEventListeners(), !(!this._dropzone || !this._fileInput || this.isDisabled()) && (this._onDropzoneClick || (this._onDropzoneClick = (e) => {
@@ -3357,17 +3341,17 @@ class ae extends HTMLElement {
       const i = e.target.files;
       if (i && i.length > 0) {
         const s = this.getAccept(), r = this.isMultiple(), n = [], a = [];
-        for (let l = 0; l < i.length; l++) {
-          const o = i[l];
+        for (let c = 0; c < i.length; c++) {
+          const o = i[c];
           this._isFileAccepted(o, s) ? n.push(o) : a.push(o);
         }
         if (!r && n.length > 1 && (a.push(...n.slice(1)), n.splice(1)), a.length > 0) {
-          const l = new CustomEvent("dropRejected", {
+          const c = new CustomEvent("dropRejected", {
             detail: { files: a, reason: "File type not accepted or multiple files not allowed" },
             bubbles: !0,
             cancelable: !0
           });
-          this.dispatchEvent(l);
+          this.dispatchEvent(c);
         }
         n.length > 0 && this._applyValidFiles(n);
       }
@@ -3457,25 +3441,25 @@ class ae extends HTMLElement {
     const e = document.createElement("div");
     e.className = "mint-dropzone-previews-wrapper mt-3 w-full relative max-h-48";
     const t = document.createElement("div");
-    t.className = "mint-dropzone-previews w-full flex flex-col gap-2 max-h-48 overflow-y-auto overflow-x-hidden px-2 pb-2", this._selectedFiles.forEach((o, h) => {
-      const c = document.createElement("div");
-      if (c.className = "flex items-center gap-3 p-2 rounded border border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-800", o.type.startsWith("image/")) {
-        const g = document.createElement("img");
-        g.className = "w-12 h-12 object-cover rounded border border-gray-200 dark:border-gray-700";
+    t.className = "mint-dropzone-previews w-full flex flex-col gap-2 max-h-48 overflow-y-auto overflow-x-hidden px-2 pb-2", this._selectedFiles.forEach((o, l) => {
+      const d = document.createElement("div");
+      if (d.className = "flex items-center gap-3 p-2 rounded border border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-800", o.type.startsWith("image/")) {
+        const f = document.createElement("img");
+        f.className = "w-12 h-12 object-cover rounded border border-gray-200 dark:border-gray-700";
         const _ = URL.createObjectURL(o);
-        this._previewUrls.push(_), g.src = _, c.appendChild(g);
+        this._previewUrls.push(_), f.src = _, d.appendChild(f);
       } else {
-        const g = document.createElement("mint-icon");
-        g.setAttribute("name", "attach"), g.className = "w-5 h-5 text-gray-500 dark:text-gray-300", c.appendChild(g);
+        const f = document.createElement("mint-icon");
+        f.setAttribute("name", "attach"), f.className = "w-5 h-5 text-gray-500 dark:text-gray-300", d.appendChild(f);
       }
-      const d = document.createElement("div");
-      d.className = "flex-1 text-sm text-gray-800 dark:text-gray-100 truncate", d.textContent = o.name, c.appendChild(d);
+      const h = document.createElement("div");
+      h.className = "flex-1 text-sm text-gray-800 dark:text-gray-100 truncate", h.textContent = o.name, d.appendChild(h);
       const u = document.createElement("button");
       u.type = "button", u.className = "text-gray-500 hover:bg-red-100 dark:hover:bg-red-900/30 transition-colors flex items-center justify-center w-6 h-6 rounded-full";
-      const f = document.createElement("mint-icon");
-      f.setAttribute("name", "close"), f.className = "w-4 h-4", u.appendChild(f), u.addEventListener("click", (g) => {
-        g.preventDefault(), g.stopPropagation(), this._removeFileAt(h);
-      }), c.appendChild(u), t.appendChild(c);
+      const b = document.createElement("mint-icon");
+      b.setAttribute("name", "close"), b.className = "w-4 h-4", u.appendChild(b), u.addEventListener("click", (f) => {
+        f.preventDefault(), f.stopPropagation(), this._removeFileAt(l);
+      }), d.appendChild(u), t.appendChild(d);
     });
     const i = this.hasError(), s = this._isDragging;
     let r = "from-white dark:from-gray-700";
@@ -3484,11 +3468,11 @@ class ae extends HTMLElement {
     n.className = `absolute top-0 left-0 right-0 h-4 pointer-events-none z-10 bg-gradient-to-b ${r} to-transparent opacity-0 transition-opacity duration-200`, e.appendChild(n);
     const a = document.createElement("div");
     a.className = `absolute bottom-0 left-0 right-0 h-4 pointer-events-none z-10 bg-gradient-to-t ${r} to-transparent opacity-100 transition-opacity duration-200`, e.appendChild(a);
-    const l = () => {
-      const o = t.scrollTop, h = t.scrollHeight, c = t.clientHeight;
-      o > 0 ? n.style.opacity = "1" : n.style.opacity = "0", o + c < h - 1 ? a.style.opacity = "1" : a.style.opacity = "0";
+    const c = () => {
+      const o = t.scrollTop, l = t.scrollHeight, d = t.clientHeight;
+      o > 0 ? n.style.opacity = "1" : n.style.opacity = "0", o + d < l - 1 ? a.style.opacity = "1" : a.style.opacity = "0";
     };
-    l(), t.addEventListener("scroll", l), e.appendChild(t), this._previewContainer = e, this._dropzone.appendChild(e), this._updateDragStateClass();
+    c(), t.addEventListener("scroll", c), e.appendChild(t), this._previewContainer = e, this._dropzone.appendChild(e), this._updateDragStateClass();
   }
   _removeFileAt(e) {
     if (e < 0 || e >= this._selectedFiles.length) return;
@@ -3518,8 +3502,8 @@ class ae extends HTMLElement {
     );
   }
 }
-customElements.get("mint-dropzone") || customElements.define("mint-dropzone", ae);
-class oe extends HTMLElement {
+customElements.get("mint-dropzone") || customElements.define("mint-dropzone", ie);
+class se extends HTMLElement {
   constructor() {
     super(), this._form = null, this._submitHandler = null, this._hostSubmitHandler = null, this._errors = {}, this._fieldBlurHandlers = /* @__PURE__ */ new Map(), this._fieldChangeHandlers = /* @__PURE__ */ new Map(), this._observer = null;
   }
@@ -3596,56 +3580,56 @@ class oe extends HTMLElement {
     const i = this.getAttribute("action"), s = (this.getAttribute("method") || "POST").toUpperCase(), r = this.getAttribute("enctype") || "application/x-www-form-urlencoded";
     if (!i)
       return { status: 0, ok: !0, data: { values: t } };
-    const n = Array.from(e.values()).some((h) => h instanceof File);
+    const n = Array.from(e.values()).some((l) => l instanceof File);
     let a = null;
-    const l = {};
+    const c = {};
     let o = i;
     if (s === "GET") {
-      const h = new URLSearchParams();
-      e.forEach((c, d) => {
-        c instanceof File || h.append(d, String(c));
-      }), o += (i.includes("?") ? "&" : "?") + h.toString();
+      const l = new URLSearchParams();
+      e.forEach((d, h) => {
+        d instanceof File || l.append(h, String(d));
+      }), o += (i.includes("?") ? "&" : "?") + l.toString();
     } else if (r === "multipart/form-data" || n)
       a = e;
     else if (r === "application/json")
-      a = JSON.stringify(t), l["Content-Type"] = "application/json";
+      a = JSON.stringify(t), c["Content-Type"] = "application/json";
     else {
-      const h = new URLSearchParams();
-      e.forEach((c, d) => {
-        c instanceof File || h.append(d, String(c));
-      }), a = h, l["Content-Type"] = "application/x-www-form-urlencoded";
+      const l = new URLSearchParams();
+      e.forEach((d, h) => {
+        d instanceof File || l.append(h, String(d));
+      }), a = l, c["Content-Type"] = "application/x-www-form-urlencoded";
     }
     if (typeof fetch == "function") {
-      const h = await fetch(o, {
+      const l = await fetch(o, {
         method: s,
         body: s === "GET" ? null : a,
-        headers: l
-      }), c = await h.text().catch(() => "");
-      let d = c;
+        headers: c
+      }), d = await l.text().catch(() => "");
+      let h = d;
       try {
-        d = JSON.parse(c);
+        h = JSON.parse(d);
       } catch {
       }
-      if (!h.ok)
-        throw { status: h.status, data: d };
-      return { status: h.status, ok: h.ok, data: d };
-    }
-    return await new Promise((h, c) => {
-      const d = new XMLHttpRequest();
-      d.open(s, o, !0), Object.entries(l).forEach(([u, f]) => d.setRequestHeader(u, f)), d.onload = function() {
-        const { status: u, responseText: f } = d;
+      if (!l.ok)
+        throw { status: l.status, data: h };
+      return { status: l.status, ok: l.ok, data: h };
+    }
+    return await new Promise((l, d) => {
+      const h = new XMLHttpRequest();
+      h.open(s, o, !0), Object.entries(c).forEach(([u, b]) => h.setRequestHeader(u, b)), h.onload = function() {
+        const { status: u, responseText: b } = h;
         if (u >= 200 && u < 300) {
-          let g = f;
+          let f = b;
           try {
-            g = JSON.parse(f);
+            f = JSON.parse(b);
           } catch {
           }
-          h({ status: u, ok: !0, data: g });
+          l({ status: u, ok: !0, data: f });
         } else
-          c({ status: u, data: f });
-      }, d.onerror = function() {
-        c({ status: d.status, data: d.responseText });
-      }, d.send(s === "GET" ? null : a);
+          d({ status: u, data: b });
+      }, h.onerror = function() {
+        d({ status: h.status, data: h.responseText });
+      }, h.send(s === "GET" ? null : a);
     });
   }
   _formDataToValues(e) {
@@ -3658,10 +3642,10 @@ class oe extends HTMLElement {
         const n = s.files;
         if (n.length > 0) {
           const a = Array.from(n);
-          t[r] && Array.isArray(t[r]) ? a.forEach((l) => {
+          t[r] && Array.isArray(t[r]) ? a.forEach((c) => {
             t[r].some(
-              (h) => h.name === l.name && h.size === l.size && h.lastModified === l.lastModified
-            ) || t[r].push(l);
+              (l) => l.name === c.name && l.size === c.size && l.lastModified === c.lastModified
+            ) || t[r].push(c);
           }) : t[r] = a;
         }
       }
@@ -3689,7 +3673,7 @@ class oe extends HTMLElement {
   _validate(e, t) {
     let i = !0;
     return this._errors = {}, Object.entries(t || {}).forEach(([s, r]) => {
-      const n = Array.isArray(r) ? r : [r], a = this._getFieldElements(s), l = this._extractFieldValue(a), o = this._validateRules(l, n);
+      const n = Array.isArray(r) ? r : [r], a = this._getFieldElements(s), c = this._extractFieldValue(a), o = this._validateRules(c, n);
       o ? (i = !1, this._errors[s] = o, this._flagFieldError(a, o)) : this._clearFieldError(a);
     }), i;
   }
@@ -3853,8 +3837,8 @@ class oe extends HTMLElement {
       if (!r) return;
       const n = this._getFieldName(r);
       if (!n || !this._collectValidationRules()[n]) return;
-      const l = this._extractFieldValue([r]), o = l != null && (typeof l == "string" ? l.trim() !== "" : l instanceof FileList || Array.isArray(l) ? l.length > 0 : !0), h = r.hasAttribute("data-mint-form-error") || s instanceof HTMLElement && (s.hasAttribute("aria-invalid") || s.closest("[data-mint-form-error]"));
-      (o || h) && setTimeout(() => {
+      const c = this._extractFieldValue([r]), o = c != null && (typeof c == "string" ? c.trim() !== "" : c instanceof FileList || Array.isArray(c) ? c.length > 0 : !0), l = r.hasAttribute("data-mint-form-error") || s instanceof HTMLElement && (s.hasAttribute("aria-invalid") || s.closest("[data-mint-form-error]"));
+      (o || l) && setTimeout(() => {
         this._validateField(n);
       }, 0);
     };
@@ -3865,10 +3849,10 @@ class oe extends HTMLElement {
       if (s instanceof HTMLSelectElement || s.tagName === "MINT-SELECT" || s.closest("mint-select")) {
         const o = this._findFieldElement(s);
         if (!o) return;
-        const h = this._getFieldName(o);
-        if (!h || !this._collectValidationRules()[h]) return;
+        const l = this._getFieldName(o);
+        if (!l || !this._collectValidationRules()[l]) return;
         setTimeout(() => {
-          this._validateField(h);
+          this._validateField(l);
         }, 0);
         return;
       }
@@ -3918,19 +3902,23 @@ class oe extends HTMLElement {
     });
   }
 }
-customElements.get("mint-form") || customElements.define("mint-form", oe);
-class le extends HTMLElement {
+customElements.get("mint-form") || customElements.define("mint-form", se);
+class re extends HTMLElement {
   constructor() {
-    super(), this._observer = null;
+    super(), this._observer = null, this._hoverHandlers = /* @__PURE__ */ new Map();
   }
   static get observedAttributes() {
     return ["striped", "hover", "bordered", "compact"];
   }
   connectedCallback() {
-    this.classList.add("block", "w-full", "overflow-x-auto"), this._applyStyles(), this._observeChanges(), setTimeout(() => this._applyStyles(), 0), setTimeout(() => this._applyStyles(), 100);
+    this.style.display = "block", this.style.width = "100%", this.style.overflowX = "auto", this._observeChanges(), this._applyStyles(), requestAnimationFrame(() => {
+      this._applyStyles(), setTimeout(() => this._applyStyles(), 0), setTimeout(() => this._applyStyles(), 50), setTimeout(() => this._applyStyles(), 100), setTimeout(() => this._applyStyles(), 200);
+    });
   }
   disconnectedCallback() {
-    this._observer && (this._observer.disconnect(), this._observer = null);
+    this._observer && (this._observer.disconnect(), this._observer = null), this._hoverHandlers.forEach((e, t) => {
+      t.removeEventListener("mouseenter", e.enter), t.removeEventListener("mouseleave", e.leave);
+    }), this._hoverHandlers.clear();
   }
   attributeChangedCallback() {
     this._applyStyles();
@@ -3948,73 +3936,59 @@ class le extends HTMLElement {
     const e = this.querySelector("table");
     if (!e) return;
     const t = this.hasAttribute("bordered"), i = this.hasAttribute("striped"), s = this.hasAttribute("hover"), r = this.hasAttribute("compact");
-    this._setClasses(e, [
-      "w-full",
-      "border-collapse",
-      "text-sm",
-      "font-medium"
-    ]);
+    e.style.width = "100%", e.style.borderCollapse = "collapse", e.style.fontSize = "0.875rem", e.style.fontWeight = "500";
     const n = e.querySelector("thead");
-    n && (this._setClasses(n, ["bg-gray-50", "dark:bg-gray-800"]), n.querySelectorAll("th").forEach((h) => {
-      const c = [
-        "text-left",
-        "font-semibold",
-        "text-gray-900",
-        "dark:text-white",
-        "uppercase",
-        "tracking-wider",
-        "text-xs"
-      ];
-      t && c.push("border", "border-gray-200", "dark:border-gray-700"), r ? c.push("px-3", "py-1.5") : c.push("px-4", "py-3"), this._setClasses(h, c);
+    n && (n.style.backgroundColor = "rgb(249 250 251)", document.documentElement.classList.contains("dark") && (n.style.backgroundColor = "rgb(31 41 55)"), n.querySelectorAll("th").forEach((l) => {
+      l.style.textAlign = "left", l.style.fontWeight = "600", l.style.color = "rgb(17 24 39)", document.documentElement.classList.contains("dark") && (l.style.color = "rgb(255 255 255)"), l.style.textTransform = "uppercase", l.style.letterSpacing = "0.05em", l.style.fontSize = "0.75rem", t && (l.style.border = "1px solid rgb(229 231 235)", document.documentElement.classList.contains("dark") && (l.style.borderColor = "rgb(55 65 81)")), r ? l.style.padding = "0.375rem 0.75rem" : l.style.padding = "0.75rem 1rem";
     }));
     const a = e.querySelector("tbody");
-    a && (i ? this._setClasses(a, ["divide-y", "divide-gray-200", "dark:divide-gray-700"]) : this._setClasses(a, []), a.querySelectorAll("tr").forEach((h, c) => {
-      const d = [];
-      t && d.push("border-b", "border-gray-200", "dark:border-gray-700"), i ? c % 2 === 0 ? d.push("bg-white", "dark:bg-gray-900") : d.push("bg-gray-50", "dark:bg-gray-800") : d.push("bg-white", "dark:bg-gray-900"), s && d.push("transition-colors", "duration-150", "hover:bg-gray-100", "dark:hover:bg-gray-800"), this._setClasses(h, d), h.querySelectorAll("td").forEach((f) => {
-        const g = [
-          "text-gray-900",
-          "dark:text-gray-100"
-        ];
-        t && g.push("border", "border-gray-200", "dark:border-gray-700"), r ? g.push("px-3", "py-1.5") : g.push("px-4", "py-3"), this._setClasses(f, g);
+    a && (i && (a.style.borderTopWidth = "1px", a.style.borderTopStyle = "solid", a.style.borderTopColor = "rgb(229 231 235)", document.documentElement.classList.contains("dark") && (a.style.borderTopColor = "rgb(55 65 81)")), a.querySelectorAll("tr").forEach((l, d) => {
+      if (t && (l.style.borderBottomWidth = "1px", l.style.borderBottomStyle = "solid", l.style.borderBottomColor = "rgb(229 231 235)", document.documentElement.classList.contains("dark") && (l.style.borderBottomColor = "rgb(55 65 81)")), i ? d % 2 === 0 ? (l.style.backgroundColor = "rgb(255 255 255)", document.documentElement.classList.contains("dark") && (l.style.backgroundColor = "rgb(17 24 39)")) : (l.style.backgroundColor = "rgb(249 250 251)", document.documentElement.classList.contains("dark") && (l.style.backgroundColor = "rgb(31 41 55)")) : (l.style.backgroundColor = "rgb(255 255 255)", document.documentElement.classList.contains("dark") && (l.style.backgroundColor = "rgb(17 24 39)")), s) {
+        l.style.transition = "background-color 150ms";
+        const u = this._hoverHandlers.get(l);
+        u && (l.removeEventListener("mouseenter", u.enter), l.removeEventListener("mouseleave", u.leave));
+        const b = () => {
+          l.style.backgroundColor = "rgb(243 244 246)", document.documentElement.classList.contains("dark") && (l.style.backgroundColor = "rgb(31 41 55)");
+        }, f = () => {
+          i ? d % 2 === 0 ? (l.style.backgroundColor = "rgb(255 255 255)", document.documentElement.classList.contains("dark") && (l.style.backgroundColor = "rgb(17 24 39)")) : (l.style.backgroundColor = "rgb(249 250 251)", document.documentElement.classList.contains("dark") && (l.style.backgroundColor = "rgb(31 41 55)")) : (l.style.backgroundColor = "rgb(255 255 255)", document.documentElement.classList.contains("dark") && (l.style.backgroundColor = "rgb(17 24 39)"));
+        };
+        this._hoverHandlers.set(l, { enter: b, leave: f }), l.addEventListener("mouseenter", b), l.addEventListener("mouseleave", f);
+      } else {
+        const u = this._hoverHandlers.get(l);
+        u && (l.removeEventListener("mouseenter", u.enter), l.removeEventListener("mouseleave", u.leave), this._hoverHandlers.delete(l));
+      }
+      l.querySelectorAll("td").forEach((u) => {
+        u.style.color = "rgb(17 24 39)", document.documentElement.classList.contains("dark") && (u.style.color = "rgb(243 244 246)"), t && (u.style.border = "1px solid rgb(229 231 235)", document.documentElement.classList.contains("dark") && (u.style.borderColor = "rgb(55 65 81)")), r ? u.style.padding = "0.375rem 0.75rem" : u.style.padding = "0.75rem 1rem";
       });
     }));
-    const l = e.querySelector("tfoot");
-    l && (this._setClasses(l, ["bg-gray-50", "dark:bg-gray-800", "font-semibold"]), l.querySelectorAll("td").forEach((h) => {
-      const c = [
-        "text-gray-900",
-        "dark:text-gray-100"
-      ];
-      t && c.push("border", "border-gray-200", "dark:border-gray-700"), r ? c.push("px-3", "py-1.5") : c.push("px-4", "py-3"), this._setClasses(h, c);
+    const c = e.querySelector("tfoot");
+    c && (c.style.backgroundColor = "rgb(249 250 251)", document.documentElement.classList.contains("dark") && (c.style.backgroundColor = "rgb(31 41 55)"), c.style.fontWeight = "600", c.querySelectorAll("td").forEach((l) => {
+      l.style.color = "rgb(17 24 39)", document.documentElement.classList.contains("dark") && (l.style.color = "rgb(243 244 246)"), t && (l.style.border = "1px solid rgb(229 231 235)", document.documentElement.classList.contains("dark") && (l.style.borderColor = "rgb(55 65 81)")), r ? l.style.padding = "0.375rem 0.75rem" : l.style.padding = "0.75rem 1rem";
     }));
   }
-  _setClasses(e, t) {
-    e.className = "", t.forEach((i) => {
-      i && i.trim() && e.classList.add(i);
-    });
-  }
 }
-customElements.get("mint-table") || customElements.define("mint-table", le);
+customElements.get("mint-table") || customElements.define("mint-table", re);
 export {
-  J as BackButton,
-  R as Button,
-  Y as Card,
-  te as Checkbox,
-  ie as Choice,
-  re as DatePicker,
-  ae as Dropzone,
-  oe as Form,
-  X as Grid,
-  V as Icon,
-  se as Input,
-  U as Link,
-  Z as Modal,
-  G as Page,
-  Q as Popover,
-  ne as Select,
-  B as Spinner,
-  $ as Stack,
-  W as Switch,
-  le as Table,
-  j as Text,
-  R as default
+  Y as BackButton,
+  z as Button,
+  j as Card,
+  K as Checkbox,
+  Z as Choice,
+  ee as DatePicker,
+  ie as Dropzone,
+  se as Form,
+  G as Grid,
+  B as Icon,
+  Q as Input,
+  $ as Link,
+  J as Modal,
+  U as Page,
+  X as Popover,
+  te as Select,
+  q as Spinner,
+  W as Stack,
+  V as Switch,
+  re as Table,
+  R as Text,
+  z as default
 };