x-generic-form 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +92 -0
- package/dist/App.d.ts +2 -0
- package/dist/components/SimpleGenericForm.d.ts +3 -0
- package/dist/components/genforms/components/auxiliar-components/control-item.auxiliar.d.ts +7 -0
- package/dist/components/genforms/components/auxiliar-components/form-container.auxiliar.d.ts +1 -0
- package/dist/components/genforms/components/auxiliar-components/grid-container.auxiliar.d.ts +1 -0
- package/dist/components/genforms/components/auxiliar-components/numeric.auxiliar.d.ts +2 -0
- package/dist/components/genforms/components/auxiliar-components/radios-items.auxiliar.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/autocomplete.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/check.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/custom-component.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/date.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/input.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/number.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/radio.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/rating.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/select.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/slider.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/switch.generic.d.ts +1 -0
- package/dist/components/genforms/components/basics-controls/time.generic.d.ts +1 -0
- package/dist/components/genforms/components/special-controls/scanner.generic.d.ts +1 -0
- package/dist/components/genforms/functions/init.controls.d.ts +8 -0
- package/dist/components/genforms/functions/render.controls.d.ts +2 -0
- package/dist/components/genforms/functions/service.controls.d.ts +7 -0
- package/dist/components/genforms/functions/service.form.d.ts +2 -0
- package/dist/components/genforms/functions/utils.d.ts +1 -0
- package/dist/components/genforms/functions/validation.controls.d.ts +12 -0
- package/dist/components/genforms/types/common.types.d.ts +73 -0
- package/dist/components/genforms/types/controls/controls.types.d.ts +156 -0
- package/dist/components/genforms/types/forms.types.d.ts +53 -0
- package/dist/components/genforms/types/validation.types.d.ts +174 -0
- package/dist/generic-form.cjs.js +186 -0
- package/dist/generic-form.es.js +34832 -0
- package/dist/index.d.ts +5 -0
- package/dist/main.d.ts +0 -0
- package/dist/styled.d.ts +1 -0
- package/dist/theme.d.ts +2 -0
- package/dist/vite.svg +1 -0
- package/package.json +76 -0
package/README.md
ADDED
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
# Generic Form Library
|
|
2
|
+
|
|
3
|
+
A flexible and reusable form component library built with React, Formik, and Material UI.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- Easy to use generic form component
|
|
8
|
+
- Built-in validation
|
|
9
|
+
- Material UI styling
|
|
10
|
+
- Customizable form controls
|
|
11
|
+
- TypeScript support
|
|
12
|
+
|
|
13
|
+
## Installation
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
npm install generic-form-library
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Usage
|
|
20
|
+
|
|
21
|
+
```jsx
|
|
22
|
+
import { GenericForm } from 'generic-form-library';
|
|
23
|
+
|
|
24
|
+
const formControls = [
|
|
25
|
+
{
|
|
26
|
+
type: "text",
|
|
27
|
+
name: "name",
|
|
28
|
+
label: "Name",
|
|
29
|
+
placeholder: "Enter your name",
|
|
30
|
+
gridValues: { xs: 12 },
|
|
31
|
+
validations: {
|
|
32
|
+
required: { message: "Name is required" }
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
{
|
|
36
|
+
type: "email",
|
|
37
|
+
name: "email",
|
|
38
|
+
label: "Email",
|
|
39
|
+
placeholder: "Enter your email",
|
|
40
|
+
gridValues: { xs: 12 },
|
|
41
|
+
validations: {
|
|
42
|
+
required: { message: "Email is required" },
|
|
43
|
+
email: { message: "Must be a valid email" }
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
];
|
|
47
|
+
|
|
48
|
+
const handleSubmit = (values) => {
|
|
49
|
+
console.log("Form values:", values);
|
|
50
|
+
};
|
|
51
|
+
|
|
52
|
+
function App() {
|
|
53
|
+
return (
|
|
54
|
+
<GenericForm
|
|
55
|
+
name="exampleForm"
|
|
56
|
+
title="Example Form"
|
|
57
|
+
controles={formControls}
|
|
58
|
+
submitFunction={handleSubmit}
|
|
59
|
+
/>
|
|
60
|
+
);
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
export default App;
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
## API
|
|
67
|
+
|
|
68
|
+
### GenericForm Props
|
|
69
|
+
|
|
70
|
+
| Prop | Type | Description |
|
|
71
|
+
|------|------|-------------|
|
|
72
|
+
| name | string | Unique identifier for the form |
|
|
73
|
+
| title | string | Form title |
|
|
74
|
+
| endpointPath | string | API endpoint for form submission |
|
|
75
|
+
| controles | ITextField[] | Array of form controls |
|
|
76
|
+
| submitFunction | function | Custom submit handler |
|
|
77
|
+
|
|
78
|
+
### ITextField
|
|
79
|
+
|
|
80
|
+
| Property | Type | Description |
|
|
81
|
+
|----------|------|-------------|
|
|
82
|
+
| type | 'text' \| 'email' \| 'password' \| 'number' \| 'select' \| 'checkbox' \| 'radio' | Type of input |
|
|
83
|
+
| name | string | Field name |
|
|
84
|
+
| label | string | Label for the field |
|
|
85
|
+
| placeholder | string | Placeholder text |
|
|
86
|
+
| options | { value: string; label: string }[] | Options for select and radio inputs |
|
|
87
|
+
| gridValues | { xs, sm, md, lg, xl } | Grid sizing for responsive layout |
|
|
88
|
+
| validations | Object | Validation rules |
|
|
89
|
+
|
|
90
|
+
## License
|
|
91
|
+
|
|
92
|
+
MIT
|
package/dist/App.d.ts
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { IGenericControls } from '../../types/controls/controls.types';
|
|
2
|
+
export declare const GForm: ({ controlArray, dataSource, editMode, initialValue, }: {
|
|
3
|
+
controlArray: IGenericControls[];
|
|
4
|
+
dataSource: any;
|
|
5
|
+
editMode: boolean;
|
|
6
|
+
initialValue: any;
|
|
7
|
+
}) => import("react/jsx-runtime").JSX.Element[];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const FormContainer: ({ modalType, name, setIdFunction, children, visible, setVisible, }: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const GridContainer: ({ hideButtons, sx, children }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Radios: ({ items, labelPlacement }: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicAutocompleteFields: ({ id, gridSx, initialValue, gridValues, name, label, disabled, hidden, placeholder, sx, multiple, options, validations, formValue, disabledOnEdit, editMode, persist, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicCheckFields: ({ id, gridSx, defaultValue, gridValues, name, label, disabled, hidden, sx, labelPlacement, color, customIcons, onChange, disabledOnEdit, editMode, persist, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicCustomComponent: ({ id, gridSx, initialValue, gridValues, name, label, disabled, hidden, sx, component, validations, persist, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicDateFields: ({ name, gridValues, label, disabled, gridSx, hidden, disableFuture, sx, validations, disabledOnEdit, editMode, initialValue, persist, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicTextFields: ({ id, gridSx, initialValue, gridValues, name, label, color, disabled, hidden, focused, placeholder, pattern, sx, onChange, validations, multiline, disabledOnEdit, editMode, persist, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicNumberFields: ({ id, gridSx, initialValue, gridValues, name, label, color, disabled, hidden, focused, placeholder, sx, onChange, validations, disabledOnEdit, editMode, persist, decimalScale, prefix, allowNegative, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicRadioFields: ({ id, gridSx, initialValue, gridValues, name, label, disabled, hidden, sx, radios, options, direction, labelPlacement, validations, disabledOnEdit, editMode, onChangeCallback, persist, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicRatingFields: ({ id, gridSx, initialValue, gridValues, name, label, disabled, hidden, sx, customIcons, max, color, validations, persist, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicSelectFields: ({ id, type, gridSx, initialValue, gridValues, name, label, disabled, hidden, sx, multiple, options, placeholder, group, validations, onChange, checkValues, disabledOnEdit, editMode, useRef, showDelete, persist, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicSliderFields: ({ name, label, disabled, initialValue, gridSx, hidden, sx, startIcon, endIcon, min, max, validations, gridValues, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicSwitchFields: (props: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasicTimeFields: (props: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const ScannerGeneric: ({ disabled, hidden, gridValues, parseFunction, closeOnScan, }: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { IGenericControls } from '../types/controls/controls.types';
|
|
2
|
+
import { IConnectionMode } from '../types/forms.types';
|
|
3
|
+
export declare const initializeForm: (controls: IGenericControls[], endpointPath: string, idForEdit: any, connectionMode: IConnectionMode, getByIdFunction?: Function, specificGetItems?: any) => Promise<{
|
|
4
|
+
initialFormData: any;
|
|
5
|
+
validationSchema: any;
|
|
6
|
+
dataSource: any;
|
|
7
|
+
editMode: boolean;
|
|
8
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const normalize: (values: any) => any;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { IValidationFunctions, IValidationMap } from '../types/validation.types';
|
|
2
|
+
import { EControlsForValidate } from '../types/common.types';
|
|
3
|
+
import { IConnectionMode } from '../types/forms.types';
|
|
4
|
+
import { IGenericControls } from '../types/controls/controls.types';
|
|
5
|
+
export declare const defaultValueMap: Record<EControlsForValidate, string | number | string[] | boolean | {} | null>;
|
|
6
|
+
export declare const typeValidationMap: IValidationMap;
|
|
7
|
+
export declare const validationFunctions: IValidationFunctions;
|
|
8
|
+
export declare const initForm: (controls: IGenericControls[], endpointPath: string, idForEdit: any, connectionMode: IConnectionMode) => {
|
|
9
|
+
initialFormData: any;
|
|
10
|
+
validationSchema: any;
|
|
11
|
+
dataSet: any;
|
|
12
|
+
};
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import { SxProps } from '@mui/system';
|
|
2
|
+
import * as Colors from "@mui/material/colors";
|
|
3
|
+
import * as Icons from "@mui/icons-material";
|
|
4
|
+
export type IconNames = keyof typeof Icons;
|
|
5
|
+
export type IconColor = keyof typeof Colors;
|
|
6
|
+
export type IconProps = {
|
|
7
|
+
iconName: IconNames;
|
|
8
|
+
};
|
|
9
|
+
export type ICommonProps = {
|
|
10
|
+
name: string;
|
|
11
|
+
label: string;
|
|
12
|
+
id?: string;
|
|
13
|
+
placeholder?: string;
|
|
14
|
+
sx?: SxProps;
|
|
15
|
+
gridValues?: IGridValues;
|
|
16
|
+
gridSx?: SxProps;
|
|
17
|
+
disabled?: IDisableFunction;
|
|
18
|
+
hidden?: IDisableFunction;
|
|
19
|
+
onChange?: IOnChangeFunction;
|
|
20
|
+
options?: Object;
|
|
21
|
+
disabledOnEdit?: boolean;
|
|
22
|
+
persist?: boolean;
|
|
23
|
+
};
|
|
24
|
+
export type IOptionsProps = ICommonProps & {
|
|
25
|
+
group?: boolean;
|
|
26
|
+
options?: any[];
|
|
27
|
+
defaultValue?: string | string[];
|
|
28
|
+
url?: string;
|
|
29
|
+
};
|
|
30
|
+
export type IInputProps = ICommonProps & {
|
|
31
|
+
color?: "primary" | "secondary" | "success" | "error" | "info" | "warning";
|
|
32
|
+
fullWidth?: boolean;
|
|
33
|
+
focused?: boolean;
|
|
34
|
+
defaultValue?: string;
|
|
35
|
+
};
|
|
36
|
+
export type ITimeControls = ICommonProps & {
|
|
37
|
+
disableFuture?: boolean;
|
|
38
|
+
disablePast?: boolean;
|
|
39
|
+
maxDate?: string;
|
|
40
|
+
minDate?: string;
|
|
41
|
+
defaultValue?: string;
|
|
42
|
+
};
|
|
43
|
+
export type IRadios = {
|
|
44
|
+
denominacion: string;
|
|
45
|
+
idconcepto: string;
|
|
46
|
+
};
|
|
47
|
+
export type IChecks = ICommonProps & {
|
|
48
|
+
labelPlacement?: "top" | "start" | "bottom" | "end";
|
|
49
|
+
color?: ColorValueHex | IconColor;
|
|
50
|
+
defaultValue?: boolean;
|
|
51
|
+
};
|
|
52
|
+
export type ICustomIcons = {
|
|
53
|
+
customIcons?: IAlternateIcons;
|
|
54
|
+
};
|
|
55
|
+
export type IDisableFunction = (args?: any, refs?: any) => boolean;
|
|
56
|
+
export type IOnChangeFunction = (event?: any, refs?: any) => void;
|
|
57
|
+
export type ControlDictionary = Record<EControls, (props: any) => any>;
|
|
58
|
+
export type ColorValueHex = `#${string}`;
|
|
59
|
+
export type EControls = "scanner" | "text" | "number" | "select" | "multiselect" | "autocomplete" | "date" | "time" | "radio" | "check" | "switch" | "slider" | "rating" | "component";
|
|
60
|
+
export type EControlsForValidate = "text" | "number" | "select" | "autocomplete" | "multiselect" | "date" | "time" | "radio" | "check" | "switch" | "slider" | "component" | "rating";
|
|
61
|
+
type IAlternateIcons = {
|
|
62
|
+
outlinedIcon: IconNames;
|
|
63
|
+
filledIcon: IconNames;
|
|
64
|
+
};
|
|
65
|
+
export type IGridValues = {
|
|
66
|
+
xs?: IBreakPointsValues;
|
|
67
|
+
sm?: IBreakPointsValues;
|
|
68
|
+
md?: IBreakPointsValues;
|
|
69
|
+
lg?: IBreakPointsValues;
|
|
70
|
+
xl?: IBreakPointsValues;
|
|
71
|
+
};
|
|
72
|
+
type IBreakPointsValues = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
|
|
73
|
+
export {};
|
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
import { IChecks, ICommonProps, ICustomIcons, IInputProps, IOnChangeFunction, IOptionsProps, IRadios, ITimeControls, IconColor, IconNames } from '../common.types';
|
|
2
|
+
import { IDateValidation, IMultiSelectValidation, INumberValidation, IRadioValidations, IRatingValidations, ISelectValidation, ISliderValidations, ITextValidation } from '../validation.types';
|
|
3
|
+
export type IGenericControls = IScanner | ITextField | ISelect | IMultiSelect | INumberField | IAutocomplete | IDatePicker | ITimePicker | IRadio | ICheck | ISwitch | ISlider | IRating | ICustomComponent;
|
|
4
|
+
export type ITextField = {
|
|
5
|
+
/**
|
|
6
|
+
* Tipo de control que desea crear.
|
|
7
|
+
*/
|
|
8
|
+
type: "text";
|
|
9
|
+
pattern?: RegExp;
|
|
10
|
+
validations?: ITextValidation;
|
|
11
|
+
hidden?: any;
|
|
12
|
+
multiline?: multiline;
|
|
13
|
+
} & IInputProps;
|
|
14
|
+
type multiline = {
|
|
15
|
+
minRows?: number;
|
|
16
|
+
maxRows?: number;
|
|
17
|
+
} | boolean;
|
|
18
|
+
export type IScanner = {
|
|
19
|
+
/**
|
|
20
|
+
* Tipo de control que desea crear.
|
|
21
|
+
*/
|
|
22
|
+
type: "scanner";
|
|
23
|
+
parseFunction: (scannerResult: any) => Record<string, any>;
|
|
24
|
+
closeOnScan: boolean;
|
|
25
|
+
} & ICommonProps;
|
|
26
|
+
export type IPhoneOrEmail = {
|
|
27
|
+
/**
|
|
28
|
+
* Tipo de control que desea crear.
|
|
29
|
+
*/
|
|
30
|
+
type: "phoneOrEmail";
|
|
31
|
+
validations?: IPhoneOrEmail;
|
|
32
|
+
} & IInputProps;
|
|
33
|
+
export type INumberField = {
|
|
34
|
+
/**
|
|
35
|
+
* Tipo de control que desea crear.
|
|
36
|
+
*/
|
|
37
|
+
type: "number";
|
|
38
|
+
format: "units" | "finance" | "other";
|
|
39
|
+
mask?: string;
|
|
40
|
+
decimalScale?: number;
|
|
41
|
+
fixDecimalSeparator?: boolean;
|
|
42
|
+
avoidSeparator?: boolean;
|
|
43
|
+
prefix?: string;
|
|
44
|
+
validations?: INumberValidation;
|
|
45
|
+
negativeValues?: boolean;
|
|
46
|
+
} & IInputProps;
|
|
47
|
+
export type ISelect = {
|
|
48
|
+
/**
|
|
49
|
+
* Tipo de control que desea crear.
|
|
50
|
+
*/
|
|
51
|
+
type: "select";
|
|
52
|
+
validations?: ISelectValidation;
|
|
53
|
+
checkValues?: any[];
|
|
54
|
+
useRef?: any;
|
|
55
|
+
showDelete?: boolean;
|
|
56
|
+
} & IOptionsProps;
|
|
57
|
+
export type IMultiSelect = {
|
|
58
|
+
type: "multiselect";
|
|
59
|
+
validations?: IMultiSelectValidation;
|
|
60
|
+
checkValues?: any[];
|
|
61
|
+
useRef?: any;
|
|
62
|
+
} & IOptionsProps;
|
|
63
|
+
export type IAutocomplete = {
|
|
64
|
+
/**
|
|
65
|
+
* Tipo de control que desea crear.
|
|
66
|
+
*/
|
|
67
|
+
type: "autocomplete";
|
|
68
|
+
validations?: ISelectValidation;
|
|
69
|
+
loadingText?: string;
|
|
70
|
+
} & IOptionsProps;
|
|
71
|
+
export type IDatePicker = {
|
|
72
|
+
/**
|
|
73
|
+
* Tipo de control que desea crear.
|
|
74
|
+
*/
|
|
75
|
+
type: "date";
|
|
76
|
+
validations?: IDateValidation;
|
|
77
|
+
} & ITimeControls;
|
|
78
|
+
export type ITimePicker = {
|
|
79
|
+
/**
|
|
80
|
+
* Tipo de control que desea crear.
|
|
81
|
+
*/
|
|
82
|
+
validations?: IDateValidation;
|
|
83
|
+
type: "time";
|
|
84
|
+
} & ITimeControls;
|
|
85
|
+
export type IRadio = {
|
|
86
|
+
/**
|
|
87
|
+
* Tipo de control que desea crear.
|
|
88
|
+
*/
|
|
89
|
+
type: "radio";
|
|
90
|
+
direction?: "row" | "col";
|
|
91
|
+
labelPlacement?: "top" | "start" | "bottom" | "end";
|
|
92
|
+
radios?: IRadios[];
|
|
93
|
+
validations?: IRadioValidations;
|
|
94
|
+
url?: string;
|
|
95
|
+
defaultValue?: string;
|
|
96
|
+
onChangeCallback?: IOnChangeFunction;
|
|
97
|
+
} & ICommonProps;
|
|
98
|
+
export type ICheck = {
|
|
99
|
+
/**
|
|
100
|
+
* Tipo de control que desea crear.
|
|
101
|
+
*/
|
|
102
|
+
type: "check";
|
|
103
|
+
} & IChecks & ICustomIcons;
|
|
104
|
+
export type ISwitch = {
|
|
105
|
+
/**
|
|
106
|
+
* Tipo de control que desea crear.
|
|
107
|
+
*/
|
|
108
|
+
type: "switch";
|
|
109
|
+
} & IChecks;
|
|
110
|
+
export type IRating = {
|
|
111
|
+
/**
|
|
112
|
+
* Tipo de control que desea crear.
|
|
113
|
+
*/
|
|
114
|
+
type: "rating";
|
|
115
|
+
precision?: boolean;
|
|
116
|
+
max?: number;
|
|
117
|
+
color?: IconColor;
|
|
118
|
+
defaultValue?: number;
|
|
119
|
+
validations?: IRatingValidations;
|
|
120
|
+
} & ICommonProps & ICustomIcons;
|
|
121
|
+
export type ISlider = {
|
|
122
|
+
/**
|
|
123
|
+
* Tipo de control que desea crear.
|
|
124
|
+
*/
|
|
125
|
+
type: "slider";
|
|
126
|
+
startIcon?: IconNames;
|
|
127
|
+
endIcon?: IconNames;
|
|
128
|
+
step?: number;
|
|
129
|
+
mark?: boolean;
|
|
130
|
+
min: number;
|
|
131
|
+
defaultValue?: number;
|
|
132
|
+
max: number;
|
|
133
|
+
validations?: ISliderValidations;
|
|
134
|
+
valueLabelDisplay?: "auto" | "on" | "off";
|
|
135
|
+
} & ICommonProps;
|
|
136
|
+
export type ICustomComponent = {
|
|
137
|
+
type: "component";
|
|
138
|
+
component: (props: {
|
|
139
|
+
id?: any;
|
|
140
|
+
initialValue?: any;
|
|
141
|
+
gridValues?: any;
|
|
142
|
+
name?: any;
|
|
143
|
+
label?: any;
|
|
144
|
+
disabled?: any;
|
|
145
|
+
hidden?: any;
|
|
146
|
+
sx?: any;
|
|
147
|
+
component?: any;
|
|
148
|
+
validations?: any;
|
|
149
|
+
formValue?: any;
|
|
150
|
+
error?: any;
|
|
151
|
+
setFieldValue?: any;
|
|
152
|
+
setFieldTouched?: any;
|
|
153
|
+
values?: any;
|
|
154
|
+
}) => any;
|
|
155
|
+
} & ICommonProps;
|
|
156
|
+
export {};
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { IGenericControls } from './controls/controls.types';
|
|
2
|
+
import { SetStateAction } from 'react';
|
|
3
|
+
import { SxProps } from '@mui/system';
|
|
4
|
+
export type IGForm = {
|
|
5
|
+
name: string;
|
|
6
|
+
title?: string;
|
|
7
|
+
editTitle?: string;
|
|
8
|
+
createTitle?: string;
|
|
9
|
+
endpointPath: string;
|
|
10
|
+
controls: IGenericControls[];
|
|
11
|
+
showSpecificDescription?: boolean;
|
|
12
|
+
idForEdit?: string | number | any | null;
|
|
13
|
+
modalType?: "xs" | "sm" | "md" | "lg" | "xl" | "fullWith";
|
|
14
|
+
description?: string;
|
|
15
|
+
descriptionOnCreate?: string;
|
|
16
|
+
descriptionOnEdit?: string;
|
|
17
|
+
applyButton?: boolean;
|
|
18
|
+
connectionMode?: IConnectionMode;
|
|
19
|
+
setIdFunction?: (idForEdit: any) => void;
|
|
20
|
+
submitFunction?: (values: any, name: string, idForEdit: any, event: any) => void;
|
|
21
|
+
getByIdFunction?: (idForEdit: any) => any;
|
|
22
|
+
hideButtons?: boolean;
|
|
23
|
+
nextButton?: IFormAction;
|
|
24
|
+
prevButton?: IFormAction;
|
|
25
|
+
saveOnDirty?: boolean;
|
|
26
|
+
saveButton?: string;
|
|
27
|
+
updateButton?: string;
|
|
28
|
+
dataAction?: {
|
|
29
|
+
label: string;
|
|
30
|
+
action: (values: any) => void;
|
|
31
|
+
}[];
|
|
32
|
+
notifyValidation?: (values?: any) => Promise<string | void> | string | void;
|
|
33
|
+
applyDisabledFunction?: (values?: any) => boolean;
|
|
34
|
+
acceptDisabledFunction?: (values?: any) => boolean;
|
|
35
|
+
submitDisabledFunction?: (values?: any) => boolean;
|
|
36
|
+
nextDisabledFunction?: (values?: any) => boolean;
|
|
37
|
+
prevDisabledFunction?: (values?: any) => boolean;
|
|
38
|
+
setExternalErrors?: SetStateAction<any>;
|
|
39
|
+
sx?: SxProps;
|
|
40
|
+
gridContainerSx?: SxProps;
|
|
41
|
+
notificationProvider?: any;
|
|
42
|
+
specificGetItems?: any;
|
|
43
|
+
Loading?: any;
|
|
44
|
+
visible?: boolean;
|
|
45
|
+
setVisible?: (state: boolean) => void;
|
|
46
|
+
};
|
|
47
|
+
export type IConnectionMode = "multiple" | "unified" | "grouped" | "onDemand" | undefined;
|
|
48
|
+
type IFormAction = {
|
|
49
|
+
text: string;
|
|
50
|
+
action: (values?: any) => void;
|
|
51
|
+
submitOnAction?: boolean;
|
|
52
|
+
};
|
|
53
|
+
export {};
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
import { EControlsForValidate } from './common.types';
|
|
2
|
+
import { Schema } from 'yup';
|
|
3
|
+
export interface ITestFunction {
|
|
4
|
+
/**
|
|
5
|
+
* @param values Valore del formulario.
|
|
6
|
+
* @returns Define si la validación se cumple o no.
|
|
7
|
+
*/
|
|
8
|
+
(values?: any): boolean | void;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* Prueba para validar el campo
|
|
12
|
+
*/
|
|
13
|
+
export type ITest = {
|
|
14
|
+
/**
|
|
15
|
+
* Mensaje que se mostrará en el error.
|
|
16
|
+
*
|
|
17
|
+
* @type {string}
|
|
18
|
+
*/
|
|
19
|
+
message: string;
|
|
20
|
+
/**
|
|
21
|
+
* Función que valida el campo.
|
|
22
|
+
*
|
|
23
|
+
* @type {ITestFunction}
|
|
24
|
+
*/
|
|
25
|
+
test: ITestFunction;
|
|
26
|
+
};
|
|
27
|
+
export type ICustomValidation = {
|
|
28
|
+
tests?: ITest[];
|
|
29
|
+
};
|
|
30
|
+
export type ITextValidation = {
|
|
31
|
+
required?: IRequiredValidation;
|
|
32
|
+
regex?: IRegexValidation;
|
|
33
|
+
email?: IEmailValidation;
|
|
34
|
+
url?: IUrlValidation;
|
|
35
|
+
lowercase?: ILowerCaseValidation;
|
|
36
|
+
uppercase?: IUppercaseValidation;
|
|
37
|
+
trim?: ITrimValidation;
|
|
38
|
+
length?: ILimitsProps;
|
|
39
|
+
} & ILimitsValidation & ICustomValidation;
|
|
40
|
+
export type IPhoneOrEmail = {
|
|
41
|
+
required?: IRequiredValidation;
|
|
42
|
+
regex?: IRegexValidation;
|
|
43
|
+
email?: IEmailValidation;
|
|
44
|
+
} & ILimitsValidation;
|
|
45
|
+
export type IWhenValidation = {
|
|
46
|
+
when?: {
|
|
47
|
+
name: string;
|
|
48
|
+
expression: (value: any) => boolean;
|
|
49
|
+
};
|
|
50
|
+
};
|
|
51
|
+
export type INumberValidation = {
|
|
52
|
+
required?: IRequiredValidation;
|
|
53
|
+
length?: ILimitsProps;
|
|
54
|
+
positive?: IPositiveValidation;
|
|
55
|
+
negative?: INegativeValidation;
|
|
56
|
+
integer?: IIntegerValidation;
|
|
57
|
+
} & IComparativeValidations & ILimitsValidation & ICustomValidation;
|
|
58
|
+
export type IDateValidation = {
|
|
59
|
+
required?: IRequiredValidation;
|
|
60
|
+
} & ILimitsValidation & ICustomValidation;
|
|
61
|
+
export type IRadioValidations = {
|
|
62
|
+
required?: IRequiredValidation;
|
|
63
|
+
} & ICustomValidation;
|
|
64
|
+
export type ISelectValidation = {
|
|
65
|
+
required?: IRequiredValidation;
|
|
66
|
+
} & ILimitsValidation & ICustomValidation;
|
|
67
|
+
export type IMultiSelectValidation = {
|
|
68
|
+
length?: IArrayLengthValidation;
|
|
69
|
+
required?: IRequiredValidation;
|
|
70
|
+
} & ILimitsValidation & ICustomValidation;
|
|
71
|
+
export type IRatingValidations = ILimitsValidation & IComparativeValidations & ICustomValidation;
|
|
72
|
+
export type ISliderValidations = IRatingValidations & ICustomValidation;
|
|
73
|
+
type IRequiredValidation = ICommonValidationsProps;
|
|
74
|
+
type IEmailValidation = ICommonValidationsProps;
|
|
75
|
+
type IUrlValidation = ICommonValidationsProps;
|
|
76
|
+
type ILowerCaseValidation = ICommonValidationsProps;
|
|
77
|
+
type IUppercaseValidation = ICommonValidationsProps;
|
|
78
|
+
type ITrimValidation = ICommonValidationsProps;
|
|
79
|
+
type INegativeValidation = ICommonValidationsProps;
|
|
80
|
+
type IPositiveValidation = ICommonValidationsProps;
|
|
81
|
+
type IIntegerValidation = ICommonValidationsProps;
|
|
82
|
+
type IRegexValidation = {
|
|
83
|
+
reference?: string;
|
|
84
|
+
value: RegExp;
|
|
85
|
+
} & ICommonValidationsProps;
|
|
86
|
+
type IArrayLengthValidation = {
|
|
87
|
+
reference?: string;
|
|
88
|
+
value: number;
|
|
89
|
+
} & ICommonValidationsProps;
|
|
90
|
+
type ICommonValidationsProps = {
|
|
91
|
+
message: string;
|
|
92
|
+
} & IWhenValidation;
|
|
93
|
+
type ILimitsProps = {
|
|
94
|
+
reference?: string;
|
|
95
|
+
value: number;
|
|
96
|
+
} & ICommonValidationsProps;
|
|
97
|
+
type ILessThanValidations = {
|
|
98
|
+
reference?: string;
|
|
99
|
+
value: number;
|
|
100
|
+
} & ICommonValidationsProps;
|
|
101
|
+
type IMoreThanValidations = {
|
|
102
|
+
reference?: string;
|
|
103
|
+
value: number;
|
|
104
|
+
} & ICommonValidationsProps;
|
|
105
|
+
type ILimitsValidation = {
|
|
106
|
+
min?: ILimitsProps;
|
|
107
|
+
max?: ILimitsProps;
|
|
108
|
+
};
|
|
109
|
+
type IComparativeValidations = {
|
|
110
|
+
lessThan?: ILessThanValidations;
|
|
111
|
+
moreThan?: IMoreThanValidations;
|
|
112
|
+
};
|
|
113
|
+
export type IValidationMap = Record<EControlsForValidate, Schema>;
|
|
114
|
+
export type IValidationSchemaMap = {
|
|
115
|
+
required: IRequiredSchema;
|
|
116
|
+
length: ILengthSchema;
|
|
117
|
+
min: IMinSchema;
|
|
118
|
+
max: IMaxSchema;
|
|
119
|
+
moreThan: IMoreThanSchema;
|
|
120
|
+
lessThan: ILessThanSchema;
|
|
121
|
+
integer: IIntegerSchema;
|
|
122
|
+
positive: IPositiveSchema;
|
|
123
|
+
negative: INegativeSchema;
|
|
124
|
+
regular_expression: IRegExpSchema;
|
|
125
|
+
email: IEmailSchema;
|
|
126
|
+
url: IUrlSchema;
|
|
127
|
+
oneOf: IOneOfSchema;
|
|
128
|
+
tests: ITestsSchema;
|
|
129
|
+
};
|
|
130
|
+
export type EValidations = "required" | "length" | "email" | "url" | "regular_expression" | "min" | "max" | "integer" | "moreThan" | "lessThan" | "positive" | "negative" | "tests" | "oneOf";
|
|
131
|
+
export type IValidationFunctions = Record<string, (schema: any, params: any) => any>;
|
|
132
|
+
export type IRequiredSchema = {
|
|
133
|
+
required: (schema: any, { message }: any) => any;
|
|
134
|
+
};
|
|
135
|
+
export type ILengthSchema = {
|
|
136
|
+
length: (schema: any, { message, value, ref }: any) => any;
|
|
137
|
+
};
|
|
138
|
+
export type IMinSchema = {
|
|
139
|
+
min: (schema: any, { message, value, ref }: any) => any;
|
|
140
|
+
};
|
|
141
|
+
export type IMaxSchema = {
|
|
142
|
+
max: (schema: any, { message, value, ref }: any) => any;
|
|
143
|
+
};
|
|
144
|
+
export type IMoreThanSchema = {
|
|
145
|
+
moreThan: (schema: any, { message, value, ref }: any) => any;
|
|
146
|
+
};
|
|
147
|
+
export type ILessThanSchema = {
|
|
148
|
+
lessThan: (schema: any, { message, value, ref }: any) => any;
|
|
149
|
+
};
|
|
150
|
+
export type IIntegerSchema = {
|
|
151
|
+
integer: (schema: any, { message }: any) => any;
|
|
152
|
+
};
|
|
153
|
+
export type IPositiveSchema = {
|
|
154
|
+
positive: (schema: any, { message }: any) => any;
|
|
155
|
+
};
|
|
156
|
+
export type INegativeSchema = {
|
|
157
|
+
negative: (schema: any, { message }: any) => any;
|
|
158
|
+
};
|
|
159
|
+
export type IRegExpSchema = {
|
|
160
|
+
regular_expression: (schema: any, { message, value, ref }: any) => any;
|
|
161
|
+
};
|
|
162
|
+
export type IEmailSchema = {
|
|
163
|
+
email: (schema: any, { message }: any) => any;
|
|
164
|
+
};
|
|
165
|
+
export type IUrlSchema = {
|
|
166
|
+
url: (schema: any, { message }: any) => any;
|
|
167
|
+
};
|
|
168
|
+
export type IOneOfSchema = {
|
|
169
|
+
oneOf: (schema: any, { message, value, ref }: any) => any;
|
|
170
|
+
};
|
|
171
|
+
export type ITestsSchema = {
|
|
172
|
+
tests: (schema: any, tests: ITest[]) => any;
|
|
173
|
+
};
|
|
174
|
+
export {};
|