Total: 139 componentes em 17 diretórios
NAO editar manualmente. Gerenciados via npx shadcn@latest add.
| Componente | Arquivo |
|---|
| AlertDialog | ui/alert-dialog.tsx |
| Avatar | ui/avatar.tsx |
| Badge | ui/badge.tsx |
| Button | ui/button.tsx |
| Card | ui/card.tsx |
| Checkbox | ui/checkbox.tsx |
| Dialog | ui/dialog.tsx |
| DropdownMenu | ui/dropdown-menu.tsx |
| Input | ui/input.tsx |
| JsonTree | ui/json-tree.tsx |
| Label | ui/label.tsx |
| Popover | ui/popover.tsx |
| ScrollArea | ui/scroll-area.tsx |
| Select | ui/select.tsx |
| Separator | ui/separator.tsx |
| Sheet | ui/sheet.tsx |
| Skeleton | ui/skeleton.tsx |
| Switch | ui/switch.tsx |
| Table | ui/table.tsx |
| Tabs | ui/tabs.tsx |
| Textarea | ui/textarea.tsx |
| Tooltip | ui/tooltip.tsx |
Total: 22 componentes
Componentes de layout global da aplicação.
| Componente | Arquivo | Descrição |
|---|
| Sidebar | layout/sidebar.tsx | Navegação lateral principal. Collapsible. Mobile: overlay. |
| Topbar | layout/topbar.tsx | Barra superior. Breadcrumb. Global search. Notifications. |
| AccountSwitcher | layout/account-switcher.tsx | Dropdown para trocar entre contas. |
| CreateAccountDialog | layout/create-account-dialog.tsx | Dialog para criar nova conta. |
| GlobalSearch | layout/global-search.tsx | Busca global com Cmd+K. |
| Notifications | layout/notifications.tsx | Dropdown de notificações. Badge de contagem. |
| ChatPanel | layout/chat-panel.tsx | Panel de chat (usado apenas em /app/chat). |
| SupportBanner | layout/support-banner.tsx | Banner quando admin está em support mode. |
Total: 8 componentes
| Componente | Descrição |
|---|
| KpiCard | Card de métrica com valor, icone, trend up/down. |
| MessagesChart | Recharts AreaChart. Mensagens enviadas vs recebidas por dia. |
| CampaignsChart | Recharts BarChart. Campanhas recentes. |
| ConversationsChart | Recharts. Conversas por status. |
| AutomationMetrics | Tabela de métricas por automação. |
| HeatmapChart | Heatmap de engajamento por dia da semana x hora. |
| ExportButton | Exportar dados em CSV. |
Total: 7 componentes
| Componente | Descrição |
|---|
| ConversationList | Lista de conversas. Tabs (mine/team). Busca. Unread count. |
| MessageArea | Area de mensagens. Header + lista de bolhas + input. |
| MessageBubble | Bolha individual. Inbound/outbound. Status ticks. |
| MessageInput | Input com envio (Enter). Quick replies. Sugestao IA. |
| ContactInfo | Panel lateral com detalhes do contato. |
| InternalNotes | Panel de notas internas por conversa. |
| AssignDropdown | Dropdown para atribuir conversa. |
| TransferDialog | Dialog para transferir conversa. |
Total: 8 componentes
| Componente | Descrição |
|---|
| ContactsTable | Tabela com seleção, busca, ações bulk. Cursor págination. |
| CreateContactDialog | Dialog simples para criar contato. |
| ContactFormDialog | Dialog reutilizavel para criar/editar contato. |
| ImportCSVDialog | Importar via CSV. Upload, mapeamento, preview. |
| FilterBuilder | Builder de filtros avancados (3-level). AND/OR. |
| ActivityTimeline | Timeline de atividades do contato. |
| EventTimeline | Timeline de eventos (pedidos, tracking). |
| ContactInfoCard | Card com informações do contato. |
| ContactKpiCards | Cards de KPI por contato. |
| RfmBadge | Badge colorido com segmento RFM. |
Total: 10 componentes
Componentes do editor visual de automações (replica n8n).
| Componente | Descrição |
|---|
| FlowToolbox | Panel lateral com lista de nodes. Busca. Drag & drop. |
| NodeConfigPanel | Panel de configuração do node selecionado. |
| NodeDialog | Dialog fullscreen 3-panel (INPUT / PARAMETERS / PREVIEW). |
| NodeContextMenu | Menu de contexto (right-click). |
| CustomEdge | Edge customizado com botao + para inserir node. |
| EditorCallbacks | Context provider com callbacks do editor. |
| CanvasPinPanel | Panel flutuante “Pin to Canvas”. |
| BlueprintGallery | Galeria de modelos pre-definidos. |
| AiFlowGeneratorDialog | Dialog para gerar fluxo com IA. |
| WhatsAppMessagePreview | Preview de mensagem WhatsApp (celular). |
| FilterBuilder | Builder de filtros para flow filters. |
| InlineTemplateBuilder | Builder inline de template no node config. |
| ExecutionLogs | Lista de logs de execução. |
| ExecutionViewer | Viewer detalhado de execuções. |
| Componente | Descrição |
|---|
| InputPanel | Panel de INPUT do NodeDialog. |
| ExpressionPanel | Panel de expressoes/configuração. |
| ResultPanel | Panel de resultado/preview. |
| HighlightedInput | Input com syntax highlight. |
| Componente | Descrição |
|---|
| BaseNode | Node base reutilizavel. Handles, label, icone. |
| TriggerNode | Node de gatilho. Icone WhatsApp. |
| ActionNode | Node de ação genérica (send_message). |
| SendTemplateNode | Node de envio de template. |
| ConditionNode | Node de condição (if/else). 2 handles de saída. |
| SwitchNode | Node switch com múltiplas saídas. |
| WaitNode | Node de espera (delay). |
| AiNode | Node de IA. |
| HttpRequestNode | Node de requisição HTTP. |
| AssignNode | Node para atribuir conversa. |
| CloseConversationNode | Node para fechar conversa. |
| TagNode | Node para adicionar/remover tag. |
| Componente | Descrição |
|---|
| WhatsAppIcon | SVG do icone WhatsApp (#25D366). |
Total: 29 componentes
| Componente | Descrição |
|---|
| TemplateBuilder | Builder completo. Auto-save. Preview em tempo real. |
| TemplatePreview | Preview visual (formato celular WhatsApp). |
| TemplateGallery | Galeria de templates pre-definidos. |
| ApprovalDialog | Dialog para submeter para aprovação Meta. |
| HeaderEditor | Editor do header (text, image, video, document). |
| ButtonEditor | Editor de botoes (URL, phone, quick reply). |
| CarouselEditor | Editor de carousel (cards com imagem + botoes). |
| VariableInserter | Popover para inserir variaveis no body. |
Total: 8 componentes
| Componente | Descrição |
|---|
| SegmentBuilder | Dialog/form para criar/editar segmento com FilterBuilder. |
| SegmentSelector | Dropdown para selecionar segmento. Usado em campanhas. |
Total: 2 componentes
| Componente | Descrição |
|---|
| MetricsOverview | Grid de cards com métricas gerais. |
| MessageChart | Recharts AreaChart. Mensagens por dia. |
| CampaignPerformance | Tabela de performance de campanhas. |
| DeliveryFunnel | Funil visual: sent -> delivered -> read. |
| RfmCategoryCard | Card de categoria RFM com contagem. |
| RfmDistributionChart | Gráfico de distribuição RFM. |
Total: 6 componentes
| Componente | Descrição |
|---|
| PlanOverview | Resumo do plano atual. |
| PricingCard | Card de plano para comparação. |
| UsageMeters | Barras de progresso uso vs limite. |
| SubscriptionBanner | Banner de aviso de expiração. |
| BillingHistoryTable | Tabela de histórico de cobrancas. |
| CheckoutSteps | Stepper de checkout. |
| PlanSelectorDialog | Dialog para selecionar plano. |
| CreditCardForm | Form de cartão de crédito. |
| PixPaymentView | Tela de pagamento PIX com QR code. |
| BoletoPaymentView | Tela de pagamento boleto. |
Total: 10 componentes
| Componente | Descrição |
|---|
| AccountSettingsForm | Form de configurações da conta. |
| TeamMembersTable | Tabela de membros. Role badge. |
| InvitesTable | Tabela de convites pendentes. |
| InviteMemberDialog | Dialog para convidar membro. |
| ChangeRoleDialog | Dialog para alterar role. |
Total: 5 componentes
| Componente | Descrição |
|---|
| TrackingSidebar | Sidebar com filtros de status. |
| TrackingRow | Row da lista de rastreamentos. |
| TrackingStepper | Stepper visual com etapas. |
| TrackingTimeline | Timeline detalhada de eventos. |
| AddTrackingDialog | Dialog para adicionar rastreamento. |
Total: 5 componentes
| Componente | Descrição |
|---|
| AccountsTable | Tabela de todas as contas. |
| AccountDetailPanel | Panel de detalhe de conta. |
| RevenueKpiCards | KPI cards de receita (MRR, ARR, churn). |
| RevenueChart | Recharts chart de receita. |
| ChurnChart | Recharts chart de churn rate. |
| PlanDistributionChart | Recharts distribuição por plano. |
Total: 6 componentes
| Componente | Descrição |
|---|
| EmptyState | Estado vazio genérico. Icone + título + ação. |
| ConfirmDialog | Dialog de confirmação genérico. |
| EducationalCard | Card com bullet points educativos. |
| BreadcrumbNav | Breadcrumb de navegação. |
| SkeletonCard | Skeletons pre-definidos (Card, Chart, Table). |
| ErrorBoundary | Error boundary com reset por key. |
| ListControls | Controles de lista: sort dropdown. |
| FolderRow | Row de pasta. Icone colorido, renomear, excluir. |
| FolderBreadcrumb | Breadcrumb de navegação de pastas. |
| UpgradeDialog | Dialog de upgrade quando limite atingido. |
Total: 10 componentes
| Diretório | Componente | Descrição |
|---|
| onboarding/ | SetupChecklist | Checklist de onboarding (5 steps). Dismissible. |
| revenue/ | RevenueKpiCards | KPI cards de receita para analytics. |
| webhooks/ | LogDetailModal | Modal com detalhe de log de webhook. |
| Diretório | Qtd | Tipo |
|---|
| ui/ | 22 | shadcn primitives |
| automations/ | 29 | Editor visual |
| contacts/ | 10 | Gerenciamento de contatos |
| billing/ | 10 | Billing e pagamentos |
| shared/ | 10 | Componentes reutilizaveis |
| layout/ | 8 | Layout global |
| chat/ | 8 | Chat em tempo real |
| templates/ | 8 | Templates WhatsApp |
| dashboard/ | 7 | Dashboard charts/cards |
| analytics/ | 6 | Analytics |
| admin/ | 6 | Painel admin |
| settings/ | 5 | Configurações |
| tracking/ | 5 | Rastreamento |
| segments/ | 2 | Segmentação |
| onboarding/ | 1 | Onboarding |
| revenue/ | 1 | Revenue analytics |
| webhooks/ | 1 | Webhooks |
| TOTAL | 139 | |