forlogic-core 1.14.9 → 1.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -5
- package/dist/README.md +111 -110
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/index.esm.js +1 -1
- package/dist/index.js +1 -1
- package/dist/vite/index.esm.js +10 -3
- package/dist/vite/index.js +10 -3
- package/package.json +4 -1
package/README.md
CHANGED
|
@@ -1094,7 +1094,7 @@ O comando usa credenciais públicas do Supabase do forlogic-core e não requer c
|
|
|
1094
1094
|
|
|
1095
1095
|
### 📚 Estatísticas da Documentação
|
|
1096
1096
|
|
|
1097
|
-
**58 Componentes UI** | **6 Tokens** | **
|
|
1097
|
+
**58 Componentes UI** | **6 Tokens** | **9 Ferramentas CRUD** | **8 Core/Utilitários**
|
|
1098
1098
|
|
|
1099
1099
|
---
|
|
1100
1100
|
|
|
@@ -1120,11 +1120,11 @@ O comando usa credenciais públicas do Supabase do forlogic-core e não requer c
|
|
|
1120
1120
|
- [Alert](./docs/DESIGN_SYSTEM.md#alert) - Exibe uma mensagem de destaque para chamar a atenção do usuário. O componente inclui ícone automático baseado na variante.
|
|
1121
1121
|
- [AppHeader](./docs/DESIGN_SYSTEM.md#appheader) - Header principal da aplicação com título dinâmico, busca global integrada ao CRUD, ações customizáveis e informações do usuário. Altura fixa de 56px (h-14).
|
|
1122
1122
|
- [AppSidebar](./docs/DESIGN_SYSTEM.md#appsidebar) - Sidebar de navegação principal da aplicação com suporte a menu colapsável, permissões, redimensionamento e navegação hierárquica.
|
|
1123
|
+
- [Assinatura Digital (Sign)](./docs/DESIGN_SYSTEM.md#sign) - Componente único multi-provider de assinatura digital com fluxo em 3 fases: Upload → Assinatura → Download. Suporta Clicksign (widget JavaScript embedded v2.1.0, API v3) e D4Sign (iframe embedded, API v1). O provedor é resolvido automaticamente pela configuração da unidade na tabela sign_configs.
|
|
1123
1124
|
- [Avatar](./docs/DESIGN_SYSTEM.md#avatar) - Um elemento de imagem com fallback para representar o usuário.
|
|
1124
1125
|
- [Badge](./docs/DESIGN_SYSTEM.md#badge) - Exibe um badge ou um componente que se parece com um badge.
|
|
1125
1126
|
- [BodyContent](./docs/DESIGN_SYSTEM.md#bodycontent) - Container principal de página com breadcrumb, background neutro e suporte a múltiplos containers de conteúdo.
|
|
1126
1127
|
- [Breadcrumb](./docs/DESIGN_SYSTEM.md#breadcrumb) - Exibe o caminho até o recurso atual usando uma hierarquia de links.
|
|
1127
|
-
- [BulkActionBar](./docs/DESIGN_SYSTEM.md#bulkactionbar) - Barra de ações em massa para operações com múltiplos itens selecionados. Suporta ações customizadas, estados de loading e tooltips para ações desabilitadas.
|
|
1128
1128
|
- [Button](./docs/DESIGN_SYSTEM.md#button) - Componente de botão com variantes semânticas, tamanhos e estados. Use para ações primárias, secundárias e destrutivas.
|
|
1129
1129
|
- [Button Group](./docs/DESIGN_SYSTEM.md#buttongroup) - Agrupa botões relacionados com espaçamento e bordas apropriados.
|
|
1130
1130
|
- [Calendar & Date Picker](./docs/DESIGN_SYSTEM.md#calendar) - Componentes para seleção de datas. O Calendar exibe um calendário interativo, enquanto o Date Picker combina um campo de input com o calendário em um popover.
|
|
@@ -1148,7 +1148,7 @@ O comando usa credenciais públicas do Supabase do forlogic-core e não requer c
|
|
|
1148
1148
|
- [Loading](./docs/DESIGN_SYSTEM.md#skeleton) - Componentes para estados de carregamento: Skeleton (placeholders), Spinner (indicador de loading), e LoadingState (gerenciamento declarativo).
|
|
1149
1149
|
- [Media](./docs/DESIGN_SYSTEM.md#media) - Módulo completo para upload, edição e renderização de imagens e vídeos. Inclui editores interativos, renderizadores otimizados e hook genérico de upload.
|
|
1150
1150
|
- [Menubar](./docs/DESIGN_SYSTEM.md#menubar) - Barra de menu horizontal com submenus, checkboxes e radio items. Ideal para barras de navegação de aplicações desktop-like, seguindo padrões de aplicações nativas.
|
|
1151
|
-
- [ModulesDialog](./docs/DESIGN_SYSTEM.md#modulesdialog) - Dialog para navegação entre módulos do sistema, organizado em abas
|
|
1151
|
+
- [ModulesDialog](./docs/DESIGN_SYSTEM.md#modulesdialog) - Dialog para navegação entre módulos do sistema, organizado em abas (Qualiex, Clássicos) com separação entre módulos contratados e disponíveis, OnboardingDialog para descoberta e cards informativos no rodapé.
|
|
1152
1152
|
- [Navigation Menu](./docs/DESIGN_SYSTEM.md#navigationmenu) - Uma coleção de links para navegação em websites.
|
|
1153
1153
|
- [Onboarding Dialog](./docs/DESIGN_SYSTEM.md#onboardingdialog) - Componente para fluxos de onboarding em múltiplos passos. Suporta imagens estáticas, GIFs, navegação entre steps e indicador de progresso com dropdown.
|
|
1154
1154
|
- [Pagination](./docs/DESIGN_SYSTEM.md#pagination) - Componente de paginação padronizado com layout de 3 colunas, seletor de itens por página e navegação completa.
|
|
@@ -1177,10 +1177,11 @@ O comando usa credenciais públicas do Supabase do forlogic-core e não requer c
|
|
|
1177
1177
|
### 🚀 Sistema CRUD
|
|
1178
1178
|
|
|
1179
1179
|
- [BaseForm](./docs/DESIGN_SYSTEM.md#baseform) - Formulário dinâmico baseado em configuração de seções e campos, suportando múltiplos tipos de campo, validação e layouts flexíveis.
|
|
1180
|
-
- [createCrudPage](./docs/DESIGN_SYSTEM.md#createcrudpage) -
|
|
1180
|
+
- [createCrudPage](./docs/DESIGN_SYSTEM.md#createcrudpage) - Factory de alto nível que gera uma página CRUD completa com ~15 linhas de configuração declarativa.
|
|
1181
1181
|
- [CRUD de Fornecedores](./docs/DESIGN_SYSTEM.md#crudusers) - Padrão completo de CRUD para gestão de fornecedores com 16 campos, incluindo ordenação, filtros avançados, exportação/importação e ações em massa.
|
|
1182
1182
|
- [CRUD Primitives](./docs/DESIGN_SYSTEM.md#crudprimitives) - Componentes de baixo nível para interfaces CRUD totalmente customizadas com controle total sobre layout e comportamento.
|
|
1183
1183
|
- [CRUD System](./docs/DESIGN_SYSTEM.md#crudsystem) - Sistema completo para criação rápida de interfaces CRUD com validação, busca, paginação e muito mais.
|
|
1184
|
+
- [CrudActionBar](./docs/DESIGN_SYSTEM.md#crudactionbar) - Barra de ações unificada usada por todos os componentes CRUD (CrudTable, CrudGrid, createCrudPage) para garantir UX consistente.
|
|
1184
1185
|
- [CrudGrid](./docs/DESIGN_SYSTEM.md#crudgrid) - Componente para exibir dados em formato de grade (cards) com todas as funcionalidades CRUD.
|
|
1185
1186
|
Alternativa visual ao CrudTable para listagens com layout mais visual.
|
|
1186
1187
|
- [CrudTable](./docs/DESIGN_SYSTEM.md#crudtable) - Componente de tabela CRUD completo com ordenação, seleção, resize de colunas, ações em massa e paginação integrada com useCrud.
|
|
@@ -1192,7 +1193,7 @@ O comando usa credenciais públicas do Supabase do forlogic-core e não requer c
|
|
|
1192
1193
|
- [Contexts](./docs/DESIGN_SYSTEM.md#contexts) - Contexts globais da biblioteca forlogic-core para gerenciamento de estado da aplicação. Incluem LocaleContext para i18n, NavigationContext para navegação, PageMetadataContext para metadados de página e ModalStateContext para rastreamento de modais.
|
|
1193
1194
|
- [ErrorBoundary](./docs/DESIGN_SYSTEM.md#errorboundary) - Componente de classe React que captura erros de renderização em componentes filhos, evitando que a aplicação inteira quebre.
|
|
1194
1195
|
- [Hooks](./docs/DESIGN_SYSTEM.md#hooks) - Hooks utilitários da biblioteca forlogic-core para otimização, dados, formatação e UI. Todos os hooks seguem padrões React e são compatíveis com React Query quando aplicável.
|
|
1195
|
-
- [Internacionalização (i18n)](./docs/DESIGN_SYSTEM.md#i18n) - Sistema
|
|
1196
|
+
- [Internacionalização (i18n)](./docs/DESIGN_SYSTEM.md#i18n) - Sistema de internacionalização usando react-i18next com traduções carregadas de um arquivo JSON estático local (lib/i18n/translations.json). Suporta pt-BR, en-US e es-ES com gerenciamento de preferências do usuário.
|
|
1196
1197
|
- [Segurança (Vite Config)](./docs/DESIGN_SYSTEM.md#security) - Plugin de segurança para Vite que aplica headers OWASP, CSP configurável, CORS seguro e proteções contra ataques comuns. Configuração centralizada para todos os projetos Forlogic.
|
|
1197
1198
|
- [Services](./docs/DESIGN_SYSTEM.md#services) - Serviços utilitários da biblioteca forlogic-core para operações CRUD, envio de emails, tratamento de erros e gerenciamento de traduções. Todos os serviços são singletons prontos para uso.
|
|
1198
1199
|
- [Utilities](./docs/DESIGN_SYSTEM.md#utilities) - Funções utilitárias essenciais exportadas pela biblioteca para manipulação de classes CSS, formatação de datas e valores monetários.
|
package/dist/README.md
CHANGED
|
@@ -1090,114 +1090,115 @@ O comando usa credenciais públicas do Supabase do forlogic-core e não requer c
|
|
|
1090
1090
|
|
|
1091
1091
|
---
|
|
1092
1092
|
|
|
1093
|
-
<!-- AUTO_GENERATED_START -->
|
|
1094
|
-
|
|
1095
|
-
### 📚 Estatísticas da Documentação
|
|
1096
|
-
|
|
1097
|
-
**
|
|
1098
|
-
|
|
1099
|
-
---
|
|
1100
|
-
|
|
1101
|
-
### 🎨 Fundamentos (Tokens)
|
|
1102
|
-
|
|
1103
|
-
- [Ícones](./docs/DESIGN_SYSTEM.md#iconsfoundation) - Biblioteca completa de ícones usando Lucide React - uma biblioteca de ícones
|
|
1104
|
-
open-source com mais de 1400 ícones em SVG.
|
|
1105
|
-
- [Sistema de Cores](./docs/DESIGN_SYSTEM.md#colorsfoundation) - Sistema de cores profissional completo com escala neutra (0-1000), escala de marca (50-900),
|
|
1106
|
-
e cores funcionais (sucesso, aviso, perigo, sharp). Todas as cores garantem conformidade de contraste WCAG AA.
|
|
1107
|
-
- [Sistema de Espaçamento](./docs/DESIGN_SYSTEM.md#spacing) - Escala de espaçamento consistente baseada em uma unidade base de 4px (0.25rem),
|
|
1108
|
-
garantindo ritmo visual e alinhamento em todos os componentes.
|
|
1109
|
-
- [Sistema de Raio de Borda](./docs/DESIGN_SYSTEM.md#radius) - Arredondamento de cantos consistente que cria harmonia visual e
|
|
1110
|
-
define a personalidade da interface.
|
|
1111
|
-
- [Sistema de Sombras e Elevação](./docs/DESIGN_SYSTEM.md#shadows) - Sombras criam profundidade e hierarquia, ajudando usuários a entender as relações
|
|
1112
|
-
espaciais entre elementos e seus estados interativos.
|
|
1113
|
-
- [Sistema Tipográfico](./docs/DESIGN_SYSTEM.md#typographyfoundation) - Sistema tipográfico profissional com Display (2 níveis), Headings (6 níveis), Subtitle (2 níveis),
|
|
1114
|
-
Body (2 níveis), Label (2 níveis) e Monospace (Code). Todos os níveis incluem escalamento responsivo e conformidade de acessibilidade.
|
|
1115
|
-
|
|
1116
|
-
### 🧩 Componentes UI
|
|
1117
|
-
|
|
1118
|
-
- [Accordion & Collapsible](./docs/DESIGN_SYSTEM.md#accordion) - Componentes de expansão/colapso para revelar conteúdo. Accordion para múltiplos itens, Collapsible para item único.
|
|
1119
|
-
- [Action Button](./docs/DESIGN_SYSTEM.md#actionbutton) - Botão compacto otimizado para ações em linhas de tabela e menus dropdown. OBRIGATÓRIO para todas as ações em tabelas CRUD.
|
|
1120
|
-
- [Alert](./docs/DESIGN_SYSTEM.md#alert) - Exibe uma mensagem de destaque para chamar a atenção do usuário. O componente inclui ícone automático baseado na variante.
|
|
1121
|
-
- [AppHeader](./docs/DESIGN_SYSTEM.md#appheader) - Header principal da aplicação com título dinâmico, busca global integrada ao CRUD, ações customizáveis e informações do usuário. Altura fixa de 56px (h-14).
|
|
1122
|
-
- [AppSidebar](./docs/DESIGN_SYSTEM.md#appsidebar) - Sidebar de navegação principal da aplicação com suporte a menu colapsável, permissões, redimensionamento e navegação hierárquica.
|
|
1123
|
-
- [Avatar](./docs/DESIGN_SYSTEM.md#avatar) - Um elemento de imagem com fallback para representar o usuário.
|
|
1124
|
-
- [Badge](./docs/DESIGN_SYSTEM.md#badge) - Exibe um badge ou um componente que se parece com um badge.
|
|
1125
|
-
- [BodyContent](./docs/DESIGN_SYSTEM.md#bodycontent) - Container principal de página com breadcrumb, background neutro e suporte a múltiplos containers de conteúdo.
|
|
1126
|
-
- [Breadcrumb](./docs/DESIGN_SYSTEM.md#breadcrumb) - Exibe o caminho até o recurso atual usando uma hierarquia de links.
|
|
1127
|
-
- [BulkActionBar](./docs/DESIGN_SYSTEM.md#bulkactionbar) - Barra de ações em massa para operações com múltiplos itens selecionados. Suporta ações customizadas, estados de loading e tooltips para ações desabilitadas.
|
|
1128
|
-
- [Button](./docs/DESIGN_SYSTEM.md#button) - Componente de botão com variantes semânticas, tamanhos e estados. Use para ações primárias, secundárias e destrutivas.
|
|
1129
|
-
- [Button Group](./docs/DESIGN_SYSTEM.md#buttongroup) - Agrupa botões relacionados com espaçamento e bordas apropriados.
|
|
1130
|
-
- [Calendar & Date Picker](./docs/DESIGN_SYSTEM.md#calendar) - Componentes para seleção de datas. O Calendar exibe um calendário interativo, enquanto o Date Picker combina um campo de input com o calendário em um popover.
|
|
1131
|
-
- [Card](./docs/DESIGN_SYSTEM.md#card) - Exibe um card com cabeçalho, conteúdo e rodapé.
|
|
1132
|
-
- [Chart](./docs/DESIGN_SYSTEM.md#chart) - Sistema de gráficos baseado em Recharts com suporte a temas e tooltips customizados. Inclui barras, linhas, áreas, pizza, radar e mais.
|
|
1133
|
-
- [Checkbox](./docs/DESIGN_SYSTEM.md#checkbox) - Um controle que permite ao usuário alternar entre marcado e desmarcado.
|
|
1134
|
-
- [Color Picker](./docs/DESIGN_SYSTEM.md#colorpicker) - Seletor de cores com paleta predefinida e seletor customizado.
|
|
1135
|
-
- [Combobox](./docs/DESIGN_SYSTEM.md#combobox) - Componente versátil para seleção única ou múltipla com busca inteligente. Combina Popover e Command para autocomplete. O componente Command é usado internamente para fornecer funcionalidades de busca e navegação por teclado.
|
|
1136
|
-
- [Context Menu](./docs/DESIGN_SYSTEM.md#contextmenu) - Exibe um menu ao usuário — como um conjunto de ações ou funções — acionado por um clique com o botão direito do mouse.
|
|
1137
|
-
- [DataList](./docs/DESIGN_SYSTEM.md#datalist) - Sistema de lista de dados com composição de componentes. Ideal para exibir informações estruturadas em formato de cards.
|
|
1138
|
-
- [Dialog](./docs/DESIGN_SYSTEM.md#dialog) - Uma janela sobreposta à janela principal ou a outra janela de diálogo, tornando o conteúdo abaixo inerte. Inclui variações para seleção, tabelas e formulários.
|
|
1139
|
-
- [Dropdown Menu](./docs/DESIGN_SYSTEM.md#dropdownmenu) - Exibe um menu ao usuário — como um conjunto de ações ou funções — acionado por um botão ou elemento interativo.
|
|
1140
|
-
- [Empty State](./docs/DESIGN_SYSTEM.md#emptystate) - Componente para exibir estados vazios com ícone, mensagem e ação opcional.
|
|
1141
|
-
- [Form](./docs/DESIGN_SYSTEM.md#form) - Construindo formulários com React Hook Form e Zod.
|
|
1142
|
-
- [Grid & Stack](./docs/DESIGN_SYSTEM.md#grid) - Sistema de layout com Grid responsivo e Stack flexível para organização de conteúdo.
|
|
1143
|
-
- [Hover Card](./docs/DESIGN_SYSTEM.md#hovercard) - Para usuários com visão visualizarem conteúdo disponível por trás de um link. Exibe informações adicionais ao passar o mouse.
|
|
1144
|
-
- [Icon Picker](./docs/DESIGN_SYSTEM.md#iconpicker) - Seletor de ícones da biblioteca Lucide React com busca integrada.
|
|
1145
|
-
- [Input](./docs/DESIGN_SYSTEM.md#input) - Campo de entrada de texto com suporte a todos os tipos HTML. Inclui Label para rótulos acessíveis e InputGroup para agrupar inputs com addons de prefixo, sufixo, ícones e botões.
|
|
1146
|
-
- [Label](./docs/DESIGN_SYSTEM.md#label) - Renderiza uma label acessível associada a controles de formulário.
|
|
1147
|
-
- [Leadership](./docs/DESIGN_SYSTEM.md#leadership) - Módulo hierárquico de liderança para gerenciar relações de liderança entre usuários do Qualiex. Inclui componentes visuais, hooks de API e utilitários para construção de árvores hierárquicas.
|
|
1148
|
-
- [Loading](./docs/DESIGN_SYSTEM.md#skeleton) - Componentes para estados de carregamento: Skeleton (placeholders), Spinner (indicador de loading), e LoadingState (gerenciamento declarativo).
|
|
1149
|
-
- [Media](./docs/DESIGN_SYSTEM.md#media) - Módulo completo para upload, edição e renderização de imagens e vídeos. Inclui editores interativos, renderizadores otimizados e hook genérico de upload.
|
|
1150
|
-
- [Menubar](./docs/DESIGN_SYSTEM.md#menubar) - Barra de menu horizontal com submenus, checkboxes e radio items. Ideal para barras de navegação de aplicações desktop-like, seguindo padrões de aplicações nativas.
|
|
1151
|
-
- [ModulesDialog](./docs/DESIGN_SYSTEM.md#modulesdialog) - Dialog para navegação entre módulos do sistema, organizado em abas por grupo (Qualiex, Saber Gestão, Clássicos) com cards informativos e links de ajuda.
|
|
1152
|
-
- [Navigation Menu](./docs/DESIGN_SYSTEM.md#navigationmenu) - Uma coleção de links para navegação em websites.
|
|
1153
|
-
- [Onboarding Dialog](./docs/DESIGN_SYSTEM.md#onboardingdialog) - Componente para fluxos de onboarding em múltiplos passos. Suporta imagens estáticas, GIFs, navegação entre steps e indicador de progresso com dropdown.
|
|
1154
|
-
- [Pagination](./docs/DESIGN_SYSTEM.md#pagination) - Componente de paginação padronizado com layout de 3 colunas, seletor de itens por página e navegação completa.
|
|
1155
|
-
- [Pagination](./docs/DESIGN_SYSTEM.md#pagination) - Barra de paginação completa com seletor de itens por página e controles de navegação.
|
|
1156
|
-
- [Places](./docs/DESIGN_SYSTEM.md#places) - Módulo para gerenciar estruturas hierárquicas de locais integrado com a API Qualiex. Inclui visualização em árvore, gestão de acessos e componentes reutilizáveis.
|
|
1157
|
-
- [Popover](./docs/DESIGN_SYSTEM.md#popover) - Exibe conteúdo rico em um portal, acionado por um botão.
|
|
1158
|
-
- [Progress](./docs/DESIGN_SYSTEM.md#progress) - Exibe um indicador mostrando o progresso de conclusão de uma tarefa, tipicamente exibido como uma barra de progresso.
|
|
1159
|
-
- [QualiexUserField](./docs/DESIGN_SYSTEM.md#qualiexuserfield) - Campo de seleção de usuários integrado com a API Qualiex. Suporta seleção única ou múltipla, display customizado, filtros e funciona perfeitamente dentro de Dialogs.
|
|
1160
|
-
- [Radio Group](./docs/DESIGN_SYSTEM.md#radiogroup) - Um conjunto de botões marcáveis—conhecidos como botões de rádio—onde apenas um pode ser marcado por vez.
|
|
1161
|
-
- [RequiredFieldsCounter](./docs/DESIGN_SYSTEM.md#requiredfieldscounter) - Indica o progresso de preenchimento de campos obrigatórios em formulários com feedback visual e tooltips informativos.
|
|
1162
|
-
- [Resizable](./docs/DESIGN_SYSTEM.md#resizable) - Painéis redimensionáveis para criar layouts flexíveis e adaptáveis. Baseado em react-resizable-panels.
|
|
1163
|
-
- [Rich Text Editor](./docs/DESIGN_SYSTEM.md#richtexteditor) - Editor de texto rico construído com Tiptap, suportando formatação visual, edição de código HTML e preview. Ideal para formulários que precisam de conteúdo formatado.
|
|
1164
|
-
- [Select](./docs/DESIGN_SYSTEM.md#select) - Exibe uma lista de opções para o usuário escolher—acionada por um botão.
|
|
1165
|
-
- [Separator](./docs/DESIGN_SYSTEM.md#separator) - Separa visual ou semanticamente o conteúdo.
|
|
1166
|
-
- [Slider](./docs/DESIGN_SYSTEM.md#slider) - Um input onde o usuário seleciona um valor dentro de um intervalo determinado.
|
|
1167
|
-
- [Split Button](./docs/DESIGN_SYSTEM.md#splitbutton) - Combina uma ação principal com ações secundárias em um menu dropdown. Ideal para destacar a ação prioritária enquanto mantém alternativas acessíveis.
|
|
1168
|
-
- [
|
|
1169
|
-
- [
|
|
1170
|
-
- [
|
|
1171
|
-
- [
|
|
1172
|
-
- [
|
|
1173
|
-
- [
|
|
1174
|
-
- [
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
- [
|
|
1180
|
-
- [
|
|
1181
|
-
- [CRUD
|
|
1182
|
-
- [CRUD
|
|
1183
|
-
- [
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
- [
|
|
1187
|
-
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
- [
|
|
1192
|
-
- [
|
|
1193
|
-
- [
|
|
1194
|
-
- [
|
|
1195
|
-
- [
|
|
1196
|
-
- [
|
|
1197
|
-
- [
|
|
1198
|
-
|
|
1199
|
-
|
|
1200
|
-
|
|
1201
|
-
|
|
1202
|
-
|
|
1093
|
+
<!-- AUTO_GENERATED_START -->
|
|
1094
|
+
|
|
1095
|
+
### 📚 Estatísticas da Documentação
|
|
1096
|
+
|
|
1097
|
+
**58 Componentes UI** | **6 Tokens** | **8 Ferramentas CRUD** | **8 Core/Utilitários**
|
|
1098
|
+
|
|
1099
|
+
---
|
|
1100
|
+
|
|
1101
|
+
### 🎨 Fundamentos (Tokens)
|
|
1102
|
+
|
|
1103
|
+
- [Ícones](./docs/DESIGN_SYSTEM.md#iconsfoundation) - Biblioteca completa de ícones usando Lucide React - uma biblioteca de ícones
|
|
1104
|
+
open-source com mais de 1400 ícones em SVG.
|
|
1105
|
+
- [Sistema de Cores](./docs/DESIGN_SYSTEM.md#colorsfoundation) - Sistema de cores profissional completo com escala neutra (0-1000), escala de marca (50-900),
|
|
1106
|
+
e cores funcionais (sucesso, aviso, perigo, sharp). Todas as cores garantem conformidade de contraste WCAG AA.
|
|
1107
|
+
- [Sistema de Espaçamento](./docs/DESIGN_SYSTEM.md#spacing) - Escala de espaçamento consistente baseada em uma unidade base de 4px (0.25rem),
|
|
1108
|
+
garantindo ritmo visual e alinhamento em todos os componentes.
|
|
1109
|
+
- [Sistema de Raio de Borda](./docs/DESIGN_SYSTEM.md#radius) - Arredondamento de cantos consistente que cria harmonia visual e
|
|
1110
|
+
define a personalidade da interface.
|
|
1111
|
+
- [Sistema de Sombras e Elevação](./docs/DESIGN_SYSTEM.md#shadows) - Sombras criam profundidade e hierarquia, ajudando usuários a entender as relações
|
|
1112
|
+
espaciais entre elementos e seus estados interativos.
|
|
1113
|
+
- [Sistema Tipográfico](./docs/DESIGN_SYSTEM.md#typographyfoundation) - Sistema tipográfico profissional com Display (2 níveis), Headings (6 níveis), Subtitle (2 níveis),
|
|
1114
|
+
Body (2 níveis), Label (2 níveis) e Monospace (Code). Todos os níveis incluem escalamento responsivo e conformidade de acessibilidade.
|
|
1115
|
+
|
|
1116
|
+
### 🧩 Componentes UI
|
|
1117
|
+
|
|
1118
|
+
- [Accordion & Collapsible](./docs/DESIGN_SYSTEM.md#accordion) - Componentes de expansão/colapso para revelar conteúdo. Accordion para múltiplos itens, Collapsible para item único.
|
|
1119
|
+
- [Action Button](./docs/DESIGN_SYSTEM.md#actionbutton) - Botão compacto otimizado para ações em linhas de tabela e menus dropdown. OBRIGATÓRIO para todas as ações em tabelas CRUD.
|
|
1120
|
+
- [Alert](./docs/DESIGN_SYSTEM.md#alert) - Exibe uma mensagem de destaque para chamar a atenção do usuário. O componente inclui ícone automático baseado na variante.
|
|
1121
|
+
- [AppHeader](./docs/DESIGN_SYSTEM.md#appheader) - Header principal da aplicação com título dinâmico, busca global integrada ao CRUD, ações customizáveis e informações do usuário. Altura fixa de 56px (h-14).
|
|
1122
|
+
- [AppSidebar](./docs/DESIGN_SYSTEM.md#appsidebar) - Sidebar de navegação principal da aplicação com suporte a menu colapsável, permissões, redimensionamento e navegação hierárquica.
|
|
1123
|
+
- [Avatar](./docs/DESIGN_SYSTEM.md#avatar) - Um elemento de imagem com fallback para representar o usuário.
|
|
1124
|
+
- [Badge](./docs/DESIGN_SYSTEM.md#badge) - Exibe um badge ou um componente que se parece com um badge.
|
|
1125
|
+
- [BodyContent](./docs/DESIGN_SYSTEM.md#bodycontent) - Container principal de página com breadcrumb, background neutro e suporte a múltiplos containers de conteúdo.
|
|
1126
|
+
- [Breadcrumb](./docs/DESIGN_SYSTEM.md#breadcrumb) - Exibe o caminho até o recurso atual usando uma hierarquia de links.
|
|
1127
|
+
- [BulkActionBar](./docs/DESIGN_SYSTEM.md#bulkactionbar) - Barra de ações em massa para operações com múltiplos itens selecionados. Suporta ações customizadas, estados de loading e tooltips para ações desabilitadas.
|
|
1128
|
+
- [Button](./docs/DESIGN_SYSTEM.md#button) - Componente de botão com variantes semânticas, tamanhos e estados. Use para ações primárias, secundárias e destrutivas.
|
|
1129
|
+
- [Button Group](./docs/DESIGN_SYSTEM.md#buttongroup) - Agrupa botões relacionados com espaçamento e bordas apropriados.
|
|
1130
|
+
- [Calendar & Date Picker](./docs/DESIGN_SYSTEM.md#calendar) - Componentes para seleção de datas. O Calendar exibe um calendário interativo, enquanto o Date Picker combina um campo de input com o calendário em um popover.
|
|
1131
|
+
- [Card](./docs/DESIGN_SYSTEM.md#card) - Exibe um card com cabeçalho, conteúdo e rodapé.
|
|
1132
|
+
- [Chart](./docs/DESIGN_SYSTEM.md#chart) - Sistema de gráficos baseado em Recharts com suporte a temas e tooltips customizados. Inclui barras, linhas, áreas, pizza, radar e mais.
|
|
1133
|
+
- [Checkbox](./docs/DESIGN_SYSTEM.md#checkbox) - Um controle que permite ao usuário alternar entre marcado e desmarcado.
|
|
1134
|
+
- [Color Picker](./docs/DESIGN_SYSTEM.md#colorpicker) - Seletor de cores com paleta predefinida e seletor customizado.
|
|
1135
|
+
- [Combobox](./docs/DESIGN_SYSTEM.md#combobox) - Componente versátil para seleção única ou múltipla com busca inteligente. Combina Popover e Command para autocomplete. O componente Command é usado internamente para fornecer funcionalidades de busca e navegação por teclado.
|
|
1136
|
+
- [Context Menu](./docs/DESIGN_SYSTEM.md#contextmenu) - Exibe um menu ao usuário — como um conjunto de ações ou funções — acionado por um clique com o botão direito do mouse.
|
|
1137
|
+
- [DataList](./docs/DESIGN_SYSTEM.md#datalist) - Sistema de lista de dados com composição de componentes. Ideal para exibir informações estruturadas em formato de cards.
|
|
1138
|
+
- [Dialog](./docs/DESIGN_SYSTEM.md#dialog) - Uma janela sobreposta à janela principal ou a outra janela de diálogo, tornando o conteúdo abaixo inerte. Inclui variações para seleção, tabelas e formulários.
|
|
1139
|
+
- [Dropdown Menu](./docs/DESIGN_SYSTEM.md#dropdownmenu) - Exibe um menu ao usuário — como um conjunto de ações ou funções — acionado por um botão ou elemento interativo.
|
|
1140
|
+
- [Empty State](./docs/DESIGN_SYSTEM.md#emptystate) - Componente para exibir estados vazios com ícone, mensagem e ação opcional.
|
|
1141
|
+
- [Form](./docs/DESIGN_SYSTEM.md#form) - Construindo formulários com React Hook Form e Zod.
|
|
1142
|
+
- [Grid & Stack](./docs/DESIGN_SYSTEM.md#grid) - Sistema de layout com Grid responsivo e Stack flexível para organização de conteúdo.
|
|
1143
|
+
- [Hover Card](./docs/DESIGN_SYSTEM.md#hovercard) - Para usuários com visão visualizarem conteúdo disponível por trás de um link. Exibe informações adicionais ao passar o mouse.
|
|
1144
|
+
- [Icon Picker](./docs/DESIGN_SYSTEM.md#iconpicker) - Seletor de ícones da biblioteca Lucide React com busca integrada.
|
|
1145
|
+
- [Input](./docs/DESIGN_SYSTEM.md#input) - Campo de entrada de texto com suporte a todos os tipos HTML. Inclui Label para rótulos acessíveis e InputGroup para agrupar inputs com addons de prefixo, sufixo, ícones e botões.
|
|
1146
|
+
- [Label](./docs/DESIGN_SYSTEM.md#label) - Renderiza uma label acessível associada a controles de formulário.
|
|
1147
|
+
- [Leadership](./docs/DESIGN_SYSTEM.md#leadership) - Módulo hierárquico de liderança para gerenciar relações de liderança entre usuários do Qualiex. Inclui componentes visuais, hooks de API e utilitários para construção de árvores hierárquicas.
|
|
1148
|
+
- [Loading](./docs/DESIGN_SYSTEM.md#skeleton) - Componentes para estados de carregamento: Skeleton (placeholders), Spinner (indicador de loading), e LoadingState (gerenciamento declarativo).
|
|
1149
|
+
- [Media](./docs/DESIGN_SYSTEM.md#media) - Módulo completo para upload, edição e renderização de imagens e vídeos. Inclui editores interativos, renderizadores otimizados e hook genérico de upload.
|
|
1150
|
+
- [Menubar](./docs/DESIGN_SYSTEM.md#menubar) - Barra de menu horizontal com submenus, checkboxes e radio items. Ideal para barras de navegação de aplicações desktop-like, seguindo padrões de aplicações nativas.
|
|
1151
|
+
- [ModulesDialog](./docs/DESIGN_SYSTEM.md#modulesdialog) - Dialog para navegação entre módulos do sistema, organizado em abas por grupo (Qualiex, Saber Gestão, Clássicos) com cards informativos e links de ajuda.
|
|
1152
|
+
- [Navigation Menu](./docs/DESIGN_SYSTEM.md#navigationmenu) - Uma coleção de links para navegação em websites.
|
|
1153
|
+
- [Onboarding Dialog](./docs/DESIGN_SYSTEM.md#onboardingdialog) - Componente para fluxos de onboarding em múltiplos passos. Suporta imagens estáticas, GIFs, navegação entre steps e indicador de progresso com dropdown.
|
|
1154
|
+
- [Pagination](./docs/DESIGN_SYSTEM.md#pagination) - Componente de paginação padronizado com layout de 3 colunas, seletor de itens por página e navegação completa.
|
|
1155
|
+
- [Pagination](./docs/DESIGN_SYSTEM.md#pagination) - Barra de paginação completa com seletor de itens por página e controles de navegação.
|
|
1156
|
+
- [Places](./docs/DESIGN_SYSTEM.md#places) - Módulo para gerenciar estruturas hierárquicas de locais integrado com a API Qualiex. Inclui visualização em árvore, gestão de acessos e componentes reutilizáveis.
|
|
1157
|
+
- [Popover](./docs/DESIGN_SYSTEM.md#popover) - Exibe conteúdo rico em um portal, acionado por um botão.
|
|
1158
|
+
- [Progress](./docs/DESIGN_SYSTEM.md#progress) - Exibe um indicador mostrando o progresso de conclusão de uma tarefa, tipicamente exibido como uma barra de progresso.
|
|
1159
|
+
- [QualiexUserField](./docs/DESIGN_SYSTEM.md#qualiexuserfield) - Campo de seleção de usuários integrado com a API Qualiex. Suporta seleção única ou múltipla, display customizado, filtros e funciona perfeitamente dentro de Dialogs.
|
|
1160
|
+
- [Radio Group](./docs/DESIGN_SYSTEM.md#radiogroup) - Um conjunto de botões marcáveis—conhecidos como botões de rádio—onde apenas um pode ser marcado por vez.
|
|
1161
|
+
- [RequiredFieldsCounter](./docs/DESIGN_SYSTEM.md#requiredfieldscounter) - Indica o progresso de preenchimento de campos obrigatórios em formulários com feedback visual e tooltips informativos.
|
|
1162
|
+
- [Resizable](./docs/DESIGN_SYSTEM.md#resizable) - Painéis redimensionáveis para criar layouts flexíveis e adaptáveis. Baseado em react-resizable-panels.
|
|
1163
|
+
- [Rich Text Editor](./docs/DESIGN_SYSTEM.md#richtexteditor) - Editor de texto rico construído com Tiptap, suportando formatação visual, edição de código HTML e preview. Ideal para formulários que precisam de conteúdo formatado.
|
|
1164
|
+
- [Select](./docs/DESIGN_SYSTEM.md#select) - Exibe uma lista de opções para o usuário escolher—acionada por um botão.
|
|
1165
|
+
- [Separator](./docs/DESIGN_SYSTEM.md#separator) - Separa visual ou semanticamente o conteúdo.
|
|
1166
|
+
- [Slider](./docs/DESIGN_SYSTEM.md#slider) - Um input onde o usuário seleciona um valor dentro de um intervalo determinado.
|
|
1167
|
+
- [Split Button](./docs/DESIGN_SYSTEM.md#splitbutton) - Combina uma ação principal com ações secundárias em um menu dropdown. Ideal para destacar a ação prioritária enquanto mantém alternativas acessíveis.
|
|
1168
|
+
- [Step Selector](./docs/DESIGN_SYSTEM.md#stepselector) - Componente de navegação para Wizards multi-etapas. Combina um DropdownMenu para seleção de etapas com uma barra de Progress para indicação visual do progresso.
|
|
1169
|
+
- [Switch](./docs/DESIGN_SYSTEM.md#switch) - Um controle que permite ao usuário alternar entre marcado e desmarcado.
|
|
1170
|
+
- [Table](./docs/DESIGN_SYSTEM.md#table) - Uma tabela semântica para exibir dados tabulares. Inclui TableResizeHandle para redimensionamento de colunas e TruncatedCell para texto truncado com tooltip automático.
|
|
1171
|
+
- [Tabs & TabPageLayout](./docs/DESIGN_SYSTEM.md#tabs) - Componentes de navegação em abas. Tabs para conteúdo simples e TabPageLayout para páginas completas com header fixo e scroll.
|
|
1172
|
+
- [Textarea](./docs/DESIGN_SYSTEM.md#textarea) - Exibe um textarea de formulário ou um componente que se parece com um textarea.
|
|
1173
|
+
- [Toast](./docs/DESIGN_SYSTEM.md#toast) - Componente de notificação toast usando Sonner. Feedback temporário e não bloqueante que informa rapidamente o usuário sem competir visualmente com outros Toasts.
|
|
1174
|
+
- [Toggle](./docs/DESIGN_SYSTEM.md#toggle) - Botões de dois estados que podem estar ligados ou desligados, individualmente ou em grupo.
|
|
1175
|
+
- [Tooltip](./docs/DESIGN_SYSTEM.md#tooltip) - Um popup que exibe informações relacionadas a um elemento quando o elemento recebe foco do teclado ou o mouse passa sobre ele.
|
|
1176
|
+
|
|
1177
|
+
### 🚀 Sistema CRUD
|
|
1178
|
+
|
|
1179
|
+
- [BaseForm](./docs/DESIGN_SYSTEM.md#baseform) - Formulário dinâmico baseado em configuração de seções e campos, suportando múltiplos tipos de campo, validação e layouts flexíveis.
|
|
1180
|
+
- [createCrudPage](./docs/DESIGN_SYSTEM.md#createcrudpage) - Gerador de página CRUD completa com tabela, formulário, filtros, paginação e ações em massa de alto nível.
|
|
1181
|
+
- [CRUD de Fornecedores](./docs/DESIGN_SYSTEM.md#crudusers) - Padrão completo de CRUD para gestão de fornecedores com 16 campos, incluindo ordenação, filtros avançados, exportação/importação e ações em massa.
|
|
1182
|
+
- [CRUD Primitives](./docs/DESIGN_SYSTEM.md#crudprimitives) - Componentes de baixo nível para interfaces CRUD totalmente customizadas com controle total sobre layout e comportamento.
|
|
1183
|
+
- [CRUD System](./docs/DESIGN_SYSTEM.md#crudsystem) - Sistema completo para criação rápida de interfaces CRUD com validação, busca, paginação e muito mais.
|
|
1184
|
+
- [CrudGrid](./docs/DESIGN_SYSTEM.md#crudgrid) - Componente para exibir dados em formato de grade (cards) com todas as funcionalidades CRUD.
|
|
1185
|
+
Alternativa visual ao CrudTable para listagens com layout mais visual.
|
|
1186
|
+
- [CrudTable](./docs/DESIGN_SYSTEM.md#crudtable) - Componente de tabela CRUD completo com ordenação, seleção, resize de colunas, ações em massa e paginação integrada com useCrud.
|
|
1187
|
+
- [Sistema CRUD](./docs/DESIGN_SYSTEM.md#crudoverview) - Componentes padronizados para operações Create, Read, Update e Delete com arquitetura em 3 níveis de abstração.
|
|
1188
|
+
|
|
1189
|
+
### 🔧 Core & Utilitários
|
|
1190
|
+
|
|
1191
|
+
- [Autenticação (Auth)](./docs/DESIGN_SYSTEM.md#auth) - Sistema completo de autenticação OAuth integrado com Qualiex. Inclui gerenciamento de tokens, rotas protegidas, suporte multi-tenant e troca de unidades.
|
|
1192
|
+
- [Contexts](./docs/DESIGN_SYSTEM.md#contexts) - Contexts globais da biblioteca forlogic-core para gerenciamento de estado da aplicação. Incluem LocaleContext para i18n, NavigationContext para navegação, PageMetadataContext para metadados de página e ModalStateContext para rastreamento de modais.
|
|
1193
|
+
- [ErrorBoundary](./docs/DESIGN_SYSTEM.md#errorboundary) - Componente de classe React que captura erros de renderização em componentes filhos, evitando que a aplicação inteira quebre.
|
|
1194
|
+
- [Hooks](./docs/DESIGN_SYSTEM.md#hooks) - Hooks utilitários da biblioteca forlogic-core para otimização, dados, formatação e UI. Todos os hooks seguem padrões React e são compatíveis com React Query quando aplicável.
|
|
1195
|
+
- [Internacionalização (i18n)](./docs/DESIGN_SYSTEM.md#i18n) - Sistema completo de internacionalização usando react-i18next com backend customizado para Supabase. Suporta pt-BR, en-US e es-ES com gerenciamento de preferências do usuário.
|
|
1196
|
+
- [Segurança (Vite Config)](./docs/DESIGN_SYSTEM.md#security) - Plugin de segurança para Vite que aplica headers OWASP, CSP configurável, CORS seguro e proteções contra ataques comuns. Configuração centralizada para todos os projetos Forlogic.
|
|
1197
|
+
- [Services](./docs/DESIGN_SYSTEM.md#services) - Serviços utilitários da biblioteca forlogic-core para operações CRUD, envio de emails, tratamento de erros e gerenciamento de traduções. Todos os serviços são singletons prontos para uso.
|
|
1198
|
+
- [Utilities](./docs/DESIGN_SYSTEM.md#utilities) - Funções utilitárias essenciais exportadas pela biblioteca para manipulação de classes CSS, formatação de datas e valores monetários.
|
|
1199
|
+
|
|
1200
|
+
---
|
|
1201
|
+
|
|
1202
|
+
> 📘 **Documentação Completa**: Para ver detalhes de props, exemplos de uso e acessibilidade de cada componente, consulte o [Design System Completo](./docs/DESIGN_SYSTEM.md).
|
|
1203
|
+
|
|
1203
1204
|
<!-- AUTO_GENERATED_END -->
|