@formio/js 5.1.0-dev.5969.9a6e3f5 → 5.1.0-dev.5972.67b2845

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.
Files changed (83) hide show
  1. package/dist/formio.form.js +74 -52
  2. package/dist/formio.form.min.js +1 -1
  3. package/dist/formio.full.js +77 -55
  4. package/dist/formio.full.min.js +1 -1
  5. package/dist/formio.js +3 -3
  6. package/dist/formio.min.js +1 -1
  7. package/dist/formio.utils.js +3 -3
  8. package/dist/formio.utils.min.js +1 -1
  9. package/lib/cjs/Embed.js +1 -1
  10. package/lib/cjs/Form.js +4 -4
  11. package/lib/cjs/Formio.js +1 -1
  12. package/lib/cjs/PDFBuilder.js +4 -4
  13. package/lib/cjs/Webform.d.ts +12 -12
  14. package/lib/cjs/Webform.js +132 -131
  15. package/lib/cjs/WebformBuilder.js +10 -10
  16. package/lib/cjs/Wizard.js +1 -1
  17. package/lib/cjs/WizardBuilder.js +1 -1
  18. package/lib/cjs/components/_classes/component/Component.js +12 -11
  19. package/lib/cjs/components/_classes/list/ListComponent.js +4 -4
  20. package/lib/cjs/components/_classes/multivalue/Multivalue.js +2 -2
  21. package/lib/cjs/components/_classes/nestedarray/NestedArrayComponent.js +3 -3
  22. package/lib/cjs/components/address/Address.js +1 -1
  23. package/lib/cjs/components/button/Button.js +6 -6
  24. package/lib/cjs/components/checkbox/Checkbox.js +1 -1
  25. package/lib/cjs/components/datagrid/DataGrid.js +5 -2
  26. package/lib/cjs/components/datetime/DateTime.js +4 -0
  27. package/lib/cjs/components/day/Day.js +4 -20
  28. package/lib/cjs/components/editgrid/EditGrid.js +4 -4
  29. package/lib/cjs/components/file/File.js +15 -15
  30. package/lib/cjs/components/form/Form.d.ts +1 -0
  31. package/lib/cjs/components/form/Form.js +11 -7
  32. package/lib/cjs/components/number/Number.js +1 -1
  33. package/lib/cjs/components/recaptcha/ReCaptcha.js +2 -2
  34. package/lib/cjs/components/select/Select.js +5 -5
  35. package/lib/cjs/components/selectboxes/SelectBoxes.js +2 -2
  36. package/lib/cjs/components/signature/Signature.d.ts +1 -1
  37. package/lib/cjs/components/signature/Signature.js +2 -2
  38. package/lib/cjs/components/survey/Survey.js +2 -2
  39. package/lib/cjs/components/textarea/TextArea.js +6 -6
  40. package/lib/cjs/components/textfield/TextField.js +3 -0
  41. package/lib/cjs/formio.form.js +4 -0
  42. package/lib/cjs/translations/en.d.ts +234 -81
  43. package/lib/cjs/translations/en.js +8 -81
  44. package/lib/cjs/utils/i18n.d.ts +5 -2
  45. package/lib/cjs/utils/i18n.js +32 -5
  46. package/lib/mjs/Embed.js +1 -1
  47. package/lib/mjs/Form.js +4 -4
  48. package/lib/mjs/Formio.js +1 -1
  49. package/lib/mjs/PDFBuilder.js +4 -4
  50. package/lib/mjs/Webform.d.ts +12 -12
  51. package/lib/mjs/Webform.js +142 -141
  52. package/lib/mjs/WebformBuilder.js +10 -10
  53. package/lib/mjs/Wizard.js +1 -1
  54. package/lib/mjs/WizardBuilder.js +1 -1
  55. package/lib/mjs/components/_classes/component/Component.js +12 -11
  56. package/lib/mjs/components/_classes/list/ListComponent.js +4 -4
  57. package/lib/mjs/components/_classes/multivalue/Multivalue.js +2 -2
  58. package/lib/mjs/components/_classes/nestedarray/NestedArrayComponent.js +3 -3
  59. package/lib/mjs/components/address/Address.js +1 -1
  60. package/lib/mjs/components/button/Button.js +6 -6
  61. package/lib/mjs/components/checkbox/Checkbox.js +1 -1
  62. package/lib/mjs/components/datagrid/DataGrid.js +5 -2
  63. package/lib/mjs/components/datetime/DateTime.js +5 -1
  64. package/lib/mjs/components/day/Day.js +4 -20
  65. package/lib/mjs/components/editgrid/EditGrid.js +4 -4
  66. package/lib/mjs/components/file/File.js +15 -15
  67. package/lib/mjs/components/form/Form.d.ts +1 -0
  68. package/lib/mjs/components/form/Form.js +10 -7
  69. package/lib/mjs/components/number/Number.js +1 -1
  70. package/lib/mjs/components/recaptcha/ReCaptcha.js +2 -2
  71. package/lib/mjs/components/select/Select.js +7 -7
  72. package/lib/mjs/components/selectboxes/SelectBoxes.js +2 -2
  73. package/lib/mjs/components/signature/Signature.d.ts +1 -1
  74. package/lib/mjs/components/signature/Signature.js +2 -2
  75. package/lib/mjs/components/survey/Survey.js +2 -2
  76. package/lib/mjs/components/textarea/TextArea.js +6 -6
  77. package/lib/mjs/components/textfield/TextField.js +3 -0
  78. package/lib/mjs/formio.form.js +4 -0
  79. package/lib/mjs/translations/en.d.ts +234 -81
  80. package/lib/mjs/translations/en.js +89 -3
  81. package/lib/mjs/utils/i18n.d.ts +5 -2
  82. package/lib/mjs/utils/i18n.js +32 -5
  83. package/package.json +4 -4
@@ -27,10 +27,10 @@ Formio_1.Formio.registerComponent = Components_1.default.setComponent;
27
27
  * @returns {any} - The icon set.
28
28
  */
29
29
  function getIconSet(icons) {
30
- if (icons === "fontawesome") {
31
- return "fa";
30
+ if (icons === 'fontawesome') {
31
+ return 'fa';
32
32
  }
33
- return icons || "";
33
+ return icons || '';
34
34
  }
35
35
  /**
36
36
  *
@@ -45,7 +45,7 @@ function getOptions(options) {
45
45
  saveDraft: false,
46
46
  alwaysDirty: false,
47
47
  saveDraftThrottle: 5000,
48
- display: "form",
48
+ display: 'form',
49
49
  cdnUrl: Formio_1.Formio.cdn.baseUrl,
50
50
  });
51
51
  if (!options.events) {
@@ -89,10 +89,10 @@ function getOptions(options) {
89
89
  */
90
90
  /**
91
91
  * @typedef {object} ButtonSettings
92
- * @property {boolean} [showPrevious] - Show the "Previous" button.
93
- * @property {boolean} [showNext] - Show the "Next" button.
94
- * @property {boolean} [showCancel] - Show the "Cancel" button.
95
- * @property {boolean} [showSubmit] - Show the "Submit" button.
92
+ * @property {boolean} [showPrevious] - Show the 'Previous' button.
93
+ * @property {boolean} [showNext] - Show the 'Next' button.
94
+ * @property {boolean} [showCancel] - Show the 'Cancel' button.
95
+ * @property {boolean} [showSubmit] - Show the 'Submit' button.
96
96
  */
97
97
  /**
98
98
  * @typedef {object} FormOptions
@@ -161,15 +161,15 @@ class Webform extends NestedDataComponent_1.default {
161
161
  }
162
162
  const ctrl = event.ctrlKey || event.metaKey;
163
163
  const keyCode = event.keyCode;
164
- let char = "";
164
+ let char = '';
165
165
  if (65 <= keyCode && keyCode <= 90) {
166
166
  char = String.fromCharCode(keyCode);
167
167
  }
168
168
  else if (keyCode === 13) {
169
- char = "Enter";
169
+ char = 'Enter';
170
170
  }
171
171
  else if (keyCode === 27) {
172
- char = "Esc";
172
+ char = 'Esc';
173
173
  }
174
174
  lodash_1.default.each(this.shortcuts, (shortcut) => {
175
175
  if (shortcut.ctrl && !ctrl) {
@@ -192,8 +192,8 @@ class Webform extends NestedDataComponent_1.default {
192
192
  * The type of this element.
193
193
  * @type {string}
194
194
  */
195
- this.type = "form";
196
- this._src = "";
195
+ this.type = 'form';
196
+ this._src = '';
197
197
  this._loading = false;
198
198
  this._form = {};
199
199
  this.draftEnabled = false;
@@ -341,7 +341,7 @@ class Webform extends NestedDataComponent_1.default {
341
341
  return;
342
342
  }
343
343
  this.rebuild();
344
- this.emit("languageChanged");
344
+ this.emit('languageChanged');
345
345
  });
346
346
  }
347
347
  get componentComponents() {
@@ -359,18 +359,18 @@ class Webform extends NestedDataComponent_1.default {
359
359
  addLanguage(code, lang, active = false) {
360
360
  if (this.i18next) {
361
361
  var translations = lodash_1.default.assign((0, utils_1.fastCloneDeep)(i18n_1.default.resources.en.translation), lang);
362
- this.i18next.addResourceBundle(code, "translation", translations, true, true);
362
+ this.i18next.addResourceBundle(code, 'translation', translations, true, true);
363
363
  if (active) {
364
364
  this.language = code;
365
365
  }
366
366
  }
367
367
  }
368
368
  keyboardCatchableElement(element) {
369
- if (element.nodeName === "TEXTAREA") {
369
+ if (element.nodeName === 'TEXTAREA') {
370
370
  return false;
371
371
  }
372
- if (element.nodeName === "INPUT") {
373
- return ["text", "email", "password"].indexOf(element.type) === -1;
372
+ if (element.nodeName === 'INPUT') {
373
+ return ['text', 'email', 'password'].indexOf(element.type) === -1;
374
374
  }
375
375
  return true;
376
376
  }
@@ -379,9 +379,9 @@ class Webform extends NestedDataComponent_1.default {
379
379
  return;
380
380
  }
381
381
  shortcut = lodash_1.default.capitalize(shortcut);
382
- if (shortcut === "Enter" || shortcut === "Esc") {
382
+ if (shortcut === 'Enter' || shortcut === 'Esc') {
383
383
  // Restrict Enter and Esc only for buttons
384
- if (element.tagName !== "BUTTON") {
384
+ if (element.tagName !== 'BUTTON') {
385
385
  return;
386
386
  }
387
387
  this.shortcuts.push({
@@ -481,13 +481,13 @@ class Webform extends NestedDataComponent_1.default {
481
481
  * @returns {boolean} - TRUE means the url was set, FALSE otherwise.
482
482
  */
483
483
  setUrl(value, options) {
484
- if (!value || typeof value !== "string" || value === this._src) {
484
+ if (!value || typeof value !== 'string' || value === this._src) {
485
485
  return false;
486
486
  }
487
487
  this._src = value;
488
488
  this.nosubmit = true;
489
489
  this.formio = this.options.formio = new Formio_1.Formio(value, options);
490
- if (this.type === "form") {
490
+ if (this.type === 'form') {
491
491
  // Set the options source so this can be passed to other components.
492
492
  this.options.src = value;
493
493
  }
@@ -520,17 +520,17 @@ class Webform extends NestedDataComponent_1.default {
520
520
  }
521
521
  /**
522
522
  * Set the loading state for this form, and also show the loader spinner.
523
- * @param {boolean} loading - If this form should be "loading" or not.
523
+ * @param {boolean} loading - If this form should be 'loading' or not.
524
524
  */
525
525
  set loading(loading) {
526
526
  if (this._loading !== loading) {
527
527
  this._loading = loading;
528
528
  if (!this.loader && loading) {
529
- this.loader = this.ce("div", {
530
- class: "loader-wrapper",
529
+ this.loader = this.ce('div', {
530
+ class: 'loader-wrapper',
531
531
  });
532
- const spinner = this.ce("div", {
533
- class: "loader text-center",
532
+ const spinner = this.ce('div', {
533
+ class: 'loader text-center',
534
534
  });
535
535
  this.loader.appendChild(spinner);
536
536
  }
@@ -615,18 +615,18 @@ class Webform extends NestedDataComponent_1.default {
615
615
  // Use the sanitize config from the form settings or the global sanitize config if it is not provided in the options
616
616
  if (!this.options.sanitizeConfig && !this.builderMode) {
617
617
  this.options.sanitizeConfig =
618
- lodash_1.default.get(form, "settings.sanitizeConfig") ||
619
- lodash_1.default.get(form, "globalSettings.sanitizeConfig");
618
+ lodash_1.default.get(form, 'settings.sanitizeConfig') ||
619
+ lodash_1.default.get(form, 'globalSettings.sanitizeConfig');
620
620
  }
621
- if ("schema" in form && (0, compare_versions_1.compareVersions)(form.schema, "1.x") > 0) {
621
+ if ('schema' in form && (0, compare_versions_1.compareVersions)(form.schema, '1.x') > 0) {
622
622
  this.ready.then(() => {
623
- this.setAlert("alert alert-danger", "Form schema is for a newer version, please upgrade your renderer. Some functionality may not work.");
623
+ this.setAlert('alert alert-danger', this.t('newFormSchema'));
624
624
  });
625
625
  }
626
626
  // See if they pass a module, and evaluate it if so.
627
627
  if (form && form.module) {
628
628
  let formModule = null;
629
- if (typeof form.module === "string") {
629
+ if (typeof form.module === 'string') {
630
630
  try {
631
631
  formModule = this.evaluate(`return ${form.module}`);
632
632
  }
@@ -648,7 +648,7 @@ class Webform extends NestedDataComponent_1.default {
648
648
  this.initialized = false;
649
649
  const rebuild = this.rebuild() || Promise.resolve();
650
650
  return rebuild.then(() => {
651
- this.emit("formLoad", form);
651
+ this.emit('formLoad', form);
652
652
  this.triggerCaptcha();
653
653
  // Make sure to trigger onChange after a render event occurs to speed up form rendering.
654
654
  setTimeout(() => {
@@ -720,7 +720,7 @@ class Webform extends NestedDataComponent_1.default {
720
720
  * @returns {Promise} - The promise that is triggered when the submission is set.
721
721
  */
722
722
  setSubmission(submission, flags = {}) {
723
- flags = Object.assign(Object.assign({}, flags), { fromSubmission: lodash_1.default.has(flags, "fromSubmission") ? flags.fromSubmission : true });
723
+ flags = Object.assign(Object.assign({}, flags), { fromSubmission: lodash_1.default.has(flags, 'fromSubmission') ? flags.fromSubmission : true });
724
724
  return (this.onSubmission = this.formReady
725
725
  .then((resolveFlags) => {
726
726
  if (resolveFlags) {
@@ -732,9 +732,9 @@ class Webform extends NestedDataComponent_1.default {
732
732
  .catch((err) => this.submissionReadyReject(err)));
733
733
  }
734
734
  handleDraftError(errName, errDetails, restoreDraft) {
735
- const errorMessage = lodash_1.default.trim(`${this.t(errName)} ${errDetails || ""}`);
735
+ const errorMessage = lodash_1.default.trim(`${this.t(errName)} ${errDetails || ''}`);
736
736
  console.warn(errorMessage);
737
- this.emit(restoreDraft ? "restoreDraftError" : "saveDraftError", errDetails || errorMessage);
737
+ this.emit(restoreDraft ? 'restoreDraftError' : 'saveDraftError', errDetails || errorMessage);
738
738
  }
739
739
  saveDraft() {
740
740
  var _a;
@@ -742,17 +742,17 @@ class Webform extends NestedDataComponent_1.default {
742
742
  return;
743
743
  }
744
744
  if (!this.formio) {
745
- this.handleDraftError("saveDraftInstanceError");
745
+ this.handleDraftError('saveDraftInstanceError');
746
746
  return;
747
747
  }
748
748
  if (!Formio_1.Formio.getUser()) {
749
- this.handleDraftError("saveDraftAuthError");
749
+ this.handleDraftError('saveDraftAuthError');
750
750
  return;
751
751
  }
752
752
  const draft = (0, utils_1.fastCloneDeep)(this.submission);
753
- draft.state = "draft";
753
+ draft.state = 'draft';
754
754
  if (!this.savingDraft && !this.submitting) {
755
- this.emit("saveDraftBegin");
755
+ this.emit('saveDraftBegin');
756
756
  this.savingDraft = true;
757
757
  this.formio
758
758
  .saveSubmission(draft)
@@ -760,11 +760,11 @@ class Webform extends NestedDataComponent_1.default {
760
760
  // Set id to submission to avoid creating new draft submission
761
761
  this.submission._id = sub._id;
762
762
  this.savingDraft = false;
763
- this.emit("saveDraft", sub);
763
+ this.emit('saveDraft', sub);
764
764
  })
765
765
  .catch((err) => {
766
766
  this.savingDraft = false;
767
- this.handleDraftError("saveDraftError", err);
767
+ this.handleDraftError('saveDraftError', err);
768
768
  });
769
769
  }
770
770
  }
@@ -775,7 +775,7 @@ class Webform extends NestedDataComponent_1.default {
775
775
  restoreDraft(userId) {
776
776
  const formio = this.formio || this.options.formio;
777
777
  if (!formio) {
778
- this.handleDraftError("restoreDraftInstanceError", null, true);
778
+ this.handleDraftError('restoreDraftInstanceError', null, true);
779
779
  return;
780
780
  }
781
781
  this.savingDraft = true;
@@ -793,22 +793,22 @@ class Webform extends NestedDataComponent_1.default {
793
793
  return this.setSubmission(draft).then(() => {
794
794
  this.draftEnabled = true;
795
795
  this.savingDraft = false;
796
- this.emit("restoreDraft", draft);
796
+ this.emit('restoreDraft', draft);
797
797
  });
798
798
  }
799
799
  // Enable drafts so that we can keep track of changes.
800
800
  this.draftEnabled = true;
801
801
  this.savingDraft = false;
802
- this.emit("restoreDraft", null);
802
+ this.emit('restoreDraft', null);
803
803
  })
804
804
  .catch((err) => {
805
805
  this.draftEnabled = true;
806
806
  this.savingDraft = false;
807
- this.handleDraftError("restoreDraftError", err, true);
807
+ this.handleDraftError('restoreDraftError', err, true);
808
808
  });
809
809
  }
810
810
  get schema() {
811
- const schema = (0, utils_1.fastCloneDeep)(lodash_1.default.omit(this._form, ["components"]));
811
+ const schema = (0, utils_1.fastCloneDeep)(lodash_1.default.omit(this._form, ['components']));
812
812
  schema.components = [];
813
813
  this.eachComponent((component) => schema.components.push(component.schema));
814
814
  return schema;
@@ -883,10 +883,10 @@ class Webform extends NestedDataComponent_1.default {
883
883
  else {
884
884
  this.component = this.form;
885
885
  }
886
- this.component.type = "form";
886
+ this.component.type = 'form';
887
887
  this.component.input = false;
888
888
  this.addComponents();
889
- this.on("submitButton", (options) => {
889
+ this.on('submitButton', (options) => {
890
890
  this.submit(false, options).catch((e) => {
891
891
  if (options === null || options === void 0 ? void 0 : options.instance) {
892
892
  options.instance.loading = false;
@@ -894,11 +894,11 @@ class Webform extends NestedDataComponent_1.default {
894
894
  return e !== false && e !== undefined && console.log(e);
895
895
  });
896
896
  }, true);
897
- this.on("checkValidity", (data) => this.validate(data, { dirty: true, process: "change" }), true);
898
- this.on("requestUrl", (args) => this.submitUrl(args.url, args.headers), true);
899
- this.on("resetForm", () => this.resetValue(), true);
900
- this.on("deleteSubmission", () => this.deleteSubmission(), true);
901
- this.on("refreshData", () => this.updateValue(), true);
897
+ this.on('checkValidity', (data) => this.validate(data, { dirty: true, process: 'change' }), true);
898
+ this.on('requestUrl', (args) => this.submitUrl(args.url, args.headers), true);
899
+ this.on('resetForm', () => this.resetValue(), true);
900
+ this.on('deleteSubmission', () => this.deleteSubmission(), true);
901
+ this.on('refreshData', () => this.updateValue(), true);
902
902
  this.executeFormController();
903
903
  return this.formReady;
904
904
  }
@@ -923,19 +923,19 @@ class Webform extends NestedDataComponent_1.default {
923
923
  *
924
924
  */
925
925
  teardown() {
926
- this.emit("formDelete", this.id);
926
+ this.emit('formDelete', this.id);
927
927
  delete Formio_1.Formio.forms[this.id];
928
928
  delete this.executeShortcuts;
929
929
  delete this.triggerSaveDraft;
930
930
  super.teardown();
931
931
  }
932
932
  destroy(all = false) {
933
- this.off("submitButton");
934
- this.off("checkValidity");
935
- this.off("requestUrl");
936
- this.off("resetForm");
937
- this.off("deleteSubmission");
938
- this.off("refreshData");
933
+ this.off('submitButton');
934
+ this.off('checkValidity');
935
+ this.off('requestUrl');
936
+ this.off('resetForm');
937
+ this.off('deleteSubmission');
938
+ this.off('refreshData');
939
939
  return super.destroy(all);
940
940
  }
941
941
  build(element) {
@@ -948,17 +948,17 @@ class Webform extends NestedDataComponent_1.default {
948
948
  return this.ready;
949
949
  }
950
950
  getClassName() {
951
- let classes = "formio-form";
951
+ let classes = 'formio-form';
952
952
  if (this.options.readOnly) {
953
- classes += " formio-read-only";
953
+ classes += ' formio-read-only';
954
954
  }
955
955
  return classes;
956
956
  }
957
957
  render() {
958
- return super.render(this.renderTemplate("webform", {
958
+ return super.render(this.renderTemplate('webform', {
959
959
  classes: this.getClassName(),
960
960
  children: this.renderComponents(),
961
- }), this.builderMode ? "builder" : "form", true);
961
+ }), this.builderMode ? 'builder' : 'form', true);
962
962
  }
963
963
  redraw() {
964
964
  // Don't bother if we have not built yet.
@@ -971,13 +971,13 @@ class Webform extends NestedDataComponent_1.default {
971
971
  }
972
972
  attach(element) {
973
973
  this.setElement(element);
974
- this.loadRefs(element, { webform: "single" });
974
+ this.loadRefs(element, { webform: 'single' });
975
975
  const childPromise = this.attachComponents(this.refs.webform);
976
- this.addEventListener(document, "keydown", this.executeShortcuts);
976
+ this.addEventListener(document, 'keydown', this.executeShortcuts);
977
977
  this.currentForm = this;
978
- this.hook("attachWebform", element, this);
978
+ this.hook('attachWebform', element, this);
979
979
  return childPromise.then(() => {
980
- this.emit("render", this.element);
980
+ this.emit('render', this.element);
981
981
  return this.setValue(this._submission, {
982
982
  noUpdateEvent: true,
983
983
  });
@@ -1000,7 +1000,7 @@ class Webform extends NestedDataComponent_1.default {
1000
1000
  }
1001
1001
  /**
1002
1002
  * Sets a new alert to display in the error dialog of the form.
1003
- * @param {string} type - The type of alert to display. "danger", "success", "warning", etc.
1003
+ * @param {string} type - The type of alert to display. 'danger', 'success', 'warning', etc.
1004
1004
  * @param {string} message - The message to show in the alert.
1005
1005
  * @param {object} options - The options for the alert.
1006
1006
  */
@@ -1009,8 +1009,8 @@ class Webform extends NestedDataComponent_1.default {
1009
1009
  if (this.alert) {
1010
1010
  if (this.refs.errorRef && this.refs.errorRef.length) {
1011
1011
  this.refs.errorRef.forEach((el) => {
1012
- this.removeEventListener(el, "click");
1013
- this.removeEventListener(el, "keypress");
1012
+ this.removeEventListener(el, 'click');
1013
+ this.removeEventListener(el, 'keypress');
1014
1014
  });
1015
1015
  }
1016
1016
  this.removeChild(this.alert);
@@ -1020,7 +1020,7 @@ class Webform extends NestedDataComponent_1.default {
1020
1020
  }
1021
1021
  if (this.options.noAlerts) {
1022
1022
  if (!message) {
1023
- this.emit("error", false);
1023
+ this.emit('error', false);
1024
1024
  }
1025
1025
  return;
1026
1026
  }
@@ -1028,8 +1028,8 @@ class Webform extends NestedDataComponent_1.default {
1028
1028
  try {
1029
1029
  if (this.refs.errorRef && this.refs.errorRef.length) {
1030
1030
  this.refs.errorRef.forEach((el) => {
1031
- this.removeEventListener(el, "click");
1032
- this.removeEventListener(el, "keypress");
1031
+ this.removeEventListener(el, 'click');
1032
+ this.removeEventListener(el, 'keypress');
1033
1033
  });
1034
1034
  }
1035
1035
  this.removeChild(this.alert);
@@ -1049,19 +1049,19 @@ class Webform extends NestedDataComponent_1.default {
1049
1049
  attrs: attrs,
1050
1050
  type,
1051
1051
  };
1052
- this.alert = (0, utils_1.convertStringToHTMLElement)(this.renderTemplate("alert", templateOptions), `#${attrs.id}`);
1052
+ this.alert = (0, utils_1.convertStringToHTMLElement)(this.renderTemplate('alert', templateOptions), `#${attrs.id}`);
1053
1053
  }
1054
1054
  if (!this.alert) {
1055
1055
  return;
1056
1056
  }
1057
- this.loadRefs(this.alert, { errorRef: "multiple" });
1057
+ this.loadRefs(this.alert, { errorRef: 'multiple' });
1058
1058
  if (this.refs.errorRef && this.refs.errorRef.length) {
1059
1059
  this.refs.errorRef.forEach((el) => {
1060
- this.addEventListener(el, "click", (e) => {
1060
+ this.addEventListener(el, 'click', (e) => {
1061
1061
  const key = e.currentTarget.dataset.componentKey;
1062
1062
  this.focusOnComponent(key);
1063
1063
  });
1064
- this.addEventListener(el, "keydown", (e) => {
1064
+ this.addEventListener(el, 'keydown', (e) => {
1065
1065
  if (e.keyCode === 13) {
1066
1066
  e.preventDefault();
1067
1067
  const key = e.currentTarget.dataset.componentKey;
@@ -1141,8 +1141,8 @@ class Webform extends NestedDataComponent_1.default {
1141
1141
  (((_b = err.context) === null || _b === void 0 ? void 0 : _b.component) && ((_c = err.context) === null || _c === void 0 ? void 0 : _c.component.key)) ||
1142
1142
  (err.component && err.component.key) ||
1143
1143
  (err.fromServer && err.path);
1144
- const formattedKeyOrPath = keyOrPath ? (0, utils_1.getStringFromComponentPath)(keyOrPath) : "";
1145
- if (typeof err !== "string" && !err.formattedKeyOrPath) {
1144
+ const formattedKeyOrPath = keyOrPath ? (0, utils_1.getStringFromComponentPath)(keyOrPath) : '';
1145
+ if (typeof err !== 'string' && !err.formattedKeyOrPath) {
1146
1146
  err.formattedKeyOrPath = formattedKeyOrPath;
1147
1147
  }
1148
1148
  return {
@@ -1152,18 +1152,18 @@ class Webform extends NestedDataComponent_1.default {
1152
1152
  };
1153
1153
  errors.forEach(({ message, context, fromServer, component }, index) => {
1154
1154
  const text = !(component === null || component === void 0 ? void 0 : component.label) || (context === null || context === void 0 ? void 0 : context.hasLabel) || fromServer
1155
- ? this.t("alertMessage", { message: this.t(message) })
1156
- : this.t("alertMessageWithLabel", {
1155
+ ? this.t('alertMessage', { message: this.t(message) })
1156
+ : this.t('alertMessageWithLabel', {
1157
1157
  label: this.t(component === null || component === void 0 ? void 0 : component.label),
1158
1158
  message: this.t(message),
1159
1159
  });
1160
1160
  displayedErrors.push(createListItem(text, index));
1161
1161
  });
1162
1162
  }
1163
- const errorsList = this.renderTemplate("errorsList", { errors: displayedErrors });
1164
- this.root.setAlert("danger", errorsList);
1163
+ const errorsList = this.renderTemplate('errorsList', { errors: displayedErrors });
1164
+ this.root.setAlert('danger', errorsList);
1165
1165
  if (triggerEvent) {
1166
- this.emit("error", errors);
1166
+ this.emit('error', errors);
1167
1167
  }
1168
1168
  return errors;
1169
1169
  }
@@ -1184,23 +1184,23 @@ class Webform extends NestedDataComponent_1.default {
1184
1184
  noValidate: true,
1185
1185
  noCheck: true,
1186
1186
  });
1187
- this.setAlert("success", `<p>${this.t("complete")}</p>`);
1187
+ this.setAlert('success', `<p>${this.t('complete')}</p>`);
1188
1188
  // Cancel triggered saveDraft to prevent overriding the submitted state
1189
1189
  if (this.draftEnabled && ((_a = this.triggerSaveDraft) === null || _a === void 0 ? void 0 : _a.cancel)) {
1190
1190
  this.triggerSaveDraft.cancel();
1191
1191
  }
1192
- this.emit("submit", submission, saved);
1192
+ this.emit('submit', submission, saved);
1193
1193
  if (saved) {
1194
- this.emit("submitDone", submission);
1194
+ this.emit('submitDone', submission);
1195
1195
  }
1196
1196
  return submission;
1197
1197
  }
1198
1198
  normalizeError(error) {
1199
1199
  if (error) {
1200
- if (typeof error === "object" && "details" in error) {
1200
+ if (typeof error === 'object' && 'details' in error) {
1201
1201
  error = error.details;
1202
1202
  }
1203
- if (typeof error === "string") {
1203
+ if (typeof error === 'string') {
1204
1204
  error = { message: error };
1205
1205
  }
1206
1206
  }
@@ -1215,10 +1215,10 @@ class Webform extends NestedDataComponent_1.default {
1215
1215
  error = this.normalizeError(error);
1216
1216
  this.submitting = false;
1217
1217
  this.setPristine(false);
1218
- this.emit("submitError", error || this.errors);
1218
+ this.emit('submitError', error || this.errors);
1219
1219
  // Allow for silent cancellations (no error message, no submit button error state)
1220
1220
  if (error && error.silent) {
1221
- this.emit("change", { isValid: true }, { silent: true });
1221
+ this.emit('change', { isValid: true }, { silent: true });
1222
1222
  return false;
1223
1223
  }
1224
1224
  const errors = this.showErrors(error, true);
@@ -1269,12 +1269,12 @@ class Webform extends NestedDataComponent_1.default {
1269
1269
  this.triggerSaveDraft();
1270
1270
  }
1271
1271
  if (!flags || !flags.noEmit) {
1272
- this.emit("change", value, flags, modified);
1272
+ this.emit('change', value, flags, modified);
1273
1273
  isChangeEventEmitted = true;
1274
1274
  }
1275
1275
  // The form is initialized after the first change event occurs.
1276
1276
  if (isChangeEventEmitted && !this.initialized) {
1277
- this.emit("initialized");
1277
+ this.emit('initialized');
1278
1278
  this.initialized = true;
1279
1279
  }
1280
1280
  }
@@ -1284,7 +1284,7 @@ class Webform extends NestedDataComponent_1.default {
1284
1284
  */
1285
1285
  deleteSubmission() {
1286
1286
  return this.formio.deleteSubmission().then(() => {
1287
- this.emit("submissionDeleted", this.submission);
1287
+ this.emit('submissionDeleted', this.submission);
1288
1288
  this.resetValue();
1289
1289
  });
1290
1290
  }
@@ -1295,13 +1295,13 @@ class Webform extends NestedDataComponent_1.default {
1295
1295
  * @returns {boolean} - TRUE means the submission was cancelled, FALSE otherwise.
1296
1296
  */
1297
1297
  cancel(noconfirm) {
1298
- const shouldReset = this.hook("beforeCancel", true);
1299
- if (shouldReset && (noconfirm || confirm(this.t("confirmCancel")))) {
1298
+ const shouldReset = this.hook('beforeCancel', true);
1299
+ if (shouldReset && (noconfirm || confirm(this.t('confirmCancel')))) {
1300
1300
  this.resetValue();
1301
1301
  return true;
1302
1302
  }
1303
1303
  else {
1304
- this.emit("cancelSubmit");
1304
+ this.emit('cancelSubmit');
1305
1305
  return false;
1306
1306
  }
1307
1307
  }
@@ -1309,8 +1309,8 @@ class Webform extends NestedDataComponent_1.default {
1309
1309
  // Add in metadata about client submitting the form
1310
1310
  submission.metadata = submission.metadata || {};
1311
1311
  lodash_1.default.defaults(submission.metadata, {
1312
- timezone: lodash_1.default.get(this, "_submission.metadata.timezone", (0, utils_1.currentTimezone)()),
1313
- offset: parseInt(lodash_1.default.get(this, "_submission.metadata.offset", (0, moment_1.default)().utcOffset()), 10),
1312
+ timezone: lodash_1.default.get(this, '_submission.metadata.timezone', (0, utils_1.currentTimezone)()),
1313
+ offset: parseInt(lodash_1.default.get(this, '_submission.metadata.offset', (0, moment_1.default)().utcOffset()), 10),
1314
1314
  origin: document.location.origin,
1315
1315
  referrer: document.referrer,
1316
1316
  browserName: navigator.appName,
@@ -1331,27 +1331,27 @@ class Webform extends NestedDataComponent_1.default {
1331
1331
  }
1332
1332
  const submission = (0, utils_1.fastCloneDeep)(this.submission || {});
1333
1333
  this.setMetadata(submission);
1334
- submission.state = options.state || submission.state || "submitted";
1335
- const isDraft = submission.state === "draft";
1336
- this.hook("beforeSubmit", Object.assign(Object.assign({}, submission), { component: options.component }), (err, data) => {
1334
+ submission.state = options.state || submission.state || 'submitted';
1335
+ const isDraft = submission.state === 'draft';
1336
+ this.hook('beforeSubmit', Object.assign(Object.assign({}, submission), { component: options.component }), (err, data) => {
1337
1337
  var _a;
1338
1338
  if (err) {
1339
1339
  return reject(err);
1340
1340
  }
1341
- submission._vnote = data && data._vnote ? data._vnote : "";
1341
+ submission._vnote = data && data._vnote ? data._vnote : '';
1342
1342
  try {
1343
1343
  if (!isDraft && !options.noValidate) {
1344
1344
  if (!submission.data) {
1345
- return reject("Invalid Submission");
1345
+ return reject('Invalid Submission');
1346
1346
  }
1347
1347
  const errors = this.validate(submission.data, {
1348
1348
  local,
1349
1349
  dirty: true,
1350
1350
  silentCheck: false,
1351
- process: "submit",
1351
+ process: 'submit',
1352
1352
  });
1353
1353
  if (errors.length ||
1354
- ((_a = options.beforeSubmitResults) === null || _a === void 0 ? void 0 : _a.some((result) => result.status === "rejected"))) {
1354
+ ((_a = options.beforeSubmitResults) === null || _a === void 0 ? void 0 : _a.some((result) => result.status === 'rejected'))) {
1355
1355
  return reject(errors);
1356
1356
  }
1357
1357
  }
@@ -1361,18 +1361,18 @@ class Webform extends NestedDataComponent_1.default {
1361
1361
  }
1362
1362
  this.everyComponent((comp) => {
1363
1363
  var _a, _b;
1364
- if (submission._vnote && comp.type === "form" && comp.component.reference) {
1364
+ if (submission._vnote && comp.type === 'form' && comp.component.reference) {
1365
1365
  lodash_1.default.get(submission.data, local ? (_a = comp.paths) === null || _a === void 0 ? void 0 : _a.localDataPath : comp.path, {})._vnote = submission._vnote;
1366
1366
  }
1367
1367
  const { persistent } = comp.component;
1368
- if (persistent === "client-only") {
1368
+ if (persistent === 'client-only') {
1369
1369
  lodash_1.default.unset(submission.data, local ? (_b = comp.paths) === null || _b === void 0 ? void 0 : _b.localDataPath : comp.path);
1370
1370
  }
1371
1371
  });
1372
- this.hook("customValidation", Object.assign(Object.assign({}, submission), { component: options.component }), (err) => {
1372
+ this.hook('customValidation', Object.assign(Object.assign({}, submission), { component: options.component }), (err) => {
1373
1373
  if (err) {
1374
1374
  // If string is returned, cast to object.
1375
- if (typeof err === "string") {
1375
+ if (typeof err === 'string') {
1376
1376
  err = {
1377
1377
  message: err,
1378
1378
  };
@@ -1386,8 +1386,8 @@ class Webform extends NestedDataComponent_1.default {
1386
1386
  if (this._form && this._form.action) {
1387
1387
  const method = submission.data._id &&
1388
1388
  this._form.action.includes(submission.data._id)
1389
- ? "PUT"
1390
- : "POST";
1389
+ ? 'PUT'
1390
+ : 'POST';
1391
1391
  return Formio_1.Formio.makeStaticRequest(this._form.action, method, submission, this.formio ? this.formio.options : {})
1392
1392
  .then((result) => resolve({
1393
1393
  submission: result,
@@ -1407,8 +1407,8 @@ class Webform extends NestedDataComponent_1.default {
1407
1407
  }
1408
1408
  // If this is an actionUrl, then make sure to save the action and not the submission.
1409
1409
  const submitMethod = submitFormio.actionUrl
1410
- ? "saveAction"
1411
- : "saveSubmission";
1410
+ ? 'saveAction'
1411
+ : 'saveSubmission';
1412
1412
  submitFormio[submitMethod](submission)
1413
1413
  .then((result) => resolve({
1414
1414
  submission: result,
@@ -1425,14 +1425,14 @@ class Webform extends NestedDataComponent_1.default {
1425
1425
  setServerErrors(error) {
1426
1426
  if (error.details) {
1427
1427
  this.serverErrors = error.details
1428
- .filter((err) => (err.level ? err.level === "error" : err))
1428
+ .filter((err) => (err.level ? err.level === 'error' : err))
1429
1429
  .map((err) => {
1430
1430
  err.fromServer = true;
1431
1431
  return err;
1432
1432
  });
1433
1433
  }
1434
- else if (typeof error === "string") {
1435
- this.serverErrors = [{ fromServer: true, level: "error", message: error }];
1434
+ else if (typeof error === 'string') {
1435
+ this.serverErrors = [{ fromServer: true, level: 'error', message: error }];
1436
1436
  }
1437
1437
  }
1438
1438
  executeSubmit(options) {
@@ -1491,17 +1491,17 @@ class Webform extends NestedDataComponent_1.default {
1491
1491
  }
1492
1492
  submitUrl(URL, headers) {
1493
1493
  if (!URL) {
1494
- return console.warn("Missing URL argument");
1494
+ return console.warn(this.t('missingUrl'));
1495
1495
  }
1496
1496
  const submission = this.submission || {};
1497
1497
  const API_URL = URL;
1498
1498
  const settings = {
1499
- method: "POST",
1499
+ method: 'POST',
1500
1500
  headers: {},
1501
1501
  };
1502
1502
  if (headers && headers.length > 0) {
1503
1503
  headers.map((e) => {
1504
- if (e.header !== "" && e.value !== "") {
1504
+ if (e.header !== '' && e.value !== '') {
1505
1505
  settings.headers[e.header] = this.interpolate(e.value, submission);
1506
1506
  }
1507
1507
  });
@@ -1511,21 +1511,22 @@ class Webform extends NestedDataComponent_1.default {
1511
1511
  headers: settings.headers,
1512
1512
  })
1513
1513
  .then(() => {
1514
- this.emit("requestDone");
1515
- this.setAlert("success", "<p> Success </p>");
1514
+ this.emit('requestDone');
1515
+ this.setAlert('success', `<p> ${this.t('success')} </p>`);
1516
1516
  })
1517
1517
  .catch((e) => {
1518
- const message = `${e.statusText ? e.statusText : ""} ${e.status ? e.status : e}`;
1519
- this.emit("error", message);
1518
+ const message = `${e.statusText ? e.statusText : ''} ${e.status ? e.status : e}`;
1519
+ this.emit('error', message);
1520
1520
  console.error(message);
1521
- this.setAlert("danger", `<p> ${message} </p>`);
1521
+ this.setAlert('danger', `<p> ${message} </p>`);
1522
1522
  return Promise.reject(this.onSubmissionError(e));
1523
1523
  });
1524
1524
  }
1525
1525
  else {
1526
- this.emit("error", "You should add a URL to this button.");
1527
- this.setAlert("warning", "You should add a URL to this button.");
1528
- return console.warn("You should add a URL to this button.");
1526
+ const message = this.t('urlNotAttachedToBtn');
1527
+ this.emit('error', message);
1528
+ this.setAlert('warning', message);
1529
+ return console.warn(message);
1529
1530
  }
1530
1531
  }
1531
1532
  triggerCaptcha() {
@@ -1544,7 +1545,7 @@ class Webform extends NestedDataComponent_1.default {
1544
1545
  }
1545
1546
  set nosubmit(value) {
1546
1547
  this._nosubmit = !!value;
1547
- this.emit("nosubmit", this._nosubmit);
1548
+ this.emit('nosubmit', this._nosubmit);
1548
1549
  }
1549
1550
  get nosubmit() {
1550
1551
  return this._nosubmit || false;