forlogic-core 2.1.4 → 2.2.0

package/docs/design-system/notifications-feedback.md

@@ -11,19 +11,19 @@ Componente de notificação toast usando Sonner. Feedback temporário e não blo
 
 **Uso:**
 ```tsx
-import { toast } from "sonner"
-
-// Informativo (BG #FFFFFF)
-toast("Mensagem simples")
-toast.info("Informação importante")
-
-// Sucesso (BG #E0FBE8)
-toast.success("Operação concluída")
-
-// Alerta (BG #FEF3C8)
-toast.warning("Atenção necessária")
-
-// Erro (BG #FEE1E1)
+import { toast } from "sonner"
+
+// Informativo (BG #FFFFFF)
+toast("Mensagem simples")
+toast.info("Informação importante")
+
+// Sucesso (BG #E0FBE8)
+toast.success("Operação concluída")
+
+// Alerta (BG #FEF3C8)
+toast.warning("Atenção necessária")
+
+// Erro (BG #FEE1E1)
 toast.error("Algo deu errado")
 ```
 
@@ -43,19 +43,19 @@ toast.error("Algo deu errado")
 
 **Exemplos:**
 ```tsx
-// Toast é um feedback temporário e não bloqueante
-// - Informa rapidamente o usuário
-// - Não compete visualmente com outros Toasts
-// - Empilhamento vertical sem sobreposição
+// Toast é um feedback temporário e não bloqueante
+// - Informa rapidamente o usuário
+// - Não compete visualmente com outros Toasts
+// - Empilhamento vertical sem sobreposição
 // - Ordem previsível: mais recente no topo
 ```
 ```tsx
-// Empilhamento vertical com espaçamento consistente
+// Empilhamento vertical com espaçamento consistente
 toast.success(
 ```
 ```tsx
-// Configuração de posição no Toaster:
-<Sonner
+// Configuração de posição no Toaster:
+<Sonner
   position=
 ```
 
@@ -80,7 +80,7 @@ toast.success(
 - 🎨 **Padrão v2**: Toasts possuem 
 -  como identidade visual herdada da v2.
 
-> Fonte: `src\design-system\docs\components\ToastDoc.tsx`
+> Fonte: `src/design-system/docs/components/ToastDoc.tsx`
 
 ---
 
@@ -90,18 +90,18 @@ Botão com popover para exibir notificações de atualização das aplicações.
 
 **Uso:**
 ```tsx
-// Modo automático — basta importar e usar, sem props
-// O componente busca dados da API internamente usando useAuth() e useUpdatesNotification()
-import { UpdatesNotification } from 'forlogic-core';
-
-<UpdatesNotification />
-
-// Modo controlado — para testes, docs ou lógica customizada
-<UpdatesNotification
-  updates={[{ id: '1', title: 'Nova versão', text: 'Descrição' }]}
-  badgeCount={1}
-  onOpen={() => markAsViewed()}
-  onViewAll={() => window.open('https://apps4.qualiex.com/common/alias/up/view', '_blank')}
+// Modo automático — basta importar e usar, sem props
+// O componente busca dados da API internamente usando useAuth() e useUpdatesNotification()
+import { UpdatesNotification } from 'forlogic-core';
+
+<UpdatesNotification />
+
+// Modo controlado — para testes, docs ou lógica customizada
+<UpdatesNotification
+  updates={[{ id: '1', title: 'Nova versão', text: 'Descrição' }]}
+  badgeCount={1}
+  onOpen={() => markAsViewed()}
+  onViewAll={() => window.open('https://apps4.qualiex.com/common/alias/up/view', '_blank')}
 />
 ```
 
@@ -122,7 +122,7 @@ import { UpdatesNotification } from
 - Em caso de 401, o hook faz retry automático regenerando o token via QualiexErrorInterceptor.
 - Em produção, o componente deve ser colocado no AppHeader — já está integrado no forlogic-core.
 
-> Fonte: `src\design-system\docs\components\UpdatesNotificationDoc.tsx`
+> Fonte: `src/design-system/docs/components/UpdatesNotificationDoc.tsx`
 
 ---
 

package/docs/design-system/patterns/README.md

@@ -1,53 +1,53 @@
-# Design System — Padrões Universais
-
-> Padrões obrigatórios para todos os projetos que consomem `forlogic-core`.
-> Acessível via cross-project: `@Admin docs/design-system/patterns/`
-
-## Índice
-
-### Componentes
-
-| Arquivo | Descrição |
-|---------|-----------|
-| [action-button.md](action-button.md) | Uso obrigatório do ActionButton em tabelas |
-| [alertdialog-deletion.md](alertdialog-deletion.md) | AlertDialog para exclusões permanentes |
-| [baseform-usage.md](baseform-usage.md) | BaseForm — formulário dinâmico CRUD |
-| [baseform-custom-fields.md](baseform-custom-fields.md) | Campos customizados no BaseForm |
-| [combo-tree.md](combo-tree.md) | ComboTree — seleção hierárquica |
-| [delete-confirmation.md](delete-confirmation.md) | Dialog de confirmação de exclusão |
-| [dialog-structure.md](dialog-structure.md) | Tamanhos e estrutura obrigatória do Dialog |
-| [dialog-variants.md](dialog-variants.md) | Variantes semânticas do Dialog |
-| [pagination.md](pagination.md) | Paginação padronizada |
-
-### Padrões de Layout & Scroll
-
-| Arquivo | Descrição |
-|---------|-----------|
-| [dialog-body-scroll.md](dialog-body-scroll.md) | Scroll interno em Dialogs |
-| [body-content-scroll.md](body-content-scroll.md) | Scroll em páginas (BodyContent) |
-| [single-scroll.md](single-scroll.md) | Padrão de scroll único no viewport |
-
-### Padrões CRUD
-
-| Arquivo | Descrição |
-|---------|-----------|
-| [crud-toolbar.md](crud-toolbar.md) | Layout 3 zonas da toolbar |
-| [crud-bulk-actions.md](crud-bulk-actions.md) | Ações em lote via dropdown |
-| [crud-defaults.md](crud-defaults.md) | Defaults obrigatórios (resize, sort, etc.) |
-| [crud-config-props.md](crud-config-props.md) | Props padronizadas de configuração |
-
-### Setup & Configuração
-
-| Arquivo | Descrição |
-|---------|-----------|
-| [core-providers.md](core-providers.md) | Setup obrigatório do CoreProviders |
-| [vite-tailwind-setup.md](vite-tailwind-setup.md) | Configuração Vite + Tailwind |
-| [i18n-setup.md](i18n-setup.md) | Setup de internacionalização |
-| [feature-flags.md](feature-flags.md) | Feature flags disponíveis |
-| [header-metadata.md](header-metadata.md) | Padrão de título/subtítulo via header |
-
-### Referência
-
-| Arquivo | Descrição |
-|---------|-----------|
-| [components-registry.md](components-registry.md) | Registry de componentes consolidados |
+# Design System — Padrões Universais
+
+> Padrões obrigatórios para todos os projetos que consomem `forlogic-core`.
+> Acessível via cross-project: `@Admin docs/design-system/patterns/`
+
+## Índice
+
+### Componentes
+
+| Arquivo | Descrição |
+|---------|-----------|
+| [action-button.md](action-button.md) | Uso obrigatório do ActionButton em tabelas |
+| [alertdialog-deletion.md](alertdialog-deletion.md) | AlertDialog para exclusões permanentes |
+| [baseform-usage.md](baseform-usage.md) | BaseForm — formulário dinâmico CRUD |
+| [baseform-custom-fields.md](baseform-custom-fields.md) | Campos customizados no BaseForm |
+| [combo-tree.md](combo-tree.md) | ComboTree — seleção hierárquica |
+| [delete-confirmation.md](delete-confirmation.md) | Dialog de confirmação de exclusão |
+| [dialog-structure.md](dialog-structure.md) | Tamanhos e estrutura obrigatória do Dialog |
+| [dialog-variants.md](dialog-variants.md) | Variantes semânticas do Dialog |
+| [pagination.md](pagination.md) | Paginação padronizada |
+
+### Padrões de Layout & Scroll
+
+| Arquivo | Descrição |
+|---------|-----------|
+| [dialog-body-scroll.md](dialog-body-scroll.md) | Scroll interno em Dialogs |
+| [body-content-scroll.md](body-content-scroll.md) | Scroll em páginas (BodyContent) |
+| [single-scroll.md](single-scroll.md) | Padrão de scroll único no viewport |
+
+### Padrões CRUD
+
+| Arquivo | Descrição |
+|---------|-----------|
+| [crud-toolbar.md](crud-toolbar.md) | Layout 3 zonas da toolbar |
+| [crud-bulk-actions.md](crud-bulk-actions.md) | Ações em lote via dropdown |
+| [crud-defaults.md](crud-defaults.md) | Defaults obrigatórios (resize, sort, etc.) |
+| [crud-config-props.md](crud-config-props.md) | Props padronizadas de configuração |
+
+### Setup & Configuração
+
+| Arquivo | Descrição |
+|---------|-----------|
+| [core-providers.md](core-providers.md) | Setup obrigatório do CoreProviders |
+| [vite-tailwind-setup.md](vite-tailwind-setup.md) | Configuração Vite + Tailwind |
+| [i18n-setup.md](i18n-setup.md) | Setup de internacionalização |
+| [feature-flags.md](feature-flags.md) | Feature flags disponíveis |
+| [header-metadata.md](header-metadata.md) | Padrão de título/subtítulo via header |
+
+### Referência
+
+| Arquivo | Descrição |
+|---------|-----------|
+| [components-registry.md](components-registry.md) | Registry de componentes consolidados |

package/docs/design-system/patterns/action-button.md

@@ -1,22 +1,22 @@
-# Padrão: ActionButton para Tabelas
-
-Uso de `ActionButton` é **OBRIGATÓRIO** para menus de ação em linhas de tabela.
-
-```tsx
-// ❌ PROIBIDO - botão genérico com ícone manual
-<Button variant="ghost" size="icon">
-  <MoreHorizontal className="h-4 w-4" />
-</Button>
-
-// ✅ CORRETO - ActionButton padronizado
-import { ActionButton } from 'forlogic-core';
-
-<ActionButton
-  items={[
-    { label: 'Editar', icon: Edit, onClick: handleEdit },
-    { label: 'Excluir', icon: Trash, onClick: handleDelete, variant: 'destructive' }
-  ]}
-/>
-```
-
-**Motivo**: Garante mesma estética e comportamento em todas as tabelas do sistema.
+# Padrão: ActionButton para Tabelas
+
+Uso de `ActionButton` é **OBRIGATÓRIO** para menus de ação em linhas de tabela.
+
+```tsx
+// ❌ PROIBIDO - botão genérico com ícone manual
+<Button variant="ghost" size="icon">
+  <MoreHorizontal className="h-4 w-4" />
+</Button>
+
+// ✅ CORRETO - ActionButton padronizado
+import { ActionButton } from 'forlogic-core';
+
+<ActionButton
+  items={[
+    { label: 'Editar', icon: Edit, onClick: handleEdit },
+    { label: 'Excluir', icon: Trash, onClick: handleDelete, variant: 'destructive' }
+  ]}
+/>
+```
+
+**Motivo**: Garante mesma estética e comportamento em todas as tabelas do sistema.

package/docs/design-system/patterns/alertdialog-deletion.md

@@ -1,46 +1,46 @@
-# Padrão: AlertDialog para Exclusão Permanente
-
-AlertDialog é usado **apenas** para exclusões permanentes que requerem digitação de confirmação:
-
-```tsx
-<AlertDialog open={open} onOpenChange={setOpen}>
-  <AlertDialogContent>
-    <AlertDialogHeader className="border-b pb-4">
-      <AlertDialogTitle className="text-center">
-        Exclusão Permanente
-      </AlertDialogTitle>
-    </AlertDialogHeader>
-    
-    <div className="py-4 space-y-4">
-      <div className="flex justify-center">
-        <AlertTriangle className="h-12 w-12 text-destructive" />
-      </div>
-      <AlertDialogDescription className="text-center">
-        Esta ação é irreversível. Digite <strong>EXCLUIR</strong> para confirmar.
-      </AlertDialogDescription>
-      <Input
-        value={confirmation}
-        onChange={(e) => setConfirmation(e.target.value)}
-        placeholder="Digite EXCLUIR"
-        className="text-center"
-      />
-    </div>
-    
-    <AlertDialogFooter>
-      <AlertDialogCancel>Cancelar</AlertDialogCancel>
-      <AlertDialogAction
-        disabled={confirmation !== 'EXCLUIR'}
-        onClick={handlePermanentDelete}
-        className="bg-destructive hover:bg-destructive/90"
-      >
-        Excluir Permanentemente
-      </AlertDialogAction>
-    </AlertDialogFooter>
-  </AlertDialogContent>
-</AlertDialog>
-```
-
-**Quando usar:**
-- ✅ Exclusão de dados sem possibilidade de recuperação
-- ✅ Ações destrutivas em massa críticas
-- ❌ NÃO usar para soft deletes (usar Dialog padrão)
+# Padrão: AlertDialog para Exclusão Permanente
+
+AlertDialog é usado **apenas** para exclusões permanentes que requerem digitação de confirmação:
+
+```tsx
+<AlertDialog open={open} onOpenChange={setOpen}>
+  <AlertDialogContent>
+    <AlertDialogHeader className="border-b pb-4">
+      <AlertDialogTitle className="text-center">
+        Exclusão Permanente
+      </AlertDialogTitle>
+    </AlertDialogHeader>
+    
+    <div className="py-4 space-y-4">
+      <div className="flex justify-center">
+        <AlertTriangle className="h-12 w-12 text-destructive" />
+      </div>
+      <AlertDialogDescription className="text-center">
+        Esta ação é irreversível. Digite <strong>EXCLUIR</strong> para confirmar.
+      </AlertDialogDescription>
+      <Input
+        value={confirmation}
+        onChange={(e) => setConfirmation(e.target.value)}
+        placeholder="Digite EXCLUIR"
+        className="text-center"
+      />
+    </div>
+    
+    <AlertDialogFooter>
+      <AlertDialogCancel>Cancelar</AlertDialogCancel>
+      <AlertDialogAction
+        disabled={confirmation !== 'EXCLUIR'}
+        onClick={handlePermanentDelete}
+        className="bg-destructive hover:bg-destructive/90"
+      >
+        Excluir Permanentemente
+      </AlertDialogAction>
+    </AlertDialogFooter>
+  </AlertDialogContent>
+</AlertDialog>
+```
+
+**Quando usar:**
+- ✅ Exclusão de dados sem possibilidade de recuperação
+- ✅ Ações destrutivas em massa críticas
+- ❌ NÃO usar para soft deletes (usar Dialog padrão)

package/docs/design-system/patterns/baseform-custom-fields.md

@@ -1,59 +1,59 @@
-# Padrão: BaseForm — Campos Customizados
-
-Campos customizados no BaseForm usam `type: 'custom'` com `component` ou `render`:
-
-```tsx
-// Opção 1: Componente externo
-{
-  name: 'module_id',
-  label: 'Módulo',
-  type: 'custom',
-  required: true,
-  component: ModuleCombobox,
-  componentProps: {
-    placeholder: 'Selecione...',
-  },
-}
-
-// Opção 2: Props dinâmicas baseadas em formData
-{
-  name: 'file',
-  label: 'Arquivo',
-  type: 'custom',
-  component: FileUpload,
-  componentProps: (formData) => ({
-    required: !formData?.id,
-    accept: '.pdf,.doc',
-  }),
-}
-
-// Opção 3: Render function inline
-{
-  name: 'priority',
-  label: 'Prioridade',
-  type: 'custom',
-  render: ({ value, onChange, error }) => (
-    <div className="flex gap-2">
-      {['low', 'medium', 'high'].map(p => (
-        <Button
-          key={p}
-          variant={value === p ? 'default' : 'outline'}
-          onClick={() => onChange(p)}
-        >
-          {p}
-        </Button>
-      ))}
-    </div>
-  ),
-}
-```
-
-**Interface do componente customizado:**
-```tsx
-interface CustomFieldProps {
-  value: any;
-  onChange: (value: any) => void;
-  error?: string;
-  disabled?: boolean;
-}
-```
+# Padrão: BaseForm — Campos Customizados
+
+Campos customizados no BaseForm usam `type: 'custom'` com `component` ou `render`:
+
+```tsx
+// Opção 1: Componente externo
+{
+  name: 'module_id',
+  label: 'Módulo',
+  type: 'custom',
+  required: true,
+  component: ModuleCombobox,
+  componentProps: {
+    placeholder: 'Selecione...',
+  },
+}
+
+// Opção 2: Props dinâmicas baseadas em formData
+{
+  name: 'file',
+  label: 'Arquivo',
+  type: 'custom',
+  component: FileUpload,
+  componentProps: (formData) => ({
+    required: !formData?.id,
+    accept: '.pdf,.doc',
+  }),
+}
+
+// Opção 3: Render function inline
+{
+  name: 'priority',
+  label: 'Prioridade',
+  type: 'custom',
+  render: ({ value, onChange, error }) => (
+    <div className="flex gap-2">
+      {['low', 'medium', 'high'].map(p => (
+        <Button
+          key={p}
+          variant={value === p ? 'default' : 'outline'}
+          onClick={() => onChange(p)}
+        >
+          {p}
+        </Button>
+      ))}
+    </div>
+  ),
+}
+```
+
+**Interface do componente customizado:**
+```tsx
+interface CustomFieldProps {
+  value: any;
+  onChange: (value: any) => void;
+  error?: string;
+  disabled?: boolean;
+}
+```

package/docs/design-system/patterns/baseform-usage.md

@@ -1,42 +1,42 @@
-# Padrão: BaseForm — Formulário Dinâmico
-
-BaseForm é o formulário dinâmico do sistema CRUD, configurado via `sections` e `fields`.
-
-```tsx
-import BaseForm from 'forlogic-core/crud/components/BaseForm';
-
-const sections: FormSection[] = [
-  {
-    id: 'basic',
-    title: 'Informações Básicas',
-    fields: [
-      { name: 'title', label: 'Título', type: 'text', required: true },
-      { name: 'email', label: 'E-mail', type: 'email' },
-      { name: 'is_active', label: 'Ativo', type: 'switch' },
-    ],
-  },
-];
-
-<BaseForm
-  title="Novo Item"
-  sections={sections}
-  initialData={data}
-  open={isOpen}
-  onSubmit={handleSubmit}
-  onCancel={() => setIsOpen(false)}
-/>
-```
-
-**Tipos de campo suportados:**
-`text`, `email`, `password`, `number`, `textarea`, `select`, `multiselect`, `date`, `datetime-local`, `switch`, `checkbox`, `color`, `color-picker`, `icon-picker`, `user-select`, `custom`
-
-**Grupos de campos:**
-```tsx
-{
-  name: 'row1',
-  type: 'group',
-  layout: 'horizontal', // ou 'vertical'
-  wrapperClassName: 'col-span-full',
-  fields: [...]
-}
-```
+# Padrão: BaseForm — Formulário Dinâmico
+
+BaseForm é o formulário dinâmico do sistema CRUD, configurado via `sections` e `fields`.
+
+```tsx
+import BaseForm from 'forlogic-core/crud/components/BaseForm';
+
+const sections: FormSection[] = [
+  {
+    id: 'basic',
+    title: 'Informações Básicas',
+    fields: [
+      { name: 'title', label: 'Título', type: 'text', required: true },
+      { name: 'email', label: 'E-mail', type: 'email' },
+      { name: 'is_active', label: 'Ativo', type: 'switch' },
+    ],
+  },
+];
+
+<BaseForm
+  title="Novo Item"
+  sections={sections}
+  initialData={data}
+  open={isOpen}
+  onSubmit={handleSubmit}
+  onCancel={() => setIsOpen(false)}
+/>
+```
+
+**Tipos de campo suportados:**
+`text`, `email`, `password`, `number`, `textarea`, `select`, `multiselect`, `date`, `datetime-local`, `switch`, `checkbox`, `color`, `color-picker`, `icon-picker`, `user-select`, `custom`
+
+**Grupos de campos:**
+```tsx
+{
+  name: 'row1',
+  type: 'group',
+  layout: 'horizontal', // ou 'vertical'
+  wrapperClassName: 'col-span-full',
+  fields: [...]
+}
+```

package/docs/design-system/patterns/body-content-scroll.md

@@ -1,56 +1,56 @@
-# Padrão: Scroll em Páginas (BodyContent)
-
-## Quando Usar Cada Abordagem
-
-| Cenário | Componente | Classes |
-|---------|------------|---------|
-| **Página nova (Design System)** | `BodyContent` + `ContentContainer` | Padrão, sem classes extras |
-| **Página legada (design próprio)** | `BodyContent` | `className="bg-transparent p-0"` |
-| **Módulo customizado** | `div` simples | `className="h-full overflow-y-auto"` |
-
-## Exemplos
-
-### ✅ Página Nova (Design System Completo)
-```tsx
-import { BodyContent, ContentContainer } from 'forlogic-core';
-
-<BodyContent breadcrumbs={[{ label: 'Home', href: '/' }, { label: 'Página' }]}>
-  <ContentContainer title="Título" subtitle="Descrição">
-    {/* Conteúdo */}
-  </ContentContainer>
-</BodyContent>
-```
-
-### ✅ Página Legada (Preservar Design Original)
-```tsx
-import { BodyContent } from 'forlogic-core';
-
-<BodyContent className="bg-transparent p-0">
-  {/* Conteúdo original mantido sem alterações */}
-  <div className="p-6">
-    <h1>Título Original</h1>
-  </div>
-</BodyContent>
-```
-
-### ✅ Container Mínimo (Sem BodyContent)
-```tsx
-<div className="h-full overflow-y-auto">
-  {/* Conteúdo original */}
-</div>
-```
-
-## ❌ Erro Comum
-```tsx
-// ERRADO: ContentContainer em página com design próprio
-<BodyContent>
-  <ContentContainer>
-    {/* Resultado: fundo branco, bordas, padding extra indesejados */}
-  </ContentContainer>
-</BodyContent>
-```
-
-## Regra de Ouro
-- `ContentContainer` adiciona: fundo branco, borda, sombra, padding
-- Use apenas quando o design da página DEVE seguir esse padrão
-- Para páginas legadas: `BodyContent className="bg-transparent p-0"`
+# Padrão: Scroll em Páginas (BodyContent)
+
+## Quando Usar Cada Abordagem
+
+| Cenário | Componente | Classes |
+|---------|------------|---------|
+| **Página nova (Design System)** | `BodyContent` + `ContentContainer` | Padrão, sem classes extras |
+| **Página legada (design próprio)** | `BodyContent` | `className="bg-transparent p-0"` |
+| **Módulo customizado** | `div` simples | `className="h-full overflow-y-auto"` |
+
+## Exemplos
+
+### ✅ Página Nova (Design System Completo)
+```tsx
+import { BodyContent, ContentContainer } from 'forlogic-core';
+
+<BodyContent breadcrumbs={[{ label: 'Home', href: '/' }, { label: 'Página' }]}>
+  <ContentContainer title="Título" subtitle="Descrição">
+    {/* Conteúdo */}
+  </ContentContainer>
+</BodyContent>
+```
+
+### ✅ Página Legada (Preservar Design Original)
+```tsx
+import { BodyContent } from 'forlogic-core';
+
+<BodyContent className="bg-transparent p-0">
+  {/* Conteúdo original mantido sem alterações */}
+  <div className="p-6">
+    <h1>Título Original</h1>
+  </div>
+</BodyContent>
+```
+
+### ✅ Container Mínimo (Sem BodyContent)
+```tsx
+<div className="h-full overflow-y-auto">
+  {/* Conteúdo original */}
+</div>
+```
+
+## ❌ Erro Comum
+```tsx
+// ERRADO: ContentContainer em página com design próprio
+<BodyContent>
+  <ContentContainer>
+    {/* Resultado: fundo branco, bordas, padding extra indesejados */}
+  </ContentContainer>
+</BodyContent>
+```
+
+## Regra de Ouro
+- `ContentContainer` adiciona: fundo branco, borda, sombra, padding
+- Use apenas quando o design da página DEVE seguir esse padrão
+- Para páginas legadas: `BodyContent className="bg-transparent p-0"`