{
  "name": "timeline-alternate-demo",
  "type": "registry:example",
  "files": [
    {
      "path": "examples/timeline-alternate-demo.tsx",
      "type": "registry:example",
      "content": "import {\n  Timeline,\n  TimelineConnector,\n  TimelineContent,\n  TimelineDescription,\n  TimelineDot,\n  TimelineHeader,\n  TimelineItem,\n  TimelineTime,\n  TimelineTitle,\n} from \"@/registry/bases/radix/ui/timeline\";\n\nconst timelineItems = [\n  {\n    id: \"project-kickoff\",\n    dateTime: \"2025-01-15\",\n    date: \"January 15, 2025\",\n    title: \"Project Kickoff\",\n    description: \"Initial meeting to define scope.\",\n  },\n  {\n    id: \"design-phase\",\n    dateTime: \"2025-02-01\",\n    date: \"February 1, 2025\",\n    title: \"Design Phase\",\n    description: \"Created wireframes and mockups.\",\n  },\n  {\n    id: \"development\",\n    dateTime: \"2025-03-01\",\n    date: \"March 1, 2025\",\n    title: \"Development\",\n    description: \"Building core features.\",\n  },\n];\n\nexport default function TimelineAlternateDemo() {\n  return (\n    <Timeline variant=\"alternate\" activeIndex={1}>\n      {timelineItems.map((item) => (\n        <TimelineItem key={item.id}>\n          <TimelineDot />\n          <TimelineConnector />\n          <TimelineContent>\n            <TimelineHeader>\n              <TimelineTime dateTime={item.dateTime}>{item.date}</TimelineTime>\n              <TimelineTitle>{item.title}</TimelineTitle>\n            </TimelineHeader>\n            <TimelineDescription>{item.description}</TimelineDescription>\n          </TimelineContent>\n        </TimelineItem>\n      ))}\n    </Timeline>\n  );\n}\n",
      "target": ""
    }
  ]
}