anentrypoint-design 0.0.326 → 0.0.328

package/README.md

@@ -164,6 +164,10 @@ Files: `FileIcon`, `FileRow`, `FileGrid`, `FileToolbar`, `DropZone`, `UploadProg
 
 All factories are pure: props in, WebJSX tree out. Component source is split per group under `src/components/<shell|content|chat>.js`; `src/components.js` is a re-export barrel. The 200-line cap applies per module.
 
+## chat stack layering
+
+The chat stack has four layers, and a consumer's entry point depends on how much they want to own. At the bottom, `chat-basic.css` and `chat-polish.css` (concatenated, in that order, into the published `app-shell.css` / bundled into `dist/247420.css`) supply all `.chat-*`/`.ds-chat-*` styling for the basic Chat/ChatMessage/ChatComposer/AICat components; a separate, standalone `chat.css` at the repo root carries only the `.agentchat-*` styles for the more advanced AgentChat surface and must be linked explicitly by anyone using it (only `ui_kits/workspace` does today). One level up, `src/components/chat-message-parts.js` is the shared, transport-agnostic renderer for a single message's `parts` array (text/code/image/markdown/tool-call parts) — it exists purely so `chat.js` and `agent-chat.js` never duplicate part-kind rendering logic; nobody consumes it directly. `src/components/chat.js` is the entry point for a simple, single-thread chat UI: it exports pure `Chat`/`ChatMessage`/`ChatComposer`/`AICat` factories (props in, vnode out, no transport) and is the right layer for any app that just needs a message thread and composer. `src/components/agent-chat.js` is the entry point for anyone building a multi-agent/tool-use orchestration UI (agent+model picker, streamed tool_use/tool_result parts, resume/cwd controls) — it wraps `chat.js`'s composer/message primitives and adds orchestration chrome, still holding zero transport itself (the host wires WebSocket/fetch/SSE via callbacks). Finally, `src/web-components/ds-chat.js` is the framework-free entry point: a self-registering `<ds-chat>` custom element wrapping `Chat`/`ChatComposer` behind a plain DOM API (`el.messages =`, a bubbling `send` event) for anyone who wants chat UI without touching webjsx or the factory API directly. In short: use `ds-chat.js` for a drop-in custom element, `chat.js` for webjsx-level control of a simple thread, `agent-chat.js` for orchestration UIs, and touch `chat-message-parts.js`/the CSS layers only when extending part-kinds or fixing visual rules.
+
 ## chat / markdown / code-highlight
 
 `Chat({ messages, onSend })` renders the bubble timeline; `ChatComposer({ onSend })` is the input row. Block markdown inside messages is sanitized through `renderMarkdown` (`marked@15.0.12` + `DOMPurify@3.2.6`, lazy-loaded from jsDelivr ESM on first call) and code blocks are highlighted by Prism (`prismjs@1.30.0`, lazy-loaded core + per-language scripts via `ensurePrism` / `highlightAllUnder`). Direct `innerHTML` from chat content is forbidden — DOMPurify is the only XSS gate.