@wellingtonhlc/shared-ui 0.24.1 → 0.24.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -55,6 +55,10 @@ Nao inclua:
55
55
 
56
56
  | Comando | Uso |
57
57
  |---------|-----|
58
+ | `npm run typecheck` | Valida tipos sem emitir arquivos. |
59
+ | `npm run test` | Executa testes de contrato e acessibilidade com Vitest, Testing Library e axe. |
60
+ | `npm run check:storybook-static` | Confere se o Storybook estatico gerado possui artefatos e stories publicas. |
61
+ | `npm run check` | Gate local completo: typecheck, testes, build, Storybook, smoke do Storybook estatico e `npm pack --dry-run`. |
58
62
  | `npm run build` | Compila TypeScript e copia assets para `dist`. |
59
63
  | `npm run prepack` | Executado automaticamente antes de empacotar/publicar. |
60
64
  | `npm run storybook` | Sobe o Storybook local. |
@@ -74,8 +78,22 @@ Antes de publicar ou consumir localmente uma alteracao visual, gere tambem a bui
74
78
 
75
79
  ```bash
76
80
  npm run build-storybook
81
+ npm run check:storybook-static
77
82
  ```
78
83
 
84
+ ## Qualidade publica
85
+
86
+ Todo export publico deve ter pelo menos uma destas evidencias:
87
+
88
+ - teste de contrato observavel em `tests/`;
89
+ - story em `stories/` cobrindo uso real, estados e variantes;
90
+ - justificativa explicita na spec/PR quando o export for puramente auxiliar.
91
+
92
+ Componentes interativos devem preservar acessibilidade verificavel: labels, roles, atributos
93
+ `aria-*`, estado `disabled`/`loading`/`selected` quando aplicavel, foco e callbacks publicos.
94
+ O gate `npm run test` inclui axe em composicoes representativas e nao deve ser burlado com
95
+ snapshots de classe completa.
96
+
79
97
  ## Exportacoes
80
98
 
81
99
  Entrada principal:
@@ -84,6 +102,14 @@ Entrada principal:
84
102
  import { Button, Card, Modal, Table, cn } from '@wellingtonhlc/shared-ui';
85
103
  ```
86
104
 
105
+ Subpaths recomendados para telas grandes ou rotas lazy-loaded:
106
+
107
+ ```tsx
108
+ import { Button } from '@wellingtonhlc/shared-ui/components/Button';
109
+ import { Table } from '@wellingtonhlc/shared-ui/components/Table';
110
+ import { cn } from '@wellingtonhlc/shared-ui/utils/cn';
111
+ ```
112
+
87
113
  Estilos:
88
114
 
89
115
  ```tsx
@@ -106,7 +132,7 @@ Componentes disponiveis na API publica:
106
132
  | Acoes | `Button`, `ActionPrimitives`, `AppShellActions`, `ConfirmationDialog` |
107
133
  | Feedback | `Badge`, `EmptyState`, `PageMessage`, `Tooltip`, `CopyableField` |
108
134
  | Formularios | `FieldControl`, `FieldGroup`, `TextField`, `TextareaField`, `SelectField`, `DateField`, `DecimalField`, `MultiSelectField`, `PasswordInput`, `Switch`, `RadioGroup` |
109
- | Consulta | `Filter` |
135
+ | Consulta | `Filter`, `Workspace` |
110
136
  | Dados | `Table`, `Pagination`, `TabsUnderlined` |
111
137
  | Controle de renderizacao | `RenderIf`, `RenderCase` |
112
138
  | Tema | `ThemePreferencesSelector` |
@@ -187,7 +213,21 @@ Padrões do painel:
187
213
  - Use `Filter.Footer` para manter botões sempre visíveis no rodapé do painel.
188
214
  - Em telas administrativas, campos internos devem preferir `size="sm"` e não devem usar formato `rounded-full`.
189
215
 
190
- ## Contrato público 0.1.0
216
+ ## Contrato publico atual
217
+
218
+ O pacote oficial e `@wellingtonhlc/shared-ui`, publicado no npm publico (`https://registry.npmjs.org/`).
219
+ Ele deve permanecer generico: componentes visuais, utilitarios, tokens, estilos e preset Tailwind.
220
+
221
+ Fora do contrato publico:
222
+
223
+ - regra de negocio;
224
+ - services HTTP;
225
+ - rotas;
226
+ - permissoes;
227
+ - schemas de dominio;
228
+ - textos ou fluxos especificos de CRM, licencas, pagamentos, suporte, relatorios ou clientes.
229
+
230
+ ## Contrato publico 0.1.0
191
231
 
192
232
  A API pública pré-v1 foi limpa para evitar compatibilidade artificial em produção.
193
233
 
@@ -226,6 +266,9 @@ Tabela de historico:
226
266
 
227
267
  | Versao | Data | Tipo | Resumo | Validacao |
228
268
  |--------|------|------|--------|-----------|
269
+ | `0.24.3` | 2026-06-18 | Patch | Amplia testes de contrato para exports publicos, adiciona gate axe e smoke do Storybook estatico ao `check`. | `npm run test`; `npm run check`. |
270
+ | `0.24.2` | 2026-06-18 | Patch | Alinha metadados e documentacao do pacote npm publico, mantendo o contrato generico e sem regra de negocio. | `npm run build`; `npm run build-storybook`; `npm pack --dry-run`. |
271
+ | `0.24.0` | 2026-06-17 | Minor pre-v1 | Adiciona `Workspace` e corrige a composicao de `Filter` para consultas com painel de filtros e area de resultados. | `npm run build`; build do `EloDesk.CRM`. |
229
272
  | `0.21.0` | 2026-06-17 | Minor pre-v1 | Adiciona stories para `Modal`, `Card`, `PageMessage`, `EmptyState`, `StatCard`, `SelectField`, `TextareaField`, `DateField`, `DecimalField`, `RadioGroup`, `MultiSelectField`, `TabsUnderlined`, `Tooltip`, `CopyableField`, `FieldGroup`, `FieldSkeleton`, `FieldValidationError`, `NavCard`, `Sidebar` e `AppShell`. | `npm run build`; `npm run build-storybook`. |
230
273
  | `0.1.17` | 2026-06-16 | Minor pre-v1 | Remove a variante ambigua `default` de `Button`; adiciona variants semanticas `information` e `warning`; `ConfirmationDialog` usa `information`, `question`, `warning` e `destructive` com botao principal na cor da variant; Storybook passou a gerar tokens semanticos de tema. | `npm run build`; `npm run build-storybook`; builds do `EloDesk.CRM` e `EloDesk.CRM.Portal`. |
231
274
  | `0.1.16` | 2026-06-16 | Patch | Consolida os ajustes visuais recentes do pacote para consumo no `EloDesk.CRM`. | `npm run build`; `npm run build-storybook`; validacao no `EloDesk.CRM`. |
@@ -254,9 +297,10 @@ Ao criar uma nova versao:
254
297
 
255
298
  1. Atualize `package.json`.
256
299
  2. Atualize esta tabela com versao, data, tipo, resumo e validacao.
257
- 3. Rode `npm run build`.
258
- 4. Publique com `npm publish`.
259
- 5. Atualize os consumidores afetados.
300
+ 3. Rode `npm run check`.
301
+ 4. Rode `npm pack --dry-run` e revise o conteudo do pacote.
302
+ 5. Publique com `npm publish --access public --registry=https://registry.npmjs.org/`.
303
+ 6. Atualize os consumidores afetados.
260
304
 
261
305
  ## Publicacao
262
306
 
@@ -264,13 +308,15 @@ Publicacao npm:
264
308
 
265
309
  ```bash
266
310
  npm run build
267
- npm publish
311
+ npm run check
312
+ npm pack --dry-run
313
+ npm publish --access public --registry=https://registry.npmjs.org/
268
314
  ```
269
315
 
270
316
  Quando o npm exigir OTP:
271
317
 
272
318
  ```bash
273
- npm publish --otp CODIGO_OTP
319
+ npm publish --access public --registry=https://registry.npmjs.org/ --otp CODIGO_OTP
274
320
  ```
275
321
 
276
322
  Depois de publicar, atualize os consumidores:
@@ -4,6 +4,13 @@ export type BadgeSize = 'xs' | 'sm' | 'md';
4
4
  export interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
5
5
  variant?: BadgeVariant | string;
6
6
  size?: BadgeSize;
7
+ /**
8
+ * Permite que o conteudo quebre em multiplas linhas quando nao couber na largura
9
+ * disponivel. Por padrao o badge fica em linha unica (`inline-flex` + `whitespace-nowrap`),
10
+ * adequado a status curtos; com `wrap` vira `inline-block` e quebra palavras longas,
11
+ * util para valores longos (ex.: auditoria).
12
+ */
13
+ wrap?: boolean;
7
14
  }
8
15
  export declare const Badge: import("react").ForwardRefExoticComponent<BadgeProps & import("react").RefAttributes<HTMLSpanElement>>;
9
16
  //# sourceMappingURL=Badge.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAIxD,MAAM,MAAM,YAAY,GACpB,SAAS,GACT,SAAS,GACT,SAAS,GACT,SAAS,GACT,MAAM,GACN,QAAQ,GACR,OAAO,CAAC;AAEZ,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE3C,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,eAAe,CAAC;IACjE,OAAO,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAChC,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AA+BD,eAAO,MAAM,KAAK,wGAoBjB,CAAC"}
1
+ {"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAIxD,MAAM,MAAM,YAAY,GACpB,SAAS,GACT,SAAS,GACT,SAAS,GACT,SAAS,GACT,MAAM,GACN,QAAQ,GACR,OAAO,CAAC;AAEZ,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE3C,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,eAAe,CAAC;IACjE,OAAO,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAChC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AA+BD,eAAO,MAAM,KAAK,wGAuBjB,CAAC"}
@@ -24,11 +24,13 @@ const sizeClasses = {
24
24
  sm: 'px-2.5 py-1 text-sm',
25
25
  md: 'px-3 py-1 text-base',
26
26
  };
27
- export const Badge = forwardRef(({ className, size = 'xs', variant = 'default', ...props }, ref) => {
27
+ export const Badge = forwardRef(({ className, size = 'xs', variant = 'default', wrap = false, ...props }, ref) => {
28
28
  const normalizedVariant = variant.toLowerCase();
29
29
  const normalizedAlias = variantAlias[normalizedVariant] ?? normalizedVariant;
30
30
  const knownVariant = normalizedAlias;
31
31
  const variantClass = variantClasses[knownVariant] ?? normalizedVariant;
32
- return (_jsx("span", { ref: ref, className: cn('inline-flex items-center gap-1.5 whitespace-nowrap rounded-full border font-medium leading-none', variantClass, sizeClasses[size], className), ...props }));
32
+ return (_jsx("span", { ref: ref, className: cn('rounded-full border font-medium', wrap
33
+ ? 'inline-block whitespace-normal break-words [overflow-wrap:anywhere] leading-snug'
34
+ : 'inline-flex items-center gap-1.5 whitespace-nowrap leading-none', variantClass, sizeClasses[size], className), ...props }));
33
35
  });
34
36
  Badge.displayName = 'Badge';
package/dist/styles.css CHANGED
@@ -1041,6 +1041,9 @@ h2.react-datepicker__current-month {
1041
1041
  .inline {
1042
1042
  display: inline;
1043
1043
  }
1044
+ .inline-block {
1045
+ display: inline-block;
1046
+ }
1044
1047
  .inline-flex {
1045
1048
  display: inline-flex;
1046
1049
  }
@@ -2194,9 +2197,18 @@ h2.react-datepicker__current-month {
2194
2197
  --tw-tracking: var(--tracking-wide);
2195
2198
  letter-spacing: var(--tracking-wide);
2196
2199
  }
2200
+ .\[overflow-wrap\:anywhere\] {
2201
+ overflow-wrap: anywhere;
2202
+ }
2203
+ .break-words {
2204
+ overflow-wrap: break-word;
2205
+ }
2197
2206
  .text-ellipsis {
2198
2207
  text-overflow: ellipsis;
2199
2208
  }
2209
+ .whitespace-normal {
2210
+ white-space: normal;
2211
+ }
2200
2212
  .whitespace-nowrap {
2201
2213
  white-space: nowrap;
2202
2214
  }
@@ -3491,6 +3503,16 @@ h2.react-datepicker__current-month {
3491
3503
  gap: calc(var(--spacing) * 4);
3492
3504
  }
3493
3505
  }
3506
+ .md\:text-center {
3507
+ @media (width >= 48rem) {
3508
+ text-align: center;
3509
+ }
3510
+ }
3511
+ .md\:text-left {
3512
+ @media (width >= 48rem) {
3513
+ text-align: left;
3514
+ }
3515
+ }
3494
3516
  .md\:text-\[0\.8125rem\] {
3495
3517
  @media (width >= 48rem) {
3496
3518
  font-size: 0.8125rem;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wellingtonhlc/shared-ui",
3
- "version": "0.24.1",
3
+ "version": "0.24.3",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -11,7 +11,7 @@
11
11
  ],
12
12
  "repository": {
13
13
  "type": "git",
14
- "url": "git+https://github.com/Wellington-Henrique/EurekaCRM.Shared.UI.git"
14
+ "url": "git+https://github.com/Wellington-Henrique/EloDesk.CRM.Shared.UI.git"
15
15
  },
16
16
  "publishConfig": {
17
17
  "registry": "https://registry.npmjs.org/"
@@ -38,6 +38,11 @@
38
38
  "scripts": {
39
39
  "build": "node scripts/clean-dist.mjs && tsc -p tsconfig.json && node scripts/copy-assets.mjs",
40
40
  "prepack": "npm run build",
41
+ "typecheck": "tsc -p tsconfig.json --noEmit",
42
+ "test": "vitest run",
43
+ "test:watch": "vitest",
44
+ "check:storybook-static": "node scripts/check-storybook-static.mjs",
45
+ "check": "npm run typecheck && npm run test && npm run build && npm run build-storybook && npm run check:storybook-static && npm pack --dry-run",
41
46
  "storybook": "storybook dev -p 6006",
42
47
  "build-storybook": "storybook build"
43
48
  },
@@ -50,15 +55,22 @@
50
55
  "@storybook/addon-docs": "^10.4.6",
51
56
  "@storybook/react-vite": "^10.4.6",
52
57
  "@tailwindcss/postcss": "4.1.10",
58
+ "@testing-library/jest-dom": "^6.9.1",
59
+ "@testing-library/react": "^16.3.2",
60
+ "@testing-library/user-event": "^14.6.1",
53
61
  "@types/react": "^19.1.2",
54
62
  "@types/react-dom": "^19.1.2",
55
63
  "autoprefixer": "^10.5.0",
64
+ "axe-core": "^4.12.1",
65
+ "jsdom": "^29.1.1",
56
66
  "lucide-react": "^0.522.0",
57
67
  "postcss": "^8.5.15",
58
68
  "storybook": "^10.4.6",
59
69
  "tailwindcss": "4.1.10",
60
70
  "typescript": "~5.8.3",
61
- "vite": "^8.0.16"
71
+ "vite": "^8.0.16",
72
+ "vitest": "^4.1.9",
73
+ "vitest-axe": "^0.1.0"
62
74
  },
63
75
  "dependencies": {
64
76
  "@radix-ui/react-dialog": "^1.1.16",