import { StepItem } from "../StepItem";

export default function StepItemExample() {
  return (
    <div className="p-8 max-w-2xl space-y-3">
      <StepItem
        id="1"
        text="Complete market research and competitor analysis"
        status="completed"
        onToggle={() => console.log("Toggle clicked")}
        onEdit={() => console.log("Edit clicked")}
        onDelete={() => console.log("Delete clicked")}
      />
      <StepItem
        id="2"
        text="Design landing page mockups"
        status="in-progress"
        onToggle={() => console.log("Toggle clicked")}
        onEdit={() => console.log("Edit clicked")}
        onDelete={() => console.log("Delete clicked")}
      />
      <StepItem
        id="3"
        text="Set up email marketing automation"
        status="pending"
        onToggle={() => console.log("Toggle clicked")}
        onEdit={() => console.log("Edit clicked")}
        onDelete={() => console.log("Delete clicked")}
      />
    </div>
  );
}
