react-survey-builder 1.0.1
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/LICENSE +7 -0
- package/README.md +236 -0
- package/dist/967.index.js +1 -0
- package/dist/app.css +1 -0
- package/dist/app.css.map +1 -0
- package/dist/index.js +2 -0
- package/dist/index.js.LICENSE.txt +46 -0
- package/lib/ItemTypes.js +10 -0
- package/lib/UUID.js +65 -0
- package/lib/dynamic-option-list.js +188 -0
- package/lib/fieldset/FieldSet.js +118 -0
- package/lib/fieldset/index.js +13 -0
- package/lib/form.js +604 -0
- package/lib/functions/index.js +45 -0
- package/lib/index.js +139 -0
- package/lib/language-provider/IntlMessages.js +15 -0
- package/lib/language-provider/entries/en-us.js +16 -0
- package/lib/language-provider/entries/it-it.js +16 -0
- package/lib/language-provider/entries/vi-vn.js +16 -0
- package/lib/language-provider/index.js +32 -0
- package/lib/language-provider/locales/en-us.json +97 -0
- package/lib/language-provider/locales/it-it.json +92 -0
- package/lib/language-provider/locales/vi-vn.json +82 -0
- package/lib/multi-column/MultiColumnRow.js +134 -0
- package/lib/multi-column/dustbin.js +152 -0
- package/lib/multi-column/grip.js +51 -0
- package/lib/multi-column/index.js +24 -0
- package/lib/preview.js +388 -0
- package/lib/sortable-element.js +177 -0
- package/lib/sortable-form-elements.js +67 -0
- package/lib/stores/registry.js +42 -0
- package/lib/stores/requests.js +31 -0
- package/lib/stores/store.js +138 -0
- package/lib/survey-dynamic-edit.js +54 -0
- package/lib/survey-elements/component-drag-handle.js +90 -0
- package/lib/survey-elements/component-drag-layer.js +68 -0
- package/lib/survey-elements/component-drag-preview.js +57 -0
- package/lib/survey-elements/component-header.js +29 -0
- package/lib/survey-elements/component-label.js +26 -0
- package/lib/survey-elements/custom-element.js +70 -0
- package/lib/survey-elements/date-picker.js +278 -0
- package/lib/survey-elements/header-bar.js +54 -0
- package/lib/survey-elements/index.js +1196 -0
- package/lib/survey-elements/myxss.js +29 -0
- package/lib/survey-elements/star-rating.js +335 -0
- package/lib/survey-elements-edit.js +613 -0
- package/lib/survey-place-holder.js +51 -0
- package/lib/survey-validator.js +103 -0
- package/lib/toolbar-draggable-item.js +59 -0
- package/lib/toolbar-group-item.js +39 -0
- package/lib/toolbar.js +680 -0
- package/lib/utils/custom-date-picker.js +93 -0
- package/package.json +114 -0
- package/types/index.d.ts +180 -0
package/lib/form.js
ADDED
@@ -0,0 +1,604 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
5
|
+
value: true
|
6
|
+
});
|
7
|
+
exports["default"] = void 0;
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
9
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
10
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
11
|
+
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
12
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
13
|
+
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
14
|
+
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
15
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
16
|
+
var _react = _interopRequireDefault(require("react"));
|
17
|
+
var _reactDom = _interopRequireDefault(require("react-dom"));
|
18
|
+
var _fbemitter = require("fbemitter");
|
19
|
+
var _reactIntl = require("react-intl");
|
20
|
+
var _surveyValidator = _interopRequireDefault(require("./survey-validator"));
|
21
|
+
var _surveyElements = _interopRequireDefault(require("./survey-elements"));
|
22
|
+
var _multiColumn = require("./multi-column");
|
23
|
+
var _fieldset = require("./fieldset");
|
24
|
+
var _customElement = _interopRequireDefault(require("./survey-elements/custom-element"));
|
25
|
+
var _registry = _interopRequireDefault(require("./stores/registry"));
|
26
|
+
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
|
27
|
+
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /**
|
28
|
+
* <Form />
|
29
|
+
*/
|
30
|
+
var Image = _surveyElements["default"].Image,
|
31
|
+
Checkboxes = _surveyElements["default"].Checkboxes,
|
32
|
+
Signature = _surveyElements["default"].Signature,
|
33
|
+
Download = _surveyElements["default"].Download,
|
34
|
+
Camera = _surveyElements["default"].Camera,
|
35
|
+
FileUpload = _surveyElements["default"].FileUpload;
|
36
|
+
var ReactSurvey = /*#__PURE__*/function (_React$Component) {
|
37
|
+
(0, _inherits2["default"])(ReactSurvey, _React$Component);
|
38
|
+
var _super = _createSuper(ReactSurvey);
|
39
|
+
function ReactSurvey(props) {
|
40
|
+
var _this;
|
41
|
+
(0, _classCallCheck2["default"])(this, ReactSurvey);
|
42
|
+
_this = _super.call(this, props);
|
43
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "form", void 0);
|
44
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "inputs", {});
|
45
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "answerData", void 0);
|
46
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleRenderSubmit", function () {
|
47
|
+
var name = _this.props.action_name || _this.props.actionName;
|
48
|
+
var actionName = name || 'Submit';
|
49
|
+
var _this$props$submitBut = _this.props.submitButton,
|
50
|
+
submitButton = _this$props$submitBut === void 0 ? false : _this$props$submitBut;
|
51
|
+
return submitButton || /*#__PURE__*/_react["default"].createElement("input", {
|
52
|
+
type: "submit",
|
53
|
+
className: "btn btn-big",
|
54
|
+
value: actionName
|
55
|
+
});
|
56
|
+
});
|
57
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleRenderBack", function () {
|
58
|
+
var name = _this.props.back_name || _this.props.backName;
|
59
|
+
var backName = name || 'Cancel';
|
60
|
+
var _this$props$backButto = _this.props.backButton,
|
61
|
+
backButton = _this$props$backButto === void 0 ? false : _this$props$backButto;
|
62
|
+
return backButton || /*#__PURE__*/_react["default"].createElement("a", {
|
63
|
+
href: _this.props.back_action,
|
64
|
+
className: "btn btn-default btn-cancel btn-big"
|
65
|
+
}, backName);
|
66
|
+
});
|
67
|
+
_this.answerData = _this._convert(props.answer_data);
|
68
|
+
_this.emitter = new _fbemitter.EventEmitter();
|
69
|
+
_this.getDataById = _this.getDataById.bind((0, _assertThisInitialized2["default"])(_this));
|
70
|
+
|
71
|
+
// Bind handleBlur and handleChange methods
|
72
|
+
_this.handleBlur = _this.handleBlur.bind((0, _assertThisInitialized2["default"])(_this));
|
73
|
+
_this.handleChange = _this.handleChange.bind((0, _assertThisInitialized2["default"])(_this));
|
74
|
+
_this.handleSubmit = _this.handleSubmit.bind((0, _assertThisInitialized2["default"])(_this));
|
75
|
+
return _this;
|
76
|
+
}
|
77
|
+
(0, _createClass2["default"])(ReactSurvey, [{
|
78
|
+
key: "_convert",
|
79
|
+
value: function _convert(answers) {
|
80
|
+
if (Array.isArray(answers)) {
|
81
|
+
var result = {};
|
82
|
+
answers.forEach(function (x) {
|
83
|
+
if (x.name.indexOf('tags_') > -1) {
|
84
|
+
result[x.name] = x.value.map(function (y) {
|
85
|
+
return y.value;
|
86
|
+
});
|
87
|
+
} else {
|
88
|
+
result[x.name] = x.value;
|
89
|
+
}
|
90
|
+
});
|
91
|
+
return result;
|
92
|
+
}
|
93
|
+
return answers || {};
|
94
|
+
}
|
95
|
+
}, {
|
96
|
+
key: "_getDefaultValue",
|
97
|
+
value: function _getDefaultValue(item) {
|
98
|
+
return this.answerData[item.field_name];
|
99
|
+
}
|
100
|
+
}, {
|
101
|
+
key: "_optionsDefaultValue",
|
102
|
+
value: function _optionsDefaultValue(item) {
|
103
|
+
var _this2 = this;
|
104
|
+
var defaultValue = this._getDefaultValue(item);
|
105
|
+
if (defaultValue) {
|
106
|
+
return defaultValue;
|
107
|
+
}
|
108
|
+
var defaultChecked = [];
|
109
|
+
item.options.forEach(function (option) {
|
110
|
+
if (_this2.answerData["option_".concat(option.key)]) {
|
111
|
+
defaultChecked.push(option.key);
|
112
|
+
}
|
113
|
+
});
|
114
|
+
return defaultChecked;
|
115
|
+
}
|
116
|
+
}, {
|
117
|
+
key: "_getItemValue",
|
118
|
+
value: function _getItemValue(item, ref) {
|
119
|
+
var $item = {
|
120
|
+
element: item.element,
|
121
|
+
value: ''
|
122
|
+
};
|
123
|
+
if (item.element === 'Rating') {
|
124
|
+
$item.value = ref.inputField.current.state.rating;
|
125
|
+
} else if (item.element === 'Tags') {
|
126
|
+
$item.value = ref.inputField.current.state.value;
|
127
|
+
} else if (item.element === 'DatePicker') {
|
128
|
+
$item.value = ref.state.value;
|
129
|
+
} else if (item.element === 'Camera') {
|
130
|
+
$item.value = ref.state.img;
|
131
|
+
} else if (item.element === 'FileUpload') {
|
132
|
+
$item.value = ref.state.fileUpload;
|
133
|
+
} else if (ref && ref.inputField && ref.inputField.current) {
|
134
|
+
$item = _reactDom["default"].findDOMNode(ref.inputField.current);
|
135
|
+
if ($item && typeof $item.value === 'string') {
|
136
|
+
$item.value = $item.value.trim();
|
137
|
+
}
|
138
|
+
}
|
139
|
+
return $item;
|
140
|
+
}
|
141
|
+
}, {
|
142
|
+
key: "_isIncorrect",
|
143
|
+
value: function _isIncorrect(item) {
|
144
|
+
var incorrect = false;
|
145
|
+
if (item.canHaveAnswer) {
|
146
|
+
var ref = this.inputs[item.field_name];
|
147
|
+
if (item.element === 'Checkboxes' || item.element === 'RadioButtons') {
|
148
|
+
item.options.forEach(function (option) {
|
149
|
+
var $option = _reactDom["default"].findDOMNode(ref.options["child_ref_".concat(option.key)]);
|
150
|
+
if (option.hasOwnProperty('correct') && !$option.checked || !option.hasOwnProperty('correct') && $option.checked) {
|
151
|
+
incorrect = true;
|
152
|
+
}
|
153
|
+
});
|
154
|
+
} else {
|
155
|
+
var $item = this._getItemValue(item, ref);
|
156
|
+
if (item.element === 'Rating') {
|
157
|
+
if ($item.value.toString() !== item.correct) {
|
158
|
+
incorrect = true;
|
159
|
+
}
|
160
|
+
} else if ($item.value.toLowerCase() !== item.correct.trim().toLowerCase()) {
|
161
|
+
incorrect = true;
|
162
|
+
}
|
163
|
+
}
|
164
|
+
}
|
165
|
+
return incorrect;
|
166
|
+
}
|
167
|
+
}, {
|
168
|
+
key: "_isInvalid",
|
169
|
+
value: function _isInvalid(item) {
|
170
|
+
var invalid = false;
|
171
|
+
if (item.required === true) {
|
172
|
+
var ref = this.inputs[item.field_name];
|
173
|
+
if (item.element === 'Checkboxes' || item.element === 'RadioButtons') {
|
174
|
+
var checked_options = 0;
|
175
|
+
item.options.forEach(function (option) {
|
176
|
+
var $option = _reactDom["default"].findDOMNode(ref.options["child_ref_".concat(option.key)]);
|
177
|
+
if ($option.checked) {
|
178
|
+
checked_options += 1;
|
179
|
+
}
|
180
|
+
});
|
181
|
+
if (checked_options < 1) {
|
182
|
+
// errors.push(item.label + ' is required!');
|
183
|
+
invalid = true;
|
184
|
+
}
|
185
|
+
} else {
|
186
|
+
var $item = this._getItemValue(item, ref);
|
187
|
+
if (item.element === 'Rating') {
|
188
|
+
if ($item.value === 0) {
|
189
|
+
invalid = true;
|
190
|
+
}
|
191
|
+
} else if ($item.value === undefined || $item.value.length < 1) {
|
192
|
+
invalid = true;
|
193
|
+
}
|
194
|
+
}
|
195
|
+
}
|
196
|
+
return invalid;
|
197
|
+
}
|
198
|
+
}, {
|
199
|
+
key: "_collect",
|
200
|
+
value: function _collect(item) {
|
201
|
+
var itemData = {
|
202
|
+
id: item.id,
|
203
|
+
name: item.field_name,
|
204
|
+
custom_name: item.custom_name || item.field_name
|
205
|
+
};
|
206
|
+
if (!itemData.name) return null;
|
207
|
+
var ref = this.inputs[item.field_name];
|
208
|
+
if (item.element === 'Checkboxes' || item.element === 'RadioButtons') {
|
209
|
+
var checked_options = [];
|
210
|
+
item.options.forEach(function (option) {
|
211
|
+
var $option = _reactDom["default"].findDOMNode(ref.options["child_ref_".concat(option.key)]);
|
212
|
+
if ($option.checked) {
|
213
|
+
checked_options.push(option.key);
|
214
|
+
}
|
215
|
+
});
|
216
|
+
itemData.value = checked_options;
|
217
|
+
} else if (item.element === 'Checkbox') {
|
218
|
+
if (!ref || !ref.inputField || !ref.inputField.current) {
|
219
|
+
itemData.value = false;
|
220
|
+
} else {
|
221
|
+
itemData.value = ref.inputField.current.checked;
|
222
|
+
}
|
223
|
+
} else {
|
224
|
+
if (!ref) return null;
|
225
|
+
itemData.value = this._getItemValue(item, ref).value;
|
226
|
+
}
|
227
|
+
itemData.required = item.required || false;
|
228
|
+
return itemData;
|
229
|
+
}
|
230
|
+
}, {
|
231
|
+
key: "_collectFormData",
|
232
|
+
value: function _collectFormData(data) {
|
233
|
+
var _this3 = this;
|
234
|
+
var formData = [];
|
235
|
+
data.forEach(function (item) {
|
236
|
+
var item_data = _this3._collect(item);
|
237
|
+
if (item_data) {
|
238
|
+
formData.push(item_data);
|
239
|
+
}
|
240
|
+
});
|
241
|
+
return formData;
|
242
|
+
}
|
243
|
+
}, {
|
244
|
+
key: "_getSignatureImg",
|
245
|
+
value: function _getSignatureImg(item) {
|
246
|
+
var ref = this.inputs[item.field_name];
|
247
|
+
var $canvas_sig = ref.canvas.current;
|
248
|
+
if ($canvas_sig) {
|
249
|
+
var base64 = $canvas_sig.toDataURL().replace('data:image/png;base64,', '');
|
250
|
+
var isEmpty = $canvas_sig.isEmpty();
|
251
|
+
var $input_sig = _reactDom["default"].findDOMNode(ref.inputField.current);
|
252
|
+
if (isEmpty) {
|
253
|
+
$input_sig.value = '';
|
254
|
+
} else {
|
255
|
+
$input_sig.value = base64;
|
256
|
+
}
|
257
|
+
}
|
258
|
+
}
|
259
|
+
}, {
|
260
|
+
key: "handleSubmit",
|
261
|
+
value: function handleSubmit(e) {
|
262
|
+
e.preventDefault();
|
263
|
+
var errors = [];
|
264
|
+
if (!this.props.skip_validations) {
|
265
|
+
errors = this.validateForm();
|
266
|
+
// Publish errors, if any.
|
267
|
+
this.emitter.emit('surveyValidation', errors);
|
268
|
+
}
|
269
|
+
|
270
|
+
// Only submit if there are no errors.
|
271
|
+
if (errors.length < 1) {
|
272
|
+
var onSubmit = this.props.onSubmit;
|
273
|
+
if (onSubmit) {
|
274
|
+
var data = this._collectFormData(this.props.data);
|
275
|
+
onSubmit(data);
|
276
|
+
} else {
|
277
|
+
var $form = _reactDom["default"].findDOMNode(this.form);
|
278
|
+
$form.submit();
|
279
|
+
}
|
280
|
+
}
|
281
|
+
}
|
282
|
+
}, {
|
283
|
+
key: "handleBlur",
|
284
|
+
value: function handleBlur(event) {
|
285
|
+
// Call submit function on blur
|
286
|
+
if (this.props.onBlur) {
|
287
|
+
var onBlur = this.props.onBlur;
|
288
|
+
var data = this._collectFormData(this.props.data);
|
289
|
+
onBlur(data);
|
290
|
+
}
|
291
|
+
}
|
292
|
+
}, {
|
293
|
+
key: "handleChange",
|
294
|
+
value: function handleChange(event) {
|
295
|
+
// Call submit function on change
|
296
|
+
if (this.props.onChange) {
|
297
|
+
var onChange = this.props.onChange;
|
298
|
+
var data = this._collectFormData(this.props.data);
|
299
|
+
onChange(data);
|
300
|
+
}
|
301
|
+
}
|
302
|
+
}, {
|
303
|
+
key: "validateForm",
|
304
|
+
value: function validateForm() {
|
305
|
+
var _this4 = this;
|
306
|
+
var errors = [];
|
307
|
+
var data_items = this.props.data;
|
308
|
+
var intl = this.props.intl;
|
309
|
+
if (this.props.display_short) {
|
310
|
+
data_items = this.props.data.filter(function (i) {
|
311
|
+
return i.alternateForm === true;
|
312
|
+
});
|
313
|
+
}
|
314
|
+
data_items.forEach(function (item) {
|
315
|
+
if (item.element === 'Signature') {
|
316
|
+
_this4._getSignatureImg(item);
|
317
|
+
}
|
318
|
+
if (_this4._isInvalid(item)) {
|
319
|
+
errors.push("".concat(item.label, " ").concat(intl.formatMessage({
|
320
|
+
id: 'message.is-required'
|
321
|
+
}), "!"));
|
322
|
+
}
|
323
|
+
if (item.element === 'EmailInput') {
|
324
|
+
var ref = _this4.inputs[item.field_name];
|
325
|
+
var emailValue = _this4._getItemValue(item, ref).value;
|
326
|
+
if (emailValue) {
|
327
|
+
var validateEmail = function validateEmail(email) {
|
328
|
+
return email.match(
|
329
|
+
// eslint-disable-next-line no-useless-escape
|
330
|
+
/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/);
|
331
|
+
};
|
332
|
+
var checkEmail = validateEmail(emailValue);
|
333
|
+
if (!checkEmail) {
|
334
|
+
errors.push("".concat(item.label, " ").concat(intl.formatMessage({
|
335
|
+
id: 'message.invalid-email'
|
336
|
+
})));
|
337
|
+
}
|
338
|
+
}
|
339
|
+
}
|
340
|
+
if (item.element === 'PhoneNumber') {
|
341
|
+
var _ref = _this4.inputs[item.field_name];
|
342
|
+
var phoneValue = _this4._getItemValue(item, _ref).value;
|
343
|
+
if (phoneValue) {
|
344
|
+
var validatePhone = function validatePhone(phone) {
|
345
|
+
return phone.match(
|
346
|
+
// eslint-disable-next-line no-useless-escape
|
347
|
+
/^[+]?(1\-|1\s|1|\d{3}\-|\d{3}\s|)?((\(\d{3}\))|\d{3})(\-|\s)?(\d{3})(\-|\s)?(\d{4})$/g);
|
348
|
+
};
|
349
|
+
var checkPhone = validatePhone(phoneValue);
|
350
|
+
if (!checkPhone) {
|
351
|
+
errors.push("".concat(item.label, " ").concat(intl.formatMessage({
|
352
|
+
id: 'message.invalid-phone-number'
|
353
|
+
})));
|
354
|
+
}
|
355
|
+
}
|
356
|
+
}
|
357
|
+
if (_this4.props.validateForCorrectness && _this4._isIncorrect(item)) {
|
358
|
+
errors.push("".concat(item.label, " ").concat(intl.formatMessage({
|
359
|
+
id: 'message.was-answered-incorrectly'
|
360
|
+
}), "!"));
|
361
|
+
}
|
362
|
+
});
|
363
|
+
return errors;
|
364
|
+
}
|
365
|
+
}, {
|
366
|
+
key: "getDataById",
|
367
|
+
value: function getDataById(id) {
|
368
|
+
var data = this.props.data;
|
369
|
+
return data.find(function (x) {
|
370
|
+
return x.id === id;
|
371
|
+
});
|
372
|
+
}
|
373
|
+
}, {
|
374
|
+
key: "getInputElement",
|
375
|
+
value: function getInputElement(item) {
|
376
|
+
var _this5 = this;
|
377
|
+
if (item.custom) {
|
378
|
+
return this.getCustomElement(item);
|
379
|
+
}
|
380
|
+
var Input = _surveyElements["default"][item.element];
|
381
|
+
return /*#__PURE__*/_react["default"].createElement(Input, {
|
382
|
+
handleChange: this.handleChange,
|
383
|
+
ref: function ref(c) {
|
384
|
+
return _this5.inputs[item.field_name] = c;
|
385
|
+
},
|
386
|
+
mutable: true,
|
387
|
+
key: "form_".concat(item.id),
|
388
|
+
data: item,
|
389
|
+
read_only: this.props.read_only,
|
390
|
+
hide_required_alert: this.props.hide_required_alert,
|
391
|
+
defaultValue: this._getDefaultValue(item)
|
392
|
+
});
|
393
|
+
}
|
394
|
+
}, {
|
395
|
+
key: "getContainerElement",
|
396
|
+
value: function getContainerElement(item, Element) {
|
397
|
+
var _this6 = this;
|
398
|
+
var controls = item.childItems.map(function (x) {
|
399
|
+
return x ? _this6.getInputElement(_this6.getDataById(x)) : /*#__PURE__*/_react["default"].createElement("div", null, "\xA0");
|
400
|
+
});
|
401
|
+
return /*#__PURE__*/_react["default"].createElement(Element, {
|
402
|
+
mutable: true,
|
403
|
+
key: "form_".concat(item.id),
|
404
|
+
data: item,
|
405
|
+
controls: controls,
|
406
|
+
hide_required_alert: this.props.hide_required_alert
|
407
|
+
});
|
408
|
+
}
|
409
|
+
}, {
|
410
|
+
key: "getSimpleElement",
|
411
|
+
value: function getSimpleElement(item) {
|
412
|
+
var Element = _surveyElements["default"][item.element];
|
413
|
+
return /*#__PURE__*/_react["default"].createElement(Element, {
|
414
|
+
mutable: true,
|
415
|
+
key: "form_".concat(item.id),
|
416
|
+
data: item,
|
417
|
+
hide_required_alert: this.props.hide_required_alert
|
418
|
+
});
|
419
|
+
}
|
420
|
+
}, {
|
421
|
+
key: "getCustomElement",
|
422
|
+
value: function getCustomElement(item) {
|
423
|
+
var _this7 = this;
|
424
|
+
var intl = this.props.intl;
|
425
|
+
if (!item.component || typeof item.component !== 'function') {
|
426
|
+
item.component = _registry["default"].get(item.key);
|
427
|
+
if (!item.component) {
|
428
|
+
console.error("".concat(item.element, " ").concat(intl.formatMessage({
|
429
|
+
id: 'message.was-not-registered'
|
430
|
+
})));
|
431
|
+
}
|
432
|
+
}
|
433
|
+
var inputProps = item.forwardRef && {
|
434
|
+
handleChange: this.handleChange,
|
435
|
+
defaultValue: this._getDefaultValue(item),
|
436
|
+
ref: function ref(c) {
|
437
|
+
return _this7.inputs[item.field_name] = c;
|
438
|
+
}
|
439
|
+
};
|
440
|
+
return /*#__PURE__*/_react["default"].createElement(_customElement["default"], (0, _extends2["default"])({
|
441
|
+
mutable: true,
|
442
|
+
read_only: this.props.read_only,
|
443
|
+
hide_required_alert: this.props.hide_required_alert,
|
444
|
+
key: "form_".concat(item.id),
|
445
|
+
data: item
|
446
|
+
}, inputProps));
|
447
|
+
}
|
448
|
+
}, {
|
449
|
+
key: "render",
|
450
|
+
value: function render() {
|
451
|
+
var _this8 = this;
|
452
|
+
var data_items = this.props.data;
|
453
|
+
if (this.props.display_short) {
|
454
|
+
data_items = this.props.data.filter(function (i) {
|
455
|
+
return i.alternateForm === true;
|
456
|
+
});
|
457
|
+
}
|
458
|
+
data_items.forEach(function (item) {
|
459
|
+
if (item && item.readOnly && item.variableKey && _this8.props.variables[item.variableKey]) {
|
460
|
+
_this8.answerData[item.field_name] = _this8.props.variables[item.variableKey];
|
461
|
+
}
|
462
|
+
});
|
463
|
+
var items = data_items.filter(function (x) {
|
464
|
+
return !x.parentId;
|
465
|
+
}).map(function (item) {
|
466
|
+
if (!item) return null;
|
467
|
+
switch (item.element) {
|
468
|
+
case 'TextInput':
|
469
|
+
case 'EmailInput':
|
470
|
+
case 'PhoneNumber':
|
471
|
+
case 'NumberInput':
|
472
|
+
case 'TextArea':
|
473
|
+
case 'Dropdown':
|
474
|
+
case 'DatePicker':
|
475
|
+
case 'RadioButtons':
|
476
|
+
case 'Rating':
|
477
|
+
case 'Tags':
|
478
|
+
case 'Range':
|
479
|
+
case 'Checkbox':
|
480
|
+
return _this8.getInputElement(item);
|
481
|
+
case 'CustomElement':
|
482
|
+
return _this8.getCustomElement(item);
|
483
|
+
case 'MultiColumnRow':
|
484
|
+
return _this8.getContainerElement(item, _multiColumn.MultiColumnRow);
|
485
|
+
case 'ThreeColumnRow':
|
486
|
+
return _this8.getContainerElement(item, _multiColumn.ThreeColumnRow);
|
487
|
+
case 'TwoColumnRow':
|
488
|
+
return _this8.getContainerElement(item, _multiColumn.TwoColumnRow);
|
489
|
+
case 'FieldSet':
|
490
|
+
return _this8.getContainerElement(item, _fieldset.FieldSet);
|
491
|
+
case 'Signature':
|
492
|
+
return /*#__PURE__*/_react["default"].createElement(Signature, {
|
493
|
+
ref: function ref(c) {
|
494
|
+
return _this8.inputs[item.field_name] = c;
|
495
|
+
},
|
496
|
+
read_only: _this8.props.read_only || item.readOnly,
|
497
|
+
mutable: true,
|
498
|
+
key: "form_".concat(item.id),
|
499
|
+
data: item,
|
500
|
+
defaultValue: _this8._getDefaultValue(item)
|
501
|
+
});
|
502
|
+
case 'Checkboxes':
|
503
|
+
return /*#__PURE__*/_react["default"].createElement(Checkboxes, {
|
504
|
+
ref: function ref(c) {
|
505
|
+
return _this8.inputs[item.field_name] = c;
|
506
|
+
},
|
507
|
+
read_only: _this8.props.read_only,
|
508
|
+
handleChange: _this8.handleChange,
|
509
|
+
mutable: true,
|
510
|
+
key: "form_".concat(item.id),
|
511
|
+
data: item,
|
512
|
+
defaultValue: _this8._optionsDefaultValue(item),
|
513
|
+
hide_required_alert: _this8.props.hide_required_alert
|
514
|
+
});
|
515
|
+
case 'Image':
|
516
|
+
return /*#__PURE__*/_react["default"].createElement(Image, {
|
517
|
+
ref: function ref(c) {
|
518
|
+
return _this8.inputs[item.field_name] = c;
|
519
|
+
},
|
520
|
+
handleChange: _this8.handleChange,
|
521
|
+
mutable: true,
|
522
|
+
key: "form_".concat(item.id),
|
523
|
+
data: item,
|
524
|
+
defaultValue: _this8._getDefaultValue(item),
|
525
|
+
hide_required_alert: _this8.props.hide_required_alert
|
526
|
+
});
|
527
|
+
case 'Download':
|
528
|
+
return /*#__PURE__*/_react["default"].createElement(Download, {
|
529
|
+
download_path: _this8.props.download_path,
|
530
|
+
mutable: true,
|
531
|
+
key: "form_".concat(item.id),
|
532
|
+
data: item,
|
533
|
+
hide_required_alert: _this8.props.hide_required_alert
|
534
|
+
});
|
535
|
+
case 'Camera':
|
536
|
+
return /*#__PURE__*/_react["default"].createElement(Camera, {
|
537
|
+
ref: function ref(c) {
|
538
|
+
return _this8.inputs[item.field_name] = c;
|
539
|
+
},
|
540
|
+
read_only: _this8.props.read_only || item.readOnly,
|
541
|
+
mutable: true,
|
542
|
+
key: "form_".concat(item.id),
|
543
|
+
data: item,
|
544
|
+
defaultValue: _this8._getDefaultValue(item),
|
545
|
+
hide_required_alert: _this8.props.hide_required_alert
|
546
|
+
});
|
547
|
+
case 'FileUpload':
|
548
|
+
return /*#__PURE__*/_react["default"].createElement(FileUpload, {
|
549
|
+
ref: function ref(c) {
|
550
|
+
return _this8.inputs[item.field_name] = c;
|
551
|
+
},
|
552
|
+
read_only: _this8.props.read_only || item.readOnly,
|
553
|
+
mutable: true,
|
554
|
+
key: "form_".concat(item.id),
|
555
|
+
data: item,
|
556
|
+
hide_required_alert: _this8.props.hide_required_alert,
|
557
|
+
defaultValue: _this8._getDefaultValue(item)
|
558
|
+
});
|
559
|
+
default:
|
560
|
+
return _this8.getSimpleElement(item);
|
561
|
+
}
|
562
|
+
});
|
563
|
+
var formTokenStyle = {
|
564
|
+
display: 'none'
|
565
|
+
};
|
566
|
+
return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_surveyValidator["default"], {
|
567
|
+
emitter: this.emitter
|
568
|
+
}), /*#__PURE__*/_react["default"].createElement("div", {
|
569
|
+
className: "react-survey-builder-form"
|
570
|
+
}, /*#__PURE__*/_react["default"].createElement("form", {
|
571
|
+
encType: "multipart/form-data",
|
572
|
+
ref: function ref(c) {
|
573
|
+
return _this8.form = c;
|
574
|
+
},
|
575
|
+
action: this.props.form_action,
|
576
|
+
onBlur: this.handleBlur,
|
577
|
+
onChange: this.handleChange,
|
578
|
+
onSubmit: this.handleSubmit,
|
579
|
+
method: this.props.form_method
|
580
|
+
}, this.props.authenticity_token && /*#__PURE__*/_react["default"].createElement("div", {
|
581
|
+
style: formTokenStyle
|
582
|
+
}, /*#__PURE__*/_react["default"].createElement("input", {
|
583
|
+
name: "utf8",
|
584
|
+
type: "hidden",
|
585
|
+
value: "\u2713"
|
586
|
+
}), /*#__PURE__*/_react["default"].createElement("input", {
|
587
|
+
name: "authenticity_token",
|
588
|
+
type: "hidden",
|
589
|
+
value: this.props.authenticity_token
|
590
|
+
}), /*#__PURE__*/_react["default"].createElement("input", {
|
591
|
+
name: "task_id",
|
592
|
+
type: "hidden",
|
593
|
+
value: this.props.task_id
|
594
|
+
})), items, /*#__PURE__*/_react["default"].createElement("div", {
|
595
|
+
className: "btn-toolbar"
|
596
|
+
}, !this.props.hide_actions && this.handleRenderSubmit(), !this.props.hide_actions && this.props.back_action && this.handleRenderBack()))));
|
597
|
+
}
|
598
|
+
}]);
|
599
|
+
return ReactSurvey;
|
600
|
+
}(_react["default"].Component);
|
601
|
+
var _default = exports["default"] = (0, _reactIntl.injectIntl)(ReactSurvey);
|
602
|
+
ReactSurvey.defaultProps = {
|
603
|
+
validateForCorrectness: false
|
604
|
+
};
|
@@ -0,0 +1,45 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
6
|
+
value: true
|
7
|
+
});
|
8
|
+
exports.DraftJs = void 0;
|
9
|
+
Object.defineProperty(exports, "Editor", {
|
10
|
+
enumerable: true,
|
11
|
+
get: function get() {
|
12
|
+
return _reactDraftWysiwyg.Editor;
|
13
|
+
}
|
14
|
+
});
|
15
|
+
exports.generateUUID = exports.draftToHtml = exports.TextAreaAutosize = void 0;
|
16
|
+
exports.groupBy = groupBy;
|
17
|
+
var _react = _interopRequireDefault(require("react"));
|
18
|
+
var PkgTextAreaAutosize = _interopRequireWildcard(require("react-textarea-autosize"));
|
19
|
+
var DraftJs = _interopRequireWildcard(require("draft-js"));
|
20
|
+
exports.DraftJs = DraftJs;
|
21
|
+
var draftToHtml = _interopRequireWildcard(require("draftjs-to-html"));
|
22
|
+
exports.draftToHtml = draftToHtml;
|
23
|
+
var _reactDraftWysiwyg = require("react-draft-wysiwyg");
|
24
|
+
var _UUID = _interopRequireDefault(require("../UUID"));
|
25
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
26
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
27
|
+
var generateUUID = exports.generateUUID = function generateUUID() {
|
28
|
+
return _UUID["default"].uuid();
|
29
|
+
};
|
30
|
+
var TextAreaAutosize = exports.TextAreaAutosize = function TextAreaAutosize(props) {
|
31
|
+
return /*#__PURE__*/_react["default"].createElement(PkgTextAreaAutosize, props);
|
32
|
+
};
|
33
|
+
function groupBy(list, keyGetter) {
|
34
|
+
var map = new Map();
|
35
|
+
list.forEach(function (item) {
|
36
|
+
var key = keyGetter(item);
|
37
|
+
var collection = map.get(key);
|
38
|
+
if (!collection) {
|
39
|
+
map.set(key, [item]);
|
40
|
+
} else {
|
41
|
+
collection.push(item);
|
42
|
+
}
|
43
|
+
});
|
44
|
+
return map;
|
45
|
+
}
|