npm - @kitn.ai/ui - Versions diffs - 0.28.0 → 0.29.0 - Mend

@kitn.ai/ui 0.28.0 → 0.29.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (376) hide show

package/README.md +1 -1
package/dist/agent-tooling/construct/public.d.ts +15 -0
package/dist/agent-tooling/construct/schema.d.ts +111 -0
package/dist/construct-cli.es.js +3 -3
package/dist/construct.d.ts +5 -0
package/dist/construct.js +327 -0
package/dist/core-C8fzo39E.js +1 -12
package/dist/engine-javascript-C1x7zo1_.js +1 -141
package/dist/mcp.es.js +1 -1
package/package.json +16 -16
package/bin/route.test.js +0 -58
package/src/agent-tooling/README.md +0 -192
package/src/agent-tooling/archetypes.ts +0 -205
package/src/agent-tooling/catalog/README.md +0 -676
package/src/agent-tooling/catalog/catalog-types.ts +0 -231
package/src/agent-tooling/catalog/fabrications.ts +0 -96
package/src/agent-tooling/catalog/invariants.ts +0 -284
package/src/agent-tooling/catalog/labs-titles.ts +0 -114
package/src/agent-tooling/catalog/scenarios.ts +0 -87
package/src/agent-tooling/catalog/surfaces.ts +0 -347
package/src/agent-tooling/construct/cli-entry.ts +0 -8
package/src/agent-tooling/construct/cli.ts +0 -147
package/src/agent-tooling/construct/codegen.ts +0 -1635
package/src/agent-tooling/construct/construct.v1.schema.json +0 -319
package/src/agent-tooling/construct/dev.ts +0 -148
package/src/agent-tooling/construct/fixtures/demo-widget.construct.json +0 -7
package/src/agent-tooling/construct/fixtures/ops-console.construct.json +0 -44
package/src/agent-tooling/construct/fixtures/owner-widget.construct.json +0 -32
package/src/agent-tooling/construct/schema.ts +0 -452
package/src/agent-tooling/integrations/anthropic.ts +0 -442
package/src/agent-tooling/integrations/cloudflare.ts +0 -218
package/src/agent-tooling/integrations/langgraph.ts +0 -133
package/src/agent-tooling/integrations/mastra.ts +0 -182
package/src/agent-tooling/integrations/mock.ts +0 -148
package/src/agent-tooling/integrations/ollama.ts +0 -97
package/src/agent-tooling/integrations/openai.ts +0 -95
package/src/agent-tooling/integrations/openrouter.ts +0 -82
package/src/agent-tooling/integrations/pi.ts +0 -176
package/src/agent-tooling/integrations/pydantic-ai.ts +0 -108
package/src/agent-tooling/integrations/vercel-ai-sdk.ts +0 -398
package/src/agent-tooling/mcp/css-raw.d.ts +0 -12
package/src/agent-tooling/mcp/manifest.ts +0 -422
package/src/agent-tooling/mcp/server.ts +0 -116
package/src/agent-tooling/mcp/stdio.ts +0 -18
package/src/agent-tooling/mcp/tools/construct.ts +0 -130
package/src/agent-tooling/mcp/tools/debug.ts +0 -621
package/src/agent-tooling/mcp/tools/reference.ts +0 -980
package/src/agent-tooling/mcp/tools/scaffold.ts +0 -6708
package/src/agent-tooling/mcp/tools/theme.ts +0 -456
package/src/agent-tooling/mcp/tools/types.ts +0 -14
package/src/agent-tooling/mcp/validate-args.ts +0 -141
package/src/agent-tooling/recipes/composed-thread.ts +0 -714
package/src/agent-tooling/recipes/index.ts +0 -22
package/src/agent-tooling/recipes/types.ts +0 -32
package/src/agent-tooling/registry.ts +0 -132
package/src/agent-tooling/route-emit.ts +0 -305
package/src/agent-tooling/types.ts +0 -390
package/src/components/artifact-card.tsx +0 -120
package/src/components/artifact.tsx +0 -914
package/src/components/attachment-types.ts +0 -66
package/src/components/attachments.tsx +0 -536
package/src/components/audio-visualizer/audio-visualizer.voice-fixture.ts +0 -257
package/src/components/audio-visualizer/aurora.glsl.ts +0 -330
package/src/components/audio-visualizer/fit-scale.ts +0 -112
package/src/components/audio-visualizer/index.tsx +0 -528
package/src/components/audio-visualizer/labs/lab-choreography.ts +0 -187
package/src/components/audio-visualizer/labs/lab-shaders.ts +0 -363
package/src/components/audio-visualizer/labs/lab-visualizer.tsx +0 -102
package/src/components/audio-visualizer/shader-canvas.tsx +0 -876
package/src/components/audio-visualizer/sizes.ts +0 -54
package/src/components/audio-visualizer/variant-aurora.tsx +0 -305
package/src/components/audio-visualizer/variant-bar.tsx +0 -175
package/src/components/audio-visualizer/variant-custom.tsx +0 -344
package/src/components/audio-visualizer/variant-grid.tsx +0 -175
package/src/components/audio-visualizer/variant-radial.tsx +0 -163
package/src/components/audio-visualizer/variant-wave.tsx +0 -130
package/src/components/audio-visualizer/wave.glsl.ts +0 -130
package/src/components/card-fallback.tsx +0 -60
package/src/components/card-renderer.tsx +0 -220
package/src/components/card.tsx +0 -212
package/src/components/chain-of-thought.tsx +0 -348
package/src/components/chat-container.tsx +0 -89
package/src/components/chat-scope-picker.tsx +0 -57
package/src/components/chat-thread.tsx +0 -1014
package/src/components/checkpoint.tsx +0 -88
package/src/components/choice-card.tsx +0 -743
package/src/components/coachmark.tsx +0 -249
package/src/components/code-block.tsx +0 -181
package/src/components/composer-dom.ts +0 -159
package/src/components/composer-highlight.ts +0 -242
package/src/components/composer-history.ts +0 -82
package/src/components/composer.tsx +0 -1075
package/src/components/confirm-card.tsx +0 -402
package/src/components/context.tsx +0 -377
package/src/components/conversation-item.tsx +0 -241
package/src/components/conversation-list.tsx +0 -429
package/src/components/conversation-panel.tsx +0 -118
package/src/components/dismissed-stub.tsx +0 -80
package/src/components/embed.tsx +0 -200
package/src/components/empty.tsx +0 -177
package/src/components/feedback-bar.tsx +0 -166
package/src/components/file-tree.tsx +0 -530
package/src/components/file-upload.tsx +0 -167
package/src/components/form-widgets.tsx +0 -525
package/src/components/form.tsx +0 -1296
package/src/components/home-panel.tsx +0 -159
package/src/components/image.tsx +0 -65
package/src/components/link-preview.tsx +0 -195
package/src/components/loader.tsx +0 -367
package/src/components/markdown.tsx +0 -162
package/src/components/message-skills.tsx +0 -40
package/src/components/message.tsx +0 -765
package/src/components/model-switcher.tsx +0 -132
package/src/components/prompt-input.tsx +0 -188
package/src/components/prompt-suggestion.tsx +0 -150
package/src/components/reasoning.tsx +0 -293
package/src/components/response-compare-types.ts +0 -152
package/src/components/response-compare.tsx +0 -455
package/src/components/response-stream.tsx +0 -109
package/src/components/screen.tsx +0 -181
package/src/components/scroll-button.tsx +0 -93
package/src/components/source.tsx +0 -192
package/src/components/tasks-card.tsx +0 -801
package/src/components/text-shimmer.tsx +0 -37
package/src/components/thinking-bar.tsx +0 -50
package/src/components/thread.tsx +0 -228
package/src/components/toast.tsx +0 -503
package/src/components/tool-classify.ts +0 -26
package/src/components/tool-types.ts +0 -49
package/src/components/tool.tsx +0 -190
package/src/components/use-card-resolution.ts +0 -44
package/src/components/voice-input.tsx +0 -222
package/src/components/voice-output.tsx +0 -242
package/src/components/widget-tab-bar.tsx +0 -73
package/src/components/workspace-shell.tsx +0 -285
package/src/diagnostics/hook.ts +0 -352
package/src/diagnostics/index.ts +0 -82
package/src/diagnostics/report-request.ts +0 -296
package/src/elements/agent-card.tsx +0 -67
package/src/elements/artifact.tsx +0 -194
package/src/elements/attachments.tsx +0 -140
package/src/elements/audio-visualizer.tsx +0 -227
package/src/elements/autoloader.ts +0 -89
package/src/elements/avatar.tsx +0 -33
package/src/elements/badge.tsx +0 -32
package/src/elements/button.tsx +0 -149
package/src/elements/card.tsx +0 -133
package/src/elements/cards.tsx +0 -266
package/src/elements/chain-of-thought.tsx +0 -141
package/src/elements/chat-scope-picker.tsx +0 -65
package/src/elements/chat-types.ts +0 -102
package/src/elements/chat-workspace.tsx +0 -188
package/src/elements/chat.tsx +0 -304
package/src/elements/checkbox-group.tsx +0 -164
package/src/elements/checkbox.tsx +0 -134
package/src/elements/checkpoint.tsx +0 -47
package/src/elements/choice.tsx +0 -100
package/src/elements/coachmark.tsx +0 -90
package/src/elements/code-block.tsx +0 -60
package/src/elements/command.tsx +0 -197
package/src/elements/compare.tsx +0 -111
package/src/elements/compiled.css +0 -2
package/src/elements/composer.tsx +0 -162
package/src/elements/confirm-card.tsx +0 -76
package/src/elements/context-meter.tsx +0 -107
package/src/elements/conversation-item.tsx +0 -120
package/src/elements/conversation-list.tsx +0 -203
package/src/elements/css.ts +0 -5
package/src/elements/default-input.tsx +0 -392
package/src/elements/define-entry.ts +0 -12
package/src/elements/define.tsx +0 -563
package/src/elements/diagnostic-events.ts +0 -114
package/src/elements/dialog.tsx +0 -145
package/src/elements/disclosure.ts +0 -95
package/src/elements/dock.tsx +0 -215
package/src/elements/dropdown.tsx +0 -123
package/src/elements/editable-label.tsx +0 -140
package/src/elements/element-data-types.ts +0 -152
package/src/elements/element-diagnostics.ts +0 -392
package/src/elements/element-manifest.json +0 -354
package/src/elements/element-nonscalar.json +0 -187
package/src/elements/element-types.d.ts +0 -4353
package/src/elements/embed.tsx +0 -35
package/src/elements/empty.tsx +0 -29
package/src/elements/feedback-bar.tsx +0 -66
package/src/elements/file-tree.tsx +0 -62
package/src/elements/file-upload.tsx +0 -44
package/src/elements/form.tsx +0 -94
package/src/elements/hover-card.tsx +0 -80
package/src/elements/icon.tsx +0 -41
package/src/elements/image.tsx +0 -32
package/src/elements/input.tsx +0 -492
package/src/elements/kbd.tsx +0 -45
package/src/elements/link-preview.tsx +0 -34
package/src/elements/loader.tsx +0 -25
package/src/elements/markdown.tsx +0 -38
package/src/elements/menu.tsx +0 -241
package/src/elements/message-skills.tsx +0 -83
package/src/elements/message.tsx +0 -361
package/src/elements/model-switcher.tsx +0 -121
package/src/elements/nav.tsx +0 -87
package/src/elements/notice.tsx +0 -53
package/src/elements/pane-grid.tsx +0 -111
package/src/elements/pane-group.tsx +0 -119
package/src/elements/pane.tsx +0 -129
package/src/elements/popover.tsx +0 -81
package/src/elements/progress-bar.tsx +0 -39
package/src/elements/prompt-dock.tsx +0 -82
package/src/elements/prompt-input.tsx +0 -240
package/src/elements/prompt-suggestions.tsx +0 -113
package/src/elements/radio-group.tsx +0 -129
package/src/elements/reasoning.tsx +0 -71
package/src/elements/register-impl.ts +0 -148
package/src/elements/register.ts +0 -76
package/src/elements/remote.tsx +0 -225
package/src/elements/resizable.globals.d.ts +0 -36
package/src/elements/resizable.tsx +0 -704
package/src/elements/response-stream.tsx +0 -40
package/src/elements/screen.tsx +0 -90
package/src/elements/scroll-area.tsx +0 -33
package/src/elements/scroll-button.tsx +0 -179
package/src/elements/search.tsx +0 -185
package/src/elements/segmented.tsx +0 -129
package/src/elements/select.tsx +0 -165
package/src/elements/separator.tsx +0 -36
package/src/elements/setting-item.tsx +0 -50
package/src/elements/settings-group.tsx +0 -37
package/src/elements/skeleton.tsx +0 -45
package/src/elements/slider.tsx +0 -171
package/src/elements/slot-text.ts +0 -73
package/src/elements/slots.ts +0 -787
package/src/elements/source.tsx +0 -126
package/src/elements/status.tsx +0 -42
package/src/elements/styles.css +0 -328
package/src/elements/switch.tsx +0 -118
package/src/elements/tabs.tsx +0 -95
package/src/elements/tasks.tsx +0 -103
package/src/elements/text-shimmer.tsx +0 -28
package/src/elements/thinking-bar.tsx +0 -43
package/src/elements/thread.tsx +0 -139
package/src/elements/toast.tsx +0 -106
package/src/elements/tool.tsx +0 -78
package/src/elements/tooltip.tsx +0 -85
package/src/elements/validate-messages.ts +0 -76
package/src/elements/voice-input.tsx +0 -100
package/src/elements/voice-output.tsx +0 -82
package/src/index.ts +0 -430
package/src/primitives/audio-bands.ts +0 -174
package/src/primitives/card-component-types.ts +0 -63
package/src/primitives/card-contract.ts +0 -80
package/src/primitives/card-data-types.ts +0 -361
package/src/primitives/card-host.tsx +0 -37
package/src/primitives/card-recovery.ts +0 -160
package/src/primitives/card-registry.tsx +0 -78
package/src/primitives/card-resolution.ts +0 -36
package/src/primitives/card-routing.ts +0 -85
package/src/primitives/card-schemas/artifact.schema.json +0 -92
package/src/primitives/card-schemas/card-envelope.schema.json +0 -14
package/src/primitives/card-schemas/card-event.schema.json +0 -12
package/src/primitives/card-schemas/choice.schema.json +0 -75
package/src/primitives/card-schemas/confirm.schema.json +0 -65
package/src/primitives/card-schemas/embed.schema.json +0 -63
package/src/primitives/card-schemas/form.result.schema.json +0 -7
package/src/primitives/card-schemas/form.schema.json +0 -53
package/src/primitives/card-schemas/link.schema.json +0 -54
package/src/primitives/card-schemas/tasks.result.schema.json +0 -16
package/src/primitives/card-schemas/tasks.schema.json +0 -83
package/src/primitives/card-tags.ts +0 -61
package/src/primitives/card-validate-cards.ts +0 -255
package/src/primitives/card-validate-schemas.ts +0 -58
package/src/primitives/card-validate.ts +0 -131
package/src/primitives/chat-config.tsx +0 -103
package/src/primitives/composer-model.ts +0 -49
package/src/primitives/composer-triggers.ts +0 -35
package/src/primitives/controllable.ts +0 -21
package/src/primitives/conversation-store.ts +0 -248
package/src/primitives/create-kai-chat.ts +0 -66
package/src/primitives/create-tween.ts +0 -266
package/src/primitives/embed-providers.ts +0 -254
package/src/primitives/field-mask.ts +0 -256
package/src/primitives/field-semantics.ts +0 -115
package/src/primitives/highlighter.ts +0 -157
package/src/primitives/input-mask.ts +0 -853
package/src/primitives/link-preview.ts +0 -87
package/src/primitives/message-feedback.ts +0 -124
package/src/primitives/pdf-preview.ts +0 -121
package/src/primitives/toast-store.ts +0 -338
package/src/primitives/url-scheme-policy.ts +0 -70
package/src/primitives/use-audio-analysis.ts +0 -340
package/src/primitives/use-auto-resize.ts +0 -31
package/src/primitives/use-resize-observer.ts +0 -45
package/src/primitives/use-sequencer.ts +0 -72
package/src/primitives/use-speech-recognition.ts +0 -146
package/src/primitives/use-stick-to-bottom.ts +0 -75
package/src/primitives/use-text-stream.ts +0 -143
package/src/primitives/use-voice-recorder.ts +0 -62
package/src/primitives/visualizer-sequences.ts +0 -350
package/src/remote/host-embed.ts +0 -345
package/src/remote/index.ts +0 -2
package/src/remote/origin.ts +0 -30
package/src/remote/provider-runtime.ts +0 -262
package/src/remote/provider.ts +0 -2
package/src/remote/validate.ts +0 -22
package/src/remote/version.ts +0 -12
package/src/remote/wire.ts +0 -48
package/src/schemas/from-tool-call.ts +0 -151
package/src/schemas/index.ts +0 -341
package/src/schemas/provider-subsets.ts +0 -538
package/src/schemas/registry.ts +0 -355
package/src/schemas/tool-defs.ts +0 -793
package/src/solid.ts +0 -173
package/src/state/index.ts +0 -44
package/src/state/messages.ts +0 -53
package/src/state/mock.ts +0 -297
package/src/state/parts.ts +0 -295
package/src/state/persistence.ts +0 -180
package/src/state/stream.ts +0 -246
package/src/state/suggestions.ts +0 -9
package/src/state/threads.ts +0 -142
package/src/test-utils/fake-clock.ts +0 -88
package/src/types.ts +0 -95
package/src/ui/action-icons.ts +0 -53
package/src/ui/agent-card.tsx +0 -218
package/src/ui/avatar.tsx +0 -23
package/src/ui/badge.tsx +0 -21
package/src/ui/button.tsx +0 -49
package/src/ui/card.tsx +0 -245
package/src/ui/checkbox-group.tsx +0 -153
package/src/ui/checkbox.tsx +0 -63
package/src/ui/collapsible.tsx +0 -163
package/src/ui/command.tsx +0 -103
package/src/ui/dialog.tsx +0 -223
package/src/ui/dock.tsx +0 -630
package/src/ui/dropdown.tsx +0 -636
package/src/ui/editable-label.tsx +0 -112
package/src/ui/hover-card.tsx +0 -345
package/src/ui/icon.tsx +0 -167
package/src/ui/input.tsx +0 -391
package/src/ui/kbd.tsx +0 -118
package/src/ui/nav.tsx +0 -282
package/src/ui/notice.tsx +0 -84
package/src/ui/overlay.tsx +0 -277
package/src/ui/pane-grid.tsx +0 -117
package/src/ui/pane-group.tsx +0 -291
package/src/ui/pane.tsx +0 -193
package/src/ui/popover.tsx +0 -106
package/src/ui/progress-bar.tsx +0 -83
package/src/ui/prompt-dock.tsx +0 -145
package/src/ui/radio.tsx +0 -150
package/src/ui/resizable.tsx +0 -693
package/src/ui/scroll-area.tsx +0 -26
package/src/ui/segmented.tsx +0 -109
package/src/ui/select.tsx +0 -168
package/src/ui/separator.tsx +0 -10
package/src/ui/settings-group.tsx +0 -67
package/src/ui/skeleton.tsx +0 -73
package/src/ui/slider.tsx +0 -178
package/src/ui/status.tsx +0 -48
package/src/ui/switch.tsx +0 -119
package/src/ui/tabs.tsx +0 -168
package/src/ui/textarea.tsx +0 -21
package/src/ui/tooltip.tsx +0 -118
package/src/utils/cn.ts +0 -30
package/src/wire/chunk.ts +0 -248
package/src/wire/consume.ts +0 -599
package/src/wire/diagnostics.ts +0 -727
package/src/wire/encode-probe.ts +0 -214
package/src/wire/encode.ts +0 -947
package/src/wire/files.ts +0 -342
package/src/wire/formats/anthropic.ts +0 -274
package/src/wire/formats/openai.ts +0 -228
package/src/wire/index.ts +0 -95
package/src/wire/media-types.ts +0 -344
package/src/wire/read.ts +0 -396
package/src/wire/sink-helpers.ts +0 -50
package/src/wire/sse.ts +0 -153

package/src/agent-tooling/recipes/composed-thread.ts DELETED Viewed

@@ -1,714 +0,0 @@
-import type { CodeRecipe } from './types';
-/**
- * composed-thread — a chat surface hand-composed from standalone elements,
- * with `<kai-chat>` deliberately absent (rung-6 finding F-49).
- *
- * PROVENANCE: derived from the rung-6 clean-room build
- * (docs/superpowers/research/2026-08-25-rung-6-front-door/app on main), which
- * was independently smoke-verified 22/22 — with its ONE recorded defect
- * corrected before it became a teaching artifact: the builder shipped
- * `AttachmentData.url = URL.createObjectURL(file)` (finding F-44, the exact
- * PR #186 defect), and this recipe stages every picked file as a `data:` URI
- * instead, the pattern `src/elements/default-input.tsx` uses and the wire
- * encoders require. `verify:scaffold` compiles the module below with a stock
- * consumer tsconfig AND asserts the object-URL line has not grown back.
- *
- * The catalog half of this recipe — ingredients, wiring edges, invariants —
- * lives in `../catalog/surfaces.ts` under the same id, where every edge is
- * EXECUTED by surfaces.test.ts. This module carries what a data record cannot:
- * the complete, compiling host code.
- */
-export const composedThread: CodeRecipe = {
-  id: 'composed-thread',
-  title: 'Hand-composed thread (no kai-chat)',
-  intent:
-    'A full chat surface composed from standalone elements — kai-thread renders the ' +
-    'transcript, kai-composer takes input, kai-attachments stages files, kai-toast-region ' +
-    'notifies, kai-conversation-item rows form the rail — with a host module doing every ' +
-    'bit of wiring (host-coordinates: the kit has no store). Streams through ' +
-    'createAssistantStream + createMockResponder, so it runs with no backend and no key; ' +
-    'swapping the mock for a real /api/chat changes one line.',
-  ingredients: [
-    'kai-thread',
-    'kai-composer',
-    'kai-attachments',
-    'kai-toast-region',
-    'kai-conversation-item',
-    'kai-feedback-bar',
-  ],
-  notes: [
-    '`<kai-composer>` is the BARE editing surface — no send button, no attachments. The ' +
-      'paperclip, the hidden file input, the staging tray and the send button here are the ' +
-      "host's. For the batteries-included composer row, use `<kai-prompt-input>` instead.",
-    'Attachments are staged as `data:` URIs, NEVER as object URLs (`createObjectURL`). A ' +
-      '`blob:` URL resolves only inside the tab that minted it; `toOpenAIMessages` / ' +
-      '`toAnthropicMessages` refuse it with a written reason, and before they refused it an ' +
-      'attachment-only turn reached the model as nothing at all.',
-    'The HOST resolves tool calls. The mock (like a real provider) only ANNOUNCES one — ' +
-      'walk `result.toolCalls` after the read and call `stream.upsertTool(id, { state: ' +
-      "'output-available', output })`, or the panel sits at input-available forever.",
-    'The toast region is driven as DATA (`toasts` property, `kai-dismiss` event) because ' +
-      'this app places its own `<kai-toast-region>` and owns the array. Note: `toast()` ' +
-      'ADOPTS a markup-placed region (it creates its own only when none exists) and binds ' +
-      'its store over `toasts`, replacing a data-driven array — so per region, own the ' +
-      'array or call `toast()`, not both.',
-    'A standalone `<kai-conversation-item>` (outside `<kai-conversations>`) activates ' +
-      'itself: its body is a tabbable button and click / Enter / Space fire `kai-select` ' +
-      'on the item with `{ id }` (non-bubbling — listen on the item). What it does NOT ' +
-      "carry is the container's list story — roving tabindex and arrow-key traversal " +
-      'stay yours in a hand-rolled rail.',
-    '`<kai-thread>` fills the height its parent gives it and scrolls internally, which is ' +
-      'why `.pane` is a flex column and `.thread` is `flex: 1; min-height: 0`.',
-  ],
-  files: [
-    {
-      path: 'index.html',
-      lang: 'html',
-      code: `<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Composed thread</title>
-    <link rel="stylesheet" href="/src/styles.css" />
-  </head>
-  <body>
-    <!-- The thread is composed by hand from standalone kai-* elements;
-         the kai-chat drop-in is deliberately absent from this app. -->
-    <div class="app">
-      <aside class="rail">
-        <div class="rail-head">
-          <span class="rail-title">Conversations</span>
-          <button id="new-chat" class="ghost-btn" type="button">New</button>
-        </div>
-        <!-- kai-conversation-item rows are created in src/main.ts -->
-        <nav id="conversations" class="rail-list" aria-label="Conversations"></nav>
-      </aside>
-      <main class="pane">
-        <header class="pane-head">
-          <h1 id="pane-title">New chat</h1>
-          <span class="badge">mock responder — no provider contacted</span>
-        </header>
-        <kai-thread id="thread" class="thread" prose-size="sm">
-          <div slot="empty" class="empty">
-            <strong>Compose a message</strong>
-            <p>Attach a file with the paperclip and send it — it renders on your message.</p>
-          </div>
-        </kai-thread>
-        <!-- Shown once an assistant turn settles. -->
-        <kai-feedback-bar
-          id="feedback"
-          class="feedback"
-          hidden
-          bar-title="Was this reply helpful?"
-          collect-detail
-          detail-title="What went wrong?"
-          detail-placeholder="Optional details…"
-          submit-label="Send feedback"
-          thanks-message="Thanks — logged locally."
-        ></kai-feedback-bar>
-        <div class="composer-bar">
-          <!-- Staged (not yet sent) attachments. kai-composer has no attachment
-               support of its own, so the tray + the picker below are ours. -->
-          <kai-attachments
-            id="staged"
-            class="staged"
-            variant="inline"
-            removable
-            hover-card
-            show-media-type
-            hidden
-          ></kai-attachments>
-          <div class="composer-row">
-            <button id="attach" class="icon-btn" type="button" title="Attach a file" aria-label="Attach a file">
-              <svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21.44 11.05l-9.19 9.19a6 6 0 01-8.49-8.49l9.19-9.19a4 4 0 015.66 5.66l-9.2 9.19a2 2 0 01-2.83-2.83l8.49-8.48"/></svg>
-            </button>
-            <input id="file-input" type="file" multiple hidden />
-            <kai-composer
-              id="composer"
-              class="composer"
-              placeholder="Ask anything…  (Enter to send)"
-            ></kai-composer>
-            <button id="send" class="send-btn" type="button">Send</button>
-          </div>
-        </div>
-      </main>
-    </div>
-    <!-- Placed explicitly rather than letting toast() auto-mount one. -->
-    <kai-toast-region id="toasts" position="bottom-right" appearance="card"></kai-toast-region>
-    <script type="module" src="/src/main.ts"></script>
-  </body>
-</html>
-`,
-    },
-    {
-      path: 'src/main.ts',
-      lang: 'ts',
-      code: `// The whole app: a chat surface composed by hand from standalone kai-*
-// elements. <kai-chat> is deliberately not used — kai-thread renders the
-// transcript, kai-composer takes input, and this module is the host that
-// wires one to the other (the kit has no store: host-coordinates).
-import '@kitn.ai/ui/elements'; // registers every <kai-*>; must come first
-import '@kitn.ai/ui/theme.tokens.css';
-import type {
-  AttachmentData,
-  ChatMessage,
-  KaiAttachmentsElement,
-  KaiComposerElement,
-  KaiConversationItemElement,
-  KaiFeedbackBarElement,
-  KaiThreadElement,
-  KaiToastRegionElement,
-  MessagePart,
-  ToastItem,
-} from '@kitn.ai/ui/elements';
-import { createAssistantStream, createMockResponder } from '@kitn.ai/ui/state';
-import { readOpenAIStream } from '@kitn.ai/ui/wire';
-// ── the fake model ──────────────────────────────────────────────────────────
-// No key, no network, no provider. createMockResponder yields real OpenAI
-// chat-completions SSE frames that readOpenAIStream parses on exactly the path
-// a live route would take. Replies cycle one per turn; the third scripts a
-// tool call so the thread's tool panel gets exercised too.
-const mockResponse = createMockResponder({
-  replies: [
-    'Hey — this thread is composed from standalone \`kai-*\` elements: ' +
-      '\`kai-thread\` for the transcript, \`kai-composer\` for input, and a host ' +
-      'module wiring them together.\\n\\nAttach a file with the paperclip and send it.',
-    'Got it. Anything you attach is staged in \`kai-attachments\` next to the ' +
-      'composer, then rides along as a \`file\` part on the message you send.',
-    {
-      text: 'Let me look that up.',
-      toolCalls: [
-        { name: 'search_docs', arguments: { query: 'composing a kai thread', limit: 3 } },
-      ],
-    },
-    'Streaming, tool calls, attachments and toasts all run through the same ' +
-      'host wiring — swapping the mock for a real \`/api/chat\` changes one line.',
-  ],
-  chunkSize: 2,
-});
-// ── conversations ───────────────────────────────────────────────────────────
-interface Conversation {
-  id: string;
-  title: string;
-  messages: ChatMessage[];
-}
-const conversations: Conversation[] = [
-  { id: crypto.randomUUID(), title: 'New chat', messages: [] },
-];
-let activeId = conversations[0].id;
-const active = (): Conversation =>
-  conversations.find((c) => c.id === activeId) ?? conversations[0];
-// ── element handles (typed once, after upgrade) ─────────────────────────────
-const el = <T extends HTMLElement>(id: string): T =>
-  document.getElementById(id) as T;
-/** A picked File as a \`data:\` URI — the ONE form every consumer of
- *  \`AttachmentData.url\` accepts.
- *
- *  NOT an object URL: a \`blob:\` URL resolves only inside the tab that minted
- *  it, so it renders a perfect preview here and is meaningless to anything
- *  downstream — \`toOpenAIMessages\` / \`toAnthropicMessages\` refuse it with a
- *  written reason, and before they refused it an attachment-only turn reached
- *  the model as nothing at all. A data URI previews identically, survives a
- *  reload, needs no revocation bookkeeping, and is what both providers take. */
-const readAsDataUrl = (file: File): Promise<string> =>
-  new Promise((resolve, reject) => {
-    const reader = new FileReader();
-    reader.onload = () => resolve(String(reader.result));
-    reader.onerror = () => reject(reader.error ?? new Error('Could not read ' + file.name));
-    reader.readAsDataURL(file);
-  });
-let staged: AttachmentData[] = [];
-let sending = false;
-async function main() {
-  // kai-* register through an async dynamic import (SSR-safety), so a property
-  // set before the upgrade is dropped. Wait for every element this host drives.
-  await Promise.all(
-    [
-      'kai-thread',
-      'kai-composer',
-      'kai-attachments',
-      'kai-conversation-item',
-      'kai-feedback-bar',
-      'kai-toast-region',
-    ].map((tag) => customElements.whenDefined(tag)),
-  );
-  const thread = el<KaiThreadElement>('thread');
-  const composer = el<KaiComposerElement>('composer');
-  const stagedEl = el<KaiAttachmentsElement>('staged');
-  const feedback = el<KaiFeedbackBarElement>('feedback');
-  const toastRegion = el<KaiToastRegionElement>('toasts');
-  const rail = el<HTMLElement>('conversations');
-  const title = el<HTMLElement>('pane-title');
-  const sendBtn = el<HTMLButtonElement>('send');
-  const attachBtn = el<HTMLButtonElement>('attach');
-  const fileInput = el<HTMLInputElement>('file-input');
-  // ── toasts ────────────────────────────────────────────────────────────────
-  // Driven as data rather than through the imperative toast(), because this app
-  // places its own <kai-toast-region> and owns the list. Don't ALSO call
-  // toast(): it would adopt this region and bind its own store over the
-  // toasts property, replacing the array this module owns.
-  let toasts: ToastItem[] = [];
-  const setToasts = (next: ToastItem[]) => {
-    toasts = next;
-    toastRegion.toasts = toasts; // new array reference every time
-  };
-  const notify = (message: string, item: Partial<ToastItem> = {}) =>
-    setToasts([...toasts, { id: crypto.randomUUID(), message, duration: 4000, ...item }]);
-  toastRegion.addEventListener('kai-dismiss', (event) => {
-    const { id } = (event as CustomEvent<{ id: string }>).detail;
-    setToasts(toasts.filter((t) => t.id !== id));
-  });
-  // ── rendering ─────────────────────────────────────────────────────────────
-  // Reassign, never mutate: the array reference is what tells the element
-  // something changed, and the row keys are the message objects themselves.
-  const setMessages = (next: ChatMessage[]) => {
-    active().messages = next;
-    thread.messages = next;
-  };
-  function renderRail() {
-    rail.replaceChildren(
-      ...conversations.map((conversation) => {
-        const row = document.createElement(
-          'kai-conversation-item',
-        ) as KaiConversationItemElement;
-        row.conversationId = conversation.id;
-        row.active = conversation.id === activeId;
-        row.compact = true;
-        row.textContent = conversation.title;
-        const meta = document.createElement('span');
-        meta.slot = 'meta';
-        meta.textContent = conversation.messages.length
-          ? conversation.messages.length + ' messages'
-          : 'Empty';
-        row.append(meta);
-        // Standalone rows activate THEMSELVES: outside <kai-conversations>
-        // the item's body is a tabbable button and click / Enter / Space fire
-        // kai-select on the item (non-bubbling — listen on the row, and take
-        // the id from detail rather than re-deriving it). What standalone rows
-        // do not get is the container's LIST story: roving tabindex and
-        // arrow-key traversal stay yours in a hand-rolled rail.
-        row.addEventListener('kai-select', (e) => {
-          select((e as CustomEvent<{ id: string }>).detail.id);
-        });
-        return row;
-      }),
-    );
-  }
-  function select(id: string) {
-    activeId = id;
-    const conversation = active();
-    title.textContent = conversation.title;
-    thread.messages = conversation.messages;
-    feedback.hidden = true;
-    renderRail();
-    composer.focus();
-  }
-  function renderStaged() {
-    stagedEl.items = staged; // JS property, new array each time
-    stagedEl.hidden = staged.length === 0;
-  }
-  // ── attaching a file ──────────────────────────────────────────────────────
-  // kai-composer has no attachment affordance of its own (unlike
-  // kai-prompt-input), so the picker and the staging tray are the host's.
-  attachBtn.addEventListener('click', () => fileInput.click());
-  fileInput.addEventListener('change', () => {
-    const picked = [...(fileInput.files ?? [])];
-    fileInput.value = ''; // so the same file can be picked twice
-    if (!picked.length) return;
-    void (async () => {
-      const added = await Promise.all(
-        picked.map(
-          async (file): Promise<AttachmentData> => ({
-            id: crypto.randomUUID(),
-            type: 'file',
-            filename: file.name,
-            mediaType: file.type || 'application/octet-stream',
-            url: await readAsDataUrl(file), // data: URI — see readAsDataUrl
-          }),
-        ),
-      );
-      staged = [...staged, ...added];
-      renderStaged();
-      notify(
-        picked.length === 1 ? 'Attached ' + picked[0].name : 'Attached ' + picked.length + ' files',
-        { variant: 'success' },
-      );
-    })();
-    composer.focus();
-  });
-  stagedEl.addEventListener('kai-remove', (event) => {
-    const { id } = (event as CustomEvent<{ id: string }>).detail;
-    // A data: URI needs no revocation — dropping the item is the whole cleanup.
-    staged = staged.filter((item) => item.id !== id);
-    renderStaged();
-  });
-  // ── sending ───────────────────────────────────────────────────────────────
-  sendBtn.addEventListener('click', () => composer.send());
-  composer.addEventListener('kai-submit', (event) => {
-    const { text } = (event as CustomEvent<{ text: string }>).detail;
-    void send(text);
-  });
-  async function send(rawText: string) {
-    const text = rawText.trim();
-    // An attachment on its own is a legitimate message; empty + empty is not.
-    if (sending || (!text && !staged.length)) return;
-    const attachments = staged;
-    staged = [];
-    renderStaged();
-    composer.clear();
-    // A message's content is an ordered parts array — the file parts sit after
-    // the text, which is how kai-message renders them under the bubble.
-    const parts: MessagePart[] = [
-      ...(text ? [{ type: 'text', text } as const] : []),
-      ...attachments.map((attachment) => ({ type: 'file', attachment }) as const),
-    ];
-    const history: ChatMessage[] = [
-      ...active().messages,
-      { id: crypto.randomUUID(), role: 'user', parts },
-    ];
-    setMessages(history);
-    // First real message names the conversation.
-    if (active().title === 'New chat') {
-      active().title = text
-        ? text.slice(0, 40)
-        : (attachments[0]?.filename ?? 'Attachment');
-      title.textContent = active().title;
-    }
-    renderRail();
-    setBusy(true);
-    feedback.hidden = true;
-    // createAssistantStream appends the in-flight assistant message and folds
-    // every delta onto the right part, handing back a fresh array each time.
-    const stream = createAssistantStream((update) => setMessages(update(active().messages)));
-    try {
-      const prompt = text || (attachments[0]?.filename ?? '');
-      const result = await readOpenAIStream(mockResponse(prompt), stream);
-      if (result.error) notify('Model error: ' + result.error.message, { variant: 'error' });
-      // The mock announces tool calls but nothing executes them, so the panel
-      // would sit in \`input-available\` forever. Resolve each one here — the
-      // same place a real app would put its tool result.
-      for (const call of result.toolCalls) {
-        stream.upsertTool(call.id, {
-          state: 'output-available',
-          output: {
-            note: 'Local stub result — the mock responder announces the call, this app answers it.',
-            query: call.input?.query ?? call.argumentsText,
-          },
-        });
-      }
-    } catch (error) {
-      // abort() settles the message AND puts the reason where the user can see
-      // it, instead of leaving a permanently blank bubble.
-      stream.abort(
-        error instanceof Error && error.message ? error.message : 'Request failed',
-      );
-      notify('The reply failed.', { variant: 'error' });
-      console.error(error);
-    } finally {
-      stream.done(); // settles the turn; sink calls after this are dropped
-      setBusy(false);
-      feedback.hidden = false;
-      renderRail();
-    }
-  }
-  function setBusy(busy: boolean) {
-    sending = busy;
-    thread.loading = busy;
-    composer.loading = busy;
-    sendBtn.disabled = busy;
-  }
-  // ── message actions & feedback ────────────────────────────────────────────
-  thread.addEventListener('kai-message-action', (event) => {
-    const { action, state } = (event as CustomEvent<{
-      messageId: string;
-      action: string;
-      state?: 'on' | 'off';
-    }>).detail;
-    if (action === 'copy') notify('Copied to clipboard');
-    else if (state === 'on') notify(action === 'like' ? 'Marked helpful' : 'Marked unhelpful');
-  });
-  feedback.categories = ['Wrong answer', 'Too slow', 'Missed my attachment', 'Other'];
-  feedback.addEventListener('kai-feedback', (event) => {
-    const { value } = (event as CustomEvent<{ value: 'helpful' | 'not-helpful' }>).detail;
-    if (value === 'helpful') notify('Thanks for the feedback', { variant: 'success' });
-  });
-  feedback.addEventListener('kai-feedback-detail', (event) => {
-    const { category } = (event as CustomEvent<{ category?: string }>).detail;
-    notify(category ? 'Feedback filed: ' + category : 'Feedback filed', {
-      variant: 'success',
-    });
-  });
-  feedback.addEventListener('kai-close', () => {
-    feedback.hidden = true;
-  });
-  // ── new chat ──────────────────────────────────────────────────────────────
-  el<HTMLButtonElement>('new-chat').addEventListener('click', () => {
-    const conversation: Conversation = {
-      id: crypto.randomUUID(),
-      title: 'New chat',
-      messages: [],
-    };
-    conversations.unshift(conversation);
-    select(conversation.id);
-  });
-  // ── boot ──────────────────────────────────────────────────────────────────
-  renderRail();
-  renderStaged();
-  select(activeId);
-}
-void main();
-`,
-    },
-    {
-      path: 'src/styles.css',
-      lang: 'css',
-      code: `:root {
-  color-scheme: light;
-  --rail-w: 15rem;
-}
-* { box-sizing: border-box; }
-html, body { height: 100%; }
-body {
-  margin: 0;
-  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
-  background: var(--color-background, #fff);
-  color: var(--color-foreground, #111);
-}
-.app {
-  position: fixed;
-  inset: 0;
-  display: grid;
-  grid-template-columns: var(--rail-w) 1fr;
-  text-align: start;
-  /* Stays below the toast region's z-index (var(--kai-toast-z, 100)). */
-  z-index: 90;
-}
-/* ── sidebar ─────────────────────────────────────────────── */
-.rail {
-  display: flex;
-  flex-direction: column;
-  min-height: 0;
-  border-right: 1px solid var(--color-border, #e5e5e5);
-  background: var(--color-muted, #fafafa);
-}
-.rail-head {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 0.5rem;
-  padding: 0.75rem 0.75rem 0.5rem;
-}
-.rail-title {
-  font-size: 0.75rem;
-  font-weight: 600;
-  letter-spacing: 0.04em;
-  text-transform: uppercase;
-  opacity: 0.6;
-}
-.rail-list {
-  flex: 1;
-  min-height: 0;
-  overflow-y: auto;
-  padding: 0 0.5rem 0.75rem;
-  display: flex;
-  flex-direction: column;
-  gap: 0.125rem;
-}
-kai-conversation-item { display: block; }
-kai-conversation-item::part(row) { border-radius: 0.5rem; }
-/* ── main pane ───────────────────────────────────────────── */
-.pane {
-  display: flex;
-  flex-direction: column;
-  min-height: 0;
-  min-width: 0;
-}
-.pane-head {
-  display: flex;
-  align-items: baseline;
-  gap: 0.75rem;
-  padding: 0.75rem 1rem;
-  border-bottom: 1px solid var(--color-border, #e5e5e5);
-}
-.pane-head h1 {
-  margin: 0;
-  font-size: 0.9375rem;
-  font-weight: 600;
-}
-.badge {
-  font-size: 0.6875rem;
-  padding: 0.125rem 0.5rem;
-  border-radius: 999px;
-  border: 1px solid var(--color-border, #e5e5e5);
-  opacity: 0.7;
-}
-/* kai-thread fills the height its parent gives it and scrolls internally,
-   so the pane is a flex column and the thread is the flexing row. */
-.thread {
-  display: block;
-  flex: 1;
-  min-height: 0;
-}
-.empty {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 0.25rem;
-  padding: 3rem 1rem;
-  text-align: center;
-  font-size: 0.875rem;
-  opacity: 0.75;
-}
-.empty p { margin: 0; }
-.feedback {
-  display: block;
-  padding: 0 1rem 0.5rem;
-}
-.feedback[hidden] { display: none; }
-/* ── composer ────────────────────────────────────────────── */
-.composer-bar {
-  border-top: 1px solid var(--color-border, #e5e5e5);
-  padding: 0.625rem 1rem 0.875rem;
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-}
-.staged { display: block; }
-.staged[hidden] { display: none; }
-.composer-row {
-  display: flex;
-  align-items: flex-end;
-  gap: 0.5rem;
-}
-.composer {
-  display: block;
-  flex: 1;
-  min-width: 0;
-}
-.icon-btn,
-.send-btn,
-.ghost-btn {
-  font: inherit;
-  cursor: pointer;
-  border-radius: 0.5rem;
-  border: 1px solid var(--color-border, #e5e5e5);
-  background: var(--color-background, #fff);
-  color: inherit;
-}
-.icon-btn {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 2.25rem;
-  height: 2.25rem;
-  flex: none;
-}
-.send-btn {
-  height: 2.25rem;
-  padding: 0 0.875rem;
-  flex: none;
-  font-weight: 600;
-  background: var(--color-primary, #111);
-  color: var(--color-primary-foreground, #fff);
-  border-color: transparent;
-}
-.send-btn:disabled { opacity: 0.5; cursor: default; }
-.ghost-btn {
-  padding: 0.25rem 0.5rem;
-  font-size: 0.75rem;
-}
-.icon-btn:hover,
-.ghost-btn:hover { background: var(--color-accent, #f0f0f0); }
-`,
-    },
-  ],
-};