@kitn.ai/ui/dist/components/prompt-input.d.ts

Framework-agnostic, Shadow-DOM web components for building AI chat interfaces — works in React, Vue, Angular, Svelte, or plain HTML. Authored in SolidJS.

import { JSX } from 'solid-js';
import { TriggerDef, ComposerChange } from './composer';
import { ComposerDoc } from '../primitives/composer-model';
interface PromptInputContextType {
    isLoading: boolean;
    value: () => string | ComposerDoc;
    setValue: (value: string) => void;
    maxHeight: number | string;
    onSubmit?: () => void;
    disabled?: boolean;
    textareaRef: HTMLElement | undefined;
    setTextareaRef: (el: HTMLElement) => void;
}
declare function usePromptInput(): PromptInputContextType;
export interface PromptInputProps extends JSX.HTMLAttributes<HTMLDivElement> {
    isLoading?: boolean;
    /** String = controlled text; ComposerDoc = a seed that pre-populates pills. */
    value?: string | ComposerDoc;
    onValueChange?: (value: string) => void;
    maxHeight?: number | string;
    onSubmit?: () => void;
    children: JSX.Element;
    disabled?: boolean;
}
declare function PromptInput(props: PromptInputProps): JSX.Element;
export interface PromptInputTextareaProps extends JSX.TextareaHTMLAttributes<HTMLTextAreaElement> {
    disableAutosize?: boolean;
    /** Rich entity triggers (`/`, `@`) forwarded to the composer. */
    triggers?: TriggerDef[];
    /** Default icon per entity kind (kind → image src), forwarded to the composer. */
    kindIcons?: Record<string, string>;
    /** Structured change (doc + entities) from the composer, on every edit. */
    onComposerChange?: (change: ComposerChange) => void;
}
declare function PromptInputTextarea(props: PromptInputTextareaProps): JSX.Element;
export interface PromptInputActionsProps extends JSX.HTMLAttributes<HTMLDivElement> {
    children: JSX.Element;
}
declare function PromptInputActions(props: PromptInputActionsProps): JSX.Element;
export interface PromptInputActionProps {
    tooltip?: string;
    children: JSX.Element;
    side?: 'top' | 'bottom' | 'left' | 'right';
    class?: string;
}
declare function PromptInputAction(props: PromptInputActionProps): JSX.Element;
export { PromptInput, PromptInputTextarea, PromptInputActions, PromptInputAction, usePromptInput, };