@flanksource/clicky-ui 0.3.15 → 0.3.17

package/dist/data/chat/Conversation.js

@@ -6,11 +6,15 @@ import { Message } from "./Message.js";
 import { UiArrowDown } from "../../icons/components/UiArrowDown.js";
 import { UiLoader } from "../../icons/components/UiLoader.js";
 import { UiCircleX } from "../../icons/components/UiCircleX.js";
+import { UiCheck } from "../../icons/components/UiCheck.js";
+import { UiCopy } from "../../icons/components/UiCopy.js";
 function Conversation({
   messages,
   status,
   error,
   onClearError,
+  sessionId,
+  model,
   emptyState,
   className,
   ...actions
@@ -46,7 +50,16 @@ function Conversation({
         children: messages.length === 0 && emptyState ? /* @__PURE__ */ jsx("div", { className: "flex size-full flex-col items-center justify-center gap-3 p-8 text-center", children: emptyState }) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-8 p-4", children: [
           messages.map((message) => /* @__PURE__ */ jsx(Message, { message, ...actions }, message.id)),
           isWaiting && /* @__PURE__ */ jsx(LoadingIndicator, {}),
-          errorText && /* @__PURE__ */ jsx(ErrorNotice, { message: errorText, onClear: onClearError })
+          errorText && /* @__PURE__ */ jsx(
+            ErrorNotice,
+            {
+              message: errorText,
+              error,
+              sessionId,
+              model,
+              onClear: onClearError
+            }
+          )
         ] })
       }
     ),
@@ -77,7 +90,30 @@ function LoadingIndicator() {
     /* @__PURE__ */ jsx("span", { children: "Waiting for response..." })
   ] });
 }
-function ErrorNotice({ message, onClear }) {
+function buildErrorReport({ message, error, sessionId, model }) {
+  const lines = [`Error: ${message}`];
+  if ((error == null ? void 0 : error.name) && error.name !== "Error") lines.push(`Type: ${error.name}`);
+  if (sessionId) lines.push(`Session: ${sessionId}`);
+  if (model) lines.push(`Model: ${model}`);
+  if (typeof window !== "undefined") lines.push(`Page: ${window.location.href}`);
+  if (typeof navigator !== "undefined" && navigator.userAgent) lines.push(`User agent: ${navigator.userAgent}`);
+  lines.push(`Time: ${(/* @__PURE__ */ new Date()).toISOString()}`);
+  const cause = error == null ? void 0 : error.cause;
+  const detail = (error == null ? void 0 : error.stack) ?? (cause != null ? String(cause) : "");
+  if (detail.trim() && detail.trim() !== message) lines.push("", detail.trim());
+  return lines.join("\n");
+}
+function ErrorNotice({ message, error, sessionId, model, onClear }) {
+  const [copied, setCopied] = useState(false);
+  const copyReport = () => {
+    const clip = typeof navigator !== "undefined" ? navigator.clipboard : void 0;
+    if (!clip) return;
+    void clip.writeText(buildErrorReport({ message, error, sessionId, model })).then(() => {
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    }).catch(() => {
+    });
+  };
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -86,7 +122,23 @@ function ErrorNotice({ message, onClear }) {
       children: [
         /* @__PURE__ */ jsx(Icon, { icon: UiCircleX, className: "mt-0.5 size-4 shrink-0" }),
         /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1 whitespace-pre-wrap break-words", children: message }),
-        onClear && /* @__PURE__ */ jsx("button", { type: "button", className: "shrink-0 text-xs underline-offset-2 hover:underline", onClick: onClear, children: "Dismiss" })
+        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Copy error details",
+              title: "Copy session id, model, page and full error",
+              className: "inline-flex items-center gap-1 text-xs underline-offset-2 hover:underline",
+              onClick: copyReport,
+              children: [
+                /* @__PURE__ */ jsx(Icon, { icon: copied ? UiCheck : UiCopy, className: "size-3.5" }),
+                copied ? "Copied" : "Copy"
+              ]
+            }
+          ),
+          onClear && /* @__PURE__ */ jsx("button", { type: "button", className: "text-xs underline-offset-2 hover:underline", onClick: onClear, children: "Dismiss" })
+        ] })
       ]
     }
   );

package/dist/data/chat/Conversation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Conversation.js","sources":["../../../src/data/chat/Conversation.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport { UiArrowDown, UiCircleX, UiLoader } from \"../../icons\";\nimport { Message, type MessageActionHandlers } from \"./Message\";\nimport type { ChatStatus, UIMessage } from \"./types\";\n\nexport type ConversationProps = MessageActionHandlers & {\n  messages: UIMessage[];\n  /** Current chat status; used for transient pending/error affordances. */\n  status?: ChatStatus | undefined;\n  /** Last request error from the chat transport, if any. */\n  error?: Error | undefined;\n  /** Clears the visible transport error. */\n  onClearError?: (() => void) | undefined;\n  /** Shown when there are no messages yet. */\n  emptyState?: React.ReactNode;\n  className?: string;\n};\n\n/** A scrollable message log that sticks to the bottom as new content streams\n *  in, unless the user has scrolled up — in which case a jump-to-bottom button\n *  appears. */\nexport function Conversation({\n  messages,\n  status,\n  error,\n  onClearError,\n  emptyState,\n  className,\n  ...actions\n}: ConversationProps) {\n  const scrollRef = useRef<HTMLDivElement>(null);\n  const [pinned, setPinned] = useState(true);\n  const isWaiting = status === \"submitted\" || (status === \"streaming\" && !hasVisibleAssistantResponse(messages));\n  const errorText = error?.message || (status === \"error\" ? \"The assistant request failed.\" : undefined);\n\n  const onScroll = () => {\n    const el = scrollRef.current;\n    if (!el) return;\n    const distance = el.scrollHeight - el.scrollTop - el.clientHeight;\n    setPinned(distance < 32);\n  };\n\n  useEffect(() => {\n    const el = scrollRef.current;\n    if (el && pinned) {\n      el.scrollTop = el.scrollHeight;\n    }\n  });\n\n  const scrollToBottom = () => {\n    const el = scrollRef.current;\n    if (el) el.scrollTo({ top: el.scrollHeight, behavior: \"smooth\" });\n  };\n\n  return (\n    <div className=\"relative flex min-h-0 flex-1 flex-col\">\n      <div\n        ref={scrollRef}\n        onScroll={onScroll}\n        role=\"log\"\n        className={cn(\"flex-1 overflow-y-auto\", className)}\n      >\n        {messages.length === 0 && emptyState ? (\n          <div className=\"flex size-full flex-col items-center justify-center gap-3 p-8 text-center\">\n            {emptyState}\n          </div>\n        ) : (\n          <div className=\"flex flex-col gap-8 p-4\">\n            {messages.map((message) => (\n              <Message key={message.id} message={message} {...actions} />\n            ))}\n            {isWaiting && <LoadingIndicator />}\n            {errorText && <ErrorNotice message={errorText} onClear={onClearError} />}\n          </div>\n        )}\n      </div>\n\n      {!pinned && messages.length > 0 && (\n        <button\n          type=\"button\"\n          aria-label=\"Scroll to latest\"\n          onClick={scrollToBottom}\n          className=\"absolute bottom-3 left-1/2 flex size-8 -translate-x-1/2 items-center justify-center rounded-full border border-border bg-background text-muted-foreground shadow-md hover:text-foreground\"\n        >\n          <Icon icon={UiArrowDown} className=\"size-4\" />\n        </button>\n      )}\n    </div>\n  );\n}\n\nfunction hasVisibleAssistantResponse(messages: UIMessage[]) {\n  const last = messages[messages.length - 1];\n  if (last?.role !== \"assistant\") return false;\n  return last.parts.some((part) => {\n    if (part.type === \"step-start\") return false;\n    if (part.type === \"text\" || part.type === \"reasoning\") return part.text.length > 0;\n    return true;\n  });\n}\n\nfunction LoadingIndicator() {\n  return (\n    <div className=\"flex w-full max-w-[95%] items-center gap-2 text-sm text-muted-foreground\">\n      <Icon icon={UiLoader} className=\"size-4 shrink-0 animate-spin\" />\n      <span>Waiting for response...</span>\n    </div>\n  );\n}\n\nfunction ErrorNotice({ message, onClear }: { message: string; onClear?: (() => void) | undefined }) {\n  return (\n    <div\n      role=\"alert\"\n      className=\"flex w-full max-w-[95%] items-start gap-2 rounded-md border border-destructive/40 bg-destructive/5 p-3 text-sm text-destructive\"\n    >\n      <Icon icon={UiCircleX} className=\"mt-0.5 size-4 shrink-0\" />\n      <div className=\"min-w-0 flex-1 whitespace-pre-wrap break-words\">{message}</div>\n      {onClear && (\n        <button type=\"button\" className=\"shrink-0 text-xs underline-offset-2 hover:underline\" onClick={onClear}>\n          Dismiss\n        </button>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Conversation.js","sources":["../../../src/data/chat/Conversation.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport { UiArrowDown, UiCheck, UiCircleX, UiCopy, UiLoader } from \"../../icons\";\nimport { Message, type MessageActionHandlers } from \"./Message\";\nimport type { ChatStatus, UIMessage } from \"./types\";\n\nexport type ConversationProps = MessageActionHandlers & {\n  messages: UIMessage[];\n  /** Current chat status; used for transient pending/error affordances. */\n  status?: ChatStatus | undefined;\n  /** Last request error from the chat transport, if any. */\n  error?: Error | undefined;\n  /** Clears the visible transport error. */\n  onClearError?: (() => void) | undefined;\n  /** Conversation/thread id, surfaced in the copyable error report. */\n  sessionId?: string | undefined;\n  /** Selected model id, surfaced in the copyable error report. */\n  model?: string | undefined;\n  /** Shown when there are no messages yet. */\n  emptyState?: React.ReactNode;\n  className?: string;\n};\n\n/** A scrollable message log that sticks to the bottom as new content streams\n *  in, unless the user has scrolled up — in which case a jump-to-bottom button\n *  appears. */\nexport function Conversation({\n  messages,\n  status,\n  error,\n  onClearError,\n  sessionId,\n  model,\n  emptyState,\n  className,\n  ...actions\n}: ConversationProps) {\n  const scrollRef = useRef<HTMLDivElement>(null);\n  const [pinned, setPinned] = useState(true);\n  const isWaiting = status === \"submitted\" || (status === \"streaming\" && !hasVisibleAssistantResponse(messages));\n  const errorText = error?.message || (status === \"error\" ? \"The assistant request failed.\" : undefined);\n\n  const onScroll = () => {\n    const el = scrollRef.current;\n    if (!el) return;\n    const distance = el.scrollHeight - el.scrollTop - el.clientHeight;\n    setPinned(distance < 32);\n  };\n\n  useEffect(() => {\n    const el = scrollRef.current;\n    if (el && pinned) {\n      el.scrollTop = el.scrollHeight;\n    }\n  });\n\n  const scrollToBottom = () => {\n    const el = scrollRef.current;\n    if (el) el.scrollTo({ top: el.scrollHeight, behavior: \"smooth\" });\n  };\n\n  return (\n    <div className=\"relative flex min-h-0 flex-1 flex-col\">\n      <div\n        ref={scrollRef}\n        onScroll={onScroll}\n        role=\"log\"\n        className={cn(\"flex-1 overflow-y-auto\", className)}\n      >\n        {messages.length === 0 && emptyState ? (\n          <div className=\"flex size-full flex-col items-center justify-center gap-3 p-8 text-center\">\n            {emptyState}\n          </div>\n        ) : (\n          <div className=\"flex flex-col gap-8 p-4\">\n            {messages.map((message) => (\n              <Message key={message.id} message={message} {...actions} />\n            ))}\n            {isWaiting && <LoadingIndicator />}\n            {errorText && (\n              <ErrorNotice\n                message={errorText}\n                error={error}\n                sessionId={sessionId}\n                model={model}\n                onClear={onClearError}\n              />\n            )}\n          </div>\n        )}\n      </div>\n\n      {!pinned && messages.length > 0 && (\n        <button\n          type=\"button\"\n          aria-label=\"Scroll to latest\"\n          onClick={scrollToBottom}\n          className=\"absolute bottom-3 left-1/2 flex size-8 -translate-x-1/2 items-center justify-center rounded-full border border-border bg-background text-muted-foreground shadow-md hover:text-foreground\"\n        >\n          <Icon icon={UiArrowDown} className=\"size-4\" />\n        </button>\n      )}\n    </div>\n  );\n}\n\nfunction hasVisibleAssistantResponse(messages: UIMessage[]) {\n  const last = messages[messages.length - 1];\n  if (last?.role !== \"assistant\") return false;\n  return last.parts.some((part) => {\n    if (part.type === \"step-start\") return false;\n    if (part.type === \"text\" || part.type === \"reasoning\") return part.text.length > 0;\n    return true;\n  });\n}\n\nfunction LoadingIndicator() {\n  return (\n    <div className=\"flex w-full max-w-[95%] items-center gap-2 text-sm text-muted-foreground\">\n      <Icon icon={UiLoader} className=\"size-4 shrink-0 animate-spin\" />\n      <span>Waiting for response...</span>\n    </div>\n  );\n}\n\ntype ErrorReport = {\n  message: string;\n  error?: Error | undefined;\n  sessionId?: string | undefined;\n  model?: string | undefined;\n};\n\n/** Assembles a support-ready plain-text report: the error, the session/model\n *  that produced it, the page, and the full stack/cause — everything needed to\n *  file or triage the failure without a back-and-forth. */\nfunction buildErrorReport({ message, error, sessionId, model }: ErrorReport): string {\n  const lines = [`Error: ${message}`];\n  if (error?.name && error.name !== \"Error\") lines.push(`Type: ${error.name}`);\n  if (sessionId) lines.push(`Session: ${sessionId}`);\n  if (model) lines.push(`Model: ${model}`);\n  if (typeof window !== \"undefined\") lines.push(`Page: ${window.location.href}`);\n  if (typeof navigator !== \"undefined\" && navigator.userAgent) lines.push(`User agent: ${navigator.userAgent}`);\n  lines.push(`Time: ${new Date().toISOString()}`);\n  const cause = (error as { cause?: unknown } | undefined)?.cause;\n  const detail = error?.stack ?? (cause != null ? String(cause) : \"\");\n  if (detail.trim() && detail.trim() !== message) lines.push(\"\", detail.trim());\n  return lines.join(\"\\n\");\n}\n\nfunction ErrorNotice({ message, error, sessionId, model, onClear }: ErrorReport & { onClear?: (() => void) | undefined }) {\n  const [copied, setCopied] = useState(false);\n  const copyReport = () => {\n    const clip = typeof navigator !== \"undefined\" ? navigator.clipboard : undefined;\n    if (!clip) return;\n    void clip\n      .writeText(buildErrorReport({ message, error, sessionId, model }))\n      .then(() => {\n        setCopied(true);\n        setTimeout(() => setCopied(false), 2000);\n      })\n      .catch(() => {});\n  };\n  return (\n    <div\n      role=\"alert\"\n      className=\"flex w-full max-w-[95%] items-start gap-2 rounded-md border border-destructive/40 bg-destructive/5 p-3 text-sm text-destructive\"\n    >\n      <Icon icon={UiCircleX} className=\"mt-0.5 size-4 shrink-0\" />\n      <div className=\"min-w-0 flex-1 whitespace-pre-wrap break-words\">{message}</div>\n      <div className=\"flex shrink-0 items-center gap-2\">\n        <button\n          type=\"button\"\n          aria-label=\"Copy error details\"\n          title=\"Copy session id, model, page and full error\"\n          className=\"inline-flex items-center gap-1 text-xs underline-offset-2 hover:underline\"\n          onClick={copyReport}\n        >\n          <Icon icon={copied ? UiCheck : UiCopy} className=\"size-3.5\" />\n          {copied ? \"Copied\" : \"Copy\"}\n        </button>\n        {onClear && (\n          <button type=\"button\" className=\"text-xs underline-offset-2 hover:underline\" onClick={onClear}>\n            Dismiss\n          </button>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/data/chat/ModelSelector.cjs

@@ -35,8 +35,11 @@ function ModelSelector({ models, value, onChange, className, size = "sm" }) {
   );
 }
 function EffortSelector({ efforts, value, onChange, className, size = "sm" }) {
-  const supportedEfforts = efforts.filter(Boolean);
-  const selectedEffort = value && supportedEfforts.includes(value) ? value : "";
+  const selectedEffort = (value == null ? void 0 : value.trim()) ?? "";
+  const supportedEfforts = [...new Set(efforts.map((effort) => effort.trim()).filter(Boolean))];
+  if (selectedEffort && !supportedEfforts.includes(selectedEffort)) {
+    supportedEfforts.push(selectedEffort);
+  }
   const selectedGlyph = selectedEffort ? effortIcons.effortLevelIcon(selectedEffort) : void 0;
   const selectedColor = selectedEffort ? effortIcons.effortLevelColor(selectedEffort) : void 0;
   const selectedIcon = selectedGlyph ? react.createElement(selectedGlyph, { className: utils.cn("size-4", selectedColor) }) : void 0;
@@ -44,7 +47,7 @@ function EffortSelector({ efforts, value, onChange, className, size = "sm" }) {
     Combobox.Combobox,
     {
       ariaLabel: "Reasoning effort",
-      value: value ?? "",
+      value: selectedEffort,
       onChange,
       allowCustomValue: false,
       required: true,
@@ -69,7 +72,7 @@ function fullEffortLabel(value) {
     case "max":
       return "Maximum";
     default:
-      return titleCaseEffort(value);
+      return effortIcons.effortLevelLabel(value);
   }
 }
 function shortEffortLabel(value) {
@@ -85,14 +88,9 @@ function shortEffortLabel(value) {
     case "max":
       return "Max";
     default:
-      return titleCaseEffort(value);
+      return effortIcons.effortLevelLabel(value);
   }
 }
-function titleCaseEffort(value) {
-  var _a;
-  const effort = value.trim();
-  return `${((_a = effort[0]) == null ? void 0 : _a.toUpperCase()) ?? ""}${effort.slice(1)}`;
-}
 function ProviderSelector({
   providers,
   value,

package/dist/data/chat/ModelSelector.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModelSelector.cjs","sources":["../../../src/data/chat/ModelSelector.tsx"],"sourcesContent":["import { createElement, type ReactNode } from \"react\";\nimport { Combobox } from \"../../components/Combobox\";\nimport type { FormSize } from \"../../components/json-schema-form-size\";\nimport { SegmentedControl } from \"../../components/SegmentedControl\";\nimport type { StaticIconComponent } from \"../Icon\";\nimport { cn } from \"../../lib/utils\";\nimport { effortLevelColor, effortLevelIcon } from \"./effort-icons\";\nimport { providerIcon } from \"./provider-icons\";\nimport type { ChatBudgetConfig, ChatModel } from \"./types\";\n\nexport type ModelSelectorProps = {\n  models: ChatModel[];\n  /** Currently selected model id. */\n  value?: string | undefined;\n  onChange: (id: string) => void;\n  className?: string;\n  /** Control size. Defaults to `sm` (compact chat toolbar); pass `md` to match\n   *  a standard-density form row. */\n  size?: FormSize;\n};\n\n/** A searchable model picker driven by the backend model menu, showing each\n *  provider's brand icon. Models whose provider is not configured are disabled\n *  rather than hidden, so the menu communicates what would be available with the\n *  right API key. */\nexport function ModelSelector({ models, value, onChange, className, size = \"sm\" }: ModelSelectorProps) {\n  if (models.length === 0) return null;\n  const selected = models.find((m) => m.id === value);\n  const SelectedGlyph = providerIcon(selected?.provider);\n  return (\n    <Combobox\n      ariaLabel=\"Model\"\n      value={value ?? \"\"}\n      onChange={onChange}\n      allowCustomValue={false}\n      required\n      size={size}\n      className={cn(\"w-48\", className)}\n      {...(SelectedGlyph ? { prefix: <SelectedGlyph className=\"size-4\" /> } : {})}\n      options={models.map((m) => {\n        const Icon = providerIcon(m.provider);\n        return {\n          value: m.id,\n          label: m.label,\n          ...(Icon ? { icon: <Icon className=\"size-4\" /> } : {}),\n          disabled: m.configured === false,\n        };\n      })}\n    />\n  );\n}\n\nexport type EffortSelectorProps = {\n  efforts: string[];\n  value?: string | undefined;\n  onChange: (effort: string) => void;\n  className?: string;\n  /** Control size. Defaults to `sm`; pass `md` to match a standard form row. */\n  size?: FormSize;\n};\n\n/** Reasoning-effort picker, shown only for reasoning-capable models. The empty\n *  value means \"no extended thinking\". Strict: only the listed options commit. */\nexport function EffortSelector({ efforts, value, onChange, className, size = \"sm\" }: EffortSelectorProps) {\n  const supportedEfforts = efforts.filter(Boolean);\n  const selectedEffort = value && supportedEfforts.includes(value) ? value : \"\";\n  const selectedGlyph = selectedEffort ? effortLevelIcon(selectedEffort) : undefined;\n  const selectedColor = selectedEffort ? effortLevelColor(selectedEffort) : undefined;\n  const selectedIcon = selectedGlyph\n    ? createElement(selectedGlyph, { className: cn(\"size-4\", selectedColor) })\n    : undefined;\n  return (\n    <Combobox\n      ariaLabel=\"Reasoning effort\"\n      value={value ?? \"\"}\n      onChange={onChange}\n      allowCustomValue={false}\n      required\n      size={size}\n      className={cn(\"w-36\", className)}\n      {...(selectedIcon ? { prefix: selectedIcon } : {})}\n      options={[\n        { value: \"\", label: \"None\" },\n        ...supportedEfforts.map((effort) => ({\n          value: effort,\n          label: fullEffortLabel(effort),\n          selectedLabel: shortEffortLabel(effort),\n        })),\n      ]}\n    />\n  );\n}\n\nfunction fullEffortLabel(value: string): string {\n  switch (value.trim().toLowerCase()) {\n    case \"xhigh\":\n      return \"Extra high\";\n    case \"max\":\n      return \"Maximum\";\n    default:\n      return titleCaseEffort(value);\n  }\n}\n\nfunction shortEffortLabel(value: string): string {\n  switch (value.trim().toLowerCase()) {\n    case \"minimal\":\n      return \"Min\";\n    case \"medium\":\n      return \"Med\";\n    case \"xhigh\":\n      return \"XHigh\";\n    case \"adaptive\":\n      return \"Auto\";\n    case \"max\":\n      return \"Max\";\n    default:\n      return titleCaseEffort(value);\n  }\n}\n\nfunction titleCaseEffort(value: string): string {\n  const effort = value.trim();\n  return `${effort[0]?.toUpperCase() ?? \"\"}${effort.slice(1)}`;\n}\n\nexport type ProviderSelectorOption<T extends string = string> = {\n  id: T;\n  label: ReactNode;\n  /** Provider id used for the default brand glyph when `icon` is omitted. */\n  provider?: string | undefined;\n  icon?: string | StaticIconComponent | undefined;\n  title?: string | undefined;\n  disabled?: boolean | undefined;\n};\n\nexport type ProviderSelectorProps<T extends string = string> = {\n  providers: ProviderSelectorOption<T>[];\n  value: T;\n  onChange: (provider: T) => void;\n  className?: string | undefined;\n  ariaLabel?: string | undefined;\n};\n\n/** Segmented AI provider picker with the same provider glyphs used by the model\n * selector. Use when the backend needs the provider/agent axis separate from the\n * concrete model id. */\nexport function ProviderSelector<T extends string = string>({\n  providers,\n  value,\n  onChange,\n  className,\n  ariaLabel = \"AI provider\",\n}: ProviderSelectorProps<T>) {\n  return (\n    <SegmentedControl\n      aria-label={ariaLabel}\n      size=\"sm\"\n      value={value}\n      onChange={onChange}\n      className={cn(\"w-fit\", className)}\n      options={providers.map((provider) => {\n        const icon = provider.icon ?? providerIcon(provider.provider);\n        return {\n          id: provider.id,\n          label: provider.label,\n          ...(provider.title ? { title: provider.title } : {}),\n          ...(provider.disabled !== undefined ? { disabled: provider.disabled } : {}),\n          ...(icon ? { icon } : {}),\n        };\n      })}\n    />\n  );\n}\n\nexport type BudgetSelectorProps = {\n  budget?: ChatBudgetConfig | undefined;\n  onBudgetChange: (budget: ChatBudgetConfig) => void;\n  className?: string | undefined;\n  disabled?: boolean | undefined;\n  costLabel?: string | undefined;\n  maxTokensLabel?: string | undefined;\n  maxTokensStep?: number | undefined;\n};\n\n/** Compact budget fields matching the advanced chat settings surface. Callers may\n * relabel the token field when their payload contract uses a different budgeted\n * unit, such as conversation turns. */\nexport function BudgetSelector({\n  budget,\n  onBudgetChange,\n  className,\n  disabled = false,\n  costLabel = \"Max cost\",\n  maxTokensLabel = \"Max tokens\",\n  maxTokensStep = 1,\n}: BudgetSelectorProps) {\n  const updateBudget = (key: keyof ChatBudgetConfig, raw: string, integer = false) => {\n    const next: ChatBudgetConfig = { ...budget };\n    const parsed = parseOptionalNumber(raw, integer);\n    if (parsed === undefined) {\n      delete next[key];\n    } else {\n      next[key] = parsed;\n    }\n    onBudgetChange(next);\n  };\n\n  return (\n    <div className={cn(\"grid grid-cols-2 gap-3\", className)}>\n      <label className=\"space-y-1 text-xs\">\n        <span className=\"text-muted-foreground\">{costLabel}</span>\n        <input\n          type=\"number\"\n          min={0}\n          step={0.01}\n          value={budget?.cost ?? \"\"}\n          onChange={(event) => updateBudget(\"cost\", event.target.value)}\n          disabled={disabled}\n          className=\"h-8 w-full rounded border border-border bg-background px-2 text-xs disabled:cursor-not-allowed disabled:opacity-50\"\n        />\n      </label>\n      <label className=\"space-y-1 text-xs\">\n        <span className=\"text-muted-foreground\">{maxTokensLabel}</span>\n        <input\n          type=\"number\"\n          min={0}\n          step={maxTokensStep}\n          value={budget?.maxTokens ?? \"\"}\n          onChange={(event) => updateBudget(\"maxTokens\", event.target.value, maxTokensStep >= 1)}\n          disabled={disabled}\n          className=\"h-8 w-full rounded border border-border bg-background px-2 text-xs disabled:cursor-not-allowed disabled:opacity-50\"\n        />\n      </label>\n    </div>\n  );\n}\n\nfunction parseOptionalNumber(raw: string, integer = false): number | undefined {\n  if (raw.trim() === \"\") return undefined;\n  const value = Number(raw);\n  if (!Number.isFinite(value)) return undefined;\n  return integer ? Math.max(0, Math.trunc(value)) : value;\n}\n"],"names":["providerIcon","jsx","Combobox","cn","effortLevelIcon","effortLevelColor","createElement","SegmentedControl","jsxs"],"mappings":"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"}
+{"version":3,"file":"ModelSelector.cjs","sources":["../../../src/data/chat/ModelSelector.tsx"],"sourcesContent":["import { createElement, type ReactNode } from \"react\";\nimport { Combobox } from \"../../components/Combobox\";\nimport type { FormSize } from \"../../components/json-schema-form-size\";\nimport { SegmentedControl } from \"../../components/SegmentedControl\";\nimport type { StaticIconComponent } from \"../Icon\";\nimport { cn } from \"../../lib/utils\";\nimport {\n  effortLevelColor,\n  effortLevelIcon,\n  effortLevelLabel,\n} from \"./effort-icons\";\nimport { providerIcon } from \"./provider-icons\";\nimport type { ChatBudgetConfig, ChatModel } from \"./types\";\n\nexport type ModelSelectorProps = {\n  models: ChatModel[];\n  /** Currently selected model id. */\n  value?: string | undefined;\n  onChange: (id: string) => void;\n  className?: string;\n  /** Control size. Defaults to `sm` (compact chat toolbar); pass `md` to match\n   *  a standard-density form row. */\n  size?: FormSize;\n};\n\n/** A searchable model picker driven by the backend model menu, showing each\n *  provider's brand icon. Models whose provider is not configured are disabled\n *  rather than hidden, so the menu communicates what would be available with the\n *  right API key. */\nexport function ModelSelector({ models, value, onChange, className, size = \"sm\" }: ModelSelectorProps) {\n  if (models.length === 0) return null;\n  const selected = models.find((m) => m.id === value);\n  const SelectedGlyph = providerIcon(selected?.provider);\n  return (\n    <Combobox\n      ariaLabel=\"Model\"\n      value={value ?? \"\"}\n      onChange={onChange}\n      allowCustomValue={false}\n      required\n      size={size}\n      className={cn(\"w-48\", className)}\n      {...(SelectedGlyph ? { prefix: <SelectedGlyph className=\"size-4\" /> } : {})}\n      options={models.map((m) => {\n        const Icon = providerIcon(m.provider);\n        return {\n          value: m.id,\n          label: m.label,\n          ...(Icon ? { icon: <Icon className=\"size-4\" /> } : {}),\n          disabled: m.configured === false,\n        };\n      })}\n    />\n  );\n}\n\nexport type EffortSelectorProps = {\n  efforts: string[];\n  value?: string | undefined;\n  onChange: (effort: string) => void;\n  className?: string;\n  /** Control size. Defaults to `sm`; pass `md` to match a standard form row. */\n  size?: FormSize;\n};\n\n/** Reasoning-effort picker, shown only for reasoning-capable models. The empty\n *  value means \"no extended thinking\". Strict: only the listed options commit. */\nexport function EffortSelector({ efforts, value, onChange, className, size = \"sm\" }: EffortSelectorProps) {\n  const selectedEffort = value?.trim() ?? \"\";\n  const supportedEfforts = [...new Set(efforts.map((effort) => effort.trim()).filter(Boolean))];\n  if (selectedEffort && !supportedEfforts.includes(selectedEffort)) {\n    supportedEfforts.push(selectedEffort);\n  }\n  const selectedGlyph = selectedEffort ? effortLevelIcon(selectedEffort) : undefined;\n  const selectedColor = selectedEffort ? effortLevelColor(selectedEffort) : undefined;\n  const selectedIcon = selectedGlyph\n    ? createElement(selectedGlyph, { className: cn(\"size-4\", selectedColor) })\n    : undefined;\n  return (\n    <Combobox\n      ariaLabel=\"Reasoning effort\"\n      value={selectedEffort}\n      onChange={onChange}\n      allowCustomValue={false}\n      required\n      size={size}\n      className={cn(\"w-36\", className)}\n      {...(selectedIcon ? { prefix: selectedIcon } : {})}\n      options={[\n        { value: \"\", label: \"None\" },\n        ...supportedEfforts.map((effort) => ({\n          value: effort,\n          label: fullEffortLabel(effort),\n          selectedLabel: shortEffortLabel(effort),\n        })),\n      ]}\n    />\n  );\n}\n\nfunction fullEffortLabel(value: string): string {\n  switch (value.trim().toLowerCase()) {\n    case \"xhigh\":\n      return \"Extra high\";\n    case \"max\":\n      return \"Maximum\";\n    default:\n      return effortLevelLabel(value);\n  }\n}\n\nfunction shortEffortLabel(value: string): string {\n  switch (value.trim().toLowerCase()) {\n    case \"minimal\":\n      return \"Min\";\n    case \"medium\":\n      return \"Med\";\n    case \"xhigh\":\n      return \"XHigh\";\n    case \"adaptive\":\n      return \"Auto\";\n    case \"max\":\n      return \"Max\";\n    default:\n      return effortLevelLabel(value);\n  }\n}\n\nexport type ProviderSelectorOption<T extends string = string> = {\n  id: T;\n  label: ReactNode;\n  /** Provider id used for the default brand glyph when `icon` is omitted. */\n  provider?: string | undefined;\n  icon?: string | StaticIconComponent | undefined;\n  title?: string | undefined;\n  disabled?: boolean | undefined;\n};\n\nexport type ProviderSelectorProps<T extends string = string> = {\n  providers: ProviderSelectorOption<T>[];\n  value: T;\n  onChange: (provider: T) => void;\n  className?: string | undefined;\n  ariaLabel?: string | undefined;\n};\n\n/** Segmented AI provider picker with the same provider glyphs used by the model\n * selector. Use when the backend needs the provider/agent axis separate from the\n * concrete model id. */\nexport function ProviderSelector<T extends string = string>({\n  providers,\n  value,\n  onChange,\n  className,\n  ariaLabel = \"AI provider\",\n}: ProviderSelectorProps<T>) {\n  return (\n    <SegmentedControl\n      aria-label={ariaLabel}\n      size=\"sm\"\n      value={value}\n      onChange={onChange}\n      className={cn(\"w-fit\", className)}\n      options={providers.map((provider) => {\n        const icon = provider.icon ?? providerIcon(provider.provider);\n        return {\n          id: provider.id,\n          label: provider.label,\n          ...(provider.title ? { title: provider.title } : {}),\n          ...(provider.disabled !== undefined ? { disabled: provider.disabled } : {}),\n          ...(icon ? { icon } : {}),\n        };\n      })}\n    />\n  );\n}\n\nexport type BudgetSelectorProps = {\n  budget?: ChatBudgetConfig | undefined;\n  onBudgetChange: (budget: ChatBudgetConfig) => void;\n  className?: string | undefined;\n  disabled?: boolean | undefined;\n  costLabel?: string | undefined;\n  maxTokensLabel?: string | undefined;\n  maxTokensStep?: number | undefined;\n};\n\n/** Compact budget fields matching the advanced chat settings surface. Callers may\n * relabel the token field when their payload contract uses a different budgeted\n * unit, such as conversation turns. */\nexport function BudgetSelector({\n  budget,\n  onBudgetChange,\n  className,\n  disabled = false,\n  costLabel = \"Max cost\",\n  maxTokensLabel = \"Max tokens\",\n  maxTokensStep = 1,\n}: BudgetSelectorProps) {\n  const updateBudget = (key: keyof ChatBudgetConfig, raw: string, integer = false) => {\n    const next: ChatBudgetConfig = { ...budget };\n    const parsed = parseOptionalNumber(raw, integer);\n    if (parsed === undefined) {\n      delete next[key];\n    } else {\n      next[key] = parsed;\n    }\n    onBudgetChange(next);\n  };\n\n  return (\n    <div className={cn(\"grid grid-cols-2 gap-3\", className)}>\n      <label className=\"space-y-1 text-xs\">\n        <span className=\"text-muted-foreground\">{costLabel}</span>\n        <input\n          type=\"number\"\n          min={0}\n          step={0.01}\n          value={budget?.cost ?? \"\"}\n          onChange={(event) => updateBudget(\"cost\", event.target.value)}\n          disabled={disabled}\n          className=\"h-8 w-full rounded border border-border bg-background px-2 text-xs disabled:cursor-not-allowed disabled:opacity-50\"\n        />\n      </label>\n      <label className=\"space-y-1 text-xs\">\n        <span className=\"text-muted-foreground\">{maxTokensLabel}</span>\n        <input\n          type=\"number\"\n          min={0}\n          step={maxTokensStep}\n          value={budget?.maxTokens ?? \"\"}\n          onChange={(event) => updateBudget(\"maxTokens\", event.target.value, maxTokensStep >= 1)}\n          disabled={disabled}\n          className=\"h-8 w-full rounded border border-border bg-background px-2 text-xs disabled:cursor-not-allowed disabled:opacity-50\"\n        />\n      </label>\n    </div>\n  );\n}\n\nfunction parseOptionalNumber(raw: string, integer = false): number | undefined {\n  if (raw.trim() === \"\") return undefined;\n  const value = Number(raw);\n  if (!Number.isFinite(value)) return undefined;\n  return integer ? Math.max(0, Math.trunc(value)) : value;\n}\n"],"names":["providerIcon","jsx","Combobox","cn","effortLevelIcon","effortLevelColor","createElement","effortLevelLabel","SegmentedControl","jsxs"],"mappings":"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"}

package/dist/data/chat/ModelSelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModelSelector.d.ts","sourceRoot":"","sources":["../../../src/data/chat/ModelSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAEvE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAInD,OAAO,KAAK,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAE3D,MAAM,MAAM,kBAAkB,GAAG;IAC/B,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,mCAAmC;IACnC,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;uCACmC;IACnC,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB,CAAC;AAEF;;;qBAGqB;AACrB,wBAAgB,aAAa,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAW,EAAE,EAAE,kBAAkB,kDAyBpG;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8EAA8E;IAC9E,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB,CAAC;AAEF;kFACkF;AAClF,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAW,EAAE,EAAE,mBAAmB,2CA4BvG;AAmCD,MAAM,MAAM,sBAAsB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI;IAC9D,EAAE,EAAE,CAAC,CAAC;IACN,KAAK,EAAE,SAAS,CAAC;IACjB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,GAAG,mBAAmB,GAAG,SAAS,CAAC;IAChD,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,qBAAqB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI;IAC7D,SAAS,EAAE,sBAAsB,CAAC,CAAC,CAAC,EAAE,CAAC;IACvC,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,QAAQ,EAAE,CAAC,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,CAAC;AAEF;;wBAEwB;AACxB,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,EAC1D,SAAS,EACT,KAAK,EACL,QAAQ,EACR,SAAS,EACT,SAAyB,GAC1B,EAAE,qBAAqB,CAAC,CAAC,CAAC,2CAoB1B;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,MAAM,CAAC,EAAE,gBAAgB,GAAG,SAAS,CAAC;IACtC,cAAc,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACnD,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC,aAAa,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACpC,CAAC;AAEF;;uCAEuC;AACvC,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,cAAc,EACd,SAAS,EACT,QAAgB,EAChB,SAAsB,EACtB,cAA6B,EAC7B,aAAiB,GAClB,EAAE,mBAAmB,2CAwCrB"}
+{"version":3,"file":"ModelSelector.d.ts","sourceRoot":"","sources":["../../../src/data/chat/ModelSelector.tsx"],"names":[],"mappings":"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"}

package/dist/data/chat/ModelSelector.js

@@ -3,7 +3,7 @@ import { createElement } from "react";
 import { Combobox } from "../../components/Combobox.js";
 import { SegmentedControl } from "../../components/SegmentedControl.js";
 import { cn } from "../../lib/utils.js";
-import { effortLevelIcon, effortLevelColor } from "./effort-icons.js";
+import { effortLevelIcon, effortLevelColor, effortLevelLabel } from "./effort-icons.js";
 import { providerIcon } from "./provider-icons.js";
 function ModelSelector({ models, value, onChange, className, size = "sm" }) {
   if (models.length === 0) return null;
@@ -33,8 +33,11 @@ function ModelSelector({ models, value, onChange, className, size = "sm" }) {
   );
 }
 function EffortSelector({ efforts, value, onChange, className, size = "sm" }) {
-  const supportedEfforts = efforts.filter(Boolean);
-  const selectedEffort = value && supportedEfforts.includes(value) ? value : "";
+  const selectedEffort = (value == null ? void 0 : value.trim()) ?? "";
+  const supportedEfforts = [...new Set(efforts.map((effort) => effort.trim()).filter(Boolean))];
+  if (selectedEffort && !supportedEfforts.includes(selectedEffort)) {
+    supportedEfforts.push(selectedEffort);
+  }
   const selectedGlyph = selectedEffort ? effortLevelIcon(selectedEffort) : void 0;
   const selectedColor = selectedEffort ? effortLevelColor(selectedEffort) : void 0;
   const selectedIcon = selectedGlyph ? createElement(selectedGlyph, { className: cn("size-4", selectedColor) }) : void 0;
@@ -42,7 +45,7 @@ function EffortSelector({ efforts, value, onChange, className, size = "sm" }) {
     Combobox,
     {
       ariaLabel: "Reasoning effort",
-      value: value ?? "",
+      value: selectedEffort,
       onChange,
       allowCustomValue: false,
       required: true,
@@ -67,7 +70,7 @@ function fullEffortLabel(value) {
     case "max":
       return "Maximum";
     default:
-      return titleCaseEffort(value);
+      return effortLevelLabel(value);
   }
 }
 function shortEffortLabel(value) {
@@ -83,14 +86,9 @@ function shortEffortLabel(value) {
     case "max":
       return "Max";
     default:
-      return titleCaseEffort(value);
+      return effortLevelLabel(value);
   }
 }
-function titleCaseEffort(value) {
-  var _a;
-  const effort = value.trim();
-  return `${((_a = effort[0]) == null ? void 0 : _a.toUpperCase()) ?? ""}${effort.slice(1)}`;
-}
 function ProviderSelector({
   providers,
   value,

package/dist/data/chat/ModelSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModelSelector.js","sources":["../../../src/data/chat/ModelSelector.tsx"],"sourcesContent":["import { createElement, type ReactNode } from \"react\";\nimport { Combobox } from \"../../components/Combobox\";\nimport type { FormSize } from \"../../components/json-schema-form-size\";\nimport { SegmentedControl } from \"../../components/SegmentedControl\";\nimport type { StaticIconComponent } from \"../Icon\";\nimport { cn } from \"../../lib/utils\";\nimport { effortLevelColor, effortLevelIcon } from \"./effort-icons\";\nimport { providerIcon } from \"./provider-icons\";\nimport type { ChatBudgetConfig, ChatModel } from \"./types\";\n\nexport type ModelSelectorProps = {\n  models: ChatModel[];\n  /** Currently selected model id. */\n  value?: string | undefined;\n  onChange: (id: string) => void;\n  className?: string;\n  /** Control size. Defaults to `sm` (compact chat toolbar); pass `md` to match\n   *  a standard-density form row. */\n  size?: FormSize;\n};\n\n/** A searchable model picker driven by the backend model menu, showing each\n *  provider's brand icon. Models whose provider is not configured are disabled\n *  rather than hidden, so the menu communicates what would be available with the\n *  right API key. */\nexport function ModelSelector({ models, value, onChange, className, size = \"sm\" }: ModelSelectorProps) {\n  if (models.length === 0) return null;\n  const selected = models.find((m) => m.id === value);\n  const SelectedGlyph = providerIcon(selected?.provider);\n  return (\n    <Combobox\n      ariaLabel=\"Model\"\n      value={value ?? \"\"}\n      onChange={onChange}\n      allowCustomValue={false}\n      required\n      size={size}\n      className={cn(\"w-48\", className)}\n      {...(SelectedGlyph ? { prefix: <SelectedGlyph className=\"size-4\" /> } : {})}\n      options={models.map((m) => {\n        const Icon = providerIcon(m.provider);\n        return {\n          value: m.id,\n          label: m.label,\n          ...(Icon ? { icon: <Icon className=\"size-4\" /> } : {}),\n          disabled: m.configured === false,\n        };\n      })}\n    />\n  );\n}\n\nexport type EffortSelectorProps = {\n  efforts: string[];\n  value?: string | undefined;\n  onChange: (effort: string) => void;\n  className?: string;\n  /** Control size. Defaults to `sm`; pass `md` to match a standard form row. */\n  size?: FormSize;\n};\n\n/** Reasoning-effort picker, shown only for reasoning-capable models. The empty\n *  value means \"no extended thinking\". Strict: only the listed options commit. */\nexport function EffortSelector({ efforts, value, onChange, className, size = \"sm\" }: EffortSelectorProps) {\n  const supportedEfforts = efforts.filter(Boolean);\n  const selectedEffort = value && supportedEfforts.includes(value) ? value : \"\";\n  const selectedGlyph = selectedEffort ? effortLevelIcon(selectedEffort) : undefined;\n  const selectedColor = selectedEffort ? effortLevelColor(selectedEffort) : undefined;\n  const selectedIcon = selectedGlyph\n    ? createElement(selectedGlyph, { className: cn(\"size-4\", selectedColor) })\n    : undefined;\n  return (\n    <Combobox\n      ariaLabel=\"Reasoning effort\"\n      value={value ?? \"\"}\n      onChange={onChange}\n      allowCustomValue={false}\n      required\n      size={size}\n      className={cn(\"w-36\", className)}\n      {...(selectedIcon ? { prefix: selectedIcon } : {})}\n      options={[\n        { value: \"\", label: \"None\" },\n        ...supportedEfforts.map((effort) => ({\n          value: effort,\n          label: fullEffortLabel(effort),\n          selectedLabel: shortEffortLabel(effort),\n        })),\n      ]}\n    />\n  );\n}\n\nfunction fullEffortLabel(value: string): string {\n  switch (value.trim().toLowerCase()) {\n    case \"xhigh\":\n      return \"Extra high\";\n    case \"max\":\n      return \"Maximum\";\n    default:\n      return titleCaseEffort(value);\n  }\n}\n\nfunction shortEffortLabel(value: string): string {\n  switch (value.trim().toLowerCase()) {\n    case \"minimal\":\n      return \"Min\";\n    case \"medium\":\n      return \"Med\";\n    case \"xhigh\":\n      return \"XHigh\";\n    case \"adaptive\":\n      return \"Auto\";\n    case \"max\":\n      return \"Max\";\n    default:\n      return titleCaseEffort(value);\n  }\n}\n\nfunction titleCaseEffort(value: string): string {\n  const effort = value.trim();\n  return `${effort[0]?.toUpperCase() ?? \"\"}${effort.slice(1)}`;\n}\n\nexport type ProviderSelectorOption<T extends string = string> = {\n  id: T;\n  label: ReactNode;\n  /** Provider id used for the default brand glyph when `icon` is omitted. */\n  provider?: string | undefined;\n  icon?: string | StaticIconComponent | undefined;\n  title?: string | undefined;\n  disabled?: boolean | undefined;\n};\n\nexport type ProviderSelectorProps<T extends string = string> = {\n  providers: ProviderSelectorOption<T>[];\n  value: T;\n  onChange: (provider: T) => void;\n  className?: string | undefined;\n  ariaLabel?: string | undefined;\n};\n\n/** Segmented AI provider picker with the same provider glyphs used by the model\n * selector. Use when the backend needs the provider/agent axis separate from the\n * concrete model id. */\nexport function ProviderSelector<T extends string = string>({\n  providers,\n  value,\n  onChange,\n  className,\n  ariaLabel = \"AI provider\",\n}: ProviderSelectorProps<T>) {\n  return (\n    <SegmentedControl\n      aria-label={ariaLabel}\n      size=\"sm\"\n      value={value}\n      onChange={onChange}\n      className={cn(\"w-fit\", className)}\n      options={providers.map((provider) => {\n        const icon = provider.icon ?? providerIcon(provider.provider);\n        return {\n          id: provider.id,\n          label: provider.label,\n          ...(provider.title ? { title: provider.title } : {}),\n          ...(provider.disabled !== undefined ? { disabled: provider.disabled } : {}),\n          ...(icon ? { icon } : {}),\n        };\n      })}\n    />\n  );\n}\n\nexport type BudgetSelectorProps = {\n  budget?: ChatBudgetConfig | undefined;\n  onBudgetChange: (budget: ChatBudgetConfig) => void;\n  className?: string | undefined;\n  disabled?: boolean | undefined;\n  costLabel?: string | undefined;\n  maxTokensLabel?: string | undefined;\n  maxTokensStep?: number | undefined;\n};\n\n/** Compact budget fields matching the advanced chat settings surface. Callers may\n * relabel the token field when their payload contract uses a different budgeted\n * unit, such as conversation turns. */\nexport function BudgetSelector({\n  budget,\n  onBudgetChange,\n  className,\n  disabled = false,\n  costLabel = \"Max cost\",\n  maxTokensLabel = \"Max tokens\",\n  maxTokensStep = 1,\n}: BudgetSelectorProps) {\n  const updateBudget = (key: keyof ChatBudgetConfig, raw: string, integer = false) => {\n    const next: ChatBudgetConfig = { ...budget };\n    const parsed = parseOptionalNumber(raw, integer);\n    if (parsed === undefined) {\n      delete next[key];\n    } else {\n      next[key] = parsed;\n    }\n    onBudgetChange(next);\n  };\n\n  return (\n    <div className={cn(\"grid grid-cols-2 gap-3\", className)}>\n      <label className=\"space-y-1 text-xs\">\n        <span className=\"text-muted-foreground\">{costLabel}</span>\n        <input\n          type=\"number\"\n          min={0}\n          step={0.01}\n          value={budget?.cost ?? \"\"}\n          onChange={(event) => updateBudget(\"cost\", event.target.value)}\n          disabled={disabled}\n          className=\"h-8 w-full rounded border border-border bg-background px-2 text-xs disabled:cursor-not-allowed disabled:opacity-50\"\n        />\n      </label>\n      <label className=\"space-y-1 text-xs\">\n        <span className=\"text-muted-foreground\">{maxTokensLabel}</span>\n        <input\n          type=\"number\"\n          min={0}\n          step={maxTokensStep}\n          value={budget?.maxTokens ?? \"\"}\n          onChange={(event) => updateBudget(\"maxTokens\", event.target.value, maxTokensStep >= 1)}\n          disabled={disabled}\n          className=\"h-8 w-full rounded border border-border bg-background px-2 text-xs disabled:cursor-not-allowed disabled:opacity-50\"\n        />\n      </label>\n    </div>\n  );\n}\n\nfunction parseOptionalNumber(raw: string, integer = false): number | undefined {\n  if (raw.trim() === \"\") return undefined;\n  const value = Number(raw);\n  if (!Number.isFinite(value)) return undefined;\n  return integer ? Math.max(0, Math.trunc(value)) : value;\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ModelSelector.js","sources":["../../../src/data/chat/ModelSelector.tsx"],"sourcesContent":["import { createElement, type ReactNode } from \"react\";\nimport { Combobox } from \"../../components/Combobox\";\nimport type { FormSize } from \"../../components/json-schema-form-size\";\nimport { SegmentedControl } from \"../../components/SegmentedControl\";\nimport type { StaticIconComponent } from \"../Icon\";\nimport { cn } from \"../../lib/utils\";\nimport {\n  effortLevelColor,\n  effortLevelIcon,\n  effortLevelLabel,\n} from \"./effort-icons\";\nimport { providerIcon } from \"./provider-icons\";\nimport type { ChatBudgetConfig, ChatModel } from \"./types\";\n\nexport type ModelSelectorProps = {\n  models: ChatModel[];\n  /** Currently selected model id. */\n  value?: string | undefined;\n  onChange: (id: string) => void;\n  className?: string;\n  /** Control size. Defaults to `sm` (compact chat toolbar); pass `md` to match\n   *  a standard-density form row. */\n  size?: FormSize;\n};\n\n/** A searchable model picker driven by the backend model menu, showing each\n *  provider's brand icon. Models whose provider is not configured are disabled\n *  rather than hidden, so the menu communicates what would be available with the\n *  right API key. */\nexport function ModelSelector({ models, value, onChange, className, size = \"sm\" }: ModelSelectorProps) {\n  if (models.length === 0) return null;\n  const selected = models.find((m) => m.id === value);\n  const SelectedGlyph = providerIcon(selected?.provider);\n  return (\n    <Combobox\n      ariaLabel=\"Model\"\n      value={value ?? \"\"}\n      onChange={onChange}\n      allowCustomValue={false}\n      required\n      size={size}\n      className={cn(\"w-48\", className)}\n      {...(SelectedGlyph ? { prefix: <SelectedGlyph className=\"size-4\" /> } : {})}\n      options={models.map((m) => {\n        const Icon = providerIcon(m.provider);\n        return {\n          value: m.id,\n          label: m.label,\n          ...(Icon ? { icon: <Icon className=\"size-4\" /> } : {}),\n          disabled: m.configured === false,\n        };\n      })}\n    />\n  );\n}\n\nexport type EffortSelectorProps = {\n  efforts: string[];\n  value?: string | undefined;\n  onChange: (effort: string) => void;\n  className?: string;\n  /** Control size. Defaults to `sm`; pass `md` to match a standard form row. */\n  size?: FormSize;\n};\n\n/** Reasoning-effort picker, shown only for reasoning-capable models. The empty\n *  value means \"no extended thinking\". Strict: only the listed options commit. */\nexport function EffortSelector({ efforts, value, onChange, className, size = \"sm\" }: EffortSelectorProps) {\n  const selectedEffort = value?.trim() ?? \"\";\n  const supportedEfforts = [...new Set(efforts.map((effort) => effort.trim()).filter(Boolean))];\n  if (selectedEffort && !supportedEfforts.includes(selectedEffort)) {\n    supportedEfforts.push(selectedEffort);\n  }\n  const selectedGlyph = selectedEffort ? effortLevelIcon(selectedEffort) : undefined;\n  const selectedColor = selectedEffort ? effortLevelColor(selectedEffort) : undefined;\n  const selectedIcon = selectedGlyph\n    ? createElement(selectedGlyph, { className: cn(\"size-4\", selectedColor) })\n    : undefined;\n  return (\n    <Combobox\n      ariaLabel=\"Reasoning effort\"\n      value={selectedEffort}\n      onChange={onChange}\n      allowCustomValue={false}\n      required\n      size={size}\n      className={cn(\"w-36\", className)}\n      {...(selectedIcon ? { prefix: selectedIcon } : {})}\n      options={[\n        { value: \"\", label: \"None\" },\n        ...supportedEfforts.map((effort) => ({\n          value: effort,\n          label: fullEffortLabel(effort),\n          selectedLabel: shortEffortLabel(effort),\n        })),\n      ]}\n    />\n  );\n}\n\nfunction fullEffortLabel(value: string): string {\n  switch (value.trim().toLowerCase()) {\n    case \"xhigh\":\n      return \"Extra high\";\n    case \"max\":\n      return \"Maximum\";\n    default:\n      return effortLevelLabel(value);\n  }\n}\n\nfunction shortEffortLabel(value: string): string {\n  switch (value.trim().toLowerCase()) {\n    case \"minimal\":\n      return \"Min\";\n    case \"medium\":\n      return \"Med\";\n    case \"xhigh\":\n      return \"XHigh\";\n    case \"adaptive\":\n      return \"Auto\";\n    case \"max\":\n      return \"Max\";\n    default:\n      return effortLevelLabel(value);\n  }\n}\n\nexport type ProviderSelectorOption<T extends string = string> = {\n  id: T;\n  label: ReactNode;\n  /** Provider id used for the default brand glyph when `icon` is omitted. */\n  provider?: string | undefined;\n  icon?: string | StaticIconComponent | undefined;\n  title?: string | undefined;\n  disabled?: boolean | undefined;\n};\n\nexport type ProviderSelectorProps<T extends string = string> = {\n  providers: ProviderSelectorOption<T>[];\n  value: T;\n  onChange: (provider: T) => void;\n  className?: string | undefined;\n  ariaLabel?: string | undefined;\n};\n\n/** Segmented AI provider picker with the same provider glyphs used by the model\n * selector. Use when the backend needs the provider/agent axis separate from the\n * concrete model id. */\nexport function ProviderSelector<T extends string = string>({\n  providers,\n  value,\n  onChange,\n  className,\n  ariaLabel = \"AI provider\",\n}: ProviderSelectorProps<T>) {\n  return (\n    <SegmentedControl\n      aria-label={ariaLabel}\n      size=\"sm\"\n      value={value}\n      onChange={onChange}\n      className={cn(\"w-fit\", className)}\n      options={providers.map((provider) => {\n        const icon = provider.icon ?? providerIcon(provider.provider);\n        return {\n          id: provider.id,\n          label: provider.label,\n          ...(provider.title ? { title: provider.title } : {}),\n          ...(provider.disabled !== undefined ? { disabled: provider.disabled } : {}),\n          ...(icon ? { icon } : {}),\n        };\n      })}\n    />\n  );\n}\n\nexport type BudgetSelectorProps = {\n  budget?: ChatBudgetConfig | undefined;\n  onBudgetChange: (budget: ChatBudgetConfig) => void;\n  className?: string | undefined;\n  disabled?: boolean | undefined;\n  costLabel?: string | undefined;\n  maxTokensLabel?: string | undefined;\n  maxTokensStep?: number | undefined;\n};\n\n/** Compact budget fields matching the advanced chat settings surface. Callers may\n * relabel the token field when their payload contract uses a different budgeted\n * unit, such as conversation turns. */\nexport function BudgetSelector({\n  budget,\n  onBudgetChange,\n  className,\n  disabled = false,\n  costLabel = \"Max cost\",\n  maxTokensLabel = \"Max tokens\",\n  maxTokensStep = 1,\n}: BudgetSelectorProps) {\n  const updateBudget = (key: keyof ChatBudgetConfig, raw: string, integer = false) => {\n    const next: ChatBudgetConfig = { ...budget };\n    const parsed = parseOptionalNumber(raw, integer);\n    if (parsed === undefined) {\n      delete next[key];\n    } else {\n      next[key] = parsed;\n    }\n    onBudgetChange(next);\n  };\n\n  return (\n    <div className={cn(\"grid grid-cols-2 gap-3\", className)}>\n      <label className=\"space-y-1 text-xs\">\n        <span className=\"text-muted-foreground\">{costLabel}</span>\n        <input\n          type=\"number\"\n          min={0}\n          step={0.01}\n          value={budget?.cost ?? \"\"}\n          onChange={(event) => updateBudget(\"cost\", event.target.value)}\n          disabled={disabled}\n          className=\"h-8 w-full rounded border border-border bg-background px-2 text-xs disabled:cursor-not-allowed disabled:opacity-50\"\n        />\n      </label>\n      <label className=\"space-y-1 text-xs\">\n        <span className=\"text-muted-foreground\">{maxTokensLabel}</span>\n        <input\n          type=\"number\"\n          min={0}\n          step={maxTokensStep}\n          value={budget?.maxTokens ?? \"\"}\n          onChange={(event) => updateBudget(\"maxTokens\", event.target.value, maxTokensStep >= 1)}\n          disabled={disabled}\n          className=\"h-8 w-full rounded border border-border bg-background px-2 text-xs disabled:cursor-not-allowed disabled:opacity-50\"\n        />\n      </label>\n    </div>\n  );\n}\n\nfunction parseOptionalNumber(raw: string, integer = false): number | undefined {\n  if (raw.trim() === \"\") return undefined;\n  const value = Number(raw);\n  if (!Number.isFinite(value)) return undefined;\n  return integer ? Math.max(0, Math.trunc(value)) : value;\n}\n"],"names":[],"mappings":"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"}

package/dist/data/chat/PromptInput.cjs

@@ -12,17 +12,26 @@ function PromptInput({
   onSubmit,
   onStop,
   status,
+  allowSubmitWhileStreaming = false,
+  disabled = false,
+  stopLabel = "Stop",
   placeholder = "What would you like to know?",
   enableAttachments = false,
+  attachmentUpload,
+  acceptedMediaTypes,
+  attachmentLimits,
   toolbar,
+  inputAccessory,
   className
 }) {
   const [value, setValue] = react.useState("");
   const [files, setFiles] = react.useState([]);
+  const [attachmentError, setAttachmentError] = react.useState("");
   const isGenerating = status === "submitted" || status === "streaming";
   const submit = () => {
     const text = value.trim();
-    if (!text && files.length === 0 || isGenerating) return;
+    if (!text && files.length === 0 || disabled || isGenerating && !allowSubmitWhileStreaming)
+      return;
     onSubmit(text, files);
     setValue("");
     setFiles([]);
@@ -37,7 +46,7 @@ function PromptInput({
       submit();
     }
   };
-  const canSubmit = value.trim().length > 0 || files.length > 0;
+  const canSubmit = !disabled && (!isGenerating || allowSubmitWhileStreaming) && (value.trim().length > 0 || files.length > 0);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "form",
     {
@@ -47,7 +56,16 @@ function PromptInput({
         className
       ),
       children: [
-        enableAttachments && /* @__PURE__ */ jsxRuntime.jsx(Attachment.AttachmentList, { files, onRemove: (i) => setFiles((f) => f.filter((_, j) => j !== i)) }),
+        enableAttachments && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Attachment.AttachmentList,
+            {
+              files,
+              onRemove: (i) => setFiles((f) => f.filter((_, j) => j !== i))
+            }
+          ),
+          attachmentError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "px-1 text-xs text-destructive", children: attachmentError })
+        ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-end gap-2", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             "textarea",
@@ -56,14 +74,47 @@ function PromptInput({
               onChange: (e) => setValue(e.target.value),
               onKeyDown: handleKeyDown,
               placeholder,
+              disabled,
               rows: 1,
               className: "max-h-48 min-h-9 flex-1 resize-none bg-transparent px-1 py-1.5 text-sm outline-none placeholder:text-muted-foreground"
             }
           ),
-          isGenerating && onStop ? /* @__PURE__ */ jsxRuntime.jsx(button.Button, { type: "button", size: "icon", variant: "secondary", "aria-label": "Stop", onClick: onStop, children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiStop.UiStop, className: "size-4" }) }) : /* @__PURE__ */ jsxRuntime.jsx(button.Button, { type: "submit", size: "icon", "aria-label": "Send", disabled: !canSubmit, children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiArrowUp.UiArrowUp, className: "size-4" }) })
+          inputAccessory,
+          isGenerating && onStop && /* @__PURE__ */ jsxRuntime.jsx(
+            button.Button,
+            {
+              type: "button",
+              size: "icon",
+              variant: "secondary",
+              "aria-label": stopLabel,
+              onClick: onStop,
+              children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiStop.UiStop, className: "size-4" })
+            }
+          ),
+          (!isGenerating || allowSubmitWhileStreaming) && /* @__PURE__ */ jsxRuntime.jsx(
+            button.Button,
+            {
+              type: "submit",
+              size: "icon",
+              "aria-label": "Send",
+              disabled: !canSubmit,
+              children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiArrowUp.UiArrowUp, className: "size-4" })
+            }
+          )
         ] }),
         (toolbar || enableAttachments) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-          enableAttachments && /* @__PURE__ */ jsxRuntime.jsx(Attachment.AttachmentButton, { onAdd: (p) => setFiles((f) => [...f, ...p]), disabled: isGenerating }),
+          enableAttachments && /* @__PURE__ */ jsxRuntime.jsx(
+            Attachment.AttachmentButton,
+            {
+              onAdd: (p) => setFiles((f) => [...f, ...p]),
+              disabled: disabled || isGenerating,
+              files,
+              onError: setAttachmentError,
+              ...attachmentUpload ? { upload: attachmentUpload } : {},
+              ...acceptedMediaTypes ? { acceptedMediaTypes } : {},
+              ...attachmentLimits ? { limits: attachmentLimits } : {}
+            }
+          ),
           toolbar
         ] })
       ]

package/dist/data/chat/PromptInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PromptInput.cjs","sources":["../../../src/data/chat/PromptInput.tsx"],"sourcesContent":["import { useState, type FormEvent, type KeyboardEvent, type ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { Button } from \"../../components/button\";\nimport { Icon } from \"../Icon\";\nimport { UiArrowUp, UiStop } from \"../../icons\";\nimport { AttachmentButton, AttachmentList } from \"./Attachment\";\nimport type { ChatStatus, FileUIPart } from \"./types\";\n\nexport type PromptInputProps = {\n  /** Called with the trimmed text and any attachments when the user submits. */\n  onSubmit: (text: string, files: FileUIPart[]) => void;\n  /** Called when the user stops an in-flight generation. */\n  onStop?: (() => void) | undefined;\n  /** Current chat status; drives the submit/stop button affordance. */\n  status?: ChatStatus | undefined;\n  placeholder?: string | undefined;\n  /** Enables the attachment button and chips. */\n  enableAttachments?: boolean | undefined;\n  /** Toolbar content (e.g. model/effort selectors) rendered in the footer. */\n  toolbar?: ReactNode;\n  className?: string | undefined;\n};\n\n/** Auto-growing prompt textarea with a submit/stop button, optional attachment\n *  controls, and a toolbar slot (model/effort selectors). Enter submits;\n *  Shift+Enter inserts a newline; while streaming the button becomes a stop\n *  control. */\nexport function PromptInput({\n  onSubmit,\n  onStop,\n  status,\n  placeholder = \"What would you like to know?\",\n  enableAttachments = false,\n  toolbar,\n  className,\n}: PromptInputProps) {\n  const [value, setValue] = useState(\"\");\n  const [files, setFiles] = useState<FileUIPart[]>([]);\n  const isGenerating = status === \"submitted\" || status === \"streaming\";\n\n  const submit = () => {\n    const text = value.trim();\n    if ((!text && files.length === 0) || isGenerating) return;\n    onSubmit(text, files);\n    setValue(\"\");\n    setFiles([]);\n  };\n\n  const handleSubmit = (e: FormEvent) => {\n    e.preventDefault();\n    submit();\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n    if (e.key === \"Enter\" && !e.shiftKey && !e.nativeEvent.isComposing) {\n      e.preventDefault();\n      submit();\n    }\n  };\n\n  const canSubmit = value.trim().length > 0 || files.length > 0;\n\n  return (\n    <form\n      onSubmit={handleSubmit}\n      className={cn(\n        \"flex flex-col gap-2 rounded-lg border border-input bg-background p-2\",\n        className,\n      )}\n    >\n      {enableAttachments && (\n        <AttachmentList files={files} onRemove={(i) => setFiles((f) => f.filter((_, j) => j !== i))} />\n      )}\n\n      <div className=\"flex items-end gap-2\">\n        <textarea\n          value={value}\n          onChange={(e) => setValue(e.target.value)}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          rows={1}\n          className=\"max-h-48 min-h-9 flex-1 resize-none bg-transparent px-1 py-1.5 text-sm outline-none placeholder:text-muted-foreground\"\n        />\n        {isGenerating && onStop ? (\n          <Button type=\"button\" size=\"icon\" variant=\"secondary\" aria-label=\"Stop\" onClick={onStop}>\n            <Icon icon={UiStop} className=\"size-4\" />\n          </Button>\n        ) : (\n          <Button type=\"submit\" size=\"icon\" aria-label=\"Send\" disabled={!canSubmit}>\n            <Icon icon={UiArrowUp} className=\"size-4\" />\n          </Button>\n        )}\n      </div>\n\n      {(toolbar || enableAttachments) && (\n        <div className=\"flex items-center gap-2\">\n          {enableAttachments && (\n            <AttachmentButton onAdd={(p) => setFiles((f) => [...f, ...p])} disabled={isGenerating} />\n          )}\n          {toolbar}\n        </div>\n      )}\n    </form>\n  );\n}\n"],"names":["useState","jsxs","cn","AttachmentList","jsx","Button","Icon","UiStop","UiArrowUp","AttachmentButton"],"mappings":";;;;;;;;;;AA2BO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB;AAAA,EACA;AACF,GAAqB;AACnB,QAAM,CAAC,OAAO,QAAQ,IAAIA,MAAAA,SAAS,EAAE;AACrC,QAAM,CAAC,OAAO,QAAQ,IAAIA,MAAAA,SAAuB,CAAA,CAAE;AACnD,QAAM,eAAe,WAAW,eAAe,WAAW;AAE1D,QAAM,SAAS,MAAM;AACnB,UAAM,OAAO,MAAM,KAAA;AACnB,QAAK,CAAC,QAAQ,MAAM,WAAW,KAAM,aAAc;AACnD,aAAS,MAAM,KAAK;AACpB,aAAS,EAAE;AACX,aAAS,CAAA,CAAE;AAAA,EACb;AAEA,QAAM,eAAe,CAAC,MAAiB;AACrC,MAAE,eAAA;AACF,WAAA;AAAA,EACF;AAEA,QAAM,gBAAgB,CAAC,MAA0C;AAC/D,QAAI,EAAE,QAAQ,WAAW,CAAC,EAAE,YAAY,CAAC,EAAE,YAAY,aAAa;AAClE,QAAE,eAAA;AACF,aAAA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,YAAY,MAAM,KAAA,EAAO,SAAS,KAAK,MAAM,SAAS;AAE5D,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,WAAWC,MAAAA;AAAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAA,oDACEC,2BAAA,EAAe,OAAc,UAAU,CAAC,MAAM,SAAS,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,MAAM,MAAM,CAAC,CAAC,GAAG;AAAA,QAG/FF,2BAAAA,KAAC,OAAA,EAAI,WAAU,wBACb,UAAA;AAAA,UAAAG,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC;AAAA,cACA,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,cACxC,WAAW;AAAA,cACX;AAAA,cACA,MAAM;AAAA,cACN,WAAU;AAAA,YAAA;AAAA,UAAA;AAAA,UAEX,gBAAgB,SACfA,2BAAAA,IAACC,eAAA,EAAO,MAAK,UAAS,MAAK,QAAO,SAAQ,aAAY,cAAW,QAAO,SAAS,QAC/E,UAAAD,+BAACE,KAAAA,MAAA,EAAK,MAAMC,OAAAA,QAAQ,WAAU,SAAA,CAAS,GACzC,IAEAH,+BAACC,OAAAA,QAAA,EAAO,MAAK,UAAS,MAAK,QAAO,cAAW,QAAO,UAAU,CAAC,WAC7D,UAAAD,2BAAAA,IAACE,KAAAA,MAAA,EAAK,MAAME,qBAAW,WAAU,UAAS,EAAA,CAC5C;AAAA,QAAA,GAEJ;AAAA,SAEE,WAAW,sBACXP,2BAAAA,KAAC,OAAA,EAAI,WAAU,2BACZ,UAAA;AAAA,UAAA,oDACEQ,WAAAA,kBAAA,EAAiB,OAAO,CAAC,MAAM,SAAS,CAAC,MAAM,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC,GAAG,UAAU,cAAc;AAAA,UAExF;AAAA,QAAA,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;;"}
+{"version":3,"file":"PromptInput.cjs","sources":["../../../src/data/chat/PromptInput.tsx"],"sourcesContent":["import {\n  useState,\n  type FormEvent,\n  type KeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { Button } from \"../../components/button\";\nimport { Icon } from \"../Icon\";\nimport { UiArrowUp, UiStop } from \"../../icons\";\nimport {\n  AttachmentButton,\n  AttachmentList,\n} from \"./Attachment\";\nimport type {\n  AttachmentLimits,\n  AttachmentUploadAdapter,\n} from \"./attachment-upload\";\nimport type { ChatStatus, FileUIPart } from \"./types\";\n\nexport type PromptInputProps = {\n  /** Called with the trimmed text and any attachments when the user submits. */\n  onSubmit: (text: string, files: FileUIPart[]) => void;\n  /** Called when the user stops an in-flight generation. */\n  onStop?: (() => void) | undefined;\n  /** Current chat status; drives the submit/stop button affordance. */\n  status?: ChatStatus | undefined;\n  allowSubmitWhileStreaming?: boolean | undefined;\n  disabled?: boolean | undefined;\n  stopLabel?: string | undefined;\n  placeholder?: string | undefined;\n  /** Enables the attachment button and chips. */\n  enableAttachments?: boolean | undefined;\n  attachmentUpload?: AttachmentUploadAdapter | undefined;\n  acceptedMediaTypes?: string[] | undefined;\n  attachmentLimits?: AttachmentLimits | undefined;\n  /** Toolbar content (e.g. model/effort selectors) rendered in the footer. */\n  toolbar?: ReactNode;\n  /** Compact host control rendered beside the textarea and submit button. */\n  inputAccessory?: ReactNode;\n  className?: string | undefined;\n};\n\n/** Auto-growing prompt textarea with a submit/stop button, optional attachment\n *  controls, and a toolbar slot (model/effort selectors). Enter submits;\n *  Shift+Enter inserts a newline; while streaming the button becomes a stop\n *  control. */\nexport function PromptInput({\n  onSubmit,\n  onStop,\n  status,\n  allowSubmitWhileStreaming = false,\n  disabled = false,\n  stopLabel = \"Stop\",\n  placeholder = \"What would you like to know?\",\n  enableAttachments = false,\n  attachmentUpload,\n  acceptedMediaTypes,\n  attachmentLimits,\n  toolbar,\n  inputAccessory,\n  className,\n}: PromptInputProps) {\n  const [value, setValue] = useState(\"\");\n  const [files, setFiles] = useState<FileUIPart[]>([]);\n  const [attachmentError, setAttachmentError] = useState(\"\");\n  const isGenerating = status === \"submitted\" || status === \"streaming\";\n\n  const submit = () => {\n    const text = value.trim();\n    if (\n      (!text && files.length === 0) ||\n      disabled ||\n      (isGenerating && !allowSubmitWhileStreaming)\n    )\n      return;\n    onSubmit(text, files);\n    setValue(\"\");\n    setFiles([]);\n  };\n\n  const handleSubmit = (e: FormEvent) => {\n    e.preventDefault();\n    submit();\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n    if (e.key === \"Enter\" && !e.shiftKey && !e.nativeEvent.isComposing) {\n      e.preventDefault();\n      submit();\n    }\n  };\n\n  const canSubmit =\n    !disabled &&\n    (!isGenerating || allowSubmitWhileStreaming) &&\n    (value.trim().length > 0 || files.length > 0);\n\n  return (\n    <form\n      onSubmit={handleSubmit}\n      className={cn(\n        \"flex flex-col gap-2 rounded-lg border border-input bg-background p-2\",\n        className,\n      )}\n    >\n      {enableAttachments && (\n        <>\n          <AttachmentList\n            files={files}\n            onRemove={(i) => setFiles((f) => f.filter((_, j) => j !== i))}\n          />\n          {attachmentError && (\n            <p className=\"px-1 text-xs text-destructive\">{attachmentError}</p>\n          )}\n        </>\n      )}\n\n      <div className=\"flex items-end gap-2\">\n        <textarea\n          value={value}\n          onChange={(e) => setValue(e.target.value)}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          disabled={disabled}\n          rows={1}\n          className=\"max-h-48 min-h-9 flex-1 resize-none bg-transparent px-1 py-1.5 text-sm outline-none placeholder:text-muted-foreground\"\n        />\n        {inputAccessory}\n        {isGenerating && onStop && (\n          <Button\n            type=\"button\"\n            size=\"icon\"\n            variant=\"secondary\"\n            aria-label={stopLabel}\n            onClick={onStop}\n          >\n            <Icon icon={UiStop} className=\"size-4\" />\n          </Button>\n        )}\n        {(!isGenerating || allowSubmitWhileStreaming) && (\n          <Button\n            type=\"submit\"\n            size=\"icon\"\n            aria-label=\"Send\"\n            disabled={!canSubmit}\n          >\n            <Icon icon={UiArrowUp} className=\"size-4\" />\n          </Button>\n        )}\n      </div>\n\n      {(toolbar || enableAttachments) && (\n        <div className=\"flex items-center gap-2\">\n          {enableAttachments && (\n            <AttachmentButton\n              onAdd={(p) => setFiles((f) => [...f, ...p])}\n              disabled={disabled || isGenerating}\n              files={files}\n              onError={setAttachmentError}\n              {...(attachmentUpload ? { upload: attachmentUpload } : {})}\n              {...(acceptedMediaTypes ? { acceptedMediaTypes } : {})}\n              {...(attachmentLimits ? { limits: attachmentLimits } : {})}\n            />\n          )}\n          {toolbar}\n        </div>\n      )}\n    </form>\n  );\n}\n"],"names":["useState","jsxs","cn","Fragment","jsx","AttachmentList","Button","Icon","UiStop","UiArrowUp","AttachmentButton"],"mappings":"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"}

package/dist/data/chat/PromptInput.d.ts

@@ -1,4 +1,5 @@
 import { ReactNode } from 'react';
+import { AttachmentLimits, AttachmentUploadAdapter } from './attachment-upload';
 import { ChatStatus, FileUIPart } from './types';
 export type PromptInputProps = {
     /** Called with the trimmed text and any attachments when the user submits. */
@@ -7,16 +8,24 @@ export type PromptInputProps = {
     onStop?: (() => void) | undefined;
     /** Current chat status; drives the submit/stop button affordance. */
     status?: ChatStatus | undefined;
+    allowSubmitWhileStreaming?: boolean | undefined;
+    disabled?: boolean | undefined;
+    stopLabel?: string | undefined;
     placeholder?: string | undefined;
     /** Enables the attachment button and chips. */
     enableAttachments?: boolean | undefined;
+    attachmentUpload?: AttachmentUploadAdapter | undefined;
+    acceptedMediaTypes?: string[] | undefined;
+    attachmentLimits?: AttachmentLimits | undefined;
     /** Toolbar content (e.g. model/effort selectors) rendered in the footer. */
     toolbar?: ReactNode;
+    /** Compact host control rendered beside the textarea and submit button. */
+    inputAccessory?: ReactNode;
     className?: string | undefined;
 };
 /** Auto-growing prompt textarea with a submit/stop button, optional attachment
  *  controls, and a toolbar slot (model/effort selectors). Enter submits;
  *  Shift+Enter inserts a newline; while streaming the button becomes a stop
  *  control. */
-export declare function PromptInput({ onSubmit, onStop, status, placeholder, enableAttachments, toolbar, className, }: PromptInputProps): import("react/jsx-runtime").JSX.Element;
+export declare function PromptInput({ onSubmit, onStop, status, allowSubmitWhileStreaming, disabled, stopLabel, placeholder, enableAttachments, attachmentUpload, acceptedMediaTypes, attachmentLimits, toolbar, inputAccessory, className, }: PromptInputProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=PromptInput.d.ts.map

package/dist/data/chat/PromptInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PromptInput.d.ts","sourceRoot":"","sources":["../../../src/data/chat/PromptInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMrF,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAEtD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,8EAA8E;IAC9E,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACtD,0DAA0D;IAC1D,MAAM,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IAClC,qEAAqE;IACrE,MAAM,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IAChC,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,+CAA+C;IAC/C,iBAAiB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACxC,4EAA4E;IAC5E,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,CAAC;AAEF;;;eAGe;AACf,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,MAAM,EACN,MAAM,EACN,WAA4C,EAC5C,iBAAyB,EACzB,OAAO,EACP,SAAS,GACV,EAAE,gBAAgB,2CAqElB"}
+{"version":3,"file":"PromptInput.d.ts","sourceRoot":"","sources":["../../../src/data/chat/PromptInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EACV,gBAAgB,EAChB,uBAAuB,EACxB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAEtD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,8EAA8E;IAC9E,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACtD,0DAA0D;IAC1D,MAAM,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IAClC,qEAAqE;IACrE,MAAM,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IAChC,yBAAyB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAChD,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,+CAA+C;IAC/C,iBAAiB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACxC,gBAAgB,CAAC,EAAE,uBAAuB,GAAG,SAAS,CAAC;IACvD,kBAAkB,CAAC,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;IAC1C,gBAAgB,CAAC,EAAE,gBAAgB,GAAG,SAAS,CAAC;IAChD,4EAA4E;IAC5E,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,2EAA2E;IAC3E,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,CAAC;AAEF;;;eAGe;AACf,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,MAAM,EACN,MAAM,EACN,yBAAiC,EACjC,QAAgB,EAChB,SAAkB,EAClB,WAA4C,EAC5C,iBAAyB,EACzB,gBAAgB,EAChB,kBAAkB,EAClB,gBAAgB,EAChB,OAAO,EACP,cAAc,EACd,SAAS,GACV,EAAE,gBAAgB,2CA4GlB"}