bunx shadcn@latest add @elements/plan

import {
  Plan,
  PlanHeader,
  PlanTitle,
  PlanDescription,
  PlanContent,
  PlanFooter,
  PlanAction,
  PlanStep,
} from "@/components/elements/ai-elements/agentic/plan";

export function PlanExample() {
  return (
    <Plan isStreaming={false}>
      <PlanHeader>
        <div>
          <PlanTitle>Implementation Plan</PlanTitle>
          <PlanDescription>3 steps to complete</PlanDescription>
        </div>
      </PlanHeader>
      <PlanContent>
        <div className="space-y-3">
          <PlanStep number={1}>Create database schema</PlanStep>
          <PlanStep number={2}>Implement API endpoints</PlanStep>
          <PlanStep number={3}>Add frontend components</PlanStep>
        </div>
      </PlanContent>
      <PlanFooter>
        <PlanAction variant="secondary">Cancel</PlanAction>
        <PlanAction variant="primary">Execute Plan</PlanAction>
      </PlanFooter>
    </Plan>
  );
}