chat composer kit
A source-first composer stack for prompt entry, compact actions, shortcuts, and command search.
sources
components
- prompt bar
src/components/prompt-bar - ask luke button
src/components/ask-luke-button - command palette
src/components/command-palette - keyboard hints
src/components/kbd - session-aware tooltips
src/components/tooltips
styles
- components — default
@creative-int/design - luke — slate-core + holo
apps/luke
implementation steps
- Use the prompt bar as the input shell and preserve the toolbar slots for attachment, mode, submit, and stop controls.
- Use the compact button shape for low-friction ask or submit triggers; avoid oversized call-to-action treatment inside tool surfaces.
- Render keyboard hints with Kbd or ShortcutKbd so platform-specific modifier labels stay correct.
- Make command-palette items mirror composer modes, saved prompts, and recent actions instead of becoming a second navigation system.
- Verify submit and stop states with real disabled/loading affordances, not only static visuals.
copy-ready prompt
# Adopt chat composer kit Build a agent or assistant composer using the components showcase adoption recipe `chat-composer-kit`. ## Intent A source-first composer stack for prompt entry, compact actions, shortcuts, and command search. ## Component sources - prompt-bar: prompt bar (src/components/prompt-bar) - ask-luke-button: ask luke button (src/components/ask-luke-button) - command-palette: command palette (src/components/command-palette) - kbd: keyboard hints (src/components/kbd) - tooltips: session-aware tooltips (src/components/tooltips) ## Style sources - components: components — default (@creative-int/design) - luke: luke — slate-core + holo (apps/luke) ## Implementation steps 1. Use the prompt bar as the input shell and preserve the toolbar slots for attachment, mode, submit, and stop controls. 2. Use the compact button shape for low-friction ask or submit triggers; avoid oversized call-to-action treatment inside tool surfaces. 3. Render keyboard hints with Kbd or ShortcutKbd so platform-specific modifier labels stay correct. 4. Make command-palette items mirror composer modes, saved prompts, and recent actions instead of becoming a second navigation system. 5. Verify submit and stop states with real disabled/loading affordances, not only static visuals. ## Acceptance checks - composer has stable height across empty, typed, loading, and stopped states - primary action is reachable by pointer and keyboard - shortcut labels resolve for macOS and non-macOS users - tooltip or command help never blocks text input - proof covers /prompt-bar, /command-palette, and the adopting route ## Proof routes - /adoption/chat-composer-kit - /prompt-bar - /command-palette
acceptance
- composer has stable height across empty, typed, loading, and stopped states
- primary action is reachable by pointer and keyboard
- shortcut labels resolve for macOS and non-macOS users
- tooltip or command help never blocks text input
- proof covers /prompt-bar, /command-palette, and the adopting route
/adoption/chat-composer-kit/prompt-bar/command-paletteartifact
Generated packet: /adoption/chat-composer-kit.json · /adoption/chat-composer-kit.zip · sha-256 bf7c48fe5bf6.
Loading bundle…