@formio/js 5.0.0-rc.5

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

@@ -0,0 +1,129 @@
+declare namespace _default {
+    export const label: string;
+    export const tableView: boolean;
+    export namespace validate {
+        const custom: string;
+        const required: boolean;
+        const customPrivate: boolean;
+        const strictDateValidation: boolean;
+        const multiple: boolean;
+        const unique: boolean;
+    }
+    export const rowDrafts: boolean;
+    export const key: string;
+    export const type: string;
+    export const input: boolean;
+    export const components: ({
+        label: string;
+        tableView: boolean;
+        defaultValue: boolean;
+        key: string;
+        type: string;
+        input: boolean;
+        conditional?: undefined;
+        title?: undefined;
+        collapsible?: undefined;
+        components?: undefined;
+    } | {
+        label: string;
+        tableView: boolean;
+        key: string;
+        conditional: {
+            show: boolean;
+            when: string;
+            eq: string;
+        };
+        type: string;
+        input: boolean;
+        defaultValue?: undefined;
+        title?: undefined;
+        collapsible?: undefined;
+        components?: undefined;
+    } | {
+        title: string;
+        collapsible: boolean;
+        key: string;
+        type: string;
+        label: string;
+        input: boolean;
+        tableView: boolean;
+        components: {
+            label: string;
+            tableView: boolean;
+            key: string;
+            conditional: {
+                show: boolean;
+                when: string;
+                eq: string;
+            };
+            type: string;
+            input: boolean;
+        }[];
+        defaultValue?: undefined;
+        conditional?: undefined;
+    })[];
+    export const placeholder: string;
+    export const prefix: string;
+    export const customClass: string;
+    export const suffix: string;
+    const multiple_1: boolean;
+    export { multiple_1 as multiple };
+    export const defaultValue: null;
+    const _protected: boolean;
+    export { _protected as protected };
+    const unique_1: boolean;
+    export { unique_1 as unique };
+    export const persistent: boolean;
+    export const hidden: boolean;
+    export const clearOnHide: boolean;
+    export const refreshOn: string;
+    export const redrawOn: string;
+    export const modalEdit: boolean;
+    export const labelPosition: string;
+    export const description: string;
+    export const errorLabel: string;
+    export const tooltip: string;
+    export const hideLabel: boolean;
+    export const tabindex: string;
+    export const disabled: boolean;
+    export const autofocus: boolean;
+    export const dbIndex: boolean;
+    export const customDefaultValue: string;
+    export const calculateValue: string;
+    export const calculateServer: boolean;
+    export const widget: null;
+    export const attributes: {};
+    export const validateOn: string;
+    export namespace conditional {
+        const show: null;
+        const when: null;
+        const eq: string;
+    }
+    export namespace overlay {
+        const style: string;
+        const left: string;
+        const top: string;
+        const width: string;
+        const height: string;
+    }
+    export const allowCalculateOverride: boolean;
+    export const encrypted: boolean;
+    export const showCharCount: boolean;
+    export const showWordCount: boolean;
+    export const properties: {};
+    export const allowMultipleMasks: boolean;
+    export const tree: boolean;
+    export const disableAddingRemovingRows: boolean;
+    export const removeRow: string;
+    export const defaultOpen: boolean;
+    export const openWhenEmpty: boolean;
+    export const modal: boolean;
+    export const inlineEdit: boolean;
+    export namespace templates {
+        const header: string;
+        const row: string;
+        const footer: string;
+    }
+    export const id: string;
+}
+export default _default;

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

@@ -0,0 +1,121 @@
+export default {
+    label: 'Edit Grid',
+    tableView: false,
+    validate: {
+        custom: "valid = true;\ndata.editGrid.forEach((r) => {\n  if (r.textField === data.name) {\n    valid = 'Invalid Name';\n  }\n});",
+        required: false,
+        customPrivate: false,
+        strictDateValidation: false,
+        multiple: false,
+        unique: false
+    },
+    rowDrafts: false,
+    key: 'editGrid',
+    type: 'editgrid',
+    input: true,
+    components: [
+        {
+            label: 'Checkbox',
+            tableView: false,
+            defaultValue: true,
+            key: 'checkbox',
+            type: 'checkbox',
+            input: true
+        },
+        {
+            label: 'Text Field',
+            tableView: true,
+            key: 'editGridChild',
+            conditional: {
+                show: true,
+                when: 'editGrid.checkbox',
+                eq: 'true'
+            },
+            type: 'textfield',
+            input: true
+        },
+        {
+            title: 'Child',
+            collapsible: false,
+            key: 'child',
+            type: 'panel',
+            label: 'Panel',
+            input: false,
+            tableView: false,
+            components: [
+                {
+                    label: 'Panel Child',
+                    tableView: true,
+                    key: 'panelChild',
+                    conditional: {
+                        show: true,
+                        when: 'editGrid.checkbox',
+                        eq: 'true'
+                    },
+                    type: 'textfield',
+                    input: true
+                }
+            ]
+        }
+    ],
+    placeholder: '',
+    prefix: '',
+    customClass: '',
+    suffix: '',
+    multiple: false,
+    defaultValue: null,
+    protected: false,
+    unique: false,
+    persistent: true,
+    hidden: false,
+    clearOnHide: true,
+    refreshOn: '',
+    redrawOn: '',
+    modalEdit: false,
+    labelPosition: 'top',
+    description: '',
+    errorLabel: '',
+    tooltip: '',
+    hideLabel: false,
+    tabindex: '',
+    disabled: false,
+    autofocus: false,
+    dbIndex: false,
+    customDefaultValue: '',
+    calculateValue: '',
+    calculateServer: false,
+    widget: null,
+    attributes: {},
+    validateOn: 'change',
+    conditional: {
+        show: null,
+        when: null,
+        eq: ''
+    },
+    overlay: {
+        style: '',
+        left: '',
+        top: '',
+        width: '',
+        height: ''
+    },
+    allowCalculateOverride: false,
+    encrypted: false,
+    showCharCount: false,
+    showWordCount: false,
+    properties: {},
+    allowMultipleMasks: false,
+    tree: true,
+    disableAddingRemovingRows: false,
+    removeRow: 'Cancel',
+    defaultOpen: false,
+    openWhenEmpty: false,
+    modal: false,
+    inlineEdit: false,
+    templates: {
+        header: "<div class=\"row\">\n      {% util.eachComponent(components, function(component) { %}\n        {% if (!component.hasOwnProperty('tableView') || component.tableView) { %}\n          <div class=\"col-sm-2\">{{ component.label }}</div>\n        {% } %}\n      {% }) %}\n    </div>",
+        row: "<div class=\"row\">\n      {% util.eachComponent(components, function(component) { %}\n        {% if (!component.hasOwnProperty('tableView') || component.tableView) { %}\n          <div class=\"col-sm-2\">\n            {{ getView(component, row[component.key]) }}\n          </div>\n        {% } %}\n      {% }) %}\n      {% if (!instance.disabled) { %}\n        <div class=\"col-sm-2\">\n          <div class=\"btn-group pull-right\">\n            <button class=\"btn btn-default btn-light btn-sm editRow\"><i class=\"{{ iconClass('edit') }}\"></i></button>\n            {% if (!instance.hasRemoveButtons || instance.hasRemoveButtons()) { %}\n              <button class=\"btn btn-danger btn-sm removeRow\"><i class=\"{{ iconClass('trash') }}\"></i></button>\n            {% } %}\n          </div>\n        </div>\n      {% } %}\n    </div>",
+        footer: ''
+    },
+    id: 'e10uov'
+};

package/lib/mjs/components/editgrid/fixtures/comp8.d.ts

@@ -0,0 +1,148 @@
+declare namespace _default {
+    export const label: string;
+    export const tableView: boolean;
+    export const rowDrafts: boolean;
+    export const key: string;
+    export const type: string;
+    export const input: boolean;
+    export const components: ({
+        label: string;
+        widget: string;
+        placeholder: string;
+        tableView: boolean;
+        data: {
+            values: {
+                label: string;
+                value: string;
+            }[];
+            url?: undefined;
+            headers?: undefined;
+        };
+        selectThreshold: number;
+        validate: {
+            required: boolean;
+        };
+        key: string;
+        type: string;
+        indexeddb: {
+            filter: {};
+        };
+        input: boolean;
+        dataSrc?: undefined;
+        valueProperty?: undefined;
+        template?: undefined;
+        refreshOn?: undefined;
+        clearOnRefresh?: undefined;
+        clearOnHide?: undefined;
+        selectValues?: undefined;
+        disableLimit?: undefined;
+        lazyLoad?: undefined;
+    } | {
+        label: string;
+        widget: string;
+        placeholder: string;
+        tableView: boolean;
+        dataSrc: string;
+        data: {
+            values: {
+                label: string;
+                value: string;
+            }[];
+            url: string;
+            headers: {
+                key: string;
+                value: string;
+            }[];
+        };
+        valueProperty: string;
+        template: string;
+        refreshOn: string;
+        clearOnRefresh: boolean;
+        selectThreshold: number;
+        clearOnHide: boolean;
+        validate: {
+            required: boolean;
+        };
+        key: string;
+        type: string;
+        indexeddb: {
+            filter: {};
+        };
+        selectValues: string;
+        input: boolean;
+        disableLimit: boolean;
+        lazyLoad: boolean;
+    })[];
+    export const placeholder: string;
+    export const prefix: string;
+    export const customClass: string;
+    export const suffix: string;
+    export const multiple: boolean;
+    export const defaultValue: null;
+    const _protected: boolean;
+    export { _protected as protected };
+    export const unique: boolean;
+    export const persistent: boolean;
+    export const hidden: boolean;
+    export const clearOnHide: boolean;
+    export const refreshOn: string;
+    export const redrawOn: string;
+    export const modalEdit: boolean;
+    export const labelPosition: string;
+    export const description: string;
+    export const errorLabel: string;
+    export const tooltip: string;
+    export const hideLabel: boolean;
+    export const tabindex: string;
+    export const disabled: boolean;
+    export const autofocus: boolean;
+    export const dbIndex: boolean;
+    export const customDefaultValue: string;
+    export const calculateValue: string;
+    export const calculateServer: boolean;
+    export const widget: null;
+    export const attributes: {};
+    export const validateOn: string;
+    export namespace validate {
+        export const required: boolean;
+        export const custom: string;
+        export const customPrivate: boolean;
+        export const strictDateValidation: boolean;
+        const multiple_1: boolean;
+        export { multiple_1 as multiple };
+        const unique_1: boolean;
+        export { unique_1 as unique };
+    }
+    export namespace conditional {
+        const show: null;
+        const when: null;
+        const eq: string;
+    }
+    export namespace overlay {
+        const style: string;
+        const left: string;
+        const top: string;
+        const width: string;
+        const height: string;
+    }
+    export const allowCalculateOverride: boolean;
+    export const encrypted: boolean;
+    export const showCharCount: boolean;
+    export const showWordCount: boolean;
+    export const properties: {};
+    export const allowMultipleMasks: boolean;
+    export const tree: boolean;
+    export const disableAddingRemovingRows: boolean;
+    export const removeRow: string;
+    export const defaultOpen: boolean;
+    export const openWhenEmpty: boolean;
+    export const modal: boolean;
+    export const inlineEdit: boolean;
+    export namespace templates {
+        const header: string;
+        const row: string;
+        const footer: string;
+    }
+    export const id: string;
+}
+export default _default;

package/lib/mjs/components/editgrid/fixtures/comp8.js

@@ -0,0 +1,154 @@
+export default {
+    label: 'HTML5',
+    tableView: false,
+    rowDrafts: false,
+    key: 'editGrid1',
+    type: 'editgrid',
+    input: true,
+    components: [
+        {
+            label: 'Make',
+            widget: 'choicesjs',
+            placeholder: 'Select your make',
+            tableView: true,
+            data: {
+                values: [
+                    {
+                        label: 'Chevy',
+                        value: 'chevy'
+                    },
+                    {
+                        value: 'honda',
+                        label: 'Honda'
+                    },
+                    {
+                        label: 'Ford',
+                        value: 'ford'
+                    },
+                    {
+                        label: 'Toyota',
+                        value: 'toyota'
+                    }
+                ]
+            },
+            selectThreshold: 0.3,
+            validate: {
+                required: true
+            },
+            key: 'make',
+            type: 'select',
+            indexeddb: {
+                filter: {}
+            },
+            input: true
+        },
+        {
+            label: 'Model',
+            widget: 'choicesjs',
+            placeholder: 'Select your model',
+            tableView: true,
+            dataSrc: 'url',
+            data: {
+                values: [
+                    {
+                        label: '',
+                        value: ''
+                    }
+                ],
+                url: 'https://vpic.nhtsa.dot.gov/api/vehicles/getmodelsformake/{{ row.make }}?format=json',
+                headers: [
+                    {
+                        key: '',
+                        value: ''
+                    }
+                ]
+            },
+            valueProperty: 'Model_Name',
+            template: '<span>{{ item.Model_Name }}</span>',
+            refreshOn: 'data',
+            clearOnRefresh: true,
+            selectThreshold: 0.3,
+            clearOnHide: false,
+            validate: {
+                required: true
+            },
+            key: 'model',
+            type: 'select',
+            indexeddb: {
+                filter: {}
+            },
+            selectValues: 'Results',
+            input: true,
+            disableLimit: false,
+            lazyLoad: false
+        }
+    ],
+    placeholder: '',
+    prefix: '',
+    customClass: '',
+    suffix: '',
+    multiple: false,
+    defaultValue: null,
+    protected: false,
+    unique: false,
+    persistent: true,
+    hidden: false,
+    clearOnHide: true,
+    refreshOn: '',
+    redrawOn: '',
+    modalEdit: false,
+    labelPosition: 'top',
+    description: '',
+    errorLabel: '',
+    tooltip: '',
+    hideLabel: false,
+    tabindex: '',
+    disabled: false,
+    autofocus: false,
+    dbIndex: false,
+    customDefaultValue: '',
+    calculateValue: '',
+    calculateServer: false,
+    widget: null,
+    attributes: {},
+    validateOn: 'change',
+    validate: {
+        required: false,
+        custom: '',
+        customPrivate: false,
+        strictDateValidation: false,
+        multiple: false,
+        unique: false
+    },
+    conditional: {
+        show: null,
+        when: null,
+        eq: ''
+    },
+    overlay: {
+        style: '',
+        left: '',
+        top: '',
+        width: '',
+        height: ''
+    },
+    allowCalculateOverride: false,
+    encrypted: false,
+    showCharCount: false,
+    showWordCount: false,
+    properties: {},
+    allowMultipleMasks: false,
+    tree: true,
+    disableAddingRemovingRows: false,
+    removeRow: 'Cancel',
+    defaultOpen: false,
+    openWhenEmpty: false,
+    modal: false,
+    inlineEdit: false,
+    templates: {
+        header: "<div class=\"row\">\n      {% util.eachComponent(components, function(component) { %}\n        {% if (!component.hasOwnProperty('tableView') || component.tableView) { %}\n          <div class=\"col-sm-2\">{{ component.label }}</div>\n        {% } %}\n      {% }) %}\n    </div>",
+        row: "<div class=\"row\">\n      {% util.eachComponent(components, function(component) { %}\n        {% if (!component.hasOwnProperty('tableView') || component.tableView) { %}\n          <div class=\"col-sm-2\">\n            {{ getView(component, row[component.key]) }}\n          </div>\n        {% } %}\n      {% }) %}\n      {% if (!instance.disabled) { %}\n        <div class=\"col-sm-2\">\n          <div class=\"btn-group pull-right\">\n            <button class=\"btn btn-default btn-light btn-sm editRow\"><i class=\"{{ iconClass('edit') }}\"></i></button>\n            {% if (!instance.hasRemoveButtons || instance.hasRemoveButtons()) { %}\n              <button class=\"btn btn-danger btn-sm removeRow\"><i class=\"{{ iconClass('trash') }}\"></i></button>\n            {% } %}\n          </div>\n        </div>\n      {% } %}\n    </div>",
+        footer: ''
+    },
+    id: 'e7p0y9a'
+};

package/lib/mjs/components/editgrid/fixtures/comp9.d.ts

@@ -0,0 +1,86 @@
+declare namespace _default {
+    const type: string;
+    const components: ({
+        label: string;
+        tableView: boolean;
+        rowDrafts: boolean;
+        key: string;
+        type: string;
+        input: boolean;
+        components: ({
+            label: string;
+            tableView: boolean;
+            key: string;
+            type: string;
+            input: boolean;
+            defaultValue?: undefined;
+            autoExpand?: undefined;
+            conditional?: undefined;
+            components?: undefined;
+        } | {
+            label: string;
+            tableView: boolean;
+            key: string;
+            type: string;
+            input: boolean;
+            defaultValue: boolean;
+            autoExpand?: undefined;
+            conditional?: undefined;
+            components?: undefined;
+        } | {
+            label: string;
+            autoExpand: boolean;
+            tableView: boolean;
+            key: string;
+            conditional: {
+                show: boolean;
+                when: string;
+                eq: string;
+            };
+            type: string;
+            input: boolean;
+            defaultValue?: undefined;
+            components?: undefined;
+        } | {
+            label: string;
+            tableView: boolean;
+            key: string;
+            conditional: {
+                show: boolean;
+                when: string;
+                eq: string;
+            };
+            type: string;
+            input: boolean;
+            components: {
+                label: string;
+                mask: boolean;
+                spellcheck: boolean;
+                tableView: boolean;
+                delimiter: boolean;
+                requireDecimal: boolean;
+                inputFormat: string;
+                key: string;
+                type: string;
+                input: boolean;
+            }[];
+            defaultValue?: undefined;
+            autoExpand?: undefined;
+        })[];
+        disableOnInvalid?: undefined;
+    } | {
+        type: string;
+        label: string;
+        key: string;
+        disableOnInvalid: boolean;
+        input: boolean;
+        tableView: boolean;
+        rowDrafts?: undefined;
+        components?: undefined;
+    })[];
+    const title: string;
+    const display: string;
+    const name: string;
+    const path: string;
+}
+export default _default;

package/lib/mjs/components/editgrid/fixtures/comp9.js

@@ -0,0 +1,60 @@
+export default {
+    type: 'form',
+    components: [
+        {
+            label: 'Edit Grid',
+            tableView: false,
+            rowDrafts: false,
+            key: 'editGrid',
+            type: 'editgrid',
+            input: true,
+            components: [
+                { label: 'Text Field', tableView: true, key: 'textField', type: 'textfield', input: true },
+                {
+                    label: 'Checkbox',
+                    tableView: true,
+                    key: 'checkbox',
+                    type: 'checkbox',
+                    input: true,
+                    defaultValue: false
+                },
+                {
+                    label: 'Text Area',
+                    autoExpand: false,
+                    tableView: true,
+                    key: 'textArea',
+                    conditional: { show: true, when: 'editGrid.checkbox', eq: 'true' },
+                    type: 'textarea',
+                    input: true
+                },
+                {
+                    label: 'Container',
+                    tableView: false,
+                    key: 'container',
+                    conditional: { show: true, when: 'editGrid.textField', eq: 'show' },
+                    type: 'container',
+                    input: true,
+                    components: [
+                        {
+                            label: 'Number',
+                            mask: false,
+                            spellcheck: true,
+                            tableView: true,
+                            delimiter: false,
+                            requireDecimal: false,
+                            inputFormat: 'plain',
+                            key: 'number1',
+                            type: 'number',
+                            input: true
+                        }
+                    ]
+                }
+            ]
+        },
+        { type: 'button', label: 'Submit', key: 'submit', disableOnInvalid: true, input: true, tableView: false }
+    ],
+    title: 'editGrid conditional',
+    display: 'form',
+    name: 'editGridConditional',
+    path: 'editgridconditional',
+};