@formio/js 5.0.0-dev.5673.3d062b9 → 5.0.0-dev.5676.625f434

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 (47) hide show
  1. package/dist/formio.form.js +7 -7
  2. package/dist/formio.form.min.js +1 -1
  3. package/dist/formio.full.js +7 -7
  4. package/dist/formio.full.min.js +1 -1
  5. package/dist/formio.utils.js +3 -3
  6. package/dist/formio.utils.min.js +1 -1
  7. package/lib/cjs/components/_classes/component/Component.js +4 -0
  8. package/lib/cjs/components/_classes/component/fixtures/comp7.d.ts +84 -0
  9. package/lib/cjs/components/_classes/component/fixtures/comp7.js +86 -0
  10. package/lib/cjs/components/_classes/component/fixtures/index.d.ts +2 -1
  11. package/lib/cjs/components/_classes/component/fixtures/index.js +3 -1
  12. package/lib/cjs/components/_classes/multivalue/Multivalue.d.ts +1 -1
  13. package/lib/cjs/components/_classes/multivalue/Multivalue.js +8 -1
  14. package/lib/cjs/components/number/Number.js +1 -1
  15. package/lib/cjs/components/number/fixtures/comp8.d.ts +32 -0
  16. package/lib/cjs/components/number/fixtures/comp8.js +28 -0
  17. package/lib/cjs/components/number/fixtures/index.d.ts +2 -1
  18. package/lib/cjs/components/number/fixtures/index.js +3 -1
  19. package/lib/cjs/components/phonenumber/fixtures/comp2.d.ts +16 -0
  20. package/lib/cjs/components/phonenumber/fixtures/comp2.js +25 -0
  21. package/lib/cjs/components/phonenumber/fixtures/index.d.ts +2 -1
  22. package/lib/cjs/components/phonenumber/fixtures/index.js +3 -1
  23. package/lib/cjs/components/select/Select.js +1 -2
  24. package/lib/cjs/utils/conditionOperators/DateGreaterThan.js +1 -2
  25. package/lib/cjs/utils/conditionOperators/IsEmptyValue.js +1 -2
  26. package/lib/cjs/utils/conditionOperators/IsEqualTo.js +3 -3
  27. package/lib/mjs/components/_classes/component/Component.js +4 -0
  28. package/lib/mjs/components/_classes/component/fixtures/comp7.d.ts +84 -0
  29. package/lib/mjs/components/_classes/component/fixtures/comp7.js +84 -0
  30. package/lib/mjs/components/_classes/component/fixtures/index.d.ts +2 -1
  31. package/lib/mjs/components/_classes/component/fixtures/index.js +2 -1
  32. package/lib/mjs/components/_classes/multivalue/Multivalue.d.ts +1 -1
  33. package/lib/mjs/components/_classes/multivalue/Multivalue.js +8 -1
  34. package/lib/mjs/components/number/Number.js +1 -1
  35. package/lib/mjs/components/number/fixtures/comp8.d.ts +32 -0
  36. package/lib/mjs/components/number/fixtures/comp8.js +26 -0
  37. package/lib/mjs/components/number/fixtures/index.d.ts +2 -1
  38. package/lib/mjs/components/number/fixtures/index.js +2 -1
  39. package/lib/mjs/components/phonenumber/fixtures/comp2.d.ts +16 -0
  40. package/lib/mjs/components/phonenumber/fixtures/comp2.js +23 -0
  41. package/lib/mjs/components/phonenumber/fixtures/index.d.ts +2 -1
  42. package/lib/mjs/components/phonenumber/fixtures/index.js +2 -1
  43. package/lib/mjs/components/select/Select.js +1 -2
  44. package/lib/mjs/utils/conditionOperators/DateGreaterThan.js +1 -1
  45. package/lib/mjs/utils/conditionOperators/IsEmptyValue.js +1 -1
  46. package/lib/mjs/utils/conditionOperators/IsEqualTo.js +1 -1
  47. package/package.json +1 -1
@@ -44,7 +44,7 @@ export default class Multivalue extends Field {
44
44
  attachMultiMask(index: number): boolean;
45
45
  /**
46
46
  * @param {any} input - The input element on which the mask is to be applied.
47
- * @param {string} mask - The mask pattern to apply to the input element. Exit early if no mask.
47
+ * @param {string} mask - The mask pattern to apply to the input element. Exit early and remove previous mask if no mask.
48
48
  */
49
49
  updateMask(input: any, mask: string): void;
50
50
  /**
@@ -232,10 +232,17 @@ export default class Multivalue extends Field {
232
232
  }
233
233
  /**
234
234
  * @param {any} input - The input element on which the mask is to be applied.
235
- * @param {string} mask - The mask pattern to apply to the input element. Exit early if no mask.
235
+ * @param {string} mask - The mask pattern to apply to the input element. Exit early and remove previous mask if no mask.
236
236
  */
237
237
  updateMask(input, mask) {
238
238
  if (!mask) {
239
+ if (input.mask) {
240
+ input.mask.destroy();
241
+ }
242
+ if (!this.component.placeholder) {
243
+ input.removeAttribute('placeholder');
244
+ }
245
+ input.value = '';
239
246
  return;
240
247
  }
241
248
  this.setInputMask(input, mask, !this.component.placeholder);
@@ -46,7 +46,7 @@ export default class NumberComponent extends Input {
46
46
  constructor(...args) {
47
47
  super(...args);
48
48
  const separators = getNumberSeparators(this.options.language || navigator.language);
49
- this.decimalSeparator = this.options.decimalSeparator = this.options.decimalSeparator
49
+ this.decimalSeparator = this.options.decimalSeparator = this.component.decimalSymbol || this.options.decimalSeparator
50
50
  || this.options.properties?.decimalSeparator
51
51
  || separators.decimalSeparator;
52
52
  if (this.component.delimiter) {
@@ -0,0 +1,32 @@
1
+ declare namespace _default {
2
+ let components: ({
3
+ label: string;
4
+ applyMaskOn: string;
5
+ mask: boolean;
6
+ tableView: boolean;
7
+ delimiter: boolean;
8
+ requireDecimal: boolean;
9
+ inputFormat: string;
10
+ truncateMultipleSpaces: boolean;
11
+ key: string;
12
+ type: string;
13
+ input: boolean;
14
+ decimalSymbol: string;
15
+ disableOnInvalid?: undefined;
16
+ } | {
17
+ type: string;
18
+ label: string;
19
+ key: string;
20
+ disableOnInvalid: boolean;
21
+ input: boolean;
22
+ tableView: boolean;
23
+ applyMaskOn?: undefined;
24
+ mask?: undefined;
25
+ delimiter?: undefined;
26
+ requireDecimal?: undefined;
27
+ inputFormat?: undefined;
28
+ truncateMultipleSpaces?: undefined;
29
+ decimalSymbol?: undefined;
30
+ })[];
31
+ }
32
+ export default _default;
@@ -0,0 +1,26 @@
1
+ export default {
2
+ components: [
3
+ {
4
+ "label": "Number",
5
+ "applyMaskOn": "change",
6
+ "mask": false,
7
+ "tableView": false,
8
+ "delimiter": false,
9
+ "requireDecimal": false,
10
+ "inputFormat": "plain",
11
+ "truncateMultipleSpaces": false,
12
+ "key": "number",
13
+ "type": "number",
14
+ "input": true,
15
+ "decimalSymbol": "-"
16
+ },
17
+ {
18
+ "type": "button",
19
+ "label": "Submit",
20
+ "key": "submit",
21
+ "disableOnInvalid": true,
22
+ "input": true,
23
+ "tableView": false
24
+ }
25
+ ]
26
+ };
@@ -5,4 +5,5 @@ import comp4 from './comp4';
5
5
  import comp5 from './comp5';
6
6
  import comp6 from './comp6';
7
7
  import comp7 from './comp7';
8
- export { comp1, comp2, comp3, comp4, comp5, comp6, comp7 };
8
+ import comp8 from './comp8';
9
+ export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8 };
@@ -5,4 +5,5 @@ import comp4 from './comp4';
5
5
  import comp5 from './comp5';
6
6
  import comp6 from './comp6';
7
7
  import comp7 from './comp7';
8
- export { comp1, comp2, comp3, comp4, comp5, comp6, comp7 };
8
+ import comp8 from './comp8';
9
+ export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8 };
@@ -0,0 +1,16 @@
1
+ declare namespace _default {
2
+ let components: {
3
+ label: string;
4
+ applyMaskOn: string;
5
+ allowMultipleMasks: boolean;
6
+ tableView: boolean;
7
+ key: string;
8
+ type: string;
9
+ inputMasks: {
10
+ label: string;
11
+ mask: string;
12
+ }[];
13
+ input: boolean;
14
+ }[];
15
+ }
16
+ export default _default;
@@ -0,0 +1,23 @@
1
+ export default {
2
+ components: [
3
+ {
4
+ "label": "Phone Number",
5
+ "applyMaskOn": "change",
6
+ "allowMultipleMasks": true,
7
+ "tableView": true,
8
+ "key": "phoneNumber",
9
+ "type": "phoneNumber",
10
+ "inputMasks": [
11
+ {
12
+ "label": "Canada",
13
+ "mask": "(999) 999-9999"
14
+ },
15
+ {
16
+ "label": "Other",
17
+ "mask": ""
18
+ }
19
+ ],
20
+ "input": true
21
+ }
22
+ ]
23
+ };
@@ -1,2 +1,3 @@
1
- export { comp1 };
2
1
  import comp1 from './comp1';
2
+ import comp2 from './comp2';
3
+ export { comp1, comp2 };
@@ -1,2 +1,3 @@
1
1
  import comp1 from './comp1';
2
- export { comp1 };
2
+ import comp2 from './comp2';
3
+ export { comp1, comp2 };
@@ -1,7 +1,6 @@
1
1
  import _ from 'lodash';
2
2
  import { Formio } from '../../Formio';
3
3
  import ListComponent from '../_classes/list/ListComponent';
4
- import Input from '../_classes/input/Input';
5
4
  import Form from '../../Form';
6
5
  import { getRandomComponentId, boolValue, isPromise, componentValueTypes, getComponentSavedTypes, isSelectResourceWithObjectValue, removeHTML } from '../../utils/utils';
7
6
  import Choices from '../../utils/ChoicesWrapper';
@@ -863,7 +862,7 @@ export default class SelectComponent extends ListComponent {
863
862
  this.choices.containerOuter.element.setAttribute('tabIndex', '-1');
864
863
  this.addEventListener(this.choices.containerOuter.element, 'focus', () => this.focusableElement.focus());
865
864
  }
866
- Input.prototype.addFocusBlurEvents.call(this, this.focusableElement);
865
+ this.addFocusBlurEvents(this.choices.input.element);
867
866
  if (this.itemsFromUrl && !this.component.noRefreshOnScroll) {
868
867
  this.scrollList = this.choices.choiceList.element;
869
868
  this.addEventListener(this.scrollList, 'scroll', () => this.onScroll());
@@ -19,7 +19,7 @@ export default class DateGeaterThan extends ConditionOperator {
19
19
  return false;
20
20
  }
21
21
  let conditionTriggerComponent = null;
22
- if (instance?.root?.getComponent) {
22
+ if (instance && instance.root) {
23
23
  conditionTriggerComponent = instance.root.getComponent(conditionComponentPath);
24
24
  }
25
25
  if (conditionTriggerComponent && conditionTriggerComponent.isPartialDay && conditionTriggerComponent.isPartialDay(value)) {
@@ -12,7 +12,7 @@ export default class IsEmptyValue extends ConditionOperator {
12
12
  }
13
13
  execute({ value, instance, conditionComponentPath }) {
14
14
  const isEmptyValue = _.isEmpty(value);
15
- if (instance?.root?.getComponent) {
15
+ if (instance && instance.root) {
16
16
  const conditionTriggerComponent = instance.root.getComponent(conditionComponentPath);
17
17
  return conditionTriggerComponent ? conditionTriggerComponent.isEmpty() : isEmptyValue;
18
18
  }
@@ -16,7 +16,7 @@ export default class IsEqualTo extends ConditionOperator {
16
16
  // eslint-disable-next-line no-empty
17
17
  catch (e) { }
18
18
  }
19
- if (instance?.root?.getComponent) {
19
+ if (instance && instance.root) {
20
20
  const conditionTriggerComponent = instance.root.getComponent(conditionComponentPath);
21
21
  if (conditionTriggerComponent
22
22
  && isSelectResourceWithObjectValue(conditionTriggerComponent.component)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@formio/js",
3
- "version": "5.0.0-dev.5673.3d062b9",
3
+ "version": "5.0.0-dev.5676.625f434",
4
4
  "description": "JavaScript powered Forms with JSON Form Builder",
5
5
  "main": "lib/cjs/index.js",
6
6
  "exports": {