@seed-ship/mcp-ui-solid 2.3.0 → 2.4.0

package/dist/components/ChatPrompt.cjs

@@ -0,0 +1,271 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const web = require("solid-js/web");
+const solidJs = require("solid-js");
+var _tmpl$ = /* @__PURE__ */ web.template(`<div class="w-full max-w-2xl mx-auto mb-2 bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 shadow-lg overflow-hidden"role=dialog style="animation:chat-prompt-slide-up 0.2s ease-out"><div class="flex items-center justify-between px-4 py-2.5 border-b border-gray-100 dark:border-gray-700"><p class="text-sm font-medium text-gray-900 dark:text-white"></p><button class="p-1 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"aria-label=Dismiss><svg class="w-4 h-4"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div><div class="px-4 py-3"></div><style>
+        @keyframes chat-prompt-slide-up {
+          from { opacity: 0; transform: translateY(8px); }
+          to { opacity: 1; transform: translateY(0); }
+        }
+      `), _tmpl$2 = /* @__PURE__ */ web.template(`<div>`), _tmpl$3 = /* @__PURE__ */ web.template(`<span class=mr-2>`), _tmpl$4 = /* @__PURE__ */ web.template(`<span class="block text-xs text-gray-500 dark:text-gray-400 mt-0.5 font-normal">`), _tmpl$5 = /* @__PURE__ */ web.template(`<button class="px-4 py-2 text-sm font-medium rounded-lg border border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-700 text-gray-900 dark:text-white hover:bg-blue-50 hover:border-blue-300 dark:hover:bg-blue-900/30 dark:hover:border-blue-600 transition-colors text-left"><!$><!/><!$><!/><!$><!/>`), _tmpl$6 = /* @__PURE__ */ web.template(`<p class="text-sm text-gray-600 dark:text-gray-400 mb-3">`), _tmpl$7 = /* @__PURE__ */ web.template(`<div><!$><!/><div class="flex gap-2 justify-end"><button class="px-4 py-2 text-sm font-medium rounded-lg border border-gray-200 dark:border-gray-600 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"></button><button>`), _tmpl$8 = /* @__PURE__ */ web.template(`<form class="flex flex-col gap-3"><!$><!/><div class="flex justify-end"><button type=submit class="px-4 py-2 text-sm font-medium rounded-lg text-white bg-blue-600 hover:bg-blue-700 disabled:bg-gray-400 disabled:cursor-not-allowed transition-colors">`), _tmpl$9 = /* @__PURE__ */ web.template(`<span class="text-red-500 ml-0.5">*`), _tmpl$0 = /* @__PURE__ */ web.template(`<textarea rows=3 class="w-full px-3 py-2 text-sm rounded-lg border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none transition-colors">`), _tmpl$1 = /* @__PURE__ */ web.template(`<select class="w-full px-3 py-2 text-sm rounded-lg border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none transition-colors"><option value></option><!$><!/>`), _tmpl$10 = /* @__PURE__ */ web.template(`<input class="w-full px-3 py-2 text-sm rounded-lg border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none transition-colors">`), _tmpl$11 = /* @__PURE__ */ web.template(`<div><label class="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1"><!$><!/><!$><!/></label><!$><!/>`), _tmpl$12 = /* @__PURE__ */ web.template(`<option>`);
+const ChatPrompt = (props) => {
+  return (() => {
+    var _el$ = web.getNextElement(_tmpl$), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling, _el$5 = _el$2.nextSibling;
+    web.insert(_el$3, () => props.config.title);
+    _el$4.$$click = () => {
+      var _a;
+      (_a = props.onDismiss) == null ? void 0 : _a.call(props);
+      props.onSubmit({
+        type: props.config.type,
+        value: "",
+        label: "",
+        dismissed: true
+      });
+    };
+    web.insert(_el$5, web.createComponent(solidJs.Switch, {
+      get children() {
+        return [web.createComponent(solidJs.Match, {
+          get when() {
+            return props.config.type === "choice";
+          },
+          get children() {
+            return web.createComponent(ChoiceBody, {
+              get config() {
+                return props.config.config;
+              },
+              onSelect: (value, label) => props.onSubmit({
+                type: "choice",
+                value,
+                label
+              })
+            });
+          }
+        }), web.createComponent(solidJs.Match, {
+          get when() {
+            return props.config.type === "confirm";
+          },
+          get children() {
+            return web.createComponent(ConfirmBody, {
+              get config() {
+                return props.config.config;
+              },
+              onConfirm: () => props.onSubmit({
+                type: "confirm",
+                value: "confirmed",
+                label: props.config.config.confirmLabel || "Confirmed"
+              }),
+              onCancel: () => {
+                var _a;
+                (_a = props.onDismiss) == null ? void 0 : _a.call(props);
+                props.onSubmit({
+                  type: "confirm",
+                  value: "cancelled",
+                  label: props.config.config.cancelLabel || "Cancelled",
+                  dismissed: true
+                });
+              }
+            });
+          }
+        }), web.createComponent(solidJs.Match, {
+          get when() {
+            return props.config.type === "form";
+          },
+          get children() {
+            return web.createComponent(FormBody, {
+              get config() {
+                return props.config.config;
+              },
+              onSubmit: (data, label) => props.onSubmit({
+                type: "form",
+                value: data,
+                label
+              })
+            });
+          }
+        })];
+      }
+    }));
+    web.effect(() => web.setAttribute(_el$, "aria-label", props.config.title));
+    web.runHydrationEvents();
+    return _el$;
+  })();
+};
+const ChoiceBody = (props) => {
+  const layoutClass = () => {
+    switch (props.config.layout) {
+      case "vertical":
+        return "flex flex-col gap-2";
+      case "grid":
+        return "grid grid-cols-2 gap-2";
+      default:
+        return "flex flex-wrap gap-2";
+    }
+  };
+  return (() => {
+    var _el$6 = web.getNextElement(_tmpl$2);
+    web.insert(_el$6, web.createComponent(solidJs.For, {
+      get each() {
+        return props.config.options;
+      },
+      children: (option) => (() => {
+        var _el$7 = web.getNextElement(_tmpl$5), _el$0 = _el$7.firstChild, [_el$1, _co$] = web.getNextMarker(_el$0.nextSibling), _el$10 = _el$1.nextSibling, [_el$11, _co$2] = web.getNextMarker(_el$10.nextSibling), _el$12 = _el$11.nextSibling, [_el$13, _co$3] = web.getNextMarker(_el$12.nextSibling);
+        _el$7.$$click = () => props.onSelect(option.value, option.label);
+        web.insert(_el$7, web.createComponent(solidJs.Show, {
+          get when() {
+            return option.icon;
+          },
+          get children() {
+            var _el$8 = web.getNextElement(_tmpl$3);
+            web.insert(_el$8, () => option.icon);
+            return _el$8;
+          }
+        }), _el$1, _co$);
+        web.insert(_el$7, () => option.label, _el$11, _co$2);
+        web.insert(_el$7, web.createComponent(solidJs.Show, {
+          get when() {
+            return option.description;
+          },
+          get children() {
+            var _el$9 = web.getNextElement(_tmpl$4);
+            web.insert(_el$9, () => option.description);
+            return _el$9;
+          }
+        }), _el$13, _co$3);
+        web.runHydrationEvents();
+        return _el$7;
+      })()
+    }));
+    web.effect(() => web.className(_el$6, layoutClass()));
+    return _el$6;
+  })();
+};
+const ConfirmBody = (props) => {
+  const isDanger = () => props.config.variant === "danger";
+  return (() => {
+    var _el$14 = web.getNextElement(_tmpl$7), _el$19 = _el$14.firstChild, [_el$20, _co$4] = web.getNextMarker(_el$19.nextSibling), _el$16 = _el$20.nextSibling, _el$17 = _el$16.firstChild, _el$18 = _el$17.nextSibling;
+    web.insert(_el$14, web.createComponent(solidJs.Show, {
+      get when() {
+        return props.config.message;
+      },
+      get children() {
+        var _el$15 = web.getNextElement(_tmpl$6);
+        web.insert(_el$15, () => props.config.message);
+        return _el$15;
+      }
+    }), _el$20, _co$4);
+    web.addEventListener(_el$17, "click", props.onCancel, true);
+    web.insert(_el$17, () => props.config.cancelLabel || "Cancel");
+    web.addEventListener(_el$18, "click", props.onConfirm, true);
+    web.insert(_el$18, () => props.config.confirmLabel || "Confirm");
+    web.effect(() => web.className(_el$18, `px-4 py-2 text-sm font-medium rounded-lg text-white transition-colors ${isDanger() ? "bg-red-600 hover:bg-red-700" : "bg-blue-600 hover:bg-blue-700"}`));
+    web.runHydrationEvents();
+    return _el$14;
+  })();
+};
+const FormBody = (props) => {
+  const [formData, setFormData] = solidJs.createSignal({});
+  const updateField = (name, value) => {
+    setFormData((prev) => ({
+      ...prev,
+      [name]: value
+    }));
+  };
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    const data = formData();
+    const label = Object.entries(data).filter(([, v]) => v).map(([k, v]) => `${k}: ${v}`).join(", ");
+    props.onSubmit(data, label || "Form submitted");
+  };
+  const isValid = () => {
+    const data = formData();
+    return (props.config.fields || []).filter((f) => f.required).every((f) => {
+      var _a;
+      return (_a = data[f.name]) == null ? void 0 : _a.trim();
+    });
+  };
+  return (() => {
+    var _el$21 = web.getNextElement(_tmpl$8), _el$24 = _el$21.firstChild, [_el$25, _co$5] = web.getNextMarker(_el$24.nextSibling), _el$22 = _el$25.nextSibling, _el$23 = _el$22.firstChild;
+    _el$21.addEventListener("submit", handleSubmit);
+    web.insert(_el$21, web.createComponent(solidJs.For, {
+      get each() {
+        return props.config.fields;
+      },
+      children: (field) => (() => {
+        var _el$26 = web.getNextElement(_tmpl$11), _el$27 = _el$26.firstChild, _el$29 = _el$27.firstChild, [_el$30, _co$6] = web.getNextMarker(_el$29.nextSibling), _el$31 = _el$30.nextSibling, [_el$32, _co$7] = web.getNextMarker(_el$31.nextSibling), _el$39 = _el$27.nextSibling, [_el$40, _co$9] = web.getNextMarker(_el$39.nextSibling);
+        web.insert(_el$27, () => field.label, _el$30, _co$6);
+        web.insert(_el$27, web.createComponent(solidJs.Show, {
+          get when() {
+            return field.required;
+          },
+          get children() {
+            return web.getNextElement(_tmpl$9);
+          }
+        }), _el$32, _co$7);
+        web.insert(_el$26, web.createComponent(solidJs.Switch, {
+          get children() {
+            return [web.createComponent(solidJs.Match, {
+              get when() {
+                return field.type === "textarea";
+              },
+              get children() {
+                var _el$33 = web.getNextElement(_tmpl$0);
+                _el$33.$$input = (e) => updateField(field.name, e.currentTarget.value);
+                web.effect(() => web.setAttribute(_el$33, "placeholder", field.placeholder));
+                web.effect(() => web.setProperty(_el$33, "value", formData()[field.name] || ""));
+                web.runHydrationEvents();
+                return _el$33;
+              }
+            }), web.createComponent(solidJs.Match, {
+              get when() {
+                return field.type === "select";
+              },
+              get children() {
+                var _el$34 = web.getNextElement(_tmpl$1), _el$35 = _el$34.firstChild, _el$36 = _el$35.nextSibling, [_el$37, _co$8] = web.getNextMarker(_el$36.nextSibling);
+                _el$34.addEventListener("change", (e) => updateField(field.name, e.currentTarget.value));
+                web.insert(_el$35, () => field.placeholder || "Select...");
+                web.insert(_el$34, web.createComponent(solidJs.For, {
+                  get each() {
+                    return field.options;
+                  },
+                  children: (opt) => (() => {
+                    var _el$41 = web.getNextElement(_tmpl$12);
+                    web.insert(_el$41, () => opt.label);
+                    web.effect(() => web.setProperty(_el$41, "value", opt.value));
+                    return _el$41;
+                  })()
+                }), _el$37, _co$8);
+                web.effect(() => web.setProperty(_el$34, "value", formData()[field.name] || ""));
+                return _el$34;
+              }
+            }), web.createComponent(solidJs.Match, {
+              when: true,
+              get children() {
+                var _el$38 = web.getNextElement(_tmpl$10);
+                _el$38.$$input = (e) => updateField(field.name, e.currentTarget.value);
+                web.effect((_p$) => {
+                  var _v$ = field.type === "number" ? "number" : "text", _v$2 = field.placeholder;
+                  _v$ !== _p$.e && web.setAttribute(_el$38, "type", _p$.e = _v$);
+                  _v$2 !== _p$.t && web.setAttribute(_el$38, "placeholder", _p$.t = _v$2);
+                  return _p$;
+                }, {
+                  e: void 0,
+                  t: void 0
+                });
+                web.effect(() => web.setProperty(_el$38, "value", formData()[field.name] || ""));
+                web.runHydrationEvents();
+                return _el$38;
+              }
+            })];
+          }
+        }), _el$40, _co$9);
+        return _el$26;
+      })()
+    }), _el$25, _co$5);
+    web.insert(_el$23, () => props.config.submitLabel || "Submit");
+    web.effect(() => web.setProperty(_el$23, "disabled", !isValid()));
+    return _el$21;
+  })();
+};
+web.delegateEvents(["click", "input"]);
+exports.ChatPrompt = ChatPrompt;
+//# sourceMappingURL=ChatPrompt.cjs.map

package/dist/components/ChatPrompt.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatPrompt.cjs","sources":["../../src/components/ChatPrompt.tsx"],"sourcesContent":["/**\n * ChatPrompt — Ephemeral structured interaction above chat input\n * v2.4.0: choice, confirm, form subtypes\n *\n * @experimental — This component may change without major bump until v2.5.0.\n *\n * Renders above the chat input. User responds → Promise resolves → prompt disappears.\n * Supports AbortSignal for cleanup on navigation (C4).\n */\n\nimport { Component, Show, For, createSignal, onCleanup, Switch, Match } from 'solid-js'\nimport type {\n  ChatPromptConfig,\n  ChatPromptResponse,\n  ChoicePromptConfig,\n  ConfirmPromptConfig,\n  FormPromptConfig,\n} from '../types/chat-bus'\n\nexport interface ChatPromptProps {\n  /** Prompt configuration */\n  config: ChatPromptConfig\n  /** Called when user responds */\n  onSubmit: (response: ChatPromptResponse) => void\n  /** Called when user dismisses */\n  onDismiss?: () => void\n}\n\n/**\n * @experimental\n * Ephemeral interaction component — choice buttons, confirmation dialog, or quick form.\n * Designed to sit between the chat messages and the input area.\n *\n * @example\n * <ChatPrompt\n *   config={{ type: 'choice', title: 'Format?', config: { options: [...] } }}\n *   onSubmit={(r) => bus.events.emit('onChatPromptResponse', { streamKey, response: r })}\n *   onDismiss={() => setActivePrompt(null)}\n * />\n */\nexport const ChatPrompt: Component<ChatPromptProps> = (props) => {\n  return (\n    <div\n      class=\"w-full max-w-2xl mx-auto mb-2 bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 shadow-lg overflow-hidden\"\n      style={{ animation: 'chat-prompt-slide-up 0.2s ease-out' }}\n      role=\"dialog\"\n      aria-label={props.config.title}\n    >\n      {/* Header */}\n      <div class=\"flex items-center justify-between px-4 py-2.5 border-b border-gray-100 dark:border-gray-700\">\n        <p class=\"text-sm font-medium text-gray-900 dark:text-white\">{props.config.title}</p>\n        <button\n          onClick={() => {\n            props.onDismiss?.()\n            props.onSubmit({ type: props.config.type, value: '', label: '', dismissed: true })\n          }}\n          class=\"p-1 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n          aria-label=\"Dismiss\"\n        >\n          <svg class=\"w-4 h-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n          </svg>\n        </button>\n      </div>\n\n      {/* Body — type-specific */}\n      <div class=\"px-4 py-3\">\n        <Switch>\n          <Match when={props.config.type === 'choice'}>\n            <ChoiceBody\n              config={props.config.config as ChoicePromptConfig}\n              onSelect={(value, label) => props.onSubmit({ type: 'choice', value, label })}\n            />\n          </Match>\n          <Match when={props.config.type === 'confirm'}>\n            <ConfirmBody\n              config={props.config.config as ConfirmPromptConfig}\n              onConfirm={() => props.onSubmit({ type: 'confirm', value: 'confirmed', label: (props.config.config as ConfirmPromptConfig).confirmLabel || 'Confirmed' })}\n              onCancel={() => {\n                props.onDismiss?.()\n                props.onSubmit({ type: 'confirm', value: 'cancelled', label: (props.config.config as ConfirmPromptConfig).cancelLabel || 'Cancelled', dismissed: true })\n              }}\n            />\n          </Match>\n          <Match when={props.config.type === 'form'}>\n            <FormBody\n              config={props.config.config as FormPromptConfig}\n              onSubmit={(data, label) => props.onSubmit({ type: 'form', value: data, label })}\n            />\n          </Match>\n        </Switch>\n      </div>\n\n      <style>{`\n        @keyframes chat-prompt-slide-up {\n          from { opacity: 0; transform: translateY(8px); }\n          to { opacity: 1; transform: translateY(0); }\n        }\n      `}</style>\n    </div>\n  )\n}\n\n// ─── Choice ──────────────────────────────────────────────────\n\nconst ChoiceBody: Component<{\n  config: ChoicePromptConfig\n  onSelect: (value: string, label: string) => void\n}> = (props) => {\n  const layoutClass = () => {\n    switch (props.config.layout) {\n      case 'vertical': return 'flex flex-col gap-2'\n      case 'grid': return 'grid grid-cols-2 gap-2'\n      default: return 'flex flex-wrap gap-2'\n    }\n  }\n\n  return (\n    <div class={layoutClass()}>\n      <For each={props.config.options}>\n        {(option) => (\n          <button\n            onClick={() => props.onSelect(option.value, option.label)}\n            class=\"px-4 py-2 text-sm font-medium rounded-lg border border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-700 text-gray-900 dark:text-white hover:bg-blue-50 hover:border-blue-300 dark:hover:bg-blue-900/30 dark:hover:border-blue-600 transition-colors text-left\"\n          >\n            <Show when={option.icon}>\n              <span class=\"mr-2\">{option.icon}</span>\n            </Show>\n            {option.label}\n            <Show when={option.description}>\n              <span class=\"block text-xs text-gray-500 dark:text-gray-400 mt-0.5 font-normal\">{option.description}</span>\n            </Show>\n          </button>\n        )}\n      </For>\n    </div>\n  )\n}\n\n// ─── Confirm ─────────────────────────────────────────────────\n\nconst ConfirmBody: Component<{\n  config: ConfirmPromptConfig\n  onConfirm: () => void\n  onCancel: () => void\n}> = (props) => {\n  const isDanger = () => props.config.variant === 'danger'\n\n  return (\n    <div>\n      <Show when={props.config.message}>\n        <p class=\"text-sm text-gray-600 dark:text-gray-400 mb-3\">{props.config.message}</p>\n      </Show>\n      <div class=\"flex gap-2 justify-end\">\n        <button\n          onClick={props.onCancel}\n          class=\"px-4 py-2 text-sm font-medium rounded-lg border border-gray-200 dark:border-gray-600 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n        >\n          {props.config.cancelLabel || 'Cancel'}\n        </button>\n        <button\n          onClick={props.onConfirm}\n          class={`px-4 py-2 text-sm font-medium rounded-lg text-white transition-colors ${\n            isDanger()\n              ? 'bg-red-600 hover:bg-red-700'\n              : 'bg-blue-600 hover:bg-blue-700'\n          }`}\n        >\n          {props.config.confirmLabel || 'Confirm'}\n        </button>\n      </div>\n    </div>\n  )\n}\n\n// ─── Form ────────────────────────────────────────────────────\n\nconst FormBody: Component<{\n  config: FormPromptConfig\n  onSubmit: (data: Record<string, unknown>, label: string) => void\n}> = (props) => {\n  const [formData, setFormData] = createSignal<Record<string, string>>({})\n\n  const updateField = (name: string, value: string) => {\n    setFormData((prev) => ({ ...prev, [name]: value }))\n  }\n\n  const handleSubmit = (e: Event) => {\n    e.preventDefault()\n    const data = formData()\n    // Build a human-readable label from the form values\n    const label = Object.entries(data)\n      .filter(([, v]) => v)\n      .map(([k, v]) => `${k}: ${v}`)\n      .join(', ')\n    props.onSubmit(data, label || 'Form submitted')\n  }\n\n  const isValid = () => {\n    const data = formData()\n    return (props.config.fields || [])\n      .filter((f) => f.required)\n      .every((f) => data[f.name]?.trim())\n  }\n\n  return (\n    <form onSubmit={handleSubmit} class=\"flex flex-col gap-3\">\n      <For each={props.config.fields}>\n        {(field) => (\n          <div>\n            <label class=\"block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1\">\n              {field.label}\n              <Show when={field.required}>\n                <span class=\"text-red-500 ml-0.5\">*</span>\n              </Show>\n            </label>\n            <Switch>\n              <Match when={field.type === 'textarea'}>\n                <textarea\n                  value={formData()[field.name] || ''}\n                  onInput={(e) => updateField(field.name, e.currentTarget.value)}\n                  placeholder={field.placeholder}\n                  rows={3}\n                  class=\"w-full px-3 py-2 text-sm rounded-lg border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none transition-colors\"\n                />\n              </Match>\n              <Match when={field.type === 'select'}>\n                <select\n                  value={formData()[field.name] || ''}\n                  onChange={(e) => updateField(field.name, e.currentTarget.value)}\n                  class=\"w-full px-3 py-2 text-sm rounded-lg border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none transition-colors\"\n                >\n                  <option value=\"\">{field.placeholder || 'Select...'}</option>\n                  <For each={field.options}>\n                    {(opt) => <option value={opt.value}>{opt.label}</option>}\n                  </For>\n                </select>\n              </Match>\n              <Match when={true}>\n                <input\n                  type={field.type === 'number' ? 'number' : 'text'}\n                  value={formData()[field.name] || ''}\n                  onInput={(e) => updateField(field.name, e.currentTarget.value)}\n                  placeholder={field.placeholder}\n                  class=\"w-full px-3 py-2 text-sm rounded-lg border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none transition-colors\"\n                />\n              </Match>\n            </Switch>\n          </div>\n        )}\n      </For>\n      <div class=\"flex justify-end\">\n        <button\n          type=\"submit\"\n          disabled={!isValid()}\n          class=\"px-4 py-2 text-sm font-medium rounded-lg text-white bg-blue-600 hover:bg-blue-700 disabled:bg-gray-400 disabled:cursor-not-allowed transition-colors\"\n        >\n          {props.config.submitLabel || 'Submit'}\n        </button>\n      </div>\n    </form>\n  )\n}\n"],"names":["ChatPrompt","props","_el$","_$getNextElement","_tmpl$","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$5","_$insert","config","title","$$click","onDismiss","onSubmit","type","value","label","dismissed","_$createComponent","Switch","children","Match","when","ChoiceBody","onSelect","ConfirmBody","onConfirm","confirmLabel","onCancel","cancelLabel","FormBody","data","_$effect","_$setAttribute","_$runHydrationEvents","layoutClass","layout","_el$6","_tmpl$2","For","each","options","option","_el$7","_tmpl$5","_el$0","_el$1","_co$","_$getNextMarker","_el$10","_el$11","_co$2","_el$12","_el$13","_co$3","Show","icon","_el$8","_tmpl$3","description","_el$9","_tmpl$4","_$className","isDanger","variant","_el$14","_tmpl$7","_el$19","_el$20","_co$4","_el$16","_el$17","_el$18","message","_el$15","_tmpl$6","_$addEventListener","formData","setFormData","createSignal","updateField","name","prev","handleSubmit","e","preventDefault","Object","entries","filter","v","map","k","join","isValid","fields","f","required","every","trim","_el$21","_tmpl$8","_el$24","_el$25","_co$5","_el$22","_el$23","addEventListener","field","_el$26","_tmpl$11","_el$27","_el$29","_el$30","_co$6","_el$31","_el$32","_co$7","_el$39","_el$40","_co$9","_tmpl$9","_el$33","_tmpl$0","$$input","currentTarget","placeholder","_$setProperty","_el$34","_tmpl$1","_el$35","_el$36","_el$37","_co$8","opt","_el$41","_tmpl$12","_el$38","_tmpl$10","_p$","_v$","_v$2","t","undefined","submitLabel","_$delegateEvents"],"mappings":"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"}

package/dist/components/ChatPrompt.d.ts

@@ -0,0 +1,33 @@
+/**
+ * ChatPrompt — Ephemeral structured interaction above chat input
+ * v2.4.0: choice, confirm, form subtypes
+ *
+ * @experimental — This component may change without major bump until v2.5.0.
+ *
+ * Renders above the chat input. User responds → Promise resolves → prompt disappears.
+ * Supports AbortSignal for cleanup on navigation (C4).
+ */
+import { Component } from 'solid-js';
+import type { ChatPromptConfig, ChatPromptResponse } from '../types/chat-bus';
+export interface ChatPromptProps {
+    /** Prompt configuration */
+    config: ChatPromptConfig;
+    /** Called when user responds */
+    onSubmit: (response: ChatPromptResponse) => void;
+    /** Called when user dismisses */
+    onDismiss?: () => void;
+}
+/**
+ * @experimental
+ * Ephemeral interaction component — choice buttons, confirmation dialog, or quick form.
+ * Designed to sit between the chat messages and the input area.
+ *
+ * @example
+ * <ChatPrompt
+ *   config={{ type: 'choice', title: 'Format?', config: { options: [...] } }}
+ *   onSubmit={(r) => bus.events.emit('onChatPromptResponse', { streamKey, response: r })}
+ *   onDismiss={() => setActivePrompt(null)}
+ * />
+ */
+export declare const ChatPrompt: Component<ChatPromptProps>;
+//# sourceMappingURL=ChatPrompt.d.ts.map

package/dist/components/ChatPrompt.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatPrompt.d.ts","sourceRoot":"","sources":["../../src/components/ChatPrompt.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,SAAS,EAAqD,MAAM,UAAU,CAAA;AACvF,OAAO,KAAK,EACV,gBAAgB,EAChB,kBAAkB,EAInB,MAAM,mBAAmB,CAAA;AAE1B,MAAM,WAAW,eAAe;IAC9B,2BAA2B;IAC3B,MAAM,EAAE,gBAAgB,CAAA;IACxB,gCAAgC;IAChC,QAAQ,EAAE,CAAC,QAAQ,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAChD,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,UAAU,EAAE,SAAS,CAAC,eAAe,CA6DjD,CAAA"}

package/dist/components/ChatPrompt.js

@@ -0,0 +1,271 @@
+import { delegateEvents, getNextElement, template, insert, createComponent, effect, setAttribute, runHydrationEvents, getNextMarker, className, addEventListener, setProperty } from "solid-js/web";
+import { Switch, Match, For, Show, createSignal } from "solid-js";
+var _tmpl$ = /* @__PURE__ */ template(`<div class="w-full max-w-2xl mx-auto mb-2 bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 shadow-lg overflow-hidden"role=dialog style="animation:chat-prompt-slide-up 0.2s ease-out"><div class="flex items-center justify-between px-4 py-2.5 border-b border-gray-100 dark:border-gray-700"><p class="text-sm font-medium text-gray-900 dark:text-white"></p><button class="p-1 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"aria-label=Dismiss><svg class="w-4 h-4"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div><div class="px-4 py-3"></div><style>
+        @keyframes chat-prompt-slide-up {
+          from { opacity: 0; transform: translateY(8px); }
+          to { opacity: 1; transform: translateY(0); }
+        }
+      `), _tmpl$2 = /* @__PURE__ */ template(`<div>`), _tmpl$3 = /* @__PURE__ */ template(`<span class=mr-2>`), _tmpl$4 = /* @__PURE__ */ template(`<span class="block text-xs text-gray-500 dark:text-gray-400 mt-0.5 font-normal">`), _tmpl$5 = /* @__PURE__ */ template(`<button class="px-4 py-2 text-sm font-medium rounded-lg border border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-700 text-gray-900 dark:text-white hover:bg-blue-50 hover:border-blue-300 dark:hover:bg-blue-900/30 dark:hover:border-blue-600 transition-colors text-left"><!$><!/><!$><!/><!$><!/>`), _tmpl$6 = /* @__PURE__ */ template(`<p class="text-sm text-gray-600 dark:text-gray-400 mb-3">`), _tmpl$7 = /* @__PURE__ */ template(`<div><!$><!/><div class="flex gap-2 justify-end"><button class="px-4 py-2 text-sm font-medium rounded-lg border border-gray-200 dark:border-gray-600 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"></button><button>`), _tmpl$8 = /* @__PURE__ */ template(`<form class="flex flex-col gap-3"><!$><!/><div class="flex justify-end"><button type=submit class="px-4 py-2 text-sm font-medium rounded-lg text-white bg-blue-600 hover:bg-blue-700 disabled:bg-gray-400 disabled:cursor-not-allowed transition-colors">`), _tmpl$9 = /* @__PURE__ */ template(`<span class="text-red-500 ml-0.5">*`), _tmpl$0 = /* @__PURE__ */ template(`<textarea rows=3 class="w-full px-3 py-2 text-sm rounded-lg border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none transition-colors">`), _tmpl$1 = /* @__PURE__ */ template(`<select class="w-full px-3 py-2 text-sm rounded-lg border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none transition-colors"><option value></option><!$><!/>`), _tmpl$10 = /* @__PURE__ */ template(`<input class="w-full px-3 py-2 text-sm rounded-lg border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 focus:ring-1 focus:ring-blue-400 outline-none transition-colors">`), _tmpl$11 = /* @__PURE__ */ template(`<div><label class="block text-xs font-medium text-gray-600 dark:text-gray-400 mb-1"><!$><!/><!$><!/></label><!$><!/>`), _tmpl$12 = /* @__PURE__ */ template(`<option>`);
+const ChatPrompt = (props) => {
+  return (() => {
+    var _el$ = getNextElement(_tmpl$), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling, _el$5 = _el$2.nextSibling;
+    insert(_el$3, () => props.config.title);
+    _el$4.$$click = () => {
+      var _a;
+      (_a = props.onDismiss) == null ? void 0 : _a.call(props);
+      props.onSubmit({
+        type: props.config.type,
+        value: "",
+        label: "",
+        dismissed: true
+      });
+    };
+    insert(_el$5, createComponent(Switch, {
+      get children() {
+        return [createComponent(Match, {
+          get when() {
+            return props.config.type === "choice";
+          },
+          get children() {
+            return createComponent(ChoiceBody, {
+              get config() {
+                return props.config.config;
+              },
+              onSelect: (value, label) => props.onSubmit({
+                type: "choice",
+                value,
+                label
+              })
+            });
+          }
+        }), createComponent(Match, {
+          get when() {
+            return props.config.type === "confirm";
+          },
+          get children() {
+            return createComponent(ConfirmBody, {
+              get config() {
+                return props.config.config;
+              },
+              onConfirm: () => props.onSubmit({
+                type: "confirm",
+                value: "confirmed",
+                label: props.config.config.confirmLabel || "Confirmed"
+              }),
+              onCancel: () => {
+                var _a;
+                (_a = props.onDismiss) == null ? void 0 : _a.call(props);
+                props.onSubmit({
+                  type: "confirm",
+                  value: "cancelled",
+                  label: props.config.config.cancelLabel || "Cancelled",
+                  dismissed: true
+                });
+              }
+            });
+          }
+        }), createComponent(Match, {
+          get when() {
+            return props.config.type === "form";
+          },
+          get children() {
+            return createComponent(FormBody, {
+              get config() {
+                return props.config.config;
+              },
+              onSubmit: (data, label) => props.onSubmit({
+                type: "form",
+                value: data,
+                label
+              })
+            });
+          }
+        })];
+      }
+    }));
+    effect(() => setAttribute(_el$, "aria-label", props.config.title));
+    runHydrationEvents();
+    return _el$;
+  })();
+};
+const ChoiceBody = (props) => {
+  const layoutClass = () => {
+    switch (props.config.layout) {
+      case "vertical":
+        return "flex flex-col gap-2";
+      case "grid":
+        return "grid grid-cols-2 gap-2";
+      default:
+        return "flex flex-wrap gap-2";
+    }
+  };
+  return (() => {
+    var _el$6 = getNextElement(_tmpl$2);
+    insert(_el$6, createComponent(For, {
+      get each() {
+        return props.config.options;
+      },
+      children: (option) => (() => {
+        var _el$7 = getNextElement(_tmpl$5), _el$0 = _el$7.firstChild, [_el$1, _co$] = getNextMarker(_el$0.nextSibling), _el$10 = _el$1.nextSibling, [_el$11, _co$2] = getNextMarker(_el$10.nextSibling), _el$12 = _el$11.nextSibling, [_el$13, _co$3] = getNextMarker(_el$12.nextSibling);
+        _el$7.$$click = () => props.onSelect(option.value, option.label);
+        insert(_el$7, createComponent(Show, {
+          get when() {
+            return option.icon;
+          },
+          get children() {
+            var _el$8 = getNextElement(_tmpl$3);
+            insert(_el$8, () => option.icon);
+            return _el$8;
+          }
+        }), _el$1, _co$);
+        insert(_el$7, () => option.label, _el$11, _co$2);
+        insert(_el$7, createComponent(Show, {
+          get when() {
+            return option.description;
+          },
+          get children() {
+            var _el$9 = getNextElement(_tmpl$4);
+            insert(_el$9, () => option.description);
+            return _el$9;
+          }
+        }), _el$13, _co$3);
+        runHydrationEvents();
+        return _el$7;
+      })()
+    }));
+    effect(() => className(_el$6, layoutClass()));
+    return _el$6;
+  })();
+};
+const ConfirmBody = (props) => {
+  const isDanger = () => props.config.variant === "danger";
+  return (() => {
+    var _el$14 = getNextElement(_tmpl$7), _el$19 = _el$14.firstChild, [_el$20, _co$4] = getNextMarker(_el$19.nextSibling), _el$16 = _el$20.nextSibling, _el$17 = _el$16.firstChild, _el$18 = _el$17.nextSibling;
+    insert(_el$14, createComponent(Show, {
+      get when() {
+        return props.config.message;
+      },
+      get children() {
+        var _el$15 = getNextElement(_tmpl$6);
+        insert(_el$15, () => props.config.message);
+        return _el$15;
+      }
+    }), _el$20, _co$4);
+    addEventListener(_el$17, "click", props.onCancel, true);
+    insert(_el$17, () => props.config.cancelLabel || "Cancel");
+    addEventListener(_el$18, "click", props.onConfirm, true);
+    insert(_el$18, () => props.config.confirmLabel || "Confirm");
+    effect(() => className(_el$18, `px-4 py-2 text-sm font-medium rounded-lg text-white transition-colors ${isDanger() ? "bg-red-600 hover:bg-red-700" : "bg-blue-600 hover:bg-blue-700"}`));
+    runHydrationEvents();
+    return _el$14;
+  })();
+};
+const FormBody = (props) => {
+  const [formData, setFormData] = createSignal({});
+  const updateField = (name, value) => {
+    setFormData((prev) => ({
+      ...prev,
+      [name]: value
+    }));
+  };
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    const data = formData();
+    const label = Object.entries(data).filter(([, v]) => v).map(([k, v]) => `${k}: ${v}`).join(", ");
+    props.onSubmit(data, label || "Form submitted");
+  };
+  const isValid = () => {
+    const data = formData();
+    return (props.config.fields || []).filter((f) => f.required).every((f) => {
+      var _a;
+      return (_a = data[f.name]) == null ? void 0 : _a.trim();
+    });
+  };
+  return (() => {
+    var _el$21 = getNextElement(_tmpl$8), _el$24 = _el$21.firstChild, [_el$25, _co$5] = getNextMarker(_el$24.nextSibling), _el$22 = _el$25.nextSibling, _el$23 = _el$22.firstChild;
+    _el$21.addEventListener("submit", handleSubmit);
+    insert(_el$21, createComponent(For, {
+      get each() {
+        return props.config.fields;
+      },
+      children: (field) => (() => {
+        var _el$26 = getNextElement(_tmpl$11), _el$27 = _el$26.firstChild, _el$29 = _el$27.firstChild, [_el$30, _co$6] = getNextMarker(_el$29.nextSibling), _el$31 = _el$30.nextSibling, [_el$32, _co$7] = getNextMarker(_el$31.nextSibling), _el$39 = _el$27.nextSibling, [_el$40, _co$9] = getNextMarker(_el$39.nextSibling);
+        insert(_el$27, () => field.label, _el$30, _co$6);
+        insert(_el$27, createComponent(Show, {
+          get when() {
+            return field.required;
+          },
+          get children() {
+            return getNextElement(_tmpl$9);
+          }
+        }), _el$32, _co$7);
+        insert(_el$26, createComponent(Switch, {
+          get children() {
+            return [createComponent(Match, {
+              get when() {
+                return field.type === "textarea";
+              },
+              get children() {
+                var _el$33 = getNextElement(_tmpl$0);
+                _el$33.$$input = (e) => updateField(field.name, e.currentTarget.value);
+                effect(() => setAttribute(_el$33, "placeholder", field.placeholder));
+                effect(() => setProperty(_el$33, "value", formData()[field.name] || ""));
+                runHydrationEvents();
+                return _el$33;
+              }
+            }), createComponent(Match, {
+              get when() {
+                return field.type === "select";
+              },
+              get children() {
+                var _el$34 = getNextElement(_tmpl$1), _el$35 = _el$34.firstChild, _el$36 = _el$35.nextSibling, [_el$37, _co$8] = getNextMarker(_el$36.nextSibling);
+                _el$34.addEventListener("change", (e) => updateField(field.name, e.currentTarget.value));
+                insert(_el$35, () => field.placeholder || "Select...");
+                insert(_el$34, createComponent(For, {
+                  get each() {
+                    return field.options;
+                  },
+                  children: (opt) => (() => {
+                    var _el$41 = getNextElement(_tmpl$12);
+                    insert(_el$41, () => opt.label);
+                    effect(() => setProperty(_el$41, "value", opt.value));
+                    return _el$41;
+                  })()
+                }), _el$37, _co$8);
+                effect(() => setProperty(_el$34, "value", formData()[field.name] || ""));
+                return _el$34;
+              }
+            }), createComponent(Match, {
+              when: true,
+              get children() {
+                var _el$38 = getNextElement(_tmpl$10);
+                _el$38.$$input = (e) => updateField(field.name, e.currentTarget.value);
+                effect((_p$) => {
+                  var _v$ = field.type === "number" ? "number" : "text", _v$2 = field.placeholder;
+                  _v$ !== _p$.e && setAttribute(_el$38, "type", _p$.e = _v$);
+                  _v$2 !== _p$.t && setAttribute(_el$38, "placeholder", _p$.t = _v$2);
+                  return _p$;
+                }, {
+                  e: void 0,
+                  t: void 0
+                });
+                effect(() => setProperty(_el$38, "value", formData()[field.name] || ""));
+                runHydrationEvents();
+                return _el$38;
+              }
+            })];
+          }
+        }), _el$40, _co$9);
+        return _el$26;
+      })()
+    }), _el$25, _co$5);
+    insert(_el$23, () => props.config.submitLabel || "Submit");
+    effect(() => setProperty(_el$23, "disabled", !isValid()));
+    return _el$21;
+  })();
+};
+delegateEvents(["click", "input"]);
+export {
+  ChatPrompt
+};
+//# sourceMappingURL=ChatPrompt.js.map