dishui 0.0.91 → 0.0.101

package/dist/components/ai/StreamingText/index.js

@@ -0,0 +1,211 @@
+import { cn as e } from "../../../utils/cn.js";
+/* empty css              */
+import t, { useEffect as n, useState as r } from "react";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/components/ai/StreamingText/index.tsx
+var s = 30, c = {
+	width: 16,
+	height: 16,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: 2,
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	"aria-hidden": !0
+}, l = () => /* @__PURE__ */ o("svg", {
+	...c,
+	children: [/* @__PURE__ */ a("rect", {
+		width: "14",
+		height: "14",
+		x: "8",
+		y: "8",
+		rx: "2"
+	}), /* @__PURE__ */ a("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })]
+}), u = () => /* @__PURE__ */ o("svg", {
+	...c,
+	children: [
+		/* @__PURE__ */ a("path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8" }),
+		/* @__PURE__ */ a("path", { d: "M21 3v5h-5" }),
+		/* @__PURE__ */ a("path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16" }),
+		/* @__PURE__ */ a("path", { d: "M8 16H3v5" })
+	]
+}), d = () => /* @__PURE__ */ o("svg", {
+	...c,
+	children: [/* @__PURE__ */ a("path", { d: "M7 10v12" }), /* @__PURE__ */ a("path", { d: "M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z" })]
+}), f = () => /* @__PURE__ */ o("svg", {
+	...c,
+	children: [/* @__PURE__ */ a("path", { d: "M17 14V2" }), /* @__PURE__ */ a("path", { d: "M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z" })]
+}), p = () => /* @__PURE__ */ o("svg", {
+	...c,
+	children: [/* @__PURE__ */ a("path", { d: "M7 17 17 7" }), /* @__PURE__ */ a("path", { d: "M7 7h10v10" })]
+}), m = /\[(\d+)\]/g, h = (e) => (e.domain ?? e.title).trim().charAt(0).toUpperCase();
+function g(e, t, n, r) {
+	if (!n) return [e];
+	let i = [], o = 0, s;
+	for (m.lastIndex = 0; (s = m.exec(e)) !== null;) {
+		s.index > o && i.push(e.slice(o, s.index));
+		let n = Number(s[1]), c = t?.[n - 1], l = c ? c.title : `Source ${n}`;
+		i.push(c?.url ? /* @__PURE__ */ a("a", {
+			className: "dishui-ai-streaming__cite",
+			href: c.url,
+			target: "_blank",
+			rel: "noreferrer",
+			title: l,
+			"aria-label": l,
+			children: n
+		}, `${r}-${s.index}`) : /* @__PURE__ */ a("span", {
+			className: "dishui-ai-streaming__cite",
+			title: l,
+			"aria-label": l,
+			role: "note",
+			children: n
+		}, `${r}-${s.index}`)), o = s.index + s[0].length;
+	}
+	return o < e.length && i.push(e.slice(o)), i;
+}
+function _({ text: c, streaming: m = !1, typewriter: _ = !1, typewriterSpeed: v = 3, sources: y, citations: b = !1, maxVisibleSources: x = 3, actions: S, onCopy: C, onRegenerate: w, onFeedback: T, followUps: E, onFollowUp: D, followUpsLabel: O = "Follow-ups", className: k, ...A }) {
+	let [j, M] = r(0), [N, P] = r(!1), F = _ && j < c.length;
+	n(() => {
+		if (!F) return;
+		let e = window.setTimeout(() => {
+			M((e) => Math.min(c.length, e + Math.max(1, v)));
+		}, s);
+		return () => window.clearTimeout(e);
+	}, [
+		F,
+		c.length,
+		v
+	]);
+	let I = _ ? c.slice(0, j) : c, L = m || F, R = I.split(/\n{2,}/).filter((e, t, n) => e.length > 0 || L && t === n.length - 1), z = [];
+	C && z.push({
+		id: "copy",
+		label: "Copy",
+		icon: /* @__PURE__ */ a(l, {}),
+		onClick: () => C(c)
+	}), w && z.push({
+		id: "regenerate",
+		label: "Regenerate",
+		icon: /* @__PURE__ */ a(u, {}),
+		onClick: w
+	}), T && (z.push({
+		id: "up",
+		label: "Good response",
+		icon: /* @__PURE__ */ a(d, {}),
+		onClick: () => T("up")
+	}), z.push({
+		id: "down",
+		label: "Bad response",
+		icon: /* @__PURE__ */ a(f, {}),
+		onClick: () => T("down")
+	}));
+	let B = [...z, ...S ?? []], V = y ?? [], H = N ? V : V.slice(0, x), U = V.length - H.length;
+	return /* @__PURE__ */ o("div", {
+		...A,
+		className: e("dishui-ai-streaming", L && "dishui-ai-streaming--live", k),
+		children: [
+			/* @__PURE__ */ a("div", {
+				className: "dishui-ai-streaming__body",
+				"aria-live": L ? "polite" : void 0,
+				"aria-busy": L || void 0,
+				children: R.map((e, n) => {
+					let r = e.split("\n"), i = n === R.length - 1;
+					return /* @__PURE__ */ o("p", {
+						className: "dishui-ai-streaming__paragraph",
+						children: [r.map((e, r) => /* @__PURE__ */ o(t.Fragment, { children: [r > 0 && /* @__PURE__ */ a("br", {}), g(e, y, b, `${n}-${r}`)] }, e)), i && L && /* @__PURE__ */ a("span", {
+							className: "dishui-ai-streaming__caret",
+							"aria-hidden": "true"
+						})]
+					}, e);
+				})
+			}),
+			V.length > 0 && /* @__PURE__ */ o("div", {
+				className: "dishui-ai-streaming__sources",
+				children: [/* @__PURE__ */ o("span", {
+					className: "dishui-ai-streaming__sources-count",
+					children: [
+						V.length,
+						" ",
+						V.length === 1 ? "source" : "sources"
+					]
+				}), /* @__PURE__ */ o("ul", {
+					className: "dishui-ai-streaming__source-list",
+					children: [H.map((e, t) => {
+						let n = /* @__PURE__ */ o(i, { children: [
+							/* @__PURE__ */ a("span", {
+								className: "dishui-ai-streaming__source-icon",
+								"aria-hidden": "true",
+								children: e.favicon ?? h(e)
+							}),
+							/* @__PURE__ */ a("span", {
+								className: "dishui-ai-streaming__source-title",
+								children: e.title
+							}),
+							e.domain && /* @__PURE__ */ a("span", {
+								className: "dishui-ai-streaming__source-domain",
+								children: e.domain
+							})
+						] });
+						return /* @__PURE__ */ a("li", { children: e.url ? /* @__PURE__ */ a("a", {
+							className: "dishui-ai-streaming__source",
+							href: e.url,
+							target: "_blank",
+							rel: "noreferrer",
+							title: `[${t + 1}] ${e.title}`,
+							children: n
+						}) : /* @__PURE__ */ a("span", {
+							className: "dishui-ai-streaming__source",
+							title: `[${t + 1}] ${e.title}`,
+							children: n
+						}) }, e.id);
+					}), (U > 0 || N) && V.length > x && /* @__PURE__ */ a("li", { children: /* @__PURE__ */ a("button", {
+						type: "button",
+						className: "dishui-ai-streaming__source dishui-ai-streaming__source--more",
+						"aria-expanded": N,
+						onClick: () => P((e) => !e),
+						children: N ? "Show less" : `+${U}`
+					}) })]
+				})]
+			}),
+			!L && B.length > 0 && /* @__PURE__ */ a("div", {
+				className: "dishui-ai-streaming__actions",
+				role: "toolbar",
+				"aria-label": "Answer actions",
+				children: B.map((t) => /* @__PURE__ */ a("button", {
+					type: "button",
+					className: e("dishui-ai-streaming__action", !t.icon && "dishui-ai-streaming__action--text"),
+					"aria-label": t.label,
+					title: t.label,
+					onClick: t.onClick,
+					children: t.icon ?? t.label
+				}, t.id))
+			}),
+			!L && E && E.length > 0 && /* @__PURE__ */ o("div", {
+				className: "dishui-ai-streaming__follow-ups",
+				children: [/* @__PURE__ */ a("div", {
+					className: "dishui-ai-streaming__follow-ups-label",
+					children: O
+				}), /* @__PURE__ */ a("ul", {
+					className: "dishui-ai-streaming__follow-up-list",
+					children: E.map((e) => /* @__PURE__ */ a("li", { children: /* @__PURE__ */ o("button", {
+						type: "button",
+						className: "dishui-ai-streaming__follow-up",
+						onClick: () => D?.(e),
+						children: [/* @__PURE__ */ a("span", {
+							className: "dishui-ai-streaming__follow-up-text",
+							children: e
+						}), /* @__PURE__ */ a("span", {
+							className: "dishui-ai-streaming__follow-up-icon",
+							"aria-hidden": "true",
+							children: /* @__PURE__ */ a(p, {})
+						})]
+					}) }, e))
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { _ as default };
+
+//# sourceMappingURL=index.js.map

package/dist/components/ai/StreamingText/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/ai/StreamingText/index.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { cn } from '../../../utils/cn';\nimport './StreamingText.css';\n\nexport type StreamingSource = {\n  id: string;\n  title: string;\n  domain?: string;\n  url?: string;\n  favicon?: React.ReactNode;\n};\n\nexport type StreamingAction = {\n  id: string;\n  label: string;\n  icon?: React.ReactNode;\n  onClick?: () => void;\n};\n\nexport type StreamingFeedback = 'up' | 'down';\n\nexport type StreamingTextProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n  /** Full or partial answer text. `\\n\\n` starts a new paragraph. */\n  text: string;\n  /** Shows the caret and hides actions / follow-ups until the answer is complete. */\n  streaming?: boolean;\n  /** Reveal `text` progressively on the client. Remount (key) to replay. */\n  typewriter?: boolean;\n  /** Characters revealed per tick in typewriter mode. */\n  typewriterSpeed?: number;\n  sources?: StreamingSource[];\n  /** Render `[n]` markers in `text` as inline chips pointing at `sources[n - 1]`. */\n  citations?: boolean;\n  /** Source chips shown before the “+k” overflow toggle. */\n  maxVisibleSources?: number;\n  /** Extra actions appended after the built-in copy / regenerate / feedback buttons. */\n  actions?: StreamingAction[];\n  onCopy?: (text: string) => void;\n  onRegenerate?: () => void;\n  onFeedback?: (kind: StreamingFeedback) => void;\n  followUps?: string[];\n  onFollowUp?: (question: string) => void;\n  followUpsLabel?: React.ReactNode;\n};\n\nconst TYPEWRITER_TICK_MS = 30;\n\nconst svgProps = { width: 16, height: 16, viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: 2, strokeLinecap: 'round', strokeLinejoin: 'round', 'aria-hidden': true } as const;\nconst CopyIcon = () => (\n  <svg {...svgProps}><rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" /><path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\" /></svg>\n);\nconst RefreshIcon = () => (\n  <svg {...svgProps}><path d=\"M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8\" /><path d=\"M21 3v5h-5\" /><path d=\"M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16\" /><path d=\"M8 16H3v5\" /></svg>\n);\nconst ThumbsUpIcon = () => (\n  <svg {...svgProps}><path d=\"M7 10v12\" /><path d=\"M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z\" /></svg>\n);\nconst ThumbsDownIcon = () => (\n  <svg {...svgProps}><path d=\"M17 14V2\" /><path d=\"M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z\" /></svg>\n);\nconst ArrowIcon = () => (\n  <svg {...svgProps}><path d=\"M7 17 17 7\" /><path d=\"M7 7h10v10\" /></svg>\n);\n\nconst CITATION_RE = /\\[(\\d+)\\]/g;\n\nconst initialOf = (source: StreamingSource) => (source.domain ?? source.title).trim().charAt(0).toUpperCase();\n\nfunction renderLine(line: string, sources: StreamingSource[] | undefined, citations: boolean, keyBase: string): React.ReactNode[] {\n  if (!citations) return [line];\n  const nodes: React.ReactNode[] = [];\n  let last = 0;\n  let match: RegExpExecArray | null;\n  CITATION_RE.lastIndex = 0;\n  while ((match = CITATION_RE.exec(line)) !== null) {\n    if (match.index > last) nodes.push(line.slice(last, match.index));\n    const n = Number(match[1]);\n    const source = sources?.[n - 1];\n    const label = source ? source.title : `Source ${n}`;\n    nodes.push(\n      source?.url ? (\n        <a key={`${keyBase}-${match.index}`} className=\"dishui-ai-streaming__cite\" href={source.url} target=\"_blank\" rel=\"noreferrer\" title={label} aria-label={label}>{n}</a>\n      ) : (\n        <span key={`${keyBase}-${match.index}`} className=\"dishui-ai-streaming__cite\" title={label} aria-label={label} role=\"note\">{n}</span>\n      ),\n    );\n    last = match.index + match[0].length;\n  }\n  if (last < line.length) nodes.push(line.slice(last));\n  return nodes;\n}\n\n/**\n * Streamed answer: paragraphs with optional inline citations, a source bar,\n * an action row and follow-up questions. Fully controlled — it renders the\n * `text` it is given; `typewriter` only adds a client-side reveal.\n */\nexport default function StreamingText({\n  text,\n  streaming = false,\n  typewriter = false,\n  typewriterSpeed = 3,\n  sources,\n  citations = false,\n  maxVisibleSources = 3,\n  actions,\n  onCopy,\n  onRegenerate,\n  onFeedback,\n  followUps,\n  onFollowUp,\n  followUpsLabel = 'Follow-ups',\n  className,\n  ...rest\n}: StreamingTextProps) {\n  const [revealed, setRevealed] = useState(0);\n  const [showAllSources, setShowAllSources] = useState(false);\n\n  const revealing = typewriter && revealed < text.length;\n  useEffect(() => {\n    if (!revealing) return;\n    const id = window.setTimeout(() => {\n      setRevealed(count => Math.min(text.length, count + Math.max(1, typewriterSpeed)));\n    }, TYPEWRITER_TICK_MS);\n    return () => window.clearTimeout(id);\n  }, [revealing, text.length, typewriterSpeed]);\n\n  const visibleText = typewriter ? text.slice(0, revealed) : text;\n  const live = streaming || revealing;\n  // Keep a trailing empty paragraph only while live so the caret has a home.\n  const paragraphs = visibleText.split(/\\n{2,}/).filter((p, i, all) => p.length > 0 || (live && i === all.length - 1));\n\n  const builtIns: StreamingAction[] = [];\n  if (onCopy) builtIns.push({ id: 'copy', label: 'Copy', icon: <CopyIcon />, onClick: () => onCopy(text) });\n  if (onRegenerate) builtIns.push({ id: 'regenerate', label: 'Regenerate', icon: <RefreshIcon />, onClick: onRegenerate });\n  if (onFeedback) {\n    builtIns.push({ id: 'up', label: 'Good response', icon: <ThumbsUpIcon />, onClick: () => onFeedback('up') });\n    builtIns.push({ id: 'down', label: 'Bad response', icon: <ThumbsDownIcon />, onClick: () => onFeedback('down') });\n  }\n  const allActions = [...builtIns, ...(actions ?? [])];\n\n  const sourceList = sources ?? [];\n  const visibleSources = showAllSources ? sourceList : sourceList.slice(0, maxVisibleSources);\n  const overflow = sourceList.length - visibleSources.length;\n\n  return (\n    <div {...rest} className={cn('dishui-ai-streaming', live && 'dishui-ai-streaming--live', className)}>\n      <div className=\"dishui-ai-streaming__body\" aria-live={live ? 'polite' : undefined} aria-busy={live || undefined}>\n        {paragraphs.map((paragraph, pi) => {\n          const lines = paragraph.split('\\n');\n          const isLast = pi === paragraphs.length - 1;\n          return (\n            <p key={paragraph} className=\"dishui-ai-streaming__paragraph\">\n              {lines.map((line, li) => (\n                <React.Fragment key={line}>\n                  {li > 0 && <br />}\n                  {renderLine(line, sources, citations, `${pi}-${li}`)}\n                </React.Fragment>\n              ))}\n              {isLast && live && <span className=\"dishui-ai-streaming__caret\" aria-hidden=\"true\" />}\n            </p>\n          );\n        })}\n      </div>\n\n      {sourceList.length > 0 && (\n        <div className=\"dishui-ai-streaming__sources\">\n          <span className=\"dishui-ai-streaming__sources-count\">\n            {sourceList.length} {sourceList.length === 1 ? 'source' : 'sources'}\n          </span>\n          <ul className=\"dishui-ai-streaming__source-list\">\n            {visibleSources.map((source, i) => {\n              const inner = (\n                <>\n                  <span className=\"dishui-ai-streaming__source-icon\" aria-hidden=\"true\">{source.favicon ?? initialOf(source)}</span>\n                  <span className=\"dishui-ai-streaming__source-title\">{source.title}</span>\n                  {source.domain && <span className=\"dishui-ai-streaming__source-domain\">{source.domain}</span>}\n                </>\n              );\n              return (\n                <li key={source.id}>\n                  {source.url ? (\n                    <a className=\"dishui-ai-streaming__source\" href={source.url} target=\"_blank\" rel=\"noreferrer\" title={`[${i + 1}] ${source.title}`}>{inner}</a>\n                  ) : (\n                    <span className=\"dishui-ai-streaming__source\" title={`[${i + 1}] ${source.title}`}>{inner}</span>\n                  )}\n                </li>\n              );\n            })}\n            {(overflow > 0 || showAllSources) && sourceList.length > maxVisibleSources && (\n              <li>\n                <button\n                  type=\"button\"\n                  className=\"dishui-ai-streaming__source dishui-ai-streaming__source--more\"\n                  aria-expanded={showAllSources}\n                  onClick={() => setShowAllSources(v => !v)}\n                >\n                  {showAllSources ? 'Show less' : `+${overflow}`}\n                </button>\n              </li>\n            )}\n          </ul>\n        </div>\n      )}\n\n      {!live && allActions.length > 0 && (\n        <div className=\"dishui-ai-streaming__actions\" role=\"toolbar\" aria-label=\"Answer actions\">\n          {allActions.map(action => (\n            <button\n              key={action.id}\n              type=\"button\"\n              className={cn('dishui-ai-streaming__action', !action.icon && 'dishui-ai-streaming__action--text')}\n              aria-label={action.label}\n              title={action.label}\n              onClick={action.onClick}\n            >\n              {action.icon ?? action.label}\n            </button>\n          ))}\n        </div>\n      )}\n\n      {!live && followUps && followUps.length > 0 && (\n        <div className=\"dishui-ai-streaming__follow-ups\">\n          <div className=\"dishui-ai-streaming__follow-ups-label\">{followUpsLabel}</div>\n          <ul className=\"dishui-ai-streaming__follow-up-list\">\n            {followUps.map(question => (\n              <li key={question}>\n                <button type=\"button\" className=\"dishui-ai-streaming__follow-up\" onClick={() => onFollowUp?.(question)}>\n                  <span className=\"dishui-ai-streaming__follow-up-text\">{question}</span>\n                  <span className=\"dishui-ai-streaming__follow-up-icon\" aria-hidden=\"true\"><ArrowIcon /></span>\n                </button>\n              </li>\n            ))}\n          </ul>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/ai/TaskRows/index.d.ts

@@ -0,0 +1,53 @@
+import React from 'react';
+import type { AgentStatus } from '../shared';
+export type AgentSubtask = {
+    id: string;
+    title: React.ReactNode;
+    /** Right-aligned value, e.g. `12/12`, `68%`, `draft`. */
+    value?: React.ReactNode;
+    status?: AgentStatus;
+};
+export type AgentTask = {
+    id: string;
+    title: React.ReactNode;
+    /** Short qualifier shown after the title, e.g. `12 suppliers`. */
+    meta?: React.ReactNode;
+    status: AgentStatus;
+    /** Determinate progress 0–100. Running tasks without it show an indeterminate bar. */
+    progress?: number;
+    subtasks?: AgentSubtask[];
+    /** Shown under a failed task, next to the retry action. */
+    error?: React.ReactNode;
+};
+export type TaskRowsView = 'capsules' | 'list';
+export type TaskRowsLabels = {
+    capsules?: string;
+    list?: string;
+    retry?: string;
+    view?: string;
+    status?: Partial<Record<AgentStatus, string>>;
+};
+export type TaskRowsProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {
+    tasks: AgentTask[];
+    /** Controlled view mode. */
+    view?: TaskRowsView;
+    defaultView?: TaskRowsView;
+    onViewChange?: (view: TaskRowsView) => void;
+    /** Render the Capsules / List toggle above the tasks. */
+    showViewToggle?: boolean;
+    /** Controlled list of task ids whose subtasks are visible. */
+    expanded?: string[];
+    /** Defaults to every running or failed task. */
+    defaultExpanded?: string[];
+    onExpandedChange?: (expanded: string[]) => void;
+    /** Enables the retry action on failed tasks. */
+    onRetry?: (task: AgentTask) => void;
+    emptyText?: React.ReactNode;
+    labels?: TaskRowsLabels;
+};
+/**
+ * Live agent task status. Each task is a row (or capsule) with a text +
+ * colour status pill, optional progress and expandable subtasks with
+ * right-aligned tabular values.
+ */
+export default function TaskRows({ tasks, view: viewProp, defaultView, onViewChange, showViewToggle, expanded: expandedProp, defaultExpanded, onExpandedChange, onRetry, emptyText, labels, className, ...rest }: TaskRowsProps): React.JSX.Element;

package/dist/components/ai/TaskRows/index.js

@@ -0,0 +1,186 @@
+import { cn as e } from "../../../utils/cn.js";
+import { AGENT_STATUS_LABEL as t, clamp as n } from "../shared.js";
+/* empty css         */
+import { useCallback as r, useId as i, useState as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/ai/TaskRows/index.tsx
+var c = {
+	capsules: "Capsules",
+	list: "List",
+	retry: "Retry",
+	view: "View"
+}, l = {
+	pending: "neutral",
+	running: "info",
+	completed: "success",
+	failed: "danger",
+	skipped: "neutral"
+}, u = () => /* @__PURE__ */ o("svg", {
+	width: "16",
+	height: "16",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "2",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	"aria-hidden": "true",
+	children: /* @__PURE__ */ o("path", { d: "m9 18 6-6-6-6" })
+}), d = () => /* @__PURE__ */ s("svg", {
+	width: "16",
+	height: "16",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "2",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	"aria-hidden": "true",
+	children: [/* @__PURE__ */ o("path", { d: "M3 12a9 9 0 1 0 3-6.7" }), /* @__PURE__ */ o("path", { d: "M3 4v5h5" })]
+}), f = ({ status: t, label: n }) => /* @__PURE__ */ s("span", {
+	className: e("dishui-ai-task-rows__status", `dishui-ai-task-rows__status--${l[t]}`),
+	children: [t === "running" && /* @__PURE__ */ o("span", {
+		className: "dishui-ai-task-rows__pulse",
+		"aria-hidden": "true"
+	}), n]
+}), p = (e) => e.filter((e) => e.status === "running" || e.status === "failed").map((e) => e.id);
+function m({ tasks: l, view: m, defaultView: h = "capsules", onViewChange: g, showViewToggle: _ = !1, expanded: v, defaultExpanded: y, onExpandedChange: b, onRetry: x, emptyText: S = "No tasks yet", labels: C, className: w, ...T }) {
+	let E = i(), D = {
+		...c,
+		...C
+	}, [O, k] = a(h), A = m ?? O, j = r((e) => {
+		k(e), g?.(e);
+	}, [g]), [M, N] = a(() => y ?? p(l)), P = v ?? M, F = r((e) => {
+		let t = P.includes(e) ? P.filter((t) => t !== e) : [...P, e];
+		N(t), b?.(t);
+	}, [P, b]), I = (e) => C?.status?.[e] ?? t[e];
+	return /* @__PURE__ */ s("div", {
+		...T,
+		className: e("dishui-ai-task-rows", `dishui-ai-task-rows--${A}`, w),
+		children: [_ && /* @__PURE__ */ o("div", {
+			className: "dishui-ai-task-rows__toolbar",
+			children: /* @__PURE__ */ o("div", {
+				className: "dishui-ai-task-rows__segmented",
+				role: "group",
+				"aria-label": D.view,
+				children: ["capsules", "list"].map((t) => /* @__PURE__ */ o("button", {
+					type: "button",
+					className: e("dishui-ai-task-rows__segment", t === A && "dishui-ai-task-rows__segment--active"),
+					"aria-pressed": t === A,
+					onClick: () => j(t),
+					children: D[t]
+				}, t))
+			})
+		}), l.length === 0 ? /* @__PURE__ */ o("div", {
+			className: "dishui-ai-task-rows__empty",
+			children: S
+		}) : /* @__PURE__ */ o("ul", {
+			className: "dishui-ai-task-rows__list",
+			children: l.map((t) => {
+				let r = !!t.subtasks?.length, i = r && P.includes(t.id), a = `${E}-${t.id}`, c = t.progress === void 0 ? void 0 : n(t.progress, 0, 100), l = A === "capsules" && (c !== void 0 || t.status === "running");
+				return /* @__PURE__ */ s("li", {
+					className: e("dishui-ai-task-rows__task", `dishui-ai-task-rows__task--${t.status}`, i && "dishui-ai-task-rows__task--open"),
+					children: [
+						/* @__PURE__ */ s("div", {
+							className: "dishui-ai-task-rows__row",
+							children: [
+								r ? /* @__PURE__ */ s("button", {
+									type: "button",
+									className: "dishui-ai-task-rows__toggle",
+									"aria-expanded": i,
+									"aria-controls": a,
+									onClick: () => F(t.id),
+									children: [
+										/* @__PURE__ */ o("span", {
+											className: "dishui-ai-task-rows__chevron",
+											children: /* @__PURE__ */ o(u, {})
+										}),
+										/* @__PURE__ */ o("span", {
+											className: "dishui-ai-task-rows__title",
+											children: t.title
+										}),
+										t.meta !== void 0 && /* @__PURE__ */ o("span", {
+											className: "dishui-ai-task-rows__meta",
+											children: t.meta
+										})
+									]
+								}) : /* @__PURE__ */ s("div", {
+									className: "dishui-ai-task-rows__toggle dishui-ai-task-rows__toggle--static",
+									children: [
+										/* @__PURE__ */ o("span", { className: "dishui-ai-task-rows__chevron dishui-ai-task-rows__chevron--blank" }),
+										/* @__PURE__ */ o("span", {
+											className: "dishui-ai-task-rows__title",
+											children: t.title
+										}),
+										t.meta !== void 0 && /* @__PURE__ */ o("span", {
+											className: "dishui-ai-task-rows__meta",
+											children: t.meta
+										})
+									]
+								}),
+								c !== void 0 && t.status === "running" && /* @__PURE__ */ s("span", {
+									className: "dishui-ai-task-rows__percent",
+									children: [Math.round(c), "%"]
+								}),
+								/* @__PURE__ */ o(f, {
+									status: t.status,
+									label: I(t.status)
+								})
+							]
+						}),
+						l && /* @__PURE__ */ o("div", {
+							className: e("dishui-ai-task-rows__bar", c === void 0 && "dishui-ai-task-rows__bar--indeterminate"),
+							role: "progressbar",
+							"aria-valuemin": 0,
+							"aria-valuemax": 100,
+							"aria-valuenow": c,
+							children: /* @__PURE__ */ o("span", {
+								className: "dishui-ai-task-rows__fill",
+								style: c === void 0 ? void 0 : { width: `${c}%` }
+							})
+						}),
+						t.status === "failed" && (t.error !== void 0 || x) && /* @__PURE__ */ s("div", {
+							className: "dishui-ai-task-rows__error",
+							role: "alert",
+							children: [/* @__PURE__ */ o("span", {
+								className: "dishui-ai-task-rows__error-text",
+								children: t.error
+							}), x && /* @__PURE__ */ s("button", {
+								type: "button",
+								className: "dishui-ai-task-rows__retry",
+								onClick: () => x(t),
+								children: [/* @__PURE__ */ o(d, {}), D.retry]
+							})]
+						}),
+						r && /* @__PURE__ */ o("ul", {
+							id: a,
+							className: "dishui-ai-task-rows__subtasks",
+							hidden: !i,
+							children: t.subtasks.map((n) => /* @__PURE__ */ s("li", {
+								className: e("dishui-ai-task-rows__subtask", n.status && `dishui-ai-task-rows__subtask--${n.status}`),
+								children: [
+									/* @__PURE__ */ o("span", {
+										className: "dishui-ai-task-rows__subtitle",
+										children: n.title
+									}),
+									n.value !== void 0 && /* @__PURE__ */ o("span", {
+										className: "dishui-ai-task-rows__value",
+										children: n.value
+									}),
+									n.status && n.status !== t.status && /* @__PURE__ */ o("span", {
+										className: "dishui-ai-task-rows__substatus",
+										children: I(n.status)
+									})
+								]
+							}, n.id))
+						})
+					]
+				}, t.id);
+			})
+		})]
+	});
+}
+//#endregion
+export { m as default };
+
+//# sourceMappingURL=index.js.map

package/dist/components/ai/TaskRows/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/ai/TaskRows/index.tsx"],"sourcesContent":["import React, { useCallback, useId, useState } from 'react';\nimport { cn } from '../../../utils/cn';\nimport { AGENT_STATUS_LABEL, clamp } from '../shared';\nimport type { AgentStatus } from '../shared';\nimport './TaskRows.css';\n\nexport type AgentSubtask = {\n  id: string;\n  title: React.ReactNode;\n  /** Right-aligned value, e.g. `12/12`, `68%`, `draft`. */\n  value?: React.ReactNode;\n  status?: AgentStatus;\n};\n\nexport type AgentTask = {\n  id: string;\n  title: React.ReactNode;\n  /** Short qualifier shown after the title, e.g. `12 suppliers`. */\n  meta?: React.ReactNode;\n  status: AgentStatus;\n  /** Determinate progress 0–100. Running tasks without it show an indeterminate bar. */\n  progress?: number;\n  subtasks?: AgentSubtask[];\n  /** Shown under a failed task, next to the retry action. */\n  error?: React.ReactNode;\n};\n\nexport type TaskRowsView = 'capsules' | 'list';\n\nexport type TaskRowsLabels = {\n  capsules?: string;\n  list?: string;\n  retry?: string;\n  view?: string;\n  status?: Partial<Record<AgentStatus, string>>;\n};\n\nexport type TaskRowsProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n  tasks: AgentTask[];\n  /** Controlled view mode. */\n  view?: TaskRowsView;\n  defaultView?: TaskRowsView;\n  onViewChange?: (view: TaskRowsView) => void;\n  /** Render the Capsules / List toggle above the tasks. */\n  showViewToggle?: boolean;\n  /** Controlled list of task ids whose subtasks are visible. */\n  expanded?: string[];\n  /** Defaults to every running or failed task. */\n  defaultExpanded?: string[];\n  onExpandedChange?: (expanded: string[]) => void;\n  /** Enables the retry action on failed tasks. */\n  onRetry?: (task: AgentTask) => void;\n  emptyText?: React.ReactNode;\n  labels?: TaskRowsLabels;\n};\n\nconst DEFAULT_LABELS = { capsules: 'Capsules', list: 'List', retry: 'Retry', view: 'View' };\n\nconst STATUS_TONE: Record<AgentStatus, string> = {\n  pending: 'neutral',\n  running: 'info',\n  completed: 'success',\n  failed: 'danger',\n  skipped: 'neutral',\n};\n\nconst ChevronIcon: React.FC = () => (\n  <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n    <path d=\"m9 18 6-6-6-6\" />\n  </svg>\n);\n\nconst RetryIcon: React.FC = () => (\n  <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n    <path d=\"M3 12a9 9 0 1 0 3-6.7\" />\n    <path d=\"M3 4v5h5\" />\n  </svg>\n);\n\nconst StatusPill: React.FC<{ status: AgentStatus; label: string }> = ({ status, label }) => (\n  <span className={cn('dishui-ai-task-rows__status', `dishui-ai-task-rows__status--${STATUS_TONE[status]}`)}>\n    {status === 'running' && <span className=\"dishui-ai-task-rows__pulse\" aria-hidden=\"true\" />}\n    {label}\n  </span>\n);\n\nconst defaultExpandedFor = (tasks: AgentTask[]) =>\n  tasks.filter(t => t.status === 'running' || t.status === 'failed').map(t => t.id);\n\n/**\n * Live agent task status. Each task is a row (or capsule) with a text +\n * colour status pill, optional progress and expandable subtasks with\n * right-aligned tabular values.\n */\nexport default function TaskRows({\n  tasks,\n  view: viewProp,\n  defaultView = 'capsules',\n  onViewChange,\n  showViewToggle = false,\n  expanded: expandedProp,\n  defaultExpanded,\n  onExpandedChange,\n  onRetry,\n  emptyText = 'No tasks yet',\n  labels,\n  className,\n  ...rest\n}: TaskRowsProps) {\n  const baseId = useId();\n  const text = { ...DEFAULT_LABELS, ...labels };\n\n  const [internalView, setInternalView] = useState<TaskRowsView>(defaultView);\n  const view = viewProp ?? internalView;\n  const changeView = useCallback((next: TaskRowsView) => {\n    setInternalView(next);\n    onViewChange?.(next);\n  }, [onViewChange]);\n\n  const [internalExpanded, setInternalExpanded] = useState<string[]>(\n    () => defaultExpanded ?? defaultExpandedFor(tasks),\n  );\n  const expanded = expandedProp ?? internalExpanded;\n  const toggle = useCallback((id: string) => {\n    const next = expanded.includes(id) ? expanded.filter(x => x !== id) : [...expanded, id];\n    setInternalExpanded(next);\n    onExpandedChange?.(next);\n  }, [expanded, onExpandedChange]);\n\n  const statusLabel = (status: AgentStatus) => labels?.status?.[status] ?? AGENT_STATUS_LABEL[status];\n\n  return (\n    <div {...rest} className={cn('dishui-ai-task-rows', `dishui-ai-task-rows--${view}`, className)}>\n      {showViewToggle && (\n        <div className=\"dishui-ai-task-rows__toolbar\">\n          <div className=\"dishui-ai-task-rows__segmented\" role=\"group\" aria-label={text.view}>\n            {(['capsules', 'list'] as TaskRowsView[]).map(v => (\n              <button\n                key={v}\n                type=\"button\"\n                className={cn('dishui-ai-task-rows__segment', v === view && 'dishui-ai-task-rows__segment--active')}\n                aria-pressed={v === view}\n                onClick={() => changeView(v)}\n              >\n                {text[v]}\n              </button>\n            ))}\n          </div>\n        </div>\n      )}\n\n      {tasks.length === 0 ? (\n        <div className=\"dishui-ai-task-rows__empty\">{emptyText}</div>\n      ) : (\n        <ul className=\"dishui-ai-task-rows__list\">\n          {tasks.map(task => {\n            const hasSubtasks = !!task.subtasks?.length;\n            const isOpen = hasSubtasks && expanded.includes(task.id);\n            const panelId = `${baseId}-${task.id}`;\n            const progress = task.progress === undefined ? undefined : clamp(task.progress, 0, 100);\n            const showBar = view === 'capsules' && (progress !== undefined || task.status === 'running');\n            return (\n              <li\n                key={task.id}\n                className={cn(\n                  'dishui-ai-task-rows__task',\n                  `dishui-ai-task-rows__task--${task.status}`,\n                  isOpen && 'dishui-ai-task-rows__task--open',\n                )}\n              >\n                <div className=\"dishui-ai-task-rows__row\">\n                  {hasSubtasks ? (\n                    <button\n                      type=\"button\"\n                      className=\"dishui-ai-task-rows__toggle\"\n                      aria-expanded={isOpen}\n                      aria-controls={panelId}\n                      onClick={() => toggle(task.id)}\n                    >\n                      <span className=\"dishui-ai-task-rows__chevron\"><ChevronIcon /></span>\n                      <span className=\"dishui-ai-task-rows__title\">{task.title}</span>\n                      {task.meta !== undefined && <span className=\"dishui-ai-task-rows__meta\">{task.meta}</span>}\n                    </button>\n                  ) : (\n                    <div className=\"dishui-ai-task-rows__toggle dishui-ai-task-rows__toggle--static\">\n                      <span className=\"dishui-ai-task-rows__chevron dishui-ai-task-rows__chevron--blank\" />\n                      <span className=\"dishui-ai-task-rows__title\">{task.title}</span>\n                      {task.meta !== undefined && <span className=\"dishui-ai-task-rows__meta\">{task.meta}</span>}\n                    </div>\n                  )}\n                  {progress !== undefined && task.status === 'running' && (\n                    <span className=\"dishui-ai-task-rows__percent\">{Math.round(progress)}%</span>\n                  )}\n                  <StatusPill status={task.status} label={statusLabel(task.status)} />\n                </div>\n\n                {showBar && (\n                  <div\n                    className={cn('dishui-ai-task-rows__bar', progress === undefined && 'dishui-ai-task-rows__bar--indeterminate')}\n                    role=\"progressbar\"\n                    aria-valuemin={0}\n                    aria-valuemax={100}\n                    aria-valuenow={progress}\n                  >\n                    <span className=\"dishui-ai-task-rows__fill\" style={progress === undefined ? undefined : { width: `${progress}%` }} />\n                  </div>\n                )}\n\n                {task.status === 'failed' && (task.error !== undefined || onRetry) && (\n                  <div className=\"dishui-ai-task-rows__error\" role=\"alert\">\n                    <span className=\"dishui-ai-task-rows__error-text\">{task.error}</span>\n                    {onRetry && (\n                      <button type=\"button\" className=\"dishui-ai-task-rows__retry\" onClick={() => onRetry(task)}>\n                        <RetryIcon />\n                        {text.retry}\n                      </button>\n                    )}\n                  </div>\n                )}\n\n                {hasSubtasks && (\n                  <ul id={panelId} className=\"dishui-ai-task-rows__subtasks\" hidden={!isOpen}>\n                    {task.subtasks!.map(sub => (\n                      <li\n                        key={sub.id}\n                        className={cn('dishui-ai-task-rows__subtask', sub.status && `dishui-ai-task-rows__subtask--${sub.status}`)}\n                      >\n                        <span className=\"dishui-ai-task-rows__subtitle\">{sub.title}</span>\n                        {sub.value !== undefined && <span className=\"dishui-ai-task-rows__value\">{sub.value}</span>}\n                        {sub.status && sub.status !== task.status && (\n                          <span className=\"dishui-ai-task-rows__substatus\">{statusLabel(sub.status)}</span>\n                        )}\n                      </li>\n                    ))}\n                  </ul>\n                )}\n              </li>\n            );\n          })}\n        </ul>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/ai/Thinking/index.d.ts

@@ -0,0 +1,47 @@
+import React from 'react';
+import type { AgentStatus } from '../shared';
+export type ThinkingStepKind = 'step' | 'reasoning' | 'search' | 'coding';
+export type ThinkingMode = 'steps' | 'reasoning' | 'search' | 'coding' | 'auto';
+export type ThinkingStatus = 'thinking' | 'done';
+export type ThinkingSearchResult = {
+    title: string;
+    url?: string;
+    domain?: string;
+};
+export type ThinkingCode = {
+    language?: string;
+    content: string;
+    file?: string;
+};
+export type ThinkingStep = {
+    id: string;
+    kind: ThinkingStepKind;
+    title: React.ReactNode;
+    detail?: React.ReactNode;
+    /** Defaults to `completed`. */
+    status?: AgentStatus;
+    durationMs?: number;
+    /** Result chips rendered by `search` steps. */
+    results?: ThinkingSearchResult[];
+    /** Code block rendered by `coding` steps. */
+    code?: ThinkingCode;
+};
+export type ThinkingProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'title'> & {
+    steps: ThinkingStep[];
+    /** Derived from the steps when omitted: any running step → `thinking`. */
+    status?: ThinkingStatus;
+    /** Total time; rendered as “Thought for 4s” once done. Falls back to the sum of step durations. */
+    durationMs?: number;
+    /** Overrides the default “Thinking” / “Thought for …” header text. */
+    title?: React.ReactNode;
+    expanded?: boolean;
+    defaultExpanded?: boolean;
+    onExpandedChange?: (expanded: boolean) => void;
+    /** Rendering emphasis. `auto` renders each step by its own `kind`. */
+    mode?: ThinkingMode;
+};
+/**
+ * Expandable reasoning trace. Collapsed by default; the header summarises the
+ * currently running step while collapsed and reads “Thought for …” once done.
+ */
+export default function Thinking({ steps, status: statusProp, durationMs, title, expanded: expandedProp, defaultExpanded, onExpandedChange, mode, className, ...rest }: ThinkingProps): React.JSX.Element;