Quote Block

Display

Styled blockquote with variant options, author attribution and avatar.

🚧

Demo coming soon

Add a demo component to DEMOS in _showcase.tsx for display/quote-block

Instalação via CLI

$ npx kikitocn add quote-block

Exemplo de uso

Quote BlockExample.tsx

import { QuoteBlock } from "@/components/ui/cn/quote-block/QuoteBlock";

export function QuoteBlockExample() {
  return (
    <QuoteBlock />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`children*`	`React.ReactNode`	—	Texto da citação
`variant`	`'default' \| 'accent' \| 'ghost'`	`'default'`	Estilo visual
`author`	`string`	—	Nome do autor
`role`	`string`	—	Cargo ou descrição do autor
`avatar`	`string`	—	URL do avatar
`avatarFallback`	`string`	—	Iniciais para o fallback
`className`	`string`	—	Classes CSS extras

Carregando…