forlogic-core 1.16.3 → 1.16.5

package/docs/DESIGN_SYSTEM.md

@@ -83,7 +83,7 @@ function App() {
 - [Loading](#skeleton) - Componentes para estados de carregamento: Skeleton (placeholders), Spinner (indicador de loading), e LoadingState (gerenciamento declarativo).
 - [Media](#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.
 - [Menubar](#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.
-- [ModulesDialog](#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é.
+- [ModulesDialog](#modulesdialog) - Dialog para navegação entre módulos do sistema.
 - [Navigation Menu](#navigationmenu) - Uma coleção de links para navegação em websites.
 - [Onboarding Dialog](#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.
 - [Pagination](#pagination) - Componente de paginação padronizado com layout de 3 colunas, seletor de itens por página e navegação completa.
@@ -131,7 +131,7 @@ function App() {
 - [ErrorBoundary](#errorboundary) - Componente de classe React que captura erros de renderização em componentes filhos, evitando que a aplicação inteira quebre.
 - [Hooks](#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.
 - [Internacionalização (i18n)](#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.
-- [Controle de Acesso a Módulos](#moduleaccess) - Sistema para verificar e bloquear automaticamente o acesso do usuário a módulos da plataforma Qualiex. Inclui proteção automática de rotas via CoreProviders e hook para verificações programáticas.
+- [Acesso Módulo (ModuleAccess)](#moduleaccess) - Sistema de autorização para verificar e bloquear acesso a módulos da plataforma Qualiex. Proteção automática de rotas via CoreProviders e hook para verificações programáticas.
 - [Segurança (Vite Config)](#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.
 - [Services](#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.
 - [Utilities](#utilities) - Funções utilitárias essenciais exportadas pela biblioteca para manipulação de classes CSS, formatação de datas e valores monetários.
@@ -5822,7 +5822,7 @@ const [theme, setTheme] = useState("system");
 
 ### 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é.
+Dialog para navegação entre módulos do sistema.
 
 **Uso:**
 ```tsx
@@ -5856,21 +5856,12 @@ function App() {
 |------|------|--------|----------|
 | open | `boolean` | `-` | Controla se o dialog está aberto |
 | onOpenChange | `(open: boolean) => void` | `-` | Callback quando o estado muda |
-| onModuleClick | `(module: Module) => void` | `-` | Callback ao clicar em um módulo contratado |
-| contractedModules | `string[]` | `undefined` | Lista de nomes de módulos contratados. Se não fornecido, todos aparecem como contratados. |
-| onModuleInterest | `(module: Module) => void` | `-` | Callback após usuário passar pelo onboarding de módulo não contratado |
+| onModuleClick | `(module: Module) => void` | `-` | Callback ao clicar em um módulo. Default: navega via URL do módulo |
 | educaUrl | `string` | `https://educa.forlogic.net/` | URL do link do Forlogic Educa |
 | saberGestaoUrl | `string` | `https://sabergestao.com.br/` | URL do link do Saber Gestão |
-| showSettingsLink | `boolean` | `true` | Exibe o card de configurações no rodapé |
-| onSettingsClick | `() => void` | `-` | Callback ao clicar em configurações |
 
 **Exemplos:**
 
-**Com Módulos Contratados:**
-```tsx
-undefined
-```
-
 **Integração com AppHeader:**
 ```tsx
 undefined
@@ -5881,19 +5872,13 @@ undefined
 - Navegação por teclado entre abas (Arrow Left/Right)
 - Foco automático no primeiro elemento interativo ao abrir
 - Escape fecha o dialog e retorna o foco ao elemento anterior
-- Módulos clicáveis com role="button" e suporte a Enter/Space
-- Módulos não contratados indicados visualmente com opacidade reduzida
-- OnboardingDialog acessível com navegação por teclado
-- Links externos indicados com aria-label descritivo
-- Cores com contraste adequado (WCAG AA)
 
 **Notas:**
-- 2 Abas de Grupos: Qualiex (19 módulos unificados) e Clássicos (15 módulos)
+- Para separação entre módulos contratados e disponíveis (contractedModules, onModuleInterest), consulte a documentação de Module Access.
+- Internamente usa o componente ModulesContent, compartilhado com o AccessDeniedDialog.
+- 2 Abas de Grupos: Qualiex e Clássicos
 - Grid Responsivo: 4 colunas em XL, 3 em MD, 2 em base
-- Separação Visual: Módulos contratados vs disponíveis para contratação
-- OnboardingDialog: Até 3 steps para descoberta de módulos não contratados
-- Cards no Rodapé: Forlogic Educa, Saber Gestão e Configurações (opcional)
-- Retrocompatível: Props antigas (wikiUrl, allModulesUrl) continuam funcionando
+- Cards no Rodapé: Forlogic Educa, Saber Gestão e Wiki
 
 ---
 
@@ -11559,20 +11544,20 @@ console.log(format?.description); // "Padrão Brasileiro"
 
 ---
 
-### Controle de Acesso a Módulos
+### Acesso Módulo (ModuleAccess)
 
-Sistema para verificar e bloquear automaticamente o acesso do usuário a módulos da plataforma Qualiex. Inclui proteção automática de rotas via CoreProviders e hook para verificações programáticas.
+Sistema de autorização para verificar e bloquear acesso a módulos da plataforma Qualiex. Proteção automática de rotas via CoreProviders e hook para verificações programáticas.
 
 **Uso:**
 ```tsx
-present
-```
+// Proteção automática via CoreProviders
+<CoreProviders moduleAlias="occurrences">
+  <App />
+</CoreProviders>
 
-**Exemplos:**
-
-**Exemplo Interativo:**
-```tsx
-// Ver seção de exemplos no arquivo
+// Verificação programática via hook
+const { hasAccess, hasAccessTo, role } = useModuleAccess();
+if (hasAccessTo('audit')) { /* ... */ }
 ```
 
 **Acessibilidade:**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "forlogic-core",
-  "version": "1.16.3",
+  "version": "1.16.5",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",
@@ -40,7 +40,9 @@
     "build:dev": "vite build --mode development",
     "build:lib": "rollup -c",
     "lint": "eslint .",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "version": "npm run docs:ds && git add docs/DESIGN_SYSTEM.md README.md",
+    "prepublishOnly": "npm whoami || npm login"
   },
   "bin": {
     "lib-update": "dist/bin/pull-docs.js"

package/dist/assets/AccordionDoc-BnfxyOi9.js

@@ -1,31 +0,0 @@
-import{W as l,j as e,X as re,Y,Z as ne,_ as ae,$,a0 as se,a1 as ie,a2 as ce,a3 as le,a4 as de,a5 as q,a6 as pe,r as j,l as S,a7 as me,a8 as ue,a9 as xe,f as fe,aa as Ce,ab as Ae}from"./index-BtX5DZqb.js";import{C as he}from"./ComponentDocTemplate-BtOCnlM2.js";import"./ExampleCard-DfuMYM6E.js";import"./TableOfContents-DBMJMbI4.js";var d="Accordion",ve=["Home","End","ArrowDown","ArrowUp","ArrowLeft","ArrowRight"],[D,be,ge]=re(d),[I]=pe(d,[ge,q]),k=q(),K=l.forwardRef((o,n)=>{const{type:t,...a}=o,s=a,r=a;return e.jsx(D.Provider,{scope:o.__scopeAccordion,children:t==="multiple"?e.jsx(we,{...r,ref:n}):e.jsx(ye,{...s,ref:n})})});K.displayName=d;var[z,je]=I(d),[G,Ie]=I(d,{collapsible:!1}),ye=l.forwardRef((o,n)=>{const{value:t,defaultValue:a,onValueChange:s=()=>{},collapsible:r=!1,...c}=o,[i,p]=Y({prop:t,defaultProp:a??"",onChange:s,caller:d});return e.jsx(z,{scope:o.__scopeAccordion,value:l.useMemo(()=>i?[i]:[],[i]),onItemOpen:p,onItemClose:l.useCallback(()=>r&&p(""),[r,p]),children:e.jsx(G,{scope:o.__scopeAccordion,collapsible:r,children:e.jsx(L,{...c,ref:n})})})}),we=l.forwardRef((o,n)=>{const{value:t,defaultValue:a,onValueChange:s=()=>{},...r}=o,[c,i]=Y({prop:t,defaultProp:a??[],onChange:s,caller:d}),p=l.useCallback(f=>i((u=[])=>[...u,f]),[i]),x=l.useCallback(f=>i((u=[])=>u.filter(w=>w!==f)),[i]);return e.jsx(z,{scope:o.__scopeAccordion,value:c,onItemOpen:p,onItemClose:x,children:e.jsx(G,{scope:o.__scopeAccordion,collapsible:!0,children:e.jsx(L,{...r,ref:n})})})}),[Ne,y]=I(d),L=l.forwardRef((o,n)=>{const{__scopeAccordion:t,disabled:a,dir:s,orientation:r="vertical",...c}=o,i=l.useRef(null),p=ce(i,n),x=be(t),u=le(s)==="ltr",w=de(o.onKeyDown,v=>{if(!ve.includes(v.key))return;const oe=v.target,N=x().filter(O=>!O.ref.current?.disabled),b=N.findIndex(O=>O.ref.current===oe),V=N.length;if(b===-1)return;v.preventDefault();let m=b;const R=0,_=V-1,P=()=>{m=b+1,m>_&&(m=R)},T=()=>{m=b-1,m<R&&(m=_)};switch(v.key){case"Home":m=R;break;case"End":m=_;break;case"ArrowRight":r==="horizontal"&&(u?P():T());break;case"ArrowDown":r==="vertical"&&P();break;case"ArrowLeft":r==="horizontal"&&(u?T():P());break;case"ArrowUp":r==="vertical"&&T();break}const te=m%V;N[te].ref.current?.focus()});return e.jsx(Ne,{scope:t,disabled:a,direction:s,orientation:r,children:e.jsx(D.Slot,{scope:t,children:e.jsx($.div,{...c,"data-orientation":r,ref:p,onKeyDown:a?void 0:w})})})}),g="AccordionItem",[Re,M]=I(g),U=l.forwardRef((o,n)=>{const{__scopeAccordion:t,value:a,...s}=o,r=y(g,t),c=je(g,t),i=k(t),p=ne(),x=a&&c.value.includes(a)||!1,f=r.disabled||o.disabled;return e.jsx(Re,{scope:t,open:x,disabled:f,triggerId:p,children:e.jsx(ae,{"data-orientation":r.orientation,"data-state":Z(x),...i,...s,ref:n,disabled:f,open:x,onOpenChange:u=>{u?c.onItemOpen(a):c.onItemClose(a)}})})});U.displayName=g;var W="AccordionHeader",Q=l.forwardRef((o,n)=>{const{__scopeAccordion:t,...a}=o,s=y(d,t),r=M(W,t);return e.jsx($.h3,{"data-orientation":s.orientation,"data-state":Z(r.open),"data-disabled":r.disabled?"":void 0,...a,ref:n})});Q.displayName=W;var E="AccordionTrigger",B=l.forwardRef((o,n)=>{const{__scopeAccordion:t,...a}=o,s=y(d,t),r=M(E,t),c=Ie(E,t),i=k(t);return e.jsx(D.ItemSlot,{scope:t,children:e.jsx(se,{"aria-disabled":r.open&&!c.collapsible||void 0,"data-orientation":s.orientation,id:r.triggerId,...i,...a,ref:n})})});B.displayName=E;var F="AccordionContent",X=l.forwardRef((o,n)=>{const{__scopeAccordion:t,...a}=o,s=y(d,t),r=M(F,t),c=k(t);return e.jsx(ie,{role:"region","aria-labelledby":r.triggerId,"data-orientation":s.orientation,...c,...a,ref:n,style:{"--radix-accordion-content-height":"var(--radix-collapsible-content-height)","--radix-accordion-content-width":"var(--radix-collapsible-content-width)",...o.style}})});X.displayName=F;function Z(o){return o?"open":"closed"}var _e=K,Pe=U,Te=Q,J=B,ee=X;const H=_e,C=j.forwardRef(({className:o,...n},t)=>e.jsx(Pe,{ref:t,className:S("border-b",o),...n}));C.displayName="AccordionItem";const A=j.forwardRef(({className:o,children:n,...t},a)=>e.jsx(Te,{className:"flex",children:e.jsxs(J,{ref:a,className:S("flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180",o),...t,children:[n,e.jsx(me,{className:"h-4 w-4 shrink-0 transition-transform duration-200"})]})}));A.displayName=J.displayName;const h=j.forwardRef(({className:o,children:n,...t},a)=>e.jsx(ee,{ref:a,className:"overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",...t,children:e.jsx("div",{className:S("pb-4 pt-0",o),children:n})}));h.displayName=ee.displayName;function Oe(){const[o,n]=j.useState(!1);return e.jsxs(ue,{open:o,onOpenChange:n,className:"w-[350px] space-y-2",children:[e.jsxs("div",{className:"flex items-center justify-between space-x-4 px-4",children:[e.jsx("h4",{className:"text-sm font-semibold",children:"@peduarte starred 3 repositories"}),e.jsx(xe,{asChild:!0,children:e.jsx(fe,{variant:"ghost",size:"sm",children:e.jsx(Ce,{className:"h-4 w-4"})})})]}),e.jsxs(Ae,{className:"space-y-2",children:[e.jsx("div",{className:"rounded-md border px-4 py-2 text-sm",children:"@radix-ui/primitives"}),e.jsx("div",{className:"rounded-md border px-4 py-2 text-sm",children:"@radix-ui/colors"}),e.jsx("div",{className:"rounded-md border px-4 py-2 text-sm",children:"@stitches/react"})]})]})}function Me(){return e.jsx(he,{title:"Accordion & Collapsible",description:"Componentes de expansão/colapso para revelar conteúdo. Accordion para múltiplos itens, Collapsible para item único.",component:e.jsxs(H,{type:"single",collapsible:!0,className:"w-full max-w-md",children:[e.jsxs(C,{value:"item-1",children:[e.jsx(A,{children:"Is it accessible?"}),e.jsx(h,{children:"Yes. It adheres to the WAI-ARIA design pattern."})]}),e.jsxs(C,{value:"item-2",children:[e.jsx(A,{children:"Is it styled?"}),e.jsx(h,{children:"Yes. It comes with default styles that matches the other components aesthetic."})]}),e.jsxs(C,{value:"item-3",children:[e.jsx(A,{children:"Is it animated?"}),e.jsx(h,{children:"Yes. It's animated by default, but you can disable it if you prefer."})]})]}),usage:`import {
-  Accordion,
-  AccordionContent,
-  AccordionItem,
-  AccordionTrigger,
-} from "forlogic-core"
-
-<Accordion type="single" collapsible>
-  <AccordionItem value="item-1">
-    <AccordionTrigger>Is it accessible?</AccordionTrigger>
-    <AccordionContent>
-      Yes. It adheres to the WAI-ARIA design pattern.
-    </AccordionContent>
-  </AccordionItem>
-</Accordion>`,examples:[{title:"Multiple Items Open",description:"Permite que múltiplos itens sejam abertos ao mesmo tempo",preview:e.jsxs(H,{type:"multiple",className:"w-full max-w-md",children:[e.jsxs(C,{value:"item-1",children:[e.jsx(A,{children:"Section 1"}),e.jsx(h,{children:"Content for section 1"})]}),e.jsxs(C,{value:"item-2",children:[e.jsx(A,{children:"Section 2"}),e.jsx(h,{children:"Content for section 2"})]})]}),code:`<Accordion type="multiple">
-  <AccordionItem value="item-1">
-    <AccordionTrigger>Section 1</AccordionTrigger>
-    <AccordionContent>Content for section 1</AccordionContent>
-  </AccordionItem>
-</Accordion>`},{title:"Collapsible",description:"Componente simples para expandir/colapsar um único item",preview:e.jsx(Oe,{}),code:`import {
-  Collapsible,
-  CollapsibleContent,
-  CollapsibleTrigger,
-} from "forlogic-core"
-
-<Collapsible>
-  <CollapsibleTrigger>Toggle</CollapsibleTrigger>
-  <CollapsibleContent>
-    Content goes here
-  </CollapsibleContent>
-</Collapsible>`}],props:[{name:"type",type:'"single" | "multiple"',default:"-",description:"Accordion: Determina se um ou múltiplos itens podem ser abertos."},{name:"collapsible",type:"boolean",default:"false",description:'Accordion: Quando type é "single", permite fechar o item aberto.'},{name:"defaultValue",type:"string | string[]",default:"-",description:"O(s) valor(es) ativo(s) padrão."},{name:"value",type:"string | string[]",default:"-",description:"O(s) valor(es) ativo(s) controlado(s)."},{name:"open",type:"boolean",default:"-",description:"Collapsible: O estado aberto controlado."},{name:"defaultOpen",type:"boolean",default:"false",description:"Collapsible: O estado aberto padrão."},{name:"onOpenChange",type:"(open: boolean) => void",default:"-",description:"Collapsible: Manipulador quando o estado muda."}],accessibility:["Acessível por teclado - Espaço ou Enter para alternar","Teclas de seta para navegar entre itens do accordion","Suporte ARIA completo com roles e estados adequados","Gerenciamento de foco e indicadores de foco visíveis"],notes:["**Accordion** é ideal para FAQs e listas de perguntas frequentes","**Collapsible** é melhor para um único elemento expansível","Ambos suportam animações suaves de abertura/fechamento"]})}export{Me as AccordionDoc};

package/dist/assets/ActionButtonDoc-b4F_J8gn.js

@@ -1,47 +0,0 @@
-import{j as e,f as s,m as n,n as a,o as i,A as t,p as r,q as o,s as c,t as d}from"./index-BtX5DZqb.js";import{C as l}from"./ComponentDocTemplate-BtOCnlM2.js";import{T as m}from"./trash-CeK-mWnM.js";import"./ExampleCard-DfuMYM6E.js";import"./TableOfContents-DBMJMbI4.js";function j(){return e.jsx(l,{title:"Action Button",description:"Botão compacto otimizado para ações em linhas de tabela e menus dropdown. OBRIGATÓRIO para todas as ações em tabelas CRUD.",component:e.jsxs("div",{className:"w-full space-y-6",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-sm font-medium mb-2",children:"✅ Uso Correto - ActionButton"}),e.jsxs(a,{children:[e.jsx(i,{asChild:!0,children:e.jsx(t,{})}),e.jsxs(r,{align:"end",children:[e.jsxs(o,{onClick:()=>alert("Editar"),children:[e.jsx(c,{className:"mr-2 h-4 w-4"}),"Editar"]}),e.jsxs(o,{onClick:()=>alert("Visualizar"),children:[e.jsx(d,{className:"mr-2 h-4 w-4"}),"Visualizar"]}),e.jsxs(o,{onClick:()=>alert("Excluir"),className:"text-destructive",children:[e.jsx(m,{className:"mr-2 h-4 w-4"}),"Excluir"]})]})]})]}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-sm font-medium mb-2",children:"ActionButton com ícone customizado"}),e.jsx(t,{children:e.jsx(c,{size:12})})]}),e.jsxs("div",{className:"border-t pt-4",children:[e.jsx("h3",{className:"text-sm font-medium mb-2 text-destructive",children:"❌ Errado - Não use Button genérico"}),e.jsxs("div",{className:"flex gap-2 opacity-50",children:[e.jsx(s,{variant:"ghost",size:"icon",className:"h-8 w-8",disabled:!0,children:e.jsx(n,{className:"h-4 w-4"})}),e.jsx("span",{className:"text-sm text-muted-foreground self-center",children:"← Nunca use isto em tabelas"})]})]})]}),usage:`import { 
-  ActionButton, 
-  DropdownMenu, 
-  DropdownMenuTrigger,
-  DropdownMenuContent,
-  DropdownMenuItem 
-} from "forlogic-core"
-import { Edit, Trash } from 'lucide-react'
-
-// ✅ CORRETO: Uso padrão em tabelas CRUD
-<DropdownMenu>
-  <DropdownMenuTrigger asChild>
-    <ActionButton />
-  </DropdownMenuTrigger>
-  <DropdownMenuContent align="end">
-    <DropdownMenuItem onClick={() => handleEdit(item)}>
-      <Edit className="mr-2 h-4 w-4" />
-      Editar
-    </DropdownMenuItem>
-    <DropdownMenuItem onClick={() => handleDelete(item)}>
-      <Trash className="mr-2 h-4 w-4" />
-      Excluir
-    </DropdownMenuItem>
-  </DropdownMenuContent>
-</DropdownMenu>
-
-// ✅ CORRETO: Com ícone customizado
-<ActionButton>
-  <Edit size={12} />
-</ActionButton>`,examples:[{title:"❌ Errado - Não use Button genérico",preview:e.jsxs("div",{className:"flex gap-2 opacity-50",children:[e.jsx(s,{variant:"ghost",size:"icon",className:"h-8 w-8",disabled:!0,children:e.jsx(n,{className:"h-4 w-4"})}),e.jsx("span",{className:"text-sm text-muted-foreground self-center",children:"← Nunca use isto"})]}),code:`// ❌ NUNCA faça isso em tabelas CRUD
-<Button variant="ghost" size="icon" className="h-8 w-8">
-  <MoreHorizontal className="h-4 w-4" />
-</Button>
-
-// ❌ NUNCA faça isso
-<Button variant="outline" size="sm">
-  <EllipsisVertical size={12} />
-</Button>`},{title:"✅ Correto - Sempre use ActionButton",preview:e.jsxs(a,{children:[e.jsx(i,{asChild:!0,children:e.jsx(t,{})}),e.jsxs(r,{align:"end",children:[e.jsx(o,{children:"Editar"}),e.jsx(o,{children:"Excluir"})]})]}),code:`// ✅ SEMPRE use ActionButton em tabelas
-<DropdownMenu>
-  <DropdownMenuTrigger asChild>
-    <ActionButton />
-  </DropdownMenuTrigger>
-  <DropdownMenuContent align="end">
-    <DropdownMenuItem>Editar</DropdownMenuItem>
-    <DropdownMenuItem>Excluir</DropdownMenuItem>
-  </DropdownMenuContent>
-</DropdownMenu>`}],props:[{name:"children",type:"ReactNode",default:"<EllipsisVertical />",description:"Conteúdo customizado (ícone padrão: três pontos verticais)."},{name:"className",type:"string",default:"-",description:"Classes CSS adicionais."},{name:"onClick",type:"() => void",default:"-",description:"Handler de clique."}],accessibility:["Tamanho compacto (height: 28px, padding: 8px)","Ícone padrão: EllipsisVertical (três pontos verticais)",'variant="action" com estilo consistente do tema',"Perfeito para menus de ação em linhas de tabela"],notes:["⚠️ OBRIGATÓRIO: Use ActionButton para TODAS as ações em linhas de tabela CRUD",'❌ PROIBIDO: Usar Button variant="ghost" ou variant="icon" para ações de tabela',"O ActionButton garante consistência visual e acessibilidade em todo o sistema","Para ações padrão (editar/excluir), considere usar TableRowActions que já encapsula tudo","O ícone padrão é EllipsisVertical (não MoreHorizontal) para manter consistência"]})}export{j as ActionButtonDoc};

package/dist/assets/AlertDoc-PkiHguSJ.js

@@ -1,37 +0,0 @@
-import{j as e,aA as a,aB as i,aC as r}from"./index-BtX5DZqb.js";import{C as s}from"./ComponentDocTemplate-BtOCnlM2.js";import"./ExampleCard-DfuMYM6E.js";import"./TableOfContents-DBMJMbI4.js";function c(){return e.jsx(s,{title:"Alert",description:"Exibe uma mensagem de destaque para chamar a atenção do usuário. O componente inclui ícone automático baseado na variante.",component:e.jsxs(a,{variant:"info",className:"max-w-md",children:[e.jsx(i,{children:"Informação"}),e.jsx(r,{children:"Esta é uma mensagem informativa para o usuário."})]}),usage:`import { Alert, AlertDescription, AlertTitle } from "forlogic-core"
-
-<Alert variant="info">
-  <AlertTitle>Informação</AlertTitle>
-  <AlertDescription>
-    Esta é uma mensagem informativa para o usuário.
-  </AlertDescription>
-</Alert>`,examples:[{title:"Informativo (info)",description:"Alerta neutro para informações gerais. Ícone: Info.",preview:e.jsxs(a,{variant:"info",className:"max-w-md",children:[e.jsx(i,{children:"Informação"}),e.jsx(r,{children:"Você pode adicionar componentes e dependências ao seu app usando o CLI."})]}),code:`<Alert variant="info">
-  <AlertTitle>Informação</AlertTitle>
-  <AlertDescription>
-    Você pode adicionar componentes e dependências ao seu app usando o CLI.
-  </AlertDescription>
-</Alert>`},{title:"Alerta (warning)",description:"Alerta de atenção para avisos. Ícone: Info.",preview:e.jsxs(a,{variant:"warning",className:"max-w-md",children:[e.jsx(i,{children:"Atenção"}),e.jsx(r,{children:"Sua sessão expira em 5 minutos. Salve suas alterações."})]}),code:`<Alert variant="warning">
-  <AlertTitle>Atenção</AlertTitle>
-  <AlertDescription>
-    Sua sessão expira em 5 minutos. Salve suas alterações.
-  </AlertDescription>
-</Alert>`},{title:"Perigo (danger)",description:"Alerta de erro ou perigo. Ícone: AlertTriangle.",preview:e.jsxs(a,{variant:"danger",className:"max-w-md",children:[e.jsx(i,{children:"Erro"}),e.jsxs(r,{children:[e.jsx("p",{children:"Não foi possível processar seu pagamento."}),e.jsxs("ul",{className:"mt-2 list-disc list-inside text-sm",children:[e.jsx("li",{children:"Verifique os dados do cartão"}),e.jsx("li",{children:"Confirme se há saldo suficiente"})]})]})]}),code:`<Alert variant="danger">
-  <AlertTitle>Erro</AlertTitle>
-  <AlertDescription>
-    <p>Não foi possível processar seu pagamento.</p>
-    <ul className="mt-2 list-disc list-inside text-sm">
-      <li>Verifique os dados do cartão</li>
-      <li>Confirme se há saldo suficiente</li>
-    </ul>
-  </AlertDescription>
-</Alert>`},{title:"Sucesso (success)",description:"Alerta de sucesso para confirmações. Ícone: CheckCircle.",preview:e.jsxs(a,{variant:"success",className:"max-w-md",children:[e.jsx(i,{children:"Sucesso"}),e.jsx(r,{children:"Suas alterações foram salvas com sucesso."})]}),code:`<Alert variant="success">
-  <AlertTitle>Sucesso</AlertTitle>
-  <AlertDescription>
-    Suas alterações foram salvas com sucesso.
-  </AlertDescription>
-</Alert>`},{title:"Sem ícone",description:"Use showIcon={false} para ocultar o ícone automático.",preview:e.jsxs(a,{variant:"info",showIcon:!1,className:"max-w-md",children:[e.jsx(i,{children:"Alerta sem ícone"}),e.jsx(r,{children:"Este alerta não exibe o ícone padrão da variante."})]}),code:`<Alert variant="info" showIcon={false}>
-  <AlertTitle>Alerta sem ícone</AlertTitle>
-  <AlertDescription>
-    Este alerta não exibe o ícone padrão da variante.
-  </AlertDescription>
-</Alert>`}],props:[{name:"variant",type:'"info" | "warning" | "danger" | "success"',default:'"info"',description:"O estilo visual e ícone do alerta."},{name:"showIcon",type:"boolean",default:"true",description:"Se deve exibir o ícone padrão da variante."},{name:"className",type:"string",default:"-",description:"Classes CSS adicionais."}],accessibility:['Usa role="alert" para anunciar automaticamente aos leitores de tela',"A cor não é o único meio de transmitir informações - ícones fornecem contexto adicional","Estrutura HTML semântica com título e descrição claramente definidos","Contraste de cores adequado para acessibilidade visual"]})}export{c as AlertDoc};

package/dist/assets/AppHeaderDoc-CsFMZGV0.js

@@ -1,67 +0,0 @@
-import{j as e,bW as o,I as i,f as s,bT as a,x as u,P as n,aN as d,a7 as l,c9 as c,r as x,B as p}from"./index-BtX5DZqb.js";import{C as h}from"./ComponentDocTemplate-BtOCnlM2.js";import"./ExampleCard-DfuMYM6E.js";import"./TableOfContents-DBMJMbI4.js";function f(){const[t,r]=x.useState("");return e.jsx("div",{className:"w-full bg-background border rounded-lg",children:e.jsx("header",{className:"px-4 py-2",children:e.jsxs("div",{className:"flex items-center gap-4",children:[e.jsxs("div",{className:"flex-shrink-0",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[e.jsx("h1",{className:"text-lg font-semibold",children:"Usuários"}),e.jsx(p,{className:"bg-primary text-primary-foreground text-xs px-2 py-0.5",children:"Módulo"})]}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Gerenciamento de usuários"})]}),e.jsxs("div",{className:"flex items-center gap-2 flex-1 max-w-md",children:[e.jsxs("div",{className:"relative flex-1",children:[e.jsx(o,{className:"absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground h-4 w-4"}),e.jsx(i,{placeholder:"Buscar...",value:t,onChange:m=>r(m.target.value),className:"w-full pl-10 pr-8"}),t&&e.jsx(s,{variant:"ghost",size:"sm",className:"absolute right-1 top-1/2 transform -translate-y-1/2 h-6 w-6 p-0",onClick:()=>r(""),children:e.jsx(c,{className:"h-3.5 w-3.5"})})]}),e.jsx(s,{variant:"outline",size:"icon",className:"h-10 w-10",children:e.jsx(a,{className:"h-4 w-4"})})]}),e.jsxs("div",{className:"flex-shrink-0 ml-auto flex items-center gap-3",children:[e.jsxs(s,{size:"sm",children:[e.jsx(n,{className:"h-4 w-4 mr-1"}),"Novo"]}),e.jsx(s,{variant:"ghost",className:"h-auto p-2",children:e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsxs("div",{className:"text-left",children:[e.jsx("p",{className:"text-sm font-medium",children:"João Silva"}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Empresa XYZ"})]}),e.jsx("div",{className:"w-8 h-8 bg-primary rounded-full flex items-center justify-center",children:e.jsx(d,{className:"h-4 w-4 text-primary-foreground"})}),e.jsx(l,{className:"h-4 w-4"})]})})]})]})})})}function g(){return e.jsxs("div",{className:"w-full",children:[e.jsxs("div",{className:"flex items-center justify-between h-14 px-4 border rounded-lg bg-background",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("div",{className:"bg-primary/10 text-primary px-2 py-1 rounded text-xs font-medium",children:"TÍTULO"}),e.jsx("span",{className:"text-xs text-muted-foreground",children:"←"})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-xs text-muted-foreground",children:"→"}),e.jsx("div",{className:"bg-secondary/50 text-secondary-foreground px-2 py-1 rounded text-xs font-medium",children:"BUSCA"}),e.jsx("span",{className:"text-xs text-muted-foreground",children:"←"})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-xs text-muted-foreground",children:"→"}),e.jsx("div",{className:"bg-accent/50 text-accent-foreground px-2 py-1 rounded text-xs font-medium",children:"AÇÕES"}),e.jsx("div",{className:"bg-muted text-muted-foreground px-2 py-1 rounded text-xs font-medium",children:"PERFIL"})]})]}),e.jsx("p",{className:"text-xs text-muted-foreground text-center mt-2",children:"Diagrama das áreas internas do AppHeader (altura fixa: 56px)"})]})}function v(){return e.jsxs("div",{className:"flex gap-8 items-start",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium",children:'variant="dropdown"'}),e.jsx("div",{className:"border rounded-lg p-2 bg-background",children:e.jsx(s,{variant:"ghost",className:"h-auto p-2",children:e.jsxs("div",{className:"flex items-center space-x-2",children:[e.jsxs("div",{className:"text-left",children:[e.jsx("p",{className:"text-sm font-medium",children:"João Silva"}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Empresa XYZ"})]}),e.jsx("div",{className:"w-8 h-8 bg-primary rounded-full flex items-center justify-center",children:e.jsx(d,{className:"h-4 w-4 text-primary-foreground"})}),e.jsx(l,{className:"h-4 w-4"})]})})})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium",children:"Menu aberto"}),e.jsxs("div",{className:"border rounded-lg p-2 w-48 bg-background shadow-lg",children:[e.jsxs("div",{className:"py-1.5 px-2 hover:bg-muted rounded flex items-center gap-2 cursor-pointer",children:[e.jsx(a,{className:"h-4 w-4"}),e.jsx("span",{className:"text-sm",children:"Alterar Unidade"})]}),e.jsx("div",{className:"h-px bg-border my-1"}),e.jsxs("div",{className:"py-1.5 px-2 hover:bg-muted rounded flex items-center gap-2 cursor-pointer text-destructive",children:[e.jsx(c,{className:"h-4 w-4"}),e.jsx("span",{className:"text-sm",children:"Sair"})]})]})]})]})}function y(){return e.jsx(h,{title:"AppHeader",description:"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).",component:e.jsx(f,{}),usage:`import { AppLayout } from 'forlogic-core';
-import { usePageMetadataContext } from 'forlogic-core';
-
-// O AppHeader é renderizado automaticamente pelo AppLayout
-<AppLayout sidebarConfig={sidebarConfig}>
-  <Routes>...</Routes>
-</AppLayout>
-
-// Para configurar título e ações, use o PageMetadataContext
-function UsersPage() {
-  const { setHeaderActions, setMetadata } = usePageMetadataContext();
-  
-  useEffect(() => {
-    setMetadata({ title: 'Usuários', subtitle: 'Gerenciamento' });
-    setHeaderActions(
-      <Button size="sm" onClick={() => setIsAddDialogOpen(true)}>
-        <Plus className="h-4 w-4 mr-1" />
-        Novo Usuário
-      </Button>
-    );
-    
-    return () => {
-      setMetadata({});
-      setHeaderActions(null);
-    };
-  }, []);
-}`,examples:[{title:"Estrutura do Componente",description:"O AppHeader possui 4 áreas internas: Título (esquerda), Busca (centro), Ações (direita) e Perfil (extrema direita).",preview:e.jsx(g,{}),code:`// Áreas do AppHeader
-// 1. Título: Título da página + Subtítulo + Badge do módulo
-// 2. Busca: Input de busca global (visível quando habilitado)
-// 3. Ações: Botões customizáveis via PageMetadataContext
-// 4. Perfil: UserInfo com dropdown de usuário
-
-// Altura fixa: 56px (h-14 no Tailwind)`},{title:"UserInfo Integrado",description:"Dropdown com informações do usuário, troca de unidade e logout.",preview:e.jsx(v,{}),code:`// UserInfo com variantes
-<UserInfo variant="dropdown" />  // No header
-<UserInfo variant="card" />      // Em páginas
-
-// Menu do usuário inclui:
-// - Alterar Unidade (submenu com todas unidades disponíveis)
-// - Sair (Logout)`},{title:"Busca Global",description:"Campo de busca com debounce sincronizado com URL (?search=termo).",preview:e.jsxs("div",{className:"flex items-center gap-2 max-w-md",children:[e.jsxs("div",{className:"relative flex-1",children:[e.jsx(o,{className:"absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground h-4 w-4"}),e.jsx(i,{placeholder:"Buscar...",className:"w-full pl-10 pr-8"})]}),e.jsx(s,{variant:"outline",size:"icon",className:"h-10 w-10",children:e.jsx(a,{className:"h-4 w-4"})})]}),code:`// Configurar campos pesquisáveis no service
-const userService = createSimpleService({
-  tableName: 'users',
-  schema: 'common',
-  searchFields: ['name', 'email', 'department'],
-});
-
-// A busca é exibida quando isSearchVisible = true no AuthContext`},{title:"Ações Customizáveis",description:"Botões de ação configurados via PageMetadataContext.",preview:e.jsxs("div",{className:"flex gap-2",children:[e.jsxs(s,{variant:"outline",size:"sm",children:[e.jsx(u,{className:"h-4 w-4 mr-1"}),"Exportar"]}),e.jsxs(s,{size:"sm",children:[e.jsx(n,{className:"h-4 w-4 mr-1"}),"Novo"]})]}),code:`// ✅ CORRETO: Apenas botões de ação
-setHeaderActions(
-  <>
-    <Button variant="outline" size="sm">
-      <Download className="h-4 w-4 mr-1" />
-      Exportar
-    </Button>
-    <Button size="sm">
-      <Plus className="h-4 w-4 mr-1" />
-      Novo
-    </Button>
-  </>
-);
-
-// ❌ INCORRETO: Formulário no header
-setHeaderActions(
-  <form onSubmit={...}>
-    <Input />
-    <Select />
-    <Button type="submit">Salvar</Button>
-  </form>
-);`}],props:[{name:"actions",type:"ReactNode",description:"Botões de ação à direita do header (via PageMetadataContext)"},{name:"variant (UserInfo)",type:'"card" | "dropdown"',default:'"card"',description:"Estilo de exibição do UserInfo"},{name:"selectedUnit (UserInfo)",type:"Company | null",description:"Unidade selecionada"},{name:"onUnitChange (UserInfo)",type:"(unit: Company) => void",description:"Callback ao trocar unidade"}],accessibility:["Busca acessível via teclado (Tab para navegar, Escape para limpar)","UserInfo dropdown acessível via teclado","Botões de ação com foco visível (focus-visible)",'Título da página anunciado por leitores de tela (role="heading")',"Atalho de teclado para busca (/ ou Ctrl+K pode ser implementado)"],notes:["✅ Use PageMetadataContext para ações dinâmicas","✅ Mantenha título curto e descritivo (máx. 3 palavras)","✅ Use um único header por página","✅ Limpe ações no useEffect cleanup","✅ Use ícones do Lucide nos botões de ação","❌ Não adicione múltiplos headers na mesma página","❌ Não modifique a altura do header (fixo em 56px)","❌ Não coloque formulários complexos no header","❌ Não use mais de 3 botões de ação","❌ Não esconda o UserInfo em páginas autenticadas"]})}export{y as AppHeaderDoc};

package/dist/assets/AppSidebarDoc-Bg71N-zq.js

@@ -1,196 +0,0 @@
-import{j as e,B as n,f as t,bm as j,P as l,g as P,bs as c,h as b,l as i,c7 as d,bB as T,w as R,v as k,bZ as I,a7 as U,G,bi as D,r as m,cS as H,ek as A,cT as p,cU as x,cV as u,b$ as B,bE as W}from"./index-BtX5DZqb.js";import{C as q}from"./ComponentDocTemplate-BtOCnlM2.js";import{a as L,b as z,P as F}from"./pin-CJJgLEBz.js";import{G as O}from"./grip-vertical-CgXp0oI-.js";import"./ExampleCard-DfuMYM6E.js";import"./TableOfContents-DBMJMbI4.js";const V=[{icon:c,label:"Visão geral"},{icon:B,label:"Showcase"},{icon:d,label:"Liderança"},{icon:W,label:"Locais"},{icon:k,label:"Gestão",children:[{icon:d,label:"Usuários"},{icon:I,label:"Permissões"}]},{icon:F,label:"Design System"}];function Q(){const[a,r]=m.useState(!0),[N,h]=m.useState(!0),[S,g]=m.useState("Visão geral"),[E,M]=m.useState(["Gestão"]);return e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-2 flex-wrap",children:[e.jsx(t,{variant:a?"primary":"outline",size:"sm",onClick:()=>{r(!0),h(!0)},children:"Expandido"}),e.jsx(t,{variant:a?"outline":"primary",size:"sm",onClick:()=>{r(!1),h(!1)},children:"Colapsado"}),e.jsxs("span",{className:"text-xs text-muted-foreground ml-2",children:[N?e.jsx(L,{className:"inline h-3 w-3 mr-1"}):e.jsx(z,{className:"inline h-3 w-3 mr-1"}),N?"Pinada":"Despinada"]})]}),e.jsx(H,{children:e.jsx("div",{className:"relative inline-block",children:e.jsxs("div",{className:i("bg-background border border-border rounded-lg py-4 space-y-3 transition-all duration-300 overflow-visible relative",a?"w-64 px-3":"w-16 px-1.5"),children:[a?e.jsxs("div",{className:"flex flex-col gap-3 pl-2",children:[e.jsx("div",{className:"flex items-center h-10",children:e.jsx("img",{src:A.logo,alt:"Logo",className:"h-5 object-contain",onError:s=>{s.target.src='data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 24"%3E%3Ctext x="0" y="18" font-family="system-ui" font-size="16" font-weight="bold" fill="%23333"%3EForlogic%3C/text%3E%3C/svg%3E'}})}),e.jsxs(t,{variant:"secondary",size:"default",className:"h-10 gap-2 px-3 justify-start w-full",children:[e.jsx(j,{className:"h-4 w-4 flex-shrink-0"}),e.jsx("span",{className:"truncate",children:"Meu Módulo"})]})]}):e.jsxs("div",{className:"flex flex-col items-center justify-center w-full gap-3",children:[e.jsx("div",{className:"flex items-center justify-center h-10 w-8",children:e.jsx("img",{src:A.smallLogo,alt:"Logo",className:"h-6 w-auto object-contain",onError:s=>{s.target.src='data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 34"%3E%3Crect width="34" height="34" rx="6" fill="%23e5e7eb"/%3E%3Ctext x="50%25" y="55%25" text-anchor="middle" font-family="system-ui" font-size="14" font-weight="bold" fill="%23333"%3EF%3C/text%3E%3C/svg%3E'}})}),e.jsxs(p,{children:[e.jsx(x,{asChild:!0,children:e.jsx("button",{className:"flex items-center justify-center h-10 w-8 rounded-md hover:bg-accent hover:text-accent-foreground transition-colors",children:e.jsx(j,{className:"h-4 w-4"})})}),e.jsx(u,{side:"right",children:"Módulos"})]})]}),a?e.jsxs(t,{variant:"outline",className:"w-full gap-2 justify-start h-10",children:[e.jsx(l,{className:"h-4 w-4"}),"Novo Processo"]}):e.jsxs(p,{children:[e.jsx(x,{asChild:!0,children:e.jsx(t,{variant:"outline",size:"icon",className:"w-full h-10",children:e.jsx(l,{className:"h-4 w-4"})})}),e.jsx(u,{side:"right",children:"Novo Processo"})]}),e.jsxs("div",{className:"relative py-2",children:[e.jsx("div",{className:"border-t border-border"}),e.jsxs(p,{children:[e.jsx(x,{asChild:!0,children:e.jsx("button",{onClick:()=>{const s=!a;r(s),h(s)},className:i("absolute top-1/2 -translate-y-1/2 z-[100] h-6 w-6 flex items-center justify-center rounded-full bg-primary hover:bg-primary/90 shadow-md transition-colors",a?"-right-6":"-right-[18px]"),children:a?e.jsx(P,{className:"h-3.5 w-3.5 text-primary-foreground"}):e.jsx(b,{className:"h-3.5 w-3.5 text-primary-foreground"})})}),e.jsx(u,{side:"right",children:e.jsx("p",{children:a?"Recolher":"Expandir"})})]})]}),e.jsx("div",{className:"space-y-1",children:V.map(s=>{const w=s.label===S,f="children"in s&&s.children,y=E.includes(s.label),C=()=>{M(o=>o.includes(s.label)?o.filter(v=>v!==s.label):[...o,s.label])};return a?f?e.jsxs("div",{children:[e.jsxs("div",{onClick:C,className:i("flex items-center justify-between h-10 px-3 rounded-md transition-colors cursor-pointer","hover:bg-muted text-foreground"),children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("span",{className:"flex items-center justify-center h-8 w-8",children:e.jsx(s.icon,{className:"h-4 w-4"})}),e.jsx("span",{className:"text-sm font-medium",children:s.label})]}),e.jsx(b,{className:i("h-4 w-4 transition-transform",y&&"rotate-90")})]}),y&&e.jsx("div",{className:"ml-6 mt-1 space-y-1 border-l border-border pl-3",children:s.children.map(o=>{const v=o.label===S;return e.jsxs("div",{onClick:()=>g(o.label),className:i("flex items-center gap-2 h-8 px-2 rounded-md transition-colors cursor-pointer text-sm",v?"bg-primary/10 text-primary font-medium":"text-muted-foreground hover:bg-muted hover:text-foreground"),children:[e.jsx(o.icon,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:o.label})]},o.label)})})]},s.label):e.jsxs("div",{onClick:()=>g(s.label),className:i("flex items-center gap-3 h-10 px-3 rounded-md transition-colors cursor-pointer",w?"bg-primary/10 text-primary font-medium":"hover:bg-muted text-foreground"),children:[e.jsx("span",{className:"flex items-center justify-center h-8 w-8",children:e.jsx(s.icon,{className:"h-4 w-4"})}),e.jsx("span",{className:"text-sm",children:s.label})]},s.label):e.jsxs(p,{children:[e.jsx(x,{asChild:!0,children:e.jsx("div",{onClick:()=>{f?C():g(s.label)},className:i("flex items-center justify-center h-8 w-8 mx-auto rounded-md transition-colors cursor-pointer",w?"bg-primary/10 text-primary":"hover:bg-accent hover:text-accent-foreground"),children:e.jsx(s.icon,{className:"h-4 w-4"})})}),e.jsxs(u,{side:"right",children:[s.label,f&&" (expandir para ver subitens)"]})]},s.label)})}),a&&e.jsx("div",{className:"absolute inset-y-0 right-0 w-1 hover:bg-primary/20 transition-colors cursor-ew-resize"})]})})})]})}function K(){return e.jsxs("div",{className:"flex gap-8 items-start flex-wrap",children:[e.jsx("div",{className:"relative",children:e.jsxs("div",{className:"w-64 bg-background border border-border rounded-lg py-4 px-3 space-y-3 relative overflow-visible",children:[e.jsxs("div",{className:"flex flex-col gap-2 px-2 py-2 border border-dashed border-primary/50 rounded relative",children:[e.jsx(n,{variant:"outline",className:"absolute -top-2.5 left-2 text-xs bg-background",children:"SidebarHeader"}),e.jsx("div",{className:"h-8 w-14 bg-muted rounded flex items-center justify-center text-[10px]",children:"Logo"}),e.jsxs(t,{variant:"secondary",size:"sm",className:"h-8 text-[10px] gap-2 px-3 justify-start",children:[e.jsx(j,{className:"h-3 w-3"}),"Módulos"]})]}),e.jsxs("div",{className:"border border-dashed border-green-500/50 rounded p-2 relative",children:[e.jsx(n,{variant:"outline",className:"absolute -top-2.5 left-2 text-xs bg-background text-green-600",children:"SidebarActionTrigger"}),e.jsxs(t,{variant:"outline",size:"sm",className:"w-full gap-1 text-xs h-7 justify-start",children:[e.jsx(l,{className:"h-3 w-3"}),"Ação"]})]}),e.jsxs("div",{className:"relative py-2",children:[e.jsx("div",{className:"border-t border-dashed border-blue-500/50 relative",children:e.jsx(n,{variant:"outline",className:"absolute -top-2.5 right-0 text-[8px] bg-background text-blue-600 whitespace-nowrap",children:"Pin/Unpin"})}),e.jsx("div",{className:"absolute top-1/2 -translate-y-1/2 -right-5 h-5 w-5 rounded-full bg-primary flex items-center justify-center",children:e.jsx(P,{className:"h-2.5 w-2.5 text-primary-foreground"})})]}),e.jsxs("div",{className:"border border-dashed border-orange-500/50 rounded p-2 relative space-y-1",children:[e.jsx(n,{variant:"outline",className:"absolute -top-2.5 left-2 text-xs bg-background text-orange-600",children:"NavigationItems"}),[{label:"Item simples",active:!0},{label:"Item com children",hasChildren:!0}].map((a,r)=>e.jsxs("div",{className:i("flex items-center justify-between px-2 py-1.5 rounded text-xs",a.active?"bg-primary/10 text-primary":"bg-muted/50"),children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(c,{className:"h-3 w-3"}),e.jsx("span",{children:a.label})]}),a.hasChildren&&e.jsx(b,{className:"h-3 w-3"})]},r))]}),e.jsx("div",{className:"absolute inset-y-0 right-0 w-1 border-r-2 border-dashed border-purple-400/50 rounded-r"}),e.jsx(n,{variant:"outline",className:"absolute top-1/2 -right-16 text-[8px] bg-background text-purple-600 whitespace-nowrap",children:"Resize rail"})]})}),e.jsxs("div",{className:"space-y-2 text-xs",children:[e.jsx("p",{className:"font-medium text-sm mb-3",children:"Hierarquia:"}),e.jsx("pre",{className:"bg-muted p-3 rounded text-xs font-mono leading-relaxed",children:`<Sidebar collapsible="icon">
-  ├── SidebarHeader
-  │   ├── Logo / SmallLogo
-  │   └── ModulesButton (appName)
-  │
-  ├── SidebarActionTrigger (opcional)
-  │   ├── Ação única → executa direto
-  │   └── Múltiplas → dropdown
-  │
-  ├── Separator + Pin/Unpin button
-  │
-  └── SidebarContent
-      └── NavigationItems
-          ├── Item simples (Link)
-          ├── Item com permissionCheck
-          └── Item com children
-              └── Collapsible > SidebarMenuSub`})]})]})}function Z(){return e.jsx("div",{className:"flex gap-4 items-start flex-wrap",children:[{title:"Ativo",className:"bg-primary/10 text-primary font-medium",icon:c,label:"Início"},{title:"Hover",className:"bg-muted",icon:d,label:"Usuários"},{title:"Desabilitado",className:"opacity-50 cursor-not-allowed border",icon:T,label:"Admin"},{title:"Carregando",className:"opacity-50 border",icon:R,label:"Verificando...",spin:!0}].map(a=>e.jsxs("div",{className:"space-y-1",children:[e.jsx("p",{className:"text-xs text-muted-foreground mb-2",children:a.title}),e.jsxs("div",{className:i("flex items-center gap-3 px-3 py-2 rounded-md w-40",a.className),children:[e.jsx(a.icon,{className:i("h-4 w-4",a.spin&&"animate-spin")}),e.jsx("span",{className:"text-sm",children:a.label})]})]},a.title))})}function $(){return e.jsxs("div",{className:"p-3 border rounded-md w-56 space-y-1 bg-background",children:[e.jsxs("div",{className:"flex items-center gap-3 h-10 px-3 rounded-md hover:bg-muted",children:[e.jsx("span",{className:"flex items-center justify-center h-8 w-8",children:e.jsx(c,{className:"h-4 w-4"})}),e.jsx("span",{className:"text-sm font-medium",children:"Início"})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center justify-between h-10 px-3 rounded-md hover:bg-muted cursor-pointer",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("span",{className:"flex items-center justify-center h-8 w-8",children:e.jsx(k,{className:"h-4 w-4"})}),e.jsx("span",{className:"text-sm font-medium",children:"Configurações"})]}),e.jsx(b,{className:"h-4 w-4 rotate-90"})]}),e.jsx("div",{className:"ml-6 mt-1 space-y-1 border-l border-border pl-3",children:[{icon:d,label:"Perfil",active:!0},{icon:I,label:"Segurança"}].map(a=>e.jsxs("div",{className:i("flex items-center gap-2 h-8 px-2 rounded-md text-sm",a.active?"bg-primary/10 text-primary font-medium":"text-muted-foreground hover:bg-muted"),children:[e.jsx(a.icon,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:a.label})]},a.label))})]})]})}function J(){return e.jsxs("div",{className:"flex gap-6 items-start flex-wrap",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-center",children:"Uma Ação"}),e.jsxs("div",{className:"w-56 bg-background border rounded-lg p-3 space-y-3",children:[e.jsxs(t,{variant:"outline",className:"w-full gap-2 justify-start",children:[e.jsx(l,{className:"h-4 w-4"}),"Novo Processo"]}),e.jsx("div",{className:"border-t pt-2 space-y-1",children:[{icon:c,label:"Início",active:!0},{icon:d,label:"Usuários"}].map((a,r)=>e.jsxs("div",{className:i("flex items-center gap-3 px-3 py-2 rounded-md text-sm",a.active?"bg-primary/10 text-primary font-medium":"hover:bg-muted"),children:[e.jsx(a.icon,{className:"h-4 w-4"}),e.jsx("span",{children:a.label})]},r))})]})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-center",children:"Múltiplas Ações"}),e.jsxs("div",{className:"w-56 bg-background border rounded-lg p-3 space-y-1",children:[e.jsxs(t,{variant:"outline",className:"w-full gap-2 justify-start",children:[e.jsx(l,{className:"h-4 w-4"}),"Criar",e.jsx(U,{className:"ml-auto h-4 w-4 rotate-180"})]}),e.jsx("div",{className:"border rounded-md bg-popover p-1 shadow-md",children:[{icon:G,label:"Novo Documento"},{icon:D,label:"Nova Pasta"},{icon:d,label:"Novo Grupo"}].map((a,r)=>e.jsxs("div",{className:"flex items-center gap-2 px-2 py-1.5 rounded-sm hover:bg-muted cursor-pointer",children:[e.jsx(a.icon,{className:"h-4 w-4"}),e.jsx("span",{className:"text-sm",children:a.label})]},r))})]})]})]})}function X(){return e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3 p-3 border rounded-md bg-muted/30",children:[e.jsx(O,{className:"h-5 w-5 text-muted-foreground"}),e.jsxs("div",{className:"text-sm space-y-1",children:[e.jsx("p",{className:"font-medium",children:"Redimensionamento"}),e.jsxs("p",{className:"text-muted-foreground",children:["Quando ",e.jsx("code",{className:"bg-muted px-1 rounded text-xs",children:"resizable=true"}),", um rail aparece na borda direita. Arraste para redimensionar entre ",e.jsx("code",{className:"bg-muted px-1 rounded text-xs",children:"minWidth"})," e"," ",e.jsx("code",{className:"bg-muted px-1 rounded text-xs",children:"maxWidth"}),"."]}),e.jsxs("p",{className:"text-muted-foreground",children:["A largura é persistida automaticamente em ",e.jsx("code",{className:"bg-muted px-1 rounded text-xs",children:"localStorage"}),"."]})]})]}),e.jsx("pre",{className:"bg-muted p-3 rounded text-xs font-mono",children:`<AppSidebar
-  config={sidebarConfig}
-  resizable={true}
-  minWidth={224}   // padrão: 224px (14rem)
-  maxWidth={384}   // padrão: 384px (24rem)
-/>`})]})}function Y(){return e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex gap-4 items-start flex-wrap",children:[e.jsxs("div",{className:"p-3 border rounded-md space-y-2 w-64",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(L,{className:"h-4 w-4 text-primary"}),e.jsx("span",{className:"text-sm font-medium",children:"Pinada"})]}),e.jsxs("p",{className:"text-xs text-muted-foreground",children:["Sidebar permanece aberta. Estado salvo em ",e.jsx("code",{className:"bg-muted px-1 rounded",children:"localStorage"}),"."]})]}),e.jsxs("div",{className:"p-3 border rounded-md space-y-2 w-64",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(z,{className:"h-4 w-4 text-muted-foreground"}),e.jsx("span",{className:"text-sm font-medium",children:"Despinada"})]}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Sidebar inicia colapsada. Expande ao hover (desktop) ou toggle (mobile)."})]})]}),e.jsxs("p",{className:"text-xs text-muted-foreground",children:["O botão circular na borda do separador controla pin/unpin. Em telas ",e.jsx("code",{className:"bg-muted px-1 rounded",children:"<768px"})," (mobile), o botão é ocultado."]})]})}function _(){return e.jsx("div",{className:"space-y-3 w-full",children:[{badge:"Desktop ≥1024px",variant:"default",text:"Sidebar visível, pode ser pinada ou colapsar"},{badge:"Tablet 768-1023px",variant:"secondary",text:"Sidebar inicia colapsada, expande ao hover/click"},{badge:"Mobile <768px",variant:"outline",text:"Sidebar como drawer/sheet lateral (oculta por padrão)"}].map(a=>e.jsxs("div",{className:"flex gap-4 items-center",children:[e.jsx(n,{variant:a.variant,className:"shrink-0",children:a.badge}),e.jsx("span",{className:"text-sm text-muted-foreground",children:a.text})]},a.badge))})}function te(){return e.jsxs(e.Fragment,{children:[e.jsx(q,{title:"AppSidebar",description:"Sidebar de navegação principal da aplicação com suporte a pin/unpin, permissões assíncronas, ações de módulo (SidebarActionTrigger), redimensionamento e navegação hierárquica.",component:e.jsx(Q,{}),usage:`import { AppLayout } from 'forlogic-core';
-import type { SidebarConfig } from 'forlogic-core';
-import { Home, Users, Settings, Shield, Plus, FileText, Folder } from 'lucide-react';
-
-const sidebarConfig: SidebarConfig = {
-  appName: 'Minha Aplicação',
-
-  // Ações do módulo (opcional)
-  moduleActions: {
-    triggerLabel: 'Criar',
-    triggerIcon: Plus,
-    actions: [
-      { id: 'new-doc', label: 'Novo Documento', icon: FileText, onClick: () => {} },
-      { id: 'new-folder', label: 'Nova Pasta', icon: Folder, onClick: () => {} },
-    ],
-  },
-
-  // Navegação (com suporte a hierarquia)
-  navigation: [
-    { label: 'Início', path: '/', icon: Home },
-    { label: 'Usuários', path: '/users', icon: Users },
-    {
-      label: 'Configurações',
-      path: '/settings',
-      icon: Settings,
-      children: [
-        { label: 'Perfil', path: '/settings/profile', icon: Users },
-        { label: 'Segurança', path: '/settings/security', icon: Shield },
-      ],
-    },
-  ],
-};
-
-// Uso via AppLayout (recomendado)
-<AppLayout sidebarConfig={sidebarConfig}>
-  <Routes>...</Routes>
-</AppLayout>
-
-// Uso direto (casos avançados)
-<AppSidebar
-  config={sidebarConfig}
-  resizable={true}
-  minWidth={224}
-  maxWidth={384}
-/>`,examples:[{title:"Anatomia do Sidebar",description:"Estrutura hierárquica completa: Header, Actions, Separator com Pin, Navigation, e Resize rail.",preview:e.jsx(K,{}),code:`// Estrutura do AppSidebar
-<Sidebar collapsible="icon">
-  ├── SidebarHeader (Logo + ModulesButton)
-  ├── SidebarActionTrigger (ações de módulo)
-  ├── Separator + Pin/Unpin button (borda)
-  └── SidebarContent
-      └── NavigationItems
-          ├── Item simples (Link)
-          ├── Item com permissionCheck
-          └── Item com children (Collapsible)
-              └── SidebarMenuSub`},{title:"Estados Visuais",description:"Itens de navegação possuem 4 estados: Ativo (bg-primary/10), Hover (bg-muted), Desabilitado (opacity-50 + Lock icon), e Carregando (spinner durante permissionCheck).",preview:e.jsx(Z,{}),code:`// Matching de rota ativa (hierárquico)
-const isActive = (path: string) =>
-  location.pathname === path ||
-  location.pathname.startsWith(path + '/');
-
-// Item com verificação de permissão assíncrona
-{
-  label: 'Gestão',
-  path: '/management',
-  icon: Settings,
-  permissionCheck: async () => {
-    return await checkUserPermission('management');
-  }
-}
-// → Exibe Loader2 (spin) enquanto verifica
-// → Exibe Lock + "Acesso restrito" se false`},{title:"Navegação Hierárquica",description:"Suporte a itens com children (máximo 2 níveis). No modo expandido, usa Collapsible com ChevronRight. No modo colapsado, exibe tooltip.",preview:e.jsx($,{}),code:`const navigation: SidebarNavigationItem[] = [
-  { label: 'Início', path: '/', icon: Home },
-  {
-    label: 'Configurações',
-    path: '/settings',
-    icon: Settings,
-    children: [
-      { label: 'Perfil', path: '/settings/profile', icon: Users },
-      { label: 'Segurança', path: '/settings/security', icon: Shield },
-    ],
-  },
-];`},{title:"Ações de Módulo (SidebarActionTrigger)",description:"Uma ação executa diretamente; múltiplas ações exibem dropdown. Quando a sidebar está colapsada, mostra apenas ícone com tooltip.",preview:e.jsx(J,{}),code:`// SidebarActionsConfig
-moduleActions: {
-  triggerLabel: 'Criar',       // Label do botão (múltiplas ações)
-  triggerIcon: Plus,           // Ícone do gatilho
-  actions: [
-    {
-      id: 'new-document',
-      label: 'Novo Documento',
-      icon: FileText,
-      onClick: () => openDocumentDialog(),
-      disabled: false,          // Opcional
-      permissionCheck: async () => true,  // Opcional
-    },
-  ],
-}`},{title:"Pin / Unpin",description:"O botão circular na borda do separador controla se a sidebar permanece aberta (pinada) ou colapsa automaticamente.",preview:e.jsx(Y,{}),code:`// Internamente o AppSidebar usa:
-import { getSidebarPinnedPreference, setSidebarPinnedPreference }
-  from './sidebar-utils';
-
-// Persistência em localStorage ('forlogic-sidebar-pinned')
-// Botão circular usa bg-primary com ChevronLeft/Right
-// Oculto em mobile (hidden md:block)`},{title:"Redimensionamento",description:"Quando resizable=true, um rail aparece na borda direita para arrastar. A largura é persistida em localStorage.",preview:e.jsx(X,{}),code:`// useSidebarResize hook
-import { useSidebarResize } from 'forlogic-core';
-
-const resize = useSidebarResize({
-  minWidth: 224,      // Mínimo (14rem)
-  maxWidth: 384,      // Máximo (24rem)
-  defaultWidth: 240,  // Padrão (15rem)
-  storageKey: 'app-sidebar-width',
-  isOpen: true,
-  onResize: (width) => console.log(width),
-});
-
-// resize.width, resize.isDragging,
-// resize.dragRef, resize.handleMouseDown`},{title:"Comportamento Responsivo",description:"A sidebar adapta-se automaticamente ao tamanho da tela.",preview:e.jsx(_,{}),code:`// O AppSidebar usa collapsible="icon"
-// Em desktop: colapsa para 16px (ícones apenas)
-// Em mobile: comportamento de drawer
-
-// useSidebar() hook disponível para controle externo
-import { useSidebar } from 'forlogic-core';
-
-const { open, setOpen, state, toggleSidebar } = useSidebar();
-// state: "expanded" | "collapsed"`}],props:[{name:"config",type:"SidebarConfig",description:"Configuração principal: appName, navigation[], moduleActions"},{name:"config.appName",type:"string",description:'Nome exibido no botão de módulos (fallback: "Módulos")'},{name:"config.navigation",type:"SidebarNavigationItem[]",description:"Itens de navegação com label, path, icon e children opcionais"},{name:"config.moduleActions",type:"SidebarActionsConfig",description:"Ações do módulo: triggerLabel, triggerIcon, actions[]"},{name:"customContent",type:"ReactNode",description:"Conteúdo customizado que substitui a navegação padrão"},{name:"resizable",type:"boolean",default:"false",description:"Habilita redimensionamento com drag na borda direita"},{name:"minWidth",type:"number",default:"224",description:"Largura mínima em pixels (resizable=true)"},{name:"maxWidth",type:"number",default:"384",description:"Largura máxima em pixels (resizable=true)"}],accessibility:["Navegação acessível via teclado (Tab, Arrow keys, Enter)","Submenus expansíveis com Enter ou Space (via Collapsible)","Estado ativo comunicado via isActive no SidebarMenuButton","Itens desabilitados com cursor-not-allowed e opacity reduzida","Tooltips em modo colapsado para identificação de todos os itens","Botão pin/unpin oculto em mobile (hidden md:block) para evitar conflito com drawer","Contraste adequado entre estados ativo/inativo usando tokens semânticos"],notes:["✅ Use ícones consistentes do Lucide React para todos os itens","✅ Máximo 2 níveis de aninhamento (item → children)","✅ Labels curtas: 1-3 palavras, máximo 20 caracteres","✅ Agrupe itens relacionados logicamente","✅ Use permissionCheck para controle de acesso assíncrono","✅ Use moduleActions para ações de criação/adição do módulo","✅ Prefira AppLayout ao invés de usar AppSidebar diretamente","❌ Não use mais de 10 itens no nível raiz","❌ Não crie 3+ níveis de submenu (hierarquia profunda)","❌ Não deixe itens sem ícones","❌ Não misture ícones de bibliotecas diferentes","❌ Não use labels com mais de 20 caracteres"]}),e.jsxs("div",{className:"mt-12 pt-8 border-t space-y-6",children:[e.jsx("h2",{className:"text-2xl font-bold",children:"Tipos TypeScript"}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-semibold mb-3",children:"SidebarConfig"}),e.jsx("pre",{className:"bg-muted p-4 rounded-lg overflow-x-auto text-sm",children:`interface SidebarConfig {
-  appName?: string;
-  navigation?: SidebarNavigationItem[];
-  moduleActions?: SidebarActionsConfig;
-}`})]}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-semibold mb-3",children:"SidebarNavigationItem"}),e.jsx("pre",{className:"bg-muted p-4 rounded-lg overflow-x-auto text-sm",children:`interface SidebarNavigationItem {
-  label: string;                          // Texto do item
-  path: string;                           // Rota de navegação
-  icon: LucideIcon;                       // Ícone obrigatório
-  complementaryText?: string;             // Texto complementar
-  permissionCheck?: () => Promise<boolean>; // Verificação assíncrona
-  children?: SidebarNavigationItem[];     // Subitens (máx. 2 níveis)
-}`})]}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-semibold mb-3",children:"SidebarActionsConfig"}),e.jsx("pre",{className:"bg-muted p-4 rounded-lg overflow-x-auto text-sm",children:`interface SidebarActionsConfig {
-  triggerLabel?: string;        // Rótulo do gatilho (default: 'Criar')
-  triggerIcon?: LucideIcon;     // Ícone do gatilho (default: Plus)
-  actions: SidebarModuleAction[];
-}
-
-interface SidebarModuleAction {
-  id: string;                              // ID único
-  label: string;                           // Texto exibido
-  icon?: LucideIcon;                       // Ícone opcional
-  onClick: () => void;                     // Callback
-  disabled?: boolean;                      // Desabilitar ação
-  permissionCheck?: () => Promise<boolean>; // Verificação de permissão
-}`})]})]}),e.jsxs("div",{className:"mt-12 pt-8 border-t space-y-6",children:[e.jsx("h2",{className:"text-2xl font-bold",children:"Componente Base: Sidebar"}),e.jsxs("p",{className:"text-muted-foreground",children:["O AppSidebar utiliza internamente o componente base ",e.jsx("code",{className:"bg-muted px-1 rounded",children:"Sidebar"})," do Shadcn/Radix. Para sidebars customizadas fora do AppLayout, use o componente base diretamente."]}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-semibold mb-3",children:"Uso do Base"}),e.jsx("pre",{className:"bg-muted p-4 rounded-lg overflow-x-auto text-sm",children:`import {
-  Sidebar, SidebarProvider, SidebarHeader, SidebarContent,
-  SidebarFooter, SidebarGroup, SidebarGroupLabel,
-  SidebarGroupContent, SidebarMenu, SidebarMenuItem,
-  SidebarMenuButton, SidebarTrigger,
-} from 'forlogic-core';
-
-<SidebarProvider>
-  <Sidebar collapsible="icon">
-    <SidebarHeader>Logo</SidebarHeader>
-    <SidebarContent>
-      <SidebarGroup>
-        <SidebarGroupLabel>Menu</SidebarGroupLabel>
-        <SidebarGroupContent>
-          <SidebarMenu>
-            <SidebarMenuItem>
-              <SidebarMenuButton isActive>
-                <Home className="mr-2" /> Home
-              </SidebarMenuButton>
-            </SidebarMenuItem>
-          </SidebarMenu>
-        </SidebarGroupContent>
-      </SidebarGroup>
-    </SidebarContent>
-  </Sidebar>
-  <main>
-    <SidebarTrigger />
-    {/* Content */}
-  </main>
-</SidebarProvider>`})]}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-semibold mb-3",children:"Props do Sidebar Base"}),e.jsx("div",{className:"overflow-x-auto",children:e.jsxs("table",{className:"w-full text-sm border",children:[e.jsx("thead",{children:e.jsxs("tr",{className:"bg-muted",children:[e.jsx("th",{className:"text-left p-2 border-b",children:"Prop"}),e.jsx("th",{className:"text-left p-2 border-b",children:"Tipo"}),e.jsx("th",{className:"text-left p-2 border-b",children:"Default"}),e.jsx("th",{className:"text-left p-2 border-b",children:"Descrição"})]})}),e.jsxs("tbody",{children:[e.jsxs("tr",{children:[e.jsx("td",{className:"p-2 border-b font-mono text-xs",children:"side"}),e.jsx("td",{className:"p-2 border-b",children:'"left" | "right"'}),e.jsx("td",{className:"p-2 border-b",children:'"left"'}),e.jsx("td",{className:"p-2 border-b",children:"Lado da tela"})]}),e.jsxs("tr",{children:[e.jsx("td",{className:"p-2 border-b font-mono text-xs",children:"variant"}),e.jsx("td",{className:"p-2 border-b",children:'"sidebar" | "floating" | "inset"'}),e.jsx("td",{className:"p-2 border-b",children:'"sidebar"'}),e.jsx("td",{className:"p-2 border-b",children:"Estilo visual"})]}),e.jsxs("tr",{children:[e.jsx("td",{className:"p-2 border-b font-mono text-xs",children:"collapsible"}),e.jsx("td",{className:"p-2 border-b",children:'"offcanvas" | "icon" | "none"'}),e.jsx("td",{className:"p-2 border-b",children:'"offcanvas"'}),e.jsx("td",{className:"p-2 border-b",children:"Comportamento de collapse"})]})]})]})})]}),e.jsx("div",{className:"p-4 bg-muted/50 rounded-lg border",children:e.jsxs("p",{className:"text-sm",children:[e.jsx("strong",{children:"💡 Recomendação:"})," Para a maioria dos casos, prefira"," ",e.jsx("code",{className:"bg-muted px-1 rounded",children:"AppSidebar"})," via"," ",e.jsx("code",{className:"bg-muted px-1 rounded",children:"AppLayout"}),", que já inclui permissões, módulos, resize e pin/unpin. Use o Sidebar base apenas para customizações avançadas."]})})]})]})}export{te as AppSidebarDoc};