ngx-prompt-kit

AI chat components for Angular.

Standalone, signal-based components for building AI interfaces. Composes with Spartan UI. Distributed via schematics — the source lives in your project, not in a black-box dependency.

Get started See it in action

What you write

<div class="rounded-2xl border bg-background px-3 pt-2 pb-3">
  <pk-composer
    placeholder="Ask ngx-prompt-kit anything..."
    [attachable]="true"
    [(value)]="value"
    (submitted)="onSubmit($event)"
  >
    <button pkComposerStart hlmBtn variant="outline" size="sm" hlmTooltip="Search the web">
      <ng-icon name="lucideGlobe" class="text-[length:--spacing(3)]" />
      Search
    </button>
  </pk-composer>
</div>

Built for the Angular way of working.

Schematic distribution

Components are copied into your project via ng generate. You own the source — edit, fork, version it on your terms.

Built on Spartan UI

Built from Spartan helm and brain primitives (button, textarea, collapsible, hover card, sheet). Where Spartan already has the piece, use it directly. Theme-consistent out of the box.

Signal-based + standalone

Every component uses input(), output(), computed(). No NgModules. Zoneless-friendly. OnPush throughout.

AI-chat-ready primitives

Streaming responses, markdown with code highlighting, file drop zones, expanding reasoning blocks — the AI surface area covered.

Tailwind v4 native

Plain Tailwind utility classes, no proprietary CSS-in-JS. Inherits your existing design tokens.

SSR-safe

Browser APIs (clipboard, ResizeObserver, requestAnimationFrame) guarded behind isPlatformBrowser. Renders on the server without crashing.