@selectwin/kit 0.1.200 → 0.1.202
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/dist/SelectDocumentField.d.ts +1 -1
- package/dist/SelectDocumentField.js +5 -1
- package/dist/SelectFeeBreakdown.js +43 -40
- package/dist/SelectField.d.ts +3 -2
- package/dist/SelectField.js +1 -1
- package/dist/SelectLocale.d.ts +7 -0
- package/dist/SelectLocale.js +14 -2
- package/dist/SelectMoney.js +71 -64
- package/dist/SelectRadioGroup.d.ts +20 -1
- package/dist/SelectRadioGroup.js +49 -40
- package/dist/SelectSearchInput.d.ts +2 -0
- package/dist/SelectSearchInput.js +8 -8
- package/dist/SelectSelect.d.ts +1 -1
- package/dist/SelectSelect.js +1 -1
- package/dist/SelectTextarea.d.ts +1 -1
- package/dist/SelectTextarea.js +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +183 -183
- package/dist/internal/document.d.ts +5 -6
- package/dist/internal/document.js +10 -9
- package/dist/internal/money.d.ts +5 -4
- package/dist/internal/money.js +12 -8
- package/dist/style.css +1 -1
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export declare function SelectDocumentField({ label, value, onChange, hint, error, onBlur, required, name, }: {
|
|
2
2
|
label?: string;
|
|
3
|
-
/**
|
|
3
|
+
/** O valor limpo, sem a máscara: os dígitos e, no CNPJ alfanumérico, as letras em maiúsculas. */
|
|
4
4
|
value: string;
|
|
5
5
|
onChange: (clean: string) => void;
|
|
6
6
|
hint?: string;
|
|
@@ -8,7 +8,11 @@ function a({ label: a = "CPF/CNPJ", value: o, onChange: s, hint: c, error: l, on
|
|
|
8
8
|
label: a,
|
|
9
9
|
value: r(o),
|
|
10
10
|
onChange: (e) => s(t(e)),
|
|
11
|
-
inputMode: "
|
|
11
|
+
inputMode: "text",
|
|
12
|
+
inputProps: {
|
|
13
|
+
autoCapitalize: "characters",
|
|
14
|
+
spellCheck: !1
|
|
15
|
+
},
|
|
12
16
|
autoComplete: "off",
|
|
13
17
|
maxLength: 18,
|
|
14
18
|
hint: l ? void 0 : c ?? (p || void 0),
|
|
@@ -1,88 +1,91 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
1
|
+
import { useSelectLocale as e, useSelectMessages as t } from "./SelectLocale.js";
|
|
2
|
+
import { SelectMoney as n } from "./SelectMoney.js";
|
|
3
|
+
import { forwardRef as r } from "react";
|
|
4
|
+
import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
|
|
4
5
|
//#region src/SelectFeeBreakdown.tsx
|
|
5
|
-
var
|
|
6
|
-
let
|
|
7
|
-
return /* @__PURE__ */
|
|
8
|
-
ref:
|
|
9
|
-
...
|
|
10
|
-
className: `select-fees${
|
|
6
|
+
var s = r(function({ grossCents: r, fees: s, netCents: c, grossLabel: l, netLabel: u, bar: d = !1, barLabel: f, className: p, ...m }, h) {
|
|
7
|
+
let g = t().fees, _ = e(), v = l ?? g.gross, y = u ?? g.net, b = c ?? r - s.reduce((e, t) => e + t.cents, 0), x = Math.max(0, r - b), S = d && r > 0 && b >= 0, C = r > 0 ? x / r * 100 : 0;
|
|
8
|
+
return /* @__PURE__ */ o("div", {
|
|
9
|
+
ref: h,
|
|
10
|
+
...m,
|
|
11
|
+
className: `select-fees${S ? " select-fees--bar" : ""}${p ? " " + p : ""}`,
|
|
11
12
|
children: [
|
|
12
|
-
|
|
13
|
+
S && /* @__PURE__ */ o("div", {
|
|
13
14
|
className: "select-fees__visual",
|
|
14
|
-
children: [/* @__PURE__ */
|
|
15
|
+
children: [/* @__PURE__ */ o("div", {
|
|
15
16
|
className: "select-fees__bar",
|
|
16
17
|
"aria-hidden": "true",
|
|
17
|
-
children: [/* @__PURE__ */
|
|
18
|
+
children: [/* @__PURE__ */ a("span", {
|
|
18
19
|
className: "select-fees__barnet",
|
|
19
|
-
style: { flexGrow:
|
|
20
|
-
children: /* @__PURE__ */
|
|
20
|
+
style: { flexGrow: b },
|
|
21
|
+
children: /* @__PURE__ */ a("span", {
|
|
21
22
|
className: "select-fees__barlabel",
|
|
22
|
-
children:
|
|
23
|
-
|
|
23
|
+
children: f ?? /* @__PURE__ */ o(i, { children: [
|
|
24
|
+
y,
|
|
24
25
|
" · ",
|
|
25
|
-
/* @__PURE__ */
|
|
26
|
+
/* @__PURE__ */ a(n, { cents: b })
|
|
26
27
|
] })
|
|
27
28
|
})
|
|
28
|
-
}),
|
|
29
|
+
}), x > 0 && /* @__PURE__ */ a("span", {
|
|
29
30
|
className: "select-fees__barfee",
|
|
30
|
-
style: { flexGrow:
|
|
31
|
+
style: { flexGrow: x }
|
|
31
32
|
})]
|
|
32
|
-
}), /* @__PURE__ */
|
|
33
|
+
}), /* @__PURE__ */ o("div", {
|
|
33
34
|
className: "select-fees__legend",
|
|
34
|
-
children: [
|
|
35
|
+
children: [x > 0 && /* @__PURE__ */ o("span", {
|
|
35
36
|
className: "select-fees__legenditem",
|
|
36
37
|
children: [
|
|
37
|
-
/* @__PURE__ */
|
|
38
|
+
/* @__PURE__ */ a("span", {
|
|
38
39
|
className: "select-fees__dot select-fees__dot--fee",
|
|
39
40
|
"aria-hidden": "true"
|
|
40
41
|
}),
|
|
41
|
-
|
|
42
|
-
|
|
42
|
+
g.fees,
|
|
43
|
+
" ",
|
|
44
|
+
/* @__PURE__ */ a(n, { cents: x }),
|
|
43
45
|
" (",
|
|
44
|
-
|
|
46
|
+
C.toLocaleString(_ === "en" ? "en-US" : "pt-BR", {
|
|
45
47
|
maximumFractionDigits: 1,
|
|
46
48
|
minimumFractionDigits: 1
|
|
47
49
|
}),
|
|
48
50
|
"%)"
|
|
49
51
|
]
|
|
50
|
-
}), /* @__PURE__ */
|
|
52
|
+
}), /* @__PURE__ */ o("span", {
|
|
51
53
|
className: "select-fees__legenditem",
|
|
52
54
|
children: [
|
|
53
|
-
/* @__PURE__ */
|
|
55
|
+
/* @__PURE__ */ a("span", {
|
|
54
56
|
className: "select-fees__dot select-fees__dot--net",
|
|
55
57
|
"aria-hidden": "true"
|
|
56
58
|
}),
|
|
57
|
-
|
|
58
|
-
|
|
59
|
+
g.netShort,
|
|
60
|
+
" ",
|
|
61
|
+
/* @__PURE__ */ a(n, { cents: b })
|
|
59
62
|
]
|
|
60
63
|
})]
|
|
61
64
|
})]
|
|
62
65
|
}),
|
|
63
|
-
/* @__PURE__ */
|
|
66
|
+
/* @__PURE__ */ o("div", {
|
|
64
67
|
className: "select-fees__row",
|
|
65
|
-
children: [/* @__PURE__ */
|
|
68
|
+
children: [/* @__PURE__ */ a("span", { children: v }), /* @__PURE__ */ a("span", { children: /* @__PURE__ */ a(n, { cents: r }) })]
|
|
66
69
|
}),
|
|
67
|
-
|
|
70
|
+
s.map((e) => /* @__PURE__ */ o("div", {
|
|
68
71
|
className: "select-fees__row",
|
|
69
|
-
children: [/* @__PURE__ */
|
|
72
|
+
children: [/* @__PURE__ */ a("span", { children: e.label }), /* @__PURE__ */ o("span", {
|
|
70
73
|
className: "select-fees__neg",
|
|
71
|
-
children: ["−\xA0", /* @__PURE__ */
|
|
74
|
+
children: ["−\xA0", /* @__PURE__ */ a(n, { cents: e.cents })]
|
|
72
75
|
})]
|
|
73
|
-
},
|
|
74
|
-
/* @__PURE__ */
|
|
75
|
-
/* @__PURE__ */
|
|
76
|
+
}, e.label)),
|
|
77
|
+
/* @__PURE__ */ a("div", { className: "select-fees__divider" }),
|
|
78
|
+
/* @__PURE__ */ o("div", {
|
|
76
79
|
className: "select-fees__row select-fees__row--net",
|
|
77
|
-
children: [/* @__PURE__ */
|
|
80
|
+
children: [/* @__PURE__ */ a("span", { children: y }), /* @__PURE__ */ a("span", {
|
|
78
81
|
className: "select-fees__netvalue",
|
|
79
|
-
children: /* @__PURE__ */
|
|
82
|
+
children: /* @__PURE__ */ a(n, { cents: b })
|
|
80
83
|
})]
|
|
81
84
|
})
|
|
82
85
|
]
|
|
83
86
|
});
|
|
84
87
|
});
|
|
85
88
|
//#endregion
|
|
86
|
-
export {
|
|
89
|
+
export { s as SelectFeeBreakdown };
|
|
87
90
|
|
|
88
91
|
//# sourceMappingURL=SelectFeeBreakdown.js.map
|
package/dist/SelectField.d.ts
CHANGED
|
@@ -19,9 +19,10 @@ export declare function charCount(value: string, maxLength: number | undefined):
|
|
|
19
19
|
export declare function withCount(action: ReactNode, count: ReactNode): ReactNode;
|
|
20
20
|
/**
|
|
21
21
|
* Os atributos nativos do `<input>` que o campo repassa (0.1.198): `inputMode`, `spellCheck`, `form`, `pattern`,
|
|
22
|
-
* `aria-*`, `data-*`, os eventos… Os que o campo controla (o valor, o tipo, o id
|
|
22
|
+
* `aria-*`, `data-*`, os eventos… Os que o campo controla (o valor, o tipo, o id) ficam de fora. 0.1.202: o `className`
|
|
23
|
+
* SOMA às classes do `<input>` (a tela que pede a fonte larga de um código, o texto menor), sem tirar as do kit.
|
|
23
24
|
*/
|
|
24
|
-
export type SelectNativeInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange' | 'type' | 'id' | '
|
|
25
|
+
export type SelectNativeInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange' | 'type' | 'id' | 'size' | 'prefix'>;
|
|
25
26
|
export interface SelectFieldProps {
|
|
26
27
|
/** Field label. Omit when an outer row already labels the field. 0.1.198: aceita um nó. */
|
|
27
28
|
label?: ReactNode;
|
package/dist/SelectField.js
CHANGED
|
@@ -72,7 +72,7 @@ var v = u(function({ label: e, value: a, onChange: l, type: u = "text", labelAct
|
|
|
72
72
|
...Z,
|
|
73
73
|
ref: R,
|
|
74
74
|
id: W,
|
|
75
|
-
className: `select-input${K ? " select-input--has-suffix" : ""}${J ? " select-input--has-stepper" : ""}${ee ? " select-input--mono" : ""}${C ? " select-input--error" : ""}`,
|
|
75
|
+
className: `select-input${K ? " select-input--has-suffix" : ""}${J ? " select-input--has-stepper" : ""}${ee ? " select-input--mono" : ""}${C ? " select-input--error" : ""}${L != null && L.className ? " " + L.className : ""}`,
|
|
76
76
|
type: de,
|
|
77
77
|
value: a,
|
|
78
78
|
onChange: (e) => l(e.target.value, e),
|
package/dist/SelectLocale.d.ts
CHANGED
|
@@ -75,6 +75,13 @@ export interface SelectKitMessages {
|
|
|
75
75
|
sideNav: {
|
|
76
76
|
pending: (hint: string) => string;
|
|
77
77
|
};
|
|
78
|
+
/** 0.1.201: o SelectFeeBreakdown — os rótulos de sempre e a legenda da barra. */
|
|
79
|
+
fees: {
|
|
80
|
+
gross: string;
|
|
81
|
+
net: string;
|
|
82
|
+
fees: string;
|
|
83
|
+
netShort: string;
|
|
84
|
+
};
|
|
78
85
|
}
|
|
79
86
|
/** Os dicionários do kit, para quem quer conferir ou montar um texto do mesmo jeito. */
|
|
80
87
|
export declare const selectKitMessages: Readonly<Record<SelectLocaleCode, SelectKitMessages>>;
|
package/dist/SelectLocale.js
CHANGED
|
@@ -80,7 +80,13 @@ var r = {
|
|
|
80
80
|
progressLabel: "Progresso",
|
|
81
81
|
progress: (e, t) => `${e} de ${t}`
|
|
82
82
|
},
|
|
83
|
-
sideNav: { pending: (e) => `${e} (com pendências)` }
|
|
83
|
+
sideNav: { pending: (e) => `${e} (com pendências)` },
|
|
84
|
+
fees: {
|
|
85
|
+
gross: "Valor bruto",
|
|
86
|
+
net: "Valor líquido",
|
|
87
|
+
fees: "Taxas",
|
|
88
|
+
netShort: "Líquido"
|
|
89
|
+
}
|
|
84
90
|
},
|
|
85
91
|
en: {
|
|
86
92
|
common: {
|
|
@@ -161,7 +167,13 @@ var r = {
|
|
|
161
167
|
progressLabel: "Progress",
|
|
162
168
|
progress: (e, t) => `${e} of ${t}`
|
|
163
169
|
},
|
|
164
|
-
sideNav: { pending: (e) => `${e} (pending)` }
|
|
170
|
+
sideNav: { pending: (e) => `${e} (pending)` },
|
|
171
|
+
fees: {
|
|
172
|
+
gross: "Gross amount",
|
|
173
|
+
net: "Net amount",
|
|
174
|
+
fees: "Fees",
|
|
175
|
+
netShort: "Net"
|
|
176
|
+
}
|
|
165
177
|
}
|
|
166
178
|
}, i = e(null);
|
|
167
179
|
function a({ locale: e, children: t }) {
|
package/dist/SelectMoney.js
CHANGED
|
@@ -1,28 +1,29 @@
|
|
|
1
1
|
/* empty css */
|
|
2
2
|
import { EyeIcon as e, EyeOffIcon as t } from "./icons.js";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
3
|
+
import { useSelectLocale as n } from "./SelectLocale.js";
|
|
4
|
+
import { SelectIconButton as r } from "./SelectIconButton.js";
|
|
5
|
+
import { centsToBRL as i } from "./internal/money.js";
|
|
6
|
+
import { createContext as a, forwardRef as o, useCallback as s, useContext as c, useEffect as l, useMemo as u, useState as d, useSyncExternalStore as f } from "react";
|
|
7
|
+
import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
|
|
7
8
|
//#region src/SelectMoney.tsx
|
|
8
|
-
var
|
|
9
|
+
var g = "sw:hide-money", _ = {
|
|
9
10
|
hidden: !1,
|
|
10
11
|
toggle: () => {},
|
|
11
12
|
setHidden: () => {}
|
|
12
|
-
},
|
|
13
|
-
function
|
|
13
|
+
}, v = a(null);
|
|
14
|
+
function y() {
|
|
14
15
|
try {
|
|
15
|
-
return localStorage.getItem(
|
|
16
|
+
return localStorage.getItem(g) === "1";
|
|
16
17
|
} catch {
|
|
17
18
|
return !1;
|
|
18
19
|
}
|
|
19
20
|
}
|
|
20
|
-
function
|
|
21
|
+
function b(e) {
|
|
21
22
|
try {
|
|
22
|
-
localStorage.setItem(
|
|
23
|
+
localStorage.setItem(g, e ? "1" : "0");
|
|
23
24
|
} catch {}
|
|
24
25
|
}
|
|
25
|
-
function
|
|
26
|
+
function x() {
|
|
26
27
|
let e = 0, t = /* @__PURE__ */ new Set(), n = () => t.forEach((e) => e());
|
|
27
28
|
return {
|
|
28
29
|
mark() {
|
|
@@ -40,16 +41,16 @@ function b() {
|
|
|
40
41
|
present: () => e > 0
|
|
41
42
|
};
|
|
42
43
|
}
|
|
43
|
-
var
|
|
44
|
-
function
|
|
45
|
-
let [t] =
|
|
46
|
-
r(e),
|
|
47
|
-
}, []), a =
|
|
44
|
+
var S = a(null), C = () => () => {}, w = () => !1;
|
|
45
|
+
function T({ children: e }) {
|
|
46
|
+
let [t] = d(x), [n, r] = d(y), i = s((e) => {
|
|
47
|
+
r(e), b(e);
|
|
48
|
+
}, []), a = s(() => {
|
|
48
49
|
r((e) => {
|
|
49
50
|
let t = !e;
|
|
50
|
-
return
|
|
51
|
+
return b(t), t;
|
|
51
52
|
});
|
|
52
|
-
}, []),
|
|
53
|
+
}, []), o = u(() => ({
|
|
53
54
|
hidden: n,
|
|
54
55
|
toggle: a,
|
|
55
56
|
setHidden: i
|
|
@@ -58,28 +59,28 @@ function w({ children: e }) {
|
|
|
58
59
|
a,
|
|
59
60
|
i
|
|
60
61
|
]);
|
|
61
|
-
return /* @__PURE__ */
|
|
62
|
+
return /* @__PURE__ */ m(S.Provider, {
|
|
62
63
|
value: t,
|
|
63
|
-
children: /* @__PURE__ */
|
|
64
|
-
value:
|
|
64
|
+
children: /* @__PURE__ */ m(v.Provider, {
|
|
65
|
+
value: o,
|
|
65
66
|
children: e
|
|
66
67
|
})
|
|
67
68
|
});
|
|
68
69
|
}
|
|
69
|
-
function
|
|
70
|
-
return
|
|
70
|
+
function E() {
|
|
71
|
+
return c(v) ?? _;
|
|
71
72
|
}
|
|
72
|
-
function
|
|
73
|
-
let t =
|
|
74
|
-
|
|
73
|
+
function D(e = !0) {
|
|
74
|
+
let t = c(S);
|
|
75
|
+
l(() => e && t ? t.mark() : void 0, [t, e]);
|
|
75
76
|
}
|
|
76
|
-
function
|
|
77
|
-
let e =
|
|
78
|
-
return
|
|
77
|
+
function O() {
|
|
78
|
+
let e = c(S);
|
|
79
|
+
return f(e ? e.subscribe : C, e ? e.present : w, w);
|
|
79
80
|
}
|
|
80
|
-
var
|
|
81
|
-
let { hidden: a } =
|
|
82
|
-
return
|
|
81
|
+
var k = o(function({ children: e, label: t = "valor oculto", className: n, ...r }, i) {
|
|
82
|
+
let { hidden: a } = E();
|
|
83
|
+
return D(), /* @__PURE__ */ m("span", {
|
|
83
84
|
ref: i,
|
|
84
85
|
...r,
|
|
85
86
|
className: `select-sensitive${a ? " select-sensitive--hidden" : ""}${n ? " " + n : ""}`,
|
|
@@ -87,50 +88,56 @@ var O = a(function({ children: e, label: t = "valor oculto", className: n, ...r
|
|
|
87
88
|
children: e
|
|
88
89
|
});
|
|
89
90
|
});
|
|
90
|
-
function
|
|
91
|
-
let
|
|
92
|
-
return
|
|
91
|
+
function A({ cents: e, sensitive: t = !0 }) {
|
|
92
|
+
let r = i(e, n());
|
|
93
|
+
return m(t ? k : p, { children: r });
|
|
93
94
|
}
|
|
94
|
-
var
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
95
|
+
var j = /* @__PURE__ */ new Map();
|
|
96
|
+
function M(e) {
|
|
97
|
+
let t = j.get(e);
|
|
98
|
+
return t || (t = new Intl.NumberFormat(e === "en" ? "en-US" : "pt-BR", {
|
|
99
|
+
signDisplay: "exceptZero",
|
|
100
|
+
minimumFractionDigits: 1,
|
|
101
|
+
maximumFractionDigits: 1
|
|
102
|
+
}), j.set(e, t)), t;
|
|
103
|
+
}
|
|
104
|
+
var N = o(function({ value: e, invert: t = !1, caption: r, unit: i = "percent", className: a, ...o }, s) {
|
|
105
|
+
let c = n();
|
|
106
|
+
if (e == null || !Number.isFinite(e)) return /* @__PURE__ */ h("span", {
|
|
107
|
+
ref: s,
|
|
108
|
+
...o,
|
|
109
|
+
className: `select-delta select-delta--muted${a ? " " + a : ""}`,
|
|
110
|
+
children: ["—", r ? ` ${r}` : ""]
|
|
104
111
|
});
|
|
105
|
-
let
|
|
106
|
-
return /* @__PURE__ */
|
|
107
|
-
ref:
|
|
108
|
-
...
|
|
109
|
-
className: `select-delta${
|
|
110
|
-
children: [/* @__PURE__ */
|
|
111
|
-
className: `select-delta__value select-delta__value--${
|
|
112
|
+
let l = e === 0, u = e > 0, d = l ? null : t ? !u : u, f = d == null ? "muted" : d ? "up" : "down", p = l ? "" : u ? "▲" : "▼";
|
|
113
|
+
return /* @__PURE__ */ h("span", {
|
|
114
|
+
ref: s,
|
|
115
|
+
...o,
|
|
116
|
+
className: `select-delta${a ? " " + a : ""}`,
|
|
117
|
+
children: [/* @__PURE__ */ h("span", {
|
|
118
|
+
className: `select-delta__value select-delta__value--${f}`,
|
|
112
119
|
children: [
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
120
|
+
p ? `${p} ` : "",
|
|
121
|
+
M(c).format(e),
|
|
122
|
+
i === "points" ? c === "en" ? " pp" : " p.p." : "%"
|
|
116
123
|
]
|
|
117
|
-
}),
|
|
124
|
+
}), r != null && /* @__PURE__ */ m("span", {
|
|
118
125
|
className: "select-delta__caption",
|
|
119
|
-
children:
|
|
126
|
+
children: r
|
|
120
127
|
})]
|
|
121
128
|
});
|
|
122
129
|
});
|
|
123
|
-
function
|
|
124
|
-
let { hidden:
|
|
125
|
-
return /* @__PURE__ */
|
|
130
|
+
function P() {
|
|
131
|
+
let { hidden: n, toggle: i } = E();
|
|
132
|
+
return /* @__PURE__ */ m(r, {
|
|
126
133
|
variant: "outline",
|
|
127
|
-
icon:
|
|
128
|
-
label:
|
|
129
|
-
active:
|
|
134
|
+
icon: m(n ? t : e, {}),
|
|
135
|
+
label: n ? "Mostrar valores" : "Ocultar valores",
|
|
136
|
+
active: n,
|
|
130
137
|
onClick: i
|
|
131
138
|
});
|
|
132
139
|
}
|
|
133
140
|
//#endregion
|
|
134
|
-
export {
|
|
141
|
+
export { P as SelectHideMoneyToggle, N as SelectMetricDelta, A as SelectMoney, k as SelectSensitiveValue, T as SelectValueVisibilityProvider, O as useSelectHasSensitiveValues, D as useSelectSensitiveValueMark, E as useSelectValueVisibility };
|
|
135
142
|
|
|
136
143
|
//# sourceMappingURL=SelectMoney.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ReactNode, ComponentPropsWithoutRef } from 'react';
|
|
1
|
+
import { ChangeEvent, InputHTMLAttributes, ReactNode, ComponentPropsWithoutRef } from 'react';
|
|
2
2
|
export interface SelectRadioOption {
|
|
3
3
|
value: string;
|
|
4
4
|
label: ReactNode;
|
|
@@ -9,6 +9,25 @@ export interface SelectRadioOption {
|
|
|
9
9
|
trailing?: ReactNode;
|
|
10
10
|
disabled?: boolean;
|
|
11
11
|
}
|
|
12
|
+
export type SelectRadioCardProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange'> & {
|
|
13
|
+
label: ReactNode;
|
|
14
|
+
description?: ReactNode;
|
|
15
|
+
leading?: ReactNode;
|
|
16
|
+
trailing?: ReactNode;
|
|
17
|
+
/** Marcado (o cartão acende). Sem `checked`, o rádio fica por conta do navegador (`defaultChecked`). */
|
|
18
|
+
checked?: boolean;
|
|
19
|
+
onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
|
|
20
|
+
};
|
|
21
|
+
/** O cartão de uma opção, com o rádio de verdade dentro: o nome do grupo, o valor e o resto do `<input>` passam. */
|
|
22
|
+
export declare const SelectRadioCard: import('react').ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "onChange"> & {
|
|
23
|
+
label: ReactNode;
|
|
24
|
+
description?: ReactNode;
|
|
25
|
+
leading?: ReactNode;
|
|
26
|
+
trailing?: ReactNode;
|
|
27
|
+
/** Marcado (o cartão acende). Sem `checked`, o rádio fica por conta do navegador (`defaultChecked`). */
|
|
28
|
+
checked?: boolean;
|
|
29
|
+
onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
|
|
30
|
+
} & import('react').RefAttributes<HTMLInputElement>>;
|
|
12
31
|
type SelectRadioGroupOwnProps = {
|
|
13
32
|
value: string;
|
|
14
33
|
onChange: (value: string) => void;
|
package/dist/SelectRadioGroup.js
CHANGED
|
@@ -1,54 +1,63 @@
|
|
|
1
1
|
import { forwardRef as e, useId as t } from "react";
|
|
2
2
|
import { jsx as n, jsxs as r } from "react/jsx-runtime";
|
|
3
3
|
//#region src/SelectRadioGroup.tsx
|
|
4
|
-
var i = e(function({
|
|
4
|
+
var i = e(function({ label: e, description: t, leading: i, trailing: a, checked: o, disabled: s, className: c, onChange: l, ...u }, d) {
|
|
5
|
+
return /* @__PURE__ */ r("label", {
|
|
6
|
+
className: `select-radio${o ? " select-radio--selected" : ""}${s ? " select-radio--disabled" : ""}${c ? " " + c : ""}`,
|
|
7
|
+
children: [
|
|
8
|
+
/* @__PURE__ */ n("input", {
|
|
9
|
+
ref: d,
|
|
10
|
+
...u,
|
|
11
|
+
type: "radio",
|
|
12
|
+
checked: o,
|
|
13
|
+
disabled: s,
|
|
14
|
+
onChange: l
|
|
15
|
+
}),
|
|
16
|
+
/* @__PURE__ */ n("span", {
|
|
17
|
+
className: "select-radio__dot",
|
|
18
|
+
"aria-hidden": "true"
|
|
19
|
+
}),
|
|
20
|
+
i && /* @__PURE__ */ n("span", {
|
|
21
|
+
className: "select-radio__leading",
|
|
22
|
+
children: i
|
|
23
|
+
}),
|
|
24
|
+
/* @__PURE__ */ r("span", {
|
|
25
|
+
className: "select-radio__text",
|
|
26
|
+
children: [/* @__PURE__ */ n("span", {
|
|
27
|
+
className: "select-radio__label",
|
|
28
|
+
children: e
|
|
29
|
+
}), t && /* @__PURE__ */ n("span", {
|
|
30
|
+
className: "select-radio__desc",
|
|
31
|
+
children: t
|
|
32
|
+
})]
|
|
33
|
+
}),
|
|
34
|
+
a && /* @__PURE__ */ n("span", {
|
|
35
|
+
className: "select-radio__trailing",
|
|
36
|
+
children: a
|
|
37
|
+
})
|
|
38
|
+
]
|
|
39
|
+
});
|
|
40
|
+
}), a = e(function({ value: e, onChange: r, options: a, name: o, className: s, ...c }, l) {
|
|
5
41
|
let u = t(), d = o ?? u;
|
|
6
42
|
return /* @__PURE__ */ n("div", {
|
|
7
43
|
ref: l,
|
|
8
44
|
...c,
|
|
9
45
|
className: `select-radiogroup${s ? " " + s : ""}`,
|
|
10
46
|
role: "radiogroup",
|
|
11
|
-
children: a.map((t) => {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
onChange: () => i(t.value)
|
|
23
|
-
}),
|
|
24
|
-
/* @__PURE__ */ n("span", {
|
|
25
|
-
className: "select-radio__dot",
|
|
26
|
-
"aria-hidden": "true"
|
|
27
|
-
}),
|
|
28
|
-
t.leading && /* @__PURE__ */ n("span", {
|
|
29
|
-
className: "select-radio__leading",
|
|
30
|
-
children: t.leading
|
|
31
|
-
}),
|
|
32
|
-
/* @__PURE__ */ r("span", {
|
|
33
|
-
className: "select-radio__text",
|
|
34
|
-
children: [/* @__PURE__ */ n("span", {
|
|
35
|
-
className: "select-radio__label",
|
|
36
|
-
children: t.label
|
|
37
|
-
}), t.description && /* @__PURE__ */ n("span", {
|
|
38
|
-
className: "select-radio__desc",
|
|
39
|
-
children: t.description
|
|
40
|
-
})]
|
|
41
|
-
}),
|
|
42
|
-
t.trailing && /* @__PURE__ */ n("span", {
|
|
43
|
-
className: "select-radio__trailing",
|
|
44
|
-
children: t.trailing
|
|
45
|
-
})
|
|
46
|
-
]
|
|
47
|
-
}, t.value);
|
|
48
|
-
})
|
|
47
|
+
children: a.map((t) => /* @__PURE__ */ n(i, {
|
|
48
|
+
name: d,
|
|
49
|
+
value: t.value,
|
|
50
|
+
checked: t.value === e,
|
|
51
|
+
disabled: t.disabled,
|
|
52
|
+
onChange: () => r(t.value),
|
|
53
|
+
label: t.label,
|
|
54
|
+
description: t.description,
|
|
55
|
+
leading: t.leading,
|
|
56
|
+
trailing: t.trailing
|
|
57
|
+
}, t.value))
|
|
49
58
|
});
|
|
50
59
|
});
|
|
51
60
|
//#endregion
|
|
52
|
-
export { i as SelectRadioGroup };
|
|
61
|
+
export { i as SelectRadioCard, a as SelectRadioGroup };
|
|
53
62
|
|
|
54
63
|
//# sourceMappingURL=SelectRadioGroup.js.map
|
|
@@ -13,6 +13,8 @@ type SelectSearchInputOwnProps = {
|
|
|
13
13
|
inputProps?: SelectNativeInputProps;
|
|
14
14
|
/** 0.1.198: a referência do `<input>`. */
|
|
15
15
|
inputRef?: Ref<HTMLInputElement>;
|
|
16
|
+
/** 0.1.202: a densidade, como nos outros campos (`sm` nas barras de filtro e no seletor de workspace). */
|
|
17
|
+
size?: 'sm' | 'md';
|
|
16
18
|
};
|
|
17
19
|
export type SelectSearchInputProps = SelectSearchInputOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof SelectSearchInputOwnProps>;
|
|
18
20
|
export declare const SelectSearchInput: import('react').ForwardRefExoticComponent<SelectSearchInputOwnProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof SelectSearchInputOwnProps> & import('react').RefAttributes<HTMLDivElement>>;
|
|
@@ -4,12 +4,12 @@ import { useSelectMessages as n } from "./SelectLocale.js";
|
|
|
4
4
|
import { forwardRef as r } from "react";
|
|
5
5
|
import { jsx as i, jsxs as a } from "react/jsx-runtime";
|
|
6
6
|
//#region src/SelectSearchInput.tsx
|
|
7
|
-
var o = r(function({ value: r, onChange: o, placeholder: s, shortcut: c, inputLabel: l, inputProps: u, inputRef: d,
|
|
8
|
-
let
|
|
7
|
+
var o = r(function({ value: r, onChange: o, placeholder: s, shortcut: c, inputLabel: l, inputProps: u, inputRef: d, size: f = "md", className: p, ...m }, h) {
|
|
8
|
+
let g = n().common.searchPlaceholder, _ = s ?? g, v = t(u, { placeholder: _ });
|
|
9
9
|
return /* @__PURE__ */ a("div", {
|
|
10
|
-
ref:
|
|
11
|
-
...
|
|
12
|
-
className: `select-search${f ? " " +
|
|
10
|
+
ref: h,
|
|
11
|
+
...m,
|
|
12
|
+
className: `select-search${f === "sm" ? " select-search--sm" : ""}${p ? " " + p : ""}`,
|
|
13
13
|
children: [
|
|
14
14
|
/* @__PURE__ */ i("span", {
|
|
15
15
|
className: "select-search__icon",
|
|
@@ -17,13 +17,13 @@ var o = r(function({ value: r, onChange: o, placeholder: s, shortcut: c, inputLa
|
|
|
17
17
|
children: /* @__PURE__ */ i(e, {})
|
|
18
18
|
}),
|
|
19
19
|
/* @__PURE__ */ i("input", {
|
|
20
|
-
...
|
|
20
|
+
...v,
|
|
21
21
|
ref: d,
|
|
22
|
-
className:
|
|
22
|
+
className: `select-search__input${u != null && u.className ? " " + u.className : ""}`,
|
|
23
23
|
type: "search",
|
|
24
24
|
value: r,
|
|
25
25
|
onChange: (e) => o(e.target.value, e),
|
|
26
|
-
"aria-label": l ??
|
|
26
|
+
"aria-label": l ?? v["aria-label"] ?? _
|
|
27
27
|
}),
|
|
28
28
|
c && /* @__PURE__ */ i("kbd", {
|
|
29
29
|
className: "select-search__kbd",
|
package/dist/SelectSelect.d.ts
CHANGED
|
@@ -17,7 +17,7 @@ type SelectSelectOwnProps = {
|
|
|
17
17
|
/** 0.1.198: o "(opcional)" depois do rótulo. */
|
|
18
18
|
optional?: boolean;
|
|
19
19
|
/** 0.1.198: os atributos nativos do `<select>` (o `form`, o `autoFocus`, o `aria-*`…). */
|
|
20
|
-
selectProps?: Omit<SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'defaultValue' | 'onChange' | 'id' | '
|
|
20
|
+
selectProps?: Omit<SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'defaultValue' | 'onChange' | 'id' | 'children'>;
|
|
21
21
|
/** 0.1.198: a referência do `<select>`. */
|
|
22
22
|
selectRef?: Ref<HTMLSelectElement>;
|
|
23
23
|
/** 0.1.198: o id do `<select>` (um rótulo de fora aponta para ele). */
|
package/dist/SelectSelect.js
CHANGED
|
@@ -45,7 +45,7 @@ var u = o(function({ label: o, value: u, onChange: d, options: f = [], children:
|
|
|
45
45
|
...L,
|
|
46
46
|
ref: O,
|
|
47
47
|
id: F,
|
|
48
|
-
className: `select-input select-select${y ? " select-input--error" : ""}`,
|
|
48
|
+
className: `select-input select-select${y ? " select-input--error" : ""}${D != null && D.className ? " " + D.className : ""}`,
|
|
49
49
|
value: u,
|
|
50
50
|
onChange: (e) => d(e.target.value, e),
|
|
51
51
|
"aria-invalid": y ? !0 : L["aria-invalid"],
|
package/dist/SelectTextarea.d.ts
CHANGED
|
@@ -8,7 +8,7 @@ type SelectTextareaOwnProps = {
|
|
|
8
8
|
/** 0.1.198: o "(opcional)" depois do rótulo. */
|
|
9
9
|
optional?: boolean;
|
|
10
10
|
/** 0.1.198: os atributos nativos da `<textarea>` (o `spellCheck`, o `readOnly`, o `autoFocus`, o `aria-*`…). */
|
|
11
|
-
textareaProps?: Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'defaultValue' | 'onChange' | 'id'
|
|
11
|
+
textareaProps?: Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'defaultValue' | 'onChange' | 'id'>;
|
|
12
12
|
/** 0.1.198: a referência da `<textarea>`. */
|
|
13
13
|
textareaRef?: Ref<HTMLTextAreaElement>;
|
|
14
14
|
/** 0.1.198: o id da `<textarea>` (um rótulo de fora aponta para ele). */
|