@gspa/ui 0.1.4 → 0.3.0

package/dist/components/DatePicker.js

@@ -1,401 +1,4 @@
-import { ref as p, computed as x, watch as _, onMounted as le, onBeforeUnmount as se, createElementBlock as s, openBlock as l, createElementVNode as o, createBlock as ue, createCommentVNode as M, normalizeClass as T, withModifiers as U, Teleport as de, createVNode as ce, Transition as fe, withCtx as ve, normalizeStyle as me, toDisplayString as w, Fragment as C, renderList as V, nextTick as pe } from "vue";
-const ge = { class: "relative w-full bg-(--ui-surface) rounded-md" }, be = { class: "relative" }, ye = ["id", "value", "disabled", "placeholder", "required", "aria-describedby"], he = { class: "flex items-center justify-between mb-3" }, xe = { class: "text-sm font-semibold ui-text" }, we = { class: "grid grid-cols-7 gap-1 mb-1" }, De = { class: "grid grid-cols-7 gap-1" }, ke = ["disabled", "onClick"], Se = {
-  key: 0,
-  class: "mt-3 pt-2 border-t ui-border"
-}, Me = {
-  key: 0,
-  class: "border-l pl-3 ui-border"
-}, Te = { class: "max-h-[260px] overflow-y-auto pr-1 space-y-1" }, Ce = ["onClick"], $e = {
-  __name: "DatePicker",
-  props: {
-    id: String,
-    modelValue: [String, Date],
-    disabled: Boolean,
-    required: Boolean,
-    min: [String, Date],
-    max: [String, Date],
-    placeholder: {
-      type: String,
-      default: "Select date"
-    },
-    format: {
-      type: String,
-      default: "DD/MM/YYYY"
-    },
-    clearable: {
-      type: Boolean,
-      default: !0
-    },
-    showToday: {
-      type: Boolean,
-      default: !0
-    },
-    ariaDescribedby: String,
-    // Custom validation function: (date: Date) => string | null
-    // Return error message string if invalid, null if valid
-    customValidation: {
-      type: Function,
-      default: null
-    },
-    // Array of disabled dates or function to determine if date is disabled
-    disabledDates: {
-      type: [Array, Function],
-      default: null
-    },
-    enableTime: {
-      type: Boolean,
-      default: !1
-    },
-    minuteInterval: {
-      type: Number,
-      default: 1
-    }
-  },
-  emits: ["update:modelValue", "validation-error"],
-  setup(d, { emit: G }) {
-    const r = d, y = G, m = p(!1), B = p(null), Y = p(null), F = p({}), g = /* @__PURE__ */ new Date(), i = p(g.getMonth()), u = p(g.getFullYear()), c = p(null), D = p(!1), k = p("00:00"), J = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], K = x(
-      () => new Date(u.value, i.value).toLocaleString("default", {
-        month: "long"
-      })
-    ), I = x(() => new Date(u.value, i.value + 1, 0).getDate()), Q = x(() => new Date(u.value, i.value, 1).getDay()), E = x(() => {
-      const n = new Date(u.value, i.value, 0).getDate(), e = Q.value;
-      return Array.from({ length: e }, (t, a) => n - e + a + 1);
-    }), X = x(() => {
-      const n = E.value.length + I.value, e = n % 7 === 0 ? 0 : 7 - n % 7;
-      return Array.from({ length: e }, (t, a) => a + 1);
-    }), N = x(() => c.value ? r.enableTime ? ee(c.value) : z(c.value) : ""), Z = x(() => {
-      const n = Math.min(60, Math.max(1, Number(r.minuteInterval) || 1)), e = [];
-      for (let t = 0; t < 24; t++)
-        for (let a = 0; a < 60; a += n) {
-          const v = String(t).padStart(2, "0"), f = String(a).padStart(2, "0");
-          e.push(`${v}:${f}`);
-        }
-      return e;
-    });
-    function z(n) {
-      if (!n) return "";
-      const e = new Date(n), t = String(e.getMonth() + 1).padStart(2, "0"), a = String(e.getDate()).padStart(2, "0"), v = e.getFullYear();
-      return r.format.replace("MM", t).replace("DD", a).replace("YYYY", v);
-    }
-    function ee(n) {
-      const e = z(n), t = String(n.getHours()).padStart(2, "0"), a = String(n.getMinutes()).padStart(2, "0");
-      return `${e} ${t}:${a}`;
-    }
-    function S(n) {
-      if (!n) return null;
-      if (n instanceof Date) return n;
-      if (typeof n == "string") {
-        if (n.includes("T")) {
-          const [a, v] = n.split("T"), f = S(a);
-          if (!f) return null;
-          const [h = "00", b = "00"] = (v || "").slice(0, 5).split(":");
-          return f.setHours(parseInt(h, 10) || 0, parseInt(b, 10) || 0, 0, 0), f;
-        }
-        const t = n.split("-");
-        if (t.length === 3) {
-          const a = parseInt(t[0], 10), v = parseInt(t[1], 10) - 1, f = parseInt(t[2], 10);
-          return new Date(a, v, f);
-        }
-      }
-      const e = new Date(n);
-      return isNaN(e.getTime()) ? null : e;
-    }
-    function te(n) {
-      return g.getDate() === n && g.getMonth() === i.value && g.getFullYear() === u.value;
-    }
-    function H(n) {
-      if (!c.value) return !1;
-      const e = new Date(c.value);
-      return e.getDate() === n && e.getMonth() === i.value && e.getFullYear() === u.value;
-    }
-    function $(n) {
-      const e = new Date(u.value, i.value, n);
-      if (r.min) {
-        const t = S(r.min);
-        if (t && e < t) return !0;
-      }
-      if (r.max) {
-        const t = S(r.max);
-        if (t && e > t) return !0;
-      }
-      if (r.disabledDates) {
-        if (typeof r.disabledDates == "function")
-          return r.disabledDates(e);
-        if (Array.isArray(r.disabledDates))
-          return r.disabledDates.some((t) => {
-            const a = S(t);
-            return a && a.getTime() === e.getTime();
-          });
-      }
-      return !!(r.customValidation && r.customValidation(e));
-    }
-    function L(n) {
-      if (!n)
-        return D.value = !1, y("validation-error", null), !0;
-      if (r.customValidation) {
-        const e = r.customValidation(n);
-        if (e)
-          return D.value = !0, y("validation-error", e), !1;
-      }
-      return D.value = !1, y("validation-error", null), !0;
-    }
-    async function R() {
-      await pe();
-      const n = Y.value || (r.id ? document.getElementById(r.id) : null);
-      if (!n || !B.value) return;
-      const e = n.getBoundingClientRect(), t = 320, a = window.innerHeight - e.bottom, v = e.top, f = 8;
-      let h, b;
-      a >= t || a > v ? h = e.bottom + f : h = e.top - t - f, b = e.left;
-      const O = 256;
-      b + O > window.innerWidth && (b = window.innerWidth - O - 16), b < 16 && (b = 16), F.value = {
-        top: `${h}px`,
-        left: `${b}px`
-      };
-    }
-    async function ne() {
-      r.disabled || (m.value = !m.value, m.value && await R());
-    }
-    function A() {
-      m.value = !1;
-    }
-    function ae() {
-      i.value === 0 ? (i.value = 11, u.value--) : i.value--;
-    }
-    function re() {
-      i.value === 11 ? (i.value = 0, u.value++) : i.value++;
-    }
-    function j(n) {
-      if ($(n)) return;
-      const e = new Date(u.value, i.value, n);
-      L(e) && (c.value = e, P(e), setTimeout(() => {
-        r.enableTime || (m.value = !1);
-      }, 150));
-    }
-    function P(n) {
-      const e = n.getFullYear(), t = String(n.getMonth() + 1).padStart(2, "0"), a = String(n.getDate()).padStart(2, "0");
-      if (!r.enableTime) {
-        y("update:modelValue", `${e}-${t}-${a}`);
-        return;
-      }
-      const [v = "00", f = "00"] = k.value.split(":"), h = `${e}-${t}-${a}T${v}:${f}`;
-      y("update:modelValue", h);
-    }
-    function oe() {
-      i.value = g.getMonth(), u.value = g.getFullYear(), j(g.getDate());
-    }
-    function ie() {
-      c.value = null, k.value = "00:00", D.value = !1, y("update:modelValue", ""), y("validation-error", null);
-    }
-    _(() => r.modelValue, (n) => {
-      if (n) {
-        const e = S(n);
-        if (e) {
-          c.value = e;
-          const t = String(e.getHours()).padStart(2, "0"), a = String(e.getMinutes()).padStart(2, "0");
-          k.value = `${t}:${a}`, i.value = e.getMonth(), u.value = e.getFullYear(), L(e);
-        }
-      } else
-        c.value = null, D.value = !1;
-    }, { immediate: !0 }), _(k, (n) => {
-      if (!r.enableTime || !c.value) return;
-      const [e = "00", t = "00"] = (n || "00:00").split(":");
-      c.value.setHours(parseInt(e, 10) || 0, parseInt(t, 10) || 0, 0, 0), P(c.value);
-    });
-    function q() {
-      m.value && R();
-    }
-    function W(n) {
-      n.key === "Escape" && m.value && A();
-    }
-    return le(() => {
-      document.addEventListener("keydown", W), window.addEventListener("resize", q);
-    }), se(() => {
-      document.removeEventListener("keydown", W), window.removeEventListener("resize", q);
-    }), (n, e) => (l(), s("div", ge, [
-      o("div", be, [
-        o("input", {
-          id: d.id,
-          ref_key: "inputRef",
-          ref: Y,
-          type: "text",
-          value: N.value,
-          readonly: "",
-          disabled: d.disabled,
-          placeholder: d.placeholder,
-          required: d.required,
-          "aria-describedby": d.ariaDescribedby,
-          class: T([
-            "w-full px-3 py-2 pr-10 border rounded-md ui-surface ui-text placeholder-slate-400 text-sm  ",
-            "focus:outline-none focus:ring-2 focus:ring-(--ui-primary) focus:border-(--ui-primary) cursor-pointer transition-colors",
-            "disabled:bg-(--ui-bg) disabled:text-(--ui-text) disabled:cursor-not-allowed",
-            D.value ? "border-(--ui-danger) focus:ring-(--ui-danger) focus:border-(--ui-danger)" : "ui-border"
-          ]),
-          onClick: ne
-        }, null, 10, ye),
-        e[2] || (e[2] = o("div", { class: "absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none" }, [
-          o("svg", {
-            class: "w-4 h-4 ui-text",
-            fill: "none",
-            stroke: "currentColor",
-            viewBox: "0 0 24 24"
-          }, [
-            o("path", {
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              "stroke-width": "2",
-              d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"
-            })
-          ])
-        ], -1)),
-        d.clearable && N.value && !d.disabled ? (l(), s("button", {
-          key: 0,
-          type: "button",
-          class: "absolute right-9 top-1/2 -translate-y-1/2 p-1 hover:bg-(--ui-bg) rounded transition-colors",
-          "aria-label": "Clear date",
-          onClick: U(ie, ["stop"])
-        }, [...e[1] || (e[1] = [
-          o("svg", {
-            class: "w-3.5 h-3.5 ui-text",
-            fill: "none",
-            stroke: "currentColor",
-            viewBox: "0 0 24 24"
-          }, [
-            o("path", {
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              "stroke-width": "2",
-              d: "M6 18L18 6M6 6l12 12"
-            })
-          ], -1)
-        ])])) : M("", !0)
-      ]),
-      (l(), ue(de, { to: "body" }, [
-        ce(fe, {
-          "enter-active-class": "transition ease-out duration-100",
-          "enter-from-class": "transform opacity-0 scale-95",
-          "enter-to-class": "transform opacity-100 scale-100",
-          "leave-active-class": "transition ease-in duration-75",
-          "leave-from-class": "transform opacity-100 scale-100",
-          "leave-to-class": "transform opacity-0 scale-95"
-        }, {
-          default: ve(() => [
-            m.value ? (l(), s("div", {
-              key: 0,
-              ref_key: "calendarRef",
-              ref: B,
-              style: me(F.value),
-              class: T(["fixed z-10000 rounded-lg shadow-xl p-3 ui-surface ui-border-strong", d.enableTime ? "w-[420px]" : "w-64"]),
-              onClick: e[0] || (e[0] = U(() => {
-              }, ["stop"]))
-            }, [
-              o("div", {
-                class: T(d.enableTime ? "grid grid-cols-[1fr_124px] gap-3" : "block")
-              }, [
-                o("div", null, [
-                  o("div", he, [
-                    o("button", {
-                      type: "button",
-                      class: "p-1.5 rounded hover:bg-(--ui-bg) transition-colors",
-                      "aria-label": "Previous Month",
-                      onClick: ae
-                    }, [...e[3] || (e[3] = [
-                      o("svg", {
-                        class: "w-4 h-4 ui-text",
-                        fill: "none",
-                        stroke: "currentColor",
-                        viewBox: "0 0 24 24"
-                      }, [
-                        o("path", {
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round",
-                          "stroke-width": "2",
-                          d: "M15 18l-6-6 6-6"
-                        })
-                      ], -1)
-                    ])]),
-                    o("div", xe, w(K.value) + " " + w(u.value), 1),
-                    o("button", {
-                      type: "button",
-                      class: "p-1.5 rounded hover:bg-(--ui-bg) transition-colors",
-                      "aria-label": "Next Month",
-                      onClick: re
-                    }, [...e[4] || (e[4] = [
-                      o("svg", {
-                        class: "w-4 h-4 ui-text",
-                        fill: "none",
-                        stroke: "currentColor",
-                        viewBox: "0 0 24 24"
-                      }, [
-                        o("path", {
-                          "stroke-linecap": "round",
-                          "stroke-linejoin": "round",
-                          "stroke-width": "2",
-                          d: "M9 18l6-6-6-6"
-                        })
-                      ], -1)
-                    ])])
-                  ]),
-                  o("div", we, [
-                    (l(), s(C, null, V(J, (t) => o("div", {
-                      key: t,
-                      class: "text-center text-xs font-medium ui-text py-1"
-                    }, w(t), 1)), 64))
-                  ]),
-                  o("div", De, [
-                    (l(!0), s(C, null, V(E.value, (t, a) => (l(), s("div", {
-                      key: "prev-" + a,
-                      class: "text-center text-xs ui-text py-1.5"
-                    }, w(t), 1))), 128)),
-                    (l(!0), s(C, null, V(I.value, (t) => (l(), s("button", {
-                      key: t,
-                      type: "button",
-                      disabled: $(t),
-                      class: T([
-                        "w-8 h-8 rounded text-xs font-medium transition-colors",
-                        te(t) && !H(t) ? "ui-primary-soft ui-primary ring-1 ring-(--ui-primary)" : "",
-                        H(t) ? "ui-primary-bg ui-text hover:bg-(--ui-primary)" : "ui-text hover:bg-(--ui-bg)",
-                        $(t) ? "ui-text cursor-not-allowed hover:bg-transparent line-through" : "cursor-pointer"
-                      ]),
-                      onClick: (a) => j(t)
-                    }, w(t), 11, ke))), 128)),
-                    (l(!0), s(C, null, V(X.value, (t, a) => (l(), s("div", {
-                      key: "next-" + a,
-                      class: "text-center text-xs ui-text py-1.5"
-                    }, w(t), 1))), 128))
-                  ]),
-                  d.showToday ? (l(), s("div", Se, [
-                    o("button", {
-                      type: "button",
-                      class: "w-full px-3 py-1.5 text-xs font-medium ui-primary hover:bg-(--ui-primary-soft) rounded transition-colors",
-                      onClick: oe
-                    }, " Today ")
-                  ])) : M("", !0)
-                ]),
-                d.enableTime ? (l(), s("div", Me, [
-                  e[5] || (e[5] = o("div", { class: "text-xs font-semibold ui-text mb-2" }, "Time", -1)),
-                  o("div", Te, [
-                    (l(!0), s(C, null, V(Z.value, (t) => (l(), s("button", {
-                      key: t,
-                      type: "button",
-                      class: T(["w-full px-2 py-1.5 text-left text-sm rounded transition-colors", t === k.value ? "ui-primary-bg ui-text" : "ui-text hover:bg-(--ui-bg)"]),
-                      onClick: (a) => k.value = t
-                    }, w(t), 11, Ce))), 128))
-                  ])
-                ])) : M("", !0)
-              ], 2)
-            ], 6)) : M("", !0)
-          ]),
-          _: 1
-        }),
-        m.value ? (l(), s("div", {
-          key: 0,
-          class: "fixed inset-0 z-9999",
-          onClick: A
-        })) : M("", !0)
-      ]))
-    ]));
-  }
-};
+import { _ as f } from "../DatePicker.vue_vue_type_script_setup_true_lang-Dx_9f8DO.js";
 export {
-  $e as default
+  f as default
 };

package/dist/components/FormField.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),r=require("class-variance-authority"),l=require("../utils/cn.cjs"),z=require("./DatePicker.cjs"),b=["for"],B={key:0,class:"ui-danger ml-1","aria-label":"required"},S={class:"relative"},C=["aria-label"],w=["id"],N=["id"],E={__name:"FormField",props:{label:String,description:String,error:String,success:String,helpText:String,required:{type:Boolean,default:!1},type:{type:String,default:"text"},modelValue:[String,Date],size:{type:String,default:"md",validator:t=>["sm","md","lg"].includes(t)},id:String},emits:["update:modelValue"],setup(t,{emit:v}){const o=t,f=v,y=`field-${Math.random().toString(36).slice(2,9)}`,a=e.computed(()=>`${o.id||y}-${Math.random().toString(36).slice(2,5)}`),i=e.computed(()=>!!o.error),n=e.ref(!1),d=()=>{n.value=!n.value},g=e.computed(()=>{const s=[];return o.error?s.push(`${a.value}-error`):o.helpText&&s.push(`${a.value}-help`),s.length>0?s.join(" "):void 0}),h=r.cva("ui-text",{variants:{size:{sm:"space-y-1",md:"space-y-2",lg:"space-y-3"}},defaultVariants:{size:"md"}}),V=r.cva("block ui-text",{variants:{size:{sm:"text-xs font-medium",md:"text-sm font-medium",lg:"text-base font-medium"}},defaultVariants:{size:"md"}}),k=r.cva("ui-text",{variants:{size:{sm:"text-xs",md:"text-sm",lg:"text-base"}},defaultVariants:{size:"md"}}),u=r.cva("flex items-start gap-2",{variants:{size:{sm:"text-xs",md:"text-sm",lg:"text-sm"},intent:{error:"ui-danger",success:"ui-success"}},defaultVariants:{size:"md",intent:"error"}}),x=r.cva("ui-text",{variants:{size:{sm:"text-xs",md:"text-sm",lg:"text-sm"}},defaultVariants:{size:"md"}});return(s,m)=>{const c=e.resolveComponent("font-awesome-icon");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(l.cn)(e.unref(h)({size:t.size}),s.$attrs.class))},[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:a.value,class:e.normalizeClass(e.unref(l.cn)(e.unref(V)({size:t.size})))},[e.createTextVNode(e.toDisplayString(t.label)+" ",1),t.required?(e.openBlock(),e.createElementBlock("span",B,"*")):e.createCommentVNode("",!0)],10,b)):e.createCommentVNode("",!0),t.description?(e.openBlock(),e.createElementBlock("p",{key:1,class:e.normalizeClass(e.unref(l.cn)(e.unref(k)({size:t.size})))},e.toDisplayString(t.description),3)):e.createCommentVNode("",!0),e.createElementVNode("div",S,[t.type==="date"?(e.openBlock(),e.createBlock(z.default,{key:0,id:a.value,"model-value":t.modelValue,disabled:!1,required:t.required,class:e.normalizeClass(i.value?"border-(--ui-danger)":""),"onUpdate:modelValue":m[0]||(m[0]=p=>f("update:modelValue",p))},null,8,["id","model-value","required","class"])):e.renderSlot(s.$slots,"default",{key:1,fieldId:a.value,hasError:i.value,ariaDescribedBy:g.value,showPassword:n.value,togglePasswordVisibility:d}),t.type==="password"?(e.openBlock(),e.createElementBlock("button",{key:2,type:"button",class:"absolute inset-y-0 right-0 pr-3 flex items-center ui-text hover:text-(--ui-text) transition-colors","aria-label":n.value?"Hide password":"Show password",onClick:d},[e.createVNode(c,{icon:n.value?"eye-slash":"eye",class:"w-4 h-4"},null,8,["icon"])],8,C)):e.createCommentVNode("",!0)]),e.createVNode(e.Transition,{"enter-active-class":"transition-all duration-200","enter-from-class":"opacity-0 -translate-y-1","enter-to-class":"opacity-100 translate-y-0","leave-active-class":"transition-all duration-150","leave-from-class":"opacity-100 translate-y-0","leave-to-class":"opacity-0 -translate-y-1"},{default:e.withCtx(()=>[i.value?(e.openBlock(),e.createElementBlock("div",{key:0,id:`${a.value}-error`,class:e.normalizeClass(e.unref(l.cn)(e.unref(u)({size:t.size,intent:"error"}))),role:"alert","aria-live":"polite"},[e.createVNode(c,{icon:"exclamation-triangle",class:"w-4 h-4 shrink-0 mt-0.5"}),e.createElementVNode("span",null,e.toDisplayString(t.error),1)],10,w)):e.createCommentVNode("",!0)]),_:1}),t.helpText&&!i.value?(e.openBlock(),e.createElementBlock("p",{key:2,id:`${a.value}-help`,class:e.normalizeClass(e.unref(l.cn)(e.unref(x)({size:t.size})))},e.toDisplayString(t.helpText),11,N)):e.createCommentVNode("",!0),e.createVNode(e.Transition,{"enter-active-class":"transition-all duration-200","enter-from-class":"opacity-0 -translate-y-1","enter-to-class":"opacity-100 translate-y-0","leave-active-class":"transition-all duration-150","leave-from-class":"opacity-100 translate-y-0","leave-to-class":"opacity-0 -translate-y-1"},{default:e.withCtx(()=>[t.success&&!i.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(l.cn)(e.unref(u)({size:t.size,intent:"success"})))},[e.createVNode(c,{icon:"check",class:"w-4 h-4 shrink-0 mt-0.5"}),e.createElementVNode("span",null,e.toDisplayString(t.success),1)],2)):e.createCommentVNode("",!0)]),_:1})],2)}}};exports.default=E;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../FormField.vue_vue_type_script_setup_true_lang-FWitIR3U.cjs");exports.default=e._sfc_main;

package/dist/components/FormField.js

@@ -1,190 +1,4 @@
-import { computed as x, ref as E, resolveComponent as N, createElementBlock as s, openBlock as a, normalizeClass as r, unref as t, createCommentVNode as n, createElementVNode as h, createVNode as u, createTextVNode as P, toDisplayString as m, createBlock as I, renderSlot as F, Transition as b, withCtx as p } from "vue";
-import { cva as v } from "class-variance-authority";
-import { cn as o } from "../utils/cn.js";
-import M from "./DatePicker.js";
-const j = ["for"], H = {
-  key: 0,
-  class: "ui-danger ml-1",
-  "aria-label": "required"
-}, U = { class: "relative" }, A = ["aria-label"], G = ["id"], J = ["id"], R = {
-  __name: "FormField",
-  props: {
-    label: String,
-    description: String,
-    error: String,
-    success: String,
-    helpText: String,
-    required: { type: Boolean, default: !1 },
-    type: { type: String, default: "text" },
-    // Added type prop
-    modelValue: [String, Date],
-    size: {
-      type: String,
-      default: "md",
-      validator: (e) => ["sm", "md", "lg"].includes(e)
-    },
-    id: String
-  },
-  emits: ["update:modelValue"],
-  setup(e, { emit: k }) {
-    const f = e, w = k, S = `field-${Math.random().toString(36).slice(2, 9)}`, i = x(() => `${f.id || S}-${Math.random().toString(36).slice(2, 5)}`), c = x(() => !!f.error), d = E(!1), g = () => {
-      d.value = !d.value;
-    }, $ = x(() => {
-      const l = [];
-      return f.error ? l.push(`${i.value}-error`) : f.helpText && l.push(`${i.value}-help`), l.length > 0 ? l.join(" ") : void 0;
-    }), q = v("ui-text", {
-      variants: {
-        size: {
-          sm: "space-y-1",
-          md: "space-y-2",
-          lg: "space-y-3"
-        }
-      },
-      defaultVariants: { size: "md" }
-    }), B = v("block ui-text", {
-      variants: {
-        size: {
-          sm: "text-xs font-medium",
-          md: "text-sm font-medium",
-          lg: "text-base font-medium"
-        }
-      },
-      defaultVariants: { size: "md" }
-    }), T = v("ui-text", {
-      variants: {
-        size: {
-          sm: "text-xs",
-          md: "text-sm",
-          lg: "text-base"
-        }
-      },
-      defaultVariants: { size: "md" }
-    }), z = v("flex items-start gap-2", {
-      variants: {
-        size: {
-          sm: "text-xs",
-          md: "text-sm",
-          lg: "text-sm"
-        },
-        intent: {
-          error: "ui-danger",
-          success: "ui-success"
-        }
-      },
-      defaultVariants: { size: "md", intent: "error" }
-    }), C = v("ui-text", {
-      variants: {
-        size: {
-          sm: "text-xs",
-          md: "text-sm",
-          lg: "text-sm"
-        }
-      },
-      defaultVariants: { size: "md" }
-    });
-    return (l, V) => {
-      const y = N("font-awesome-icon");
-      return a(), s("div", {
-        class: r(t(o)(t(q)({ size: e.size }), l.$attrs.class))
-      }, [
-        e.label ? (a(), s("label", {
-          key: 0,
-          for: i.value,
-          class: r(t(o)(t(B)({ size: e.size })))
-        }, [
-          P(m(e.label) + " ", 1),
-          e.required ? (a(), s("span", H, "*")) : n("", !0)
-        ], 10, j)) : n("", !0),
-        e.description ? (a(), s("p", {
-          key: 1,
-          class: r(t(o)(t(T)({ size: e.size })))
-        }, m(e.description), 3)) : n("", !0),
-        h("div", U, [
-          e.type === "date" ? (a(), I(M, {
-            key: 0,
-            id: i.value,
-            "model-value": e.modelValue,
-            disabled: !1,
-            required: e.required,
-            class: r(c.value ? "border-(--ui-danger)" : ""),
-            "onUpdate:modelValue": V[0] || (V[0] = (D) => w("update:modelValue", D))
-          }, null, 8, ["id", "model-value", "required", "class"])) : F(l.$slots, "default", {
-            key: 1,
-            fieldId: i.value,
-            hasError: c.value,
-            ariaDescribedBy: $.value,
-            showPassword: d.value,
-            togglePasswordVisibility: g
-          }),
-          e.type === "password" ? (a(), s("button", {
-            key: 2,
-            type: "button",
-            class: "absolute inset-y-0 right-0 pr-3 flex items-center ui-text hover:text-(--ui-text) transition-colors",
-            "aria-label": d.value ? "Hide password" : "Show password",
-            onClick: g
-          }, [
-            u(y, {
-              icon: d.value ? "eye-slash" : "eye",
-              class: "w-4 h-4"
-            }, null, 8, ["icon"])
-          ], 8, A)) : n("", !0)
-        ]),
-        u(b, {
-          "enter-active-class": "transition-all duration-200",
-          "enter-from-class": "opacity-0 -translate-y-1",
-          "enter-to-class": "opacity-100 translate-y-0",
-          "leave-active-class": "transition-all duration-150",
-          "leave-from-class": "opacity-100 translate-y-0",
-          "leave-to-class": "opacity-0 -translate-y-1"
-        }, {
-          default: p(() => [
-            c.value ? (a(), s("div", {
-              key: 0,
-              id: `${i.value}-error`,
-              class: r(t(o)(t(z)({ size: e.size, intent: "error" }))),
-              role: "alert",
-              "aria-live": "polite"
-            }, [
-              u(y, {
-                icon: "exclamation-triangle",
-                class: "w-4 h-4 shrink-0 mt-0.5"
-              }),
-              h("span", null, m(e.error), 1)
-            ], 10, G)) : n("", !0)
-          ]),
-          _: 1
-        }),
-        e.helpText && !c.value ? (a(), s("p", {
-          key: 2,
-          id: `${i.value}-help`,
-          class: r(t(o)(t(C)({ size: e.size })))
-        }, m(e.helpText), 11, J)) : n("", !0),
-        u(b, {
-          "enter-active-class": "transition-all duration-200",
-          "enter-from-class": "opacity-0 -translate-y-1",
-          "enter-to-class": "opacity-100 translate-y-0",
-          "leave-active-class": "transition-all duration-150",
-          "leave-from-class": "opacity-100 translate-y-0",
-          "leave-to-class": "opacity-0 -translate-y-1"
-        }, {
-          default: p(() => [
-            e.success && !c.value ? (a(), s("div", {
-              key: 0,
-              class: r(t(o)(t(z)({ size: e.size, intent: "success" })))
-            }, [
-              u(y, {
-                icon: "check",
-                class: "w-4 h-4 shrink-0 mt-0.5"
-              }),
-              h("span", null, m(e.success), 1)
-            ], 2)) : n("", !0)
-          ]),
-          _: 1
-        })
-      ], 2);
-    };
-  }
-};
+import { _ as f } from "../FormField.vue_vue_type_script_setup_true_lang-BljDj5YZ.js";
 export {
-  R as default
+  f as default
 };

package/dist/components/GraphFilters.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),D=require("class-variance-authority"),$=require("../utils/cn.cjs"),m=require("./Button.cjs"),y=require("./Select.cjs"),u=require("./Icon.cjs"),q={class:"border-b"},A={key:0,class:"flex items-center gap-3 min-w-64"},R={class:"relative flex-1"},U={class:"relative flex-1"},L={key:1,class:"min-w-40"},M={class:"relative"},_={key:2,class:"min-w-40"},I={class:"relative"},P=["value"],j={key:3,class:"flex items-center gap-2"},G={class:"flex items-center gap-3 ml-auto"},O={class:"flex items-center gap-3 flex-wrap"},H=["onClick"],J={__name:"GraphFilters",props:{showDateFilter:{type:Boolean,default:!0},showChartTypeFilter:{type:Boolean,default:!0},showExport:{type:Boolean,default:!1},showRefresh:{type:Boolean,default:!0},dataSources:{type:Array,default:()=>[]},variant:{type:String,default:"default",validator:o=>["default","minimal","bordered"].includes(o)},padding:{type:String,default:"normal",validator:o=>["compact","normal","comfortable"].includes(o)}},emits:["update:dateFrom","update:dateTo","update:chartType","update:dataSource","export","refresh","clear-filters"],setup(o,{emit:h}){const d=o,i=h,r=e.ref(""),s=e.ref(""),c=e.ref("bar"),n=e.ref(""),x=D.cva("flex flex-wrap items-center gap-4",{variants:{variant:{default:"",minimal:"bg-transparent",bordered:""},padding:{compact:"px-4 py-3",normal:"px-6 py-4",comfortable:"px-8 py-6"}},defaultVariants:{variant:"default",padding:"normal"}}),C=e.computed(()=>r.value||s.value||n.value),p=e.computed(()=>{const l=[];if(r.value||s.value){let t="";r.value&&s.value?t=`${r.value} to ${s.value}`:r.value?t=`From ${r.value}`:s.value&&(t=`Until ${s.value}`),t&&l.push({key:"date",label:"Date Range",value:t,icon:"calendar"})}if(n.value){const t=d.dataSources.find(a=>a.value===n.value);l.push({key:"dataSource",label:"Data Source",value:t?.label||n.value,icon:"database"})}return l}),g=e.computed(()=>$.cn(x({variant:d.variant,padding:d.padding}))),v=e.computed(()=>"w-full pl-10 pr-3 py-2 border ui-border-strong  rounded-lg focus:outline-none focus:ring-2 focus:ring-(--ui-primary) focus:border-transparent text-sm ui-surface "),f=e.computed(()=>"w-full pr-8 appearance-none border ui-border-strong  rounded-lg focus:outline-none focus:ring-2 focus:ring-(--ui-primary) focus:border-transparent text-sm py-2 pl-3 ui-surface "),V=e.computed(()=>"ui-text hover:text-(--ui-text) border   hover:brightness-105 px-3 py-2 rounded-lg text-sm font-medium transition-all"),k=e.computed(()=>"ui-text ui-primary-bg hover:bg-(--ui-primary-strong) border border-(--ui-primary)  px-3 py-2 rounded-lg text-sm font-medium transition-all"),b=e.computed(()=>"ui-text hover:text-(--ui-text) border   hover:brightness-105 px-3 py-2 rounded-lg text-sm font-medium transition-all"),N=e.computed(()=>"px-6 py-3 ui-primary-soft border-t border-(--ui-primary-soft)"),B=e.computed(()=>"text-sm font-semibold ui-primary"),w=e.computed(()=>"flex items-center gap-1.5 ui-surface border border-(--ui-primary-soft) ui-primary px-3 py-1.5 rounded-full text-sm font-medium"),E=e.computed(()=>"ui-primary hover:text-(--ui-primary) ml-1 hover:bg-(--ui-primary-soft) rounded-full p-0.5 transition-all"),F=l=>{c.value=l.target.value,i("update:chartType",l.target.value)},S=l=>{n.value=l.target.value,i("update:dataSource",l.target.value)},T=()=>{r.value="",s.value="",n.value="",i("clear-filters")},z=l=>{switch(l){case"date":r.value="",s.value="";break;case"dataSource":n.value="";break}};return e.watch(()=>r.value,l=>{i("update:dateFrom",l)}),e.watch(()=>s.value,l=>{i("update:dateTo",l)}),(l,t)=>(e.openBlock(),e.createElementBlock("div",q,[e.createElementVNode("div",{class:e.normalizeClass(g.value)},[o.showDateFilter?(e.openBlock(),e.createElementBlock("div",A,[e.createElementVNode("div",R,[e.createVNode(u.default,{icon:"calendar",class:"absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 ui-text"}),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":t[0]||(t[0]=a=>r.value=a),type:"date",class:e.normalizeClass(v.value),placeholder:"From date"},null,2),[[e.vModelText,r.value]])]),t[6]||(t[6]=e.createElementVNode("span",{class:"ui-text text-sm"},"to",-1)),e.createElementVNode("div",U,[e.createVNode(u.default,{icon:"calendar",class:"absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 ui-text"}),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":t[1]||(t[1]=a=>s.value=a),type:"date",class:e.normalizeClass(v.value),placeholder:"To date"},null,2),[[e.vModelText,s.value]])])])):e.createCommentVNode("",!0),o.showChartTypeFilter?(e.openBlock(),e.createElementBlock("div",L,[e.createElementVNode("div",M,[e.createVNode(y.default,{modelValue:c.value,"onUpdate:modelValue":t[2]||(t[2]=a=>c.value=a),class:e.normalizeClass(f.value),onChange:F},{default:e.withCtx(()=>[...t[7]||(t[7]=[e.createElementVNode("option",{value:"bar"}," Bar Chart ",-1),e.createElementVNode("option",{value:"line"}," Line Chart ",-1),e.createElementVNode("option",{value:"pie"}," Pie Chart ",-1)])]),_:1},8,["modelValue","class"]),e.createVNode(u.default,{icon:"chart-bar",class:"absolute right-2 top-1/2 transform -translate-y-1/2 w-4 h-4 ui-text pointer-events-none"})])])):e.createCommentVNode("",!0),o.dataSources.length>0?(e.openBlock(),e.createElementBlock("div",_,[e.createElementVNode("div",I,[e.createVNode(y.default,{modelValue:n.value,"onUpdate:modelValue":t[3]||(t[3]=a=>n.value=a),class:e.normalizeClass(f.value),onChange:S},{default:e.withCtx(()=>[t[8]||(t[8]=e.createElementVNode("option",{value:""}," All Sources ",-1)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.dataSources,a=>(e.openBlock(),e.createElementBlock("option",{key:a.value,value:a.value},e.toDisplayString(a.label),9,P))),128))]),_:1},8,["modelValue","class"]),e.createVNode(u.default,{icon:"database",class:"absolute right-2 top-1/2 transform -translate-y-1/2 w-4 h-4 ui-text pointer-events-none"})])])):e.createCommentVNode("",!0),l.$slots.filters?(e.openBlock(),e.createElementBlock("div",j,[e.renderSlot(l.$slots,"filters")])):e.createCommentVNode("",!0),e.createElementVNode("div",G,[C.value?(e.openBlock(),e.createBlock(m.default,{key:0,class:e.normalizeClass(V.value),onClick:T},{default:e.withCtx(()=>[e.createVNode(u.default,{icon:"rotate-left",class:"w-4 h-4 mr-2"}),t[9]||(t[9]=e.createTextVNode(" Clear Filters ",-1))]),_:1},8,["class"])):e.createCommentVNode("",!0),o.showExport?(e.openBlock(),e.createBlock(m.default,{key:1,class:e.normalizeClass(k.value),onClick:t[4]||(t[4]=a=>l.$emit("export"))},{default:e.withCtx(()=>[e.createVNode(u.default,{icon:"download",class:"w-4 h-4 mr-2"}),t[10]||(t[10]=e.createTextVNode(" Export ",-1))]),_:1},8,["class"])):e.createCommentVNode("",!0),o.showRefresh?(e.openBlock(),e.createBlock(m.default,{key:2,class:e.normalizeClass(b.value),onClick:t[5]||(t[5]=a=>l.$emit("refresh"))},{default:e.withCtx(()=>[e.createVNode(u.default,{icon:"sync",class:"w-4 h-4 mr-2"}),t[11]||(t[11]=e.createTextVNode(" Refresh ",-1))]),_:1},8,["class"])):e.createCommentVNode("",!0)])],2),p.value.length>0?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(N.value)},[e.createElementVNode("div",O,[e.createElementVNode("span",{class:e.normalizeClass(B.value)},"Active filters:",2),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,a=>(e.openBlock(),e.createElementBlock("div",{key:a.key,class:e.normalizeClass(w.value)},[e.createVNode(u.default,{icon:a.icon,class:"w-3 h-3"},null,8,["icon"]),e.createElementVNode("span",null,e.toDisplayString(a.label)+": "+e.toDisplayString(a.value),1),e.createElementVNode("button",{class:e.normalizeClass(E.value),onClick:K=>z(a.key)},[e.createVNode(u.default,{icon:"circle-xmark",class:"w-3 h-3"})],10,H)],2))),128))])],2)):e.createCommentVNode("",!0)]))}};exports.default=J;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),z=require("class-variance-authority"),D=require("../utils/cn.cjs"),m=require("../Button.vue_vue_type_script_setup_true_lang-DZxttvYH.cjs"),y=require("./Select.cjs"),u=require("./Icon.cjs"),$={class:"border-b"},q={key:0,class:"flex items-center gap-3 min-w-64"},A={class:"relative flex-1"},R={class:"relative flex-1"},U={key:1,class:"min-w-40"},L={class:"relative"},M={key:2,class:"min-w-40"},I={class:"relative"},P=["value"],j={key:3,class:"flex items-center gap-2"},G={class:"flex items-center gap-3 ml-auto"},O={class:"flex items-center gap-3 flex-wrap"},H=["onClick"],J={__name:"GraphFilters",props:{showDateFilter:{type:Boolean,default:!0},showChartTypeFilter:{type:Boolean,default:!0},showExport:{type:Boolean,default:!1},showRefresh:{type:Boolean,default:!0},dataSources:{type:Array,default:()=>[]},variant:{type:String,default:"default",validator:o=>["default","minimal","bordered"].includes(o)},padding:{type:String,default:"normal",validator:o=>["compact","normal","comfortable"].includes(o)}},emits:["update:dateFrom","update:dateTo","update:chartType","update:dataSource","export","refresh","clear-filters"],setup(o,{emit:h}){const c=o,i=h,r=e.ref(""),s=e.ref(""),d=e.ref("bar"),n=e.ref(""),g=z.cva("flex flex-wrap items-center gap-4",{variants:{variant:{default:"",minimal:"bg-transparent",bordered:""},padding:{compact:"px-4 py-3",normal:"px-6 py-4",comfortable:"px-8 py-6"}},defaultVariants:{variant:"default",padding:"normal"}}),x=e.computed(()=>r.value||s.value||n.value),p=e.computed(()=>{const l=[];if(r.value||s.value){let t="";r.value&&s.value?t=`${r.value} to ${s.value}`:r.value?t=`From ${r.value}`:s.value&&(t=`Until ${s.value}`),t&&l.push({key:"date",label:"Date Range",value:t,icon:"calendar"})}if(n.value){const t=c.dataSources.find(a=>a.value===n.value);l.push({key:"dataSource",label:"Data Source",value:t?.label||n.value,icon:"database"})}return l}),C=e.computed(()=>D.cn(g({variant:c.variant,padding:c.padding}))),v=e.computed(()=>"w-full pl-10 pr-3 py-2 border ui-border-strong  rounded-lg focus:outline-none focus:ring-2 focus:ring-(--ui-primary) focus:border-transparent text-sm ui-surface "),f=e.computed(()=>"w-full pr-8 appearance-none border ui-border-strong  rounded-lg focus:outline-none focus:ring-2 focus:ring-(--ui-primary) focus:border-transparent text-sm py-2 pl-3 ui-surface "),V=e.computed(()=>"ui-text hover:text-(--ui-text) border   hover:brightness-105 px-3 py-2 rounded-lg text-sm font-medium transition-all"),k=e.computed(()=>"ui-text ui-primary-bg hover:bg-(--ui-primary-strong) border border-(--ui-primary)  px-3 py-2 rounded-lg text-sm font-medium transition-all"),b=e.computed(()=>"ui-text hover:text-(--ui-text) border   hover:brightness-105 px-3 py-2 rounded-lg text-sm font-medium transition-all"),N=e.computed(()=>"px-6 py-3 ui-primary-soft border-t border-(--ui-primary-soft)"),B=e.computed(()=>"text-sm font-semibold ui-primary"),w=e.computed(()=>"flex items-center gap-1.5 ui-surface border border-(--ui-primary-soft) ui-primary px-3 py-1.5 rounded-full text-sm font-medium"),E=e.computed(()=>"ui-primary hover:text-(--ui-primary) ml-1 hover:bg-(--ui-primary-soft) rounded-full p-0.5 transition-all"),F=l=>{d.value=l.target.value,i("update:chartType",l.target.value)},S=l=>{n.value=l.target.value,i("update:dataSource",l.target.value)},T=()=>{r.value="",s.value="",n.value="",i("clear-filters")},_=l=>{switch(l){case"date":r.value="",s.value="";break;case"dataSource":n.value="";break}};return e.watch(()=>r.value,l=>{i("update:dateFrom",l)}),e.watch(()=>s.value,l=>{i("update:dateTo",l)}),(l,t)=>(e.openBlock(),e.createElementBlock("div",$,[e.createElementVNode("div",{class:e.normalizeClass(C.value)},[o.showDateFilter?(e.openBlock(),e.createElementBlock("div",q,[e.createElementVNode("div",A,[e.createVNode(u.default,{icon:"calendar",class:"absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 ui-text"}),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":t[0]||(t[0]=a=>r.value=a),type:"date",class:e.normalizeClass(v.value),placeholder:"From date"},null,2),[[e.vModelText,r.value]])]),t[6]||(t[6]=e.createElementVNode("span",{class:"ui-text text-sm"},"to",-1)),e.createElementVNode("div",R,[e.createVNode(u.default,{icon:"calendar",class:"absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 ui-text"}),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":t[1]||(t[1]=a=>s.value=a),type:"date",class:e.normalizeClass(v.value),placeholder:"To date"},null,2),[[e.vModelText,s.value]])])])):e.createCommentVNode("",!0),o.showChartTypeFilter?(e.openBlock(),e.createElementBlock("div",U,[e.createElementVNode("div",L,[e.createVNode(y.default,{modelValue:d.value,"onUpdate:modelValue":t[2]||(t[2]=a=>d.value=a),class:e.normalizeClass(f.value),onChange:F},{default:e.withCtx(()=>[...t[7]||(t[7]=[e.createElementVNode("option",{value:"bar"}," Bar Chart ",-1),e.createElementVNode("option",{value:"line"}," Line Chart ",-1),e.createElementVNode("option",{value:"pie"}," Pie Chart ",-1)])]),_:1},8,["modelValue","class"]),e.createVNode(u.default,{icon:"chart-bar",class:"absolute right-2 top-1/2 transform -translate-y-1/2 w-4 h-4 ui-text pointer-events-none"})])])):e.createCommentVNode("",!0),o.dataSources.length>0?(e.openBlock(),e.createElementBlock("div",M,[e.createElementVNode("div",I,[e.createVNode(y.default,{modelValue:n.value,"onUpdate:modelValue":t[3]||(t[3]=a=>n.value=a),class:e.normalizeClass(f.value),onChange:S},{default:e.withCtx(()=>[t[8]||(t[8]=e.createElementVNode("option",{value:""}," All Sources ",-1)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.dataSources,a=>(e.openBlock(),e.createElementBlock("option",{key:a.value,value:a.value},e.toDisplayString(a.label),9,P))),128))]),_:1},8,["modelValue","class"]),e.createVNode(u.default,{icon:"database",class:"absolute right-2 top-1/2 transform -translate-y-1/2 w-4 h-4 ui-text pointer-events-none"})])])):e.createCommentVNode("",!0),l.$slots.filters?(e.openBlock(),e.createElementBlock("div",j,[e.renderSlot(l.$slots,"filters")])):e.createCommentVNode("",!0),e.createElementVNode("div",G,[x.value?(e.openBlock(),e.createBlock(m._sfc_main,{key:0,class:e.normalizeClass(V.value),onClick:T},{default:e.withCtx(()=>[e.createVNode(u.default,{icon:"rotate-left",class:"w-4 h-4 mr-2"}),t[9]||(t[9]=e.createTextVNode(" Clear Filters ",-1))]),_:1},8,["class"])):e.createCommentVNode("",!0),o.showExport?(e.openBlock(),e.createBlock(m._sfc_main,{key:1,class:e.normalizeClass(k.value),onClick:t[4]||(t[4]=a=>l.$emit("export"))},{default:e.withCtx(()=>[e.createVNode(u.default,{icon:"download",class:"w-4 h-4 mr-2"}),t[10]||(t[10]=e.createTextVNode(" Export ",-1))]),_:1},8,["class"])):e.createCommentVNode("",!0),o.showRefresh?(e.openBlock(),e.createBlock(m._sfc_main,{key:2,class:e.normalizeClass(b.value),onClick:t[5]||(t[5]=a=>l.$emit("refresh"))},{default:e.withCtx(()=>[e.createVNode(u.default,{icon:"sync",class:"w-4 h-4 mr-2"}),t[11]||(t[11]=e.createTextVNode(" Refresh ",-1))]),_:1},8,["class"])):e.createCommentVNode("",!0)])],2),p.value.length>0?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(N.value)},[e.createElementVNode("div",O,[e.createElementVNode("span",{class:e.normalizeClass(B.value)},"Active filters:",2),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,a=>(e.openBlock(),e.createElementBlock("div",{key:a.key,class:e.normalizeClass(w.value)},[e.createVNode(u.default,{icon:a.icon,class:"w-3 h-3"},null,8,["icon"]),e.createElementVNode("span",null,e.toDisplayString(a.label)+": "+e.toDisplayString(a.value),1),e.createElementVNode("button",{class:e.normalizeClass(E.value),onClick:K=>_(a.key)},[e.createVNode(u.default,{icon:"circle-xmark",class:"w-3 h-3"})],10,H)],2))),128))])],2)):e.createCommentVNode("",!0)]))}};exports.default=J;