@alfadocs/ui-kit-debug 0.1.8 → 0.1.9

package/dist/_chunks/list.agent-D0iWt4VI.js

@@ -0,0 +1,420 @@
+import { jsx as r, jsxs as U, Fragment as Y } from "react/jsx-runtime";
+import { forwardRef as J, useState as G, useMemo as B, useRef as Q, useCallback as u, useImperativeHandle as Z, useContext as $, useLayoutEffect as V, Children as C, isValidElement as ee, createContext as te } from "react";
+import { c as W } from "./index-D2ZczOXr.js";
+import { useTranslation as se } from "react-i18next";
+const z = te({
+  selection: "none",
+  selectedValues: /* @__PURE__ */ new Set(),
+  focusedValue: null,
+  disabled: !1,
+  enabledItemValues: [],
+  onItemSelect: () => {
+  },
+  onItemFocus: () => {
+  },
+  onItemKeyDown: () => {
+  },
+  registerItemRef: () => {
+  },
+  divider: "spaced"
+}), ie = W("ds:flex ds:flex-col ds:p-0 ds:m-0", {
+  variants: {
+    divider: {
+      spaced: "",
+      divided: "",
+      bordered: "ds:border ds:border-[color:var(--border)] ds:rounded-[var(--radius-md)] ds:overflow-hidden"
+    },
+    density: {
+      compact: "ds:gap-[var(--spacing-xs)]",
+      default: "ds:gap-[var(--spacing-sm)]",
+      relaxed: "ds:gap-[var(--spacing-md)]"
+    },
+    ordered: {
+      true: "ds:list-decimal ds:ps-[var(--spacing-lg)]",
+      false: "ds:list-none"
+    }
+  },
+  defaultVariants: {
+    divider: "spaced",
+    density: "default",
+    ordered: !1
+  }
+}), re = W(
+  "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)]",
+  {
+    variants: {
+      divider: {
+        spaced: "",
+        divided: "ds:[&:not(:last-child)]:[border-block-end:1px_solid_var(--border)]",
+        bordered: "ds:[&:not(:last-child)]:[border-block-end:1px_solid_var(--border)]"
+      },
+      interactive: {
+        // flex lives on the outer <div role="option"> so it doesn't suppress ::marker on <li>
+        true: [
+          "ds:flex ds:items-center ds:gap-x-[var(--spacing-sm)]",
+          "ds:min-h-[var(--min-target-size)] ds:cursor-pointer ds:select-none",
+          "ds:rounded-[var(--radius-sm)]",
+          "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+          "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+          "ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]"
+        ].join(" "),
+        // no flex here — <li> keeps display:list-item so ::marker renders correctly
+        false: ""
+      },
+      selected: {
+        true: "",
+        false: ""
+      },
+      disabled: {
+        true: "",
+        false: ""
+      }
+    },
+    compoundVariants: [
+      {
+        interactive: !0,
+        selected: !1,
+        disabled: !1,
+        className: "ds:hover:bg-[color:var(--muted)]/20"
+      },
+      {
+        interactive: !0,
+        selected: !0,
+        className: "ds:bg-[color:var(--primary)]/10"
+      },
+      {
+        interactive: !0,
+        disabled: !0,
+        className: "ds:opacity-50 ds:cursor-not-allowed ds:pointer-events-none"
+      }
+    ],
+    defaultVariants: {
+      divider: "spaced",
+      interactive: !1,
+      selected: !1,
+      disabled: !1
+    }
+  }
+);
+function ne(t) {
+  const p = [];
+  return C.forEach(t, (x) => {
+    if (!ee(x)) return;
+    const h = x.props;
+    typeof h.value == "string" && p.push({ value: h.value, disabled: !!h.disabled });
+  }), p;
+}
+const T = J(
+  ({
+    as: t = "ul",
+    start: p,
+    divider: x = "spaced",
+    density: h = "default",
+    selection: S = "none",
+    value: y,
+    defaultValue: N,
+    onValueChange: v,
+    disabled: o = !1,
+    className: k,
+    children: l,
+    "aria-label": F,
+    ...n
+  }, H) => {
+    const { t: O } = se(), a = S !== "none", b = S === "multiple", L = y !== void 0, [_, P] = G(() => N === void 0 ? [] : Array.isArray(N) ? N : [N]), c = B(() => {
+      if (L) {
+        const e = y;
+        return new Set(Array.isArray(e) ? e : [e]);
+      }
+      return new Set(_);
+    }, [L, y, _]), j = B(() => ne(l), [l]), f = B(
+      () => j.filter((e) => !e.disabled && !o).map((e) => e.value),
+      [j, o]
+    ), [I, g] = G(null), D = Q(/* @__PURE__ */ new Map()), q = u((e, i) => {
+      i ? D.current.set(e, i) : D.current.delete(e);
+    }, []), w = u((e) => {
+      g(e), requestAnimationFrame(() => {
+        var i;
+        (i = D.current.get(e)) == null || i.focus();
+      });
+    }, []), m = u(
+      (e) => {
+        L || P(e), b ? v == null || v(e) : v == null || v(e[0] ?? "");
+      },
+      [L, b, v]
+    ), R = u(
+      (e) => {
+        if (!o && a)
+          if (b) {
+            const i = [...c];
+            c.has(e) ? m(i.filter((s) => s !== e)) : m([...i, e]);
+          } else
+            c.has(e) ? m([]) : m([e]);
+      },
+      [o, a, b, c, m]
+    ), K = u((e) => {
+      g(e);
+    }, []), M = u(
+      (e, i) => {
+        if (!a) return;
+        const s = f.indexOf(i);
+        switch (e.key) {
+          case "ArrowDown": {
+            e.preventDefault();
+            const d = f[s + 1];
+            d !== void 0 && w(d);
+            break;
+          }
+          case "ArrowUp": {
+            e.preventDefault();
+            const d = f[s - 1];
+            d !== void 0 && w(d);
+            break;
+          }
+          case "Home": {
+            e.preventDefault();
+            const d = f[0];
+            d !== void 0 && w(d);
+            break;
+          }
+          case "End": {
+            e.preventDefault();
+            const d = f[f.length - 1];
+            d !== void 0 && w(d);
+            break;
+          }
+          case " ":
+          case "Enter": {
+            e.preventDefault(), R(i);
+            break;
+          }
+        }
+      },
+      [a, f, w, R]
+    ), A = {
+      selection: S,
+      selectedValues: c,
+      focusedValue: I,
+      disabled: o,
+      enabledItemValues: f,
+      onItemSelect: R,
+      onItemFocus: K,
+      onItemKeyDown: M,
+      registerItemRef: q,
+      divider: x
+    }, E = ie({ divider: x, density: h, ordered: t === "ol", className: k });
+    if (Z(
+      H,
+      () => ({
+        getSelection: () => Array.from(c),
+        setSelection: (e) => {
+          a && m(b ? e : e.slice(0, 1));
+        },
+        clearSelection: () => {
+          a && m([]);
+        }
+      }),
+      [c, a, b, m]
+    ), a) {
+      const e = F ?? O("ui.list.label", "List");
+      return /* @__PURE__ */ r(z.Provider, { value: A, children: /* @__PURE__ */ r(
+        "div",
+        {
+          role: "listbox",
+          "aria-label": e,
+          "aria-multiselectable": b ? !0 : void 0,
+          "aria-disabled": o ? !0 : void 0,
+          className: E,
+          "data-component": "list",
+          "data-component-id": n.id,
+          ...n,
+          children: l
+        }
+      ) });
+    }
+    return t === "ol" ? /* @__PURE__ */ r(z.Provider, { value: A, children: /* @__PURE__ */ r(
+      "ol",
+      {
+        role: "list",
+        start: p,
+        className: E,
+        "data-component": "list",
+        "data-component-id": n.id,
+        ...n,
+        children: l
+      }
+    ) }) : /* @__PURE__ */ r(z.Provider, { value: A, children: /* @__PURE__ */ r(
+      "ul",
+      {
+        role: "list",
+        className: E,
+        "data-component": "list",
+        "data-component-id": n.id,
+        ...n,
+        children: l
+      }
+    ) });
+  }
+);
+T.displayName = "List";
+const X = J(
+  ({
+    value: t,
+    leading: p,
+    title: x,
+    description: h,
+    trailing: S,
+    lineClamp: y,
+    disabled: N = !1,
+    className: v,
+    onClick: o,
+    onFocus: k,
+    onKeyDown: l,
+    ...F
+  }, n) => {
+    const {
+      selection: H,
+      selectedValues: O,
+      focusedValue: a,
+      disabled: b,
+      enabledItemValues: L,
+      onItemSelect: _,
+      onItemFocus: P,
+      onItemKeyDown: c,
+      registerItemRef: j,
+      divider: f
+    } = $(z), I = H !== "none", g = b || N, D = t !== void 0 ? O.has(t) : !1, q = t !== void 0 && a === t, w = t !== void 0 && L[0] === t, m = I ? a !== null ? q && !g ? 0 : -1 : w && !g ? 0 : -1 : void 0, R = Q(null);
+    V(() => {
+      const s = R.current;
+      s && (y != null ? s.style.setProperty("--list-item-clamp", String(y)) : s.style.removeProperty("--list-item-clamp"));
+    }, [y]);
+    const K = u(
+      (s) => {
+        t && j(t, s), typeof n == "function" ? n(s) : n && (n.current = s);
+      },
+      [t, j, n]
+    ), M = u(
+      (s) => {
+        I && t && !g && _(t), o == null || o(s);
+      },
+      [I, t, g, _, o]
+    ), A = u(
+      (s) => {
+        t && P(t), k == null || k(s);
+      },
+      [t, P, k]
+    ), E = u(
+      (s) => {
+        t && c(s, t), l == null || l(s);
+      },
+      [t, c, l]
+    ), e = re({
+      divider: f,
+      interactive: I,
+      selected: D,
+      disabled: g,
+      className: v
+    }), i = /* @__PURE__ */ U(Y, { children: [
+      p && /* @__PURE__ */ r("span", { className: "ds:shrink-0 ds:flex ds:items-center ds:justify-center", children: p }),
+      /* @__PURE__ */ U("div", { className: "ds:flex-1 ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:min-w-0", children: [
+        /* @__PURE__ */ r("span", { className: "ds:text-[color:var(--foreground)] ds:text-[length:var(--font-size-sm)] ds:font-medium ds:leading-[var(--line-height-base)] ds:[overflow-wrap:anywhere]", children: x }),
+        h && /* @__PURE__ */ r(
+          "span",
+          {
+            ref: R,
+            className: [
+              "ds:text-[color:var(--muted-foreground)] ds:text-[length:var(--font-size-xs)] ds:leading-[var(--line-height-base)]",
+              y != null ? "ds:[overflow:hidden] ds:[display:-webkit-box] ds:[-webkit-box-orient:vertical] ds:[-webkit-line-clamp:var(--list-item-clamp)]" : ""
+            ].filter(Boolean).join(" "),
+            children: h
+          }
+        )
+      ] }),
+      S && /* @__PURE__ */ r("span", { className: "ds:shrink-0 ds:flex ds:items-center ds:justify-center", children: S })
+    ] });
+    return I ? /* @__PURE__ */ r(
+      "div",
+      {
+        ref: K,
+        role: "option",
+        "aria-selected": D,
+        "aria-disabled": g ? !0 : void 0,
+        tabIndex: m,
+        onClick: M,
+        onFocus: A,
+        onKeyDown: E,
+        className: e,
+        "data-item-id": t,
+        ...F,
+        children: i
+      }
+    ) : /* @__PURE__ */ r(
+      "li",
+      {
+        ref: K,
+        onClick: M,
+        onFocus: A,
+        onKeyDown: E,
+        className: e,
+        "data-item-id": t,
+        ...F,
+        children: /* @__PURE__ */ r("div", { className: "ds:flex ds:items-center ds:gap-x-[var(--spacing-sm)]", children: i })
+      }
+    );
+  }
+);
+X.displayName = "List.Item";
+const ce = Object.assign(T, {
+  Root: T,
+  Item: X
+}), fe = {
+  id: "list",
+  capabilities: ["select_single", "select_multiple"],
+  state: {
+    selection: {
+      type: "string[]",
+      descriptionKey: "ui.agent.list.state.selection",
+      description: "Ids of currently-selected list items. Empty array when none selected or list is presentational.",
+      read: (t) => t.getSelection()
+    }
+  },
+  actions: {
+    set_selection: {
+      safety: "read",
+      argsType: "{ ids: string[] }",
+      descriptionKey: "ui.agent.list.actions.setSelection",
+      description: "Replace the current selection with the given item ids. No-op on presentational lists.",
+      invoke: (t, p) => {
+        t.setSelection(p.ids);
+      }
+    },
+    clear_selection: {
+      safety: "read",
+      descriptionKey: "ui.agent.list.actions.clearSelection",
+      description: "Deselect all items.",
+      invoke: (t) => {
+        t.clearSelection();
+      }
+    }
+  },
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "list",
+      description: "Marks the List root."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    },
+    item: {
+      attr: "data-item-id",
+      description: "Opaque item id; sourced from each ListItem `value` prop. Emitted only when `value` is set."
+    }
+  }
+};
+export {
+  ce as L,
+  fe as l
+};
+//# sourceMappingURL=list.agent-D0iWt4VI.js.map

package/dist/_chunks/list.agent-D0iWt4VI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.agent-D0iWt4VI.js","sources":["../../src/components/list/list.tsx","../../src/components/list/list.agent.ts"],"sourcesContent":["import {\n  Children,\n  createContext,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useContext,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type ReactNode,\n} from 'react';\nimport { cva } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\n\n/* ------------------------------------------------------------------ */\n/* Context                                                             */\n/* ------------------------------------------------------------------ */\n\ninterface ListContextValue {\n  selection: 'none' | 'single' | 'multiple';\n  selectedValues: Set<string>;\n  focusedValue: string | null;\n  disabled: boolean;\n  enabledItemValues: string[];\n  onItemSelect: (value: string) => void;\n  onItemFocus: (value: string) => void;\n  onItemKeyDown: (e: KeyboardEvent<HTMLElement>, value: string) => void;\n  registerItemRef: (value: string, el: HTMLElement | null) => void;\n  divider: 'spaced' | 'divided' | 'bordered';\n}\n\nconst ListContext = createContext<ListContextValue>({\n  selection: 'none',\n  selectedValues: new Set(),\n  focusedValue: null,\n  disabled: false,\n  enabledItemValues: [],\n  onItemSelect: () => {},\n  onItemFocus: () => {},\n  onItemKeyDown: () => {},\n  registerItemRef: () => {},\n  divider: 'spaced',\n});\n\n/* ------------------------------------------------------------------ */\n/* CVA variants                                                        */\n/* ------------------------------------------------------------------ */\n\nconst listVariants = cva('ds:flex ds:flex-col ds:p-0 ds:m-0', {\n  variants: {\n    divider: {\n      spaced: '',\n      divided: '',\n      bordered:\n        'ds:border ds:border-[color:var(--border)] ds:rounded-[var(--radius-md)] ds:overflow-hidden',\n    },\n    density: {\n      compact: 'ds:gap-[var(--spacing-xs)]',\n      default: 'ds:gap-[var(--spacing-sm)]',\n      relaxed: 'ds:gap-[var(--spacing-md)]',\n    },\n    ordered: {\n      true: 'ds:list-decimal ds:ps-[var(--spacing-lg)]',\n      false: 'ds:list-none',\n    },\n  },\n  defaultVariants: {\n    divider: 'spaced',\n    density: 'default',\n    ordered: false,\n  },\n});\n\nconst listItemVariants = cva(\n  'ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)]',\n  {\n    variants: {\n      divider: {\n        spaced: '',\n        divided: 'ds:[&:not(:last-child)]:[border-block-end:1px_solid_var(--border)]',\n        bordered: 'ds:[&:not(:last-child)]:[border-block-end:1px_solid_var(--border)]',\n      },\n      interactive: {\n        // flex lives on the outer <div role=\"option\"> so it doesn't suppress ::marker on <li>\n        true: [\n          'ds:flex ds:items-center ds:gap-x-[var(--spacing-sm)]',\n          'ds:min-h-[var(--min-target-size)] ds:cursor-pointer ds:select-none',\n          'ds:rounded-[var(--radius-sm)]',\n          'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n          'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n          'ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n        ].join(' '),\n        // no flex here — <li> keeps display:list-item so ::marker renders correctly\n        false: '',\n      },\n      selected: {\n        true: '',\n        false: '',\n      },\n      disabled: {\n        true: '',\n        false: '',\n      },\n    },\n    compoundVariants: [\n      {\n        interactive: true,\n        selected: false,\n        disabled: false,\n        className: 'ds:hover:bg-[color:var(--muted)]/20',\n      },\n      {\n        interactive: true,\n        selected: true,\n        className: 'ds:bg-[color:var(--primary)]/10',\n      },\n      {\n        interactive: true,\n        disabled: true,\n        className: 'ds:opacity-50 ds:cursor-not-allowed ds:pointer-events-none',\n      },\n    ],\n    defaultVariants: {\n      divider: 'spaced',\n      interactive: false,\n      selected: false,\n      disabled: false,\n    },\n  },\n);\n\n/* ------------------------------------------------------------------ */\n/* Types                                                               */\n/* ------------------------------------------------------------------ */\n\n/** Curated imperative handle for agent / external automation. */\nexport interface ListHandle {\n  getSelection: () => string[];\n  setSelection: (ids: string[]) => void;\n  clearSelection: () => void;\n}\n\nexport interface ListProps extends HTMLAttributes<HTMLElement> {\n  as?: 'ul' | 'ol';\n  start?: number;\n  divider?: 'spaced' | 'divided' | 'bordered';\n  density?: 'compact' | 'default' | 'relaxed';\n  selection?: 'none' | 'single' | 'multiple';\n  value?: string | string[];\n  defaultValue?: string | string[];\n  onValueChange?: (value: string | string[]) => void;\n  disabled?: boolean;\n  children: ReactNode;\n  className?: string;\n}\n\nexport interface ListItemProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {\n  value?: string;\n  leading?: ReactNode;\n  title: ReactNode;\n  description?: ReactNode;\n  trailing?: ReactNode;\n  lineClamp?: number;\n  disabled?: boolean;\n  className?: string;\n}\n\n/* ------------------------------------------------------------------ */\n/* Helpers                                                             */\n/* ------------------------------------------------------------------ */\n\nfunction collectItemInfo(children: ReactNode): Array<{ value: string; disabled: boolean }> {\n  const items: Array<{ value: string; disabled: boolean }> = [];\n  Children.forEach(children, (child) => {\n    if (!isValidElement(child)) return;\n    const props = child.props as { value?: unknown; disabled?: unknown };\n    if (typeof props.value === 'string') {\n      items.push({ value: props.value, disabled: Boolean(props.disabled) });\n    }\n  });\n  return items;\n}\n\n/* ------------------------------------------------------------------ */\n/* ListRoot                                                            */\n/* ------------------------------------------------------------------ */\n\nconst ListRoot = forwardRef<ListHandle, ListProps>(\n  (\n    {\n      as = 'ul',\n      start,\n      divider = 'spaced',\n      density = 'default',\n      selection = 'none',\n      value: controlledValue,\n      defaultValue,\n      onValueChange,\n      disabled = false,\n      className,\n      children,\n      'aria-label': ariaLabel,\n      ...props\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation();\n    const isSelectable = selection !== 'none';\n    const isMultiple = selection === 'multiple';\n    const isControlled = controlledValue !== undefined;\n\n    const [internalValue, setInternalValue] = useState<string[]>(() => {\n      if (defaultValue === undefined) return [];\n      return Array.isArray(defaultValue) ? defaultValue : [defaultValue];\n    });\n\n    const selectedValues = useMemo<Set<string>>(() => {\n      if (isControlled) {\n        const v = controlledValue!;\n        return new Set(Array.isArray(v) ? v : [v]);\n      }\n      return new Set(internalValue);\n    }, [isControlled, controlledValue, internalValue]);\n\n    const allItemInfo = useMemo(() => collectItemInfo(children), [children]);\n    const enabledItemValues = useMemo(\n      () => allItemInfo.filter((i) => !i.disabled && !disabled).map((i) => i.value),\n      [allItemInfo, disabled],\n    );\n\n    const [focusedValue, setFocusedValue] = useState<string | null>(null);\n\n    const itemRefs = useRef<Map<string, HTMLElement>>(new Map());\n\n    const registerItemRef = useCallback((value: string, el: HTMLElement | null) => {\n      if (el) {\n        itemRefs.current.set(value, el);\n      } else {\n        itemRefs.current.delete(value);\n      }\n    }, []);\n\n    const focusItem = useCallback((value: string) => {\n      setFocusedValue(value);\n      requestAnimationFrame(() => {\n        itemRefs.current.get(value)?.focus();\n      });\n    }, []);\n\n    const commit = useCallback(\n      (next: string[]) => {\n        if (!isControlled) setInternalValue(next);\n        if (isMultiple) {\n          onValueChange?.(next);\n        } else {\n          onValueChange?.(next[0] ?? '');\n        }\n      },\n      [isControlled, isMultiple, onValueChange],\n    );\n\n    const handleItemSelect = useCallback(\n      (itemValue: string) => {\n        if (disabled) return;\n        if (!isSelectable) return;\n        if (isMultiple) {\n          const current = [...selectedValues];\n          if (selectedValues.has(itemValue)) {\n            commit(current.filter((v) => v !== itemValue));\n          } else {\n            commit([...current, itemValue]);\n          }\n        } else {\n          if (selectedValues.has(itemValue)) {\n            commit([]);\n          } else {\n            commit([itemValue]);\n          }\n        }\n      },\n      [disabled, isSelectable, isMultiple, selectedValues, commit],\n    );\n\n    const handleItemFocus = useCallback((value: string) => {\n      setFocusedValue(value);\n    }, []);\n\n    const handleItemKeyDown = useCallback(\n      (e: KeyboardEvent<HTMLElement>, itemValue: string) => {\n        if (!isSelectable) return;\n        const currentIndex = enabledItemValues.indexOf(itemValue);\n\n        switch (e.key) {\n          case 'ArrowDown': {\n            e.preventDefault();\n            const next = enabledItemValues[currentIndex + 1];\n            if (next !== undefined) focusItem(next);\n            break;\n          }\n          case 'ArrowUp': {\n            e.preventDefault();\n            const prev = enabledItemValues[currentIndex - 1];\n            if (prev !== undefined) focusItem(prev);\n            break;\n          }\n          case 'Home': {\n            e.preventDefault();\n            const first = enabledItemValues[0];\n            if (first !== undefined) focusItem(first);\n            break;\n          }\n          case 'End': {\n            e.preventDefault();\n            const last = enabledItemValues[enabledItemValues.length - 1];\n            if (last !== undefined) focusItem(last);\n            break;\n          }\n          case ' ':\n          case 'Enter': {\n            e.preventDefault();\n            handleItemSelect(itemValue);\n            break;\n          }\n        }\n      },\n      [isSelectable, enabledItemValues, focusItem, handleItemSelect],\n    );\n\n    const ctxValue: ListContextValue = {\n      selection,\n      selectedValues,\n      focusedValue,\n      disabled,\n      enabledItemValues,\n      onItemSelect: handleItemSelect,\n      onItemFocus: handleItemFocus,\n      onItemKeyDown: handleItemKeyDown,\n      registerItemRef,\n      divider,\n    };\n\n    const classes = listVariants({ divider, density, ordered: as === 'ol', className });\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        getSelection: () => Array.from(selectedValues),\n        setSelection: (ids: string[]) => {\n          if (!isSelectable) return;\n          commit(isMultiple ? ids : ids.slice(0, 1));\n        },\n        clearSelection: () => {\n          if (!isSelectable) return;\n          commit([]);\n        },\n      }),\n      [selectedValues, isSelectable, isMultiple, commit],\n    );\n\n    if (isSelectable) {\n      if (import.meta.env.DEV && !ariaLabel && !props['aria-labelledby']) {\n        console.warn(\n          'List: a selectable list (role=\"listbox\") should have an accessible name. ' +\n            'Pass aria-label or aria-labelledby to satisfy WCAG 4.1.2.',\n        );\n      }\n      const resolvedAriaLabel = ariaLabel ?? t('ui.list.label', 'List');\n      return (\n        <ListContext.Provider value={ctxValue}>\n          <div\n            role=\"listbox\"\n            aria-label={resolvedAriaLabel}\n            aria-multiselectable={isMultiple ? true : undefined}\n            aria-disabled={disabled ? true : undefined}\n            className={classes}\n            data-component=\"list\"\n            data-component-id={props.id}\n            {...props}\n          >\n            {children}\n          </div>\n        </ListContext.Provider>\n      );\n    }\n\n    if (as === 'ol') {\n      return (\n        <ListContext.Provider value={ctxValue}>\n          <ol\n            role=\"list\"\n            start={start}\n            className={classes}\n            data-component=\"list\"\n            data-component-id={props.id}\n            {...(props as HTMLAttributes<HTMLOListElement>)}\n          >\n            {children}\n          </ol>\n        </ListContext.Provider>\n      );\n    }\n\n    return (\n      <ListContext.Provider value={ctxValue}>\n        <ul\n          role=\"list\"\n          className={classes}\n          data-component=\"list\"\n          data-component-id={props.id}\n          {...(props as HTMLAttributes<HTMLUListElement>)}\n        >\n          {children}\n        </ul>\n      </ListContext.Provider>\n    );\n  },\n);\nListRoot.displayName = 'List';\n\n/* ------------------------------------------------------------------ */\n/* ListItem                                                            */\n/* ------------------------------------------------------------------ */\n\nconst ListItem = forwardRef<HTMLElement, ListItemProps>(\n  (\n    {\n      value,\n      leading,\n      title,\n      description,\n      trailing,\n      lineClamp,\n      disabled: itemDisabled = false,\n      className,\n      onClick,\n      onFocus,\n      onKeyDown,\n      ...props\n    },\n    ref,\n  ) => {\n    const {\n      selection,\n      selectedValues,\n      focusedValue,\n      disabled: groupDisabled,\n      enabledItemValues,\n      onItemSelect,\n      onItemFocus,\n      onItemKeyDown,\n      registerItemRef,\n      divider,\n    } = useContext(ListContext);\n\n    const isSelectable = selection !== 'none';\n    const isDisabled = groupDisabled || itemDisabled;\n    const isSelected = value !== undefined ? selectedValues.has(value) : false;\n    const isFocused = value !== undefined && focusedValue === value;\n    const isFirstEnabled = value !== undefined && enabledItemValues[0] === value;\n    const tabIndex = isSelectable\n      ? focusedValue !== null\n        ? isFocused && !isDisabled\n          ? 0\n          : -1\n        : isFirstEnabled && !isDisabled\n          ? 0\n          : -1\n      : undefined;\n\n    const descRef = useRef<HTMLSpanElement>(null);\n    useLayoutEffect(() => {\n      const el = descRef.current;\n      if (!el) return;\n      if (lineClamp != null) {\n        el.style.setProperty('--list-item-clamp', String(lineClamp));\n      } else {\n        el.style.removeProperty('--list-item-clamp');\n      }\n    }, [lineClamp]);\n\n    const internalRef = useCallback(\n      (el: HTMLElement | null) => {\n        if (value) registerItemRef(value, el);\n        if (typeof ref === 'function') {\n          ref(el);\n        } else if (ref) {\n          (ref as React.MutableRefObject<HTMLElement | null>).current = el;\n        }\n      },\n      [value, registerItemRef, ref],\n    );\n\n    const handleClick = useCallback(\n      (e: React.MouseEvent<HTMLElement>) => {\n        if (isSelectable && value && !isDisabled) {\n          onItemSelect(value);\n        }\n        (onClick as React.MouseEventHandler<HTMLElement> | undefined)?.(e);\n      },\n      [isSelectable, value, isDisabled, onItemSelect, onClick],\n    );\n\n    const handleFocus = useCallback(\n      (e: React.FocusEvent<HTMLElement>) => {\n        if (value) onItemFocus(value);\n        (onFocus as React.FocusEventHandler<HTMLElement> | undefined)?.(e);\n      },\n      [value, onItemFocus, onFocus],\n    );\n\n    const handleKeyDown = useCallback(\n      (e: KeyboardEvent<HTMLElement>) => {\n        if (value) onItemKeyDown(e, value);\n        (onKeyDown as React.KeyboardEventHandler<HTMLElement> | undefined)?.(e);\n      },\n      [value, onItemKeyDown, onKeyDown],\n    );\n\n    const itemClasses = listItemVariants({\n      divider,\n      interactive: isSelectable,\n      selected: isSelected,\n      disabled: isDisabled,\n      className,\n    });\n\n    const content = (\n      <>\n        {leading && (\n          <span className=\"ds:shrink-0 ds:flex ds:items-center ds:justify-center\">\n            {leading}\n          </span>\n        )}\n        <div className=\"ds:flex-1 ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:min-w-0\">\n          <span className=\"ds:text-[color:var(--foreground)] ds:text-[length:var(--font-size-sm)] ds:font-medium ds:leading-[var(--line-height-base)] ds:[overflow-wrap:anywhere]\">\n            {title}\n          </span>\n          {description && (\n            <span\n              ref={descRef}\n              className={[\n                'ds:text-[color:var(--muted-foreground)] ds:text-[length:var(--font-size-xs)] ds:leading-[var(--line-height-base)]',\n                lineClamp != null\n                  ? 'ds:[overflow:hidden] ds:[display:-webkit-box] ds:[-webkit-box-orient:vertical] ds:[-webkit-line-clamp:var(--list-item-clamp)]'\n                  : '',\n              ]\n                .filter(Boolean)\n                .join(' ')}\n            >\n              {description}\n            </span>\n          )}\n        </div>\n        {trailing && (\n          <span className=\"ds:shrink-0 ds:flex ds:items-center ds:justify-center\">\n            {trailing}\n          </span>\n        )}\n      </>\n    );\n\n    if (isSelectable) {\n      return (\n        <div\n          ref={internalRef as React.Ref<HTMLDivElement>}\n          role=\"option\"\n          aria-selected={isSelected}\n          aria-disabled={isDisabled ? true : undefined}\n          tabIndex={tabIndex}\n          onClick={handleClick}\n          onFocus={handleFocus}\n          onKeyDown={handleKeyDown}\n          className={itemClasses}\n          data-item-id={value}\n          {...props}\n        >\n          {content}\n        </div>\n      );\n    }\n\n    return (\n      <li\n        ref={internalRef as React.Ref<HTMLLIElement>}\n        onClick={handleClick}\n        onFocus={handleFocus}\n        onKeyDown={handleKeyDown}\n        className={itemClasses}\n        data-item-id={value}\n        {...props}\n      >\n        {/* Inner flex wrapper keeps <li> as display:list-item so ::marker renders */}\n        <div className=\"ds:flex ds:items-center ds:gap-x-[var(--spacing-sm)]\">\n          {content}\n        </div>\n      </li>\n    );\n  },\n);\nListItem.displayName = 'List.Item';\n\n/* ------------------------------------------------------------------ */\n/* Compound export                                                     */\n/* ------------------------------------------------------------------ */\n\nexport const List = Object.assign(ListRoot, {\n  Root: ListRoot,\n  Item: ListItem,\n});\n\nexport type { ListContextValue };\n","/* -------------------------------------------------------------------- */\n/* Agent adapter — List.                                                  */\n/*                                                                        */\n/* The agent surface is only meaningful for selectable lists (`selection` */\n/* prop set to `single` or `multiple`). Presentational lists still emit   */\n/* the root + item DOM hooks so the registry can address them, but the    */\n/* state and actions are no-ops when selection is `none`.                 */\n/* -------------------------------------------------------------------- */\n\nimport type { AgentAdapter } from '../../agent/types';\nimport type { ListHandle } from './list';\n\nexport const listAgent: AgentAdapter<ListHandle> = {\n  id: 'list',\n  capabilities: ['select_single', 'select_multiple'],\n  state: {\n    selection: {\n      type: 'string[]',\n      descriptionKey: 'ui.agent.list.state.selection',\n      description: 'Ids of currently-selected list items. Empty array when none selected or list is presentational.',\n      read: (handle) => handle.getSelection(),\n    },\n  },\n  actions: {\n    set_selection: {\n      safety: 'read',\n      argsType: '{ ids: string[] }',\n      descriptionKey: 'ui.agent.list.actions.setSelection',\n      description: 'Replace the current selection with the given item ids. No-op on presentational lists.',\n      invoke: (handle, args: { ids: string[] }) => {\n        handle.setSelection(args.ids);\n      },\n    },\n    clear_selection: {\n      safety: 'read',\n      descriptionKey: 'ui.agent.list.actions.clearSelection',\n      description: 'Deselect all items.',\n      invoke: (handle) => {\n        handle.clearSelection();\n      },\n    },\n  },\n  domHooks: {\n    root: {\n      attr: 'data-component',\n      value: 'list',\n      description: 'Marks the List 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-item-id',\n      description: 'Opaque item id; sourced from each ListItem `value` prop. Emitted only when `value` is set.',\n    },\n  },\n};\n"],"names":["ListContext","createContext","listVariants","cva","listItemVariants","collectItemInfo","children","items","Children","child","isValidElement","props","ListRoot","forwardRef","as","start","divider","density","selection","controlledValue","defaultValue","onValueChange","disabled","className","ariaLabel","ref","t","useTranslation","isSelectable","isMultiple","isControlled","internalValue","setInternalValue","useState","selectedValues","useMemo","v","allItemInfo","enabledItemValues","i","focusedValue","setFocusedValue","itemRefs","useRef","registerItemRef","useCallback","value","el","focusItem","_a","commit","next","handleItemSelect","itemValue","current","handleItemFocus","handleItemKeyDown","currentIndex","prev","first","last","ctxValue","classes","useImperativeHandle","ids","resolvedAriaLabel","jsx","ListItem","leading","title","description","trailing","lineClamp","itemDisabled","onClick","onFocus","onKeyDown","groupDisabled","onItemSelect","onItemFocus","onItemKeyDown","useContext","isDisabled","isSelected","isFocused","isFirstEnabled","tabIndex","descRef","useLayoutEffect","internalRef","handleClick","e","handleFocus","handleKeyDown","itemClasses","content","jsxs","Fragment","List","listAgent","handle","args"],"mappings":";;;;AAoCA,MAAMA,IAAcC,GAAgC;AAAA,EAClD,WAAW;AAAA,EACX,oCAAoB,IAAA;AAAA,EACpB,cAAc;AAAA,EACd,UAAU;AAAA,EACV,mBAAmB,CAAA;AAAA,EACnB,cAAc,MAAM;AAAA,EAAC;AAAA,EACrB,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,eAAe,MAAM;AAAA,EAAC;AAAA,EACtB,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,SAAS;AACX,CAAC,GAMKC,KAAeC,EAAI,qCAAqC;AAAA,EAC5D,UAAU;AAAA,IACR,SAAS;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,UACE;AAAA,IAAA;AAAA,IAEJ,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,IAAA;AAAA,IAEX,SAAS;AAAA,MACP,MAAM;AAAA,MACN,OAAO;AAAA,IAAA;AAAA,EACT;AAAA,EAEF,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,SAAS;AAAA,IACT,SAAS;AAAA,EAAA;AAEb,CAAC,GAEKC,KAAmBD;AAAA,EACvB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,UAAU;AAAA,MAAA;AAAA,MAEZ,aAAa;AAAA;AAAA,QAEX,MAAM;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA,EACA,KAAK,GAAG;AAAA;AAAA,QAEV,OAAO;AAAA,MAAA;AAAA,MAET,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAET,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,IACT;AAAA,IAEF,kBAAkB;AAAA,MAChB;AAAA,QACE,aAAa;AAAA,QACb,UAAU;AAAA,QACV,UAAU;AAAA,QACV,WAAW;AAAA,MAAA;AAAA,MAEb;AAAA,QACE,aAAa;AAAA,QACb,UAAU;AAAA,QACV,WAAW;AAAA,MAAA;AAAA,MAEb;AAAA,QACE,aAAa;AAAA,QACb,UAAU;AAAA,QACV,WAAW;AAAA,MAAA;AAAA,IACb;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,aAAa;AAAA,MACb,UAAU;AAAA,MACV,UAAU;AAAA,IAAA;AAAA,EACZ;AAEJ;AA0CA,SAASE,GAAgBC,GAAkE;AACzF,QAAMC,IAAqD,CAAA;AAC3D,SAAAC,EAAS,QAAQF,GAAU,CAACG,MAAU;AACpC,QAAI,CAACC,GAAeD,CAAK,EAAG;AAC5B,UAAME,IAAQF,EAAM;AACpB,IAAI,OAAOE,EAAM,SAAU,YACzBJ,EAAM,KAAK,EAAE,OAAOI,EAAM,OAAO,UAAU,EAAQA,EAAM,UAAW;AAAA,EAExE,CAAC,GACMJ;AACT;AAMA,MAAMK,IAAWC;AAAA,EACf,CACE;AAAA,IACE,IAAAC,IAAK;AAAA,IACL,OAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,SAAAC,IAAU;AAAA,IACV,WAAAC,IAAY;AAAA,IACZ,OAAOC;AAAA,IACP,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,WAAAC;AAAA,IACA,UAAAjB;AAAA,IACA,cAAckB;AAAA,IACd,GAAGb;AAAA,EAAA,GAELc,MACG;AACH,UAAM,EAAE,GAAAC,EAAA,IAAMC,GAAA,GACRC,IAAeV,MAAc,QAC7BW,IAAaX,MAAc,YAC3BY,IAAeX,MAAoB,QAEnC,CAACY,GAAeC,CAAgB,IAAIC,EAAmB,MACvDb,MAAiB,SAAkB,CAAA,IAChC,MAAM,QAAQA,CAAY,IAAIA,IAAe,CAACA,CAAY,CAClE,GAEKc,IAAiBC,EAAqB,MAAM;AAChD,UAAIL,GAAc;AAChB,cAAMM,IAAIjB;AACV,eAAO,IAAI,IAAI,MAAM,QAAQiB,CAAC,IAAIA,IAAI,CAACA,CAAC,CAAC;AAAA,MAC3C;AACA,aAAO,IAAI,IAAIL,CAAa;AAAA,IAC9B,GAAG,CAACD,GAAcX,GAAiBY,CAAa,CAAC,GAE3CM,IAAcF,EAAQ,MAAM9B,GAAgBC,CAAQ,GAAG,CAACA,CAAQ,CAAC,GACjEgC,IAAoBH;AAAA,MACxB,MAAME,EAAY,OAAO,CAACE,MAAM,CAACA,EAAE,YAAY,CAACjB,CAAQ,EAAE,IAAI,CAACiB,MAAMA,EAAE,KAAK;AAAA,MAC5E,CAACF,GAAaf,CAAQ;AAAA,IAAA,GAGlB,CAACkB,GAAcC,CAAe,IAAIR,EAAwB,IAAI,GAE9DS,IAAWC,EAAiC,oBAAI,KAAK,GAErDC,IAAkBC,EAAY,CAACC,GAAeC,MAA2B;AAC7E,MAAIA,IACFL,EAAS,QAAQ,IAAII,GAAOC,CAAE,IAE9BL,EAAS,QAAQ,OAAOI,CAAK;AAAA,IAEjC,GAAG,CAAA,CAAE,GAECE,IAAYH,EAAY,CAACC,MAAkB;AAC/C,MAAAL,EAAgBK,CAAK,GACrB,sBAAsB,MAAM;;AAC1B,SAAAG,IAAAP,EAAS,QAAQ,IAAII,CAAK,MAA1B,QAAAG,EAA6B;AAAA,MAC/B,CAAC;AAAA,IACH,GAAG,CAAA,CAAE,GAECC,IAASL;AAAA,MACb,CAACM,MAAmB;AAClB,QAAKrB,KAAcE,EAAiBmB,CAAI,GACpCtB,IACFR,KAAA,QAAAA,EAAgB8B,KAEhB9B,KAAA,QAAAA,EAAgB8B,EAAK,CAAC,KAAK;AAAA,MAE/B;AAAA,MACA,CAACrB,GAAcD,GAAYR,CAAa;AAAA,IAAA,GAGpC+B,IAAmBP;AAAA,MACvB,CAACQ,MAAsB;AACrB,YAAI,CAAA/B,KACCM;AACL,cAAIC,GAAY;AACd,kBAAMyB,IAAU,CAAC,GAAGpB,CAAc;AAClC,YAAIA,EAAe,IAAImB,CAAS,IAC9BH,EAAOI,EAAQ,OAAO,CAAClB,MAAMA,MAAMiB,CAAS,CAAC,IAE7CH,EAAO,CAAC,GAAGI,GAASD,CAAS,CAAC;AAAA,UAElC;AACE,YAAInB,EAAe,IAAImB,CAAS,IAC9BH,EAAO,CAAA,CAAE,IAETA,EAAO,CAACG,CAAS,CAAC;AAAA,MAGxB;AAAA,MACA,CAAC/B,GAAUM,GAAcC,GAAYK,GAAgBgB,CAAM;AAAA,IAAA,GAGvDK,IAAkBV,EAAY,CAACC,MAAkB;AACrD,MAAAL,EAAgBK,CAAK;AAAA,IACvB,GAAG,CAAA,CAAE,GAECU,IAAoBX;AAAA,MACxB,CAAC,GAA+BQ,MAAsB;AACpD,YAAI,CAACzB,EAAc;AACnB,cAAM6B,IAAenB,EAAkB,QAAQe,CAAS;AAExD,gBAAQ,EAAE,KAAA;AAAA,UACR,KAAK,aAAa;AAChB,cAAE,eAAA;AACF,kBAAMF,IAAOb,EAAkBmB,IAAe,CAAC;AAC/C,YAAIN,MAAS,UAAWH,EAAUG,CAAI;AACtC;AAAA,UACF;AAAA,UACA,KAAK,WAAW;AACd,cAAE,eAAA;AACF,kBAAMO,IAAOpB,EAAkBmB,IAAe,CAAC;AAC/C,YAAIC,MAAS,UAAWV,EAAUU,CAAI;AACtC;AAAA,UACF;AAAA,UACA,KAAK,QAAQ;AACX,cAAE,eAAA;AACF,kBAAMC,IAAQrB,EAAkB,CAAC;AACjC,YAAIqB,MAAU,UAAWX,EAAUW,CAAK;AACxC;AAAA,UACF;AAAA,UACA,KAAK,OAAO;AACV,cAAE,eAAA;AACF,kBAAMC,IAAOtB,EAAkBA,EAAkB,SAAS,CAAC;AAC3D,YAAIsB,MAAS,UAAWZ,EAAUY,CAAI;AACtC;AAAA,UACF;AAAA,UACA,KAAK;AAAA,UACL,KAAK,SAAS;AACZ,cAAE,eAAA,GACFR,EAAiBC,CAAS;AAC1B;AAAA,UACF;AAAA,QAAA;AAAA,MAEJ;AAAA,MACA,CAACzB,GAAcU,GAAmBU,GAAWI,CAAgB;AAAA,IAAA,GAGzDS,IAA6B;AAAA,MACjC,WAAA3C;AAAA,MACA,gBAAAgB;AAAA,MACA,cAAAM;AAAA,MACA,UAAAlB;AAAA,MACA,mBAAAgB;AAAA,MACA,cAAcc;AAAA,MACd,aAAaG;AAAA,MACb,eAAeC;AAAA,MACf,iBAAAZ;AAAA,MACA,SAAA5B;AAAA,IAAA,GAGI8C,IAAU5D,GAAa,EAAE,SAAAc,GAAS,SAAAC,GAAS,SAASH,MAAO,MAAM,WAAAS,GAAW;AAkBlF,QAhBAwC;AAAA,MACEtC;AAAA,MACA,OAAO;AAAA,QACL,cAAc,MAAM,MAAM,KAAKS,CAAc;AAAA,QAC7C,cAAc,CAAC8B,MAAkB;AAC/B,UAAKpC,KACLsB,EAAOrB,IAAamC,IAAMA,EAAI,MAAM,GAAG,CAAC,CAAC;AAAA,QAC3C;AAAA,QACA,gBAAgB,MAAM;AACpB,UAAKpC,KACLsB,EAAO,CAAA,CAAE;AAAA,QACX;AAAA,MAAA;AAAA,MAEF,CAAChB,GAAgBN,GAAcC,GAAYqB,CAAM;AAAA,IAAA,GAG/CtB,GAAc;AAOhB,YAAMqC,IAAoBzC,KAAaE,EAAE,iBAAiB,MAAM;AAChE,+BACG1B,EAAY,UAAZ,EAAqB,OAAO6D,GAC3B,UAAA,gBAAAK;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,cAAYD;AAAA,UACZ,wBAAsBpC,IAAa,KAAO;AAAA,UAC1C,iBAAeP,IAAW,KAAO;AAAA,UACjC,WAAWwC;AAAA,UACX,kBAAe;AAAA,UACf,qBAAmBnD,EAAM;AAAA,UACxB,GAAGA;AAAA,UAEH,UAAAL;AAAA,QAAA;AAAA,MAAA,GAEL;AAAA,IAEJ;AAEA,WAAIQ,MAAO,yBAENd,EAAY,UAAZ,EAAqB,OAAO6D,GAC3B,UAAA,gBAAAK;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAAnD;AAAA,QACA,WAAW+C;AAAA,QACX,kBAAe;AAAA,QACf,qBAAmBnD,EAAM;AAAA,QACxB,GAAIA;AAAA,QAEJ,UAAAL;AAAA,MAAA;AAAA,IAAA,GAEL,sBAKDN,EAAY,UAAZ,EAAqB,OAAO6D,GAC3B,UAAA,gBAAAK;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAWJ;AAAA,QACX,kBAAe;AAAA,QACf,qBAAmBnD,EAAM;AAAA,QACxB,GAAIA;AAAA,QAEJ,UAAAL;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,EAEJ;AACF;AACAM,EAAS,cAAc;AAMvB,MAAMuD,IAAWtD;AAAA,EACf,CACE;AAAA,IACE,OAAAiC;AAAA,IACA,SAAAsB;AAAA,IACA,OAAAC;AAAA,IACA,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAUC,IAAe;AAAA,IACzB,WAAAlD;AAAA,IACA,SAAAmD;AAAA,IACA,SAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGjE;AAAA,EAAA,GAELc,MACG;AACH,UAAM;AAAA,MACJ,WAAAP;AAAA,MACA,gBAAAgB;AAAA,MACA,cAAAM;AAAA,MACA,UAAUqC;AAAA,MACV,mBAAAvC;AAAA,MACA,cAAAwC;AAAA,MACA,aAAAC;AAAA,MACA,eAAAC;AAAA,MACA,iBAAApC;AAAA,MACA,SAAA5B;AAAA,IAAA,IACEiE,EAAWjF,CAAW,GAEpB4B,IAAeV,MAAc,QAC7BgE,IAAaL,KAAiBJ,GAC9BU,IAAarC,MAAU,SAAYZ,EAAe,IAAIY,CAAK,IAAI,IAC/DsC,IAAYtC,MAAU,UAAaN,MAAiBM,GACpDuC,IAAiBvC,MAAU,UAAaR,EAAkB,CAAC,MAAMQ,GACjEwC,IAAW1D,IACbY,MAAiB,OACf4C,KAAa,CAACF,IACZ,IACA,KACFG,KAAkB,CAACH,IACjB,IACA,KACJ,QAEEK,IAAU5C,EAAwB,IAAI;AAC5C,IAAA6C,EAAgB,MAAM;AACpB,YAAMzC,IAAKwC,EAAQ;AACnB,MAAKxC,MACDyB,KAAa,OACfzB,EAAG,MAAM,YAAY,qBAAqB,OAAOyB,CAAS,CAAC,IAE3DzB,EAAG,MAAM,eAAe,mBAAmB;AAAA,IAE/C,GAAG,CAACyB,CAAS,CAAC;AAEd,UAAMiB,IAAc5C;AAAA,MAClB,CAACE,MAA2B;AAC1B,QAAID,KAAOF,EAAgBE,GAAOC,CAAE,GAChC,OAAOtB,KAAQ,aACjBA,EAAIsB,CAAE,IACGtB,MACRA,EAAmD,UAAUsB;AAAA,MAElE;AAAA,MACA,CAACD,GAAOF,GAAiBnB,CAAG;AAAA,IAAA,GAGxBiE,IAAc7C;AAAA,MAClB,CAAC8C,MAAqC;AACpC,QAAI/D,KAAgBkB,KAAS,CAACoC,KAC5BJ,EAAahC,CAAK,GAEnB4B,KAAA,QAAAA,EAA+DiB;AAAA,MAClE;AAAA,MACA,CAAC/D,GAAckB,GAAOoC,GAAYJ,GAAcJ,CAAO;AAAA,IAAA,GAGnDkB,IAAc/C;AAAA,MAClB,CAAC8C,MAAqC;AACpC,QAAI7C,OAAmBA,CAAK,GAC3B6B,KAAA,QAAAA,EAA+DgB;AAAA,MAClE;AAAA,MACA,CAAC7C,GAAOiC,GAAaJ,CAAO;AAAA,IAAA,GAGxBkB,IAAgBhD;AAAA,MACpB,CAAC8C,MAAkC;AACjC,QAAI7C,KAAOkC,EAAcW,GAAG7C,CAAK,GAChC8B,KAAA,QAAAA,EAAoEe;AAAA,MACvE;AAAA,MACA,CAAC7C,GAAOkC,GAAeJ,CAAS;AAAA,IAAA,GAG5BkB,IAAc1F,GAAiB;AAAA,MACnC,SAAAY;AAAA,MACA,aAAaY;AAAA,MACb,UAAUuD;AAAA,MACV,UAAUD;AAAA,MACV,WAAA3D;AAAA,IAAA,CACD,GAEKwE,IACJ,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,MAAA7B,uBACE,QAAA,EAAK,WAAU,yDACb,UAAAA,GACH;AAAA,MAEF,gBAAA4B,EAAC,OAAA,EAAI,WAAU,uEACb,UAAA;AAAA,0BAAC,QAAA,EAAK,WAAU,0JACb,UAAA3B,GACH;AAAA,QACCC,KACC,gBAAAJ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAKqB;AAAA,YACL,WAAW;AAAA,cACT;AAAA,cACAf,KAAa,OACT,kIACA;AAAA,YAAA,EAEH,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,YAEV,UAAAF;AAAA,UAAA;AAAA,QAAA;AAAA,MACH,GAEJ;AAAA,MACCC,uBACE,QAAA,EAAK,WAAU,yDACb,UAAAA,GACH;AAAA,IAAA,GAEJ;AAGF,WAAI3C,IAEA,gBAAAsC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAKuB;AAAA,QACL,MAAK;AAAA,QACL,iBAAeN;AAAA,QACf,iBAAeD,IAAa,KAAO;AAAA,QACnC,UAAAI;AAAA,QACA,SAASI;AAAA,QACT,SAASE;AAAA,QACT,WAAWC;AAAA,QACX,WAAWC;AAAA,QACX,gBAAchD;AAAA,QACb,GAAGnC;AAAA,QAEH,UAAAoF;AAAA,MAAA;AAAA,IAAA,IAML,gBAAA7B;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAKuB;AAAA,QACL,SAASC;AAAA,QACT,SAASE;AAAA,QACT,WAAWC;AAAA,QACX,WAAWC;AAAA,QACX,gBAAchD;AAAA,QACb,GAAGnC;AAAA,QAGJ,4BAAC,OAAA,EAAI,WAAU,wDACZ,UAAAoF,GACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AACA5B,EAAS,cAAc;AAMhB,MAAM+B,KAAO,OAAO,OAAOtF,GAAU;AAAA,EAC1C,MAAMA;AAAA,EACN,MAAMuD;AACR,CAAC,GCzlBYgC,KAAsC;AAAA,EACjD,IAAI;AAAA,EACJ,cAAc,CAAC,iBAAiB,iBAAiB;AAAA,EACjD,OAAO;AAAA,IACL,WAAW;AAAA,MACT,MAAM;AAAA,MACN,gBAAgB;AAAA,MAChB,aAAa;AAAA,MACb,MAAM,CAACC,MAAWA,EAAO,aAAA;AAAA,IAAa;AAAA,EACxC;AAAA,EAEF,SAAS;AAAA,IACP,eAAe;AAAA,MACb,QAAQ;AAAA,MACR,UAAU;AAAA,MACV,gBAAgB;AAAA,MAChB,aAAa;AAAA,MACb,QAAQ,CAACA,GAAQC,MAA4B;AAC3C,QAAAD,EAAO,aAAaC,EAAK,GAAG;AAAA,MAC9B;AAAA,IAAA;AAAA,IAEF,iBAAiB;AAAA,MACf,QAAQ;AAAA,MACR,gBAAgB;AAAA,MAChB,aAAa;AAAA,MACb,QAAQ,CAACD,MAAW;AAClB,QAAAA,EAAO,eAAA;AAAA,MACT;AAAA,IAAA;AAAA,EACF;AAAA,EAEF,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,IAEf,YAAY;AAAA,MACV,MAAM;AAAA,MACN,YAAY;AAAA,MACZ,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ;"}

package/dist/_chunks/{message-card-qAp2-WQK.js → message-card-qhoGv947.js}

@@ -160,6 +160,7 @@ const Q = R(
         ref: z,
         role: "listitem",
         "data-component": "message-card",
+        "data-component-id": e.id,
         "data-read": e.read ? "true" : "false",
         "data-leaving": b ? "true" : void 0,
         "aria-hidden": b || void 0,
@@ -273,4 +274,4 @@ export {
   Q as M,
   O as i
 };
-//# sourceMappingURL=message-card-qAp2-WQK.js.map
+//# sourceMappingURL=message-card-qhoGv947.js.map

package/dist/_chunks/message-card-qhoGv947.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"message-card-qhoGv947.js","sources":["../../src/components/message-card/message-card.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { X } from 'lucide-react';\nimport { IconButton } from '../button/icon-button';\nimport { Button } from '../button/button';\nimport { Avatar } from '../avatar/avatar';\nimport { Timestamp } from '../timestamp';\n\n/* ------------------------------------------------------------------ */\n/* Types                                                               */\n/* ------------------------------------------------------------------ */\n\nexport interface MessageSender {\n  /** Display name — drives the avatar's deterministic colour + initials. */\n  name: string;\n  /** Optional avatar image URL. */\n  avatarUrl?: string;\n}\n\nexport interface MessageItem {\n  /** Unique identifier for the message (or thread). */\n  id: string;\n  /** Sender identity — avatar + bold display name. */\n  sender: MessageSender;\n  /** Optional subject / conversation title. Rendered bold when unread. */\n  subject?: string;\n  /** Last-message preview — rendered as plain text, clamped to two lines. */\n  preview: string;\n  /** ISO-8601 timestamp of when the message was sent. */\n  sentAt: string;\n  /** Whether the message has been seen. Unread items get accent styling. */\n  read?: boolean;\n  /** Optional deep link — when present the card row is an anchor. */\n  url?: string;\n  /**\n   * Count of unread messages inside a thread. Rendered as an end-aligned\n   * badge when greater than 1.\n   */\n  unreadCount?: number;\n}\n\nexport interface MessageCardProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick' | 'role' | 'title'>,\n    VariantProps<typeof cardVariants> {\n  /** The message to render. */\n  item: MessageItem;\n  /**\n   * Layout shape.\n   * - `compact` — single-line row with the whole card clickable (used by\n   *   MessageTray).\n   * - `dashboard` — bordered block with explicit CTA and mark-as-read\n   *   controls (used by dashboards / sidebars).\n   */\n  variant?: 'compact' | 'dashboard';\n  /** Visual density. */\n  size?: 'sm' | 'md';\n  /** Fires when the row / title is activated. */\n  onActivate?: (item: MessageItem) => void;\n  /** Fires when the dismiss control is activated. */\n  onDismiss?: (item: MessageItem) => void;\n  /**\n   * Label for the dashboard-variant CTA. Only rendered when `variant` is\n   * `'dashboard'` and the item has a `url`.\n   */\n  ctaLabel?: string;\n  /**\n   * Label for the dashboard-variant mark-as-read link. Only rendered when\n   * `variant` is `'dashboard'` and `onDismiss` is supplied.\n   */\n  dismissLabel?: string;\n  /**\n   * External exit-animation control. When supplied the card plays its\n   * fade-out when this turns `true` and the consumer owns the subsequent\n   * unmount (see MessageTray). If omitted, the card self-manages the\n   * exit on internal dismiss.\n   */\n  leaving?: boolean;\n}\n\n/* ------------------------------------------------------------------ */\n/* CVA                                                                 */\n/* ------------------------------------------------------------------ */\n\nconst cardVariants = cva(\n  [\n    'ds:relative ds:flex ds:gap-[var(--spacing-sm)]',\n    'ds:rounded-[var(--radius-sm)]',\n    'ds:transition-colors',\n    'ds:motion-safe:animate-in ds:motion-safe:fade-in-0 ds:motion-safe:slide-in-from-top-2 ds:motion-safe:duration-[var(--animation-duration)]',\n    'ds:data-[leaving=true]:motion-safe:animate-out ds:data-[leaving=true]:motion-safe:fade-out-0 ds:data-[leaving=true]:motion-safe:slide-out-to-top-2',\n    'ds:data-[leaving=true]:motion-safe:fill-mode-forwards',\n    'ds:data-[leaving=true]:pointer-events-none',\n    'ds:motion-reduce:transition-none',\n    'ds:text-start',\n    'ds:forced-colors:border ds:forced-colors:border-[CanvasText]',\n  ].join(' '),\n  {\n    variants: {\n      variant: {\n        compact: 'ds:items-start ds:group',\n        dashboard:\n          'ds:flex-col ds:sm:flex-row ds:items-stretch ds:sm:items-start ds:border ds:border-[color:var(--border)] ds:bg-[color:var(--card)]',\n      },\n      size: {\n        sm: 'ds:p-[var(--spacing-sm)]',\n        md: 'ds:p-[var(--spacing-md)]',\n      },\n      state: {\n        unread: '',\n        read: 'ds:bg-transparent',\n      },\n    },\n    compoundVariants: [\n      {\n        variant: 'compact',\n        state: 'unread',\n        class: 'ds:bg-[color:var(--accent)]/5',\n      },\n      {\n        variant: 'compact',\n        state: 'read',\n        class: 'ds:hover:bg-[color:var(--muted)]/40',\n      },\n      {\n        variant: 'dashboard',\n        state: 'unread',\n        class: 'ds:bg-[color:var(--accent)]/5',\n      },\n    ],\n    defaultVariants: {\n      variant: 'compact',\n      size: 'sm',\n      state: 'read',\n    },\n  },\n);\n\nconst stretchedLinkClass = [\n  'ds:focus-visible:outline-none',\n  \"ds:after:content-[''] ds:after:absolute ds:after:inset-0 ds:after:rounded-[var(--radius-sm)]\",\n  'ds:after:pointer-events-auto',\n  'ds:focus-visible:after:outline-[length:var(--focus-ring-width)]',\n  'ds:focus-visible:after:outline-solid',\n  'ds:focus-visible:after:outline-[color:var(--ring)]',\n  'ds:focus-visible:after:outline-offset-[length:var(--focus-ring-offset)]',\n  'ds:forced-colors:focus-visible:after:outline-[CanvasText]',\n].join(' ');\n\n/* ------------------------------------------------------------------ */\n/* Helpers                                                             */\n/* ------------------------------------------------------------------ */\n\nexport function isSafeMessageUrl(url: string): boolean {\n  // Reject protocol-relative (//host), javascript:, data:, mailto: etc.\n  // Only http(s), same-origin absolute paths (/), and hash (#) anchors pass.\n  return /^(https?:\\/\\/(?!\\/)|\\/(?!\\/)|#)/.test(url);\n}\n\n/* ------------------------------------------------------------------ */\n/* Component                                                           */\n/* ------------------------------------------------------------------ */\n\nexport const MessageCard = forwardRef<HTMLDivElement, MessageCardProps>(\n  (\n    {\n      item,\n      variant = 'compact',\n      size = 'sm',\n      onActivate,\n      onDismiss,\n      ctaLabel,\n      dismissLabel,\n      leaving,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { t, i18n } = useTranslation();\n\n    const accessibleTime = useMemo(() => {\n      const date = new Date(item.sentAt);\n      if (Number.isNaN(date.getTime())) return '';\n      return new Intl.DateTimeFormat(i18n.language, {\n        dateStyle: 'medium',\n        timeStyle: 'short',\n      }).format(date);\n    }, [item.sentAt, i18n.language]);\n\n    const isControlledLeaving = leaving !== undefined;\n    const [isLeaving, setIsLeaving] = useState(false);\n    const dismissTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    const effectiveLeaving = isControlledLeaving ? leaving : isLeaving;\n\n    const prefersReducedMotion =\n      typeof window !== 'undefined' &&\n      typeof window.matchMedia === 'function' &&\n      window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n\n    const handleDismiss = useCallback(() => {\n      if (!onDismiss) return;\n      if (isControlledLeaving || prefersReducedMotion) {\n        onDismiss(item);\n        return;\n      }\n      setIsLeaving(true);\n      if (dismissTimerRef.current) clearTimeout(dismissTimerRef.current);\n      const raw =\n        (typeof window !== 'undefined' &&\n          window\n            .getComputedStyle(document.documentElement)\n            .getPropertyValue('--animation-duration')) ||\n        '200ms';\n      const ms = raw.trim().endsWith('ms')\n        ? parseFloat(raw)\n        : parseFloat(raw) * 1000;\n      dismissTimerRef.current = setTimeout(\n        () => onDismiss(item),\n        Number.isFinite(ms) ? ms : 200,\n      );\n    }, [onDismiss, item, isControlledLeaving, prefersReducedMotion]);\n\n    const state = item.read ? 'read' : 'unread';\n\n    const unreadSuffix = item.read\n      ? ''\n      : t('ui.messageCard.unreadSuffix', ', unread');\n    const subjectFragment = item.subject\n      ? t('ui.messageCard.subjectFragment', {\n          subject: item.subject,\n          defaultValue: ' — {{subject}}',\n        })\n      : '';\n    const ariaLabel = t('ui.messageCard.itemLabel', {\n      sender: item.sender.name,\n      subjectFragment,\n      time: accessibleTime,\n      unreadSuffix,\n      defaultValue:\n        'Message from {{sender}}{{subjectFragment}}, {{time}}{{unreadSuffix}}',\n    });\n\n    const hasSafeUrl = !!item.url && isSafeMessageUrl(item.url);\n\n    /* ------- Sender-name rendering (stretched link in compact mode) ------ */\n\n    const senderText = (\n      <span\n        className={[\n          'ds:flex-1 ds:min-w-0 ds:truncate',\n          item.read ? 'ds:font-normal' : 'ds:font-semibold',\n        ].join(' ')}\n      >\n        {item.sender.name}\n      </span>\n    );\n\n    let senderNode: ReactNode;\n    if (variant === 'compact' && hasSafeUrl && onActivate) {\n      senderNode = (\n        <a\n          href={item.url}\n          aria-label={ariaLabel}\n          className={stretchedLinkClass + ' ds:contents'}\n          onClick={(event) => {\n            if (\n              event.defaultPrevented ||\n              event.metaKey ||\n              event.ctrlKey ||\n              event.shiftKey\n            )\n              return;\n            onActivate(item);\n          }}\n        >\n          {senderText}\n        </a>\n      );\n    } else if (variant === 'compact' && onActivate) {\n      senderNode = (\n        <button\n          type=\"button\"\n          aria-label={ariaLabel}\n          className={stretchedLinkClass + ' ds:contents ds:bg-transparent ds:border-0 ds:p-0'}\n          onClick={() => onActivate(item)}\n        >\n          {senderText}\n        </button>\n      );\n    } else if (variant === 'dashboard' && hasSafeUrl && onActivate) {\n      senderNode = (\n        <a\n          href={item.url}\n          className=\"ds:text-[color:var(--foreground)] ds:no-underline ds:hover:underline ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]\"\n          onClick={(event) => {\n            if (\n              event.defaultPrevented ||\n              event.metaKey ||\n              event.ctrlKey ||\n              event.shiftKey\n            )\n              return;\n            onActivate(item);\n          }}\n        >\n          {senderText}\n        </a>\n      );\n    } else {\n      senderNode = senderText;\n    }\n\n    const showThreadCount =\n      typeof item.unreadCount === 'number' && item.unreadCount > 1;\n\n    return (\n      <div\n        ref={ref}\n        role=\"listitem\"\n        data-component=\"message-card\"\n        data-component-id={item.id}\n        data-read={item.read ? 'true' : 'false'}\n        data-leaving={effectiveLeaving ? 'true' : undefined}\n        aria-hidden={effectiveLeaving || undefined}\n        className={cardVariants({ variant, size, state, className })}\n        {...rest}\n      >\n        {/* Avatar is decorative here — the row's assembled `aria-label`\n            already names the sender, so letting Avatar contribute its own\n            `role=\"img\"` + `aria-label={name}` would announce the name twice\n            per row. `aria-hidden` + `role=\"presentation\"` (spread last, so\n            they win over Avatar's internal values) pulls the element out of\n            the a11y tree entirely. */}\n        <Avatar\n          name={item.sender.name}\n          src={item.sender.avatarUrl}\n          size={size === 'md' ? 'md' : 'sm'}\n          className=\"ds:shrink-0\"\n          aria-hidden=\"true\"\n          role=\"presentation\"\n          aria-label={undefined}\n        />\n\n        <div className=\"ds:flex-1 ds:min-w-0 ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]\">\n          <div className=\"ds:flex ds:items-center ds:gap-[var(--spacing-xs)]\">\n            {!item.read ? (\n              <span\n                aria-hidden=\"true\"\n                className=\"ds:inline-block ds:size-1.5 ds:shrink-0 ds:rounded-[var(--radius-full)] ds:bg-[color:var(--primary)] ds:forced-colors:bg-[Highlight]\"\n              />\n            ) : null}\n            {variant === 'dashboard' ? (\n              <h3 className=\"ds:m-0 ds:flex-1 ds:min-w-0 type-title-item\">\n                {senderNode}\n              </h3>\n            ) : (\n              <span className=\"ds:flex-1 ds:min-w-0 type-title-item ds:text-[color:var(--foreground)]\">\n                {senderNode}\n              </span>\n            )}\n            {showThreadCount ? (\n              <span\n                aria-label={t('ui.messageCard.threadCount', {\n                  count: item.unreadCount,\n                  defaultValue_one: '{{count}} new message in thread',\n                  defaultValue_other: '{{count}} new messages in thread',\n                })}\n                className=\"ds:relative ds:z-[1] ds:shrink-0 ds:inline-flex ds:items-center ds:justify-center ds:min-w-[calc(var(--spacing-md)+var(--spacing-xs))] ds:h-[calc(var(--spacing-md)+var(--spacing-xs))] ds:ps-[calc(var(--spacing-xs)/1.5)] ds:pe-[calc(var(--spacing-xs)/1.5)] ds:rounded-[var(--radius-full)] ds:bg-[color:var(--accent)] ds:text-[color:var(--accent-foreground)] ds:text-[length:var(--font-size-xs)] ds:font-semibold ds:leading-none ds:forced-colors:outline ds:forced-colors:outline-1 ds:forced-colors:outline-[CanvasText]\"\n              >\n                {item.unreadCount}\n              </span>\n            ) : null}\n          </div>\n\n          {item.subject ? (\n            <p\n              className={[\n                'ds:m-0 type-body-sm ds:text-[color:var(--foreground)] ds:truncate',\n                item.read ? 'ds:font-normal' : 'ds:font-semibold',\n              ].join(' ')}\n            >\n              {item.subject}\n            </p>\n          ) : null}\n\n          <p className=\"ds:m-0 type-body-sm ds:text-[color:var(--muted-foreground)] ds:[overflow:hidden] ds:[display:-webkit-box] ds:[-webkit-box-orient:vertical] ds:[-webkit-line-clamp:2] ds:break-words\">\n            {item.preview}\n          </p>\n\n          <Timestamp\n            value={item.sentAt}\n            shape=\"chip\"\n            size=\"sm\"\n            relativeWindow={12 * 60 * 60 * 1000}\n          />\n\n          {variant === 'dashboard' && (ctaLabel || dismissLabel) ? (\n            <div className=\"ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-sm)]\">\n              {ctaLabel && hasSafeUrl ? (\n                <Button\n                  intent=\"outline\"\n                  size=\"sm\"\n                  asChild\n                  className=\"ds:relative ds:z-[1]\"\n                >\n                  <a\n                    href={item.url}\n                    onClick={(event) => {\n                      if (\n                        event.defaultPrevented ||\n                        event.metaKey ||\n                        event.ctrlKey ||\n                        event.shiftKey\n                      )\n                        return;\n                      onActivate?.(item);\n                    }}\n                  >\n                    {ctaLabel}\n                  </a>\n                </Button>\n              ) : null}\n              {dismissLabel && onDismiss ? (\n                <Button\n                  intent=\"link\"\n                  size=\"sm\"\n                  onClick={handleDismiss}\n                  className=\"ds:relative ds:z-[1]\"\n                >\n                  {dismissLabel}\n                </Button>\n              ) : null}\n            </div>\n          ) : null}\n        </div>\n\n        {variant === 'compact' && onDismiss ? (\n          <span className=\"ds:relative ds:z-[1] ds:opacity-0 ds:group-hover:opacity-100 ds:group-focus-within:opacity-100 ds:transition-opacity ds:motion-reduce:transition-none\">\n            <IconButton\n              icon={<X />}\n              intent=\"ghost\"\n              size=\"sm\"\n              aria-label={t('ui.messageCard.dismiss', 'Dismiss message')}\n              onClick={handleDismiss}\n            />\n          </span>\n        ) : null}\n      </div>\n    );\n  },\n);\n\nMessageCard.displayName = 'MessageCard';\n"],"names":["cardVariants","cva","stretchedLinkClass","isSafeMessageUrl","url","MessageCard","forwardRef","item","variant","size","onActivate","onDismiss","ctaLabel","dismissLabel","leaving","className","rest","ref","t","i18n","useTranslation","accessibleTime","useMemo","date","isControlledLeaving","isLeaving","setIsLeaving","useState","dismissTimerRef","useRef","effectiveLeaving","prefersReducedMotion","handleDismiss","useCallback","raw","ms","state","unreadSuffix","subjectFragment","ariaLabel","hasSafeUrl","senderText","jsx","senderNode","event","showThreadCount","jsxs","Avatar","Timestamp","Button","IconButton","X"],"mappings":"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"}

package/dist/_chunks/message-card.agent-4IeIgrnJ.js

@@ -0,0 +1,22 @@
+const e = {
+  id: "message-card",
+  capabilities: ["dismiss"],
+  state: {},
+  actions: {},
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "message-card",
+      description: "Marks the element as a kit MessageCard. The card root also emits data-component-id sourced from item.id and data-read with the current read flag."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "item.id",
+      description: "Sourced from item.id — the stable message identifier."
+    }
+  }
+};
+export {
+  e as m
+};
+//# sourceMappingURL=message-card.agent-4IeIgrnJ.js.map

package/dist/_chunks/message-card.agent-4IeIgrnJ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"message-card.agent-4IeIgrnJ.js","sources":["../../src/components/message-card/message-card.agent.ts"],"sourcesContent":["/* -------------------------------------------------------------------- */\n/* Agent adapter — MessageCard.                                           */\n/*                                                                        */\n/* Single-message surface. Lifecycle (dismiss, mark-read) is owned by    */\n/* the consumer / host tray; the card emits a DOM hook so a future MCP   */\n/* UI bridge can address one rendered card by its message id.            */\n/* -------------------------------------------------------------------- */\n\nimport type { AgentAdapter } from '../../agent/types';\n\nexport const messageCardAgent: AgentAdapter = {\n  id: 'message-card',\n  capabilities: ['dismiss'],\n  state: {},\n  actions: {},\n  domHooks: {\n    root: {\n      attr: 'data-component',\n      value: 'message-card',\n      description:\n        'Marks the element as a kit MessageCard. The card root also emits data-component-id sourced from item.id and data-read with the current read flag.',\n    },\n    instanceId: {\n      attr: 'data-component-id',\n      sourceProp: 'item.id',\n      description: 'Sourced from item.id — the stable message identifier.',\n    },\n  },\n};\n"],"names":["messageCardAgent"],"mappings":"AAUO,MAAMA,IAAiC;AAAA,EAC5C,IAAI;AAAA,EACJ,cAAc,CAAC,SAAS;AAAA,EACxB,OAAO,CAAA;AAAA,EACP,SAAS,CAAA;AAAA,EACT,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,OAAO;AAAA,MACP,aACE;AAAA,IAAA;AAAA,IAEJ,YAAY;AAAA,MACV,MAAM;AAAA,MACN,YAAY;AAAA,MACZ,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ;"}