@kenlo/kdls-design-system 2.9.0 → 2.9.2

package/kdls-manifest.json

@@ -1,7 +1,7 @@
 {
   "package": {
     "name": "@kenlo/kdls-design-system",
-    "version": "2.9.0"
+    "version": "2.9.2"
   },
   "install": {
     "add": "npm install @kenlo/kdls-design-system",
@@ -12,10 +12,12 @@
     "note": "Use the Tailwind preset OR styles.css, never both — same class names."
   },
   "counts": {
-    "components": 58,
-    "propsTables": 83,
-    "props": 710,
-    "tokens": 546
+    "components": 60,
+    "propsTables": 85,
+    "props": 732,
+    "tokens": 548,
+    "api": 12,
+    "icons": 49
   },
   "components": [
     {
@@ -2111,6 +2113,21 @@
       ],
       "subComponents": []
     },
+    {
+      "name": "Form",
+      "kind": "value",
+      "import": "import { Form } from '@kenlo/kdls-design-system'",
+      "props": [
+        {
+          "name": "validateOn",
+          "type": "'change'|'blur'|'submit'",
+          "default": "'change'",
+          "description": "Quando as regras de validação dos campos filhos são avaliadas — 'change' a cada digitação · 'blur' ao sair do campo · 'submit' só no envio",
+          "example": "validateOn=\"blur\""
+        }
+      ],
+      "subComponents": []
+    },
     {
       "name": "Grid",
       "kind": "value",
@@ -2168,6 +2185,147 @@
       ],
       "subComponents": []
     },
+    {
+      "name": "Header",
+      "kind": "value",
+      "import": "import { Header } from '@kenlo/kdls-design-system'",
+      "props": [
+        {
+          "name": "product",
+          "type": "'imob' | 'sites' | 'locacao' | 'leads' | 'generico' | 'base'",
+          "default": "'base'",
+          "description": "Produto Kenlo — define o logo exibido",
+          "example": "'imob' | 'locacao'"
+        },
+        {
+          "name": "logoHref",
+          "type": "string",
+          "default": "—",
+          "description": "Destino do clique no logo — normalmente a home do produto. Sem logoHref nem onLogoClick o logo não é clicável",
+          "example": "'/inicio'"
+        },
+        {
+          "name": "onLogoClick",
+          "type": "() => void",
+          "default": "—",
+          "description": "Callback do clique no logo — use com router client-side, ou junto de logoHref para interceptar a navegação",
+          "example": "() => navigate(\"/\")"
+        },
+        {
+          "name": "logoLabel",
+          "type": "string",
+          "default": "'Página inicial'",
+          "description": "Nome acessível do link do logo, lido no lugar da imagem",
+          "example": "'Início do Vira'"
+        },
+        {
+          "name": "navItems",
+          "type": "HeaderNavItem[]",
+          "default": "[]",
+          "description": "Itens de navegação principal (com suporte a submenus via children)",
+          "example": "[{ label: 'Indicadores', href: '/indicadores' }]"
+        },
+        {
+          "name": "activeNav",
+          "type": "string",
+          "default": "—",
+          "description": "Label do item de navegação ativo — deve corresponder a um item em navItems",
+          "example": "'Indicadores'"
+        },
+        {
+          "name": "notifications",
+          "type": "HeaderNotification[]",
+          "default": "[]",
+          "description": "Lista de notificações exibidas no painel ao clicar no sino",
+          "example": "[{ id: '1', title: 'Novo lead', time: '2min' }]"
+        },
+        {
+          "name": "onClearNotifications",
+          "type": "() => void",
+          "default": "—",
+          "description": "Callback para limpar todas as notificações do painel",
+          "example": "() => setNotifications([])"
+        },
+        {
+          "name": "showNotifications",
+          "type": "boolean",
+          "default": "true",
+          "description": "Exibe ou oculta o sino de notificações — use false quando o produto não tem esse conceito",
+          "example": "showNotifications={false}"
+        },
+        {
+          "name": "products",
+          "type": "HeaderProduct[]",
+          "default": "[]",
+          "description": "Lista de produtos Kenlo para navegação cruzada — o botão de grid só aparece quando há mais de 1 item (1 item = o próprio produto atual, sem destino pra navegar)",
+          "example": "[{ label: 'Sites' }, { label: 'CRM' }]"
+        },
+        {
+          "name": "user",
+          "type": "{ name, initials?, code?, company?, avatarSrc? }",
+          "default": "—",
+          "description": "Dados do usuário logado exibidos no perfil e no avatar",
+          "example": "{ name: 'Maria R.', initials: 'MR', company: 'Imob Alfa' }"
+        },
+        {
+          "name": "profileMenuItems",
+          "type": "HeaderProfileMenuItem[]",
+          "default": "[]",
+          "description": "Itens do menu de perfil (desktop e mobile), abaixo dos dados do usuário — vazio por padrão, nada decorativo é assumido",
+          "example": "[{ label: 'Editar perfil', onClick: () => {} }]"
+        },
+        {
+          "name": "onLogout",
+          "type": "() => void",
+          "default": "—",
+          "description": "Ação de sair — some por completo quando não é passado. Sempre a última linha (desktop e mobile)",
+          "example": "() => signOut()"
+        },
+        {
+          "name": "logoutLabel",
+          "type": "string",
+          "default": "'Sair'",
+          "description": "Texto da linha de logout",
+          "example": "'Sair'"
+        },
+        {
+          "name": "contextSelector",
+          "type": "ReactNode",
+          "default": "—",
+          "description": "Slot para seletor de contexto (unidade, site ou empresa)",
+          "example": "<Select label=\"Unidade\" options={units} />"
+        },
+        {
+          "name": "rightSlot",
+          "type": "ReactNode",
+          "default": "—",
+          "description": "Slot livre do lado direito, antes do avatar — ex.: um badge de versão",
+          "example": "<Badge label=\"v2.0.3\" variant=\"neutral\" />"
+        },
+        {
+          "name": "onFAQs",
+          "type": "() => void",
+          "default": "—",
+          "description": "Callback disparado ao clicar no botão de FAQs",
+          "example": "() => openFAQsPanel()"
+        },
+        {
+          "name": "showFAQs",
+          "type": "boolean",
+          "default": "true",
+          "description": "Exibe ou oculta o botão de FAQs na barra",
+          "example": "showFAQs={false}"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "default": "''",
+          "description": "Classe CSS adicional no elemento raiz do Header",
+          "example": "'header-main'"
+        }
+      ],
+      "subComponents": []
+    },
     {
       "name": "Icon",
       "kind": "value",
@@ -5459,6 +5617,20 @@
           "default": "true",
           "description": "Exibe o botão de fechar (✕) — ligado por padrão; passar false para ocultar",
           "example": "showDismiss: false"
+        },
+        {
+          "name": "onDismiss",
+          "type": "() => void",
+          "default": "—",
+          "description": "Callback do clique no botão de fechar. Preenchido pelo ToastProvider ao usar toast() — só é passado à mão quando o <Toast> é renderizado diretamente",
+          "example": "onDismiss: () => remove(id)"
+        },
+        {
+          "name": "leaving",
+          "type": "boolean",
+          "default": "false",
+          "description": "Dispara a animação de saída. Controlado pelo ToastProvider durante a remoção — não passar à mão no uso normal",
+          "example": "leaving"
         }
       ],
       "subComponents": []
@@ -5646,6 +5818,122 @@
       "subComponents": []
     }
   ],
+  "api": [
+    {
+      "name": "NavContext",
+      "import": "import { NavContext } from '@kenlo/kdls-design-system'",
+      "from": "components/Nav/Nav.tsx"
+    },
+    {
+      "name": "SCROLLBAR_CLASSES",
+      "import": "import { SCROLLBAR_CLASSES } from '@kenlo/kdls-design-system'",
+      "from": "foundations/Scrollbar/index.ts"
+    },
+    {
+      "name": "Toaster",
+      "import": "import { Toaster } from '@kenlo/kdls-design-system'",
+      "from": "components/Toast/index.ts"
+    },
+    {
+      "name": "applyCustomScheme",
+      "import": "import { applyCustomScheme } from '@kenlo/kdls-design-system'",
+      "from": "components/ColorScheme/ColorScheme.ts"
+    },
+    {
+      "name": "clearCustomScheme",
+      "import": "import { clearCustomScheme } from '@kenlo/kdls-design-system'",
+      "from": "components/ColorScheme/ColorScheme.ts"
+    },
+    {
+      "name": "configureKdls",
+      "import": "import { configureKdls } from '@kenlo/kdls-design-system'",
+      "from": "components/Theme/Theme.ts"
+    },
+    {
+      "name": "generatePalette",
+      "import": "import { generatePalette } from '@kenlo/kdls-design-system'",
+      "from": "components/ColorScheme/ColorScheme.ts"
+    },
+    {
+      "name": "lastDays",
+      "import": "import { lastDays } from '@kenlo/kdls-design-system'",
+      "from": "components/DatePicker/index.ts"
+    },
+    {
+      "name": "nextDays",
+      "import": "import { nextDays } from '@kenlo/kdls-design-system'",
+      "from": "components/DatePicker/index.ts"
+    },
+    {
+      "name": "toast",
+      "import": "import { toast } from '@kenlo/kdls-design-system'",
+      "from": "components/Toast/index.ts"
+    },
+    {
+      "name": "useCustomScheme",
+      "import": "import { useCustomScheme } from '@kenlo/kdls-design-system'",
+      "from": "components/ColorScheme/ColorScheme.ts"
+    },
+    {
+      "name": "useFormContext",
+      "import": "import { useFormContext } from '@kenlo/kdls-design-system'",
+      "from": "components/Form/index.ts"
+    }
+  ],
+  "icons": {
+    "note": "49 icon exports — import by name from @kenlo/kdls-design-system, or use <Icon />.",
+    "names": [
+      "Facebook",
+      "FacebookColor",
+      "Google",
+      "GoogleColor",
+      "Instagram",
+      "InstagramColor",
+      "KenloKFilled",
+      "KenloKRegular",
+      "LeadDoubleFilled",
+      "LeadDoubleRegular",
+      "LeadInfoFilled",
+      "LeadInfoRegular",
+      "LeadSingleFilled",
+      "LeadSingleRegular",
+      "LeadUndefinedFilled",
+      "LeadUndefinedRegular",
+      "LeadVerifiedFilled",
+      "LeadVerifiedRegular",
+      "LinkedIn",
+      "LinkedInColor",
+      "LyaDoubleFilled",
+      "LyaDoubleRegular",
+      "LyaEditor",
+      "LyaFichaLimpa",
+      "LyaKoin",
+      "LyaOmni",
+      "LyaOraculo",
+      "LyaSdr",
+      "LyaSingleFilled",
+      "LyaSingleRegular",
+      "LyaStudio",
+      "Messenger",
+      "MessengerColor",
+      "Pinterest",
+      "PinterestColor",
+      "Telegram",
+      "TelegramColor",
+      "VideoHorizontalFilled",
+      "VideoHorizontalRegular",
+      "VideoTour3DFilled",
+      "VideoTour3DRegular",
+      "VideoVerticalFilled",
+      "VideoVerticalRegular",
+      "WhatsApp",
+      "WhatsAppColor",
+      "X",
+      "XColor",
+      "YouTube",
+      "YouTubeColor"
+    ]
+  },
   "tokens": {
     "body": [
       {
@@ -7630,6 +7918,14 @@
       }
     ],
     "focus": [
+      {
+        "name": "--focus-ring",
+        "value": "0 0 0 2px var(--component-bg-color), 0 0 0 4px var(--focus-stroke-color)"
+      },
+      {
+        "name": "--focus-ring-inset",
+        "value": "inset 0 0 0 2px var(--component-bg-color), inset 0 0 0 4px var(--focus-stroke-color)"
+      },
       {
         "name": "--focus-stroke-color",
         "value": "var(--color-neutral-90-00)"
@@ -7875,8 +8171,6 @@
       "ColorScheme",
       "Field",
       "Floating",
-      "Form",
-      "Header",
       "Menu",
       "Radio",
       "Theme"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kenlo/kdls-design-system",
-  "version": "2.9.0",
+  "version": "2.9.2",
   "private": false,
   "type": "module",
   "description": "KDLS Design System — componentes React + TypeScript",
@@ -17,7 +17,9 @@
     "./styles.css": "./foundations/styles.css",
     "./tailwind-preset": "./foundations/tailwind-preset.cjs",
     "./dist/index.css": "./dist/index.css",
-    "./manifest.json": "./kdls-manifest.json"
+    "./manifest.json": "./kdls-manifest.json",
+    "./manrope.css": "./foundations/manrope.css",
+    "./fonts-alt.css": "./foundations/fonts-alt.css"
   },
   "bin": {
     "kdls-guard": "scripts/kdls-guard.mjs"
@@ -29,7 +31,12 @@
     "foundations/tokens.css",
     "foundations/Scrollbar/Scrollbar.css",
     "foundations/styles.css",
-    "foundations/tailwind-preset.cjs"
+    "foundations/tailwind-preset.cjs",
+    "foundations/manrope.css",
+    "foundations/fonts/manrope-*.woff2",
+    "foundations/fonts/fonts.json",
+    "foundations/fonts/OFL.txt",
+    "foundations/fonts-alt.css"
   ],
   "publishConfig": {
     "access": "public"
@@ -40,7 +47,7 @@
   ],
   "scripts": {
     "dev": "vite --config portal/vite.config.ts",
-    "build:lib": "vite build --config vite.config.lib.ts && tsc -p tsconfig.lib.json",
+    "build:lib": "vite build --config vite.config.lib.ts && node scripts/unbase64-fonts.mjs && tsc -p tsconfig.lib.json",
     "build:portal": "vite build --config portal/vite.config.ts",
     "preview": "vite preview --config portal/vite.config.ts",
     "test": "vitest",
@@ -50,7 +57,14 @@
     "gen:styles": "node scripts/gen-styles.mjs",
     "gen:tokens": "node scripts/gen-tokens.mjs",
     "gen:manifest": "node scripts/gen-manifest.mjs",
-    "prepublishOnly": "npm run build:lib"
+    "prepublishOnly": "npm run build:lib",
+    "gen:font": "node scripts/gen-font.mjs",
+    "check:fonts": "node scripts/check-fonts.mjs",
+    "check:tokens": "node scripts/gen-tokens.mjs --check",
+    "check:styles": "node scripts/gen-styles.mjs --check",
+    "check:manifest": "node scripts/gen-manifest.mjs --check",
+    "check:props": "node scripts/check-props.mjs --check",
+    "check:all": "npm run check:tokens && npm run check:styles && npm run check:manifest && npm run check:props && npm run typecheck && npm run test:run"
   },
   "peerDependencies": {
     "@fluentui/react-icons": "^2.0.320",