@fuf-stack/uniform 1.8.9 → 1.9.0
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/Checkboxes/index.cjs +10 -10
- package/dist/Checkboxes/index.js +9 -9
- package/dist/FieldArray/index.cjs +10 -10
- package/dist/FieldArray/index.js +9 -9
- package/dist/Form/index.cjs +10 -10
- package/dist/Form/index.js +9 -9
- package/dist/Input/index.cjs +10 -10
- package/dist/Input/index.js +9 -9
- package/dist/{RadioBoxes-DpkI28l0.d.cts → RadioBox-B0s3q9g6.d.cts} +87 -37
- package/dist/{RadioBoxes-DpkI28l0.d.ts → RadioBox-B0s3q9g6.d.ts} +87 -37
- package/dist/RadioBoxes/index.cjs +12 -10
- package/dist/RadioBoxes/index.cjs.map +1 -1
- package/dist/RadioBoxes/index.d.cts +2 -2
- package/dist/RadioBoxes/index.d.ts +2 -2
- package/dist/RadioBoxes/index.js +13 -11
- package/dist/RadioTabs/index.cjs +10 -10
- package/dist/RadioTabs/index.d.cts +2 -2
- package/dist/RadioTabs/index.d.ts +2 -2
- package/dist/RadioTabs/index.js +9 -9
- package/dist/{RadioTabs-DTDcAZoH.d.cts → RadioTabs-D9Px3XEs.d.cts} +15 -0
- package/dist/{RadioTabs-DTDcAZoH.d.ts → RadioTabs-D9Px3XEs.d.ts} +15 -0
- package/dist/Radios/index.cjs +10 -10
- package/dist/Radios/index.js +9 -9
- package/dist/Select/index.cjs +10 -10
- package/dist/Select/index.js +9 -9
- package/dist/Slider/index.cjs +19 -0
- package/dist/Slider/index.cjs.map +1 -0
- package/dist/Slider/index.d.cts +10 -0
- package/dist/Slider/index.d.ts +10 -0
- package/dist/Slider/index.js +19 -0
- package/dist/Slider/index.js.map +1 -0
- package/dist/Slider-CIVhjJy1.d.cts +153 -0
- package/dist/Slider-CIVhjJy1.d.ts +153 -0
- package/dist/SubmitButton/index.cjs +10 -10
- package/dist/SubmitButton/index.js +9 -9
- package/dist/Switch/index.cjs +10 -10
- package/dist/Switch/index.d.cts +2 -2
- package/dist/Switch/index.d.ts +2 -2
- package/dist/Switch/index.js +9 -9
- package/dist/{Switch-Hr6PnK98.d.cts → Switch-CqBVdRJe.d.cts} +4 -4
- package/dist/{Switch-Hr6PnK98.d.ts → Switch-CqBVdRJe.d.ts} +4 -4
- package/dist/SwitchBox/index.cjs +26 -0
- package/dist/SwitchBox/index.cjs.map +1 -0
- package/dist/SwitchBox/index.d.cts +11 -0
- package/dist/SwitchBox/index.d.ts +11 -0
- package/dist/SwitchBox/index.js +26 -0
- package/dist/SwitchBox/index.js.map +1 -0
- package/dist/SwitchBox-q1I7a0NX.d.cts +146 -0
- package/dist/SwitchBox-q1I7a0NX.d.ts +146 -0
- package/dist/TextArea/index.cjs +10 -10
- package/dist/TextArea/index.js +9 -9
- package/dist/{chunk-T6G6NGLL.js → chunk-246OISWB.js} +2 -2
- package/dist/chunk-2OXNDD5W.cjs +162 -0
- package/dist/chunk-2OXNDD5W.cjs.map +1 -0
- package/dist/{chunk-2UQCRQEJ.cjs → chunk-6RZT2BKH.cjs} +5 -5
- package/dist/{chunk-2UQCRQEJ.cjs.map → chunk-6RZT2BKH.cjs.map} +1 -1
- package/dist/{chunk-OZQQSTVH.js → chunk-7FOSZV75.js} +8 -6
- package/dist/chunk-7FOSZV75.js.map +1 -0
- package/dist/{chunk-F5DISGJ4.cjs → chunk-7O6LAGV2.cjs} +9 -9
- package/dist/{chunk-F5DISGJ4.cjs.map → chunk-7O6LAGV2.cjs.map} +1 -1
- package/dist/{chunk-QLMUUXQO.cjs → chunk-7WKVH43M.cjs} +78 -46
- package/dist/chunk-7WKVH43M.cjs.map +1 -0
- package/dist/{chunk-RCLQ6NFK.js → chunk-A3PYIWG2.js} +2 -2
- package/dist/{chunk-O2XJNQQK.js → chunk-BOCYHTFE.js} +7 -1
- package/dist/chunk-BOCYHTFE.js.map +1 -0
- package/dist/{chunk-KE5DB3DZ.js → chunk-CEVS6WSG.js} +2 -2
- package/dist/{chunk-VIK6VTAZ.js → chunk-CG7GDQAP.js} +3 -3
- package/dist/{chunk-77OMBV7C.js → chunk-DQAZSXD6.js} +4 -4
- package/dist/chunk-FUMQULCR.cjs +215 -0
- package/dist/chunk-FUMQULCR.cjs.map +1 -0
- package/dist/{chunk-5MTIQ6WD.js → chunk-GE7HUIAK.js} +3 -3
- package/dist/{chunk-LO7UKHOS.js → chunk-IKOYYA75.js} +2 -2
- package/dist/{chunk-SG3JI5R3.cjs → chunk-IU4RL2D7.cjs} +3 -3
- package/dist/{chunk-SG3JI5R3.cjs.map → chunk-IU4RL2D7.cjs.map} +1 -1
- package/dist/{chunk-PHMEYG5F.js → chunk-IZZTVGEW.js} +78 -46
- package/dist/chunk-IZZTVGEW.js.map +1 -0
- package/dist/{chunk-F3WXUKZG.js → chunk-JICFOKDO.js} +2 -2
- package/dist/{chunk-ALI7JORZ.cjs → chunk-JQQ32JOD.cjs} +3 -3
- package/dist/{chunk-ALI7JORZ.cjs.map → chunk-JQQ32JOD.cjs.map} +1 -1
- package/dist/{chunk-YYLTLVIF.cjs → chunk-LTE7PW7F.cjs} +3 -3
- package/dist/{chunk-YYLTLVIF.cjs.map → chunk-LTE7PW7F.cjs.map} +1 -1
- package/dist/chunk-LUO4I3TW.js +162 -0
- package/dist/chunk-LUO4I3TW.js.map +1 -0
- package/dist/{chunk-JG7S3DEH.cjs → chunk-MEYGGRBQ.cjs} +7 -7
- package/dist/{chunk-JG7S3DEH.cjs.map → chunk-MEYGGRBQ.cjs.map} +1 -1
- package/dist/{chunk-YBLDWOOG.js → chunk-MHQ2V7UW.js} +2 -2
- package/dist/{chunk-HEPNEBRF.cjs → chunk-NKIZA3ZO.cjs} +3 -3
- package/dist/{chunk-HEPNEBRF.cjs.map → chunk-NKIZA3ZO.cjs.map} +1 -1
- package/dist/{chunk-6AWHOBNL.cjs → chunk-NV4YVZYX.cjs} +6 -6
- package/dist/{chunk-6AWHOBNL.cjs.map → chunk-NV4YVZYX.cjs.map} +1 -1
- package/dist/{chunk-D4AAQIY3.cjs → chunk-RRG5ZLVF.cjs} +5 -5
- package/dist/{chunk-D4AAQIY3.cjs.map → chunk-RRG5ZLVF.cjs.map} +1 -1
- package/dist/{chunk-NQ3KBYW6.cjs → chunk-SR76XJW4.cjs} +3 -3
- package/dist/{chunk-NQ3KBYW6.cjs.map → chunk-SR76XJW4.cjs.map} +1 -1
- package/dist/chunk-THCIT66I.cjs +217 -0
- package/dist/chunk-THCIT66I.cjs.map +1 -0
- package/dist/{chunk-OKJWLH7T.cjs → chunk-TKICOKNS.cjs} +9 -3
- package/dist/chunk-TKICOKNS.cjs.map +1 -0
- package/dist/{chunk-IV45K4WU.js → chunk-TUIK3MER.js} +2 -2
- package/dist/{chunk-AQJLKHAE.cjs → chunk-UBLASN6D.cjs} +5 -5
- package/dist/{chunk-AQJLKHAE.cjs.map → chunk-UBLASN6D.cjs.map} +1 -1
- package/dist/chunk-UUGSI3FD.js +215 -0
- package/dist/chunk-UUGSI3FD.js.map +1 -0
- package/dist/{chunk-FYN7ZWLW.cjs → chunk-UUGUQGMX.cjs} +10 -10
- package/dist/{chunk-FYN7ZWLW.cjs.map → chunk-UUGUQGMX.cjs.map} +1 -1
- package/dist/{chunk-H2PPUEUO.cjs → chunk-V65AMUKK.cjs} +5 -5
- package/dist/{chunk-H2PPUEUO.cjs.map → chunk-V65AMUKK.cjs.map} +1 -1
- package/dist/chunk-VIV3MSIX.cjs +129 -0
- package/dist/chunk-VIV3MSIX.cjs.map +1 -0
- package/dist/{chunk-26VE4IGU.js → chunk-WWRIMXSN.js} +3 -3
- package/dist/chunk-XBVXMQBW.js +217 -0
- package/dist/chunk-XBVXMQBW.js.map +1 -0
- package/dist/{chunk-LIW7KW2L.cjs → chunk-XC3C2W4M.cjs} +3 -3
- package/dist/{chunk-LIW7KW2L.cjs.map → chunk-XC3C2W4M.cjs.map} +1 -1
- package/dist/chunk-XMCL3F4W.js +129 -0
- package/dist/chunk-XMCL3F4W.js.map +1 -0
- package/dist/{chunk-REVHYI2O.js → chunk-XXLYUZY4.js} +4 -4
- package/dist/{chunk-4UR2T76K.js → chunk-Y7YEI6T2.js} +3 -3
- package/dist/{chunk-27MWGFXR.cjs → chunk-YCCBMAN2.cjs} +9 -7
- package/dist/chunk-YCCBMAN2.cjs.map +1 -0
- package/dist/{chunk-SJWL6EMI.js → chunk-ZZW7JZ2U.js} +3 -3
- package/dist/helpers/index.cjs +4 -2
- package/dist/helpers/index.cjs.map +1 -1
- package/dist/helpers/index.d.cts +25 -1
- package/dist/helpers/index.d.ts +25 -1
- package/dist/helpers/index.js +3 -1
- package/dist/hooks/index.cjs +14 -14
- package/dist/hooks/index.cjs.map +1 -1
- package/dist/hooks/index.d.cts +1 -1
- package/dist/hooks/index.d.ts +1 -1
- package/dist/hooks/index.js +18 -18
- package/dist/hooks/useClientValidation/index.cjs +5 -5
- package/dist/hooks/useClientValidation/index.d.cts +2 -2
- package/dist/hooks/useClientValidation/index.d.ts +2 -2
- package/dist/hooks/useClientValidation/index.js +4 -4
- package/dist/hooks/useController/index.cjs +4 -4
- package/dist/hooks/useController/index.js +3 -3
- package/dist/hooks/useFormContext/index.cjs +4 -4
- package/dist/hooks/useFormContext/index.js +3 -3
- package/dist/hooks/useUniformField/index.cjs +6 -6
- package/dist/hooks/useUniformField/index.js +5 -5
- package/dist/hooks/useUniformFieldArray/index.cjs +7 -7
- package/dist/hooks/useUniformFieldArray/index.js +6 -6
- package/dist/hooks/useWatchUserChange/index.cjs +5 -5
- package/dist/hooks/useWatchUserChange/index.js +4 -4
- package/dist/index.cjs +38 -24
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +7 -5
- package/dist/index.d.ts +7 -5
- package/dist/index.js +45 -31
- package/package.json +13 -2
- package/dist/chunk-27MWGFXR.cjs.map +0 -1
- package/dist/chunk-DJKC3SR6.js +0 -105
- package/dist/chunk-DJKC3SR6.js.map +0 -1
- package/dist/chunk-HUDJU756.cjs +0 -170
- package/dist/chunk-HUDJU756.cjs.map +0 -1
- package/dist/chunk-NI3WUU7T.cjs +0 -105
- package/dist/chunk-NI3WUU7T.cjs.map +0 -1
- package/dist/chunk-O2XJNQQK.js.map +0 -1
- package/dist/chunk-OKJWLH7T.cjs.map +0 -1
- package/dist/chunk-OZQQSTVH.js.map +0 -1
- package/dist/chunk-PHMEYG5F.js.map +0 -1
- package/dist/chunk-QLMUUXQO.cjs.map +0 -1
- package/dist/chunk-U4D6YJ6Z.js +0 -170
- package/dist/chunk-U4D6YJ6Z.js.map +0 -1
- /package/dist/{chunk-T6G6NGLL.js.map → chunk-246OISWB.js.map} +0 -0
- /package/dist/{chunk-RCLQ6NFK.js.map → chunk-A3PYIWG2.js.map} +0 -0
- /package/dist/{chunk-KE5DB3DZ.js.map → chunk-CEVS6WSG.js.map} +0 -0
- /package/dist/{chunk-VIK6VTAZ.js.map → chunk-CG7GDQAP.js.map} +0 -0
- /package/dist/{chunk-77OMBV7C.js.map → chunk-DQAZSXD6.js.map} +0 -0
- /package/dist/{chunk-5MTIQ6WD.js.map → chunk-GE7HUIAK.js.map} +0 -0
- /package/dist/{chunk-LO7UKHOS.js.map → chunk-IKOYYA75.js.map} +0 -0
- /package/dist/{chunk-F3WXUKZG.js.map → chunk-JICFOKDO.js.map} +0 -0
- /package/dist/{chunk-YBLDWOOG.js.map → chunk-MHQ2V7UW.js.map} +0 -0
- /package/dist/{chunk-IV45K4WU.js.map → chunk-TUIK3MER.js.map} +0 -0
- /package/dist/{chunk-26VE4IGU.js.map → chunk-WWRIMXSN.js.map} +0 -0
- /package/dist/{chunk-REVHYI2O.js.map → chunk-XXLYUZY4.js.map} +0 -0
- /package/dist/{chunk-4UR2T76K.js.map → chunk-Y7YEI6T2.js.map} +0 -0
- /package/dist/{chunk-SJWL6EMI.js.map → chunk-ZZW7JZ2U.js.map} +0 -0
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as tailwind_variants from 'tailwind-variants';
|
|
3
|
+
import { TVClassName } from '@fuf-stack/pixel-utils';
|
|
4
|
+
import { SwitchProps } from '@heroui/switch';
|
|
5
|
+
import { ReactNode } from 'react';
|
|
6
|
+
|
|
7
|
+
declare const switchBoxVariants: tailwind_variants.TVReturnType<{
|
|
8
|
+
isDisabled: {
|
|
9
|
+
true: {
|
|
10
|
+
box: string;
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
isInvalid: {
|
|
14
|
+
true: {
|
|
15
|
+
box: string;
|
|
16
|
+
label: string;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
size: {
|
|
20
|
+
sm: {
|
|
21
|
+
box: string;
|
|
22
|
+
description: string;
|
|
23
|
+
label: string;
|
|
24
|
+
};
|
|
25
|
+
md: {
|
|
26
|
+
box: string;
|
|
27
|
+
description: string;
|
|
28
|
+
label: string;
|
|
29
|
+
};
|
|
30
|
+
lg: {
|
|
31
|
+
box: string;
|
|
32
|
+
description: string;
|
|
33
|
+
label: string;
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
}, {
|
|
37
|
+
box: string;
|
|
38
|
+
description: string;
|
|
39
|
+
icon: string;
|
|
40
|
+
label: string;
|
|
41
|
+
wrapper: string;
|
|
42
|
+
thumb: string;
|
|
43
|
+
thumbIcon: string;
|
|
44
|
+
}, undefined, {
|
|
45
|
+
isDisabled: {
|
|
46
|
+
true: {
|
|
47
|
+
box: string;
|
|
48
|
+
};
|
|
49
|
+
};
|
|
50
|
+
isInvalid: {
|
|
51
|
+
true: {
|
|
52
|
+
box: string;
|
|
53
|
+
label: string;
|
|
54
|
+
};
|
|
55
|
+
};
|
|
56
|
+
size: {
|
|
57
|
+
sm: {
|
|
58
|
+
box: string;
|
|
59
|
+
description: string;
|
|
60
|
+
label: string;
|
|
61
|
+
};
|
|
62
|
+
md: {
|
|
63
|
+
box: string;
|
|
64
|
+
description: string;
|
|
65
|
+
label: string;
|
|
66
|
+
};
|
|
67
|
+
lg: {
|
|
68
|
+
box: string;
|
|
69
|
+
description: string;
|
|
70
|
+
label: string;
|
|
71
|
+
};
|
|
72
|
+
};
|
|
73
|
+
}, {
|
|
74
|
+
box: string;
|
|
75
|
+
description: string;
|
|
76
|
+
icon: string;
|
|
77
|
+
label: string;
|
|
78
|
+
wrapper: string;
|
|
79
|
+
thumb: string;
|
|
80
|
+
thumbIcon: string;
|
|
81
|
+
}, tailwind_variants.TVReturnType<{
|
|
82
|
+
isDisabled: {
|
|
83
|
+
true: {
|
|
84
|
+
box: string;
|
|
85
|
+
};
|
|
86
|
+
};
|
|
87
|
+
isInvalid: {
|
|
88
|
+
true: {
|
|
89
|
+
box: string;
|
|
90
|
+
label: string;
|
|
91
|
+
};
|
|
92
|
+
};
|
|
93
|
+
size: {
|
|
94
|
+
sm: {
|
|
95
|
+
box: string;
|
|
96
|
+
description: string;
|
|
97
|
+
label: string;
|
|
98
|
+
};
|
|
99
|
+
md: {
|
|
100
|
+
box: string;
|
|
101
|
+
description: string;
|
|
102
|
+
label: string;
|
|
103
|
+
};
|
|
104
|
+
lg: {
|
|
105
|
+
box: string;
|
|
106
|
+
description: string;
|
|
107
|
+
label: string;
|
|
108
|
+
};
|
|
109
|
+
};
|
|
110
|
+
}, {
|
|
111
|
+
box: string;
|
|
112
|
+
description: string;
|
|
113
|
+
icon: string;
|
|
114
|
+
label: string;
|
|
115
|
+
wrapper: string;
|
|
116
|
+
thumb: string;
|
|
117
|
+
thumbIcon: string;
|
|
118
|
+
}, undefined, unknown, unknown, undefined>>;
|
|
119
|
+
type ClassName = TVClassName<typeof switchBoxVariants>;
|
|
120
|
+
interface SwitchBoxProps {
|
|
121
|
+
/** CSS class name */
|
|
122
|
+
className?: ClassName;
|
|
123
|
+
/** Description text displayed below the label */
|
|
124
|
+
description?: ReactNode;
|
|
125
|
+
/** whether the switch should be disabled */
|
|
126
|
+
disabled?: boolean;
|
|
127
|
+
/** Icon to be displayed in the box */
|
|
128
|
+
icon?: ReactNode;
|
|
129
|
+
/** component displayed as the label */
|
|
130
|
+
label?: ReactNode;
|
|
131
|
+
/** name the field is registered under */
|
|
132
|
+
name: string;
|
|
133
|
+
/** whether the field is required */
|
|
134
|
+
required?: boolean;
|
|
135
|
+
size?: 'sm' | 'md' | 'lg';
|
|
136
|
+
/** HTML data-testid attribute used in e2e tests */
|
|
137
|
+
testId?: string;
|
|
138
|
+
/** Icon to be displayed inside the thumb */
|
|
139
|
+
thumbIcon?: SwitchProps['thumbIcon'];
|
|
140
|
+
}
|
|
141
|
+
/**
|
|
142
|
+
* SwitchBox component - A card-like box with a switch control
|
|
143
|
+
*/
|
|
144
|
+
declare const SwitchBox: ({ className, description, icon, name, size, thumbIcon, ...uniformFieldProps }: SwitchBoxProps) => react_jsx_runtime.JSX.Element;
|
|
145
|
+
|
|
146
|
+
export { SwitchBox as S, type SwitchBoxProps as a, switchBoxVariants as s };
|
package/dist/TextArea/index.cjs
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunkSR76XJW4cjs = require('../chunk-SR76XJW4.cjs');
|
|
5
5
|
require('../chunk-KWJMKX5J.cjs');
|
|
6
|
+
require('../chunk-MEYGGRBQ.cjs');
|
|
7
|
+
require('../chunk-NKIZA3ZO.cjs');
|
|
8
|
+
require('../chunk-6RZT2BKH.cjs');
|
|
6
9
|
require('../chunk-NTOYCWCJ.cjs');
|
|
7
|
-
require('../chunk-
|
|
8
|
-
require('../chunk-27MWGFXR.cjs');
|
|
10
|
+
require('../chunk-YCCBMAN2.cjs');
|
|
9
11
|
require('../chunk-OE5BOGGX.cjs');
|
|
10
12
|
require('../chunk-NHEZXA4H.cjs');
|
|
11
|
-
require('../chunk-
|
|
13
|
+
require('../chunk-NV4YVZYX.cjs');
|
|
14
|
+
require('../chunk-UUGUQGMX.cjs');
|
|
15
|
+
require('../chunk-UBLASN6D.cjs');
|
|
12
16
|
require('../chunk-PCTYJUY7.cjs');
|
|
13
17
|
require('../chunk-56TQOKG7.cjs');
|
|
14
|
-
require('../chunk-
|
|
15
|
-
require('../chunk-2UQCRQEJ.cjs');
|
|
16
|
-
require('../chunk-FYN7ZWLW.cjs');
|
|
17
|
-
require('../chunk-AQJLKHAE.cjs');
|
|
18
|
-
require('../chunk-OKJWLH7T.cjs');
|
|
18
|
+
require('../chunk-TKICOKNS.cjs');
|
|
19
19
|
require('../chunk-555JRYCS.cjs');
|
|
20
20
|
|
|
21
21
|
|
|
22
22
|
|
|
23
|
-
exports.TextArea =
|
|
23
|
+
exports.TextArea = _chunkSR76XJW4cjs.TextArea_default; exports.default = _chunkSR76XJW4cjs.TextArea_default2;
|
|
24
24
|
//# sourceMappingURL=index.cjs.map
|
package/dist/TextArea/index.js
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import {
|
|
2
2
|
TextArea_default,
|
|
3
3
|
TextArea_default2
|
|
4
|
-
} from "../chunk-
|
|
4
|
+
} from "../chunk-JICFOKDO.js";
|
|
5
5
|
import "../chunk-V3GDAELU.js";
|
|
6
|
+
import "../chunk-DQAZSXD6.js";
|
|
7
|
+
import "../chunk-IKOYYA75.js";
|
|
8
|
+
import "../chunk-WWRIMXSN.js";
|
|
6
9
|
import "../chunk-ZJDU5EPE.js";
|
|
7
|
-
import "../chunk-
|
|
8
|
-
import "../chunk-OZQQSTVH.js";
|
|
10
|
+
import "../chunk-7FOSZV75.js";
|
|
9
11
|
import "../chunk-NTDKZW4E.js";
|
|
10
12
|
import "../chunk-ELYGQTXB.js";
|
|
11
|
-
import "../chunk-
|
|
13
|
+
import "../chunk-GE7HUIAK.js";
|
|
14
|
+
import "../chunk-ZZW7JZ2U.js";
|
|
15
|
+
import "../chunk-TUIK3MER.js";
|
|
12
16
|
import "../chunk-AHJJIANM.js";
|
|
13
17
|
import "../chunk-CNTOODUQ.js";
|
|
14
|
-
import "../chunk-
|
|
15
|
-
import "../chunk-26VE4IGU.js";
|
|
16
|
-
import "../chunk-SJWL6EMI.js";
|
|
17
|
-
import "../chunk-IV45K4WU.js";
|
|
18
|
-
import "../chunk-O2XJNQQK.js";
|
|
18
|
+
import "../chunk-BOCYHTFE.js";
|
|
19
19
|
import "../chunk-K2V4ULA2.js";
|
|
20
20
|
export {
|
|
21
21
|
TextArea_default as TextArea,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
useUniformField
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-7FOSZV75.js";
|
|
4
4
|
import {
|
|
5
5
|
__objRest,
|
|
6
6
|
__spreadValues
|
|
@@ -113,4 +113,4 @@ export {
|
|
|
113
113
|
Radios_default,
|
|
114
114
|
Radios_default2
|
|
115
115
|
};
|
|
116
|
-
//# sourceMappingURL=chunk-
|
|
116
|
+
//# sourceMappingURL=chunk-246OISWB.js.map
|
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
|
+
|
|
3
|
+
var _chunkYCCBMAN2cjs = require('./chunk-YCCBMAN2.cjs');
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
var _chunk555JRYCScjs = require('./chunk-555JRYCS.cjs');
|
|
9
|
+
|
|
10
|
+
// src/Slider/Slider.tsx
|
|
11
|
+
var _react = require('react');
|
|
12
|
+
var _slider = require('@heroui/slider');
|
|
13
|
+
var _visuallyhidden = require('@react-aria/visually-hidden');
|
|
14
|
+
var _pixelutils = require('@fuf-stack/pixel-utils');
|
|
15
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
16
|
+
var sliderVariants = _pixelutils.tv.call(void 0, {
|
|
17
|
+
slots: {
|
|
18
|
+
base: "group",
|
|
19
|
+
endContent: "",
|
|
20
|
+
errorMessage: "ml-1 mt-1",
|
|
21
|
+
filler: "",
|
|
22
|
+
// see HeroUI styles for group-data condition,
|
|
23
|
+
// e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts
|
|
24
|
+
label: 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-["*"]',
|
|
25
|
+
labelWrapper: "",
|
|
26
|
+
mark: "",
|
|
27
|
+
startContent: "",
|
|
28
|
+
step: "",
|
|
29
|
+
thumb: "",
|
|
30
|
+
track: "",
|
|
31
|
+
trackWrapper: "",
|
|
32
|
+
value: ""
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
var Slider = (_a) => {
|
|
36
|
+
var _b = _a, {
|
|
37
|
+
className = void 0,
|
|
38
|
+
endContent = void 0,
|
|
39
|
+
fillOffset = void 0,
|
|
40
|
+
name,
|
|
41
|
+
showSteps = false,
|
|
42
|
+
size = "md",
|
|
43
|
+
startContent = void 0,
|
|
44
|
+
step = 1,
|
|
45
|
+
minValue = 0,
|
|
46
|
+
maxValue = 100
|
|
47
|
+
} = _b, uniformFieldProps = _chunk555JRYCScjs.__objRest.call(void 0, _b, [
|
|
48
|
+
"className",
|
|
49
|
+
"endContent",
|
|
50
|
+
"fillOffset",
|
|
51
|
+
"name",
|
|
52
|
+
"showSteps",
|
|
53
|
+
"size",
|
|
54
|
+
"startContent",
|
|
55
|
+
"step",
|
|
56
|
+
"minValue",
|
|
57
|
+
"maxValue"
|
|
58
|
+
]);
|
|
59
|
+
const {
|
|
60
|
+
disabled,
|
|
61
|
+
field,
|
|
62
|
+
getErrorMessageProps,
|
|
63
|
+
getHelperWrapperProps,
|
|
64
|
+
invalid,
|
|
65
|
+
label,
|
|
66
|
+
onBlur,
|
|
67
|
+
onChange,
|
|
68
|
+
ref,
|
|
69
|
+
required,
|
|
70
|
+
errorMessage,
|
|
71
|
+
testId
|
|
72
|
+
} = _chunkYCCBMAN2cjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
|
|
73
|
+
name
|
|
74
|
+
}, uniformFieldProps));
|
|
75
|
+
const visualSliderRef = _react.useRef.call(void 0, null);
|
|
76
|
+
const variants = sliderVariants();
|
|
77
|
+
const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
|
|
78
|
+
const currentValue = field.value != null ? Number(field.value) : minValue;
|
|
79
|
+
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
80
|
+
"div",
|
|
81
|
+
{
|
|
82
|
+
className: classNames.base,
|
|
83
|
+
"data-invalid": invalid,
|
|
84
|
+
"data-required": required,
|
|
85
|
+
"data-testid": testId,
|
|
86
|
+
children: [
|
|
87
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _visuallyhidden.VisuallyHidden, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
88
|
+
"input",
|
|
89
|
+
{
|
|
90
|
+
ref,
|
|
91
|
+
"aria-label": typeof label === "string" ? label : name,
|
|
92
|
+
disabled,
|
|
93
|
+
max: maxValue,
|
|
94
|
+
min: minValue,
|
|
95
|
+
name,
|
|
96
|
+
onBlur,
|
|
97
|
+
step,
|
|
98
|
+
tabIndex: -1,
|
|
99
|
+
type: "range",
|
|
100
|
+
value: currentValue,
|
|
101
|
+
onChange: (e) => {
|
|
102
|
+
onChange(Number(e.target.value));
|
|
103
|
+
},
|
|
104
|
+
onFocus: () => {
|
|
105
|
+
var _a2;
|
|
106
|
+
(_a2 = visualSliderRef.current) == null ? void 0 : _a2.focus();
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
) }),
|
|
110
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
111
|
+
_slider.Slider,
|
|
112
|
+
{
|
|
113
|
+
ref: visualSliderRef,
|
|
114
|
+
color: invalid ? "danger" : "primary",
|
|
115
|
+
endContent,
|
|
116
|
+
fillOffset,
|
|
117
|
+
isDisabled: disabled,
|
|
118
|
+
label,
|
|
119
|
+
maxValue,
|
|
120
|
+
minValue,
|
|
121
|
+
name: `${name}_slider`,
|
|
122
|
+
showSteps,
|
|
123
|
+
size,
|
|
124
|
+
startContent,
|
|
125
|
+
step,
|
|
126
|
+
value: currentValue,
|
|
127
|
+
classNames: {
|
|
128
|
+
endContent: classNames.endContent,
|
|
129
|
+
filler: classNames.filler,
|
|
130
|
+
label: classNames.label,
|
|
131
|
+
labelWrapper: classNames.labelWrapper,
|
|
132
|
+
mark: classNames.mark,
|
|
133
|
+
startContent: classNames.startContent,
|
|
134
|
+
step: classNames.step,
|
|
135
|
+
thumb: classNames.thumb,
|
|
136
|
+
track: classNames.track,
|
|
137
|
+
trackWrapper: classNames.trackWrapper,
|
|
138
|
+
value: classNames.value
|
|
139
|
+
},
|
|
140
|
+
onChange: (value) => {
|
|
141
|
+
onChange(value);
|
|
142
|
+
},
|
|
143
|
+
onChangeEnd: (_value) => {
|
|
144
|
+
onBlur();
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
),
|
|
148
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, getHelperWrapperProps()), { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, getErrorMessageProps()), { children: errorMessage })) }))
|
|
149
|
+
]
|
|
150
|
+
}
|
|
151
|
+
);
|
|
152
|
+
};
|
|
153
|
+
var Slider_default = Slider;
|
|
154
|
+
|
|
155
|
+
// src/Slider/index.ts
|
|
156
|
+
var Slider_default2 = Slider_default;
|
|
157
|
+
|
|
158
|
+
|
|
159
|
+
|
|
160
|
+
|
|
161
|
+
exports.Slider_default = Slider_default; exports.Slider_default2 = Slider_default2;
|
|
162
|
+
//# sourceMappingURL=chunk-2OXNDD5W.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-2OXNDD5W.cjs","../src/Slider/Slider.tsx","../src/Slider/index.ts"],"names":["_a","Slider_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-2OXNDD5W.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Slider as HeroUISlider } from '@heroui/slider';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField/useUniformField';\n\nexport const sliderVariants = tv({\n slots: {\n base: 'group',\n endContent: '',\n errorMessage: 'ml-1 mt-1',\n filler: '',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n labelWrapper: '',\n mark: '',\n startContent: '',\n step: '',\n thumb: '',\n track: '',\n trackWrapper: '',\n value: '',\n },\n});\n\ntype VariantProps = TVProps<typeof sliderVariants>;\ntype ClassName = TVClassName<typeof sliderVariants>;\n\nexport interface SliderProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** input field is disabled */\n disabled?: boolean;\n /** Content to display at the end of the slider */\n endContent?: ReactNode;\n /** The offset from where the fill should start */\n fillOffset?: number;\n /** form field label (set to false to disable label) */\n label?: string | false;\n /** form field name */\n name: string;\n /**\n * Whether to show step dots on the slider\n * @default false\n */\n showSteps?: boolean;\n /**\n * The size of the slider\n * @default \"md\"\n */\n size?: 'sm' | 'md' | 'lg';\n /** Content to display at the start of the slider */\n startContent?: ReactNode;\n /**\n * The step value of the slider\n * @default 1\n */\n step?: number;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /**\n * The minimum value of the slider\n * @default 0\n */\n minValue?: number;\n /**\n * The maximum value of the slider\n * @default 100\n */\n maxValue?: number;\n}\n\n/**\n * Slider component based on [HeroUI Slider](https://www.heroui.com//docs/components/slider)\n */\nconst Slider = ({\n className = undefined,\n endContent = undefined,\n fillOffset = undefined,\n name,\n showSteps = false,\n size = 'md',\n startContent = undefined,\n step = 1,\n minValue = 0,\n maxValue = 100,\n ...uniformFieldProps\n}: SliderProps) => {\n const {\n disabled,\n field,\n getErrorMessageProps,\n getHelperWrapperProps,\n invalid,\n label,\n onBlur,\n onChange,\n ref,\n required,\n errorMessage,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Ref for the visual slider to forward focus\n const visualSliderRef = useRef<HTMLDivElement>(null);\n\n // classNames from slots\n const variants = sliderVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n // Get the current value, defaulting to minValue if null/undefined\n const currentValue = field.value != null ? Number(field.value) : minValue;\n\n return (\n <div\n className={classNames.base}\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n >\n {/* Visually hidden input for form accessibility and focus management */}\n <VisuallyHidden>\n <input\n ref={ref}\n aria-label={typeof label === 'string' ? label : name}\n disabled={disabled}\n max={maxValue}\n min={minValue}\n name={name}\n onBlur={onBlur}\n step={step}\n tabIndex={-1}\n type=\"range\"\n value={currentValue}\n onChange={(e) => {\n onChange(Number(e.target.value));\n }}\n onFocus={() => {\n // When RHF focuses this hidden input (e.g., on validation error),\n // forward focus to the visual slider to show focus ring\n visualSliderRef.current?.focus();\n }}\n />\n </VisuallyHidden>\n {/* Visual HeroUISlider component */}\n <HeroUISlider\n ref={visualSliderRef}\n color={invalid ? 'danger' : 'primary'}\n endContent={endContent}\n fillOffset={fillOffset}\n isDisabled={disabled}\n label={label}\n maxValue={maxValue}\n minValue={minValue}\n name={`${name}_slider`}\n showSteps={showSteps}\n size={size}\n startContent={startContent}\n step={step}\n value={currentValue}\n classNames={{\n endContent: classNames.endContent,\n filler: classNames.filler,\n label: classNames.label,\n labelWrapper: classNames.labelWrapper,\n mark: classNames.mark,\n startContent: classNames.startContent,\n step: classNames.step,\n thumb: classNames.thumb,\n track: classNames.track,\n trackWrapper: classNames.trackWrapper,\n value: classNames.value,\n }}\n onChange={(value) => {\n onChange(value);\n }}\n onChangeEnd={(_value) => {\n onBlur();\n }}\n />\n <div {...getHelperWrapperProps()}>\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n </div>\n );\n};\n\nexport default Slider;\n","import Slider from './Slider';\n\nexport type { SliderProps } from './Slider';\n\nexport { Slider };\n\nexport default Slider;\n"]}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunkUUGUQGMXcjs = require('./chunk-UUGUQGMX.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _chunkTKICOKNScjs = require('./chunk-TKICOKNS.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
var _chunk555JRYCScjs = require('./chunk-555JRYCS.cjs');
|
|
@@ -17,7 +17,7 @@ var useClientValidation = (data, schemaFactory, options) => {
|
|
|
17
17
|
formState: { touchedFields },
|
|
18
18
|
validation: { setClientValidationSchema },
|
|
19
19
|
trigger
|
|
20
|
-
} =
|
|
20
|
+
} = _chunkUUGUQGMXcjs.useFormContext.call(void 0, );
|
|
21
21
|
const autoGeneratedKey = _react.useId.call(void 0, );
|
|
22
22
|
const key = (_a = options == null ? void 0 : options.key) != null ? _a : autoGeneratedKey;
|
|
23
23
|
const dataHash = JSON.stringify(data);
|
|
@@ -45,7 +45,7 @@ var clientValidationSchemaByName = (name, fieldSchema) => {
|
|
|
45
45
|
for (let i = segments.length - 1; i >= 0; i -= 1) {
|
|
46
46
|
const segment = segments[i];
|
|
47
47
|
const isNumeric = /^\d+$/.test(segment);
|
|
48
|
-
const isFlatArrayKey = segment ===
|
|
48
|
+
const isFlatArrayKey = segment === _chunkTKICOKNScjs.flatArrayKey;
|
|
49
49
|
if (isFlatArrayKey) {
|
|
50
50
|
continue;
|
|
51
51
|
}
|
|
@@ -65,4 +65,4 @@ var clientValidationSchemaByName = (name, fieldSchema) => {
|
|
|
65
65
|
|
|
66
66
|
|
|
67
67
|
exports.useClientValidation = useClientValidation; exports.clientValidationSchemaByName = clientValidationSchemaByName;
|
|
68
|
-
//# sourceMappingURL=chunk-
|
|
68
|
+
//# sourceMappingURL=chunk-6RZT2BKH.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-2UQCRQEJ.cjs","../src/hooks/useClientValidation/useClientValidation.ts"],"names":[],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-2UQCRQEJ.cjs","sourcesContent":[null,"import type { VetoTypeAny } from '@fuf-stack/veto';\n\nimport { useEffect, useId } from 'react';\n\nimport { array, objectLoose } from '@fuf-stack/veto';\n\nimport { flatArrayKey } from '../../helpers';\nimport { useFormContext } from '../useFormContext/useFormContext';\n\n/**\n * Hook for adding dynamic client-side validation to forms.\n *\n * Client validation is used for context-dependent validation rules that require external data\n * (e.g., checking if a username already exists). It complements base validation (passed to Form),\n * which handles static rules like \"required\", min/max length, format, etc.\n *\n * **Typical pattern:**\n * - Base validation: Static, always-on rules (required, format, length constraints)\n * - Client validation: Dynamic rules based on external data (uniqueness, business logic)\n * - Client schemas should use `.nullish()` to allow empty values (base validation handles \"required\")\n *\n * Automatically manages validation schema lifecycle: sets schema when data is provided,\n * clears schema when data is null/undefined, and cleans up on unmount. When the client\n * validation schema changes, automatically re-validates all touched fields.\n *\n * @param data - Data to create validation schema from (or null/undefined to clear validation)\n * @param schemaFactory - Function that creates a validation schema from the data. Schemas should typically use `.nullish()`.\n * @param options - Optional configuration object\n * @param options.key - Optional custom key for registration. Useful when multiple instances should share validation (e.g., in field arrays)\n *\n * @example\n * ```tsx\n * // Base validation handles \"required\" and format\n * const baseSchema = veto({ username: vt.string({ min: 3 }) });\n *\n * // Client validation adds dynamic uniqueness check\n * const { data: teamData } = useTeamQuery(teamId);\n * useClientValidation(teamData, (data) =>\n * vt.objectLoose({\n * username: vt.string()\n * .refine(\n * (value) => !data.existingUsers.includes(value),\n * { message: 'Username already exists' }\n * )\n * .nullish() // Allow empty - base validation handles \"required\"\n * })\n * );\n * ```\n *\n * @example\n * ```tsx\n * // Using custom key in a field array to avoid multiple registrations\n * fields.map((field, index) => (\n * useClientValidation(\n * userData,\n * (data) => clientValidationSchemaByName(\n * `items.${index}.name`,\n * vt.string()\n * .refine((val) => !data.forbidden.includes(val), { message: 'Name not allowed' })\n * .nullish()\n * ),\n * { key: 'items-validation' } // All instances share the same key\n * )\n * ));\n * ```\n */\nexport const useClientValidation = <TData = unknown>(\n data: TData | null | undefined,\n schemaFactory: (data: TData) => VetoTypeAny,\n options?: { key?: string },\n): void => {\n const {\n formState: { touchedFields },\n validation: { setClientValidationSchema },\n trigger,\n } = useFormContext();\n\n // Use provided key or auto-generate unique key\n const autoGeneratedKey = useId();\n const key = options?.key ?? autoGeneratedKey;\n\n // Use data hash instead of object reference to avoid unnecessary re-runs\n // when data object reference changes but data remains the same\n const dataHash = JSON.stringify(data);\n\n // Single effect to manage validation schema lifecycle\n useEffect(() => {\n // Set validation schema when data is available\n if (data != null) {\n const validationSchema = schemaFactory(data);\n setClientValidationSchema(key, validationSchema);\n } else {\n // Clear validation schema when no data\n setClientValidationSchema(key, null);\n }\n\n // Re-validate all touched fields when client validation schema changes\n const touchedFieldNames = Object.keys(touchedFields);\n if (touchedFieldNames.length > 0) {\n // Use setTimeout to ensure the client validation schema update has propagated\n // before triggering re-validation (fixes race condition)\n setTimeout(async () => {\n return trigger(touchedFieldNames);\n }, 1);\n }\n\n // Cleanup on unmount or when dependencies change\n return () => {\n setClientValidationSchema(key, null);\n };\n // Only re-run when data (dataHash) or key changes\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [dataHash, key]);\n};\n\n/**\n * Helper function to create a veto looseObject schema for a single field with nested path support.\n *\n * Parses field paths (dot-notation) and creates properly nested loose object schemas with array support.\n * All intermediate objects and arrays are marked as optional to allow partial data structures.\n * Numeric segments in the path are treated as array indices, and the parent field is wrapped in an array schema.\n * Supports flat arrays (arrays of primitives) via the special `__FLAT__` key.\n *\n * **Important:** The fieldSchema should typically use `.nullish()` to allow empty values. This is because:\n * - Base validation (passed to Form) handles \"required\" constraints\n * - Client validation adds dynamic, context-dependent rules (e.g., \"username already exists\")\n * - Form data processing converts empty strings in flat arrays to `null` (not `undefined`)\n * - `.nullish()` accepts both `null` and `undefined`, while `.optional()` only accepts `undefined`\n *\n * This pattern ensures client validation only validates non-empty values, while base validation\n * enforces required fields and basic constraints (min length, format, etc.).\n *\n * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name', 'tags.0.__FLAT__')\n * @param fieldSchema - The veto validation schema for the field. Should typically use `.nullish()` to allow empty values.\n * @returns A nested loose object schema matching the field path structure with proper type inference\n *\n * @example\n * ```tsx\n * // Typical usage: base validation handles \"required\", client validation adds dynamic rules\n * // Base validation (in Form component)\n * const baseSchema = veto({ username: vt.string({ min: 3 }) }); // Required + min length\n *\n * // Client validation (dynamic check for existing usernames)\n * const { data: userData } = useUserQuery(userId);\n * useClientValidation(userData, (data) =>\n * clientValidationSchemaByName(\n * 'username',\n * vt.string()\n * .refine(\n * (value) => !data.existingUsernames.includes(value),\n * { message: 'Username already taken' }\n * )\n * .nullish() // Allow empty - base validation handles \"required\"\n * )\n * );\n * ```\n *\n * @example\n * ```tsx\n * // Nested field path with dynamic validation\n * clientValidationSchemaByName(\n * 'user.profile.email',\n * vt.string()\n * .refine(\n * (value) => !reservedEmails.includes(value),\n * { message: 'This email is reserved' }\n * )\n * .nullish()\n * )\n * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: ... }).optional() }).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Array of objects with dynamic validation\n * clientValidationSchemaByName(\n * 'items.0.tag',\n * vt.string()\n * .refine((value) => !forbiddenTags.includes(value), { message: 'Tag not allowed' })\n * .nullish()\n * )\n * // => objectLoose({ items: array(objectLoose({ tag: ... })).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Flat array (array of primitives) with dynamic validation\n * clientValidationSchemaByName(\n * 'tags.0.__FLAT__',\n * vt.string()\n * .refine((value) => !forbiddenWords.includes(value), { message: 'Word not allowed' })\n * .nullish()\n * )\n * // => objectLoose({ tags: array(vt.string().refine(...).nullish()).optional() })\n * ```\n */\nexport const clientValidationSchemaByName = <T extends VetoTypeAny>(\n name: string,\n fieldSchema: T,\n) => {\n const segments = name.split('.');\n\n // Build schema from innermost to outermost\n let schema: VetoTypeAny = fieldSchema;\n\n // Process segments in reverse order to build nested structure\n for (let i = segments.length - 1; i >= 0; i -= 1) {\n const segment = segments[i];\n\n const isNumeric = /^\\d+$/.test(segment);\n const isFlatArrayKey = segment === flatArrayKey;\n\n if (isFlatArrayKey) {\n // Skip the __FLAT__ key - it's just a marker for flat arrays\n // The schema is already correct (primitive type), just continue\n // eslint-disable-next-line no-continue\n continue;\n }\n\n if (isNumeric) {\n // Current segment is an array index - wrap current schema in optional array\n schema = array(schema).optional();\n } else {\n // Current segment is a field name - wrap in objectLoose\n // Make it optional if it's an intermediate object (not the root)\n const obj = objectLoose({\n [segment]: schema,\n });\n schema = i > 0 ? obj.optional() : obj;\n }\n }\n\n return schema;\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-6RZT2BKH.cjs","../src/hooks/useClientValidation/useClientValidation.ts"],"names":[],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-6RZT2BKH.cjs","sourcesContent":[null,"import type { VetoTypeAny } from '@fuf-stack/veto';\n\nimport { useEffect, useId } from 'react';\n\nimport { array, objectLoose } from '@fuf-stack/veto';\n\nimport { flatArrayKey } from '../../helpers';\nimport { useFormContext } from '../useFormContext/useFormContext';\n\n/**\n * Hook for adding dynamic client-side validation to forms.\n *\n * Client validation is used for context-dependent validation rules that require external data\n * (e.g., checking if a username already exists). It complements base validation (passed to Form),\n * which handles static rules like \"required\", min/max length, format, etc.\n *\n * **Typical pattern:**\n * - Base validation: Static, always-on rules (required, format, length constraints)\n * - Client validation: Dynamic rules based on external data (uniqueness, business logic)\n * - Client schemas should use `.nullish()` to allow empty values (base validation handles \"required\")\n *\n * Automatically manages validation schema lifecycle: sets schema when data is provided,\n * clears schema when data is null/undefined, and cleans up on unmount. When the client\n * validation schema changes, automatically re-validates all touched fields.\n *\n * @param data - Data to create validation schema from (or null/undefined to clear validation)\n * @param schemaFactory - Function that creates a validation schema from the data. Schemas should typically use `.nullish()`.\n * @param options - Optional configuration object\n * @param options.key - Optional custom key for registration. Useful when multiple instances should share validation (e.g., in field arrays)\n *\n * @example\n * ```tsx\n * // Base validation handles \"required\" and format\n * const baseSchema = veto({ username: vt.string({ min: 3 }) });\n *\n * // Client validation adds dynamic uniqueness check\n * const { data: teamData } = useTeamQuery(teamId);\n * useClientValidation(teamData, (data) =>\n * vt.objectLoose({\n * username: vt.string()\n * .refine(\n * (value) => !data.existingUsers.includes(value),\n * { message: 'Username already exists' }\n * )\n * .nullish() // Allow empty - base validation handles \"required\"\n * })\n * );\n * ```\n *\n * @example\n * ```tsx\n * // Using custom key in a field array to avoid multiple registrations\n * fields.map((field, index) => (\n * useClientValidation(\n * userData,\n * (data) => clientValidationSchemaByName(\n * `items.${index}.name`,\n * vt.string()\n * .refine((val) => !data.forbidden.includes(val), { message: 'Name not allowed' })\n * .nullish()\n * ),\n * { key: 'items-validation' } // All instances share the same key\n * )\n * ));\n * ```\n */\nexport const useClientValidation = <TData = unknown>(\n data: TData | null | undefined,\n schemaFactory: (data: TData) => VetoTypeAny,\n options?: { key?: string },\n): void => {\n const {\n formState: { touchedFields },\n validation: { setClientValidationSchema },\n trigger,\n } = useFormContext();\n\n // Use provided key or auto-generate unique key\n const autoGeneratedKey = useId();\n const key = options?.key ?? autoGeneratedKey;\n\n // Use data hash instead of object reference to avoid unnecessary re-runs\n // when data object reference changes but data remains the same\n const dataHash = JSON.stringify(data);\n\n // Single effect to manage validation schema lifecycle\n useEffect(() => {\n // Set validation schema when data is available\n if (data != null) {\n const validationSchema = schemaFactory(data);\n setClientValidationSchema(key, validationSchema);\n } else {\n // Clear validation schema when no data\n setClientValidationSchema(key, null);\n }\n\n // Re-validate all touched fields when client validation schema changes\n const touchedFieldNames = Object.keys(touchedFields);\n if (touchedFieldNames.length > 0) {\n // Use setTimeout to ensure the client validation schema update has propagated\n // before triggering re-validation (fixes race condition)\n setTimeout(async () => {\n return trigger(touchedFieldNames);\n }, 1);\n }\n\n // Cleanup on unmount or when dependencies change\n return () => {\n setClientValidationSchema(key, null);\n };\n // Only re-run when data (dataHash) or key changes\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [dataHash, key]);\n};\n\n/**\n * Helper function to create a veto looseObject schema for a single field with nested path support.\n *\n * Parses field paths (dot-notation) and creates properly nested loose object schemas with array support.\n * All intermediate objects and arrays are marked as optional to allow partial data structures.\n * Numeric segments in the path are treated as array indices, and the parent field is wrapped in an array schema.\n * Supports flat arrays (arrays of primitives) via the special `__FLAT__` key.\n *\n * **Important:** The fieldSchema should typically use `.nullish()` to allow empty values. This is because:\n * - Base validation (passed to Form) handles \"required\" constraints\n * - Client validation adds dynamic, context-dependent rules (e.g., \"username already exists\")\n * - Form data processing converts empty strings in flat arrays to `null` (not `undefined`)\n * - `.nullish()` accepts both `null` and `undefined`, while `.optional()` only accepts `undefined`\n *\n * This pattern ensures client validation only validates non-empty values, while base validation\n * enforces required fields and basic constraints (min length, format, etc.).\n *\n * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name', 'tags.0.__FLAT__')\n * @param fieldSchema - The veto validation schema for the field. Should typically use `.nullish()` to allow empty values.\n * @returns A nested loose object schema matching the field path structure with proper type inference\n *\n * @example\n * ```tsx\n * // Typical usage: base validation handles \"required\", client validation adds dynamic rules\n * // Base validation (in Form component)\n * const baseSchema = veto({ username: vt.string({ min: 3 }) }); // Required + min length\n *\n * // Client validation (dynamic check for existing usernames)\n * const { data: userData } = useUserQuery(userId);\n * useClientValidation(userData, (data) =>\n * clientValidationSchemaByName(\n * 'username',\n * vt.string()\n * .refine(\n * (value) => !data.existingUsernames.includes(value),\n * { message: 'Username already taken' }\n * )\n * .nullish() // Allow empty - base validation handles \"required\"\n * )\n * );\n * ```\n *\n * @example\n * ```tsx\n * // Nested field path with dynamic validation\n * clientValidationSchemaByName(\n * 'user.profile.email',\n * vt.string()\n * .refine(\n * (value) => !reservedEmails.includes(value),\n * { message: 'This email is reserved' }\n * )\n * .nullish()\n * )\n * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: ... }).optional() }).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Array of objects with dynamic validation\n * clientValidationSchemaByName(\n * 'items.0.tag',\n * vt.string()\n * .refine((value) => !forbiddenTags.includes(value), { message: 'Tag not allowed' })\n * .nullish()\n * )\n * // => objectLoose({ items: array(objectLoose({ tag: ... })).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Flat array (array of primitives) with dynamic validation\n * clientValidationSchemaByName(\n * 'tags.0.__FLAT__',\n * vt.string()\n * .refine((value) => !forbiddenWords.includes(value), { message: 'Word not allowed' })\n * .nullish()\n * )\n * // => objectLoose({ tags: array(vt.string().refine(...).nullish()).optional() })\n * ```\n */\nexport const clientValidationSchemaByName = <T extends VetoTypeAny>(\n name: string,\n fieldSchema: T,\n) => {\n const segments = name.split('.');\n\n // Build schema from innermost to outermost\n let schema: VetoTypeAny = fieldSchema;\n\n // Process segments in reverse order to build nested structure\n for (let i = segments.length - 1; i >= 0; i -= 1) {\n const segment = segments[i];\n\n const isNumeric = /^\\d+$/.test(segment);\n const isFlatArrayKey = segment === flatArrayKey;\n\n if (isFlatArrayKey) {\n // Skip the __FLAT__ key - it's just a marker for flat arrays\n // The schema is already correct (primitive type), just continue\n // eslint-disable-next-line no-continue\n continue;\n }\n\n if (isNumeric) {\n // Current segment is an array index - wrap current schema in optional array\n schema = array(schema).optional();\n } else {\n // Current segment is a field name - wrap in objectLoose\n // Make it optional if it's an intermediate object (not the root)\n const obj = objectLoose({\n [segment]: schema,\n });\n schema = i > 0 ? obj.optional() : obj;\n }\n }\n\n return schema;\n};\n"]}
|
|
@@ -6,7 +6,10 @@ import {
|
|
|
6
6
|
} from "./chunk-ELYGQTXB.js";
|
|
7
7
|
import {
|
|
8
8
|
useController
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-GE7HUIAK.js";
|
|
10
|
+
import {
|
|
11
|
+
useFormContext
|
|
12
|
+
} from "./chunk-ZZW7JZ2U.js";
|
|
10
13
|
import {
|
|
11
14
|
useInput
|
|
12
15
|
} from "./chunk-AHJJIANM.js";
|
|
@@ -14,8 +17,8 @@ import {
|
|
|
14
17
|
useInputValueTransform
|
|
15
18
|
} from "./chunk-CNTOODUQ.js";
|
|
16
19
|
import {
|
|
17
|
-
|
|
18
|
-
} from "./chunk-
|
|
20
|
+
isTestEnvironment
|
|
21
|
+
} from "./chunk-BOCYHTFE.js";
|
|
19
22
|
import {
|
|
20
23
|
__spreadProps,
|
|
21
24
|
__spreadValues
|
|
@@ -26,8 +29,7 @@ import { useDebounce } from "@fuf-stack/pixels";
|
|
|
26
29
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
27
30
|
var useDebouncedInvalid = (invalid, delayMs) => {
|
|
28
31
|
const debouncedInvalid = useDebounce(invalid, delayMs);
|
|
29
|
-
|
|
30
|
-
if (isTest) {
|
|
32
|
+
if (isTestEnvironment()) {
|
|
31
33
|
return invalid;
|
|
32
34
|
}
|
|
33
35
|
return debouncedInvalid;
|
|
@@ -131,4 +133,4 @@ function useUniformField(params) {
|
|
|
131
133
|
export {
|
|
132
134
|
useUniformField
|
|
133
135
|
};
|
|
134
|
-
//# sourceMappingURL=chunk-
|
|
136
|
+
//# sourceMappingURL=chunk-7FOSZV75.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useUniformField/useUniformField.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { FieldError, FieldValues, Path } from 'react-hook-form';\nimport type { InputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\nimport React from 'react';\n\nimport { useDebounce } from '@fuf-stack/pixels';\n\nimport { isTestEnvironment } from '../../helpers';\nimport { FieldCopyTestIdButton } from '../../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../../partials/FieldValidationError';\nimport { useController } from '../useController/useController';\nimport { useFormContext } from '../useFormContext/useFormContext';\nimport { useInput } from '../useInput/useInput';\nimport { useInputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\n/**\n * Debounce invalid state changes to prevent UI flicker on rapid changes.\n *\n * Primary purpose: Reduce UI flicker when validation state changes rapidly\n * (e.g., during fast typing). Without debouncing, error messages would flash\n * in/out rapidly, creating a poor UX.\n *\n * Secondary benefit: When animations are enabled (default), gives time for\n * enter/exit animations to complete smoothly.\n *\n * Behavior:\n * - Debounces both true → false and false → true transitions by `delayMs`\n * - Disabled in test environments for immediate snapshots\n */\nconst useDebouncedInvalid = (invalid: boolean, delayMs: number) => {\n const debouncedInvalid = useDebounce(invalid, delayMs);\n\n // Disable debouncing in test environments for immediate snapshots\n if (isTestEnvironment()) {\n return invalid;\n }\n\n return debouncedInvalid;\n};\n\nexport interface UseUniformFieldParams<\n TFieldValues extends FieldValues = FieldValues,\n TDisplay = unknown,\n> {\n /** Form field name */\n name: Path<TFieldValues> & string;\n /** Disable the field */\n disabled?: boolean;\n /** Optional explicit test id used to build stable test ids */\n testId?: string;\n /** Optional label content; pass false to suppress label entirely */\n label?: ReactNode | false;\n /** Input type for special number handling */\n type?: 'text' | 'number' | 'password';\n /** Optional value transformation between form and display values */\n transform?: InputValueTransform<TDisplay>;\n}\n\nexport interface UseUniformFieldReturn<\n TFieldValues extends FieldValues = FieldValues,\n> {\n /** react-hook-form control instance for advanced integrations */\n control: ReturnType<typeof useFormContext<TFieldValues>>['control'];\n /** Debug mode from Uniform provider */\n debugMode: ReturnType<typeof useFormContext<TFieldValues>>['debugMode'];\n /** Current value used to initialize uncontrolled components */\n defaultValue: unknown;\n /** Whether the field is currently disabled (from RHF) */\n disabled: boolean | undefined;\n /** Validation error(s) for the field */\n error: FieldError[] | undefined;\n /** Pre-built errorMessage node to plug into components */\n errorMessage: ReactNode | null;\n /** RHF controller field with transformed value/onChange (use this for simple components) */\n field: ReturnType<typeof useController<TFieldValues>>['field'];\n /** Helper to spread standardized error message props to underlying components */\n getErrorMessageProps: ReturnType<typeof useInput>['getErrorMessageProps'];\n /** Helper to spread standardized helper wrapper props (for spacing/animation) */\n getHelperWrapperProps: ReturnType<typeof useInput>['getHelperWrapperProps'];\n /** Helper to spread standardized label props to underlying components */\n getLabelProps: ReturnType<typeof useInput>['getLabelProps'];\n /** Access current form values (converted to validation-friendly format) */\n getValues: ReturnType<typeof useFormContext<TFieldValues>>['getValues'];\n /** Whether the field should show invalid state (debounced for smooth animations). True when field is invalid AND (dirty OR touched OR submitted) */\n invalid: boolean;\n /** Computed label node including optional test id copy button */\n label: ReactNode | null;\n /** onBlur handler from controller */\n onBlur: ReturnType<typeof useController<TFieldValues>>['field']['onBlur'];\n /** onChange handler from controller (with transform applied) */\n onChange: ReturnType<typeof useController<TFieldValues>>['field']['onChange'];\n /** Ref to forward to underlying control */\n ref: ReturnType<typeof useController<TFieldValues>>['field']['ref'];\n /** Whether the field is required according to validation schema */\n required: boolean;\n /** Reset a specific field in the form */\n resetField: ReturnType<typeof useFormContext<TFieldValues>>['resetField'];\n /** Generated HTML data-testid for the field */\n testId: string;\n}\n\n/**\n * Combines frequently used form field logic into a single hook.\n *\n * Provides:\n * - Enhanced form context (validation-aware state, `testId`, value transforms)\n * - Controller field with nullish conversion handling\n * - Value transformation via `transform` prop:\n * • Allows disentangled display and form values (e.g., string ↔ object, boolean ↔ array)\n * • Automatically applies `toDisplayValue` to field value for components\n * • Automatically applies `toFormValue` to display value when onChange is called\n * • Works with `type` prop for automatic number/string conversion\n * • Examples: storing objects while displaying strings, storing booleans as arrays, enriching values with metadata\n * - Debounced `invalid` state with smart timing:\n * • `true` (field becomes invalid): applies immediately so errors show right away\n * • `false` (field becomes valid): delayed 200ms to allow smooth exit animations\n * • Respects `prefers-reduced-motion` by skipping delays when user prefers reduced motion\n * - Smart `invalid` visibility (via `showInvalid`):\n * • Shows errors when field is dirty OR touched OR form has been submitted\n * • Prevents showing errors on pristine/untouched fields for better UX\n * • Works well for all field types (text inputs, checkboxes, radios, arrays)\n * - Prebuilt `errorMessage` React node using `FieldValidationError`\n * - Computed `label` node which appends a `FieldCopyTestIdButton` in\n * `debug-testids` mode\n * - `defaultValue` for uncontrolled defaults and all usual field handlers\n * - Access to form utilities: `control`, `getValues`, `resetField`\n * - Presentation helpers: `getLabelProps`, `getErrorMessageProps`,\n * `getHelperWrapperProps` for consistent wiring to underlying UI components\n */\nexport function useUniformField<\n TFieldValues extends FieldValues = FieldValues,\n TDisplay = unknown,\n>(\n params: UseUniformFieldParams<TFieldValues, TDisplay>,\n): UseUniformFieldReturn<TFieldValues> {\n const {\n name,\n disabled = false,\n testId: explicitTestId,\n label,\n type,\n transform,\n } = params;\n\n const {\n control,\n debugMode,\n formState: { submitCount },\n getFieldState,\n getValues,\n resetField,\n } = useFormContext<TFieldValues>();\n\n const {\n error,\n invalid: rawInvalid,\n isDirty,\n isTouched,\n required,\n testId,\n } = getFieldState(name, explicitTestId);\n\n const { field } = useController<TFieldValues>({\n control,\n disabled,\n name,\n });\n const {\n onChange: fieldOnChange,\n value: fieldValue,\n disabled: isDisabled,\n onBlur,\n ref,\n } = field;\n\n // Get transform utilities (but don't apply them automatically)\n // Components can choose how to use them (directly or via useInputValueDebounce)\n const { toDisplayValue, toFormValue } = useInputValueTransform<TDisplay>({\n type,\n transform,\n });\n\n // For components without special needs: apply transform to value and onChange\n const transformedValue = toDisplayValue(fieldValue);\n const transformedOnChange = (eventOrValue: TDisplay | React.ChangeEvent) => {\n // Extract value from event or use value directly\n const displayValue =\n (eventOrValue as React.ChangeEvent<HTMLInputElement>)?.target?.value ??\n eventOrValue;\n const formValue = toFormValue(displayValue as TDisplay);\n fieldOnChange(formValue as typeof fieldValue);\n };\n\n const defaultValue = (getValues() as Record<string, unknown>)?.[\n name as string\n ];\n\n /**\n * Determine when to show the invalid state to the user.\n *\n * Show errors when the field is invalid AND any of these conditions are met:\n * - Field is dirty (value changed from initial) - good for checkboxes/radios/arrays\n * - Field is touched (focused and blurred) - good for text inputs\n * - Form has been submitted - shows all errors after submit attempt\n *\n * This prevents showing errors on pristine/untouched fields for better UX.\n * Examples:\n * - Text input: User loads form with empty required field → no error shown yet\n * - Text input: User focuses and blurs → error shows (via isTouched)\n * - Checkbox group: User clicks first checkbox → error shows immediately (via isDirty)\n * - Any field: User submits form → all errors show (via submitCount)\n *\n * The entire condition is debounced to prevent flickering and allow smooth animations\n * when any of the states (invalid, isDirty, isTouched, submitCount) change.\n */\n const showInvalid = rawInvalid && (isDirty || isTouched || submitCount > 0);\n const invalid = useDebouncedInvalid(showInvalid, 200);\n\n // Build a label node that:\n // - shows the provided label (unless explicitly set to false)\n // - appends a copy-to-clipboard button for the test id in `debug-testids` mode\n // Consumers can pass this directly to component `label` props\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const labelNode: ReactNode | null =\n !!label || showTestIdCopyButton ? (\n <>\n {label !== false ? label : null}\n {showTestIdCopyButton ? (\n <FieldCopyTestIdButton testId={testId} />\n ) : null}\n </>\n ) : null;\n\n // Ready-to-render error message; consumers can drop this into their\n // component `errorMessage` prop without repeating mapping/markup\n const errorMessage = <FieldValidationError error={error} testId={testId} />;\n\n // Generate standardized props for label, helper wrapper and error message\n // so consumers can spread them directly into UI components (e.g. HeroUI),\n // keeping animations/spacing consistent across fields\n const { getErrorMessageProps, getLabelProps, getHelperWrapperProps } =\n useInput({\n ref,\n classNames: {\n // set padding to 0 for error message exit animation\n helperWrapper: 'p-0',\n },\n errorMessage: JSON.stringify(error),\n isInvalid: invalid,\n isRequired: required,\n label,\n labelPlacement: 'outside',\n });\n\n return {\n control,\n debugMode,\n defaultValue,\n disabled: isDisabled,\n error,\n errorMessage,\n field: {\n ...field,\n value: transformedValue as typeof field.value,\n onChange: transformedOnChange as typeof field.onChange,\n },\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n getValues,\n invalid,\n label: labelNode,\n onBlur,\n onChange: transformedOnChange as typeof field.onChange,\n ref,\n required,\n resetField,\n testId,\n };\n}\n\nexport default useUniformField;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,SAAS,mBAAmB;AA4NtB,mBAGI,KAHJ;AApMN,IAAM,sBAAsB,CAAC,SAAkB,YAAoB;AACjE,QAAM,mBAAmB,YAAY,SAAS,OAAO;AAGrD,MAAI,kBAAkB,GAAG;AACvB,WAAO;AAAA,EACT;AAEA,SAAO;AACT;AA2FO,SAAS,gBAId,QACqC;AAvIvC;AAwIE,QAAM;AAAA,IACJ;AAAA,IACA,WAAW;AAAA,IACX,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,WAAW,EAAE,YAAY;AAAA,IACzB;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,eAA6B;AAEjC,QAAM;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,cAAc,MAAM,cAAc;AAEtC,QAAM,EAAE,MAAM,IAAI,cAA4B;AAAA,IAC5C;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM;AAAA,IACJ,UAAU;AAAA,IACV,OAAO;AAAA,IACP,UAAU;AAAA,IACV;AAAA,IACA;AAAA,EACF,IAAI;AAIJ,QAAM,EAAE,gBAAgB,YAAY,IAAI,uBAAiC;AAAA,IACvE;AAAA,IACA;AAAA,EACF,CAAC;AAGD,QAAM,mBAAmB,eAAe,UAAU;AAClD,QAAM,sBAAsB,CAAC,iBAA+C;AAzL9E,QAAAA,KAAA;AA2LI,UAAM,gBACH,MAAAA,MAAA,6CAAsD,WAAtD,gBAAAA,IAA8D,UAA9D,YACD;AACF,UAAM,YAAY,YAAY,YAAwB;AACtD,kBAAc,SAA8B;AAAA,EAC9C;AAEA,QAAM,gBAAgB,eAAU,MAAV,mBACpB;AAqBF,QAAM,cAAc,eAAe,WAAW,aAAa,cAAc;AACzE,QAAM,UAAU,oBAAoB,aAAa,GAAG;AAMpD,QAAM,uBAAuB,cAAc;AAC3C,QAAM,YACJ,CAAC,CAAC,SAAS,uBACT,iCACG;AAAA,cAAU,QAAQ,QAAQ;AAAA,IAC1B,uBACC,oBAAC,iCAAsB,QAAgB,IACrC;AAAA,KACN,IACE;AAIN,QAAM,eAAe,oBAAC,gCAAqB,OAAc,QAAgB;AAKzE,QAAM,EAAE,sBAAsB,eAAe,sBAAsB,IACjE,SAAS;AAAA,IACP;AAAA,IACA,YAAY;AAAA;AAAA,MAEV,eAAe;AAAA,IACjB;AAAA,IACA,cAAc,KAAK,UAAU,KAAK;AAAA,IAClC,WAAW;AAAA,IACX,YAAY;AAAA,IACZ;AAAA,IACA,gBAAgB;AAAA,EAClB,CAAC;AAEH,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,OAAO,iCACF,QADE;AAAA,MAEL,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":["_a"]}
|
|
@@ -3,16 +3,16 @@
|
|
|
3
3
|
var _chunkTTD3KL6Ecjs = require('./chunk-TTD3KL6E.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _chunkMEYGGRBQcjs = require('./chunk-MEYGGRBQ.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkYCCBMAN2cjs = require('./chunk-YCCBMAN2.cjs');
|
|
10
10
|
|
|
11
11
|
|
|
12
12
|
var _chunkNHEZXA4Hcjs = require('./chunk-NHEZXA4H.cjs');
|
|
13
13
|
|
|
14
14
|
|
|
15
|
-
var
|
|
15
|
+
var _chunkTKICOKNScjs = require('./chunk-TKICOKNS.cjs');
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
|
|
@@ -326,7 +326,7 @@ var FieldArrayLabel = ({
|
|
|
326
326
|
name
|
|
327
327
|
}) => {
|
|
328
328
|
var _a;
|
|
329
|
-
const { error, getLabelProps, invalid, label } =
|
|
329
|
+
const { error, getLabelProps, invalid, label } = _chunkYCCBMAN2cjs.useUniformField.call(void 0, {
|
|
330
330
|
name,
|
|
331
331
|
label: _label
|
|
332
332
|
});
|
|
@@ -367,7 +367,7 @@ var FieldArrayValidationError = ({
|
|
|
367
367
|
getHelperWrapperProps,
|
|
368
368
|
invalid,
|
|
369
369
|
testId
|
|
370
|
-
} =
|
|
370
|
+
} = _chunkYCCBMAN2cjs.useUniformField.call(void 0, {
|
|
371
371
|
name
|
|
372
372
|
});
|
|
373
373
|
const disableAnimation = _pixelmotion.useReducedMotion.call(void 0, );
|
|
@@ -598,7 +598,7 @@ var FieldArray = (_a) => {
|
|
|
598
598
|
elementInitialValue,
|
|
599
599
|
getValues,
|
|
600
600
|
testId
|
|
601
|
-
} =
|
|
601
|
+
} = _chunkMEYGGRBQcjs.useUniformFieldArray.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
|
|
602
602
|
name,
|
|
603
603
|
flat,
|
|
604
604
|
elementInitialValue: _elementInitialValue,
|
|
@@ -625,7 +625,7 @@ var FieldArray = (_a) => {
|
|
|
625
625
|
name,
|
|
626
626
|
sortable,
|
|
627
627
|
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "ul", { className: className.list, "data-testid": testId, children: fields.map((field, index) => {
|
|
628
|
-
const elementName = flat ? `${name}.${index}.${
|
|
628
|
+
const elementName = flat ? `${name}.${index}.${_chunkTKICOKNScjs.flatArrayKey}` : `${name}.${index}`;
|
|
629
629
|
const elementTestId = `${testId}_${index}`;
|
|
630
630
|
const elementMethods = {
|
|
631
631
|
append: () => {
|
|
@@ -634,7 +634,7 @@ var FieldArray = (_a) => {
|
|
|
634
634
|
duplicate: () => {
|
|
635
635
|
const values = getValues(name);
|
|
636
636
|
const currentValue = values[index];
|
|
637
|
-
const nextValue = flat ? { [
|
|
637
|
+
const nextValue = flat ? { [_chunkTKICOKNScjs.flatArrayKey]: currentValue } : currentValue;
|
|
638
638
|
insert(index + 1, nextValue);
|
|
639
639
|
},
|
|
640
640
|
insert: () => {
|
|
@@ -696,4 +696,4 @@ var FieldArray_default2 = FieldArray_default;
|
|
|
696
696
|
|
|
697
697
|
|
|
698
698
|
exports.FieldArray_default = FieldArray_default; exports.FieldArray_default2 = FieldArray_default2;
|
|
699
|
-
//# sourceMappingURL=chunk-
|
|
699
|
+
//# sourceMappingURL=chunk-7O6LAGV2.cjs.map
|