@50arms/ui 0.0.0-stage → 35.1.0

package/dist/components/calendar/CalendarTimeGrid.js

@@ -0,0 +1,430 @@
+import { jsxs as h, jsx as a, Fragment as ue } from "react/jsx-runtime";
+import { useRef as te, useState as we, useMemo as $, useEffect as re, useCallback as Ne } from "react";
+import { tv as $e } from "tailwind-variants";
+import { cn as v } from "../../lib/cn.js";
+import { packLanes as ke } from "../../lib/calendar/lane-packer.js";
+import { packBand as De } from "../../lib/calendar/band-packer.js";
+import { daySlots as oe, allDayBandSegment as Ce, timedBandSegment as ae, timeSegments as Se } from "../../lib/calendar/segments.js";
+import { zoneLabel as Le, weekdayName as Ie, dayNumber as Be, eventLabel as ne, timeOfDay as ie, longDate as Ee } from "./format.js";
+import { paletteFor as le } from "./palette.js";
+import { useNow as Pe } from "./use-now.js";
+import { useCalendarDrag as Re } from "./use-calendar-drag.js";
+import { EventActions as Ke } from "./EventActions.js";
+import { useEventKeyboard as Te } from "./use-event-keyboard.js";
+import { Popover as Ge } from "../Popover.js";
+import { attachEdgeAutoScroll as Oe } from "../../lib/dnd/autoscroll.js";
+import { fractionOf as k } from "../../lib/calendar/drag.js";
+import { useUiLocale as _e, useUiStrings as je } from "../../lib/i18n/provider.js";
+import { isoDateString as A } from "../../lib/time/types.js";
+import { startOfDay as F, dayFraction as se, nextDay as Ae } from "../../lib/time/zone.js";
+import { isSameDate as de } from "../../lib/time/plain.js";
+const Fe = $e({
+  slots: {
+    /* `relative` is what makes `overflow-hidden` true for the grid's
+       out-of-flow contents — the live-region announcements are `sr-only`,
+       which is `position: absolute`, and an unpositioned clipper is not in
+       their containing-block chain. See `scripts/probe-containment.mjs`. */
+    root: "relative flex min-w-0 flex-col overflow-hidden rounded-xl border border-border bg-surface",
+    header: "flex shrink-0 flex-col border-b border-border-subtle bg-surface",
+    headerRow: "flex",
+    gutter: "shrink-0 border-r border-border-subtle",
+    dayHead: [
+      "flex min-w-0 flex-1 flex-col items-center gap-0.5 py-2",
+      "transition-[var(--tx-colors)] duration-(--dur-fast) ease-hover"
+    ],
+    dayName: "text-2xs font-semibold tracking-widest text-tertiary uppercase",
+    dayDigit: [
+      "grid size-7 place-items-center rounded-full text-sm tabular-nums",
+      "transition-[var(--tx-colors)] duration-(--dur-fast) ease-hover"
+    ],
+    zoneLabel: "flex h-full items-end justify-end pr-1.5 pb-1 text-2xs text-tertiary tabular-nums",
+    allDayRow: "flex border-t border-border-subtle",
+    allDayLabel: "shrink-0 border-r border-border-subtle pt-1 pr-1.5 text-right text-2xs text-tertiary",
+    allDayLanes: "relative min-w-0 flex-1 overflow-y-auto py-1",
+    scroller: "relative flex min-h-0 flex-1 overflow-y-auto",
+    railLabel: "relative -top-1.5 pr-1.5 text-right text-2xs text-tertiary tabular-nums",
+    columns: "relative flex min-w-0 flex-1",
+    column: "relative min-w-0 flex-1 border-r border-border-subtle last:border-r-0",
+    event: [
+      "absolute flex flex-col overflow-hidden rounded-md px-1.5 py-0.5 text-left",
+      "text-2xs leading-tight",
+      "transition-[var(--tx-colors)] duration-(--dur-fast) ease-hover",
+      "focus-visible:z-30 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-(--focus-ring)",
+      /* TOUCH-ACTION PAN-Y, not none. The column scrolls vertically and a chip
+         fills most of it, so `none` would make the grid unscrollable by finger
+         — the long-press dwell is what distinguishes a drag from a scroll, and
+         the non-passive touchmove guard in the gesture takes the pan back once
+         the press has proved itself. */
+      "touch-pan-y select-none"
+    ],
+    bandBar: [
+      "absolute flex h-6 items-center gap-1 overflow-hidden rounded-sm px-1.5 text-left",
+      "text-2xs leading-none whitespace-nowrap",
+      "transition-[var(--tx-colors)] duration-(--dur-fast) ease-hover",
+      "focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-(--focus-ring)"
+    ],
+    /* RESIZE HANDLES. clamp(10px, 20px, 50%) so a 15-minute event still has a
+       clickable BODY — a handle that covers the whole chip means the event can
+       be resized but never moved. Hit area only; the visual cue is the cursor. */
+    resizeHandle: "absolute inset-x-0 z-10 h-[clamp(10px,20px,50%)] cursor-ns-resize",
+    ghost: [
+      "pointer-events-none absolute z-30 rounded-md border-2 border-dashed border-accent",
+      "bg-accent-subtle/60"
+    ],
+    nowLine: "pointer-events-none absolute right-0 left-0 z-20 h-px bg-danger",
+    nowDot: "absolute -top-1 -left-1 size-2 rounded-full bg-danger"
+  }
+}), L = 56, H = 26, ce = 24;
+function He({
+  enabled: o,
+  actions: r,
+  children: x
+}) {
+  return o ? /* @__PURE__ */ a(Ge, { side: "right", align: "start", trigger: x, children: r }) : /* @__PURE__ */ a(ue, { children: x });
+}
+function ct({
+  days: o,
+  zone: r,
+  events: x,
+  today: M,
+  onSelectEvent: U,
+  slotMinutes: D = 60,
+  slotHeightPx: I = 48,
+  scrollToHour: X = 8,
+  maxAllDayRows: B = 3,
+  maxLanes: W,
+  overlapMode: V = "cascade",
+  nowInstant: me,
+  snapMinutes: E = 15,
+  onEventChange: w,
+  onCreate: P,
+  onAnnounce: q,
+  eventActions: fe = !0,
+  renderEvent: J,
+  className: he,
+  label: pe
+}) {
+  const b = _e(), g = je().calendar, n = Fe(), R = te(null), Q = te([]), [be, Y] = we(""), C = Pe({ fixed: me }), xe = $(
+    () => o.length > 0 ? oe(r, o[0], D) : [],
+    [o, r, D]
+  ), u = $(() => o.reduce(
+    (t, l) => Math.max(t, oe(r, l, D).length),
+    1
+  ) * I, [o, r, D, I]), S = $(() => {
+    const e = [];
+    for (const s of x)
+      if (s.allDay) {
+        const c = Ce(o, s);
+        c && e.push(c);
+      } else {
+        const c = ae(r, o, s);
+        c && c.endColumn > c.startColumn && e.push(c);
+      }
+    const t = e.map((s, c) => ({
+      key: `${s.event.id}:${c}`,
+      startColumn: s.startColumn,
+      endColumn: s.endColumn,
+      priority: s.event.allDay ? 0 : 1
+    })), l = De(t, { columns: o.length, maxRows: B }), f = new Map(t.map((s, c) => [s.key, e[c]]));
+    return {
+      placed: l.placed.map((s) => ({ ...f.get(s.key), row: s.row })),
+      hidden: l.hidden.length,
+      rows: l.rows
+    };
+  }, [o, x, r, B]), ge = $(() => {
+    const e = ce / Math.max(1, u);
+    return o.map((t, l) => {
+      const f = [];
+      for (const d of x) {
+        if (d.allDay) continue;
+        const p = ae(r, o, d);
+        p && p.endColumn > p.startColumn || f.push(...Se(r, [t], d));
+      }
+      const s = f.map((d, p) => ({
+        key: `${d.event.id}:${p}`,
+        start: d.top,
+        end: d.bottom
+      })), c = ke(s, { mode: V, minSpan: e, maxLanes: W, minWidth: 0.16 }), m = new Map(s.map((d, p) => [d.key, f[p]]));
+      return {
+        day: t,
+        dayIndex: l,
+        events: c.map((d) => ({
+          ...m.get(d.key),
+          placement: d
+        }))
+      };
+    });
+  }, [o, x, r, V, W, u]), ve = o.map(A).join(","), K = $(() => {
+    if (o.length === 0) return null;
+    const e = o[0], t = F(r, e) + X * 36e5;
+    return Math.max(0, Math.min(1, se(r, e, t))) * u;
+  }, [ve, r, X, u]);
+  re(() => {
+    const e = R.current;
+    !e || K === null || (e.scrollTop = K);
+  }, [K]);
+  const ye = Ne(() => {
+    const e = [];
+    for (let t = 0; t < o.length; t++) {
+      const l = Q.current[t];
+      if (!l) continue;
+      const f = l.getBoundingClientRect();
+      e.push({ day: o[t], left: f.left, right: f.right, top: f.top, bottom: f.bottom });
+    }
+    return e;
+  }, [o]), i = Re({
+    zone: r,
+    days: o,
+    snapMinutes: E,
+    measure: ye,
+    disabled: !w,
+    onCommit: (e, t) => w?.(e, t),
+    onCreate: P ? (e) => P({ start: e.start, endExclusive: e.endExclusive }) : void 0,
+    onAnnounce: (e) => {
+      Y(e), q?.(e);
+    }
+  }), T = Te({
+    zone: r,
+    snapMinutes: E,
+    days: o,
+    onCommit: (e, t) => w?.(e, t),
+    onAnnounce: (e) => {
+      Y(e), q?.(e);
+    }
+  });
+  re(() => {
+    if (!(!i.draft && !i.creating || !R.current))
+      return Oe({ getPoint: i.getPoint, onScrolled: i.onScrolled });
+  }, [i.draft, i.creating, i.getPoint, i.onScrolled]);
+  const G = o.findIndex((e) => {
+    const t = F(r, e);
+    return C >= t && C < F(r, Ae(e));
+  }), O = G >= 0 ? se(r, o[G], C) : -1;
+  return /* @__PURE__ */ h("div", { className: v(n.root(), he), "aria-label": pe ?? g.timeGrid.label, children: [
+    /* @__PURE__ */ h("div", { className: n.header(), children: [
+      /* @__PURE__ */ h("div", { className: n.headerRow(), children: [
+        /* @__PURE__ */ a("div", { className: n.gutter(), style: { width: L }, children: /* @__PURE__ */ a("div", { className: n.zoneLabel(), children: Le(r, C, b) }) }),
+        o.map((e) => {
+          const t = M ? de(e, M) : !1;
+          return /* @__PURE__ */ h("div", { className: n.dayHead(), children: [
+            /* @__PURE__ */ a("span", { className: n.dayName(), children: Ie(e, "short", b) }),
+            /* @__PURE__ */ a(
+              "span",
+              {
+                className: v(
+                  n.dayDigit(),
+                  t ? "bg-accent font-semibold text-accent-contrast" : "text-primary"
+                ),
+                children: Be(e, b)
+              }
+            )
+          ] }, A(e));
+        })
+      ] }),
+      (S.placed.length > 0 || S.hidden > 0) && /* @__PURE__ */ h("div", { className: n.allDayRow(), children: [
+        /* @__PURE__ */ a("div", { className: n.allDayLabel(), style: { width: L }, children: g.timeGrid.allDay }),
+        /* @__PURE__ */ a(
+          "div",
+          {
+            className: n.allDayLanes(),
+            style: { maxHeight: B * H + 8 },
+            children: /* @__PURE__ */ a("div", { style: { height: Math.max(1, S.rows) * H }, children: S.placed.map((e) => {
+              const t = e.endColumn - e.startColumn + 1, l = le(e.event.paletteKey);
+              return /* @__PURE__ */ a(
+                "button",
+                {
+                  type: "button",
+                  className: v(
+                    n.bandBar(),
+                    !e.isStart && "rounded-l-none",
+                    !e.isEnd && "rounded-r-none"
+                  ),
+                  "aria-label": ne(e.event, r, g.colors[l.key], b, g),
+                  style: {
+                    top: e.row * H,
+                    left: `calc(${e.startColumn} / ${o.length} * 100% + 2px)`,
+                    width: `calc(${t} / ${o.length} * 100% - 4px)`,
+                    background: l.fill,
+                    color: l.text,
+                    borderLeft: e.isStart ? `3px solid ${l.edge}` : void 0,
+                    boxShadow: `inset 0 0 0 1px ${l.edge}`
+                  },
+                  onClick: () => U?.(e.event),
+                  children: e.event.title
+                },
+                `${e.event.id}:${e.row}:${e.startColumn}`
+              );
+            }) })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ a("div", { className: "sr-only", role: "status", "aria-live": "assertive", "aria-atomic": "true", children: be }),
+    /* @__PURE__ */ h("div", { className: n.scroller(), ref: R, children: [
+      /* @__PURE__ */ a(
+        "div",
+        {
+          className: n.gutter(),
+          style: { width: L, height: u },
+          "aria-hidden": "true",
+          children: xe.map((e, t) => /* @__PURE__ */ a(
+            "div",
+            {
+              className: n.railLabel(),
+              style: { position: "absolute", top: e.fraction * u, width: L },
+              children: t === 0 ? "" : ie(e.instant, r, b, e.minute !== 0)
+            },
+            `${e.instant}:${t}`
+          ))
+        }
+      ),
+      /* @__PURE__ */ h("div", { className: n.columns(), style: { height: u }, children: [
+        /* @__PURE__ */ a(
+          "div",
+          {
+            "aria-hidden": "true",
+            className: "pointer-events-none absolute inset-0",
+            style: {
+              backgroundImage: `repeating-linear-gradient(to bottom, var(--border-subtle) 0 1px, transparent 1px ${I}px)`
+            }
+          }
+        ),
+        ge.map((e) => /* @__PURE__ */ h(
+          "div",
+          {
+            className: n.column(),
+            ref: (t) => {
+              Q.current[e.dayIndex] = t;
+            },
+            children: [
+              P && /* @__PURE__ */ a(
+                "div",
+                {
+                  "aria-hidden": "true",
+                  className: "absolute inset-0 z-0",
+                  ref: i.bindCanvas()
+                }
+              ),
+              /* @__PURE__ */ h(
+                "ul",
+                {
+                  className: "contents",
+                  "aria-label": g.timeGrid.eventsOn(Ee(e.day, b)),
+                  children: [
+                    e.events.map(({ event: t, top: l, bottom: f, isStart: s, isEnd: c, placement: m }) => {
+                      const d = le(t.paletteKey), p = T.preview(i.preview(t)), Z = T.grabbedId === t.id, N = i.draft?.id === t.id || Z, _ = N ? k(r, e.day, p.start) : m.start, z = N ? k(r, e.day, p.endExclusive) : m.end, ee = (f - l) * u < 30, y = !!w && t.editable !== !1;
+                      return /* @__PURE__ */ h("li", { className: "contents", children: [
+                        /* @__PURE__ */ a(
+                          He,
+                          {
+                            enabled: y && fe,
+                            actions: /* @__PURE__ */ a(
+                              Ke,
+                              {
+                                event: t,
+                                zone: r,
+                                days: o,
+                                snapMinutes: E,
+                                onApply: (j) => w?.(t, j)
+                              }
+                            ),
+                            children: /* @__PURE__ */ a(
+                              "button",
+                              {
+                                type: "button",
+                                className: v(
+                                  n.event(),
+                                  ee && "flex-row items-center gap-1",
+                                  y && "cursor-grab",
+                                  N && "z-40 cursor-grabbing shadow-lg",
+                                  /* A REFUSED RESIZE IS SHOWN, not silently ignored. The
+                                     user is still holding the pointer and needs to know
+                                     the gesture will not take. */
+                                  N && i.invalid && "opacity-50 ring-2 ring-danger",
+                                  !s && "rounded-t-none",
+                                  !c && "rounded-b-none"
+                                ),
+                                "aria-label": ne(t, r, g.colors[d.key], b, g),
+                                ref: y ? i.bindEvent(t, "move") : void 0,
+                                "data-dragging": N ? "" : void 0,
+                                style: {
+                                  top: _ * u,
+                                  height: Math.max(ce, (z - _) * u),
+                                  left: `calc(${m.left * 100}% + 1px)`,
+                                  width: `calc(${m.width * 100}% - 2px)`,
+                                  zIndex: 10 + m.zIndex,
+                                  background: d.fill,
+                                  color: d.text,
+                                  borderLeft: `3px solid ${d.edge}`,
+                                  /* A 1px rim on any lane past the first is what stops a
+                                     cascade becoming mush — the overlapping chips need
+                                     an edge to read against each other. */
+                                  boxShadow: m.column > 0 ? `inset 0 0 0 1px ${d.edge}` : void 0
+                                },
+                                onClick: () => U?.(t),
+                                onKeyDown: y ? (j) => T.onKeyDown(t, j) : void 0,
+                                "data-grabbed": Z ? "" : void 0,
+                                children: J ? J(t) : /* @__PURE__ */ h(ue, { children: [
+                                  /* @__PURE__ */ a("span", { className: "truncate font-medium", children: t.title }),
+                                  /* @__PURE__ */ a("span", { className: v("truncate opacity-80", ee && "shrink-0"), children: ie(t.start, r, b) })
+                                ] })
+                              }
+                            )
+                          }
+                        ),
+                        y && s && /* @__PURE__ */ a(
+                          "span",
+                          {
+                            "aria-hidden": "true",
+                            className: v(n.resizeHandle(), "top-0"),
+                            style: { top: _ * u, left: `calc(${m.left * 100}% + 1px)`, width: `calc(${m.width * 100}% - 2px)`, position: "absolute", zIndex: 20 + m.zIndex },
+                            ref: i.bindEvent(t, "resize-start")
+                          }
+                        ),
+                        y && c && /* @__PURE__ */ a(
+                          "span",
+                          {
+                            "aria-hidden": "true",
+                            className: v(n.resizeHandle()),
+                            style: { top: z * u - 20, left: `calc(${m.left * 100}% + 1px)`, width: `calc(${m.width * 100}% - 2px)`, position: "absolute", zIndex: 20 + m.zIndex },
+                            ref: i.bindEvent(t, "resize-end")
+                          }
+                        )
+                      ] }, `${t.id}:${m.column}`);
+                    }),
+                    i.creating && de(i.creating.day, e.day) && /* @__PURE__ */ a("li", { "aria-hidden": "true", className: "contents", children: /* @__PURE__ */ a(
+                      "span",
+                      {
+                        className: n.ghost(),
+                        style: {
+                          top: k(r, e.day, i.creating.start) * u,
+                          height: (k(r, e.day, i.creating.endExclusive) - k(r, e.day, i.creating.start)) * u,
+                          left: 2,
+                          right: 2
+                        }
+                      }
+                    ) })
+                  ]
+                }
+              ),
+              G === e.dayIndex && O >= 0 && O <= 1 && /* @__PURE__ */ a(
+                "div",
+                {
+                  className: n.nowLine(),
+                  style: { top: O * u },
+                  "aria-hidden": "true",
+                  children: /* @__PURE__ */ a("span", { className: n.nowDot() })
+                }
+              )
+            ]
+          },
+          A(e.day)
+        ))
+      ] })
+    ] })
+  ] });
+}
+export {
+  ct as CalendarTimeGrid
+};
+//# sourceMappingURL=CalendarTimeGrid.js.map

package/dist/components/calendar/CalendarTimeGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarTimeGrid.js","sources":["../../../src/components/calendar/CalendarTimeGrid.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState, type ReactNode } from \"react\";\nimport { tv } from \"tailwind-variants\";\nimport { cn } from \"@/lib/cn\";\nimport {\n  dayFraction,\n  isSameDate,\n  isoDateString,\n  nextDay,\n  startOfDay,\n  type PlainDate,\n  type TimeZone,\n} from \"@/lib/time\";\nimport { packLanes, type LaneInput } from \"@/lib/calendar/lane-packer\";\nimport { packBand, type BandInput } from \"@/lib/calendar/band-packer\";\nimport {\n  allDayBandSegment,\n  daySlots,\n  timeSegments,\n  timedBandSegment,\n  type BandSegment,\n  type TimeSegment,\n} from \"@/lib/calendar/segments\";\nimport type { CalendarEvent, TimedEvent } from \"@/lib/calendar/types\";\nimport { dayNumber, eventLabel, longDate, timeOfDay, weekdayName, zoneLabel } from \"./format\";\nimport { paletteFor } from \"./palette\";\nimport { useUiLocale, useUiStrings } from \"@/lib/i18n\";\nimport { useNow } from \"./use-now\";\nimport { useCalendarDrag } from \"./use-calendar-drag\";\nimport { EventActions } from \"./EventActions\";\nimport { useEventKeyboard } from \"./use-event-keyboard\";\nimport { Popover } from \"@/components/Popover\";\nimport { attachEdgeAutoScroll } from \"@/lib/dnd/autoscroll\";\nimport { fractionOf, type ColumnRect } from \"@/lib/calendar/drag\";\nimport type { Instant } from \"@/lib/time\";\n\n/* ============================================================================\n   THE TIME GRID — Day and Week are the same component with a different number\n   of columns.\n\n   IT IS NOT A GRID, AND THE OBVIOUS ARIA IS WRONG. An event spans six\n   15-minute cells; overlapping events stack in sub-columns that have no row or\n   column meaning; and the chips are absolutely positioned OUTSIDE any row,\n   which breaks `role=\"grid\"`'s required children outright. `aria-owns` is the\n   usual escape and has poor real-world support. FullCalendar rejected\n   `role=\"grid\"` here deliberately and ships `role=\"table\"`; its ticket is still\n   open.\n\n   So: THE RAILS ARE PRESENTATIONAL AND `aria-hidden`, and the accessible form\n   of a day is an ORDERED LIST of its events, each carrying its own time as\n   text. That is not a compromise — it is where every credible implementation\n   lands, and it is the one shape a screen-reader user can actually work\n   through. The MONTH view is a real grid and is treated as one; these two are\n   not, and pretending otherwise buys nothing.\n\n   VERTICAL POSITION IS A FRACTION OF THE DAY'S REAL LENGTH. Never\n   `hour * rowHeight`. The whole time layer exists so this file can divide, and\n   the payoff is that a 23-hour day compresses and a 25-hour day stretches with\n   no branch anywhere in this file.\n   ========================================================================= */\n\nconst grid = tv({\n  slots: {\n    /* `relative` is what makes `overflow-hidden` true for the grid's\n       out-of-flow contents — the live-region announcements are `sr-only`,\n       which is `position: absolute`, and an unpositioned clipper is not in\n       their containing-block chain. See `scripts/probe-containment.mjs`. */\n    root: \"relative flex min-w-0 flex-col overflow-hidden rounded-xl border border-border bg-surface\",\n    header: \"flex shrink-0 flex-col border-b border-border-subtle bg-surface\",\n    headerRow: \"flex\",\n    gutter: \"shrink-0 border-r border-border-subtle\",\n    dayHead: [\n      \"flex min-w-0 flex-1 flex-col items-center gap-0.5 py-2\",\n      \"transition-[var(--tx-colors)] duration-(--dur-fast) ease-hover\",\n    ],\n    dayName: \"text-2xs font-semibold tracking-widest text-tertiary uppercase\",\n    dayDigit: [\n      \"grid size-7 place-items-center rounded-full text-sm tabular-nums\",\n      \"transition-[var(--tx-colors)] duration-(--dur-fast) ease-hover\",\n    ],\n    zoneLabel: \"flex h-full items-end justify-end pr-1.5 pb-1 text-2xs text-tertiary tabular-nums\",\n    allDayRow: \"flex border-t border-border-subtle\",\n    allDayLabel: \"shrink-0 border-r border-border-subtle pt-1 pr-1.5 text-right text-2xs text-tertiary\",\n    allDayLanes: \"relative min-w-0 flex-1 overflow-y-auto py-1\",\n    scroller: \"relative flex min-h-0 flex-1 overflow-y-auto\",\n    railLabel: \"relative -top-1.5 pr-1.5 text-right text-2xs text-tertiary tabular-nums\",\n    columns: \"relative flex min-w-0 flex-1\",\n    column: \"relative min-w-0 flex-1 border-r border-border-subtle last:border-r-0\",\n    event: [\n      \"absolute flex flex-col overflow-hidden rounded-md px-1.5 py-0.5 text-left\",\n      \"text-2xs leading-tight\",\n      \"transition-[var(--tx-colors)] duration-(--dur-fast) ease-hover\",\n      \"focus-visible:z-30 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-(--focus-ring)\",\n      /* TOUCH-ACTION PAN-Y, not none. The column scrolls vertically and a chip\n         fills most of it, so `none` would make the grid unscrollable by finger\n         — the long-press dwell is what distinguishes a drag from a scroll, and\n         the non-passive touchmove guard in the gesture takes the pan back once\n         the press has proved itself. */\n      \"touch-pan-y select-none\",\n    ],\n    bandBar: [\n      \"absolute flex h-6 items-center gap-1 overflow-hidden rounded-sm px-1.5 text-left\",\n      \"text-2xs leading-none whitespace-nowrap\",\n      \"transition-[var(--tx-colors)] duration-(--dur-fast) ease-hover\",\n      \"focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-(--focus-ring)\",\n    ],\n    /* RESIZE HANDLES. clamp(10px, 20px, 50%) so a 15-minute event still has a\n       clickable BODY — a handle that covers the whole chip means the event can\n       be resized but never moved. Hit area only; the visual cue is the cursor. */\n    resizeHandle: \"absolute inset-x-0 z-10 h-[clamp(10px,20px,50%)] cursor-ns-resize\",\n    ghost: [\n      \"pointer-events-none absolute z-30 rounded-md border-2 border-dashed border-accent\",\n      \"bg-accent-subtle/60\",\n    ],\n    nowLine: \"pointer-events-none absolute right-0 left-0 z-20 h-px bg-danger\",\n    nowDot: \"absolute -top-1 -left-1 size-2 rounded-full bg-danger\",\n  },\n});\n\n/** Gutter width, and the all-day band's row pitch. Shared with the packers. */\nconst GUTTER_PX = 56;\nconst BAND_ROW_PX = 26;\n\n/**\n * A 24px chip on a 26px pitch, expressed as a fraction of the column.\n *\n * The lane packer works in fractions and must not learn what a pixel is, so the\n * caller converts. 24px of a 1440px column is the floor a five-minute event is\n * inflated to — below it the chip is unclickable, and SC 2.5.8 asks for 24.\n */\nconst MIN_EVENT_PX = 24;\n\nexport interface CalendarTimeGridProps {\n  /** The days to show. One for Day view, seven for Week. */\n  days: readonly PlainDate[];\n  zone: TimeZone;\n  events: readonly CalendarEvent[];\n  today?: PlainDate;\n  onSelectEvent?: (event: CalendarEvent) => void;\n  /** Minutes per rail. 60 by default — see `snapMinutes` for why they differ. */\n  slotMinutes?: number;\n  /** Pixel height of one rail. The column's total height is derived from it. */\n  slotHeightPx?: number;\n  /**\n   * Hour the grid scrolls to on load. 8 by default.\n   *\n   * Applied on the RANGE's identity, not on every render. react-big-calendar\n   * re-runs its scroll effect on render, so selecting an event snaps the user\n   * back to 8am — an open issue, and a genuinely maddening one.\n   */\n  scrollToHour?: number;\n  /**\n   * Rows the all-day band may show before it scrolls internally.\n   *\n   * REQUIRED TO BE FINITE. An uncapped band eats the container and makes the\n   * time grid unreachable — an open FullCalendar bug, and react-big-calendar's\n   * default is literally `Infinity`.\n   */\n  maxAllDayRows?: number;\n  /** Most lanes a batch of overlapping events may divide into. */\n  maxLanes?: number;\n  /** `cascade` is the Google look and the default. */\n  overlapMode?: \"cascade\" | \"split\";\n  /** Fix the now-indicator for a screenshot. */\n  nowInstant?: number;\n  /**\n   * Minutes a drag snaps to. DELIBERATELY INDEPENDENT of `slotMinutes`.\n   *\n   * FullCalendar, react-big-calendar and Schedule-X all couple snap to the rail\n   * spacing; Google and Mobiscroll do not, and Google is 15-minute snap on\n   * 60-minute rails — the combination that feels right. Retrofitting the split\n   * is a rewrite, so the two are separate values.\n   */\n  snapMinutes?: number;\n  /** Commit a move or a resize. Omit to make the grid read-only. */\n  onEventChange?: (event: CalendarEvent, next: CalendarEvent) => void;\n  /** Commit a drag-to-create. Omit to disable creating. */\n  onCreate?: (range: { start: Instant; endExclusive: Instant }) => void;\n  /** Announcements for the live region. The grid renders its own if omitted. */\n  onAnnounce?: (message: string) => void;\n  /**\n   * Whether clicking an editable event opens the move/resize action menu.\n   *\n   * ON BY DEFAULT WHEN THE GRID IS EDITABLE, AND TURNING IT OFF FAILS WCAG 2.2\n   * SC 2.5.7 unless you provide an equivalent. That criterion asks for a\n   * single-pointer, NON-DRAGGING route to every outcome a drag can produce, and\n   * it is assessed independently of keyboard access — a keyboard equivalent does\n   * not satisfy it. This menu is that route. See `EventActions` for why the\n   * pointer path is tier one and the keyboard is not.\n   *\n   * Set false ONLY when your `onSelectEvent` opens something that offers the\n   * same three outcomes: a new day, a new start, a new length.\n   */\n  eventActions?: boolean;\n  renderEvent?: (event: CalendarEvent) => ReactNode;\n  className?: string;\n  label?: string;\n}\n\n/**\n * Wraps an event chip in its action menu, or in nothing at all.\n *\n * A COMPONENT RATHER THAN AN INLINE TERNARY because the alternative is writing\n * the chip's forty lines of JSX twice, and the second copy is the one that\n * stops matching. `Popover` renders its trigger through a render prop, so the\n * chip keeps its own ref, its own handlers and its own drag binding either way.\n */\nfunction EventChipShell({\n  enabled,\n  actions,\n  children,\n}: {\n  enabled: boolean;\n  actions: ReactNode;\n  children: ReactNode;\n}) {\n  if (!enabled) return <>{children}</>;\n  return (\n    <Popover side=\"right\" align=\"start\" trigger={children}>\n      {actions}\n    </Popover>\n  );\n}\n\nexport function CalendarTimeGrid({\n  days,\n  zone,\n  events,\n  today,\n  onSelectEvent,\n  slotMinutes = 60,\n  slotHeightPx = 48,\n  scrollToHour = 8,\n  maxAllDayRows = 3,\n  maxLanes,\n  overlapMode = \"cascade\",\n  nowInstant,\n  snapMinutes = 15,\n  onEventChange,\n  onCreate,\n  onAnnounce,\n  eventActions = true,\n  renderEvent,\n  className,\n  label,\n}: CalendarTimeGridProps) {\n  const locale = useUiLocale();\n  const strings = useUiStrings().calendar;\n  const s = grid();\n  const scrollerRef = useRef<HTMLDivElement>(null);\n  const columnRefs = useRef<(HTMLElement | null)[]>([]);\n  const [announcement, setAnnouncement] = useState(\"\");\n\n  const now = useNow({ fixed: nowInstant });\n\n  /* Rails come from the FIRST day, walked through the zone. On a 25-hour day\n     that is 25 of them with 1 AM twice; on Lord Howe's short day it is 24 with\n     the last a half-step. Nothing branches. */\n  const rails = useMemo(\n    () => (days.length > 0 ? daySlots(zone, days[0], slotMinutes) : []),\n    [days, zone, slotMinutes],\n  );\n\n  /* Column height is derived from the LONGEST day in view, so a week\n     containing a 25-hour day is tall enough for it and the other six simply\n     use less of their own column. Each column still divides by its OWN length,\n     which is what keeps every event on the right rail. */\n  const columnHeightPx = useMemo(() => {\n    const maxSlots = days.reduce(\n      (most, day) => Math.max(most, daySlots(zone, day, slotMinutes).length),\n      1,\n    );\n    return maxSlots * slotHeightPx;\n  }, [days, zone, slotMinutes, slotHeightPx]);\n\n  /* --- the all-day band ---------------------------------------------------- */\n  const band = useMemo(() => {\n    const segments: BandSegment[] = [];\n    for (const event of events) {\n      if (event.allDay) {\n        const segment = allDayBandSegment(days, event);\n        if (segment) segments.push(segment);\n      } else {\n        /* A TIMED event that spans more than one day belongs in the band too:\n           drawn in the grid it would be a full-height rectangle in every column\n           it touches, which hides everything underneath it. */\n        const spans = timedBandSegment(zone, days, event);\n        if (spans && spans.endColumn > spans.startColumn) segments.push(spans);\n      }\n    }\n    const inputs: BandInput[] = segments.map((segment, index) => ({\n      key: `${segment.event.id}:${index}`,\n      startColumn: segment.startColumn,\n      endColumn: segment.endColumn,\n      priority: segment.event.allDay ? 0 : 1,\n    }));\n    const result = packBand(inputs, { columns: days.length, maxRows: maxAllDayRows });\n    const byKey = new Map(inputs.map((input, index) => [input.key, segments[index]]));\n    return {\n      placed: result.placed.map((p) => ({ ...byKey.get(p.key)!, row: p.row })),\n      hidden: result.hidden.length,\n      rows: result.rows,\n    };\n  }, [days, events, zone, maxAllDayRows]);\n\n  /* --- the timed events, per column --------------------------------------- */\n  const columns = useMemo(() => {\n    const minSpan = MIN_EVENT_PX / Math.max(1, columnHeightPx);\n\n    return days.map((day, dayIndex) => {\n      const segments: TimeSegment[] = [];\n      for (const event of events) {\n        if (event.allDay) continue;\n        /* Multi-day timed events went to the band above; drawing them here as\n           well would double them. */\n        const spans = timedBandSegment(zone, days, event);\n        if (spans && spans.endColumn > spans.startColumn) continue;\n        segments.push(...timeSegments(zone, [day], event as TimedEvent));\n      }\n\n      const inputs: LaneInput[] = segments.map((segment, index) => ({\n        key: `${segment.event.id}:${index}`,\n        start: segment.top,\n        end: segment.bottom,\n      }));\n      const placed = packLanes(inputs, { mode: overlapMode, minSpan, maxLanes, minWidth: 0.16 });\n      const byKey = new Map(inputs.map((input, index) => [input.key, segments[index]]));\n\n      return {\n        day,\n        dayIndex,\n        events: placed.map((placement) => ({\n          ...byKey.get(placement.key)!,\n          placement,\n        })),\n      };\n    });\n  }, [days, events, zone, overlapMode, maxLanes, columnHeightPx]);\n\n  /* --- scroll to the working day, ONCE per range --------------------------- */\n\n  /* THE SCROLL POSITION IS A NUMBER, AND THE EFFECT DEPENDS ONLY ON IT.\n   *\n   * My first version keyed the effect on `rangeKey` — correct — and then also\n   * listed `days` in the same dependency array. `days` is a fresh array on\n   * every render, so the effect ran on every render and the scroll snapped back\n   * the instant anything changed. That is precisely the react-big-calendar bug\n   * the comment underneath it warned about, shipped in the act of warning about\n   * it, and a test asserting the scroll position SURVIVES a re-render is what\n   * found it.\n   *\n   * Resolving to a number first is what makes the dependency honest: two\n   * renders of the same range produce the same number, so the effect cannot\n   * fire, whatever else re-rendered. */\n  const rangeKey = days.map(isoDateString).join(\",\");\n  const scrollTargetPx = useMemo(() => {\n    if (days.length === 0) return null;\n    const day = days[0];\n    const target = startOfDay(zone, day) + scrollToHour * 3_600_000;\n    const fraction = Math.max(0, Math.min(1, dayFraction(zone, day, target)));\n    return fraction * columnHeightPx;\n    /* `rangeKey` stands in for `days` deliberately — see above. */\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [rangeKey, zone, scrollToHour, columnHeightPx]);\n\n  useEffect(() => {\n    const node = scrollerRef.current;\n    if (!node || scrollTargetPx === null) return;\n    node.scrollTop = scrollTargetPx;\n  }, [scrollTargetPx]);\n\n  /* MEASURED FROM THE DOM, not computed from the props. The columns move when\n     the grid scrolls, the window resizes, or a sibling reflows, and only the\n     browser knows where they actually are. */\n  const measure = useCallback((): ColumnRect[] => {\n    const out: ColumnRect[] = [];\n    for (let i = 0; i < days.length; i++) {\n      const node = columnRefs.current[i];\n      if (!node) continue;\n      const rect = node.getBoundingClientRect();\n      out.push({ day: days[i], left: rect.left, right: rect.right, top: rect.top, bottom: rect.bottom });\n    }\n    return out;\n  }, [days]);\n\n  const drag = useCalendarDrag({\n    zone,\n    days,\n    snapMinutes,\n    measure,\n    disabled: !onEventChange,\n    onCommit: (event, next) => onEventChange?.(event, next),\n    onCreate: onCreate\n      ? (range) => onCreate({ start: range.start, endExclusive: range.endExclusive })\n      : undefined,\n    onAnnounce: (message) => {\n      setAnnouncement(message);\n      onAnnounce?.(message);\n    },\n  });\n\n  /* KEYBOARD GRABBED-MODE, the TIER-TWO path. `EventActions` above is what\n     satisfies SC 2.5.7; this is faster for a sighted keyboard user and does\n     nothing for that criterion. See its file header. */\n  const keyboard = useEventKeyboard({\n    zone,\n    snapMinutes,\n    days,\n    onCommit: (event, next) => onEventChange?.(event, next),\n    onAnnounce: (message) => {\n      setAnnouncement(message);\n      onAnnounce?.(message);\n    },\n  });\n\n  /* EDGE AUTO-SCROLL, imported from the drag engine unchanged. Reaching an\n     event at 8pm while holding one from 9am is otherwise impossible: the\n     pointer is captured, so the wheel and the scrollbar are both unavailable. */\n  useEffect(() => {\n    if (!drag.draft && !drag.creating) return;\n    const node = scrollerRef.current;\n    if (!node) return;\n    void node;\n    return attachEdgeAutoScroll({ getPoint: drag.getPoint, onScrolled: drag.onScrolled });\n  }, [drag.draft, drag.creating, drag.getPoint, drag.onScrolled]);\n\n  const nowColumn = days.findIndex((day) => {\n    const from = startOfDay(zone, day);\n    return now >= from && now < startOfDay(zone, nextDay(day));\n  });\n  const nowFraction = nowColumn >= 0 ? dayFraction(zone, days[nowColumn], now) : -1;\n\n  return (\n    <div className={cn(s.root(), className)} aria-label={label ?? strings.timeGrid.label}>\n      <div className={s.header()}>\n        <div className={s.headerRow()}>\n          <div className={s.gutter()} style={{ width: GUTTER_PX }}>\n            <div className={s.zoneLabel()}>{zoneLabel(zone, now, locale)}</div>\n          </div>\n          {days.map((day) => {\n            const isToday = today ? isSameDate(day, today) : false;\n            return (\n              <div key={isoDateString(day)} className={s.dayHead()}>\n                <span className={s.dayName()}>{weekdayName(day, \"short\", locale)}</span>\n                <span\n                  className={cn(\n                    s.dayDigit(),\n                    isToday ? \"bg-accent font-semibold text-accent-contrast\" : \"text-primary\",\n                  )}\n                >\n                  {dayNumber(day, locale)}\n                </span>\n              </div>\n            );\n          })}\n        </div>\n\n        {(band.placed.length > 0 || band.hidden > 0) && (\n          <div className={s.allDayRow()}>\n            <div className={s.allDayLabel()} style={{ width: GUTTER_PX }}>\n              {strings.timeGrid.allDay}\n            </div>\n            <div\n              className={s.allDayLanes()}\n              /* ITS OWN SCROLLER AND ITS OWN CAP. Without both, a week with\n                 nine overlapping trips pushes the time grid off the bottom of\n                 the container and the calendar becomes unusable. */\n              style={{ maxHeight: maxAllDayRows * BAND_ROW_PX + 8 }}\n            >\n              <div style={{ height: Math.max(1, band.rows) * BAND_ROW_PX }}>\n                {band.placed.map((segment) => {\n                  const span = segment.endColumn - segment.startColumn + 1;\n                  const swatch = paletteFor(segment.event.paletteKey);\n                  return (\n                    <button\n                      key={`${segment.event.id}:${segment.row}:${segment.startColumn}`}\n                      type=\"button\"\n                      className={cn(\n                        s.bandBar(),\n                        !segment.isStart && \"rounded-l-none\",\n                        !segment.isEnd && \"rounded-r-none\",\n                      )}\n                      aria-label={eventLabel(segment.event, zone, strings.colors[swatch.key], locale, strings)}\n                      style={{\n                        top: segment.row * BAND_ROW_PX,\n                        left: `calc(${segment.startColumn} / ${days.length} * 100% + 2px)`,\n                        width: `calc(${span} / ${days.length} * 100% - 4px)`,\n                        background: swatch.fill,\n                        color: swatch.text,\n                        borderLeft: segment.isStart ? `3px solid ${swatch.edge}` : undefined,\n                        boxShadow: `inset 0 0 0 1px ${swatch.edge}`,\n                      }}\n                      onClick={() => onSelectEvent?.(segment.event)}\n                    >\n                      {segment.event.title}\n                    </button>\n                  );\n                })}\n              </div>\n            </div>\n          </div>\n        )}\n      </div>\n\n      {/* PRESENT AND EMPTY BEFORE CONTENT — a region created at the moment it\n          first has something to say is not announced at all by several screen\n          readers. ASSERTIVE because a drag is a modal gesture and polite waits\n          for a stable render state, which a continuous reflow never reaches. */}\n      <div className=\"sr-only\" role=\"status\" aria-live=\"assertive\" aria-atomic=\"true\">\n        {announcement}\n      </div>\n\n      <div className={s.scroller()} ref={scrollerRef}>\n        {/* THE RAILS ARE PRESENTATIONAL. They are the chrome of the widget, not\n            its content, and a screen reader announcing \"1 AM, 2 AM, 3 AM…\"\n            between every event is noise the user cannot switch off. The times\n            live on the events themselves. */}\n        <div\n          className={s.gutter()}\n          style={{ width: GUTTER_PX, height: columnHeightPx }}\n          aria-hidden=\"true\"\n        >\n          {rails.map((rail, index) => (\n            <div\n              key={`${rail.instant}:${index}`}\n              className={s.railLabel()}\n              style={{ position: \"absolute\", top: rail.fraction * columnHeightPx, width: GUTTER_PX }}\n            >\n              {index === 0 ? \"\" : timeOfDay(rail.instant, zone, locale, rail.minute !== 0)}\n            </div>\n          ))}\n        </div>\n\n        <div className={s.columns()} style={{ height: columnHeightPx }}>\n          {/* The horizontal rules, drawn once across every column as a repeating\n              gradient rather than as one element per rail per day — a week at\n              15-minute rails would otherwise be 672 divs. */}\n          <div\n            aria-hidden=\"true\"\n            className=\"pointer-events-none absolute inset-0\"\n            style={{\n              backgroundImage: `repeating-linear-gradient(to bottom, var(--border-subtle) 0 1px, transparent 1px ${slotHeightPx}px)`,\n            }}\n          />\n\n          {columns.map((column) => (\n            <div\n              key={isoDateString(column.day)}\n              className={s.column()}\n              ref={(node) => {\n                columnRefs.current[column.dayIndex] = node;\n              }}\n            >\n              {/* THE CREATE CANVAS sits UNDER the chips, filling the column, so\n                  a press on empty space starts a new event and a press on a\n                  chip belongs to the chip. It is aria-hidden and not focusable:\n                  creating by keyboard is the action menu's job, not a\n                  rubber-band gesture nobody can see. */}\n              {onCreate && (\n                <div\n                  aria-hidden=\"true\"\n                  className=\"absolute inset-0 z-0\"\n                  ref={drag.bindCanvas()}\n                />\n              )}\n              {/* AN ORDERED LIST, which is the accessible form of a day. The\n                  visual position is decoration on top of it. */}\n              <ul\n                className=\"contents\"\n                aria-label={strings.timeGrid.eventsOn(longDate(column.day, locale))}\n              >\n                {column.events.map(({ event, top, bottom, isStart, isEnd, placement }) => {\n                  const swatch = paletteFor(event.paletteKey);\n\n                  /* POSITIONED FROM THE PREVIEW, so the chip follows the pointer\n                     rather than waiting for the drop. The preview is the event\n                     with the draft delta composed onto it — recomputed from\n                     whatever the event says NOW, never from a snapshot taken at\n                     pointer-down. */\n                  /* BOTH PREVIEWS, composed. Only one can be live at a time —\n                     a pointer gesture and a keyboard grab are mutually\n                     exclusive — but composing rather than branching means\n                     neither has to know the other exists. */\n                  const shown = keyboard.preview(drag.preview(event));\n                  const grabbed = keyboard.grabbedId === event.id;\n                  const dragging = drag.draft?.id === event.id || grabbed;\n                  const liveTop = dragging ? fractionOf(zone, column.day, shown.start) : placement.start;\n                  const liveBottom = dragging\n                    ? fractionOf(zone, column.day, shown.endExclusive)\n                    : placement.end;\n\n                  const heightPx = (bottom - top) * columnHeightPx;\n                  const short = heightPx < 30;\n                  const editable = Boolean(onEventChange) && event.editable !== false;\n                  return (\n                    <li key={`${event.id}:${placement.column}`} className=\"contents\">\n                      <EventChipShell\n                        enabled={editable && eventActions}\n                        actions={\n                          <EventActions\n                            event={event}\n                            zone={zone}\n                            days={days}\n                            snapMinutes={snapMinutes}\n                            onApply={(next) => onEventChange?.(event, next)}\n                          />\n                        }\n                      >\n                      <button\n                        type=\"button\"\n                        className={cn(\n                          s.event(),\n                          short && \"flex-row items-center gap-1\",\n                          editable && \"cursor-grab\",\n                          dragging && \"z-40 cursor-grabbing shadow-lg\",\n                          /* A REFUSED RESIZE IS SHOWN, not silently ignored. The\n                             user is still holding the pointer and needs to know\n                             the gesture will not take. */\n                          dragging && drag.invalid && \"opacity-50 ring-2 ring-danger\",\n                          !isStart && \"rounded-t-none\",\n                          !isEnd && \"rounded-b-none\",\n                        )}\n                        aria-label={eventLabel(event, zone, strings.colors[swatch.key], locale, strings)}\n                        ref={editable ? drag.bindEvent(event, \"move\") : undefined}\n                        data-dragging={dragging ? \"\" : undefined}\n                        style={{\n                          top: liveTop * columnHeightPx,\n                          height: Math.max(MIN_EVENT_PX, (liveBottom - liveTop) * columnHeightPx),\n                          left: `calc(${placement.left * 100}% + 1px)`,\n                          width: `calc(${placement.width * 100}% - 2px)`,\n                          zIndex: 10 + placement.zIndex,\n                          background: swatch.fill,\n                          color: swatch.text,\n                          borderLeft: `3px solid ${swatch.edge}`,\n                          /* A 1px rim on any lane past the first is what stops a\n                             cascade becoming mush — the overlapping chips need\n                             an edge to read against each other. */\n                          boxShadow:\n                            placement.column > 0 ? `inset 0 0 0 1px ${swatch.edge}` : undefined,\n                        }}\n                        onClick={() => onSelectEvent?.(event)}\n                        onKeyDown={editable ? (e) => keyboard.onKeyDown(event, e) : undefined}\n                        data-grabbed={grabbed ? \"\" : undefined}\n                      >\n                        {renderEvent ? (\n                          renderEvent(event)\n                        ) : (\n                          <>\n                            <span className=\"truncate font-medium\">{event.title}</span>\n                            {/* SHORT EVENTS PUT TITLE AND TIME ON ONE LINE. Below\n                                30px there is no room for two, and stacking them\n                                clips the title to nothing. */}\n                            <span className={cn(\"truncate opacity-80\", short && \"shrink-0\")}>\n                              {timeOfDay(event.start, zone, locale)}\n                            </span>\n                          </>\n                        )}\n                      </button>\n                      </EventChipShell>\n                      {/* OUTSIDE the button, so a press on an edge is a resize\n                          and never also a click on the event. Only on the ends\n                          that are really this event's — a chip clipped by the\n                          day boundary has no edge to grab there. */}\n                      {editable && isStart && (\n                        <span\n                          aria-hidden=\"true\"\n                          className={cn(s.resizeHandle(), \"top-0\")}\n                          style={{ top: liveTop * columnHeightPx, left: `calc(${placement.left * 100}% + 1px)`, width: `calc(${placement.width * 100}% - 2px)`, position: \"absolute\", zIndex: 20 + placement.zIndex }}\n                          ref={drag.bindEvent(event, \"resize-start\")}\n                        />\n                      )}\n                      {editable && isEnd && (\n                        <span\n                          aria-hidden=\"true\"\n                          className={cn(s.resizeHandle())}\n                          style={{ top: liveBottom * columnHeightPx - 20, left: `calc(${placement.left * 100}% + 1px)`, width: `calc(${placement.width * 100}% - 2px)`, position: \"absolute\", zIndex: 20 + placement.zIndex }}\n                          ref={drag.bindEvent(event, \"resize-end\")}\n                        />\n                      )}\n                    </li>\n                  );\n                })}\n\n                {/* The rubber band, while a create gesture is in flight. */}\n                {drag.creating && isSameDate(drag.creating.day, column.day) && (\n                  <li aria-hidden=\"true\" className=\"contents\">\n                    <span\n                      className={s.ghost()}\n                      style={{\n                        top: fractionOf(zone, column.day, drag.creating.start) * columnHeightPx,\n                        height:\n                          (fractionOf(zone, column.day, drag.creating.endExclusive) -\n                            fractionOf(zone, column.day, drag.creating.start)) *\n                          columnHeightPx,\n                        left: 2,\n                        right: 2,\n                      }}\n                    />\n                  </li>\n                )}\n              </ul>\n\n              {nowColumn === column.dayIndex && nowFraction >= 0 && nowFraction <= 1 && (\n                <div\n                  className={s.nowLine()}\n                  style={{ top: nowFraction * columnHeightPx }}\n                  aria-hidden=\"true\"\n                >\n                  <span className={s.nowDot()} />\n                </div>\n              )}\n            </div>\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["grid","tv","GUTTER_PX","BAND_ROW_PX","MIN_EVENT_PX","EventChipShell","enabled","actions","children","jsx","Popover","Fragment","CalendarTimeGrid","days","zone","events","today","onSelectEvent","slotMinutes","slotHeightPx","scrollToHour","maxAllDayRows","maxLanes","overlapMode","nowInstant","snapMinutes","onEventChange","onCreate","onAnnounce","eventActions","renderEvent","className","label","locale","useUiLocale","strings","useUiStrings","s","scrollerRef","useRef","columnRefs","announcement","setAnnouncement","useState","now","useNow","rails","useMemo","daySlots","columnHeightPx","most","day","band","segments","event","segment","allDayBandSegment","spans","timedBandSegment","inputs","index","result","packBand","byKey","input","p","columns","minSpan","dayIndex","timeSegments","placed","packLanes","placement","rangeKey","isoDateString","scrollTargetPx","target","startOfDay","dayFraction","useEffect","node","measure","useCallback","out","i","rect","drag","useCalendarDrag","next","range","message","keyboard","useEventKeyboard","attachEdgeAutoScroll","nowColumn","from","nextDay","nowFraction","jsxs","cn","isToday","isSameDate","weekdayName","dayNumber","span","swatch","paletteFor","eventLabel","rail","timeOfDay","column","longDate","top","bottom","isStart","isEnd","shown","grabbed","dragging","liveTop","fractionOf","liveBottom","short","editable","EventActions","e"],"mappings":"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"}

package/dist/components/calendar/EventActions.js

@@ -0,0 +1,101 @@
+import { jsxs as o, jsx as r } from "react/jsx-runtime";
+import { useState as x } from "react";
+import { tv as R } from "tailwind-variants";
+import { cn as q } from "../../lib/cn.js";
+import { Button as E } from "../Button.js";
+import { Select as b, SelectItem as S } from "../Select.js";
+import { timeOfDay as N, longDate as K } from "./format.js";
+import { useUiLocale as G, useUiStrings as H } from "../../lib/i18n/provider.js";
+import { useNumberFormat as J } from "../../lib/i18n/number-format.js";
+import { instantToPlainDateTime as M, startOfDay as D, plainDateTimeToInstant as Q, addDuration as W } from "../../lib/time/zone.js";
+import { isoDateString as p } from "../../lib/time/types.js";
+const X = R({
+  slots: {
+    root: "flex min-w-64 flex-col gap-3",
+    title: "text-sm font-semibold text-primary",
+    meta: "text-2xs text-tertiary",
+    row: "flex items-center justify-between gap-3",
+    label: "text-xs text-secondary",
+    footer: "flex justify-end gap-2 border-t border-border-subtle pt-3"
+  }
+});
+function Y(e, a, c, y) {
+  const m = D(e, a), g = D(e, { ...a, day: a.day + 1 }) - m, d = c * 6e4, u = [];
+  for (let s = 0; s < g; s += d) {
+    const l = m + s;
+    u.push({ value: String(s), label: N(l, e, y), instant: l });
+  }
+  return u;
+}
+const Z = [15, 30, 45, 60, 90, 120, 180, 240, 300, 360, 480, 600, 720];
+function lt({
+  event: e,
+  zone: a,
+  days: c,
+  snapMinutes: y = 15,
+  maxDurationMinutes: m = 720,
+  onApply: g,
+  onClose: d,
+  className: u
+}) {
+  const s = G(), l = J(), i = H().calendar.actions, n = X(), f = (() => {
+    const t = M(a, e.start);
+    return { year: t.year, month: t.month, day: t.day };
+  })(), [w, I] = x(p(f)), T = c.find((t) => p(t) === w) ?? f, v = Y(a, T, y, s), U = e.start - D(a, f), [O, V] = x(String(U)), C = Math.round((e.endExclusive - e.start) / 6e4), [j, k] = x(String(C)), B = Array.from(/* @__PURE__ */ new Set([...Z, C])).filter((t) => t > 0 && t <= m).sort((t, h) => t - h), F = () => {
+    const t = v.find((P) => P.value === O) ?? v[0], h = M(a, t.instant), A = Q(a, {
+      ...T,
+      hour: h.hour,
+      minute: h.minute,
+      second: 0,
+      millisecond: 0
+    }), L = Number(j);
+    g({
+      ...e,
+      start: A,
+      endExclusive: W(a, A, { minutes: L })
+    }), d?.();
+  };
+  return /* @__PURE__ */ o("div", { className: q(n.root(), u), children: [
+    /* @__PURE__ */ o("div", { children: [
+      /* @__PURE__ */ r("div", { className: n.title(), children: e.title }),
+      /* @__PURE__ */ o("div", { className: n.meta(), children: [
+        N(e.start, a, s),
+        " – ",
+        N(e.endExclusive, a, s),
+        ",",
+        " ",
+        K(f, s)
+      ] })
+    ] }),
+    /* @__PURE__ */ o("div", { className: n.row(), children: [
+      /* @__PURE__ */ r("span", { className: n.label(), id: "cal-actions-day", children: i.moveTo }),
+      /* @__PURE__ */ r(
+        b,
+        {
+          value: w,
+          onValueChange: (t) => {
+            I(String(t));
+          },
+          "aria-label": i.day,
+          children: c.map((t) => /* @__PURE__ */ r(S, { value: p(t), children: K(t, s) }, p(t)))
+        }
+      )
+    ] }),
+    /* @__PURE__ */ o("div", { className: n.row(), children: [
+      /* @__PURE__ */ r("span", { className: n.label(), children: i.startAt }),
+      /* @__PURE__ */ r(b, { value: O, onValueChange: (t) => V(String(t)), "aria-label": i.startTime, children: v.map((t) => /* @__PURE__ */ r(S, { value: t.value, children: t.label }, t.value)) })
+    ] }),
+    /* @__PURE__ */ o("div", { className: n.row(), children: [
+      /* @__PURE__ */ r("span", { className: n.label(), children: i.lasting }),
+      /* @__PURE__ */ r(b, { value: j, onValueChange: (t) => k(String(t)), "aria-label": i.duration, children: B.map((t) => /* @__PURE__ */ r(S, { value: String(t), children: i.minutes(Math.floor(t / 60), l(Math.floor(t / 60)), t % 60, l(t % 60)) }, t)) })
+    ] }),
+    /* @__PURE__ */ o("div", { className: n.footer(), children: [
+      /* @__PURE__ */ r(E, { size: "sm", variant: "ghost", onClick: () => d?.(), children: i.cancel }),
+      /* @__PURE__ */ r(E, { size: "sm", onClick: F, children: i.apply })
+    ] })
+  ] });
+}
+export {
+  lt as EventActions
+};
+//# sourceMappingURL=EventActions.js.map