@ttoss/forms 0.35.3 → 0.36.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.
@@ -0,0 +1,973 @@
1
+ /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
+ import * as React from 'react';
3
+ import { FormErrorMessage, FormField, FormFieldPatternFormat, __name, isCnpjValid, isCpfValid } from "./chunk-QJQFXN4B.js";
4
+
5
+ // src/Form.tsx
6
+ import { Box } from "@ttoss/ui";
7
+ import * as React2 from "react";
8
+ import { FormProvider } from "react-hook-form";
9
+ var Form = /* @__PURE__ */__name(({
10
+ children,
11
+ onSubmit,
12
+ sx,
13
+ ...formMethods
14
+ }) => {
15
+ return /* @__PURE__ */React2.createElement(FormProvider, formMethods, /* @__PURE__ */React2.createElement(Box, {
16
+ as: "form",
17
+ variant: "forms.form",
18
+ onSubmit: formMethods.handleSubmit(data => {
19
+ return onSubmit?.(data);
20
+ }),
21
+ sx
22
+ }, children));
23
+ }, "Form");
24
+
25
+ // src/FormFieldCheckbox.tsx
26
+ import { Checkbox } from "@ttoss/ui";
27
+ var FormFieldCheckbox = /* @__PURE__ */__name(({
28
+ defaultValue = false,
29
+ disabled,
30
+ ...props
31
+ }) => {
32
+ const {
33
+ label,
34
+ name,
35
+ labelTooltip,
36
+ warning,
37
+ sx,
38
+ css,
39
+ rules,
40
+ id,
41
+ onBlur,
42
+ onChange,
43
+ ...checkboxProps
44
+ } = props;
45
+ return /* @__PURE__ */React.createElement(FormField, {
46
+ id,
47
+ label,
48
+ name,
49
+ labelTooltip,
50
+ warning,
51
+ sx,
52
+ css,
53
+ defaultValue,
54
+ rules,
55
+ disabled,
56
+ render: /* @__PURE__ */__name(({
57
+ field,
58
+ fieldState
59
+ }) => {
60
+ const {
61
+ value,
62
+ ...fieldWithoutValue
63
+ } = field;
64
+ return /* @__PURE__ */React.createElement(Checkbox, {
65
+ ...checkboxProps,
66
+ ...fieldWithoutValue,
67
+ onBlur: /* @__PURE__ */__name(e => {
68
+ field.onBlur();
69
+ onBlur?.(e);
70
+ }, "onBlur"),
71
+ onChange: /* @__PURE__ */__name(e => {
72
+ field.onChange(e);
73
+ onChange?.(e);
74
+ }, "onChange"),
75
+ checked: value,
76
+ disabled: disabled ?? field.disabled,
77
+ "aria-invalid": !!fieldState.error
78
+ });
79
+ }, "render")
80
+ });
81
+ }, "FormFieldCheckbox");
82
+
83
+ // src/FormFieldCreditCardNumber.tsx
84
+ var FormFieldCreditCardNumber = /* @__PURE__ */__name(({
85
+ format = "#### #### #### ####",
86
+ placeholder = "1234 1234 1234 1234",
87
+ ...formFieldPatternFormatProps
88
+ }) => {
89
+ return /* @__PURE__ */React.createElement(FormFieldPatternFormat, {
90
+ format,
91
+ placeholder,
92
+ ...formFieldPatternFormatProps
93
+ });
94
+ }, "FormFieldCreditCardNumber");
95
+
96
+ // src/FormFieldCurrencyInput.tsx
97
+ import { defineMessages, useI18n } from "@ttoss/react-i18n";
98
+
99
+ // src/FormFieldNumericFormat.tsx
100
+ import { Input } from "@ttoss/ui";
101
+ import { NumericFormat } from "react-number-format";
102
+ var FormFieldNumericFormat = /* @__PURE__ */__name(({
103
+ disabled,
104
+ ...props
105
+ }) => {
106
+ const {
107
+ label,
108
+ name,
109
+ labelTooltip,
110
+ warning,
111
+ sx,
112
+ css,
113
+ rules,
114
+ id,
115
+ defaultValue,
116
+ leadingIcon,
117
+ trailingIcon,
118
+ auxiliaryCheckbox,
119
+ onBlur,
120
+ onValueChange,
121
+ ...numericFormatProps
122
+ } = props;
123
+ return /* @__PURE__ */React.createElement(FormField, {
124
+ id,
125
+ label,
126
+ name,
127
+ labelTooltip,
128
+ warning,
129
+ sx,
130
+ css,
131
+ defaultValue,
132
+ rules,
133
+ disabled,
134
+ auxiliaryCheckbox,
135
+ render: /* @__PURE__ */__name(({
136
+ field
137
+ }) => {
138
+ return /* @__PURE__ */React.createElement(NumericFormat, {
139
+ ...numericFormatProps,
140
+ name: field.name,
141
+ value: field.value,
142
+ onBlur: /* @__PURE__ */__name(e => {
143
+ field.onBlur();
144
+ onBlur?.(e);
145
+ }, "onBlur"),
146
+ onValueChange: /* @__PURE__ */__name((values, sourceInfo) => {
147
+ field.onChange(values.floatValue);
148
+ onValueChange?.(values, sourceInfo);
149
+ }, "onValueChange"),
150
+ customInput: Input,
151
+ leadingIcon,
152
+ trailingIcon,
153
+ disabled: disabled ?? field.disabled
154
+ });
155
+ }, "render")
156
+ });
157
+ }, "FormFieldNumericFormat");
158
+
159
+ // src/FormFieldCurrencyInput.tsx
160
+ var messages = defineMessages({
161
+ decimalSeparator: {
162
+ id: "JnCaDG",
163
+ defaultMessage: [{
164
+ "type": 0,
165
+ "value": "."
166
+ }]
167
+ },
168
+ thousandSeparator: {
169
+ id: "0+4wTp",
170
+ defaultMessage: [{
171
+ "type": 0,
172
+ "value": ","
173
+ }]
174
+ }
175
+ });
176
+ var FormFieldCurrencyInput = /* @__PURE__ */__name(({
177
+ prefix,
178
+ decimalSeparator,
179
+ thousandSeparator,
180
+ ...formFieldNumericFormatProps
181
+ }) => {
182
+ const {
183
+ intl
184
+ } = useI18n();
185
+ const finalDecimalSeparator = decimalSeparator ?? intl.formatMessage(messages.decimalSeparator);
186
+ const finalThousandSeparator = thousandSeparator ?? intl.formatMessage(messages.thousandSeparator);
187
+ return /* @__PURE__ */React.createElement(FormFieldNumericFormat, {
188
+ fixedDecimalScale: true,
189
+ decimalScale: 2,
190
+ prefix,
191
+ decimalSeparator: finalDecimalSeparator,
192
+ thousandSeparator: finalThousandSeparator,
193
+ placeholder: `${prefix} 0${finalDecimalSeparator}00`,
194
+ allowNegative: false,
195
+ ...formFieldNumericFormatProps
196
+ });
197
+ }, "FormFieldCurrencyInput");
198
+
199
+ // src/FormFieldDatePicker.tsx
200
+ import { DatePicker } from "@ttoss/components/DatePicker";
201
+ var FormFieldDatePicker = /* @__PURE__ */__name(({
202
+ disabled,
203
+ ...props
204
+ }) => {
205
+ const {
206
+ label,
207
+ name,
208
+ labelTooltip,
209
+ warning,
210
+ sx,
211
+ css,
212
+ rules,
213
+ id,
214
+ defaultValue,
215
+ presets,
216
+ ...datePickerProps
217
+ } = props;
218
+ return /* @__PURE__ */React.createElement(FormField, {
219
+ id,
220
+ label,
221
+ name,
222
+ labelTooltip,
223
+ warning,
224
+ sx,
225
+ css,
226
+ defaultValue,
227
+ rules,
228
+ disabled,
229
+ render: /* @__PURE__ */__name(({
230
+ field
231
+ }) => {
232
+ return /* @__PURE__ */React.createElement(DatePicker, {
233
+ ...datePickerProps,
234
+ value: field.value,
235
+ onChange: /* @__PURE__ */__name(range => {
236
+ field.onChange(range);
237
+ }, "onChange"),
238
+ presets
239
+ });
240
+ }, "render")
241
+ });
242
+ }, "FormFieldDatePicker");
243
+
244
+ // src/FormFieldInput.tsx
245
+ import { Input as Input2 } from "@ttoss/ui";
246
+ var FormFieldInput = /* @__PURE__ */__name(({
247
+ defaultValue = "",
248
+ disabled,
249
+ ...props
250
+ }) => {
251
+ const {
252
+ label,
253
+ name,
254
+ labelTooltip,
255
+ warning,
256
+ sx,
257
+ css,
258
+ rules,
259
+ id,
260
+ leadingIcon,
261
+ trailingIcon,
262
+ auxiliaryCheckbox,
263
+ onBlur,
264
+ onChange,
265
+ ...inputProps
266
+ } = props;
267
+ return /* @__PURE__ */React.createElement(FormField, {
268
+ id,
269
+ label,
270
+ name,
271
+ labelTooltip,
272
+ warning,
273
+ sx,
274
+ css,
275
+ defaultValue,
276
+ rules,
277
+ disabled,
278
+ auxiliaryCheckbox,
279
+ render: /* @__PURE__ */__name(({
280
+ field,
281
+ fieldState
282
+ }) => {
283
+ return /* @__PURE__ */React.createElement(Input2, {
284
+ ...inputProps,
285
+ ...field,
286
+ onBlur: /* @__PURE__ */__name(e => {
287
+ field.onBlur();
288
+ onBlur?.(e);
289
+ }, "onBlur"),
290
+ onChange: /* @__PURE__ */__name(e => {
291
+ field.onChange(e);
292
+ onChange?.(e);
293
+ }, "onChange"),
294
+ leadingIcon,
295
+ trailingIcon,
296
+ disabled: disabled ?? field.disabled,
297
+ "aria-invalid": fieldState.error ? "true" : void 0
298
+ });
299
+ }, "render")
300
+ });
301
+ }, "FormFieldInput");
302
+
303
+ // src/FormFieldPassword.tsx
304
+ import { InputPassword } from "@ttoss/ui";
305
+ var FormFieldPassword = /* @__PURE__ */__name(({
306
+ defaultValue = "",
307
+ disabled,
308
+ ...props
309
+ }) => {
310
+ const {
311
+ label,
312
+ name,
313
+ labelTooltip,
314
+ warning,
315
+ sx,
316
+ css,
317
+ rules,
318
+ id,
319
+ leadingIcon,
320
+ auxiliaryCheckbox,
321
+ onBlur,
322
+ onChange,
323
+ ...inputProps
324
+ } = props;
325
+ return /* @__PURE__ */React.createElement(FormField, {
326
+ id,
327
+ label,
328
+ name,
329
+ labelTooltip,
330
+ warning,
331
+ sx,
332
+ css,
333
+ defaultValue,
334
+ rules,
335
+ disabled,
336
+ auxiliaryCheckbox,
337
+ render: /* @__PURE__ */__name(({
338
+ field,
339
+ fieldState
340
+ }) => {
341
+ return /* @__PURE__ */React.createElement(InputPassword, {
342
+ ...inputProps,
343
+ ...field,
344
+ onBlur: /* @__PURE__ */__name(e => {
345
+ field.onBlur();
346
+ onBlur?.(e);
347
+ }, "onBlur"),
348
+ onChange: /* @__PURE__ */__name(e => {
349
+ field.onChange(e);
350
+ onChange?.(e);
351
+ }, "onChange"),
352
+ leadingIcon,
353
+ disabled: disabled ?? field.disabled,
354
+ "aria-invalid": fieldState.error ? "true" : void 0
355
+ });
356
+ }, "render")
357
+ });
358
+ }, "FormFieldPassword");
359
+
360
+ // src/FormFieldRadio.tsx
361
+ import { Flex, Label, Radio } from "@ttoss/ui";
362
+ var FormFieldRadio = /* @__PURE__ */__name(({
363
+ disabled,
364
+ options,
365
+ ...props
366
+ }) => {
367
+ const {
368
+ label,
369
+ name,
370
+ labelTooltip,
371
+ warning,
372
+ sx,
373
+ css,
374
+ rules,
375
+ id,
376
+ defaultValue,
377
+ onBlur,
378
+ onChange,
379
+ ...radioProps
380
+ } = props;
381
+ return /* @__PURE__ */React.createElement(FormField, {
382
+ id,
383
+ label,
384
+ name,
385
+ labelTooltip,
386
+ warning,
387
+ sx,
388
+ css,
389
+ defaultValue,
390
+ rules,
391
+ disabled,
392
+ render: /* @__PURE__ */__name(({
393
+ field
394
+ }) => {
395
+ return /* @__PURE__ */React.createElement(Flex, {
396
+ sx: {
397
+ flexDirection: "column",
398
+ gap: "1"
399
+ }
400
+ }, options.map(option => {
401
+ const key = `form-field-radio-${name}-${option.value}`;
402
+ return /* @__PURE__ */React.createElement(Label, {
403
+ key,
404
+ sx: {
405
+ fontSize: "md"
406
+ }
407
+ }, /* @__PURE__ */React.createElement(Radio, {
408
+ ref: field.ref,
409
+ onChange: /* @__PURE__ */__name(e => {
410
+ field.onChange(e);
411
+ onChange?.(e);
412
+ }, "onChange"),
413
+ onBlur: /* @__PURE__ */__name(e => {
414
+ field.onBlur();
415
+ onBlur?.(e);
416
+ }, "onBlur"),
417
+ value: option.value,
418
+ checked: field.value === option.value,
419
+ name,
420
+ disabled: disabled ?? field.disabled,
421
+ ...radioProps
422
+ }), option.label);
423
+ }));
424
+ }, "render")
425
+ });
426
+ }, "FormFieldRadio");
427
+
428
+ // src/FormFieldRadioCard.tsx
429
+ import { Box as Box2, Flex as Flex2, Label as Label2, Radio as Radio2, Text } from "@ttoss/ui";
430
+ var FormFieldRadioCard = /* @__PURE__ */__name(({
431
+ disabled,
432
+ ...props
433
+ }) => {
434
+ const {
435
+ label,
436
+ name,
437
+ labelTooltip,
438
+ warning,
439
+ sx,
440
+ css,
441
+ rules,
442
+ id,
443
+ defaultValue,
444
+ options,
445
+ direction = "column",
446
+ width = "full",
447
+ onBlur,
448
+ onChange,
449
+ ...radioProps
450
+ } = props;
451
+ return /* @__PURE__ */React.createElement(FormField, {
452
+ id,
453
+ label,
454
+ name,
455
+ labelTooltip,
456
+ warning,
457
+ sx,
458
+ css,
459
+ defaultValue,
460
+ rules,
461
+ disabled,
462
+ render: /* @__PURE__ */__name(({
463
+ field
464
+ }) => {
465
+ return /* @__PURE__ */React.createElement(Flex2, {
466
+ sx: {
467
+ flexDirection: direction,
468
+ gap: "4"
469
+ }
470
+ }, options.map(option => {
471
+ const key = `form-field-radio-${name}-${option.value}`;
472
+ const isSelected = field.value === option.value;
473
+ return /* @__PURE__ */React.createElement(Box2, {
474
+ key,
475
+ sx: {
476
+ gap: "2",
477
+ width,
478
+ border: "md",
479
+ borderColor: isSelected ? "input.background.accent.default" : "input.border.muted.default",
480
+ borderRadius: "md",
481
+ backgroundColor: isSelected ? "feedback.background.positive.default" : "transparent"
482
+ }
483
+ }, /* @__PURE__ */React.createElement(Label2, {
484
+ sx: {
485
+ fontSize: "md",
486
+ width: "100%",
487
+ padding: "4"
488
+ }
489
+ }, /* @__PURE__ */React.createElement(Radio2, {
490
+ ...radioProps,
491
+ ref: field.ref,
492
+ onChange: /* @__PURE__ */__name(e => {
493
+ field.onChange(e);
494
+ onChange?.(e);
495
+ }, "onChange"),
496
+ onBlur: /* @__PURE__ */__name(e => {
497
+ field.onBlur();
498
+ onBlur?.(e);
499
+ }, "onBlur"),
500
+ value: option.value,
501
+ checked: field.value === option.value,
502
+ name,
503
+ disabled: disabled ?? field.disabled
504
+ }), /* @__PURE__ */React.createElement(Flex2, {
505
+ sx: {
506
+ flexDirection: "column",
507
+ gap: "1"
508
+ }
509
+ }, option.label && /* @__PURE__ */React.createElement(Text, null, option.label), option.description && /* @__PURE__ */React.createElement(Text, {
510
+ sx: {
511
+ fontSize: "sm"
512
+ }
513
+ }, option.description))));
514
+ }));
515
+ }, "render")
516
+ });
517
+ }, "FormFieldRadioCard");
518
+
519
+ // src/FormFieldRadioCardIcony.tsx
520
+ import { Box as Box3, Flex as Flex3, Tag, Text as Text2 } from "@ttoss/ui";
521
+ import * as React3 from "react";
522
+ var FormFieldRadioCardIcony = /* @__PURE__ */__name(({
523
+ disabled,
524
+ ...props
525
+ }) => {
526
+ const {
527
+ label,
528
+ name,
529
+ labelTooltip,
530
+ warning,
531
+ sx,
532
+ css,
533
+ rules,
534
+ id,
535
+ defaultValue,
536
+ options,
537
+ direction = "row",
538
+ width = "full"
539
+ } = props;
540
+ return /* @__PURE__ */React3.createElement(FormField, {
541
+ id,
542
+ label,
543
+ name,
544
+ labelTooltip,
545
+ warning,
546
+ sx,
547
+ css,
548
+ defaultValue,
549
+ rules,
550
+ disabled,
551
+ render: /* @__PURE__ */__name(({
552
+ field
553
+ }) => {
554
+ const isDisabled = disabled ?? field.disabled;
555
+ const handleOptionClick = /* @__PURE__ */__name(optionValue => {
556
+ if (!isDisabled) {
557
+ field.onChange(optionValue);
558
+ field.onBlur();
559
+ }
560
+ }, "handleOptionClick");
561
+ return /* @__PURE__ */React3.createElement(Flex3, {
562
+ sx: {
563
+ flexDirection: direction,
564
+ gap: "4"
565
+ }
566
+ }, options.map(option => {
567
+ const key = `form-field-radio-card-${name}-${option.value}`;
568
+ const isSelected = field.value === option.value;
569
+ const IconComponent = option.icon;
570
+ const tag = option.tag;
571
+ return /* @__PURE__ */React3.createElement(Box3, {
572
+ key,
573
+ onClick: /* @__PURE__ */__name(() => {
574
+ return handleOptionClick(option.value);
575
+ }, "onClick"),
576
+ sx: {
577
+ width,
578
+ padding: "6",
579
+ border: isSelected ? "lg" : "md",
580
+ borderColor: isSelected ? "input.background.accent.default" : "input.border.muted.default",
581
+ borderRadius: "md",
582
+ backgroundColor: isSelected ? "feedback.background.positive.default" : "transparent",
583
+ display: "flex",
584
+ flexDirection: "column",
585
+ alignItems: "center",
586
+ justifyContent: "center",
587
+ textAlign: "center",
588
+ cursor: isDisabled ? "not-allowed" : "pointer",
589
+ opacity: isDisabled ? 0.5 : 1,
590
+ transition: "all 0.2s ease-in-out"
591
+ }
592
+ }, IconComponent && /* @__PURE__ */React3.createElement(Box3, {
593
+ sx: {
594
+ marginBottom: "2",
595
+ color: "text.primary"
596
+ }
597
+ }, /* @__PURE__ */React3.createElement(IconComponent, {
598
+ size: 24
599
+ })), /* @__PURE__ */React3.createElement(Flex3, {
600
+ sx: {
601
+ flexDirection: "column",
602
+ gap: "1"
603
+ }
604
+ }, option.label && /* @__PURE__ */React3.createElement(Text2, {
605
+ sx: {
606
+ fontSize: "lg",
607
+ fontWeight: "semibold",
608
+ color: "text.primary"
609
+ }
610
+ }, option.label), option.description && /* @__PURE__ */React3.createElement(Text2, {
611
+ sx: {
612
+ fontSize: "md",
613
+ color: "text.secondary"
614
+ }
615
+ }, option.description)), tag?.label && /* @__PURE__ */React3.createElement(Tag, {
616
+ variant: tag?.variant,
617
+ sx: {
618
+ px: "3",
619
+ mt: "2",
620
+ fontSize: "sm",
621
+ ...tag?.sx
622
+ }
623
+ }, tag.label));
624
+ }));
625
+ }, "render")
626
+ });
627
+ }, "FormFieldRadioCardIcony");
628
+
629
+ // src/FormFieldSelect.tsx
630
+ import { Select } from "@ttoss/ui";
631
+ var FormFieldSelect = /* @__PURE__ */__name(({
632
+ disabled,
633
+ ...props
634
+ }) => {
635
+ const {
636
+ label,
637
+ name,
638
+ labelTooltip,
639
+ warning,
640
+ sx,
641
+ css,
642
+ rules,
643
+ id,
644
+ defaultValue,
645
+ onBlur,
646
+ onChange,
647
+ ...selectProps
648
+ } = props;
649
+ return /* @__PURE__ */React.createElement(FormField, {
650
+ id,
651
+ label,
652
+ name,
653
+ labelTooltip,
654
+ warning,
655
+ sx,
656
+ css,
657
+ defaultValue,
658
+ rules,
659
+ disabled,
660
+ render: /* @__PURE__ */__name(({
661
+ field,
662
+ fieldState
663
+ }) => {
664
+ return /* @__PURE__ */React.createElement(Select, {
665
+ ...selectProps,
666
+ ...field,
667
+ onBlur: /* @__PURE__ */__name(e => {
668
+ field.onBlur();
669
+ onBlur?.(e);
670
+ }, "onBlur"),
671
+ onChange: /* @__PURE__ */__name(newValue => {
672
+ field.onChange(newValue);
673
+ onChange?.(newValue);
674
+ }, "onChange"),
675
+ isDisabled: disabled ?? field.disabled,
676
+ "aria-invalid": fieldState.error ? "true" : void 0
677
+ });
678
+ }, "render")
679
+ });
680
+ }, "FormFieldSelect");
681
+
682
+ // src/FormFieldSwitch.tsx
683
+ import { Switch } from "@ttoss/ui";
684
+ var FormFieldSwitch = /* @__PURE__ */__name(({
685
+ disabled,
686
+ ...props
687
+ }) => {
688
+ const {
689
+ label,
690
+ name,
691
+ labelTooltip,
692
+ warning,
693
+ sx,
694
+ css,
695
+ rules,
696
+ id,
697
+ defaultValue,
698
+ onBlur,
699
+ onChange,
700
+ ...switchProps
701
+ } = props;
702
+ return /* @__PURE__ */React.createElement(FormField, {
703
+ id,
704
+ label,
705
+ name,
706
+ labelTooltip,
707
+ warning,
708
+ sx,
709
+ css,
710
+ defaultValue,
711
+ rules,
712
+ disabled,
713
+ render: /* @__PURE__ */__name(({
714
+ field,
715
+ fieldState
716
+ }) => {
717
+ return /* @__PURE__ */React.createElement(Switch, {
718
+ ...switchProps,
719
+ ...field,
720
+ onBlur: /* @__PURE__ */__name(e => {
721
+ field.onBlur();
722
+ onBlur?.(e);
723
+ }, "onBlur"),
724
+ onChange: /* @__PURE__ */__name(e => {
725
+ field.onChange(e);
726
+ onChange?.(e);
727
+ }, "onChange"),
728
+ disabled: disabled ?? field.disabled,
729
+ "aria-invalid": !!fieldState.error
730
+ });
731
+ }, "render")
732
+ });
733
+ }, "FormFieldSwitch");
734
+
735
+ // src/FormFieldTextarea.tsx
736
+ import { Textarea } from "@ttoss/ui";
737
+ var FormFieldTextarea = /* @__PURE__ */__name(({
738
+ defaultValue = "",
739
+ disabled,
740
+ ...props
741
+ }) => {
742
+ const {
743
+ label,
744
+ name,
745
+ labelTooltip,
746
+ warning,
747
+ sx,
748
+ css,
749
+ rules,
750
+ id,
751
+ auxiliaryCheckbox,
752
+ onBlur,
753
+ onChange,
754
+ ...textareaProps
755
+ } = props;
756
+ return /* @__PURE__ */React.createElement(FormField, {
757
+ id,
758
+ label,
759
+ name,
760
+ labelTooltip,
761
+ warning,
762
+ sx,
763
+ css,
764
+ defaultValue,
765
+ rules,
766
+ disabled,
767
+ auxiliaryCheckbox,
768
+ render: /* @__PURE__ */__name(({
769
+ field,
770
+ fieldState
771
+ }) => {
772
+ return /* @__PURE__ */React.createElement(Textarea, {
773
+ ...textareaProps,
774
+ ...field,
775
+ onBlur: /* @__PURE__ */__name(e => {
776
+ field.onBlur();
777
+ onBlur?.(e);
778
+ }, "onBlur"),
779
+ onChange: /* @__PURE__ */__name(e => {
780
+ field.onChange(e);
781
+ onChange?.(e);
782
+ }, "onChange"),
783
+ disabled: disabled ?? field.disabled,
784
+ "aria-invalid": fieldState.error ? "true" : void 0
785
+ });
786
+ }, "render")
787
+ });
788
+ }, "FormFieldTextarea");
789
+
790
+ // src/FormGroup.tsx
791
+ import { Box as Box4, Flex as Flex4, Text as Text3 } from "@ttoss/ui";
792
+ import * as React4 from "react";
793
+ var FormGroupLevelsManagerContext = /* @__PURE__ */React4.createContext({
794
+ levelsLength: 1,
795
+ registerChild: /* @__PURE__ */__name(() => {
796
+ return null;
797
+ }, "registerChild")
798
+ });
799
+ var FormGroupLevelsManager = /* @__PURE__ */__name(({
800
+ children
801
+ }) => {
802
+ const [levelsLength, setLevelsLength] = React4.useState(0);
803
+ const registerChild = React4.useCallback(level => {
804
+ if (level + 1 > levelsLength) {
805
+ setLevelsLength(level + 1);
806
+ }
807
+ }, [levelsLength]);
808
+ return /* @__PURE__ */React4.createElement(FormGroupLevelsManagerContext.Provider, {
809
+ value: {
810
+ levelsLength,
811
+ registerChild
812
+ }
813
+ }, children);
814
+ }, "FormGroupLevelsManager");
815
+ var FormGroupContext = /* @__PURE__ */React4.createContext({});
816
+ var useFormGroup = /* @__PURE__ */__name(() => {
817
+ const {
818
+ parentLevel
819
+ } = React4.useContext(FormGroupContext);
820
+ const {
821
+ levelsLength
822
+ } = React4.useContext(FormGroupLevelsManagerContext);
823
+ return {
824
+ level: parentLevel,
825
+ levelsLength
826
+ };
827
+ }, "useFormGroup");
828
+ var FormGroupWrapper = /* @__PURE__ */__name(({
829
+ title,
830
+ direction,
831
+ children,
832
+ name,
833
+ ...boxProps
834
+ }) => {
835
+ const {
836
+ level
837
+ } = useFormGroup();
838
+ const {
839
+ registerChild
840
+ } = React4.useContext(FormGroupLevelsManagerContext);
841
+ React4.useEffect(() => {
842
+ if (typeof level === "number") {
843
+ registerChild(level);
844
+ }
845
+ }, [level, registerChild]);
846
+ const childrenContainerSx = {
847
+ flexDirection: direction || "column",
848
+ gap: "1",
849
+ width: "100%"
850
+ };
851
+ return /* @__PURE__ */React4.createElement(Box4, {
852
+ "aria-level": level,
853
+ ...boxProps,
854
+ sx: {
855
+ marginTop: level === 0 ? "none" : "4",
856
+ marginBottom: "4",
857
+ ...boxProps.sx
858
+ }
859
+ }, title && /* @__PURE__ */React4.createElement(Box4, {
860
+ sx: {
861
+ marginBottom: "2"
862
+ }
863
+ }, /* @__PURE__ */React4.createElement(Text3, {
864
+ sx: {
865
+ fontSize: "2xl",
866
+ fontWeight: "bold"
867
+ }
868
+ }, title)), /* @__PURE__ */React4.createElement(Flex4, {
869
+ sx: childrenContainerSx
870
+ }, children), name && /* @__PURE__ */React4.createElement(FormErrorMessage, {
871
+ name
872
+ }));
873
+ }, "FormGroupWrapper");
874
+ var FormGroup = /* @__PURE__ */__name(props => {
875
+ const {
876
+ level
877
+ } = useFormGroup();
878
+ const currentLevel = level === void 0 ? 0 : level + 1;
879
+ return /* @__PURE__ */React4.createElement(FormGroupContext.Provider, {
880
+ value: {
881
+ parentLevel: currentLevel
882
+ }
883
+ }, currentLevel === 0 ? /* @__PURE__ */React4.createElement(FormGroupLevelsManager, null, /* @__PURE__ */React4.createElement(FormGroupWrapper, props)) : /* @__PURE__ */React4.createElement(FormGroupWrapper, props));
884
+ }, "FormGroup");
885
+
886
+ // src/yup/i18n.ts
887
+ import { defineMessage } from "@ttoss/react-i18n";
888
+ import { setLocale } from "yup";
889
+ setLocale({
890
+ mixed: {
891
+ required: defineMessage({
892
+ id: "MfWGyg",
893
+ defaultMessage: [{
894
+ "type": 0,
895
+ "value": "Field is required"
896
+ }]
897
+ }),
898
+ notType: /* @__PURE__ */__name(({
899
+ type
900
+ }) => {
901
+ return {
902
+ ...defineMessage({
903
+ id: "ZhaPt0",
904
+ defaultMessage: [{
905
+ "type": 0,
906
+ "value": "Invalid Value for Field of type "
907
+ }, {
908
+ "type": 1,
909
+ "value": "type"
910
+ }]
911
+ }),
912
+ values: {
913
+ type
914
+ }
915
+ };
916
+ }, "notType")
917
+ },
918
+ string: {
919
+ min: /* @__PURE__ */__name(({
920
+ min
921
+ }) => {
922
+ return {
923
+ ...defineMessage({
924
+ id: "D1C6fR",
925
+ defaultMessage: [{
926
+ "type": 0,
927
+ "value": "Field must be at least "
928
+ }, {
929
+ "type": 1,
930
+ "value": "min"
931
+ }, {
932
+ "type": 0,
933
+ "value": " characters"
934
+ }]
935
+ }),
936
+ values: {
937
+ min
938
+ }
939
+ };
940
+ }, "min")
941
+ }
942
+ });
943
+
944
+ // src/yup/schema.ts
945
+ import * as yup from "yup";
946
+ yup.addMethod(yup.string, "cnpj", function () {
947
+ return this.test("valid-cnpj", "Invalid CNPJ", value => {
948
+ return isCnpjValid(value);
949
+ });
950
+ });
951
+ yup.addMethod(yup.string, "cpf", function () {
952
+ return this.test("valid-cpf", "Invalid CPF", value => {
953
+ return isCpfValid(value);
954
+ });
955
+ });
956
+ yup.addMethod(yup.string, "password", function ({
957
+ required
958
+ } = {}) {
959
+ const schema = this.trim();
960
+ if (required) {
961
+ schema.required("Password is required");
962
+ }
963
+ return schema.min(8, "Password must be at least 8 characters long");
964
+ });
965
+
966
+ // src/yup/yup.ts
967
+ import * as yup2 from "yup";
968
+
969
+ // src/index.ts
970
+ import { yupResolver } from "@hookform/resolvers/yup";
971
+ import { Controller, FormProvider as FormProvider2, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch } from "react-hook-form";
972
+ export * from "react-hook-form";
973
+ export { Form, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldNumericFormat, FormFieldCurrencyInput, FormFieldDatePicker, FormFieldInput, FormFieldPassword, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, useFormGroup, FormGroup, yup2 as yup, yupResolver, Controller, FormProvider2 as FormProvider, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };