makersclaw 0.8.3 → 0.8.4

package/r/chat-pane.json

@@ -5,7 +5,7 @@
   "title": "ChatPane",
   "description": "The desk's chat pane as the app's own, in the app's theme: the chrome around a conversation. A head (title, New chat, Chats, close) with the past chats dropping over the chat; before the first ask one line, the recent chats and the suggestions; the conversation, kept at the newest words until the member scrolls up, with a jump to latest; a bar for what waits on the member; and the desk's composer: ONE rounded box with the words on top and under them a row, + (attach) at the left and the microphone and a round arrow to send at the right, the arrow a stop while a turn runs, a quiet hint under the box. Files by + or paste or drop, dictation, the box closed while something waits. A starting line handed down by the dock (openAgent) is sent as the member's first words in a fresh chat, or put in the box. It draws what useAgentPane() returns (lib/hooks.js) and decides nothing about the lines of the conversation: those are its children (agent-pane draws the agent's).",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -49,13 +49,13 @@
       "path": "registry/blocks/chat-pane/chat-attach.js",
       "type": "registry:component",
       "target": "@components/makersclaw/blocks/chat-pane/chat-attach.js",
-      "content": "\"use client\";\n\nimport { useCallback, useEffect, useLayoutEffect, useRef, useState } from \"react\";\n\n// The composer's parts (0.8.1, D27 phase 4): files to send with the words,\n// and dictation. Both are the browser's own — nothing here reads a door. The\n// platform checks the files again (agent-app app-attachments.ts) and the\n// limits below are its. They lived in agent-pane/composer.jsx until the\n// chat-pane block (X5); that file now re-exports them from here.\n\n/** At most this many files, and this many bytes together, per message. */\nexport const MAX_FILES = 4;\nexport const MAX_BYTES = 3 * 1024 * 1024;\n\nexport function formatBytes(bytes) {\n  if (bytes < 1024) return `${bytes} B`;\n  if (bytes < 1024 * 1024) return `${Math.round(bytes / 1024)} KB`;\n  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\n}\n\n/**\n * Add `incoming` files to `current`, within the limits.\n *   → { files, error }  `error` is words for the member, or null\n */\nexport function addFiles(current, incoming) {\n  const files = [...current];\n  let error = null;\n  let total = files.reduce((n, f) => n + f.size, 0);\n  for (const file of incoming) {\n    if (files.length >= MAX_FILES) {\n      error = `Send at most ${MAX_FILES} files at a time.`;\n      break;\n    }\n    if (file.size === 0) {\n      error = `${file.name} is empty.`;\n      continue;\n    }\n    if (total + file.size > MAX_BYTES) {\n      error = `Files can be up to ${formatBytes(MAX_BYTES)} together here. Attach a smaller one, or attach it in the Makersclaw window.`;\n      continue;\n    }\n    total += file.size;\n    files.push(file);\n  }\n  return { files, error };\n}\n\n/** A File as the ask takes it: { name, type, data } with a base64 data URL. */\nexport function readFile(file) {\n  return new Promise((resolve, reject) => {\n    const reader = new FileReader();\n    reader.onload = () => resolve({ name: file.name, type: file.type || \"application/octet-stream\", data: String(reader.result) });\n    reader.onerror = () => reject(reader.error ?? new Error(\"read failed\"));\n    reader.readAsDataURL(file);\n  });\n}\n\n/** Files off a paste or a drop. A pasted image is named \"image.png\" by the\n *  browser; stamp it so several stay apart in the thread. */\nexport function filesFromTransfer(dt) {\n  if (!dt) return [];\n  const out = [];\n  for (const item of Array.from(dt.items ?? [])) {\n    if (item.kind !== \"file\") continue;\n    const file = item.getAsFile();\n    if (!file) continue;\n    out.push(\n      file.name === \"image.png\" && file.type.startsWith(\"image/\")\n        ? new File([file], `pasted-${new Date().toISOString().replace(/[:.]/g, \"-\")}.png`, { type: file.type })\n        : file,\n    );\n  }\n  return out;\n}\n\nfunction recognitionCtor() {\n  if (typeof window === \"undefined\") return null;\n  return window.SpeechRecognition ?? window.webkitSpeechRecognition ?? null;\n}\n\n/**\n * Dictation: the microphone to text through the browser's speech\n * recognition (the desk's composer does the same). `onText(words)` hears\n * each finished phrase. `supported` is false where the browser has none,\n * and the pane draws no microphone. `error` says when the microphone is\n * refused (a frame the desk has not allowed it in, or the member said no).\n */\nexport function useDictation(onText) {\n  const [supported] = useState(() => recognitionCtor() !== null);\n  const [listening, setListening] = useState(false);\n  const [interim, setInterim] = useState(\"\");\n  const [error, setError] = useState(null);\n  const recRef = useRef(null);\n  const wantRef = useRef(false);\n  const onTextRef = useRef(onText);\n  useLayoutEffect(() => {\n    onTextRef.current = onText;\n  }, [onText]);\n\n  const stop = useCallback(() => {\n    wantRef.current = false;\n    recRef.current?.stop();\n    recRef.current = null;\n    setListening(false);\n    setInterim(\"\");\n  }, []);\n\n  const start = useCallback(() => {\n    const Ctor = recognitionCtor();\n    if (!Ctor || recRef.current) return;\n    setError(null);\n    const rec = new Ctor();\n    rec.continuous = true;\n    rec.interimResults = true;\n    rec.lang = (typeof navigator !== \"undefined\" && navigator.language) || \"en-US\";\n    rec.onresult = (event) => {\n      let interimText = \"\";\n      for (let i = event.resultIndex; i < event.results.length; i += 1) {\n        const result = event.results[i];\n        const transcript = result[0]?.transcript ?? \"\";\n        if (result.isFinal) {\n          if (transcript.trim()) onTextRef.current(transcript.trim());\n        } else {\n          interimText += transcript;\n        }\n      }\n      setInterim(interimText);\n    };\n    rec.onend = () => {\n      recRef.current = null;\n      setInterim(\"\");\n      if (wantRef.current) {\n        // Silence ends a recognition; while the toggle is on, listen again.\n        try {\n          rec.start();\n          recRef.current = rec;\n          return;\n        } catch {\n          wantRef.current = false;\n        }\n      }\n      setListening(false);\n    };\n    rec.onerror = (event) => {\n      if (event.error === \"not-allowed\" || event.error === \"service-not-allowed\") {\n        wantRef.current = false;\n        setListening(false);\n        setError(\"The microphone is not allowed here. Allow it for this site, or type instead.\");\n      }\n    };\n    wantRef.current = true;\n    try {\n      rec.start();\n    } catch {\n      wantRef.current = false;\n      setError(\"The microphone could not start.\");\n      return;\n    }\n    recRef.current = rec;\n    setListening(true);\n  }, []);\n\n  const toggle = useCallback(() => (listening ? stop() : start()), [listening, start, stop]);\n  useEffect(() => stop, [stop]);\n  return { supported, listening, interim, error, toggle, stop };\n}\n"
+      "content": "\"use client\";\n\nimport { useCallback, useEffect, useLayoutEffect, useRef, useState } from \"react\";\n\n// The composer's parts (0.8.1, D27 phase 4): files to send with the words,\n// and dictation. Both are the browser's own — nothing here reads a door. The\n// platform checks the files again (agent-app app-attachments.ts) and the\n// limits below are its. They lived in agent-pane/composer.jsx until the\n// chat-pane block (X5); that file now re-exports them from here.\n\n/** At most this many files, and this many bytes together, per message. */\nexport const MAX_FILES = 4;\nexport const MAX_BYTES = 3 * 1024 * 1024;\n\nexport function formatBytes(bytes) {\n  if (bytes < 1024) return `${bytes} B`;\n  if (bytes < 1024 * 1024) return `${Math.round(bytes / 1024)} KB`;\n  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\n}\n\n/**\n * Add `incoming` files to `current`, within the limits.\n *   → { files, error }  `error` is words for the member, or null\n */\nexport function addFiles(current, incoming) {\n  const files = [...current];\n  let error = null;\n  let total = files.reduce((n, f) => n + f.size, 0);\n  for (const file of incoming) {\n    if (files.length >= MAX_FILES) {\n      error = `Send at most ${MAX_FILES} files at a time.`;\n      break;\n    }\n    if (file.size === 0) {\n      error = `${file.name} is empty.`;\n      continue;\n    }\n    if (total + file.size > MAX_BYTES) {\n      error = `Files can be up to ${formatBytes(MAX_BYTES)} together here. Attach a smaller one, or attach it in the Makersclaw window.`;\n      continue;\n    }\n    total += file.size;\n    files.push(file);\n  }\n  return { files, error };\n}\n\n/** A File as the ask takes it: { name, type, data } with a base64 data URL. */\nexport function readFile(file) {\n  return new Promise((resolve, reject) => {\n    const reader = new FileReader();\n    reader.onload = () => resolve({ name: file.name, type: file.type || \"application/octet-stream\", data: String(reader.result) });\n    reader.onerror = () => reject(reader.error ?? new Error(\"read failed\"));\n    reader.readAsDataURL(file);\n  });\n}\n\n/** Files off a paste or a drop. A pasted image is named \"image.png\" by the\n *  browser; stamp it so several stay apart in the thread. */\nexport function filesFromTransfer(dt) {\n  if (!dt) return [];\n  const out = [];\n  for (const item of Array.from(dt.items ?? [])) {\n    if (item.kind !== \"file\") continue;\n    const file = item.getAsFile();\n    if (!file) continue;\n    out.push(\n      file.name === \"image.png\" && file.type.startsWith(\"image/\")\n        ? new File([file], `pasted-${new Date().toISOString().replace(/[:.]/g, \"-\")}.png`, { type: file.type })\n        : file,\n    );\n  }\n  return out;\n}\n\nfunction recognitionCtor() {\n  if (typeof window === \"undefined\") return null;\n  return window.SpeechRecognition ?? window.webkitSpeechRecognition ?? null;\n}\n\n/**\n * Dictation: the microphone to text through the browser's speech\n * recognition (the desk's composer does the same). `onText(words)` hears\n * each finished phrase. `supported` is false where the browser has none,\n * and the pane draws no microphone. `error` says when the microphone is\n * refused (a frame the desk has not allowed it in, or the member said no).\n */\nexport function useDictation(onText) {\n  // Server and first client render must draw the same composer. Browser\n  // capability becomes available only after hydration (no microphone is used).\n  const [supported, setSupported] = useState(false);\n  useEffect(() => {\n    setSupported(recognitionCtor() !== null);\n  }, []);\n  const [listening, setListening] = useState(false);\n  const [interim, setInterim] = useState(\"\");\n  const [error, setError] = useState(null);\n  const recRef = useRef(null);\n  const wantRef = useRef(false);\n  const onTextRef = useRef(onText);\n  useLayoutEffect(() => {\n    onTextRef.current = onText;\n  }, [onText]);\n\n  const stop = useCallback(() => {\n    wantRef.current = false;\n    recRef.current?.stop();\n    recRef.current = null;\n    setListening(false);\n    setInterim(\"\");\n  }, []);\n\n  const start = useCallback(() => {\n    const Ctor = recognitionCtor();\n    if (!Ctor || recRef.current) return;\n    setError(null);\n    const rec = new Ctor();\n    rec.continuous = true;\n    rec.interimResults = true;\n    rec.lang = (typeof navigator !== \"undefined\" && navigator.language) || \"en-US\";\n    rec.onresult = (event) => {\n      let interimText = \"\";\n      for (let i = event.resultIndex; i < event.results.length; i += 1) {\n        const result = event.results[i];\n        const transcript = result[0]?.transcript ?? \"\";\n        if (result.isFinal) {\n          if (transcript.trim()) onTextRef.current(transcript.trim());\n        } else {\n          interimText += transcript;\n        }\n      }\n      setInterim(interimText);\n    };\n    rec.onend = () => {\n      recRef.current = null;\n      setInterim(\"\");\n      if (wantRef.current) {\n        // Silence ends a recognition; while the toggle is on, listen again.\n        try {\n          rec.start();\n          recRef.current = rec;\n          return;\n        } catch {\n          wantRef.current = false;\n        }\n      }\n      setListening(false);\n    };\n    rec.onerror = (event) => {\n      if (event.error === \"not-allowed\" || event.error === \"service-not-allowed\") {\n        wantRef.current = false;\n        setListening(false);\n        setError(\"The microphone is not allowed here. Allow it for this site, or type instead.\");\n      }\n    };\n    wantRef.current = true;\n    try {\n      rec.start();\n    } catch {\n      wantRef.current = false;\n      setError(\"The microphone could not start.\");\n      return;\n    }\n    recRef.current = rec;\n    setListening(true);\n  }, []);\n\n  const toggle = useCallback(() => (listening ? stop() : start()), [listening, start, stop]);\n  useEffect(() => stop, [stop]);\n  return { supported, listening, interim, error, toggle, stop };\n}\n"
     },
     {
       "path": "registry/blocks/chat-pane/README.md",
       "type": "registry:file",
       "target": "@components/makersclaw/blocks/chat-pane/README.md",
-      "content": "# ChatPane\n\nThe desk's chat pane, as the app's own, in the app's theme (0.8.1). The\nfounder, after reviewing the app agent's message box next to the\nAutomations window's: \"add claw's ChatPane as a block in the makersclaw\ntemplate\". This is that port: claw's `web/src/os/windows/artifact/ChatPane`\nand the composer of its `EveChat`, in JSX, with the kit's `Icon` and\n`Button` and the app's tokens, talking to the agent through the app's own\nhook (`useAgentPane`, `lib/hooks.js`) instead of `eve/client`.\n\nIt is the **chrome around a conversation**:\n\n- **The head**: the title, **New chat**, **Chats** (the past chats drop over\n  the conversation, newest first, with a dot on one that needs you or is\n  working), and a close.\n- **The empty state**: before the first ask, one line, the recent chats\n  (\"No chats yet. Your first message starts one.\" when there are none), and\n  the app's suggestions.\n- **The conversation**: its lines are the children. It stays at the newest\n  words until the member scrolls up, then offers a jump to latest.\n- **The bar** between the conversation and the box: what waits on the member,\n  or that the agent is working.\n- **The message box**: the desk's composer. **One rounded box.** The words\n  on top, full width, growing with what is typed. Under them a row: **+**\n  (attach) at the left, and at the right the **microphone** and a **round\n  arrow** to send. **While a turn runs, a round stop takes the arrow's\n  place** (once the member types, the arrow comes back: a message sent then\n  waits its turn, as before). A quiet `hint` can sit under the box.\n- **Files** by the + button, by paste and by a drop anywhere on the pane (up\n  to 4 files and 3 MB together); **dictation** where the browser has speech\n  recognition; the box **closed** while something waits on the member, with\n  the reason in its placeholder.\n- **A starting line** from the dock: `openAgent({ ask })` (blocks/agent-dock).\n  The pane sends it as the member's first words in a new chat, or puts it\n  in the box. See \"Have the agent do it\" below.\n\n```jsx\nimport { ChatPane } from \"../components/blocks/chat-pane\";   // a Makersclaw app (\"./blocks/chat-pane\" from components/)\nimport { ChatPane } from \"@/components/makersclaw/blocks/chat-pane\";   // a shadcn project\n```\n\nA client component. It needs the kit and nothing else; it is not tied to the\nagent's lines. **For the agent's conversation use `agent-pane`**, which\ndraws the plan, the work folded into \"Worked through N steps\", the\nquestions, the yes and what the agent made, inside this pane. Use `ChatPane`\nitself for lines of your own in the desk's frame.\n\n## What was ported, and what was not\n\nPorted: the head (New chat, Chats), the past chats list and its marks, the\nempty state, the scroll that follows, the composer (its layout, the\nattachments, the dictation, the send and stop), the closed box, and the\nhand-off seam in a form the app needs (the starting line).\n\nNot ported, because the app has no such thing: the desk's **rail** beside the\nchat (an app's agent lives in the dock, a column; the Chats overlay is the\ncolumn mode's), the **binding** (headers, scope, the session pointer: the\napp's `useAgentPane` holds those), **`openSession`/`pendingLine`** (the desk's\nhand-off of a request into the agent's chat; the app's starting line does\nthat job), **`chatMarks` \"In Makersclaw\"** (an ask made in Makersclaw shows\nas a pointer in the conversation instead) and the wallet gate (the platform\nrefuses a turn with no credits and says so).\n\n## Props\n\n- `chat` — what `useAgentPane()` returns. Required. The pane calls its\n  `send(text, { files })`, `stop()`, `newChat()` and `openSession(id)` and\n  reads `sessionId`, `request`, `chats`, `view`/`turns`/`pending`/`state`\n  (to follow the newest words), `sameConversation`, `sending`, `loading`,\n  `error`, `notice`, `unavailable`.\n- `title` — the head's words, and the box's label. Default `\"Ask the agent\"`.\n- `suggestions` — asks that fit the moment, as chips before the first ask.\n- `empty` — one line before the first ask.\n- `placeholder` — the box's words before the first ask. Once there is a\n  conversation it says \"Ask a follow-up…\" unless `chat.sameConversation` is\n  false.\n- `closedWords` — the box's words while `blocked` (\"Answer above first\").\n- `hint` — a quiet line under the box (\"Enter sends · Shift+Enter is a new\n  line\").\n- `recent` — past chats listed before the first ask. Default `5`; `0` none.\n- `bare` — no head, inside a `Sheet` or a `Card` that has its own.\n- `fill` — default `true`: the pane takes its container's height and the\n  conversation scrolls inside it. `false`: compact, a capped height.\n- `onClose` — a close in the head. Inside an `agent-dock` it is the dock's.\n- `started` — there is a conversation to draw (else the empty state).\n- `busy` — a turn runs: the arrow is a stop while the box is empty.\n- `blocked` — something waits on the member: the whole box is closed.\n- `bar` — a node between the conversation and the box.\n- `children` — the conversation's lines.\n- `className` — layout around it. Never colour.\n\n`ChatComposer` is also exported, for a box of your own around the same\nframe: `value`, `onChange`, `onSubmit`, `onStop`, `onAttach`, `files`,\n`onRemoveFile`, `busy`, `canStop`, `stopping`, `blocked`, `sending`,\n`encoding`, `dictation` (`useDictation()`), `placeholder`, `label`, `hint`,\n`textareaRef`, `fileInputRef`. `ChatsList` draws the past chats.\n\n## Have the agent do it\n\nA button that says the agent will do the work does not open a form. It calls\n`openAgent(\"Draft a project plan for me\")` (blocks/agent-dock). The dock\nopens, tells this pane the line through `ChatDockContext`, and the pane:\n\n1. starts a new chat (if one is open; `fresh: false` carries on in it),\n2. sends the line as the member's first words, once,\n3. and tells the dock it took it.\n\nWith `send: false` it puts the line in the box instead, with the cursor at\nits end (words the member already typed stay, and the line goes under them). A closed box (something waits on the member) always takes the line\nas a prefill. The pure rule is `startStep(...)` in `chat-model.js`.\n\n## The model (plain functions)\n\n`ago(iso)`, `startStep({ start, handled, sessionId, blocked, canNew, newed })`,\nand the composer's parts: `addFiles`, `filesFromTransfer`, `readFile`,\n`formatBytes`, `MAX_FILES`, `MAX_BYTES`, `useDictation`.\n\n## Example\n\n```jsx\n\"use client\";\nimport { useAgentPane } from \"../lib/hooks\";\nimport { ChatPane } from \"../components/blocks/chat-pane\";\n\nexport default function Notes() {\n  const chat = useAgentPane({ key: \"notes\" });\n  const messages = chat.view?.messages ?? [];\n  return (\n    <ChatPane\n      chat={chat}\n      title=\"Ask about your notes\"\n      suggestions={[\"Summarise this week\"]}\n      hint=\"Enter sends · Shift+Enter is a new line\"\n      started={messages.length > 0}\n      busy={chat.state === \"working\"}\n    >\n      {messages.map((m) => (\n        <p key={m.id}>{m.text}</p>\n      ))}\n    </ChatPane>\n  );\n}\n```\n"
+      "content": "# ChatPane\n\nThe desk's chat pane, as the app's own, in the app's theme (0.8.1). The\nfounder, after reviewing the app agent's message box next to the\nAutomations window's: \"add claw's ChatPane as a block in the makersclaw\ntemplate\". This is that port: claw's `web/src/os/windows/artifact/ChatPane`\nand the composer of its `EveChat`, in JSX, with the kit's `Icon` and\n`Button` and the app's tokens, talking to the agent through the app's own\nhook (`useAgentPane`, `lib/hooks.js`) instead of `eve/client`.\n\nIt is the **chrome around a conversation**:\n\n- **The head**: the title, **New chat**, **Chats** (the past chats drop over\n  the conversation, newest first, with a dot on one that needs you or is\n  working), and a close.\n- **The empty state**: before the first ask, one line, the recent chats\n  (\"No chats yet. Your first message starts one.\" when there are none), and\n  the app's suggestions.\n- **The conversation**: its lines are the children. It stays at the newest\n  words until the member scrolls up, then offers a jump to latest.\n- **The bar** between the conversation and the box: what waits on the member,\n  or that the agent is working.\n- **The message box**: the desk's composer. **One rounded box.** The words\n  on top, full width, growing with what is typed. Under them a row: **+**\n  (attach) at the left, and at the right the **microphone** and a **round\n  arrow** to send. **While a turn runs, a round stop takes the arrow's\n  place** (once the member types, the arrow comes back: a message sent then\n  waits its turn, as before). A quiet `hint` can sit under the box.\n- **Files** by the + button, by paste and by a drop anywhere on the pane (up\n  to 4 files and 3 MB together); **dictation** where the browser has speech\n  recognition; the box **closed** while something waits on the member, with\n  the reason in its placeholder.\n- **A starting line** from the dock: `openAgent({ ask })` (blocks/agent-dock).\n  The pane sends it as the member's first words in a new chat, or puts it\n  in the box. See \"Have the agent do it\" below.\n\n```jsx\nimport { ChatPane } from \"../components/blocks/chat-pane\";   // a Makersclaw app (\"./blocks/chat-pane\" from components/)\nimport { ChatPane } from \"@/components/makersclaw/blocks/chat-pane\";   // a shadcn project\n```\n\nA client component. It needs the kit and nothing else; it is not tied to the\nagent's lines. **For the agent's conversation use `agent-pane`**, which\ndraws the plan, the work folded into \"Worked through N steps\", the\nquestions, the yes and what the agent made, inside this pane. Use `ChatPane`\nitself for lines of your own in the desk's frame.\n\n## What was ported, and what was not\n\nPorted: the head (New chat, Chats), the past chats list and its marks, the\nempty state, the scroll that follows, the composer (its layout, the\nattachments, the dictation, the send and stop), the closed box, and the\nhand-off seam in a form the app needs (the starting line).\n\nNot ported, because the app has no such thing: the desk's **rail** beside the\nchat (an app's agent lives in the dock, a column; the Chats overlay is the\ncolumn mode's), the **binding** (headers, scope, the session pointer: the\napp's `useAgentPane` holds those), **`openSession`/`pendingLine`** (the desk's\nhand-off of a request into the agent's chat; the app's starting line does\nthat job), **`chatMarks` \"In Makersclaw\"** (an ask made in Makersclaw shows\nas a pointer in the conversation instead) and the wallet gate (the platform\nrefuses a turn with no credits and says so).\n\n## Props\n\n- `chat` — what `useAgentPane()` returns. Required. The pane calls its\n  `send(text, { files })`, `stop()`, `newChat()` and `openSession(id)` and\n  reads `sessionId`, `request`, `chats`, `view`/`turns`/`pending`/`state`\n  (to follow the newest words), `sameConversation`, `sending`, `loading`,\n  `error`, `notice`, `unavailable`.\n- `title` — the head's words, and the box's label. Default `\"Ask the agent\"`.\n- `suggestions` — asks that fit the moment, as chips before the first ask.\n- `empty` — one line before the first ask.\n- `placeholder` — the box's words before the first ask. Once there is a\n  conversation it says \"Ask a follow-up…\" unless `chat.sameConversation` is\n  false.\n- `closedWords` — the box's words while `blocked` (\"Answer above first\").\n- `hint` — a quiet line under the box (\"Enter sends · Shift+Enter is a new\n  line\").\n- `recent` — past chats listed before the first ask. Default `5`; `0` none.\n- `bare` — no head, inside a `Sheet` or a `Card` that has its own.\n- `fill` — default `true`: the pane takes its container's height and the\n  conversation scrolls inside it. `false`: compact, a capped height.\n- `onClose` — a close in the head. Inside an `agent-dock` it is the dock's.\n- `started` — there is a conversation to draw (else the empty state).\n- `busy` — a turn runs: the arrow is a stop while the box is empty.\n- `blocked` — something waits on the member: the whole box is closed.\n- `bar` — a node between the conversation and the box.\n- `children` — the conversation's lines.\n- `className` — layout around it. Never colour.\n\n`ChatComposer` is also exported, for a box of your own around the same\nframe: `value`, `onChange`, `onSubmit`, `onStop`, `onAttach`, `files`,\n`onRemoveFile`, `busy`, `canStop`, `stopping`, `blocked`, `sending`,\n`encoding`, `dictation` (`useDictation()`), `placeholder`, `label`, `hint`,\n`textareaRef`, `fileInputRef`. `ChatsList` draws the past chats.\n\n## Have the agent do it\n\nA button that says the agent will do the work does not open a form. It calls\n`openAgent(\"Draft a project plan for me\")` (blocks/agent-dock). The dock\nopens, tells this pane the line through `ChatDockContext`, and the pane:\n\n1. starts a new chat (if one is open; `fresh: false` carries on in it),\n2. sends the line as the member's first words, once,\n3. and tells the dock it took it.\n\nWith `send: false` it puts the line in the box instead, with the cursor at\nits end (words the member already typed stay, and the line goes under them). A closed box (something waits on the member) always takes the line\nas a prefill. The pure rule is `startStep(...)` in `chat-model.js`.\n\n## The model (plain functions)\n\n`ago(iso)`, `startStep({ start, handled, sessionId, blocked, canNew, newed })`,\nand the composer's parts: `addFiles`, `filesFromTransfer`, `readFile`,\n`formatBytes`, `MAX_FILES`, `MAX_BYTES`, `useDictation`.\n\n## Example\n\n```jsx\n\"use client\";\nimport { useAgentPane } from \"../lib/hooks\";\nimport { ChatPane } from \"../components/blocks/chat-pane\";\n\nexport default function Notes() {\n  const chat = useAgentPane({ key: \"notes\" });\n  const messages = chat.view?.messages ?? [];\n  return (\n    <ChatPane\n      chat={chat}\n      title=\"Ask about your notes\"\n      suggestions={[\"Summarise this week\"]}\n      hint=\"Enter sends · Shift+Enter is a new line\"\n      started={messages.length > 0}\n      busy={chat.state === \"working\"}\n    >\n      {messages.map((m) => (\n        <p key={m.id}>{m.text}</p>\n      ))}\n    </ChatPane>\n  );\n}\n```\n\nDictation capability is detected after hydration: the server and first client\nrender show the same composer, then supported browsers gain the microphone.\nThis detection itself does not ask for microphone access.\n"
     }
   ],
   "categories": [
@@ -77,7 +77,7 @@
   "docs": "Installed to components/makersclaw/blocks/chat-pane. Import: import { ChatPane, ChatComposer, ChatsList, ChatDockContext, ago, startStep, MAX_BYTES, MAX_FILES, addFiles, filesFromTransfer, formatBytes, readFile, useDictation } from \"@/components/makersclaw/blocks/chat-pane\". Props and an example: components/makersclaw/blocks/chat-pane/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "Any app chat with the agent: the pane inside an agent-dock, a compact card beside a record, a sheet. Use agent-pane when the conversation is the agent's (it puts the plan, the work, the questions and the yes inside this pane); use chat-pane itself to draw your own lines in the desk's frame, or just the composer (ChatComposer). Not for a chat between people (chat) or an agent run that is commissioned from a verb and watched (job-panel)."
     }
   }

package/r/chat.json

@@ -5,7 +5,7 @@
   "title": "Chat",
   "description": "The parts of a chat: messages with avatars, times, grouping, sending/failed/streaming states, hover actions, thumbs up/down feedback, in-place editing and a folding reasoning section; a scroller that sticks to the bottom with day separators and older-message loading; a composer (a box or an \"ask anything\" pill) with attachments, a + menu, tools, suggestion chips, Enter to send and Stop; a header; and ChatThread, which composes them from messages + onSend.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -88,7 +88,7 @@
   "docs": "Installed to components/makersclaw/blocks/chat. Import: import { ChatThread, ChatHeader, Message, Bubble, Attachment, MessageScroller, Composer } from \"@/components/makersclaw/blocks/chat\". Props and an example: components/makersclaw/blocks/chat/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A conversation lives inside the app's own screen: a support inbox reply pane, a customer-facing assistant, comments between teammates on a record, a thread per object. Not the app window's Agent tab (the OS draws that) and not a one-off job the founder commissions (job-panel)."
     }
   }

package/r/code-editor.json

@@ -5,7 +5,7 @@
   "title": "CodeEditor",
   "description": "A code editor (CodeMirror 6) in the workspace theme: SQL with the database's tables and columns in autocomplete, JSON checked as you type with plain-words errors, or plain text; line numbers, problems underlined in the text with a dot in the gutter, find and replace, folding, and a run hook on Cmd/Ctrl+Enter that runs the selection or the statement under the cursor. A quiet status line shows problems, the cursor, the mode and a Run button. Helpers split SQL into statements and check or format JSON anywhere, the server included.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [
     "@codemirror/state@6.7.6",
@@ -87,7 +87,7 @@
   "docs": "Installed to components/makersclaw/blocks/code-editor. Import: import { CodeEditor, useCodeEditor, LANGUAGES, SQL_DIALECTS, splitStatements, statementAt, sqlNamespace, checkJson, formatJson, stringifyJson, lineCol, offsetOf, normalizeDiagnostics } from \"@/components/makersclaw/blocks/code-editor\". Props and an example: components/makersclaw/blocks/code-editor/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A screen edits code or structured text: a SQL console, a query in a report, a JSON config or payload, a webhook body, a template, a script. json-editor and sql-console are built on it. Not for prose (doc-editor), one line of text (the kit's Input), or showing a diagram (diagram)."
     }
   }

package/r/comment-box.json

@@ -5,8 +5,8 @@
   "title": "CommentBox",
   "description": "A minimal rich comment field (DocEditor in minimal mode): bold, italic, links and lists from the selection toolbar or markdown shortcuts, @mentions as chips, Cmd/Ctrl+Enter to post. It posts through an async onPost(doc) that answers { ok }, keeps the draft and says why when it fails, and clears when it lands. With `comments` it draws the thread above it: avatar, name, relative time, the rich body. Also exports the composer alone, the read-only body renderer and the timestamp.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/doc-editor.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/doc-editor.json"
   ],
   "dependencies": [],
   "files": [
@@ -57,7 +57,7 @@
   "docs": "Installed to components/makersclaw/blocks/comment-box. Import: import { CommentBox, CommentComposer, CommentBody, CommentTime } from \"@/components/makersclaw/blocks/comment-box\". Props and an example: components/makersclaw/blocks/comment-box/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "People comment on something in the app: a task, a design, a document, an approval, a support ticket; a reply field with @mentions under a thread. Not dated notes kept on a record with edit and delete (record-notes), not a conversation with an assistant (chat), not a long document (doc-editor, doc-page)."
     }
   }

package/r/connect-card.json

@@ -5,7 +5,7 @@
   "title": "ConnectCard",
   "description": "The accounts the app declares, as rows like the window's Settings › Connections: what each is for, its kind (Mail, Calendar), needed or optional, live or not connected as a mark and a word, which accounts meet it, and Connect or Change. The press goes out as onConnect(key): useConnections() (lib/hooks.js) opens the desk's connections panel for that need, listing every provider of the kind (no agent turn), or hands out the link in a new tab outside the desk, then watches until the account is live. Signing in stays the member's, at the provider.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -44,7 +44,7 @@
   "docs": "Installed to components/makersclaw/blocks/connect-card. Import: import { ConnectCard, ConnectRow } from \"@/components/makersclaw/blocks/connect-card\". Props and an example: components/makersclaw/blocks/connect-card/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "An app that reads or writes through an outside account shows what it uses and lets the member connect it where the need is felt: a CRM's \"What the CRM reads\" (mailbox, calendar), an inbox app's accounts, a setup step, the empty state of a screen that needs a mailbox. For a first-run checklist use setup-checklist; for the app's own settings page use settings-list."
     }
   }

package/r/contact-section.json

@@ -5,7 +5,7 @@
   "title": "Contact Section",
   "description": "A public \"contact us\" section: a form (name, email, message; optional phone, company, subject, a topic as chips or radios, a consent box) and/or the ways to reach you (email, phone, address, hours, offices). The form alone, beside an info panel (plain or filled), or with info cards above or beside it; an optional picture beside or behind the form. Validates in place, submits through an async onSubmit that returns { ok }, and shows the failure or a sent state.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -46,7 +46,7 @@
   "docs": "Installed to components/makersclaw/blocks/contact-section. Import: import { ContactSection } from \"@/components/makersclaw/blocks/contact-section\". Props and an example: components/makersclaw/blocks/contact-section/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "The contact page or contact section of a public site: sales enquiries, support requests, a studio's \"start a project\" form. Not for a signed-in user's support inbox or ticket thread, or a general-purpose record form (use a form of your own from the kit)."
     }
   }

package/r/cost.json

@@ -5,7 +5,7 @@
   "title": "Cost",
   "description": "What a press will spend, said before the press. CostTag is the price on a control that spends (\"about 700 cr\", \"up to 2,000 cr\", \"1 call · 2 cr\"). CostConfirm is the confirm before a big spend: what it uses and at most, what is left, Go ahead, and an optional cheaper first step (\"Try the first 10 rows\"); with too few credits it says so and points at the desk, where credits are added. Allowance is the week's credits as a meter. Fed by useLlmAction's estimate, useJobs' budget and credits (lib/hooks.js); it reads no wallet and spends nothing itself.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -44,7 +44,7 @@
   "docs": "Installed to components/makersclaw/blocks/cost. Import: import { CostTag, CostConfirm, Allowance, creditsWords } from \"@/components/makersclaw/blocks/cost\". Props and an example: components/makersclaw/blocks/cost/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "Every control that spends credits says its price on it: Run now, Read now, Enrich 500 rows, Summarize, Generate. Put CostConfirm before a spend big enough to pause over (a whole table, a long run), and Allowance where an app shows its agent's week (beside a schedule-card, in a run's overview)."
     }
   }

package/r/csv-import.json

@@ -5,8 +5,8 @@
   "title": "CsvImport",
   "description": "Import a CSV in three calm steps: drop a file (or paste text, or download a template), match each file column to a field with automatic matches and sample values (or, with no fields, name and type a new table's fields from guessed types), then review every row in an editable spreadsheet where cells that do not fit their type are marked red and fixed in place, delete rows or leave the bad ones out, and import through one async onImport that answers { ok }. Quoted commas and newlines, TSV and semicolon files, byte-order marks, 50,000 rows.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/spreadsheet.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/spreadsheet.json"
   ],
   "dependencies": [
     "papaparse@5.7.0"
@@ -56,7 +56,7 @@
   "docs": "Installed to components/makersclaw/blocks/csv-import. Import: import { CsvImport, parseCsvText, readCsvFile, headersOf, autoMatch, guessColumns, buildRows, cleanRow, templateCsv } from \"@/components/makersclaw/blocks/csv-import\". Props and an example: components/makersclaw/blocks/csv-import/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "People bring records in from a spreadsheet or another tool: contacts, leads, products, a price list, an old CRM export, a first table for a new app. Built on spreadsheet. Not for uploading files to keep (file-upload) or for editing records already in the app (spreadsheet, data-table)."
     }
   }

package/r/data-picker.json

@@ -5,8 +5,8 @@
   "title": "DataPicker",
   "description": "Mapping data from earlier steps into a field. DataPicker is the menu (this run, this item inside a for-each, the questions a manual run asks, and every earlier step's output, with the fields inside it and a taste of their values where a real run left a sample); DataButton is the { } button that opens it; DataInput is a labelled text field (one line or several) with the menu beside it; DataPairs is a list of name and value rows with a menu on each value. A press inserts {{ steps.mail.output.messages }} where the cursor was.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/automation-model.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/automation-model.json"
   ],
   "dependencies": [],
   "files": [
@@ -53,7 +53,7 @@
   "docs": "Installed to components/makersclaw/blocks/data-picker. Import: import { DataButton, DataInput, DataPairs, DataPicker, fieldsOf, menuGroups, preview } from \"@/components/makersclaw/blocks/data-picker\". Props and an example: components/makersclaw/blocks/data-picker/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A form edits a step's input and the value may come from an earlier step: the step-settings block does this for you. Use it on its own for a field of your own that takes `{{ … }}` references."
     }
   }

package/r/data-table.json

@@ -5,7 +5,7 @@
   "title": "Data table",
   "description": "Records as a table the founder can work: sort by a column (shift for several), search every column, faceted filters with counts, column visibility, row selection with a bulk-actions bar, a menu per row or its first actions as buttons in the row (async, with a spinner and a failure notice), row click, pagination with a page size, loading, empty and no-matches states, and cards on a phone. Opt in to expandable rows, row groups with subtotals, an aligned totals row, arrow-key navigation and a sticky first column. Client-side over rows, or driven by a server.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -62,7 +62,7 @@
   "docs": "Installed to components/makersclaw/blocks/data-table. Import: import { DataTable, useControllable, processRows, sortRows, searchRows, filterRows, facetOptions, nextSort, groupRows, groupValueOf } from \"@/components/makersclaw/blocks/data-table\". Props and an example: components/makersclaw/blocks/data-table/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A list of records to scan, find, sort and act on: invoices, customers, orders, leads, users, tickets. Not for records that move through stages (a board), a few key numbers (stats), or a grid of cards whose picture matters more than its columns."
     }
   }

package/r/diagram.json

@@ -5,7 +5,7 @@
   "title": "Diagram",
   "description": "Draws Mermaid text (flowcharts, sequence, class, state, ER, Gantt, pie, mind maps, timelines, git graphs…) in the workspace theme: the tokens are read from the page at run time and handed to Mermaid, so nodes, lines, text and chart colours are the theme's and follow light/dark. Zoom and pan (buttons, Cmd/Ctrl+scroll, pinch, drag, keys), fit to view, a Source tab with line numbers, copy the source or the SVG, download SVG. A mistake shows its line and Mermaid's words, and keeps the last drawing that worked. On the server the frame shows the Mermaid text.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [
     "mermaid@12.0.0"
@@ -67,7 +67,7 @@
   "docs": "Installed to components/makersclaw/blocks/diagram. Import: import { Diagram, diagramKind, diagramTitle, describeError, mermaidTheme } from \"@/components/makersclaw/blocks/diagram\". Props and an example: components/makersclaw/blocks/diagram/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A screen shows a diagram written as text: a process or decision flow an agent wrote, a sequence of API calls, a data model, a project timeline, an org or system sketch in docs, a mind map. Not for a board people arrange by hand (flow-canvas), freehand drawing (sketch-canvas), or charts of numbers (chart)."
     }
   }

package/r/doc-editor.json

@@ -5,7 +5,7 @@
   "title": "DocEditor",
   "description": "A Notion-style rich-text editor (BlockNote) painted in the workspace theme: headings, lists, checklists, quotes, code, tables, images and dividers from a / menu or markdown shortcuts, a formatting toolbar, drag handles; @mentions and {merge fields} as inline chips; a minimal mode for comment boxes with Cmd/Ctrl+Enter to submit. The document is BlockNote JSON; helpers turn it into markdown or plain text and read its checklist, fields and mentions.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [
     "@blocknote/core@0.55.0",
@@ -75,7 +75,7 @@
   "docs": "Installed to components/makersclaw/blocks/doc-editor. Import: import { DocEditor, useDocEditor, docToMarkdown, docToText, emptyDoc, isDocEmpty, docChecklist, setChecklistItem, docFields, docMentions } from \"@/components/makersclaw/blocks/doc-editor\". Props and an example: components/makersclaw/blocks/doc-editor/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A screen edits rich text: a wiki or doc page, notes on a record, a brief, meeting notes, an email body with merge fields, a comment field with mentions. The other text blocks (doc-page, record-notes, comment-box…) are built on it. Not for one line of plain text (the kit's Input) or a form of fields (record-form)."
     }
   }

package/r/doc-page.json

@@ -5,8 +5,8 @@
   "title": "DocPage",
   "description": "A Notion-style page: an emoji icon (picked from a grid), a big plain title, and the rich-text editor under it (doc-editor: / menu, markdown shortcuts, @mentions). Edits autosave through an async onSave a moment after typing stops, with Saved / Saving… / Couldn't save + Retry in the top bar, Cmd/Ctrl+S to save now and unsent edits sent when the page is left. A read-only mode shows the same page with nothing to edit; slots for a breadcrumb, actions and a meta line.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/doc-editor.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/doc-editor.json"
   ],
   "dependencies": [],
   "files": [
@@ -54,7 +54,7 @@
   "docs": "Installed to components/makersclaw/blocks/doc-page. Import: import { DocPage } from \"@/components/makersclaw/blocks/doc-page\". Props and an example: components/makersclaw/blocks/doc-page/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A screen is one document someone reads and writes: a wiki or handbook page, a playbook, a policy, a project page, a one-pager. The knowledge-base block puts a page tree beside it. Not for a short field of rich text inside a form (doc-editor), notes on a record (record-notes) or a comment (comment-box)."
     }
   }

package/r/email-render.json

@@ -5,7 +5,7 @@
   "title": "EmailRender",
   "description": "Email HTML from React (react-email) in the workspace theme: a layout with the 600px column and the inbox preview line, a header brand line, a footer with the address and unsubscribe link, buttons, headings and text, and DocEmail, which draws a doc-editor document as email markup (lists, quotes, code, tables, images, merge fields). Email cannot read CSS variables, so resolveEmailTheme reads the tokens where the editor sits and hands the email plain hex values; renderEmail returns { html, text }, in the browser for a preview and on the server for a send.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [
     "@react-email/components@1.0.12",
@@ -66,7 +66,7 @@
   "docs": "Installed to components/makersclaw/blocks/email-render. Import: import { EmailLayout, EmailCard, EmailHeader, EmailFooter, EmailButton, EmailHeading, EmailText, EmailDivider, EMAIL_WIDTH, DocEmail, fieldText, renderEmail, emailPlainText, EMAIL_TOKENS, EMAIL_FALLBACK, resolveEmailTheme, emailColor, emailFontStack, emailThemeKey, luminance, toHex } from \"@/components/makersclaw/blocks/email-render\". Props and an example: components/makersclaw/blocks/email-render/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "Code that must produce an email's HTML: a newsletter, a transactional email (receipt, invite, reset), a digest, a notification, a test send from an editor. newsletter-builder is built on it. Not for writing the email (doc-editor or email-composer), sending it (your sender or the app's server) or a web page (page-builder)."
     }
   }

package/r/faq.json

@@ -5,7 +5,7 @@
   "title": "FAQ",
   "description": "A marketing section of questions and answers: an accordion (one open at a time, or several), a grid of cards with optional icons, or a plain list with every answer shown; the title above or beside them, and an optional \"need more help?\" call to action. Loading and empty states.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -43,7 +43,7 @@
   "docs": "Installed to components/makersclaw/blocks/faq. Import: import { Faq } from \"@/components/makersclaw/blocks/faq\". Props and an example: components/makersclaw/blocks/faq/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "The questions section of a public page: a landing page, pricing, a help centre's front page, a product page. Not for a searchable help centre with articles and categories, or collapsible settings inside an app (use the kit's Accordion)."
     }
   }

package/r/file-upload.json

@@ -5,7 +5,7 @@
   "title": "FileUpload",
   "description": "Files chosen or dropped, each uploaded through your async onUpload(file, { onProgress, signal }) with a progress bar, cancel while it runs, a retry when it fails and a remove once done. Variants: a list of file cards, one file at a time, Uploading/Finished sections, image thumbnails (one or two columns), and a profile picture.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -47,7 +47,7 @@
   "docs": "Installed to components/makersclaw/blocks/file-upload. Import: import { FileUpload, formatSize, fileIcon } from \"@/components/makersclaw/blocks/file-upload\". Props and an example: components/makersclaw/blocks/file-upload/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A form or page takes files the app stores: attachments on a record, a CSV to import, product photos, a logo, a profile picture. Not for showing files already stored with no way to add (a table or list), and not for a chat message's attachments (the chat block's composer has those)."
     }
   }

package/r/first-run.json

@@ -5,7 +5,7 @@
   "title": "FirstRun",
   "description": "An app's first page, before anything is made, in working-tool style and not a landing page. In order, at the kit's normal sizes: one plain heading line and one line of what the app does; the first steps in a row as action cards, offered in a fixed order whatever order the app lists them in (the agent's way in first, then making the first thing yourself, then starting from the Library, then bringing it in from another tool; the first is the page's one main button, and a step with nothing to press is dropped); the starting points shelf (the app's LibraryShelf, passed as a node); what the agent will do by itself and the accounts it can use, side by side; and a worked example behind a \"See an example\" button, either revealed in place or handed to the app's own example mode, never filling the page. A node above the steps takes a Notice, a node after them a form. An agent step opens the agent's dock with a starting line and lets the agent ask for what it is missing; it never opens a form first. `npm run check` refuses an <h1> at 36px or more. The step order, the row width and the variants are exported as plain functions.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -56,7 +56,7 @@
   "docs": "Installed to components/makersclaw/blocks/first-run. Import: import { FirstRun, KINDS, columnsFor, orderChoices, stepsOf, stepsWords, variantFor } from \"@/components/makersclaw/blocks/first-run\". Props and an example: components/makersclaw/blocks/first-run/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "Every app's first run: the page an app opens on while it has nothing yet, replacing each app's own components/<app>/first-run.jsx or home hero (Project Roadmap's four start cards, Newsletter Engine's start page, Gantt Planner's hero). Not for a screen that shows data (that is the app's own home), not an empty list inside a screen (the kit's Empty), and not a setup checklist that stays on the page after the first run (setup-checklist)."
     }
   }

package/r/fix-note.json

@@ -5,9 +5,9 @@
   "title": "FixNote",
   "description": "\"The agent fixed this\": what the agent changed when a step of an automation failed, so the run still finished the same job. A sentence on why, the value as it was and as it is now, what the fix cost, and \"Keep this fix for next time\", which asks for a proposed change a person keeps or drops (nothing the agent proposes goes live by itself). It draws a run step's `fix`, says whether a write can be taken back (a send cannot), words a person's own edit of a run's data as theirs, and shows what became of the change the agent drafted: kept as a new version, dropped, or waiting. FixProposal is that drafted change on the automation itself, to keep or drop.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/agent-marks.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/automation-model.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/agent-marks.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/automation-model.json"
   ],
   "dependencies": [],
   "files": [
@@ -50,7 +50,7 @@
   "docs": "Installed to components/makersclaw/blocks/fix-note. Import: import { FixNote, FixProposal } from \"@/components/makersclaw/blocks/fix-note\". Props and an example: components/makersclaw/blocks/fix-note/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A run's screen shows a step the agent repaired: run-view and step-settings place it for you. Use it on its own in a needs-you list or an activity line about an automation."
     }
   }

package/r/flow-canvas.json

@@ -5,7 +5,7 @@
   "title": "FlowCanvas",
   "description": "A Miro-like board (React Flow) in the workspace theme: sticky notes, shapes, text, frames, cards and images on an infinite dotted canvas; a tool rail with shortcuts, double-click for a sticky, drag-out connectors that re-route as cards move, labels on connectors, a floating toolbar over the selection, right-click menu, undo/redo, copy/paste, snap to grid, minimap, list view and presentation mode. The board is plain JSON; helpers turn it into text or markdown and lay it out. Other blocks add their own node types and rail tools.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [
     "@xyflow/react@12.11.6"
@@ -86,7 +86,7 @@
   "docs": "Installed to components/makersclaw/blocks/flow-canvas. Import: import { FlowCanvas, useFlowCanvas, useCanvas, NodeShell, NodeHandles, EditableText, Palette, StickySwatch, ColorDot, ShapeGlyph, colorClasses, emptyBoard, createNode, createEdge, cleanBoard, boardToText, boardToMarkdown, autoLayout, snapToCell, frameContents, historyReducer, starterTemplates } from \"@/components/makersclaw/blocks/flow-canvas\". Props and an example: components/makersclaw/blocks/flow-canvas/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A screen where people arrange things spatially and connect them: a brainstorm, a flowchart or process map, an account or org map, a journey map, a retro, a planning board. The canvas blocks (account-map, process-map, journey-map, idea-board) are built on it. Not for freehand drawing (sketch-canvas), records in stage columns (board), or a chart of numbers (chart)."
     }
   }

package/r/flow-editor.json

@@ -5,9 +5,9 @@
   "title": "FlowEditor",
   "description": "An automation as a node canvas, in the app's theme: pan, zoom, fit and a map; icon cards with ports and curved connectors with arrowheads; a + on every connector and at every path's end; labelled Yes/No branches that meet again at a join; a dashed for-each box that folds to one card; the app's accent on agent and model steps (solid for the agent, outlined for a model call); a palette of the kinds; undo and redo; and an outline view of the same flow for a thumb or a keyboard. FlowEditor draws a definition and says what was pressed (insert, select, fold); FlowCanvas, StepOutline and Minimap are its parts. In a run it wears an overlay: each card shows how it went, the path taken is lit and the others dimmed, a card the agent fixed says so.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/automation-model.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/step-picker.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/automation-model.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/step-picker.json"
   ],
   "dependencies": [],
   "files": [
@@ -72,7 +72,7 @@
   "docs": "Installed to components/makersclaw/blocks/flow-editor. Import: import { FlowCanvas, FlowEditor, Minimap, StepOutline } from \"@/components/makersclaw/blocks/flow-editor\". Props and an example: components/makersclaw/blocks/flow-editor/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "An app shows what an automation does as a flow a member can read and change: a CRM's morning read, an inbox sweep, a nightly import, an event-driven workflow. For the whole page (header, panels, save) place automation-editor; for one run use run-view; for a read-only graph of a job's run top to bottom use workflow-view. Not a free-form board (flow-canvas) and not a mind map."
     }
   }

package/r/footer.json

@@ -5,7 +5,7 @@
   "title": "Footer",
   "description": "A public site's footer: brand and tagline, link columns or one row of links, social buttons in the kit's brand marks (X, LinkedIn, GitHub, YouTube, Instagram, Facebook), and the legal line with its links; optionally a newsletter sign-up with consent (validates, saves through an async onSubscribe returning { ok }, shows the failure), a call to action, a large brand statement, language and currency selects, and a version badge. Simple, columns or centred.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -45,7 +45,7 @@
   "docs": "Installed to components/makersclaw/blocks/footer. Import: import { Footer } from \"@/components/makersclaw/blocks/footer\". Props and an example: components/makersclaw/blocks/footer/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "The bottom of every page of a public site: a marketing site, a docs hub, a shop, a customer portal. Not for an app's own status bar or a toolbar pinned to the bottom of a screen."
     }
   }

package/r/gantt.json

@@ -5,8 +5,8 @@
   "title": "Gantt",
   "description": "The Gantt view of work, like Linear's timeline or TeamGantt: a task list on the left (groups that fold, subtasks indented under a summary bar) beside a timeline with a two-tier date header, bars coloured by project or status with their progress, milestones as diamonds, dependency arrows (red when the dates disagree), a today line and weekend shading. Drag a bar to move it, an edge to change its start or end, the dot past its end onto another bar to link them; tasks waiting on a moved one slide along while you drag and the finish date shows what the move cost. Zoom day, week, month or quarter; highlight the critical path; click an empty row to schedule an undated task; quick-add per group; arrow keys move a focused bar; search, filters, group and sort from the shared toolbar. One async onChange saves every change; failures roll back with a notice.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/task-model.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/task-model.json"
   ],
   "dependencies": [],
   "files": [
@@ -63,7 +63,7 @@
   "docs": "Installed to components/makersclaw/blocks/gantt. Import: import { Gantt, ZOOMS, ganttRange, headerTiers, planMove, afterBlockersPatch, isMilestone, summarySpan, arrowPath } from \"@/components/makersclaw/blocks/gantt\". Props and an example: components/makersclaw/blocks/gantt/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A screen that plans dated work and shows what waits on what: a launch plan, a project schedule, a content calendar with lead times, an office move, a release. Not for an undated to-do list (task-list), stage columns (board), or days on a month grid (calendar)."
     }
   }

package/r/job-panel.json

@@ -5,7 +5,7 @@
   "title": "JobPanel",
   "description": "The panel that follows work the founder asked the app's agent for (useJob): each step's label as it runs, Stop, \"Needs your answer\" with Answer while the agent waits on the founder, \"Queued · after …\" while it waits its turn, then done or the reason it stopped — and nothing on screen when no job runs. variant=\"generator\" wraps it in a prompt, the surface's options, Generate and a results shelf, with no model, provider or API key of its own.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -52,7 +52,7 @@
   "docs": "Installed to components/makersclaw/blocks/job-panel. Import: import { JobPanel } from \"@/components/makersclaw/blocks/job-panel\". Props and an example: components/makersclaw/blocks/job-panel/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A surface has a verb that asks the agent to make or find something (\"Generate a launch plan\", \"Find 20 leads\", \"Plan next sprint\") and the founder should watch it happen where the result will land. variant=\"generator\" when the screen IS the place to ask: a prompt and a few options, the results under them (product photos, ad copy, names)."
     }
   }

package/r/json-editor.json

@@ -5,8 +5,8 @@
   "title": "JsonEditor",
   "description": "A JSON editor in the workspace theme with two views of one value: a Tree of folding rows (edit a value or rename a key in place, add keys and items, change a type, copy a path, delete with Undo, arrow keys throughout) and Code (the code-editor block in JSON mode). Checked as it changes: the status line says what is wrong in plain words and which line, and clicking it goes there. A Format button, copy as pretty or one-line JSON, a friendly empty state with starters, and an optional Save that is optimistic and rolls back with a notice when it fails.",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json",
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/code-editor.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json",
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/code-editor.json"
   ],
   "dependencies": [],
   "files": [
@@ -59,7 +59,7 @@
   "docs": "Installed to components/makersclaw/blocks/json-editor. Import: import { JsonEditor, JsonTree, typeOf, pathLabel, getAt, setAt, removeAt, insertAt, renameKey, flattenTree, expandedTo, summary, preview } from \"@/components/makersclaw/blocks/json-editor\". Props and an example: components/makersclaw/blocks/json-editor/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "A screen edits or inspects a JSON value: an integration's settings, a webhook payload, a record's metadata or custom fields column (jsonb), an API response, feature flags. Not for editing SQL or other code (code-editor), a form of known fields (record-form), or a table of rows (data-table)."
     }
   }

package/r/library-shelf.json

@@ -5,7 +5,7 @@
   "title": "LibraryShelf",
   "description": "A shelf of starting points from the Library, in a few named columns (sales processes, follow-up emails, saved searches): each item its mark or cover, its name, one muted fact (\"6 stages\", \"PDF\") and a Use at its end. Use goes out through an async callback that answers { ok }; the item says it is being used, then Used, and the reason in place when it fails. It takes sections you shaped, or what useLibraryItems() returns (lib/hooks.js) with onUse(item): the collection's items with their covers, Show more, \"N more come with a paid plan\" on a preview, locked items without a Use, and a quiet \"not connected yet\".",
   "registryDependencies": [
-    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.3/r/core.json"
+    "https://cdn.jsdelivr.net/npm/makersclaw@0.8.4/r/core.json"
   ],
   "dependencies": [],
   "files": [
@@ -49,7 +49,7 @@
   "docs": "Installed to components/makersclaw/blocks/library-shelf. Import: import { LibraryShelf, libraryShelfItems } from \"@/components/makersclaw/blocks/library-shelf\". Props and an example: components/makersclaw/blocks/library-shelf/README.md. Makersclaw builds whole apps from these blocks: https://makersclaw.com",
   "meta": {
     "makersclaw": {
-      "version": "0.8.3",
+      "version": "0.8.4",
       "useWhen": "An empty or new screen that offers the app's own starting points from the Library (\"Start from a template\"): a CRM's starting processes and follow-up emails, a planner's templates, a deck app's starter decks, a growth app's examples. Not for a gallery of large previews (a card grid over useLibraryItems), a picker inside a form (Combobox) or the records themselves."
     }
   }