byronwade/ui
Application UI

AI · Application UI

Prompt Input

A composable AI chat prompt input with density-aware composer layout, textarea, file attachments, action menu, model select, speech-to-text, and slash-command primitives built on byronwade/ui input-group, select, dropdown-menu, hover-card, and command.

@byronwade/foundation@byronwade/demo-viewport@byronwade/utils@byronwade/button@byronwade/command@byronwade/dropdown-menu@byronwade/hover-card@byronwade/input-group@byronwade/selectai@phosphor-icons/reactnanoid

Adapted from Vercel AI Elements , the original components, repurposed onto the byronwade/ui design system (semantic tokens, dark mode, small subtle refinements). © Vercel.

Feature showcase

Installation

Features

  • 1 example

    Default.

API

Dependencies

PackageKindDescription
@byronwade/foundationregistryInstalled through the byronwade/ui registry.
@byronwade/demo-viewportregistryInstalled through the byronwade/ui registry.
@byronwade/utilsregistryInstalled through the byronwade/ui registry.
@byronwade/buttonregistryInstalled through the byronwade/ui registry.
@byronwade/commandregistryInstalled through the byronwade/ui registry.
@byronwade/dropdown-menuregistryInstalled through the byronwade/ui registry.
@byronwade/hover-cardregistryInstalled through the byronwade/ui registry.
@byronwade/input-groupregistryInstalled through the byronwade/ui registry.
@byronwade/selectregistryInstalled through the byronwade/ui registry.
ainpmInstalled from npm.
@phosphor-icons/reactnpmInstalled from npm.
nanoidnpmInstalled from npm.

Source and related

FilePath
Componentregistry/components/ai-prompt-input.tsx
Default examplecontent/examples/ai-prompt-input/default.tsx