@stachelock/ui 0.5.5 → 0.6.2

package/dist/index.js

@@ -1,127 +1,139 @@
-import { a as It, g as Mt, s as Vt } from "./id-DafBB_QF.js";
-import { defineAsyncComponent as K, createElementBlock as d, openBlock as i, createElementVNode as s, defineComponent as T, ref as H, watch as G, createBlock as W, unref as _, withCtx as b, createVNode as m, normalizeStyle as k, createTextVNode as S, withDirectives as D, vModelText as N, Fragment as j, renderList as B, normalizeClass as v, toDisplayString as x, computed as y, createCommentVNode as g, reactive as Q, useSlots as X, renderSlot as p, Transition as U, vShow as ee } from "vue";
-import V from "./inputs/TextInput.js";
-import { useCalendar as At } from "./composables/useCalendar.js";
-import { c as Lt, u as Et } from "./useEventSegments-B-r_8zCW.js";
-import { useFormValidation as Dt } from "./composables/useFormValidation.js";
-import { U as Pt, W as Nt, d as Ut, i as Ot, u as Rt } from "./useMap-BaZEIoWM.js";
-import { useModal as Gt } from "./composables/useModal.js";
-import { useNotifications as Yt } from "./composables/useNotifications.js";
-import { g as qt, u as Zt } from "./useSimpleTabs-CSgkChEU.js";
-import { f as Qt, i as Xt, s as el, a as sl, t as tl, c as ll, b as ol, u as al } from "./useStringTransform-CSr7nZWg.js";
-import { useTabs as nl } from "./composables/useTabs.js";
-import { useTheme as Y, presetThemes as se } from "./composables/useTheme.js";
-import { _ as dl } from "./LottieAnimation.vue_vue_type_script_setup_true_lang-swmHdR0_.js";
-import { _ as te } from "./UiAvatar.vue_vue_type_script_setup_true_lang-WVY6JbUL.js";
-import { _ as F } from "./UiBadge.vue_vue_type_script_setup_true_lang-DOtbLb9x.js";
-import { _ as ul } from "./UiButtonGroup.vue_vue_type_script_setup_true_lang-CVwXB-cb.js";
-import { _ as ml } from "./UiCheckbox.vue_vue_type_script_setup_true_lang-BxyM_F-V.js";
-import { _ as le } from "./UiLoading.vue_vue_type_script_setup_true_lang-rNvtzKbq.js";
-import { _ as gl } from "./UiMenu.vue_vue_type_script_setup_true_lang-bQdfCzk6.js";
-import { _ as hl } from "./UiModal.vue_vue_type_script_setup_true_lang-CpwFUDVU.js";
-import { _ as bl } from "./UiNavLink.vue_vue_type_script_setup_true_lang-DnWMn40M.js";
-import { _ as Cl } from "./UiProgressBar.vue_vue_type_script_setup_true_lang-BCh4orZW.js";
-import { _ as wl } from "./UiTable.vue_vue_type_script_setup_true_lang-xGAiJ9rS.js";
-import { _ as _l } from "./UiTransition.vue_vue_type_script_setup_true_lang-C4jb9I-3.js";
-import { _ as Tl } from "./CalendarHeader.vue_vue_type_script_setup_true_lang-CkSUiLOH.js";
-import { _ as Ml } from "./DayCalendar.vue_vue_type_script_setup_true_lang-8al4Fotu.js";
-import { _ as jl } from "./EventCard.vue_vue_type_script_setup_true_lang-j1mtKShZ.js";
-import { _ as Bl } from "./EventsList.vue_vue_type_script_setup_true_lang-MhuVi5u8.js";
-import { _ as El } from "./MonthCalendar.vue_vue_type_style_index_0_lang-Cyzq7A9j.js";
-import { _ as Dl } from "./YearCalendar.vue_vue_type_script_setup_true_lang-CfKSpLLN.js";
-import { _ as Pl } from "./BarChart.vue_vue_type_script_setup_true_lang-xCb0DCbf.js";
-import { _ as Ul } from "./FunnelChart.vue_vue_type_script_setup_true_lang-B4pH6xCV.js";
-import { _ as Rl } from "./LineChart.vue_vue_type_script_setup_true_lang-DJo0edLJ.js";
-import { _ as Gl } from "./PieChart.vue_vue_type_script_setup_true_lang-e3wsA9O4.js";
-import { _ as Yl } from "./SparklineChart.vue_vue_type_script_setup_true_lang-BlNk5ZqM.js";
-import { _ as ql } from "./StatCard.vue_vue_type_script_setup_true_lang-BfFupfmC.js";
-import { _ as Kl } from "./ComingSoon.vue_vue_type_script_setup_true_lang-CJ8FXE42.js";
-import { _ as Xl } from "./EmptyState.vue_vue_type_script_setup_true_lang-7mcKkOWP.js";
-import { _ as so } from "./DynamicForm.vue_vue_type_script_setup_true_lang-CxSaO5Cl.js";
-import { _ as lo } from "./DynamicFormField.vue_vue_type_script_setup_true_lang-CSLSRFM7.js";
-import { _ as ao } from "./AddDeleteButtonGroup.vue_vue_type_script_setup_true_lang-CFS3lVF-.js";
-import { _ as oe } from "./CheckboxInput.vue_vue_type_script_setup_true_lang-BikR9rgi.js";
-import { _ as ae } from "./ComboboxInput.vue_vue_type_script_setup_true_lang-kEj-NYqm.js";
-import { _ as no } from "./DatepickerInput.vue_vue_type_style_index_0_lang-BdkGLw0H.js";
-import { _ as co } from "./EmailInput.vue_vue_type_script_setup_true_lang-BicPMIop.js";
-import { _ as fo } from "./EmptyInput.vue_vue_type_script_setup_true_lang-FWDCFF2c.js";
-import { _ as po } from "./FileDropzoneInput.vue_vue_type_script_setup_true_lang-CclXceTb.js";
-import { _ as xo } from "./HiddenInput.vue_vue_type_script_setup_true_lang-PtGZ4eLW.js";
-import { _ as re } from "./TextAreaInput.vue_vue_type_script_setup_true_lang-Cf0MJobG.js";
-import { _ as ne } from "./SwitchInput.vue_vue_type_script_setup_true_lang-C88FcxuK.js";
-import { _ as O } from "./SelectInput.vue_vue_type_script_setup_true_lang-DHiZ-7K2.js";
-import { _ as yo } from "./SelectTextInput.vue_vue_type_script_setup_true_lang-DYrXW14A.js";
-import { _ as vo } from "./SwitchInputGroup.vue_vue_type_script_setup_true_lang-CK9JWl4F.js";
-import { _ as ko } from "./TagifyInput.vue_vue_type_script_setup_true_lang-Da6-pRJ2.js";
-import { _ as $o } from "./DashboardLayout.vue_vue_type_script_setup_true_lang-B0M6-9os.js";
-import { _ as So } from "./DefaultLayout.vue_vue_type_script_setup_true_lang-BZAz6aC-.js";
-import { _ as Io } from "./HeaderLayout.vue_vue_type_script_setup_true_lang-BY2G6hCc.js";
-import { _ as Vo } from "./NavigationGroup.vue_vue_type_script_setup_true_lang-BWq5fpEm.js";
-import { _ as Ao } from "./NavigationItem.vue_vue_type_script_setup_true_lang-C8aX-84Q.js";
-import { _ as Lo } from "./ProfileHeaderAvatar.vue_vue_type_script_setup_true_lang-CKCoHD1o.js";
-import { _ as Fo } from "./ProjectLogo.vue_vue_type_script_setup_true_lang-DYjp-RNh.js";
-import { _ as zo } from "./SidebarLayout.vue_vue_type_script_setup_true_lang-BJ5jadgZ.js";
-import { _ as No } from "./UiMapAll.vue_vue_type_script_setup_true_lang-CMAyvJMk.js";
-import { _ as Oo } from "./AlertModal.vue_vue_type_script_setup_true_lang-C6q8Mpl4.js";
-import { _ as Ho } from "./BaseModal.vue_vue_type_script_setup_true_lang-B67Pt3tW.js";
-import { _ as Wo } from "./NotificationContainer.vue_vue_type_style_index_0_lang-DSfNw4Ge.js";
-import { _ as Jo } from "./NotificationToast.vue_vue_type_script_setup_true_lang-CU__ORw8.js";
-import { _ as Zo } from "./StepperPanels.vue_vue_type_script_setup_true_lang-D6Fv7iz3.js";
-import { _ as Qo } from "./InlineTabs.vue_vue_type_script_setup_true_lang-CD0lnkUm.js";
-import { _ as ea } from "./TabGroup.vue_vue_type_script_setup_true_lang-DVVeOgWH.js";
-import { _ as ta } from "./TabGroupUnderline.vue_vue_type_script_setup_true_lang-_3XtOn3w.js";
-import { _ as oa } from "./TabsInPills.vue_vue_type_script_setup_true_lang-DY1NkXCQ.js";
-import { _ as ra } from "./BackgroundGradientWrapper.vue_vue_type_script_setup_true_lang-C8msTrTn.js";
-import { _ as ia } from "./CardWrapper.vue_vue_type_script_setup_true_lang-D59QBAi9.js";
-import { _ as ca } from "./DisclosureWrapper.vue_vue_type_script_setup_true_lang-C7y2bNhW.js";
-import { _ as fa } from "./FormErrorWrapper.vue_vue_type_script_setup_true_lang-BQOlG_ab.js";
-import { default as pa } from "./components/CloudinaryImage.js";
-import A from "./components/Button.js";
-import { S as ie, h as R } from "./transition-_rPfnoET.js";
-import { Y as de, G as ce, V as ue } from "./dialog-BJ2Ld8l3.js";
-import { r as fe } from "./XMarkIcon-Cwy3T6p8.js";
-import { _ as J } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import { default as xa } from "./components/Banner.js";
-import { default as ya } from "./components/Breadcrumb.js";
-import { default as va } from "./components/LoadingDots.js";
-import { default as ka } from "./calendars/CalendarDashboard.js";
-import { default as $a } from "./calendars/WeekCalendar.js";
-import { default as Sa } from "./charts/BaseChart.js";
-import { areaChartConfig as Ia, barChartConfig as Ma, baseTheme as Va, chartColors as ja, chartTypography as Aa, formatDuration as Ba, formatNumber as La, formatPercentage as Ea, funnelChartConfig as Fa, getAreaGradient as Da, hexToRgb as za, lineChartConfig as Pa, pieChartConfig as Na, stachelockColors as Ua, toRgba as Oa } from "./charts/chartTheme.js";
-import { default as Ha } from "./forms/FormFieldWrapper.js";
-import { default as Wa } from "./inputs/PhoneInput.js";
-import { default as Ja } from "./inputs/RichTextInput.js";
-import { default as Za } from "./loading/ContentSkeleton.js";
-import { default as Qa } from "./loading/SmartLoadingIndicator.js";
-import { default as er } from "./maps/GoogleMap.js";
-import { default as tr } from "./maps/UiInfoWindow.js";
-import { default as or } from "./maps/UiMap.js";
-import { default as rr } from "./maps/UiMapMarker.js";
-import { default as ir } from "./modals/ImageCropperModal.js";
-const me = {
+import { g as Xe } from "./id-DafBB_QF.js";
+import { a as kr, s as wr } from "./id-DafBB_QF.js";
+import { defineAsyncComponent as qe, defineComponent as F, ref as K, watch as de, createBlock as D, openBlock as i, unref as _, withCtx as T, createVNode as C, createElementVNode as s, normalizeStyle as O, createTextVNode as j, withDirectives as me, vModelText as ve, createElementBlock as m, Fragment as G, renderList as Y, normalizeClass as E, toDisplayString as w, computed as b, createCommentVNode as k, withKeys as ke, withModifiers as Te, renderSlot as M, resolveDynamicComponent as ge, h as ne, inject as Le, onMounted as Je, reactive as Me, useSlots as Pe, Transition as we, vShow as Ze } from "vue";
+import R from "./inputs/TextInput.js";
+import { useCalendar as $r } from "./composables/useCalendar.js";
+import { u as Qe, v as ye } from "./useCollectionEditor-BYyoAT0U.js";
+import { C as Ir } from "./useCollectionEditor-BYyoAT0U.js";
+import { c as zr, u as Tr } from "./useEventSegments-B-r_8zCW.js";
+import { useFormValidation as Mr } from "./composables/useFormValidation.js";
+import { U as Er, W as Ar, d as Dr, i as Fr, u as Nr } from "./useMap-BGg0H582.js";
+import { useModal as Vr } from "./composables/useModal.js";
+import { useNotifications as jr } from "./composables/useNotifications.js";
+import { g as Rr, u as Hr } from "./useSimpleTabs-CSgkChEU.js";
+import { f as Kr, i as Wr, s as Yr, a as Xr, t as qr, c as Jr, b as Zr, u as Qr } from "./useStringTransform-CSr7nZWg.js";
+import { useTabs as tn } from "./composables/useTabs.js";
+import { useTheme as Ee, presetThemes as et } from "./composables/useTheme.js";
+import { _ as ln } from "./LottieAnimation.vue_vue_type_script_setup_true_lang-C0R4ADBb.js";
+import { _ as tt } from "./UiAvatar.vue_vue_type_script_setup_true_lang-WVY6JbUL.js";
+import { _ as ue } from "./UiBadge.vue_vue_type_script_setup_true_lang-DOtbLb9x.js";
+import { _ as on } from "./UiButtonGroup.vue_vue_type_script_setup_true_lang-CVwXB-cb.js";
+import { _ as nn } from "./UiCheckbox.vue_vue_type_script_setup_true_lang-BxyM_F-V.js";
+import { _ as st } from "./UiLoading.vue_vue_type_script_setup_true_lang-rNvtzKbq.js";
+import { _ as cn } from "./UiMenu.vue_vue_type_script_setup_true_lang-gnoIJm6x.js";
+import { _ as mn } from "./UiModal.vue_vue_type_script_setup_true_lang-BZC7aN7K.js";
+import { _ as pn } from "./UiNavLink.vue_vue_type_script_setup_true_lang-C5Gicm8o.js";
+import { _ as yn } from "./UiProgressBar.vue_vue_type_script_setup_true_lang-BCh4orZW.js";
+import { _ as xn } from "./UiTable.vue_vue_type_script_setup_true_lang-xGAiJ9rS.js";
+import { _ as vn } from "./UiTransition.vue_vue_type_script_setup_true_lang-C4jb9I-3.js";
+import { _ as wn } from "./CalendarHeader.vue_vue_type_script_setup_true_lang-hGa2MLyo.js";
+import { _ as $n } from "./DayCalendar.vue_vue_type_script_setup_true_lang-D-4jcUvI.js";
+import { _ as In } from "./EventCard.vue_vue_type_script_setup_true_lang-B3TP-mWX.js";
+import { _ as zn } from "./EventsList.vue_vue_type_script_setup_true_lang-BTIoGr_e.js";
+import { _ as Ln } from "./MonthCalendar.vue_vue_type_style_index_0_lang-lnKkvJ9u.js";
+import { _ as Pn } from "./YearCalendar.vue_vue_type_script_setup_true_lang-CfKSpLLN.js";
+import { _ as An } from "./BarChart.vue_vue_type_script_setup_true_lang-xCb0DCbf.js";
+import { _ as Fn } from "./FunnelChart.vue_vue_type_script_setup_true_lang-B4pH6xCV.js";
+import { _ as Un } from "./LineChart.vue_vue_type_script_setup_true_lang-DJo0edLJ.js";
+import { _ as Bn } from "./PieChart.vue_vue_type_script_setup_true_lang-e3wsA9O4.js";
+import { _ as On } from "./SparklineChart.vue_vue_type_script_setup_true_lang-BlNk5ZqM.js";
+import { _ as Hn } from "./StatCard.vue_vue_type_script_setup_true_lang-B5SuaSXL.js";
+import { format as q, differenceInYears as ce, differenceInMonths as Ae, isValid as J, parseISO as re } from "date-fns";
+import { _ as lt } from "./AddDeleteButtonGroup.vue_vue_type_script_setup_true_lang-6taLcPq0.js";
+import { _ as at } from "./DynamicForm.vue_vue_type_script_setup_true_lang-BR8Pq7Kw.js";
+import { _ as ot } from "./AlertModal.vue_vue_type_script_setup_true_lang-DzhVQdx4.js";
+import { _ as Z } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import { _ as Kn } from "./ComingSoon.vue_vue_type_script_setup_true_lang-CJ8FXE42.js";
+import { _ as Yn } from "./EmptyState.vue_vue_type_script_setup_true_lang-7mcKkOWP.js";
+import { _ as qn } from "./DynamicFormField.vue_vue_type_script_setup_true_lang-BCVmqg_n.js";
+import { _ as rt } from "./CheckboxInput.vue_vue_type_script_setup_true_lang-BikR9rgi.js";
+import { _ as nt } from "./ComboboxInput.vue_vue_type_script_setup_true_lang-BigvbBAU.js";
+import { _ as Zn } from "./DatepickerInput.vue_vue_type_style_index_0_lang-DbI3619T.js";
+import { _ as ei } from "./EmailInput.vue_vue_type_script_setup_true_lang-BicPMIop.js";
+import { _ as si } from "./EmptyInput.vue_vue_type_script_setup_true_lang-FWDCFF2c.js";
+import { _ as ai } from "./FileDropzoneInput.vue_vue_type_script_setup_true_lang-BJR-_ngq.js";
+import { _ as ri } from "./HiddenInput.vue_vue_type_script_setup_true_lang-PtGZ4eLW.js";
+import { _ as it } from "./TextAreaInput.vue_vue_type_script_setup_true_lang-Cf0MJobG.js";
+import { _ as dt } from "./SwitchInput.vue_vue_type_script_setup_true_lang-D5Es9AjF.js";
+import { _ as Ce } from "./SelectInput.vue_vue_type_script_setup_true_lang-D4GNv0MY.js";
+import { _ as ii } from "./SelectTextInput.vue_vue_type_script_setup_true_lang-BVaViHPl.js";
+import { _ as ci } from "./SwitchInputGroup.vue_vue_type_script_setup_true_lang-DigNYqVZ.js";
+import { _ as mi } from "./TagifyInput.vue_vue_type_script_setup_true_lang-BF2mK8JC.js";
+import { _ as pi } from "./DashboardLayout.vue_vue_type_script_setup_true_lang-BAx4gKqh.js";
+import { _ as yi } from "./DefaultLayout.vue_vue_type_script_setup_true_lang-BZAz6aC-.js";
+import { _ as xi } from "./HeaderLayout.vue_vue_type_script_setup_true_lang-BY2G6hCc.js";
+import { _ as vi } from "./NavigationGroup.vue_vue_type_script_setup_true_lang-BWq5fpEm.js";
+import { _ as wi } from "./NavigationItem.vue_vue_type_script_setup_true_lang-C8aX-84Q.js";
+import { _ as $i } from "./ProfileHeaderAvatar.vue_vue_type_script_setup_true_lang-CKCoHD1o.js";
+import { _ as Ii } from "./ProjectLogo.vue_vue_type_script_setup_true_lang-DYjp-RNh.js";
+import { _ as zi } from "./SidebarLayout.vue_vue_type_script_setup_true_lang-CZ21EVcZ.js";
+import { _ as Li } from "./UiMapAll.vue_vue_type_script_setup_true_lang-11yT7mTH.js";
+import { _ as Pi } from "./BaseModal.vue_vue_type_script_setup_true_lang--iGzFCnC.js";
+import { _ as Ai } from "./NotificationContainer.vue_vue_type_style_index_0_lang-CvJRwezr.js";
+import { _ as Fi } from "./NotificationToast.vue_vue_type_script_setup_true_lang-BBWpW4km.js";
+import { SwatchIcon as ct, XMarkIcon as ut, ClockIcon as $e, ExclamationCircleIcon as mt, CheckCircleIcon as ft, PhoneIcon as _e, EnvelopeIcon as pt, GlobeAltIcon as gt, CakeIcon as De, CalendarDaysIcon as yt, BriefcaseIcon as ht, BuildingOfficeIcon as xt, MapPinIcon as Ie, BuildingLibraryIcon as bt, UserGroupIcon as vt } from "@heroicons/vue/24/outline";
+import { _ as Ui } from "./StepperPanels.vue_vue_type_script_setup_true_lang-DPLQ9mQn.js";
+import { _ as Bi } from "./InlineTabs.vue_vue_type_script_setup_true_lang-B5w4yzcZ.js";
+import { _ as Oi } from "./TabGroup.vue_vue_type_script_setup_true_lang-BsbiEA4E.js";
+import { _ as Hi } from "./TabGroupUnderline.vue_vue_type_script_setup_true_lang-CPcp1-Za.js";
+import { _ as Ki } from "./TabsInPills.vue_vue_type_script_setup_true_lang-U5CdRL7s.js";
+import { _ as Yi } from "./BackgroundGradientWrapper.vue_vue_type_script_setup_true_lang-C8msTrTn.js";
+import { _ as qi } from "./CardWrapper.vue_vue_type_script_setup_true_lang-D59QBAi9.js";
+import { _ as Zi } from "./DisclosureWrapper.vue_vue_type_script_setup_true_lang-CgHPOC-w.js";
+import { _ as ed } from "./FormErrorWrapper.vue_vue_type_script_setup_true_lang-D7ZAgfPs.js";
+import { default as sd } from "./components/CloudinaryImage.js";
+import { TransitionRoot as fe, Dialog as kt, TransitionChild as Se, DialogPanel as wt, DialogTitle as Ct, Combobox as $t, ComboboxInput as _t, ComboboxButton as It, ComboboxOptions as St, ComboboxOption as zt } from "@headlessui/vue";
+import oe from "./components/Button.js";
+import { default as ad } from "./components/Banner.js";
+import { default as rd } from "./components/Breadcrumb.js";
+import { default as id } from "./components/LoadingDots.js";
+import { default as cd } from "./calendars/CalendarDashboard.js";
+import { default as md } from "./calendars/WeekCalendar.js";
+import { default as pd } from "./charts/BaseChart.js";
+import { areaChartConfig as yd, barChartConfig as hd, baseTheme as xd, chartColors as bd, chartTypography as vd, formatDuration as kd, formatNumber as wd, formatPercentage as Cd, funnelChartConfig as $d, getAreaGradient as _d, hexToRgb as Id, lineChartConfig as Sd, pieChartConfig as zd, stachelockColors as Td, toRgba as Ld } from "./charts/chartTheme.js";
+import Tt from "./forms/FormFieldWrapper.js";
+import { LockClosedIcon as Lt, MagnifyingGlassIcon as Mt, CheckIcon as Pt, ChevronDownIcon as Et, ChevronUpIcon as At } from "@heroicons/vue/20/solid";
+import { useField as Dt } from "vee-validate";
+import { debounce as ze } from "lodash-es";
+import { Loader as Ft } from "@googlemaps/js-api-loader";
+import { default as Pd } from "./inputs/PhoneInput.js";
+import { default as Ad } from "./inputs/RichTextInput.js";
+import { default as Fd } from "./loading/ContentSkeleton.js";
+import { default as Ud } from "./loading/SmartLoadingIndicator.js";
+import { default as Bd } from "./maps/GoogleMap.js";
+import { default as Od } from "./maps/UiInfoWindow.js";
+import { default as Hd } from "./maps/UiMap.js";
+import { default as Kd } from "./maps/UiMapMarker.js";
+import { default as Yd } from "./modals/ImageCropperModal.js";
+import { XMarkIcon as Nt, XCircleIcon as Ut } from "@heroicons/vue/24/solid";
+var Vt = /* @__PURE__ */ ((e) => (e.Verified = "verified", e.Error = "error", e.Unverified = "unverified", e.Pending = "pending", e))(Vt || {});
+function er(e) {
+  return ["street", "city", "state", "zipcode", "country"].includes(e);
+}
+const Bt = {
   text: {
     component: "TextInput",
-    loader: () => Promise.resolve(V)
+    loader: () => Promise.resolve(R)
   },
   email: {
     component: "TextInput",
-    loader: () => Promise.resolve(V)
+    loader: () => Promise.resolve(R)
   },
   password: {
     component: "TextInput",
-    loader: () => Promise.resolve(V)
+    loader: () => Promise.resolve(R)
   },
   number: {
     component: "TextInput",
-    loader: () => Promise.resolve(V)
+    loader: () => Promise.resolve(R)
   },
   tel: {
     component: "TextInput",
-    loader: () => Promise.resolve(V)
+    loader: () => Promise.resolve(R)
   },
   url: {
     component: "TextInput",
-    loader: () => Promise.resolve(V)
+    loader: () => Promise.resolve(R)
   },
   textarea: {
     component: "TextAreaInput",
@@ -144,35 +156,35 @@ const me = {
     loader: () => import("./inputs/SwitchInput.js")
   }
 };
-class pe {
-  componentMap = { ...me };
+class jt {
+  componentMap = { ...Bt };
   loadedComponents = /* @__PURE__ */ new Map();
   /**
    * Register a new component type
    */
-  register(e, o, l) {
-    this.componentMap[e] = { component: o, loader: l }, this.loadedComponents.delete(e);
+  register(t, a, l) {
+    this.componentMap[t] = { component: a, loader: l }, this.loadedComponents.delete(t);
   }
   /**
    * Get a component for a field type
    */
-  getComponent(e) {
-    const o = this.componentMap[e];
-    if (!o)
-      return console.warn(`Component type "${e}" is not registered`), null;
-    if (this.loadedComponents.has(e))
-      return this.loadedComponents.get(e);
-    const l = K({
-      loader: o.loader,
+  getComponent(t) {
+    const a = this.componentMap[t];
+    if (!a)
+      return console.warn(`Component type "${t}" is not registered`), null;
+    if (this.loadedComponents.has(t))
+      return this.loadedComponents.get(t);
+    const l = qe({
+      loader: a.loader,
       delay: 0
     });
-    return this.loadedComponents.set(e, l), l;
+    return this.loadedComponents.set(t, l), l;
   }
   /**
    * Check if a component type is registered
    */
-  hasComponent(e) {
-    return e in this.componentMap;
+  hasComponent(t) {
+    return t in this.componentMap;
   }
   /**
    * Get all registered component types
@@ -183,8 +195,8 @@ class pe {
   /**
    * Unregister a component type
    */
-  unregister(e) {
-    delete this.componentMap[e], this.loadedComponents.delete(e);
+  unregister(t) {
+    delete this.componentMap[t], this.loadedComponents.delete(t);
   }
   /**
    * Clear all cached components
@@ -193,14 +205,14 @@ class pe {
     this.loadedComponents.clear();
   }
 }
-const q = new pe();
-function mt(t, e, o) {
-  q.register(t, e, o);
+const Fe = new jt();
+function tr(e, t, a) {
+  Fe.register(e, t, a);
 }
-function pt(t) {
-  return q.getComponent(t);
+function sr(e) {
+  return Fe.getComponent(e);
 }
-const Z = {
+const Ne = {
   colors: {
     primary: {
       50: "#edeff9",
@@ -303,169 +315,152 @@ const Z = {
     "2xl": "1536px"
   }
 };
-function ge(t, e = Z) {
-  const o = { ...e };
-  function l(r, f) {
-    if (f && typeof f == "object" && !Array.isArray(f)) {
-      for (const a in f)
-        if (Object.prototype.hasOwnProperty.call(f, a)) {
-          const u = r[a], C = f[a];
-          u && typeof u == "object" && !Array.isArray(u) && C && typeof C == "object" && !Array.isArray(C) ? r[a] = l(u, C) : r[a] = C;
+function Ot(e, t = Ne) {
+  const a = { ...t };
+  function l(d, u) {
+    if (u && typeof u == "object" && !Array.isArray(u)) {
+      for (const n in u)
+        if (Object.prototype.hasOwnProperty.call(u, n)) {
+          const o = d[n], g = u[n];
+          o && typeof o == "object" && !Array.isArray(o) && g && typeof g == "object" && !Array.isArray(g) ? d[n] = l(o, g) : d[n] = g;
         }
     }
-    return r;
+    return d;
   }
-  return l(o, t);
+  return l(a, e);
 }
-function xe(t) {
-  let e = `:root {
+function Rt(e) {
+  let t = `:root {
 `;
-  return t.colors && Object.entries(t.colors).forEach(([o, l]) => {
-    typeof l == "object" && l !== null && Object.entries(l).forEach(([r, f]) => {
-      const a = r === "DEFAULT" ? o : `${o}-${r}`;
-      e += `  --sl-color-${a}: ${f};
+  return e.colors && Object.entries(e.colors).forEach(([a, l]) => {
+    typeof l == "object" && l !== null && Object.entries(l).forEach(([d, u]) => {
+      const n = d === "DEFAULT" ? a : `${a}-${d}`;
+      t += `  --sl-color-${n}: ${u};
 `;
-      const u = he(f);
-      u && (e += `  --sl-color-${a}-rgb: ${u};
+      const o = Ht(u);
+      o && (t += `  --sl-color-${n}-rgb: ${o};
 `);
     });
-  }), t.spacing && Object.entries(t.spacing).forEach(([o, l]) => {
-    e += `  --sl-spacing-${o}: ${l};
+  }), e.spacing && Object.entries(e.spacing).forEach(([a, l]) => {
+    t += `  --sl-spacing-${a}: ${l};
 `;
-  }), t.borderRadius && Object.entries(t.borderRadius).forEach(([o, l]) => {
-    const r = o === "DEFAULT" ? "radius" : `radius-${o}`;
-    e += `  --sl-${r}: ${l};
+  }), e.borderRadius && Object.entries(e.borderRadius).forEach(([a, l]) => {
+    const d = a === "DEFAULT" ? "radius" : `radius-${a}`;
+    t += `  --sl-${d}: ${l};
 `;
-  }), t.shadows && Object.entries(t.shadows).forEach(([o, l]) => {
-    const r = o === "DEFAULT" ? "shadow" : `shadow-${o}`;
-    e += `  --sl-${r}: ${l};
+  }), e.shadows && Object.entries(e.shadows).forEach(([a, l]) => {
+    const d = a === "DEFAULT" ? "shadow" : `shadow-${a}`;
+    t += `  --sl-${d}: ${l};
 `;
-  }), t.typography && (t.typography.fontFamily && Object.entries(t.typography.fontFamily).forEach(([o, l]) => {
-    e += `  --sl-font-family-${o}: ${l.join(", ")};
+  }), e.typography && (e.typography.fontFamily && Object.entries(e.typography.fontFamily).forEach(([a, l]) => {
+    t += `  --sl-font-family-${a}: ${l.join(", ")};
 `;
-  }), t.typography.fontSize && Object.entries(t.typography.fontSize).forEach(([o, l]) => {
-    e += `  --sl-font-size-${o}: ${l};
+  }), e.typography.fontSize && Object.entries(e.typography.fontSize).forEach(([a, l]) => {
+    t += `  --sl-font-size-${a}: ${l};
 `;
-  })), t.breakpoints && Object.entries(t.breakpoints).forEach(([o, l]) => {
-    e += `  --sl-breakpoint-${o}: ${l};
+  })), e.breakpoints && Object.entries(e.breakpoints).forEach(([a, l]) => {
+    t += `  --sl-breakpoint-${a}: ${l};
 `;
-  }), e += `  --sl-ring-color: var(--sl-color-stachelock-600, #3e4b9a);
-`, e += `  --sl-ring-offset-color: #ffffff;
-`, e += `  --sl-ring-width: 2px;
-`, e += `  --sl-outline-color: var(--sl-color-stachelock-600, #3e4b9a);
-`, e += `  --sl-outline-width: 2px;
-`, e += `}
+  }), t += `  --sl-ring-color: var(--sl-color-stachelock-600, #3e4b9a);
+`, t += `  --sl-ring-offset-color: #ffffff;
+`, t += `  --sl-ring-width: 2px;
+`, t += `  --sl-outline-color: var(--sl-color-stachelock-600, #3e4b9a);
+`, t += `  --sl-outline-width: 2px;
+`, t += `}
 
-`, e += `@media (prefers-color-scheme: dark) {
-`, e += `  :root {
-`, e += `    --sl-ring-color: var(--sl-color-stachelock-600, #3e4b9a);
-`, e += `  }
-`, e += `}
-`, e;
+`, t += `@media (prefers-color-scheme: dark) {
+`, t += `  :root {
+`, t += `    --sl-ring-color: var(--sl-color-stachelock-600, #3e4b9a);
+`, t += `  }
+`, t += `}
+`, t;
 }
-function gt(t) {
-  let e = `export default {
+function lr(e) {
+  let t = `export default {
 `;
-  return e += `  prefix: "sl-",
-`, e += `  theme: {
-`, e += `    extend: {
-`, t.colors && (e += `      colors: {
-`, Object.entries(t.colors).forEach(([o, l]) => {
-    typeof l == "object" && l !== null && (e += `        "${o}": {
-`, Object.entries(l).forEach(([r, f]) => {
-      e += `          "${r === "DEFAULT" ? "DEFAULT" : r}": "${f}",
+  return t += `  prefix: "sl-",
+`, t += `  theme: {
+`, t += `    extend: {
+`, e.colors && (t += `      colors: {
+`, Object.entries(e.colors).forEach(([a, l]) => {
+    typeof l == "object" && l !== null && (t += `        "${a}": {
+`, Object.entries(l).forEach(([d, u]) => {
+      t += `          "${d === "DEFAULT" ? "DEFAULT" : d}": "${u}",
 `;
-    }), e += `        },
+    }), t += `        },
 `);
-  }), e += `      },
-`), t.spacing && (e += `      spacing: {
-`, Object.entries(t.spacing).forEach(([o, l]) => {
-    e += `        "${o}": "${l}",
+  }), t += `      },
+`), e.spacing && (t += `      spacing: {
+`, Object.entries(e.spacing).forEach(([a, l]) => {
+    t += `        "${a}": "${l}",
 `;
-  }), e += `      },
-`), t.borderRadius && (e += `      borderRadius: {
-`, Object.entries(t.borderRadius).forEach(([o, l]) => {
-    e += `        "${o === "DEFAULT" ? "DEFAULT" : o}": "${l}",
+  }), t += `      },
+`), e.borderRadius && (t += `      borderRadius: {
+`, Object.entries(e.borderRadius).forEach(([a, l]) => {
+    t += `        "${a === "DEFAULT" ? "DEFAULT" : a}": "${l}",
 `;
-  }), e += `      },
-`), t.shadows && (e += `      boxShadow: {
-`, Object.entries(t.shadows).forEach(([o, l]) => {
-    e += `        "${o === "DEFAULT" ? "DEFAULT" : o}": "${l}",
+  }), t += `      },
+`), e.shadows && (t += `      boxShadow: {
+`, Object.entries(e.shadows).forEach(([a, l]) => {
+    t += `        "${a === "DEFAULT" ? "DEFAULT" : a}": "${l}",
 `;
-  }), e += `      },
-`), t.typography && (t.typography.fontFamily && (e += `      fontFamily: {
-`, Object.entries(t.typography.fontFamily).forEach(([o, l]) => {
-    e += `        "${o}": [${l.map((r) => `"${r}"`).join(", ")}],
+  }), t += `      },
+`), e.typography && (e.typography.fontFamily && (t += `      fontFamily: {
+`, Object.entries(e.typography.fontFamily).forEach(([a, l]) => {
+    t += `        "${a}": [${l.map((d) => `"${d}"`).join(", ")}],
 `;
-  }), e += `      },
-`), t.typography.fontSize && (e += `      fontSize: {
-`, Object.entries(t.typography.fontSize).forEach(([o, l]) => {
-    e += `        "${o}": "${l}",
+  }), t += `      },
+`), e.typography.fontSize && (t += `      fontSize: {
+`, Object.entries(e.typography.fontSize).forEach(([a, l]) => {
+    t += `        "${a}": "${l}",
 `;
-  }), e += `      },
-`)), e += `    },
-`, e += `  },
-`, e += `};
-`, e;
-}
-function he(t) {
-  if (typeof t != "string") return null;
-  let e = t.trim();
-  if (!e.startsWith("#") || (e = e.slice(1), e.length === 3 && (e = e.split("").map((f) => f + f).join("")), e.length !== 6)) return null;
-  const o = parseInt(e.slice(0, 2), 16), l = parseInt(e.slice(2, 4), 16), r = parseInt(e.slice(4, 6), 16);
-  return Number.isNaN(o) || Number.isNaN(l) || Number.isNaN(r) ? null : `${o} ${l} ${r}`;
+  }), t += `      },
+`)), t += `    },
+`, t += `  },
+`, t += `};
+`, t;
 }
-function ye(t, e) {
-  return i(), d("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    "stroke-width": "1.5",
-    stroke: "currentColor",
-    "aria-hidden": "true",
-    "data-slot": "icon"
-  }, [
-    s("path", {
-      "stroke-linecap": "round",
-      "stroke-linejoin": "round",
-      d: "M4.098 19.902a3.75 3.75 0 0 0 5.304 0l6.401-6.402M6.75 21A3.75 3.75 0 0 1 3 17.25V4.125C3 3.504 3.504 3 4.125 3h5.25c.621 0 1.125.504 1.125 1.125v4.072M6.75 21a3.75 3.75 0 0 0 3.75-3.75V8.197M6.75 21h13.125c.621 0 1.125-.504 1.125-1.125v-5.25c0-.621-.504-1.125-1.125-1.125h-4.072M10.5 8.197l2.88-2.88c.438-.439 1.15-.439 1.59 0l3.712 3.713c.44.44.44 1.152 0 1.59l-2.879 2.88M6.75 17.25h.008v.008H6.75v-.008Z"
-    })
-  ]);
+function Ht(e) {
+  if (typeof e != "string") return null;
+  let t = e.trim();
+  if (!t.startsWith("#") || (t = t.slice(1), t.length === 3 && (t = t.split("").map((u) => u + u).join("")), t.length !== 6)) return null;
+  const a = parseInt(t.slice(0, 2), 16), l = parseInt(t.slice(2, 4), 16), d = parseInt(t.slice(4, 6), 16);
+  return Number.isNaN(a) || Number.isNaN(l) || Number.isNaN(d) ? null : `${a} ${l} ${d}`;
 }
-const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto" }, ve = { class: "sl-flex sl-min-h-full sl-items-center sl-justify-center sl-p-4" }, Ce = { class: "sl-bg-gradient-to-r sl-from-gray-900 sl-to-gray-800 sl-px-6 sl-py-4" }, ke = { class: "sl-flex sl-items-center sl-justify-between" }, we = { class: "sl-flex sl-items-center sl-gap-3" }, $e = { class: "sl-p-6 sl-space-y-6" }, _e = { class: "sl-flex sl-items-center sl-gap-4" }, Se = { class: "sl-relative" }, Te = { class: "sl-flex-1" }, Ie = { class: "sl-grid sl-grid-cols-2 sl-gap-2" }, Me = ["onClick"], Ve = { class: "sl-min-w-0" }, je = { class: "sl-text-sm sl-font-medium sl-text-gray-900 dark:sl-text-white sl-truncate" }, Ae = { class: "sl-text-xs sl-text-gray-500 dark:sl-text-gray-400 sl-truncate" }, Be = { class: "sl-rounded-xl sl-border sl-border-gray-200 dark:sl-border-slate-600 sl-bg-gray-50 dark:sl-bg-slate-900 sl-p-4 sl-space-y-4" }, Le = { class: "sl-flex sl-flex-wrap sl-gap-2" }, Ee = { class: "sl-flex sl-flex-wrap sl-gap-2" }, Fe = { class: "sl-flex sl-items-center sl-gap-4" }, De = { class: "sl-flex sl-items-center sl-gap-3" }, ze = { class: "sl-flex sl-rounded-lg sl-overflow-hidden sl-shadow-sm dark:sl-shadow-slate-900/50" }, Pe = { class: "sl-border-t sl-border-gray-200 dark:sl-border-slate-700 sl-bg-gray-50 dark:sl-bg-slate-900 sl-px-6 sl-py-4" }, Ne = { class: "sl-flex sl-items-center sl-justify-between" }, Ue = { class: "sl-flex sl-gap-3" }, Oe = /* @__PURE__ */ T({
+const Gt = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto" }, Kt = { class: "sl-flex sl-min-h-full sl-items-center sl-justify-center sl-p-4" }, Wt = { class: "sl-bg-gradient-to-r sl-from-gray-900 sl-to-gray-800 sl-px-6 sl-py-4" }, Yt = { class: "sl-flex sl-items-center sl-justify-between" }, Xt = { class: "sl-flex sl-items-center sl-gap-3" }, qt = { class: "sl-p-6 sl-space-y-6" }, Jt = { class: "sl-flex sl-items-center sl-gap-4" }, Zt = { class: "sl-relative" }, Qt = { class: "sl-flex-1" }, es = { class: "sl-grid sl-grid-cols-2 sl-gap-2" }, ts = ["onClick"], ss = { class: "sl-min-w-0" }, ls = { class: "sl-text-sm sl-font-medium sl-text-gray-900 dark:sl-text-white sl-truncate" }, as = { class: "sl-text-xs sl-text-gray-500 dark:sl-text-gray-400 sl-truncate" }, os = { class: "sl-rounded-xl sl-border sl-border-gray-200 dark:sl-border-slate-600 sl-bg-gray-50 dark:sl-bg-slate-900 sl-p-4 sl-space-y-4" }, rs = { class: "sl-flex sl-flex-wrap sl-gap-2" }, ns = { class: "sl-flex sl-flex-wrap sl-gap-2" }, is = { class: "sl-flex sl-items-center sl-gap-4" }, ds = { class: "sl-flex sl-items-center sl-gap-3" }, cs = { class: "sl-flex sl-rounded-lg sl-overflow-hidden sl-shadow-sm dark:sl-shadow-slate-900/50" }, us = { class: "sl-border-t sl-border-gray-200 dark:sl-border-slate-700 sl-bg-gray-50 dark:sl-bg-slate-900 sl-px-6 sl-py-4" }, ms = { class: "sl-flex sl-items-center sl-justify-between" }, fs = { class: "sl-flex sl-gap-3" }, ps = /* @__PURE__ */ F({
   __name: "ThemeDebugModal",
   props: {
     modelValue: { type: Boolean }
   },
   emits: ["update:modelValue"],
-  setup(t, { emit: e }) {
-    const o = e, { currentPrimaryColor: l, applyTheme: r, resetTheme: f } = Y(), a = H(l.value);
-    G(l, (I) => {
-      a.value = I;
+  setup(e, { emit: t }) {
+    const a = t, { currentPrimaryColor: l, applyTheme: d, resetTheme: u } = Ee(), n = K(l.value);
+    de(l, (h) => {
+      n.value = h;
     });
-    const u = () => {
-      r(a.value);
-    }, C = (I) => {
-      a.value = I, r(I);
-    }, w = () => {
-      f(), a.value = "#3e4b9a";
-    }, $ = () => {
-      o("update:modelValue", !1);
-    }, L = () => {
-      r(a.value), o("update:modelValue", !1);
+    const o = () => {
+      d(n.value);
+    }, g = (h) => {
+      n.value = h, d(h);
+    }, y = () => {
+      u(), n.value = "#3e4b9a";
+    }, v = () => {
+      a("update:modelValue", !1);
+    }, z = () => {
+      d(n.value), a("update:modelValue", !1);
     };
-    return (I, c) => (i(), W(_(ie), {
+    return (h, r) => (i(), D(_(fe), {
       as: "template",
-      show: t.modelValue
+      show: e.modelValue
     }, {
-      default: b(() => [
-        m(_(de), {
+      default: T(() => [
+        C(_(kt), {
           as: "div",
           class: "sl-relative sl-z-[100]",
-          onClose: $
+          onClose: v
         }, {
-          default: b(() => [
-            m(_(R), {
+          default: T(() => [
+            C(_(Se), {
               as: "template",
               enter: "ease-out duration-300",
               "enter-from": "opacity-0",
@@ -474,14 +469,14 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
               "leave-from": "opacity-100",
               "leave-to": "opacity-0"
             }, {
-              default: b(() => [...c[2] || (c[2] = [
+              default: T(() => [...r[2] || (r[2] = [
                 s("div", { class: "sl-fixed sl-inset-0 sl-bg-gray-900/60 sl-backdrop-blur-sm sl-transition-opacity" }, null, -1)
               ])]),
               _: 1
             }),
-            s("div", be, [
-              s("div", ve, [
-                m(_(R), {
+            s("div", Gt, [
+              s("div", Kt, [
+                C(_(Se), {
                   as: "template",
                   enter: "ease-out duration-300",
                   "enter-from": "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95",
@@ -490,188 +485,188 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
                   "leave-from": "opacity-100 translate-y-0 sm:scale-100",
                   "leave-to": "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
                 }, {
-                  default: b(() => [
-                    m(_(ce), { class: "sl-relative sl-transform sl-overflow-hidden sl-rounded-2xl sl-bg-white dark:sl-bg-slate-800 sl-shadow-2xl sl-transition-all sl-w-full sm:sl-max-w-lg" }, {
-                      default: b(() => [
-                        s("div", Ce, [
-                          s("div", ke, [
-                            s("div", we, [
+                  default: T(() => [
+                    C(_(wt), { class: "sl-relative sl-transform sl-overflow-hidden sl-rounded-2xl sl-bg-white dark:sl-bg-slate-800 sl-shadow-2xl sl-transition-all sl-w-full sm:sl-max-w-lg" }, {
+                      default: T(() => [
+                        s("div", Wt, [
+                          s("div", Yt, [
+                            s("div", Xt, [
                               s("div", {
                                 class: "sl-flex sl-h-10 sl-w-10 sl-items-center sl-justify-center sl-rounded-lg",
-                                style: k({ backgroundColor: a.value })
+                                style: O({ backgroundColor: n.value })
                               }, [
-                                m(_(ye), { class: "sl-h-5 sl-w-5 sl-text-white" })
+                                C(_(ct), { class: "sl-h-5 sl-w-5 sl-text-white" })
                               ], 4),
                               s("div", null, [
-                                m(_(ue), { class: "sl-text-lg sl-font-semibold sl-text-white" }, {
-                                  default: b(() => [...c[3] || (c[3] = [
-                                    S(" Theme Customizer ", -1)
+                                C(_(Ct), { class: "sl-text-lg sl-font-semibold sl-text-white" }, {
+                                  default: T(() => [...r[3] || (r[3] = [
+                                    j(" Theme Customizer ", -1)
                                   ])]),
                                   _: 1
                                 }),
-                                c[4] || (c[4] = s("p", { class: "sl-text-xs sl-text-gray-400" }, "Preview how components adapt to different colors", -1))
+                                r[4] || (r[4] = s("p", { class: "sl-text-xs sl-text-gray-400" }, "Preview how components adapt to different colors", -1))
                               ])
                             ]),
                             s("button", {
-                              onClick: $,
+                              onClick: v,
                               class: "sl-rounded-lg sl-p-2 sl-text-gray-400 hover:sl-bg-gray-700 hover:sl-text-white sl-transition-colors"
                             }, [
-                              m(_(fe), { class: "sl-h-5 sl-w-5" })
+                              C(_(ut), { class: "sl-h-5 sl-w-5" })
                             ])
                           ])
                         ]),
-                        s("div", $e, [
+                        s("div", qt, [
                           s("div", null, [
-                            c[5] || (c[5] = s("label", { class: "sl-block sl-text-sm sl-font-medium sl-text-gray-700 dark:sl-text-gray-300 sl-mb-3" }, " Primary Color ", -1)),
-                            s("div", _e, [
-                              s("div", Se, [
-                                D(s("input", {
+                            r[5] || (r[5] = s("label", { class: "sl-block sl-text-sm sl-font-medium sl-text-gray-700 dark:sl-text-gray-300 sl-mb-3" }, " Primary Color ", -1)),
+                            s("div", Jt, [
+                              s("div", Zt, [
+                                me(s("input", {
                                   type: "color",
-                                  "onUpdate:modelValue": c[0] || (c[0] = (h) => a.value = h),
-                                  onInput: u,
+                                  "onUpdate:modelValue": r[0] || (r[0] = (c) => n.value = c),
+                                  onInput: o,
                                   class: "sl-h-14 sl-w-14 sl-cursor-pointer sl-rounded-xl sl-border-2 sl-border-gray-200 dark:sl-border-slate-600 sl-p-1 sl-shadow-sm hover:sl-border-gray-300 dark:hover:sl-border-slate-500 sl-transition-colors"
                                 }, null, 544), [
-                                  [N, a.value]
+                                  [ve, n.value]
                                 ])
                               ]),
-                              s("div", Te, [
-                                D(s("input", {
+                              s("div", Qt, [
+                                me(s("input", {
                                   type: "text",
-                                  "onUpdate:modelValue": c[1] || (c[1] = (h) => a.value = h),
-                                  onInput: u,
+                                  "onUpdate:modelValue": r[1] || (r[1] = (c) => n.value = c),
+                                  onInput: o,
                                   placeholder: "#3e4b9a",
                                   class: "sl-block sl-w-full sl-rounded-lg sl-border sl-border-gray-300 dark:sl-border-slate-600 sl-bg-white dark:sl-bg-slate-700 sl-px-4 sl-py-3 sl-text-sm sl-font-mono sl-text-gray-900 dark:sl-text-white sl-shadow-sm focus:sl-border-primary-500 focus:sl-ring-2 focus:sl-ring-primary-500/20 sl-transition-all"
                                 }, null, 544), [
-                                  [N, a.value]
+                                  [ve, n.value]
                                 ])
                               ])
                             ])
                           ]),
                           s("div", null, [
-                            c[6] || (c[6] = s("label", { class: "sl-block sl-text-sm sl-font-medium sl-text-gray-700 dark:sl-text-gray-300 sl-mb-3" }, " Preset Themes ", -1)),
-                            s("div", Ie, [
-                              (i(!0), d(j, null, B(_(se), (h) => (i(), d("button", {
-                                key: h.name,
-                                onClick: (E) => C(h.color),
-                                class: v(["sl-group sl-relative sl-flex sl-items-center sl-gap-3 sl-rounded-lg sl-border sl-border-gray-200 dark:sl-border-slate-600 sl-bg-white dark:sl-bg-slate-700 sl-p-3 sl-text-left sl-transition-all hover:sl-border-gray-300 dark:hover:sl-border-slate-500 hover:sl-shadow-sm", { "sl-ring-2 sl-ring-offset-2 dark:sl-ring-offset-slate-800": a.value.toLowerCase() === h.color.toLowerCase() }]),
-                                style: k(a.value.toLowerCase() === h.color.toLowerCase() ? { "--tw-ring-color": h.color } : {})
+                            r[6] || (r[6] = s("label", { class: "sl-block sl-text-sm sl-font-medium sl-text-gray-700 dark:sl-text-gray-300 sl-mb-3" }, " Preset Themes ", -1)),
+                            s("div", es, [
+                              (i(!0), m(G, null, Y(_(et), (c) => (i(), m("button", {
+                                key: c.name,
+                                onClick: (p) => g(c.color),
+                                class: E(["sl-group sl-relative sl-flex sl-items-center sl-gap-3 sl-rounded-lg sl-border sl-border-gray-200 dark:sl-border-slate-600 sl-bg-white dark:sl-bg-slate-700 sl-p-3 sl-text-left sl-transition-all hover:sl-border-gray-300 dark:hover:sl-border-slate-500 hover:sl-shadow-sm", { "sl-ring-2 sl-ring-offset-2 dark:sl-ring-offset-slate-800": n.value.toLowerCase() === c.color.toLowerCase() }]),
+                                style: O(n.value.toLowerCase() === c.color.toLowerCase() ? { "--tw-ring-color": c.color } : {})
                               }, [
                                 s("div", {
                                   class: "sl-h-8 sl-w-8 sl-rounded-lg sl-shadow-sm sl-flex-shrink-0",
-                                  style: k({ backgroundColor: h.color })
+                                  style: O({ backgroundColor: c.color })
                                 }, null, 4),
-                                s("div", Ve, [
-                                  s("p", je, x(h.name), 1),
-                                  s("p", Ae, x(h.description), 1)
+                                s("div", ss, [
+                                  s("p", ls, w(c.name), 1),
+                                  s("p", as, w(c.description), 1)
                                 ])
-                              ], 14, Me))), 128))
+                              ], 14, ts))), 128))
                             ])
                           ]),
                           s("div", null, [
-                            c[15] || (c[15] = s("label", { class: "sl-block sl-text-sm sl-font-medium sl-text-gray-700 dark:sl-text-gray-300 sl-mb-3" }, " Live Preview ", -1)),
-                            s("div", Be, [
-                              s("div", Le, [
-                                m(A, {
+                            r[15] || (r[15] = s("label", { class: "sl-block sl-text-sm sl-font-medium sl-text-gray-700 dark:sl-text-gray-300 sl-mb-3" }, " Live Preview ", -1)),
+                            s("div", os, [
+                              s("div", rs, [
+                                C(oe, {
                                   theme: "primary",
                                   size: "sm"
                                 }, {
-                                  default: b(() => [...c[7] || (c[7] = [
-                                    S("Primary", -1)
+                                  default: T(() => [...r[7] || (r[7] = [
+                                    j("Primary", -1)
                                   ])]),
                                   _: 1
                                 }),
-                                m(A, {
+                                C(oe, {
                                   theme: "primary",
                                   size: "sm",
                                   outlined: ""
                                 }, {
-                                  default: b(() => [...c[8] || (c[8] = [
-                                    S("Outlined", -1)
+                                  default: T(() => [...r[8] || (r[8] = [
+                                    j("Outlined", -1)
                                   ])]),
                                   _: 1
                                 }),
-                                m(A, {
+                                C(oe, {
                                   theme: "secondary",
                                   size: "sm"
                                 }, {
-                                  default: b(() => [...c[9] || (c[9] = [
-                                    S("Secondary", -1)
+                                  default: T(() => [...r[9] || (r[9] = [
+                                    j("Secondary", -1)
                                   ])]),
                                   _: 1
                                 })
                               ]),
-                              s("div", Ee, [
-                                m(F, { theme: "primary" }, {
-                                  default: b(() => [...c[10] || (c[10] = [
-                                    S("Primary Badge", -1)
+                              s("div", ns, [
+                                C(ue, { theme: "primary" }, {
+                                  default: T(() => [...r[10] || (r[10] = [
+                                    j("Primary Badge", -1)
                                   ])]),
                                   _: 1
                                 }),
-                                m(F, { theme: "success" }, {
-                                  default: b(() => [...c[11] || (c[11] = [
-                                    S("Success", -1)
+                                C(ue, { theme: "success" }, {
+                                  default: T(() => [...r[11] || (r[11] = [
+                                    j("Success", -1)
                                   ])]),
                                   _: 1
                                 }),
-                                m(F, { theme: "warning" }, {
-                                  default: b(() => [...c[12] || (c[12] = [
-                                    S("Warning", -1)
+                                C(ue, { theme: "warning" }, {
+                                  default: T(() => [...r[12] || (r[12] = [
+                                    j("Warning", -1)
                                   ])]),
                                   _: 1
                                 })
                               ]),
-                              s("div", Fe, [
-                                m(le, { size: "sm" }),
-                                c[13] || (c[13] = s("span", { class: "sl-text-sm sl-text-gray-600 dark:sl-text-gray-400" }, "Loading indicator", -1))
+                              s("div", is, [
+                                C(st, { size: "sm" }),
+                                r[13] || (r[13] = s("span", { class: "sl-text-sm sl-text-gray-600 dark:sl-text-gray-400" }, "Loading indicator", -1))
                               ]),
-                              s("div", De, [
-                                m(te, {
+                              s("div", ds, [
+                                C(tt, {
                                   name: "Theme Test",
                                   size: "md"
                                 }),
-                                c[14] || (c[14] = s("span", { class: "sl-text-sm sl-text-gray-600 dark:sl-text-gray-400" }, "Avatar with initials", -1))
+                                r[14] || (r[14] = s("span", { class: "sl-text-sm sl-text-gray-600 dark:sl-text-gray-400" }, "Avatar with initials", -1))
                               ])
                             ])
                           ]),
                           s("div", null, [
-                            c[16] || (c[16] = s("label", { class: "sl-block sl-text-sm sl-font-medium sl-text-gray-700 dark:sl-text-gray-300 sl-mb-3" }, " Generated Palette ", -1)),
-                            s("div", ze, [
-                              (i(), d(j, null, B([50, 100, 200, 300, 400, 500, 600, 700, 800, 900], (h) => s("div", {
-                                key: h,
+                            r[16] || (r[16] = s("label", { class: "sl-block sl-text-sm sl-font-medium sl-text-gray-700 dark:sl-text-gray-300 sl-mb-3" }, " Generated Palette ", -1)),
+                            s("div", cs, [
+                              (i(), m(G, null, Y([50, 100, 200, 300, 400, 500, 600, 700, 800, 900], (c) => s("div", {
+                                key: c,
                                 class: "sl-flex-1 sl-h-8 sl-relative sl-group",
-                                style: k({ backgroundColor: `rgb(var(--sl-color-primary-${h}-rgb, 128 128 128))` })
+                                style: O({ backgroundColor: `rgb(var(--sl-color-primary-${c}-rgb, 128 128 128))` })
                               }, [
                                 s("span", {
-                                  class: v(["sl-absolute sl-inset-0 sl-flex sl-items-center sl-justify-center sl-text-[9px] sl-font-medium sl-opacity-0 group-hover:sl-opacity-100 sl-transition-opacity", h < 500 ? "sl-text-gray-700" : "sl-text-white"])
-                                }, x(h), 3)
+                                  class: E(["sl-absolute sl-inset-0 sl-flex sl-items-center sl-justify-center sl-text-[9px] sl-font-medium sl-opacity-0 group-hover:sl-opacity-100 sl-transition-opacity", c < 500 ? "sl-text-gray-700" : "sl-text-white"])
+                                }, w(c), 3)
                               ], 4)), 64))
                             ])
                           ])
                         ]),
-                        s("div", Pe, [
-                          s("div", Ne, [
+                        s("div", us, [
+                          s("div", ms, [
                             s("button", {
-                              onClick: w,
+                              onClick: y,
                               class: "sl-text-sm sl-text-gray-600 dark:sl-text-gray-400 hover:sl-text-gray-900 dark:hover:sl-text-white sl-font-medium sl-transition-colors"
                             }, " Reset to Default "),
-                            s("div", Ue, [
-                              m(A, {
+                            s("div", fs, [
+                              C(oe, {
                                 theme: "secondary",
                                 size: "sm",
-                                onButtonClick: $
+                                onButtonClick: v
                               }, {
-                                default: b(() => [...c[17] || (c[17] = [
-                                  S(" Close ", -1)
+                                default: T(() => [...r[17] || (r[17] = [
+                                  j(" Close ", -1)
                                 ])]),
                                 _: 1
                               }),
-                              m(A, {
+                              C(oe, {
                                 theme: "primary",
                                 size: "sm",
-                                onButtonClick: L
+                                onButtonClick: z
                               }, {
-                                default: b(() => [...c[18] || (c[18] = [
-                                  S(" Apply Theme ", -1)
+                                default: T(() => [...r[18] || (r[18] = [
+                                  j(" Apply Theme ", -1)
                                 ])]),
                                 _: 1
                               })
@@ -693,13 +688,13 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
       _: 1
     }, 8, ["show"]));
   }
-}), xt = /* @__PURE__ */ J(Oe, [["__scopeId", "data-v-c9b3cc37"]]), Re = {
+}), ar = /* @__PURE__ */ Z(ps, [["__scopeId", "data-v-c9b3cc37"]]), gs = {
   viewBox: "0 0 36 36",
   class: "sl-transform -sl-rotate-90 sl-w-full sl-h-full"
-}, He = ["stroke-width"], Ge = ["stroke", "stroke-dasharray", "stroke-width"], We = {
+}, ys = ["stroke-width"], hs = ["stroke", "stroke-dasharray", "stroke-width"], xs = {
   key: 0,
   class: "sl-absolute sl-inset-0 sl-flex sl-items-center sl-justify-center"
-}, ht = /* @__PURE__ */ T({
+}, or = /* @__PURE__ */ F({
   __name: "UiRadialProgressBar",
   props: {
     value: { default: 0 },
@@ -709,11 +704,11 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
     color: { default: "primary" },
     trackWidth: { default: 3.8 }
   },
-  setup(t) {
-    const e = t, o = y(() => Math.min(100, Math.max(0, e.value))), l = y(() => ({
-      width: `${e.size}px`,
-      height: `${e.size}px`
-    })), r = y(() => ({
+  setup(e) {
+    const t = e, a = b(() => Math.min(100, Math.max(0, t.value))), l = b(() => ({
+      width: `${t.size}px`,
+      height: `${t.size}px`
+    })), d = b(() => ({
       primary: "var(--sl-color-primary-600, #3e4b9a)",
       success: "#22c55e",
       // green-500
@@ -721,37 +716,1303 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
       // yellow-500
       danger: "#ef4444"
       // red-500
-    })[e.color]), f = y(() => e.size < 48 ? "sl-text-xs sl-font-medium sl-text-slate-700 dark:sl-text-slate-300" : e.size < 80 ? "sl-text-sm sl-font-semibold sl-text-slate-700 dark:sl-text-slate-300" : e.size < 120 ? "sl-text-base sl-font-semibold sl-text-slate-700 dark:sl-text-slate-300" : "sl-text-lg sl-font-bold sl-text-slate-700 dark:sl-text-slate-300");
-    return (a, u) => (i(), d("div", {
+    })[t.color]), u = b(() => t.size < 48 ? "sl-text-xs sl-font-medium sl-text-slate-700 dark:sl-text-slate-300" : t.size < 80 ? "sl-text-sm sl-font-semibold sl-text-slate-700 dark:sl-text-slate-300" : t.size < 120 ? "sl-text-base sl-font-semibold sl-text-slate-700 dark:sl-text-slate-300" : "sl-text-lg sl-font-bold sl-text-slate-700 dark:sl-text-slate-300");
+    return (n, o) => (i(), m("div", {
       class: "sl-relative sl-inline-flex",
-      style: k(l.value)
+      style: O(l.value)
     }, [
-      (i(), d("svg", Re, [
+      (i(), m("svg", gs, [
         s("path", {
           class: "sl-fill-none sl-stroke-gray-200 dark:sl-stroke-slate-600",
-          "stroke-width": t.trackWidth,
+          "stroke-width": e.trackWidth,
           d: "M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"
-        }, null, 8, He),
+        }, null, 8, ys),
         s("path", {
           class: "sl-fill-none sl-transition-all sl-duration-500 sl-ease-out",
-          stroke: r.value,
+          stroke: d.value,
           "stroke-linecap": "round",
-          "stroke-dasharray": `${o.value}, 100`,
-          "stroke-width": t.trackWidth,
+          "stroke-dasharray": `${a.value}, 100`,
+          "stroke-width": e.trackWidth,
           d: "M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"
-        }, null, 8, Ge)
+        }, null, 8, hs)
       ])),
-      t.showLabel || t.label ? (i(), d("div", We, [
+      e.showLabel || e.label ? (i(), m("div", xs, [
         s("span", {
-          class: v(f.value)
-        }, x(t.label || `${o.value}%`), 3)
-      ])) : g("", !0)
+          class: E(u.value)
+        }, w(e.label || `${a.value}%`), 3)
+      ])) : k("", !0)
     ], 4));
   }
-}), Ye = { class: "sl-bg-white sl-rounded-lg sl-shadow sl-p-6" }, Je = { class: "sl-space-y-8" }, qe = { class: "sl-grid sl-grid-cols-1 sl-md:grid-cols-2 sl-gap-6" }, Ze = { class: "sl-bg-gray-50 sl-rounded-md sl-p-4 sl-text-sm sl-text-gray-700" }, Ke = { class: "sl-whitespace-pre-wrap" }, yt = /* @__PURE__ */ T({
+}), bs = { class: "sl-w-full" }, vs = { class: "sl-border-b sl-border-gray-200 dark:sl-border-gray-700 sl-py-5 sl-flex sl-justify-between" }, ks = { class: "sl-text-base sl-font-semibold sl-leading-6 sl-text-gray-800 dark:sl-text-gray-200" }, ws = {
+  key: 0,
+  class: "sl-text-xs sl-leading-6 sl-text-gray-500 dark:sl-text-gray-400"
+}, Cs = {
+  key: 0,
+  role: "list",
+  class: "sl-divide-y sl-divide-gray-100 dark:sl-divide-gray-700"
+}, $s = {
+  key: 0,
+  class: "sl-text-sm sl-font-semibold sl-leading-6 sl-text-gray-800 dark:sl-text-gray-200"
+}, _s = ["tabindex", "onClick", "onKeydown"], Is = { class: "sl-col-span-12 sm:sl-col-span-7" }, Ss = { class: "sl-py-1 sl-text-sm sl-leading-5 sl-text-gray-700 dark:sl-text-gray-300" }, zs = { class: "sl-col-span-12 sm:sl-col-span-5 sl-flex sl-justify-end sl-items-center" }, Ts = {
+  key: 0,
+  class: "sl-text-xs sl-text-gray-500 dark:sl-text-gray-400"
+}, Ls = {
+  key: 1,
+  class: "sl-relative sl-cursor-default sl-select-none sl-px-4 sl-py-8 sl-text-gray-500 dark:sl-text-gray-400 sl-text-sm sl-text-center"
+}, Ms = /* @__PURE__ */ F({
+  __name: "CollectionItemList",
+  props: {
+    items: { default: () => [] },
+    selected: {},
+    canEdit: { type: Boolean, default: !1 },
+    groupBy: {},
+    title: { default: "Items" },
+    emptyMessage: { default: "No items found." },
+    primaryField: { default: "name" },
+    secondaryField: {},
+    displayFields: {}
+  },
+  emits: ["select"],
+  setup(e, { emit: t }) {
+    const a = e, l = t, d = b(() => a.items && a.items.length > 0), u = b(() => {
+      if (!a.items) return {};
+      if (!a.groupBy)
+        return { "": a.items };
+      const h = {};
+      return a.items.forEach((r) => {
+        const c = n(r, a.groupBy), p = o(c);
+        h[p] || (h[p] = []), h[p].push(r);
+      }), h;
+    }), n = (h, r) => r.split(".").reduce((c, p) => {
+      if (c && typeof c == "object")
+        return c[p];
+    }, h), o = (h) => h == null ? "Other" : typeof h == "object" && h !== null && "name" in h ? h.name : String(h), g = (h) => {
+      if (a.primaryField) {
+        const r = n(h, a.primaryField);
+        return typeof r == "object" && r !== null && "name" in r ? r.name : r ? String(r) : "";
+      }
+      return h.id;
+    }, y = (h) => {
+      if (!a.secondaryField) return "";
+      const r = n(h, a.secondaryField);
+      return typeof r == "object" && r !== null && "name" in r ? r.name : r ? String(r) : "";
+    }, v = (h) => a.selected ? h.id === a.selected.id : !1, z = (h) => {
+      a.canEdit && l("select", h);
+    };
+    return (h, r) => (i(), m("div", bs, [
+      s("div", vs, [
+        s("h3", ks, w(e.title), 1),
+        e.canEdit ? (i(), m("p", ws, " Select an item to edit ")) : k("", !0)
+      ]),
+      d.value ? (i(), m("ul", Cs, [
+        (i(!0), m(G, null, Y(u.value, (c, p) => (i(), m("li", {
+          key: String(p),
+          class: "sl-gap-x-6 sl-py-5 sl-items-center sl-space-y-3"
+        }, [
+          e.groupBy ? (i(), m("p", $s, w(o(p)), 1)) : k("", !0),
+          (i(!0), m(G, null, Y(c, ($, f) => (i(), m("div", {
+            key: $.id || f,
+            class: E([
+              "sl-grid sl-grid-cols-12 sl-gap-x-4 sl-p-2 sl-rounded-md sl-transition-all",
+              e.canEdit && "hover:sl-ring-1 hover:sl-ring-primary-500 hover:sl-ring-offset-2 sl-cursor-pointer",
+              v($) && "sl-ring-1 sl-ring-primary-600 sl-ring-offset-2 sl-bg-white dark:sl-bg-gray-800"
+            ]),
+            role: "button",
+            tabindex: e.canEdit ? 0 : -1,
+            onClick: (x) => z($),
+            onKeydown: [
+              ke((x) => z($), ["enter"]),
+              ke(Te((x) => z($), ["prevent"]), ["space"])
+            ]
+          }, [
+            s("div", Is, [
+              M(h.$slots, "item-content", { item: $ }, () => [
+                s("p", Ss, w(g($)), 1)
+              ])
+            ]),
+            s("div", zs, [
+              M(h.$slots, "item-secondary", { item: $ }, () => [
+                y($) ? (i(), m("span", Ts, w(y($)), 1)) : k("", !0)
+              ])
+            ])
+          ], 42, _s))), 128))
+        ]))), 128))
+      ])) : (i(), m("div", Ls, [
+        M(h.$slots, "empty", {}, () => [
+          j(w(e.emptyMessage), 1)
+        ])
+      ]))
+    ]));
+  }
+}), Ps = { class: "sl-collection-editor sl-flex sl-flex-row sl-flex-wrap sl--mx-3" }, Es = { class: "sl-w-full sm:sl-w-1/2 sl-px-3 sl-flex sl-flex-col" }, As = { class: "sl-mb-4 sl-flex sl-justify-between sl-items-center" }, Ds = { class: "sl-flex sl-gap-2" }, Fs = {
+  key: 0,
+  class: "sl-text-xs sl-uppercase sl-text-gray-500 dark:sl-text-gray-400 sl-truncate sl-text-right sl-font-semibold"
+}, Ns = { class: "sl-border-t sl-border-gray-200 dark:sl-border-gray-700 sl-pt-4" }, Us = { class: "sl-w-full sm:sl-w-1/2 sl-px-3" }, Vs = /* @__PURE__ */ F({
+  __name: "CollectionEditor",
+  props: {
+    name: {},
+    modelValue: { default: () => [] },
+    schema: {},
+    emptyFormValues: {},
+    label: {},
+    title: { default: "Items" },
+    groupBy: {},
+    primaryField: {},
+    secondaryField: {},
+    emptyMessage: { default: 'No items found. Click "Add" to create one.' },
+    deleteConfirmTitle: { default: "Delete Item" },
+    deleteConfirmMessage: { default: "Are you sure you want to delete this item? This action cannot be undone." },
+    explodeItem: { type: Function, default: (e) => e },
+    implodeItem: { type: Function, default: (e) => e }
+  },
+  emits: ["update:modelValue", "item-added", "item-updated", "item-deleted", "item-selected", "update:form", "update:validity"],
+  setup(e, { expose: t, emit: a }) {
+    const l = e, d = a, u = (N, ...A) => {
+      d(N, ...A);
+    }, {
+      items: n,
+      activeItem: o,
+      formValues: g,
+      formRef: y,
+      buttonAttributes: v,
+      showDeleteConfirm: z,
+      selectItem: h,
+      handleButtonClick: r,
+      handleFormSubmit: c,
+      handleFormUpdate: p,
+      confirmDelete: $,
+      cancelDelete: f
+    } = Qe(
+      {
+        initialItems: l.modelValue,
+        emptyFormValues: l.emptyFormValues,
+        explodeItem: l.explodeItem,
+        implodeItem: l.implodeItem
+      },
+      u
+    );
+    de(
+      () => l.modelValue,
+      (N) => {
+        N && JSON.stringify(N) !== JSON.stringify(n.value) && (n.value = N.map((A) => l.explodeItem(A)));
+      },
+      { deep: !0 }
+    );
+    const x = b(() => n.value), P = (N) => {
+      r(N);
+    }, B = (N) => {
+      c(N);
+    }, H = (N) => {
+      p(N), d("update:form", N);
+    }, ae = () => {
+      $();
+    };
+    return t({
+      getItems: () => n.value.map((N) => l.implodeItem(N)),
+      resetForm: () => {
+        g.value = { ...l.emptyFormValues }, o.value = null;
+      }
+    }), (N, A) => (i(), m("div", Ps, [
+      s("div", Es, [
+        s("div", As, [
+          s("span", Ds, [
+            C(lt, {
+              onButtonClicked: P,
+              "button-attributes": _(v)
+            }, null, 8, ["button-attributes"])
+          ]),
+          e.label ? (i(), m("span", Fs, w(e.label), 1)) : k("", !0)
+        ]),
+        s("div", Ns, [
+          (i(), D(at, {
+            ref_key: "formRef",
+            ref: y,
+            schema: e.schema,
+            "form-values": _(g),
+            "form-name": e.name,
+            "box-shadow": !1,
+            key: _(g).id,
+            onSubmitForm: B,
+            "onUpdate:form": H
+          }, null, 8, ["schema", "form-values", "form-name"]))
+        ])
+      ]),
+      s("div", Us, [
+        M(N.$slots, "list", {
+          items: x.value,
+          selected: _(o),
+          onSelect: _(h)
+        }, () => [
+          C(Ms, {
+            items: x.value,
+            selected: _(o),
+            "can-edit": !0,
+            title: e.title,
+            "group-by": e.groupBy,
+            "primary-field": e.primaryField,
+            "secondary-field": e.secondaryField,
+            "empty-message": e.emptyMessage,
+            onSelect: _(h)
+          }, {
+            "item-content": T(({ item: U }) => [
+              M(N.$slots, "item-content", { item: U }, void 0, !0)
+            ]),
+            "item-secondary": T(({ item: U }) => [
+              M(N.$slots, "item-secondary", { item: U }, void 0, !0)
+            ]),
+            empty: T(() => [
+              M(N.$slots, "empty", {}, void 0, !0)
+            ]),
+            _: 3
+          }, 8, ["items", "selected", "title", "group-by", "primary-field", "secondary-field", "empty-message", "onSelect"])
+        ], !0)
+      ]),
+      _(z) ? (i(), D(ot, {
+        key: 0,
+        title: e.deleteConfirmTitle,
+        description: e.deleteConfirmMessage,
+        action: "Delete",
+        onActionClicked: ae,
+        onClose: _(f)
+      }, null, 8, ["title", "description", "onClose"])) : k("", !0)
+    ]));
+  }
+}), he = /* @__PURE__ */ Z(Vs, [["__scopeId", "data-v-64df06ec"]]), Bs = { class: "sl-py-1 sl-text-sm sl-leading-5 sl-text-gray-600 dark:sl-text-gray-300" }, js = { class: "sl-text-xs sl-text-gray-500 dark:sl-text-gray-400" }, rr = /* @__PURE__ */ F({
+  __name: "OrganizationsEditor",
+  props: {
+    name: {},
+    modelValue: { default: () => [] },
+    organizations: { default: () => [] },
+    positions: { default: () => [] },
+    label: {}
+  },
+  emits: ["update:modelValue", "item-added", "item-updated", "item-deleted"],
+  setup(e, { emit: t }) {
+    const a = e, l = t, d = {
+      id: ye(),
+      organization: null,
+      position: null,
+      position_prefix: "",
+      position_suffix: "",
+      start_date: null,
+      end_date: null,
+      status: "new"
+    }, u = b(() => ({
+      fields: [
+        {
+          name: "organization",
+          label: "Organization",
+          as: "ComboboxInput",
+          type: "autocomplete",
+          items: a.organizations,
+          itemKey: "id",
+          itemText: "name",
+          hideLabel: !0,
+          innerLabel: "Organization",
+          tertiaryLabel: "Required"
+        },
+        {
+          name: "position_prefix",
+          label: "Prefix",
+          as: "TextInput",
+          type: "text",
+          hideLabel: !0,
+          innerLabel: "Prefix",
+          placeholder: "e.g., Vice"
+        },
+        {
+          name: "position",
+          label: "Position",
+          as: "ComboboxInput",
+          type: "autocomplete",
+          items: a.positions,
+          itemKey: "id",
+          itemText: "name",
+          hideLabel: !0,
+          innerLabel: "Position",
+          tertiaryLabel: "Required"
+        },
+        {
+          name: "position_suffix",
+          label: "Suffix",
+          as: "TextInput",
+          type: "text",
+          hideLabel: !0,
+          innerLabel: "Suffix",
+          placeholder: "e.g., Emeritus"
+        },
+        {
+          name: "start_date",
+          label: "Start Date",
+          as: "DatepickerInput",
+          type: "datepicker",
+          monthPicker: !0,
+          hideLabel: !0,
+          innerLabel: "Start Date"
+        },
+        {
+          name: "end_date",
+          label: "End Date",
+          as: "DatepickerInput",
+          type: "datepicker",
+          monthPicker: !0,
+          hideLabel: !0,
+          innerLabel: "End Date"
+        }
+      ]
+    })), n = (r, c) => c ? r.find((p) => p.name === c) || { id: c, name: c } : null, o = (r) => {
+      const c = typeof r.organization == "object" && r.organization?.name ? r.organization.name : r.organization, p = typeof r.position == "object" && r.position?.name ? r.position.name : r.position;
+      return {
+        ...r,
+        organization: n(a.organizations, c) || r.organization,
+        position: n(a.positions, p) || r.position
+      };
+    }, g = (r) => ({
+      ...r,
+      organization: typeof r.organization == "object" && r.organization?.name ? r.organization.name : r.organization,
+      position: typeof r.position == "object" && r.position?.name ? r.position.name : r.position
+    }), y = (r) => {
+      const c = [];
+      if (r.position_prefix && c.push(r.position_prefix), r.position) {
+        const p = typeof r.position == "object" && r.position?.name ? r.position.name : r.position;
+        p && c.push(p);
+      }
+      return r.position_suffix && c.push(r.position_suffix), c.join(" ") || "No position";
+    }, v = (r) => {
+      if (!r) return null;
+      if (r instanceof Date) return J(r) ? r : null;
+      if (typeof r == "string") {
+        const c = re(r);
+        return J(c) ? c : null;
+      }
+      return null;
+    }, z = (r, c) => {
+      const p = v(r), $ = v(c), f = [];
+      if (p && f.push(q(p, "MMM yyyy")), f.push("–"), $ ? f.push(q($, "MMM yyyy")) : f.push("Present"), p) {
+        const x = $ || /* @__PURE__ */ new Date(), P = ce(x, p), B = Ae(x, p) % 12, H = [];
+        P > 0 && H.push(`${P}y`), (B > 0 || P === 0) && H.push(`${B || 1}mo`), H.length > 0 && f.push("•", H.join(" "));
+      }
+      return f.join(" ");
+    }, h = (r) => {
+      l("update:modelValue", r);
+    };
+    return (r, c) => (i(), D(he, {
+      name: e.name,
+      "model-value": e.modelValue,
+      schema: u.value,
+      "empty-form-values": d,
+      label: e.label,
+      title: "Organizations",
+      "group-by": "organization",
+      "primary-field": "position",
+      "explode-item": o,
+      "implode-item": g,
+      "delete-confirm-title": "Remove Position",
+      "delete-confirm-message": "Are you sure you want to remove this position? You will need to save your changes for this to take effect.",
+      "empty-message": "No organizations found. Click 'Add' to create one.",
+      "onUpdate:modelValue": h,
+      onItemAdded: c[0] || (c[0] = (p) => l("item-added", p)),
+      onItemUpdated: c[1] || (c[1] = (p) => l("item-updated", p)),
+      onItemDeleted: c[2] || (c[2] = (p) => l("item-deleted", p))
+    }, {
+      "item-content": T(({ item: p }) => [
+        s("p", Bs, w(y(p)), 1)
+      ]),
+      "item-secondary": T(({ item: p }) => [
+        s("span", js, w(z(p.start_date, p.end_date)), 1)
+      ]),
+      _: 1
+    }, 8, ["name", "model-value", "schema", "label"]));
+  }
+}), Os = { class: "sl-flex sl-items-center sl-gap-3" }, Rs = { class: "sl-w-8 sl-h-8 sl-rounded-full sl-flex sl-items-center sl-justify-center sl-bg-primary-100 dark:sl-bg-primary-900/50 sl-text-primary-600 dark:sl-text-primary-400 sl-text-xs sl-font-semibold sl-flex-shrink-0" }, Hs = { class: "sl-text-sm sl-font-medium sl-text-gray-900 dark:sl-text-gray-100" }, Gs = { class: "sl-text-xs sl-text-gray-500 dark:sl-text-gray-400" }, Ks = {
+  key: 0,
+  class: "sl-text-xs sl-text-gray-500 dark:sl-text-gray-400"
+}, nr = /* @__PURE__ */ F({
+  __name: "RelatedNamesEditor",
+  props: {
+    name: {},
+    modelValue: { default: () => [] },
+    labels: { default: () => [
+      { id: "spouse", name: "Spouse" },
+      { id: "child", name: "Child" },
+      { id: "parent", name: "Parent" },
+      { id: "sibling", name: "Sibling" },
+      { id: "partner", name: "Partner" },
+      { id: "friend", name: "Friend" },
+      { id: "other", name: "Other" }
+    ] },
+    label: {}
+  },
+  emits: ["update:modelValue", "item-added", "item-updated", "item-deleted"],
+  setup(e, { emit: t }) {
+    const a = e, l = t, d = {
+      id: ye(),
+      first_name: "",
+      last_name: "",
+      label: null,
+      birthday: null,
+      status: "new"
+    }, u = b(() => ({
+      fields: [
+        {
+          name: "first_name",
+          label: "First Name",
+          as: "TextInput",
+          type: "text",
+          hideLabel: !0,
+          innerLabel: "First Name",
+          tertiaryLabel: "Required"
+        },
+        {
+          name: "last_name",
+          label: "Last Name",
+          as: "TextInput",
+          type: "text",
+          hideLabel: !0,
+          innerLabel: "Last Name"
+        },
+        {
+          name: "label",
+          label: "Relationship",
+          as: "ComboboxInput",
+          type: "autocomplete",
+          items: a.labels,
+          itemKey: "id",
+          itemText: "name",
+          hideLabel: !0,
+          innerLabel: "Relationship",
+          tertiaryLabel: "Required"
+        },
+        {
+          name: "birthday",
+          label: "Birthday",
+          as: "DatepickerInput",
+          type: "datepicker",
+          hideLabel: !0,
+          innerLabel: "Birthday"
+        }
+      ]
+    })), n = (c, p) => p ? c.find(($) => $.name === p) || { id: p, name: p } : null, o = (c) => {
+      const p = typeof c.label == "object" && c.label?.name ? c.label.name : c.label;
+      return {
+        ...c,
+        label: n(a.labels, p) || c.label
+      };
+    }, g = (c) => ({
+      ...c,
+      label: typeof c.label == "object" && c.label?.name ? c.label.name : c.label
+    }), y = (c) => {
+      if (c.name) return c.name;
+      const p = [];
+      return c.first_name && p.push(c.first_name), c.last_name && p.push(c.last_name), p.join(" ") || "Unknown";
+    }, v = (c) => {
+      const p = y(c), $ = p.split(" ").filter(Boolean);
+      return $.length >= 2 ? `${$[0][0]}${$[$.length - 1][0]}`.toUpperCase() : p.substring(0, 2).toUpperCase();
+    }, z = (c) => c.label ? typeof c.label == "string" ? c.label : c.label.name || "" : c.relationship || "", h = (c) => {
+      if (!c) return "";
+      let p;
+      if (typeof c == "string" ? p = re(c) : p = c, !J(p)) return "";
+      const $ = ce(/* @__PURE__ */ new Date(), p);
+      return `${q(p, "MMM d")} (${$}y)`;
+    }, r = (c) => {
+      l("update:modelValue", c);
+    };
+    return (c, p) => (i(), D(he, {
+      name: e.name,
+      "model-value": e.modelValue,
+      schema: u.value,
+      "empty-form-values": d,
+      label: e.label,
+      title: "Related Names",
+      "primary-field": "name",
+      "secondary-field": "label",
+      "explode-item": o,
+      "implode-item": g,
+      "delete-confirm-title": "Remove Related Name",
+      "delete-confirm-message": "Are you sure you want to remove this related name? You will need to save your changes for this to take effect.",
+      "empty-message": "No related names found. Click 'Add' to create one.",
+      "onUpdate:modelValue": r,
+      onItemAdded: p[0] || (p[0] = ($) => l("item-added", $)),
+      onItemUpdated: p[1] || (p[1] = ($) => l("item-updated", $)),
+      onItemDeleted: p[2] || (p[2] = ($) => l("item-deleted", $))
+    }, {
+      "item-content": T(({ item: $ }) => [
+        s("div", Os, [
+          s("div", Rs, w(v($)), 1),
+          s("div", null, [
+            s("p", Hs, w(y($)), 1),
+            s("p", Gs, w(z($)), 1)
+          ])
+        ])
+      ]),
+      "item-secondary": T(({ item: $ }) => [
+        $.birthday ? (i(), m("span", Ks, w(h($.birthday)), 1)) : k("", !0)
+      ]),
+      _: 1
+    }, 8, ["name", "model-value", "schema", "label"]));
+  }
+}), Ws = { class: "sl-flex sl-items-center sl-gap-3" }, Ys = { class: "sl-text-sm sl-font-medium sl-text-gray-900 dark:sl-text-gray-100" }, Xs = {
+  key: 0,
+  class: "sl-text-xs sl-text-gray-500 dark:sl-text-gray-400"
+}, qs = ["href"], ir = /* @__PURE__ */ F({
+  __name: "SocialLinksEditor",
+  props: {
+    name: {},
+    modelValue: { default: () => [] },
+    platforms: { default: () => [
+      { id: "linkedin", name: "LinkedIn" },
+      { id: "twitter", name: "Twitter/X" },
+      { id: "facebook", name: "Facebook" },
+      { id: "instagram", name: "Instagram" },
+      { id: "youtube", name: "YouTube" },
+      { id: "tiktok", name: "TikTok" },
+      { id: "github", name: "GitHub" },
+      { id: "website", name: "Website" }
+    ] },
+    label: {}
+  },
+  emits: ["update:modelValue", "item-added", "item-updated", "item-deleted"],
+  setup(e, { emit: t }) {
+    const a = (A) => () => ne("svg", { viewBox: "0 0 24 24", fill: "currentColor" }, [ne("path", { d: A })]), l = a("M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"), d = a("M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"), u = a("M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"), n = a("M12 0C8.74 0 8.333.015 7.053.072 5.775.132 4.905.333 4.14.63c-.789.306-1.459.717-2.126 1.384S.935 3.35.63 4.14C.333 4.905.131 5.775.072 7.053.012 8.333 0 8.74 0 12s.015 3.667.072 4.947c.06 1.277.261 2.148.558 2.913.306.788.717 1.459 1.384 2.126.667.666 1.336 1.079 2.126 1.384.766.296 1.636.499 2.913.558C8.333 23.988 8.74 24 12 24s3.667-.015 4.947-.072c1.277-.06 2.148-.262 2.913-.558.788-.306 1.459-.718 2.126-1.384.666-.667 1.079-1.335 1.384-2.126.296-.765.499-1.636.558-2.913.06-1.28.072-1.687.072-4.947s-.015-3.667-.072-4.947c-.06-1.277-.262-2.149-.558-2.913-.306-.789-.718-1.459-1.384-2.126C21.319 1.347 20.651.935 19.86.63c-.765-.297-1.636-.499-2.913-.558C15.667.012 15.26 0 12 0zm0 2.16c3.203 0 3.585.016 4.85.071 1.17.055 1.805.249 2.227.415.562.217.96.477 1.382.896.419.42.679.819.896 1.381.164.422.36 1.057.413 2.227.057 1.266.07 1.646.07 4.85s-.015 3.585-.074 4.85c-.061 1.17-.256 1.805-.421 2.227-.224.562-.479.96-.899 1.382-.419.419-.824.679-1.38.896-.42.164-1.065.36-2.235.413-1.274.057-1.649.07-4.859.07-3.211 0-3.586-.015-4.859-.074-1.171-.061-1.816-.256-2.236-.421-.569-.224-.96-.479-1.379-.899-.421-.419-.69-.824-.9-1.38-.165-.42-.359-1.065-.42-2.235-.045-1.26-.061-1.649-.061-4.844 0-3.196.016-3.586.061-4.861.061-1.17.255-1.814.42-2.234.21-.57.479-.96.9-1.381.419-.419.81-.689 1.379-.898.42-.166 1.051-.361 2.221-.421 1.275-.045 1.65-.06 4.859-.06l.045.03zm0 3.678c-3.405 0-6.162 2.76-6.162 6.162 0 3.405 2.76 6.162 6.162 6.162 3.405 0 6.162-2.76 6.162-6.162 0-3.405-2.76-6.162-6.162-6.162zM12 16c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4zm7.846-10.405c0 .795-.646 1.44-1.44 1.44-.795 0-1.44-.646-1.44-1.44 0-.794.646-1.439 1.44-1.439.793-.001 1.44.645 1.44 1.439z"), o = a("M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"), g = a("M12.525.02c1.31-.02 2.61-.01 3.91-.02.08 1.53.63 3.09 1.75 4.17 1.12 1.11 2.7 1.62 4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97-.57-.26-1.1-.59-1.62-.93-.01 2.92.01 5.84-.02 8.75-.08 1.4-.54 2.79-1.35 3.94-1.31 1.92-3.58 3.17-5.91 3.21-1.43.08-2.86-.31-4.08-1.03-2.02-1.19-3.44-3.37-3.65-5.71-.02-.5-.03-1-.01-1.49.18-1.9 1.12-3.72 2.58-4.96 1.66-1.44 3.98-2.13 6.15-1.72.02 1.48-.04 2.96-.04 4.44-.99-.32-2.15-.23-3.02.37-.63.41-1.11 1.04-1.36 1.75-.21.51-.15 1.07-.14 1.61.24 1.64 1.82 3.02 3.5 2.87 1.12-.01 2.19-.66 2.77-1.61.19-.33.4-.67.41-1.06.1-1.79.06-3.57.07-5.36.01-4.03-.01-8.05.02-12.07z"), y = a("M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"), v = a("M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z"), z = {
+      linkedin: l,
+      twitter: d,
+      x: d,
+      facebook: u,
+      instagram: n,
+      youtube: o,
+      tiktok: g,
+      github: y,
+      website: v
+    }, h = {
+      linkedin: "sl-text-[#0A66C2]",
+      twitter: "sl-text-gray-900 dark:sl-text-gray-100",
+      x: "sl-text-gray-900 dark:sl-text-gray-100",
+      facebook: "sl-text-[#1877F2]",
+      instagram: "sl-text-[#E4405F]",
+      youtube: "sl-text-[#FF0000]",
+      tiktok: "sl-text-gray-900 dark:sl-text-gray-100",
+      github: "sl-text-gray-900 dark:sl-text-gray-100"
+    }, r = e, c = t, p = {
+      id: ye(),
+      platform: "",
+      handle: "",
+      url: "",
+      status: "new"
+    }, $ = b(() => ({
+      fields: [
+        {
+          name: "platform",
+          label: "Platform",
+          as: "SelectInput",
+          type: "select",
+          items: r.platforms,
+          itemKey: "id",
+          itemText: "name",
+          hideLabel: !0,
+          innerLabel: "Platform",
+          tertiaryLabel: "Required"
+        },
+        {
+          name: "handle",
+          label: "Handle/Username",
+          as: "TextInput",
+          type: "text",
+          hideLabel: !0,
+          innerLabel: "Handle/Username",
+          placeholder: "@username"
+        },
+        {
+          name: "url",
+          label: "Profile URL",
+          as: "TextInput",
+          type: "url",
+          hideLabel: !0,
+          innerLabel: "Profile URL",
+          placeholder: "https://..."
+        }
+      ]
+    })), f = (A) => A, x = (A) => A, P = (A) => r.platforms.find((V) => V.id === A)?.name || A || "Unknown Platform", B = (A) => {
+      const U = A?.toLowerCase() || "website";
+      return z[U] || v;
+    }, H = (A) => {
+      const U = A?.toLowerCase() || "website";
+      return h[U] || "sl-text-gray-500";
+    }, ae = (A) => A ? A.startsWith("http://") || A.startsWith("https://") ? A : `https://${A}` : "#", N = (A) => {
+      c("update:modelValue", A);
+    };
+    return (A, U) => (i(), D(he, {
+      name: e.name,
+      "model-value": e.modelValue,
+      schema: $.value,
+      "empty-form-values": p,
+      label: e.label,
+      title: "Social Links",
+      "primary-field": "platform",
+      "secondary-field": "handle",
+      "explode-item": f,
+      "implode-item": x,
+      "delete-confirm-title": "Remove Social Link",
+      "delete-confirm-message": "Are you sure you want to remove this social link? You will need to save your changes for this to take effect.",
+      "empty-message": "No social links found. Click 'Add' to create one.",
+      "onUpdate:modelValue": N,
+      onItemAdded: U[1] || (U[1] = (V) => c("item-added", V)),
+      onItemUpdated: U[2] || (U[2] = (V) => c("item-updated", V)),
+      onItemDeleted: U[3] || (U[3] = (V) => c("item-deleted", V))
+    }, {
+      "item-content": T(({ item: V }) => [
+        s("div", Ws, [
+          (i(), D(ge(B(V.platform)), {
+            class: E(["sl-w-5 sl-h-5 sl-flex-shrink-0", H(V.platform)])
+          }, null, 8, ["class"])),
+          s("div", null, [
+            s("p", Ys, w(P(V.platform)), 1),
+            V.handle ? (i(), m("p", Xs, " @" + w(V.handle), 1)) : k("", !0)
+          ])
+        ])
+      ]),
+      "item-secondary": T(({ item: V }) => [
+        V.url ? (i(), m("a", {
+          key: 0,
+          href: ae(V.url),
+          target: "_blank",
+          rel: "noopener noreferrer",
+          class: "sl-text-xs sl-text-primary-600 dark:sl-text-primary-400 hover:sl-underline",
+          onClick: U[0] || (U[0] = Te(() => {
+          }, ["stop"]))
+        }, " View Profile ", 8, qs)) : k("", !0)
+      ]),
+      _: 1
+    }, 8, ["name", "model-value", "schema", "label"]));
+  }
+});
+let W = null, se = null, ie = null, ee = null, pe = !1;
+const te = /* @__PURE__ */ new Map(), Js = 1e3, Zs = 1e3 * 60 * 60 * 24;
+function Qs(e) {
+  W = e, pe = !1, ee = null, ie = null, se = null;
+}
+function el() {
+  return W !== null && !!W.apiKey;
+}
+async function xe() {
+  if (!pe) {
+    if (ee)
+      return ee;
+    if (!W?.apiKey)
+      throw new Error(
+        '[Geocoding] API key not configured. Call configureGeocoding({ apiKey: "..." }) first, or configure via StachelockUI plugin with googleMaps.apiKey option.'
+      );
+    return ee = (async () => {
+      try {
+        await new Ft({
+          apiKey: W.apiKey,
+          version: W.version || "weekly",
+          id: "__stachelockGoogleMapsScriptId",
+          libraries: W.libraries || ["places", "maps", "geometry"]
+        }).load(), ie = await google.maps.importLibrary("places"), se = new google.maps.Geocoder(), pe = !0;
+      } catch (e) {
+        throw ee = null, console.error("[Geocoding] Error loading Google Maps API:", e), e;
+      }
+    })(), ee;
+  }
+}
+function Ue(e) {
+  return e.trim().toLowerCase().replace(/\s+/g, " ");
+}
+function Ve(e) {
+  return typeof e == "string" ? `str:${Ue(e)}` : `pid:${e.placeId}`;
+}
+function Be(e) {
+  const t = te.get(e);
+  return t ? Date.now() - t.ts > Zs ? (te.delete(e), null) : t.result : null;
+}
+function je(e, t) {
+  try {
+    if (te.size >= Js) {
+      const a = te.keys().next().value;
+      a && te.delete(a);
+    }
+    te.set(e, { result: t, ts: Date.now() });
+  } catch {
+  }
+}
+function Oe(e, t = 15, a = "200x200") {
+  if (!W?.apiKey) return "";
+  const l = W.staticMapsApiKey || W.apiKey, d = "https://maps.googleapis.com/maps/api/staticmap", u = new URLSearchParams({
+    center: `${e.lat},${e.lng}`,
+    zoom: t.toString(),
+    size: a,
+    key: l,
+    markers: `color:red|${e.lat},${e.lng}`
+  });
+  return `${d}?${u.toString()}`;
+}
+async function tl(e) {
+  if (!e?.trim())
+    return {
+      status: "INVALID_INPUT",
+      message: "No placeId provided for geocoding."
+    };
+  await xe();
+  const t = Ve({ placeId: e }), a = Be(t);
+  return a || new Promise((l) => {
+    if (!se) {
+      l({
+        status: "ERROR",
+        message: "Geocoder service not initialized."
+      });
+      return;
+    }
+    se.geocode({ placeId: e }, (d, u) => {
+      if (u === google.maps.GeocoderStatus.OK && d && d.length > 0) {
+        const n = d[0], o = n.geometry ? {
+          lat: n.geometry.location.lat(),
+          lng: n.geometry.location.lng()
+        } : void 0, g = {
+          status: "OK",
+          message: "Found address",
+          address_components: n.address_components || [],
+          location: o,
+          formatted_address: n.formatted_address || "",
+          thumbnailUrl: o ? Oe(o) : void 0
+        };
+        je(t, g), l(g);
+      } else
+        l({
+          status: u.toString(),
+          message: `Unable to geocode place: ${u}`
+        });
+    });
+  });
+}
+function sl(e) {
+  const t = Ue(e);
+  if (t.length < 10) return !1;
+  const a = /\d/.test(t), l = t.includes(","), d = /\b([A-Z]{2})\b/i.test(e), u = /\b\d{5}(?:-\d{4})?\b/.test(t);
+  return (l || d || u) && a;
+}
+async function ll(e) {
+  if (!e?.trim())
+    return {
+      status: "INVALID_INPUT",
+      message: "No address provided for geocoding."
+    };
+  if (!sl(e))
+    return {
+      status: "INVALID_INPUT",
+      message: "Insufficient address information for geocoding."
+    };
+  await xe();
+  const t = Ve(e), a = Be(t);
+  return a || new Promise((l) => {
+    if (!se) {
+      l({
+        status: "ERROR",
+        message: "Geocoder service not initialized."
+      });
+      return;
+    }
+    se.geocode({ address: e }, (d, u) => {
+      if (u === google.maps.GeocoderStatus.OK && d && d.length > 0) {
+        const n = d[0], o = n.geometry ? {
+          lat: n.geometry.location.lat(),
+          lng: n.geometry.location.lng()
+        } : void 0, g = {
+          status: "OK",
+          message: "Found address",
+          address_components: n.address_components || [],
+          location: o,
+          formatted_address: n.formatted_address || "",
+          thumbnailUrl: o ? Oe(o) : void 0
+        };
+        je(t, g), l(g);
+      } else
+        l({
+          status: u.toString(),
+          message: `Unable to geocode address: ${u}`
+        });
+    });
+  });
+}
+async function al(e, t) {
+  if (!e?.trim())
+    return [];
+  if (await xe(), !ie)
+    return console.warn("[Geocoding] Places library not initialized"), [];
+  try {
+    const { AutocompleteSuggestion: a } = ie, l = {
+      input: e,
+      ...t?.includedPrimaryTypes && { includedPrimaryTypes: t.includedPrimaryTypes },
+      ...t?.includedRegionCodes && { includedRegionCodes: t.includedRegionCodes }
+    }, { suggestions: d } = await a.fetchAutocompleteSuggestions(l);
+    return d.filter(
+      (n) => n.placePrediction !== null
+    ).map((n) => {
+      const o = n.placePrediction;
+      return {
+        placeId: o.placeId,
+        description: o.text.toString(),
+        mainText: o.mainText?.toString() || o.text.toString(),
+        secondaryText: o.secondaryText?.toString() || "",
+        types: o.types || []
+      };
+    });
+  } catch (a) {
+    return console.error("[Geocoding] Error fetching autocomplete suggestions:", a), [];
+  }
+}
+function ol(e) {
+  const t = {
+    street: "",
+    city: "",
+    state: "",
+    zipcode: "",
+    country: ""
+  };
+  if (!e?.address_components)
+    return t;
+  let a = "", l = "";
+  for (const d of e.address_components) {
+    const u = d.types;
+    u.includes("street_number") ? a = d.long_name : u.includes("route") ? l = d.long_name : u.includes("locality") ? t.city = d.long_name : u.includes("administrative_area_level_1") ? t.state = d.short_name : u.includes("postal_code") ? t.zipcode = d.long_name : u.includes("country") && (t.country = d.short_name);
+  }
+  return t.street = [a, l].filter(Boolean).join(" "), t;
+}
+function rl(e) {
+  return [
+    e.street,
+    e.city,
+    e.state && e.zipcode ? `${e.state} ${e.zipcode}` : e.state || e.zipcode,
+    e.country
+  ].filter(Boolean).join(", ");
+}
+const nl = { class: "sl-address-input" }, il = { class: "sl-space-y-3" }, dl = { class: "sl-relative" }, cl = { class: "sl-flex sl-flex-col" }, ul = {
+  key: 0,
+  class: "sl-flex sl-items-center sl-justify-between"
+}, ml = { class: "sl-flex sl-items-center sl-gap-2" }, fl = { class: "sl-grid sl-grid-cols-1 sm:sl-grid-cols-2 sl-gap-3 sl-p-3 sl-bg-gray-50 dark:sl-bg-slate-800/50 sl-rounded-lg sl-border sl-border-gray-200 dark:sl-border-slate-700" }, pl = { class: "sm:sl-col-span-2" }, gl = /* @__PURE__ */ F({
+  __name: "AddressInput",
+  props: {
+    name: {},
+    modelValue: {},
+    label: { default: "" },
+    placeholder: { default: "Search for an address..." },
+    disabled: { type: Boolean, default: !1 },
+    rules: {},
+    showSuggestionCount: { type: Boolean, default: !1 },
+    allowManualEntry: { type: Boolean, default: !0 },
+    successMessage: { default: "" },
+    tertiaryLabel: { default: "" },
+    validateOnMount: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "blur", "focus"],
+  setup(e, { expose: t, emit: a }) {
+    const l = e, d = a, u = Xe(l.name || "address-input"), n = Le("googleMaps", void 0);
+    Je(() => {
+      n?.apiKey && !el() && Qs({
+        apiKey: n.apiKey,
+        version: n.version,
+        libraries: n.libraries
+      });
+    });
+    const { value: o, errorMessage: g, meta: y, handleChange: v, setTouched: z } = Dt(
+      () => l.name,
+      l.rules,
+      {
+        validateOnMount: l.validateOnMount,
+        initialValue: l.modelValue
+      }
+    ), h = K([]), r = K(null), c = K(""), p = K(!1), $ = K(!1), f = K("unverified"), x = Me({
+      street: "",
+      suite: "",
+      city: "",
+      state: "",
+      zipcode: "",
+      country: ""
+    }), P = b(() => !!(o.value?.formattedAddress || o.value?.street)), B = b(() => l.showSuggestionCount && h.value.length > 0 ? `${h.value.length} suggestions` : l.tertiaryLabel), H = b(() => {
+      switch (f.value) {
+        case "verified":
+          return "sl-text-green-600 dark:sl-text-green-400";
+        case "error":
+          return "sl-text-red-600 dark:sl-text-red-400";
+        case "pending":
+          return "sl-text-yellow-600 dark:sl-text-yellow-400";
+        default:
+          return "sl-text-gray-500 dark:sl-text-slate-400";
+      }
+    }), ae = b(() => {
+      switch (f.value) {
+        case "verified":
+          return "Verified";
+        case "error":
+          return "Not verified";
+        case "pending":
+          return "Verifying...";
+        default:
+          return "Unverified";
+      }
+    }), N = b(() => {
+      switch (f.value) {
+        case "verified":
+          return ft;
+        case "error":
+          return mt;
+        case "pending":
+          return $e;
+        default:
+          return $e;
+      }
+    }), A = ze(async (S) => {
+      if (!S || S.length < 3) {
+        h.value = [];
+        return;
+      }
+      $.value = !0;
+      try {
+        const I = await al(S);
+        h.value = I;
+      } catch (I) {
+        console.error("[AddressInput] Error fetching suggestions:", I), h.value = [];
+      } finally {
+        $.value = !1;
+      }
+    }, 300);
+    function U(S) {
+      const I = S.target;
+      c.value = I.value, A(I.value);
+    }
+    function V(S) {
+      return S ? S.description : o.value?.formattedAddress ? o.value.formattedAddress : "";
+    }
+    async function Re(S) {
+      if (S) {
+        f.value = "pending", h.value = [];
+        try {
+          const I = await tl(S.placeId);
+          if (I.status === "OK") {
+            f.value = "verified";
+            const L = ol(I);
+            x.street = L.street, x.city = L.city, x.state = L.state, x.zipcode = L.zipcode, x.country = L.country;
+            const X = {
+              formattedAddress: I.formatted_address,
+              street: L.street,
+              suite: x.suite,
+              city: L.city,
+              state: L.state,
+              zipcode: L.zipcode,
+              country: L.country,
+              geocode: I,
+              placeId: S.placeId
+            };
+            o.value = X, v(X), d("update:modelValue", X), p.value = !0;
+          } else
+            f.value = "error", console.warn("[AddressInput] Geocoding failed:", I.message);
+        } catch (I) {
+          f.value = "error", console.error("[AddressInput] Geocoding error:", I);
+        }
+      }
+    }
+    const He = ["street", "city", "state", "zipcode", "country"], Ge = ze(async () => {
+      const S = rl(x);
+      if (!S || S.length < 10) {
+        f.value = "unverified";
+        return;
+      }
+      f.value = "pending";
+      try {
+        const I = await ll(S);
+        if (I.status === "OK") {
+          f.value = "verified";
+          const L = {
+            formattedAddress: I.formatted_address,
+            street: x.street,
+            suite: x.suite,
+            city: x.city,
+            state: x.state,
+            zipcode: x.zipcode,
+            country: x.country,
+            geocode: I,
+            placeId: void 0
+            // Clear placeId since we re-geocoded
+          };
+          o.value = L, v(L), d("update:modelValue", L);
+        } else
+          f.value = "unverified";
+      } catch (I) {
+        f.value = "error", console.error("[AddressInput] Re-geocoding error:", I);
+      }
+    }, 600);
+    function Q(S) {
+      const I = {
+        ...o.value,
+        street: x.street,
+        suite: x.suite,
+        city: x.city,
+        state: x.state,
+        zipcode: x.zipcode,
+        country: x.country
+      };
+      He.includes(S) && (f.value = "unverified", I.geocode = void 0, Ge()), o.value = I, v(I), d("update:modelValue", I);
+    }
+    function Ke(S) {
+      d("focus", S);
+    }
+    function We(S) {
+      z(!0), d("blur", S);
+    }
+    de(
+      () => l.modelValue,
+      (S) => {
+        S && (S.geocode?.status === "OK" ? f.value = "verified" : S.geocode?.status === "ERROR" && (f.value = "error"), S !== o.value && (o.value = S, S.street !== void 0 && (x.street = S.street), S.suite !== void 0 && (x.suite = S.suite), S.city !== void 0 && (x.city = S.city), S.state !== void 0 && (x.state = S.state), S.zipcode !== void 0 && (x.zipcode = S.zipcode), S.country !== void 0 && (x.country = S.country)));
+      },
+      { immediate: !0, deep: !0 }
+    );
+    function Ye() {
+      o.value = void 0, r.value = null, c.value = "", h.value = [], p.value = !1, f.value = "unverified", x.street = "", x.suite = "", x.city = "", x.state = "", x.zipcode = "", x.country = "";
+    }
+    return t({
+      resetInput: Ye,
+      geocodeStatus: f,
+      meta: y,
+      errorMessage: g
+    }), (S, I) => (i(), m("div", nl, [
+      C(Tt, {
+        id: _(u),
+        name: e.name,
+        label: e.label,
+        "tertiary-label": B.value,
+        "error-message": _(g),
+        "success-message": e.successMessage,
+        "is-valid": _(y).valid,
+        "is-touched": _(y).touched,
+        disabled: e.disabled
+      }, {
+        default: T(() => [
+          s("div", il, [
+            C(_($t), {
+              modelValue: r.value,
+              "onUpdate:modelValue": [
+                I[0] || (I[0] = (L) => r.value = L),
+                Re
+              ],
+              disabled: e.disabled,
+              nullable: ""
+            }, {
+              default: T(() => [
+                s("div", dl, [
+                  C(_(_t), {
+                    id: _(u),
+                    "display-value": V,
+                    placeholder: e.placeholder || "Search for an address...",
+                    disabled: e.disabled,
+                    class: E([
+                      "sl-block sl-w-full sl-rounded-lg sl-border sl-py-2.5 sl-pl-3 sl-pr-10 sl-text-sm focus:sl-outline-none",
+                      e.disabled ? "sl-border-gray-200 dark:sl-border-slate-700 sl-bg-gray-50 dark:sl-bg-slate-800 sl-text-gray-500 dark:sl-text-slate-400 sl-cursor-not-allowed" : "sl-border-gray-300 dark:sl-border-slate-600 sl-bg-white dark:sl-bg-slate-900 sl-text-gray-900 dark:sl-text-slate-100 placeholder:sl-text-gray-400 dark:placeholder:sl-text-slate-500 focus:sl-border-stachelock-500 focus:sl-ring-2 focus:sl-ring-stachelock-500"
+                    ]),
+                    onChange: U,
+                    onFocus: Ke,
+                    onBlur: We
+                  }, null, 8, ["id", "placeholder", "disabled", "class"]),
+                  C(_(It), { class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-2" }, {
+                    default: T(() => [
+                      e.disabled ? (i(), D(_(Lt), {
+                        key: 0,
+                        class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-slate-500",
+                        "aria-hidden": "true"
+                      })) : (i(), D(_(Mt), {
+                        key: 1,
+                        class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-slate-400",
+                        "aria-hidden": "true"
+                      }))
+                    ]),
+                    _: 1
+                  }),
+                  C(_(fe), {
+                    leave: "sl-transition sl-ease-in sl-duration-100",
+                    "leave-from": "sl-opacity-100",
+                    "leave-to": "sl-opacity-0"
+                  }, {
+                    default: T(() => [
+                      h.value.length > 0 ? (i(), D(_(St), {
+                        key: 0,
+                        class: "sl-absolute sl-z-50 sl-mt-1 sl-max-h-60 sl-w-full sl-overflow-auto sl-rounded-md sl-bg-white dark:sl-bg-slate-800 sl-py-1 sl-text-base sl-shadow-lg dark:sl-shadow-slate-900/50 sl-ring-1 sl-ring-black sl-ring-opacity-5 dark:sl-ring-slate-700 focus:sl-outline-none sm:sl-text-sm"
+                      }, {
+                        default: T(() => [
+                          (i(!0), m(G, null, Y(h.value, (L) => (i(), D(_(zt), {
+                            key: L.placeId,
+                            value: L,
+                            as: "template"
+                          }, {
+                            default: T(({ active: X, selected: be }) => [
+                              s("li", {
+                                class: E([
+                                  "sl-relative sl-cursor-pointer sl-select-none sl-py-2 sl-pl-10 sl-pr-4",
+                                  X ? "sl-bg-stachelock-600 sl-text-white" : "sl-text-gray-900 dark:sl-text-slate-200"
+                                ])
+                              }, [
+                                s("div", cl, [
+                                  s("span", {
+                                    class: E(["sl-block sl-truncate", be ? "sl-font-medium" : "sl-font-normal"])
+                                  }, w(L.mainText), 3),
+                                  s("span", {
+                                    class: E(["sl-text-xs", X ? "sl-text-stachelock-100" : "sl-text-gray-500 dark:sl-text-slate-400"])
+                                  }, w(L.secondaryText), 3)
+                                ]),
+                                be ? (i(), m("span", {
+                                  key: 0,
+                                  class: E([
+                                    "sl-absolute sl-inset-y-0 sl-left-0 sl-flex sl-items-center sl-pl-3",
+                                    X ? "sl-text-white" : "sl-text-stachelock-600 dark:sl-text-stachelock-400"
+                                  ])
+                                }, [
+                                  C(_(Pt), {
+                                    class: "sl-h-5 sl-w-5",
+                                    "aria-hidden": "true"
+                                  })
+                                ], 2)) : k("", !0)
+                              ], 2)
+                            ]),
+                            _: 2
+                          }, 1032, ["value"]))), 128))
+                        ]),
+                        _: 1
+                      })) : k("", !0)
+                    ]),
+                    _: 1
+                  })
+                ])
+              ]),
+              _: 1
+            }, 8, ["modelValue", "disabled"]),
+            P.value && !e.disabled ? (i(), m("div", ul, [
+              s("div", ml, [
+                s("span", {
+                  class: E(["sl-text-xs sl-uppercase sl-font-medium", H.value])
+                }, w(ae.value), 3),
+                (i(), D(ge(N.value), {
+                  class: E(["sl-h-4 sl-w-4", H.value])
+                }, null, 8, ["class"]))
+              ]),
+              p.value ? (i(), m("button", {
+                key: 1,
+                type: "button",
+                onClick: I[2] || (I[2] = (L) => p.value = !1),
+                class: "sl-text-xs sl-text-gray-500 dark:sl-text-slate-400 hover:sl-underline sl-flex sl-items-center sl-gap-1"
+              }, [
+                I[10] || (I[10] = j(" Collapse ", -1)),
+                C(_(At), { class: "sl-h-3 sl-w-3" })
+              ])) : (i(), m("button", {
+                key: 0,
+                type: "button",
+                onClick: I[1] || (I[1] = (L) => p.value = !0),
+                class: "sl-text-xs sl-text-stachelock-600 dark:sl-text-stachelock-400 hover:sl-underline sl-flex sl-items-center sl-gap-1"
+              }, [
+                I[9] || (I[9] = j(" Edit address ", -1)),
+                C(_(Et), { class: "sl-h-3 sl-w-3" })
+              ]))
+            ])) : k("", !0),
+            C(_(fe), {
+              show: p.value && P.value && !e.disabled,
+              enter: "sl-transition sl-ease-out sl-duration-200",
+              "enter-from": "sl-opacity-0 sl-transform sl--translate-y-2",
+              "enter-to": "sl-opacity-100 sl-transform sl-translate-y-0",
+              leave: "sl-transition sl-ease-in sl-duration-150",
+              "leave-from": "sl-opacity-100 sl-transform sl-translate-y-0",
+              "leave-to": "sl-opacity-0 sl-transform sl--translate-y-2"
+            }, {
+              default: T(() => [
+                s("div", fl, [
+                  s("div", pl, [
+                    C(R, {
+                      name: `${e.name}_street`,
+                      label: "Street Address",
+                      value: x.street,
+                      disabled: e.disabled,
+                      "show-valid-check": !1,
+                      "colorful-validation": !1,
+                      "onUpdate:value": I[3] || (I[3] = (L) => {
+                        x.street = L, Q("street");
+                      })
+                    }, null, 8, ["name", "value", "disabled"])
+                  ]),
+                  s("div", null, [
+                    C(R, {
+                      name: `${e.name}_suite`,
+                      label: "Suite / Apt",
+                      value: x.suite,
+                      disabled: e.disabled,
+                      placeholder: "Optional",
+                      "show-valid-check": !1,
+                      "colorful-validation": !1,
+                      "onUpdate:value": I[4] || (I[4] = (L) => {
+                        x.suite = L, Q("suite");
+                      })
+                    }, null, 8, ["name", "value", "disabled"])
+                  ]),
+                  s("div", null, [
+                    C(R, {
+                      name: `${e.name}_city`,
+                      label: "City",
+                      value: x.city,
+                      disabled: e.disabled,
+                      "show-valid-check": !1,
+                      "colorful-validation": !1,
+                      "onUpdate:value": I[5] || (I[5] = (L) => {
+                        x.city = L, Q("city");
+                      })
+                    }, null, 8, ["name", "value", "disabled"])
+                  ]),
+                  s("div", null, [
+                    C(R, {
+                      name: `${e.name}_state`,
+                      label: "State",
+                      value: x.state,
+                      disabled: e.disabled,
+                      "show-valid-check": !1,
+                      "colorful-validation": !1,
+                      "onUpdate:value": I[6] || (I[6] = (L) => {
+                        x.state = L, Q("state");
+                      })
+                    }, null, 8, ["name", "value", "disabled"])
+                  ]),
+                  s("div", null, [
+                    C(R, {
+                      name: `${e.name}_zipcode`,
+                      label: "ZIP Code",
+                      value: x.zipcode,
+                      disabled: e.disabled,
+                      "show-valid-check": !1,
+                      "colorful-validation": !1,
+                      "onUpdate:value": I[7] || (I[7] = (L) => {
+                        x.zipcode = L, Q("zipcode");
+                      })
+                    }, null, 8, ["name", "value", "disabled"])
+                  ]),
+                  s("div", null, [
+                    C(R, {
+                      name: `${e.name}_country`,
+                      label: "Country",
+                      value: x.country,
+                      disabled: e.disabled,
+                      "show-valid-check": !1,
+                      "colorful-validation": !1,
+                      "onUpdate:value": I[8] || (I[8] = (L) => {
+                        x.country = L, Q("country");
+                      })
+                    }, null, 8, ["name", "value", "disabled"])
+                  ])
+                ])
+              ]),
+              _: 1
+            }, 8, ["show"])
+          ])
+        ]),
+        _: 1
+      }, 8, ["id", "name", "label", "tertiary-label", "error-message", "success-message", "is-valid", "is-touched", "disabled"])
+    ]));
+  }
+}), dr = /* @__PURE__ */ Z(gl, [["__scopeId", "data-v-d65320d7"]]), yl = { class: "sl-bg-white sl-rounded-lg sl-shadow sl-p-6" }, hl = { class: "sl-space-y-8" }, xl = { class: "sl-grid sl-grid-cols-1 sl-md:grid-cols-2 sl-gap-6" }, bl = { class: "sl-bg-gray-50 sl-rounded-md sl-p-4 sl-text-sm sl-text-gray-700" }, vl = { class: "sl-whitespace-pre-wrap" }, cr = /* @__PURE__ */ F({
   __name: "InputsShowcase",
-  setup(t) {
-    const e = Q({
+  setup(e) {
+    const t = Me({
       text: "",
       textArea: "",
       switchOn: !1,
@@ -759,7 +2020,7 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
       selectedFruit: null,
       selectedLanguages: [],
       selectedCity: null
-    }), o = [
+    }), a = [
       { id: 1, name: "Apple" },
       { id: 2, name: "Banana" },
       { id: 3, name: "Cherry" },
@@ -770,7 +2031,7 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
       { id: 3, name: "Python" },
       { id: 4, name: "Go" },
       { id: 5, name: "Rust" }
-    ], r = [
+    ], d = [
       { id: 1, name: "New York" },
       { id: 2, name: "San Francisco" },
       { id: 3, name: "Seattle" },
@@ -780,149 +2041,149 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
       { id: 7, name: "Miami" },
       { id: 8, name: "Boston" }
     ];
-    return (f, a) => (i(), d("section", Ye, [
-      a[15] || (a[15] = s("h2", { class: "sl-text-xl sl-font-semibold sl-mb-4" }, "All Inputs Showcase", -1)),
-      s("div", Je, [
+    return (u, n) => (i(), m("section", yl, [
+      n[15] || (n[15] = s("h2", { class: "sl-text-xl sl-font-semibold sl-mb-4" }, "All Inputs Showcase", -1)),
+      s("div", hl, [
         s("div", null, [
-          a[7] || (a[7] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Text Input", -1)),
-          m(V, {
+          n[7] || (n[7] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Text Input", -1)),
+          C(R, {
             name: "demoText",
             label: "Text Input",
             placeholder: "Type something...",
-            value: e.text,
-            "onUpdate:value": a[0] || (a[0] = (u) => e.text = u)
+            value: t.text,
+            "onUpdate:value": n[0] || (n[0] = (o) => t.text = o)
           }, null, 8, ["value"])
         ]),
         s("div", null, [
-          a[8] || (a[8] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Text Area", -1)),
-          m(re, {
+          n[8] || (n[8] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Text Area", -1)),
+          C(it, {
             name: "demoTextArea",
             label: "Text Area",
             placeholder: "Write a longer message...",
             rows: 4,
             maxlength: 200,
-            modelValue: e.textArea,
-            "onUpdate:modelValue": a[1] || (a[1] = (u) => e.textArea = u)
+            modelValue: t.textArea,
+            "onUpdate:modelValue": n[1] || (n[1] = (o) => t.textArea = o)
           }, null, 8, ["modelValue"])
         ]),
         s("div", null, [
-          a[9] || (a[9] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Switch", -1)),
-          m(ne, {
+          n[9] || (n[9] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Switch", -1)),
+          C(dt, {
             name: "demoSwitch",
             label: "Enable feature",
-            modelValue: e.switchOn,
-            "onUpdate:modelValue": a[2] || (a[2] = (u) => e.switchOn = u),
+            modelValue: t.switchOn,
+            "onUpdate:modelValue": n[2] || (n[2] = (o) => t.switchOn = o),
             textTrue: "ON",
             textFalse: "OFF"
           }, null, 8, ["modelValue"])
         ]),
         s("div", null, [
-          a[10] || (a[10] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Checkbox", -1)),
-          m(oe, {
+          n[10] || (n[10] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Checkbox", -1)),
+          C(rt, {
             name: "demoCheckbox",
             label: "I agree to the terms",
-            modelValue: e.checkbox,
-            "onUpdate:modelValue": a[3] || (a[3] = (u) => e.checkbox = u)
+            modelValue: t.checkbox,
+            "onUpdate:modelValue": n[3] || (n[3] = (o) => t.checkbox = o)
           }, null, 8, ["modelValue"])
         ]),
-        s("div", qe, [
+        s("div", xl, [
           s("div", null, [
-            a[11] || (a[11] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Select (Single)", -1)),
-            m(O, {
+            n[11] || (n[11] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Select (Single)", -1)),
+            C(Ce, {
               name: "demoSelect",
               label: "Favorite Fruit",
               placeholder: "Select a fruit",
-              items: o,
-              modelValue: e.selectedFruit,
-              "onUpdate:modelValue": a[4] || (a[4] = (u) => e.selectedFruit = u)
+              items: a,
+              modelValue: t.selectedFruit,
+              "onUpdate:modelValue": n[4] || (n[4] = (o) => t.selectedFruit = o)
             }, null, 8, ["modelValue"])
           ]),
           s("div", null, [
-            a[12] || (a[12] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Select (Multiple)", -1)),
-            m(O, {
+            n[12] || (n[12] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Select (Multiple)", -1)),
+            C(Ce, {
               name: "demoSelectMulti",
               label: "Favorite Languages",
               placeholder: "Select languages",
               items: l,
               multiple: "",
               showAll: "",
-              modelValue: e.selectedLanguages,
-              "onUpdate:modelValue": a[5] || (a[5] = (u) => e.selectedLanguages = u)
+              modelValue: t.selectedLanguages,
+              "onUpdate:modelValue": n[5] || (n[5] = (o) => t.selectedLanguages = o)
             }, null, 8, ["modelValue"])
           ])
         ]),
         s("div", null, [
-          a[13] || (a[13] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Combobox", -1)),
-          m(ae, {
+          n[13] || (n[13] = s("h3", { class: "sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2" }, "Combobox", -1)),
+          C(nt, {
             name: "demoCombobox",
             label: "Search a City",
             placeholder: "Start typing...",
-            items: r,
-            modelValue: e.selectedCity,
-            "onUpdate:modelValue": a[6] || (a[6] = (u) => e.selectedCity = u)
+            items: d,
+            modelValue: t.selectedCity,
+            "onUpdate:modelValue": n[6] || (n[6] = (o) => t.selectedCity = o)
           }, null, 8, ["modelValue"])
         ]),
-        s("div", Ze, [
-          a[14] || (a[14] = s("div", { class: "sl-font-semibold sl-mb-1" }, "State", -1)),
-          s("pre", Ke, x(e), 1)
+        s("div", bl, [
+          n[14] || (n[14] = s("div", { class: "sl-font-semibold sl-mb-1" }, "State", -1)),
+          s("pre", vl, w(t), 1)
         ])
       ])
     ]));
   }
-}), Qe = { class: "sl-flex sl-items-center sl-gap-4" }, Xe = {
+}), kl = { class: "sl-flex sl-items-center sl-gap-4" }, wl = {
   key: 0,
   class: "sl-flex-shrink-0 sl-flex sl-items-center sl-justify-center"
-}, es = { class: "sl-flex-1 sl-min-w-0" }, ss = {
+}, Cl = { class: "sl-flex-1 sl-min-w-0" }, $l = {
   key: 0,
   class: "sl-flex sl-items-center sl-gap-2"
-}, ts = { class: "sl-text-base sl-font-semibold sl-text-gray-900 dark:sl-text-white sl-truncate" }, ls = {
+}, _l = { class: "sl-text-base sl-font-semibold sl-text-gray-900 dark:sl-text-white sl-truncate" }, Il = {
   key: 0,
   class: "sl-flex-shrink-0"
-}, os = {
+}, Sl = {
   key: 1,
   class: "sl-mt-0.5 sl-text-sm sl-text-gray-500 dark:sl-text-gray-300 sl-truncate"
-}, as = {
+}, zl = {
   key: 1,
   class: "sl-flex sl-items-center sl-gap-2 sl-flex-shrink-0"
-}, rs = ["aria-expanded"], ns = {
+}, Tl = ["aria-expanded"], Ll = {
   key: 1,
   class: "sl-border-t sl-border-gray-200 dark:sl-border-gray-700"
-}, is = { class: "sl-overflow-hidden" }, ds = {
+}, Ml = { class: "sl-overflow-hidden" }, Pl = {
   key: 0,
   class: "sl-border-t sl-border-gray-200 dark:sl-border-gray-700"
-}, cs = { class: "sl-flex sl-items-center sl-justify-between sl-gap-4" }, us = {
+}, El = { class: "sl-flex sl-items-center sl-justify-between sl-gap-4" }, Al = {
   key: 0,
   class: "sl-flex-1 sl-min-w-0"
-}, fs = {
+}, Dl = {
   key: 1,
   class: "sl-flex-1"
-}, ms = {
+}, Fl = {
   key: 2,
   class: "sl-flex sl-items-center sl-gap-3 sl-flex-shrink-0"
-}, ps = {
+}, Nl = {
   key: 0,
   class: "sl-border-t sl-border-gray-200 dark:sl-border-gray-700"
-}, gs = { class: "sl-flex sl-items-center sl-justify-between sl-gap-4" }, xs = {
+}, Ul = { class: "sl-flex sl-items-center sl-justify-between sl-gap-4" }, Vl = {
   key: 0,
   class: "sl-flex-1 sl-min-w-0"
-}, hs = {
+}, Bl = {
   key: 1,
   class: "sl-flex-1"
-}, ys = {
+}, jl = {
   key: 2,
   class: "sl-flex sl-items-center sl-gap-3 sl-flex-shrink-0"
-}, bs = {
+}, Ol = {
   key: 0,
   class: "sl-absolute sl-inset-0 sl-flex sl-items-center sl-justify-center sl-bg-white/80 dark:sl-bg-gray-900/80 sl-rounded-[inherit] sl-z-20 sl-backdrop-blur-sm"
-}, vs = { class: "sl-flex sl-flex-col sl-items-center sl-gap-3" }, Cs = {
+}, Rl = { class: "sl-flex sl-flex-col sl-items-center sl-gap-3" }, Hl = {
   class: "sl-animate-spin sl-h-8 sl-w-8",
   style: { color: "var(--sl-color-primary-600, #4f46e5)" },
   fill: "none",
   viewBox: "0 0 24 24"
-}, ks = {
+}, Gl = {
   key: 0,
   class: "sl-text-sm sl-font-medium sl-text-gray-600 dark:sl-text-gray-300"
-}, ws = /* @__PURE__ */ T({
+}, Kl = /* @__PURE__ */ F({
   __name: "CardLayout",
   props: {
     variant: { default: "elevated" },
@@ -946,31 +2207,31 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
     noPadding: { type: Boolean, default: !1 }
   },
   emits: ["update:collapsed", "expand", "collapse"],
-  setup(t, { expose: e, emit: o }) {
-    const l = t, r = o, f = X(), a = H(l.collapsed);
-    G(() => l.collapsed, (n) => {
-      a.value = n;
+  setup(e, { expose: t, emit: a }) {
+    const l = e, d = a, u = Pe(), n = K(l.collapsed);
+    de(() => l.collapsed, (f) => {
+      n.value = f;
     });
-    const u = y(() => a.value), C = () => {
-      a.value = !a.value, r("update:collapsed", a.value), a.value ? r("collapse") : r("expand");
-    }, w = y(() => l.showHeader !== void 0 ? l.showHeader : !!(f.header || f["header-icon"] || f["header-title"] || f["header-subtitle"] || f["header-badge"] || f["header-actions"] || l.collapsible)), $ = y(() => l.showFooter !== void 0 ? l.showFooter : !!(f.footer || f["footer-left"] || f["footer-actions"])), L = y(() => {
-      const n = [
+    const o = b(() => n.value), g = () => {
+      n.value = !n.value, d("update:collapsed", n.value), n.value ? d("collapse") : d("expand");
+    }, y = b(() => l.showHeader !== void 0 ? l.showHeader : !!(u.header || u["header-icon"] || u["header-title"] || u["header-subtitle"] || u["header-badge"] || u["header-actions"] || l.collapsible)), v = b(() => l.showFooter !== void 0 ? l.showFooter : !!(u.footer || u["footer-left"] || u["footer-actions"])), z = b(() => {
+      const f = [
         "sl-relative",
         "sl-flex",
         "sl-flex-col"
       ];
-      switch (l.fullHeight && n.push("sl-h-full"), l.variant) {
+      switch (l.fullHeight && f.push("sl-h-full"), l.variant) {
         case "elevated":
-          n.push("sl-bg-white", "dark:sl-bg-gray-800");
+          f.push("sl-bg-white", "dark:sl-bg-gray-800");
           break;
         case "outlined":
-          n.push("sl-bg-white", "dark:sl-bg-gray-800", "sl-border", "sl-border-gray-200", "dark:sl-border-gray-700");
+          f.push("sl-bg-white", "dark:sl-bg-gray-800", "sl-border", "sl-border-gray-200", "dark:sl-border-gray-700");
           break;
         case "flat":
-          n.push("sl-bg-transparent");
+          f.push("sl-bg-transparent");
           break;
         case "filled":
-          n.push("sl-bg-gray-50", "dark:sl-bg-gray-800/50");
+          f.push("sl-bg-gray-50", "dark:sl-bg-gray-800/50");
           break;
       }
       if (l.variant === "elevated") {
@@ -981,9 +2242,9 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
           lg: "sl-shadow-lg",
           xl: "sl-shadow-xl"
         };
-        P[l.shadow] && n.push(P[l.shadow]);
+        P[l.shadow] && f.push(P[l.shadow]);
       }
-      const M = {
+      const x = {
         none: "",
         sm: "sl-rounded-sm",
         md: "sl-rounded-md",
@@ -992,99 +2253,99 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
         "2xl": "sl-rounded-2xl",
         full: "sl-rounded-3xl"
       };
-      return M[l.rounded] && n.push(M[l.rounded]), l.hoverable && n.push(
+      return x[l.rounded] && f.push(x[l.rounded]), l.hoverable && f.push(
         "sl-transition-shadow",
         "sl-duration-200",
         "hover:sl-shadow-lg",
         "dark:hover:sl-shadow-gray-900/30"
-      ), l.bgClass && n.push(l.bgClass), l.scrollable && n.push("sl-overflow-hidden"), n;
-    }), I = y(() => {
-      const n = {};
-      return l.scrollable && l.maxHeight && (n.maxHeight = l.maxHeight), n;
-    }), c = y(() => ({
+      ), l.bgClass && f.push(l.bgClass), l.scrollable && f.push("sl-overflow-hidden"), f;
+    }), h = b(() => {
+      const f = {};
+      return l.scrollable && l.maxHeight && (f.maxHeight = l.maxHeight), f;
+    }), r = b(() => ({
       compact: { x: "sl-px-3", y: "sl-py-2" },
       default: { x: "sl-px-4 sm:sl-px-6", y: "sl-py-4" },
       spacious: { x: "sl-px-6 sm:sl-px-8", y: "sl-py-5 sm:sl-py-6" }
-    })[l.size]), h = y(() => [c.value.x, c.value.y]), E = y(() => {
+    })[l.size]), c = b(() => [r.value.x, r.value.y]), p = b(() => {
       if (l.noPadding)
         return [];
-      const n = [c.value.x, c.value.y];
-      return l.scrollable && n.push("sl-flex-1", "sl-min-h-0"), n;
-    }), z = y(() => {
-      const n = {
+      const f = [r.value.x, r.value.y];
+      return l.scrollable && f.push("sl-flex-1", "sl-min-h-0"), f;
+    }), $ = b(() => {
+      const f = {
         compact: "sl-py-2",
         default: "sl-py-3",
         spacious: "sl-py-4"
       };
-      return [c.value.x, n[l.size], "sl-bg-gray-50/50 dark:sl-bg-gray-800/50"];
+      return [r.value.x, f[l.size], "sl-bg-gray-50/50 dark:sl-bg-gray-800/50"];
     });
-    return e({
-      toggleCollapse: C,
-      isCollapsed: u
-    }), (n, M) => (i(), d("div", {
-      class: v([
+    return t({
+      toggleCollapse: g,
+      isCollapsed: o
+    }), (f, x) => (i(), m("div", {
+      class: E([
         "sl-card-layout",
-        L.value,
-        { "sl-cursor-pointer": t.hoverable }
+        z.value,
+        { "sl-cursor-pointer": e.hoverable }
       ]),
-      style: k(I.value)
+      style: O(h.value)
     }, [
-      w.value ? (i(), d("div", {
+      y.value ? (i(), m("div", {
         key: 0,
-        class: v([
+        class: E([
           "sl-card-header",
-          h.value,
-          { "sl-sticky sl-top-0 sl-z-10 sl-bg-inherit": t.headerSticky && t.scrollable }
+          c.value,
+          { "sl-sticky sl-top-0 sl-z-10 sl-bg-inherit": e.headerSticky && e.scrollable }
         ])
       }, [
-        p(n.$slots, "header", {}, () => [
-          s("div", Qe, [
-            n.$slots["header-icon"] ? (i(), d("div", Xe, [
-              p(n.$slots, "header-icon", {}, void 0, !0)
-            ])) : g("", !0),
-            s("div", es, [
-              n.$slots["header-title"] ? (i(), d("div", ss, [
-                s("h3", ts, [
-                  p(n.$slots, "header-title", {}, void 0, !0)
+        M(f.$slots, "header", {}, () => [
+          s("div", kl, [
+            f.$slots["header-icon"] ? (i(), m("div", wl, [
+              M(f.$slots, "header-icon", {}, void 0, !0)
+            ])) : k("", !0),
+            s("div", Cl, [
+              f.$slots["header-title"] ? (i(), m("div", $l, [
+                s("h3", _l, [
+                  M(f.$slots, "header-title", {}, void 0, !0)
                 ]),
-                n.$slots["header-badge"] ? (i(), d("div", ls, [
-                  p(n.$slots, "header-badge", {}, void 0, !0)
-                ])) : g("", !0)
-              ])) : g("", !0),
-              n.$slots["header-subtitle"] ? (i(), d("p", os, [
-                p(n.$slots, "header-subtitle", {}, void 0, !0)
-              ])) : g("", !0)
+                f.$slots["header-badge"] ? (i(), m("div", Il, [
+                  M(f.$slots, "header-badge", {}, void 0, !0)
+                ])) : k("", !0)
+              ])) : k("", !0),
+              f.$slots["header-subtitle"] ? (i(), m("p", Sl, [
+                M(f.$slots, "header-subtitle", {}, void 0, !0)
+              ])) : k("", !0)
             ]),
-            n.$slots["header-actions"] || t.collapsible ? (i(), d("div", as, [
-              p(n.$slots, "header-actions", {}, void 0, !0),
-              t.collapsible ? (i(), d("button", {
+            f.$slots["header-actions"] || e.collapsible ? (i(), m("div", zl, [
+              M(f.$slots, "header-actions", {}, void 0, !0),
+              e.collapsible ? (i(), m("button", {
                 key: 0,
                 type: "button",
-                onClick: C,
+                onClick: g,
                 class: "sl-p-1.5 sl-rounded-md sl-text-gray-400 hover:sl-text-gray-600 hover:sl-bg-gray-100 dark:hover:sl-bg-gray-700 dark:hover:sl-text-gray-300 sl-transition-colors",
-                "aria-expanded": !u.value,
+                "aria-expanded": !o.value,
                 "aria-label": "Toggle content"
               }, [
-                (i(), d("svg", {
-                  class: v(["sl-h-5 sl-w-5 sl-transition-transform sl-duration-200", { "sl-rotate-180": !u.value }]),
+                (i(), m("svg", {
+                  class: E(["sl-h-5 sl-w-5 sl-transition-transform sl-duration-200", { "sl-rotate-180": !o.value }]),
                   fill: "none",
                   viewBox: "0 0 24 24",
                   stroke: "currentColor",
                   "stroke-width": "2"
-                }, [...M[0] || (M[0] = [
+                }, [...x[0] || (x[0] = [
                   s("path", {
                     "stroke-linecap": "round",
                     "stroke-linejoin": "round",
                     d: "M19 9l-7 7-7-7"
                   }, null, -1)
                 ])], 2))
-              ], 8, rs)) : g("", !0)
-            ])) : g("", !0)
+              ], 8, Tl)) : k("", !0)
+            ])) : k("", !0)
           ])
         ], !0)
-      ], 2)) : g("", !0),
-      w.value && t.divided && !u.value ? (i(), d("div", ns)) : g("", !0),
-      t.collapsible ? (i(), W(U, {
+      ], 2)) : k("", !0),
+      y.value && e.divided && !o.value ? (i(), m("div", Ll)) : k("", !0),
+      e.collapsible ? (i(), D(we, {
         key: 2,
         "enter-active-class": "sl-transition-all sl-duration-200 sl-ease-out",
         "enter-from-class": "sl-opacity-0 sl-max-h-0",
@@ -1093,80 +2354,80 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
         "leave-from-class": "sl-opacity-100",
         "leave-to-class": "sl-opacity-0 sl-max-h-0"
       }, {
-        default: b(() => [
-          D(s("div", is, [
+        default: T(() => [
+          me(s("div", Ml, [
             s("div", {
-              class: v([
+              class: E([
                 "sl-card-body",
-                E.value,
-                { "sl-overflow-y-auto": t.scrollable }
+                p.value,
+                { "sl-overflow-y-auto": e.scrollable }
               ]),
-              style: k(t.scrollable && t.maxHeight ? { maxHeight: t.maxHeight } : {})
+              style: O(e.scrollable && e.maxHeight ? { maxHeight: e.maxHeight } : {})
             }, [
-              p(n.$slots, "body", {}, () => [
-                p(n.$slots, "default", {}, void 0, !0)
+              M(f.$slots, "body", {}, () => [
+                M(f.$slots, "default", {}, void 0, !0)
               ], !0)
             ], 6),
-            $.value && t.divided ? (i(), d("div", ds)) : g("", !0),
-            $.value ? (i(), d("div", {
+            v.value && e.divided ? (i(), m("div", Pl)) : k("", !0),
+            v.value ? (i(), m("div", {
               key: 1,
-              class: v([
+              class: E([
                 "sl-card-footer",
-                z.value,
-                { "sl-sticky sl-bottom-0 sl-z-10 sl-bg-inherit": t.footerSticky && t.scrollable }
+                $.value,
+                { "sl-sticky sl-bottom-0 sl-z-10 sl-bg-inherit": e.footerSticky && e.scrollable }
               ])
             }, [
-              p(n.$slots, "footer", {}, () => [
-                s("div", cs, [
-                  n.$slots["footer-left"] ? (i(), d("div", us, [
-                    p(n.$slots, "footer-left", {}, void 0, !0)
-                  ])) : (i(), d("div", fs)),
-                  n.$slots["footer-actions"] ? (i(), d("div", ms, [
-                    p(n.$slots, "footer-actions", {}, void 0, !0)
-                  ])) : g("", !0)
+              M(f.$slots, "footer", {}, () => [
+                s("div", El, [
+                  f.$slots["footer-left"] ? (i(), m("div", Al, [
+                    M(f.$slots, "footer-left", {}, void 0, !0)
+                  ])) : (i(), m("div", Dl)),
+                  f.$slots["footer-actions"] ? (i(), m("div", Fl, [
+                    M(f.$slots, "footer-actions", {}, void 0, !0)
+                  ])) : k("", !0)
                 ])
               ], !0)
-            ], 2)) : g("", !0)
+            ], 2)) : k("", !0)
           ], 512), [
-            [ee, !u.value]
+            [Ze, !o.value]
           ])
         ]),
         _: 3
-      })) : (i(), d(j, { key: 3 }, [
+      })) : (i(), m(G, { key: 3 }, [
         s("div", {
-          class: v([
+          class: E([
             "sl-card-body",
-            E.value,
-            { "sl-overflow-y-auto": t.scrollable }
+            p.value,
+            { "sl-overflow-y-auto": e.scrollable }
           ]),
-          style: k(t.scrollable && t.maxHeight ? { maxHeight: t.maxHeight } : {})
+          style: O(e.scrollable && e.maxHeight ? { maxHeight: e.maxHeight } : {})
         }, [
-          p(n.$slots, "body", {}, () => [
-            p(n.$slots, "default", {}, void 0, !0)
+          M(f.$slots, "body", {}, () => [
+            M(f.$slots, "default", {}, void 0, !0)
           ], !0)
         ], 6),
-        $.value && t.divided ? (i(), d("div", ps)) : g("", !0),
-        $.value ? (i(), d("div", {
+        v.value && e.divided ? (i(), m("div", Nl)) : k("", !0),
+        v.value ? (i(), m("div", {
           key: 1,
-          class: v([
+          class: E([
             "sl-card-footer",
-            z.value,
-            { "sl-sticky sl-bottom-0 sl-z-10 sl-bg-inherit": t.footerSticky && t.scrollable }
+            $.value,
+            { "sl-sticky sl-bottom-0 sl-z-10 sl-bg-inherit": e.footerSticky && e.scrollable }
           ])
         }, [
-          p(n.$slots, "footer", {}, () => [
-            s("div", gs, [
-              n.$slots["footer-left"] ? (i(), d("div", xs, [
-                p(n.$slots, "footer-left", {}, void 0, !0)
-              ])) : (i(), d("div", hs)),
-              n.$slots["footer-actions"] ? (i(), d("div", ys, [
-                p(n.$slots, "footer-actions", {}, void 0, !0)
-              ])) : g("", !0)
+          M(f.$slots, "footer", {}, () => [
+            s("div", Ul, [
+              f.$slots["footer-left"] ? (i(), m("div", Vl, [
+                M(f.$slots, "footer-left", {}, void 0, !0)
+              ])) : (i(), m("div", Bl)),
+              f.$slots["footer-actions"] ? (i(), m("div", jl, [
+                M(f.$slots, "footer-actions", {}, void 0, !0)
+              ])) : k("", !0)
             ])
           ], !0)
-        ], 2)) : g("", !0)
+        ], 2)) : k("", !0)
       ], 64)),
-      m(U, {
+      C(we, {
         "enter-active-class": "sl-transition-opacity sl-duration-200",
         "enter-from-class": "sl-opacity-0",
         "enter-to-class": "sl-opacity-100",
@@ -1174,11 +2435,11 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
         "leave-from-class": "sl-opacity-100",
         "leave-to-class": "sl-opacity-0"
       }, {
-        default: b(() => [
-          t.loading ? (i(), d("div", bs, [
-            p(n.$slots, "loading", {}, () => [
-              s("div", vs, [
-                (i(), d("svg", Cs, [...M[1] || (M[1] = [
+        default: T(() => [
+          e.loading ? (i(), m("div", Ol, [
+            M(f.$slots, "loading", {}, () => [
+              s("div", Rl, [
+                (i(), m("svg", Hl, [...x[1] || (x[1] = [
                   s("circle", {
                     class: "sl-opacity-25",
                     cx: "12",
@@ -1193,89 +2454,89 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
                     d: "m4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
                   }, null, -1)
                 ])])),
-                t.loadingText ? (i(), d("span", ks, x(t.loadingText), 1)) : g("", !0)
+                e.loadingText ? (i(), m("span", Gl, w(e.loadingText), 1)) : k("", !0)
               ])
             ], !0)
-          ])) : g("", !0)
+          ])) : k("", !0)
         ]),
         _: 3
       })
     ], 6));
   }
-}), bt = /* @__PURE__ */ J(ws, [["__scopeId", "data-v-a1ea2aac"]]), $s = "sl-text-sm", vt = /* @__PURE__ */ T({
+}), ur = /* @__PURE__ */ Z(Kl, [["__scopeId", "data-v-a1ea2aac"]]), Wl = "sl-text-sm", mr = /* @__PURE__ */ F({
   __name: "InfoCard",
   props: {
     title: { default: "" },
     variant: { default: "info" }
   },
-  setup(t) {
-    const e = t, o = y(() => ({
+  setup(e) {
+    const t = e, a = b(() => ({
       info: { bg: "var(--info-bg, #eff6ff)", border: "var(--info-border, #bfdbfe)" },
       warning: { bg: "var(--warning-bg, #fffbeb)", border: "var(--warning-border, #fcd34d)" },
       success: { bg: "var(--success-bg, #f0fdf4)", border: "var(--success-border, #86efac)" },
       error: { bg: "var(--error-bg, #fef2f2)", border: "var(--error-border, #fca5a5)" }
-    })[e.variant]), l = y(() => ({ color: {
+    })[t.variant]), l = b(() => ({ color: {
       info: "var(--info-title)",
       warning: "var(--warning-title)",
       success: "var(--success-title)",
       error: "var(--error-title)"
-    }[e.variant] })), r = y(() => ({ color: {
+    }[t.variant] })), d = b(() => ({ color: {
       info: "var(--info-text)",
       warning: "var(--warning-text)",
       success: "var(--success-text)",
       error: "var(--error-text)"
-    }[e.variant] }));
-    return (f, a) => (i(), d("div", {
+    }[t.variant] }));
+    return (u, n) => (i(), m("div", {
       class: "sl-rounded-xl sl-border sl-p-4",
-      style: k({ backgroundColor: o.value.bg, borderColor: o.value.border })
+      style: O({ backgroundColor: a.value.bg, borderColor: a.value.border })
     }, [
-      t.title ? (i(), d("h3", {
+      e.title ? (i(), m("h3", {
         key: 0,
         class: "sl-font-medium sl-mb-2",
-        style: k(l.value)
-      }, x(t.title), 5)) : g("", !0),
+        style: O(l.value)
+      }, w(e.title), 5)) : k("", !0),
       s("div", {
-        class: v($s),
-        style: k(r.value)
+        class: E(Wl),
+        style: O(d.value)
       }, [
-        p(f.$slots, "default")
+        M(u.$slots, "default")
       ], 4)
     ], 4));
   }
-}), _s = { class: "sl-space-y-4" }, Ss = { class: "sl-text-xl sl-font-semibold sl-text-slate-900 dark:sl-text-white" }, Ts = { class: "sl-overflow-x-auto" }, Is = { class: "sl-min-w-full sl-divide-y sl-divide-slate-200 dark:sl-divide-slate-700" }, Ms = { class: "sl-bg-slate-50 dark:sl-bg-slate-900" }, Vs = { class: "sl-divide-y sl-divide-slate-200 dark:sl-divide-slate-700" }, js = { class: "sl-px-6 sl-py-4 sl-text-sm sl-font-mono sl-text-slate-900 dark:sl-text-slate-100" }, As = { class: "sl-px-6 sl-py-4 sl-text-sm sl-text-slate-600 dark:sl-text-slate-300" }, Bs = { class: "sl-px-6 sl-py-4 sl-text-sm sl-font-mono sl-text-slate-500 dark:sl-text-slate-300" }, Ls = { class: "sl-px-6 sl-py-4 sl-text-sm sl-text-slate-600 dark:sl-text-slate-300" }, Ct = /* @__PURE__ */ T({
+}), Yl = { class: "sl-space-y-4" }, Xl = { class: "sl-text-xl sl-font-semibold sl-text-slate-900 dark:sl-text-white" }, ql = { class: "sl-overflow-x-auto" }, Jl = { class: "sl-min-w-full sl-divide-y sl-divide-slate-200 dark:sl-divide-slate-700" }, Zl = { class: "sl-bg-slate-50 dark:sl-bg-slate-900" }, Ql = { class: "sl-divide-y sl-divide-slate-200 dark:sl-divide-slate-700" }, ea = { class: "sl-px-6 sl-py-4 sl-text-sm sl-font-mono sl-text-slate-900 dark:sl-text-slate-100" }, ta = { class: "sl-px-6 sl-py-4 sl-text-sm sl-text-slate-600 dark:sl-text-slate-300" }, sa = { class: "sl-px-6 sl-py-4 sl-text-sm sl-font-mono sl-text-slate-500 dark:sl-text-slate-300" }, la = { class: "sl-px-6 sl-py-4 sl-text-sm sl-text-slate-600 dark:sl-text-slate-300" }, fr = /* @__PURE__ */ F({
   __name: "PropsTable",
   props: {
     title: { default: "Props" },
     props: {}
   },
-  setup(t) {
-    const e = ["Prop", "Type", "Default", "Description"];
-    return (o, l) => (i(), d("section", _s, [
-      s("h2", Ss, x(t.title), 1),
+  setup(e) {
+    const t = ["Prop", "Type", "Default", "Description"];
+    return (a, l) => (i(), m("section", Yl, [
+      s("h2", Xl, w(e.title), 1),
       s("div", {
-        class: v(["sl-rounded-xl sl-shadow-sm sl-border sl-overflow-hidden", [
+        class: E(["sl-rounded-xl sl-shadow-sm sl-border sl-overflow-hidden", [
           "sl-bg-white dark:sl-bg-slate-800",
           "sl-border-slate-200 dark:sl-border-slate-700"
         ]])
       }, [
-        s("div", Ts, [
-          s("table", Is, [
-            s("thead", Ms, [
+        s("div", ql, [
+          s("table", Jl, [
+            s("thead", Zl, [
               s("tr", null, [
-                (i(), d(j, null, B(e, (r) => s("th", {
-                  key: r,
-                  class: v(["sl-px-6 sl-py-3 sl-text-left sl-text-xs sl-font-medium sl-uppercase sl-tracking-wider", "sl-text-slate-500 dark:sl-text-slate-300"])
-                }, x(r), 1)), 64))
+                (i(), m(G, null, Y(t, (d) => s("th", {
+                  key: d,
+                  class: E(["sl-px-6 sl-py-3 sl-text-left sl-text-xs sl-font-medium sl-uppercase sl-tracking-wider", "sl-text-slate-500 dark:sl-text-slate-300"])
+                }, w(d), 1)), 64))
               ])
             ]),
-            s("tbody", Vs, [
-              (i(!0), d(j, null, B(t.props, (r) => (i(), d("tr", {
-                key: r.name
+            s("tbody", Ql, [
+              (i(!0), m(G, null, Y(e.props, (d) => (i(), m("tr", {
+                key: d.name
               }, [
-                s("td", js, x(r.name), 1),
-                s("td", As, x(r.type), 1),
-                s("td", Bs, x(r.default), 1),
-                s("td", Ls, x(r.description), 1)
+                s("td", ea, w(d.name), 1),
+                s("td", ta, w(d.type), 1),
+                s("td", sa, w(d.default), 1),
+                s("td", la, w(d.description), 1)
               ]))), 128))
             ])
           ])
@@ -1283,21 +2544,21 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
       ])
     ]));
   }
-}), Es = {
+}), aa = {
   class: "sl-rounded-xl sl-shadow-sm sl-border sl-overflow-hidden",
   style: { backgroundColor: "var(--sl-surface-elevated)", borderColor: "var(--sl-border-default)" }
-}, Fs = {
+}, oa = {
   key: 0,
   class: "sl-px-6 sl-py-4 sl-border-b",
   style: { backgroundColor: "var(--sl-surface-sunken)", borderColor: "var(--sl-border-default)" }
-}, Ds = {
+}, ra = {
   class: "sl-text-lg sl-font-semibold",
   style: { color: "var(--sl-text-primary)" }
-}, zs = {
+}, na = {
   key: 0,
   class: "sl-text-sm sl-mt-1",
   style: { color: "var(--sl-text-muted)" }
-}, kt = /* @__PURE__ */ T({
+}, pr = /* @__PURE__ */ F({
   __name: "ShowcaseCard",
   props: {
     title: { default: "" },
@@ -1305,36 +2566,36 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
     contentClass: { default: "" },
     padded: { type: Boolean, default: !0 }
   },
-  setup(t) {
-    const e = t, o = y(() => {
+  setup(e) {
+    const t = e, a = b(() => {
       const l = [];
-      return e.padded && l.push("sl-p-6"), e.contentClass && l.push(e.contentClass), l.join(" ");
+      return t.padded && l.push("sl-p-6"), t.contentClass && l.push(t.contentClass), l.join(" ");
     });
-    return (l, r) => (i(), d("div", Es, [
-      t.title || l.$slots.header ? (i(), d("div", Fs, [
-        p(l.$slots, "header", {}, () => [
-          s("h2", Ds, x(t.title), 1),
-          t.description ? (i(), d("p", zs, x(t.description), 1)) : g("", !0)
+    return (l, d) => (i(), m("div", aa, [
+      e.title || l.$slots.header ? (i(), m("div", oa, [
+        M(l.$slots, "header", {}, () => [
+          s("h2", ra, w(e.title), 1),
+          e.description ? (i(), m("p", na, w(e.description), 1)) : k("", !0)
         ])
-      ])) : g("", !0),
+      ])) : k("", !0),
       s("div", {
-        class: v(o.value)
+        class: E(a.value)
       }, [
-        p(l.$slots, "default")
+        M(l.$slots, "default")
       ], 2)
     ]));
   }
-}), Ps = { class: "sl-space-y-8" }, Ns = { class: "sl-space-y-2" }, Us = {
+}), ia = { class: "sl-space-y-8" }, da = { class: "sl-space-y-2" }, ca = {
   class: "sl-text-3xl sl-font-bold",
   style: { color: "var(--sl-text-primary)" }
-}, Os = {
+}, ua = {
   class: "sl-text-lg",
   style: { color: "var(--sl-text-muted)" }
-}, Rs = {
+}, ma = {
   key: 0,
   class: "sl-flex sl-flex-wrap sl-gap-2 sl-pb-4",
   style: { borderBottom: "1px solid var(--sl-border-default)" }
-}, Hs = ["onClick"], Gs = { class: "sl-space-y-8" }, wt = /* @__PURE__ */ T({
+}, fa = ["onClick"], pa = { class: "sl-space-y-8" }, gr = /* @__PURE__ */ F({
   __name: "ShowcaseLayout",
   props: {
     title: {},
@@ -1343,59 +2604,642 @@ const be = { class: "sl-fixed sl-inset-0 sl-z-10 sl-w-screen sl-overflow-y-auto"
     modelValue: { default: "" }
   },
   emits: ["update:modelValue"],
-  setup(t, { emit: e }) {
-    const o = t, l = e, { isDark: r } = Y(), f = (u) => {
-      l("update:modelValue", u);
-    }, a = (u) => o.modelValue === u ? {
-      backgroundColor: r.value ? "#ffffff" : "#0f172a",
-      color: r.value ? "#0f172a" : "#ffffff",
+  setup(e, { emit: t }) {
+    const a = e, l = t, { isDark: d } = Ee(), u = (o) => {
+      l("update:modelValue", o);
+    }, n = (o) => a.modelValue === o ? {
+      backgroundColor: d.value ? "#ffffff" : "#0f172a",
+      color: d.value ? "#0f172a" : "#ffffff",
       boxShadow: "0 1px 2px 0 rgb(0 0 0 / 0.05)"
     } : {
       backgroundColor: "transparent",
       color: "var(--sl-text-muted)"
     };
-    return (u, C) => (i(), d("div", Ps, [
-      s("header", Ns, [
-        s("h1", Us, x(t.title), 1),
-        s("p", Os, x(t.description), 1),
-        p(u.$slots, "header-extra")
+    return (o, g) => (i(), m("div", ia, [
+      s("header", da, [
+        s("h1", ca, w(e.title), 1),
+        s("p", ua, w(e.description), 1),
+        M(o.$slots, "header-extra")
       ]),
-      t.variants && t.variants.length > 0 ? (i(), d("nav", Rs, [
-        (i(!0), d(j, null, B(t.variants, (w) => (i(), d("button", {
-          key: w.id,
-          onClick: ($) => f(w.id),
+      e.variants && e.variants.length > 0 ? (i(), m("nav", ma, [
+        (i(!0), m(G, null, Y(e.variants, (y) => (i(), m("button", {
+          key: y.id,
+          onClick: (v) => u(y.id),
           class: "sl-px-4 sl-py-2 sl-text-sm sl-font-medium sl-rounded-lg sl-transition-all sl-duration-150",
-          style: k(a(w.id))
-        }, x(w.label || w.name), 13, Hs))), 128))
-      ])) : g("", !0),
-      s("div", Gs, [
-        p(u.$slots, "content", {}, () => [
-          p(u.$slots, "default")
+          style: O(n(y.id))
+        }, w(y.label || y.name), 13, fa))), 128))
+      ])) : k("", !0),
+      s("div", pa, [
+        M(o.$slots, "content", {}, () => [
+          M(o.$slots, "default")
         ])
       ]),
-      p(u.$slots, "footer")
+      M(o.$slots, "footer")
     ]));
   }
-}), Ws = { class: "sl-space-y-4" }, Ys = {
+}), ga = { class: "sl-space-y-4" }, ya = {
   class: "sl-text-xl sl-font-semibold",
   style: { color: "var(--sl-text-primary)" }
-}, Js = { class: "sl-rounded-xl sl-p-4 sl-overflow-auto sl-bg-slate-800 dark:sl-bg-slate-900" }, qs = { class: "sl-text-sm sl-text-slate-300 sl-font-mono" }, $t = /* @__PURE__ */ T({
+}, ha = { class: "sl-rounded-xl sl-p-4 sl-overflow-auto sl-bg-slate-800 dark:sl-bg-slate-900" }, xa = { class: "sl-text-sm sl-text-slate-300 sl-font-mono" }, yr = /* @__PURE__ */ F({
   __name: "StateDisplay",
   props: {
     title: { default: "Current State" },
     state: {}
   },
-  setup(t) {
-    const e = t, o = y(() => JSON.stringify(e.state, null, 2));
-    return (l, r) => (i(), d("section", Ws, [
-      s("h2", Ys, x(t.title), 1),
-      s("div", Js, [
-        s("pre", qs, x(o.value), 1)
+  setup(e) {
+    const t = e, a = b(() => JSON.stringify(t.state, null, 2));
+    return (l, d) => (i(), m("section", ga, [
+      s("h2", ya, w(e.title), 1),
+      s("div", ha, [
+        s("pre", xa, w(a.value), 1)
       ])
     ]));
   }
-});
-class Zs {
+}), ba = { class: "sl-relative sl-z-10 sl-flex sl-flex-col sm:sl-flex-row sl-items-center sl-gap-6" }, va = { class: "sl-flex-shrink-0" }, ka = { class: "sl-relative" }, wa = ["src", "alt"], Ca = {
+  key: 1,
+  class: "sl-w-full sl-h-full sl-flex sl-items-center sl-justify-center sl-bg-white/20 sl-text-white sl-text-2xl sl-font-bold"
+}, $a = {
+  key: 0,
+  class: "sl-absolute sl--bottom-1 sl--right-1 sl-flex sl-items-center sl-justify-center sl-w-8 sl-h-8 sl-rounded-full sl-bg-red-500 sl-ring-4 sl-ring-white dark:sl-ring-gray-800"
+}, _a = { class: "sl-text-center sm:sl-text-left" }, Ia = { class: "sl-text-3xl sl-font-bold sl-text-white sl-tracking-tight" }, Sa = {
+  key: 0,
+  class: "sl-mt-1 sl-text-lg sl-text-white/80"
+}, za = {
+  key: 1,
+  class: "sl-mt-3"
+}, Ta = { class: "sl-inline-flex sl-items-center sl-gap-1.5 sl-px-3 sl-py-1 sl-rounded-full sl-text-sm sl-font-medium sl-bg-red-500/20 sl-text-white sl-border sl-border-red-400/30" }, La = /* @__PURE__ */ F({
+  __name: "ProfileHeaderCard",
+  props: {
+    name: {},
+    nickname: {},
+    image: {},
+    status: {},
+    animationIndex: { default: 0 },
+    animationEnabled: { type: Boolean, default: !0 }
+  },
+  setup(e) {
+    const t = e, a = K(!1), l = b(() => t.status === "inactive"), d = b(() => a.value || !t.image ? null : typeof t.image == "string" ? t.image : t.image.secure_url || t.image.url || null), u = b(() => {
+      if (!t.name) return "?";
+      const g = t.name.split(" ").filter(Boolean);
+      return g.length >= 2 ? `${g[0][0]}${g[g.length - 1][0]}`.toUpperCase() : t.name.substring(0, 2).toUpperCase();
+    }), n = b(() => t.animationEnabled ? {
+      animationDelay: `${t.animationIndex * 75}ms`
+    } : {}), o = () => {
+      a.value = !0;
+    };
+    return (g, y) => (i(), m("div", {
+      class: E([
+        "sl-profile-header-card",
+        "sl-relative sl-overflow-hidden",
+        "sl-rounded-2xl",
+        "sl-shadow-lg",
+        "sl-p-8",
+        e.animationEnabled && "sl-opacity-0 sl-animate-[fadeInUp_0.4s_ease-out_forwards]"
+      ]),
+      style: O(n.value)
+    }, [
+      y[1] || (y[1] = s("div", { class: "sl-absolute sl-inset-0 sl-bg-gradient-to-br sl-from-primary-500 sl-via-primary-600 sl-to-primary-700 dark:sl-from-primary-600 dark:sl-via-primary-700 dark:sl-to-primary-800" }, null, -1)),
+      y[2] || (y[2] = s("div", { class: "sl-absolute sl-top-0 sl-right-0 sl-w-64 sl-h-64 sl-bg-white/5 sl-rounded-full sl--translate-y-1/2 sl-translate-x-1/2" }, null, -1)),
+      y[3] || (y[3] = s("div", { class: "sl-absolute sl-bottom-0 sl-left-0 sl-w-48 sl-h-48 sl-bg-white/5 sl-rounded-full sl-translate-y-1/2 sl--translate-x-1/2" }, null, -1)),
+      s("div", ba, [
+        s("div", va, [
+          s("div", ka, [
+            s("div", {
+              class: E([
+                "sl-w-24 sl-h-24 sl-rounded-full sl-overflow-hidden sl-shadow-xl",
+                l.value ? "sl-ring-4 sl-ring-red-400/50" : "sl-ring-4 sl-ring-white/30"
+              ])
+            }, [
+              d.value ? (i(), m("img", {
+                key: 0,
+                src: d.value,
+                alt: e.name,
+                class: "sl-w-full sl-h-full sl-object-cover",
+                onError: o
+              }, null, 40, wa)) : (i(), m("div", Ca, w(u.value), 1))
+            ], 2),
+            l.value ? (i(), m("span", $a, [
+              C(_(Nt), { class: "sl-w-4 sl-h-4 sl-text-white" })
+            ])) : k("", !0)
+          ])
+        ]),
+        s("div", _a, [
+          s("h1", Ia, w(e.name || "Unknown User"), 1),
+          e.nickname ? (i(), m("p", Sa, w(e.nickname), 1)) : k("", !0),
+          l.value ? (i(), m("div", za, [
+            s("span", Ta, [
+              C(_(Ut), { class: "sl-w-4 sl-h-4" }),
+              y[0] || (y[0] = j(" Inactive ", -1))
+            ])
+          ])) : k("", !0)
+        ])
+      ])
+    ], 6));
+  }
+}), Ma = /* @__PURE__ */ Z(La, [["__scopeId", "data-v-a51f3fb7"]]), Pa = {
+  key: 0,
+  class: "sl-flex sl-items-center sl-gap-3 sl-border-b sl-border-gray-100 dark:sl-border-gray-700 sl-px-5 sl-py-4"
+}, Ea = {
+  key: 1,
+  class: "sl-text-sm sl-font-semibold sl-text-gray-900 dark:sl-text-gray-100"
+}, Aa = /* @__PURE__ */ F({
+  __name: "ProfileCard",
+  props: {
+    title: {},
+    icon: {},
+    animationIndex: { default: 0 },
+    animationDelay: { default: 75 },
+    noPadding: { type: Boolean, default: !1 },
+    animationEnabled: { type: Boolean, default: !0 }
+  },
+  setup(e) {
+    const t = e, a = Pe(), l = b(() => t.title || t.icon || a.header), d = b(() => t.animationEnabled ? {
+      animationDelay: `${t.animationIndex * t.animationDelay}ms`
+    } : {});
+    return (u, n) => (i(), m("div", {
+      class: E([
+        "sl-profile-card",
+        "sl-relative sl-overflow-hidden",
+        "sl-rounded-xl sl-bg-white dark:sl-bg-gray-800",
+        "sl-shadow-sm sl-ring-1 sl-ring-gray-200 dark:sl-ring-gray-700",
+        e.animationEnabled && "sl-opacity-0 sl-animate-[fadeInUp_0.4s_ease-out_forwards]"
+      ]),
+      style: O(d.value)
+    }, [
+      l.value ? (i(), m("div", Pa, [
+        M(u.$slots, "header", {}, () => [
+          e.icon ? (i(), D(ge(e.icon), {
+            key: 0,
+            class: "sl-h-5 sl-w-5 sl-text-primary-600 dark:sl-text-primary-400",
+            "aria-hidden": "true"
+          })) : k("", !0),
+          e.title ? (i(), m("h3", Ea, w(e.title), 1)) : k("", !0)
+        ], !0)
+      ])) : k("", !0),
+      s("div", {
+        class: E([e.noPadding ? "" : "sl-p-5"])
+      }, [
+        M(u.$slots, "default", {}, void 0, !0)
+      ], 2)
+    ], 6));
+  }
+}), le = /* @__PURE__ */ Z(Aa, [["__scopeId", "data-v-1b6c2c74"]]), Da = { class: "sl-space-y-4" }, Fa = {
+  key: 0,
+  class: "sl-flex sl-items-start sl-gap-3"
+}, Na = ["href"], Ua = {
+  key: 1,
+  class: "sl-flex sl-items-start sl-gap-3"
+}, Va = ["href"], Ba = {
+  key: 2,
+  class: "sl-flex sl-items-start sl-gap-3"
+}, ja = ["href"], Oa = /* @__PURE__ */ F({
+  __name: "ProfileContactCard",
+  props: {
+    email: {},
+    phone: {},
+    website: {},
+    animationIndex: { default: 1 },
+    animationEnabled: { type: Boolean, default: !0 }
+  },
+  setup(e) {
+    const t = e, a = b(() => {
+      if (!t.phone) return "";
+      const u = t.phone.replace(/\D/g, "");
+      return u.length === 10 ? `(${u.slice(0, 3)}) ${u.slice(3, 6)}-${u.slice(6)}` : u.length === 11 && u.startsWith("1") ? `+1 (${u.slice(1, 4)}) ${u.slice(4, 7)}-${u.slice(7)}` : t.phone;
+    }), l = b(() => t.website ? t.website.startsWith("http://") || t.website.startsWith("https://") ? t.website : `https://${t.website}` : ""), d = b(() => t.website ? t.website.replace(/^https?:\/\//, "").replace(/\/$/, "") : "");
+    return (u, n) => (i(), D(le, {
+      title: "Contact",
+      icon: _(_e),
+      "animation-index": e.animationIndex,
+      "animation-enabled": e.animationEnabled
+    }, {
+      default: T(() => [
+        s("div", Da, [
+          e.email ? (i(), m("div", Fa, [
+            C(_(pt), { class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-gray-500 sl-flex-shrink-0 sl-mt-0.5" }),
+            s("div", null, [
+              n[0] || (n[0] = s("p", { class: "sl-text-xs sl-font-medium sl-uppercase sl-text-gray-500 dark:sl-text-gray-400" }, "Email", -1)),
+              s("a", {
+                href: `mailto:${e.email}`,
+                class: "sl-text-sm sl-text-gray-900 dark:sl-text-gray-100 hover:sl-text-primary-600 dark:hover:sl-text-primary-400"
+              }, w(e.email), 9, Na)
+            ])
+          ])) : k("", !0),
+          e.phone ? (i(), m("div", Ua, [
+            C(_(_e), { class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-gray-500 sl-flex-shrink-0 sl-mt-0.5" }),
+            s("div", null, [
+              n[1] || (n[1] = s("p", { class: "sl-text-xs sl-font-medium sl-uppercase sl-text-gray-500 dark:sl-text-gray-400" }, "Phone", -1)),
+              s("a", {
+                href: `tel:${e.phone}`,
+                class: "sl-text-sm sl-text-primary-600 dark:sl-text-primary-400 hover:sl-underline"
+              }, w(a.value), 9, Va)
+            ])
+          ])) : k("", !0),
+          e.website ? (i(), m("div", Ba, [
+            C(_(gt), { class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-gray-500 sl-flex-shrink-0 sl-mt-0.5" }),
+            s("div", null, [
+              n[2] || (n[2] = s("p", { class: "sl-text-xs sl-font-medium sl-uppercase sl-text-gray-500 dark:sl-text-gray-400" }, "Website", -1)),
+              s("a", {
+                href: l.value,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                class: "sl-text-sm sl-text-primary-600 dark:sl-text-primary-400 hover:sl-underline"
+              }, w(d.value), 9, ja)
+            ])
+          ])) : k("", !0)
+        ])
+      ]),
+      _: 1
+    }, 8, ["icon", "animation-index", "animation-enabled"]));
+  }
+}), Ra = { class: "sl-flex sl-items-center sl-gap-3" }, Ha = { class: "sl-text-sm sl-text-gray-900 dark:sl-text-gray-100" }, Ga = /* @__PURE__ */ F({
+  __name: "ProfilePersonalCard",
+  props: {
+    birthday: {},
+    animationIndex: { default: 2 },
+    animationEnabled: { type: Boolean, default: !0 }
+  },
+  setup(e) {
+    const t = e, a = b(() => {
+      if (!t.birthday) return "Not specified";
+      let l;
+      return typeof t.birthday == "string" ? l = re(t.birthday) : l = t.birthday, J(l) ? q(l, "MMMM d, yyyy") : "Not specified";
+    });
+    return (l, d) => (i(), D(le, {
+      title: "Personal",
+      icon: _(De),
+      "animation-index": e.animationIndex,
+      "animation-enabled": e.animationEnabled
+    }, {
+      default: T(() => [
+        s("div", Ra, [
+          C(_(yt), { class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-gray-500" }),
+          s("div", null, [
+            d[0] || (d[0] = s("p", { class: "sl-text-xs sl-font-medium sl-uppercase sl-text-gray-500 dark:sl-text-gray-400" }, "Birthday", -1)),
+            s("p", Ha, w(a.value), 1)
+          ])
+        ])
+      ]),
+      _: 1
+    }, 8, ["icon", "animation-index", "animation-enabled"]));
+  }
+}), Ka = { class: "sl-space-y-4" }, Wa = {
+  key: 0,
+  class: "sl-flex sl-items-start sl-gap-3"
+}, Ya = {
+  key: 0,
+  class: "sl-text-sm sl-font-medium sl-text-gray-900 dark:sl-text-gray-100"
+}, Xa = {
+  key: 1,
+  class: "sl-text-sm sl-text-gray-600 dark:sl-text-gray-400"
+}, qa = {
+  key: 1,
+  class: "sl-flex sl-items-center sl-gap-3"
+}, Ja = ["href"], Za = /* @__PURE__ */ F({
+  __name: "ProfileProfessionalCard",
+  props: {
+    professional: {},
+    animationIndex: { default: 3 },
+    animationEnabled: { type: Boolean, default: !0 }
+  },
+  setup(e) {
+    const t = () => ne("svg", {
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      class: "sl-w-5 sl-h-5"
+    }, [
+      ne("path", {
+        d: "M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"
+      })
+    ]), a = e, l = b(() => a.professional?.title || a.professional?.company), d = b(() => {
+      if (!a.professional?.linkedin) return "";
+      const u = a.professional.linkedin;
+      return u.startsWith("http") ? u : u.startsWith("linkedin.com") ? `https://${u}` : `https://linkedin.com/in/${u}`;
+    });
+    return (u, n) => (i(), D(le, {
+      title: "Professional",
+      icon: _(ht),
+      "animation-index": e.animationIndex,
+      "animation-enabled": e.animationEnabled
+    }, {
+      default: T(() => [
+        s("div", Ka, [
+          l.value ? (i(), m("div", Wa, [
+            C(_(xt), { class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-gray-500 sl-flex-shrink-0 sl-mt-0.5" }),
+            s("div", null, [
+              e.professional?.title ? (i(), m("p", Ya, w(e.professional.title), 1)) : k("", !0),
+              e.professional?.company ? (i(), m("p", Xa, w(e.professional.company), 1)) : k("", !0)
+            ])
+          ])) : k("", !0),
+          e.professional?.linkedin ? (i(), m("div", qa, [
+            C(t, { class: "sl-h-5 sl-w-5 sl-text-[#0A66C2]" }),
+            s("div", null, [
+              n[0] || (n[0] = s("p", { class: "sl-text-xs sl-font-medium sl-uppercase sl-text-gray-500 dark:sl-text-gray-400" }, "LinkedIn", -1)),
+              s("a", {
+                href: d.value,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                class: "sl-text-sm sl-text-primary-600 dark:sl-text-primary-400 hover:sl-underline"
+              }, " View Profile ", 8, Ja)
+            ])
+          ])) : k("", !0)
+        ])
+      ]),
+      _: 1
+    }, 8, ["icon", "animation-index", "animation-enabled"]));
+  }
+}), Qa = { class: "sl-p-5" }, eo = { class: "sl-text-sm sl-text-gray-700 dark:sl-text-gray-300" }, to = {
+  key: 0,
+  class: "sl-h-40 sl-w-full sl-bg-gray-100 dark:sl-bg-gray-700 sl-relative"
+}, so = ["src"], lo = {
+  key: 1,
+  class: "sl-w-full sl-h-full sl-flex sl-items-center sl-justify-center"
+}, ao = /* @__PURE__ */ F({
+  __name: "ProfileLocationCard",
+  props: {
+    address: {},
+    latLng: {},
+    showMap: { type: Boolean, default: !0 },
+    animationIndex: { default: 1 },
+    animationEnabled: { type: Boolean, default: !0 }
+  },
+  setup(e) {
+    const t = e, a = Le("googleMaps", {}), l = K(!1), d = b(() => t.address ? Array.isArray(t.address) ? t.address[0] || null : t.address : null), u = b(() => {
+      const v = d.value;
+      if (!v) return "No address specified";
+      if (v.description) return v.description;
+      if (v.name) return v.name;
+      const z = [];
+      v.street && z.push(v.street), v.suite && z.push(v.suite);
+      const h = [];
+      return v.city && h.push(v.city), v.state && h.push(v.state), v.zip && h.push(v.zip), h.length > 0 && z.push(h.join(", ")), v.country && z.push(v.country), z.length > 0 ? z.join(", ") : "No address specified";
+    }), n = b(() => {
+      if (t.latLng?.lat && t.latLng?.lng)
+        return t.latLng;
+      const v = d.value;
+      return v?.geocode?.location?.lat && v?.geocode?.location?.lng ? v.geocode.location : null;
+    }), o = b(() => !!n.value), g = b(() => {
+      if (l.value || !n.value) return null;
+      const v = a?.staticMapsApiKey || a?.apiKey;
+      if (!v) return null;
+      const { lat: z, lng: h } = n.value;
+      return `https://maps.googleapis.com/maps/api/staticmap?center=${z},${h}&zoom=14&size=400x200&maptype=roadmap&markers=color:blue%7C${z},${h}&key=${v}`;
+    }), y = () => {
+      l.value = !0;
+    };
+    return (v, z) => (i(), D(le, {
+      title: "Location",
+      icon: _(Ie),
+      "animation-index": e.animationIndex,
+      "animation-enabled": e.animationEnabled,
+      "no-padding": !0
+    }, {
+      default: T(() => [
+        s("div", Qa, [
+          s("div", eo, w(u.value), 1)
+        ]),
+        e.showMap && o.value ? (i(), m("div", to, [
+          g.value ? (i(), m("img", {
+            key: 0,
+            src: g.value,
+            alt: "Location map",
+            class: "sl-w-full sl-h-full sl-object-cover",
+            onError: y
+          }, null, 40, so)) : (i(), m("div", lo, [
+            C(_(Ie), { class: "sl-w-8 sl-h-8 sl-text-gray-400 dark:sl-text-gray-500" })
+          ])),
+          z[0] || (z[0] = s("div", { class: "sl-absolute sl-bottom-1 sl-right-1 sl-text-[10px] sl-text-gray-500 sl-bg-white/80 sl-px-1 sl-rounded" }, " Map Data ", -1))
+        ])) : k("", !0)
+      ]),
+      _: 1
+    }, 8, ["icon", "animation-index", "animation-enabled"]));
+  }
+}), oo = { class: "sl-space-y-4" }, ro = { class: "sl-relative sl-flex sl-flex-col sl-items-center" }, no = {
+  key: 0,
+  class: "sl-w-0.5 sl-flex-1 sl-bg-gray-200 dark:sl-bg-gray-700 sl-min-h-[2rem]"
+}, io = { class: "sl-flex-1 sl-pb-4" }, co = { class: "sl-text-sm sl-font-medium sl-text-gray-900 dark:sl-text-gray-100" }, uo = {
+  key: 0,
+  class: "sl-text-sm sl-text-gray-600 dark:sl-text-gray-400"
+}, mo = { class: "sl-mt-1 sl-text-xs sl-text-gray-500 dark:sl-text-gray-500" }, fo = /* @__PURE__ */ F({
+  __name: "ProfileOrganizationsCard",
+  props: {
+    organizations: {},
+    animationIndex: { default: 5 },
+    animationEnabled: { type: Boolean, default: !0 }
+  },
+  setup(e) {
+    const t = e, a = b(() => t.organizations || []), l = (o) => o.organization ? typeof o.organization == "string" ? o.organization : o.organization.name || "Unknown Organization" : "Unknown Organization", d = (o) => {
+      if (!o.position) return "";
+      const g = typeof o.position == "string" ? o.position : o.position.name, y = [];
+      return o.position_prefix && y.push(o.position_prefix), g && y.push(g), o.position_suffix && y.push(o.position_suffix), y.join(" ");
+    }, u = (o) => {
+      if (!o) return null;
+      if (o instanceof Date) return J(o) ? o : null;
+      const g = re(o);
+      return J(g) ? g : null;
+    }, n = (o, g) => {
+      const y = u(o), v = u(g), z = [];
+      if (y && z.push(q(y, "MMM yyyy")), z.push("–"), v ? z.push(q(v, "MMM yyyy")) : z.push("Present"), y) {
+        const h = v || /* @__PURE__ */ new Date(), r = ce(h, y), c = Ae(h, y) % 12, p = [];
+        r > 0 && p.push(`${r} yr${r > 1 ? "s" : ""}`), (c > 0 || r === 0) && p.push(`${c || 1} mo${c > 1 ? "s" : ""}`), p.length > 0 && z.push("•", p.join(" "));
+      }
+      return z.join(" ");
+    };
+    return (o, g) => (i(), D(le, {
+      title: "Organizations",
+      icon: _(bt),
+      "animation-index": e.animationIndex,
+      "animation-enabled": e.animationEnabled
+    }, {
+      default: T(() => [
+        s("div", oo, [
+          (i(!0), m(G, null, Y(a.value, (y, v) => (i(), m("div", {
+            key: y.id || v,
+            class: "sl-flex sl-items-start sl-gap-3"
+          }, [
+            s("div", ro, [
+              g[0] || (g[0] = s("div", { class: "sl-w-3 sl-h-3 sl-rounded-full sl-bg-primary-600 dark:sl-bg-primary-400 sl-ring-4 sl-ring-white dark:sl-ring-gray-800" }, null, -1)),
+              v < a.value.length - 1 ? (i(), m("div", no)) : k("", !0)
+            ]),
+            s("div", io, [
+              s("p", co, w(l(y)), 1),
+              d(y) ? (i(), m("p", uo, w(d(y)), 1)) : k("", !0),
+              s("p", mo, w(n(y.start_date, y.end_date)), 1)
+            ])
+          ]))), 128))
+        ])
+      ]),
+      _: 1
+    }, 8, ["icon", "animation-index", "animation-enabled"]));
+  }
+}), po = { class: "sl-grid sl-grid-cols-2 sl-gap-4" }, go = { class: "sl-w-10 sl-h-10 sl-rounded-full sl-flex sl-items-center sl-justify-center sl-bg-primary-100 dark:sl-bg-primary-900/50 sl-text-primary-600 dark:sl-text-primary-400 sl-text-sm sl-font-semibold sl-flex-shrink-0" }, yo = { class: "sl-min-w-0 sl-flex-1" }, ho = { class: "sl-text-sm sl-font-medium sl-text-gray-900 dark:sl-text-gray-100 sl-truncate" }, xo = { class: "sl-text-xs sl-text-gray-500 dark:sl-text-gray-400 sl-truncate" }, bo = {
+  key: 0,
+  class: "sl-text-xs sl-text-gray-400 dark:sl-text-gray-500 sl-flex sl-items-center sl-gap-1"
+}, vo = /* @__PURE__ */ F({
+  __name: "ProfileRelatedNamesCard",
+  props: {
+    relatedNames: {},
+    animationIndex: { default: 6 },
+    animationEnabled: { type: Boolean, default: !0 }
+  },
+  setup(e) {
+    const t = e, a = b(() => t.relatedNames || []), l = (o) => {
+      if (o.name) return o.name;
+      const g = [];
+      return o.first_name && g.push(o.first_name), o.last_name && g.push(o.last_name), g.join(" ") || "Unknown";
+    }, d = (o) => {
+      const g = l(o), y = g.split(" ").filter(Boolean);
+      return y.length >= 2 ? `${y[0][0]}${y[y.length - 1][0]}`.toUpperCase() : g.substring(0, 2).toUpperCase();
+    }, u = (o) => o.label ? typeof o.label == "string" ? o.label : o.label.name || "" : o.relationship || "", n = (o) => {
+      if (!o.birthday) return "";
+      let g;
+      if (typeof o.birthday == "string" ? g = re(o.birthday) : g = o.birthday, !J(g)) return "";
+      const y = ce(/* @__PURE__ */ new Date(), g);
+      return y === 0 ? `${q(g, "MMM d, yyyy")}` : y >= 1 && y < 2 ? "over 1 year old" : `${y > 0 ? "over " : "almost "}${Math.abs(y)} years old`;
+    };
+    return (o, g) => (i(), D(le, {
+      title: "Related Names",
+      icon: _(vt),
+      "animation-index": e.animationIndex,
+      "animation-enabled": e.animationEnabled
+    }, {
+      default: T(() => [
+        s("div", po, [
+          (i(!0), m(G, null, Y(a.value, (y, v) => (i(), m("div", {
+            key: y.id || v,
+            class: "sl-flex sl-items-center sl-gap-3 sl-p-3 sl-rounded-lg sl-bg-gray-50 dark:sl-bg-gray-700/50"
+          }, [
+            s("div", go, w(d(y)), 1),
+            s("div", yo, [
+              s("p", ho, w(l(y)), 1),
+              s("p", xo, w(u(y)), 1),
+              n(y) ? (i(), m("p", bo, [
+                C(_(De), { class: "sl-w-3 sl-h-3" }),
+                j(" " + w(n(y)), 1)
+              ])) : k("", !0)
+            ])
+          ]))), 128))
+        ])
+      ]),
+      _: 1
+    }, 8, ["icon", "animation-index", "animation-enabled"]));
+  }
+}), ko = { class: "sl-bento-profile-layout sl-min-h-screen sl-relative" }, wo = { class: "sl-relative sl-max-w-4xl sl-mx-auto sl-px-4 sl-py-8 sl-space-y-6" }, Co = {
+  key: 0,
+  class: "sl-space-y-6"
+}, $o = { class: "sl-space-y-6" }, _o = /* @__PURE__ */ F({
+  __name: "BentoProfileLayout",
+  props: {
+    profile: {},
+    config: { default: () => ({
+      showContact: !0,
+      showLocation: !0,
+      showProfessional: !0,
+      showPersonal: !0,
+      showOrganizations: !0,
+      showRelatedNames: !0,
+      showSocial: !0,
+      animationEnabled: !0,
+      animationDelay: 75
+    }) }
+  },
+  setup(e) {
+    const t = e, a = b(() => t.config?.showContact !== !1), l = b(() => t.config?.showLocation !== !1), d = b(() => t.config?.showProfessional !== !1), u = b(() => t.config?.showPersonal !== !1), n = b(() => t.config?.showOrganizations !== !1), o = b(() => t.config?.showRelatedNames !== !1), g = b(() => t.config?.animationEnabled !== !1), y = b(() => {
+      if (t.profile.name) return t.profile.name;
+      const P = [];
+      return t.profile.first_name && P.push(t.profile.first_name), t.profile.last_name && P.push(t.profile.last_name), P.join(" ") || "Unknown User";
+    }), v = b(() => t.profile.profile_image || t.profile.image || null), z = b(() => t.profile.email || t.profile.phone || t.profile.website), h = b(() => {
+      const P = t.profile.professional;
+      return P ? P.title || P.company || P.linkedin : !1;
+    }), r = b(() => {
+      const P = t.profile.address;
+      return P ? Array.isArray(P) ? P.length > 0 : !0 : !1;
+    }), c = b(() => !!p.value), p = b(() => {
+      if (t.profile.latLng?.lat && t.profile.latLng?.lng)
+        return t.profile.latLng;
+      if (t.profile._geoloc?.lat && t.profile._geoloc?.lng)
+        return t.profile._geoloc;
+      const P = t.profile.address;
+      if (P) {
+        const B = Array.isArray(P) ? P[0] : P;
+        if (B?.geocode?.location?.lat && B?.geocode?.location?.lng)
+          return B.geocode.location;
+      }
+      return null;
+    }), $ = b(() => l.value && (r.value || c.value)), f = b(() => t.profile.organizations || []), x = b(() => t.profile.relatedNames || t.profile.related_names || []);
+    return (P, B) => (i(), m("div", ko, [
+      B[0] || (B[0] = s("div", { class: "sl-absolute sl-inset-0 sl-bg-gray-50 dark:sl-bg-gray-900 sl--z-10" }, null, -1)),
+      s("div", wo, [
+        C(Ma, {
+          name: y.value,
+          nickname: e.profile.nickname,
+          image: v.value,
+          status: e.profile.status,
+          "animation-index": 0,
+          "animation-enabled": g.value
+        }, null, 8, ["name", "nickname", "image", "status", "animation-enabled"]),
+        s("div", {
+          class: E([
+            "sl-grid sl-gap-6",
+            $.value ? "sl-grid-cols-1 md:sl-grid-cols-2" : "sl-grid-cols-1"
+          ])
+        }, [
+          s("div", {
+            class: E([
+              "sl-space-y-6",
+              $.value ? "" : "sl-grid sl-grid-cols-1 md:sl-grid-cols-2 sl-gap-6"
+            ])
+          }, [
+            a.value && z.value ? (i(), D(Oa, {
+              key: 0,
+              email: e.profile.email,
+              phone: e.profile.phone,
+              website: e.profile.website,
+              "animation-index": 1,
+              "animation-enabled": g.value
+            }, null, 8, ["email", "phone", "website", "animation-enabled"])) : k("", !0),
+            u.value && e.profile.birthday ? (i(), D(Ga, {
+              key: 1,
+              birthday: e.profile.birthday,
+              "animation-index": 2,
+              "animation-enabled": g.value
+            }, null, 8, ["birthday", "animation-enabled"])) : k("", !0),
+            d.value && h.value ? (i(), D(Za, {
+              key: 2,
+              professional: e.profile.professional,
+              "animation-index": 3,
+              "animation-enabled": g.value
+            }, null, 8, ["professional", "animation-enabled"])) : k("", !0)
+          ], 2),
+          $.value ? (i(), m("div", Co, [
+            l.value && (r.value || c.value) ? (i(), D(ao, {
+              key: 0,
+              address: e.profile.address,
+              "lat-lng": p.value,
+              "animation-index": 1,
+              "animation-enabled": g.value
+            }, null, 8, ["address", "lat-lng", "animation-enabled"])) : k("", !0)
+          ])) : k("", !0)
+        ], 2),
+        s("div", $o, [
+          n.value && f.value.length > 0 ? (i(), D(fo, {
+            key: 0,
+            organizations: f.value,
+            "animation-index": 5,
+            "animation-enabled": g.value
+          }, null, 8, ["organizations", "animation-enabled"])) : k("", !0),
+          o.value && x.value.length > 0 ? (i(), D(vo, {
+            key: 1,
+            "related-names": x.value,
+            "animation-index": 6,
+            "animation-enabled": g.value
+          }, null, 8, ["related-names", "animation-enabled"])) : k("", !0)
+        ])
+      ])
+    ]));
+  }
+}), hr = /* @__PURE__ */ Z(_o, [["__scopeId", "data-v-6dd771fc"]]);
+class Io {
   designTokens;
   prefix = "sl-";
   injectCSS = !0;
@@ -1406,13 +3250,13 @@ class Zs {
   phoneInputConfig;
   datepickerConfig;
   constructor() {
-    this.designTokens = Z;
+    this.designTokens = Ne;
   }
-  install(e, o = {}) {
-    Object.keys(o).length > 0 && this.configure(o), this.injectCSS && this.injectCSSVariables(), e.config.globalProperties.$stachelockUI = this, e.provide("stachelockUI", this), this.cloudinaryConfig && e.provide("cloudinary", this.cloudinaryConfig), this.googleMapsConfig && e.provide("googleMaps", this.googleMapsConfig), this.lottieConfig && e.provide("lottie", this.lottieConfig), this.richTextConfig && e.provide("richText", this.richTextConfig), this.phoneInputConfig && e.provide("phoneInput", this.phoneInputConfig), this.datepickerConfig && e.provide("datepicker", this.datepickerConfig);
+  install(t, a = {}) {
+    Object.keys(a).length > 0 && this.configure(a), this.injectCSS && this.injectCSSVariables(), t.config.globalProperties.$stachelockUI = this, t.provide("stachelockUI", this), this.cloudinaryConfig && t.provide("cloudinary", this.cloudinaryConfig), this.googleMapsConfig && t.provide("googleMaps", this.googleMapsConfig), this.lottieConfig && t.provide("lottie", this.lottieConfig), this.richTextConfig && t.provide("richText", this.richTextConfig), this.phoneInputConfig && t.provide("phoneInput", this.phoneInputConfig), this.datepickerConfig && t.provide("datepicker", this.datepickerConfig);
   }
-  configure(e) {
-    e.designTokens && (this.designTokens = ge(e.designTokens, this.designTokens)), e.prefix !== void 0 && (this.prefix = e.prefix), e.injectCSS !== void 0 && (this.injectCSS = e.injectCSS), e.cloudinary && (this.cloudinaryConfig = e.cloudinary), e.googleMaps && (this.googleMapsConfig = e.googleMaps), e.lottie && (this.lottieConfig = e.lottie), e.richText && (this.richTextConfig = e.richText), e.phoneInput && (this.phoneInputConfig = e.phoneInput), e.datepicker && (this.datepickerConfig = e.datepicker);
+  configure(t) {
+    t.designTokens && (this.designTokens = Ot(t.designTokens, this.designTokens)), t.prefix !== void 0 && (this.prefix = t.prefix), t.injectCSS !== void 0 && (this.injectCSS = t.injectCSS), t.cloudinary && (this.cloudinaryConfig = t.cloudinary), t.googleMaps && (this.googleMapsConfig = t.googleMaps), t.lottie && (this.lottieConfig = t.lottie), t.richText && (this.richTextConfig = t.richText), t.phoneInput && (this.phoneInputConfig = t.phoneInput), t.datepicker && (this.datepickerConfig = t.datepicker);
   }
   getDesignTokens() {
     return this.designTokens;
@@ -1436,161 +3280,179 @@ class Zs {
     return this.datepickerConfig;
   }
   generateCSS() {
-    return xe(this.designTokens);
+    return Rt(this.designTokens);
   }
   injectCSSVariables() {
-    const e = document.createElement("style");
-    e.textContent = this.generateCSS(), e.setAttribute("data-stachelock-ui", "true");
-    const o = document.querySelector('style[data-stachelock-ui="true"]');
-    o && o.remove(), document.head.appendChild(e);
+    const t = document.createElement("style");
+    t.textContent = this.generateCSS(), t.setAttribute("data-stachelock-ui", "true");
+    const a = document.querySelector('style[data-stachelock-ui="true"]');
+    a && a.remove(), document.head.appendChild(t);
   }
 }
-const _t = new Zs();
+const xr = new Io();
 export {
-  ao as AddDeleteButtonGroup,
-  Oo as AlertModal,
-  te as Avatar,
-  ra as BackgroundGradientWrapper,
-  F as Badge,
-  xa as Banner,
-  Pl as BarChart,
-  Sa as BaseChart,
-  Ho as BaseModal,
-  ya as Breadcrumb,
-  A as Button,
-  ul as ButtonGroup,
-  ka as CalendarDashboard,
-  Tl as CalendarHeader,
-  bt as CardLayout,
-  ia as CardWrapper,
-  ml as Checkbox,
-  oe as CheckboxInput,
-  pa as CloudinaryImage,
-  ae as ComboboxInput,
-  Kl as ComingSoon,
-  pe as ComponentRegistry,
-  Za as ContentSkeleton,
-  $o as DashboardLayout,
-  no as DatepickerInput,
-  Ml as DayCalendar,
-  So as DefaultLayout,
-  ca as DisclosureWrapper,
-  so as DynamicForm,
-  co as EmailInput,
-  fo as EmptyInput,
-  Xl as EmptyState,
-  jl as EventCard,
-  Bl as EventsList,
-  po as FileDropzoneInput,
-  fa as FormErrorWrapper,
-  lo as FormField,
-  Ha as FormFieldWrapper,
-  Ul as FunnelChart,
-  er as GoogleMap,
-  Io as HeaderLayout,
-  xo as HiddenInput,
-  ir as ImageCropperModal,
-  vt as InfoCard,
-  tr as InfoWindow,
-  Qo as InlineTabs,
-  yt as InputsShowcase,
-  Rl as LineChart,
-  le as Loading,
-  va as LoadingDots,
-  dl as LottieAnimation,
-  or as Map,
-  No as MapAll,
-  rr as MapMarker,
-  gl as Menu,
-  hl as Modal,
-  El as MonthCalendar,
-  bl as NavLink,
-  Vo as NavigationGroup,
-  Ao as NavigationItem,
-  Wo as NotificationContainer,
-  Jo as NotificationToast,
-  Wa as PhoneInput,
-  Gl as PieChart,
-  Lo as ProfileHeaderAvatar,
-  Cl as ProgressBar,
-  Fo as ProjectLogo,
-  Ct as PropsTable,
-  ht as RadialProgressBar,
-  Ja as RichTextInput,
-  O as SelectInput,
-  yo as SelectTextInput,
-  kt as ShowcaseCard,
-  wt as ShowcaseLayout,
-  zo as SidebarLayout,
-  Qa as SmartLoadingIndicator,
-  Yl as SparklineChart,
-  _t as StachelockUI,
-  ql as StatCard,
-  $t as StateDisplay,
-  Zo as StepperPanels,
-  ne as SwitchInput,
-  vo as SwitchInputGroup,
-  ea as TabGroup,
-  ta as TabGroupUnderline,
-  wl as Table,
-  oa as TabsInPills,
-  ko as TagifyInput,
-  re as TextAreaInput,
-  V as TextInput,
-  xt as ThemeDebugModal,
-  _l as Transition,
-  Pt as US_CENTER,
-  Nt as WORLD_CENTER,
-  $a as WeekCalendar,
-  Dl as YearCalendar,
-  Ia as areaChartConfig,
-  Ma as barChartConfig,
-  Va as baseTheme,
-  Lt as calculateEventLanes,
-  ja as chartColors,
-  Aa as chartTypography,
-  q as componentRegistry,
-  _t as default,
-  me as defaultComponentMap,
-  Ut as defaultCoordinateExtractor,
-  Z as defaultDesignTokens,
-  Ba as formatDuration,
-  La as formatNumber,
-  Ea as formatPercentage,
-  Qt as formatUid,
-  Fa as funnelChartConfig,
-  xe as generateCSSVariables,
-  It as generateDeterministicId,
-  Mt as generateId,
-  gt as generateTailwindConfig,
-  Da as getAreaGradient,
-  pt as getComponent,
-  qt as getTabBadgeClasses,
-  za as hexToRgb,
-  Xt as isUidLike,
-  Ot as isValidCoordinate,
-  Pa as lineChartConfig,
-  ge as mergeDesignTokens,
-  Na as pieChartConfig,
-  se as presetThemes,
-  mt as registerComponent,
-  Vt as sanitizeId,
-  el as slugToReadable,
-  Ua as stachelockColors,
-  Oa as toRgba,
-  sl as toSentenceCase,
-  tl as toTitleCase,
-  ll as transformString,
-  ol as truncateString,
-  At as useCalendar,
-  Et as useEventSegments,
-  Dt as useFormValidation,
-  Rt as useMap,
-  Gt as useModal,
-  Yt as useNotifications,
-  Zt as useSimpleTabs,
-  al as useStringTransform,
-  nl as useTabs,
-  Y as useTheme
+  lt as AddDeleteButtonGroup,
+  dr as AddressInput,
+  ot as AlertModal,
+  tt as Avatar,
+  Yi as BackgroundGradientWrapper,
+  ue as Badge,
+  ad as Banner,
+  An as BarChart,
+  pd as BaseChart,
+  Pi as BaseModal,
+  hr as BentoProfileLayout,
+  rd as Breadcrumb,
+  oe as Button,
+  on as ButtonGroup,
+  cd as CalendarDashboard,
+  wn as CalendarHeader,
+  ur as CardLayout,
+  qi as CardWrapper,
+  nn as Checkbox,
+  rt as CheckboxInput,
+  sd as CloudinaryImage,
+  he as CollectionEditor,
+  Ms as CollectionItemList,
+  Ir as CollectionItemStatus,
+  nt as ComboboxInput,
+  Kn as ComingSoon,
+  jt as ComponentRegistry,
+  Fd as ContentSkeleton,
+  pi as DashboardLayout,
+  Zn as DatepickerInput,
+  $n as DayCalendar,
+  yi as DefaultLayout,
+  Zi as DisclosureWrapper,
+  at as DynamicForm,
+  ei as EmailInput,
+  si as EmptyInput,
+  Yn as EmptyState,
+  In as EventCard,
+  zn as EventsList,
+  ai as FileDropzoneInput,
+  ed as FormErrorWrapper,
+  qn as FormField,
+  Tt as FormFieldWrapper,
+  Fn as FunnelChart,
+  Vt as GeocodeStatus,
+  Bd as GoogleMap,
+  xi as HeaderLayout,
+  ri as HiddenInput,
+  Yd as ImageCropperModal,
+  mr as InfoCard,
+  Od as InfoWindow,
+  Bi as InlineTabs,
+  cr as InputsShowcase,
+  Un as LineChart,
+  st as Loading,
+  id as LoadingDots,
+  ln as LottieAnimation,
+  Hd as Map,
+  Li as MapAll,
+  Kd as MapMarker,
+  cn as Menu,
+  mn as Modal,
+  Ln as MonthCalendar,
+  pn as NavLink,
+  vi as NavigationGroup,
+  wi as NavigationItem,
+  Ai as NotificationContainer,
+  Fi as NotificationToast,
+  rr as OrganizationsEditor,
+  Pd as PhoneInput,
+  Bn as PieChart,
+  le as ProfileCard,
+  Oa as ProfileContactCard,
+  $i as ProfileHeaderAvatar,
+  Ma as ProfileHeaderCard,
+  ao as ProfileLocationCard,
+  fo as ProfileOrganizationsCard,
+  Ga as ProfilePersonalCard,
+  Za as ProfileProfessionalCard,
+  vo as ProfileRelatedNamesCard,
+  yn as ProgressBar,
+  Ii as ProjectLogo,
+  fr as PropsTable,
+  or as RadialProgressBar,
+  nr as RelatedNamesEditor,
+  Ad as RichTextInput,
+  Ce as SelectInput,
+  ii as SelectTextInput,
+  pr as ShowcaseCard,
+  gr as ShowcaseLayout,
+  zi as SidebarLayout,
+  Ud as SmartLoadingIndicator,
+  ir as SocialLinksEditor,
+  On as SparklineChart,
+  xr as StachelockUI,
+  Hn as StatCard,
+  yr as StateDisplay,
+  Ui as StepperPanels,
+  dt as SwitchInput,
+  ci as SwitchInputGroup,
+  Oi as TabGroup,
+  Hi as TabGroupUnderline,
+  xn as Table,
+  Ki as TabsInPills,
+  mi as TagifyInput,
+  it as TextAreaInput,
+  R as TextInput,
+  ar as ThemeDebugModal,
+  vn as Transition,
+  Er as US_CENTER,
+  Ar as WORLD_CENTER,
+  md as WeekCalendar,
+  Pn as YearCalendar,
+  yd as areaChartConfig,
+  hd as barChartConfig,
+  xd as baseTheme,
+  zr as calculateEventLanes,
+  bd as chartColors,
+  vd as chartTypography,
+  Fe as componentRegistry,
+  xr as default,
+  Bt as defaultComponentMap,
+  Dr as defaultCoordinateExtractor,
+  Ne as defaultDesignTokens,
+  kd as formatDuration,
+  wd as formatNumber,
+  Cd as formatPercentage,
+  Kr as formatUid,
+  $d as funnelChartConfig,
+  Rt as generateCSSVariables,
+  kr as generateDeterministicId,
+  Xe as generateId,
+  lr as generateTailwindConfig,
+  _d as getAreaGradient,
+  sr as getComponent,
+  Rr as getTabBadgeClasses,
+  Id as hexToRgb,
+  er as isFundamentalField,
+  Wr as isUidLike,
+  Fr as isValidCoordinate,
+  Sd as lineChartConfig,
+  Ot as mergeDesignTokens,
+  zd as pieChartConfig,
+  et as presetThemes,
+  tr as registerComponent,
+  wr as sanitizeId,
+  Yr as slugToReadable,
+  Td as stachelockColors,
+  Ld as toRgba,
+  Xr as toSentenceCase,
+  qr as toTitleCase,
+  Jr as transformString,
+  Zr as truncateString,
+  $r as useCalendar,
+  Qe as useCollectionEditor,
+  Tr as useEventSegments,
+  Mr as useFormValidation,
+  Nr as useMap,
+  Vr as useModal,
+  jr as useNotifications,
+  Hr as useSimpleTabs,
+  Qr as useStringTransform,
+  tn as useTabs,
+  Ee as useTheme
 };
-//# sourceMappingURL=index.js.map