@moondreamsdev/dreamer-ui 1.7.7-test.7 → 1.7.7-test.8

package/dist/components.esm.js

@@ -1,29 +1,29 @@
-import { jsxs as E, jsx as c, Fragment as W } from "react/jsx-runtime";
-import z, { useId as $, useState as x, createElement as Y, useEffect as A, useCallback as I, useMemo as U, useRef as R, isValidElement as ee, cloneElement as te } from "react";
+import { jsxs as E, jsx as d, Fragment as W } from "react/jsx-runtime";
+import z, { useId as $, useState as x, createElement as P, useEffect as A, useCallback as I, useMemo as _, useRef as R, isValidElement as te, cloneElement as re } from "react";
 import { join as y } from "./utils.esm.js";
-import { b as re, C as ne, a as oe, c as ae, E as se, Q as ie } from "./QuestionMarkCircled-BVBF3skB.js";
-import { n as k } from "./Toast-DfNdN3Lk.js";
-import { A as at, T as st } from "./Toast-DfNdN3Lk.js";
-import { E as le, X as P } from "./X-CIoyLewf.js";
-import { createPortal as _ } from "react-dom";
-function q({
-  id: o,
+import { b as ne, C as oe, a as ae, c as se, E as ie, Q as le } from "./QuestionMarkCircled-BVBF3skB.js";
+import { n as D } from "./Toast-COzsZuCT.js";
+import { A as it, T as lt } from "./Toast-COzsZuCT.js";
+import { E as de, X as O } from "./X-CIoyLewf.js";
+import { createPortal as U } from "react-dom";
+function H({
+  id: n,
   title: a,
   content: t,
   children: r,
   className: e = "",
-  disabled: n = !1,
+  disabled: o = !1,
   isOpen: s = !1,
   onToggle: l,
   triggerClassName: u = "",
-  bodyClassName: d = ""
+  bodyClassName: c = ""
 }) {
-  const b = $(), i = o || `accordion-item-${b}`, v = `${i}-header`, f = `${i}-panel`, m = () => {
-    !n && l && l();
+  const b = $(), i = n || `accordion-item-${b}`, v = `${i}-header`, f = `${i}-panel`, m = () => {
+    !o && l && l();
   }, g = (h) => {
     (h.key === "Enter" || h.key === " ") && (h.preventDefault(), m());
   };
-  return /* @__PURE__ */ E("div", { className: y("border-b border-gray-200", n && "opacity-60 cursor-not-allowed", e), children: [
+  return /* @__PURE__ */ E("div", { className: y("border-b border-gray-200", o && "opacity-60 cursor-not-allowed", e), children: [
     /* @__PURE__ */ E(
       "button",
       {
@@ -31,17 +31,17 @@ function q({
         type: "button",
         className: y(
           "w-full text-left py-3 px-4 flex justify-between items-center focus:outline focus:outline-secondary",
-          n ? "cursor-not-allowed" : "hover:bg-gray-50/10 cursor-pointer",
+          o ? "cursor-not-allowed" : "hover:bg-gray-50/10 cursor-pointer",
           u
         ),
         "aria-expanded": s,
         "aria-controls": f,
-        disabled: n,
+        disabled: o,
         onClick: m,
         onKeyDown: g,
         children: [
-          /* @__PURE__ */ c("span", { children: a }),
-          /* @__PURE__ */ c(
+          /* @__PURE__ */ d("span", { children: a }),
+          /* @__PURE__ */ d(
             "span",
             {
               className: y(
@@ -49,13 +49,13 @@ function q({
                 s ? "rotate-180" : "rotate-0"
               ),
               "aria-hidden": "true",
-              children: /* @__PURE__ */ c(re, { size: 18 })
+              children: /* @__PURE__ */ d(ne, { size: 18 })
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ c(
+    /* @__PURE__ */ d(
       "div",
       {
         id: f,
@@ -64,7 +64,7 @@ function q({
         className: y(
           "transition-all duration-300 ease-linear px-4",
           s ? "max-h-96 opacity-100 overflow-auto py-3" : "max-h-0 opacity-0 overflow-hidden",
-          d
+          c
         ),
         children: s && (r || t)
       }
@@ -72,27 +72,27 @@ function q({
   ] });
 }
 function Ue({
-  id: o,
+  id: n,
   items: a = [],
   children: t,
   className: r = "",
   itemClassName: e = "",
-  allowMultiple: n = !1,
+  allowMultiple: o = !1,
   defaultOpenItems: s = [],
   triggersClassName: l = "",
   bodiesClassName: u = ""
 }) {
-  const d = $(), b = o || `accordion-group-${d}`, [i, v] = x(new Set(s)), f = (h) => {
+  const c = $(), b = n || `accordion-group-${c}`, [i, v] = x(new Set(s)), f = (h) => {
     v((w) => {
       const p = new Set(w);
-      return p.has(h) ? p.delete(h) : (n || p.clear(), p.add(h)), p;
+      return p.has(h) ? p.delete(h) : (o || p.clear(), p.add(h)), p;
     });
-  }, m = (h) => `${d}-item-${h}`, g = (h) => i.has(h);
+  }, m = (h) => `${c}-item-${h}`, g = (h) => i.has(h);
   return /* @__PURE__ */ E("div", { id: b, className: r, children: [
     a.length > 0 && a.map((h, w) => {
       const p = h.id || m(w);
-      return /* @__PURE__ */ c(
-        q,
+      return /* @__PURE__ */ d(
+        H,
         {
           id: p,
           title: h.title,
@@ -108,10 +108,10 @@ function Ue({
       );
     }),
     a.length === 0 && t && z.Children.map(t, (h, w) => {
-      if (z.isValidElement(h) && h.type === q) {
+      if (z.isValidElement(h) && h.type === H) {
         const p = h.props.id || m(w);
-        return /* @__PURE__ */ Y(
-          q,
+        return /* @__PURE__ */ P(
+          H,
           {
             ...h.props,
             key: p,
@@ -129,24 +129,24 @@ function Ue({
   ] });
 }
 function ce() {
-  const [o, a] = x(0);
+  const [n, a] = x(0);
   return A(() => {
     const t = setInterval(() => {
       a((r) => (r + 1) % 3);
     }, 500);
     return () => clearInterval(t);
-  }, []), /* @__PURE__ */ c("div", { className: "absolute inset-0 inline-flex items-center justify-center gap-x-2 align-middle", children: [0, 1, 2].map((t) => /* @__PURE__ */ c(
+  }, []), /* @__PURE__ */ d("div", { className: "absolute inset-0 inline-flex items-center justify-center gap-x-2 align-middle", children: [0, 1, 2].map((t) => /* @__PURE__ */ d(
     "div",
     {
       className: y(
         "rounded-full transition-all duration-500 ease-in-out size-[0.35em] bg-current",
-        o === t && "transform -translate-y-1"
+        n === t && "transform -translate-y-1"
       )
     },
     t
   )) });
 }
-const de = {
+const ue = {
   base: "",
   primary: "bg-primary text-primary-foreground hover:bg-primary/85 disabled:bg-muted disabled:text-muted-foreground",
   secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/85 disabled:bg-muted/80 disabled:text-muted-foreground/80",
@@ -154,7 +154,7 @@ const de = {
   outline: "border border-primary text-primary hover:border-primary-foreground hover:text-primary-foreground disabled:border-muted disabled:text-muted",
   link: "underline-offset-4 hover:underline disabled:underline disabled:text-muted",
   destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/85 disabled:bg-muted disabled:text-muted-foreground"
-}, ue = {
+}, fe = {
   stripped: "",
   fitted: "size-fit",
   sm: "px-2 py-1 text-sm",
@@ -162,7 +162,7 @@ const de = {
   lg: "px-6 py-3 text-lg",
   icon: "p-1 w-fit aspect-square",
   full: "p-2 w-full"
-}, fe = {
+}, me = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
@@ -173,24 +173,24 @@ const de = {
   size: "md",
   rounded: "md"
 };
-function me({
-  variant: o = K.variant,
+function be({
+  variant: n = K.variant,
   size: a,
   rounded: t = K.rounded,
   loading: r,
   linkTo: e,
-  linkProps: n,
+  linkProps: o,
   type: s = "button",
   className: l,
   ...u
 }) {
-  let d;
-  o === "link" && !a ? d = "fitted" : d = a || K.size;
+  let c;
+  n === "link" && !a ? c = "fitted" : c = a || K.size;
   const i = y(
     "appearance-none focus:outline-none focus:ring not-disabled:hover:cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed transition-all",
-    de[o],
-    ue[d],
-    fe[t],
+    ue[n],
+    fe[c],
+    me[t],
     r && "relative pointer-events-none",
     e && "relative",
     l
@@ -200,22 +200,22 @@ function me({
     {
       ...u,
       role: e ? "link" : u.role,
-      "aria-label": u["aria-label"] || (n == null ? void 0 : n["aria-label"]),
-      "aria-description": u["aria-description"] || (n == null ? void 0 : n["aria-description"]),
+      "aria-label": u["aria-label"] || (o == null ? void 0 : o["aria-label"]),
+      "aria-description": u["aria-description"] || (o == null ? void 0 : o["aria-description"]),
       "aria-disabled": u.disabled || r,
       "aria-busy": r,
       type: s,
       className: i,
       children: [
-        r && /* @__PURE__ */ c(ce, {}),
-        /* @__PURE__ */ c("span", { className: y(r && "invisible"), children: u.children }),
-        e && !u.disabled && /* @__PURE__ */ c(
+        r && /* @__PURE__ */ d(ce, {}),
+        /* @__PURE__ */ d("span", { className: y(r && "invisible"), children: u.children }),
+        e && !u.disabled && /* @__PURE__ */ d(
           "a",
           {
-            ...n,
+            ...o,
             "aria-hidden": !0,
             href: e,
-            rel: (n == null ? void 0 : n.rel) || "noreferrer",
+            rel: (o == null ? void 0 : o.rel) || "noreferrer",
             className: "absolute inset-0"
           }
         )
@@ -223,37 +223,37 @@ function me({
     }
   );
 }
-function be(o) {
+function he(n) {
   const [a, t] = x(""), r = I((e) => {
-    let n = e, s = "";
-    for (; n && !s; ) {
-      const l = window.getComputedStyle(n).backgroundColor;
-      l && l !== "transparent" && l !== "rgba(0, 0, 0, 0)" && (s = l), n = n.parentElement;
+    let o = e, s = "";
+    for (; o && !s; ) {
+      const l = window.getComputedStyle(o).backgroundColor;
+      l && l !== "transparent" && l !== "rgba(0, 0, 0, 0)" && (s = l), o = o.parentElement;
     }
     return s || "transparent";
   }, []);
   return A(() => {
-    const e = document.getElementById(o);
+    const e = document.getElementById(n);
     if (e) {
-      const n = r(e.parentElement);
-      t(n);
+      const o = r(e.parentElement);
+      t(o);
     }
-  }, [o, r]), a;
+  }, [n, r]), a;
 }
-function _e({
-  ref: o,
+function Qe({
+  ref: n,
   id: a,
   size: t = 20,
   color: r,
   filled: e = !1,
-  rounded: n = !0,
+  rounded: o = !0,
   checked: s = !1,
   onCheckedChange: l,
   disabled: u,
-  className: d = "",
+  className: c = "",
   ...b
 }) {
-  const i = $(), v = U(() => a || `checkbox-${i}`, [a, i]), f = be(v), [m, g] = x(s);
+  const i = $(), v = _(() => a || `checkbox-${i}`, [a, i]), f = he(v), [m, g] = x(s);
   A(() => {
     g(s);
   }, [s]);
@@ -263,17 +263,17 @@ function _e({
     N.key === " " && (N.preventDefault(), h());
   }, p = y(
     "flex items-center justify-center border outline outline-transparent focus:outline-current focus:outline-offset-2",
-    n && "rounded",
+    o && "rounded",
     u && "opacity-40 cursor-not-allowed",
     !u && "cursor-pointer",
-    d
+    c
   );
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ d(
     "button",
     {
       id: v,
       type: "button",
-      ref: o,
+      ref: n,
       tabIndex: 0,
       role: "checkbox",
       onClick: h,
@@ -288,22 +288,22 @@ function _e({
       },
       className: p,
       ...b,
-      children: m && /* @__PURE__ */ c(ne, { size: t, color: e ? f : void 0 })
+      children: m && /* @__PURE__ */ d(oe, { size: t, color: e ? f : void 0 })
     }
   );
 }
-function Qe({
-  children: o,
+function Me({
+  children: n,
   className: a,
   linkTo: t,
   linkProps: r,
   onButtonClick: e,
-  buttonProps: n,
+  buttonProps: o,
   ...s
 }) {
   return t && e && console.warn('Clickable: Both "linkTo" and "onButtonClick" props are provided. Only "linkTo" will be used.'), /* @__PURE__ */ E("div", { className: y("relative w-fit", a), ...s, children: [
-    o,
-    t && /* @__PURE__ */ c(
+    n,
+    t && /* @__PURE__ */ d(
       "a",
       {
         ...r,
@@ -312,20 +312,20 @@ function Qe({
         className: y("absolute inset-0", r == null ? void 0 : r.className)
       }
     ),
-    !t && e && /* @__PURE__ */ c(
+    !t && e && /* @__PURE__ */ d(
       "button",
       {
-        ...n,
+        ...o,
         type: "button",
         onClick: e,
-        className: y("absolute inset-0 cursor-pointer", n == null ? void 0 : n.className)
+        className: y("absolute inset-0 cursor-pointer", o == null ? void 0 : o.className)
       }
     )
   ] });
 }
-function V({ elementId: o, type: a, message: t }) {
+function V({ elementId: n, type: a, message: t }) {
   return A(() => {
-    const r = document.getElementById(o);
+    const r = document.getElementById(n);
     if (r) {
       if (!t && a === "error") {
         r.removeAttribute("data-error");
@@ -335,11 +335,11 @@ function V({ elementId: o, type: a, message: t }) {
         r.removeAttribute("data-success");
         return;
       }
-      return r.setAttribute("aria-describedby", `${o}-${a}-message`), r.setAttribute("aria-invalid", a === "error" ? "true" : "false"), a === "error" && r.setAttribute("data-error", "true"), a === "success" && r.setAttribute("data-success", "true"), () => {
+      return r.setAttribute("aria-describedby", `${n}-${a}-message`), r.setAttribute("aria-invalid", a === "error" ? "true" : "false"), a === "error" && r.setAttribute("data-error", "true"), a === "success" && r.setAttribute("data-success", "true"), () => {
         r.removeAttribute("aria-describedby"), r.removeAttribute("aria-invalid"), r.removeAttribute("data-error"), r.removeAttribute("data-success");
       };
     }
-  }, [o, a, t]), t ? /* @__PURE__ */ E(
+  }, [n, a, t]), t ? /* @__PURE__ */ E(
     "small",
     {
       className: y(
@@ -349,18 +349,18 @@ function V({ elementId: o, type: a, message: t }) {
       ),
       role: "status",
       children: [
-        a === "error" ? /* @__PURE__ */ c(le, {}) : /* @__PURE__ */ c(oe, {}),
-        /* @__PURE__ */ c("span", { id: `${o}-${a}-message`, children: t })
+        a === "error" ? /* @__PURE__ */ d(de, {}) : /* @__PURE__ */ d(ae, {}),
+        /* @__PURE__ */ d("span", { id: `${n}-${a}-message`, children: t })
       ]
     }
   ) : null;
 }
-const he = {
+const pe = {
   base: "",
   default: "ring ring-transparent focus:ring-primary-foreground not-disabled:data-error:ring-destructive not-disabled:data-success:ring-success",
   underline: "border-b border-border focus:border-primary-foreground disabled:border-muted/30 not-disabled:data-error:border-destructive not-disabled:data-success:border-success",
   outline: "border border-border focus:border-primary-foreground disabled:border-muted/30 not-disabled:data-error:border-destructive not-disabled:data-success:border-success"
-}, pe = {
+}, ge = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
@@ -370,37 +370,37 @@ const he = {
   variant: "default",
   rounded: "none"
 };
-function Me({
-  variant: o = X.variant,
+function Xe({
+  variant: n = X.variant,
   rounded: a,
   displayOnlyMode: t = !1,
   errorMessage: r,
   successMessage: e,
-  type: n = "text",
+  type: o = "text",
   className: s,
   ...l
 }) {
-  const u = $(), [d, b] = x(!1);
+  const u = $(), [c, b] = x(!1);
   let i = a;
-  o === "outline" && !a && (i = "md"), i = i || X.rounded;
+  n === "outline" && !a && (i = "md"), i = i || X.rounded;
   const m = y(
     "appearance-none w-full focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed placeholder:text-muted/70 hide-number-input-arrows transition-all",
     "file:mr-2 file:border-0 file:rounded-md file:px-1.5 file:py-1 file:bg-primary hover:file:bg-primary/85 file:text-sm file:font-medium file:text-foreground file:transition-colors",
-    !t && he[o],
-    !t && pe[i],
-    n === "password" && "pr-10",
+    !t && pe[n],
+    !t && ge[i],
+    o === "password" && "pr-10",
     !t && "px-2 py-1",
     t && "pointer-events-none",
     s
   );
   return /* @__PURE__ */ E("div", { className: y(t && "cursor-text"), style: { height: l.height, width: l.width }, children: [
-    /* @__PURE__ */ E("div", { className: y(n === "password" && "relative"), children: [
-      /* @__PURE__ */ c(
+    /* @__PURE__ */ E("div", { className: y(o === "password" && "relative"), children: [
+      /* @__PURE__ */ d(
         "input",
         {
           ...l,
           id: u,
-          type: n === "password" && d ? "text" : n,
+          type: o === "password" && c ? "text" : o,
           "aria-disabled": l.disabled,
           readOnly: t,
           "aria-readonly": t || l["aria-readonly"],
@@ -409,75 +409,75 @@ function Me({
           className: m
         }
       ),
-      n === "password" && /* @__PURE__ */ c(
+      o === "password" && /* @__PURE__ */ d(
         "button",
         {
-          onClick: () => b(!d),
+          onClick: () => b(!c),
           className: "absolute inset-y-0 right-0 px-2 hover:cursor-pointer",
           "aria-label": "Toggle password visibility",
-          "data-state": d ? "visible" : "hidden",
-          children: d ? /* @__PURE__ */ c(ae, { size: 20 }) : /* @__PURE__ */ c(se, { size: 20 })
+          "data-state": c ? "visible" : "hidden",
+          children: c ? /* @__PURE__ */ d(se, { size: 20 }) : /* @__PURE__ */ d(ie, { size: 20 })
         }
       )
     ] }),
-    !t && /* @__PURE__ */ c(V, { elementId: u, type: "error", message: r }),
-    !t && /* @__PURE__ */ c(V, { elementId: u, type: "success", message: e })
+    !t && /* @__PURE__ */ d(V, { elementId: u, type: "error", message: r }),
+    !t && /* @__PURE__ */ d(V, { elementId: u, type: "success", message: e })
   ] });
 }
-function Xe({
-  display: o = "inline",
+function Ze({
+  display: n = "inline",
   width: a = "fit-content",
   className: t = "",
   required: r,
   helpMessage: e,
-  suffix: n,
+  suffix: o,
   htmlFor: s,
   children: l,
   ...u
 }) {
-  const d = $(), b = y("font-medium", o, t), i = e ? `${s ?? d}-help` : void 0;
-  return /* @__PURE__ */ E("div", { style: { display: o === "inline" ? "inline-flex" : "flex", width: a }, className: "relative", children: [
+  const c = $(), b = y("font-medium", n, t), i = e ? `${s ?? c}-help` : void 0;
+  return /* @__PURE__ */ E("div", { style: { display: n === "inline" ? "inline-flex" : "flex", width: a }, className: "relative", children: [
     /* @__PURE__ */ E("label", { className: b, htmlFor: s, ...u, children: [
       l,
-      r && /* @__PURE__ */ c("span", { className: "text-red-500 font-medium ml-1", "aria-label": "required", children: "*" })
+      r && /* @__PURE__ */ d("span", { className: "text-red-500 font-medium ml-1", "aria-label": "required", children: "*" })
     ] }),
-    e && /* @__PURE__ */ c(
+    e && /* @__PURE__ */ d(
       "span",
       {
         className: "text-gray-500 ml-1 size-fit -translate-y-1/3",
         "aria-describedby": i,
         "aria-label": "Help information",
         title: e,
-        children: /* @__PURE__ */ c(ie, {})
+        children: /* @__PURE__ */ d(le, {})
       }
     ),
-    e && /* @__PURE__ */ c("div", { id: i, className: "sr-only", children: e }),
-    n && /* @__PURE__ */ c("span", { className: "ml-1", children: n })
+    e && /* @__PURE__ */ d("div", { id: i, className: "sr-only", children: e }),
+    o && /* @__PURE__ */ d("span", { className: "ml-1", children: o })
   ] });
 }
-function ge(o) {
+function ve(n) {
   const [a, t] = x(!1), [r, e] = x(!1);
   return A(() => {
-    o ? (e(!0), setTimeout(() => t(!0), 10)) : (t(!1), setTimeout(() => e(!1), 150));
-  }, [o]), { show: a, shouldRender: r };
+    n ? (e(!0), setTimeout(() => t(!0), 10)) : (t(!1), setTimeout(() => e(!1), 150));
+  }, [n]), { show: a, shouldRender: r };
 }
-function ve(o, a) {
+function ye(n, a) {
   A(() => {
     const t = (r) => {
-      r.key === "Escape" && o && a();
+      r.key === "Escape" && n && a();
     };
-    return document.addEventListener("keydown", t), o && (document.body.style.overflow = "hidden"), () => {
+    return document.addEventListener("keydown", t), n && (document.body.style.overflow = "hidden"), () => {
       document.removeEventListener("keydown", t), document.body.style.overflow = "auto";
     };
-  }, [o, a]);
+  }, [n, a]);
 }
-function we(o, a) {
+function we(n, a) {
   const t = R(null), r = I(() => {
-    const e = document.getElementById(o);
+    const e = document.getElementById(n);
     if (!e) return;
-    const n = e.querySelectorAll('[data-modal-action="true"]');
-    if (n.length > 0) {
-      n[0].focus();
+    const o = e.querySelectorAll('[data-modal-action="true"]');
+    if (o.length > 0) {
+      o[0].focus();
       return;
     }
     const s = e.querySelectorAll(
@@ -493,34 +493,34 @@ function we(o, a) {
       return;
     }
     e.focus();
-  }, [o]);
+  }, [n]);
   A(() => (a && (t.current = document.activeElement, r()), () => {
     document.body.style.overflow = "auto", t.current instanceof HTMLElement && t.current.focus();
   }), [a, r]);
 }
-function Ze({
-  id: o,
+function Je({
+  id: n,
   isOpen: a,
   onClose: t,
   title: r,
   children: e,
-  contentOnly: n = !1,
+  contentOnly: o = !1,
   className: s,
   overlayClassName: l,
   hideCloseButton: u = !1,
-  actions: d = [],
+  actions: c = [],
   disableCloseOnOverlayClick: b = !1,
   ariaLabelledBy: i,
   ariaDescribedBy: v
 }) {
-  const f = $(), m = o || `modal-${f}`, g = o ? `${o}-title` : `modal-title-${f}`, { show: h, shouldRender: w } = ge(a);
-  if (we(m, w), ve(w, t), !w) return null;
-  const p = () => r ? z.isValidElement(r) ? /* @__PURE__ */ c("div", { className: "mb-4", children: r }) : /* @__PURE__ */ c("h2", { className: "mb-4 text-xl font-semibold", id: g, children: r }) : null, N = () => d.length === 0 ? null : /* @__PURE__ */ c("div", { className: "mt-6 not-sm:grid gap-y-2 sm:flex sm:justify-start sm:flex-row-reverse sm:gap-x-3", children: d.map((D, C) => {
-    const { label: L, className: B, ...S } = D;
-    return /* @__PURE__ */ c(me, { className: B, type: "button", ...S, "data-modal-action": "true", children: L }, C);
+  const f = $(), m = n || `modal-${f}`, g = n ? `${n}-title` : `modal-title-${f}`, { show: h, shouldRender: w } = ve(a);
+  if (we(m, w), ye(w, t), !w) return null;
+  const p = () => r ? z.isValidElement(r) ? /* @__PURE__ */ d("div", { className: "mb-4", children: r }) : /* @__PURE__ */ d("h2", { className: "mb-4 text-xl font-semibold", id: g, children: r }) : null, N = () => c.length === 0 ? null : /* @__PURE__ */ d("div", { className: "mt-6 not-sm:grid gap-y-2 sm:flex sm:justify-start sm:flex-row-reverse sm:gap-x-3", children: c.map((k, C) => {
+    const { label: L, className: S, ...B } = k;
+    return /* @__PURE__ */ d(be, { className: S, type: "button", ...B, "data-modal-action": "true", children: L }, C);
   }) });
-  return /* @__PURE__ */ c(W, { children: _(
-    /* @__PURE__ */ c(
+  return /* @__PURE__ */ d(W, { children: U(
+    /* @__PURE__ */ d(
       "div",
       {
         "aria-labelledby": i ?? r ? g : void 0,
@@ -529,35 +529,35 @@ function Ze({
         "aria-modal": "true",
         className: "fixed inset-0 z-[100] overflow-y-auto",
         children: /* @__PURE__ */ E("div", { className: "flex min-h-screen items-center justify-center p-4", children: [
-          /* @__PURE__ */ c(
+          /* @__PURE__ */ d(
             "div",
             {
-              className: k("fixed inset-0 bg-black/20 transition-all", l),
+              className: D("fixed inset-0 bg-black/20 transition-all", l),
               onClick: () => {
                 b || t();
               }
             }
           ),
-          n && /* @__PURE__ */ c("div", { className: k("relative w-fit", s), children: e }),
-          !n && /* @__PURE__ */ E(
+          o && /* @__PURE__ */ d("div", { className: D("relative w-fit", s), children: e }),
+          !o && /* @__PURE__ */ E(
             "div",
             {
               id: m,
               tabIndex: -1,
-              className: k(
+              className: D(
                 "relative w-full max-w-xl transform rounded-lg shadow-xl bg-popover transition-all p-6 focus:ring ease-in duration-75",
                 h ? "opacity-100 scale-100" : "opacity-0 scale-90",
                 s
               ),
               children: [
-                !u && /* @__PURE__ */ c(
+                !u && /* @__PURE__ */ d(
                   "button",
                   {
                     type: "button",
                     onClick: t,
                     "data-modal-close-button": "true",
                     className: "rounded-md p-0.5 top-2.5 right-2.5 absolute opacity-80 hover:opacity-100 transition-opacity focus:outline-none focus:ring-2 focus:ring-gray-500 leading-0",
-                    children: /* @__PURE__ */ c(P, { size: 18 })
+                    children: /* @__PURE__ */ d(O, { size: 18 })
                   }
                 ),
                 p(),
@@ -572,29 +572,29 @@ function Ze({
     document.body
   ) });
 }
-function ye(o) {
+function xe(n) {
   const [a, t] = x(!1), [r, e] = x(!1);
   return A(() => {
-    o ? (e(!0), setTimeout(() => t(!0), 10)) : (t(!1), setTimeout(() => e(!1), 300));
-  }, [o]), { show: a, shouldRender: r };
+    n ? (e(!0), setTimeout(() => t(!0), 10)) : (t(!1), setTimeout(() => e(!1), 300));
+  }, [n]), { show: a, shouldRender: r };
 }
-function xe(o, a) {
+function Ee(n, a) {
   A(() => {
     const t = (r) => {
-      r.key === "Escape" && o && a();
+      r.key === "Escape" && n && a();
     };
-    return document.addEventListener("keydown", t), o && (document.body.style.overflow = "hidden"), () => {
+    return document.addEventListener("keydown", t), n && (document.body.style.overflow = "hidden"), () => {
       document.removeEventListener("keydown", t), document.body.style.overflow = "auto";
     };
-  }, [o, a]);
+  }, [n, a]);
 }
-function Ee(o, a) {
+function Ne(n, a) {
   const t = R(null), r = I(() => {
-    const e = document.getElementById(o);
+    const e = document.getElementById(n);
     if (!e) return;
-    const n = e.querySelectorAll('[data-panel-action="true"]');
-    if (n.length > 0) {
-      n[0].focus();
+    const o = e.querySelectorAll('[data-panel-action="true"]');
+    if (o.length > 0) {
+      o[0].focus();
       return;
     }
     const s = e.querySelectorAll(
@@ -610,12 +610,12 @@ function Ee(o, a) {
       return;
     }
     e.focus();
-  }, [o]);
+  }, [n]);
   A(() => (a && (t.current = document.activeElement, r()), () => {
     document.body.style.overflow = "auto", t.current instanceof HTMLElement && t.current.focus();
   }), [a, r]);
 }
-const Ne = {
+const Ae = {
   size: {
     sm: "max-w-sm",
     md: "max-w-md",
@@ -626,33 +626,33 @@ const Ne = {
     screen: "w-screen"
   }
 };
-function Je({
-  ref: o,
+function Ye({
+  ref: n,
   id: a,
   isOpen: t,
   onClose: r,
   title: e,
-  children: n,
+  children: o,
   footer: s,
   size: l = "md",
   className: u,
-  overlayClassName: d,
+  overlayClassName: c,
   hideCloseButton: b = !1,
   disableCloseOnOverlayClick: i = !1,
   ariaLabelledBy: v,
   ariaDescribedBy: f
 }) {
-  const m = $(), g = a || `panel-${m}`, h = a ? `${a}-title` : `panel-title-${m}`, { show: w, shouldRender: p } = ye(t);
-  if (Ee(g, p), xe(p, r), !p) return null;
-  const N = () => e ? z.isValidElement(e) ? /* @__PURE__ */ c("div", { children: e }) : /* @__PURE__ */ c("h2", { className: "text-2xl font-semibold", id: h, children: e }) : null, D = () => {
+  const m = $(), g = a || `panel-${m}`, h = a ? `${a}-title` : `panel-title-${m}`, { show: w, shouldRender: p } = xe(t);
+  if (Ne(g, p), Ee(p, r), !p) return null;
+  const N = () => e ? z.isValidElement(e) ? /* @__PURE__ */ d("div", { children: e }) : /* @__PURE__ */ d("h2", { className: "text-2xl font-semibold", id: h, children: e }) : null, k = () => {
     if (!s) return null;
     if (z.isValidElement(s)) {
       const C = s, L = C.props.className || "";
-      return z.cloneElement(C, { className: k("px-6 py-4", L) });
+      return z.cloneElement(C, { className: D("px-6 py-4", L) });
     }
-    return /* @__PURE__ */ c("div", { className: "px-6 py-4", children: s });
+    return /* @__PURE__ */ d("div", { className: "px-6 py-4", children: s });
   };
-  return /* @__PURE__ */ c(W, { children: _(
+  return /* @__PURE__ */ d(W, { children: U(
     /* @__PURE__ */ E(
       "div",
       {
@@ -663,36 +663,36 @@ function Je({
         className: "fixed inset-0 z-[100] overflow-hidden",
         "data-panel-open": t,
         children: [
-          /* @__PURE__ */ c(
+          /* @__PURE__ */ d(
             "div",
             {
-              className: k(
+              className: D(
                 "fixed inset-0 bg-black/40 transition-opacity duration-300",
                 w ? "opacity-100" : "opacity-0",
-                d
+                c
               ),
               onClick: () => {
                 i || r();
               }
             }
           ),
-          /* @__PURE__ */ c("div", { className: "fixed inset-y-0 right-0 flex max-w-full", children: /* @__PURE__ */ c(
+          /* @__PURE__ */ d("div", { className: "fixed inset-y-0 right-0 flex max-w-full", children: /* @__PURE__ */ d(
             "div",
             {
               id: g,
-              ref: o,
+              ref: n,
               tabIndex: -1,
-              className: k(
+              className: D(
                 "relative h-full transform shadow-xl bg-popover transition-transform duration-300 ease-in-out",
                 l !== "screen" && "border-l border-border",
-                Ne.size[l],
+                Ae.size[l],
                 w ? "translate-x-0" : "translate-x-full",
                 u
               ),
               "data-panel-size": l,
               children: /* @__PURE__ */ E("div", { className: "flex h-full flex-col", children: [
-                e && /* @__PURE__ */ c("div", { className: "px-6 pt-6", children: N() }),
-                !b && /* @__PURE__ */ c(
+                e && /* @__PURE__ */ d("div", { className: "px-6 pt-6", children: N() }),
+                !b && /* @__PURE__ */ d(
                   "button",
                   {
                     type: "button",
@@ -700,11 +700,11 @@ function Je({
                     "data-panel-close-button": "true",
                     "aria-label": "Close panel",
                     className: "rounded-md p-0.5 top-3 right-3 absolute opacity-80 hover:opacity-100 transition-opacity focus:outline-none focus:ring-2 focus:ring-gray-500 leading-0",
-                    children: /* @__PURE__ */ c(P, { size: 18 })
+                    children: /* @__PURE__ */ d(O, { size: 18 })
                   }
                 ),
-                /* @__PURE__ */ c("div", { className: k("flex-1 overflow-y-auto px-6 pb-6", e ? "pt-6" : "pt-10"), children: n }),
-                D()
+                /* @__PURE__ */ d("div", { className: D("flex-1 overflow-y-auto px-6 pb-6", e ? "pt-6" : "pt-10"), children: o }),
+                k()
               ] })
             }
           ) })
@@ -714,7 +714,7 @@ function Je({
     document.body
   ) });
 }
-function Ae({ itemId: o, checked: a, onChange: t, name: r, disabled: e = !1, className: n = "" }) {
+function Ce({ itemId: n, checked: a, onChange: t, name: r, disabled: e = !1, className: o = "" }) {
   const s = "relative inline-flex items-center justify-center rounded-full", l = () => {
     e || t();
   }, u = y(
@@ -722,18 +722,18 @@ function Ae({ itemId: o, checked: a, onChange: t, name: r, disabled: e = !1, cla
     !a && "hover:border-current/60",
     !e && "border-current cursor-pointer",
     e && "border-muted/60 cursor-not-allowed",
-    n
+    o
   );
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ d(
     "div",
     {
-      id: o,
+      id: n,
       role: "radio",
       tabIndex: -1,
       "aria-checked": a,
       "aria-disabled": e,
       "aria-description": `Radio button for ${r}`,
-      "aria-labelledby": `${o}-label`,
+      "aria-labelledby": `${n}-label`,
       onClick: l,
       className: u,
       style: {
@@ -742,7 +742,7 @@ function Ae({ itemId: o, checked: a, onChange: t, name: r, disabled: e = !1, cla
         padding: "0.1em",
         borderWidth: "0.06em"
       },
-      children: a && /* @__PURE__ */ c(
+      children: a && /* @__PURE__ */ d(
         "div",
         {
           className: y("size-full aspect-square rounded-full", e && "bg-muted/60", !e && "bg-current")
@@ -752,18 +752,18 @@ function Ae({ itemId: o, checked: a, onChange: t, name: r, disabled: e = !1, cla
   );
 }
 function G({
-  value: o,
+  value: n,
   children: a,
   className: t = "",
   isSelected: r = !1,
   onChange: e,
-  disabled: n = !1,
+  disabled: o = !1,
   hideInput: s = !1,
   description: l,
   name: u
 }) {
-  const b = `radio-${$()}-${o}`, i = () => {
-    n || e == null || e(o);
+  const b = `radio-${$()}-${n}`, i = () => {
+    o || e == null || e(n);
   };
   return /* @__PURE__ */ E(
     "div",
@@ -773,27 +773,27 @@ function G({
         "relative flex items-center",
         t,
         // Uses text color for borders
-        s && `p-2 border-2 focus-within:border-dashed focus-within:${n ? "border-current/50" : "border-current/80"}`,
-        s && !r && `border-transparent ${n ? "" : "not-focus-within:hover:border-border/60"}`,
+        s && `p-2 border-2 focus-within:border-dashed focus-within:${o ? "border-current/50" : "border-current/80"}`,
+        s && !r && `border-transparent ${o ? "" : "not-focus-within:hover:border-border/60"}`,
         s && r && "border-border",
-        n && "opacity-60 cursor-not-allowed"
+        o && "opacity-60 cursor-not-allowed"
       ),
       style: {
         gap: "0.5em"
       },
       children: [
-        !s && /* @__PURE__ */ c(
-          Ae,
+        !s && /* @__PURE__ */ d(
+          Ce,
           {
             itemId: b,
             name: u || "",
             checked: r,
             onChange: i,
-            disabled: n,
+            disabled: o,
             className: y(s && "")
           }
         ),
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ d(
           "div",
           {
             id: s ? b : void 0,
@@ -801,16 +801,16 @@ function G({
             role: s ? "radio" : void 0,
             onClick: s ? i : void 0,
             "aria-checked": s ? r ? "true" : "false" : void 0,
-            "aria-disabled": s ? n : void 0,
+            "aria-disabled": s ? o : void 0,
             "aria-description": s ? l || `Radio button for ${u}` : void 0,
             "aria-labelledby": s ? `${b}-label` : void 0,
             className: y(s && "size-full", typeof a == "object" && "grow focus:outline-none"),
-            children: /* @__PURE__ */ c(
+            children: /* @__PURE__ */ d(
               "label",
               {
                 id: `${b}-label`,
                 onClick: s ? void 0 : i,
-                className: y(n && "cursor-not-allowed", !n && "cursor-pointer"),
+                className: y(o && "cursor-not-allowed", !o && "cursor-pointer"),
                 children: a
               }
             )
@@ -820,12 +820,12 @@ function G({
     }
   );
 }
-function Ce(o, a) {
-  const [t, r] = x(a), [e, n] = x(-1), [s, l] = x(!1), u = I((f, m) => {
+function Ie(n, a) {
+  const [t, r] = x(a), [e, o] = x(-1), [s, l] = x(!1), u = I((f, m) => {
     var w;
     const g = f[m];
-    g.hasAttribute("disabled") || g.getAttribute("aria-disabled") === "true" || ((w = f[m]) == null || w.click(), n(m));
-  }, []), d = I(
+    g.hasAttribute("disabled") || g.getAttribute("aria-disabled") === "true" || ((w = f[m]) == null || w.click(), o(m));
+  }, []), c = I(
     (f, m) => {
       var h;
       if (f.preventDefault(), s || !m.length) return;
@@ -843,16 +843,16 @@ function Ce(o, a) {
         document.querySelectorAll(
           'a, button, input, textarea, select, details, [tabindex]:not([tabindex="-1"])'
         )
-      ).filter((p) => !p.hasAttribute("disabled") && p.tabIndex >= 0), g = m.findIndex((p) => p.id === o), h = g > 0 ? g - 1 : m.length - 1;
+      ).filter((p) => !p.hasAttribute("disabled") && p.tabIndex >= 0), g = m.findIndex((p) => p.id === n), h = g > 0 ? g - 1 : m.length - 1;
       (w = m[h]) == null || w.focus();
     },
-    [o]
+    [n]
   ), i = I(
     (f, m) => {
       var N;
       if (!m.length) return;
       const g = f.target;
-      if (!m.some((D) => D.id === g.id)) return;
+      if (!m.some((k) => k.id === g.id)) return;
       const w = t !== -1 ? t : 0;
       let p = w;
       switch (f.key) {
@@ -878,42 +878,42 @@ function Ce(o, a) {
     },
     [t, e, b, u]
   ), v = I(() => {
-    const f = document.querySelector(`[id="${o}"][role="radiogroup"]`);
+    const f = document.querySelector(`[id="${n}"][role="radiogroup"]`);
     return f ? Array.from(f.querySelectorAll('[role="radio"]')) : [];
-  }, [o]);
+  }, [n]);
   A(() => {
-    const f = document.querySelector(`[id="${o}"][role="radiogroup"]`);
+    const f = document.querySelector(`[id="${n}"][role="radiogroup"]`);
     if (!f) return;
-    const m = v(), g = (N) => d(N, m), h = (N) => i(N, m), w = () => l(!0), p = () => l(!1);
+    const m = v(), g = (N) => c(N, m), h = (N) => i(N, m), w = () => l(!0), p = () => l(!1);
     return document.addEventListener("keydown", h), f.addEventListener("focus", g), f.addEventListener("mousedown", w), document.addEventListener("mouseup", p), () => {
       document.removeEventListener("keydown", h), f.removeEventListener("focus", g), f.removeEventListener("mousedown", w), document.removeEventListener("mouseup", p);
     };
-  }, [o, v, d, i]);
+  }, [n, v, c, i]);
 }
-function Ye({
-  options: o = [],
+function Pe({
+  options: n = [],
   value: a,
   onChange: t,
   id: r,
   children: e,
-  className: n = "",
+  className: o = "",
   childrenClassName: s = "",
   hideInputs: l = !1
 }) {
-  const u = $(), d = r || `radio-group-${u}`;
-  Ce(
-    d,
-    o.findIndex((i) => i === a)
+  const u = $(), c = r || `radio-group-${u}`;
+  Ie(
+    c,
+    n.findIndex((i) => i === a)
   );
-  const b = U(() => o.reduce((i, v) => (typeof v == "string" ? i.some((f) => f.value === v) || i.push({ label: v, value: v }) : i.push(v), i), []), [o]);
-  return /* @__PURE__ */ E("div", { id: d, role: "radiogroup", tabIndex: 0, className: y(n, "focus:outline-none"), children: [
-    b.length > 0 && b.map((i, v) => /* @__PURE__ */ c(
+  const b = _(() => n.reduce((i, v) => (typeof v == "string" ? i.some((f) => f.value === v) || i.push({ label: v, value: v }) : i.push(v), i), []), [n]);
+  return /* @__PURE__ */ E("div", { id: c, role: "radiogroup", tabIndex: 0, className: y(o, "focus:outline-none"), children: [
+    b.length > 0 && b.map((i, v) => /* @__PURE__ */ d(
       G,
       {
         value: i.value,
         isSelected: a === i.value,
         onChange: t,
-        name: d,
+        name: c,
         disabled: i.disabled,
         description: i.description,
         hideInput: l,
@@ -922,7 +922,7 @@ function Ye({
       },
       `${i.value}-${v}`
     )),
-    b.length === 0 && e && z.Children.map(e, (i) => z.isValidElement(i) && i.type === G ? /* @__PURE__ */ c(
+    b.length === 0 && e && z.Children.map(e, (i) => z.isValidElement(i) && i.type === G ? /* @__PURE__ */ d(
       G,
       {
         ...i.props,
@@ -930,13 +930,13 @@ function Ye({
         hideInput: i.props.hideInput || l,
         isSelected: a === i.props.value,
         onChange: t,
-        name: d,
+        name: c,
         children: i.props.children
       }
     ) : null)
   ] });
 }
-const Ie = {
+const $e = {
   thin: {
     horizontal: "h-px",
     vertical: "w-px"
@@ -953,64 +953,130 @@ const Ie = {
     horizontal: "h-2",
     vertical: "w-2"
   }
-}, $e = {
+}, Te = {
   horizontal: "w-full",
   vertical: "min-h-4 h-full"
 };
-function Pe({
-  orientation: o = "horizontal",
+function Oe({
+  orientation: n = "horizontal",
   decorative: a = !1,
   thickness: t = "thin",
   className: r,
   ...e
 }) {
-  const n = y(
+  const o = y(
     "shrink-0 bg-border",
-    $e[o],
-    Ie[t][o],
+    Te[n],
+    $e[t][n],
     r
   );
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ d(
     "div",
     {
       ...e,
-      className: n,
+      className: o,
       role: a ? "presentation" : "separator",
-      "aria-orientation": a ? void 0 : o,
+      "aria-orientation": a ? void 0 : n,
       "aria-hidden": a,
-      "data-orientation": o,
+      "data-orientation": n,
       "data-thickness": t
     }
   );
 }
-function Oe({ children: o, ref: a, ...t }) {
-  if (ee(o)) {
+const Z = {
+  shape: {
+    rectangle: "rounded-md min-h-1",
+    circle: "rounded-full aspect-square min-h-1",
+    text: "rounded-sm min-h-1 h-4"
+  },
+  lineSpacing: {
+    xs: "space-y-1",
+    sm: "space-y-2",
+    md: "space-y-3",
+    lg: "space-y-4",
+    xl: "space-y-6"
+  }
+};
+function et({
+  shape: n = "rectangle",
+  lineSpacing: a = "sm",
+  className: t,
+  lines: r = 1,
+  animate: e = !0,
+  ref: o,
+  ...s
+}) {
+  const l = y("bg-muted/70", e && "animate-pulse", Z.shape[n], t);
+  return r > 1 ? /* @__PURE__ */ d(
+    "div",
+    {
+      ref: o,
+      className: Z.lineSpacing[a],
+      role: "presentation",
+      "aria-hidden": "true",
+      "data-testid": "skeleton-container",
+      "data-lines": r,
+      "data-shape": n,
+      "data-animate": e,
+      ...s,
+      children: Array.from({ length: r }, (u, c) => /* @__PURE__ */ d(
+        "div",
+        {
+          className: y(
+            l,
+            // Make last line shorter for a more natural text appearance
+            c === r - 1 && "w-3/4"
+          ),
+          role: "presentation",
+          "aria-hidden": "true",
+          "data-testid": "skeleton-line",
+          "data-line-index": c
+        },
+        c
+      ))
+    }
+  ) : /* @__PURE__ */ d(
+    "div",
+    {
+      ref: o,
+      className: l,
+      role: "presentation",
+      "aria-hidden": "true",
+      "data-testid": "skeleton",
+      "data-shape": n,
+      "data-animate": e,
+      ...s
+    }
+  );
+}
+function tt({ children: n, ref: a, ...t }) {
+  if (te(n)) {
     let r = { ...t };
-    return o.props && (r = { ...r, ...o.props }), te(o, {
+    return n.props && (r = { ...r, ...n.props }), re(n, {
       ...r,
       ref: (e) => {
         typeof a == "function" ? a(e) : a && (a.current = e);
       }
     });
   }
-  return Y("div", { ...t, ref: a }, o);
+  return P("div", { ...t, ref: a }, n);
 }
-function Te({ elementId: o, maxLength: a }) {
+function ke({ elementId: n, maxLength: a }) {
   const [t, r] = x(0);
   return A(() => {
-    const e = document.getElementById(o);
+    const e = document.getElementById(n);
     if (!e)
       return;
-    const n = () => {
+    const o = () => {
       const s = e.value.length;
       r(s);
       const l = s >= a;
-      e.setAttribute("aria-describedby", `${o}-character-count`), e.setAttribute("aria-invalid", l ? "true" : "false"), l ? e.setAttribute("data-error", "true") : e.removeAttribute("data-error");
+      e.setAttribute("aria-describedby", `${n}-character-count`), e.setAttribute("aria-invalid", l ? "true" : "false"), l ? e.setAttribute("data-error", "true") : e.removeAttribute("data-error");
     };
-    return n(), e.addEventListener("input", n), e.setAttribute("maxlength", String(a)), () => {
-      e.removeEventListener("input", n), e.removeAttribute("maxlength"), e.removeAttribute("aria-describedby"), e.removeAttribute("aria-invalid"), e.removeAttribute("data-error");
+    return o(), e.addEventListener("input", o), e.setAttribute("maxlength", String(a)), () => {
+      e.removeEventListener("input", o), e.removeAttribute("maxlength"), e.removeAttribute("aria-describedby"), e.removeAttribute("aria-invalid"), e.removeAttribute("data-error");
     };
-  }, [o, a]), /* @__PURE__ */ c(
+  }, [n, a]), /* @__PURE__ */ d(
     "small",
     {
       className: y(
@@ -1019,7 +1085,7 @@ function Te({ elementId: o, maxLength: a }) {
         t < a && "text-current"
       ),
       role: "status",
-      children: /* @__PURE__ */ E("span", { id: `${o}-character-count`, children: [
+      children: /* @__PURE__ */ E("span", { id: `${n}-character-count`, children: [
         t,
         " / ",
         a,
@@ -1028,9 +1094,9 @@ function Te({ elementId: o, maxLength: a }) {
     }
   );
 }
-function De(o, a) {
+function ze(n, a) {
   A(() => {
-    const t = document.getElementById(o);
+    const t = document.getElementById(n);
     if (!t)
       return;
     if (!a) {
@@ -1043,70 +1109,70 @@ function De(o, a) {
     return r(), t.addEventListener("input", r), t.addEventListener("resize", r), window.addEventListener("resize", r), () => {
       t.removeEventListener("input", r), t.removeEventListener("resize", r), window.removeEventListener("resize", r);
     };
-  }, [o, a]);
+  }, [n, a]);
 }
-const ze = {
+const De = {
   base: "",
   "left-line": "border-l border-border focus:border-primary-foreground disabled:border-muted/30 not-disabled:data-error:border-destructive not-disabled:data-success:border-success",
   outline: "border border-border focus:border-primary-foreground disabled:border-muted/30 not-disabled:data-error:border-destructive not-disabled:data-success:border-success"
-}, ke = {
+}, Le = {
   none: "rounded-none",
   sm: "rounded-sm",
   md: "rounded-md",
   lg: "rounded-lg",
   full: "px-3 rounded-full"
-}, Z = {
+}, J = {
   variant: "outline",
   rounded: "none"
 };
-function et({
-  variant: o = Z.variant,
+function rt({
+  variant: n = J.variant,
   rounded: a,
   displayOnlyMode: t = !1,
   errorMessage: r,
   successMessage: e,
-  hideResizeHandle: n = !1,
+  hideResizeHandle: o = !1,
   autoExpand: s = !1,
   characterLimit: l = 0,
   className: u,
-  ...d
+  ...c
 }) {
   const b = $();
-  De(b, s || t);
+  ze(b, s || t);
   let i = a;
-  o === "outline" && !a && (i = "md"), i = i || Z.rounded;
-  let v = n;
-  (t || o === "left-line" && !n) && (v = !0);
+  n === "outline" && !a && (i = "md"), i = i || J.rounded;
+  let v = o;
+  (t || n === "left-line" && !o) && (v = !0);
   const m = y(
     "appearance-none w-full focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed placeholder:text-muted/70 hide-number-input-arrows transition-all",
-    !t && ze[o],
-    !t && ke[i],
+    !t && De[n],
+    !t && Le[i],
     !t && "px-2 py-1",
     t && "pointer-events-none",
     v && "no-resize-handle",
     u
   );
   return /* @__PURE__ */ E("div", { className: y("-space-y-1.5", t && "cursor-text"), children: [
-    /* @__PURE__ */ c(
+    /* @__PURE__ */ d(
       "textarea",
       {
-        ...d,
+        ...c,
         id: b,
-        "aria-disabled": d.disabled,
+        "aria-disabled": c.disabled,
         readOnly: t,
-        "aria-readonly": t || d["aria-readonly"],
+        "aria-readonly": t || c["aria-readonly"],
         style: {
           resize: s ? "none" : void 0
         },
         className: m
       }
     ),
-    l > 0 && /* @__PURE__ */ c(Te, { elementId: b, maxLength: l }),
-    !t && /* @__PURE__ */ c(V, { elementId: b, type: "error", message: r }),
-    !t && /* @__PURE__ */ c(V, { elementId: b, type: "success", message: e })
+    l > 0 && /* @__PURE__ */ d(ke, { elementId: b, maxLength: l }),
+    !t && /* @__PURE__ */ d(V, { elementId: b, type: "error", message: r }),
+    !t && /* @__PURE__ */ d(V, { elementId: b, type: "success", message: e })
   ] });
 }
-const Le = {
+const Re = {
   sm: {
     container: "h-5 min-w-9 w-9",
     thumb: "h-4 w-4",
@@ -1122,7 +1188,7 @@ const Le = {
     thumb: "h-6 w-6",
     translate: "translate-x-6"
   }
-}, Re = {
+}, Se = {
   default: {
     unchecked: "bg-muted",
     checked: "bg-primary"
@@ -1135,47 +1201,47 @@ const Le = {
     unchecked: "bg-muted",
     checked: "bg-destructive"
   }
-}, J = {
+}, Y = {
   variant: "default",
   size: "md"
 };
-function tt({
-  ref: o,
+function nt({
+  ref: n,
   id: a,
-  size: t = J.size,
-  variant: r = J.variant,
+  size: t = Y.size,
+  variant: r = Y.variant,
   checked: e,
-  onCheckedChange: n,
+  onCheckedChange: o,
   disabled: s = !1,
   className: l,
   thumbClassName: u,
-  backgroundClassNames: d,
+  backgroundClassNames: c,
   ...b
 }) {
-  const i = $(), v = U(() => a || `toggle-${i}`, [a, i]), [f, m] = x(e);
+  const i = $(), v = _(() => a || `toggle-${i}`, [a, i]), [f, m] = x(e);
   A(() => {
     m(e);
   }, [e]);
   const g = () => {
     if (!s) {
       const C = !f;
-      e === void 0 && m(C), n == null || n(C);
+      e === void 0 && m(C), o == null || o(C);
     }
   }, h = (C) => {
     (C.key === " " || C.key === "Enter") && (C.preventDefault(), g());
-  }, w = Le[t], p = Re[r], N = y(
+  }, w = Re[t], p = Se[r], N = y(
     // Base styles
     "relative inline-flex items-center rounded-full transition-all duration-200 ease-in-out",
     "focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2",
     // Size
     w.container,
     // Variant and state
-    f ? (d == null ? void 0 : d.checked) || p.checked : (d == null ? void 0 : d.unchecked) || p.unchecked,
+    f ? (c == null ? void 0 : c.checked) || p.checked : (c == null ? void 0 : c.unchecked) || p.unchecked,
     // Disabled state
     s && "opacity-50 cursor-not-allowed",
     !s && "cursor-pointer",
     l
-  ), D = y(
+  ), k = y(
     // Base thumb styles
     "absolute left-0.5 top-1/2 -translate-y-1/2 rounded-full bg-white shadow-sm transition-transform duration-200 ease-in-out",
     // Size
@@ -1187,7 +1253,7 @@ function tt({
   return /* @__PURE__ */ E(
     "button",
     {
-      ref: o,
+      ref: n,
       id: v,
       type: "button",
       role: "switch",
@@ -1200,71 +1266,71 @@ function tt({
       className: N,
       ...b,
       children: [
-        /* @__PURE__ */ c("span", { className: D }),
-        /* @__PURE__ */ c("span", { className: "sr-only", children: f ? "Enabled" : "Disabled" })
+        /* @__PURE__ */ d("span", { className: k }),
+        /* @__PURE__ */ d("span", { className: "sr-only", children: f ? "Enabled" : "Disabled" })
       ]
     }
   );
 }
 const j = 8, F = 4, T = 6;
-function Be(o) {
+function Be(n) {
   return { calculatePosition: I(
     (t, r) => {
-      const e = t.getBoundingClientRect(), n = r.getBoundingClientRect(), s = {
+      const e = t.getBoundingClientRect(), o = r.getBoundingClientRect(), s = {
         width: window.innerWidth,
         height: window.innerHeight
       }, l = (v, f, m, g) => v < 0 || f < 0 || v + m > s.width || f + g > s.height, u = {
         top: {
-          x: e.left + e.width / 2 - n.width / 2,
-          y: e.top - n.height - F,
+          x: e.left + e.width / 2 - o.width / 2,
+          y: e.top - o.height - F,
           arrow: {
-            x: n.width / 2 - T,
-            y: n.height
+            x: o.width / 2 - T,
+            y: o.height
           }
         },
         bottom: {
-          x: e.left + e.width / 2 - n.width / 2,
+          x: e.left + e.width / 2 - o.width / 2,
           y: e.bottom + F,
           arrow: {
-            x: n.width / 2 - T,
+            x: o.width / 2 - T,
             y: -6
           }
         },
         left: {
-          x: e.left - n.width - F,
-          y: e.top + e.height / 2 - n.height / 2,
+          x: e.left - o.width - F,
+          y: e.top + e.height / 2 - o.height / 2,
           arrow: {
-            x: n.width,
-            y: n.height / 2 - T
+            x: o.width,
+            y: o.height / 2 - T
           }
         },
         right: {
           x: e.right + F,
-          y: e.top + e.height / 2 - n.height / 2,
+          y: e.top + e.height / 2 - o.height / 2,
           arrow: {
             x: -6,
-            y: n.height / 2 - T
+            y: o.height / 2 - T
           }
         }
       };
-      let d = o, b = u[o];
-      if (l(b.x, b.y, n.width, n.height)) {
+      let c = n, b = u[n];
+      if (l(b.x, b.y, o.width, o.height)) {
         const v = {
           top: "bottom",
           bottom: "top",
           left: "right",
           right: "left"
-        }, f = u[v[o]];
-        if (!l(f.x, f.y, n.width, n.height))
-          d = v[o], b = f;
+        }, f = u[v[n]];
+        if (!l(f.x, f.y, o.width, o.height))
+          c = v[n], b = f;
         else {
           const m = ["top", "bottom", "left", "right"].filter(
-            (g) => g !== o && g !== v[o]
+            (g) => g !== n && g !== v[n]
           );
           for (const g of m) {
             const h = u[g];
-            if (!l(h.x, h.y, n.width, n.height)) {
-              d = g, b = h;
+            if (!l(h.x, h.y, o.width, o.height)) {
+              c = g, b = h;
               break;
             }
           }
@@ -1272,88 +1338,88 @@ function Be(o) {
       }
       b.x = Math.max(
         j,
-        Math.min(b.x, s.width - n.width - j)
+        Math.min(b.x, s.width - o.width - j)
       ), b.y = Math.max(
         j,
-        Math.min(b.y, s.height - n.height - j)
+        Math.min(b.y, s.height - o.height - j)
       );
       const i = {
         x: e.left + e.width / 2,
         y: e.top + e.height / 2
       };
-      return d === "top" || d === "bottom" ? b.arrow.x = Math.max(
+      return c === "top" || c === "bottom" ? b.arrow.x = Math.max(
         T,
-        Math.min(i.x - b.x - T, n.width - T * 2)
+        Math.min(i.x - b.x - T, o.width - T * 2)
       ) : b.arrow.y = Math.max(
         T,
-        Math.min(i.y - b.y - T, n.height - T * 2)
+        Math.min(i.y - b.y - T, o.height - T * 2)
       ), {
         ...b,
-        placement: d
+        placement: c
       };
     },
-    [o]
+    [n]
   ) };
 }
-function Se(o, a, t) {
-  const r = R(null), e = R(null), n = I(() => {
+function je(n, a, t) {
+  const r = R(null), e = R(null), o = I(() => {
     if (!r.current || !e.current) return;
-    const s = o(r.current, e.current);
+    const s = n(r.current, e.current);
     t(s);
-  }, [o, t]);
+  }, [n, t]);
   return A(() => {
     if (!a) return;
-    const s = () => n();
+    const s = () => o();
     return window.addEventListener("resize", s), () => {
       window.removeEventListener("resize", s);
     };
-  }, [a, n]), {
+  }, [a, o]), {
     triggerRef: r,
     tooltipRef: e,
-    updatePosition: n
+    updatePosition: o
   };
 }
-function je(o, a, t, r, e, n, s, l, u) {
-  const d = R(null), b = I(() => {
-    o || (d.current && clearTimeout(d.current), d.current = window.setTimeout(() => {
+function Fe(n, a, t, r, e, o, s, l, u) {
+  const c = R(null), b = I(() => {
+    n || (c.current && clearTimeout(c.current), c.current = window.setTimeout(() => {
       t(!0), requestAnimationFrame(() => {
         e(), r(!0);
       });
     }, a));
-  }, [o, a, t, e, r]), i = I(
+  }, [n, a, t, e, r]), i = I(
     (v = !1) => {
-      if (d.current && clearTimeout(d.current), v) {
+      if (c.current && clearTimeout(c.current), v) {
         r(!1), setTimeout(() => t(!1), 150);
         return;
       }
-      d.current = window.setTimeout(() => {
+      c.current = window.setTimeout(() => {
         r(!1), setTimeout(() => t(!1), 150);
       }, 100);
     },
     [r, t]
   );
   return A(() => {
-    !n && !s && !l && u && i();
-  }, [n, s, l, u, i]), A(() => () => {
-    d.current && clearTimeout(d.current);
+    !o && !s && !l && u && i();
+  }, [o, s, l, u, i]), A(() => () => {
+    c.current && clearTimeout(c.current);
   }, []), {
     showTooltip: b,
     hideTooltip: i,
-    timeoutRef: d
+    timeoutRef: c
   };
 }
-function rt({
-  id: o,
+function ot({
+  id: n,
   children: a,
   message: t,
   placement: r = "top",
   disabled: e = !1,
-  delay: n = 200,
+  delay: o = 200,
   className: s
 }) {
-  const [l, u] = x(!1), [d, b] = x(!1), [i, v] = x(null), [f, m] = x(!1), [g, h] = x(!1), [w, p] = x(!1), { calculatePosition: N } = Be(r), { triggerRef: D, tooltipRef: C, updatePosition: L } = Se(N, d, v), { showTooltip: B, hideTooltip: S, timeoutRef: Q } = je(
+  const [l, u] = x(!1), [c, b] = x(!1), [i, v] = x(null), [f, m] = x(!1), [g, h] = x(!1), [w, p] = x(!1), { calculatePosition: N } = Be(r), { triggerRef: k, tooltipRef: C, updatePosition: L } = je(N, c, v), { showTooltip: S, hideTooltip: B, timeoutRef: Q } = Fe(
     e,
-    n,
+    o,
     b,
     u,
     L,
@@ -1361,31 +1427,31 @@ function rt({
     g,
     w,
     l
-  ), O = $(), M = o ?? O;
+  ), ee = $(), M = n ?? ee;
   return /* @__PURE__ */ E(W, { children: [
     z.cloneElement(a, {
-      ref: (H) => {
-        D.current = H;
+      ref: (q) => {
+        k.current = q;
       },
       onMouseEnter: () => {
-        m(!0), B();
+        m(!0), S();
       },
       onMouseLeave: () => {
         m(!1);
       },
       onFocus: () => {
-        p(!0), B();
+        p(!0), S();
       },
       onBlur: () => {
-        p(!1), S(!0);
+        p(!1), B(!0);
       },
-      onKeyDown: (H) => {
-        H.key === "Escape" && S(!0);
+      onKeyDown: (q) => {
+        q.key === "Escape" && B(!0);
       },
       "aria-describedby": e ? void 0 : M
     }),
-    d && _(
-      /* @__PURE__ */ c(
+    c && U(
+      /* @__PURE__ */ d(
         "div",
         {
           ref: C,
@@ -1412,24 +1478,25 @@ function rt({
 }
 export {
   Ue as Accordion,
-  q as AccordionItem,
-  at as ActionModal,
-  me as Button,
+  H as AccordionItem,
+  it as ActionModal,
+  be as Button,
   ce as ButtonLoadingDots,
-  _e as Checkbox,
-  Qe as Clickable,
-  Me as Input,
-  Xe as Label,
-  Ze as Modal,
-  Je as Panel,
-  Ye as RadioGroup,
+  Qe as Checkbox,
+  Me as Clickable,
+  Xe as Input,
+  Ze as Label,
+  Je as Modal,
+  Ye as Panel,
+  Pe as RadioGroup,
   G as RadioGroupItem,
-  Ae as RadioInput,
-  Pe as Separator,
-  Oe as Slot,
-  et as Textarea,
-  st as Toast,
-  tt as Toggle,
-  rt as Tooltip
+  Ce as RadioInput,
+  Oe as Separator,
+  et as Skeleton,
+  tt as Slot,
+  rt as Textarea,
+  lt as Toast,
+  nt as Toggle,
+  ot as Tooltip
 };
 //# sourceMappingURL=components.esm.js.map