@formio/js 5.1.0-dev.6026.7f60c92 → 5.1.0-dev.6026.929ea40

package/dist/formio.full.js

@@ -5424,7 +5424,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst WebformBuilder_1 = __importDefault(__webpack_require__(/*! ./WebformBuilder */ \"./lib/cjs/WebformBuilder.js\"));\nconst Webform_1 = __importDefault(__webpack_require__(/*! ./Webform */ \"./lib/cjs/Webform.js\"));\nconst builder_1 = __importDefault(__webpack_require__(/*! ./utils/builder */ \"./lib/cjs/utils/builder.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst utils_1 = __webpack_require__(/*! ./utils/utils */ \"./lib/cjs/utils/utils.js\");\nclass WizardBuilder extends WebformBuilder_1.default {\n    constructor() {\n        let element, options;\n        if (arguments[0] instanceof HTMLElement || arguments[1]) {\n            element = arguments[0];\n            options = arguments[1];\n        }\n        else {\n            options = arguments[0];\n        }\n        // Reset skipInit in case PDFBuilder has set it.\n        options.skipInit = false;\n        options.display = 'wizard';\n        super(element, options);\n        this._form = {\n            components: [\n                this.getPageConfig(1),\n            ],\n        };\n        this.page = 0;\n        // Need to create a component order for each group.\n        for (const group in this.groups) {\n            if (this.groups[group] && this.groups[group].components) {\n                this.groups[group].componentOrder = Object.keys(this.groups[group].components)\n                    .map(key => this.groups[group].components[key])\n                    .filter(component => component && !component.ignore)\n                    .sort((a, b) => a.weight - b.weight)\n                    .map(component => component.key);\n            }\n        }\n        const originalRenderComponentsHook = this.options.hooks.renderComponents;\n        this.options.hooks.renderComponents = (html, { components, self }) => {\n            if (self.type === 'form' && !self.root) {\n                return html;\n            }\n            else {\n                return originalRenderComponentsHook(html, { components, self });\n            }\n        };\n        const originalAttachComponentsHook = this.options.hooks.attachComponents;\n        this.options.hooks.attachComponents = (element, components, container, component) => {\n            if (component.type === 'form' && !component.root) {\n                return element;\n            }\n            return originalAttachComponentsHook(element, components, container, component);\n        };\n        // Wizard pages don't replace themselves in the right array. Do that here.\n        this.on('saveComponent', (component, originalComponent) => {\n            const webformComponents = this.webform.components.map(({ component }) => component);\n            if (this._form.components.includes(originalComponent)) {\n                this._form.components[this._form.components.indexOf(originalComponent)] = component;\n                this.rebuild();\n            }\n            else if (webformComponents.includes(originalComponent)) {\n                this._form.components.push(component);\n                this.rebuild();\n            }\n            else {\n                // Fallback to look for panel based on key.\n                const formComponentIndex = this._form.components.findIndex((comp) => originalComponent.key === comp.key);\n                if (formComponentIndex !== -1) {\n                    this._form.components[formComponentIndex] = component;\n                    this.rebuild();\n                }\n            }\n        }, true);\n    }\n    removeComponent(component, parent, original) {\n        const remove = super.removeComponent(component, parent, original);\n        // If user agrees to remove the whole group of the components and it could be a Wizard page, find it and remove\n        if (remove && component.type === 'panel') {\n            const pageIndex = this.pages.findIndex((page) => page.key === component.key);\n            const componentIndex = this._form.components.findIndex((comp) => comp.key === component.key);\n            if (pageIndex !== -1) {\n                this.removePage(pageIndex, componentIndex);\n            }\n        }\n        return remove;\n    }\n    allowDrop(element) {\n        return (this.webform && this.webform.refs && this.webform.refs.webform === element) ? false : true;\n    }\n    get pages() {\n        return lodash_1.default.filter(this._form.components, { type: 'panel' });\n    }\n    get currentPage() {\n        const pages = this.pages;\n        return (pages && (pages.length >= this.page)) ? pages[this.page] : null;\n    }\n    setForm(value) {\n        this._form = value;\n        if (!this._form.components || !Array.isArray(this._form.components)) {\n            this._form.components = [];\n        }\n        if (this.pages.length === 0) {\n            const components = this._form.components.filter((component) => component.type !== 'button');\n            this._form.components = [this.getPageConfig(1, components)];\n        }\n        else {\n            const components = this._form.components\n                .filter((component) => component.type !== 'button' || component.action !== 'submit');\n            this._form.components = components;\n        }\n        this.rebuild();\n    }\n    set form(value) {\n        this.setForm(value);\n    }\n    get form() {\n        return this._form;\n    }\n    get schema() {\n        lodash_1.default.assign(this.currentPage, this.webform._form.components[0]);\n        const webform = new Webform_1.default(this.options);\n        webform.setForm(this._form, { noEmit: true });\n        return webform.schema;\n    }\n    render() {\n        return this.renderTemplate('builderWizard', {\n            sidebar: this.renderTemplate('builderSidebar', {\n                scrollEnabled: this.sideBarScroll,\n                groupOrder: this.groupOrder,\n                groupId: `builder-sidebar-${this.id}`,\n                groups: this.groupOrder.map((groupKey) => this.renderTemplate('builderSidebarGroup', {\n                    group: this.groups[groupKey],\n                    groupKey,\n                    groupId: `builder-sidebar-${this.id}`,\n                    subgroups: this.groups[groupKey].subgroups.map((group) => this.renderTemplate('builderSidebarGroup', {\n                        group,\n                        groupKey: group.key,\n                        groupId: `group-container-${groupKey}`,\n                        subgroups: []\n                    })),\n                })),\n            }),\n            pages: this.pages,\n            form: this.webform.render(),\n        });\n    }\n    attach(element) {\n        this.loadRefs(element, {\n            addPage: 'multiple',\n            gotoPage: 'multiple',\n        });\n        this.refs.gotoPage.forEach((page, index) => {\n            page.parentNode.dragInfo = { index };\n        });\n        if (this.dragulaLib) {\n            this.navigationDragula = this.dragulaLib([this.element.querySelector('.wizard-pages')], {\n                moves: (el) => (!el.classList.contains('wizard-add-page')),\n                accepts: (el, target, source, sibling) => (sibling ? true : false),\n            })\n                .on('drop', this.onReorder.bind(this));\n        }\n        this.refs.addPage.forEach(link => {\n            this.addEventListener(link, 'click', (event) => {\n                event.preventDefault();\n                this.addPage();\n            });\n        });\n        this.refs.gotoPage.forEach((link, index) => {\n            this.addEventListener(link, 'click', (event) => {\n                event.preventDefault();\n                this.setPage(index);\n            });\n        });\n        return super.attach(element);\n    }\n    detach() {\n        if (this.navigationDragula) {\n            this.navigationDragula.destroy();\n        }\n        this.navigationDragula = null;\n        super.detach();\n    }\n    rebuild() {\n        var _a;\n        const page = this.currentPage;\n        this.webform.setForm({\n            display: 'form',\n            type: 'form',\n            components: page ? [page] : [],\n            controller: ((_a = this._form) === null || _a === void 0 ? void 0 : _a.controller) || ''\n        }, { keepAsReference: true });\n        return this.redraw();\n    }\n    addPage(page) {\n        const newPage = page && page.schema ? (0, utils_1.fastCloneDeep)(page.schema) : this.getPageConfig(this.pages.length + 1);\n        builder_1.default.uniquify(this._form.components, newPage);\n        this._form.components.push(newPage);\n        this.emitSaveComponentEvent(newPage, newPage, this._form, 'components', (this._form.components.length - 1), true, newPage);\n        this.emit('change', this._form);\n        return this.rebuild();\n    }\n    removePage(pageIndex, componentIndex) {\n        this._form.components.splice(componentIndex, 1);\n        this.emit('change', this._form);\n        if (pageIndex === this.pages.length) {\n            // If the last page is removed.\n            if (pageIndex === 0) {\n                this._form.components.push(this.getPageConfig(1));\n                return this.rebuild();\n            }\n            else {\n                return this.setPage(pageIndex - 1);\n            }\n        }\n        else {\n            return this.rebuild();\n        }\n    }\n    onReorder(element, _target, _source, sibling) {\n        const isSiblingAnAddPageButton = sibling === null || sibling === void 0 ? void 0 : sibling.classList.contains('wizard-add-page');\n        // We still can paste before Add Page button\n        if (!element.dragInfo || (sibling && !sibling.dragInfo && !isSiblingAnAddPageButton)) {\n            console.warn(this.t('noDragInfoError'));\n            return;\n        }\n        const oldPosition = element.dragInfo.index;\n        //should drop at next sibling position; no next sibling means drop to last position\n        const newPosition = (sibling && sibling.dragInfo ? sibling.dragInfo.index : this.pages.length);\n        const movedBelow = newPosition > oldPosition;\n        const formComponents = (0, utils_1.fastCloneDeep)(this._form.components);\n        const draggedRowData = this._form.components[oldPosition];\n        //insert element at new position\n        formComponents.splice(newPosition, 0, draggedRowData);\n        //remove element from old position (if was moved above, after insertion it's at +1 index)\n        formComponents.splice(movedBelow ? oldPosition : oldPosition + 1, 1);\n        this._form.components = (0, utils_1.fastCloneDeep)(formComponents);\n        return this.rebuild().then(() => {\n            this.emit('change', this._form);\n        });\n    }\n    setPage(index) {\n        if (index === this.page) {\n            return;\n        }\n        this.page = index;\n        return this.rebuild();\n    }\n    getPageConfig(index, components = []) {\n        return {\n            title: `Page ${index}`,\n            label: `Page ${index}`,\n            type: 'panel',\n            key: `page${index}`,\n            components,\n        };\n    }\n    pasteComponent(component) {\n        if (component instanceof WizardBuilder) {\n            return;\n        }\n        if (!window.sessionStorage) {\n            return console.warn(this.t('sessionStorageSupportError'));\n        }\n        const isWizardPageCopied = window.sessionStorage.getItem('formio.isWizardPageCopied') === 'true' ? true : false;\n        if (isWizardPageCopied) {\n            const data = window.sessionStorage.getItem('formio.clipboard');\n            if (data) {\n                const schema = JSON.parse(data);\n                if (schema.type !== 'panel') {\n                    window.sessionStorage.setItem('formio.isWizardPageCopied', 'false');\n                    return super.pasteComponent(component);\n                }\n                this.addPage(schema);\n            }\n        }\n        else {\n            return super.pasteComponent(component);\n        }\n    }\n    copyComponent(component) {\n        super.copyComponent(component);\n        if (window.sessionStorage) {\n            const isWizardPageCopied = this._form.components.indexOf(comp => lodash_1.default.isEqual(component.component, comp)) !== -1;\n            window.sessionStorage.setItem('formio.isWizardPageCopied', isWizardPageCopied.toString());\n        }\n    }\n}\nexports[\"default\"] = WizardBuilder;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/WizardBuilder.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst WebformBuilder_1 = __importDefault(__webpack_require__(/*! ./WebformBuilder */ \"./lib/cjs/WebformBuilder.js\"));\nconst Webform_1 = __importDefault(__webpack_require__(/*! ./Webform */ \"./lib/cjs/Webform.js\"));\nconst builder_1 = __importDefault(__webpack_require__(/*! ./utils/builder */ \"./lib/cjs/utils/builder.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst utils_1 = __webpack_require__(/*! ./utils/utils */ \"./lib/cjs/utils/utils.js\");\nclass WizardBuilder extends WebformBuilder_1.default {\n    constructor() {\n        let element, options;\n        if (arguments[0] instanceof HTMLElement || arguments[1]) {\n            element = arguments[0];\n            options = arguments[1];\n        }\n        else {\n            options = arguments[0];\n        }\n        // Reset skipInit in case PDFBuilder has set it.\n        options.skipInit = false;\n        options.display = 'wizard';\n        super(element, options);\n        this._form = {\n            components: [\n                this.getPageConfig(1),\n            ],\n        };\n        this.page = 0;\n        // Need to create a component order for each group.\n        for (const group in this.groups) {\n            if (this.groups[group] && this.groups[group].components) {\n                this.groups[group].componentOrder = Object.keys(this.groups[group].components)\n                    .map(key => this.groups[group].components[key])\n                    .filter(component => component && !component.ignore)\n                    .sort((a, b) => a.weight - b.weight)\n                    .map(component => component.key);\n            }\n        }\n        const originalRenderComponentsHook = this.options.hooks.renderComponents;\n        this.options.hooks.renderComponents = (html, { components, self }) => {\n            if (self.type === 'form' && !self.root) {\n                return html;\n            }\n            else {\n                return originalRenderComponentsHook(html, { components, self });\n            }\n        };\n        const originalAttachComponentsHook = this.options.hooks.attachComponents;\n        this.options.hooks.attachComponents = (element, components, container, component) => {\n            if (component.type === 'form' && !component.root) {\n                return element;\n            }\n            return originalAttachComponentsHook(element, components, container, component);\n        };\n        // Wizard pages don't replace themselves in the right array. Do that here.\n        this.on('saveComponent', (component, originalComponent) => {\n            const webformComponents = this.webform.components.map(({ component }) => component);\n            if (this._form.components.includes(originalComponent)) {\n                this._form.components[this._form.components.indexOf(originalComponent)] = component;\n                this.rebuild();\n            }\n            else if (webformComponents.includes(originalComponent)) {\n                this._form.components.push(component);\n                this.rebuild();\n            }\n            else {\n                // Fallback to look for panel based on key.\n                const formComponentIndex = this._form.components.findIndex((comp) => originalComponent.key === comp.key);\n                if (formComponentIndex !== -1) {\n                    this._form.components[formComponentIndex] = component;\n                    this.rebuild();\n                }\n            }\n        }, true);\n    }\n    removeComponent(component, parent, original) {\n        const remove = super.removeComponent(component, parent, original);\n        // If user agrees to remove the whole group of the components and it could be a Wizard page, find it and remove\n        if (remove && component.type === 'panel') {\n            const pageIndex = this.pages.findIndex((page) => page.key === component.key);\n            const componentIndex = this._form.components.findIndex((comp) => comp.key === component.key);\n            if (pageIndex !== -1) {\n                this.removePage(pageIndex, componentIndex);\n            }\n        }\n        return remove;\n    }\n    allowDrop(element) {\n        return (this.webform && this.webform.refs && this.webform.refs.webform === element) ? false : true;\n    }\n    get pages() {\n        return lodash_1.default.filter(this._form.components, { type: 'panel' });\n    }\n    get currentPage() {\n        const pages = this.pages;\n        return (pages && (pages.length >= this.page)) ? pages[this.page] : null;\n    }\n    setForm(value) {\n        this._form = value;\n        if (!this._form.components || !Array.isArray(this._form.components)) {\n            this._form.components = [];\n        }\n        if (this.pages.length === 0) {\n            const components = this._form.components.filter((component) => component.type !== 'button');\n            this._form.components = [this.getPageConfig(1, components)];\n        }\n        else {\n            const components = this._form.components\n                .filter((component) => component.type !== 'button' || component.action !== 'submit');\n            this._form.components = components;\n        }\n        this.rebuild();\n    }\n    set form(value) {\n        this.setForm(value);\n    }\n    get form() {\n        return this._form;\n    }\n    get schema() {\n        lodash_1.default.assign(this.currentPage, this.webform._form.components[0]);\n        const webform = new Webform_1.default(this.options);\n        webform.setForm(this._form, { noEmit: true });\n        return webform.schema;\n    }\n    render() {\n        return this.renderTemplate('builderWizard', {\n            sidebar: this.renderTemplate('builderSidebar', {\n                scrollEnabled: this.sideBarScroll,\n                groupOrder: this.groupOrder,\n                groupId: `builder-sidebar-${this.id}`,\n                groups: this.groupOrder.map((groupKey) => this.renderTemplate('builderSidebarGroup', {\n                    group: this.groups[groupKey],\n                    groupKey,\n                    groupId: `builder-sidebar-${this.id}`,\n                    subgroups: this.groups[groupKey].subgroups.map((group) => this.renderTemplate('builderSidebarGroup', {\n                        group,\n                        groupKey: group.key,\n                        groupId: `group-container-${groupKey}`,\n                        subgroups: []\n                    })),\n                })),\n            }),\n            pages: this.pages,\n            form: this.webform.render(),\n        });\n    }\n    attach(element) {\n        this.loadRefs(element, {\n            addPage: 'multiple',\n            gotoPage: 'multiple',\n        });\n        this.refs.gotoPage.forEach((page, index) => {\n            page.parentNode.dragInfo = { index };\n        });\n        if (this.dragulaLib) {\n            this.navigationDragula = this.dragulaLib([this.element.querySelector('.wizard-pages')], {\n                moves: (el) => (!el.classList.contains('wizard-add-page')),\n                accepts: (el, target, source, sibling) => (sibling ? true : false),\n            })\n                .on('drop', this.onReorder.bind(this));\n        }\n        this.refs.addPage.forEach(link => {\n            this.addEventListener(link, 'click', (event) => {\n                event.preventDefault();\n                this.addPage();\n            });\n        });\n        this.refs.gotoPage.forEach((link, index) => {\n            this.addEventListener(link, 'click', (event) => {\n                event.preventDefault();\n                this.setPage(index);\n            });\n        });\n        return super.attach(element);\n    }\n    detach() {\n        if (this.navigationDragula) {\n            this.navigationDragula.destroy();\n        }\n        this.navigationDragula = null;\n        super.detach();\n    }\n    rebuild() {\n        var _a;\n        const page = this.currentPage;\n        this.webform.setForm({\n            display: 'form',\n            type: 'form',\n            components: page ? [page] : [],\n            controller: ((_a = this._form) === null || _a === void 0 ? void 0 : _a.controller) || ''\n        }, { keepAsReference: true });\n        return this.redraw();\n    }\n    addPage(page) {\n        const newPage = page && page.schema ? (0, utils_1.fastCloneDeep)(page.schema) : this.getPageConfig(this.pages.length + 1);\n        builder_1.default.uniquify(this._form.components, newPage);\n        this._form.components.push(newPage);\n        this.emitSaveComponentEvent(newPage, newPage, this._form, 'components', (this._form.components.length - 1), true, newPage);\n        this.emit('change', this._form);\n        return this.rebuild();\n    }\n    removePage(pageIndex, componentIndex) {\n        this._form.components.splice(componentIndex, 1);\n        this.emit('change', this._form);\n        if (pageIndex === this.pages.length) {\n            // If the last page is removed.\n            if (pageIndex === 0) {\n                this._form.components.push(this.getPageConfig(1));\n                return this.rebuild();\n            }\n            else {\n                return this.setPage(pageIndex - 1);\n            }\n        }\n        else {\n            return this.rebuild();\n        }\n    }\n    onReorder(element, _target, _source, sibling) {\n        const isSiblingAnAddPageButton = sibling === null || sibling === void 0 ? void 0 : sibling.classList.contains('wizard-add-page');\n        // We still can paste before Add Page button\n        if (!element.dragInfo || (sibling && !sibling.dragInfo && !isSiblingAnAddPageButton)) {\n            console.warn(this.t('noDragInfoError'));\n            return;\n        }\n        const oldPosition = element.dragInfo.index;\n        //should drop at next sibling position; no next sibling means drop to last position\n        const newPosition = (sibling && sibling.dragInfo ? sibling.dragInfo.index : this.pages.length);\n        const movedBelow = newPosition > oldPosition;\n        const formComponents = (0, utils_1.fastCloneDeep)(this._form.components);\n        const draggedRowData = this._form.components[oldPosition];\n        //insert element at new position\n        formComponents.splice(newPosition, 0, draggedRowData);\n        //remove element from old position (if was moved above, after insertion it's at +1 index)\n        formComponents.splice(movedBelow ? oldPosition : oldPosition + 1, 1);\n        this._form.components = (0, utils_1.fastCloneDeep)(formComponents);\n        return this.rebuild().then(() => {\n            this.emit('change', this._form);\n        });\n    }\n    setPage(index) {\n        if (index === this.page) {\n            return;\n        }\n        this.page = index;\n        return this.rebuild();\n    }\n    getPageConfig(index, components = []) {\n        return {\n            title: `Page ${index}`,\n            label: `Page ${index}`,\n            type: 'panel',\n            key: `page${index}`,\n            components,\n        };\n    }\n    pasteComponent(component) {\n        if (component instanceof WizardBuilder) {\n            return;\n        }\n        if (!window.sessionStorage) {\n            return console.warn(this.t('sessionStorageSupportError'));\n        }\n        const isWizardPageCopied = window.sessionStorage.getItem('formio.isWizardPageCopied') === 'true' ? true : false;\n        if (isWizardPageCopied) {\n            const data = window.sessionStorage.getItem('formio.clipboard');\n            if (data) {\n                const schema = JSON.parse(data);\n                this.addPage(schema);\n            }\n        }\n        else {\n            return super.pasteComponent(component);\n        }\n    }\n    copyComponent(component) {\n        super.copyComponent(component);\n        if (window.sessionStorage) {\n            const isWizardPageCopied = this._form.components.indexOf(comp => lodash_1.default.isEqual(component.component, comp)) !== -1;\n            window.sessionStorage.setItem('formio.isWizardPageCopied', isWizardPageCopied.toString());\n        }\n    }\n}\nexports[\"default\"] = WizardBuilder;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/WizardBuilder.js?");
 
 /***/ }),