@stachelock/ui 0.3.0 → 0.4.0

package/dist/EmailInput.vue_vue_type_script_setup_true_lang-BicPMIop.js

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

package/dist/{EmailInput.vue_vue_type_script_setup_true_lang-Dhfgs2Jn.js.map → EmailInput.vue_vue_type_script_setup_true_lang-BicPMIop.js.map}

@@ -1 +1 @@
-{"version":3,"file":"EmailInput.vue_vue_type_script_setup_true_lang-Dhfgs2Jn.js","sources":["../src/components/inputs/EmailInput.vue"],"sourcesContent":["<!--\n  @component EmailInput\n  @description Specialized email input with validation and optional verification.\n  \n  A text input specifically designed for email addresses with built-in\n  email validation. Extends the base text input with email-specific\n  features like type=\"email\" and email validation rules.\n  \n  @props\n  - name (string, required): Field name for form binding\n  - value (string, optional): Email value (use v-model:value)\n  - label (string, optional): Display label\n  - placeholder (string, optional): Placeholder text\n  - disabled (boolean, optional): Disabled state\n  - rules (Schema, optional): Custom validation rules\n  - colorfulValidation (boolean, optional): Color-coded validation states\n  - showValidCheck (boolean, optional): Show check icon when valid\n  - showErrors (boolean, optional): Force show errors\n  - autoComplete (string, optional): Autocomplete attribute value\n  \n  @emits\n  - update:value: Emitted when value changes\n  - update:validity: Emitted when validation state changes\n  - focus: Emitted on focus\n  - blur: Emitted on blur\n  - submit: Emitted when Enter is pressed with valid email\n  \n  @example\n  <EmailInput\n    name=\"email\"\n    label=\"Email Address\"\n    v-model:value=\"form.email\"\n    placeholder=\"you@example.com\"\n  />\n-->\n<template>\n  <div class=\"sl-w-full\">\n    <FormFieldWrapper\n      :id=\"id\"\n      :name=\"name\"\n      :label=\"label\"\n      :tertiary-label=\"tertiaryLabel\"\n      :error-message=\"errorMessage\"\n      :success-message=\"successMessage\"\n      :is-valid=\"meta.valid\"\n      :is-touched=\"meta.touched\"\n      :show-errors=\"showErrors\"\n      :show-valid-check=\"showValidCheck\"\n      :colorful-validation=\"colorfulValidation\"\n      :disabled=\"disabled\"\n      :disabled-message=\"disabledMessage\"\n    >\n      <template #default=\"{ inputClasses }\">\n        <input\n          :name=\"name\"\n          :id=\"id\"\n          type=\"email\"\n          :value=\"inputValue\"\n          :placeholder=\"placeholder\"\n          :autocomplete=\"autoComplete\"\n          :disabled=\"disabled\"\n          class=\"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\"\n          :class=\"[\n            inputClasses,\n            'sl-py-1.5 sl-pl-2',\n            { 'sl-text-gray-400': disabled },\n            { 'sl-pr-10': showValidCheck },\n          ]\"\n          @input=\"handleInput\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n          @keydown.enter.prevent=\"handleEnterKey\"\n          enterkeyhint=\"go\"\n          data-testid=\"email-input\"\n        />\n      </template>\n\n      <template #input-right>\n        <slot name=\"input-right\" />\n      </template>\n    </FormFieldWrapper>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, toRef, watch, nextTick } from 'vue'\nimport { useField } from 'vee-validate'\nimport { string as yupString, type AnySchema } from 'yup'\nimport FormFieldWrapper from '../forms/FormFieldWrapper.vue'\nimport { generateId } from '../../utils/id'\n\ninterface Props {\n  name: string\n  value?: string\n  label?: string\n  placeholder?: string\n  disabled?: boolean\n  disabledMessage?: string\n  rules?: AnySchema\n  successMessage?: string\n  tertiaryLabel?: string\n  colorfulValidation?: boolean\n  showValidCheck?: boolean\n  showErrors?: boolean\n  autoComplete?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  value: '',\n  label: 'Email',\n  placeholder: 'you@example.com',\n  disabled: false,\n  disabledMessage: '',\n  rules: () => yupString().email('Invalid email address').required('Email is required'),\n  successMessage: '',\n  tertiaryLabel: '',\n  colorfulValidation: true,\n  showValidCheck: true,\n  showErrors: false,\n  autoComplete: 'email'\n})\n\nconst emit = defineEmits<{\n  'update:value': [value: string]\n  'update:validity': [isValid: boolean]\n  focus: [event: FocusEvent]\n  blur: [event: FocusEvent]\n  submit: []\n}>()\n\nconst id = generateId(`sl-${props.name}`)\nconst touched = ref(false)\n\nconst {\n  value: inputValue,\n  errorMessage,\n  handleBlur: veeHandleBlur,\n  handleChange,\n  meta,\n  validate,\n  setTouched\n} = useField(toRef(props, 'name'), toRef(props, 'rules'), {\n  initialValue: props.value,\n  validateOnValueUpdate: true,\n  validateOnMount: false\n})\n\n// Sync external value changes\nwatch(\n  () => props.value,\n  (newValue) => {\n    if (newValue !== undefined && newValue !== inputValue.value) {\n      inputValue.value = newValue\n    }\n  },\n  { immediate: true }\n)\n\n// Emit validity changes\nwatch(\n  () => meta.valid,\n  (v) => nextTick(() => emit('update:validity', v)),\n  { immediate: true }\n)\n\n// Emit value changes\nwatch(inputValue, (newValue, oldValue) => {\n  if (newValue !== oldValue) {\n    emit('update:value', newValue || '')\n  }\n})\n\nfunction handleInput(e: Event) {\n  const v = (e.target as HTMLInputElement).value\n  handleChange(v)\n  emit('update:value', v)\n}\n\nasync function handleBlur(e: FocusEvent) {\n  if (!touched.value) {\n    touched.value = true\n    setTouched(true)\n  }\n  await validate()\n  veeHandleBlur(e)\n  emit('blur', e)\n}\n\nfunction handleFocus(e: FocusEvent) {\n  emit('focus', e)\n}\n\nfunction handleEnterKey() {\n  if (meta.valid && inputValue.value) {\n    emit('submit')\n  }\n}\n\ndefineExpose({\n  focus: () => {\n    const el = document.getElementById(id)\n    el?.focus()\n  },\n  blur: () => {\n    const el = document.getElementById(id)\n    el?.blur()\n  },\n  validate\n})\n</script>\n\n"],"names":["props","__props","emit","__emit","id","generateId","touched","ref","inputValue","errorMessage","veeHandleBlur","handleChange","meta","validate","setTouched","useField","toRef","watch","newValue","v","nextTick","oldValue","handleInput","handleBlur","handleFocus","handleEnterKey","__expose","_openBlock","_createElementBlock","_hoisted_1","_createVNode","FormFieldWrapper","_unref","name","label","tertiaryLabel","successMessage","showErrors","showValidCheck","colorfulValidation","disabled","disabledMessage","_withCtx","inputClasses","_createElementVNode","placeholder","autoComplete","_renderSlot","_ctx"],"mappings":"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"}
+{"version":3,"file":"EmailInput.vue_vue_type_script_setup_true_lang-BicPMIop.js","sources":["../src/components/inputs/EmailInput.vue"],"sourcesContent":["<!--\n  @component EmailInput\n  @description Specialized email input with validation and optional verification.\n  \n  A text input specifically designed for email addresses with built-in\n  email validation. Extends the base text input with email-specific\n  features like type=\"email\" and email validation rules.\n  \n  @props\n  - name (string, required): Field name for form binding\n  - value (string, optional): Email value (use v-model:value)\n  - label (string, optional): Display label\n  - placeholder (string, optional): Placeholder text\n  - disabled (boolean, optional): Disabled state\n  - rules (Schema, optional): Custom validation rules\n  - colorfulValidation (boolean, optional): Color-coded validation states\n  - showValidCheck (boolean, optional): Show check icon when valid\n  - showErrors (boolean, optional): Force show errors\n  - autoComplete (string, optional): Autocomplete attribute value\n  \n  @emits\n  - update:value: Emitted when value changes\n  - update:validity: Emitted when validation state changes\n  - focus: Emitted on focus\n  - blur: Emitted on blur\n  - submit: Emitted when Enter is pressed with valid email\n  \n  @example\n  <EmailInput\n    name=\"email\"\n    label=\"Email Address\"\n    v-model:value=\"form.email\"\n    placeholder=\"you@example.com\"\n  />\n-->\n<template>\n  <div class=\"sl-w-full\">\n    <FormFieldWrapper\n      :id=\"id\"\n      :name=\"name\"\n      :label=\"label\"\n      :tertiary-label=\"tertiaryLabel\"\n      :error-message=\"errorMessage\"\n      :success-message=\"successMessage\"\n      :is-valid=\"meta.valid\"\n      :is-touched=\"meta.touched\"\n      :show-errors=\"showErrors\"\n      :show-valid-check=\"showValidCheck\"\n      :colorful-validation=\"colorfulValidation\"\n      :disabled=\"disabled\"\n      :disabled-message=\"disabledMessage\"\n    >\n      <template #default=\"{ inputClasses }\">\n        <input\n          :name=\"name\"\n          :id=\"id\"\n          type=\"email\"\n          :value=\"inputValue\"\n          :placeholder=\"placeholder\"\n          :autocomplete=\"autoComplete\"\n          :disabled=\"disabled\"\n          class=\"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\"\n          :class=\"[\n            inputClasses,\n            'sl-py-1.5 sl-pl-2',\n            { 'sl-text-gray-400': disabled },\n            { 'sl-pr-10': showValidCheck },\n          ]\"\n          @input=\"handleInput\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n          @keydown.enter.prevent=\"handleEnterKey\"\n          enterkeyhint=\"go\"\n          data-testid=\"email-input\"\n        />\n      </template>\n\n      <template #input-right>\n        <slot name=\"input-right\" />\n      </template>\n    </FormFieldWrapper>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, toRef, watch, nextTick } from 'vue'\nimport { useField } from 'vee-validate'\nimport { string as yupString, type AnySchema } from 'yup'\nimport FormFieldWrapper from '../forms/FormFieldWrapper.vue'\nimport { generateId } from '../../utils/id'\n\ninterface Props {\n  name: string\n  value?: string\n  label?: string\n  placeholder?: string\n  disabled?: boolean\n  disabledMessage?: string\n  rules?: AnySchema\n  successMessage?: string\n  tertiaryLabel?: string\n  colorfulValidation?: boolean\n  showValidCheck?: boolean\n  showErrors?: boolean\n  autoComplete?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  value: '',\n  label: 'Email',\n  placeholder: 'you@example.com',\n  disabled: false,\n  disabledMessage: '',\n  rules: () => yupString().email('Invalid email address').required('Email is required'),\n  successMessage: '',\n  tertiaryLabel: '',\n  colorfulValidation: true,\n  showValidCheck: true,\n  showErrors: false,\n  autoComplete: 'email'\n})\n\nconst emit = defineEmits<{\n  'update:value': [value: string]\n  'update:validity': [isValid: boolean]\n  focus: [event: FocusEvent]\n  blur: [event: FocusEvent]\n  submit: []\n}>()\n\nconst id = generateId(`sl-${props.name}`)\nconst touched = ref(false)\n\nconst {\n  value: inputValue,\n  errorMessage,\n  handleBlur: veeHandleBlur,\n  handleChange,\n  meta,\n  validate,\n  setTouched\n} = useField(toRef(props, 'name'), toRef(props, 'rules'), {\n  initialValue: props.value,\n  validateOnValueUpdate: true,\n  validateOnMount: false\n})\n\n// Sync external value changes\nwatch(\n  () => props.value,\n  (newValue) => {\n    if (newValue !== undefined && newValue !== inputValue.value) {\n      inputValue.value = newValue\n    }\n  },\n  { immediate: true }\n)\n\n// Emit validity changes\nwatch(\n  () => meta.valid,\n  (v) => nextTick(() => emit('update:validity', v)),\n  { immediate: true }\n)\n\n// Emit value changes\nwatch(inputValue, (newValue, oldValue) => {\n  if (newValue !== oldValue) {\n    emit('update:value', newValue || '')\n  }\n})\n\nfunction handleInput(e: Event) {\n  const v = (e.target as HTMLInputElement).value\n  handleChange(v)\n  emit('update:value', v)\n}\n\nasync function handleBlur(e: FocusEvent) {\n  if (!touched.value) {\n    touched.value = true\n    setTouched(true)\n  }\n  await validate()\n  veeHandleBlur(e)\n  emit('blur', e)\n}\n\nfunction handleFocus(e: FocusEvent) {\n  emit('focus', e)\n}\n\nfunction handleEnterKey() {\n  if (meta.valid && inputValue.value) {\n    emit('submit')\n  }\n}\n\ndefineExpose({\n  focus: () => {\n    const el = document.getElementById(id)\n    el?.focus()\n  },\n  blur: () => {\n    const el = document.getElementById(id)\n    el?.blur()\n  },\n  validate\n})\n</script>\n\n"],"names":["props","__props","emit","__emit","id","generateId","touched","ref","inputValue","errorMessage","veeHandleBlur","handleChange","meta","validate","setTouched","useField","toRef","watch","newValue","v","nextTick","oldValue","handleInput","handleBlur","handleFocus","handleEnterKey","__expose","_openBlock","_createElementBlock","_hoisted_1","_createVNode","FormFieldWrapper","_unref","_withCtx","inputClasses","_createElementVNode","_renderSlot","_ctx"],"mappings":"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"}

package/dist/{EmptyInput.vue_vue_type_script_setup_true_lang-BDxgc5Bs.js → EmptyInput.vue_vue_type_script_setup_true_lang-FWDCFF2c.js}

@@ -1,27 +1,27 @@
-import { defineComponent as o, createElementBlock as t, openBlock as s, createCommentVNode as l, createElementVNode as a, toDisplayString as r, createBlock as n, resolveDynamicComponent as d } from "vue";
+import { defineComponent as a, createElementBlock as s, openBlock as t, createCommentVNode as l, createElementVNode as n, toDisplayString as r, createBlock as o, resolveDynamicComponent as d } from "vue";
 const i = {
   class: "sl-px-4 sl-py-5 sm:sl-p-6 sl-bg-gray-50 dark:sl-bg-slate-800 sl-rounded-lg sl-border sl-border-dashed sl-border-gray-300 dark:sl-border-slate-600",
   "data-testid": "empty-input"
 }, c = {
   key: 0,
   class: "sl-text-base sl-font-semibold sl-leading-6 sl-text-gray-800 dark:sl-text-gray-200"
-}, p = { class: "sl-mt-2 sl-max-w-xl sl-text-sm sl-text-gray-500 dark:sl-text-gray-300 sl-flex sl-items-center" }, m = { key: 1 }, u = /* @__PURE__ */ o({
+}, m = { class: "sl-mt-2 sl-max-w-xl sl-text-sm sl-text-gray-500 dark:sl-text-gray-300 sl-flex sl-items-center" }, y = { key: 1 }, u = /* @__PURE__ */ a({
   __name: "EmptyInput",
   props: {
     title: { default: "" },
     description: { default: "" },
     icon: {}
   },
-  setup(y) {
-    return (e, g) => (s(), t("div", i, [
-      e.title ? (s(), t("h3", c, r(e.title), 1)) : l("", !0),
-      a("div", p, [
-        e.icon ? (s(), n(d(e.icon), {
+  setup(e) {
+    return (x, g) => (t(), s("div", i, [
+      e.title ? (t(), s("h3", c, r(e.title), 1)) : l("", !0),
+      n("div", m, [
+        e.icon ? (t(), o(d(e.icon), {
           key: 0,
           class: "sl-mr-2 sl-h-6 sl-w-6 sl-text-gray-400 dark:sl-text-gray-300 sl-flex-shrink-0",
           "aria-hidden": "true"
         })) : l("", !0),
-        e.description ? (s(), t("p", m, r(e.description), 1)) : l("", !0)
+        e.description ? (t(), s("p", y, r(e.description), 1)) : l("", !0)
       ])
     ]));
   }
@@ -29,4 +29,4 @@ const i = {
 export {
   u as _
 };
-//# sourceMappingURL=EmptyInput.vue_vue_type_script_setup_true_lang-BDxgc5Bs.js.map
+//# sourceMappingURL=EmptyInput.vue_vue_type_script_setup_true_lang-FWDCFF2c.js.map

package/dist/{EmptyInput.vue_vue_type_script_setup_true_lang-BDxgc5Bs.js.map → EmptyInput.vue_vue_type_script_setup_true_lang-FWDCFF2c.js.map}

@@ -1 +1 @@
-{"version":3,"file":"EmptyInput.vue_vue_type_script_setup_true_lang-BDxgc5Bs.js","sources":["../src/components/inputs/EmptyInput.vue"],"sourcesContent":["<!--\n  @component EmptyInput\n  @description Placeholder component for empty/unavailable form fields.\n  \n  Displays a styled placeholder with optional title, description, and icon\n  for form fields that are not yet available or have been removed.\n  Useful for showing contextual information in form layouts.\n  \n  @props\n  - title (string, optional): Main title text\n  - description (string, optional): Descriptive text\n  - icon (Component, optional): Heroicon or custom icon component\n  \n  @example\n  <EmptyInput \n    title=\"Coming Soon\" \n    description=\"This feature is not yet available.\"\n    :icon=\"ClockIcon\"\n  />\n-->\n<template>\n  <div \n    class=\"sl-px-4 sl-py-5 sm:sl-p-6 sl-bg-gray-50 dark:sl-bg-slate-800 sl-rounded-lg sl-border sl-border-dashed sl-border-gray-300 dark:sl-border-slate-600\"\n    data-testid=\"empty-input\"\n  >\n    <h3 \n      v-if=\"title\" \n      class=\"sl-text-base sl-font-semibold sl-leading-6 sl-text-gray-800 dark:sl-text-gray-200\"\n    >\n      {{ title }}\n    </h3>\n    <div class=\"sl-mt-2 sl-max-w-xl sl-text-sm sl-text-gray-500 dark:sl-text-gray-300 sl-flex sl-items-center\">\n      <component \n        v-if=\"icon\" \n        :is=\"icon\" \n        class=\"sl-mr-2 sl-h-6 sl-w-6 sl-text-gray-400 dark:sl-text-gray-300 sl-flex-shrink-0\" \n        aria-hidden=\"true\"\n      />\n      <p v-if=\"description\">{{ description }}</p>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport type { FunctionalComponent, HTMLAttributes, VNodeProps } from 'vue'\n\ninterface Props {\n  title?: string\n  description?: string\n  icon?: FunctionalComponent<HTMLAttributes & VNodeProps>\n}\n\nwithDefaults(defineProps<Props>(), {\n  title: '',\n  description: ''\n})\n</script>\n\n"],"names":["_openBlock","_createElementBlock","_hoisted_1","title","_hoisted_2","_toDisplayString","_createElementVNode","_hoisted_3","icon","_createBlock","_resolveDynamicComponent","description"],"mappings":";;;;;;;;;;;;;;;sBAqBEA,EAAA,GAAAC,EAmBM,OAnBNC,GAmBM;AAAA,MAdIC,EAAAA,cADRF,EAKK,MALLG,GAKKC,EADAF,EAAAA,KAAK,GAAA,CAAA;MAEVG,EAQM,OARNC,GAQM;AAAA,QANIC,EAAAA,QADRR,EAAA,GAAAS,EAKEC,EAHKF,EAAAA,IAAI,GAAA;AAAA;UACT,OAAM;AAAA,UACN,eAAY;AAAA,QAAA;QAELG,EAAAA,eAATX,EAAA,GAAAC,EAA2C,UAAlBU,EAAAA,WAAW,GAAA,CAAA;;;;;"}
+{"version":3,"file":"EmptyInput.vue_vue_type_script_setup_true_lang-FWDCFF2c.js","sources":["../src/components/inputs/EmptyInput.vue"],"sourcesContent":["<!--\n  @component EmptyInput\n  @description Placeholder component for empty/unavailable form fields.\n  \n  Displays a styled placeholder with optional title, description, and icon\n  for form fields that are not yet available or have been removed.\n  Useful for showing contextual information in form layouts.\n  \n  @props\n  - title (string, optional): Main title text\n  - description (string, optional): Descriptive text\n  - icon (Component, optional): Heroicon or custom icon component\n  \n  @example\n  <EmptyInput \n    title=\"Coming Soon\" \n    description=\"This feature is not yet available.\"\n    :icon=\"ClockIcon\"\n  />\n-->\n<template>\n  <div \n    class=\"sl-px-4 sl-py-5 sm:sl-p-6 sl-bg-gray-50 dark:sl-bg-slate-800 sl-rounded-lg sl-border sl-border-dashed sl-border-gray-300 dark:sl-border-slate-600\"\n    data-testid=\"empty-input\"\n  >\n    <h3 \n      v-if=\"title\" \n      class=\"sl-text-base sl-font-semibold sl-leading-6 sl-text-gray-800 dark:sl-text-gray-200\"\n    >\n      {{ title }}\n    </h3>\n    <div class=\"sl-mt-2 sl-max-w-xl sl-text-sm sl-text-gray-500 dark:sl-text-gray-300 sl-flex sl-items-center\">\n      <component \n        v-if=\"icon\" \n        :is=\"icon\" \n        class=\"sl-mr-2 sl-h-6 sl-w-6 sl-text-gray-400 dark:sl-text-gray-300 sl-flex-shrink-0\" \n        aria-hidden=\"true\"\n      />\n      <p v-if=\"description\">{{ description }}</p>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport type { FunctionalComponent, HTMLAttributes, VNodeProps } from 'vue'\n\ninterface Props {\n  title?: string\n  description?: string\n  icon?: FunctionalComponent<HTMLAttributes & VNodeProps>\n}\n\nwithDefaults(defineProps<Props>(), {\n  title: '',\n  description: ''\n})\n</script>\n\n"],"names":["_openBlock","_createElementBlock","_hoisted_1","__props","_hoisted_2","_toDisplayString","_createElementVNode","_hoisted_3","_createBlock","_resolveDynamicComponent"],"mappings":";;;;;;;;;;;;;;;sBAqBEA,EAAA,GAAAC,EAmBM,OAnBNC,GAmBM;AAAA,MAdIC,EAAA,cADRF,EAKK,MALLG,GAKKC,EADAF,EAAA,KAAK,GAAA,CAAA;MAEVG,EAQM,OARNC,GAQM;AAAA,QANIJ,EAAA,QADRH,EAAA,GAAAQ,EAKEC,EAHKN,EAAA,IAAI,GAAA;AAAA;UACT,OAAM;AAAA,UACN,eAAY;AAAA,QAAA;QAELA,EAAA,eAATH,EAAA,GAAAC,EAA2C,UAAlBE,EAAA,WAAW,GAAA,CAAA;;;;;"}

package/dist/{EmptyState.vue_vue_type_script_setup_true_lang-B_XAq5Sr.js → EmptyState.vue_vue_type_script_setup_true_lang-Dxy-cLPT.js}

@@ -1,8 +1,8 @@
-import { defineComponent as d, createElementBlock as t, openBlock as e, normalizeClass as l, createCommentVNode as n, createElementVNode as a, renderSlot as i, createBlock as p, resolveDynamicComponent as u, toDisplayString as o } from "vue";
-const f = {
+import { defineComponent as u, createElementBlock as l, openBlock as s, normalizeClass as o, createCommentVNode as n, createElementVNode as a, renderSlot as i, createBlock as f, resolveDynamicComponent as h, toDisplayString as c } from "vue";
+const k = {
   key: 0,
   class: "sl-mx-auto sl-mb-4"
-}, h = ["href"], b = /* @__PURE__ */ d({
+}, x = ["href"], b = /* @__PURE__ */ u({
   __name: "EmptyState",
   props: {
     title: {},
@@ -13,56 +13,56 @@ const f = {
     compact: { type: Boolean, default: !1 }
   },
   emits: ["action"],
-  setup(k, { emit: c }) {
-    const r = c, m = () => {
+  setup(t, { emit: m }) {
+    const r = m, d = () => {
       r("action");
     };
-    return (s, y) => (e(), t("div", {
-      class: l(["sl-text-center", s.compact ? "sl-py-6" : "sl-py-12"])
+    return (e, y) => (s(), l("div", {
+      class: o(["sl-text-center", t.compact ? "sl-py-6" : "sl-py-12"])
     }, [
-      s.icon || s.$slots.icon ? (e(), t("div", f, [
-        i(s.$slots, "icon", {}, () => [
-          (e(), p(u(s.icon), {
-            class: l([
+      t.icon || e.$slots.icon ? (s(), l("div", k, [
+        i(e.$slots, "icon", {}, () => [
+          (s(), f(h(t.icon), {
+            class: o([
               "sl-mx-auto sl-text-gray-400 dark:sl-text-slate-500",
-              s.compact ? "sl-h-10 sl-w-10" : "sl-h-12 sl-w-12"
+              t.compact ? "sl-h-10 sl-w-10" : "sl-h-12 sl-w-12"
             ]),
             "aria-hidden": "true"
           }, null, 8, ["class"]))
         ])
       ])) : n("", !0),
       a("h3", {
-        class: l([
+        class: o([
           "sl-font-medium sl-text-gray-900 dark:sl-text-white",
-          s.compact ? "sl-text-sm" : "sl-text-lg"
+          t.compact ? "sl-text-sm" : "sl-text-lg"
         ])
-      }, o(s.title), 3),
-      s.description || s.$slots.description ? (e(), t("div", {
+      }, c(t.title), 3),
+      t.description || e.$slots.description ? (s(), l("div", {
         key: 1,
-        class: l([
+        class: o([
           "sl-text-gray-500 dark:sl-text-slate-400",
-          s.compact ? "sl-mt-1 sl-text-sm" : "sl-mt-2 sl-text-base"
+          t.compact ? "sl-mt-1 sl-text-sm" : "sl-mt-2 sl-text-base"
         ])
       }, [
-        i(s.$slots, "description", {}, () => [
-          a("p", null, o(s.description), 1)
+        i(e.$slots, "description", {}, () => [
+          a("p", null, c(t.description), 1)
         ])
       ], 2)) : n("", !0),
-      s.actionLabel || s.$slots.action ? (e(), t("div", {
+      t.actionLabel || e.$slots.action ? (s(), l("div", {
         key: 2,
-        class: l(s.compact ? "sl-mt-4" : "sl-mt-6")
+        class: o(t.compact ? "sl-mt-4" : "sl-mt-6")
       }, [
-        i(s.$slots, "action", {}, () => [
-          s.actionHref ? (e(), t("a", {
+        i(e.$slots, "action", {}, () => [
+          t.actionHref ? (s(), l("a", {
             key: 0,
-            href: s.actionHref,
+            href: t.actionHref,
             class: "sl-inline-flex sl-items-center sl-rounded-md sl-bg-stachelock-600 sl-px-4 sl-py-2 sl-text-sm sl-font-medium 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 sl-transition-colors"
-          }, o(s.actionLabel), 9, h)) : (e(), t("button", {
+          }, c(t.actionLabel), 9, x)) : (s(), l("button", {
             key: 1,
             type: "button",
-            onClick: m,
+            onClick: d,
             class: "sl-inline-flex sl-items-center sl-rounded-md sl-bg-stachelock-600 sl-px-4 sl-py-2 sl-text-sm sl-font-medium 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 sl-transition-colors"
-          }, o(s.actionLabel), 1))
+          }, c(t.actionLabel), 1))
         ])
       ], 2)) : n("", !0)
     ], 2));
@@ -71,4 +71,4 @@ const f = {
 export {
   b as _
 };
-//# sourceMappingURL=EmptyState.vue_vue_type_script_setup_true_lang-B_XAq5Sr.js.map
+//# sourceMappingURL=EmptyState.vue_vue_type_script_setup_true_lang-Dxy-cLPT.js.map

package/dist/{EmptyState.vue_vue_type_script_setup_true_lang-B_XAq5Sr.js.map → EmptyState.vue_vue_type_script_setup_true_lang-Dxy-cLPT.js.map}

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.vue_vue_type_script_setup_true_lang-B_XAq5Sr.js","sources":["../src/components/empty-state/EmptyState.vue"],"sourcesContent":["<!--\n  @component EmptyState\n  @description Generic empty state display with customizable content.\n  \n  A flexible empty state component with icon, title, description,\n  and action button support.\n  \n  @props\n  - title (string, required): Main heading text\n  - description (string, optional): Description text\n  - icon (Component, optional): Icon component to display\n  - actionLabel (string, optional): Action button label\n  - actionHref (string, optional): Action button link\n  - compact (boolean, optional): Use compact layout\n  \n  @emits\n  - action: Emitted when action button is clicked\n  \n  @slots\n  - icon: Custom icon slot\n  - description: Custom description content\n  - action: Custom action content\n  \n  @example\n  <EmptyState\n    title=\"No items found\"\n    description=\"Get started by creating a new item.\"\n    action-label=\"Create Item\"\n    @action=\"handleCreate\"\n  >\n    <template #icon>\n      <PlusIcon class=\"sl-h-12 sl-w-12\" />\n    </template>\n  </EmptyState>\n-->\n<template>\n  <div \n    class=\"sl-text-center\"\n    :class=\"compact ? 'sl-py-6' : 'sl-py-12'\"\n  >\n    <!-- Icon -->\n    <div v-if=\"icon || $slots.icon\" class=\"sl-mx-auto sl-mb-4\">\n      <slot name=\"icon\">\n        <component \n          :is=\"icon\" \n          :class=\"[\n            'sl-mx-auto sl-text-gray-400 dark:sl-text-slate-500',\n            compact ? 'sl-h-10 sl-w-10' : 'sl-h-12 sl-w-12'\n          ]\"\n          aria-hidden=\"true\" \n        />\n      </slot>\n    </div>\n\n    <!-- Title -->\n    <h3 \n      :class=\"[\n        'sl-font-medium sl-text-gray-900 dark:sl-text-white',\n        compact ? 'sl-text-sm' : 'sl-text-lg'\n      ]\"\n    >\n      {{ title }}\n    </h3>\n\n    <!-- Description -->\n    <div \n      v-if=\"description || $slots.description\" \n      :class=\"[\n        'sl-text-gray-500 dark:sl-text-slate-400',\n        compact ? 'sl-mt-1 sl-text-sm' : 'sl-mt-2 sl-text-base'\n      ]\"\n    >\n      <slot name=\"description\">\n        <p>{{ description }}</p>\n      </slot>\n    </div>\n\n    <!-- Action -->\n    <div \n      v-if=\"actionLabel || $slots.action\" \n      :class=\"compact ? 'sl-mt-4' : 'sl-mt-6'\"\n    >\n      <slot name=\"action\">\n        <a\n          v-if=\"actionHref\"\n          :href=\"actionHref\"\n          class=\"sl-inline-flex sl-items-center sl-rounded-md sl-bg-stachelock-600 sl-px-4 sl-py-2 sl-text-sm sl-font-medium 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 sl-transition-colors\"\n        >\n          {{ actionLabel }}\n        </a>\n        <button\n          v-else\n          type=\"button\"\n          @click=\"handleAction\"\n          class=\"sl-inline-flex sl-items-center sl-rounded-md sl-bg-stachelock-600 sl-px-4 sl-py-2 sl-text-sm sl-font-medium 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 sl-transition-colors\"\n        >\n          {{ actionLabel }}\n        </button>\n      </slot>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport type { Component } from 'vue';\n\ninterface Props {\n  title: string;\n  description?: string;\n  icon?: Component;\n  actionLabel?: string;\n  actionHref?: string;\n  compact?: boolean;\n}\n\nwithDefaults(defineProps<Props>(), {\n  compact: false,\n});\n\nconst emit = defineEmits<{\n  action: [];\n}>();\n\nconst handleAction = (): void => {\n  emit('action');\n};\n</script>\n\n"],"names":["emit","__emit","handleAction","_createElementBlock","_normalizeClass","compact","icon","$slots","_openBlock","_hoisted_1","_renderSlot","_ctx","_createBlock","_resolveDynamicComponent","_createElementVNode","title","description","actionLabel","actionHref","_hoisted_2"],"mappings":";;;;;;;;;;;;;;;;AAuHA,UAAMA,IAAOC,GAIPC,IAAe,MAAY;AAC/B,MAAAF,EAAK,QAAQ;AAAA,IACf;2BAzFEG,EAgEM,OAAA;AAAA,MA/DJ,OAAKC,EAAA,CAAC,kBACEC,EAAAA,UAAO,YAAA,UAAA,CAAA;AAAA,IAAA;MAGJC,EAAAA,QAAQC,EAAAA,OAAO,QAA1BC,KAAAL,EAWM,OAXNM,GAWM;AAAA,QAVJC,EASOC,sBATP,MASO;AAAA,WARLH,KAAAI,EAOEC,EANKP,EAAAA,IAAI,GAAA;AAAA,YACR,OAAKF,EAAA;AAAA;cAAkFC,EAAAA,UAAO,oBAAA;AAAA,YAAA;YAI/F,eAAY;AAAA,UAAA;;;MAMlBS,EAOK,MAAA;AAAA,QANF,OAAKV,EAAA;AAAA;UAA0EC,EAAAA,UAAO,eAAA;AAAA,QAAA;WAKpFU,EAAAA,KAAK,GAAA,CAAA;AAAA,MAKFC,EAAAA,eAAeT,EAAAA,OAAO,oBAD9BJ,EAUM,OAAA;AAAA;QARH,OAAKC,EAAA;AAAA;UAA+DC,EAAAA,UAAO,uBAAA;AAAA,QAAA;;QAK5EK,EAEOC,6BAFP,MAEO;AAAA,UADLG,EAAwB,aAAlBE,EAAAA,WAAW,GAAA,CAAA;AAAA,QAAA;;MAMbC,EAAAA,eAAeV,EAAAA,OAAO,eAD9BJ,EAqBM,OAAA;AAAA;QAnBH,SAAOE,EAAAA,UAAO,YAAA,SAAA;AAAA,MAAA;QAEfK,EAgBOC,wBAhBP,MAgBO;AAAA,UAdGO,EAAAA,mBADRf,EAMI,KAAA;AAAA;YAJD,MAAMe,EAAAA;AAAAA,YACP,OAAM;AAAA,UAAA,KAEHD,EAAAA,WAAW,GAAA,GAAAE,CAAA,WAEhBhB,EAOS,UAAA;AAAA;YALP,MAAK;AAAA,YACJ,SAAOD;AAAA,YACR,OAAM;AAAA,UAAA,KAEHe,EAAAA,WAAW,GAAA,CAAA;AAAA,QAAA;;;;;"}
+{"version":3,"file":"EmptyState.vue_vue_type_script_setup_true_lang-Dxy-cLPT.js","sources":["../src/components/empty-state/EmptyState.vue"],"sourcesContent":["<!--\n  @component EmptyState\n  @description Generic empty state display with customizable content.\n  \n  A flexible empty state component with icon, title, description,\n  and action button support.\n  \n  @props\n  - title (string, required): Main heading text\n  - description (string, optional): Description text\n  - icon (Component, optional): Icon component to display\n  - actionLabel (string, optional): Action button label\n  - actionHref (string, optional): Action button link\n  - compact (boolean, optional): Use compact layout\n  \n  @emits\n  - action: Emitted when action button is clicked\n  \n  @slots\n  - icon: Custom icon slot\n  - description: Custom description content\n  - action: Custom action content\n  \n  @example\n  <EmptyState\n    title=\"No items found\"\n    description=\"Get started by creating a new item.\"\n    action-label=\"Create Item\"\n    @action=\"handleCreate\"\n  >\n    <template #icon>\n      <PlusIcon class=\"sl-h-12 sl-w-12\" />\n    </template>\n  </EmptyState>\n-->\n<template>\n  <div \n    class=\"sl-text-center\"\n    :class=\"compact ? 'sl-py-6' : 'sl-py-12'\"\n  >\n    <!-- Icon -->\n    <div v-if=\"icon || $slots.icon\" class=\"sl-mx-auto sl-mb-4\">\n      <slot name=\"icon\">\n        <component \n          :is=\"icon\" \n          :class=\"[\n            'sl-mx-auto sl-text-gray-400 dark:sl-text-slate-500',\n            compact ? 'sl-h-10 sl-w-10' : 'sl-h-12 sl-w-12'\n          ]\"\n          aria-hidden=\"true\" \n        />\n      </slot>\n    </div>\n\n    <!-- Title -->\n    <h3 \n      :class=\"[\n        'sl-font-medium sl-text-gray-900 dark:sl-text-white',\n        compact ? 'sl-text-sm' : 'sl-text-lg'\n      ]\"\n    >\n      {{ title }}\n    </h3>\n\n    <!-- Description -->\n    <div \n      v-if=\"description || $slots.description\" \n      :class=\"[\n        'sl-text-gray-500 dark:sl-text-slate-400',\n        compact ? 'sl-mt-1 sl-text-sm' : 'sl-mt-2 sl-text-base'\n      ]\"\n    >\n      <slot name=\"description\">\n        <p>{{ description }}</p>\n      </slot>\n    </div>\n\n    <!-- Action -->\n    <div \n      v-if=\"actionLabel || $slots.action\" \n      :class=\"compact ? 'sl-mt-4' : 'sl-mt-6'\"\n    >\n      <slot name=\"action\">\n        <a\n          v-if=\"actionHref\"\n          :href=\"actionHref\"\n          class=\"sl-inline-flex sl-items-center sl-rounded-md sl-bg-stachelock-600 sl-px-4 sl-py-2 sl-text-sm sl-font-medium 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 sl-transition-colors\"\n        >\n          {{ actionLabel }}\n        </a>\n        <button\n          v-else\n          type=\"button\"\n          @click=\"handleAction\"\n          class=\"sl-inline-flex sl-items-center sl-rounded-md sl-bg-stachelock-600 sl-px-4 sl-py-2 sl-text-sm sl-font-medium 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 sl-transition-colors\"\n        >\n          {{ actionLabel }}\n        </button>\n      </slot>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport type { Component } from 'vue';\n\ninterface Props {\n  title: string;\n  description?: string;\n  icon?: Component;\n  actionLabel?: string;\n  actionHref?: string;\n  compact?: boolean;\n}\n\nwithDefaults(defineProps<Props>(), {\n  compact: false,\n});\n\nconst emit = defineEmits<{\n  action: [];\n}>();\n\nconst handleAction = (): void => {\n  emit('action');\n};\n</script>\n\n"],"names":["emit","__emit","handleAction","_createElementBlock","_normalizeClass","__props","$slots","_openBlock","_hoisted_1","_renderSlot","_ctx","_createBlock","_resolveDynamicComponent","_createElementVNode","_hoisted_2"],"mappings":";;;;;;;;;;;;;;;;AAuHA,UAAMA,IAAOC,GAIPC,IAAe,MAAY;AAC/B,MAAAF,EAAK,QAAQ;AAAA,IACf;2BAzFEG,EAgEM,OAAA;AAAA,MA/DJ,OAAKC,EAAA,CAAC,kBACEC,EAAA,UAAO,YAAA,UAAA,CAAA;AAAA,IAAA;MAGJA,EAAA,QAAQC,EAAAA,OAAO,QAA1BC,KAAAJ,EAWM,OAXNK,GAWM;AAAA,QAVJC,EASOC,sBATP,MASO;AAAA,WARLH,KAAAI,EAOEC,EANKP,EAAA,IAAI,GAAA;AAAA,YACR,OAAKD,EAAA;AAAA;cAAkFC,EAAA,UAAO,oBAAA;AAAA,YAAA;YAI/F,eAAY;AAAA,UAAA;;;MAMlBQ,EAOK,MAAA;AAAA,QANF,OAAKT,EAAA;AAAA;UAA0EC,EAAA,UAAO,eAAA;AAAA,QAAA;WAKpFA,EAAA,KAAK,GAAA,CAAA;AAAA,MAKFA,EAAA,eAAeC,EAAAA,OAAO,oBAD9BH,EAUM,OAAA;AAAA;QARH,OAAKC,EAAA;AAAA;UAA+DC,EAAA,UAAO,uBAAA;AAAA,QAAA;;QAK5EI,EAEOC,6BAFP,MAEO;AAAA,UADLG,EAAwB,aAAlBR,EAAA,WAAW,GAAA,CAAA;AAAA,QAAA;;MAMbA,EAAA,eAAeC,EAAAA,OAAO,eAD9BH,EAqBM,OAAA;AAAA;QAnBH,SAAOE,EAAA,UAAO,YAAA,SAAA;AAAA,MAAA;QAEfI,EAgBOC,wBAhBP,MAgBO;AAAA,UAdGL,EAAA,mBADRF,EAMI,KAAA;AAAA;YAJD,MAAME,EAAA;AAAA,YACP,OAAM;AAAA,UAAA,KAEHA,EAAA,WAAW,GAAA,GAAAS,CAAA,WAEhBX,EAOS,UAAA;AAAA;YALP,MAAK;AAAA,YACJ,SAAOD;AAAA,YACR,OAAM;AAAA,UAAA,KAEHG,EAAA,WAAW,GAAA,CAAA;AAAA,QAAA;;;;;"}

package/dist/{EventsList.vue_vue_type_script_setup_true_lang-D3q9wJ4E.js → EventsList.vue_vue_type_script_setup_true_lang-MhuVi5u8.js}

@@ -1,7 +1,7 @@
-import { createElementBlock as n, openBlock as t, createElementVNode as r, defineComponent as A, computed as v, createCommentVNode as u, createBlock as h, Fragment as a, createTextVNode as m, withCtx as D, renderList as g, toDisplayString as B, createVNode as E, unref as N } from "vue";
+import { createElementBlock as n, openBlock as t, createElementVNode as r, defineComponent as A, computed as h, createCommentVNode as u, createBlock as g, Fragment as a, createTextVNode as m, withCtx as D, renderList as y, toDisplayString as B, createVNode as E, unref as N } from "vue";
 import V from "./components/Button.js";
-import { _ as f } from "./EventCard.vue_vue_type_script_setup_true_lang-j1mtKShZ.js";
-function C(y, p) {
+import { _ as x } from "./EventCard.vue_vue_type_script_setup_true_lang-j1mtKShZ.js";
+function C(c, p) {
   return t(), n("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 20 20",
@@ -26,20 +26,20 @@ const T = { class: "sl-relative" }, M = { class: "sl-flex sl-justify-between sl-
     showAllButton: { type: Boolean }
   },
   emits: ["show:all"],
-  setup(y, { emit: p }) {
-    const o = y, x = p, c = /* @__PURE__ */ new Date(), w = /* @__PURE__ */ new Date();
-    w.setMonth(c.getMonth() + 3);
-    const i = v(() => !o.events || !Array.isArray(o.events) ? [] : o.events.filter((s) => {
-      const e = new Date(s.datetime);
-      return e >= c && e <= w;
-    }).sort((s, e) => new Date(s.datetime).getTime() - new Date(e.datetime).getTime())), b = v(() => !o.events || !Array.isArray(o.events) ? [] : o.events.filter((s) => new Date(s.datetime) < c).sort((s, e) => new Date(e.datetime).getTime() - new Date(s.datetime).getTime())), d = v(() => {
-      const s = {};
+  setup(c, { emit: p }) {
+    const o = c, _ = p, v = /* @__PURE__ */ new Date(), w = /* @__PURE__ */ new Date();
+    w.setMonth(v.getMonth() + 3);
+    const i = h(() => !o.events || !Array.isArray(o.events) ? [] : o.events.filter((l) => {
+      const e = new Date(l.datetime);
+      return e >= v && e <= w;
+    }).sort((l, e) => new Date(l.datetime).getTime() - new Date(e.datetime).getTime())), b = h(() => !o.events || !Array.isArray(o.events) ? [] : o.events.filter((l) => new Date(l.datetime) < v).sort((l, e) => new Date(e.datetime).getTime() - new Date(l.datetime).getTime())), d = h(() => {
+      const l = {};
       return b.value.forEach((e) => {
-        const l = new Date(e.datetime).getFullYear().toString();
-        s[l] || (s[l] = []), s[l].push(e);
-      }), Object.entries(s).sort(([e], [l]) => Number(l) - Number(e)).map(([e, l]) => ({ year: e, events: l }));
-    }), k = () => x("show:all");
-    return (s, e) => (t(), n("div", T, [
+        const s = new Date(e.datetime).getFullYear().toString();
+        l[s] || (l[s] = []), l[s].push(e);
+      }), Object.entries(l).sort(([e], [s]) => Number(s) - Number(e)).map(([e, s]) => ({ year: e, events: s }));
+    }), k = () => _("show:all");
+    return (l, e) => (t(), n("div", T, [
       r("div", M, [
         r("h2", S, [
           i.value.length ? (t(), n(a, { key: 0 }, [
@@ -50,38 +50,37 @@ const T = { class: "sl-relative" }, M = { class: "sl-flex sl-justify-between sl-
             m("Events")
           ], 64))
         ]),
-        s.showAllButton ? (t(), h(V, {
+        c.showAllButton ? (t(), g(V, {
           key: 0,
           "center-label": "",
           size: "xs",
           onButtonClick: k
         }, {
-          default: D(() => e[0] || (e[0] = [
+          default: D(() => [...e[0] || (e[0] = [
             m(" Show all ", -1)
-          ])),
-          _: 1,
-          __: [0]
+          ])]),
+          _: 1
         })) : u("", !0)
       ]),
       i.value.length ? (t(), n("div", F, [
         r("ol", H, [
-          (t(!0), n(a, null, g(i.value, (l) => (t(), h(f, {
-            key: l.id,
-            event: l
+          (t(!0), n(a, null, y(i.value, (s) => (t(), g(x, {
+            key: s.id,
+            event: s
           }, null, 8, ["event"]))), 128))
         ])
       ])) : u("", !0),
       d.value.length ? (t(), n("div", j, [
-        (t(!0), n(a, null, g(d.value, (l) => (t(), n("div", {
-          key: l.year,
+        (t(!0), n(a, null, y(d.value, (s) => (t(), n("div", {
+          key: s.year,
           class: "sl-mb-8"
         }, [
-          r("h2", L, B(l.year), 1),
+          r("h2", L, B(s.year), 1),
           e[1] || (e[1] = r("hr", { class: "sl-border-gray-200 sl-mb-4" }, null, -1)),
           r("ol", P, [
-            (t(!0), n(a, null, g(l.events, (_) => (t(), h(f, {
-              key: _.id,
-              event: _
+            (t(!0), n(a, null, y(s.events, (f) => (t(), g(x, {
+              key: f.id,
+              event: f
             }, null, 8, ["event"]))), 128))
           ])
         ]))), 128))
@@ -100,4 +99,4 @@ const T = { class: "sl-relative" }, M = { class: "sl-flex sl-justify-between sl-
 export {
   O as _
 };
-//# sourceMappingURL=EventsList.vue_vue_type_script_setup_true_lang-D3q9wJ4E.js.map
+//# sourceMappingURL=EventsList.vue_vue_type_script_setup_true_lang-MhuVi5u8.js.map

package/dist/{EventsList.vue_vue_type_script_setup_true_lang-D3q9wJ4E.js.map → EventsList.vue_vue_type_script_setup_true_lang-MhuVi5u8.js.map}

@@ -1 +1 @@
-{"version":3,"file":"EventsList.vue_vue_type_script_setup_true_lang-D3q9wJ4E.js","sources":["../node_modules/@heroicons/vue/20/solid/esm/CalendarIcon.js","../src/components/calendars/EventsList.vue"],"sourcesContent":["import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    viewBox: \"0 0 20 20\",\n    fill: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"fill-rule\": \"evenodd\",\n      d: \"M5.75 2a.75.75 0 0 1 .75.75V4h7V2.75a.75.75 0 0 1 1.5 0V4h.25A2.75 2.75 0 0 1 18 6.75v8.5A2.75 2.75 0 0 1 15.25 18H4.75A2.75 2.75 0 0 1 2 15.25v-8.5A2.75 2.75 0 0 1 4.75 4H5V2.75A.75.75 0 0 1 5.75 2Zm-1 5.5c-.69 0-1.25.56-1.25 1.25v6.5c0 .69.56 1.25 1.25 1.25h10.5c.69 0 1.25-.56 1.25-1.25v-6.5c0-.69-.56-1.25-1.25-1.25H4.75Z\",\n      \"clip-rule\": \"evenodd\"\n    })\n  ]))\n}","<template>\n  <div class=\"sl-relative\">\n    <!-- Header -->\n    <div class=\"sl-flex sl-justify-between sl-items-center sl-mb-4\">\n      <h2 class=\"sl-text-lg sl-font-bold\">\n        <template v-if=\"upcomingEvents.length\">Upcoming Events</template>\n        <template v-else-if=\"groupedPastEventsByYear.length\">Past Events</template>\n        <template v-else>Events</template>\n      </h2>\n      <UiButton v-if=\"showAllButton\" center-label size=\"xs\" @button-click=\"handleShowAll\">\n        Show all\n      </UiButton>\n    </div>\n\n    <!-- Upcoming Events -->\n    <div v-if=\"upcomingEvents.length\">\n      <ol class=\"sl-divide-y sl-divide-gray-100 sl-text-sm sl-leading-6 sl-mb-8\">\n        <EventCard v-for=\"event in upcomingEvents\" :key=\"event.id\" :event=\"event\" />\n      </ol>\n    </div>\n\n    <!-- Past Events -->\n    <div v-if=\"groupedPastEventsByYear.length\">\n      <div v-for=\"group in groupedPastEventsByYear\" :key=\"group.year\" class=\"sl-mb-8\">\n        <h2 class=\"sl-text-lg sl-font-bold sl-mb-2\">{{ group.year }}</h2>\n        <hr class=\"sl-border-gray-200 sl-mb-4\" />\n        <ol class=\"sl-divide-y sl-divide-gray-100 sl-text-sm sl-leading-6\">\n          <EventCard v-for=\"event in group.events\" :key=\"event.id\" :event=\"event\" />\n        </ol>\n      </div>\n    </div>\n\n    <!-- No Events Message -->\n    <div v-if=\"!upcomingEvents.length && !groupedPastEventsByYear.length\"\n      class=\"sl-px-6 sl-py-14 sl-text-center sl-text-sm sm:sl-px-14\">\n      <CalendarIcon class=\"sl-mx-auto sl-h-6 sl-w-6 sl-text-gray-400\" aria-hidden=\"true\" />\n      <p class=\"sl-mt-4 sl-font-semibold sl-text-gray-800\">No events</p>\n      <p class=\"sl-mt-2 sl-text-gray-500\">Add events to get started!</p>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { CalendarIcon } from '@heroicons/vue/20/solid';\nimport type { ListEvent } from '@/utils/calendar';\nimport UiButton from '@/components/UiButton.vue';\nimport EventCard from './EventCard.vue';\n\nconst props = defineProps<{ \n  events: ListEvent[]; \n  showAllButton?: boolean;\n}>();\nconst emit = defineEmits(['show:all']);\n\nconst now = new Date();\nconst threeMonthsFromNow = new Date();\nthreeMonthsFromNow.setMonth(now.getMonth() + 3);\n\n// Upcoming events: events occurring between now and three months from now\nconst upcomingEvents = computed(() => {\n  if (!props.events || !Array.isArray(props.events)) return [];\n  return props.events\n    .filter((event) => {\n      const eventDate = new Date(event.datetime);\n      return eventDate >= now && eventDate <= threeMonthsFromNow;\n    })\n    .sort((a, b) => new Date(a.datetime).getTime() - new Date(b.datetime).getTime());\n});\n\n// Past events: events that occurred before now\nconst pastEvents = computed(() => {\n  if (!props.events || !Array.isArray(props.events)) return [];\n  return props.events\n    .filter((event) => new Date(event.datetime) < now)\n    .sort((a, b) => new Date(b.datetime).getTime() - new Date(a.datetime).getTime());\n});\n\n// Group past events by year in descending order\nconst groupedPastEventsByYear = computed(() => {\n  const groups: Record<string, ListEvent[]> = {};\n  pastEvents.value.forEach((event) => {\n    const year = new Date(event.datetime).getFullYear().toString();\n    if (!groups[year]) {\n      groups[year] = [];\n    }\n    groups[year].push(event);\n  });\n  return Object.entries(groups)\n    .sort(([yearA], [yearB]) => Number(yearB) - Number(yearA))\n    .map(([year, events]) => ({ year, events }));\n});\n\nconst handleShowAll = () => emit('show:all');\n</script>\n\n<style scoped>\n</style>\n"],"names":["render","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","props","__props","emit","__emit","now","threeMonthsFromNow","upcomingEvents","computed","event","eventDate","a","b","pastEvents","groupedPastEventsByYear","groups","year","yearA","yearB","events","handleShowAll","_hoisted_1","_hoisted_2","_hoisted_3","_Fragment","showAllButton","_createBlock","UiButton","_hoisted_4","_hoisted_5","_renderList","EventCard","_hoisted_6","group","_hoisted_7","_toDisplayString","_hoisted_8","_hoisted_9","_createVNode","_unref","CalendarIcon"],"mappings":"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","x_google_ignoreList":[0]}
+{"version":3,"file":"EventsList.vue_vue_type_script_setup_true_lang-MhuVi5u8.js","sources":["../node_modules/@heroicons/vue/20/solid/esm/CalendarIcon.js","../src/components/calendars/EventsList.vue"],"sourcesContent":["import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    viewBox: \"0 0 20 20\",\n    fill: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"fill-rule\": \"evenodd\",\n      d: \"M5.75 2a.75.75 0 0 1 .75.75V4h7V2.75a.75.75 0 0 1 1.5 0V4h.25A2.75 2.75 0 0 1 18 6.75v8.5A2.75 2.75 0 0 1 15.25 18H4.75A2.75 2.75 0 0 1 2 15.25v-8.5A2.75 2.75 0 0 1 4.75 4H5V2.75A.75.75 0 0 1 5.75 2Zm-1 5.5c-.69 0-1.25.56-1.25 1.25v6.5c0 .69.56 1.25 1.25 1.25h10.5c.69 0 1.25-.56 1.25-1.25v-6.5c0-.69-.56-1.25-1.25-1.25H4.75Z\",\n      \"clip-rule\": \"evenodd\"\n    })\n  ]))\n}","<template>\n  <div class=\"sl-relative\">\n    <!-- Header -->\n    <div class=\"sl-flex sl-justify-between sl-items-center sl-mb-4\">\n      <h2 class=\"sl-text-lg sl-font-bold\">\n        <template v-if=\"upcomingEvents.length\">Upcoming Events</template>\n        <template v-else-if=\"groupedPastEventsByYear.length\">Past Events</template>\n        <template v-else>Events</template>\n      </h2>\n      <UiButton v-if=\"showAllButton\" center-label size=\"xs\" @button-click=\"handleShowAll\">\n        Show all\n      </UiButton>\n    </div>\n\n    <!-- Upcoming Events -->\n    <div v-if=\"upcomingEvents.length\">\n      <ol class=\"sl-divide-y sl-divide-gray-100 sl-text-sm sl-leading-6 sl-mb-8\">\n        <EventCard v-for=\"event in upcomingEvents\" :key=\"event.id\" :event=\"event\" />\n      </ol>\n    </div>\n\n    <!-- Past Events -->\n    <div v-if=\"groupedPastEventsByYear.length\">\n      <div v-for=\"group in groupedPastEventsByYear\" :key=\"group.year\" class=\"sl-mb-8\">\n        <h2 class=\"sl-text-lg sl-font-bold sl-mb-2\">{{ group.year }}</h2>\n        <hr class=\"sl-border-gray-200 sl-mb-4\" />\n        <ol class=\"sl-divide-y sl-divide-gray-100 sl-text-sm sl-leading-6\">\n          <EventCard v-for=\"event in group.events\" :key=\"event.id\" :event=\"event\" />\n        </ol>\n      </div>\n    </div>\n\n    <!-- No Events Message -->\n    <div v-if=\"!upcomingEvents.length && !groupedPastEventsByYear.length\"\n      class=\"sl-px-6 sl-py-14 sl-text-center sl-text-sm sm:sl-px-14\">\n      <CalendarIcon class=\"sl-mx-auto sl-h-6 sl-w-6 sl-text-gray-400\" aria-hidden=\"true\" />\n      <p class=\"sl-mt-4 sl-font-semibold sl-text-gray-800\">No events</p>\n      <p class=\"sl-mt-2 sl-text-gray-500\">Add events to get started!</p>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { CalendarIcon } from '@heroicons/vue/20/solid';\nimport type { ListEvent } from '@/utils/calendar';\nimport UiButton from '@/components/UiButton.vue';\nimport EventCard from './EventCard.vue';\n\nconst props = defineProps<{ \n  events: ListEvent[]; \n  showAllButton?: boolean;\n}>();\nconst emit = defineEmits(['show:all']);\n\nconst now = new Date();\nconst threeMonthsFromNow = new Date();\nthreeMonthsFromNow.setMonth(now.getMonth() + 3);\n\n// Upcoming events: events occurring between now and three months from now\nconst upcomingEvents = computed(() => {\n  if (!props.events || !Array.isArray(props.events)) return [];\n  return props.events\n    .filter((event) => {\n      const eventDate = new Date(event.datetime);\n      return eventDate >= now && eventDate <= threeMonthsFromNow;\n    })\n    .sort((a, b) => new Date(a.datetime).getTime() - new Date(b.datetime).getTime());\n});\n\n// Past events: events that occurred before now\nconst pastEvents = computed(() => {\n  if (!props.events || !Array.isArray(props.events)) return [];\n  return props.events\n    .filter((event) => new Date(event.datetime) < now)\n    .sort((a, b) => new Date(b.datetime).getTime() - new Date(a.datetime).getTime());\n});\n\n// Group past events by year in descending order\nconst groupedPastEventsByYear = computed(() => {\n  const groups: Record<string, ListEvent[]> = {};\n  pastEvents.value.forEach((event) => {\n    const year = new Date(event.datetime).getFullYear().toString();\n    if (!groups[year]) {\n      groups[year] = [];\n    }\n    groups[year].push(event);\n  });\n  return Object.entries(groups)\n    .sort(([yearA], [yearB]) => Number(yearB) - Number(yearA))\n    .map(([year, events]) => ({ year, events }));\n});\n\nconst handleShowAll = () => emit('show:all');\n</script>\n\n<style scoped>\n</style>\n"],"names":["render","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","props","__props","emit","__emit","now","threeMonthsFromNow","upcomingEvents","computed","event","eventDate","a","b","pastEvents","groupedPastEventsByYear","groups","year","yearA","yearB","events","handleShowAll","_hoisted_1","_hoisted_2","_hoisted_3","_Fragment","_createBlock","UiButton","_hoisted_4","_hoisted_5","_renderList","EventCard","_hoisted_6","group","_hoisted_7","_toDisplayString","_hoisted_8","_hoisted_9","_createVNode","_unref","CalendarIcon"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/{FunnelChart.vue_vue_type_script_setup_true_lang-B8QYlJ-s.js → FunnelChart.vue_vue_type_script_setup_true_lang-B4pH6xCV.js}

@@ -1,20 +1,20 @@
-import { defineComponent as n, computed as s, createBlock as f, openBlock as c, mergeProps as p } from "vue";
-import d from "./charts/BaseChart.js";
-import { chartColors as h } from "./charts/chartTheme.js";
+import { defineComponent as n, computed as s, createBlock as f, openBlock as c, mergeProps as d } from "vue";
+import h from "./charts/BaseChart.js";
+import { chartColors as m } from "./charts/chartTheme.js";
 const C = /* @__PURE__ */ n({
   __name: "FunnelChart",
   props: {
     data: {},
     title: {},
     height: { default: 300 },
-    colors: { default: () => h.primary },
+    colors: { default: () => m.primary },
     loading: { type: Boolean, default: !1 },
     sort: { default: "descending" },
     showLabels: { type: Boolean, default: !0 }
   },
   emits: ["click"],
-  setup(o, { emit: i }) {
-    const t = o, l = i, r = s(() => ({
+  setup(e, { emit: i }) {
+    const t = e, l = i, a = s(() => ({
       title: t.title ? { text: t.title } : void 0,
       tooltip: {
         trigger: "item",
@@ -51,17 +51,17 @@ const C = /* @__PURE__ */ n({
         },
         data: t.data
       }]
-    })), a = (e) => {
-      l("click", e);
+    })), r = (o) => {
+      l("click", o);
     };
-    return (e, m) => (c(), f(d, p({
-      option: r.value,
+    return (o, p) => (c(), f(h, d({
+      option: a.value,
       height: e.height,
       loading: e.loading
-    }, e.$attrs, { onClick: a }), null, 16, ["option", "height", "loading"]));
+    }, o.$attrs, { onClick: r }), null, 16, ["option", "height", "loading"]));
   }
 });
 export {
   C as _
 };
-//# sourceMappingURL=FunnelChart.vue_vue_type_script_setup_true_lang-B8QYlJ-s.js.map
+//# sourceMappingURL=FunnelChart.vue_vue_type_script_setup_true_lang-B4pH6xCV.js.map

package/dist/{FunnelChart.vue_vue_type_script_setup_true_lang-B8QYlJ-s.js.map → FunnelChart.vue_vue_type_script_setup_true_lang-B4pH6xCV.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FunnelChart.vue_vue_type_script_setup_true_lang-B8QYlJ-s.js","sources":["../src/components/charts/FunnelChart.vue"],"sourcesContent":["<!--\n  @component FunnelChart\n  @description Funnel chart for conversion/flow visualization.\n  \n  @props\n  - data (array, required): Array of {name, value} objects\n  - title (string, optional): Chart title\n  - height (number|string, optional): Chart height\n  - colors (array, optional): Custom color palette\n  - sort (string, optional): Sort order - 'ascending' | 'descending' | 'none'\n  \n  @example\n  <FunnelChart\n    :data=\"[\n      { name: 'Visits', value: 5000 },\n      { name: 'Signups', value: 3000 },\n      { name: 'Purchases', value: 1000 }\n    ]\"\n    title=\"Conversion Funnel\"\n  />\n-->\n<template>\n  <BaseChart\n    :option=\"chartOption\"\n    :height=\"height\"\n    :loading=\"loading\"\n    v-bind=\"$attrs\"\n    @click=\"handleClick\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport BaseChart from './BaseChart.vue';\nimport { chartColors } from './chartTheme';\nimport type { EChartsOption } from 'echarts';\n\ninterface FunnelDataItem {\n  name: string;\n  value: number;\n}\n\ninterface Props {\n  data: FunnelDataItem[];\n  title?: string;\n  height?: number | string;\n  colors?: string[];\n  loading?: boolean;\n  sort?: 'ascending' | 'descending' | 'none';\n  showLabels?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  height: 300,\n  colors: () => chartColors.primary,\n  loading: false,\n  sort: 'descending',\n  showLabels: true,\n});\n\nconst emit = defineEmits<{\n  click: [params: unknown];\n}>();\n\nconst chartOption = computed<EChartsOption>(() => {\n  return {\n    title: props.title ? { text: props.title } : undefined,\n    tooltip: {\n      trigger: 'item',\n      formatter: '{b}: {c}',\n    },\n    color: props.colors,\n    series: [{\n      type: 'funnel',\n      left: '10%',\n      width: '80%',\n      minSize: '20%',\n      maxSize: '100%',\n      gap: 2,\n      sort: props.sort,\n      label: {\n        show: props.showLabels,\n        position: 'inside',\n        color: '#ffffff',\n        fontSize: 12,\n        fontWeight: 500,\n      },\n      labelLine: {\n        show: false,\n      },\n      itemStyle: {\n        borderColor: '#ffffff',\n        borderWidth: 1,\n      },\n      emphasis: {\n        label: {\n          fontSize: 14,\n          fontWeight: 600,\n        },\n      },\n      data: props.data,\n    }],\n  };\n});\n\nconst handleClick = (params: unknown): void => {\n  emit('click', params);\n};\n</script>\n\n"],"names":["props","__props","emit","__emit","chartOption","computed","handleClick","params","_openBlock","_createBlock","BaseChart","_mergeProps","height","loading","$attrs"],"mappings":";;;;;;;;;;;;;;;;AAoDA,UAAMA,IAAQC,GAQRC,IAAOC,GAIPC,IAAcC,EAAwB,OACnC;AAAA,MACL,OAAOL,EAAM,QAAQ,EAAE,MAAMA,EAAM,UAAU;AAAA,MAC7C,SAAS;AAAA,QACP,SAAS;AAAA,QACT,WAAW;AAAA,MAAA;AAAA,MAEb,OAAOA,EAAM;AAAA,MACb,QAAQ,CAAC;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,QACP,SAAS;AAAA,QACT,SAAS;AAAA,QACT,KAAK;AAAA,QACL,MAAMA,EAAM;AAAA,QACZ,OAAO;AAAA,UACL,MAAMA,EAAM;AAAA,UACZ,UAAU;AAAA,UACV,OAAO;AAAA,UACP,UAAU;AAAA,UACV,YAAY;AAAA,QAAA;AAAA,QAEd,WAAW;AAAA,UACT,MAAM;AAAA,QAAA;AAAA,QAER,WAAW;AAAA,UACT,aAAa;AAAA,UACb,aAAa;AAAA,QAAA;AAAA,QAEf,UAAU;AAAA,UACR,OAAO;AAAA,YACL,UAAU;AAAA,YACV,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,QAEF,MAAMA,EAAM;AAAA,MAAA,CACb;AAAA,IAAA,EAEJ,GAEKM,IAAc,CAACC,MAA0B;AAC7C,MAAAL,EAAK,SAASK,CAAM;AAAA,IACtB;sBArFEC,EAAA,GAAAC,EAMEC,GANFC,EAME;AAAA,MALC,QAAQP,EAAA;AAAA,MACR,QAAQQ,EAAAA;AAAAA,MACR,SAASC,EAAAA;AAAAA,IAAAA,GACFC,EAAAA,QAAM,EACb,SAAOR,EAAA,CAAW,GAAA,MAAA,IAAA,CAAA,UAAA,UAAA,SAAA,CAAA;AAAA;;"}
+{"version":3,"file":"FunnelChart.vue_vue_type_script_setup_true_lang-B4pH6xCV.js","sources":["../src/components/charts/FunnelChart.vue"],"sourcesContent":["<!--\n  @component FunnelChart\n  @description Funnel chart for conversion/flow visualization.\n  \n  @props\n  - data (array, required): Array of {name, value} objects\n  - title (string, optional): Chart title\n  - height (number|string, optional): Chart height\n  - colors (array, optional): Custom color palette\n  - sort (string, optional): Sort order - 'ascending' | 'descending' | 'none'\n  \n  @example\n  <FunnelChart\n    :data=\"[\n      { name: 'Visits', value: 5000 },\n      { name: 'Signups', value: 3000 },\n      { name: 'Purchases', value: 1000 }\n    ]\"\n    title=\"Conversion Funnel\"\n  />\n-->\n<template>\n  <BaseChart\n    :option=\"chartOption\"\n    :height=\"height\"\n    :loading=\"loading\"\n    v-bind=\"$attrs\"\n    @click=\"handleClick\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport BaseChart from './BaseChart.vue';\nimport { chartColors } from './chartTheme';\nimport type { EChartsOption } from 'echarts';\n\ninterface FunnelDataItem {\n  name: string;\n  value: number;\n}\n\ninterface Props {\n  data: FunnelDataItem[];\n  title?: string;\n  height?: number | string;\n  colors?: string[];\n  loading?: boolean;\n  sort?: 'ascending' | 'descending' | 'none';\n  showLabels?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  height: 300,\n  colors: () => chartColors.primary,\n  loading: false,\n  sort: 'descending',\n  showLabels: true,\n});\n\nconst emit = defineEmits<{\n  click: [params: unknown];\n}>();\n\nconst chartOption = computed<EChartsOption>(() => {\n  return {\n    title: props.title ? { text: props.title } : undefined,\n    tooltip: {\n      trigger: 'item',\n      formatter: '{b}: {c}',\n    },\n    color: props.colors,\n    series: [{\n      type: 'funnel',\n      left: '10%',\n      width: '80%',\n      minSize: '20%',\n      maxSize: '100%',\n      gap: 2,\n      sort: props.sort,\n      label: {\n        show: props.showLabels,\n        position: 'inside',\n        color: '#ffffff',\n        fontSize: 12,\n        fontWeight: 500,\n      },\n      labelLine: {\n        show: false,\n      },\n      itemStyle: {\n        borderColor: '#ffffff',\n        borderWidth: 1,\n      },\n      emphasis: {\n        label: {\n          fontSize: 14,\n          fontWeight: 600,\n        },\n      },\n      data: props.data,\n    }],\n  };\n});\n\nconst handleClick = (params: unknown): void => {\n  emit('click', params);\n};\n</script>\n\n"],"names":["props","__props","emit","__emit","chartOption","computed","handleClick","params","_openBlock","_createBlock","BaseChart","_mergeProps","$attrs"],"mappings":";;;;;;;;;;;;;;;;AAoDA,UAAMA,IAAQC,GAQRC,IAAOC,GAIPC,IAAcC,EAAwB,OACnC;AAAA,MACL,OAAOL,EAAM,QAAQ,EAAE,MAAMA,EAAM,UAAU;AAAA,MAC7C,SAAS;AAAA,QACP,SAAS;AAAA,QACT,WAAW;AAAA,MAAA;AAAA,MAEb,OAAOA,EAAM;AAAA,MACb,QAAQ,CAAC;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,QACP,SAAS;AAAA,QACT,SAAS;AAAA,QACT,KAAK;AAAA,QACL,MAAMA,EAAM;AAAA,QACZ,OAAO;AAAA,UACL,MAAMA,EAAM;AAAA,UACZ,UAAU;AAAA,UACV,OAAO;AAAA,UACP,UAAU;AAAA,UACV,YAAY;AAAA,QAAA;AAAA,QAEd,WAAW;AAAA,UACT,MAAM;AAAA,QAAA;AAAA,QAER,WAAW;AAAA,UACT,aAAa;AAAA,UACb,aAAa;AAAA,QAAA;AAAA,QAEf,UAAU;AAAA,UACR,OAAO;AAAA,YACL,UAAU;AAAA,YACV,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,QAEF,MAAMA,EAAM;AAAA,MAAA,CACb;AAAA,IAAA,EAEJ,GAEKM,IAAc,CAACC,MAA0B;AAC7C,MAAAL,EAAK,SAASK,CAAM;AAAA,IACtB;sBArFEC,EAAA,GAAAC,EAMEC,GANFC,EAME;AAAA,MALC,QAAQP,EAAA;AAAA,MACR,QAAQH,EAAA;AAAA,MACR,SAASA,EAAA;AAAA,IAAA,GACFW,EAAAA,QAAM,EACb,SAAON,EAAA,CAAW,GAAA,MAAA,IAAA,CAAA,UAAA,UAAA,SAAA,CAAA;AAAA;;"}