@sbkbs/ui 2.0.0-beta.0 → 2.0.0

package/dist/utils/cn.js.map

@@ -1 +1 @@
-{"version":3,"file":"cn.js","sources":["../../src/utils/cn.ts"],"sourcesContent":["import { clsx, type ClassValue } from 'clsx';\nimport { extendTailwindMerge } from 'tailwind-merge';\n\nconst twMerge = extendTailwindMerge<'sbk-glass'>({\n  extend: {\n    classGroups: {\n      'sbk-glass': ['sbk-glass'],\n    },\n    // sbk-glass define o próprio fundo: remove bg-* anteriores (ex.: bg-transparent do buttonReset)\n    conflictingClassGroups: {\n      'sbk-glass': ['bg-color'],\n    },\n    theme: {\n      radius: ['sbk-xs', 'sbk-sm', 'sbk-md', 'sbk-lg'],\n      shadow: ['sbk-sm', 'sbk-md', 'sbk-glass'],\n      font: ['sbk'],\n    },\n  },\n});\n\n/**\n * Utilitário de composição de classes Tailwind.\n * Usa clsx para lógica condicional e tailwind-merge (ciente dos tokens sbk)\n * para resolver conflitos, permitindo que o className do consumidor sobrescreva o padrão.\n */\nexport const cn = (...inputs: ClassValue[]) => twMerge(clsx(inputs));\n"],"names":["twMerge","extendTailwindMerge","cn","inputs","clsx"],"mappings":";;AAGA,MAAMA,IAAUC,EAAiC;AAAA,EAC/C,QAAQ;AAAA,IACN,aAAa;AAAA,MACX,aAAa,CAAC,WAAW;AAAA,IAAA;AAAA;AAAA,IAG3B,wBAAwB;AAAA,MACtB,aAAa,CAAC,UAAU;AAAA,IAAA;AAAA,IAE1B,OAAO;AAAA,MACL,QAAQ,CAAC,UAAU,UAAU,UAAU,QAAQ;AAAA,MAC/C,QAAQ,CAAC,UAAU,UAAU,WAAW;AAAA,MACxC,MAAM,CAAC,KAAK;AAAA,IAAA;AAAA,EACd;AAEJ,CAAC,GAOYC,IAAK,IAAIC,MAAyBH,EAAQI,EAAKD,CAAM,CAAC;"}
+{"version":3,"file":"cn.js","sources":["../../src/utils/cn.ts"],"sourcesContent":["import { clsx, type ClassValue } from 'clsx';\r\nimport { extendTailwindMerge } from 'tailwind-merge';\r\n\r\nconst twMerge = extendTailwindMerge<'sbk-glass'>({\r\n  extend: {\r\n    classGroups: {\r\n      'sbk-glass': ['sbk-glass'],\r\n    },\r\n    // sbk-glass define o próprio fundo: remove bg-* anteriores (ex.: bg-transparent do buttonReset)\r\n    conflictingClassGroups: {\r\n      'sbk-glass': ['bg-color'],\r\n    },\r\n    theme: {\r\n      radius: ['sbk-xs', 'sbk-sm', 'sbk-md', 'sbk-lg'],\r\n      shadow: ['sbk-sm', 'sbk-md', 'sbk-glass'],\r\n      font: ['sbk'],\r\n    },\r\n  },\r\n});\r\n\r\n/**\r\n * Utilitário de composição de classes Tailwind.\r\n * Usa clsx para lógica condicional e tailwind-merge (ciente dos tokens sbk)\r\n * para resolver conflitos, permitindo que o className do consumidor sobrescreva o padrão.\r\n */\r\nexport const cn = (...inputs: ClassValue[]) => twMerge(clsx(inputs));\r\n"],"names":["twMerge","extendTailwindMerge","cn","inputs","clsx"],"mappings":";;AAGA,MAAMA,IAAUC,EAAiC;AAAA,EAC/C,QAAQ;AAAA,IACN,aAAa;AAAA,MACX,aAAa,CAAC,WAAW;AAAA,IAAA;AAAA;AAAA,IAG3B,wBAAwB;AAAA,MACtB,aAAa,CAAC,UAAU;AAAA,IAAA;AAAA,IAE1B,OAAO;AAAA,MACL,QAAQ,CAAC,UAAU,UAAU,UAAU,QAAQ;AAAA,MAC/C,QAAQ,CAAC,UAAU,UAAU,WAAW;AAAA,MACxC,MAAM,CAAC,KAAK;AAAA,IAAA;AAAA,EACd;AAEJ,CAAC,GAOYC,IAAK,IAAIC,MAAyBH,EAAQI,EAAKD,CAAM,CAAC;"}

package/dist/utils/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../src/utils/styles.ts"],"sourcesContent":["/**\n * Fragmentos de classe compartilhados entre componentes.\n * Centralizar aqui garante foco, hover e estados idênticos em toda a lib.\n */\n\n/**\n * Zera o estilo nativo de <button> (fundo, borda, fonte, margem) para que os componentes\n * funcionem mesmo em apps sem reset CSS. Aplique antes das demais classes no cn().\n */\nexport const buttonReset =\n  'm-0 appearance-none border-0 border-solid bg-transparent p-0 font-sbk text-inherit no-underline';\n\n/** Anel de foco visível apenas na navegação por teclado. */\nexport const focusRing =\n  'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sbk-focus focus-visible:outline-solid';\n\n/** Transição padrão de cores, respeitando prefers-reduced-motion. */\nexport const transitionColors =\n  'transition-colors duration-150 ease-out motion-reduce:transition-none';\n\n/** Rótulo de campo de formulário. */\nexport const fieldLabel = 'text-sm font-semibold text-sbk-fg';\n\n/** Controle de formulário (input, select, textarea). */\nexport const fieldControl = [\n  'm-0 w-full rounded-sbk-sm border border-solid border-sbk-line-strong bg-sbk-surface font-sbk font-light text-sbk-fg',\n  'placeholder:text-sbk-fg-muted',\n  'hover:border-sbk-fg-muted',\n  'focus:border-sbk-primary focus:outline-2 focus:outline-offset-0 focus:outline-sbk-focus focus:outline-solid',\n  'disabled:cursor-not-allowed disabled:bg-sbk-surface-sunken disabled:opacity-60',\n  'aria-invalid:border-sbk-error aria-invalid:focus:outline-sbk-error',\n  transitionColors,\n].join(' ');\n\n/** Texto de apoio abaixo do campo. */\nexport const fieldHelper = 'text-xs font-light text-sbk-fg-muted';\n\n/** Mensagem de erro abaixo do campo. */\nexport const fieldError = 'text-xs font-semibold text-sbk-error-fg';\n\n/** Tamanhos de controle de formulário. */\nexport const fieldSize = {\n  sm: 'min-h-8 px-3 py-1.5 text-sm',\n  md: 'min-h-10 px-3.5 py-2 text-base',\n  lg: 'min-h-12 px-4 py-3 text-lg',\n} as const;\n\nexport type FieldSize = keyof typeof fieldSize;\n\n/** Monta o aria-describedby a partir dos ids de erro e de apoio. */\nexport const describedBy = (id: string, error?: string, helperText?: string) =>\n  error ? `${id}-error` : helperText ? `${id}-helper` : undefined;\n\n/**\n * Redefine os tokens de texto e linha para uma superfície invertida (verde escuro no tema claro).\n * Filhos que usam text-sbk-fg, text-sbk-fg-heading ou text-sbk-fg-muted ficam legíveis sem props extras.\n */\nexport const inverseScope = [\n  'bg-sbk-surface-inverse text-sbk-fg-inverse',\n  '[--sbk-color-fg:var(--sbk-color-fg-inverse)]',\n  '[--sbk-color-fg-heading:var(--sbk-color-fg-inverse)]',\n  '[--sbk-color-fg-muted:color-mix(in_srgb,var(--sbk-color-fg-inverse)_72%,transparent)]',\n  '[--sbk-color-line:color-mix(in_srgb,var(--sbk-color-fg-inverse)_18%,transparent)]',\n  '[--sbk-color-surface-hover:color-mix(in_srgb,var(--sbk-color-fg-inverse)_10%,transparent)]',\n  '[--sbk-color-focus:var(--sbk-color-fg-inverse)]',\n].join(' ');\n\n/** Checkbox e radio nativos coloridos com a marca (accent-color). */\nexport const choiceControl =\n  'mt-0.5 size-4 shrink-0 cursor-pointer accent-sbk-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sbk-focus focus-visible:outline-solid disabled:cursor-not-allowed';\n"],"names":["buttonReset","focusRing","transitionColors","fieldLabel","fieldControl","fieldHelper","fieldError","fieldSize","describedBy","id","error","helperText","inverseScope","choiceControl"],"mappings":"AASO,MAAMA,IACX,mGAGWC,IACX,sHAGWC,IACX,yEAGWC,IAAa,qCAGbC,IAAe;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACAF;AACF,EAAE,KAAK,GAAG,GAGGG,IAAc,wCAGdC,IAAa,2CAGbC,IAAY;AAAA,EACvB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAKaC,IAAc,CAACC,GAAYC,GAAgBC,MACtDD,IAAQ,GAAGD,CAAE,WAAWE,IAAa,GAAGF,CAAE,YAAY,QAM3CG,IAAe;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAGGC,IACX;"}
+{"version":3,"file":"styles.js","sources":["../../src/utils/styles.ts"],"sourcesContent":["/**\r\n * Fragmentos de classe compartilhados entre componentes.\r\n * Centralizar aqui garante foco, hover e estados idênticos em toda a lib.\r\n */\r\n\r\n/**\r\n * Zera o estilo nativo de <button> (fundo, borda, fonte, margem) para que os componentes\r\n * funcionem mesmo em apps sem reset CSS. Aplique antes das demais classes no cn().\r\n */\r\nexport const buttonReset =\r\n  'm-0 appearance-none border-0 border-solid bg-transparent p-0 font-sbk text-inherit no-underline';\r\n\r\n/** Anel de foco visível apenas na navegação por teclado. */\r\nexport const focusRing =\r\n  'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sbk-focus focus-visible:outline-solid';\r\n\r\n/** Transição padrão de cores, respeitando prefers-reduced-motion. */\r\nexport const transitionColors =\r\n  'transition-colors duration-150 ease-out motion-reduce:transition-none';\r\n\r\n/** Rótulo de campo de formulário. */\r\nexport const fieldLabel = 'text-sm font-semibold text-sbk-fg';\r\n\r\n/** Controle de formulário (input, select, textarea). */\r\nexport const fieldControl = [\r\n  'm-0 w-full rounded-sbk-sm border border-solid border-sbk-line-strong bg-sbk-surface font-sbk font-light text-sbk-fg',\r\n  'placeholder:text-sbk-fg-muted',\r\n  'hover:border-sbk-fg-muted',\r\n  'focus:border-sbk-primary focus:outline-2 focus:outline-offset-0 focus:outline-sbk-focus focus:outline-solid',\r\n  'disabled:cursor-not-allowed disabled:bg-sbk-surface-sunken disabled:opacity-60',\r\n  'aria-invalid:border-sbk-error aria-invalid:focus:outline-sbk-error',\r\n  transitionColors,\r\n].join(' ');\r\n\r\n/** Texto de apoio abaixo do campo. */\r\nexport const fieldHelper = 'text-xs font-light text-sbk-fg-muted';\r\n\r\n/** Mensagem de erro abaixo do campo. */\r\nexport const fieldError = 'text-xs font-semibold text-sbk-error-fg';\r\n\r\n/** Tamanhos de controle de formulário. */\r\nexport const fieldSize = {\r\n  sm: 'min-h-8 px-3 py-1.5 text-sm',\r\n  md: 'min-h-10 px-3.5 py-2 text-base',\r\n  lg: 'min-h-12 px-4 py-3 text-lg',\r\n} as const;\r\n\r\nexport type FieldSize = keyof typeof fieldSize;\r\n\r\n/** Monta o aria-describedby a partir dos ids de erro e de apoio. */\r\nexport const describedBy = (id: string, error?: string, helperText?: string) =>\r\n  error ? `${id}-error` : helperText ? `${id}-helper` : undefined;\r\n\r\n/**\r\n * Redefine os tokens de texto e linha para uma superfície invertida (verde escuro no tema claro).\r\n * Filhos que usam text-sbk-fg, text-sbk-fg-heading ou text-sbk-fg-muted ficam legíveis sem props extras.\r\n */\r\nexport const inverseScope = [\r\n  'bg-sbk-surface-inverse text-sbk-fg-inverse',\r\n  '[--sbk-color-fg:var(--sbk-color-fg-inverse)]',\r\n  '[--sbk-color-fg-heading:var(--sbk-color-fg-inverse)]',\r\n  '[--sbk-color-fg-muted:color-mix(in_srgb,var(--sbk-color-fg-inverse)_72%,transparent)]',\r\n  '[--sbk-color-line:color-mix(in_srgb,var(--sbk-color-fg-inverse)_18%,transparent)]',\r\n  '[--sbk-color-surface-hover:color-mix(in_srgb,var(--sbk-color-fg-inverse)_10%,transparent)]',\r\n  '[--sbk-color-focus:var(--sbk-color-fg-inverse)]',\r\n].join(' ');\r\n\r\n/** Checkbox e radio nativos coloridos com a marca (accent-color). */\r\nexport const choiceControl =\r\n  'mt-0.5 size-4 shrink-0 cursor-pointer accent-sbk-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sbk-focus focus-visible:outline-solid disabled:cursor-not-allowed';\r\n"],"names":["buttonReset","focusRing","transitionColors","fieldLabel","fieldControl","fieldHelper","fieldError","fieldSize","describedBy","id","error","helperText","inverseScope","choiceControl"],"mappings":"AASO,MAAMA,IACX,mGAGWC,IACX,sHAGWC,IACX,yEAGWC,IAAa,qCAGbC,IAAe;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACAF;AACF,EAAE,KAAK,GAAG,GAGGG,IAAc,wCAGdC,IAAa,2CAGbC,IAAY;AAAA,EACvB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAKaC,IAAc,CAACC,GAAYC,GAAgBC,MACtDD,IAAQ,GAAGD,CAAE,WAAWE,IAAa,GAAGF,CAAE,YAAY,QAM3CG,IAAe;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAGGC,IACX;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sbkbs/ui",
-  "version": "2.0.0-beta.0",
+  "version": "2.0.0",
   "description": "Design system SBK (Brand Book 2026): componentes React, tokens e preset Tailwind CSS v4",
   "type": "module",
   "main": "./dist/index.cjs",