react-survey-builder 1.0.69 → 1.0.71

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/lib/form.js CHANGED
@@ -40,6 +40,8 @@ var ReactSurvey = function ReactSurvey(_ref) {
40
40
  backAction = _ref$backAction === void 0 ? null : _ref$backAction,
41
41
  _ref$hideActions = _ref.hideActions,
42
42
  hideActions = _ref$hideActions === void 0 ? false : _ref$hideActions,
43
+ _ref$hideLabels = _ref.hideLabels,
44
+ hideLabels = _ref$hideLabels === void 0 ? false : _ref$hideLabels,
43
45
  variables = _ref.variables,
44
46
  buttonClassName = _ref.buttonClassName,
45
47
  checkboxButtonClassName = _ref.checkboxButtonClassName,
@@ -125,14 +127,16 @@ var ReactSurvey = function ReactSurvey(_ref) {
125
127
  return defaultChecked;
126
128
  };
127
129
  var _getItemValue = function _getItemValue($dataItem, ref) {
130
+ var _ref$inputField;
128
131
  var $item = {
129
132
  element: $dataItem.element,
130
133
  value: ''
131
134
  };
135
+ var $formData = methods === null || methods === void 0 ? void 0 : methods.getValues();
132
136
  if ($dataItem.element === 'Rating') {
133
137
  $item.value = ref.inputField.current.state.rating;
134
138
  } else if ($dataItem.element === 'Tags') {
135
- $item.value = ref.props.value;
139
+ $item.value = $formData[$dataItem.fieldName];
136
140
  // } else if (item.element === 'DatePicker') {
137
141
  // $item.value = ref.state.value;
138
142
  } else if ($dataItem.element === 'Camera') {
@@ -141,11 +145,13 @@ var ReactSurvey = function ReactSurvey(_ref) {
141
145
  $item.value = ref.state.fileUpload;
142
146
  } else if ($dataItem.element === 'Signature') {
143
147
  $item.value = ref.state.value;
144
- } else if (ref && ref.inputField && ref.inputField.current) {
148
+ } else if (ref && ref !== null && ref !== void 0 && ref.inputField && ref !== null && ref !== void 0 && (_ref$inputField = ref.inputField) !== null && _ref$inputField !== void 0 && _ref$inputField.current) {
145
149
  $item = ReactDOM.findDOMNode(ref.inputField.current);
146
150
  if ($item && typeof $item.value === 'string') {
147
151
  $item.value = $item.value.trim();
148
152
  }
153
+ } else {
154
+ $item.value = $formData[$dataItem.fieldName];
149
155
  }
150
156
  return $item;
151
157
  };
@@ -180,77 +186,17 @@ var ReactSurvey = function ReactSurvey(_ref) {
180
186
  }
181
187
  return incorrect;
182
188
  };
183
- var _isInvalid = function _isInvalid($dataItem) {
184
- var invalid = false;
185
- if ($dataItem.required === true) {
186
- var ref = inputs.current[$dataItem.fieldName];
187
- if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'RadioButtons') {
188
- var checked_options = 0;
189
- $dataItem.options.forEach(function (option) {
190
- var $option = ReactDOM.findDOMNode(ref.options["child_ref_".concat(option.key)]);
191
- if ($option.checked) {
192
- checked_options += 1;
193
- }
194
- });
195
- if (checked_options < 1) {
196
- // errors.push(item.label + ' is required!');
197
- invalid = true;
198
- }
199
- } else {
200
- var $item = _getItemValue($dataItem, ref);
201
- if ($dataItem.element === 'Rating') {
202
- if ($item.value === 0) {
203
- invalid = true;
204
- }
205
- } else if ($item.value === undefined || $item.value.length < 1) {
206
- invalid = true;
207
- }
208
- }
209
- }
210
- return invalid;
211
- };
212
- var _collect = function _collect($dataItem) {
213
- var itemData = {
214
- id: $dataItem.id,
215
- name: $dataItem.fieldName,
216
- customName: $dataItem.customName || $dataItem.fieldName,
217
- label: $dataItem.label !== null && $dataItem.label !== undefined && $dataItem.label !== '' ? $dataItem.label.trim() : ''
218
- };
219
- if (!itemData.name) return null;
220
- var ref = inputs.current[$dataItem.fieldName];
221
- if ($dataItem.element === 'Checkboxes') {
222
- var checkedOptions = [];
223
- $dataItem.options.forEach(function (option) {
224
- var $option = ReactDOM.findDOMNode(ref.options["child_ref_".concat(option.key)]);
225
- if ($option.checked) {
226
- checkedOptions.push(option.value);
227
- }
228
- });
229
- itemData.value = checkedOptions;
230
- } else if ($dataItem.element === 'RadioButtons') {
231
- $dataItem.options.forEach(function (option) {
232
- var $option = ReactDOM.findDOMNode(ref.options["child_ref_".concat(option.key)]);
233
- if ($option.checked) {
234
- itemData.value = option.value;
235
- }
236
- });
237
- } else if ($dataItem.element === 'Checkbox') {
238
- if (!ref || !ref.inputField || !ref.inputField.current) {
239
- itemData.value = false;
240
- } else {
241
- itemData.value = ref.inputField.current.checked;
242
- }
243
- } else {
244
- if (!ref) return null;
245
- itemData.value = _getItemValue($dataItem, ref).value;
246
- }
247
- itemData.required = $dataItem.required || false;
248
- return itemData;
249
- };
250
- var _collectFormData = function _collectFormData($dataItems) {
189
+ var _collectFormData = function _collectFormData($dataItems, $formData) {
251
190
  var formData = [];
252
191
  $dataItems.forEach(function (item) {
253
- var itemData = _collect(item);
192
+ var itemData = {
193
+ id: item.id,
194
+ name: item.fieldName,
195
+ customName: item.customName || item.fieldName,
196
+ label: item.label !== null && item.label !== undefined && item.label !== '' ? item.label.trim() : '',
197
+ value: $formData[item.fieldName],
198
+ required: item.required || false
199
+ };
254
200
  if (itemData) {
255
201
  formData.push(itemData);
256
202
  }
@@ -271,7 +217,7 @@ var ReactSurvey = function ReactSurvey(_ref) {
271
217
  // Only submit if there are no errors.
272
218
  if (hasErrors === false) {
273
219
  if (onSubmit) {
274
- var $data = _collectFormData(items);
220
+ var $data = _collectFormData(items, $formData);
275
221
  onSubmit({
276
222
  formData: $formData,
277
223
  answers: $data
@@ -286,7 +232,7 @@ var ReactSurvey = function ReactSurvey(_ref) {
286
232
  // console.log('handleChange');
287
233
  // Call submit function on change
288
234
  if (onChange) {
289
- var $data = _collectFormData(items);
235
+ var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);
290
236
  onChange($data);
291
237
  }
292
238
  };
@@ -316,17 +262,31 @@ var ReactSurvey = function ReactSurvey(_ref) {
316
262
  return x.id === id;
317
263
  });
318
264
  if ($dataItem !== undefined) {
319
- var _ref2, _ref3;
265
+ var _ref2, _ref3, _ref4;
320
266
  return _objectSpread(_objectSpread({}, $dataItem), {}, {
321
267
  fieldRules: getFieldRules($dataItem),
322
268
  print: print !== null && print !== void 0 ? print : false,
323
269
  readOnly: (_ref2 = readOnly || $dataItem.readOnly) !== null && _ref2 !== void 0 ? _ref2 : false,
324
- disabled: (_ref3 = readOnly || $dataItem.readOnly) !== null && _ref3 !== void 0 ? _ref3 : false,
270
+ hideLabel: (_ref3 = hideLabels || $dataItem.hideLabel) !== null && _ref3 !== void 0 ? _ref3 : false,
271
+ disabled: (_ref4 = readOnly || $dataItem.readOnly) !== null && _ref4 !== void 0 ? _ref4 : false,
325
272
  mutable: true
326
273
  });
327
274
  }
328
275
  return null;
329
276
  };
277
+ var getStandardElement = function getStandardElement(item) {
278
+ if (!item) return null;
279
+ if (item.custom) {
280
+ return getCustomElement(item);
281
+ }
282
+ var Input = SurveyElements[item.element];
283
+ return /*#__PURE__*/React.createElement(Input, {
284
+ name: item.fieldName,
285
+ key: "form_".concat(item.id),
286
+ item: item,
287
+ value: _getDefaultValue(item)
288
+ });
289
+ };
330
290
  var getInputElement = function getInputElement(item) {
331
291
  if (!item) return null;
332
292
  if (item.custom) {
@@ -341,19 +301,19 @@ var ReactSurvey = function ReactSurvey(_ref) {
341
301
  defaultValue: _getDefaultValue(item),
342
302
  disabled: item.disabled,
343
303
  required: item.required,
344
- render: function render(_ref4) {
345
- var _ref4$field = _ref4.field,
346
- _onChange = _ref4$field.onChange,
347
- onBlur = _ref4$field.onBlur,
348
- value = _ref4$field.value,
349
- name = _ref4$field.name,
350
- ref = _ref4$field.ref,
351
- _ref4$fieldState = _ref4.fieldState,
352
- invalid = _ref4$fieldState.invalid,
353
- isTouched = _ref4$fieldState.isTouched,
354
- isDirty = _ref4$fieldState.isDirty,
355
- error = _ref4$fieldState.error,
356
- formState = _ref4.formState;
304
+ render: function render(_ref5) {
305
+ var _ref5$field = _ref5.field,
306
+ _onChange = _ref5$field.onChange,
307
+ onBlur = _ref5$field.onBlur,
308
+ value = _ref5$field.value,
309
+ name = _ref5$field.name,
310
+ ref = _ref5$field.ref,
311
+ _ref5$fieldState = _ref5.fieldState,
312
+ invalid = _ref5$fieldState.invalid,
313
+ isTouched = _ref5$fieldState.isTouched,
314
+ isDirty = _ref5$fieldState.isDirty,
315
+ error = _ref5$fieldState.error,
316
+ formState = _ref5.formState;
357
317
  return /*#__PURE__*/React.createElement(Input, {
358
318
  onBlur: onBlur,
359
319
  onChange: function onChange(e) {
@@ -406,19 +366,19 @@ var ReactSurvey = function ReactSurvey(_ref) {
406
366
  defaultValue: _getDefaultValue(item),
407
367
  disabled: item.disabled,
408
368
  required: item.required,
409
- render: function render(_ref5) {
410
- var _ref5$field = _ref5.field,
411
- _onChange2 = _ref5$field.onChange,
412
- onBlur = _ref5$field.onBlur,
413
- value = _ref5$field.value,
414
- name = _ref5$field.name,
415
- ref = _ref5$field.ref,
416
- _ref5$fieldState = _ref5.fieldState,
417
- invalid = _ref5$fieldState.invalid,
418
- isTouched = _ref5$fieldState.isTouched,
419
- isDirty = _ref5$fieldState.isDirty,
420
- error = _ref5$fieldState.error,
421
- formState = _ref5.formState;
369
+ render: function render(_ref6) {
370
+ var _ref6$field = _ref6.field,
371
+ _onChange2 = _ref6$field.onChange,
372
+ onBlur = _ref6$field.onBlur,
373
+ value = _ref6$field.value,
374
+ name = _ref6$field.name,
375
+ ref = _ref6$field.ref,
376
+ _ref6$fieldState = _ref6.fieldState,
377
+ invalid = _ref6$fieldState.invalid,
378
+ isTouched = _ref6$fieldState.isTouched,
379
+ isDirty = _ref6$fieldState.isDirty,
380
+ error = _ref6$fieldState.error,
381
+ formState = _ref6.formState;
422
382
  return /*#__PURE__*/React.createElement(CustomElement, {
423
383
  onBlur: onBlur,
424
384
  onChange: function onChange(e) {
@@ -482,81 +442,29 @@ var ReactSurvey = function ReactSurvey(_ref) {
482
442
  var fieldItems = dataItems.filter(function (x) {
483
443
  return !x.parentId;
484
444
  }).map(function (item) {
485
- var _ref6, _ref7;
445
+ var _ref7, _ref8, _ref9;
486
446
  if (!item) return null;
487
447
  item.fieldRules = getFieldRules(item);
488
448
  item.print = print !== null && print !== void 0 ? print : false;
489
- item.readOnly = (_ref6 = readOnly || item.readOnly) !== null && _ref6 !== void 0 ? _ref6 : false;
490
- item.disabled = (_ref7 = readOnly || item.readOnly) !== null && _ref7 !== void 0 ? _ref7 : false;
449
+ item.readOnly = (_ref7 = readOnly || item.readOnly) !== null && _ref7 !== void 0 ? _ref7 : false;
450
+ item.hideLabel = (_ref8 = hideLabels || item.hideLabel) !== null && _ref8 !== void 0 ? _ref8 : false;
451
+ item.disabled = (_ref9 = readOnly || item.readOnly) !== null && _ref9 !== void 0 ? _ref9 : false;
491
452
  item.mutable = true;
492
453
  switch (item.element) {
493
- case 'Dropdown':
494
454
  case 'RadioButtons':
495
455
  case 'Rating':
496
- case 'Tags':
497
456
  case 'Range':
498
457
  case 'Checkbox':
499
458
  return getInputElement(item);
459
+ case 'Tags':
460
+ case 'Dropdown':
500
461
  case 'TextInput':
501
- return /*#__PURE__*/React.createElement(TextInput, {
502
- name: item.fieldName,
503
- ref: function ref(c) {
504
- return inputs.current[item.fieldName] = c;
505
- },
506
- key: "form_".concat(item.id),
507
- item: item,
508
- value: _getDefaultValue(item)
509
- });
510
462
  case 'EmailInput':
511
- return /*#__PURE__*/React.createElement(EmailInput, {
512
- name: item.fieldName,
513
- ref: function ref(c) {
514
- return inputs.current[item.fieldName] = c;
515
- },
516
- key: "form_".concat(item.id),
517
- item: item,
518
- value: _getDefaultValue(item)
519
- });
520
463
  case 'NumberInput':
521
- return /*#__PURE__*/React.createElement(NumberInput, {
522
- name: item.fieldName,
523
- ref: function ref(c) {
524
- return inputs.current[item.fieldName] = c;
525
- },
526
- key: "form_".concat(item.id),
527
- item: item,
528
- value: _getDefaultValue(item)
529
- });
530
464
  case 'TextArea':
531
- return /*#__PURE__*/React.createElement(TextArea, {
532
- name: item.fieldName,
533
- ref: function ref(c) {
534
- return inputs.current[item.fieldName] = c;
535
- },
536
- key: "form_".concat(item.id),
537
- item: item,
538
- value: _getDefaultValue(item)
539
- });
540
465
  case 'PhoneNumber':
541
- return /*#__PURE__*/React.createElement(PhoneNumber, {
542
- name: item.fieldName,
543
- ref: function ref(c) {
544
- return inputs.current[item.fieldName] = c;
545
- },
546
- key: "form_".concat(item.id),
547
- item: item,
548
- value: _getDefaultValue(item)
549
- });
550
466
  case 'DatePicker':
551
- return /*#__PURE__*/React.createElement(DatePicker, {
552
- name: item.fieldName,
553
- ref: function ref(c) {
554
- return inputs.current[item.fieldName] = c;
555
- },
556
- key: "form_".concat(item.id),
557
- item: item,
558
- value: _getDefaultValue(item)
559
- });
467
+ return getStandardElement(item);
560
468
  case 'CustomElement':
561
469
  return getCustomElement(item);
562
470
  case 'MultiColumnRow':
@@ -576,19 +484,19 @@ var ReactSurvey = function ReactSurvey(_ref) {
576
484
  defaultValue: _getDefaultValue(item),
577
485
  disabled: item.disabled,
578
486
  required: item.required,
579
- render: function render(_ref8) {
580
- var _ref8$field = _ref8.field,
581
- _onChange3 = _ref8$field.onChange,
582
- onBlur = _ref8$field.onBlur,
583
- value = _ref8$field.value,
584
- name = _ref8$field.name,
585
- ref = _ref8$field.ref,
586
- _ref8$fieldState = _ref8.fieldState,
587
- invalid = _ref8$fieldState.invalid,
588
- isTouched = _ref8$fieldState.isTouched,
589
- isDirty = _ref8$fieldState.isDirty,
590
- error = _ref8$fieldState.error,
591
- formState = _ref8.formState;
487
+ render: function render(_ref10) {
488
+ var _ref10$field = _ref10.field,
489
+ _onChange3 = _ref10$field.onChange,
490
+ onBlur = _ref10$field.onBlur,
491
+ value = _ref10$field.value,
492
+ name = _ref10$field.name,
493
+ ref = _ref10$field.ref,
494
+ _ref10$fieldState = _ref10.fieldState,
495
+ invalid = _ref10$fieldState.invalid,
496
+ isTouched = _ref10$fieldState.isTouched,
497
+ isDirty = _ref10$fieldState.isDirty,
498
+ error = _ref10$fieldState.error,
499
+ formState = _ref10.formState;
592
500
  return /*#__PURE__*/React.createElement(Signature, {
593
501
  methods: methods,
594
502
  onBlur: onBlur,
@@ -614,19 +522,19 @@ var ReactSurvey = function ReactSurvey(_ref) {
614
522
  defaultValue: _optionsDefaultValue(item),
615
523
  disabled: item.disabled,
616
524
  required: item.required,
617
- render: function render(_ref9) {
618
- var _ref9$field = _ref9.field,
619
- _onChange4 = _ref9$field.onChange,
620
- onBlur = _ref9$field.onBlur,
621
- value = _ref9$field.value,
622
- name = _ref9$field.name,
623
- ref = _ref9$field.ref,
624
- _ref9$fieldState = _ref9.fieldState,
625
- invalid = _ref9$fieldState.invalid,
626
- isTouched = _ref9$fieldState.isTouched,
627
- isDirty = _ref9$fieldState.isDirty,
628
- error = _ref9$fieldState.error,
629
- formState = _ref9.formState;
525
+ render: function render(_ref11) {
526
+ var _ref11$field = _ref11.field,
527
+ _onChange4 = _ref11$field.onChange,
528
+ onBlur = _ref11$field.onBlur,
529
+ value = _ref11$field.value,
530
+ name = _ref11$field.name,
531
+ ref = _ref11$field.ref,
532
+ _ref11$fieldState = _ref11.fieldState,
533
+ invalid = _ref11$fieldState.invalid,
534
+ isTouched = _ref11$fieldState.isTouched,
535
+ isDirty = _ref11$fieldState.isDirty,
536
+ error = _ref11$fieldState.error,
537
+ formState = _ref11.formState;
630
538
  return /*#__PURE__*/React.createElement(Checkboxes, {
631
539
  onBlur: onBlur,
632
540
  onChange: function onChange(e) {
@@ -667,19 +575,19 @@ var ReactSurvey = function ReactSurvey(_ref) {
667
575
  defaultValue: _getDefaultValue(item),
668
576
  disabled: item.disabled,
669
577
  required: item.required,
670
- render: function render(_ref10) {
671
- var _ref10$field = _ref10.field,
672
- _onChange5 = _ref10$field.onChange,
673
- onBlur = _ref10$field.onBlur,
674
- value = _ref10$field.value,
675
- name = _ref10$field.name,
676
- ref = _ref10$field.ref,
677
- _ref10$fieldState = _ref10.fieldState,
678
- invalid = _ref10$fieldState.invalid,
679
- isTouched = _ref10$fieldState.isTouched,
680
- isDirty = _ref10$fieldState.isDirty,
681
- error = _ref10$fieldState.error,
682
- formState = _ref10.formState;
578
+ render: function render(_ref12) {
579
+ var _ref12$field = _ref12.field,
580
+ _onChange5 = _ref12$field.onChange,
581
+ onBlur = _ref12$field.onBlur,
582
+ value = _ref12$field.value,
583
+ name = _ref12$field.name,
584
+ ref = _ref12$field.ref,
585
+ _ref12$fieldState = _ref12.fieldState,
586
+ invalid = _ref12$fieldState.invalid,
587
+ isTouched = _ref12$fieldState.isTouched,
588
+ isDirty = _ref12$fieldState.isDirty,
589
+ error = _ref12$fieldState.error,
590
+ formState = _ref12.formState;
683
591
  return /*#__PURE__*/React.createElement(Camera, {
684
592
  onBlur: onBlur,
685
593
  onChange: function onChange(e) {
@@ -705,19 +613,19 @@ var ReactSurvey = function ReactSurvey(_ref) {
705
613
  defaultValue: _getDefaultValue(item),
706
614
  disabled: item.disabled,
707
615
  required: item.required,
708
- render: function render(_ref11) {
709
- var _ref11$field = _ref11.field,
710
- _onChange6 = _ref11$field.onChange,
711
- onBlur = _ref11$field.onBlur,
712
- value = _ref11$field.value,
713
- name = _ref11$field.name,
714
- ref = _ref11$field.ref,
715
- _ref11$fieldState = _ref11.fieldState,
716
- invalid = _ref11$fieldState.invalid,
717
- isTouched = _ref11$fieldState.isTouched,
718
- isDirty = _ref11$fieldState.isDirty,
719
- error = _ref11$fieldState.error,
720
- formState = _ref11.formState;
616
+ render: function render(_ref13) {
617
+ var _ref13$field = _ref13.field,
618
+ _onChange6 = _ref13$field.onChange,
619
+ onBlur = _ref13$field.onBlur,
620
+ value = _ref13$field.value,
621
+ name = _ref13$field.name,
622
+ ref = _ref13$field.ref,
623
+ _ref13$fieldState = _ref13.fieldState,
624
+ invalid = _ref13$fieldState.invalid,
625
+ isTouched = _ref13$fieldState.isTouched,
626
+ isDirty = _ref13$fieldState.isDirty,
627
+ error = _ref13$fieldState.error,
628
+ formState = _ref13.formState;
721
629
  return /*#__PURE__*/React.createElement(FileUpload, {
722
630
  onBlur: onBlur,
723
631
  onChange: function onChange(e) {
package/lib/index.js CHANGED
@@ -165,6 +165,9 @@ var cleanUpSurveyItems = function cleanUpSurveyItems() {
165
165
  if (item.hideLabel !== undefined && item.hideLabel !== null) {
166
166
  dataItem.hideLabel = item.hideLabel;
167
167
  }
168
+ if (props.hideLabels !== undefined && props.hideLabels !== null) {
169
+ dataItem.hideLabel = props.hideLabels;
170
+ }
168
171
  if (item.readOnly !== undefined && item.readOnly !== null) {
169
172
  dataItem.readOnly = item.readOnly;
170
173
  }