Enterprise-grade design system and component library for LEMA-UFPB
Hero imersivo de manifesto institucional combinando declaração tipográfica, métricas e CTAs.
Bloco turnkey da trajetória histórica com cabeçalho de seção e MilestoneStepper.
Bloco composto de página 'Sobre' — história + citação do fundador + tira de estatísticas + grid de equipe — construído a partir dos átomos ds-hero-section, ds-pull-quote, ds-card-stat e ds-team-roster.
Seção turnkey de história institucional em 2 colunas com badge, fotografia e métrica flutuante.
Bloco turnkey completo de apresentação de valores e pilares com grid responsivo de ValuesCard.
A vertically stacked set of interactive headings that each reveal a section of content.
Extended accordion with icon style variants (chevron/plus/arrow/sign), size variants, rounded/bordered CVA, discriminated single/multiple types with collapsible control, i18n aria-labels, skeleton loading, and nested accordion support.
Feed cronológico de eventos e trilha de auditoria com avatar, badge de status e timestamp relativo.
Chat assistente — ReUI AI Chat 12.
A contextual notification banner for displaying feedback messages with title, description, and optional action.
A modal dialog that interrupts users with urgent information, actions, or confirmation prompts.
Contador numérico animado com formatação por locale e fallback sr-only para leitores de tela.
Badge ou pill de anúncio para o topo de seções hero com micro-animação e suporte a ping.
Sidebar completa com TeamSwitcher, Search, NavMain colapsável, Projects, NavUser e Rail — compõe sidebar shadcn 07 + 16.
Botões de download para App Store e Google Play, com ícone e texto sobrescrevíveis.
A wrapper that maintains a consistent aspect ratio for its child content.
A file attachment component with support for media preview, title, description, actions, trigger overlay, and group layout. Composed of AttachmentGroup, AttachmentMedia, AttachmentContent, AttachmentTitle, AttachmentDescription, AttachmentActions, AttachmentAction, and AttachmentTrigger sub-components.
Fundo aurora com gradientes animados, grid sutil e máscara radial — inspirado em Aceternity Aurora + Sparkles + Wavy.
Shell de autenticação unificado com variantes centered/muted/split/cover — consolida shadcn login-01..05 e signup-01..05.
Divisor estilizado com rótulo centralizado para transição entre autenticação social e credenciais tradicionais.
Shell de layout de tela dividida (split-screen) completo com vitrine da marca, depoimento e estatísticas.
Busca autocomplete async — ReUI Autocomplete.
An image element representing a user or entity, with a fallback display for when the image fails to load.
Indicador de presença em tempo real para avatar com anel de isolamento temático e animação de pulso.
Extended avatar with size scale (sm through 2xl), status indicator dots, initials color generator, image loading status callback, delay fallback, avatar group with overflow count, tooltip, and skeleton loading.
Ambientação luminosa e texturas de fundo em CSS puro (Aurora, Spotlight, Beam e Grid-dots) para seções Hero.
A small visual indicator for categorization, counts, or status labels.
Extended badge with dot indicator, removable close icon, icon support, counter/overflow display, and semantic color variants (success/warning).
Faixa full-width dismissível com intent, variante, posição e CTAs. Base blockus banners.
Download de app com ícone, rating e store badges — blockus #14-17.
Barra de consentimento cookies fixed bottom/floating — blockus #09-12.
Faixa com rolagem infinita horizontal para highlights — blockus banner #13.
Card promo centrado com gradiente/imagem e 1-2 CTAs — blockus #05-08.
Bloco topo sticky com badge, título e CTA — blockus banners #01-04.
A fully featured bar chart with tooltips, legend, stacking, rounded corners, and brush zoom.
Grid bento misturando tiles de feature com ícone e tiles de estatística — composto de ds-bento-grid e ds-card-stat.
Grid assimétrico com spans configuráveis para tiles de feature/mídia.
Grid bento combinando um gráfico de barras com uma tira de estatísticas — composto de ds-bento-grid, ds-bar-chart e ds-card-stat.
Grid bento exibindo screenshot de produto, preview de terminal e snippet de instalação — composto de ds-bento-grid, ds-floating-card, ds-browser-mockup e ds-copy-block.
Grid bento misturando tiles de depoimento com um mural de logos — composto de ds-bento-grid, ds-pull-quote e ds-press-wall.
Card de plano e fatura — ReUI Billing.
Avatar + nome + role do autor para blog.
Card de post com imagem, categoria, título, excerpt, tags e autor — átomo base blog.
Hero featured grande + 2 cards laterais — blockus #15-22.
Grid responsivo 3 cols com filtros categoria + busca — blockus blog #01-07.
Lista horizontal imagem à esquerda — blockus #08-12.
Linha de metadados: data, reading time e categoria.
Brilho que percorre a borda do container pai via offset-path (correto em qualquer proporção), em CSS puro — oculto em prefers-reduced-motion.