@stachelock/ui 0.1.0

package/dist/index.js

@@ -0,0 +1,4763 @@
+import { defineComponent as z, useSlots as _s, computed as B, createElementBlock as r, openBlock as o, normalizeClass as V, createElementVNode as e, createVNode as _, createCommentVNode as b, createTextVNode as Q, toDisplayString as w, Fragment as E, renderSlot as S, unref as f, Transition as xe, withCtx as L, ref as P, toRef as De, watch as q, nextTick as de, mergeProps as he, defineAsyncComponent as we, inject as ue, getCurrentInstance as Cs, watchEffect as We, onMounted as ne, toRefs as Ss, createBlock as K, renderList as j, normalizeStyle as le, createStaticVNode as Ms, resolveDynamicComponent as ce, withModifiers as Y, onUnmounted as Ts, toHandlers as Bs, reactive as qe, withDirectives as me, vModelCheckbox as Vs, isRef as As, vModelText as be, withKeys as fe } from "vue";
+import { useField as te, useForm as Ls } from "vee-validate";
+import { debounce as Is } from "lodash-es";
+import { ExclamationCircleIcon as Ds, CheckCircleIcon as Es, ChevronRightIcon as Ps, ChevronUpDownIcon as Qe, CheckIcon as Ge, CalendarIcon as zs, XMarkIcon as Os } from "@heroicons/vue/20/solid";
+import { TransitionRoot as ve, Dialog as ke, TransitionChild as se, DialogPanel as $e, DialogTitle as js, Listbox as Fs, ListboxButton as Ns, ListboxOptions as Rs, ListboxOption as Us, Combobox as Hs, ComboboxInput as Ks, ComboboxButton as Ws, ComboboxOptions as qs, ComboboxOption as ye, Switch as Qs } from "@headlessui/vue";
+import { getCoreRowModel as Gs, useVueTable as Js, FlexRender as Ee } from "@tanstack/vue-table";
+import { getSortedRowModel as Ys } from "@tanstack/table-core";
+import "date-fns";
+import { CalendarIcon as Xs, MapPinIcon as Pe, NoSymbolIcon as Zs } from "@heroicons/vue/24/solid";
+import { NoSymbolIcon as el, MapPinIcon as sl, ExclamationTriangleIcon as ll, ExclamationCircleIcon as tl, XMarkIcon as Je, Bars3Icon as Ye } from "@heroicons/vue/24/outline";
+function ae(t = "sl") {
+  return `${t}-${Math.random().toString(36).substr(2, 9)}-${Date.now().toString(36)}`;
+}
+function vi(t, l = "sl") {
+  let s = 0;
+  for (let a = 0; a < t.length; a++) {
+    const m = t.charCodeAt(a);
+    s = (s << 5) - s + m, s = s & s;
+  }
+  return `${l}-${Math.abs(s).toString(36)}`;
+}
+function yi(t) {
+  return t.toLowerCase().replace(/[^a-z0-9-_]/g, "-").replace(/-+/g, "-").replace(/^-|-$/g, "");
+}
+const al = { class: "sl-grid sl-grid-cols-3 sl-items-center" }, ol = ["for"], nl = {
+  key: 0,
+  class: "sl-text-red-500 sl-ml-1"
+}, rl = { class: "disabled-message sl-text-xs sl-text-gray-400 sl-col-start-3 sl-text-right" }, il = {
+  key: 0,
+  class: "sl-text-xs sl-uppercase sl-text-gray-500 sl-truncate sl-text-right sl-font-semibold sl-justify-self-end sl-col-start-3"
+}, dl = {
+  key: 0,
+  class: "sl-text-2xs sl-uppercase sl-text-gray-500 sl-truncate sl-text-right sl-font-semibold sl-justify-self-end sl-col-start-3"
+}, ul = {
+  key: 0,
+  class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-z-10 sl-pointer-events-none"
+}, cl = {
+  key: 1,
+  class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-z-10 sl-pointer-events-none"
+}, ml = { class: "sl-flex sl-select-none sl-items-center sl-pl-3 sl-text-gray-500 sm:sl-text-sm" }, fl = { class: "sl-flex-1 sl-min-w-0" }, gl = {
+  key: 3,
+  class: "sl-relative"
+}, pl = { class: "sl-flex-1 sl-min-w-0 sl-pl-2 sl-pr-2" }, hl = { class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center" }, vl = {
+  key: 0,
+  class: "error-message sl-mt-2 sl-text-sm sl-text-red-600 sl-bg-red-50 sl-ring-1 sl-ring-red-100 sl-rounded-md sl-p-2"
+}, yl = {
+  key: 1,
+  class: "success-message sl-mt-2 sl-text-sm sl-text-green-600 sl-bg-green-50 sl-p-2 sl-rounded-md"
+}, bl = "sl-block sl-w-full sl-border-0 sl-bg-transparent sl-py-1.5 sl-text-gray-800 sl-placeholder:text-gray-400 focus:sl-ring-0 sm:sl-text-sm sm:sl-leading-6", xl = "sl-block sl-w-full sl-rounded-md sl-border-0 sl-py-1.5 sl-text-gray-800 sl-shadow-sm sl-ring-1 sl-ring-inset sl-placeholder:text-gray-400 focus:sl-ring-2 focus:sl-ring-inset focus:sl-ring-stachelock-600 sm:sl-text-sm sm:sl-leading-6", wl = "sl-block sl-w-full sl-border-0 sl-bg-transparent sl-py-1 sl-text-gray-400 sl-placeholder:text-gray-400 focus:sl-ring-0 sm:sl-text-sm sm:sl-leading-6 sl-cursor-not-allowed", kl = /* @__PURE__ */ z({
+  __name: "FormFieldWrapper",
+  props: {
+    id: {},
+    name: {},
+    label: { default: "" },
+    tertiaryLabel: { default: "" },
+    errorMessage: { default: null },
+    successMessage: { default: "" },
+    isValid: { type: Boolean, default: !1 },
+    isTouched: { type: Boolean, default: !1 },
+    showErrors: { type: Boolean, default: !1 },
+    showValidCheck: { type: Boolean, default: !0 },
+    colorfulValidation: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    disabledMessage: { default: "" },
+    optional: { type: Boolean, default: !1 },
+    boxShadow: { type: Boolean, default: !1 },
+    formTracking: { type: Boolean, default: !1 },
+    isFocused: { type: Boolean, default: !1 },
+    isHovered: { type: Boolean, default: !1 },
+    externalErrors: { default: null }
+  },
+  setup(t) {
+    const l = t, s = _s(), a = B(() => !!s.prefix), m = B(() => [
+      l.boxShadow ? "sl-shadow sm:sl-rounded-lg sl-mt-2 sl-mb-4 sl-px-4 sl-py-5 sm:sl-p-6" : "",
+      l.formTracking && (l.isFocused || l.isHovered) ? "sl-ring-1 sl-ring-stachelock-600 sl-bg-white/80" : "",
+      l.externalErrors && l.externalErrors[l.name] ? "has-error" : ""
+    ]), u = B(() => l.disabled || !l.colorfulValidation ? "sl-ring-gray-300" : l.isValid && (l.isTouched || l.showValidCheck) ? "sl-ring-green-500" : l.errorMessage && (l.isTouched || l.showErrors) ? "sl-ring-red-500" : "sl-ring-gray-300");
+    return (n, p) => (o(), r("div", {
+      class: V([[
+        {
+          "has-error": !!n.errorMessage && (n.isTouched || n.showErrors),
+          success: n.isValid && n.isTouched
+        },
+        m.value
+      ], "sl-text-sm"]),
+      "data-testid": "form-field-wrapper"
+    }, [
+      e("div", al, [
+        n.label ? (o(), r("label", {
+          key: 0,
+          for: n.id,
+          class: "sl-text-sm sl-col-span-2 sl-font-medium sl-text-gray-700"
+        }, [
+          Q(w(n.label) + " ", 1),
+          n.optional ? b("", !0) : (o(), r("span", nl, "*"))
+        ], 8, ol)) : b("", !0),
+        n.disabled && n.disabledMessage ? (o(), r(E, { key: 1 }, [
+          e("p", rl, w(n.disabledMessage), 1),
+          n.tertiaryLabel ? (o(), r("span", il, [
+            Q(w(n.tertiaryLabel) + " ", 1),
+            S(n.$slots, "tertiary-label-overlay", {}, void 0, !0)
+          ])) : b("", !0)
+        ], 64)) : (o(), r(E, { key: 2 }, [
+          n.tertiaryLabel ? (o(), r("span", dl, [
+            Q(w(n.tertiaryLabel) + " ", 1),
+            S(n.$slots, "tertiary-label-overlay", {}, void 0, !0)
+          ])) : b("", !0)
+        ], 64))
+      ]),
+      e("div", {
+        class: V(["sl-relative", { "sl-mt-2": n.label }])
+      }, [
+        n.errorMessage && (n.isTouched || n.showErrors) ? (o(), r("div", ul, [
+          _(f(Ds), {
+            class: "sl-h-5 sl-w-5 sl-text-red-500",
+            "aria-hidden": "true",
+            "data-testid": "error-icon"
+          })
+        ])) : n.showValidCheck && n.isValid && n.isTouched ? (o(), r("div", cl, [
+          _(f(Es), {
+            class: "sl-h-5 sl-w-5 sl-text-green-500",
+            "aria-hidden": "true",
+            "data-testid": "check-icon"
+          })
+        ])) : b("", !0),
+        a.value ? (o(), r("div", {
+          key: 2,
+          class: V(["sl-flex sl-rounded-md sl-shadow-sm sl-ring-1 sl-ring-inset focus-within:sl-ring-2 focus-within:sl-ring-inset focus-within:sl-ring-stachelock-600", u.value])
+        }, [
+          e("div", ml, [
+            S(n.$slots, "prefix", {}, void 0, !0)
+          ]),
+          e("div", fl, [
+            S(n.$slots, "default", { inputClasses: bl }, void 0, !0)
+          ]),
+          S(n.$slots, "input-right", {}, void 0, !0)
+        ], 2)) : (o(), r("div", gl, [
+          n.disabled ? (o(), r("div", {
+            key: 0,
+            class: V(["sl-flex sl-rounded-md sl-shadow-sm sl-ring-1 sl-ring-inset sl-bg-gray-50", u.value])
+          }, [
+            e("div", pl, [
+              S(n.$slots, "default", { inputClasses: wl }, void 0, !0)
+            ]),
+            S(n.$slots, "input-right", {}, void 0, !0)
+          ], 2)) : (o(), r(E, { key: 1 }, [
+            S(n.$slots, "default", { inputClasses: xl }, void 0, !0),
+            e("div", hl, [
+              S(n.$slots, "input-right", {}, void 0, !0)
+            ])
+          ], 64))
+        ]))
+      ], 2),
+      _(xe, {
+        show: !!n.errorMessage && (n.isTouched || n.showErrors) || n.isValid && !!n.successMessage && n.isTouched,
+        appear: !0,
+        "enter-active-class": "sl-transition sl-ease-out sl-duration-300",
+        "enter-from-class": "sl-opacity-0 sl-transform sl-scale-95",
+        "enter-to-class": "sl-opacity-100 sl-transform sl-scale-100",
+        "leave-active-class": "sl-transition sl-ease-in sl-duration-200",
+        "leave-from-class": "sl-opacity-100 sl-transform sl-scale-100",
+        "leave-to-class": "sl-opacity-0 sl-transform sl-scale-95"
+      }, {
+        default: L(() => [
+          n.errorMessage && (n.isTouched || n.showErrors) ? (o(), r("p", vl, w(n.errorMessage), 1)) : n.isValid && n.successMessage && n.isTouched ? (o(), r("p", yl, [
+            S(n.$slots, "success-message", {}, () => [
+              Q(w(n.successMessage), 1)
+            ], !0)
+          ])) : b("", !0)
+        ]),
+        _: 3
+      }, 8, ["show"])
+    ], 2));
+  }
+}), oe = (t, l) => {
+  const s = t.__vccOpts || t;
+  for (const [a, m] of l)
+    s[a] = m;
+  return s;
+}, ee = /* @__PURE__ */ oe(kl, [["__scopeId", "data-v-23518b3b"]]), $l = { class: "sl-form" }, _l = ["name", "id", "type", "value", "placeholder", "spellcheck", "disabled"], Cl = /* @__PURE__ */ z({
+  inheritAttrs: !1,
+  __name: "UiTextInput",
+  props: {
+    boxShadow: { type: Boolean, default: !1 },
+    type: { default: "text" },
+    value: { default: "" },
+    rules: { default: () => ({}) },
+    validateOnMount: { type: Boolean, default: !0 },
+    inputClass: { default: "" },
+    inputStyle: { default: "" },
+    spellcheck: { type: Boolean, default: !0 },
+    capitalize: { type: Boolean, default: !1 },
+    lazy: { type: Boolean, default: !1 },
+    transformFunction: { type: Function, default: (t) => t },
+    showErrors: { type: Boolean, default: !1 },
+    name: {},
+    label: { default: "" },
+    placeholder: { default: "" },
+    disabled: { type: Boolean, default: !1 },
+    required: { type: Boolean },
+    className: {},
+    errorMessage: {},
+    successMessage: { default: "" },
+    isValid: { type: Boolean },
+    isTouched: { type: Boolean },
+    colorfulValidation: { type: Boolean, default: !0 },
+    showValidCheck: { type: Boolean, default: !0 },
+    tertiaryLabel: { default: "" },
+    disabledMessage: { default: "" }
+  },
+  emits: ["update:value", "focus", "blur", "error", "update:validity"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = P(!1), u = ae(s.name || "text-input"), n = P(s.validateOnMount), { value: p, errorMessage: v, handleChange: $, meta: c, validate: d, setTouched: g } = te(De(s, "name"), De(s, "rules"), {
+      initialValue: s.value,
+      validateOnValueUpdate: !s.lazy,
+      validateOnMount: n.value
+    }), h = (i) => a("update:value", i), k = Is(h, 300);
+    function C(i) {
+      const I = i.target.value;
+      s.lazy ? k(I) : h(I), $(s.transformFunction(I));
+    }
+    async function A(i) {
+      m.value || (m.value = !0, g(!0)), s.lazy && h(p.value), await d(), a("blur", i);
+    }
+    function D(i) {
+      a("focus", i);
+    }
+    return q(() => c.valid, (i) => de(() => a("update:validity", i)), { immediate: !0 }), q(() => s.value, (i) => {
+      i !== p.value && (p.value = i);
+    }), (i, I) => (o(), r("div", $l, [
+      _(ee, {
+        id: f(u),
+        name: i.name,
+        label: i.label,
+        "tertiary-label": i.tertiaryLabel,
+        "error-message": f(v),
+        "success-message": i.successMessage,
+        "is-valid": f(c).valid,
+        "is-touched": f(c).touched,
+        "show-errors": i.showErrors,
+        "show-valid-check": i.showValidCheck,
+        "colorful-validation": i.colorfulValidation,
+        disabled: i.disabled,
+        "disabled-message": i.disabledMessage,
+        "box-shadow": i.boxShadow
+      }, {
+        prefix: L(() => [
+          S(i.$slots, "prefix", {}, void 0, !0)
+        ]),
+        default: L(({ inputClasses: x }) => [
+          e("input", he(i.$attrs, {
+            name: i.name,
+            id: f(u),
+            type: i.type,
+            value: f(p),
+            placeholder: i.placeholder,
+            spellcheck: i.spellcheck,
+            disabled: i.disabled,
+            class: ["sl-block sl-w-full sl-bg-transparent placeholder:sl-text-gray-400 focus:sl-ring-0 focus:sl-outline-none sm:sl-text-sm sm:sl-leading-6", [
+              x,
+              "sl-py-1.5 sl-pl-2 sl-pr-2",
+              { "sl-uppercase": i.capitalize },
+              { "sl-text-gray-400": i.disabled },
+              { "sl-pr-10": i.showValidCheck },
+              i.inputClass
+            ]],
+            style: i.inputStyle,
+            onInput: C,
+            onFocus: D,
+            onBlur: A
+          }), null, 16, _l)
+        ]),
+        "input-right": L(() => [
+          S(i.$slots, "input-right", {}, void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["id", "name", "label", "tertiary-label", "error-message", "success-message", "is-valid", "is-touched", "show-errors", "show-valid-check", "colorful-validation", "disabled", "disabled-message", "box-shadow"])
+    ]));
+  }
+}), J = /* @__PURE__ */ oe(Cl, [["__scopeId", "data-v-4e60cc4a"]]), Sl = {
+  text: {
+    component: "TextInput",
+    loader: () => Promise.resolve(J)
+  },
+  email: {
+    component: "TextInput",
+    loader: () => Promise.resolve(J)
+  },
+  password: {
+    component: "TextInput",
+    loader: () => Promise.resolve(J)
+  },
+  number: {
+    component: "TextInput",
+    loader: () => Promise.resolve(J)
+  },
+  tel: {
+    component: "TextInput",
+    loader: () => Promise.resolve(J)
+  },
+  url: {
+    component: "TextInput",
+    loader: () => Promise.resolve(J)
+  },
+  textarea: {
+    component: "TextAreaInput",
+    loader: () => import("./TextAreaInput-Di6Kstic.js")
+  },
+  select: {
+    component: "SelectInput",
+    loader: () => import("./SelectInput-B5liNv7H.js")
+  },
+  combobox: {
+    component: "ComboboxInput",
+    loader: () => import("./ComboboxInput-B98P_8CZ.js")
+  },
+  checkbox: {
+    component: "CheckboxInput",
+    loader: () => import("./CheckboxInput-rWkcde69.js")
+  },
+  switch: {
+    component: "SwitchInput",
+    loader: () => import("./SwitchInput-D1k9O8gn.js")
+  }
+};
+class Ml {
+  componentMap = { ...Sl };
+  loadedComponents = /* @__PURE__ */ new Map();
+  /**
+   * Register a new component type
+   */
+  register(l, s, a) {
+    this.componentMap[l] = { component: s, loader: a }, this.loadedComponents.delete(l);
+  }
+  /**
+   * Get a component for a field type
+   */
+  getComponent(l) {
+    const s = this.componentMap[l];
+    if (!s)
+      return console.warn(`Component type "${l}" is not registered`), null;
+    if (this.loadedComponents.has(l))
+      return this.loadedComponents.get(l);
+    const a = we({
+      loader: s.loader,
+      delay: 0
+    });
+    return this.loadedComponents.set(l, a), a;
+  }
+  /**
+   * Check if a component type is registered
+   */
+  hasComponent(l) {
+    return l in this.componentMap;
+  }
+  /**
+   * Get all registered component types
+   */
+  getRegisteredTypes() {
+    return Object.keys(this.componentMap);
+  }
+  /**
+   * Unregister a component type
+   */
+  unregister(l) {
+    delete this.componentMap[l], this.loadedComponents.delete(l);
+  }
+  /**
+   * Clear all cached components
+   */
+  clearCache() {
+    this.loadedComponents.clear();
+  }
+}
+const Xe = new Ml();
+function bi(t, l, s) {
+  Xe.register(t, l, s);
+}
+function xi(t) {
+  return Xe.getComponent(t);
+}
+const Tl = {
+  key: 0,
+  class: "sl-h-full sl-w-full"
+}, Bl = ["src", "alt"], Vl = /* @__PURE__ */ z({
+  __name: "UiAvatar",
+  props: {
+    data: {},
+    name: {},
+    imageUrl: {},
+    size: { default: "md" },
+    color: { default: "sl-bg-stachelock-600" },
+    ring: { default: "sl-ring-white" },
+    rounded: { default: "sl-rounded-full" },
+    fallbackInitials: { default: "?" },
+    fallbackIcon: {},
+    imagePath: { default: "image.url" },
+    namePath: { default: "name" }
+  },
+  setup(t) {
+    const l = t, s = P(!1), a = () => {
+      s.value = !0;
+    }, m = {
+      xs: "sl-h-6 sl-w-6",
+      sm: "sl-h-8 sl-w-8",
+      md: "sl-h-12 sl-w-12",
+      lg: "sl-h-16 sl-w-16",
+      xl: "sl-h-20 sl-w-20",
+      "2xl": "sl-h-24 sl-w-24"
+    }, u = B(() => typeof l.size == "number" ? `sl-h-${l.size} sl-w-${l.size}` : m[l.size] || m.md), n = (d, g) => {
+      if (!d) return;
+      const h = Array.isArray(g) ? g : g.split(".");
+      let k = d;
+      for (const C of h)
+        if (k && typeof k == "object" && C in k)
+          k = k[C];
+        else
+          return;
+      return k;
+    }, p = B(() => {
+      if (l.imageUrl) return l.imageUrl;
+      if (l.data && l.imagePath) {
+        const d = n(l.data, l.imagePath);
+        if (d) return d;
+      }
+      if (l.data) {
+        const d = [
+          "profile_image.url",
+          "image.url",
+          "avatar.url",
+          "photo.url",
+          "picture.url"
+        ];
+        for (const g of d) {
+          const h = n(l.data, g);
+          if (h) return h;
+        }
+      }
+      return null;
+    }), v = B(() => {
+      if (l.name) return l.name;
+      if (l.data && l.namePath) {
+        const d = n(l.data, l.namePath);
+        if (d) return d;
+      }
+      if (l.data) {
+        const d = [
+          "name",
+          "display_name",
+          "full_name",
+          "username",
+          "title"
+        ];
+        for (const g of d) {
+          const h = n(l.data, g);
+          if (h) return h;
+        }
+      }
+      return "";
+    }), $ = B(() => !!p.value), c = B(() => {
+      const d = v.value;
+      if (!d || d.trim() === "")
+        return l.fallbackInitials;
+      const g = d.split(" ").filter(Boolean);
+      return g.length === 0 ? l.fallbackInitials : g.length === 1 ? g[0][0].toUpperCase() : (g[0][0] + g[g.length - 1][0]).toUpperCase();
+    });
+    return (d, g) => (o(), r("div", {
+      class: V(["sl-relative sl-inline-block", [u.value, d.ring, d.rounded]])
+    }, [
+      $.value && !s.value ? (o(), r("div", Tl, [
+        e("img", {
+          src: p.value,
+          alt: v.value,
+          class: V(["sl-h-full sl-w-full sl-object-cover", d.rounded]),
+          onError: a
+        }, null, 42, Bl)
+      ])) : b("", !0),
+      !$.value || s.value ? (o(), r("div", {
+        key: 1,
+        class: V(["sl-h-full sl-w-full sl-flex sl-items-center sl-justify-center sl-font-semibold sl-text-white", [d.color, d.rounded]])
+      }, w(c.value), 3)) : b("", !0)
+    ], 2));
+  }
+}), Al = "sl-inline-flex sl-items-center sl-font-medium sl-ring-1 sl-ring-inset sl-p-4", Ll = /* @__PURE__ */ z({
+  __name: "UiBadge",
+  props: {
+    theme: { default: "primary" },
+    shape: { default: "default" },
+    size: { default: "md" }
+  },
+  setup(t) {
+    const l = t, s = B(() => ({
+      // Use the same color scheme as in UiButton
+      primary: "sl-bg-stachelock-050 sl-text-stachelock-600 sl-ring-stachelock-600/10",
+      dark: "sl-bg-gray-50 sl-text-gray-600 sl-ring-gray-500/10",
+      secondary: "sl-bg-gray-100 sl-text-gray-800 sl-ring-gray-300",
+      light: "sl-bg-white sl-text-gray-800 sl-ring-gray-300",
+      warning: "sl-bg-yellow-50 sl-text-yellow-800 sl-ring-yellow-600/20",
+      danger: "sl-bg-red-50 sl-text-red-700 sl-ring-red-600/10",
+      success: "sl-bg-green-50 sl-text-green-700 sl-ring-green-600/20",
+      ghost: "sl-bg-white sl-text-gray-400 sl-ring-gray-400/20"
+    })[l.theme]), a = {
+      circular: "sl-rounded-full",
+      rounded: "sl-rounded-lg",
+      default: "sl-rounded-md"
+      // Default rounded class
+    }[l.shape], m = {
+      xs: "sl-px-1 sl-py-0.5 sl-text-4xs",
+      sm: "sl-px-2 sl-py-0.5 sl-text-xs",
+      md: "sl-px-3 sl-py-1 sl-text-sm",
+      lg: "sl-px-4 sl-py-1.5 sl-text-md"
+    }[l.size];
+    return (u, n) => (o(), r("span", {
+      class: V([Al, f(a), s.value, f(m)])
+    }, [
+      S(u.$slots, "default", {}, void 0, !0)
+    ], 2));
+  }
+}), Ze = /* @__PURE__ */ oe(Ll, [["__scopeId", "data-v-4f93de9f"]]);
+/*!
+  * vue-router v4.5.1
+  * (c) 2025 Eduardo San Martin Morote
+  * @license MIT
+  */
+const Il = typeof document < "u", Dl = () => {
+}, ge = Array.isArray;
+function ze(t) {
+  const l = Array.from(arguments).slice(1);
+  console.warn.apply(console, ["[Vue Router warn]: " + t].concat(l));
+}
+function Oe(t, l) {
+  return (t.aliasOf || t) === (l.aliasOf || l);
+}
+function El(t, l) {
+  if (Object.keys(t).length !== Object.keys(l).length)
+    return !1;
+  for (const s in t)
+    if (!Pl(t[s], l[s]))
+      return !1;
+  return !0;
+}
+function Pl(t, l) {
+  return ge(t) ? je(t, l) : ge(l) ? je(l, t) : t === l;
+}
+function je(t, l) {
+  return ge(l) ? t.length === l.length && t.every((s, a) => s === l[a]) : t.length === 1 && t[0] === l;
+}
+var Fe;
+(function(t) {
+  t.pop = "pop", t.push = "push";
+})(Fe || (Fe = {}));
+var Ne;
+(function(t) {
+  t.back = "back", t.forward = "forward", t.unknown = "";
+})(Ne || (Ne = {}));
+function Re(t) {
+  return typeof t == "string" || t && typeof t == "object";
+}
+Symbol(process.env.NODE_ENV !== "production" ? "navigation failure" : "");
+var Ue;
+(function(t) {
+  t[t.aborted = 4] = "aborted", t[t.cancelled = 8] = "cancelled", t[t.duplicated = 16] = "duplicated";
+})(Ue || (Ue = {}));
+Symbol(process.env.NODE_ENV !== "production" ? "router view location matched" : "");
+Symbol(process.env.NODE_ENV !== "production" ? "router view depth" : "");
+const es = Symbol(process.env.NODE_ENV !== "production" ? "router" : ""), ss = Symbol(process.env.NODE_ENV !== "production" ? "route location" : "");
+Symbol(process.env.NODE_ENV !== "production" ? "router view location" : "");
+function zl(t) {
+  const l = ue(es), s = ue(ss);
+  let a = !1, m = null;
+  const u = B(() => {
+    const c = f(t.to);
+    return process.env.NODE_ENV !== "production" && (!a || c !== m) && (Re(c) || (a ? ze(`Invalid value for prop "to" in useLink()
+- to:`, c, `
+- previous to:`, m, `
+- props:`, t) : ze(`Invalid value for prop "to" in useLink()
+- to:`, c, `
+- props:`, t)), m = c, a = !0), l.resolve(c);
+  }), n = B(() => {
+    const { matched: c } = u.value, { length: d } = c, g = c[d - 1], h = s.matched;
+    if (!g || !h.length)
+      return -1;
+    const k = h.findIndex(Oe.bind(null, g));
+    if (k > -1)
+      return k;
+    const C = He(c[d - 2]);
+    return (
+      // we are dealing with nested routes
+      d > 1 && // if the parent and matched route have the same path, this link is
+      // referring to the empty child. Or we currently are on a different
+      // child of the same parent
+      He(g) === C && // avoid comparing the child with its parent
+      h[h.length - 1].path !== C ? h.findIndex(Oe.bind(null, c[d - 2])) : k
+    );
+  }), p = B(() => n.value > -1 && jl(s.params, u.value.params)), v = B(() => n.value > -1 && n.value === s.matched.length - 1 && El(s.params, u.value.params));
+  function $(c = {}) {
+    if (Ol(c)) {
+      const d = l[f(t.replace) ? "replace" : "push"](
+        f(t.to)
+        // avoid uncaught errors are they are logged anyway
+      ).catch(Dl);
+      return t.viewTransition && typeof document < "u" && "startViewTransition" in document && document.startViewTransition(() => d), d;
+    }
+    return Promise.resolve();
+  }
+  if (process.env.NODE_ENV !== "production" && Il) {
+    const c = Cs();
+    if (c) {
+      const d = {
+        route: u.value,
+        isActive: p.value,
+        isExactActive: v.value,
+        error: null
+      };
+      c.__vrl_devtools = c.__vrl_devtools || [], c.__vrl_devtools.push(d), We(() => {
+        d.route = u.value, d.isActive = p.value, d.isExactActive = v.value, d.error = Re(f(t.to)) ? null : 'Invalid "to" value';
+      }, { flush: "post" });
+    }
+  }
+  return {
+    route: u,
+    href: B(() => u.value.href),
+    isActive: p,
+    isExactActive: v,
+    navigate: $
+  };
+}
+function Ol(t) {
+  if (!(t.metaKey || t.altKey || t.ctrlKey || t.shiftKey) && !t.defaultPrevented && !(t.button !== void 0 && t.button !== 0)) {
+    if (t.currentTarget && t.currentTarget.getAttribute) {
+      const l = t.currentTarget.getAttribute("target");
+      if (/\b_blank\b/i.test(l))
+        return;
+    }
+    return t.preventDefault && t.preventDefault(), !0;
+  }
+}
+function jl(t, l) {
+  for (const s in l) {
+    const a = l[s], m = t[s];
+    if (typeof a == "string") {
+      if (a !== m)
+        return !1;
+    } else if (!ge(m) || m.length !== a.length || a.some((u, n) => u !== m[n]))
+      return !1;
+  }
+  return !0;
+}
+function He(t) {
+  return t ? t.aliasOf ? t.aliasOf.path : t.path : "";
+}
+function ls() {
+  return ue(es);
+}
+function ts(t) {
+  return ue(ss);
+}
+const Fl = ["disabled"], Nl = { class: "sl-absolute sl-top-0 sl-right-0 sl-transform sl-translate-x-1/2 -sl-translate-y-1/2" }, Rl = {
+  key: 6,
+  class: "sl-absolute sl-inset-0 sl-flex sl-items-center sl-justify-center sl-bg-opacity-75 sl-bg-white dark:sl-bg-opacity-75 dark:sl-bg-gray-700 sl-rounded sl-z-10"
+}, Ul = { key: 0 }, Hl = "sl-ml-auto sl-flex sl-items-center", Ke = "sl-absolute sl-right-0 sl-top-1/2 -sl-translate-y-1/2 sl-pr-0 sl-flex sl-items-center", Kl = /* @__PURE__ */ z({
+  __name: "UiButton",
+  props: {
+    replaceLeadingIconWithLoading: { type: Boolean, default: !1 },
+    centerLeadingIcon: { type: Boolean, default: !1 },
+    trailingLoading: { type: Boolean, default: !1 },
+    trailingLoadingSize: {},
+    trailingOverlay: { type: Boolean, default: !1 },
+    autoContrast: { type: Boolean, default: !1 },
+    theme: { default: "primary" },
+    size: { default: "md" },
+    label: {},
+    disabled: { type: Boolean, default: !1 },
+    expanded: { type: Boolean, default: !1 },
+    outlined: { type: Boolean, default: !1 },
+    customClass: {},
+    rounded: { default: "rounded-md" },
+    leadingIcon: { type: Boolean, default: !1 },
+    trailingIcon: { type: Boolean, default: !1 },
+    loading: { type: Boolean, default: !1 },
+    loadingSize: {},
+    showLoadingTitle: { type: Boolean, default: !1 },
+    truncateLabel: { type: Boolean, default: !1 },
+    centerLabel: { type: Boolean, default: !1 },
+    inlineFlex: { type: Boolean, default: !1 }
+  },
+  emits: ["button-click", "hover-enter", "hover-leave"],
+  setup(t, { emit: l }) {
+    const s = we(() => import("./UiLoading-BuzCrLqO.js")), a = t, m = l, u = B(() => !!a.loading), n = B(() => a.replaceLeadingIconWithLoading || !1), p = P(null), v = P(a.theme ?? "primary"), $ = (O) => {
+      for (; O && O !== document.documentElement; ) {
+        const R = window.getComputedStyle(O).backgroundColor;
+        if (R && R !== "rgba(0, 0, 0, 0)" && R !== "transparent")
+          return R;
+        O = O.parentElement;
+      }
+      return null;
+    }, c = () => {
+      if (!a.autoContrast) return;
+      const O = p.value;
+      if (!O) return;
+      const R = $(O.parentElement);
+      if (!R) return;
+      window.getComputedStyle(O).backgroundColor === R && (v.value = v.value === "light" ? "primary" : "light");
+    };
+    ne(() => {
+      de(c);
+    }), q(
+      () => a.theme,
+      (O) => {
+        v.value = O || "primary", de(c);
+      },
+      { immediate: !1 }
+    );
+    const d = B(() => v.value), g = B(() => a.loadingSize || a.size || "md"), h = B(() => {
+      const O = {
+        primary: "sl-text-stachelock-600 sl-border sl-border-stachelock-600 hover:sl-bg-stachelock-50 hover:sl-border-stachelock-400 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-stachelock-300 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        dark: "sl-text-gray-700 sl-border sl-border-gray-700 hover:sl-bg-gray-50 hover:sl-border-gray-800 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-gray-300 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        secondary: "sl-text-gray-800 sl-border sl-border-gray-300 hover:sl-bg-gray-100 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-gray-300 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        light: "sl-text-gray-800 sl-border sl-border-gray-300 hover:sl-bg-gray-100 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-gray-300 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        warning: "sl-text-yellow-500 sl-border sl-border-yellow-500 hover:sl-bg-yellow-50 hover:sl-border-yellow-400 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-yellow-300 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        danger: "sl-text-red-500 sl-border sl-border-red-500 hover:sl-bg-red-50 hover:sl-border-red-400 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-red-300 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        success: "sl-text-green-500 sl-border sl-border-green-500 hover:sl-bg-green-50 hover:sl-border-green-400 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-green-300 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        ghost: "sl-text-gray-800 sl-border sl-border-transparent sl-bg-transparent hover:sl-text-gray-700 focus:sl-outline-none"
+      }, R = {
+        primary: "sl-border sl-border-transparent sl-bg-stachelock-600 sl-text-white sl-shadow-sm hover:sl-bg-stachelock-700 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-stachelock-500 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        dark: "sl-border sl-border-transparent sl-bg-gray-700 sl-text-white sl-shadow-sm hover:sl-bg-gray-800 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-gray-500 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        secondary: "sl-text-gray-800 sl-bg-gray-200 hover:sl-bg-gray-100 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-gray-300 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50 sl-border sl-border-gray-300",
+        light: "sl-text-gray-800 sl-bg-gray-200 hover:sl-bg-gray-100 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-gray-300 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50 sl-border sl-border-gray-300",
+        warning: "sl-border sl-border-transparent sl-bg-yellow-400 sl-text-white sl-shadow-sm hover:sl-bg-yellow-600 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-yellow-400 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        danger: "sl-border sl-border-transparent sl-bg-red-500 sl-text-white sl-shadow-sm hover:sl-bg-red-600 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-red-400 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        success: "sl-border sl-border-transparent sl-bg-green-500 sl-text-white sl-shadow-sm hover:sl-bg-green-600 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-green-400 focus:sl-ring-offset-2 focus:sl-ring-offset-gray-50",
+        ghost: "sl-border sl-border-transparent sl-text-gray-800 sl-bg-transparent hover:sl-text-gray-700 focus:sl-outline-none"
+      };
+      return a.outlined ? `${O[d.value] || ""} sl-bg-transparent` : R[d.value] || "";
+    }), k = {
+      square: "",
+      rounded: "sl-rounded",
+      "rounded-md": "sl-rounded-md",
+      "rounded-lg": "sl-rounded-lg",
+      "rounded-full": "sl-rounded-full"
+    }, C = B(() => k[a.rounded || "rounded-md"]), A = B(() => ({
+      xs: "sl-p-0.5",
+      sm: "sl-p-1",
+      md: "sl-p-2",
+      lg: "sl-p-3",
+      xl: "sl-p-4",
+      "2xl": "sl-p-5"
+    })[a.size || "md"]), D = B(() => ({
+      xs: "sl-text-xs sl-font-regular",
+      sm: "sl-text-sm sl-font-regular",
+      md: "sl-text-base sl-font-medium",
+      lg: "sl-text-lg sl-font-medium",
+      xl: "sl-text-xl sl-font-medium",
+      "2xl": "sl-text-2xl sl-font-medium"
+    })[a.size || "sm"]), i = B(() => a.expanded ? "sl-w-full" : ""), I = B(() => !!a.label && a.label.length > 0), x = B(() => {
+      if (a.customClass)
+        return a.customClass;
+      const R = [...[
+        C.value,
+        A.value,
+        D.value,
+        i.value,
+        h.value,
+        a.disabled ? "sl-cursor-not-allowed" : "sl-cursor-pointer",
+        "focus:sl-ring-0",
+        "sl-relative",
+        "sl-flex",
+        "sl-items-center",
+        "sl-justify-center"
+      ]];
+      return C.value === "sl-rounded-full" ? R.push("sl-px-1", "sl-py-1") : R.push("sl-px-2.5", "sl-py-2"), a.centerLeadingIcon && !I.value ? R.push("sl-w-full", "sl-h-full") : (a.leadingIcon || a.inlineFlex || a.trailingIcon) && R.push("sl-inline-flex"), R.filter(Boolean);
+    }), F = B(() => a.trailingOverlay ? Ke : Hl), y = B(() => a.trailingOverlay ? `${Ke} sl-h-5 sl-w-5` : "sl-ml-2 sl-h-5 sl-w-5 sl-flex sl-items-center"), N = B(() => a.centerLeadingIcon && !I.value ? "sl-absolute sl-inset-0 sl-flex sl-items-center sl-justify-center sl-w-full sl-h-full" : a.centerLeadingIcon ? "sl-h-full sl-flex sl-items-center sl-justify-center" : I.value ? "-sl-ml-0.5 sl-h-5 sl-w-5 sl-flex sl-items-center sl-justify-center" : "sl-flex sl-items-center sl-justify-center"), Z = () => {
+      m("button-click");
+    }, M = () => {
+      m("hover-enter");
+    }, U = () => {
+      m("hover-leave");
+    }, H = a.showLoadingTitle || !1;
+    return (O, R) => (o(), r("button", {
+      ref_key: "buttonRef",
+      ref: p,
+      type: "button",
+      disabled: a.disabled,
+      class: V(x.value),
+      onClick: Z,
+      onMouseenter: M,
+      onMouseleave: U
+    }, [
+      a.centerLeadingIcon && !I.value ? (o(), r("div", {
+        key: 0,
+        class: V(N.value)
+      }, [
+        S(O.$slots, "leading-icon", {}, void 0, !0)
+      ], 2)) : (o(), r(E, { key: 1 }, [
+        n.value && u.value ? (o(), r("div", {
+          key: 0,
+          class: V(["sl-flex sl-items-center sl-justify-center", [N.value, I.value ? "" : "sl-h-full sl-w-full"]])
+        }, [
+          _(f(s), {
+            theme: d.value,
+            size: g.value
+          }, null, 8, ["theme", "size"])
+        ], 2)) : a.leadingIcon ? (o(), r("div", {
+          key: 1,
+          class: V(N.value)
+        }, [
+          S(O.$slots, "leading-icon", {}, void 0, !0)
+        ], 2)) : b("", !0)
+      ], 64)),
+      I.value ? (o(), r("span", {
+        key: 2,
+        class: V(["sl-flex-1 sl-text-center", [
+          { "sl-truncate sl-max-w-[150px]": O.truncateLabel },
+          { "sl-mx-auto": !a.leadingIcon && !a.trailingIcon }
+        ]])
+      }, w(a.label), 3)) : (!n.value || !u.value) && !a.centerLeadingIcon ? (o(), r("span", {
+        key: 3,
+        class: V(["sl-flex", a.centerLabel || !a.leadingIcon && !a.trailingIcon ? "sl-justify-center sl-items-center sl-flex-1" : "sl-flex-1"])
+      }, [
+        S(O.$slots, "default", {}, void 0, !0)
+      ], 2)) : b("", !0),
+      a.trailingLoading && u.value ? (o(), r("div", {
+        key: 4,
+        class: V(F.value)
+      }, [
+        _(f(s), {
+          theme: d.value,
+          size: a.trailingLoadingSize || "sm"
+        }, null, 8, ["theme", "size"])
+      ], 2)) : a.trailingIcon ? (o(), r("div", {
+        key: 5,
+        class: V(y.value)
+      }, [
+        S(O.$slots, "trailing-icon", {}, void 0, !0)
+      ], 2)) : b("", !0),
+      e("div", Nl, [
+        S(O.$slots, "badge", {}, void 0, !0)
+      ]),
+      u.value && !n.value && !a.trailingLoading ? (o(), r("div", Rl, [
+        _(f(s), {
+          theme: d.value,
+          size: g.value
+        }, null, 8, ["theme", "size"]),
+        f(H) ? (o(), r("p", Ul, "Loading...")) : b("", !0)
+      ])) : b("", !0)
+    ], 42, Fl));
+  }
+}), X = /* @__PURE__ */ oe(Kl, [["__scopeId", "data-v-43795fb6"]]), Wl = { class: "sl-flex sl-items-center sl-w-full" }, ql = { class: "sl-flex sl-items-center sl-space-x-2 sl-flex-1" }, Ql = {
+  key: 0,
+  class: "sl-flex sl-items-center sl-ml-auto"
+}, as = /* @__PURE__ */ z({
+  __name: "UiNavLink",
+  props: {
+    to: {},
+    inactiveClass: { default: "" },
+    activeClass: { default: "" },
+    ariaCurrent: { default: void 0 },
+    current: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    customDisabled: { type: Boolean, default: !1 },
+    useCustomActiveState: { type: Boolean, default: !1 }
+  },
+  emits: ["click"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, { to: m, inactiveClass: u, activeClass: n, ariaCurrent: p, current: v, disabled: $, customDisabled: c, useCustomActiveState: d } = Ss(s), { navigate: g, isExactActive: h, isActive: k } = zl({ to: m }), C = ls(), A = ts(), D = P(A.name);
+    q(A, (y, N) => {
+      D.value = N.name;
+    });
+    const i = B(() => {
+      const y = C.resolve(m.value);
+      return y && y.matched.length > 0 && !y.matched.some((N) => N.meta?.isErrorPage);
+    }), I = B(() => {
+      const N = [
+        (d.value ? v.value : k.value) ? n.value : u.value,
+        "sl-w-full",
+        "sl-flex",
+        // Make the button container a flexbox.
+        "sl-items-center",
+        // Vertically align items.
+        "sl-relative",
+        // Essential for loading overlay positioning
+        "sl-justify-between"
+        // Space between content and trailing loading
+      ];
+      return c.value ? N.push("sl-cursor-not-allowed", "sl-text-gray-500") : !i.value || $.value ? N.push("sl-cursor-not-allowed") : N.push("sl-cursor-pointer"), N.join(" ");
+    }), x = P(!1), F = async (y) => {
+      if (a("click", y), !y.defaultPrevented && !c.value && !$.value)
+        try {
+          x.value = !0, await g();
+        } catch (N) {
+          console.error("[UiNavLink] Navigation failed:", N);
+        } finally {
+          x.value = !1;
+        }
+    };
+    return (y, N) => (o(), K(X, he({ "center-label": "" }, y.$attrs, {
+      disabled: f($),
+      loading: x.value,
+      "trailing-loading": !0,
+      "trailing-loading-size": "xs",
+      "custom-class": I.value,
+      "aria-current": f(p),
+      onClick: F
+    }), {
+      default: L(() => [
+        e("div", Wl, [
+          e("div", ql, [
+            S(y.$slots, "icon", {
+              isExactActive: f(h),
+              isActive: f(k)
+            }),
+            S(y.$slots, "default")
+          ]),
+          y.$slots.secondaryText || y.$slots.badge ? (o(), r("div", Ql, [
+            S(y.$slots, "secondaryText"),
+            S(y.$slots, "badge")
+          ])) : b("", !0)
+        ])
+      ]),
+      _: 3
+    }, 16, ["disabled", "loading", "custom-class", "aria-current"]));
+  }
+}), Gl = {
+  class: "sl-hidden sm:sl-flex",
+  "aria-label": "Breadcrumb"
+}, Jl = {
+  role: "list",
+  class: "sl-flex sl-items-center sl-space-x-4"
+}, Yl = { class: "sl-flex sl-items-center" }, Xl = /* @__PURE__ */ z({
+  __name: "UiBreadcrumb",
+  setup(t) {
+    const l = P([]), s = ts(), a = ls(), m = P(""), u = B(() => l.value.map((v) => {
+      const $ = v.name.trim();
+      return {
+        ...v,
+        name: $.length > 12 ? $.slice(0, 12) + "..." : $
+      };
+    })), n = async () => {
+      const v = s.path;
+      m.value = v;
+      const $ = v.split("/").filter(Boolean), c = [];
+      for (const [d, g] of $.entries()) {
+        let h;
+        h = g.charAt(0).toUpperCase() + g.slice(1).toLowerCase(), c.push({
+          name: h,
+          fullPath: "/" + $.slice(0, d + 1).join("/")
+        });
+      }
+      l.value = c;
+    }, p = (v, $) => {
+      const c = a.resolve(v.fullPath), d = c.matched.some((g) => g.meta?.isErrorPage);
+      (!c || c.matched.length === 0 || d) && ($.preventDefault(), $.stopPropagation(), console.warn("Breadcrumb route not found or is an error page:", v.fullPath));
+    };
+    return We(() => {
+      n();
+    }), (v, $) => (o(), r("nav", Gl, [
+      e("ol", Jl, [
+        (o(!0), r(E, null, j(u.value, (c, d) => (o(), r("li", {
+          key: c.fullPath
+        }, [
+          e("div", Yl, [
+            d !== 0 ? (o(), K(f(Ps), {
+              key: 0,
+              class: "sl-h-5 sl-w-5 sl-flex-shrink-0 sl-text-gray-400 sl-mr-3",
+              "aria-hidden": "true"
+            })) : b("", !0),
+            _(as, {
+              to: c.fullPath,
+              onClick: (g) => p(c, g),
+              "aria-current": c.fullPath === m.value ? "page" : void 0,
+              class: "sl-text-sm sl-font-medium sl-text-gray-500 hover:sl-text-gray-700 sl-truncate sl-overflow-ellipsis"
+            }, {
+              default: L(() => [
+                Q(w(c.name), 1)
+              ]),
+              _: 2
+            }, 1032, ["to", "onClick", "aria-current"])
+          ])
+        ]))), 128))
+      ])
+    ]));
+  }
+}), Zl = {
+  key: 0,
+  class: "sl-absolute sl-inset-0 sl-bg-white sl-bg-opacity-75 dark:sl-bg-gray-900 dark:sl-bg-opacity-75 sl-flex sl-items-center sl-justify-center sl-z-50"
+}, et = { class: "sl-flex sl-flex-col sl-items-center" }, os = /* @__PURE__ */ z({
+  __name: "UiLoading",
+  props: {
+    theme: { default: "primary" },
+    size: { default: "md" },
+    text: {},
+    overlay: { type: Boolean, default: !1 },
+    className: {}
+  },
+  setup(t) {
+    const l = t, s = B(() => {
+      const n = ["sl-flex sl-items-center sl-justify-center"];
+      return l.overlay ? n.push("sl-relative") : n.push("sl-flex-col sl-space-y-2"), l.className && n.push(l.className), n;
+    }), a = B(() => {
+      const u = {
+        xs: "sl-h-3 sl-w-3",
+        sm: "sl-h-4 sl-w-4",
+        md: "sl-h-6 sl-w-6",
+        lg: "sl-h-8 sl-w-8",
+        xl: "sl-h-10 sl-w-10",
+        "2xl": "sl-h-12 sl-w-12"
+      }, n = {
+        primary: "sl-text-stachelock-600",
+        secondary: "sl-text-gray-600",
+        dark: "sl-text-gray-700",
+        light: "sl-text-gray-400",
+        success: "sl-text-green-600",
+        warning: "sl-text-yellow-600",
+        danger: "sl-text-red-600",
+        ghost: "sl-text-gray-600"
+      };
+      return [
+        u[l.size || "md"],
+        n[l.theme || "primary"]
+      ];
+    }), m = B(() => {
+      const u = {
+        xs: "sl-text-xs",
+        sm: "sl-text-sm",
+        md: "sl-text-base",
+        lg: "sl-text-lg",
+        xl: "sl-text-xl",
+        "2xl": "sl-text-2xl"
+      }, n = {
+        primary: "sl-text-stachelock-700",
+        secondary: "sl-text-gray-700",
+        dark: "sl-text-gray-800",
+        light: "sl-text-gray-500",
+        success: "sl-text-green-700",
+        warning: "sl-text-yellow-700",
+        danger: "sl-text-red-700",
+        ghost: "sl-text-gray-700"
+      };
+      return [
+        u[l.size || "md"],
+        n[l.theme || "primary"],
+        "sl-font-medium"
+      ];
+    });
+    return (u, n) => (o(), r("div", {
+      class: V(s.value)
+    }, [
+      u.overlay ? (o(), r("div", Zl, [
+        e("div", et, [
+          e("div", {
+            class: V(a.value)
+          }, n[0] || (n[0] = [
+            e("svg", {
+              class: "sl-animate-spin",
+              fill: "none",
+              viewBox: "0 0 24 24"
+            }, [
+              e("circle", {
+                class: "sl-opacity-25",
+                cx: "12",
+                cy: "12",
+                r: "10",
+                stroke: "currentColor",
+                "stroke-width": "4"
+              }),
+              e("path", {
+                class: "sl-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"
+              })
+            ], -1)
+          ]), 2),
+          u.text ? (o(), r("p", {
+            key: 0,
+            class: V(m.value)
+          }, w(u.text), 3)) : b("", !0)
+        ])
+      ])) : (o(), r("div", {
+        key: 1,
+        class: V(a.value)
+      }, n[1] || (n[1] = [
+        e("svg", {
+          class: "sl-animate-spin",
+          fill: "none",
+          viewBox: "0 0 24 24"
+        }, [
+          e("circle", {
+            class: "sl-opacity-25",
+            cx: "12",
+            cy: "12",
+            r: "10",
+            stroke: "currentColor",
+            "stroke-width": "4"
+          }),
+          e("path", {
+            class: "sl-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"
+          })
+        ], -1)
+      ]), 2)),
+      u.text && !u.overlay ? (o(), r("p", {
+        key: 2,
+        class: V(m.value)
+      }, w(u.text), 3)) : b("", !0)
+    ], 2));
+  }
+}), st = {
+  key: 0,
+  class: "sl-bg-white sl-px-6 sl-py-24 sm:sl-py-32 lg:sl-px-8"
+}, lt = { class: "sl-mx-auto sl-max-w-2xl sl-text-center" }, tt = { class: "sl-text-base sl-font-semibold sl-leading-7 sl-text-stachelock-600" }, at = { class: "sl-mt-2 sl-text-4xl sl-font-bold sl-tracking-tight sl-text-gray-900 sm:sl-text-6xl" }, ot = { class: "sl-flex sl-justify-center sl-mt-6" }, nt = { class: "sl-mt-6 sl-text-lg sl-leading-8 sl-text-gray-600" }, rt = {
+  key: 1,
+  class: "sl-flex sl-justify-center sl-mt-6"
+}, it = /* @__PURE__ */ z({
+  __name: "UiLoadingDots",
+  props: {
+    backgroundColor: {
+      type: String,
+      default: "#3e4b9a"
+    },
+    size: {
+      type: String,
+      default: "md",
+      validator: (t) => ["sm", "md", "lg", "xl"].includes(t)
+    },
+    caption: {
+      type: String,
+      default: "LOADING"
+    },
+    title: {
+      type: String,
+      default: "Please wait"
+    },
+    subtitle: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(t) {
+    const l = t, s = B(() => `dots-${l.size}`);
+    return (a, m) => t.title && t.subtitle && t.caption ? (o(), r("div", st, [
+      e("div", lt, [
+        e("p", tt, w(t.caption), 1),
+        e("h2", at, w(t.title), 1),
+        e("div", ot, [
+          e("div", {
+            class: V(["loader-dots", s.value])
+          }, [
+            (o(), r(E, null, j(4, (u) => e("div", {
+              key: u,
+              class: "dots-div",
+              style: le({ backgroundColor: t.backgroundColor })
+            }, null, 4)), 64))
+          ], 2)
+        ]),
+        e("p", nt, w(t.subtitle), 1)
+      ])
+    ])) : (o(), r("div", rt, [
+      e("div", {
+        class: V(["loader-dots", s.value])
+      }, [
+        (o(), r(E, null, j(4, (u) => e("div", {
+          key: u,
+          class: "dots-div",
+          style: le({ backgroundColor: t.backgroundColor })
+        }, null, 4)), 64))
+      ], 2)
+    ]));
+  }
+}), dt = /* @__PURE__ */ oe(it, [["__scopeId", "data-v-8f791736"]]), ut = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto" }, ct = { class: "sl-bg-white" }, mt = { class: "sl-px-4 sl-pt-5 sl-pb-4 sm:sl-p-6 sm:sl-pb-4" }, ft = { class: "sm:sl-flex sm:sl-items-start" }, gt = { class: "sl-mx-auto sl-flex sl-h-12 sl-w-12 sl-flex-shrink-0 sl-items-center sl-justify-center sl-rounded-full sl-bg-gray-100 sm:sl-mx-0 sm:sl-h-10 sm:sl-w-10" }, pt = { class: "sl-mt-3 sl-text-center sm:sl-ml-4 sm:sl-mt-0 sm:sl-text-left sl-w-full" }, ht = { class: "sl-mt-2" }, vt = { class: "sl-px-4 sl-py-3 sm:sl-flex sm:sl-flex-row-reverse sm:sl-px-6" }, yt = { class: "sl-flex sl-w-full sl-justify-end sl-gap-3" }, bt = /* @__PURE__ */ z({
+  __name: "UiModal",
+  props: {
+    modelValue: { type: Boolean, required: !0 },
+    size: {
+      type: String,
+      default: "sm:max-w-lg",
+      validator: (t) => [
+        "sm:max-w-sm",
+        "sm:max-w-md",
+        "sm:max-w-lg",
+        "sm:max-w-xl",
+        "sm:max-w-2xl",
+        "sm:max-w-3xl",
+        "sm:max-w-4xl",
+        "sm:max-w-5xl",
+        "sm:max-w-6xl",
+        "sm:max-w-7xl"
+      ].includes(t)
+    },
+    position: { type: String, default: "center", validator: (t) => ["center", "top"].includes(t) },
+    showCancel: { type: Boolean, default: !0 },
+    showConfirm: { type: Boolean, default: !0 },
+    cancelText: { type: String, default: "Cancel" },
+    confirmText: { type: String, default: "Confirm" },
+    confirmTheme: { type: String, default: "primary" }
+  },
+  emits: ["update:modelValue", "cancel", "confirm"],
+  setup(t, { emit: l }) {
+    const s = l, a = P(null), m = B(() => a.value), u = () => {
+      s("update:modelValue", !1), s("cancel");
+    }, n = () => {
+      s("confirm"), s("update:modelValue", !1);
+    };
+    return (p, v) => (o(), K(f(ve), {
+      as: "template",
+      show: t.modelValue
+    }, {
+      default: L(() => [
+        _(f(ke), {
+          as: "div",
+          class: "sl-relative sl-z-50",
+          onClose: u,
+          "initial-focus": m.value
+        }, {
+          default: L(() => [
+            _(f(se), {
+              as: "template",
+              enter: "ease-out duration-300",
+              "enter-from": "opacity-0",
+              "enter-to": "opacity-100",
+              leave: "ease-in duration-200",
+              "leave-from": "opacity-100",
+              "leave-to": "opacity-0"
+            }, {
+              default: L(() => v[0] || (v[0] = [
+                e("div", { class: "sl-fixed sl-inset-0 sl-bg-gray-500/75 sl-transition-opacity" }, null, -1)
+              ])),
+              _: 1,
+              __: [0]
+            }),
+            e("div", ut, [
+              e("div", {
+                class: V(["sl-flex sl-min-h-full sl-items-center sl-justify-center sl-p-4 sl-text-center", [t.position === "top" ? "sm:sl-items-start sm:sl-pt-16" : "sm:sl-items-center"]])
+              }, [
+                _(f(se), {
+                  as: "template",
+                  enter: "ease-out duration-300",
+                  "enter-from": "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95",
+                  "enter-to": "opacity-100 translate-y-0 sm:scale-100",
+                  leave: "ease-in duration-200",
+                  "leave-from": "opacity-100 translate-y-0 sm:scale-100",
+                  "leave-to": "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
+                }, {
+                  default: L(() => [
+                    _(f($e), {
+                      class: V(["sl-relative sl-transform sl-overflow-hidden sl-rounded-lg sl-bg-white sl-text-left sl-shadow-xl sl-transition-all sl-w-full", t.size])
+                    }, {
+                      default: L(() => [
+                        e("div", ct, [
+                          e("div", mt, [
+                            e("div", ft, [
+                              e("div", gt, [
+                                S(p.$slots, "icon")
+                              ]),
+                              e("div", pt, [
+                                _(f(js), {
+                                  as: "h3",
+                                  class: "sl-text-base sl-font-semibold sl-leading-6 sl-text-gray-900"
+                                }, {
+                                  default: L(() => [
+                                    S(p.$slots, "header")
+                                  ]),
+                                  _: 3
+                                }),
+                                e("div", ht, [
+                                  S(p.$slots, "body", {}, () => [
+                                    S(p.$slots, "default")
+                                  ])
+                                ])
+                              ])
+                            ])
+                          ]),
+                          e("div", vt, [
+                            S(p.$slots, "footer", {}, () => [
+                              e("div", yt, [
+                                t.showCancel ? (o(), K(X, {
+                                  key: 0,
+                                  "center-label": "",
+                                  theme: "light",
+                                  outlined: !0,
+                                  onButtonClick: u
+                                }, {
+                                  default: L(() => [
+                                    Q(w(t.cancelText), 1)
+                                  ]),
+                                  _: 1
+                                })) : b("", !0),
+                                t.showConfirm ? (o(), K(X, {
+                                  key: 1,
+                                  "center-label": "",
+                                  theme: t.confirmTheme,
+                                  outlined: !1,
+                                  onButtonClick: n
+                                }, {
+                                  default: L(() => [
+                                    Q(w(t.confirmText), 1)
+                                  ]),
+                                  _: 1
+                                }, 8, ["theme"])) : b("", !0)
+                              ])
+                            ])
+                          ])
+                        ]),
+                        e("button", {
+                          ref_key: "fallbackFocusRef",
+                          ref: a,
+                          class: "sl-sr-only"
+                        }, "Close", 512)
+                      ]),
+                      _: 3
+                    }, 8, ["class"])
+                  ]),
+                  _: 3
+                })
+              ], 2)
+            ])
+          ]),
+          _: 3
+        }, 8, ["initial-focus"])
+      ]),
+      _: 3
+    }, 8, ["show"]));
+  }
+}), xt = { class: "sl-flex sl-justify-between sl-mb-1" }, wt = {
+  key: 0,
+  class: "sl-text-base sl-font-medium sl-text-stachelock-700"
+}, kt = {
+  key: 1,
+  class: "sl-text-sm sl-font-medium sl-text-stachelock-700"
+}, $t = { class: "sl-w-full sl-bg-gray-200 sl-rounded-full sl-h-2.5" }, _t = /* @__PURE__ */ z({
+  __name: "UiProgressBar",
+  props: {
+    progress: {
+      type: Number,
+      default: 0,
+      required: !0
+    },
+    label: {
+      type: String,
+      default: ""
+    },
+    showProgressLabel: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(t) {
+    const l = t, s = P(l.progress);
+    return q(() => l.progress, (a) => {
+      s.value = a;
+    }), (a, m) => (o(), r("div", null, [
+      e("div", xt, [
+        t.label && t.label.length > 0 ? (o(), r("span", wt, w(t.label), 1)) : b("", !0),
+        t.showProgressLabel ? (o(), r("span", kt, w(s.value) + "%", 1)) : b("", !0)
+      ]),
+      e("div", $t, [
+        e("div", {
+          class: "sl-bg-stachelock-600 sl-h-2.5 sl-rounded-full sl-transition-all sl-duration-500 sl-ease-out",
+          style: le({ width: `${s.value}%` })
+        }, null, 4)
+      ])
+    ]));
+  }
+}), Ct = {
+  viewBox: "0 0 36 36",
+  class: "sl-transform -sl-rotate-90 sl-w-full sl-h-full"
+}, St = ["stroke-dasharray"], Mt = {
+  key: 0,
+  class: "sl-absolute sl-top-1/2 sl-left-1/2 sl-transform -sl-translate-x-1/2 -sl-translate-y-1/2 sl-text-center"
+}, Tt = {
+  key: 1,
+  class: "sl-absolute sl-top-1/2 sl-left-1/2 sl-transform -sl-translate-x-1/2 -sl-translate-y-1/2 sl-text-center sl-text-xs"
+}, Bt = /* @__PURE__ */ z({
+  __name: "UiRadialProgressBar",
+  props: {
+    progress: {
+      type: Number,
+      default: 0
+    },
+    label: {
+      type: String,
+      default: ""
+    },
+    showProgressLabel: {
+      type: Boolean,
+      default: !1
+    },
+    size: {
+      type: String,
+      default: "md"
+    }
+  },
+  setup(t) {
+    const l = t, s = B(() => {
+      switch (l.size) {
+        case "xs":
+          return "sl-h-4 sl-w-4";
+        case "sm":
+          return "sl-h-8 sl-w-8";
+        case "md":
+          return "sl-h-12 sl-w-12";
+        case "lg":
+          return "sl-h-16 sl-w-16";
+        default:
+          return "sl-h-8 sl-w-8";
+      }
+    }), a = P(l.progress);
+    return q(() => l.progress, (m) => {
+      a.value = m;
+    }), (m, u) => (o(), r("div", {
+      class: V(["sl-relative", s.value])
+    }, [
+      (o(), r("svg", Ct, [
+        u[0] || (u[0] = e("path", {
+          class: "sl-fill-none sl-stroke-gray-300",
+          "stroke-width": "3.8",
+          d: "M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"
+        }, null, -1)),
+        e("path", {
+          class: "sl-fill-none sl-stroke-stachelock-600 sl-stroke-linecap-round sl-transition-[stroke-dasharray] sl-duration-500 sl-ease-out",
+          "stroke-dasharray": a.value + ", 100",
+          "stroke-width": "3.8",
+          d: "M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"
+        }, null, 8, St)
+      ])),
+      t.label && t.label.length > 0 ? (o(), r("div", Mt, w(t.label), 1)) : b("", !0),
+      t.showProgressLabel ? (o(), r("div", Tt, w(a.value) + "% ", 1)) : b("", !0)
+    ], 2));
+  }
+}), Vt = { class: "sl-px-4 sm:sl-px-6 lg:sl-px-8" }, At = { class: "sm:sl-flex sm:sl-items-center" }, Lt = { class: "sm:sl-flex-auto" }, It = {
+  key: 0,
+  class: "sl-text-base sl-font-semibold sl-leading-6 sl-text-gray-800"
+}, Dt = {
+  key: 1,
+  class: "sl-mt-2 sl-text-sm sl-text-gray-700"
+}, Et = {
+  key: 0,
+  class: "sl-mt-4 sm:sl-ml-16 sm:sl-mt-0 sm:sl-flex-none"
+}, Pt = {
+  key: 0,
+  class: "md:sl-hidden"
+}, zt = { class: "sl-mt-6 sl-space-y-4" }, Ot = { class: "sl-flex sl-items-start sl-justify-between" }, jt = { class: "sl-text-sm sl-font-medium sl-text-gray-900" }, Ft = { class: "sl-ml-4 sl-shrink-0" }, Nt = { class: "sl-mt-3 sl-grid sl-grid-cols-1 sl-gap-2" }, Rt = { class: "sl-font-medium sl-text-gray-900" }, Ut = { class: "sl-ml-1" }, Ht = {
+  key: 0,
+  class: "sl-mt-3"
+}, Kt = { class: "sl-group" }, Wt = { class: "sl-mt-2" }, qt = { class: "sl-divide-y sl-divide-gray-100" }, Qt = { class: "sl-text-sm sl-font-medium sl-text-gray-900 sl-col-span-1" }, Gt = { class: "sl-mt-1 sl-text-sm sl-text-gray-700 sl-col-span-2" }, Jt = {
+  key: 1,
+  class: "md:sl-hidden sl-mt-6"
+}, Yt = { class: "sl-space-y-4" }, Xt = { class: "sl-hidden md:sl-block" }, Zt = { class: "sl-mt-8 sl-flow-root" }, ea = { class: "sl--my-2 sl--mx-4 sl-overflow-x-auto sm:sl--mx-6 lg:sl--mx-8" }, sa = { class: "sl-inline-block sl-min-w-full sl-py-2 sl-align-middle md:sl-px-6 lg:sl-px-8" }, la = { class: "sl-overflow-hidden sl-shadow sl-ring-1 sl-ring-black sl-ring-opacity-5 md:sl-rounded-lg" }, ta = { class: "sl-min-w-full sl-divide-y sl-divide-gray-300" }, aa = { class: "sl-bg-gray-50" }, oa = {
+  key: 0,
+  class: "sl-px-3 sl-py-3.5"
+}, na = { class: "sl-divide-y sl-divide-gray-200 sl-bg-white" }, ra = {
+  key: 0,
+  class: "sl-whitespace-nowrap sl-px-3 sl-py-4 sl-text-sm sl-text-right"
+}, ia = /* @__PURE__ */ z({
+  __name: "UiTable",
+  props: {
+    data: { type: Array, required: !0 },
+    columns: { type: Array, required: !0 },
+    truncate: { type: Array, default: () => [] },
+    isLoading: { type: Boolean, default: !1 },
+    mobileConfig: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  setup(t) {
+    const l = t, s = P([]), a = B(() => l.columns.map((d) => {
+      const g = l.truncate.find((h) => h.column === d.accessorKey);
+      return g ? {
+        ...d,
+        cell: (h) => {
+          const k = h.getValue();
+          return k && k.length > g.length ? `${k.substring(0, g.length)}...` : k;
+        }
+      } : d;
+    })), m = {
+      get data() {
+        return l.data;
+      },
+      get columns() {
+        return a.value;
+      },
+      getCoreRowModel: Gs(),
+      enableColumnResizing: !0,
+      columnResizeMode: "onChange",
+      getSortedRowModel: Ys(),
+      state: {
+        get sorting() {
+          return s.value;
+        }
+      },
+      onSortingChange: (d) => {
+        s.value = typeof d == "function" ? d(s.value) : d;
+      },
+      defaultColumn: { enableSorting: !0 }
+    }, u = Js(m), n = (d) => {
+      if (!d) return null;
+      const g = d.getVisibleCells() || [], h = l.mobileConfig || {};
+      if (h.titleColumn)
+        return g.find((C) => C.column.id === h.titleColumn) || null;
+      const k = ["name", "title", "embedCode"];
+      for (const C of k) {
+        const A = g.find((D) => D.column.id.toLowerCase().includes(C.toLowerCase()));
+        if (A) return A;
+      }
+      return g[0] || null;
+    }, p = (d) => {
+      if (!d) return "";
+      const g = d.column.columnDef.header;
+      return typeof g == "string" ? g : d.column.id;
+    }, v = (d) => {
+      if (!d) return "";
+      const g = d.getValue?.();
+      return typeof g == "object" ? JSON.stringify(g) : g;
+    }, $ = (d) => {
+      const g = d.getVisibleCells() || [], k = (l.mobileConfig || {}).primaryColumns || [];
+      return k.length ? g.filter((C) => k.includes(C.column.id)) : g.slice(0, Math.min(3, g.length));
+    }, c = (d) => {
+      const g = d.getVisibleCells() || [], k = (l.mobileConfig || {}).secondaryColumns || [];
+      return k.length ? g.filter((C) => k.includes(C.column.id)) : g.slice(3);
+    };
+    return (d, g) => (o(), r("div", Vt, [
+      e("div", At, [
+        e("div", Lt, [
+          d.$slots.title ? (o(), r("h1", It, [
+            S(d.$slots, "title")
+          ])) : b("", !0),
+          d.$slots.description ? (o(), r("p", Dt, [
+            S(d.$slots, "description")
+          ])) : b("", !0)
+        ]),
+        d.$slots.right ? (o(), r("div", Et, [
+          S(d.$slots, "right")
+        ])) : b("", !0)
+      ]),
+      t.isLoading ? b("", !0) : (o(), r("div", Pt, [
+        e("div", zt, [
+          (o(!0), r(E, null, j(f(u).getRowModel().rows, (h) => (o(), r("div", {
+            key: h.id,
+            class: "sl-bg-white sl-rounded-lg sl-shadow sl-p-4"
+          }, [
+            e("div", Ot, [
+              e("div", jt, w(v(n(h))), 1),
+              e("div", Ft, [
+                S(d.$slots, "row:actions", { row: h })
+              ])
+            ]),
+            e("div", Nt, [
+              (o(!0), r(E, null, j($(h), (k) => (o(), r("div", {
+                key: k.id,
+                class: "sl-text-sm sl-text-gray-700"
+              }, [
+                e("span", Rt, w(p(k)) + ":", 1),
+                e("span", Ut, w(v(k)), 1)
+              ]))), 128))
+            ]),
+            c(h).length ? (o(), r("div", Ht, [
+              e("details", Kt, [
+                g[0] || (g[0] = e("summary", { class: "sl-cursor-pointer sl-text-sm sl-text-gray-700 sl-select-none" }, "More", -1)),
+                e("div", Wt, [
+                  e("dl", qt, [
+                    (o(!0), r(E, null, j(c(h), (k) => (o(), r("div", {
+                      key: k.id,
+                      class: "sl-py-2 sl-grid sl-grid-cols-3 sl-gap-4"
+                    }, [
+                      e("dt", Qt, w(p(k)), 1),
+                      e("dd", Gt, w(v(k)), 1)
+                    ]))), 128))
+                  ])
+                ])
+              ])
+            ])) : b("", !0)
+          ]))), 128))
+        ])
+      ])),
+      t.isLoading ? (o(), r("div", Jt, [
+        e("div", Yt, [
+          (o(), r(E, null, j(3, (h) => e("div", {
+            key: h,
+            class: "sl-animate-pulse"
+          }, g[1] || (g[1] = [
+            Ms('<div class="sl-bg-white sl-rounded-lg sl-shadow sl-p-4"><div class="sl-flex sl-items-center sl-justify-between sl-mb-3"><div class="sl-h-4 sl-bg-gray-200 sl-rounded sl-w-1/2"></div><div class="sl-h-8 sl-bg-gray-200 sl-rounded-full sl-w-8"></div></div><div class="sl-space-y-2"><div class="sl-h-3 sl-bg-gray-200 sl-rounded sl-w-full"></div><div class="sl-h-3 sl-bg-gray-200 sl-rounded sl-w-3/4"></div></div></div>', 1)
+          ]))), 64))
+        ])
+      ])) : b("", !0),
+      e("div", Xt, [
+        e("div", Zt, [
+          e("div", ea, [
+            e("div", sa, [
+              e("div", la, [
+                e("table", ta, [
+                  e("thead", aa, [
+                    e("tr", null, [
+                      (o(!0), r(E, null, j(f(u).getHeaderGroups()[0].headers, (h) => (o(), r("th", {
+                        key: h.id,
+                        scope: "col",
+                        class: "sl-px-3 sl-py-3.5 sl-text-left sl-text-sm sl-font-semibold sl-text-gray-900"
+                      }, [
+                        _(f(Ee), {
+                          render: h.column.columnDef.header,
+                          props: h.getContext()
+                        }, null, 8, ["render", "props"])
+                      ]))), 128)),
+                      d.$slots["row:actions"] ? (o(), r("th", oa)) : b("", !0)
+                    ])
+                  ]),
+                  e("tbody", na, [
+                    (o(!0), r(E, null, j(f(u).getRowModel().rows, (h) => (o(), r("tr", {
+                      key: h.id
+                    }, [
+                      (o(!0), r(E, null, j(h.getVisibleCells(), (k) => (o(), r("td", {
+                        key: k.id,
+                        class: "sl-whitespace-nowrap sl-px-3 sl-py-4 sl-text-sm sl-text-gray-500"
+                      }, [
+                        _(f(Ee), {
+                          render: k.column.columnDef.cell,
+                          props: k.getContext()
+                        }, null, 8, ["render", "props"])
+                      ]))), 128)),
+                      d.$slots["row:actions"] ? (o(), r("td", ra, [
+                        S(d.$slots, "row:actions", { row: h })
+                      ])) : b("", !0)
+                    ]))), 128))
+                  ])
+                ])
+              ])
+            ])
+          ])
+        ])
+      ])
+    ]));
+  }
+}), da = /* @__PURE__ */ z({
+  __name: "UiTransition",
+  props: {
+    show: { type: Boolean },
+    type: { default: "fade" },
+    duration: { default: "normal" }
+  },
+  setup(t) {
+    const l = t, s = {
+      fast: "sl-duration-150",
+      normal: "sl-duration-300",
+      slow: "sl-duration-500"
+    }, m = {
+      fade: {
+        enterActive: `sl-transition-opacity sl-ease-out ${s[l.duration]}`,
+        enterFrom: "sl-opacity-0",
+        enterTo: "sl-opacity-100",
+        leaveActive: `sl-transition-opacity sl-ease-in ${s[l.duration]}`,
+        leaveFrom: "sl-opacity-100",
+        leaveTo: "sl-opacity-0"
+      },
+      scale: {
+        enterActive: `sl-transition-all sl-ease-out ${s[l.duration]}`,
+        enterFrom: "sl-opacity-0 sl-transform sl-scale-95",
+        enterTo: "sl-opacity-100 sl-transform sl-scale-100",
+        leaveActive: `sl-transition-all sl-ease-in ${s[l.duration]}`,
+        leaveFrom: "sl-opacity-100 sl-transform sl-scale-100",
+        leaveTo: "sl-opacity-0 sl-transform sl-scale-95"
+      },
+      "slide-up": {
+        enterActive: `sl-transition-all sl-ease-out ${s[l.duration]}`,
+        enterFrom: "sl-opacity-0 sl-transform sl-translate-y-4",
+        enterTo: "sl-opacity-100 sl-transform sl-translate-y-0",
+        leaveActive: `sl-transition-all sl-ease-in ${s[l.duration]}`,
+        leaveFrom: "sl-opacity-100 sl-transform sl-translate-y-0",
+        leaveTo: "sl-opacity-0 sl-transform -sl-translate-y-4"
+      },
+      "slide-down": {
+        enterActive: `sl-transition-all sl-ease-out ${s[l.duration]}`,
+        enterFrom: "sl-opacity-0 sl-transform -sl-translate-y-4",
+        enterTo: "sl-opacity-100 sl-transform sl-translate-y-0",
+        leaveActive: `sl-transition-all sl-ease-in ${s[l.duration]}`,
+        leaveFrom: "sl-opacity-100 sl-transform sl-translate-y-0",
+        leaveTo: "sl-opacity-0 sl-transform sl-translate-y-4"
+      }
+    }[l.type], u = m.enterActive, n = m.enterFrom, p = m.enterTo, v = m.leaveActive, $ = m.leaveFrom, c = m.leaveTo;
+    return (d, g) => (o(), K(xe, {
+      "enter-active-class": f(u),
+      "enter-from-class": f(n),
+      "enter-to-class": f(p),
+      "leave-active-class": f(v),
+      "leave-from-class": f($),
+      "leave-to-class": f(c)
+    }, {
+      default: L(() => [
+        d.show ? S(d.$slots, "default", { key: 0 }) : b("", !0)
+      ]),
+      _: 3
+    }, 8, ["enter-active-class", "enter-from-class", "enter-to-class", "leave-active-class", "leave-from-class", "leave-to-class"]));
+  }
+}), ua = { class: "sl-w-full" }, ca = { class: "sl-relative" }, ma = { class: "sl-flex sl-items-center sl-gap-2" }, fa = {
+  key: 1,
+  class: "sl-block sl-truncate sl-text-left"
+}, ga = {
+  key: 2,
+  class: "sl-block sl-truncate sl-text-left sl-text-gray-500"
+}, pa = { class: "sl-pointer-events-none sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-2" }, ha = { class: "sl-block sl-truncate sl-font-medium" }, va = { class: "sl-flex sl-items-center sl-gap-2" }, ya = {
+  key: 0,
+  class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-4"
+}, ba = { key: 0 }, re = /* @__PURE__ */ z({
+  __name: "SelectInput",
+  props: {
+    name: {},
+    items: {},
+    label: {},
+    placeholder: {},
+    disabled: { type: Boolean },
+    rules: {},
+    validateOnMount: { type: Boolean },
+    successMessage: {},
+    tertiaryLabel: {},
+    buttonClass: {},
+    multiple: { type: Boolean, default: !1 },
+    showAll: { type: Boolean, default: !1 },
+    itemKey: { default: "id" },
+    itemText: { default: "name" },
+    modelValue: {},
+    boxShadow: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = ae(s.name), { value: u, errorMessage: n, handleChange: p, meta: v, setTouched: $ } = te(
+      () => s.name,
+      s.rules,
+      {
+        validateOnMount: s.validateOnMount,
+        initialValue: s.modelValue
+      }
+    ), c = P(
+      s.multiple ? Array.isArray(s.modelValue) ? s.modelValue : [] : s.modelValue
+    );
+    q(
+      () => s.modelValue,
+      (x) => {
+        if (s.multiple) {
+          const F = Array.isArray(x) ? x : [];
+          F !== c.value && (c.value = F, u.value = F);
+        } else
+          x !== c.value && (c.value = x, u.value = x);
+      },
+      { immediate: !0 }
+    ), q(
+      c,
+      (x) => {
+        a("update:modelValue", x);
+      }
+    );
+    const d = B(() => {
+      const x = [
+        "sl-relative",
+        "sl-w-full",
+        "sl-cursor-default",
+        "sl-rounded-md",
+        "sl-bg-white",
+        "sl-py-2",
+        "sl-pl-3",
+        "sl-pr-10",
+        "sl-text-left",
+        "sl-border",
+        "sl-text-sm",
+        "focus:sl-outline-none",
+        "focus:sl-ring-2",
+        "focus:sl-ring-stachelock-500",
+        "focus:sl-border-stachelock-500",
+        "sl-transition-all",
+        "sl-duration-200"
+      ];
+      return s.disabled ? x.push(
+        "sl-bg-gray-50",
+        "sl-text-gray-500",
+        "sl-cursor-not-allowed",
+        "sl-border-gray-200"
+      ) : n.value ? x.push(
+        "sl-border-red-300",
+        "focus:sl-ring-red-500",
+        "focus:sl-border-red-500"
+      ) : v.valid && v.touched ? x.push(
+        "sl-border-green-300",
+        "focus:sl-ring-green-500",
+        "focus:sl-border-green-500"
+      ) : x.push(
+        "sl-border-gray-300",
+        "hover:sl-border-gray-400"
+      ), x.join(" ");
+    }), g = (x) => x[s.itemKey], h = (x) => x[s.itemText] || x.toString(), k = B(() => c.value ? s.multiple && Array.isArray(c.value) ? c.value.length === 0 ? "" : c.value.length === 1 ? h(c.value[0]) : `${c.value.length} items selected` : h(c.value) : ""), C = B(() => c.value ? s.multiple && Array.isArray(c.value) ? c.value.length === 1 ? c.value[0].icon : null : c.value.icon : null), A = B(() => s.items.filter((x) => !x.disabled)), D = (x) => {
+      c.value = x, $(!0), p(x);
+    }, i = B(() => {
+      if (!s.multiple || !Array.isArray(c.value)) return !1;
+      const x = A.value;
+      return x.length === 0 ? !1 : x.every((F) => c.value.includes(F));
+    }), I = () => {
+      s.multiple && (i.value ? c.value = [] : c.value = [...A.value], p(c.value));
+    };
+    return (x, F) => (o(), r("div", ua, [
+      _(ee, {
+        id: f(m),
+        name: x.name,
+        label: x.label,
+        disabled: x.disabled,
+        optional: !x.rules,
+        "tertiary-label": x.tertiaryLabel,
+        "box-shadow": x.boxShadow,
+        "error-message": f(n),
+        "success-message": x.successMessage,
+        "is-valid": f(v).valid,
+        "is-touched": f(v).touched
+      }, {
+        "success-message": L(() => [
+          x.successMessage ? (o(), r("span", ba, w(x.successMessage), 1)) : b("", !0)
+        ]),
+        default: L(() => [
+          _(f(Fs), {
+            modelValue: c.value,
+            "onUpdate:modelValue": [
+              F[1] || (F[1] = (y) => c.value = y),
+              D
+            ],
+            disabled: x.disabled,
+            multiple: x.multiple
+          }, {
+            default: L(() => [
+              e("div", ca, [
+                _(f(Ns), {
+                  id: f(m),
+                  class: V([
+                    d.value,
+                    x.buttonClass
+                  ])
+                }, {
+                  default: L(() => [
+                    e("span", ma, [
+                      C.value ? (o(), K(ce(C.value), {
+                        key: 0,
+                        class: "sl-h-4 sl-w-4 sl-flex-shrink-0",
+                        "aria-hidden": "true"
+                      })) : b("", !0),
+                      k.value ? (o(), r("span", fa, w(k.value), 1)) : (o(), r("span", ga, w(x.placeholder || "Select an option"), 1))
+                    ]),
+                    e("span", pa, [
+                      _(f(Qe), {
+                        class: "sl-h-5 sl-w-5 sl-text-gray-400",
+                        "aria-hidden": "true"
+                      })
+                    ])
+                  ]),
+                  _: 1
+                }, 8, ["id", "class"]),
+                _(xe, {
+                  "leave-active-class": "sl-transition sl-duration-100 sl-ease-in",
+                  "leave-from-class": "sl-opacity-100",
+                  "leave-to-class": "sl-opacity-0"
+                }, {
+                  default: L(() => [
+                    _(f(Rs), { class: "sl-absolute sl-z-10 sl-mt-1 sl-max-h-56 sl-w-full sl-overflow-auto sl-rounded-md sl-bg-white sl-py-1 sl-text-base sl-shadow-lg sl-ring-1 sl-ring-black sl-ring-opacity-5 focus:sl-outline-none sm:sl-text-sm" }, {
+                      default: L(() => [
+                        x.multiple && x.showAll ? (o(), r("li", {
+                          key: 0,
+                          role: "button",
+                          tabindex: "0",
+                          onMousedown: F[0] || (F[0] = Y(() => {
+                          }, ["prevent"])),
+                          onClick: Y(I, ["prevent", "stop"]),
+                          class: V([
+                            "sl-relative sl-cursor-pointer sl-select-none sl-py-2 sl-pl-3 sl-pr-9",
+                            "hover:sl-bg-stachelock-600 hover:sl-text-white"
+                          ])
+                        }, [
+                          e("span", ha, w(i.value ? "Unselect All" : "Select All"), 1)
+                        ], 32)) : b("", !0),
+                        (o(!0), r(E, null, j(x.items, (y) => (o(), K(f(Us), {
+                          key: g(y),
+                          value: y,
+                          as: "template",
+                          disabled: y.disabled
+                        }, {
+                          default: L(({ active: N, selected: Z }) => [
+                            e("li", {
+                              class: V([
+                                "sl-relative sl-cursor-default sl-select-none sl-py-2 sl-pl-3 sl-pr-9",
+                                N ? "sl-bg-stachelock-600 sl-text-white" : "sl-text-gray-900",
+                                y.disabled ? "sl-opacity-50 sl-cursor-not-allowed" : ""
+                              ])
+                            }, [
+                              e("div", va, [
+                                y.icon ? (o(), K(ce(y.icon), {
+                                  key: 0,
+                                  class: V(["sl-h-4 sl-w-4 sl-flex-shrink-0", N ? "sl-text-white" : "sl-text-gray-400"]),
+                                  "aria-hidden": "true"
+                                }, null, 8, ["class"])) : b("", !0),
+                                e("span", {
+                                  class: V([
+                                    "sl-block sl-truncate",
+                                    Z ? "sl-font-medium" : "sl-font-normal"
+                                  ])
+                                }, w(h(y)), 3)
+                              ]),
+                              Z ? (o(), r("span", ya, [
+                                _(f(Ge), {
+                                  class: "sl-h-5 sl-w-5",
+                                  "aria-hidden": "true"
+                                })
+                              ])) : b("", !0)
+                            ], 2)
+                          ]),
+                          _: 2
+                        }, 1032, ["value", "disabled"]))), 128))
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                })
+              ])
+            ]),
+            _: 1
+          }, 8, ["modelValue", "disabled", "multiple"])
+        ]),
+        _: 1
+      }, 8, ["id", "name", "label", "disabled", "optional", "tertiary-label", "box-shadow", "error-message", "success-message", "is-valid", "is-touched"])
+    ]));
+  }
+}), xa = { class: "sl-flex sl-items-center sl-gap-4" }, wa = { class: "sl-flex sl-items-center sl-gap-2" }, ka = { class: "sl-w-32" }, _e = /* @__PURE__ */ z({
+  __name: "CalendarHeader",
+  props: {
+    view: {},
+    selectedRange: {}
+  },
+  emits: ["changeRange", "changeView"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = [
+      { id: "day", name: "Day" },
+      { id: "week", name: "Week" },
+      { id: "month", name: "Month" },
+      { id: "year", name: "Year" }
+    ], u = P(m.find((v) => v.id === s.view) || m[2]);
+    q(() => s.view, (v) => {
+      const $ = m.find((c) => c.id === v);
+      $ && (u.value = $);
+    }), q(u, (v) => {
+      v && a("changeView", v.id);
+    });
+    const n = () => a("changeRange", "prev"), p = () => a("changeRange", "next");
+    return (v, $) => (o(), r("div", xa, [
+      e("div", wa, [
+        _(X, {
+          size: "sm",
+          theme: "light",
+          outlined: !0,
+          "center-label": "",
+          onButtonClick: n
+        }, {
+          default: L(() => $[1] || ($[1] = [
+            Q("Prev", -1)
+          ])),
+          _: 1,
+          __: [1]
+        }),
+        _(X, {
+          size: "sm",
+          theme: "light",
+          outlined: !0,
+          "center-label": "",
+          onButtonClick: p
+        }, {
+          default: L(() => $[2] || ($[2] = [
+            Q("Next", -1)
+          ])),
+          _: 1,
+          __: [2]
+        })
+      ]),
+      e("div", ka, [
+        _(re, {
+          name: "calendarView",
+          items: m,
+          modelValue: u.value,
+          "onUpdate:modelValue": $[0] || ($[0] = (c) => u.value = c),
+          placeholder: "Select view",
+          "box-shadow": !1
+        }, null, 8, ["modelValue"])
+      ])
+    ]));
+  }
+}), $a = { class: "sl-text-center" }, _a = { class: "sl-isolate sl-mt-2 sl-grid sl-grid-cols-7 sl-gap-px sl-rounded-lg sl-bg-gray-200 sl-text-sm sl-shadow sl-ring-1 sl-ring-gray-200" }, Ca = ["onClick", "onDblclick"], Sa = ["datetime"], Ma = {
+  key: 0,
+  class: "sl-absolute sl-top-1 sl-right-1 sl-h-2 sl-w-2 sl-rounded-full sl-bg-stachelock-600"
+}, Ce = /* @__PURE__ */ z({
+  __name: "MonthCalendar",
+  props: {
+    days: {},
+    events: {}
+  },
+  emits: ["selectDay", "select:event", "doubleSelectDay"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = (v) => s.events ? s.events.some(($) => new Date($.datetime || $.start_time || "").toISOString().split("T")[0] === v.date) : !1, u = B(
+      () => s.days.map((v) => ({
+        ...v,
+        id: v.id || v.date,
+        hasEvent: m(v)
+      }))
+    ), n = (v) => a("selectDay", v), p = (v) => a("doubleSelectDay", v);
+    return (v, $) => (o(), r("div", $a, [
+      $[0] || ($[0] = e("div", { class: "sl-mt-6 sl-grid sl-grid-cols-7 sl-text-xs sl-leading-6 sl-text-gray-500" }, [
+        e("div", null, "S"),
+        e("div", null, "M"),
+        e("div", null, "T"),
+        e("div", null, "W"),
+        e("div", null, "T"),
+        e("div", null, "F"),
+        e("div", null, "S")
+      ], -1)),
+      e("div", _a, [
+        (o(!0), r(E, null, j(u.value, (c, d) => (o(), r("button", {
+          key: c.id,
+          type: "button",
+          class: V([
+            "sl-relative sl-py-1.5 hover:sl-bg-gray-100 focus:sl-z-10",
+            c.isCurrentMonth ? "sl-bg-white" : "sl-bg-gray-50",
+            (c.isSelected || c.isToday) && "sl-font-semibold",
+            c.isSelected && "sl-text-white",
+            !c.isSelected && c.isCurrentMonth && !c.isToday && "sl-text-gray-800",
+            !c.isSelected && !c.isCurrentMonth && !c.isToday && "sl-text-gray-400",
+            c.isToday && !c.isSelected && "sl-text-stachelock-600",
+            d === 0 && "sl-rounded-tl-lg",
+            d === 6 && "sl-rounded-tr-lg",
+            d === v.days.length - 7 && "sl-rounded-bl-lg",
+            d === v.days.length - 1 && "sl-rounded-br-lg"
+          ]),
+          onClick: (g) => n(c),
+          onDblclick: (g) => p(c)
+        }, [
+          e("time", {
+            datetime: c.date,
+            class: V([
+              "sl-mx-auto sl-flex sl-h-7 sl-w-7 sl-items-center sl-justify-center sl-rounded-full",
+              c.isToday ? "sl-bg-stachelock-600 sl-text-white" : c.isSelected ? "sl-bg-gray-900 sl-text-white" : ""
+            ])
+          }, w(((c?.date || "").split("-").pop() || "").replace(/^0/, "")), 11, Sa),
+          c.hasEvent ? (o(), r("span", Ma)) : b("", !0)
+        ], 42, Ca))), 128))
+      ])
+    ]));
+  }
+}), Ta = ["src"], Ba = {
+  key: 1,
+  class: "sl-h-14 sl-w-14 sl-flex-none sl-rounded-md sl-bg-gray-100 sl-flex sl-items-center sl-justify-center"
+}, Va = { class: "sl-relative sl-h-8 sl-w-8" }, Aa = { class: "sl-flex-auto" }, La = { class: "sl-font-semibold sl-text-gray-800" }, Ia = { class: "sl-mt-2 sl-flex sl-flex-col xl:sl-flex-row" }, Da = { class: "sl-flex sl-items-start sl-space-x-3" }, Ea = ["datetime"], Pa = { class: "sl-flex sl-items-start sl-space-x-3 sl-mt-2 xl:sl-ml-3.5 xl:sl-mt-0 xl:sl-border-l xl:sl-border-gray-400 xl:sl-border-opacity-50 xl:sl-pl-3.5" }, za = {
+  key: 1,
+  class: "sl-relative sl-h-5 sl-w-5"
+}, pe = /* @__PURE__ */ z({
+  __name: "EventCard",
+  props: {
+    event: {
+      type: Object,
+      required: !0
+    }
+  },
+  emits: ["navigate-to-event"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = () => {
+      a("navigate-to-event", s.event.id);
+    }, u = (n) => new Date(n).toLocaleDateString("en-US", {
+      month: "short",
+      day: "2-digit",
+      year: "numeric"
+    });
+    return (n, p) => (o(), r("li", {
+      class: "sl-relative sl-flex sl-space-x-6 sl-py-6 sl-cursor-pointer",
+      onClick: m
+    }, [
+      t.event.geocodeResult?.thumbnailUrl ? (o(), r("img", {
+        key: 0,
+        src: t.event.geocodeResult.thumbnailUrl,
+        alt: "",
+        class: "sl-h-14 sl-w-14 sl-flex-none sl-rounded-md"
+      }, null, 8, Ta)) : (o(), r("div", Ba, [
+        e("div", Va, [
+          _(f(el), { class: "sl-absolute sl-h-full sl-w-full sl-text-gray-400" }),
+          _(f(sl), { class: "sl-absolute sl-top-1/2 sl-left-1/2 sl-h-5 sl-w-5 -sl-translate-x-1/2 -sl-translate-y-1/2 sl-text-gray-400" })
+        ])
+      ])),
+      e("div", Aa, [
+        e("h3", La, w(t.event.name), 1),
+        e("dl", Ia, [
+          e("div", Da, [
+            _(f(Xs), {
+              class: "sl-h-5 sl-w-5 sl-text-gray-400",
+              "aria-hidden": "true"
+            }),
+            e("dd", null, [
+              e("time", {
+                datetime: t.event.datetime
+              }, w(u(t.event.date)) + " at " + w(t.event.time), 9, Ea)
+            ])
+          ]),
+          e("div", Pa, [
+            t.event.geocodeResult ? (o(), K(f(Pe), {
+              key: 0,
+              class: "sl-h-5 sl-w-5 sl-text-gray-400",
+              "aria-hidden": "true"
+            })) : (o(), r("div", za, [
+              _(f(Zs), { class: "sl-absolute sl-h-full sl-w-full sl-text-gray-400" }),
+              _(f(Pe), { class: "sl-absolute sl-top-1/2 sl-left-1/2 sl-h-3 sl-w-3 -sl-translate-x-1/2 -sl-translate-y-1/2 sl-text-gray-400" })
+            ])),
+            e("dd", null, w(t.event.location), 1)
+          ])
+        ])
+      ])
+    ]));
+  }
+}), Oa = { class: "sl-relative" }, ja = { class: "sl-flex sl-justify-between sl-items-center sl-mb-4" }, Fa = { class: "sl-text-lg sl-font-bold" }, Na = { key: 0 }, Ra = { class: "sl-divide-y sl-divide-gray-100 sl-text-sm sl-leading-6 sl-mb-8" }, Ua = { key: 1 }, Ha = { class: "sl-text-lg sl-font-bold sl-mb-2" }, Ka = { class: "sl-divide-y sl-divide-gray-100 sl-text-sm sl-leading-6" }, Wa = {
+  key: 2,
+  class: "sl-px-6 sl-py-14 sl-text-center sl-text-sm sm:sl-px-14"
+}, Se = /* @__PURE__ */ z({
+  __name: "EventsList",
+  props: {
+    events: {},
+    showAllButton: { type: Boolean }
+  },
+  emits: ["show:all"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = /* @__PURE__ */ new Date(), u = /* @__PURE__ */ new Date();
+    u.setMonth(m.getMonth() + 3);
+    const n = B(() => !s.events || !Array.isArray(s.events) ? [] : s.events.filter((c) => {
+      const d = new Date(c.datetime);
+      return d >= m && d <= u;
+    }).sort((c, d) => new Date(c.datetime).getTime() - new Date(d.datetime).getTime())), p = B(() => !s.events || !Array.isArray(s.events) ? [] : s.events.filter((c) => new Date(c.datetime) < m).sort((c, d) => new Date(d.datetime).getTime() - new Date(c.datetime).getTime())), v = B(() => {
+      const c = {};
+      return p.value.forEach((d) => {
+        const g = new Date(d.datetime).getFullYear().toString();
+        c[g] || (c[g] = []), c[g].push(d);
+      }), Object.entries(c).sort(([d], [g]) => Number(g) - Number(d)).map(([d, g]) => ({ year: d, events: g }));
+    }), $ = () => a("show:all");
+    return (c, d) => (o(), r("div", Oa, [
+      e("div", ja, [
+        e("h2", Fa, [
+          n.value.length ? (o(), r(E, { key: 0 }, [
+            Q("Upcoming Events")
+          ], 64)) : v.value.length ? (o(), r(E, { key: 1 }, [
+            Q("Past Events")
+          ], 64)) : (o(), r(E, { key: 2 }, [
+            Q("Events")
+          ], 64))
+        ]),
+        c.showAllButton ? (o(), K(X, {
+          key: 0,
+          "center-label": "",
+          size: "xs",
+          onButtonClick: $
+        }, {
+          default: L(() => d[0] || (d[0] = [
+            Q(" Show all ", -1)
+          ])),
+          _: 1,
+          __: [0]
+        })) : b("", !0)
+      ]),
+      n.value.length ? (o(), r("div", Na, [
+        e("ol", Ra, [
+          (o(!0), r(E, null, j(n.value, (g) => (o(), K(pe, {
+            key: g.id,
+            event: g
+          }, null, 8, ["event"]))), 128))
+        ])
+      ])) : b("", !0),
+      v.value.length ? (o(), r("div", Ua, [
+        (o(!0), r(E, null, j(v.value, (g) => (o(), r("div", {
+          key: g.year,
+          class: "sl-mb-8"
+        }, [
+          e("h2", Ha, w(g.year), 1),
+          d[1] || (d[1] = e("hr", { class: "sl-border-gray-200 sl-mb-4" }, null, -1)),
+          e("ol", Ka, [
+            (o(!0), r(E, null, j(g.events, (h) => (o(), K(pe, {
+              key: h.id,
+              event: h
+            }, null, 8, ["event"]))), 128))
+          ])
+        ]))), 128))
+      ])) : b("", !0),
+      !n.value.length && !v.value.length ? (o(), r("div", Wa, [
+        _(f(zs), {
+          class: "sl-mx-auto sl-h-6 sl-w-6 sl-text-gray-400",
+          "aria-hidden": "true"
+        }),
+        d[2] || (d[2] = e("p", { class: "sl-mt-4 sl-font-semibold sl-text-gray-800" }, "No events", -1)),
+        d[3] || (d[3] = e("p", { class: "sl-mt-2 sl-text-gray-500" }, "Add events to get started!", -1))
+      ])) : b("", !0)
+    ]));
+  }
+}), qa = { class: "lg:sl-grid lg:sl-grid-cols-12 lg:sl-gap-x-8" }, Qa = { class: "sl-mt-10 sl-text-center lg:sl-col-start-8 lg:sl-col-end-13 lg:sl-row-start-1 lg:sl-mt-9 xl:sl-col-start-9 xl:sl-col-end-13 sl-h-auto lg:sl-border-l lg:sl-border-gray-100 lg:sl-pl-8 lg:sl-h-full" }, Ga = { class: "sl-mt-4" }, Ja = /* @__PURE__ */ z({
+  __name: "CalendarDashboard",
+  props: {
+    days: {},
+    events: {}
+  },
+  emits: ["selectDay", "doubleSelectDay", "newEvent", "monthChange", "showAll"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = P(null), u = B(
+      () => s.events.length !== n.value.length
+    ), n = B(() => m.value ? s.events.filter((h) => new Date(h.datetime).toISOString().split("T")[0] === m.value?.date) : s.events), p = (h) => {
+      m.value = h, a("selectDay", h);
+    }, v = (h) => {
+      a("doubleSelectDay", h);
+    }, $ = (h) => {
+      console.log("View changed to:", h);
+    }, c = (h) => {
+      h === "prev" ? a("monthChange", "prev") : h === "next" && a("monthChange", "next");
+    }, d = () => {
+      a("newEvent");
+    }, g = () => {
+      m.value = null, a("showAll");
+    };
+    return (h, k) => (o(), r("div", qa, [
+      e("div", Qa, [
+        _(_e, {
+          view: "month",
+          selectedRange: h.days,
+          onChangeView: $,
+          onChangeRange: c
+        }, null, 8, ["selectedRange"]),
+        _(Ce, {
+          days: h.days,
+          events: h.events,
+          onSelectDay: p,
+          onDoubleSelectDay: v
+        }, null, 8, ["days", "events"]),
+        e("div", Ga, [
+          _(X, {
+            "center-label": "",
+            type: "button",
+            onClick: d,
+            size: "sm",
+            expanded: ""
+          }, {
+            default: L(() => k[0] || (k[0] = [
+              Q(" Add event ", -1)
+            ])),
+            _: 1,
+            __: [0]
+          })
+        ])
+      ]),
+      _(Se, {
+        class: "lg:sl-col-span-7 xl:sl-col-span-8 sl-py-6",
+        events: n.value,
+        "show-all-button": u.value,
+        "onShow:all": g
+      }, null, 8, ["events", "show-all-button"])
+    ]));
+  }
+}), ns = /* @__PURE__ */ oe(Ja, [["__scopeId", "data-v-d92b7279"]]);
+function rs(t) {
+  const l = new Date(t), s = l.getHours(), a = l.getMinutes(), m = s * 60 + a;
+  return Math.round(m / 5 + 2);
+}
+const is = (t, l) => {
+  if (!t || !l) return 1;
+  const s = new Date(t), m = (new Date(l).getTime() - s.getTime()) / (1e3 * 60), u = 1 / 5;
+  return Math.round(m * u);
+}, ds = (t) => {
+  const l = new Date(t), s = l.getHours(), a = l.getMinutes(), m = s >= 12 ? "PM" : "AM", u = s % 12 || 12, n = a < 10 ? `0${a}` : a;
+  return `${u}:${n} ${m}`;
+}, Ya = (t, l = "month") => {
+  let s;
+  if (l === "month")
+    switch (t) {
+      case "Monday":
+        s = 1;
+        break;
+      case "Tuesday":
+        s = 2;
+        break;
+      case "Wednesday":
+        s = 3;
+        break;
+      case "Thursday":
+        s = 4;
+        break;
+      case "Friday":
+        s = 5;
+        break;
+      case "Saturday":
+        s = 6;
+        break;
+      case "Sunday":
+        s = 7;
+        break;
+      default:
+        s = 1;
+    }
+  else if (l === "week")
+    switch (t) {
+      case "Sunday":
+        s = 1;
+        break;
+      case "Monday":
+        s = 2;
+        break;
+      case "Tuesday":
+        s = 3;
+        break;
+      case "Wednesday":
+        s = 4;
+        break;
+      case "Thursday":
+        s = 5;
+        break;
+      case "Friday":
+        s = 6;
+        break;
+      case "Saturday":
+        s = 7;
+        break;
+      default:
+        s = 1;
+    }
+  else
+    s = 1;
+  return s;
+}, Xa = { class: "sl-isolate sl-flex sl-flex-auto sl-overflow-hidden sl-bg-white" }, Za = { class: "sl-grid sl-grid-cols-7 sl-text-sm sl-leading-6 sl-text-gray-500 xl:sl-hidden" }, eo = ["onClick"], so = { class: "sl-flex sl-flex-auto" }, lo = { class: "sl-grid sl-flex-auto sl-grid-cols-1 sl-grid-rows-1" }, to = {
+  class: "sl-col-start-1 sl-col-end-2 sl-row-start-1 sl-grid sl-divide-y sl-divide-gray-100",
+  style: { "grid-template-rows": "repeat(48, minmax(3.5rem, 1fr))" }
+}, ao = { class: "sl-relative" }, oo = { class: "sl-sticky sl-left-0 sl-z-20 -sl-ml-14 -sl-mt-2.5 sl-w-14 sl-pr-2 sl-text-right sl-text-xs sl-leading-5 sl-text-gray-400" }, no = {
+  class: "sl-col-end-2 sl-row-start-1 sl-grid sl-grid-cols-1",
+  style: { "grid-template-rows": "1.75rem repeat(288, minmax(0, 1fr)) auto" }
+}, ro = ["onClick"], io = { class: "sl-order-1 sl-font-semibold sl-text-blue-700" }, uo = { class: "sl-text-blue-500 group-hover:sl-text-blue-700" }, co = ["datetime"], us = /* @__PURE__ */ z({
+  __name: "DayCalendar",
+  props: {
+    days: {}
+  },
+  emits: ["selectDay", "select:event"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = P(null), u = P(null), n = P(null), p = P(null), v = [
+      "12AM",
+      "1AM",
+      "2AM",
+      "3AM",
+      "4AM",
+      "5AM",
+      "6AM",
+      "7AM",
+      "8AM",
+      "9AM",
+      "10AM",
+      "11AM",
+      "12PM",
+      "1PM",
+      "2PM",
+      "3PM",
+      "4PM",
+      "5PM",
+      "6PM",
+      "7PM",
+      "8PM",
+      "9PM",
+      "10PM",
+      "11PM"
+    ], $ = (h) => p.value === h, c = (h) => {
+      p.value = h, a("selectDay", h);
+    }, d = (h) => a("select:event", h), g = B(() => p.value ? [p.value] : s.days);
+    return ne(() => {
+      const h = (/* @__PURE__ */ new Date()).getHours() * 60, k = m.value, C = u.value, A = n.value;
+      k && C && A && (k.scrollTop = (k.scrollHeight - C.offsetHeight - A.offsetHeight) * h / 1440);
+    }), (h, k) => (o(), r(E, null, [
+      e("div", Xa, [
+        e("div", {
+          ref_key: "container",
+          ref: m,
+          class: "sl-flex sl-flex-auto sl-flex-col sl-overflow-auto"
+        }, [
+          e("div", {
+            ref_key: "containerNav",
+            ref: u,
+            class: "sl-sticky sl-top-0 sl-z-10 sl-bg-white sl-text-xs sl-text-gray-500 sl-shadow sl-ring-1 sl-ring-black sl-ring-opacity-5 md:sl-hidden"
+          }, [
+            e("div", Za, [
+              (o(!0), r(E, null, j(h.days, (C) => (o(), r("button", {
+                key: C.date,
+                type: "button",
+                class: "sl-flex sl-flex-col sl-items-center sl-pb-3 sl-pt-2",
+                onClick: (A) => c(C)
+              }, [
+                Q(w(C.shortDay) + " ", 1),
+                e("span", {
+                  class: V(["sl-mt-1 sl-flex sl-h-8 sl-w-8 sl-items-center sl-justify-center sl-font-semibold sl-text-gray-800", $(C) ? "sl-rounded-full sl-bg-stachelock-600 sl-font-semibold sl-text-white" : ""])
+                }, w(C.day), 3)
+              ], 8, eo))), 128))
+            ])
+          ], 512),
+          e("div", so, [
+            k[1] || (k[1] = e("div", { class: "sl-w-14 sl-flex-none sl-bg-white sl-ring-1 sl-ring-gray-100" }, null, -1)),
+            e("div", lo, [
+              e("div", to, [
+                e("div", {
+                  ref_key: "containerOffset",
+                  ref: n,
+                  class: "sl-row-end-1 sl-h-7"
+                }, null, 512),
+                (o(), r(E, null, j(v, (C) => (o(), r(E, { key: C }, [
+                  e("div", ao, [
+                    e("div", oo, w(C), 1)
+                  ]),
+                  k[0] || (k[0] = e("div", null, null, -1))
+                ], 64))), 64))
+              ]),
+              e("ol", no, [
+                (o(!0), r(E, null, j(g.value, (C) => (o(), r(E, {
+                  key: C.date
+                }, [
+                  C.events && C.events.length ? (o(!0), r(E, { key: 0 }, j(C.events, (A) => (o(), r("li", {
+                    key: A.id,
+                    class: "sl-relative sl-mt-px sl-flex",
+                    style: le(`grid-row: ${f(rs)(A.datetime)} / span ${f(is)(A.startTime?.dateTime, A.endTime?.dateTime)}`)
+                  }, [
+                    e("button", {
+                      onClick: (D) => d(A.id),
+                      class: "sl-justify-start sl-group sl-absolute sl-inset-1 sl-flex sl-flex-col sl-overflow-y-auto sl-rounded-lg sl-bg-blue-50 sl-p-2 sl-text-xs sl-leading-5 hover:sl-bg-blue-100"
+                    }, [
+                      e("p", io, w(A.name), 1),
+                      e("p", uo, [
+                        e("time", {
+                          datetime: A.datetime
+                        }, w(f(ds)(A.datetime)) + " " + w(A.startTime?.shortTimeZone), 9, co)
+                      ])
+                    ], 8, ro)
+                  ], 4))), 128)) : b("", !0)
+                ], 64))), 128))
+              ])
+            ])
+          ])
+        ], 512)
+      ]),
+      k[2] || (k[2] = e("div", { class: "md:sl-block sl-hidden sl-w-1/2 sl-max-w-md sl-flex-none sl-border-l sl-border-gray-100 sl-px-8 sl-py-10" }, null, -1))
+    ], 64));
+  }
+}), mo = {
+  style: { width: "165%" },
+  class: "sl-flex sl-max-w-full sl-flex-none sl-flex-col sm:sl-max-w-none md:sl-max-w-full"
+}, fo = { class: "sl-grid sl-grid-cols-7 sl-text-sm sl-leading-6 sl-text-gray-500 xl:sl-hidden" }, go = ["onClick"], po = { class: "sl--mr-px sl-hidden sl-grid-cols-7 sl-divide-x sl-divide-gray-100 sl-border-r sl-border-gray-100 sl-text-sm sl-leading-6 sl-text-gray-500 xl:sl-grid" }, ho = { class: "sl-items-center sl-justify-center sl-font-semibold sl-text-gray-800" }, vo = { class: "sl-flex sl-flex-auto" }, yo = { class: "sl-grid sl-flex-auto sl-grid-cols-1 sl-grid-rows-1" }, bo = {
+  class: "sl-col-start-1 sl-col-end-2 sl-row-start-1 sl-grid sl-divide-y sl-divide-gray-100",
+  style: { "grid-template-rows": "repeat(48, minmax(3.5rem, 1fr))" }
+}, xo = { class: "sl-relative" }, wo = { class: "sl-sticky sl-left-0 sl-z-20 -sl-ml-14 -sl-mt-2.5 sl-w-14 sl-pr-2 sl-text-right sl-text-xs sl-leading-5 sl-text-gray-400" }, ko = { class: "sl-col-start-1 sl-col-end-2 sl-row-start-1 sl-hidden sl-grid-cols-7 sl-grid-rows-1 sl-divide-x sl-divide-gray-100 sm:sl-grid sm:sl-grid-cols-7" }, $o = {
+  class: "sl-col-end-2 sl-row-start-1 sl-grid sl-grid-cols-1 sm:sl-grid-cols-7 sm:sl-pr-8",
+  style: { "grid-template-rows": "1.75rem repeat(288, minmax(0, 1fr)) auto" }
+}, _o = ["onClick"], Co = { class: "sl-order-1 sl-font-semibold sl-text-blue-700" }, So = { class: "sl-text-blue-500 group-hover:sl-text-blue-700" }, Mo = ["datetime"], cs = /* @__PURE__ */ z({
+  __name: "WeekCalendar",
+  props: {
+    days: {}
+  },
+  emits: ["selectDay", "select:event"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = P(null), u = P(null), n = P(null), p = P(null), v = (C) => a("select:event", C), $ = (C) => {
+      p.value = C;
+    }, c = (C) => p.value === C, d = [
+      "12AM",
+      "1AM",
+      "2AM",
+      "3AM",
+      "4AM",
+      "5AM",
+      "6AM",
+      "7AM",
+      "8AM",
+      "9AM",
+      "10AM",
+      "11AM",
+      "12PM",
+      "1PM",
+      "2PM",
+      "3PM",
+      "4PM",
+      "5PM",
+      "6PM",
+      "7PM",
+      "8PM",
+      "9PM",
+      "10PM",
+      "11PM"
+    ];
+    ne(() => {
+      const C = (/* @__PURE__ */ new Date()).getHours() * 60, A = m.value, D = u.value, i = n.value;
+      A && D && i && (A.scrollTop = (A.scrollHeight - D.offsetHeight - i.offsetHeight) * C / 1440);
+    });
+    const g = P(window.innerWidth < 768), h = () => {
+      g.value = window.innerWidth < 768;
+    };
+    ne(() => {
+      window.addEventListener("resize", h), q(g, (C) => {
+        if (!C) {
+          const A = k.value.find((D) => (D.events?.length || 0) > 0);
+          A && $(A);
+        }
+      });
+    }), Ts(() => window.removeEventListener("resize", h));
+    const k = B(() => g.value && p.value ? [p.value] : s.days || []);
+    return (C, A) => (o(), r("div", {
+      ref_key: "container",
+      ref: m,
+      class: "sl-isolate sl-flex sl-flex-auto sl-flex-col sl-overflow-auto sl-bg-white"
+    }, [
+      e("div", mo, [
+        e("div", {
+          ref_key: "containerNav",
+          ref: u,
+          class: "sl-sticky sl-top-0 sl-z-30 sl-flex-none sl-bg-white sl-shadow sl-ring-1 sl-ring-black sl-ring-opacity-5 sm:sl-pr-8"
+        }, [
+          e("div", fo, [
+            (o(!0), r(E, null, j(C.days, (D) => (o(), r("button", {
+              key: D.date,
+              type: "button",
+              class: "sl-flex sl-flex-col sl-items-center sl-pb-3 sl-pt-2",
+              onClick: (i) => $(D)
+            }, [
+              Q(w(D.shortDay) + " ", 1),
+              e("span", {
+                class: V(["sl-mt-1 sl-flex sl-h-8 sl-w-8 sl-items-center sl-justify-center sl-font-semibold sl-text-gray-800", c(D) ? "sl-rounded-full sl-bg-stachelock-600 sl-font-semibold sl-text-white" : ""])
+              }, w(D.day), 3)
+            ], 8, go))), 128))
+          ]),
+          e("div", po, [
+            A[0] || (A[0] = e("div", { class: "sl-col-end-1 sl-w-14" }, null, -1)),
+            (o(!0), r(E, null, j(C.days, (D) => (o(), r("div", {
+              key: D.date,
+              class: "sl-flex sl-items-center sl-justify-center sl-py-3"
+            }, [
+              e("span", null, [
+                Q(w(D.longDay) + " ", 1),
+                e("span", ho, w(D.day), 1)
+              ])
+            ]))), 128))
+          ])
+        ], 512),
+        e("div", vo, [
+          A[2] || (A[2] = e("div", { class: "sl-sticky sl-left-0 sl-z-10 sl-w-14 sl-flex-none sl-bg-white sl-ring-1 sl-ring-gray-100" }, null, -1)),
+          e("div", yo, [
+            e("div", bo, [
+              e("div", {
+                ref_key: "containerOffset",
+                ref: n,
+                class: "sl-row-end-1 sl-h-7"
+              }, null, 512),
+              (o(), r(E, null, j(d, (D) => (o(), r(E, { key: D }, [
+                e("div", xo, [
+                  e("div", wo, w(D), 1)
+                ]),
+                A[1] || (A[1] = e("div", null, null, -1))
+              ], 64))), 64))
+            ]),
+            e("div", ko, [
+              (o(!0), r(E, null, j(C.days, (D) => (o(), r("div", {
+                key: D.date,
+                class: "sl-col-start-1 sl-row-span-full"
+              }))), 128))
+            ]),
+            e("ol", $o, [
+              (o(!0), r(E, null, j(k.value, (D) => (o(), r(E, {
+                key: D.date
+              }, [
+                D.events && D.events.length && D.longDay ? (o(!0), r(E, { key: 0 }, j(D.events, (i) => (o(), r("li", {
+                  key: i.id,
+                  class: V(["sl-relative sl-mt-px sl-flex", `sl-col-start-${f(Ya)(D.longDay, "week")}`]),
+                  style: le(`grid-row: ${f(rs)(i.datetime)} / span ${f(is)(i.startTime?.dateTime, i.endTime?.dateTime)}`)
+                }, [
+                  e("button", {
+                    onClick: (I) => v(i.id),
+                    class: "sl-group sl-absolute sl-inset-1 sl-flex sl-flex-col sl-overflow-y-auto sl-rounded-lg sl-bg-blue-50 sl-p-2 sl-text-xs sl-leading-5 hover:sl-bg-blue-100"
+                  }, [
+                    e("p", Co, w(i.name), 1),
+                    e("p", So, [
+                      e("time", {
+                        datetime: i.datetime
+                      }, w(f(ds)(i.datetime)) + " " + w(i.startTime?.shortTimeZone), 9, Mo)
+                    ])
+                  ], 8, _o)
+                ], 6))), 128)) : b("", !0)
+              ], 64))), 128))
+            ])
+          ])
+        ])
+      ])
+    ], 512));
+  }
+}), To = { class: "sl-grid sl-grid-cols-1 md:sl-grid-cols-2 lg:sl-grid-cols-3 sl-gap-6" }, Bo = { class: "sl-text-sm sl-font-medium sl-mb-2" }, Vo = { class: "sl-grid sl-grid-cols-7 sl-gap-px sl-bg-gray-200 sl-rounded sl-overflow-hidden" }, Ao = { class: "sl-text-[10px] sl-text-gray-500" }, ms = /* @__PURE__ */ z({
+  __name: "YearCalendar",
+  props: {
+    months: {}
+  },
+  setup(t) {
+    return (l, s) => (o(), r("div", To, [
+      (o(!0), r(E, null, j(l.months, (a) => (o(), r("div", {
+        key: a.name,
+        class: "sl-bg-white sl-rounded sl-shadow sl-p-3"
+      }, [
+        e("div", Bo, w(a.name), 1),
+        e("div", Vo, [
+          (o(!0), r(E, null, j(a.days, (m) => (o(), r("div", {
+            key: m.date,
+            class: "sl-bg-white sl-p-1 sl-h-10"
+          }, [
+            e("div", Ao, w(m.day), 1)
+          ]))), 128))
+        ])
+      ]))), 128))
+    ]));
+  }
+}), Lo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  CalendarDashboard: ns,
+  CalendarHeader: _e,
+  DayCalendar: us,
+  EventCard: pe,
+  EventsList: Se,
+  MonthCalendar: Ce,
+  WeekCalendar: cs,
+  YearCalendar: ms
+}, Symbol.toStringTag, { value: "Module" })), Io = {
+  key: 1,
+  class: "sl-p-4 sl-bg-yellow-50 sl-border sl-border-yellow-200 sl-rounded-md"
+}, Do = { class: "sl-flex" }, Eo = { class: "sl-ml-3" }, Po = { class: "sl-mt-2 sl-text-sm sl-text-yellow-700" }, Me = /* @__PURE__ */ z({
+  __name: "DynamicFormField",
+  props: {
+    field: {},
+    modelValue: {},
+    formData: {}
+  },
+  emits: ["update:modelValue", "field-change"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = {
+      text: () => Promise.resolve(J),
+      email: () => Promise.resolve(J),
+      password: () => Promise.resolve(J),
+      number: () => Promise.resolve(J),
+      tel: () => Promise.resolve(J),
+      url: () => Promise.resolve(J),
+      textarea: () => import("./TextAreaInput-Di6Kstic.js"),
+      select: () => import("./SelectInput-B5liNv7H.js"),
+      combobox: () => import("./ComboboxInput-B98P_8CZ.js"),
+      checkbox: () => import("./CheckboxInput-rWkcde69.js"),
+      switch: () => import("./SwitchInput-D1k9O8gn.js")
+    }, u = B(() => {
+      const d = m[s.field.type];
+      return d ? we({
+        loader: d,
+        errorComponent: () => null,
+        delay: 0
+      }) : null;
+    }), n = B({
+      get: () => s.modelValue ?? s.field.defaultValue ?? $(),
+      set: (d) => {
+        a("update:modelValue", d), a("field-change", s.field, d);
+      }
+    }), p = B(() => {
+      const d = {
+        name: s.field.name,
+        label: s.field.label,
+        placeholder: s.field.placeholder,
+        disabled: s.field.disabled,
+        rules: s.field.validation,
+        validateOnMount: s.field.validateOnMount,
+        tertiaryLabel: s.field.tertiaryLabel,
+        successMessage: s.field.successMessage
+      };
+      switch (s.field.type) {
+        case "text":
+        case "email":
+        case "password":
+        case "number":
+        case "tel":
+        case "url":
+          return {
+            ...d,
+            type: s.field.inputType || s.field.type,
+            maxlength: s.field.maxLength,
+            minlength: s.field.minLength,
+            min: s.field.min,
+            max: s.field.max,
+            step: s.field.step,
+            spellcheck: s.field.spellcheck,
+            autocomplete: s.field.autocomplete
+          };
+        case "textarea":
+          return {
+            ...d,
+            rows: s.field.rows,
+            maxlength: s.field.maxLength,
+            spellcheck: s.field.spellcheck
+          };
+        case "select":
+          return {
+            ...d,
+            items: s.field.options || [],
+            multiple: s.field.multiple,
+            itemKey: s.field.optionKey || "value",
+            itemText: s.field.optionLabel || "label",
+            showAll: s.field.showSelectAll
+          };
+        case "combobox":
+          return {
+            ...d,
+            items: s.field.options || [],
+            itemKey: s.field.optionKey || "value",
+            itemText: s.field.optionLabel || "label",
+            customQuery: s.field.customQuery,
+            loading: s.field.loading
+          };
+        case "checkbox":
+          return {
+            ...d,
+            description: s.field.description,
+            immediate: s.field.immediate ?? !0,
+            isDescriptionHtml: s.field.isDescriptionHtml
+          };
+        case "switch":
+          return {
+            ...d,
+            description: s.field.description,
+            immediate: s.field.immediate ?? !0,
+            boxShadow: s.field.boxShadow,
+            hideMainLabel: s.field.hideMainLabel,
+            textTrue: s.field.textTrue,
+            textFalse: s.field.textFalse
+          };
+        default:
+          return d;
+      }
+    }), v = B(() => {
+      const d = {};
+      return s.field.onBlur && (d.blur = s.field.onBlur), s.field.onFocus && (d.focus = s.field.onFocus), s.field.onChange && (d["update:modelValue"] = (g) => {
+        n.value = g, s.field.onChange?.(g, s.field, s.formData ?? {});
+      }), d;
+    }), $ = () => {
+      switch (s.field.type) {
+        case "checkbox":
+        case "switch":
+          return !1;
+        case "select":
+          return s.field.multiple ? [] : null;
+        case "number":
+          return s.field.min || 0;
+        default:
+          return "";
+      }
+    }, c = (d) => {
+      n.value = d;
+    };
+    return (d, g) => u.value ? (o(), K(ce(u.value), he({ key: 0 }, p.value, Bs(v.value), {
+      "model-value": n.value,
+      "onUpdate:modelValue": c
+    }), null, 16, ["model-value"])) : (o(), r("div", Io, [
+      e("div", Do, [
+        _(f(ll), { class: "sl-h-5 sl-w-5 sl-text-yellow-400" }),
+        e("div", Eo, [
+          g[0] || (g[0] = e("h3", { class: "sl-text-sm sl-font-medium sl-text-yellow-800" }, " Unknown field type ", -1)),
+          e("div", Po, [
+            e("p", null, 'Field type "' + w(d.field.type) + '" is not supported.', 1)
+          ])
+        ])
+      ])
+    ]));
+  }
+}), zo = {
+  key: 0,
+  class: "sl-mb-6"
+}, Oo = {
+  key: 0,
+  class: "sl-text-lg sl-font-semibold sl-text-gray-900 sl-mb-2"
+}, jo = {
+  key: 1,
+  class: "sl-text-sm sl-text-gray-600"
+}, Fo = {
+  key: 0,
+  class: "sl-mb-4"
+}, No = {
+  key: 0,
+  class: "sl-text-md sl-font-medium sl-text-gray-900 sl-mb-1"
+}, Ro = {
+  key: 1,
+  class: "sl-text-sm sl-text-gray-600"
+}, Uo = {
+  key: 2,
+  class: "sl-mt-4"
+}, Ho = { class: "sl-bg-red-50 sl-border sl-border-red-200 sl-rounded-md sl-p-4" }, Ko = { class: "sl-flex" }, Wo = { class: "sl-ml-3" }, qo = { class: "sl-mt-2 sl-text-sm sl-text-red-700" }, fs = /* @__PURE__ */ z({
+  __name: "DynamicForm",
+  props: {
+    schema: {},
+    modelValue: {},
+    loading: { type: Boolean },
+    showActions: { type: Boolean, default: !0 },
+    showCancelButton: { type: Boolean, default: !1 },
+    submitButtonText: {},
+    cancelButtonText: {},
+    submitButtonVariant: { default: "primary" },
+    actionsAlignment: { default: "right" },
+    formError: {}
+  },
+  emits: ["update:modelValue", "submit", "cancel", "field-change"],
+  setup(t, { expose: l, emit: s }) {
+    const a = t, m = s, u = P(), n = qe({}), { handleSubmit: p, setErrors: v, meta: $ } = Ls({
+      keepValuesOnUnmount: !0
+    }), c = () => {
+      const M = { ...a.modelValue };
+      a.schema.sections.forEach((U) => {
+        U.fields.forEach((H) => {
+          H.name in M || (M[H.name] = H.defaultValue ?? D(H.type));
+        });
+      }), Object.assign(n, M);
+    };
+    q(
+      () => a.modelValue,
+      (M) => {
+        M && Object.assign(n, M);
+      },
+      { deep: !0 }
+    ), q(
+      n,
+      (M) => {
+        m("update:modelValue", { ...M });
+      },
+      { deep: !0 }
+    ), c();
+    const d = B(() => a.schema.sections.filter(
+      (M) => M.condition ? M.condition(n) : !0
+    )), g = B(() => {
+      const M = ["sl-space-y-6"];
+      return a.schema.className && M.push(a.schema.className), M.join(" ");
+    }), h = (M) => {
+      const U = [
+        "sl-grid",
+        "sl-gap-4"
+      ], H = M.columns || 1;
+      return U.push("sl-grid-cols-1"), H > 1 && U.push(`md:sl-grid-cols-${Math.min(H, 3)}`), M.className && U.push(M.className), U.join(" ");
+    }, k = (M) => {
+      const U = [];
+      return M.colSpan && M.colSpan > 1 && U.push(`sl-col-span-${Math.min(M.colSpan, 3)}`), M.className && U.push(M.className), U.join(" ");
+    }, C = (M) => M.condition ? M.condition(n, M) : !0, A = B(() => $.value.valid), D = (M) => {
+      switch (M) {
+        case "checkbox":
+        case "switch":
+          return !1;
+        case "select":
+          return null;
+        case "number":
+          return 0;
+        default:
+          return "";
+      }
+    }, i = p((M) => {
+      m("submit", M, { setErrors: v });
+    }), I = () => {
+      m("cancel");
+    }, x = (M, U) => {
+      m("field-change", M, U, n), M.onFieldChange && M.onFieldChange(U, M, n);
+    };
+    return l({
+      validate: async () => $.value.valid,
+      reset: () => {
+        Object.keys(n).forEach((M) => {
+          delete n[M];
+        }), c();
+      },
+      setFieldValue: (M, U) => {
+        n[M] = U;
+      },
+      getFieldValue: (M) => n[M],
+      formData: n,
+      formRef: u
+    }), (M, U) => (o(), r("form", {
+      ref_key: "formRef",
+      ref: u,
+      class: V(g.value),
+      onSubmit: U[0] || (U[0] = Y(
+        //@ts-ignore
+        (...H) => f(i) && f(i)(...H),
+        ["prevent"]
+      ))
+    }, [
+      M.schema.title || M.schema.description ? (o(), r("div", zo, [
+        M.schema.title ? (o(), r("h2", Oo, w(M.schema.title), 1)) : b("", !0),
+        M.schema.description ? (o(), r("p", jo, w(M.schema.description), 1)) : b("", !0)
+      ])) : b("", !0),
+      (o(!0), r(E, null, j(d.value, (H, O) => (o(), r("div", {
+        key: H.id || O
+      }, [
+        H.title || H.description ? (o(), r("div", Fo, [
+          H.title ? (o(), r("h3", No, w(H.title), 1)) : b("", !0),
+          H.description ? (o(), r("p", Ro, w(H.description), 1)) : b("", !0)
+        ])) : b("", !0),
+        e("div", {
+          class: V(h(H))
+        }, [
+          (o(!0), r(E, null, j(H.fields, (R) => (o(), r("div", {
+            key: R.name,
+            class: V(k(R))
+          }, [
+            C(R) ? (o(), K(Me, {
+              key: 0,
+              field: R,
+              modelValue: n[R.name],
+              "onUpdate:modelValue": (ie) => n[R.name] = ie,
+              "form-data": n,
+              onFieldChange: x
+            }, null, 8, ["field", "modelValue", "onUpdate:modelValue", "form-data"])) : b("", !0)
+          ], 2))), 128))
+        ], 2)
+      ]))), 128)),
+      M.showActions ? (o(), r("div", {
+        key: 1,
+        class: V([
+          "sl-flex sl-gap-3",
+          M.actionsAlignment === "center" ? "sl-justify-center" : M.actionsAlignment === "right" ? "sl-justify-end" : "sl-justify-start"
+        ])
+      }, [
+        M.showCancelButton ? (o(), K(X, {
+          key: 0,
+          variant: "outline",
+          disabled: M.loading,
+          type: "button",
+          onClick: I
+        }, {
+          default: L(() => [
+            Q(w(M.cancelButtonText || "Cancel"), 1)
+          ]),
+          _: 1
+        }, 8, ["disabled"])) : b("", !0),
+        _(X, {
+          variant: M.submitButtonVariant,
+          loading: M.loading,
+          disabled: !A.value || M.loading,
+          type: "submit"
+        }, {
+          default: L(() => [
+            Q(w(M.submitButtonText || "Submit"), 1)
+          ]),
+          _: 1
+        }, 8, ["variant", "loading", "disabled"])
+      ], 2)) : b("", !0),
+      M.formError ? (o(), r("div", Uo, [
+        e("div", Ho, [
+          e("div", Ko, [
+            _(f(tl), { class: "sl-h-5 sl-w-5 sl-text-red-400" }),
+            e("div", Wo, [
+              U[1] || (U[1] = e("h3", { class: "sl-text-sm sl-font-medium sl-text-red-800" }, " Form Error ", -1)),
+              e("div", qo, [
+                e("p", null, w(M.formError), 1)
+              ])
+            ])
+          ])
+        ])
+      ])) : b("", !0)
+    ], 34));
+  }
+}), Qo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  DynamicForm: fs,
+  FormField: Me,
+  FormFieldWrapper: ee
+}, Symbol.toStringTag, { value: "Module" })), Go = { class: "sl-w-full" }, Jo = { class: "sl-flex sl-items-start sl-gap-3" }, Yo = { class: "sl-flex sl-h-6 sl-shrink-0 sl-items-center" }, Xo = { class: "sl-group group sl-grid sl-w-4 sl-h-4 sl-grid-cols-1" }, Zo = ["id", "aria-describedby", "name", "disabled"], en = { class: "sl-flex-1 sl-text-sm sl-leading-6" }, sn = ["for"], ln = ["id"], tn = ["innerHTML"], an = { key: 1 }, Te = /* @__PURE__ */ z({
+  __name: "CheckboxInput",
+  props: {
+    name: {},
+    label: {},
+    description: {},
+    disabled: { type: Boolean },
+    rules: {},
+    immediate: { type: Boolean, default: !0 },
+    isDescriptionHtml: { type: Boolean, default: !1 },
+    successMessage: {},
+    modelValue: { type: Boolean },
+    tertiaryLabel: {},
+    showErrors: { type: Boolean, default: !1 },
+    layout: { default: "stacked" },
+    boxShadow: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "blur", "focus"],
+  setup(t, { expose: l, emit: s }) {
+    const a = t, m = s, u = P(), n = P(null), p = ae(`sl-${a.name}`), { value: v, errorMessage: $, handleChange: c, handleBlur: d, meta: g } = te(
+      () => a.name,
+      a.rules,
+      {
+        type: "checkbox",
+        initialValue: a.modelValue || !1
+      }
+    ), h = P(a.modelValue || !1);
+    q(
+      () => a.modelValue,
+      (y) => {
+        y !== void 0 && y !== h.value && (h.value = y, v.value = y);
+      },
+      { immediate: !0 }
+    ), q(
+      h,
+      (y) => {
+        m("update:modelValue", y), a.immediate && c(y);
+      }
+    );
+    const k = B(() => {
+      const y = [
+        "sl-h-4",
+        "sl-w-4",
+        "sl-rounded",
+        "sl-border-gray-300",
+        "sl-text-stachelock-600",
+        "focus:sl-ring-stachelock-600",
+        "focus:sl-ring-2",
+        "focus:sl-ring-offset-2",
+        "sl-transition-all",
+        "sl-duration-200"
+      ];
+      return a.disabled ? y.push(
+        "sl-cursor-not-allowed",
+        "sl-opacity-50",
+        "sl-bg-gray-50"
+      ) : y.push(
+        "sl-cursor-pointer",
+        "hover:sl-border-gray-400"
+      ), $.value ? y.push(
+        "sl-border-red-300",
+        "focus:sl-ring-red-600"
+      ) : g.valid && g.touched && y.push(
+        "sl-border-green-300",
+        "focus:sl-ring-green-500"
+      ), y.join(" ");
+    }), C = (y) => {
+      const N = y.target;
+      h.value = N.checked, a.immediate || c(N.checked);
+    }, A = () => {
+      a.disabled || (h.value = !h.value);
+    }, D = () => {
+      u.value?.focus();
+    }, i = () => {
+      u.value?.blur();
+    }, I = (y) => {
+      a.immediate || c(h.value), d(y), m("blur", y);
+    }, x = (y) => {
+      m("focus", y);
+    }, F = (y) => {
+      a.disabled || y.target.tagName === "A" || A();
+    };
+    return l({
+      focus: D,
+      blur: i,
+      toggle: A,
+      checkboxRef: u
+    }), (y, N) => (o(), r("div", Go, [
+      _(ee, {
+        id: f(p),
+        name: y.name,
+        label: y.layout === "stacked" ? y.label : "",
+        disabled: y.disabled,
+        optional: !y.rules,
+        "tertiary-label": y.tertiaryLabel,
+        "box-shadow": y.boxShadow,
+        "error-message": f($),
+        "success-message": y.successMessage,
+        "is-valid": f(g).valid,
+        "is-touched": f(g).touched,
+        "show-errors": y.showErrors
+      }, {
+        default: L(() => [
+          e("div", Jo, [
+            e("div", Yo, [
+              e("div", Xo, [
+                me(e("input", {
+                  id: f(p),
+                  "aria-describedby": y.description ? `${f(p)}-description` : void 0,
+                  name: y.name,
+                  ref_key: "checkboxRef",
+                  ref: u,
+                  "onUpdate:modelValue": N[0] || (N[0] = (Z) => h.value = Z),
+                  type: "checkbox",
+                  disabled: y.disabled,
+                  class: V([
+                    "sl-col-start-1 sl-row-start-1 sl-w-full sl-h-full sl-appearance-none sl-rounded sl-border sl-border-gray-300 sl-bg-white",
+                    "checked:sl-border-stachelock-600 checked:sl-bg-stachelock-600",
+                    "indeterminate:sl-border-stachelock-600 indeterminate:sl-bg-stachelock-600",
+                    "focus-visible:sl-outline focus-visible:sl-outline-2 focus-visible:sl-outline-offset-2 focus-visible:sl-outline-stachelock-600",
+                    "disabled:sl-border-gray-300 disabled:sl-bg-gray-100 disabled:checked:sl-bg-gray-100",
+                    k.value
+                  ]),
+                  onChange: C,
+                  onFocus: x,
+                  onBlur: I
+                }, null, 42, Zo), [
+                  [Vs, h.value]
+                ]),
+                N[1] || (N[1] = e("svg", {
+                  class: "sl-pointer-events-none sl-col-start-1 sl-row-start-1 sl-w-3.5 sl-h-3.5 sl-self-center sl-justify-self-center sl-stroke-white",
+                  viewBox: "0 0 14 14",
+                  fill: "none"
+                }, [
+                  e("path", {
+                    class: "sl-opacity-0 group-has-[:checked]:sl-opacity-100",
+                    d: "M3 8L6 11L11 3.5",
+                    "stroke-width": "2",
+                    "stroke-linecap": "round",
+                    "stroke-linejoin": "round"
+                  }),
+                  e("path", {
+                    class: "sl-opacity-0 group-has-[:indeterminate]:sl-opacity-100",
+                    d: "M3 7H11",
+                    "stroke-width": "2",
+                    "stroke-linecap": "round",
+                    "stroke-linejoin": "round"
+                  })
+                ], -1))
+              ])
+            ]),
+            e("div", en, [
+              y.layout === "inline" && y.label ? (o(), r("label", {
+                key: 0,
+                for: f(p),
+                class: "sl-font-medium sl-text-gray-900 sl-cursor-pointer"
+              }, w(y.label), 9, sn)) : b("", !0),
+              y.description ? (o(), r("div", {
+                key: 1,
+                id: `${f(p)}-description`,
+                class: V(["sl-text-gray-600", [y.layout === "inline" ? "" : "sl-mt-1", { "sl-cursor-pointer": !y.disabled }]]),
+                ref_key: "descriptionHtml",
+                ref: n,
+                onClick: F
+              }, [
+                y.isDescriptionHtml ? (o(), r("div", {
+                  key: 0,
+                  innerHTML: y.description
+                }, null, 8, tn)) : (o(), r("span", an, w(y.description), 1))
+              ], 10, ln)) : b("", !0)
+            ])
+          ])
+        ]),
+        _: 1
+      }, 8, ["id", "name", "label", "disabled", "optional", "tertiary-label", "box-shadow", "error-message", "success-message", "is-valid", "is-touched", "show-errors"])
+    ]));
+  }
+}), on = { class: "sl-w-full" }, nn = { class: "sl-block sl-truncate sl-font-medium" }, rn = {
+  key: 1,
+  class: "sl-relative sl-cursor-default sl-select-none sl-py-2 sl-px-4 sl-text-gray-700"
+}, dn = { class: "sl-flex sl-items-center sl-gap-2" }, un = {
+  key: 2,
+  class: "sl-relative sl-cursor-default sl-select-none sl-py-2 sl-px-4 sl-text-gray-700"
+}, cn = { class: "sl-block sl-truncate" }, mn = { key: 0 }, fn = 50, Be = /* @__PURE__ */ z({
+  __name: "ComboboxInput",
+  props: {
+    name: {},
+    items: {},
+    label: {},
+    placeholder: {},
+    disabled: { type: Boolean },
+    rules: {},
+    validateOnMount: { type: Boolean },
+    successMessage: {},
+    tertiaryLabel: {},
+    itemKey: { default: "id" },
+    itemText: { default: "name" },
+    customQuery: {},
+    loading: { type: Boolean, default: !1 },
+    multiple: { type: Boolean, default: !1 },
+    showAll: { type: Boolean, default: !1 },
+    modelValue: {},
+    boxShadow: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "update:query", "blur", "focus"],
+  setup(t, { emit: l }) {
+    const s = t, a = l, m = ae(s.name), u = P(""), { value: n, errorMessage: p, handleChange: v, meta: $, setTouched: c } = te(
+      () => s.name,
+      s.rules,
+      {
+        validateOnMount: s.validateOnMount,
+        initialValue: s.modelValue
+      }
+    ), d = P(
+      s.multiple ? Array.isArray(s.modelValue) ? s.modelValue : [] : s.modelValue
+    );
+    q(
+      () => s.modelValue,
+      (T) => {
+        if (s.multiple) {
+          const W = Array.isArray(T) ? T : [];
+          W !== d.value && (d.value = W, n.value = W);
+        } else
+          T !== d.value && (d.value = T, n.value = T);
+      },
+      { immediate: !0 }
+    ), q(
+      d,
+      (T) => {
+        a("update:modelValue", T);
+      }
+    );
+    const g = B(() => [
+      "sl-w-full",
+      "sl-border-none",
+      "sl-py-2",
+      "sl-pl-3",
+      "sl-pr-10",
+      "sl-text-sm",
+      "sl-leading-5",
+      "sl-text-gray-900",
+      "focus:sl-outline-none",
+      "focus:sl-ring-0",
+      "sl-bg-transparent"
+    ].join(" ")), h = B(() => {
+      const T = [
+        "sl-relative",
+        "sl-w-full",
+        "sl-cursor-default",
+        "sl-rounded-lg",
+        "sl-bg-white",
+        "sl-text-left",
+        "sl-border",
+        "focus-within:sl-ring-2",
+        "focus-within:sl-ring-stachelock-500",
+        "focus-within:sl-border-stachelock-500",
+        "sl-transition-all",
+        "sl-duration-200"
+      ];
+      return s.disabled ? T.push(
+        "sl-bg-gray-50",
+        "sl-cursor-not-allowed",
+        "sl-border-gray-200"
+      ) : p.value ? T.push(
+        "sl-border-red-300",
+        "focus-within:sl-ring-red-500",
+        "focus-within:sl-border-red-500"
+      ) : $.valid && $.touched ? T.push(
+        "sl-border-green-300",
+        "focus-within:sl-ring-green-500",
+        "focus-within:sl-border-green-500"
+      ) : T.push(
+        "sl-border-gray-300",
+        "hover:sl-border-gray-400"
+      ), T.join(" ");
+    }), k = (T) => T[s.itemKey], C = (T) => T ? T[s.itemText] || T.toString() : "", A = P([]), D = P([]), i = P(1), I = () => {
+      const T = i.value * fn;
+      D.value = A.value.slice(0, T), i.value += 1;
+    }, x = () => {
+      i.value = 1, D.value = [], I();
+    }, F = () => {
+      if (u.value && u.value !== "")
+        if (s.customQuery)
+          A.value = s.customQuery(u.value, s.items);
+        else {
+          const T = u.value.toLowerCase();
+          A.value = s.items.filter((W) => C(W).toLowerCase().includes(T));
+        }
+      else
+        A.value = s.items;
+      x();
+    }, y = B(() => s.items.filter((T) => !T.disabled)), N = (T) => {
+      const W = T.target;
+      u.value = W.value, a("update:query", u.value), F();
+    }, Z = (T) => {
+      d.value = T, c(!0), v(T);
+    }, M = B(() => {
+      if (!s.multiple || !Array.isArray(d.value)) return !1;
+      const T = y.value;
+      return T.length === 0 ? !1 : T.every((W) => d.value.includes(W));
+    }), U = () => {
+      s.multiple && (M.value ? d.value = [] : d.value = [...y.value], v(d.value));
+    }, H = (T) => s.multiple ? !Array.isArray(T) || T.length === 0 ? "" : T.length === 1 ? C(T[0]) : `${T.length} selected` : C(T), O = B(() => s.multiple || u.value === "" ? null : { [s.itemKey]: null, [s.itemText]: u.value }), R = () => {
+      s.multiple || O.value && (s.customQuery ? (a("update:modelValue", u.value), v(u.value)) : (d.value = O.value, v(d.value)));
+    }, ie = (T) => {
+      const W = T.target;
+      W.scrollTop + W.clientHeight >= W.scrollHeight && I();
+    }, ks = (T) => {
+      a("focus", T);
+    }, $s = (T) => {
+      !s.multiple && O.value && (d.value = O.value, v(d.value), a("update:modelValue", d.value)), a("blur", T);
+    };
+    return q(() => s.items, () => {
+      F();
+    }, { immediate: !0, deep: !0 }), (T, W) => (o(), r("div", on, [
+      _(ee, {
+        id: f(m),
+        name: T.name,
+        label: T.label,
+        disabled: T.disabled,
+        optional: !T.rules,
+        "tertiary-label": T.tertiaryLabel,
+        "box-shadow": T.boxShadow,
+        "error-message": f(p),
+        "success-message": T.successMessage,
+        "is-valid": f($).valid,
+        "is-touched": f($).touched
+      }, {
+        "success-message": L(() => [
+          T.successMessage ? (o(), r("span", mn, w(T.successMessage), 1)) : b("", !0)
+        ]),
+        default: L(() => [
+          _(f(Hs), {
+            modelValue: d.value,
+            "onUpdate:modelValue": [
+              W[2] || (W[2] = (G) => d.value = G),
+              Z
+            ],
+            disabled: T.disabled,
+            multiple: T.multiple
+          }, {
+            default: L(() => [
+              e("div", {
+                class: V(h.value)
+              }, [
+                _(f(Ks), {
+                  id: f(m),
+                  class: V(g.value),
+                  "display-value": H,
+                  placeholder: T.placeholder || "Type to search...",
+                  modelValue: u.value,
+                  "onUpdate:modelValue": W[0] || (W[0] = (G) => u.value = G),
+                  onInput: N,
+                  onBlur: $s,
+                  onFocus: ks
+                }, null, 8, ["id", "class", "placeholder", "modelValue"]),
+                _(f(Ws), { class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-2" }, {
+                  default: L(() => [
+                    _(f(Qe), {
+                      class: "sl-h-5 sl-w-5 sl-text-gray-400",
+                      "aria-hidden": "true"
+                    })
+                  ]),
+                  _: 1
+                }),
+                _(f(ve), {
+                  leave: "sl-transition sl-ease-in sl-duration-100",
+                  "leave-from": "sl-opacity-100",
+                  "leave-to": "sl-opacity-0",
+                  onAfterLeave: W[1] || (W[1] = (G) => u.value = "")
+                }, {
+                  default: L(() => [
+                    A.value.length > 0 || u.value !== "" || T.multiple && T.showAll ? (o(), K(f(qs), {
+                      key: 0,
+                      class: "sl-absolute sl-z-10 sl-mt-1 sl-max-h-60 sl-w-full sl-overflow-auto sl-rounded-md sl-bg-white sl-py-1 sl-text-base sl-shadow-lg sl-ring-1 sl-ring-black sl-ring-opacity-5 focus:sl-outline-none sm:sl-text-sm",
+                      onScroll: ie
+                    }, {
+                      default: L(() => [
+                        T.multiple && T.showAll ? (o(), K(f(ye), {
+                          key: 0,
+                          value: null,
+                          disabled: !0,
+                          as: "template"
+                        }, {
+                          default: L(({ active: G }) => [
+                            e("li", {
+                              onClick: Y(U, ["prevent", "stop"]),
+                              class: V([
+                                "sl-relative sl-cursor-default sl-select-none sl-py-2 sl-pl-10 sl-pr-4",
+                                G ? "sl-bg-stachelock-600 sl-text-white" : "sl-text-gray-900"
+                              ])
+                            }, [
+                              e("span", nn, w(M.value ? "Unselect All" : "Select All"), 1)
+                            ], 2)
+                          ]),
+                          _: 1
+                        })) : b("", !0),
+                        T.loading ? (o(), r("div", rn, [
+                          e("div", dn, [
+                            _(os, { size: "sm" }),
+                            W[3] || (W[3] = e("span", null, "Loading...", -1))
+                          ])
+                        ])) : u.value !== "" && A.value.length === 0 ? (o(), r("div", un, " Nothing found. ")) : b("", !0),
+                        (o(!0), r(E, null, j(D.value, (G) => (o(), K(f(ye), {
+                          key: k(G),
+                          value: G,
+                          as: "template",
+                          disabled: G.disabled
+                        }, {
+                          default: L(({ active: Le, selected: Ie }) => [
+                            e("li", {
+                              class: V([
+                                "sl-relative sl-cursor-default sl-select-none sl-py-2 sl-pl-10 sl-pr-4",
+                                Le ? "sl-bg-stachelock-600 sl-text-white" : "sl-text-gray-900",
+                                G.disabled ? "sl-opacity-50 sl-cursor-not-allowed" : ""
+                              ])
+                            }, [
+                              e("span", {
+                                class: V([
+                                  "sl-block sl-truncate",
+                                  Ie ? "sl-font-medium" : "sl-font-normal"
+                                ])
+                              }, w(C(G)), 3),
+                              Ie ? (o(), r("span", {
+                                key: 0,
+                                class: V(["sl-absolute sl-inset-y-0 sl-left-0 sl-flex sl-items-center sl-pl-3", Le ? "sl-text-white" : "sl-text-stachelock-600"])
+                              }, [
+                                _(f(Ge), {
+                                  class: "sl-h-5 sl-w-5",
+                                  "aria-hidden": "true"
+                                })
+                              ], 2)) : b("", !0)
+                            ], 2)
+                          ]),
+                          _: 2
+                        }, 1032, ["value", "disabled"]))), 128)),
+                        !T.multiple && O.value ? (o(), K(f(ye), {
+                          key: 3,
+                          value: O.value,
+                          as: "template"
+                        }, {
+                          default: L(({ active: G }) => [
+                            e("li", {
+                              onClick: Y(R, ["prevent", "stop"]),
+                              class: V([
+                                "sl-relative sl-cursor-pointer sl-select-none sl-py-2 sl-pl-10 sl-pr-4",
+                                G ? "sl-bg-stachelock-600 sl-text-white" : "sl-text-gray-900"
+                              ])
+                            }, [
+                              e("span", cn, ' Enter "' + w(u.value) + '" manually ', 1)
+                            ], 2)
+                          ]),
+                          _: 1
+                        }, 8, ["value"])) : b("", !0)
+                      ]),
+                      _: 1
+                    })) : b("", !0)
+                  ]),
+                  _: 1
+                })
+              ], 2)
+            ]),
+            _: 1
+          }, 8, ["modelValue", "disabled", "multiple"])
+        ]),
+        _: 1
+      }, 8, ["id", "name", "label", "disabled", "optional", "tertiary-label", "box-shadow", "error-message", "success-message", "is-valid", "is-touched"])
+    ]));
+  }
+}), gn = { class: "sl-w-full" }, pn = { class: "sl-relative" }, hn = ["id", "name", "disabled", "placeholder", "spellcheck", "rows", "maxlength"], vn = {
+  key: 0,
+  class: "sl-absolute sl-bottom-2 sl-right-2 sl-text-xs sl-text-slate-500 sl-pointer-events-none"
+}, yn = { key: 0 }, Ve = /* @__PURE__ */ z({
+  __name: "TextAreaInput",
+  props: {
+    name: {},
+    label: {},
+    placeholder: {},
+    disabled: { type: Boolean },
+    rules: {},
+    validateOnMount: { type: Boolean },
+    successMessage: {},
+    tertiaryLabel: {},
+    spellcheck: { type: Boolean, default: !0 },
+    rows: { default: 4 },
+    maxlength: {},
+    inputClass: {},
+    inputStyle: { type: [Boolean, null, String, Object, Array] },
+    lazy: { type: Boolean, default: !1 },
+    modelValue: {},
+    boxShadow: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "blur", "focus"],
+  setup(t, { expose: l, emit: s }) {
+    const a = t, m = s, u = P(), n = ae(a.name), { value: p, errorMessage: v, handleBlur: $, handleChange: c, meta: d } = te(
+      () => a.name,
+      a.rules,
+      {
+        validateOnMount: a.validateOnMount,
+        initialValue: a.modelValue,
+        syncVModel: !0
+      }
+    );
+    q(
+      () => a.modelValue,
+      (i) => {
+        i !== p.value && (p.value = i || "");
+      }
+    ), q(
+      p,
+      (i) => {
+        m("update:modelValue", i);
+      }
+    );
+    const g = B(() => {
+      const i = [
+        "sl-w-full",
+        "sl-px-3",
+        "sl-py-2",
+        "sl-text-sm",
+        "sl-border",
+        "sl-rounded-md",
+        "sl-bg-white",
+        "sl-transition-all",
+        "sl-duration-200",
+        "focus:sl-outline-none",
+        "focus:sl-ring-2",
+        "focus:sl-ring-stachelock-500",
+        "focus:sl-border-stachelock-500",
+        "sl-resize-y",
+        "sl-min-h-[80px]"
+      ];
+      return a.disabled ? i.push(
+        "sl-bg-gray-50",
+        "sl-text-gray-500",
+        "sl-cursor-not-allowed",
+        "sl-border-gray-200"
+      ) : v.value ? i.push(
+        "sl-border-red-300",
+        "focus:sl-ring-red-500",
+        "focus:sl-border-red-500"
+      ) : d.valid && d.touched ? i.push(
+        "sl-border-green-300",
+        "focus:sl-ring-green-500",
+        "focus:sl-border-green-500"
+      ) : i.push(
+        "sl-border-gray-300",
+        "hover:sl-border-gray-400"
+      ), i.join(" ");
+    }), h = (i) => {
+      const I = i.target;
+      a.lazy || c(I.value);
+    }, k = (i) => {
+      if (a.lazy) {
+        const I = i.target;
+        c(I.value);
+      }
+      $(i), m("blur", i);
+    }, C = (i) => {
+      m("focus", i);
+    };
+    return l({
+      focus: () => {
+        u.value?.focus();
+      },
+      blur: () => {
+        u.value?.blur();
+      },
+      textareaRef: u
+    }), (i, I) => (o(), r("div", gn, [
+      _(ee, {
+        id: f(n),
+        name: i.name,
+        label: i.label,
+        disabled: i.disabled,
+        optional: !i.rules,
+        "tertiary-label": i.tertiaryLabel,
+        "box-shadow": i.boxShadow,
+        "error-message": f(v),
+        "success-message": i.successMessage,
+        "is-valid": f(d).valid,
+        "is-touched": f(d).touched
+      }, {
+        "success-message": L(() => [
+          i.successMessage ? (o(), r("span", yn, w(i.successMessage), 1)) : b("", !0)
+        ]),
+        default: L(() => [
+          e("div", pn, [
+            me(e("textarea", he({
+              id: f(n),
+              ref_key: "textareaRef",
+              ref: u,
+              "onUpdate:modelValue": I[0] || (I[0] = (x) => As(p) ? p.value = x : null),
+              name: i.name,
+              disabled: i.disabled,
+              placeholder: i.placeholder,
+              class: [
+                g.value,
+                i.inputClass
+              ],
+              style: i.inputStyle,
+              spellcheck: i.spellcheck,
+              rows: i.rows,
+              maxlength: i.maxlength
+            }, i.$attrs, {
+              onBlur: k,
+              onFocus: C,
+              onInput: h
+            }), null, 16, hn), [
+              [be, f(p)]
+            ]),
+            i.maxlength !== void 0 ? (o(), r("div", vn, w(f(p)?.length || 0) + "/" + w(i.maxlength), 1)) : b("", !0)
+          ])
+        ]),
+        _: 1
+      }, 8, ["id", "name", "label", "disabled", "optional", "tertiary-label", "box-shadow", "error-message", "success-message", "is-valid", "is-touched"])
+    ]));
+  }
+}), bn = { class: "sl-w-full" }, xn = { class: "sl-flex sl-items-center sl-justify-between sl-gap-4" }, wn = {
+  key: 0,
+  class: "sl-flex-1"
+}, kn = ["for"], $n = ["innerHTML"], _n = { key: 1 }, Cn = { class: "sl-sr-only" }, Sn = {
+  key: 1,
+  class: "sl-ml-3 sl-text-sm"
+}, Mn = {
+  key: 0,
+  class: "sl-font-medium sl-text-gray-800"
+}, Tn = {
+  key: 1,
+  class: "sl-text-gray-500"
+}, Bn = {
+  key: 2,
+  class: "sl-flex-1"
+}, Vn = {
+  key: 0,
+  class: "sl-mt-1 sl-text-sm sl-text-gray-600"
+}, An = ["innerHTML"], Ae = /* @__PURE__ */ z({
+  __name: "SwitchInput",
+  props: {
+    name: {},
+    modelValue: { type: Boolean },
+    label: {},
+    description: {},
+    disabled: { type: Boolean },
+    immediate: { type: Boolean, default: !1 },
+    boxShadow: { type: Boolean, default: !1 },
+    defaultValue: { type: Boolean, default: !1 },
+    hideMainLabel: { type: Boolean, default: !1 },
+    textTrue: {},
+    textFalse: {},
+    rules: {},
+    validateOnMount: { type: Boolean },
+    successMessage: {},
+    tertiaryLabel: {},
+    isDescriptionHtml: { type: Boolean, default: !1 },
+    showErrors: { type: Boolean, default: !1 },
+    layout: { default: "stacked" }
+  },
+  emits: ["update:modelValue", "blur", "focus"],
+  setup(t, { expose: l, emit: s }) {
+    const a = t, m = s, u = P(), n = ae(`sl-${a.name}`), { value: p, errorMessage: v, handleChange: $, handleBlur: c, meta: d } = te(
+      () => a.name,
+      a.rules,
+      {
+        type: "checkbox",
+        validateOnMount: a.validateOnMount,
+        initialValue: a.modelValue ?? a.defaultValue,
+        syncVModel: !0
+      }
+    ), g = P(a.modelValue ?? a.defaultValue);
+    q(
+      () => a.modelValue,
+      (i) => {
+        if (i !== void 0 && i !== g.value) {
+          const I = !!i;
+          g.value = I, p.value = I;
+        }
+      },
+      { immediate: !0 }
+    );
+    const h = B(() => {
+      const i = [
+        "sl-relative",
+        "sl-inline-flex",
+        "sl-items-center",
+        "sl-h-6",
+        "sl-w-11",
+        "sl-flex-shrink-0",
+        "sl-cursor-pointer",
+        "sl-rounded-full",
+        "sl-border-2",
+        "sl-border-transparent",
+        "sl-transition-colors",
+        "sl-duration-200",
+        "sl-ease-in-out",
+        "focus:sl-outline-none",
+        "focus:sl-ring-2",
+        "focus:sl-ring-stachelock-600",
+        "focus:sl-ring-offset-2"
+      ];
+      return a.disabled && i.push(
+        "sl-cursor-not-allowed",
+        "sl-opacity-50"
+      ), g.value ? i.push("sl-bg-stachelock-600") : i.push("sl-bg-gray-200"), i.join(" ");
+    }), k = (i) => {
+      a.disabled || (g.value = i, a.immediate && $(i), m("update:modelValue", i));
+    }, C = (i) => {
+      a.immediate || $(g.value), c(i), m("blur", i);
+    }, A = (i) => {
+      m("focus", i);
+    }, D = () => {
+      a.disabled || k(!g.value);
+    };
+    return l({
+      toggle: D,
+      value: g,
+      focus: () => {
+        (u.value?.$el ?? u.value)?.focus?.();
+      },
+      blur: () => {
+        (u.value?.$el ?? u.value)?.blur?.();
+      },
+      switchRef: u
+    }), (i, I) => (o(), r("div", bn, [
+      _(ee, {
+        id: f(n),
+        name: i.name,
+        label: i.layout === "stacked" && !i.hideMainLabel ? i.label : "",
+        disabled: i.disabled,
+        optional: !i.rules,
+        "tertiary-label": i.tertiaryLabel,
+        "box-shadow": i.boxShadow,
+        "error-message": f(v),
+        "success-message": i.successMessage,
+        "is-valid": f(d).valid,
+        "is-touched": f(d).touched,
+        "show-errors": i.showErrors
+      }, {
+        default: L(() => [
+          e("div", xn, [
+            i.layout === "inline" ? (o(), r("div", wn, [
+              i.label && !i.hideMainLabel ? (o(), r("label", {
+                key: 0,
+                for: f(n),
+                class: "sl-block sl-text-sm sl-font-medium sl-text-gray-900 sl-cursor-pointer"
+              }, w(i.label), 9, kn)) : b("", !0),
+              i.description ? (o(), r("div", {
+                key: 1,
+                class: V(["sl-mt-1 sl-text-sm sl-text-gray-600", { "sl-cursor-pointer": !i.disabled }]),
+                onClick: I[0] || (I[0] = (x) => !i.disabled && D())
+              }, [
+                i.isDescriptionHtml ? (o(), r("div", {
+                  key: 0,
+                  innerHTML: i.description
+                }, null, 8, $n)) : (o(), r("span", _n, w(i.description), 1))
+              ], 2)) : b("", !0)
+            ])) : b("", !0),
+            _(f(Qs), {
+              id: f(n),
+              ref_key: "switchRef",
+              ref: u,
+              modelValue: g.value,
+              "onUpdate:modelValue": [
+                I[1] || (I[1] = (x) => g.value = x),
+                k
+              ],
+              disabled: i.disabled,
+              class: V([
+                h.value,
+                { "sl-shadow-md": i.boxShadow }
+              ]),
+              onFocus: A,
+              onBlur: C,
+              onKeydown: [
+                fe(Y(D, ["prevent"]), ["space"]),
+                fe(Y(D, ["prevent"]), ["enter"])
+              ]
+            }, {
+              default: L(() => [
+                e("span", Cn, w(i.label), 1),
+                e("span", {
+                  class: V([
+                    g.value ? "sl-translate-x-5" : "sl-translate-x-0",
+                    "sl-pointer-events-none sl-inline-block sl-h-5 sl-w-5 sl-transform sl-rounded-full sl-bg-white sl-shadow sl-ring-0 sl-transition sl-duration-200 sl-ease-in-out sl-relative"
+                  ])
+                }, null, 2)
+              ]),
+              _: 1
+            }, 8, ["id", "modelValue", "disabled", "class", "onKeydown"]),
+            i.textTrue || i.textFalse ? (o(), r("span", Sn, [
+              g.value && i.textTrue ? (o(), r("span", Mn, w(i.textTrue), 1)) : !g.value && i.textFalse ? (o(), r("span", Tn, w(i.textFalse), 1)) : b("", !0)
+            ])) : b("", !0),
+            i.description && i.layout === "stacked" ? (o(), r("div", Bn, [
+              i.isDescriptionHtml ? (o(), r("p", {
+                key: 1,
+                class: "sl-mt-1 sl-text-sm sl-text-gray-600",
+                innerHTML: i.description
+              }, null, 8, An)) : (o(), r("p", Vn, w(i.description), 1))
+            ])) : b("", !0)
+          ])
+        ]),
+        _: 1
+      }, 8, ["id", "name", "label", "disabled", "optional", "tertiary-label", "box-shadow", "error-message", "success-message", "is-valid", "is-touched", "show-errors"])
+    ]));
+  }
+}), Ln = { class: "sl-bg-white sl-rounded-lg sl-shadow sl-p-6" }, In = { class: "sl-space-y-8" }, Dn = { class: "sl-grid sl-grid-cols-1 sl-md:grid-cols-2 sl-gap-6" }, En = { class: "sl-bg-gray-50 sl-rounded-md sl-p-4 sl-text-sm sl-text-gray-700" }, Pn = { class: "sl-whitespace-pre-wrap" }, gs = /* @__PURE__ */ z({
+  __name: "InputsShowcase",
+  setup(t) {
+    const l = qe({
+      text: "",
+      textArea: "",
+      switchOn: !1,
+      checkbox: !1,
+      selectedFruit: null,
+      selectedLanguages: [],
+      selectedCity: null
+    }), s = [
+      { id: 1, name: "Apple" },
+      { id: 2, name: "Banana" },
+      { id: 3, name: "Cherry" },
+      { id: 4, name: "Durian", disabled: !0 }
+    ], a = [
+      { id: 1, name: "TypeScript" },
+      { id: 2, name: "JavaScript" },
+      { id: 3, name: "Python" },
+      { id: 4, name: "Go" },
+      { id: 5, name: "Rust" }
+    ], m = [
+      { id: 1, name: "New York" },
+      { id: 2, name: "San Francisco" },
+      { id: 3, name: "Seattle" },
+      { id: 4, name: "Austin" },
+      { id: 5, name: "Chicago" },
+      { id: 6, name: "Denver" },
+      { id: 7, name: "Miami" },
+      { id: 8, name: "Boston" }
+    ];
+    return (u, n) => (o(), r("section", Ln, [
+      n[15] || (n[15] = e("h2", { class: "sl-text-xl sl-font-semibold sl-mb-4" }, "All Inputs Showcase", -1)),
+      e("div", In, [
+        e("div", null, [
+          n[7] || (n[7] = e("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Text Input", -1)),
+          _(J, {
+            name: "demoText",
+            label: "Text Input",
+            placeholder: "Type something...",
+            value: l.text,
+            "onUpdate:value": n[0] || (n[0] = (p) => l.text = p)
+          }, null, 8, ["value"])
+        ]),
+        e("div", null, [
+          n[8] || (n[8] = e("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Text Area", -1)),
+          _(Ve, {
+            name: "demoTextArea",
+            label: "Text Area",
+            placeholder: "Write a longer message...",
+            rows: 4,
+            maxlength: 200,
+            modelValue: l.textArea,
+            "onUpdate:modelValue": n[1] || (n[1] = (p) => l.textArea = p)
+          }, null, 8, ["modelValue"])
+        ]),
+        e("div", null, [
+          n[9] || (n[9] = e("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Switch", -1)),
+          _(Ae, {
+            name: "demoSwitch",
+            label: "Enable feature",
+            modelValue: l.switchOn,
+            "onUpdate:modelValue": n[2] || (n[2] = (p) => l.switchOn = p),
+            textTrue: "ON",
+            textFalse: "OFF"
+          }, null, 8, ["modelValue"])
+        ]),
+        e("div", null, [
+          n[10] || (n[10] = e("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Checkbox", -1)),
+          _(Te, {
+            name: "demoCheckbox",
+            label: "I agree to the terms",
+            modelValue: l.checkbox,
+            "onUpdate:modelValue": n[3] || (n[3] = (p) => l.checkbox = p)
+          }, null, 8, ["modelValue"])
+        ]),
+        e("div", Dn, [
+          e("div", null, [
+            n[11] || (n[11] = e("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Select (Single)", -1)),
+            _(re, {
+              name: "demoSelect",
+              label: "Favorite Fruit",
+              placeholder: "Select a fruit",
+              items: s,
+              modelValue: l.selectedFruit,
+              "onUpdate:modelValue": n[4] || (n[4] = (p) => l.selectedFruit = p)
+            }, null, 8, ["modelValue"])
+          ]),
+          e("div", null, [
+            n[12] || (n[12] = e("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Select (Multiple)", -1)),
+            _(re, {
+              name: "demoSelectMulti",
+              label: "Favorite Languages",
+              placeholder: "Select languages",
+              items: a,
+              multiple: "",
+              showAll: "",
+              modelValue: l.selectedLanguages,
+              "onUpdate:modelValue": n[5] || (n[5] = (p) => l.selectedLanguages = p)
+            }, null, 8, ["modelValue"])
+          ])
+        ]),
+        e("div", null, [
+          n[13] || (n[13] = e("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Combobox", -1)),
+          _(Be, {
+            name: "demoCombobox",
+            label: "Search a City",
+            placeholder: "Start typing...",
+            items: m,
+            modelValue: l.selectedCity,
+            "onUpdate:modelValue": n[6] || (n[6] = (p) => l.selectedCity = p)
+          }, null, 8, ["modelValue"])
+        ]),
+        e("div", En, [
+          n[14] || (n[14] = e("div", { class: "sl-font-semibold sl-mb-1" }, "State", -1)),
+          e("pre", Pn, w(l), 1)
+        ])
+      ])
+    ]));
+  }
+}), zn = { key: 0 }, On = ["onUpdate:modelValue", "placeholder", "disabled", "onKeydown", "onBlur"], jn = ["onClick", "disabled"], Fn = { class: "sl-flex-1 sl-min-w-0 sl-relative" }, Nn = ["placeholder", "disabled", "onKeydown"], Rn = { class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-pointer-events-auto" }, Un = {
+  key: 0,
+  class: "sl-absolute sl-z-50 sl-mt-1 sl-max-h-60 sl-w-full sl-overflow-auto sl-rounded-md sl-bg-white sl-py-1 sl-text-base sl-shadow-lg sl-ring-1 sl-ring-black sl-ring-opacity-5 focus:sl-outline-none sm:sl-text-sm"
+}, Hn = ["onClick"], Kn = { class: "sl-flex" }, Wn = { class: "sl-truncate sl-font-semibold" }, qn = { class: "sl-block sl-truncate" }, Qn = {
+  key: 0,
+  class: "sl-ml-2 sl-truncate sl-text-gray-500"
+}, ps = /* @__PURE__ */ z({
+  __name: "TagifyInput",
+  props: {
+    items: {
+      type: Array,
+      required: !0
+    },
+    value: {
+      type: Array,
+      default: () => []
+    },
+    name: {
+      type: String,
+      required: !0
+    },
+    label: {
+      type: String,
+      required: !1
+    },
+    itemKey: {
+      type: String,
+      default: "id"
+    },
+    itemText: {
+      type: String,
+      default: "value"
+    },
+    itemSubtext: {
+      type: String,
+      default: "name"
+    },
+    showSubext: {
+      type: Boolean,
+      default: !0
+    },
+    tagDisplayKey: {
+      type: String,
+      default: "name"
+    },
+    tertiaryLabel: {
+      type: String,
+      required: !1
+    },
+    pattern: {
+      type: RegExp,
+      default: null
+    },
+    inline: {
+      type: Boolean,
+      default: !1
+    },
+    placeholder: {
+      type: String,
+      default: "Add a tag..."
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    optional: {
+      type: Boolean,
+      default: !1
+    },
+    errorMessage: {
+      type: String,
+      default: ""
+    },
+    hasInputRing: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["update:value", "update:query", "invalid-tag"],
+  setup(t, { expose: l, emit: s }) {
+    const a = t, m = s, u = P(""), n = P([]), p = P(JSON.parse(JSON.stringify(a.value))), v = P(!1);
+    q(
+      () => a.value,
+      (i) => {
+        JSON.stringify(i) !== JSON.stringify(p.value) && (p.value = JSON.parse(JSON.stringify(i)));
+      },
+      { deep: !0 }
+    );
+    const $ = (i) => i[a.itemSubtext] || i[a.itemText], c = (i) => i[a.itemSubtext] ? i[a.itemText] : void 0, d = (i) => i[a.tagDisplayKey] || i[a.itemText], g = () => {
+      if (u.value && u.value.length > 0) {
+        m("update:query", u.value);
+        const i = u.value.toLowerCase();
+        n.value = a.items.filter((I) => I[a.itemText]?.toLowerCase().includes(i) || I[a.itemSubtext]?.toLowerCase().includes(i)), v.value = !0;
+      } else
+        n.value = [], v.value = !1;
+    }, h = () => {
+      const i = u.value.trim();
+      if (i === "")
+        return;
+      let I = null;
+      const x = i.toLowerCase(), F = a.items.find(
+        (y) => y[a.itemText]?.toLowerCase() === x || y[a.itemSubtext]?.toLowerCase() === x
+      );
+      if (F)
+        I = { ...F };
+      else if (a.pattern && a.pattern.test(i))
+        I = { id: null, [a.itemText]: i };
+      else
+        return;
+      p.value.some(
+        (y) => y[a.itemText] === I[a.itemText]
+      ) || (p.value.push(I), m("update:value", p.value)), u.value = "", n.value = [], v.value = !1;
+    }, k = (i) => {
+      const I = i[a.itemText].trim();
+      p.value.some(
+        (x) => x[a.itemText] === I
+      ) || (p.value.push({ ...i }), m("update:value", p.value)), u.value = "", n.value = [], v.value = !1;
+    }, C = (i) => {
+      p.value.splice(i, 1), m("update:value", p.value);
+    }, A = (i) => {
+      p.value[i].isEditing = !0, de(() => {
+      });
+    }, D = (i) => {
+      const I = p.value[i];
+      if (I) {
+        I.isEditing = !1;
+        const x = I[a.itemText].trim();
+        if (a.pattern && !a.pattern.test(x)) {
+          m("invalid-tag", x), C(i);
+          return;
+        }
+        I[a.itemText] = x, m("update:value", p.value);
+      }
+    };
+    return ne(() => {
+      n.value = [];
+    }), l({
+      selectedTags: p
+    }), (i, I) => (o(), K(ee, {
+      id: t.name,
+      name: t.name,
+      label: t.label,
+      "tertiary-label": t.tertiaryLabel,
+      "error-message": t.errorMessage,
+      disabled: t.disabled,
+      optional: t.optional
+    }, {
+      "tertiary-label-overlay": L(() => [
+        S(i.$slots, "tertiary-overlay")
+      ]),
+      default: L(() => [
+        e("div", {
+          class: V(["sl-flex sl-flex-wrap sl-items-center sl-gap-4 sl-rounded-md sl-bg-white sl-px-3 sm:sl-text-sm sm:sl-leading-6", t.inline ? null : "sl-shadow-sm sl-border sl-border-gray-300 focus-within:sl-ring-2 focus-within:sl-ring-stachelock-600"])
+        }, [
+          (o(!0), r(E, null, j(p.value, (x, F) => (o(), K(Ze, {
+            key: F,
+            onClick: (y) => A(F),
+            theme: "primary",
+            size: "sm"
+          }, {
+            default: L(() => [
+              x.isEditing ? me((o(), r("input", {
+                key: 1,
+                ref_for: !0,
+                ref: "editInput",
+                "onUpdate:modelValue": (y) => x[a.itemText] = y,
+                placeholder: t.placeholder,
+                disabled: t.disabled,
+                onKeydown: fe(Y((y) => D(F), ["prevent"]), ["enter"]),
+                onBlur: (y) => D(F),
+                class: "sl-bg-transparent sl-border-none sl-outline-none sl-text-stachelock-600 sl-text-sm placeholder:sl-text-stachelock-400/80 focus:sl-ring-0 focus:sl-ring-stachelock-600 focus:sl-rounded-lg -sl-mx-3 -sl-my-2",
+                style: le({ width: x[a.itemText].length + 4 + "ch" })
+              }, null, 44, On)), [
+                [be, x[a.itemText]]
+              ]) : (o(), r("span", zn, w(d(x)), 1)),
+              e("button", {
+                type: "button",
+                class: "sl-ml-2 sl-text-stachelock-600 hover:sl-text-stachelock-400 focus:sl-outline-none",
+                onClick: Y((y) => C(F), ["stop"]),
+                disabled: t.disabled
+              }, [
+                _(f(Os), { class: "sl-h-4 sl-w-4" })
+              ], 8, jn)
+            ]),
+            _: 2
+          }, 1032, ["onClick"]))), 128)),
+          e("div", Fn, [
+            me(e("input", {
+              ref: "input",
+              "onUpdate:modelValue": I[0] || (I[0] = (x) => u.value = x),
+              placeholder: t.placeholder,
+              onInput: g,
+              disabled: t.disabled,
+              onKeydown: fe(Y(h, ["prevent"]), ["enter"]),
+              class: "sl-w-full sl-border-none sl-outline-none sl-rounded-md focus:sl-ring-0 sl-text-sm sl-font-light -sl-mx-3 sl-pr-12"
+            }, null, 40, Nn), [
+              [be, u.value]
+            ]),
+            e("div", Rn, [
+              S(i.$slots, "input-overlay")
+            ]),
+            v.value && !t.disabled ? (o(), r("div", Un, [
+              (o(!0), r(E, null, j(n.value, (x) => (o(), r("div", {
+                key: x[t.itemKey],
+                class: "sl-cursor-pointer sl-select-none sl-py-2 sl-pl-3 sl-pr-9 hover:sl-bg-stachelock-600 hover:sl-text-white",
+                onClick: Y((F) => k(x), ["prevent"])
+              }, [
+                e("div", Kn, [
+                  e("span", Wn, [
+                    e("span", qn, w($(x)), 1)
+                  ]),
+                  t.showSubext ? (o(), r("span", Qn, w(c(x)), 1)) : b("", !0)
+                ])
+              ], 8, Hn))), 128))
+            ])) : b("", !0)
+          ])
+        ], 2)
+      ]),
+      _: 3
+    }, 8, ["id", "name", "label", "tertiary-label", "error-message", "disabled", "optional"]));
+  }
+}), Gn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  CheckboxInput: Te,
+  ComboboxInput: Be,
+  InputsShowcase: gs,
+  SelectInput: re,
+  SwitchInput: Ae,
+  TagifyInput: ps,
+  TextAreaInput: Ve
+}, Symbol.toStringTag, { value: "Module" })), Jn = { class: "sl-min-h-screen sl-bg-gray-50" }, Yn = { class: "sl-fixed sl-inset-0 sl-flex" }, Xn = { class: "sl-absolute sl-left-full sl-top-0 sl-flex sl-w-16 sl-justify-center sl-pt-5" }, Zn = { class: "sl-flex sl-grow sl-flex-col sl-gap-y-5 sl-bg-stachelock-600 sl-px-6 sl-pb-2 sl-ring-1 sl-ring-white/10" }, er = { class: "sl-flex sl-h-16 sl-shrink-0 sl-items-center" }, sr = { class: "sl-flex sl-flex-1 sl-flex-col" }, lr = {
+  role: "list",
+  class: "-sl-mx-2 sl-flex-1 sl-space-y-1"
+}, tr = { class: "sl-mt-auto" }, ar = { class: "sl-flex sl-h-16 sl-shrink-0 sl-items-center sl-px-6" }, or = { class: "sl-mt-8 sl-flex sl-flex-col sl-justify-between sl-h-full" }, nr = { class: "sl-absolute sl-bottom-4 sl-left-0 sl-right-0 sl-px-6" }, rr = { class: "sl-sticky sl-top-0 sl-z-40 sl-flex sl-h-16 sl-shrink-0 sl-items-center sl-gap-x-4 sl-border-b sl-border-gray-200 sl-bg-white sl-px-4 sl-shadow-sm sm:sl-gap-x-6 sm:sl-px-6 lg:sl-px-8" }, ir = { class: "sl-flex sl-flex-1 sl-gap-x-4 sm:sl-self-stretch lg:sl-gap-x-6" }, dr = { class: "sl-relative sl-flex sl-flex-1" }, ur = { class: "sl-flex sl-items-center sl-gap-x-4 lg:sl-gap-x-6" }, cr = {
+  key: 0,
+  class: "sl-border-b sl-border-gray-200 sl-bg-white sl-px-4 sl-py-6 sm:sl-px-6 lg:sl-px-8"
+}, mr = { class: "sl-px-4 sm:sl-px-6 lg:sl-px-8 sl-py-6" }, fr = {
+  key: 1,
+  class: "sl-border-t sl-border-gray-200 sl-bg-white sl-px-4 sl-py-6 sm:sl-px-6 lg:sl-px-8"
+}, hs = /* @__PURE__ */ z({
+  __name: "DashboardLayout",
+  props: {
+    isWideSidebar: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["sidebar-toggle"],
+  setup(t, { emit: l }) {
+    const s = P(!1), a = () => {
+      s.value = !1;
+    }, m = () => {
+      s.value = !0;
+    };
+    return (u, n) => (o(), r("div", Jn, [
+      _(f(ve), {
+        as: "template",
+        show: s.value
+      }, {
+        default: L(() => [
+          _(f(ke), {
+            as: "div",
+            class: "sl-relative sl-z-50 lg:sl-hidden",
+            onClose: a
+          }, {
+            default: L(() => [
+              _(f(se), {
+                as: "template",
+                enter: "sl-transition-opacity sl-ease-linear sl-duration-300",
+                "enter-from": "sl-opacity-0",
+                "enter-to": "sl-opacity-100",
+                leave: "sl-transition-opacity sl-ease-linear sl-duration-300",
+                "leave-from": "sl-opacity-100",
+                "leave-to": "sl-opacity-0"
+              }, {
+                default: L(() => n[2] || (n[2] = [
+                  e("div", { class: "sl-fixed sl-inset-0 sl-bg-gray-900/80" }, null, -1)
+                ])),
+                _: 1,
+                __: [2]
+              }),
+              e("div", Yn, [
+                _(f(se), {
+                  as: "template",
+                  enter: "sl-transition sl-ease-in-out sl-duration-300 sl-transform",
+                  "enter-from": "-sl-translate-x-full",
+                  "enter-to": "sl-translate-x-0",
+                  leave: "sl-transition sl-ease-in-out sl-duration-300 sl-transform",
+                  "leave-from": "sl-translate-x-0",
+                  "leave-to": "-sl-translate-x-full"
+                }, {
+                  default: L(() => [
+                    _(f($e), { class: "sl-relative sl-mr-16 sl-flex sl-w-full sl-max-w-xs sl-flex-1" }, {
+                      default: L(() => [
+                        _(f(se), {
+                          as: "template",
+                          enter: "sl-ease-in-out sl-duration-300",
+                          "enter-from": "sl-opacity-0",
+                          "enter-to": "sl-opacity-100",
+                          leave: "sl-ease-in-out sl-duration-300",
+                          "leave-from": "sl-opacity-100",
+                          "leave-to": "sl-opacity-0"
+                        }, {
+                          default: L(() => [
+                            e("div", Xn, [
+                              e("button", {
+                                type: "button",
+                                class: "-sl-m-2.5 sl-p-2.5",
+                                onClick: n[0] || (n[0] = (p) => a())
+                              }, [
+                                n[3] || (n[3] = e("span", { class: "sl-sr-only" }, "Close sidebar", -1)),
+                                _(f(Je), {
+                                  class: "sl-h-6 sl-w-6 sl-text-stachelock-050",
+                                  "aria-hidden": "true"
+                                })
+                              ])
+                            ])
+                          ]),
+                          _: 1
+                        }),
+                        e("div", Zn, [
+                          e("div", er, [
+                            S(u.$slots, "logo", {}, () => [
+                              n[4] || (n[4] = e("div", { class: "sl-text-stachelock-050 sl-font-semibold sl-text-lg" }, "Logo", -1))
+                            ])
+                          ]),
+                          e("nav", sr, [
+                            e("ul", lr, [
+                              S(u.$slots, "navigation")
+                            ])
+                          ]),
+                          e("div", tr, [
+                            S(u.$slots, "sidebar-footer")
+                          ])
+                        ])
+                      ]),
+                      _: 3
+                    })
+                  ]),
+                  _: 3
+                })
+              ])
+            ]),
+            _: 3
+          })
+        ]),
+        _: 3
+      }, 8, ["show"]),
+      e("div", {
+        class: V(["sl-hidden lg:sl-fixed lg:sl-inset-y-0 lg:sl-left-0 lg:sl-z-50 lg:sl-block lg:sl-pb-4 sl-pt-4 lg:sl-bg-stachelock-600", t.isWideSidebar ? "lg:sl-w-72" : "lg:sl-w-20"])
+      }, [
+        e("div", ar, [
+          S(u.$slots, "logo", {}, () => [
+            n[5] || (n[5] = e("div", { class: "sl-text-stachelock-050 sl-font-semibold sl-text-lg" }, "Logo", -1))
+          ])
+        ]),
+        e("nav", or, [
+          e("ul", {
+            role: "list",
+            class: V(t.isWideSidebar ? "sl-flex sl-flex-col sl-items-start sl-mx-4 sl-space-y-1" : "sl-flex sl-flex-col sl-items-center sl-space-y-1")
+          }, [
+            S(u.$slots, "navigation")
+          ], 2),
+          e("div", nr, [
+            S(u.$slots, "sidebar-footer")
+          ])
+        ])
+      ], 2),
+      e("div", {
+        class: V(["lg:sl-pl-20", t.isWideSidebar ? "lg:sl-pl-72" : "lg:sl-pl-20"])
+      }, [
+        e("div", rr, [
+          e("button", {
+            type: "button",
+            class: "-sl-m-2.5 sl-p-2.5 sl-text-gray-700 lg:sl-hidden",
+            onClick: n[1] || (n[1] = (p) => m())
+          }, [
+            n[6] || (n[6] = e("span", { class: "sl-sr-only" }, "Open sidebar", -1)),
+            _(f(Ye), {
+              class: "sl-h-6 sl-w-6",
+              "aria-hidden": "true"
+            })
+          ]),
+          n[7] || (n[7] = e("div", {
+            class: "sl-h-6 sl-w-px sl-bg-gray-900/10 lg:sl-hidden",
+            "aria-hidden": "true"
+          }, null, -1)),
+          e("div", ir, [
+            e("div", dr, [
+              S(u.$slots, "header-content")
+            ]),
+            e("div", ur, [
+              S(u.$slots, "header-right")
+            ])
+          ])
+        ]),
+        u.$slots["page-header"] ? (o(), r("div", cr, [
+          S(u.$slots, "page-header")
+        ])) : b("", !0),
+        e("main", mr, [
+          S(u.$slots, "main")
+        ]),
+        u.$slots.footer ? (o(), r("footer", fr, [
+          S(u.$slots, "footer")
+        ])) : b("", !0)
+      ], 2)
+    ]));
+  }
+}), gr = { class: "sl-relative" }, pr = {
+  key: 0,
+  class: "sl-py-16 lg:sl-ml-12 sl-mx-2"
+}, hr = { class: "sl-mx-auto sl-max-w-7xl" }, vr = { class: "sl-mx-auto sl-max-w-2xl lg:sl-mx-0" }, yr = { class: "sl-h-2" }, br = {
+  key: 0,
+  class: "sl-mt-1"
+}, xr = {
+  key: 1,
+  class: "sl-mx-auto sl-z-50 sl-flex sl-h-16 lg:sl-h-16 sl-border-gray-900/10"
+}, wr = { class: "sl-flex sl-h-16 lg:sl-h-16 sl-w-full sl-px-4 sm:sl-px-6 lg:sl-px-8 sl-justify-between" }, kr = { class: "sl-flex sl-justify-end sl-items-center sl-ml-auto" }, $r = {
+  key: 2,
+  class: "lg:sl-mx-12 sl-mx-2 sl-pb-16"
+}, _r = {
+  key: 5,
+  class: "lg:sl-mx-12 sl-mx-2 sl-pb-16"
+}, vs = /* @__PURE__ */ z({
+  __name: "DefaultLayout",
+  props: {
+    title: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    titleClass: {
+      type: String,
+      default: "sl-text-4xl sl-font-bold sl-tracking-tight sl-text-gray-800"
+    },
+    subtitle: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    subtitleClass: {
+      type: String,
+      default: "sl-text-lg sl-leading-8 sl-text-gray-600"
+    }
+  },
+  setup(t) {
+    return (l, s) => (o(), r("div", gr, [
+      t.title ? (o(), r("div", pr, [
+        e("div", hr, [
+          e("div", vr, [
+            e("h1", {
+              class: V(t.titleClass)
+            }, w(t.title), 3),
+            t.subtitle ? (o(), r("p", {
+              key: 0,
+              class: V([t.subtitleClass, "sl-mt-6"])
+            }, w(t.subtitle), 3)) : b("", !0),
+            e("div", yr, [
+              l.$slots.bottomCaption ? (o(), r("div", br, [
+                S(l.$slots, "bottomCaption")
+              ])) : b("", !0)
+            ])
+          ])
+        ])
+      ])) : !t.title && l.$slots.right ? (o(), r("header", xr, [
+        e("div", wr, [
+          s[0] || (s[0] = e("div", { class: "sl-hidden lg:sl-flex lg:sl-justify-start lg:sl-items-center" }, null, -1)),
+          e("div", kr, [
+            S(l.$slots, "right")
+          ])
+        ])
+      ])) : b("", !0),
+      l.$slots.main ? (o(), r("div", $r, [
+        S(l.$slots, "main")
+      ])) : b("", !0),
+      l.$slots.container ? (o(), r("div", {
+        key: 3,
+        class: V(t.title ? "sl-pb-12" : "sl-my-4 sm:sl-py-12")
+      }, [
+        S(l.$slots, "container")
+      ], 2)) : b("", !0),
+      l.$slots.home ? S(l.$slots, "home", { key: 4 }) : b("", !0),
+      l.$slots.default ? (o(), r("div", _r, [
+        S(l.$slots, "default")
+      ])) : b("", !0)
+    ]));
+  }
+}), Cr = { class: "sl-min-h-screen sl-bg-gray-50" }, Sr = { class: "sl-bg-white sl-shadow" }, Mr = { class: "sl-mx-auto sl-max-w-7xl sl-px-4 sm:sl-px-6 lg:sl-px-8" }, Tr = { class: "sl-flex sl-h-16 sl-items-center sl-justify-between" }, Br = { class: "sl-flex sl-items-center" }, Vr = { class: "sl-flex-shrink-0" }, Ar = { class: "sl-ml-10 sl-hidden sm:sl-flex sm:sl-space-x-8" }, Lr = { class: "sl-flex sl-items-center sl-space-x-4" }, Ir = { class: "sm:sl-hidden" }, Dr = { class: "sl-mx-auto sl-max-w-7xl sl-py-6 sm:sl-px-6 lg:sl-px-8" }, Er = {
+  key: 0,
+  class: "sl-bg-white sl-border-t sl-border-gray-200"
+}, Pr = { class: "sl-mx-auto sl-max-w-7xl sl-px-4 sm:sl-px-6 lg:sl-px-8" }, zr = { class: "sl-py-8" }, ys = /* @__PURE__ */ z({
+  __name: "HeaderLayout",
+  setup(t) {
+    return (l, s) => (o(), r("div", Cr, [
+      e("header", Sr, [
+        e("div", Mr, [
+          e("div", Tr, [
+            e("div", Br, [
+              e("div", Vr, [
+                S(l.$slots, "logo", {}, () => [
+                  s[0] || (s[0] = e("div", { class: "sl-text-xl sl-font-bold sl-text-stachelock-600" }, "Logo", -1))
+                ])
+              ]),
+              e("nav", Ar, [
+                S(l.$slots, "primary-navigation")
+              ])
+            ]),
+            e("div", Lr, [
+              S(l.$slots, "header-right")
+            ])
+          ])
+        ]),
+        e("div", Ir, [
+          S(l.$slots, "mobile-navigation")
+        ])
+      ]),
+      e("main", null, [
+        e("div", Dr, [
+          S(l.$slots, "main")
+        ])
+      ]),
+      l.$slots.footer ? (o(), r("footer", Er, [
+        e("div", Pr, [
+          e("div", zr, [
+            S(l.$slots, "footer")
+          ])
+        ])
+      ])) : b("", !0)
+    ]));
+  }
+}), Or = { class: "sl-space-y-1" }, jr = {
+  role: "list",
+  class: "sl-space-y-1"
+}, bs = /* @__PURE__ */ z({
+  __name: "NavigationGroup",
+  props: {
+    title: {},
+    iconOnly: { type: Boolean }
+  },
+  setup(t) {
+    return (l, s) => (o(), r("div", Or, [
+      l.title ? (o(), r("h3", {
+        key: 0,
+        class: V([
+          "sl-px-3 sl-py-2 sl-text-xs sl-font-semibold sl-text-stachelock-050 sl-uppercase sl-tracking-wider",
+          l.iconOnly ? "sl-text-center" : ""
+        ])
+      }, w(l.title), 3)) : b("", !0),
+      e("ul", jr, [
+        S(l.$slots, "default")
+      ])
+    ]));
+  }
+}), Fr = ["href"], Nr = {
+  key: 0,
+  class: "sl-truncate"
+}, xs = /* @__PURE__ */ z({
+  __name: "NavigationItem",
+  props: {
+    name: {},
+    href: {},
+    icon: {},
+    isActive: { type: Boolean },
+    iconOnly: { type: Boolean },
+    badge: {},
+    badgeTheme: {}
+  },
+  setup(t) {
+    return (l, s) => (o(), r("li", null, [
+      e("a", {
+        href: l.href,
+        class: V([
+          "sl-group sl-flex sl-gap-x-3 sl-rounded-md sl-p-2 sl-text-sm sl-leading-6 sl-font-semibold",
+          l.isActive ? "sl-bg-stachelock-400 sl-text-stachelock-050" : "sl-text-stachelock-300 hover:sl-text-stachelock-050 hover:sl-bg-white/10"
+        ])
+      }, [
+        (o(), K(ce(l.icon), {
+          class: V([
+            "sl-h-6 sl-w-6 sl-shrink-0",
+            l.isActive ? "sl-text-stachelock-050" : "sl-text-stachelock-300 group-hover:sl-text-stachelock-050"
+          ]),
+          "aria-hidden": "true"
+        }, null, 8, ["class"])),
+        l.iconOnly ? b("", !0) : (o(), r("span", Nr, w(l.name), 1)),
+        l.badge ? (o(), r("span", {
+          key: 1,
+          class: V([
+            "sl-ml-auto sl-inline-flex sl-items-center sl-rounded-md sl-px-2 sl-py-1 sl-text-xs sl-font-medium",
+            l.badgeTheme === "primary" ? "sl-bg-stachelock-400 sl-text-white" : "",
+            l.badgeTheme === "secondary" ? "sl-bg-gray-400 sl-text-white" : "",
+            l.badgeTheme === "success" ? "sl-bg-green-400 sl-text-white" : "",
+            l.badgeTheme === "warning" ? "sl-bg-yellow-400 sl-text-white" : "",
+            l.badgeTheme === "danger" ? "sl-bg-red-400 sl-text-white" : ""
+          ])
+        }, w(l.badge), 3)) : b("", !0)
+      ], 10, Fr)
+    ]));
+  }
+}), Rr = { class: "sl-relative" }, Ur = { class: "sl-fixed sl-inset-0 sl-flex" }, Hr = { class: "sl-absolute sl-left-full sl-top-0 sl-flex sl-w-16 sl-justify-center sl-pt-5" }, Kr = { class: "sl-flex sl-grow sl-flex-col sl-gap-y-5 sl-bg-stachelock-600 sl-px-6 sl-pb-2 sl-ring-1 sl-ring-white/10" }, Wr = { class: "sl-flex sl-h-16 sl-shrink-0 sl-items-center" }, qr = { class: "sl-flex sl-flex-1 sl-flex-col" }, Qr = {
+  role: "list",
+  class: "-sl-mx-2 sl-flex-1 sl-space-y-1"
+}, Gr = { class: "sl-mt-auto" }, Jr = { class: "sl-flex sl-h-16 sl-shrink-0 sl-items-center sl-px-6" }, Yr = { class: "sl-mt-8 sl-flex sl-flex-col sl-justify-between sl-h-full" }, Xr = { class: "sl-absolute sl-bottom-4 sl-left-0 sl-right-0 sl-px-6" }, Zr = { class: "sl-sticky sl-top-0 sl-z-40 sl-flex sl-h-16 sl-shrink-0 sl-items-center sl-gap-x-4 sl-border-b sl-border-gray-200 sl-bg-white sl-px-4 sl-shadow-sm sm:sl-gap-x-6 sm:sl-px-6 lg:sl-px-8" }, ei = { class: "sl-flex sl-flex-1 sl-gap-x-4 sm:sl-self-stretch lg:sl-gap-x-6" }, si = { class: "sl-relative sl-flex sl-flex-1" }, li = { class: "sl-flex sl-items-center sl-gap-x-4 lg:sl-gap-x-6" }, ti = { class: "sl-px-4 sm:sl-px-6 lg:sl-px-8 sl-py-6" }, ws = /* @__PURE__ */ z({
+  __name: "SidebarLayout",
+  props: {
+    isWideSidebar: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(t) {
+    const l = P(!1), s = () => {
+      l.value = !1;
+    }, a = () => {
+      l.value = !0;
+    };
+    return (m, u) => (o(), r("div", Rr, [
+      _(f(ve), {
+        as: "template",
+        show: l.value
+      }, {
+        default: L(() => [
+          _(f(ke), {
+            as: "div",
+            class: "sl-relative sl-z-50 lg:sl-hidden",
+            onClose: s
+          }, {
+            default: L(() => [
+              _(f(se), {
+                as: "template",
+                enter: "sl-transition-opacity sl-ease-linear sl-duration-300",
+                "enter-from": "sl-opacity-0",
+                "enter-to": "sl-opacity-100",
+                leave: "sl-transition-opacity sl-ease-linear sl-duration-300",
+                "leave-from": "sl-opacity-100",
+                "leave-to": "sl-opacity-0"
+              }, {
+                default: L(() => u[2] || (u[2] = [
+                  e("div", { class: "sl-fixed sl-inset-0 sl-bg-gray-900/80" }, null, -1)
+                ])),
+                _: 1,
+                __: [2]
+              }),
+              e("div", Ur, [
+                _(f(se), {
+                  as: "template",
+                  enter: "sl-transition sl-ease-in-out sl-duration-300 sl-transform",
+                  "enter-from": "-sl-translate-x-full",
+                  "enter-to": "sl-translate-x-0",
+                  leave: "sl-transition sl-ease-in-out sl-duration-300 sl-transform",
+                  "leave-from": "sl-translate-x-0",
+                  "leave-to": "-sl-translate-x-full"
+                }, {
+                  default: L(() => [
+                    _(f($e), { class: "sl-relative sl-mr-16 sl-flex sl-w-full sl-max-w-xs sl-flex-1" }, {
+                      default: L(() => [
+                        _(f(se), {
+                          as: "template",
+                          enter: "sl-ease-in-out sl-duration-300",
+                          "enter-from": "sl-opacity-0",
+                          "enter-to": "sl-opacity-100",
+                          leave: "sl-ease-in-out sl-duration-300",
+                          "leave-from": "sl-opacity-100",
+                          "leave-to": "sl-opacity-0"
+                        }, {
+                          default: L(() => [
+                            e("div", Hr, [
+                              e("button", {
+                                type: "button",
+                                class: "-sl-m-2.5 sl-p-2.5",
+                                onClick: u[0] || (u[0] = (n) => s())
+                              }, [
+                                u[3] || (u[3] = e("span", { class: "sl-sr-only" }, "Close sidebar", -1)),
+                                _(f(Je), {
+                                  class: "sl-h-6 sl-w-6 sl-text-stachelock-050",
+                                  "aria-hidden": "true"
+                                })
+                              ])
+                            ])
+                          ]),
+                          _: 1
+                        }),
+                        e("div", Kr, [
+                          e("div", Wr, [
+                            S(m.$slots, "logo", {}, () => [
+                              u[4] || (u[4] = e("div", { class: "sl-text-stachelock-050 sl-font-semibold sl-text-lg" }, "Logo", -1))
+                            ])
+                          ]),
+                          e("nav", qr, [
+                            e("ul", Qr, [
+                              S(m.$slots, "navigation")
+                            ])
+                          ]),
+                          e("div", Gr, [
+                            S(m.$slots, "sidebar-footer")
+                          ])
+                        ])
+                      ]),
+                      _: 3
+                    })
+                  ]),
+                  _: 3
+                })
+              ])
+            ]),
+            _: 3
+          })
+        ]),
+        _: 3
+      }, 8, ["show"]),
+      e("div", {
+        class: V(["sl-hidden lg:sl-fixed lg:sl-inset-y-0 lg:sl-left-0 lg:sl-z-50 lg:sl-block lg:sl-pb-4 sl-pt-4 lg:sl-bg-stachelock-600", t.isWideSidebar ? "lg:sl-w-72" : "lg:sl-w-20"])
+      }, [
+        e("div", Jr, [
+          S(m.$slots, "logo", {}, () => [
+            u[5] || (u[5] = e("div", { class: "sl-text-stachelock-050 sl-font-semibold sl-text-lg" }, "Logo", -1))
+          ])
+        ]),
+        e("nav", Yr, [
+          e("ul", {
+            role: "list",
+            class: V(t.isWideSidebar ? "sl-flex sl-flex-col sl-items-start sl-mx-4 sl-space-y-1" : "sl-flex sl-flex-col sl-items-center sl-space-y-1")
+          }, [
+            S(m.$slots, "navigation")
+          ], 2),
+          e("div", Xr, [
+            S(m.$slots, "sidebar-footer")
+          ])
+        ])
+      ], 2),
+      e("div", {
+        class: V(["lg:sl-pl-20", t.isWideSidebar ? "lg:sl-pl-72" : "lg:sl-pl-20"])
+      }, [
+        e("div", Zr, [
+          e("button", {
+            type: "button",
+            class: "-sl-m-2.5 sl-p-2.5 sl-text-gray-700 lg:sl-hidden",
+            onClick: u[1] || (u[1] = (n) => a())
+          }, [
+            u[6] || (u[6] = e("span", { class: "sl-sr-only" }, "Open sidebar", -1)),
+            _(f(Ye), {
+              class: "sl-h-6 sl-w-6",
+              "aria-hidden": "true"
+            })
+          ]),
+          u[7] || (u[7] = e("div", {
+            class: "sl-h-6 sl-w-px sl-bg-gray-900/10 lg:sl-hidden",
+            "aria-hidden": "true"
+          }, null, -1)),
+          e("div", ei, [
+            e("div", si, [
+              S(m.$slots, "header-content")
+            ]),
+            e("div", li, [
+              S(m.$slots, "header-right")
+            ])
+          ])
+        ]),
+        e("main", ti, [
+          S(m.$slots, "main")
+        ])
+      ], 2)
+    ]));
+  }
+}), ai = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  DashboardLayout: hs,
+  DefaultLayout: vs,
+  HeaderLayout: ys,
+  NavigationGroup: bs,
+  NavigationItem: xs,
+  SidebarLayout: ws
+}, Symbol.toStringTag, { value: "Module" })), oi = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  Avatar: Vl,
+  Badge: Ze,
+  Breadcrumb: Xl,
+  Button: X,
+  CalendarDashboard: ns,
+  CalendarHeader: _e,
+  CheckboxInput: Te,
+  ComboboxInput: Be,
+  DashboardLayout: hs,
+  DayCalendar: us,
+  DefaultLayout: vs,
+  DynamicForm: fs,
+  EventCard: pe,
+  EventsList: Se,
+  FormField: Me,
+  FormFieldWrapper: ee,
+  HeaderLayout: ys,
+  InputsShowcase: gs,
+  Loading: os,
+  LoadingDots: dt,
+  Modal: bt,
+  MonthCalendar: Ce,
+  NavLink: as,
+  NavigationGroup: bs,
+  NavigationItem: xs,
+  ProgressBar: _t,
+  RadialProgressBar: Bt,
+  SelectInput: re,
+  SidebarLayout: ws,
+  SwitchInput: Ae,
+  Table: ia,
+  TagifyInput: ps,
+  TextAreaInput: Ve,
+  TextInput: J,
+  Transition: da,
+  WeekCalendar: cs,
+  YearCalendar: ms
+}, Symbol.toStringTag, { value: "Module" })), ni = {
+  ...oi,
+  ...ai,
+  ...Gn,
+  ...Lo,
+  ...Qo
+}, wi = {
+  install(t, l = {}) {
+    const { prefix: s = "Sl", installAll: a = !1, components: m } = l;
+    Object.entries(ni).forEach(([u, n]) => {
+      if (a || m && m.includes(u) || !m && !a) {
+        t.component(u, n);
+        const v = u.startsWith(s) ? u : `${s}${u}`;
+        t.component(v, n);
+      }
+    });
+  }
+};
+export {
+  Vl as Avatar,
+  Ze as Badge,
+  Xl as Breadcrumb,
+  X as Button,
+  ns as CalendarDashboard,
+  _e as CalendarHeader,
+  Te as CheckboxInput,
+  Be as ComboboxInput,
+  Ml as ComponentRegistry,
+  hs as DashboardLayout,
+  us as DayCalendar,
+  vs as DefaultLayout,
+  fs as DynamicForm,
+  pe as EventCard,
+  Se as EventsList,
+  Me as FormField,
+  ee as FormFieldWrapper,
+  ys as HeaderLayout,
+  gs as InputsShowcase,
+  os as Loading,
+  dt as LoadingDots,
+  bt as Modal,
+  Ce as MonthCalendar,
+  as as NavLink,
+  bs as NavigationGroup,
+  xs as NavigationItem,
+  _t as ProgressBar,
+  Bt as RadialProgressBar,
+  re as SelectInput,
+  ws as SidebarLayout,
+  wi as StachelockUI,
+  Ae as SwitchInput,
+  ia as Table,
+  ps as TagifyInput,
+  Ve as TextAreaInput,
+  J as TextInput,
+  da as Transition,
+  cs as WeekCalendar,
+  ms as YearCalendar,
+  Xe as componentRegistry,
+  wi as default,
+  Sl as defaultComponentMap,
+  vi as generateDeterministicId,
+  ae as generateId,
+  xi as getComponent,
+  bi as registerComponent,
+  yi as sanitizeId
+};
+//# sourceMappingURL=index.js.map