@dowel-ui/react 0.1.1 → 0.3.0

package/dist/components/ai-inline-completion/ai-inline-completion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-inline-completion.d.ts","names":[],"sources":["../../../src/components/ai-inline-completion/ai-inline-completion.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;UAwCiB,8BAA8B,KAC7C;EAGA;EACA,gBAAgB;;;;;EAKhB;;EAEA,YAAY;;EAEZ;;EAEA;;iBASc,mBACd,WACA,OACA,eACA,YACA,UACA,WACA,YACA,WACA,aACG,SACF,wCAAqB,IAAA"}

package/dist/components/ai-inline-completion/ai-inline-completion.js

@@ -0,0 +1,110 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useId, useRef, useState } from "react";
+//#region src/components/ai-inline-completion/ai-inline-completion.tsx
+/** The next word of a suggestion, including its leading space. */
+function nextWord(suggestion) {
+	const match = /^\s*\S+/.exec(suggestion);
+	return match ? match[0] : suggestion;
+}
+function InlineCompletion({ className, value, onValueChange, suggestion = "", onAccept, onDismiss, singleLine = false, onKeyDown, onScroll, ...props }) {
+	const fieldRef = useRef(null);
+	const mirrorRef = useRef(null);
+	const describedById = useId();
+	const [dismissed, setDismissed] = useState(false);
+	const [composing, setComposing] = useState(false);
+	const [caretAtEnd, setCaretAtEnd] = useState(true);
+	const visible = suggestion.length > 0 && !dismissed && !composing && caretAtEnd;
+	function syncCaret() {
+		const field = fieldRef.current;
+		if (!field) return;
+		setCaretAtEnd(field.selectionStart === value.length && field.selectionEnd === value.length);
+	}
+	function accept(text) {
+		const next = value + text;
+		onValueChange(next);
+		onAccept?.(next);
+		setDismissed(false);
+	}
+	function handleKeyDown(event) {
+		onKeyDown?.(event);
+		if (event.defaultPrevented) return;
+		if (!visible) return;
+		if (event.key === "ArrowRight" && (event.metaKey || event.altKey || event.ctrlKey)) {
+			event.preventDefault();
+			accept(nextWord(suggestion));
+			return;
+		}
+		if (event.key === "Tab") {
+			event.preventDefault();
+			accept(suggestion);
+			return;
+		}
+		if (event.key === "Escape") {
+			event.preventDefault();
+			setDismissed(true);
+			onDismiss?.();
+		}
+	}
+	function handleChange(event) {
+		setDismissed(false);
+		onValueChange(event.target.value);
+		queueMicrotask(syncCaret);
+	}
+	function handleScroll(event) {
+		onScroll?.(event);
+		if (mirrorRef.current) {
+			mirrorRef.current.scrollTop = event.currentTarget.scrollTop;
+			mirrorRef.current.scrollLeft = event.currentTarget.scrollLeft;
+		}
+	}
+	function handleComposition(event) {
+		setComposing(event.type === "compositionstart");
+	}
+	const shared = cn("w-full rounded-md border border-input px-3 py-2 text-sm", singleLine ? "overflow-x-auto whitespace-pre" : "break-words whitespace-pre-wrap");
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "inline-completion",
+		className: cn("relative", className),
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				ref: mirrorRef,
+				"aria-hidden": "true",
+				"data-slot": "inline-completion-ghost",
+				className: cn(shared, "pointer-events-none absolute inset-0 overflow-hidden border-transparent text-transparent select-none"),
+				children: [value, visible ? /* @__PURE__ */ jsx("span", {
+					"data-slot": "inline-completion-suggestion",
+					className: "text-muted-foreground",
+					children: suggestion
+				}) : null]
+			}),
+			/* @__PURE__ */ jsx("textarea", {
+				ref: fieldRef,
+				"data-slot": "inline-completion-field",
+				"data-suggesting": visible || void 0,
+				rows: singleLine ? 1 : props.rows,
+				value,
+				onChange: handleChange,
+				onKeyDown: handleKeyDown,
+				onScroll: handleScroll,
+				onSelect: syncCaret,
+				onClick: syncCaret,
+				onCompositionStart: handleComposition,
+				onCompositionEnd: handleComposition,
+				"aria-describedby": visible ? describedById : void 0,
+				className: cn(shared, "relative resize-none bg-transparent", "placeholder:text-muted-foreground", "outline-none focus-visible:ring-2 focus-visible:ring-ring/55", singleLine && "resize-none"),
+				...props
+			}),
+			/* @__PURE__ */ jsx("span", {
+				id: describedById,
+				"aria-live": "polite",
+				className: "sr-only",
+				children: visible ? `Suggestion: ${suggestion}. Press Tab to accept, Escape to dismiss.` : ""
+			})
+		]
+	});
+}
+//#endregion
+export { InlineCompletion };
+
+//# sourceMappingURL=ai-inline-completion.js.map

package/dist/components/ai-inline-completion/ai-inline-completion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-inline-completion.js","names":[],"sources":["../../../src/components/ai-inline-completion/ai-inline-completion.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  useId,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type ComponentPropsWithRef,\n  type CompositionEvent,\n  type KeyboardEvent,\n  type UIEvent,\n} from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\n/**\n * Ghost-text suggestion inside a real textarea or input.\n *\n * Outside chat this is the most-copied AI affordance in software — Smart\n * Compose, Copilot's grey continuation, Notion and Linear's inline suggestions —\n * and every team rebuilds the same overlay-mirror trick from the same handful of\n * blog posts.\n *\n * Two deliberate limits, both stated rather than discovered:\n *\n * 1. It works on `textarea` and `input`, not on contenteditable. Ghost text in\n *    contenteditable means owning selection, undo and inline formatting, which\n *    is an editor, not a component. Anyone in that territory already has\n *    ProseMirror or Lexical and should extend it there.\n * 2. The suggestion completes the END of the value. Mid-caret insertion needs\n *    per-character measurement of wrapped text; the ghost hides whenever the\n *    caret is not at the end rather than rendering in the wrong place.\n *\n * There is no WAI-ARIA pattern for generative ghost text. Combobox is the\n * nearest and does not fit: the suggestion is not one of a known set of options,\n * so a listbox would be a lie. What the standard does require is that the\n * suggestion be perceivable and that the keyboard is never trapped — so the text\n * is announced through a live description, and Escape always restores plain Tab.\n */\n\nexport interface InlineCompletionProps extends Omit<\n  ComponentPropsWithRef<\"textarea\">,\n  \"value\" | \"onChange\" | \"children\"\n> {\n  value: string;\n  onValueChange: (value: string) => void;\n  /**\n   * The continuation to show after the value. Empty or undefined shows nothing.\n   * The caller supplies this; the component never requests it.\n   */\n  suggestion?: string;\n  /** Called with the full text after the suggestion is taken. */\n  onAccept?: (value: string) => void;\n  /** Called when the reader rejects the suggestion outright. */\n  onDismiss?: () => void;\n  /** Renders a single-line input instead of a textarea. */\n  singleLine?: boolean;\n}\n\n/** The next word of a suggestion, including its leading space. */\nfunction nextWord(suggestion: string): string {\n  const match = /^\\s*\\S+/.exec(suggestion);\n  return match ? match[0] : suggestion;\n}\n\nexport function InlineCompletion({\n  className,\n  value,\n  onValueChange,\n  suggestion = \"\",\n  onAccept,\n  onDismiss,\n  singleLine = false,\n  onKeyDown,\n  onScroll,\n  ...props\n}: InlineCompletionProps) {\n  const fieldRef = useRef<HTMLTextAreaElement | null>(null);\n  const mirrorRef = useRef<HTMLDivElement | null>(null);\n  const describedById = useId();\n\n  const [dismissed, setDismissed] = useState(false);\n  const [composing, setComposing] = useState(false);\n  const [caretAtEnd, setCaretAtEnd] = useState(true);\n\n  // A suggestion is only shown when it can be shown honestly: not mid-word of\n  // an IME composition, not after the reader has rejected it, and not when the\n  // caret sits somewhere the ghost would render in the wrong place.\n  const visible = suggestion.length > 0 && !dismissed && !composing && caretAtEnd;\n\n  function syncCaret() {\n    const field = fieldRef.current;\n    if (!field) return;\n    setCaretAtEnd(field.selectionStart === value.length && field.selectionEnd === value.length);\n  }\n\n  function accept(text: string) {\n    const next = value + text;\n    onValueChange(next);\n    onAccept?.(next);\n    setDismissed(false);\n  }\n\n  function handleKeyDown(event: KeyboardEvent<HTMLTextAreaElement>) {\n    onKeyDown?.(event);\n    if (event.defaultPrevented) return;\n\n    if (!visible) return;\n\n    // Word-at-a-time, before the plain Tab case so the modifier wins.\n    if (event.key === \"ArrowRight\" && (event.metaKey || event.altKey || event.ctrlKey)) {\n      event.preventDefault();\n      accept(nextWord(suggestion));\n      return;\n    }\n\n    if (event.key === \"Tab\") {\n      event.preventDefault();\n      accept(suggestion);\n      return;\n    }\n\n    if (event.key === \"Escape\") {\n      // The escape hatch. Without it, a keyboard user facing a suggestion has\n      // no way to leave the field: Tab would accept instead of moving focus.\n      event.preventDefault();\n      setDismissed(true);\n      onDismiss?.();\n    }\n  }\n\n  function handleChange(event: ChangeEvent<HTMLTextAreaElement>) {\n    // Any edit invalidates the previous rejection: the reader has moved on and\n    // the next suggestion is a different one.\n    setDismissed(false);\n    onValueChange(event.target.value);\n    queueMicrotask(syncCaret);\n  }\n\n  function handleScroll(event: UIEvent<HTMLTextAreaElement>) {\n    onScroll?.(event);\n    // The mirror has to follow the field, or the ghost detaches from the text\n    // as soon as the content is taller than the box.\n    if (mirrorRef.current) {\n      mirrorRef.current.scrollTop = event.currentTarget.scrollTop;\n      mirrorRef.current.scrollLeft = event.currentTarget.scrollLeft;\n    }\n  }\n\n  function handleComposition(event: CompositionEvent<HTMLTextAreaElement>) {\n    setComposing(event.type === \"compositionstart\");\n  }\n\n  // Typography must match exactly between field and mirror or the ghost lands\n  // in the wrong place. Both take the same class string for that reason.\n  const shared = cn(\n    \"w-full rounded-md border border-input px-3 py-2 text-sm\",\n    singleLine ? \"overflow-x-auto whitespace-pre\" : \"break-words whitespace-pre-wrap\",\n  );\n\n  return (\n    <div data-slot=\"inline-completion\" className={cn(\"relative\", className)}>\n      {/* The mirror sits behind the field and holds the value in transparent\n          text purely to push the ghost to the caret position. */}\n      <div\n        ref={mirrorRef}\n        aria-hidden=\"true\"\n        data-slot=\"inline-completion-ghost\"\n        className={cn(\n          shared,\n          \"pointer-events-none absolute inset-0 overflow-hidden border-transparent text-transparent select-none\",\n        )}\n      >\n        {value}\n        {visible ? (\n          <span data-slot=\"inline-completion-suggestion\" className=\"text-muted-foreground\">\n            {suggestion}\n          </span>\n        ) : null}\n      </div>\n\n      <textarea\n        ref={fieldRef}\n        data-slot=\"inline-completion-field\"\n        data-suggesting={visible || undefined}\n        rows={singleLine ? 1 : props.rows}\n        value={value}\n        onChange={handleChange}\n        onKeyDown={handleKeyDown}\n        onScroll={handleScroll}\n        onSelect={syncCaret}\n        onClick={syncCaret}\n        onCompositionStart={handleComposition}\n        onCompositionEnd={handleComposition}\n        aria-describedby={visible ? describedById : undefined}\n        className={cn(\n          shared,\n          \"relative resize-none bg-transparent\",\n          \"placeholder:text-muted-foreground\",\n          \"outline-none focus-visible:ring-2 focus-visible:ring-ring/55\",\n          singleLine && \"resize-none\",\n        )}\n        {...props}\n      />\n\n      {/* The suggestion as text, for anyone who cannot see grey glyphs behind a\n          field. Polite, so it does not interrupt typing, and it states the keys\n          because a gesture nobody knows about is not an affordance. */}\n      <span id={describedById} aria-live=\"polite\" className=\"sr-only\">\n        {visible ? `Suggestion: ${suggestion}. Press Tab to accept, Escape to dismiss.` : \"\"}\n      </span>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AA4DA,SAAS,SAAS,YAA4B;CAC5C,MAAM,QAAQ,UAAU,KAAK,UAAU;CACvC,OAAO,QAAQ,MAAM,KAAK;AAC5B;AAEA,SAAgB,iBAAiB,EAC/B,WACA,OACA,eACA,aAAa,IACb,UACA,WACA,aAAa,OACb,WACA,UACA,GAAG,SACqB;CACxB,MAAM,WAAW,OAAmC,IAAI;CACxD,MAAM,YAAY,OAA8B,IAAI;CACpD,MAAM,gBAAgB,MAAM;CAE5B,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;CAChD,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;CAChD,MAAM,CAAC,YAAY,iBAAiB,SAAS,IAAI;CAKjD,MAAM,UAAU,WAAW,SAAS,KAAK,CAAC,aAAa,CAAC,aAAa;CAErE,SAAS,YAAY;EACnB,MAAM,QAAQ,SAAS;EACvB,IAAI,CAAC,OAAO;EACZ,cAAc,MAAM,mBAAmB,MAAM,UAAU,MAAM,iBAAiB,MAAM,MAAM;CAC5F;CAEA,SAAS,OAAO,MAAc;EAC5B,MAAM,OAAO,QAAQ;EACrB,cAAc,IAAI;EAClB,WAAW,IAAI;EACf,aAAa,KAAK;CACpB;CAEA,SAAS,cAAc,OAA2C;EAChE,YAAY,KAAK;EACjB,IAAI,MAAM,kBAAkB;EAE5B,IAAI,CAAC,SAAS;EAGd,IAAI,MAAM,QAAQ,iBAAiB,MAAM,WAAW,MAAM,UAAU,MAAM,UAAU;GAClF,MAAM,eAAe;GACrB,OAAO,SAAS,UAAU,CAAC;GAC3B;EACF;EAEA,IAAI,MAAM,QAAQ,OAAO;GACvB,MAAM,eAAe;GACrB,OAAO,UAAU;GACjB;EACF;EAEA,IAAI,MAAM,QAAQ,UAAU;GAG1B,MAAM,eAAe;GACrB,aAAa,IAAI;GACjB,YAAY;EACd;CACF;CAEA,SAAS,aAAa,OAAyC;EAG7D,aAAa,KAAK;EAClB,cAAc,MAAM,OAAO,KAAK;EAChC,eAAe,SAAS;CAC1B;CAEA,SAAS,aAAa,OAAqC;EACzD,WAAW,KAAK;EAGhB,IAAI,UAAU,SAAS;GACrB,UAAU,QAAQ,YAAY,MAAM,cAAc;GAClD,UAAU,QAAQ,aAAa,MAAM,cAAc;EACrD;CACF;CAEA,SAAS,kBAAkB,OAA8C;EACvE,aAAa,MAAM,SAAS,kBAAkB;CAChD;CAIA,MAAM,SAAS,GACb,2DACA,aAAa,mCAAmC,iCAClD;CAEA,OACE,qBAAC,OAAD;EAAK,aAAU;EAAoB,WAAW,GAAG,YAAY,SAAS;EAAtE,UAAA;GAGE,qBAAC,OAAD;IACE,KAAK;IACL,eAAY;IACZ,aAAU;IACV,WAAW,GACT,QACA,sGACF;IAPF,UAAA,CASG,OACA,UACC,oBAAC,QAAD;KAAM,aAAU;KAA+B,WAAU;KACtD,UAAA;IACG,CAAA,IACJ,IACD;;GAEL,oBAAC,YAAD;IACE,KAAK;IACL,aAAU;IACV,mBAAiB,WAAW,KAAA;IAC5B,MAAM,aAAa,IAAI,MAAM;IACtB;IACP,UAAU;IACV,WAAW;IACX,UAAU;IACV,UAAU;IACV,SAAS;IACT,oBAAoB;IACpB,kBAAkB;IAClB,oBAAkB,UAAU,gBAAgB,KAAA;IAC5C,WAAW,GACT,QACA,uCACA,qCACA,gEACA,cAAc,aAChB;IACA,GAAI;GACL,CAAA;GAKD,oBAAC,QAAD;IAAM,IAAI;IAAe,aAAU;IAAS,WAAU;IACnD,UAAA,UAAU,eAAe,WAAW,6CAA6C;GAC9E,CAAA;EACH;;AAET"}

package/dist/components/ai-inline-completion/index.d.ts

@@ -0,0 +1,2 @@
+import { InlineCompletion, InlineCompletionProps } from "./ai-inline-completion.js";
+export { InlineCompletion, type InlineCompletionProps };

package/dist/components/ai-inline-completion/index.js

@@ -0,0 +1,2 @@
+import { InlineCompletion } from "./ai-inline-completion.js";
+export { InlineCompletion };

package/dist/components/ai-inline-completion/meta.js

@@ -0,0 +1,17 @@
+import { defineMeta } from "../../registry/schema.js";
+//#region src/components/ai-inline-completion/meta.ts
+const meta = defineMeta({
+	name: "ai-inline-completion",
+	title: "AI Inline Completion",
+	description: "Ghost-text suggestion inside a real textarea, accepted with Tab.",
+	category: "ai",
+	status: "beta",
+	dependencies: [],
+	registryDependencies: [],
+	files: ["ai-inline-completion.tsx"],
+	a11y: "No WAI-ARIA pattern covers generative ghost text — combobox is the nearest and does not fit, because the suggestion is not one of a known set of options and a listbox would misdescribe it. So the suggestion is announced through a polite live description that names the keys, since a gesture nobody knows about is not an affordance, and the grey text itself is aria-hidden. Escape always dismisses and restores plain Tab, so the keyboard is never trapped in the field. The ghost hides during IME composition and whenever the caret is not at the end, rather than rendering somewhere it does not belong."
+});
+//#endregion
+export { meta };
+
+//# sourceMappingURL=meta.js.map

package/dist/components/ai-inline-completion/meta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.js","names":[],"sources":["../../../src/components/ai-inline-completion/meta.ts"],"sourcesContent":["import { defineMeta } from \"@/registry/schema\";\n\nexport const meta = defineMeta({\n  name: \"ai-inline-completion\",\n  title: \"AI Inline Completion\",\n  description: \"Ghost-text suggestion inside a real textarea, accepted with Tab.\",\n  category: \"ai\",\n  status: \"beta\",\n  dependencies: [],\n  registryDependencies: [],\n  files: [\"ai-inline-completion.tsx\"],\n  a11y:\n    \"No WAI-ARIA pattern covers generative ghost text — combobox is the nearest and does not fit, \" +\n    \"because the suggestion is not one of a known set of options and a listbox would misdescribe \" +\n    \"it. So the suggestion is announced through a polite live description that names the keys, \" +\n    \"since a gesture nobody knows about is not an affordance, and the grey text itself is \" +\n    \"aria-hidden. Escape always dismisses and restores plain Tab, so the keyboard is never \" +\n    \"trapped in the field. The ghost hides during IME composition and whenever the caret is not \" +\n    \"at the end, rather than rendering somewhere it does not belong.\",\n});\n"],"mappings":";;AAEA,MAAa,OAAO,WAAW;CAC7B,MAAM;CACN,OAAO;CACP,aAAa;CACb,UAAU;CACV,QAAQ;CACR,cAAc,CAAC;CACf,sBAAsB,CAAC;CACvB,OAAO,CAAC,0BAA0B;CAClC,MACE;AAOJ,CAAC"}

package/dist/components/ai-response/ai-response.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ai-response.d.ts","names":[],"sources":["../../../src/components/ai-response/ai-response.tsx"],"mappings":";;;;;;;;;;;;;;UAkBiB,sBAAsB;;EAErC;;iBAGc,WAAW,WAAW,WAAW,aAAa,SAAS,gCAAa,IAAA;;;iBAwBpE,gBAAgB,cAAc,SAAS,gDAA6B,IAAA;;;;;;;;UAqBnE,+BAA+B;EAC9C;;iBAGc,oBACd,WACA,UACG,SACF,yCAAsB,IAAA"}
+{"version":3,"file":"ai-response.d.ts","names":[],"sources":["../../../src/components/ai-response/ai-response.tsx"],"mappings":";;;;;;;;;;;;;;UAkBiB,sBAAsB;;EAErC;;iBAGc,WAAW,WAAW,WAAW,aAAa,SAAS,gCAAa,IAAA;;;iBAwBpE,gBAAgB,cAAc,SAAS,gDAA6B,IAAA;;;;;;;;UAsBnE,+BAA+B;EAC9C;;iBAGc,oBACd,WACA,UACG,SACF,yCAAsB,IAAA"}

package/dist/components/ai-response/ai-response.js

@@ -17,6 +17,7 @@ function ResponseCaret({ className, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		"data-slot": "response-caret",
 		"aria-hidden": "true",
+		"data-motion": "indicator",
 		className: cn("ml-0.5 inline-block h-[1em] w-[2px] translate-y-[0.15em] animate-caret bg-current align-baseline", className),
 		...props
 	});

package/dist/components/ai-response/ai-response.js.map

@@ -1 +1 @@
-{"version":3,"file":"ai-response.js","names":[],"sources":["../../../src/components/ai-response/ai-response.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentPropsWithRef } from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\n/**\n * The text of an assistant response.\n *\n * Renders plain text with paragraph whitespace preserved. Markdown is\n * deliberately not parsed here: a Markdown renderer is a dependency, a security\n * decision about raw HTML, and a styling surface all at once, and every product\n * makes those differently. Pass already-rendered content as children when you\n * need it — the prose styling below applies either way.\n *\n * Not a live region, and not by omission. See the note on `Conversation`:\n * announcing streamed text token by token is unusable with a screen reader.\n */\nexport interface ResponseProps extends ComponentPropsWithRef<\"div\"> {\n  /** Shows the caret. Purely visual — it carries no announcement. */\n  streaming?: boolean;\n}\n\nexport function Response({ className, streaming, children, ...props }: ResponseProps) {\n  return (\n    <div\n      data-slot=\"response\"\n      data-streaming={streaming || undefined}\n      className={cn(\n        \"text-sm leading-relaxed whitespace-pre-wrap text-foreground\",\n        // Minimal prose styling for consumers who pass rendered Markdown.\n        \"[&_a]:text-primary [&_a]:underline [&_a]:underline-offset-4\",\n        \"[&_code]:rounded [&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:font-mono [&_code]:text-[0.9em]\",\n        \"[&_ol]:my-2 [&_ol]:list-decimal [&_ol]:pl-5 [&_ul]:my-2 [&_ul]:list-disc [&_ul]:pl-5\",\n        \"[&_p+p]:mt-3\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {streaming ? <ResponseCaret /> : null}\n    </div>\n  );\n}\n\n/** The trailing cursor. Decorative — the streaming state is announced, if at\n * all, through ConversationStatus. */\nexport function ResponseCaret({ className, ...props }: ComponentPropsWithRef<\"span\">) {\n  return (\n    <span\n      data-slot=\"response-caret\"\n      aria-hidden=\"true\"\n      className={cn(\n        \"ml-0.5 inline-block h-[1em] w-[2px] translate-y-[0.15em] animate-caret bg-current align-baseline\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Shown while waiting for the first token.\n *\n * A distinct state from streaming: nothing has arrived yet, so there is no text\n * to show a caret after. Labelled for assistive technology because, unlike the\n * caret, this is the only thing on screen.\n */\nexport interface ThinkingIndicatorProps extends ComponentPropsWithRef<\"div\"> {\n  label?: string;\n}\n\nexport function ThinkingIndicator({\n  className,\n  label = \"Thinking\",\n  ...props\n}: ThinkingIndicatorProps) {\n  return (\n    <div\n      data-slot=\"thinking-indicator\"\n      className={cn(\"flex items-center gap-1.5 text-sm text-muted-foreground\", className)}\n      {...props}\n    >\n      <span className=\"sr-only\">{label}</span>\n      {[0, 1, 2].map((index) => (\n        <span\n          key={index}\n          aria-hidden=\"true\"\n          className=\"size-1.5 animate-pulse-soft rounded-full bg-current\"\n          style={{ animationDelay: `${String(index * 160)}ms` }}\n        />\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;AAuBA,SAAgB,SAAS,EAAE,WAAW,WAAW,UAAU,GAAG,SAAwB;CACpF,OACE,qBAAC,OAAD;EACE,aAAU;EACV,kBAAgB,aAAa,KAAA;EAC7B,WAAW,GACT,+DAEA,+DACA,6GACA,wFACA,gBACA,SACF;EACA,GAAI;EAZN,UAAA,CAcG,UACA,YAAY,oBAAC,eAAD,CAAgB,CAAA,IAAI,IAC9B;;AAET;;;AAIA,SAAgB,cAAc,EAAE,WAAW,GAAG,SAAwC;CACpF,OACE,oBAAC,QAAD;EACE,aAAU;EACV,eAAY;EACZ,WAAW,GACT,oGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAaA,SAAgB,kBAAkB,EAChC,WACA,QAAQ,YACR,GAAG,SACsB;CACzB,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,2DAA2D,SAAS;EAClF,GAAI;EAHN,UAAA,CAKE,oBAAC,QAAD;GAAM,WAAU;GAAW,UAAA;EAAY,CAAA,GACtC;GAAC;GAAG;GAAG;EAAC,CAAC,CAAC,KAAK,UACd,oBAAC,QAAD;GAEE,eAAY;GACZ,WAAU;GACV,OAAO,EAAE,gBAAgB,GAAG,OAAO,QAAQ,GAAG,EAAE,IAAI;EACrD,GAJM,KAIN,CACF,CACE;;AAET"}
+{"version":3,"file":"ai-response.js","names":[],"sources":["../../../src/components/ai-response/ai-response.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentPropsWithRef } from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\n/**\n * The text of an assistant response.\n *\n * Renders plain text with paragraph whitespace preserved. Markdown is\n * deliberately not parsed here: a Markdown renderer is a dependency, a security\n * decision about raw HTML, and a styling surface all at once, and every product\n * makes those differently. Pass already-rendered content as children when you\n * need it — the prose styling below applies either way.\n *\n * Not a live region, and not by omission. See the note on `Conversation`:\n * announcing streamed text token by token is unusable with a screen reader.\n */\nexport interface ResponseProps extends ComponentPropsWithRef<\"div\"> {\n  /** Shows the caret. Purely visual — it carries no announcement. */\n  streaming?: boolean;\n}\n\nexport function Response({ className, streaming, children, ...props }: ResponseProps) {\n  return (\n    <div\n      data-slot=\"response\"\n      data-streaming={streaming || undefined}\n      className={cn(\n        \"text-sm leading-relaxed whitespace-pre-wrap text-foreground\",\n        // Minimal prose styling for consumers who pass rendered Markdown.\n        \"[&_a]:text-primary [&_a]:underline [&_a]:underline-offset-4\",\n        \"[&_code]:rounded [&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:font-mono [&_code]:text-[0.9em]\",\n        \"[&_ol]:my-2 [&_ol]:list-decimal [&_ol]:pl-5 [&_ul]:my-2 [&_ul]:list-disc [&_ul]:pl-5\",\n        \"[&_p+p]:mt-3\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {streaming ? <ResponseCaret /> : null}\n    </div>\n  );\n}\n\n/** The trailing cursor. Decorative — the streaming state is announced, if at\n * all, through ConversationStatus. */\nexport function ResponseCaret({ className, ...props }: ComponentPropsWithRef<\"span\">) {\n  return (\n    <span\n      data-slot=\"response-caret\"\n      aria-hidden=\"true\"\n      data-motion=\"indicator\"\n      className={cn(\n        \"ml-0.5 inline-block h-[1em] w-[2px] translate-y-[0.15em] animate-caret bg-current align-baseline\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Shown while waiting for the first token.\n *\n * A distinct state from streaming: nothing has arrived yet, so there is no text\n * to show a caret after. Labelled for assistive technology because, unlike the\n * caret, this is the only thing on screen.\n */\nexport interface ThinkingIndicatorProps extends ComponentPropsWithRef<\"div\"> {\n  label?: string;\n}\n\nexport function ThinkingIndicator({\n  className,\n  label = \"Thinking\",\n  ...props\n}: ThinkingIndicatorProps) {\n  return (\n    <div\n      data-slot=\"thinking-indicator\"\n      className={cn(\"flex items-center gap-1.5 text-sm text-muted-foreground\", className)}\n      {...props}\n    >\n      <span className=\"sr-only\">{label}</span>\n      {[0, 1, 2].map((index) => (\n        <span\n          key={index}\n          aria-hidden=\"true\"\n          className=\"size-1.5 animate-pulse-soft rounded-full bg-current\"\n          style={{ animationDelay: `${String(index * 160)}ms` }}\n        />\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;AAuBA,SAAgB,SAAS,EAAE,WAAW,WAAW,UAAU,GAAG,SAAwB;CACpF,OACE,qBAAC,OAAD;EACE,aAAU;EACV,kBAAgB,aAAa,KAAA;EAC7B,WAAW,GACT,+DAEA,+DACA,6GACA,wFACA,gBACA,SACF;EACA,GAAI;EAZN,UAAA,CAcG,UACA,YAAY,oBAAC,eAAD,CAAgB,CAAA,IAAI,IAC9B;;AAET;;;AAIA,SAAgB,cAAc,EAAE,WAAW,GAAG,SAAwC;CACpF,OACE,oBAAC,QAAD;EACE,aAAU;EACV,eAAY;EACZ,eAAY;EACZ,WAAW,GACT,oGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAaA,SAAgB,kBAAkB,EAChC,WACA,QAAQ,YACR,GAAG,SACsB;CACzB,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,2DAA2D,SAAS;EAClF,GAAI;EAHN,UAAA,CAKE,oBAAC,QAAD;GAAM,WAAU;GAAW,UAAA;EAAY,CAAA,GACtC;GAAC;GAAG;GAAG;EAAC,CAAC,CAAC,KAAK,UACd,oBAAC,QAAD;GAEE,eAAY;GACZ,WAAU;GACV,OAAO,EAAE,gBAAgB,GAAG,OAAO,QAAQ,GAAG,EAAE,IAAI;EACrD,GAJM,KAIN,CACF,CACE;;AAET"}

package/dist/components/ai-structured-output/ai-structured-output.d.ts

@@ -0,0 +1,75 @@
+import { ComponentPropsWithRef, ReactNode } from "react";
+//#region src/components/ai-structured-output/ai-structured-output.d.ts
+/**
+ * An object arriving field by field from the model.
+ *
+ * Most AI features inside real software are not chatbots. They are invoice
+ * extraction, CRM enrichment, resume parsing, form autofill — a schema goes in
+ * and a filled object comes back. Every one of them streams a partial object
+ * into a layout, and almost every one reflows on each token because the fields
+ * appear as they arrive.
+ *
+ * The honest limitation, stated here rather than discovered later: there is no
+ * per-field completion signal anywhere in the stack. A streaming API hands you
+ * successive partial snapshots, and a string that has stopped growing is
+ * indistinguishable from one still arriving. So this component does not pretend
+ * to know. It takes the field list up front, reserves the layout from it, and
+ * lets the caller say which fields are settled — defaulting to the rule that a
+ * field is settled once a later field has appeared, which is true of
+ * depth-first JSON streaming and is documented rather than assumed silently.
+ */
+type FieldState = "pending" | "streaming" | "settled" | "error";
+interface OutputField {
+  /** Key in the streamed object. */
+  name: string;
+  label: string;
+  /** Rough height reserved before the value arrives, in lines. */
+  lines?: number;
+}
+interface StructuredOutputProps extends Omit<ComponentPropsWithRef<"dl">, "children"> {
+  /** Declared up front, so layout is reserved before anything arrives. */
+  fields: OutputField[];
+  /** The latest partial snapshot. */
+  value: Record<string, unknown>;
+  /**
+   * True while more of the object is still expected. When false every present
+   * field is settled, which is the only completion signal that is ever certain.
+   */
+  streaming?: boolean;
+  /**
+   * Fields the caller knows are finished. Supply this when the API gives a
+   * real signal; otherwise the default rule applies.
+   */
+  settled?: string[];
+  /** Fields that failed to extract, with the reason shown in place. */
+  errors?: Record<string, string>;
+  formatValue?: (value: unknown, name: string) => string;
+  children?: ReactNode;
+}
+declare function StructuredOutput({ className, fields, value, streaming, settled, errors, formatValue, children, ...props }: StructuredOutputProps): import("react").JSX.Element;
+interface StructuredFieldProps extends Omit<ComponentPropsWithRef<"div">, "children"> {
+  name: string;
+  children?: ReactNode;
+}
+/**
+ * One field: its label, its value, and the space it will occupy before it has
+ * one.
+ *
+ * The reserved height is what stops the layout jumping as the object fills in.
+ */
+declare function StructuredField({ className, name, children, ...props }: StructuredFieldProps): import("react").JSX.Element;
+/**
+ * A confidence score for one field.
+ *
+ * Rendered as text with the number, never as a bare colour, because "how much
+ * should I trust this" is exactly the thing a colour cannot answer.
+ */
+declare function StructuredConfidence({ className, value: confidence, lowBelow, ...props }: ComponentPropsWithRef<"p"> & {
+  value: number;
+  lowBelow?: number;
+}): import("react").JSX.Element;
+/** The reason a field could not be extracted, shown where the value would be. */
+declare function StructuredFieldError({ className, ...props }: ComponentPropsWithRef<"p">): import("react").JSX.Element;
+//#endregion
+export { FieldState, OutputField, StructuredConfidence, StructuredField, StructuredFieldError, StructuredFieldProps, StructuredOutput, StructuredOutputProps };
+//# sourceMappingURL=ai-structured-output.d.ts.map

package/dist/components/ai-structured-output/ai-structured-output.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-structured-output.d.ts","names":[],"sources":["../../../src/components/ai-structured-output/ai-structured-output.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;KAgCY;UAEK;;EAEf;EACA;;EAEA;;UA6Be,8BAA8B,KAAK;;EAElD,QAAQ;;EAER,OAAO;;;;;EAKP;;;;;EAKA;;EAEA,SAAS;EACT,eAAe,gBAAgB;EAC/B,WAAW;;iBAGG,mBACd,WACA,QACA,OACA,WACA,SACA,QACA,aACA,aACG,SACF,wCAAqB,IAAA;UAiDP,6BAA6B,KAAK;EACjD;EACA,WAAW;;;;;;;;iBASG,kBAAkB,WAAW,MAAM,aAAa,SAAS,uCAAoB,IAAA;;;;;;;iBA2E7E,uBACd,WACA,OAAO,YACP,aACG,SACF;EAA+B;EAAe;oBAAmB,IAAA;;iBAoBpD,uBAAuB,cAAc,SAAS,6CAA0B,IAAA"}

package/dist/components/ai-structured-output/ai-structured-output.js

@@ -0,0 +1,137 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createContext, useContext, useMemo, useState } from "react";
+//#region src/components/ai-structured-output/ai-structured-output.tsx
+const StructuredOutputContext = createContext(null);
+function useStructuredOutputContext(component) {
+	const context = useContext(StructuredOutputContext);
+	if (!context) throw new Error(`${component} must be rendered inside <StructuredOutput>.`);
+	return context;
+}
+function defaultFormat(value) {
+	if (value === null || value === void 0) return "";
+	if (typeof value === "string") return value;
+	if (typeof value === "number" || typeof value === "bigint") return String(value);
+	if (typeof value === "boolean") return value ? "Yes" : "No";
+	if (Array.isArray(value)) return value.map(defaultFormat).join(", ");
+	return JSON.stringify(value);
+}
+function StructuredOutput({ className, fields, value, streaming = false, settled, errors, formatValue = defaultFormat, children, ...props }) {
+	const stateOf = useMemo(() => {
+		const explicit = settled ? new Set(settled) : null;
+		const lastPresentIndex = fields.reduce((last, field, index) => value[field.name] !== void 0 ? index : last, -1);
+		return (name) => {
+			if (errors?.[name]) return "error";
+			const index = fields.findIndex((field) => field.name === name);
+			if (!(value[name] !== void 0)) return "pending";
+			if (explicit) return explicit.has(name) ? "settled" : "streaming";
+			if (!streaming) return "settled";
+			return index < lastPresentIndex ? "settled" : "streaming";
+		};
+	}, [
+		fields,
+		value,
+		streaming,
+		settled,
+		errors
+	]);
+	const context = useMemo(() => ({
+		fields,
+		value,
+		stateOf,
+		formatValue
+	}), [
+		fields,
+		value,
+		stateOf,
+		formatValue
+	]);
+	return /* @__PURE__ */ jsx(StructuredOutputContext.Provider, {
+		value: context,
+		children: /* @__PURE__ */ jsx("dl", {
+			"data-slot": "structured-output",
+			"data-streaming": streaming || void 0,
+			"aria-live": "polite",
+			"aria-busy": streaming,
+			className: cn("flex flex-col gap-3", className),
+			...props,
+			children: children ?? fields.map((field) => /* @__PURE__ */ jsx(StructuredField, { name: field.name }, field.name))
+		})
+	});
+}
+/**
+* One field: its label, its value, and the space it will occupy before it has
+* one.
+*
+* The reserved height is what stops the layout jumping as the object fills in.
+*/
+function StructuredField({ className, name, children, ...props }) {
+	const { fields, value, stateOf, formatValue } = useStructuredOutputContext("StructuredField");
+	const field = fields.find((candidate) => candidate.name === name);
+	if (!field) throw new Error(`StructuredField "${name}" is not declared in the fields prop.`);
+	const state = stateOf(name);
+	const raw = value[name];
+	const [seenState, setSeenState] = useState(state);
+	const [hasSettled, setHasSettled] = useState(false);
+	if (seenState !== state) {
+		setSeenState(state);
+		if (state === "settled" && seenState !== "settled") setHasSettled(true);
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "structured-field",
+		"data-state": state,
+		"data-settled": hasSettled || void 0,
+		"data-field": name,
+		className: cn("flex flex-col gap-1", className),
+		...props,
+		children: [/* @__PURE__ */ jsx("dt", {
+			className: "text-xs text-muted-foreground",
+			children: field.label
+		}), /* @__PURE__ */ jsx("dd", {
+			className: cn("m-0 text-sm", state === "pending" && "text-muted-foreground", state === "error" && "text-destructive"),
+			style: { minHeight: `${String((field.lines ?? 1) * 1.25)}rem` },
+			children: state === "pending" ? /* @__PURE__ */ jsx("span", {
+				"data-slot": "structured-field-placeholder",
+				"aria-hidden": "true",
+				className: "block h-4 w-24 animate-pulse-soft rounded bg-muted"
+			}) : /* @__PURE__ */ jsx("span", {
+				"data-slot": "structured-field-value",
+				className: cn(hasSettled && "inline-block animate-settle"),
+				children: children ?? formatValue(raw, name)
+			})
+		})]
+	});
+}
+/**
+* A confidence score for one field.
+*
+* Rendered as text with the number, never as a bare colour, because "how much
+* should I trust this" is exactly the thing a colour cannot answer.
+*/
+function StructuredConfidence({ className, value: confidence, lowBelow = .7, ...props }) {
+	const low = confidence < lowBelow;
+	const percent = new Intl.NumberFormat(void 0, {
+		style: "percent",
+		maximumFractionDigits: 0
+	}).format(confidence);
+	return /* @__PURE__ */ jsx("p", {
+		"data-slot": "structured-confidence",
+		"data-low": low || void 0,
+		className: cn("text-xs", low ? "text-warning" : "text-muted-foreground", className),
+		...props,
+		children: low ? `Low confidence, ${percent} — worth checking` : `${percent} confidence`
+	});
+}
+/** The reason a field could not be extracted, shown where the value would be. */
+function StructuredFieldError({ className, ...props }) {
+	return /* @__PURE__ */ jsx("p", {
+		"data-slot": "structured-field-error",
+		className: cn("text-xs text-destructive", className),
+		...props
+	});
+}
+//#endregion
+export { StructuredConfidence, StructuredField, StructuredFieldError, StructuredOutput };
+
+//# sourceMappingURL=ai-structured-output.js.map

package/dist/components/ai-structured-output/ai-structured-output.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-structured-output.js","names":[],"sources":["../../../src/components/ai-structured-output/ai-structured-output.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  createContext,\n  useContext,\n  useMemo,\n  useState,\n  type ComponentPropsWithRef,\n  type ReactNode,\n} from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\n/**\n * An object arriving field by field from the model.\n *\n * Most AI features inside real software are not chatbots. They are invoice\n * extraction, CRM enrichment, resume parsing, form autofill — a schema goes in\n * and a filled object comes back. Every one of them streams a partial object\n * into a layout, and almost every one reflows on each token because the fields\n * appear as they arrive.\n *\n * The honest limitation, stated here rather than discovered later: there is no\n * per-field completion signal anywhere in the stack. A streaming API hands you\n * successive partial snapshots, and a string that has stopped growing is\n * indistinguishable from one still arriving. So this component does not pretend\n * to know. It takes the field list up front, reserves the layout from it, and\n * lets the caller say which fields are settled — defaulting to the rule that a\n * field is settled once a later field has appeared, which is true of\n * depth-first JSON streaming and is documented rather than assumed silently.\n */\n\nexport type FieldState = \"pending\" | \"streaming\" | \"settled\" | \"error\";\n\nexport interface OutputField {\n  /** Key in the streamed object. */\n  name: string;\n  label: string;\n  /** Rough height reserved before the value arrives, in lines. */\n  lines?: number;\n}\n\ninterface StructuredOutputContextValue {\n  fields: OutputField[];\n  value: Record<string, unknown>;\n  stateOf: (name: string) => FieldState;\n  formatValue: (value: unknown, name: string) => string;\n}\n\nconst StructuredOutputContext = createContext<StructuredOutputContextValue | null>(null);\n\nfunction useStructuredOutputContext(component: string): StructuredOutputContextValue {\n  const context = useContext(StructuredOutputContext);\n  if (!context) {\n    throw new Error(`${component} must be rendered inside <StructuredOutput>.`);\n  }\n  return context;\n}\n\nfunction defaultFormat(value: unknown): string {\n  if (value === null || value === undefined) return \"\";\n  if (typeof value === \"string\") return value;\n  if (typeof value === \"number\" || typeof value === \"bigint\") return String(value);\n  if (typeof value === \"boolean\") return value ? \"Yes\" : \"No\";\n  if (Array.isArray(value)) return value.map(defaultFormat).join(\", \");\n  return JSON.stringify(value);\n}\n\nexport interface StructuredOutputProps extends Omit<ComponentPropsWithRef<\"dl\">, \"children\"> {\n  /** Declared up front, so layout is reserved before anything arrives. */\n  fields: OutputField[];\n  /** The latest partial snapshot. */\n  value: Record<string, unknown>;\n  /**\n   * True while more of the object is still expected. When false every present\n   * field is settled, which is the only completion signal that is ever certain.\n   */\n  streaming?: boolean;\n  /**\n   * Fields the caller knows are finished. Supply this when the API gives a\n   * real signal; otherwise the default rule applies.\n   */\n  settled?: string[];\n  /** Fields that failed to extract, with the reason shown in place. */\n  errors?: Record<string, string>;\n  formatValue?: (value: unknown, name: string) => string;\n  children?: ReactNode;\n}\n\nexport function StructuredOutput({\n  className,\n  fields,\n  value,\n  streaming = false,\n  settled,\n  errors,\n  formatValue = defaultFormat,\n  children,\n  ...props\n}: StructuredOutputProps) {\n  const stateOf = useMemo(() => {\n    const explicit = settled ? new Set(settled) : null;\n    const lastPresentIndex = fields.reduce(\n      (last, field, index) => (value[field.name] !== undefined ? index : last),\n      -1,\n    );\n\n    return (name: string): FieldState => {\n      if (errors?.[name]) return \"error\";\n\n      const index = fields.findIndex((field) => field.name === name);\n      const present = value[name] !== undefined;\n\n      if (!present) return \"pending\";\n      if (explicit) return explicit.has(name) ? \"settled\" : \"streaming\";\n      // No explicit signal. Once a later field has appeared this one cannot\n      // still be growing, which holds for depth-first JSON streaming. The last\n      // present field stays \"streaming\" until the caller says streaming ended.\n      if (!streaming) return \"settled\";\n      return index < lastPresentIndex ? \"settled\" : \"streaming\";\n    };\n  }, [fields, value, streaming, settled, errors]);\n\n  const context = useMemo<StructuredOutputContextValue>(\n    () => ({ fields, value, stateOf, formatValue }),\n    [fields, value, stateOf, formatValue],\n  );\n\n  return (\n    <StructuredOutputContext.Provider value={context}>\n      <dl\n        data-slot=\"structured-output\"\n        data-streaming={streaming || undefined}\n        // Fields arrive one at a time and each is a small, self-contained fact,\n        // so the region is polite and additive rather than re-reading the whole\n        // object on every token.\n        aria-live=\"polite\"\n        aria-busy={streaming}\n        className={cn(\"flex flex-col gap-3\", className)}\n        {...props}\n      >\n        {children ??\n          fields.map((field) => <StructuredField key={field.name} name={field.name} />)}\n      </dl>\n    </StructuredOutputContext.Provider>\n  );\n}\n\nexport interface StructuredFieldProps extends Omit<ComponentPropsWithRef<\"div\">, \"children\"> {\n  name: string;\n  children?: ReactNode;\n}\n\n/**\n * One field: its label, its value, and the space it will occupy before it has\n * one.\n *\n * The reserved height is what stops the layout jumping as the object fills in.\n */\nexport function StructuredField({ className, name, children, ...props }: StructuredFieldProps) {\n  const { fields, value, stateOf, formatValue } = useStructuredOutputContext(\"StructuredField\");\n\n  const field = fields.find((candidate) => candidate.name === name);\n  if (!field) {\n    throw new Error(`StructuredField \"${name}\" is not declared in the fields prop.`);\n  }\n\n  const state = stateOf(name);\n  const raw = value[name];\n\n  // \"A token arrived\" and \"this field is final\" are different facts, and in a\n  // streamed object they look identical. The settle makes that distinction\n  // visible — so it plays on the transition into settled, and never on a field\n  // that was already final when the component mounted.\n  //\n  // State adjusted during render rather than tracked in a ref: reading a ref\n  // while rendering is unsafe under concurrent rendering, and an effect would\n  // paint the plain value first and animate a frame later. React re-renders\n  // immediately here and discards the intermediate pass.\n  const [seenState, setSeenState] = useState<FieldState>(state);\n  const [hasSettled, setHasSettled] = useState(false);\n\n  if (seenState !== state) {\n    setSeenState(state);\n    if (state === \"settled\" && seenState !== \"settled\") setHasSettled(true);\n  }\n\n  return (\n    <div\n      data-slot=\"structured-field\"\n      data-state={state}\n      data-settled={hasSettled || undefined}\n      data-field={name}\n      className={cn(\"flex flex-col gap-1\", className)}\n      {...props}\n    >\n      <dt className=\"text-xs text-muted-foreground\">{field.label}</dt>\n      <dd\n        className={cn(\n          \"m-0 text-sm\",\n          state === \"pending\" && \"text-muted-foreground\",\n          state === \"error\" && \"text-destructive\",\n        )}\n        // Height is reserved from the declared line count so the value lands in\n        // space already set aside for it rather than pushing the page down.\n        // Computed rather than left to calc() so the reserved height is a plain\n        // value that can be asserted and reasoned about.\n        style={{ minHeight: `${String((field.lines ?? 1) * 1.25)}rem` }}\n      >\n        {state === \"pending\" ? (\n          <span\n            data-slot=\"structured-field-placeholder\"\n            aria-hidden=\"true\"\n            className=\"block h-4 w-24 animate-pulse-soft rounded bg-muted\"\n          />\n        ) : (\n          <span\n            data-slot=\"structured-field-value\"\n            className={cn(hasSettled && \"inline-block animate-settle\")}\n          >\n            {children ?? formatValue(raw, name)}\n          </span>\n        )}\n      </dd>\n    </div>\n  );\n}\n\n/**\n * A confidence score for one field.\n *\n * Rendered as text with the number, never as a bare colour, because \"how much\n * should I trust this\" is exactly the thing a colour cannot answer.\n */\nexport function StructuredConfidence({\n  className,\n  value: confidence,\n  lowBelow = 0.7,\n  ...props\n}: ComponentPropsWithRef<\"p\"> & { value: number; lowBelow?: number }) {\n  const low = confidence < lowBelow;\n  const percent = new Intl.NumberFormat(undefined, {\n    style: \"percent\",\n    maximumFractionDigits: 0,\n  }).format(confidence);\n\n  return (\n    <p\n      data-slot=\"structured-confidence\"\n      data-low={low || undefined}\n      className={cn(\"text-xs\", low ? \"text-warning\" : \"text-muted-foreground\", className)}\n      {...props}\n    >\n      {low ? `Low confidence, ${percent} — worth checking` : `${percent} confidence`}\n    </p>\n  );\n}\n\n/** The reason a field could not be extracted, shown where the value would be. */\nexport function StructuredFieldError({ className, ...props }: ComponentPropsWithRef<\"p\">) {\n  return (\n    <p\n      data-slot=\"structured-field-error\"\n      className={cn(\"text-xs text-destructive\", className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"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"}

package/dist/components/ai-structured-output/index.d.ts

@@ -0,0 +1,2 @@
+import { FieldState, OutputField, StructuredConfidence, StructuredField, StructuredFieldError, StructuredFieldProps, StructuredOutput, StructuredOutputProps } from "./ai-structured-output.js";
+export { type FieldState, type OutputField, StructuredConfidence, StructuredField, StructuredFieldError, type StructuredFieldProps, StructuredOutput, type StructuredOutputProps };

package/dist/components/ai-structured-output/index.js

@@ -0,0 +1,2 @@
+import { StructuredConfidence, StructuredField, StructuredFieldError, StructuredOutput } from "./ai-structured-output.js";
+export { StructuredConfidence, StructuredField, StructuredFieldError, StructuredOutput };

package/dist/components/ai-structured-output/meta.js

@@ -0,0 +1,17 @@
+import { defineMeta } from "../../registry/schema.js";
+//#region src/components/ai-structured-output/meta.ts
+const meta = defineMeta({
+	name: "ai-structured-output",
+	title: "AI Structured Output",
+	description: "An object arriving field by field from the model, without the layout jumping.",
+	category: "ai",
+	status: "stable",
+	dependencies: [],
+	registryDependencies: [],
+	files: ["ai-structured-output.tsx"],
+	a11y: "A description list, so each value is associated with its label rather than floating beside it. The region is aria-live=\"polite\" with aria-busy while streaming, so fields are announced as they settle instead of re-reading the whole object on every token. Height is reserved from the declared field list, which keeps focus and reading position stable as values arrive. Confidence is stated as a number in words, never as a colour alone."
+});
+//#endregion
+export { meta };
+
+//# sourceMappingURL=meta.js.map

package/dist/components/ai-structured-output/meta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.js","names":[],"sources":["../../../src/components/ai-structured-output/meta.ts"],"sourcesContent":["import { defineMeta } from \"@/registry/schema\";\n\nexport const meta = defineMeta({\n  name: \"ai-structured-output\",\n  title: \"AI Structured Output\",\n  description: \"An object arriving field by field from the model, without the layout jumping.\",\n  category: \"ai\",\n  status: \"stable\",\n  dependencies: [],\n  registryDependencies: [],\n  files: [\"ai-structured-output.tsx\"],\n  a11y:\n    \"A description list, so each value is associated with its label rather than floating beside \" +\n    'it. The region is aria-live=\"polite\" with aria-busy while streaming, so fields are ' +\n    \"announced as they settle instead of re-reading the whole object on every token. Height is \" +\n    \"reserved from the declared field list, which keeps focus and reading position stable as \" +\n    \"values arrive. Confidence is stated as a number in words, never as a colour alone.\",\n});\n"],"mappings":";;AAEA,MAAa,OAAO,WAAW;CAC7B,MAAM;CACN,OAAO;CACP,aAAa;CACb,UAAU;CACV,QAAQ;CACR,cAAc,CAAC;CACf,sBAAsB,CAAC;CACvB,OAAO,CAAC,0BAA0B;CAClC,MACE;AAKJ,CAAC"}

package/dist/components/ai-tool/ai-tool.d.ts

@@ -14,7 +14,7 @@ import { ComponentPropsWithRef, ReactNode } from "react";
  */
 type ToolStatus = "pending" | "running" | "success" | "error";
 declare const toolVariants: (props?: ({
-  status?: "error" | "pending" | "running" | "success" | null | undefined;
+  status?: "success" | "pending" | "running" | "error" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface ToolProps extends ComponentPropsWithRef<typeof Collapsible.Root>, VariantProps<typeof toolVariants> {
   status?: ToolStatus;

package/dist/components/alert/alert.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from "class-variance-authority";
 import { ComponentPropsWithRef } from "react";
 //#region src/components/alert/alert.d.ts
 declare const alertVariants: (props?: ({
-  variant?: "success" | "warning" | "destructive" | "default" | "info" | null | undefined;
+  variant?: "default" | "destructive" | "success" | "warning" | "info" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 /**
  * How urgently the alert should interrupt a screen reader.

package/dist/components/badge/badge.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from "class-variance-authority";
 import { ComponentPropsWithRef } from "react";
 //#region src/components/badge/badge.d.ts
 declare const badgeVariants: (props?: ({
-  variant?: "success" | "warning" | "destructive" | "default" | "info" | "secondary" | "outline" | null | undefined;
+  variant?: "default" | "secondary" | "outline" | "destructive" | "success" | "warning" | "info" | null | undefined;
   size?: "sm" | "md" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface BadgeProps extends ComponentPropsWithRef<"span">, VariantProps<typeof badgeVariants> {

package/dist/components/button/button.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from "class-variance-authority";
 import { ComponentPropsWithRef } from "react";
 //#region src/components/button/button.d.ts
 declare const buttonVariants: (props?: ({
-  variant?: "link" | "primary" | "destructive" | "secondary" | "outline" | "ghost" | null | undefined;
+  variant?: "link" | "secondary" | "outline" | "destructive" | "primary" | "ghost" | null | undefined;
   size?: "sm" | "md" | "lg" | "icon" | "icon-sm" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface ButtonProps extends ComponentPropsWithRef<"button">, VariantProps<typeof buttonVariants> {

package/dist/components/file-upload/file-upload.d.ts

@@ -0,0 +1,46 @@
+import { QueuedFile } from "./upload-queue.js";
+import { ComponentPropsWithRef, ReactNode } from "react";
+//#region src/components/file-upload/file-upload.d.ts
+interface FileUploadProps extends Omit<ComponentPropsWithRef<"div">, "onDrop"> {
+  /** Names the control. */
+  label: string;
+  onFiles: (files: File[]) => void;
+  accept?: string;
+  multiple?: boolean;
+  disabled?: boolean;
+  /** Shown under the prompt: accepted types, size limit. */
+  hint?: ReactNode;
+  children?: ReactNode;
+}
+declare function FileUpload({ className, label, onFiles, accept, multiple, disabled, hint, children, ...props }: FileUploadProps): import("react").JSX.Element;
+interface FileUploadListProps extends ComponentPropsWithRef<"ul"> {
+  files: QueuedFile[];
+  onCancel?: (id: string) => void;
+  onRetry?: (id: string) => void;
+  onRemove?: (id: string) => void;
+}
+declare function FileUploadList({ className, files, onCancel, onRetry, onRemove, ...props }: FileUploadListProps): import("react").JSX.Element | null;
+interface FileUploadItemProps extends Omit<ComponentPropsWithRef<"li">, "children"> {
+  entry: QueuedFile;
+  onCancel?: (id: string) => void;
+  onRetry?: (id: string) => void;
+  onRemove?: (id: string) => void;
+}
+declare function FileUploadItem({ className, entry, onCancel, onRetry, onRemove, ...props }: FileUploadItemProps): import("react").JSX.Element;
+/**
+ * One sentence covering the whole queue, announced politely.
+ *
+ * Per-file live regions would talk over each other the moment two uploads run
+ * at once; one summary of the set is readable where six competing ones are not.
+ */
+declare function FileUploadStatus({ className, stats, ...props }: ComponentPropsWithRef<"p"> & {
+  stats: {
+    total: number;
+    active: number;
+    done: number;
+    failed: number;
+  };
+}): import("react").JSX.Element;
+//#endregion
+export { FileUpload, FileUploadItem, FileUploadItemProps, FileUploadList, FileUploadListProps, FileUploadProps, FileUploadStatus };
+//# sourceMappingURL=file-upload.d.ts.map

package/dist/components/file-upload/file-upload.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-upload.d.ts","names":[],"sources":["../../../src/components/file-upload/file-upload.tsx"],"mappings":";;;UAqCiB,wBAAwB,KAAK;;EAE5C;EACA,UAAU,OAAO;EACjB;EACA;EACA;;EAEA,OAAO;EACP,WAAW;;iBAGG,aACd,WACA,OACA,SACA,QACA,UACA,UACA,MACA,aACG,SACF,kCAAe,IAAA;UAsFD,4BAA4B;EAC3C,OAAO;EACP,YAAY;EACZ,WAAW;EACX,YAAY;;iBAGE,iBACd,WACA,OACA,UACA,SACA,aACG,SACF,sCAAmB,IAAA;UAsBL,4BAA4B,KAAK;EAChD,OAAO;EACP,YAAY;EACZ,WAAW;EACX,YAAY;;iBAGE,iBACd,WACA,OACA,UACA,SACA,aACG,SACF,sCAAmB,IAAA;;;;;;;iBA+FN,mBACd,WACA,UACG,SACF;EACD;IAAS;IAAe;IAAgB;IAAc;;oBACvD,IAAA"}