@tsed/react-formio 1.12.0 → 1.13.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/components/form/form.component.d.ts +2 -0
- package/dist/components/form/form.stories.d.ts +37 -0
- package/dist/components/form/useForm.hook.d.ts +1 -0
- package/dist/index.js +51 -4
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +25 -2
- package/dist/index.modern.js.map +1 -1
- package/package.json +4 -4
- package/readme.md +51 -18
- package/src/components/form/form.component.tsx +3 -1
- package/src/components/form/form.stories.tsx +66 -2
- package/src/components/form/useForm.hook.ts +25 -1
|
@@ -38,6 +38,7 @@ export declare namespace Form {
|
|
|
38
38
|
i18n: PropTypes.Requireable<any>;
|
|
39
39
|
template: PropTypes.Requireable<string>;
|
|
40
40
|
saveDraft: PropTypes.Requireable<boolean>;
|
|
41
|
+
hooks: PropTypes.Requireable<any>;
|
|
41
42
|
}>>;
|
|
42
43
|
onPrevPage: PropTypes.Requireable<(...args: any[]) => any>;
|
|
43
44
|
onNextPage: PropTypes.Requireable<(...args: any[]) => any>;
|
|
@@ -46,6 +47,7 @@ export declare namespace Form {
|
|
|
46
47
|
onCustomEvent: PropTypes.Requireable<(...args: any[]) => any>;
|
|
47
48
|
onComponentChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
48
49
|
onSubmit: PropTypes.Requireable<(...args: any[]) => any>;
|
|
50
|
+
onAsyncSubmit: PropTypes.Requireable<(...args: any[]) => any>;
|
|
49
51
|
onSubmitDone: PropTypes.Requireable<(...args: any[]) => any>;
|
|
50
52
|
onFormLoad: PropTypes.Requireable<(...args: any[]) => any>;
|
|
51
53
|
onError: PropTypes.Requireable<(...args: any[]) => any>;
|
|
@@ -2807,3 +2807,40 @@ export declare const Sandbox: {
|
|
|
2807
2807
|
};
|
|
2808
2808
|
};
|
|
2809
2809
|
};
|
|
2810
|
+
export declare const TriggerError: {
|
|
2811
|
+
(args: any): JSX.Element;
|
|
2812
|
+
args: {
|
|
2813
|
+
form: {
|
|
2814
|
+
type: string;
|
|
2815
|
+
display: string;
|
|
2816
|
+
tags: any[];
|
|
2817
|
+
components: ({
|
|
2818
|
+
label: string;
|
|
2819
|
+
widget: {
|
|
2820
|
+
type: string;
|
|
2821
|
+
};
|
|
2822
|
+
errorLabel: string;
|
|
2823
|
+
key: string;
|
|
2824
|
+
inputType: string;
|
|
2825
|
+
type: string;
|
|
2826
|
+
id: string;
|
|
2827
|
+
defaultValue: string;
|
|
2828
|
+
showValidations?: undefined;
|
|
2829
|
+
tableView?: undefined;
|
|
2830
|
+
input?: undefined;
|
|
2831
|
+
} | {
|
|
2832
|
+
label: string;
|
|
2833
|
+
showValidations: boolean;
|
|
2834
|
+
tableView: boolean;
|
|
2835
|
+
key: string;
|
|
2836
|
+
type: string;
|
|
2837
|
+
input: boolean;
|
|
2838
|
+
widget?: undefined;
|
|
2839
|
+
errorLabel?: undefined;
|
|
2840
|
+
inputType?: undefined;
|
|
2841
|
+
id?: undefined;
|
|
2842
|
+
defaultValue?: undefined;
|
|
2843
|
+
})[];
|
|
2844
|
+
};
|
|
2845
|
+
};
|
|
2846
|
+
};
|
|
@@ -39,6 +39,7 @@ export interface UseFormHookProps<Data = any> extends Record<string, any> {
|
|
|
39
39
|
}) => void;
|
|
40
40
|
onComponentChange?: (component: ExtendedComponentSchema) => void;
|
|
41
41
|
onSubmit?: (submission: Submission<Data>) => void;
|
|
42
|
+
onAsyncSubmit?: (submission: Submission<Data>) => Promise<void>;
|
|
42
43
|
onSubmitDone?: (submission: Submission<Data>) => void;
|
|
43
44
|
onFormLoad?: Function;
|
|
44
45
|
onError?: (errors: any) => void;
|
package/dist/index.js
CHANGED
|
@@ -2481,7 +2481,43 @@ function Card(_ref) {
|
|
|
2481
2481
|
}, children));
|
|
2482
2482
|
}
|
|
2483
2483
|
|
|
2484
|
+
function _catch$a(body, recover) {
|
|
2485
|
+
try {
|
|
2486
|
+
var result = body();
|
|
2487
|
+
} catch (e) {
|
|
2488
|
+
return recover(e);
|
|
2489
|
+
}
|
|
2490
|
+
|
|
2491
|
+
if (result && result.then) {
|
|
2492
|
+
return result.then(void 0, recover);
|
|
2493
|
+
}
|
|
2494
|
+
|
|
2495
|
+
return result;
|
|
2496
|
+
}
|
|
2497
|
+
|
|
2484
2498
|
function useForm(props) {
|
|
2499
|
+
var customValidation = function customValidation(submission, callback) {
|
|
2500
|
+
try {
|
|
2501
|
+
var _temp3 = function () {
|
|
2502
|
+
if (events.current.has("onAsyncSubmit")) {
|
|
2503
|
+
var _temp4 = _catch$a(function () {
|
|
2504
|
+
return Promise.resolve(events.current.get("onAsyncSubmit")(submission)).then(function () {});
|
|
2505
|
+
}, function (err) {
|
|
2506
|
+
callback((err == null ? void 0 : err.errors) || err);
|
|
2507
|
+
});
|
|
2508
|
+
|
|
2509
|
+
if (_temp4 && _temp4.then) return _temp4.then(function () {});
|
|
2510
|
+
} else {
|
|
2511
|
+
callback(null);
|
|
2512
|
+
}
|
|
2513
|
+
}();
|
|
2514
|
+
|
|
2515
|
+
return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(function () {}) : void 0);
|
|
2516
|
+
} catch (e) {
|
|
2517
|
+
return Promise.reject(e);
|
|
2518
|
+
}
|
|
2519
|
+
};
|
|
2520
|
+
|
|
2485
2521
|
var src = props.src,
|
|
2486
2522
|
form = props.form,
|
|
2487
2523
|
_props$options = props.options,
|
|
@@ -2500,7 +2536,12 @@ function useForm(props) {
|
|
|
2500
2536
|
srcOrForm = typeof srcOrForm === "string" ? srcOrForm : cloneDeep__default['default'](srcOrForm);
|
|
2501
2537
|
|
|
2502
2538
|
if (!instance.current) {
|
|
2539
|
+
var _options, _options$hooks;
|
|
2540
|
+
|
|
2503
2541
|
isLoaded.current = false;
|
|
2542
|
+
options.hooks = _extends({}, options.hooks || {}, {
|
|
2543
|
+
customValidation: ((_options = options) == null ? void 0 : (_options$hooks = _options.hooks) == null ? void 0 : _options$hooks.customValidation) || customValidation
|
|
2544
|
+
});
|
|
2504
2545
|
instance.current = new formiojs.Form(element.current, srcOrForm, options);
|
|
2505
2546
|
instance.current.onAny(function (event) {
|
|
2506
2547
|
var args = [].slice.call(arguments, 1);
|
|
@@ -2525,7 +2566,8 @@ function useForm(props) {
|
|
|
2525
2566
|
events.current.set(funcName, fn);
|
|
2526
2567
|
}
|
|
2527
2568
|
|
|
2528
|
-
|
|
2569
|
+
instance.current.instance.setAlert("success", "");
|
|
2570
|
+
events.current.get(funcName).apply(void 0, args.concat([instance.current]));
|
|
2529
2571
|
}
|
|
2530
2572
|
}
|
|
2531
2573
|
});
|
|
@@ -2584,6 +2626,9 @@ function useForm(props) {
|
|
|
2584
2626
|
React.useEffect(function () {
|
|
2585
2627
|
props.onSubmit && events.current.set("onSubmit", props.onSubmit);
|
|
2586
2628
|
}, [props.onSubmit, events]);
|
|
2629
|
+
React.useEffect(function () {
|
|
2630
|
+
props.onAsyncSubmit && events.current.set("onAsyncSubmit", props.onAsyncSubmit);
|
|
2631
|
+
}, [props.onAsyncSubmit, events]);
|
|
2587
2632
|
React.useEffect(function () {
|
|
2588
2633
|
props.onSubmitDone && events.current.set("onSubmitDone", props.onSubmitDone);
|
|
2589
2634
|
}, [props.onSubmitDone, events]);
|
|
@@ -2635,7 +2680,8 @@ Form.propTypes = {
|
|
|
2635
2680
|
noAlerts: PropTypes__default['default'].bool,
|
|
2636
2681
|
i18n: PropTypes__default['default'].any,
|
|
2637
2682
|
template: PropTypes__default['default'].string,
|
|
2638
|
-
saveDraft: PropTypes__default['default'].bool
|
|
2683
|
+
saveDraft: PropTypes__default['default'].bool,
|
|
2684
|
+
hooks: PropTypes__default['default'].any
|
|
2639
2685
|
}),
|
|
2640
2686
|
onPrevPage: PropTypes__default['default'].func,
|
|
2641
2687
|
onNextPage: PropTypes__default['default'].func,
|
|
@@ -2644,6 +2690,7 @@ Form.propTypes = {
|
|
|
2644
2690
|
onCustomEvent: PropTypes__default['default'].func,
|
|
2645
2691
|
onComponentChange: PropTypes__default['default'].func,
|
|
2646
2692
|
onSubmit: PropTypes__default['default'].func,
|
|
2693
|
+
onAsyncSubmit: PropTypes__default['default'].func,
|
|
2647
2694
|
onSubmitDone: PropTypes__default['default'].func,
|
|
2648
2695
|
onFormLoad: PropTypes__default['default'].func,
|
|
2649
2696
|
onError: PropTypes__default['default'].func,
|
|
@@ -3066,7 +3113,7 @@ function FormAction(_ref2) {
|
|
|
3066
3113
|
}), children);
|
|
3067
3114
|
}
|
|
3068
3115
|
|
|
3069
|
-
function _catch$
|
|
3116
|
+
function _catch$b(body, recover) {
|
|
3070
3117
|
try {
|
|
3071
3118
|
var result = body();
|
|
3072
3119
|
} catch (e) {
|
|
@@ -3094,7 +3141,7 @@ var createBuilder = function createBuilder(el, _ref2) {
|
|
|
3094
3141
|
display: display,
|
|
3095
3142
|
components: [].concat(components)
|
|
3096
3143
|
};
|
|
3097
|
-
return Promise.resolve(_catch$
|
|
3144
|
+
return Promise.resolve(_catch$b(function () {
|
|
3098
3145
|
return Promise.resolve(new FormioFormBuilder__default['default'](el, form, _extends({}, options)).ready).then(function (builder) {
|
|
3099
3146
|
var handleEvent = function handleEvent(event) {
|
|
3100
3147
|
return function () {
|