@stachelock/ui 0.3.1 → 0.4.0

package/dist/DynamicFormField.vue_vue_type_script_setup_true_lang-Ct8b80dM.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DynamicFormField.vue_vue_type_script_setup_true_lang-Ct8b80dM.js","sources":["../src/components/forms/DynamicFormField.vue"],"sourcesContent":["<!--\n  @component DynamicFormField\n  @description Renders a single field based on field configuration.\n  \n  Used by DynamicForm to render individual fields. Maps field type to\n  appropriate input component and passes configuration props.\n  \n  @props\n  - field (DynamicFormField, required): Field configuration object\n  - modelValue (any, optional): Field value via v-model\n  - formData (object, optional): Complete form data for conditional logic\n  \n  @emits\n  - update:modelValue: Emitted when field value changes\n  - field-change: Emitted with field and value on change\n  \n  @example\n  <DynamicFormField\n    :field=\"{ name: 'email', type: 'email', label: 'Email' }\"\n    v-model=\"formData.email\"\n  />\n-->\n<template>\n  <component\n    :is=\"fieldComponent\"\n    v-if=\"fieldComponent\"\n    v-bind=\"componentProps\"\n    v-on=\"componentEvents\"\n    :model-value=\"fieldValue\"\n    @update:model-value=\"handleFieldChange\"\n  />\n  \n  <!-- Fallback for unknown field types -->\n  <div \n    v-else\n    class=\"sl-p-4 sl-bg-yellow-50 sl-border sl-border-yellow-200 sl-rounded-md\"\n  >\n    <div class=\"sl-flex\">\n      <ExclamationTriangleIcon class=\"sl-h-5 sl-w-5 sl-text-yellow-400\" />\n      <div class=\"sl-ml-3\">\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-yellow-800\">\n          Unknown field type\n        </h3>\n        <div class=\"sl-mt-2 sl-text-sm sl-text-yellow-700\">\n          <p>Field type \"{{ field.type }}\" is not supported.</p>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\n/**\n * DynamicFormField - Field renderer for DynamicForm\n * \n * Dynamically loads and renders the appropriate input component based on\n * the field type configuration. Handles prop mapping and event forwarding.\n * \n * ## Supported Field Types\n * - text, email, password, number, tel, url → UiTextInput\n * - textarea → TextAreaInput\n * - select → SelectInput\n * - combobox → ComboboxInput\n * - checkbox → CheckboxInput\n * - switch → SwitchInput\n * \n * @module components/forms/DynamicFormField\n * @see {@link DynamicFormField} for field configuration\n */\nimport { computed, defineAsyncComponent } from 'vue'\nimport UiTextInput from '../inputs/TextInput.vue'\nimport { ExclamationTriangleIcon } from '@heroicons/vue/24/outline'\nimport type { DynamicFormField } from '../../types/form'\n\ninterface Props {\n  field: DynamicFormField\n  modelValue?: any\n  formData?: Record<string, any>\n}\n\nconst props = defineProps<Props>()\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: any]\n  'field-change': [field: DynamicFormField, value: any]\n}>()\n\n// Component mapping for dynamic loading\nconst componentMap: Record<string, () => Promise<any>> = {\n  text: () => Promise.resolve(UiTextInput),\n  email: () => Promise.resolve(UiTextInput), \n  password: () => Promise.resolve(UiTextInput),\n  number: () => Promise.resolve(UiTextInput),\n  tel: () => Promise.resolve(UiTextInput),\n  url: () => Promise.resolve(UiTextInput),\n  textarea: () => import('../inputs/TextAreaInput.vue'),\n  select: () => import('../inputs/SelectInput.vue'),\n  combobox: () => import('../inputs/ComboboxInput.vue'),\n  checkbox: () => import('../inputs/CheckboxInput.vue'),\n  switch: () => import('../inputs/SwitchInput.vue'),\n}\n\nconst fieldComponent = computed(() => {\n  const componentLoader = componentMap[props.field.type]\n  if (componentLoader) {\n    return defineAsyncComponent({\n      loader: componentLoader,\n      errorComponent: () => null,\n      delay: 0\n    })\n  }\n  return null\n})\n\nconst fieldValue = computed({\n  get: () => props.modelValue ?? props.field.defaultValue ?? getDefaultValue(),\n  set: (value) => {\n    emit('update:modelValue', value)\n    emit('field-change', props.field, value)\n  }\n})\n\nconst componentProps = computed(() => {\n  const baseProps: Record<string, any> = {\n    name: props.field.name,\n    label: props.field.label,\n    placeholder: props.field.placeholder,\n    disabled: props.field.disabled,\n    rules: props.field.validation,\n    validateOnMount: props.field.validateOnMount,\n    tertiaryLabel: props.field.tertiaryLabel,\n    successMessage: props.field.successMessage\n  }\n\n  // Type-specific props\n  switch (props.field.type) {\n    case 'text':\n    case 'email':\n    case 'password':\n    case 'number':\n    case 'tel':\n    case 'url':\n      return {\n        ...baseProps,\n        type: props.field.inputType || props.field.type,\n        maxlength: props.field.maxLength,\n        minlength: props.field.minLength,\n        min: props.field.min,\n        max: props.field.max,\n        step: props.field.step,\n        spellcheck: props.field.spellcheck,\n        autocomplete: props.field.autocomplete\n      }\n    \n    case 'textarea':\n      return {\n        ...baseProps,\n        rows: props.field.rows,\n        maxlength: props.field.maxLength,\n        spellcheck: props.field.spellcheck\n      }\n    \n    case 'select':\n      return {\n        ...baseProps,\n        items: props.field.options || [],\n        multiple: props.field.multiple,\n        itemKey: props.field.optionKey || 'value',\n        itemText: props.field.optionLabel || 'label',\n        showAll: props.field.showSelectAll\n      }\n    \n    case 'combobox':\n      return {\n        ...baseProps,\n        items: props.field.options || [],\n        itemKey: props.field.optionKey || 'value',\n        itemText: props.field.optionLabel || 'label',\n        customQuery: props.field.customQuery,\n        loading: props.field.loading\n      }\n    \n    case 'checkbox':\n      return {\n        ...baseProps,\n        description: props.field.description,\n        immediate: props.field.immediate ?? true,\n        isDescriptionHtml: props.field.isDescriptionHtml\n      }\n    \n    case 'switch':\n      return {\n        ...baseProps,\n        description: props.field.description,\n        immediate: props.field.immediate ?? true,\n        boxShadow: props.field.boxShadow,\n        hideMainLabel: props.field.hideMainLabel,\n        textTrue: props.field.textTrue,\n        textFalse: props.field.textFalse\n      }\n    \n    default:\n      return baseProps\n  }\n})\n\nconst componentEvents = computed(() => {\n  const baseEvents: Record<string, Function> = {}\n  \n  // Add event handlers based on field configuration\n  if (props.field.onBlur) {\n    baseEvents.blur = props.field.onBlur\n  }\n  \n  if (props.field.onFocus) {\n    baseEvents.focus = props.field.onFocus\n  }\n  \n  if (props.field.onChange) {\n    baseEvents['update:modelValue'] = (value: any) => {\n      fieldValue.value = value\n      props.field.onChange?.(value, props.field, props.formData ?? {})\n    }\n  }\n  \n  return baseEvents\n})\n\nconst getDefaultValue = () => {\n  switch (props.field.type) {\n    case 'checkbox':\n    case 'switch':\n      return false\n    case 'select':\n      return props.field.multiple ? [] : null\n    case 'number':\n      return props.field.min || 0\n    default:\n      return ''\n  }\n}\n\nconst handleFieldChange = (value: any) => {\n  fieldValue.value = value\n}\n</script>\n"],"names":["props","__props","emit","__emit","componentMap","UiTextInput","fieldComponent","computed","componentLoader","defineAsyncComponent","fieldValue","getDefaultValue","value","componentProps","baseProps","componentEvents","baseEvents","handleFieldChange","_createBlock","_resolveDynamicComponent","_mergeProps","_toHandlers","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_createVNode","_unref","ExclamationTriangleIcon","_hoisted_3","_cache","_hoisted_4","_toDisplayString","field"],"mappings":"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"}

package/dist/EmailInput.vue_vue_type_script_setup_true_lang-Dhfgs2Jn.js

@@ -1,122 +0,0 @@
-import { defineComponent as I, ref as M, toRef as m, watch as r, nextTick as V, createElementBlock as F, openBlock as K, createVNode as q, unref as a, withCtx as c, renderSlot as L, createElementVNode as N, withKeys as O, normalizeClass as T, withModifiers as $ } from "vue";
-import { useField as z } from "vee-validate";
-import { string as H } from "yup";
-import R from "./forms/FormFieldWrapper.js";
-import { g as S } from "./id-DafBB_QF.js";
-const U = { class: "sl-w-full" }, W = ["name", "id", "value", "placeholder", "autocomplete", "disabled", "onKeydown"], P = /* @__PURE__ */ I({
-  __name: "EmailInput",
-  props: {
-    name: {},
-    value: { default: "" },
-    label: { default: "Email" },
-    placeholder: { default: "you@example.com" },
-    disabled: { type: Boolean, default: !1 },
-    disabledMessage: { default: "" },
-    rules: { default: () => H().email("Invalid email address").required("Email is required") },
-    successMessage: { default: "" },
-    tertiaryLabel: { default: "" },
-    colorfulValidation: { type: Boolean, default: !0 },
-    showValidCheck: { type: Boolean, default: !0 },
-    showErrors: { type: Boolean, default: !1 },
-    autoComplete: { default: "email" }
-  },
-  emits: ["update:value", "update:validity", "focus", "blur", "submit"],
-  setup(p, { expose: f, emit: h }) {
-    const t = p, l = h, i = S(`sl-${t.name}`), u = M(!1), {
-      value: s,
-      errorMessage: v,
-      handleBlur: g,
-      handleChange: b,
-      meta: d,
-      validate: n,
-      setTouched: y
-    } = z(m(t, "name"), m(t, "rules"), {
-      initialValue: t.value,
-      validateOnValueUpdate: !0,
-      validateOnMount: !1
-    });
-    r(
-      () => t.value,
-      (e) => {
-        e !== void 0 && e !== s.value && (s.value = e);
-      },
-      { immediate: !0 }
-    ), r(
-      () => d.valid,
-      (e) => V(() => l("update:validity", e)),
-      { immediate: !0 }
-    ), r(s, (e, o) => {
-      e !== o && l("update:value", e || "");
-    });
-    function w(e) {
-      const o = e.target.value;
-      b(o), l("update:value", o);
-    }
-    async function k(e) {
-      u.value || (u.value = !0, y(!0)), await n(), g(e), l("blur", e);
-    }
-    function B(e) {
-      l("focus", e);
-    }
-    function E() {
-      d.valid && s.value && l("submit");
-    }
-    return f({
-      focus: () => {
-        document.getElementById(i)?.focus();
-      },
-      blur: () => {
-        document.getElementById(i)?.blur();
-      },
-      validate: n
-    }), (e, o) => (K(), F("div", U, [
-      q(R, {
-        id: a(i),
-        name: e.name,
-        label: e.label,
-        "tertiary-label": e.tertiaryLabel,
-        "error-message": a(v),
-        "success-message": e.successMessage,
-        "is-valid": a(d).valid,
-        "is-touched": a(d).touched,
-        "show-errors": e.showErrors,
-        "show-valid-check": e.showValidCheck,
-        "colorful-validation": e.colorfulValidation,
-        disabled: e.disabled,
-        "disabled-message": e.disabledMessage
-      }, {
-        default: c(({ inputClasses: C }) => [
-          N("input", {
-            name: e.name,
-            id: a(i),
-            type: "email",
-            value: a(s),
-            placeholder: e.placeholder,
-            autocomplete: e.autoComplete,
-            disabled: e.disabled,
-            class: T(["sl-block sl-w-full sl-bg-transparent sl-text-gray-900 dark:sl-text-gray-100 placeholder:sl-text-gray-400 dark:placeholder:sl-text-gray-500 focus:sl-ring-0 focus:sl-outline-none sm:sl-text-sm sm:sl-leading-6", [
-              C,
-              "sl-py-1.5 sl-pl-2",
-              { "sl-text-gray-400": e.disabled },
-              { "sl-pr-10": e.showValidCheck }
-            ]]),
-            onInput: w,
-            onFocus: B,
-            onBlur: k,
-            onKeydown: O($(E, ["prevent"]), ["enter"]),
-            enterkeyhint: "go",
-            "data-testid": "email-input"
-          }, null, 42, W)
-        ]),
-        "input-right": c(() => [
-          L(e.$slots, "input-right")
-        ]),
-        _: 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"])
-    ]));
-  }
-});
-export {
-  P as _
-};
-//# sourceMappingURL=EmailInput.vue_vue_type_script_setup_true_lang-Dhfgs2Jn.js.map

package/dist/LottieAnimation.vue_vue_type_script_setup_true_lang-CwOOShcM.js

@@ -1,36 +0,0 @@
-import { defineComponent as m, defineAsyncComponent as d, inject as s, computed as p, createBlock as f, createCommentVNode as v, openBlock as y, unref as h } from "vue";
-const g = /* @__PURE__ */ m({
-  __name: "LottieAnimation",
-  props: {
-    animationData: {},
-    height: { default: 200 },
-    width: { default: 200 },
-    loop: { type: [Boolean, Number], default: void 0 },
-    autoplay: { type: Boolean, default: void 0 },
-    speed: { default: 1 },
-    pauseOnHover: { type: Boolean, default: !1 }
-  },
-  emits: ["complete", "loop-complete", "enter-frame"],
-  setup(i) {
-    const l = d(
-      () => import("./vue3-lottie.es-C_MDkNwR.js").then((e) => e.Vue3Lottie)
-    ), t = i, a = s("lottie", {}), r = p(() => t.loop !== void 0 ? t.loop : a.loop ?? !0), u = p(() => t.autoplay !== void 0 ? t.autoplay : a.autoplay ?? !0);
-    return (e, o) => e.animationData ? (y(), f(h(l), {
-      key: 0,
-      animationData: e.animationData,
-      height: e.height,
-      width: e.width,
-      loop: r.value,
-      autoplay: u.value,
-      speed: e.speed,
-      pauseOnHover: e.pauseOnHover,
-      onComplete: o[0] || (o[0] = (n) => e.$emit("complete")),
-      onLoopComplete: o[1] || (o[1] = (n) => e.$emit("loop-complete")),
-      onEnterFrame: o[2] || (o[2] = (n) => e.$emit("enter-frame", n))
-    }, null, 8, ["animationData", "height", "width", "loop", "autoplay", "speed", "pauseOnHover"])) : v("", !0);
-  }
-});
-export {
-  g as _
-};
-//# sourceMappingURL=LottieAnimation.vue_vue_type_script_setup_true_lang-CwOOShcM.js.map

package/dist/NavigationGroup.vue_vue_type_script_setup_true_lang-2tAB9Hbx.js

@@ -1,30 +0,0 @@
-import { defineComponent as l, createElementBlock as s, openBlock as t, createCommentVNode as o, createElementVNode as n, normalizeClass as r, toDisplayString as a, renderSlot as c } from "vue";
-const i = { class: "sl-space-y-1" }, p = {
-  role: "list",
-  class: "sl-space-y-1"
-}, _ = /* @__PURE__ */ l({
-  __name: "NavigationGroup",
-  props: {
-    title: {},
-    iconOnly: { type: Boolean }
-  },
-  setup(d) {
-    return (e, m) => (t(), s("div", i, [
-      e.title ? (t(), s("h3", {
-        key: 0,
-        class: r([
-          "sl-px-3 sl-py-2 sl-text-xs sl-font-semibold sl-uppercase sl-tracking-wider",
-          e.iconOnly ? "sl-text-center" : ""
-        ]),
-        style: { color: "var(--sl-color-stachelock-050, #edeff9)" }
-      }, a(e.title), 3)) : o("", !0),
-      n("ul", p, [
-        c(e.$slots, "default")
-      ])
-    ]));
-  }
-});
-export {
-  _
-};
-//# sourceMappingURL=NavigationGroup.vue_vue_type_script_setup_true_lang-2tAB9Hbx.js.map

package/dist/NotificationToast.vue_vue_type_script_setup_true_lang-Cm5RsC7C.js

@@ -1,162 +0,0 @@
-import { defineComponent as N, computed as n, createBlock as g, openBlock as r, unref as c, withCtx as u, createElementVNode as l, normalizeStyle as A, normalizeClass as i, createVNode as p, createElementBlock as h, createCommentVNode as m, resolveDynamicComponent as O, toDisplayString as y } from "vue";
-import { r as o, a as V } from "./InformationCircleIcon-B322GNIt.js";
-import { r as x } from "./ExclamationCircleIcon-DjxYk45_.js";
-import { r as D } from "./ExclamationTriangleIcon-BNKYmV_J.js";
-import { r as E } from "./XMarkIcon-DNvCkiOy.js";
-import { S as T, h as I } from "./transition-_rPfnoET.js";
-const L = { class: "sl-p-4" }, R = { class: "sl-flex sl-items-start" }, j = { class: "sl-ml-3 sl-w-0 sl-flex-1 sl-pt-0.5" }, M = /* @__PURE__ */ N({
-  __name: "NotificationToast",
-  props: {
-    notification: {}
-  },
-  emits: ["close"],
-  setup(v, { emit: b }) {
-    const t = v, w = b, k = () => {
-      w("close", t.notification);
-    }, C = () => {
-    }, _ = n(() => {
-      const s = {
-        primary: "sl-bg-stachelock-600 sl-text-white",
-        secondary: "sl-bg-gray-600 sl-text-white",
-        dark: "sl-bg-gray-800 sl-text-white",
-        light: "sl-bg-white sl-text-gray-800 sl-border sl-border-gray-200",
-        warning: "sl-bg-amber-500 sl-text-white",
-        danger: "sl-bg-red-500 sl-text-white",
-        success: "sl-bg-emerald-500 sl-text-white",
-        info: "sl-bg-blue-500 sl-text-white",
-        ghost: "sl-bg-white sl-text-gray-800 sl-border sl-border-gray-200"
-      };
-      return s[t.notification.theme] || s.primary;
-    }), f = n(() => {
-      const s = t.notification.theme;
-      return ["light", "ghost"].includes(s) ? "sl-text-gray-800" : "sl-text-white";
-    }), $ = n(() => {
-      const s = {
-        primary: "focus:sl-ring-stachelock-400",
-        secondary: "focus:sl-ring-gray-400",
-        dark: "focus:sl-ring-gray-400",
-        light: "focus:sl-ring-gray-300",
-        warning: "focus:sl-ring-amber-300",
-        danger: "focus:sl-ring-red-300",
-        success: "focus:sl-ring-emerald-300",
-        info: "focus:sl-ring-blue-300",
-        ghost: "focus:sl-ring-gray-300"
-      };
-      return s[t.notification.theme] || s.primary;
-    }), d = n(() => {
-      if (t.notification.icon)
-        return t.notification.icon;
-      const s = t.notification.theme, e = {
-        primary: o,
-        secondary: o,
-        dark: x,
-        light: o,
-        warning: D,
-        danger: x,
-        success: V,
-        info: o,
-        ghost: o
-      };
-      return e[s] || e.primary;
-    }), S = n(() => {
-      const s = t.notification.position;
-      return {
-        tr: "sl-items-end",
-        tl: "sl-items-start",
-        bl: "sl-items-start",
-        br: "sl-items-end",
-        tc: "sl-items-center",
-        bc: "sl-items-center"
-      }[s] || "sl-items-end";
-    }), z = n(() => {
-      const s = t.notification.position;
-      return {
-        tr: "sl-items-start",
-        tl: "sl-items-start",
-        bl: "sl-items-end",
-        br: "sl-items-end",
-        tc: "sl-items-start",
-        bc: "sl-items-end"
-      }[s] || "sl-items-end";
-    }), B = n(() => {
-      const s = t.notification.position, e = t.notification.yOffset, a = {
-        zIndex: 9999
-      };
-      return ["tl", "tr", "tc"].includes(s) ? a.marginTop = `${e}px` : a.marginBottom = `${e}px`, a;
-    });
-    return (s, e) => (r(), g(c(T), {
-      appear: "",
-      show: s.notification.isOpen,
-      as: "template",
-      onAfterLeave: C
-    }, {
-      default: u(() => [
-        l("div", {
-          "aria-live": "assertive",
-          class: i([
-            "sl-pointer-events-none sl-fixed sl-inset-0 sl-flex sl-px-4 sl-py-6 sm:sl-p-6",
-            z.value
-          ]),
-          style: A(B.value)
-        }, [
-          l("div", {
-            class: i(["sl-flex sl-w-full sl-flex-col sl-items-center sl-space-y-4", S.value])
-          }, [
-            p(c(I), {
-              as: "template",
-              enter: "sl-duration-300 sl-ease-out sl-transform",
-              "enter-from": "sl-translate-y-4 sl-opacity-0 sm:sl-translate-y-0 sm:sl-translate-x-4",
-              "enter-to": "sl-translate-y-0 sl-opacity-100 sm:sl-translate-x-0",
-              leave: "sl-duration-200 sl-ease-in",
-              "leave-from": "sl-opacity-100",
-              "leave-to": "sl-opacity-0"
-            }, {
-              default: u(() => [
-                s.notification.isOpen ? (r(), h("div", {
-                  key: 0,
-                  class: i([[_.value], "sl-pointer-events-auto sl-w-full sl-max-w-sm sl-overflow-hidden sl-rounded-lg sl-shadow-lg sl-ring-1 sl-ring-black sl-ring-opacity-5"])
-                }, [
-                  l("div", L, [
-                    l("div", R, [
-                      d.value ? (r(), g(O(d.value), {
-                        key: 0,
-                        class: "sl-h-6 sl-w-6 sl-flex-shrink-0",
-                        "aria-hidden": "true"
-                      })) : m("", !0),
-                      l("div", j, [
-                        l("p", {
-                          class: i(["sl-text-sm sl-font-medium", f.value])
-                        }, y(s.notification.title), 3),
-                        s.notification.message ? (r(), h("p", {
-                          key: 0,
-                          class: i(["sl-mt-1 sl-text-sm sl-opacity-90", f.value])
-                        }, y(s.notification.message), 3)) : m("", !0)
-                      ]),
-                      l("button", {
-                        type: "button",
-                        onClick: k,
-                        class: i(["sl-ml-4 sl-inline-flex sl-rounded-md sl-text-current sl-opacity-70 hover:sl-opacity-100 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-offset-2", $.value])
-                      }, [
-                        e[0] || (e[0] = l("span", { class: "sl-sr-only" }, "Close", -1)),
-                        p(c(E), {
-                          class: "sl-h-5 sl-w-5",
-                          "aria-hidden": "true"
-                        })
-                      ], 2)
-                    ])
-                  ])
-                ], 2)) : m("", !0)
-              ]),
-              _: 1
-            })
-          ], 2)
-        ], 6)
-      ]),
-      _: 1
-    }, 8, ["show"]));
-  }
-});
-export {
-  M as _
-};
-//# sourceMappingURL=NotificationToast.vue_vue_type_script_setup_true_lang-Cm5RsC7C.js.map

package/dist/NotificationToast.vue_vue_type_script_setup_true_lang-Cm5RsC7C.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"NotificationToast.vue_vue_type_script_setup_true_lang-Cm5RsC7C.js","sources":["../src/components/notifications/NotificationToast.vue"],"sourcesContent":["<!--\n  @component NotificationToast\n  @description Individual notification toast with animations and theming\n  \n  Displays a single notification with icon, title, message, and close button.\n  Supports multiple themes and positions with smooth enter/leave transitions.\n  \n  @props\n  - notification (NotificationState): The notification data object\n  \n  @emits\n  - close: Emitted when the close button is clicked\n  \n  @example\n  <NotificationToast \n    :notification=\"notification\" \n    @close=\"handleClose\" \n  />\n-->\n<template>\n  <TransitionRoot \n    appear \n    :show=\"notification.isOpen\" \n    as=\"template\" \n    @after-leave=\"onAfterLeave\"\n  >\n    <div \n      aria-live=\"assertive\" \n      :class=\"[\n        'sl-pointer-events-none sl-fixed sl-inset-0 sl-flex sl-px-4 sl-py-6 sm:sl-p-6',\n        verticalAlignClass\n      ]\"\n      :style=\"containerStyle\"\n    >\n      <div \n        class=\"sl-flex sl-w-full sl-flex-col sl-items-center sl-space-y-4\" \n        :class=\"horizontalAlignClass\"\n      >\n        <TransitionChild \n          as=\"template\" \n          enter=\"sl-duration-300 sl-ease-out sl-transform\"\n          enter-from=\"sl-translate-y-4 sl-opacity-0 sm:sl-translate-y-0 sm:sl-translate-x-4\"\n          enter-to=\"sl-translate-y-0 sl-opacity-100 sm:sl-translate-x-0\" \n          leave=\"sl-duration-200 sl-ease-in\"\n          leave-from=\"sl-opacity-100\" \n          leave-to=\"sl-opacity-0\"\n        >\n          <div \n            v-if=\"notification.isOpen\" \n            :class=\"[themeClass]\"\n            class=\"sl-pointer-events-auto sl-w-full sl-max-w-sm sl-overflow-hidden sl-rounded-lg sl-shadow-lg sl-ring-1 sl-ring-black sl-ring-opacity-5\"\n          >\n            <div class=\"sl-p-4\">\n              <div class=\"sl-flex sl-items-start\">\n                <component \n                  v-if=\"iconComponent\"\n                  :is=\"iconComponent\" \n                  class=\"sl-h-6 sl-w-6 sl-flex-shrink-0\" \n                  aria-hidden=\"true\" \n                />\n                <div class=\"sl-ml-3 sl-w-0 sl-flex-1 sl-pt-0.5\">\n                  <p class=\"sl-text-sm sl-font-medium\" :class=\"textClass\">\n                    {{ notification.title }}\n                  </p>\n                  <p \n                    v-if=\"notification.message\" \n                    class=\"sl-mt-1 sl-text-sm sl-opacity-90\" \n                    :class=\"textClass\"\n                  >\n                    {{ notification.message }}\n                  </p>\n                </div>\n                <button \n                  type=\"button\" \n                  @click=\"handleClose\"\n                  class=\"sl-ml-4 sl-inline-flex sl-rounded-md sl-text-current sl-opacity-70 hover:sl-opacity-100 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-offset-2\"\n                  :class=\"focusRingClass\"\n                >\n                  <span class=\"sl-sr-only\">Close</span>\n                  <XMarkIcon class=\"sl-h-5 sl-w-5\" aria-hidden=\"true\" />\n                </button>\n              </div>\n            </div>\n          </div>\n        </TransitionChild>\n      </div>\n    </div>\n  </TransitionRoot>\n</template>\n\n<script setup lang=\"ts\">\n/**\n * NotificationToast - Individual notification display\n * \n * Renders a single notification with theming, icons, and animations.\n * Used internally by NotificationContainer but can be used standalone.\n */\nimport { computed } from 'vue';\nimport { \n  CheckCircleIcon, \n  ExclamationTriangleIcon, \n  ExclamationCircleIcon, \n  InformationCircleIcon \n} from '@heroicons/vue/24/outline';\nimport { XMarkIcon } from '@heroicons/vue/20/solid';\nimport { TransitionRoot, TransitionChild } from '@headlessui/vue';\nimport type { NotificationState } from '../../composables/useNotifications';\n\nconst props = defineProps<{ \n  notification: NotificationState \n}>();\n\nconst emit = defineEmits<{\n  close: [notification: NotificationState];\n}>();\n\nconst handleClose = () => {\n  emit('close', props.notification);\n};\n\nconst onAfterLeave = () => {\n  // Animation cleanup callback\n};\n\nconst themeClass = computed(() => {\n  const themes: Record<string, string> = {\n    primary: 'sl-bg-stachelock-600 sl-text-white',\n    secondary: 'sl-bg-gray-600 sl-text-white',\n    dark: 'sl-bg-gray-800 sl-text-white',\n    light: 'sl-bg-white sl-text-gray-800 sl-border sl-border-gray-200',\n    warning: 'sl-bg-amber-500 sl-text-white',\n    danger: 'sl-bg-red-500 sl-text-white',\n    success: 'sl-bg-emerald-500 sl-text-white',\n    info: 'sl-bg-blue-500 sl-text-white',\n    ghost: 'sl-bg-white sl-text-gray-800 sl-border sl-border-gray-200',\n  };\n  return themes[props.notification.theme] || themes.primary;\n});\n\nconst textClass = computed(() => {\n  const theme = props.notification.theme;\n  return ['light', 'ghost'].includes(theme) ? 'sl-text-gray-800' : 'sl-text-white';\n});\n\nconst focusRingClass = computed(() => {\n  const rings: Record<string, string> = {\n    primary: 'focus:sl-ring-stachelock-400',\n    secondary: 'focus:sl-ring-gray-400',\n    dark: 'focus:sl-ring-gray-400',\n    light: 'focus:sl-ring-gray-300',\n    warning: 'focus:sl-ring-amber-300',\n    danger: 'focus:sl-ring-red-300',\n    success: 'focus:sl-ring-emerald-300',\n    info: 'focus:sl-ring-blue-300',\n    ghost: 'focus:sl-ring-gray-300',\n  };\n  return rings[props.notification.theme] || rings.primary;\n});\n\nconst iconComponent = computed(() => {\n  // Allow custom icon override\n  if (props.notification.icon) {\n    return props.notification.icon;\n  }\n  \n  const theme = props.notification.theme;\n  const icons: Record<string, typeof CheckCircleIcon> = {\n    primary: InformationCircleIcon,\n    secondary: InformationCircleIcon,\n    dark: ExclamationCircleIcon,\n    light: InformationCircleIcon,\n    warning: ExclamationTriangleIcon,\n    danger: ExclamationCircleIcon,\n    success: CheckCircleIcon,\n    info: InformationCircleIcon,\n    ghost: InformationCircleIcon,\n  };\n  return icons[theme] || icons.primary;\n});\n\nconst horizontalAlignClass = computed(() => {\n  const position = props.notification.position;\n  const alignments: Record<string, string> = {\n    tr: 'sl-items-end',\n    tl: 'sl-items-start',\n    bl: 'sl-items-start',\n    br: 'sl-items-end',\n    tc: 'sl-items-center',\n    bc: 'sl-items-center',\n  };\n  return alignments[position] || 'sl-items-end';\n});\n\nconst verticalAlignClass = computed(() => {\n  const position = props.notification.position;\n  const alignments: Record<string, string> = {\n    tr: 'sl-items-start',\n    tl: 'sl-items-start',\n    bl: 'sl-items-end',\n    br: 'sl-items-end',\n    tc: 'sl-items-start',\n    bc: 'sl-items-end',\n  };\n  return alignments[position] || 'sl-items-end';\n});\n\nconst containerStyle = computed(() => {\n  const position = props.notification.position;\n  const offset = props.notification.yOffset;\n  \n  const styles: Record<string, string | number> = {\n    zIndex: 9999,\n  };\n  \n  // Apply offset based on position (top or bottom)\n  if (['tl', 'tr', 'tc'].includes(position)) {\n    styles.marginTop = `${offset}px`;\n  } else {\n    styles.marginBottom = `${offset}px`;\n  }\n  \n  return styles;\n});\n</script>\n\n"],"names":["props","__props","emit","__emit","handleClose","onAfterLeave","themeClass","computed","themes","textClass","theme","focusRingClass","rings","iconComponent","icons","InformationCircleIcon","ExclamationCircleIcon","ExclamationTriangleIcon","CheckCircleIcon","horizontalAlignClass","position","verticalAlignClass","containerStyle","offset","styles","_createBlock","_unref","TransitionRoot","notification","_createElementVNode","_normalizeClass","_createVNode","TransitionChild","_createElementBlock","_hoisted_1","_hoisted_2","_openBlock","_resolveDynamicComponent","_hoisted_3","_cache","XMarkIcon"],"mappings":"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"}

package/dist/ProfileHeaderAvatar.vue_vue_type_script_setup_true_lang-Cri9BiBy.js

@@ -1,130 +0,0 @@
-import { defineComponent as _, ref as d, computed as o, onMounted as $, onBeforeUnmount as j, createElementBlock as a, openBlock as t, createElementVNode as r, createVNode as B, createCommentVNode as i, normalizeStyle as p, normalizeClass as h, renderSlot as m, createBlock as U, toDisplayString as u, Transition as I, withCtx as R } from "vue";
-import S from "./components/CloudinaryImage.js";
-const M = { class: "sl-relative sl-flex sl-items-center sl-gap-3" }, P = ["aria-expanded"], T = ["src", "alt"], V = {
-  key: 2,
-  class: "sl-w-full sl-h-full sl-inline-flex sl-items-center sl-justify-center sl-bg-stachelock-200 dark:sl-bg-stachelock-700"
-}, O = { class: "sl-p-4 sl-border-b sl-border-gray-200 dark:sl-border-slate-700" }, A = { class: "sl-text-sm sl-font-medium sl-text-gray-900 dark:sl-text-white" }, D = { class: "sl-text-xs sl-text-gray-500 dark:sl-text-slate-400" }, H = {
-  key: 0,
-  class: "sl-py-1"
-}, G = /* @__PURE__ */ _({
-  __name: "ProfileHeaderAvatar",
-  props: {
-    userName: {},
-    userEmail: { default: "" },
-    imagePublicId: {},
-    imageUrl: {},
-    showLogout: { type: Boolean, default: !0 },
-    logoutLabel: { default: "Log Out" },
-    size: { default: 40 },
-    ringColorClass: { default: "sl-ring-stachelock-400" },
-    menuTop: { default: "3rem" },
-    menuRight: { default: "0" }
-  },
-  emits: ["logout", "menu-toggle"],
-  setup(v, { expose: k, emit: y }) {
-    const l = v, c = y, s = d(!1), b = d(null), w = d(null), C = o(() => l.userName ? l.userName.split(" ").map((e) => e[0]).join("").toUpperCase().slice(0, 2) : "U"), x = o(() => `hover:sl-ring-2 hover:${l.ringColorClass}`), z = o(() => `sl-ring-2 ${l.ringColorClass}`), N = o(() => l.size < 32 ? "sl-text-xs" : l.size < 48 ? "sl-text-sm" : "sl-text-base"), E = o(() => ({
-      top: l.menuTop,
-      right: l.menuRight
-    })), f = () => {
-      s.value = !s.value, c("menu-toggle", s.value);
-    }, n = () => {
-      s.value && (s.value = !1, c("menu-toggle", !1));
-    }, L = () => {
-      n(), c("logout");
-    }, g = (e) => {
-      e.key === "Escape" && n();
-    };
-    return $(() => {
-      document.addEventListener("keydown", g);
-    }), j(() => {
-      document.removeEventListener("keydown", g);
-    }), k({
-      toggleMenu: f,
-      closeMenu: n,
-      isMenuOpen: s
-    }), (e, K) => (t(), a("div", M, [
-      r("button", {
-        ref_key: "avatarButton",
-        ref: b,
-        type: "button",
-        onClick: f,
-        class: h(["sl-relative sl-inline-flex sl-items-center sl-justify-center sl-rounded-full sl-overflow-hidden sl-transition-all sl-flex-shrink-0 focus:sl-outline-none", [
-          x.value,
-          { [z.value]: s.value }
-        ]]),
-        style: p({ width: `${e.size}px`, height: `${e.size}px` }),
-        "aria-expanded": s.value,
-        "aria-haspopup": "true"
-      }, [
-        m(e.$slots, "avatar", {}, () => [
-          e.imagePublicId ? (t(), U(S, {
-            key: 0,
-            "public-id": e.imagePublicId,
-            alt: e.userName,
-            width: e.size,
-            height: e.size,
-            "custom-classes": { image: { "sl-w-full sl-h-full sl-object-cover sl-object-center": !0 } },
-            skeleton: "user"
-          }, null, 8, ["public-id", "alt", "width", "height"])) : e.imageUrl ? (t(), a("img", {
-            key: 1,
-            src: e.imageUrl,
-            alt: e.userName,
-            class: "sl-w-full sl-h-full sl-object-cover sl-object-center"
-          }, null, 8, T)) : (t(), a("div", V, [
-            r("span", {
-              class: h(["sl-font-semibold sl-text-stachelock-700 dark:sl-text-stachelock-200", N.value])
-            }, u(C.value), 3)
-          ]))
-        ])
-      ], 14, P),
-      B(I, {
-        "enter-active-class": "sl-transition sl-ease-out sl-duration-100",
-        "enter-from-class": "sl-transform sl-opacity-0 sl-scale-95",
-        "enter-to-class": "sl-transform sl-opacity-100 sl-scale-100",
-        "leave-active-class": "sl-transition sl-ease-in sl-duration-75",
-        "leave-from-class": "sl-transform sl-opacity-100 sl-scale-100",
-        "leave-to-class": "sl-transform sl-opacity-0 sl-scale-95"
-      }, {
-        default: R(() => [
-          s.value ? (t(), a("div", {
-            key: 0,
-            ref_key: "menuRef",
-            ref: w,
-            class: "sl-absolute sl-bg-white dark:sl-bg-slate-800 sl-rounded-lg sl-shadow-lg sl-border sl-border-gray-200 dark:sl-border-slate-700 sl-z-50 sl-min-w-max sl-overflow-hidden",
-            style: p(E.value),
-            role: "menu",
-            "aria-orientation": "vertical"
-          }, [
-            r("div", O, [
-              m(e.$slots, "menu-header", {}, () => [
-                r("p", A, u(e.userName), 1),
-                r("p", D, u(e.userEmail), 1)
-              ])
-            ]),
-            e.$slots["menu-items"] ? (t(), a("div", H, [
-              m(e.$slots, "menu-items")
-            ])) : i("", !0),
-            e.showLogout ? (t(), a("button", {
-              key: 1,
-              type: "button",
-              onClick: L,
-              class: "sl-w-full sl-text-left sl-px-4 sl-py-2 sl-text-sm sl-text-red-600 dark:sl-text-red-400 hover:sl-bg-red-50 dark:hover:sl-bg-red-900/20 sl-transition-colors",
-              role: "menuitem"
-            }, u(e.logoutLabel), 1)) : i("", !0)
-          ], 4)) : i("", !0)
-        ]),
-        _: 3
-      }),
-      s.value ? (t(), a("div", {
-        key: 0,
-        class: "sl-fixed sl-inset-0 sl-z-40",
-        onClick: n,
-        "aria-hidden": "true"
-      })) : i("", !0)
-    ]));
-  }
-});
-export {
-  G as _
-};
-//# sourceMappingURL=ProfileHeaderAvatar.vue_vue_type_script_setup_true_lang-Cri9BiBy.js.map

package/dist/SelectInput.vue_vue_type_script_setup_true_lang--yUL7bcx.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectInput.vue_vue_type_script_setup_true_lang--yUL7bcx.js","sources":["../src/components/inputs/SelectInput.vue"],"sourcesContent":["<!--\n  @component SelectInput\n  @description Dropdown select input with Headless UI integration.\n  \n  A select/dropdown component built on Headless UI's Listbox with support\n  for single and multiple selection, icons, and validation.\n  \n  @props\n  - name (string, required): Field name for form binding\n  - items (SelectItem[], required): Options array with id/name or custom keys\n  - label (string, optional): Display label\n  - placeholder (string, optional): Placeholder text\n  - disabled (boolean, optional): Disabled state\n  - multiple (boolean, optional): Enable multiple selection\n  - showAll (boolean, optional): Show \"Select All\" option for multiple\n  - itemKey (string, optional): Property for item key (default: 'id')\n  - itemText (string, optional): Property for item text (default: 'name')\n  - rules (Schema, optional): Validation rules\n  - modelValue (any, optional): Selected value(s) via v-model\n  \n  @emits\n  - update:modelValue: Emitted when selection changes\n  \n  @example\n  <SelectInput\n    name=\"country\"\n    label=\"Country\"\n    :items=\"countries\"\n    v-model=\"form.country\"\n    placeholder=\"Select a country\"\n  />\n  \n  @example Multiple selection with Select All\n  <SelectInput\n    name=\"languages\"\n    label=\"Languages\"\n    :items=\"languages\"\n    v-model=\"form.languages\"\n    multiple\n    show-all\n  />\n-->\n<template>\n  <div class=\"sl-w-full\">\n    <FormFieldWrapper\n      :id=\"id\"\n      :name=\"name\"\n      :label=\"label\"\n      :disabled=\"disabled\"\n      :optional=\"!rules\"\n      :tertiary-label=\"tertiaryLabel\"\n      :box-shadow=\"boxShadow\"\n      :error-message=\"errorMessage\"\n      :success-message=\"successMessage\"\n      :is-valid=\"meta.valid\"\n      :is-touched=\"meta.touched\"\n    >\n      <Listbox\n        v-model=\"selectedValue\"\n        :disabled=\"disabled\"\n        :multiple=\"multiple\"\n        @update:model-value=\"handleChange\"\n        v-slot=\"{ open }\"\n      >\n        <div class=\"sl-relative\">\n          <!-- Track open state changes to sync position updates -->\n          <DropdownPositionTracker :open=\"open\" :update-fn=\"updateDropdownPosition\" />\n          <ListboxButton\n            ref=\"listboxButtonRef\"\n            :id=\"id\"\n            :class=\"[\n              selectClasses,\n              buttonClass\n            ]\"\n            @click=\"updateDropdownPosition\"\n          >\n            <span class=\"sl-flex sl-items-center sl-gap-2\">\n              <!-- Selected item icon -->\n              <component\n                v-if=\"selectedIcon\"\n                :is=\"selectedIcon\"\n                class=\"sl-h-4 sl-w-4 sl-flex-shrink-0\"\n                aria-hidden=\"true\"\n              />\n              \n              <!-- Selected value display -->\n              <span\n                v-if=\"displayValue\"\n                class=\"sl-block sl-truncate sl-text-left\"\n              >\n                {{ displayValue }}\n              </span>\n              <span\n                v-else\n                class=\"sl-block sl-truncate sl-text-left sl-text-gray-500 dark:sl-text-slate-300\"\n              >\n                {{ placeholder || 'Select an option' }}\n              </span>\n            </span>\n            \n            <span class=\"sl-pointer-events-none sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-2\">\n              <ChevronUpDownIcon\n                class=\"sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-slate-300\"\n                aria-hidden=\"true\"\n              />\n            </span>\n          </ListboxButton>\n\n          <Teleport to=\"body\">\n            <transition\n              leave-active-class=\"sl-transition sl-duration-100 sl-ease-in\"\n              leave-from-class=\"sl-opacity-100\"\n              leave-to-class=\"sl-opacity-0\"\n            >\n              <ListboxOptions\n                class=\"sl-fixed sl-z-[9999] sl-overflow-auto sl-rounded-md sl-bg-white dark:sl-bg-slate-800 sl-py-1 sl-text-base sl-shadow-lg dark:sl-shadow-slate-900/50 sl-ring-1 sl-ring-black sl-ring-opacity-5 dark:sl-ring-slate-700 focus:sl-outline-none sm:sl-text-sm\"\n                :style=\"dropdownStyle\"\n              >\n                <!-- Show All option for multiple select -->\n                <li\n                  v-if=\"multiple && showAll\"\n                  role=\"button\"\n                  tabindex=\"0\"\n                  @mousedown.prevent\n                  @click.prevent.stop=\"toggleSelectAll\"\n                  :class=\"[\n                    'sl-relative sl-cursor-pointer sl-select-none sl-py-2 sl-pl-3 sl-pr-9 sl-text-gray-900 dark:sl-text-slate-200',\n                    'hover:sl-bg-stachelock-600 hover:sl-text-white',\n                  ]\"\n                >\n                  <span class=\"sl-block sl-truncate sl-font-medium\">\n                    {{ isAllSelected ? 'Unselect All' : 'Select All' }}\n                  </span>\n                </li>\n\n                <!-- Regular options -->\n                <ListboxOption\n                  v-for=\"item in items\"\n                  :key=\"getItemKey(item)\"\n                  :value=\"item\"\n                  as=\"template\"\n                  :disabled=\"item.disabled\"\n                  v-slot=\"{ active, selected }\"\n                >\n                  <li\n                    :class=\"[\n                      'sl-relative sl-cursor-default sl-select-none sl-py-2 sl-pl-3 sl-pr-9',\n                      active ? 'sl-bg-stachelock-600 sl-text-white' : 'sl-text-gray-900 dark:sl-text-slate-200',\n                      item.disabled ? 'sl-opacity-50 sl-cursor-not-allowed' : ''\n                    ]\"\n                  >\n                    <div class=\"sl-flex sl-items-center sl-gap-2\">\n                      <!-- Item icon -->\n                      <component\n                        v-if=\"item.icon\"\n                        :is=\"item.icon\"\n                        class=\"sl-h-4 sl-w-4 sl-flex-shrink-0\"\n                        :class=\"active ? 'sl-text-white' : 'sl-text-gray-400 dark:sl-text-slate-300'\"\n                        aria-hidden=\"true\"\n                      />\n                      \n                      <span\n                        :class=\"[\n                          'sl-block sl-truncate',\n                          selected ? 'sl-font-medium' : 'sl-font-normal'\n                        ]\"\n                      >\n                        {{ getItemText(item) }}\n                      </span>\n                    </div>\n\n                    <span\n                      v-if=\"selected\"\n                      class=\"sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-4\"\n                    >\n                      <CheckIcon class=\"sl-h-5 sl-w-5\" aria-hidden=\"true\" />\n                    </span>\n                  </li>\n                </ListboxOption>\n              </ListboxOptions>\n            </transition>\n          </Teleport>\n        </div>\n      </Listbox>\n      \n      <template #success-message>\n        <span v-if=\"successMessage\">{{ successMessage }}</span>\n      </template>\n    </FormFieldWrapper>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\n/**\n * SelectInput - Dropdown select with Headless UI\n * \n * Provides a styled select/dropdown component with single and multiple\n * selection modes. Uses Headless UI's Listbox for accessibility.\n * \n * ## Features\n * - Single and multiple selection modes\n * - \"Select All\" option for multiple mode\n * - Item icons support\n * - vee-validate integration\n * - Accessible keyboard navigation\n * - Customizable item key/text properties\n * - Teleported dropdown to avoid z-index/overflow issues\n * \n * @module components/inputs/SelectInput\n * @see {@link SelectItem} for item interface\n */\nimport { computed, ref, watch, onBeforeUnmount, defineComponent } from 'vue'\nimport {\n  Listbox,\n  ListboxButton,\n  ListboxOption,\n  ListboxOptions,\n} from '@headlessui/vue'\nimport { CheckIcon, ChevronUpDownIcon } from '@heroicons/vue/20/solid'\nimport { useField } from 'vee-validate'\nimport FormFieldWrapper from '../forms/FormFieldWrapper.vue'\nimport type { ValidationRule } from '../../types/form'\nimport { generateId } from '../../utils/id'\n\n/**\n * DropdownPositionTracker - Renderless component that watches HeadlessUI open state\n * and triggers position updates when dropdown opens or scroll/resize occurs\n */\nconst DropdownPositionTracker = defineComponent({\n  props: {\n    open: { type: Boolean, required: true },\n    updateFn: { type: Function, required: true }\n  },\n  setup(props) {\n    // Define handleScroll in setup scope so it's a stable reference\n    const handleScroll = () => {\n      if (props.open) {\n        props.updateFn()\n      }\n    }\n    \n    // Watch the open prop and trigger position update + attach scroll listeners\n    watch(() => props.open, (isOpen) => {\n      if (isOpen) {\n        // Update position immediately when opening\n        props.updateFn()\n        // Add scroll/resize listeners - use capture to catch scroll events from any container\n        window.addEventListener('scroll', handleScroll, true)\n        window.addEventListener('resize', handleScroll)\n      } else {\n        // Remove listeners when closed\n        window.removeEventListener('scroll', handleScroll, true)\n        window.removeEventListener('resize', handleScroll)\n      }\n    }, { immediate: true })\n    \n    // Cleanup on unmount\n    onBeforeUnmount(() => {\n      window.removeEventListener('scroll', handleScroll, true)\n      window.removeEventListener('resize', handleScroll)\n    })\n    \n    // Render nothing\n    return () => null\n  }\n})\n\n// Refs for floating dropdown positioning\nconst listboxButtonRef = ref<InstanceType<typeof ListboxButton> | null>(null)\nconst dropdownStyle = ref<Record<string, string>>({\n  top: '0px',\n  left: '0px',\n  width: '200px'\n})\n\n// Estimated dropdown height for flip calculation (max-h-56 = 14rem = 224px)\nconst DROPDOWN_MAX_HEIGHT = 224\nconst DROPDOWN_GAP = 4\n\nfunction updateDropdownPosition() {\n  // Get the actual DOM element from the Headless UI component\n  const el = listboxButtonRef.value?.$el as HTMLElement | undefined\n  if (!el) return\n  \n  const rect = el.getBoundingClientRect()\n  const viewportHeight = window.innerHeight\n  \n  // Calculate available space below and above the button\n  const spaceBelow = viewportHeight - rect.bottom - DROPDOWN_GAP\n  const spaceAbove = rect.top - DROPDOWN_GAP\n  \n  // Determine if we should flip to show above\n  const shouldFlipAbove = spaceBelow < DROPDOWN_MAX_HEIGHT && spaceAbove > spaceBelow\n  \n  if (shouldFlipAbove) {\n    // Position above the button\n    dropdownStyle.value = {\n      bottom: `${viewportHeight - rect.top + DROPDOWN_GAP}px`,\n      left: `${rect.left}px`,\n      width: `${rect.width}px`,\n      maxHeight: `${Math.min(spaceAbove, DROPDOWN_MAX_HEIGHT)}px`\n    }\n  } else {\n    // Position below the button (default)\n    dropdownStyle.value = {\n      top: `${rect.bottom + DROPDOWN_GAP}px`,\n      left: `${rect.left}px`,\n      width: `${rect.width}px`,\n      maxHeight: `${Math.min(spaceBelow, DROPDOWN_MAX_HEIGHT)}px`\n    }\n  }\n}\n\ninterface SelectItem {\n  [key: string]: any\n  icon?: any\n  disabled?: boolean\n}\n\ninterface Props {\n  name: string\n  items: SelectItem[]\n  label?: string\n  placeholder?: string\n  disabled?: boolean\n  rules?: ValidationRule\n  validateOnMount?: boolean\n  successMessage?: string\n  tertiaryLabel?: string\n  buttonClass?: string\n  multiple?: boolean\n  showAll?: boolean\n  itemKey?: string\n  itemText?: string\n  modelValue?: any\n  boxShadow?: boolean\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  itemKey: 'id',\n  itemText: 'name',\n  multiple: false,\n  showAll: false,\n  boxShadow: false\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: any]\n}>()\n\nconst id = generateId(props.name)\n\n// Use vee-validate for form validation\nconst { value, errorMessage, handleChange: handleValidation, meta, setTouched } = useField(\n  () => props.name,\n  props.rules,\n  {\n    validateOnMount: props.validateOnMount,\n    initialValue: props.modelValue\n  }\n)\n\nconst selectedValue = ref<any>(\n  props.multiple\n    ? (Array.isArray(props.modelValue) ? props.modelValue : [])\n    : props.modelValue\n)\n\n// Watch for external changes\nwatch(\n  () => props.modelValue,\n  (newValue) => {\n    if (props.multiple) {\n      const coerced = Array.isArray(newValue) ? newValue : []\n      if (coerced !== selectedValue.value) {\n        selectedValue.value = coerced\n        value.value = coerced\n      }\n    } else {\n      if (newValue !== selectedValue.value) {\n        selectedValue.value = newValue\n        value.value = newValue\n      }\n    }\n  },\n  { immediate: true }\n)\n\nwatch(\n  selectedValue,\n  (newValue) => {\n    emit('update:modelValue', newValue)\n  }\n)\n\nconst selectClasses = computed(() => {\n  const baseClasses = [\n    'sl-relative',\n    'sl-w-full',\n    'sl-cursor-default',\n    'sl-rounded-md',\n    'sl-bg-white',\n    'dark:sl-bg-slate-900',\n    'sl-text-gray-900',\n    'dark:sl-text-slate-100',\n    'sl-py-2',\n    'sl-pl-3',\n    'sl-pr-10',\n    'sl-text-left',\n    'sl-border',\n    'sl-text-sm',\n    'focus:sl-outline-none',\n    'focus:sl-ring-2',\n    'focus:sl-ring-stachelock-500',\n    'focus:sl-border-stachelock-500',\n    'sl-transition-all',\n    'sl-duration-200'\n  ]\n\n  if (props.disabled) {\n    baseClasses.push(\n      'sl-bg-gray-50',\n      'dark:sl-bg-slate-800',\n      'sl-text-gray-500',\n      'dark:sl-text-slate-300',\n      'sl-cursor-not-allowed',\n      'sl-border-gray-200',\n      'dark:sl-border-slate-700'\n    )\n  } else if (errorMessage.value) {\n    baseClasses.push(\n      'sl-border-red-300',\n      'dark:sl-border-red-500',\n      'focus:sl-ring-red-500',\n      'focus:sl-border-red-500'\n    )\n  } else if (meta.valid && meta.touched) {\n    baseClasses.push(\n      'sl-border-green-300',\n      'dark:sl-border-green-500',\n      'focus:sl-ring-green-500',\n      'focus:sl-border-green-500'\n    )\n  } else {\n    baseClasses.push(\n      'sl-border-gray-300',\n      'dark:sl-border-slate-600',\n      'hover:sl-border-gray-400',\n      'dark:hover:sl-border-slate-500'\n    )\n  }\n\n  return baseClasses.join(' ')\n})\n\nconst getItemKey = (item: SelectItem): any => {\n  return item[props.itemKey]\n}\n\nconst getItemText = (item: SelectItem): string => {\n  return item[props.itemText] || item.toString()\n}\n\nconst displayValue = computed(() => {\n  if (!selectedValue.value) return ''\n  \n  if (props.multiple && Array.isArray(selectedValue.value)) {\n    if (selectedValue.value.length === 0) return ''\n    if (selectedValue.value.length === 1) {\n      return getItemText(selectedValue.value[0])\n    }\n    return `${selectedValue.value.length} items selected`\n  }\n  \n  return getItemText(selectedValue.value)\n})\n\nconst selectedIcon = computed(() => {\n  if (!selectedValue.value) return null\n  \n  if (props.multiple && Array.isArray(selectedValue.value)) {\n    return selectedValue.value.length === 1 ? selectedValue.value[0].icon : null\n  }\n  \n  return selectedValue.value.icon\n})\n\nconst allItems = computed(() => {\n  return props.items.filter(item => !item.disabled)\n})\n\nconst handleChange = (value: any) => {\n  selectedValue.value = value\n  setTouched(true)\n  handleValidation(value)\n}\n\nconst isAllSelected = computed(() => {\n  if (!props.multiple || !Array.isArray(selectedValue.value)) return false\n  const selectable = allItems.value\n  if (selectable.length === 0) return false\n  // Compare by item key instead of reference for reliable equality check\n  const selectedKeys = new Set((selectedValue.value as any[]).map(item => getItemKey(item)))\n  return selectable.every(item => selectedKeys.has(getItemKey(item)))\n})\n\nconst toggleSelectAll = () => {\n  if (!props.multiple) return\n  if (isAllSelected.value) {\n    selectedValue.value = []\n  } else {\n    selectedValue.value = [...allItems.value]\n  }\n  handleValidation(selectedValue.value)\n}\n</script>\n\n\n"],"names":["DROPDOWN_MAX_HEIGHT","DROPDOWN_GAP","DropdownPositionTracker","defineComponent","props","handleScroll","watch","isOpen","onBeforeUnmount","listboxButtonRef","ref","dropdownStyle","updateDropdownPosition","el","rect","viewportHeight","spaceBelow","spaceAbove","__props","emit","__emit","id","generateId","value","errorMessage","handleValidation","meta","setTouched","useField","selectedValue","newValue","coerced","selectClasses","computed","baseClasses","getItemKey","item","getItemText","displayValue","selectedIcon","allItems","handleChange","isAllSelected","selectable","selectedKeys","toggleSelectAll","_openBlock","_createElementBlock","_hoisted_1","_createVNode","FormFieldWrapper","_unref","name","label","disabled","rules","tertiaryLabel","boxShadow","successMessage","Listbox","$event","multiple","_withCtx","open","_createElementVNode","_hoisted_2","ListboxButton","_normalizeClass","buttonClass","_hoisted_3","_createBlock","_resolveDynamicComponent","_hoisted_4","_toDisplayString","_hoisted_5","placeholder","_hoisted_6","ChevronUpDownIcon","_Teleport","_Transition","ListboxOptions","showAll","_hoisted_7","_Fragment","_renderList","items","ListboxOption","active","selected","_hoisted_8","_hoisted_9","CheckIcon"],"mappings":"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"}

package/dist/TagifyInput.vue_vue_type_script_setup_true_lang-CAK6ZIiz.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TagifyInput.vue_vue_type_script_setup_true_lang-CAK6ZIiz.js","sources":["../src/components/inputs/TagifyInput.vue"],"sourcesContent":["<template>\n  <FormFieldWrapper\n    :id=\"name\"\n    :name=\"name\"\n    :label=\"label\"\n    :tertiary-label=\"tertiaryLabel\"\n    :error-message=\"errorMessage\"\n    :disabled=\"disabled\"\n    :optional=\"optional\"\n  >\n    <template #tertiary-label-overlay>\n      <slot name=\"tertiary-overlay\"></slot>\n    </template>\n    \n    <div class=\"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\"\n      :class=\"inline ? null : 'sl-shadow-sm sl-border sl-border-gray-300 focus-within:sl-ring-2 focus-within:sl-ring-stachelock-600'\">\n      <!-- Display selected tags as badges -->\n      <UiBadge v-for=\"(tag, index) in selectedTags\" :key=\"index\" @click=\"editTag(index)\" theme=\"primary\" size=\"sm\">\n        <span v-if=\"!tag.isEditing\">{{ tagDisplay(tag) }}</span>\n        <input v-else ref=\"editInput\" v-model=\"tag[props.itemText]\" :placeholder=\"placeholder\"\n          :disabled=\"disabled\" @keydown.enter.prevent=\"stopEditingTag(index)\"\n          @blur=\"stopEditingTag(index)\"\n          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\"\n          :style=\"{ width: tag[props.itemText].length + 4 + 'ch' }\" />\n        <button type=\"button\" class=\"sl-ml-2 sl-text-stachelock-600 hover:sl-text-stachelock-400 focus:sl-outline-none\"\n          @click.stop=\"removeTag(index)\" :disabled=\"disabled\">\n          <XMarkIcon class=\"sl-h-4 sl-w-4\" />\n        </button>\n      </UiBadge>\n      <!-- Input for adding new tags -->\n      <div class=\"sl-flex-1 sl-min-w-0 sl-relative\">\n        <input ref=\"input\" v-model=\"query\" :placeholder=\"placeholder\" @input=\"filterItems\"\n          :disabled=\"disabled\" @keydown.enter.prevent=\"addTag\"\n          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\" />\n        <!-- Overlay slot aligned to the far right -->\n        <div class=\"sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-pointer-events-auto\">\n          <slot name=\"input-overlay\" />\n        </div>\n        <!-- Suggestions Dropdown -->\n        <div v-if=\"showDropdown && !disabled\"\n          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\">\n          <div v-for=\"item in filteredItems\" :key=\"item[itemKey]\"\n            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\"\n            @click.prevent=\"selectSuggestion(item)\">\n            <div class=\"sl-flex\">\n              <span class=\"sl-truncate sl-font-semibold\">\n                <span class=\"sl-block sl-truncate\">{{ itemDisplay(item) }}</span>\n              </span>\n              <span v-if=\"showSubext\" class=\"sl-ml-2 sl-truncate sl-text-gray-500\">\n                {{ itemSecondaryDisplay(item) }}\n              </span>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </FormFieldWrapper>\n</template>\n\n<script lang=\"ts\" setup>\nimport { ref, watch, onMounted, nextTick } from 'vue';\nimport { XMarkIcon } from '@heroicons/vue/20/solid';\nimport UiBadge from '../UiBadge.vue';\nimport FormFieldWrapper from '../forms/FormFieldWrapper.vue';\n\ninterface Item {\n  id: string | number | null;\n  [key: string]: any; // Allows dynamic keys like 'value' or 'name'\n}\n\nconst props = defineProps({\n  items: {\n    type: Array as () => Item[],\n    required: true,\n  },\n  value: {\n    type: Array as () => Item[],\n    default: () => [],\n  },\n  name: {\n    type: String,\n    required: true,\n  },\n  label: {\n    type: String,\n    required: false,\n  },\n  itemKey: {\n    type: String,\n    default: 'id',\n  },\n  itemText: {\n    type: String,\n    default: 'value',\n  },\n  itemSubtext: {\n    type: String,\n    default: 'name',\n  },\n  showSubext: {\n    type: Boolean,\n    default: true\n  },\n  tagDisplayKey: {\n    type: String,\n    default: 'name',\n  },\n  tertiaryLabel: {\n    type: String,\n    required: false,\n  },\n  pattern: {\n    type: RegExp,\n    default: null,\n  },\n  inline: {\n    type: Boolean,\n    default: false,\n  },\n  placeholder: {\n    type: String,\n    default: 'Add a tag...',\n  },\n  disabled: {\n    type: Boolean,\n    default: false\n  },\n  optional: {\n    type: Boolean,\n    default: false\n  },\n  errorMessage: {\n    type: String,\n    default: ''\n  },\n  hasInputRing: {\n    type: Boolean,\n    default: false\n  }\n});\n\nconst emits = defineEmits(['update:value', 'update:query', 'invalid-tag']);\n\nconst query = ref<string>('');\nconst filteredItems = ref<Item[]>([]);\nconst selectedTags = ref<Item[]>(JSON.parse(JSON.stringify(props.value)));\nconst showDropdown = ref(false);\n\nwatch(\n  () => props.value,\n  (newVal) => {\n    if (JSON.stringify(newVal) !== JSON.stringify(selectedTags.value)) {\n      selectedTags.value = JSON.parse(JSON.stringify(newVal));\n    }\n  },\n  { deep: true }\n);\n\nconst itemDisplay = (item: Item) => item[props.itemSubtext] || item[props.itemText];\nconst itemSecondaryDisplay = (item: Item) => item[props.itemSubtext] ? item[props.itemText] : undefined;\nconst tagDisplay = (tag: Item) => tag[props.tagDisplayKey] || tag[props.itemText];\n\nconst filterItems = () => {\n  if (query.value && query.value.length > 0) {\n    emits('update:query', query.value);\n\n    // Simple filtering logic\n    const lowerQuery = query.value.toLowerCase();\n    filteredItems.value = props.items.filter((item) => {\n      return (\n        item[props.itemText]?.toLowerCase().includes(lowerQuery) ||\n        item[props.itemSubtext]?.toLowerCase().includes(lowerQuery)\n      );\n    });\n    showDropdown.value = true;\n  } else {\n    filteredItems.value = [];\n    showDropdown.value = false;\n  }\n};\n\nconst addTag = () => {\n  const trimmedQuery = query.value.trim();\n  if (trimmedQuery === '') {\n    return;\n  }\n\n  let tagToAdd: Item | null = null;\n\n  const lowerQuery = trimmedQuery.toLowerCase();\n\n  // Check if the query matches any item in the items list\n  const matchedItem = props.items.find(\n    (item) =>\n      item[props.itemText]?.toLowerCase() === lowerQuery ||\n      item[props.itemSubtext]?.toLowerCase() === lowerQuery\n  );\n\n  if (matchedItem) {\n    tagToAdd = { ...matchedItem };\n  } else if (props.pattern && props.pattern.test(trimmedQuery)) {\n    // Create a new item if it doesn't exist and matches the pattern\n    tagToAdd = { id: null, [props.itemText]: trimmedQuery };\n  } else {\n    // Do not emit invalid-tag here; let the user continue typing\n    return;\n  }\n\n  // Avoid duplicates\n  if (\n    !selectedTags.value.some(\n      (tag) => tag[props.itemText] === tagToAdd![props.itemText]\n    )\n  ) {\n    selectedTags.value.push(tagToAdd!);\n    emits('update:value', selectedTags.value);\n  }\n\n  query.value = '';\n  filteredItems.value = [];\n  showDropdown.value = false;\n};\n\nconst selectSuggestion = (item: Item) => {\n  const valueToTest = item[props.itemText].trim();\n\n  // Avoid duplicates\n  if (\n    !selectedTags.value.some(\n      (tag) => tag[props.itemText] === valueToTest\n    )\n  ) {\n    selectedTags.value.push({ ...item });\n    emits('update:value', selectedTags.value);\n  }\n  query.value = '';\n  filteredItems.value = [];\n  showDropdown.value = false;\n};\n\nconst removeTag = (index: number) => {\n  selectedTags.value.splice(index, 1);\n  emits('update:value', selectedTags.value);\n};\n\nconst editTag = (index: number) => {\n  selectedTags.value[index].isEditing = true;\n  nextTick(() => {\n    // Focus logic can be added here if needed\n  });\n};\n\nconst stopEditingTag = (index: number) => {\n  const tag = selectedTags.value[index];\n  if (tag) {\n    tag.isEditing = false;\n    const valueToTest = tag[props.itemText].trim();\n\n    // Validate tag if pattern is provided\n    if (props.pattern && !props.pattern.test(valueToTest)) {\n      emits('invalid-tag', valueToTest);\n      removeTag(index);\n      return;\n    }\n\n    // Update the tag value after trimming\n    tag[props.itemText] = valueToTest;\n    emits('update:value', selectedTags.value);\n  }\n};\n\nonMounted(() => {\n  // Initialize filteredItems\n  filteredItems.value = [];\n});\n\ndefineExpose({\n  selectedTags,\n});\n</script>\n\n<style scoped>\n</style>\n"],"names":["props","__props","emits","__emit","query","ref","filteredItems","selectedTags","showDropdown","watch","newVal","itemDisplay","item","itemSecondaryDisplay","tagDisplay","tag","filterItems","lowerQuery","addTag","trimmedQuery","tagToAdd","matchedItem","selectSuggestion","valueToTest","removeTag","index","editTag","nextTick","stopEditingTag","onMounted","__expose","_createBlock","FormFieldWrapper","_renderSlot","_ctx","_createElementVNode","_normalizeClass","_openBlock","_createElementBlock","_Fragment","_renderList","UiBadge","$event","_withKeys","_withModifiers","_hoisted_1","_toDisplayString","_createVNode","_unref","XMarkIcon","_hoisted_4","_hoisted_6","_hoisted_7","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12"],"mappings":"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"}