themelia-react-ui 2.0.3 → 2.0.4

package/dist/features/appointment-calendar.js

@@ -1,31 +1,33 @@
 "use client";
-import { c as e, o as t } from "../ui-provider-C_U0Xma4.js";
+import { c as e, o as t } from "../ui-provider-CQCuCBcy.js";
 import { useStrings as n } from "../lib/strings.js";
-import { t as r } from "../utils-BRhFDwuU.js";
-import { n as i } from "../buttons-DPZekJFu.js";
-import { c as a, s as o } from "../typography-UTnveOEy.js";
-import { t as s } from "../focus-recipes-B653VaLq.js";
-import { t as c } from "../structure-BmisBK-3.js";
-import { i as l, t as u } from "../tone-recipes-BPsRAvhu.js";
-import { h as d, m as f, p, t as m, v as h } from "../smart-card-DiC5aac3.js";
-import { t as g } from "../feedback-BYIhtitP.js";
-import { n as _ } from "../action-menu-CllU52Mm.js";
-import { r as v } from "../skeleton-Byjnt7qr.js";
-import { t as y } from "../interaction-recipes-XR9ZpVYL.js";
-import { t as b } from "../initials-format-CDoQEOd_.js";
-import { i as x, n as S, s as C } from "../avatar-DAPlDvhJ.js";
-import { t as w } from "../badge-HpFqoqSY.js";
-import { l as T } from "../choice-inputs-CNHvARCJ.js";
-import { o as E } from "../display-hAc1HjpI.js";
-import { t as ee } from "../scroll-area-DcI-M1UT.js";
-import { i as D, n as O, r as te, t as ne, u as re } from "../item-K5_ghvze.js";
-import { i as ie, r as ae, t as oe } from "../tabs-CDocW5D1.js";
-import { s as se } from "../data-display-DT_khPl_.js";
-import { isValidElement as ce, useEffect as k, useId as le, useLayoutEffect as ue, useMemo as A, useRef as j, useState as M } from "react";
-import { Fragment as de, jsx as N, jsxs as P } from "react/jsx-runtime";
-import { ChevronLeft as fe, ChevronRight as pe, Plus as me, TriangleAlert as he } from "lucide-react";
+import { t as r } from "../utils-CF3c95Io.js";
+import { n as i } from "../buttons-BbfzgczK.js";
+import { c as a, s as o } from "../typography-CSyJrh28.js";
+import { n as s } from "../text.styles-B64My8RZ.js";
+import { t as c } from "../focus-recipes-B653VaLq.js";
+import { t as l } from "../structure-C0V0_Fyf.js";
+import { i as u, t as d } from "../tone-recipes-BPsRAvhu.js";
+import { h as f, m as p, p as m, t as h, v as g } from "../smart-card-CqkzQsK-.js";
+import { t as _ } from "../feedback-DZNL5Lg1.js";
+import { t as v } from "../composition.recipes-COdiFhxB.js";
+import { n as y } from "../action-menu-CHgs8vmj.js";
+import { r as b } from "../skeleton-CUj8O5Bd.js";
+import { t as x } from "../interaction-recipes-XR9ZpVYL.js";
+import { t as S } from "../initials-format-CDoQEOd_.js";
+import { i as C, n as w, s as T } from "../avatar-DWO_HHhB.js";
+import { t as E } from "../badge-DErMA7ul.js";
+import { l as D } from "../choice-inputs-JLtij2y4.js";
+import { o as O } from "../display-BB4BL_-K.js";
+import { t as k } from "../scroll-area-La5RXsEk.js";
+import { i as ee, n as te, r as ne, t as re, u as ie } from "../item-BvZ2DR_x.js";
+import { i as ae, r as oe, t as se } from "../tabs-eqVsJZWO.js";
+import { s as ce } from "../data-display-D4oujtx0.js";
+import { isValidElement as le, useEffect as A, useId as ue, useLayoutEffect as de, useMemo as j, useRef as M, useState as N } from "react";
+import { Fragment as fe, jsx as P, jsxs as F } from "react/jsx-runtime";
+import { ChevronLeft as pe, ChevronRight as me, Plus as he, TriangleAlert as ge } from "lucide-react";
 //#region src/components/features/appointment-calendar/appointment-calendar.types.ts
-var ge = {
+var _e = {
 	formatBooked: (e) => `${e} booked`,
 	formatConflicts: (e) => e === 1 ? "1 conflict" : `${e} conflicts`,
 	viewLabel: "View",
@@ -61,22 +63,22 @@ var ge = {
 	errorDescription: "The appointments could not be loaded.",
 	retry: "Retry",
 	formatActionsLabel: (e) => `Actions for ${e}`
-}, F = [
+}, I = [
 	"chart-1",
 	"chart-2",
 	"chart-3",
 	"chart-4",
 	"chart-5"
-], I = {
+], L = {
 	"chart-1": "bg-chart-1",
 	"chart-2": "bg-chart-2",
 	"chart-3": "bg-chart-3",
 	"chart-4": "bg-chart-4",
 	"chart-5": "bg-chart-5"
 };
-function L(e, t) {
+function ve(e, t) {
 	let n = e.findIndex((e) => e.id === t);
-	return n < 0 ? "chart-1" : e[n]?.color ?? F[n % F.length] ?? "chart-1";
+	return n < 0 ? "chart-1" : e[n]?.color ?? I[n % I.length] ?? "chart-1";
 }
 function R(e) {
 	return new Date(e.getFullYear(), e.getMonth(), e.getDate());
@@ -95,25 +97,25 @@ function H(e, t) {
 	let n = R(e);
 	return z(n, -((n.getDay() - t + 7) % 7));
 }
-function _e(e, t) {
+function ye(e, t) {
 	let n = H(e, t);
 	return Array.from({ length: 7 }, (e, t) => z(n, t));
 }
-function ve(e, t) {
+function be(e, t) {
 	let n = H(new Date(e.getFullYear(), e.getMonth(), 1), t);
 	return Array.from({ length: 6 }, (e, t) => Array.from({ length: 7 }, (e, r) => z(n, t * 7 + r)));
 }
-function ye(e, t) {
+function xe(e, t) {
 	let n = R(t).getTime(), r = z(t, 1).getTime();
 	return e.start.getTime() < r && e.end.getTime() > n;
 }
 function U(e, t) {
-	return e.filter((e) => ye(e, t)).sort((e, t) => e.start.getTime() - t.start.getTime() || e.end.getTime() - t.end.getTime());
+	return e.filter((e) => xe(e, t)).sort((e, t) => e.start.getTime() - t.start.getTime() || e.end.getTime() - t.end.getTime());
 }
-function be(e, t, n) {
+function Se(e, t, n) {
 	return e.filter((e) => (t === "all" || e.category === t) && (n === "all" || e.staff?.id === n));
 }
-function xe(e) {
+function Ce(e) {
 	let t = /* @__PURE__ */ new Map();
 	for (let n of e) {
 		if (!n.staff || n.status === "cancelled") continue;
@@ -135,15 +137,15 @@ function xe(e) {
 	}
 	return n.sort((e, t) => e.start.getTime() - t.start.getTime());
 }
-function Se(e) {
+function we(e) {
 	return new Set(e.flatMap((e) => e.appointments.map((e) => e.id)));
 }
-function Ce(e) {
+function Te(e) {
 	let t = /* @__PURE__ */ new Map();
 	for (let n of e) n.staff && !t.has(n.staff.id) && t.set(n.staff.id, n.staff);
 	return [...t.values()];
 }
-function we(e, t) {
+function Ee(e, t) {
 	let { hour12: n } = new Intl.DateTimeFormat(t, { hour: "numeric" }).resolvedOptions();
 	if (!n) return new Intl.DateTimeFormat(t, {
 		hour: "2-digit",
@@ -155,112 +157,112 @@ function we(e, t) {
 	};
 	return new Intl.DateTimeFormat(t, r).format(e);
 }
-function Te(e) {
+function W(e) {
 	return typeof e == "string" ? e : e?.name;
 }
 //#endregion
 //#region src/components/features/appointment-calendar/partials/appointment-agenda.tsx
-var W = {
+var G = {
 	confirmed: "success",
 	pending: "warning",
 	completed: "neutral",
 	cancelled: "neutral",
 	noShow: "destructive"
 };
-function G({ appointment: e, context: t }) {
-	let n = le(), i = Te(e.client), o = e.staff, { open: c, conflict: u } = t, d = t.actions.length > 0, f = [
+function De({ appointment: e, context: t }) {
+	let n = ue(), i = W(e.client), o = e.staff, { open: s, conflict: l } = t, d = t.actions.length > 0, f = [
 		`${n}-title`,
 		`${n}-status`,
 		`${n}-detail`,
 		o && `${n}-staff`
-	].filter(Boolean).join(" "), p = j(null), m = j(!1);
-	return ue(() => {
+	].filter(Boolean).join(" "), p = M(null), m = M(!1);
+	return de(() => {
 		!d && m.current && (m.current = !1, (!document.activeElement || document.activeElement === document.body) && p.current?.focus());
-	}, [d]), /* @__PURE__ */ P(ne, {
+	}, [d]), /* @__PURE__ */ F(re, {
 		variant: "outline",
 		size: "sm",
 		padding: "default",
 		"data-status": e.status,
-		"data-conflict": u ? "" : void 0,
-		className: r("appointment-agenda--row relative w-full flex-nowrap", !!c && y.rowHover, u && r(l.destructive.wash, l.destructive.edge)),
+		"data-conflict": l ? "" : void 0,
+		className: r("appointment-agenda--row relative w-full flex-nowrap", !!s && x.rowHover, l && r(u.destructive.wash, u.destructive.edge)),
 		children: [
-			!!c && /* @__PURE__ */ N("button", {
+			!!s && /* @__PURE__ */ P("button", {
 				ref: p,
 				type: "button",
 				"aria-labelledby": f,
-				onClick: c,
-				className: r("appointment-agenda--open absolute inset-0 z-0 cursor-pointer rounded-inner focus-visible:outline-none", y.nativeButtonReset, s.inset)
+				onClick: s,
+				className: r("appointment-agenda--open absolute inset-0 z-0 cursor-pointer rounded-inner focus-visible:outline-none", x.nativeButtonReset, c.inset)
 			}),
-			/* @__PURE__ */ N("span", {
+			/* @__PURE__ */ P("span", {
 				"aria-hidden": "true",
 				className: r("appointment-agenda--stripe w-1 shrink-0 self-stretch rounded-full", t.categoryColorClass)
 			}),
-			/* @__PURE__ */ P(te, {
+			/* @__PURE__ */ F(ne, {
 				className: "min-w-0",
-				children: [/* @__PURE__ */ P(re, {
+				children: [/* @__PURE__ */ F(ie, {
 					className: "flex-wrap",
-					children: [/* @__PURE__ */ N(a, {
+					children: [/* @__PURE__ */ P(a, {
 						type: "inherit",
 						id: `${n}-title`,
 						tag: "span",
 						weight: "medium",
 						className: "truncate",
 						children: e.title
-					}), /* @__PURE__ */ N(w, {
+					}), /* @__PURE__ */ P(E, {
 						id: `${n}-status`,
 						tone: t.statusTone,
 						size: "sm",
 						children: t.statusLabel
 					})]
-				}), /* @__PURE__ */ N(D, {
+				}), /* @__PURE__ */ P(ee, {
 					id: `${n}-detail`,
 					clamp: 1,
 					children: i ? `${t.time} · ${i}` : t.time
 				})]
 			}),
-			(!!o || d) && /* @__PURE__ */ P(O, {
+			(!!o || d) && /* @__PURE__ */ F(te, {
 				onFocus: () => {
 					m.current = !0;
 				},
 				onBlur: (e) => {
 					e.relatedTarget instanceof Node && !e.currentTarget.contains(e.relatedTarget) && (m.current = !1);
 				},
-				children: [!!o && /* @__PURE__ */ P(de, { children: [/* @__PURE__ */ N(E, { children: /* @__PURE__ */ N("span", {
+				children: [!!o && /* @__PURE__ */ F(fe, { children: [/* @__PURE__ */ P(O, { children: /* @__PURE__ */ P("span", {
 					id: `${n}-staff`,
 					children: o.name
-				}) }), /* @__PURE__ */ P(S, {
+				}) }), /* @__PURE__ */ F(w, {
 					size: "sm",
 					"aria-hidden": "true",
-					children: [!!o.avatarUrl && /* @__PURE__ */ N(C, {
+					children: [!!o.avatarUrl && /* @__PURE__ */ P(T, {
 						src: o.avatarUrl,
 						alt: ""
-					}), /* @__PURE__ */ N(x, { children: b(o.name) })]
+					}), /* @__PURE__ */ P(C, { children: S(o.name) })]
 				})] }), t.actionsMenu]
 			})
 		]
 	});
 }
-function Ee({ days: e, appointments: t, categories: n, conflicts: r, heading: i, loading: s, error: l, onRetry: u, locale: d, onAppointmentClick: f, appointmentActions: p, renderAppointment: h, strings: y }) {
-	let b = e.map((e) => ({
+function Oe({ days: e, appointments: t, categories: n, conflicts: r, heading: i, loading: c, error: u, onRetry: d, locale: f, onAppointmentClick: p, appointmentActions: m, renderAppointment: g, strings: v }) {
+	let x = e.map((e) => ({
 		day: e,
 		items: U(t, e)
-	})), x = b.reduce((e, t) => e + t.items.length, 0), S = new Intl.DateTimeFormat(d, {
+	})), S = x.reduce((e, t) => e + t.items.length, 0), C = new Intl.DateTimeFormat(f, {
 		weekday: "long",
 		month: "long",
 		day: "numeric"
-	}), C = e.length > 1, w = (e) => {
-		let t = r.has(e.id), i = (p?.(e) ?? []).filter((e) => e.visible !== !1), a = {
+	}), w = e.length > 1, T = (e) => {
+		let t = r.has(e.id), i = (m?.(e) ?? []).filter((e) => e.visible !== !1), a = {
 			category: n.find((t) => t.id === e.category),
-			categoryColorClass: I[L(n, e.category)],
+			categoryColorClass: L[ve(n, e.category)],
 			conflict: t,
-			statusLabel: t ? y.conflict : y.status[e.status],
-			statusTone: t ? "destructive" : W[e.status],
-			time: y.formatTimeRange(we(e.start, d), we(e.end, d)),
-			open: f ? () => f(e) : void 0,
+			statusLabel: t ? v.conflict : v.status[e.status],
+			statusTone: t ? "destructive" : G[e.status],
+			time: v.formatTimeRange(Ee(e.start, f), Ee(e.end, f)),
+			open: p ? () => p(e) : void 0,
 			actions: i,
-			actionsMenu: i.length > 0 ? /* @__PURE__ */ N(_, {
+			actionsMenu: i.length > 0 ? /* @__PURE__ */ P(y, {
 				actions: i,
-				srText: y.formatActionsLabel(e.title),
+				srText: v.formatActionsLabel(e.title),
 				buttonProps: {
 					size: "sm",
 					className: "appointment-agenda--actions relative z-10"
@@ -269,67 +271,67 @@ function Ee({ days: e, appointments: t, categories: n, conflicts: r, heading: i,
 		};
 		return {
 			...a,
-			defaultRender: () => /* @__PURE__ */ N(G, {
+			defaultRender: () => /* @__PURE__ */ P(De, {
 				appointment: e,
 				context: a
 			})
 		};
-	}, T = (e) => /* @__PURE__ */ N(c, {
-		render: /* @__PURE__ */ N("ul", {}),
+	}, E = (e) => /* @__PURE__ */ P(l, {
+		render: /* @__PURE__ */ P("ul", {}),
 		gap: "sm",
 		className: "appointment-agenda--list m-0 list-none p-0",
 		children: e.map((e) => {
-			let t = w(e);
-			return /* @__PURE__ */ N("li", {
+			let t = T(e);
+			return /* @__PURE__ */ P("li", {
 				className: "min-w-0",
-				children: h ? h(e, t) : t.defaultRender()
+				children: g ? g(e, t) : t.defaultRender()
 			}, e.id);
 		})
 	}), D;
-	return D = s ? /* @__PURE__ */ P(c, {
+	return D = c ? /* @__PURE__ */ F(l, {
 		gap: "sm",
 		"aria-busy": "true",
 		className: "appointment-agenda--loading",
-		children: [/* @__PURE__ */ N(E, { children: y.loading }), Array.from({ length: 4 }, (e, t) => /* @__PURE__ */ N(v, { className: "h-control-lg w-full rounded-inner" }, t))]
-	}) : l ? ce(l) ? l : /* @__PURE__ */ N(g, {
+		children: [/* @__PURE__ */ P(O, { children: v.loading }), Array.from({ length: 4 }, (e, t) => /* @__PURE__ */ P(b, { className: "h-control-lg w-full rounded-inner" }, t))]
+	}) : u ? le(u) ? u : /* @__PURE__ */ P(_, {
 		variant: "inline",
-		title: y.errorTitle,
-		description: l instanceof Error ? l.message : typeof l == "string" || typeof l == "number" ? String(l) : y.errorDescription,
-		onRetry: u,
-		retryLabel: y.retry,
+		title: v.errorTitle,
+		description: u instanceof Error ? u.message : typeof u == "string" || typeof u == "number" ? String(u) : v.errorDescription,
+		onRetry: d,
+		retryLabel: v.retry,
 		className: "appointment-agenda--error"
-	}) : x === 0 ? /* @__PURE__ */ N(se, {
+	}) : S === 0 ? /* @__PURE__ */ P(ce, {
 		padding: "sm",
-		title: y.empty,
+		title: v.empty,
 		description: !1,
-		ariaLabel: y.empty,
+		ariaLabel: v.empty,
 		className: "appointment-agenda--empty"
-	}) : C ? /* @__PURE__ */ N(c, {
+	}) : w ? /* @__PURE__ */ P(l, {
 		gap: "xl",
-		children: b.filter((e) => e.items.length > 0).map((e) => /* @__PURE__ */ P(c, {
-			render: /* @__PURE__ */ N("section", {}),
+		children: x.filter((e) => e.items.length > 0).map((e) => /* @__PURE__ */ F(l, {
+			render: /* @__PURE__ */ P("section", {}),
 			gap: "sm",
-			"aria-label": S.format(e.day),
+			"aria-label": C.format(e.day),
 			className: "appointment-agenda--day",
-			children: [/* @__PURE__ */ N(o, {
+			children: [/* @__PURE__ */ P(o, {
 				className: "text-inherit",
 				tag: "h3",
-				size: "sm",
-				children: S.format(e.day)
-			}), T(e.items)]
+				size: s.subsection,
+				children: C.format(e.day)
+			}), E(e.items)]
 		}, e.day.toISOString()))
-	}) : T(b[0]?.items ?? []), /* @__PURE__ */ N(m, {
+	}) : E(x[0]?.items ?? []), /* @__PURE__ */ P(h, {
 		surface: "card",
 		title: i,
-		headerEnd: /* @__PURE__ */ N(a, {
+		headerEnd: /* @__PURE__ */ P(a, {
 			size: "xs",
 			type: "secondary",
 			className: "tabular-nums",
-			children: y.formatCount(x)
+			children: v.formatCount(S)
 		}),
 		className: "appointment-agenda--component h-full min-h-0",
 		contentClassName: "min-h-0 flex-1",
-		children: /* @__PURE__ */ N(ee, {
+		children: /* @__PURE__ */ P(k, {
 			className: "appointment-agenda--scroll h-full min-h-0",
 			children: D
 		})
@@ -337,25 +339,25 @@ function Ee({ days: e, appointments: t, categories: n, conflicts: r, heading: i,
 }
 //#endregion
 //#region src/components/features/appointment-calendar/partials/appointment-month.tsx
-var De = 3;
-function Oe({ selected: e, onSelect: t, onVisibleMonthChange: n, appointments: o, categories: l, weekStartsOn: d, locale: f, strings: p }) {
-	let [m, h] = M(e), g = j(null), _ = j(!1), v = A(() => /* @__PURE__ */ new Date(), []);
-	k(() => h(e), [e]);
-	let b = m.getFullYear() * 12 + m.getMonth();
-	k(() => {
-		n?.(new Date(Math.floor(b / 12), b % 12, 1));
-	}, [b, n]), k(() => {
+var K = 3;
+function ke({ selected: e, onSelect: t, onVisibleMonthChange: n, appointments: o, categories: s, weekStartsOn: u, locale: f, strings: p }) {
+	let [m, h] = N(e), g = M(null), _ = M(!1), v = j(() => /* @__PURE__ */ new Date(), []);
+	A(() => h(e), [e]);
+	let y = m.getFullYear() * 12 + m.getMonth();
+	A(() => {
+		n?.(new Date(Math.floor(y / 12), y % 12, 1));
+	}, [y, n]), A(() => {
 		_.current && (_.current = !1, g.current?.querySelector("[data-focus-target]")?.focus());
 	}, [m]);
-	let x = A(() => ve(m, d), [m, d]), S = A(() => new Intl.DateTimeFormat(f, { month: "long" }), [f]), C = A(() => new Intl.DateTimeFormat(f, { weekday: "short" }), [f]), w = A(() => new Intl.DateTimeFormat(f, {
+	let b = j(() => be(m, u), [m, u]), S = j(() => new Intl.DateTimeFormat(f, { month: "long" }), [f]), C = j(() => new Intl.DateTimeFormat(f, { weekday: "short" }), [f]), w = j(() => new Intl.DateTimeFormat(f, {
 		weekday: "long",
 		month: "long",
 		day: "numeric",
 		year: "numeric"
-	}), [f]), E = A(() => Array.from({ length: 12 }, (e, t) => ({
+	}), [f]), T = j(() => Array.from({ length: 12 }, (e, t) => ({
 		value: String(t),
 		label: S.format(new Date(2e3, t, 1))
-	})), [S]), ee = A(() => {
+	})), [S]), E = j(() => {
 		let e = /* @__PURE__ */ new Set([v.getFullYear(), m.getFullYear()]);
 		for (let t of o) e.add(t.start.getFullYear());
 		let t = Math.min(...e) - 1, n = Math.max(...e) + 1;
@@ -367,62 +369,62 @@ function Oe({ selected: e, onSelect: t, onVisibleMonthChange: n, appointments: o
 		o,
 		m,
 		v
-	]), D = (e, n = !1) => {
+	]), O = (e, n = !1) => {
 		_.current = !0, h(e), n && t(e);
-	}, O = (n) => {
+	}, k = (n) => {
 		let r = V(e, n);
 		h(r), t(r);
 	};
-	return /* @__PURE__ */ P(c, {
+	return /* @__PURE__ */ F(l, {
 		gap: "lg",
 		className: "appointment-month--component min-w-0",
-		children: [/* @__PURE__ */ P("div", {
+		children: [/* @__PURE__ */ F("div", {
 			className: "appointment-month--header flex min-w-0 items-center gap-space-xs",
 			children: [
-				/* @__PURE__ */ N(i, {
+				/* @__PURE__ */ P(i, {
 					type: "button",
 					tone: "secondary",
 					buttonStyle: "ghost",
 					size: "sm",
 					iconOnly: !0,
 					"aria-label": p.previousMonth,
-					onClick: () => O(-1),
-					children: /* @__PURE__ */ N(fe, {
+					onClick: () => k(-1),
+					children: /* @__PURE__ */ P(pe, {
 						"aria-hidden": "true",
 						className: "size-icon"
 					})
 				}),
-				/* @__PURE__ */ N(T, {
+				/* @__PURE__ */ P(D, {
 					size: "sm",
 					"aria-label": p.monthLabel,
-					options: E,
+					options: T,
 					value: String(e.getMonth()),
-					onValueChange: (t) => t !== void 0 && O(Number(t) - e.getMonth()),
+					onValueChange: (t) => t !== void 0 && k(Number(t) - e.getMonth()),
 					className: "min-w-0 flex-1"
 				}),
-				/* @__PURE__ */ N(T, {
+				/* @__PURE__ */ P(D, {
 					size: "sm",
 					"aria-label": p.yearLabel,
-					options: ee,
+					options: E,
 					value: String(e.getFullYear()),
-					onValueChange: (t) => t !== void 0 && O((Number(t) - e.getFullYear()) * 12),
+					onValueChange: (t) => t !== void 0 && k((Number(t) - e.getFullYear()) * 12),
 					className: "min-w-0 flex-1"
 				}),
-				/* @__PURE__ */ N(i, {
+				/* @__PURE__ */ P(i, {
 					type: "button",
 					tone: "secondary",
 					buttonStyle: "ghost",
 					size: "sm",
 					iconOnly: !0,
 					"aria-label": p.nextMonth,
-					onClick: () => O(1),
-					children: /* @__PURE__ */ N(pe, {
+					onClick: () => k(1),
+					children: /* @__PURE__ */ P(me, {
 						"aria-hidden": "true",
 						className: "size-icon"
 					})
 				})
 			]
-		}), /* @__PURE__ */ P("div", {
+		}), /* @__PURE__ */ F("div", {
 			ref: g,
 			role: "grid",
 			"aria-label": `${S.format(m)} ${m.getFullYear()}`,
@@ -432,18 +434,18 @@ function Oe({ selected: e, onSelect: t, onVisibleMonthChange: n, appointments: o
 					ArrowRight: () => z(m, 1),
 					ArrowUp: () => z(m, -7),
 					ArrowDown: () => z(m, 7),
-					Home: () => H(m, d),
-					End: () => z(H(m, d), 6),
+					Home: () => H(m, u),
+					End: () => z(H(m, u), 6),
 					PageUp: () => V(m, -1),
 					PageDown: () => V(m, 1)
 				}[e.key];
-				t && (e.preventDefault(), D(t()));
+				t && (e.preventDefault(), O(t()));
 			},
 			className: "appointment-month--grid grid min-w-0 grid-cols-7 gap-space-2xs",
-			children: [/* @__PURE__ */ N("div", {
+			children: [/* @__PURE__ */ P("div", {
 				role: "row",
 				className: "contents",
-				children: x[0]?.map((e) => /* @__PURE__ */ N(a, {
+				children: b[0]?.map((e) => /* @__PURE__ */ P(a, {
 					tag: "div",
 					role: "columnheader",
 					size: "xs",
@@ -453,29 +455,29 @@ function Oe({ selected: e, onSelect: t, onVisibleMonthChange: n, appointments: o
 					className: "appointment-month--weekday py-space-xs",
 					children: C.format(e)
 				}, e.getDay()))
-			}), x.map((t) => /* @__PURE__ */ N("div", {
+			}), b.map((t) => /* @__PURE__ */ P("div", {
 				role: "row",
 				className: "contents",
 				children: t.map((t) => {
-					let n = U(o, t), i = [...new Set(n.map((e) => e.category))], a = B(t, e), c = B(t, m), d = t.getMonth() !== m.getMonth();
-					return /* @__PURE__ */ N("div", {
+					let n = U(o, t), i = [...new Set(n.map((e) => e.category))], a = B(t, e), l = B(t, m), u = t.getMonth() !== m.getMonth();
+					return /* @__PURE__ */ P("div", {
 						role: "gridcell",
 						"aria-selected": a,
 						className: "flex min-w-0 justify-center",
-						children: /* @__PURE__ */ P("button", {
+						children: /* @__PURE__ */ F("button", {
 							type: "button",
-							tabIndex: c ? 0 : -1,
-							"data-focus-target": c ? "" : void 0,
+							tabIndex: l ? 0 : -1,
+							"data-focus-target": l ? "" : void 0,
 							"data-selected": a ? "" : void 0,
-							"data-outside": d ? "" : void 0,
+							"data-outside": u ? "" : void 0,
 							"aria-current": B(t, v) ? "date" : void 0,
 							"aria-label": p.formatDayLabel(w.format(t), n.length),
-							onClick: () => D(t, !0),
-							className: r(y.nativeButtonReset, "appointment-month--day relative flex size-action flex-col items-center justify-center rounded-inner text-sm tabular-nums outline-none", s.edge, a ? "bg-primary font-semibold text-primary-foreground" : r(y.rowHover, d ? "text-muted-foreground" : "text-foreground"), !a && B(t, v) && "font-semibold"),
-							children: [t.getDate(), i.length > 0 && /* @__PURE__ */ N("span", {
+							onClick: () => O(t, !0),
+							className: r(x.nativeButtonReset, "appointment-month--day relative flex size-action flex-col items-center justify-center rounded-inner text-sm tabular-nums outline-none", c.edge, a ? "bg-primary font-semibold text-primary-foreground" : r(x.rowHover, u ? "text-muted-foreground" : "text-foreground"), !a && B(t, v) && "font-semibold"),
+							children: [t.getDate(), i.length > 0 && /* @__PURE__ */ P("span", {
 								"aria-hidden": "true",
 								className: "appointment-month--dots absolute inset-x-0 bottom-space-2xs flex justify-center gap-space-2xs",
-								children: i.slice(0, De).map((e) => /* @__PURE__ */ N("span", { className: r(u.inline, I[L(l, e)]) }, e))
+								children: i.slice(0, K).map((e) => /* @__PURE__ */ P("span", { className: r(d.inline, L[ve(s, e)]) }, e))
 							})]
 						})
 					}, t.toISOString());
@@ -486,198 +488,198 @@ function Oe({ selected: e, onSelect: t, onVisibleMonthChange: n, appointments: o
 }
 //#endregion
 //#region src/components/features/appointment-calendar/appointment-calendar.tsx
-function K(e, t, n) {
-	let [r, i] = M(t);
+function q(e, t, n) {
+	let [r, i] = N(t);
 	return [e ?? r, (t) => {
 		e === void 0 && i(t), n?.(t);
 	}];
 }
-function q({ appointments: s, categories: l, staff: g, title: _, date: v, defaultDate: y, onDateChange: b, view: x, defaultView: S = "day", onViewChange: C, category: w, defaultCategory: E = "all", onCategoryChange: ee, staffId: D, defaultStaffId: O = "all", onStaffChange: te, onAppointmentClick: ne, appointmentActions: re, renderAppointment: se, onRangeChange: ce, onCreateAppointment: le, onConflictsDismiss: ue, loading: de = !1, error: fe, onRetry: pe, weekStartsOn: F, strings: B, className: V }) {
-	let H = n(ge, B), { locale: U } = e(), Te = t(), W = F ?? Te.weekStartsOn ?? 0, [G, De] = K(v, y ?? R(/* @__PURE__ */ new Date()), b), [q, ke] = K(x, S, C), [J, Ae] = K(w, E, ee), [Y, je] = K(D, O, te), [Me, Ne] = M(""), [Pe, Fe] = M(() => new Date(G.getFullYear(), G.getMonth(), 1)), Ie = A(() => g ?? Ce(s), [g, s]), X = A(() => q === "week" ? _e(G, W) : [R(G)], [
-		q,
+function Ae({ appointments: s, categories: c, staff: u, title: _, date: y, defaultDate: b, onDateChange: x, view: S, defaultView: C = "day", onViewChange: w, category: T, defaultCategory: E = "all", onCategoryChange: O, staffId: k, defaultStaffId: ee = "all", onStaffChange: te, onAppointmentClick: ne, appointmentActions: re, renderAppointment: ie, onRangeChange: ce, onCreateAppointment: le, onConflictsDismiss: ue, loading: de = !1, error: fe, onRetry: pe, weekStartsOn: me, strings: I, className: B }) {
+	let V = n(_e, I), { locale: H } = e(), U = t(), W = me ?? U.weekStartsOn ?? 0, [G, De] = q(y, b ?? R(/* @__PURE__ */ new Date()), x), [K, Ae] = q(S, C, w), [J, je] = q(T, E, O), [Y, Me] = q(k, ee, te), [Ne, Pe] = N(""), [Fe, Ie] = N(() => new Date(G.getFullYear(), G.getMonth(), 1)), Le = j(() => u ?? Te(s), [u, s]), X = j(() => K === "week" ? ye(G, W) : [R(G)], [
+		K,
 		G,
 		W
-	]), Z = A(() => be(s, J, Y), [
+	]), Z = j(() => Se(s, J, Y), [
 		s,
 		J,
 		Y
-	]), Q = A(() => {
-		let e = [...ve(Pe, W).flat(), ...X].map((e) => e.getTime());
+	]), Q = j(() => {
+		let e = [...be(Fe, W).flat(), ...X].map((e) => e.getTime());
 		return {
 			start: new Date(Math.min(...e)),
 			end: z(new Date(Math.max(...e)), 1)
 		};
 	}, [
-		Pe,
+		Fe,
 		W,
 		X
-	]), Le = j("");
-	k(() => {
+	]), Re = M("");
+	A(() => {
 		let e = `${Q.start.getTime()}:${Q.end.getTime()}`;
-		e !== Le.current && (Le.current = e, ce?.(Q));
+		e !== Re.current && (Re.current = e, ce?.(Q));
 	}, [Q, ce]);
-	let Re = A(() => Z.filter((e) => X.some((t) => ye(e, t))), [Z, X]), $ = A(() => xe(be(s, "all", Y).filter((e) => X.some((t) => ye(e, t)))), [
+	let ze = j(() => Z.filter((e) => X.some((t) => xe(e, t))), [Z, X]), $ = j(() => Ce(Se(s, "all", Y).filter((e) => X.some((t) => xe(e, t)))), [
 		s,
 		Y,
 		X
-	]), ze = A(() => Se($), [$]), Be = Re.filter((e) => ze.has(e.id)).length, Ve = Re.filter((e) => e.status !== "cancelled").length, He = [...ze].sort().join("|"), Ue = $.length > 0 && Me !== He, We = new Intl.DateTimeFormat(U, {
+	]), Be = j(() => we($), [$]), Ve = ze.filter((e) => Be.has(e.id)).length, He = ze.filter((e) => e.status !== "cancelled").length, Ue = [...Be].sort().join("|"), We = $.length > 0 && Ne !== Ue, Ge = new Intl.DateTimeFormat(H, {
 		weekday: "long",
 		month: "long",
 		day: "numeric"
-	}), Ge = new Intl.DateTimeFormat(U, {
+	}), Ke = new Intl.DateTimeFormat(H, {
 		month: "long",
 		day: "numeric"
-	}), Ke = q === "week" ? H.formatWeekRange(Ge.format(X[0] ?? G), Ge.format(X[X.length - 1] ?? G)) : We.format(G), qe = (e) => {
-		Ne(He), ue?.(e);
+	}), qe = K === "week" ? V.formatWeekRange(Ke.format(X[0] ?? G), Ke.format(X[X.length - 1] ?? G)) : Ge.format(G), Je = (e) => {
+		Pe(Ue), ue?.(e);
 	};
-	return /* @__PURE__ */ P(c, {
+	return /* @__PURE__ */ F(l, {
 		gap: "xl",
 		"data-slot": "appointment-calendar",
-		"data-view": q,
-		className: r("appointment-calendar--component @container/appointment-calendar min-h-0 min-w-0", V),
+		"data-view": K,
+		className: r("appointment-calendar--component @container/appointment-calendar min-h-0 min-w-0", B),
 		children: [
-			/* @__PURE__ */ P("div", {
+			/* @__PURE__ */ F("div", {
 				className: "appointment-calendar--header flex min-w-0 flex-wrap items-start justify-between gap-space-lg",
-				children: [/* @__PURE__ */ P(c, {
+				children: [/* @__PURE__ */ F(l, {
 					gap: "xs",
 					className: "min-w-0",
-					children: [!!_ && /* @__PURE__ */ N(o, {
+					children: [!!_ && /* @__PURE__ */ P(o, {
 						className: "text-inherit",
 						tag: "h2",
 						size: "lg",
 						children: _
-					}), /* @__PURE__ */ P(a, {
+					}), /* @__PURE__ */ F(a, {
 						size: "xs",
 						type: "secondary",
 						className: "appointment-calendar--counts tabular-nums",
-						children: [H.formatBooked(Ve), Be > 0 && ` · ${H.formatConflicts(Be)}`]
+						children: [V.formatBooked(He), Ve > 0 && ` · ${V.formatConflicts(Ve)}`]
 					})]
-				}), /* @__PURE__ */ P("div", {
-					className: "appointment-calendar--actions flex min-w-0 flex-wrap items-center gap-space-sm",
+				}), /* @__PURE__ */ F("div", {
+					className: r("appointment-calendar--actions flex min-w-0 flex-wrap items-center", v.commands),
 					children: [
-						/* @__PURE__ */ N(oe, {
-							value: q,
-							onValueChange: (e) => (e === "day" || e === "week") && ke(e),
-							children: /* @__PURE__ */ N(ae, {
+						/* @__PURE__ */ P(se, {
+							value: K,
+							onValueChange: (e) => (e === "day" || e === "week") && Ae(e),
+							children: /* @__PURE__ */ P(oe, {
 								role: "group",
-								"aria-label": H.viewLabel,
+								"aria-label": V.viewLabel,
 								"aria-orientation": void 0,
 								activateOnFocus: !0,
-								children: ["day", "week"].map((e) => /* @__PURE__ */ N(ie, {
+								children: ["day", "week"].map((e) => /* @__PURE__ */ P(ae, {
 									value: e,
 									role: "button",
 									"aria-selected": void 0,
 									"aria-controls": void 0,
-									"aria-pressed": q === e,
-									children: H[e]
+									"aria-pressed": K === e,
+									children: V[e]
 								}, e))
 							})
 						}),
-						Ie.length > 0 && /* @__PURE__ */ N(T, {
-							"aria-label": H.staffLabel,
+						Le.length > 0 && /* @__PURE__ */ P(D, {
+							"aria-label": V.staffLabel,
 							options: [{
 								value: "all",
-								label: H.allStaff
-							}, ...Ie.map((e) => ({
+								label: V.allStaff
+							}, ...Le.map((e) => ({
 								value: e.id,
 								label: e.name
 							}))],
 							value: Y,
-							onValueChange: (e) => je(e ?? "all"),
+							onValueChange: (e) => Me(e ?? "all"),
 							className: "appointment-calendar--staff w-44"
 						}),
-						!!le && /* @__PURE__ */ P(i, {
+						!!le && /* @__PURE__ */ F(i, {
 							type: "button",
 							tone: "primary",
 							onClick: () => le(G),
 							className: "appointment-calendar--create",
-							children: [/* @__PURE__ */ N(me, {
+							children: [/* @__PURE__ */ P(he, {
 								"aria-hidden": "true",
 								className: "size-icon"
-							}), H.newAppointment]
+							}), V.newAppointment]
 						})
 					]
 				})]
 			}),
-			Ue && /* @__PURE__ */ P(p, {
+			We && /* @__PURE__ */ F(m, {
 				tone: "destructive",
 				className: "appointment-calendar--alert",
 				children: [
-					/* @__PURE__ */ N(he, { "aria-hidden": "true" }),
-					/* @__PURE__ */ N(h, { children: H.conflictTitle }),
-					/* @__PURE__ */ N(d, { children: $.map((e) => H.formatConflict(e.staff.name, e.appointments.length, we(e.start, U))).join(" ") }),
-					/* @__PURE__ */ N(f, { children: /* @__PURE__ */ N(i, {
+					/* @__PURE__ */ P(ge, { "aria-hidden": "true" }),
+					/* @__PURE__ */ P(g, { children: V.conflictTitle }),
+					/* @__PURE__ */ P(f, { children: $.map((e) => V.formatConflict(e.staff.name, e.appointments.length, Ee(e.start, H))).join(" ") }),
+					/* @__PURE__ */ P(p, { children: /* @__PURE__ */ P(i, {
 						type: "button",
 						size: "sm",
-						onClick: () => qe($),
-						children: H.dismiss
+						onClick: () => Je($),
+						children: V.dismiss
 					}) })
 				]
 			}),
-			/* @__PURE__ */ P("div", {
+			/* @__PURE__ */ F("div", {
 				className: "appointment-calendar--body grid min-h-0 min-w-0 flex-1 gap-space-xl @3xl/appointment-calendar:grid-cols-[minmax(17rem,20rem)_minmax(0,1fr)]",
-				children: [/* @__PURE__ */ N(m, {
+				children: [/* @__PURE__ */ P(h, {
 					surface: "card",
 					className: "appointment-calendar--aside min-w-0 self-start",
-					children: /* @__PURE__ */ P(c, {
+					children: /* @__PURE__ */ F(l, {
 						gap: "xl",
-						children: [/* @__PURE__ */ N(Oe, {
+						children: [/* @__PURE__ */ P(ke, {
 							selected: G,
 							onSelect: De,
-							onVisibleMonthChange: Fe,
+							onVisibleMonthChange: Ie,
 							appointments: Z,
-							categories: l,
+							categories: c,
 							weekStartsOn: W,
-							locale: U,
-							strings: H
-						}), l.length > 0 && /* @__PURE__ */ N(oe, {
+							locale: H,
+							strings: V
+						}), c.length > 0 && /* @__PURE__ */ P(se, {
 							value: J,
-							onValueChange: (e) => typeof e == "string" && Ae(e),
-							children: /* @__PURE__ */ N(ae, {
+							onValueChange: (e) => typeof e == "string" && je(e),
+							children: /* @__PURE__ */ P(oe, {
 								variant: "chips",
 								role: "group",
-								"aria-label": H.categoriesLabel,
+								"aria-label": V.categoriesLabel,
 								"aria-orientation": void 0,
 								activateOnFocus: !0,
 								children: [{
 									id: "all",
-									label: H.allCategories
-								}, ...l].map((e) => /* @__PURE__ */ P(ie, {
+									label: V.allCategories
+								}, ...c].map((e) => /* @__PURE__ */ F(ae, {
 									value: e.id,
 									role: "button",
 									"aria-selected": void 0,
 									"aria-controls": void 0,
 									"aria-pressed": J === e.id,
 									className: "appointment-calendar--category gap-space-xs",
-									children: [e.id !== "all" && /* @__PURE__ */ N("span", {
+									children: [e.id !== "all" && /* @__PURE__ */ P("span", {
 										"aria-hidden": "true",
-										className: r(u.inline, I[L(l, e.id)])
+										className: r(d.inline, L[ve(c, e.id)])
 									}), e.label]
 								}, e.id))
 							})
 						})]
 					})
-				}), /* @__PURE__ */ N(Ee, {
+				}), /* @__PURE__ */ P(Oe, {
 					days: X,
 					appointments: Z,
-					categories: l,
-					conflicts: ze,
-					heading: Ke,
+					categories: c,
+					conflicts: Be,
+					heading: qe,
 					loading: de,
 					error: fe,
 					onRetry: pe,
-					locale: U,
+					locale: H,
 					onAppointmentClick: ne,
 					appointmentActions: re,
-					renderAppointment: se,
-					strings: H
+					renderAppointment: ie,
+					strings: V
 				})]
 			})
 		]
 	});
 }
-q.displayName = "AppointmentCalendar";
+Ae.displayName = "AppointmentCalendar";
 //#endregion
-export { q as AppointmentCalendar, U as appointmentsOn, ge as defaultAppointmentCalendarStrings, be as filterAppointments, xe as findConflicts };
+export { Ae as AppointmentCalendar, U as appointmentsOn, _e as defaultAppointmentCalendarStrings, Se as filterAppointments, Ce as findConflicts };
 
 //# sourceMappingURL=appointment-calendar.js.map