@bolttech/form-engine-core 0.0.1-beta.13 → 0.0.1-beta.14
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/index.esm.js +30 -43
- package/package.json +1 -1
- package/src/interfaces/schema.d.ts +2 -3
- package/src/managers/field.d.ts +2 -6
- package/src/types/schema.d.ts +6 -26
package/index.esm.js
CHANGED
|
@@ -2298,7 +2298,7 @@ class FormField {
|
|
|
2298
2298
|
dataSubject$,
|
|
2299
2299
|
mapper
|
|
2300
2300
|
}) {
|
|
2301
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
2301
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
2302
2302
|
this.fieldStateSubscription$ = new Subscription();
|
|
2303
2303
|
this.originalSchema = schemaComponent;
|
|
2304
2304
|
this.config = {
|
|
@@ -2311,14 +2311,14 @@ class FormField {
|
|
|
2311
2311
|
this.path = path;
|
|
2312
2312
|
this.children = children;
|
|
2313
2313
|
this.validations = schemaComponent.validations;
|
|
2314
|
-
this.errorMessages = schemaComponent.
|
|
2314
|
+
this.errorMessages = (_a = schemaComponent.validations) === null || _a === void 0 ? void 0 : _a.messages;
|
|
2315
2315
|
this.visibilityConditions = schemaComponent.visibilityConditions;
|
|
2316
2316
|
this.resetValues = schemaComponent.resetValues;
|
|
2317
2317
|
this.apiSchema = schemaComponent.api;
|
|
2318
2318
|
this.formatters = schemaComponent.formatters;
|
|
2319
2319
|
this.masks = schemaComponent.masks;
|
|
2320
2320
|
if (mapper.valueChangeEvent) this.valueChangeEvent = mapper.valueChangeEvent;
|
|
2321
|
-
if ((
|
|
2321
|
+
if ((_b = mapper.events) === null || _b === void 0 ? void 0 : _b.setValue) this.valuePropName = mapper.events.setValue;
|
|
2322
2322
|
this.mapper = mapper;
|
|
2323
2323
|
this.validateVisibility = validateVisibility;
|
|
2324
2324
|
this.resetValue = resetValue;
|
|
@@ -2327,7 +2327,7 @@ class FormField {
|
|
|
2327
2327
|
this.dataSubject$ = dataSubject$;
|
|
2328
2328
|
this._props = schemaComponent.props || {};
|
|
2329
2329
|
this._value = '';
|
|
2330
|
-
this._stateValue = ((
|
|
2330
|
+
this._stateValue = ((_c = this.mapper.events) === null || _c === void 0 ? void 0 : _c.setValue) ? {
|
|
2331
2331
|
[this.mapper.events.setValue]: ''
|
|
2332
2332
|
} : {};
|
|
2333
2333
|
this._metadata = '';
|
|
@@ -2337,9 +2337,9 @@ class FormField {
|
|
|
2337
2337
|
this._visibility = true;
|
|
2338
2338
|
this._api = {
|
|
2339
2339
|
default: {
|
|
2340
|
-
response: ((
|
|
2340
|
+
response: ((_f = (_e = (_d = this.apiSchema) === null || _d === void 0 ? void 0 : _d.defaultConfig) === null || _e === void 0 ? void 0 : _e.config) === null || _f === void 0 ? void 0 : _f.fallbackValue) || ''
|
|
2341
2341
|
},
|
|
2342
|
-
named: ((
|
|
2342
|
+
named: ((_g = this.apiSchema) === null || _g === void 0 ? void 0 : _g.configs) && Object.keys((_h = this.apiSchema) === null || _h === void 0 ? void 0 : _h.configs).reduce((acc, curr) => {
|
|
2343
2343
|
var _a, _b;
|
|
2344
2344
|
acc[curr] = {
|
|
2345
2345
|
response: ((_b = (_a = this.apiSchema) === null || _a === void 0 ? void 0 : _a.configs) === null || _b === void 0 ? void 0 : _b[curr].config.fallbackValue) || ''
|
|
@@ -2392,6 +2392,9 @@ class FormField {
|
|
|
2392
2392
|
});
|
|
2393
2393
|
if (!isNil(this.initialValue)) {
|
|
2394
2394
|
this.value = this.initialValue;
|
|
2395
|
+
this.setFieldValidity({
|
|
2396
|
+
event: 'ON_FORM_SUBMIT'
|
|
2397
|
+
});
|
|
2395
2398
|
}
|
|
2396
2399
|
}
|
|
2397
2400
|
/**
|
|
@@ -2529,7 +2532,7 @@ class FormField {
|
|
|
2529
2532
|
this.errorsList = Object.values(this.errors);
|
|
2530
2533
|
this.errorsString = this.errorsList.join(', ');
|
|
2531
2534
|
/**
|
|
2532
|
-
* if any error
|
|
2535
|
+
* if any error receives a list of errors, set a prop for it, currently only supporting a single string
|
|
2533
2536
|
*/
|
|
2534
2537
|
((_a = this.mapper.events) === null || _a === void 0 ? void 0 : _a.setErrorMessage) && this.errorSubject$.next({
|
|
2535
2538
|
[this.mapper.events.setErrorMessage]: this.errorsString
|
|
@@ -2637,55 +2640,41 @@ class FormField {
|
|
|
2637
2640
|
setFieldValidity({
|
|
2638
2641
|
event
|
|
2639
2642
|
}) {
|
|
2640
|
-
var _a;
|
|
2643
|
+
var _a, _b;
|
|
2641
2644
|
if (!this.validations || !this.visibility) {
|
|
2642
2645
|
this.errors = {};
|
|
2643
2646
|
this._valid = true;
|
|
2644
2647
|
return;
|
|
2645
2648
|
}
|
|
2646
|
-
/*
|
|
2647
|
-
@TODO evaluate if _valid flag needs to be updated on all events, this condition saves resources,
|
|
2648
|
-
currently form submition needs to be controlled with form instance submit property function that
|
|
2649
|
-
will evaluate if all fields are valid regardless the events that triggers error messages
|
|
2650
|
-
*/
|
|
2651
|
-
if (!this.validations.events.includes(event) && event !== 'ON_FORM_SUBMIT') return;
|
|
2652
2649
|
let valid = true;
|
|
2653
|
-
const errors =
|
|
2654
|
-
const schemaValidations = (_a = this.validations) === null || _a === void 0 ? void 0 : _a.
|
|
2650
|
+
const errors = {};
|
|
2651
|
+
const schemaValidations = (_a = this.validations) === null || _a === void 0 ? void 0 : _a.methods;
|
|
2655
2652
|
schemaValidations && Object.keys(schemaValidations).forEach(validationKey => {
|
|
2656
|
-
var _a;
|
|
2657
2653
|
const error = validations[validationKey](this.value, schemaValidations);
|
|
2658
2654
|
// setting valid flag
|
|
2659
2655
|
valid = !error && valid;
|
|
2660
2656
|
// setting error messages
|
|
2661
|
-
if (
|
|
2662
|
-
if (
|
|
2663
|
-
|
|
2664
|
-
|
|
2665
|
-
|
|
2666
|
-
|
|
2667
|
-
errors[validationKey] = this.errorMessages.default;
|
|
2668
|
-
}
|
|
2669
|
-
} else {
|
|
2670
|
-
delete errors[validationKey];
|
|
2657
|
+
if (error && this.errorMessages) {
|
|
2658
|
+
if (validationKey in this.errorMessages) {
|
|
2659
|
+
const messages = this.errorMessages;
|
|
2660
|
+
errors[validationKey] = messages[validationKey];
|
|
2661
|
+
} else if ('default' in this.errorMessages) {
|
|
2662
|
+
errors[validationKey] = this.errorMessages.default;
|
|
2671
2663
|
}
|
|
2664
|
+
} else {
|
|
2665
|
+
delete errors[validationKey];
|
|
2672
2666
|
}
|
|
2673
2667
|
});
|
|
2674
2668
|
this._valid = valid;
|
|
2675
|
-
this.
|
|
2676
|
-
|
|
2677
|
-
|
|
2678
|
-
|
|
2679
|
-
|
|
2680
|
-
|
|
2681
|
-
|
|
2682
|
-
|
|
2683
|
-
|
|
2684
|
-
schemaValidations && Object.keys(schemaValidations).forEach(validationKey => {
|
|
2685
|
-
const error = validations[validationKey](this.value, schemaValidations);
|
|
2686
|
-
valid = !error && valid;
|
|
2687
|
-
});
|
|
2688
|
-
this._valid = valid;
|
|
2669
|
+
if (this.validations.availableMessagesByEvent[event]) {
|
|
2670
|
+
const erros2 = {};
|
|
2671
|
+
(_b = this.validations.availableMessagesByEvent[event]) === null || _b === void 0 ? void 0 : _b.forEach(method => {
|
|
2672
|
+
if (method in errors) {
|
|
2673
|
+
erros2[method] = errors[method];
|
|
2674
|
+
}
|
|
2675
|
+
});
|
|
2676
|
+
this.errors = erros2;
|
|
2677
|
+
}
|
|
2689
2678
|
}
|
|
2690
2679
|
/**
|
|
2691
2680
|
* Formats the field value using the specified formatters, if available.
|
|
@@ -2956,7 +2945,6 @@ class FormCore {
|
|
|
2956
2945
|
validations,
|
|
2957
2946
|
visibilityConditions,
|
|
2958
2947
|
resetValues,
|
|
2959
|
-
errorMessages,
|
|
2960
2948
|
api
|
|
2961
2949
|
}
|
|
2962
2950
|
}, key) => {
|
|
@@ -2967,7 +2955,6 @@ class FormCore {
|
|
|
2967
2955
|
validations,
|
|
2968
2956
|
visibilityConditions,
|
|
2969
2957
|
resetValues,
|
|
2970
|
-
errorMessages,
|
|
2971
2958
|
apiSchema: api
|
|
2972
2959
|
};
|
|
2973
2960
|
traverseObject(template, key).forEach(element => this.subscribedTemplates.push(element));
|
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TMapper } from '../types/mapper';
|
|
2
|
-
import { TApiEvent,
|
|
2
|
+
import { TApiEvent, TFormatters, TMasks, TProps, TResetValueMethods, TSchemaFormConfig, TValidations, TVisibility } from '../types/schema';
|
|
3
3
|
/**
|
|
4
4
|
* @interface IComponentSchema
|
|
5
5
|
* Represents the schema for a component within a form.
|
|
@@ -40,11 +40,10 @@ interface IComponentSchema {
|
|
|
40
40
|
props?: TProps;
|
|
41
41
|
name: string;
|
|
42
42
|
nameToSubmit?: string;
|
|
43
|
-
validations?:
|
|
43
|
+
validations?: TValidations;
|
|
44
44
|
api?: TApiEvent;
|
|
45
45
|
visibilityConditions?: TVisibility[];
|
|
46
46
|
resetValues?: TResetValueMethods[];
|
|
47
|
-
errorMessages?: TErrorMessages;
|
|
48
47
|
formatters?: TFormatters;
|
|
49
48
|
masks?: TMasks;
|
|
50
49
|
children?: IComponentSchema[];
|
package/src/managers/field.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Observable, Subject, Subscription } from 'rxjs';
|
|
2
|
-
import { TApiConfig, TApiEvent, TApiResponse, TErrorMessages,
|
|
2
|
+
import { TApiConfig, TApiEvent, TApiResponse, TErrorMessages, TFormatters, TMasks, TResetValueMethods, TSchemaFormConfig, TValidations, TVisibility } from '../types/schema';
|
|
3
3
|
import { IComponentSchema, IComponentSchemaAsFormField } from '../interfaces/schema';
|
|
4
4
|
import { IState } from '../interfaces/state';
|
|
5
5
|
import { TEvents, TFieldEvent, TMutationEvents, TValueChangeEvent } from '../types/event';
|
|
@@ -15,7 +15,7 @@ declare class FormField {
|
|
|
15
15
|
path?: string;
|
|
16
16
|
children?: string[];
|
|
17
17
|
originalSchema: IComponentSchemaAsFormField<unknown>;
|
|
18
|
-
validations?:
|
|
18
|
+
validations?: TValidations;
|
|
19
19
|
visibilityConditions?: TVisibility[];
|
|
20
20
|
resetValues?: TResetValueMethods[];
|
|
21
21
|
errorMessages?: TErrorMessages;
|
|
@@ -221,10 +221,6 @@ declare class FormField {
|
|
|
221
221
|
setFieldValidity({ event }: {
|
|
222
222
|
event: TEvents;
|
|
223
223
|
}): void;
|
|
224
|
-
/**
|
|
225
|
-
* WIP expensive function to get updated field validity on each event
|
|
226
|
-
*/
|
|
227
|
-
updateValidityFlag(): void;
|
|
228
224
|
/**
|
|
229
225
|
* Formats the field value using the specified formatters, if available.
|
|
230
226
|
*
|
package/src/types/schema.d.ts
CHANGED
|
@@ -666,31 +666,11 @@ type TProps = Record<string, unknown>;
|
|
|
666
666
|
* };
|
|
667
667
|
* ```
|
|
668
668
|
*/
|
|
669
|
-
type TValidations =
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
* @example
|
|
675
|
-
* ```typescript
|
|
676
|
-
* const visibilityConditions: TVisibilityConditions = {
|
|
677
|
-
* ON_FIELD_BLUR: [{ validations: { required: true }, fields: ['fieldName'] }]
|
|
678
|
-
* };
|
|
679
|
-
* ```
|
|
680
|
-
*/
|
|
681
|
-
type TVisibilityConditions = Partial<Record<TEvents, TVisibility[]>>;
|
|
682
|
-
/**
|
|
683
|
-
* @type TResetValues
|
|
684
|
-
* Represents the reset value methods for different events.
|
|
685
|
-
*
|
|
686
|
-
* @example
|
|
687
|
-
* ```typescript
|
|
688
|
-
* const resetValues: TResetValues = {
|
|
689
|
-
* ON_FIELD_BLUR: [{ validations: { required: true }, fields: ['fieldName'], resettledValue: [''] }]
|
|
690
|
-
* };
|
|
691
|
-
* ```
|
|
692
|
-
*/
|
|
693
|
-
type TResetValues = Partial<Record<TEvents, TResetValueMethods[]>>;
|
|
669
|
+
type TValidations = {
|
|
670
|
+
methods: TValidationMethods;
|
|
671
|
+
availableMessagesByEvent: Partial<Record<TEvents, string[]>>;
|
|
672
|
+
messages: TErrorMessages;
|
|
673
|
+
};
|
|
694
674
|
/**
|
|
695
675
|
* @type TErrorMessages
|
|
696
676
|
* Represents the error messages for different validation methods.
|
|
@@ -750,4 +730,4 @@ type TSchemaFormConfig = {
|
|
|
750
730
|
defaultAPIdebounceTimeMS?: number;
|
|
751
731
|
defaultStateRefreshTimeMS?: number;
|
|
752
732
|
};
|
|
753
|
-
export { TApiConfig, TErrorMessages,
|
|
733
|
+
export { TApiConfig, TErrorMessages, TValidations, TMasks, TProps, TResetValueMethods, TFormatters, TValidationMethods, TEvent, TVisibility, TApiEvent, TApiResponse, TSchemaFormConfig, TLengthValidation, TCreditCardMatch, TDocumentValidation, TCallbackValidation, TBetweenValidation, TMaskGeneric, TSplitterFormatterValue, TCurrencyMask, TDateOperatorsValidation, TConditionsValidationSet, TConditionsValidation, TMultipleValidation, TAvailableValidations, TDateValidation, TBetweenDatesValidation, TDateFormatsValidation, TDateInterval, };
|