monobill-mintui 0.1.4 → 0.1.6

package/dist/index.js

@@ -35,11 +35,11 @@ class q 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 l = this.getAttribute("data-button-tone") || "neutral";
-      s === "solid" ? l === "neutral" ? n = r ? "#ffffff" : "#0f172a" : n = "#ffffff" : n = r ? "#ffffff" : "#0f172a";
+      const o = this.getAttribute("data-button-tone") || "neutral";
+      s === "solid" ? o === "neutral" ? n = r ? "#ffffff" : "#0f172a" : n = "#ffffff" : n = r ? "#ffffff" : "#0f172a";
     } else
       n = r ? "#e2e8f0" : "#0f172a";
-    const a = t === "large" ? "2" : "4", c = !!(this.style.width && this.style.height), o = `
+    const a = t === "large" ? "2" : "4", c = !!(this.style.width && this.style.height), l = `
       <svg 
         xmlns="http://www.w3.org/2000/svg" 
         fill="none" 
@@ -83,7 +83,7 @@ class q extends HTMLElement {
         </circle>
       </svg>
     `;
-    this.innerHTML = o.trim();
+    this.innerHTML = l.trim();
   }
 }
 customElements.get("mint-spinner") || customElements.define("mint-spinner", q);
@@ -121,10 +121,10 @@ class B extends HTMLElement {
   getIconUrl() {
     var t;
     const e = document.documentElement.getAttribute("data-icon-base-url") || ((t = document.querySelector('meta[name="icon-base-url"]')) == null ? void 0 : t.getAttribute("content"));
-    return e ? `${e}/${this.getName()}.svg` : `/icons/${this.getName()}.svg`;
+    return e ? `${e.endsWith("/") ? e : `${e}/`}${this.getName()}.svg` : `/icons/${this.getName()}.svg`;
   }
   render() {
-    var a, c;
+    var c, l, o;
     const e = this.getName();
     if (!e) {
       this.innerHTML = "", this.style.maskImage = "", this.style.webkitMaskImage = "";
@@ -134,21 +134,24 @@ class B extends HTMLElement {
       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") || ((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);
-    });
-    const n = this.getIconUrl();
-    if (this.style.maskImage = `url(${n})`, this.style.webkitMaskImage = `url(${n})`, this.style.maskSize = "contain", this.style.webkitMaskSize = "contain", this.style.maskRepeat = "no-repeat", this.style.webkitMaskRepeat = "no-repeat", this.style.maskPosition = "center", this.style.webkitMaskPosition = "center", this.style.aspectRatio = "1 / 1", this.style.backgroundColor = "currentColor", s)
+    const i = this.closest("mint-button") || ((c = this.parentElement) == null ? void 0 : c.closest("mint-button")), s = this.closest("mint-switch") || ((l = this.parentElement) == null ? void 0 : l.closest("mint-switch")), r = this.closest("mint-select") || ((o = this.parentElement) == null ? void 0 : o.closest("mint-select"));
+    if (!Array.from(this.classList).some(
+      (d) => d.startsWith("w-") || d.startsWith("h-")
+    ) && !r) {
+      let d;
+      s ? d = "w-3 h-3" : i ? d = "w-5 h-5" : d = "w-[1.3em] h-[1.3em]", this.classList.remove("w-4", "h-4", "w-5", "h-5", "w-[1em]", "h-[1em]", "w-[1.3em]", "h-[1.3em]", "w-3", "h-3"), d.split(" ").forEach((h) => {
+        h && this.classList.add(h);
+      });
+    }
+    const a = this.getIconUrl();
+    if (this.style.maskImage = `url(${a})`, this.style.webkitMaskImage = `url(${a})`, this.style.maskSize = "contain", this.style.webkitMaskSize = "contain", this.style.maskRepeat = "no-repeat", this.style.webkitMaskRepeat = "no-repeat", this.style.maskPosition = "center", this.style.webkitMaskPosition = "center", this.style.aspectRatio = "1 / 1", this.style.backgroundColor = "currentColor", this.innerHTML = "", s)
       this.classList.remove("text-gray-100", "text-gray-900"), this.classList.add("text-gray-900");
     else if (i)
       this.classList.remove("text-gray-100", "text-gray-900");
     else {
-      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);
+      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);
     }
-    this.innerHTML = "";
   }
 }
 customElements.get("mint-icon") || customElements.define("mint-icon", B);
@@ -214,8 +217,8 @@ class z extends HTMLElement {
         if (c.nodeType === Node.TEXT_NODE && ((n = c.textContent) != null && n.trim()))
           return !1;
         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())
+          const l = c;
+          if (l.tagName !== "MINT-ICON" && l.tagName !== "MINT-SPINNER" && !l.querySelector("mint-spinner") && !l.hasAttribute("slot") && l.className !== "mint-button-icon" && !(l.className === "mr-2" && l.querySelector("mint-spinner")) && (a = l.textContent) != null && a.trim())
             return !1;
         }
       }
@@ -537,7 +540,7 @@ class z extends HTMLElement {
     return this.isFullWidth() && c.push("w-full"), c.join(" ");
   }
   render() {
-    var l, d, h, u, b;
+    var o, d, h, u, b;
     const e = this.isDisabled() || this.isLoading(), t = this.getType();
     if (!this._button) {
       for (this._button = document.createElement("button"); this.firstChild; )
@@ -555,7 +558,7 @@ class z extends HTMLElement {
         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", f.appendChild(_), this._button.insertBefore(f, this._button.firstChild);
       }
-    else i && ((l = i.parentElement) == null || l.remove());
+    else i && ((o = i.parentElement) == null || o.remove());
     for (; this.firstChild && this.firstChild !== this._button; )
       this._button.appendChild(this.firstChild);
     const s = this.getIcon();
@@ -596,8 +599,8 @@ class z extends HTMLElement {
     }
     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;
+    const l = this.getButtonClasses();
+    this._button.className = l;
   }
   setupEventListeners() {
     this._button && !this._clickHandler && (this._clickHandler = this.handleClick.bind(this), this._clickHandler && this._button.addEventListener("click", this._clickHandler, !0), this._button.addEventListener("mousedown", this._handleMouseDown), this._button.addEventListener("mouseup", this._handleMouseUp), this._button.addEventListener("mouseleave", this._handleMouseLeave), this._button.addEventListener("touchstart", this._handleTouchStart), this._button.addEventListener("touchend", this._handleTouchEnd), this._button.addEventListener("touchcancel", this._handleTouchCancel));
@@ -844,14 +847,14 @@ class R extends HTMLElement {
       "text-green-600"
       // success
     ], i = ["text-2xl", "text-lg", "text-sm"];
-    i.forEach((o) => {
-      this.classList.remove(o), this._userClasses.delete(o);
-    }), t.forEach((o) => {
-      this.classList.remove(o), this._userClasses.delete(o);
+    i.forEach((l) => {
+      this.classList.remove(l), this._userClasses.delete(l);
+    }), t.forEach((l) => {
+      this.classList.remove(l), this._userClasses.delete(l);
     });
-    const s = this.getTextClasses().split(" ").filter((o) => o.trim());
-    Array.from(this.classList).forEach((o) => {
-      !t.includes(o) && !i.includes(o) && this._userClasses.add(o);
+    const s = this.getTextClasses().split(" ").filter((l) => l.trim());
+    Array.from(this.classList).forEach((l) => {
+      !t.includes(l) && !i.includes(l) && this._userClasses.add(l);
     });
     const n = [.../* @__PURE__ */ new Set([...s, ...Array.from(this._userClasses)])];
     this.className = n.join(" ");
@@ -1316,11 +1319,11 @@ class J extends HTMLElement {
     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(
       (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._headingSlot && 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(
       (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._bodySlot && 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 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(
@@ -1480,38 +1483,38 @@ class X 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 c = this.getDirection(), o = 0, l = 0;
+    let c = this.getDirection(), l = 0, o = 0;
     switch (c) {
       case "down":
-        if (o = e.bottom + a, l = e.left + e.width / 2 - s.width / 2, o + s.height > n) {
+        if (l = e.bottom + a, o = e.left + e.width / 2 - s.width / 2, l + 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));
+          d >= 0 ? (c = "up", l = d) : (l = Math.max(0, n - s.height - a), l + s.height > n && (l = 0));
         }
-        l < 0 && (l = a), l + s.width > r && (l = Math.max(a, r - s.width - a), l + s.width > r && (l = r - s.width));
+        o < 0 && (o = a), o + s.width > r && (o = Math.max(a, r - s.width - a), o + s.width > r && (o = r - s.width));
         break;
       case "up":
-        if (o = e.top - s.height - a, l = e.left + e.width / 2 - s.width / 2, o < 0) {
+        if (l = e.top - s.height - a, o = e.left + e.width / 2 - s.width / 2, l < 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));
+          d + s.height <= n ? (c = "down", l = d) : (l = Math.min(n - s.height - a, n - s.height), l < 0 && (l = n - s.height));
         }
-        l < 0 && (l = a), l + s.width > r && (l = Math.max(a, r - s.width - a), l + s.width > r && (l = r - s.width));
+        o < 0 && (o = a), o + s.width > r && (o = Math.max(a, r - s.width - a), o + s.width > r && (o = r - s.width));
         break;
       case "right":
-        if (o = e.top + e.height / 2 - s.height / 2, l = e.right + a, l + s.width > r) {
+        if (l = e.top + e.height / 2 - s.height / 2, o = e.right + a, o + 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));
+          d >= 0 ? (c = "left", o = d) : (o = Math.max(0, r - s.width - a), o + s.width > r && (o = 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));
+        l < 0 && (l = a), l + s.height > n && (l = Math.max(a, n - s.height - a), l + s.height > n && (l = n - s.height));
         break;
       case "left":
-        if (o = e.top + e.height / 2 - s.height / 2, l = e.left - s.width - a, l < 0) {
+        if (l = e.top + e.height / 2 - s.height / 2, o = e.left - s.width - a, o < 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));
+          d + s.width <= r ? (c = "right", o = d) : (o = Math.min(r - s.width - a, r - s.width), o < 0 && (o = 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));
+        l < 0 && (l = a), l + s.height > n && (l = Math.max(a, n - s.height - a), l + s.height > n && (l = n - s.height));
         break;
     }
-    return { top: o, left: l, direction: c };
+    return { top: l, left: o, direction: c };
   }
   render() {
     const e = this.getId(), t = this.isOpen(), i = this.getPadding();
@@ -1519,8 +1522,8 @@ class X extends HTMLElement {
       if (this.classList.remove("hidden"), this.style.pointerEvents = "auto", !this._clickOutsideHandler) {
         const n = this;
         this._clickOutsideHandler = function(a) {
-          const c = a.composedPath(), o = c.includes(n);
-          if (!(n._triggerElement && c.includes(n._triggerElement)) && !o) {
+          const c = a.composedPath(), l = c.includes(n);
+          if (!(n._triggerElement && c.includes(n._triggerElement)) && !l) {
             n.close();
             return;
           }
@@ -1535,7 +1538,7 @@ class X 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"], c = n.filter((o) => !a.includes(o));
+      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((l) => !a.includes(l));
       s.className = [...c, i].join(" ");
     }
     Array.from(this.children).forEach((n) => {
@@ -1697,22 +1700,22 @@ class K extends HTMLElement {
     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 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");
+    let l = 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 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);
+      l || (l = document.createElement("div"), l.className = "mint-checkbox-label-container flex flex-col gap-0.5 flex-1", this.appendChild(l));
+      let o = l.querySelector(".mint-checkbox-label");
+      e ? (o || (o = document.createElement("span"), o.className = "mint-checkbox-label text-sm font-medium text-gray-900 dark:text-gray-100 cursor-pointer select-none", l.insertBefore(o, l.firstChild)), o.textContent = e, i ? o.classList.add("opacity-40") : o.classList.remove("opacity-40")) : o && o.remove();
+      let d = l.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", l.appendChild(d)), d.textContent = t, i ? d.classList.add("opacity-40") : d.classList.remove("opacity-40")) : d && d.remove(), i)
+        l.style.cursor = "default", l._clickHandler && (l.removeEventListener("click", l._clickHandler), l._clickHandler = null);
       else {
-        o.style.cursor = "pointer";
-        const h = o._clickHandler;
-        h && o.removeEventListener("click", h), o._clickHandler = (u) => {
+        l.style.cursor = "pointer";
+        const h = l._clickHandler;
+        h && l.removeEventListener("click", h), l._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);
+        }, l.addEventListener("click", l._clickHandler);
       }
-    } else o && o.remove();
+    } else l && l.remove();
   }
   setupEventListeners() {
     this.removeEventListeners(), this._checkbox && (this._changeHandler = (e) => {
@@ -1864,28 +1867,28 @@ class Z extends HTMLElement {
     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 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");
+    let l = 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 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);
+      l || (l = document.createElement("div"), l.className = "mint-choice-label-container flex flex-col gap-0.5 flex-1", this.appendChild(l));
+      let o = l.querySelector(".mint-choice-label");
+      e ? (o || (o = document.createElement("span"), o.className = "mint-choice-label text-sm font-medium text-gray-900 dark:text-gray-100 cursor-pointer select-none", l.insertBefore(o, l.firstChild)), o.textContent = e, i ? o.classList.add("opacity-40") : o.classList.remove("opacity-40")) : o && o.remove();
+      let d = l.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", l.appendChild(d)), d.textContent = t, i ? d.classList.add("opacity-40") : d.classList.remove("opacity-40")) : d && d.remove(), i)
+        l.style.cursor = "default", l._clickHandler && (l.removeEventListener("click", l._clickHandler), l._clickHandler = null);
       else {
-        o.style.cursor = "pointer";
-        const h = o._clickHandler;
-        h && o.removeEventListener("click", h), o._clickHandler = (u) => {
+        l.style.cursor = "pointer";
+        const h = l._clickHandler;
+        h && l.removeEventListener("click", h), l._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);
+        }, l.addEventListener("click", l._clickHandler);
       }
-    } else o && o.remove();
+    } else l && l.remove();
   }
   setupEventListeners() {
     this.removeEventListeners(), this._radio && (this._changeHandler = (e) => {
       e.stopPropagation();
       const t = this._checked;
-      if (this._checked = this._radio.checked, this._checked ? this.hasAttribute("checked") || this.setAttribute("checked", "") : this.hasAttribute("checked") && this.removeAttribute("checked"), this.updateVisualState(), this._checked) {
+      if (this._checked = this._radio.checked, this._checked ? this.hasAttribute("checked") || this.setAttribute("checked", "") : this.hasAttribute("checked") && this.removeAttribute("checked"), this.updateVisualState(), this._checked && this._radio) {
         const i = this._radio.name;
         i && document.querySelectorAll(`input[type="radio"][name="${i}"]`).forEach((r) => {
           if (r !== this._radio) {
@@ -2098,9 +2101,9 @@ class Q extends HTMLElement {
     return [...n, ...a, ...c].filter(Boolean).join(" ");
   }
   render() {
-    var v, E, S, y;
+    var v, x, 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(), 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();
+    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(), l = this.getId(), o = 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 = 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(() => {
@@ -2134,10 +2137,10 @@ class Q extends HTMLElement {
           cancelable: !0
         })));
       }), this._colorTextInput.addEventListener("blur", () => {
-        var k, x;
+        var k, E;
         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: ((x = this._colorPicker) == null ? void 0 : x.value) || "#000000" },
+          detail: { value: ((E = this._colorPicker) == null ? void 0 : E.value) || "#000000" },
           bubbles: !0,
           cancelable: !0
         }));
@@ -2145,7 +2148,7 @@ class Q extends HTMLElement {
       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"), l ? p.name = l : p.removeAttribute("name"), p.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), this._element = p;
+        l ? p.id = l : p.removeAttribute("id"), o ? p.name = o : p.removeAttribute("name"), p.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), this._element = p;
       }
       this._renderErrorState();
       return;
@@ -2158,14 +2161,14 @@ class Q extends HTMLElement {
         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 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;
+            const E = 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 = E + 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 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;
+            const E = 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 = E - 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 }));
           }
         });
@@ -2173,11 +2176,11 @@ class Q extends HTMLElement {
       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 = 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) {
+      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), l ? this._textarea.id = l : this._textarea.removeAttribute("id"), o ? this._textarea.name = o : 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 = 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) {
+    } 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), l ? this._input.id = l : this._input.removeAttribute("id"), o ? this._input.name = o : 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);
     }
@@ -2187,12 +2190,12 @@ class Q extends HTMLElement {
       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);
+        const k = l || ((v = this._element) == null ? void 0 : v.id) || ((x = this._colorTextInput) == null ? void 0 : x.id) || ((S = this._input) == null ? void 0 : S.id) || ((y = this._textarea) == null ? void 0 : y.id);
         if (k)
           g.setAttribute("for", k);
         else {
-          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);
+          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), g.setAttribute("for", E);
         }
         n ? g.classList.add("opacity-40") : g.classList.remove("opacity-40");
       } else g && g.remove();
@@ -2406,8 +2409,8 @@ class ee extends HTMLElement {
       if (c.type === "sep")
         n += c.value.length;
       else {
-        const o = r.substr(n, c.len);
-        t[a] && (t[a].value = o), a++, n += c.len;
+        const l = r.substr(n, c.len);
+        t[a] && (t[a].value = l), a++, n += c.len;
       }
     });
   }
@@ -2440,10 +2443,10 @@ class ee extends HTMLElement {
       }), s.addEventListener("keydown", (a) => {
         a.key === "Backspace" && s.selectionStart === 0 && s.selectionEnd === 0 && this._focusPrev(e, r), a.key === "ArrowLeft" && s.selectionStart === 0 && s.selectionEnd === 0 && (this._focusPrev(e, r), a.preventDefault()), a.key === "ArrowRight" && s.selectionStart === s.value.length && s.selectionEnd === s.value.length && (this._focusNext(e, r), a.preventDefault());
       }), s.addEventListener("blur", (a) => {
-        var o;
+        var l;
         this._syncHiddenInput();
         const c = a.relatedTarget;
-        c && i.contains(c) || (this._handleBlur(((o = this._hiddenInput) == null ? void 0 : o.value) || ""), this._exitInputMode());
+        c && i.contains(c) || (this._handleBlur(((l = this._hiddenInput) == null ? void 0 : l.value) || ""), this._exitInputMode());
       });
     });
   }
@@ -2456,8 +2459,8 @@ class ee 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 [c, o] = n <= a ? [n, a] : [a, n];
-        this._selectedStartDate = c, this._selectedEndDate = o, this._currentMonth = c.getMonth(), this._currentYear = c.getFullYear();
+        const [c, l] = n <= a ? [n, a] : [a, n];
+        this._selectedStartDate = c, this._selectedEndDate = l, 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 {
@@ -2471,36 +2474,36 @@ class ee 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, E = 0, S = 0;
+        let v = 0, x = 0, S = 0;
         for (let y = 0; y < m.length; y++) {
           const g = m[y].toLowerCase(), p = _[y];
           if (g.includes("d"))
             v = parseInt(p, 10);
           else if (g.includes("m"))
-            E = parseInt(p, 10) - 1;
+            x = parseInt(p, 10) - 1;
           else if (g.includes("y")) {
             let k = parseInt(p, 10);
-            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;
+            const E = g.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;
           }
         }
-        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)
+        if (v && x >= 0 && x <= 11 && S) {
+          const y = new Date(S, x, v);
+          if (!isNaN(y.getTime()) && y.getDate() === v && y.getMonth() === x && y.getFullYear() === S)
             return y;
         }
       }
     }
     const r = e.replace(/[\/\-\.]/g, ""), n = t.replace(/[\/\-\.]/g, "").toLowerCase();
-    let a = n.indexOf("d"), c = n.indexOf("m"), o = n.indexOf("y");
-    const l = [
+    let a = n.indexOf("d"), c = n.indexOf("m"), l = n.indexOf("y");
+    const o = [
       { char: "d", index: a },
       { char: "m", index: c },
-      { char: "y", index: o }
+      { char: "y", index: l }
     ].sort((_, m) => _.index - m.index);
     let d = 0, h = 0, u = 0, b = 0;
     n.length, r.length;
-    for (const _ of l)
+    for (const _ of o)
       if (_.char === "d") {
         const m = n.lastIndexOf("d") - n.indexOf("d") + 1, v = r.substr(b, m);
         if (v.length === 0) return null;
@@ -2510,10 +2513,10 @@ class ee extends HTMLElement {
         if (v.length === 0) return null;
         h = parseInt(v, 10) - 1, b += v.length;
       } else if (_.char === "y") {
-        const m = n.lastIndexOf("y") - n.indexOf("y") + 1, v = r.substr(b), E = Math.min(m, v.length), S = v.substr(0, E);
+        const m = n.lastIndexOf("y") - n.indexOf("y") + 1, v = r.substr(b), x = Math.min(m, v.length), S = v.substr(0, x);
         if (S.length === 0) return null;
         let y = parseInt(S, 10);
-        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;
+        x === 2 && m === 4 ? y = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + y : x === 2 && m === 2 && (y = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + y), u = y, b += x;
       }
     if (!d || h < 0 || h > 11 || !u) return null;
     const f = new Date(u, h, d);
@@ -2526,7 +2529,7 @@ class ee 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"], 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 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"], l = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], o = (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";
     };
@@ -2545,19 +2548,19 @@ class ee extends HTMLElement {
           h += r.toString().slice(-2);
           break;
         case "m":
-          h += l(s);
+          h += o(s);
           break;
         case "n":
           h += s.toString();
           break;
         case "M":
-          h += o[s - 1];
+          h += l[s - 1];
           break;
         case "F":
           h += c[s - 1];
           break;
         case "d":
-          h += l(i);
+          h += o(i);
           break;
         case "j":
           h += i.toString();
@@ -2583,7 +2586,7 @@ class ee extends HTMLElement {
     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(), c = this.getName(), o = this.getFormat(), l = this.hasError(), d = 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(), l = this.getFormat(), o = 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 h = this.querySelector(".mint-date-picker-label-container");
     if (e || t) {
@@ -2593,23 +2596,23 @@ class ee extends HTMLElement {
       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");
+    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", o ? "true" : "false");
     let u = this._input.querySelector(".mint-date-fields");
-    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", () => {
+    u || (u = document.createElement("div"), this._input.appendChild(u)), this._fieldsContainer = u, this._applyErrorVisuals(o, 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 b = this._getFormatTokens(o);
+    const b = this._getFormatTokens(l);
     this._startPartInputs = [], this._endPartInputs = [];
     const f = (m) => {
       const v = document.createDocumentFragment();
-      return b.forEach((E) => {
-        if (E.type === "sep") {
+      return b.forEach((x) => {
+        if (x.type === "sep") {
           const S = document.createElement("span");
-          S.textContent = E.value, S.className = "text-gray-400 dark:text-gray-500 select-none", v.appendChild(S);
+          S.textContent = x.value, S.className = "text-gray-400 dark:text-gray-500 select-none", v.appendChild(S);
         } else {
-          const S = E.part === "d" ? "dd" : E.part === "m" ? "mm" : E.len === 2 ? "yy" : "yyyy", y = this._createPartInput(E.len, S, s, r, n);
+          const S = x.part === "d" ? "dd" : x.part === "m" ? "mm" : x.len === 2 ? "yy" : "yyyy", y = this._createPartInput(x.len, S, s, r, n);
           m === "start" ? this._startPartInputs.push(y) : this._endPartInputs.push(y), v.appendChild(y);
         }
       }), v;
@@ -2632,7 +2635,7 @@ class ee extends HTMLElement {
         s || r || this._enterInputMode();
       }), this._input.prepend(this._iconButton), this._iconButton.disabled = s || r;
     }
-    this._renderErrorState(l, d);
+    this._renderErrorState(o, d);
   }
   _renderErrorState(e, t) {
     let i = this.querySelector(".mint-date-picker-error");
@@ -2680,7 +2683,7 @@ class ee 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, c] = r <= n ? [r, n] : [n, r], o = this._formatDate(a, t), l = this._formatDate(c, t), d = `${o} - ${l}`;
+        const [a, c] = r <= n ? [r, n] : [n, r], l = this._formatDate(a, t), o = this._formatDate(c, t), d = `${l} - ${o}`;
         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);
@@ -2782,14 +2785,14 @@ class ee extends HTMLElement {
     a.className = "flex flex-col md:flex-row md:gap-6 md:items-start";
     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 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 l = document.createElement("div");
+    l.className = "flex items-center justify-between mb-4";
+    const o = document.createElement("button");
+    o.type = "button", o.tabIndex = 0, o.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", o.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", () => {
+    d.setAttribute("name", "caret-left"), d.className = "w-4 h-4", o.appendChild(d), o.addEventListener("click", () => {
       this._currentMonth === 0 ? (this._currentMonth = 11, this._currentYear--) : this._currentMonth--, this._buildCalendar();
-    }), o.appendChild(l);
+    }), l.appendChild(o);
     const h = document.createElement("div");
     h.className = "flex items-center gap-2";
     const u = document.createElement("button");
@@ -2799,13 +2802,13 @@ class ee extends HTMLElement {
     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();
-    }), h.appendChild(b), o.appendChild(h);
+    }), h.appendChild(b), l.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", f.appendChild(_), f.addEventListener("click", () => {
       this._currentMonth === 11 ? (this._currentMonth = 0, this._currentYear++) : this._currentMonth++, this._buildCalendar();
-    }), o.appendChild(f);
+    }), l.appendChild(f);
     const m = document.createElement("div");
     m.className = "grid grid-cols-7 mb-2", s.forEach((y) => {
       const g = document.createElement("div");
@@ -2817,16 +2820,16 @@ class ee extends HTMLElement {
       const g = document.createElement("div");
       g.className = "w-8 h-8", v.appendChild(g);
     }
-    const E = this.getMin() ? this._parseDateString(this.getMin(), this.getFormat()) : null, S = this.getMax() ? this._parseDateString(this.getMax(), this.getFormat()) : null;
+    const x = 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 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;
+      const g = new Date(this._currentYear, this._currentMonth, y), p = this._isToday(g), k = this._isDateSelected(g), E = this._isDateInRange(g), I = x && g < x || S && g > S;
       let C = "rounded-md";
       if (this._isRange && this._selectedStartDate && this._selectedEndDate) {
         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");
+        L && M ? C = "rounded-md" : L ? C = "rounded-l-md" : M ? C = "rounded-r-md" : E && (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", () => {
+      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" : 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" : ""}`, w.textContent = y.toString(), I || w.addEventListener("click", () => {
         this._handleDateClick(g);
       }), v.appendChild(w);
     }
@@ -2863,8 +2866,8 @@ class ee 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 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 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", g.appendChild(E);
       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", g.appendChild(I);
       const C = document.createElement("div");
@@ -2874,10 +2877,10 @@ class ee extends HTMLElement {
       const L = () => {
         if (window.innerWidth >= 768) {
           const T = p.scrollTop, H = p.scrollHeight, D = p.clientHeight;
-          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";
+          T > 0 ? C.style.opacity = "1" : C.style.opacity = "0", T + D < H - 1 ? w.style.opacity = "1" : w.style.opacity = "0", E.style.opacity = "0", I.style.opacity = "0";
         } else {
           const T = p.scrollLeft, H = p.scrollWidth, D = p.clientWidth;
-          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";
+          T > 0 ? E.style.opacity = "1" : E.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) => {
@@ -2907,7 +2910,7 @@ class ee extends HTMLElement {
         }), p.appendChild(T);
       }), g.appendChild(p), y.appendChild(g), a.appendChild(y);
     }
-    c.appendChild(o), c.appendChild(m), c.appendChild(v), a.appendChild(c), this._calendarContainer.appendChild(a);
+    c.appendChild(l), c.appendChild(m), c.appendChild(v), a.appendChild(c), this._calendarContainer.appendChild(a);
   }
   _buildMonthView() {
     if (!this._calendarContainer) return;
@@ -2930,12 +2933,12 @@ class ee extends HTMLElement {
       this._currentYear++, this._buildCalendar();
     }), t.appendChild(n);
     const c = document.createElement("div");
-    c.className = "grid grid-cols-3 gap-2", e.forEach((o, l) => {
+    c.className = "grid grid-cols-3 gap-2", e.forEach((l, o) => {
       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();
+      const h = this._currentMonth === o;
+      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 = l, d.addEventListener("click", () => {
+        this._currentMonth = o, this._viewMode = "calendar", this._buildCalendar();
       }), c.appendChild(d);
     }), this._calendarContainer.appendChild(t), this._calendarContainer.appendChild(c);
   }
@@ -2957,17 +2960,17 @@ class ee extends HTMLElement {
     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 l = e; l <= t; l++) {
+    const l = document.createElement("div");
+    l.className = "grid grid-cols-3 gap-2";
+    for (let o = e; o <= t; o++) {
       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);
+      const h = this._currentYear === o;
+      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(o), d.addEventListener("click", () => {
+        this._currentYear = o, this._viewMode = "calendar", this._buildCalendar();
+      }), l.appendChild(d);
     }
-    this._calendarContainer.appendChild(i), this._calendarContainer.appendChild(o);
+    this._calendarContainer.appendChild(i), this._calendarContainer.appendChild(l);
   }
   _getDaysInMonth(e, t) {
     return new Date(t, e + 1, 0).getDate();
@@ -3193,14 +3196,14 @@ class te extends HTMLElement {
     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(), c = this.isDisabled(), o = this.isMultiple(), l = this.hasError();
+    const i = this.getLabel(), s = this.getInfo(), r = this.getId(), n = this.getName(), a = this.getValue(), c = this.isDisabled(), l = this.isMultiple(), o = this.hasError();
     if (i) {
       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);
       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), c && (this._select.disabled = !0), o && (this._select.multiple = !0), a && (this._select.value = a), this._select.setAttribute("aria-invalid", l ? "true" : "false");
+    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), l && (this._select.multiple = !0), a && (this._select.value = a), this._select.setAttribute("aria-invalid", o ? "true" : "false");
     const d = e.length > 0 ? e : t;
     if (d.length > 0 && d.forEach((h) => {
       this._select.appendChild(h);
@@ -3216,7 +3219,7 @@ class te extends HTMLElement {
         cancelable: !0,
         composed: !0
       }));
-    }, this._select.addEventListener("change", this._changeHandler), this._wrapper.appendChild(this._select), o)
+    }, this._select.addEventListener("change", this._changeHandler), this._wrapper.appendChild(this._select), l)
       this._caretUpIcon = null, this._caretDownIcon = null;
     else {
       const h = document.createElement("div");
@@ -3288,10 +3291,10 @@ class ie 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(), c = this.hasError(), o = this.getErrorMessage();
+    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(), l = 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 o = this._dropzone.querySelector(".mint-dropzone-icon"), d = this._dropzone.querySelector(".mint-dropzone-label");
+    o && o.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");
@@ -3299,7 +3302,7 @@ class ie extends HTMLElement {
       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(c, o), this._renderPreviews();
+    this.setupEventListeners(), this._renderErrorState(c, l), this._renderPreviews();
   }
   _updateDragState() {
     this._dropzone && this._updateDragStateClass();
@@ -3342,8 +3345,8 @@ class ie extends HTMLElement {
       if (i && i.length > 0) {
         const s = this.getAccept(), r = this.isMultiple(), n = [], a = [];
         for (let c = 0; c < i.length; c++) {
-          const o = i[c];
-          this._isFileAccepted(o, s) ? n.push(o) : a.push(o);
+          const l = i[c];
+          this._isFileAccepted(l, s) ? n.push(l) : a.push(l);
         }
         if (!r && n.length > 1 && (a.push(...n.slice(1)), n.splice(1)), a.length > 0) {
           const c = new CustomEvent("dropRejected", {
@@ -3441,24 +3444,24 @@ class ie 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, l) => {
+    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((l, o) => {
       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/")) {
+      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", l.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);
+        const _ = URL.createObjectURL(l);
         this._previewUrls.push(_), f.src = _, d.appendChild(f);
       } else {
         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 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);
+      h.className = "flex-1 text-sm text-gray-800 dark:text-gray-100 truncate", h.textContent = l.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 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);
+        f.preventDefault(), f.stopPropagation(), this._removeFileAt(o);
       }), d.appendChild(u), t.appendChild(d);
     });
     const i = this.hasError(), s = this._isDragging;
@@ -3469,8 +3472,8 @@ class ie extends HTMLElement {
     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 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";
+      const l = t.scrollTop, o = t.scrollHeight, d = t.clientHeight;
+      l > 0 ? n.style.opacity = "1" : n.style.opacity = "0", l + d < o - 1 ? a.style.opacity = "1" : a.style.opacity = "0";
     };
     c(), t.addEventListener("scroll", c), e.appendChild(t), this._previewContainer = e, this._dropzone.appendChild(e), this._updateDragStateClass();
   }
@@ -3580,43 +3583,43 @@ class se 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((l) => l instanceof File);
+    const n = Array.from(e.values()).some((o) => o instanceof File);
     let a = null;
     const c = {};
-    let o = i;
+    let l = i;
     if (s === "GET") {
-      const l = new URLSearchParams();
+      const o = new URLSearchParams();
       e.forEach((d, h) => {
-        d instanceof File || l.append(h, String(d));
-      }), o += (i.includes("?") ? "&" : "?") + l.toString();
+        d instanceof File || o.append(h, String(d));
+      }), l += (i.includes("?") ? "&" : "?") + o.toString();
     } else if (r === "multipart/form-data" || n)
       a = e;
     else if (r === "application/json")
       a = JSON.stringify(t), c["Content-Type"] = "application/json";
     else {
-      const l = new URLSearchParams();
+      const o = new URLSearchParams();
       e.forEach((d, h) => {
-        d instanceof File || l.append(h, String(d));
-      }), a = l, c["Content-Type"] = "application/x-www-form-urlencoded";
+        d instanceof File || o.append(h, String(d));
+      }), a = o, c["Content-Type"] = "application/x-www-form-urlencoded";
     }
     if (typeof fetch == "function") {
-      const l = await fetch(o, {
+      const o = await fetch(l, {
         method: s,
         body: s === "GET" ? null : a,
         headers: c
-      }), d = await l.text().catch(() => "");
+      }), d = await o.text().catch(() => "");
       let h = d;
       try {
         h = JSON.parse(d);
       } catch {
       }
-      if (!l.ok)
-        throw { status: l.status, data: h };
-      return { status: l.status, ok: l.ok, data: h };
+      if (!o.ok)
+        throw { status: o.status, data: h };
+      return { status: o.status, ok: o.ok, data: h };
     }
-    return await new Promise((l, d) => {
+    return await new Promise((o, d) => {
       const h = new XMLHttpRequest();
-      h.open(s, o, !0), Object.entries(c).forEach(([u, b]) => h.setRequestHeader(u, b)), h.onload = function() {
+      h.open(s, l, !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 f = b;
@@ -3624,7 +3627,7 @@ class se extends HTMLElement {
             f = JSON.parse(b);
           } catch {
           }
-          l({ status: u, ok: !0, data: f });
+          o({ status: u, ok: !0, data: f });
         } else
           d({ status: u, data: b });
       }, h.onerror = function() {
@@ -3644,7 +3647,7 @@ class se extends HTMLElement {
           const a = Array.from(n);
           t[r] && Array.isArray(t[r]) ? a.forEach((c) => {
             t[r].some(
-              (l) => l.name === c.name && l.size === c.size && l.lastModified === c.lastModified
+              (o) => o.name === c.name && o.size === c.size && o.lastModified === c.lastModified
             ) || t[r].push(c);
           }) : t[r] = a;
         }
@@ -3673,8 +3676,8 @@ class se 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), c = this._extractFieldValue(a), o = this._validateRules(c, n);
-      o ? (i = !1, this._errors[s] = o, this._flagFieldError(a, o)) : this._clearFieldError(a);
+      const n = Array.isArray(r) ? r : [r], a = this._getFieldElements(s), c = this._extractFieldValue(a), l = this._validateRules(c, n);
+      l ? (i = !1, this._errors[s] = l, this._flagFieldError(a, l)) : this._clearFieldError(a);
     }), i;
   }
   _validateField(e) {
@@ -3837,8 +3840,8 @@ class se extends HTMLElement {
       if (!r) return;
       const n = this._getFieldName(r);
       if (!n || !this._collectValidationRules()[n]) return;
-      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(() => {
+      const c = this._extractFieldValue([r]), l = c != null && (typeof c == "string" ? c.trim() !== "" : c instanceof FileList || Array.isArray(c) ? c.length > 0 : !0), o = r.hasAttribute("data-mint-form-error") || s instanceof HTMLElement && (s.hasAttribute("aria-invalid") || s.closest("[data-mint-form-error]"));
+      (l || o) && setTimeout(() => {
         this._validateField(n);
       }, 0);
     };
@@ -3847,12 +3850,12 @@ class se extends HTMLElement {
       const s = i.target;
       if (!s) return;
       if (s instanceof HTMLSelectElement || s.tagName === "MINT-SELECT" || s.closest("mint-select")) {
-        const o = this._findFieldElement(s);
-        if (!o) return;
-        const l = this._getFieldName(o);
-        if (!l || !this._collectValidationRules()[l]) return;
+        const l = this._findFieldElement(s);
+        if (!l) return;
+        const o = this._getFieldName(l);
+        if (!o || !this._collectValidationRules()[o]) return;
         setTimeout(() => {
-          this._validateField(l);
+          this._validateField(o);
         }, 0);
         return;
       }
@@ -3938,32 +3941,32 @@ class re extends HTMLElement {
     const t = this.hasAttribute("bordered"), i = this.hasAttribute("striped"), s = this.hasAttribute("hover"), r = this.hasAttribute("compact");
     e.style.width = "100%", e.style.borderCollapse = "collapse", e.style.fontSize = "0.875rem", e.style.fontWeight = "500";
     const n = e.querySelector("thead");
-    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";
+    n && (n.style.backgroundColor = "rgb(249 250 251)", document.documentElement.classList.contains("dark") && (n.style.backgroundColor = "rgb(31 41 55)"), n.querySelectorAll("th").forEach((o) => {
+      o.style.textAlign = "left", o.style.fontWeight = "600", o.style.color = "rgb(17 24 39)", document.documentElement.classList.contains("dark") && (o.style.color = "rgb(255 255 255)"), o.style.textTransform = "uppercase", o.style.letterSpacing = "0.05em", o.style.fontSize = "0.75rem", t && (o.style.border = "1px solid rgb(229 231 235)", document.documentElement.classList.contains("dark") && (o.style.borderColor = "rgb(55 65 81)")), r ? o.style.padding = "0.375rem 0.75rem" : o.style.padding = "0.75rem 1rem";
     }));
     const a = e.querySelector("tbody");
-    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));
+    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((o, d) => {
+      if (t && (o.style.borderBottomWidth = "1px", o.style.borderBottomStyle = "solid", o.style.borderBottomColor = "rgb(229 231 235)", document.documentElement.classList.contains("dark") && (o.style.borderBottomColor = "rgb(55 65 81)")), i ? d % 2 === 0 ? (o.style.backgroundColor = "rgb(255 255 255)", document.documentElement.classList.contains("dark") && (o.style.backgroundColor = "rgb(17 24 39)")) : (o.style.backgroundColor = "rgb(249 250 251)", document.documentElement.classList.contains("dark") && (o.style.backgroundColor = "rgb(31 41 55)")) : (o.style.backgroundColor = "rgb(255 255 255)", document.documentElement.classList.contains("dark") && (o.style.backgroundColor = "rgb(17 24 39)")), s) {
+        o.style.transition = "background-color 150ms";
+        const u = this._hoverHandlers.get(o);
+        u && (o.removeEventListener("mouseenter", u.enter), o.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)");
+          o.style.backgroundColor = "rgb(243 244 246)", document.documentElement.classList.contains("dark") && (o.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)"));
+          i ? d % 2 === 0 ? (o.style.backgroundColor = "rgb(255 255 255)", document.documentElement.classList.contains("dark") && (o.style.backgroundColor = "rgb(17 24 39)")) : (o.style.backgroundColor = "rgb(249 250 251)", document.documentElement.classList.contains("dark") && (o.style.backgroundColor = "rgb(31 41 55)")) : (o.style.backgroundColor = "rgb(255 255 255)", document.documentElement.classList.contains("dark") && (o.style.backgroundColor = "rgb(17 24 39)"));
         };
-        this._hoverHandlers.set(l, { enter: b, leave: f }), l.addEventListener("mouseenter", b), l.addEventListener("mouseleave", f);
+        this._hoverHandlers.set(o, { enter: b, leave: f }), o.addEventListener("mouseenter", b), o.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));
+        const u = this._hoverHandlers.get(o);
+        u && (o.removeEventListener("mouseenter", u.enter), o.removeEventListener("mouseleave", u.leave), this._hoverHandlers.delete(o));
       }
-      l.querySelectorAll("td").forEach((u) => {
+      o.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 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";
+    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((o) => {
+      o.style.color = "rgb(17 24 39)", document.documentElement.classList.contains("dark") && (o.style.color = "rgb(243 244 246)"), t && (o.style.border = "1px solid rgb(229 231 235)", document.documentElement.classList.contains("dark") && (o.style.borderColor = "rgb(55 65 81)")), r ? o.style.padding = "0.375rem 0.75rem" : o.style.padding = "0.75rem 1rem";
     }));
   }
 }