Timeline

Display

Vertical timeline with 5 statuses, 3 variants, timestamps, actions and scroll/progress/activity modes.

Scroll Timeline

Unificado

Unificado

🚧

Demo coming soon

Add a demo component to DEMOS in _showcase.tsx for display/timeline-progress

Unificado

Instalação via CLI

$ npx kikitocn add timeline

Interno:

@/lib/utils

Exemplo de uso

TimelineExample.tsx

import { Timeline } from "@/components/ui/cn/timeline/Timeline";

export function TimelineExample() {
  return (
    <Timeline />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`items*`	`TimelineItem[]`	—	Lista de eventos: { title, description?, timestamp?, status?, icon?, actions? }
`variant`	`'default' \| 'compact' \| 'reverse'`	`'default'`	Estilo visual: padrão, compacto ou conteúdo à esquerda
`lastLine`	`boolean`	`false`	Exibe linha após o último item

Carregando…