monobill-mintui 0.3.62 → 0.3.63

package/dist/index.js

@@ -148,10 +148,10 @@ class nt extends HTMLElement {
     }
     const i = this.closest("mint-button") || ((o = this.parentElement) == null ? void 0 : o.closest("mint-button")), s = this.closest("mint-switch") || ((c = this.parentElement) == null ? void 0 : c.closest("mint-switch")), n = this.closest("mint-select") || ((h = this.parentElement) == null ? void 0 : h.closest("mint-select"));
     if (!Array.from(this.classList).some(
-      (p) => p.startsWith("w-") || p.startsWith("h-")
+      (f) => f.startsWith("w-") || f.startsWith("h-")
     ) && !n) {
-      let p;
-      s ? p = "w-3 h-3" : i ? p = "w-5 h-5" : p = "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"), p.split(" ").forEach((d) => {
+      let f;
+      s ? f = "w-3 h-3" : i ? f = "w-5 h-5" : f = "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"), f.split(" ").forEach((d) => {
         d && this.classList.add(d);
       });
     }
@@ -729,7 +729,7 @@ const J = class J extends HTMLElement {
     return this.isFullWidth() && l.push("w-full"), l.join(" ");
   }
   render() {
-    var h, p, d, u, f, _;
+    var h, f, d, p, u, _;
     const t = this.isDisabled() || this.isLoading(), e = this.getType();
     if (!this._button) {
       for (this._button = document.createElement("button"); this.firstChild; )
@@ -759,11 +759,11 @@ const J = class J extends HTMLElement {
     if (l) {
       const g = r && r.tagName === "MINT-ICON";
       if (r && !r.parentElement) {
-        const m = (u = this._button.querySelector("mint-spinner")) == null ? void 0 : u.parentElement;
+        const m = (p = this._button.querySelector("mint-spinner")) == null ? void 0 : p.parentElement;
         g || a === "left" ? m ? m.insertAdjacentElement("afterend", r) : this._button.insertBefore(r, l) : l.insertAdjacentElement("afterend", r);
       } else if (r && (g || a === "left") && r.nextSibling !== l) {
         r.remove();
-        const m = (f = this._button.querySelector("mint-spinner")) == null ? void 0 : f.parentElement;
+        const m = (u = this._button.querySelector("mint-spinner")) == null ? void 0 : u.parentElement;
         m ? m.insertAdjacentElement("afterend", r) : this._button.insertBefore(r, l);
       } else r && !g && a === "right" && r.previousSibling !== l && (r.remove(), l.insertAdjacentElement("afterend", r));
     } else {
@@ -780,7 +780,7 @@ const J = class J extends HTMLElement {
         l = document.createElement("span"), l.className = "mint-button-content inline-flex items-center", g.forEach((v) => {
           l.appendChild(v);
         });
-        const m = (p = this._button.querySelector("mint-spinner")) == null ? void 0 : p.parentElement;
+        const m = (f = this._button.querySelector("mint-spinner")) == null ? void 0 : f.parentElement;
         r && a === "left" ? m ? (m.insertAdjacentElement("afterend", r), r.insertAdjacentElement("afterend", l)) : (this._button.insertBefore(r, this._button.firstChild), r.insertAdjacentElement("afterend", l)) : r && a === "right" ? m ? (m.insertAdjacentElement("afterend", l), l.insertAdjacentElement("afterend", r)) : (this._button.insertBefore(l, this._button.firstChild), l.insertAdjacentElement("afterend", r)) : m ? m.insertAdjacentElement("afterend", l) : this._button.insertBefore(l, this._button.firstChild);
       } else if (r && r.tagName === "MINT-ICON" && !r.parentElement) {
         const m = (d = this._button.querySelector("mint-spinner")) == null ? void 0 : d.parentElement;
@@ -984,11 +984,11 @@ class at extends HTMLElement {
     if (r) {
       let d = h;
       d || (d = document.createElement("span"), d.className = this.getIconClasses(), c.appendChild(d));
-      let u = d.querySelector("mint-icon");
-      u || (u = document.createElement("mint-icon"), d.appendChild(u)), u.setAttribute("name", r);
+      let p = d.querySelector("mint-icon");
+      p || (p = document.createElement("mint-icon"), d.appendChild(p)), p.setAttribute("name", r);
     } else h && h.remove();
-    let p = this.querySelector(".mint-switch-info");
-    n ? (p || (p = document.createElement("span"), p.className = "mint-switch-info text-xs text-gray-500 dark:text-gray-400 select-none mt-1 block", l && l.parentElement === this ? this.insertBefore(p, l.nextSibling) : this.appendChild(p)), p.textContent = n, this.isDisabled() ? p.classList.add("opacity-40") : p.classList.remove("opacity-40")) : p && p.remove(), this._renderErrorState(), this._renderSkeleton(t);
+    let f = this.querySelector(".mint-switch-info");
+    n ? (f || (f = document.createElement("span"), f.className = "mint-switch-info text-xs text-gray-500 dark:text-gray-400 select-none mt-1 block", l && l.parentElement === this ? this.insertBefore(f, l.nextSibling) : this.appendChild(f)), f.textContent = n, this.isDisabled() ? f.classList.add("opacity-40") : f.classList.remove("opacity-40")) : f && f.remove(), this._renderErrorState(), this._renderSkeleton(t);
   }
   setupEventListeners() {
     this._button && this._button.addEventListener("click", this.handleToggle.bind(this));
@@ -2069,28 +2069,28 @@ class _t extends HTMLElement {
     const o = this.getValue();
     o ? this._checkbox.value = o : this._checkbox.removeAttribute("value"), e ? this._checkbox.setAttribute("aria-label", e) : this._checkbox.removeAttribute("aria-label"), r.className = `mint-checkbox-wrapper ${this.getCheckboxClasses()}`, r.style.cursor = "pointer", r.style.pointerEvents = "auto", this._checkbox.style.pointerEvents = "auto";
     const c = r;
-    c._wrapperClickHandler || (c._wrapperClickHandler = (u) => {
-      u.target === r && !s && (u.preventDefault(), u.stopPropagation(), this.toggle());
+    c._wrapperClickHandler || (c._wrapperClickHandler = (p) => {
+      p.target === r && !s && (p.preventDefault(), p.stopPropagation(), this.toggle());
     }, r.addEventListener("click", c._wrapperClickHandler));
     let h = r.querySelector("mint-icon");
     h || (h = document.createElement("mint-icon"), h.setAttribute("name", "check"), h.className = "w-3.5 h-3.5 text-white pointer-events-none absolute inset-0 m-auto", h.style.transition = "opacity 200ms ease-out, transform 200ms ease-out", h.style.zIndex = "1", r.appendChild(h)), this.updateVisualState();
-    let p = this.querySelector(".mint-checkbox-label-container");
+    let f = this.querySelector(".mint-checkbox-label-container");
     const d = this.querySelector(".mint-checkbox-container");
     if (e || i) {
-      p ? d && p.parentElement !== d && d.appendChild(p) : (p = document.createElement("div"), p.className = "mint-checkbox-label-container flex flex-col gap-0.5 flex-1", d ? d.appendChild(p) : this.appendChild(p));
-      let u = p.querySelector(".mint-checkbox-label");
-      e ? (u || (u = document.createElement("span"), u.className = "mint-checkbox-label text-sm font-medium text-gray-900 dark:text-gray-100 cursor-pointer select-none", p.insertBefore(u, p.firstChild)), u.textContent = e, s ? u.classList.add("opacity-40") : u.classList.remove("opacity-40")) : u && u.remove();
-      let f = p.querySelector(".mint-checkbox-info");
-      if (i ? (f || (f = document.createElement("span"), f.className = "mint-checkbox-info text-xs text-gray-500 dark:text-gray-400 cursor-pointer select-none", p.appendChild(f)), f.textContent = i, s ? f.classList.add("opacity-40") : f.classList.remove("opacity-40")) : f && f.remove(), s)
-        p.style.cursor = "default", p._clickHandler && (p.removeEventListener("click", p._clickHandler), p._clickHandler = null);
+      f ? d && f.parentElement !== d && d.appendChild(f) : (f = document.createElement("div"), f.className = "mint-checkbox-label-container flex flex-col gap-0.5 flex-1", d ? d.appendChild(f) : this.appendChild(f));
+      let p = f.querySelector(".mint-checkbox-label");
+      e ? (p || (p = document.createElement("span"), p.className = "mint-checkbox-label text-sm font-medium text-gray-900 dark:text-gray-100 cursor-pointer select-none", f.insertBefore(p, f.firstChild)), p.textContent = e, s ? p.classList.add("opacity-40") : p.classList.remove("opacity-40")) : p && p.remove();
+      let u = f.querySelector(".mint-checkbox-info");
+      if (i ? (u || (u = document.createElement("span"), u.className = "mint-checkbox-info text-xs text-gray-500 dark:text-gray-400 cursor-pointer select-none", f.appendChild(u)), u.textContent = i, s ? u.classList.add("opacity-40") : u.classList.remove("opacity-40")) : u && u.remove(), s)
+        f.style.cursor = "default", f._clickHandler && (f.removeEventListener("click", f._clickHandler), f._clickHandler = null);
       else {
-        p.style.cursor = "pointer";
-        const _ = p._clickHandler;
-        _ && p.removeEventListener("click", _), p._clickHandler = (g) => {
+        f.style.cursor = "pointer";
+        const _ = f._clickHandler;
+        _ && f.removeEventListener("click", _), f._clickHandler = (g) => {
           this._checkbox && (g.target === this._checkbox || this._checkbox.contains(g.target) || g.composedPath().includes(this._checkbox)) || this.toggle();
-        }, p.addEventListener("click", p._clickHandler);
+        }, f.addEventListener("click", f._clickHandler);
       }
-    } else p && p.remove();
+    } else f && f.remove();
     this._renderErrorState(), this._renderSkeleton(t);
   }
   setupEventListeners() {
@@ -2267,12 +2267,12 @@ class mt extends HTMLElement {
     }, this.addEventListener("click", this._clickHandler));
   }
   render() {
-    var f;
+    var u;
     const t = this.isLoading(), e = this.isDisabled(), i = this.getValue(), s = this.closest("mint-choice"), n = (s == null ? void 0 : s.getAttribute("name")) || "";
     let r = "";
     const a = this.querySelector(".mint-choice-option-label");
     if (a)
-      r = ((f = a.textContent) == null ? void 0 : f.trim()) || "";
+      r = ((u = a.textContent) == null ? void 0 : u.trim()) || "";
     else {
       const _ = this.querySelector(".mint-choice-option-label-container");
       Array.from(this.childNodes).forEach((g) => {
@@ -2328,20 +2328,20 @@ class mt extends HTMLElement {
     this._radio.name = n, this._radio.value = i, this._radio.checked !== this._checked ? (this._checked = this._radio.checked, this._checked ? this.setAttribute("checked", "true") : this.setAttribute("checked", "false")) : this._radio.checked = this._checked, this._radio.disabled = e, e ? this._radio.setAttribute("tabindex", "-1") : this._radio.removeAttribute("tabindex"), r ? this._radio.setAttribute("aria-label", r) : this._radio.removeAttribute("aria-label"), o.querySelectorAll(".mint-choice-option-indicator").forEach((_, g) => {
       g > 0 && _.remove();
     });
-    let p = o.querySelector(".mint-choice-option-indicator");
-    p || (p = document.createElement("div"), p.className = "mint-choice-option-indicator", o.appendChild(p)), p.className = "mint-choice-option-indicator w-2 h-2 rounded-full bg-white transition-all duration-200 pointer-events-none", p.style.position = "absolute", p.style.top = "50%", p.style.left = "50%", p.style.transform = this._checked ? "translate(-50%, -50%) scale(1)" : "translate(-50%, -50%) scale(0)", p.style.opacity = this._checked ? "1" : "0", this._updateVisualState(), this._renderSkeleton(t);
+    let f = o.querySelector(".mint-choice-option-indicator");
+    f || (f = document.createElement("div"), f.className = "mint-choice-option-indicator", o.appendChild(f)), f.className = "mint-choice-option-indicator w-2 h-2 rounded-full bg-white transition-all duration-200 pointer-events-none", f.style.position = "absolute", f.style.top = "50%", f.style.left = "50%", f.style.transform = this._checked ? "translate(-50%, -50%) scale(1)" : "translate(-50%, -50%) scale(0)", f.style.opacity = this._checked ? "1" : "0", this._updateVisualState(), this._renderSkeleton(t);
     const d = this.getInfo();
-    let u = this.querySelector(".mint-choice-option-label-container");
+    let p = this.querySelector(".mint-choice-option-label-container");
     if (r || d) {
-      u || (u = document.createElement("div"), u.className = "mint-choice-option-label-container flex flex-col gap-0.5", this.appendChild(u), Array.from(this.childNodes).forEach((m) => {
+      p || (p = document.createElement("div"), p.className = "mint-choice-option-label-container flex flex-col gap-0.5", this.appendChild(p), Array.from(this.childNodes).forEach((m) => {
         var v;
-        m.nodeType === Node.TEXT_NODE && ((v = m.textContent) != null && v.trim()) && m !== u && (m.textContent = "");
+        m.nodeType === Node.TEXT_NODE && ((v = m.textContent) != null && v.trim()) && m !== p && (m.textContent = "");
       }));
-      let _ = u.querySelector(".mint-choice-option-label");
-      r ? (_ || (_ = document.createElement("span"), _.className = "mint-choice-option-label", u.appendChild(_)), _.className = `mint-choice-option-label text-sm text-gray-900 dark:text-gray-100 ${e ? "opacity-40" : ""}`, _.textContent = r) : _ && _.remove();
-      let g = u.querySelector(".mint-choice-option-info");
-      d ? (g || (g = document.createElement("span"), g.className = "mint-choice-option-info text-xs text-gray-500 dark:text-gray-400 select-none", u.appendChild(g)), g.textContent = d, e ? g.classList.add("opacity-40") : g.classList.remove("opacity-40")) : g && g.remove();
-    } else u && u.remove();
+      let _ = p.querySelector(".mint-choice-option-label");
+      r ? (_ || (_ = document.createElement("span"), _.className = "mint-choice-option-label", p.appendChild(_)), _.className = `mint-choice-option-label text-sm text-gray-900 dark:text-gray-100 ${e ? "opacity-40" : ""}`, _.textContent = r) : _ && _.remove();
+      let g = p.querySelector(".mint-choice-option-info");
+      d ? (g || (g = document.createElement("span"), g.className = "mint-choice-option-info text-xs text-gray-500 dark:text-gray-400 select-none", p.appendChild(g)), g.textContent = d, e ? g.classList.add("opacity-40") : g.classList.remove("opacity-40")) : g && g.remove();
+    } else p && p.remove();
     e ? (this.classList.add("cursor-not-allowed"), this.classList.remove("cursor-pointer")) : (this.classList.add("cursor-pointer"), this.classList.remove("cursor-not-allowed")), this._updateVisualState();
   }
   _getWrapperClasses() {
@@ -2761,54 +2761,54 @@ class vt extends HTMLElement {
     return this.getAttribute("loading") === "true";
   }
   render() {
-    var v, b, k, w;
+    var v, b, y, C;
     this.getType();
-    const t = this._getNormalizedType(), e = this._isTextarea(), i = this._isMoney(), s = this._isColor(), n = this.getPlaceholder(), r = this.isDisabled(), a = this.isReadonly(), l = this.isRequired(), o = this.getId(), c = this.getName(), h = this.getAttribute("value") || (s ? "#000000" : ""), p = this.getRows(), d = this.getIcon(), u = this.getLabel(), f = this.getInfo(), _ = this.isLoading();
+    const t = this._getNormalizedType(), e = this._isTextarea(), i = this._isMoney(), s = this._isColor(), n = this.getPlaceholder(), r = this.isDisabled(), a = this.isReadonly(), l = this.isRequired(), o = this.getId(), c = this.getName(), h = this.getAttribute("value") || (s ? "#000000" : ""), f = this.getRows(), d = this.getIcon(), p = this.getLabel(), u = this.getInfo(), _ = this.isLoading();
     if (this._renderSkeleton(_), 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 = h || "#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 = (y) => {
+      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 = h || "#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 = (x) => {
         this._colorPickerWrapper && this._colorPicker && this._colorPicker.matches(":focus-visible") && requestAnimationFrame(() => {
-          var C;
-          this._colorPicker && this._colorPicker.matches(":focus-visible") && ((C = this._colorPickerWrapper) == null || C.classList.add("ring-2", "ring-offset-1", "ring-gray-400", "dark:ring-gray-500"));
+          var S;
+          this._colorPicker && this._colorPicker.matches(":focus-visible") && ((S = this._colorPickerWrapper) == null || S.classList.add("ring-2", "ring-offset-1", "ring-gray-400", "dark:ring-gray-500"));
         });
       }, this._blurHandler = () => {
         this._colorPickerWrapper && this._colorPickerWrapper.classList.remove("ring-2", "ring-offset-1", "ring-gray-400", "dark:ring-gray-500");
       }, this._colorPicker.addEventListener("focus", this._focusHandler), this._colorPicker.addEventListener("blur", this._blurHandler), this._colorPicker.addEventListener("input", () => {
-        var C;
-        const y = ((C = this._colorPicker) == null ? void 0 : C.value) || "#000000";
-        this._colorPickerWrapper && (this._colorPickerWrapper.style.backgroundColor = y), this._colorTextInput && (this._colorTextInput.value = y), this.setAttribute("value", y), this.dispatchEvent(new CustomEvent("input", {
-          detail: { value: y },
+        var S;
+        const x = ((S = this._colorPicker) == null ? void 0 : S.value) || "#000000";
+        this._colorPickerWrapper && (this._colorPickerWrapper.style.backgroundColor = x), this._colorTextInput && (this._colorTextInput.value = x), this.setAttribute("value", x), this.dispatchEvent(new CustomEvent("input", {
+          detail: { value: x },
           bubbles: !0,
           cancelable: !0
         }));
       }), this._colorPicker.addEventListener("change", () => {
-        var C;
-        const y = ((C = this._colorPicker) == null ? void 0 : C.value) || "#000000";
-        this._colorPickerWrapper && (this._colorPickerWrapper.style.backgroundColor = y), this.setAttribute("value", y), this.dispatchEvent(new CustomEvent("change", {
-          detail: { value: y },
+        var S;
+        const x = ((S = this._colorPicker) == null ? void 0 : S.value) || "#000000";
+        this._colorPickerWrapper && (this._colorPickerWrapper.style.backgroundColor = x), this.setAttribute("value", x), this.dispatchEvent(new CustomEvent("change", {
+          detail: { value: x },
           bubbles: !0,
           cancelable: !0
         }));
       })), this._colorTextInput || (this._colorTextInput = document.createElement("input"), this._colorTextInput.type = "text", this._colorTextInput.className = this.getInputClasses(), this._colorTextInput.placeholder = n || "#000000", this._colorTextInput.pattern = "^#[0-9A-Fa-f]{6}$", this._wrapper.appendChild(this._colorTextInput), this._colorTextInput.addEventListener("input", () => {
-        var C;
-        const y = ((C = this._colorTextInput) == null ? void 0 : C.value) || "";
-        /^#[0-9A-Fa-f]{6}$/.test(y) && (this._colorPicker && (this._colorPicker.value = y), this.setAttribute("value", y), this.dispatchEvent(new CustomEvent("input", {
-          detail: { value: y },
+        var S;
+        const x = ((S = this._colorTextInput) == null ? void 0 : S.value) || "";
+        /^#[0-9A-Fa-f]{6}$/.test(x) && (this._colorPicker && (this._colorPicker.value = x), this.setAttribute("value", x), this.dispatchEvent(new CustomEvent("input", {
+          detail: { value: x },
           bubbles: !0,
           cancelable: !0
         })));
       }), this._colorTextInput.addEventListener("blur", () => {
-        var C, D;
-        const y = ((C = this._colorTextInput) == null ? void 0 : C.value) || "";
-        /^#[0-9A-Fa-f]{6}$/.test(y) ? (this._colorPicker && (this._colorPicker.value = y), this.setAttribute("value", y)) : this._colorPicker && this._colorTextInput && (this._colorTextInput.value = this._colorPicker.value), this.dispatchEvent(new CustomEvent("change", {
-          detail: { value: ((D = this._colorPicker) == null ? void 0 : D.value) || "#000000" },
+        var S, w;
+        const x = ((S = this._colorTextInput) == null ? void 0 : S.value) || "";
+        /^#[0-9A-Fa-f]{6}$/.test(x) ? (this._colorPicker && (this._colorPicker.value = x), this.setAttribute("value", x)) : this._colorPicker && this._colorTextInput && (this._colorTextInput.value = this._colorPicker.value), this.dispatchEvent(new CustomEvent("change", {
+          detail: { value: ((w = this._colorPicker) == null ? void 0 : w.value) || "#000000" },
           bubbles: !0,
           cancelable: !0
         }));
       }));
       const E = h || "#000000";
       if (this._colorPicker && this._colorPicker.value !== E && (this._colorPicker.value = E), this._colorPickerWrapper && (this._colorPickerWrapper.style.backgroundColor = E), this._colorTextInput && this._colorTextInput.value !== E && (this._colorTextInput.value = E), this._colorPicker && (this._colorPicker.disabled = r), this._colorPickerWrapper && (r ? (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 = r, this._colorTextInput.readOnly = a, this._colorTextInput.required = l), this._colorTextInput) {
-        const y = this._colorTextInput;
-        o ? y.id = o : y.removeAttribute("id"), c ? y.name = c : y.removeAttribute("name"), y.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), this._element = y;
+        const x = this._colorTextInput;
+        o ? x.id = o : x.removeAttribute("id"), c ? x.name = c : x.removeAttribute("name"), x.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), this._element = x;
       }
       this._renderErrorState();
       return;
@@ -2818,25 +2818,25 @@ class vt extends HTMLElement {
         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 E = document.createElement("mint-icon");
         E.setAttribute("name", "caret-up"), E.className = "w-[1rem] h-[1rem]", this._numberIncrementButton.appendChild(E), 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 y = document.createElement("mint-icon");
-        y.setAttribute("name", "caret-down"), y.className = "w-[1rem] h-[1rem]", this._numberDecrementButton.appendChild(y), this._numberSpinnerContainer.appendChild(this._numberDecrementButton), this._numberIncrementButton.addEventListener("click", (C) => {
-          if (C.preventDefault(), C.stopPropagation(), this._input && !this._input.disabled && !this._input.readOnly) {
-            const D = parseFloat(this._input.value) || 0, $ = parseFloat(this._input.step) || 1, A = this._input.min ? parseFloat(this._input.min) : void 0, N = this._input.max ? parseFloat(this._input.max) : void 0;
-            let S = D + $;
-            N !== void 0 && S > N && (S = N), A !== void 0 && S < A && (S = A), this._input.value = S.toString(), this.setAttribute("value", S.toString()), this._input.dispatchEvent(new Event("input", { bubbles: !0 })), this._input.dispatchEvent(new Event("change", { bubbles: !0 }));
+        const x = document.createElement("mint-icon");
+        x.setAttribute("name", "caret-down"), x.className = "w-[1rem] h-[1rem]", this._numberDecrementButton.appendChild(x), this._numberSpinnerContainer.appendChild(this._numberDecrementButton), this._numberIncrementButton.addEventListener("click", (S) => {
+          if (S.preventDefault(), S.stopPropagation(), this._input && !this._input.disabled && !this._input.readOnly) {
+            const w = parseFloat(this._input.value) || 0, $ = parseFloat(this._input.step) || 1, D = this._input.min ? parseFloat(this._input.min) : void 0, T = this._input.max ? parseFloat(this._input.max) : void 0;
+            let A = w + $;
+            T !== void 0 && A > T && (A = T), D !== void 0 && A < D && (A = D), this._input.value = A.toString(), this.setAttribute("value", A.toString()), this._input.dispatchEvent(new Event("input", { bubbles: !0 })), this._input.dispatchEvent(new Event("change", { bubbles: !0 }));
           }
-        }), this._numberDecrementButton.addEventListener("click", (C) => {
-          if (C.preventDefault(), C.stopPropagation(), this._input && !this._input.disabled && !this._input.readOnly) {
-            const D = parseFloat(this._input.value) || 0, $ = parseFloat(this._input.step) || 1, A = this._input.min ? parseFloat(this._input.min) : void 0, N = this._input.max ? parseFloat(this._input.max) : void 0;
-            let S = D - $;
-            A !== void 0 && S < A && (S = A), N !== void 0 && S > N && (S = N), this._input.value = S.toString(), this.setAttribute("value", S.toString()), this._input.dispatchEvent(new Event("input", { bubbles: !0 })), this._input.dispatchEvent(new Event("change", { bubbles: !0 }));
+        }), this._numberDecrementButton.addEventListener("click", (S) => {
+          if (S.preventDefault(), S.stopPropagation(), this._input && !this._input.disabled && !this._input.readOnly) {
+            const w = parseFloat(this._input.value) || 0, $ = parseFloat(this._input.step) || 1, D = this._input.min ? parseFloat(this._input.min) : void 0, T = this._input.max ? parseFloat(this._input.max) : void 0;
+            let A = w - $;
+            D !== void 0 && A < D && (A = D), T !== void 0 && A > T && (A = T), this._input.value = A.toString(), this.setAttribute("value", A.toString()), this._input.dispatchEvent(new Event("input", { bubbles: !0 })), this._input.dispatchEvent(new Event("change", { bubbles: !0 }));
           }
         });
       }
       this._numberIncrementButton && (this._numberIncrementButton.disabled = r || a), this._numberDecrementButton && (this._numberDecrementButton.disabled = r || a);
     } else this._numberSpinnerContainer && (this._numberSpinnerContainer.remove(), this._numberSpinnerContainer = null, this._numberIncrementButton = null, this._numberDecrementButton = null);
     if (e) {
-      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 = n, this._textarea.disabled = r, this._textarea.readOnly = a, this._textarea.required = l, this._textarea.rows = p, this._textarea.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), h !== this._textarea.value && (this._textarea.value = h), o ? this._textarea.id = o : this._textarea.removeAttribute("id"), c ? this._textarea.name = c : 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 = n, this._textarea.disabled = r, this._textarea.readOnly = a, this._textarea.required = l, this._textarea.rows = f, this._textarea.setAttribute("aria-invalid", this.hasError() ? "true" : "false"), h !== this._textarea.value && (this._textarea.value = h), o ? this._textarea.id = o : this._textarea.removeAttribute("id"), c ? this._textarea.name = c : this._textarea.removeAttribute("name"), this._textarea.className = this.getInputClasses(), this.firstChild && this.firstChild !== this._wrapper && this.firstChild.nodeType === Node.TEXT_NODE) {
         const E = this.firstChild.textContent;
         E && !this._textarea.value && (this._textarea.value = E.trim()), this.removeChild(this.firstChild);
       }
@@ -2845,22 +2845,22 @@ class vt extends HTMLElement {
       E && !this._input.value && (this._input.value = E.trim()), this.removeChild(this.firstChild);
     }
     let m = this.querySelector(".mint-input-label-container");
-    if (u || f) {
+    if (p || u) {
       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 E = m.querySelector(".mint-input-label");
-      if (u) {
-        E || (E = document.createElement("label"), E.className = "mint-input-label text-sm font-medium text-gray-900 dark:text-gray-100 select-none", m.insertBefore(E, m.firstChild)), E.textContent = u;
-        const C = o || ((v = this._element) == null ? void 0 : v.id) || ((b = this._colorTextInput) == null ? void 0 : b.id) || ((k = this._input) == null ? void 0 : k.id) || ((w = this._textarea) == null ? void 0 : w.id);
-        if (C)
-          E.setAttribute("for", C);
+      if (p) {
+        E || (E = document.createElement("label"), E.className = "mint-input-label text-sm font-medium text-gray-900 dark:text-gray-100 select-none", m.insertBefore(E, m.firstChild)), E.textContent = p;
+        const S = o || ((v = this._element) == null ? void 0 : v.id) || ((b = this._colorTextInput) == null ? void 0 : b.id) || ((y = this._input) == null ? void 0 : y.id) || ((C = this._textarea) == null ? void 0 : C.id);
+        if (S)
+          E.setAttribute("for", S);
         else {
-          const D = `mint-input-${Math.random().toString(36).substr(2, 9)}`;
-          this._element ? this._element.id = D : this._colorTextInput ? this._colorTextInput.id = D : this._input ? this._input.id = D : this._textarea && (this._textarea.id = D), E.setAttribute("for", D);
+          const w = `mint-input-${Math.random().toString(36).substr(2, 9)}`;
+          this._element ? this._element.id = w : this._colorTextInput ? this._colorTextInput.id = w : this._input ? this._input.id = w : this._textarea && (this._textarea.id = w), E.setAttribute("for", w);
         }
         r ? E.classList.add("opacity-40") : E.classList.remove("opacity-40");
       } else E && E.remove();
-      let y = m.querySelector(".mint-input-info");
-      f ? (y || (y = document.createElement("span"), y.className = "mint-input-info text-xs text-gray-500 dark:text-gray-400 select-none", m.appendChild(y)), y.textContent = f, r ? y.classList.add("opacity-40") : y.classList.remove("opacity-40")) : y && y.remove();
+      let x = m.querySelector(".mint-input-info");
+      u ? (x || (x = document.createElement("span"), x.className = "mint-input-info text-xs text-gray-500 dark:text-gray-400 select-none", m.appendChild(x)), x.textContent = u, r ? x.classList.add("opacity-40") : x.classList.remove("opacity-40")) : x && x.remove();
     } else m && m.remove();
     this._renderErrorState(), this._renderSkeleton(_);
   }
@@ -3231,13 +3231,13 @@ class yt extends HTMLElement {
         const l = a.relatedTarget, o = l && (this._startPartInputs.includes(l) || this._endPartInputs.includes(l));
         setTimeout(() => {
           var h;
-          if (!(this._startPartInputs.some((p) => p === document.activeElement) || this._endPartInputs.some((p) => p === document.activeElement)) && (o || this._handleBlur(((h = this._hiddenInput) == null ? void 0 : h.value) || ""), this._exitInputMode(), !o && this._hiddenInput)) {
-            const p = new FocusEvent("blur", {
+          if (!(this._startPartInputs.some((f) => f === document.activeElement) || this._endPartInputs.some((f) => f === document.activeElement)) && (o || this._handleBlur(((h = this._hiddenInput) == null ? void 0 : h.value) || ""), this._exitInputMode(), !o && this._hiddenInput)) {
+            const f = new FocusEvent("blur", {
               bubbles: !0,
               cancelable: !0,
               relatedTarget: a.relatedTarget
             });
-            this._hiddenInput.dispatchEvent(p);
+            this._hiddenInput.dispatchEvent(f);
           }
         }, 0);
       });
@@ -3265,26 +3265,26 @@ class yt extends HTMLElement {
   _parseDateString(t, e) {
     const i = /[\/\-\.\s]+/;
     if (i.test(t)) {
-      const v = t.split(i).filter((k) => k.length > 0), b = e.split(/[\/\-\.\s]+/).filter((k) => k.length > 0);
+      const v = t.split(i).filter((y) => y.length > 0), b = e.split(/[\/\-\.\s]+/).filter((y) => y.length > 0);
       if (v.length === b.length) {
-        let k = 0, w = 0, E = 0;
-        for (let D = 0; D < b.length; D++) {
-          const $ = b[D].toLowerCase(), A = v[D];
+        let y = 0, C = 0, E = 0;
+        for (let w = 0; w < b.length; w++) {
+          const $ = b[w].toLowerCase(), D = v[w];
           if ($.includes("d"))
-            k = parseInt(A, 10);
+            y = parseInt(D, 10);
           else if ($.includes("m"))
-            w = parseInt(A, 10) - 1;
+            C = parseInt(D, 10) - 1;
           else if ($.includes("y")) {
-            let N = parseInt(A, 10);
-            const S = $.length, M = A.length;
-            M === 2 && S === 4 ? N = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + N : M === 2 && S === 2 && (N = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + N), E = N;
+            let T = parseInt(D, 10);
+            const A = $.length, H = D.length;
+            H === 2 && A === 4 ? T = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + T : H === 2 && A === 2 && (T = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + T), E = T;
           }
         }
-        const y = b.some((D) => D.toLowerCase().includes("d")), C = b.some((D) => D.toLowerCase().includes("m"));
-        if (y || (k = 1), C || (w = 0), w >= 0 && w <= 11 && E) {
-          const D = new Date(E, w, k);
-          if (!isNaN(D.getTime()))
-            return y && D.getDate() !== k || D.getMonth() !== w || D.getFullYear() !== E ? null : D;
+        const x = b.some((w) => w.toLowerCase().includes("d")), S = b.some((w) => w.toLowerCase().includes("m"));
+        if (x || (y = 1), S || (C = 0), C >= 0 && C <= 11 && E) {
+          const w = new Date(E, C, y);
+          if (!isNaN(w.getTime()))
+            return x && w.getDate() !== y || w.getMonth() !== C || w.getFullYear() !== E ? null : w;
         }
       }
     }
@@ -3295,27 +3295,27 @@ class yt extends HTMLElement {
       { char: "m", index: l },
       { char: "y", index: o }
     ].sort((v, b) => v.index - b.index);
-    let h = 0, p = 0, d = 0, u = 0;
+    let h = 0, f = 0, d = 0, p = 0;
     r.length, n.length;
     for (const v of c)
       if (v.char === "d") {
-        const b = r.lastIndexOf("d") - r.indexOf("d") + 1, k = n.substr(u, b);
-        if (k.length === 0) return null;
-        h = parseInt(k, 10), u += k.length;
+        const b = r.lastIndexOf("d") - r.indexOf("d") + 1, y = n.substr(p, b);
+        if (y.length === 0) return null;
+        h = parseInt(y, 10), p += y.length;
       } else if (v.char === "m") {
-        const b = r.lastIndexOf("m") - r.indexOf("m") + 1, k = n.substr(u, b);
-        if (k.length === 0) return null;
-        p = parseInt(k, 10) - 1, u += k.length;
+        const b = r.lastIndexOf("m") - r.indexOf("m") + 1, y = n.substr(p, b);
+        if (y.length === 0) return null;
+        f = parseInt(y, 10) - 1, p += y.length;
       } else if (v.char === "y") {
-        const b = r.lastIndexOf("y") - r.indexOf("y") + 1, k = n.substr(u), w = Math.min(b, k.length), E = k.substr(0, w);
+        const b = r.lastIndexOf("y") - r.indexOf("y") + 1, y = n.substr(p), C = Math.min(b, y.length), E = y.substr(0, C);
         if (E.length === 0) return null;
-        let y = parseInt(E, 10);
-        w === 2 && b === 4 ? y = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + y : w === 2 && b === 2 && (y = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + y), d = y, u += w;
+        let x = parseInt(E, 10);
+        C === 2 && b === 4 ? x = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + x : C === 2 && b === 2 && (x = Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 100) * 100 + x), d = x, p += C;
       }
-    const f = e.toLowerCase(), _ = f.includes("d"), g = f.includes("m");
-    if (_ || (h = 1), g || (p = 0), p < 0 || p > 11 || !d) return null;
-    const m = new Date(d, p, h);
-    return isNaN(m.getTime()) || _ && m.getDate() !== h || m.getMonth() !== p || m.getFullYear() !== d ? null : m;
+    const u = e.toLowerCase(), _ = u.includes("d"), g = u.includes("m");
+    if (_ || (h = 1), g || (f = 0), f < 0 || f > 11 || !d) return null;
+    const m = new Date(d, f, h);
+    return isNaN(m.getTime()) || _ && m.getDate() !== h || m.getMonth() !== f || m.getFullYear() !== d ? null : m;
   }
   _formatDate(t, e) {
     const i = t.getDate(), s = t.getMonth() + 1, n = t.getFullYear(), r = e.toLowerCase();
@@ -3324,76 +3324,76 @@ class yt extends HTMLElement {
   }
   // PHP-style formatter for display mode
   _formatDatePhp(t, e) {
-    const i = t.getDate(), s = t.getMonth() + 1, n = t.getFullYear(), r = ["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"], c = (d, u = 2) => d.toString().padStart(u, "0"), h = (d) => {
-      const u = d % 10, f = d % 100;
-      return u === 1 && f !== 11 ? "st" : u === 2 && f !== 12 ? "nd" : u === 3 && f !== 13 ? "rd" : "th";
+    const i = t.getDate(), s = t.getMonth() + 1, n = t.getFullYear(), r = ["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"], c = (d, p = 2) => d.toString().padStart(p, "0"), h = (d) => {
+      const p = d % 10, u = d % 100;
+      return p === 1 && u !== 11 ? "st" : p === 2 && u !== 12 ? "nd" : p === 3 && u !== 13 ? "rd" : "th";
     };
-    let p = "";
+    let f = "";
     for (let d = 0; d < e.length; d++) {
-      const u = e[d];
-      if (u === "\\" && d + 1 < e.length) {
-        p += e[d + 1], d++;
+      const p = e[d];
+      if (p === "\\" && d + 1 < e.length) {
+        f += e[d + 1], d++;
         continue;
       }
-      switch (u) {
+      switch (p) {
         case "Y":
-          p += n.toString();
+          f += n.toString();
           break;
         case "y":
-          p += n.toString().slice(-2);
+          f += n.toString().slice(-2);
           break;
         case "m":
-          p += c(s);
+          f += c(s);
           break;
         case "n":
-          p += s.toString();
+          f += s.toString();
           break;
         case "M":
-          p += o[s - 1];
+          f += o[s - 1];
           break;
         case "F":
-          p += l[s - 1];
+          f += l[s - 1];
           break;
         case "d":
-          p += c(i);
+          f += c(i);
           break;
         case "j":
-          p += i.toString();
+          f += i.toString();
           break;
         case "D":
-          p += a[t.getDay()];
+          f += a[t.getDay()];
           break;
         case "l":
-          p += r[t.getDay()];
+          f += r[t.getDay()];
           break;
         case "S":
-          p += h(i);
+          f += h(i);
           break;
         default:
-          p += u;
+          f += p;
           break;
       }
     }
-    return p;
+    return f;
   }
   _validateDateString(t, e) {
     const i = this._parseDateString(t, e);
     return i !== null && !isNaN(i.getTime());
   }
   render() {
-    const t = this.isLoading(), e = this.getLabel(), i = this.getInfo(), s = this.getValue(), n = this.isDisabled(), r = this.isReadonly(), a = this.isRequired(), l = this.getId(), o = this.getName(), c = this.getFormat(), h = this.hasError(), p = this.getErrorMessage(), d = this.getSelectionMode();
+    const t = this.isLoading(), e = this.getLabel(), i = this.getInfo(), s = this.getValue(), n = this.isDisabled(), r = this.isReadonly(), a = this.isRequired(), l = this.getId(), o = this.getName(), c = this.getFormat(), h = this.hasError(), f = this.getErrorMessage(), d = this.getSelectionMode();
     this._isRange = this.isRange() || d === "week" || d === "month", this._input || (this._input = document.createElement("div"), this._input.className = "relative w-full", this.appendChild(this._input));
-    let u = this.querySelector(".mint-date-picker-label-container");
+    let p = this.querySelector(".mint-date-picker-label-container");
     if (e || i) {
-      u || (u = document.createElement("div"), u.className = "mint-date-picker-label-container flex flex-col gap-0.5 mb-[.25rem]", this.contains(this._input) ? this.insertBefore(u, this._input) : this.appendChild(u));
-      let b = u.querySelector(".mint-date-picker-label");
-      e ? (b || (b = document.createElement("label"), b.className = "mint-date-picker-label text-sm font-medium text-gray-900 dark:text-gray-100 select-none", u.insertBefore(b, u.firstChild)), b.textContent = e, l && this._textInput && b.setAttribute("for", l)) : b && b.remove();
-      let k = u.querySelector(".mint-date-picker-info");
-      i ? (k || (k = document.createElement("span"), k.className = "mint-date-picker-info text-xs text-gray-500 dark:text-gray-400 select-none", u.appendChild(k)), k.textContent = i) : k && k.remove();
-    } else u && u.remove();
+      p || (p = document.createElement("div"), p.className = "mint-date-picker-label-container flex flex-col gap-0.5 mb-[.25rem]", this.contains(this._input) ? this.insertBefore(p, this._input) : this.appendChild(p));
+      let b = p.querySelector(".mint-date-picker-label");
+      e ? (b || (b = document.createElement("label"), b.className = "mint-date-picker-label text-sm font-medium text-gray-900 dark:text-gray-100 select-none", p.insertBefore(b, p.firstChild)), b.textContent = e, l && this._textInput && b.setAttribute("for", l)) : b && b.remove();
+      let y = p.querySelector(".mint-date-picker-info");
+      i ? (y || (y = document.createElement("span"), y.className = "mint-date-picker-info text-xs text-gray-500 dark:text-gray-400 select-none", p.appendChild(y)), y.textContent = i) : y && y.remove();
+    } else p && p.remove();
     this._hiddenInput || (this._hiddenInput = document.createElement("input"), this._hiddenInput.type = "hidden", this._hiddenInput.value = s || "", this._textInput = this._hiddenInput, this._input.appendChild(this._hiddenInput)), l && (this._hiddenInput.id = l), o && (this._hiddenInput.name = o), this._hiddenInput.value = s || "", this._hiddenInput.setAttribute("aria-invalid", h ? "true" : "false");
-    let f = this._input.querySelector(".mint-date-fields");
-    f || (f = document.createElement("div"), this._input.appendChild(f)), this._fieldsContainer = f, this._applyErrorVisuals(h, p, n), f.innerHTML = "", this._displayEl = document.createElement("div");
+    let u = this._input.querySelector(".mint-date-fields");
+    u || (u = document.createElement("div"), this._input.appendChild(u)), this._fieldsContainer = u, this._applyErrorVisuals(h, f, n), u.innerHTML = "", this._displayEl = document.createElement("div");
     const _ = r ? "select-text" : "select-none";
     this._displayEl.className = `flex-1 text-gray-900 dark:text-white ${r ? "cursor-default" : "cursor-text"} ${_} focus:outline-none`, this._displayEl.tabIndex = n || r ? -1 : 0, this._displayEl.addEventListener("click", () => {
       n || r || this._enterInputMode();
@@ -3403,41 +3403,41 @@ class yt extends HTMLElement {
     const g = this._getFormatTokens(c);
     this._startPartInputs = [], this._endPartInputs = [];
     const m = (b) => {
-      const k = document.createDocumentFragment();
-      return g.forEach((w) => {
-        if (w.type === "sep") {
+      const y = document.createDocumentFragment();
+      return g.forEach((C) => {
+        if (C.type === "sep") {
           const E = document.createElement("span");
-          E.textContent = w.value, E.className = "text-gray-400 dark:text-gray-500 select-none", k.appendChild(E);
+          E.textContent = C.value, E.className = "text-gray-400 dark:text-gray-500 select-none", y.appendChild(E);
         } else {
-          const E = w.part === "d" ? "dd" : w.part === "m" ? "mm" : w.len === 2 ? "yy" : "yyyy", y = this._createPartInput(w.len, E, n, r, a);
-          b === "start" ? this._startPartInputs.push(y) : this._endPartInputs.push(y), k.appendChild(y);
+          const E = C.part === "d" ? "dd" : C.part === "m" ? "mm" : C.len === 2 ? "yy" : "yyyy", x = this._createPartInput(C.len, E, n, r, a);
+          b === "start" ? this._startPartInputs.push(x) : this._endPartInputs.push(x), y.appendChild(x);
         }
-      }), k;
+      }), y;
     };
     if (this._isRange) {
       const b = document.createElement("div");
       b.className = "flex items-center gap-1 flex-shrink-0", b.appendChild(m("start")), this._inputsWrapperEl.appendChild(b);
-      const k = document.createElement("span");
-      k.textContent = " - ", k.className = "text-gray-400 dark:text-gray-500 select-none flex-shrink-0", this._inputsWrapperEl.appendChild(k);
-      const w = document.createElement("div");
-      w.className = "flex items-center gap-1 flex-shrink-0", w.appendChild(m("end")), this._inputsWrapperEl.appendChild(w);
+      const y = document.createElement("span");
+      y.textContent = " - ", y.className = "text-gray-400 dark:text-gray-500 select-none flex-shrink-0", this._inputsWrapperEl.appendChild(y);
+      const C = document.createElement("div");
+      C.className = "flex items-center gap-1 flex-shrink-0", C.appendChild(m("end")), this._inputsWrapperEl.appendChild(C);
     } else
       this._inputsWrapperEl.appendChild(m("start"));
     const v = document.createElement("div");
-    if (v.className = "flex flex-col w-full", this._displayEl.style.display = this._isInputMode ? "none" : "flex", this._inputsWrapperEl.style.display = this._isInputMode ? "flex" : "none", v.appendChild(this._displayEl), v.appendChild(this._inputsWrapperEl), f.appendChild(v), this._isRange && this._inputsWrapperEl && this._setupContainerObserver(), f.addEventListener("click", () => {
+    if (v.className = "flex flex-col w-full", this._displayEl.style.display = this._isInputMode ? "none" : "flex", this._inputsWrapperEl.style.display = this._isInputMode ? "flex" : "none", v.appendChild(this._displayEl), v.appendChild(this._inputsWrapperEl), u.appendChild(v), this._isRange && this._inputsWrapperEl && this._setupContainerObserver(), u.addEventListener("click", () => {
       this._isInputMode || n || r || this._enterInputMode();
-    }), this._attachPartInputHandlers(this._startPartInputs, g, f), this._isRange && this._attachPartInputHandlers(this._endPartInputs, g, f), this._parseValue(s), this._syncHiddenInput(), this._updateDisplayText(), this._iconButton)
+    }), this._attachPartInputHandlers(this._startPartInputs, g, u), this._isRange && this._attachPartInputHandlers(this._endPartInputs, g, u), this._parseValue(s), this._syncHiddenInput(), this._updateDisplayText(), this._iconButton)
       this._iconButton.disabled = n || r, !n && !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-[.55rem] 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";
       const b = `date-icon-${Math.random().toString(36).substr(2, 9)}`;
       this._iconButton.id = b;
-      const k = document.createElement("mint-icon");
-      k.setAttribute("name", "calendar"), k.className = "w-4 h-4 pointer-events-none", this._iconButton.appendChild(k), this._iconButton.addEventListener("click", () => {
+      const y = document.createElement("mint-icon");
+      y.setAttribute("name", "calendar"), y.className = "w-4 h-4 pointer-events-none", this._iconButton.appendChild(y), this._iconButton.addEventListener("click", () => {
         n || r || this._enterInputMode();
       }), this._input.prepend(this._iconButton), this._iconButton.disabled = n || r;
     }
-    this._renderErrorState(h, p), this._renderSkeleton(t);
+    this._renderErrorState(h, f), this._renderSkeleton(t);
   }
   _renderErrorState(t, e) {
     let i = this.querySelector(".mint-date-picker-error");
@@ -3485,7 +3485,7 @@ class yt extends HTMLElement {
     if (s) {
       const [n, r] = this._splitRangeInput(t, e), a = n ? this._parseDateString(n, e) : null, l = r ? this._parseDateString(r, e) : null;
       if (a && l) {
-        const [o, c] = a <= l ? [a, l] : [l, a], h = this._formatDate(o, e), p = this._formatDate(c, e), d = `${h} - ${p}`;
+        const [o, c] = a <= l ? [a, l] : [l, a], h = this._formatDate(o, e), f = this._formatDate(c, e), d = `${h} - ${f}`;
         this.setValue(d), this._applyDateToParts(o, this._startPartInputs, this._getFormatTokens(e), e), this._applyDateToParts(c, this._endPartInputs, this._getFormatTokens(e), e), this._selectedStartDate = o, this._selectedEndDate = c, this._currentMonth = o.getMonth(), this._currentYear = o.getFullYear();
       } else if (a) {
         const o = this._formatDate(a, e);
@@ -3601,82 +3601,82 @@ class yt extends HTMLElement {
     c.className = "flex-1 min-w-0";
     const h = document.createElement("div");
     h.className = "flex items-center justify-between mb-4";
-    const p = document.createElement("button");
-    p.type = "button", p.tabIndex = 0, p.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", p.setAttribute("data-keep-popover-open", "true");
-    const d = document.createElement("mint-icon");
-    d.setAttribute("name", "caret-left"), d.className = "w-4 h-4", p.appendChild(d), p.addEventListener("click", () => {
-      const x = this._currentMonth, L = this._currentYear;
-      this._currentMonth === 0 ? (this._currentMonth = 11, this._currentYear--) : this._currentMonth--, this._buildCalendar(), this._dispatchMonthChangeEvent(x, L, this._currentMonth, this._currentYear);
-    }), h.appendChild(p);
-    const u = document.createElement("div");
-    u.className = "flex items-center gap-2";
     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 = i[this._currentMonth], f.addEventListener("click", () => {
-      const x = this.getMode();
-      x !== "month" && x !== "year" && (this._viewMode = "month", this._buildCalendar());
-    }), u.appendChild(f);
+    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 d = document.createElement("mint-icon");
+    d.setAttribute("name", "caret-left"), d.className = "w-4 h-4", f.appendChild(d), f.addEventListener("click", () => {
+      const k = this._currentMonth, L = this._currentYear;
+      this._currentMonth === 0 ? (this._currentMonth = 11, this._currentYear--) : this._currentMonth--, this._buildCalendar(), this._dispatchMonthChangeEvent(k, L, this._currentMonth, this._currentYear);
+    }), h.appendChild(f);
+    const p = document.createElement("div");
+    p.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", () => {
+      const k = this.getMode();
+      k !== "month" && k !== "year" && (this._viewMode = "month", this._buildCalendar());
+    }), p.appendChild(u);
     const _ = document.createElement("button");
     _.type = "button", _.tabIndex = 0, _.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", _.setAttribute("data-keep-popover-open", "true"), _.textContent = String(this._currentYear), _.addEventListener("click", () => {
       this.getMode() !== "year" && (this._viewMode = "year", this._buildCalendar());
-    }), u.appendChild(_), h.appendChild(u);
+    }), p.appendChild(_), h.appendChild(p);
     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");
     const m = document.createElement("mint-icon");
     m.setAttribute("name", "caret-right"), m.className = "w-4 h-4", g.appendChild(m), g.addEventListener("click", () => {
-      const x = this._currentMonth, L = this._currentYear;
-      this._currentMonth === 11 ? (this._currentMonth = 0, this._currentYear++) : this._currentMonth++, this._buildCalendar(), this._dispatchMonthChangeEvent(x, L, this._currentMonth, this._currentYear);
+      const k = this._currentMonth, L = this._currentYear;
+      this._currentMonth === 11 ? (this._currentMonth = 0, this._currentYear++) : this._currentMonth++, this._buildCalendar(), this._dispatchMonthChangeEvent(k, L, this._currentMonth, this._currentYear);
     }), h.appendChild(g);
     const v = document.createElement("div");
-    v.className = "grid grid-cols-7 mb-2", r.forEach((x) => {
+    v.className = "grid grid-cols-7 mb-2", r.forEach((k) => {
       const L = document.createElement("div");
-      L.className = "text-xs font-medium text-gray-500 dark:text-gray-400 text-center py-1", L.textContent = x, v.appendChild(L);
+      L.className = "text-xs font-medium text-gray-500 dark:text-gray-400 text-center py-1", L.textContent = k, v.appendChild(L);
     });
     const b = document.createElement("div");
     b.className = "grid grid-cols-7";
-    const k = this.getMin() ? this._parseDateString(this.getMin(), this.getFormat()) : null, w = this.getMax() ? this._parseDateString(this.getMax(), this.getFormat()) : null;
+    const y = this.getMin() ? this._parseDateString(this.getMin(), this.getFormat()) : null, C = this.getMax() ? this._parseDateString(this.getMax(), this.getFormat()) : null;
     this.getDisabledDates();
-    const E = this._currentMonth === 0 ? 11 : this._currentMonth - 1, y = this._currentMonth === 0 ? this._currentYear - 1 : this._currentYear, C = this._getDaysInMonth(E, y), D = this._currentMonth === 11 ? 0 : this._currentMonth + 1, $ = this._currentMonth === 11 ? this._currentYear + 1 : this._currentYear, A = e + t, M = Math.ceil(A / 7) * 7 - A, I = (x, L, H) => {
-      const F = this._isToday(x), V = this._isDateSelected(x), P = this._isDateInRange(x), R = k && x < k || w && x > w || this._isDateDisabled(x);
+    const E = this._currentMonth === 0 ? 11 : this._currentMonth - 1, x = this._currentMonth === 0 ? this._currentYear - 1 : this._currentYear, S = this._getDaysInMonth(E, x), w = this._currentMonth === 11 ? 0 : this._currentMonth + 1, $ = this._currentMonth === 11 ? this._currentYear + 1 : this._currentYear, D = e + t, H = Math.ceil(D / 7) * 7 - D, N = (k, L, I) => {
+      const F = this._isToday(k), V = this._isDateSelected(k), P = this._isDateInRange(k), R = y && k < y || C && k > C || this._isDateDisabled(k);
       let q = "rounded-md";
-      const z = this._isRange && this._selectedStartDate && !this._selectedEndDate && this._hoveredDate, X = z && this._selectedStartDate && this._hoveredDate && this._selectedStartDate < this._hoveredDate ? this._selectedStartDate : z && this._hoveredDate ? this._hoveredDate : null, B = z && this._selectedStartDate && this._hoveredDate && this._selectedStartDate < this._hoveredDate ? this._hoveredDate : z && this._selectedStartDate ? this._selectedStartDate : null, O = X !== null && this._isSameDate(x, X), W = B !== null && this._isSameDate(x, B), j = this._hoveredDate !== null && this._isSameDate(x, this._hoveredDate), U = z && this._hoveredDate && this._selectedStartDate ? !this._rangeIncludesDisabledDates(
+      const z = this._isRange && this._selectedStartDate && !this._selectedEndDate && this._hoveredDate, X = z && this._selectedStartDate && this._hoveredDate && this._selectedStartDate < this._hoveredDate ? this._selectedStartDate : z && this._hoveredDate ? this._hoveredDate : null, B = z && this._selectedStartDate && this._hoveredDate && this._selectedStartDate < this._hoveredDate ? this._hoveredDate : z && this._selectedStartDate ? this._selectedStartDate : null, O = X !== null && this._isSameDate(k, X), W = B !== null && this._isSameDate(k, B), j = this._hoveredDate !== null && this._isSameDate(k, this._hoveredDate), U = z && this._hoveredDate && this._selectedStartDate ? !this._rangeIncludesDisabledDates(
         this._selectedStartDate < this._hoveredDate ? this._selectedStartDate : this._hoveredDate,
         this._selectedStartDate < this._hoveredDate ? this._hoveredDate : this._selectedStartDate
       ) : !1;
       if (this._isRange && this._selectedStartDate && this._selectedEndDate) {
-        const G = this._isSameDate(x, this._selectedStartDate), it = this._isSameDate(x, this._selectedEndDate);
+        const G = this._isSameDate(k, this._selectedStartDate), it = this._isSameDate(k, this._selectedEndDate);
         G && it ? q = "rounded-md" : G ? q = "rounded-l-md" : it ? q = "rounded-r-md" : P && (q = "rounded-none");
       } else z && (O || W) && U ? O && W ? q = "rounded-md" : O ? q = "rounded-l-md" : W && (q = "rounded-r-md") : V && !this._isRange || V && this._isRange && !this._selectedEndDate ? q = "rounded-md" : P && z && U && (q = "rounded-none");
       const Y = document.createElement("button");
       Y.type = "button", Y.disabled = !!R, Y.tabIndex = R ? -1 : 0;
       let Z = `w-full h-8 ${q} 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`;
       const et = V || z && j && U;
-      return H ? Z += et ? " bg-slate-800 dark:bg-slate-600 text-white" : P ? " bg-slate-100 dark:bg-slate-700 text-slate-800 dark:text-slate-200" : F ? " 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" : Z += et ? " bg-slate-800 dark:bg-slate-600 text-white" : P ? " bg-slate-100 dark:bg-slate-700 text-slate-800 dark:text-slate-200" : " text-gray-400 dark:text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-700", Z += R ? " opacity-40 cursor-not-allowed" : "", Y.className = Z, Y.textContent = L.toString(), R || (Y.addEventListener("click", (G) => {
-        G.preventDefault(), G.stopPropagation(), this._handleDateClick(x);
+      return I ? Z += et ? " bg-slate-800 dark:bg-slate-600 text-white" : P ? " bg-slate-100 dark:bg-slate-700 text-slate-800 dark:text-slate-200" : F ? " 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" : Z += et ? " bg-slate-800 dark:bg-slate-600 text-white" : P ? " bg-slate-100 dark:bg-slate-700 text-slate-800 dark:text-slate-200" : " text-gray-400 dark:text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-700", Z += R ? " opacity-40 cursor-not-allowed" : "", Y.className = Z, Y.textContent = L.toString(), R || (Y.addEventListener("click", (G) => {
+        G.preventDefault(), G.stopPropagation(), this._handleDateClick(k);
       }), this._isRange && this._selectedStartDate && !this._selectedEndDate && !R && Y.addEventListener("mouseenter", () => {
-        this._isHandlingClick || this._isDateDisabled(x) || (!this._hoveredDate || !this._isSameDate(this._hoveredDate, x)) && (this._hoveredDate = x, this._buildCalendar());
+        this._isHandlingClick || this._isDateDisabled(k) || (!this._hoveredDate || !this._isSameDate(this._hoveredDate, k)) && (this._hoveredDate = k, this._buildCalendar());
       })), Y;
     };
-    for (let x = e - 1; x >= 0; x--) {
-      const L = C - x, H = new Date(y, E, L), F = I(H, L, !1);
+    for (let k = e - 1; k >= 0; k--) {
+      const L = S - k, I = new Date(x, E, L), F = N(I, L, !1);
       b.appendChild(F);
     }
-    for (let x = 1; x <= t; x++) {
-      const L = new Date(this._currentYear, this._currentMonth, x), H = I(L, x, !0);
-      b.appendChild(H);
+    for (let k = 1; k <= t; k++) {
+      const L = new Date(this._currentYear, this._currentMonth, k), I = N(L, k, !0);
+      b.appendChild(I);
     }
-    for (let x = 1; x <= M; x++) {
-      const L = new Date($, D, x), H = I(L, x, !1);
-      b.appendChild(H);
+    for (let k = 1; k <= H; k++) {
+      const L = new Date($, w, k), I = N(L, k, !1);
+      b.appendChild(I);
     }
     if (this._isRange && this._selectedStartDate && !this._selectedEndDate && b.addEventListener("mouseleave", () => {
       this._hoveredDate = null, this._buildCalendar();
     }), l) {
-      const x = document.createElement("div");
-      x.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 k = document.createElement("div");
+      k.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 L = document.createElement("div");
       L.className = "relative md:relative md:flex-1 md:min-h-0";
-      const H = document.createElement("div");
-      H.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", H.style.scrollbarWidth = "none", H.style.msOverflowStyle = "none", H.style.setProperty("-webkit-overflow-scrolling", "touch");
+      const I = document.createElement("div");
+      I.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", I.style.scrollbarWidth = "none", I.style.msOverflowStyle = "none", I.style.setProperty("-webkit-overflow-scrolling", "touch");
       const F = document.createElement("style");
       F.textContent = `
         .mint-date-shortcuts-row::-webkit-scrollbar {
@@ -3702,7 +3702,7 @@ class yt extends HTMLElement {
             background: rgba(255, 255, 255, 0.2);
           }
         }
-      `, H.classList.add("mint-date-shortcuts-row"), document.head.querySelector("style[data-mint-date-shortcuts]") || (F.setAttribute("data-mint-date-shortcuts", "true"), document.head.appendChild(F));
+      `, I.classList.add("mint-date-shortcuts-row"), document.head.querySelector("style[data-mint-date-shortcuts]") || (F.setAttribute("data-mint-date-shortcuts", "true"), document.head.appendChild(F));
       const V = document.createElement("div");
       V.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", L.appendChild(V);
       const P = document.createElement("div");
@@ -3713,14 +3713,14 @@ class yt extends HTMLElement {
       q.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", L.appendChild(q);
       const z = () => {
         if (window.innerWidth >= 768) {
-          const B = H.scrollTop, O = H.scrollHeight, W = H.clientHeight;
+          const B = I.scrollTop, O = I.scrollHeight, W = I.clientHeight;
           B > 0 ? R.style.opacity = "1" : R.style.opacity = "0", B + W < O - 1 ? q.style.opacity = "1" : q.style.opacity = "0", V.style.opacity = "0", P.style.opacity = "0";
         } else {
-          const B = H.scrollLeft, O = H.scrollWidth, W = H.clientWidth;
+          const B = I.scrollLeft, O = I.scrollWidth, W = I.clientWidth;
           B > 0 ? V.style.opacity = "1" : V.style.opacity = "0", B + W < O - 1 ? P.style.opacity = "1" : P.style.opacity = "0", R.style.opacity = "0", q.style.opacity = "0";
         }
       };
-      H.addEventListener("scroll", z), window.addEventListener("resize", z), setTimeout(z, 0), a.forEach((X) => {
+      I.addEventListener("scroll", z), window.addEventListener("resize", z), setTimeout(z, 0), a.forEach((X) => {
         const B = document.createElement("button");
         B.type = "button", B.tabIndex = 0, B.className = "px-3 py-1.5 text-xs font-medium rounded-md bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-600 transition-colors whitespace-nowrap flex-shrink-0 md:w-full md:text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-gray-400 dark:focus-visible:ring-gray-500", B.textContent = X.label, B.setAttribute("data-keep-popover-open", "true"), B.addEventListener("click", () => {
           const O = X.action();
@@ -3744,8 +3744,8 @@ class yt extends HTMLElement {
               cancelable: !0
             }));
           }
-        }), H.appendChild(B);
-      }), L.appendChild(H), x.appendChild(L), o.appendChild(x);
+        }), I.appendChild(B);
+      }), L.appendChild(I), k.appendChild(L), o.appendChild(k);
     }
     c.appendChild(h), c.appendChild(v), c.appendChild(b), o.appendChild(c), this._calendarContainer.appendChild(o);
   }
@@ -3775,11 +3775,11 @@ class yt extends HTMLElement {
     l.className = "grid grid-cols-3 gap-2", t.forEach((o, c) => {
       const h = document.createElement("button");
       h.type = "button", h.tabIndex = 0, h.setAttribute("data-keep-popover-open", "true");
-      const p = this._currentMonth === c;
-      h.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 ${p ? "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"}`, h.textContent = o, h.addEventListener("click", () => {
+      const f = this._currentMonth === c;
+      h.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 ${f ? "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"}`, h.textContent = o, h.addEventListener("click", () => {
         if (this.getMode() === "month") {
-          const u = new Date(this._currentYear, c, 1), f = this.getFormat(), _ = this._formatDate(u, f);
-          this.setValue(_), this._selectedStartDate = u, this._selectedEndDate = null;
+          const p = new Date(this._currentYear, c, 1), u = this.getFormat(), _ = this._formatDate(p, u);
+          this.setValue(_), this._selectedStartDate = p, this._selectedEndDate = null;
           const g = this._currentMonth, m = this._currentYear;
           this._currentMonth = c, this._dispatchMonthChangeEvent(g, m, this._currentMonth, this._currentYear), this.dispatchEvent(new CustomEvent("input", {
             detail: { value: this.getValue() },
@@ -3791,8 +3791,8 @@ class yt extends HTMLElement {
             cancelable: !0
           })), this._dispatchDateChangeEvent(), this._popover && typeof this._popover.close == "function" && this._popover.close();
         } else {
-          const u = this._currentMonth, f = this._currentYear;
-          this._currentMonth = c, this._viewMode = "calendar", this._buildCalendar(), this._dispatchMonthChangeEvent(u, f, this._currentMonth, this._currentYear);
+          const p = this._currentMonth, u = this._currentYear;
+          this._currentMonth = c, this._viewMode = "calendar", this._buildCalendar(), this._dispatchMonthChangeEvent(p, u, this._currentMonth, this._currentYear);
         }
       }), l.appendChild(h);
     }), this._calendarContainer.appendChild(e), this._calendarContainer.appendChild(l);
@@ -3822,12 +3822,12 @@ class yt extends HTMLElement {
     for (let c = t; c <= e; c++) {
       const h = document.createElement("button");
       h.type = "button", h.tabIndex = 0, h.setAttribute("data-keep-popover-open", "true");
-      const p = this._currentYear === c;
-      h.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 ${p ? "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"}`, h.textContent = String(c), h.addEventListener("click", () => {
+      const f = this._currentYear === c;
+      h.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 ${f ? "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"}`, h.textContent = String(c), h.addEventListener("click", () => {
         const d = this.getMode();
         if (d === "year") {
-          const u = new Date(c, 0, 1), f = this.getFormat(), _ = this._formatDate(u, f);
-          this.setValue(_), this._selectedStartDate = u, this._selectedEndDate = null;
+          const p = new Date(c, 0, 1), u = this.getFormat(), _ = this._formatDate(p, u);
+          this.setValue(_), this._selectedStartDate = p, this._selectedEndDate = null;
           const g = this._currentMonth, m = this._currentYear;
           this._currentYear = c, this._currentMonth = 0, this._dispatchMonthChangeEvent(g, m, this._currentMonth, this._currentYear), this.dispatchEvent(new CustomEvent("input", {
             detail: { value: this.getValue() },
@@ -3839,11 +3839,11 @@ class yt extends HTMLElement {
             cancelable: !0
           })), this._dispatchDateChangeEvent(), this._popover && typeof this._popover.close == "function" && this._popover.close();
         } else if (d === "month") {
-          const u = this._currentMonth, f = this._currentYear;
-          this._currentYear = c, this._viewMode = "month", this._buildCalendar(), this._dispatchMonthChangeEvent(u, f, this._currentMonth, this._currentYear);
+          const p = this._currentMonth, u = this._currentYear;
+          this._currentYear = c, this._viewMode = "month", this._buildCalendar(), this._dispatchMonthChangeEvent(p, u, this._currentMonth, this._currentYear);
         } else {
-          const u = this._currentMonth, f = this._currentYear;
-          this._currentYear = c, this._viewMode = "calendar", this._buildCalendar(), this._dispatchMonthChangeEvent(u, f, this._currentMonth, this._currentYear);
+          const p = this._currentMonth, u = this._currentYear;
+          this._currentYear = c, this._viewMode = "calendar", this._buildCalendar(), this._dispatchMonthChangeEvent(p, u, this._currentMonth, this._currentYear);
         }
       }), o.appendChild(h);
     }
@@ -3981,8 +3981,8 @@ class yt extends HTMLElement {
             return;
           }
           o && l < o ? (this._selectedEndDate = o, this._selectedStartDate = l) : (this._selectedEndDate = l, o && (this._selectedStartDate = o)), this._currentMonth = this._selectedStartDate.getMonth(), this._currentYear = this._selectedStartDate.getFullYear();
-          const p = this._formatDate(this._selectedStartDate, e), d = this._formatDate(this._selectedEndDate, e), u = `${p} - ${d}`;
-          this.setAttribute("value", u), this._textInput && (this._textInput.value = u), this._hiddenInput && (this._hiddenInput.value = u), this._updateDisplayText(), this._buildCalendar(), this._popover && typeof this._popover.close == "function" && this._popover.close();
+          const f = this._formatDate(this._selectedStartDate, e), d = this._formatDate(this._selectedEndDate, e), p = `${f} - ${d}`;
+          this.setAttribute("value", p), this._textInput && (this._textInput.value = p), this._hiddenInput && (this._hiddenInput.value = p), this._updateDisplayText(), this._buildCalendar(), this._popover && typeof this._popover.close == "function" && this._popover.close();
         } else
           this._selectedStartDate = s, this._selectedEndDate = null;
       else {
@@ -4249,32 +4249,32 @@ class kt extends HTMLElement {
     if (s) {
       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 u = document.createTextNode(s);
-      d.appendChild(u), this.appendChild(d);
+      const p = document.createTextNode(s);
+      d.appendChild(p), this.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), a && (this._select.name = a), o && (this._select.disabled = !0), c && (this._select.multiple = !0), this._select.setAttribute("aria-invalid", h ? "true" : "false");
-    const p = i.length > 0 ? i : e;
-    if (p.length > 0 && p.forEach((d) => {
+    const f = i.length > 0 ? i : e;
+    if (f.length > 0 && f.forEach((d) => {
       this._select.appendChild(d);
     }), 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);
     }
     if (this._select.value = l || "", this._changeHandler && this._select && this._select.removeEventListener("change", this._changeHandler), this._changeHandler = (d) => {
-      const f = d.target.value;
-      (this.getAttribute("value") || "") !== f && (f ? this.setAttribute("value", f) : this.removeAttribute("value"));
+      const u = d.target.value;
+      (this.getAttribute("value") || "") !== u && (u ? this.setAttribute("value", u) : this.removeAttribute("value"));
       const g = new Event("input", {
         bubbles: !0,
         cancelable: !0,
         composed: !0
       });
       this.dispatchEvent(g), this.dispatchEvent(new CustomEvent("input", {
-        detail: { value: f },
+        detail: { value: u },
         bubbles: !0,
         cancelable: !0,
         composed: !0
       })), this.dispatchEvent(new CustomEvent("change", {
-        detail: { value: f },
+        detail: { value: u },
         bubbles: !0,
         cancelable: !0,
         composed: !0
@@ -4283,7 +4283,7 @@ class kt extends HTMLElement {
       const d = this.getAttribute("value") || this.value || "";
       this._select && d && requestAnimationFrame(() => {
         this._select && Array.from(this._select.options).some(
-          (f) => f.value === d
+          (u) => u.value === d
         ) && this._select.value !== d && (this._select.value = d);
       });
     }), this._optionObserver.observe(this._select, {
@@ -4424,14 +4424,14 @@ class xt extends HTMLElement {
   render() {
     const t = this.isLoading(), e = this.getLabel(), i = this.getAccept(), s = this.isMultiple(), n = this.isDisabled(), r = this.getWidth(), a = this.getHeight(), l = this.getName(), o = this.hasError(), c = this.getErrorMessage();
     this._dropzone || (this._dropzone = document.createElement("div"), this.appendChild(this._dropzone)), this._updateDragStateClass(), this._dropzone.setAttribute("aria-invalid", o ? "true" : "false"), n ? (this._dropzone.setAttribute("tabindex", "-1"), this._dropzone.removeAttribute("role")) : (this._dropzone.setAttribute("tabindex", "0"), this._dropzone.setAttribute("role", "button"), this._dropzone.setAttribute("aria-label", e || "File upload dropzone")), this._dropzone.style.width = r, this._dropzone.style.height = a, this._dropzone.style.minWidth = r, this._dropzone.style.minHeight = a, this._fileInput || (this._fileInput = document.createElement("input"), this._fileInput.type = "file", this._fileInput.style.display = "none", this._fileInput.setAttribute("tabindex", "-1"), this._fileInput.setAttribute("aria-hidden", "true"), this._dropzone.appendChild(this._fileInput)), this._fileInput.accept = i, this._fileInput.multiple = s, this._fileInput.disabled = n, l ? this._fileInput.name = l : this._fileInput.removeAttribute("name"), this._fileInput.setAttribute("aria-invalid", o ? "true" : "false");
-    const h = this._dropzone.querySelector(".mint-dropzone-icon"), p = this._dropzone.querySelector(".mint-dropzone-label");
-    h && h.remove(), p && p.remove();
+    const h = this._dropzone.querySelector(".mint-dropzone-icon"), f = this._dropzone.querySelector(".mint-dropzone-label");
+    h && h.remove(), f && f.remove();
     const d = document.createElement("div");
     d.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);
+    const p = document.createElement("mint-icon");
+    if (p.setAttribute("name", "upload"), p.className = "w-12 h-12 text-gray-400 dark:text-gray-500", d.appendChild(p), this._dropzone.appendChild(d), e) {
+      const u = document.createElement("div");
+      u.className = "mint-dropzone-label text-sm font-medium text-gray-600 dark:text-gray-400 text-center px-4 flex-shrink-0", u.textContent = e, this._dropzone.appendChild(u);
     }
     this.setupEventListeners(), this._renderErrorState(o, c), this._renderPreviews(), this._renderSkeleton(t);
   }
@@ -4589,21 +4589,21 @@ class xt extends HTMLElement {
     e.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, c) => {
       const h = document.createElement("div");
       if (h.className = "flex items-center gap-3 p-2 rounded border border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-900", 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 u = document.createElement("img");
+        u.className = "w-12 h-12 object-cover rounded border border-gray-200 dark:border-gray-700";
         const _ = URL.createObjectURL(o);
-        this._previewUrls.push(_), f.src = _, h.appendChild(f);
+        this._previewUrls.push(_), u.src = _, h.appendChild(u);
       } else {
-        const f = document.createElement("mint-icon");
-        f.setAttribute("name", "attach"), f.className = "w-5 h-5 text-gray-500 dark:text-gray-300", h.appendChild(f);
+        const u = document.createElement("mint-icon");
+        u.setAttribute("name", "attach"), u.className = "w-5 h-5 text-gray-500 dark:text-gray-300", h.appendChild(u);
       }
-      const p = document.createElement("div");
-      p.className = "flex-1 text-sm text-gray-800 dark:text-gray-100 truncate", p.textContent = o.name, h.appendChild(p);
+      const f = document.createElement("div");
+      f.className = "flex-1 text-sm text-gray-800 dark:text-gray-100 truncate", f.textContent = o.name, h.appendChild(f);
       const d = document.createElement("button");
       d.type = "button", d.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 u = document.createElement("mint-icon");
-      u.setAttribute("name", "close"), u.className = "w-4 h-4", d.appendChild(u), d.addEventListener("click", (f) => {
-        f.preventDefault(), f.stopPropagation(), this._removeFileAt(c);
+      const p = document.createElement("mint-icon");
+      p.setAttribute("name", "close"), p.className = "w-4 h-4", d.appendChild(p), d.addEventListener("click", (u) => {
+        u.preventDefault(), u.stopPropagation(), this._removeFileAt(c);
       }), h.appendChild(d), e.appendChild(h);
     });
     const i = this.hasError(), s = this._isDragging;
@@ -4801,59 +4801,59 @@ class Et extends HTMLElement {
     }
   }
   async _submitData(t, e) {
-    var h, p, d;
+    var h, f, d;
     const i = this.getAttribute("action"), s = this.getAttribute("method"), n = this.getAttribute("enctype") || "application/x-www-form-urlencoded";
     if (!i)
       return { status: 0, ok: !0, data: { values: e } };
-    const r = Array.from(t.values()).some((u) => u instanceof File);
+    const r = Array.from(t.values()).some((p) => p instanceof File);
     let a = null;
     const l = {};
     let o = i;
-    if (typeof window < "u" && ((d = (p = (h = window.mintForm) == null ? void 0 : h.defaults) == null ? void 0 : p.headers) != null && d.common) && Object.assign(l, window.mintForm.defaults.headers.common), this._headers && Object.assign(l, this._headers), s === "GET") {
-      const u = new URLSearchParams();
-      t.forEach((f, _) => {
-        f instanceof File || u.append(_, String(f));
-      }), o += (i.includes("?") ? "&" : "?") + u.toString();
+    if (typeof window < "u" && ((d = (f = (h = window.mintForm) == null ? void 0 : h.defaults) == null ? void 0 : f.headers) != null && d.common) && Object.assign(l, window.mintForm.defaults.headers.common), this._headers && Object.assign(l, this._headers), s === "GET") {
+      const p = new URLSearchParams();
+      t.forEach((u, _) => {
+        u instanceof File || p.append(_, String(u));
+      }), o += (i.includes("?") ? "&" : "?") + p.toString();
     } else if (n === "multipart/form-data" || r)
       a = t;
     else if (n === "application/json")
       a = JSON.stringify(e), l["Content-Type"] = "application/json";
     else {
-      const u = new URLSearchParams();
-      t.forEach((f, _) => {
-        f instanceof File || u.append(_, String(f));
-      }), a = u, l["Content-Type"] = "application/x-www-form-urlencoded";
+      const p = new URLSearchParams();
+      t.forEach((u, _) => {
+        u instanceof File || p.append(_, String(u));
+      }), a = p, l["Content-Type"] = "application/x-www-form-urlencoded";
     }
     if (typeof fetch == "function")
       try {
-        const u = await fetch(o, {
+        const p = await fetch(o, {
           method: s || "POST",
           body: s === "GET" ? null : a,
           headers: l
-        }), f = await u.text().catch(() => "");
-        let _ = f;
+        }), u = await p.text().catch(() => "");
+        let _ = u;
         try {
-          _ = JSON.parse(f);
+          _ = JSON.parse(u);
         } catch {
         }
-        if (!u.ok) {
-          const m = { status: u.status, data: _, response: { status: u.status, data: _ } };
+        if (!p.ok) {
+          const m = { status: p.status, data: _, response: { status: p.status, data: _ } };
           throw await this._applyErrorInterceptors(m);
         }
-        const g = { status: u.status, ok: u.ok, data: _ };
+        const g = { status: p.status, ok: p.ok, data: _ };
         return await this._applySuccessInterceptors(g);
-      } catch (u) {
-        if (u.response)
-          throw u;
-        const f = {
-          status: u.status || 0,
-          data: u.data || u.message || "Network error",
-          response: { status: u.status || 0, data: u.data || u.message || "Network error" }
+      } catch (p) {
+        if (p.response)
+          throw p;
+        const u = {
+          status: p.status || 0,
+          data: p.data || p.message || "Network error",
+          response: { status: p.status || 0, data: p.data || p.message || "Network error" }
         };
-        throw await this._applyErrorInterceptors(f);
+        throw await this._applyErrorInterceptors(u);
       }
     const c = this;
-    return await new Promise(async (u, f) => {
+    return await new Promise(async (p, u) => {
       const _ = new XMLHttpRequest();
       _.open(s || "POST", o, !0), Object.entries(l).forEach(([g, m]) => _.setRequestHeader(g, m)), _.onload = async function() {
         const { status: g, responseText: m } = _;
@@ -4864,10 +4864,10 @@ class Et extends HTMLElement {
           } catch {
           }
           try {
-            const b = { status: g, ok: !0, data: v }, k = await c._applySuccessInterceptors(b);
-            u(k);
+            const b = { status: g, ok: !0, data: v }, y = await c._applySuccessInterceptors(b);
+            p(y);
           } catch (b) {
-            f(b);
+            u(b);
           }
         } else {
           let v = m;
@@ -4876,10 +4876,10 @@ class Et extends HTMLElement {
           } catch {
           }
           try {
-            const b = { status: g, data: v, response: { status: g, data: v } }, k = await c._applyErrorInterceptors(b);
-            f(k);
+            const b = { status: g, data: v, response: { status: g, data: v } }, y = await c._applyErrorInterceptors(b);
+            u(y);
           } catch (b) {
-            f(b);
+            u(b);
           }
         }
       }, _.onerror = async function() {
@@ -4889,9 +4889,9 @@ class Et extends HTMLElement {
             data: _.responseText || "Network error",
             response: { status: _.status || 0, data: _.responseText || "Network error" }
           }, m = await c._applyErrorInterceptors(g);
-          f(m);
+          u(m);
         } catch (g) {
-          f(g);
+          u(g);
         }
       }, _.send(s === "GET" ? null : a);
     });
@@ -4936,7 +4936,7 @@ class Et extends HTMLElement {
           const o = Array.from(l);
           e[a] && Array.isArray(e[a]) ? o.forEach((c) => {
             e[a].some(
-              (p) => p.name === c.name && p.size === c.size && p.lastModified === c.lastModified
+              (f) => f.name === c.name && f.size === c.size && f.lastModified === c.lastModified
             ) || e[a].push(c);
           }) : e[a] = o;
         }
@@ -5296,8 +5296,8 @@ class Et extends HTMLElement {
       if (!n) return;
       const r = this._getFieldName(n);
       if (!r || !this._collectValidationRules()[r]) return;
-      const l = this._extractFieldValue([n]), o = l != null && (typeof l == "string" ? l.trim() !== "" : l instanceof FileList || Array.isArray(l) ? l.length > 0 : !0), c = n.hasAttribute("data-mint-form-error") || s instanceof HTMLElement && (s.hasAttribute("aria-invalid") || s.closest("[data-mint-form-error]")), h = !!n.closest("mint-tags"), p = n.tagName === "MINT-CHECKBOX" || n.tagName === "MINT-SWITCH" || n.tagName === "MINT-CHOICE" || s instanceof HTMLElement && (s.closest("mint-checkbox, mint-switch, mint-choice") || s.closest("mint-choice-option")), d = n.tagName === "MINT-DATE-PICKER" || s instanceof HTMLElement && s.closest("mint-date-picker");
-      (o || c || h || p || d) && setTimeout(() => {
+      const l = this._extractFieldValue([n]), o = l != null && (typeof l == "string" ? l.trim() !== "" : l instanceof FileList || Array.isArray(l) ? l.length > 0 : !0), c = n.hasAttribute("data-mint-form-error") || s instanceof HTMLElement && (s.hasAttribute("aria-invalid") || s.closest("[data-mint-form-error]")), h = !!n.closest("mint-tags"), f = n.tagName === "MINT-CHECKBOX" || n.tagName === "MINT-SWITCH" || n.tagName === "MINT-CHOICE" || s instanceof HTMLElement && (s.closest("mint-checkbox, mint-switch, mint-choice") || s.closest("mint-choice-option")), d = n.tagName === "MINT-DATE-PICKER" || s instanceof HTMLElement && s.closest("mint-date-picker");
+      (o || c || h || f || d) && setTimeout(() => {
         this._validateField(r);
       }, 0);
     };
@@ -5549,9 +5549,9 @@ typeof window < "u" && (window.mintForm = window.mintForm || {
       handlers: []
     }
   }
-}, window.mintForm.interceptors.response.use || (window.mintForm.interceptors.response.use = function(T, t) {
+}, window.mintForm.interceptors.response.use || (window.mintForm.interceptors.response.use = function(M, t) {
   return window.mintForm.interceptors.response.handlers.push({
-    fulfilled: T,
+    fulfilled: M,
     rejected: t
   }), window.mintForm.interceptors.response.handlers.length - 1;
 }));
@@ -5614,7 +5614,7 @@ class wt extends HTMLElement {
       ]);
       const o = r.querySelectorAll("th");
       o.forEach((c, h) => {
-        const p = c.querySelector("mint-icon"), d = (p == null ? void 0 : p.getAttribute("name")) || "", u = p !== null && d !== "ellipsis";
+        const f = c.querySelector("mint-icon"), d = (f == null ? void 0 : f.getAttribute("name")) || "", p = f !== null && d !== "ellipsis";
         this._setClasses(c, [
           "text-left",
           "font-semibold",
@@ -5625,29 +5625,29 @@ class wt extends HTMLElement {
           "border-b",
           "border-gray-200",
           "dark:border-gray-700"
-        ]), u && c.classList.add("cursor-pointer", "bg-[#F7F7F7]", "dark:bg-gray-800", "hover:bg-gray-100", "dark:hover:bg-gray-700", "transition-colors"), h === 0 && c.classList.add("pl-6"), h === o.length - 1 && c.classList.add("pr-6");
+        ]), p && c.classList.add("cursor-pointer", "bg-[#F7F7F7]", "dark:bg-gray-800", "hover:bg-gray-100", "dark:hover:bg-gray-700", "transition-colors"), h === 0 && c.classList.add("pl-6"), h === o.length - 1 && c.classList.add("pr-6");
       });
     }
     const a = t.querySelector("tbody");
     if (a) {
       const o = Array.from(a.querySelectorAll("tr"));
       o.forEach((c, h) => {
-        const p = c.hasAttribute("data-row-clickable");
+        const f = c.hasAttribute("data-row-clickable");
         this._setClasses(c, [
           "bg-white",
           "dark:bg-gray-900",
           "border-b",
           "border-gray-200",
           "dark:border-gray-700"
-        ]), p && c.classList.add("cursor-pointer", "hover:bg-gray-50", "dark:hover:bg-gray-800", "transition-colors"), h === o.length - 1 && c.classList.remove("border-b");
+        ]), f && c.classList.add("cursor-pointer", "hover:bg-gray-50", "dark:hover:bg-gray-800", "transition-colors"), h === o.length - 1 && c.classList.remove("border-b");
         const d = c.querySelectorAll("td");
-        d.forEach((u, f) => {
-          this._setClasses(u, [
+        d.forEach((p, u) => {
+          this._setClasses(p, [
             "text-gray-900",
             "dark:text-gray-100",
             "px-3",
             "py-2"
-          ]), f === 0 && u.classList.add("pl-6"), f === d.length - 1 && u.classList.add("pr-6"), e ? this._applyMobileCell(u, s) : this._restoreCell(u);
+          ]), u === 0 && p.classList.add("pl-6"), u === d.length - 1 && p.classList.add("pr-6"), e ? this._applyMobileCell(p, s) : this._restoreCell(p);
         });
       });
     }
@@ -6224,7 +6224,7 @@ class St extends HTMLElement {
   }
 }
 customElements.get("mint-clickable") || customElements.define("mint-clickable", St);
-class Lt extends HTMLElement {
+class Dt extends HTMLElement {
   constructor() {
     super(), this._headingElement = null, this._iconElement = null, this._dismissButton = null, this._headerWrapper = null, this._bodyWrapper = null, this._dismissHandler = null;
   }
@@ -6339,8 +6339,8 @@ class Lt extends HTMLElement {
     }), this.appendChild(this._headerWrapper), this.appendChild(this._bodyWrapper);
   }
 }
-customElements.get("mint-alert") || customElements.define("mint-alert", Lt);
-class Dt extends HTMLElement {
+customElements.get("mint-alert") || customElements.define("mint-alert", Dt);
+class Lt extends HTMLElement {
   constructor() {
     super(), this._configuration = null, this._rows = [], this._search = "", this._currentPage = 1, this._perPage = 15, this._totalRows = 0, this._lastPage = 0, this._offset = 0, this._rowsToShow = 15, this._loaded = !1, this._fetching = !1, this._loading = !1, this._fetchError = null, this._searching = !1, this._sorting = !1, this._sortingColumn = null, this._type = "provided", this._searchTimeoutId = null, this._sortTimeoutId = null, this._searchColumns = [], this._exportColumns = {}, this._columns = [], this._tableId = "", this._searchInput = null, this._tableContainer = null, this._paginationContainer = null, this._skeletonContainer = null, this._inMintCard = !1;
   }
@@ -6425,7 +6425,7 @@ class Dt extends HTMLElement {
     }), this._configuration.sortBy || (this._configuration.sortBy = "id"), this._configuration.sort || (this._configuration.sort = "asc"));
   }
   async _fetchData(t, e = !0, i, s) {
-    var l, o, c, h, p, d, u, f;
+    var l, o, c, h, f, d, p, u;
     if (!this._configuration) return;
     const n = t || (typeof this._configuration.data == "string" ? this._configuration.data : null);
     if (!n || this._fetching || this._loading)
@@ -6446,27 +6446,27 @@ class Dt extends HTMLElement {
       const m = await fetch(`${n}?${_.toString()}`, g);
       if (!m.ok)
         throw new Error(`HTTP error! status: ${m.status}`);
-      const v = await m.json(), b = ((l = v.content) == null ? void 0 : l.rows) || [], k = ((o = v.content) == null ? void 0 : o.total) || 0;
+      const v = await m.json(), b = ((l = v.content) == null ? void 0 : l.rows) || [], y = ((o = v.content) == null ? void 0 : o.total) || 0;
       if (this._configuration.loadMore && a !== 0)
         this._rows = this._rows.concat(b);
       else {
-        let C = b;
-        this._configuration.predefinedData ? (C = [...this._configuration.predefinedData, ...b], this._totalRows = k + this._configuration.predefinedData.length) : this._totalRows = k, this._rows = C;
+        let S = b;
+        this._configuration.predefinedData ? (S = [...this._configuration.predefinedData, ...b], this._totalRows = y + this._configuration.predefinedData.length) : this._totalRows = y, this._rows = S;
       }
-      const w = Math.floor(a / r) + 1;
-      this._configuration.loadMore || (((c = v.content) == null ? void 0 : c.current_page) !== void 0 && v.content.current_page === w ? this._currentPage = v.content.current_page : this._currentPage = w, this._offset = (this._currentPage - 1) * r), this._lastPage = ((h = v.content) == null ? void 0 : h.last_page) || 1, this._fetching = !1, this._loaded = !0, this._loading = !1, this._fetchError = null, this._searching = !1;
+      const C = Math.floor(a / r) + 1;
+      this._configuration.loadMore || (((c = v.content) == null ? void 0 : c.current_page) !== void 0 && v.content.current_page === C ? this._currentPage = v.content.current_page : this._currentPage = C, this._offset = (this._currentPage - 1) * r), this._lastPage = ((h = v.content) == null ? void 0 : h.last_page) || 1, this._fetching = !1, this._loaded = !0, this._loading = !1, this._fetchError = null, this._searching = !1;
       const E = this._sorting;
-      if (E && this._updateSortIcons(), this._sorting = !1, this._sortingColumn = null, E && this._updateSortIcons(), this.dispatchEvent(new CustomEvent("loaded", { detail: { rows: this._rows } })), this._updateSearchIcon(), (d = (p = this.querySelector(`#${this._tableId}`)) == null ? void 0 : p.closest("table")) == null ? void 0 : d.querySelector("tbody")) {
+      if (E && this._updateSortIcons(), this._sorting = !1, this._sortingColumn = null, E && this._updateSortIcons(), this.dispatchEvent(new CustomEvent("loaded", { detail: { rows: this._rows } })), this._updateSearchIcon(), (d = (f = this.querySelector(`#${this._tableId}`)) == null ? void 0 : f.closest("table")) == null ? void 0 : d.querySelector("tbody")) {
         if (E) {
-          const C = this._loading, D = this._fetching;
-          this._loading = !1, this._fetching = !1, this._updateTableBody(), this._loading = C, this._fetching = D;
+          const S = this._loading, w = this._fetching;
+          this._loading = !1, this._fetching = !1, this._updateTableBody(), this._loading = S, this._fetching = w;
         } else
           this._updateTableBody();
         this._updatePagination();
       } else
         this.render();
     } catch (_) {
-      this._fetching = !1, this._loading = !1, this._loaded = !0, this._searching = !1, this._fetchError = _ instanceof Error ? _.message : "Failed to fetch data", console.error("mint-resource-table: Error fetching data", _), this._updateSearchIcon(), ((f = (u = this.querySelector(`#${this._tableId}`)) == null ? void 0 : u.closest("table")) == null ? void 0 : f.querySelector("tbody")) ? (this._updateTableBody(), this._updatePagination()) : this.render();
+      this._fetching = !1, this._loading = !1, this._loaded = !0, this._searching = !1, this._fetchError = _ instanceof Error ? _.message : "Failed to fetch data", console.error("mint-resource-table: Error fetching data", _), this._updateSearchIcon(), ((u = (p = this.querySelector(`#${this._tableId}`)) == null ? void 0 : p.closest("table")) == null ? void 0 : u.querySelector("tbody")) ? (this._updateTableBody(), this._updatePagination()) : this.render();
     }
   }
   _getRows() {
@@ -6497,8 +6497,8 @@ class Dt extends HTMLElement {
         const d = c.getTime() - h.getTime();
         return i === "asc" ? d : -d;
       }
-      const p = String(r).localeCompare(String(a), void 0, { numeric: !0, sensitivity: "base" });
-      return i === "asc" ? p : -p;
+      const f = String(r).localeCompare(String(a), void 0, { numeric: !0, sensitivity: "base" });
+      return i === "asc" ? f : -f;
     }), this._perPage) {
       const s = Math.ceil(t.length / this._perPage);
       this._lastPage = s, t.forEach((n, r) => {
@@ -6589,11 +6589,11 @@ class Dt extends HTMLElement {
     const i = this.querySelector(`#search-${this._tableId}`), s = document.activeElement === i || (i == null ? void 0 : i.querySelector("input")) === document.activeElement, n = this._search;
     let r = "";
     if (!((this._fetching || this._loading) && !this._sorting) && (t.forEach((o, c) => {
-      const h = typeof this._configuration.onRowClick == "function", p = h ? "cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors" : "";
-      r += `<tr data-row-index="${c}" ${h ? 'data-row-clickable="true"' : ""}${p ? ` class="${p}"` : ""}>`, this._configuration.columns.forEach((d, u) => {
+      const h = typeof this._configuration.onRowClick == "function", f = h ? "cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors" : "";
+      r += `<tr data-row-index="${c}" ${h ? 'data-row-clickable="true"' : ""}${f ? ` class="${f}"` : ""}>`, this._configuration.columns.forEach((d, p) => {
         if (d.hidden) return;
-        const f = !d.show || d.show(this, o);
-        if (r += `<td style="${this._getStyle(d)}" class="${this._getClasses(d, !0)}">`, f)
+        const u = !d.show || d.show(this, o);
+        if (r += `<td style="${this._getStyle(d)}" class="${this._getClasses(d, !0)}">`, u)
           if (d.raw)
             if (d.action)
               (!d.action.show || d.action.show(this, o)) && (r += `<mint-button variant="solid" data-action="column-action" data-row-index="${c}" data-column-key="${this._configuration.columns.indexOf(d)}">${d.action.label}</mint-button>`);
@@ -6809,8 +6809,8 @@ class Dt extends HTMLElement {
         const l = typeof this._configuration.onRowClick == "function", o = l ? "cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors" : "";
         s += `<tr data-row-index="${a}" ${l ? 'data-row-clickable="true"' : ""}${o ? ` class="${o}"` : ""}>`, this._configuration.columns.forEach((c, h) => {
           if (c.hidden) return;
-          const p = !c.show || c.show(this, r);
-          if (s += `<td style="${this._getStyle(c)}" class="${this._getClasses(c, !0)}">`, p)
+          const f = !c.show || c.show(this, r);
+          if (s += `<td style="${this._getStyle(c)}" class="${this._getClasses(c, !0)}">`, f)
             if (c.raw)
               if (c.action) {
                 if (!c.action.show || c.action.show(this, r)) {
@@ -6819,18 +6819,18 @@ class Dt extends HTMLElement {
                 }
               } else if (c.actions)
                 if (c.actionStyle !== "buttons") {
-                  const d = `actions-popover-${this._tableId}-${a}`, u = `actions-button-${this._tableId}-${a}`;
-                  s += `<mint-button id="${u}" variant="link" icon="ellipsis">`, s += "</mint-button>", s += `<mint-popover id="${d}" trigger-id="${u}" direction="down">`, c.actions.forEach((f, _) => {
-                    if (!f.show || f.show(this, r)) {
-                      const g = typeof f.label == "function" ? f.label(this, r) : f.label;
+                  const d = `actions-popover-${this._tableId}-${a}`, p = `actions-button-${this._tableId}-${a}`;
+                  s += `<mint-button id="${p}" variant="link" icon="ellipsis">`, s += "</mint-button>", s += `<mint-popover id="${d}" trigger-id="${p}" direction="down">`, c.actions.forEach((u, _) => {
+                    if (!u.show || u.show(this, r)) {
+                      const g = typeof u.label == "function" ? u.label(this, r) : u.label;
                       s += `<div class="p-2 cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700" data-action="row-action" data-row-index="${a}" data-action-index="${_}" data-column-key="${this._configuration.columns.indexOf(c)}">${this._escapeHtml(String(g))}</div>`;
                     }
                   }), s += "</mint-popover>";
                 } else
-                  c.actions.forEach((d, u) => {
+                  c.actions.forEach((d, p) => {
                     if (!d.show || d.show(this, r)) {
-                      const f = d.label ? typeof d.label == "function" ? d.label(this, r) : d.label : "", _ = d.icon ? ` icon="${this._escapeHtml(d.icon)}"` : "", g = d.tone ? ` tone="${this._escapeHtml(d.tone)}"` : "";
-                      s += `<mint-button variant="link" class="${d.classes || ""}" data-action="row-action" data-row-index="${a}" data-action-index="${u}" data-column-key="${this._configuration.columns.indexOf(c)}"${_}${g}>`, f && (s += this._escapeHtml(String(f))), s += "</mint-button>";
+                      const u = d.label ? typeof d.label == "function" ? d.label(this, r) : d.label : "", _ = d.icon ? ` icon="${this._escapeHtml(d.icon)}"` : "", g = d.tone ? ` tone="${this._escapeHtml(d.tone)}"` : "";
+                      s += `<mint-button variant="link" class="${d.classes || ""}" data-action="row-action" data-row-index="${a}" data-action-index="${p}" data-column-key="${this._configuration.columns.indexOf(c)}"${_}${g}>`, u && (s += this._escapeHtml(String(u))), s += "</mint-button>";
                     }
                   });
               else typeof c.format == "function" ? s += c.format(this, r) : c.data && (s += this._escapeHtml(String(r[c.data] || "")));
@@ -6838,18 +6838,18 @@ class Dt extends HTMLElement {
               (!c.action.show || c.action.show(this, r)) && (s += `<mint-button variant="solid" data-action="column-action" data-row-index="${a}" data-column-key="${this._configuration.columns.indexOf(c)}">${c.action.label}</mint-button>`);
             else if (c.actions)
               if (c.actionStyle !== "buttons") {
-                const d = `actions-popover-${this._tableId}-${a}`, u = `actions-button-${this._tableId}-${a}`;
-                s += `<mint-button id="${u}" variant="link" icon="ellipsis">`, s += "</mint-button>", s += `<mint-popover id="${d}" trigger-id="${u}" direction="down">`, c.actions.forEach((f, _) => {
-                  if (!f.show || f.show(this, r)) {
-                    const g = typeof f.label == "function" ? f.label(this, r) : f.label;
+                const d = `actions-popover-${this._tableId}-${a}`, p = `actions-button-${this._tableId}-${a}`;
+                s += `<mint-button id="${p}" variant="link" icon="ellipsis">`, s += "</mint-button>", s += `<mint-popover id="${d}" trigger-id="${p}" direction="down">`, c.actions.forEach((u, _) => {
+                  if (!u.show || u.show(this, r)) {
+                    const g = typeof u.label == "function" ? u.label(this, r) : u.label;
                     s += `<div class="p-2 cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700" data-action="row-action" data-row-index="${a}" data-action-index="${_}" data-column-key="${this._configuration.columns.indexOf(c)}">${this._escapeHtml(String(g))}</div>`;
                   }
                 }), s += "</mint-popover>";
               } else
-                c.actions.forEach((d, u) => {
+                c.actions.forEach((d, p) => {
                   if (!d.show || d.show(this, r)) {
-                    const f = d.label ? typeof d.label == "function" ? d.label(this, r) : d.label : "", _ = d.icon ? ` icon="${this._escapeHtml(d.icon)}"` : "", g = d.tone ? ` tone="${this._escapeHtml(d.tone)}"` : "";
-                    s += `<mint-button variant="link" class="${d.classes || ""}" data-action="row-action" data-row-index="${a}" data-action-index="${u}" data-column-key="${this._configuration.columns.indexOf(c)}"${_}${g}>`, f && (s += this._escapeHtml(String(f))), s += "</mint-button>";
+                    const u = d.label ? typeof d.label == "function" ? d.label(this, r) : d.label : "", _ = d.icon ? ` icon="${this._escapeHtml(d.icon)}"` : "", g = d.tone ? ` tone="${this._escapeHtml(d.tone)}"` : "";
+                    s += `<mint-button variant="link" class="${d.classes || ""}" data-action="row-action" data-row-index="${a}" data-action-index="${p}" data-column-key="${this._configuration.columns.indexOf(c)}"${_}${g}>`, u && (s += this._escapeHtml(String(u))), s += "</mint-button>";
                   }
                 });
             else typeof c.format == "function" ? s += this._escapeHtml(c.format(this, r)) : c.data && (s += this._escapeHtml(String(r[c.data] || "")));
@@ -7006,7 +7006,7 @@ class Dt extends HTMLElement {
     t !== null && (this._currentPage = t, this._offset = (this._currentPage - 1) * this._perPage);
   }
 }
-customElements.get("mint-resource-table") || customElements.define("mint-resource-table", Dt);
+customElements.get("mint-resource-table") || customElements.define("mint-resource-table", Lt);
 class Tt extends HTMLElement {
   constructor() {
     super(), this._overlay = null, this._offCanvas = null, this._header = null, this._headingSlot = null, this._bodySlot = null, this._actionsSlot = null, this._closeButton = null, this._darkModeObserver = null;
@@ -7055,34 +7055,34 @@ class Tt extends HTMLElement {
     const r = this._getPositionClasses(s, n);
     this._offCanvas.className = r;
     let a = this._offCanvas.querySelector(".off-canvas-content");
-    if (a || (a = document.createElement("div"), a.className = "off-canvas-content bg-white dark:bg-gray-900 dark:border dark:border-gray-700 shadow-xl flex flex-col pointer-events-auto transition-all duration-300 ease-out", a.style.transform = this._getTransformValue(s, !1), this._offCanvas.appendChild(a)), i ? this._animateEnter() : this._animateExit(), Array.from(a.classList).forEach((f) => {
-      (f.startsWith("w-") || f.startsWith("max-w-")) && a.classList.remove(f);
+    if (a || (a = document.createElement("div"), a.className = "off-canvas-content bg-white dark:bg-gray-900 dark:border dark:border-gray-700 shadow-xl flex flex-col pointer-events-auto transition-all duration-300 ease-out", a.style.transform = this._getTransformValue(s, !1), this._offCanvas.appendChild(a)), i ? this._animateEnter() : this._animateExit(), Array.from(a.classList).forEach((u) => {
+      (u.startsWith("w-") || u.startsWith("max-w-")) && a.classList.remove(u);
     }), a.classList.remove("h-full", "max-h-[90vh]", "max-h-screen"), n)
       a.classList.add("w-full", "h-full");
     else {
-      const f = this.getWidth();
-      s === "top" || s === "bottom" ? a.classList.add("w-full", "max-h-[90vh]") : a.classList.add(f, "h-full");
+      const u = this.getWidth();
+      s === "top" || s === "bottom" ? a.classList.add("w-full", "max-h-[90vh]") : a.classList.add(u, "h-full");
     }
     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 flex-shrink-0", a.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 o = this._headingSlot.querySelector("mint-text");
     e ? (o || (o = document.createElement("mint-text"), o.setAttribute("size", "sub-heading"), o.setAttribute("bold", "true"), this._headingSlot.appendChild(o)), o.textContent = e) : o && o.remove(), Array.from(this.children).filter(
-      (f) => f !== this._overlay && f !== this._offCanvas && f !== this._headingSlot && f.getAttribute("slot") === "heading"
-    ).forEach((f) => {
-      this._headingSlot && f.parentElement !== this._headingSlot && this._headingSlot.appendChild(f);
+      (u) => u !== this._overlay && u !== this._offCanvas && u !== this._headingSlot && u.getAttribute("slot") === "heading"
+    ).forEach((u) => {
+      this._headingSlot && u.parentElement !== this._headingSlot && this._headingSlot.appendChild(u);
     }), 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"), a.appendChild(this._bodySlot)), Array.from(this.children).filter(
-      (f) => f !== this._overlay && f !== this._offCanvas && f !== this._bodySlot && f.getAttribute("slot") === "body"
-    ).forEach((f) => {
-      this._bodySlot && f.parentElement !== this._bodySlot && this._bodySlot.appendChild(f);
+      (u) => u !== this._overlay && u !== this._offCanvas && u !== this._bodySlot && u.getAttribute("slot") === "body"
+    ).forEach((u) => {
+      this._bodySlot && u.parentElement !== this._bodySlot && this._bodySlot.appendChild(u);
     }), this._actionsSlot || (this._actionsSlot = document.createElement("div"), this._actionsSlot.className = "p-4 border-t border-gray-200 dark:border-gray-700 flex-shrink-0", this._actionsSlot.setAttribute("slot", "actions"), a.appendChild(this._actionsSlot));
-    let p = this._actionsSlot.querySelector("mint-stack");
-    p || (p = document.createElement("mint-stack"), p.setAttribute("direction", "horizontal"), p.className = "justify-end", this._actionsSlot.appendChild(p)), Array.from(this.children).filter(
-      (f) => f !== this._overlay && f !== this._offCanvas && f !== this._actionsSlot && f.getAttribute("slot") === "actions"
-    ).forEach((f) => {
-      Array.from(f.children).forEach((g) => {
-        g.parentElement !== p && p.appendChild(g);
-      }), f.parentElement && f.remove();
-    }), Array.from(this.children).forEach((f) => {
-      f !== this._overlay && f !== this._offCanvas && f.getAttribute("slot") !== "heading" && f.getAttribute("slot") !== "body" && f.getAttribute("slot") !== "actions" && f !== this._headingSlot && f !== this._bodySlot && f !== this._actionsSlot && f.parentElement !== this._bodySlot && this._bodySlot.appendChild(f);
+    let f = this._actionsSlot.querySelector("mint-stack");
+    f || (f = document.createElement("mint-stack"), f.setAttribute("direction", "horizontal"), f.className = "justify-end", this._actionsSlot.appendChild(f)), Array.from(this.children).filter(
+      (u) => u !== this._overlay && u !== this._offCanvas && u !== this._actionsSlot && u.getAttribute("slot") === "actions"
+    ).forEach((u) => {
+      Array.from(u.children).forEach((g) => {
+        g.parentElement !== f && f.appendChild(g);
+      }), u.parentElement && u.remove();
+    }), Array.from(this.children).forEach((u) => {
+      u !== this._overlay && u !== this._offCanvas && u.getAttribute("slot") !== "heading" && u.getAttribute("slot") !== "body" && u.getAttribute("slot") !== "actions" && u !== this._headingSlot && u !== this._bodySlot && u !== this._actionsSlot && u.parentElement !== this._bodySlot && this._bodySlot.appendChild(u);
     }), this._updateBackgroundColor();
   }
   _getPositionClasses(t, e) {
@@ -7461,7 +7461,7 @@ const K = class K extends HTMLElement {
       bottom: 60,
       // Increased to make room for legend
       left: 60
-    }, this._showLegend = !0, this._showGrid = !0, this._showTooltip = !0, this._curveTension = 0.3, this._dataObserver = null, this._darkModeObserver = null, this._tooltipHideTimeout = null, this._lastTooltipContent = "", this._activeXValue = null, this._pinnedXValue = null, this._tooltipAnimationFrame = null, this._cachedTooltipContent = /* @__PURE__ */ new Map(), this._cachedXPositions = /* @__PURE__ */ new Map(), this._verticalLine = null, this._plotPoints = /* @__PURE__ */ new Map(), this._resizeObserver = null, this._windowResizeHandler = null, this._pieChartTimeouts = /* @__PURE__ */ new Set(), this._pieChartTooltipShown = !1, this._pieChartClickOutsideHandler = null, this._pieChartGroup = null, this._chartClickOutsideHandler = null, this._cachedBounds = { bounds: null, dataHash: "" }, this._cachedYRange = { range: null, dataHash: "" }, this._cachedXValues = { values: null, dataHash: "" }, this._widthValue = "100%", this._heightValue = 400, this._defaultColors = [
+    }, this._showLegend = !0, this._showGrid = !0, this._showTooltip = !0, this._curveTension = 0.3, this._dataObserver = null, this._darkModeObserver = null, this._tooltipHideTimeout = null, this._lastTooltipContent = "", this._activeXValue = null, this._pinnedXValue = null, this._tooltipAnimationFrame = null, this._cachedTooltipContent = /* @__PURE__ */ new Map(), this._cachedXPositions = /* @__PURE__ */ new Map(), this._verticalLine = null, this._plotPoints = /* @__PURE__ */ new Map(), this._resizeObserver = null, this._windowResizeHandler = null, this._pieChartTimeouts = /* @__PURE__ */ new Set(), this._pieChartTooltipShown = !1, this._pieChartClickOutsideHandler = null, this._pieChartGroup = null, this._chartClickOutsideHandler = null, this._cachedBounds = { bounds: null, dataHash: "" }, this._cachedYRange = { range: null, dataHash: "" }, this._cachedXValues = { values: null, dataHash: "" }, this._renderScheduled = !1, this._datasetVisibility = /* @__PURE__ */ new Map(), this._widthValue = "100%", this._heightValue = 400, this._defaultColors = [
       "#3b82f6",
       // blue
       "#ef4444",
@@ -7638,6 +7638,33 @@ const K = class K extends HTMLElement {
     }
     return i;
   }
+  /**
+   * Schedule a render using requestAnimationFrame to batch multiple updates
+   */
+  _scheduleRender() {
+    this._renderScheduled || (this._renderScheduled = !0, requestAnimationFrame(() => {
+      this._renderScheduled = !1, this.render();
+    }));
+  }
+  /**
+   * Check if a dataset is visible
+   */
+  _isDatasetVisible(t, e) {
+    if (t.id) {
+      const i = this._datasetVisibility.get(t.id);
+      if (i !== void 0)
+        return i;
+    }
+    return t.visible !== !1;
+  }
+  /**
+   * Initialize dataset visibility from dataset properties
+   */
+  _initializeDatasetVisibility() {
+    this._chartData && this._chartData.datasets.forEach((t, e) => {
+      t.id && (this._datasetVisibility.has(t.id) || this._datasetVisibility.set(t.id, t.visible !== !1));
+    });
+  }
   render() {
     var r, a, l, o;
     if (!this.isConnected) return;
@@ -7665,7 +7692,7 @@ const K = class K extends HTMLElement {
       this.innerHTML = '<div class="p-4 text-gray-500">No chart data provided</div>';
       return;
     }
-    switch (this.innerHTML = "", this._chartContainer = document.createElement("div"), this._chartContainer.className = "relative w-full", typeof this._widthValue == "string" && this._widthValue.endsWith("%") ? this._chartContainer.style.width = this._widthValue : this._chartContainer.style.width = `${this._width}px`, typeof this._heightValue == "string" && this._heightValue.endsWith("%") ? this._chartContainer.style.height = this._heightValue : this._chartContainer.style.height = `${this._height}px`, this.appendChild(this._chartContainer), this._svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"), this._svg.setAttribute("width", this._width.toString()), this._svg.setAttribute("height", this._height.toString()), this._svg.setAttribute("viewBox", `0 0 ${this._width} ${this._height}`), this._svg.setAttribute("class", "w-full h-full"), this._chartContainer && this._svg && this._chartContainer.appendChild(this._svg), this._showTooltip && this._createTooltip(), this._calculateRotatedLabelHeight(), this._showLegend ? this._legendHeight = this._calculateLegendHeight() : this._legendHeight = 0, this._showLegend && this._renderLegend(), this._chartType !== "pie" && this._pieChartClickOutsideHandler && (document.removeEventListener("click", this._pieChartClickOutsideHandler, !0), this._pieChartClickOutsideHandler = null, this._pieChartTooltipShown = !1, this._pieChartGroup = null), this._pinnedXValue = null, this._chartType) {
+    switch (this.innerHTML = "", this._chartContainer = document.createElement("div"), this._chartContainer.className = "relative w-full", typeof this._widthValue == "string" && this._widthValue.endsWith("%") ? this._chartContainer.style.width = this._widthValue : this._chartContainer.style.width = `${this._width}px`, typeof this._heightValue == "string" && this._heightValue.endsWith("%") ? this._chartContainer.style.height = this._heightValue : this._chartContainer.style.height = `${this._height}px`, this.appendChild(this._chartContainer), this._svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"), this._svg.setAttribute("width", this._width.toString()), this._svg.setAttribute("height", this._height.toString()), this._svg.setAttribute("viewBox", `0 0 ${this._width} ${this._height}`), this._svg.setAttribute("class", "w-full h-full"), this._chartContainer && this._svg && this._chartContainer.appendChild(this._svg), this._showTooltip && this._createTooltip(), this._initializeDatasetVisibility(), this._calculateRotatedLabelHeight(), this._showLegend ? this._legendHeight = this._calculateLegendHeight() : this._legendHeight = 0, this._showLegend && this._renderLegend(), this._chartType !== "pie" && this._pieChartClickOutsideHandler && (document.removeEventListener("click", this._pieChartClickOutsideHandler, !0), this._pieChartClickOutsideHandler = null, this._pieChartTooltipShown = !1, this._pieChartGroup = null), this._pinnedXValue = null, this._chartType) {
       case "line":
         this._renderLineChart();
         break;
@@ -7745,7 +7772,7 @@ const K = class K extends HTMLElement {
     const i = this._showLegend ? Math.max(this._legendHeight, 60) : 0, s = this._height - i, r = Math.floor(s / 35), a = Math.min(5, r);
     let l = 0;
     for (let o = 0; o <= a; o++) {
-      const c = this._getYRange(), h = c.max - (c.max - c.min) / a * o, p = this._formatYAxisValue(h), d = e.measureText(p);
+      const c = this._getYRange(), h = c.max - (c.max - c.min) / a * o, f = this._formatYAxisValue(h), d = e.measureText(f);
       l = Math.max(l, d.width);
     }
     return Math.ceil(l) + 20;
@@ -7759,26 +7786,26 @@ const K = class K extends HTMLElement {
     const o = (this._rotatedLabelHeight > 0 ? 30 : 20) + this._rotatedLabelHeight + 12;
     let c = o;
     this._showLegend && (c = o + 20 + Math.max(this._legendHeight, 60));
-    const h = this._height - n - i - s, p = h - c, d = 100;
-    let u = 1;
-    if (p < d && c > 0) {
+    const h = this._height - n - i - s, f = h - c, d = 100;
+    let p = 1;
+    if (f < d && c > 0) {
       const _ = h - d;
-      _ > 0 ? (u = Math.min(1, _ / c), u = Math.max(0.5, u)) : u = 0.5;
+      _ > 0 ? (p = Math.min(1, _ / c), p = Math.max(0.5, p)) : p = 0.5;
     }
-    r = c * u;
-    const f = {
+    r = c * p;
+    const u = {
       width: this._width - i - s,
       height: this._height - n - r,
       x: i,
       y: n
     };
-    return this._cachedBounds = { bounds: f, dataHash: e }, f;
+    return this._cachedBounds = { bounds: u, dataHash: e }, u;
   }
   _getAllDataPoints() {
     if (!this._chartData) return [];
     const t = [];
-    return this._chartData.datasets.forEach((e) => {
-      t.push(...e.data);
+    return this._chartData.datasets.forEach((e, i) => {
+      this._isDatasetVisible(e, i) && t.push(...e.data);
     }), t;
   }
   _getXValues() {
@@ -7791,17 +7818,17 @@ const K = class K extends HTMLElement {
     if (this._chartData.labels && this._chartData.labels.length > 0)
       return this._cachedXValues = { values: this._chartData.labels, dataHash: t }, this._chartData.labels;
     const e = /* @__PURE__ */ new Set();
-    this._chartData.datasets.forEach((s) => {
-      s.data.forEach((n) => {
-        e.add(n.x);
+    this._chartData.datasets.forEach((s, n) => {
+      this._isDatasetVisible(s, n) && s.data.forEach((r) => {
+        e.add(r.x);
       });
     });
     const i = Array.from(e).sort((s, n) => {
       if (typeof s == "number" && typeof n == "number") return s - n;
       const r = String(s), a = String(n), l = /^([A-Za-z]{3})\s+(\d{4})$/, o = r.match(l), c = a.match(l);
       if (o && c) {
-        const h = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], p = h.indexOf(o[1]), d = h.indexOf(c[1]), u = parseInt(o[2]), f = parseInt(c[2]);
-        return u !== f ? u - f : p - d;
+        const h = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], f = h.indexOf(o[1]), d = h.indexOf(c[1]), p = parseInt(o[2]), u = parseInt(c[2]);
+        return p !== u ? p - u : f - d;
       }
       return r.localeCompare(a);
     });
@@ -7904,6 +7931,7 @@ const K = class K extends HTMLElement {
     if (!this._chartData) return [];
     const e = [];
     return this._chartData.datasets.forEach((i, s) => {
+      if (!this._isDatasetVisible(i, s)) return;
       const n = i.data.find((r) => String(r.x) === String(t));
       if (n) {
         const r = this._getDatasetColor(i, s), a = this._formatValue(n.y, i);
@@ -7941,17 +7969,17 @@ const K = class K extends HTMLElement {
     const s = (c) => {
       !this._chartContainer || !this._svg || (e = c.clientX, i = c.clientY, this._tooltipAnimationFrame !== null && cancelAnimationFrame(this._tooltipAnimationFrame), this._tooltipAnimationFrame = requestAnimationFrame(() => {
         if (this._tooltipAnimationFrame = null, !this._svg) return;
-        const h = this._svg.getBoundingClientRect(), p = e - h.left, d = i - h.top;
-        if (p < t.x || p > t.x + t.width || d < t.y || d > t.y + t.height) {
+        const h = this._svg.getBoundingClientRect(), f = e - h.left, d = i - h.top;
+        if (f < t.x || f > t.x + t.width || d < t.y || d > t.y + t.height) {
           this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine(), this._activeXValue = null;
           return;
         }
-        const u = this._findNearestXValue(p);
-        if (!u) {
+        const p = this._findNearestXValue(f);
+        if (!p) {
           this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine(), this._activeXValue = null;
           return;
         }
-        if (this._pinnedXValue !== null && this._pinnedXValue === u) {
+        if (this._pinnedXValue !== null && this._pinnedXValue === p) {
           const g = this._pinnedXValue, m = this._getAllDatasetsAtX(g);
           if (m.length > 0) {
             this._activeXValue = g, this._showPlotPointsForX(g), this._showVerticalLineAtX(g, t);
@@ -7965,19 +7993,19 @@ const K = class K extends HTMLElement {
             return;
           }
         }
-        if (this._activeXValue === u) {
+        if (this._activeXValue === p) {
           this._updateTooltipPosition(e, i);
           return;
         }
-        const f = this._getAllDatasetsAtX(u);
-        if (f.length === 0) {
+        const u = this._getAllDatasetsAtX(p);
+        if (u.length === 0) {
           this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine();
           return;
         }
-        this._activeXValue = u, this._showPlotPointsForX(u), this._showVerticalLineAtX(u, t);
-        let _ = this._cachedTooltipContent.get(u);
+        this._activeXValue = p, this._showPlotPointsForX(p), this._showVerticalLineAtX(p, t);
+        let _ = this._cachedTooltipContent.get(p);
         if (!_) {
-          if (_ = `<strong>${u}</strong><br/>`, f.forEach((g) => {
+          if (_ = `<strong>${p}</strong><br/>`, u.forEach((g) => {
             _ += `<div style="display: flex; align-items: center; gap: 6px; margin-top: 4px;">
               <span style="display: inline-block; width: 12px; height: 12px; background-color: ${g.color}; border-radius: 2px;"></span>
               <span>${g.name}: ${g.formattedValue}</span>
@@ -7986,7 +8014,7 @@ const K = class K extends HTMLElement {
             const g = this._cachedTooltipContent.keys().next().value;
             g !== void 0 && this._cachedTooltipContent.delete(g);
           }
-          this._cachedTooltipContent.set(u, _);
+          this._cachedTooltipContent.set(p, _);
         }
         this._showTooltipAt(e, i, _);
       }));
@@ -7995,62 +8023,62 @@ const K = class K extends HTMLElement {
     }, r = (c) => {
       if (!this._chartContainer || !this._svg) return;
       c.stopPropagation();
-      const h = this._svg.getBoundingClientRect(), p = c.clientX - h.left, d = c.clientY - h.top;
-      if (p < t.x || p > t.x + t.width || d < t.y || d > t.y + t.height)
+      const h = this._svg.getBoundingClientRect(), f = c.clientX - h.left, d = c.clientY - h.top;
+      if (f < t.x || f > t.x + t.width || d < t.y || d > t.y + t.height)
         return;
-      const u = this._findNearestXValue(p);
-      if (u)
-        if (this._pinnedXValue === u)
+      const p = this._findNearestXValue(f);
+      if (p)
+        if (this._pinnedXValue === p)
           this._pinnedXValue = null, this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine(), this._activeXValue = null;
         else {
-          this._pinnedXValue = u, this._activeXValue = u;
-          const f = this._getAllDatasetsAtX(u);
-          if (f.length === 0) return;
-          this._showPlotPointsForX(u), this._showVerticalLineAtX(u, t);
-          let _ = this._cachedTooltipContent.get(u);
-          _ || (_ = `<strong>${u}</strong><br/>`, f.forEach((g) => {
+          this._pinnedXValue = p, this._activeXValue = p;
+          const u = this._getAllDatasetsAtX(p);
+          if (u.length === 0) return;
+          this._showPlotPointsForX(p), this._showVerticalLineAtX(p, t);
+          let _ = this._cachedTooltipContent.get(p);
+          _ || (_ = `<strong>${p}</strong><br/>`, u.forEach((g) => {
             _ += `<div style="display: flex; align-items: center; gap: 6px; margin-top: 4px;">
               <span style="display: inline-block; width: 12px; height: 12px; background-color: ${g.color}; border-radius: 2px;"></span>
               <span>${g.name}: ${g.formattedValue}</span>
             </div>`;
-          }), this._cachedTooltipContent.set(u, _)), this._showTooltipAt(c.clientX, c.clientY, _);
+          }), this._cachedTooltipContent.set(p, _)), this._showTooltipAt(c.clientX, c.clientY, _);
         }
     }, a = (c) => {
       if (c.preventDefault(), !this._chartContainer || !this._svg) return;
       const h = c.touches[0];
       if (!h) return;
-      const p = this._svg.getBoundingClientRect(), d = h.clientX - p.left, u = h.clientY - p.top;
-      if (d < t.x || d > t.x + t.width || u < t.y || u > t.y + t.height) {
+      const f = this._svg.getBoundingClientRect(), d = h.clientX - f.left, p = h.clientY - f.top;
+      if (d < t.x || d > t.x + t.width || p < t.y || p > t.y + t.height) {
         this._pinnedXValue === null && (this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine(), this._activeXValue = null);
         return;
       }
-      const f = this._findNearestXValue(d);
-      if (!f) {
+      const u = this._findNearestXValue(d);
+      if (!u) {
         this._pinnedXValue === null && (this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine(), this._activeXValue = null);
         return;
       }
-      if (this._pinnedXValue === f)
+      if (this._pinnedXValue === u)
         this._pinnedXValue = null, this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine(), this._activeXValue = null;
       else {
-        this._pinnedXValue = f, this._activeXValue = f;
-        const _ = this._getAllDatasetsAtX(f);
+        this._pinnedXValue = u, this._activeXValue = u;
+        const _ = this._getAllDatasetsAtX(u);
         if (_.length === 0) return;
-        this._showPlotPointsForX(f), this._showVerticalLineAtX(f, t);
-        let g = this._cachedTooltipContent.get(f);
-        g || (g = `<strong>${f}</strong><br/>`, _.forEach((m) => {
+        this._showPlotPointsForX(u), this._showVerticalLineAtX(u, t);
+        let g = this._cachedTooltipContent.get(u);
+        g || (g = `<strong>${u}</strong><br/>`, _.forEach((m) => {
           g += `<div style="display: flex; align-items: center; gap: 6px; margin-top: 4px;">
               <span style="display: inline-block; width: 12px; height: 12px; background-color: ${m.color}; border-radius: 2px;"></span>
               <span>${m.name}: ${m.formattedValue}</span>
             </div>`;
-        }), this._cachedTooltipContent.set(f, g)), this._showTooltipAt(h.clientX, h.clientY, g);
+        }), this._cachedTooltipContent.set(u, g)), this._showTooltipAt(h.clientX, h.clientY, g);
       }
     }, l = (c) => {
       if (c.preventDefault(), !this._chartContainer || !this._svg) return;
       const h = c.touches[0];
       h && (this._tooltipAnimationFrame !== null && cancelAnimationFrame(this._tooltipAnimationFrame), this._tooltipAnimationFrame = requestAnimationFrame(() => {
         if (this._tooltipAnimationFrame = null, !this._svg) return;
-        const p = this._svg.getBoundingClientRect(), d = h.clientX - p.left, u = h.clientY - p.top;
-        if (d < t.x || d > t.x + t.width || u < t.y || u > t.y + t.height) {
+        const f = this._svg.getBoundingClientRect(), d = h.clientX - f.left, p = h.clientY - f.top;
+        if (d < t.x || d > t.x + t.width || p < t.y || p > t.y + t.height) {
           if (this._pinnedXValue === null)
             this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine(), this._activeXValue = null;
           else {
@@ -8058,10 +8086,10 @@ const K = class K extends HTMLElement {
             if (v.length > 0) {
               this._activeXValue = m, this._showPlotPointsForX(m), this._showVerticalLineAtX(m, t);
               let b = this._cachedTooltipContent.get(m);
-              b || (b = `<strong>${m}</strong><br/>`, v.forEach((k) => {
+              b || (b = `<strong>${m}</strong><br/>`, v.forEach((y) => {
                 b += `<div style="display: flex; align-items: center; gap: 6px; margin-top: 4px;">
-                    <span style="display: inline-block; width: 12px; height: 12px; background-color: ${k.color}; border-radius: 2px;"></span>
-                    <span>${k.name}: ${k.formattedValue}</span>
+                    <span style="display: inline-block; width: 12px; height: 12px; background-color: ${y.color}; border-radius: 2px;"></span>
+                    <span>${y.name}: ${y.formattedValue}</span>
                   </div>`;
               }), this._cachedTooltipContent.set(m, b)), this._updateTooltipPosition(h.clientX, h.clientY), this._lastTooltipContent !== b && this._showTooltipAt(h.clientX, h.clientY, b);
             }
@@ -8073,33 +8101,33 @@ const K = class K extends HTMLElement {
           if (v.length > 0) {
             this._activeXValue = m, this._showPlotPointsForX(m), this._showVerticalLineAtX(m, t);
             let b = this._cachedTooltipContent.get(m);
-            b || (b = `<strong>${m}</strong><br/>`, v.forEach((k) => {
+            b || (b = `<strong>${m}</strong><br/>`, v.forEach((y) => {
               b += `<div style="display: flex; align-items: center; gap: 6px; margin-top: 4px;">
-                  <span style="display: inline-block; width: 12px; height: 12px; background-color: ${k.color}; border-radius: 2px;"></span>
-                  <span>${k.name}: ${k.formattedValue}</span>
+                  <span style="display: inline-block; width: 12px; height: 12px; background-color: ${y.color}; border-radius: 2px;"></span>
+                  <span>${y.name}: ${y.formattedValue}</span>
                 </div>`;
             }), this._cachedTooltipContent.set(m, b)), this._updateTooltipPosition(h.clientX, h.clientY), this._lastTooltipContent !== b && this._showTooltipAt(h.clientX, h.clientY, b);
             return;
           }
         }
-        const f = this._findNearestXValue(d);
-        if (!f) {
+        const u = this._findNearestXValue(d);
+        if (!u) {
           this._pinnedXValue === null && (this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine(), this._activeXValue = null);
           return;
         }
-        if (this._activeXValue === f) {
+        if (this._activeXValue === u) {
           this._updateTooltipPosition(h.clientX, h.clientY);
           return;
         }
-        const _ = this._getAllDatasetsAtX(f);
+        const _ = this._getAllDatasetsAtX(u);
         if (_.length === 0) {
           this._hideTooltip(), this._hidePlotPoints(), this._hideVerticalLine();
           return;
         }
-        this._activeXValue = f, this._showPlotPointsForX(f), this._showVerticalLineAtX(f, t);
-        let g = this._cachedTooltipContent.get(f);
+        this._activeXValue = u, this._showPlotPointsForX(u), this._showVerticalLineAtX(u, t);
+        let g = this._cachedTooltipContent.get(u);
         if (!g) {
-          if (g = `<strong>${f}</strong><br/>`, _.forEach((m) => {
+          if (g = `<strong>${u}</strong><br/>`, _.forEach((m) => {
             g += `<div style="display: flex; align-items: center; gap: 6px; margin-top: 4px;">
               <span style="display: inline-block; width: 12px; height: 12px; background-color: ${m.color}; border-radius: 2px;"></span>
               <span>${m.name}: ${m.formattedValue}</span>
@@ -8108,7 +8136,7 @@ const K = class K extends HTMLElement {
             const m = this._cachedTooltipContent.keys().next().value;
             m !== void 0 && this._cachedTooltipContent.delete(m);
           }
-          this._cachedTooltipContent.set(f, g);
+          this._cachedTooltipContent.set(u, g);
         }
         this._showTooltipAt(h.clientX, h.clientY, g);
       }));
@@ -8182,21 +8210,21 @@ const K = class K extends HTMLElement {
     r.font = "12px system-ui, -apple-system, sans-serif";
     const a = [];
     t.forEach((c) => {
-      const h = this._formatXAxisValue(c), p = r.measureText(h);
-      a.push(p.width);
+      const h = this._formatXAxisValue(c), f = r.measureText(h);
+      a.push(f.width);
     });
     const l = 80;
     let o = !0;
     for (let c = 1; c < t.length; c++) {
-      const h = s[c] - s[c - 1], p = a[c - 1] / 2 + a[c] / 2 + 10;
-      if (h < Math.max(p, l)) {
+      const h = s[c] - s[c - 1], f = a[c - 1] / 2 + a[c] / 2 + 10;
+      if (h < Math.max(f, l)) {
         o = !1;
         break;
       }
     }
     if (!o) {
-      const c = Math.max(...a), h = 12 * 1.2, p = (c + h) * 0.707;
-      this._rotatedLabelHeight = Math.ceil(p) + 10;
+      const c = Math.max(...a), h = 12 * 1.2, f = (c + h) * 0.707;
+      this._rotatedLabelHeight = Math.ceil(f) + 10;
     }
   }
   _renderGrid(t) {
@@ -8204,14 +8232,14 @@ const K = class K extends HTMLElement {
     const e = document.createElementNS("http://www.w3.org/2000/svg", "g");
     e.setAttribute("class", "chart-grid");
     const i = this._getYRange(), n = Math.floor(t.height / 35), r = Math.min(5, n);
-    for (let u = 0; u <= r; u++) {
-      const f = t.y + t.height / r * u, _ = document.createElementNS("http://www.w3.org/2000/svg", "line");
-      _.setAttribute("x1", t.x.toString()), _.setAttribute("y1", f.toString()), _.setAttribute("x2", (t.x + t.width).toString()), _.setAttribute("y2", f.toString()), _.setAttribute("stroke", "#e5e7eb"), _.setAttribute("stroke-width", "1"), _.setAttribute("stroke-dasharray", "2,2"), document.documentElement.classList.contains("dark") && _.setAttribute("stroke", "#374151"), e.appendChild(_);
-      const g = i.max - (i.max - i.min) / r * u, m = document.createElementNS("http://www.w3.org/2000/svg", "text");
-      let v = t.x - 10, b = f + 4, k = "end";
-      u === 0 && (b = f + 12), m.setAttribute("x", v.toString()), m.setAttribute("y", b.toString()), m.setAttribute("text-anchor", k), m.setAttribute("fill", "#6b7280"), m.setAttribute("font-size", "12");
-      const w = this._formatYAxisValue(g);
-      m.textContent = w, document.documentElement.classList.contains("dark") && m.setAttribute("fill", "#9ca3af"), e.appendChild(m);
+    for (let p = 0; p <= r; p++) {
+      const u = t.y + t.height / r * p, _ = document.createElementNS("http://www.w3.org/2000/svg", "line");
+      _.setAttribute("x1", t.x.toString()), _.setAttribute("y1", u.toString()), _.setAttribute("x2", (t.x + t.width).toString()), _.setAttribute("y2", u.toString()), _.setAttribute("stroke", "#e5e7eb"), _.setAttribute("stroke-width", "1"), _.setAttribute("stroke-dasharray", "2,2"), document.documentElement.classList.contains("dark") && _.setAttribute("stroke", "#374151"), e.appendChild(_);
+      const g = i.max - (i.max - i.min) / r * p, m = document.createElementNS("http://www.w3.org/2000/svg", "text");
+      let v = t.x - 10, b = u + 4, y = "end";
+      p === 0 && (b = u + 12), m.setAttribute("x", v.toString()), m.setAttribute("y", b.toString()), m.setAttribute("text-anchor", y), m.setAttribute("fill", "#6b7280"), m.setAttribute("font-size", "12");
+      const C = this._formatYAxisValue(g);
+      m.textContent = C, document.documentElement.classList.contains("dark") && m.setAttribute("fill", "#9ca3af"), e.appendChild(m);
     }
     const a = this._getXValues();
     if (a.length === 0) {
@@ -8219,34 +8247,34 @@ const K = class K extends HTMLElement {
       return;
     }
     const l = this._chartType === "bar", o = [];
-    a.forEach((u) => {
-      const f = l ? this._scaleXForBarChart(u, t) : this._scaleX(u, t);
-      o.push(f);
+    a.forEach((p) => {
+      const u = l ? this._scaleXForBarChart(p, t) : this._scaleX(p, t);
+      o.push(u);
     });
     const h = document.createElement("canvas").getContext("2d");
-    let p = !1, d = new Array(a.length).fill(!0);
+    let f = !1, d = new Array(a.length).fill(!0);
     if (h && a.length > 1) {
       h.font = "12px system-ui, -apple-system, sans-serif";
-      const u = [];
+      const p = [];
       a.forEach((g) => {
         const m = this._formatXAxisValue(g), v = h.measureText(m);
-        u.push(v.width);
+        p.push(v.width);
       });
-      const f = 80;
+      const u = 80;
       let _ = !0;
       for (let g = 1; g < a.length; g++) {
-        const m = o[g] - o[g - 1], v = u[g - 1] / 2 + u[g] / 2 + 10;
-        if (m < Math.max(v, f)) {
+        const m = o[g] - o[g - 1], v = p[g - 1] / 2 + p[g] / 2 + 10;
+        if (m < Math.max(v, u)) {
           _ = !1;
           break;
         }
       }
       if (!_) {
-        p = !0;
+        f = !0;
         const g = 12 * 1.2;
         if (this._rotatedLabelHeight === 0) {
-          const k = (Math.max(...u) + g) * 0.707;
-          this._rotatedLabelHeight = Math.ceil(k) + 10;
+          const y = (Math.max(...p) + g) * 0.707;
+          this._rotatedLabelHeight = Math.ceil(y) + 10;
         }
         const m = g * 1.5;
         let v = !0;
@@ -8258,73 +8286,73 @@ const K = class K extends HTMLElement {
         if (!v) {
           const b = m;
           d = new Array(a.length).fill(!1);
-          let k = -1 / 0;
-          a.length > 0 && (d[0] = !0, k = o[0]);
-          for (let w = 1; w < a.length - 1; w++) {
-            const E = o[w];
-            E - k >= b && (d[w] = !0, k = E);
+          let y = -1 / 0;
+          a.length > 0 && (d[0] = !0, y = o[0]);
+          for (let C = 1; C < a.length - 1; C++) {
+            const E = o[C];
+            E - y >= b && (d[C] = !0, y = E);
           }
           if (a.length > 1) {
-            const w = o[a.length - 1];
-            if (w - k >= b)
+            const C = o[a.length - 1];
+            if (C - y >= b)
               d[a.length - 1] = !0;
             else {
-              for (; w - k < b; ) {
+              for (; C - y < b; ) {
                 let E = !1;
-                for (let y = a.length - 2; y >= 0; y--)
-                  if (d[y]) {
-                    if (d[y] = !1, y > 0) {
-                      for (let C = y - 1; C >= 0; C--)
-                        if (d[C]) {
-                          k = o[C], E = !0;
+                for (let x = a.length - 2; x >= 0; x--)
+                  if (d[x]) {
+                    if (d[x] = !1, x > 0) {
+                      for (let S = x - 1; S >= 0; S--)
+                        if (d[S]) {
+                          y = o[S], E = !0;
                           break;
                         }
-                      E || (k = o[0]);
+                      E || (y = o[0]);
                     } else
-                      k = o[0];
+                      y = o[0];
                     E = !0;
                     break;
                   }
                 if (!E) break;
               }
-              w - k >= b && (d[a.length - 1] = !0);
+              C - y >= b && (d[a.length - 1] = !0);
             }
           }
         }
       }
     } else
       d = new Array(a.length).fill(!1), a.length > 0 && (d[0] = !0), a.length > 1 && (d[a.length - 1] = !0), this._rotatedLabelHeight = 0;
-    p || (this._rotatedLabelHeight = 0), a.forEach((u, f) => {
-      if (d[f]) {
-        const _ = o[f], g = document.createElementNS("http://www.w3.org/2000/svg", "line");
+    f || (this._rotatedLabelHeight = 0), a.forEach((p, u) => {
+      if (d[u]) {
+        const _ = o[u], g = document.createElementNS("http://www.w3.org/2000/svg", "line");
         g.setAttribute("x1", _.toString()), g.setAttribute("y1", t.y.toString()), g.setAttribute("x2", _.toString()), g.setAttribute("y2", (t.y + t.height).toString()), g.setAttribute("stroke", "#e5e7eb"), g.setAttribute("stroke-width", "1"), g.setAttribute("stroke-dasharray", "2,2"), document.documentElement.classList.contains("dark") && g.setAttribute("stroke", "#374151"), e.appendChild(g);
         const m = document.createElementNS("http://www.w3.org/2000/svg", "text");
         let v = _, b = "middle";
-        if (p) {
-          if (b = "end", f === a.length - 1) {
-            const M = document.createElement("canvas").getContext("2d");
-            if (M) {
-              M.font = "12px system-ui, -apple-system, sans-serif";
-              const I = this._formatXAxisValue(u), H = M.measureText(I).width * 0.707, F = t.x + t.width + 100;
-              v = Math.min(_, F - H);
+        if (f) {
+          if (b = "end", u === a.length - 1) {
+            const H = document.createElement("canvas").getContext("2d");
+            if (H) {
+              H.font = "12px system-ui, -apple-system, sans-serif";
+              const N = this._formatXAxisValue(p), I = H.measureText(N).width * 0.707, F = t.x + t.width + 100;
+              v = Math.min(_, F - I);
             }
           }
-        } else if (f === 0) {
-          const S = t.x;
-          v = Math.max(_, S), b = "start";
-        } else if (f === a.length - 1) {
-          const S = t.x + t.width;
-          v = Math.min(_, S), b = "end";
+        } else if (u === 0) {
+          const A = t.x;
+          v = Math.max(_, A), b = "start";
+        } else if (u === a.length - 1) {
+          const A = t.x + t.width;
+          v = Math.min(_, A), b = "end";
         }
         m.setAttribute("x", v.toString());
         const E = (this._rotatedLabelHeight > 0 ? 30 : 20) + this._rotatedLabelHeight + 12;
-        let y = E;
-        this._showLegend && (y = E + 20 + Math.max(this._legendHeight, 60));
-        const D = (this._height - t.y - t.height) / y, $ = (p ? 30 : 20) * D;
-        let A = t.y + t.height + $;
-        m.setAttribute("y", A.toString()), m.setAttribute("text-anchor", b), m.setAttribute("fill", "#6b7280"), m.setAttribute("font-size", "12"), p && m.setAttribute("transform", `rotate(-45 ${v} ${A})`);
-        const N = this._formatXAxisValue(u);
-        m.textContent = N, document.documentElement.classList.contains("dark") && m.setAttribute("fill", "#9ca3af"), e.appendChild(m);
+        let x = E;
+        this._showLegend && (x = E + 20 + Math.max(this._legendHeight, 60));
+        const w = (this._height - t.y - t.height) / x, $ = (f ? 30 : 20) * w;
+        let D = t.y + t.height + $;
+        m.setAttribute("y", D.toString()), m.setAttribute("text-anchor", b), m.setAttribute("fill", "#6b7280"), m.setAttribute("font-size", "12"), f && m.setAttribute("transform", `rotate(-45 ${v} ${D})`);
+        const T = this._formatXAxisValue(p);
+        m.textContent = T, document.documentElement.classList.contains("dark") && m.setAttribute("fill", "#9ca3af"), e.appendChild(m);
       }
     }), this._svg.appendChild(e);
   }
@@ -8333,27 +8361,27 @@ const K = class K extends HTMLElement {
     const t = this._getChartBounds();
     this._renderGrid(t);
     const e = document.createElementNS("http://www.w3.org/2000/svg", "g");
-    e.setAttribute("class", "chart-data"), this._chartData.datasets.forEach((i, s) => {
-      const n = this._getDatasetColor(i, s), r = document.createElementNS("http://www.w3.org/2000/svg", "path");
-      let a = "";
-      const l = i.data.map((o) => ({
-        x: this._scaleX(o.x, t),
-        y: this._scaleY(o.y, t)
+    e.setAttribute("class", "chart-data");
+    const i = document.createDocumentFragment();
+    this._chartData.datasets.forEach((s, n) => {
+      if (!this._isDatasetVisible(s, n)) return;
+      const r = this._getDatasetColor(s, n), a = document.createElementNS("http://www.w3.org/2000/svg", "path"), l = s.data.map((c) => ({
+        x: this._scaleX(c.x, t),
+        y: this._scaleY(c.y, t)
       }));
-      if (l.length !== 0) {
-        a += `M ${l[0].x} ${l[0].y} `;
-        for (let o = 1; o < l.length; o++)
-          a += `L ${l[o].x} ${l[o].y} `;
-        r.setAttribute("d", a), r.setAttribute("fill", "none"), r.setAttribute("stroke", n), r.setAttribute("stroke-width", "2"), r.setAttribute("stroke-linecap", "round"), r.setAttribute("stroke-linejoin", "round"), e.appendChild(r), i.data.forEach((o) => {
-          const c = document.createElementNS("http://www.w3.org/2000/svg", "circle"), h = this._scaleX(o.x, t), p = this._scaleY(o.y, t);
-          c.setAttribute("cx", h.toString()), c.setAttribute("cy", p.toString()), c.setAttribute("r", "4"), c.setAttribute("fill", n);
-          const d = document.documentElement.classList.contains("dark");
-          c.setAttribute("stroke", d ? "#1f2937" : "#fff"), c.setAttribute("stroke-width", "2"), c.setAttribute("class", "chart-point"), c.setAttribute("data-dataset", s.toString()), c.setAttribute("data-x", String(o.x)), c.setAttribute("data-y", o.y.toString()), c.setAttribute("data-name", i.name), c.style.opacity = "0", c.style.pointerEvents = "none";
-          const u = String(o.x);
-          this._plotPoints.has(u) || this._plotPoints.set(u, []), this._plotPoints.get(u).push(c), e.appendChild(c);
-        });
-      }
-    }), this._svg.appendChild(e);
+      if (l.length === 0) return;
+      const o = [`M ${l[0].x} ${l[0].y}`];
+      for (let c = 1; c < l.length; c++)
+        o.push(`L ${l[c].x} ${l[c].y}`);
+      a.setAttribute("d", o.join(" ")), a.setAttribute("fill", "none"), a.setAttribute("stroke", r), a.setAttribute("stroke-width", "2"), a.setAttribute("stroke-linecap", "round"), a.setAttribute("stroke-linejoin", "round"), i.appendChild(a), s.data.forEach((c) => {
+        const h = document.createElementNS("http://www.w3.org/2000/svg", "circle"), f = this._scaleX(c.x, t), d = this._scaleY(c.y, t);
+        h.setAttribute("cx", f.toString()), h.setAttribute("cy", d.toString()), h.setAttribute("r", "4"), h.setAttribute("fill", r);
+        const p = document.documentElement.classList.contains("dark");
+        h.setAttribute("stroke", p ? "#1f2937" : "#fff"), h.setAttribute("stroke-width", "2"), h.setAttribute("class", "chart-point"), h.setAttribute("data-dataset", n.toString()), h.setAttribute("data-x", String(c.x)), h.setAttribute("data-y", c.y.toString()), h.setAttribute("data-name", s.name), h.style.opacity = "0", h.style.pointerEvents = "none";
+        const u = String(c.x);
+        this._plotPoints.has(u) || this._plotPoints.set(u, []), this._plotPoints.get(u).push(h), i.appendChild(h);
+      });
+    }), e.appendChild(i), this._svg.appendChild(e);
   }
   /**
    * Scale x value for bar charts - treats positions as if there's a blank at start and end
@@ -8373,158 +8401,164 @@ const K = class K extends HTMLElement {
     this._renderGrid(t);
     const e = document.createElementNS("http://www.w3.org/2000/svg", "g");
     e.setAttribute("class", "chart-data");
-    const i = this._getXValues(), s = this._chartData.datasets.length, n = i.length;
-    if (n === 0) return;
-    const r = [];
-    i.forEach((u) => {
-      r.push(this._scaleXForBarChart(u, t));
-    }), r.sort((u, f) => u - f);
-    let a = t.width;
-    if (n > 1)
-      for (let u = 0; u < r.length - 1; u++) {
-        const f = r[u + 1] - r[u];
-        f > 0 && f < a && (a = f);
+    const i = document.createDocumentFragment(), s = this._getXValues(), n = this._chartData.datasets.filter(
+      (_, g) => this._isDatasetVisible(_, g)
+    ).length, r = s.length;
+    if (r === 0) return;
+    const a = [];
+    s.forEach((_) => {
+      a.push(this._scaleXForBarChart(_, t));
+    }), a.sort((_, g) => _ - g);
+    let l = t.width;
+    if (r > 1)
+      for (let _ = 0; _ < a.length - 1; _++) {
+        const g = a[_ + 1] - a[_];
+        g > 0 && g < l && (l = g);
       }
     else
-      a = t.width * 0.5;
-    const l = a * 0.7, o = 0.2, c = (1 + o) * s - o;
-    let h = l / c, p = h * o, d = (h + p) * s - p;
-    if (d > l) {
-      const u = l / d;
-      h *= u, p = h * o, d = (h + p) * s - p;
-    }
-    this._chartData.datasets.forEach((u, f) => {
-      const _ = this._getDatasetColor(u, f), m = -d / 2 + (h + p) * f;
-      u.data.forEach((v) => {
-        const b = this._scaleXForBarChart(v.x, t), k = this._scaleY(v.y, t), w = t.y + t.height - k, E = b + m, y = document.createElementNS("http://www.w3.org/2000/svg", "rect");
-        y.setAttribute("x", E.toString()), y.setAttribute("y", k.toString()), y.setAttribute("width", h.toString()), y.setAttribute("height", w.toString()), y.setAttribute("fill", _), y.setAttribute("rx", "2"), y.setAttribute("class", "chart-bar"), y.setAttribute("data-dataset", f.toString()), y.setAttribute("data-x", String(v.x)), y.setAttribute("data-y", v.y.toString()), y.setAttribute("data-name", u.name), y.style.cursor = "pointer", this._showTooltip && (y.addEventListener("mouseenter", (C) => {
-          const D = this._getAllDatasetsAtX(v.x);
-          let $ = `<strong>${v.x}</strong><br/>`;
+      l = t.width * 0.5;
+    const o = l * 0.7, c = 0.2, h = (1 + c) * n - c;
+    let f = o / h, d = f * c, p = (f + d) * n - d;
+    if (p > o) {
+      const _ = o / p;
+      f *= _, d = f * c, p = (f + d) * n - d;
+    }
+    let u = 0;
+    this._chartData.datasets.forEach((_, g) => {
+      if (!this._isDatasetVisible(_, g)) return;
+      const m = this._getDatasetColor(_, g), b = -p / 2 + (f + d) * u;
+      u++, _.data.forEach((y) => {
+        const C = this._scaleXForBarChart(y.x, t), E = this._scaleY(y.y, t), x = t.y + t.height - E, S = C + b, w = document.createElementNS("http://www.w3.org/2000/svg", "rect");
+        w.setAttribute("x", S.toString()), w.setAttribute("y", E.toString()), w.setAttribute("width", f.toString()), w.setAttribute("height", x.toString()), w.setAttribute("fill", m), w.setAttribute("rx", "2"), w.setAttribute("class", "chart-bar"), w.setAttribute("data-dataset", g.toString()), w.setAttribute("data-x", String(y.x)), w.setAttribute("data-y", y.y.toString()), w.setAttribute("data-name", _.name), w.style.cursor = "pointer", this._showTooltip && (w.addEventListener("mouseenter", ($) => {
+          const D = this._getAllDatasetsAtX(y.x);
+          let T = `<strong>${y.x}</strong><br/>`;
           D.forEach((A) => {
-            $ += `<div style="display: flex; align-items: center; gap: 6px; margin-top: 4px;">
+            T += `<div style="display: flex; align-items: center; gap: 6px; margin-top: 4px;">
                 <span style="display: inline-block; width: 12px; height: 12px; background-color: ${A.color}; border-radius: 2px;"></span>
                 <span>${A.name}: ${A.formattedValue}</span>
               </div>`;
-          }), this._showTooltipAt(C.clientX, C.clientY, $);
-        }), y.addEventListener("mouseleave", () => {
+          }), this._showTooltipAt($.clientX, $.clientY, T);
+        }), w.addEventListener("mouseleave", () => {
           this._hideTooltip();
-        })), e.appendChild(y);
+        })), i.appendChild(w);
       });
-    }), this._svg.appendChild(e);
+    }), e.appendChild(i), this._svg.appendChild(e);
   }
   _renderAreaChart() {
     if (!this._svg || !this._chartData) return;
     const t = this._getChartBounds();
     this._renderGrid(t);
     const e = document.createElementNS("http://www.w3.org/2000/svg", "g");
-    e.setAttribute("class", "chart-data"), this._chartData.datasets.forEach((i, s) => {
-      const n = this._getDatasetColor(i, s), r = i.data.map((d) => ({
-        x: this._scaleX(d.x, t),
-        y: this._scaleY(d.y, t)
+    e.setAttribute("class", "chart-data");
+    const i = document.createDocumentFragment();
+    this._chartData.datasets.forEach((s, n) => {
+      if (!this._isDatasetVisible(s, n)) return;
+      const r = this._getDatasetColor(s, n), a = s.data.map((p) => ({
+        x: this._scaleX(p.x, t),
+        y: this._scaleY(p.y, t)
       }));
-      if (r.length === 0) return;
-      let a = "";
-      const l = t.y + t.height;
-      a += `M ${r[0].x} ${l} L ${r[0].x} ${r[0].y} `;
-      for (let d = 1; d < r.length; d++)
-        a += `L ${r[d].x} ${r[d].y} `;
-      const o = r[r.length - 1];
-      a += `L ${o.x} ${l} Z`;
-      const c = document.createElementNS("http://www.w3.org/2000/svg", "path");
-      c.setAttribute("d", a), c.setAttribute("fill", n), c.setAttribute("fill-opacity", "0.3"), e.appendChild(c);
+      if (a.length === 0) return;
+      const l = t.y + t.height, o = [
+        `M ${a[0].x} ${l}`,
+        `L ${a[0].x} ${a[0].y}`
+      ];
+      for (let p = 1; p < a.length; p++)
+        o.push(`L ${a[p].x} ${a[p].y}`);
+      const c = a[a.length - 1];
+      o.push(`L ${c.x} ${l}`, "Z");
       const h = document.createElementNS("http://www.w3.org/2000/svg", "path");
-      let p = "";
-      if (r.length !== 0) {
-        p += `M ${r[0].x} ${r[0].y} `;
-        for (let d = 1; d < r.length; d++)
-          p += `L ${r[d].x} ${r[d].y} `;
-        h.setAttribute("d", p), h.setAttribute("fill", "none"), h.setAttribute("stroke", n), h.setAttribute("stroke-width", "2"), e.appendChild(h), i.data.forEach((d) => {
-          const u = document.createElementNS("http://www.w3.org/2000/svg", "circle"), f = this._scaleX(d.x, t), _ = this._scaleY(d.y, t);
-          u.setAttribute("cx", f.toString()), u.setAttribute("cy", _.toString()), u.setAttribute("r", "4"), u.setAttribute("fill", n);
-          const g = document.documentElement.classList.contains("dark");
-          u.setAttribute("stroke", g ? "#1f2937" : "#fff"), u.setAttribute("stroke-width", "2"), u.setAttribute("class", "chart-point"), u.setAttribute("data-dataset", s.toString()), u.setAttribute("data-x", String(d.x)), u.setAttribute("data-y", d.y.toString()), u.setAttribute("data-name", i.name), u.style.opacity = "0", u.style.pointerEvents = "none";
-          const m = String(d.x);
-          this._plotPoints.has(m) || this._plotPoints.set(m, []), this._plotPoints.get(m).push(u), e.appendChild(u);
-        });
-      }
-    }), this._svg.appendChild(e);
+      h.setAttribute("d", o.join(" ")), h.setAttribute("fill", r), h.setAttribute("fill-opacity", "0.3"), i.appendChild(h);
+      const f = document.createElementNS("http://www.w3.org/2000/svg", "path");
+      if (a.length === 0) return;
+      const d = [`M ${a[0].x} ${a[0].y}`];
+      for (let p = 1; p < a.length; p++)
+        d.push(`L ${a[p].x} ${a[p].y}`);
+      f.setAttribute("d", d.join(" ")), f.setAttribute("fill", "none"), f.setAttribute("stroke", r), f.setAttribute("stroke-width", "2"), i.appendChild(f), s.data.forEach((p) => {
+        const u = document.createElementNS("http://www.w3.org/2000/svg", "circle"), _ = this._scaleX(p.x, t), g = this._scaleY(p.y, t);
+        u.setAttribute("cx", _.toString()), u.setAttribute("cy", g.toString()), u.setAttribute("r", "4"), u.setAttribute("fill", r);
+        const m = document.documentElement.classList.contains("dark");
+        u.setAttribute("stroke", m ? "#1f2937" : "#fff"), u.setAttribute("stroke-width", "2"), u.setAttribute("class", "chart-point"), u.setAttribute("data-dataset", n.toString()), u.setAttribute("data-x", String(p.x)), u.setAttribute("data-y", p.y.toString()), u.setAttribute("data-name", s.name), u.style.opacity = "0", u.style.pointerEvents = "none";
+        const v = String(p.x);
+        this._plotPoints.has(v) || this._plotPoints.set(v, []), this._plotPoints.get(v).push(u), i.appendChild(u);
+      });
+    }), e.appendChild(i), this._svg.appendChild(e);
   }
   _renderPieChart() {
     if (!this._svg || !this._chartData) return;
     const t = this._getChartBounds(), e = t.x + t.width / 2, i = t.y + t.height / 2, s = Math.min(t.width, t.height) / 2 - 20, n = 2, r = this._chartData.datasets[0];
     if (!r || !r.data || r.data.length === 0) return;
-    const a = r.data.reduce((h, p) => h + p.y, 0);
+    const a = r.data.reduce((h, f) => h + f.y, 0);
     if (a === 0) return;
     const l = document.createElementNS("http://www.w3.org/2000/svg", "g");
     l.setAttribute("class", "chart-data"), this._pieChartGroup = l, this._pieChartClickOutsideHandler || (this._pieChartClickOutsideHandler = (h) => {
       if (!this._pieChartTooltipShown) return;
-      const p = h.target;
-      this._pieChartGroup && !this._pieChartGroup.contains(p) && (this._pieChartTooltipShown = !1, this._hideTooltip());
+      const f = h.target;
+      this._pieChartGroup && !this._pieChartGroup.contains(f) && (this._pieChartTooltipShown = !1, this._hideTooltip());
     }, document.addEventListener("click", this._pieChartClickOutsideHandler, !0));
     const o = document.createElementNS("http://www.w3.org/2000/svg", "circle");
     o.setAttribute("cx", e.toString()), o.setAttribute("cy", i.toString()), o.setAttribute("r", s.toString()), o.setAttribute("fill", "transparent"), o.setAttribute("pointer-events", "none"), l.appendChild(o);
     let c = -Math.PI / 2;
-    r.data.forEach((h, p) => {
-      const d = h.y, u = d / a * 100, f = d / a * 2 * Math.PI, _ = h.color || this._getDatasetColor(r, 0, p), g = document.createElementNS("http://www.w3.org/2000/svg", "g");
-      g.setAttribute("class", "chart-pie-slice-group"), g.setAttribute("data-index", p.toString()), g.style.cursor = "pointer", g.style.transition = "transform 0.2s ease-out";
-      const m = document.createElementNS("http://www.w3.org/2000/svg", "path"), v = s + n, b = e + v * Math.cos(c), k = i + v * Math.sin(c), w = e + v * Math.cos(c + f), E = i + v * Math.sin(c + f), y = f > Math.PI ? 1 : 0, C = [
+    r.data.forEach((h, f) => {
+      const d = h.y, p = d / a * 100, u = d / a * 2 * Math.PI, _ = h.color || this._getDatasetColor(r, 0, f), g = document.createElementNS("http://www.w3.org/2000/svg", "g");
+      g.setAttribute("class", "chart-pie-slice-group"), g.setAttribute("data-index", f.toString()), g.style.cursor = "pointer", g.style.transition = "transform 0.2s ease-out";
+      const m = document.createElementNS("http://www.w3.org/2000/svg", "path"), v = s + n, b = e + v * Math.cos(c), y = i + v * Math.sin(c), C = e + v * Math.cos(c + u), E = i + v * Math.sin(c + u), x = u > Math.PI ? 1 : 0, S = [
         `M ${e} ${i}`,
-        `L ${b} ${k}`,
-        `A ${v} ${v} 0 ${y} 1 ${w} ${E}`,
+        `L ${b} ${y}`,
+        `A ${v} ${v} 0 ${x} 1 ${C} ${E}`,
         "Z"
       ].join(" ");
-      m.setAttribute("d", C), m.setAttribute("fill", _), m.setAttribute("class", "chart-pie-slice"), m.setAttribute("data-index", p.toString()), m.setAttribute("data-x", String(h.x)), m.setAttribute("data-y", h.y.toString()), m.setAttribute("data-name", r.name), m.setAttribute("data-percentage", u.toFixed(1)), g.appendChild(m);
-      const D = c + f / 2, $ = 10, A = Math.cos(D) * $, N = Math.sin(D) * $;
-      let S = null, M = null, I = !1;
+      m.setAttribute("d", S), m.setAttribute("fill", _), m.setAttribute("class", "chart-pie-slice"), m.setAttribute("data-index", f.toString()), m.setAttribute("data-x", String(h.x)), m.setAttribute("data-y", h.y.toString()), m.setAttribute("data-name", r.name), m.setAttribute("data-percentage", p.toFixed(1)), g.appendChild(m);
+      const w = c + u / 2, $ = 10, D = Math.cos(w) * $, T = Math.sin(w) * $;
+      let A = null, H = null, N = !1;
       if (g.__chartInstance = this, g.addEventListener("mouseenter", function() {
-        if (M !== null && (clearTimeout(M), M = null), !I) {
-          S !== null && clearTimeout(S);
-          const x = window.setTimeout(() => {
-            I = !0, this.setAttribute("transform", `translate(${A}, ${N})`), S = null, this.__chartInstance && this.__chartInstance._pieChartTimeouts.delete(x);
+        if (H !== null && (clearTimeout(H), H = null), !N) {
+          A !== null && clearTimeout(A);
+          const k = window.setTimeout(() => {
+            N = !0, this.setAttribute("transform", `translate(${D}, ${T})`), A = null, this.__chartInstance && this.__chartInstance._pieChartTimeouts.delete(k);
           }, 150);
-          S = x, this.__chartInstance && this.__chartInstance._pieChartTimeouts.add(x);
+          A = k, this.__chartInstance && this.__chartInstance._pieChartTimeouts.add(k);
         }
       }), g.addEventListener("mouseleave", function() {
-        if (S !== null && (clearTimeout(S), S = null), I) {
-          M !== null && clearTimeout(M);
-          const x = window.setTimeout(() => {
-            I = !1, this.setAttribute("transform", "translate(0, 0)"), M = null, this.__chartInstance && this.__chartInstance._pieChartTimeouts.delete(x);
+        if (A !== null && (clearTimeout(A), A = null), N) {
+          H !== null && clearTimeout(H);
+          const k = window.setTimeout(() => {
+            N = !1, this.setAttribute("transform", "translate(0, 0)"), H = null, this.__chartInstance && this.__chartInstance._pieChartTimeouts.delete(k);
           }, 200);
-          M = x, this.__chartInstance && this.__chartInstance._pieChartTimeouts.add(x);
+          H = k, this.__chartInstance && this.__chartInstance._pieChartTimeouts.add(k);
         }
       }), g.addEventListener("click", function() {
-        S !== null && (clearTimeout(S), S = null), M !== null && (clearTimeout(M), M = null), I = !0, this.setAttribute("transform", `translate(${A}, ${N})`);
+        A !== null && (clearTimeout(A), A = null), H !== null && (clearTimeout(H), H = null), N = !0, this.setAttribute("transform", `translate(${D}, ${T})`);
       }), this._showTooltip) {
-        let x = null, L = null, H = !1;
+        let k = null, L = null, I = !1;
         g.addEventListener("mouseenter", (F) => {
-          if (L !== null && (clearTimeout(L), L = null), !H) {
-            x !== null && clearTimeout(x);
+          if (L !== null && (clearTimeout(L), L = null), !I) {
+            k !== null && clearTimeout(k);
             const V = window.setTimeout(() => {
-              H = !0, this._pieChartTooltipShown = !0;
-              const P = this._formatValue(d, r), R = `<strong>${h.x}</strong><br/>${r.name}: ${P}<br/>${u.toFixed(1)}%`;
-              this._showTooltipAt(F.clientX, F.clientY, R), x = null, this._pieChartTimeouts.delete(V);
+              I = !0, this._pieChartTooltipShown = !0;
+              const P = this._formatValue(d, r), R = `<strong>${h.x}</strong><br/>${r.name}: ${P}<br/>${p.toFixed(1)}%`;
+              this._showTooltipAt(F.clientX, F.clientY, R), k = null, this._pieChartTimeouts.delete(V);
             }, 150);
-            x = V, this._pieChartTimeouts.add(V);
+            k = V, this._pieChartTimeouts.add(V);
           }
         }), g.addEventListener("mouseleave", () => {
-          if (x !== null && (clearTimeout(x), x = null), H) {
+          if (k !== null && (clearTimeout(k), k = null), I) {
             L !== null && clearTimeout(L);
             const F = window.setTimeout(() => {
-              H = !1, this._pieChartTooltipShown = !1, this._hideTooltip(), L = null, this._pieChartTimeouts.delete(F);
+              I = !1, this._pieChartTooltipShown = !1, this._hideTooltip(), L = null, this._pieChartTimeouts.delete(F);
             }, 200);
             L = F, this._pieChartTimeouts.add(F);
           }
         }), g.addEventListener("click", (F) => {
-          F.stopPropagation(), x !== null && (clearTimeout(x), x = null), L !== null && (clearTimeout(L), L = null), H = !0, this._pieChartTooltipShown = !0;
-          const V = this._formatValue(d, r), P = `<strong>${h.x}</strong><br/>${r.name}: ${V}<br/>${u.toFixed(1)}%`;
+          F.stopPropagation(), k !== null && (clearTimeout(k), k = null), L !== null && (clearTimeout(L), L = null), I = !0, this._pieChartTooltipShown = !0;
+          const V = this._formatValue(d, r), P = `<strong>${h.x}</strong><br/>${r.name}: ${V}<br/>${p.toFixed(1)}%`;
           this._showTooltipAt(F.clientX, F.clientY, P);
         });
       }
-      if (u > 5) {
-        const x = c + f / 2, L = s * 0.7, H = e + L * Math.cos(x), F = i + L * Math.sin(x), V = this._getContrastColor(_), P = document.createElementNS("http://www.w3.org/2000/svg", "text");
-        P.setAttribute("x", H.toString()), P.setAttribute("y", F.toString()), P.setAttribute("text-anchor", "middle"), P.setAttribute("dominant-baseline", "middle"), P.setAttribute("fill", V), P.setAttribute("font-size", "12"), P.setAttribute("font-weight", "500"), P.textContent = `${u.toFixed(1)}%`, g.appendChild(P);
+      if (p > 5) {
+        const k = c + u / 2, L = s * 0.7, I = e + L * Math.cos(k), F = i + L * Math.sin(k), V = this._getContrastColor(_), P = document.createElementNS("http://www.w3.org/2000/svg", "text");
+        P.setAttribute("x", I.toString()), P.setAttribute("y", F.toString()), P.setAttribute("text-anchor", "middle"), P.setAttribute("dominant-baseline", "middle"), P.setAttribute("fill", V), P.setAttribute("font-size", "12"), P.setAttribute("font-weight", "500"), P.textContent = `${p.toFixed(1)}%`, g.appendChild(P);
       }
-      l.appendChild(g), c += f;
+      l.appendChild(g), c += u;
     }), this._svg.appendChild(l);
   }
   /**
@@ -8533,18 +8567,18 @@ const K = class K extends HTMLElement {
   _calculateLegendHeight() {
     if (!this._chartData) return 0;
     const t = 32, e = 20, i = 6, s = 8, n = 150, r = this._width - 40, a = [];
-    this._chartType === "pie" && this._chartData.datasets.length > 0 ? this._chartData.datasets[0].data.forEach((p) => {
-      a.push({ name: String(p.x), row: 0 });
+    this._chartType === "pie" && this._chartData.datasets.length > 0 ? this._chartData.datasets[0].data.forEach((f) => {
+      a.push({ name: String(f.x), row: 0 });
     }) : this._chartData.datasets.forEach((h) => {
       a.push({ name: h.name, row: 0 });
     });
     let l = 0;
     const o = [];
     a.forEach((h) => {
-      const p = Math.min(h.name.length * 7.5, n), d = i * 2 + s + p;
-      o[l] || (o[l] = []), o[l].reduce((f, _) => {
+      const f = Math.min(h.name.length * 7.5, n), d = i * 2 + s + f;
+      o[l] || (o[l] = []), o[l].reduce((u, _) => {
         const g = Math.min(_.name.length * 7.5, n);
-        return f + (i * 2 + s + g) + t;
+        return u + (i * 2 + s + g) + t;
       }, 0) + d > r && o[l].length > 0 && (l++, o[l] = []), h.row = l, o[l].push(h);
     });
     const c = Math.max(i * 2, 16);
@@ -8558,23 +8592,24 @@ const K = class K extends HTMLElement {
     if (e.setAttribute("class", "chart-legend"), !this._chartData) return { height: 0 };
     const i = this._chartData, s = 32, n = 20, r = 6, a = 8, l = 150, o = this._width - 40, c = [];
     if (this._chartType === "pie" && i.datasets.length > 0) {
-      const A = i.datasets[0];
-      A.data.forEach((N, S) => {
-        const M = N.color || this._getDatasetColor(A, 0, S), I = String(N.x);
+      const D = i.datasets[0];
+      D.data.forEach((T, A) => {
+        const H = T.color || this._getDatasetColor(D, 0, A), N = String(T.x);
         c.push({
-          name: I,
-          color: M,
+          name: N,
+          color: H,
           x: 0,
           textX: 0,
           row: 0
         });
       });
     } else
-      i.datasets.forEach((A, N) => {
-        const S = this._getDatasetColor(A, N);
+      i.datasets.forEach((D, T) => {
+        if (!this._isDatasetVisible(D, T)) return;
+        const A = this._getDatasetColor(D, T);
         c.push({
-          name: A.name,
-          color: S,
+          name: D.name,
+          color: A,
           x: 0,
           // Will be calculated
           textX: 0,
@@ -8584,37 +8619,37 @@ const K = class K extends HTMLElement {
         });
       });
     let h = 0;
-    const p = [];
-    c.forEach((A) => {
-      const N = Math.min(A.name.length * 7.5, l), S = r * 2 + a + N;
-      p[h] || (p[h] = []), p[h].reduce((I, x) => {
-        const L = Math.min(x.name.length * 7.5, l);
-        return I + (r * 2 + a + L) + s;
-      }, 0) + S > o && p[h].length > 0 && (h++, p[h] = []), A.row = h, p[h].push(A);
-    }), p.forEach((A) => {
-      const N = A.reduce((I, x) => {
-        const L = Math.min(x.name.length * 7.5, l);
-        return I + (r * 2 + a + L);
-      }, 0) + (A.length - 1) * s;
-      let M = (this._width - N) / 2;
-      A.forEach((I) => {
-        const x = Math.min(I.name.length * 7.5, l);
-        I.x = M, I.textX = M + r + a, M += r * 2 + a + x + s;
+    const f = [];
+    c.forEach((D) => {
+      const T = Math.min(D.name.length * 7.5, l), A = r * 2 + a + T;
+      f[h] || (f[h] = []), f[h].reduce((N, k) => {
+        const L = Math.min(k.name.length * 7.5, l);
+        return N + (r * 2 + a + L) + s;
+      }, 0) + A > o && f[h].length > 0 && (h++, f[h] = []), D.row = h, f[h].push(D);
+    }), f.forEach((D) => {
+      const T = D.reduce((N, k) => {
+        const L = Math.min(k.name.length * 7.5, l);
+        return N + (r * 2 + a + L);
+      }, 0) + (D.length - 1) * s;
+      let H = (this._width - T) / 2;
+      D.forEach((N) => {
+        const k = Math.min(N.name.length * 7.5, l);
+        N.x = H, N.textX = H + r + a, H += r * 2 + a + k + s;
       });
     });
     const d = Math.max(r * 2, 16);
-    p.length * (n + d);
-    const u = this._getChartBounds(), f = this._rotatedLabelHeight > 0 ? 30 : 20, _ = 12, g = f + this._rotatedLabelHeight + _;
+    f.length * (n + d);
+    const p = this._getChartBounds(), u = this._rotatedLabelHeight > 0 ? 30 : 20, _ = 12, g = u + this._rotatedLabelHeight + _;
     let m = g;
     this._showLegend && (m = g + 20 + Math.max(this._legendHeight, 60));
-    const v = this._height - u.y - u.height, b = m > 0 ? v / m : 1, k = (this._rotatedLabelHeight > 0 ? 30 : 20) * b, w = _ * b, E = this._rotatedLabelHeight * b, C = u.y + u.height + k + (this._rotatedLabelHeight > 0 ? E : w), D = 20 * b, $ = C + D;
-    return c.forEach((A) => {
-      const S = $ + A.row * (n + d) + d / 2, M = document.createElementNS("http://www.w3.org/2000/svg", "circle");
-      M.setAttribute("cx", A.x.toString()), M.setAttribute("cy", S.toString()), M.setAttribute("r", r.toString()), M.setAttribute("fill", A.color), e.appendChild(M);
-      const I = document.createElementNS("http://www.w3.org/2000/svg", "foreignObject");
-      I.setAttribute("x", A.textX.toString()), I.setAttribute("y", (S - 12).toString()), I.setAttribute("width", l.toString()), I.setAttribute("height", "24");
-      const x = document.createElement("div");
-      x.style.cssText = `
+    const v = this._height - p.y - p.height, b = m > 0 ? v / m : 1, y = (this._rotatedLabelHeight > 0 ? 30 : 20) * b, C = _ * b, E = this._rotatedLabelHeight * b, S = p.y + p.height + y + (this._rotatedLabelHeight > 0 ? E : C), w = 20 * b, $ = S + w;
+    return c.forEach((D) => {
+      const A = $ + D.row * (n + d) + d / 2, H = document.createElementNS("http://www.w3.org/2000/svg", "circle");
+      H.setAttribute("cx", D.x.toString()), H.setAttribute("cy", A.toString()), H.setAttribute("r", r.toString()), H.setAttribute("fill", D.color), e.appendChild(H);
+      const N = document.createElementNS("http://www.w3.org/2000/svg", "foreignObject");
+      N.setAttribute("x", D.textX.toString()), N.setAttribute("y", (A - 12).toString()), N.setAttribute("width", l.toString()), N.setAttribute("height", "24");
+      const k = document.createElement("div");
+      k.style.cssText = `
         font-size: 12px;
         font-family: system-ui, -apple-system, sans-serif;
         color: ${document.documentElement.classList.contains("dark") ? "#d1d5db" : "#374151"};
@@ -8626,7 +8661,7 @@ const K = class K extends HTMLElement {
         display: flex;
         align-items: center;
         height: 100%;
-      `, x.textContent = A.name, I.appendChild(x), e.appendChild(I);
+      `, k.textContent = D.name, N.appendChild(k), e.appendChild(N);
     }), this._svg.appendChild(e), { height: this._legendHeight + 50 };
   }
   /**
@@ -8634,46 +8669,41 @@ const K = class K extends HTMLElement {
    * @param datasetIndex - Index of the dataset (0-based)
    * @param point - The data point to add { x: string | number, y: number, color?: string }
    */
-  addDataPoint(t, e) {
-    if (!this._chartData || !this._chartData.datasets[t]) {
-      console.error(`Dataset at index ${t} does not exist`);
-      return;
-    }
-    this._chartData.datasets[t].data.push(e), this.render();
+  async addDataPoint(t, e) {
+    return !this._chartData || !this._chartData.datasets[t] ? (console.error(`Dataset at index ${t} does not exist`), Promise.reject(new Error(`Dataset at index ${t} does not exist`))) : (this._chartData.datasets[t].data.push(e), this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender(), new Promise((i) => requestAnimationFrame(() => i())));
+  }
+  /**
+   * Batch add data points to multiple datasets at once (optimized for performance)
+   * @param updates - Array of { datasetIndex, point } objects
+   */
+  async batchAddDataPoints(t) {
+    if (!this._chartData) return Promise.resolve();
+    let e = !1;
+    for (const { datasetIndex: i, point: s } of t)
+      this._chartData.datasets[i] && (this._chartData.datasets[i].data.push(s), e = !0);
+    return e && (this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender()), new Promise((i) => requestAnimationFrame(() => i()));
   }
   /**
    * Update the entire dataset data array
    * @param datasetIndex - Index of the dataset (0-based)
    * @param data - Array of data points to replace the existing data
    */
-  updateDatasetData(t, e) {
-    if (!this._chartData || !this._chartData.datasets[t]) {
-      console.error(`Dataset at index ${t} does not exist`);
-      return;
-    }
-    this._chartData.datasets[t].data = e, this.render();
+  async updateDatasetData(t, e) {
+    return !this._chartData || !this._chartData.datasets[t] ? (console.error(`Dataset at index ${t} does not exist`), Promise.reject(new Error(`Dataset at index ${t} does not exist`))) : (this._chartData.datasets[t].data = e, this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender(), new Promise((i) => requestAnimationFrame(() => i())));
   }
   /**
    * Add a new dataset to the chart
    * @param dataset - The dataset to add
    */
-  addDataset(t) {
-    if (!this._chartData) {
-      console.error("Chart data not initialized");
-      return;
-    }
-    this._chartData.datasets.push(t), this.render();
+  async addDataset(t) {
+    return this._chartData ? (this._chartData.datasets.push(t), t.id && this._datasetVisibility.set(t.id, t.visible !== !1), this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender(), new Promise((e) => requestAnimationFrame(() => e()))) : (console.error("Chart data not initialized"), Promise.reject(new Error("Chart data not initialized")));
   }
   /**
    * Remove a dataset from the chart
    * @param datasetIndex - Index of the dataset to remove (0-based)
    */
-  removeDataset(t) {
-    if (!this._chartData || !this._chartData.datasets[t]) {
-      console.error(`Dataset at index ${t} does not exist`);
-      return;
-    }
-    this._chartData.datasets.splice(t, 1), this.render();
+  async removeDataset(t) {
+    return !this._chartData || !this._chartData.datasets[t] ? (console.error(`Dataset at index ${t} does not exist`), Promise.reject(new Error(`Dataset at index ${t} does not exist`))) : (this._chartData.datasets.splice(t, 1), this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender(), new Promise((e) => requestAnimationFrame(() => e())));
   }
   /**
    * Update an existing data point in a dataset
@@ -8681,77 +8711,122 @@ const K = class K extends HTMLElement {
    * @param pointIndex - Index of the point to update (0-based)
    * @param point - The updated data point
    */
-  updateDataPoint(t, e, i) {
-    if (!this._chartData || !this._chartData.datasets[t]) {
-      console.error(`Dataset at index ${t} does not exist`);
-      return;
-    }
-    if (!this._chartData.datasets[t].data[e]) {
-      console.error(`Data point at index ${e} does not exist`);
-      return;
-    }
-    this._chartData.datasets[t].data[e] = i, this.render();
+  async updateDataPoint(t, e, i) {
+    return !this._chartData || !this._chartData.datasets[t] ? (console.error(`Dataset at index ${t} does not exist`), Promise.reject(new Error(`Dataset at index ${t} does not exist`))) : this._chartData.datasets[t].data[e] ? (this._chartData.datasets[t].data[e] = i, this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender(), new Promise((s) => requestAnimationFrame(() => s()))) : (console.error(`Data point at index ${e} does not exist`), Promise.reject(new Error(`Data point at index ${e} does not exist`)));
+  }
+  /**
+   * Batch update data points in multiple datasets at once (optimized for performance)
+   * @param updates - Array of { datasetIndex, pointIndex, point } objects
+   */
+  async batchUpdateDataPoints(t) {
+    var i;
+    if (!this._chartData) return Promise.resolve();
+    let e = !1;
+    for (const { datasetIndex: s, pointIndex: n, point: r } of t)
+      (i = this._chartData.datasets[s]) != null && i.data[n] && (this._chartData.datasets[s].data[n] = r, e = !0);
+    return e && (this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender()), new Promise((s) => requestAnimationFrame(() => s()));
   }
   /**
    * Remove a data point from a dataset
    * @param datasetIndex - Index of the dataset (0-based)
    * @param pointIndex - Index of the point to remove (0-based)
    */
-  removeDataPoint(t, e) {
-    if (!this._chartData || !this._chartData.datasets[t]) {
-      console.error(`Dataset at index ${t} does not exist`);
-      return;
-    }
-    this._chartData.datasets[t].data.splice(e, 1), this.render();
+  async removeDataPoint(t, e) {
+    return !this._chartData || !this._chartData.datasets[t] ? (console.error(`Dataset at index ${t} does not exist`), Promise.reject(new Error(`Dataset at index ${t} does not exist`))) : (this._chartData.datasets[t].data.splice(e, 1), this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender(), new Promise((i) => requestAnimationFrame(() => i())));
+  }
+  /**
+   * Batch remove data points from multiple datasets at once (optimized for performance)
+   * @param updates - Array of { datasetIndex, pointIndex } objects
+   */
+  async batchRemoveDataPoints(t) {
+    var i;
+    if (!this._chartData) return Promise.resolve();
+    let e = !1;
+    for (const { datasetIndex: s, pointIndex: n } of t)
+      (i = this._chartData.datasets[s]) != null && i.data[n] && (this._chartData.datasets[s].data.splice(n, 1), e = !0);
+    return e && (this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender()), new Promise((s) => requestAnimationFrame(() => s()));
+  }
+  /**
+   * Show a dataset by ID
+   * @param datasetId - The ID of the dataset to show
+   */
+  async showDataset(t) {
+    return this._datasetVisibility.set(t, !0), this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender(), new Promise((e) => requestAnimationFrame(() => e()));
+  }
+  /**
+   * Hide a dataset by ID
+   * @param datasetId - The ID of the dataset to hide
+   */
+  async hideDataset(t) {
+    return this._datasetVisibility.set(t, !1), this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender(), new Promise((e) => requestAnimationFrame(() => e()));
+  }
+  /**
+   * Toggle dataset visibility by ID
+   * @param datasetId - The ID of the dataset to toggle
+   * @returns The new visibility state (true if visible, false if hidden)
+   */
+  async toggleDataset(t) {
+    const i = !(this._datasetVisibility.get(t) ?? !0);
+    return this._datasetVisibility.set(t, i), this._cachedBounds.dataHash = "", this._cachedYRange.dataHash = "", this._cachedXValues.dataHash = "", this._cachedTooltipContent.clear(), this._scheduleRender(), await new Promise((s) => requestAnimationFrame(() => s())), i;
+  }
+  /**
+   * Get the visibility state of a dataset by ID
+   * @param datasetId - The ID of the dataset
+   * @returns true if visible, false if hidden, or undefined if dataset not found
+   */
+  isDatasetVisible(t) {
+    return this._datasetVisibility.get(t);
   }
   /**
    * Download the chart as a PNG image
    * @param filename - Optional filename (defaults to 'chart.png')
    */
-  downloadAsPNG(t = "chart.png") {
-    if (!this._svg) {
-      console.error("Chart SVG not found");
-      return;
-    }
+  async downloadAsPNG(t = "chart.png") {
+    if (!this._svg)
+      return console.error("Chart SVG not found"), Promise.reject(new Error("Chart SVG not found"));
     const e = this._svg.cloneNode(!0), i = this._width, s = this._height, n = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif';
     e.querySelectorAll("text").forEach((h) => {
-      const p = h.getAttribute("font-family");
-      (!p || p.includes("system-ui") || p.includes("apple-system")) && h.setAttribute("font-family", n);
+      const f = h.getAttribute("font-family");
+      (!f || f.includes("system-ui") || f.includes("apple-system")) && h.setAttribute("font-family", n);
     }), e.setAttribute("width", i.toString()), e.setAttribute("height", s.toString()), e.setAttribute("xmlns", "http://www.w3.org/2000/svg"), e.querySelectorAll("foreignObject").forEach((h) => {
-      const p = h.querySelector("div");
-      if (p) {
-        const d = document.createElementNS("http://www.w3.org/2000/svg", "text"), u = h.getAttribute("x") || "0", f = h.getAttribute("y") || "0";
-        d.setAttribute("x", u), d.setAttribute("y", (parseFloat(f) + 12).toString()), d.setAttribute("fill", p.style.color || "#374151"), d.setAttribute("font-size", "12"), d.setAttribute("font-family", p.style.fontFamily || "system-ui, -apple-system, sans-serif"), d.textContent = p.textContent || "", h.parentNode && h.parentNode.replaceChild(d, h);
+      const f = h.querySelector("div");
+      if (f) {
+        const d = document.createElementNS("http://www.w3.org/2000/svg", "text"), p = h.getAttribute("x") || "0", u = h.getAttribute("y") || "0";
+        d.setAttribute("x", p), d.setAttribute("y", (parseFloat(u) + 12).toString()), d.setAttribute("fill", f.style.color || "#374151"), d.setAttribute("font-size", "12"), d.setAttribute("font-family", f.style.fontFamily || "system-ui, -apple-system, sans-serif"), d.textContent = f.textContent || "", h.parentNode && h.parentNode.replaceChild(d, h);
       }
     });
     const l = new XMLSerializer().serializeToString(e), o = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(l), c = new Image();
-    c.crossOrigin = "anonymous", c.onload = () => {
-      const p = document.createElement("canvas");
-      p.width = i + 30 * 2, p.height = s + 30 * 2;
-      const d = p.getContext("2d");
-      if (!d) {
-        console.error("Could not get canvas context");
-        return;
-      }
-      const u = document.documentElement.classList.contains("dark");
-      d.fillStyle = u ? "#111827" : "#ffffff", d.fillRect(0, 0, p.width, p.height), d.drawImage(c, 30, 30), p.toBlob((f) => {
-        if (!f) {
-          console.error("Could not create blob from canvas");
-          return;
-        }
-        const _ = URL.createObjectURL(f), g = document.createElement("a");
-        g.href = _, g.download = t, document.body.appendChild(g), g.click(), document.body.removeChild(g), URL.revokeObjectURL(_);
-      }, "image/png");
-    }, c.onerror = () => {
-      console.error("Error loading SVG image");
-    }, c.src = o;
+    return c.crossOrigin = "anonymous", new Promise((h, f) => {
+      c.onload = () => {
+        setTimeout(() => {
+          const p = document.createElement("canvas");
+          p.width = i + 30 * 2, p.height = s + 30 * 2;
+          const u = p.getContext("2d");
+          if (!u) {
+            console.error("Could not get canvas context"), f(new Error("Could not get canvas context"));
+            return;
+          }
+          const _ = document.documentElement.classList.contains("dark");
+          u.fillStyle = _ ? "#111827" : "#ffffff", u.fillRect(0, 0, p.width, p.height), u.drawImage(c, 30, 30), p.toBlob((g) => {
+            if (!g) {
+              console.error("Could not create blob from canvas"), f(new Error("Could not create blob from canvas"));
+              return;
+            }
+            const m = URL.createObjectURL(g), v = document.createElement("a");
+            v.href = m, v.download = t, document.body.appendChild(v), v.click(), document.body.removeChild(v), URL.revokeObjectURL(m), h();
+          }, "image/png");
+        }, 0);
+      }, c.onerror = () => {
+        console.error("Error loading SVG image"), f(new Error("Error loading SVG image"));
+      }, c.src = o;
+    });
   }
 };
 K.MAX_CACHE_SIZE = 100;
 let tt = K;
 customElements.get("mint-chart") || customElements.define("mint-chart", tt);
 export {
-  Lt as Alert,
+  Dt as Alert,
   dt as BackButton,
   Q as Button,
   ct as Card,
@@ -8771,7 +8846,7 @@ export {
   Tt as OffCanvas,
   ut as Page,
   gt as Popover,
-  Dt as ResourceTable,
+  Lt as ResourceTable,
   kt as Select,
   rt as Spinner,
   lt as Stack,