@komarcalabs/design-system 0.1.1 → 0.1.3

package/dist/plugin-mUxynfRy.js

@@ -0,0 +1,3064 @@
+import { defineComponent as z, computed as m, openBlock as l, createElementBlock as r, normalizeClass as s, renderSlot as h, createElementVNode as i, createCommentVNode as g, createTextVNode as j, toDisplayString as y, unref as o, createBlock as S, resolveDynamicComponent as R, withCtx as k, ref as E, watch as ce, nextTick as ve, onMounted as fe, onBeforeUnmount as he, withDirectives as ne, vShow as ie, createVNode as T, withModifiers as D, vModelText as ge, Fragment as H, renderList as q, onUnmounted as be, normalizeStyle as J, withKeys as U, inject as O, provide as Y, reactive as pe, toRef as F, useAttrs as ye, mergeProps as G, useModel as X, mergeModels as oe, resolveComponent as ke } from "vue";
+import { a as we, c as xe, s as $e, h as Ce, g as Be, b as ze, e as Ve, r as Ke, d as Se, f as Te, t as Me, p as Pe, i as Ae } from "./treeview-C6_M73YM.js";
+import { DialogRoot as Le, DialogPortal as Ie, DialogOverlay as je, DialogContent as Ze, DialogTitle as He, SelectRoot as Re, SelectTrigger as Oe, SelectIcon as qe, SelectPortal as Ee, SelectContent as De, SelectScrollUpButton as Ne, SelectViewport as We, SelectItem as ee, SelectItemText as te, SelectItemIndicator as ae, SelectGroup as Ue, SelectLabel as Fe, SelectScrollDownButton as Qe, ScrollAreaRoot as Je, ScrollAreaViewport as Ge, ScrollAreaScrollbar as de, ScrollAreaThumb as ue, ScrollAreaCorner as Xe, HoverCardRoot as Ye, HoverCardTrigger as _e, HoverCardPortal as et, HoverCardContent as tt, HoverCardArrow as at, PopoverRoot as lt, PopoverTrigger as st, PopoverPortal as nt, PopoverContent as ot, PopoverArrow as rt, TabsRoot as it, TabsList as dt, TabsTrigger as ut, TabsContent as ct, PaginationRoot as ft, PaginationList as mt, PaginationFirst as vt, PaginationPrev as ht, PaginationListItem as gt, PaginationEllipsis as bt, PaginationNext as pt, PaginationLast as yt } from "reka-ui";
+import { a as kt, b as wt, c as xt, d as $t, f as _, i as Ct, s as Bt, g as zt, t as Vt, h as I, j as Kt, e as St } from "./skeleton-D8D5ibC2.js";
+const Tt = /* @__PURE__ */ z({
+  __name: "KmAlert",
+  props: {
+    tone: { default: "neutral" },
+    variant: { default: "subtle" },
+    size: { default: "md" },
+    title: {},
+    description: {},
+    icon: { type: Boolean, default: !0 },
+    closable: { type: Boolean, default: !1 }
+  },
+  emits: ["close"],
+  setup(e, { emit: t }) {
+    const a = e, n = t, u = m(
+      () => kt({
+        tone: a.tone,
+        variant: a.variant,
+        size: a.size
+      })
+    );
+    return (d, c) => (l(), r("div", {
+      class: s(u.value.root()),
+      role: "alert"
+    }, [
+      e.icon || d.$slots.icon ? (l(), r("div", {
+        key: 0,
+        class: s(u.value.iconWrapper())
+      }, [
+        h(d.$slots, "icon", {}, () => [
+          e.tone === "success" ? (l(), r("svg", {
+            key: 0,
+            class: s(u.value.icon()),
+            xmlns: "http://www.w3.org/2000/svg",
+            viewBox: "0 0 20 20",
+            fill: "currentColor"
+          }, [...c[1] || (c[1] = [
+            i("path", {
+              "fill-rule": "evenodd",
+              d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z",
+              "clip-rule": "evenodd"
+            }, null, -1)
+          ])], 2)) : e.tone === "warning" ? (l(), r("svg", {
+            key: 1,
+            class: s(u.value.icon()),
+            xmlns: "http://www.w3.org/2000/svg",
+            viewBox: "0 0 20 20",
+            fill: "currentColor"
+          }, [...c[2] || (c[2] = [
+            i("path", {
+              "fill-rule": "evenodd",
+              d: "M8.485 2.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 2.495ZM10 5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 10 5Zm0 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+              "clip-rule": "evenodd"
+            }, null, -1)
+          ])], 2)) : e.tone === "danger" ? (l(), r("svg", {
+            key: 2,
+            class: s(u.value.icon()),
+            xmlns: "http://www.w3.org/2000/svg",
+            viewBox: "0 0 20 20",
+            fill: "currentColor"
+          }, [...c[3] || (c[3] = [
+            i("path", {
+              "fill-rule": "evenodd",
+              d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM8.28 7.22a.75.75 0 0 0-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 1 0 1.06 1.06L10 11.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L11.06 10l1.72-1.72a.75.75 0 0 0-1.06-1.06L10 8.94 8.28 7.22Z",
+              "clip-rule": "evenodd"
+            }, null, -1)
+          ])], 2)) : e.tone === "info" ? (l(), r("svg", {
+            key: 3,
+            class: s(u.value.icon()),
+            xmlns: "http://www.w3.org/2000/svg",
+            viewBox: "0 0 20 20",
+            fill: "currentColor"
+          }, [...c[4] || (c[4] = [
+            i("path", {
+              "fill-rule": "evenodd",
+              d: "M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-7-4a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM9 9a.75.75 0 0 0 0 1.5h.253a.25.25 0 0 1 .244.304l-.459 2.066A1.75 1.75 0 0 0 10.747 15H11a.75.75 0 0 0 0-1.5h-.253a.25.25 0 0 1-.244-.304l.459-2.066A1.75 1.75 0 0 0 9.253 9H9Z",
+              "clip-rule": "evenodd"
+            }, null, -1)
+          ])], 2)) : (l(), r("svg", {
+            key: 4,
+            class: s(u.value.icon()),
+            xmlns: "http://www.w3.org/2000/svg",
+            viewBox: "0 0 20 20",
+            fill: "currentColor"
+          }, [...c[5] || (c[5] = [
+            i("path", {
+              "fill-rule": "evenodd",
+              d: "M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16Zm-8-5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-1.5 0v-4.5A.75.75 0 0 1 10 5Zm0 10a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+              "clip-rule": "evenodd"
+            }, null, -1)
+          ])], 2))
+        ])
+      ], 2)) : g("", !0),
+      i("div", {
+        class: s(u.value.content())
+      }, [
+        e.title || d.$slots.title ? (l(), r("div", {
+          key: 0,
+          class: s(u.value.title())
+        }, [
+          h(d.$slots, "title", {}, () => [
+            j(y(e.title), 1)
+          ])
+        ], 2)) : g("", !0),
+        e.description || d.$slots.default ? (l(), r("div", {
+          key: 1,
+          class: s(u.value.description())
+        }, [
+          h(d.$slots, "default", {}, () => [
+            j(y(e.description), 1)
+          ])
+        ], 2)) : g("", !0),
+        d.$slots.actions ? (l(), r("div", {
+          key: 2,
+          class: s(u.value.actions())
+        }, [
+          h(d.$slots, "actions")
+        ], 2)) : g("", !0)
+      ], 2),
+      e.closable ? (l(), r("button", {
+        key: 1,
+        type: "button",
+        class: s(u.value.closeButton()),
+        "aria-label": "Cerrar notificación",
+        onClick: c[0] || (c[0] = (p) => n("close"))
+      }, [...c[6] || (c[6] = [
+        i("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 20 20",
+          fill: "currentColor",
+          class: "w-4 h-4"
+        }, [
+          i("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" })
+        ], -1)
+      ])], 2)) : g("", !0)
+    ], 2));
+  }
+}), Mt = ["aria-label"], Pt = ["src", "alt"], At = { key: 1 }, Lt = /* @__PURE__ */ z({
+  __name: "KmAvatar",
+  props: {
+    displayName: {},
+    src: {},
+    size: { default: "sm" },
+    initials: {}
+  },
+  setup(e) {
+    const t = e, a = m(() => t.initials ? t.initials : t.displayName ? t.displayName.trim().split(/\s+/).filter((n, u) => u < 2).map((n) => n[0]).join("").toUpperCase() : "");
+    return (n, u) => (l(), r("div", {
+      class: s(o(we)({ size: e.size, hasImage: !!e.src })),
+      role: "img",
+      "aria-label": e.displayName
+    }, [
+      e.src ? (l(), r("img", {
+        key: 0,
+        src: e.src,
+        alt: e.displayName,
+        class: "h-full w-full object-cover"
+      }, null, 8, Pt)) : (l(), r("span", At, y(a.value), 1))
+    ], 10, Mt));
+  }
+}), It = /* @__PURE__ */ z({
+  __name: "KmBadge",
+  props: {
+    tone: { default: "neutral" },
+    size: { default: "md" }
+  },
+  setup(e) {
+    return (t, a) => (l(), r("span", {
+      class: s(o(wt)({ tone: e.tone, size: e.size }))
+    }, [
+      h(t.$slots, "default")
+    ], 2));
+  }
+}), jt = /* @__PURE__ */ z({
+  __name: "KmButton",
+  props: {
+    as: { default: "button" },
+    variant: { default: "solid" },
+    size: { default: "md" },
+    disabled: { type: Boolean, default: !1 },
+    loading: { type: Boolean, default: !1 },
+    href: {},
+    target: {},
+    to: {},
+    type: { default: "button" }
+  },
+  setup(e) {
+    const t = e, a = m(() => t.as), n = m(
+      () => xt({
+        variant: t.variant,
+        size: t.size,
+        loading: t.loading
+      })
+    ), u = m(() => ({
+      "animate-spin": t.loading,
+      "h-4 w-4": t.size === "sm" || t.size === "xs",
+      "h-5 w-5": t.size === "md" || t.size === "lg"
+    }));
+    return (d, c) => (l(), S(R(a.value), {
+      class: s(n.value),
+      href: e.as === "a" ? e.href : void 0,
+      target: e.as === "a" ? e.target : void 0,
+      to: e.as === "router-link" ? e.to : void 0,
+      type: e.as === "button" ? e.type : void 0,
+      disabled: e.as === "button" ? e.disabled || e.loading : void 0,
+      "aria-disabled": e.as === "a" && (e.disabled || e.loading) ? "true" : void 0,
+      "aria-busy": e.loading ? "true" : void 0
+    }, {
+      default: k(() => [
+        e.loading ? (l(), r("svg", {
+          key: 0,
+          class: s(u.value),
+          viewBox: "0 0 24 24",
+          fill: "none",
+          xmlns: "http://www.w3.org/2000/svg"
+        }, [...c[0] || (c[0] = [
+          i("circle", {
+            class: "opacity-25",
+            cx: "12",
+            cy: "12",
+            r: "10",
+            stroke: "currentColor",
+            "stroke-width": "4"
+          }, null, -1),
+          i("path", {
+            class: "opacity-75",
+            fill: "currentColor",
+            d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+          }, null, -1)
+        ])], 2)) : g("", !0),
+        h(d.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["class", "href", "target", "to", "type", "disabled", "aria-disabled", "aria-busy"]));
+  }
+}), Zt = /* @__PURE__ */ z({
+  __name: "KmCard",
+  setup(e) {
+    const t = $t();
+    return (a, n) => (l(), r("section", {
+      class: s(o(t).root())
+    }, [
+      a.$slots.header ? (l(), r("header", {
+        key: 0,
+        class: s(o(t).header())
+      }, [
+        h(a.$slots, "header")
+      ], 2)) : g("", !0),
+      i("div", {
+        class: s(o(t).body())
+      }, [
+        h(a.$slots, "default")
+      ], 2),
+      a.$slots.footer ? (l(), r("footer", {
+        key: 1,
+        class: s(o(t).footer())
+      }, [
+        h(a.$slots, "footer")
+      ], 2)) : g("", !0)
+    ], 2));
+  }
+}), Ht = /* @__PURE__ */ z({
+  __name: "KmCarousel",
+  props: {
+    watchItems: { default: () => [] }
+  },
+  setup(e, { expose: t }) {
+    const a = e, n = xe(), u = m(() => n.root()), d = m(() => n.button()), c = m(() => n.wrapper()), p = E(null), f = E(!1), b = E(!1), M = () => {
+      if (!p.value) return;
+      const { scrollLeft: x, scrollWidth: B, clientWidth: $ } = p.value;
+      f.value = x > 10, b.value = x + $ < B - 10;
+    }, w = (x) => {
+      if (!p.value) return;
+      const B = p.value.clientWidth;
+      p.value.scrollBy({
+        left: x === "left" ? -B : B,
+        behavior: "smooth"
+      });
+    };
+    ce(
+      () => a.watchItems,
+      () => {
+        ve(() => {
+          M();
+        });
+      },
+      { deep: !0 }
+    );
+    let v = null;
+    return fe(() => {
+      M(), window.addEventListener("resize", M), p.value && typeof ResizeObserver < "u" && (v = new ResizeObserver(() => {
+        M();
+      }), v.observe(p.value));
+    }), he(() => {
+      window.removeEventListener("resize", M), v && p.value && v.unobserve(p.value);
+    }), t({
+      recheck: M
+    }), (x, B) => (l(), r("div", {
+      class: s(u.value)
+    }, [
+      ne(i("button", {
+        onClick: B[0] || (B[0] = ($) => w("left")),
+        class: s([d.value, "carousel-btn-left"]),
+        "aria-label": "Deslizar a la izquierda"
+      }, [...B[2] || (B[2] = [
+        i("svg", {
+          class: "w-5 h-5",
+          fill: "none",
+          viewBox: "0 0 24 24",
+          stroke: "currentColor",
+          "stroke-width": "2.5"
+        }, [
+          i("path", {
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            d: "M15 19l-7-7 7-7"
+          })
+        ], -1)
+      ])], 2), [
+        [ie, f.value]
+      ]),
+      ne(i("button", {
+        onClick: B[1] || (B[1] = ($) => w("right")),
+        class: s([d.value, "carousel-btn-right"]),
+        "aria-label": "Deslizar a la derecha"
+      }, [...B[3] || (B[3] = [
+        i("svg", {
+          class: "w-5 h-5",
+          fill: "none",
+          viewBox: "0 0 24 24",
+          stroke: "currentColor",
+          "stroke-width": "2.5"
+        }, [
+          i("path", {
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            d: "M9 5l7 7-7 7"
+          })
+        ], -1)
+      ])], 2), [
+        [ie, b.value]
+      ]),
+      i("div", {
+        ref_key: "sliderRef",
+        ref: p,
+        onScroll: M,
+        class: s(c.value)
+      }, [
+        h(x.$slots, "default", {}, void 0, !0)
+      ], 34)
+    ], 2));
+  }
+}), Rt = (e, t) => {
+  const a = e.__vccOpts || e;
+  for (const [n, u] of t)
+    a[n] = u;
+  return a;
+}, Xl = /* @__PURE__ */ Rt(Ht, [["__scopeId", "data-v-9659c808"]]), Yl = /* @__PURE__ */ z({
+  __name: "KmDialog",
+  props: {
+    open: { type: Boolean },
+    defaultOpen: { type: Boolean },
+    modal: { type: Boolean },
+    size: { default: "md" },
+    preventScroll: { type: Boolean, default: !0 }
+  },
+  emits: ["update:open"],
+  setup(e, { emit: t }) {
+    const a = e, n = t, u = m(() => {
+      const d = "w-full max-w-full rounded-km-lg bg-km-surface p-6 shadow-km-xl";
+      switch (a.size) {
+        case "sm":
+          return `${d} max-w-sm`;
+        case "md":
+          return `${d} max-w-md`;
+        case "lg":
+          return `${d} max-w-lg`;
+        case "xl":
+          return `${d} max-w-xl`;
+        case "2xl":
+          return `${d} max-w-2xl`;
+        case "3xl":
+          return `${d} max-w-3xl`;
+        case "full":
+          return `${d} max-w-full m-4`;
+        default:
+          return d;
+      }
+    });
+    return (d, c) => (l(), S(o(Le), {
+      open: e.open,
+      modal: !0,
+      "onUpdate:open": c[0] || (c[0] = (p) => n("update:open", p))
+    }, {
+      default: k(() => [
+        T(o(Ie), null, {
+          default: k(() => [
+            T(o(je), { class: "fixed inset-0 z-50 bg-black/50 backdrop-blur-sm km-dialog-overlay" }),
+            T(o(Ze), {
+              class: s([u.value, "fixed left-1/2 top-1/2 z-[60] km-dialog-content"])
+            }, {
+              default: k(() => [
+                h(d.$slots, "default")
+              ]),
+              _: 3
+            }, 8, ["class"])
+          ]),
+          _: 3
+        })
+      ]),
+      _: 3
+    }, 8, ["open"]));
+  }
+}), Ot = { class: "flex items-start justify-between gap-4" }, qt = { class: "space-y-1.5" }, Et = {
+  key: 1,
+  class: "text-sm text-km-muted-foreground"
+}, _l = /* @__PURE__ */ z({
+  __name: "KmDialogHeader",
+  props: {
+    title: {},
+    description: {},
+    showClose: { type: Boolean }
+  },
+  emits: ["close"],
+  setup(e, { emit: t }) {
+    const a = t;
+    return (n, u) => (l(), r("div", Ot, [
+      i("div", qt, [
+        e.title ? (l(), S(o(He), {
+          key: 0,
+          class: "text-lg font-semibold text-km-foreground"
+        }, {
+          default: k(() => [
+            j(y(e.title), 1)
+          ]),
+          _: 1
+        })) : g("", !0),
+        e.description ? (l(), r("p", Et, y(e.description), 1)) : g("", !0)
+      ]),
+      e.showClose ? (l(), r("button", {
+        key: 0,
+        type: "button",
+        class: "rounded-km-sm p-1 text-km-muted-foreground hover:text-km-foreground focus:outline-none focus:ring-2 focus:ring-km-primary",
+        onClick: u[0] || (u[0] = (d) => a("close"))
+      }, [...u[1] || (u[1] = [
+        i("svg", {
+          class: "h-4 w-4",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          "stroke-width": "2"
+        }, [
+          i("path", {
+            d: "M18 6L6 18M6 6l12 12",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round"
+          })
+        ], -1)
+      ])])) : g("", !0)
+    ]));
+  }
+}), Dt = { class: "mt-4" }, es = /* @__PURE__ */ z({
+  __name: "KmDialogBody",
+  setup(e) {
+    return (t, a) => (l(), r("div", Dt, [
+      h(t.$slots, "default")
+    ]));
+  }
+}), ts = /* @__PURE__ */ z({
+  __name: "KmDialogFooter",
+  props: {
+    align: {},
+    gap: {}
+  },
+  setup(e) {
+    return (t, a) => (l(), r("div", {
+      class: s(["mt-6 flex", [
+        e.align === "start" && "justify-start",
+        e.align === "center" && "justify-center",
+        e.align === "end" && "justify-end",
+        e.gap === "sm" && "gap-2",
+        e.gap === "md" && "gap-3",
+        e.gap === "lg" && "gap-4"
+      ]])
+    }, [
+      h(t.$slots, "default")
+    ], 2));
+  }
+});
+let Nt = 0;
+function N(e = "km") {
+  const t = Nt++;
+  return `${e}-${t}`;
+}
+const Wt = ["for"], Ut = {
+  key: 0,
+  class: "text-km-danger ml-0.5",
+  "aria-hidden": "true"
+}, Ft = { class: "relative flex items-center" }, Qt = ["id", "value", "type", "placeholder", "disabled", "required", "aria-invalid", "aria-describedby"], Jt = {
+  key: 0,
+  xmlns: "http://www.w3.org/2000/svg",
+  fill: "none",
+  viewBox: "0 0 24 24",
+  "stroke-width": "1.5",
+  stroke: "currentColor",
+  class: "size-5"
+}, Gt = {
+  key: 1,
+  xmlns: "http://www.w3.org/2000/svg",
+  fill: "none",
+  viewBox: "0 0 24 24",
+  "stroke-width": "1.5",
+  stroke: "currentColor",
+  class: "size-5"
+}, Xt = ["id"], Yt = ["id"], _t = /* @__PURE__ */ z({
+  __name: "KmInput",
+  props: {
+    id: {},
+    modelValue: {},
+    label: {},
+    hint: {},
+    error: {},
+    placeholder: {},
+    type: { default: "text" },
+    disabled: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: t }) {
+    const a = e, n = t, u = N("km-input"), d = m(() => a.id || u), c = _(), p = m(() => {
+      if (a.error) return `${d.value}-error`;
+      if (a.hint) return `${d.value}-hint`;
+    }), f = E(!1), b = m(() => a.type === "password" ? f.value ? "text" : "password" : a.type), M = () => {
+      f.value = !f.value;
+    };
+    return (w, v) => (l(), r("label", {
+      class: s(o(c).root()),
+      for: d.value
+    }, [
+      e.label ? (l(), r("span", {
+        key: 0,
+        class: s(o(c).label())
+      }, [
+        j(y(e.label) + " ", 1),
+        e.required ? (l(), r("span", Ut, "*")) : g("", !0)
+      ], 2)) : g("", !0),
+      i("div", Ft, [
+        i("input", {
+          id: d.value,
+          class: s([
+            o(Ct)(),
+            a.type === "password" ? "pr-10" : ""
+          ]),
+          value: e.modelValue,
+          type: b.value,
+          placeholder: e.placeholder,
+          disabled: e.disabled,
+          required: e.required,
+          "aria-invalid": e.error ? "true" : void 0,
+          "aria-describedby": p.value,
+          onInput: v[0] || (v[0] = (x) => n("update:modelValue", x.target.value))
+        }, null, 42, Qt),
+        e.type === "password" ? (l(), r("button", {
+          key: 0,
+          type: "button",
+          class: "absolute right-3 text-km-muted-foreground hover:text-km-foreground focus:outline-none",
+          onClick: D(M, ["prevent"])
+        }, [
+          f.value ? (l(), r("svg", Gt, [...v[2] || (v[2] = [
+            i("path", {
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round",
+              d: "M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88"
+            }, null, -1)
+          ])])) : (l(), r("svg", Jt, [...v[1] || (v[1] = [
+            i("path", {
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round",
+              d: "M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z"
+            }, null, -1)
+          ])]))
+        ])) : g("", !0)
+      ]),
+      e.error ? (l(), r("div", {
+        key: 1,
+        id: `${d.value}-error`,
+        class: s([o(c).error(), "flex items-center gap-1 mt-0.5 animate-fadeIn"])
+      }, [
+        v[3] || (v[3] = i("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 20 20",
+          fill: "currentColor",
+          class: "w-3.5 h-3.5 shrink-0"
+        }, [
+          i("path", {
+            "fill-rule": "evenodd",
+            d: "M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-8-5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-1.5 0v-4.5A.75.75 0 0 1 10 5Zm0 10a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+            "clip-rule": "evenodd"
+          })
+        ], -1)),
+        i("span", null, y(e.error), 1)
+      ], 10, Xt)) : e.hint ? (l(), r("span", {
+        key: 2,
+        id: `${d.value}-hint`,
+        class: s(o(c).hint())
+      }, y(e.hint), 11, Yt)) : g("", !0)
+    ], 10, Wt));
+  }
+}), ea = ["for"], ta = {
+  key: 0,
+  class: "text-km-danger ml-0.5",
+  "aria-hidden": "true"
+}, aa = { class: "flex items-center gap-2 truncate flex-1 min-w-0 text-left" }, la = {
+  key: 0,
+  class: "flex items-center gap-2 truncate min-w-0 flex-1"
+}, sa = { class: "truncate font-medium text-km-foreground min-w-0" }, na = {
+  key: 1,
+  class: "px-1.5 py-0.2 text-[10px] font-semibold rounded bg-slate-100 text-slate-600 border border-slate-200/60 shrink-0"
+}, oa = {
+  key: 1,
+  class: "text-km-muted-foreground truncate min-w-0"
+}, ra = { class: "flex items-center gap-1.5 shrink-0 ml-1" }, ia = {
+  key: 0,
+  class: "p-1 border-b border-slate-100 mb-1"
+}, da = { class: "relative flex items-center" }, ua = ["placeholder"], ca = {
+  key: 0,
+  class: "px-3 py-4 text-center text-xs text-slate-400 select-none"
+}, fa = { class: "flex items-center gap-2 truncate" }, ma = { class: "flex flex-col text-left truncate" }, va = {
+  key: 0,
+  class: "text-[10px] text-slate-400 font-normal truncate"
+}, ha = {
+  key: 1,
+  class: "ml-auto px-1.5 py-0.2 text-[10px] font-semibold rounded bg-slate-100 text-slate-600 border border-slate-200/60"
+}, ga = { class: "flex items-center gap-2 truncate" }, ba = { class: "flex flex-col text-left truncate" }, pa = {
+  key: 0,
+  class: "text-[10px] text-slate-400 font-normal truncate"
+}, ya = {
+  key: 1,
+  class: "ml-auto px-1.5 py-0.2 text-[10px] font-semibold rounded bg-slate-100 text-slate-600 border border-slate-200/60"
+}, ka = { class: "flex items-center gap-2 truncate" }, wa = { class: "flex flex-col text-left truncate" }, xa = {
+  key: 0,
+  class: "text-[10px] text-slate-400 font-normal truncate"
+}, $a = {
+  key: 1,
+  class: "ml-auto px-1.5 py-0.2 text-[10px] font-semibold rounded bg-slate-100 text-slate-600 border border-slate-200/60"
+}, Ca = ["id"], Ba = ["id"], za = /* @__PURE__ */ z({
+  __name: "KmSelect",
+  props: {
+    id: {},
+    name: {},
+    modelValue: {},
+    options: {},
+    label: {},
+    hint: {},
+    error: {},
+    placeholder: {},
+    disabled: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    size: { default: "md" },
+    variant: { default: "default" },
+    searchable: { type: Boolean, default: !1 },
+    searchPlaceholder: { default: "Buscar..." },
+    clearable: { type: Boolean, default: !1 },
+    portal: { type: Boolean, default: !0 },
+    to: {},
+    side: { default: "bottom" },
+    align: { default: "start" },
+    sideOffset: { default: 6 },
+    tabindex: {},
+    autofocus: { type: Boolean },
+    triggerClass: {},
+    contentClass: {},
+    itemClass: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(e, { expose: t, emit: a }) {
+    const n = e, u = a, d = E(null), c = N("km-select"), p = m(() => n.id || c), f = _(), b = m(() => {
+      if (n.error) return `${p.value}-error`;
+      if (n.hint) return `${p.value}-hint`;
+    }), M = m(() => !n.options || !Array.isArray(n.options) ? [] : n.options.map((K) => typeof K == "object" && K !== null && "value" in K ? K : {
+      label: String(K),
+      value: K
+    })), w = E(""), v = m(() => {
+      if (!n.searchable || !w.value.trim())
+        return M.value;
+      const K = w.value.toLowerCase().trim();
+      return M.value.filter((V) => {
+        const C = V.label.toLowerCase().includes(K), W = V.description ? V.description.toLowerCase().includes(K) : !1;
+        return C || W;
+      });
+    }), x = m(() => {
+      const K = {}, V = [];
+      for (const C of v.value)
+        C.group ? (K[C.group] || (K[C.group] = []), K[C.group].push(C)) : V.push(C);
+      return { groups: K, ungrouped: V, hasGroups: Object.keys(K).length > 0 };
+    }), B = m(() => n.modelValue === void 0 || n.modelValue === null || n.modelValue === "" ? "" : String(n.modelValue)), $ = m(() => {
+      if (!(n.modelValue === void 0 || n.modelValue === null || n.modelValue === ""))
+        return M.value.find((K) => String(K.value) === String(n.modelValue));
+    }), L = (K) => {
+      if (K === "") {
+        u("update:modelValue", ""), u("change", "");
+        return;
+      }
+      const V = M.value.find((W) => String(W.value) === K), C = V ? V.value : K;
+      u("update:modelValue", C), u("change", C);
+    }, P = (K) => {
+      K.stopPropagation(), u("update:modelValue", ""), u("change", ""), u("clear");
+    }, A = (K) => {
+      K || (w.value = "");
+    };
+    return t({
+      focus: (K) => {
+        var C;
+        const V = ((C = d.value) == null ? void 0 : C.$el) || (typeof document < "u" ? document.getElementById(p.value) : null);
+        V && typeof V.focus == "function" && V.focus(K);
+      },
+      blur: () => {
+        var V;
+        const K = ((V = d.value) == null ? void 0 : V.$el) || (typeof document < "u" ? document.getElementById(p.value) : null);
+        K && typeof K.blur == "function" && K.blur();
+      }
+    }), (K, V) => (l(), r("div", {
+      class: s(o(f).root())
+    }, [
+      e.label ? (l(), r("label", {
+        key: 0,
+        for: p.value,
+        class: s(o(f).label())
+      }, [
+        j(y(e.label) + " ", 1),
+        e.required ? (l(), r("span", ta, "*")) : g("", !0)
+      ], 10, ea)) : g("", !0),
+      T(o(Re), {
+        "model-value": B.value,
+        disabled: e.disabled,
+        required: e.required,
+        name: e.name,
+        "onUpdate:modelValue": L,
+        "onUpdate:open": A
+      }, {
+        default: k(() => [
+          T(o(Oe), {
+            id: p.value,
+            ref_key: "triggerRef",
+            ref: d,
+            tabindex: e.tabindex !== void 0 ? Number(e.tabindex) : 0,
+            autofocus: e.autofocus,
+            class: s([
+              o(Bt)({ size: e.size, variant: e.variant, error: !!e.error }),
+              e.triggerClass
+            ]),
+            "aria-invalid": e.error ? "true" : void 0,
+            "aria-describedby": b.value
+          }, {
+            default: k(() => [
+              i("div", aa, [
+                h(K.$slots, "prefix"),
+                h(K.$slots, "trigger", {
+                  selectedOption: $.value,
+                  placeholder: e.placeholder
+                }, () => [
+                  $.value ? (l(), r("div", la, [
+                    $.value.icon && typeof $.value.icon == "object" ? (l(), S(R($.value.icon), {
+                      key: 0,
+                      class: "w-4 h-4 shrink-0 text-slate-500"
+                    })) : g("", !0),
+                    i("span", sa, y($.value.label), 1),
+                    $.value.badge ? (l(), r("span", na, y($.value.badge), 1)) : g("", !0)
+                  ])) : (l(), r("span", oa, y(e.placeholder || "Seleccionar..."), 1))
+                ])
+              ]),
+              i("div", ra, [
+                e.clearable && e.modelValue && !e.disabled ? (l(), r("button", {
+                  key: 0,
+                  type: "button",
+                  tabindex: "-1",
+                  class: "p-0.5 text-slate-400 hover:text-slate-600 rounded focus:outline-none transition-colors cursor-pointer",
+                  onClick: P
+                }, [...V[2] || (V[2] = [
+                  i("svg", {
+                    class: "w-3.5 h-3.5",
+                    xmlns: "http://www.w3.org/2000/svg",
+                    viewBox: "0 0 20 20",
+                    fill: "currentColor"
+                  }, [
+                    i("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" })
+                  ], -1)
+                ])])) : g("", !0),
+                T(o(qe), { "as-child": "" }, {
+                  default: k(() => [
+                    h(K.$slots, "icon", {}, () => [
+                      V[3] || (V[3] = i("svg", {
+                        class: "w-4 h-4 text-slate-400 group-hover:text-slate-600 transition-transform duration-200 group-data-[state=open]:rotate-180",
+                        xmlns: "http://www.w3.org/2000/svg",
+                        viewBox: "0 0 20 20",
+                        fill: "currentColor"
+                      }, [
+                        i("path", {
+                          "fill-rule": "evenodd",
+                          d: "M5.22 8.22a.75.75 0 0 1 1.06 0L10 11.94l3.72-3.72a.75.75 0 1 1 1.06 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L5.22 9.28a.75.75 0 0 1 0-1.06Z",
+                          "clip-rule": "evenodd"
+                        })
+                      ], -1))
+                    ])
+                  ]),
+                  _: 3
+                })
+              ])
+            ]),
+            _: 3
+          }, 8, ["id", "tabindex", "autofocus", "class", "aria-invalid", "aria-describedby"]),
+          T(o(Ee), {
+            to: e.to,
+            disabled: !e.portal
+          }, {
+            default: k(() => [
+              T(o(De), {
+                side: e.side,
+                align: e.align,
+                "side-offset": e.sideOffset,
+                position: "popper",
+                class: s([
+                  "z-[9999] min-w-[var(--reka-select-trigger-width)] max-h-72 overflow-hidden rounded-xl bg-white border border-slate-200/90 shadow-xl shadow-slate-900/10 p-1 text-slate-800 backdrop-blur-md outline-none select-none",
+                  "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+                  "data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2",
+                  e.contentClass
+                ])
+              }, {
+                default: k(() => [
+                  T(o(Ne), { class: "flex items-center justify-center py-1 text-slate-400 hover:text-slate-600 cursor-pointer" }, {
+                    default: k(() => [...V[4] || (V[4] = [
+                      i("svg", {
+                        class: "w-4 h-4",
+                        xmlns: "http://www.w3.org/2000/svg",
+                        viewBox: "0 0 20 20",
+                        fill: "currentColor"
+                      }, [
+                        i("path", {
+                          "fill-rule": "evenodd",
+                          d: "M14.77 12.79a.75.75 0 0 1-1.06-.02L10 8.832 6.29 12.77a.75.75 0 1 1-1.08-1.04l4.25-4.5a.75.75 0 0 1 1.08 0l4.25 4.5a.75.75 0 0 1-.02 1.06Z",
+                          "clip-rule": "evenodd"
+                        })
+                      ], -1)
+                    ])]),
+                    _: 1
+                  }),
+                  e.searchable ? (l(), r("div", ia, [
+                    i("div", da, [
+                      V[5] || (V[5] = i("svg", {
+                        class: "w-3.5 h-3.5 absolute left-2.5 text-slate-400 pointer-events-none",
+                        xmlns: "http://www.w3.org/2000/svg",
+                        viewBox: "0 0 20 20",
+                        fill: "currentColor"
+                      }, [
+                        i("path", {
+                          "fill-rule": "evenodd",
+                          d: "M9 3.5a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11ZM2 9a7 7 0 1 1 12.452 4.391l3.328 3.329a.75.75 0 1 1-1.06 1.06l-3.329-3.328A7 7 0 0 1 2 9Z",
+                          "clip-rule": "evenodd"
+                        })
+                      ], -1)),
+                      ne(i("input", {
+                        "onUpdate:modelValue": V[0] || (V[0] = (C) => w.value = C),
+                        type: "text",
+                        placeholder: e.searchPlaceholder,
+                        class: "w-full pl-8 pr-2.5 py-1.5 text-xs text-slate-800 bg-slate-50 border border-slate-200 rounded-lg focus:outline-none focus:border-km-primary focus:bg-white",
+                        onKeydown: V[1] || (V[1] = D(() => {
+                        }, ["stop"]))
+                      }, null, 40, ua), [
+                        [ge, w.value]
+                      ])
+                    ])
+                  ])) : g("", !0),
+                  T(o(We), { class: "p-0.5 space-y-0.5 max-h-60 overflow-y-auto" }, {
+                    default: k(() => [
+                      v.value.length === 0 ? (l(), r("div", ca, [
+                        h(K.$slots, "empty", {}, () => [
+                          V[6] || (V[6] = j("No se encontraron opciones", -1))
+                        ])
+                      ])) : g("", !0),
+                      x.value.hasGroups ? (l(), r(H, { key: 1 }, [
+                        (l(!0), r(H, null, q(x.value.ungrouped, (C) => (l(), S(o(ee), {
+                          key: String(C.value),
+                          value: String(C.value),
+                          disabled: C.disabled,
+                          class: s([
+                            "relative flex items-center justify-between gap-2 select-none rounded-lg px-2.5 py-2 text-xs font-medium text-slate-700 outline-none transition-colors cursor-pointer",
+                            "data-[highlighted]:bg-slate-100 data-[highlighted]:text-slate-900",
+                            "data-[disabled]:pointer-events-none data-[disabled]:opacity-40",
+                            "data-[state=checked]:text-km-primary data-[state=checked]:font-semibold data-[state=checked]:bg-km-primary-light/40",
+                            e.itemClass
+                          ])
+                        }, {
+                          default: k(() => [
+                            i("div", fa, [
+                              h(K.$slots, "item", {
+                                option: C,
+                                selected: String(C.value) === B.value
+                              }, () => [
+                                C.icon && typeof C.icon == "object" ? (l(), S(R(C.icon), {
+                                  key: 0,
+                                  class: "w-4 h-4 shrink-0 text-slate-400"
+                                })) : g("", !0),
+                                i("div", ma, [
+                                  T(o(te), { class: "truncate" }, {
+                                    default: k(() => [
+                                      j(y(C.label), 1)
+                                    ]),
+                                    _: 2
+                                  }, 1024),
+                                  C.description ? (l(), r("span", va, y(C.description), 1)) : g("", !0)
+                                ]),
+                                C.badge ? (l(), r("span", ha, y(C.badge), 1)) : g("", !0)
+                              ])
+                            ]),
+                            T(o(ae), { class: "shrink-0 flex items-center justify-center ml-2" }, {
+                              default: k(() => [...V[7] || (V[7] = [
+                                i("svg", {
+                                  class: "w-4 h-4 text-km-primary",
+                                  xmlns: "http://www.w3.org/2000/svg",
+                                  viewBox: "0 0 20 20",
+                                  fill: "currentColor"
+                                }, [
+                                  i("path", {
+                                    "fill-rule": "evenodd",
+                                    d: "M16.704 4.153a.75.75 0 0 1 .143 1.052l-8 10.5a.75.75 0 0 1-1.127.075l-4.5-4.5a.75.75 0 0 1 1.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 0 1 1.05-.143Z",
+                                    "clip-rule": "evenodd"
+                                  })
+                                ], -1)
+                              ])]),
+                              _: 1
+                            })
+                          ]),
+                          _: 2
+                        }, 1032, ["value", "disabled", "class"]))), 128)),
+                        (l(!0), r(H, null, q(x.value.groups, (C, W) => (l(), S(o(Ue), {
+                          key: W,
+                          class: "pt-1.5"
+                        }, {
+                          default: k(() => [
+                            T(o(Fe), { class: "px-2.5 py-1 text-[10px] font-bold uppercase tracking-wider text-slate-400 select-none" }, {
+                              default: k(() => [
+                                j(y(W), 1)
+                              ]),
+                              _: 2
+                            }, 1024),
+                            (l(!0), r(H, null, q(C, (Z) => (l(), S(o(ee), {
+                              key: String(Z.value),
+                              value: String(Z.value),
+                              disabled: Z.disabled,
+                              class: s([
+                                "relative flex items-center justify-between gap-2 select-none rounded-lg px-2.5 py-2 text-xs font-medium text-slate-700 outline-none transition-colors cursor-pointer",
+                                "data-[highlighted]:bg-slate-100 data-[highlighted]:text-slate-900",
+                                "data-[disabled]:pointer-events-none data-[disabled]:opacity-40",
+                                "data-[state=checked]:text-km-primary data-[state=checked]:font-semibold data-[state=checked]:bg-km-primary-light/40",
+                                e.itemClass
+                              ])
+                            }, {
+                              default: k(() => [
+                                i("div", ga, [
+                                  h(K.$slots, "item", {
+                                    option: Z,
+                                    selected: String(Z.value) === B.value
+                                  }, () => [
+                                    Z.icon && typeof Z.icon == "object" ? (l(), S(R(Z.icon), {
+                                      key: 0,
+                                      class: "w-4 h-4 shrink-0 text-slate-400"
+                                    })) : g("", !0),
+                                    i("div", ba, [
+                                      T(o(te), { class: "truncate" }, {
+                                        default: k(() => [
+                                          j(y(Z.label), 1)
+                                        ]),
+                                        _: 2
+                                      }, 1024),
+                                      Z.description ? (l(), r("span", pa, y(Z.description), 1)) : g("", !0)
+                                    ]),
+                                    Z.badge ? (l(), r("span", ya, y(Z.badge), 1)) : g("", !0)
+                                  ])
+                                ]),
+                                T(o(ae), { class: "shrink-0 flex items-center justify-center ml-2" }, {
+                                  default: k(() => [...V[8] || (V[8] = [
+                                    i("svg", {
+                                      class: "w-4 h-4 text-km-primary",
+                                      xmlns: "http://www.w3.org/2000/svg",
+                                      viewBox: "0 0 20 20",
+                                      fill: "currentColor"
+                                    }, [
+                                      i("path", {
+                                        "fill-rule": "evenodd",
+                                        d: "M16.704 4.153a.75.75 0 0 1 .143 1.052l-8 10.5a.75.75 0 0 1-1.127.075l-4.5-4.5a.75.75 0 0 1 1.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 0 1 1.05-.143Z",
+                                        "clip-rule": "evenodd"
+                                      })
+                                    ], -1)
+                                  ])]),
+                                  _: 1
+                                })
+                              ]),
+                              _: 2
+                            }, 1032, ["value", "disabled", "class"]))), 128))
+                          ]),
+                          _: 2
+                        }, 1024))), 128))
+                      ], 64)) : (l(!0), r(H, { key: 2 }, q(v.value, (C) => (l(), S(o(ee), {
+                        key: String(C.value),
+                        value: String(C.value),
+                        disabled: C.disabled,
+                        class: s([
+                          "relative flex items-center justify-between gap-2 select-none rounded-lg px-2.5 py-2 text-xs font-medium text-slate-700 outline-none transition-colors cursor-pointer",
+                          "data-[highlighted]:bg-slate-100 data-[highlighted]:text-slate-900",
+                          "data-[disabled]:pointer-events-none data-[disabled]:opacity-40",
+                          "data-[state=checked]:text-km-primary data-[state=checked]:font-semibold data-[state=checked]:bg-km-primary-light/40",
+                          e.itemClass
+                        ])
+                      }, {
+                        default: k(() => [
+                          i("div", ka, [
+                            h(K.$slots, "item", {
+                              option: C,
+                              selected: String(C.value) === B.value
+                            }, () => [
+                              C.icon && typeof C.icon == "object" ? (l(), S(R(C.icon), {
+                                key: 0,
+                                class: "w-4 h-4 shrink-0 text-slate-400"
+                              })) : g("", !0),
+                              i("div", wa, [
+                                T(o(te), { class: "truncate" }, {
+                                  default: k(() => [
+                                    j(y(C.label), 1)
+                                  ]),
+                                  _: 2
+                                }, 1024),
+                                C.description ? (l(), r("span", xa, y(C.description), 1)) : g("", !0)
+                              ]),
+                              C.badge ? (l(), r("span", $a, y(C.badge), 1)) : g("", !0)
+                            ])
+                          ]),
+                          T(o(ae), { class: "shrink-0 flex items-center justify-center ml-2" }, {
+                            default: k(() => [...V[9] || (V[9] = [
+                              i("svg", {
+                                class: "w-4 h-4 text-km-primary",
+                                xmlns: "http://www.w3.org/2000/svg",
+                                viewBox: "0 0 20 20",
+                                fill: "currentColor"
+                              }, [
+                                i("path", {
+                                  "fill-rule": "evenodd",
+                                  d: "M16.704 4.153a.75.75 0 0 1 .143 1.052l-8 10.5a.75.75 0 0 1-1.127.075l-4.5-4.5a.75.75 0 0 1 1.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 0 1 1.05-.143Z",
+                                  "clip-rule": "evenodd"
+                                })
+                              ], -1)
+                            ])]),
+                            _: 1
+                          })
+                        ]),
+                        _: 2
+                      }, 1032, ["value", "disabled", "class"]))), 128))
+                    ]),
+                    _: 3
+                  }),
+                  T(o(Qe), { class: "flex items-center justify-center py-1 text-slate-400 hover:text-slate-600 cursor-pointer" }, {
+                    default: k(() => [...V[10] || (V[10] = [
+                      i("svg", {
+                        class: "w-4 h-4",
+                        xmlns: "http://www.w3.org/2000/svg",
+                        viewBox: "0 0 20 20",
+                        fill: "currentColor"
+                      }, [
+                        i("path", {
+                          "fill-rule": "evenodd",
+                          d: "M5.23 7.21a.75.75 0 0 1 1.06.02L10 11.168l3.71-3.938a.75.75 0 1 1 1.08 1.04l-4.25 4.5a.75.75 0 0 1-1.08 0l-4.25-4.5a.75.75 0 0 1 .02-1.06Z",
+                          "clip-rule": "evenodd"
+                        })
+                      ], -1)
+                    ])]),
+                    _: 1
+                  })
+                ]),
+                _: 3
+              }, 8, ["side", "align", "side-offset", "class"])
+            ]),
+            _: 3
+          }, 8, ["to", "disabled"])
+        ]),
+        _: 3
+      }, 8, ["model-value", "disabled", "required", "name"]),
+      e.error ? (l(), r("div", {
+        key: 1,
+        id: `${p.value}-error`,
+        class: s([o(f).error(), "flex items-center gap-1 mt-0.5 animate-fadeIn"])
+      }, [
+        V[11] || (V[11] = i("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 20 20",
+          fill: "currentColor",
+          class: "w-3.5 h-3.5 shrink-0"
+        }, [
+          i("path", {
+            "fill-rule": "evenodd",
+            d: "M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-8-5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-1.5 0v-4.5A.75.75 0 0 1 10 5Zm0 10a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+            "clip-rule": "evenodd"
+          })
+        ], -1)),
+        i("span", null, y(e.error), 1)
+      ], 10, Ca)) : e.hint ? (l(), r("span", {
+        key: 2,
+        id: `${p.value}-hint`,
+        class: s(o(f).hint())
+      }, y(e.hint), 11, Ba)) : g("", !0)
+    ], 2));
+  }
+}), Va = /* @__PURE__ */ z({
+  __name: "KmSpinner",
+  props: {
+    size: { default: "sm" },
+    color: { default: "current" }
+  },
+  setup(e) {
+    return (t, a) => (l(), r("svg", {
+      "aria-hidden": "true",
+      class: s(o($e)({ size: e.size, color: e.color })),
+      viewBox: "0 0 100 101",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, [...a[0] || (a[0] = [
+      i("path", {
+        d: "M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z",
+        fill: "rgba(229, 231, 235, 0.3)"
+      }, null, -1),
+      i("path", {
+        d: "M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z",
+        fill: "currentColor"
+      }, null, -1)
+    ])], 2));
+  }
+}), Ka = /* @__PURE__ */ z({
+  __name: "KmStack",
+  props: {
+    as: { default: "div" },
+    direction: { default: "column" },
+    gap: { default: "md" },
+    align: { default: "stretch" },
+    justify: { default: "start" },
+    wrap: { default: !1 }
+  },
+  setup(e) {
+    const t = e, a = m(
+      () => zt({
+        direction: t.direction,
+        gap: t.gap,
+        align: t.align,
+        justify: t.justify,
+        wrap: t.wrap
+      })
+    );
+    return (n, u) => (l(), S(R(e.as), {
+      class: s(a.value)
+    }, {
+      default: k(() => [
+        h(n.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["class"]));
+  }
+}), Sa = ["for"], Ta = {
+  key: 0,
+  class: "text-km-danger ml-0.5",
+  "aria-hidden": "true"
+}, Ma = ["id", "value", "placeholder", "disabled", "required", "rows", "aria-invalid", "aria-describedby"], Pa = ["id"], Aa = ["id"], La = /* @__PURE__ */ z({
+  __name: "KmTextarea",
+  props: {
+    id: {},
+    modelValue: {},
+    label: {},
+    hint: {},
+    error: {},
+    placeholder: {},
+    disabled: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    rows: { default: 4 }
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: t }) {
+    const a = e, n = t, u = N("km-textarea"), d = m(() => a.id || u), c = _(), p = m(() => {
+      if (a.error) return `${d.value}-error`;
+      if (a.hint) return `${d.value}-hint`;
+    });
+    return (f, b) => (l(), r("label", {
+      class: s(o(c).root()),
+      for: d.value
+    }, [
+      e.label ? (l(), r("span", {
+        key: 0,
+        class: s(o(c).label())
+      }, [
+        j(y(e.label) + " ", 1),
+        e.required ? (l(), r("span", Ta, "*")) : g("", !0)
+      ], 2)) : g("", !0),
+      i("textarea", {
+        id: d.value,
+        class: s(o(Vt)()),
+        value: e.modelValue,
+        placeholder: e.placeholder,
+        disabled: e.disabled,
+        required: e.required,
+        rows: e.rows,
+        "aria-invalid": e.error ? "true" : void 0,
+        "aria-describedby": p.value,
+        onInput: b[0] || (b[0] = (M) => n("update:modelValue", M.target.value))
+      }, null, 42, Ma),
+      e.error ? (l(), r("div", {
+        key: 1,
+        id: `${d.value}-error`,
+        class: s([o(c).error(), "flex items-center gap-1 mt-0.5 animate-fadeIn"])
+      }, [
+        b[1] || (b[1] = i("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 20 20",
+          fill: "currentColor",
+          class: "w-3.5 h-3.5 shrink-0"
+        }, [
+          i("path", {
+            "fill-rule": "evenodd",
+            d: "M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-8-5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-1.5 0v-4.5A.75.75 0 0 1 10 5Zm0 10a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+            "clip-rule": "evenodd"
+          })
+        ], -1)),
+        i("span", null, y(e.error), 1)
+      ], 10, Pa)) : e.hint ? (l(), r("span", {
+        key: 2,
+        id: `${d.value}-hint`,
+        class: s(o(c).hint())
+      }, y(e.hint), 11, Aa)) : g("", !0)
+    ], 10, Sa));
+  }
+}), Ia = { key: 0 }, ja = ["cx", "cy", "stroke-dasharray"], Za = ["cx", "cy", "stroke-dasharray"], Ha = ["onClick"], Ra = {
+  key: 1,
+  class: "flex flex-row items-center justify-between w-full gap-4"
+}, Oa = ["onClick"], qa = {
+  key: 0,
+  width: "20",
+  height: "20",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "3",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "w-5 h-5"
+}, Ea = {
+  key: 1,
+  class: "text-sm font-bold"
+}, Da = { class: "flex flex-col" }, Na = {
+  key: 0,
+  class: "text-xs text-km-muted-foreground whitespace-nowrap max-w-[150px] truncate"
+}, Wa = ["onClick"], Ua = {
+  key: 0,
+  width: "20",
+  height: "20",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "3",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "w-5 h-5"
+}, Fa = {
+  key: 1,
+  class: "text-sm font-bold"
+}, Q = 20, le = 5, se = 7, as = /* @__PURE__ */ z({
+  __name: "KmStepper",
+  props: {
+    steps: {},
+    currentStep: {},
+    orientation: { default: "vertical" },
+    mode: { default: "auto" },
+    mobileLayout: { default: "circular" },
+    mobileLabel: { default: "" }
+  },
+  emits: ["step-click", "update:currentStep"],
+  setup(e, { emit: t }) {
+    const a = e, n = t;
+    function u($) {
+      n("step-click", $ + 1), n("update:currentStep", $ + 1);
+    }
+    const d = E(!1), c = E(null);
+    fe(() => {
+      if (a.mode === "auto") {
+        d.value = window.innerWidth < 640;
+        const $ = () => {
+          d.value = window.innerWidth < 640;
+        };
+        window.addEventListener("resize", $), be(() => {
+          window.removeEventListener("resize", $);
+        });
+      }
+    });
+    const p = m(() => a.mode === "mobile" ? !0 : a.mode === "desktop" ? !1 : d.value), f = 2 * Math.PI * Q, b = (Q + le) * 2, M = m(() => {
+      const $ = a.steps.length;
+      return (f - $ * se) / $;
+    }), w = m(() => {
+      const $ = Math.min(Math.max(a.currentStep, 1), a.steps.length);
+      return Array.from(
+        { length: $ },
+        (L, P) => `${M.value} ${P < $ - 1 ? se : f}`
+      ).join(" ");
+    }), v = m(() => {
+      var L;
+      const $ = Math.min(Math.max(a.currentStep - 1, 0), a.steps.length - 1);
+      return ((L = a.steps[$]) == null ? void 0 : L.title) || "";
+    }), x = m(() => a.mobileLabel ? a.mobileLabel : `Paso ${a.currentStep} de ${a.steps.length}`);
+    function B($) {
+      const L = $ + 1;
+      return L < a.currentStep ? "completed" : L === a.currentStep ? "active" : "upcoming";
+    }
+    return ($, L) => (l(), r("div", {
+      ref_key: "containerRef",
+      ref: c,
+      class: "w-full"
+    }, [
+      p.value ? (l(), r("div", Ia, [
+        e.mobileLayout === "circular" ? (l(), r("div", {
+          key: 0,
+          class: s(o(I)().mobileRoot())
+        }, [
+          i("div", {
+            class: s(o(I)().mobileInfo())
+          }, [
+            i("span", {
+              class: s(o(I)().mobileTitle())
+            }, y(v.value), 3),
+            i("span", {
+              class: s(o(I)().mobileLabel())
+            }, y(x.value), 3)
+          ], 2),
+          i("div", {
+            class: s(o(I)().mobileProgress()),
+            style: J({ width: `${b}px`, height: `${b}px` })
+          }, [
+            (l(), r("svg", {
+              width: b,
+              height: b,
+              class: "-rotate-90"
+            }, [
+              i("circle", {
+                cx: b / 2,
+                cy: b / 2,
+                r: Q,
+                fill: "none",
+                class: "stroke-km-border",
+                "stroke-width": le,
+                "stroke-dasharray": `${M.value} ${se}`,
+                "stroke-linecap": "square"
+              }, null, 8, ja),
+              i("circle", {
+                cx: b / 2,
+                cy: b / 2,
+                r: Q,
+                fill: "none",
+                class: "stroke-km-primary",
+                "stroke-width": le,
+                "stroke-dasharray": w.value,
+                "stroke-linecap": "square"
+              }, null, 8, Za)
+            ])),
+            i("span", {
+              class: s(o(I)().mobilePercentText())
+            }, y(e.currentStep) + "/" + y(e.steps.length), 3)
+          ], 6)
+        ], 2)) : e.mobileLayout === "horizontal" ? (l(), r("div", {
+          key: 1,
+          class: s(o(I)().mobileHorizRoot())
+        }, [
+          i("div", {
+            class: s(o(I)().mobileHorizHeader())
+          }, [
+            i("span", {
+              class: s(o(I)().mobileHorizTitle())
+            }, y(v.value), 3),
+            i("span", {
+              class: s(o(I)().mobileHorizSteps())
+            }, y(e.currentStep) + "/" + y(e.steps.length), 3)
+          ], 2),
+          i("div", {
+            class: s(o(I)().mobileHorizTrack())
+          }, [
+            (l(!0), r(H, null, q(e.steps.length, (P) => (l(), r("div", {
+              key: P,
+              class: s(["cursor-pointer transition-all", [
+                o(I)().mobileHorizBar(),
+                P <= e.currentStep ? "bg-km-primary" : "bg-km-border"
+              ]]),
+              onClick: (A) => u(P - 1)
+            }, null, 10, Ha))), 128))
+          ], 2)
+        ], 2)) : g("", !0)
+      ])) : e.orientation === "horizontal" ? (l(), r("ol", Ra, [
+        (l(!0), r(H, null, q(e.steps, (P, A) => (l(), r("li", {
+          key: P.title,
+          class: "flex items-center flex-1 last:flex-none gap-4"
+        }, [
+          i("div", {
+            class: "flex items-center gap-3 shrink-0 cursor-pointer select-none transition-all group hover:opacity-85",
+            onClick: (re) => u(A)
+          }, [
+            i("div", {
+              class: s(o(I)({ state: B(A) }).stepCircle())
+            }, [
+              B(A) === "completed" ? (l(), r("svg", qa, [...L[0] || (L[0] = [
+                i("polyline", { points: "20 6 9 17 4 12" }, null, -1)
+              ])])) : (l(), r("span", Ea, y(A + 1), 1))
+            ], 2),
+            i("div", Da, [
+              i("span", {
+                class: s([o(I)({ state: B(A) }).title(), "text-sm font-bold whitespace-nowrap group-hover:text-km-primary transition-colors"])
+              }, y(P.title), 3),
+              P.description ? (l(), r("span", Na, y(P.description), 1)) : g("", !0)
+            ])
+          ], 8, Oa),
+          A < e.steps.length - 1 ? (l(), r("div", {
+            key: 0,
+            class: s(["flex-1 h-[3px] rounded-full transition-all duration-300", [
+              B(A) === "completed" ? "bg-km-success" : B(A) === "active" ? "bg-gradient-to-r from-km-primary to-km-border" : "bg-km-border"
+            ]])
+          }, null, 2)) : g("", !0)
+        ]))), 128))
+      ])) : (l(), r("ol", {
+        key: 2,
+        class: s(o(I)({ orientation: "vertical" }).root())
+      }, [
+        (l(!0), r(H, null, q(e.steps, (P, A) => (l(), r("li", {
+          key: P.title,
+          class: s(o(I)().step())
+        }, [
+          i("div", {
+            class: s([o(I)().stepContainer(), "cursor-pointer select-none transition-all hover:opacity-85"]),
+            onClick: (re) => u(A)
+          }, [
+            i("div", {
+              class: s(o(I)({ state: B(A) }).stepCircle())
+            }, [
+              B(A) === "completed" ? (l(), r("svg", Ua, [...L[1] || (L[1] = [
+                i("polyline", { points: "20 6 9 17 4 12" }, null, -1)
+              ])])) : (l(), r("span", Fa, y(A + 1), 1))
+            ], 2),
+            A < e.steps.length - 1 ? (l(), r("div", {
+              key: 0,
+              class: s([
+                o(I)({ state: B(A), orientation: "vertical" }).connector(),
+                B(A) === "active" ? "bg-gradient-to-b from-km-primary to-km-border" : ""
+              ])
+            }, null, 2)) : g("", !0)
+          ], 10, Wa),
+          i("div", {
+            class: s(o(I)().content())
+          }, [
+            i("span", {
+              class: s(o(I)({ state: B(A) }).title())
+            }, y(P.title), 3),
+            P.description ? (l(), r("span", {
+              key: 0,
+              class: s(o(I)().description())
+            }, y(P.description), 3)) : g("", !0)
+          ], 2)
+        ], 2))), 128))
+      ], 2))
+    ], 512));
+  }
+}), Qa = ["aria-checked", "aria-disabled", "onKeydown"], ls = /* @__PURE__ */ z({
+  __name: "KmToggleSwitch",
+  props: {
+    modelValue: { type: Boolean, default: !1 },
+    label: { default: "" },
+    size: { default: "medium" },
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: t }) {
+    const a = e, n = t, u = m({
+      get: () => a.modelValue,
+      set: (p) => {
+        a.disabled || (n("update:modelValue", p), n("change", p));
+      }
+    });
+    function d() {
+      a.disabled || (u.value = !u.value);
+    }
+    const c = m(
+      () => Kt({
+        size: a.size,
+        checked: u.value,
+        disabled: a.disabled
+      })
+    );
+    return (p, f) => (l(), r("div", {
+      class: s(c.value.root())
+    }, [
+      e.label ? (l(), r("span", {
+        key: 0,
+        class: s(c.value.label()),
+        onClick: d
+      }, y(e.label), 3)) : g("", !0),
+      i("div", {
+        class: s(c.value.track()),
+        onClick: d,
+        role: "checkbox",
+        "aria-checked": u.value,
+        "aria-disabled": e.disabled,
+        tabindex: "0",
+        onKeydown: U(D(d, ["prevent"]), ["space"])
+      }, [
+        i("div", {
+          class: s(c.value.thumb())
+        }, null, 2)
+      ], 42, Qa)
+    ], 2));
+  }
+}), Ja = /* @__PURE__ */ z({
+  __name: "KmScrollArea",
+  props: {
+    type: { default: "auto" },
+    orientation: { default: "vertical" },
+    maxHeight: {},
+    height: {},
+    maxWidth: {},
+    viewportClass: {},
+    class: {},
+    size: { default: "thin" }
+  },
+  setup(e) {
+    const t = e, a = m(() => {
+      if (t.maxHeight)
+        return typeof t.maxHeight == "number" ? `${t.maxHeight}px` : t.maxHeight;
+    }), n = m(() => {
+      if (t.height)
+        return typeof t.height == "number" ? `${t.height}px` : t.height;
+    }), u = m(() => {
+      if (t.maxWidth)
+        return typeof t.maxWidth == "number" ? `${t.maxWidth}px` : t.maxWidth;
+    }), d = m(() => {
+      const f = {};
+      return a.value && (f.maxHeight = a.value), n.value && (f.height = n.value), u.value && (f.maxWidth = u.value), f;
+    }), c = m(() => {
+      const f = {};
+      return a.value && (f.maxHeight = a.value), n.value && (f.height = n.value), f;
+    }), p = m(() => {
+      switch (t.size) {
+        case "thin":
+          return {
+            v: "w-2 data-[orientation=vertical]:w-2 p-0.5",
+            h: "h-2 data-[orientation=horizontal]:h-2 data-[orientation=horizontal]:flex-col p-0.5"
+          };
+        case "wide":
+          return {
+            v: "w-3.5 data-[orientation=vertical]:w-3.5 p-1",
+            h: "h-3.5 data-[orientation=horizontal]:h-3.5 data-[orientation=horizontal]:flex-col p-1"
+          };
+        case "normal":
+        default:
+          return {
+            v: "w-2.5 data-[orientation=vertical]:w-2.5 p-0.5",
+            h: "h-2.5 data-[orientation=horizontal]:h-2.5 data-[orientation=horizontal]:flex-col p-0.5"
+          };
+      }
+    });
+    return (f, b) => (l(), S(o(Je), {
+      type: e.type,
+      "scroll-hide-delay": 600,
+      class: s(["relative overflow-hidden flex flex-col", t.class]),
+      style: J(d.value)
+    }, {
+      default: k(() => [
+        T(o(Ge), {
+          class: s(["h-full w-full max-h-[inherit] rounded-[inherit] outline-none", e.viewportClass]),
+          style: J(c.value)
+        }, {
+          default: k(() => [
+            h(f.$slots, "default")
+          ]),
+          _: 3
+        }, 8, ["class", "style"]),
+        e.orientation === "vertical" || e.orientation === "both" ? (l(), S(o(de), {
+          key: 0,
+          orientation: "vertical",
+          class: s(["flex select-none touch-none transition-colors duration-150 ease-out bg-transparent hover:bg-black/[0.03] dark:hover:bg-white/[0.04] z-20", p.value.v])
+        }, {
+          default: k(() => [
+            T(o(ue), { class: "relative flex-1 rounded-full bg-slate-300/90 hover:bg-slate-400 active:bg-slate-500 dark:bg-slate-500/70 dark:hover:bg-slate-400 dark:active:bg-slate-300 transition-colors" })
+          ]),
+          _: 1
+        }, 8, ["class"])) : g("", !0),
+        e.orientation === "horizontal" || e.orientation === "both" ? (l(), S(o(de), {
+          key: 1,
+          orientation: "horizontal",
+          class: s(["flex select-none touch-none transition-colors duration-150 ease-out bg-transparent hover:bg-black/[0.03] dark:hover:bg-white/[0.04] z-20", p.value.h])
+        }, {
+          default: k(() => [
+            T(o(ue), { class: "relative flex-1 rounded-full bg-slate-300/90 hover:bg-slate-400 active:bg-slate-500 dark:bg-slate-500/70 dark:hover:bg-slate-400 dark:active:bg-slate-300 transition-colors" })
+          ]),
+          _: 1
+        }, 8, ["class"])) : g("", !0),
+        T(o(Xe), { class: "bg-transparent" })
+      ]),
+      _: 3
+    }, 8, ["type", "class", "style"]));
+  }
+}), Ga = /* @__PURE__ */ z({
+  __name: "KmPopover",
+  props: {
+    trigger: { default: "click" },
+    placement: {},
+    side: {},
+    align: {},
+    sideOffset: { default: 8 },
+    alignOffset: { default: 0 },
+    arrow: { type: Boolean, default: !0 },
+    arrowPadding: { default: 10 },
+    openDelay: { default: 150 },
+    closeDelay: { default: 200 },
+    disabled: { type: Boolean, default: !1 },
+    modal: { type: Boolean, default: !1 },
+    portal: { type: Boolean, default: !0 },
+    to: {},
+    contentClass: {},
+    arrowClass: {},
+    open: { type: Boolean },
+    defaultOpen: { type: Boolean }
+  },
+  emits: ["update:open"],
+  setup(e, { emit: t }) {
+    const a = e, n = t, u = E(a.defaultOpen ?? !1);
+    ce(
+      () => a.open,
+      (b) => {
+        b !== void 0 && (u.value = b);
+      },
+      { immediate: !0 }
+    );
+    const d = (b) => {
+      u.value = b, n("update:open", b);
+    }, c = () => {
+      d(!1);
+    }, p = m(() => a.side ? a.side : a.placement ? a.placement.split("-")[0] : "bottom"), f = m(() => {
+      if (a.align) return a.align;
+      if (a.placement) {
+        const b = a.placement.split("-");
+        if (b[1] === "start") return "start";
+        if (b[1] === "end") return "end";
+      }
+      return "center";
+    });
+    return (b, M) => e.trigger === "hover" ? (l(), S(o(Ye), {
+      key: 0,
+      open: u.value,
+      "default-open": e.defaultOpen,
+      "open-delay": e.openDelay,
+      "close-delay": e.closeDelay,
+      "onUpdate:open": d
+    }, {
+      default: k(() => [
+        T(o(_e), {
+          "as-child": "",
+          disabled: e.disabled
+        }, {
+          default: k(() => [
+            h(b.$slots, "trigger", { open: u.value })
+          ]),
+          _: 3
+        }, 8, ["disabled"]),
+        T(o(et), {
+          to: e.to,
+          disabled: !e.portal
+        }, {
+          default: k(() => [
+            T(o(tt), {
+              side: p.value,
+              align: f.value,
+              "side-offset": e.sideOffset,
+              "align-offset": e.alignOffset,
+              "arrow-padding": e.arrowPadding,
+              class: s([
+                "z-[9999] rounded-2xl bg-white border border-slate-200/80 p-3 shadow-xl shadow-slate-900/10 outline-none select-none text-slate-800",
+                "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+                "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+                "duration-150",
+                e.contentClass
+              ])
+            }, {
+              default: k(() => [
+                h(b.$slots, "content", {
+                  close: c,
+                  open: u.value
+                }),
+                h(b.$slots, "default", {
+                  close: c,
+                  open: u.value
+                }),
+                e.arrow ? (l(), S(o(at), {
+                  key: 0,
+                  class: s([
+                    "fill-white stroke-slate-200/80 stroke-1",
+                    e.arrowClass
+                  ]),
+                  width: 12,
+                  height: 6
+                }, null, 8, ["class"])) : g("", !0)
+              ]),
+              _: 3
+            }, 8, ["side", "align", "side-offset", "align-offset", "arrow-padding", "class"])
+          ]),
+          _: 3
+        }, 8, ["to", "disabled"])
+      ]),
+      _: 3
+    }, 8, ["open", "default-open", "open-delay", "close-delay"])) : (l(), S(o(lt), {
+      key: 1,
+      open: u.value,
+      "default-open": e.defaultOpen,
+      modal: e.modal,
+      "onUpdate:open": d
+    }, {
+      default: k(() => [
+        T(o(st), {
+          "as-child": "",
+          disabled: e.disabled
+        }, {
+          default: k(() => [
+            h(b.$slots, "trigger", { open: u.value })
+          ]),
+          _: 3
+        }, 8, ["disabled"]),
+        T(o(nt), {
+          to: e.to,
+          disabled: !e.portal
+        }, {
+          default: k(() => [
+            T(o(ot), {
+              side: p.value,
+              align: f.value,
+              "side-offset": e.sideOffset,
+              "align-offset": e.alignOffset,
+              "arrow-padding": e.arrowPadding,
+              class: s([
+                "z-[9999] rounded-2xl bg-white border border-slate-200/80 p-3 shadow-xl shadow-slate-900/10 outline-none select-none text-slate-800",
+                "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+                "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+                "duration-150",
+                e.contentClass
+              ])
+            }, {
+              default: k(() => [
+                h(b.$slots, "content", {
+                  close: c,
+                  open: u.value
+                }),
+                h(b.$slots, "default", {
+                  close: c,
+                  open: u.value
+                }),
+                e.arrow ? (l(), S(o(rt), {
+                  key: 0,
+                  class: s([
+                    "fill-white stroke-slate-200/80 stroke-1",
+                    e.arrowClass
+                  ]),
+                  width: 12,
+                  height: 6
+                }, null, 8, ["class"])) : g("", !0)
+              ]),
+              _: 3
+            }, 8, ["side", "align", "side-offset", "align-offset", "arrow-padding", "class"])
+          ]),
+          _: 3
+        }, 8, ["to", "disabled"])
+      ]),
+      _: 3
+    }, 8, ["open", "default-open", "modal"]));
+  }
+}), Xa = /* @__PURE__ */ z({
+  __name: "KmHeading",
+  props: {
+    as: { default: "h2" },
+    size: { default: "xl" },
+    tone: { default: "default" },
+    weight: {},
+    align: { default: "left" },
+    tracking: {},
+    truncate: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const t = e, a = m(
+      () => Ce({
+        size: t.size,
+        tone: t.tone,
+        weight: t.weight,
+        align: t.align,
+        tracking: t.tracking,
+        truncate: t.truncate
+      })
+    );
+    return (n, u) => (l(), S(R(e.as), {
+      class: s(a.value)
+    }, {
+      default: k(() => [
+        h(n.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["class"]));
+  }
+}), Ya = /* @__PURE__ */ z({
+  __name: "KmText",
+  props: {
+    as: { default: "p" },
+    size: { default: "sm" },
+    tone: { default: "default" },
+    weight: {},
+    align: { default: "left" },
+    transform: {},
+    italic: { type: Boolean, default: !1 },
+    underline: { type: Boolean, default: !1 },
+    strikethrough: { type: Boolean, default: !1 },
+    mono: { type: Boolean, default: !1 },
+    truncate: { type: Boolean, default: !1 },
+    lineClamp: {}
+  },
+  setup(e) {
+    const t = e, a = m(
+      () => Be({
+        size: t.size,
+        tone: t.tone,
+        weight: t.weight,
+        align: t.align,
+        transform: t.transform,
+        italic: t.italic,
+        underline: t.underline,
+        strikethrough: t.strikethrough,
+        mono: t.mono,
+        truncate: t.truncate,
+        lineClamp: t.lineClamp
+      })
+    );
+    return (n, u) => (l(), S(R(e.as), {
+      class: s(a.value)
+    }, {
+      default: k(() => [
+        h(n.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["class"]));
+  }
+}), _a = ["for", "data-disabled"], el = ["id", "name", "value", "checked", "disabled", "required"], tl = ["data-state", "data-disabled", "aria-checked", "aria-disabled", "onKeydown"], al = ["data-visible"], ll = {
+  key: 0,
+  class: "text-km-danger ml-0.5",
+  "aria-hidden": "true"
+}, sl = /* @__PURE__ */ z({
+  __name: "KmCheckbox",
+  props: {
+    modelValue: { type: [Boolean, Array] },
+    value: {},
+    label: {},
+    description: {},
+    indeterminate: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    name: {},
+    id: {},
+    size: { default: "md" },
+    tone: { default: "primary" }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: t }) {
+    const a = e, n = t, u = N("km-checkbox"), d = m(() => a.id || u), c = m(() => Array.isArray(a.modelValue) ? a.modelValue.includes(a.value) : !!a.modelValue), p = m(() => a.indeterminate ? "indeterminate" : c.value ? "checked" : "unchecked"), f = ze({
+      size: a.size,
+      tone: a.tone
+    }), b = (w) => {
+      if (a.disabled) return;
+      const v = w.target;
+      if (Array.isArray(a.modelValue)) {
+        const x = [...a.modelValue];
+        if (v.checked)
+          x.includes(a.value) || x.push(a.value);
+        else {
+          const B = x.indexOf(a.value);
+          B !== -1 && x.splice(B, 1);
+        }
+        n("update:modelValue", x);
+      } else
+        n("update:modelValue", v.checked);
+      n("change", w);
+    }, M = () => {
+      if (a.disabled) return;
+      const w = !c.value;
+      if (Array.isArray(a.modelValue)) {
+        const v = [...a.modelValue];
+        if (w)
+          v.includes(a.value) || v.push(a.value);
+        else {
+          const x = v.indexOf(a.value);
+          x !== -1 && v.splice(x, 1);
+        }
+        n("update:modelValue", v);
+      } else
+        n("update:modelValue", w);
+    };
+    return (w, v) => (l(), r("label", {
+      for: d.value,
+      class: s(o(f).root()),
+      "data-disabled": e.disabled ? "true" : void 0
+    }, [
+      i("div", {
+        class: s(o(f).controlWrapper())
+      }, [
+        i("input", {
+          id: d.value,
+          type: "checkbox",
+          name: e.name,
+          value: e.value,
+          checked: c.value,
+          disabled: e.disabled,
+          required: e.required,
+          class: "peer sr-only",
+          onChange: b
+        }, null, 40, el),
+        i("div", {
+          class: s(o(f).control()),
+          "data-state": p.value,
+          "data-disabled": e.disabled ? "true" : void 0,
+          tabindex: "0",
+          role: "checkbox",
+          "aria-checked": e.indeterminate ? "mixed" : c.value,
+          "aria-disabled": e.disabled,
+          onKeydown: U(D(M, ["prevent"]), ["space"])
+        }, [
+          e.indeterminate ? (l(), r("svg", {
+            key: 1,
+            class: s(o(f).icon()),
+            "data-visible": "true",
+            viewBox: "0 0 16 16",
+            fill: "none",
+            stroke: "currentColor",
+            "stroke-width": "2.5",
+            "stroke-linecap": "round"
+          }, [...v[1] || (v[1] = [
+            i("line", {
+              x1: "3.5",
+              y1: "8",
+              x2: "12.5",
+              y2: "8"
+            }, null, -1)
+          ])], 2)) : (l(), r("svg", {
+            key: 0,
+            class: s(o(f).icon()),
+            "data-visible": c.value ? "true" : void 0,
+            viewBox: "0 0 16 16",
+            fill: "none",
+            stroke: "currentColor",
+            "stroke-width": "2.5",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round"
+          }, [...v[0] || (v[0] = [
+            i("polyline", { points: "3.5 8.5 6.5 11.5 12.5 4.5" }, null, -1)
+          ])], 10, al))
+        ], 42, tl)
+      ], 2),
+      e.label || e.description || w.$slots.default || w.$slots.description ? (l(), r("div", {
+        key: 0,
+        class: s(o(f).labelWrapper())
+      }, [
+        e.label || w.$slots.default ? (l(), r("span", {
+          key: 0,
+          class: s(o(f).label())
+        }, [
+          h(w.$slots, "default", {}, () => [
+            j(y(e.label), 1)
+          ]),
+          e.required ? (l(), r("span", ll, "*")) : g("", !0)
+        ], 2)) : g("", !0),
+        e.description || w.$slots.description ? (l(), r("span", {
+          key: 1,
+          class: s(o(f).description())
+        }, [
+          h(w.$slots, "description", {}, () => [
+            j(y(e.description), 1)
+          ])
+        ], 2)) : g("", !0)
+      ], 2)) : g("", !0)
+    ], 10, _a));
+  }
+}), nl = ["for", "data-state", "data-disabled"], ol = ["id", "name", "value", "checked", "disabled"], rl = ["data-state", "data-disabled", "aria-checked", "aria-disabled", "onKeydown"], il = ["data-visible"], dl = { class: "flex-1 min-w-0 flex flex-col gap-1 select-none" }, ul = { class: "flex items-center justify-between gap-2" }, cl = ["for", "data-disabled"], fl = ["id", "name", "value", "checked", "disabled"], ml = ["data-state", "data-disabled", "aria-checked", "aria-disabled", "onKeydown"], vl = ["data-visible"], hl = /* @__PURE__ */ z({
+  __name: "KmRadio",
+  props: {
+    modelValue: {},
+    value: {},
+    label: {},
+    description: {},
+    disabled: { type: Boolean, default: !1 },
+    name: {},
+    id: {},
+    size: { default: void 0 },
+    tone: { default: void 0 },
+    variant: { default: void 0 }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: t }) {
+    const a = O("kmRadioGroup", null), n = e, u = t, d = N("km-radio"), c = m(() => n.id || d), p = m(() => n.name || o(a == null ? void 0 : a.name)), f = m(
+      () => n.disabled || o(a == null ? void 0 : a.disabled) || !1
+    ), b = m(
+      () => n.size || o(a == null ? void 0 : a.size) || "md"
+    ), M = m(
+      () => n.tone || o(a == null ? void 0 : a.tone) || "primary"
+    ), w = m(
+      () => n.variant || o(a == null ? void 0 : a.variant) || "default"
+    ), v = m(() => a ? o(a.modelValue) === n.value : n.modelValue === n.value), x = m(
+      () => Ve({
+        size: b.value,
+        tone: M.value
+      })
+    ), B = () => {
+      f.value || (a ? a.updateValue(n.value) : u("update:modelValue", n.value), u("change", n.value));
+    };
+    return ($, L) => w.value === "card" ? (l(), r("label", {
+      key: 0,
+      for: c.value,
+      class: s(o(Ke)()),
+      "data-state": v.value ? "checked" : "unchecked",
+      "data-disabled": f.value ? "true" : void 0
+    }, [
+      i("div", {
+        class: s(x.value.controlWrapper())
+      }, [
+        i("input", {
+          id: c.value,
+          type: "radio",
+          name: p.value,
+          value: e.value,
+          checked: v.value,
+          disabled: f.value,
+          class: "peer sr-only",
+          onChange: B
+        }, null, 40, ol),
+        i("div", {
+          class: s(x.value.control()),
+          "data-state": v.value ? "checked" : "unchecked",
+          "data-disabled": f.value ? "true" : void 0,
+          tabindex: "0",
+          role: "radio",
+          "aria-checked": v.value,
+          "aria-disabled": f.value,
+          onKeydown: U(D(B, ["prevent"]), ["space"])
+        }, [
+          i("div", {
+            class: s(x.value.indicator()),
+            "data-visible": v.value ? "true" : void 0
+          }, null, 10, il)
+        ], 42, rl)
+      ], 2),
+      i("div", dl, [
+        i("div", ul, [
+          e.label || $.$slots.default ? (l(), r("span", {
+            key: 0,
+            class: s(x.value.label())
+          }, [
+            h($.$slots, "default", {}, () => [
+              j(y(e.label), 1)
+            ])
+          ], 2)) : g("", !0),
+          h($.$slots, "badge")
+        ]),
+        e.description || $.$slots.description ? (l(), r("span", {
+          key: 0,
+          class: s(x.value.description())
+        }, [
+          h($.$slots, "description", {}, () => [
+            j(y(e.description), 1)
+          ])
+        ], 2)) : g("", !0),
+        h($.$slots, "extra")
+      ])
+    ], 10, nl)) : (l(), r("label", {
+      key: 1,
+      for: c.value,
+      class: s(x.value.root()),
+      "data-disabled": f.value ? "true" : void 0
+    }, [
+      i("div", {
+        class: s(x.value.controlWrapper())
+      }, [
+        i("input", {
+          id: c.value,
+          type: "radio",
+          name: p.value,
+          value: e.value,
+          checked: v.value,
+          disabled: f.value,
+          class: "peer sr-only",
+          onChange: B
+        }, null, 40, fl),
+        i("div", {
+          class: s(x.value.control()),
+          "data-state": v.value ? "checked" : "unchecked",
+          "data-disabled": f.value ? "true" : void 0,
+          tabindex: "0",
+          role: "radio",
+          "aria-checked": v.value,
+          "aria-disabled": f.value,
+          onKeydown: U(D(B, ["prevent"]), ["space"])
+        }, [
+          i("div", {
+            class: s(x.value.indicator()),
+            "data-visible": v.value ? "true" : void 0
+          }, null, 10, vl)
+        ], 42, ml)
+      ], 2),
+      e.label || e.description || $.$slots.default || $.$slots.description ? (l(), r("div", {
+        key: 0,
+        class: s(x.value.labelWrapper())
+      }, [
+        e.label || $.$slots.default ? (l(), r("span", {
+          key: 0,
+          class: s(x.value.label())
+        }, [
+          h($.$slots, "default", {}, () => [
+            j(y(e.label), 1)
+          ])
+        ], 2)) : g("", !0),
+        e.description || $.$slots.description ? (l(), r("span", {
+          key: 1,
+          class: s(x.value.description())
+        }, [
+          h($.$slots, "description", {}, () => [
+            j(y(e.description), 1)
+          ])
+        ], 2)) : g("", !0)
+      ], 2)) : g("", !0)
+    ], 10, cl));
+  }
+}), gl = /* @__PURE__ */ z({
+  __name: "KmRadioGroup",
+  props: {
+    modelValue: {},
+    name: {},
+    direction: { default: "column" },
+    gap: { default: "md" },
+    disabled: { type: Boolean, default: !1 },
+    size: { default: "md" },
+    tone: { default: "primary" },
+    variant: { default: "default" }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: t }) {
+    const a = e, n = t, u = N("km-radio-group"), d = m(() => a.name || u), c = (f) => {
+      n("update:modelValue", f), n("change", f);
+    };
+    Y(
+      "kmRadioGroup",
+      pe({
+        modelValue: F(a, "modelValue"),
+        updateValue: c,
+        name: d,
+        disabled: F(a, "disabled"),
+        size: F(a, "size"),
+        tone: F(a, "tone"),
+        variant: F(a, "variant")
+      })
+    );
+    const p = m(() => {
+      const f = a.direction === "row", b = {
+        sm: "gap-2",
+        md: "gap-3",
+        lg: "gap-4"
+      }[a.gap];
+      return [
+        "flex",
+        f ? "flex-row flex-wrap" : "flex-col",
+        b
+      ];
+    });
+    return (f, b) => (l(), r("div", {
+      role: "radiogroup",
+      class: s(p.value)
+    }, [
+      h(f.$slots, "default")
+    ], 2));
+  }
+}), bl = ["data-disabled"], pl = ["for"], yl = {
+  key: 0,
+  class: "text-km-danger ml-0.5",
+  "aria-hidden": "true"
+}, kl = ["id"], wl = ["id"], xl = /* @__PURE__ */ z({
+  __name: "KmFormControl",
+  props: {
+    id: {},
+    label: {},
+    hint: {},
+    error: {},
+    required: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const t = e, a = N("km-form-control"), n = m(() => t.id || a), u = _(), d = m(() => `${n.value}-hint`), c = m(() => `${n.value}-error`), p = m(() => {
+      if (t.error) return c.value;
+      if (t.hint) return d.value;
+    });
+    return (f, b) => (l(), r("div", {
+      class: s(o(u).root()),
+      "data-disabled": e.disabled ? "true" : void 0
+    }, [
+      e.label || f.$slots.label ? (l(), r("label", {
+        key: 0,
+        for: n.value,
+        class: s(o(u).label())
+      }, [
+        h(f.$slots, "label", {}, () => [
+          j(y(e.label), 1)
+        ]),
+        e.required ? (l(), r("span", yl, "*")) : g("", !0)
+      ], 10, pl)) : g("", !0),
+      i("div", null, [
+        h(f.$slots, "default", {
+          id: n.value,
+          error: e.error,
+          disabled: e.disabled,
+          describedBy: p.value
+        })
+      ]),
+      e.error || f.$slots.error ? (l(), r("div", {
+        key: 1,
+        id: c.value,
+        class: s([o(u).error(), "flex items-center gap-1 mt-0.5 animate-fadeIn"]),
+        role: "alert"
+      }, [
+        b[0] || (b[0] = i("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 20 20",
+          fill: "currentColor",
+          class: "w-3.5 h-3.5 shrink-0"
+        }, [
+          i("path", {
+            "fill-rule": "evenodd",
+            d: "M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-8-5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-1.5 0v-4.5A.75.75 0 0 1 10 5Zm0 10a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+            "clip-rule": "evenodd"
+          })
+        ], -1)),
+        i("span", null, [
+          h(f.$slots, "error", {}, () => [
+            j(y(e.error), 1)
+          ])
+        ])
+      ], 10, kl)) : e.hint || f.$slots.hint ? (l(), r("span", {
+        key: 2,
+        id: d.value,
+        class: s(o(u).hint())
+      }, [
+        h(f.$slots, "hint", {}, () => [
+          j(y(e.hint), 1)
+        ])
+      ], 10, wl)) : g("", !0)
+    ], 10, bl));
+  }
+}), $l = /* @__PURE__ */ z({
+  __name: "KmHtml",
+  props: {
+    content: { default: "" },
+    as: { default: "div" },
+    size: { default: "sm" },
+    tone: { default: "default" },
+    lineClamp: { default: void 0 }
+  },
+  setup(e) {
+    const t = e, a = m(() => !t.lineClamp || t.lineClamp === "none" ? "" : `line-clamp-${t.lineClamp}`), n = m(() => [
+      Se({
+        size: t.size,
+        tone: t.tone
+      }),
+      a.value
+    ]);
+    return (u, d) => e.content ? (l(), S(R(e.as), {
+      key: 0,
+      class: s(n.value),
+      innerHTML: e.content
+    }, null, 8, ["class", "innerHTML"])) : (l(), S(R(e.as), {
+      key: 1,
+      class: s(n.value)
+    }, {
+      default: k(() => [
+        h(u.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["class"]));
+  }
+}), Cl = /* @__PURE__ */ z({
+  inheritAttrs: !1,
+  __name: "KmSkeleton",
+  props: {
+    as: { default: "div" },
+    variant: { default: "default" },
+    tone: { default: "default" },
+    animation: { default: "pulse" },
+    width: {},
+    height: {},
+    rounded: {},
+    count: { default: 1 },
+    loading: { type: Boolean, default: !0 },
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = ye(), n = m(
+      () => St({
+        variant: t.variant,
+        tone: t.tone,
+        animation: t.animation,
+        class: [t.class, a.class]
+      })
+    ), u = m(() => {
+      const d = { ...a.style };
+      return t.width && (d.width = typeof t.width == "number" ? `${t.width}px` : t.width), t.height && (d.height = typeof t.height == "number" ? `${t.height}px` : t.height), t.rounded && (d.borderRadius = t.rounded), d;
+    });
+    return (d, c) => !e.loading && d.$slots.default ? h(d.$slots, "default", {}, void 0, void 0, 0) : e.count > 1 ? (l(!0), r(H, { key: 1 }, q(e.count, (p) => (l(), S(R(e.as), G({ key: p }, { ref_for: !0 }, o(a), {
+      class: n.value,
+      style: u.value,
+      "aria-hidden": "true"
+    }), null, 16, ["class", "style"]))), 128)) : (l(), S(R(e.as), G({ key: 2 }, o(a), {
+      class: n.value,
+      style: u.value,
+      "aria-hidden": "true"
+    }), null, 16, ["class", "style"]));
+  }
+}), Bl = /* @__PURE__ */ z({
+  __name: "KmTabs",
+  props: /* @__PURE__ */ oe({
+    defaultValue: {},
+    variant: { default: "line" },
+    orientation: { default: "horizontal" },
+    size: { default: "md" },
+    class: {}
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const t = e, a = X(e, "modelValue"), n = m(() => Te({
+      variant: t.variant,
+      orientation: t.orientation,
+      size: t.size
+    }));
+    return Y("kmTabsContext", {
+      get variant() {
+        return t.variant;
+      },
+      get orientation() {
+        return t.orientation;
+      },
+      get size() {
+        return t.size;
+      },
+      get styles() {
+        return n.value;
+      }
+    }), (u, d) => (l(), S(o(it), {
+      modelValue: a.value,
+      "onUpdate:modelValue": d[0] || (d[0] = (c) => a.value = c),
+      "default-value": e.defaultValue,
+      orientation: e.orientation,
+      "activation-mode": u.activationMode,
+      class: s(n.value.root({ class: t.class }))
+    }, {
+      default: k(() => [
+        h(u.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["modelValue", "default-value", "orientation", "activation-mode", "class"]));
+  }
+}), zl = /* @__PURE__ */ z({
+  __name: "KmTabsList",
+  props: {
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTabsContext", null);
+    return (n, u) => {
+      var d;
+      return l(), S(o(dt), {
+        loop: n.loop,
+        class: s(((d = o(a)) == null ? void 0 : d.styles.list({ class: t.class })) ?? t.class)
+      }, {
+        default: k(() => [
+          h(n.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["loop", "class"]);
+    };
+  }
+}), Vl = /* @__PURE__ */ z({
+  __name: "KmTabsTrigger",
+  props: {
+    value: {},
+    disabled: { type: Boolean, default: !1 },
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTabsContext", null);
+    return (n, u) => {
+      var d;
+      return l(), S(o(ut), {
+        value: e.value,
+        disabled: e.disabled,
+        class: s(((d = o(a)) == null ? void 0 : d.styles.trigger({ class: t.class })) ?? t.class)
+      }, {
+        default: k(() => [
+          h(n.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["value", "disabled", "class"]);
+    };
+  }
+}), Kl = /* @__PURE__ */ z({
+  __name: "KmTabsContent",
+  props: {
+    value: {},
+    forceMount: { type: Boolean },
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTabsContext", null);
+    return (n, u) => {
+      var d;
+      return l(), S(o(ct), {
+        value: e.value,
+        "force-mount": e.forceMount,
+        class: s(((d = o(a)) == null ? void 0 : d.styles.content({ class: t.class })) ?? t.class)
+      }, {
+        default: k(() => [
+          h(n.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["value", "force-mount", "class"]);
+    };
+  }
+}), Sl = /* @__PURE__ */ z({
+  __name: "KmTable",
+  props: {
+    dense: { type: Boolean, default: !1 },
+    striped: { type: Boolean, default: !1 },
+    hoverable: { type: Boolean, default: !0 },
+    bordered: { type: Boolean, default: !1 },
+    wrapperClass: {},
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = m(() => Me({
+      dense: t.dense,
+      striped: t.striped,
+      hoverable: t.hoverable,
+      bordered: t.bordered
+    }));
+    return Y("kmTableContext", {
+      get dense() {
+        return t.dense;
+      },
+      get striped() {
+        return t.striped;
+      },
+      get hoverable() {
+        return t.hoverable;
+      },
+      get bordered() {
+        return t.bordered;
+      },
+      get styles() {
+        return a.value;
+      }
+    }), (n, u) => (l(), r("div", {
+      class: s(a.value.root({ class: t.wrapperClass }))
+    }, [
+      i("table", {
+        class: s(a.value.table({ class: t.class }))
+      }, [
+        h(n.$slots, "default")
+      ], 2)
+    ], 2));
+  }
+}), Tl = /* @__PURE__ */ z({
+  __name: "KmTableHeader",
+  props: {
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTableContext", null);
+    return (n, u) => {
+      var d;
+      return l(), r("thead", {
+        class: s(((d = o(a)) == null ? void 0 : d.styles.header({ class: t.class })) ?? t.class)
+      }, [
+        h(n.$slots, "default")
+      ], 2);
+    };
+  }
+}), Ml = /* @__PURE__ */ z({
+  __name: "KmTableBody",
+  props: {
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTableContext", null);
+    return (n, u) => {
+      var d;
+      return l(), r("tbody", {
+        class: s(((d = o(a)) == null ? void 0 : d.styles.body({ class: t.class })) ?? t.class)
+      }, [
+        h(n.$slots, "default")
+      ], 2);
+    };
+  }
+}), Pl = /* @__PURE__ */ z({
+  __name: "KmTableFooter",
+  props: {
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTableContext", null);
+    return (n, u) => {
+      var d;
+      return l(), r("tfoot", {
+        class: s(((d = o(a)) == null ? void 0 : d.styles.footer({ class: t.class })) ?? t.class)
+      }, [
+        h(n.$slots, "default")
+      ], 2);
+    };
+  }
+}), Al = ["data-state"], Ll = /* @__PURE__ */ z({
+  __name: "KmTableRow",
+  props: {
+    selected: { type: Boolean, default: !1 },
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTableContext", null);
+    return (n, u) => {
+      var d;
+      return l(), r("tr", {
+        "data-state": e.selected ? "selected" : void 0,
+        class: s(((d = o(a)) == null ? void 0 : d.styles.row({ class: t.class })) ?? t.class)
+      }, [
+        h(n.$slots, "default")
+      ], 10, Al);
+    };
+  }
+}), Il = /* @__PURE__ */ z({
+  __name: "KmTableHead",
+  props: {
+    align: { default: "left" },
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTableContext", null), n = m(() => {
+      switch (t.align) {
+        case "center":
+          return "text-center";
+        case "right":
+          return "text-right";
+        case "left":
+        default:
+          return "text-left";
+      }
+    });
+    return (u, d) => {
+      var c;
+      return l(), r("th", {
+        class: s([((c = o(a)) == null ? void 0 : c.styles.head({ class: t.class })) ?? t.class, n.value])
+      }, [
+        h(u.$slots, "default")
+      ], 2);
+    };
+  }
+}), jl = /* @__PURE__ */ z({
+  __name: "KmTableCell",
+  props: {
+    align: {},
+    numeric: { type: Boolean, default: !1 },
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTableContext", null), n = m(() => {
+      const u = [];
+      return t.numeric ? u.push("font-mono tabular-nums text-right") : t.align === "right" ? u.push("text-right") : t.align === "center" ? u.push("text-center") : u.push("text-left"), u.join(" ");
+    });
+    return (u, d) => {
+      var c;
+      return l(), r("td", {
+        class: s([((c = o(a)) == null ? void 0 : c.styles.cell({ class: t.class })) ?? t.class, n.value])
+      }, [
+        h(u.$slots, "default")
+      ], 2);
+    };
+  }
+}), Zl = /* @__PURE__ */ z({
+  __name: "KmTableCaption",
+  props: {
+    class: {}
+  },
+  setup(e) {
+    const t = e, a = O("kmTableContext", null);
+    return (n, u) => {
+      var d;
+      return l(), r("caption", {
+        class: s(((d = o(a)) == null ? void 0 : d.styles.caption({ class: t.class })) ?? t.class)
+      }, [
+        h(n.$slots, "default")
+      ], 2);
+    };
+  }
+}), Hl = ["data-selected"], Rl = /* @__PURE__ */ z({
+  __name: "KmPagination",
+  props: /* @__PURE__ */ oe({
+    total: {},
+    itemsPerPage: { default: 10 },
+    siblingCount: { default: 1 },
+    showEdges: { type: Boolean, default: !1 },
+    showInfo: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    size: { default: "md" },
+    class: {},
+    infoText: {}
+  }, {
+    modelValue: { default: 1 },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const t = e, a = X(e, "modelValue"), n = m(() => Pe({
+      size: t.size
+    })), u = m(() => {
+      if (t.infoText) return t.infoText;
+      if (!t.total || t.total === 0) return "0 de 0 registros";
+      const d = Math.min((a.value - 1) * t.itemsPerPage + 1, t.total), c = Math.min(a.value * t.itemsPerPage, t.total);
+      return `Mostrando ${d} - ${c} de ${t.total}`;
+    });
+    return (d, c) => (l(), S(o(ft), {
+      page: a.value,
+      "onUpdate:page": c[0] || (c[0] = (p) => a.value = p),
+      total: e.total,
+      "items-per-page": e.itemsPerPage,
+      "sibling-count": e.siblingCount,
+      "show-edges": e.showEdges,
+      disabled: e.disabled,
+      class: s(n.value.root({ class: t.class }))
+    }, {
+      default: k(() => [
+        e.showInfo ? (l(), r("div", {
+          key: 0,
+          class: s(n.value.info())
+        }, [
+          h(d.$slots, "info", {
+            page: a.value,
+            total: e.total,
+            itemsPerPage: e.itemsPerPage
+          }, () => [
+            j(y(u.value), 1)
+          ])
+        ], 2)) : g("", !0),
+        T(o(mt), {
+          class: s(n.value.list())
+        }, {
+          default: k(({ items: p }) => [
+            e.showEdges ? (l(), S(o(vt), {
+              key: 0,
+              class: s(n.value.controlButton()),
+              "aria-label": "Primera página"
+            }, {
+              default: k(() => [
+                h(d.$slots, "first-icon", {}, () => [
+                  c[1] || (c[1] = i("svg", {
+                    class: "size-4",
+                    fill: "none",
+                    viewBox: "0 0 24 24",
+                    stroke: "currentColor",
+                    "stroke-width": "2"
+                  }, [
+                    i("path", {
+                      "stroke-linecap": "round",
+                      "stroke-linejoin": "round",
+                      d: "M11 19l-7-7 7-7m8 14l-7-7 7-7"
+                    })
+                  ], -1))
+                ])
+              ]),
+              _: 3
+            }, 8, ["class"])) : g("", !0),
+            T(o(ht), {
+              class: s(n.value.controlButton()),
+              "aria-label": "Página anterior"
+            }, {
+              default: k(() => [
+                h(d.$slots, "prev-icon", {}, () => [
+                  c[2] || (c[2] = i("svg", {
+                    class: "size-4",
+                    fill: "none",
+                    viewBox: "0 0 24 24",
+                    stroke: "currentColor",
+                    "stroke-width": "2"
+                  }, [
+                    i("path", {
+                      "stroke-linecap": "round",
+                      "stroke-linejoin": "round",
+                      d: "M15 19l-7-7 7-7"
+                    })
+                  ], -1))
+                ])
+              ]),
+              _: 3
+            }, 8, ["class"]),
+            (l(!0), r(H, null, q(p, (f, b) => (l(), r(H, { key: b }, [
+              f.type === "page" ? (l(), S(o(gt), {
+                key: 0,
+                value: f.value,
+                "as-child": ""
+              }, {
+                default: k(() => [
+                  i("button", {
+                    type: "button",
+                    class: s(n.value.button()),
+                    "data-selected": f.value === a.value ? "true" : void 0
+                  }, y(f.value), 11, Hl)
+                ]),
+                _: 2
+              }, 1032, ["value"])) : (l(), S(o(bt), {
+                key: 1,
+                index: b,
+                class: s(n.value.ellipsis())
+              }, {
+                default: k(() => [...c[3] || (c[3] = [
+                  j(" … ", -1)
+                ])]),
+                _: 1
+              }, 8, ["index", "class"]))
+            ], 64))), 128)),
+            T(o(pt), {
+              class: s(n.value.controlButton()),
+              "aria-label": "Página siguiente"
+            }, {
+              default: k(() => [
+                h(d.$slots, "next-icon", {}, () => [
+                  c[4] || (c[4] = i("svg", {
+                    class: "size-4",
+                    fill: "none",
+                    viewBox: "0 0 24 24",
+                    stroke: "currentColor",
+                    "stroke-width": "2"
+                  }, [
+                    i("path", {
+                      "stroke-linecap": "round",
+                      "stroke-linejoin": "round",
+                      d: "M9 5l7 7-7 7"
+                    })
+                  ], -1))
+                ])
+              ]),
+              _: 3
+            }, 8, ["class"]),
+            e.showEdges ? (l(), S(o(yt), {
+              key: 1,
+              class: s(n.value.controlButton()),
+              "aria-label": "Última página"
+            }, {
+              default: k(() => [
+                h(d.$slots, "last-icon", {}, () => [
+                  c[5] || (c[5] = i("svg", {
+                    class: "size-4",
+                    fill: "none",
+                    viewBox: "0 0 24 24",
+                    stroke: "currentColor",
+                    "stroke-width": "2"
+                  }, [
+                    i("path", {
+                      "stroke-linecap": "round",
+                      "stroke-linejoin": "round",
+                      d: "M13 5l7 7-7 7M5 5l7 7-7 7"
+                    })
+                  ], -1))
+                ])
+              ]),
+              _: 3
+            }, 8, ["class"])) : g("", !0)
+          ]),
+          _: 3
+        }, 8, ["class"])
+      ]),
+      _: 3
+    }, 8, ["page", "total", "items-per-page", "sibling-count", "show-edges", "disabled", "class"]));
+  }
+}), Ol = ["aria-expanded", "aria-selected"], ql = ["data-selected", "data-disabled", "onKeydown"], El = ["data-expanded"], Dl = {
+  key: 0,
+  class: "font-mono text-xs font-semibold px-1.5 py-0.5 rounded bg-km-muted text-km-muted-foreground"
+}, me = /* @__PURE__ */ z({
+  name: "KmTreeNode",
+  __name: "KmTreeNode",
+  props: {
+    item: {},
+    level: { default: 0 }
+  },
+  setup(e) {
+    const t = e, a = O("kmTreeContext"), n = m(() => Array.isArray(t.item.children) && t.item.children.length > 0), u = m(() => (a == null ? void 0 : a.isExpanded(t.item.id)) ?? !1), d = m(() => (a == null ? void 0 : a.isSelected(t.item.id)) ?? !1), c = (b) => {
+      t.item.disabled || (a != null && a.selectable ? a.selectItem(t.item) : n.value && (a == null || a.toggleExpand(t.item.id)));
+    }, p = (b) => {
+      b.stopPropagation(), !t.item.disabled && (a == null || a.toggleExpand(t.item.id));
+    }, f = m(() => {
+      switch (t.item.badgeTone) {
+        case "success":
+          return "bg-km-success-bg text-km-success";
+        case "warning":
+          return "bg-km-warning-bg text-km-warning";
+        case "danger":
+          return "bg-km-danger-bg text-km-danger";
+        case "primary":
+          return "bg-km-primary/10 text-km-primary";
+        case "neutral":
+        default:
+          return "bg-km-muted text-km-muted-foreground";
+      }
+    });
+    return (b, M) => {
+      var v, x, B, $;
+      const w = ke("KmTreeNode", !0);
+      return l(), r("li", {
+        role: "treeitem",
+        "aria-expanded": n.value ? u.value : void 0,
+        "aria-selected": d.value,
+        class: "list-none"
+      }, [
+        i("div", {
+          class: s((v = o(a)) == null ? void 0 : v.styles.item()),
+          style: J({ paddingLeft: `${e.level * 18 + 8}px` }),
+          "data-selected": d.value ? "true" : void 0,
+          "data-disabled": e.item.disabled ? "true" : void 0,
+          tabindex: "0",
+          onClick: c,
+          onKeydown: [
+            U(D(c, ["prevent"]), ["enter"]),
+            U(D(c, ["prevent"]), ["space"])
+          ]
+        }, [
+          n.value ? (l(), r("button", {
+            key: 0,
+            type: "button",
+            tabindex: "-1",
+            class: s((x = o(a)) == null ? void 0 : x.styles.toggle()),
+            "data-expanded": u.value ? "true" : void 0,
+            "aria-label": "Alternar nodo",
+            onClick: p
+          }, [...M[0] || (M[0] = [
+            i("svg", {
+              class: "size-3.5 transition-transform",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              "stroke-width": "2.5"
+            }, [
+              i("path", {
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                d: "M9 5l7 7-7 7"
+              })
+            ], -1)
+          ])], 10, El)) : (l(), r("div", {
+            key: 1,
+            class: s((B = o(a)) == null ? void 0 : B.styles.togglePlaceholder())
+          }, null, 2)),
+          h(b.$slots, "node", {
+            item: e.item,
+            isExpanded: u.value,
+            isSelected: d.value,
+            level: e.level
+          }, () => {
+            var L, P;
+            return [
+              e.item.code ? (l(), r("span", Dl, y(e.item.code), 1)) : g("", !0),
+              i("span", {
+                class: s((L = o(a)) == null ? void 0 : L.styles.label())
+              }, y(e.item.label), 3),
+              e.item.badge ? (l(), r("span", {
+                key: 1,
+                class: s([(P = o(a)) == null ? void 0 : P.styles.badge(), f.value])
+              }, y(e.item.badge), 3)) : g("", !0)
+            ];
+          })
+        ], 46, ql),
+        n.value && u.value ? (l(), r("ul", {
+          key: 0,
+          role: "group",
+          class: s(($ = o(a)) == null ? void 0 : $.styles.list())
+        }, [
+          (l(!0), r(H, null, q(e.item.children, (L) => (l(), S(w, {
+            key: L.id,
+            item: L,
+            level: e.level + 1
+          }, {
+            node: k((P) => [
+              h(b.$slots, "node", G({ ref_for: !0 }, P))
+            ]),
+            _: 3
+          }, 8, ["item", "level"]))), 128))
+        ], 2)) : g("", !0)
+      ], 8, Ol);
+    };
+  }
+}), Nl = /* @__PURE__ */ z({
+  __name: "KmTreeview",
+  props: /* @__PURE__ */ oe({
+    items: {},
+    filterQuery: {},
+    density: { default: "normal" },
+    multiple: { type: Boolean, default: !1 },
+    selectable: { type: Boolean, default: !0 },
+    class: {}
+  }, {
+    modelValue: { default: () => [] },
+    modelModifiers: {},
+    expanded: { default: () => [] },
+    expandedModifiers: {}
+  }),
+  emits: ["update:modelValue", "update:expanded"],
+  setup(e) {
+    const t = e, a = X(e, "modelValue"), n = X(e, "expanded"), u = m(() => Ae({
+      density: t.density
+    })), d = (w) => Array.isArray(a.value) ? a.value.includes(w) : a.value === w, c = (w) => t.filterQuery && t.filterQuery.trim() ? !0 : n.value.includes(w), p = (w) => {
+      const v = [...n.value], x = v.indexOf(w);
+      x > -1 ? v.splice(x, 1) : v.push(w), n.value = v;
+    }, f = (w) => {
+      if (t.multiple) {
+        const v = Array.isArray(a.value) ? [...a.value] : [], x = v.indexOf(w.id);
+        x > -1 ? v.splice(x, 1) : v.push(w.id), a.value = v;
+      } else
+        a.value = w.id;
+    }, b = (w, v) => {
+      const x = v.toLowerCase(), B = w.label.toLowerCase().includes(x), $ = w.code ? w.code.toLowerCase().includes(x) : !1, L = B || $;
+      let P = [];
+      return w.children && w.children.length > 0 && (P = w.children.map((A) => b(A, v)).filter((A) => A !== null)), L || P.length > 0 ? {
+        ...w,
+        children: P.length > 0 ? P : w.children
+      } : null;
+    }, M = m(() => {
+      if (!t.filterQuery || !t.filterQuery.trim())
+        return t.items;
+      const w = t.filterQuery.trim();
+      return t.items.map((v) => b(v, w)).filter((v) => v !== null);
+    });
+    return Y("kmTreeContext", {
+      isSelected: d,
+      isExpanded: c,
+      toggleExpand: p,
+      selectItem: f,
+      selectable: t.selectable,
+      styles: u.value
+    }), (w, v) => (l(), r("div", {
+      class: s(u.value.root({ class: t.class }))
+    }, [
+      i("ul", {
+        role: "tree",
+        class: s(u.value.list())
+      }, [
+        (l(!0), r(H, null, q(M.value, (x) => (l(), S(me, {
+          key: x.id,
+          item: x,
+          level: 0
+        }, {
+          node: k((B) => [
+            h(w.$slots, "node", G({ ref_for: !0 }, B))
+          ]),
+          _: 3
+        }, 8, ["item"]))), 128))
+      ], 2)
+    ], 2));
+  }
+}), Wl = {
+  KmAlert: Tt,
+  KmAvatar: Lt,
+  KmBadge: It,
+  KmButton: jt,
+  KmCard: Zt,
+  KmInput: _t,
+  KmSelect: za,
+  KmSpinner: Va,
+  KmStack: Ka,
+  KmTextarea: La,
+  KmScrollArea: Ja,
+  KmPopover: Ga,
+  KmHeading: Xa,
+  KmText: Ya,
+  KmCheckbox: sl,
+  KmRadio: hl,
+  KmRadioGroup: gl,
+  KmFormControl: xl,
+  KmHtml: $l,
+  KmSkeleton: Cl,
+  KmTabs: Bl,
+  KmTabsList: zl,
+  KmTabsTrigger: Vl,
+  KmTabsContent: Kl,
+  KmTable: Sl,
+  KmTableHeader: Tl,
+  KmTableBody: Ml,
+  KmTableFooter: Pl,
+  KmTableRow: Ll,
+  KmTableHead: Il,
+  KmTableCell: jl,
+  KmTableCaption: Zl,
+  KmPagination: Rl,
+  KmTreeview: Nl,
+  KmTreeNode: me
+}, ss = {
+  install(e) {
+    Object.entries(Wl).forEach(([t, a]) => {
+      e.component(t, a);
+    });
+  }
+};
+export {
+  jl as A,
+  Pl as B,
+  Il as C,
+  Tl as D,
+  Ll as E,
+  Bl as F,
+  Kl as G,
+  zl as H,
+  Vl as I,
+  Ya as J,
+  Xl as K,
+  La as L,
+  ls as M,
+  me as N,
+  Nl as O,
+  ss as P,
+  Tt as _,
+  Lt as a,
+  It as b,
+  jt as c,
+  Zt as d,
+  sl as e,
+  Yl as f,
+  es as g,
+  ts as h,
+  _l as i,
+  xl as j,
+  Xa as k,
+  $l as l,
+  _t as m,
+  Rl as n,
+  Ga as o,
+  hl as p,
+  gl as q,
+  Ja as r,
+  za as s,
+  Cl as t,
+  Va as u,
+  Ka as v,
+  as as w,
+  Sl as x,
+  Ml as y,
+  Zl as z
+};