@geomak/ui 6.28.0 → 6.29.1

package/dist/index.js

@@ -1,7 +1,7 @@
 import { colors_default } from './chunk-I2P4JJDB.js';
 export { colors_default as COLORS, PALETTE as palette, semanticTokens, vars } from './chunk-I2P4JJDB.js';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import React28, { createContext, useState, useEffect, useMemo, useId, useCallback, useRef, useContext, useSyncExternalStore, useLayoutEffect } from 'react';
+import React28, { createContext, useState, useEffect, useMemo, useId, useCallback, useRef, useLayoutEffect, useContext, useSyncExternalStore } from 'react';
 import { createPortal } from 'react-dom';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
@@ -470,8 +470,8 @@ function Avatar({
     if (fallback) return fallback;
     if (alt) {
       const parts = alt.trim().split(/\s+/).slice(0, 2);
-      const initials = parts.map((p) => p[0]?.toUpperCase() ?? "").join("");
-      if (initials) return initials;
+      const initials2 = parts.map((p) => p[0]?.toUpperCase() ?? "").join("");
+      if (initials2) return initials2;
     }
     return /* @__PURE__ */ jsx(PersonSilhouette, {});
   })();
@@ -2131,6 +2131,300 @@ function RotatingCarousel({
     }
   );
 }
+var FIELD_SIZE = {
+  sm: { control: "h-control-sm", text: "text-xs", padX: "px-2.5", gap: "gap-1.5" },
+  md: { control: "h-control-md", text: "text-sm", padX: "px-3", gap: "gap-2" },
+  lg: { control: "h-control-lg", text: "text-sm", padX: "px-3.5", gap: "gap-2.5" }
+};
+var FOCUS_WITHIN = "focus-within:outline-none focus-within:border-accent";
+var FOCUS_ELEMENT = "focus:outline-none focus:border-accent data-[state=open]:border-accent";
+var FOCUS_WITHIN_ERROR = "focus-within:border-status-error";
+var FOCUS_ELEMENT_ERROR = "focus:border-status-error data-[state=open]:border-status-error";
+function fieldShell({
+  size = "md",
+  hasError = false,
+  disabled = false,
+  focusWithin = false,
+  sized = true
+} = {}) {
+  const s = FIELD_SIZE[size];
+  return [
+    "w-full rounded-lg border bg-surface text-foreground",
+    "transition-[color,box-shadow,border-color] duration-150",
+    s.text,
+    sized ? `${s.control} ${s.padX}` : "",
+    // resting border
+    hasError ? "border-status-error" : "border-border",
+    // hover (only when interactive + no error)
+    disabled ? "bg-surface-raised text-foreground-muted cursor-not-allowed" : hasError ? "" : "hover:border-border-strong",
+    // focus
+    focusWithin ? FOCUS_WITHIN : FOCUS_ELEMENT,
+    hasError ? focusWithin ? FOCUS_WITHIN_ERROR : FOCUS_ELEMENT_ERROR : "",
+    // placeholder colour for native inputs
+    "placeholder:text-foreground-muted"
+  ].filter(Boolean).join(" ");
+}
+function FieldHelpIcon({ text }) {
+  return /* @__PURE__ */ jsx(Tooltip, { title: text, placement: "top", children: /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      "aria-label": "More information",
+      className: "inline-flex items-center justify-center rounded-full text-foreground-muted transition-colors hover:text-foreground focus:outline-none focus-visible:text-accent",
+      children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 16 16", className: "h-3.5 w-3.5", fill: "none", stroke: "currentColor", strokeWidth: 1.5, "aria-hidden": "true", children: [
+        /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "6.25" }),
+        /* @__PURE__ */ jsx("path", { strokeLinecap: "round", d: "M8 7.4v3.4" }),
+        /* @__PURE__ */ jsx("circle", { cx: "8", cy: "5.1", r: "0.65", fill: "currentColor", stroke: "none" })
+      ] })
+    }
+  ) });
+}
+function FieldLabel({
+  label,
+  htmlFor,
+  required,
+  helperText,
+  horizontal = false,
+  align = "start",
+  style,
+  width,
+  className = ""
+}) {
+  if (label == null && helperText == null) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: { width: horizontal ? width : void 0, ...style },
+      className: [
+        "flex items-center gap-1",
+        horizontal ? "flex-shrink-0 whitespace-nowrap" : "",
+        // Only the 'start' alignment needs the top nudge; 'center' relies
+        // on the row's items-center to line up with a short control.
+        horizontal && align === "start" ? "mt-2" : "",
+        className
+      ].filter(Boolean).join(" "),
+      children: [
+        label != null && /* @__PURE__ */ jsxs("label", { htmlFor, className: "text-sm font-medium text-foreground select-none", children: [
+          label,
+          required && /* @__PURE__ */ jsx("span", { className: "text-status-error ml-0.5", "aria-hidden": "true", children: "*" })
+        ] }),
+        helperText != null && /* @__PURE__ */ jsx(FieldHelpIcon, { text: helperText })
+      ]
+    }
+  );
+}
+function Field({
+  label,
+  htmlFor,
+  errorId,
+  errorMessage,
+  layout = "vertical",
+  required,
+  helperText,
+  labelAlign = "start",
+  labelStyle,
+  labelWidth,
+  className = "",
+  children
+}) {
+  const hasError = errorMessage != null;
+  const horizontal = layout === "horizontal";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: [
+        "flex",
+        horizontal ? `flex-row gap-3 ${labelAlign === "center" ? "items-center" : "items-start"}` : "flex-col gap-1.5",
+        className
+      ].filter(Boolean).join(" "),
+      children: [
+        /* @__PURE__ */ jsx(
+          FieldLabel,
+          {
+            label,
+            htmlFor,
+            required,
+            helperText,
+            horizontal,
+            align: labelAlign,
+            style: labelStyle,
+            width: labelWidth
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-w-0 flex-1", children: [
+          children,
+          hasError && /* @__PURE__ */ jsx("div", { id: errorId, className: "text-status-error text-xs mt-1", children: errorMessage })
+        ] })
+      ]
+    }
+  );
+}
+var toDate = (d) => d instanceof Date ? d : new Date(d);
+var timeLabel = (d) => `${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}`;
+var initials = (name) => (name ?? "").trim().split(/\s+/).slice(0, 2).map((w) => w[0]?.toUpperCase() ?? "").join("") || void 0;
+var SendIcon = () => /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", className: "h-4 w-4", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M22 2 11 13M22 2l-7 20-4-9-9-4 20-7z" }) });
+var ArrowDown = () => /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", className: "h-4 w-4", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 5v14M5 12l7 7 7-7" }) });
+function TypingDots() {
+  return /* @__PURE__ */ jsx("span", { className: "inline-flex items-center gap-1", "aria-hidden": "true", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 animate-bounce rounded-full bg-foreground-muted", style: { animationDelay: `${i * 0.15}s` } }, i)) });
+}
+function Chat({
+  messages,
+  currentUserId,
+  onSend,
+  typingNames = [],
+  title,
+  subtitle,
+  avatar,
+  headerActions,
+  placeholder = "Write a message\u2026",
+  disabled = false,
+  hideComposer = false,
+  emptyState,
+  height = 480,
+  className = "",
+  style
+}) {
+  const listRef = useRef(null);
+  const atBottomRef = useRef(true);
+  const [showJump, setShowJump] = useState(false);
+  const [draft, setDraft] = useState("");
+  const taRef = useRef(null);
+  const hasHeader = title != null || subtitle != null || avatar != null || headerActions != null;
+  const isTyping = typingNames.length > 0;
+  const scrollToBottom = useCallback((smooth = true) => {
+    const el = listRef.current;
+    if (!el) return;
+    if (typeof el.scrollTo === "function") el.scrollTo({ top: el.scrollHeight, behavior: smooth ? "smooth" : "auto" });
+    else el.scrollTop = el.scrollHeight;
+  }, []);
+  const onScroll = () => {
+    const el = listRef.current;
+    if (!el) return;
+    const near = el.scrollHeight - el.scrollTop - el.clientHeight < 80;
+    atBottomRef.current = near;
+    setShowJump(!near);
+  };
+  useEffect(() => {
+    if (atBottomRef.current) scrollToBottom(messages.length > 0);
+  }, [messages.length, isTyping]);
+  useEffect(() => {
+    scrollToBottom(false);
+  }, [scrollToBottom]);
+  useLayoutEffect(() => {
+    const ta = taRef.current;
+    if (!ta) return;
+    ta.style.height = "auto";
+    ta.style.height = `${Math.min(ta.scrollHeight, 120)}px`;
+  }, [draft]);
+  const send = () => {
+    const text = draft.trim();
+    if (!text || disabled) return;
+    onSend?.(text);
+    setDraft("");
+  };
+  const onKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      send();
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: ["flex flex-col overflow-hidden rounded-xl border border-border bg-surface", className].filter(Boolean).join(" "),
+      style: { height, ...style },
+      children: [
+        hasHeader && /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-center gap-3 border-b border-border px-4 py-3", children: [
+          avatar != null && /* @__PURE__ */ jsx(Avatar, { src: avatar, alt: typeof title === "string" ? title : "Conversation", size: "sm" }),
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            title != null && /* @__PURE__ */ jsx("div", { className: "truncate text-sm font-semibold text-foreground", children: title }),
+            subtitle != null && /* @__PURE__ */ jsx("div", { className: "truncate text-xs text-foreground-muted", children: subtitle })
+          ] }),
+          headerActions != null && /* @__PURE__ */ jsx("div", { className: "flex flex-shrink-0 items-center gap-1", children: headerActions })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "relative flex-1 overflow-hidden", children: [
+          /* @__PURE__ */ jsxs("div", { ref: listRef, onScroll, className: "flex h-full flex-col gap-1 overflow-y-auto bg-background px-4 py-3", children: [
+            messages.length === 0 && !isTyping ? /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center text-center text-sm text-foreground-muted", children: emptyState ?? "No messages yet. Say hello \u{1F44B}" }) : messages.map((m, i) => {
+              const own = m.authorId === currentUserId;
+              const prev = messages[i - 1];
+              const next = messages[i + 1];
+              const firstOfGroup = !prev || prev.authorId !== m.authorId;
+              const lastOfGroup = !next || next.authorId !== m.authorId;
+              const ts = m.timestamp ? toDate(m.timestamp) : null;
+              return /* @__PURE__ */ jsxs("div", { className: ["flex items-end gap-2", own ? "flex-row-reverse" : "", firstOfGroup ? "mt-2 first:mt-0" : ""].filter(Boolean).join(" "), children: [
+                !own && /* @__PURE__ */ jsx("div", { className: "w-7 flex-shrink-0", children: lastOfGroup && /* @__PURE__ */ jsx(Avatar, { src: m.avatar, alt: m.authorName ?? "User", fallback: initials(m.authorName), size: "xs" }) }),
+                /* @__PURE__ */ jsxs("div", { className: ["flex max-w-[78%] flex-col", own ? "items-end" : "items-start"].join(" "), children: [
+                  firstOfGroup && !own && m.authorName && /* @__PURE__ */ jsx("span", { className: "mb-0.5 px-1 text-[11px] font-medium text-foreground-muted", children: m.authorName }),
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: [
+                        "whitespace-pre-wrap break-words px-3 py-1.5 text-sm leading-snug",
+                        own ? "rounded-2xl bg-accent text-accent-fg" : "rounded-2xl border border-border bg-surface text-foreground",
+                        lastOfGroup ? own ? "rounded-br-md" : "rounded-bl-md" : ""
+                      ].filter(Boolean).join(" "),
+                      children: m.text
+                    }
+                  ),
+                  lastOfGroup && (ts || own && m.status) && /* @__PURE__ */ jsxs("span", { className: "mt-0.5 px-1 text-[10px] text-foreground-muted", children: [
+                    ts && timeLabel(ts),
+                    own && m.status && /* @__PURE__ */ jsxs("span", { className: "ml-1 capitalize", children: [
+                      "\xB7 ",
+                      m.status
+                    ] })
+                  ] })
+                ] })
+              ] }, m.id);
+            }),
+            isTyping && /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-end gap-2", children: [
+              /* @__PURE__ */ jsx("div", { className: "w-7 flex-shrink-0" }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 rounded-2xl rounded-bl-md border border-border bg-surface px-3 py-2", children: [
+                /* @__PURE__ */ jsx(TypingDots, {}),
+                /* @__PURE__ */ jsx("span", { className: "text-[11px] text-foreground-muted", children: typingNames.length === 1 ? `${typingNames[0]} is typing` : `${typingNames.length} people are typing` })
+              ] })
+            ] })
+          ] }),
+          showJump && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => scrollToBottom(true),
+              "aria-label": "Jump to latest",
+              className: "absolute bottom-3 left-1/2 flex h-8 w-8 -translate-x-1/2 items-center justify-center rounded-full border border-border bg-surface text-foreground-secondary shadow-md transition-colors hover:bg-surface-raised hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
+              children: /* @__PURE__ */ jsx(ArrowDown, {})
+            }
+          )
+        ] }),
+        !hideComposer && /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-end gap-2 border-t border-border p-3", children: [
+          /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              ref: taRef,
+              rows: 1,
+              value: draft,
+              disabled,
+              placeholder,
+              onChange: (e) => setDraft(e.target.value),
+              onKeyDown,
+              "aria-label": "Message",
+              className: `${fieldShell({ size: "md", hasError: false, disabled, sized: false })} max-h-[120px] flex-1 resize-none px-3 py-2 leading-snug`
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              type: "primary",
+              icon: /* @__PURE__ */ jsx(SendIcon, {}),
+              title: "Send",
+              disabled: disabled || draft.trim().length === 0,
+              onClick: send
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
 var VALUE_SIZE = {
   sm: "text-xl",
   md: "text-3xl",
@@ -2142,7 +2436,7 @@ var TONE2 = {
   neutral: "text-foreground-muted"
 };
 var ArrowUp = /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.2, "aria-hidden": "true", className: "h-3.5 w-3.5", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 19V5M5 12l7-7 7 7" }) });
-var ArrowDown = /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.2, "aria-hidden": "true", className: "h-3.5 w-3.5", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 5v14M5 12l7 7 7-7" }) });
+var ArrowDown2 = /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.2, "aria-hidden": "true", className: "h-3.5 w-3.5", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 5v14M5 12l7 7 7-7" }) });
 function Statistic({
   label,
   value,
@@ -2174,7 +2468,7 @@ function Statistic({
             suffix && /* @__PURE__ */ jsx("span", { className: "text-foreground-muted text-[0.5em] font-medium self-center", children: suffix })
           ] }),
           delta && /* @__PURE__ */ jsxs("div", { className: `mt-1.5 flex items-center gap-1 text-sm font-medium ${align === "center" ? "justify-center" : ""} ${TONE2[deltaTone]}`, children: [
-            dir === "up" ? ArrowUp : dir === "down" ? ArrowDown : null,
+            dir === "up" ? ArrowUp : dir === "down" ? ArrowDown2 : null,
             /* @__PURE__ */ jsx("span", { children: delta.value }),
             delta.label && /* @__PURE__ */ jsx("span", { className: "text-foreground-muted font-normal", children: delta.label })
           ] }),
@@ -2492,253 +2786,6 @@ function LogoutTimer({
     ] })
   ] }) });
 }
-var WEEKDAYS = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
-var MONTHS = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
-var startOfDay = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
-var sameDay = (a, b) => a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-var addMonths = (d, n) => new Date(d.getFullYear(), d.getMonth() + n, 1);
-function buildGrid(month, weekStartsOn) {
-  const first = new Date(month.getFullYear(), month.getMonth(), 1);
-  const offset = (first.getDay() - weekStartsOn + 7) % 7;
-  const start = new Date(first);
-  start.setDate(first.getDate() - offset);
-  return Array.from({ length: 42 }, (_, i) => {
-    const d = new Date(start);
-    d.setDate(start.getDate() + i);
-    return d;
-  });
-}
-var NavIcon = ({ dir }) => /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", className: "h-4 w-4", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: dir === "left" ? "M15 19l-7-7 7-7" : "M9 5l7 7-7 7" }) });
-function Calendar2({
-  value,
-  onChange,
-  month,
-  defaultMonth,
-  onMonthChange,
-  events,
-  min,
-  max,
-  weekStartsOn = 0,
-  className = "",
-  style
-}) {
-  const today = useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
-  const [internalMonth, setInternalMonth] = useState(() => month ?? defaultMonth ?? value ?? today);
-  const visible = month ?? internalMonth;
-  const setMonth = (next) => {
-    onMonthChange?.(next);
-    if (month === void 0) setInternalMonth(next);
-  };
-  const grid = useMemo(() => buildGrid(visible, weekStartsOn), [visible, weekStartsOn]);
-  const weekdays = useMemo(() => Array.from({ length: 7 }, (_, i) => WEEKDAYS[(i + weekStartsOn) % 7]), [weekStartsOn]);
-  const eventsByDay = useMemo(() => {
-    const map = /* @__PURE__ */ new Map();
-    for (const ev of events ?? []) {
-      const key = startOfDay(ev.date).toDateString();
-      const arr = map.get(key) ?? [];
-      arr.push(ev);
-      map.set(key, arr);
-    }
-    return map;
-  }, [events]);
-  const disabled = (d) => min && d < startOfDay(min) || max && d > startOfDay(max);
-  return /* @__PURE__ */ jsxs("div", { className: ["inline-block rounded-lg border border-border bg-surface p-3 select-none", className].filter(Boolean).join(" "), style, children: [
-    /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center justify-between px-1", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          "aria-label": "Previous month",
-          onClick: () => setMonth(addMonths(visible, -1)),
-          className: "flex h-7 w-7 items-center justify-center rounded-md text-foreground-secondary hover:bg-surface-raised hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
-          children: /* @__PURE__ */ jsx(NavIcon, { dir: "left" })
-        }
-      ),
-      /* @__PURE__ */ jsxs("div", { className: "text-sm font-semibold text-foreground", "aria-live": "polite", children: [
-        MONTHS[visible.getMonth()],
-        " ",
-        visible.getFullYear()
-      ] }),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          "aria-label": "Next month",
-          onClick: () => setMonth(addMonths(visible, 1)),
-          className: "flex h-7 w-7 items-center justify-center rounded-md text-foreground-secondary hover:bg-surface-raised hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
-          children: /* @__PURE__ */ jsx(NavIcon, { dir: "right" })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-7 mb-1", children: weekdays.map((w) => /* @__PURE__ */ jsx("div", { className: "text-center text-[11px] font-medium uppercase tracking-wide text-foreground-muted py-1", children: w }, w)) }),
-    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-7 gap-0.5", role: "grid", children: grid.map((d, i) => {
-      const inMonth = d.getMonth() === visible.getMonth();
-      const isSelected = value != null && sameDay(d, value);
-      const isToday2 = sameDay(d, today);
-      const isDisabled = disabled(d);
-      const dayEvents = eventsByDay.get(d.toDateString()) ?? [];
-      return /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          role: "gridcell",
-          "aria-selected": isSelected,
-          "aria-current": isToday2 ? "date" : void 0,
-          disabled: isDisabled,
-          onClick: () => onChange?.(startOfDay(d)),
-          className: [
-            "relative flex h-9 w-9 flex-col items-center justify-center rounded-md text-sm transition-colors",
-            "focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
-            isSelected ? "bg-accent text-accent-fg font-semibold" : inMonth ? "text-foreground hover:bg-surface-raised" : "text-foreground-muted hover:bg-surface-raised",
-            isDisabled ? "opacity-40 cursor-not-allowed hover:bg-transparent" : "",
-            !isSelected && isToday2 ? "ring-1 ring-inset ring-accent/60" : ""
-          ].filter(Boolean).join(" "),
-          children: [
-            /* @__PURE__ */ jsx("span", { className: "leading-none", children: d.getDate() }),
-            dayEvents.length > 0 && /* @__PURE__ */ jsx("span", { className: "absolute bottom-1 flex gap-0.5", children: dayEvents.slice(0, 3).map((ev, j) => /* @__PURE__ */ jsx(
-              "span",
-              {
-                title: ev.label,
-                className: "h-1 w-1 rounded-full",
-                style: { backgroundColor: ev.color ?? (isSelected ? "var(--color-accent-fg)" : "var(--color-accent)") }
-              },
-              j
-            )) })
-          ]
-        },
-        i
-      );
-    }) })
-  ] });
-}
-var FIELD_SIZE = {
-  sm: { control: "h-control-sm", text: "text-xs", padX: "px-2.5", gap: "gap-1.5" },
-  md: { control: "h-control-md", text: "text-sm", padX: "px-3", gap: "gap-2" },
-  lg: { control: "h-control-lg", text: "text-sm", padX: "px-3.5", gap: "gap-2.5" }
-};
-var FOCUS_WITHIN = "focus-within:outline-none focus-within:border-accent";
-var FOCUS_ELEMENT = "focus:outline-none focus:border-accent data-[state=open]:border-accent";
-var FOCUS_WITHIN_ERROR = "focus-within:border-status-error";
-var FOCUS_ELEMENT_ERROR = "focus:border-status-error data-[state=open]:border-status-error";
-function fieldShell({
-  size = "md",
-  hasError = false,
-  disabled = false,
-  focusWithin = false,
-  sized = true
-} = {}) {
-  const s = FIELD_SIZE[size];
-  return [
-    "w-full rounded-lg border bg-surface text-foreground",
-    "transition-[color,box-shadow,border-color] duration-150",
-    s.text,
-    sized ? `${s.control} ${s.padX}` : "",
-    // resting border
-    hasError ? "border-status-error" : "border-border",
-    // hover (only when interactive + no error)
-    disabled ? "bg-surface-raised text-foreground-muted cursor-not-allowed" : hasError ? "" : "hover:border-border-strong",
-    // focus
-    focusWithin ? FOCUS_WITHIN : FOCUS_ELEMENT,
-    hasError ? focusWithin ? FOCUS_WITHIN_ERROR : FOCUS_ELEMENT_ERROR : "",
-    // placeholder colour for native inputs
-    "placeholder:text-foreground-muted"
-  ].filter(Boolean).join(" ");
-}
-function FieldHelpIcon({ text }) {
-  return /* @__PURE__ */ jsx(Tooltip, { title: text, placement: "top", children: /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      "aria-label": "More information",
-      className: "inline-flex items-center justify-center rounded-full text-foreground-muted transition-colors hover:text-foreground focus:outline-none focus-visible:text-accent",
-      children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 16 16", className: "h-3.5 w-3.5", fill: "none", stroke: "currentColor", strokeWidth: 1.5, "aria-hidden": "true", children: [
-        /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "6.25" }),
-        /* @__PURE__ */ jsx("path", { strokeLinecap: "round", d: "M8 7.4v3.4" }),
-        /* @__PURE__ */ jsx("circle", { cx: "8", cy: "5.1", r: "0.65", fill: "currentColor", stroke: "none" })
-      ] })
-    }
-  ) });
-}
-function FieldLabel({
-  label,
-  htmlFor,
-  required,
-  helperText,
-  horizontal = false,
-  align = "start",
-  style,
-  width,
-  className = ""
-}) {
-  if (label == null && helperText == null) return null;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      style: { width: horizontal ? width : void 0, ...style },
-      className: [
-        "flex items-center gap-1",
-        horizontal ? "flex-shrink-0 whitespace-nowrap" : "",
-        // Only the 'start' alignment needs the top nudge; 'center' relies
-        // on the row's items-center to line up with a short control.
-        horizontal && align === "start" ? "mt-2" : "",
-        className
-      ].filter(Boolean).join(" "),
-      children: [
-        label != null && /* @__PURE__ */ jsxs("label", { htmlFor, className: "text-sm font-medium text-foreground select-none", children: [
-          label,
-          required && /* @__PURE__ */ jsx("span", { className: "text-status-error ml-0.5", "aria-hidden": "true", children: "*" })
-        ] }),
-        helperText != null && /* @__PURE__ */ jsx(FieldHelpIcon, { text: helperText })
-      ]
-    }
-  );
-}
-function Field({
-  label,
-  htmlFor,
-  errorId,
-  errorMessage,
-  layout = "vertical",
-  required,
-  helperText,
-  labelAlign = "start",
-  labelStyle,
-  labelWidth,
-  className = "",
-  children
-}) {
-  const hasError = errorMessage != null;
-  const horizontal = layout === "horizontal";
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: [
-        "flex",
-        horizontal ? `flex-row gap-3 ${labelAlign === "center" ? "items-center" : "items-start"}` : "flex-col gap-1.5",
-        className
-      ].filter(Boolean).join(" "),
-      children: [
-        /* @__PURE__ */ jsx(
-          FieldLabel,
-          {
-            label,
-            htmlFor,
-            required,
-            helperText,
-            horizontal,
-            align: labelAlign,
-            style: labelStyle,
-            width: labelWidth
-          }
-        ),
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-w-0 flex-1", children: [
-          children,
-          hasError && /* @__PURE__ */ jsx("div", { id: errorId, className: "text-status-error text-xs mt-1", children: errorMessage })
-        ] })
-      ]
-    }
-  );
-}
 var SIZE5 = {
   sm: { h: "h-control-sm", text: "text-xs", pad: "px-2.5" },
   md: { h: "h-control-md", text: "text-sm", pad: "px-3.5" },
@@ -2837,7 +2884,7 @@ function SegmentedControl({
 }
 
 // src/components/core/scheduler.utils.ts
-var MONTHS2 = [
+var MONTHS = [
   "January",
   "February",
   "March",
@@ -2851,23 +2898,23 @@ var MONTHS2 = [
   "November",
   "December"
 ];
-var MONTHS_SHORT = MONTHS2.map((m) => m.slice(0, 3));
-var WEEKDAYS2 = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
-var toDate = (d) => d instanceof Date ? d : new Date(d);
-var startOfDay2 = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
+var MONTHS_SHORT = MONTHS.map((m) => m.slice(0, 3));
+var WEEKDAYS = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+var toDate2 = (d) => d instanceof Date ? d : new Date(d);
+var startOfDay = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
 var addDays = (d, n) => {
   const x = new Date(d);
   x.setDate(x.getDate() + n);
   return x;
 };
-var addMonths2 = (d, n) => new Date(d.getFullYear(), d.getMonth() + n, 1);
-var sameDay2 = (a, b) => a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-var isToday = (d) => sameDay2(d, /* @__PURE__ */ new Date());
+var addMonths = (d, n) => new Date(d.getFullYear(), d.getMonth() + n, 1);
+var sameDay = (a, b) => a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+var isToday = (d) => sameDay(d, /* @__PURE__ */ new Date());
 var isSameMonth = (a, b) => a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();
 var startOfMonth = (d) => new Date(d.getFullYear(), d.getMonth(), 1);
 var endOfMonth = (d) => new Date(d.getFullYear(), d.getMonth() + 1, 0);
 var startOfWeek = (d, weekStartsOn) => {
-  const x = startOfDay2(d);
+  const x = startOfDay(d);
   const diff = (x.getDay() - weekStartsOn + 7) % 7;
   return addDays(x, -diff);
 };
@@ -2887,12 +2934,12 @@ var weekRange = (cursor, weekStartsOn) => {
   const from = startOfWeek(cursor, weekStartsOn);
   return { from, to: addDays(from, 6) };
 };
-var weekdayLabels = (weekStartsOn) => Array.from({ length: 7 }, (_, i) => WEEKDAYS2[(i + weekStartsOn) % 7]);
-var monthYearLabel = (d) => `${MONTHS2[d.getMonth()]} ${d.getFullYear()}`;
+var weekdayLabels = (weekStartsOn) => Array.from({ length: 7 }, (_, i) => WEEKDAYS[(i + weekStartsOn) % 7]);
+var monthYearLabel = (d) => `${MONTHS[d.getMonth()]} ${d.getFullYear()}`;
 var weekLabel = (cursor, weekStartsOn) => {
   const from = startOfWeek(cursor, weekStartsOn);
   const to = addDays(from, 6);
-  const m = (d) => MONTHS2[d.getMonth()].slice(0, 3);
+  const m = (d) => MONTHS[d.getMonth()].slice(0, 3);
   if (from.getMonth() === to.getMonth()) {
     return `${m(from)} ${from.getDate()} \u2013 ${to.getDate()}, ${to.getFullYear()}`;
   }
@@ -2901,10 +2948,10 @@ var weekLabel = (cursor, weekStartsOn) => {
 };
 var minutesIntoDay = (d) => d.getHours() * 60 + d.getMinutes();
 var hourLabel = (hour) => `${String(hour).padStart(2, "0")}:00`;
-var timeLabel = (d) => `${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}`;
+var timeLabel2 = (d) => `${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}`;
 var normalize = (e) => {
-  const start = toDate(e.start);
-  const end = e.end ? toDate(e.end) : new Date(start.getTime() + 36e5);
+  const start = toDate2(e.start);
+  const end = e.end ? toDate2(e.end) : new Date(start.getTime() + 36e5);
   return { ...e, start, end };
 };
 var Spinner2 = () => /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", className: "h-5 w-5 animate-spin text-accent", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.755 10.059a7.5 7.5 0 0112.548-3.364l1.903 1.903h-3.183a.75.75 0 100 1.5h4.992a.75.75 0 00.75-.75V4.356a.75.75 0 00-1.5 0v3.18l-1.9-1.9A9 9 0 003.306 9.67a.75.75 0 101.45.388zm15.408 3.352a.75.75 0 00-.919.53 7.5 7.5 0 01-12.548 3.364l-1.902-1.903h3.183a.75.75 0 000-1.5H2.984a.75.75 0 00-.75.75v4.992a.75.75 0 001.5 0v-3.18l1.9 1.9a9 9 0 0015.059-4.035.75.75 0 00-.53-.918z" }) });
@@ -2968,7 +3015,7 @@ function Scheduler({
   );
   const go = useCallback((delta) => {
     setDir(delta);
-    setCursor((c) => view === "month" ? addMonths2(c, delta) : addDays(c, delta * 7));
+    setCursor((c) => view === "month" ? addMonths(c, delta) : addDays(c, delta * 7));
   }, [view]);
   const goToday = useCallback(() => {
     setDir(0);
@@ -3151,7 +3198,7 @@ function MonthView({
     /* @__PURE__ */ jsx("div", { className: "grid grid-cols-7 border-b border-border", children: labels.map((l) => /* @__PURE__ */ jsx("div", { className: "px-2 py-1.5 text-center text-[11px] font-medium uppercase tracking-wide text-foreground-muted", children: l }, l)) }),
     /* @__PURE__ */ jsx("div", { className: "grid flex-1 grid-cols-7 grid-rows-6", children: grid.map((day, i) => {
       const inMonth = isSameMonth(day, cursor);
-      const dayEvents = events.filter((e) => sameDay2(e.start, day));
+      const dayEvents = events.filter((e) => sameDay(e.start, day));
       const today = isToday(day);
       return /* @__PURE__ */ jsxs(
         "button",
@@ -3201,7 +3248,7 @@ function EventChip({ event, onSelect }) {
         e.stopPropagation();
         onSelect?.(event);
       },
-      title: `${event.title} \xB7 ${timeLabel(event.start)}`,
+      title: `${event.title} \xB7 ${timeLabel2(event.start)}`,
       className: "flex items-center gap-1.5 truncate rounded px-1 py-0.5 text-left text-[11px] font-medium text-foreground hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
       children: [
         /* @__PURE__ */ jsx("span", { className: "h-2 w-2 flex-shrink-0 rounded-full", style: { backgroundColor: color } }),
@@ -3240,7 +3287,7 @@ function WeekView({
     /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "grid", style: { gridTemplateColumns: `3.5rem repeat(7, 1fr)`, height: gridHeight }, children: [
       /* @__PURE__ */ jsx("div", { className: "relative border-r border-border", children: hours.map((h, i) => /* @__PURE__ */ jsx("div", { className: "absolute right-1 -translate-y-1/2 text-[10px] tabular-nums text-foreground-muted", style: { top: i * hourHeight }, children: i === 0 ? "" : hourLabel(h) }, h)) }),
       days.map((day) => {
-        const dayEvents = events.filter((e) => sameDay2(e.start, day) && !e.allDay);
+        const dayEvents = events.filter((e) => sameDay(e.start, day) && !e.allDay);
         return /* @__PURE__ */ jsxs("div", { className: "relative border-r border-border last:border-r-0", children: [
           hours.map((h, i) => /* @__PURE__ */ jsx(
             "button",
@@ -3266,7 +3313,7 @@ function WeekView({
                   ev.stopPropagation();
                   onSelectEvent?.(e);
                 },
-                title: `${e.title} \xB7 ${timeLabel(e.start)}\u2013${timeLabel(e.end)}`,
+                title: `${e.title} \xB7 ${timeLabel2(e.start)}\u2013${timeLabel2(e.end)}`,
                 className: "absolute left-0.5 right-0.5 overflow-hidden rounded-md border px-1.5 py-0.5 text-left text-[11px] leading-tight text-foreground shadow-sm transition-shadow hover:shadow-md focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
                 style: {
                   top: Math.max(0, top),
@@ -3276,7 +3323,7 @@ function WeekView({
                 },
                 children: [
                   /* @__PURE__ */ jsx("div", { className: "truncate font-medium", children: e.title }),
-                  /* @__PURE__ */ jsx("div", { className: "truncate", style: { color }, children: timeLabel(e.start) })
+                  /* @__PURE__ */ jsx("div", { className: "truncate", style: { color }, children: timeLabel2(e.start) })
                 ]
               },
               e.id
@@ -5478,7 +5525,7 @@ function Pagination({
   }, [serverSide, options.perPage, picker]);
   const currentOpt = picker.find((o) => o.key === displayPerPageKey);
   const currentPerPageLabel = currentOpt?.label ?? currentOpt?.value ?? options.perPage ?? "";
-  const navBtn = (icon, disabled, onClick, title) => /* @__PURE__ */ jsx(Button_default, { variant: "outline", size: "sm", disabled, onClick, icon, className: "w-7 !px-0 focus-visible:!ring-offset-0", "aria-label": title, title });
+  const navBtn = (icon, disabled, onClick, title) => /* @__PURE__ */ jsx(Button_default, { variant: "outline", size: "sm", disabled, onClick, icon, className: "w-7 !px-0 focus-visible:!ring-[3px] focus-visible:!ring-focus-ring focus-visible:!ring-offset-0", "aria-label": title, title });
   const chevronRight = /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, className: "h-4 w-4", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" }) });
   const doubleChevronRight = /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, className: "h-4 w-4", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M13 5l7 7-7 7M5 5l7 7-7 7" }) });
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-end gap-x-4 gap-y-3", children: [
@@ -5490,7 +5537,7 @@ function Pagination({
           variant: "outline",
           size: "sm",
           side: "top",
-          className: "focus-visible:!ring-offset-0",
+          className: "focus-visible:!ring-[3px] focus-visible:!ring-focus-ring focus-visible:!ring-offset-0",
           label: String(currentPerPageLabel),
           items: picker.map((o) => ({
             key: o.key,
@@ -7825,7 +7872,7 @@ function addDays2(d, n) {
   c.setDate(c.getDate() + n);
   return c;
 }
-function addMonths3(d, n) {
+function addMonths2(d, n) {
   const c = new Date(d);
   c.setMonth(c.getMonth() + n);
   return c;
@@ -7836,7 +7883,7 @@ function defaultFormat3(d) {
   const day = d.getDate().toString().padStart(2, "0");
   return `${y}-${m}-${day}`;
 }
-function buildGrid2(viewMonth, weekStartsOn) {
+function buildGrid(viewMonth, weekStartsOn) {
   const first = startOfMonth2(viewMonth);
   const startOffset = (first.getDay() - weekStartsOn + 7) % 7;
   const gridStart = addDays2(first, -startOffset);
@@ -7893,7 +7940,7 @@ function DatePicker({
     const ordered = WEEKDAY_SHORT.slice(weekStartsOn).concat(WEEKDAY_SHORT.slice(0, weekStartsOn));
     return ordered;
   }, [weekStartsOn]);
-  const grid = useMemo(() => buildGrid2(viewMonth, weekStartsOn), [viewMonth, weekStartsOn]);
+  const grid = useMemo(() => buildGrid(viewMonth, weekStartsOn), [viewMonth, weekStartsOn]);
   const isDisabled = (d) => {
     if (min && d < min) return true;
     if (max && d > max) return true;
@@ -7924,14 +7971,14 @@ function DatePicker({
       next(7);
     } else if (e.key === "PageUp") {
       e.preventDefault();
-      const nm = addMonths3(viewMonth, -1);
+      const nm = addMonths2(viewMonth, -1);
       setViewMonth(nm);
-      setFocusDate((d) => addMonths3(d, -1));
+      setFocusDate((d) => addMonths2(d, -1));
     } else if (e.key === "PageDown") {
       e.preventDefault();
-      const nm = addMonths3(viewMonth, 1);
+      const nm = addMonths2(viewMonth, 1);
       setViewMonth(nm);
-      setFocusDate((d) => addMonths3(d, 1));
+      setFocusDate((d) => addMonths2(d, 1));
     } else if (e.key === "Home") {
       e.preventDefault();
       const dow = (focusDate.getDay() - weekStartsOn + 7) % 7;
@@ -7996,7 +8043,7 @@ function DatePicker({
                   {
                     type: "button",
                     onClick: () => {
-                      if (view === "days") setViewMonth(addMonths3(viewMonth, -1));
+                      if (view === "days") setViewMonth(addMonths2(viewMonth, -1));
                       else if (view === "months") setViewMonth(new Date(viewMonth.getFullYear() - 1, viewMonth.getMonth(), 1));
                       else setViewMonth(new Date(viewMonth.getFullYear() - 10, viewMonth.getMonth(), 1));
                     },
@@ -8031,7 +8078,7 @@ function DatePicker({
                   {
                     type: "button",
                     onClick: () => {
-                      if (view === "days") setViewMonth(addMonths3(viewMonth, 1));
+                      if (view === "days") setViewMonth(addMonths2(viewMonth, 1));
                       else if (view === "months") setViewMonth(new Date(viewMonth.getFullYear() + 1, viewMonth.getMonth(), 1));
                       else setViewMonth(new Date(viewMonth.getFullYear() + 10, viewMonth.getMonth(), 1));
                     },
@@ -8817,16 +8864,16 @@ function TimePicker({
 var MONTH_NAMES2 = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
 var WEEKDAY = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
 var startOfMonth3 = (d) => new Date(d.getFullYear(), d.getMonth(), 1);
-var addMonths4 = (d, n) => new Date(d.getFullYear(), d.getMonth() + n, 1);
+var addMonths3 = (d, n) => new Date(d.getFullYear(), d.getMonth() + n, 1);
 var addDays3 = (d, n) => {
   const c = new Date(d);
   c.setDate(c.getDate() + n);
   return c;
 };
 var isSameDay2 = (a, b) => a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-var startOfDay3 = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
+var startOfDay2 = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
 var defaultFmt = (d) => `${d.getFullYear()}-${`${d.getMonth() + 1}`.padStart(2, "0")}-${`${d.getDate()}`.padStart(2, "0")}`;
-function buildGrid3(viewMonth, weekStartsOn) {
+function buildGrid2(viewMonth, weekStartsOn) {
   const first = startOfMonth3(viewMonth);
   const offset = (first.getDay() - weekStartsOn + 7) % 7;
   const gridStart = addDays3(first, -offset);
@@ -8865,13 +8912,13 @@ function DateRangePicker({
     () => WEEKDAY.slice(weekStartsOn).concat(WEEKDAY.slice(0, weekStartsOn)),
     [weekStartsOn]
   );
-  const isDisabled = (d) => min && d < startOfDay3(min) || max && d > startOfDay3(max);
+  const isDisabled = (d) => min && d < startOfDay2(min) || max && d > startOfDay2(max);
   const effective = pendingStart ? { start: pendingStart, end: hoverDate } : value;
   const inRange = (d) => {
     const { start, end } = effective;
     if (!start || !end) return false;
     const [a, b] = start <= end ? [start, end] : [end, start];
-    return d >= startOfDay3(a) && d <= startOfDay3(b);
+    return d >= startOfDay2(a) && d <= startOfDay2(b);
   };
   const onDayClick = (d) => {
     if (isDisabled(d)) return;
@@ -8889,7 +8936,7 @@ function DateRangePicker({
   };
   const triggerText = value.start && value.end ? `${format(value.start)} \u2013 ${format(value.end)}` : value.start ? `${format(value.start)} \u2013 \u2026` : "";
   const renderMonth = (viewMonth) => {
-    const cells = buildGrid3(viewMonth, weekStartsOn);
+    const cells = buildGrid2(viewMonth, weekStartsOn);
     return /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsxs("div", { className: "text-sm font-semibold text-center mb-2 select-none", children: [
         MONTH_NAMES2[viewMonth.getMonth()],
@@ -8978,7 +9025,7 @@ function DateRangePicker({
                 "button",
                 {
                   type: "button",
-                  onClick: () => setLeftMonth(addMonths4(leftMonth, -1)),
+                  onClick: () => setLeftMonth(addMonths3(leftMonth, -1)),
                   "aria-label": "Previous month",
                   className: "absolute -top-1 left-0 w-7 h-7 inline-flex items-center justify-center rounded-md hover:bg-surface-raised focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
                   children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, className: "w-4 h-4", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 19l-7-7 7-7" }) })
@@ -8991,13 +9038,13 @@ function DateRangePicker({
                 "button",
                 {
                   type: "button",
-                  onClick: () => setLeftMonth(addMonths4(leftMonth, 1)),
+                  onClick: () => setLeftMonth(addMonths3(leftMonth, 1)),
                   "aria-label": "Next month",
                   className: "absolute -top-1 right-0 w-7 h-7 inline-flex items-center justify-center rounded-md hover:bg-surface-raised focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
                   children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, className: "w-4 h-4", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" }) })
                 }
               ),
-              renderMonth(addMonths4(leftMonth, 1))
+              renderMonth(addMonths3(leftMonth, 1))
             ] })
           ] })
         ]
@@ -9236,6 +9283,6 @@ function useJwt(token) {
   return { payload: decoded.payload, header: decoded.header, expiresAt, isExpired, isValid, raw: token ?? null };
 }
 
-export { Accordion_default as Accordion, AppShell, AutoComplete, Avatar, Badge, Box, Breadcrumbs, Button_default as Button, CARD_BRANDS, Calendar2 as Calendar, Card_default as Card, CardCarousel, Cart, CartButton, CartProvider, Catalog, CatalogCarousel, CatalogGrid, Checkbox, Checkout, ColorPicker, ContextMenu, CreditCardForm, DateRangePicker, Drawer, Dropdown, EmptyCart, FAB, FadingBase, Field, FieldHelpIcon, FieldLabel, FileInput, Flex, Form, FormContext, FormField, FormStore, Grid2 as Grid, GridCard, icons_default as Icon, IconButton, Kbd, List2 as List, LoadingSpinner, LogoutTimer, MegaMenu_default as MegaMenu, MenuButton, Modal, NotificationProvider, NumberInput, OpaqueGridCard, OtpInput, Password, PopConfirm, Portal, RadioGroup, Rating, ScalableContainer, Scheduler, SearchInput_default as SearchInput, SecureLayout, SegmentedControl, Sidebar, SkeletonBox, SkeletonCard, SkeletonCircle, SkeletonText, Slider, Statistic, Stepper, Switch, Table, Tabs_default as Tabs, TagsInput, DatePicker as Temporal, TextArea, TextInput, ThemeProvider, ThemeSwitch, TimePicker, Timeline, Tooltip, TooltipProvider, TopBar, Tree, TreeSelect, Typography, Wizard, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useBreakpoint, useCart, useFieldArray, useForm, useFormField, useFormStore, useJwt, useLocalStorage, useMediaQuery, useNotification };
+export { Accordion_default as Accordion, AppShell, AutoComplete, Avatar, Badge, Box, Breadcrumbs, Button_default as Button, CARD_BRANDS, Card_default as Card, CardCarousel, Cart, CartButton, CartProvider, Catalog, CatalogCarousel, CatalogGrid, Chat, Checkbox, Checkout, ColorPicker, ContextMenu, CreditCardForm, DateRangePicker, Drawer, Dropdown, EmptyCart, FAB, FadingBase, Field, FieldHelpIcon, FieldLabel, FileInput, Flex, Form, FormContext, FormField, FormStore, Grid2 as Grid, GridCard, icons_default as Icon, IconButton, Kbd, List2 as List, LoadingSpinner, LogoutTimer, MegaMenu_default as MegaMenu, MenuButton, Modal, NotificationProvider, NumberInput, OpaqueGridCard, OtpInput, Password, PopConfirm, Portal, RadioGroup, Rating, ScalableContainer, Scheduler, SearchInput_default as SearchInput, SecureLayout, SegmentedControl, Sidebar, SkeletonBox, SkeletonCard, SkeletonCircle, SkeletonText, Slider, Statistic, Stepper, Switch, Table, Tabs_default as Tabs, TagsInput, DatePicker as Temporal, TextArea, TextInput, ThemeProvider, ThemeSwitch, TimePicker, Timeline, Tooltip, TooltipProvider, TopBar, Tree, TreeSelect, Typography, Wizard, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useBreakpoint, useCart, useFieldArray, useForm, useFormField, useFormStore, useJwt, useLocalStorage, useMediaQuery, useNotification };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map