@alfadocs/ui-kit-debug 0.1.8 → 0.1.9

package/dist/_chunks/timeline.agent-CRPza9wc.js

@@ -0,0 +1,279 @@
+import { jsx as e, jsxs as c } from "react/jsx-runtime";
+import { forwardRef as m, useMemo as N, useRef as T, useState as R, useCallback as V, useImperativeHandle as I, useContext as v, createContext as C } from "react";
+import { c as g } from "./index-D2ZczOXr.js";
+import { useTranslation as O } from "react-i18next";
+import { A as P } from "./avatar-Dcr6XuDQ.js";
+import { C as w } from "./card-BEy58ZKp.js";
+import { T as A } from "./timestamp-BV2lC-wV.js";
+import { C as B } from "./circle-BkqTgYmt.js";
+import { X as q } from "./x-CCcI3eJp.js";
+import { T as D } from "./triangle-alert-CBPUIzQo.js";
+import { C as H } from "./check-DPdL_Sm7.js";
+import { I as M } from "./info-B9XNKn05.js";
+const u = C({
+  layout: "rail-start",
+  order: "newest-first"
+}), p = C({
+  type: "neutral"
+}), $ = g("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" }
+}), F = g(
+  "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" }
+  }
+), K = g(
+  [
+    "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" }
+  }
+), U = {
+  info: /* @__PURE__ */ e(M, { size: 16, "aria-hidden": "true" }),
+  success: /* @__PURE__ */ e(H, { size: 16, "aria-hidden": "true" }),
+  warning: /* @__PURE__ */ e(D, { size: 16, "aria-hidden": "true" }),
+  error: /* @__PURE__ */ e(q, { size: 16, "aria-hidden": "true" }),
+  neutral: /* @__PURE__ */ e(B, { size: 16, "aria-hidden": "true" })
+}, E = m(
+  ({
+    layout: t = "rail-start",
+    order: r = "newest-first",
+    className: s,
+    children: i,
+    ...n
+  }, a) => {
+    const d = N(() => ({ layout: t, order: r }), [t, r]), l = T(null), [o, z] = R(null), b = T(null);
+    b.current = o;
+    const h = V((x) => {
+      var y;
+      z(x);
+      const f = (y = l.current) == null ? void 0 : y.querySelector(
+        `[data-event-id="${x}"]`
+      );
+      f == null || f.scrollIntoView({ block: "center", behavior: "auto" });
+    }, []);
+    return I(
+      a,
+      () => ({
+        getSelectedEvent: () => b.current,
+        selectEvent: h
+      }),
+      [h]
+    ), /* @__PURE__ */ e(u.Provider, { value: d, children: /* @__PURE__ */ e(
+      "ol",
+      {
+        ref: l,
+        "data-component": "timeline",
+        "data-component-id": n.id,
+        "data-selected-event": o ?? void 0,
+        className: $({ layout: t, order: r, className: s }),
+        ...n,
+        children: i
+      }
+    ) });
+  }
+);
+E.displayName = "Timeline";
+const S = m(
+  ({ type: t = "neutral", eventId: r, className: s, children: i, ...n }, a) => {
+    const { layout: d } = v(u), { t: l } = O(), o = N(() => ({ type: t }), [t]);
+    return d === "alternating" ? /* @__PURE__ */ e(p.Provider, { value: o, children: /* @__PURE__ */ c(
+      "li",
+      {
+        ref: a,
+        "data-event-id": r,
+        className: ["ds:contents", s].filter(Boolean).join(" "),
+        ...n,
+        children: [
+          /* @__PURE__ */ e("span", { className: "ds:sr-only", children: l(`ui.timeline.type.${t}`) }),
+          i
+        ]
+      }
+    ) }) : /* @__PURE__ */ e(p.Provider, { value: o, children: /* @__PURE__ */ c(
+      "li",
+      {
+        ref: a,
+        "data-event-id": r,
+        className: F({ layout: d, className: s }),
+        ...n,
+        children: [
+          /* @__PURE__ */ e("span", { className: "ds:sr-only", children: l(`ui.timeline.type.${t}`) }),
+          i
+        ]
+      }
+    ) });
+  }
+);
+S.displayName = "Timeline.Event";
+const _ = m(
+  ({ icon: t, className: r, ...s }, i) => {
+    const { type: n } = v(p), { layout: a } = v(u), d = /* @__PURE__ */ e(
+      "div",
+      {
+        ref: i,
+        "aria-hidden": "true",
+        className: K({ type: n, className: r }),
+        ...s,
+        children: t ?? U[n]
+      }
+    );
+    return a === "alternating" ? /* @__PURE__ */ c(
+      "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;
+  }
+);
+_.displayName = "Timeline.Dot";
+const k = m(
+  ({ title: t, description: r, actor: s, children: i, className: n, ...a }, d) => {
+    const { layout: l } = v(u), o = /* @__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]",
+          n
+        ].filter(Boolean).join(" "),
+        ...a,
+        children: /* @__PURE__ */ e(w, { variant: "outlined", children: /* @__PURE__ */ c(w.Body, { children: [
+          /* @__PURE__ */ e("p", { className: "type-label ds:text-[var(--foreground)]", children: t }),
+          r && /* @__PURE__ */ e("p", { className: "ds:mt-[var(--spacing-xs)] type-body-sm ds:text-[var(--muted-foreground)]", children: r }),
+          s && /* @__PURE__ */ c("div", { className: "ds:mt-[var(--spacing-sm)] ds:flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+            /* @__PURE__ */ e(P, { size: "xs", name: s.name, src: s.src }),
+            /* @__PURE__ */ e("span", { className: "type-meta ds:text-[var(--muted-foreground)]", children: s.name })
+          ] }),
+          i
+        ] }) })
+      }
+    );
+    return l === "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: o }) : o;
+  }
+);
+k.displayName = "Timeline.Content";
+const W = 1440 * 60 * 1e3, j = m(
+  ({
+    date: t,
+    relative: r = !0,
+    format: s = { dateStyle: "medium", timeStyle: "short" },
+    className: i,
+    ...n
+  }, a) => /* @__PURE__ */ e(
+    A,
+    {
+      ref: a,
+      value: t,
+      format: r ? "relative" : "absolute",
+      relativeWindow: r ? W : void 0,
+      absoluteFormat: s,
+      className: [
+        "ds:text-[var(--muted-foreground)]",
+        "ds:[font-variant-numeric:var(--font-feature-tabular)]",
+        i
+      ].filter(Boolean).join(" "),
+      ...n
+    }
+  )
+);
+j.displayName = "Timeline.Timestamp";
+const ie = Object.assign(E, {
+  Event: S,
+  Dot: _,
+  Content: k,
+  Timestamp: j
+}), ae = {
+  id: "timeline",
+  capabilities: ["pick", "range_navigate"],
+  state: {
+    selectedEvent: {
+      type: "string | null",
+      descriptionKey: "ui.agent.timeline.state.selectedEvent",
+      description: "Opaque event id of the currently-active event, or null.",
+      read: (t) => t.getSelectedEvent()
+    }
+  },
+  actions: {
+    select_event: {
+      safety: "read",
+      argsType: "{ id: string }",
+      descriptionKey: "ui.agent.timeline.actions.selectEvent",
+      description: "Scroll the given event into view and mark it as selected.",
+      invoke: (t, r) => {
+        t.selectEvent(r.id);
+      }
+    }
+  },
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "timeline",
+      description: "Marks the Timeline root."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    },
+    item: {
+      attr: "data-event-id",
+      description: "Opaque event id emitted on each Timeline.Event when the `eventId` prop is provided."
+    }
+  }
+};
+export {
+  ie as T,
+  ae as t
+};
+//# sourceMappingURL=timeline.agent-CRPza9wc.js.map

package/dist/_chunks/timeline.agent-CRPza9wc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"timeline.agent-CRPza9wc.js","sources":["../../src/components/timeline/timeline.tsx","../../src/components/timeline/timeline.agent.ts"],"sourcesContent":["import {\n  createContext,\n  forwardRef,\n  useCallback,\n  useContext,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type LiHTMLAttributes,\n  type OlHTMLAttributes,\n  type ReactNode,\n  type TimeHTMLAttributes,\n} 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  /** Opaque event id — when set, the component emits `data-event-id` for agent addressing. */\n  eventId?: string;\n  children: ReactNode;\n  className?: string;\n}\n\n/** Curated imperative handle for agent / external automation. */\nexport interface TimelineHandle {\n  getSelectedEvent: () => string | null;\n  selectEvent: (id: string) => void;\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<TimelineHandle, 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    const olRef = useRef<HTMLOListElement | null>(null);\n    const [selectedEvent, setSelectedEvent] = useState<string | null>(null);\n    const latestRef = useRef<string | null>(null);\n    latestRef.current = selectedEvent;\n\n    const selectEvent = useCallback((id: string) => {\n      setSelectedEvent(id);\n      const target = olRef.current?.querySelector(\n        `[data-event-id=\"${id}\"]`,\n      ) as HTMLElement | null;\n      target?.scrollIntoView({ block: 'center', behavior: 'auto' });\n    }, []);\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        getSelectedEvent: () => latestRef.current,\n        selectEvent,\n      }),\n      [selectEvent],\n    );\n\n    return (\n      <TimelineContext.Provider value={ctx}>\n        <ol\n          ref={olRef}\n          data-component=\"timeline\"\n          data-component-id={props.id}\n          data-selected-event={selectedEvent ?? undefined}\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', eventId, 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            data-event-id={eventId}\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          data-event-id={eventId}\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","/* -------------------------------------------------------------------- */\n/* Agent adapter — Timeline.                                              */\n/* -------------------------------------------------------------------- */\n\nimport type { AgentAdapter } from '../../agent/types';\nimport type { TimelineHandle } from './timeline';\n\nexport const timelineAgent: AgentAdapter<TimelineHandle> = {\n  id: 'timeline',\n  capabilities: ['pick', 'range_navigate'],\n  state: {\n    selectedEvent: {\n      type: 'string | null',\n      descriptionKey: 'ui.agent.timeline.state.selectedEvent',\n      description: 'Opaque event id of the currently-active event, or null.',\n      read: (handle) => handle.getSelectedEvent(),\n    },\n  },\n  actions: {\n    select_event: {\n      safety: 'read',\n      argsType: '{ id: string }',\n      descriptionKey: 'ui.agent.timeline.actions.selectEvent',\n      description: 'Scroll the given event into view and mark it as selected.',\n      invoke: (handle, args: { id: string }) => {\n        handle.selectEvent(args.id);\n      },\n    },\n  },\n  domHooks: {\n    root: {\n      attr: 'data-component',\n      value: 'timeline',\n      description: 'Marks the Timeline root.',\n    },\n    instanceId: {\n      attr: 'data-component-id',\n      sourceProp: 'id',\n      description: 'Sourced from the id prop.',\n    },\n    item: {\n      attr: 'data-event-id',\n      description: 'Opaque event id emitted on each Timeline.Event when the `eventId` prop is provided.',\n    },\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","olRef","useRef","selectedEvent","setSelectedEvent","useState","latestRef","selectEvent","useCallback","id","target","_a","useImperativeHandle","TimelineEvent","type","eventId","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","timelineAgent","handle","args"],"mappings":"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"}