Overview

Composable AI chat primitives with a simple preset and full control through composition. Combine AskAI.Trigger with surfaces like AskAI.Dialog, AskAI.Chat, or AskAI.Sidepane, or render an AskAI.Inline layout.

Type Definition

import type { ReactNode } from 'react';
import type { HttpChatTransport, UIMessage } from 'ai';

export interface AskAIProps {
  children?: ReactNode;
  className?: string;
  endpoint?: string;
  open?: boolean;
  defaultOpen?: boolean;
  chatTransport?: HttpChatTransport<UIMessage>;
  persistence?: boolean | { key?: string };
  reuseContext?: boolean;
}

Usage

Preset (Trigger + Dialog)

import { AskAI } from 'peam/client';

export default function Page() {
  return <AskAI />;
}

Sidepane Composition

import { AskAI } from 'peam/client';

export default function Page() {
  return (
    <AskAI>
      <AskAI.Trigger />
      <AskAI.Sidepane />
    </AskAI>
  );
}

Custom Trigger (asChild)

import { AskAI } from 'peam/client';
import { Button } from '@/components/ui/button';

export default function Page() {
  return (
    <AskAI>
      <AskAI.Trigger asChild>
        <Button>Ask a Question</Button>
      </AskAI.Trigger>
      <AskAI.Dialog />
    </AskAI>
  );
}

Inline Chat

import { AskAI } from 'peam/client';

export default function Page() {
  return (
    <AskAI>
      <AskAI.Inline />
    </AskAI>
  );
}

Props

AskAI (Preset)

Prop	Type	Default	Description
`endpoint`	`string`	`'/api/peam'`	API endpoint used by the chat transport
`open`	`boolean`	`undefined`	Controlled open state
`defaultOpen`	`boolean`	`false`	Uncontrolled initial open state
`chatTransport`	`HttpChatTransport<UIMessage>`	`undefined`	Override the default chat transport
`persistence`	`boolean \| { key?: string }`	`true`	Configure chat persistence or disable it
`reuseContext`	`boolean`	`true`	Reuse an existing `AskAIContext` if present
`className`	`string`	`undefined`	Root wrapper class name

Notes

AskAI renders a preset: AskAI.Trigger + AskAI.Dialog.
For other layouts, compose AskAI with the surface you want, or provide context manually with AskAIProvider.
Use useAskAI for direct access to state and actions, and BoundedChatTransport to override transport behavior.

AskAI

On this page