AI Elements

Plan

Collapsible plan card the model can stream into.

Import

tsx

import { Plan } from "@cronus-ui/ui";

bash

npx cronus-ui add plan

Examples

Plan card

A collapsible plan the model can stream into.

Ship the chat surface

Wire Conversation, Message, and PromptInput.

tsx

<Plan defaultOpen>
  <PlanHeader>
    <PlanTitle>Ship the chat surface</PlanTitle>
    <PlanTrigger />
  </PlanHeader>
  <PlanContent>
    <p className="text-sm text-fg-secondary">Wire Conversation, Message, and PromptInput.</p>
  </PlanContent>
</Plan>

API Reference

Generated from the component's exported types.

PlanProps

Extends ComponentProps<typeof Collapsible>

Prop	Type	Default	Description
`ref`	`Ref<HTMLDivElement>`	—	Ref forwarded to the underlying DOM node.
`isStreaming`	`boolean`	`false`	—

PlanHeaderProps

Extends ComponentProps<typeof CardHeader>

No own props — see the extended type above for available props.

PlanTitleProps

Extends Omit<ComponentProps<typeof CardTitle>, "children">

Prop	Type	Default	Description
`children`*	`string`	—	Contents of the component.

PlanDescriptionProps

Extends Omit<ComponentProps<typeof CardDescription>, "children">

Prop	Type	Default	Description
`children`*	`string`	—	Contents of the component.

PlanActionProps

Extends ComponentProps<typeof CardAction>

No own props — see the extended type above for available props.

PlanContentProps

Extends ComponentProps<typeof CardContent>

No own props — see the extended type above for available props.

PlanFooterProps

Extends HTMLAttributes<HTMLDivElement>

Prop	Type	Default	Description
`ref`	`Ref<HTMLDivElement>`	—	Ref forwarded to the underlying DOM node.

PlanTriggerLabels

Prop	Type	Default	Description
`toggle`*	`string`	—	—

PlanTriggerProps

Extends ComponentProps<typeof Button>

Prop	Type	Default	Description
`labels`	`Partial<PlanTriggerLabels>`	—	Override default English strings.