@arquimedes.co/eureka-forms 2.0.61-test → 2.0.62-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/@Types/Condition.d.ts +33 -2
- package/dist/@Types/Entity.d.ts +4 -1
- package/dist/@Types/FormStep.d.ts +21 -16
- package/dist/@Types/GenericFormSteps.d.ts +11 -0
- package/dist/@Types/Time.d.ts +6 -0
- package/dist/@Types/Time.js +1 -0
- package/dist/App/App.d.ts +2 -0
- package/dist/App/App.js +1 -1
- package/dist/App/AppFunctions.js +8 -8
- package/dist/Form/ConfirmationDialog/ConfirmationDialog.js +26 -3
- package/dist/Form/ConfirmationDialog/ConfirmationDialog.module.css +10 -5
- package/dist/Form/Form.d.ts +4 -4
- package/dist/Form/Form.js +2 -2
- package/dist/Form/FormFunctions.js +12 -12
- package/dist/Form/FormTypes/ColumnForm/ColumnForm.d.ts +1 -1
- package/dist/Form/FormTypes/ColumnForm/ColumnForm.js +17 -2
- package/dist/FormSteps/Step.js +19 -15
- package/dist/FormSteps/StepFunctions.js +140 -53
- package/dist/FormSteps/TimePickerStep/MaterialTimePickerStep/MaterialTimePickerStep.d.ts +4 -0
- package/dist/FormSteps/TimePickerStep/MaterialTimePickerStep/MaterialTimePickerStep.js +29 -0
- package/dist/FormSteps/TimePickerStep/TimePickerStep.d.ts +12 -0
- package/dist/FormSteps/TimePickerStep/TimePickerStep.js +25 -0
- package/dist/FormSteps/Utils/MaterialInputContainer/MaterialInputContainer.d.ts +2 -2
- package/dist/Shared/RoundedSelect/RoundedSelect.d.ts +2 -2
- package/dist/Shared/RoundedTimePicker/RoundedTimePicker.d.ts +35 -0
- package/dist/Shared/RoundedTimePicker/RoundedTimePicker.js +293 -0
- package/dist/Shared/RoundedTimePicker/RoundedTimePicker.module.css +30 -0
- package/dist/Shared/Toggle/Toggle.d.ts +18 -0
- package/dist/Shared/Toggle/Toggle.js +31 -0
- package/dist/constants/EntityPropertyTypes.d.ts +1 -0
- package/dist/constants/EntityPropertyTypes.js +1 -0
- package/dist/constants/FormStepTypes.d.ts +3 -2
- package/dist/constants/FormStepTypes.js +19 -18
- package/package.json +1 -1
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import ConditionTypes, { ExpressionTypes, OperatorTypes } from '../constants/ConditionTypes';
|
|
2
2
|
import EntityPropertyTypes from '../constants/EntityPropertyTypes';
|
|
3
3
|
import FormStepTypes from '../constants/FormStepTypes';
|
|
4
|
+
import { Time } from './Time';
|
|
4
5
|
export type Condition = ExpressionCondition | FormStepCondition | EntityValueCondition;
|
|
5
6
|
export interface ExpressionCondition<Type extends Condition = Condition> {
|
|
6
7
|
type: ConditionTypes.EXPRESSION;
|
|
7
8
|
conditions: (Type | ExpressionCondition)[];
|
|
8
9
|
expression: ExpressionTypes;
|
|
9
10
|
}
|
|
10
|
-
export type FormStepCondition = ExistanceFormStepCondition | CheckBoxFormStepCondition | ClassifierSelectorFormStepCondition | DatePickerFormStepCondition | EntityValuePickerFormStepCondition | RatingFormStepCondition | SelectorFormStepCondition | TextAreaFormStepCondition | TextInputFormStepCondition;
|
|
11
|
+
export type FormStepCondition = ExistanceFormStepCondition | CheckBoxFormStepCondition | TimePickerFormStepCondition | ClassifierSelectorFormStepCondition | DatePickerFormStepCondition | EntityValuePickerFormStepCondition | RatingFormStepCondition | SelectorFormStepCondition | TextAreaFormStepCondition | TextInputFormStepCondition;
|
|
11
12
|
interface BaseFormStepCondition {
|
|
12
13
|
type: ConditionTypes.FORM_STEP;
|
|
13
14
|
operator: OperatorTypes;
|
|
@@ -58,8 +59,23 @@ export interface TextInputFormStepCondition extends BaseFormStepCondition {
|
|
|
58
59
|
operator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL | OperatorTypes.INCLUDES | OperatorTypes.NOTINCLUDES;
|
|
59
60
|
value: string;
|
|
60
61
|
}
|
|
62
|
+
export type TimePickerFormStepCondition = BaseTimePickerFormStepCondition | WorkingTimePickerFormStepCondition;
|
|
63
|
+
export interface BaseTimePickerFormStepCondition extends BaseFormStepCondition {
|
|
64
|
+
stepType: FormStepTypes.TIMEPICKER;
|
|
65
|
+
operator: OperatorTypes.INCLUDES | OperatorTypes.NOTINCLUDES;
|
|
66
|
+
property: Omit<keyof Time, 'working'>;
|
|
67
|
+
propertyOperator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL | OperatorTypes.MORE | OperatorTypes.LESS;
|
|
68
|
+
value: number;
|
|
69
|
+
}
|
|
70
|
+
export interface WorkingTimePickerFormStepCondition extends BaseFormStepCondition {
|
|
71
|
+
stepType: FormStepTypes.TIMEPICKER;
|
|
72
|
+
operator: OperatorTypes.INCLUDES | OperatorTypes.NOTINCLUDES;
|
|
73
|
+
property: 'working';
|
|
74
|
+
propertyOperator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL;
|
|
75
|
+
value: boolean;
|
|
76
|
+
}
|
|
61
77
|
export type EntityValueCondition = EntityEqualsCondition | EntityPropertyCondition;
|
|
62
|
-
export type EntityPropertyCondition = EntityPropertyExistsCondition | EntitySelectorCondition | EntityTextInputCondition | EntityTextAreaCondition | EntityCheckboxCondition | EntityDateCondition | EntityRelativeDateCondition;
|
|
78
|
+
export type EntityPropertyCondition = EntityPropertyExistsCondition | EntitySelectorCondition | EntityTextInputCondition | EntityTextAreaCondition | EntityCheckboxCondition | EntityDateCondition | EntityTimeCondition | EntityRelativeDateCondition;
|
|
63
79
|
export interface EntityEqualsCondition {
|
|
64
80
|
type: ConditionTypes.ENTITYVALUE;
|
|
65
81
|
idEntity: string;
|
|
@@ -109,4 +125,19 @@ export interface EntityRelativeDateCondition extends EntityPropertyConditionBase
|
|
|
109
125
|
minutes: number;
|
|
110
126
|
working: boolean;
|
|
111
127
|
}
|
|
128
|
+
export type EntityTimeCondition = BaseEntityTimeCondition | WorkingEntityTimeCondition;
|
|
129
|
+
export interface BaseEntityTimeCondition extends EntityPropertyConditionBase {
|
|
130
|
+
propertyType: EntityPropertyTypes.TIMEPICKER;
|
|
131
|
+
property: Omit<keyof Time, 'working'>;
|
|
132
|
+
propertyOperator: OperatorTypes.INCLUDES | OperatorTypes.NOTINCLUDES;
|
|
133
|
+
timePropertyOperator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL | OperatorTypes.MORE | OperatorTypes.LESS;
|
|
134
|
+
value: number;
|
|
135
|
+
}
|
|
136
|
+
export interface WorkingEntityTimeCondition extends EntityPropertyConditionBase {
|
|
137
|
+
propertyType: EntityPropertyTypes.TIMEPICKER;
|
|
138
|
+
property: 'working';
|
|
139
|
+
propertyOperator: OperatorTypes.INCLUDES | OperatorTypes.NOTINCLUDES;
|
|
140
|
+
timePropertyOperator: OperatorTypes.EQUAL | OperatorTypes.NOTEQUAL;
|
|
141
|
+
value: boolean;
|
|
142
|
+
}
|
|
112
143
|
export {};
|
package/dist/@Types/Entity.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ export interface Entity {
|
|
|
7
7
|
steps: Record<string, EntityProperty>;
|
|
8
8
|
rootSteps: string[];
|
|
9
9
|
}
|
|
10
|
-
export type EntityProperty = Name | CheckBox | TextArea | TextInput | EntitySelector | DatePicker;
|
|
10
|
+
export type EntityProperty = Name | CheckBox | TextArea | TextInput | EntitySelector | DatePicker | TimePicker;
|
|
11
11
|
interface BaseProperty {
|
|
12
12
|
required: boolean;
|
|
13
13
|
}
|
|
@@ -27,6 +27,9 @@ export interface TextInput extends GSteps.GTextInput, BaseProperty {
|
|
|
27
27
|
export interface DatePicker extends GSteps.GDatePicker, BaseProperty {
|
|
28
28
|
type: EntityPropertyTypes.DATEPICKER;
|
|
29
29
|
}
|
|
30
|
+
export interface TimePicker extends GSteps.GTimePicker, BaseProperty {
|
|
31
|
+
type: EntityPropertyTypes.TIMEPICKER;
|
|
32
|
+
}
|
|
30
33
|
export interface EntitySelector extends Omit<FormSelector, 'type'>, BaseProperty {
|
|
31
34
|
type: EntityPropertyTypes.SELECTOR;
|
|
32
35
|
}
|
|
@@ -1,23 +1,28 @@
|
|
|
1
|
-
import
|
|
1
|
+
import FormStepTypes, { ClassifierOptionTypes, OptionTypes, RatingTypes, MapperStyleTypes, EntityValueOptionTypes, EntityValueDataTypes, ApiSelectorOptionTypes, ApiSelectorParamTypes } from '../constants/FormStepTypes';
|
|
2
2
|
import { Condition } from './Condition';
|
|
3
3
|
import { EurekaDraft } from './Draft/Draft';
|
|
4
4
|
import * as GSteps from './GenericFormSteps';
|
|
5
|
-
|
|
5
|
+
import { Time } from './Time';
|
|
6
|
+
export type FormStep = Title | TimePicker | Rating | CheckBox | TextArea | TextInput | DatePicker | FileUpload | Separator | FormSelector | ClassifierSelector | Collapsible | EntityValuePicker | ApiSelector | Mapper;
|
|
6
7
|
export interface Title extends GSteps.GBaseStep {
|
|
7
|
-
type:
|
|
8
|
+
type: FormStepTypes.TITLE;
|
|
8
9
|
title: string;
|
|
9
10
|
description: string | null;
|
|
10
11
|
size?: 1 | 2 | 3 | 4;
|
|
11
12
|
}
|
|
13
|
+
export interface TimePicker extends GSteps.GTimePicker {
|
|
14
|
+
type: FormStepTypes.TIMEPICKER;
|
|
15
|
+
defaultValue?: Time;
|
|
16
|
+
}
|
|
12
17
|
export interface CheckBox extends GSteps.GCheckBox {
|
|
13
|
-
type:
|
|
18
|
+
type: FormStepTypes.CHECKBOX;
|
|
14
19
|
steps?: string[];
|
|
15
20
|
uncheckedSteps?: string[];
|
|
16
21
|
maxSize?: number;
|
|
17
22
|
defaultValue?: boolean;
|
|
18
23
|
}
|
|
19
24
|
export interface Rating extends GSteps.GBaseStep {
|
|
20
|
-
type:
|
|
25
|
+
type: FormStepTypes.RATING;
|
|
21
26
|
label: string;
|
|
22
27
|
description: string;
|
|
23
28
|
required: boolean;
|
|
@@ -25,31 +30,31 @@ export interface Rating extends GSteps.GBaseStep {
|
|
|
25
30
|
nestedSteps: string[][] | null;
|
|
26
31
|
}
|
|
27
32
|
export interface FileUpload extends GSteps.GBaseStep {
|
|
28
|
-
type:
|
|
33
|
+
type: FormStepTypes.FILEUPLOAD;
|
|
29
34
|
label: string;
|
|
30
35
|
description: string | null;
|
|
31
36
|
required: boolean;
|
|
32
37
|
}
|
|
33
38
|
export interface Separator extends GSteps.GSeparator {
|
|
34
|
-
type:
|
|
39
|
+
type: FormStepTypes.SEPARATOR;
|
|
35
40
|
}
|
|
36
41
|
export interface TextArea extends GSteps.GTextArea {
|
|
37
|
-
type:
|
|
42
|
+
type: FormStepTypes.TEXTAREA;
|
|
38
43
|
}
|
|
39
44
|
export interface TextInput extends GSteps.GTextInput {
|
|
40
|
-
type:
|
|
45
|
+
type: FormStepTypes.TEXTINPUT;
|
|
41
46
|
}
|
|
42
47
|
export interface DatePicker extends GSteps.GDatePicker {
|
|
43
|
-
type:
|
|
48
|
+
type: FormStepTypes.DATEPICKER;
|
|
44
49
|
}
|
|
45
50
|
export interface Collapsible extends GSteps.GBaseStep {
|
|
46
|
-
type:
|
|
51
|
+
type: FormStepTypes.COLLAPSIBLE;
|
|
47
52
|
label: string;
|
|
48
53
|
steps: string[];
|
|
49
54
|
defaultValue?: boolean;
|
|
50
55
|
}
|
|
51
56
|
export interface FormSelector extends GSteps.GBaseStep {
|
|
52
|
-
type:
|
|
57
|
+
type: FormStepTypes.SELECTOR;
|
|
53
58
|
label: string;
|
|
54
59
|
description: string;
|
|
55
60
|
required: boolean;
|
|
@@ -74,7 +79,7 @@ export interface NestedStepOption {
|
|
|
74
79
|
condition?: Condition;
|
|
75
80
|
}
|
|
76
81
|
export interface ClassifierSelector extends GSteps.GBaseStep {
|
|
77
|
-
type:
|
|
82
|
+
type: FormStepTypes.CLASSIFIER_SELECTOR;
|
|
78
83
|
idClassifier: string | null;
|
|
79
84
|
label: string;
|
|
80
85
|
description: string;
|
|
@@ -101,7 +106,7 @@ interface HideValueOption {
|
|
|
101
106
|
idClassifier: string;
|
|
102
107
|
}
|
|
103
108
|
export interface EntityValuePicker extends GSteps.GSmartSelect {
|
|
104
|
-
type:
|
|
109
|
+
type: FormStepTypes.ENTITYVALUEPICKER;
|
|
105
110
|
idEntity: string;
|
|
106
111
|
icon: string | null;
|
|
107
112
|
filters: EntityValuePickerFilter[];
|
|
@@ -157,7 +162,7 @@ export interface ValueEntityValuePickerFilter {
|
|
|
157
162
|
value: any;
|
|
158
163
|
}
|
|
159
164
|
export interface ApiSelector extends GSteps.GSmartSelect {
|
|
160
|
-
type:
|
|
165
|
+
type: FormStepTypes.API_SELECTOR;
|
|
161
166
|
icon: string | null;
|
|
162
167
|
url: string;
|
|
163
168
|
pathParams: ApiSelectorParam[];
|
|
@@ -198,7 +203,7 @@ export interface ValueApiSelectorParam {
|
|
|
198
203
|
value: string;
|
|
199
204
|
}
|
|
200
205
|
export interface Mapper extends GSteps.GBaseStep {
|
|
201
|
-
type:
|
|
206
|
+
type: FormStepTypes.MAPPER;
|
|
202
207
|
style: {
|
|
203
208
|
type: MapperStyleTypes;
|
|
204
209
|
size?: number;
|
|
@@ -47,6 +47,17 @@ export interface GDatePicker extends GBaseStep {
|
|
|
47
47
|
required: boolean;
|
|
48
48
|
size: 1 | 2 | 3 | 4;
|
|
49
49
|
}
|
|
50
|
+
export interface GTimePicker extends GBaseStep {
|
|
51
|
+
label: string;
|
|
52
|
+
description: string | null;
|
|
53
|
+
required: boolean;
|
|
54
|
+
size: 1 | 2 | 3 | 4;
|
|
55
|
+
pickDays: boolean;
|
|
56
|
+
pickHours: boolean;
|
|
57
|
+
pickMinutes: boolean;
|
|
58
|
+
/** Undefined if user can choose */
|
|
59
|
+
working?: boolean;
|
|
60
|
+
}
|
|
50
61
|
export interface GAgentPicker extends GBaseStep {
|
|
51
62
|
label: string;
|
|
52
63
|
description: string | null;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/dist/App/App.d.ts
CHANGED
|
@@ -33,6 +33,8 @@ export interface AppProps {
|
|
|
33
33
|
classifiers?: Record<string, Classifier>;
|
|
34
34
|
/** Custom function to call on send */
|
|
35
35
|
customSubmit?: (values: Record<string, unknown>, reload: () => void) => Promise<void>;
|
|
36
|
+
/** Custom submit function, when passed it is called */
|
|
37
|
+
submit?: (submit: () => Promise<Record<string, any> | void>) => Promise<void>;
|
|
36
38
|
/** Custom submit buttons */
|
|
37
39
|
customSubmitBtns?: (onSubmit: () => Promise<Record<string, any> | void>, loading: boolean) => JSX.Element;
|
|
38
40
|
/** Function to call on postview to fetch the download url of a file */
|
package/dist/App/App.js
CHANGED
|
@@ -74,6 +74,6 @@ function App(_a) {
|
|
|
74
74
|
sendLabel: props.sendLabel,
|
|
75
75
|
fetchDownloadUrl: props.fetchDownloadUrl,
|
|
76
76
|
customStepProps: (_g = props.customStepProps) !== null && _g !== void 0 ? _g : {},
|
|
77
|
-
} }, { children: _jsx("div", __assign({ className: styles.container }, { children: _jsx(FormComponent, { form: form, reload: reload, branding: branding, apiKey: props.apiKey, isWidget: !!isWidget, customSteps: customSteps, containerRef: containerRef, customSubmit: props.customSubmit, scrollToTop: props.scrollToTop, customSubmitBtns: props.customSubmitBtns }) })) })));
|
|
77
|
+
} }, { children: _jsx("div", __assign({ className: styles.container }, { children: _jsx(FormComponent, { form: form, reload: reload, branding: branding, apiKey: props.apiKey, isWidget: !!isWidget, customSteps: customSteps, containerRef: containerRef, submit: props.submit, customSubmit: props.customSubmit, scrollToTop: props.scrollToTop, customSubmitBtns: props.customSubmitBtns }) })) })));
|
|
78
78
|
}
|
|
79
79
|
}
|
package/dist/App/AppFunctions.js
CHANGED
|
@@ -55,7 +55,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
|
55
55
|
return to.concat(ar || Array.prototype.slice.call(from));
|
|
56
56
|
};
|
|
57
57
|
import { nanoid } from 'nanoid';
|
|
58
|
-
import
|
|
58
|
+
import FormStepTypes, { EntityValueOptionTypes, FormTypes, } from '../constants/FormStepTypes';
|
|
59
59
|
import { getRawText, stringToDraft } from '../Utils/DraftFunctions';
|
|
60
60
|
import { calcSubSteps } from '../FormSteps/StepFunctions';
|
|
61
61
|
import ConditionTypes from '../constants/ConditionTypes';
|
|
@@ -113,7 +113,7 @@ export var calcValuesStore = function (idOrganization, form, originalValues, pos
|
|
|
113
113
|
for (_b = 0, _c = section.steps; _b < _c.length; _b++) {
|
|
114
114
|
idStep = _c[_b];
|
|
115
115
|
step = form.steps[idStep];
|
|
116
|
-
if (step.type !==
|
|
116
|
+
if (step.type !== FormStepTypes.MAPPER ||
|
|
117
117
|
((_f = values.sections[step.idSection]) === null || _f === void 0 ? void 0 : _f[step.id]))
|
|
118
118
|
continue;
|
|
119
119
|
if (!values.sections[step.idSection])
|
|
@@ -150,7 +150,7 @@ export var addMapperStep = function (step, customSteps, path) {
|
|
|
150
150
|
calcRecursiveData(element, steps, customSteps);
|
|
151
151
|
for (var _b = 0, _c = Object.values(step.steps); _b < _c.length; _b++) {
|
|
152
152
|
var nestedStep = _c[_b];
|
|
153
|
-
if (nestedStep.type ===
|
|
153
|
+
if (nestedStep.type === FormStepTypes.MAPPER) {
|
|
154
154
|
var nested = addMapperStep(nestedStep, customSteps, base + step.id + '-' + idElement);
|
|
155
155
|
steps = __assign(__assign({}, steps), nested.steps);
|
|
156
156
|
mappers = __assign(__assign({}, mappers), nested.mappers);
|
|
@@ -218,11 +218,11 @@ export var mapOriginalValue = function (idOrganization, step, value, values, for
|
|
|
218
218
|
return [2 /*return*/, value];
|
|
219
219
|
_a = step === null || step === void 0 ? void 0 : step.type;
|
|
220
220
|
switch (_a) {
|
|
221
|
-
case
|
|
222
|
-
case
|
|
223
|
-
case
|
|
224
|
-
case
|
|
225
|
-
case
|
|
221
|
+
case FormStepTypes.MAPPER: return [3 /*break*/, 1];
|
|
222
|
+
case FormStepTypes.TEXTAREA: return [3 /*break*/, 6];
|
|
223
|
+
case FormStepTypes.SELECTOR: return [3 /*break*/, 7];
|
|
224
|
+
case FormStepTypes.CLASSIFIER_SELECTOR: return [3 /*break*/, 8];
|
|
225
|
+
case FormStepTypes.ENTITYVALUEPICKER: return [3 /*break*/, 9];
|
|
226
226
|
}
|
|
227
227
|
return [3 /*break*/, 12];
|
|
228
228
|
case 1:
|
|
@@ -20,7 +20,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
20
20
|
}
|
|
21
21
|
return t;
|
|
22
22
|
};
|
|
23
|
-
import { jsx as _jsx,
|
|
23
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
24
24
|
import CheckCircleOutlineRoundedIcon from '@material-ui/icons/CheckCircleOutlineRounded';
|
|
25
25
|
import styles from './ConfirmationDialog.module.css';
|
|
26
26
|
import Dialog from '@material-ui/core/Dialog';
|
|
@@ -36,6 +36,7 @@ function ConfirmationDialog(_a) {
|
|
|
36
36
|
var _b = useAppSelector(function (state) { return state.global; }), formStyle = _b.formStyle, global = __rest(_b, ["formStyle"]);
|
|
37
37
|
var form = useContext(FormContext);
|
|
38
38
|
var dependencies = useAppSelector(function (state) { return state.site.dependencies; });
|
|
39
|
+
var widthStats = useAppSelector(function (state) { return state.widthStats; });
|
|
39
40
|
var editorState = useMemo(function () {
|
|
40
41
|
return EditorState.createWithContent(convertFromRaw(mapDraftEntities({
|
|
41
42
|
dependencies: dependencies,
|
|
@@ -49,10 +50,32 @@ function ConfirmationDialog(_a) {
|
|
|
49
50
|
maxWidth: '100vw',
|
|
50
51
|
boxSizing: 'content-box',
|
|
51
52
|
},
|
|
52
|
-
}, open: true }, { children: _jsxs("div", __assign({ className: styles.confirmationContainer, style: {
|
|
53
|
+
}, open: true }, { children: _jsxs("div", __assign({ className: styles.confirmationContainer, style: {
|
|
54
|
+
color: '#293241',
|
|
55
|
+
padding: widthStats.isMobile ? '0px 20px' : '0px 30px',
|
|
56
|
+
} }, { children: [_jsx("div", __assign({ className: styles.closeIcon, onClick: function () {
|
|
53
57
|
onClose();
|
|
54
|
-
} }, { children: _jsx(CloseRoundedIcon, { fontSize: "inherit" }) })), _jsxs("div", __assign({ className: styles.container }, { children: [_jsx("div", __assign({ className: styles.checkContainer, style: {
|
|
58
|
+
} }, { children: _jsx(CloseRoundedIcon, { fontSize: "inherit" }) })), _jsxs("div", __assign({ className: styles.container }, { children: [_jsx("div", __assign({ className: styles.checkContainer, style: {
|
|
59
|
+
color: formStyle.primaryColor,
|
|
60
|
+
paddingTop: widthStats.isMobile ? '20px' : '30px',
|
|
61
|
+
} }, { children: _jsx(CheckCircleOutlineRoundedIcon, { fontSize: "inherit", style: {
|
|
62
|
+
fontSize: widthStats.isMobile
|
|
63
|
+
? '100px'
|
|
64
|
+
: '160px',
|
|
65
|
+
} }) })), hasText && (_jsx("div", __assign({ className: styles.messageContainer, style: {
|
|
66
|
+
fontSize: widthStats.isMobile
|
|
67
|
+
? '1.1rem'
|
|
68
|
+
: '1.4rem',
|
|
69
|
+
padding: widthStats.isMobile
|
|
70
|
+
? '5px 0px'
|
|
71
|
+
: '20px 0px',
|
|
72
|
+
} }, { children: _jsx(Editor, { editorClassName: 'Erk-Forms-Confirmation', editorState: editorState, readOnly: true, toolbarHidden: true }) }))), global.confirmation.showLink && (_jsxs(_Fragment, { children: [_jsx("div", __assign({ className: widthStats.isMobile
|
|
73
|
+
? styles.mobileLinkContainer
|
|
74
|
+
: styles.linkContainer }, { children: "Puedes consultar el estado aqui:" })), _jsx("a", __assign({ className: styles.url, "data-testid": "ResUrl", target: "_blank", href: confirmation.url, style: {
|
|
55
75
|
color: '#293241',
|
|
76
|
+
fontSize: widthStats.isMobile
|
|
77
|
+
? '1rem'
|
|
78
|
+
: '1.2rem',
|
|
56
79
|
} }, { children: confirmation.url }))] }))] }))] })) })));
|
|
57
80
|
}
|
|
58
81
|
export default ConfirmationDialog;
|
|
@@ -27,26 +27,31 @@
|
|
|
27
27
|
.checkContainer {
|
|
28
28
|
margin-left: auto;
|
|
29
29
|
margin-right: auto;
|
|
30
|
-
padding-top: 30px;
|
|
31
30
|
height: fit-content;
|
|
32
|
-
margin-bottom: 15px;
|
|
33
31
|
}
|
|
34
32
|
|
|
35
33
|
.messageContainer {
|
|
36
|
-
margin-top: 5px;
|
|
37
34
|
margin-left: 40px;
|
|
38
35
|
margin-right: 40px;
|
|
39
|
-
font-size: 1.2rem;
|
|
40
36
|
text-align: center;
|
|
41
37
|
margin-left: auto;
|
|
42
38
|
margin-right: auto;
|
|
43
39
|
}
|
|
44
40
|
|
|
41
|
+
.mobileLinkContainer {
|
|
42
|
+
font-size: 1.1rem;
|
|
43
|
+
margin-left: 15px;
|
|
44
|
+
margin-top: 10px;
|
|
45
|
+
padding-right: 5px;
|
|
46
|
+
}
|
|
47
|
+
|
|
45
48
|
.linkContainer {
|
|
46
|
-
margin-top: 20px;
|
|
47
49
|
font-size: 1.2rem;
|
|
48
50
|
margin-left: 20px;
|
|
51
|
+
margin-top: 20px;
|
|
52
|
+
padding-right: 10px;
|
|
49
53
|
}
|
|
54
|
+
|
|
50
55
|
.url {
|
|
51
56
|
font-weight: bolder;
|
|
52
57
|
margin-left: 40px;
|
package/dist/Form/Form.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Branding } from '../@Types/Branding';
|
|
3
|
-
import
|
|
3
|
+
import FormStepTypes from '../constants/FormStepTypes';
|
|
4
4
|
import { FieldValues } from 'react-hook-form';
|
|
5
5
|
import { AppProps } from '../App/App';
|
|
6
6
|
import CBRFormStepTypes from '../constants/CBRFormStepTypes';
|
|
@@ -11,7 +11,7 @@ export declare const getLocale: () => any;
|
|
|
11
11
|
export interface StepDependency {
|
|
12
12
|
dependents: (FormStep | CBRFormStep)[];
|
|
13
13
|
value: any | undefined;
|
|
14
|
-
type:
|
|
14
|
+
type: FormStepTypes | CBRFormStepTypes | 'ORIGINAL';
|
|
15
15
|
empty?: boolean;
|
|
16
16
|
}
|
|
17
17
|
export type DependencyStore = Record<string, StepDependency>;
|
|
@@ -20,7 +20,7 @@ export interface WidthStats {
|
|
|
20
20
|
isResponsive: boolean;
|
|
21
21
|
isMobile: boolean;
|
|
22
22
|
}
|
|
23
|
-
type CustomAppProps = Pick<AppProps, 'customSteps' | 'customSubmitBtns'>;
|
|
23
|
+
type CustomAppProps = Pick<AppProps, 'customSteps' | 'customSubmitBtns' | 'submit'>;
|
|
24
24
|
export interface BaseFormProps extends CustomAppProps {
|
|
25
25
|
form: Form;
|
|
26
26
|
branding?: Branding;
|
|
@@ -36,5 +36,5 @@ export interface FormComponentProps extends CustomAppProps {
|
|
|
36
36
|
onSubmit: (values: FieldValues) => Promise<any>;
|
|
37
37
|
scrollToTop?: () => void;
|
|
38
38
|
}
|
|
39
|
-
declare function FormComponent({ form, apiKey, reload, isWidget, branding, scrollToTop, customSteps, containerRef, customSubmit, customSubmitBtns, }: BaseFormProps): JSX.Element;
|
|
39
|
+
declare function FormComponent({ form, submit, apiKey, reload, isWidget, branding, scrollToTop, customSteps, containerRef, customSubmit, customSubmitBtns, }: BaseFormProps): JSX.Element;
|
|
40
40
|
export default FormComponent;
|
package/dist/Form/Form.js
CHANGED
|
@@ -84,7 +84,7 @@ export var getLocale = function () {
|
|
|
84
84
|
function FormComponent(_a) {
|
|
85
85
|
var _this = this;
|
|
86
86
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
87
|
-
var form = _a.form, apiKey = _a.apiKey, reload = _a.reload, isWidget = _a.isWidget, branding = _a.branding, scrollToTop = _a.scrollToTop, customSteps = _a.customSteps, containerRef = _a.containerRef, customSubmit = _a.customSubmit, customSubmitBtns = _a.customSubmitBtns;
|
|
87
|
+
var form = _a.form, submit = _a.submit, apiKey = _a.apiKey, reload = _a.reload, isWidget = _a.isWidget, branding = _a.branding, scrollToTop = _a.scrollToTop, customSteps = _a.customSteps, containerRef = _a.containerRef, customSubmit = _a.customSubmit, customSubmitBtns = _a.customSubmitBtns;
|
|
88
88
|
var _l = useAppSelector(function (state) { return state.global; }), idOrganization = _l.idOrganization, internal = _l.internal, postview = _l.postview;
|
|
89
89
|
var formMethods = useForm({
|
|
90
90
|
mode: 'onTouched',
|
|
@@ -170,7 +170,7 @@ function FormComponent(_a) {
|
|
|
170
170
|
return (_jsxs(React.Fragment, { children: [showConfirmation !== undefined && (_jsx(ConfirmationDialog, { confirmation: showConfirmation, onClose: function () {
|
|
171
171
|
reload();
|
|
172
172
|
setShowConfirmation(undefined);
|
|
173
|
-
} })), form.hasCaptcha && !internal && !postview && (_jsx(ReCAPTCHA, { ref: recaptchaRef, sitekey: "6LcL22kkAAAAAEotDeAFbRATob-u5vbibbCyWL2p", size: 'invisible', badge: 'bottomright' })), _jsx(FormProvider, __assign({}, formMethods, { children: _jsx(FormContext.Provider, __assign({ value: form }, { children: _jsx(FormTypeComponent, { onSubmit: onSubmit, scrollToTop: scrollToTop, customSubmitBtns: customSubmitBtns }) })) }))] }));
|
|
173
|
+
} })), form.hasCaptcha && !internal && !postview && (_jsx(ReCAPTCHA, { ref: recaptchaRef, sitekey: "6LcL22kkAAAAAEotDeAFbRATob-u5vbibbCyWL2p", size: 'invisible', badge: 'bottomright' })), _jsx(FormProvider, __assign({}, formMethods, { children: _jsx(FormContext.Provider, __assign({ value: form }, { children: _jsx(FormTypeComponent, { onSubmit: onSubmit, submit: submit, scrollToTop: scrollToTop, customSubmitBtns: customSubmitBtns }) })) }))] }));
|
|
174
174
|
};
|
|
175
175
|
if (!idOrganization)
|
|
176
176
|
return _jsx(_Fragment, {});
|
|
@@ -19,7 +19,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
|
19
19
|
return to.concat(ar || Array.prototype.slice.call(from));
|
|
20
20
|
};
|
|
21
21
|
import { convertFromRaw, convertToRaw } from 'draft-js';
|
|
22
|
-
import
|
|
22
|
+
import FormStepTypes, { EntityValueDataTypes, } from '../constants/FormStepTypes';
|
|
23
23
|
import { calcRecursiveData } from '../App/AppFunctions';
|
|
24
24
|
import { calcStepDeps } from '../FormSteps/StepHooks';
|
|
25
25
|
/**
|
|
@@ -37,7 +37,7 @@ export var calcValue = function (idStep, steps, values, customSteps, deleteIds,
|
|
|
37
37
|
}
|
|
38
38
|
else {
|
|
39
39
|
switch (step.type) {
|
|
40
|
-
case
|
|
40
|
+
case FormStepTypes.TEXTAREA: {
|
|
41
41
|
if (step.hasTextEditor) {
|
|
42
42
|
var currentContent = value.getCurrentContent();
|
|
43
43
|
return {
|
|
@@ -52,17 +52,17 @@ export var calcValue = function (idStep, steps, values, customSteps, deleteIds,
|
|
|
52
52
|
};
|
|
53
53
|
}
|
|
54
54
|
}
|
|
55
|
-
case
|
|
55
|
+
case FormStepTypes.FILEUPLOAD: {
|
|
56
56
|
return value.map(function (val) { return ({
|
|
57
57
|
fileName: val.fileName,
|
|
58
58
|
S3Key: val.S3Key,
|
|
59
59
|
}); });
|
|
60
60
|
}
|
|
61
|
-
case
|
|
62
|
-
case
|
|
61
|
+
case FormStepTypes.SELECTOR:
|
|
62
|
+
case FormStepTypes.CLASSIFIER_SELECTOR: {
|
|
63
63
|
return value.value;
|
|
64
64
|
}
|
|
65
|
-
case
|
|
65
|
+
case FormStepTypes.MAPPER: {
|
|
66
66
|
var elements = (_c = value === null || value === void 0 ? void 0 : value.elements) === null || _c === void 0 ? void 0 : _c.filter(function (element) { return element.deleted !== true; });
|
|
67
67
|
var mappedValues = [];
|
|
68
68
|
for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {
|
|
@@ -94,12 +94,12 @@ export var calcValue = function (idStep, steps, values, customSteps, deleteIds,
|
|
|
94
94
|
}
|
|
95
95
|
return mappedValues;
|
|
96
96
|
}
|
|
97
|
-
case
|
|
97
|
+
case FormStepTypes.TITLE: {
|
|
98
98
|
if (!value)
|
|
99
99
|
deleteIds.push(idStep);
|
|
100
100
|
return value !== null && value !== void 0 ? value : undefined;
|
|
101
101
|
}
|
|
102
|
-
case
|
|
102
|
+
case FormStepTypes.COLLAPSIBLE:
|
|
103
103
|
deleteIds.push(idStep);
|
|
104
104
|
return;
|
|
105
105
|
default:
|
|
@@ -149,7 +149,7 @@ export function calcDependencies(steps, customSteps, allSteps, dependencies, val
|
|
|
149
149
|
!dependencies[idDep].dependents.find(function (dep) { return dep.id === step.id; }))
|
|
150
150
|
dependencies[idDep].dependents.push(step);
|
|
151
151
|
}
|
|
152
|
-
if (step.type ===
|
|
152
|
+
if (step.type === FormStepTypes.ENTITYVALUEPICKER) {
|
|
153
153
|
for (var _f = 0, _g = __spreadArray(__spreadArray([], step.path, true), step.filters, true); _f < _g.length; _f++) {
|
|
154
154
|
var dep = _g[_f];
|
|
155
155
|
if (dep.type !== EntityValueDataTypes.STEP)
|
|
@@ -164,7 +164,7 @@ export function calcDependencies(steps, customSteps, allSteps, dependencies, val
|
|
|
164
164
|
dependencies[dep.idStep].dependents.push(step);
|
|
165
165
|
}
|
|
166
166
|
}
|
|
167
|
-
if (step.type ===
|
|
167
|
+
if (step.type === FormStepTypes.MAPPER) {
|
|
168
168
|
var subSteps = calcMapperSubSteps(step, (_c = (_b = values.sections[step.idSection]) === null || _b === void 0 ? void 0 : _b[step.id]) === null || _c === void 0 ? void 0 : _c.elements, customSteps);
|
|
169
169
|
var hasSubSteps = Object.keys(subSteps).length > 0;
|
|
170
170
|
calcDependencies(hasSubSteps ? subSteps : step.steps, customSteps, __assign(__assign({}, allSteps), subSteps), dependencies, values, hasSubSteps);
|
|
@@ -222,7 +222,7 @@ function calcStepDependencyValue(depStep, originalValue, customSteps) {
|
|
|
222
222
|
return custom.calcDependencyValue(depStep, originalValue);
|
|
223
223
|
}
|
|
224
224
|
switch (depStep.type) {
|
|
225
|
-
case
|
|
225
|
+
case FormStepTypes.TEXTAREA: {
|
|
226
226
|
if (depStep.hasTextEditor) {
|
|
227
227
|
return originalValue
|
|
228
228
|
? convertFromRaw(originalValue).getPlainText()
|
|
@@ -232,7 +232,7 @@ function calcStepDependencyValue(depStep, originalValue, customSteps) {
|
|
|
232
232
|
return originalValue !== null && originalValue !== void 0 ? originalValue : null;
|
|
233
233
|
}
|
|
234
234
|
}
|
|
235
|
-
case
|
|
235
|
+
case FormStepTypes.MAPPER: {
|
|
236
236
|
//TODO: Esto aun no se usa
|
|
237
237
|
return ((_a = {
|
|
238
238
|
elements: originalValue === null || originalValue === void 0 ? void 0 : originalValue.map(function (mapperValue) { var _a; return (_a = mapperValue.value) !== null && _a !== void 0 ? _a : mapperValue; }),
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { FormComponentProps } from '../../Form';
|
|
3
|
-
declare function ColumnForm({ onSubmit, customSubmitBtns, }: FormComponentProps): JSX.Element;
|
|
3
|
+
declare function ColumnForm({ onSubmit, customSubmitBtns, ...props }: FormComponentProps): JSX.Element;
|
|
4
4
|
export default ColumnForm;
|
|
@@ -45,8 +45,19 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
|
45
45
|
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
46
46
|
}
|
|
47
47
|
};
|
|
48
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
49
|
+
var t = {};
|
|
50
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
51
|
+
t[p] = s[p];
|
|
52
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
53
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
54
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
55
|
+
t[p[i]] = s[p[i]];
|
|
56
|
+
}
|
|
57
|
+
return t;
|
|
58
|
+
};
|
|
48
59
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
49
|
-
import { useCallback, useContext, useState } from 'react';
|
|
60
|
+
import { useCallback, useContext, useEffect, useState } from 'react';
|
|
50
61
|
import styles from './ColumnForm.module.css';
|
|
51
62
|
import React from 'react';
|
|
52
63
|
import Terms from '../../Terms/Terms';
|
|
@@ -61,7 +72,7 @@ import { getAppState } from '../../../Utils/store';
|
|
|
61
72
|
import { IdFormContext } from '../../../App/App';
|
|
62
73
|
function ColumnForm(_a) {
|
|
63
74
|
var _this = this;
|
|
64
|
-
var onSubmit = _a.onSubmit, customSubmitBtns = _a.customSubmitBtns;
|
|
75
|
+
var onSubmit = _a.onSubmit, customSubmitBtns = _a.customSubmitBtns, props = __rest(_a, ["onSubmit", "customSubmitBtns"]);
|
|
65
76
|
var _b = useState(false), loading = _b[0], setLoading = _b[1];
|
|
66
77
|
var _c = useAppSelector(function (state) { return state.global; }), postview = _c.postview, editable = _c.editable, formStyle = _c.formStyle;
|
|
67
78
|
var _d = useFormContext(), trigger = _d.trigger, getValues = _d.getValues, handleSubmit = _d.handleSubmit;
|
|
@@ -72,6 +83,10 @@ function ColumnForm(_a) {
|
|
|
72
83
|
var previous = useAppSelector(function (state) { return state.site.previousSections; });
|
|
73
84
|
var next = useAppSelector(function (state) { return state.site.nextSections; });
|
|
74
85
|
var idCurrent = useAppSelector(function (state) { return state.site.idCurrentSection; });
|
|
86
|
+
useEffect(function () {
|
|
87
|
+
if (props.submit)
|
|
88
|
+
props.submit(submit);
|
|
89
|
+
}, [props.submit]);
|
|
75
90
|
/** Esto se usa para no tener que escuchar todo el tiempo los errores del formulario */
|
|
76
91
|
var handleErrors = handleSubmit(function () { }, function (errors) {
|
|
77
92
|
console.error('Errors:', errors);
|
package/dist/FormSteps/Step.js
CHANGED
|
@@ -21,7 +21,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
21
21
|
return t;
|
|
22
22
|
};
|
|
23
23
|
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
|
24
|
-
import
|
|
24
|
+
import FormStepTypes from '../constants/FormStepTypes';
|
|
25
25
|
import SelectorStep from './SelectorStep/SelectorStep';
|
|
26
26
|
import SeparatorStep from './SeparatorStep/SeparatorStep';
|
|
27
27
|
import TextInputStep from './TextInputStep/TextInputStep';
|
|
@@ -43,6 +43,7 @@ import { useAppSelector } from '../hooks';
|
|
|
43
43
|
import { useContext } from 'react';
|
|
44
44
|
import CustomContext from '../Contexts/CustomContext';
|
|
45
45
|
import { selectOriginalValue, useCondition } from './StepHooks';
|
|
46
|
+
import TimePickerStep from './TimePickerStep/TimePickerStep';
|
|
46
47
|
function StepComponent(_a) {
|
|
47
48
|
var _b;
|
|
48
49
|
var step = _a.step, props = __rest(_a, ["step"]);
|
|
@@ -69,46 +70,49 @@ function StepComponent(_a) {
|
|
|
69
70
|
return (_jsx(CustomStep, __assign({}, props, { step: step, editable: editable, customStep: customStep })));
|
|
70
71
|
}
|
|
71
72
|
switch (step.type) {
|
|
72
|
-
case
|
|
73
|
+
case FormStepTypes.TITLE: {
|
|
73
74
|
return (_jsx(TitleStep, __assign({}, props, { step: step, editable: editable })));
|
|
74
75
|
}
|
|
75
|
-
case
|
|
76
|
+
case FormStepTypes.TIMEPICKER: {
|
|
77
|
+
return (_jsx(TimePickerStep, __assign({}, props, { step: step, editable: editable })));
|
|
78
|
+
}
|
|
79
|
+
case FormStepTypes.SELECTOR: {
|
|
76
80
|
return (_jsx(SelectorStep, __assign({}, props, { step: step, editable: editable })));
|
|
77
81
|
}
|
|
78
|
-
case
|
|
82
|
+
case FormStepTypes.CHECKBOX: {
|
|
79
83
|
return (_jsx(CheckBoxStep, __assign({}, props, { step: step, editable: editable })));
|
|
80
84
|
}
|
|
81
|
-
case
|
|
85
|
+
case FormStepTypes.CLASSIFIER_SELECTOR: {
|
|
82
86
|
return (_jsx(ClassifierSelectorStep, __assign({}, props, { step: step, editable: editable })));
|
|
83
87
|
}
|
|
84
|
-
case
|
|
88
|
+
case FormStepTypes.TEXTAREA: {
|
|
85
89
|
return (_jsx(TextAreaStep, __assign({}, props, { step: step, editable: editable })));
|
|
86
90
|
}
|
|
87
|
-
case
|
|
91
|
+
case FormStepTypes.TEXTINPUT: {
|
|
88
92
|
return (_jsx(TextInputStep, __assign({}, props, { step: step, editable: editable })));
|
|
89
93
|
}
|
|
90
|
-
case
|
|
94
|
+
case FormStepTypes.DATEPICKER: {
|
|
91
95
|
return (_jsx(DatePickerStep, __assign({}, props, { step: step, editable: editable })));
|
|
92
96
|
}
|
|
93
|
-
case
|
|
97
|
+
case FormStepTypes.SEPARATOR: {
|
|
94
98
|
return (_jsx(SeparatorStep, __assign({}, props, { step: step, editable: editable })));
|
|
95
99
|
}
|
|
96
|
-
case
|
|
100
|
+
case FormStepTypes.FILEUPLOAD: {
|
|
97
101
|
return (_jsx(FileUploadStep, __assign({}, props, { step: step, editable: editable })));
|
|
98
102
|
}
|
|
99
|
-
case
|
|
103
|
+
case FormStepTypes.RATING: {
|
|
100
104
|
return (_jsx(RatingStep, __assign({}, props, { step: step, editable: editable })));
|
|
101
105
|
}
|
|
102
|
-
case
|
|
106
|
+
case FormStepTypes.COLLAPSIBLE: {
|
|
103
107
|
return (_jsx(CollapsibleStep, __assign({}, props, { step: step, editable: editable })));
|
|
104
108
|
}
|
|
105
|
-
case
|
|
109
|
+
case FormStepTypes.ENTITYVALUEPICKER: {
|
|
106
110
|
return (_jsx(EntityValuePickerStep, __assign({}, props, { step: step, editable: editable })));
|
|
107
111
|
}
|
|
108
|
-
case
|
|
112
|
+
case FormStepTypes.API_SELECTOR: {
|
|
109
113
|
return (_jsx(ApiSelectorStep, __assign({}, props, { step: step, editable: editable })));
|
|
110
114
|
}
|
|
111
|
-
case
|
|
115
|
+
case FormStepTypes.MAPPER: {
|
|
112
116
|
return (_jsx(MapperStep, __assign({}, props, { step: step, editable: editable })));
|
|
113
117
|
}
|
|
114
118
|
default:
|