@formio/js 5.0.0-rc.25 → 5.0.0-rc.27
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/formio.builder.css +10 -0
- package/dist/formio.builder.min.css +1 -1
- package/dist/formio.embed.css +1 -1
- package/dist/formio.embed.js +1 -1
- package/dist/formio.embed.min.css +1 -1
- package/dist/formio.embed.min.js +1 -1
- package/dist/formio.embed.min.js.LICENSE.txt +1 -1
- package/dist/formio.form.css +10 -0
- package/dist/formio.form.js +2 -2
- package/dist/formio.form.min.css +1 -1
- package/dist/formio.form.min.js +1 -1
- package/dist/formio.form.min.js.LICENSE.txt +1 -1
- package/dist/formio.full.css +10 -0
- package/dist/formio.full.js +2 -2
- package/dist/formio.full.min.css +1 -1
- package/dist/formio.full.min.js +1 -1
- package/dist/formio.full.min.js.LICENSE.txt +1 -1
- package/dist/formio.js +1 -1
- package/dist/formio.min.js +1 -1
- package/dist/formio.min.js.LICENSE.txt +1 -1
- package/dist/formio.utils.min.js.LICENSE.txt +1 -1
- package/lib/cjs/Embed.d.ts +26 -6
- package/lib/cjs/Embed.js +91 -37
- package/lib/cjs/Wizard.js +8 -9
- package/lib/cjs/formio.embed.js +1 -0
- package/lib/mjs/Embed.d.ts +26 -6
- package/lib/mjs/Embed.js +88 -38
- package/lib/mjs/Wizard.js +8 -9
- package/lib/mjs/formio.embed.js +1 -0
- package/package.json +2 -1
@@ -19,7 +19,7 @@
|
|
19
19
|
|
20
20
|
/*! @license DOMPurify 3.0.5 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.0.5/LICENSE */
|
21
21
|
|
22
|
-
/*! formiojs v5.0.0-rc.
|
22
|
+
/*! formiojs v5.0.0-rc.27 | https://unpkg.com/formiojs@5.0.0-rc.27/LICENSE.txt */
|
23
23
|
|
24
24
|
/**
|
25
25
|
* @license
|
package/dist/formio.full.css
CHANGED
@@ -2074,6 +2074,16 @@ url("./fonts/bootstrap-icons.woff?1fa40e8900654d2863d011707b9fb6f2") format("wof
|
|
2074
2074
|
animation: spin 2s linear infinite;
|
2075
2075
|
}
|
2076
2076
|
|
2077
|
+
.alert-success {
|
2078
|
+
position: relative;
|
2079
|
+
padding: 1rem;
|
2080
|
+
margin-bottom: 1rem;
|
2081
|
+
color: #0a3622;
|
2082
|
+
background-color: #d1e7dd;
|
2083
|
+
border: #a3cfbb;
|
2084
|
+
border-radius: 0.375rem;
|
2085
|
+
}
|
2086
|
+
|
2077
2087
|
@keyframes spin {
|
2078
2088
|
0% {
|
2079
2089
|
transform: rotate(0deg);
|
package/dist/formio.full.js
CHANGED
@@ -5346,7 +5346,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
|
|
5346
5346
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
5347
5347
|
|
5348
5348
|
"use strict";
|
5349
|
-
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst Webform_1 = __importDefault(__webpack_require__(/*! ./Webform */ \"./lib/cjs/Webform.js\"));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst utils_1 = __webpack_require__(/*! ./utils/utils */ \"./lib/cjs/utils/utils.js\");\nclass Wizard extends Webform_1.default {\n /**\n * Constructor for wizard based forms\n * @param element Dom element to place this wizard.\n * @param {Object} options Options object, supported options are:\n * - breadcrumbSettings.clickable: true (default) determines if the breadcrumb bar is clickable or not\n * - buttonSettings.show*(Previous, Next, Cancel): true (default) determines if the button is shown or not\n * - allowPrevious: false (default) determines if the breadcrumb bar is clickable or not for visited tabs\n */\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 options.display = 'wizard';\n super(element, options);\n this.pages = [];\n this.prefixComps = [];\n this.suffixComps = [];\n this.components = [];\n this.originalComponents = [];\n this.page = 0;\n this.currentPanel = null;\n this.currentPanels = null;\n this.currentNextPage = 0;\n this._seenPages = [0];\n this.subWizards = [];\n this.allPages = [];\n this.lastPromise = Promise.resolve();\n this.enabledIndex = 0;\n this.editMode = false;\n this.originalOptions = lodash_1.default.cloneDeep(this.options);\n }\n isLastPage() {\n const next = this.getNextPage();\n if (lodash_1.default.isNumber(next)) {\n return next === -1;\n }\n return lodash_1.default.isNull(next);\n }\n getPages(args = {}) {\n const { all = false } = args;\n const pages = this.hasExtraPages ? this.components : this.pages;\n const filteredPages = pages\n .filter(all ? lodash_1.default.identity : (p, index) => this._seenPages.includes(index));\n return filteredPages;\n }\n get hasExtraPages() {\n return !lodash_1.default.isEmpty(this.subWizards);\n }\n get data() {\n return super.data;\n }\n get localData() {\n var _a, _b;\n return ((_b = (_a = this.pages[this.page]) === null || _a === void 0 ? void 0 : _a.root) === null || _b === void 0 ? void 0 : _b.submission.data) || this.submission.data;\n }\n checkConditions(data, flags, row) {\n const visible = super.checkConditions(data, flags, row);\n this.establishPages(data);\n return visible;\n }\n set data(value) {\n this._data = value;\n lodash_1.default.each(this.getPages({ all: true }), (component) => {\n component.data = this.componentContext(component);\n });\n }\n getComponents() {\n return this.submitting\n ? this.getPages({ all: this.isLastPage() })\n : super.getComponents();\n }\n resetValue() {\n this.getPages({ all: true }).forEach((page) => page.resetValue());\n this.setPristine(true);\n }\n init() {\n var _a, _b, _c;\n // Check for and initlize button settings object\n this.options.buttonSettings = lodash_1.default.defaults(this.options.buttonSettings, {\n showPrevious: true,\n showNext: true,\n showSubmit: true,\n showCancel: !this.options.readOnly\n });\n if (!this.isSecondInit) {\n this.isClickableDefined = (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.breadcrumbSettings) === null || _b === void 0 ? void 0 : _b.hasOwnProperty('clickable');\n this.isSecondInit = true;\n }\n this.options.breadcrumbSettings = lodash_1.default.defaults(this.options.breadcrumbSettings, {\n clickable: true\n });\n this.options.allowPrevious = this.options.allowPrevious || false;\n this.page = 0;\n const onReady = super.init();\n this.setComponentSchema();\n if ((_c = this.pages) === null || _c === void 0 ? void 0 : _c[this.page]) {\n this.component = this.pages[this.page].component;\n }\n this.on('subWizardsUpdated', (subForm) => {\n const subWizard = this.subWizards.find(subWizard => { var _a; return (subForm === null || subForm === void 0 ? void 0 : subForm.id) && ((_a = subWizard.subForm) === null || _a === void 0 ? void 0 : _a.id) === (subForm === null || subForm === void 0 ? void 0 : subForm.id); });\n if (this.subWizards.length && subWizard) {\n subWizard.subForm.setValue(subForm._submission, {}, true);\n this.establishPages();\n this.redraw();\n }\n });\n return onReady;\n }\n get wizardKey() {\n return `wizard-${this.id}`;\n }\n get wizard() {\n return this.form;\n }\n set wizard(form) {\n this.setForm(form);\n }\n get buttons() {\n const buttons = {};\n [\n { name: 'cancel', method: 'cancel' },\n { name: 'previous', method: 'prevPage' },\n { name: 'next', method: 'nextPage' },\n { name: 'submit', method: 'submit' }\n ].forEach((button) => {\n if (this.hasButton(button.name)) {\n buttons[button.name] = button;\n }\n });\n return buttons;\n }\n get buttonOrder() {\n var _a, _b, _c;\n const defaultButtonOrder = [\n 'cancel',\n 'previous',\n 'next',\n 'submit'\n ];\n return (_c = (_b = (_a = this.options.properties) === null || _a === void 0 ? void 0 : _a.wizardButtonOrder) === null || _b === void 0 ? void 0 : _b.toLowerCase().split(', ')) !== null && _c !== void 0 ? _c : defaultButtonOrder;\n }\n get renderContext() {\n var _a, _b;\n return {\n disableWizardSubmit: this.form.disableWizardSubmit,\n wizardKey: this.wizardKey,\n isBreadcrumbClickable: this.isBreadcrumbClickable(),\n isSubForm: !!this.parent && !((_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.type) === 'wizard',\n panels: this.allPages.length ? this.allPages.map(page => page.component) : this.pages.map(page => page.component),\n buttons: this.buttons,\n currentPage: this.page,\n buttonOrder: this.buttonOrder,\n };\n }\n prepareNavigationSettings(ctx) {\n const currentPanel = this.currentPanel;\n if (currentPanel && currentPanel.buttonSettings) {\n Object.keys(currentPanel.buttonSettings).forEach(() => {\n Object.keys(ctx.buttons).forEach(key => {\n if (typeof currentPanel.buttonSettings[key] !== 'undefined' && !currentPanel.buttonSettings[key] || ctx.isSubForm) {\n ctx.buttons[key] = null;\n }\n });\n });\n }\n return this.renderTemplate('wizardNav', ctx);\n }\n prepareHeaderSettings(ctx, headerType) {\n if (this.currentPanel && this.currentPanel.breadcrumb === 'none' || ctx.isSubForm) {\n return null;\n }\n return this.renderTemplate(headerType, ctx);\n }\n render() {\n const ctx = this.renderContext;\n if (this.component.key) {\n ctx.panels.map(panel => {\n if (panel.key === this.component.key) {\n this.currentPanel = panel;\n ctx.wizardPageTooltip = this.getFormattedTooltip(panel.tooltip);\n }\n });\n }\n const wizardNav = this.prepareNavigationSettings(ctx);\n const wizardHeaderType = `wizardHeader${lodash_1.default.get(this.form, 'settings.wizardHeaderType', '')}`;\n const wizardHeaderLocation = lodash_1.default.get(this.form, 'settings.wizardHeaderLocation', 'left');\n const wizardHeader = this.prepareHeaderSettings(ctx, wizardHeaderType);\n return this.renderTemplate('wizard', Object.assign(Object.assign({}, ctx), { className: super.getClassName(), wizardHeader,\n wizardHeaderType,\n wizardHeaderLocation,\n wizardNav, components: this.renderComponents([\n ...this.prefixComps,\n ...this.currentPage.components,\n ...this.suffixComps\n ]) }), this.builderMode ? 'builder' : 'form');\n }\n redrawNavigation() {\n if (this.element) {\n let navElement = this.element.querySelector(`#${this.wizardKey}-nav`);\n if (navElement) {\n this.detachNav();\n navElement.outerHTML = this.renderTemplate('wizardNav', this.renderContext);\n navElement = this.element.querySelector(`#${this.wizardKey}-nav`);\n this.loadRefs(navElement, {\n [`${this.wizardKey}-cancel`]: 'single',\n [`${this.wizardKey}-previous`]: 'single',\n [`${this.wizardKey}-next`]: 'single',\n [`${this.wizardKey}-submit`]: 'single',\n });\n this.attachNav();\n }\n }\n }\n redrawHeader() {\n if (this.element) {\n let headerElement = this.element.querySelector(`#${this.wizardKey}-header`);\n if (headerElement) {\n this.detachHeader();\n headerElement.outerHTML = this.renderTemplate(`wizardHeader${lodash_1.default.get(this.form, 'settings.wizardHeaderType', '')}`, this.renderContext);\n headerElement = this.element.querySelector(`#${this.wizardKey}-header`);\n this.loadRefs(headerElement, {\n [`${this.wizardKey}-link`]: 'multiple',\n [`${this.wizardKey}-tooltip`]: 'multiple'\n });\n this.attachHeader();\n }\n }\n }\n attach(element) {\n var _a;\n this.setElement(element);\n this.loadRefs(element, {\n [this.wizardKey]: 'single',\n [`${this.wizardKey}-header`]: 'single',\n [`${this.wizardKey}-cancel`]: 'single',\n [`${this.wizardKey}-previous`]: 'single',\n [`${this.wizardKey}-next`]: 'single',\n [`${this.wizardKey}-submit`]: 'single',\n [`${this.wizardKey}-link`]: 'multiple',\n [`${this.wizardKey}-tooltip`]: 'multiple'\n });\n if ((this.options.readOnly || this.editMode) && !this.enabledIndex) {\n this.enabledIndex = ((_a = this.pages) === null || _a === void 0 ? void 0 : _a.length) - 1;\n }\n this.hook('attachWebform', element, this);\n const promises = this.attachComponents(this.refs[this.wizardKey], [\n ...this.prefixComps,\n ...this.currentPage.components,\n ...this.suffixComps,\n ]);\n this.attachNav();\n this.attachHeader();\n return promises.then(() => {\n this.emit('render', { component: this.currentPage, page: this.page });\n if (this.component.scrollToTop) {\n this.scrollPageToTop();\n }\n });\n }\n scrollPageToTop() {\n var _a;\n const pageTop = (_a = this.refs[`${this.wizardKey}-header`]) !== null && _a !== void 0 ? _a : this.refs[this.wizardKey];\n if (!pageTop) {\n return;\n }\n if ('scrollIntoView' in pageTop) {\n pageTop.scrollIntoView(true);\n }\n else {\n this.scrollIntoView(pageTop);\n }\n }\n isBreadcrumbClickable() {\n let currentPage = null;\n this.pages.map(page => {\n if (lodash_1.default.isEqual(this.currentPage.component, page.component)) {\n currentPage = page;\n }\n });\n return this.isClickableDefined ? this.options.breadcrumbSettings.clickable : lodash_1.default.get(currentPage, 'component.breadcrumbClickable', true);\n }\n isAllowPrevious() {\n let currentPage = null;\n this.pages.map(page => {\n if (lodash_1.default.isEqual(this.currentPage.component, page.component)) {\n currentPage = page;\n }\n });\n return lodash_1.default.get(currentPage.component, 'allowPrevious', this.options.allowPrevious);\n }\n handleNaviageteOnEnter(event) {\n if (event.keyCode === 13) {\n const clickEvent = new CustomEvent('click');\n const buttonElement = this.refs[`${this.wizardKey}-${this.buttons.next.name}`];\n if (buttonElement) {\n buttonElement.dispatchEvent(clickEvent);\n }\n }\n }\n handleSaveOnEnter(event) {\n if (event.keyCode === 13) {\n const clickEvent = new CustomEvent('click');\n const buttonElement = this.refs[`${this.wizardKey}-${this.buttons.submit.name}`];\n if (buttonElement) {\n buttonElement.dispatchEvent(clickEvent);\n }\n }\n }\n attachNav() {\n if (this.component.navigateOnEnter) {\n this.addEventListener(document, 'keyup', this.handleNaviageteOnEnter.bind(this));\n }\n if (this.component.saveOnEnter) {\n this.addEventListener(document, 'keyup', this.handleSaveOnEnter.bind(this));\n }\n lodash_1.default.each(this.buttons, (button) => {\n const buttonElement = this.refs[`${this.wizardKey}-${button.name}`];\n this.addEventListener(buttonElement, 'click', (event) => {\n event.preventDefault();\n // Disable the button until done.\n buttonElement.setAttribute('disabled', 'disabled');\n this.setLoading(buttonElement, true);\n // Call the button method, then re-enable the button.\n this[button.method]().then(() => {\n buttonElement.removeAttribute('disabled');\n this.setLoading(buttonElement, false);\n }).catch(() => {\n buttonElement.removeAttribute('disabled');\n this.setLoading(buttonElement, false);\n });\n });\n });\n }\n emitWizardPageSelected(index) {\n this.emit('wizardPageSelected', this.pages[index], index);\n }\n attachHeader() {\n var _a;\n const isAllowPrevious = this.isAllowPrevious();\n this.attachTooltips(this.refs[`${this.wizardKey}-tooltip`], this.currentPanel.tooltip);\n if (this.isBreadcrumbClickable() || isAllowPrevious) {\n (_a = this.refs[`${this.wizardKey}-link`]) === null || _a === void 0 ? void 0 : _a.forEach((link, index) => {\n if (!isAllowPrevious || index <= this.enabledIndex) {\n this.addEventListener(link, 'click', (event) => {\n this.emit('wizardNavigationClicked', this.pages[index]);\n event.preventDefault();\n return this.setPage(index).then(() => {\n this.emitWizardPageSelected(index);\n });\n });\n }\n });\n }\n }\n detachNav() {\n if (this.component.navigateOnEnter) {\n this.removeEventListener(document, 'keyup', this.handleNaviageteOnEnter.bind(this));\n }\n if (this.component.saveOnEnter) {\n this.removeEventListener(document, 'keyup', this.handleSaveOnEnter.bind(this));\n }\n lodash_1.default.each(this.buttons, (button) => {\n this.removeEventListener(this.refs[`${this.wizardKey}-${button.name}`], 'click');\n });\n }\n detachHeader() {\n if (this.refs[`${this.wizardKey}-link`]) {\n this.refs[`${this.wizardKey}-link`].forEach((link) => {\n this.removeEventListener(link, 'click');\n });\n }\n }\n transformPages() {\n const allComponents = [];\n const components = this.getSortedComponents(this);\n let defferedComponents = [];\n this.allPages = [];\n // Get all components including all nested components and line up in the correct order\n const getAllComponents = (nestedComp, compsArr, pushAllowed = true) => {\n const nestedPages = [];\n const dataArrayComponents = ['datagrid', 'editgrid', 'dynamicWizard'];\n const currentComponents = (nestedComp === null || nestedComp === void 0 ? void 0 : nestedComp.subForm) ? this.getSortedComponents(nestedComp.subForm) : (nestedComp === null || nestedComp === void 0 ? void 0 : nestedComp.components) || [];\n const visibleComponents = currentComponents.filter(comp => comp._visible);\n const filteredComponents = visibleComponents.filter(comp => !dataArrayComponents.includes(comp.component.type) && (comp.type !== 'form' || comp.isNestedWizard));\n const additionalComponents = currentComponents.filter(comp => { var _a; return ((_a = comp.subForm) === null || _a === void 0 ? void 0 : _a._form.display) !== 'wizard'; });\n let hasNested = false;\n (0, utils_1.eachComponent)(filteredComponents, (comp) => {\n if (comp && comp.component) {\n if (comp.component.type === 'panel' && (comp === null || comp === void 0 ? void 0 : comp.parent.wizard) && !getAllComponents(comp, compsArr, false)) {\n if (pushAllowed) {\n this.setRootPanelId(comp);\n nestedPages.push(comp);\n }\n hasNested = true;\n }\n if (comp.isNestedWizard && comp.subForm) {\n const hasNestedForm = getAllComponents(comp, nestedPages, pushAllowed);\n if (!hasNested) {\n hasNested = hasNestedForm;\n }\n }\n }\n }, true);\n if (nestedComp.component.type === 'panel') {\n if (!hasNested && pushAllowed) {\n this.setRootPanelId(nestedComp);\n compsArr.push(nestedComp);\n }\n if (hasNested && additionalComponents.length) {\n const newComp = lodash_1.default.clone(nestedComp);\n newComp.components = additionalComponents;\n this.setRootPanelId(newComp);\n defferedComponents.push(newComp);\n }\n }\n if (pushAllowed) {\n compsArr.push(...defferedComponents, ...nestedPages);\n defferedComponents = [];\n }\n return hasNested;\n };\n components.forEach((component) => {\n if (component.visible) {\n getAllComponents(component, allComponents);\n }\n }, []);\n // recalculate pages only for root wizards, including the situation when the wizard is in a wrapper\n if (this.localRoot && this.id === this.localRoot.id) {\n allComponents.forEach((comp, index) => {\n comp.eachComponent((component) => {\n component.page = index;\n });\n });\n }\n this.allPages = allComponents;\n }\n getSortedComponents({ components, originalComponents }) {\n const currentComponents = [];\n const currentPages = [];\n if (components && components.length) {\n components.map(page => {\n if (page.component.type === 'panel') {\n currentPages[page.component.key || page.component.title] = page;\n }\n });\n }\n originalComponents === null || originalComponents === void 0 ? void 0 : originalComponents.forEach((item) => {\n if (!item.key) {\n item.key = item.title;\n }\n if (currentPages[item.key]) {\n currentComponents.push(currentPages[item.key]);\n }\n });\n return currentComponents;\n }\n findRootPanel(component) {\n var _a;\n return ((_a = component.parent) === null || _a === void 0 ? void 0 : _a.parent) ? this.findRootPanel(component.parent) : component;\n }\n setRootPanelId(component) {\n var _a;\n if (component.rootPanelId && component.rootPanelId !== component.id) {\n return;\n }\n const parent = ((_a = component.parent) === null || _a === void 0 ? void 0 : _a.parent) ? this.findRootPanel(component.parent) : component;\n component.rootPanelId = parent.id;\n }\n establishPages(data = this.data) {\n this.pages = [];\n this.prefixComps = [];\n this.suffixComps = [];\n const visible = [];\n const currentPages = {};\n const pageOptions = Object.assign(Object.assign({}, (lodash_1.default.clone(this.options))), (this.parent ? { root: this } : {}));\n if (this.components && this.components.length) {\n this.components.forEach(page => {\n if (page.component.type === 'panel') {\n currentPages[page.component.key || page.component.title] = page;\n }\n });\n }\n if (this.originalComponents) {\n this.originalComponents.forEach((item) => {\n if (item.type === 'panel') {\n if (!item.key) {\n item.key = item.title;\n }\n let page = currentPages[item.key];\n const forceShow = this.shouldForceShow(item);\n const forceHide = this.shouldForceHide(item);\n let isVisible = !page\n ? (0, utils_1.checkCondition)(item, data, data, this.component, this) && !item.hidden\n : page.visible;\n if (forceShow) {\n isVisible = true;\n }\n else if (forceHide) {\n isVisible = false;\n }\n if (isVisible) {\n visible.push(item);\n if (page) {\n this.pages.push(page);\n }\n }\n if (!page && isVisible) {\n page = this.createComponent(item, pageOptions);\n page.visible = isVisible;\n this.pages.push(page);\n page.eachComponent((component) => {\n component.page = (this.pages.length - 1);\n });\n }\n }\n else if (item.type !== 'button') {\n if (!this.pages.length) {\n this.prefixComps.push(this.createComponent(item, pageOptions));\n }\n else {\n this.suffixComps.push(this.createComponent(item, pageOptions));\n }\n }\n });\n }\n if (this.pages.length) {\n this.emit('pagesChanged');\n }\n this.transformPages();\n if (this.allPages && this.allPages.length) {\n this.updatePages();\n }\n return visible;\n }\n updatePages() {\n this.pages = this.allPages;\n }\n addComponents() {\n this.establishPages();\n }\n setPage(num) {\n if (num === this.page) {\n return Promise.resolve();\n }\n if (num >= 0 && num < this.pages.length) {\n this.page = num;\n this.pageFieldLogic(num);\n this.getNextPage();\n let parentNum = num;\n if (this.hasExtraPages) {\n const pageFromPages = this.pages[num];\n const pageFromComponents = this.components[num];\n if (!pageFromComponents || (pageFromPages === null || pageFromPages === void 0 ? void 0 : pageFromPages.id) !== pageFromComponents.id) {\n parentNum = this.components.findIndex(comp => {\n var _a, _b;\n return comp.id === ((_b = (_a = this.pages) === null || _a === void 0 ? void 0 : _a[parentNum]) === null || _b === void 0 ? void 0 : _b.rootPanelId);\n });\n }\n }\n if (!this._seenPages.includes(parentNum)) {\n this._seenPages = this._seenPages.concat(parentNum);\n }\n this.redraw().then(() => {\n this.checkData(this.submission.data);\n });\n return Promise.resolve();\n }\n else if (!this.pages.length) {\n this.redraw();\n return Promise.resolve();\n }\n return Promise.reject('Page not found');\n }\n pageFieldLogic(page) {\n var _a;\n if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[page]) {\n // Handle field logic on pages.\n this.component = this.pages[page].component;\n this.originalComponent = (0, utils_1.fastCloneDeep)(this.component);\n this.fieldLogic(this.data);\n // If disabled changed, be sure to distribute the setting.\n this.disabled = this.shouldDisabled;\n }\n }\n get currentPage() {\n return (this.pages && (this.pages.length >= this.page)) ? this.pages[this.page] : { components: [] };\n }\n getNextPage() {\n var _a;\n if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[this.page]) {\n const data = this.submission.data;\n const form = this.pages[this.page].component;\n // Check conditional nextPage\n if (form) {\n const page = this.pages.length > (this.page + 1) && !this.showAllErrors ? this.page + 1 : -1;\n if (form.nextPage) {\n const next = this.evaluate(form.nextPage, {\n next: page,\n data,\n page,\n form\n }, 'next');\n if (next === null) {\n this.currentNextPage = null;\n return null;\n }\n const pageNum = parseInt(next, 10);\n if (!isNaN(parseInt(pageNum, 10)) && isFinite(pageNum)) {\n this.currentNextPage = pageNum;\n return pageNum;\n }\n this.currentNextPage = this.getPageIndexByKey(next);\n return this.currentNextPage;\n }\n this.currentNextPage = page;\n return page;\n }\n this.currentNextPage = null;\n }\n return null;\n }\n getPreviousPage() {\n return this.page - 1;\n }\n beforeSubmit() {\n const pages = this.getPages();\n return Promise.all(pages.map((page) => {\n page.options.beforeSubmit = true;\n return page.beforeSubmit();\n }));\n }\n beforePage(next) {\n return new Promise((resolve, reject) => {\n this.hook(next ? 'beforeNext' : 'beforePrev', this.currentPage, this.submission, (err) => {\n if (err) {\n this.showErrors(err, true);\n reject(err);\n }\n const form = this.currentPage;\n if (form) {\n form.beforePage(next).then(resolve).catch(reject);\n }\n else {\n resolve();\n }\n });\n });\n }\n emitNextPage() {\n this.emit('nextPage', { page: this.page, submission: this.submission });\n }\n nextPage() {\n // Read-only forms should not worry about validation before going to next page, nor should they submit.\n if (this.options.readOnly) {\n return this.beforePage(true).then(() => {\n return this.setPage(this.getNextPage()).then(() => {\n this.emitNextPage();\n });\n });\n }\n // Validate the form, before go to the next page\n if (this.checkValidity(this.localData, true, this.localData, true)) {\n this.checkData(this.submission.data);\n return this.beforePage(true).then(() => {\n return this.setPage(this.getNextPage()).then(() => {\n if (!(this.options.readOnly || this.editMode) && this.enabledIndex < this.page) {\n this.enabledIndex = this.page;\n this.redraw();\n }\n this.emitNextPage();\n });\n });\n }\n else {\n this.currentPage.components.forEach((comp) => comp.setPristine(false));\n this.scrollIntoView(this.element);\n return Promise.reject(this.showErrors([], true));\n }\n }\n emitPrevPage() {\n this.emit('prevPage', { page: this.page, submission: this.submission });\n }\n prevPage() {\n return this.beforePage().then(() => {\n return this.setPage(this.getPreviousPage()).then(() => {\n this.emitPrevPage();\n });\n });\n }\n cancel(noconfirm) {\n if (this.options.readOnly) {\n return Promise.resolve();\n }\n if (super.cancel(noconfirm)) {\n this.setPristine(true);\n return this.setPage(0).then(() => {\n if (this.enabledIndex) {\n this.enabledIndex = 0;\n }\n this.onChange();\n this.redraw();\n return this.page;\n });\n }\n return Promise.resolve();\n }\n getPageIndexByKey(key) {\n let pageIndex = this.page;\n this.pages.forEach((page, index) => {\n if (page.component.key === key) {\n pageIndex = index;\n return false;\n }\n });\n return pageIndex;\n }\n get schema() {\n return this.wizard;\n }\n setComponentSchema() {\n const pageKeys = {};\n this.originalComponents = [];\n this.component.components.map((item) => {\n if (item.type === 'panel') {\n item.key = (0, utils_1.uniqueKey)(pageKeys, (item.key || 'panel'));\n pageKeys[item.key] = true;\n if (this.wizard.full) {\n this.options.show = this.options.show || {};\n this.options.show[item.key] = true;\n }\n else if (this.wizard.hasOwnProperty('full') && !lodash_1.default.isEqual(this.originalOptions.show, this.options.show)) {\n this.options.show = Object.assign({}, (this.originalOptions.show || {}));\n }\n }\n this.originalComponents.push(lodash_1.default.clone(item));\n });\n if (!Object.keys(pageKeys).length) {\n const newPage = {\n type: 'panel',\n title: 'Page 1',\n label: 'Page 1',\n key: 'page1',\n components: this.component.components\n };\n this.component.components = [newPage];\n this.originalComponents.push(lodash_1.default.clone(newPage));\n }\n }\n setForm(form, flags) {\n if (!form) {\n return;\n }\n return super.setForm(form, flags);\n }\n onSetForm(clonedForm, initialForm) {\n this.component.components = (this._parentPath ? initialForm.components : clonedForm.components) || [];\n this.setComponentSchema();\n }\n setEditMode(submission) {\n if (!this.editMode && submission._id && !this.options.readOnly) {\n this.editMode = true;\n this.redraw();\n }\n }\n setValue(submission, flags = {}, ignoreEstablishment) {\n this._submission = submission;\n if ((flags && flags.fromSubmission && (this.options.readOnly || this.editMode) && !this.isHtmlRenderMode()) ||\n (flags && flags.fromSubmission && (this.prefixComps.length || this.suffixComps.length) && submission._id) ||\n (this.options.server && (this.prefixComps.length || this.suffixComps.length))) {\n this._data = submission.data;\n }\n if (!ignoreEstablishment) {\n this.establishPages(submission.data);\n }\n const changed = this.getPages({ all: true }).reduce((changed, page) => {\n return this.setNestedValue(page, submission.data, flags, changed) || changed;\n }, false);\n if (changed) {\n this.pageFieldLogic(this.page);\n }\n this.setEditMode(submission);\n return changed;\n }\n isClickable(page, index) {\n return this.page !== index && (0, utils_1.firstNonNil)([\n lodash_1.default.get(page, 'breadcrumbClickable'),\n this.options.breadcrumbSettings.clickable\n ]);\n }\n hasButton(name, nextPage = this.getNextPage()) {\n // get page options with global options as default values\n const { previous = this.options.buttonSettings.showPrevious, cancel = this.options.buttonSettings.showCancel, submit = this.options.buttonSettings.showSubmit, next = this.options.buttonSettings.showNext } = lodash_1.default.get(this.currentPage, 'component.buttonSettings', {});\n switch (name) {\n case 'previous':\n return previous && (this.getPreviousPage() > -1);\n case 'next':\n return next && (nextPage !== null) && (nextPage !== -1);\n case 'cancel':\n return cancel && !this.options.readOnly;\n case 'submit':\n return submit && !this.options.readOnly && ((nextPage === null) || (this.page === (this.pages.length - 1)));\n default:\n return true;\n }\n }\n pageId(page) {\n if (page.key) {\n // Some panels have the same key....\n return `${page.key}-${page.title}`;\n }\n else if (page.components &&\n page.components.length > 0) {\n return this.pageId(page.components[0]);\n }\n else {\n return page.title;\n }\n }\n onChange(flags, changed, modified, changes) {\n var _a, _b;\n super.onChange(flags, changed, modified, changes);\n if (this.alert && !this.submitted) {\n this.checkValidity(this.localData, false, this.localData, true);\n this.showErrors([], true, true);\n }\n // If the pages change, need to redraw the header.\n let currentPanels;\n let panels;\n const currentNextPage = this.currentNextPage;\n if (this.hasExtraPages) {\n currentPanels = this.pages.map(page => page.component.key);\n this.establishPages();\n panels = this.pages.map(page => page.component.key);\n }\n else {\n currentPanels = this.currentPanels || this.pages.map(page => page.component.key);\n panels = this.establishPages().map(panel => panel.key);\n this.currentPanels = panels;\n if (((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.key) && ((_b = this.currentPanels) === null || _b === void 0 ? void 0 : _b.length)) {\n this.setPage(this.currentPanels.findIndex(panel => panel === this.currentPanel.key));\n }\n }\n if (!lodash_1.default.isEqual(panels, currentPanels) || (flags && flags.fromSubmission)) {\n this.redrawHeader();\n }\n // If the next page changes, then make sure to redraw navigation.\n if (currentNextPage !== this.getNextPage()) {\n this.redrawNavigation();\n }\n if (this.options.readOnly && (this.prefixComps.length || this.suffixComps.length)) {\n this.redraw();\n }\n }\n redraw() {\n var _a, _b;\n if ((_b = (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.modalEdit) {\n return this.parent.redraw();\n }\n return super.redraw();\n }\n checkValidity(data, dirty, row, currentPageOnly) {\n if (!this.checkCondition(row, data)) {\n this.setCustomValidity('');\n return true;\n }\n const components = !currentPageOnly || this.isLastPage()\n ? this.getComponents()\n : this.currentPage.components;\n return components.reduce((check, comp) => comp.checkValidity(data, dirty, row) && check, true);\n }\n get errors() {\n if (!this.isLastPage()) {\n return this.currentPage.errors;\n }\n return super.errors;\n }\n focusOnComponent(key) {\n let pageIndex = 0;\n const [page] = this.pages.filter((page, index) => {\n let hasComponent = false;\n page.getComponent(key, (comp) => {\n if (comp.path === key) {\n pageIndex = index;\n hasComponent = true;\n }\n });\n return hasComponent;\n });\n if (page && page !== this.currentPage) {\n return this.setPage(pageIndex).then(() => {\n this.checkValidity(this.submission.data, true, this.submission.data);\n this.showErrors();\n super.focusOnComponent(key);\n });\n }\n return super.focusOnComponent(key);\n }\n}\nexports[\"default\"] = Wizard;\nWizard.setBaseUrl = Formio_1.Formio.setBaseUrl;\nWizard.setApiUrl = Formio_1.Formio.setApiUrl;\nWizard.setAppUrl = Formio_1.Formio.setAppUrl;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Wizard.js?");
|
5349
|
+
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst Webform_1 = __importDefault(__webpack_require__(/*! ./Webform */ \"./lib/cjs/Webform.js\"));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst utils_1 = __webpack_require__(/*! ./utils/utils */ \"./lib/cjs/utils/utils.js\");\nclass Wizard extends Webform_1.default {\n /**\n * Constructor for wizard based forms\n * @param element Dom element to place this wizard.\n * @param {Object} options Options object, supported options are:\n * - breadcrumbSettings.clickable: true (default) determines if the breadcrumb bar is clickable or not\n * - buttonSettings.show*(Previous, Next, Cancel): true (default) determines if the button is shown or not\n * - allowPrevious: false (default) determines if the breadcrumb bar is clickable or not for visited tabs\n */\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 options.display = 'wizard';\n super(element, options);\n this.pages = [];\n this.prefixComps = [];\n this.suffixComps = [];\n this.components = [];\n this.originalComponents = [];\n this.page = 0;\n this.currentPanel = null;\n this.currentPanels = null;\n this.currentNextPage = 0;\n this._seenPages = [0];\n this.subWizards = [];\n this.allPages = [];\n this.lastPromise = Promise.resolve();\n this.enabledIndex = 0;\n this.editMode = false;\n this.originalOptions = lodash_1.default.cloneDeep(this.options);\n }\n isLastPage() {\n const next = this.getNextPage();\n if (lodash_1.default.isNumber(next)) {\n return next === -1;\n }\n return lodash_1.default.isNull(next);\n }\n getPages(args = {}) {\n const { all = false } = args;\n const pages = this.hasExtraPages ? this.components : this.pages;\n const filteredPages = pages\n .filter(all ? lodash_1.default.identity : (p, index) => this._seenPages.includes(index));\n return filteredPages;\n }\n get hasExtraPages() {\n return !lodash_1.default.isEmpty(this.subWizards);\n }\n get data() {\n return super.data;\n }\n get localData() {\n var _a, _b;\n return ((_b = (_a = this.pages[this.page]) === null || _a === void 0 ? void 0 : _a.root) === null || _b === void 0 ? void 0 : _b.submission.data) || this.submission.data;\n }\n checkConditions(data, flags, row) {\n const visible = super.checkConditions(data, flags, row);\n this.establishPages(data);\n return visible;\n }\n set data(value) {\n this._data = value;\n lodash_1.default.each(this.getPages({ all: true }), (component) => {\n component.data = this.componentContext(component);\n });\n }\n getComponents() {\n return this.submitting\n ? this.getPages({ all: this.isLastPage() })\n : super.getComponents();\n }\n resetValue() {\n this.getPages({ all: true }).forEach((page) => page.resetValue());\n this.setPristine(true);\n }\n init() {\n var _a, _b, _c;\n // Check for and initlize button settings object\n this.options.buttonSettings = lodash_1.default.defaults(this.options.buttonSettings, {\n showPrevious: true,\n showNext: true,\n showSubmit: true,\n showCancel: !this.options.readOnly\n });\n if (!this.isSecondInit) {\n this.isClickableDefined = (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.breadcrumbSettings) === null || _b === void 0 ? void 0 : _b.hasOwnProperty('clickable');\n this.isSecondInit = true;\n }\n this.options.breadcrumbSettings = lodash_1.default.defaults(this.options.breadcrumbSettings, {\n clickable: true\n });\n this.options.allowPrevious = this.options.allowPrevious || false;\n this.page = 0;\n const onReady = super.init();\n this.setComponentSchema();\n if ((_c = this.pages) === null || _c === void 0 ? void 0 : _c[this.page]) {\n this.component = this.pages[this.page].component;\n }\n this.on('subWizardsUpdated', (subForm) => {\n const subWizard = this.subWizards.find(subWizard => { var _a; return (subForm === null || subForm === void 0 ? void 0 : subForm.id) && ((_a = subWizard.subForm) === null || _a === void 0 ? void 0 : _a.id) === (subForm === null || subForm === void 0 ? void 0 : subForm.id); });\n if (this.subWizards.length && subWizard) {\n subWizard.subForm.setValue(subForm._submission, {}, true);\n this.establishPages();\n this.redraw();\n }\n });\n return onReady;\n }\n get wizardKey() {\n return `wizard-${this.id}`;\n }\n get wizard() {\n return this.form;\n }\n set wizard(form) {\n this.setForm(form);\n }\n get buttons() {\n const buttons = {};\n [\n { name: 'cancel', method: 'cancel' },\n { name: 'previous', method: 'prevPage' },\n { name: 'next', method: 'nextPage' },\n { name: 'submit', method: 'submit' }\n ].forEach((button) => {\n if (this.hasButton(button.name)) {\n buttons[button.name] = button;\n }\n });\n return buttons;\n }\n get buttonOrder() {\n var _a, _b, _c;\n const defaultButtonOrder = [\n 'cancel',\n 'previous',\n 'next',\n 'submit'\n ];\n return (_c = (_b = (_a = this.options.properties) === null || _a === void 0 ? void 0 : _a.wizardButtonOrder) === null || _b === void 0 ? void 0 : _b.toLowerCase().split(', ')) !== null && _c !== void 0 ? _c : defaultButtonOrder;\n }\n get renderContext() {\n var _a, _b;\n return {\n disableWizardSubmit: this.form.disableWizardSubmit,\n wizardKey: this.wizardKey,\n isBreadcrumbClickable: this.isBreadcrumbClickable(),\n isSubForm: !!this.parent && !((_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.type) === 'wizard',\n panels: this.allPages.length ? this.allPages.map(page => page.component) : this.pages.map(page => page.component),\n buttons: this.buttons,\n currentPage: this.page,\n buttonOrder: this.buttonOrder,\n };\n }\n prepareNavigationSettings(ctx) {\n const currentPanel = this.currentPanel;\n if (currentPanel && currentPanel.buttonSettings) {\n Object.keys(currentPanel.buttonSettings).forEach(() => {\n Object.keys(ctx.buttons).forEach(key => {\n if (typeof currentPanel.buttonSettings[key] !== 'undefined' && !currentPanel.buttonSettings[key] || ctx.isSubForm) {\n ctx.buttons[key] = null;\n }\n });\n });\n }\n return this.renderTemplate('wizardNav', ctx);\n }\n prepareHeaderSettings(ctx, headerType) {\n if (this.currentPanel && this.currentPanel.breadcrumb === 'none' || ctx.isSubForm) {\n return null;\n }\n return this.renderTemplate(headerType, ctx);\n }\n render() {\n const ctx = this.renderContext;\n if (this.component.key) {\n ctx.panels.map(panel => {\n if (panel.key === this.component.key) {\n this.currentPanel = panel;\n ctx.wizardPageTooltip = this.getFormattedTooltip(panel.tooltip);\n }\n });\n }\n const wizardNav = this.prepareNavigationSettings(ctx);\n const wizardHeaderType = `wizardHeader${lodash_1.default.get(this.form, 'settings.wizardHeaderType', '')}`;\n const wizardHeaderLocation = lodash_1.default.get(this.form, 'settings.wizardHeaderLocation', 'left');\n const wizardHeader = this.prepareHeaderSettings(ctx, wizardHeaderType);\n return this.renderTemplate('wizard', Object.assign(Object.assign({}, ctx), { className: super.getClassName(), wizardHeader,\n wizardHeaderType,\n wizardHeaderLocation,\n wizardNav, components: this.renderComponents([\n ...this.prefixComps,\n ...this.currentPage.components,\n ...this.suffixComps\n ]) }), this.builderMode ? 'builder' : 'form');\n }\n redrawNavigation() {\n if (this.element) {\n let navElement = this.element.querySelector(`#${this.wizardKey}-nav`);\n if (navElement) {\n this.detachNav();\n navElement.outerHTML = this.renderTemplate('wizardNav', this.renderContext);\n navElement = this.element.querySelector(`#${this.wizardKey}-nav`);\n this.loadRefs(navElement, {\n [`${this.wizardKey}-cancel`]: 'single',\n [`${this.wizardKey}-previous`]: 'single',\n [`${this.wizardKey}-next`]: 'single',\n [`${this.wizardKey}-submit`]: 'single',\n });\n this.attachNav();\n }\n }\n }\n redrawHeader() {\n if (this.element) {\n let headerElement = this.element.querySelector(`#${this.wizardKey}-header`);\n if (headerElement) {\n this.detachHeader();\n headerElement.outerHTML = this.renderTemplate(`wizardHeader${lodash_1.default.get(this.form, 'settings.wizardHeaderType', '')}`, this.renderContext);\n headerElement = this.element.querySelector(`#${this.wizardKey}-header`);\n this.loadRefs(headerElement, {\n [`${this.wizardKey}-link`]: 'multiple',\n [`${this.wizardKey}-tooltip`]: 'multiple'\n });\n this.attachHeader();\n }\n }\n }\n attach(element) {\n var _a;\n this.setElement(element);\n this.loadRefs(element, {\n [this.wizardKey]: 'single',\n [`${this.wizardKey}-header`]: 'single',\n [`${this.wizardKey}-cancel`]: 'single',\n [`${this.wizardKey}-previous`]: 'single',\n [`${this.wizardKey}-next`]: 'single',\n [`${this.wizardKey}-submit`]: 'single',\n [`${this.wizardKey}-link`]: 'multiple',\n [`${this.wizardKey}-tooltip`]: 'multiple'\n });\n if ((this.options.readOnly || this.editMode) && !this.enabledIndex) {\n this.enabledIndex = ((_a = this.pages) === null || _a === void 0 ? void 0 : _a.length) - 1;\n }\n this.hook('attachWebform', element, this);\n const promises = this.attachComponents(this.refs[this.wizardKey], [\n ...this.prefixComps,\n ...this.currentPage.components,\n ...this.suffixComps,\n ]);\n this.attachNav();\n this.attachHeader();\n return promises.then(() => {\n this.emit('render', { component: this.currentPage, page: this.page });\n if (this.component.scrollToTop) {\n this.scrollPageToTop();\n }\n });\n }\n scrollPageToTop() {\n var _a;\n const pageTop = (_a = this.refs[`${this.wizardKey}-header`]) !== null && _a !== void 0 ? _a : this.refs[this.wizardKey];\n if (!pageTop) {\n return;\n }\n if ('scrollIntoView' in pageTop) {\n pageTop.scrollIntoView(true);\n }\n else {\n this.scrollIntoView(pageTop);\n }\n }\n isBreadcrumbClickable() {\n let currentPage = null;\n this.pages.map(page => {\n if (lodash_1.default.isEqual(this.currentPage.component, page.component)) {\n currentPage = page;\n }\n });\n return this.isClickableDefined ? this.options.breadcrumbSettings.clickable : lodash_1.default.get(currentPage, 'component.breadcrumbClickable', true);\n }\n isAllowPrevious() {\n let currentPage = null;\n this.pages.map(page => {\n if (lodash_1.default.isEqual(this.currentPage.component, page.component)) {\n currentPage = page;\n }\n });\n return lodash_1.default.get(currentPage.component, 'allowPrevious', this.options.allowPrevious);\n }\n handleNaviageteOnEnter(event) {\n if (event.keyCode === 13) {\n const clickEvent = new CustomEvent('click');\n const buttonElement = this.refs[`${this.wizardKey}-${this.buttons.next.name}`];\n if (buttonElement) {\n buttonElement.dispatchEvent(clickEvent);\n }\n }\n }\n handleSaveOnEnter(event) {\n if (event.keyCode === 13) {\n const clickEvent = new CustomEvent('click');\n const buttonElement = this.refs[`${this.wizardKey}-${this.buttons.submit.name}`];\n if (buttonElement) {\n buttonElement.dispatchEvent(clickEvent);\n }\n }\n }\n attachNav() {\n if (this.component.navigateOnEnter) {\n this.addEventListener(document, 'keyup', this.handleNaviageteOnEnter.bind(this));\n }\n if (this.component.saveOnEnter) {\n this.addEventListener(document, 'keyup', this.handleSaveOnEnter.bind(this));\n }\n lodash_1.default.each(this.buttons, (button) => {\n const buttonElement = this.refs[`${this.wizardKey}-${button.name}`];\n this.addEventListener(buttonElement, 'click', (event) => {\n event.preventDefault();\n // Disable the button until done.\n buttonElement.setAttribute('disabled', 'disabled');\n this.setLoading(buttonElement, true);\n // Call the button method, then re-enable the button.\n this[button.method]().then(() => {\n buttonElement.removeAttribute('disabled');\n this.setLoading(buttonElement, false);\n }).catch(() => {\n buttonElement.removeAttribute('disabled');\n this.setLoading(buttonElement, false);\n });\n });\n });\n }\n emitWizardPageSelected(index) {\n this.emit('wizardPageSelected', this.pages[index], index);\n }\n attachHeader() {\n var _a;\n const isAllowPrevious = this.isAllowPrevious();\n this.attachTooltips(this.refs[`${this.wizardKey}-tooltip`], this.currentPanel.tooltip);\n if (this.isBreadcrumbClickable() || isAllowPrevious) {\n (_a = this.refs[`${this.wizardKey}-link`]) === null || _a === void 0 ? void 0 : _a.forEach((link, index) => {\n if (!isAllowPrevious || index <= this.enabledIndex) {\n this.addEventListener(link, 'click', (event) => {\n this.emit('wizardNavigationClicked', this.pages[index]);\n event.preventDefault();\n return this.setPage(index).then(() => {\n this.emitWizardPageSelected(index);\n });\n });\n }\n });\n }\n }\n detachNav() {\n if (this.component.navigateOnEnter) {\n this.removeEventListener(document, 'keyup', this.handleNaviageteOnEnter.bind(this));\n }\n if (this.component.saveOnEnter) {\n this.removeEventListener(document, 'keyup', this.handleSaveOnEnter.bind(this));\n }\n lodash_1.default.each(this.buttons, (button) => {\n this.removeEventListener(this.refs[`${this.wizardKey}-${button.name}`], 'click');\n });\n }\n detachHeader() {\n if (this.refs[`${this.wizardKey}-link`]) {\n this.refs[`${this.wizardKey}-link`].forEach((link) => {\n this.removeEventListener(link, 'click');\n });\n }\n }\n transformPages() {\n const allComponents = [];\n const components = this.getSortedComponents(this);\n let defferedComponents = [];\n this.allPages = [];\n // Get all components including all nested components and line up in the correct order\n const getAllComponents = (nestedComp, compsArr, pushAllowed = true) => {\n const nestedPages = [];\n const dataArrayComponents = ['datagrid', 'editgrid', 'dynamicWizard'];\n const currentComponents = (nestedComp === null || nestedComp === void 0 ? void 0 : nestedComp.subForm) ? this.getSortedComponents(nestedComp.subForm) : (nestedComp === null || nestedComp === void 0 ? void 0 : nestedComp.components) || [];\n const visibleComponents = currentComponents.filter(comp => comp._visible);\n const filteredComponents = visibleComponents.filter(comp => !dataArrayComponents.includes(comp.component.type) && (comp.type !== 'form' || comp.isNestedWizard));\n const additionalComponents = currentComponents.filter(comp => { var _a; return ((_a = comp.subForm) === null || _a === void 0 ? void 0 : _a._form.display) !== 'wizard'; });\n let hasNested = false;\n (0, utils_1.eachComponent)(filteredComponents, (comp) => {\n if (comp && comp.component) {\n if (comp.component.type === 'panel' && (comp === null || comp === void 0 ? void 0 : comp.parent.wizard) && !getAllComponents(comp, compsArr, false)) {\n if (pushAllowed) {\n this.setRootPanelId(comp);\n nestedPages.push(comp);\n }\n hasNested = true;\n }\n if (comp.isNestedWizard && comp.subForm) {\n const hasNestedForm = getAllComponents(comp, nestedPages, pushAllowed);\n if (!hasNested) {\n hasNested = hasNestedForm;\n }\n }\n }\n }, true);\n if (nestedComp.component.type === 'panel') {\n if (!hasNested && pushAllowed) {\n this.setRootPanelId(nestedComp);\n compsArr.push(nestedComp);\n }\n if (hasNested && additionalComponents.length) {\n const newComp = lodash_1.default.clone(nestedComp);\n newComp.components = additionalComponents;\n this.setRootPanelId(newComp);\n defferedComponents.push(newComp);\n }\n }\n if (pushAllowed) {\n compsArr.push(...defferedComponents, ...nestedPages);\n defferedComponents = [];\n }\n return hasNested;\n };\n components.forEach((component) => {\n if (component.visible) {\n getAllComponents(component, allComponents);\n }\n }, []);\n // recalculate pages only for root wizards, including the situation when the wizard is in a wrapper\n if (this.localRoot && this.id === this.localRoot.id) {\n allComponents.forEach((comp, index) => {\n comp.eachComponent((component) => {\n component.page = index;\n });\n });\n }\n this.allPages = allComponents;\n }\n getSortedComponents({ components, originalComponents }) {\n const currentComponents = [];\n const currentPages = [];\n if (components && components.length) {\n components.map(page => {\n if (page.component.type === 'panel') {\n currentPages[page.component.key || page.component.title] = page;\n }\n });\n }\n originalComponents === null || originalComponents === void 0 ? void 0 : originalComponents.forEach((item) => {\n if (!item.key) {\n item.key = item.title;\n }\n if (currentPages[item.key]) {\n currentComponents.push(currentPages[item.key]);\n }\n });\n return currentComponents;\n }\n findRootPanel(component) {\n var _a;\n return ((_a = component.parent) === null || _a === void 0 ? void 0 : _a.parent) ? this.findRootPanel(component.parent) : component;\n }\n setRootPanelId(component) {\n var _a;\n if (component.rootPanelId && component.rootPanelId !== component.id) {\n return;\n }\n const parent = ((_a = component.parent) === null || _a === void 0 ? void 0 : _a.parent) ? this.findRootPanel(component.parent) : component;\n component.rootPanelId = parent.id;\n }\n establishPages(data = this.data) {\n this.pages = [];\n this.prefixComps = [];\n this.suffixComps = [];\n const visible = [];\n const currentPages = {};\n const pageOptions = Object.assign(Object.assign({}, (lodash_1.default.clone(this.options))), (this.parent ? { root: this } : {}));\n if (this.components && this.components.length) {\n this.components.forEach(page => {\n if (page.component.type === 'panel') {\n currentPages[page.component.key || page.component.title] = page;\n }\n });\n }\n if (this.originalComponents) {\n this.originalComponents.forEach((item) => {\n if (item.type === 'panel') {\n if (!item.key) {\n item.key = item.title;\n }\n let page = currentPages[item.key];\n const forceShow = this.shouldForceShow(item);\n const forceHide = this.shouldForceHide(item);\n let isVisible = !page\n ? (0, utils_1.checkCondition)(item, data, data, this.component, this) && !item.hidden\n : page.visible;\n if (forceShow) {\n isVisible = true;\n }\n else if (forceHide) {\n isVisible = false;\n }\n if (isVisible) {\n visible.push(item);\n if (page) {\n this.pages.push(page);\n }\n }\n if (!page && isVisible) {\n page = this.createComponent(item, pageOptions);\n page.visible = isVisible;\n this.pages.push(page);\n page.eachComponent((component) => {\n component.page = (this.pages.length - 1);\n });\n }\n }\n else if (item.type !== 'button') {\n if (!this.pages.length) {\n this.prefixComps.push(this.createComponent(item, pageOptions));\n }\n else {\n this.suffixComps.push(this.createComponent(item, pageOptions));\n }\n }\n });\n }\n if (this.pages.length) {\n this.emit('pagesChanged');\n }\n this.transformPages();\n if (this.allPages && this.allPages.length) {\n this.updatePages();\n }\n return visible;\n }\n updatePages() {\n this.pages = this.allPages;\n }\n addComponents() {\n this.establishPages();\n }\n setPage(num) {\n if (num === this.page) {\n return Promise.resolve();\n }\n if (num >= 0 && num < this.pages.length) {\n this.page = num;\n this.pageFieldLogic(num);\n this.getNextPage();\n let parentNum = num;\n if (this.hasExtraPages) {\n const pageFromPages = this.pages[num];\n const pageFromComponents = this.components[num];\n if (!pageFromComponents || (pageFromPages === null || pageFromPages === void 0 ? void 0 : pageFromPages.id) !== pageFromComponents.id) {\n parentNum = this.components.findIndex(comp => {\n var _a, _b;\n return comp.id === ((_b = (_a = this.pages) === null || _a === void 0 ? void 0 : _a[parentNum]) === null || _b === void 0 ? void 0 : _b.rootPanelId);\n });\n }\n }\n if (!this._seenPages.includes(parentNum)) {\n this._seenPages = this._seenPages.concat(parentNum);\n }\n this.redraw().then(() => {\n this.checkData(this.submission.data);\n });\n return Promise.resolve();\n }\n else if (!this.pages.length) {\n this.redraw();\n return Promise.resolve();\n }\n return Promise.reject('Page not found');\n }\n pageFieldLogic(page) {\n var _a;\n if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[page]) {\n // Handle field logic on pages.\n this.component = this.pages[page].component;\n this.originalComponent = (0, utils_1.fastCloneDeep)(this.component);\n this.fieldLogic(this.data);\n // If disabled changed, be sure to distribute the setting.\n this.disabled = this.shouldDisabled;\n }\n }\n get currentPage() {\n return (this.pages && (this.pages.length >= this.page)) ? this.pages[this.page] : { components: [] };\n }\n getNextPage() {\n var _a;\n if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[this.page]) {\n const data = this.submission.data;\n const form = this.pages[this.page].component;\n // Check conditional nextPage\n if (form) {\n const page = this.pages.length > (this.page + 1) && !this.showAllErrors ? this.page + 1 : -1;\n if (form.nextPage) {\n const next = this.evaluate(form.nextPage, {\n next: page,\n data,\n page,\n form\n }, 'next');\n if (next === null) {\n this.currentNextPage = null;\n return null;\n }\n const pageNum = parseInt(next, 10);\n if (!isNaN(parseInt(pageNum, 10)) && isFinite(pageNum)) {\n this.currentNextPage = pageNum;\n return pageNum;\n }\n this.currentNextPage = this.getPageIndexByKey(next);\n return this.currentNextPage;\n }\n this.currentNextPage = page;\n return page;\n }\n this.currentNextPage = null;\n }\n return null;\n }\n getPreviousPage() {\n return this.page - 1;\n }\n beforeSubmit() {\n const pages = this.getPages();\n return Promise.all(pages.map((page) => {\n page.options.beforeSubmit = true;\n return page.beforeSubmit();\n }));\n }\n beforePage(next) {\n return new Promise((resolve, reject) => {\n this.hook(next ? 'beforeNext' : 'beforePrev', this.currentPage, this.submission, (err) => {\n if (err) {\n this.showErrors(err, true);\n reject(err);\n }\n const form = this.currentPage;\n if (form) {\n form.beforePage(next).then(resolve).catch(reject);\n }\n else {\n resolve();\n }\n });\n });\n }\n emitNextPage() {\n this.emit('nextPage', { page: this.page, submission: this.submission });\n }\n nextPage() {\n // Read-only forms should not worry about validation before going to next page, nor should they submit.\n if (this.options.readOnly) {\n return this.beforePage(true).then(() => {\n return this.setPage(this.getNextPage()).then(() => {\n this.emitNextPage();\n });\n });\n }\n // Validate the form, before go to the next page\n if (this.checkValidity(this.localData, true, this.localData, true)) {\n this.checkData(this.submission.data);\n return this.beforePage(true).then(() => {\n return this.setPage(this.getNextPage()).then(() => {\n if (!(this.options.readOnly || this.editMode) && this.enabledIndex < this.page) {\n this.enabledIndex = this.page;\n this.redraw();\n }\n this.emitNextPage();\n });\n });\n }\n else {\n this.currentPage.components.forEach((comp) => comp.setPristine(false));\n this.scrollIntoView(this.element);\n return Promise.reject(this.showErrors([], true));\n }\n }\n emitPrevPage() {\n this.emit('prevPage', { page: this.page, submission: this.submission });\n }\n prevPage() {\n return this.beforePage().then(() => {\n return this.setPage(this.getPreviousPage()).then(() => {\n this.emitPrevPage();\n });\n });\n }\n cancel(noconfirm) {\n if (this.options.readOnly) {\n return Promise.resolve();\n }\n if (super.cancel(noconfirm)) {\n this.setPristine(true);\n return this.setPage(0).then(() => {\n if (this.enabledIndex) {\n this.enabledIndex = 0;\n }\n this.onChange();\n this.redraw();\n return this.page;\n });\n }\n return Promise.resolve();\n }\n getPageIndexByKey(key) {\n let pageIndex = this.page;\n this.pages.forEach((page, index) => {\n if (page.component.key === key) {\n pageIndex = index;\n return false;\n }\n });\n return pageIndex;\n }\n get schema() {\n return this.wizard;\n }\n setComponentSchema() {\n const pageKeys = {};\n this.originalComponents = [];\n this.component.components.map((item) => {\n if (item.type === 'panel') {\n item.key = (0, utils_1.uniqueKey)(pageKeys, (item.key || 'panel'));\n pageKeys[item.key] = true;\n if (this.wizard.full) {\n this.options.show = this.options.show || {};\n this.options.show[item.key] = true;\n }\n else if (this.wizard.hasOwnProperty('full') && !lodash_1.default.isEqual(this.originalOptions.show, this.options.show)) {\n this.options.show = Object.assign({}, (this.originalOptions.show || {}));\n }\n }\n this.originalComponents.push(lodash_1.default.clone(item));\n });\n if (!Object.keys(pageKeys).length) {\n const newPage = {\n type: 'panel',\n title: 'Page 1',\n label: 'Page 1',\n key: 'page1',\n components: this.component.components\n };\n this.component.components = [newPage];\n this.originalComponents.push(lodash_1.default.clone(newPage));\n }\n }\n setForm(form, flags) {\n if (!form) {\n return;\n }\n return super.setForm(form, flags);\n }\n onSetForm(clonedForm, initialForm) {\n this.component.components = (this._parentPath ? initialForm.components : clonedForm.components) || [];\n this.setComponentSchema();\n }\n setEditMode(submission) {\n if (!this.editMode && submission._id && !this.options.readOnly) {\n this.editMode = true;\n this.redraw();\n }\n }\n setValue(submission, flags = {}, ignoreEstablishment) {\n const changed = this.getPages({ all: true }).reduce((changed, page) => {\n return this.setNestedValue(page, submission.data, flags, changed) || changed;\n }, false);\n if (!flags.sanitize) {\n this.mergeData(this.data, submission.data);\n }\n if (changed) {\n this.pageFieldLogic(this.page);\n }\n this.setEditMode(submission);\n submission.data = this.data;\n this._submission = submission;\n if (!ignoreEstablishment) {\n this.establishPages(submission.data);\n }\n return changed;\n }\n isClickable(page, index) {\n return this.page !== index && (0, utils_1.firstNonNil)([\n lodash_1.default.get(page, 'breadcrumbClickable'),\n this.options.breadcrumbSettings.clickable\n ]);\n }\n hasButton(name, nextPage = this.getNextPage()) {\n // get page options with global options as default values\n const { previous = this.options.buttonSettings.showPrevious, cancel = this.options.buttonSettings.showCancel, submit = this.options.buttonSettings.showSubmit, next = this.options.buttonSettings.showNext } = lodash_1.default.get(this.currentPage, 'component.buttonSettings', {});\n switch (name) {\n case 'previous':\n return previous && (this.getPreviousPage() > -1);\n case 'next':\n return next && (nextPage !== null) && (nextPage !== -1);\n case 'cancel':\n return cancel && !this.options.readOnly;\n case 'submit':\n return submit && !this.options.readOnly && ((nextPage === null) || (this.page === (this.pages.length - 1)));\n default:\n return true;\n }\n }\n pageId(page) {\n if (page.key) {\n // Some panels have the same key....\n return `${page.key}-${page.title}`;\n }\n else if (page.components &&\n page.components.length > 0) {\n return this.pageId(page.components[0]);\n }\n else {\n return page.title;\n }\n }\n onChange(flags, changed, modified, changes) {\n var _a, _b;\n super.onChange(flags, changed, modified, changes);\n if (this.alert && !this.submitted) {\n this.checkValidity(this.localData, false, this.localData, true);\n this.showErrors([], true, true);\n }\n // If the pages change, need to redraw the header.\n let currentPanels;\n let panels;\n const currentNextPage = this.currentNextPage;\n if (this.hasExtraPages) {\n currentPanels = this.pages.map(page => page.component.key);\n this.establishPages();\n panels = this.pages.map(page => page.component.key);\n }\n else {\n currentPanels = this.currentPanels || this.pages.map(page => page.component.key);\n panels = this.establishPages().map(panel => panel.key);\n this.currentPanels = panels;\n if (((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.key) && ((_b = this.currentPanels) === null || _b === void 0 ? void 0 : _b.length)) {\n this.setPage(this.currentPanels.findIndex(panel => panel === this.currentPanel.key));\n }\n }\n if (!lodash_1.default.isEqual(panels, currentPanels) || (flags && flags.fromSubmission)) {\n this.redrawHeader();\n }\n // If the next page changes, then make sure to redraw navigation.\n if (currentNextPage !== this.getNextPage()) {\n this.redrawNavigation();\n }\n if (this.options.readOnly && (this.prefixComps.length || this.suffixComps.length)) {\n this.redraw();\n }\n }\n redraw() {\n var _a, _b;\n if ((_b = (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.modalEdit) {\n return this.parent.redraw();\n }\n return super.redraw();\n }\n checkValidity(data, dirty, row, currentPageOnly) {\n if (!this.checkCondition(row, data)) {\n this.setCustomValidity('');\n return true;\n }\n const components = !currentPageOnly || this.isLastPage()\n ? this.getComponents()\n : this.currentPage.components;\n return components.reduce((check, comp) => comp.checkValidity(data, dirty, row) && check, true);\n }\n get errors() {\n if (!this.isLastPage()) {\n return this.currentPage.errors;\n }\n return super.errors;\n }\n focusOnComponent(key) {\n let pageIndex = 0;\n const [page] = this.pages.filter((page, index) => {\n let hasComponent = false;\n page.getComponent(key, (comp) => {\n if (comp.path === key) {\n pageIndex = index;\n hasComponent = true;\n }\n });\n return hasComponent;\n });\n if (page && page !== this.currentPage) {\n return this.setPage(pageIndex).then(() => {\n this.checkValidity(this.submission.data, true, this.submission.data);\n this.showErrors();\n super.focusOnComponent(key);\n });\n }\n return super.focusOnComponent(key);\n }\n}\nexports[\"default\"] = Wizard;\nWizard.setBaseUrl = Formio_1.Formio.setBaseUrl;\nWizard.setApiUrl = Formio_1.Formio.setApiUrl;\nWizard.setAppUrl = Formio_1.Formio.setAppUrl;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Wizard.js?");
|
5350
5350
|
|
5351
5351
|
/***/ }),
|
5352
5352
|
|
@@ -10127,7 +10127,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
|
|
10127
10127
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
10128
10128
|
|
10129
10129
|
"use strict";
|
10130
|
-
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Formio = void 0;\nconst core_1 = __webpack_require__(/*! @formio/core */ \"./node_modules/@formio/core/lib/index.js\");\nObject.defineProperty(exports, \"Formio\", ({ enumerable: true, get: function () { return core_1.Formio; } }));\nconst CDN_1 = __importDefault(__webpack_require__(/*! ./CDN */ \"./lib/cjs/CDN.js\"));\nconst providers_1 = __importDefault(__webpack_require__(/*! ./providers */ \"./lib/cjs/providers/index.js\"));\ncore_1.Formio.cdn = new CDN_1.default();\ncore_1.Formio.Providers = providers_1.default;\ncore_1.Formio.version = '5.0.0-rc.
|
10130
|
+
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Formio = void 0;\nconst core_1 = __webpack_require__(/*! @formio/core */ \"./node_modules/@formio/core/lib/index.js\");\nObject.defineProperty(exports, \"Formio\", ({ enumerable: true, get: function () { return core_1.Formio; } }));\nconst CDN_1 = __importDefault(__webpack_require__(/*! ./CDN */ \"./lib/cjs/CDN.js\"));\nconst providers_1 = __importDefault(__webpack_require__(/*! ./providers */ \"./lib/cjs/providers/index.js\"));\ncore_1.Formio.cdn = new CDN_1.default();\ncore_1.Formio.Providers = providers_1.default;\ncore_1.Formio.version = '5.0.0-rc.27';\nconst isNil = (val) => val === null || val === undefined;\ncore_1.Formio.prototype.uploadFile = function (storage, file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, uploadStartCallback, abortCallback) {\n const requestArgs = {\n provider: storage,\n method: 'upload',\n file: file,\n fileName: fileName,\n dir: dir\n };\n fileKey = fileKey || 'file';\n const request = core_1.Formio.pluginWait('preRequest', requestArgs)\n .then(() => {\n return core_1.Formio.pluginGet('fileRequest', requestArgs)\n .then((result) => {\n if (storage && isNil(result)) {\n const Provider = providers_1.default.getProvider('storage', storage);\n if (Provider) {\n const provider = new Provider(this);\n if (uploadStartCallback) {\n uploadStartCallback();\n }\n return provider.uploadFile(file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, abortCallback);\n }\n else {\n throw ('Storage provider not found');\n }\n }\n return result || { url: '' };\n });\n });\n return core_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);\n};\ncore_1.Formio.prototype.downloadFile = function (file, options) {\n const requestArgs = {\n method: 'download',\n file: file\n };\n const request = core_1.Formio.pluginWait('preRequest', requestArgs)\n .then(() => {\n return core_1.Formio.pluginGet('fileRequest', requestArgs)\n .then((result) => {\n if (file.storage && isNil(result)) {\n const Provider = providers_1.default.getProvider('storage', file.storage);\n if (Provider) {\n const provider = new Provider(this);\n return provider.downloadFile(file, options);\n }\n else {\n throw ('Storage provider not found');\n }\n }\n return result || { url: '' };\n });\n });\n return core_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);\n};\ncore_1.Formio.prototype.deleteFile = function (file, options) {\n const requestArgs = {\n method: 'delete',\n file: file\n };\n const request = core_1.Formio.pluginWait('preRequest', requestArgs)\n .then(() => {\n return core_1.Formio.pluginGet('fileRequest', requestArgs)\n .then((result) => {\n if (file.storage && isNil(result)) {\n const Provider = providers_1.default.getProvider('storage', file.storage);\n if (Provider) {\n const provider = new Provider(this);\n return provider.deleteFile(file, options);\n }\n else {\n throw ('Storage provider not found');\n }\n }\n return result || { url: '' };\n });\n });\n return core_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);\n};\n// For reverse compatability.\ncore_1.Formio.Promise = Promise;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Formio.js?");
|
10131
10131
|
|
10132
10132
|
/***/ }),
|
10133
10133
|
|