@faasjs/react 3.7.0-beta.5 → 3.7.0-beta.6
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/index.d.mts +19 -2
- package/dist/index.d.ts +19 -2
- package/dist/index.js +26 -10
- package/dist/index.mjs +26 -10
- package/package.json +3 -3
package/dist/index.d.mts
CHANGED
|
@@ -264,6 +264,14 @@ type FaasReactClientOptions = {
|
|
|
264
264
|
/** @default `/` */
|
|
265
265
|
baseUrl?: BaseUrl;
|
|
266
266
|
options?: Options;
|
|
267
|
+
/**
|
|
268
|
+
* @example
|
|
269
|
+
* ```ts
|
|
270
|
+
* onError: (action, params) => async (res) => {
|
|
271
|
+
* console.error(action, params, res)
|
|
272
|
+
* }
|
|
273
|
+
* ```
|
|
274
|
+
*/
|
|
267
275
|
onError?: OnError;
|
|
268
276
|
};
|
|
269
277
|
type FaasReactClientInstance = {
|
|
@@ -386,6 +394,13 @@ type FormInputElementProps = {
|
|
|
386
394
|
onChange: (value: any) => void;
|
|
387
395
|
};
|
|
388
396
|
|
|
397
|
+
declare const FormDefaultLang: {
|
|
398
|
+
submit: string;
|
|
399
|
+
required: string;
|
|
400
|
+
number: string;
|
|
401
|
+
};
|
|
402
|
+
type FormLang = typeof FormDefaultLang;
|
|
403
|
+
|
|
389
404
|
type FormRules = {
|
|
390
405
|
type?: 'string' | 'number';
|
|
391
406
|
required?: boolean;
|
|
@@ -420,10 +435,11 @@ declare const FormDefaultElements: FormElementTypes;
|
|
|
420
435
|
type FormProps<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes> = {
|
|
421
436
|
items: FormLabelElementProps<FormElements>[];
|
|
422
437
|
onSubmit?: (values: Values) => Promise<void>;
|
|
423
|
-
|
|
438
|
+
Elements?: Partial<FormElements>;
|
|
439
|
+
lang?: Partial<FormLang>;
|
|
424
440
|
defaultValues?: Values;
|
|
425
441
|
};
|
|
426
|
-
declare function FormContainer<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes>({ defaultValues,
|
|
442
|
+
declare function FormContainer<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes>({ defaultValues, Elements, lang, ...props }: FormProps<Values, FormElements>): react_jsx_runtime.JSX.Element;
|
|
427
443
|
declare namespace FormContainer {
|
|
428
444
|
var displayName: string;
|
|
429
445
|
var whyDidYouRender: boolean;
|
|
@@ -433,6 +449,7 @@ type FormContextProps<Values extends Record<string, any> = Record<string, any>>
|
|
|
433
449
|
items: FormLabelElementProps[];
|
|
434
450
|
onSubmit: (values: Values) => Promise<void>;
|
|
435
451
|
Elements: FormElementTypes;
|
|
452
|
+
lang: FormLang;
|
|
436
453
|
submitting: boolean;
|
|
437
454
|
setSubmitting: Dispatch<SetStateAction<boolean>>;
|
|
438
455
|
values: Values;
|
package/dist/index.d.ts
CHANGED
|
@@ -264,6 +264,14 @@ type FaasReactClientOptions = {
|
|
|
264
264
|
/** @default `/` */
|
|
265
265
|
baseUrl?: BaseUrl;
|
|
266
266
|
options?: Options;
|
|
267
|
+
/**
|
|
268
|
+
* @example
|
|
269
|
+
* ```ts
|
|
270
|
+
* onError: (action, params) => async (res) => {
|
|
271
|
+
* console.error(action, params, res)
|
|
272
|
+
* }
|
|
273
|
+
* ```
|
|
274
|
+
*/
|
|
267
275
|
onError?: OnError;
|
|
268
276
|
};
|
|
269
277
|
type FaasReactClientInstance = {
|
|
@@ -386,6 +394,13 @@ type FormInputElementProps = {
|
|
|
386
394
|
onChange: (value: any) => void;
|
|
387
395
|
};
|
|
388
396
|
|
|
397
|
+
declare const FormDefaultLang: {
|
|
398
|
+
submit: string;
|
|
399
|
+
required: string;
|
|
400
|
+
number: string;
|
|
401
|
+
};
|
|
402
|
+
type FormLang = typeof FormDefaultLang;
|
|
403
|
+
|
|
389
404
|
type FormRules = {
|
|
390
405
|
type?: 'string' | 'number';
|
|
391
406
|
required?: boolean;
|
|
@@ -420,10 +435,11 @@ declare const FormDefaultElements: FormElementTypes;
|
|
|
420
435
|
type FormProps<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes> = {
|
|
421
436
|
items: FormLabelElementProps<FormElements>[];
|
|
422
437
|
onSubmit?: (values: Values) => Promise<void>;
|
|
423
|
-
|
|
438
|
+
Elements?: Partial<FormElements>;
|
|
439
|
+
lang?: Partial<FormLang>;
|
|
424
440
|
defaultValues?: Values;
|
|
425
441
|
};
|
|
426
|
-
declare function FormContainer<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes>({ defaultValues,
|
|
442
|
+
declare function FormContainer<Values extends Record<string, any> = Record<string, any>, FormElements extends FormElementTypes = FormElementTypes>({ defaultValues, Elements, lang, ...props }: FormProps<Values, FormElements>): react_jsx_runtime.JSX.Element;
|
|
427
443
|
declare namespace FormContainer {
|
|
428
444
|
var displayName: string;
|
|
429
445
|
var whyDidYouRender: boolean;
|
|
@@ -433,6 +449,7 @@ type FormContextProps<Values extends Record<string, any> = Record<string, any>>
|
|
|
433
449
|
items: FormLabelElementProps[];
|
|
434
450
|
onSubmit: (values: Values) => Promise<void>;
|
|
435
451
|
Elements: FormElementTypes;
|
|
452
|
+
lang: FormLang;
|
|
436
453
|
submitting: boolean;
|
|
437
454
|
setSubmitting: Dispatch<SetStateAction<boolean>>;
|
|
438
455
|
values: Values;
|
package/dist/index.js
CHANGED
|
@@ -20,6 +20,7 @@ function equal(a, b) {
|
|
|
20
20
|
if ((a === null || a === void 0) && (b === null || b === void 0))
|
|
21
21
|
return true;
|
|
22
22
|
if (typeof a !== typeof b) return false;
|
|
23
|
+
if (b === null || b === void 0) return false;
|
|
23
24
|
const ctor = a.constructor;
|
|
24
25
|
if (ctor !== b.constructor) return false;
|
|
25
26
|
switch (ctor) {
|
|
@@ -347,6 +348,7 @@ var FormContext = createSplittingContext([
|
|
|
347
348
|
"items",
|
|
348
349
|
"onSubmit",
|
|
349
350
|
"Elements",
|
|
351
|
+
"lang",
|
|
350
352
|
"submitting",
|
|
351
353
|
"setSubmitting",
|
|
352
354
|
"values",
|
|
@@ -371,20 +373,20 @@ FormBody.displayName = "FormBody";
|
|
|
371
373
|
FormBody.whyDidYouRender = true;
|
|
372
374
|
|
|
373
375
|
// src/Form/rules.ts
|
|
374
|
-
async function validValue(rules, value) {
|
|
376
|
+
async function validValue(rules, value, lang) {
|
|
375
377
|
if (rules.required && (value === null || value === void 0 || value === "" || Number.isNaN(value)))
|
|
376
|
-
return { message:
|
|
378
|
+
return { message: lang.required };
|
|
377
379
|
if (rules.type === "number" && Number.isNaN(Number(value)))
|
|
378
|
-
return { message:
|
|
380
|
+
return { message: lang.number };
|
|
379
381
|
return rules.custom?.(value);
|
|
380
382
|
}
|
|
381
|
-
async function validValues(items, values) {
|
|
383
|
+
async function validValues(items, values, lang) {
|
|
382
384
|
const errors = {};
|
|
383
385
|
for (const item of items) {
|
|
384
386
|
const value = values[item.name];
|
|
385
387
|
const rules = item.rules;
|
|
386
388
|
if (rules) {
|
|
387
|
-
const error = await validValue(rules, value);
|
|
389
|
+
const error = await validValue(rules, value, lang);
|
|
388
390
|
if (error) errors[item.name] = error;
|
|
389
391
|
}
|
|
390
392
|
}
|
|
@@ -398,7 +400,8 @@ function FormFooter() {
|
|
|
398
400
|
values,
|
|
399
401
|
Elements,
|
|
400
402
|
items,
|
|
401
|
-
setErrors
|
|
403
|
+
setErrors,
|
|
404
|
+
lang
|
|
402
405
|
} = useFormContext();
|
|
403
406
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
404
407
|
Elements.Button,
|
|
@@ -406,7 +409,7 @@ function FormFooter() {
|
|
|
406
409
|
disabled: submitting,
|
|
407
410
|
submit: async () => {
|
|
408
411
|
setSubmitting(true);
|
|
409
|
-
const errors = await validValues(items, values);
|
|
412
|
+
const errors = await validValues(items, values, lang);
|
|
410
413
|
if (Object.keys(errors).length) {
|
|
411
414
|
setErrors(errors);
|
|
412
415
|
setSubmitting(false);
|
|
@@ -414,7 +417,7 @@ function FormFooter() {
|
|
|
414
417
|
}
|
|
415
418
|
onSubmit(values).finally(() => setSubmitting(false));
|
|
416
419
|
},
|
|
417
|
-
children:
|
|
420
|
+
children: lang.submit
|
|
418
421
|
}
|
|
419
422
|
);
|
|
420
423
|
}
|
|
@@ -490,18 +493,31 @@ var FormDefaultElements = {
|
|
|
490
493
|
Input: FormInputElement,
|
|
491
494
|
Button: FormButtonElement
|
|
492
495
|
};
|
|
496
|
+
|
|
497
|
+
// src/Form/lang.ts
|
|
498
|
+
var FormDefaultLang = {
|
|
499
|
+
submit: "Submit",
|
|
500
|
+
required: "This field is required",
|
|
501
|
+
number: "This field must be a number"
|
|
502
|
+
};
|
|
493
503
|
function mergeValues(items, defaultValues = {}) {
|
|
494
504
|
const values = {};
|
|
495
505
|
for (const item of items)
|
|
496
506
|
values[item.name] = defaultValues[item.name] ?? "";
|
|
497
507
|
return values;
|
|
498
508
|
}
|
|
499
|
-
function FormContainer({
|
|
509
|
+
function FormContainer({
|
|
510
|
+
defaultValues,
|
|
511
|
+
Elements,
|
|
512
|
+
lang,
|
|
513
|
+
...props
|
|
514
|
+
}) {
|
|
500
515
|
const states = useSplittingState({
|
|
501
516
|
values: mergeValues(props.items, defaultValues),
|
|
502
517
|
errors: {},
|
|
503
518
|
submitting: false,
|
|
504
|
-
Elements: Object.assign(FormDefaultElements,
|
|
519
|
+
Elements: Object.assign(FormDefaultElements, Elements),
|
|
520
|
+
lang: Object.assign(FormDefaultLang, lang)
|
|
505
521
|
});
|
|
506
522
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
507
523
|
FormContextProvider,
|
package/dist/index.mjs
CHANGED
|
@@ -18,6 +18,7 @@ function equal(a, b) {
|
|
|
18
18
|
if ((a === null || a === void 0) && (b === null || b === void 0))
|
|
19
19
|
return true;
|
|
20
20
|
if (typeof a !== typeof b) return false;
|
|
21
|
+
if (b === null || b === void 0) return false;
|
|
21
22
|
const ctor = a.constructor;
|
|
22
23
|
if (ctor !== b.constructor) return false;
|
|
23
24
|
switch (ctor) {
|
|
@@ -345,6 +346,7 @@ var FormContext = createSplittingContext([
|
|
|
345
346
|
"items",
|
|
346
347
|
"onSubmit",
|
|
347
348
|
"Elements",
|
|
349
|
+
"lang",
|
|
348
350
|
"submitting",
|
|
349
351
|
"setSubmitting",
|
|
350
352
|
"values",
|
|
@@ -369,20 +371,20 @@ FormBody.displayName = "FormBody";
|
|
|
369
371
|
FormBody.whyDidYouRender = true;
|
|
370
372
|
|
|
371
373
|
// src/Form/rules.ts
|
|
372
|
-
async function validValue(rules, value) {
|
|
374
|
+
async function validValue(rules, value, lang) {
|
|
373
375
|
if (rules.required && (value === null || value === void 0 || value === "" || Number.isNaN(value)))
|
|
374
|
-
return { message:
|
|
376
|
+
return { message: lang.required };
|
|
375
377
|
if (rules.type === "number" && Number.isNaN(Number(value)))
|
|
376
|
-
return { message:
|
|
378
|
+
return { message: lang.number };
|
|
377
379
|
return rules.custom?.(value);
|
|
378
380
|
}
|
|
379
|
-
async function validValues(items, values) {
|
|
381
|
+
async function validValues(items, values, lang) {
|
|
380
382
|
const errors = {};
|
|
381
383
|
for (const item of items) {
|
|
382
384
|
const value = values[item.name];
|
|
383
385
|
const rules = item.rules;
|
|
384
386
|
if (rules) {
|
|
385
|
-
const error = await validValue(rules, value);
|
|
387
|
+
const error = await validValue(rules, value, lang);
|
|
386
388
|
if (error) errors[item.name] = error;
|
|
387
389
|
}
|
|
388
390
|
}
|
|
@@ -396,7 +398,8 @@ function FormFooter() {
|
|
|
396
398
|
values,
|
|
397
399
|
Elements,
|
|
398
400
|
items,
|
|
399
|
-
setErrors
|
|
401
|
+
setErrors,
|
|
402
|
+
lang
|
|
400
403
|
} = useFormContext();
|
|
401
404
|
return /* @__PURE__ */ jsx(
|
|
402
405
|
Elements.Button,
|
|
@@ -404,7 +407,7 @@ function FormFooter() {
|
|
|
404
407
|
disabled: submitting,
|
|
405
408
|
submit: async () => {
|
|
406
409
|
setSubmitting(true);
|
|
407
|
-
const errors = await validValues(items, values);
|
|
410
|
+
const errors = await validValues(items, values, lang);
|
|
408
411
|
if (Object.keys(errors).length) {
|
|
409
412
|
setErrors(errors);
|
|
410
413
|
setSubmitting(false);
|
|
@@ -412,7 +415,7 @@ function FormFooter() {
|
|
|
412
415
|
}
|
|
413
416
|
onSubmit(values).finally(() => setSubmitting(false));
|
|
414
417
|
},
|
|
415
|
-
children:
|
|
418
|
+
children: lang.submit
|
|
416
419
|
}
|
|
417
420
|
);
|
|
418
421
|
}
|
|
@@ -488,18 +491,31 @@ var FormDefaultElements = {
|
|
|
488
491
|
Input: FormInputElement,
|
|
489
492
|
Button: FormButtonElement
|
|
490
493
|
};
|
|
494
|
+
|
|
495
|
+
// src/Form/lang.ts
|
|
496
|
+
var FormDefaultLang = {
|
|
497
|
+
submit: "Submit",
|
|
498
|
+
required: "This field is required",
|
|
499
|
+
number: "This field must be a number"
|
|
500
|
+
};
|
|
491
501
|
function mergeValues(items, defaultValues = {}) {
|
|
492
502
|
const values = {};
|
|
493
503
|
for (const item of items)
|
|
494
504
|
values[item.name] = defaultValues[item.name] ?? "";
|
|
495
505
|
return values;
|
|
496
506
|
}
|
|
497
|
-
function FormContainer({
|
|
507
|
+
function FormContainer({
|
|
508
|
+
defaultValues,
|
|
509
|
+
Elements,
|
|
510
|
+
lang,
|
|
511
|
+
...props
|
|
512
|
+
}) {
|
|
498
513
|
const states = useSplittingState({
|
|
499
514
|
values: mergeValues(props.items, defaultValues),
|
|
500
515
|
errors: {},
|
|
501
516
|
submitting: false,
|
|
502
|
-
Elements: Object.assign(FormDefaultElements,
|
|
517
|
+
Elements: Object.assign(FormDefaultElements, Elements),
|
|
518
|
+
lang: Object.assign(FormDefaultLang, lang)
|
|
503
519
|
});
|
|
504
520
|
return /* @__PURE__ */ jsxs(
|
|
505
521
|
FormContextProvider,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@faasjs/react",
|
|
3
|
-
"version": "3.7.0-beta.
|
|
3
|
+
"version": "3.7.0-beta.6",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.mjs",
|
|
@@ -34,10 +34,10 @@
|
|
|
34
34
|
"dist"
|
|
35
35
|
],
|
|
36
36
|
"peerDependencies": {
|
|
37
|
-
"@faasjs/browser": "3.7.0-beta.
|
|
37
|
+
"@faasjs/browser": "3.7.0-beta.6"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
|
-
"@faasjs/browser": "3.7.0-beta.
|
|
40
|
+
"@faasjs/browser": "3.7.0-beta.6",
|
|
41
41
|
"@types/react": "*",
|
|
42
42
|
"react": "*"
|
|
43
43
|
},
|