ghostykit 0.2.0 → 0.2.1

package/README.md

@@ -107,6 +107,7 @@ const ref = useRef<PilotoHandle>(null);
   agentName="Admin assistant"
   welcome="How can I help with your crons?"
   suggestions={["Why did the monitor fail?"]}
+  draft={{ text: "Why did the monitor fail?", key: row.id }} // prefilled + focused, not sent
   context={() => ({ screen: "crons", selected })}            // sent with EVERY turn
   toolVerbs={{ run_cron: { one: "Ran a cron", many: "Ran %n crons", running: "Running the cron…" } }}
   upload={async (file) => ({ url: await myUpload(file) })}

package/dist/chunks/{chunk-KZOMMG2D.js → chunk-D6JXJWYM.js}

@@ -52,8 +52,16 @@ function parse(raw) {
   }
 }
 function defaultHistory(json) {
-  const msgs = json?.messages ?? [];
-  return msgs.filter((m) => typeof m.text === "string").map((m) => ({ role: m.role === "user" ? "user" : "assistant", text: m.text }));
+  const j = json;
+  const turns = (j?.messages ?? []).filter((m) => typeof m.text === "string").map((m) => ({ role: m.role === "user" ? "user" : "assistant", text: m.text }));
+  const permissions = (j?.pending ?? []).filter((p) => typeof p === "object" && p !== null && typeof p.id === "string").map((p) => ({
+    id: p.id,
+    title: String(p.title ?? ""),
+    ...typeof p.tool === "string" ? { tool: p.tool } : {},
+    options: Array.isArray(p.options) ? p.options : [],
+    ...p.expiresAt != null ? { expiresAt: p.expiresAt } : {}
+  }));
+  return { turns, permissions };
 }
 function uuid() {
   const c = globalThis.crypto;
@@ -146,9 +154,9 @@ function createPostStreamTransport(target, options = {}) {
       };
     },
     async history() {
-      if (!historyUrl) return [];
+      if (!historyUrl) return { turns: [] };
       const res = await doFetch(historyUrl, { credentials, headers: { accept: "application/json" } });
-      if (!res.ok) return [];
+      if (!res.ok) return { turns: [] };
       return (opts.parseHistory ?? defaultHistory)(await res.json().catch(() => null));
     },
     async send(input) {

package/dist/chunks/{chunk-XWOGK2HN.js → chunk-O6FCE4CS.js}

@@ -411,6 +411,13 @@ function resolvePermission(prev, id, optionId, resolved, detail, asked) {
   s = { ...s, turns };
   return s;
 }
+function applyHistory(prev, turns, permissions = []) {
+  let s = { ...prev, effects: [] };
+  if (turns.length && !prev.turns.length) s.turns = turns;
+  const fresh = permissions.filter((p) => !prev.permissions.some((q) => q.id === p.id));
+  if (fresh.length) s.permissions = [...prev.permissions, ...fresh];
+  return s.turns === prev.turns && !fresh.length ? prev : s;
+}
 function appendAgentMessages(prev, texts) {
   if (!texts.length) return prev;
   return { ...prev, effects: [], turns: [...prev.turns, ...texts.map((text) => ({ role: "assistant", text, arrived: true }))] };
@@ -643,6 +650,7 @@ export {
   stopTurn,
   dropLastExchange,
   resolvePermission,
+  applyHistory,
   appendAgentMessages,
   reconcileWith,
   lastUserTurn,

package/dist/core/index.d.ts

@@ -1,5 +1,5 @@
 export * from "./types";
-export { RESTART_NOTICE, RESUME_TEXT, appendAgentMessages, beginSend, createPilotState, dropLastExchange, expiryMs, lastUserTurn, reconcileWith, reducePilotEvent, resolvePermission, resumeMode, sendAccepted, sendFailed, sendRejectedBusy, stopTurn, } from "./reducer";
+export { RESTART_NOTICE, RESUME_TEXT, appendAgentMessages, applyHistory, beginSend, createPilotState, dropLastExchange, expiryMs, lastUserTurn, reconcileWith, reducePilotEvent, resolvePermission, resumeMode, sendAccepted, sendFailed, sendRejectedBusy, stopTurn, } from "./reducer";
 export { reconcileTurns } from "./reconcile";
 export { isNarration, narrationToMarkdown, splitNarration } from "./narration";
 export { cleanReplyOption, extractReplyOptions, type ReplyOptions } from "./options";

package/dist/core/index.js

@@ -4,6 +4,7 @@ import {
   TOOL_VERBS_EN,
   TOOL_VERBS_ES,
   appendAgentMessages,
+  applyHistory,
   beginSend,
   cleanReplyOption,
   createPilotState,
@@ -28,7 +29,7 @@ import {
   stopTurn,
   summarizeTools,
   toolName
-} from "../chunks/chunk-XWOGK2HN.js";
+} from "../chunks/chunk-O6FCE4CS.js";
 import {
   applyReferences,
   cleanUserText,
@@ -41,6 +42,7 @@ export {
   TOOL_VERBS_EN,
   TOOL_VERBS_ES,
   appendAgentMessages,
+  applyHistory,
   applyReferences,
   beginSend,
   cleanReplyOption,

package/dist/core/reducer.d.ts

@@ -36,6 +36,11 @@ export declare function dropLastExchange(prev: PilotState): PilotState;
 export declare function resolvePermission(prev: PilotState, id: string, optionId: string, resolved: boolean, detail?: string, 
 /** La tarjeta como estaba al contestarla (el stream pudo retirarla mientras tanto). */
 asked?: PermissionRequest): PilotState;
+/**
+ * El historial guardado (al montar): el hilo, si la pantalla sigue vacía, y las tarjetas de permiso
+ * que siguen abiertas (sin duplicar las que el stream ya trajo).
+ */
+export declare function applyHistory(prev: PilotState, turns: Turn[], permissions?: PermissionRequest[]): PilotState;
 /** Un mensaje del agente que entró fuera de un turno (el remate de los subagentes). */
 export declare function appendAgentMessages(prev: PilotState, texts: string[]): PilotState;
 /** La copia del hilo cambió: trae los mensajes que el usuario mandó desde OTRO cliente. Sólo en reposo. */

package/dist/react/InlineMarkdown.d.ts

@@ -0,0 +1,5 @@
+import { type ReactNode } from "react";
+export declare function renderInline(text: string): ReactNode[];
+export declare function InlineMarkdown({ children }: {
+    children: string;
+}): import("react").JSX.Element;

package/dist/react/Piloto.d.ts

@@ -65,6 +65,14 @@ export interface PilotoProps extends UsePilotOptions {
      * `transport.respondPermission`. Devuelve `{resolved:false}` si ya no estaba abierto.
      */
     onPermission?: PermissionHandler;
+    /**
+     * Una pregunta lista en la caja (sin mandarla) y el foco en ella: al abrir el copiloto desde una
+     * fila («Pídeselo»). Cambiar el texto —o `key`, para repetir el mismo— la vuelve a poner.
+     */
+    draft?: string | {
+        text: string;
+        key?: string | number;
+    } | null;
     /** Referencias controladas (si no, Piloto las guarda; agrégalas con `ref.addReference`). */
     references?: Reference[];
     onReferencesChange?: (refs: Reference[]) => void;

package/dist/react/index.d.ts

@@ -3,6 +3,7 @@ export { usePilot, useSseTransport, type PermissionAnswer, type PermissionHandle
 export { AgentBubble, CopyUserMessage, DeliveryChips, ReplyOptionButtons, TurnFooter, UsageStats, UserBubble, type AgentBubbleProps } from "./Bubble";
 export { AgentSteps, ClawIcon, DEFAULT_TOOL_ICONS, Narration, ToolRow } from "./Steps";
 export { LinkSafetyModal, Markdown } from "./Markdown";
+export { InlineMarkdown, renderInline } from "./InlineMarkdown";
 export { useTextAtPace } from "./TextAtPace";
 export { Composer, ModelPicker, mimeOf, type ComposerProps, type UploadResult } from "./Composer";
 export { ConfirmCard, DecisionLines } from "./ConfirmCard";
@@ -11,4 +12,4 @@ export { ConnectingState, TypingDots, WaitLabel } from "./Status";
 export { PilotoContext, usePiloto, type MarkdownOptions, type PilotIcon, type PilotoConfig, type PilotTheme } from "./context";
 export { STRINGS_EN, STRINGS_ES, type PilotStrings } from "./strings";
 export * from "../core";
-export { PilotHttpError, createPostStreamTransport, createSseTransport, readSse, type PilotListener, type PilotTransport, type PostStreamTransportOptions, type SseTransportOptions, type SubscribeOptions, } from "../transport";
+export { PilotHttpError, createPostStreamTransport, createSseTransport, readSse, type PilotHistory, type PilotListener, type PilotTransport, type PostStreamTransportOptions, type SseTransportOptions, type SubscribeOptions, } from "../transport";

package/dist/react/index.js

@@ -4,6 +4,7 @@ import {
   TOOL_VERBS_EN,
   TOOL_VERBS_ES,
   appendAgentMessages,
+  applyHistory,
   beginSend,
   cleanReplyOption,
   createPilotState,
@@ -28,13 +29,13 @@ import {
   stopTurn,
   summarizeTools,
   toolName
-} from "../chunks/chunk-XWOGK2HN.js";
+} from "../chunks/chunk-O6FCE4CS.js";
 import {
   PilotHttpError,
   createPostStreamTransport,
   createSseTransport,
   readSse
-} from "../chunks/chunk-KZOMMG2D.js";
+} from "../chunks/chunk-D6JXJWYM.js";
 import {
   applyReferences,
   cleanUserText,
@@ -1312,14 +1313,46 @@ function Markdown({ children, animate = false, className }) {
 
 // src/react/Steps.tsx
 import { useState as useState4 } from "react";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+
+// src/react/InlineMarkdown.tsx
+import { Fragment as Fragment2 } from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var TOKEN = /(`[^`\n]+`)|(\*\*[^*\n]+\*\*|__[^_\n]+__)|(\*[^*\s][^*\n]*\*|_[^_\s][^_\n]*_)|(\[[^\]\n]+\]\(https?:\/\/[^)\s]+\))/g;
+function renderInline(text) {
+  const out = [];
+  let last = 0;
+  let k = 0;
+  for (const m of text.matchAll(TOKEN)) {
+    const at = m.index ?? 0;
+    if (at > last) out.push(text.slice(last, at));
+    const t = m[0];
+    if (m[1]) out.push(/* @__PURE__ */ jsx4("code", { children: t.slice(1, -1) }, k++));
+    else if (m[2]) out.push(/* @__PURE__ */ jsx4("strong", { children: renderInline(t.slice(2, -2)) }, k++));
+    else if (m[3]) out.push(/* @__PURE__ */ jsx4("em", { children: renderInline(t.slice(1, -1)) }, k++));
+    else {
+      const [, label, href] = /^\[([^\]]+)\]\(([^)]+)\)$/.exec(t) ?? [];
+      out.push(
+        /* @__PURE__ */ jsx4("a", { href, target: "_blank", rel: "noopener noreferrer", children: label }, k++)
+      );
+    }
+    last = at + t.length;
+  }
+  if (last < text.length) out.push(text.slice(last));
+  return out;
+}
+function InlineMarkdown({ children }) {
+  return /* @__PURE__ */ jsx4(Fragment2, { children: renderInline(children) });
+}
+
+// src/react/Steps.tsx
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
 function ClawIcon({ className }) {
-  return /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.2, strokeLinecap: "round", strokeLinejoin: "round", className: `piloto-claw ${className ?? ""}`, "aria-hidden": "true", children: /* @__PURE__ */ jsxs3("g", { className: "piloto-claw-rig", children: [
-    /* @__PURE__ */ jsx4("path", { d: "M12 2v4" }),
-    /* @__PURE__ */ jsx4("rect", { x: "8.5", y: "6", width: "7", height: "3.5", rx: "1" }),
-    /* @__PURE__ */ jsx4("g", { className: "piloto-claw-l", children: /* @__PURE__ */ jsx4("path", { d: "M9.5 9.5 6 14l2 4.5" }) }),
-    /* @__PURE__ */ jsx4("g", { className: "piloto-claw-r", children: /* @__PURE__ */ jsx4("path", { d: "M14.5 9.5 18 14l-2 4.5" }) }),
-    /* @__PURE__ */ jsx4("path", { d: "M12 9.5v4" })
+  return /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.2, strokeLinecap: "round", strokeLinejoin: "round", className: `piloto-claw ${className ?? ""}`, "aria-hidden": "true", children: /* @__PURE__ */ jsxs3("g", { className: "piloto-claw-rig", children: [
+    /* @__PURE__ */ jsx5("path", { d: "M12 2v4" }),
+    /* @__PURE__ */ jsx5("rect", { x: "8.5", y: "6", width: "7", height: "3.5", rx: "1" }),
+    /* @__PURE__ */ jsx5("g", { className: "piloto-claw-l", children: /* @__PURE__ */ jsx5("path", { d: "M9.5 9.5 6 14l2 4.5" }) }),
+    /* @__PURE__ */ jsx5("g", { className: "piloto-claw-r", children: /* @__PURE__ */ jsx5("path", { d: "M14.5 9.5 18 14l-2 4.5" }) }),
+    /* @__PURE__ */ jsx5("path", { d: "M12 9.5v4" })
   ] }) });
 }
 var DEFAULT_TOOL_ICONS = {
@@ -1369,8 +1402,8 @@ function AgentSteps({ tools, live }) {
   const shown = groups.slice(-VISIBLE);
   const hidden = groups.length - shown.length;
   return /* @__PURE__ */ jsxs3("div", { className: "piloto-steps mb-3 rounded-(--piloto-radius-card) px-3 py-2.5 transition-[background-color,border-color] duration-300", "data-live": live || void 0, children: [
-    /* @__PURE__ */ jsx4("button", { type: "button", onClick: () => setOpen((v) => !v), "aria-expanded": open, title: open ? t.stepsCollapse : t.stepsExpand, className: "block w-full cursor-pointer text-left", children: open ? /* @__PURE__ */ jsxs3("span", { className: "flex items-center gap-1.5 text-xs font-medium text-text-primary", children: [
-      /* @__PURE__ */ jsx4(ChevronRight, { className: "h-3.5 w-3.5 shrink-0 rotate-90 text-text-tertiary" }),
+    /* @__PURE__ */ jsx5("button", { type: "button", onClick: () => setOpen((v) => !v), "aria-expanded": open, title: open ? t.stepsCollapse : t.stepsExpand, className: "block w-full cursor-pointer text-left", children: open ? /* @__PURE__ */ jsxs3("span", { className: "flex items-center gap-1.5 text-xs font-medium text-text-primary", children: [
+      /* @__PURE__ */ jsx5(ChevronRight, { className: "h-3.5 w-3.5 shrink-0 rotate-90 text-text-tertiary" }),
       /* @__PURE__ */ jsxs3("span", { className: "truncate", children: [
         summarizeTools(tools, toolVerbs),
         failed > 0 && /* @__PURE__ */ jsxs3("span", { className: "text-text-danger", children: [
@@ -1379,10 +1412,10 @@ function AgentSteps({ tools, live }) {
         ] })
       ] })
     ] }) : /* @__PURE__ */ jsxs3("ul", { className: "flex flex-col gap-1.5", children: [
-      hidden > 0 && /* @__PURE__ */ jsx4("li", { className: "text-[11px] font-medium text-text-tertiary", children: t.earlierSteps(hidden) }),
-      shown.map((g) => /* @__PURE__ */ jsx4(StepLine, { tool: g.tool, times: g.times, live }, g.tool.id))
+      hidden > 0 && /* @__PURE__ */ jsx5("li", { className: "text-[11px] font-medium text-text-tertiary", children: t.earlierSteps(hidden) }),
+      shown.map((g) => /* @__PURE__ */ jsx5(StepLine, { tool: g.tool, times: g.times, live }, g.tool.id))
     ] }) }),
-    open && /* @__PURE__ */ jsx4("ul", { className: "mt-2 flex flex-col gap-1", children: tools.map((x) => /* @__PURE__ */ jsx4(ToolRow, { tool: x }, x.id)) })
+    open && /* @__PURE__ */ jsx5("ul", { className: "mt-2 flex flex-col gap-1", children: tools.map((x) => /* @__PURE__ */ jsx5(ToolRow, { tool: x }, x.id)) })
   ] });
 }
 function StepLine({ tool, times, live }) {
@@ -1391,11 +1424,11 @@ function StepLine({ tool, times, live }) {
   const spins = isRunning(tool) && live;
   const label = stepLabel(tool, toolVerbs, t.step);
   return /* @__PURE__ */ jsxs3("li", { className: "piloto-step flex min-w-0 items-center gap-2 text-[13px] leading-6 text-text-secondary", children: [
-    /* @__PURE__ */ jsx4("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center", "aria-label": spins ? t.running : tool.status === "failed" ? t.failed : t.done, children: spins ? /* @__PURE__ */ jsx4(LoaderCircle, { className: "h-4 w-4 animate-spin text-text-info" }) : tool.status === "failed" ? /* @__PURE__ */ jsx4(CircleX, { className: "h-4 w-4 text-text-danger" }) : /* @__PURE__ */ jsx4(CircleCheck, { className: "h-4 w-4 text-text-success" }) }),
-    /* @__PURE__ */ jsx4(Icon2, { className: "h-[22px] w-[22px] shrink-0 text-text-secondary" }),
+    /* @__PURE__ */ jsx5("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center", "aria-label": spins ? t.running : tool.status === "failed" ? t.failed : t.done, children: spins ? /* @__PURE__ */ jsx5(LoaderCircle, { className: "h-4 w-4 animate-spin text-text-info" }) : tool.status === "failed" ? /* @__PURE__ */ jsx5(CircleX, { className: "h-4 w-4 text-text-danger" }) : /* @__PURE__ */ jsx5(CircleCheck, { className: "h-4 w-4 text-text-success" }) }),
+    /* @__PURE__ */ jsx5(Icon2, { className: "h-[22px] w-[22px] shrink-0 text-text-secondary" }),
     /* @__PURE__ */ jsxs3("span", { className: "min-w-0 truncate", children: [
-      /* @__PURE__ */ jsx4("span", { className: spins ? "text-text-primary" : void 0, children: label }),
-      tool.detail && /* @__PURE__ */ jsx4("span", { className: "piloto-step-detail", children: tool.detail }),
+      /* @__PURE__ */ jsx5("span", { className: spins ? "text-text-primary" : void 0, children: label }),
+      tool.detail && /* @__PURE__ */ jsx5("span", { className: "piloto-step-detail", children: tool.detail }),
       times > 1 && /* @__PURE__ */ jsxs3("span", { className: "ml-1 tabular-nums text-text-tertiary", children: [
         "\xD7",
         times
@@ -1414,30 +1447,30 @@ function ToolRow({ tool }) {
   const s = STATUS[tool.status ?? "pending"] ?? STATUS.pending;
   const KindIcon = iconFor(tool, toolIcons);
   return /* @__PURE__ */ jsxs3("li", { className: "piloto-tool-row flex items-start gap-2.5 rounded-(--piloto-radius-input) border border-border-secondary bg-background-secondary/50 px-3 py-2 transition-colors hover:border-border-primary hover:bg-background-secondary", children: [
-    /* @__PURE__ */ jsx4("span", { className: "mt-px flex h-6 w-6 shrink-0 items-center justify-center rounded-md bg-background-primary text-text-secondary shadow-sm", children: /* @__PURE__ */ jsx4(KindIcon, { className: "h-3.5 w-3.5" }) }),
+    /* @__PURE__ */ jsx5("span", { className: "mt-px flex h-6 w-6 shrink-0 items-center justify-center rounded-md bg-background-primary text-text-secondary shadow-sm", children: /* @__PURE__ */ jsx5(KindIcon, { className: "h-3.5 w-3.5" }) }),
     /* @__PURE__ */ jsxs3("span", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ jsx4("span", { className: "block min-w-0 truncate text-xs font-medium text-text-primary", children: stepLabel(tool, toolVerbs, tool.id) }),
-      tool.detail && /* @__PURE__ */ jsx4("span", { className: "mt-0.5 block truncate text-[11px] text-text-tertiary", children: tool.detail }),
-      tool.path && /* @__PURE__ */ jsx4("span", { className: "mt-0.5 block truncate font-mono text-[10px] text-text-tertiary", children: tool.path })
+      /* @__PURE__ */ jsx5("span", { className: "block min-w-0 truncate text-xs font-medium text-text-primary", children: stepLabel(tool, toolVerbs, tool.id) }),
+      tool.detail && /* @__PURE__ */ jsx5("span", { className: "mt-0.5 block truncate text-[11px] text-text-tertiary", children: tool.detail }),
+      tool.path && /* @__PURE__ */ jsx5("span", { className: "mt-0.5 block truncate font-mono text-[10px] text-text-tertiary", children: tool.path })
     ] }),
-    /* @__PURE__ */ jsx4("span", { className: "mt-0.5 shrink-0", title: t[s.key], "aria-label": t[s.key], children: /* @__PURE__ */ jsx4(s.Icon, { className: `h-3.5 w-3.5 ${s.className}` }) })
+    /* @__PURE__ */ jsx5("span", { className: "mt-0.5 shrink-0", title: t[s.key], "aria-label": t[s.key], children: /* @__PURE__ */ jsx5(s.Icon, { className: `h-3.5 w-3.5 ${s.className}` }) })
   ] });
 }
 function Narration({ steps, children }) {
   return /* @__PURE__ */ jsxs3("ul", { className: "piloto-narration mb-3 flex flex-col gap-1.5", children: [
     steps.map((p, i) => /* @__PURE__ */ jsxs3("li", { className: "piloto-fade-up flex items-start gap-2 text-text-secondary", children: [
-      /* @__PURE__ */ jsx4("span", { className: "mt-[3px] grid size-4 shrink-0 place-items-center rounded-full bg-brand-500/15 text-brand-600", children: /* @__PURE__ */ jsx4(CheckMini, {}) }),
-      /* @__PURE__ */ jsx4("span", { className: "min-w-0", children: p })
+      /* @__PURE__ */ jsx5("span", { className: "mt-[3px] grid size-4 shrink-0 place-items-center rounded-full bg-brand-500/15 text-brand-600", children: /* @__PURE__ */ jsx5(CheckMini, {}) }),
+      /* @__PURE__ */ jsx5("span", { className: "piloto-narration-text min-w-0", children: /* @__PURE__ */ jsx5(InlineMarkdown, { children: p }) })
     ] }, i)),
     children
   ] });
 }
 function CheckMini() {
-  return /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", width: "11", height: "11", fill: "none", stroke: "currentColor", strokeWidth: 3, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx4("path", { d: "M20 6 9 17l-5-5" }) });
+  return /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", width: "11", height: "11", fill: "none", stroke: "currentColor", strokeWidth: 3, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx5("path", { d: "M20 6 9 17l-5-5" }) });
 }
 
 // src/react/Bubble.tsx
-import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 async function copyText(text) {
   try {
     await navigator.clipboard.writeText(text);
@@ -1450,7 +1483,7 @@ function UserBubble({ turn }) {
   const { strings: t, formatUserText } = usePiloto();
   const note = systemNoteOf(turn.text);
   if (note) {
-    return /* @__PURE__ */ jsx5("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs4("span", { className: "piloto-system-note max-w-[80%] truncate rounded-full bg-background-secondary px-3 py-1 text-[11px] text-text-tertiary", children: [
+    return /* @__PURE__ */ jsx6("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs4("span", { className: "piloto-system-note max-w-[80%] truncate rounded-full bg-background-secondary px-3 py-1 text-[11px] text-text-tertiary", children: [
       "\u23F0 ",
       note
     ] }) });
@@ -1464,23 +1497,23 @@ function UserBubble({ turn }) {
       "\u21AA ",
       t.steered
     ] }),
-    docs.length > 0 && /* @__PURE__ */ jsx5("div", { className: "mb-1 flex max-w-[75%] flex-wrap justify-end gap-2", children: docs.map((a, i) => /* @__PURE__ */ jsxs4("span", { className: "piloto-attachment-card inline-flex max-w-[16rem] items-center gap-1.5 rounded-(--piloto-radius-input) border border-border-primary bg-background-primary px-2.5 py-1.5 text-xs text-text-secondary", children: [
-      /* @__PURE__ */ jsx5(FileText, { className: "h-3.5 w-3.5 shrink-0" }),
-      a.uri ? /* @__PURE__ */ jsx5("a", { href: a.uri, target: "_blank", rel: "noopener noreferrer", className: "truncate hover:underline", children: a.name ?? a.mimeType }) : /* @__PURE__ */ jsx5("span", { className: "truncate", children: a.name ?? a.mimeType })
+    docs.length > 0 && /* @__PURE__ */ jsx6("div", { className: "mb-1 flex max-w-[75%] flex-wrap justify-end gap-2", children: docs.map((a, i) => /* @__PURE__ */ jsxs4("span", { className: "piloto-attachment-card inline-flex max-w-[16rem] items-center gap-1.5 rounded-(--piloto-radius-input) border border-border-primary bg-background-primary px-2.5 py-1.5 text-xs text-text-secondary", children: [
+      /* @__PURE__ */ jsx6(FileText, { className: "h-3.5 w-3.5 shrink-0" }),
+      a.uri ? /* @__PURE__ */ jsx6("a", { href: a.uri, target: "_blank", rel: "noopener noreferrer", className: "truncate hover:underline", children: a.name ?? a.mimeType }) : /* @__PURE__ */ jsx6("span", { className: "truncate", children: a.name ?? a.mimeType })
     ] }, i)) }),
     (inBubble.length > 0 || visible.trim()) && /* @__PURE__ */ jsxs4("div", { className: "piloto-bubble-user max-w-[75%] whitespace-pre-wrap break-words rounded-(--piloto-radius-bubble) px-4 py-3 text-[15px] leading-[22px]", children: [
-      inBubble.length > 0 && /* @__PURE__ */ jsx5("div", { className: `flex flex-wrap justify-end gap-1.5 ${visible.trim() ? "mb-2" : ""}`, children: inBubble.map(
-        (a, i) => a.mimeType.startsWith("image/") ? /* @__PURE__ */ jsx5("img", { src: a.data ? `data:${a.mimeType};base64,${a.data}` : a.uri, alt: "", className: "h-20 w-20 rounded-lg object-cover" }, i) : /* @__PURE__ */ jsx5("audio", { src: a.uri, controls: true, preload: "metadata", className: "h-9 max-w-[16rem]" }, i)
+      inBubble.length > 0 && /* @__PURE__ */ jsx6("div", { className: `flex flex-wrap justify-end gap-1.5 ${visible.trim() ? "mb-2" : ""}`, children: inBubble.map(
+        (a, i) => a.mimeType.startsWith("image/") ? /* @__PURE__ */ jsx6("img", { src: a.data ? `data:${a.mimeType};base64,${a.data}` : a.uri, alt: "", className: "h-20 w-20 rounded-lg object-cover" }, i) : /* @__PURE__ */ jsx6("audio", { src: a.uri, controls: true, preload: "metadata", className: "h-9 max-w-[16rem]" }, i)
       ) }),
       visible
     ] }),
-    visible.trim() && /* @__PURE__ */ jsx5(CopyUserMessage, { text: visible })
+    visible.trim() && /* @__PURE__ */ jsx6(CopyUserMessage, { text: visible })
   ] });
 }
 function CopyUserMessage({ text }) {
   const { strings: t } = usePiloto();
   const [copied, setCopied] = useState5(false);
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     "button",
     {
       type: "button",
@@ -1493,20 +1526,20 @@ function CopyUserMessage({ text }) {
       "aria-label": copied ? t.copied : t.copyMessage,
       title: copied ? t.copied : t.copy,
       className: `piloto-copy-user grid h-7 w-7 place-items-center rounded-md text-text-tertiary transition-opacity hover:bg-background-secondary hover:text-text-primary focus-visible:opacity-100 [@media(hover:none)]:opacity-100 ${copied ? "opacity-100" : "opacity-0 group-hover/msg:opacity-100"}`,
-      children: copied ? /* @__PURE__ */ jsx5(Check, { className: "h-3.5 w-3.5 text-text-success" }) : /* @__PURE__ */ jsx5(Copy, { className: "h-3.5 w-3.5" })
+      children: copied ? /* @__PURE__ */ jsx6(Check, { className: "h-3.5 w-3.5 text-text-success" }) : /* @__PURE__ */ jsx6(Copy, { className: "h-3.5 w-3.5" })
     }
   );
 }
 function AnswerText({ text, live, whole = false }) {
   const { visible, animate } = useTextAtPace(text, live, whole);
   if (!visible) return null;
-  return /* @__PURE__ */ jsx5(Markdown, { animate, children: visible });
+  return /* @__PURE__ */ jsx6(Markdown, { animate, children: visible });
 }
 function ReplyOptionButtons({ options, onPick }) {
   const { strings: t } = usePiloto();
-  return /* @__PURE__ */ jsx5("ul", { className: "piloto-options mt-3 flex flex-col gap-2", "aria-label": t.replyOptions, children: options.items.map((item, i) => {
+  return /* @__PURE__ */ jsx6("ul", { className: "piloto-options mt-3 flex flex-col gap-2", "aria-label": t.replyOptions, children: options.items.map((item, i) => {
     const clean = cleanReplyOption(item);
-    return /* @__PURE__ */ jsx5("li", { className: "piloto-chunk-in", children: /* @__PURE__ */ jsxs4(
+    return /* @__PURE__ */ jsx6("li", { className: "piloto-chunk-in", children: /* @__PURE__ */ jsxs4(
       "button",
       {
         type: "button",
@@ -1517,8 +1550,8 @@ function ReplyOptionButtons({ options, onPick }) {
             i + 1,
             "."
           ] }),
-          /* @__PURE__ */ jsx5("span", { className: "min-w-0 flex-1", children: clean }),
-          /* @__PURE__ */ jsx5(ArrowUpRight, { className: "h-4 w-4 shrink-0 text-text-tertiary transition-colors group-hover:text-text-primary" })
+          /* @__PURE__ */ jsx6("span", { className: "min-w-0 flex-1", children: clean }),
+          /* @__PURE__ */ jsx6(ArrowUpRight, { className: "h-4 w-4 shrink-0 text-text-tertiary transition-colors group-hover:text-text-primary" })
         ]
       }
     ) }, i);
@@ -1530,12 +1563,12 @@ function UsageStats({ used, size, cost }) {
   const pct = size > 0 ? Math.min(100, Math.round(used / size * 100)) : 0;
   return /* @__PURE__ */ jsxs4("div", { className: "piloto-usage mt-2 flex items-center gap-4 text-[11px] text-text-tertiary", children: [
     /* @__PURE__ */ jsxs4("span", { className: "flex items-center gap-1", children: [
-      /* @__PURE__ */ jsx5(Gauge, { className: "h-3 w-3" }),
+      /* @__PURE__ */ jsx6(Gauge, { className: "h-3 w-3" }),
       used.toLocaleString(t.numberLocale),
       size > 0 && ` / ${size.toLocaleString(t.numberLocale)} (${pct}%)`
     ] }),
     cost > 0 && /* @__PURE__ */ jsxs4("span", { className: "flex items-center gap-1", children: [
-      /* @__PURE__ */ jsx5(Coins, { className: "h-3 w-3" }),
+      /* @__PURE__ */ jsx6(Coins, { className: "h-3 w-3" }),
       cost.toLocaleString(t.numberLocale, { style: "currency", currency: "USD", maximumFractionDigits: 4 })
     ] })
   ] });
@@ -1544,7 +1577,7 @@ function TurnFooter({ text, seconds, onRetry, showCopy = true }) {
   const { strings: t } = usePiloto();
   const [copied, setCopied] = useState5(false);
   return /* @__PURE__ */ jsxs4("div", { className: "piloto-footer mt-2 flex items-center gap-3 text-xs text-text-tertiary", children: [
-    seconds ? /* @__PURE__ */ jsx5("span", { children: t.worked(seconds) }) : null,
+    seconds ? /* @__PURE__ */ jsx6("span", { children: t.worked(seconds) }) : null,
     showCopy && /* @__PURE__ */ jsxs4(
       "button",
       {
@@ -1557,13 +1590,13 @@ function TurnFooter({ text, seconds, onRetry, showCopy = true }) {
         },
         className: "flex items-center gap-1 transition-colors hover:text-text-primary",
         children: [
-          copied ? /* @__PURE__ */ jsx5(Check, { className: "h-3.5 w-3.5 text-text-success" }) : /* @__PURE__ */ jsx5(Copy, { className: "h-3.5 w-3.5" }),
+          copied ? /* @__PURE__ */ jsx6(Check, { className: "h-3.5 w-3.5 text-text-success" }) : /* @__PURE__ */ jsx6(Copy, { className: "h-3.5 w-3.5" }),
           copied ? t.copied : t.copy
         ]
       }
     ),
     onRetry && /* @__PURE__ */ jsxs4("button", { type: "button", onClick: onRetry, className: "flex items-center gap-1 transition-colors hover:text-text-primary", children: [
-      /* @__PURE__ */ jsx5(RotateCcw, { className: "h-3.5 w-3.5" }),
+      /* @__PURE__ */ jsx6(RotateCcw, { className: "h-3.5 w-3.5" }),
       t.retry
     ] })
   ] });
@@ -1571,9 +1604,9 @@ function TurnFooter({ text, seconds, onRetry, showCopy = true }) {
 function DeliveryChips({ deliveries }) {
   const shown = deliveries.filter((d) => !d.capture);
   if (!shown.length) return null;
-  return /* @__PURE__ */ jsx5("div", { className: "mt-2 flex flex-wrap gap-1.5", children: shown.map((d, i) => /* @__PURE__ */ jsxs4("span", { className: "piloto-delivery inline-flex max-w-[16rem] items-center gap-1.5 rounded-(--piloto-radius-input) border border-border-primary px-2 py-1 text-xs text-text-secondary", children: [
-    /* @__PURE__ */ jsx5(FileText, { className: "h-3.5 w-3.5 shrink-0" }),
-    /* @__PURE__ */ jsx5("span", { className: "truncate", children: d.name })
+  return /* @__PURE__ */ jsx6("div", { className: "mt-2 flex flex-wrap gap-1.5", children: shown.map((d, i) => /* @__PURE__ */ jsxs4("span", { className: "piloto-delivery inline-flex max-w-[16rem] items-center gap-1.5 rounded-(--piloto-radius-input) border border-border-primary px-2 py-1 text-xs text-text-secondary", children: [
+    /* @__PURE__ */ jsx6(FileText, { className: "h-3.5 w-3.5 shrink-0" }),
+    /* @__PURE__ */ jsx6("span", { className: "truncate", children: d.name })
   ] }, i)) });
 }
 function AgentBubble({ turn, live, onRetry, onOption, showUsage = true, showCopy = true, renderDeliveries }) {
@@ -1583,28 +1616,28 @@ function AgentBubble({ turn, live, onRetry, onOption, showUsage = true, showCopy
   const options = onOption && !live && visible ? extractReplyOptions(visible) : null;
   return /* @__PURE__ */ jsxs4("div", { className: "piloto-agent min-w-0 max-w-[92%]", children: [
     turn.thought && /* @__PURE__ */ jsxs4("details", { className: "piloto-thought mb-3 text-xs text-text-secondary", children: [
-      /* @__PURE__ */ jsx5("summary", { className: "cursor-pointer select-none", children: t.thinking }),
-      /* @__PURE__ */ jsx5("p", { className: "mt-2 whitespace-pre-wrap border-l-2 border-border-secondary pl-3", children: turn.thought })
+      /* @__PURE__ */ jsx6("summary", { className: "cursor-pointer select-none", children: t.thinking }),
+      /* @__PURE__ */ jsx6("p", { className: "mt-2 whitespace-pre-wrap border-l-2 border-border-secondary pl-3", children: turn.thought })
     ] }),
-    turn.tools && turn.tools.length > 0 && /* @__PURE__ */ jsx5(AgentSteps, { tools: turn.tools, live }),
-    narrated.steps.length > 0 && /* @__PURE__ */ jsx5(Narration, { steps: narrated.steps }),
-    options ? /* @__PURE__ */ jsxs4(Fragment2, { children: [
-      options.before && /* @__PURE__ */ jsx5(AnswerText, { text: options.before, live }),
-      /* @__PURE__ */ jsx5(ReplyOptionButtons, { options, onPick: onOption })
+    turn.tools && turn.tools.length > 0 && /* @__PURE__ */ jsx6(AgentSteps, { tools: turn.tools, live }),
+    narrated.steps.length > 0 && /* @__PURE__ */ jsx6(Narration, { steps: narrated.steps }),
+    options ? /* @__PURE__ */ jsxs4(Fragment3, { children: [
+      options.before && /* @__PURE__ */ jsx6(AnswerText, { text: options.before, live }),
+      /* @__PURE__ */ jsx6(ReplyOptionButtons, { options, onPick: onOption })
     ] }) : (
       // Cada tramo nuevo tras una herramienta monta su propio ritmo (empieza de cero). Lo que llegó
       // entero fuera de un turno se escribe al mismo ritmo; al recargar ya sale completo.
-      visible && /* @__PURE__ */ jsx5(AnswerText, { text: visible, live: live || !!turn.arrived, whole: !!turn.arrived }, `r${narrated.steps.length}`)
+      visible && /* @__PURE__ */ jsx6(AnswerText, { text: visible, live: live || !!turn.arrived, whole: !!turn.arrived }, `r${narrated.steps.length}`)
     ),
-    renderDeliveries ? renderDeliveries(turn, live) : turn.deliveries?.length ? /* @__PURE__ */ jsx5(DeliveryChips, { deliveries: turn.deliveries }) : null,
-    turn.decisions?.length ? /* @__PURE__ */ jsx5(DecisionLines, { decisions: turn.decisions }) : null,
-    showUsage && turn.usage && /* @__PURE__ */ jsx5(UsageStats, { ...turn.usage }),
-    turn.text && !live && /* @__PURE__ */ jsx5(TurnFooter, { text: turn.text, seconds: turn.seconds, onRetry, showCopy })
+    renderDeliveries ? renderDeliveries(turn, live) : turn.deliveries?.length ? /* @__PURE__ */ jsx6(DeliveryChips, { deliveries: turn.deliveries }) : null,
+    turn.decisions?.length ? /* @__PURE__ */ jsx6(DecisionLines, { decisions: turn.decisions }) : null,
+    showUsage && turn.usage && /* @__PURE__ */ jsx6(UsageStats, { ...turn.usage }),
+    turn.text && !live && /* @__PURE__ */ jsx6(TurnFooter, { text: turn.text, seconds: turn.seconds, onRetry, showCopy })
   ] });
 }
 
 // src/react/Chips.tsx
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 function ReferenceChips({
   references,
   onRemove,
@@ -1612,29 +1645,29 @@ function ReferenceChips({
 }) {
   const { strings: t } = usePiloto();
   if (!references.length) return null;
-  return /* @__PURE__ */ jsx6("div", { className: "piloto-references flex flex-wrap gap-1.5", children: references.map((r) => /* @__PURE__ */ jsxs5("span", { className: "piloto-reference inline-flex max-w-full items-center gap-1.5 rounded-full border py-1 pl-2.5 pr-1 text-xs text-text-primary", children: [
-    /* @__PURE__ */ jsx6(AtSign, { className: "h-3 w-3 shrink-0 text-brand-600" }),
-    /* @__PURE__ */ jsx6("button", { type: "button", onClick: () => onActivate?.(r), className: "shrink-0 font-semibold underline-offset-2 hover:underline", children: r.label }),
+  return /* @__PURE__ */ jsx7("div", { className: "piloto-references flex flex-wrap gap-1.5", children: references.map((r) => /* @__PURE__ */ jsxs5("span", { className: "piloto-reference inline-flex max-w-full items-center gap-1.5 rounded-full border py-1 pl-2.5 pr-1 text-xs text-text-primary", children: [
+    /* @__PURE__ */ jsx7(AtSign, { className: "h-3 w-3 shrink-0 text-brand-600" }),
+    /* @__PURE__ */ jsx7("button", { type: "button", onClick: () => onActivate?.(r), className: "shrink-0 font-semibold underline-offset-2 hover:underline", children: r.label }),
     r.hint && /* @__PURE__ */ jsxs5("span", { className: "truncate text-text-secondary", children: [
       "\xAB",
       r.hint,
       "\xBB"
     ] }),
-    /* @__PURE__ */ jsx6(
+    /* @__PURE__ */ jsx7(
       "button",
       {
         type: "button",
         onClick: () => onRemove(r.id),
         "aria-label": t.removeReference,
         className: "grid size-5 shrink-0 cursor-pointer place-items-center rounded-full text-text-tertiary hover:bg-background-secondary hover:text-text-primary",
-        children: /* @__PURE__ */ jsx6(X, { className: "h-3 w-3" })
+        children: /* @__PURE__ */ jsx7(X, { className: "h-3 w-3" })
       }
     )
   ] }, r.id)) });
 }
 function Suggestions({ items, onPick, onPrefill }) {
   if (!items.length) return null;
-  return /* @__PURE__ */ jsx6("div", { className: "piloto-suggestions mt-3 flex flex-wrap justify-center gap-2", children: items.map((s, i) => /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7("div", { className: "piloto-suggestions mt-3 flex flex-wrap justify-center gap-2", children: items.map((s, i) => /* @__PURE__ */ jsx7(
     "button",
     {
       type: "button",
@@ -1648,7 +1681,7 @@ function Suggestions({ items, onPick, onPrefill }) {
 
 // src/react/Composer.tsx
 import { useCallback, useEffect as useEffect3, useRef as useRef3, useState as useState6 } from "react";
-import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 var MAX_HEIGHT = 240;
 var BY_EXTENSION = {
   png: "image/png",
@@ -1940,13 +1973,13 @@ function Composer({
   };
   const canSend = Boolean(value.trim() || files.length > 0 || references.length > 0);
   const iconButton = "flex h-7 w-7 shrink-0 items-center justify-center rounded-full text-text-secondary transition-colors hover:bg-background-secondary hover:text-text-primary disabled:opacity-30";
-  return /* @__PURE__ */ jsx7("div", { className: "piloto-composer rounded-(--piloto-radius-input)", children: /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2 p-3", children: [
-    withFiles && dragging && /* @__PURE__ */ jsx7("div", { className: "piloto-drop pointer-events-none fixed inset-0 z-[1000] flex items-center justify-center p-6", children: /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center gap-2 rounded-(--piloto-radius-card) border-2 border-dashed border-brand-500 bg-background-primary px-10 py-8 text-center shadow-(--piloto-shadow-card)", children: [
-      /* @__PURE__ */ jsx7(Paperclip, { className: "size-7 text-brand-600" }),
-      /* @__PURE__ */ jsx7("p", { className: "text-base font-semibold text-text-primary", children: t.dropFiles }),
-      /* @__PURE__ */ jsx7("p", { className: "text-xs text-text-secondary", children: t.dropHint })
+  return /* @__PURE__ */ jsx8("div", { className: "piloto-composer rounded-(--piloto-radius-input)", children: /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2 p-3", children: [
+    withFiles && dragging && /* @__PURE__ */ jsx8("div", { className: "piloto-drop pointer-events-none fixed inset-0 z-[1000] flex items-center justify-center p-6", children: /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center gap-2 rounded-(--piloto-radius-card) border-2 border-dashed border-brand-500 bg-background-primary px-10 py-8 text-center shadow-(--piloto-shadow-card)", children: [
+      /* @__PURE__ */ jsx8(Paperclip, { className: "size-7 text-brand-600" }),
+      /* @__PURE__ */ jsx8("p", { className: "text-base font-semibold text-text-primary", children: t.dropFiles }),
+      /* @__PURE__ */ jsx8("p", { className: "text-xs text-text-secondary", children: t.dropHint })
     ] }) }),
-    /* @__PURE__ */ jsx7(
+    /* @__PURE__ */ jsx8(
       "input",
       {
         ref: fileRef,
@@ -1959,36 +1992,36 @@ function Composer({
         }
       }
     ),
-    notice && /* @__PURE__ */ jsx7("p", { className: "text-xs text-text-danger", children: notice }),
+    notice && /* @__PURE__ */ jsx8("p", { className: "text-xs text-text-danger", children: notice }),
     uploading && /* @__PURE__ */ jsxs6("p", { className: "flex items-center gap-1.5 text-xs text-text-secondary", children: [
-      /* @__PURE__ */ jsx7(LoaderCircle, { className: "h-3.5 w-3.5 animate-spin" }),
+      /* @__PURE__ */ jsx8(LoaderCircle, { className: "h-3.5 w-3.5 animate-spin" }),
       files.length > 1 ? t.uploadingN(files.length) : t.uploading
     ] }),
-    files.length > 0 && /* @__PURE__ */ jsx7("div", { className: "flex flex-wrap gap-2", children: files.map((a) => /* @__PURE__ */ jsxs6("div", { className: "relative h-16 w-16 overflow-hidden rounded-lg border border-border-primary bg-background-secondary", children: [
-      mimeOf(a.file).startsWith("image/") ? /* @__PURE__ */ jsx7("img", { src: a.url, alt: a.file.name, className: "h-full w-full object-cover" }) : (
+    files.length > 0 && /* @__PURE__ */ jsx8("div", { className: "flex flex-wrap gap-2", children: files.map((a) => /* @__PURE__ */ jsxs6("div", { className: "relative h-16 w-16 overflow-hidden rounded-lg border border-border-primary bg-background-secondary", children: [
+      mimeOf(a.file).startsWith("image/") ? /* @__PURE__ */ jsx8("img", { src: a.url, alt: a.file.name, className: "h-full w-full object-cover" }) : (
         // Un PDF pintado con <img> es un recuadro roto: nombre, extensión y peso.
         /* @__PURE__ */ jsxs6("span", { className: "flex h-full w-full flex-col items-center justify-center gap-1 px-1 text-center", title: a.file.name, children: [
-          /* @__PURE__ */ jsx7(FileText, { className: "h-4 w-4 shrink-0 text-text-tertiary" }),
-          /* @__PURE__ */ jsx7("span", { className: "w-full truncate text-[9px] font-medium uppercase leading-none text-text-secondary", children: a.file.name.match(/\.([A-Za-z0-9]+)$/)?.[1] ?? "file" }),
-          /* @__PURE__ */ jsx7("span", { className: "w-full truncate text-[9px] leading-none text-text-tertiary", children: shortSize(a.file.size) })
+          /* @__PURE__ */ jsx8(FileText, { className: "h-4 w-4 shrink-0 text-text-tertiary" }),
+          /* @__PURE__ */ jsx8("span", { className: "w-full truncate text-[9px] font-medium uppercase leading-none text-text-secondary", children: a.file.name.match(/\.([A-Za-z0-9]+)$/)?.[1] ?? "file" }),
+          /* @__PURE__ */ jsx8("span", { className: "w-full truncate text-[9px] leading-none text-text-tertiary", children: shortSize(a.file.size) })
         ] })
       ),
-      /* @__PURE__ */ jsx7(
+      /* @__PURE__ */ jsx8(
         "button",
         {
           type: "button",
           onClick: () => removeFile(a.id),
           "aria-label": t.removeAttachment,
           className: "absolute right-0.5 top-0.5 flex h-5 w-5 items-center justify-center rounded-full bg-background-inverse/80 text-text-inverse shadow-sm transition-colors hover:bg-background-inverse",
-          children: /* @__PURE__ */ jsx7(X, { className: "h-3 w-3" })
+          children: /* @__PURE__ */ jsx8(X, { className: "h-3 w-3" })
         }
       )
     ] }, a.id)) }),
-    /* @__PURE__ */ jsx7(ReferenceChips, { references, onRemove: (id) => onRemoveReference?.(id), onActivate: onActivateReference }),
+    /* @__PURE__ */ jsx8(ReferenceChips, { references, onRemove: (id) => onRemoveReference?.(id), onActivate: onActivateReference }),
     recording ? (
       // Grabando: la barra sustituye al campo de texto — punto rojo, reloj, la onda y las dos salidas.
       /* @__PURE__ */ jsxs6("div", { className: "flex min-h-[24px] items-center gap-3 px-1", children: [
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx8(
           "button",
           {
             type: "button",
@@ -1998,19 +2031,19 @@ function Composer({
             },
             "aria-label": t.cancelVoice,
             className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-full text-text-secondary hover:bg-background-secondary hover:text-text-primary",
-            children: /* @__PURE__ */ jsx7(X, { className: "h-4 w-4" })
+            children: /* @__PURE__ */ jsx8(X, { className: "h-4 w-4" })
           }
         ),
-        /* @__PURE__ */ jsx7("span", { className: "piloto-rec-dot h-2 w-2 shrink-0 rounded-full" }),
+        /* @__PURE__ */ jsx8("span", { className: "piloto-rec-dot h-2 w-2 shrink-0 rounded-full" }),
         /* @__PURE__ */ jsxs6("span", { className: "w-10 shrink-0 font-mono text-xs tabular-nums text-text-secondary", children: [
           Math.floor(seconds / 60),
           ":",
           String(seconds % 60).padStart(2, "0")
         ] }),
-        /* @__PURE__ */ jsx7("div", { className: "flex h-6 min-w-0 flex-1 items-center gap-[2px] overflow-hidden", children: Array.from({ length: 60 }, (_, i) => wave[wave.length - 60 + i] ?? 0).map((v, i) => /* @__PURE__ */ jsx7("span", { className: "w-[3px] shrink-0 rounded-full bg-text-secondary/70", style: { height: `${Math.max(3, Math.round(v * 22))}px` } }, i)) }),
-        /* @__PURE__ */ jsx7("button", { type: "button", onClick: toggleRecording, "aria-label": t.stopAndSendVoice, className: "piloto-send flex h-8 w-8 shrink-0 items-center justify-center rounded-full", children: /* @__PURE__ */ jsx7(ArrowUp, { className: "h-4 w-4" }) })
+        /* @__PURE__ */ jsx8("div", { className: "flex h-6 min-w-0 flex-1 items-center gap-[2px] overflow-hidden", children: Array.from({ length: 60 }, (_, i) => wave[wave.length - 60 + i] ?? 0).map((v, i) => /* @__PURE__ */ jsx8("span", { className: "w-[3px] shrink-0 rounded-full bg-text-secondary/70", style: { height: `${Math.max(3, Math.round(v * 22))}px` } }, i)) }),
+        /* @__PURE__ */ jsx8("button", { type: "button", onClick: toggleRecording, "aria-label": t.stopAndSendVoice, className: "piloto-send flex h-8 w-8 shrink-0 items-center justify-center rounded-full", children: /* @__PURE__ */ jsx8(ArrowUp, { className: "h-4 w-4" }) })
       ] })
-    ) : /* @__PURE__ */ jsx7(
+    ) : /* @__PURE__ */ jsx8(
       "textarea",
       {
         ref,
@@ -2032,8 +2065,8 @@ function Composer({
     ),
     /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between gap-2", children: [
       /* @__PURE__ */ jsxs6("div", { className: "flex min-w-0 flex-1 items-center gap-1.5 overflow-hidden", children: [
-        withFiles && /* @__PURE__ */ jsxs6(Fragment3, { children: [
-          /* @__PURE__ */ jsx7(
+        withFiles && /* @__PURE__ */ jsxs6(Fragment4, { children: [
+          /* @__PURE__ */ jsx8(
             "button",
             {
               type: "button",
@@ -2046,10 +2079,10 @@ function Composer({
               "aria-label": canSeeImages ? t.attachImage : t.noImages,
               title: canSeeImages ? t.attachImage : t.noImages,
               className: iconButton,
-              children: /* @__PURE__ */ jsx7(Image, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ jsx8(Image, { className: "h-4 w-4" })
             }
           ),
-          /* @__PURE__ */ jsx7(
+          /* @__PURE__ */ jsx8(
             "button",
             {
               type: "button",
@@ -2062,16 +2095,16 @@ function Composer({
               "aria-label": t.attachFile,
               title: t.attachFile,
               className: iconButton,
-              children: /* @__PURE__ */ jsx7(Paperclip, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ jsx8(Paperclip, { className: "h-4 w-4" })
             }
           )
         ] }),
         extras,
-        models.length > 0 && onModelChange && /* @__PURE__ */ jsx7(ModelPicker, { models, current: currentModel, onChange: onModelChange })
+        models.length > 0 && onModelChange && /* @__PURE__ */ jsx8(ModelPicker, { models, current: currentModel, onChange: onModelChange })
       ] }),
       /* @__PURE__ */ jsxs6("div", { className: "flex shrink-0 items-center gap-1.5", children: [
-        canRecord && !recording && /* @__PURE__ */ jsx7("button", { type: "button", onClick: toggleRecording, disabled: busy || transcribing, "aria-label": t.recordVoice, title: t.voiceNote, className: `${iconButton} h-8 w-8`, children: transcribing ? /* @__PURE__ */ jsx7(LoaderCircle, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx7(Mic, { className: "h-4 w-4" }) }),
-        /* @__PURE__ */ jsx7(
+        canRecord && !recording && /* @__PURE__ */ jsx8("button", { type: "button", onClick: toggleRecording, disabled: busy || transcribing, "aria-label": t.recordVoice, title: t.voiceNote, className: `${iconButton} h-8 w-8`, children: transcribing ? /* @__PURE__ */ jsx8(LoaderCircle, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx8(Mic, { className: "h-4 w-4" }) }),
+        /* @__PURE__ */ jsx8(
           "button",
           {
             type: "button",
@@ -2080,7 +2113,7 @@ function Composer({
             "aria-label": busy ? t.stop : uploading ? t.uploading : t.send,
             "data-ready": busy || canSend || uploading || void 0,
             className: "piloto-send flex h-8 w-8 items-center justify-center rounded-full transition-colors",
-            children: busy ? /* @__PURE__ */ jsx7(Square, { className: "h-3 w-3 fill-current" }) : uploading ? /* @__PURE__ */ jsx7(LoaderCircle, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx7(ArrowUp, { className: "h-4 w-4" })
+            children: busy ? /* @__PURE__ */ jsx8(Square, { className: "h-3 w-3 fill-current" }) : uploading ? /* @__PURE__ */ jsx8(LoaderCircle, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx8(ArrowUp, { className: "h-4 w-4" })
           }
         )
       ] })
@@ -2115,13 +2148,13 @@ function ModelPicker({ models, current, onChange }) {
         onClick: () => setOpen((v) => !v),
         className: "flex max-w-56 items-center gap-1.5 rounded-full border border-border-primary px-2.5 py-1 text-xs text-text-secondary transition-colors hover:bg-background-secondary hover:text-text-primary",
         children: [
-          /* @__PURE__ */ jsx7(Cpu, { className: "h-3.5 w-3.5 shrink-0" }),
-          /* @__PURE__ */ jsx7("span", { className: "truncate", children: active?.name ?? t.model }),
-          /* @__PURE__ */ jsx7(ChevronDown, { className: "h-3.5 w-3.5 shrink-0 opacity-70" })
+          /* @__PURE__ */ jsx8(Cpu, { className: "h-3.5 w-3.5 shrink-0" }),
+          /* @__PURE__ */ jsx8("span", { className: "truncate", children: active?.name ?? t.model }),
+          /* @__PURE__ */ jsx8(ChevronDown, { className: "h-3.5 w-3.5 shrink-0 opacity-70" })
         ]
       }
     ),
-    open && /* @__PURE__ */ jsx7("div", { className: "piloto-menu absolute bottom-full left-0 z-20 mb-1 max-h-80 min-w-52 overflow-y-auto rounded-(--piloto-radius-input) border border-border-primary bg-background-primary py-1 shadow-(--piloto-shadow-card)", children: models.map((m) => /* @__PURE__ */ jsxs6(
+    open && /* @__PURE__ */ jsx8("div", { className: "piloto-menu absolute bottom-full left-0 z-20 mb-1 max-h-80 min-w-52 overflow-y-auto rounded-(--piloto-radius-input) border border-border-primary bg-background-primary py-1 shadow-(--piloto-shadow-card)", children: models.map((m) => /* @__PURE__ */ jsxs6(
       "button",
       {
         type: "button",
@@ -2131,8 +2164,8 @@ function ModelPicker({ models, current, onChange }) {
         },
         className: "flex w-full items-center justify-between gap-3 px-3 py-1.5 text-left text-xs text-text-secondary transition-colors hover:bg-background-secondary hover:text-text-primary",
         children: [
-          /* @__PURE__ */ jsx7("span", { className: "truncate", children: m.name }),
-          m.value === current && /* @__PURE__ */ jsx7(Check, { className: "h-3.5 w-3.5 shrink-0 text-text-success" })
+          /* @__PURE__ */ jsx8("span", { className: "truncate", children: m.name }),
+          m.value === current && /* @__PURE__ */ jsx8(Check, { className: "h-3.5 w-3.5 shrink-0 text-text-success" })
         ]
       },
       m.value
@@ -2143,11 +2176,11 @@ function ModelPicker({ models, current, onChange }) {
 // src/react/Status.tsx
 import { AnimatePresence, motion } from "motion/react";
 import { useEffect as useEffect4, useState as useState7 } from "react";
-import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
 var WAKING_GIVEUP_S = 45;
 var STILL_WORKING_S = 90;
 function TypingDots() {
-  return /* @__PURE__ */ jsx8("div", { className: "piloto-typing", "aria-hidden": true, children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx8("span", { className: "piloto-typing-dot" }, i)) });
+  return /* @__PURE__ */ jsx9("div", { className: "piloto-typing", "aria-hidden": true, children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx9("span", { className: "piloto-typing-dot" }, i)) });
 }
 function WaitLabel({
   phase,
@@ -2170,15 +2203,15 @@ function WaitLabel({
     elsewhere || seconds >= STILL_WORKING_S ? t.stillWorking : phrases[Math.floor(seconds / 4) % phrases.length]
   ) : elsewhere ? t.stillWorking : t.howItGoes(seconds);
   const lost = phase === "waking" && seconds >= WAKING_GIVEUP_S;
-  return /* @__PURE__ */ jsx8("div", { className: "piloto-wait flex flex-col gap-0.5 text-sm text-text-secondary", children: lost ? /* @__PURE__ */ jsxs7("p", { className: "text-text-primary", children: [
+  return /* @__PURE__ */ jsx9("div", { className: "piloto-wait flex flex-col gap-0.5 text-sm text-text-secondary", children: lost ? /* @__PURE__ */ jsxs7("p", { className: "text-text-primary", children: [
     t.cantStart,
     " ",
-    /* @__PURE__ */ jsx8("button", { type: "button", onClick: onLost, className: "cursor-pointer underline underline-offset-2", children: t.retry })
+    /* @__PURE__ */ jsx9("button", { type: "button", onClick: onLost, className: "cursor-pointer underline underline-offset-2", children: t.retry })
   ] }) : (
     // La frase cambia con fundido (sale y entra): de golpe se leía brusco.
     /* @__PURE__ */ jsxs7("p", { className: "flex items-center", children: [
-      /* @__PURE__ */ jsx8(AnimatePresence, { mode: "wait", initial: false, children: /* @__PURE__ */ jsx8(motion.span, { className: "piloto-wait-text", initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.3, ease: "easeInOut" }, children: what }, what) }),
-      showDuration && /* @__PURE__ */ jsx8("span", { className: "piloto-wait-time", children: formatDuration(seconds) })
+      /* @__PURE__ */ jsx9(AnimatePresence, { mode: "wait", initial: false, children: /* @__PURE__ */ jsx9(motion.span, { className: "piloto-wait-text", initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.3, ease: "easeInOut" }, children: what }, what) }),
+      showDuration && /* @__PURE__ */ jsx9("span", { className: "piloto-wait-time", children: formatDuration(seconds) })
     ] })
   ) });
 }
@@ -2188,7 +2221,7 @@ function ConnectingState({ phase, error, avatar, onRetry }) {
   const current = PHASES.indexOf(phase);
   return /* @__PURE__ */ jsxs7(motion.div, { initial: { opacity: 0, y: 8 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.3 }, className: "piloto-connecting flex min-h-[40vh] flex-col items-center justify-center gap-8 text-center", children: [
     /* @__PURE__ */ jsxs7("div", { className: "relative flex h-20 w-20 items-center justify-center", children: [
-      !error && [0, 1].map((i) => /* @__PURE__ */ jsx8(
+      !error && [0, 1].map((i) => /* @__PURE__ */ jsx9(
         motion.span,
         {
           className: "absolute inset-0 rounded-full border border-border-primary",
@@ -2198,34 +2231,34 @@ function ConnectingState({ phase, error, avatar, onRetry }) {
         },
         i
       )),
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx9(
         motion.div,
         {
           className: "grid h-12 w-12 place-items-center",
           animate: error ? { scale: 1, filter: "grayscale(1)" } : { scale: [1, 1.06, 1] },
           transition: error ? { duration: 0.3 } : { duration: 2.2, repeat: Infinity, ease: "easeInOut" },
-          children: avatar ?? /* @__PURE__ */ jsx8("span", { className: "piloto-avatar-default" })
+          children: avatar ?? /* @__PURE__ */ jsx9("span", { className: "piloto-avatar-default" })
         }
       )
     ] }),
-    /* @__PURE__ */ jsx8("ol", { className: "flex flex-col gap-3 text-left", children: t.connectSteps.map((step, i) => {
+    /* @__PURE__ */ jsx9("ol", { className: "flex flex-col gap-3 text-left", children: t.connectSteps.map((step, i) => {
       const done = !error && i < current;
       const active = !error && i === current;
       const failed = !!error && i === current;
       return /* @__PURE__ */ jsxs7("li", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ jsx8("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center", children: done ? /* @__PURE__ */ jsx8("span", { className: "piloto-pop flex h-5 w-5 items-center justify-center rounded-full bg-background-success", children: /* @__PURE__ */ jsx8(Check, { className: "h-3 w-3 text-text-inverse", strokeWidth: 3 }) }) : active ? /* @__PURE__ */ jsx8("span", { className: "piloto-pulse h-2.5 w-2.5 rounded-full bg-text-primary" }) : failed ? /* @__PURE__ */ jsx8("span", { className: "h-2.5 w-2.5 rounded-full bg-text-danger" }) : /* @__PURE__ */ jsx8("span", { className: "h-2 w-2 rounded-full bg-border-primary" }) }),
+        /* @__PURE__ */ jsx9("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center", children: done ? /* @__PURE__ */ jsx9("span", { className: "piloto-pop flex h-5 w-5 items-center justify-center rounded-full bg-background-success", children: /* @__PURE__ */ jsx9(Check, { className: "h-3 w-3 text-text-inverse", strokeWidth: 3 }) }) : active ? /* @__PURE__ */ jsx9("span", { className: "piloto-pulse h-2.5 w-2.5 rounded-full bg-text-primary" }) : failed ? /* @__PURE__ */ jsx9("span", { className: "h-2.5 w-2.5 rounded-full bg-text-danger" }) : /* @__PURE__ */ jsx9("span", { className: "h-2 w-2 rounded-full bg-border-primary" }) }),
         /* @__PURE__ */ jsxs7("div", { className: "leading-tight", children: [
           /* @__PURE__ */ jsxs7("p", { className: `text-sm ${active || failed ? "text-text-primary" : done ? "text-text-secondary" : "text-text-tertiary"}`, children: [
             step.label,
-            active && /* @__PURE__ */ jsx8("span", { className: "piloto-ellipsis inline-block w-4 text-left", children: "\u2026" })
+            active && /* @__PURE__ */ jsx9("span", { className: "piloto-ellipsis inline-block w-4 text-left", children: "\u2026" })
           ] }),
-          active && /* @__PURE__ */ jsx8("p", { className: "text-xs text-text-tertiary", children: step.hint })
+          active && /* @__PURE__ */ jsx9("p", { className: "text-xs text-text-tertiary", children: step.hint })
         ] })
       ] }, i);
     }) }),
     error && /* @__PURE__ */ jsxs7("div", { className: "flex max-w-md flex-col items-center gap-3", children: [
-      /* @__PURE__ */ jsx8("p", { className: "text-sm text-text-danger", children: error }),
-      onRetry && /* @__PURE__ */ jsx8("button", { type: "button", onClick: onRetry, className: "rounded-full border border-border-primary px-4 py-1.5 text-sm text-text-primary hover:bg-background-secondary", children: t.connectRetry })
+      /* @__PURE__ */ jsx9("p", { className: "text-sm text-text-danger", children: error }),
+      onRetry && /* @__PURE__ */ jsx9("button", { type: "button", onClick: onRetry, className: "rounded-full border border-border-primary px-4 py-1.5 text-sm text-text-primary hover:bg-background-secondary", children: t.connectRetry })
     ] })
   ] });
 }
@@ -2279,8 +2312,10 @@ function usePilot(transport, opts = {}) {
       );
     };
     if (transport.history && !optsRef.current.initialTurns) {
-      transport.history().then((turns) => {
-        if (!gone && turns.length && !ref.current.turns.length) commit({ ...ref.current, turns, effects: [] });
+      transport.history().then((h) => {
+        if (gone) return;
+        const { turns, permissions } = Array.isArray(h) ? { turns: h, permissions: [] } : h;
+        commit(applyHistory(ref.current, turns, permissions));
       }).catch(() => {
       }).finally(subscribe);
     } else subscribe();
@@ -2401,7 +2436,7 @@ function useSseTransport(base, opts) {
 }
 
 // src/react/Piloto.tsx
-import { Fragment as Fragment4, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
 var useIsoLayoutEffect = typeof window === "undefined" ? useEffect6 : useLayoutEffect;
 var ANCHOR_GAP = 24;
 var Piloto = forwardRef3(function Piloto2(props, handle) {
@@ -2435,8 +2470,17 @@ var Piloto = forwardRef3(function Piloto2(props, handle) {
     },
     [props.references, props.onReferencesChange]
   );
-  const [draft, setDraftState] = useState9({ text: "", n: 0 });
   const composerBox = useRef5(null);
+  const draftText = typeof props.draft === "string" ? props.draft : props.draft?.text;
+  const draftKey = typeof props.draft === "object" && props.draft ? props.draft.key : void 0;
+  const [draft, setDraftState] = useState9(() => ({ text: draftText ?? "", n: 0 }));
+  const draftSeen = useRef5(`${draftText}\0${draftKey}`);
+  useEffect6(() => {
+    const id = `${draftText}\0${draftKey}`;
+    if (draftText == null || id === draftSeen.current) return;
+    draftSeen.current = id;
+    setDraftState((d) => ({ text: draftText, n: d.n + 1 }));
+  }, [draftText, draftKey]);
   const send = useCallback3(
     (text, attachments = []) => {
       const current = refsRef.current;
@@ -2567,7 +2611,7 @@ var Piloto = forwardRef3(function Piloto2(props, handle) {
     const id = setTimeout(() => setSlowConnect(true), 800);
     return () => clearTimeout(id);
   }, [connected]);
-  const composer = /* @__PURE__ */ jsx9("div", { ref: composerBox, children: /* @__PURE__ */ jsx9(
+  const composer = /* @__PURE__ */ jsx10("div", { ref: composerBox, children: /* @__PURE__ */ jsx10(
     Composer,
     {
       initialValue: draft.text,
@@ -2591,20 +2635,27 @@ var Piloto = forwardRef3(function Piloto2(props, handle) {
     },
     draft.n
   ) });
-  const permissionCards = cards.map((p) => /* @__PURE__ */ jsx9(ConfirmCard, { request: p, onRespond: respond, onSettled: settle, onExpire: pilot.expirePermission }, p.id));
-  return /* @__PURE__ */ jsx9(PilotoContext.Provider, { value: config, children: /* @__PURE__ */ jsx9("div", { ...rootProps(theme, props.skin), "data-busy": busy || void 0, className: `piloto ${props.className ?? ""}`, style: props.style, children: empty ? /* @__PURE__ */ jsxs8("div", { className: "piloto-empty flex min-h-0 flex-1 flex-col items-center justify-center px-4 pb-[8vh]", children: [
-    slots.headerActions && /* @__PURE__ */ jsx9("div", { className: "absolute right-4 top-3 flex gap-2", children: slots.headerActions }),
-    !connected && slowConnect ? /* @__PURE__ */ jsx9(ConnectingState, { phase, error, avatar: props.avatar }) : slots.emptyState ?? /* @__PURE__ */ jsxs8("div", { className: "piloto-welcome mb-6 flex flex-col items-center gap-3 text-center", children: [
-      props.avatar,
-      props.welcome && /* @__PURE__ */ jsx9("div", { className: "text-2xl font-semibold text-text-primary", children: props.welcome })
-    ] }),
-    /* @__PURE__ */ jsxs8("div", { className: "w-full max-w-3xl", children: [
-      slots.aboveComposer,
-      composer,
-      props.suggestions && /* @__PURE__ */ jsx9(Suggestions, { items: props.suggestions, onPick: (s) => send(s), onPrefill: (s) => setDraftState((d) => ({ text: s, n: d.n + 1 })) })
+  const permissionCards = cards.map((p) => /* @__PURE__ */ jsx10(ConfirmCard, { request: p, onRespond: respond, onSettled: settle, onExpire: pilot.expirePermission }, p.id));
+  return /* @__PURE__ */ jsx10(PilotoContext.Provider, { value: config, children: /* @__PURE__ */ jsx10("div", { ...rootProps(theme, props.skin), "data-busy": busy || void 0, className: `piloto ${props.className ?? ""}`, style: props.style, children: empty ? (
+    // Si no cabe (panel bajo, saludo largo), se desplaza en vez de recortarse: el centrado es con
+    // márgenes automáticos, que nunca empujan contenido fuera del contenedor.
+    /* @__PURE__ */ jsxs8("div", { className: "piloto-empty", children: [
+      slots.headerActions && /* @__PURE__ */ jsx10("div", { className: "absolute right-4 top-3 flex gap-2", children: slots.headerActions }),
+      /* @__PURE__ */ jsxs8("div", { className: "piloto-empty-inner", children: [
+        !connected && slowConnect ? /* @__PURE__ */ jsx10(ConnectingState, { phase, error, avatar: props.avatar }) : slots.emptyState ?? /* @__PURE__ */ jsxs8("div", { className: "piloto-welcome mb-6 flex flex-col items-center gap-3 text-center", children: [
+          props.avatar,
+          props.welcome && // Un saludo largo (una explicación) va en letra de lectura; uno corto, en la de cartel.
+          /* @__PURE__ */ jsx10("div", { className: "piloto-welcome-text", "data-long": typeof props.welcome === "string" && props.welcome.length > 60 ? "" : void 0, children: props.welcome })
+        ] }),
+        /* @__PURE__ */ jsxs8("div", { className: "w-full max-w-3xl", children: [
+          slots.aboveComposer,
+          composer,
+          props.suggestions && /* @__PURE__ */ jsx10(Suggestions, { items: props.suggestions, onPick: (s) => send(s), onPrefill: (s) => setDraftState((d) => ({ text: s, n: d.n + 1 })) })
+        ] })
+      ] })
     ] })
-  ] }) : /* @__PURE__ */ jsxs8(Fragment4, { children: [
-    slots.headerActions && /* @__PURE__ */ jsx9("div", { className: "flex shrink-0 justify-end gap-2 px-4 pt-3", children: slots.headerActions }),
+  ) : /* @__PURE__ */ jsxs8(Fragment5, { children: [
+    slots.headerActions && /* @__PURE__ */ jsx10("div", { className: "flex shrink-0 justify-end gap-2 px-4 pt-3", children: slots.headerActions }),
     /* @__PURE__ */ jsxs8(
       "div",
       {
@@ -2625,7 +2676,7 @@ var Piloto = forwardRef3(function Piloto2(props, handle) {
             turns.map((turn, i) => {
               const isLast = i === turns.length - 1;
               const live = busy && isLast;
-              return /* @__PURE__ */ jsx9("div", { "data-turn": i, children: turn.role === "user" ? /* @__PURE__ */ jsx9(UserBubble, { turn }) : /* @__PURE__ */ jsx9(
+              return /* @__PURE__ */ jsx10("div", { "data-turn": i, children: turn.role === "user" ? /* @__PURE__ */ jsx10(UserBubble, { turn }) : /* @__PURE__ */ jsx10(
                 AgentBubble,
                 {
                   turn,
@@ -2640,30 +2691,30 @@ var Piloto = forwardRef3(function Piloto2(props, handle) {
             }),
             permissionCards,
             busy && !toolRunning && !cards.length && /* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-1.5", children: [
-              /* @__PURE__ */ jsx9(TypingDots, {}),
-              /* @__PURE__ */ jsx9(WaitLabel, { phase, since: state.turnStartedAt, elsewhere: state.elsewhere, onLost: pilot.abandonAndRetry, showDuration: features.duration !== false })
+              /* @__PURE__ */ jsx10(TypingDots, {}),
+              /* @__PURE__ */ jsx10(WaitLabel, { phase, since: state.turnStartedAt, elsewhere: state.elsewhere, onLost: pilot.abandonAndRetry, showDuration: features.duration !== false })
             ] }),
             interrupted && !busy && /* @__PURE__ */ jsxs8("p", { className: "piloto-interrupted text-sm text-text-secondary", children: [
               /me quedé a medias|i stopped halfway/i.test(last?.text ?? "") ? t.interruptedOurFault : t.interrupted(interrupted.reason),
               " ",
-              /* @__PURE__ */ jsx9("button", { type: "button", onClick: pilot.resume, className: "cursor-pointer text-text-primary underline underline-offset-2", children: interrupted.canContinue ? t.continueTurn : t.resume })
+              /* @__PURE__ */ jsx10("button", { type: "button", onClick: pilot.resume, className: "cursor-pointer text-text-primary underline underline-offset-2", children: interrupted.canContinue ? t.continueTurn : t.resume })
             ] }),
-            notice && /* @__PURE__ */ jsx9("p", { className: "piloto-notice text-sm text-text-tertiary", children: notice }),
-            error && /* @__PURE__ */ jsx9("p", { className: "piloto-error text-sm text-text-danger", children: error })
+            notice && /* @__PURE__ */ jsx10("p", { className: "piloto-notice text-sm text-text-tertiary", children: notice }),
+            error && /* @__PURE__ */ jsx10("p", { className: "piloto-error text-sm text-text-danger", children: error })
           ] }),
-          /* @__PURE__ */ jsx9("div", { ref: spacer, "aria-hidden": true })
+          /* @__PURE__ */ jsx10("div", { ref: spacer, "aria-hidden": true })
         ]
       }
     ),
     /* @__PURE__ */ jsxs8("div", { className: "piloto-dock relative mx-auto w-full px-4 pb-4", children: [
-      !atBottom && /* @__PURE__ */ jsx9(
+      !atBottom && /* @__PURE__ */ jsx10(
         "button",
         {
           type: "button",
           onClick: toBottom,
           "aria-label": t.goToLatest,
           className: "piloto-to-bottom absolute -top-12 left-1/2 z-10 flex h-9 w-9 -translate-x-1/2 items-center justify-center rounded-full border border-border-primary bg-background-secondary text-text-secondary shadow-(--piloto-shadow-card) transition hover:text-text-primary",
-          children: /* @__PURE__ */ jsx9(ArrowDown, { className: "h-4 w-4" })
+          children: /* @__PURE__ */ jsx10(ArrowDown, { className: "h-4 w-4" })
         }
       ),
       slots.aboveComposer,
@@ -2682,6 +2733,7 @@ export {
   DEFAULT_TOOL_ICONS,
   DecisionLines,
   DeliveryChips,
+  InlineMarkdown,
   LinkSafetyModal,
   Markdown,
   ModelPicker,
@@ -2705,6 +2757,7 @@ export {
   UserBubble,
   WaitLabel,
   appendAgentMessages,
+  applyHistory,
   applyReferences,
   beginSend,
   cleanReplyOption,
@@ -2727,6 +2780,7 @@ export {
   reconcileTurns,
   reconcileWith,
   reducePilotEvent,
+  renderInline,
   resolvePermission,
   resumeMode,
   sendAccepted,

package/dist/styles.css

@@ -844,9 +844,6 @@
 .piloto .pb-4 {
   padding-bottom: calc(var(--spacing) * 4);
 }
-.piloto .pb-\[8vh\] {
-  padding-bottom: 8vh;
-}
 .piloto .pl-2\.5 {
   padding-left: calc(var(--spacing) * 2.5);
 }
@@ -1710,6 +1707,7 @@
   line-height: 1.55;
   -webkit-font-smoothing: antialiased;
   isolation: isolate;
+  container-type: inline-size;
 }
 
 /* ── Ghosty, oscuro: la sombra dura se vuelve lavanda (negro sobre negro no se ve). ── */
@@ -2072,14 +2070,47 @@
   border: var(--piloto-border-width) solid var(--piloto-border);
   box-shadow: 3px 3px 0 var(--piloto-shadow-color);
 }
-.piloto .piloto-welcome > div {
+/* El estado vacío: si no cabe, se desplaza (nunca recorta el saludo ni la sombra del composer). */
+.piloto .piloto-empty {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow-y: auto;
+  padding: 16px 16px 24px;
+}
+.piloto .piloto-empty-inner {
+  margin: auto 0;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding-bottom: 6vh;
+}
+.piloto .piloto-welcome-text {
   font-family: var(--piloto-font-display);
   font-weight: 800;
-  font-size: clamp(30px, 5vw, 44px);
+  /* Al ancho del CONTENEDOR (un panel lateral no es la ventana). */
+  font-size: clamp(26px, 8cqi, 44px);
   line-height: 1;
   letter-spacing: 0.01em;
   max-width: 18ch;
+  color: var(--piloto-text);
+  text-wrap: balance;
+}
+.piloto .piloto-welcome-text[data-long] {
+  font-family: var(--piloto-font);
+  font-weight: 600;
+  font-size: clamp(16px, 4.2cqi, 19px);
+  line-height: 1.45;
+  letter-spacing: 0;
+  max-width: 44ch;
+  color: var(--piloto-text-2);
 }
+.piloto .piloto-narration-text code { background: var(--piloto-surface-2); padding: 0.05rem 0.3rem; border-radius: 4px; font-size: 0.88em; font-family: var(--piloto-font-mono); }
+.piloto .piloto-narration-text strong { font-weight: 700; color: var(--piloto-text); }
+.piloto .piloto-narration-text a { text-decoration: underline; text-decoration-color: var(--piloto-accent); text-underline-offset: 2px; }
 .piloto .piloto-wait-time { margin-left: 0.7em; color: var(--piloto-text-3); font-variant-numeric: tabular-nums; }
 .piloto .piloto-system-note { border: var(--piloto-hairline) solid var(--piloto-border-2); }
 

package/dist/transport/index.js

@@ -7,7 +7,7 @@ import {
   createPostStreamTransport,
   createSseTransport,
   readSse
-} from "../chunks/chunk-KZOMMG2D.js";
+} from "../chunks/chunk-D6JXJWYM.js";
 export {
   MIN_SILENCE_MS,
   MISSED_BEATS,

package/dist/transport/postStream.d.ts

@@ -1,5 +1,5 @@
 import type { SendInput, Turn } from "../core/types";
-import { type PilotTransport } from "./types";
+import { type PilotHistory, type PilotTransport } from "./types";
 /** Un evento SSE ya separado: nombre + data crudo. */
 export interface SseMessage {
     event: string;
@@ -22,8 +22,8 @@ export interface PostStreamTransportOptions {
     attachUrl?: string | null;
     /** URL del historial (JSON). Default `url`; `null` = sin historial. */
     historyUrl?: string | null;
-    /** Cómo leer el historial. Default: `{messages:[{role:"user"|"agent",text}]}`. */
-    parseHistory?: (json: unknown) => Turn[];
+    /** Cómo leer el historial. Default: `{messages:[{role:"user"|"agent",text}], pending:[permission…]}`. */
+    parseHistory?: (json: unknown) => Turn[] | PilotHistory;
     /** URL para cancelar (POST). Sin ella, «detener» sólo deja de escuchar: el turno sigue en el servidor. */
     cancelUrl?: string;
     /** Silencio (sin un solo byte, ni `: ka`) tras el que la conexión se da por muerta. Default 60 s. */

package/dist/transport/types.d.ts

@@ -1,4 +1,9 @@
-import type { SendInput, SendResult, Turn } from "../core/types";
+import type { PermissionRequest, SendInput, SendResult, Turn } from "../core/types";
+/** El hilo guardado y las tarjetas de permiso que siguen abiertas (EasyBits: `pending`). */
+export interface PilotHistory {
+    turns: Turn[];
+    permissions?: PermissionRequest[];
+}
 /** Un evento con nombre y su `data` ya parseado (`null` si no traía o no era JSON). */
 export type PilotListener = (name: string, data: unknown) => void;
 export interface SubscribeOptions {
@@ -19,7 +24,7 @@ export interface PilotTransport {
         resolved: boolean;
     }>;
     /** El hilo guardado, para pintarlo al montar (si la app no pasa `initialTurns`). */
-    history?(): Promise<Turn[]>;
+    history?(): Promise<Turn[] | PilotHistory>;
     /**
      * ¿Se puede mandar un mensaje con un turno en vuelo (steer)? Default `true` (Ghosty). Con
      * `false` (el servidor contesta 409) el composer no deja mandar hasta que el turno cierre.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ghostykit",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Piloto UI \u2014 the in-app copilot chat from Ghosty Studio: streaming, agent steps, attachments, voice, reconnection and human approval cards. Pure event reducer + SSE transport + React components.",
   "type": "module",
   "main": "./dist/core/index.js",