Svelte AI Elements

Reasoning

The Reasoning component displays AI reasoning content, automatically opening during streaming and closing when finished.

Installation

pnpm dlx shadcn-svelte@latest add https://svelte-ai-elements.vercel.app/r/reasoning.json

If you prefer using jsrepo, please install via the command below:

pnpm dlx jsrepo add @ai/elements/ai-elements/reasoning

Props

Reasoning

Name	Type	Default
`class`	`string`
`isStreaming`	`boolean`	`false`
`open`	`boolean`
`defaultOpen`	`boolean`	`true`
`onOpenChange`	`(open: boolean) => void`
`duration`	`number`
`children`	`Snippet`
`...props`	`CollapsibleProps`

ReasoningTrigger

Name	Type	Default
`class`	`string`
`children`	`Snippet`
`...props`	`CollapsibleTriggerProps`

ReasoningContent

Name	Type	Default
`class`	`string`
`children`	`Snippet`
`...props`	`CollapsibleContentProps`

Response

Name	Type	Default
`class`	`string`
`content`	`string`
`shikiTheme`	`string`
`baseTheme`	`string`	`'shadcn'`
`...restProps`	`StreamdownProps`