@versini/ui-textinput 1.2.2 → 1.2.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.
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as f, jsxs as W } from "react/jsx-runtime";
|
|
2
|
-
import G, { useRef as y, useEffect as R, useCallback as J, useState as L, useMemo as K, useId as Q, useReducer as Y, useLayoutEffect as
|
|
2
|
+
import G, { useRef as y, useEffect as R, useCallback as J, useState as L, useMemo as K, useId as Q, useReducer as Y, useLayoutEffect as P } from "react";
|
|
3
3
|
import c from "clsx";
|
|
4
|
-
const w = "av-text-input", be = "av-text-input-simple", Z = "av-text-input-wrapper",
|
|
4
|
+
const w = "av-text-input", be = "av-text-input-simple", Z = "av-text-input-wrapper", I = "av-text-input-helper-text";
|
|
5
5
|
function B() {
|
|
6
6
|
const e = y(!1);
|
|
7
7
|
return R(() => (e.current = !0, () => {
|
|
@@ -40,7 +40,7 @@ function re(e) {
|
|
|
40
40
|
return typeof t == "number" || typeof t == "string" ? `${n}${t}` : `${n}${r}`;
|
|
41
41
|
}
|
|
42
42
|
}
|
|
43
|
-
const D = "SET_ANNOUNCEMENT",
|
|
43
|
+
const D = "SET_ANNOUNCEMENT", U = "CLEAR_ANNOUNCEMENT", ne = {
|
|
44
44
|
alert: null,
|
|
45
45
|
alertdialog: null,
|
|
46
46
|
log: "polite",
|
|
@@ -55,7 +55,7 @@ const D = "SET_ANNOUNCEMENT", M = "CLEAR_ANNOUNCEMENT", ne = {
|
|
|
55
55
|
...e,
|
|
56
56
|
announcement: r.payload
|
|
57
57
|
};
|
|
58
|
-
case
|
|
58
|
+
case U:
|
|
59
59
|
return {
|
|
60
60
|
...e,
|
|
61
61
|
announcement: null
|
|
@@ -68,16 +68,16 @@ const D = "SET_ANNOUNCEMENT", M = "CLEAR_ANNOUNCEMENT", ne = {
|
|
|
68
68
|
dispatch: r
|
|
69
69
|
}) => {
|
|
70
70
|
r({
|
|
71
|
-
type:
|
|
71
|
+
type: U
|
|
72
72
|
}), typeof e == "function" && e();
|
|
73
|
-
},
|
|
73
|
+
}, S = ({
|
|
74
74
|
children: e,
|
|
75
75
|
clearAnnouncementDelay: r,
|
|
76
76
|
clearAnnouncementTimeoutRef: t,
|
|
77
77
|
onAnnouncementClear: n,
|
|
78
78
|
dispatch: l
|
|
79
79
|
}) => {
|
|
80
|
-
|
|
80
|
+
clearTimeout(t.current), e !== null && l({
|
|
81
81
|
type: D,
|
|
82
82
|
payload: e
|
|
83
83
|
}), r && (t.current = setTimeout(
|
|
@@ -96,13 +96,13 @@ const D = "SET_ANNOUNCEMENT", M = "CLEAR_ANNOUNCEMENT", ne = {
|
|
|
96
96
|
onAnnouncementClear: o,
|
|
97
97
|
dispatch: a
|
|
98
98
|
}) => {
|
|
99
|
-
clearTimeout(r.current), t ? r.current = setTimeout(
|
|
99
|
+
clearTimeout(r.current), t ? r.current = setTimeout(S, t, {
|
|
100
100
|
children: e,
|
|
101
101
|
clearAnnouncementDelay: n,
|
|
102
102
|
clearAnnouncementTimeoutRef: l,
|
|
103
103
|
onAnnouncementClear: o,
|
|
104
104
|
dispatch: a
|
|
105
|
-
}) :
|
|
105
|
+
}) : S({
|
|
106
106
|
children: e,
|
|
107
107
|
clearAnnouncementDelay: n,
|
|
108
108
|
clearAnnouncementTimeoutRef: l,
|
|
@@ -121,7 +121,7 @@ function oe({
|
|
|
121
121
|
visible: u,
|
|
122
122
|
...p
|
|
123
123
|
}) {
|
|
124
|
-
const m = y(), x = y(), [g, s] = Y(le, {
|
|
124
|
+
const m = y(null), x = y(null), [g, s] = Y(le, {
|
|
125
125
|
announcement: null
|
|
126
126
|
});
|
|
127
127
|
let d = t;
|
|
@@ -166,13 +166,13 @@ const se = (e) => {
|
|
|
166
166
|
return r;
|
|
167
167
|
};
|
|
168
168
|
/*!
|
|
169
|
-
@versini/ui-private v1.4.
|
|
169
|
+
@versini/ui-private v1.4.19
|
|
170
170
|
© 2024 gizmette.com
|
|
171
171
|
*/
|
|
172
172
|
try {
|
|
173
173
|
window.__VERSINI_UI_PRIVATE__ || (window.__VERSINI_UI_PRIVATE__ = {
|
|
174
|
-
version: "1.4.
|
|
175
|
-
buildTime: "
|
|
174
|
+
version: "1.4.19",
|
|
175
|
+
buildTime: "12/12/2024 05:56 PM EST",
|
|
176
176
|
homepage: "https://github.com/aversini/ui-components",
|
|
177
177
|
license: "MIT"
|
|
178
178
|
});
|
|
@@ -234,18 +234,18 @@ const ue = ({
|
|
|
234
234
|
return "";
|
|
235
235
|
if (n)
|
|
236
236
|
return c(
|
|
237
|
-
|
|
237
|
+
I,
|
|
238
238
|
"absolute px-2 cursor-not-allowed opacity-50 font-medium"
|
|
239
239
|
);
|
|
240
240
|
if (!e)
|
|
241
|
-
return c(
|
|
241
|
+
return c(I, "absolute px-2 font-medium", {
|
|
242
242
|
"text-copy-lighter": t === "dark",
|
|
243
243
|
"text-copy-dark": t === "light",
|
|
244
244
|
"text-copy-dark dark:text-copy-lighter": t === "system",
|
|
245
245
|
"text-copy-lighter dark:text-copy-dark": t === "alt-system"
|
|
246
246
|
});
|
|
247
247
|
if (e)
|
|
248
|
-
return c(
|
|
248
|
+
return c(I, "absolute px-2 font-medium", {
|
|
249
249
|
"text-copy-error-light bg-surface-darker": t === "dark",
|
|
250
250
|
"text-copy-error-dark": t === "light",
|
|
251
251
|
"text-copy-error-dark dark:text-copy-error-light dark:bg-surface-darker": t === "system",
|
|
@@ -309,14 +309,14 @@ const ue = ({
|
|
|
309
309
|
raw: t,
|
|
310
310
|
mode: u,
|
|
311
311
|
disabled: n
|
|
312
|
-
}),
|
|
312
|
+
}), N = t ? void 0 : c("absolute right-3", x);
|
|
313
313
|
return {
|
|
314
314
|
wrapper: g,
|
|
315
315
|
input: d,
|
|
316
316
|
accessibleLabel: i,
|
|
317
317
|
visibleLabel: b,
|
|
318
318
|
helperText: E,
|
|
319
|
-
rightElement:
|
|
319
|
+
rightElement: N
|
|
320
320
|
};
|
|
321
321
|
}, me = G.forwardRef(
|
|
322
322
|
({
|
|
@@ -337,11 +337,11 @@ const ue = ({
|
|
|
337
337
|
helperText: i = "",
|
|
338
338
|
rightElement: b,
|
|
339
339
|
rightElementClassName: E,
|
|
340
|
-
spacing:
|
|
340
|
+
spacing: N,
|
|
341
341
|
size: _ = "md",
|
|
342
|
-
...
|
|
343
|
-
},
|
|
344
|
-
const [
|
|
342
|
+
...M
|
|
343
|
+
}, F) => {
|
|
344
|
+
const [j, T] = te(), [X, O] = L(0), k = re({ id: e, prefix: `${w}-` }), V = `${r} error, ${i}`, v = y(null), A = y(null), q = {
|
|
345
345
|
xs: { label: "-25px", helperText: "30px" },
|
|
346
346
|
sm: { label: "-29px", helperText: "34px" },
|
|
347
347
|
md: { label: "-33px", helperText: "38px" },
|
|
@@ -355,17 +355,17 @@ const ue = ({
|
|
|
355
355
|
focusMode: p,
|
|
356
356
|
disabled: m,
|
|
357
357
|
noBorder: x,
|
|
358
|
-
spacing:
|
|
358
|
+
spacing: N,
|
|
359
359
|
mode: u,
|
|
360
360
|
size: _,
|
|
361
361
|
rightElementClassName: E
|
|
362
362
|
});
|
|
363
|
-
return
|
|
364
|
-
T && T.width &&
|
|
365
|
-
}, [T]),
|
|
366
|
-
var
|
|
363
|
+
return P(() => {
|
|
364
|
+
T && T.width && O(T.width + 18 + 10);
|
|
365
|
+
}, [T]), P(() => {
|
|
366
|
+
var C, $;
|
|
367
367
|
const { label: H, helperText: z } = q[_];
|
|
368
|
-
(
|
|
368
|
+
(C = v == null ? void 0 : v.current) == null || C.style.setProperty("--av-text-input-label", H), ($ = A == null ? void 0 : A.current) == null || $.style.setProperty(
|
|
369
369
|
"--av-text-input-helper-text",
|
|
370
370
|
z
|
|
371
371
|
);
|
|
@@ -382,7 +382,7 @@ const ue = ({
|
|
|
382
382
|
/* @__PURE__ */ f(
|
|
383
383
|
"input",
|
|
384
384
|
{
|
|
385
|
-
ref:
|
|
385
|
+
ref: F,
|
|
386
386
|
id: k,
|
|
387
387
|
name: r,
|
|
388
388
|
type: d,
|
|
@@ -391,14 +391,14 @@ const ue = ({
|
|
|
391
391
|
className: h.input,
|
|
392
392
|
...i && { "aria-describedby": `${k}-helper` },
|
|
393
393
|
...n && { "aria-invalid": "true" },
|
|
394
|
-
...b && !l && { style: { paddingRight:
|
|
395
|
-
...
|
|
394
|
+
...b && !l && { style: { paddingRight: X } },
|
|
395
|
+
...M
|
|
396
396
|
}
|
|
397
397
|
),
|
|
398
398
|
!l && !s && /* @__PURE__ */ f(
|
|
399
399
|
"label",
|
|
400
400
|
{
|
|
401
|
-
ref:
|
|
401
|
+
ref: v,
|
|
402
402
|
"aria-hidden": !0,
|
|
403
403
|
htmlFor: k,
|
|
404
404
|
className: h.visibleLabel,
|
|
@@ -408,7 +408,7 @@ const ue = ({
|
|
|
408
408
|
i && /* @__PURE__ */ f(
|
|
409
409
|
"div",
|
|
410
410
|
{
|
|
411
|
-
ref:
|
|
411
|
+
ref: A,
|
|
412
412
|
id: `${k}-helper`,
|
|
413
413
|
className: h.helperText,
|
|
414
414
|
children: i
|
|
@@ -417,7 +417,7 @@ const ue = ({
|
|
|
417
417
|
b && /* @__PURE__ */ f(
|
|
418
418
|
"div",
|
|
419
419
|
{
|
|
420
|
-
ref:
|
|
420
|
+
ref: j,
|
|
421
421
|
className: h.rightElement,
|
|
422
422
|
children: b
|
|
423
423
|
}
|
|
@@ -429,9 +429,9 @@ const ue = ({
|
|
|
429
429
|
me.displayName = "TextInput";
|
|
430
430
|
export {
|
|
431
431
|
w as TEXT_INPUT_CLASSNAME,
|
|
432
|
-
|
|
432
|
+
I as TEXT_INPUT_HELPER_TEXT_CLASSNAME,
|
|
433
433
|
be as TEXT_INPUT_SIMPLE_CLASSNAME,
|
|
434
434
|
Z as TEXT_INPUT_WRAPPER_CLASSNAME,
|
|
435
435
|
me as TextInput,
|
|
436
|
-
oe as
|
|
436
|
+
oe as x
|
|
437
437
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { TextInput as H,
|
|
2
|
-
import { jsxs as
|
|
1
|
+
import { TextInput as H, x as L } from "../../chunks/TextInput.c-MGDpNB.js";
|
|
2
|
+
import { jsxs as B, Fragment as j, jsx as x } from "react/jsx-runtime";
|
|
3
3
|
import A, { useMemo as b, useState as _, useRef as m, useEffect as $ } from "react";
|
|
4
4
|
function q(r) {
|
|
5
5
|
return b(() => r.every((t) => t == null) ? () => {
|
|
@@ -15,49 +15,49 @@ const z = 500, G = 5e3, J = 2e4, K = A.forwardRef(
|
|
|
15
15
|
disabled: t,
|
|
16
16
|
label: n,
|
|
17
17
|
labelHidden: k,
|
|
18
|
-
onMaskChange:
|
|
19
|
-
onChange:
|
|
20
|
-
onBlur:
|
|
18
|
+
onMaskChange: u,
|
|
19
|
+
onChange: T,
|
|
20
|
+
onBlur: d,
|
|
21
21
|
onFocus: p,
|
|
22
22
|
onTextInputMaskBlur: f,
|
|
23
|
-
rightElement:
|
|
24
|
-
spacing:
|
|
25
|
-
...
|
|
23
|
+
rightElement: O,
|
|
24
|
+
spacing: U,
|
|
25
|
+
...w
|
|
26
26
|
}, E) => {
|
|
27
|
-
const [h, g] = _(!0), [
|
|
27
|
+
const [h, g] = _(!0), [l, R] = _({
|
|
28
28
|
message: null,
|
|
29
29
|
politeness: null
|
|
30
|
-
}),
|
|
31
|
-
clearTimeout(
|
|
32
|
-
|
|
30
|
+
}), c = m(!0), o = m(null), I = m(null), C = q([E, I]), S = h ? "Show" : "Hide", a = () => {
|
|
31
|
+
o.current && clearTimeout(o.current), c.current || (o.current = setTimeout(() => {
|
|
32
|
+
c.current = !0, g(!0), R({
|
|
33
33
|
announcementTimeout: G,
|
|
34
34
|
politeness: "polite",
|
|
35
35
|
message: `${n} hiding characters`
|
|
36
|
-
}),
|
|
36
|
+
}), u && u(!0);
|
|
37
37
|
}, J));
|
|
38
38
|
}, v = (e) => {
|
|
39
39
|
e.preventDefault();
|
|
40
|
-
const s = !
|
|
41
|
-
|
|
40
|
+
const s = !c.current;
|
|
41
|
+
c.current = s, a(), g(s), R({
|
|
42
42
|
announcementTimeout: z,
|
|
43
43
|
politeness: "assertive",
|
|
44
44
|
message: s ? "Characters hidden" : "Characters showing"
|
|
45
|
-
}),
|
|
45
|
+
}), u && u(s);
|
|
46
46
|
}, M = (e) => {
|
|
47
47
|
var N;
|
|
48
|
-
const { relatedTarget: s } = e,
|
|
49
|
-
|
|
48
|
+
const { relatedTarget: s } = e, i = (N = I.current) == null ? void 0 : N.parentElement;
|
|
49
|
+
i != null && i.contains(s) || f && f();
|
|
50
50
|
}, y = (e) => {
|
|
51
|
-
|
|
51
|
+
a(), d && d(e), M(e);
|
|
52
52
|
}, D = (e) => {
|
|
53
|
-
|
|
53
|
+
a(), p && p(e);
|
|
54
54
|
}, F = (e) => {
|
|
55
|
-
|
|
55
|
+
a(), T && T(e);
|
|
56
56
|
};
|
|
57
57
|
return $(() => () => {
|
|
58
|
-
clearTimeout(
|
|
59
|
-
}, []), /* @__PURE__ */ j
|
|
60
|
-
/* @__PURE__ */
|
|
58
|
+
o.current && clearTimeout(o.current);
|
|
59
|
+
}, []), /* @__PURE__ */ B(j, { children: [
|
|
60
|
+
/* @__PURE__ */ x(
|
|
61
61
|
H,
|
|
62
62
|
{
|
|
63
63
|
ref: C,
|
|
@@ -66,27 +66,27 @@ const z = 500, G = 5e3, J = 2e4, K = A.forwardRef(
|
|
|
66
66
|
labelHidden: k,
|
|
67
67
|
type: h ? "password" : "text",
|
|
68
68
|
disabled: t,
|
|
69
|
-
spacing:
|
|
69
|
+
spacing: U,
|
|
70
70
|
onBlur: y,
|
|
71
71
|
onFocus: D,
|
|
72
72
|
onChange: F,
|
|
73
|
-
rightElement: A.cloneElement(
|
|
73
|
+
rightElement: A.cloneElement(O, {
|
|
74
74
|
ref: E,
|
|
75
75
|
label: S,
|
|
76
76
|
onClick: v,
|
|
77
77
|
onBlur: M,
|
|
78
78
|
disabled: t
|
|
79
79
|
}),
|
|
80
|
-
...
|
|
80
|
+
...w
|
|
81
81
|
}
|
|
82
82
|
),
|
|
83
|
-
/* @__PURE__ */
|
|
83
|
+
/* @__PURE__ */ x(
|
|
84
84
|
L,
|
|
85
85
|
{
|
|
86
86
|
role: "status",
|
|
87
|
-
politeness:
|
|
88
|
-
clearAnnouncementDelay:
|
|
89
|
-
children:
|
|
87
|
+
politeness: l.politeness,
|
|
88
|
+
clearAnnouncementDelay: l.announcementTimeout,
|
|
89
|
+
children: l.message
|
|
90
90
|
}
|
|
91
91
|
)
|
|
92
92
|
] });
|
package/dist/index.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { TEXT_INPUT_CLASSNAME as I, TEXT_INPUT_HELPER_TEXT_CLASSNAME as e, TEXT_INPUT_SIMPLE_CLASSNAME as o, TEXT_INPUT_WRAPPER_CLASSNAME as t, TextInput as N } from "./chunks/TextInput.
|
|
1
|
+
import { TEXT_INPUT_CLASSNAME as I, TEXT_INPUT_HELPER_TEXT_CLASSNAME as e, TEXT_INPUT_SIMPLE_CLASSNAME as o, TEXT_INPUT_WRAPPER_CLASSNAME as t, TextInput as N } from "./chunks/TextInput.c-MGDpNB.js";
|
|
2
2
|
import { TextInputMask as i } from "./components/TextInput/TextInputMask.js";
|
|
3
3
|
/*!
|
|
4
|
-
@versini/ui-textinput v1.2.
|
|
4
|
+
@versini/ui-textinput v1.2.3
|
|
5
5
|
© 2024 gizmette.com
|
|
6
6
|
*/
|
|
7
7
|
try {
|
|
8
8
|
window.__VERSINI_UI_TEXTINPUT__ || (window.__VERSINI_UI_TEXTINPUT__ = {
|
|
9
|
-
version: "1.2.
|
|
10
|
-
buildTime: "
|
|
9
|
+
version: "1.2.3",
|
|
10
|
+
buildTime: "12/12/2024 05:56 PM EST",
|
|
11
11
|
homepage: "https://github.com/aversini/ui-components",
|
|
12
12
|
license: "MIT"
|
|
13
13
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@versini/ui-textinput",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.3",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Arno Versini",
|
|
6
6
|
"publishConfig": {
|
|
@@ -40,12 +40,12 @@
|
|
|
40
40
|
"dependencies": {
|
|
41
41
|
"@tailwindcss/typography": "0.5.15",
|
|
42
42
|
"@versini/ui-hooks": "4.2.2",
|
|
43
|
-
"@versini/ui-private": "1.4.
|
|
43
|
+
"@versini/ui-private": "1.4.19",
|
|
44
44
|
"clsx": "2.1.1",
|
|
45
45
|
"tailwindcss": "3.4.15"
|
|
46
46
|
},
|
|
47
47
|
"sideEffects": [
|
|
48
48
|
"**/*.css"
|
|
49
49
|
],
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "678eb92e8c1d2db9cd7d01616750305b5a7588df"
|
|
51
51
|
}
|