forlogic-core 2.1.4 → 2.2.0

package/docs/design-system/tables-grids.md

@@ -5,11 +5,68 @@
 
 Categoria: **Data Grid** | 3 componentes
 
-### CrudTable
+### Table
 
-Componente de tabela CRUD completo com ordenação, seleção, resize de colunas, ações em massa e paginação integrada com useCrud.
+Uma tabela semântica para exibir dados tabulares. Inclui TableResizeHandle para redimensionamento de colunas e TruncatedCell para texto truncado com tooltip automático.
 
-> Fonte: `src\design-system\docs\components\crud\CrudTableDoc.tsx`
+**Uso:**
+```tsx
+import {
+  Table,
+  TableBody,
+  TableCaption,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+  TableResizeHandle,
+  TruncatedCell,
+} from "forlogic-core"
+
+<Table>
+  <TableCaption>Lista de usuários</TableCaption>
+  <TableHeader>
+    <TableRow>
+      <TableHead>Nome</TableHead>
+      <TableHead>Email</TableHead>
+      <TableHead>Status</TableHead>
+    </TableRow>
+  </TableHeader>
+  <TableBody>
+    <TableRow>
+      <TableCell>João Silva</TableCell>
+      <TableCell>joao@example.com</TableCell>
+      <TableCell>Ativo</TableCell>
+    </TableRow>
+  </TableBody>
+</Table>
+```
+
+**Props:**
+| Prop | Tipo | Padrão | Descrição |
+|------|------|--------|-----------|
+| `className` | `string` | - | Classes CSS adicionais para a tabela. |
+| `TableResizeHandle.onMouseDown` | `(e: MouseEvent) => void` | - | Handler para iniciar o redimensionamento. |
+| `TableResizeHandle.isDragging` | `boolean` | false | Se o handle está sendo arrastado (altera visual). |
+| `TruncatedCell.children` | `ReactNode` | - | Conteúdo a ser truncado. |
+| `TruncatedCell.className` | `string` | - | Classes CSS adicionais. |
+
+**Acessibilidade:**
+- Usa elementos HTML semânticos de tabela
+- Suporta navegação por teclado
+- TableCaption fornece contexto para leitores de tela
+- TableHeader define cabeçalhos de coluna apropriados
+- TruncatedCell mostra tooltip acessível com conteúdo completo
+- TableResizeHandle suporta interação via teclado
+- Funciona com leitores de tela
+
+**Notas:**
+- TableResizeHandle deve ser posicionado dentro de um TableHead com position: relative.
+- TruncatedCell detecta automaticamente se o texto está truncado e exibe tooltip apenas quando necessário.
+- Use larguras fixas (w-[Xpx]) nos TableHead para melhor controle do layout.
+- TruncatedCell usa CSS text-overflow: ellipsis internamente.
+
+> Fonte: `src/design-system/docs/components/TableDoc.tsx`
 
 ---
 
@@ -19,18 +76,18 @@ Componente utilitário que trunca texto longo e exibe tooltip automático quando
 
 **Uso:**
 ```tsx
-import { TruncatedCell } from 'forlogic-core';
-// 💡 Alias disponível: import { EllipsisText } from 'forlogic-core';
-
-<td className="max-w-[200px]">
-  <TruncatedCell>
-    Texto que pode ser muito longo...
-  </TruncatedCell>
-</td>
-
-// Com className customizada
-<TruncatedCell className="text-muted-foreground">
-  {item.description}
+import { TruncatedCell } from 'forlogic-core';
+// 💡 Alias disponível: import { EllipsisText } from 'forlogic-core';
+
+<td className="max-w-[200px]">
+  <TruncatedCell>
+    Texto que pode ser muito longo...
+  </TruncatedCell>
+</td>
+
+// Com className customizada
+<TruncatedCell className="text-muted-foreground">
+  {item.description}
 </TruncatedCell>
 ```
 
@@ -47,14 +104,14 @@ import { TruncatedCell } from 'forlogic-core';
 **Notas:**
 - 💡 Alias: Também disponível como 
 -  — import { EllipsisText } from 
-- ,
+- ,
         
-- ,
+- ,
         
-- ,
+- ,
         
 
-> Fonte: `src\design-system\docs\components\TruncatedCellDoc.tsx`
+> Fonte: `src/design-system/docs/components/TruncatedCellDoc.tsx`
 
 ---
 
@@ -64,20 +121,20 @@ Componentes de expansão/colapso para revelar conteúdo. Accordion para múltipl
 
 **Uso:**
 ```tsx
-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>
+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>
 ```
 
@@ -91,10 +148,10 @@ import {
 <Accordion type=
 ```
 ```tsx
-import {
-  Collapsible,
-  CollapsibleContent,
-  CollapsibleTrigger,
+import {
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger,
 } from
 ```
 
@@ -109,6 +166,6 @@ import {
 - **Collapsible** é melhor para um único elemento expansível
 - Ambos suportam animações suaves de abertura/fechamento
 
-> Fonte: `src\design-system\docs\components\AccordionDoc.tsx`
+> Fonte: `src/design-system/docs/components/AccordionDoc.tsx`
 
 ---

package/package.json

@@ -1,144 +1,150 @@
-{
-  "name": "forlogic-core",
-  "version": "2.1.4",
-  "type": "module",
-  "main": "dist/index.js",
-  "module": "dist/index.esm.js",
-  "types": "dist/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.esm.js",
-      "require": "./dist/index.js"
-    },
-    "./index.css": "./dist/index.css",
-    "./tokens": "./dist/tokens/index.js",
-    "./vite": {
-      "types": "./dist/vite/index.d.ts",
-      "import": "./dist/vite/index.esm.js",
-      "require": "./dist/vite/index.js"
-    },
-    "./tailwind": {
-      "types": "./dist/tailwind/index.d.ts",
-      "import": "./dist/tailwind/index.esm.js",
-      "require": "./dist/tailwind/index.js"
-    }
-  },
-  "files": [
-    "dist",
-    "docs",
-    ".note/memory"
-  ],
-  "sideEffects": [
-    "*.css"
-  ],
-  "scripts": {
-    "dev": "vite",
-    "build": "vite build",
-    "build:dev": "vite build --mode development",
-    "build:lib": "npx tsx scripts/generate-ds-docs.ts & rollup -c",
-    "lint": "eslint .",
-    "preview": "vite preview"
-  },
-  "dependencies": {
-    "@dnd-kit/core": "^6.3.1",
-    "@dnd-kit/sortable": "^10.0.0",
-    "@hookform/resolvers": "^3.10.0",
-    "@radix-ui/react-accordion": "^1.2.11",
-    "@radix-ui/react-alert-dialog": "^1.1.14",
-    "@radix-ui/react-avatar": "^1.1.10",
-    "@radix-ui/react-checkbox": "^1.3.3",
-    "@radix-ui/react-collapsible": "^1.1.11",
-    "@radix-ui/react-context-menu": "^2.2.16",
-    "@radix-ui/react-dialog": "^1.1.14",
-    "@radix-ui/react-dropdown-menu": "^2.1.15",
-    "@radix-ui/react-hover-card": "^1.1.15",
-    "@radix-ui/react-label": "^2.1.7",
-    "@radix-ui/react-menubar": "^1.1.16",
-    "@radix-ui/react-navigation-menu": "^1.2.14",
-    "@radix-ui/react-popover": "^1.1.14",
-    "@radix-ui/react-progress": "^1.1.7",
-    "@radix-ui/react-radio-group": "^1.3.7",
-    "@radix-ui/react-scroll-area": "^1.2.9",
-    "@radix-ui/react-select": "^2.2.5",
-    "@radix-ui/react-separator": "^1.1.7",
-    "@radix-ui/react-slider": "^1.3.5",
-    "@radix-ui/react-slot": "^1.2.3",
-    "@radix-ui/react-switch": "^1.2.6",
-    "@radix-ui/react-tabs": "^1.1.12",
-    "@radix-ui/react-toast": "^1.2.14",
-    "@radix-ui/react-toggle": "^1.1.9",
-    "@radix-ui/react-toggle-group": "^1.1.10",
-    "@radix-ui/react-tooltip": "^1.2.7",
-    "@supabase/supabase-js": "^2.100.0",
-    "@tanstack/react-query": "^5.83.0",
-    "@tiptap/extension-color": "^3.14.0",
-    "@tiptap/extension-highlight": "^3.14.0",
-    "@tiptap/extension-link": "^3.14.0",
-    "@tiptap/extension-text-style": "^3.14.0",
-    "@tiptap/extension-underline": "^3.14.0",
-    "@tiptap/react": "^3.14.0",
-    "@tiptap/starter-kit": "^3.14.0",
-    "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "date-fns": "^3.6.0",
-    "date-fns-tz": "^3.2.0",
-    "exceljs": "^4.4.0",
-    "i18next-browser-languagedetector": "^8.2.0",
-    "jszip": "^3.10.1",
-    "lucide-react": "^0.553.0",
-    "next-themes": "^0.3.0",
-    "react": "^18.3.1",
-    "react-day-picker": "^9.13.0",
-    "react-dom": "^18.3.1",
-    "react-hook-form": "^7.61.1",
-    "react-resizable-panels": "^3.0.6",
-    "react-router-dom": "^6.30.1",
-    "recharts": "^3.6.0",
-    "sonner": "^1.7.4",
-    "tailwind-merge": "^3.3.1",
-    "tailwindcss-animate": "^1.0.7",
-    "vaul": "^1.1.2",
-    "zod": "^3.25.76"
-  },
-  "peerDependencies": {
-    "i18next": "^25.0.0",
-    "react-i18next": "^16.0.0"
-  },
-  "devDependencies": {
-    "@babel/parser": "^7.28.5",
-    "@babel/traverse": "^7.28.5",
-    "@babel/types": "^7.28.5",
-    "@eslint/js": "^9.32.0",
-    "@rollup/plugin-commonjs": "^28.0.6",
-    "@rollup/plugin-json": "^6.1.0",
-    "@rollup/plugin-node-resolve": "^16.0.1",
-    "@rollup/plugin-terser": "1.0.0",
-    "@rollup/plugin-typescript": "^12.1.4",
-    "@rollup/plugin-url": "^8.0.2",
-    "@svgr/rollup": "^8.1.0",
-    "@tailwindcss/typography": "^0.5.16",
-    "@types/file-saver": "^2.0.7",
-    "@types/node": "^22.16.5",
-    "@types/react": "^18.3.23",
-    "@types/react-dom": "^18.3.7",
-    "@vitejs/plugin-react-swc": "^3.11.0",
-    "autoprefixer": "^10.4.21",
-    "baseline-browser-mapping": "^2.9.12",
-    "eslint": "^9.32.0",
-    "eslint-plugin-react-hooks": "^5.2.0",
-    "eslint-plugin-react-refresh": "^0.4.20",
-    "globals": "^15.15.0",
-    "lovable-tagger": "^1.1.9",
-    "postcss": "^8.5.6",
-    "rollup": "^4.50.1",
-    "rollup-plugin-copy": "^3.5.0",
-    "rollup-plugin-esbuild": "^6.2.1",
-    "rollup-plugin-postcss": "^4.0.2",
-    "tailwindcss": "^3.4.17",
-    "tsx": "^4.20.6",
-    "typescript": "^5.8.3",
-    "typescript-eslint": "^8.38.0",
-    "vite": "^7.3.0"
-  }
-}
+{
+  "name": "forlogic-core",
+  "version": "2.2.0",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.esm.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.js"
+    },
+    "./index.css": "./dist/index.css",
+    "./tokens": "./dist/tokens/index.js",
+    "./vite": {
+      "types": "./dist/vite/index.d.ts",
+      "import": "./dist/vite/index.esm.js",
+      "require": "./dist/vite/index.js"
+    },
+    "./tailwind": {
+      "types": "./dist/tailwind/index.d.ts",
+      "import": "./dist/tailwind/index.esm.js",
+      "require": "./dist/tailwind/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "docs",
+    ".note/memory"
+  ],
+  "sideEffects": [
+    "*.css"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "build:dev": "vite build --mode development",
+    "build:lib": "npx tsx scripts/generate-ds-docs.ts & rollup -c",
+    "lint": "eslint .",
+    "docs:check": "tsx scripts/check-docs.ts",
+    "docs:check-all": "tsx scripts/check-docs.ts --all",
+    "docs:fix": "tsx scripts/auto-doc.ts",
+    "docs:fix-all": "tsx scripts/auto-doc.ts --all",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "@hookform/resolvers": "^3.10.0",
+    "@microsoft/clarity": "^1.0.2",
+    "@radix-ui/react-accordion": "^1.2.11",
+    "@radix-ui/react-alert-dialog": "^1.1.14",
+    "@radix-ui/react-avatar": "^1.1.10",
+    "@radix-ui/react-checkbox": "^1.3.3",
+    "@radix-ui/react-collapsible": "^1.1.11",
+    "@radix-ui/react-context-menu": "^2.2.16",
+    "@radix-ui/react-dialog": "^1.1.14",
+    "@radix-ui/react-dropdown-menu": "^2.1.15",
+    "@radix-ui/react-hover-card": "^1.1.15",
+    "@radix-ui/react-label": "^2.1.7",
+    "@radix-ui/react-menubar": "^1.1.16",
+    "@radix-ui/react-navigation-menu": "^1.2.14",
+    "@radix-ui/react-popover": "^1.1.14",
+    "@radix-ui/react-progress": "^1.1.7",
+    "@radix-ui/react-radio-group": "^1.3.7",
+    "@radix-ui/react-scroll-area": "^1.2.9",
+    "@radix-ui/react-select": "^2.2.5",
+    "@radix-ui/react-separator": "^1.1.7",
+    "@radix-ui/react-slider": "^1.3.5",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-switch": "^1.2.6",
+    "@radix-ui/react-tabs": "^1.1.12",
+    "@radix-ui/react-toast": "^1.2.14",
+    "@radix-ui/react-toggle": "^1.1.9",
+    "@radix-ui/react-toggle-group": "^1.1.10",
+    "@radix-ui/react-tooltip": "^1.2.7",
+    "@supabase/supabase-js": "^2.100.0",
+    "@tanstack/react-query": "^5.83.0",
+    "@tiptap/extension-color": "^3.14.0",
+    "@tiptap/extension-highlight": "^3.14.0",
+    "@tiptap/extension-link": "^3.14.0",
+    "@tiptap/extension-text-style": "^3.14.0",
+    "@tiptap/extension-underline": "^3.14.0",
+    "@tiptap/react": "^3.14.0",
+    "@tiptap/starter-kit": "^3.14.0",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "date-fns": "^3.6.0",
+    "date-fns-tz": "^3.2.0",
+    "exceljs": "^4.4.0",
+    "i18next-browser-languagedetector": "^8.2.0",
+    "jszip": "^3.10.1",
+    "lucide-react": "^0.553.0",
+    "next-themes": "^0.3.0",
+    "react": "^18.3.1",
+    "react-day-picker": "^9.13.0",
+    "react-dom": "^18.3.1",
+    "react-hook-form": "^7.61.1",
+    "react-resizable-panels": "^3.0.6",
+    "react-router-dom": "^6.30.1",
+    "recharts": "^3.6.0",
+    "sonner": "^1.7.4",
+    "tailwind-merge": "^3.3.1",
+    "tailwindcss-animate": "^1.0.7",
+    "vaul": "^1.1.2",
+    "zod": "^3.25.76"
+  },
+  "peerDependencies": {
+    "i18next": "^25.0.0",
+    "react-i18next": "^16.0.0"
+  },
+  "devDependencies": {
+    "@babel/parser": "^7.28.5",
+    "@babel/traverse": "^7.28.5",
+    "@babel/types": "^7.28.5",
+    "@eslint/js": "^9.32.0",
+    "@rollup/plugin-commonjs": "^28.0.6",
+    "@rollup/plugin-json": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^16.0.1",
+    "@rollup/plugin-terser": "1.0.0",
+    "@rollup/plugin-typescript": "^12.1.4",
+    "@rollup/plugin-url": "^8.0.2",
+    "@svgr/rollup": "^8.1.0",
+    "@tailwindcss/typography": "^0.5.16",
+    "@types/file-saver": "^2.0.7",
+    "@types/node": "^22.16.5",
+    "@types/react": "^18.3.23",
+    "@types/react-dom": "^18.3.7",
+    "@vitejs/plugin-react-swc": "^3.11.0",
+    "autoprefixer": "^10.4.21",
+    "baseline-browser-mapping": "^2.9.12",
+    "eslint": "^9.32.0",
+    "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-refresh": "^0.4.20",
+    "globals": "^15.15.0",
+    "lovable-tagger": "^1.1.9",
+    "postcss": "^8.5.6",
+    "rollup": "^4.50.1",
+    "rollup-plugin-copy": "^3.5.0",
+    "rollup-plugin-esbuild": "^6.2.1",
+    "rollup-plugin-postcss": "^4.0.2",
+    "tailwindcss": "^3.4.17",
+    "tsx": "^4.20.6",
+    "typescript": "^5.8.3",
+    "typescript-eslint": "^8.38.0",
+    "vite": "^7.3.0"
+  }
+}