@stachelock/ui 0.4.0 → 0.5.1

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

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationToast.vue_vue_type_script_setup_true_lang-CU__ORw8.js","sources":["../src/components/notifications/NotificationToast.vue"],"sourcesContent":["<!--\n  @component NotificationToast\n  @description Individual notification toast with animations, theming, and dark mode support\n  \n  Displays a single notification with icon, title, message, actions, and close button.\n  Supports multiple themes, variants, positions, and card stacking with smooth transitions.\n  \n  ## Features\n  - Multiple themes with dark mode support\n  - Three variants: default, compact, expanded\n  - Action buttons with dismiss, link, and callback support\n  - Card stacking mode for multiple notifications\n  - Priority-based styling (low, normal, high, urgent)\n  - 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  - action: Emitted when an action button is clicked\n  \n  @example\n  <NotificationToast \n    :notification=\"notification\" \n    @close=\"handleClose\"\n    @action=\"handleAction\"\n  />\n-->\n<template>\n  <TransitionRoot \n    appear \n    :show=\"notification.isOpen\" \n    as=\"template\" \n    @after-leave=\"onAfterLeave\"\n  >\n    <TransitionChild \n      as=\"template\" \n      enter=\"sl-duration-300 sl-ease-out sl-transform\"\n      :enter-from=\"enterFromClass\"\n      enter-to=\"sl-translate-y-0 sl-opacity-100 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=\"[\n          themeClass,\n          variantClass,\n          priorityClass,\n          cardModeClass,\n          'sl-pointer-events-auto sl-overflow-hidden sl-rounded-lg sl-shadow-lg sl-ring-1 sl-ring-black/5 dark:sl-ring-white/10 sl-transition-all sl-duration-200 sl-relative'\n        ]\"\n        :style=\"toastStyle\"\n        @click=\"handleCardClick\"\n        role=\"alert\"\n        :aria-live=\"notification.priority === 'urgent' ? 'assertive' : 'polite'\"\n      >\n        <div :class=\"paddingClass\">\n          <div class=\"sl-flex sl-items-start\">\n            <!-- Icon -->\n            <component \n              v-if=\"iconComponent\"\n              :is=\"iconComponent\" \n              :class=\"[iconSizeClass, iconColorClass, 'sl-flex-shrink-0']\"\n              aria-hidden=\"true\" \n            />\n            \n            <!-- Content -->\n            <div :class=\"contentMarginClass\">\n              <!-- Title -->\n              <p :class=\"[titleClass, textColorClass]\">\n                {{ notification.title }}\n              </p>\n              \n              <!-- Message -->\n              <p \n                v-if=\"notification.message\" \n                :class=\"[messageClass, textColorClass, 'sl-opacity-90']\"\n              >\n                {{ notification.message }}\n              </p>\n              \n              <!-- Actions -->\n              <div \n                v-if=\"notification.actions && notification.actions.length > 0\"\n                class=\"sl-mt-3 sl-flex sl-gap-2\"\n              >\n                <button\n                  v-for=\"(action, idx) in notification.actions\"\n                  :key=\"idx\"\n                  type=\"button\"\n                  :class=\"getActionButtonClass(action)\"\n                  @click.stop=\"handleAction(action)\"\n                >\n                  {{ action.label }}\n                </button>\n              </div>\n            </div>\n            \n            <!-- Close Button -->\n            <button \n              v-if=\"notification.dismissible !== false\"\n              type=\"button\" \n              @click.stop=\"handleClose\"\n              :class=\"[closeButtonClass, 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        \n        <!-- Priority indicator for urgent/high -->\n        <div \n          v-if=\"notification.priority === 'urgent' || notification.priority === 'high'\"\n          :class=\"priorityIndicatorClass\"\n        />\n      </div>\n    </TransitionChild>\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, actions, and animations.\n * Used internally by NotificationContainer but can be used standalone.\n */\nimport { computed, type Component } 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, NotificationAction } from '../../composables/useNotifications';\n\nconst props = defineProps<{ \n  notification: NotificationState \n}>();\n\nconst emit = defineEmits<{\n  close: [notification: NotificationState];\n  action: [notification: NotificationState, action: NotificationAction];\n}>();\n\nconst handleClose = () => {\n  emit('close', props.notification);\n};\n\nconst handleAction = (action: NotificationAction) => {\n  emit('action', props.notification, action);\n};\n\nconst handleCardClick = () => {\n  // Clicking on a card in card mode brings it to front\n  if (props.notification.isCardMode && props.notification.cardStackIndex !== 0) {\n    emit('action', props.notification, { label: 'bringToFront', action: 'callback' });\n  }\n};\n\nconst onAfterLeave = () => {\n  // Animation cleanup callback\n};\n\n// Theme classes with dark mode support\nconst themeClass = computed(() => {\n  const themes: Record<string, string> = {\n    primary: 'sl-bg-primary-600 dark:sl-bg-primary-700 sl-text-white',\n    secondary: 'sl-bg-gray-600 dark:sl-bg-gray-700 sl-text-white',\n    dark: 'sl-bg-gray-800 dark:sl-bg-gray-900 sl-text-white',\n    light: 'sl-bg-white dark:sl-bg-gray-800 sl-text-gray-800 dark:sl-text-gray-100 sl-border sl-border-gray-200 dark:sl-border-gray-700',\n    warning: 'sl-bg-amber-500 dark:sl-bg-amber-600 sl-text-white',\n    danger: 'sl-bg-red-500 dark:sl-bg-red-600 sl-text-white',\n    success: 'sl-bg-emerald-500 dark:sl-bg-emerald-600 sl-text-white',\n    info: 'sl-bg-blue-500 dark:sl-bg-blue-600 sl-text-white',\n    ghost: 'sl-bg-white dark:sl-bg-gray-800 sl-text-gray-800 dark:sl-text-gray-100 sl-border sl-border-gray-200 dark:sl-border-gray-700',\n  };\n  return themes[props.notification.theme] || themes.primary;\n});\n\n// Variant classes - width is controlled by container, just set max-width for variants\nconst variantClass = computed(() => {\n  const variants: Record<string, string> = {\n    default: '',\n    compact: '',\n    expanded: '',\n  };\n  return variants[props.notification.variant] || variants.default;\n});\n\n// Priority classes\nconst priorityClass = computed(() => {\n  if (props.notification.priority === 'urgent') {\n    return 'sl-animate-pulse';\n  }\n  return '';\n});\n\n// Priority indicator\nconst priorityIndicatorClass = computed(() => {\n  const base = 'sl-absolute sl-top-0 sl-left-0 sl-right-0 sl-h-1';\n  if (props.notification.priority === 'urgent') {\n    return `${base} sl-bg-red-400 dark:sl-bg-red-500`;\n  }\n  if (props.notification.priority === 'high') {\n    return `${base} sl-bg-amber-400 dark:sl-bg-amber-500`;\n  }\n  return '';\n});\n\n// Card mode classes\nconst cardModeClass = computed(() => {\n  if (props.notification.isCardMode) {\n    return 'sl-cursor-pointer hover:sl-scale-[1.02] sl-transition-transform';\n  }\n  return '';\n});\n\n// Toast style for card stacking and custom widths\nconst toastStyle = computed(() => {\n  const styles: Record<string, string | number> = {};\n  \n  if (props.notification.maxWidth) {\n    styles.maxWidth = `${props.notification.maxWidth}px`;\n  }\n  \n  if (props.notification.isCardMode) {\n    styles.transform = `translate(${props.notification.cardOffsetX || 0}px, ${props.notification.cardOffsetY || 0}px)`;\n    styles.zIndex = props.notification.zIndex || 1;\n  }\n  \n  return styles;\n});\n\n// Text color based on theme\nconst textColorClass = computed(() => {\n  const theme = props.notification.theme;\n  return ['light', 'ghost'].includes(theme) ? 'sl-text-gray-800 dark:sl-text-gray-100' : 'sl-text-white';\n});\n\n// Icon color\nconst iconColorClass = computed(() => {\n  const theme = props.notification.theme;\n  return ['light', 'ghost'].includes(theme) ? 'sl-text-gray-500 dark:sl-text-gray-400' : 'sl-text-white/90';\n});\n\n// Focus ring class\nconst focusRingClass = computed(() => {\n  const rings: Record<string, string> = {\n    primary: 'focus:sl-ring-primary-400 dark:focus:sl-ring-primary-500',\n    secondary: 'focus:sl-ring-gray-400 dark:focus:sl-ring-gray-500',\n    dark: 'focus:sl-ring-gray-400 dark:focus:sl-ring-gray-500',\n    light: 'focus:sl-ring-gray-300 dark:focus:sl-ring-gray-600',\n    warning: 'focus:sl-ring-amber-300 dark:focus:sl-ring-amber-500',\n    danger: 'focus:sl-ring-red-300 dark:focus:sl-ring-red-500',\n    success: 'focus:sl-ring-emerald-300 dark:focus:sl-ring-emerald-500',\n    info: 'focus:sl-ring-blue-300 dark:focus:sl-ring-blue-500',\n    ghost: 'focus:sl-ring-gray-300 dark:focus:sl-ring-gray-600',\n  };\n  return rings[props.notification.theme] || rings.primary;\n});\n\n// Close button class\nconst closeButtonClass = computed(() => {\n  const theme = props.notification.theme;\n  const baseClass = 'sl-ml-4 sl-inline-flex sl-rounded-md sl-opacity-70 hover:sl-opacity-100 focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-offset-2 sl-transition-opacity';\n  const colorClass = ['light', 'ghost'].includes(theme) \n    ? 'sl-text-gray-400 dark:sl-text-gray-500 hover:sl-text-gray-500 dark:hover:sl-text-gray-400' \n    : 'sl-text-white/70 hover:sl-text-white';\n  return `${baseClass} ${colorClass}`;\n});\n\n// Icon component based on theme or custom\nconst iconComponent = computed((): Component | undefined => {\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, Component> = {\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\n// Variant-specific sizing\nconst iconSizeClass = computed(() => {\n  const sizes: Record<string, string> = {\n    compact: 'sl-h-5 sl-w-5',\n    default: 'sl-h-6 sl-w-6',\n    expanded: 'sl-h-7 sl-w-7',\n  };\n  return sizes[props.notification.variant] || sizes.default;\n});\n\nconst titleClass = computed(() => {\n  const sizes: Record<string, string> = {\n    compact: 'sl-text-xs sl-font-medium',\n    default: 'sl-text-sm sl-font-medium',\n    expanded: 'sl-text-base sl-font-semibold',\n  };\n  return sizes[props.notification.variant] || sizes.default;\n});\n\nconst messageClass = computed(() => {\n  const sizes: Record<string, string> = {\n    compact: 'sl-mt-0.5 sl-text-xs',\n    default: 'sl-mt-1 sl-text-sm',\n    expanded: 'sl-mt-2 sl-text-sm',\n  };\n  return sizes[props.notification.variant] || sizes.default;\n});\n\nconst paddingClass = computed(() => {\n  const sizes: Record<string, string> = {\n    compact: 'sl-p-3',\n    default: 'sl-p-4',\n    expanded: 'sl-p-5',\n  };\n  return sizes[props.notification.variant] || sizes.default;\n});\n\nconst contentMarginClass = computed(() => {\n  const sizes: Record<string, string> = {\n    compact: 'sl-ml-2 sl-w-0 sl-flex-1',\n    default: 'sl-ml-3 sl-w-0 sl-flex-1 sl-pt-0.5',\n    expanded: 'sl-ml-4 sl-w-0 sl-flex-1 sl-pt-0.5',\n  };\n  return sizes[props.notification.variant] || sizes.default;\n});\n\n// Action button styling\nconst getActionButtonClass = (action: NotificationAction): string => {\n  const base = 'sl-rounded sl-px-2 sl-py-1 sl-text-xs sl-font-medium sl-transition-colors focus:sl-outline-none focus:sl-ring-2 focus:sl-ring-offset-1';\n  const theme = props.notification.theme;\n  const isLightTheme = ['light', 'ghost'].includes(theme);\n  \n  const themes: Record<string, { light: string; dark: string }> = {\n    primary: {\n      light: 'sl-bg-primary-100 sl-text-primary-700 hover:sl-bg-primary-200 dark:sl-bg-primary-800 dark:sl-text-primary-200 dark:hover:sl-bg-primary-700',\n      dark: 'sl-bg-white/20 sl-text-white hover:sl-bg-white/30'\n    },\n    secondary: {\n      light: 'sl-bg-gray-100 sl-text-gray-700 hover:sl-bg-gray-200 dark:sl-bg-gray-700 dark:sl-text-gray-200 dark:hover:sl-bg-gray-600',\n      dark: 'sl-bg-white/20 sl-text-white hover:sl-bg-white/30'\n    },\n    danger: {\n      light: 'sl-bg-red-100 sl-text-red-700 hover:sl-bg-red-200 dark:sl-bg-red-900 dark:sl-text-red-200 dark:hover:sl-bg-red-800',\n      dark: 'sl-bg-white/20 sl-text-white hover:sl-bg-white/30'\n    }\n  };\n  \n  const actionTheme = action.theme || 'secondary';\n  const themeStyle = themes[actionTheme] || themes.secondary;\n  \n  return `${base} ${isLightTheme ? themeStyle.light : themeStyle.dark}`;\n};\n\n// Entry animation direction based on position\nconst enterFromClass = computed(() => {\n  const position = props.notification.position;\n  const classes: Record<string, string> = {\n    tr: 'sl-translate-x-full sl-opacity-0',\n    tl: '-sl-translate-x-full sl-opacity-0',\n    br: 'sl-translate-x-full sl-opacity-0',\n    bl: '-sl-translate-x-full sl-opacity-0',\n    tc: '-sl-translate-y-full sl-opacity-0',\n    bc: 'sl-translate-y-full sl-opacity-0',\n  };\n  return classes[position] || classes.br;\n});\n</script>\n"],"names":["props","__props","emit","__emit","handleClose","handleAction","action","handleCardClick","onAfterLeave","themeClass","computed","themes","variantClass","variants","priorityClass","priorityIndicatorClass","base","cardModeClass","toastStyle","styles","textColorClass","theme","iconColorClass","focusRingClass","rings","closeButtonClass","baseClass","colorClass","iconComponent","icons","InformationCircleIcon","ExclamationCircleIcon","ExclamationTriangleIcon","CheckCircleIcon","iconSizeClass","sizes","titleClass","messageClass","paddingClass","contentMarginClass","getActionButtonClass","isLightTheme","actionTheme","themeStyle","enterFromClass","position","classes","_createBlock","_unref","TransitionRoot","_createVNode","TransitionChild","_createElementBlock","_normalizeClass","_createElementVNode","_hoisted_2","_openBlock","_resolveDynamicComponent","_toDisplayString","_hoisted_3","_Fragment","idx","_withModifiers","$event","_hoisted_4","_cache","XMarkIcon"],"mappings":"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"}

package/dist/calendars/CalendarDashboard.js

@@ -1,5 +1,5 @@
-import { defineComponent as _, ref as w, computed as r, createElementBlock as y, openBlock as D, createElementVNode as d, createVNode as s, withCtx as b, createTextVNode as x } from "vue";
-import { _ as C } from "../CalendarHeader.vue_vue_type_script_setup_true_lang-P5ypRyGV.js";
+import { defineComponent as _, ref as w, computed as d, createElementBlock as y, openBlock as D, createElementVNode as r, createVNode as s, withCtx as b, createTextVNode as x } from "vue";
+import { _ as C } from "../CalendarHeader.vue_vue_type_script_setup_true_lang-CkSUiLOH.js";
 import { _ as S } from "../MonthCalendar.vue_vue_type_style_index_0_lang-Cyzq7A9j.js";
 import { _ as E } from "../EventsList.vue_vue_type_script_setup_true_lang-MhuVi5u8.js";
 import V from "../components/Button.js";
@@ -12,27 +12,26 @@ const k = { class: "lg:sl-grid lg:sl-grid-cols-12 lg:sl-gap-x-8" }, B = { class:
   },
   emits: ["selectDay", "doubleSelectDay", "newEvent", "monthChange", "showAll"],
   setup(l, { emit: i }) {
-    const o = l, t = i, n = w(null), h = r(
+    const o = l, t = i, n = w(null), u = d(
       () => o.events.length !== c.value.length
-    ), c = r(() => n.value ? o.events.filter((e) => new Date(e.datetime).toISOString().split("T")[0] === n.value?.date) : o.events), m = (e) => {
+    ), c = d(() => n.value ? o.events.filter((e) => new Date(e.datetime).toISOString().split("T")[0] === n.value?.date) : o.events), m = (e) => {
       n.value = e, t("selectDay", e);
     }, g = (e) => {
       t("doubleSelectDay", e);
-    }, u = (e) => {
+    }, h = (e) => {
       console.log("View changed to:", e);
-    }, v = (e) => {
-      e === "prev" ? t("monthChange", "prev") : e === "next" && t("monthChange", "next");
+    }, v = () => {
     }, f = () => {
       t("newEvent");
     }, p = () => {
       n.value = null, t("showAll");
     };
     return (e, a) => (D(), y("div", k, [
-      d("div", B, [
+      r("div", B, [
         s(C, {
           view: "month",
           selectedRange: l.days,
-          onChangeView: u,
+          onChangeView: h,
           onChangeRange: v
         }, null, 8, ["selectedRange"]),
         s(S, {
@@ -41,7 +40,7 @@ const k = { class: "lg:sl-grid lg:sl-grid-cols-12 lg:sl-gap-x-8" }, B = { class:
           onSelectDay: m,
           onDoubleSelectDay: g
         }, null, 8, ["days", "events"]),
-        d("div", N, [
+        r("div", N, [
           s(V, {
             "center-label": "",
             type: "button",
@@ -59,12 +58,12 @@ const k = { class: "lg:sl-grid lg:sl-grid-cols-12 lg:sl-gap-x-8" }, B = { class:
       s(E, {
         class: "lg:sl-col-span-7 xl:sl-col-span-8 sl-py-6",
         events: c.value,
-        "show-all-button": h.value,
+        "show-all-button": u.value,
         "onShow:all": p
       }, null, 8, ["events", "show-all-button"])
     ]));
   }
-}), j = /* @__PURE__ */ A(R, [["__scopeId", "data-v-d92b7279"]]);
+}), j = /* @__PURE__ */ A(R, [["__scopeId", "data-v-c9d5dc08"]]);
 export {
   j as default
 };

package/dist/calendars/CalendarDashboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarDashboard.js","sources":["../../src/components/calendars/CalendarDashboard.vue"],"sourcesContent":["<template>\n  <div class=\"lg:sl-grid lg:sl-grid-cols-12 lg:sl-gap-x-8\">\n    <!-- Calendar Column -->\n    <div class=\"sl-mt-10 sl-text-center lg:sl-col-start-8 lg:sl-col-end-13 lg:sl-row-start-1 lg:sl-mt-9 xl:sl-col-start-9 xl:sl-col-end-13 sl-h-auto lg:sl-border-l lg:sl-border-gray-100 lg:sl-pl-8 lg:sl-h-full\">\n      <CalendarHeader :view=\"'month'\" :selectedRange=\"days\" @changeView=\"handleViewChange\" @changeRange=\"handleRangeChange\" />\n      <MonthCalendar \n        :days=\"days\" \n        :events=\"events\"\n        @selectDay=\"handleDaySelect\"\n        @doubleSelectDay=\"handleDoubleSelectDay\" />\n      <div class=\"sl-mt-4\">\n        <UiButton center-label type=\"button\" @click=\"handleNewEventClick\" size=\"sm\" expanded>\n          Add event\n        </UiButton>\n      </div>\n    </div>\n\n    <!-- Events List Column -->\n    <EventsList \n      class=\"lg:sl-col-span-7 xl:sl-col-span-8 sl-py-6\" \n      :events=\"filteredEvents\"\n      :show-all-button=\"showAllButton\" \n      @show:all=\"handleShowAll\" />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed } from 'vue';\nimport type { CalendarDay, ListEvent } from '@/utils/calendar';\nimport CalendarHeader from './CalendarHeader.vue';\nimport MonthCalendar from './MonthCalendar.vue';\nimport EventsList from './EventsList.vue';\nimport UiButton from '@/components/UiButton.vue';\n\nconst props = defineProps<{\n  days: CalendarDay[];\n  events: ListEvent[];\n}>();\n\nconst emit = defineEmits(['selectDay', 'doubleSelectDay', 'newEvent', 'monthChange', 'showAll']);\n\nconst selectedDay = ref<CalendarDay | null>(null);\n\nconst showAllButton = computed(() => \n  props.events.length !== filteredEvents.value.length\n);\n\nconst filteredEvents = computed(() => {\n  if (!selectedDay.value) return props.events;\n  \n  return props.events.filter(event => {\n    const eventDate = new Date(event.datetime).toISOString().split('T')[0];\n    return eventDate === selectedDay.value?.date;\n  });\n});\n\nconst handleDaySelect = (day: CalendarDay) => {\n  selectedDay.value = day;\n  emit('selectDay', day);\n};\n\nconst handleDoubleSelectDay = (day: CalendarDay) => {\n  emit('doubleSelectDay', day);\n};\n\nconst handleViewChange = (view: string) => {\n  // Handle view change if needed\n  console.log('View changed to:', view);\n};\n\nconst handleRangeChange = (direction: string) => {\n  if (direction === 'prev') {\n    emit('monthChange', 'prev');\n  } else if (direction === 'next') {\n    emit('monthChange', 'next');\n  }\n};\n\nconst handleNewEventClick = () => {\n  emit('newEvent');\n};\n\nconst handleShowAll = () => {\n  selectedDay.value = null;\n  emit('showAll');\n};\n</script>\n\n<style scoped>\n@media (max-width: 1024px) {\n  .lg\\:sl-col-start-7 {\n    grid-column-start: 1;\n  }\n\n  .lg\\:sl-col-end-13 {\n    grid-column-end: 13;\n  }\n\n  .lg\\:sl-col-span-6 {\n    grid-column: span 12 / span 12;\n  }\n\n  .xl\\:sl-col-start-8 {\n    grid-column-start: 1;\n  }\n\n  .xl\\:sl-col-end-13 {\n    grid-column-end: 13;\n  }\n\n  .xl\\:sl-col-span-6 {\n    grid-column: span 12 / span 12;\n  }\n}\n</style>\n"],"names":["props","__props","emit","__emit","selectedDay","ref","showAllButton","computed","filteredEvents","event","handleDaySelect","day","handleDoubleSelectDay","handleViewChange","view","handleRangeChange","direction","handleNewEventClick","handleShowAll","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_createVNode","CalendarHeader","MonthCalendar","_hoisted_3","UiButton","_cache","EventsList"],"mappings":";;;;;;;;;;;;;;AAkCA,UAAMA,IAAQC,GAKRC,IAAOC,GAEPC,IAAcC,EAAwB,IAAI,GAE1CC,IAAgBC;AAAA,MAAS,MAC7BP,EAAM,OAAO,WAAWQ,EAAe,MAAM;AAAA,IAAA,GAGzCA,IAAiBD,EAAS,MACzBH,EAAY,QAEVJ,EAAM,OAAO,OAAO,CAAAS,MACP,IAAI,KAAKA,EAAM,QAAQ,EAAE,YAAA,EAAc,MAAM,GAAG,EAAE,CAAC,MAChDL,EAAY,OAAO,IACzC,IAL8BJ,EAAM,MAMtC,GAEKU,IAAkB,CAACC,MAAqB;AAC5C,MAAAP,EAAY,QAAQO,GACpBT,EAAK,aAAaS,CAAG;AAAA,IACvB,GAEMC,IAAwB,CAACD,MAAqB;AAClD,MAAAT,EAAK,mBAAmBS,CAAG;AAAA,IAC7B,GAEME,IAAmB,CAACC,MAAiB;AAEzC,cAAQ,IAAI,oBAAoBA,CAAI;AAAA,IACtC,GAEMC,IAAoB,CAACC,MAAsB;AAC/C,MAAIA,MAAc,SAChBd,EAAK,eAAe,MAAM,IACjBc,MAAc,UACvBd,EAAK,eAAe,MAAM;AAAA,IAE9B,GAEMe,IAAsB,MAAM;AAChC,MAAAf,EAAK,UAAU;AAAA,IACjB,GAEMgB,IAAgB,MAAM;AAC1B,MAAAd,EAAY,QAAQ,MACpBF,EAAK,SAAS;AAAA,IAChB;sBApFEiB,EAAA,GAAAC,EAsBM,OAtBNC,GAsBM;AAAA,MApBJC,EAYM,OAZNC,GAYM;AAAA,QAXJC,EAAwHC,GAAA;AAAA,UAAvG,MAAM;AAAA,UAAU,eAAexB,EAAA;AAAA,UAAO,cAAYY;AAAA,UAAmB,eAAaE;AAAA,QAAA;QACnGS,EAI6CE,GAAA;AAAA,UAH1C,MAAMzB,EAAA;AAAA,UACN,QAAQA,EAAA;AAAA,UACR,aAAWS;AAAA,UACX,mBAAiBE;AAAA,QAAA;QACpBU,EAIM,OAJNK,GAIM;AAAA,UAHJH,EAEWI,GAAA;AAAA,YAFD,gBAAA;AAAA,YAAa,MAAK;AAAA,YAAU,SAAOX;AAAA,YAAqB,MAAK;AAAA,YAAK,UAAA;AAAA,UAAA;uBAAS,MAErF,CAAA,GAAAY,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA;AAAA,gBAFqF,eAErF,EAAA;AAAA,YAAA;;;;;MAKJL,EAI8BM,GAAA;AAAA,QAH5B,OAAM;AAAA,QACL,QAAQtB,EAAA;AAAA,QACR,mBAAiBF,EAAA;AAAA,QACjB,cAAUY;AAAA,MAAA;;;;"}
+{"version":3,"file":"CalendarDashboard.js","sources":["../../src/components/calendars/CalendarDashboard.vue"],"sourcesContent":["<template>\n  <div class=\"lg:sl-grid lg:sl-grid-cols-12 lg:sl-gap-x-8\">\n    <!-- Calendar Column -->\n    <div class=\"sl-mt-10 sl-text-center lg:sl-col-start-8 lg:sl-col-end-13 lg:sl-row-start-1 lg:sl-mt-9 xl:sl-col-start-9 xl:sl-col-end-13 sl-h-auto lg:sl-border-l lg:sl-border-gray-100 lg:sl-pl-8 lg:sl-h-full\">\n      <CalendarHeader :view=\"'month'\" :selectedRange=\"days\" @changeView=\"handleViewChange\" @changeRange=\"handleRangeChange\" />\n      <MonthCalendar \n        :days=\"days\" \n        :events=\"events\"\n        @selectDay=\"handleDaySelect\"\n        @doubleSelectDay=\"handleDoubleSelectDay\" />\n      <div class=\"sl-mt-4\">\n        <UiButton center-label type=\"button\" @click=\"handleNewEventClick\" size=\"sm\" expanded>\n          Add event\n        </UiButton>\n      </div>\n    </div>\n\n    <!-- Events List Column -->\n    <EventsList \n      class=\"lg:sl-col-span-7 xl:sl-col-span-8 sl-py-6\" \n      :events=\"filteredEvents\"\n      :show-all-button=\"showAllButton\" \n      @show:all=\"handleShowAll\" />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed } from 'vue';\nimport type { CalendarDay, ListEvent } from '@/utils/calendar';\nimport CalendarHeader from './CalendarHeader.vue';\nimport MonthCalendar from './MonthCalendar.vue';\nimport EventsList from './EventsList.vue';\nimport UiButton from '@/components/UiButton.vue';\n\nconst props = defineProps<{\n  days: CalendarDay[];\n  events: ListEvent[];\n}>();\n\nconst emit = defineEmits(['selectDay', 'doubleSelectDay', 'newEvent', 'monthChange', 'showAll']);\n\nconst selectedDay = ref<CalendarDay | null>(null);\n\nconst showAllButton = computed(() => \n  props.events.length !== filteredEvents.value.length\n);\n\nconst filteredEvents = computed(() => {\n  if (!selectedDay.value) return props.events;\n  \n  return props.events.filter(event => {\n    const eventDate = new Date(event.datetime).toISOString().split('T')[0];\n    return eventDate === selectedDay.value?.date;\n  });\n});\n\nconst handleDaySelect = (day: CalendarDay) => {\n  selectedDay.value = day;\n  emit('selectDay', day);\n};\n\nconst handleDoubleSelectDay = (day: CalendarDay) => {\n  emit('doubleSelectDay', day);\n};\n\nconst handleViewChange = (view: string) => {\n  // Handle view change if needed\n  console.log('View changed to:', view);\n};\n\nconst handleRangeChange = () => {\n  // Range change is handled internally by CalendarHeader\n  // This handler is required by the component interface but not used here\n};\n\nconst handleNewEventClick = () => {\n  emit('newEvent');\n};\n\nconst handleShowAll = () => {\n  selectedDay.value = null;\n  emit('showAll');\n};\n</script>\n\n<style scoped>\n@media (max-width: 1024px) {\n  .lg\\:sl-col-start-7 {\n    grid-column-start: 1;\n  }\n\n  .lg\\:sl-col-end-13 {\n    grid-column-end: 13;\n  }\n\n  .lg\\:sl-col-span-6 {\n    grid-column: span 12 / span 12;\n  }\n\n  .xl\\:sl-col-start-8 {\n    grid-column-start: 1;\n  }\n\n  .xl\\:sl-col-end-13 {\n    grid-column-end: 13;\n  }\n\n  .xl\\:sl-col-span-6 {\n    grid-column: span 12 / span 12;\n  }\n}\n</style>\n"],"names":["props","__props","emit","__emit","selectedDay","ref","showAllButton","computed","filteredEvents","event","handleDaySelect","day","handleDoubleSelectDay","handleViewChange","view","handleRangeChange","handleNewEventClick","handleShowAll","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_createVNode","CalendarHeader","MonthCalendar","_hoisted_3","UiButton","_cache","EventsList"],"mappings":";;;;;;;;;;;;;;AAkCA,UAAMA,IAAQC,GAKRC,IAAOC,GAEPC,IAAcC,EAAwB,IAAI,GAE1CC,IAAgBC;AAAA,MAAS,MAC7BP,EAAM,OAAO,WAAWQ,EAAe,MAAM;AAAA,IAAA,GAGzCA,IAAiBD,EAAS,MACzBH,EAAY,QAEVJ,EAAM,OAAO,OAAO,CAAAS,MACP,IAAI,KAAKA,EAAM,QAAQ,EAAE,YAAA,EAAc,MAAM,GAAG,EAAE,CAAC,MAChDL,EAAY,OAAO,IACzC,IAL8BJ,EAAM,MAMtC,GAEKU,IAAkB,CAACC,MAAqB;AAC5C,MAAAP,EAAY,QAAQO,GACpBT,EAAK,aAAaS,CAAG;AAAA,IACvB,GAEMC,IAAwB,CAACD,MAAqB;AAClD,MAAAT,EAAK,mBAAmBS,CAAG;AAAA,IAC7B,GAEME,IAAmB,CAACC,MAAiB;AAEzC,cAAQ,IAAI,oBAAoBA,CAAI;AAAA,IACtC,GAEMC,IAAoB,MAAM;AAAA,IAGhC,GAEMC,IAAsB,MAAM;AAChC,MAAAd,EAAK,UAAU;AAAA,IACjB,GAEMe,IAAgB,MAAM;AAC1B,MAAAb,EAAY,QAAQ,MACpBF,EAAK,SAAS;AAAA,IAChB;sBAjFEgB,EAAA,GAAAC,EAsBM,OAtBNC,GAsBM;AAAA,MApBJC,EAYM,OAZNC,GAYM;AAAA,QAXJC,EAAwHC,GAAA;AAAA,UAAvG,MAAM;AAAA,UAAU,eAAevB,EAAA;AAAA,UAAO,cAAYY;AAAA,UAAmB,eAAaE;AAAA,QAAA;QACnGQ,EAI6CE,GAAA;AAAA,UAH1C,MAAMxB,EAAA;AAAA,UACN,QAAQA,EAAA;AAAA,UACR,aAAWS;AAAA,UACX,mBAAiBE;AAAA,QAAA;QACpBS,EAIM,OAJNK,GAIM;AAAA,UAHJH,EAEWI,GAAA;AAAA,YAFD,gBAAA;AAAA,YAAa,MAAK;AAAA,YAAU,SAAOX;AAAA,YAAqB,MAAK;AAAA,YAAK,UAAA;AAAA,UAAA;uBAAS,MAErF,CAAA,GAAAY,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA;AAAA,gBAFqF,eAErF,EAAA;AAAA,YAAA;;;;;MAKJL,EAI8BM,GAAA;AAAA,QAH5B,OAAM;AAAA,QACL,QAAQrB,EAAA;AAAA,QACR,mBAAiBF,EAAA;AAAA,QACjB,cAAUW;AAAA,MAAA;;;;"}

package/dist/calendars/CalendarHeader.js

@@ -1,4 +1,4 @@
-import { _ as f } from "../CalendarHeader.vue_vue_type_script_setup_true_lang-P5ypRyGV.js";
+import { _ as f } from "../CalendarHeader.vue_vue_type_script_setup_true_lang-CkSUiLOH.js";
 export {
   f as default
 };

package/dist/components/CloudinaryImage.js

@@ -1,6 +1,7 @@
-import { createElementBlock as d, openBlock as u, createElementVNode as o, defineComponent as L, inject as M, ref as h, computed as l, watch as P, onMounted as Z, onUnmounted as E, normalizeClass as n, normalizeStyle as C, withDirectives as p, createCommentVNode as D, createBlock as x, resolveDynamicComponent as S, vShow as v } from "vue";
-import { _ as U } from "../_plugin-vue_export-helper-CHgC5LLL.js";
-function z(i, f) {
+import { createElementBlock as d, openBlock as u, createElementVNode as r, defineComponent as U, inject as D, ref as v, computed as l, watch as F, onMounted as W, onUnmounted as z, normalizeClass as n, normalizeStyle as C, withDirectives as g, createCommentVNode as O, createBlock as x, resolveDynamicComponent as k, vShow as y } from "vue";
+import P from "https://res.cloudinary.com/demo/image/upload/sample.jpg?vue&type=CloudinaryImage&index=0&src=true&alt=Sample%20image&lang.CloudinaryImage";
+import { _ as V } from "../_plugin-vue_export-helper-CHgC5LLL.js";
+function H(i, f) {
   return u(), d("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 20 20",
@@ -8,14 +9,14 @@ function z(i, f) {
     "aria-hidden": "true",
     "data-slot": "icon"
   }, [
-    o("path", {
+    r("path", {
       "fill-rule": "evenodd",
       d: "M1 5.25A2.25 2.25 0 0 1 3.25 3h13.5A2.25 2.25 0 0 1 19 5.25v9.5A2.25 2.25 0 0 1 16.75 17H3.25A2.25 2.25 0 0 1 1 14.75v-9.5Zm1.5 5.81v3.69c0 .414.336.75.75.75h13.5a.75.75 0 0 0 .75-.75v-2.69l-2.22-2.219a.75.75 0 0 0-1.06 0l-1.91 1.909.47.47a.75.75 0 1 1-1.06 1.06L6.53 8.091a.75.75 0 0 0-1.06 0l-2.97 2.97ZM12 7a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z",
       "clip-rule": "evenodd"
     })
   ]);
 }
-function F(i, f) {
+function G(i, f) {
   return u(), d("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 20 20",
@@ -23,24 +24,37 @@ function F(i, f) {
     "aria-hidden": "true",
     "data-slot": "icon"
   }, [
-    o("path", {
+    r("path", {
       "fill-rule": "evenodd",
       d: "M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-5.5-2.5a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0ZM10 12a5.99 5.99 0 0 0-4.793 2.39A6.483 6.483 0 0 0 10 16.5a6.483 6.483 0 0 0 4.793-2.11A5.99 5.99 0 0 0 10 12Z",
       "clip-rule": "evenodd"
     })
   ]);
 }
-const O = { class: "sl-flex sl-h-full sl-w-full sl-items-center sl-justify-center" }, V = { class: "sl-flex sl-h-full sl-w-full sl-items-center sl-justify-center" }, H = {
+const J = { class: "sl-flex sl-h-full sl-w-full sl-items-center sl-justify-center" }, K = { class: "sl-flex sl-h-full sl-w-full sl-items-center sl-justify-center" }, Q = {
   key: 0,
   class: "sl-h-full sl-w-full"
-}, G = ["src", "alt"], J = /* @__PURE__ */ L({
+}, T = ["src", "alt"], $ = /* @__PURE__ */ U({
   __name: "CloudinaryImage",
   props: {
+    /** Direct image URL - bypasses Cloudinary URL generation */
+    src: {
+      type: String,
+      required: !1,
+      default: null
+    },
+    /** Cloudinary public ID */
     publicId: {
       type: String,
       required: !1,
       default: null
     },
+    /** Alias for publicId (for compatibility with different naming conventions) */
+    imagePublicId: {
+      type: String,
+      required: !1,
+      default: null
+    },
     asset: {
       type: Object,
       default: null,
@@ -51,6 +65,12 @@ const O = { class: "sl-flex sl-h-full sl-w-full sl-items-center sl-justify-cente
       required: !1,
       default: null
     },
+    /** Fallback URL to use if primary image fails */
+    fallbackSrc: {
+      type: String,
+      required: !1,
+      default: null
+    },
     transformations: {
       type: Array,
       default: () => []
@@ -94,82 +114,84 @@ const O = { class: "sl-flex sl-h-full sl-w-full sl-items-center sl-justify-cente
   },
   emits: ["update:imageLoaded", "error"],
   setup(i, { emit: f }) {
-    const g = M("cloudinary", {}), s = h(!1), r = h(!1), c = h(!0), y = f, e = i, m = l(() => e.asset?.public_id ? e.asset.public_id : e.publicId || e.fallbackPublicId || null), w = l(() => {
-      if (!m.value) return null;
-      const t = g?.cloudName || "demo", b = g?.baseUrl || `https://res.cloudinary.com/${t}/image/upload`, a = [];
+    const b = D("cloudinary", {}), s = v(!1), o = v(!1), c = v(!0), w = f, e = i, m = (t) => t ? t.startsWith("http://") || t.startsWith("https://") || t.startsWith("//") : !1, p = l(() => e.src && m(e.src) ? e.src : e.asset?.secure_url ? e.asset.secure_url : e.asset?.url ? e.asset.url : e.publicId && m(e.publicId) ? e.publicId : e.imagePublicId && m(e.imagePublicId) ? e.imagePublicId : null), _ = l(() => p.value ? null : e.asset?.public_id ? e.asset.public_id : e.imagePublicId || e.publicId || e.fallbackPublicId || null), q = l(() => {
+      if (!_.value) return null;
+      const t = b?.cloudName || "demo", S = b?.baseUrl || `https://res.cloudinary.com/${t}/image/upload`, a = [];
       e.width && e.width !== "auto" && a.push(`w_${e.width}`), e.height && e.height !== "auto" && a.push(`h_${e.height}`), e.quality && a.push(`q_${e.quality}`), e.devicePixelRatio && a.push(`dpr_${e.devicePixelRatio}`), a.push("f_auto"), a.push("c_fill");
-      const B = a.join(",");
-      return `${b}/${B}/${m.value}`;
-    }), _ = l(() => e.skeleton === "user" ? F : z), k = l(() => {
+      const E = a.join(",");
+      return `${S}/${E}/${_.value}`;
+    }), h = l(() => p.value ? p.value : q.value), I = l(() => e.skeleton === "user" ? G : H), j = l(() => {
       const t = {};
       return e.width && e.width !== "auto" && (t.width = typeof e.width == "number" ? `${e.width}px` : e.width), e.height && e.height !== "auto" && (t.height = typeof e.height == "number" ? `${e.height}px` : e.height), e.aspectRatio && (t.aspectRatio = String(e.aspectRatio)), t;
-    }), I = l(() => ({
+    }), N = l(() => ({
       "sl-relative sl-overflow-hidden": !0,
       ...e.customClasses?.div
-    })), $ = l(() => ({
+    })), A = l(() => ({
       "sl-h-full sl-w-full sl-text-gray-200": !0,
       ...e.customClasses?.skeleton
-    })), j = l(() => ({
+    })), R = l(() => ({
       "sl-h-full sl-w-full sl-text-gray-300": !0,
       ...e.customClasses?.fallback
-    })), N = l(() => ({
+    })), B = l(() => ({
       "sl-h-full sl-w-full sl-object-cover": !0,
       ...e.customClasses?.image
-    })), q = l(() => ({
+    })), L = l(() => ({
       objectFit: "cover"
-    })), A = () => {
-      s.value = !0, r.value = !1, y("update:imageLoaded", !0);
-    }, R = (t) => {
-      c.value && (r.value = !0, s.value = !1, y("error", t));
+    })), M = () => {
+      s.value = !0, o.value = !1, w("update:imageLoaded", !0);
+    }, Z = (t) => {
+      c.value && (o.value = !0, s.value = !1, w("error", t));
     };
-    return P(
-      () => m.value,
+    return F(
+      () => h.value,
       () => {
-        s.value = !1, r.value = !1;
+        s.value = !1, o.value = !1;
       }
-    ), Z(() => {
+    ), W(() => {
       c.value = !0;
-    }), E(() => {
+    }), z(() => {
       c.value = !1;
-    }), (t, b) => (u(), d("div", {
-      style: C(k.value),
-      class: n(I.value)
+    }), (t, S) => (u(), d("div", {
+      style: C(j.value),
+      class: n(N.value)
     }, [
-      p(o("div", O, [
-        o("div", {
+      g(r("div", J, [
+        r("div", {
           role: "status",
           class: n([{ "sl-animate-pulse": i.pulse }])
         }, [
-          (u(), x(S(_.value), {
-            class: n($.value)
+          (u(), x(k(I.value), {
+            class: n(A.value)
           }, null, 8, ["class"]))
         ], 2)
       ], 512), [
-        [v, !s.value && !r.value]
+        [y, !s.value && !o.value]
       ]),
-      p(o("div", V, [
-        (u(), x(S(_.value), {
-          class: n(j.value)
+      g(r("div", K, [
+        (u(), x(k(I.value), {
+          class: n(R.value)
         }, null, 8, ["class"]))
       ], 512), [
-        [v, r.value && !s.value]
+        [y, o.value && !s.value]
       ]),
-      w.value && c.value ? p((u(), d("div", H, [
-        o("img", {
-          src: w.value,
+      h.value && c.value ? g((u(), d("div", Q, [
+        r("img", {
+          src: h.value,
           alt: i.alt,
-          onLoad: A,
-          onError: R,
-          class: n(N.value),
-          style: C(q.value)
-        }, null, 46, G)
+          onLoad: M,
+          onError: Z,
+          class: n(B.value),
+          style: C(L.value)
+        }, null, 46, T)
       ], 512)), [
-        [v, s.value]
-      ]) : D("", !0)
+        [y, s.value]
+      ]) : O("", !0)
     ], 6));
   }
-}), T = /* @__PURE__ */ U(J, [["__scopeId", "data-v-b8d07cc6"]]);
+});
+typeof P == "function" && P($);
+const te = /* @__PURE__ */ V($, [["__scopeId", "data-v-18ba2d71"]]);
 export {
-  T as default
+  te as default
 };
 //# sourceMappingURL=CloudinaryImage.js.map

package/dist/components/CloudinaryImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CloudinaryImage.js","sources":["../../node_modules/@heroicons/vue/20/solid/esm/PhotoIcon.js","../../node_modules/@heroicons/vue/20/solid/esm/UserCircleIcon.js","../../src/components/CloudinaryImage.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: \"M1 5.25A2.25 2.25 0 0 1 3.25 3h13.5A2.25 2.25 0 0 1 19 5.25v9.5A2.25 2.25 0 0 1 16.75 17H3.25A2.25 2.25 0 0 1 1 14.75v-9.5Zm1.5 5.81v3.69c0 .414.336.75.75.75h13.5a.75.75 0 0 0 .75-.75v-2.69l-2.22-2.219a.75.75 0 0 0-1.06 0l-1.91 1.909.47.47a.75.75 0 1 1-1.06 1.06L6.53 8.091a.75.75 0 0 0-1.06 0l-2.97 2.97ZM12 7a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z\",\n      \"clip-rule\": \"evenodd\"\n    })\n  ]))\n}","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: \"M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-5.5-2.5a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0ZM10 12a5.99 5.99 0 0 0-4.793 2.39A6.483 6.483 0 0 0 10 16.5a6.483 6.483 0 0 0 4.793-2.11A5.99 5.99 0 0 0 10 12Z\",\n      \"clip-rule\": \"evenodd\"\n    })\n  ]))\n}","<!--\n  @component CloudinaryImage\n  @description Cloudinary image component with loading states and fallbacks.\n  \n  Displays images from Cloudinary with automatic transformations, loading\n  skeleton, error fallback, and flexible sizing options.\n  \n  @props\n  - publicId (string, optional): Cloudinary public ID\n  - asset (CloudinaryAsset, optional): Full asset object with transformations\n  - fallbackPublicId (string, optional): Fallback image public ID\n  - transformations (array, optional): Additional Cloudinary transformations\n  - alt (string, optional): Alt text for accessibility\n  - aspectRatio (string|number, optional): Aspect ratio (e.g., '16/9')\n  - width (string|number, optional): Width in pixels or 'auto'\n  - height (string|number, optional): Height in pixels or 'auto'\n  - quality (string|number, optional): Image quality (1-100 or 'auto')\n  - skeleton (string, optional): Skeleton type - 'user' or 'photo'\n  - pulse (boolean, optional): Animate skeleton\n  \n  @emits\n  - update:imageLoaded: Emitted when image load state changes\n  - error: Emitted on image load error\n  \n  @example\n  <CloudinaryImage\n    public-id=\"avatars/user123\"\n    :width=\"200\"\n    :height=\"200\"\n    alt=\"User avatar\"\n    skeleton=\"user\"\n  />\n-->\n<template>\n  <div :style=\"computedDivStyle\" :class=\"computedDivClass\">\n    <!-- Loading skeleton -->\n    <div v-show=\"!imageLoaded && !imageError\" class=\"sl-flex sl-h-full sl-w-full sl-items-center sl-justify-center\">\n      <div role=\"status\" :class=\"[{ 'sl-animate-pulse': pulse }]\">\n        <component :is=\"skeletonComponent\" :class=\"computedSkeletonClass\" />\n      </div>\n    </div>\n\n    <!-- Error fallback -->\n    <div v-show=\"imageError && !imageLoaded\" class=\"sl-flex sl-h-full sl-w-full sl-items-center sl-justify-center\">\n      <component :is=\"skeletonComponent\" :class=\"computedFallbackClass\" />\n    </div>\n\n    <!-- Image -->\n    <div v-if=\"computedImg && isMounted\" v-show=\"imageLoaded\" class=\"sl-h-full sl-w-full\">\n      <img\n        :src=\"computedImg\"\n        :alt=\"alt\"\n        @load=\"onImageLoad\"\n        @error=\"onImageError\"\n        :class=\"computedImageClass\"\n        :style=\"computedImageStyle\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\n/**\n * CloudinaryImage - Image component with Cloudinary CDN support\n * \n * Provides a comprehensive image component with loading states, error handling,\n * and Cloudinary transformations. Uses plugin configuration for Cloudinary setup.\n * \n * ## Features\n * - Automatic loading skeleton\n * - Error fallback display\n * - Cloudinary URL generation\n * - Responsive sizing\n * - Aspect ratio control\n * - Quality optimization\n * \n * ## Plugin Configuration\n * Configure Cloudinary in your app setup:\n * ```typescript\n * app.use(StachelockUI, {\n *   cloudinary: {\n *     cloudName: 'your-cloud-name',\n *     defaultTransformations: [...]\n *   }\n * })\n * ```\n * \n * @module components/CloudinaryImage\n * @see {@link CloudinaryImageProps} for prop interface\n */\nimport { UserCircleIcon, PhotoIcon } from '@heroicons/vue/20/solid';\nimport { computed, inject, onMounted, onUnmounted, ref, watch } from 'vue';\nimport type { PropType } from 'vue';\nimport type { CloudinaryAsset, CloudinaryTransformationStep } from '../types/core';\n\n// Plugin configuration injection\nconst cloudinaryConfig = inject<{\n  cloudName?: string;\n  baseUrl?: string;\n  defaultTransformations?: CloudinaryTransformationStep[];\n}>('cloudinary', {});\n\ninterface CustomClasses {\n  div?: Record<string, boolean>;\n  skeleton?: Record<string, boolean>;\n  image?: Record<string, boolean>;\n  fallback?: Record<string, boolean>;\n}\n\n// State\nconst imageLoaded = ref(false);\nconst imageError = ref(false);\nconst isMounted = ref(true);\n\nconst emit = defineEmits<{\n  'update:imageLoaded': [value: boolean];\n  'error': [error: unknown];\n}>();\n\nconst props = defineProps({\n  publicId: {\n    type: String,\n    required: false,\n    default: null\n  },\n  asset: {\n    type: Object as PropType<CloudinaryAsset | null>,\n    default: null,\n    required: false\n  },\n  fallbackPublicId: {\n    type: String,\n    required: false,\n    default: null\n  },\n  transformations: {\n    type: Array as PropType<Array<(image: unknown) => void>>,\n    default: () => []\n  },\n  alt: {\n    type: String,\n    default: ''\n  },\n  aspectRatio: {\n    type: [String, Number] as PropType<string | number>,\n    default: null\n  },\n  width: {\n    type: [String, Number] as PropType<string | number>,\n    default: 64\n  },\n  height: {\n    type: [String, Number] as PropType<string | number>,\n    default: 64\n  },\n  quality: {\n    type: [String, Number],\n    default: '90'\n  },\n  devicePixelRatio: {\n    type: String,\n    default: '2.0'\n  },\n  skeleton: {\n    type: String as PropType<'user' | 'photo'>,\n    default: 'photo'\n  },\n  pulse: {\n    type: Boolean,\n    default: true\n  },\n  customClasses: {\n    type: Object as PropType<CustomClasses>,\n    default: () => ({})\n  }\n});\n\n// Computed: Effective public ID\nconst effectivePublicId = computed(() => {\n  if (props.asset?.public_id) {\n    return props.asset.public_id;\n  }\n  return props.publicId || props.fallbackPublicId || null;\n});\n\n// Computed: Generate Cloudinary URL\nconst computedImg = computed(() => {\n  if (!effectivePublicId.value) return null;\n  \n  const cloudName = cloudinaryConfig?.cloudName || 'demo';\n  const baseUrl = cloudinaryConfig?.baseUrl || `https://res.cloudinary.com/${cloudName}/image/upload`;\n  \n  // Build transformation string\n  const transformations: string[] = [];\n  \n  // Add width/height\n  if (props.width && props.width !== 'auto') {\n    transformations.push(`w_${props.width}`);\n  }\n  if (props.height && props.height !== 'auto') {\n    transformations.push(`h_${props.height}`);\n  }\n  \n  // Add quality\n  if (props.quality) {\n    transformations.push(`q_${props.quality}`);\n  }\n  \n  // Add DPR\n  if (props.devicePixelRatio) {\n    transformations.push(`dpr_${props.devicePixelRatio}`);\n  }\n  \n  // Auto format\n  transformations.push('f_auto');\n  \n  // Crop mode\n  transformations.push('c_fill');\n  \n  const transformString = transformations.join(',');\n  \n  return `${baseUrl}/${transformString}/${effectivePublicId.value}`;\n});\n\n// Skeleton component based on type\nconst skeletonComponent = computed(() => {\n  return props.skeleton === 'user' ? UserCircleIcon : PhotoIcon;\n});\n\n// Style computations\nconst computedDivStyle = computed(() => {\n  const style: Record<string, string> = {};\n  \n  if (props.width && props.width !== 'auto') {\n    style.width = typeof props.width === 'number' ? `${props.width}px` : props.width;\n  }\n  if (props.height && props.height !== 'auto') {\n    style.height = typeof props.height === 'number' ? `${props.height}px` : props.height;\n  }\n  if (props.aspectRatio) {\n    style.aspectRatio = String(props.aspectRatio);\n  }\n  \n  return style;\n});\n\nconst computedDivClass = computed(() => ({\n  'sl-relative sl-overflow-hidden': true,\n  ...props.customClasses?.div\n}));\n\nconst computedSkeletonClass = computed(() => ({\n  'sl-h-full sl-w-full sl-text-gray-200': true,\n  ...props.customClasses?.skeleton\n}));\n\nconst computedFallbackClass = computed(() => ({\n  'sl-h-full sl-w-full sl-text-gray-300': true,\n  ...props.customClasses?.fallback\n}));\n\nconst computedImageClass = computed(() => ({\n  'sl-h-full sl-w-full sl-object-cover': true,\n  ...props.customClasses?.image\n}));\n\nconst computedImageStyle = computed(() => ({\n  objectFit: 'cover' as const,\n}));\n\n// Event handlers\nconst onImageLoad = () => {\n  imageLoaded.value = true;\n  imageError.value = false;\n  emit('update:imageLoaded', true);\n};\n\nconst onImageError = (error: Event) => {\n  if (!isMounted.value) return;\n  \n  imageError.value = true;\n  imageLoaded.value = false;\n  emit('error', error);\n};\n\n// Reset state when publicId changes\nwatch(\n  () => effectivePublicId.value,\n  () => {\n    imageLoaded.value = false;\n    imageError.value = false;\n  }\n);\n\n// Lifecycle\nonMounted(() => {\n  isMounted.value = true;\n});\n\nonUnmounted(() => {\n  isMounted.value = false;\n});\n</script>\n\n<style scoped>\n/* Prevent layout shift */\n[data-loading=\"true\"] {\n  min-height: 20px;\n}\n</style>\n\n"],"names":["render","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","cloudinaryConfig","inject","imageLoaded","ref","imageError","isMounted","emit","__emit","props","__props","effectivePublicId","computed","computedImg","cloudName","baseUrl","transformations","transformString","skeletonComponent","UserCircleIcon","PhotoIcon","computedDivStyle","style","computedDivClass","computedSkeletonClass","computedFallbackClass","computedImageClass","computedImageStyle","onImageLoad","onImageError","error","watch","onMounted","onUnmounted","_withDirectives","_hoisted_1","_createBlock","_resolveDynamicComponent","_vShow","_hoisted_2","_hoisted_3"],"mappings":"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","x_google_ignoreList":[0,1]}
+{"version":3,"file":"CloudinaryImage.js","sources":["../../node_modules/@heroicons/vue/20/solid/esm/PhotoIcon.js","../../node_modules/@heroicons/vue/20/solid/esm/UserCircleIcon.js","../../src/components/CloudinaryImage.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: \"M1 5.25A2.25 2.25 0 0 1 3.25 3h13.5A2.25 2.25 0 0 1 19 5.25v9.5A2.25 2.25 0 0 1 16.75 17H3.25A2.25 2.25 0 0 1 1 14.75v-9.5Zm1.5 5.81v3.69c0 .414.336.75.75.75h13.5a.75.75 0 0 0 .75-.75v-2.69l-2.22-2.219a.75.75 0 0 0-1.06 0l-1.91 1.909.47.47a.75.75 0 1 1-1.06 1.06L6.53 8.091a.75.75 0 0 0-1.06 0l-2.97 2.97ZM12 7a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z\",\n      \"clip-rule\": \"evenodd\"\n    })\n  ]))\n}","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: \"M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-5.5-2.5a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0ZM10 12a5.99 5.99 0 0 0-4.793 2.39A6.483 6.483 0 0 0 10 16.5a6.483 6.483 0 0 0 4.793-2.11A5.99 5.99 0 0 0 10 12Z\",\n      \"clip-rule\": \"evenodd\"\n    })\n  ]))\n}","<!--\n  @component CloudinaryImage\n  @description Cloudinary image component with loading states and fallbacks.\n  \n  Displays images from Cloudinary with automatic transformations, loading\n  skeleton, error fallback, and flexible sizing options.\n  \n  @props\n  - src (string, optional): Direct image URL (bypasses Cloudinary URL generation)\n  - publicId (string, optional): Cloudinary public ID\n  - imagePublicId (string, optional): Alias for publicId (for compatibility)\n  - asset (CloudinaryAsset, optional): Full asset object with transformations\n  - fallbackPublicId (string, optional): Fallback image public ID\n  - transformations (array, optional): Additional Cloudinary transformations\n  - alt (string, optional): Alt text for accessibility\n  - aspectRatio (string|number, optional): Aspect ratio (e.g., '16/9')\n  - width (string|number, optional): Width in pixels or 'auto'\n  - height (string|number, optional): Height in pixels or 'auto'\n  - quality (string|number, optional): Image quality (1-100 or 'auto')\n  - skeleton (string, optional): Skeleton type - 'user' or 'photo'\n  - pulse (boolean, optional): Animate skeleton\n  \n  @emits\n  - update:imageLoaded: Emitted when image load state changes\n  - error: Emitted on image load error\n  \n  @example\n  <!-- Using direct URL -->\n  <CloudinaryImage\n    src=\"https://res.cloudinary.com/demo/image/upload/sample.jpg\"\n    :width=\"200\"\n    :height=\"200\"\n    alt=\"Sample image\"\n  />\n  \n  @example\n  <!-- Using public ID with auto-generated URL -->\n  <CloudinaryImage\n    public-id=\"avatars/user123\"\n    :width=\"200\"\n    :height=\"200\"\n    alt=\"User avatar\"\n    skeleton=\"user\"\n  />\n-->\n<template>\n  <div :style=\"computedDivStyle\" :class=\"computedDivClass\">\n    <!-- Loading skeleton -->\n    <div v-show=\"!imageLoaded && !imageError\" class=\"sl-flex sl-h-full sl-w-full sl-items-center sl-justify-center\">\n      <div role=\"status\" :class=\"[{ 'sl-animate-pulse': pulse }]\">\n        <component :is=\"skeletonComponent\" :class=\"computedSkeletonClass\" />\n      </div>\n    </div>\n\n    <!-- Error fallback -->\n    <div v-show=\"imageError && !imageLoaded\" class=\"sl-flex sl-h-full sl-w-full sl-items-center sl-justify-center\">\n      <component :is=\"skeletonComponent\" :class=\"computedFallbackClass\" />\n    </div>\n\n    <!-- Image -->\n    <div v-if=\"computedImg && isMounted\" v-show=\"imageLoaded\" class=\"sl-h-full sl-w-full\">\n      <img\n        :src=\"computedImg\"\n        :alt=\"alt\"\n        @load=\"onImageLoad\"\n        @error=\"onImageError\"\n        :class=\"computedImageClass\"\n        :style=\"computedImageStyle\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\n/**\n * CloudinaryImage - Image component with Cloudinary CDN support\n * \n * Provides a comprehensive image component with loading states, error handling,\n * and Cloudinary transformations. Uses plugin configuration for Cloudinary setup.\n * \n * ## Features\n * - Automatic loading skeleton\n * - Error fallback display\n * - Cloudinary URL generation\n * - Responsive sizing\n * - Aspect ratio control\n * - Quality optimization\n * \n * ## Plugin Configuration\n * Configure Cloudinary in your app setup:\n * ```typescript\n * app.use(StachelockUI, {\n *   cloudinary: {\n *     cloudName: 'your-cloud-name',\n *     defaultTransformations: [...]\n *   }\n * })\n * ```\n * \n * @module components/CloudinaryImage\n * @see {@link CloudinaryImageProps} for prop interface\n */\nimport { UserCircleIcon, PhotoIcon } from '@heroicons/vue/20/solid';\nimport { computed, inject, onMounted, onUnmounted, ref, watch } from 'vue';\nimport type { PropType } from 'vue';\nimport type { CloudinaryAsset, CloudinaryTransformationStep } from '../types/core';\n\n// Plugin configuration injection\nconst cloudinaryConfig = inject<{\n  cloudName?: string;\n  baseUrl?: string;\n  defaultTransformations?: CloudinaryTransformationStep[];\n}>('cloudinary', {});\n\ninterface CustomClasses {\n  div?: Record<string, boolean>;\n  skeleton?: Record<string, boolean>;\n  image?: Record<string, boolean>;\n  fallback?: Record<string, boolean>;\n}\n\n// State\nconst imageLoaded = ref(false);\nconst imageError = ref(false);\nconst isMounted = ref(true);\n\nconst emit = defineEmits<{\n  'update:imageLoaded': [value: boolean];\n  'error': [error: unknown];\n}>();\n\nconst props = defineProps({\n  /** Direct image URL - bypasses Cloudinary URL generation */\n  src: {\n    type: String,\n    required: false,\n    default: null\n  },\n  /** Cloudinary public ID */\n  publicId: {\n    type: String,\n    required: false,\n    default: null\n  },\n  /** Alias for publicId (for compatibility with different naming conventions) */\n  imagePublicId: {\n    type: String,\n    required: false,\n    default: null\n  },\n  asset: {\n    type: Object as PropType<CloudinaryAsset | null>,\n    default: null,\n    required: false\n  },\n  fallbackPublicId: {\n    type: String,\n    required: false,\n    default: null\n  },\n  /** Fallback URL to use if primary image fails */\n  fallbackSrc: {\n    type: String,\n    required: false,\n    default: null\n  },\n  transformations: {\n    type: Array as PropType<Array<(image: unknown) => void>>,\n    default: () => []\n  },\n  alt: {\n    type: String,\n    default: ''\n  },\n  aspectRatio: {\n    type: [String, Number] as PropType<string | number>,\n    default: null\n  },\n  width: {\n    type: [String, Number] as PropType<string | number>,\n    default: 64\n  },\n  height: {\n    type: [String, Number] as PropType<string | number>,\n    default: 64\n  },\n  quality: {\n    type: [String, Number],\n    default: '90'\n  },\n  devicePixelRatio: {\n    type: String,\n    default: '2.0'\n  },\n  skeleton: {\n    type: String as PropType<'user' | 'photo'>,\n    default: 'photo'\n  },\n  pulse: {\n    type: Boolean,\n    default: true\n  },\n  customClasses: {\n    type: Object as PropType<CustomClasses>,\n    default: () => ({})\n  }\n});\n\n/**\n * Helper to check if a string is a full URL\n */\nconst isFullUrl = (value: string | null | undefined): boolean => {\n  if (!value) return false;\n  return value.startsWith('http://') || value.startsWith('https://') || value.startsWith('//');\n};\n\n// Computed: Direct URL source (if provided)\nconst directSrc = computed(() => {\n  // Check src prop first\n  if (props.src && isFullUrl(props.src)) {\n    return props.src;\n  }\n  \n  // Check if asset has secure_url or url\n  if (props.asset?.secure_url) {\n    return props.asset.secure_url;\n  }\n  if ((props.asset as any)?.url) {\n    return (props.asset as any).url;\n  }\n  \n  // Check if publicId or imagePublicId is actually a full URL\n  if (props.publicId && isFullUrl(props.publicId)) {\n    return props.publicId;\n  }\n  if (props.imagePublicId && isFullUrl(props.imagePublicId)) {\n    return props.imagePublicId;\n  }\n  \n  return null;\n});\n\n// Computed: Effective public ID (when not using direct URL)\nconst effectivePublicId = computed(() => {\n  // If we have a direct URL, we don't need a public ID\n  if (directSrc.value) return null;\n  \n  if (props.asset?.public_id) {\n    return props.asset.public_id;\n  }\n  return props.imagePublicId || props.publicId || props.fallbackPublicId || null;\n});\n\n// Computed: Generate Cloudinary URL from public ID\nconst generatedCloudinaryUrl = computed(() => {\n  if (!effectivePublicId.value) return null;\n  \n  const cloudName = cloudinaryConfig?.cloudName || 'demo';\n  const baseUrl = cloudinaryConfig?.baseUrl || `https://res.cloudinary.com/${cloudName}/image/upload`;\n  \n  // Build transformation string\n  const transformations: string[] = [];\n  \n  // Add width/height\n  if (props.width && props.width !== 'auto') {\n    transformations.push(`w_${props.width}`);\n  }\n  if (props.height && props.height !== 'auto') {\n    transformations.push(`h_${props.height}`);\n  }\n  \n  // Add quality\n  if (props.quality) {\n    transformations.push(`q_${props.quality}`);\n  }\n  \n  // Add DPR\n  if (props.devicePixelRatio) {\n    transformations.push(`dpr_${props.devicePixelRatio}`);\n  }\n  \n  // Auto format\n  transformations.push('f_auto');\n  \n  // Crop mode\n  transformations.push('c_fill');\n  \n  const transformString = transformations.join(',');\n  \n  return `${baseUrl}/${transformString}/${effectivePublicId.value}`;\n});\n\n// Computed: Final image URL (prefers direct URL over generated)\nconst computedImg = computed(() => {\n  // Use direct URL if available\n  if (directSrc.value) {\n    return directSrc.value;\n  }\n  \n  // Otherwise use generated Cloudinary URL\n  return generatedCloudinaryUrl.value;\n});\n\n// Skeleton component based on type\nconst skeletonComponent = computed(() => {\n  return props.skeleton === 'user' ? UserCircleIcon : PhotoIcon;\n});\n\n// Style computations\nconst computedDivStyle = computed(() => {\n  const style: Record<string, string> = {};\n  \n  if (props.width && props.width !== 'auto') {\n    style.width = typeof props.width === 'number' ? `${props.width}px` : props.width;\n  }\n  if (props.height && props.height !== 'auto') {\n    style.height = typeof props.height === 'number' ? `${props.height}px` : props.height;\n  }\n  if (props.aspectRatio) {\n    style.aspectRatio = String(props.aspectRatio);\n  }\n  \n  return style;\n});\n\nconst computedDivClass = computed(() => ({\n  'sl-relative sl-overflow-hidden': true,\n  ...props.customClasses?.div\n}));\n\nconst computedSkeletonClass = computed(() => ({\n  'sl-h-full sl-w-full sl-text-gray-200': true,\n  ...props.customClasses?.skeleton\n}));\n\nconst computedFallbackClass = computed(() => ({\n  'sl-h-full sl-w-full sl-text-gray-300': true,\n  ...props.customClasses?.fallback\n}));\n\nconst computedImageClass = computed(() => ({\n  'sl-h-full sl-w-full sl-object-cover': true,\n  ...props.customClasses?.image\n}));\n\nconst computedImageStyle = computed(() => ({\n  objectFit: 'cover' as const,\n}));\n\n// Event handlers\nconst onImageLoad = () => {\n  imageLoaded.value = true;\n  imageError.value = false;\n  emit('update:imageLoaded', true);\n};\n\nconst onImageError = (error: Event) => {\n  if (!isMounted.value) return;\n  \n  imageError.value = true;\n  imageLoaded.value = false;\n  emit('error', error);\n};\n\n// Reset state when source changes\nwatch(\n  () => computedImg.value,\n  () => {\n    imageLoaded.value = false;\n    imageError.value = false;\n  }\n);\n\n// Lifecycle\nonMounted(() => {\n  isMounted.value = true;\n});\n\nonUnmounted(() => {\n  isMounted.value = false;\n});\n</script>\n\n<style scoped>\n/* Prevent layout shift */\n[data-loading=\"true\"] {\n  min-height: 20px;\n}\n</style>\n\n"],"names":["render","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","cloudinaryConfig","inject","imageLoaded","ref","imageError","isMounted","emit","__emit","props","__props","isFullUrl","value","directSrc","computed","effectivePublicId","generatedCloudinaryUrl","cloudName","baseUrl","transformations","transformString","computedImg","skeletonComponent","UserCircleIcon","PhotoIcon","computedDivStyle","style","computedDivClass","computedSkeletonClass","computedFallbackClass","computedImageClass","computedImageStyle","onImageLoad","onImageError","error","watch","onMounted","onUnmounted","_withDirectives","_hoisted_1","_createBlock","_resolveDynamicComponent","_vShow","_hoisted_2","_hoisted_3"],"mappings":"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","x_google_ignoreList":[0,1]}

package/dist/empty-state/EmptyState.js

@@ -1,4 +1,4 @@
-import { _ as f } from "../EmptyState.vue_vue_type_script_setup_true_lang-Dxy-cLPT.js";
+import { _ as f } from "../EmptyState.vue_vue_type_script_setup_true_lang-7mcKkOWP.js";
 export {
   f as default
 };

package/dist/empty-state/index.js

@@ -1,5 +1,5 @@
 import { _ as m } from "../ComingSoon.vue_vue_type_script_setup_true_lang-CJ8FXE42.js";
-import { _ as a } from "../EmptyState.vue_vue_type_script_setup_true_lang-Dxy-cLPT.js";
+import { _ as a } from "../EmptyState.vue_vue_type_script_setup_true_lang-7mcKkOWP.js";
 export {
   m as ComingSoon,
   a as EmptyState