@ttoss/forms 0.22.7 → 0.23.1
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/Brazil/index.d.mts +24 -0
- package/dist/Brazil/index.d.ts +24 -0
- package/dist/Brazil/index.js +828 -0
- package/dist/FormFieldPatternFormat-DF8nU9tn.d.mts +10 -0
- package/dist/FormFieldPatternFormat-DF8nU9tn.d.ts +10 -0
- package/dist/MultistepForm/index.d.mts +1 -0
- package/dist/MultistepForm/index.d.ts +1 -0
- package/dist/MultistepForm/index.js +177 -124
- package/dist/esm/Brazil/index.js +51 -0
- package/dist/esm/MultistepForm/index.js +1 -1
- package/dist/esm/{chunk-5SH4STWG.js → chunk-J6VGD2RH.js} +141 -60
- package/dist/esm/index.js +1 -1
- package/dist/index.d.mts +5 -8
- package/dist/index.d.ts +5 -8
- package/dist/index.js +130 -77
- package/dist/typings.d-KteERiXO.d.mts +12 -0
- package/dist/typings.d-KteERiXO.d.ts +12 -0
- package/package.json +14 -9
- package/src/Brazil/FormFieldCEP.tsx +25 -0
- package/src/Brazil/FormFieldCNPJ.tsx +93 -0
- package/src/Brazil/FormFieldPhone.tsx +41 -0
- package/src/Brazil/index.ts +4 -0
- package/src/index.ts +1 -3
- package/src/yup/schema.ts +12 -0
- package/src/yup/typings.d.ts +14 -0
- package/src/yup/yup.ts +4 -0
- /package/src/{i18n.ts → yup/i18n.ts} +0 -0
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
|
|
2
|
+
import { FormField, FormFieldCNPJ, FormFieldPatternFormat, isCnpjValid } from "../chunk-J6VGD2RH.js";
|
|
3
|
+
|
|
4
|
+
// src/Brazil/FormFieldPhone.tsx
|
|
5
|
+
import { Input } from "@ttoss/ui";
|
|
6
|
+
import { PatternFormat } from "react-number-format";
|
|
7
|
+
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
var FormFieldPhone = ({
|
|
9
|
+
label,
|
|
10
|
+
name,
|
|
11
|
+
...patternFormatProps
|
|
12
|
+
}) => {
|
|
13
|
+
return /* @__PURE__ */jsx(FormField, {
|
|
14
|
+
name,
|
|
15
|
+
label,
|
|
16
|
+
render: ({
|
|
17
|
+
field
|
|
18
|
+
}) => {
|
|
19
|
+
const format = field.value?.length > 10 ? "(##) #####-####" : "(##) ####-#####";
|
|
20
|
+
return /* @__PURE__ */jsx(PatternFormat, {
|
|
21
|
+
name: field.name,
|
|
22
|
+
value: field.value,
|
|
23
|
+
onBlur: field.onBlur,
|
|
24
|
+
onValueChange: values => {
|
|
25
|
+
field.onChange(values.value);
|
|
26
|
+
},
|
|
27
|
+
format,
|
|
28
|
+
customInput: Input,
|
|
29
|
+
placeholder: "(11) 91234-1234",
|
|
30
|
+
...patternFormatProps
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
// src/Brazil/FormFieldCEP.tsx
|
|
37
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
38
|
+
var FormFieldCEP = ({
|
|
39
|
+
label,
|
|
40
|
+
name,
|
|
41
|
+
...formFieldPatternFormatProps
|
|
42
|
+
}) => {
|
|
43
|
+
return /* @__PURE__ */jsx2(FormFieldPatternFormat, {
|
|
44
|
+
name,
|
|
45
|
+
label,
|
|
46
|
+
format: "#####-###",
|
|
47
|
+
placeholder: "12345-678",
|
|
48
|
+
...formFieldPatternFormatProps
|
|
49
|
+
});
|
|
50
|
+
};
|
|
51
|
+
export { FormFieldCEP, FormFieldCNPJ, FormFieldPhone, isCnpjValid };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
|
|
2
|
-
import { Form, useForm, yupResolver } from "../chunk-
|
|
2
|
+
import { Form, useForm, yupResolver } from "../chunk-J6VGD2RH.js";
|
|
3
3
|
|
|
4
4
|
// src/MultistepForm/MultistepForm.tsx
|
|
5
5
|
import * as React3 from "react";
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
|
|
2
2
|
|
|
3
|
-
// src/
|
|
3
|
+
// src/index.ts
|
|
4
|
+
import { yupResolver } from "@hookform/resolvers/yup";
|
|
5
|
+
|
|
6
|
+
// src/yup/i18n.ts
|
|
4
7
|
import { defineMessage } from "@ttoss/react-i18n";
|
|
5
8
|
import { setLocale } from "yup";
|
|
6
9
|
setLocale({
|
|
@@ -58,23 +61,101 @@ setLocale({
|
|
|
58
61
|
}
|
|
59
62
|
});
|
|
60
63
|
|
|
61
|
-
// src/
|
|
62
|
-
import { yupResolver } from "@hookform/resolvers/yup";
|
|
64
|
+
// src/yup/schema.ts
|
|
63
65
|
import * as yup from "yup";
|
|
64
66
|
|
|
67
|
+
// src/Brazil/FormFieldCNPJ.tsx
|
|
68
|
+
import { Input } from "@ttoss/ui";
|
|
69
|
+
import { PatternFormat } from "react-number-format";
|
|
70
|
+
import { jsx } from "react/jsx-runtime";
|
|
71
|
+
var isCnpjValid = cnpj => {
|
|
72
|
+
if (cnpj?.length != 14) {
|
|
73
|
+
return false;
|
|
74
|
+
}
|
|
75
|
+
if (cnpj == "00000000000000" || cnpj == "11111111111111" || cnpj == "22222222222222" || cnpj == "33333333333333" || cnpj == "44444444444444" || cnpj == "55555555555555" || cnpj == "66666666666666" || cnpj == "77777777777777" || cnpj == "88888888888888" || cnpj == "99999999999999") {
|
|
76
|
+
return false;
|
|
77
|
+
}
|
|
78
|
+
let size = cnpj.length - 2;
|
|
79
|
+
let numbers = cnpj.substring(0, size);
|
|
80
|
+
const digits = cnpj.substring(size);
|
|
81
|
+
let soma = 0;
|
|
82
|
+
let pos = size - 7;
|
|
83
|
+
for (let i = size; i >= 1; i--) {
|
|
84
|
+
soma += numbers.charAt(size - i) * pos--;
|
|
85
|
+
if (pos < 2) {
|
|
86
|
+
pos = 9;
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
let result = soma % 11 < 2 ? 0 : 11 - soma % 11;
|
|
90
|
+
if (result != digits.charAt(0)) {
|
|
91
|
+
return false;
|
|
92
|
+
}
|
|
93
|
+
size = size + 1;
|
|
94
|
+
numbers = cnpj.substring(0, size);
|
|
95
|
+
soma = 0;
|
|
96
|
+
pos = size - 7;
|
|
97
|
+
for (let i = size; i >= 1; i--) {
|
|
98
|
+
soma += numbers.charAt(size - i) * pos--;
|
|
99
|
+
if (pos < 2) {
|
|
100
|
+
pos = 9;
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
result = soma % 11 < 2 ? 0 : 11 - soma % 11;
|
|
104
|
+
if (result != digits.charAt(1)) {
|
|
105
|
+
return false;
|
|
106
|
+
}
|
|
107
|
+
return true;
|
|
108
|
+
};
|
|
109
|
+
var FormFieldCNPJ = ({
|
|
110
|
+
label,
|
|
111
|
+
name,
|
|
112
|
+
...patternFormatProps
|
|
113
|
+
}) => {
|
|
114
|
+
return /* @__PURE__ */jsx(FormField, {
|
|
115
|
+
name,
|
|
116
|
+
label,
|
|
117
|
+
render: ({
|
|
118
|
+
field
|
|
119
|
+
}) => {
|
|
120
|
+
return /* @__PURE__ */jsx(PatternFormat, {
|
|
121
|
+
name: field.name,
|
|
122
|
+
value: field.value,
|
|
123
|
+
onBlur: field.onBlur,
|
|
124
|
+
onValueChange: values => {
|
|
125
|
+
field.onChange(values.value);
|
|
126
|
+
},
|
|
127
|
+
format: "##.###.###/####-##",
|
|
128
|
+
customInput: Input,
|
|
129
|
+
placeholder: "12.345.678/0000-00",
|
|
130
|
+
...patternFormatProps
|
|
131
|
+
});
|
|
132
|
+
}
|
|
133
|
+
});
|
|
134
|
+
};
|
|
135
|
+
|
|
136
|
+
// src/yup/schema.ts
|
|
137
|
+
yup.addMethod(yup.string, "cnpj", function () {
|
|
138
|
+
return this.test("valid-cnpj", "Invalid CNPJ", value => {
|
|
139
|
+
return isCnpjValid(value);
|
|
140
|
+
});
|
|
141
|
+
});
|
|
142
|
+
|
|
143
|
+
// src/yup/yup.ts
|
|
144
|
+
import * as yup2 from "yup";
|
|
145
|
+
|
|
65
146
|
// src/Form.tsx
|
|
66
147
|
import { Box } from "@ttoss/ui";
|
|
67
148
|
import { FormProvider } from "react-hook-form";
|
|
68
|
-
import { jsx } from "react/jsx-runtime";
|
|
149
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
69
150
|
var Form = ({
|
|
70
151
|
children,
|
|
71
152
|
onSubmit,
|
|
72
153
|
sx,
|
|
73
154
|
...formMethods
|
|
74
155
|
}) => {
|
|
75
|
-
return /* @__PURE__ */
|
|
156
|
+
return /* @__PURE__ */jsx2(FormProvider, {
|
|
76
157
|
...formMethods,
|
|
77
|
-
children: /* @__PURE__ */
|
|
158
|
+
children: /* @__PURE__ */jsx2(Box, {
|
|
78
159
|
as: "form",
|
|
79
160
|
variant: "forms.form",
|
|
80
161
|
onSubmit: formMethods.handleSubmit(data => {
|
|
@@ -94,7 +175,7 @@ import { useFormContext } from "react-hook-form";
|
|
|
94
175
|
import { FormattedMessage } from "@ttoss/react-i18n";
|
|
95
176
|
import { HelpText } from "@ttoss/ui";
|
|
96
177
|
import { ErrorMessage as HookformErrorMessage } from "@hookform/error-message";
|
|
97
|
-
import { jsx as
|
|
178
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
98
179
|
var isMessageDescriptor = possibleMessageDescriptor => {
|
|
99
180
|
return possibleMessageDescriptor !== void 0 && possibleMessageDescriptor.defaultMessage !== void 0;
|
|
100
181
|
};
|
|
@@ -107,13 +188,13 @@ var ErrorMessage = ({
|
|
|
107
188
|
errors
|
|
108
189
|
}
|
|
109
190
|
} = useFormContext();
|
|
110
|
-
return /* @__PURE__ */
|
|
191
|
+
return /* @__PURE__ */jsx3(HookformErrorMessage, {
|
|
111
192
|
name,
|
|
112
193
|
errors,
|
|
113
194
|
render: ({
|
|
114
195
|
message
|
|
115
196
|
}) => {
|
|
116
|
-
return /* @__PURE__ */
|
|
197
|
+
return /* @__PURE__ */jsx3(HelpText, {
|
|
117
198
|
negative: true,
|
|
118
199
|
disabled,
|
|
119
200
|
children: (() => {
|
|
@@ -121,7 +202,7 @@ var ErrorMessage = ({
|
|
|
121
202
|
return message;
|
|
122
203
|
}
|
|
123
204
|
if (isMessageDescriptor(message)) {
|
|
124
|
-
return /* @__PURE__ */
|
|
205
|
+
return /* @__PURE__ */jsx3(FormattedMessage, {
|
|
125
206
|
...message
|
|
126
207
|
});
|
|
127
208
|
}
|
|
@@ -135,7 +216,7 @@ var ErrorMessage = ({
|
|
|
135
216
|
// src/FormField.tsx
|
|
136
217
|
import { useController } from "react-hook-form";
|
|
137
218
|
import { Flex, Label } from "@ttoss/ui";
|
|
138
|
-
import { Fragment, jsx as
|
|
219
|
+
import { Fragment, jsx as jsx4, jsxs } from "react/jsx-runtime";
|
|
139
220
|
var FormField = ({
|
|
140
221
|
label,
|
|
141
222
|
id: idProp,
|
|
@@ -156,7 +237,7 @@ var FormField = ({
|
|
|
156
237
|
const memoizedRender = React.useMemo(() => {
|
|
157
238
|
return React.Children.map(render(controllerReturn), child => {
|
|
158
239
|
return /* @__PURE__ */jsxs(Fragment, {
|
|
159
|
-
children: [label && /* @__PURE__ */
|
|
240
|
+
children: [label && /* @__PURE__ */jsx4(Label, {
|
|
160
241
|
"aria-disabled": disabled,
|
|
161
242
|
htmlFor: id,
|
|
162
243
|
tooltip,
|
|
@@ -177,7 +258,7 @@ var FormField = ({
|
|
|
177
258
|
...sx
|
|
178
259
|
},
|
|
179
260
|
css,
|
|
180
|
-
children: [memoizedRender, /* @__PURE__ */
|
|
261
|
+
children: [memoizedRender, /* @__PURE__ */jsx4(ErrorMessage, {
|
|
181
262
|
name
|
|
182
263
|
})]
|
|
183
264
|
});
|
|
@@ -186,7 +267,7 @@ var FormField = ({
|
|
|
186
267
|
// src/FormFieldCheckbox.tsx
|
|
187
268
|
import { Checkbox, Flex as Flex2, Label as Label2 } from "@ttoss/ui";
|
|
188
269
|
import { useController as useController2 } from "react-hook-form";
|
|
189
|
-
import { jsx as
|
|
270
|
+
import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
190
271
|
var FormFieldCheckbox = ({
|
|
191
272
|
label,
|
|
192
273
|
name,
|
|
@@ -215,14 +296,14 @@ var FormFieldCheckbox = ({
|
|
|
215
296
|
width: "100%",
|
|
216
297
|
...sx
|
|
217
298
|
},
|
|
218
|
-
children: [/* @__PURE__ */
|
|
299
|
+
children: [/* @__PURE__ */jsx5(Flex2, {
|
|
219
300
|
sx: {
|
|
220
301
|
alignItems: "center"
|
|
221
302
|
},
|
|
222
303
|
children: /* @__PURE__ */jsxs2(Label2, {
|
|
223
304
|
"aria-disabled": checkboxProps.disabled,
|
|
224
305
|
htmlFor: id,
|
|
225
|
-
children: [/* @__PURE__ */
|
|
306
|
+
children: [/* @__PURE__ */jsx5(Checkbox, {
|
|
226
307
|
id,
|
|
227
308
|
ref,
|
|
228
309
|
checked: value,
|
|
@@ -233,36 +314,36 @@ var FormFieldCheckbox = ({
|
|
|
233
314
|
...checkboxProps
|
|
234
315
|
}), label]
|
|
235
316
|
})
|
|
236
|
-
}), /* @__PURE__ */
|
|
317
|
+
}), /* @__PURE__ */jsx5(ErrorMessage, {
|
|
237
318
|
name
|
|
238
319
|
})]
|
|
239
320
|
});
|
|
240
321
|
};
|
|
241
322
|
|
|
242
323
|
// src/FormFieldPatternFormat.tsx
|
|
243
|
-
import { Input } from "@ttoss/ui";
|
|
244
|
-
import { PatternFormat } from "react-number-format";
|
|
245
|
-
import { jsx as
|
|
324
|
+
import { Input as Input2 } from "@ttoss/ui";
|
|
325
|
+
import { PatternFormat as PatternFormat2 } from "react-number-format";
|
|
326
|
+
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
246
327
|
var FormFieldPatternFormat = ({
|
|
247
328
|
label,
|
|
248
329
|
name,
|
|
249
330
|
...patternFormatProps
|
|
250
331
|
}) => {
|
|
251
|
-
return /* @__PURE__ */
|
|
332
|
+
return /* @__PURE__ */jsx6(FormField, {
|
|
252
333
|
name,
|
|
253
334
|
label,
|
|
254
335
|
render: ({
|
|
255
336
|
field,
|
|
256
337
|
fieldState
|
|
257
338
|
}) => {
|
|
258
|
-
return /* @__PURE__ */
|
|
339
|
+
return /* @__PURE__ */jsx6(PatternFormat2, {
|
|
259
340
|
name: field.name,
|
|
260
341
|
value: field.value,
|
|
261
342
|
onBlur: field.onBlur,
|
|
262
343
|
onValueChange: values => {
|
|
263
344
|
field.onChange(values.value);
|
|
264
345
|
},
|
|
265
|
-
customInput:
|
|
346
|
+
customInput: Input2,
|
|
266
347
|
"aria-invalid": Boolean(fieldState.error).valueOf(),
|
|
267
348
|
...patternFormatProps
|
|
268
349
|
});
|
|
@@ -271,13 +352,13 @@ var FormFieldPatternFormat = ({
|
|
|
271
352
|
};
|
|
272
353
|
|
|
273
354
|
// src/FormFieldCreditCardNumber.tsx
|
|
274
|
-
import { jsx as
|
|
355
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
275
356
|
var FormFieldCreditCardNumber = ({
|
|
276
357
|
label,
|
|
277
358
|
name,
|
|
278
359
|
...formFieldPatternFormatProps
|
|
279
360
|
}) => {
|
|
280
|
-
return /* @__PURE__ */
|
|
361
|
+
return /* @__PURE__ */jsx7(FormFieldPatternFormat, {
|
|
281
362
|
name,
|
|
282
363
|
label,
|
|
283
364
|
format: "#### #### #### ####",
|
|
@@ -287,28 +368,28 @@ var FormFieldCreditCardNumber = ({
|
|
|
287
368
|
};
|
|
288
369
|
|
|
289
370
|
// src/FormFieldNumericFormat.tsx
|
|
290
|
-
import { Input as
|
|
371
|
+
import { Input as Input3 } from "@ttoss/ui";
|
|
291
372
|
import { NumericFormat } from "react-number-format";
|
|
292
|
-
import { jsx as
|
|
373
|
+
import { jsx as jsx8 } from "react/jsx-runtime";
|
|
293
374
|
var FormFieldNumericFormat = ({
|
|
294
375
|
label,
|
|
295
376
|
name,
|
|
296
377
|
...numericFormatProps
|
|
297
378
|
}) => {
|
|
298
|
-
return /* @__PURE__ */
|
|
379
|
+
return /* @__PURE__ */jsx8(FormField, {
|
|
299
380
|
label,
|
|
300
381
|
name,
|
|
301
382
|
render: ({
|
|
302
383
|
field
|
|
303
384
|
}) => {
|
|
304
|
-
return /* @__PURE__ */
|
|
385
|
+
return /* @__PURE__ */jsx8(NumericFormat, {
|
|
305
386
|
name: field.name,
|
|
306
387
|
value: field.value,
|
|
307
388
|
onBlur: field.onBlur,
|
|
308
389
|
onValueChange: values => {
|
|
309
390
|
field.onChange(values.floatValue);
|
|
310
391
|
},
|
|
311
|
-
customInput:
|
|
392
|
+
customInput: Input3,
|
|
312
393
|
...numericFormatProps
|
|
313
394
|
});
|
|
314
395
|
}
|
|
@@ -316,7 +397,7 @@ var FormFieldNumericFormat = ({
|
|
|
316
397
|
};
|
|
317
398
|
|
|
318
399
|
// src/FormFieldCurrencyInput.tsx
|
|
319
|
-
import { jsx as
|
|
400
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
320
401
|
var FormFieldCurrencyInput = ({
|
|
321
402
|
label,
|
|
322
403
|
name,
|
|
@@ -325,7 +406,7 @@ var FormFieldCurrencyInput = ({
|
|
|
325
406
|
thousandSeparator,
|
|
326
407
|
...formFieldNumericFormatProps
|
|
327
408
|
}) => {
|
|
328
|
-
return /* @__PURE__ */
|
|
409
|
+
return /* @__PURE__ */jsx9(FormFieldNumericFormat, {
|
|
329
410
|
name,
|
|
330
411
|
label,
|
|
331
412
|
fixedDecimalScale: true,
|
|
@@ -340,8 +421,8 @@ var FormFieldCurrencyInput = ({
|
|
|
340
421
|
};
|
|
341
422
|
|
|
342
423
|
// src/FormFieldInput.tsx
|
|
343
|
-
import { Input as
|
|
344
|
-
import { jsx as
|
|
424
|
+
import { Input as Input4 } from "@ttoss/ui";
|
|
425
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
345
426
|
var FormFieldInput = ({
|
|
346
427
|
label,
|
|
347
428
|
name,
|
|
@@ -351,7 +432,7 @@ var FormFieldInput = ({
|
|
|
351
432
|
defaultValue = "",
|
|
352
433
|
...inputProps
|
|
353
434
|
}) => {
|
|
354
|
-
return /* @__PURE__ */
|
|
435
|
+
return /* @__PURE__ */jsx10(FormField, {
|
|
355
436
|
name,
|
|
356
437
|
label,
|
|
357
438
|
disabled: inputProps.disabled,
|
|
@@ -363,7 +444,7 @@ var FormFieldInput = ({
|
|
|
363
444
|
field,
|
|
364
445
|
fieldState
|
|
365
446
|
}) => {
|
|
366
|
-
return /* @__PURE__ */
|
|
447
|
+
return /* @__PURE__ */jsx10(Input4, {
|
|
367
448
|
...inputProps,
|
|
368
449
|
...field,
|
|
369
450
|
"aria-invalid": fieldState.error ? "true" : void 0
|
|
@@ -374,7 +455,7 @@ var FormFieldInput = ({
|
|
|
374
455
|
|
|
375
456
|
// src/FormFieldPassword.tsx
|
|
376
457
|
import { InputPassword } from "@ttoss/ui";
|
|
377
|
-
import { jsx as
|
|
458
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
378
459
|
var FormFieldPassword = ({
|
|
379
460
|
label,
|
|
380
461
|
name,
|
|
@@ -384,7 +465,7 @@ var FormFieldPassword = ({
|
|
|
384
465
|
defaultValue = "",
|
|
385
466
|
...inputProps
|
|
386
467
|
}) => {
|
|
387
|
-
return /* @__PURE__ */
|
|
468
|
+
return /* @__PURE__ */jsx11(FormField, {
|
|
388
469
|
name,
|
|
389
470
|
label,
|
|
390
471
|
disabled: inputProps.disabled,
|
|
@@ -396,7 +477,7 @@ var FormFieldPassword = ({
|
|
|
396
477
|
field,
|
|
397
478
|
fieldState
|
|
398
479
|
}) => {
|
|
399
|
-
return /* @__PURE__ */
|
|
480
|
+
return /* @__PURE__ */jsx11(InputPassword, {
|
|
400
481
|
...inputProps,
|
|
401
482
|
...field,
|
|
402
483
|
"aria-invalid": fieldState.error ? "true" : void 0
|
|
@@ -408,7 +489,7 @@ var FormFieldPassword = ({
|
|
|
408
489
|
// src/FormFieldRadio.tsx
|
|
409
490
|
import { Box as Box2, Flex as Flex3, Label as Label3, Radio } from "@ttoss/ui";
|
|
410
491
|
import { useController as useController3 } from "react-hook-form";
|
|
411
|
-
import { jsx as
|
|
492
|
+
import { jsx as jsx12, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
412
493
|
var FormFieldRadio = ({
|
|
413
494
|
label,
|
|
414
495
|
name,
|
|
@@ -433,17 +514,17 @@ var FormFieldRadio = ({
|
|
|
433
514
|
width: "100%",
|
|
434
515
|
...sx
|
|
435
516
|
},
|
|
436
|
-
children: [label && /* @__PURE__ */
|
|
517
|
+
children: [label && /* @__PURE__ */jsx12(Label3, {
|
|
437
518
|
sx: {
|
|
438
519
|
marginBottom: "md"
|
|
439
520
|
},
|
|
440
521
|
children: label
|
|
441
|
-
}), /* @__PURE__ */
|
|
522
|
+
}), /* @__PURE__ */jsx12(Box2, {
|
|
442
523
|
children: options.map(option => {
|
|
443
524
|
const id = `form-field-radio-${name}-${option.value}`;
|
|
444
525
|
return /* @__PURE__ */jsxs3(Label3, {
|
|
445
526
|
htmlFor: id,
|
|
446
|
-
children: [/* @__PURE__ */
|
|
527
|
+
children: [/* @__PURE__ */jsx12(Radio, {
|
|
447
528
|
ref,
|
|
448
529
|
onChange,
|
|
449
530
|
onBlur,
|
|
@@ -455,7 +536,7 @@ var FormFieldRadio = ({
|
|
|
455
536
|
}), option.label]
|
|
456
537
|
}, id);
|
|
457
538
|
})
|
|
458
|
-
}), /* @__PURE__ */
|
|
539
|
+
}), /* @__PURE__ */jsx12(ErrorMessage, {
|
|
459
540
|
name
|
|
460
541
|
})]
|
|
461
542
|
});
|
|
@@ -463,7 +544,7 @@ var FormFieldRadio = ({
|
|
|
463
544
|
|
|
464
545
|
// src/FormFieldSelect.tsx
|
|
465
546
|
import { Select } from "@ttoss/ui";
|
|
466
|
-
import { jsx as
|
|
547
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
467
548
|
var FormFieldSelect = ({
|
|
468
549
|
label,
|
|
469
550
|
name,
|
|
@@ -476,7 +557,7 @@ var FormFieldSelect = ({
|
|
|
476
557
|
onTooltipClick,
|
|
477
558
|
...selectProps
|
|
478
559
|
}) => {
|
|
479
|
-
return /* @__PURE__ */
|
|
560
|
+
return /* @__PURE__ */jsx13(FormField, {
|
|
480
561
|
name,
|
|
481
562
|
label,
|
|
482
563
|
id,
|
|
@@ -490,7 +571,7 @@ var FormFieldSelect = ({
|
|
|
490
571
|
field,
|
|
491
572
|
fieldState
|
|
492
573
|
}) => {
|
|
493
|
-
return /* @__PURE__ */
|
|
574
|
+
return /* @__PURE__ */jsx13(Select, {
|
|
494
575
|
...selectProps,
|
|
495
576
|
...field,
|
|
496
577
|
isDisabled: disabled,
|
|
@@ -502,7 +583,7 @@ var FormFieldSelect = ({
|
|
|
502
583
|
|
|
503
584
|
// src/FormFieldTextarea.tsx
|
|
504
585
|
import { Textarea } from "@ttoss/ui";
|
|
505
|
-
import { jsx as
|
|
586
|
+
import { jsx as jsx14 } from "react/jsx-runtime";
|
|
506
587
|
var FormFieldTextarea = ({
|
|
507
588
|
label,
|
|
508
589
|
name,
|
|
@@ -510,7 +591,7 @@ var FormFieldTextarea = ({
|
|
|
510
591
|
...textareaProps
|
|
511
592
|
}) => {
|
|
512
593
|
const id = `form-field-textarea-${name}`;
|
|
513
|
-
return /* @__PURE__ */
|
|
594
|
+
return /* @__PURE__ */jsx14(FormField, {
|
|
514
595
|
label,
|
|
515
596
|
name,
|
|
516
597
|
id,
|
|
@@ -519,7 +600,7 @@ var FormFieldTextarea = ({
|
|
|
519
600
|
field,
|
|
520
601
|
fieldState
|
|
521
602
|
}) => {
|
|
522
|
-
return /* @__PURE__ */
|
|
603
|
+
return /* @__PURE__ */jsx14(Textarea, {
|
|
523
604
|
...field,
|
|
524
605
|
...textareaProps,
|
|
525
606
|
"aria-invalid": fieldState.error ? "true" : void 0
|
|
@@ -531,7 +612,7 @@ var FormFieldTextarea = ({
|
|
|
531
612
|
// src/FormGroup.tsx
|
|
532
613
|
import * as React2 from "react";
|
|
533
614
|
import { Box as Box3, Flex as Flex4, Text } from "@ttoss/ui";
|
|
534
|
-
import { jsx as
|
|
615
|
+
import { jsx as jsx15, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
535
616
|
var FormGroupLevelsManagerContext = /*#__PURE__*/React2.createContext({
|
|
536
617
|
levelsLength: 1,
|
|
537
618
|
registerChild: () => {
|
|
@@ -547,7 +628,7 @@ var FormGroupLevelsManager = ({
|
|
|
547
628
|
setLevelsLength(level + 1);
|
|
548
629
|
}
|
|
549
630
|
}, [levelsLength]);
|
|
550
|
-
return /* @__PURE__ */
|
|
631
|
+
return /* @__PURE__ */jsx15(FormGroupLevelsManagerContext.Provider, {
|
|
551
632
|
value: {
|
|
552
633
|
levelsLength,
|
|
553
634
|
registerChild
|
|
@@ -598,18 +679,18 @@ var FormGroupWrapper = ({
|
|
|
598
679
|
marginBottom: "lg",
|
|
599
680
|
...boxProps.sx
|
|
600
681
|
},
|
|
601
|
-
children: [title && /* @__PURE__ */
|
|
682
|
+
children: [title && /* @__PURE__ */jsx15(Box3, {
|
|
602
683
|
sx: {
|
|
603
684
|
marginBottom: "md"
|
|
604
685
|
},
|
|
605
|
-
children: /* @__PURE__ */
|
|
686
|
+
children: /* @__PURE__ */jsx15(Text, {
|
|
606
687
|
sx: {
|
|
607
688
|
fontSize: "2xl",
|
|
608
689
|
fontWeight: "bold"
|
|
609
690
|
},
|
|
610
691
|
children: title
|
|
611
692
|
})
|
|
612
|
-
}), /* @__PURE__ */
|
|
693
|
+
}), /* @__PURE__ */jsx15(Flex4, {
|
|
613
694
|
sx: childrenContainerSx,
|
|
614
695
|
children
|
|
615
696
|
})]
|
|
@@ -620,15 +701,15 @@ var FormGroup = props => {
|
|
|
620
701
|
level
|
|
621
702
|
} = useFormGroup();
|
|
622
703
|
const currentLevel = level === void 0 ? 0 : level + 1;
|
|
623
|
-
return /* @__PURE__ */
|
|
704
|
+
return /* @__PURE__ */jsx15(FormGroupContext.Provider, {
|
|
624
705
|
value: {
|
|
625
706
|
parentLevel: currentLevel
|
|
626
707
|
},
|
|
627
|
-
children: currentLevel === 0 ? /* @__PURE__ */
|
|
628
|
-
children: /* @__PURE__ */
|
|
708
|
+
children: currentLevel === 0 ? /* @__PURE__ */jsx15(FormGroupLevelsManager, {
|
|
709
|
+
children: /* @__PURE__ */jsx15(FormGroupWrapper, {
|
|
629
710
|
...props
|
|
630
711
|
})
|
|
631
|
-
}) : /* @__PURE__ */
|
|
712
|
+
}) : /* @__PURE__ */jsx15(FormGroupWrapper, {
|
|
632
713
|
...props
|
|
633
714
|
})
|
|
634
715
|
});
|
|
@@ -637,4 +718,4 @@ var FormGroup = props => {
|
|
|
637
718
|
// src/index.ts
|
|
638
719
|
import { useForm, useFormContext as useFormContext2, useWatch, useFieldArray, useController as useController4, useFormState, Controller, FormProvider as FormProvider2 } from "react-hook-form";
|
|
639
720
|
export * from "react-hook-form";
|
|
640
|
-
export { Form, FormField, FormFieldCheckbox, FormFieldPatternFormat, FormFieldCreditCardNumber, FormFieldNumericFormat, FormFieldCurrencyInput, FormFieldInput, FormFieldPassword, FormFieldRadio, FormFieldSelect, FormFieldTextarea, useFormGroup, FormGroup, yupResolver,
|
|
721
|
+
export { isCnpjValid, FormFieldCNPJ, yup2 as yup, Form, FormField, FormFieldCheckbox, FormFieldPatternFormat, FormFieldCreditCardNumber, FormFieldNumericFormat, FormFieldCurrencyInput, FormFieldInput, FormFieldPassword, FormFieldRadio, FormFieldSelect, FormFieldTextarea, useFormGroup, FormGroup, yupResolver, useForm, useFormContext2 as useFormContext, useWatch, useFieldArray, useController4 as useController, useFormState, Controller, FormProvider2 as FormProvider };
|
package/dist/esm/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
|
|
2
|
-
import { Controller, Form, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldPatternFormat, FormFieldRadio, FormFieldSelect, FormFieldTextarea, FormGroup, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormGroup, useFormState, useWatch, yup, yupResolver } from "./chunk-
|
|
2
|
+
import { Controller, Form, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldPatternFormat, FormFieldRadio, FormFieldSelect, FormFieldTextarea, FormGroup, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormGroup, useFormState, useWatch, yup, yupResolver } from "./chunk-J6VGD2RH.js";
|
|
3
3
|
export { Controller, Form, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldPatternFormat, FormFieldRadio, FormFieldSelect, FormFieldTextarea, FormGroup, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormGroup, useFormState, useWatch, yup, yupResolver };
|
package/dist/index.d.mts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export { yupResolver } from '@hookform/resolvers/yup';
|
|
2
|
+
import './typings.d-KteERiXO.mjs';
|
|
2
3
|
import * as yup from 'yup';
|
|
3
4
|
export { yup };
|
|
4
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
@@ -8,7 +9,9 @@ export * from 'react-hook-form';
|
|
|
8
9
|
export { Controller, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch } from 'react-hook-form';
|
|
9
10
|
import * as React from 'react';
|
|
10
11
|
import { BoxProps, SxProp, CheckboxProps, InputProps, InputPasswordProps, RadioProps, SelectProps, TextareaProps } from '@ttoss/ui';
|
|
11
|
-
import {
|
|
12
|
+
import { F as FormFieldPatternFormatProps } from './FormFieldPatternFormat-DF8nU9tn.mjs';
|
|
13
|
+
export { a as FormFieldPatternFormat } from './FormFieldPatternFormat-DF8nU9tn.mjs';
|
|
14
|
+
import { NumericFormatProps } from 'react-number-format';
|
|
12
15
|
|
|
13
16
|
declare const Form: <TFieldValues extends FieldValues = FieldValues>({ children, onSubmit, sx, ...formMethods }: {
|
|
14
17
|
children?: React.ReactNode;
|
|
@@ -37,12 +40,6 @@ declare const FormFieldCheckbox: <TFieldValues extends FieldValues = FieldValues
|
|
|
37
40
|
name: FieldPath<TFieldValues>;
|
|
38
41
|
} & CheckboxProps) => react_jsx_runtime.JSX.Element;
|
|
39
42
|
|
|
40
|
-
type FormFieldPatternFormatProps = {
|
|
41
|
-
label?: string;
|
|
42
|
-
name: string;
|
|
43
|
-
} & PatternFormatProps;
|
|
44
|
-
declare const FormFieldPatternFormat: ({ label, name, ...patternFormatProps }: FormFieldPatternFormatProps) => react_jsx_runtime.JSX.Element;
|
|
45
|
-
|
|
46
43
|
type FormFieldCreditCardNumberProps = {
|
|
47
44
|
label: string;
|
|
48
45
|
name: string;
|
|
@@ -104,4 +101,4 @@ type FormGroupProps = {
|
|
|
104
101
|
} & BoxProps;
|
|
105
102
|
declare const FormGroup: (props: FormGroupProps) => react_jsx_runtime.JSX.Element;
|
|
106
103
|
|
|
107
|
-
export { Form, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword,
|
|
104
|
+
export { Form, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldRadio, FormFieldSelect, FormFieldTextarea, FormGroup, useFormGroup };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export { yupResolver } from '@hookform/resolvers/yup';
|
|
2
|
+
import './typings.d-KteERiXO.js';
|
|
2
3
|
import * as yup from 'yup';
|
|
3
4
|
export { yup };
|
|
4
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
@@ -8,7 +9,9 @@ export * from 'react-hook-form';
|
|
|
8
9
|
export { Controller, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch } from 'react-hook-form';
|
|
9
10
|
import * as React from 'react';
|
|
10
11
|
import { BoxProps, SxProp, CheckboxProps, InputProps, InputPasswordProps, RadioProps, SelectProps, TextareaProps } from '@ttoss/ui';
|
|
11
|
-
import {
|
|
12
|
+
import { F as FormFieldPatternFormatProps } from './FormFieldPatternFormat-DF8nU9tn.js';
|
|
13
|
+
export { a as FormFieldPatternFormat } from './FormFieldPatternFormat-DF8nU9tn.js';
|
|
14
|
+
import { NumericFormatProps } from 'react-number-format';
|
|
12
15
|
|
|
13
16
|
declare const Form: <TFieldValues extends FieldValues = FieldValues>({ children, onSubmit, sx, ...formMethods }: {
|
|
14
17
|
children?: React.ReactNode;
|
|
@@ -37,12 +40,6 @@ declare const FormFieldCheckbox: <TFieldValues extends FieldValues = FieldValues
|
|
|
37
40
|
name: FieldPath<TFieldValues>;
|
|
38
41
|
} & CheckboxProps) => react_jsx_runtime.JSX.Element;
|
|
39
42
|
|
|
40
|
-
type FormFieldPatternFormatProps = {
|
|
41
|
-
label?: string;
|
|
42
|
-
name: string;
|
|
43
|
-
} & PatternFormatProps;
|
|
44
|
-
declare const FormFieldPatternFormat: ({ label, name, ...patternFormatProps }: FormFieldPatternFormatProps) => react_jsx_runtime.JSX.Element;
|
|
45
|
-
|
|
46
43
|
type FormFieldCreditCardNumberProps = {
|
|
47
44
|
label: string;
|
|
48
45
|
name: string;
|
|
@@ -104,4 +101,4 @@ type FormGroupProps = {
|
|
|
104
101
|
} & BoxProps;
|
|
105
102
|
declare const FormGroup: (props: FormGroupProps) => react_jsx_runtime.JSX.Element;
|
|
106
103
|
|
|
107
|
-
export { Form, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword,
|
|
104
|
+
export { Form, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldRadio, FormFieldSelect, FormFieldTextarea, FormGroup, useFormGroup };
|