@formio/js 5.0.0-rc.59 → 5.0.0-rc.60

package/lib/mjs/components/day/Day.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/day/Day.js

@@ -122,7 +122,7 @@ export default class DayComponent extends Field {
                 id: `${this.component.key}-${name}`,
                 class: `form-control ${this.transform('class', `formio-day-component-${name}`)}`,
                 type: this.component.fields[name].type === 'select' ? 'select' : 'number',
-                placeholder: this.component.fields[name].placeholder,
+                placeholder: this.t(this.component.fields[name].placeholder),
                 step: 1,
                 min,
                 max,

package/lib/mjs/components/day/fixtures/comp7.d.ts

@@ -0,0 +1,109 @@
+declare namespace _default {
+    let components: ({
+        type: string;
+        key: string;
+        label: string;
+        placeholder: string;
+        input: boolean;
+        applyMaskOn?: undefined;
+        tableView?: undefined;
+        hideInputLabels?: undefined;
+        inputsLabelPosition?: undefined;
+        useLocaleSettings?: undefined;
+        fields?: undefined;
+        defaultValue?: undefined;
+        values?: undefined;
+        questions?: undefined;
+        action?: undefined;
+        theme?: undefined;
+    } | {
+        label: string;
+        placeholder: string;
+        applyMaskOn: string;
+        tableView: boolean;
+        key: string;
+        type: string;
+        input: boolean;
+        hideInputLabels?: undefined;
+        inputsLabelPosition?: undefined;
+        useLocaleSettings?: undefined;
+        fields?: undefined;
+        defaultValue?: undefined;
+        values?: undefined;
+        questions?: undefined;
+        action?: undefined;
+        theme?: undefined;
+    } | {
+        label: string;
+        hideInputLabels: boolean;
+        inputsLabelPosition: string;
+        useLocaleSettings: boolean;
+        tableView: boolean;
+        fields: {
+            day: {
+                placeholder: string;
+                hide: boolean;
+            };
+            month: {
+                type: string;
+                placeholder: string;
+                hide: boolean;
+            };
+            year: {
+                placeholder: string;
+                hide: boolean;
+            };
+        };
+        key: string;
+        type: string;
+        input: boolean;
+        defaultValue: string;
+        placeholder?: undefined;
+        applyMaskOn?: undefined;
+        values?: undefined;
+        questions?: undefined;
+        action?: undefined;
+        theme?: undefined;
+    } | {
+        type: string;
+        key: string;
+        label: string;
+        values: {
+            label: string;
+            value: string;
+        }[];
+        questions: {
+            label: string;
+            value: string;
+        }[];
+        placeholder?: undefined;
+        input?: undefined;
+        applyMaskOn?: undefined;
+        tableView?: undefined;
+        hideInputLabels?: undefined;
+        inputsLabelPosition?: undefined;
+        useLocaleSettings?: undefined;
+        fields?: undefined;
+        defaultValue?: undefined;
+        action?: undefined;
+        theme?: undefined;
+    } | {
+        type: string;
+        action: string;
+        label: string;
+        theme: string;
+        key?: undefined;
+        placeholder?: undefined;
+        input?: undefined;
+        applyMaskOn?: undefined;
+        tableView?: undefined;
+        hideInputLabels?: undefined;
+        inputsLabelPosition?: undefined;
+        useLocaleSettings?: undefined;
+        fields?: undefined;
+        defaultValue?: undefined;
+        values?: undefined;
+        questions?: undefined;
+    })[];
+}
+export default _default;

package/lib/mjs/components/day/fixtures/comp7.js

@@ -0,0 +1,107 @@
+export default {
+    components: [
+        {
+            type: 'textfield',
+            key: 'firstName',
+            label: 'First Name',
+            placeholder: 'Enter your first name',
+            input: true
+        }, {
+            "label": "Day",
+            "placeholder": "Day",
+            "applyMaskOn": "change",
+            "tableView": true,
+            "key": "day2",
+            "type": "textfield",
+            "input": true
+        }, {
+            "label": "Month",
+            "placeholder": "Month",
+            "applyMaskOn": "change",
+            "tableView": true,
+            "key": "month2",
+            "type": "textfield",
+            "input": true
+        }, {
+            "label": "Year",
+            "placeholder": "Year",
+            "applyMaskOn": "change",
+            "tableView": true,
+            "key": "year2",
+            "type": "textfield",
+            "input": true
+        },
+        {
+            "label": "Day",
+            "hideInputLabels": false,
+            "inputsLabelPosition": "top",
+            "useLocaleSettings": false,
+            "tableView": false,
+            "fields": {
+                "day": {
+                    "placeholder": "Day",
+                    "hide": false
+                },
+                "month": {
+                    "type": "number",
+                    "placeholder": "Month",
+                    "hide": false
+                },
+                "year": {
+                    "placeholder": "Year",
+                    "hide": false
+                }
+            },
+            "key": "day",
+            "type": "day",
+            "input": true,
+            "defaultValue": "00/00/0000"
+        },
+        {
+            type: 'textfield',
+            key: 'lastName',
+            label: 'Last Name',
+            placeholder: 'Enter your last name',
+            input: true
+        },
+        {
+            type: 'survey',
+            key: 'questions',
+            label: 'Survey',
+            values: [
+                {
+                    label: 'Great',
+                    value: 'great'
+                },
+                {
+                    label: 'Good',
+                    value: 'good'
+                },
+                {
+                    label: 'Poor',
+                    value: 'poor'
+                }
+            ],
+            questions: [
+                {
+                    label: 'How would you rate the Form.io platform?',
+                    value: 'howWouldYouRateTheFormIoPlatform'
+                },
+                {
+                    label: 'How was Customer Support?',
+                    value: 'howWasCustomerSupport'
+                },
+                {
+                    label: 'Overall Experience?',
+                    value: 'overallExperience'
+                }
+            ]
+        },
+        {
+            type: 'button',
+            action: 'submit',
+            label: 'Submit',
+            theme: 'primary'
+        }
+    ]
+};

package/lib/mjs/components/day/fixtures/index.d.ts

@@ -4,4 +4,5 @@ import comp3 from './comp3';
 import comp4 from './comp4';
 import comp5 from './comp5';
 import comp6 from './comp6';
-export { comp1, comp2, comp3, comp4, comp5, comp6 };
+import comp7 from './comp7';
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7 };

package/lib/mjs/components/day/fixtures/index.js

@@ -4,4 +4,5 @@ import comp3 from './comp3';
 import comp4 from './comp4';
 import comp5 from './comp5';
 import comp6 from './comp6';
-export { comp1, comp2, comp3, comp4, comp5, comp6 };
+import comp7 from './comp7';
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7 };

package/lib/mjs/components/editgrid/EditGrid.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/email/Email.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/fieldset/Fieldset.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/file/File.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/file/File.js

@@ -649,8 +649,7 @@ export default class FileComponent extends Field {
         // Check if file with the same name is being uploaded
         const fileWithSameNameUploading = this.filesToSync.filesToUpload
             .some(fileToSync => fileToSync.file?.name === file.name);
-        const fileWithSameNameUploaded = this.dataValue
-            .some(fileStatus => fileStatus.originalName === file.name);
+        const fileWithSameNameUploaded = _.some(this.dataValue, fileStatus => fileStatus.originalName === file.name);
         return fileWithSameNameUploaded || fileWithSameNameUploading
             ? {
                 status: 'error',

package/lib/mjs/components/form/Form.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/form/Form.js

@@ -442,7 +442,7 @@ export default class FormComponent extends Component {
         }
         else if (this.formSrc) {
             this.subFormLoading = true;
-            const options = this.root.formio?.base && this.root.formio?.projectUrl
+            const options = this.root?.formio?.base && this.root?.formio?.projectUrl
                 ? {
                     base: this.root.formio.base,
                     project: this.root.formio.projectUrl,
@@ -623,10 +623,11 @@ export default class FormComponent extends Component {
             && submission._id
             && this.subForm.formio
             && _.isEmpty(submission.data);
-        if (shouldLoadSubmissionById) {
+        const shouldLoadDraftById = this.options.saveDraft && _.isEmpty(submission.data) && _.get(this.subForm, 'submission._id');
+        if (shouldLoadSubmissionById || shouldLoadDraftById) {
             const formId = submission.form || this.formObj.form || this.component.form;
-            const submissionUrl = `${this.subForm.formio.formsUrl}/${formId}/submission/${submission._id}`;
-            const options = this.root.formio?.base && this.root.formio?.projectUrl
+            const submissionUrl = `${this.subForm.formio.formsUrl}/${formId}/submission/${submission._id || this.subForm.submission._id}`;
+            const options = this.root?.formio?.base && this.root?.formio?.projectUrl
                 ? {
                     base: this.root.formio.base,
                     project: this.root.formio.projectUrl,

package/lib/mjs/components/hidden/Hidden.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/html/HTML.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/number/Number.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/panel/Panel.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/password/Password.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/phonenumber/PhoneNumber.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/radio/Radio.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/radio/Radio.js

@@ -200,7 +200,8 @@ export default class RadioComponent extends ListComponent {
         if (this.viewOnly || !this.refs.input || !this.refs.input.length) {
             return this.dataValue;
         }
-        let value = this.dataValue;
+        // If the input type of the component is checkbox the value should be determined by the checkboxes checked property
+        let value = this.component.inputType === 'checkbox' ? '' : this.dataValue;
         this.refs.input.forEach((input, index) => {
             if (input.checked) {
                 value = (this.isSelectURL && _.isObject(this.loadedOptions[index].value)) ?
@@ -322,7 +323,7 @@ export default class RadioComponent extends ListComponent {
             const value = this.dataValue;
             this.refs.wrapper.forEach((wrapper, index) => {
                 const input = this.refs.input[index];
-                const checked = (input.type === 'checkbox') ? value[input.value] : (input.value.toString() === value.toString());
+                const checked = (input.type === 'checkbox') ? value[input.value] || input.checked : (input.value.toString() === value.toString());
                 if (checked) {
                     //add class to container when selected
                     this.addClass(wrapper, this.optionSelectedClass);

package/lib/mjs/components/recaptcha/ReCaptcha.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/select/Select.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/select/Select.js

@@ -3,7 +3,7 @@ import { Formio } from '../../Formio';
 import ListComponent from '../_classes/list/ListComponent';
 import Input from '../_classes/input/Input';
 import Form from '../../Form';
-import { getRandomComponentId, boolValue, isPromise, componentValueTypes, getComponentSavedTypes, unescapeHTML, isSelectResourceWithObjectValue } from '../../utils/utils';
+import { getRandomComponentId, boolValue, isPromise, componentValueTypes, getComponentSavedTypes, isSelectResourceWithObjectValue, removeHTML } from '../../utils/utils';
 import Choices from '../../utils/ChoicesWrapper';
 export default class SelectComponent extends ListComponent {
     static schema(...extend) {
@@ -1548,7 +1548,7 @@ export default class SelectComponent extends ListComponent {
         const getTemplateValue = (v) => {
             const itemTemplate = this.itemTemplate(v);
             return options.csv && itemTemplate
-                ? unescapeHTML(itemTemplate)
+                ? removeHTML(itemTemplate)
                 : itemTemplate;
         };
         if (Array.isArray(value)) {

package/lib/mjs/components/selectboxes/SelectBoxes.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/signature/Signature.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/survey/Survey.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/table/Table.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/tabs/Tabs.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/tags/Tags.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/textarea/TextArea.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/textfield/TextField.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/textfield/TextField.js

@@ -147,6 +147,9 @@ export default class TextFieldComponent extends Input {
         const maskInput = this.refs.select ? this.refs.select[index] : null;
         const mask = this.getMaskPattern(value.maskName);
         if (textInput && maskInput && mask) {
+            // We need to set the maskInput (select dropdown) value before calling inputmask.setValue because, this
+            // function will trigger a "change" event, which was calling updateValue setting the mask type to an incorrect value.
+            maskInput.value = value.maskName;
             if (textInput.inputmask) {
                 this.setInputMask(textInput, mask);
                 textInput.inputmask.setValue(textValue);
@@ -155,7 +158,6 @@ export default class TextFieldComponent extends Input {
                 const placeholderChar = this.placeholderChar;
                 textInput.value = conformToMask(textValue, FormioUtils.getInputMask(mask), { placeholderChar }).conformedValue;
             }
-            maskInput.value = value.maskName;
         }
         else {
             return super.setValueAt(index, textValue, flags);

package/lib/mjs/components/time/Time.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/url/Url.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/components/well/Well.form.d.ts

@@ -3,4 +3,4 @@
  * @param {...any} extend - The components that extend the edit form.
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
-export default function _default(...extend: any[]): import('@formio/core').Component[];
+export default function _default(...extend: any[]): import("@formio/core").Component[];

package/lib/mjs/providers/address/AzureAddressProvider.d.ts

@@ -17,7 +17,7 @@ export class AzureAddressProvider extends AddressProvider {
      */
     get defaultOptions(): {
         params: {
-            'api-version': string;
+            "api-version": string;
             typeahead: string;
         };
     };

package/lib/mjs/providers/address/GoogleAddressProvider.js

@@ -48,7 +48,7 @@ export class GoogleAddressProvider extends AddressProvider {
     constructor(options = {}) {
         super(options);
         this.setAutocompleteOptions();
-        let src = 'https://maps.googleapis.com/maps/api/js?v=quarterly&libraries=places&callback=googleMapsCallback';
+        let src = 'https://maps.googleapis.com/maps/api/js?v=quarterly&libraries=places&loading=async&callback=googleMapsCallback';
         if (options.params?.key) {
             src += `&key=${options.params.key}`;
         }

package/lib/mjs/templates/index.d.ts

@@ -39,20 +39,20 @@ declare namespace _default {
         defaultIconset: string;
         iconClass: (iconset: any, name: any, spinning: any) => string;
         cssClasses: {
-            'border-default': string;
-            'formio-tab-panel-active': string;
-            'formio-tab-link-active': string;
-            'formio-tab-link-container-active': string;
-            'formio-form-error': string;
-            'formio-form-alert': string;
-            'formio-label-error': string;
-            'formio-input-error': string;
-            'formio-alert-danger': string;
-            'formio-alert-success': string;
-            'formio-alert-warning': string;
-            'formio-modal-cancel-button': string;
-            'formio-modal-confirm-button': string;
-            'form-group': string;
+            "border-default": string;
+            "formio-tab-panel-active": string;
+            "formio-tab-link-active": string;
+            "formio-tab-link-container-active": string;
+            "formio-form-error": string;
+            "formio-form-alert": string;
+            "formio-label-error": string;
+            "formio-input-error": string;
+            "formio-alert-danger": string;
+            "formio-alert-success": string;
+            "formio-alert-warning": string;
+            "formio-modal-cancel-button": string;
+            "formio-modal-confirm-button": string;
+            "form-group": string;
         };
         address: {
             form: string;

package/lib/mjs/translations/en.d.ts

@@ -72,5 +72,7 @@ declare namespace _default {
     let reCaptchaTokenValidationError: string;
     let reCaptchaTokenNotSpecifiedError: string;
     let apiKey: string;
+    let typeRemaining: string;
+    let typeCount: string;
 }
 export default _default;

package/lib/mjs/translations/en.js

@@ -71,5 +71,7 @@ export default {
     submitButtonAriaLabel: 'Submit Form button. Click to submit the form',
     reCaptchaTokenValidationError: 'ReCAPTCHA: Token validation error',
     reCaptchaTokenNotSpecifiedError: 'ReCAPTCHA: Token is not specified in submission',
-    apiKey: 'API Key is not unique: {{key}}'
+    apiKey: 'API Key is not unique: {{key}}',
+    typeRemaining: '{{ remaining }} {{ type }} remaining.',
+    typeCount: '{{ count }} {{ type }}'
 };

package/lib/mjs/utils/ChoicesWrapper.d.ts

@@ -24,7 +24,7 @@ declare class ChoicesWrapper extends Choices {
     _onEnterKey(args: any): void;
     _onDirectionKey(...args: any[]): void;
     timeout: NodeJS.Timeout | undefined;
-    _selectHighlightedChoice(activeItems: any): void;
+    _selectHighlightedChoice(): void;
     _onKeyDown(event: any): void;
     onSelectValue({ event, activeItems, hasActiveDropdown }: {
         event: any;