@formio/js 5.0.0-bb.dev.1

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

@@ -0,0 +1,229 @@
+declare namespace _default {
+    const bootstrap: {
+        webform: {
+            form: string;
+            builder: string;
+        };
+        well: {
+            form: string;
+        };
+        wizard: {
+            form: string;
+            builder: string;
+        };
+        wizardHeader: {
+            form: string;
+        };
+        wizardHeaderClassic: {
+            form: string;
+        };
+        wizardHeaderVertical: {
+            form: string;
+        };
+        wizardNav: {
+            form: string;
+        };
+        errorsList: {
+            form: string;
+        };
+        alert: {
+            form: string;
+        };
+        treeView: {
+            form: string;
+        };
+        treeEdit: {
+            form: string;
+        };
+        transform(type: any, text: any, instance: any): any;
+        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;
+        };
+        address: {
+            form: string;
+            html: string;
+        };
+        builder: {
+            form: string;
+        };
+        builderComponent: {
+            form: string;
+        };
+        builderComponents: {
+            form: string;
+        };
+        builderEditForm: {
+            form: string;
+        };
+        builderPlaceholder: {
+            form: string;
+        };
+        builderSidebar: {
+            form: string;
+        };
+        builderSidebarGroup: {
+            form: string;
+        };
+        builderWizard: {
+            form: string;
+        };
+        button: {
+            form: string;
+            html: string;
+        };
+        checkbox: {
+            form: string;
+            html: string;
+        };
+        columns: {
+            form: string;
+        };
+        component: {
+            form: string;
+        };
+        componentModal: {
+            form: string;
+        };
+        components: {
+            form: string;
+        };
+        tableComponents: {
+            form: string;
+        };
+        container: {
+            form: string;
+        };
+        datagrid: {
+            form: string;
+            html: string;
+        };
+        day: {
+            form: string;
+        };
+        dialog: {
+            form: string;
+        };
+        editgrid: {
+            form: string;
+            html: string;
+        };
+        editgridTable: {
+            form: string;
+            html: string;
+        };
+        field: {
+            form: string;
+            align: string;
+        };
+        fieldset: {
+            form: string;
+        };
+        file: {
+            form: string;
+        };
+        html: {
+            form: string;
+        };
+        icon: {
+            form: string;
+        };
+        input: {
+            form: string;
+            html: string;
+        };
+        label: {
+            form: string;
+        };
+        loader: {
+            form: string;
+        };
+        loading: {
+            form: string;
+        };
+        map: {
+            form: string;
+        };
+        message: {
+            form: string;
+        };
+        modaledit: {
+            form: string;
+        };
+        modaldialog: {
+            form: string;
+        };
+        modalPreview: {
+            form: string;
+        };
+        multipleMasksInput: {
+            form: string;
+        };
+        multiValueRow: {
+            form: string;
+        };
+        multiValueTable: {
+            form: string;
+        };
+        panel: {
+            form: string;
+        };
+        pdf: {
+            form: string;
+        };
+        pdfBuilder: {
+            form: string;
+        };
+        pdfBuilderUpload: {
+            form: string;
+        };
+        radio: {
+            form: string;
+            html: string;
+        };
+        resourceAdd: {
+            form: string;
+        };
+        select: {
+            form: string;
+            html: string;
+        };
+        selectOption: {
+            form: string;
+            html: string;
+        };
+        signature: {
+            form: string;
+            html: string;
+        };
+        survey: {
+            form: string;
+            html: string;
+        };
+        tab: {
+            flat: string;
+            form: string;
+        };
+        table: {
+            form: string;
+        };
+        tree: {
+            form: string;
+        };
+    };
+}
+export default _default;

package/lib/mjs/templates/index.js

@@ -0,0 +1,4 @@
+import bootstrap from '@formio/bootstrap/bootstrap5';
+export default {
+    bootstrap: bootstrap.templates.bootstrap5
+};

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

@@ -0,0 +1,66 @@
+declare namespace _default {
+    const unsavedRowsError: string;
+    const invalidRowsError: string;
+    const invalidRowError: string;
+    const alertMessageWithLabel: string;
+    const alertMessage: string;
+    const complete: string;
+    const error: string;
+    const errorListHotkey: string;
+    const errorsListNavigationMessage: string;
+    const submitError: string;
+    const required: string;
+    const unique: string;
+    const array: string;
+    const array_nonempty: string;
+    const nonarray: string;
+    const select: string;
+    const pattern: string;
+    const minLength: string;
+    const maxLength: string;
+    const minWords: string;
+    const maxWords: string;
+    const min: string;
+    const max: string;
+    const maxDate: string;
+    const minDate: string;
+    const maxYear: string;
+    const minYear: string;
+    const invalid_email: string;
+    const invalid_url: string;
+    const invalid_regex: string;
+    const invalid_date: string;
+    const invalid_day: string;
+    const mask: string;
+    const valueIsNotAvailable: string;
+    const stripe: string;
+    const month: string;
+    const day: string;
+    const year: string;
+    const january: string;
+    const february: string;
+    const march: string;
+    const april: string;
+    const may: string;
+    const june: string;
+    const july: string;
+    const august: string;
+    const september: string;
+    const october: string;
+    const november: string;
+    const december: string;
+    const next: string;
+    const previous: string;
+    const cancel: string;
+    const submit: string;
+    const confirmCancel: string;
+    const saveDraftInstanceError: string;
+    const saveDraftAuthError: string;
+    const restoreDraftInstanceError: string;
+    const time: string;
+    const cancelButtonAriaLabel: string;
+    const previousButtonAriaLabel: string;
+    const nextButtonAriaLabel: string;
+    const submitButtonAriaLabel: string;
+}
+export default _default;

package/lib/mjs/translations/en.js

@@ -0,0 +1,65 @@
+export default {
+    unsavedRowsError: 'Please save all rows before proceeding.',
+    invalidRowsError: 'Please correct invalid rows before proceeding.',
+    invalidRowError: 'Invalid row. Please correct it or delete.',
+    alertMessageWithLabel: '{{label}}: {{message}}',
+    alertMessage: '{{message}}',
+    complete: 'Submission Complete',
+    error: 'Please fix the following errors before submitting.',
+    errorListHotkey: 'Press Ctrl + Alt + X to go back to the error list.',
+    errorsListNavigationMessage: 'Click to navigate to the field with following error.',
+    submitError: 'Please check the form and correct all errors before submitting.',
+    required: '{{field}} is required',
+    unique: '{{field}} must be unique',
+    array: '{{field}} must be an array',
+    array_nonempty: '{{field}} must be a non-empty array',
+    nonarray: '{{field}} must not be an array',
+    select: '{{field}} contains an invalid selection',
+    pattern: '{{field}} does not match the pattern {{pattern}}',
+    minLength: '{{field}} must have at least {{length}} characters.',
+    maxLength: '{{field}} must have no more than {{length}} characters.',
+    minWords: '{{field}} must have at least {{length}} words.',
+    maxWords: '{{field}} must have no more than {{length}} words.',
+    min: '{{field}} cannot be less than {{min}}.',
+    max: '{{field}} cannot be greater than {{max}}.',
+    maxDate: '{{field}} should not contain date after {{- maxDate}}',
+    minDate: '{{field}} should not contain date before {{- minDate}}',
+    maxYear: '{{field}} should not contain year greater than {{maxYear}}',
+    minYear: '{{field}} should not contain year less than {{minYear}}',
+    invalid_email: '{{field}} must be a valid email.',
+    invalid_url: '{{field}} must be a valid url.',
+    invalid_regex: '{{field}} does not match the pattern {{regex}}.',
+    invalid_date: '{{field}} is not a valid date.',
+    invalid_day: '{{field}} is not a valid day.',
+    mask: '{{field}} does not match the mask.',
+    valueIsNotAvailable: '{{ field }} is an invalid value.',
+    stripe: '{{stripe}}',
+    month: 'Month',
+    day: 'Day',
+    year: 'Year',
+    january: 'January',
+    february: 'February',
+    march: 'March',
+    april: 'April',
+    may: 'May',
+    june: 'June',
+    july: 'July',
+    august: 'August',
+    september: 'September',
+    october: 'October',
+    november: 'November',
+    december: 'December',
+    next: 'Next',
+    previous: 'Previous',
+    cancel: 'Cancel',
+    submit: 'Submit Form',
+    confirmCancel: 'Are you sure you want to cancel?',
+    saveDraftInstanceError: 'Cannot save draft because there is no formio instance.',
+    saveDraftAuthError: 'Cannot save draft unless a user is authenticated.',
+    restoreDraftInstanceError: 'Cannot restore draft because there is no formio instance.',
+    time: 'Invalid time',
+    cancelButtonAriaLabel: 'Cancel button. Click to reset the form',
+    previousButtonAriaLabel: 'Previous button. Click to go back to the previous tab',
+    nextButtonAriaLabel: 'Next button. Click to go to the next tab',
+    submitButtonAriaLabel: 'Submit Form button. Click to submit the form',
+};

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

@@ -0,0 +1,38 @@
+export namespace KEY_CODES {
+    const BACK_KEY: number;
+    const DELETE_KEY: number;
+    const TAB_KEY: number;
+    const ENTER_KEY: number;
+    const A_KEY: number;
+    const ESC_KEY: number;
+    const UP_KEY: number;
+    const DOWN_KEY: number;
+    const PAGE_UP_KEY: number;
+    const PAGE_DOWN_KEY: number;
+}
+export default ChoicesWrapper;
+declare class ChoicesWrapper extends Choices {
+    constructor(...args: any[]);
+    _onTabKey({ activeItems, hasActiveDropdown }: {
+        activeItems: any;
+        hasActiveDropdown: any;
+    }): void;
+    isDirectionUsing: boolean;
+    shouldOpenDropDown: boolean;
+    _onTouchEnd(event: any): void;
+    _handleButtonAction(activeItems: any, element: any): void;
+    _onEnterKey(args: any): void;
+    _onDirectionKey(...args: any[]): void;
+    timeout: NodeJS.Timeout | undefined;
+    _selectHighlightedChoice(activeItems: any): void;
+    _onKeyDown(event: any): void;
+    onSelectValue({ event, activeItems, hasActiveDropdown }: {
+        event: any;
+        activeItems: any;
+        hasActiveDropdown: any;
+    }): void;
+    showDropdown(...args: any[]): void;
+    hideDropdown(...args: any[]): void;
+    _onBlur(...args: any[]): void;
+}
+import Choices from '@formio/choices.js';

package/lib/mjs/utils/ChoicesWrapper.js

@@ -0,0 +1,188 @@
+import Choices from '@formio/choices.js';
+/**
+ * TODO: REMOVE THIS ONCE THE PULL REQUEST HAS BEEN RESOLVED.
+ *
+ * https://github.com/jshjohnson/Choices/pull/788
+ *
+ * This is intentionally not part of the extended class, since other components use Choices and need this fix as well.
+ * @type {Choices._generatePlaceholderValue}
+ * @private
+ */
+Choices.prototype._generatePlaceholderValue = function () {
+    if (this._isSelectElement && this.passedElement.placeholderOption) {
+        const { placeholderOption } = this.passedElement;
+        return placeholderOption ? placeholderOption.text : false;
+    }
+    const { placeholder, placeholderValue } = this.config;
+    const { element: { dataset }, } = this.passedElement;
+    if (placeholder) {
+        if (placeholderValue) {
+            return placeholderValue;
+        }
+        if (dataset.placeholder) {
+            return dataset.placeholder;
+        }
+    }
+    return false;
+};
+export const KEY_CODES = {
+    BACK_KEY: 46,
+    DELETE_KEY: 8,
+    TAB_KEY: 9,
+    ENTER_KEY: 13,
+    A_KEY: 65,
+    ESC_KEY: 27,
+    UP_KEY: 38,
+    DOWN_KEY: 40,
+    PAGE_UP_KEY: 33,
+    PAGE_DOWN_KEY: 34,
+};
+class ChoicesWrapper extends Choices {
+    constructor(...args) {
+        super(...args);
+        this._onTabKey = this._onTabKey.bind(this);
+        this.isDirectionUsing = false;
+        this.shouldOpenDropDown = true;
+    }
+    _onTouchEnd(event) {
+        var target = (event || event.touches[0]).target;
+        var touchWasWithinContainer = this._wasTap && this.containerOuter.element.contains(target);
+        if (touchWasWithinContainer) {
+            var containerWasExactTarget = target === this.containerOuter.element || target === this.containerInner.element;
+            if (containerWasExactTarget) {
+                if (this._isTextElement) {
+                    this.input.focus();
+                }
+                else if (this._isSelectMultipleElement) {
+                    this.input.focus();
+                    this.showDropdown();
+                }
+            }
+            // Prevents focus event firing
+            event.stopPropagation();
+        }
+        this._wasTap = true;
+    }
+    _handleButtonAction(activeItems, element) {
+        if (!this._isSelectOneElement) {
+            return super._handleButtonAction(activeItems, element);
+        }
+        if (!activeItems ||
+            !element ||
+            !this.config.removeItems ||
+            !this.config.removeItemButton) {
+            return;
+        }
+        super._handleButtonAction(activeItems, element);
+    }
+    _onEnterKey(args) {
+        // Prevent dropdown form opening when removeItemButton was pressed using 'Enter' on keyboard
+        if (args.event.target.className === 'choices__button') {
+            this.shouldOpenDropDown = false;
+        }
+        super._onEnterKey(args);
+    }
+    _onDirectionKey(...args) {
+        if (!this._isSelectOneElement) {
+            return super._onDirectionKey(...args);
+        }
+        this.isDirectionUsing = true;
+        super._onDirectionKey(...args);
+        this.onSelectValue(...args);
+        clearTimeout(this.timeout);
+        this.timeout = setTimeout(() => {
+            this.isDirectionUsing = false;
+        }, 250);
+    }
+    _onTabKey({ activeItems, hasActiveDropdown }) {
+        if (hasActiveDropdown) {
+            this._selectHighlightedChoice(activeItems);
+        }
+    }
+    _selectHighlightedChoice(activeItems) {
+        const highlightedChoice = this.dropdown.getChild(`.${this.config.classNames.highlightedState}`);
+        if (highlightedChoice) {
+            this._handleChoiceAction(activeItems, highlightedChoice);
+        }
+        event.preventDefault();
+    }
+    _onKeyDown(event) {
+        if (!this._isSelectOneElement) {
+            return super._onKeyDown(event);
+        }
+        const { target, keyCode, ctrlKey, metaKey } = event;
+        if (target !== this.input.element &&
+            !this.containerOuter.element.contains(target)) {
+            return;
+        }
+        const activeItems = this._store.activeItems;
+        const hasFocusedInput = this.input.isFocussed;
+        const hasActiveDropdown = this.dropdown.isActive;
+        const hasItems = this.itemList.hasChildren;
+        const keyString = String.fromCharCode(keyCode);
+        const { BACK_KEY, DELETE_KEY, TAB_KEY, ENTER_KEY, A_KEY, ESC_KEY, UP_KEY, DOWN_KEY, PAGE_UP_KEY, PAGE_DOWN_KEY, } = KEY_CODES;
+        const hasCtrlDownKeyPressed = ctrlKey || metaKey;
+        // If a user is typing and the dropdown is not active
+        if (!hasActiveDropdown && !this._isTextElement && /[a-zA-Z0-9-_ ]/.test(keyString)) {
+            const currentValue = this.input.element.value;
+            this.input.element.value = currentValue ? `${currentValue}${keyString}` : keyString;
+            this.showDropdown();
+        }
+        // Map keys to key actions
+        const keyDownActions = {
+            [A_KEY]: this._onAKey,
+            [TAB_KEY]: this._onTabKey,
+            [ENTER_KEY]: this._onEnterKey,
+            [ESC_KEY]: this._onEscapeKey,
+            [UP_KEY]: this._onDirectionKey,
+            [PAGE_UP_KEY]: this._onDirectionKey,
+            [DOWN_KEY]: this._onDirectionKey,
+            [PAGE_DOWN_KEY]: this._onDirectionKey,
+            [DELETE_KEY]: this._onDeleteKey,
+            [BACK_KEY]: this._onDeleteKey,
+        };
+        // If keycode has a function, run it
+        if (keyDownActions[keyCode]) {
+            keyDownActions[keyCode]({
+                event,
+                target,
+                keyCode,
+                metaKey,
+                activeItems,
+                hasFocusedInput,
+                hasActiveDropdown,
+                hasItems,
+                hasCtrlDownKeyPressed,
+            });
+        }
+    }
+    onSelectValue({ event, activeItems, hasActiveDropdown }) {
+        if (hasActiveDropdown) {
+            this._selectHighlightedChoice(activeItems);
+        }
+        else if (this._isSelectOneElement) {
+            this.showDropdown();
+            event.preventDefault();
+        }
+    }
+    showDropdown(...args) {
+        if (!this.shouldOpenDropDown) {
+            this.shouldOpenDropDown = true;
+            return;
+        }
+        super.showDropdown(...args);
+    }
+    hideDropdown(...args) {
+        if (this.isDirectionUsing) {
+            return;
+        }
+        super.hideDropdown(...args);
+    }
+    _onBlur(...args) {
+        if (this._isScrollingOnIe) {
+            return;
+        }
+        super._onBlur(...args);
+    }
+}
+export default ChoicesWrapper;

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

@@ -0,0 +1,4 @@
+export default Evaluator;
+declare namespace Evaluator {
+    function registerEvaluator(evaluator: any): void;
+}

package/lib/mjs/utils/Evaluator.js

@@ -0,0 +1,64 @@
+import _ from 'lodash';
+import stringHash from 'string-hash';
+import { Evaluator as CoreEvaluator } from '@formio/core/utils';
+const Evaluator = {
+    noeval: false,
+    protectedEval: false,
+    cache: {},
+    templateSettings: CoreEvaluator.templateSettings,
+    evaluator: CoreEvaluator.evaluator,
+    template(template, hash) {
+        hash = hash || stringHash(template);
+        if (Evaluator.cache[hash]) {
+            return Evaluator.cache[hash];
+        }
+        try {
+            // Ensure we handle copied templates from the ejs files.
+            template = template.replace(/ctx\./g, '');
+            return (Evaluator.cache[hash] = _.template(template, Evaluator.templateSettings));
+        }
+        catch (err) {
+            console.warn('Error while processing template', err, template);
+        }
+    },
+    interpolate(rawTemplate, data, _options) {
+        // Ensure reverse compatability.
+        const options = _.isObject(_options) ? _options : { noeval: _options };
+        if (typeof rawTemplate === 'function') {
+            try {
+                return rawTemplate(data);
+            }
+            catch (err) {
+                console.warn('Error interpolating template', err, data);
+                return err.message;
+            }
+        }
+        rawTemplate = String(rawTemplate);
+        let template;
+        if (Evaluator.noeval || options.noeval) {
+            return CoreEvaluator.interpolateString(rawTemplate, data, _options);
+        }
+        else {
+            template = Evaluator.template(rawTemplate);
+        }
+        if (typeof template === 'function') {
+            try {
+                return template(data);
+            }
+            catch (err) {
+                console.warn('Error interpolating template', err, rawTemplate, data);
+                return err.message;
+            }
+        }
+        return template;
+    },
+    evaluate(func, args) {
+        return Array.isArray(args) ? func(...args) : func(args);
+    }
+};
+Evaluator.registerEvaluator = (evaluator) => {
+    Object.keys(evaluator).forEach((key) => {
+        Evaluator[key] = evaluator[key];
+    });
+};
+export default Evaluator;

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

@@ -0,0 +1,22 @@
+declare namespace _default {
+    /**
+     * Appends a number to a component.key to keep it unique
+     *
+     * @param {Object} form
+     *   The components parent form.
+     * @param {Object} component
+     *   The component to uniquify
+     */
+    function uniquify(container: any, component: Object): boolean;
+    namespace additionalShortcuts {
+        const button: string[];
+    }
+    function getAlphaShortcuts(): any;
+    function getAdditionalShortcuts(type: any): any;
+    function getBindedShortcuts(components: any, input: any): any[];
+    function getAvailableShortcuts(form: any, component: any): {
+        label: string;
+        value: string;
+    }[];
+}
+export default _default;