Componentes

Todos os componentes publicos da v3, com preview e codigo copiavel vindo do mesmo arquivo.

Feedback & overlays

client

CmAccordion

Lista de secoes expansivas para perguntas frequentes, filtros e detalhes progressivos.

Abrir
client

CmAlert

Mensagem contextual com tom semantico, acao opcional e modo descartavel.

Abrir
client

CmAlertDialog

Confirmacao acionada por trigger render-prop para acoes destrutivas ou sensiveis.

Abrir
client

CmCarousel

Carrossel de cards ou midia com controles e dots opcionais.

Abrir
client

CmCollapsible

Area expansivel com trigger customizavel.

Abrir
client

CmConfirmDialog

Dialogo controlado para confirmacoes com estado de submissao.

Abrir
client

CmDialog

Modal acessivel com foco preso, scroll lock, tamanhos e rodape.

Abrir
client

CmDrawer

Painel lateral ou inferior para detalhes e edicoes contextuais.

Abrir
client

CmEmpty

Estado vazio com titulo, descricao, icone e acao opcional.

Abrir
client

CmHoverCard

Cartao de detalhe acionado por hover/foco.

Abrir
client

CmPopover

Conteudo flutuante ancorado a um trigger.

Abrir
client

CmPortal / CmPortalPanel

Renderizacao em document.body e painel posicionado em cantos da viewport.

Abrir
client

CmProgress

Barra de progresso nativa estilizada.

Abrir
client

CmProgressModal

Modal de progresso com passos, status e barra agregada.

Abrir
client

CmTabs

Abas compostas por Root, List, Trigger e Content.

Abrir
client

CmToastProvider / useCmToast

Sistema de notificacoes temporarias com provider e hook.

Abrir
client

CmWizard

Fluxo em etapas com orientacao horizontal ou vertical.

Abrir

Layout & chrome

client

CmAppShell

Casca de aplicacao com sidebar, topbar e area principal responsiva.

Abrir
client

CmAspectRatio

Container de proporcao fixa para midia, graficos e previews.

Abrir
server

CmGridContainer / CmGrid

Grid responsivo com spans por breakpoint.

Abrir
server

CmRow / CmCol / CmStack / CmContainer

Primitivos de composicao para alinhar, empilhar e limitar largura.

Abrir
server

CmPage

Container de pagina com padding, gap, largura maxima e scroll.

Abrir
server

CmPageHeader

Cabecalho de pagina com titulo, descricao, meta, icone e acoes.

Abrir
client

CmResizable

Painel com largura ajustavel por arraste.

Abrir
client

CmScrollArea

Area com altura controlada para conteudo rolavel.

Abrir
server

CmSectionHeader

Cabecalho de secao com descricao, acoes, borda e padding.

Abrir
server

CmSeparator

Separador horizontal ou vertical com espacamento e comprimento.

Abrir
client

CmSidebar

Layout de navegacao lateral com grupos, colapso, marca e rodape.

Abrir
server

CmToolbar / CmFilterBar

Barra flexivel de controles com densidade, wrap e alinhamento.

Abrir
server

CmTopbar

Barra superior com secoes start, center e end.

Abrir

Dados & visualizacao

client

CmAvatar

Avatar com imagem, fallback e tamanhos padronizados.

Abrir
server

CmBadge

Marcador compacto para status, categorias e contadores leves.

Abrir
client

CmBarChart

Grafico de barras simples para comparacoes rapidas.

Abrir
client

CmCalendar

Calendario mensal com selecao de data.

Abrir
server

CmCard

Superficie flexivel para agrupar conteudo, cabecalho, rodape e cover.

Abrir
client

CmCodeBlock

Bloco de codigo com linguagem, modo inline e botao de copiar.

Abrir
client

CmDataTable

Tabela com ordenacao, paginacao, toolbar, empty state e painel de detalhe.

Abrir
server

CmIcon

Gateway para Iconify, usando nomes de icones de 150+ bibliotecas.

Abrir
server

CmIconBadge

Badge circular para destacar um icone ou simbolo curto.

Abrir
server

CmItem

Linha de item com titulo, descricao e metadado.

Abrir
server

CmKbd

Representa teclas e atalhos de teclado.

Abrir
client

CmLineChart

Grafico de linha simples para tendencias.

Abrir
server

CmMetricCard

Card de KPI com valor, tendencia, tom e acento.

Abrir
server

CmText

Tipografia com elemento, tamanho, tom, peso, espacamento e truncamento.

Abrir
client

CmTreeView

Arvore de categorias/permissoes com busca, expansao, selecao e drag opcional.

Abrir

Acoes & navegacao

server

CmBreadcrumb

Trilha hierarquica com adaptador de link opcional.

Abrir
client

CmButton

Botao de acao com variantes, tons, tamanhos, icones e loading.

Abrir
server

CmButtonGroup

Agrupa botoes em orientacao horizontal ou vertical.

Abrir
client

CmCommand

Paleta de comandos com trigger, busca, atalhos e itens.

Abrir
client

CmContextMenu

Menu contextual aberto por clique secundario.

Abrir
client

CmDropdownMenu

Menu ancorado com itens, separadores, atalhos e alinhamento.

Abrir
server

CmLink

Link com variantes, tons e adaptador para roteadores.

Abrir
client

CmMenubar

Barra horizontal de itens de menu com acao trailing.

Abrir
client

CmNavigationMenu

Menu de navegacao horizontal com item ativo.

Abrir
client

CmPagination

Paginacao em modo completo ou compacto.

Abrir
client

CmSplitButton

Botao com dropdown de opcoes para escolher uma acao ou filtro.

Abrir
client

CmUserMenu

Menu de usuario com avatar, cabecalho e itens de dropdown.

Abrir

Formularios

client

CmCheckbox

Checkbox com label, descricao e apresentacoes compactas.

Abrir
client

CmCombobox

Selecao pesquisavel com item, descricao e estado vazio.

Abrir
server

CmField

Wrapper de campo com label, dica, descricao, erro e densidade.

Abrir
server

CmForm

Estrutura de formulario com titulo, descricao, grid e barra de acoes.

Abrir
client

CmInput

Input com label, ajuda, erro, sucesso, adornos e modo numerico.

Abrir
server

CmInputGroup

Moldura para agrupar input com prefixo e sufixo.

Abrir
client

CmInputOTP

Entrada segmentada para codigos curtos.

Abrir
server

CmLabel

Label acessivel com indicador opcional.

Abrir
client

CmMultiSelect

Selecao multipla compacta com dropdown.

Abrir
client

CmRadioGroup

Grupo de opcoes mutuamente exclusivas.

Abrir
client

CmSelect

Select customizado com label, estados, adornos, clear e icones opcionais.

Abrir
client

CmSwitch

Alternador booleano com input oculto opcional para formularios.

Abrir
client

CmTextarea

Area de texto com label, ajuda, erro, sucesso e adornos.

Abrir

Tema

theme

CmThemeProvider

Provider de tema, densidade e chrome para a aplicacao.

Abrir
theme

CmThemeToggle / CmThemeMenu

Controle de troca de tema com apresentacao normal ou compacta.

Abrir