bunx shadcn@latest add @elements/confirmation

import {
  Confirmation,
  ConfirmationRequest,
  ConfirmationAccepted,
  ConfirmationRejected,
  ConfirmationActions,
} from "@/components/elements/ai-elements/agentic/confirmation";
import { useState } from "react";

export function ConfirmationExample() {
  const [state, setState] = useState<ConfirmationState>("approval-requested");

  return (
    <Confirmation
      state={state}
      onApprove={() => setState("output-available")}
      onReject={() => setState("output-denied")}
    >
      <ConfirmationRequest
        title="Delete Files"
        description="The AI wants to delete 3 temporary files from your project."
      >
        <ConfirmationActions />
      </ConfirmationRequest>
      <ConfirmationAccepted description="Files have been deleted." />
      <ConfirmationRejected description="Operation was cancelled." />
    </Confirmation>
  );
}

type ConfirmationState =
  | "approval-requested"
  | "approval-responded"
  | "output-available"
  | "output-denied";