forlogic-core 2.0.3 → 2.0.4

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.
@@ -38,10 +38,11 @@ export interface SidebarActionsConfig {
38
38
  export interface SidebarNavigationItem {
39
39
  label: string;
40
40
  path: string;
41
- icon: LucideIcon;
41
+ icon?: LucideIcon;
42
42
  complementaryText?: string;
43
43
  permissionCheck?: () => Promise<boolean>;
44
44
  children?: SidebarNavigationItem[];
45
+ type?: 'separator';
45
46
  }
46
47
  export interface SidebarConfig {
47
48
  appName?: string;
@@ -0,0 +1,74 @@
1
+ # Prompt de Auditoria — Design System
2
+
3
+ > **Como usar**: Cole este prompt em uma conversa do Lovable no projeto consumidor para auditar e corrigir violações do Design System.
4
+
5
+ ---
6
+
7
+ ## Prompt para copiar
8
+
9
+ ```
10
+ Audite TODOS os arquivos .tsx do projeto em busca de violações do Design System do forlogic-core.
11
+
12
+ Antes de começar, leia obrigatoriamente via cross-project:
13
+ @Admin docs/design-system/crud.md
14
+ @Admin docs/design-system/inputs.md
15
+ @Admin docs/design-system/selectors.md
16
+ @Admin docs/design-system/layout.md
17
+ @Admin docs/design-system/dialogs.md
18
+ @Admin docs/design-system/buttons-actions.md
19
+
20
+ Verifique CADA arquivo .tsx contra estas regras:
21
+
22
+ ### Imports inválidos
23
+ - [ ] Import de componente UI que NÃO vem de `forlogic-core` (Button, Dialog, Input, Select, Table, etc.)
24
+ - [ ] Import de `react-i18next` em vez de `useTranslation` de `forlogic-core`
25
+ - [ ] Import de `@/integrations/supabase/client` em vez de `getSupabaseClient()` de `forlogic-core`
26
+
27
+ ### Componentes proibidos
28
+ - [ ] `<Select>` ou `<StatusSelect>` → deve ser `<Combobox>`
29
+ - [ ] `<MoreHorizontal>` genérico como menu de ações → deve ser `<ActionButton>`
30
+ - [ ] `<DeleteConfirmationDialog>` → deve ser `<Dialog>`
31
+ - [ ] `<Searchbar>` → deve ser `<Input>` com ícone de busca
32
+ - [ ] `BulkActionBar` separado → deve ser dropdown no `CrudActionBar`
33
+ - [ ] Paginação manual → deve ser `CrudPrimitivePagination`
34
+
35
+ ### Supabase
36
+ - [ ] Query sem `.schema('SCHEMA_PADRAO')` (qualquer `supabase.from(` direto)
37
+ - [ ] DELETE físico (deve ser soft delete com `deleted_at`)
38
+ - [ ] `supabase` importado diretamente do client em vez de `getSupabaseClient()`
39
+
40
+ ### Layout
41
+ - [ ] Página sem `usePageMetadata` (título/subtítulo)
42
+ - [ ] Layout sem `AppLayout` + `AppSidebar`
43
+ - [ ] Componente criado localmente quando existe equivalente na lib
44
+
45
+ ### Formulários
46
+ - [ ] Formulário sem `BaseForm` ou `react-hook-form` + `zod`
47
+ - [ ] Select nativo HTML em vez de `Combobox`
48
+
49
+ Para cada violação encontrada, gere um relatório no formato:
50
+
51
+ | Arquivo | Linha | Violação | Correção |
52
+ |---------|-------|----------|----------|
53
+ | src/pages/X.tsx | 15 | Import de Button local | Usar `import { Button } from 'forlogic-core'` |
54
+
55
+ Depois do relatório, pergunte se devo corrigir automaticamente.
56
+ ```
57
+
58
+ ---
59
+
60
+ ## Variações
61
+
62
+ ### Auditoria rápida (apenas imports)
63
+
64
+ ```
65
+ Busque em TODOS os arquivos .tsx do projeto por imports que NÃO vêm de 'forlogic-core'.
66
+ Liste: arquivo, linha, import atual, e o import correto de forlogic-core.
67
+ ```
68
+
69
+ ### Auditoria de Supabase
70
+
71
+ ```
72
+ Busque em TODOS os arquivos .ts/.tsx por chamadas a `supabase.from(` sem `.schema('SCHEMA_PADRAO')`.
73
+ Liste: arquivo, linha, query atual, e a correção com .schema().
74
+ ```
@@ -0,0 +1,117 @@
1
+ # KNOWLEDGE — [Nome do Módulo]
2
+
3
+ > Copie este template para o Project Knowledge do seu projeto Lovable.
4
+ > Preencha os placeholders `[...]` e remova comentários `<!-- -->`.
5
+
6
+ ---
7
+
8
+ ## 0. Schema
9
+
10
+ > ⚠️ **SCHEMA_PADRAO = `[seu_schema]`**
11
+
12
+ ```ts
13
+ supabase.schema('[seu_schema]').from('tabela').select('*');
14
+ ```
15
+
16
+ ---
17
+
18
+ ## 1. Regras do Módulo
19
+
20
+ <!-- Liste regras específicas deste módulo que a IA precisa saber -->
21
+
22
+ - [Regra 1: ex: Processos só podem ser inativados, nunca deletados]
23
+ - [Regra 2: ex: Todo documento precisa de aprovação antes de publicar]
24
+ - [Regra 3: ex: Usuários só veem dados do próprio alias/empresa]
25
+
26
+ ---
27
+
28
+ ## 2. Mapa de Telas
29
+
30
+ <!-- Para cada tela, descreva: nome, tipo, tabela e componentes do DS -->
31
+
32
+ ### [Nome da Tela 1: ex: Processos]
33
+
34
+ - **Tipo**: CRUD listagem
35
+ - **Tabela**: `[processes]`
36
+ - **Componente DS**: `createCrudPage` ou `CrudTable`
37
+ - **Colunas**: [title, status, responsible, updated_at]
38
+ - **Ações de linha**: [Editar, Duplicar, Inativar]
39
+ - **Filtros**: [status, responsible]
40
+
41
+ ### [Nome da Tela 2: ex: Formulário de Processo]
42
+
43
+ - **Tipo**: Formulário (Dialog ou página)
44
+ - **Tabela**: `[processes]`
45
+ - **Campos**:
46
+ - `title` — text, obrigatório
47
+ - `description` — textarea
48
+ - `status` — Combobox (Ativo, Inativo, Rascunho)
49
+ - `id_responsible` — Combobox (busca em users)
50
+ - `due_date` — DatePicker
51
+
52
+ <!-- Repita para cada tela do módulo -->
53
+
54
+ ---
55
+
56
+ ## 3. Tabelas e Relacionamentos
57
+
58
+ <!-- Liste as tabelas do módulo com campos principais -->
59
+
60
+ | Tabela | Campos principais | FKs |
61
+ |--------|-------------------|-----|
62
+ | `[processes]` | id, title, status, created_at, deleted_at | id_responsible → users |
63
+ | `[documents]` | id, name, version, id_process | id_process → processes |
64
+
65
+ ---
66
+
67
+ ## 4. Enums e Status
68
+
69
+ <!-- Liste valores possíveis para campos de status/tipo -->
70
+
71
+ | Campo | Valores |
72
+ |-------|---------|
73
+ | `processes.status` | `active`, `inactive`, `draft` |
74
+ | `documents.type` | `policy`, `procedure`, `instruction` |
75
+
76
+ ---
77
+
78
+ ## 5. Regras de Negócio por Tela
79
+
80
+ <!-- Detalhe regras específicas que afetam a UI -->
81
+
82
+ ### [Processos]
83
+ - Ao inativar: confirmar com Dialog, definir `deleted_at = now()`
84
+ - Coluna status: exibir com Badge colorido (active=green, inactive=red)
85
+ - Busca: pesquisar em `title` e `description`
86
+
87
+ ### [Formulário]
88
+ - Campo `title`: mínimo 3 caracteres
89
+ - Campo `id_responsible`: carregar de `users` filtrado por alias
90
+ - Ao salvar: validar com Zod, exibir toast de sucesso
91
+
92
+ ---
93
+
94
+ ## 6. Imports Obrigatórios
95
+
96
+ ```ts
97
+ import {
98
+ createCrudPage, CrudTable, CrudActionBar,
99
+ Button, Dialog, Input, Combobox, ActionButton,
100
+ BaseForm, EmptyState, LoadingState,
101
+ cn, useTranslation, getSupabaseClient
102
+ } from 'forlogic-core';
103
+ ```
104
+
105
+ ---
106
+
107
+ ## 7. Instrução para IA
108
+
109
+ Antes de criar qualquer componente, leia via cross-project:
110
+
111
+ - `@Admin docs/design-system/crud.md` — listagens
112
+ - `@Admin docs/design-system/inputs.md` — formulários
113
+ - `@Admin docs/design-system/selectors.md` — selects/combos
114
+ - `@Admin docs/design-system/layout.md` — estrutura de página
115
+ - `@Admin docs/design-system/dialogs.md` — modais
116
+
117
+ Nunca crie componentes sem consultar esses arquivos primeiro.
@@ -0,0 +1,77 @@
1
+ # Prompt Template — Criação de Telas com Design System
2
+
3
+ > **Como usar**: Copie o bloco abaixo e cole como **primeiro prompt** ao iniciar uma conversa no Lovable para criar/migrar telas em projetos consumidores. Preencha os placeholders `[...]`.
4
+
5
+ ---
6
+
7
+ ## Prompt para copiar
8
+
9
+ ```
10
+ Antes de gerar qualquer código, leia OBRIGATORIAMENTE a documentação do Design System via cross-project:
11
+
12
+ @Admin docs/design-system/crud.md — para telas de listagem (CRUD)
13
+ @Admin docs/design-system/inputs.md — para campos de formulário
14
+ @Admin docs/design-system/selectors.md — para selects, combos, multiselect
15
+ @Admin docs/design-system/layout.md — para estrutura de página (AppSidebar, AppLayout)
16
+ @Admin docs/design-system/dialogs.md — para modais e confirmações
17
+ @Admin docs/design-system/buttons-actions.md — para botões e ações
18
+ @Admin docs/design-system/data-display.md — para exibição de dados
19
+ @Admin docs/design-system/tables-grids.md — para tabelas e grids
20
+
21
+ Regras obrigatórias:
22
+ 1. TODO import de componente visual DEVE vir de `forlogic-core` — nunca criar componente local se existir na lib
23
+ 2. Usar `createCrudPage` para telas de listagem simples, `CrudTable` para customizadas
24
+ 3. Usar `Combobox` para selects com busca (nunca Select nativo ou StatusSelect)
25
+ 4. Usar `ActionButton` para ações de linha (nunca ícone MoreHorizontal solto)
26
+ 5. Usar `Dialog` para confirmações (nunca DeleteConfirmationDialog)
27
+ 6. Usar `.schema('SCHEMA_PADRAO')` em toda query Supabase
28
+ 7. Usar `useTranslation` de `forlogic-core`, nunca de `react-i18next`
29
+
30
+ ---
31
+
32
+ Agora crie a seguinte tela:
33
+
34
+ **Nome da tela**: [ex: Gestão de Processos]
35
+ **Tipo**: [CRUD listagem | Formulário | Dashboard | Detalhe]
36
+ **Schema Supabase**: [ex: quality]
37
+ **Tabela principal**: [ex: processes]
38
+
39
+ **Campos da listagem** (se CRUD):
40
+ - [campo1]: [tipo] — [descrição]
41
+ - [campo2]: [tipo] — [descrição]
42
+
43
+ **Campos do formulário** (se tiver criação/edição):
44
+ - [campo1]: [tipo, obrigatório?] — [descrição]
45
+ - [campo2]: [tipo, obrigatório?] — [descrição]
46
+
47
+ **Regras de negócio**:
48
+ - [regra 1]
49
+ - [regra 2]
50
+
51
+ **Ações disponíveis**:
52
+ - [ação 1: ex: Editar, Duplicar, Inativar]
53
+ ```
54
+
55
+ ---
56
+
57
+ ## Mapeamento: Tipo de tela → Docs obrigatórios
58
+
59
+ | Tipo de tela | Docs que a IA DEVE ler |
60
+ |--------------|------------------------|
61
+ | CRUD listagem | `crud.md`, `buttons-actions.md`, `tables-grids.md` |
62
+ | Formulário | `inputs.md`, `selectors.md`, `dialogs.md` |
63
+ | Dashboard | `charts-dashboards.md`, `data-display.md` |
64
+ | Página com sidebar | `layout.md`, `navigation.md` |
65
+ | Modal/Dialog | `dialogs.md`, `inputs.md` |
66
+
67
+ ---
68
+
69
+ ## Checklist de revisão pós-geração
70
+
71
+ - [ ] Todos os imports vêm de `forlogic-core`?
72
+ - [ ] Nenhum componente foi criado localmente quando existe na lib?
73
+ - [ ] `Combobox` usado em vez de Select/StatusSelect?
74
+ - [ ] `ActionButton` usado para ações de linha?
75
+ - [ ] `CrudActionBar` com layout de 3 zonas?
76
+ - [ ] `.schema('SCHEMA_PADRAO')` em toda query?
77
+ - [ ] Soft delete em vez de DELETE físico?
@@ -0,0 +1,114 @@
1
+ # Starter Template — Projeto Consumidor forlogic-core
2
+
3
+ > **Como usar**: Ao criar um novo projeto no Lovable, cole este conteúdo como **primeiro prompt** para gerar a estrutura base completa.
4
+
5
+ ---
6
+
7
+ ## Prompt para criar projeto base
8
+
9
+ ```
10
+ Crie a estrutura base do projeto seguindo EXATAMENTE este boilerplate.
11
+ Leia @Admin docs/design-system/layout.md antes de começar.
12
+
13
+ ### 1. vite.config.ts
14
+
15
+ import { defineConfig } from 'vite';
16
+ import react from '@vitejs/plugin-react-swc';
17
+ import path from 'path';
18
+ import { createSecurityHeadersPlugin } from 'forlogic-core/vite';
19
+
20
+ export default defineConfig(({ mode }) => ({
21
+ plugins: [
22
+ react(),
23
+ createSecurityHeadersPlugin(mode === 'development', {
24
+ supabaseUrls: ['https://SEU_PROJETO.supabase.co'],
25
+ additionalConnectSrc: ['https://*.qualiex.com'],
26
+ }),
27
+ ],
28
+ resolve: { alias: { '@': path.resolve(__dirname, './src') } },
29
+ optimizeDeps: { force: true },
30
+ }));
31
+
32
+ ### 2. tailwind.config.ts
33
+
34
+ import type { Config } from 'tailwindcss';
35
+ import { forlogicTailwindPreset, forlogicContentPaths } from 'forlogic-core/tailwind';
36
+
37
+ export default {
38
+ presets: [forlogicTailwindPreset],
39
+ content: ['./src/**/*.{ts,tsx}', ...forlogicContentPaths],
40
+ } satisfies Config;
41
+
42
+ ### 3. src/App.tsx
43
+
44
+ import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
45
+ import { CoreProviders, AppLayout } from 'forlogic-core';
46
+ import { Home, FileText, Settings } from 'lucide-react';
47
+ import ptBR from './i18n/pt-BR.json';
48
+ import { HomePage } from './pages/HomePage';
49
+
50
+ const sidebarConfig = {
51
+ navigation: [
52
+ { label: 'Início', path: '/', icon: Home },
53
+ { label: 'Registros', path: '/registros', icon: FileText },
54
+ { type: 'separator' as const, label: '', path: '' },
55
+ { label: 'Configurações', path: '/config', icon: Settings },
56
+ ],
57
+ };
58
+
59
+ function AppRoutes() {
60
+ return (
61
+ <AppLayout sidebarConfig={sidebarConfig}>
62
+ <Routes>
63
+ <Route path="/" element={<HomePage />} />
64
+ <Route path="*" element={<Navigate to="/" replace />} />
65
+ </Routes>
66
+ </AppLayout>
67
+ );
68
+ }
69
+
70
+ export default function App() {
71
+ return (
72
+ <CoreProviders moduleAlias="SEU_MODULO" appTranslations={{ 'pt-BR': ptBR }}>
73
+ <BrowserRouter>
74
+ <AppRoutes />
75
+ </BrowserRouter>
76
+ </CoreProviders>
77
+ );
78
+ }
79
+
80
+ ### 4. src/pages/HomePage.tsx
81
+
82
+ import { usePageMetadata } from 'forlogic-core';
83
+
84
+ export function HomePage() {
85
+ usePageMetadata({ title: 'Início', subtitle: 'Bem-vindo ao módulo' });
86
+ return <div className="p-6">Conteúdo aqui</div>;
87
+ }
88
+
89
+ ### 5. src/i18n/pt-BR.json
90
+
91
+ {
92
+ "home": "Início",
93
+ "records": "Registros",
94
+ "settings": "Configurações"
95
+ }
96
+
97
+ Substitua:
98
+ - SEU_PROJETO pelo ref do Supabase
99
+ - SEU_MODULO pelo alias do módulo (ex: "performance", "suppliers")
100
+ - Ajuste as rotas e sidebar conforme o módulo
101
+ ```
102
+
103
+ ---
104
+
105
+ ## Checklist pós-criação
106
+
107
+ - [ ] `forlogic-core` instalado como dependência
108
+ - [ ] `vite.config.ts` usando `createSecurityHeadersPlugin`
109
+ - [ ] `tailwind.config.ts` usando `forlogicTailwindPreset` + `forlogicContentPaths`
110
+ - [ ] `App.tsx` usando `CoreProviders` + `AppLayout`
111
+ - [ ] Sidebar com itens e separadores definidos
112
+ - [ ] `usePageMetadata` em cada página
113
+ - [ ] `.schema('SCHEMA_PADRAO')` em toda query Supabase
114
+ - [ ] Arquivo `pt-BR.json` com traduções do módulo
@@ -0,0 +1,45 @@
1
+ <!-- ⚠️ ARQUIVO GERADO AUTOMATICAMENTE — NÃO EDITAR MANUALMENTE -->
2
+ <!-- Fonte: src/design-system/docs/ | Regenerar: npx tsx scripts/generate-ds-docs.ts -->
3
+
4
+ # Design System — forlogic-core
5
+
6
+ > Gerado automaticamente em 2026-04-05
7
+ > Total: 91 componentes documentados em 15 categorias
8
+
9
+ ## Categorias
10
+
11
+ - [Fundação](./foundation.md) (7 componentes)
12
+ - [Botões & Ações](./buttons-actions.md) (6 componentes)
13
+ - [Inputs](./inputs.md) (10 componentes)
14
+ - [Seletores](./selectors.md) (7 componentes)
15
+ - [Data Display](./data-display.md) (8 componentes)
16
+ - [Data Grid](./tables-grids.md) (3 componentes)
17
+ - [Gráficos & Dashboards](./charts-dashboards.md) (11 componentes)
18
+ - [Navegação](./navigation.md) (8 componentes)
19
+ - [Dialogs](./dialogs.md) (11 componentes)
20
+ - [Notifications & Feedback](./notifications-feedback.md) (4 componentes)
21
+ - [Layout](./layout.md) (6 componentes)
22
+ - [CRUD](./crud.md) (8 componentes)
23
+ - [Plataforma](./platform.md) (6 componentes)
24
+ - [Business Components](./domain.md) (12 componentes)
25
+ - [Developer Tools](./infra-utils.md) (5 componentes)
26
+
27
+ ## Imports
28
+
29
+ Todos os componentes são importados de `forlogic-core`:
30
+ ```tsx
31
+ import { Button, Dialog, Input, Combobox, createCrudPage } from "forlogic-core";
32
+ ```
33
+
34
+ ## Aliases Disponíveis
35
+
36
+ | Nome Atual | Alias | Import |
37
+ |------------|-------|--------|
38
+ | ComboTree | TreeSelect | `import { TreeSelect } from "forlogic-core"` |
39
+ | Combobox | AutoComplete | `import { AutoComplete } from "forlogic-core"` |
40
+ | StepSelector | Stepper | `import { Stepper } from "forlogic-core"` |
41
+ | ActionButton | RowActions | `import { RowActions } from "forlogic-core"` |
42
+ | TruncatedCell | EllipsisText | `import { EllipsisText } from "forlogic-core"` |
43
+ | CrudPrimitiveTable | DataTable | `import { DataTable } from "forlogic-core"` |
44
+ | CrudPrimitivePagination | DataPagination | `import { DataPagination } from "forlogic-core"` |
45
+ | CrudPrimitiveFilterBar | DataFilterBar | `import { DataFilterBar } from "forlogic-core"` |