@arquimedes.co/eureka-forms 1.9.16-test → 1.9.19-test
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/App.js +98 -205
- package/dist/AxiosAPI.js +3 -3
- package/dist/AxiosWidget.js +4 -4
- package/dist/FormComponents/Form/ColumnForm/ColumnForm.js +104 -207
- package/dist/FormComponents/Form/ConfirmationDialog/ConfirmationDialog.js +5 -17
- package/dist/FormComponents/Form/Form.js +29 -56
- package/dist/FormComponents/Form/StepperForm/StepperForm.js +1 -1
- package/dist/FormComponents/Section/MaterialSection/MaterialSection.js +7 -30
- package/dist/FormComponents/Section/Section.js +2 -13
- package/dist/FormComponents/Step/@Construction/CBRIncidentsStep/CBRIncidentsStep.js +2 -13
- package/dist/FormComponents/Step/@Construction/CBRIncidentsStep/MaterialCBRIncidentsStep/Incident/Incident.js +9 -32
- package/dist/FormComponents/Step/@Construction/CBRIncidentsStep/MaterialCBRIncidentsStep/MaterialCBRIncidentsStep.js +47 -64
- package/dist/FormComponents/Step/@Construction/CBRLocativasStep/CBRLocativasStep.js +41 -102
- package/dist/FormComponents/Step/@Construction/CBRPropertyStep/CBRPropertyStep.js +37 -92
- package/dist/FormComponents/Step/AYFStepMapper.js +23 -75
- package/dist/FormComponents/Step/CBRStepMapper.js +56 -144
- package/dist/FormComponents/Step/CheckBoxStep/CheckBoxStep.js +3 -26
- package/dist/FormComponents/Step/CheckBoxStep/MaterialCheckBoxStep/MaterialCheckBoxStep.js +6 -21
- package/dist/FormComponents/Step/ClassifierSelectorStep/ClassifierSelectorStep.js +3 -26
- package/dist/FormComponents/Step/ClassifierSelectorStep/MaterialClassifierSelectorStep/MaterialClassifierSelectorStep.js +32 -65
- package/dist/FormComponents/Step/DatePickerStep/DatePickerStep.js +2 -13
- package/dist/FormComponents/Step/DatePickerStep/MaterialDatePickerStep/MaterialDatePickerStep.js +6 -21
- package/dist/FormComponents/Step/FileUploadStep/FileUploadStep.js +2 -13
- package/dist/FormComponents/Step/FileUploadStep/MaterialFileUploadStep/FileComponent/FileComponent.js +27 -88
- package/dist/FormComponents/Step/FileUploadStep/MaterialFileUploadStep/MaterialFileUploadStep.js +81 -171
- package/dist/FormComponents/Step/RatingStep/MaterialRatingStep/MaterialRatingStep.js +15 -41
- package/dist/FormComponents/Step/RatingStep/RatingStep.js +2 -13
- package/dist/FormComponents/Step/SelectorStep/MaterialSelectorStep/MaterialSelectorStep.js +25 -52
- package/dist/FormComponents/Step/SelectorStep/SelectorStep.js +3 -26
- package/dist/FormComponents/Step/SeparatorStep/MaterialSeparatorStep/MaterialSeparatorStep.js +1 -2
- package/dist/FormComponents/Step/SeparatorStep/SeparatorStep.js +3 -26
- package/dist/FormComponents/Step/SmartSelectStep/MaterialSmartSelectStep/MaterialSmartSelectStep.js +83 -145
- package/dist/FormComponents/Step/SmartSelectStep/SmartSelectStep.js +2 -13
- package/dist/FormComponents/Step/Step.js +19 -39
- package/dist/FormComponents/Step/StepFunctions.js +14 -16
- package/dist/FormComponents/Step/TextAreaStep/MaterialTextAreaStep/MaterialTextAreaStep.js +43 -62
- package/dist/FormComponents/Step/TextAreaStep/TextAreaStep.js +2 -13
- package/dist/FormComponents/Step/TextInputStep/MaterialTextInputStep/MaterialTextInputStep.js +6 -21
- package/dist/FormComponents/Step/TextInputStep/TextInputStep.js +2 -13
- package/dist/FormComponents/Step/TitleStep/MaterialTitleStep/MaterialTitleStep.js +3 -15
- package/dist/FormComponents/Step/TitleStep/TitleStep.js +3 -26
- package/dist/FormComponents/Term/MaterialTerm/MaterialTerm.js +19 -35
- package/dist/FormComponents/Term/Term.js +2 -13
- package/dist/Widget.js +13 -25
- package/dist/constants/Files/FileExtensions.js +3 -3
- package/dist/constants/Files/FileMaxSize.js +1 -1
- package/dist/constants/InternalFormStyle.js +1 -1
- package/dist/constants/MaterialClassNameSeed.js +1 -1
- package/dist/controllers/FileService.js +29 -86
- package/dist/index.js +4 -15
- package/dist/shared/Loader/Loader.js +5 -17
- package/dist/shared/Navbar/Navbar.js +2 -14
- package/dist/shared/Rating/Rating.js +4 -27
- package/dist/shared/Rating/Ratings/LikeRating.js +9 -21
- package/dist/shared/Rating/Ratings/SatisfactionRating.js +15 -27
- package/dist/shared/Rating/Ratings/ScaleRating.js +22 -49
- package/dist/shared/RoundedButton/RoundedButton.js +12 -24
- package/dist/shared/RoundedCheckBox/RoundedCheckBox.js +39 -84
- package/dist/shared/RoundedDatePicker/RoundedDatePicker.js +235 -286
- package/dist/shared/RoundedSelect/RoundedSelect.js +103 -152
- package/dist/shared/RoundedSmartSelect/RoundedSmartSelect.js +125 -160
- package/dist/shared/RoundedTextField/RoundedTextField.js +92 -137
- package/dist/utils/CbrFunctions.js +30 -30
- package/package.json +6 -4
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import Types, { ClassifierOptionTypes, OptionTypes, } from '../../constants/FormStepTypes';
|
|
2
2
|
export function calcFillerSize(step, steps, values, size) {
|
|
3
3
|
if (step.maxSize < size.blockNum) {
|
|
4
|
-
|
|
4
|
+
const stepSize = step.maxSize - recursivelyCheckOpenSize(step.id, steps, values);
|
|
5
5
|
return (size.blockSize * stepSize + size.spacingSize * (stepSize - 1) + 20);
|
|
6
6
|
}
|
|
7
7
|
else {
|
|
@@ -9,16 +9,15 @@ export function calcFillerSize(step, steps, values, size) {
|
|
|
9
9
|
}
|
|
10
10
|
}
|
|
11
11
|
export function recursivelyCheckOpenSize(idStep, steps, values) {
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
const step = steps[idStep];
|
|
13
|
+
const value = values[idStep];
|
|
14
14
|
if (step.type === Types.SELECTOR) {
|
|
15
|
-
|
|
15
|
+
let size = step.size;
|
|
16
16
|
if (value) {
|
|
17
|
-
|
|
18
|
-
if (
|
|
19
|
-
|
|
20
|
-
for (
|
|
21
|
-
var pStepId = _a[_i];
|
|
17
|
+
const currentOption = step.options.find((option) => option.value === value);
|
|
18
|
+
if (currentOption?.type === OptionTypes.NESTED) {
|
|
19
|
+
let optionSize = 0;
|
|
20
|
+
for (const pStepId of currentOption.steps) {
|
|
22
21
|
optionSize += recursivelyCheckOpenSize(pStepId, steps, values);
|
|
23
22
|
}
|
|
24
23
|
size += optionSize;
|
|
@@ -27,13 +26,12 @@ export function recursivelyCheckOpenSize(idStep, steps, values) {
|
|
|
27
26
|
return size;
|
|
28
27
|
}
|
|
29
28
|
if (step.type === Types.CLASSIFIER_SELECTOR) {
|
|
30
|
-
|
|
29
|
+
let size = step.size;
|
|
31
30
|
if (value) {
|
|
32
|
-
|
|
33
|
-
if (
|
|
34
|
-
|
|
35
|
-
for (
|
|
36
|
-
var pStepId = _c[_b];
|
|
31
|
+
const currentOption = step.options[value];
|
|
32
|
+
if (currentOption?.type === ClassifierOptionTypes.NESTED) {
|
|
33
|
+
let optionSize = 0;
|
|
34
|
+
for (const pStepId of currentOption.steps) {
|
|
37
35
|
optionSize += recursivelyCheckOpenSize(pStepId, steps, values);
|
|
38
36
|
}
|
|
39
37
|
size += optionSize;
|
|
@@ -45,6 +43,6 @@ export function recursivelyCheckOpenSize(idStep, steps, values) {
|
|
|
45
43
|
return 4;
|
|
46
44
|
}
|
|
47
45
|
}
|
|
48
|
-
export
|
|
46
|
+
export const calcStepWidth = (stepSize, size) => {
|
|
49
47
|
return size.blockSize * stepSize + size.spacingSize * (stepSize - 1);
|
|
50
48
|
};
|
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
|
|
13
2
|
import RoundedTextField from '../../../../shared/RoundedTextField/RoundedTextField';
|
|
14
3
|
import styles from './MaterialTextAreaStep.module.css';
|
|
@@ -19,93 +8,87 @@ import './DraftEditor.css';
|
|
|
19
8
|
import { convertFromRaw, EditorState } from 'draft-js';
|
|
20
9
|
import React, { useState } from 'react';
|
|
21
10
|
import { ClickAwayListener } from '@material-ui/core';
|
|
22
|
-
function TextAreaStep(
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
var backgroundColor = formStyle.stepBackgroundColor;
|
|
11
|
+
function TextAreaStep({ step, errors, partial, control, editable, postview, formStyle, maxLength, originalValues, backgroundColor, }) {
|
|
12
|
+
const [hovering, setHovering] = useState(false);
|
|
13
|
+
const [focus, setFocus] = useState(false);
|
|
14
|
+
const calcStyle = () => {
|
|
15
|
+
const backgroundColor = formStyle.stepBackgroundColor;
|
|
28
16
|
if (focus) {
|
|
29
17
|
return {
|
|
30
18
|
border: '2px solid ' + formStyle.primaryColor,
|
|
31
19
|
marginTop: -1,
|
|
32
20
|
marginLeft: -1,
|
|
33
21
|
marginBottom: 0,
|
|
34
|
-
backgroundColor
|
|
22
|
+
backgroundColor,
|
|
35
23
|
};
|
|
36
24
|
}
|
|
37
25
|
else if (hovering) {
|
|
38
26
|
return {
|
|
39
27
|
border: '1px solid ' + formStyle.primaryColor,
|
|
40
|
-
backgroundColor
|
|
28
|
+
backgroundColor,
|
|
41
29
|
};
|
|
42
30
|
}
|
|
43
31
|
else {
|
|
44
32
|
return {
|
|
45
33
|
border: '1px solid ' + formStyle.outlineColor,
|
|
46
|
-
backgroundColor
|
|
34
|
+
backgroundColor,
|
|
47
35
|
};
|
|
48
36
|
}
|
|
49
37
|
};
|
|
50
|
-
|
|
51
|
-
var _a;
|
|
38
|
+
const calcDefaultStringValue = (defaultValue) => {
|
|
52
39
|
if (typeof defaultValue === 'string') {
|
|
53
40
|
return defaultValue;
|
|
54
41
|
}
|
|
55
42
|
else {
|
|
56
|
-
return
|
|
43
|
+
return defaultValue?.text ?? '';
|
|
57
44
|
}
|
|
58
45
|
};
|
|
59
|
-
|
|
46
|
+
const calcDefaultDraftValue = (defaultValue) => {
|
|
60
47
|
if (typeof defaultValue === 'string') {
|
|
61
48
|
return EditorState.createWithContent(convertFromRaw(stringToDraft(defaultValue)));
|
|
62
49
|
}
|
|
63
50
|
else {
|
|
64
|
-
return EditorState.createWithContent(convertFromRaw(getRawText(defaultValue
|
|
51
|
+
return EditorState.createWithContent(convertFromRaw(getRawText(defaultValue?.draft, defaultValue?.text)));
|
|
65
52
|
}
|
|
66
53
|
};
|
|
67
|
-
|
|
54
|
+
const canEdit = editable && !postview;
|
|
68
55
|
if (step.hasTextEditor) {
|
|
69
|
-
return (_jsxs("div",
|
|
56
|
+
return (_jsxs("div", { className: styles.textEditorContainer, style: {
|
|
70
57
|
'--eureka-outline': formStyle.outlineColor,
|
|
71
58
|
'--eureka-primary': formStyle.primaryColor,
|
|
72
|
-
}
|
|
59
|
+
}, children: [step.label && (_jsxs("div", { className: styles.textEditorLabel, style: {
|
|
73
60
|
color: !!errors[step.id]
|
|
74
61
|
? formStyle.errorColor
|
|
75
62
|
: formStyle.textColor,
|
|
76
|
-
}
|
|
63
|
+
}, children: [step.label, " ", step.required ? ' *' : ''] })), _jsx(ClickAwayListener, { mouseEvent: "onMouseDown", onClickAway: () => {
|
|
77
64
|
if (canEdit) {
|
|
78
65
|
setFocus(false);
|
|
79
66
|
}
|
|
80
|
-
}
|
|
67
|
+
}, children: _jsx("div", { className: postview
|
|
81
68
|
? styles.postViewContainer +
|
|
82
69
|
' EF-DraftContainer'
|
|
83
|
-
: styles.textContainer + ' EF-DraftContainer', "data-testid": step.id, style: calcStyle(), onMouseEnter:
|
|
70
|
+
: styles.textContainer + ' EF-DraftContainer', "data-testid": step.id, style: calcStyle(), onMouseEnter: () => {
|
|
84
71
|
if (canEdit) {
|
|
85
72
|
setHovering(true);
|
|
86
73
|
}
|
|
87
|
-
}, onMouseLeave:
|
|
74
|
+
}, onMouseLeave: () => {
|
|
88
75
|
if (canEdit) {
|
|
89
76
|
setHovering(false);
|
|
90
77
|
}
|
|
91
|
-
}, onClick:
|
|
78
|
+
}, onClick: () => {
|
|
92
79
|
if (canEdit) {
|
|
93
80
|
setFocus(true);
|
|
94
81
|
}
|
|
95
|
-
}
|
|
82
|
+
}, children: _jsx(Controller, { name: step.id, control: control, defaultValue: originalValues[step.id]
|
|
96
83
|
? calcDefaultDraftValue(originalValues[step.id])
|
|
97
84
|
: EditorState.createEmpty(), rules: step.required
|
|
98
85
|
? {
|
|
99
|
-
validate:
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
.hasText();
|
|
103
|
-
},
|
|
86
|
+
validate: (editorState) => editorState
|
|
87
|
+
.getCurrentContent()
|
|
88
|
+
.hasText(),
|
|
104
89
|
}
|
|
105
|
-
: {}, shouldUnregister: true, render:
|
|
106
|
-
|
|
107
|
-
var field = _a.field;
|
|
108
|
-
var editorClassName = styles.editor;
|
|
90
|
+
: {}, shouldUnregister: true, render: ({ field }) => {
|
|
91
|
+
let editorClassName = styles.editor;
|
|
109
92
|
if (!field.value.getCurrentContent().hasText()) {
|
|
110
93
|
if (field.value
|
|
111
94
|
.getCurrentContent()
|
|
@@ -119,12 +102,12 @@ function TextAreaStep(_a) {
|
|
|
119
102
|
if (!canEdit) {
|
|
120
103
|
editorClassName += ' postview-editor';
|
|
121
104
|
}
|
|
122
|
-
return (_jsx(Editor, { editorRef: field.ref, onFocus:
|
|
105
|
+
return (_jsx(Editor, { editorRef: field.ref, onFocus: () => {
|
|
123
106
|
setFocus(true);
|
|
124
107
|
}, readOnly: !canEdit, onBlur: field.onBlur, stripPastedStyles: true, editorState: field.value, onEditorStateChange: field.onChange, toolbarClassName: styles.toolbar +
|
|
125
108
|
(!canEdit
|
|
126
109
|
? ' postview-editor-toolbar'
|
|
127
|
-
: ''), editorClassName: editorClassName, wrapperClassName: styles.wrapper, placeholder:
|
|
110
|
+
: ''), editorClassName: editorClassName, wrapperClassName: styles.wrapper, placeholder: step.description ?? '', toolbar: {
|
|
128
111
|
options: [
|
|
129
112
|
'inline',
|
|
130
113
|
'list',
|
|
@@ -142,38 +125,36 @@ function TextAreaStep(_a) {
|
|
|
142
125
|
options: ['unordered'],
|
|
143
126
|
},
|
|
144
127
|
} }));
|
|
145
|
-
} }) })
|
|
128
|
+
} }) }) }), _jsx("div", { className: styles.errorMsg, style: {
|
|
146
129
|
color: formStyle.errorColor,
|
|
147
|
-
}
|
|
130
|
+
}, children: !!errors[step.id] && 'Este campo es obligatorio' })] }));
|
|
148
131
|
}
|
|
149
132
|
else {
|
|
150
|
-
return (_jsx("div",
|
|
133
|
+
return (_jsx("div", { className: styles.container, style: {
|
|
151
134
|
paddingBottom: step.required || step.description || !!errors[step.id]
|
|
152
135
|
? '0px'
|
|
153
136
|
: '5px',
|
|
154
|
-
}
|
|
137
|
+
}, children: _jsx(Controller, { name: step.id, control: control, defaultValue: calcDefaultStringValue(originalValues[step.id]), rules: {
|
|
155
138
|
required: step.required
|
|
156
139
|
? 'Este campo es obligatorio'
|
|
157
140
|
: undefined,
|
|
158
|
-
}, shouldUnregister: true, render:
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
? errors[step.id].
|
|
163
|
-
:
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
} }, { children: field.value }))] })))] }));
|
|
167
|
-
} }) })));
|
|
141
|
+
}, shouldUnregister: true, render: ({ field }) => (_jsxs(React.Fragment, { children: [_jsx("div", { className: styles.erkTextArea, children: _jsx(RoundedTextField, { ...field, "data-testid": step.id, maxLength: maxLength, label: step.label, inputRef: field.ref, required: step.required, cantEdit: !canEdit, fontWeight: 400, multiline: true, minRows: postview && partial ? undefined : 4, focusColor: formStyle.primaryColor, outlineColor: formStyle.outlineColor, textColor: formStyle.textColor, errorColor: formStyle.errorColor, backgroundColor: backgroundColor ??
|
|
142
|
+
formStyle.backgroundColor, innerBackgroundColor: formStyle.stepBackgroundColor, helperTextColor: formStyle.descriptionTextColor, helperText: errors[step.id]
|
|
143
|
+
? errors[step.id].message
|
|
144
|
+
: step.description ??
|
|
145
|
+
(step.required ? ' ' : null), error: !!errors[step.id] }) }), postview && (_jsxs("div", { className: styles.print, children: [_jsxs("div", { children: [step.label, ":"] }), _jsx("p", { className: styles.printContainer, style: {
|
|
146
|
+
backgroundColor: formStyle.stepBackgroundColor,
|
|
147
|
+
borderColor: formStyle.outlineColor,
|
|
148
|
+
}, children: field.value })] }))] })) }) }));
|
|
168
149
|
}
|
|
169
150
|
}
|
|
170
151
|
export default TextAreaStep;
|
|
171
152
|
export function stringToDraft(text) {
|
|
172
|
-
|
|
153
|
+
let draftStructure = {
|
|
173
154
|
blocks: [],
|
|
174
155
|
entityMap: {},
|
|
175
156
|
};
|
|
176
|
-
text.split('\n').forEach(
|
|
157
|
+
text.split('\n').forEach((element, index) => {
|
|
177
158
|
draftStructure.blocks.push({
|
|
178
159
|
key: String(index),
|
|
179
160
|
text: element,
|
|
@@ -186,7 +167,7 @@ export function stringToDraft(text) {
|
|
|
186
167
|
});
|
|
187
168
|
return draftStructure;
|
|
188
169
|
}
|
|
189
|
-
export
|
|
170
|
+
export const getRawText = (draft, text) => {
|
|
190
171
|
if (draft !== undefined) {
|
|
191
172
|
return draft;
|
|
192
173
|
}
|
|
@@ -1,24 +1,13 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
2
|
import { FormStyleTypes } from '../../../constants/FormStepTypes';
|
|
14
3
|
import MaterialTextAreaStep from './MaterialTextAreaStep/MaterialTextAreaStep';
|
|
15
4
|
function TextAreaStep(props) {
|
|
16
5
|
switch (props.formStyle.type) {
|
|
17
6
|
case FormStyleTypes.MATERIAL: {
|
|
18
|
-
return _jsx(MaterialTextAreaStep,
|
|
7
|
+
return _jsx(MaterialTextAreaStep, { ...props });
|
|
19
8
|
}
|
|
20
9
|
default: {
|
|
21
|
-
return _jsx(MaterialTextAreaStep,
|
|
10
|
+
return _jsx(MaterialTextAreaStep, { ...props });
|
|
22
11
|
}
|
|
23
12
|
}
|
|
24
13
|
}
|
package/dist/FormComponents/Step/TextInputStep/MaterialTextInputStep/MaterialTextInputStep.js
CHANGED
|
@@ -1,29 +1,17 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
2
|
import RoundedTextField from '../../../../shared/RoundedTextField/RoundedTextField';
|
|
14
3
|
import styles from './MaterialTextInputStep.module.css';
|
|
15
4
|
import { Controller } from 'react-hook-form';
|
|
16
5
|
import { calcStepWidth } from '../../StepFunctions';
|
|
17
|
-
function TextInputStep(
|
|
18
|
-
|
|
19
|
-
return (_jsx("div", __assign({ className: styles.container, style: {
|
|
6
|
+
function TextInputStep({ icon, step, form, errors, control, editable, postview, formStyle, widthStats, defaultValue = '', }) {
|
|
7
|
+
return (_jsx("div", { className: styles.container, style: {
|
|
20
8
|
width: widthStats.currentBreakPoint <= step.size
|
|
21
9
|
? '100%'
|
|
22
10
|
: calcStepWidth(step.size, form.size),
|
|
23
11
|
minHeight: step.description || step.required || step.validation
|
|
24
12
|
? '55px'
|
|
25
13
|
: '43px',
|
|
26
|
-
}
|
|
14
|
+
}, children: _jsx(Controller, { name: step.id, control: control, defaultValue: defaultValue, rules: {
|
|
27
15
|
required: step.required
|
|
28
16
|
? 'Este campo es obligatorio'
|
|
29
17
|
: undefined,
|
|
@@ -33,11 +21,8 @@ function TextInputStep(_a) {
|
|
|
33
21
|
message: step.validation.message,
|
|
34
22
|
}
|
|
35
23
|
: undefined,
|
|
36
|
-
}, shouldUnregister: true, render:
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
? errors[step.id].message
|
|
40
|
-
: step.description, helperTextColor: formStyle.descriptionTextColor, error: !!errors[step.id], icon: step.showIcon ? icon : undefined })));
|
|
41
|
-
} }) })));
|
|
24
|
+
}, shouldUnregister: true, render: ({ field }) => (_jsx(RoundedTextField, { ...field, "data-testid": step.id, label: step.label, inputRef: field.ref, cantEdit: !editable || postview, required: step.required, fontWeight: 400, focusColor: formStyle.primaryColor, outlineColor: formStyle.outlineColor, textColor: formStyle.textColor, errorColor: formStyle.errorColor, backgroundColor: formStyle.backgroundColor, innerBackgroundColor: formStyle.stepBackgroundColor, helperText: errors[step.id]
|
|
25
|
+
? errors[step.id].message
|
|
26
|
+
: step.description, helperTextColor: formStyle.descriptionTextColor, error: !!errors[step.id], icon: step.showIcon ? icon : undefined })) }) }));
|
|
42
27
|
}
|
|
43
28
|
export default TextInputStep;
|
|
@@ -1,24 +1,13 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
2
|
import { FormStyleTypes } from '../../../constants/FormStepTypes';
|
|
14
3
|
import MaterialTextInputStep from './MaterialTextInputStep/MaterialTextInputStep';
|
|
15
4
|
function TextInputStep(props) {
|
|
16
5
|
switch (props.formStyle.type) {
|
|
17
6
|
case FormStyleTypes.MATERIAL: {
|
|
18
|
-
return _jsx(MaterialTextInputStep,
|
|
7
|
+
return _jsx(MaterialTextInputStep, { ...props });
|
|
19
8
|
}
|
|
20
9
|
default: {
|
|
21
|
-
return _jsx(MaterialTextInputStep,
|
|
10
|
+
return _jsx(MaterialTextInputStep, { ...props });
|
|
22
11
|
}
|
|
23
12
|
}
|
|
24
13
|
}
|
|
@@ -1,20 +1,8 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
2
|
import styles from './MaterialTitleStep.module.css';
|
|
14
|
-
function TitleStep(
|
|
15
|
-
|
|
16
|
-
return (_jsxs("div", __assign({ className: styles.container, style: { color: formStyle.textColor } }, { children: [_jsx("div", __assign({ className: styles.titleLbl, style: { textAlign: widthStats.isMobile ? 'center' : 'start' } }, { children: step.title })), step.description && (_jsx("p", __assign({ className: styles.descriptionPar, style: {
|
|
3
|
+
function TitleStep({ step, formStyle, widthStats, }) {
|
|
4
|
+
return (_jsxs("div", { className: styles.container, style: { color: formStyle.textColor }, children: [_jsx("div", { className: styles.titleLbl, style: { textAlign: widthStats.isMobile ? 'center' : 'start' }, children: step.title }), step.description && (_jsx("p", { className: styles.descriptionPar, style: {
|
|
17
5
|
margin: step.title ? '10px 0px' : '0px 0px 5px 0px',
|
|
18
|
-
}
|
|
6
|
+
}, children: step.description }))] }));
|
|
19
7
|
}
|
|
20
8
|
export default TitleStep;
|
|
@@ -1,36 +1,13 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
-
var t = {};
|
|
14
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
-
t[p] = s[p];
|
|
16
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
-
t[p[i]] = s[p[i]];
|
|
20
|
-
}
|
|
21
|
-
return t;
|
|
22
|
-
};
|
|
23
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
24
2
|
import { FormStyleTypes } from '../../../constants/FormStepTypes';
|
|
25
3
|
import MaterialTitleStep from './MaterialTitleStep/MaterialTitleStep';
|
|
26
|
-
function TitleStep(
|
|
27
|
-
var step = _a.step, formStyle = _a.formStyle, others = __rest(_a, ["step", "formStyle"]);
|
|
4
|
+
function TitleStep({ step, formStyle, ...others }) {
|
|
28
5
|
switch (formStyle.type) {
|
|
29
6
|
case FormStyleTypes.MATERIAL: {
|
|
30
|
-
return (_jsx(MaterialTitleStep,
|
|
7
|
+
return (_jsx(MaterialTitleStep, { step: step, formStyle: formStyle, ...others }));
|
|
31
8
|
}
|
|
32
9
|
default: {
|
|
33
|
-
return (_jsx(MaterialTitleStep,
|
|
10
|
+
return (_jsx(MaterialTitleStep, { step: step, formStyle: formStyle, ...others }));
|
|
34
11
|
}
|
|
35
12
|
}
|
|
36
13
|
}
|
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
2
|
import { Dialog } from '@material-ui/core';
|
|
14
3
|
import React from 'react';
|
|
@@ -18,60 +7,55 @@ import RoundedButton from '../../../shared/RoundedButton/RoundedButton';
|
|
|
18
7
|
import RoundedCheckBox from '../../../shared/RoundedCheckBox/RoundedCheckBox';
|
|
19
8
|
import CloseRoundedIcon from '@material-ui/icons/CloseRounded';
|
|
20
9
|
import styles from './MaterialTerm.module.css';
|
|
21
|
-
function TermComponent(
|
|
22
|
-
|
|
23
|
-
var term = _a.term, errors = _a.errors, control = _a.control, postview = _a.postview, setValue = _a.setValue, formStyle = _a.formStyle, tempError = _a.tempError;
|
|
24
|
-
var _c = useState(false), showDialog = _c[0], setShowDialog = _c[1];
|
|
10
|
+
function TermComponent({ term, errors, control, postview, setValue, formStyle, tempError, }) {
|
|
11
|
+
const [showDialog, setShowDialog] = useState(false);
|
|
25
12
|
/**
|
|
26
13
|
* Function that renders the highlighted text
|
|
27
14
|
* @returns a string with span highlighted
|
|
28
15
|
*/
|
|
29
|
-
|
|
16
|
+
const renderText = (text) => {
|
|
30
17
|
if (text) {
|
|
31
18
|
var parts = text.split(/{{(.*?)}}/gi);
|
|
32
19
|
for (var i = 1; i < parts.length; i += 2) {
|
|
33
|
-
parts[i] = (_jsx("span",
|
|
20
|
+
parts[i] = (_jsx("span", { className: styles.highlight, style: {
|
|
34
21
|
color: !!errors[term.id] && tempError
|
|
35
22
|
? formStyle.errorColor
|
|
36
23
|
: formStyle.primaryColor,
|
|
37
|
-
}, onClick:
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
24
|
+
}, onClick: () => {
|
|
25
|
+
if (term.clickEffect?.type === 'LINK') {
|
|
26
|
+
window
|
|
27
|
+
.open?.(term.clickEffect.url, '_blank')
|
|
28
|
+
?.focus?.();
|
|
42
29
|
}
|
|
43
|
-
else if (
|
|
30
|
+
else if (term.clickEffect?.type === 'DIALOG') {
|
|
44
31
|
setShowDialog(true);
|
|
45
32
|
}
|
|
46
|
-
}
|
|
33
|
+
}, children: parts[i] }, i));
|
|
47
34
|
}
|
|
48
35
|
return parts;
|
|
49
36
|
}
|
|
50
37
|
};
|
|
51
|
-
return (_jsxs(React.Fragment, { children: [_jsx(Dialog,
|
|
38
|
+
return (_jsxs(React.Fragment, { children: [_jsx(Dialog, { PaperProps: {
|
|
52
39
|
style: {
|
|
53
40
|
borderRadius: '20px',
|
|
54
41
|
},
|
|
55
|
-
}, onClose:
|
|
42
|
+
}, onClose: () => {
|
|
56
43
|
setShowDialog(false);
|
|
57
|
-
}, open: showDialog
|
|
44
|
+
}, open: showDialog, children: term.clickEffect?.type === 'DIALOG' && (_jsxs("div", { className: styles.dialogContainer, style: { color: formStyle.textColor }, children: [_jsx("div", { className: styles.closeIcon, onClick: () => {
|
|
58
45
|
setShowDialog(false);
|
|
59
|
-
}
|
|
46
|
+
}, children: _jsx(CloseRoundedIcon, { fontSize: "inherit" }) }), _jsx("div", { className: styles.dialogTitle, style: {
|
|
60
47
|
borderBottom: '1px solid ' + formStyle.primaryColor,
|
|
61
|
-
}
|
|
48
|
+
}, children: term.clickEffect.title }), _jsx("div", { className: styles.dialogContentContainer, children: term.clickEffect.text }), _jsx(RoundedButton, { text: 'Aceptar', padding: "20px 15px", backgroundColor: formStyle.primaryColor, color: formStyle.primaryContrastColor, fontSize: 20, onClick: () => {
|
|
62
49
|
setShowDialog(false);
|
|
63
50
|
if (!postview) {
|
|
64
51
|
setValue(term.id, true);
|
|
65
52
|
}
|
|
66
|
-
} })] }))
|
|
53
|
+
} })] })) }), _jsxs("div", { className: styles.container + ' noselect', children: [_jsx("div", { className: styles.checkboxContainer, children: _jsx(Controller, { name: term.id, control: control, rules: {
|
|
67
54
|
required: true,
|
|
68
|
-
}, defaultValue: false, shouldUnregister: true, render:
|
|
69
|
-
var field = _a.field;
|
|
70
|
-
return (_jsx(RoundedCheckBox, { checked: field.value, onChange: field.onChange, cantEdit: postview, padding: "5px", checkedColor: formStyle.primaryColor, errorColor: formStyle.errorColor, size: "1.5rem", error: !!errors[term.id] }));
|
|
71
|
-
} }) })), _jsx("div", __assign({ className: styles.messageContainer, style: {
|
|
55
|
+
}, defaultValue: false, shouldUnregister: true, render: ({ field }) => (_jsx(RoundedCheckBox, { checked: field.value, onChange: field.onChange, cantEdit: postview, padding: "5px", checkedColor: formStyle.primaryColor, errorColor: formStyle.errorColor, size: "1.5rem", error: !!errors[term.id] })) }) }), _jsx("div", { className: styles.messageContainer, style: {
|
|
72
56
|
color: !!errors[term.id] && tempError
|
|
73
57
|
? formStyle.errorColor
|
|
74
58
|
: 'inherit',
|
|
75
|
-
}
|
|
59
|
+
}, children: renderText(term.message) })] })] }));
|
|
76
60
|
}
|
|
77
61
|
export default TermComponent;
|
|
@@ -1,24 +1,13 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
2
|
import { FormStyleTypes } from '../../constants/FormStepTypes';
|
|
14
3
|
import MaterialTerm from './MaterialTerm/MaterialTerm';
|
|
15
4
|
function TermComponent(props) {
|
|
16
5
|
switch (props.formStyle.type) {
|
|
17
6
|
case FormStyleTypes.MATERIAL: {
|
|
18
|
-
return _jsx(MaterialTerm,
|
|
7
|
+
return _jsx(MaterialTerm, { ...props });
|
|
19
8
|
}
|
|
20
9
|
default: {
|
|
21
|
-
return _jsx(MaterialTerm,
|
|
10
|
+
return _jsx(MaterialTerm, { ...props });
|
|
22
11
|
}
|
|
23
12
|
}
|
|
24
13
|
}
|