@formio/js 5.0.0-dev.5780.6637ffb → 5.0.0-dev.5780.ceada4a

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 (48) hide show
  1. package/Changelog.md +1 -0
  2. package/dist/formio.form.js +7 -7
  3. package/dist/formio.form.min.js +1 -1
  4. package/dist/formio.full.js +7 -7
  5. package/dist/formio.full.min.js +1 -1
  6. package/dist/formio.utils.js +1 -1
  7. package/dist/formio.utils.min.js +1 -1
  8. package/lib/cjs/Webform.js +1 -1
  9. package/lib/cjs/components/_classes/component/Component.d.ts +1 -1
  10. package/lib/cjs/components/_classes/component/Component.js +5 -4
  11. package/lib/cjs/components/_classes/multivalue/Multivalue.d.ts +0 -1
  12. package/lib/cjs/components/_classes/multivalue/Multivalue.js +43 -25
  13. package/lib/cjs/components/address/Address.d.ts +6 -0
  14. package/lib/cjs/components/address/Address.js +7 -1
  15. package/lib/cjs/components/day/Day.d.ts +0 -1
  16. package/lib/cjs/components/editgrid/fixtures/index.d.ts +7 -7
  17. package/lib/cjs/components/editgrid/fixtures/index.js +1 -1
  18. package/lib/cjs/components/select/Select.js +1 -1
  19. package/lib/cjs/components/select/fixtures/comp25.d.ts +43 -28
  20. package/lib/cjs/components/select/fixtures/comp25.js +56 -49
  21. package/lib/cjs/components/select/fixtures/comp26.d.ts +44 -0
  22. package/lib/cjs/components/select/fixtures/comp26.js +59 -0
  23. package/lib/cjs/components/select/fixtures/index.d.ts +2 -1
  24. package/lib/cjs/components/select/fixtures/index.js +3 -1
  25. package/lib/cjs/components/tags/Tags.js +3 -3
  26. package/lib/cjs/utils/utils.d.ts +1 -1
  27. package/lib/cjs/utils/utils.js +1 -13
  28. package/lib/mjs/Webform.js +1 -1
  29. package/lib/mjs/components/_classes/component/Component.d.ts +1 -1
  30. package/lib/mjs/components/_classes/component/Component.js +2 -1
  31. package/lib/mjs/components/_classes/multivalue/Multivalue.d.ts +0 -1
  32. package/lib/mjs/components/_classes/multivalue/Multivalue.js +43 -25
  33. package/lib/mjs/components/address/Address.d.ts +6 -0
  34. package/lib/mjs/components/address/Address.js +10 -1
  35. package/lib/mjs/components/day/Day.d.ts +0 -1
  36. package/lib/mjs/components/editgrid/fixtures/index.d.ts +7 -7
  37. package/lib/mjs/components/editgrid/fixtures/index.js +1 -1
  38. package/lib/mjs/components/select/Select.js +1 -1
  39. package/lib/mjs/components/select/fixtures/comp25.d.ts +43 -28
  40. package/lib/mjs/components/select/fixtures/comp25.js +56 -49
  41. package/lib/mjs/components/select/fixtures/comp26.d.ts +44 -0
  42. package/lib/mjs/components/select/fixtures/comp26.js +57 -0
  43. package/lib/mjs/components/select/fixtures/index.d.ts +2 -1
  44. package/lib/mjs/components/select/fixtures/index.js +2 -1
  45. package/lib/mjs/components/tags/Tags.js +3 -3
  46. package/lib/mjs/utils/utils.d.ts +1 -1
  47. package/lib/mjs/utils/utils.js +1 -2
  48. package/package.json +1 -1
@@ -3425,10 +3425,11 @@ export default class Component extends Element {
3425
3425
  const { left, top } = element.getBoundingClientRect();
3426
3426
  window.scrollTo(left + window.scrollX, top + window.scrollY);
3427
3427
  }
3428
- focus(index = (this.refs.input.length - 1)) {
3428
+ focus(index) {
3429
3429
  if ('beforeFocus' in this.parent) {
3430
3430
  this.parent.beforeFocus(this);
3431
3431
  }
3432
+ index = index || this.refs.input?.length - 1;
3432
3433
  if (this.refs.input?.length) {
3433
3434
  const focusingInput = this.refs.input[index];
3434
3435
  if (this.component.widget?.type === 'calendar') {
@@ -1,6 +1,5 @@
1
1
  export default class Multivalue extends Field {
2
2
  get addAnother(): string;
3
- useWrapper(): any;
4
3
  /**
5
4
  * @returns {Field} - The created field.
6
5
  */
@@ -1,12 +1,40 @@
1
1
  import Field from '../field/Field';
2
2
  import _ from 'lodash';
3
3
  export default class Multivalue extends Field {
4
- get dataValue() {
5
- const parent = super.dataValue;
6
- if (!parent && this.component.multiple) {
7
- return [];
4
+ /**
5
+ * Normalize values coming into updateValue.
6
+ * @param {*} value - The value to normalize before setting.
7
+ * @returns {*} - The normalized value.
8
+ */
9
+ normalizeValue(value) {
10
+ if (this.component.multiple) {
11
+ if (Array.isArray(value)) {
12
+ if (value.length === 0) {
13
+ return [this.emptyValue];
14
+ }
15
+ if (this.component.storeas === 'array') {
16
+ return super.normalizeValue([value]);
17
+ }
18
+ return super.normalizeValue(value);
19
+ }
20
+ else {
21
+ return super.normalizeValue(value == null ? [this.emptyValue] : [value]);
22
+ }
23
+ }
24
+ else {
25
+ if (Array.isArray(value) && this.component.storeas !== 'array') {
26
+ if (this.component.storeas === 'string') {
27
+ return super.normalizeValue(value.join(this.delimiter || ''));
28
+ }
29
+ return super.normalizeValue(value[0] || this.emptyValue);
30
+ }
31
+ else {
32
+ return super.normalizeValue(value);
33
+ }
8
34
  }
9
- return parent;
35
+ }
36
+ get dataValue() {
37
+ return super.dataValue;
10
38
  }
11
39
  set dataValue(value) {
12
40
  super.dataValue = value;
@@ -26,30 +54,20 @@ export default class Multivalue extends Field {
26
54
  get addAnother() {
27
55
  return this.t(this.component.addAnother || 'Add Another');
28
56
  }
29
- useWrapper() {
30
- return this.component.hasOwnProperty('multiple') && this.component.multiple;
31
- }
32
57
  /**
33
58
  * @returns {Field} - The created field.
34
59
  */
35
60
  render() {
36
- // If single value field.
37
- if (!this.useWrapper()) {
38
- return super.render(`<div ${this._referenceAttributeName}="element">
39
- ${this.renderElement(this.component.type !== 'hidden' ? this.dataValue : '')}
40
- </div>`);
41
- }
42
- // Make sure dataValue is in the correct array format.
43
- let dataValue = this.dataValue;
44
- if (!Array.isArray(dataValue)) {
45
- dataValue = dataValue ? [dataValue] : [];
46
- }
47
- // If multiple value field.
48
- return super.render(this.renderTemplate('multiValueTable', {
49
- rows: dataValue.map(this.renderRow.bind(this)).join(''),
50
- disabled: this.disabled,
51
- addAnother: this.addAnother,
52
- }));
61
+ let dataValue = this.normalizeValue(this.dataValue);
62
+ return this.component.hasOwnProperty('multiple') && this.component.multiple
63
+ ? super.render(this.renderTemplate('multiValueTable', {
64
+ rows: dataValue.map(this.renderRow.bind(this)).join(''),
65
+ disabled: this.disabled,
66
+ addAnother: this.addAnother,
67
+ }))
68
+ : super.render(`<div ${this._referenceAttributeName}="element">
69
+ ${this.renderElement(this.component.type !== 'hidden' ? dataValue : '')}
70
+ </div>`);
53
71
  }
54
72
  renderElement() {
55
73
  return '';
@@ -11,6 +11,12 @@ export default class AddressComponent extends ContainerComponent {
11
11
  weight: number;
12
12
  schema: any;
13
13
  };
14
+ static get serverConditionSettings(): {
15
+ operators: string[];
16
+ };
17
+ static get conditionOperatorsSettings(): {
18
+ operators: string[];
19
+ };
14
20
  static get modeSwitcherRef(): string;
15
21
  static get removeValueIconRef(): string;
16
22
  static get searchInputRef(): string;
@@ -91,6 +91,15 @@ export default class AddressComponent extends ContainerComponent {
91
91
  schema: AddressComponent.schema(),
92
92
  };
93
93
  }
94
+ static get serverConditionSettings() {
95
+ return AddressComponent.conditionOperatorsSettings;
96
+ }
97
+ static get conditionOperatorsSettings() {
98
+ return {
99
+ ...super.conditionOperatorsSettings,
100
+ operators: ['isEmpty', 'isNotEmpty'],
101
+ };
102
+ }
94
103
  mergeSchema(component = {}) {
95
104
  let { defaultSchema } = this;
96
105
  if (component.components) {
@@ -181,7 +190,7 @@ export default class AddressComponent extends ContainerComponent {
181
190
  return (this.manualModeEnabled && this.dataValue) ? this.dataValue.address : this.dataValue;
182
191
  }
183
192
  set address(value) {
184
- if (this.manualModeEnabled && !this.isMultiple) {
193
+ if (this.manualModeEnabled && !this.isMultiple && !_.isEqual(value, this.emptyValue)) {
185
194
  this.dataValue.address = value;
186
195
  }
187
196
  else {
@@ -130,7 +130,6 @@ export default class DayComponent extends Field {
130
130
  * @returns {string|null} - The string value of the date.
131
131
  */
132
132
  getValueAsString(value: any): string | null;
133
- focus(field: any): void;
134
133
  isPartialDay(value: any): boolean;
135
134
  getValidationFormat(): string;
136
135
  }
@@ -1,22 +1,22 @@
1
1
  import comp1 from './comp1';
2
2
  import comp2 from './comp2';
3
3
  import comp3 from './comp3';
4
- import comp10 from './comp10';
5
- import comp11 from './comp11';
6
- import comp12 from './comp12';
7
- import comp13 from './comp13';
8
- import comp14 from './comp14';
9
- import comp15 from './comp15';
10
4
  import comp4 from './comp4';
11
5
  import comp5 from './comp5';
12
6
  import comp6 from './comp6';
13
7
  import comp7 from './comp7';
14
8
  import comp8 from './comp8';
15
9
  import comp9 from './comp9';
10
+ import comp10 from './comp10';
11
+ import comp11 from './comp11';
12
+ import comp12 from './comp12';
13
+ import comp13 from './comp13';
14
+ import comp14 from './comp14';
15
+ import comp15 from './comp15';
16
16
  import comp16 from './comp16';
17
17
  import comp17 from './comp17';
18
18
  import compOpenWhenEmpty from './comp-openWhenEmpty';
19
19
  import withOpenWhenEmptyAndConditions from './comp-with-conditions-and-openWhenEmpty';
20
20
  import compWithCustomDefaultValue from './comp-with-custom-default-value';
21
21
  import compTestEvents from './comp-test-events';
22
- export { comp1, comp2, comp3, comp10, comp11, comp12, comp13, comp14, comp15, comp4, comp5, comp6, comp7, comp8, comp9, comp16, comp17, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
22
+ export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
@@ -19,4 +19,4 @@ import withOpenWhenEmptyAndConditions from './comp-with-conditions-and-openWhenE
19
19
  import compOpenWhenEmpty from './comp-openWhenEmpty';
20
20
  import compWithCustomDefaultValue from './comp-with-custom-default-value';
21
21
  import compTestEvents from './comp-test-events';
22
- export { comp1, comp2, comp3, comp10, comp11, comp12, comp13, comp14, comp15, comp4, comp5, comp6, comp7, comp8, comp9, comp16, comp17, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
22
+ export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
@@ -1593,8 +1593,8 @@ export default class SelectComponent extends ListComponent {
1593
1593
  super.detach();
1594
1594
  }
1595
1595
  focus() {
1596
+ super.focus.call(this);
1596
1597
  if (this.focusableElement) {
1597
- super.focus.call(this);
1598
1598
  this.focusableElement.focus();
1599
1599
  }
1600
1600
  }
@@ -1,44 +1,59 @@
1
1
  declare namespace _default {
2
- let title: string;
3
- let name: string;
4
- let path: string;
5
- let type: string;
6
- let display: string;
7
2
  let components: ({
8
3
  label: string;
9
- widget: string;
10
4
  tableView: boolean;
11
- data: {
12
- values: {
13
- label: string;
14
- value: string;
15
- }[];
16
- };
17
- dataType: string;
5
+ modal: boolean;
6
+ rowDrafts: boolean;
18
7
  key: string;
19
8
  type: string;
9
+ displayAsTable: boolean;
20
10
  input: boolean;
21
- applyMaskOn?: undefined;
22
- conditional?: undefined;
11
+ components: ({
12
+ label: string;
13
+ widget: string;
14
+ tableView: boolean;
15
+ data: {
16
+ values: {
17
+ label: string;
18
+ value: string;
19
+ }[];
20
+ };
21
+ validate: {
22
+ required: boolean;
23
+ };
24
+ key: string;
25
+ type: string;
26
+ input: boolean;
27
+ applyMaskOn?: undefined;
28
+ validateWhenHidden?: undefined;
29
+ } | {
30
+ label: string;
31
+ applyMaskOn: string;
32
+ tableView: boolean;
33
+ validate: {
34
+ required: boolean;
35
+ };
36
+ validateWhenHidden: boolean;
37
+ key: string;
38
+ type: string;
39
+ input: boolean;
40
+ widget?: undefined;
41
+ data?: undefined;
42
+ })[];
43
+ showValidations?: undefined;
44
+ saveOnEnter?: undefined;
23
45
  } | {
24
46
  label: string;
25
- applyMaskOn: string;
47
+ showValidations: boolean;
26
48
  tableView: boolean;
27
49
  key: string;
28
50
  type: string;
29
51
  input: boolean;
30
- conditional: {
31
- show: boolean;
32
- conjunction: string;
33
- conditions: {
34
- component: string;
35
- operator: string;
36
- value: number;
37
- }[];
38
- };
39
- widget?: undefined;
40
- data?: undefined;
41
- dataType?: undefined;
52
+ saveOnEnter: boolean;
53
+ modal?: undefined;
54
+ rowDrafts?: undefined;
55
+ displayAsTable?: undefined;
56
+ components?: undefined;
42
57
  })[];
43
58
  }
44
59
  export default _default;
@@ -1,57 +1,64 @@
1
1
  export default {
2
- title: 'FIO-8072',
3
- name: 'fio8072',
4
- path: 'fio8072',
5
- type: 'form',
6
- display: 'form',
7
- components: [
2
+ "components": [
8
3
  {
9
- label: 'Select',
10
- widget: 'choicesjs',
11
- tableView: true,
12
- data: {
13
- values: [
14
- {
15
- label: 'A',
16
- value: '1',
4
+ "label": "Edit Grid",
5
+ "tableView": false,
6
+ "modal": true,
7
+ "rowDrafts": true,
8
+ "key": "editGrid",
9
+ "type": "editgrid",
10
+ "displayAsTable": false,
11
+ "input": true,
12
+ "components": [
13
+ {
14
+ "label": "Select",
15
+ "widget": "choicesjs",
16
+ "tableView": true,
17
+ "data": {
18
+ "values": [
19
+ {
20
+ "label": "a",
21
+ "value": "a"
22
+ },
23
+ {
24
+ "label": "b",
25
+ "value": "b"
26
+ },
27
+ {
28
+ "label": "c",
29
+ "value": "c"
30
+ }
31
+ ]
17
32
  },
18
- {
19
- label: 'B',
20
- value: '2',
33
+ "validate": {
34
+ "required": true
21
35
  },
22
- {
23
- label: 'C',
24
- value: '10',
36
+ "key": "select",
37
+ "type": "select",
38
+ "input": true
39
+ },
40
+ {
41
+ "label": "Text Field",
42
+ "applyMaskOn": "change",
43
+ "tableView": true,
44
+ "validate": {
45
+ "required": true
25
46
  },
26
- {
27
- label: 'D',
28
- value: '1d',
29
- },
30
- ],
31
- },
32
- dataType: 'number',
33
- key: 'select',
34
- type: 'select',
35
- input: true,
47
+ "validateWhenHidden": false,
48
+ "key": "textField",
49
+ "type": "textfield",
50
+ "input": true
51
+ }
52
+ ]
36
53
  },
37
54
  {
38
- label: 'Text Field',
39
- applyMaskOn: 'change',
40
- tableView: true,
41
- key: 'textField',
42
- type: 'textfield',
43
- input: true,
44
- conditional: {
45
- show: true,
46
- conjunction: 'all',
47
- conditions: [
48
- {
49
- component: 'select',
50
- operator: 'lessThan',
51
- value: 5,
52
- },
53
- ],
54
- },
55
- },
56
- ],
55
+ "label": "Submit",
56
+ "showValidations": false,
57
+ "tableView": false,
58
+ "key": "submit",
59
+ "type": "button",
60
+ "input": true,
61
+ "saveOnEnter": false
62
+ }
63
+ ]
57
64
  };
@@ -0,0 +1,44 @@
1
+ declare namespace _default {
2
+ let title: string;
3
+ let name: string;
4
+ let path: string;
5
+ let type: string;
6
+ let display: string;
7
+ let components: ({
8
+ label: string;
9
+ widget: string;
10
+ tableView: boolean;
11
+ data: {
12
+ values: {
13
+ label: string;
14
+ value: string;
15
+ }[];
16
+ };
17
+ dataType: string;
18
+ key: string;
19
+ type: string;
20
+ input: boolean;
21
+ applyMaskOn?: undefined;
22
+ conditional?: undefined;
23
+ } | {
24
+ label: string;
25
+ applyMaskOn: string;
26
+ tableView: boolean;
27
+ key: string;
28
+ type: string;
29
+ input: boolean;
30
+ conditional: {
31
+ show: boolean;
32
+ conjunction: string;
33
+ conditions: {
34
+ component: string;
35
+ operator: string;
36
+ value: number;
37
+ }[];
38
+ };
39
+ widget?: undefined;
40
+ data?: undefined;
41
+ dataType?: undefined;
42
+ })[];
43
+ }
44
+ export default _default;
@@ -0,0 +1,57 @@
1
+ export default {
2
+ title: 'FIO-8072',
3
+ name: 'fio8072',
4
+ path: 'fio8072',
5
+ type: 'form',
6
+ display: 'form',
7
+ components: [
8
+ {
9
+ label: 'Select',
10
+ widget: 'choicesjs',
11
+ tableView: true,
12
+ data: {
13
+ values: [
14
+ {
15
+ label: 'A',
16
+ value: '1',
17
+ },
18
+ {
19
+ label: 'B',
20
+ value: '2',
21
+ },
22
+ {
23
+ label: 'C',
24
+ value: '10',
25
+ },
26
+ {
27
+ label: 'D',
28
+ value: '1d',
29
+ },
30
+ ],
31
+ },
32
+ dataType: 'number',
33
+ key: 'select',
34
+ type: 'select',
35
+ input: true,
36
+ },
37
+ {
38
+ label: 'Text Field',
39
+ applyMaskOn: 'change',
40
+ tableView: true,
41
+ key: 'textField',
42
+ type: 'textfield',
43
+ input: true,
44
+ conditional: {
45
+ show: true,
46
+ conjunction: 'all',
47
+ conditions: [
48
+ {
49
+ component: 'select',
50
+ operator: 'lessThan',
51
+ value: 5,
52
+ },
53
+ ],
54
+ },
55
+ },
56
+ ],
57
+ };
@@ -22,5 +22,6 @@ import comp22 from './comp22';
22
22
  import comp23 from './comp23';
23
23
  import comp24 from './comp24';
24
24
  import comp25 from './comp25';
25
- export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25 };
25
+ import comp26 from './comp26';
26
+ export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25, comp26 };
26
27
  export { multiSelect, multiSelectOptions } from "./comp3";
@@ -23,4 +23,5 @@ import comp22 from './comp22';
23
23
  import comp23 from './comp23';
24
24
  import comp24 from './comp24';
25
25
  import comp25 from './comp25';
26
- export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25 };
26
+ import comp26 from './comp26';
27
+ export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25, comp26 };
@@ -116,12 +116,12 @@ export default class TagsComponent extends Input {
116
116
  }
117
117
  normalizeValue(value) {
118
118
  if (this.component.storeas === 'string' && Array.isArray(value)) {
119
- return value.join(this.delimiter);
119
+ return super.normalizeValue(value.join(this.delimiter));
120
120
  }
121
121
  else if (this.component.storeas === 'array' && typeof value === 'string') {
122
- return value.split(this.delimiter).filter(result => result);
122
+ return super.normalizeValue(value.split(this.delimiter).filter(result => result));
123
123
  }
124
- return value;
124
+ return super.normalizeValue(value);
125
125
  }
126
126
  setValue(value, flags = {}) {
127
127
  const changed = super.setValue(value, flags);
@@ -523,4 +523,4 @@ import jsonLogic from 'json-logic-js';
523
523
  import ConditionOperators from './conditionOperators';
524
524
  import { Evaluator } from './Evaluator';
525
525
  export const interpolate: typeof Evaluator.interpolate;
526
- export { jsonLogic, ConditionOperators, Evaluator, _ };
526
+ export { jsonLogic, ConditionOperators, moment, Evaluator, _ };
@@ -24,8 +24,7 @@ jsonLogic.add_operation('relativeMinDate', (relativeMinDate) => {
24
24
  jsonLogic.add_operation('relativeMaxDate', (relativeMaxDate) => {
25
25
  return moment().add(relativeMaxDate, 'days').toISOString();
26
26
  });
27
- export { jsonLogic, ConditionOperators };
28
- export * as moment from 'moment-timezone/moment-timezone';
27
+ export { jsonLogic, ConditionOperators, moment };
29
28
  /**
30
29
  * Sets the path to the component and parent schema.
31
30
  * @param {import('@formio/core').Component} component - The component to set the path for.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@formio/js",
3
- "version": "5.0.0-dev.5780.6637ffb",
3
+ "version": "5.0.0-dev.5780.ceada4a",
4
4
  "description": "JavaScript powered Forms with JSON Form Builder",
5
5
  "main": "lib/cjs/index.js",
6
6
  "exports": {