@selectwin/kit 0.1.193 → 0.1.195
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 +47 -47
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,47 +1,47 @@
|
|
|
1
|
-
# @selectwin/kit
|
|
2
|
-
|
|
3
|
-
Design system da Selectwin — primitivos React, charts SVG (sem dependência de biblioteca de
|
|
4
|
-
gráficos) e tokens CSS, theme-aware (light/dark).
|
|
5
|
-
|
|
6
|
-
Uso interno da Selectwin. Publicado no npm para facilitar a distribuição entre os apps da casa;
|
|
7
|
-
não há suporte, documentação pública nem garantia de estabilidade de API para terceiros.
|
|
8
|
-
|
|
9
|
-
## Uso
|
|
10
|
-
|
|
11
|
-
```bash
|
|
12
|
-
npm i @selectwin/kit
|
|
13
|
-
```
|
|
14
|
-
|
|
15
|
-
```tsx
|
|
16
|
-
import '@selectwin/kit/styles.css'; // tokens + estilos (uma vez, no root)
|
|
17
|
-
import { SelectButton, SelectSection } from '@selectwin/kit';
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
Idioma (0.1.187): os textos próprios do kit ("Página anterior", "Mais filtros", "Fechar"…) e os números que ele
|
|
21
|
-
formata saem em português. Para inglês, envolva o app no `SelectLocaleProvider`:
|
|
22
|
-
|
|
23
|
-
```tsx
|
|
24
|
-
import { SelectLocaleProvider } from '@selectwin/kit';
|
|
25
|
-
|
|
26
|
-
<SelectLocaleProvider locale="en">{app}</SelectLocaleProvider>; // 'pt-BR' | 'en'
|
|
27
|
-
```
|
|
28
|
-
|
|
29
|
-
A prop de texto do componente (`confirmLabel`, `noun`…) sempre ganha do dicionário.
|
|
30
|
-
|
|
31
|
-
Tom corporativo (0.1.188; arredondado suave no botão desde a 0.1.192
|
|
32
|
-
0.
|
|
33
|
-
(`--select-radius-sm`); pílula só em selo. Rótulos de KPI
|
|
34
|
-
e cabeçalho de tabela em caixa-alta espaçada. Nos gráficos, cor é situação: verde `--select-chart-paid` = pago, dourado
|
|
35
|
-
`--select-chart-pending` (+ `-edge`) = pendente, `--select-chart-compare` = o período anterior, e os cinzas
|
|
36
|
-
`--select-chart-ramp-1..4` para categoria. O app que quer o visual antigo sobrescreve esses tokens.
|
|
37
|
-
|
|
38
|
-
Peer deps: **react**, **react-dom** (obrigatórios); **gsap** (opcional — só componentes animados),
|
|
39
|
-
**react-router-dom** (opcional). Tematização = sobrescrever os tokens CSS `--select-*` / `--sw-*`.
|
|
40
|
-
|
|
41
|
-
## Build
|
|
42
|
-
|
|
43
|
-
```bash
|
|
44
|
-
npm run build # → dist/index.js (ESM) + dist/style.css + dist/index.d.ts
|
|
45
|
-
```
|
|
46
|
-
|
|
47
|
-
`npm publish` roda `prepublishOnly` (= build) e publica só `dist/` (sem sourcemaps).
|
|
1
|
+
# @selectwin/kit
|
|
2
|
+
|
|
3
|
+
Design system da Selectwin — primitivos React, charts SVG (sem dependência de biblioteca de
|
|
4
|
+
gráficos) e tokens CSS, theme-aware (light/dark).
|
|
5
|
+
|
|
6
|
+
Uso interno da Selectwin. Publicado no npm para facilitar a distribuição entre os apps da casa;
|
|
7
|
+
não há suporte, documentação pública nem garantia de estabilidade de API para terceiros.
|
|
8
|
+
|
|
9
|
+
## Uso
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
npm i @selectwin/kit
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
```tsx
|
|
16
|
+
import '@selectwin/kit/styles.css'; // tokens + estilos (uma vez, no root)
|
|
17
|
+
import { SelectButton, SelectSection } from '@selectwin/kit';
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
Idioma (0.1.187): os textos próprios do kit ("Página anterior", "Mais filtros", "Fechar"…) e os números que ele
|
|
21
|
+
formata saem em português. Para inglês, envolva o app no `SelectLocaleProvider`:
|
|
22
|
+
|
|
23
|
+
```tsx
|
|
24
|
+
import { SelectLocaleProvider } from '@selectwin/kit';
|
|
25
|
+
|
|
26
|
+
<SelectLocaleProvider locale="en">{app}</SelectLocaleProvider>; // 'pt-BR' | 'en'
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
A prop de texto do componente (`confirmLabel`, `noun`…) sempre ganha do dicionário.
|
|
30
|
+
|
|
31
|
+
Tom corporativo (0.1.188; arredondado suave no botão desde a 0.1.192, em tudo desde a 0.1.193 e bem suave desde a
|
|
32
|
+
0.1.195): campo e botão com 1rem (`--select-radius`, `--select-radius-button`), card 1.5rem, caixa de dentro e menu
|
|
33
|
+
1rem, item de menu 0.75rem (`--select-radius-sm`); pílula só em selo. Rótulos de KPI
|
|
34
|
+
e cabeçalho de tabela em caixa-alta espaçada. Nos gráficos, cor é situação: verde `--select-chart-paid` = pago, dourado
|
|
35
|
+
`--select-chart-pending` (+ `-edge`) = pendente, `--select-chart-compare` = o período anterior, e os cinzas
|
|
36
|
+
`--select-chart-ramp-1..4` para categoria. O app que quer o visual antigo sobrescreve esses tokens.
|
|
37
|
+
|
|
38
|
+
Peer deps: **react**, **react-dom** (obrigatórios); **gsap** (opcional — só componentes animados),
|
|
39
|
+
**react-router-dom** (opcional). Tematização = sobrescrever os tokens CSS `--select-*` / `--sw-*`.
|
|
40
|
+
|
|
41
|
+
## Build
|
|
42
|
+
|
|
43
|
+
```bash
|
|
44
|
+
npm run build # → dist/index.js (ESM) + dist/style.css + dist/index.d.ts
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
`npm publish` roda `prepublishOnly` (= build) e publica só `dist/` (sem sourcemaps).
|