@apia/validations 2.0.7 → 2.0.9

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.
Files changed (85) hide show
  1. package/dist/da-DqVKtoV2.js.map +1 -1
  2. package/dist/de-CcX9-Rq3.js.map +1 -1
  3. package/dist/en-DCSKN2q5.js.map +1 -1
  4. package/dist/es-C-AXrgsF.js.map +1 -1
  5. package/dist/fa-CpOxXp-C.js.map +1 -1
  6. package/dist/fr-cmPfrK5Y.js.map +1 -1
  7. package/dist/gr-CmqXMJsZ.js.map +1 -1
  8. package/dist/hr-DIdEoOl4.js.map +1 -1
  9. package/dist/hu-VYwXwEzb.js.map +1 -1
  10. package/dist/index.d.ts +771 -25
  11. package/dist/index.js +114 -34
  12. package/dist/index.js.map +1 -1
  13. package/dist/it-CZNo0Ds3.js.map +1 -1
  14. package/dist/ja-CK5iBGzP.js.map +1 -1
  15. package/dist/jp-CK5iBGzP.js.map +1 -1
  16. package/dist/nl-BSU5Z9PJ.js.map +1 -1
  17. package/dist/pl-BSq2_6nm.js.map +1 -1
  18. package/dist/pt-DJTrqO4_.js.map +1 -1
  19. package/dist/ro-CAAZmoW6.js.map +1 -1
  20. package/package.json +6 -6
  21. package/rollup.validations.mjs +68 -68
  22. package/dist/collector/Collector.d.ts +0 -32
  23. package/dist/collector/Collector.d.ts.map +0 -1
  24. package/dist/collector/CollectorField.d.ts +0 -41
  25. package/dist/collector/CollectorField.d.ts.map +0 -1
  26. package/dist/collector/ValidatedCollectorField.d.ts +0 -44
  27. package/dist/collector/ValidatedCollectorField.d.ts.map +0 -1
  28. package/dist/collector/fields/Button.d.ts +0 -13
  29. package/dist/collector/fields/Button.d.ts.map +0 -1
  30. package/dist/collector/fields/Checkbox.d.ts +0 -13
  31. package/dist/collector/fields/Checkbox.d.ts.map +0 -1
  32. package/dist/collector/fields/Input.d.ts +0 -11
  33. package/dist/collector/fields/Input.d.ts.map +0 -1
  34. package/dist/collector/fields/Label.d.ts +0 -13
  35. package/dist/collector/fields/Label.d.ts.map +0 -1
  36. package/dist/collector/fields/Select.d.ts +0 -26
  37. package/dist/collector/fields/Select.d.ts.map +0 -1
  38. package/dist/collector/fields/Textarea.d.ts +0 -11
  39. package/dist/collector/fields/Textarea.d.ts.map +0 -1
  40. package/dist/components/Captcha.d.ts +0 -13
  41. package/dist/components/Captcha.d.ts.map +0 -1
  42. package/dist/components/Checkbox.d.ts +0 -12
  43. package/dist/components/Checkbox.d.ts.map +0 -1
  44. package/dist/components/DeletableInput.d.ts +0 -9
  45. package/dist/components/DeletableInput.d.ts.map +0 -1
  46. package/dist/components/FieldWrapper.d.ts +0 -20
  47. package/dist/components/FieldWrapper.d.ts.map +0 -1
  48. package/dist/components/FileInput.d.ts +0 -11
  49. package/dist/components/FileInput.d.ts.map +0 -1
  50. package/dist/components/Input.d.ts +0 -9
  51. package/dist/components/Input.d.ts.map +0 -1
  52. package/dist/components/NumberInput.d.ts +0 -14
  53. package/dist/components/NumberInput.d.ts.map +0 -1
  54. package/dist/components/Radio.d.ts +0 -14
  55. package/dist/components/Radio.d.ts.map +0 -1
  56. package/dist/components/Select.d.ts +0 -17
  57. package/dist/components/Select.d.ts.map +0 -1
  58. package/dist/components/Switchbox.d.ts +0 -11
  59. package/dist/components/Switchbox.d.ts.map +0 -1
  60. package/dist/components/Textarea.d.ts +0 -9
  61. package/dist/components/Textarea.d.ts.map +0 -1
  62. package/dist/components/ValidationError.d.ts +0 -17
  63. package/dist/components/ValidationError.d.ts.map +0 -1
  64. package/dist/components/types.d.ts +0 -11
  65. package/dist/components/types.d.ts.map +0 -1
  66. package/dist/form/Form.d.ts +0 -89
  67. package/dist/form/Form.d.ts.map +0 -1
  68. package/dist/form/FormContext.d.ts +0 -27
  69. package/dist/form/FormContext.d.ts.map +0 -1
  70. package/dist/hooks/useField.d.ts +0 -76
  71. package/dist/hooks/useField.d.ts.map +0 -1
  72. package/dist/hooks/useFieldStatesClassNames.d.ts +0 -4
  73. package/dist/hooks/useFieldStatesClassNames.d.ts.map +0 -1
  74. package/dist/hooks/useFieldValue.d.ts +0 -8
  75. package/dist/hooks/useFieldValue.d.ts.map +0 -1
  76. package/dist/hooks/useValidationClass.d.ts +0 -49
  77. package/dist/hooks/useValidationClass.d.ts.map +0 -1
  78. package/dist/lang/es.d.ts +0 -32
  79. package/dist/lang/es.d.ts.map +0 -1
  80. package/dist/types.d.ts +0 -130
  81. package/dist/types.d.ts.map +0 -1
  82. package/dist/util.d.ts +0 -36
  83. package/dist/util.d.ts.map +0 -1
  84. package/dist/validationStore.d.ts +0 -113
  85. package/dist/validationStore.d.ts.map +0 -1
package/dist/index.d.ts CHANGED
@@ -1,26 +1,772 @@
1
- export { Form, TOnValidate } from './form/Form.js';
2
- export { FormContext, useFormContext } from './form/FormContext.js';
3
- export { useFieldSelector, useFormSelector, validationsStore } from './validationStore.js';
4
- export { TValidationResult, TValidationRules } from './types.js';
5
- export { classToValidate, classToValidationFunction, hasSucceedFieldValidation, hasSucceedFormValidation, initValidations, lang } from './util.js';
6
- export { Collector } from './collector/Collector.js';
7
- export { CollectorField } from './collector/CollectorField.js';
8
- export { ValidatedCollectorField } from './collector/ValidatedCollectorField.js';
9
- export { Captcha } from './components/Captcha.js';
10
- export { Checkbox, TCheckbox, TCheckboxProps } from './components/Checkbox.js';
11
- export { DeletableInput } from './components/DeletableInput.js';
12
- export { FieldWrapper, IWrapper } from './components/FieldWrapper.js';
13
- export { FileInput } from './components/FileInput.js';
14
- export { Input, TInput } from './components/Input.js';
15
- export { NumberInputf } from './components/NumberInput.js';
16
- export { Radio, TRadio } from './components/Radio.js';
17
- export { Select, TOption, TSelect, TSelectProps } from './components/Select.js';
18
- export { Switchbox, TSwitchbox } from './components/Switchbox.js';
19
- export { Textarea } from './components/Textarea.js';
20
- export { TDefaultFieldType } from './components/types.js';
21
- export { ValidationError } from './components/ValidationError.js';
22
- export { TUseField, useField } from './hooks/useField.js';
23
- export { useFieldStatesClassNames } from './hooks/useFieldStatesClassNames.js';
24
- export { useFieldValue } from './hooks/useFieldValue.js';
25
- export { useValidationClass } from './hooks/useValidationClass.js';
1
+ import * as React from 'react';
2
+ import React__default, { ReactNode, FC } from 'react';
3
+ import { TModify, TPropsSelector, TPropsComparator, TPropsConfiguration, TId, EventEmitter } from '@apia/util';
4
+ import { TNumberInput, TOpenModal } from '@apia/components';
5
+ import { BoxProps, ButtonProps, InputProps, RadioProps, SelectProps, SwitchProps, TextareaProps } from '@apia/theme';
6
+
7
+ declare const formcheckLanguage: {
8
+ required: string;
9
+ alpha: string;
10
+ alphanum: string;
11
+ nodigit: string;
12
+ digit: string;
13
+ digitmin: string;
14
+ digitltd: string;
15
+ number: string;
16
+ email: string;
17
+ image: string;
18
+ phone: string;
19
+ url: string;
20
+ confirm: string;
21
+ differs: string;
22
+ length_str: string;
23
+ length_fix: string;
24
+ lengthmax: string;
25
+ lengthmin: string;
26
+ words_min: string;
27
+ words_max: string;
28
+ words_range: string;
29
+ checkbox: string;
30
+ checkboxes_group: string;
31
+ radios: string;
32
+ select: string;
33
+ select_multiple: string;
34
+ errorsTitle: string;
35
+ };
36
+
37
+ type TValidate = Partial<TModify<Record<keyof typeof formcheckLanguage, boolean>, {
38
+ digitmin: number;
39
+ digitltd: [number, number];
40
+ confirm: string;
41
+ differs: string;
42
+ length_str: [number, number];
43
+ length_fix: number;
44
+ words_min: number;
45
+ words_max: number;
46
+ words_range: [number, number];
47
+ checkboxes_group: number;
48
+ }> & {
49
+ patternMessage: string;
50
+ pattern: RegExp | string;
51
+ digitmax: number;
52
+ validName?: string;
53
+ maxLength: number;
54
+ minLength: number;
55
+ min: number;
56
+ max: number;
57
+ }>;
58
+ interface IFieldDefinition<ValueType = string> {
59
+ toolTip: string;
60
+ label: string;
61
+ name: string;
62
+ validate?: TValidate;
63
+ value: ValueType;
64
+ options?: {
65
+ label: string;
66
+ value: number | number;
67
+ selected?: boolean;
68
+ }[];
69
+ }
70
+ type TPromiseOrNot<Type> = Promise<Type> | Type;
71
+ type TSuccessfulValidation<ValueType extends Record<string, unknown>, SubmitValueType extends Record<keyof ValueType, unknown> = ValueType> = {
72
+ values: ValueType;
73
+ submitValues: SubmitValueType;
74
+ };
75
+ type TWrongValidation = {
76
+ errors: Record<string, string>;
77
+ };
78
+ /**
79
+ * Esta interfaz representa el resultado de la validación
80
+ * de un formulario.
81
+ */
82
+ type TValidationResult<ValueType extends Record<string, unknown>, SubmitValueType extends Record<keyof ValueType, unknown> = ValueType> = TSuccessfulValidation<ValueType, SubmitValueType> | TWrongValidation;
83
+ type TFieldValidationResult = true | string;
84
+ type TValidationFunction<ValueType> = (value: ValueType, formName: string) => TPromiseOrNot<TFieldValidationResult>;
85
+ type TValidationSubmitValueParser<ValueType = unknown, SubmitValueType = ValueType> = (value: ValueType) => SubmitValueType;
86
+ type TValidationValueParser<ValueType = unknown, ValidationValueType = unknown> = (value: ValueType) => ValidationValueType;
87
+ type TValidationRules = IFieldDefinition['validate'];
88
+ /**
89
+ * Esta interfaz representa el estado de un campo dentro
90
+ * del hook de validación.
91
+ *
92
+ * Las funcionalidades contempladas hasta el momento son:
93
+ *
94
+ * - Contener los valores del formulario.
95
+ * - Foco: Se hará querySelector sobre el form que lo contiene
96
+ * con el nombre provisto.
97
+ * - Función de validación o lista de reglas.
98
+ * - Manejo de errores.
99
+ * - Parsearlos para hacer submit.
100
+ */
101
+ type TValidationField<ValueType = any, SubmitValueType = ValueType> = {
102
+ error?: string | null;
103
+ isTouched: boolean;
104
+ /**
105
+ * El nombre se utilizará para hacer foco en el campo en caso
106
+ * de que la validación del mismo fallara. Para ello se
107
+ * intenta recuperar un campo con el selector
108
+ * [name=${name}, #${name}], en caso de que el selector no
109
+ * encontrar ningún campo, se intentará hacer foco en el
110
+ * siguiente campo con error.
111
+ */
112
+ name: string;
113
+ /**
114
+ * Como dice el nombre, es posible cambiar el nombre de un
115
+ * campo al hacer submit.
116
+ */
117
+ submitName?: string;
118
+ /**
119
+ * Es posible recibir un valor ya parseado en el callback
120
+ * onValidate del Form, para ello se puede proveer este
121
+ * callback, que será llamado previo a llamar a onValidate.
122
+ */
123
+ submitValueParser?: TValidationSubmitValueParser<ValueType, SubmitValueType | Promise<SubmitValueType> | undefined>;
124
+ /**
125
+ * Es posible pasar una función de validación personalizada
126
+ * para casos en los que la validación es significativamente
127
+ * compleja. En la mayoría de los casos debería bastar con
128
+ * la propiedad validationRules.
129
+ */
130
+ validationFunction?: TValidationFunction<ValueType>;
131
+ /**
132
+ * Permite pasar una serie de reglas que el campo debe cumplir
133
+ * al validar.
134
+ */
135
+ validationRules?: TValidationRules;
136
+ validationValueParser?: TValidationValueParser<ValueType>;
137
+ value: ValueType;
138
+ };
139
+ type TRegisterFormOptions = Partial<{
140
+ /**
141
+ * Si esta propiedad está seteada en true, el formulario se registrará y
142
+ * aquellos campos que ya tuvieran valor en el store no se volverán a
143
+ * registrar. En caso de que se incluyera initialValue, se hará updateValue de
144
+ * estos campos.
145
+ */
146
+ avoidFieldsOverride: boolean;
147
+ initialValues: Record<string, unknown>;
148
+ /**
149
+ * Esta propiedad fuerza al formulario a guardarse en el localStorage. Adicionalmente,
150
+ * si al registrar el formulario ya existe información almacenada, la carga en el store
151
+ * e ignora las propiedades provistas en el método, a excepción de:
152
+ * - fields:validationFunction
153
+ * - fields:submitValueParser
154
+ */
155
+ persistToSessionStorage: boolean;
156
+ }>;
157
+ type TUpdateFieldOptions = Partial<{
158
+ avoidPropagation?: boolean;
159
+ /**
160
+ * Cuando se hace seteo de propiedades iniciales, se puede pasar este flag
161
+ * en false para que el formulario no aparezca como touched debido a estos
162
+ * cambios.
163
+ */
164
+ markFormAsTouched: boolean;
165
+ }> & Pick<TRegisterFormOptions, 'avoidFieldsOverride'>;
166
+ type TRegisterFieldOptions = {
167
+ avoidPropagation?: boolean;
168
+ registerIfExists?: boolean;
169
+ };
170
+ type TRegisterField = Partial<TValidationField> & Pick<TValidationField, 'name'>;
171
+ type TFormState = {
172
+ fields: string[];
173
+ name: string;
174
+ isTouched: boolean;
175
+ isValid: boolean;
176
+ validationResult: TValidationResult<Record<string, unknown>> | null;
177
+ } & Pick<TRegisterFormOptions, 'avoidFieldsOverride' | 'persistToSessionStorage'>;
178
+
179
+ type TOnValidate<ValueType extends Record<string, unknown> = Record<string, unknown>, SubmitValueType extends Record<keyof ValueType, unknown> = ValueType> = (validationResult: TValidationResult<ValueType, SubmitValueType>) => unknown;
180
+ interface IForm<ValueType extends Record<string, unknown>, SubmitValueType extends Record<keyof ValueType, unknown> = ValueType> {
181
+ /**
182
+ * Si se pasa en true, los campos que se registren en este form no
183
+ * sobreescribirán valores previos si es que existen, sin importar el valor de
184
+ * avoidRegisterIfExists pasado al useField.
185
+ */
186
+ avoidFieldsOverride?: boolean;
187
+ /**
188
+ * Impide que se apliquen los estilos que indican que un campo fue alterado.
189
+ */
190
+ avoidFieldsTouch?: boolean;
191
+ children: React__default.ReactNode;
192
+ className?: string;
193
+ initialValues?: Partial<ValueType>;
194
+ name?: string;
195
+ onUnmount?: () => unknown;
196
+ /**
197
+ * Cuando se ejecuta una acción de validación desde
198
+ * algún lugar de la aplicación se llama a este método
199
+ * con el resultado de dicha ejecución.
200
+ */
201
+ onValidate?: TOnValidate<ValueType, SubmitValueType>;
202
+ persistToSessionStorage?: boolean;
203
+ /**
204
+ * Permite definir si el formulario va a ser borrado de la validación al ser
205
+ * desmontado
206
+ */
207
+ unregisterOnUnmount?: boolean;
208
+ }
209
+ /**
210
+ * Cuando se desea usar el sistema de validación,
211
+ * se debe utilizar este componente como form contenedor
212
+ * de todos los campos que quieran validarse.
213
+ *
214
+ * Es importante que no se coloquen formularios dentro
215
+ * de formularios ya que esto podría afectar negativamente
216
+ * el proceso de validación.
217
+ *
218
+ * @props
219
+ * *name:* Se puede pasar un nombre para identificar
220
+ * el form. Este nombre será utilizado para almacenar
221
+ * la información en Redux, por lo que si se desea
222
+ * acceder a la información recolectada por la librería,
223
+ * es conveniente pasar un nombre conocido y único. En
224
+ * caso de no se pase ningún nombre, la aplicación
225
+ * generará un nombre único automaticamente.
226
+ *
227
+ * *onValidate:* Un callback que será llamado cuando
228
+ * se invoque el método validateForm del store o cuando
229
+ * se lance el evento de submit del elemento form (por
230
+ * ejemplo mediante un click en un botón que no tenga
231
+ * type="button"), con el resultado de la validación.
232
+ *
233
+ * avoidFieldsOverride
234
+ * avoidFieldsTouch
235
+ *
236
+ * @see useField
237
+ * @see useForm
238
+ *
239
+ * @important Debido a que este hook renderiza un elemento
240
+ * form en el DOM, es importante agregar el atributo
241
+ * type="button" a todos los botones dentro del formulario
242
+ * que no se desea que disparen la validación.
243
+ *
244
+ * @example
245
+ * Para ver un ejemplo funcional, mira el componente
246
+ * Invitations.tsx
247
+ *
248
+ * // IMPORTANTE: El tipado del componente Form es genérico
249
+ * // por lo que es posible instanciarlo como se muestra a
250
+ * // continuación, lo que nos da el tipado correcto en el
251
+ * // callback onValidate.
252
+ * <Form<FormDataType> onValidate={(res) => {
253
+ * if(hasSucceedValidation(res)) {
254
+ * // Do something with submitValues
255
+ * } else {
256
+ * // Do something with errors
257
+ * }
258
+ * }}>
259
+ * ...{children}
260
+ * </Form>
261
+ */
262
+ declare const Form: <ValueType extends Record<string, unknown>, SubmitValueType extends Record<keyof ValueType, unknown> = ValueType>({ avoidFieldsOverride, avoidFieldsTouch, children, className, name, initialValues, onUnmount, onValidate, persistToSessionStorage, unregisterOnUnmount, }: IForm<ValueType, SubmitValueType>) => React__default.JSX.Element | null;
263
+
264
+ interface IFormContext<ValueType extends Record<string, unknown> = Record<string, unknown>, SubmitValueType extends Record<keyof ValueType, unknown> = ValueType> {
265
+ avoidFieldsTouch?: boolean;
266
+ name: string;
267
+ validate: () => Promise<TValidationResult<ValueType, SubmitValueType>>;
268
+ }
269
+ declare const FormContext: React__default.Context<IFormContext<Record<string, unknown>, Record<string, unknown>>>;
270
+ /**
271
+ * Provee acceso de forma sencilla al contexto de
272
+ * validación, que básicamente posee el nombre del
273
+ * form en caso de que se quiera usar para acceder
274
+ * a través de Redux a la información del mismo y un
275
+ * método validate, que dispara la validación del
276
+ * form.
277
+ *
278
+ * En la práctica, el método validate es casi
279
+ * innecesario, ya que la validación se puede disparar
280
+ * con cualquier botón que no tenga seteado el
281
+ * atributo type="button" (esto es así ya que en el
282
+ * DOM se renderiza un elemento de tipo form).
283
+ */
284
+ declare function useFormContext(): IFormContext<Record<string, unknown>, Record<string, unknown>>;
285
+
286
+ declare global {
287
+ interface Window {
288
+ MSG_WRONG_VALIDATION_NO_FOCUSED_FILE: string;
289
+ }
290
+ }
291
+ declare const validationsStore: {
292
+ activeForms: string[];
293
+ timeouts: Record<string, ReturnType<typeof setTimeout> | true>;
294
+ loadFromSessionStorage(formName: string): boolean;
295
+ persistFormToSessionStorage(formName: string): void;
296
+ getFieldStore(formName: string, fieldName: string): TValidationField;
297
+ getFormStore(formName: string): TFormState;
298
+ updateFieldStore(formName: string, fieldName: string, props: Partial<TValidationField>, noEmit?: boolean): void;
299
+ updateFormStore(formName: string, newState: Partial<TFormState>, avoidPersist?: boolean): void;
300
+ enableFormTouch(formName: string): void;
301
+ existsField: (formName: string, fieldName: string) => boolean;
302
+ makeFieldName(formName: string, fieldName: string): string;
303
+ makeFormName(formName: string): string;
304
+ registerField: (formName: string, registerData: TRegisterField, options?: TRegisterFieldOptions) => void;
305
+ /**
306
+ * Inicializa el estado de un nuevo formulario
307
+ */
308
+ registerForm: (formName: string, props?: Partial<{
309
+ avoidFieldsOverride: boolean;
310
+ initialValues: Record<string, unknown>;
311
+ persistToSessionStorage: boolean;
312
+ }>) => void;
313
+ /**
314
+ * Setea el valor del campo con el nombre provisto. Si el campo no existe
315
+ * en el formulario lo crea.
316
+ */
317
+ setFieldValue: (formName: string, fieldName: string, newValue: unknown, options?: TUpdateFieldOptions) => void;
318
+ setFormIsTouched: (formName: string, isTouched?: boolean) => void;
319
+ /**
320
+ * Elimina un campo del registro de validación de un formulario. De esta
321
+ * forma cualquier validación que pudiera aplicarse sobre el mismo, ya no se
322
+ * aplicará.
323
+ */
324
+ unregisterField: (formName: string, fieldName: string) => void;
325
+ /**
326
+ * Elimina un formulario del store de validación junto con todos los campos
327
+ * asociados al mismo.
328
+ */
329
+ unregisterForm: (formName: string) => void;
330
+ /**
331
+ * Actualiza las propiedades de un campo, si no existe, lo registra en el
332
+ * formulario.
333
+ */
334
+ updateField: (formName: string, field: Partial<TValidationField> & Pick<TValidationField, 'name'>, options?: TUpdateFieldOptions) => void;
335
+ /**
336
+ * Actualiza múltiples campos al mismo tiempo.
337
+ */
338
+ updateMultipleFields: (formName: string, fields: (Partial<TValidationField> & Pick<TValidationField, 'name'>)[], options?: TUpdateFieldOptions) => void;
339
+ /**
340
+ * Ejecuta la validación sobre un formulario. En caso de que la validación
341
+ * falle, se intenta hacer foco sobre el campo que no pudo validar.
342
+ * Es importante notar que en caso de que un campo requiera validación,
343
+ * debería estar presente en el DOM.
344
+ *
345
+ * No es necesario que el campo esté visible, ya que en caso de estar oculto
346
+ * (por ejemplo por ser hijo de un acordeón), se emitirá un evento para
347
+ * expandir al elemento padre que lo estuviera ocultando.
348
+ *
349
+ * @returns Devuelve una promesa que al ser resuelta otorga un objeto de tipo
350
+ * TValidationResult. Este tipo está pensado para ser usado en conjunto con
351
+ * el método hasSucceedFormValidation, que determinará si la validación fue
352
+ * exitosa o hubo errores.
353
+ *
354
+ * @example
355
+ *
356
+ * const result = await validationStore.validateForm('myForm');
357
+ * if(hasSucceedValidation(result)) {
358
+ * console.log('Success!', result);
359
+ * } else {
360
+ * console.error('Validation error', result);
361
+ * }
362
+ */
363
+ validateForm: <ValueType extends Record<string, unknown>, SubmitValueType extends Record<keyof ValueType, unknown> = ValueType>(formName: string) => Promise<TValidationResult<ValueType, SubmitValueType>>;
364
+ };
365
+ /**
366
+ * Este hook permite suscribirse a los cambios realizados en el
367
+ * store de validación de un formulario. Funciona igual a un
368
+ * useAppSelector en cuanto a la función selectora y comparadora.
369
+ *
370
+ * @param selector
371
+ * @param comparator
372
+ * @returns
373
+ */
374
+ declare function useFormSelector<Selected = any>(formName: string, selector: TPropsSelector<Selected, TFormState>, comparator?: TPropsComparator<Selected>): Selected;
375
+ /**
376
+ * Este hook permite suscribirse a los cambios realizados en el
377
+ * store de validación de un campo de formulario. Funciona igual a un
378
+ * useAppSelector en cuanto a la función selectora y comparadora.
379
+ *
380
+ * @param selector
381
+ * @param comparator
382
+ * @returns
383
+ */
384
+ declare function useFieldSelector<ValueType = unknown, SubmitValueType = unknown, Selected = any>(formName: string, fieldName: string, selector?: TPropsSelector<Selected, TValidationField<ValueType, SubmitValueType>>, comparator?: TPropsComparator<Selected>): Selected;
385
+ declare function useFieldSelector<ValueType = unknown, SubmitValueType = unknown, Selected = any>(formName: string, fieldName: string, configurator?: TPropsConfiguration<Selected, TValidationField<ValueType, SubmitValueType>>): Selected;
386
+
387
+ declare global {
388
+ interface Window {
389
+ NO_LANGUAGE_EXCEPTION: string;
390
+ MSG_INVALID_REG_EXP: string;
391
+ GNR_INVALID_NAME: string;
392
+ }
393
+ }
394
+ /**
395
+ * Determina si la validación de un campo resultó exitosa.
396
+ */
397
+ declare function hasSucceedFieldValidation(result: TFieldValidationResult): result is true;
398
+ /**
399
+ * Determina si la validación de un formulario resultó
400
+ * exitosa. Está pensada para utilizar en el callback
401
+ * onValidate de Form o en la acción validationsActions.validateForm
402
+ */
403
+ declare function hasSucceedFormValidation<ValueType extends Record<string, unknown>, SubmitValueType extends Record<keyof ValueType, unknown> = ValueType>(result: TValidationResult<ValueType, SubmitValueType>): result is TSuccessfulValidation<ValueType, SubmitValueType>;
404
+ /**
405
+ * Devuelve la cadena correspondiente a un código
406
+ * de error, realizando los reemplazos correspondientes.
407
+ */
408
+ declare function lang(errorCode: keyof typeof formcheckLanguage, ...replacements: (string | number)[]): string;
409
+ declare function classToValidationFunction<T = string>(className: string): TValidationField<T>['validationFunction'];
410
+ declare function classToValidate(className: string): IFieldDefinition['validate'];
411
+ /**
412
+ * Realiza la carga de los mensajes de errores para el lenguaje
413
+ * especificado. Este método debe llamarse antes de utilizar
414
+ * las validaciones.
415
+ */
416
+ declare function initValidations(): Promise<void>;
417
+
418
+ type TUseField<ValueType = unknown, SubmitValueType = ValueType> = Omit<TValidationField<ValueType, SubmitValueType>, 'error' | 'value' | 'isTouched'> & {
419
+ /**
420
+ * Con esta propiedad es posible evitar que el campo
421
+ * se registre cuando ya fue registrado previamente en
422
+ * el store. De esta forma, se evitaría escribir sobre
423
+ * un valor que ya estaba seteado anteriormente.
424
+ */
425
+ avoidRegisterIfExists?: boolean;
426
+ /**
427
+ * Si se está fuera de contexto de validación, se puede pasar un formName
428
+ * para evitar que el hook lo intente tomar de contexto.
429
+ */
430
+ formName?: string;
431
+ initialValue?: ValueType;
432
+ removeOnUnmount?: boolean;
433
+ };
434
+ /**
435
+ * Este hook permite registrar un field para ser validado,
436
+ * o simplemente para recolectar su valor, e incluso aplicar
437
+ * una función de transformación de dicho valor antes de
438
+ * hacer submit.
439
+ *
440
+ * @returns
441
+ * *error:* Es null mientras que no haya errores de
442
+ * validación, y un string en caso de que si lo haya.
443
+ *
444
+ * *value:* Es el valor actual del campo.
445
+ *
446
+ * *name:* Debería utilizarse para dar * valor al atributo
447
+ * name o id del contenedor que debe recibir el foco en caso
448
+ * de que la validación fallara. (Esto es, cuando se deba
449
+ * realizar foco porque la validación falló, la librería
450
+ * intentará encontrar un campo con el selector
451
+ * [name=${name}, #${name}] dentro del formulario).
452
+ *
453
+ * *onChange:* Se utiliza para setear el valor del campo,
454
+ * puede utilizarse directamente como callback para la
455
+ * propiedad onChange que aceptan la mayoría de los campos,
456
+ * ya que intentará setear el valor con ev.target.value
457
+ * y si esa propiedad no está definida, lo hará directamente
458
+ * con ev.
459
+ *
460
+ * @example
461
+ * // Si se desea un ejemplo más complejo, vea el componente
462
+ * // Invitations.tsx que se encuentra dentro del directorio
463
+ * // de la librería.
464
+ *
465
+ * const inputProps = useField<string>({
466
+ name: 'name',
467
+ validationRules: {
468
+ required: true,
469
+ minLength: 5,
470
+ maxLength: 10
471
+ },
472
+ initialValue: metadata.value,
473
+ * });
474
+
475
+ return <Box>
476
+ <Input {...inputProps} />
477
+ <ValidationError name="name" />
478
+ </Box>
479
+ */
480
+ declare function useField<ValueType = unknown, SubmitValueType = ValueType>(fieldDefinition: TUseField<ValueType, SubmitValueType>): {
481
+ error: string | null | undefined;
482
+ isTouched: boolean;
483
+ name: string;
484
+ onChange: (ev: React__default.ChangeEvent | ValueType) => void;
485
+ updateValidations: ({ validationFunction, validationRules, }: Pick<TValidationField, 'validationRules' | 'validationFunction'>) => void;
486
+ value: ValueType;
487
+ };
488
+
489
+ declare global {
490
+ interface Window {
491
+ SHOW_REQUIRED_POSITION: string;
492
+ }
493
+ }
494
+ interface IWrapper extends BoxProps {
495
+ avoidSemicolon?: boolean;
496
+ children: React__default.ReactNode;
497
+ label?: string;
498
+ name: string;
499
+ required?: boolean;
500
+ type?: 'checkbox';
501
+ }
502
+ declare const FieldWrapper: ({ name, label, avoidSemicolon, children, className, as, type, ...props }: IWrapper) => React__default.JSX.Element;
503
+
504
+ type TDefaultFieldType<ValueType = string> = Omit<TUseField<ValueType>, 'error' | 'value' | 'isTouched'> & {
505
+ label?: string;
506
+ initialValue?: ValueType;
507
+ validationClass?: string;
508
+ } & Pick<IWrapper, 'avoidSemicolon'>;
509
+
510
+ type TCaptchaProps = {
511
+ name: string;
512
+ imageUrl: string;
513
+ className?: string;
514
+ };
515
+ type TCaptcha = TCaptchaProps & Omit<TDefaultFieldType, 'validationFunction' | 'validationRules' | 'validationClass'>;
516
+ declare const InnerCaptcha: ({ className, name, imageUrl, avoidRegisterIfExists, avoidSemicolon, formName, label, removeOnUnmount, submitName, submitValueParser, validationValueParser, }: TCaptcha) => React__default.JSX.Element;
517
+
518
+ type TCheckboxProps = Omit<ButtonProps, 'onChange' | 'defaultChecked' | 'defaultValue'> & Pick<InputProps, 'onChange'>;
519
+ type TCheckbox = TCheckboxProps & TDefaultFieldType<boolean | string> & {
520
+ native?: boolean;
521
+ };
522
+ declare const Checkbox: React__default.ForwardRefExoticComponent<Omit<TCheckbox, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;
523
+
524
+ type TDeletableInput = InputProps & TDefaultFieldType;
525
+ declare const DeletableInput: React__default.ForwardRefExoticComponent<Omit<TDeletableInput, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
526
+
527
+ type TFileInput = Omit<InputProps, 'onChange' | 'type' | 'value' | 'multiple'> & TDefaultFieldType<File | null> & Pick<TUseField, 'removeOnUnmount'> & Pick<IWrapper, 'avoidSemicolon'>;
528
+ declare const FileInput: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<Omit<TFileInput, "ref"> & React__default.RefAttributes<HTMLInputElement>>>;
529
+
530
+ type TInput$1 = InputProps & TDefaultFieldType;
531
+ declare const Input: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<Omit<TInput$1, "ref"> & React__default.RefAttributes<HTMLInputElement>>>;
532
+
533
+ declare global {
534
+ interface Window {
535
+ GNR_NUMERIC: string;
536
+ }
537
+ }
538
+ type TInput = TNumberInput & TDefaultFieldType;
539
+ declare const NumberInputf: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<Omit<TInput, "ref"> & React__default.RefAttributes<HTMLInputElement>>>;
540
+
541
+ type TRadio = RadioProps & TDefaultFieldType & {
542
+ options: {
543
+ value: string;
544
+ label: string;
545
+ }[];
546
+ };
547
+ declare const Radio: React__default.ForwardRefExoticComponent<Omit<TRadio, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
548
+
549
+ type TOption = {
550
+ value: TId;
551
+ label: string;
552
+ };
553
+ type TSelectProps = Omit<SelectProps, 'defaultValue'>;
554
+ type TSelect = TSelectProps & TDefaultFieldType & {
555
+ options: TOption[];
556
+ };
557
+ declare const Select: React__default.ForwardRefExoticComponent<Omit<TSelect, "ref"> & React__default.RefAttributes<HTMLSelectElement>>;
558
+
559
+ type TSwitchbox = Omit<SwitchProps, 'onChange'> & Pick<InputProps, 'onChange'> & TDefaultFieldType & {
560
+ reverse?: boolean;
561
+ };
562
+ declare const Switchbox: React__default.ForwardRefExoticComponent<Omit<TSwitchbox, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
563
+
564
+ type TTextarea = TextareaProps & TDefaultFieldType;
565
+ declare const Textarea: React__default.ForwardRefExoticComponent<Omit<TTextarea, "ref"> & React__default.RefAttributes<HTMLTextAreaElement>>;
566
+
567
+ /**
568
+ * Renderiza los errores del campo con el nombre pasado
569
+ * como prop. En caso de que no exista error, no renderiza
570
+ * nada.
571
+ *
572
+ * @props
573
+ * *name:* El nombre del campo cuyos errores se quieren
574
+ * renderizar.
575
+ */
576
+ declare const ValidationError: ({ name }: {
577
+ name: string;
578
+ }) => React.JSX.Element | null;
579
+
580
+ declare abstract class CollectorField<ValueType = any, FieldProps = any> extends EventEmitter<{
581
+ functionUpdate: TValidationFunction<ValueType>;
582
+ optionsUpdate: TOption[];
583
+ propsUpdate: Partial<FieldProps>;
584
+ rulesUpdate: TValidationRules;
585
+ }> {
586
+ #private;
587
+ protected _name: string;
588
+ protected label: ReactNode;
589
+ /**
590
+ * Este es el componente de implementación de cada campo particular
591
+ */
592
+ abstract Component: FC;
593
+ abstract type: string;
594
+ constructor(_name: string, label: ReactNode, properties?: Partial<FieldProps>);
595
+ get name(): string;
596
+ set name(name: string);
597
+ collector: Collector;
598
+ isHidden: () => boolean;
599
+ setIsHidden: (isHidden: boolean) => void;
600
+ protected properties: Partial<FieldProps>;
601
+ setProperties: (newProps: Partial<FieldProps>) => void;
602
+ protected useProperties: () => Partial<FieldProps>;
603
+ /**
604
+ * Este componente se utiliza para controlar propiedades comunes a todos los
605
+ * campos.
606
+ */
607
+ SuperComponent: () => React.JSX.Element | null;
608
+ }
609
+
610
+ declare abstract class ValidatedCollectorField<ValueType = any, FieldProps = any> extends CollectorField<ValueType, FieldProps> {
611
+ #private;
612
+ protected _name: string;
613
+ protected label: string;
614
+ protected initialValue: ValueType;
615
+ constructor(_name: string, label: string, config?: Partial<{
616
+ initialValue: ValueType;
617
+ properties: Partial<FieldProps>;
618
+ validationFunction: TValidationFunction<ValueType>;
619
+ validationRules: TValidationRules;
620
+ }>);
621
+ setInitialValue: (newValue: ValueType) => void;
622
+ setValidationFunction: (newFunction: TValidationFunction<ValueType>) => void;
623
+ setValidationRules: (newRules: TValidationRules) => void;
624
+ setValue: (newValue: ValueType) => void;
625
+ protected useValidationFunction: () => TValidationFunction<ValueType>;
626
+ protected useValidationRules: () => Partial<Omit<Record<"number" | "required" | "alpha" | "alphanum" | "nodigit" | "digit" | "digitmin" | "digitltd" | "email" | "image" | "phone" | "url" | "confirm" | "differs" | "length_str" | "length_fix" | "lengthmax" | "lengthmin" | "words_min" | "words_max" | "words_range" | "checkbox" | "checkboxes_group" | "radios" | "select" | "select_multiple" | "errorsTitle", boolean>, "digitmin" | "digitltd" | "confirm" | "differs" | "length_str" | "length_fix" | "words_min" | "words_max" | "words_range" | "checkboxes_group"> & {
627
+ digitmin: number;
628
+ digitltd: [number, number];
629
+ confirm: string;
630
+ differs: string;
631
+ length_str: [number, number];
632
+ length_fix: number;
633
+ words_min: number;
634
+ words_max: number;
635
+ words_range: [number, number];
636
+ checkboxes_group: number;
637
+ } & {
638
+ patternMessage: string;
639
+ pattern: string | RegExp;
640
+ digitmax: number;
641
+ validName?: string | undefined;
642
+ maxLength: number;
643
+ minLength: number;
644
+ min: number;
645
+ max: number;
646
+ }> | undefined;
647
+ }
648
+
649
+ declare class CollectorCheckbox extends ValidatedCollectorField<string | boolean, Omit<TCheckboxProps, 'name'>> {
650
+ type: string;
651
+ Component: () => React.JSX.Element;
652
+ }
653
+
654
+ declare class CollectorInput extends ValidatedCollectorField<string, Omit<InputProps, 'name'>> {
655
+ type: string;
656
+ Component: () => React.JSX.Element;
657
+ }
658
+
659
+ declare class CollectorSelect extends ValidatedCollectorField<string, Omit<TSelectProps, 'name'>> {
660
+ #private;
661
+ protected _name: string;
662
+ protected label: string;
663
+ type: string;
664
+ constructor(_name: string, label: string, config?: Partial<{
665
+ initialValue: string;
666
+ options: TOption[];
667
+ properties: Partial<Omit<TSelectProps, 'name'>>;
668
+ validationFunction: TValidationFunction<string>;
669
+ validationRules: TValidationRules;
670
+ }>);
671
+ addOption: (newOption: TOption) => void;
672
+ setOptions: (newOptions: TOption[]) => void;
673
+ Component: () => React.JSX.Element;
674
+ }
675
+
676
+ declare class CollectorTextarea extends ValidatedCollectorField<string, Omit<TextareaProps, 'name'>> {
677
+ type: string;
678
+ Component: () => React.JSX.Element;
679
+ }
680
+
681
+ declare class CollectorLabel extends CollectorField {
682
+ private kind;
683
+ private static maxId;
684
+ type: string;
685
+ constructor(label: ReactNode, kind?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'label');
686
+ Component: () => React.JSX.Element;
687
+ }
688
+
689
+ declare class CollectorButton extends CollectorField<null, Omit<ButtonProps, 'children'>> {
690
+ protected label: string;
691
+ type: string;
692
+ constructor(label: string, properties?: Omit<ButtonProps, 'children'>);
693
+ Component: () => React.JSX.Element;
694
+ }
695
+
696
+ declare class Collector {
697
+ #private;
698
+ fields: {
699
+ button: typeof CollectorButton;
700
+ checkbox: typeof CollectorCheckbox;
701
+ input: typeof CollectorInput;
702
+ /**
703
+ * Muestra una etiqueta con tag personalizable: h1...h6, p, label. (Por
704
+ * defecto: label)
705
+ */
706
+ label: typeof CollectorLabel;
707
+ select: typeof CollectorSelect;
708
+ textarea: typeof CollectorTextarea;
709
+ };
710
+ private private__id;
711
+ get id(): string;
712
+ add: (...fields: CollectorField[]) => this;
713
+ forEach: (cb: (field: CollectorField, i: number) => void) => void;
714
+ show: <FormValues extends Record<string, unknown>>(modalProps?: Partial<Omit<TOpenModal, 'children'>> & Partial<{
715
+ hideConfirm: boolean;
716
+ }>) => Promise<FormValues | null>;
717
+ }
718
+
719
+ declare function useFieldStatesClassNames<T = unknown>(name: string, formName?: string): string;
720
+
721
+ interface IUseFieldValue {
722
+ formName?: string;
723
+ name: string;
724
+ }
725
+ declare function useFieldValue<T = unknown>({ formName, name }: IUseFieldValue): T;
726
+
727
+ declare function useValidationClass<T>({ customValidation, formName, name, validationClass, validationFunction, validationRules, }: Pick<TDefaultFieldType<T>, 'validationClass' | 'validationFunction' | 'validationRules' | 'name'> & {
728
+ customValidation?: TValidationFunction<T>;
729
+ formName?: string;
730
+ }): {
731
+ actualValidationFunction: TValidationFunction<T>;
732
+ actualValidationRules: {
733
+ number?: boolean | undefined;
734
+ required?: boolean | undefined;
735
+ alpha?: boolean | undefined;
736
+ alphanum?: boolean | undefined;
737
+ nodigit?: boolean | undefined;
738
+ digit?: boolean | undefined;
739
+ email?: boolean | undefined;
740
+ image?: boolean | undefined;
741
+ phone?: boolean | undefined;
742
+ url?: boolean | undefined;
743
+ lengthmax?: boolean | undefined;
744
+ lengthmin?: boolean | undefined;
745
+ checkbox?: boolean | undefined;
746
+ radios?: boolean | undefined;
747
+ select?: boolean | undefined;
748
+ select_multiple?: boolean | undefined;
749
+ errorsTitle?: boolean | undefined;
750
+ digitmin?: number | undefined;
751
+ digitltd?: [number, number] | undefined;
752
+ confirm?: string | undefined;
753
+ differs?: string | undefined;
754
+ length_str?: [number, number] | undefined;
755
+ length_fix?: number | undefined;
756
+ words_min?: number | undefined;
757
+ words_max?: number | undefined;
758
+ words_range?: [number, number] | undefined;
759
+ checkboxes_group?: number | undefined;
760
+ patternMessage?: string | undefined;
761
+ pattern?: string | RegExp | undefined;
762
+ digitmax?: number | undefined;
763
+ validName?: string | undefined;
764
+ maxLength?: number | undefined;
765
+ minLength?: number | undefined;
766
+ min?: number | undefined;
767
+ max?: number | undefined;
768
+ };
769
+ };
770
+
771
+ export { InnerCaptcha as Captcha, Checkbox, Collector, CollectorField, DeletableInput, FieldWrapper, FileInput, Form, FormContext, type IWrapper, Input, NumberInputf, Radio, Select, Switchbox, type TCheckbox, type TCheckboxProps, type TDefaultFieldType, type TInput$1 as TInput, type TOnValidate, type TOption, type TRadio, type TSelect, type TSelectProps, type TSwitchbox, type TUseField, type TValidationFunction, type TValidationResult, type TValidationRules, Textarea, ValidatedCollectorField, ValidationError, classToValidate, classToValidationFunction, hasSucceedFieldValidation, hasSucceedFormValidation, initValidations, lang, useField, useFieldSelector, useFieldStatesClassNames, useFieldValue, useFormContext, useFormSelector, useValidationClass, validationsStore };
26
772
  //# sourceMappingURL=index.d.ts.map