@oneclick.dev/cms-core-modules 0.0.83 → 0.0.85

package/dist/{agenda-Cl3s_FIE.mjs → agenda-C5grvzSa.mjs}

@@ -1,12 +1,12 @@
-import { defineComponent as K, resolveComponent as N, openBlock as o, createElementBlock as u, createElementVNode as e, Fragment as X, renderList as Y, toDisplayString as v, normalizeStyle as q, normalizeClass as R, createVNode as d, withCtx as S, unref as b, createTextVNode as ne, createCommentVNode as M, ref as $, createBlock as Q, provide as Z, computed as U, onMounted as pe, onUnmounted as fe, inject as ie, nextTick as xe, onBeforeUnmount as ze, watch as re } from "vue";
-import { o as ue, g as de } from "./DateFormatter-CvOfaUnU.mjs";
+import { defineComponent as K, resolveComponent as P, openBlock as o, createElementBlock as u, createElementVNode as e, Fragment as X, renderList as Y, toDisplayString as v, normalizeStyle as q, normalizeClass as R, createVNode as d, withCtx as $, unref as b, createTextVNode as ne, createCommentVNode as M, ref as S, createBlock as Q, provide as Z, computed as U, onMounted as pe, onUnmounted as fe, inject as ie, nextTick as xe, onBeforeUnmount as ze, watch as le } from "vue";
+import { c as ue, b as de } from "./DateFormatter-2B0R-DY4.mjs";
 import { X as we, Search as Ee, Clock as ge, Users as he, ChevronLeft as ve, ChevronRight as ce, Asterisk as Ie, CalendarDays as Be } from "lucide-vue-next";
 import { _ as Le } from "./EditLayout.vue_vue_type_script_setup_true_lang-CcysXzmW.mjs";
-import { useModule as $e, useModuleRoute as Se, useFirebaseIntegration as Te, useModulePermissions as Ue } from "@oneclick.dev/cms-kit";
-import { _ as je, F as Pe } from "./ReservationDetailDialog.vue_vue_type_script_setup_true_lang-B7ks5mbf.mjs";
-import { _ as Ne } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
-import { _ as be } from "./NewReservationDialog.vue_vue_type_script_setup_true_lang-CDc8MIq2.mjs";
-const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted/30 rounded-lg p-2 overflow-visible" }, Fe = ["onClick"], Ae = { class: "absolute -top-8 left-1/2 -translate-x-1/2 bg-popover border shadow-md rounded px-2 py-1 text-xs whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none z-10" }, Ve = { class: "font-medium" }, We = { class: "text-muted-foreground" }, He = { class: "w-full flex-1 flex items-end justify-center" }, Qe = {
+import { useModule as Se, useModuleRoute as $e, useFirebaseIntegration as Te, useModulePermissions as Ue } from "@oneclick.dev/cms-kit";
+import { _ as je, F as Pe } from "./ReservationDetailDialog.vue_vue_type_script_setup_true_lang-Cohhnd5x.mjs";
+import { _ as Re } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
+import { _ as be } from "./NewReservationDialog.vue_vue_type_script_setup_true_lang-Bc946oSc.mjs";
+const Ne = { class: "mb-6" }, Oe = { class: "flex items-end gap-px h-24 bg-muted/30 rounded-lg p-2 overflow-visible" }, Fe = ["onClick"], Ae = { class: "absolute -top-8 left-1/2 -translate-x-1/2 bg-popover border shadow-md rounded px-2 py-1 text-xs whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none z-10" }, Ve = { class: "font-medium" }, We = { class: "text-muted-foreground" }, He = { class: "w-full flex-1 flex items-end justify-center" }, Qe = {
   key: 1,
   class: "text-[10px] mt-1"
 }, Xe = {
@@ -27,11 +27,11 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
     }, I = () => {
       y("clear");
     };
-    return (a, r) => {
-      const c = N("Button");
-      return o(), u("div", Oe, [
-        r[2] || (r[2] = e("h3", { class: "font-semibold text-sm mb-2" }, "Timeline", -1)),
-        e("div", Re, [
+    return (a, l) => {
+      const c = P("Button");
+      return o(), u("div", Ne, [
+        l[2] || (l[2] = e("h3", { class: "font-semibold text-sm mb-2" }, "Timeline", -1)),
+        e("div", Oe, [
           (o(!0), u(X, null, Y(f.timeSlots, (s) => (o(), u("div", {
             key: s.startTime,
             class: "flex-1 min-w-0 flex flex-col items-center cursor-pointer group h-full relative",
@@ -65,15 +65,15 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
             class: "h-6 w-6 p-0",
             onClick: I
           }, {
-            default: S(() => [
+            default: $(() => [
               d(b(we), { size: 14 })
             ]),
             _: 1
           }),
           e("span", null, [
-            r[0] || (r[0] = ne(" Showing ", -1)),
+            l[0] || (l[0] = ne(" Showing ", -1)),
             e("span", Ye, v(f.slotStats[f.selectedTimeSlot]?.bookings || 0), 1),
-            r[1] || (r[1] = ne(" bookings at ", -1)),
+            l[1] || (l[1] = ne(" bookings at ", -1)),
             e("span", qe, v(f.selectedTimeSlot), 1)
           ])
         ])) : M("", !0)
@@ -92,7 +92,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
 }, ot = {
   key: 2,
   class: "space-y-2 max-h-80 overflow-y-auto"
-}, nt = ["onClick"], at = { class: "flex items-start justify-between" }, lt = { class: "flex-1" }, rt = { class: "font-medium" }, it = { class: "text-sm text-muted-foreground" }, ut = { class: "text-sm text-muted-foreground" }, dt = { class: "flex items-center gap-4" }, ct = { class: "flex items-center gap-2 mt-1 text-xs text-muted-foreground" }, mt = { class: "flex items-center gap-2 mt-1 text-xs text-muted-foreground" }, vt = { class: "text-right" }, pt = {
+}, nt = ["onClick"], at = { class: "flex items-start justify-between" }, rt = { class: "flex-1" }, lt = { class: "font-medium" }, it = { class: "text-sm text-muted-foreground" }, ut = { class: "text-sm text-muted-foreground" }, dt = { class: "flex items-center gap-4" }, ct = { class: "flex items-center gap-2 mt-1 text-xs text-muted-foreground" }, mt = { class: "flex items-center gap-2 mt-1 text-xs text-muted-foreground" }, vt = { class: "text-right" }, pt = {
   key: 0,
   class: "inline-block px-2 py-1 text-xs rounded-full bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-400"
 }, ft = {
@@ -121,15 +121,15 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
   },
   emits: ["update:searchQuery", "refresh"],
   setup(f, { emit: k }) {
-    const y = k, T = $(null), I = (c) => {
+    const y = k, T = S(null), I = (c) => {
       y("update:searchQuery", c);
     }, a = () => {
       y("update:searchQuery", "");
-    }, r = () => {
+    }, l = () => {
       y("refresh");
     };
     return (c, s) => {
-      const w = N("Input"), _ = N("Button");
+      const w = P("Input"), _ = P("Button");
       return o(), u("div", null, [
         e("div", Ke, [
           e("h3", Ge, [
@@ -155,7 +155,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
             class: "absolute right-1 top-1/2 -translate-y-1/2 h-7 w-7",
             onClick: a
           }, {
-            default: S(() => [
+            default: $(() => [
               d(b(we), { size: 14 })
             ]),
             _: 1
@@ -170,8 +170,8 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
             onClick: (B) => b(T).openDialog(h)
           }, [
             e("div", at, [
-              e("div", lt, [
-                e("div", rt, v(h.customerInfo.firstName + " " + h.customerInfo.lastName || "Unknown Customer"), 1),
+              e("div", rt, [
+                e("div", lt, v(h.customerInfo.firstName + " " + h.customerInfo.lastName || "Unknown Customer"), 1),
                 e("div", it, v(h.customerInfo.email), 1),
                 e("div", ut, v(h.customerInfo.phone), 1),
                 e("div", dt, [
@@ -195,9 +195,9 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
         d(je, {
           ref_key: "reservationDetailDialog",
           ref: T,
-          onCancelled: r,
-          onConfirmed: r,
-          onRejected: r
+          onCancelled: l,
+          onConfirmed: l,
+          onRejected: l
         }, null, 512)
       ]);
     };
@@ -205,19 +205,19 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
 }), _t = { class: "flex items-center gap-4 mt-2 text-sm" }, kt = { class: "flex items-center gap-1" }, wt = {
   key: 0,
   class: "flex items-center gap-1"
-}, $t = { class: "flex items-center gap-1" }, St = { class: "py-4" }, Tt = /* @__PURE__ */ K({
+}, St = { class: "flex items-center gap-1" }, $t = { class: "py-4" }, Tt = /* @__PURE__ */ K({
   __name: "EventDialog",
   props: {
     resources: { default: () => [] }
   },
   setup(f, { expose: k }) {
-    const y = f, { config: T } = $e(), { params: I } = Se(), a = Te(T.project), r = $(!1), c = $(null), s = $([]), w = $(!1), _ = $(null), h = $("");
+    const y = f, { config: T } = Se(), { params: I } = $e(), a = Te(T.project), l = S(!1), c = S(null), s = S([]), w = S(!1), _ = S(null), h = S("");
     Z("event", c);
     const B = U(() => {
       if (!c.value) return [];
       const p = c.value.resource?.interval || 60, n = [], [m, z] = c.value.startTime.split(":").map(Number), [A, C] = c.value.endTime.split(":").map(Number), O = m * 60 + z, t = A * 60 + C;
       for (let i = O; i < t; i += p) {
-        const x = Math.floor(i / 60), g = i % 60, E = Math.min(i + p, t), P = Math.floor(E / 60), l = E % 60, V = `${x.toString().padStart(2, "0")}:${g.toString().padStart(2, "0")}`, H = `${P.toString().padStart(2, "0")}:${l.toString().padStart(2, "0")}`;
+        const x = Math.floor(i / 60), g = i % 60, E = Math.min(i + p, t), F = Math.floor(E / 60), r = E % 60, V = `${x.toString().padStart(2, "0")}:${g.toString().padStart(2, "0")}`, H = `${F.toString().padStart(2, "0")}:${r.toString().padStart(2, "0")}`;
         n.push({
           startTime: V,
           endTime: H,
@@ -249,7 +249,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
         threshold: 0.3,
         ignoreLocation: !0
       }).search(h.value).map((m) => m.item)), p;
-    }), F = U(() => ({
+    }), N = U(() => ({
       spots: s.value.reduce((p, n) => p + (n.spots || 0), 0),
       bookings: s.value.length
     })), ee = (p) => {
@@ -257,7 +257,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
     }, J = () => {
       _.value = null;
     }, te = async (p) => {
-      r.value = !0, c.value = p, _.value = null, h.value = "", await G();
+      l.value = !0, c.value = p, _.value = null, h.value = "", await G();
     }, G = async () => {
       if (c.value) {
         w.value = !0, s.value = [];
@@ -276,8 +276,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
           });
           let A = [];
           z.forEach((C) => {
-            const O = C.reservations?.filter((t) => t.date === n) || [];
-            console.log("dateReservations", O), O.forEach((t) => {
+            (C.reservations?.filter((t) => t.date === n) || []).forEach((t) => {
               const i = y.resources.find((x) => x.id === t.resourceId);
               (t.status === "approved" || t.status === "needs_approval") && A.push({
                 customerInfo: C.customerInfo,
@@ -315,24 +314,24 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
     return k({
       openDialog: te
     }), (p, n) => {
-      const m = N("DialogTitle"), z = N("DialogDescription"), A = N("DialogHeader"), C = N("Button"), O = N("DialogFooter"), t = N("DialogScrollContent"), i = N("Dialog");
+      const m = P("DialogTitle"), z = P("DialogDescription"), A = P("DialogHeader"), C = P("Button"), O = P("DialogFooter"), t = P("DialogScrollContent"), i = P("Dialog");
       return o(), Q(i, {
-        open: r.value,
-        "onUpdate:open": n[2] || (n[2] = (x) => r.value = x)
+        open: l.value,
+        "onUpdate:open": n[2] || (n[2] = (x) => l.value = x)
       }, {
-        default: S(() => [
+        default: $(() => [
           d(t, { class: "sm:max-w-3xl" }, {
-            default: S(() => [
+            default: $(() => [
               d(A, null, {
-                default: S(() => [
+                default: $(() => [
                   c.value?.date ? (o(), Q(m, { key: 0 }, {
-                    default: S(() => [
+                    default: $(() => [
                       ne(v(ae[new Date(c.value.date).getUTCDay()]) + " " + v(se[new Date(c.value.date).getUTCMonth()]) + " " + v(new Date(c.value.date).getUTCDate()) + ", " + v(new Date(c.value.date).getUTCFullYear()), 1)
                     ]),
                     _: 1
                   })) : M("", !0),
                   d(z, null, {
-                    default: S(() => [
+                    default: $(() => [
                       e("div", _t, [
                         e("div", kt, [
                           d(b(ge), { size: 14 }),
@@ -345,9 +344,9 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                           }, null, 4),
                           e("span", null, v(c.value.resource.name), 1)
                         ])) : M("", !0),
-                        e("div", $t, [
+                        e("div", St, [
                           d(b(he), { size: 14 }),
-                          e("span", null, v(F.value.spots) + " spots in " + v(F.value.bookings) + " reservations", 1)
+                          e("span", null, v(N.value.spots) + " spots in " + v(N.value.bookings) + " reservations", 1)
                         ])
                       ])
                     ]),
@@ -356,7 +355,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                 ]),
                 _: 1
               }),
-              e("div", St, [
+              e("div", $t, [
                 B.value.length > 1 ? (o(), Q(Je, {
                   key: 0,
                   "time-slots": B.value,
@@ -377,12 +376,12 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                 }, null, 8, ["orders", "filtered-orders", "is-loading", "selected-time-slot", "search-query"])
               ]),
               d(O, null, {
-                default: S(() => [
+                default: $(() => [
                   d(C, {
                     variant: "outline",
-                    onClick: n[1] || (n[1] = (x) => r.value = !1)
+                    onClick: n[1] || (n[1] = (x) => l.value = !1)
                   }, {
-                    default: S(() => [...n[3] || (n[3] = [
+                    default: $(() => [...n[3] || (n[3] = [
                       ne("Close", -1)
                     ])]),
                     _: 1
@@ -401,7 +400,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
 }), Dt = { class: "flex-1 border-r shadow-sm overflow-hidden min-h-[1536px]" }, Ct = { class: "relative h-full min-h-[1536px]" }, Mt = { class: "divide-y divide-input/80 h-full flex flex-col min-h-[1536px] border-y border-input/80" }, zt = { class: "absolute inset-0 pointer-events-none" }, Et = { class: "relative mr-3 h-full ml-2" }, It = ["onClick"], Bt = {
   key: 0,
   class: "absolute bottom-0 left-0 right-0 h-1 bg-black/20"
-}, Lt = { class: "flex items-start justify-between gap-2 mb-1" }, Ut = { class: "font-semibold text-sm leading-tight line-clamp-1 flex-1" }, jt = { class: "flex items-center gap-1 shrink-0" }, Pt = ["title"], Nt = { class: "font-medium" }, ye = /* @__PURE__ */ K({
+}, Lt = { class: "flex items-start justify-between gap-2 mb-1" }, Ut = { class: "font-semibold text-sm leading-tight line-clamp-1 flex-1" }, jt = { class: "flex items-center gap-1 shrink-0" }, Pt = ["title"], Rt = { class: "font-medium" }, ye = /* @__PURE__ */ K({
   __name: "EventTimeline",
   props: {
     date: {},
@@ -410,12 +409,12 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
     resources: { default: () => [] }
   },
   setup(f) {
-    const k = f, y = $(null), T = (r) => {
-      const [c, s] = r.split(":").map(Number);
+    const k = f, y = S(null), T = (l) => {
+      const [c, s] = l.split(":").map(Number);
       return c * 60 + s;
     };
-    U(() => !k.events || !k.resources ? [] : k.resources.map((r) => {
-      const s = k.events.filter((w) => w.resourceId === r.id).map((w) => {
+    U(() => !k.events || !k.resources ? [] : k.resources.map((l) => {
+      const s = k.events.filter((w) => w.resourceId === l.id).map((w) => {
         const _ = T(w.startTime), B = T(w.endTime) - _, D = _ / 1440 * 100, W = B / 1440 * 100, L = (w.bookings ?? 0) > 0, j = w.maxBookings ? (w.bookings ?? 0) / w.maxBookings * 100 : 0;
         return {
           ...w,
@@ -428,26 +427,26 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
         };
       });
       return {
-        resource: r,
+        resource: l,
         events: s
       };
     }));
-    const I = U(() => k.events ? k.events.map((r) => {
-      const c = T(r.startTime), w = T(r.endTime) - c, _ = c / 1440 * 100, h = w / 1440 * 100, B = (r.bookings ?? 0) > 0, D = r.maxBookings ? (r.bookings ?? 0) / r.maxBookings * 100 : 0;
+    const I = U(() => k.events ? k.events.map((l) => {
+      const c = T(l.startTime), w = T(l.endTime) - c, _ = c / 1440 * 100, h = w / 1440 * 100, B = (l.bookings ?? 0) > 0, D = l.maxBookings ? (l.bookings ?? 0) / l.maxBookings * 100 : 0;
       return {
-        ...r,
+        ...l,
         top: `${_}%`,
         height: `${h}%`,
-        color: r.resource?.color || "#3b82f6",
+        color: l.resource?.color || "#3b82f6",
         hasBookings: B,
         fillPercentage: D,
         isSmall: w < 60
       };
-    }) : []), a = Array.from({ length: 24 }, (r, c) => ({
+    }) : []), a = Array.from({ length: 24 }, (l, c) => ({
       hour: c,
       label: `${c.toString().padStart(2, "0")}:00`
     }));
-    return (r, c) => (o(), u(X, null, [
+    return (l, c) => (o(), u(X, null, [
       e("div", Dt, [
         e("div", Ct, [
           e("div", Mt, [
@@ -512,7 +511,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                       class: R(["flex items-center gap-1 px-2 py-0.5 rounded backdrop-blur-sm", { "bg-black/10": !s.isSmall }])
                     }, [
                       d(b(ge), { size: 10 }),
-                      e("span", Nt, v(s.startTime) + " – " + v(s.endTime), 1)
+                      e("span", Rt, v(s.startTime) + " – " + v(s.endTime), 1)
                     ], 2)
                   ], 2)
                 ], 2),
@@ -529,19 +528,19 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
       }, null, 8, ["resources"])
     ], 64));
   }
-}), Ot = { class: "sticky left-0 mt-auto z-10 divide-y divide-border/50 h-full flex flex-col min-h-[1536px] bg-input" }, Rt = { class: "flex-shrink-0 text-xs font-medium text-muted-foreground px-3 pb-3 border-r border-border/50 w-14" }, Ft = { class: "flex items-center gap-1.5" }, _e = /* @__PURE__ */ K({
+}), Nt = { class: "sticky left-0 mt-auto z-10 divide-y divide-border/50 h-full flex flex-col min-h-[1536px] bg-input" }, Ot = { class: "flex-shrink-0 text-xs font-medium text-muted-foreground px-3 pb-3 border-r border-border/50 w-14" }, Ft = { class: "flex items-center gap-1.5" }, _e = /* @__PURE__ */ K({
   __name: "Event24hSidebar",
   setup(f) {
     const k = Array.from({ length: 24 }, (y, T) => ({
       hour: T,
       label: `${T.toString().padStart(2, "0")}:00`
     }));
-    return (y, T) => (o(), u("div", Ot, [
+    return (y, T) => (o(), u("div", Nt, [
       (o(!0), u(X, null, Y(b(k), (I) => (o(), u("div", {
         key: I.hour,
         class: "flex-1 flex transition-all duration-200"
       }, [
-        e("div", Rt, [
+        e("div", Ot, [
           e("div", Ft, [
             e("span", {
               class: R({ "-translate-y-1/2": I.hour !== 0 })
@@ -563,7 +562,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
     }
   },
   setup(f) {
-    const k = $(Date.now());
+    const k = S(Date.now());
     let y;
     pe(() => {
       y = window.setInterval(() => {
@@ -576,12 +575,12 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
       const a = new Date(k.value);
       return `${(a.getHours() * 60 + a.getMinutes() + a.getSeconds() / 60) / 1440 * 100}%`;
     }), I = U(() => new Date(k.value).getFullYear() + "-" + (new Date(k.value).getMonth() + 1).toString().padStart(2, "0") + "-" + new Date(k.value).getDate().toString().padStart(2, "0"));
-    return (a, r) => (o(), u("div", At, [
+    return (a, l) => (o(), u("div", At, [
       e("div", {
         class: "absolute left-0 right-0 h-0.5 bg-red-500 z-30 pointer-events-none transition-[top] duration-300 ease-linear",
         style: q({ top: T.value })
       }, [
-        r[0] || (r[0] = e("div", { class: "absolute -left-2 -top-1.5 w-3 h-3 bg-red-500 rounded-full shadow-lg shadow-red-500/50" }, null, -1)),
+        l[0] || (l[0] = e("div", { class: "absolute -left-2 -top-1.5 w-3 h-3 bg-red-500 rounded-full shadow-lg shadow-red-500/50" }, null, -1)),
         f.currentDate && f.currentDate == I.value ? (o(), u("div", Vt, " Now ")) : M("", !0)
       ], 4)
     ]));
@@ -604,7 +603,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
 }, Gt = /* @__PURE__ */ K({
   __name: "EventView",
   setup(f) {
-    const k = ie("activeDate", $(ue(de()))), y = ie("viewMode", $(1)), T = ie("events", $([])), I = ie("resources", $([])), a = $(null), r = $(!1), c = $(!1);
+    const k = ie("activeDate", S(ue(de()))), y = ie("viewMode", S(1)), T = ie("events", S([])), I = ie("resources", S([])), a = S(null), l = S(!1), c = S(!1);
     U(() => I.value.length > 1);
     const s = U(() => {
       const n = [], m = k.value;
@@ -635,13 +634,13 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
       }, 300));
     }, j = () => {
       D && (clearTimeout(D), D = null), B && (clearInterval(B), B = null);
-    }, F = () => {
+    }, N = () => {
       if (!a.value) return;
       const { scrollLeft: n, scrollWidth: m, clientWidth: z } = a.value;
-      r.value = n > 10, c.value = n < m - z - 10;
+      l.value = n > 10, c.value = n < m - z - 10;
     }, ee = (n) => {
       a.value && Math.abs(n.deltaY) > Math.abs(n.deltaX) && (n.preventDefault(), a.value.scrollBy({ left: n.deltaY, behavior: "auto" }));
-    }, J = $(!1), te = $(0), G = $(0), ae = (n) => {
+    }, J = S(!1), te = S(0), G = S(0), ae = (n) => {
       !a.value || y.value === 1 || n.target.closest(".event-card") || (J.value = !0, te.value = n.pageX, G.value = a.value.scrollLeft, a.value.style.userSelect = "none", n.preventDefault());
     }, se = (n) => {
       if (!J.value || !a.value) return;
@@ -651,23 +650,23 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
       a.value && (J.value = !1, a.value.style.userSelect = "");
     };
     return pe(() => {
-      a.value && (a.value.addEventListener("scroll", F), a.value.addEventListener("wheel", ee, { passive: !1 }), xe(() => {
-        F(), setTimeout(F, 50), setTimeout(F, 150), setTimeout(F, 300), setTimeout(F, 500);
+      a.value && (a.value.addEventListener("scroll", N), a.value.addEventListener("wheel", ee, { passive: !1 }), xe(() => {
+        N(), setTimeout(N, 50), setTimeout(N, 150), setTimeout(N, 300), setTimeout(N, 500);
       })), document.addEventListener("mousemove", se), document.addEventListener("mouseup", p);
     }), ze(() => {
       document.removeEventListener("mousemove", se), document.removeEventListener("mouseup", p);
-    }), re(y, () => {
+    }), le(y, () => {
       y.value > 1 ? xe(() => {
         setTimeout(() => {
           if (!a.value) return;
           const { scrollWidth: n, clientWidth: m } = a.value;
-          n > m && (c.value = !0, r.value = !1);
+          n > m && (c.value = !0, l.value = !1);
         }, 100);
       }) : a.value && (a.value.style.cursor = "");
     }), fe(() => {
-      j(), a.value && (a.value.removeEventListener("scroll", F), a.value.removeEventListener("wheel", ee));
+      j(), a.value && (a.value.removeEventListener("scroll", N), a.value.removeEventListener("wheel", ee));
     }), (n, m) => {
-      const z = N("Button"), A = N("TooltipTrigger"), C = N("TooltipContent"), O = N("Tooltip");
+      const z = P("Button"), A = P("TooltipTrigger"), C = P("TooltipContent"), O = P("Tooltip");
       return b(y) === 1 ? (o(), u("div", Wt, [
         d(_e),
         d(ke, {
@@ -685,7 +684,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
           m[0] || (m[0] = e("span", null, "Scroll to view all days", -1)),
           d(b(ce), { size: 12 })
         ])) : M("", !0),
-        r.value ? (o(), Q(z, {
+        l.value ? (o(), Q(z, {
           key: 1,
           variant: "outline",
           size: "icon",
@@ -696,7 +695,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
           onTouchend: j,
           class: "sticky top-1/2 left-2 -translate-y-1/2 z-40 h-10 w-10 rounded-full shadow-lg bg-background/95 backdrop-blur-sm hover:bg-background border-2"
         }, {
-          default: S(() => [
+          default: $(() => [
             d(b(ve), { size: 20 })
           ]),
           _: 1
@@ -712,7 +711,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
           onTouchend: j,
           class: "sticky top-1/2 right-2 -translate-y-1/2 z-40 h-10 w-10 rounded-full shadow-lg bg-background/95 backdrop-blur-sm hover:bg-background border-2 float-right"
         }, {
-          default: S(() => [
+          default: $(() => [
             d(b(ce), { size: 20 })
           ]),
           _: 1
@@ -725,7 +724,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
           ref_key: "scrollContainer",
           ref: a,
           class: "absolute inset-0 overflow-x-auto overflow-y-visible",
-          onScroll: F,
+          onScroll: N,
           onMousedown: ae
         }, [
           e("div", Xt, [
@@ -763,9 +762,9 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                   e("div", { class: "text-[10px] text-muted-foreground/0 group-hover:text-muted-foreground/100 uppercase tracking-wide transition-all" }, " Click to view ")
                 ], -1)),
                 d(O, null, {
-                  default: S(() => [
+                  default: $(() => [
                     d(A, { "as-child": "" }, {
-                      default: S(() => [
+                      default: $(() => [
                         w(t).filter((x) => x.isException).length > 0 ? (o(), Q(b(Ie), {
                           key: 0,
                           class: "absolute top-3 right-3 size-4 text-orange-500"
@@ -774,7 +773,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                       _: 2
                     }, 1024),
                     d(C, null, {
-                      default: S(() => [...m[2] || (m[2] = [
+                      default: $(() => [...m[2] || (m[2] = [
                         e("p", null, " This day has exceptions applied to it. ", -1)
                       ])]),
                       _: 1
@@ -783,15 +782,15 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                   _: 2
                 }, 1024),
                 d(O, null, {
-                  default: S(() => [
+                  default: $(() => [
                     d(A, { "as-child": "" }, {
-                      default: S(() => [
+                      default: $(() => [
                         w(t).filter((x) => x.isException).length > 0 ? (o(), u("div", Kt)) : M("", !0)
                       ]),
                       _: 2
                     }, 1024),
                     d(C, null, {
-                      default: S(() => [...m[3] || (m[3] = [
+                      default: $(() => [...m[3] || (m[3] = [
                         e("p", null, " This day has exceptions applied to it. ", -1)
                       ])]),
                       _: 1
@@ -811,7 +810,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
       ]));
     };
   }
-}), Zt = /* @__PURE__ */ Ne(Gt, [["__scopeId", "data-v-99339cf2"]]), es = { class: "flex flex-col gap-2 md:gap-4 w-full h-full" }, ts = { class: "flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3 px-1" }, ss = { class: "flex items-center justify-between sm:justify-start gap-4" }, os = { class: "flex flex-col" }, ns = { class: "flex items-center gap-2" }, as = { class: "text-lg sm:text-2xl font-bold tracking-tight truncate" }, ls = { class: "text-xs sm:text-sm text-muted-foreground ml-7 truncate" }, rs = { class: "flex items-center justify-between sm:justify-end gap-2" }, is = { class: "flex items-center gap-1 sm:mr-2" }, us = {
+}), Zt = /* @__PURE__ */ Re(Gt, [["__scopeId", "data-v-99339cf2"]]), es = { class: "flex flex-col gap-2 md:gap-4 w-full h-full" }, ts = { class: "flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3 px-1" }, ss = { class: "flex items-center justify-between sm:justify-start gap-4" }, os = { class: "flex flex-col" }, ns = { class: "flex items-center gap-2" }, as = { class: "text-lg sm:text-2xl font-bold tracking-tight truncate" }, rs = { class: "text-xs sm:text-sm text-muted-foreground ml-7 truncate" }, ls = { class: "flex items-center justify-between sm:justify-end gap-2" }, is = { class: "flex items-center gap-1 sm:mr-2" }, us = {
   key: 0,
   class: "flex items-center gap-2 px-1 overflow-x-auto pb-2 -mx-1 scrollbar-hide"
 }, ds = ["onClick"], cs = { class: "flex gap-4 flex-1 min-h-0 md:min-h-[1700px]" }, ms = { class: "hidden md:flex flex-shrink-0 flex-col gap-4" }, vs = {
@@ -826,21 +825,21 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
 }, ys = { class: "min-w-0 flex-1" }, _s = { class: "text-sm font-medium truncate text-muted-foreground" }, zs = /* @__PURE__ */ K({
   __name: "agenda",
   setup(f) {
-    const { hasPermission: k } = Ue(), { params: y } = Se(), { config: T } = $e(), I = Te(T.project), a = $(ue(de())), r = $(1), c = $(typeof window < "u" ? window.innerWidth : 1024), s = U(() => c.value < 768), w = () => {
+    const { hasPermission: k } = Ue(), { params: y } = $e(), { config: T } = Se(), I = Te(T.project), a = S(ue(de())), l = S(1), c = S(typeof window < "u" ? window.innerWidth : 1024), s = U(() => c.value < 768), w = () => {
       c.value = window.innerWidth;
     };
     pe(() => {
       window.addEventListener("resize", w);
     }), fe(() => {
       window.removeEventListener("resize", w);
-    }), re(s, (t) => {
-      t && r.value !== 1 && (r.value = 1);
+    }), le(s, (t) => {
+      t && l.value !== 1 && (l.value = 1);
     }, { immediate: !0 });
-    const _ = $(null), h = $(/* @__PURE__ */ new Map()), B = U(() => _.value?.resources || []), D = U(() => B.value.filter((t) => t.isActive)), W = U(() => B.value.filter((t) => !t.isActive)), L = $(null), j = $(!1);
-    re(D, (t) => {
+    const _ = S(null), h = S(/* @__PURE__ */ new Map()), B = U(() => _.value?.resources || []), D = U(() => B.value.filter((t) => t.isActive)), W = U(() => B.value.filter((t) => !t.isActive)), L = S(null), j = S(!1);
+    le(D, (t) => {
       t.length > 0 && !L.value && (L.value = t[0].id);
     }, { immediate: !0 });
-    const F = U(() => {
+    const N = U(() => {
       if (!L.value)
         return D.value.length > 0 ? [D.value[0]] : [];
       const t = D.value.find((i) => i.id === L.value);
@@ -848,7 +847,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
     }), ee = U(() => _.value?.pricingOptions?.find((i) => i.isDefault)?.duration || 30), J = (t) => {
       L.value = t;
     };
-    re(a, () => {
+    le(a, () => {
       O();
     });
     const te = U(() => {
@@ -860,9 +859,9 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
         full: `${x} ${g} ${E}`
       };
     }), G = () => {
-      a.value = a.value.subtract({ days: r.value });
+      a.value = a.value.subtract({ days: l.value });
     }, ae = () => {
-      a.value = a.value.add({ days: r.value });
+      a.value = a.value.add({ days: l.value });
     }, se = () => {
       a.value = ue(de());
     }, p = (t) => {
@@ -871,56 +870,54 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
     }, n = (t, i) => (_.value?.exceptions || []).find((g) => i >= g.startDate && i <= g.endDate ? g.resourceIds === null ? !0 : g.resourceIds?.includes(t) : !1) || null, m = (t, i, x) => {
       const g = n(t.id, x);
       if (g)
-        return g.isClosed ? [] : g.timeslots.map((l) => ({
-          startTime: l.startTime,
-          endTime: l.endTime,
+        return g.isClosed ? [] : g.timeslots.map((r) => ({
+          startTime: r.startTime,
+          endTime: r.endTime,
           isException: !0
         }));
-      const E = i.getDay(), P = t.openingHours?.[E] || [];
-      return P.length === 0 ? [] : P.map((l) => ({
-        startTime: l.start,
-        endTime: l.end,
+      const E = i.getDay(), F = t.openingHours?.[E] || [];
+      return F.length === 0 ? [] : F.map((r) => ({
+        startTime: r.start,
+        endTime: r.end,
         isException: !1
       }));
     }, z = (t, i, x, g) => {
       if (!_.value) return 0;
       const E = h.value.get(i);
-      if (!E) return 0;
-      const P = E.filter((l) => l.resourceId === t).reduce((l, V) => {
-        const H = p(V.startTime), oe = p(V.endTime), le = p(x), me = p(g);
-        return H < me && oe > le ? l + (V.reserved || 0) : l;
-      }, 0);
-      return P > 0 && console.log(`Found ${P} total bookings for ${t} on ${i} ${x}-${g}`), P;
+      return E ? E.filter((r) => r.resourceId === t).reduce((r, V) => {
+        const H = p(V.startTime), oe = p(V.endTime), re = p(x), me = p(g);
+        return H < me && oe > re ? r + (V.reserved || 0) : r;
+      }, 0) : 0;
     }, A = U(() => {
       if (!_.value) return [];
       h.value.size;
       let t = [], i = [];
-      for (let g = 0; g < r.value; g++) {
+      for (let g = 0; g < l.value; g++) {
         const E = a.value.add({ days: g });
         i.push(E);
       }
-      const x = F.value.length > 0 ? F.value : [];
+      const x = N.value.length > 0 ? N.value : [];
       return x.length === 0 ? [] : (i.forEach((g) => {
         let E = new Date(g.year, g.month - 1, g.day);
-        const P = `${g.year}-${String(g.month).padStart(2, "0")}-${String(g.day).padStart(2, "0")}`;
-        x.forEach((l) => {
-          const V = m(l, E, P);
+        const F = `${g.year}-${String(g.month).padStart(2, "0")}-${String(g.day).padStart(2, "0")}`;
+        x.forEach((r) => {
+          const V = m(r, E, F);
           t = t.concat(V.map((H, oe) => {
-            const le = z(l.id, P, H.startTime, H.endTime);
+            const re = z(r.id, F, H.startTime, H.endTime);
             return {
-              id: `block-${P}-${l.id}-${oe}`,
+              id: `block-${F}-${r.id}-${oe}`,
               title: _.value.serviceName,
-              date: P,
+              date: F,
               startTime: H.startTime,
               endTime: H.endTime,
-              theme: l.color || "#3b82f6",
-              bookings: le,
-              maxBookings: l.capacity,
+              theme: r.color || "#3b82f6",
+              bookings: re,
+              maxBookings: r.capacity,
               isException: H.isException || !1,
-              resourceId: l.id,
-              resource: l,
+              resourceId: r.id,
+              resource: r,
               // Store interval and duration for booking slot calculation
-              interval: l.interval || 30,
+              interval: r.interval || 30,
               serviceDuration: ee.value
             };
           }));
@@ -932,15 +929,15 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
       const t = y.value.id, i = a.value;
       h.value.clear();
       const x = [];
-      for (let g = 0; g < r.value; g++) {
-        const E = i.add({ days: g }), P = `${E.year}-${String(E.month).padStart(2, "0")}-${String(E.day).padStart(2, "0")}`, l = `${t}_${P}`;
+      for (let g = 0; g < l.value; g++) {
+        const E = i.add({ days: g }), F = `${E.year}-${String(E.month).padStart(2, "0")}-${String(E.day).padStart(2, "0")}`, r = `${t}_${F}`;
         x.push(
-          I.get(T.reservedSpotsCollection, l).then((V) => {
+          I.get(T.reservedSpotsCollection, r).then((V) => {
             if (V) {
               let H = [];
               for (const oe of D.value) {
-                const le = V?.[oe.id] || {};
-                Object.entries(le).forEach(([me, De]) => {
+                const re = V?.[oe.id] || {};
+                Object.entries(re).forEach(([me, De]) => {
                   const [Ce, Me] = me.split("-");
                   H.push({
                     resourceId: oe.id,
@@ -950,20 +947,20 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                   });
                 });
               }
-              h.value.set(P, H);
+              h.value.set(F, H);
             }
           }).catch(() => {
           })
         );
       }
-      await Promise.all(x), console.log("Loaded reserved spots:", h.value);
+      await Promise.all(x);
     };
-    return C(), O(), re(r, () => {
+    return C(), O(), le(l, () => {
       O();
-    }), Z("agendaData", _), Z("activeDate", a), Z("viewMode", r), Z("events", A), Z("resources", F), Z("allResources", D), (t, i) => {
-      const x = N("Button"), g = N("SegmentedControlButton"), E = N("SegmentedControl"), P = N("Calendar");
+    }), Z("agendaData", _), Z("activeDate", a), Z("viewMode", l), Z("events", A), Z("resources", N), Z("allResources", D), (t, i) => {
+      const x = P("Button"), g = P("SegmentedControlButton"), E = P("SegmentedControl"), F = P("Calendar");
       return o(), Q(Le, null, {
-        default: S(() => [
+        default: $(() => [
           e("div", es, [
             e("div", ts, [
               e("div", ss, [
@@ -975,11 +972,11 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                     }),
                     e("h2", as, v(te.value.full), 1)
                   ]),
-                  e("p", ls, v(_.value?.serviceName), 1)
+                  e("p", rs, v(_.value?.serviceName), 1)
                 ]),
                 s.value && b(k)("manage-reservations") ? (o(), Q(be, { key: 0 })) : M("", !0)
               ]),
-              e("div", rs, [
+              e("div", ls, [
                 e("div", is, [
                   d(x, {
                     variant: "outline",
@@ -987,7 +984,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                     class: "size-8 sm:size-9",
                     onClick: G
                   }, {
-                    default: S(() => [
+                    default: $(() => [
                       d(b(ve), { size: 16 })
                     ]),
                     _: 1
@@ -998,7 +995,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                     class: "h-8 sm:h-9 px-2 sm:px-3 text-xs sm:text-sm",
                     onClick: se
                   }, {
-                    default: S(() => [...i[3] || (i[3] = [
+                    default: $(() => [...i[3] || (i[3] = [
                       ne(" Today ", -1)
                     ])]),
                     _: 1
@@ -1009,7 +1006,7 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                     class: "size-8 sm:size-9",
                     onClick: ae
                   }, {
-                    default: S(() => [
+                    default: $(() => [
                       d(b(ce), { size: 16 })
                     ]),
                     _: 1
@@ -1017,24 +1014,24 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                 ]),
                 s.value ? M("", !0) : (o(), Q(E, {
                   key: 0,
-                  modelValue: r.value,
-                  "onUpdate:modelValue": i[0] || (i[0] = (l) => r.value = l)
+                  modelValue: l.value,
+                  "onUpdate:modelValue": i[0] || (i[0] = (r) => l.value = r)
                 }, {
-                  default: S(() => [
+                  default: $(() => [
                     d(g, { value: 1 }, {
-                      default: S(() => [...i[4] || (i[4] = [
+                      default: $(() => [...i[4] || (i[4] = [
                         e("span", { class: "whitespace-nowrap" }, "1 Day", -1)
                       ])]),
                       _: 1
                     }),
                     d(g, { value: 3 }, {
-                      default: S(() => [...i[5] || (i[5] = [
+                      default: $(() => [...i[5] || (i[5] = [
                         e("span", { class: "whitespace-nowrap" }, "3 Days", -1)
                       ])]),
                       _: 1
                     }),
                     d(g, { value: 7 }, {
-                      default: S(() => [...i[6] || (i[6] = [
+                      default: $(() => [...i[6] || (i[6] = [
                         e("span", { class: "whitespace-nowrap" }, "7 Days", -1)
                       ])]),
                       _: 1
@@ -1046,26 +1043,26 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
               ])
             ]),
             s.value && D.value.length > 0 ? (o(), u("div", us, [
-              (o(!0), u(X, null, Y(D.value, (l) => (o(), u("button", {
-                key: l.id,
+              (o(!0), u(X, null, Y(D.value, (r) => (o(), u("button", {
+                key: r.id,
                 class: R(["flex items-center gap-2 px-3 py-1.5 rounded-full border text-sm whitespace-nowrap transition-colors flex-shrink-0", {
-                  "bg-primary text-primary-foreground border-primary": L.value === l.id,
-                  "bg-background hover:bg-muted": L.value !== l.id
+                  "bg-primary text-primary-foreground border-primary": L.value === r.id,
+                  "bg-background hover:bg-muted": L.value !== r.id
                 }]),
-                onClick: (V) => J(l.id)
+                onClick: (V) => J(r.id)
               }, [
                 e("div", {
                   class: "size-5 rounded-full flex items-center justify-center text-white text-[10px] font-medium",
-                  style: q({ backgroundColor: L.value === l.id ? "rgba(255,255,255,0.3)" : l.color || "#6b7280" })
-                }, v(l.avatarLabel || l.name.charAt(0).toUpperCase()), 5),
-                e("span", null, v(l.name), 1)
+                  style: q({ backgroundColor: L.value === r.id ? "rgba(255,255,255,0.3)" : r.color || "#6b7280" })
+                }, v(r.avatarLabel || r.name.charAt(0).toUpperCase()), 5),
+                e("span", null, v(r.name), 1)
               ], 10, ds))), 128))
             ])) : M("", !0),
             e("div", cs, [
               e("div", ms, [
-                d(P, {
+                d(F, {
                   modelValue: a.value,
-                  "onUpdate:modelValue": i[1] || (i[1] = (l) => a.value = l),
+                  "onUpdate:modelValue": i[1] || (i[1] = (r) => a.value = r),
                   "weekday-format": "short",
                   class: "rounded-md border"
                 }, null, 8, ["modelValue"]),
@@ -1074,29 +1071,29 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                     e("span", { class: "text-sm font-medium" }, "Resources")
                   ], -1)),
                   e("div", ps, [
-                    (o(!0), u(X, null, Y(D.value, (l) => (o(), u("div", {
-                      key: l.id,
+                    (o(!0), u(X, null, Y(D.value, (r) => (o(), u("div", {
+                      key: r.id,
                       class: R(["flex items-center gap-2 p-2 rounded-md hover:bg-muted cursor-pointer transition-colors", {
-                        "bg-muted ring-2 ring-primary/20": L.value === l.id,
-                        "opacity-50": L.value && L.value !== l.id
+                        "bg-muted ring-2 ring-primary/20": L.value === r.id,
+                        "opacity-50": L.value && L.value !== r.id
                       }]),
-                      onClick: (V) => J(l.id)
+                      onClick: (V) => J(r.id)
                     }, [
                       e("div", {
                         class: "size-7 rounded-full flex items-center justify-center text-white text-xs font-medium flex-shrink-0",
-                        style: q({ backgroundColor: l.color || "#6b7280" })
-                      }, v(l.avatarLabel || l.name.charAt(0).toUpperCase()), 5),
+                        style: q({ backgroundColor: r.color || "#6b7280" })
+                      }, v(r.avatarLabel || r.name.charAt(0).toUpperCase()), 5),
                       e("div", gs, [
-                        e("div", hs, v(l.name), 1)
+                        e("div", hs, v(r.name), 1)
                       ]),
                       e("div", {
-                        class: R(["size-2 rounded-full flex-shrink-0", L.value === l.id ? "bg-primary" : "bg-muted-foreground/30"])
+                        class: R(["size-2 rounded-full flex-shrink-0", L.value === r.id ? "bg-primary" : "bg-muted-foreground/30"])
                       }, null, 2)
                     ], 10, fs))), 128)),
                     W.value.length > 0 ? (o(), u("div", xs, [
                       e("button", {
                         class: "flex items-center gap-2 text-xs text-muted-foreground hover:text-foreground w-full py-1 transition-colors",
-                        onClick: i[2] || (i[2] = (l) => j.value = !j.value)
+                        onClick: i[2] || (i[2] = (r) => j.value = !j.value)
                       }, [
                         d(b(ce), {
                           size: 14,
@@ -1105,16 +1102,16 @@ const Oe = { class: "mb-6" }, Re = { class: "flex items-end gap-px h-24 bg-muted
                         e("span", null, "Inactive (" + v(W.value.length) + ")", 1)
                       ]),
                       j.value ? (o(), u("div", bs, [
-                        (o(!0), u(X, null, Y(W.value, (l) => (o(), u("div", {
-                          key: l.id,
+                        (o(!0), u(X, null, Y(W.value, (r) => (o(), u("div", {
+                          key: r.id,
                           class: "flex items-center gap-2 p-2 rounded-md opacity-50"
                         }, [
                           e("div", {
                             class: "size-7 rounded-full flex items-center justify-center text-white text-xs font-medium flex-shrink-0 grayscale",
-                            style: q({ backgroundColor: l.color || "#6b7280" })
-                          }, v(l.avatarLabel || l.name.charAt(0).toUpperCase()), 5),
+                            style: q({ backgroundColor: r.color || "#6b7280" })
+                          }, v(r.avatarLabel || r.name.charAt(0).toUpperCase()), 5),
                           e("div", ys, [
-                            e("div", _s, v(l.name), 1)
+                            e("div", _s, v(r.name), 1)
                           ])
                         ]))), 128))
                       ])) : M("", !0)