@bolttech/form-engine-core 1.0.2-beta.2 → 1.0.3
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.d.ts +2327 -0
- package/index.esm.js +154 -82
- package/package.json +9 -10
- package/index.esm.d.ts +0 -1
- package/src/constants/constants.d.ts +0 -10
- package/src/formatters/creditCard.d.ts +0 -23
- package/src/formatters/custom.d.ts +0 -29
- package/src/formatters/handler.d.ts +0 -2
- package/src/formatters/regex.d.ts +0 -47
- package/src/formatters/splitter.d.ts +0 -17
- package/src/formatters/string.d.ts +0 -88
- package/src/helpers/SafeSubject.d.ts +0 -11
- package/src/helpers/creditCard.d.ts +0 -95
- package/src/helpers/helpers.d.ts +0 -67
- package/src/helpers/validation.d.ts +0 -27
- package/src/index.d.ts +0 -10
- package/src/interfaces/schema.d.ts +0 -112
- package/src/interfaces/state.d.ts +0 -22
- package/src/managers/field.d.ts +0 -326
- package/src/managers/form.d.ts +0 -346
- package/src/managers/formGroup.d.ts +0 -110
- package/src/managers/index.d.ts +0 -3
- package/src/masks/creditCard.d.ts +0 -60
- package/src/masks/generic.d.ts +0 -39
- package/src/masks/handler.d.ts +0 -2
- package/src/masks/string.d.ts +0 -99
- package/src/types/event.d.ts +0 -109
- package/src/types/form.d.ts +0 -55
- package/src/types/mapper.d.ts +0 -95
- package/src/types/schema.d.ts +0 -835
- package/src/types/template.d.ts +0 -50
- package/src/types/utility.d.ts +0 -6
- package/src/validations/creditCard.d.ts +0 -52
- package/src/validations/custom.d.ts +0 -25
- package/src/validations/date.d.ts +0 -79
- package/src/validations/document.d.ts +0 -25
- package/src/validations/handler.d.ts +0 -2
- package/src/validations/length.d.ts +0 -39
- package/src/validations/list.d.ts +0 -32
- package/src/validations/logical.d.ts +0 -75
- package/src/validations/multiple.d.ts +0 -31
- package/src/validations/namedRule.d.ts +0 -22
- package/src/validations/number.d.ts +0 -145
- package/src/validations/object.d.ts +0 -44
- package/src/validations/regex.d.ts +0 -217
- package/src/validations/string.d.ts +0 -53
package/index.d.ts
ADDED
|
@@ -0,0 +1,2327 @@
|
|
|
1
|
+
import * as rxjs from 'rxjs';
|
|
2
|
+
import { Subject, Subscription } from 'rxjs';
|
|
3
|
+
import { TCurrencyLocalCode, TCurrencyCode } from '@gaignoux/currency';
|
|
4
|
+
import { OutgoingHttpHeaders } from 'http2';
|
|
5
|
+
|
|
6
|
+
type AllowOnly<T, K extends keyof T> = Pick<T, K> & {
|
|
7
|
+
[P in keyof Omit<T, K>]?: never;
|
|
8
|
+
};
|
|
9
|
+
type OneOf<T, K = keyof T> = K extends keyof T ? AllowOnly<T, K> : never;
|
|
10
|
+
type TValidationHandler = Record<string, (value: unknown, validations: TValidationMethods) => boolean>;
|
|
11
|
+
|
|
12
|
+
type TComponentPropsMappingSubset = keyof (Pick<TEventPropsEnum, 'onBlur' | 'onChange' | 'onFocus' | 'onKeyDown' | 'onKeyUp' | 'onClick'> & Pick<TEventDataPropsEnum, 'onSubmit'>);
|
|
13
|
+
/**
|
|
14
|
+
* @type TComponentPropsMapping
|
|
15
|
+
* Represents the mapping of component properties for various events and actions.
|
|
16
|
+
* @property {string} [getValue] - component function name to get the value.
|
|
17
|
+
* @property {string} [setValue] - component function name to set the value.
|
|
18
|
+
* @property {string} [setErrorMessage] - component function name to set the error message.
|
|
19
|
+
* @property {string} [setErrorState] - component function name to set the error state.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```typescript
|
|
23
|
+
* const componentProps: TComponentPropsMapping = {
|
|
24
|
+
* getValue: 'getValueFunction',
|
|
25
|
+
* setValue: 'setValueFunction',
|
|
26
|
+
* onBlur: 'handleBlur',
|
|
27
|
+
* onClick: 'handleClick',
|
|
28
|
+
* onFocus: 'handleFocus',
|
|
29
|
+
* onKeyUp: 'handleKeyUp',
|
|
30
|
+
* onKeyDown: 'handleKeyDown',
|
|
31
|
+
* setErrorMessage: 'setErrorMessageFunction',
|
|
32
|
+
* setErrorState: 'setErrorStateFunction'
|
|
33
|
+
* };
|
|
34
|
+
* ```
|
|
35
|
+
* @interface
|
|
36
|
+
*/
|
|
37
|
+
type TComponentPropsMapping = Partial<Record<TComponentPropsMappingSubset, string>> & {
|
|
38
|
+
getValue?: string;
|
|
39
|
+
setValue?: string;
|
|
40
|
+
setErrorMessage?: string;
|
|
41
|
+
setErrorState?: string;
|
|
42
|
+
};
|
|
43
|
+
/**
|
|
44
|
+
* @type TMapper
|
|
45
|
+
* Represents the mapping of a component, including the component type,
|
|
46
|
+
* name, events, and an optional function to handle value changes.
|
|
47
|
+
*
|
|
48
|
+
* @property {ElementType} component - The component that will represent the input.
|
|
49
|
+
* * @property {ElementType} asynccomponent - The component that will represent the input but dynamically imported (suspense/lazy).
|
|
50
|
+
* @property {string} componentName - The name of the component.
|
|
51
|
+
* @property {TComponentPropsMapping} [events] - Mapping event properties for the component.
|
|
52
|
+
* @property {TValueChangeEvent} [valueChangeEvent] - Optional function to handle value changes.
|
|
53
|
+
*
|
|
54
|
+
* @example
|
|
55
|
+
* ```typescript
|
|
56
|
+
* const mappers: TMapper<ElementType>[] = [
|
|
57
|
+
* {
|
|
58
|
+
* component: InputElement,
|
|
59
|
+
* componentName: 'input',
|
|
60
|
+
* events: {
|
|
61
|
+
* getValue: 'onChange2',
|
|
62
|
+
* onBlur: 'onBlur2',
|
|
63
|
+
* onFocus: 'onFocus2',
|
|
64
|
+
* }
|
|
65
|
+
* },
|
|
66
|
+
* {
|
|
67
|
+
* component: Container,
|
|
68
|
+
* componentName: 'row',
|
|
69
|
+
* },
|
|
70
|
+
* {
|
|
71
|
+
* component: Dropdown,
|
|
72
|
+
* componentName: 'dropdown',
|
|
73
|
+
* valueChangeEvent: (event: {
|
|
74
|
+
* id: string;
|
|
75
|
+
* label: string;
|
|
76
|
+
* value: string;
|
|
77
|
+
* }) => ({ _value: event.value, _stateValue: event.id }),
|
|
78
|
+
* },
|
|
79
|
+
* {
|
|
80
|
+
* component: DatePicker,
|
|
81
|
+
* componentName: 'datepicker',
|
|
82
|
+
* valueChangeEvent: (event: string) => event,
|
|
83
|
+
* },
|
|
84
|
+
* ];
|
|
85
|
+
* ```
|
|
86
|
+
* @interface
|
|
87
|
+
*/
|
|
88
|
+
type TMapper<T> = {
|
|
89
|
+
componentName: string;
|
|
90
|
+
events?: TComponentPropsMapping;
|
|
91
|
+
valueChangeEvent?: TValueChangeEvent;
|
|
92
|
+
} & OneOf<{
|
|
93
|
+
component: T;
|
|
94
|
+
asynccomponent: T;
|
|
95
|
+
}>;
|
|
96
|
+
|
|
97
|
+
/**
|
|
98
|
+
* @interface IComponentSchema
|
|
99
|
+
* Represents the schema for a component within a form.
|
|
100
|
+
*
|
|
101
|
+
* @property {string} component - The type of component (e.g., 'input', 'button').
|
|
102
|
+
* @property {TProps} props - The properties of the component.
|
|
103
|
+
* @property {string} name - The name of the component.
|
|
104
|
+
* @property {string} nameToSubmit - The name of the field when submit values (optional).
|
|
105
|
+
* @property {TValidations} [validations] - The validation methods for the component.
|
|
106
|
+
* @property {TVisibility[]} [visibilityConditions] - The visibility conditions for the component.
|
|
107
|
+
* @property {TResetValueMethods[]} [resetValues] - The reset value methods for the component.
|
|
108
|
+
* @property {TApiEvent} [api] - The API configuration for the component.
|
|
109
|
+
* @property {TFormatters} [formatters] - The formatters for the component.
|
|
110
|
+
* @property {TMasks} [masks] - The masks for the component.
|
|
111
|
+
* @property {IComponentSchema[]} [children] - The child components.
|
|
112
|
+
* @property {boolean} visibility - visibility status the component will mount (to avoid SSR blinking)
|
|
113
|
+
* @property {boolean} persistValue - check this if you want the last visible value to be restored after a visiblity schema rule applied
|
|
114
|
+
*
|
|
115
|
+
* @example
|
|
116
|
+
* ```typescript
|
|
117
|
+
* const schema: IComponentSchema = {
|
|
118
|
+
* component: 'input',
|
|
119
|
+
* props: { type: 'text', placeholder: 'Enter your name' },
|
|
120
|
+
* name: 'name',
|
|
121
|
+
* nameToSubmit: 'applicant.firstName',
|
|
122
|
+
* validations: {
|
|
123
|
+
* methods: {
|
|
124
|
+
* required: true,
|
|
125
|
+
* regex: '^([0-9]+)*$',
|
|
126
|
+
* max: 5,
|
|
127
|
+
* },
|
|
128
|
+
* eventMessages: {
|
|
129
|
+
* ON_FIELD_MOUNT: ['required'],
|
|
130
|
+
* ON_FIELD_CHANGE: ['regex', 'required'],
|
|
131
|
+
* ON_FIELD_BLUR: ['max', 'required'],
|
|
132
|
+
* },
|
|
133
|
+
* messages: {
|
|
134
|
+
* default: 'This field is required',
|
|
135
|
+
* regex: 'Only numbers are available.',
|
|
136
|
+
* max: 'Max of 5',
|
|
137
|
+
* },
|
|
138
|
+
* },
|
|
139
|
+
* visibilityConditions: [{ conditions: { field: 'age', value: 18 } }],
|
|
140
|
+
* resetValues: [{ field: 'age', resetTo: '' }],
|
|
141
|
+
* api: {
|
|
142
|
+
* defaultConfig: {
|
|
143
|
+
* config: { method: 'POST', url: 'https://api.example.com/submit' },
|
|
144
|
+
* events: [{ eventName: 'ON_FIELD_BLUR' }]
|
|
145
|
+
* }
|
|
146
|
+
* },
|
|
147
|
+
* formatters: { capitalize: true },
|
|
148
|
+
* masks: { currency: { align: 'left', decimal: '.', precision: 2, prefix: '$', thousands: ',' } },
|
|
149
|
+
* children: [],
|
|
150
|
+
* visibility: true,
|
|
151
|
+
* persistValue: true,
|
|
152
|
+
* };
|
|
153
|
+
* ```
|
|
154
|
+
*/
|
|
155
|
+
interface IComponentSchema {
|
|
156
|
+
/** The type of component (e.g., 'input', 'button'). */
|
|
157
|
+
component: string;
|
|
158
|
+
/** The properties of the component. */
|
|
159
|
+
props?: TProps;
|
|
160
|
+
/** The name of the component. */
|
|
161
|
+
name: string;
|
|
162
|
+
/** The name of the field when submit values. */
|
|
163
|
+
nameToSubmit?: string;
|
|
164
|
+
/** The validation methods for the component. */
|
|
165
|
+
validations?: TValidations;
|
|
166
|
+
/** The API configuration for the component. */
|
|
167
|
+
api?: TApiEvent;
|
|
168
|
+
/** The visibility conditions for the component. */
|
|
169
|
+
visibilityConditions?: TVisibility[];
|
|
170
|
+
/** The reset value methods for the component. */
|
|
171
|
+
resetValues?: TResetValueMethods[];
|
|
172
|
+
/** The reset property values for the component. */
|
|
173
|
+
resetPropertyValues?: TResetPathMethods[];
|
|
174
|
+
/** The formatters for the component. */
|
|
175
|
+
formatters?: TFormatters;
|
|
176
|
+
/** The masks for the component. */
|
|
177
|
+
masks?: TMasks;
|
|
178
|
+
/** The child components. */
|
|
179
|
+
children?: IComponentSchema[];
|
|
180
|
+
/** Visibility status the component will mount (to avoid SSR blinking) */
|
|
181
|
+
visibility?: boolean;
|
|
182
|
+
/** Check this if you want the last visible value to be restored after a visiblity schema rule applied */
|
|
183
|
+
persistValue?: boolean;
|
|
184
|
+
}
|
|
185
|
+
interface IComponentSchemaAsFormField<T> extends IComponentSchema {
|
|
186
|
+
mapper?: TMapper<T>;
|
|
187
|
+
children?: IComponentSchemaAsFormField<T>[];
|
|
188
|
+
}
|
|
189
|
+
/**
|
|
190
|
+
* @interface IFormSchema
|
|
191
|
+
* Represents the schema for a form.
|
|
192
|
+
*
|
|
193
|
+
* @property {string} index - The unique index or identifier for the form.
|
|
194
|
+
* @property {string} [action] - The URL to which the form data will be submitted. (experimental)
|
|
195
|
+
* @property {string} [method] - The HTTP method used to submit the form (e.g., 'POST', 'GET') (experimental).
|
|
196
|
+
* @property {Record<string, unknown>} [initialValues] - The initial values for the form fields.
|
|
197
|
+
* @property {Record<string, unknown>} [iVars] - Dynamic key value pairs that change from any external source
|
|
198
|
+
* @property {IComponentSchema[]} [components] - The list of components included in the form.
|
|
199
|
+
* @property {boolean} [stopEventsOnSubmit] - stop all the events declared as callback on useForm/Form once form is submitted
|
|
200
|
+
* @property {TSchemaFormConfig} [config] - form configurations to change event debouncers and debugging tools
|
|
201
|
+
*
|
|
202
|
+
* @example
|
|
203
|
+
* ```typescript
|
|
204
|
+
* const formSchema: IFormSchema = {
|
|
205
|
+
* index: 'userForm',
|
|
206
|
+
* initialValues: { name: '', email: '' },
|
|
207
|
+
* iVars: iVarsState,
|
|
208
|
+
* config: {
|
|
209
|
+
* defaultLogVerbose: true
|
|
210
|
+
* },
|
|
211
|
+
* components: [
|
|
212
|
+
* { component: 'input', name: 'name', props: { placeholder: 'Enter your name' } },
|
|
213
|
+
* { component: 'input', name: 'email', props: { placeholder: 'Enter your email' } }
|
|
214
|
+
* ]
|
|
215
|
+
* };
|
|
216
|
+
* ```
|
|
217
|
+
*/
|
|
218
|
+
interface IFormSchema {
|
|
219
|
+
index: string;
|
|
220
|
+
action?: string;
|
|
221
|
+
method?: string;
|
|
222
|
+
config?: TSchemaFormConfig;
|
|
223
|
+
initialValues?: Record<string, unknown>;
|
|
224
|
+
iVars?: Record<string, unknown>;
|
|
225
|
+
components?: IComponentSchema[];
|
|
226
|
+
stopEventsOnSubmit?: boolean;
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
/**
|
|
230
|
+
* @type TFormValues<T>
|
|
231
|
+
* Represents the values and state of a form. It has a generic type that allows the importer to determine which type values key will return.
|
|
232
|
+
*
|
|
233
|
+
* @property {Generic Type} values - The current values of the form fields.
|
|
234
|
+
* @property {string[]} erroredFields - A list of field names that have errors.
|
|
235
|
+
* @property {boolean} isValid - Indicates whether the form is valid.
|
|
236
|
+
*
|
|
237
|
+
* @example
|
|
238
|
+
* ```typescript
|
|
239
|
+
* const formValues: TFormValues = {
|
|
240
|
+
* values: { name: 'John', age: 30 },
|
|
241
|
+
* erroredFields: ['email'],
|
|
242
|
+
* isValid: false
|
|
243
|
+
* };
|
|
244
|
+
* ```
|
|
245
|
+
*/
|
|
246
|
+
type TFormValues<T> = {
|
|
247
|
+
values: T;
|
|
248
|
+
metadata: unknown;
|
|
249
|
+
erroredFields: string[];
|
|
250
|
+
isValid: boolean;
|
|
251
|
+
};
|
|
252
|
+
/**
|
|
253
|
+
* @type TFormEntry
|
|
254
|
+
* Represents the entry configuration for a form.
|
|
255
|
+
*
|
|
256
|
+
* @property {IFormSchema} [schema] - The schema defining the structure and behavior of the form.
|
|
257
|
+
* @property {Record<string, unknown>} [initialValues] - The initial values for the form fields.
|
|
258
|
+
* @property {(data: TFormValues) => void} [onSubmit] - Callback function to handle form submission.
|
|
259
|
+
* @property {Subject<TFormDataPayload>} [dataSubject$] - data subject passed from formGroup instance
|
|
260
|
+
* @property {Subject<TFormValidationPayload>} [formValidSubject$] - formValid subject passed from formGroup instance
|
|
261
|
+
* @property {Subject<TFormSubmitPayload<unknown>>} [submitSubject$] - submit subject passed from formGroup instance
|
|
262
|
+
*
|
|
263
|
+
* @example
|
|
264
|
+
* ```typescript
|
|
265
|
+
* const formEntry: TFormEntry = {
|
|
266
|
+
* schema: [{ component: 'input', props: {}, name: 'name' }],
|
|
267
|
+
* initialValues: { name: 'John' },
|
|
268
|
+
* onSubmit: (data) => { console.log(data); }
|
|
269
|
+
* };
|
|
270
|
+
* ```
|
|
271
|
+
*/
|
|
272
|
+
type TFormEntry = Omit<IFormSchema, 'components'> & {
|
|
273
|
+
schema?: IFormSchema;
|
|
274
|
+
mappers?: TMapper<unknown>[];
|
|
275
|
+
dataSubject$?: Subject<TFormDataPayload>;
|
|
276
|
+
formValidSubject$?: Subject<TFormValidationPayload>;
|
|
277
|
+
submitSubject$?: Subject<TFormSubmitPayload<unknown>>;
|
|
278
|
+
};
|
|
279
|
+
|
|
280
|
+
declare const TEMPLATE_AVALIABLE_SCOPES: readonly ["fields", "iVars", "form"];
|
|
281
|
+
declare const ALLOWED_RESET_PROPS_MUTATIONS: (keyof Pick<IFormField, "api" | "apiSchema" | "props" | "validations" | "visibilityConditions" | "resetValues">)[];
|
|
282
|
+
|
|
283
|
+
/** @virtual */
|
|
284
|
+
|
|
285
|
+
type TAllowedResetPropsMutations = (typeof ALLOWED_RESET_PROPS_MUTATIONS)[number];
|
|
286
|
+
/**
|
|
287
|
+
* @type TAllowedResetPropsMutationsEnum
|
|
288
|
+
* Represents the allowed properties to be changed on resetPropertyValues.
|
|
289
|
+
*
|
|
290
|
+
* @property {never} api - api property
|
|
291
|
+
* @property {never} apiSchema - apiSchema property
|
|
292
|
+
* @property {never} props - props property
|
|
293
|
+
* @property {never} validations - validations property
|
|
294
|
+
* @property {never} visibilityConditions - visibilityConditions property
|
|
295
|
+
* @property {never} resetValues - resetValues property
|
|
296
|
+
*
|
|
297
|
+
* @interface
|
|
298
|
+
*/
|
|
299
|
+
type TAllowedResetPropsMutationsEnum = Record<TAllowedResetPropsMutations, never>;
|
|
300
|
+
/**
|
|
301
|
+
* @type TLengthValidation
|
|
302
|
+
* Represents the validation rules based on the length of the input.
|
|
303
|
+
*
|
|
304
|
+
* @property {'equal' | 'notEqual' | 'less' | 'lessOrEqual' | 'greater' | 'greaterOrEqual'} rule - The rule to apply.
|
|
305
|
+
* @property {number} target - The target value to compare against.
|
|
306
|
+
*
|
|
307
|
+
* @example
|
|
308
|
+
* ```typescript
|
|
309
|
+
* const lengthValidation: TLengthValidation = { rule: 'greaterOrEqual', target: 8 };
|
|
310
|
+
* ```
|
|
311
|
+
*/
|
|
312
|
+
type TLengthValidation = {
|
|
313
|
+
rule: 'equal' | 'notEqual' | 'less' | 'lessOrEqual' | 'greater' | 'greaterOrEqual';
|
|
314
|
+
target: number;
|
|
315
|
+
};
|
|
316
|
+
/**
|
|
317
|
+
* @type TCallbackValidation
|
|
318
|
+
* A custom validation function.
|
|
319
|
+
*
|
|
320
|
+
* @param {unknown} value - The value to validate.
|
|
321
|
+
* @returns {boolean} - The result of the validation.
|
|
322
|
+
*
|
|
323
|
+
* @example
|
|
324
|
+
* ```typescript
|
|
325
|
+
* const callbackValidation: TCallbackValidation = (value) => typeof value === 'string';
|
|
326
|
+
* ```
|
|
327
|
+
*/
|
|
328
|
+
type TCallbackValidation = (value: unknown) => boolean;
|
|
329
|
+
/**
|
|
330
|
+
* @type TBetweenValidation
|
|
331
|
+
* Represents validation rules that check if a value is between a range.
|
|
332
|
+
*
|
|
333
|
+
* @property {number} start - The start of the range.
|
|
334
|
+
* @property {number} end - The end of the range.
|
|
335
|
+
*
|
|
336
|
+
* @example
|
|
337
|
+
* ```typescript
|
|
338
|
+
* const betweenValidation: TBetweenValidation = { start: 1, end: 10 };
|
|
339
|
+
* ```
|
|
340
|
+
*/
|
|
341
|
+
type TBetweenValidation = {
|
|
342
|
+
start: number;
|
|
343
|
+
end: number;
|
|
344
|
+
};
|
|
345
|
+
/**
|
|
346
|
+
* @type TCreditCardMatch
|
|
347
|
+
* Represents the options for credit card matching.
|
|
348
|
+
*
|
|
349
|
+
* @property {string} numberCard - The credit card number.
|
|
350
|
+
* @property {string[]} availableOptions - The available options for matching.
|
|
351
|
+
*
|
|
352
|
+
* @example
|
|
353
|
+
* ```typescript
|
|
354
|
+
* const creditCardMatch: TCreditCardMatch = { numberCard: '1234', availableOptions: ['Visa', 'MasterCard'] };
|
|
355
|
+
* ```
|
|
356
|
+
*/
|
|
357
|
+
type TCreditCardMatch = {
|
|
358
|
+
numberCard: string;
|
|
359
|
+
availableOptions: string[];
|
|
360
|
+
};
|
|
361
|
+
/**
|
|
362
|
+
* @type TDocumentValidation
|
|
363
|
+
* Represents validation for specific document types.
|
|
364
|
+
*
|
|
365
|
+
* @property {'NIF' | 'NIE' | 'CIF' | 'IBAN'} type - The type of document.
|
|
366
|
+
* @property {TCurrencyLocalCode} [locale] - The locale code for validation.
|
|
367
|
+
*
|
|
368
|
+
* @example
|
|
369
|
+
* ```typescript
|
|
370
|
+
* const documentValidation: TDocumentValidation = { type: 'NIF', locale: 'ES' };
|
|
371
|
+
* ```
|
|
372
|
+
*/
|
|
373
|
+
type TDocumentValidation = {
|
|
374
|
+
type: 'NIF' | 'NIE' | 'CIF' | 'IBAN';
|
|
375
|
+
locale?: TCurrencyLocalCode;
|
|
376
|
+
};
|
|
377
|
+
/**
|
|
378
|
+
* @type TDateOperatorsValidation
|
|
379
|
+
* Represents the operators used for date validation conditions.
|
|
380
|
+
*
|
|
381
|
+
* @property {'<' | '>' | '===' | '>=' | '<=' | '!==' | '!!origin'}
|
|
382
|
+
*
|
|
383
|
+
* @example
|
|
384
|
+
* ```typescript
|
|
385
|
+
* const operator: TDateOperatorsValidation = '<';
|
|
386
|
+
* ```
|
|
387
|
+
*/
|
|
388
|
+
type TDateOperatorsValidation = '<' | '>' | '===' | '>=' | '<=' | '!==' | '!!origin';
|
|
389
|
+
/**
|
|
390
|
+
* @type TConditionsValidationSet
|
|
391
|
+
* Represents a single validation condition set.
|
|
392
|
+
*
|
|
393
|
+
* @property {boolean} [forceDefinedOrigin] - Flag to force the origin value to be defined.
|
|
394
|
+
* @property {boolean} [forceDefinedTarget] - Flag to force the target value to be defined.
|
|
395
|
+
* @property {string | number | boolean} [origin] - The origin value for the condition.
|
|
396
|
+
* @property {TDateOperatorsValidation} condition - The validation condition operator.
|
|
397
|
+
* @property {string | number | boolean} [target] - The target value for the condition.
|
|
398
|
+
*
|
|
399
|
+
* @example
|
|
400
|
+
* ```typescript
|
|
401
|
+
* const conditionSet: TConditionsValidationSet = {
|
|
402
|
+
* forceDefinedOrigin: true,
|
|
403
|
+
* forceDefinedTarget: true,
|
|
404
|
+
* origin: '2023-01-01',
|
|
405
|
+
* condition: '>',
|
|
406
|
+
* target: '2022-01-01'
|
|
407
|
+
* };
|
|
408
|
+
* ```
|
|
409
|
+
*/
|
|
410
|
+
type TConditionsValidationSet = {
|
|
411
|
+
forceDefinedOrigin?: boolean;
|
|
412
|
+
forceDefinedTarget?: boolean;
|
|
413
|
+
origin?: string | number | boolean | null;
|
|
414
|
+
condition: TDateOperatorsValidation;
|
|
415
|
+
target?: string | number | boolean;
|
|
416
|
+
};
|
|
417
|
+
/**
|
|
418
|
+
* @type TConditionsValidation
|
|
419
|
+
* Represents a set of validation conditions.
|
|
420
|
+
*
|
|
421
|
+
* @property {'and' | 'or'} rule - The logical rule to combine the conditions (AND/OR).
|
|
422
|
+
* @property {TConditionsValidationSet[]} set - The array of validation condition sets.
|
|
423
|
+
* @property {TConditionsValidation} [conditions] - Nested conditions for more complex validation logic.
|
|
424
|
+
*
|
|
425
|
+
* @example
|
|
426
|
+
* ```typescript
|
|
427
|
+
* const conditionsValidation: TConditionsValidation = {
|
|
428
|
+
* rule: 'and',
|
|
429
|
+
* set: [
|
|
430
|
+
* {
|
|
431
|
+
* forceDefinedOrigin: true,
|
|
432
|
+
* forceDefinedTarget: true,
|
|
433
|
+
* origin: '2023-01-01',
|
|
434
|
+
* condition: '>',
|
|
435
|
+
* target: '2022-01-01'
|
|
436
|
+
* }
|
|
437
|
+
* ],
|
|
438
|
+
* conditions: {
|
|
439
|
+
* rule: 'or',
|
|
440
|
+
* set: [
|
|
441
|
+
* {
|
|
442
|
+
* origin: true,
|
|
443
|
+
* condition: '!!origin',
|
|
444
|
+
* target: false
|
|
445
|
+
* }
|
|
446
|
+
* ]
|
|
447
|
+
* }
|
|
448
|
+
* };
|
|
449
|
+
* ```
|
|
450
|
+
*/
|
|
451
|
+
type TConditionsValidation = {
|
|
452
|
+
rule: 'and' | 'or';
|
|
453
|
+
set: TConditionsValidationSet[];
|
|
454
|
+
conditions?: TConditionsValidation;
|
|
455
|
+
};
|
|
456
|
+
type TAvailableValidations = Omit<TValidationMethods, 'multipleValidations'> | TGenericValidationRule;
|
|
457
|
+
/**
|
|
458
|
+
* @type TMultipleValidation
|
|
459
|
+
* Represents a set of multiple validation methods combined with a logical rule.
|
|
460
|
+
*
|
|
461
|
+
* @property {'AND' | 'OR' | 'NOT'} rule - The logical rule to combine the validation methods (AND, OR, NOT).
|
|
462
|
+
* @property {TAvailableValidations} validations - The validation methods to be combined.
|
|
463
|
+
*
|
|
464
|
+
* @example
|
|
465
|
+
* ```typescript
|
|
466
|
+
* const multipleValidation: TMultipleValidation = {
|
|
467
|
+
* rule: 'AND',
|
|
468
|
+
* validations: {
|
|
469
|
+
* required: true,
|
|
470
|
+
* min: 5,
|
|
471
|
+
* max: 10
|
|
472
|
+
* }
|
|
473
|
+
* };
|
|
474
|
+
* ```
|
|
475
|
+
*/
|
|
476
|
+
type TMultipleValidation = {
|
|
477
|
+
rule: 'AND' | 'OR' | 'NOT';
|
|
478
|
+
validations: TAvailableValidations;
|
|
479
|
+
};
|
|
480
|
+
/**
|
|
481
|
+
* @type TBetweenDatesValidation
|
|
482
|
+
* Represents a validation method to check if a value falls between specified dates.
|
|
483
|
+
*
|
|
484
|
+
* @property {TDateValidation[]} [TBetweenDatesValidation] - An array of date validation methods.
|
|
485
|
+
*
|
|
486
|
+
* @example
|
|
487
|
+
* ```typescript
|
|
488
|
+
* const betweenDatesValidation: TBetweenDatesValidation = [
|
|
489
|
+
* {
|
|
490
|
+
* onlyValidDate: true,
|
|
491
|
+
* operator: '>=',
|
|
492
|
+
* origin: {
|
|
493
|
+
* format: 'MMDDYYYY',
|
|
494
|
+
* intervals: {
|
|
495
|
+
* years: 1
|
|
496
|
+
* }
|
|
497
|
+
* },
|
|
498
|
+
* target: {
|
|
499
|
+
* value: Date.now(),
|
|
500
|
+
* format: 'timestamp',
|
|
501
|
+
* value: '01/01/2023',
|
|
502
|
+
* }
|
|
503
|
+
* },
|
|
504
|
+
* {
|
|
505
|
+
* onlyValidDate: true,
|
|
506
|
+
* operator: '<=',
|
|
507
|
+
* origin: {
|
|
508
|
+
* format: 'MMDDYYYY',
|
|
509
|
+
* intervals: {
|
|
510
|
+
* years: 1
|
|
511
|
+
* }
|
|
512
|
+
* },
|
|
513
|
+
* target: {
|
|
514
|
+
* format: 'timestamp',
|
|
515
|
+
* value: '31/12/2023',
|
|
516
|
+
* }
|
|
517
|
+
* }
|
|
518
|
+
* ];
|
|
519
|
+
* ```
|
|
520
|
+
*/
|
|
521
|
+
type TBetweenDatesValidation = TDateValidation[];
|
|
522
|
+
/**
|
|
523
|
+
* @type TDateFormatsValidation
|
|
524
|
+
* Represents the supported date formats for validation.
|
|
525
|
+
*
|
|
526
|
+
* @type {'MMDDYYYY' | 'DDMMYYYY' | 'YYYYMMDD' | 'YYYYDDMM' | 'timestamp'}
|
|
527
|
+
*
|
|
528
|
+
* @example
|
|
529
|
+
* ```typescript
|
|
530
|
+
* const dateFormat: TDateFormatsValidation = 'MMDDYYYY';
|
|
531
|
+
* ```
|
|
532
|
+
*/
|
|
533
|
+
type TDateFormatsValidation = 'MMDDYYYY' | 'DDMMYYYY' | 'YYYYMMDD' | 'YYYYDDMM' | 'timestamp';
|
|
534
|
+
type TDateInterval = {
|
|
535
|
+
years?: number;
|
|
536
|
+
months?: number;
|
|
537
|
+
days?: number;
|
|
538
|
+
};
|
|
539
|
+
/**
|
|
540
|
+
* @type TDateValidation
|
|
541
|
+
* Represents a validation method for date values.
|
|
542
|
+
*
|
|
543
|
+
* @property {boolean} [onlyValidDate] - Flag to validate only if the date is valid.
|
|
544
|
+
* @property {TDateOperatorsValidation} operator - The validation operator to be used.
|
|
545
|
+
* @property {Object} origin - The origin date configuration.
|
|
546
|
+
* @property {string | number} [origin.value] - The origin date value.
|
|
547
|
+
* @property {TDateFormatsValidation} origin.format - The format of the origin date.
|
|
548
|
+
* @property {Object} [origin.intervals] - The intervals to add to the origin date for comparison.
|
|
549
|
+
* @property {number} [origin.intervals.years] - The number of years to add.
|
|
550
|
+
* @property {number} [origin.intervals.months] - The number of months to add.
|
|
551
|
+
* @property {number} [origin.intervals.days] - The number of days to add.
|
|
552
|
+
* @property {Object} [target] - The target date configuration.
|
|
553
|
+
* @property {string | number} target.value - The target date value.
|
|
554
|
+
* @property {TDateFormatsValidation} target.format - The format of the target date.
|
|
555
|
+
*
|
|
556
|
+
* @example
|
|
557
|
+
* ```typescript
|
|
558
|
+
* const dateValidation: TDateValidation = {
|
|
559
|
+
* onlyValidDate: true,
|
|
560
|
+
* operator: '===',
|
|
561
|
+
* origin: {
|
|
562
|
+
* value: '10/10/2022',
|
|
563
|
+
* format: 'MMDDYYYY',
|
|
564
|
+
* intervals: {
|
|
565
|
+
* years: 1
|
|
566
|
+
* }
|
|
567
|
+
* },
|
|
568
|
+
* target: {
|
|
569
|
+
* value: Date.now(),
|
|
570
|
+
* format: 'timestamp'
|
|
571
|
+
* }
|
|
572
|
+
* };
|
|
573
|
+
* ```
|
|
574
|
+
*/
|
|
575
|
+
type TDateValidation = {
|
|
576
|
+
onlyValidDate?: boolean;
|
|
577
|
+
operator: TDateOperatorsValidation;
|
|
578
|
+
origin: {
|
|
579
|
+
value?: string | number;
|
|
580
|
+
format: TDateFormatsValidation;
|
|
581
|
+
/**
|
|
582
|
+
* Intervals to compare with the original date.
|
|
583
|
+
*
|
|
584
|
+
* It will use today's date for comparison.
|
|
585
|
+
*
|
|
586
|
+
* @example
|
|
587
|
+
* ```typescript
|
|
588
|
+
* origin date = 10/10/2022
|
|
589
|
+
* interval.year = 1
|
|
590
|
+
* operator = '==='
|
|
591
|
+
* ```
|
|
592
|
+
*
|
|
593
|
+
* It will compare (10/10/2022 + 1) with the current date and check if they are the same
|
|
594
|
+
*/
|
|
595
|
+
intervals?: TDateInterval;
|
|
596
|
+
};
|
|
597
|
+
target?: {
|
|
598
|
+
value: string | number;
|
|
599
|
+
format: TDateFormatsValidation;
|
|
600
|
+
};
|
|
601
|
+
};
|
|
602
|
+
/**
|
|
603
|
+
* @type TValidationMethods
|
|
604
|
+
* Represents the various validation methods that can be applied to form fields.
|
|
605
|
+
*
|
|
606
|
+
* @property {number} [max] - Maximum value or length.
|
|
607
|
+
* @property {number} [min] - Minimum value or length.
|
|
608
|
+
* @property {number} [lessThan] - Minimum value or length.
|
|
609
|
+
* @property {number} [greaterThan] - Minimum value or length.
|
|
610
|
+
* @property {TLengthValidation} [length] - Length validation rule.
|
|
611
|
+
* @property {boolean} [required] - Indicates if the field is required.
|
|
612
|
+
* @property {unknown} [value] - Specific value to match.
|
|
613
|
+
* @property {string} [regex] - Regular expression for validation.
|
|
614
|
+
* @property {boolean} [email] - Indicates if the value should be a valid email.
|
|
615
|
+
* @property {boolean} [url] - Indicates if the value should be a valid URL.
|
|
616
|
+
* @property {boolean} [onlyLetters] - Indicates if the value should contain only letters.
|
|
617
|
+
* @property {boolean} [notAllowSpaces] - Indicates if spaces are not allowed.
|
|
618
|
+
* @property {TCallbackValidation} [callback] - Custom validation callback function.
|
|
619
|
+
* @property {boolean} [isNumber] - Indicates if the value should be a number.
|
|
620
|
+
* @property {boolean} [bool] - Indicates if the value should be a boolean or a string that can be converted to a boolean.
|
|
621
|
+
* @property {boolean | string} [exists] - Indicates if the value should exist or match a specific existence condition.
|
|
622
|
+
* @property {boolean} [hasNoExtraSpaces] - Indicates if there should be no extra spaces.
|
|
623
|
+
* @property {boolean} [notEmpty] - Indicates if the field should not be empty.
|
|
624
|
+
* @property {TBetweenValidation} [between] - Validation rule for range between two values.
|
|
625
|
+
* @property {boolean} [sequential] - Indicates if the value should be sequential.
|
|
626
|
+
* @property {boolean} [repeated] - Indicates if the value should not be repeated.
|
|
627
|
+
* @property {string[] | number[]} [includes] - Array of values that should be included.
|
|
628
|
+
* @property {string[]} [isCreditCard] - Array of valid credit card numbers.
|
|
629
|
+
* @property {TCreditCardMatch} [isCreditCodeMatch] - Validation rule for credit card matching.
|
|
630
|
+
* @property {string[]} [isCreditCardAndLength] - Array of valid credit card numbers with length check.
|
|
631
|
+
* @property {TDocumentValidation} [document] - Document validation rule.
|
|
632
|
+
* @property {TConditionsValidation} [conditions] - Conditional validation rules.
|
|
633
|
+
* @property {TMultipleValidation} [multipleValidations] - Multiple validation rules combined with a logical rule.
|
|
634
|
+
* @property {TBetweenDatesValidation} [betweenDates] - Validation rule for checking if a date falls between two dates.
|
|
635
|
+
* @property {TDateValidation} [date] - Validation rule for date values.
|
|
636
|
+
* @property {TDateFormatsValidation} [validDate] - Validation rule for valid date formats.
|
|
637
|
+
*
|
|
638
|
+
* @example
|
|
639
|
+
* ```typescript
|
|
640
|
+
* const validationMethods: TValidationMethods = {
|
|
641
|
+
* max: 100,
|
|
642
|
+
* min: 1,
|
|
643
|
+
* lessThan: 1995,
|
|
644
|
+
* greaterThan: 82000,
|
|
645
|
+
* length: { rule: 'greaterOrEqual', target: 8 },
|
|
646
|
+
* required: true,
|
|
647
|
+
* regex: '^[a-zA-Z0-9]+$',
|
|
648
|
+
* email: true,
|
|
649
|
+
* conditions: {
|
|
650
|
+
* rule: 'and',
|
|
651
|
+
* set: [
|
|
652
|
+
* {
|
|
653
|
+
* forceDefinedOrigin: true,
|
|
654
|
+
* forceDefinedTarget: true,
|
|
655
|
+
* origin: '2023-01-01',
|
|
656
|
+
* condition: '>',
|
|
657
|
+
* target: '2022-01-01'
|
|
658
|
+
* }
|
|
659
|
+
* ]
|
|
660
|
+
* },
|
|
661
|
+
* multipleValidations: {
|
|
662
|
+
* rule: 'AND',
|
|
663
|
+
* validations: {
|
|
664
|
+
* required: true,
|
|
665
|
+
* min: 5,
|
|
666
|
+
* max: 10
|
|
667
|
+
* }
|
|
668
|
+
* },
|
|
669
|
+
* betweenDates: {
|
|
670
|
+
* start: Date.parse('2023-01-01'),
|
|
671
|
+
* end: Date.parse('2023-12-31'),
|
|
672
|
+
* isIncludedBoundaries: true
|
|
673
|
+
* },
|
|
674
|
+
* date: {
|
|
675
|
+
* operator: '===',
|
|
676
|
+
* origin: {
|
|
677
|
+
* value: '10/10/2022',
|
|
678
|
+
* format: 'MMDDYYYY',
|
|
679
|
+
* intervals: {
|
|
680
|
+
* years: 1
|
|
681
|
+
* }
|
|
682
|
+
* },
|
|
683
|
+
* target: {
|
|
684
|
+
* value: Date.now(),
|
|
685
|
+
* format: 'timestamp'
|
|
686
|
+
* }
|
|
687
|
+
* },
|
|
688
|
+
* validDate: 'MMDDYYYY'
|
|
689
|
+
* };
|
|
690
|
+
* ```
|
|
691
|
+
*/
|
|
692
|
+
type TValidationMethods = {
|
|
693
|
+
/** Maximum value or length. */
|
|
694
|
+
max?: number;
|
|
695
|
+
/** Minimum value or length. */
|
|
696
|
+
min?: number;
|
|
697
|
+
/** Minimum value or length. */
|
|
698
|
+
lessThan?: number;
|
|
699
|
+
/** Minimum value or length. */
|
|
700
|
+
greaterThan?: number;
|
|
701
|
+
/** Length validation rule. */
|
|
702
|
+
length?: TLengthValidation;
|
|
703
|
+
/** Indicates if the field is required. */
|
|
704
|
+
required?: boolean;
|
|
705
|
+
/** Specific value to match. */
|
|
706
|
+
value?: unknown;
|
|
707
|
+
/** Regular expression for validation. */
|
|
708
|
+
regex?: string;
|
|
709
|
+
/** Indicates if the value should be a valid email. */
|
|
710
|
+
email?: boolean;
|
|
711
|
+
/** Indicates if the value should be a valid URL. */
|
|
712
|
+
url?: boolean;
|
|
713
|
+
/** Indicates if the value should contain only letters. */
|
|
714
|
+
onlyLetters?: boolean;
|
|
715
|
+
/** Indicates if spaces are not allowed. */
|
|
716
|
+
notAllowSpaces?: boolean;
|
|
717
|
+
/** Custom validation callback function. */
|
|
718
|
+
callback?: TCallbackValidation;
|
|
719
|
+
/** Indicates if the value should be a number. */
|
|
720
|
+
isNumber?: boolean;
|
|
721
|
+
/** Indicates if the value should be a boolean or a string that can be converted to a boolean. */
|
|
722
|
+
bool?: boolean | string;
|
|
723
|
+
/** Indicates if the value should exist or match a specific existence condition. */
|
|
724
|
+
exists?: boolean | string;
|
|
725
|
+
/** Indicates if there should be no extra spaces. */
|
|
726
|
+
hasNoExtraSpaces?: boolean;
|
|
727
|
+
/** Indicates if the field should not be empty. */
|
|
728
|
+
notEmpty?: boolean;
|
|
729
|
+
/** Validation rule for range between two values. */
|
|
730
|
+
between?: TBetweenValidation;
|
|
731
|
+
/** Indicates if the value should be sequential. */
|
|
732
|
+
sequential?: boolean;
|
|
733
|
+
/** Indicates if the value should not be repeated. */
|
|
734
|
+
repeated?: boolean;
|
|
735
|
+
/** Array of values that should be included. */
|
|
736
|
+
includes?: (string | number)[];
|
|
737
|
+
/** Array of valid credit card numbers. */
|
|
738
|
+
isCreditCard?: string[];
|
|
739
|
+
/** Validation rule for credit card matching. */
|
|
740
|
+
isCreditCodeMatch?: TCreditCardMatch;
|
|
741
|
+
/** Array of valid credit card numbers with length check. */
|
|
742
|
+
isCreditCardAndLength?: string[];
|
|
743
|
+
/** Document validation rule. */
|
|
744
|
+
document?: TDocumentValidation;
|
|
745
|
+
/** Conditional validation rules. */
|
|
746
|
+
conditions?: TConditionsValidation;
|
|
747
|
+
/** Multiple validation rules combined with a logical rule. */
|
|
748
|
+
multipleValidations?: TMultipleValidation;
|
|
749
|
+
/** Validation rule for checking if a date falls between two dates. */
|
|
750
|
+
betweenDates?: TBetweenDatesValidation;
|
|
751
|
+
/** Validation rule for date values. */
|
|
752
|
+
date?: TDateValidation;
|
|
753
|
+
/** Validation rule for valid date formats. */
|
|
754
|
+
validDate?: TDateFormatsValidation;
|
|
755
|
+
};
|
|
756
|
+
/**
|
|
757
|
+
* @type {Object.<string, TValidationMethods>} TGenericValidationRule
|
|
758
|
+
* Represents a generic validation rule where each key is associated with a set of validation methods.
|
|
759
|
+
*
|
|
760
|
+
* @example
|
|
761
|
+
* const genericValidationRule = {
|
|
762
|
+
* email: {
|
|
763
|
+
* required: true,
|
|
764
|
+
* email: true,
|
|
765
|
+
* },
|
|
766
|
+
* password: {
|
|
767
|
+
* required: true,
|
|
768
|
+
* minLength: 8,
|
|
769
|
+
* },
|
|
770
|
+
* };
|
|
771
|
+
*/
|
|
772
|
+
type TGenericValidationRule = Record<string, TValidationMethods>;
|
|
773
|
+
/**
|
|
774
|
+
* @type {TValidationMethods | TGenericValidationRule} TSchemaValidation
|
|
775
|
+
* Represents the schema validation which can be either a set of validation methods or a generic validation rule.
|
|
776
|
+
*
|
|
777
|
+
* @example
|
|
778
|
+
* const schemaValidation = {
|
|
779
|
+
* required: true,
|
|
780
|
+
* maxLength: 10,
|
|
781
|
+
* };
|
|
782
|
+
*
|
|
783
|
+
* const genericSchemaValidation = {
|
|
784
|
+
* email: {
|
|
785
|
+
* required: true,
|
|
786
|
+
* email: true,
|
|
787
|
+
* },
|
|
788
|
+
* password: {
|
|
789
|
+
* required: true,
|
|
790
|
+
* minLength: 8,
|
|
791
|
+
* },
|
|
792
|
+
* };
|
|
793
|
+
* @interface
|
|
794
|
+
*/
|
|
795
|
+
type TSchemaValidation = TValidationMethods | TGenericValidationRule;
|
|
796
|
+
/**
|
|
797
|
+
* Formatter types
|
|
798
|
+
* @type TSplitterFormatterValue
|
|
799
|
+
* Represents a value and its position for splitting or formatting purposes.
|
|
800
|
+
*
|
|
801
|
+
* @property {string} value - The value to be split or formatted.
|
|
802
|
+
* @property {number} position - The position for splitting or formatting.
|
|
803
|
+
*
|
|
804
|
+
* @example
|
|
805
|
+
* ```typescript
|
|
806
|
+
* const splitterFormatter: TSplitterFormatterValue = { value: '-', position: 3 };
|
|
807
|
+
* ```
|
|
808
|
+
*/
|
|
809
|
+
type TSplitterFormatterValue = {
|
|
810
|
+
value: string;
|
|
811
|
+
position: number;
|
|
812
|
+
};
|
|
813
|
+
/**
|
|
814
|
+
* @type TFormatters
|
|
815
|
+
* Represents the various formatting options that can be applied to form field values.
|
|
816
|
+
*
|
|
817
|
+
* @property {boolean} [dotEvery3chars] - Add a dot every 3 characters.
|
|
818
|
+
* @property {boolean} [capitalize] - Capitalize the value.
|
|
819
|
+
* @property {boolean} [uppercase] - Convert the value to uppercase.
|
|
820
|
+
* @property {boolean} [onlyNumbers] - Allow only numbers.
|
|
821
|
+
* @property {boolean} [onlyLetters] - Allow only letters.
|
|
822
|
+
* @property {Pick<TCurrencyMask, 'precision' | 'decimal'>} [onlyFloatNumber] - Allow only float numbers with specific precision and decimal.
|
|
823
|
+
* @property {string} [regex] - Regular expression for formatting.
|
|
824
|
+
* @property {string[]} [gapsCreditCard] - Gaps to insert in credit card numbers.
|
|
825
|
+
* @property {(value: unknown) => unknown} [callback] - Custom formatter callback function.
|
|
826
|
+
* @property {TSplitterFormatterValue[]} [splitter] - Splitter values for formatting.
|
|
827
|
+
* @property {boolean} [trim] - Removes whitespace from both ends of this string and returns a new string, without modifying the original string.
|
|
828
|
+
* @property {number} [maxLength] - Truncates the input value to a specified maximum length if necessary.
|
|
829
|
+
*
|
|
830
|
+
* @example
|
|
831
|
+
* ```json
|
|
832
|
+
* {
|
|
833
|
+
* formatters: {
|
|
834
|
+
* dotEvery3chars: true,
|
|
835
|
+
* capitalize: true,
|
|
836
|
+
* uppercase: true,
|
|
837
|
+
* onlyNumbers: true,
|
|
838
|
+
* regex: '^[a-zA-Z0-9]+$',
|
|
839
|
+
* gapsCreditCard: [' ', ' '],
|
|
840
|
+
* callback: (value) => value.toString().toUpperCase(),
|
|
841
|
+
* splitter: [{ value: '-', position: 3 }],
|
|
842
|
+
* trim: true,
|
|
843
|
+
* maxLength: 15
|
|
844
|
+
* }
|
|
845
|
+
* }
|
|
846
|
+
* ```
|
|
847
|
+
*/
|
|
848
|
+
type TFormatters = {
|
|
849
|
+
/** Add a dot every 3 characters. */
|
|
850
|
+
dotEvery3chars?: boolean;
|
|
851
|
+
/** Capitalize the value. */
|
|
852
|
+
capitalize?: boolean;
|
|
853
|
+
/** Convert the value to uppercase. */
|
|
854
|
+
uppercase?: boolean;
|
|
855
|
+
/** Allow only numbers. */
|
|
856
|
+
onlyNumbers?: boolean;
|
|
857
|
+
/** Allow only letters. */
|
|
858
|
+
onlyLetters?: boolean;
|
|
859
|
+
/** Allow only float numbers with specific precision and decimal. */
|
|
860
|
+
onlyFloatNumber?: Pick<TCurrencyMask, 'precision' | 'decimal'>;
|
|
861
|
+
/** Regular expression for formatting. */
|
|
862
|
+
regex?: string;
|
|
863
|
+
gapsCreditCard?: string[] | boolean;
|
|
864
|
+
callback?: ((value: unknown) => unknown) | null;
|
|
865
|
+
splitter?: TSplitterFormatterValue[];
|
|
866
|
+
/** Removes whitespace from both ends of this string and returns a new string, without modifying the original string. */
|
|
867
|
+
trim?: boolean;
|
|
868
|
+
/** Truncates the input value to a specified maximum length if necessary. */
|
|
869
|
+
maxLength?: number;
|
|
870
|
+
};
|
|
871
|
+
/**
|
|
872
|
+
* Mask types
|
|
873
|
+
* @type TCurrencyMask
|
|
874
|
+
* Represents the mask configuration for currency values.
|
|
875
|
+
*
|
|
876
|
+
* @property {'left' | 'right'} [align] - The alignment of the currency symbol. (default: right)
|
|
877
|
+
* @property {string} [decimal] - The decimal separator. (default: '.')
|
|
878
|
+
* @property {number} [precision] - The number of decimal places. (default: 2)
|
|
879
|
+
* @property {TCurrencyCode} [prefix] - The currency symbol prefix. (default: '$')
|
|
880
|
+
* @property {string} [thousands] - The thousands separator. (default: ',')
|
|
881
|
+
*
|
|
882
|
+
* @example
|
|
883
|
+
* ```typescript
|
|
884
|
+
* const currencyMask: TCurrencyMask = {
|
|
885
|
+
* align: 'left',
|
|
886
|
+
* decimal: '.',
|
|
887
|
+
* precision: 2,
|
|
888
|
+
* prefix: '$',
|
|
889
|
+
* thousands: ','
|
|
890
|
+
* };
|
|
891
|
+
* ```
|
|
892
|
+
*/
|
|
893
|
+
type TCurrencyMask = {
|
|
894
|
+
align?: 'left' | 'right';
|
|
895
|
+
decimal?: string;
|
|
896
|
+
precision?: number;
|
|
897
|
+
prefix?: TCurrencyCode;
|
|
898
|
+
thousands?: string;
|
|
899
|
+
};
|
|
900
|
+
/**
|
|
901
|
+
* @type TMaskGeneric
|
|
902
|
+
* Represents a generic mask configuration.
|
|
903
|
+
*
|
|
904
|
+
* @property {number} to - The ending position of the mask.
|
|
905
|
+
* @property {number} from - The starting position of the mask.
|
|
906
|
+
* @property {string} mask - The mask pattern to apply.
|
|
907
|
+
*
|
|
908
|
+
* @example
|
|
909
|
+
* ```typescript
|
|
910
|
+
* const maskGeneric: TMaskGeneric = { to: 4, from: 0, mask: '****' };
|
|
911
|
+
* ```
|
|
912
|
+
*/
|
|
913
|
+
type TMaskGeneric = {
|
|
914
|
+
to: number;
|
|
915
|
+
from: number;
|
|
916
|
+
mask: string;
|
|
917
|
+
};
|
|
918
|
+
/**
|
|
919
|
+
* @type TMasks
|
|
920
|
+
* Represents the different types of masks that can be applied to form field values.
|
|
921
|
+
*
|
|
922
|
+
* @property {TCurrencyMask} [currency] - Mask for currency values.
|
|
923
|
+
* @property {TMaskGeneric[]} [generic] - Array of generic masks.
|
|
924
|
+
* @property {string} [custom] - Custom mask pattern.
|
|
925
|
+
* @property {boolean} [secureCreditCard] - Mask for securing credit card values.
|
|
926
|
+
* @property {boolean} [card] - Mask for card values.
|
|
927
|
+
* @property {boolean} [cardDate] - Mask for card date values.
|
|
928
|
+
* @property {boolean} [fein] - Mask for FEIN (Federal Employer Identification Number).
|
|
929
|
+
* @property {string | number} [replaceAll] - Value to replace all matches.
|
|
930
|
+
* @property {(value: unknown) => string} [callback] - Custom mask callback function.
|
|
931
|
+
*
|
|
932
|
+
* @example
|
|
933
|
+
* ```typescript
|
|
934
|
+
* const masks: TMasks = {
|
|
935
|
+
* currency: { align: 'left', decimal: '.', precision: 2, prefix: '$', thousands: ',' },
|
|
936
|
+
* generic: [{ to: 4, from: 0, mask: '****' }],
|
|
937
|
+
* custom: '###-##-####',
|
|
938
|
+
* secureCreditCard: true,
|
|
939
|
+
* card: true,
|
|
940
|
+
* cardDate: true,
|
|
941
|
+
* fein: true,
|
|
942
|
+
* replaceAll: '*',
|
|
943
|
+
* callback: (value) => value.toString().replace(/\d/g, '*')
|
|
944
|
+
* };
|
|
945
|
+
* ```
|
|
946
|
+
*/
|
|
947
|
+
type TMasks = {
|
|
948
|
+
/** Mask for currency values. */
|
|
949
|
+
currency?: TCurrencyMask;
|
|
950
|
+
/** Array of generic masks. */
|
|
951
|
+
generic?: TMaskGeneric[];
|
|
952
|
+
/** Custom mask pattern. */
|
|
953
|
+
custom?: string | null;
|
|
954
|
+
/** Mask for securing credit card values. */
|
|
955
|
+
secureCreditCard?: boolean;
|
|
956
|
+
/** Mask for card values. */
|
|
957
|
+
card?: boolean;
|
|
958
|
+
/** Mask for card date values. */
|
|
959
|
+
cardDate?: boolean;
|
|
960
|
+
/** Mask for FEIN (Federal Employer Identification Number). */
|
|
961
|
+
fein?: boolean;
|
|
962
|
+
/** Value to replace all matches. */
|
|
963
|
+
replaceAll?: string | number;
|
|
964
|
+
/** Custom mask callback function. */
|
|
965
|
+
callback?: (value: unknown) => string;
|
|
966
|
+
};
|
|
967
|
+
/**
|
|
968
|
+
* @type TVisibility
|
|
969
|
+
* Represents the visibility conditions for form fields based on validations.
|
|
970
|
+
*
|
|
971
|
+
* @property {boolean} showOnlyIfTrue - Enables visibility of fields only if any or all validation conditions are positive.
|
|
972
|
+
* @property {TSchemaValidation} validations - The validation methods to determine visibility.
|
|
973
|
+
* @property {string[] | string} fields - The fields to be shown or hidden based on validations.
|
|
974
|
+
* @property {string[]} events - Events where visibility will occur.
|
|
975
|
+
*
|
|
976
|
+
* @example
|
|
977
|
+
* ```typescript
|
|
978
|
+
* const visibility: TVisibility = {
|
|
979
|
+
* showOnlyIfTrue: false,
|
|
980
|
+
* validations: { required: true },
|
|
981
|
+
* fields: ['fieldName'],
|
|
982
|
+
* events: ['ON_FIELD_CHANGE']
|
|
983
|
+
* };
|
|
984
|
+
* ```
|
|
985
|
+
*/
|
|
986
|
+
type TVisibility = {
|
|
987
|
+
showOnlyIfTrue?: boolean;
|
|
988
|
+
validations: TSchemaValidation;
|
|
989
|
+
fields: string[] | string;
|
|
990
|
+
events: TEvents[];
|
|
991
|
+
};
|
|
992
|
+
/**
|
|
993
|
+
* @type TResetValueMethods
|
|
994
|
+
* @extends TVisibility with methods to reset values.
|
|
995
|
+
* @summary schema method to reset values from event
|
|
996
|
+
* much cool such wow
|
|
997
|
+
*
|
|
998
|
+
* @property {unknown[] | unknown} resettledValue - The values to reset.
|
|
999
|
+
* @property {Partial<TEvents>[]} events - events that will react to the value reset
|
|
1000
|
+
* @property {string | string[]} fields - fields that will react to the value reset
|
|
1001
|
+
* @property {TSchemaValidation} validations - validations to trigger the property reset
|
|
1002
|
+
*
|
|
1003
|
+
*
|
|
1004
|
+
* @example
|
|
1005
|
+
* ```typescript
|
|
1006
|
+
* const resetValueMethods: TResetValueMethods = {
|
|
1007
|
+
* validations: { required: true },
|
|
1008
|
+
* fields: ['fieldName'],
|
|
1009
|
+
* resettledValue: [''],
|
|
1010
|
+
* events: ['ON_FIELD_CHANGE]
|
|
1011
|
+
* };
|
|
1012
|
+
* ```
|
|
1013
|
+
* @interface
|
|
1014
|
+
*/
|
|
1015
|
+
type TResetValueMethods = Omit<TVisibility, 'showOnlyIfTrue' | 'validations'> & {
|
|
1016
|
+
resettledValue: unknown[] | unknown;
|
|
1017
|
+
validations?: TSchemaValidation;
|
|
1018
|
+
};
|
|
1019
|
+
/**
|
|
1020
|
+
* @type TResetPathMethods
|
|
1021
|
+
* Method to reset some field properties other than component props or field value
|
|
1022
|
+
*
|
|
1023
|
+
* @property {TAllowedResetPropsMutations} property property to be changed, ex: api, resetValues, etc..
|
|
1024
|
+
* @property {string} path path where the property to be changed is located
|
|
1025
|
+
* @property {string} field field that will recieve the property change
|
|
1026
|
+
* @property {unknown} resettledValue value to be replaced onto the property
|
|
1027
|
+
* @property {TSchemaValidation} validations validations rules to be validated to change the property value
|
|
1028
|
+
* @property {Partial<TEvents>[]} events events to listen to apply this change
|
|
1029
|
+
*
|
|
1030
|
+
* @example
|
|
1031
|
+
* ```typescript
|
|
1032
|
+
* const resetValueMethods: TResetValueMethods = {
|
|
1033
|
+
* validations: { required: true },
|
|
1034
|
+
* fields: ['fieldName'],
|
|
1035
|
+
* resettledValue: ['']
|
|
1036
|
+
* };
|
|
1037
|
+
* ```
|
|
1038
|
+
*/
|
|
1039
|
+
type TResetPathMethods = {
|
|
1040
|
+
property: TAllowedResetPropsMutations;
|
|
1041
|
+
path: string;
|
|
1042
|
+
field: string;
|
|
1043
|
+
resettledValue: unknown;
|
|
1044
|
+
validations: TSchemaValidation;
|
|
1045
|
+
events: Partial<TEvents>[];
|
|
1046
|
+
};
|
|
1047
|
+
/**
|
|
1048
|
+
* @type TApiConfig
|
|
1049
|
+
* Represents the configuration for an API request.
|
|
1050
|
+
*
|
|
1051
|
+
* @property {'GET' | 'POST'} method - The HTTP method for the request.
|
|
1052
|
+
* @property {string} url - The URL for the request.
|
|
1053
|
+
* @property {OutgoingHttpHeaders} [headers] - The headers for the request.
|
|
1054
|
+
* @property {Record<string, string>} queryParams - query parameters for request.
|
|
1055
|
+
* @property {string} [resultPath] - The path to extract the result from the response.
|
|
1056
|
+
* @property {unknown} [fallbackValue] - The fallback value if the request fails.
|
|
1057
|
+
* @property {TSchemaValidation} preConditions - validation conditions to execute the API call
|
|
1058
|
+
* @property {boolean} blockRequestWhenInvalid - blocks request when field validation fails
|
|
1059
|
+
*
|
|
1060
|
+
* @example
|
|
1061
|
+
* ```typescript
|
|
1062
|
+
* const apiConfig: TApiConfig = {
|
|
1063
|
+
* method: 'POST',
|
|
1064
|
+
* url: 'https://api.example.com/data',
|
|
1065
|
+
* headers: { 'Content-Type': 'application/json' },
|
|
1066
|
+
* resultPath: 'data.results',
|
|
1067
|
+
* fallbackValue: [],
|
|
1068
|
+
* preConditions: {
|
|
1069
|
+
* required: true,
|
|
1070
|
+
* }
|
|
1071
|
+
* blockRequestWhenInvalid: true,
|
|
1072
|
+
* };
|
|
1073
|
+
* ```
|
|
1074
|
+
*/
|
|
1075
|
+
type TApiConfig = {
|
|
1076
|
+
/** The HTTP method for the request. */
|
|
1077
|
+
method: 'GET' | 'POST';
|
|
1078
|
+
/** The URL for the request. */
|
|
1079
|
+
url: string;
|
|
1080
|
+
/** The body payload for the request. */
|
|
1081
|
+
body?: Record<string, unknown>;
|
|
1082
|
+
/** The headers for the request. */
|
|
1083
|
+
headers?: OutgoingHttpHeaders;
|
|
1084
|
+
/** Query parameters for the request. */
|
|
1085
|
+
queryParams?: Record<string, string>;
|
|
1086
|
+
/** The path to extract the result from the response. */
|
|
1087
|
+
resultPath?: string;
|
|
1088
|
+
/** The fallback value if the request fails. */
|
|
1089
|
+
fallbackValue?: unknown;
|
|
1090
|
+
/** Validation conditions to execute the API call. */
|
|
1091
|
+
preConditions?: TSchemaValidation;
|
|
1092
|
+
/** Blocks request when field validation fails. */
|
|
1093
|
+
blockRequestWhenInvalid?: boolean;
|
|
1094
|
+
/** Custom transform callback for the request payload. */
|
|
1095
|
+
transform?: {
|
|
1096
|
+
callback(callbackPayload: {
|
|
1097
|
+
payload: unknown;
|
|
1098
|
+
formValues: TFormValues<unknown>;
|
|
1099
|
+
}): unknown;
|
|
1100
|
+
};
|
|
1101
|
+
};
|
|
1102
|
+
/**
|
|
1103
|
+
* @type TProps
|
|
1104
|
+
* Represents the properties for a component.
|
|
1105
|
+
*/
|
|
1106
|
+
type TProps = Record<string, unknown>;
|
|
1107
|
+
/**
|
|
1108
|
+
* @type TValidations
|
|
1109
|
+
* Represents the validation configuration for form fields, including methods, event-specific messages, and error messages.
|
|
1110
|
+
*
|
|
1111
|
+
* @property {TSchemaValidation} methods - The validation methods to be applied.
|
|
1112
|
+
* @property {Partial<Record<TEvents, string[]>>} eventMessages - The messages to be displayed for specific validation events.
|
|
1113
|
+
* @property {TErrorMessages} messages - The general error messages for validation methods.
|
|
1114
|
+
*
|
|
1115
|
+
* @interface
|
|
1116
|
+
*
|
|
1117
|
+
* @example
|
|
1118
|
+
* ```typescript
|
|
1119
|
+
* const validations: TValidations = {
|
|
1120
|
+
* methods: {
|
|
1121
|
+
* max: 100,
|
|
1122
|
+
* required: true,
|
|
1123
|
+
* regex: '^[a-zA-Z0-9]+$',
|
|
1124
|
+
* },
|
|
1125
|
+
* eventMessages: {
|
|
1126
|
+
* ON_FIELD_MOUNT: ['required'],
|
|
1127
|
+
* ON_FIELD_CHANGE: ['regex', 'required'],
|
|
1128
|
+
* ON_FIELD_BLUR: ['max', 'required'],
|
|
1129
|
+
* },
|
|
1130
|
+
* messages: {
|
|
1131
|
+
* default: 'This field is required',
|
|
1132
|
+
* max: 'Value exceeds the maximum limit',
|
|
1133
|
+
* regex: 'Value does not match the pattern',
|
|
1134
|
+
* },
|
|
1135
|
+
* };
|
|
1136
|
+
* ```
|
|
1137
|
+
*/
|
|
1138
|
+
type TValidations = {
|
|
1139
|
+
methods: TSchemaValidation;
|
|
1140
|
+
eventMessages?: TEventMessages;
|
|
1141
|
+
messages?: TErrorMessages;
|
|
1142
|
+
};
|
|
1143
|
+
/**
|
|
1144
|
+
* @type TValidations
|
|
1145
|
+
* Represents the validation configuration for form fields, including methods, event-specific messages, and error messages.
|
|
1146
|
+
*
|
|
1147
|
+
* @property {TSchemaValidation} methods - The validation methods to be applied.
|
|
1148
|
+
* @property {Partial<Record<TEvents, string[]>>} eventMessages - The messages to be displayed for specific validation events.
|
|
1149
|
+
* @property {TErrorMessages} messages - The general error messages for validation methods.
|
|
1150
|
+
*
|
|
1151
|
+
* @example
|
|
1152
|
+
* ```typescript
|
|
1153
|
+
* const eventMessages: {
|
|
1154
|
+
* ON_FIELD_MOUNT: ['required'],
|
|
1155
|
+
* ON_FIELD_CHANGE: ['regex', 'required'],
|
|
1156
|
+
* ON_FIELD_BLUR: ['max', 'required'],
|
|
1157
|
+
* },
|
|
1158
|
+
* ```
|
|
1159
|
+
* @interface
|
|
1160
|
+
*/
|
|
1161
|
+
type TEventMessages = Partial<Record<TEvents, TEventMessagesValidationMethods[]>>;
|
|
1162
|
+
/**
|
|
1163
|
+
* @type TEventMessagesValidationMethods
|
|
1164
|
+
*
|
|
1165
|
+
* allowed validation methods to trigger the event messages desc
|
|
1166
|
+
*
|
|
1167
|
+
* @property {keyof TValidationMethods | TAnyKey;} TEventMessagesValidationMethods - allowed validation methods to trigger the event messages
|
|
1168
|
+
*/
|
|
1169
|
+
type TEventMessagesValidationMethods = keyof TValidationMethods | TAnyKey;
|
|
1170
|
+
type TAnyKey = string & NonNullable<unknown>;
|
|
1171
|
+
/**
|
|
1172
|
+
* @type TErrorMessages
|
|
1173
|
+
* Represents the error messages for different validation methods.
|
|
1174
|
+
* @property {string} default - the message to display regardless the validation
|
|
1175
|
+
*
|
|
1176
|
+
* @example
|
|
1177
|
+
* ```typescript
|
|
1178
|
+
* const errorMessages: TErrorMessages = {
|
|
1179
|
+
* required: 'This field is required.',
|
|
1180
|
+
* max: 'The value cannot exceed the maximum limit.'
|
|
1181
|
+
* default: 'Default error message'
|
|
1182
|
+
* };
|
|
1183
|
+
* ```
|
|
1184
|
+
* @interface
|
|
1185
|
+
*/
|
|
1186
|
+
type TErrorMessages = Partial<Record<keyof TSchemaValidation | 'default' | (string & NonNullable<unknown>), string>>;
|
|
1187
|
+
/**
|
|
1188
|
+
* Represents an event configuration with a specific type.
|
|
1189
|
+
*
|
|
1190
|
+
* @template T
|
|
1191
|
+
* @property {T} config - The configuration of the event.
|
|
1192
|
+
* @property {Partial<TEvents>[]} events - The events associated with the configuration.
|
|
1193
|
+
*/
|
|
1194
|
+
type TEvent<T> = {
|
|
1195
|
+
config: T;
|
|
1196
|
+
events: TEvents[];
|
|
1197
|
+
};
|
|
1198
|
+
/**
|
|
1199
|
+
* Represents the API event configurations.
|
|
1200
|
+
*
|
|
1201
|
+
* @property {TEvent<TApiConfig>} [defaultConfig] - The default event configuration.
|
|
1202
|
+
* @property {Record<string, TEvent<TApiConfig>>} [configs] - Named event configurations.
|
|
1203
|
+
*
|
|
1204
|
+
* @example
|
|
1205
|
+
* ```typescript
|
|
1206
|
+
* const apiEvent: TApiEvent = {
|
|
1207
|
+
* defaultConfig: {
|
|
1208
|
+
* config: {
|
|
1209
|
+
* method: 'POST',
|
|
1210
|
+
* url: 'https://api.example.com/data',
|
|
1211
|
+
* headers: { 'Content-Type': 'application/json' },
|
|
1212
|
+
* resultPath: 'data.results',
|
|
1213
|
+
* fallbackValue: [],
|
|
1214
|
+
* preConditions: {
|
|
1215
|
+
* required: true,
|
|
1216
|
+
* },
|
|
1217
|
+
* blockRequestWhenInvalid: true,
|
|
1218
|
+
* },
|
|
1219
|
+
* events: ['ON_FIELD_MOUNT', 'ON_FIELD_CHANGE'],
|
|
1220
|
+
* },
|
|
1221
|
+
* configs: {
|
|
1222
|
+
* example_config_name: {
|
|
1223
|
+
* config: {
|
|
1224
|
+
* method: 'POST',
|
|
1225
|
+
* url: 'https://api.example.com/data',
|
|
1226
|
+
* headers: { 'Content-Type': 'application/json' },
|
|
1227
|
+
* resultPath: 'data.results',
|
|
1228
|
+
* fallbackValue: [],
|
|
1229
|
+
* preConditions: {
|
|
1230
|
+
* required: true,
|
|
1231
|
+
* },
|
|
1232
|
+
* blockRequestWhenInvalid: true,
|
|
1233
|
+
* },
|
|
1234
|
+
* events: ['ON_FIELD_MOUNT', 'ON_FIELD_CHANGE'],
|
|
1235
|
+
* },
|
|
1236
|
+
* },
|
|
1237
|
+
* };
|
|
1238
|
+
* ```
|
|
1239
|
+
*/
|
|
1240
|
+
type TApiEvent = {
|
|
1241
|
+
defaultConfig?: TEvent<TApiConfig>;
|
|
1242
|
+
configs?: Record<string, TEvent<TApiConfig>>;
|
|
1243
|
+
};
|
|
1244
|
+
/**
|
|
1245
|
+
* Represents the API response return payload for handling.
|
|
1246
|
+
*
|
|
1247
|
+
* @property {unknown} response - The default response.
|
|
1248
|
+
* @property {number | null} status - response http status number.
|
|
1249
|
+
*/
|
|
1250
|
+
type TApiResponsePayload = {
|
|
1251
|
+
response: unknown;
|
|
1252
|
+
status: number | null;
|
|
1253
|
+
};
|
|
1254
|
+
/**
|
|
1255
|
+
* Represents the API response structure.
|
|
1256
|
+
*
|
|
1257
|
+
* @property {TApiResponsePayload} default - The default response.
|
|
1258
|
+
* @property {Record<string, TApiResponsePayload>} [named] - Named responses.
|
|
1259
|
+
*/
|
|
1260
|
+
type TApiResponse = {
|
|
1261
|
+
default: TApiResponsePayload;
|
|
1262
|
+
named?: Record<string, TApiResponsePayload>;
|
|
1263
|
+
apiState: {
|
|
1264
|
+
loading: boolean;
|
|
1265
|
+
lastEvent?: TEvents;
|
|
1266
|
+
};
|
|
1267
|
+
};
|
|
1268
|
+
/**
|
|
1269
|
+
* Represents the schema config structure
|
|
1270
|
+
*
|
|
1271
|
+
* @property {number} defaultAPIdebounceTimeMS - default API debounce time between request events.
|
|
1272
|
+
* @property {boolean} defaultLogVerbose - flag to turn warning log messages on client.
|
|
1273
|
+
* @property {number} [defaultStateRefreshTimeMS] - default state refresh between events side effects.
|
|
1274
|
+
*/
|
|
1275
|
+
type TSchemaFormConfig = {
|
|
1276
|
+
defaultAPIdebounceTimeMS?: number;
|
|
1277
|
+
defaultStateRefreshTimeMS?: number;
|
|
1278
|
+
defaultLogVerbose?: boolean;
|
|
1279
|
+
};
|
|
1280
|
+
|
|
1281
|
+
/**
|
|
1282
|
+
* @interface IState
|
|
1283
|
+
* Represents the state of a form component.
|
|
1284
|
+
*
|
|
1285
|
+
* @property {string[]} errors - The list of error messages.
|
|
1286
|
+
* @property {boolean} visibility - The visibility state of the component.
|
|
1287
|
+
* @property {Record<string, unknown>} props - The properties of the component.
|
|
1288
|
+
*
|
|
1289
|
+
* @example
|
|
1290
|
+
* ```typescript
|
|
1291
|
+
* const state: IState = {
|
|
1292
|
+
* visibility: true,
|
|
1293
|
+
* props: { type: 'text', value: 'John' }
|
|
1294
|
+
* };
|
|
1295
|
+
* ```
|
|
1296
|
+
*/
|
|
1297
|
+
interface IState {
|
|
1298
|
+
visibility: boolean;
|
|
1299
|
+
props: Record<string, unknown>;
|
|
1300
|
+
errors: Record<string, unknown>;
|
|
1301
|
+
}
|
|
1302
|
+
|
|
1303
|
+
/**
|
|
1304
|
+
* Custom RXJS Subject to gracefully handle errors on unsubscribed Subjects
|
|
1305
|
+
* that were unmounted due to adapter external handling such as visibility
|
|
1306
|
+
*/
|
|
1307
|
+
declare class SafeSubject<T> extends Subject<T> {
|
|
1308
|
+
private isMounted;
|
|
1309
|
+
constructor(isMounted: () => boolean);
|
|
1310
|
+
next(value: T): void;
|
|
1311
|
+
}
|
|
1312
|
+
|
|
1313
|
+
type TTemplateAvaliableScopes = (typeof TEMPLATE_AVALIABLE_SCOPES)[number];
|
|
1314
|
+
/**
|
|
1315
|
+
* @type TTemplateAvaliableScopesEnum
|
|
1316
|
+
* Represents the different types of events that can occur on form fields.
|
|
1317
|
+
* @property {never} fields - scope related to field content ex: '${fields.fieldName.value}'
|
|
1318
|
+
* @property {never} iVars - scope related to iVars content ex: '${iVars.test}'
|
|
1319
|
+
* @property {never} form - scope related to form content ex: '${form.valid}'
|
|
1320
|
+
*
|
|
1321
|
+
* @example
|
|
1322
|
+
* ```typescript
|
|
1323
|
+
* const scope: TTemplateAvaliableScopesEnum = 'fields';
|
|
1324
|
+
* ```
|
|
1325
|
+
* @interface
|
|
1326
|
+
*/
|
|
1327
|
+
type TTemplateAvaliableScopesEnum = Record<TTemplateAvaliableScopes, never>;
|
|
1328
|
+
/**
|
|
1329
|
+
* @type TSubscribedTemplates
|
|
1330
|
+
* Represents the subscribed templates for dynamic updates.
|
|
1331
|
+
*
|
|
1332
|
+
* @property {string} originExpression - The expression to evaluate.
|
|
1333
|
+
* @property {TTemplateAvaliableScopes[]} originScopeKeys - Origin scope of the updated template value
|
|
1334
|
+
* @property {string[]} originPropertyKeys - The properties of the origin fields.
|
|
1335
|
+
* @property {string[]} originFieldKeys - The keys of the origin fields.
|
|
1336
|
+
* @property {string} destinationKey - The key of the destination field.
|
|
1337
|
+
* @property {string} destinationProperty - The property of the destination field.
|
|
1338
|
+
* @property {string[]} destinationPath - The path to the destination property.
|
|
1339
|
+
*
|
|
1340
|
+
* @example
|
|
1341
|
+
* ```typescript
|
|
1342
|
+
* const subscribedTemplates: TSubscribedTemplates = {
|
|
1343
|
+
* originExpression: 'originField1 + originField2',
|
|
1344
|
+
* originScopeKeys: ['field','field'],
|
|
1345
|
+
* originPropertyKeys: ['value', 'props'],
|
|
1346
|
+
* originFieldKeys: ['originField1', 'originField2'],
|
|
1347
|
+
* destinationKey: 'resultField',
|
|
1348
|
+
* destinationProperty: 'value',
|
|
1349
|
+
* destinationPath: ['path', 'to', 'resultField']
|
|
1350
|
+
* };
|
|
1351
|
+
* ```
|
|
1352
|
+
*/
|
|
1353
|
+
type TSubscribedTemplates = {
|
|
1354
|
+
originExpression: string;
|
|
1355
|
+
originScopeKeys: TTemplateAvaliableScopes[];
|
|
1356
|
+
originPropertyKeys: string[];
|
|
1357
|
+
originFieldKeys: string[];
|
|
1358
|
+
destinationKey: string;
|
|
1359
|
+
destinationProperty: string;
|
|
1360
|
+
destinationPath: string[];
|
|
1361
|
+
};
|
|
1362
|
+
/**
|
|
1363
|
+
* @type TTemplateEvent
|
|
1364
|
+
* Represents the event occuring on templates that changes property values.
|
|
1365
|
+
*
|
|
1366
|
+
* @property {TTemplateAvaliableScopes} scope - template scope triggering the event.
|
|
1367
|
+
* @property {string} key - field triggering the template refresh
|
|
1368
|
+
* @property {TMutationEvents} event - template event triggering the template refresh.
|
|
1369
|
+
*/
|
|
1370
|
+
type TTemplateEvent = {
|
|
1371
|
+
scope: TTemplateAvaliableScopes;
|
|
1372
|
+
key?: string;
|
|
1373
|
+
event: TMutationEvents;
|
|
1374
|
+
};
|
|
1375
|
+
|
|
1376
|
+
/**
|
|
1377
|
+
* Represents a form field with observables for managing form state, validations, and API requests.
|
|
1378
|
+
*/
|
|
1379
|
+
declare class FormField {
|
|
1380
|
+
formIndex: string;
|
|
1381
|
+
name: string;
|
|
1382
|
+
nameToSubmit?: string;
|
|
1383
|
+
component: string;
|
|
1384
|
+
children?: string[];
|
|
1385
|
+
originalSchema: IComponentSchemaAsFormField<unknown>;
|
|
1386
|
+
validations?: TValidations;
|
|
1387
|
+
visibilityConditions?: TVisibility[];
|
|
1388
|
+
resetValues?: TResetValueMethods[];
|
|
1389
|
+
resetPropertyValues?: TResetPathMethods[];
|
|
1390
|
+
apiSchema?: TApiEvent;
|
|
1391
|
+
formatters?: TFormatters;
|
|
1392
|
+
masks?: TMasks;
|
|
1393
|
+
valuePropName?: string;
|
|
1394
|
+
config: Required<TSchemaFormConfig>;
|
|
1395
|
+
mapper: TMapper<unknown>;
|
|
1396
|
+
errorsString: string;
|
|
1397
|
+
errorsList: string[];
|
|
1398
|
+
private _props;
|
|
1399
|
+
private _adapterProps;
|
|
1400
|
+
private _value;
|
|
1401
|
+
private _stateValue;
|
|
1402
|
+
private _metadata;
|
|
1403
|
+
private _visibility;
|
|
1404
|
+
private _errors;
|
|
1405
|
+
private _api;
|
|
1406
|
+
private _valid;
|
|
1407
|
+
private _mounted;
|
|
1408
|
+
propsSubject$: SafeSubject<Record<string, unknown>>;
|
|
1409
|
+
errorSubject$: SafeSubject<Record<string, unknown>>;
|
|
1410
|
+
valueSubject$: SafeSubject<Record<string, unknown>>;
|
|
1411
|
+
valueSubscription$: Subscription;
|
|
1412
|
+
visibilitySubject$: SafeSubject<boolean>;
|
|
1413
|
+
fieldEventSubject$: Subject<TFieldEvent>;
|
|
1414
|
+
apiEventQueueSubject$: SafeSubject<{
|
|
1415
|
+
event: TEvents;
|
|
1416
|
+
}>;
|
|
1417
|
+
fieldStateSubscription$: Subscription;
|
|
1418
|
+
templateSubject$: Subject<TTemplateEvent>;
|
|
1419
|
+
dataSubject$: Subject<TFormDataPayload>;
|
|
1420
|
+
fieldValidNotification$: Subject<TFieldValidationPayload>;
|
|
1421
|
+
mountSubject$: Subject<{
|
|
1422
|
+
key: string;
|
|
1423
|
+
status: boolean;
|
|
1424
|
+
}>;
|
|
1425
|
+
validateVisibility: (payload: {
|
|
1426
|
+
event: TEvents;
|
|
1427
|
+
key: string;
|
|
1428
|
+
}) => void;
|
|
1429
|
+
resetValue: (payload: {
|
|
1430
|
+
event: TEvents;
|
|
1431
|
+
key: string;
|
|
1432
|
+
}) => void;
|
|
1433
|
+
resetProperty: (payload: {
|
|
1434
|
+
event: TEvents;
|
|
1435
|
+
key: string;
|
|
1436
|
+
}) => void;
|
|
1437
|
+
getFormValues: () => TFormValues<unknown>;
|
|
1438
|
+
valueChangeEvent: TValueChangeEvent;
|
|
1439
|
+
submitEvent: () => void;
|
|
1440
|
+
persistValue?: boolean;
|
|
1441
|
+
/**
|
|
1442
|
+
* Creates an instance of FormField.
|
|
1443
|
+
*
|
|
1444
|
+
* @param {object} options - Configuration options for the form field.
|
|
1445
|
+
* @param {IComponentSchema} options.schemaComponent - The schema definition for the form field.
|
|
1446
|
+
* @param {TSchemaFormConfig} options.config - The schema default configuration for debounced actions.
|
|
1447
|
+
* @param {string} [options.path] - The path within the form field (used internally during recursion).
|
|
1448
|
+
* @param {string[]} options.children - An array of children fields names.
|
|
1449
|
+
* @param {Function} options.validateVisibility - A function to validate the visibility of the field.
|
|
1450
|
+
* @param {Function} options.resetValue - A function to reset the field value.
|
|
1451
|
+
* @param {Function} options.resetProperty - A function to reset a field property.
|
|
1452
|
+
* @param {Subject<{ key: string }>} options.templateSubject$ - A subject for template updates.
|
|
1453
|
+
* @param {Subject<TFieldEvent>} options.fieldEventSubject$, - Subject for basic event mapped field emissions, except onData to form instance
|
|
1454
|
+
* @param {Subject<{ key: string; event: TEvents }>} options.dataSubject$, - Subject to emit onData events to form instance
|
|
1455
|
+
* @param {Subject<{ key: string }>} options.formValidNotification$, - Subject to emit field valid change to form instance
|
|
1456
|
+
* @param {TMapper<unknown>} options.mapper, - component generic mapper containing render parameters for adapters
|
|
1457
|
+
* @param {() => TFormValues<unknown>} options.getFormValues, - form instance function that builds onData parameter payload from fields
|
|
1458
|
+
*/
|
|
1459
|
+
constructor({ formIndex, schemaComponent, config, children, validateVisibility, resetValue, resetProperty, templateSubject$, fieldEventSubject$, dataSubject$, fieldValidNotification$, mountSubject$, mapper, getFormValues, submitEvent, visibility, persistValue, }: {
|
|
1460
|
+
formIndex: string;
|
|
1461
|
+
schemaComponent: IComponentSchema;
|
|
1462
|
+
config?: TSchemaFormConfig;
|
|
1463
|
+
path?: string;
|
|
1464
|
+
children?: string[];
|
|
1465
|
+
validateVisibility: (payload: {
|
|
1466
|
+
event: TEvents;
|
|
1467
|
+
key: string;
|
|
1468
|
+
}) => void;
|
|
1469
|
+
resetValue: (payload: {
|
|
1470
|
+
event: TEvents;
|
|
1471
|
+
key: string;
|
|
1472
|
+
}) => void;
|
|
1473
|
+
resetProperty: (payload: {
|
|
1474
|
+
event: TEvents;
|
|
1475
|
+
key: string;
|
|
1476
|
+
}) => void;
|
|
1477
|
+
submitEvent: () => void;
|
|
1478
|
+
templateSubject$: Subject<TTemplateEvent>;
|
|
1479
|
+
fieldEventSubject$: Subject<TFieldEvent>;
|
|
1480
|
+
dataSubject$: Subject<TFormDataPayload>;
|
|
1481
|
+
fieldValidNotification$: Subject<TFieldValidationPayload>;
|
|
1482
|
+
mountSubject$: Subject<{
|
|
1483
|
+
key: string;
|
|
1484
|
+
status: boolean;
|
|
1485
|
+
}>;
|
|
1486
|
+
mapper: TMapper<unknown>;
|
|
1487
|
+
getFormValues: () => TFormValues<unknown>;
|
|
1488
|
+
visibility?: boolean;
|
|
1489
|
+
persistValue?: boolean;
|
|
1490
|
+
});
|
|
1491
|
+
/**
|
|
1492
|
+
* method to initialize all recycled Subjects and initialize Observers on field instance creation or rerender
|
|
1493
|
+
* due to some visibility conditions unmounts the field from the adapter if they are children of it and avoid
|
|
1494
|
+
* emissions to unsubscribed fields
|
|
1495
|
+
*/
|
|
1496
|
+
initializeObservers(): void;
|
|
1497
|
+
/**
|
|
1498
|
+
* Retrieves the raw props sent from the adapter.
|
|
1499
|
+
*
|
|
1500
|
+
* @returns {string} - raw props from the adapter
|
|
1501
|
+
*/
|
|
1502
|
+
get adapterProps(): string;
|
|
1503
|
+
/**
|
|
1504
|
+
* compares adapter props changes and emits the change if they effectively changed
|
|
1505
|
+
* preventing an emission from the adapter of the same props that can overwrite other prop
|
|
1506
|
+
* changes via templating
|
|
1507
|
+
*/
|
|
1508
|
+
set adapterProps(props: Record<string, unknown>);
|
|
1509
|
+
/**
|
|
1510
|
+
* Retrieves the properties associated with the form field.
|
|
1511
|
+
*
|
|
1512
|
+
* @returns {Record<string, unknown>} - The properties of the form field.
|
|
1513
|
+
*/
|
|
1514
|
+
get props(): Record<string, unknown>;
|
|
1515
|
+
/**
|
|
1516
|
+
* Sets the properties of the form field and notifies subscribers about the change.
|
|
1517
|
+
*
|
|
1518
|
+
* @param {Record<string, unknown>} props - The new properties to be set.
|
|
1519
|
+
*/
|
|
1520
|
+
set props(props: Record<string, unknown>);
|
|
1521
|
+
/**
|
|
1522
|
+
* Static function to remove templates form the component props that will be shown when
|
|
1523
|
+
* the field mounts and the template routine executes, to be used on the adapter
|
|
1524
|
+
*
|
|
1525
|
+
* @param {unknown} props - the properties from the adapter components.
|
|
1526
|
+
*/
|
|
1527
|
+
static filterProps(props: unknown): unknown;
|
|
1528
|
+
/**
|
|
1529
|
+
* Retrieves the current state value of the form field.
|
|
1530
|
+
*
|
|
1531
|
+
* @returns {Record<string,unknown>} - The current state value of the form field.
|
|
1532
|
+
*/
|
|
1533
|
+
get stateValue(): Record<string, unknown>;
|
|
1534
|
+
get metadata(): unknown;
|
|
1535
|
+
/**
|
|
1536
|
+
* Retrieves the current value of the form field.
|
|
1537
|
+
*
|
|
1538
|
+
* @returns {unknown} - The current value of the form field.
|
|
1539
|
+
*/
|
|
1540
|
+
get value(): unknown;
|
|
1541
|
+
/**
|
|
1542
|
+
* Sets the value of the form field and notifies subscribers about the change.
|
|
1543
|
+
*
|
|
1544
|
+
* @param {unknown} value - The new value to be set.
|
|
1545
|
+
*/
|
|
1546
|
+
set value(value: unknown);
|
|
1547
|
+
/**
|
|
1548
|
+
* Retrieves the visibility status of the form field.
|
|
1549
|
+
*
|
|
1550
|
+
* @returns {boolean} - The visibility status of the form field.
|
|
1551
|
+
*/
|
|
1552
|
+
get visibility(): boolean;
|
|
1553
|
+
/**
|
|
1554
|
+
* Sets the visibility status of the form field and notifies subscribers about the change.
|
|
1555
|
+
*
|
|
1556
|
+
* @param {boolean} visible - The new visibility status to be set.
|
|
1557
|
+
*/
|
|
1558
|
+
set visibility(visible: boolean);
|
|
1559
|
+
/**
|
|
1560
|
+
* sets valid field state and notifies form instance via formValidNotification$
|
|
1561
|
+
*/
|
|
1562
|
+
set valid(valid: boolean);
|
|
1563
|
+
/**
|
|
1564
|
+
* Retrieves the validity status of the form field.
|
|
1565
|
+
*
|
|
1566
|
+
* @returns {boolean} - The validity status of the form field.
|
|
1567
|
+
*/
|
|
1568
|
+
get valid(): boolean;
|
|
1569
|
+
/**
|
|
1570
|
+
* triggers field valid notification to handle the form instance valid notification
|
|
1571
|
+
*
|
|
1572
|
+
* Note: since form unmount can occur before field unmount, this subject might already be closed by form instance
|
|
1573
|
+
* quick workaround is to check if the subject is already closed before emitting
|
|
1574
|
+
* if form instance onValid or template form.valid doesn't work properly, might be due to this workaround
|
|
1575
|
+
*/
|
|
1576
|
+
triggerFieldValidNotification(): void;
|
|
1577
|
+
/**
|
|
1578
|
+
* Retrieves the error messages associated with the form field.
|
|
1579
|
+
*
|
|
1580
|
+
* @returns {TErrorMessages} - The error messages associated with the form field.
|
|
1581
|
+
*/
|
|
1582
|
+
get errors(): TErrorMessages;
|
|
1583
|
+
/**
|
|
1584
|
+
* Sets the error messages associated with the form field and notifies subscribers about the change.
|
|
1585
|
+
*
|
|
1586
|
+
* @param {TErrorMessages} errors - The new error messages to be set.
|
|
1587
|
+
*/
|
|
1588
|
+
set errors(errors: TErrorMessages);
|
|
1589
|
+
/**
|
|
1590
|
+
* Retrieves the API response data associated with the form field.
|
|
1591
|
+
*
|
|
1592
|
+
* @returns {TApiResponse} - The API response data associated with the form field.
|
|
1593
|
+
*/
|
|
1594
|
+
get api(): TApiResponse;
|
|
1595
|
+
/**
|
|
1596
|
+
* Sets the API response data associated with the form field and notifies subscribers about the change.
|
|
1597
|
+
*
|
|
1598
|
+
* @param {TApiResponse} response - The new API response data to be set.
|
|
1599
|
+
*/
|
|
1600
|
+
set api(response: TApiResponse);
|
|
1601
|
+
/**
|
|
1602
|
+
* notifies templates and event binded field configurations that a request starts it's processing
|
|
1603
|
+
*/
|
|
1604
|
+
notifyApiRequest(): void;
|
|
1605
|
+
/** Retrieves the mounted status of the field.
|
|
1606
|
+
*
|
|
1607
|
+
* @returns {boolean} - the mounted status of the field.
|
|
1608
|
+
*/
|
|
1609
|
+
get mounted(): boolean;
|
|
1610
|
+
/**
|
|
1611
|
+
* sets the mountedStatus and notifies the form that the field was mounted on the adapter
|
|
1612
|
+
* and it's ready to be handled by the form instance
|
|
1613
|
+
*
|
|
1614
|
+
* @param {boolean} mountedStatus - the mounted status to be set from the mountField function.
|
|
1615
|
+
*/
|
|
1616
|
+
set mounted(mountedStatus: boolean);
|
|
1617
|
+
/**
|
|
1618
|
+
* Mounts the form field by initializing necessary subjects and combining their streams.
|
|
1619
|
+
*
|
|
1620
|
+
* @param {object} mountOpts - Adapter mount options.
|
|
1621
|
+
* @param {(value: unknown) => unknown} prop.valueSubscription - Adapter value change function
|
|
1622
|
+
* @param {(payload: Partial<IState>) => unknown} prop.propsSubscription - Adapter prop change function
|
|
1623
|
+
* @returns {void}
|
|
1624
|
+
*/
|
|
1625
|
+
mountField({ valueSubscription, propsSubscription, }: {
|
|
1626
|
+
valueSubscription: (value: Record<string, unknown>) => void;
|
|
1627
|
+
propsSubscription: (payload: Partial<IState>) => void;
|
|
1628
|
+
}): void;
|
|
1629
|
+
/**
|
|
1630
|
+
* Sets the value of the form field and emits associated events.
|
|
1631
|
+
*
|
|
1632
|
+
* @param {unknown} prop.value - The new value to be set.
|
|
1633
|
+
* @param {TEvents} prop.event - The event associated with setting the value.
|
|
1634
|
+
* @returns {void}
|
|
1635
|
+
*/
|
|
1636
|
+
emitValue(prop: {
|
|
1637
|
+
value: unknown;
|
|
1638
|
+
event: TEvents;
|
|
1639
|
+
}): void;
|
|
1640
|
+
/**
|
|
1641
|
+
* Emits events to trigger field-related actions such as validation, visibility checks, value resets, and API requests.
|
|
1642
|
+
*
|
|
1643
|
+
* @param {TEvents} event - The event type that triggers the field actions.
|
|
1644
|
+
* @returns {void}
|
|
1645
|
+
*/
|
|
1646
|
+
emitEvents({ event }: {
|
|
1647
|
+
event: TEvents;
|
|
1648
|
+
}): void;
|
|
1649
|
+
/**
|
|
1650
|
+
* Sets the validity state of the field based on the provided validation rules and triggers error message updates.
|
|
1651
|
+
*
|
|
1652
|
+
* @param {TEvents} event - The event type associated with the field action.
|
|
1653
|
+
* @returns {void}
|
|
1654
|
+
*/
|
|
1655
|
+
setFieldValidity({ event }: {
|
|
1656
|
+
event: TEvents;
|
|
1657
|
+
}): void;
|
|
1658
|
+
/**
|
|
1659
|
+
* Formats the field value using the specified formatters, if available.
|
|
1660
|
+
*
|
|
1661
|
+
* @param {unknown} value - The value to be formatted.
|
|
1662
|
+
* @returns {unknown} - The formatted value.
|
|
1663
|
+
*/
|
|
1664
|
+
formatValue(value: unknown): unknown;
|
|
1665
|
+
/**
|
|
1666
|
+
* Masks the field value using the specified masks, if available.
|
|
1667
|
+
*
|
|
1668
|
+
* @param {unknown} value - The value to be masked.
|
|
1669
|
+
* @returns {unknown} - The masked value.
|
|
1670
|
+
*/
|
|
1671
|
+
maskValue(value: unknown): unknown;
|
|
1672
|
+
checkApiRequestValidations(config: TApiConfig): boolean;
|
|
1673
|
+
/**
|
|
1674
|
+
* Makes an API request based on the field's API configuration and event type, updating the field's API response data.
|
|
1675
|
+
*
|
|
1676
|
+
* @param {TEvents} event - The event type associated with the API request.
|
|
1677
|
+
* @returns {Promise<void>}
|
|
1678
|
+
*/
|
|
1679
|
+
apiRequest({ event }: {
|
|
1680
|
+
event: TEvents;
|
|
1681
|
+
}): Promise<void>;
|
|
1682
|
+
/**
|
|
1683
|
+
* Unsubscribes from all subject subscriptions associated with the field, cleaning up resources.
|
|
1684
|
+
*
|
|
1685
|
+
* @returns {void}
|
|
1686
|
+
*/
|
|
1687
|
+
destroyField(): void;
|
|
1688
|
+
/**
|
|
1689
|
+
* Subscribes to changes in the field state and executes the provided callback function.
|
|
1690
|
+
*
|
|
1691
|
+
* @param {Function} callback - The callback function to be executed when the field state changes.
|
|
1692
|
+
* @returns {void}
|
|
1693
|
+
*/
|
|
1694
|
+
subscribeState(callback: (payload: Partial<IState>) => void): void;
|
|
1695
|
+
/**
|
|
1696
|
+
* Subscribes to changes in the field value and executes the provided callback function.
|
|
1697
|
+
*
|
|
1698
|
+
* @param {Function} callback - The callback function to be executed when the field value changes.
|
|
1699
|
+
* @returns {void}
|
|
1700
|
+
*/
|
|
1701
|
+
subscribeValue(callback: (value: unknown) => void): void;
|
|
1702
|
+
}
|
|
1703
|
+
type IFormField = FormField;
|
|
1704
|
+
|
|
1705
|
+
/**
|
|
1706
|
+
* Represents the core logic for managing a form, including field management, validation, and submission.
|
|
1707
|
+
*/
|
|
1708
|
+
declare class FormCore {
|
|
1709
|
+
index: string;
|
|
1710
|
+
schema?: IFormSchema;
|
|
1711
|
+
fields: Map<string, IFormField>;
|
|
1712
|
+
private _iVars;
|
|
1713
|
+
templateSubject$: Subject<TTemplateEvent>;
|
|
1714
|
+
templateSubscription$: Subscription;
|
|
1715
|
+
submitSubject$: Subject<TFormSubmitPayload<unknown>>;
|
|
1716
|
+
mountSubject$: Subject<{
|
|
1717
|
+
key: string;
|
|
1718
|
+
status: boolean;
|
|
1719
|
+
}>;
|
|
1720
|
+
fieldEventSubject$: Subject<TFieldEvent>;
|
|
1721
|
+
dataSubject$: Subject<TFormDataPayload>;
|
|
1722
|
+
formValidSubject$: Subject<TFormValidationPayload>;
|
|
1723
|
+
fieldValidNotification$: Subject<TFieldValidationPayload>;
|
|
1724
|
+
subscribedTemplates: TSubscribedTemplates[];
|
|
1725
|
+
action?: string;
|
|
1726
|
+
method?: string;
|
|
1727
|
+
config: Required<TSchemaFormConfig>;
|
|
1728
|
+
mappers: Map<string, TMapper<unknown>>;
|
|
1729
|
+
queuedFieldVisibilityEvents: Map<string, {
|
|
1730
|
+
hasError: boolean;
|
|
1731
|
+
showOnlyIfTrue?: boolean;
|
|
1732
|
+
}>;
|
|
1733
|
+
queuedFieldResetValuesEvents: Map<string, {
|
|
1734
|
+
value: unknown;
|
|
1735
|
+
}>;
|
|
1736
|
+
queuedFieldResetPropertyEvents: Map<string, {
|
|
1737
|
+
property: string;
|
|
1738
|
+
path: string;
|
|
1739
|
+
value: unknown;
|
|
1740
|
+
}>;
|
|
1741
|
+
queuedInitialValues: Map<string, unknown>;
|
|
1742
|
+
_valid: boolean;
|
|
1743
|
+
stopEventsOnSubmit: boolean;
|
|
1744
|
+
submitted: boolean;
|
|
1745
|
+
/**
|
|
1746
|
+
* Creates an instance of FormCore.
|
|
1747
|
+
*
|
|
1748
|
+
* @param {TFormEntry & Omit<IFormSchema, 'components'>} entry - Configuration options for the form.
|
|
1749
|
+
* @param {IFormSchema} entry.schema - The schema definition for the form.
|
|
1750
|
+
* @param {Record<string, unknown> | IFormSchema.initialValues} [entry.initialValues] - Initial values for the form fields.
|
|
1751
|
+
* @param {string} [entry.action] - The action attribute of the form.
|
|
1752
|
+
* @param {string} [entry.method] - The method attribute of the form.
|
|
1753
|
+
* @param {IFormSchema.iVars} [entry.iVars] - The internal variables of the form.
|
|
1754
|
+
* @param {((payload: {field: string;data: TFormValues;}) => void) | undefined} [entry.onData] - A callback function to handle data emission.
|
|
1755
|
+
*/
|
|
1756
|
+
constructor(entry: TFormEntry & Omit<IFormSchema, 'components'>);
|
|
1757
|
+
/**
|
|
1758
|
+
* mock function to simulate form mount onto the adapter
|
|
1759
|
+
*/
|
|
1760
|
+
generateFields(): void;
|
|
1761
|
+
/**
|
|
1762
|
+
*flag utility to prevent Subjects from emitting after form submission and stopEventsOnSubmit
|
|
1763
|
+
* @returns {boolean} - result of the flag utility.
|
|
1764
|
+
*/
|
|
1765
|
+
private submitChecker;
|
|
1766
|
+
/**
|
|
1767
|
+
* callback function passed to field instance to notify field adapter mount status
|
|
1768
|
+
* once the field has all field instance properties set, this function will handle all
|
|
1769
|
+
* field routines
|
|
1770
|
+
*
|
|
1771
|
+
* @param { string } entry.key field unique identifier
|
|
1772
|
+
* @param { boolean } entry.status mount status notified from field
|
|
1773
|
+
*/
|
|
1774
|
+
mountActions({ key, status }: {
|
|
1775
|
+
key: string;
|
|
1776
|
+
status: boolean;
|
|
1777
|
+
}): void;
|
|
1778
|
+
/**
|
|
1779
|
+
* initialValues setter to handle field values set externally from the adapter
|
|
1780
|
+
*
|
|
1781
|
+
* @param { Record<string, unknown> | undefined } payload initialValues to set onto fields
|
|
1782
|
+
*/
|
|
1783
|
+
set initialValues(payload: Record<string, unknown> | undefined);
|
|
1784
|
+
/**
|
|
1785
|
+
* Retrieves the internal variables (iVars) of the form.
|
|
1786
|
+
*
|
|
1787
|
+
* @returns {Record<string, unknown>} - The internal variables of the form.
|
|
1788
|
+
*/
|
|
1789
|
+
get iVars(): Record<string, unknown>;
|
|
1790
|
+
/**
|
|
1791
|
+
* Sets the internal variables (iVars) of the form and notifies subscribers about the change.
|
|
1792
|
+
*
|
|
1793
|
+
* @param {Record<string, unknown>} payload - The new internal variables to be set.
|
|
1794
|
+
*/
|
|
1795
|
+
set iVars(payload: Record<string, unknown>);
|
|
1796
|
+
/**
|
|
1797
|
+
* Validates all form fields and sets the form valid flag
|
|
1798
|
+
*
|
|
1799
|
+
*/
|
|
1800
|
+
validateForm(): boolean;
|
|
1801
|
+
get valid(): boolean;
|
|
1802
|
+
set valid(valid: boolean);
|
|
1803
|
+
/**
|
|
1804
|
+
* Subscribes to templates for dynamic updates.
|
|
1805
|
+
*/
|
|
1806
|
+
subscribeTemplates(): void;
|
|
1807
|
+
/**
|
|
1808
|
+
* Gets the value of a property from a field.
|
|
1809
|
+
*
|
|
1810
|
+
* @param {object} options - Options for getting the value.
|
|
1811
|
+
* @param {string} options.key - The key of the field.
|
|
1812
|
+
* @param {string} options.property - The property to retrieve.
|
|
1813
|
+
* @param {string[]} options.path - The path to the property if it's nested.
|
|
1814
|
+
* @returns {unknown | undefined} The value of the property, or undefined if the field doesn't exist.
|
|
1815
|
+
*/
|
|
1816
|
+
getValue({ scope, key, property, path, }: {
|
|
1817
|
+
scope: TTemplateAvaliableScopes;
|
|
1818
|
+
key: string;
|
|
1819
|
+
property: string;
|
|
1820
|
+
path: string[];
|
|
1821
|
+
}): unknown | undefined;
|
|
1822
|
+
/**
|
|
1823
|
+
* Sets the value of a property in a field.
|
|
1824
|
+
*
|
|
1825
|
+
* @param {object} options - Options for setting the value.
|
|
1826
|
+
* @param {string} options.key - The key of the field.
|
|
1827
|
+
* @param {string} options.property - The property to set.
|
|
1828
|
+
* @param {string[]} options.path - The path to the property if it's nested.
|
|
1829
|
+
* @param {unknown} options.originKey - field that called templating
|
|
1830
|
+
* @param {unknown} options.value - The value to set.
|
|
1831
|
+
* @param {TMutationEvents} options.event - Internal Event for template Handling.
|
|
1832
|
+
*/
|
|
1833
|
+
setValue({ key, property, path, originKey, value, }: {
|
|
1834
|
+
key: string;
|
|
1835
|
+
property: string;
|
|
1836
|
+
path: string[];
|
|
1837
|
+
originKey?: string;
|
|
1838
|
+
value: unknown;
|
|
1839
|
+
event: TMutationEvents;
|
|
1840
|
+
}): void;
|
|
1841
|
+
/**
|
|
1842
|
+
* Extracts parameters from an expression.
|
|
1843
|
+
*
|
|
1844
|
+
* @param {string} expression - The expression containing parameters.
|
|
1845
|
+
* @returns {string[]} An array of extracted parameters.
|
|
1846
|
+
*/
|
|
1847
|
+
extractParams(expression: string): unknown[];
|
|
1848
|
+
/**
|
|
1849
|
+
* Replaces expressions marked by ${...} in the expression string with the provided values.
|
|
1850
|
+
*
|
|
1851
|
+
* @param {string} expression - The expression string containing the marked expressions.
|
|
1852
|
+
* @param {string[]} values - The values to be inserted into the marked expressions.
|
|
1853
|
+
* @returns {string} The expression string with the replacements made.
|
|
1854
|
+
*/
|
|
1855
|
+
replaceExpression(expression: string, values: unknown[]): string;
|
|
1856
|
+
/**
|
|
1857
|
+
* Checks if an expression string contains string concatenation within a marked expression.
|
|
1858
|
+
*
|
|
1859
|
+
* @param {string} expression - The expression string to be checked.
|
|
1860
|
+
* @returns {boolean} True if the expression contains string concatenation, otherwise false.
|
|
1861
|
+
*/
|
|
1862
|
+
hasStringConcatenation(expression: string): boolean;
|
|
1863
|
+
/**
|
|
1864
|
+
* Refreshes templates with updated values.
|
|
1865
|
+
*
|
|
1866
|
+
* @param {object} options - Options for refreshing templates.
|
|
1867
|
+
* @param {string} options.key - The key of the field triggering the update.
|
|
1868
|
+
* @param {TMutationEvents} options.event - Internal event descriptor to handle templating.
|
|
1869
|
+
*/
|
|
1870
|
+
refreshTemplates({ key, event }: TTemplateEvent): void;
|
|
1871
|
+
/**
|
|
1872
|
+
* executes events that were stored due to field unavaliability
|
|
1873
|
+
*
|
|
1874
|
+
* @param {string} field field to check
|
|
1875
|
+
*/
|
|
1876
|
+
checkFieldEventQueues(field: string): void;
|
|
1877
|
+
/**
|
|
1878
|
+
* Validates and collects the names of form fields in the provided schema structure.
|
|
1879
|
+
*
|
|
1880
|
+
* @param {IComponentSchema[]} [struct] - The schema structure of the form components.
|
|
1881
|
+
* @param {string[]} [indexes=[]] - An array to collect the names of the form fields.
|
|
1882
|
+
* @returns {string[]} - An array of form field names.
|
|
1883
|
+
* @throws {Error} - Throws an error if a field name matches the reserved name defined by `IVARPROPNAME`.
|
|
1884
|
+
* @private
|
|
1885
|
+
*/
|
|
1886
|
+
private static checkIndexes;
|
|
1887
|
+
/**
|
|
1888
|
+
* @internal
|
|
1889
|
+
* Update field visibility accordingly.
|
|
1890
|
+
*
|
|
1891
|
+
* @param {object} options - options to set field visibility
|
|
1892
|
+
* @param {string} options.field - Field name to be updated.
|
|
1893
|
+
* @param {boolean} options.hasError - Condition to be used as visibility.
|
|
1894
|
+
* @param {boolean|undefined} options.showOnlyIfTrue - Flag to be considered when update field visibility. If it's true, then considered error, if it's false, always considered the opposite.
|
|
1895
|
+
*/
|
|
1896
|
+
private setFieldVisibility;
|
|
1897
|
+
/**
|
|
1898
|
+
* Validates visibility conditions for a given event and updates field visibility accordingly.
|
|
1899
|
+
*
|
|
1900
|
+
* @param {object} options - Options for validating visibility.
|
|
1901
|
+
* @param {TEvents} options.event - The event triggering visibility validation.
|
|
1902
|
+
* @param {string} options.key - The key of the field.
|
|
1903
|
+
*/
|
|
1904
|
+
validateVisibility({ event, key }: {
|
|
1905
|
+
event: TEvents;
|
|
1906
|
+
key: string;
|
|
1907
|
+
}): void;
|
|
1908
|
+
/**
|
|
1909
|
+
* @internal
|
|
1910
|
+
* Update field value and emit change and cleared event.
|
|
1911
|
+
*
|
|
1912
|
+
* @param {options} options to reset the field value
|
|
1913
|
+
* @param {string} options.key - Field name to be updated.
|
|
1914
|
+
* @param {unknown} options.value - Value to be inserted into field.
|
|
1915
|
+
*/
|
|
1916
|
+
private setResetFieldValue;
|
|
1917
|
+
/**
|
|
1918
|
+
* Resets field values based on reset conditions defined in the schema.
|
|
1919
|
+
*
|
|
1920
|
+
* @param {object} options - Options for resetting field values.
|
|
1921
|
+
* @param {TEvents} options.event - The event triggering the reset.
|
|
1922
|
+
* @param {string} options.key - The key of the field.
|
|
1923
|
+
*/
|
|
1924
|
+
resetValue({ event, key }: {
|
|
1925
|
+
event: TEvents;
|
|
1926
|
+
key: string;
|
|
1927
|
+
}): void;
|
|
1928
|
+
/**
|
|
1929
|
+
* @internal
|
|
1930
|
+
* Update field property and emit template change.
|
|
1931
|
+
*
|
|
1932
|
+
* @param {object} options - Options for resetting field property
|
|
1933
|
+
* @param {string} options.key - Field name to be updated.
|
|
1934
|
+
* @param {string} options.property - field property to change.
|
|
1935
|
+
* @param {string} options.path - field property path to change.
|
|
1936
|
+
* @param {unknown} options.value - Value to be inserted into field.
|
|
1937
|
+
*/
|
|
1938
|
+
private setResetPathValue;
|
|
1939
|
+
/**
|
|
1940
|
+
* Resets field properties based on reset conditions defined in the schema.
|
|
1941
|
+
*
|
|
1942
|
+
* @param {object} options - Options for resetting field property.
|
|
1943
|
+
* @param {TEvents} options.event - The event triggering the reset.
|
|
1944
|
+
* @param {string} options.key - The key of the field.
|
|
1945
|
+
*/
|
|
1946
|
+
resetProperty({ event, key }: {
|
|
1947
|
+
event: TEvents;
|
|
1948
|
+
key: string;
|
|
1949
|
+
}): void;
|
|
1950
|
+
/**
|
|
1951
|
+
* Adds a field onto the form instance regardless there is a schema or not
|
|
1952
|
+
*
|
|
1953
|
+
* @param fieldSchema
|
|
1954
|
+
* @param mapperElement
|
|
1955
|
+
*/
|
|
1956
|
+
addField({ fieldSchema, mapperElement, path, }: {
|
|
1957
|
+
fieldSchema: IComponentSchema;
|
|
1958
|
+
mapperElement?: TMapper<unknown>;
|
|
1959
|
+
path?: string;
|
|
1960
|
+
}): void;
|
|
1961
|
+
/**
|
|
1962
|
+
* function to be called from the adapter to remove a field when a field is removed from it
|
|
1963
|
+
*
|
|
1964
|
+
* @param {{ key: string }} entry.key
|
|
1965
|
+
*/
|
|
1966
|
+
removeField({ key }: {
|
|
1967
|
+
key: string;
|
|
1968
|
+
}): void;
|
|
1969
|
+
/**
|
|
1970
|
+
* Serializes the schema structure to create form fields.
|
|
1971
|
+
*
|
|
1972
|
+
* @param {IComponentSchema[]} [struct] - The schema structure to serialize.
|
|
1973
|
+
* @param {string} [path] - The path of the parent component.
|
|
1974
|
+
*/
|
|
1975
|
+
serializeStructure(struct?: IComponentSchemaAsFormField<unknown>[], path?: string): void;
|
|
1976
|
+
/**
|
|
1977
|
+
* Refreshes form fields based on changes in the schema structure.
|
|
1978
|
+
*
|
|
1979
|
+
* @param {IComponentSchema[]} struct - The updated schema structure.
|
|
1980
|
+
*/
|
|
1981
|
+
refreshFields(struct: IComponentSchemaAsFormField<unknown>[]): void;
|
|
1982
|
+
/**
|
|
1983
|
+
* Gets a form field by its key.
|
|
1984
|
+
*
|
|
1985
|
+
* @param {object} options - Options for getting the form field.
|
|
1986
|
+
* @param {string} options.key - The key of the form field.
|
|
1987
|
+
* @returns {IFormField | undefined} The form field, or undefined if not found.
|
|
1988
|
+
*/
|
|
1989
|
+
getField({ key }: {
|
|
1990
|
+
key: string;
|
|
1991
|
+
}): IFormField | undefined;
|
|
1992
|
+
/**
|
|
1993
|
+
* Prints the current values of all form fields.
|
|
1994
|
+
*/
|
|
1995
|
+
printValues(): void;
|
|
1996
|
+
/**
|
|
1997
|
+
* Gets the current values of all form fields.
|
|
1998
|
+
*
|
|
1999
|
+
* @returns {TFormValues} The current form values.
|
|
2000
|
+
*/
|
|
2001
|
+
getFormValues<T>(): TFormValues<T>;
|
|
2002
|
+
/**
|
|
2003
|
+
* function to be called to events sent from the adapter
|
|
2004
|
+
*
|
|
2005
|
+
* @param {{callback: (payload: TFieldEvent) => void}} entry.callback callback function from the adapter
|
|
2006
|
+
* @returns
|
|
2007
|
+
*/
|
|
2008
|
+
subscribeFieldEvent({ callback, }: {
|
|
2009
|
+
callback: (payload: TFieldEvent) => void;
|
|
2010
|
+
}): Subscription;
|
|
2011
|
+
/**
|
|
2012
|
+
* to be called from the adapter when the form mounts
|
|
2013
|
+
*
|
|
2014
|
+
* @param {(payload: TFormValues<T>) => void} callback
|
|
2015
|
+
* @returns Subscription
|
|
2016
|
+
*/
|
|
2017
|
+
subscribeOnMount<T>(callback: (payload: TFormValues<T>) => void): Subscription;
|
|
2018
|
+
/**
|
|
2019
|
+
*
|
|
2020
|
+
* @param {(payload: { field: string; data: TFormValues }) => void} callback callback function to call onData
|
|
2021
|
+
*/
|
|
2022
|
+
subscribeData<T>(callback: (payload: {
|
|
2023
|
+
field: string;
|
|
2024
|
+
data: TFormValues<T>;
|
|
2025
|
+
}) => void): Subscription;
|
|
2026
|
+
/**
|
|
2027
|
+
* method to register a callback function to be called when the form is valid
|
|
2028
|
+
*
|
|
2029
|
+
* @param {(payload: TFormValues<T>) => void} callback callback function to call when the submit action occurs
|
|
2030
|
+
*/
|
|
2031
|
+
subscribeOnSubmit<T>(callback: (payload: TFormValues<T>) => void): Subscription;
|
|
2032
|
+
/**
|
|
2033
|
+
* method to check whenever the validity status of the form changes, only emits on status change
|
|
2034
|
+
*
|
|
2035
|
+
* @param {(payload: TFormValidationPayload) => void} callback callback function to call onValid
|
|
2036
|
+
*/
|
|
2037
|
+
subscribeFormValidation(callback: (payload: TFormValidationPayload) => void): Subscription;
|
|
2038
|
+
/**
|
|
2039
|
+
* Submits the form by triggering form field events and invoking the onSubmit callback.
|
|
2040
|
+
*/
|
|
2041
|
+
submit<T>(): void;
|
|
2042
|
+
/**
|
|
2043
|
+
* recycles all the Suscriptions, to be called from the adapter when the form leaves the page
|
|
2044
|
+
*/
|
|
2045
|
+
destroy(): void;
|
|
2046
|
+
}
|
|
2047
|
+
type TFormCore = FormCore;
|
|
2048
|
+
|
|
2049
|
+
/**
|
|
2050
|
+
* Represents a group that manages multiple forms.
|
|
2051
|
+
*/
|
|
2052
|
+
declare class FormGroup<ComponentElementType> {
|
|
2053
|
+
forms: Map<string, TFormCore>;
|
|
2054
|
+
config: Required<TSchemaFormConfig>;
|
|
2055
|
+
dataSubject$: Subject<TFormDataPayload>;
|
|
2056
|
+
formValidSubject$: Subject<TFormValidationPayload>;
|
|
2057
|
+
submitSubject$: Subject<TFormSubmitPayload<unknown>>;
|
|
2058
|
+
mappers?: TMapper<ComponentElementType>[];
|
|
2059
|
+
/**
|
|
2060
|
+
* Creates an instance of FormGroup.
|
|
2061
|
+
*/
|
|
2062
|
+
constructor(entry?: {
|
|
2063
|
+
mappers?: TMapper<ComponentElementType>[];
|
|
2064
|
+
config?: TSchemaFormConfig;
|
|
2065
|
+
});
|
|
2066
|
+
/**
|
|
2067
|
+
* Creates an empty form with given index
|
|
2068
|
+
*
|
|
2069
|
+
* @param {string} options.index
|
|
2070
|
+
* @param {TMapper<unknown>} options.mappers
|
|
2071
|
+
*/
|
|
2072
|
+
createFormWithIndex({ index, mappers, }: {
|
|
2073
|
+
index: string;
|
|
2074
|
+
mappers?: TMapper<unknown>[];
|
|
2075
|
+
}): void;
|
|
2076
|
+
/**
|
|
2077
|
+
* Adds a form instance to the form group.
|
|
2078
|
+
*
|
|
2079
|
+
* @param {object} options - Options for adding a form.
|
|
2080
|
+
* @param {string} options.key - The key associated with the form instance.
|
|
2081
|
+
* @param {TFormCore} options.formInstance - The instance of the form to add.
|
|
2082
|
+
*/
|
|
2083
|
+
addForm({ key, params }: {
|
|
2084
|
+
key: string;
|
|
2085
|
+
params: TFormEntry;
|
|
2086
|
+
}): void;
|
|
2087
|
+
/**
|
|
2088
|
+
* Retrieves a form instance from the form group.
|
|
2089
|
+
*
|
|
2090
|
+
* @param {object} options - Options for retrieving a form.
|
|
2091
|
+
* @param {string} options.key - The key associated with the form instance.
|
|
2092
|
+
* @returns {TFormCore | undefined} The instance of the form, if found; otherwise, undefined.
|
|
2093
|
+
*/
|
|
2094
|
+
getForm({ key }: {
|
|
2095
|
+
key: string;
|
|
2096
|
+
}): TFormCore | undefined;
|
|
2097
|
+
/**
|
|
2098
|
+
* Removes a form instance from the form group.
|
|
2099
|
+
*
|
|
2100
|
+
* @param {object} options - Options for removing a form.
|
|
2101
|
+
* @param {string} options.key - The key associated with the form instance to remove.
|
|
2102
|
+
*/
|
|
2103
|
+
removeForm({ key }: {
|
|
2104
|
+
key: string;
|
|
2105
|
+
}): void;
|
|
2106
|
+
/**
|
|
2107
|
+
* removes a field given a form and field index
|
|
2108
|
+
*
|
|
2109
|
+
* @param {string} options.formIndex
|
|
2110
|
+
* @param {string} options.fieldIndex
|
|
2111
|
+
*/
|
|
2112
|
+
removeField({ formIndex, fieldIndex, }: {
|
|
2113
|
+
formIndex: string;
|
|
2114
|
+
fieldIndex: string;
|
|
2115
|
+
}): void;
|
|
2116
|
+
/**
|
|
2117
|
+
* Checks if the specified key already exists in the form group.
|
|
2118
|
+
*
|
|
2119
|
+
* @param {object} options - Options for checking the key.
|
|
2120
|
+
* @param {string} options.key - The key to check.
|
|
2121
|
+
* @throws {Error} Throws an error if the key already exists in the form group.
|
|
2122
|
+
*/
|
|
2123
|
+
checkIndexes({ key }: {
|
|
2124
|
+
key: string;
|
|
2125
|
+
}): void;
|
|
2126
|
+
/**
|
|
2127
|
+
* Prints the form group instance to the console.
|
|
2128
|
+
*/
|
|
2129
|
+
printFormGroupInstance(): void;
|
|
2130
|
+
/**
|
|
2131
|
+
* Prototype submit function to multiple forms
|
|
2132
|
+
* @param {string[]} indexes form indexes to be submitted
|
|
2133
|
+
* @param callback
|
|
2134
|
+
* @returns
|
|
2135
|
+
*/
|
|
2136
|
+
submitMultipleFormsByIndex<T>(indexes: string[], callback?: (payload: TFormValues<T>) => void): void;
|
|
2137
|
+
onDataSubscription<T>({ ids, callback, }: {
|
|
2138
|
+
ids: string[];
|
|
2139
|
+
callback: (payload: TFormGroupOnDataEventPayload<T>) => void;
|
|
2140
|
+
}): rxjs.Subscription;
|
|
2141
|
+
onValidSubscription({ ids, callback, }: {
|
|
2142
|
+
ids: string[];
|
|
2143
|
+
callback: (payload: TFormGroupOnValidEventPayload) => void;
|
|
2144
|
+
}): rxjs.Subscription;
|
|
2145
|
+
onSubmitSubscription<T>({ ids, callback, }: {
|
|
2146
|
+
ids: string[];
|
|
2147
|
+
callback: (payload: TFormGroupOnSubmitEventPayload<T>) => void;
|
|
2148
|
+
}): rxjs.Subscription;
|
|
2149
|
+
destroy: () => void;
|
|
2150
|
+
}
|
|
2151
|
+
type TFormGroup<T> = FormGroup<T>;
|
|
2152
|
+
|
|
2153
|
+
/**
|
|
2154
|
+
* @type TEventEnum
|
|
2155
|
+
* Represents the different types of events that can occur on form fields.
|
|
2156
|
+
* @property {never} ON_FIELD_MOUNT - when field mounts on page
|
|
2157
|
+
* @property {never} ON_FIELD_UNMOUNT - when field unmounts on page (also triggered when form is unmounted from page)
|
|
2158
|
+
* @property {never} ON_FIELD_CHANGE - when field changes value by user inout
|
|
2159
|
+
* @property {never} ON_FIELD_BLUR - when field is blurred
|
|
2160
|
+
* @property {never} ON_FIELD_FOCUS - when field is focused
|
|
2161
|
+
* @property {never} ON_FIELD_CLICK - when field is clicked
|
|
2162
|
+
* @property {never} ON_FIELD_KEYUP - when the pressing key button on field is lifted up
|
|
2163
|
+
* @property {never} ON_FIELD_KEYDOWN - when a key button on field is pressed down
|
|
2164
|
+
* @property {never} ON_FIELD_CLEARED - when a field was changed with a resetValues rule
|
|
2165
|
+
* @property {never} ON_FORM_SUBMIT - when the form is submitted (only type="submit" buttons)
|
|
2166
|
+
* @property {never} ON_FIELD_VALIDATION - when a field is validaded by a validation rule
|
|
2167
|
+
* @property {never} ON_FORM_MOUNT - emitted when the form mounts
|
|
2168
|
+
* @property {never} ON_API_FIELD_REQUEST - emitted when an api request from schema is called
|
|
2169
|
+
* @property {never} ON_API_FIELD_RESPONSE - emitted when an api response from schema is received
|
|
2170
|
+
*
|
|
2171
|
+
* @example
|
|
2172
|
+
* ```typescript
|
|
2173
|
+
* const event: TEvents = 'ON_FIELD_CHANGE';
|
|
2174
|
+
* ```
|
|
2175
|
+
*/
|
|
2176
|
+
type TEventEnum = {
|
|
2177
|
+
ON_FIELD_MOUNT: never;
|
|
2178
|
+
ON_FIELD_UNMOUNT: never;
|
|
2179
|
+
ON_FIELD_CHANGE: never;
|
|
2180
|
+
ON_FIELD_BLUR: never;
|
|
2181
|
+
ON_FIELD_FOCUS: never;
|
|
2182
|
+
ON_FIELD_CLICK: never;
|
|
2183
|
+
ON_FIELD_KEYUP: never;
|
|
2184
|
+
ON_FIELD_KEYDOWN: never;
|
|
2185
|
+
ON_FIELD_CLEARED: never;
|
|
2186
|
+
ON_FORM_SUBMIT: never;
|
|
2187
|
+
ON_FIELD_VALIDATION: never;
|
|
2188
|
+
ON_FORM_MOUNT: never;
|
|
2189
|
+
ON_API_FIELD_REQUEST: never;
|
|
2190
|
+
ON_API_FIELD_RESPONSE: never;
|
|
2191
|
+
};
|
|
2192
|
+
type TEvents = keyof TEventEnum;
|
|
2193
|
+
/**
|
|
2194
|
+
* Represents the possible event properties for form fields callbacks.
|
|
2195
|
+
* * Represents a mapping of event properties to their corresponding callback functions.
|
|
2196
|
+
* @property {string} onChange - trigger bind component change event
|
|
2197
|
+
* @property {string} onBlur - trigger bind component blur event
|
|
2198
|
+
* @property {string} onFocus - trigger bind component focus event
|
|
2199
|
+
* @property {string} onKeyDown - trigger bind component keydown event
|
|
2200
|
+
* @property {string} onKeyUp - trigger bind component keyup event
|
|
2201
|
+
* @property {string} onMount - triggered on field mount
|
|
2202
|
+
* @property {string} onApiResponse - triggered when schema api call is completed
|
|
2203
|
+
* @property {string} onApiRequest - triggered when schema api call starts
|
|
2204
|
+
* @property {string} onClick - trigger bind component keyup event
|
|
2205
|
+
* @property {string} onCleared - triggered when a resetValue rule apply on the target field
|
|
2206
|
+
* @property {string} onUnmount - triggered when a field unmounts
|
|
2207
|
+
*/
|
|
2208
|
+
type TEventPropsEnum = {
|
|
2209
|
+
onChange: never;
|
|
2210
|
+
onBlur: never;
|
|
2211
|
+
onFocus: never;
|
|
2212
|
+
onKeyDown: never;
|
|
2213
|
+
onKeyUp: never;
|
|
2214
|
+
onMount: never;
|
|
2215
|
+
onApiResponse: never;
|
|
2216
|
+
onApiRequest: never;
|
|
2217
|
+
onClick: never;
|
|
2218
|
+
onCleared: never;
|
|
2219
|
+
onUnmount: never;
|
|
2220
|
+
};
|
|
2221
|
+
type TEventProps = keyof TEventPropsEnum;
|
|
2222
|
+
type TEventDataPropsEnum = {
|
|
2223
|
+
onFormMount: never;
|
|
2224
|
+
onData: never;
|
|
2225
|
+
onSubmit: never;
|
|
2226
|
+
onValid: never;
|
|
2227
|
+
};
|
|
2228
|
+
type TEventDataProps = keyof TEventDataPropsEnum;
|
|
2229
|
+
/**
|
|
2230
|
+
* @type TMutationEvents
|
|
2231
|
+
* Represents the different types of events that can occur internally that triggers templating.
|
|
2232
|
+
*
|
|
2233
|
+
* @example
|
|
2234
|
+
* ```typescript
|
|
2235
|
+
* const event: TMutationEvents = 'ON_VALUE';
|
|
2236
|
+
* ```
|
|
2237
|
+
*/
|
|
2238
|
+
type TMutationEvents = 'ON_VALUE' | 'ON_PROPS' | 'ON_VISIBILITY' | 'ON_API_REQUEST' | 'ON_API_RESPONSE' | 'ON_IVARS' | 'ON_FIELDS' | 'ON_RESET' | 'ON_FORM';
|
|
2239
|
+
declare enum TMutationEnum {
|
|
2240
|
+
ON_VALUE = "value",
|
|
2241
|
+
ON_PROPS = "props",
|
|
2242
|
+
ON_VISIBILITY = "visibility",
|
|
2243
|
+
ON_API = "api",
|
|
2244
|
+
ON_IVARS = "iVars",
|
|
2245
|
+
ON_FIELDS = "fields"
|
|
2246
|
+
}
|
|
2247
|
+
/**
|
|
2248
|
+
* @type TValueChangeEvent
|
|
2249
|
+
* Represents the custom change handle function to perform value changes.
|
|
2250
|
+
*
|
|
2251
|
+
* @example
|
|
2252
|
+
* ```typescript
|
|
2253
|
+
* handleChangeEvent (value, opts) {
|
|
2254
|
+
* return value
|
|
2255
|
+
* }
|
|
2256
|
+
* ```
|
|
2257
|
+
*/
|
|
2258
|
+
type TValueChangeEvent = (value: unknown, opts?: {
|
|
2259
|
+
props: Record<string, unknown>;
|
|
2260
|
+
}) => void;
|
|
2261
|
+
/**
|
|
2262
|
+
* @type TFieldEvent
|
|
2263
|
+
* Event emitted on all basic form events, except onData
|
|
2264
|
+
*/
|
|
2265
|
+
type TFieldEvent = {
|
|
2266
|
+
event: TEvents;
|
|
2267
|
+
fieldName: string;
|
|
2268
|
+
fieldInstance?: IFormField;
|
|
2269
|
+
};
|
|
2270
|
+
/**
|
|
2271
|
+
* @type TFormDataPayload
|
|
2272
|
+
* Event emitted to formGroup instance to capture onData form events
|
|
2273
|
+
*/
|
|
2274
|
+
type TFormDataPayload = {
|
|
2275
|
+
formIndex: string;
|
|
2276
|
+
fieldIndex: string;
|
|
2277
|
+
event: TEvents;
|
|
2278
|
+
};
|
|
2279
|
+
/**
|
|
2280
|
+
* @type TFormSubmitPayload
|
|
2281
|
+
* Event emitted to formGroup instance to capture onSubmit form events
|
|
2282
|
+
*/
|
|
2283
|
+
type TFormSubmitPayload<T> = {
|
|
2284
|
+
formIndex: string;
|
|
2285
|
+
values: TFormValues<T>;
|
|
2286
|
+
};
|
|
2287
|
+
/**
|
|
2288
|
+
* @type TFormValidationPayload
|
|
2289
|
+
* Form onValid event emmited payload on callback function parameter
|
|
2290
|
+
*/
|
|
2291
|
+
type TFormValidationPayload = {
|
|
2292
|
+
formIndex: string;
|
|
2293
|
+
valid: boolean;
|
|
2294
|
+
};
|
|
2295
|
+
/**
|
|
2296
|
+
* @type TFieldValidationPayload
|
|
2297
|
+
* field event emmited payload on field validation
|
|
2298
|
+
*/
|
|
2299
|
+
type TFieldValidationPayload = {
|
|
2300
|
+
fieldTrigger: string;
|
|
2301
|
+
};
|
|
2302
|
+
type TFormDataValues<T> = {
|
|
2303
|
+
formId: string;
|
|
2304
|
+
formField: string;
|
|
2305
|
+
values?: TFormValues<T>;
|
|
2306
|
+
};
|
|
2307
|
+
/**
|
|
2308
|
+
* @type TFormGroupOnDataEventPayload
|
|
2309
|
+
* Form Group onData event emitted payload on callback function parameter
|
|
2310
|
+
*/
|
|
2311
|
+
type TFormGroupOnDataEventPayload<T> = Record<string, TFormDataValues<T>>;
|
|
2312
|
+
/**
|
|
2313
|
+
* @type TFormGroupOnValidEventPayload
|
|
2314
|
+
* Form Group onValid event emitted payload on callback function parameter
|
|
2315
|
+
*/
|
|
2316
|
+
type TFormGroupOnValidEventPayload = {
|
|
2317
|
+
groupValid: boolean;
|
|
2318
|
+
forms: Record<string, boolean>;
|
|
2319
|
+
};
|
|
2320
|
+
/**
|
|
2321
|
+
* @type TFormGroupOnSubmitEventPayload
|
|
2322
|
+
* Form Group onSubmit event emitted payload on callback function parameter
|
|
2323
|
+
*/
|
|
2324
|
+
type TFormGroupOnSubmitEventPayload<T> = Record<string, TFormValues<T> | undefined>;
|
|
2325
|
+
|
|
2326
|
+
export { FormCore, FormField, FormGroup, TMutationEnum };
|
|
2327
|
+
export type { AllowOnly, IComponentSchema, IComponentSchemaAsFormField, IFormField, IFormSchema, IState, OneOf, TAllowedResetPropsMutationsEnum, TApiConfig, TApiEvent, TApiResponse, TApiResponsePayload, TAvailableValidations, TBetweenDatesValidation, TBetweenValidation, TCallbackValidation, TComponentPropsMapping, TConditionsValidation, TConditionsValidationSet, TCreditCardMatch, TCurrencyMask, TDateFormatsValidation, TDateInterval, TDateOperatorsValidation, TDateValidation, TDocumentValidation, TErrorMessages, TEvent, TEventDataProps, TEventDataPropsEnum, TEventEnum, TEventMessages, TEventMessagesValidationMethods, TEventProps, TEventPropsEnum, TEvents, TFieldEvent, TFieldValidationPayload, TFormCore, TFormDataPayload, TFormDataValues, TFormEntry, TFormGroup, TFormGroupOnDataEventPayload, TFormGroupOnSubmitEventPayload, TFormGroupOnValidEventPayload, TFormSubmitPayload, TFormValidationPayload, TFormValues, TFormatters, TGenericValidationRule, TLengthValidation, TMapper, TMaskGeneric, TMasks, TMultipleValidation, TMutationEvents, TProps, TResetPathMethods, TResetValueMethods, TSchemaFormConfig, TSchemaValidation, TSplitterFormatterValue, TSubscribedTemplates, TTemplateAvaliableScopes, TTemplateAvaliableScopesEnum, TTemplateEvent, TValidationHandler, TValidationMethods, TValidations, TValueChangeEvent, TVisibility };
|