@arquimedes.co/eureka-forms 0.2.36-test → 0.2.38-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/Form.d.ts +1 -0
- package/dist/@Types/FormStep.d.ts +9 -1
- package/dist/App.js +5 -5
- package/dist/FormComponents/Form/ColumnForm/ColumnForm.js +2 -2
- package/dist/FormComponents/Step/CheckBoxStep/CheckBoxStep.d.ts +9 -0
- package/dist/FormComponents/Step/CheckBoxStep/CheckBoxStep.js +37 -0
- package/dist/FormComponents/Step/CheckBoxStep/MaterialCheckBoxStep/MaterialCheckBoxStep.d.ts +4 -0
- package/dist/FormComponents/Step/CheckBoxStep/MaterialCheckBoxStep/MaterialCheckBoxStep.js +40 -0
- package/dist/FormComponents/Step/CheckBoxStep/MaterialCheckBoxStep/MaterialCheckBoxStep.module.css +34 -0
- package/dist/FormComponents/Step/Step.js +4 -0
- package/dist/FormComponents/Step/TextAreaStep/MaterialTextAreaStep/MaterialTextAreaStep.js +34 -31
- package/dist/constants/FormStepTypes.d.ts +1 -0
- package/dist/constants/FormStepTypes.js +1 -0
- package/dist/constants/InternalFormStyle.js +1 -0
- package/dist/controllers/FileService.js +1 -1
- package/package.json +1 -1
package/dist/@Types/Form.d.ts
CHANGED
|
@@ -1,11 +1,19 @@
|
|
|
1
1
|
import Types, { ClassifierOptionTypes, ClientInfoTypes, OptionTypes } from '../constants/FormStepTypes';
|
|
2
|
-
export declare type FormStep = Title | TextArea | TextInput | DatePicker | FileUpload | Separator | FormSelector | ClassifierSelector;
|
|
2
|
+
export declare type FormStep = Title | CheckBox | TextArea | TextInput | DatePicker | FileUpload | Separator | FormSelector | ClassifierSelector;
|
|
3
3
|
export interface Title {
|
|
4
4
|
id: string;
|
|
5
5
|
type: Types.TITLE;
|
|
6
6
|
title: string;
|
|
7
7
|
description: string | null;
|
|
8
8
|
}
|
|
9
|
+
export interface CheckBox {
|
|
10
|
+
label: string;
|
|
11
|
+
description: string | null;
|
|
12
|
+
id: string;
|
|
13
|
+
type: Types.CHECKBOX;
|
|
14
|
+
required: boolean;
|
|
15
|
+
size: 1 | 2 | 3 | 4;
|
|
16
|
+
}
|
|
9
17
|
export interface FileUpload {
|
|
10
18
|
id: string;
|
|
11
19
|
type: Types.FILEUPLOAD;
|
package/dist/App.js
CHANGED
|
@@ -79,7 +79,7 @@ function App(_a) {
|
|
|
79
79
|
switch (_b.label) {
|
|
80
80
|
case 0:
|
|
81
81
|
if (!domain) return [3 /*break*/, 2];
|
|
82
|
-
return [4 /*yield*/, axios.get("https://"
|
|
82
|
+
return [4 /*yield*/, axios.get("https://".concat(domain, ".forms.").concat(process.env.REACT_APP_DOMAIN, "/api/organization?domain=").concat(domain))];
|
|
83
83
|
case 1:
|
|
84
84
|
_a = _b.sent();
|
|
85
85
|
return [3 /*break*/, 4];
|
|
@@ -105,7 +105,7 @@ function App(_a) {
|
|
|
105
105
|
var response;
|
|
106
106
|
return __generator(this, function (_a) {
|
|
107
107
|
switch (_a.label) {
|
|
108
|
-
case 0: return [4 /*yield*/, axios.get("https://"
|
|
108
|
+
case 0: return [4 /*yield*/, axios.get("https://".concat(domain, ".forms.").concat(process.env.REACT_APP_DOMAIN, "/api/organization"))];
|
|
109
109
|
case 1:
|
|
110
110
|
response = _a.sent();
|
|
111
111
|
if (response.data) {
|
|
@@ -144,7 +144,7 @@ function App(_a) {
|
|
|
144
144
|
setForm(null);
|
|
145
145
|
setOrganizationInfo(null);
|
|
146
146
|
}
|
|
147
|
-
}, [
|
|
147
|
+
}, []);
|
|
148
148
|
var containerRef = useRef();
|
|
149
149
|
var loadInfo = function (apiKey, domain) { return __awaiter(_this, void 0, void 0, function () {
|
|
150
150
|
var url, _a, response, orgInfo, error_1;
|
|
@@ -152,9 +152,9 @@ function App(_a) {
|
|
|
152
152
|
switch (_b.label) {
|
|
153
153
|
case 0:
|
|
154
154
|
_b.trys.push([0, 2, , 3]);
|
|
155
|
-
url = "https://"
|
|
155
|
+
url = "https://".concat(domain, ".forms.").concat(process.env.REACT_APP_DOMAIN, "/api/form/").concat(apiKey, "?domain=").concat(domain);
|
|
156
156
|
return [4 /*yield*/, Promise.all([
|
|
157
|
-
domain ? axios.get(url) : axiosInstance.get("/form/"
|
|
157
|
+
domain ? axios.get(url) : axiosInstance.get("/form/".concat(apiKey)),
|
|
158
158
|
fetchOrgData(domain),
|
|
159
159
|
])];
|
|
160
160
|
case 1:
|
|
@@ -114,7 +114,7 @@ function ColumnForm(_a) {
|
|
|
114
114
|
updateValue(idStep, values, form, customSteps);
|
|
115
115
|
}
|
|
116
116
|
console.log('UPDATED:', values);
|
|
117
|
-
url = "https://"
|
|
117
|
+
url = "https://".concat(domain, ".forms.").concat(process.env.REACT_APP_DOMAIN, "/api/ticket?apiKey=").concat(internal ? form.apiKey : apiKey, "&domain=").concat(domain);
|
|
118
118
|
payload = {
|
|
119
119
|
formValues: { steps: values },
|
|
120
120
|
};
|
|
@@ -123,7 +123,7 @@ function ColumnForm(_a) {
|
|
|
123
123
|
case 3:
|
|
124
124
|
_b = _c.sent();
|
|
125
125
|
return [3 /*break*/, 6];
|
|
126
|
-
case 4: return [4 /*yield*/, axiosInstance.post("ticket?apiKey="
|
|
126
|
+
case 4: return [4 /*yield*/, axiosInstance.post("ticket?apiKey=".concat(internal ? form.apiKey : apiKey), payload)];
|
|
127
127
|
case 5:
|
|
128
128
|
_b = _c.sent();
|
|
129
129
|
_c.label = 6;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { CheckBox } from '../../../@Types/FormStep';
|
|
3
|
+
import { StepProps } from '../Step';
|
|
4
|
+
export interface CheckBoxStepProps extends StepProps {
|
|
5
|
+
/** The CheckboxStep to display */
|
|
6
|
+
step: CheckBox;
|
|
7
|
+
}
|
|
8
|
+
declare function CheckboxStep({ formStyle, ...others }: CheckBoxStepProps): JSX.Element;
|
|
9
|
+
export default CheckboxStep;
|
|
@@ -0,0 +1,37 @@
|
|
|
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
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
24
|
+
import { FormStyleTypes } from '../../../constants/FormStepTypes';
|
|
25
|
+
import MaterialCheckBoxStep from './MaterialCheckBoxStep/MaterialCheckBoxStep';
|
|
26
|
+
function CheckboxStep(_a) {
|
|
27
|
+
var formStyle = _a.formStyle, others = __rest(_a, ["formStyle"]);
|
|
28
|
+
switch (formStyle.type) {
|
|
29
|
+
case FormStyleTypes.MATERIAL: {
|
|
30
|
+
return _jsx(MaterialCheckBoxStep, __assign({ formStyle: formStyle }, others), void 0);
|
|
31
|
+
}
|
|
32
|
+
default: {
|
|
33
|
+
return _jsx(MaterialCheckBoxStep, __assign({ formStyle: formStyle }, others), void 0);
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
export default CheckboxStep;
|
|
@@ -0,0 +1,40 @@
|
|
|
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
|
+
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
+
import styles from './MaterialCheckBoxStep.module.css';
|
|
14
|
+
import { calcStepWidth } from '../../StepFunctions';
|
|
15
|
+
import RoundedCheckBox from '../../../../shared/RoundedCheckBox/RoundedCheckBox';
|
|
16
|
+
import { Controller } from 'react-hook-form';
|
|
17
|
+
function CheckBoxStep(_a) {
|
|
18
|
+
var step = _a.step, form = _a.form, errors = _a.errors, control = _a.control, postview = _a.postview, formStyle = _a.formStyle, widthStats = _a.widthStats;
|
|
19
|
+
return (_jsxs("div", __assign({ className: styles.container, style: {
|
|
20
|
+
width: widthStats.currentBreakPoint <= step.size
|
|
21
|
+
? '100%'
|
|
22
|
+
: calcStepWidth(step.size, form),
|
|
23
|
+
maxWidth: '100%',
|
|
24
|
+
minHeight: step.description || step.required ? '55px' : '43px',
|
|
25
|
+
} }, { children: [_jsxs("div", __assign({ className: styles.labelCheckBoxContainer }, { children: [_jsxs("div", __assign({ className: styles.checkboxLbl }, { children: [step.label, step.required ? ' *' : '', ":"] }), void 0), _jsx(Controller, { name: step.id, control: control, defaultValue: false, rules: {
|
|
26
|
+
required: step.required
|
|
27
|
+
? 'Este campo es obligatorio'
|
|
28
|
+
: undefined,
|
|
29
|
+
}, shouldUnregister: true, render: function (_a) {
|
|
30
|
+
var field = _a.field;
|
|
31
|
+
return (_jsx(RoundedCheckBox, __assign({}, field, { inputRef: field.ref, padding: "0px", size: "1.6rem", cantEdit: postview, checkedColor: formStyle.primaryColor, uncheckedColor: formStyle.descriptionTextColor, checked: field.value }), void 0));
|
|
32
|
+
} }, void 0)] }), void 0), (step.description || !!errors[step.id]) && (_jsx("div", __assign({ className: styles.descriptionPar, style: {
|
|
33
|
+
color: !!errors[step.id]
|
|
34
|
+
? formStyle.errorColor
|
|
35
|
+
: formStyle.descriptionTextColor,
|
|
36
|
+
} }, { children: !!errors[step.id]
|
|
37
|
+
? 'Este campo es obligatorio'
|
|
38
|
+
: step.description }), void 0))] }), void 0));
|
|
39
|
+
}
|
|
40
|
+
export default CheckBoxStep;
|
package/dist/FormComponents/Step/CheckBoxStep/MaterialCheckBoxStep/MaterialCheckBoxStep.module.css
ADDED
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
.container {
|
|
2
|
+
width: fit-content;
|
|
3
|
+
max-width: 100%;
|
|
4
|
+
display: flex;
|
|
5
|
+
padding: 10px;
|
|
6
|
+
padding-bottom: 0px;
|
|
7
|
+
padding-top: 5px;
|
|
8
|
+
margin-bottom: 0px;
|
|
9
|
+
flex-direction: column;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.checkboxLbl {
|
|
13
|
+
font-size: 18px;
|
|
14
|
+
margin-right: 10px;
|
|
15
|
+
margin-left: 10px;
|
|
16
|
+
white-space: nowrap;
|
|
17
|
+
overflow: hidden;
|
|
18
|
+
text-overflow: ellipsis;
|
|
19
|
+
}
|
|
20
|
+
.labelCheckBoxContainer {
|
|
21
|
+
display: flex;
|
|
22
|
+
align-items: center;
|
|
23
|
+
flex-direction: row;
|
|
24
|
+
align-items: center;
|
|
25
|
+
height: 31px;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.descriptionPar {
|
|
29
|
+
font-size: 0.75rem;
|
|
30
|
+
margin-left: 14px;
|
|
31
|
+
margin-top: -6px;
|
|
32
|
+
font-weight: 400;
|
|
33
|
+
line-height: 1.66;
|
|
34
|
+
}
|
|
@@ -30,6 +30,7 @@ import ClassifierSelectorStep from './ClassifierSelectorStep/ClassifierSelectorS
|
|
|
30
30
|
import TextAreaStep from './TextAreaStep/TextAreaStep';
|
|
31
31
|
import DatePickerStep from './DatePickerStep/DatePickerStep';
|
|
32
32
|
import FileUploadStep from './FileUploadStep/FileUploadStep';
|
|
33
|
+
import CheckBoxStep from './CheckBoxStep/MaterialCheckBoxStep/MaterialCheckBoxStep';
|
|
33
34
|
function StepComponent(_a) {
|
|
34
35
|
var step = _a.step, props = __rest(_a, ["step"]);
|
|
35
36
|
switch (step.type) {
|
|
@@ -39,6 +40,9 @@ function StepComponent(_a) {
|
|
|
39
40
|
case Types.SELECTOR: {
|
|
40
41
|
return _jsx(SelectorStep, __assign({ step: step }, props), void 0);
|
|
41
42
|
}
|
|
43
|
+
case Types.CHECKBOX: {
|
|
44
|
+
return _jsx(CheckBoxStep, __assign({ step: step }, props), void 0);
|
|
45
|
+
}
|
|
42
46
|
case Types.CLASSIFIER_SELECTOR: {
|
|
43
47
|
return (_jsx(ClassifierSelectorStep, __assign({ step: step }, props), void 0));
|
|
44
48
|
}
|
|
@@ -36,7 +36,10 @@ function TextAreaStep(_a) {
|
|
|
36
36
|
return { border: '1px solid ' + formStyle.primaryColor };
|
|
37
37
|
}
|
|
38
38
|
else {
|
|
39
|
-
return {
|
|
39
|
+
return {
|
|
40
|
+
border: '1px solid ' + formStyle.outlineColor,
|
|
41
|
+
pointerEvents: postview ? 'none' : 'all',
|
|
42
|
+
};
|
|
40
43
|
}
|
|
41
44
|
};
|
|
42
45
|
if (step.hasTextEditor) {
|
|
@@ -51,7 +54,7 @@ function TextAreaStep(_a) {
|
|
|
51
54
|
if (!postview) {
|
|
52
55
|
setFocus(false);
|
|
53
56
|
}
|
|
54
|
-
} }, { children:
|
|
57
|
+
} }, { children: _jsx("div", __assign({ className: styles.textContainer + ' EF-DraftContainer', style: calcStyle(), onMouseEnter: function () {
|
|
55
58
|
if (!postview) {
|
|
56
59
|
setHovering(true);
|
|
57
60
|
}
|
|
@@ -63,36 +66,36 @@ function TextAreaStep(_a) {
|
|
|
63
66
|
if (!postview) {
|
|
64
67
|
setFocus(true);
|
|
65
68
|
}
|
|
66
|
-
} }, { children:
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
69
|
+
} }, { children: _jsx(Controller, { name: step.id, control: control, defaultValue: originalValues[step.id]
|
|
70
|
+
? EditorState.createWithContent(convertFromRaw(getRawText(originalValues[step.id].draft, originalValues[step.id].text)))
|
|
71
|
+
: EditorState.createEmpty(), rules: step.required
|
|
72
|
+
? {
|
|
73
|
+
validate: function (editorState) {
|
|
74
|
+
return editorState
|
|
75
|
+
.getCurrentContent()
|
|
76
|
+
.hasText();
|
|
77
|
+
},
|
|
78
|
+
}
|
|
79
|
+
: {}, shouldUnregister: true, render: function (_a) {
|
|
80
|
+
var _b;
|
|
81
|
+
var field = _a.field;
|
|
82
|
+
return (_jsx(Editor, { editorRef: field.ref, onFocus: function () {
|
|
83
|
+
setFocus(true);
|
|
84
|
+
}, readOnly: postview, onBlur: field.onBlur, editorState: field.value, onEditorStateChange: field.onChange, toolbarClassName: styles.toolbar, editorClassName: styles.editor, wrapperClassName: styles.wrapper, placeholder: (_b = step.description) !== null && _b !== void 0 ? _b : '', toolbar: {
|
|
85
|
+
options: ['inline', 'list', 'history'],
|
|
86
|
+
inline: {
|
|
87
|
+
options: [
|
|
88
|
+
'bold',
|
|
89
|
+
'italic',
|
|
90
|
+
'underline',
|
|
91
|
+
'strikethrough',
|
|
92
|
+
],
|
|
93
|
+
},
|
|
94
|
+
list: {
|
|
95
|
+
options: ['unordered'],
|
|
74
96
|
},
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
var _b;
|
|
78
|
-
var field = _a.field;
|
|
79
|
-
return (_jsx(Editor, { editorRef: field.ref, onFocus: function () {
|
|
80
|
-
setFocus(true);
|
|
81
|
-
}, onBlur: field.onBlur, editorState: field.value, onEditorStateChange: field.onChange, toolbarClassName: styles.toolbar, editorClassName: styles.editor, wrapperClassName: styles.wrapper, placeholder: (_b = step.description) !== null && _b !== void 0 ? _b : '', toolbar: {
|
|
82
|
-
options: ['inline', 'list', 'history'],
|
|
83
|
-
inline: {
|
|
84
|
-
options: [
|
|
85
|
-
'bold',
|
|
86
|
-
'italic',
|
|
87
|
-
'underline',
|
|
88
|
-
'strikethrough',
|
|
89
|
-
],
|
|
90
|
-
},
|
|
91
|
-
list: {
|
|
92
|
-
options: ['unordered'],
|
|
93
|
-
},
|
|
94
|
-
} }, void 0));
|
|
95
|
-
} }, void 0)] }), void 0) }), void 0), _jsx("div", __assign({ className: styles.errorMsg, style: {
|
|
97
|
+
} }, void 0));
|
|
98
|
+
} }, void 0) }), void 0) }), void 0), _jsx("div", __assign({ className: styles.errorMsg, style: {
|
|
96
99
|
color: formStyle.errorColor,
|
|
97
100
|
} }, { children: !!errors[step.id] && 'Este campo es obligatorio' }), void 0)] }), void 0));
|
|
98
101
|
}
|
|
@@ -48,7 +48,7 @@ export function getUploadUrls(files, domain) {
|
|
|
48
48
|
extension: file.name.split('.').pop(),
|
|
49
49
|
}); });
|
|
50
50
|
if (!domain) return [3 /*break*/, 2];
|
|
51
|
-
return [4 /*yield*/, axios.post("https://"
|
|
51
|
+
return [4 /*yield*/, axios.post("https://".concat(domain, ".forms.").concat(process.env.REACT_APP_DOMAIN, "/api/uploadfile"), {
|
|
52
52
|
domain: domain,
|
|
53
53
|
files: filesArray,
|
|
54
54
|
})];
|
package/package.json
CHANGED