@alfadocs/ui-kit-debug 0.1.8

package/dist/_chunks/time-picker-D-EueWUG.js

@@ -0,0 +1,322 @@
+import { jsxs as ve, jsx as K } from "react/jsx-runtime";
+import { forwardRef as he, useState as F, useCallback as U, useRef as P, useEffect as ge } from "react";
+import { c as j } from "./index-D2ZczOXr.js";
+import { useTranslation as be } from "react-i18next";
+import { u as ye } from "./form-field-context-94LwgYTQ.js";
+function we(r) {
+  try {
+    const i = new Intl.DateTimeFormat(r, {
+      hour: "numeric"
+    }).resolvedOptions();
+    return i.hourCycle === "h12" || i.hourCycle === "h11";
+  } catch {
+    return !1;
+  }
+}
+function xe(r) {
+  var i, l;
+  try {
+    const H = ((i = new Intl.DateTimeFormat(r, {
+      hour: "numeric",
+      hour12: !0
+    }).formatToParts(new Date(2e3, 0, 1, 9)).find((w) => w.type === "dayPeriod")) == null ? void 0 : i.value) ?? "AM", f = ((l = new Intl.DateTimeFormat(r, {
+      hour: "numeric",
+      hour12: !0
+    }).formatToParts(new Date(2e3, 0, 1, 15)).find((w) => w.type === "dayPeriod")) == null ? void 0 : l.value) ?? "PM";
+    return { am: H, pm: f };
+  } catch {
+    return { am: "AM", pm: "PM" };
+  }
+}
+function y(r, i, l) {
+  return Math.min(l, Math.max(i, r));
+}
+function L(r, i) {
+  return Math.round(r / i) * i;
+}
+function C(r) {
+  return r === 0 ? 12 : r > 12 ? r - 12 : r;
+}
+function S(r, i) {
+  return i ? r === 12 ? 12 : r + 12 : r === 12 ? 0 : r;
+}
+const ke = j(
+  [
+    "ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]",
+    "ds:rounded-[var(--radius-sm)] ds:border ds:border-border ds:bg-background",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:focus-within:outline-[length:var(--focus-ring-width)] ds:focus-within:outline-solid",
+    "ds:focus-within:outline-ring ds:focus-within:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:forced-colors:focus-within:outline-[CanvasText]"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        sm: "ds:h-8 ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:text-[length:var(--font-size-sm)]",
+        md: "ds:h-[var(--min-target-size)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:text-[length:var(--font-size-base)]",
+        lg: "ds:h-12 ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:text-[length:var(--font-size-lg)]"
+      },
+      tone: {
+        default: "ds:border-border",
+        error: "ds:border-destructive"
+      },
+      isDisabled: {
+        true: "ds:cursor-not-allowed ds:opacity-50",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      tone: "default",
+      isDisabled: !1
+    }
+  }
+), G = j(
+  [
+    "ds:inline-flex ds:items-center ds:justify-center",
+    "ds:rounded-[var(--radius-sm)] ds:text-center ds:tabular-nums",
+    "ds:bg-transparent ds:text-foreground",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:select-none"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        sm: "ds:min-w-6 ds:h-6 ds:text-[length:var(--font-size-sm)]",
+        md: "ds:min-w-8 ds:h-8 ds:text-[length:var(--font-size-base)]",
+        lg: "ds:min-w-10 ds:h-10 ds:text-[length:var(--font-size-lg)]"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+), De = j(
+  [
+    "ds:inline-flex ds:items-center ds:justify-center",
+    "ds:rounded-[var(--radius-sm)] ds:text-center",
+    "ds:bg-transparent ds:text-foreground ds:cursor-pointer",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:select-none",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:hover:bg-muted"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        sm: "ds:min-w-8 ds:h-6 ds:text-[length:var(--font-size-sm)] ds:ps-1 ds:pe-1",
+        md: "ds:min-w-10 ds:h-8 ds:text-[length:var(--font-size-base)] ds:ps-1.5 ds:pe-1.5",
+        lg: "ds:min-w-12 ds:h-10 ds:text-[length:var(--font-size-lg)] ds:ps-2 ds:pe-2"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+), Te = j("ds:text-muted-foreground ds:select-none", {
+  variants: {
+    size: {
+      sm: "ds:text-[length:var(--font-size-sm)]",
+      md: "ds:text-[length:var(--font-size-base)]",
+      lg: "ds:text-[length:var(--font-size-lg)]"
+    }
+  },
+  defaultVariants: { size: "md" }
+}), ze = he(
+  ({
+    value: r,
+    defaultValue: i,
+    onChange: l,
+    hour12: H,
+    minuteStep: f = 1,
+    fullWidthSeparator: w = !1,
+    periodLabels: J,
+    size: x = "md",
+    disabled: Q,
+    className: W,
+    id: X
+  }, Y) => {
+    const { t: B, i18n: E } = be(), k = ye(), Z = X ?? k.id, m = k.disabled || Q, $ = k.invalid ? "error" : "default", s = H !== void 0 ? H : we(E.language), ee = xe(E.language), A = J ?? ee, R = r !== void 0, [te, re] = F(
+      r ?? i ?? { hours: 0, minutes: 0 }
+    ), t = R ? r : te, u = U(
+      (e) => {
+        R || re(e), l == null || l(e);
+      },
+      [R, l]
+    ), O = P(null), D = P(null), V = P(null), [ne, T] = F(""), [se, z] = F(""), p = P(null), v = P(null), N = U(() => {
+      T(""), p.current && (clearTimeout(p.current), p.current = null);
+    }, []), I = U(() => {
+      z(""), v.current && (clearTimeout(v.current), v.current = null);
+    }, []);
+    ge(() => () => {
+      p.current && clearTimeout(p.current), v.current && clearTimeout(v.current);
+    }, []);
+    const ie = w ? "：" : ":", _ = s ? String(C(t.hours)).padStart(2, "0") : String(t.hours).padStart(2, "0"), q = String(t.minutes).padStart(2, "0"), c = t.hours >= 12, oe = (e) => {
+      var h, b, M;
+      if (!m) {
+        if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+          e.preventDefault();
+          const g = e.key === "ArrowUp" ? 1 : -1, a = 23;
+          let n = t.hours + g;
+          n < 0 && (n = a), n > a && (n = 0), u({ ...t, hours: n }), N();
+          return;
+        }
+        if (e.key === "Tab" && !e.shiftKey) {
+          e.preventDefault(), (h = D.current) == null || h.focus(), N();
+          return;
+        }
+        if (e.key >= "0" && e.key <= "9") {
+          e.preventDefault();
+          const g = ne + e.key;
+          T(g), p.current && clearTimeout(p.current);
+          const a = parseInt(g, 10), n = s ? 12 : 23;
+          if (g.length >= 2) {
+            const o = y(a, s ? 1 : 0, n), d = s ? S(o, c) : o;
+            u({ ...t, hours: d }), T(""), (b = D.current) == null || b.focus();
+          } else if (a > (s ? 1 : 2)) {
+            const o = y(a, s ? 1 : 0, n), d = s ? S(o, c) : o;
+            u({ ...t, hours: d }), T(""), (M = D.current) == null || M.focus();
+          } else
+            p.current = setTimeout(() => {
+              const o = y(a, s ? 1 : 0, n), d = s ? S(o, c) : o;
+              u({ ...t, hours: d }), T("");
+            }, 1e3);
+        }
+      }
+    }, ae = (e) => {
+      var h, b, M, g;
+      if (!m) {
+        if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+          e.preventDefault();
+          const a = e.key === "ArrowUp" ? f : -f;
+          let n = t.minutes + a;
+          n < 0 && (n = 60 + n), n >= 60 && (n = n - 60), u({ ...t, minutes: n }), I();
+          return;
+        }
+        if (e.key === "Tab" && !e.shiftKey && s) {
+          e.preventDefault(), (h = V.current) == null || h.focus(), I();
+          return;
+        }
+        if (e.key === "Tab" && e.shiftKey) {
+          e.preventDefault(), (b = O.current) == null || b.focus(), I();
+          return;
+        }
+        if (e.key >= "0" && e.key <= "9") {
+          e.preventDefault();
+          const a = se + e.key;
+          z(a), v.current && clearTimeout(v.current);
+          const n = parseInt(a, 10);
+          if (a.length >= 2) {
+            const o = y(n, 0, 59), d = L(o, f);
+            u({ ...t, minutes: d }), z(""), s && ((M = V.current) == null || M.focus());
+          } else if (n > 5) {
+            const o = y(n, 0, 59), d = L(o, f);
+            u({ ...t, minutes: d }), z(""), s && ((g = V.current) == null || g.focus());
+          } else
+            v.current = setTimeout(() => {
+              const o = y(n, 0, 59), d = L(o, f);
+              u({ ...t, minutes: d }), z("");
+            }, 1e3);
+        }
+      }
+    }, ue = (e) => {
+      var h;
+      if (!m) {
+        if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+          e.preventDefault();
+          const b = c ? t.hours - 12 : t.hours + 12;
+          u({ ...t, hours: y(b, 0, 23) });
+          return;
+        }
+        if (e.key === "Tab" && e.shiftKey) {
+          e.preventDefault(), (h = D.current) == null || h.focus();
+          return;
+        }
+        (e.key === "a" || e.key === "A") && (e.preventDefault(), c && u({ ...t, hours: t.hours - 12 })), (e.key === "p" || e.key === "P") && (e.preventDefault(), c || u({ ...t, hours: t.hours + 12 }));
+      }
+    }, de = (e) => {
+      N();
+    }, le = () => {
+      I();
+      const e = L(t.minutes, f);
+      e !== t.minutes && u({ ...t, minutes: e });
+    }, ce = B("ui.inputs.timePicker.hour", "Hour"), fe = B("ui.inputs.timePicker.minute", "Minute"), me = B("ui.inputs.timePicker.period", "Period"), pe = B("ui.inputs.timePicker.groupLabel", "Time");
+    return /* @__PURE__ */ ve(
+      "div",
+      {
+        ref: Y,
+        id: Z,
+        role: "group",
+        "aria-label": pe,
+        "aria-describedby": k.describedBy || void 0,
+        "aria-invalid": k.invalid || void 0,
+        "aria-disabled": m || void 0,
+        "data-component": "time-picker",
+        className: ke({
+          size: x,
+          tone: $,
+          isDisabled: m ?? !1,
+          className: W
+        }),
+        children: [
+          /* @__PURE__ */ K(
+            "span",
+            {
+              ref: O,
+              role: "spinbutton",
+              "aria-label": ce,
+              "aria-valuemin": s ? 1 : 0,
+              "aria-valuemax": s ? 12 : 23,
+              "aria-valuenow": s ? C(t.hours) : t.hours,
+              "aria-valuetext": _,
+              tabIndex: m ? -1 : 0,
+              inputMode: "numeric",
+              onKeyDown: oe,
+              onBlur: de,
+              className: G({ size: x }),
+              children: _
+            }
+          ),
+          /* @__PURE__ */ K("span", { "aria-hidden": "true", className: Te({ size: x }), children: ie }),
+          /* @__PURE__ */ K(
+            "span",
+            {
+              ref: D,
+              role: "spinbutton",
+              "aria-label": fe,
+              "aria-valuemin": 0,
+              "aria-valuemax": 59,
+              "aria-valuenow": t.minutes,
+              "aria-valuetext": q,
+              tabIndex: m ? -1 : 0,
+              inputMode: "numeric",
+              onKeyDown: ae,
+              onBlur: le,
+              className: G({ size: x }),
+              children: q
+            }
+          ),
+          s ? /* @__PURE__ */ K(
+            "span",
+            {
+              ref: V,
+              role: "spinbutton",
+              "aria-label": me,
+              "aria-valuemin": 0,
+              "aria-valuemax": 1,
+              "aria-valuenow": c ? 1 : 0,
+              "aria-valuetext": c ? A.pm : A.am,
+              tabIndex: m ? -1 : 0,
+              onKeyDown: ue,
+              className: De({ size: x }),
+              children: c ? A.pm : A.am
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
+ze.displayName = "TimePicker";
+export {
+  ze as T
+};
+//# sourceMappingURL=time-picker-D-EueWUG.js.map

package/dist/_chunks/time-picker-D-EueWUG.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker-D-EueWUG.js","sources":["../../src/components/time-picker/time-picker.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  type KeyboardEvent,\n  type FocusEvent,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { useFormField } from '../form-field/form-field-context';\nimport type { TimeValue } from '../_shared/time';\n\n/* -------------------------------------------------------------------------- */\n/*  Helpers                                                                    */\n/* -------------------------------------------------------------------------- */\n\n/** Detect 12h vs 24h from the browser locale. */\nfunction detectHour12(locale: string): boolean {\n  try {\n    const resolved = new Intl.DateTimeFormat(locale, {\n      hour: 'numeric',\n    }).resolvedOptions();\n    return resolved.hourCycle === 'h12' || resolved.hourCycle === 'h11';\n  } catch {\n    return false;\n  }\n}\n\n/** Get localised AM/PM labels via Intl. */\nfunction getLocalePeriodLabels(locale: string): { am: string; pm: string } {\n  try {\n    const am = new Intl.DateTimeFormat(locale, {\n      hour: 'numeric',\n      hour12: true,\n    })\n      .formatToParts(new Date(2000, 0, 1, 9))\n      .find((p) => p.type === 'dayPeriod')?.value ?? 'AM';\n\n    const pm = new Intl.DateTimeFormat(locale, {\n      hour: 'numeric',\n      hour12: true,\n    })\n      .formatToParts(new Date(2000, 0, 1, 15))\n      .find((p) => p.type === 'dayPeriod')?.value ?? 'PM';\n\n    return { am, pm };\n  } catch {\n    return { am: 'AM', pm: 'PM' };\n  }\n}\n\n/** Clamp a number between min and max. */\nfunction clamp(value: number, min: number, max: number): number {\n  return Math.min(max, Math.max(min, value));\n}\n\n/** Round to nearest step. */\nfunction roundToStep(value: number, step: number): number {\n  return Math.round(value / step) * step;\n}\n\n/** Convert 24h hour to 12h display hour. */\nfunction to12Hour(h24: number): number {\n  if (h24 === 0) return 12;\n  if (h24 > 12) return h24 - 12;\n  return h24;\n}\n\n/** Convert 12h display hour + period to 24h hour. */\nfunction to24Hour(h12: number, isPM: boolean): number {\n  if (isPM) return h12 === 12 ? 12 : h12 + 12;\n  return h12 === 12 ? 0 : h12;\n}\n\n/* -------------------------------------------------------------------------- */\n/*  CVA variants                                                               */\n/* -------------------------------------------------------------------------- */\n\nconst wrapperVariants = cva(\n  [\n    'ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]',\n    'ds:rounded-[var(--radius-sm)] ds:border ds:border-border ds:bg-background',\n    'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n    'ds:focus-within:outline-[length:var(--focus-ring-width)] ds:focus-within:outline-solid',\n    'ds:focus-within:outline-ring ds:focus-within:outline-offset-[length:var(--focus-ring-offset)]',\n    'ds:forced-colors:focus-within:outline-[CanvasText]',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        sm: 'ds:h-8 ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:text-[length:var(--font-size-sm)]',\n        md: 'ds:h-[var(--min-target-size)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:text-[length:var(--font-size-base)]',\n        lg: 'ds:h-12 ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:text-[length:var(--font-size-lg)]',\n      },\n      tone: {\n        default: 'ds:border-border',\n        error: 'ds:border-destructive',\n      },\n      isDisabled: {\n        true: 'ds:cursor-not-allowed ds:opacity-50',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      tone: 'default',\n      isDisabled: false,\n    },\n  },\n);\n\nconst segmentVariants = cva(\n  [\n    'ds:inline-flex ds:items-center ds:justify-center',\n    'ds:rounded-[var(--radius-sm)] ds:text-center ds:tabular-nums',\n    'ds:bg-transparent ds:text-foreground',\n    'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n    'ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n    'ds:select-none',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        sm: 'ds:min-w-6 ds:h-6 ds:text-[length:var(--font-size-sm)]',\n        md: 'ds:min-w-8 ds:h-8 ds:text-[length:var(--font-size-base)]',\n        lg: 'ds:min-w-10 ds:h-10 ds:text-[length:var(--font-size-lg)]',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n);\n\nconst periodButtonVariants = cva(\n  [\n    'ds:inline-flex ds:items-center ds:justify-center',\n    'ds:rounded-[var(--radius-sm)] ds:text-center',\n    'ds:bg-transparent ds:text-foreground ds:cursor-pointer',\n    'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n    'ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n    'ds:select-none',\n    'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n    'ds:hover:bg-muted',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        sm: 'ds:min-w-8 ds:h-6 ds:text-[length:var(--font-size-sm)] ds:ps-1 ds:pe-1',\n        md: 'ds:min-w-10 ds:h-8 ds:text-[length:var(--font-size-base)] ds:ps-1.5 ds:pe-1.5',\n        lg: 'ds:min-w-12 ds:h-10 ds:text-[length:var(--font-size-lg)] ds:ps-2 ds:pe-2',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n);\n\nconst separatorVariants = cva('ds:text-muted-foreground ds:select-none', {\n  variants: {\n    size: {\n      sm: 'ds:text-[length:var(--font-size-sm)]',\n      md: 'ds:text-[length:var(--font-size-base)]',\n      lg: 'ds:text-[length:var(--font-size-lg)]',\n    },\n  },\n  defaultVariants: { size: 'md' },\n});\n\n/* -------------------------------------------------------------------------- */\n/*  Props                                                                      */\n/* -------------------------------------------------------------------------- */\n\ntype MinuteStep = 1 | 5 | 10 | 15 | 30;\n\nexport interface TimePickerProps\n  extends Pick<VariantProps<typeof wrapperVariants>, 'size'> {\n  /** Current value — controlled. */\n  value?: TimeValue;\n  /** Default value — uncontrolled. */\n  defaultValue?: TimeValue;\n  /** Called when the value changes. */\n  onChange?: (value: TimeValue) => void;\n  /** Force 12h/24h mode. Defaults to locale detection. */\n  hour12?: boolean;\n  /** Minute increment step. */\n  minuteStep?: MinuteStep;\n  /** Use full-width colon separator for CJK apps. */\n  fullWidthSeparator?: boolean;\n  /** Custom AM/PM labels. */\n  periodLabels?: { am: string; pm: string };\n  /** Component size. */\n  size?: 'sm' | 'md' | 'lg';\n  /** Whether the input is disabled. */\n  disabled?: boolean;\n  /** Additional class names. */\n  className?: string;\n  /** id override. */\n  id?: string;\n}\n\n/* -------------------------------------------------------------------------- */\n/*  Component                                                                  */\n/* -------------------------------------------------------------------------- */\n\nexport const TimePicker = forwardRef<HTMLDivElement, TimePickerProps>(\n  (\n    {\n      value,\n      defaultValue,\n      onChange,\n      hour12: hour12Prop,\n      minuteStep = 1,\n      fullWidthSeparator = false,\n      periodLabels: periodLabelsProp,\n      size = 'md',\n      disabled,\n      className,\n      id,\n    },\n    ref,\n  ) => {\n    const { t, i18n } = useTranslation();\n    const ctx = useFormField();\n    const effectiveId = id ?? ctx.id;\n    const effectiveDisabled = ctx.disabled || disabled;\n    const effectiveTone = ctx.invalid ? 'error' : 'default';\n\n    const isHour12 =\n      hour12Prop !== undefined ? hour12Prop : detectHour12(i18n.language);\n    const localePeriods = getLocalePeriodLabels(i18n.language);\n    const periods = periodLabelsProp ?? localePeriods;\n\n    const isControlled = value !== undefined;\n    const [internalValue, setInternalValue] = useState<TimeValue>(\n      value ?? defaultValue ?? { hours: 0, minutes: 0 },\n    );\n    const currentValue: TimeValue = isControlled ? value : internalValue;\n\n    const emit = useCallback(\n      (next: TimeValue) => {\n        if (!isControlled) setInternalValue(next);\n        onChange?.(next);\n      },\n      [isControlled, onChange],\n    );\n\n    // Segment refs\n    const hourRef = useRef<HTMLSpanElement>(null);\n    const minuteRef = useRef<HTMLSpanElement>(null);\n    const periodRef = useRef<HTMLSpanElement>(null);\n\n    // Typing buffer for each segment\n    const [hourBuffer, setHourBuffer] = useState('');\n    const [minuteBuffer, setMinuteBuffer] = useState('');\n    const hourTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n    const minuteTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    // Clear buffers on blur\n    const clearHourBuffer = useCallback(() => {\n      setHourBuffer('');\n      if (hourTimerRef.current) {\n        clearTimeout(hourTimerRef.current);\n        hourTimerRef.current = null;\n      }\n    }, []);\n\n    const clearMinuteBuffer = useCallback(() => {\n      setMinuteBuffer('');\n      if (minuteTimerRef.current) {\n        clearTimeout(minuteTimerRef.current);\n        minuteTimerRef.current = null;\n      }\n    }, []);\n\n    // Cleanup timers\n    useEffect(() => {\n      return () => {\n        if (hourTimerRef.current) clearTimeout(hourTimerRef.current);\n        if (minuteTimerRef.current) clearTimeout(minuteTimerRef.current);\n      };\n    }, []);\n\n    const separator = fullWidthSeparator ? '\\uFF1A' : ':';\n\n    // Display values\n    const displayHour = isHour12\n      ? String(to12Hour(currentValue.hours)).padStart(2, '0')\n      : String(currentValue.hours).padStart(2, '0');\n    const displayMinute = String(currentValue.minutes).padStart(2, '0');\n    const isPM = currentValue.hours >= 12;\n\n    // Hour segment keyboard handler\n    const handleHourKeyDown = (e: KeyboardEvent<HTMLSpanElement>) => {\n      if (effectiveDisabled) return;\n\n      if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n        e.preventDefault();\n        const delta = e.key === 'ArrowUp' ? 1 : -1;\n        const maxH = 23;\n        let newH = currentValue.hours + delta;\n        if (newH < 0) newH = maxH;\n        if (newH > maxH) newH = 0;\n        emit({ ...currentValue, hours: newH });\n        clearHourBuffer();\n        return;\n      }\n\n      if (e.key === 'Tab' && !e.shiftKey) {\n        e.preventDefault();\n        minuteRef.current?.focus();\n        clearHourBuffer();\n        return;\n      }\n\n      if (e.key >= '0' && e.key <= '9') {\n        e.preventDefault();\n        const next = hourBuffer + e.key;\n        setHourBuffer(next);\n\n        if (hourTimerRef.current) clearTimeout(hourTimerRef.current);\n\n        const num = parseInt(next, 10);\n        const maxH = isHour12 ? 12 : 23;\n\n        if (next.length >= 2) {\n          const clamped = clamp(num, isHour12 ? 1 : 0, maxH);\n          const h24 = isHour12 ? to24Hour(clamped, isPM) : clamped;\n          emit({ ...currentValue, hours: h24 });\n          setHourBuffer('');\n          minuteRef.current?.focus();\n        } else {\n          // If first digit makes it impossible to form a valid 2-digit number, commit now\n          if (num > (isHour12 ? 1 : 2)) {\n            const clamped = clamp(num, isHour12 ? 1 : 0, maxH);\n            const h24 = isHour12 ? to24Hour(clamped, isPM) : clamped;\n            emit({ ...currentValue, hours: h24 });\n            setHourBuffer('');\n            minuteRef.current?.focus();\n          } else {\n            hourTimerRef.current = setTimeout(() => {\n              const clamped = clamp(num, isHour12 ? 1 : 0, maxH);\n              const h24 = isHour12 ? to24Hour(clamped, isPM) : clamped;\n              emit({ ...currentValue, hours: h24 });\n              setHourBuffer('');\n            }, 1000);\n          }\n        }\n      }\n    };\n\n    // Minute segment keyboard handler\n    const handleMinuteKeyDown = (e: KeyboardEvent<HTMLSpanElement>) => {\n      if (effectiveDisabled) return;\n\n      if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n        e.preventDefault();\n        const delta = e.key === 'ArrowUp' ? minuteStep : -minuteStep;\n        let newM = currentValue.minutes + delta;\n        if (newM < 0) newM = 60 + newM;\n        if (newM >= 60) newM = newM - 60;\n        emit({ ...currentValue, minutes: newM });\n        clearMinuteBuffer();\n        return;\n      }\n\n      if (e.key === 'Tab' && !e.shiftKey && isHour12) {\n        e.preventDefault();\n        periodRef.current?.focus();\n        clearMinuteBuffer();\n        return;\n      }\n\n      if (e.key === 'Tab' && e.shiftKey) {\n        e.preventDefault();\n        hourRef.current?.focus();\n        clearMinuteBuffer();\n        return;\n      }\n\n      if (e.key >= '0' && e.key <= '9') {\n        e.preventDefault();\n        const next = minuteBuffer + e.key;\n        setMinuteBuffer(next);\n\n        if (minuteTimerRef.current) clearTimeout(minuteTimerRef.current);\n\n        const num = parseInt(next, 10);\n\n        if (next.length >= 2) {\n          const clamped = clamp(num, 0, 59);\n          const rounded = roundToStep(clamped, minuteStep);\n          emit({ ...currentValue, minutes: rounded });\n          setMinuteBuffer('');\n          if (isHour12) {\n            periodRef.current?.focus();\n          }\n        } else {\n          if (num > 5) {\n            const clamped = clamp(num, 0, 59);\n            const rounded = roundToStep(clamped, minuteStep);\n            emit({ ...currentValue, minutes: rounded });\n            setMinuteBuffer('');\n            if (isHour12) {\n              periodRef.current?.focus();\n            }\n          } else {\n            minuteTimerRef.current = setTimeout(() => {\n              const clamped = clamp(num, 0, 59);\n              const rounded = roundToStep(clamped, minuteStep);\n              emit({ ...currentValue, minutes: rounded });\n              setMinuteBuffer('');\n            }, 1000);\n          }\n        }\n      }\n    };\n\n    // Period toggle handler\n    const handlePeriodKeyDown = (e: KeyboardEvent<HTMLSpanElement>) => {\n      if (effectiveDisabled) return;\n\n      if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n        e.preventDefault();\n        const newH = isPM\n          ? currentValue.hours - 12\n          : currentValue.hours + 12;\n        emit({ ...currentValue, hours: clamp(newH, 0, 23) });\n        return;\n      }\n\n      if (e.key === 'Tab' && e.shiftKey) {\n        e.preventDefault();\n        minuteRef.current?.focus();\n        return;\n      }\n\n      // a/p keys toggle AM/PM\n      if (e.key === 'a' || e.key === 'A') {\n        e.preventDefault();\n        if (isPM) {\n          emit({ ...currentValue, hours: currentValue.hours - 12 });\n        }\n      }\n      if (e.key === 'p' || e.key === 'P') {\n        e.preventDefault();\n        if (!isPM) {\n          emit({ ...currentValue, hours: currentValue.hours + 12 });\n        }\n      }\n    };\n\n    const handleHourBlur = (_e: FocusEvent) => {\n      clearHourBuffer();\n    };\n\n    const handleMinuteBlur = () => {\n      clearMinuteBuffer();\n      // Round to step on blur\n      const rounded = roundToStep(currentValue.minutes, minuteStep);\n      if (rounded !== currentValue.minutes) {\n        emit({ ...currentValue, minutes: rounded });\n      }\n      // Prevent blur from propagating if moving within the component\n    };\n\n    const hourLabel = t('ui.inputs.timePicker.hour', 'Hour');\n    const minuteLabel = t('ui.inputs.timePicker.minute', 'Minute');\n    const periodLabel = t('ui.inputs.timePicker.period', 'Period');\n    const groupLabel = t('ui.inputs.timePicker.groupLabel', 'Time');\n\n    return (\n      <div\n        ref={ref}\n        id={effectiveId}\n        role=\"group\"\n        aria-label={groupLabel}\n        aria-describedby={ctx.describedBy || undefined}\n        aria-invalid={ctx.invalid || undefined}\n        // `aria-required` is not valid on `role=\"group\"` per ARIA 1.2 — the\n        // FormField label's visible asterisk + `aria-describedby` link\n        // communicate the required state instead.\n        aria-disabled={effectiveDisabled || undefined}\n        data-component=\"time-picker\"\n        className={wrapperVariants({\n          size,\n          tone: effectiveTone,\n          isDisabled: effectiveDisabled ?? false,\n          className,\n        })}\n      >\n        {/* Hour segment */}\n        <span\n          ref={hourRef}\n          role=\"spinbutton\"\n          aria-label={hourLabel}\n          aria-valuemin={isHour12 ? 1 : 0}\n          aria-valuemax={isHour12 ? 12 : 23}\n          aria-valuenow={isHour12 ? to12Hour(currentValue.hours) : currentValue.hours}\n          aria-valuetext={displayHour}\n          tabIndex={effectiveDisabled ? -1 : 0}\n          inputMode=\"numeric\"\n          onKeyDown={handleHourKeyDown}\n          onBlur={handleHourBlur}\n          className={segmentVariants({ size })}\n        >\n          {displayHour}\n        </span>\n\n        {/* Separator */}\n        <span aria-hidden=\"true\" className={separatorVariants({ size })}>\n          {separator}\n        </span>\n\n        {/* Minute segment */}\n        <span\n          ref={minuteRef}\n          role=\"spinbutton\"\n          aria-label={minuteLabel}\n          aria-valuemin={0}\n          aria-valuemax={59}\n          aria-valuenow={currentValue.minutes}\n          aria-valuetext={displayMinute}\n          tabIndex={effectiveDisabled ? -1 : 0}\n          inputMode=\"numeric\"\n          onKeyDown={handleMinuteKeyDown}\n          onBlur={handleMinuteBlur}\n          className={segmentVariants({ size })}\n        >\n          {displayMinute}\n        </span>\n\n        {/* AM/PM toggle (12h mode only) */}\n        {isHour12 ? (\n          <span\n            ref={periodRef}\n            role=\"spinbutton\"\n            aria-label={periodLabel}\n            aria-valuemin={0}\n            aria-valuemax={1}\n            aria-valuenow={isPM ? 1 : 0}\n            aria-valuetext={isPM ? periods.pm : periods.am}\n            tabIndex={effectiveDisabled ? -1 : 0}\n            onKeyDown={handlePeriodKeyDown}\n            className={periodButtonVariants({ size })}\n          >\n            {isPM ? periods.pm : periods.am}\n          </span>\n        ) : null}\n      </div>\n    );\n  },\n);\n\nTimePicker.displayName = 'TimePicker';\n"],"names":["detectHour12","locale","resolved","getLocalePeriodLabels","am","_a","p","pm","_b","clamp","value","min","max","roundToStep","step","to12Hour","h24","to24Hour","h12","isPM","wrapperVariants","cva","segmentVariants","periodButtonVariants","separatorVariants","TimePicker","forwardRef","defaultValue","onChange","hour12Prop","minuteStep","fullWidthSeparator","periodLabelsProp","size","disabled","className","id","ref","t","i18n","useTranslation","ctx","useFormField","effectiveId","effectiveDisabled","effectiveTone","isHour12","localePeriods","periods","isControlled","internalValue","setInternalValue","useState","currentValue","emit","useCallback","next","hourRef","useRef","minuteRef","periodRef","hourBuffer","setHourBuffer","minuteBuffer","setMinuteBuffer","hourTimerRef","minuteTimerRef","clearHourBuffer","clearMinuteBuffer","useEffect","separator","displayHour","displayMinute","handleHourKeyDown","delta","maxH","newH","num","clamped","_c","handleMinuteKeyDown","newM","rounded","_d","handlePeriodKeyDown","handleHourBlur","_e","handleMinuteBlur","hourLabel","minuteLabel","periodLabel","groupLabel","jsxs","jsx"],"mappings":"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"}

package/dist/_chunks/timeline-RgAIzpMd.js

@@ -0,0 +1,220 @@
+import { jsx as e, jsxs as o } from "react/jsx-runtime";
+import { forwardRef as l, useMemo as g, useContext as c, createContext as x } from "react";
+import { c as v } from "./index-D2ZczOXr.js";
+import { useTranslation as C } from "react-i18next";
+import { A as j } from "./avatar-Dcr6XuDQ.js";
+import { C as b } from "./card-BEy58ZKp.js";
+import { T as _ } from "./timestamp-BV2lC-wV.js";
+import { C as z } from "./circle-BkqTgYmt.js";
+import { X as E } from "./x-CCcI3eJp.js";
+import { T as V } from "./triangle-alert-CBPUIzQo.js";
+import { C as S } from "./check-DPdL_Sm7.js";
+import { I as k } from "./info-B9XNKn05.js";
+const f = x({
+  layout: "rail-start",
+  order: "newest-first"
+}), u = x({
+  type: "neutral"
+}), B = v("ds:flex ds:flex-col", {
+  variants: {
+    layout: {
+      "rail-start": "ds:ps-4",
+      "rail-end": "ds:pe-4",
+      alternating: "ds:grid ds:grid-cols-[1fr_2rem_1fr] ds:gap-x-[var(--spacing-md)]"
+    },
+    order: {
+      "newest-first": "ds:flex-col",
+      "oldest-first": "ds:flex-col-reverse"
+    }
+  },
+  defaultVariants: { layout: "rail-start", order: "newest-first" }
+}), O = v(
+  "ds:relative ds:flex ds:gap-[var(--spacing-md)] ds:pb-[var(--spacing-md)]",
+  {
+    variants: {
+      layout: {
+        "rail-start": [
+          "ds:flex-row",
+          // Rail: continuous border on the inline-start of the event list
+          "ds:before:absolute ds:before:top-8 ds:before:bottom-0",
+          "ds:before:border-inline-start-[2px] ds:before:border-[color:var(--border)]",
+          "ds:before:inset-inline-start-[-1rem]",
+          "ds:last:before:hidden"
+        ].join(" "),
+        "rail-end": [
+          "ds:flex-row-reverse",
+          "ds:before:absolute ds:before:top-8 ds:before:bottom-0",
+          "ds:before:border-inline-end-[2px] ds:before:border-[color:var(--border)]",
+          "ds:before:inset-inline-end-[-1rem]",
+          "ds:last:before:hidden"
+        ].join(" "),
+        alternating: "ds:contents"
+      }
+    },
+    defaultVariants: { layout: "rail-start" }
+  }
+), P = v(
+  [
+    "ds:relative ds:z-10 ds:flex ds:items-center ds:justify-center",
+    "ds:rounded-[var(--radius-full)] ds:shrink-0",
+    "ds:size-8",
+    "ds:ring-2 ds:ring-[var(--background)]"
+  ].join(" "),
+  {
+    variants: {
+      type: {
+        info: "ds:bg-[var(--info)] ds:text-[var(--info-solid-foreground)]",
+        success: "ds:bg-[var(--success)] ds:text-[var(--success-solid-foreground)]",
+        warning: "ds:bg-[var(--warning)] ds:text-[var(--warning-solid-foreground)]",
+        error: "ds:bg-[var(--destructive)] ds:text-[var(--destructive-foreground)]",
+        neutral: "ds:bg-[var(--muted)] ds:text-[var(--muted-foreground)]"
+      }
+    },
+    defaultVariants: { type: "neutral" }
+  }
+), R = {
+  info: /* @__PURE__ */ e(k, { size: 16, "aria-hidden": "true" }),
+  success: /* @__PURE__ */ e(S, { size: 16, "aria-hidden": "true" }),
+  warning: /* @__PURE__ */ e(V, { size: 16, "aria-hidden": "true" }),
+  error: /* @__PURE__ */ e(E, { size: 16, "aria-hidden": "true" }),
+  neutral: /* @__PURE__ */ e(z, { size: 16, "aria-hidden": "true" })
+}, h = l(
+  ({
+    layout: r = "rail-start",
+    order: s = "newest-first",
+    className: t,
+    children: i,
+    ...a
+  }, n) => {
+    const d = g(() => ({ layout: r, order: s }), [r, s]);
+    return /* @__PURE__ */ e(f.Provider, { value: d, children: /* @__PURE__ */ e(
+      "ol",
+      {
+        ref: n,
+        "data-component": "timeline",
+        className: B({ layout: r, order: s, className: t }),
+        ...a,
+        children: i
+      }
+    ) });
+  }
+);
+h.displayName = "Timeline";
+const y = l(
+  ({ type: r = "neutral", className: s, children: t, ...i }, a) => {
+    const { layout: n } = c(f), { t: d } = C(), m = g(() => ({ type: r }), [r]);
+    return n === "alternating" ? /* @__PURE__ */ e(u.Provider, { value: m, children: /* @__PURE__ */ o(
+      "li",
+      {
+        ref: a,
+        className: ["ds:contents", s].filter(Boolean).join(" "),
+        ...i,
+        children: [
+          /* @__PURE__ */ e("span", { className: "ds:sr-only", children: d(`ui.timeline.type.${r}`) }),
+          t
+        ]
+      }
+    ) }) : /* @__PURE__ */ e(u.Provider, { value: m, children: /* @__PURE__ */ o(
+      "li",
+      {
+        ref: a,
+        className: O({ layout: n, className: s }),
+        ...i,
+        children: [
+          /* @__PURE__ */ e("span", { className: "ds:sr-only", children: d(`ui.timeline.type.${r}`) }),
+          t
+        ]
+      }
+    ) });
+  }
+);
+y.displayName = "Timeline.Event";
+const T = l(
+  ({ icon: r, className: s, ...t }, i) => {
+    const { type: a } = c(u), { layout: n } = c(f), d = /* @__PURE__ */ e(
+      "div",
+      {
+        ref: i,
+        "aria-hidden": "true",
+        className: P({ type: a, className: s }),
+        ...t,
+        children: r ?? R[a]
+      }
+    );
+    return n === "alternating" ? /* @__PURE__ */ o(
+      "div",
+      {
+        "aria-hidden": "true",
+        className: "ds:col-start-2 ds:flex ds:flex-col ds:items-center",
+        children: [
+          /* @__PURE__ */ e("div", { className: "ds:w-[var(--border-width-md)] ds:flex-1 ds:bg-[var(--border)] ds:first:hidden" }),
+          d,
+          /* @__PURE__ */ e("div", { className: "ds:w-[var(--border-width-md)] ds:flex-1 ds:bg-[var(--border)]" })
+        ]
+      }
+    ) : d;
+  }
+);
+T.displayName = "Timeline.Dot";
+const N = l(
+  ({ title: r, description: s, actor: t, children: i, className: a, ...n }, d) => {
+    const { layout: m } = c(f), p = /* @__PURE__ */ e(
+      "div",
+      {
+        ref: d,
+        className: [
+          "ds:flex-1 ds:min-w-0 ds:pb-[var(--spacing-md)]",
+          "ds:[&_*]:break-normal ds:[&_*]:[overflow-wrap:anywhere]",
+          a
+        ].filter(Boolean).join(" "),
+        ...n,
+        children: /* @__PURE__ */ e(b, { variant: "outlined", children: /* @__PURE__ */ o(b.Body, { children: [
+          /* @__PURE__ */ e("p", { className: "type-label ds:text-[var(--foreground)]", children: r }),
+          s && /* @__PURE__ */ e("p", { className: "ds:mt-[var(--spacing-xs)] type-body-sm ds:text-[var(--muted-foreground)]", children: s }),
+          t && /* @__PURE__ */ o("div", { className: "ds:mt-[var(--spacing-sm)] ds:flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+            /* @__PURE__ */ e(j, { size: "xs", name: t.name, src: t.src }),
+            /* @__PURE__ */ e("span", { className: "type-meta ds:text-[var(--muted-foreground)]", children: t.name })
+          ] }),
+          i
+        ] }) })
+      }
+    );
+    return m === "alternating" ? /* @__PURE__ */ e("div", { className: "ds:col-span-1 ds:[li:nth-child(even)_&]:col-start-3 ds:[li:nth-child(odd)_&]:col-start-1", children: p }) : p;
+  }
+);
+N.displayName = "Timeline.Content";
+const A = 1440 * 60 * 1e3, w = l(
+  ({
+    date: r,
+    relative: s = !0,
+    format: t = { dateStyle: "medium", timeStyle: "short" },
+    className: i,
+    ...a
+  }, n) => /* @__PURE__ */ e(
+    _,
+    {
+      ref: n,
+      value: r,
+      format: s ? "relative" : "absolute",
+      relativeWindow: s ? A : void 0,
+      absoluteFormat: t,
+      className: [
+        "ds:text-[var(--muted-foreground)]",
+        "ds:[font-variant-numeric:var(--font-feature-tabular)]",
+        i
+      ].filter(Boolean).join(" "),
+      ...a
+    }
+  )
+);
+w.displayName = "Timeline.Timestamp";
+const J = Object.assign(h, {
+  Event: y,
+  Dot: T,
+  Content: N,
+  Timestamp: w
+});
+export {
+  J as T
+};
+//# sourceMappingURL=timeline-RgAIzpMd.js.map

package/dist/_chunks/timeline-RgAIzpMd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"timeline-RgAIzpMd.js","sources":["../../src/components/timeline/timeline.tsx"],"sourcesContent":["import { createContext, forwardRef, useContext, useMemo, type HTMLAttributes, type LiHTMLAttributes, type OlHTMLAttributes, type ReactNode, type TimeHTMLAttributes } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { AlertTriangle, Check, Circle, Info, X } from 'lucide-react';\nimport { Avatar } from '../avatar';\nimport { Card } from '../card';\nimport { Timestamp } from '../timestamp';\n\n// TODO: optional @tanstack/react-virtual integration for 500+ events\n\n/* ------------------------------------------------------------------ */\n/* Context                                                             */\n/* ------------------------------------------------------------------ */\n\ntype EventType = 'info' | 'success' | 'warning' | 'error' | 'neutral';\ntype Layout = 'rail-start' | 'rail-end' | 'alternating';\n\ninterface TimelineContextValue {\n  layout: Layout;\n  order: 'newest-first' | 'oldest-first';\n}\n\nconst TimelineContext = createContext<TimelineContextValue>({\n  layout: 'rail-start',\n  order: 'newest-first',\n});\n\ninterface TimelineEventContextValue {\n  type: EventType;\n}\n\nconst TimelineEventContext = createContext<TimelineEventContextValue>({\n  type: 'neutral',\n});\n\n/* ------------------------------------------------------------------ */\n/* CVA — root                                                          */\n/* ------------------------------------------------------------------ */\n\nconst timelineVariants = cva('ds:flex ds:flex-col', {\n  variants: {\n    layout: {\n      'rail-start': 'ds:ps-4',\n      'rail-end': 'ds:pe-4',\n      'alternating': 'ds:grid ds:grid-cols-[1fr_2rem_1fr] ds:gap-x-[var(--spacing-md)]',\n    },\n    order: {\n      'newest-first': 'ds:flex-col',\n      'oldest-first': 'ds:flex-col-reverse',\n    },\n  },\n  defaultVariants: { layout: 'rail-start', order: 'newest-first' },\n});\n\n/* ------------------------------------------------------------------ */\n/* CVA — event item                                                    */\n/* ------------------------------------------------------------------ */\n\nconst eventVariants = cva(\n  'ds:relative ds:flex ds:gap-[var(--spacing-md)] ds:pb-[var(--spacing-md)]',\n  {\n    variants: {\n      layout: {\n        'rail-start': [\n          'ds:flex-row',\n          // Rail: continuous border on the inline-start of the event list\n          'ds:before:absolute ds:before:top-8 ds:before:bottom-0',\n          'ds:before:border-inline-start-[2px] ds:before:border-[color:var(--border)]',\n          'ds:before:inset-inline-start-[-1rem]',\n          'ds:last:before:hidden',\n        ].join(' '),\n        'rail-end': [\n          'ds:flex-row-reverse',\n          'ds:before:absolute ds:before:top-8 ds:before:bottom-0',\n          'ds:before:border-inline-end-[2px] ds:before:border-[color:var(--border)]',\n          'ds:before:inset-inline-end-[-1rem]',\n          'ds:last:before:hidden',\n        ].join(' '),\n        'alternating': 'ds:contents',\n      },\n    },\n    defaultVariants: { layout: 'rail-start' },\n  },\n);\n\n/* ------------------------------------------------------------------ */\n/* CVA — dot                                                           */\n/* ------------------------------------------------------------------ */\n\nconst dotVariants = cva(\n  [\n    'ds:relative ds:z-10 ds:flex ds:items-center ds:justify-center',\n    'ds:rounded-[var(--radius-full)] ds:shrink-0',\n    'ds:size-8',\n    'ds:ring-2 ds:ring-[var(--background)]',\n  ].join(' '),\n  {\n    variants: {\n      type: {\n        info:    'ds:bg-[var(--info)] ds:text-[var(--info-solid-foreground)]',\n        success: 'ds:bg-[var(--success)] ds:text-[var(--success-solid-foreground)]',\n        warning: 'ds:bg-[var(--warning)] ds:text-[var(--warning-solid-foreground)]',\n        error:   'ds:bg-[var(--destructive)] ds:text-[var(--destructive-foreground)]',\n        neutral: 'ds:bg-[var(--muted)] ds:text-[var(--muted-foreground)]',\n      },\n    },\n    defaultVariants: { type: 'neutral' },\n  },\n);\n\n/* ------------------------------------------------------------------ */\n/* Types                                                               */\n/* ------------------------------------------------------------------ */\n\nexport interface TimelineProps\n  extends Omit<OlHTMLAttributes<HTMLOListElement>, 'color'>,\n    VariantProps<typeof timelineVariants> {\n  layout?: Layout;\n  order?: 'newest-first' | 'oldest-first';\n  children: ReactNode;\n  className?: string;\n}\n\nexport interface TimelineEventProps\n  extends LiHTMLAttributes<HTMLLIElement> {\n  type?: EventType;\n  children: ReactNode;\n  className?: string;\n}\n\nexport interface TimelineDotProps\n  extends HTMLAttributes<HTMLDivElement> {\n  icon?: ReactNode;\n  className?: string;\n}\n\nexport interface TimelineContentProps\n  extends HTMLAttributes<HTMLDivElement> {\n  title: string;\n  description?: string;\n  actor?: { name: string; src?: string };\n  children?: ReactNode;\n  className?: string;\n}\n\nexport interface TimelineTimestampProps\n  extends TimeHTMLAttributes<HTMLTimeElement> {\n  date: Date | string;\n  relative?: boolean;\n  format?: Intl.DateTimeFormatOptions;\n  className?: string;\n}\n\n/* ------------------------------------------------------------------ */\n/* Default icons per type                                              */\n/* ------------------------------------------------------------------ */\n\nconst TYPE_ICONS: Record<EventType, ReactNode> = {\n  info:    <Info    size={16} aria-hidden=\"true\" />,\n  success: <Check   size={16} aria-hidden=\"true\" />,\n  warning: <AlertTriangle size={16} aria-hidden=\"true\" />,\n  error:   <X       size={16} aria-hidden=\"true\" />,\n  neutral: <Circle  size={16} aria-hidden=\"true\" />,\n};\n\n/* ------------------------------------------------------------------ */\n/* Timeline root                                                       */\n/* ------------------------------------------------------------------ */\n\nconst TimelineRoot = forwardRef<HTMLOListElement, TimelineProps>(\n  (\n    {\n      layout = 'rail-start',\n      order = 'newest-first',\n      className,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const ctx = useMemo(() => ({ layout, order }), [layout, order]);\n\n    return (\n      <TimelineContext.Provider value={ctx}>\n        <ol\n          ref={ref}\n          data-component=\"timeline\"\n          className={timelineVariants({ layout, order, className })}\n          {...props}\n        >\n          {children}\n        </ol>\n      </TimelineContext.Provider>\n    );\n  },\n);\nTimelineRoot.displayName = 'Timeline';\n\n/* ------------------------------------------------------------------ */\n/* Timeline.Event                                                      */\n/* ------------------------------------------------------------------ */\n\nconst TimelineEvent = forwardRef<HTMLLIElement, TimelineEventProps>(\n  ({ type = 'neutral', className, children, ...props }, ref) => {\n    const { layout } = useContext(TimelineContext);\n    const { t } = useTranslation();\n\n    const evtCtx = useMemo(() => ({ type }), [type]);\n\n    if (layout === 'alternating') {\n      // In alternating layout the <li> uses `contents` so its children\n      // participate directly in the parent grid.\n      return (\n        <TimelineEventContext.Provider value={evtCtx}>\n          <li\n            ref={ref}\n            className={['ds:contents', className].filter(Boolean).join(' ')}\n            {...props}\n          >\n            {/* Visually-hidden type prefix for screen readers */}\n            <span className=\"ds:sr-only\">{t(`ui.timeline.type.${type}`)}</span>\n            {children}\n          </li>\n        </TimelineEventContext.Provider>\n      );\n    }\n\n    return (\n      <TimelineEventContext.Provider value={evtCtx}>\n        <li\n          ref={ref}\n          className={eventVariants({ layout, className })}\n          {...props}\n        >\n          {/* Visually-hidden type prefix for screen readers */}\n          <span className=\"ds:sr-only\">{t(`ui.timeline.type.${type}`)}</span>\n          {children}\n        </li>\n      </TimelineEventContext.Provider>\n    );\n  },\n);\nTimelineEvent.displayName = 'Timeline.Event';\n\n/* ------------------------------------------------------------------ */\n/* Timeline.Dot                                                        */\n/* ------------------------------------------------------------------ */\n\nconst TimelineDot = forwardRef<HTMLDivElement, TimelineDotProps>(\n  ({ icon, className, ...props }, ref) => {\n    const { type } = useContext(TimelineEventContext);\n    const { layout } = useContext(TimelineContext);\n\n    const dot = (\n      <div\n        ref={ref}\n        aria-hidden=\"true\"\n        className={dotVariants({ type, className })}\n        {...props}\n      >\n        {icon ?? TYPE_ICONS[type]}\n      </div>\n    );\n\n    if (layout === 'alternating') {\n      // In alternating grid: col 2 (centre) for the dot with the rail line\n      return (\n        <div\n          aria-hidden=\"true\"\n          className=\"ds:col-start-2 ds:flex ds:flex-col ds:items-center\"\n        >\n          {/* Rail segment above the dot */}\n          <div className=\"ds:w-[var(--border-width-md)] ds:flex-1 ds:bg-[var(--border)] ds:first:hidden\" />\n          {dot}\n          {/* Rail segment below the dot */}\n          <div className=\"ds:w-[var(--border-width-md)] ds:flex-1 ds:bg-[var(--border)]\" />\n        </div>\n      );\n    }\n\n    return dot;\n  },\n);\nTimelineDot.displayName = 'Timeline.Dot';\n\n/* ------------------------------------------------------------------ */\n/* Timeline.Content                                                    */\n/* ------------------------------------------------------------------ */\n\nconst TimelineContent = forwardRef<HTMLDivElement, TimelineContentProps>(\n  ({ title, description, actor, children, className, ...props }, ref) => {\n    const { layout } = useContext(TimelineContext);\n\n    const inner = (\n      <div\n        ref={ref}\n        className={[\n          'ds:flex-1 ds:min-w-0 ds:pb-[var(--spacing-md)]',\n          'ds:[&_*]:break-normal ds:[&_*]:[overflow-wrap:anywhere]',\n          className,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        {...props}\n      >\n        <Card variant=\"outlined\">\n          <Card.Body>\n            <p className=\"type-label ds:text-[var(--foreground)]\">\n              {title}\n            </p>\n            {description && (\n              <p className=\"ds:mt-[var(--spacing-xs)] type-body-sm ds:text-[var(--muted-foreground)]\">\n                {description}\n              </p>\n            )}\n            {actor && (\n              <div className=\"ds:mt-[var(--spacing-sm)] ds:flex ds:items-center ds:gap-[var(--spacing-xs)]\">\n                <Avatar size=\"xs\" name={actor.name} src={actor.src} />\n                <span className=\"type-meta ds:text-[var(--muted-foreground)]\">\n                  {actor.name}\n                </span>\n              </div>\n            )}\n            {children}\n          </Card.Body>\n        </Card>\n      </div>\n    );\n\n    if (layout === 'alternating') {\n      // Alternating: odd events in col 1 (start), even events in col 3 (end).\n      // We use CSS nth-child targeting via a wrapper that sets col placement.\n      return (\n        <div className=\"ds:col-span-1 ds:[li:nth-child(even)_&]:col-start-3 ds:[li:nth-child(odd)_&]:col-start-1\">\n          {inner}\n        </div>\n      );\n    }\n\n    return inner;\n  },\n);\nTimelineContent.displayName = 'Timeline.Content';\n\n/* ------------------------------------------------------------------ */\n/* Timeline.Timestamp — thin wrapper over the shared Timestamp         */\n/* component. Keeps the existing API (`date`, `relative`, `format`)    */\n/* for backward compatibility; adds tabular-nums because timeline      */\n/* timestamps sit in a rail gutter and benefit from column-aligned     */\n/* digits.                                                              */\n/* ------------------------------------------------------------------ */\n\nconst TWENTY_FOUR_HOURS_MS = 24 * 60 * 60 * 1000;\n\nconst TimelineTimestamp = forwardRef<HTMLTimeElement, TimelineTimestampProps>(\n  (\n    {\n      date,\n      relative = true,\n      format = { dateStyle: 'medium', timeStyle: 'short' },\n      className,\n      ...props\n    },\n    ref,\n  ) => (\n    <Timestamp\n      ref={ref}\n      value={date}\n      format={relative ? 'relative' : 'absolute'}\n      relativeWindow={relative ? TWENTY_FOUR_HOURS_MS : undefined}\n      absoluteFormat={format}\n      className={[\n        'ds:text-[var(--muted-foreground)]',\n        'ds:[font-variant-numeric:var(--font-feature-tabular)]',\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      {...props}\n    />\n  ),\n);\nTimelineTimestamp.displayName = 'Timeline.Timestamp';\n\n/* ------------------------------------------------------------------ */\n/* Compound export                                                     */\n/* ------------------------------------------------------------------ */\n\nexport const Timeline = Object.assign(TimelineRoot, {\n  Event: TimelineEvent,\n  Dot: TimelineDot,\n  Content: TimelineContent,\n  Timestamp: TimelineTimestamp,\n});\n\n"],"names":["TimelineContext","createContext","TimelineEventContext","timelineVariants","cva","eventVariants","dotVariants","TYPE_ICONS","jsx","Info","Check","AlertTriangle","X","Circle","TimelineRoot","forwardRef","layout","order","className","children","props","ref","ctx","useMemo","TimelineEvent","type","useContext","t","useTranslation","evtCtx","jsxs","TimelineDot","icon","dot","TimelineContent","title","description","actor","inner","Card","Avatar","TWENTY_FOUR_HOURS_MS","TimelineTimestamp","date","relative","format","Timestamp","Timeline"],"mappings":"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"}