@mastra/playground-ui 56.0.0-alpha.8 → 56.0.0

package/dist/buttons-group.css

@@ -0,0 +1,135 @@
+/* ButtonsGroup seam. Plain CSS rather than `[&>*]` class strings: every rule keys off the
+ * same four negations, and Tailwind only emits a utility whose class string appears
+ * literally in the source — composing those selectors from constants silently emits
+ * nothing at all.
+ *
+ * `@layer utilities`, NOT `components`: layer order outranks specificity, and a segment's
+ * own look is plain utilities (`ghost` ships `border-transparent`, `icon-md` ships
+ * `rounded-full`). From a lower layer these rules would lose every one of those contests.
+ * Inside `utilities` the extra attribute selector wins them instead.
+ *
+ * A component stylesheet can load before the app's Tailwind entry, and the first sheet to
+ * name a layer fixes its rank. Restating the full order keeps preflight from winning over
+ * these rules whichever one lands first. */
+@layer properties, theme, base, components, utilities;
+
+/* A real segment. Everything a framework injects around the authored children is not one
+ * and takes no seam rule: Base UI's trailing `<input aria-hidden>` (Select), and the focus
+ * guards plus positioner anchor a Menu or Popover inserts while OPEN — a split button must
+ * not lose its seam the moment its menu opens. */
+@layer utilities {
+  [data-slot='buttons-group'] > input {
+    flex: 1;
+  }
+
+  /* Lift the hovered/focused segment so its ring paints over its neighbours instead of
+     under them. `:focus-visible`, not `:focus-within`: a mouse click leaves a plain
+     `:focus` on a button, which would keep that segment lifted until blur.
+     `:has(:focus-visible)` covers a nested focusable — the input inside an InputGroup. */
+  [data-slot='buttons-group'] > *:is(:hover, :focus-visible, :has(:focus-visible)) {
+    position: relative;
+    z-index: 10;
+  }
+
+  /* Every real segment paints the ring, transparent variants (`ghost`, `ghostLight`)
+     included: a group mixing a selected filled segment with unselected ghosts has to read
+     as one track, not half a capsule. `primary` and `destructive` are opaque and
+     borderless, and take a shadow divider below instead. */
+  [data-slot='buttons-group']
+    > :not(
+      [data-slot='buttons-group-separator'],
+      [aria-hidden='true'],
+      [data-base-ui-focus-guard],
+      [aria-owns],
+      [data-variant='primary'],
+      [data-variant='destructive']
+    ) {
+    border-color: var(--border);
+  }
+
+  /* A field trigger (`Combobox`/`Select` in their default variant) carries no border at all:
+     its edge is the raised material's inset rim, which paints all four sides at once. The
+     seam rules below can only halve a border, so that rim survives next to its neighbour's
+     edge and the seam reads as two lines. Inside a group the edges belong to the group, so
+     the material goes flat and the segment takes the same 1px border as every other one —
+     the border its focus state already moves (`focus-visible:border-border-focus`).
+     What has to go is only the rim: it paints all four sides, so it survives beside a
+     neighbour's edge and the seam reads as two lines. The rest of the shadow list must
+     stay, because `--surface-tint` is the layer a field expresses every state in — hover
+     washes to `fill-subtle`, open to `fill`. Dropping the list wholesale left both states
+     with nothing to paint on and handed them to the border instead: a rim flash on the one
+     control whose boundary is deliberately static. Keeping the tint inset alone repairs
+     hover and open together, and a grouped trigger reads like the same trigger standing
+     alone. The inset also clips to the padding box, so the wash cannot composite through
+     the translucent border and lighten it — which is the whole point. */
+  [data-slot='buttons-group'] > .shadow-raised {
+    box-shadow: inset 0 0 0 9999px var(--surface-tint);
+    border-width: 1px;
+  }
+
+  /* One border per seam, and no overlap. A border is a translucent alpha of the
+     foreground, so two 1px edges collapsed onto the same pixel (the `-ml-px` trick) stack
+     to double the alpha and out-read the ring around the group. The left segment owns the
+     seam with its right border; the segment after it drops its left edge entirely. */
+  [data-slot='buttons-group'][data-orientation='horizontal']
+    > :not([data-slot='buttons-group-separator'], [aria-hidden='true'], [data-base-ui-focus-guard], [aria-owns]):not(
+      :first-child
+    ) {
+    border-left-width: 0;
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+
+  /* `:has(~ …)` rather than `:not(:last-child)`, for the injected children above. */
+  [data-slot='buttons-group'][data-orientation='horizontal']
+    > *:has(
+      ~ :not([data-slot='buttons-group-separator'], [aria-hidden='true'], [data-base-ui-focus-guard], [aria-owns])
+    ) {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+
+  /* A borderless filled segment cannot own its seam, so it draws one inside its own box. */
+  [data-slot='buttons-group'][data-orientation='horizontal']
+    > :is([data-variant='primary'], [data-variant='destructive']):has(
+      ~ :not([data-slot='buttons-group-separator'], [aria-hidden='true'], [data-base-ui-focus-guard], [aria-owns])
+    ) {
+    box-shadow: inset -1px 0 0 0 var(--border);
+  }
+
+  /* Vertical mirrors it: the top segment owns the seam. The children are capsules, so the
+     outer ends are re-rounded to the container radius. */
+  [data-slot='buttons-group'][data-orientation='vertical']
+    > :not([data-slot='buttons-group-separator'], [aria-hidden='true'], [data-base-ui-focus-guard], [aria-owns]):not(
+      :first-child
+    ) {
+    border-top-width: 0;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+  }
+
+  [data-slot='buttons-group'][data-orientation='vertical']
+    > *:has(
+      ~ :not([data-slot='buttons-group-separator'], [aria-hidden='true'], [data-base-ui-focus-guard], [aria-owns])
+    ) {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+
+  [data-slot='buttons-group'][data-orientation='vertical'] > :first-child {
+    border-top-left-radius: var(--radius-xl);
+    border-top-right-radius: var(--radius-xl);
+  }
+
+  [data-slot='buttons-group'][data-orientation='vertical'] > :last-child {
+    border-bottom-left-radius: var(--radius-xl);
+    border-bottom-right-radius: var(--radius-xl);
+  }
+
+  [data-slot='buttons-group'][data-orientation='vertical']
+    > :is([data-variant='primary'], [data-variant='destructive']):has(
+      ~ :not([data-slot='buttons-group-separator'], [aria-hidden='true'], [data-base-ui-focus-guard], [aria-owns])
+    ) {
+    box-shadow: inset 0 -1px 0 0 var(--border);
+  }
+}

package/dist/chart-tooltip-84fl_3Wc.js

@@ -0,0 +1,17 @@
+import { jsx } from 'react/jsx-runtime';
+import { overlaySurfaceStyle } from './primitives/raised-surface.es.js';
+import { c as cn } from './cn-65Adrsfj.js';
+
+function ChartTooltip({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "chart-tooltip",
+      className: cn(overlaySurfaceStyle, "rounded-md px-3 py-2 text-caption text-foreground", className),
+      ...props
+    }
+  );
+}
+
+export { ChartTooltip as C };
+//# sourceMappingURL=chart-tooltip-84fl_3Wc.js.map

package/dist/chart-tooltip-84fl_3Wc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-tooltip-84fl_3Wc.js","sources":["../src/ds/components/ChartTooltip/chart-tooltip.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\n\nimport { overlaySurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\nexport type ChartTooltipProps = ComponentPropsWithoutRef<'div'>;\n\n/**\n * The floating readout a chart shows on hover — scatter points, line series,\n * sankey nodes, lifeline markers.\n *\n * It is a raised surface, so it carries no border of its own: the rim lives in\n * the `shadow-overlay` utility. Call sites pass only what is genuinely local — positioning\n * and sizing — never background, border or shadow.\n */\nexport function ChartTooltip({ className, ...props }: ChartTooltipProps) {\n  return (\n    <div\n      data-slot=\"chart-tooltip\"\n      className={cn(overlaySurfaceStyle, 'rounded-md px-3 py-2 text-caption text-foreground', className)}\n      {...props}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;AAeO,SAAS,YAAA,CAAa,EAAE,SAAA,EAAW,GAAG,OAAM,EAAsB;AACvE,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,eAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,mBAAA,EAAqB,mDAAA,EAAqD,SAAS,CAAA;AAAA,MAChG,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}

package/dist/chart-tooltip-DX6vs_Tc.cjs

@@ -0,0 +1,19 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const primitives_raisedSurface = require('./primitives/raised-surface.cjs.js');
+const utils_cn = require('./cn-DG0X1KEP.cjs');
+
+function ChartTooltip({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "chart-tooltip",
+      className: utils_cn.cn(primitives_raisedSurface.overlaySurfaceStyle, "rounded-md px-3 py-2 text-caption text-foreground", className),
+      ...props
+    }
+  );
+}
+
+exports.ChartTooltip = ChartTooltip;
+//# sourceMappingURL=chart-tooltip-DX6vs_Tc.cjs.map

package/dist/chart-tooltip-DX6vs_Tc.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-tooltip-DX6vs_Tc.cjs","sources":["../src/ds/components/ChartTooltip/chart-tooltip.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\n\nimport { overlaySurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\nexport type ChartTooltipProps = ComponentPropsWithoutRef<'div'>;\n\n/**\n * The floating readout a chart shows on hover — scatter points, line series,\n * sankey nodes, lifeline markers.\n *\n * It is a raised surface, so it carries no border of its own: the rim lives in\n * the `shadow-overlay` utility. Call sites pass only what is genuinely local — positioning\n * and sizing — never background, border or shadow.\n */\nexport function ChartTooltip({ className, ...props }: ChartTooltipProps) {\n  return (\n    <div\n      data-slot=\"chart-tooltip\"\n      className={cn(overlaySurfaceStyle, 'rounded-md px-3 py-2 text-caption text-foreground', className)}\n      {...props}\n    />\n  );\n}\n"],"names":["jsx","cn","overlaySurfaceStyle"],"mappings":";;;;;;AAeO,SAAS,YAAA,CAAa,EAAE,SAAA,EAAW,GAAG,OAAM,EAAsB;AACvE,EAAA,uBACEA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,eAAA;AAAA,MACV,SAAA,EAAWC,WAAA,CAAGC,4CAAA,EAAqB,mDAAA,EAAqD,SAAS,CAAA;AAAA,MAChG,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}

package/dist/chat-notification-4OuPNhtu.js

@@ -0,0 +1,107 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { ChevronRight, Bell, ExternalLink } from 'lucide-react';
+import { u as useArriving } from './use-watched-CG9KoWl3.js';
+import { C as Collapsible, b as CollapsibleTrigger, a as CollapsibleContent } from './collapsible-B2uUy8w5.js';
+import { T as Txt } from './Txt-DTh3Pa_a.js';
+import { c as cn } from './cn-65Adrsfj.js';
+import { truncateString } from './utils/truncate-string.es.js';
+import { getNotificationNoticeVariant } from './domains/chat/messages/notification-signal-notice-variant.es.js';
+import { B as Badge } from './Badge-TD55_qZJ.js';
+import { N as Notice } from './Notice-Ah-84yi6.js';
+
+function ChatEventDetail({ children }) {
+  const arriving = useArriving();
+  return /* @__PURE__ */ jsx(Txt, { as: "span", variant: "meta", tone: "muted", font: "mono", className: cn("min-w-0 truncate", arriving), children });
+}
+function ChatEvent({ label, detail, icon, children, defaultOpen, ...props }) {
+  const header = /* @__PURE__ */ jsxs("span", { className: "flex w-full min-w-0 items-center gap-2 px-1.5 py-1", children: [
+    /* @__PURE__ */ jsx("span", { className: "flex size-4 shrink-0 items-center justify-center", children: icon }),
+    /* @__PURE__ */ jsx(Txt, { as: "span", variant: "caption", tone: "muted", className: "max-w-[55%] shrink-0 truncate", children: label }),
+    detail && /* @__PURE__ */ jsx(ChatEventDetail, { children: detail }),
+    /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "min-w-2 flex-1" }),
+    /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "flex size-4 shrink-0 items-center justify-center", children: children && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground flex opacity-0 group-hover/event:opacity-100 group-focus-visible/event:opacity-100 group-data-[panel-open]/event:rotate-90 group-data-[panel-open]/event:opacity-100 motion-safe:transition motion-safe:duration-150", children: /* @__PURE__ */ jsx(ChevronRight, { size: 13 }) }) })
+  ] });
+  if (!children) {
+    return /* @__PURE__ */ jsx("div", { className: "max-w-full min-w-0", role: "group", ...props, children: header });
+  }
+  return /* @__PURE__ */ jsxs(Collapsible, { defaultOpen, className: "max-w-full min-w-0", role: "group", ...props, children: [
+    /* @__PURE__ */ jsx(CollapsibleTrigger, { className: "group/event hover:bg-fill w-full cursor-pointer rounded-md text-left motion-safe:transition-colors", children: header }),
+    /* @__PURE__ */ jsx(CollapsibleContent, { className: "max-w-full min-w-0", children: /* @__PURE__ */ jsx("div", { className: "before:bg-border relative ml-[14px] max-w-full min-w-0 py-1.5 pr-1 pl-4 before:absolute before:inset-y-0 before:left-0 before:w-px before:mask-b-from-[calc(100%-min(40%,80px))] before:content-['']", children }) })
+  ] });
+}
+
+function chatEventPreview(message) {
+  return truncateString(message, 72);
+}
+
+function ChatNotification({
+  label,
+  message,
+  variant = "row",
+  state = "notification",
+  icon,
+  priority,
+  status,
+  pending,
+  link,
+  defaultOpen
+}) {
+  if (variant === "notice") {
+    const hasContent = Boolean(priority || status || pending || message || link);
+    return /* @__PURE__ */ jsx(
+      Notice,
+      {
+        variant: getNotificationNoticeVariant(priority),
+        title: label,
+        icon: icon ?? /* @__PURE__ */ jsx(Bell, {}),
+        className: "my-2 max-w-[80%]",
+        children: hasContent && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+          (priority || status || pending) && /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+            priority && /* @__PURE__ */ jsx(Badge, { size: "xs", children: priority }),
+            status && /* @__PURE__ */ jsx(Badge, { size: "xs", children: status }),
+            pending && /* @__PURE__ */ jsxs(Badge, { size: "xs", children: [
+              pending,
+              " pending"
+            ] })
+          ] }),
+          message && /* @__PURE__ */ jsx(Notice.Message, { className: "break-words whitespace-pre-wrap", children: message }),
+          link && /* @__PURE__ */ jsx(NotificationLink, { link, message })
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    ChatEvent,
+    {
+      label,
+      detail: chatEventPreview(message),
+      icon: icon ?? /* @__PURE__ */ jsx(Bell, { size: 13, className: "text-warning1", "aria-hidden": true }),
+      defaultOpen,
+      "data-notification-state": state,
+      "aria-label": `Notification: ${label}`,
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsx(Txt, { variant: "caption", children: message }),
+        link && /* @__PURE__ */ jsx(NotificationLink, { link, message })
+      ] })
+    }
+  );
+}
+function NotificationLink({ link, message }) {
+  return /* @__PURE__ */ jsxs(
+    "a",
+    {
+      href: link.href,
+      target: "_blank",
+      rel: "noreferrer",
+      "aria-label": `Open notification target: ${message}`,
+      className: "text-muted-foreground hover:text-foreground text-meta flex w-fit items-center gap-1",
+      children: [
+        link.label,
+        /* @__PURE__ */ jsx(ExternalLink, { size: 12, "aria-hidden": true })
+      ]
+    }
+  );
+}
+
+export { ChatNotification as C, ChatEvent as a, chatEventPreview as c };
+//# sourceMappingURL=chat-notification-4OuPNhtu.js.map

package/dist/chat-notification-4OuPNhtu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-notification-4OuPNhtu.js","sources":["../src/ds/components/ai/chat-event/chat-event.tsx","../src/ds/components/ai/chat-event/chat-event-preview.ts","../src/ds/components/ai/chat-event/chat-notification.tsx"],"sourcesContent":["import { ChevronRight } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { useArriving } from '@/ds/components/Arrival';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\ninterface ChatEventProps {\n  label: string;\n  detail?: string;\n  icon: ReactNode;\n  children?: ReactNode;\n  defaultOpen?: boolean;\n  'aria-label': string;\n  'data-signal-kind'?: string;\n  'data-notification-state'?: string;\n  'data-skill-name'?: string;\n}\n\nfunction ChatEventDetail({ children }: { children: string }) {\n  const arriving = useArriving();\n  return (\n    <Txt as=\"span\" variant=\"meta\" tone=\"muted\" font=\"mono\" className={cn('min-w-0 truncate', arriving)}>\n      {children}\n    </Txt>\n  );\n}\n\nexport function ChatEvent({ label, detail, icon, children, defaultOpen, ...props }: ChatEventProps) {\n  const header = (\n    <span className=\"flex w-full min-w-0 items-center gap-2 px-1.5 py-1\">\n      <span className=\"flex size-4 shrink-0 items-center justify-center\">{icon}</span>\n      <Txt as=\"span\" variant=\"caption\" tone=\"muted\" className=\"max-w-[55%] shrink-0 truncate\">\n        {label}\n      </Txt>\n      {detail && <ChatEventDetail>{detail}</ChatEventDetail>}\n      <span aria-hidden className=\"min-w-2 flex-1\" />\n      <span aria-hidden className=\"flex size-4 shrink-0 items-center justify-center\">\n        {children && (\n          <span className=\"text-muted-foreground flex opacity-0 group-hover/event:opacity-100 group-focus-visible/event:opacity-100 group-data-[panel-open]/event:rotate-90 group-data-[panel-open]/event:opacity-100 motion-safe:transition motion-safe:duration-150\">\n            <ChevronRight size={13} />\n          </span>\n        )}\n      </span>\n    </span>\n  );\n\n  if (!children) {\n    return (\n      <div className=\"max-w-full min-w-0\" role=\"group\" {...props}>\n        {header}\n      </div>\n    );\n  }\n\n  return (\n    <Collapsible defaultOpen={defaultOpen} className=\"max-w-full min-w-0\" role=\"group\" {...props}>\n      <CollapsibleTrigger className=\"group/event hover:bg-fill w-full cursor-pointer rounded-md text-left motion-safe:transition-colors\">\n        {header}\n      </CollapsibleTrigger>\n      <CollapsibleContent className=\"max-w-full min-w-0\">\n        <div className=\"before:bg-border relative ml-[14px] max-w-full min-w-0 py-1.5 pr-1 pl-4 before:absolute before:inset-y-0 before:left-0 before:w-px before:mask-b-from-[calc(100%-min(40%,80px))] before:content-['']\">\n          {children}\n        </div>\n      </CollapsibleContent>\n    </Collapsible>\n  );\n}\n","import { truncateString } from '@/lib/truncate-string';\n\nexport function chatEventPreview(message: string): string {\n  return truncateString(message, 72);\n}\n","import { Bell, ExternalLink } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { ChatEvent } from './chat-event';\nimport { chatEventPreview } from './chat-event-preview';\nimport { getNotificationNoticeVariant } from './notification-variant';\nimport { Badge } from '@/ds/components/Badge';\nimport { Notice } from '@/ds/components/Notice';\nimport { Txt } from '@/ds/components/Txt';\n\nexport interface ChatNotificationProps {\n  label: string;\n  message: string;\n  variant?: 'row' | 'notice';\n  state?: string;\n  icon?: ReactNode;\n  priority?: string;\n  status?: string;\n  pending?: string;\n  link?: { href: string; label: string };\n  defaultOpen?: boolean;\n}\n\nexport function ChatNotification({\n  label,\n  message,\n  variant = 'row',\n  state = 'notification',\n  icon,\n  priority,\n  status,\n  pending,\n  link,\n  defaultOpen,\n}: ChatNotificationProps) {\n  if (variant === 'notice') {\n    const hasContent = Boolean(priority || status || pending || message || link);\n    return (\n      <Notice\n        variant={getNotificationNoticeVariant(priority)}\n        title={label}\n        icon={icon ?? <Bell />}\n        className=\"my-2 max-w-[80%]\"\n      >\n        {hasContent && (\n          <div className=\"flex flex-col gap-2\">\n            {(priority || status || pending) && (\n              <div className=\"flex flex-wrap items-center gap-2\">\n                {priority && <Badge size=\"xs\">{priority}</Badge>}\n                {status && <Badge size=\"xs\">{status}</Badge>}\n                {pending && <Badge size=\"xs\">{pending} pending</Badge>}\n              </div>\n            )}\n            {message && <Notice.Message className=\"break-words whitespace-pre-wrap\">{message}</Notice.Message>}\n            {link && <NotificationLink link={link} message={message} />}\n          </div>\n        )}\n      </Notice>\n    );\n  }\n\n  return (\n    <ChatEvent\n      label={label}\n      detail={chatEventPreview(message)}\n      icon={icon ?? <Bell size={13} className=\"text-warning1\" aria-hidden />}\n      defaultOpen={defaultOpen}\n      data-notification-state={state}\n      aria-label={`Notification: ${label}`}\n    >\n      <div className=\"flex flex-col gap-2\">\n        <Txt variant=\"caption\">{message}</Txt>\n        {link && <NotificationLink link={link} message={message} />}\n      </div>\n    </ChatEvent>\n  );\n}\n\nfunction NotificationLink({ link, message }: { link: NonNullable<ChatNotificationProps['link']>; message: string }) {\n  return (\n    <a\n      href={link.href}\n      target=\"_blank\"\n      rel=\"noreferrer\"\n      aria-label={`Open notification target: ${message}`}\n      className=\"text-muted-foreground hover:text-foreground text-meta flex w-fit items-center gap-1\"\n    >\n      {link.label}\n      <ExternalLink size={12} aria-hidden />\n    </a>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/chat-notification-CPrlBwP_.cjs

@@ -0,0 +1,111 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const useWatched = require('./use-watched-BixmYWp0.cjs');
+const collapsible = require('./collapsible-BvrI6XnN.cjs');
+const Txt = require('./Txt-B4-2nLaI.cjs');
+const utils_cn = require('./cn-DG0X1KEP.cjs');
+const utils_truncateString = require('./utils/truncate-string.cjs.js');
+const domains_chat_messages_notificationSignalNoticeVariant = require('./domains/chat/messages/notification-signal-notice-variant.cjs.js');
+const Badge = require('./Badge-BEeYtjmv.cjs');
+const Notice = require('./Notice-Cjti0e0j.cjs');
+
+function ChatEventDetail({ children }) {
+  const arriving = useWatched.useArriving();
+  return /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "span", variant: "meta", tone: "muted", font: "mono", className: utils_cn.cn("min-w-0 truncate", arriving), children });
+}
+function ChatEvent({ label, detail, icon, children, defaultOpen, ...props }) {
+  const header = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex w-full min-w-0 items-center gap-2 px-1.5 py-1", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-4 shrink-0 items-center justify-center", children: icon }),
+    /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "span", variant: "caption", tone: "muted", className: "max-w-[55%] shrink-0 truncate", children: label }),
+    detail && /* @__PURE__ */ jsxRuntime.jsx(ChatEventDetail, { children: detail }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "min-w-2 flex-1" }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "flex size-4 shrink-0 items-center justify-center", children: children && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground flex opacity-0 group-hover/event:opacity-100 group-focus-visible/event:opacity-100 group-data-[panel-open]/event:rotate-90 group-data-[panel-open]/event:opacity-100 motion-safe:transition motion-safe:duration-150", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { size: 13 }) }) })
+  ] });
+  if (!children) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-full min-w-0", role: "group", ...props, children: header });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(collapsible.Collapsible, { defaultOpen, className: "max-w-full min-w-0", role: "group", ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(collapsible.CollapsibleTrigger, { className: "group/event hover:bg-fill w-full cursor-pointer rounded-md text-left motion-safe:transition-colors", children: header }),
+    /* @__PURE__ */ jsxRuntime.jsx(collapsible.CollapsibleContent, { className: "max-w-full min-w-0", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "before:bg-border relative ml-[14px] max-w-full min-w-0 py-1.5 pr-1 pl-4 before:absolute before:inset-y-0 before:left-0 before:w-px before:mask-b-from-[calc(100%-min(40%,80px))] before:content-['']", children }) })
+  ] });
+}
+
+function chatEventPreview(message) {
+  return utils_truncateString.truncateString(message, 72);
+}
+
+function ChatNotification({
+  label,
+  message,
+  variant = "row",
+  state = "notification",
+  icon,
+  priority,
+  status,
+  pending,
+  link,
+  defaultOpen
+}) {
+  if (variant === "notice") {
+    const hasContent = Boolean(priority || status || pending || message || link);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Notice.Notice,
+      {
+        variant: domains_chat_messages_notificationSignalNoticeVariant.getNotificationNoticeVariant(priority),
+        title: label,
+        icon: icon ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, {}),
+        className: "my-2 max-w-[80%]",
+        children: hasContent && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+          (priority || status || pending) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+            priority && /* @__PURE__ */ jsxRuntime.jsx(Badge.Badge, { size: "xs", children: priority }),
+            status && /* @__PURE__ */ jsxRuntime.jsx(Badge.Badge, { size: "xs", children: status }),
+            pending && /* @__PURE__ */ jsxRuntime.jsxs(Badge.Badge, { size: "xs", children: [
+              pending,
+              " pending"
+            ] })
+          ] }),
+          message && /* @__PURE__ */ jsxRuntime.jsx(Notice.Notice.Message, { className: "break-words whitespace-pre-wrap", children: message }),
+          link && /* @__PURE__ */ jsxRuntime.jsx(NotificationLink, { link, message })
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ChatEvent,
+    {
+      label,
+      detail: chatEventPreview(message),
+      icon: icon ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, { size: 13, className: "text-warning1", "aria-hidden": true }),
+      defaultOpen,
+      "data-notification-state": state,
+      "aria-label": `Notification: ${label}`,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { variant: "caption", children: message }),
+        link && /* @__PURE__ */ jsxRuntime.jsx(NotificationLink, { link, message })
+      ] })
+    }
+  );
+}
+function NotificationLink({ link, message }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "a",
+    {
+      href: link.href,
+      target: "_blank",
+      rel: "noreferrer",
+      "aria-label": `Open notification target: ${message}`,
+      className: "text-muted-foreground hover:text-foreground text-meta flex w-fit items-center gap-1",
+      children: [
+        link.label,
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ExternalLink, { size: 12, "aria-hidden": true })
+      ]
+    }
+  );
+}
+
+exports.ChatEvent = ChatEvent;
+exports.ChatNotification = ChatNotification;
+exports.chatEventPreview = chatEventPreview;
+//# sourceMappingURL=chat-notification-CPrlBwP_.cjs.map

package/dist/chat-notification-CPrlBwP_.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-notification-CPrlBwP_.cjs","sources":["../src/ds/components/ai/chat-event/chat-event.tsx","../src/ds/components/ai/chat-event/chat-event-preview.ts","../src/ds/components/ai/chat-event/chat-notification.tsx"],"sourcesContent":["import { ChevronRight } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { useArriving } from '@/ds/components/Arrival';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\ninterface ChatEventProps {\n  label: string;\n  detail?: string;\n  icon: ReactNode;\n  children?: ReactNode;\n  defaultOpen?: boolean;\n  'aria-label': string;\n  'data-signal-kind'?: string;\n  'data-notification-state'?: string;\n  'data-skill-name'?: string;\n}\n\nfunction ChatEventDetail({ children }: { children: string }) {\n  const arriving = useArriving();\n  return (\n    <Txt as=\"span\" variant=\"meta\" tone=\"muted\" font=\"mono\" className={cn('min-w-0 truncate', arriving)}>\n      {children}\n    </Txt>\n  );\n}\n\nexport function ChatEvent({ label, detail, icon, children, defaultOpen, ...props }: ChatEventProps) {\n  const header = (\n    <span className=\"flex w-full min-w-0 items-center gap-2 px-1.5 py-1\">\n      <span className=\"flex size-4 shrink-0 items-center justify-center\">{icon}</span>\n      <Txt as=\"span\" variant=\"caption\" tone=\"muted\" className=\"max-w-[55%] shrink-0 truncate\">\n        {label}\n      </Txt>\n      {detail && <ChatEventDetail>{detail}</ChatEventDetail>}\n      <span aria-hidden className=\"min-w-2 flex-1\" />\n      <span aria-hidden className=\"flex size-4 shrink-0 items-center justify-center\">\n        {children && (\n          <span className=\"text-muted-foreground flex opacity-0 group-hover/event:opacity-100 group-focus-visible/event:opacity-100 group-data-[panel-open]/event:rotate-90 group-data-[panel-open]/event:opacity-100 motion-safe:transition motion-safe:duration-150\">\n            <ChevronRight size={13} />\n          </span>\n        )}\n      </span>\n    </span>\n  );\n\n  if (!children) {\n    return (\n      <div className=\"max-w-full min-w-0\" role=\"group\" {...props}>\n        {header}\n      </div>\n    );\n  }\n\n  return (\n    <Collapsible defaultOpen={defaultOpen} className=\"max-w-full min-w-0\" role=\"group\" {...props}>\n      <CollapsibleTrigger className=\"group/event hover:bg-fill w-full cursor-pointer rounded-md text-left motion-safe:transition-colors\">\n        {header}\n      </CollapsibleTrigger>\n      <CollapsibleContent className=\"max-w-full min-w-0\">\n        <div className=\"before:bg-border relative ml-[14px] max-w-full min-w-0 py-1.5 pr-1 pl-4 before:absolute before:inset-y-0 before:left-0 before:w-px before:mask-b-from-[calc(100%-min(40%,80px))] before:content-['']\">\n          {children}\n        </div>\n      </CollapsibleContent>\n    </Collapsible>\n  );\n}\n","import { truncateString } from '@/lib/truncate-string';\n\nexport function chatEventPreview(message: string): string {\n  return truncateString(message, 72);\n}\n","import { Bell, ExternalLink } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { ChatEvent } from './chat-event';\nimport { chatEventPreview } from './chat-event-preview';\nimport { getNotificationNoticeVariant } from './notification-variant';\nimport { Badge } from '@/ds/components/Badge';\nimport { Notice } from '@/ds/components/Notice';\nimport { Txt } from '@/ds/components/Txt';\n\nexport interface ChatNotificationProps {\n  label: string;\n  message: string;\n  variant?: 'row' | 'notice';\n  state?: string;\n  icon?: ReactNode;\n  priority?: string;\n  status?: string;\n  pending?: string;\n  link?: { href: string; label: string };\n  defaultOpen?: boolean;\n}\n\nexport function ChatNotification({\n  label,\n  message,\n  variant = 'row',\n  state = 'notification',\n  icon,\n  priority,\n  status,\n  pending,\n  link,\n  defaultOpen,\n}: ChatNotificationProps) {\n  if (variant === 'notice') {\n    const hasContent = Boolean(priority || status || pending || message || link);\n    return (\n      <Notice\n        variant={getNotificationNoticeVariant(priority)}\n        title={label}\n        icon={icon ?? <Bell />}\n        className=\"my-2 max-w-[80%]\"\n      >\n        {hasContent && (\n          <div className=\"flex flex-col gap-2\">\n            {(priority || status || pending) && (\n              <div className=\"flex flex-wrap items-center gap-2\">\n                {priority && <Badge size=\"xs\">{priority}</Badge>}\n                {status && <Badge size=\"xs\">{status}</Badge>}\n                {pending && <Badge size=\"xs\">{pending} pending</Badge>}\n              </div>\n            )}\n            {message && <Notice.Message className=\"break-words whitespace-pre-wrap\">{message}</Notice.Message>}\n            {link && <NotificationLink link={link} message={message} />}\n          </div>\n        )}\n      </Notice>\n    );\n  }\n\n  return (\n    <ChatEvent\n      label={label}\n      detail={chatEventPreview(message)}\n      icon={icon ?? <Bell size={13} className=\"text-warning1\" aria-hidden />}\n      defaultOpen={defaultOpen}\n      data-notification-state={state}\n      aria-label={`Notification: ${label}`}\n    >\n      <div className=\"flex flex-col gap-2\">\n        <Txt variant=\"caption\">{message}</Txt>\n        {link && <NotificationLink link={link} message={message} />}\n      </div>\n    </ChatEvent>\n  );\n}\n\nfunction NotificationLink({ link, message }: { link: NonNullable<ChatNotificationProps['link']>; message: string }) {\n  return (\n    <a\n      href={link.href}\n      target=\"_blank\"\n      rel=\"noreferrer\"\n      aria-label={`Open notification target: ${message}`}\n      className=\"text-muted-foreground hover:text-foreground text-meta flex w-fit items-center gap-1\"\n    >\n      {link.label}\n      <ExternalLink size={12} aria-hidden />\n    </a>\n  );\n}\n"],"names":["useArriving","jsx","Txt","cn","jsxs","ChevronRight","Collapsible","CollapsibleTrigger","CollapsibleContent","truncateString","Notice","getNotificationNoticeVariant","Bell","Badge","ExternalLink"],"mappings":"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"}

package/dist/chat-signal-B_T2DSzo.cjs

@@ -0,0 +1,42 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const chatNotification = require('./chat-notification-CPrlBwP_.cjs');
+const Txt = require('./Txt-B4-2nLaI.cjs');
+
+const rowIcons = {
+  state: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Layers, { size: 13, className: "text-purple-400", "aria-hidden": true }),
+  reminder: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { size: 13, className: "text-accent3", "aria-hidden": true }),
+  reactive: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { size: 13, className: "text-muted-foreground", "aria-hidden": true })
+};
+function ChatSignal({ kind, label, message, mode, variant = "row", defaultOpen }) {
+  if (variant === "card") {
+    const Icon = kind === "state" ? lucideReact.Database : lucideReact.Radio;
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-border bg-background text-foreground my-2 max-w-[80%] rounded-lg border px-4 py-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "text-muted-foreground mt-0.5 size-4 shrink-0", "aria-hidden": true }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-column text-foreground", children: label }),
+          mode && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "border-border text-caption text-muted-foreground inline-flex items-center rounded-full border px-1.5 py-0.5 leading-none", children: mode })
+        ] }),
+        message && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-caption mt-2 break-words whitespace-pre-wrap", children: message })
+      ] })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    chatNotification.ChatEvent,
+    {
+      label,
+      detail: chatNotification.chatEventPreview(message),
+      icon: rowIcons[kind],
+      defaultOpen,
+      "data-signal-kind": kind,
+      "aria-label": `Signal: ${label}`,
+      children: message && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { variant: "caption", className: "break-words whitespace-pre-wrap", children: message })
+    }
+  );
+}
+
+exports.ChatSignal = ChatSignal;
+//# sourceMappingURL=chat-signal-B_T2DSzo.cjs.map

package/dist/chat-signal-B_T2DSzo.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-signal-B_T2DSzo.cjs","sources":["../src/ds/components/ai/chat-event/chat-signal.tsx"],"sourcesContent":["import { Database, Info, Layers, Radio } from 'lucide-react';\nimport { ChatEvent } from './chat-event';\nimport { chatEventPreview } from './chat-event-preview';\nimport { Txt } from '@/ds/components/Txt';\n\nexport interface ChatSignalProps {\n  kind: 'state' | 'reactive' | 'reminder';\n  label: string;\n  message: string;\n  mode?: string;\n  variant?: 'row' | 'card';\n  defaultOpen?: boolean;\n}\n\nconst rowIcons = {\n  state: <Layers size={13} className=\"text-purple-400\" aria-hidden />,\n  reminder: <Info size={13} className=\"text-accent3\" aria-hidden />,\n  reactive: <Info size={13} className=\"text-muted-foreground\" aria-hidden />,\n};\n\nexport function ChatSignal({ kind, label, message, mode, variant = 'row', defaultOpen }: ChatSignalProps) {\n  if (variant === 'card') {\n    const Icon = kind === 'state' ? Database : Radio;\n    return (\n      <div className=\"border-border bg-background text-foreground my-2 max-w-[80%] rounded-lg border px-4 py-3\">\n        <div className=\"flex items-start gap-3\">\n          <Icon className=\"text-muted-foreground mt-0.5 size-4 shrink-0\" aria-hidden />\n          <div className=\"min-w-0 flex-1\">\n            <div className=\"flex flex-wrap items-center gap-2\">\n              <p className=\"text-column text-foreground\">{label}</p>\n              {mode && (\n                <span className=\"border-border text-caption text-muted-foreground inline-flex items-center rounded-full border px-1.5 py-0.5 leading-none\">\n                  {mode}\n                </span>\n              )}\n            </div>\n            {message && <p className=\"text-caption mt-2 break-words whitespace-pre-wrap\">{message}</p>}\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <ChatEvent\n      label={label}\n      detail={chatEventPreview(message)}\n      icon={rowIcons[kind]}\n      defaultOpen={defaultOpen}\n      data-signal-kind={kind}\n      aria-label={`Signal: ${label}`}\n    >\n      {message && (\n        <Txt variant=\"caption\" className=\"break-words whitespace-pre-wrap\">\n          {message}\n        </Txt>\n      )}\n    </ChatEvent>\n  );\n}\n"],"names":["Layers","Info","Database","Radio","jsxs","jsx","ChatEvent","chatEventPreview","Txt"],"mappings":";;;;;;;AAcA,MAAM,QAAA,GAAW;AAAA,EACf,KAAA,iCAAQA,kBAAA,EAAA,EAAO,IAAA,EAAM,IAAI,SAAA,EAAU,iBAAA,EAAkB,eAAW,IAAA,EAAC,CAAA;AAAA,EACjE,QAAA,iCAAWC,gBAAA,EAAA,EAAK,IAAA,EAAM,IAAI,SAAA,EAAU,cAAA,EAAe,eAAW,IAAA,EAAC,CAAA;AAAA,EAC/D,QAAA,iCAAWA,gBAAA,EAAA,EAAK,IAAA,EAAM,IAAI,SAAA,EAAU,uBAAA,EAAwB,eAAW,IAAA,EAAC;AAC1E,CAAA;AAEO,SAAS,UAAA,CAAW,EAAE,IAAA,EAAM,KAAA,EAAO,SAAS,IAAA,EAAM,OAAA,GAAU,KAAA,EAAO,WAAA,EAAY,EAAoB;AACxG,EAAA,IAAI,YAAY,MAAA,EAAQ;AACtB,IAAA,MAAM,IAAA,GAAO,IAAA,KAAS,OAAA,GAAUC,oBAAA,GAAWC,iBAAA;AAC3C,IAAA,sCACG,KAAA,EAAA,EAAI,SAAA,EAAU,4FACb,QAAA,kBAAAC,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,wBAAA,EACb,QAAA,EAAA;AAAA,sBAAAC,cAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAU,8CAAA,EAA+C,aAAA,EAAW,IAAA,EAAC,CAAA;AAAA,sBAC3ED,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gBAAA,EACb,QAAA,EAAA;AAAA,wBAAAA,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,mCAAA,EACb,QAAA,EAAA;AAAA,0BAAAC,cAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,6BAAA,EAA+B,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,UACjD,IAAA,oBACCA,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,4HACb,QAAA,EAAA,IAAA,EACH;AAAA,SAAA,EAEJ,CAAA;AAAA,QACC,OAAA,oBAAWA,cAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,qDAAqD,QAAA,EAAA,OAAA,EAAQ;AAAA,OAAA,EACxF;AAAA,KAAA,EACF,CAAA,EACF,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACEA,cAAA;AAAA,IAACC,0BAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,MAAA,EAAQC,kCAAiB,OAAO,CAAA;AAAA,MAChC,IAAA,EAAM,SAAS,IAAI,CAAA;AAAA,MACnB,WAAA;AAAA,MACA,kBAAA,EAAkB,IAAA;AAAA,MAClB,YAAA,EAAY,WAAW,KAAK,CAAA,CAAA;AAAA,MAE3B,qCACCF,cAAA,CAACG,OAAA,EAAA,EAAI,SAAQ,SAAA,EAAU,SAAA,EAAU,mCAC9B,QAAA,EAAA,OAAA,EACH;AAAA;AAAA,GAEJ;AAEJ;;;;"}

package/dist/chat-signal-CG5-vy21.js

@@ -0,0 +1,40 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Database, Radio, Info, Layers } from 'lucide-react';
+import { a as ChatEvent, c as chatEventPreview } from './chat-notification-4OuPNhtu.js';
+import { T as Txt } from './Txt-DTh3Pa_a.js';
+
+const rowIcons = {
+  state: /* @__PURE__ */ jsx(Layers, { size: 13, className: "text-purple-400", "aria-hidden": true }),
+  reminder: /* @__PURE__ */ jsx(Info, { size: 13, className: "text-accent3", "aria-hidden": true }),
+  reactive: /* @__PURE__ */ jsx(Info, { size: 13, className: "text-muted-foreground", "aria-hidden": true })
+};
+function ChatSignal({ kind, label, message, mode, variant = "row", defaultOpen }) {
+  if (variant === "card") {
+    const Icon = kind === "state" ? Database : Radio;
+    return /* @__PURE__ */ jsx("div", { className: "border-border bg-background text-foreground my-2 max-w-[80%] rounded-lg border px-4 py-3", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+      /* @__PURE__ */ jsx(Icon, { className: "text-muted-foreground mt-0.5 size-4 shrink-0", "aria-hidden": true }),
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-column text-foreground", children: label }),
+          mode && /* @__PURE__ */ jsx("span", { className: "border-border text-caption text-muted-foreground inline-flex items-center rounded-full border px-1.5 py-0.5 leading-none", children: mode })
+        ] }),
+        message && /* @__PURE__ */ jsx("p", { className: "text-caption mt-2 break-words whitespace-pre-wrap", children: message })
+      ] })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsx(
+    ChatEvent,
+    {
+      label,
+      detail: chatEventPreview(message),
+      icon: rowIcons[kind],
+      defaultOpen,
+      "data-signal-kind": kind,
+      "aria-label": `Signal: ${label}`,
+      children: message && /* @__PURE__ */ jsx(Txt, { variant: "caption", className: "break-words whitespace-pre-wrap", children: message })
+    }
+  );
+}
+
+export { ChatSignal as C };
+//# sourceMappingURL=chat-signal-CG5-vy21.js.map

package/dist/chat-signal-CG5-vy21.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-signal-CG5-vy21.js","sources":["../src/ds/components/ai/chat-event/chat-signal.tsx"],"sourcesContent":["import { Database, Info, Layers, Radio } from 'lucide-react';\nimport { ChatEvent } from './chat-event';\nimport { chatEventPreview } from './chat-event-preview';\nimport { Txt } from '@/ds/components/Txt';\n\nexport interface ChatSignalProps {\n  kind: 'state' | 'reactive' | 'reminder';\n  label: string;\n  message: string;\n  mode?: string;\n  variant?: 'row' | 'card';\n  defaultOpen?: boolean;\n}\n\nconst rowIcons = {\n  state: <Layers size={13} className=\"text-purple-400\" aria-hidden />,\n  reminder: <Info size={13} className=\"text-accent3\" aria-hidden />,\n  reactive: <Info size={13} className=\"text-muted-foreground\" aria-hidden />,\n};\n\nexport function ChatSignal({ kind, label, message, mode, variant = 'row', defaultOpen }: ChatSignalProps) {\n  if (variant === 'card') {\n    const Icon = kind === 'state' ? Database : Radio;\n    return (\n      <div className=\"border-border bg-background text-foreground my-2 max-w-[80%] rounded-lg border px-4 py-3\">\n        <div className=\"flex items-start gap-3\">\n          <Icon className=\"text-muted-foreground mt-0.5 size-4 shrink-0\" aria-hidden />\n          <div className=\"min-w-0 flex-1\">\n            <div className=\"flex flex-wrap items-center gap-2\">\n              <p className=\"text-column text-foreground\">{label}</p>\n              {mode && (\n                <span className=\"border-border text-caption text-muted-foreground inline-flex items-center rounded-full border px-1.5 py-0.5 leading-none\">\n                  {mode}\n                </span>\n              )}\n            </div>\n            {message && <p className=\"text-caption mt-2 break-words whitespace-pre-wrap\">{message}</p>}\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <ChatEvent\n      label={label}\n      detail={chatEventPreview(message)}\n      icon={rowIcons[kind]}\n      defaultOpen={defaultOpen}\n      data-signal-kind={kind}\n      aria-label={`Signal: ${label}`}\n    >\n      {message && (\n        <Txt variant=\"caption\" className=\"break-words whitespace-pre-wrap\">\n          {message}\n        </Txt>\n      )}\n    </ChatEvent>\n  );\n}\n"],"names":[],"mappings":";;;;;AAcA,MAAM,QAAA,GAAW;AAAA,EACf,KAAA,sBAAQ,MAAA,EAAA,EAAO,IAAA,EAAM,IAAI,SAAA,EAAU,iBAAA,EAAkB,eAAW,IAAA,EAAC,CAAA;AAAA,EACjE,QAAA,sBAAW,IAAA,EAAA,EAAK,IAAA,EAAM,IAAI,SAAA,EAAU,cAAA,EAAe,eAAW,IAAA,EAAC,CAAA;AAAA,EAC/D,QAAA,sBAAW,IAAA,EAAA,EAAK,IAAA,EAAM,IAAI,SAAA,EAAU,uBAAA,EAAwB,eAAW,IAAA,EAAC;AAC1E,CAAA;AAEO,SAAS,UAAA,CAAW,EAAE,IAAA,EAAM,KAAA,EAAO,SAAS,IAAA,EAAM,OAAA,GAAU,KAAA,EAAO,WAAA,EAAY,EAAoB;AACxG,EAAA,IAAI,YAAY,MAAA,EAAQ;AACtB,IAAA,MAAM,IAAA,GAAO,IAAA,KAAS,OAAA,GAAU,QAAA,GAAW,KAAA;AAC3C,IAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAU,4FACb,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,wBAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAU,8CAAA,EAA+C,aAAA,EAAW,IAAA,EAAC,CAAA;AAAA,sBAC3E,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gBAAA,EACb,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,mCAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,6BAAA,EAA+B,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,UACjD,IAAA,oBACC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,4HACb,QAAA,EAAA,IAAA,EACH;AAAA,SAAA,EAEJ,CAAA;AAAA,QACC,OAAA,oBAAW,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,qDAAqD,QAAA,EAAA,OAAA,EAAQ;AAAA,OAAA,EACxF;AAAA,KAAA,EACF,CAAA,EACF,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,MAAA,EAAQ,iBAAiB,OAAO,CAAA;AAAA,MAChC,IAAA,EAAM,SAAS,IAAI,CAAA;AAAA,MACnB,WAAA;AAAA,MACA,kBAAA,EAAkB,IAAA;AAAA,MAClB,YAAA,EAAY,WAAW,KAAK,CAAA,CAAA;AAAA,MAE3B,qCACC,GAAA,CAAC,GAAA,EAAA,EAAI,SAAQ,SAAA,EAAU,SAAA,EAAU,mCAC9B,QAAA,EAAA,OAAA,EACH;AAAA;AAAA,GAEJ;AAEJ;;;;"}