Componentes (Admin)
Biblioteca completa dos componentes mad-* usados no admin/ERP.
Layout
mad-page-container & header
Estrutura de página: container, header, content.
mad-form-* (layout)
form, form-section, form-grid, form-stack, form-actions, separator.
Inputs (texto e número)
mad-input-field
Input texto genérico com máscaras (CPF, CNPJ, telefone).
mad-password-field
Senha com toggle de visibilidade e validação de força.
mad-textarea-field
Textarea multilinha integrado ao MadForm.
mad-html-editor-field
Editor rico (Quill snow) para HTML formatado.
mad-display-field
Read-only formatado para views de detalhe.
mad-otp-field
Inputs separados para OTP/PIN/serial com auto-focus.
mad-cep-field
Campo de CEP com busca automática e auto-fill.
mad-cnpj-field
Campo de CNPJ com busca automática e auto-fill.
mad-number-field
Input number nativo HTML5.
mad-numeric-field
Decimal formatado pt-BR (peso, fator, cotação).
mad-money-field
Monetário com reverse-mask estilo calculadora.
Data e hora
mad-date-field
Data dd/mm/aaaa com datepicker.
mad-time-field
Hora HH:MM (input nativo HTML5).
mad-datetime-field
Data + hora combinados.
mad-daterange-field
Período (início/fim) com presets ERP.
Seleção
mad-select-field
Select estático com options fixas.
mad-dbselect-field
Alias de mad-dbcombo-field: select com busca ativa (MAD Select) + auto-query via model Eloquent.
mad-dbcombo-field
Select com MAD Select + busca + auto-query do banco.
mad-radio-field
Grupo de radio buttons com options manuais.
mad-dbradio-field
Radio auto-query via model Eloquent.
mad-checkbox-field
Checkbox booleano único.
mad-checkbox-group-field
Grupo de checkboxes (manual).
mad-dbcheckbox-group-field
Checkbox group auto-query via model Eloquent (mode comma|table).
mad-switch-field
Toggle iOS-style on/off.
mad-search-field
Search box texto livre para filtros.
mad-unique-search-field
Select único com busca (MAD Select).
mad-dbunique-search-field
Busca AJAX no banco para listas grandes.
mad-multi-search-field
Multi-select com chips + busca.
mad-dbmulti-search-field
Multi-select via banco com mode comma|table.
mad-select-check-field
Multi-select com checkboxes no dropdown.
mad-multi-entry-field
Tags/chips livres ou de options fixas.
mad-sort-list-field
Lista ordenável via drag-and-drop.
mad-dbentry-field
Input texto com autocomplete AJAX.
mad-seek (DB Seek)
Busca com modal grid paginado e filtros.
Upload
mad-file-field
Upload único (storage disk|db, name-column).
mad-multi-file-field
Upload múltiplos (mode comma|table).
mad-image-field
Imagem com crop, rotate, zoom, câmera (Cropper.js).
mad-avatar-field
Foto de perfil com layout circular compacto.
mad-signature-field
Assinatura draw/type/upload.
mad-attach-btn
Botão compacto de anexo para toolbar.
mad-scanner-field
Leitor de barcode/QR via câmera.
Outros campos
mad-color-field
Color picker (Pickr).
mad-range-field
Slider numérico.
mad-spinner-field
Número com botões +/-.
mad-qrcode
QR code embutido em página (PNG/SVG).
mad-barcode
Barcode C128/EAN13/UPCA embutido.
Botões e ações
mad-btn
Botão com navigate, mad:click, open-drawer, open-modal.
mad-btn-group
Grupo de botões lado-a-lado (toggles, segmentados).
mad-dropdown
Menu suspenso com items, separators, labels.
mad-context-menu
Menu de contexto (botão direito).
Overlay e containers
mad-modal
Modal centralizado (sm/md/lg/xl).
mad-drawer
Painel lateral overlay.
mad-card
Card com header e footer opcionais.
mad-tabs
Abas (default/underline/vertical).
mad-accordion
Painel expansível multi-open.
mad-tooltip
Tooltip hover/focus.
mad-transporter
Carrega outro MadComponent via AJAX (energize).
Feedback visual
mad-toast
Notificações Sonner-style (PHP MadToast::* ou JS).
mad-alert
Mensagem inline contextual.
mad-callout
Bloco destacado com header, body e footer.
mad-badge
Etiqueta compacta (variant + dot/icon).
mad-empty-state
Placeholder de lista vazia.
mad-progress
Barra de progresso 0-100%.
mad-spinner
Spinner indeterminado.
mad-skeleton
Placeholder shimmer de carregamento.
mad-steps
Indicador de etapas (arrows/dots/numbers/progress).
mad-avatar
Avatar circular (iniciais ou imagem).
Listagens e dados
mad-grid (MadDataGrid)
Tabela reativa com search, sort, filter, paginate, export.
mad-pivot-table
Tabela dinâmica/cross-tab (React/iframe).
mad-pagination
Paginação standalone para listagens custom.
mad-tree-view
Árvore hierárquica com expand/collapse.
mad-field-list
Tabela editável inline dentro de form.
mad-detail-form
Detail-form auto load/save com hooks.
mad-checklist-field
Checklist com colunas customizadas.
mad-db-blocks
Coleção 1:N vinculada a parent com CRUD inline.
mad-sheet
Planilha estilo Excel para lançamento em lote: teclado, paste TSV, colunas calculadas e save transacional.
mad-reconcile
Conciliação em dois painéis: auto-match por regras (MatchEngine), match manual N:M e desfazer.
mad-org-chart
Organograma de hierarquia auto-referente com pan/zoom, collapse, busca, lazy-load e drag re-parent.
mad-pdv
Frente de caixa (PDV): busca/bipagem, carrinho configurável, pagamento composto, venda a prazo e cupom.
Dashboards
MadDashboard (base class)
Base class para dashboards reativos com filtros + auto-refresh.
mad-metric-card
KPI estático (valor pronto via prop).
mad-db-metric-card
KPI auto-query via model Eloquent (count/sum/avg/min/max).
mad-chart
Gráfico ECharts via builder PHP.
mad-db-chart
Gráfico ECharts auto-query (bar/line/pie/donut/funnel/treemap).
mad-db-steps
Indicador de etapas auto-query via model Eloquent (versão DB do mad-steps).
Filtros declarativos
Calendários e Kanban
mad-full-calendar
Calendário FullCalendar.io.
mad-calendar — Resource Timeline
Visualização com linhas = recursos (salas, equipamentos, pessoas) e colunas = slots de tempo.
mad-resource-timeline
Timeline de recursos.
mad-gantt
Gantt chart.
mad-gantt — especificação completa
Referência completa do builder low-code: atributos, sub-tags, dependências, fases/pessoas/recursos, ops parciais.
mad-gantt-column — mapping + render
Como a sub-tag <mad-gantt-column> declara field-mapping e renderização da sidebar numa tacada só.
mad-gantt — CRUD host + form
Par host (gantt) + form (drawer): mapeamento por convenção e ops parciais ganttUpsertRecord/ganttPatchRecord.
mad-kanban
Quadro Kanban drag-and-drop.
mad-timeline
Timeline cronológica.