{"version":3,"file":"SwModal-CXEqUUY0.js","sources":["../../../node_modules/sweet-modal-vue/src/components/SweetModal.vue","../../../app/frontend/components/swComponents/SwModal.vue"],"sourcesContent":["<template>\n\t<!--\n\t\tSweetModal for Vue.js\n\t\tSweet, easy and powerful modals and dialogs\n\n\t\tCopyright (c) 2017 Adepto.as AS · Oslo, Norway\n\t\tDual licensed under the MIT and GPL licenses.\n\n\t\tSee LICENSE-MIT.txt and LICENSE-GPL.txt\n\t-->\n\t<div :class=\"overlay_classes\" v-show=\"is_open\" v-on:click=\"_onOverlayClick\">\n\t\t<div :class=\"modal_classes\" :style=\"modal_style\">\n\t\t\t<div class=\"sweet-box-actions\">\n\t\t\t\t<!-- Custom Actions -->\n\t\t\t\t<slot name=\"box-action\"></slot>\n\n\t\t\t\t<!-- Close Button -->\n\t\t\t\t<div class=\"sweet-action-close\" v-on:click=\"close\" v-if=\"!hideCloseButton\">\n\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\" fill=\"#292c34\" /></svg>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<!-- Title: Housing the title and tabs, if no title is present -->\n\t\t\t<div class=\"sweet-title\" v-if=\"has_title || has_tabs\">\n\t\t\t\t<!-- Tabs but no title -->\n\t\t\t\t<template v-if=\"has_tabs && !has_title\">\n\t\t\t\t\t<ul class=\"sweet-modal-tabs\">\n\t\t\t\t\t\t<li v-for=\"tab in tabs\" :class=\"_getClassesForTab(tab)\">\n\t\t\t\t\t\t\t<a href=\"#\" v-on:click.prevent=\"_changeTab(tab)\">\n\t\t\t\t\t\t\t\t<div class=\"sweet-modal-valign\">\n\t\t\t\t\t\t\t\t\t<span v-if=\"tab.icon\" v-html=\"tab.icon\" class=\"sweet-modal-tab-icon\" />\n\t\t\t\t\t\t\t\t\t<span class=\"sweet-modal-tab-title\">{{ tab.title }}</span>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</template>\n\n\t\t\t\t<!-- Title -->\n\t\t\t\t<template v-if=\"has_title\">\n\t\t\t\t\t<h2 v-if=\"title\" v-html=\"title\"></h2>\n\t\t\t\t\t<slot name=\"title\"></slot>\n\t\t\t\t</template>\n\t\t\t</div>\n\n\t\t\t<!-- Tabs: If title AND tabs are present -->\n\t\t\t<ul class=\"sweet-modal-tabs\" v-if=\"has_title && has_tabs\">\n\t\t\t\t<li v-for=\"tab in tabs\" :class=\"_getClassesForTab(tab)\">\n\t\t\t\t\t<a href=\"#\" v-on:click.prevent=\"_changeTab(tab)\">\n\t\t\t\t\t\t<div class=\"sweet-modal-valign\">\n\t\t\t\t\t\t\t<span v-if=\"tab.icon\" v-html=\"tab.icon\" class=\"sweet-modal-tab-icon\" />\n\t\t\t\t\t\t\t<span class=\"sweet-modal-tab-title\">{{ tab.title }}</span>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</li>\n\t\t\t</ul>\n\n\t\t\t<!-- Content: Wrapper -->\n\t\t\t<div class=\"sweet-content\" ref=\"content\">\n\t\t\t\t<!-- Icon: Error -->\n\t\t\t\t<div class=\"sweet-modal-icon sweet-modal-error\" v-if=\"icon == 'error'\" ref=\"icon_error\">\n\t\t\t\t\t<span class=\"sweet-modal-x-mark\">\n\t\t\t\t\t\t<span class=\"sweet-modal-line sweet-modal-left\"></span>\n\t\t\t\t\t\t<span class=\"sweet-modal-line sweet-modal-right\"></span>\n\t\t\t\t\t</span>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- Icon: Warning -->\n\t\t\t\t<div class=\"sweet-modal-icon sweet-modal-warning\" v-if=\"icon == 'warning'\" ref=\"icon_warning\">\n\t\t\t\t\t<span class=\"sweet-modal-body\"></span>\n\t\t\t\t\t<span class=\"sweet-modal-dot\"></span>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- Icon: Info -->\n\t\t\t\t<div class=\"sweet-modal-icon sweet-modal-info\" v-if=\"icon == 'info'\" ref=\"icon_info\"></div>\n\n\t\t\t\t<!-- Icon: Success -->\n\t\t\t\t<div class=\"sweet-modal-icon sweet-modal-success\" v-if=\"icon == 'success'\" ref=\"icon_success\">\n\t\t\t\t\t<span class=\"sweet-modal-line sweet-modal-tip\"></span>\n\t\t\t\t\t<span class=\"sweet-modal-line sweet-modal-long\"></span>\n\t\t\t\t\t<div class=\"sweet-modal-placeholder\"></div>\n\t\t\t\t\t<div class=\"sweet-modal-fix\"></div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- Actual Content -->\n\t\t\t\t<div class=\"sweet-content-content\" v-if=\"$slots.default\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<!-- Buttons -->\n\t\t\t<div class=\"sweet-buttons\" v-if=\"$slots.button\">\n\t\t\t\t<slot name=\"button\"></slot>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tname: 'SweetModal',\n\n\t\tprops: {\n\t\t\ttitle: {\n\t\t\t\ttype: String,\n\t\t\t\trequired: false,\n\t\t\t\tdefault: ''\n\t\t\t},\n\n\t\t\toverlayTheme: {\n\t\t\t\ttype: String,\n\t\t\t\trequired: false,\n\t\t\t\tdefault: 'light'\n\t\t\t},\n\n\t\t\tmodalTheme: {\n\t\t\t\ttype: String,\n\t\t\t\trequired: false,\n\t\t\t\tdefault: 'light'\n\t\t\t},\n\n\t\t\tblocking: {\n\t\t\t\ttype: Boolean,\n\t\t\t\trequired: false,\n\t\t\t\tdefault: false\n\t\t\t},\n\n\t\t\tpulseOnBlock: {\n\t\t\t\ttype: Boolean,\n\t\t\t\trequired: false,\n\t\t\t\tdefault: true\n\t\t\t},\n\n\t\t\ticon: {\n\t\t\t\ttype: String,\n\t\t\t\trequired: false,\n\t\t\t\tdefault: ''\n\t\t\t},\n\n\t\t\thideCloseButton: {\n\t\t\t\ttype: Boolean,\n\t\t\t\trequired: false,\n\t\t\t\tdefault: false\n\t\t\t},\n\n\t\t\tenableMobileFullscreen: {\n\t\t\t\ttype: Boolean,\n\t\t\t\trequired: false,\n\t\t\t\tdefault: true\n\t\t\t},\n\n\t\t\twidth: {\n\t\t\t\ttype: [Number, String],\n\t\t\t\trequired: false,\n\t\t\t\tdefault: null\n\t\t\t}\n\t\t},\n\n\t\tmounted() {\n\t\t\tthis.tabs = this.$children.filter(c => c.cmpName && c.cmpName == 'tab')\n\n\t\t\tif (this.has_tabs) {\n\t\t\t\tthis.currentTab = this._changeTab(this.tabs[0])\n\t\t\t}\n\n\t\t\tdocument.addEventListener('keyup', this._onDocumentKeyup)\n\t\t},\n\n\t\tbeforeDestroy() {\n\t\t\tdocument.removeEventListener('keyup', this._onDocumentKeyup)\n\t\t},\n\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvisible: false,\n\t\t\t\tis_open: false,\n\t\t\t\tis_bouncing: false,\n\t\t\t\ttabs: [],\n\n\t\t\t\tbackups: {\n\t\t\t\t\tbody: {\n\t\t\t\t\t\theight: null,\n\t\t\t\t\t\toverflow: null\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tcomputed: {\n\t\t\thas_title() {\n\t\t\t\treturn this.title || this.$slots.title\n\t\t\t},\n\n\t\t\thas_tabs() {\n\t\t\t\treturn this.tabs.length > 0\n\t\t\t},\n\n\t\t\thas_content() {\n\t\t\t\treturn this.$slots.default\n\t\t\t},\n\n\t\t\tcurrent_tab() {\n\t\t\t\treturn this.tabs.filter(t => t.active === true)[0]\n\t\t\t},\n\n\t\t\toverlay_classes() {\n\t\t\t\treturn [\n\t\t\t\t\t'sweet-modal-overlay',\n\t\t\t\t\t'theme-' + this.overlayTheme,\n\t\t\t\t\t'sweet-modal-clickable',\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-visible': this.visible,\n\t\t\t\t\t\tblocking: this.blocking\n\t\t\t\t\t}\n\t\t\t\t]\n\t\t\t},\n\n\t\t\tmodal_classes() {\n\t\t\t\treturn [\n\t\t\t\t\t'sweet-modal',\n\t\t\t\t\t'theme-' + this.modalTheme,\n\t\t\t\t\t{\n\t\t\t\t\t\t'has-title': this.has_title,\n\t\t\t\t\t\t'has-tabs': this.has_tabs,\n\t\t\t\t\t\t'has-content': this.has_content,\n\t\t\t\t\t\t'has-icon': this.icon,\n\t\t\t\t\t\t'is-mobile-fullscreen': this.enableMobileFullscreen,\n\t\t\t\t\t\t'is-visible': this.visible,\n\t\t\t\t\t\t'is-alert': (this.icon && !this.has_tabs) || (!this.icon && !this.title && !this.$slots.title),\n\t\t\t\t\t\tbounce: this.is_bouncing,\n\t\t\t\t\t}\n\t\t\t\t]\n\t\t\t},\n\n\t\t\tmodal_style() {\n\t\t\t\tlet width = this.width\n\t\t\t\tlet maxWidth = null\n\n\t\t\t\tif (width !== null) {\n\t\t\t\t\tif (Number(width) == width) {\n\t\t\t\t\t\twidth = width + 'px'\n\t\t\t\t\t}\n\n\t\t\t\t\tmaxWidth = 'none'\n\t\t\t\t}\n\n\t\t\t\treturn {\n\t\t\t\t\twidth,\n\t\t\t\t\tmaxWidth\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tmethods: {\n\t\t\t/**\n\t\t\t * Open the dialog\n\t\t\t * Emits an event 'open'\n\t\t\t *\n\t\t\t * @param tabId string     Optional id or index of initial tab element.\n\t\t\t */\n\t\t\topen(tabId = null) {\n\t\t\t\tif (tabId && this.has_tabs) {\n\t\t\t\t\t// Find tab with wanted id.\n\t\t\t\t\tlet openingTabs = this.tabs.filter((tab) => {return tab.id === tabId})\n\t\t\t\t\tif (openingTabs.length > 0) {\n\t\t\t\t\t\t// Set current tab to first match.\n\t\t\t\t\t\tthis.currentTab = this._changeTab(openingTabs[0])\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// Try opening index instead of id as an alternative.\n\t\t\t\t\t\tlet openingTab = this.tabs[tabId]\n\t\t\t\t\t\tif (openingTab) {\n\t\t\t\t\t\t\tthis.currentTab = this._changeTab(openingTab)\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tthis.is_open = true\n\t\t\t\tthis._lockBody()\n\t\t\t\tthis._animateIcon()\n\n\t\t\t\tsetTimeout(() => this.visible = true, 30)\n\t\t\t\tthis.$emit('open')\n\t\t\t},\n\n\t\t\t/**\n\t\t\t * Close the dialog\n\t\t\t * Emits an event 'close'\n\t\t\t */\n\t\t\tclose() {\n\t\t\t\tthis.visible = false\n\t\t\t\tthis._unlockBody()\n\n\t\t\t\tsetTimeout(() => this.is_open = false, 300)\n\t\t\t\tthis.$emit('close')\n\t\t\t},\n\n\t\t\t/**\n\t\t\t * Bounce the modal.\n\t\t\t */\n\t\t\tbounce() {\n\t\t\t\tthis.is_bouncing = true\n\n\t\t\t\tsetTimeout(() => this.is_bouncing = false, 330)\n\t\t\t},\n\n\t\t\t/**********************\n\t\t\t    INTERNAL METHODS\n\t\t\t **********************/\n\n\t\t\t_lockBody() {\n\t\t\t\tthis.backups.body.height = document.body.style.height\n\t\t\t\tthis.backups.body.overflow = document.body.style.overflow\n\n\t\t\t\tdocument.body.style.height = '100%'\n\t\t\t\tdocument.body.style.overflow = 'hidden'\n\t\t\t},\n\n\t\t\t_unlockBody() {\n\t\t\t\tdocument.body.style.height = this.backups.body.height\n\t\t\t\tdocument.body.style.overflow = this.backups.body.overflow\n\t\t\t},\n\n\t\t\t_onOverlayClick(event) {\n\t\t\t\tif (!event.target.classList || event.target.classList.contains('sweet-modal-clickable')) {\n\t\t\t\t\tif (this.blocking) {\n\t\t\t\t\t\tif (this.pulseOnBlock) this.bounce()\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.close()\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\n\t\t\t_onDocumentKeyup(event) {\n\t\t\t\tif (event.keyCode == 27) {\n\t\t\t\t\tif (this.blocking) {\n\t\t\t\t\t\tif (this.pulseOnBlock) this.bounce()\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.close()\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\n\t\t\t_changeTab(tab) {\n\t\t\t\tthis.tabs.map(t => t.active = t == tab)\n\t\t\t\tthis.currentTab = tab\n\t\t\t},\n\n\t\t\t_getClassesForTab(tab) {\n\t\t\t\treturn [\n\t\t\t\t\t'sweet-modal-tab',\n\n\t\t\t\t\t{\n\t\t\t\t\t\tactive: tab.active,\n\t\t\t\t\t\tdisabled: tab.disabled\n\t\t\t\t\t}\n\t\t\t\t]\n\t\t\t},\n\n\t\t\t_animateIcon() {\n\t\t\t\tif (!this.icon) return\n\n\t\t\t\tswitch (this.icon) {\n\t\t\t\t\tcase 'success':\n\t\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\t\tthis._applyClasses(this.$refs.icon_success, {\n\t\t\t\t\t\t\t\t'': [ 'animate' ],\n\t\t\t\t\t\t\t\t'.sweet-modal-tip': [ 'animateSuccessTip' ],\n\t\t\t\t\t\t\t\t'.sweet-modal-long': [ 'animateSuccessLong' ]\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t}, 80)\n\n\t\t\t\t\t\tbreak;\n\n\t\t\t\t\tcase 'warning':\n\t\t\t\t\t\tthis._applyClasses(this.$refs.icon_warning, {\n\t\t\t\t\t\t\t'': [ 'pulseWarning' ],\n\t\t\t\t\t\t\t'.sweet-modal-body': [ 'pulseWarningIns' ],\n\t\t\t\t\t\t\t'.sweet-modal-dot': [ 'pulseWarningIns' ]\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\tbreak;\n\n\t\t\t\t\tcase 'error':\n\t\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\t\tthis._applyClasses(this.$refs.icon_error, {\n\t\t\t\t\t\t\t\t'': [ 'animateErrorIcon' ],\n\t\t\t\t\t\t\t\t'.sweet-modal-x-mark': [ 'animateXMark' ]\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t}, 80)\n\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t},\n\n\t\t\t/**\n\t\t\t * Apply classes from the classMap to $ref or children of $ref, a native\n\t\t\t * DOMElement.\n\t\t\t *\n\t\t\t * ClassMap:\n\t\t\t * {\n\t\t\t *     'selector': [ 'class1', 'class2', ... ]\n\t\t\t * }\n\t\t\t *\n\t\t\t * Empty Selector selects $ref.\n\t\t\t *\n\t\t\t * @param DOMNode $ref     Element to apply classes to or children of that element\n\t\t\t * @param Object  classMap Class Map which elements get which classes (see doc)\n\t\t\t */\n\t\t\t_applyClasses($ref, classMap) {\n\t\t\t\tfor (let cl in classMap) {\n\t\t\t\t\tlet classes = classMap[cl]\n\t\t\t\t\tlet $el\n\n\t\t\t\t\tif (cl == '') {\n\t\t\t\t\t\t$el = $ref\n\t\t\t\t\t} else {\n\t\t\t\t\t\t$el = $ref.querySelector(cl)\n\t\t\t\t\t}\n\n\t\t\t\t\t$el.classList.remove(...classes)\n\t\t\t\t\t$el.classList.add(...classes)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n</script>\n\n<style lang=\"scss\">\n\t@import '../styles/mixins';\n\t@import '../styles/colors';\n\t@import '../styles/animations';\n\t@import '../styles/icons';\n\n\t.sweet-modal-overlay {\n\t\tposition: fixed;\n\t\ttop: 0;\n\t\tleft: 0;\n\n\t\twidth: 100vw;\n\t\theight: 100vh;\n\n\t\tz-index: 9001;\n\n\t\tfont-size: 14px;\n\n\t\t-webkit-font-smoothing: antialiased;\n\n\t\t// Theming\n\t\tbackground: rgba(#fff, 0.9);\n\n\t\t&.theme-dark {\n\t\t\t$color: color(dark-overlay);\n\n\t\t\t// background: radial-gradient(ellipse at center, rgba($color, 0.9) 0%, rgba($color, 0.96) 100%);\n\t\t\tbackground: rgba($color, 0.94);\n\t\t}\n\n\t\t// Animation\n\t\topacity: 0;\n\t\ttransition: opacity 0.3s;\n\t\ttransform: translate3D(0, 0, 0);\n\t\t-webkit-perspective: 500px;\n\n\t\t&.is-visible {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\n\t.sweet-modal {\n\t\t@include border-box;\n\n\t\tbackground: #fff;\n\t\tbox-shadow: 0px 8px 46px rgba(#000, 0.08),\n\t\t\t\t\t0px 2px  6px rgba(#000, 0.03);\n\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\tleft: 50%;\n\t\t// transform: translate(-50%, -50%); // Done by the animation later\n\n\t\twidth: 80%;\n\t\tmax-width: 640px;\n\t\tmax-height: 100vh;\n\t\toverflow-y: auto;\n\n\t\tborder-radius: 2px;\n\n\t\t.sweet-box-actions {\n\t\t\tposition: absolute;\n\t\t\ttop: 12px;\n\t\t\tright: 12px;\n\n\t\t\t.sweet-action-close {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tcursor: pointer;\n\n\t\t\t\tcolor: color(dark);\n\t\t\t\ttext-align: center;\n\n\t\t\t\twidth: 42px;\n\t\t\t\theight: 42px;\n\t\t\t\tline-height: 42px;\n\n\t\t\t\tborder-radius: 50%;\n\n\t\t\t\tsvg {\n\t\t\t\t\twidth: 24px;\n\t\t\t\t\theight: 24px;\n\n\t\t\t\t\tvertical-align: middle;\n\t\t\t\t\tmargin-top: -2px;\n\n\t\t\t\t\t@include svg-path(true) {\n\t\t\t\t\t\tfill: currentColor;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t&:hover {\n\t\t\t\t\tbackground: color(blue);\n\t\t\t\t\tcolor: #fff;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t.sweet-title {\n\t\t\t@include ellipsis;\n\n\t\t\theight: 64px;\n\t\t\tline-height: 64px;\n\n\t\t\tborder-bottom: 1px solid color(border);\n\n\t\t\tpadding: {\n\t\t\t\tleft: 32px;\n\t\t\t\tright: 64px;\n\t\t\t}\n\n\t\t\t> h2 {\n\t\t\t\t@include ellipsis;\n\t\t\t\t@include mp0;\n\n\t\t\t\tfont-weight: 500;\n\t\t\t\tfont-size: 22px;\n\t\t\t}\n\t\t}\n\n\t\tul.sweet-modal-tabs {\n\t\t\t@include ulreset;\n\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\twidth: calc(100% + 32px);\n\t\t\theight: 100%;\n\n\t\t\tmargin-left: -32px;\n\t\t\toverflow-x: auto;\n\n\t\t\tli.sweet-modal-tab {\n\t\t\t\tdisplay: block;\n\t\t\t\theight: 100%;\n\n\t\t\t\ta {\n\t\t\t\t\t@include ellipsis;\n\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\talign-items: center;\n\n\t\t\t\t\tpadding: {\n\t\t\t\t\t\tleft: 20px;\n\t\t\t\t\t\tright: 20px;\n\t\t\t\t\t}\n\n\t\t\t\t\tcolor: color(dark);\n\t\t\t\t\ttext-decoration: none;\n\t\t\t\t\ttext-align: center;\n\n\t\t\t\t\theight: 100%;\n\n\t\t\t\t\tspan.sweet-modal-tab-title {\n\t\t\t\t\t\tdisplay: block;\n\t\t\t\t\t}\n\n\t\t\t\t\tspan.sweet-modal-tab-icon {\n\t\t\t\t\t\tdisplay: block;\n\t\t\t\t\t\tline-height: 1.0;\n\n\t\t\t\t\t\tsvg, img {\n\t\t\t\t\t\t\twidth: 16px;\n\t\t\t\t\t\t\theight: 16px;\n\n\t\t\t\t\t\t\t@include svg-path(true) {\n\t\t\t\t\t\t\t\tfill: currentColor;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tspan.sweet-modal-tab-icon + span.sweet-modal-tab-title {\n\t\t\t\t\t\tline-height: 1.0;\n\t\t\t\t\t\tmargin-top: 8px;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t&:first-child a {\n\t\t\t\t\tpadding-left: 32px;\n\t\t\t\t}\n\n\t\t\t\t&.active a {\n\t\t\t\t\tfont-weight: 600;\n\t\t\t\t\tcolor: color(blue);\n\t\t\t\t}\n\n\t\t\t\t&.disabled a {\n\t\t\t\t\t@include unclickable;\n\t\t\t\t\tcolor: color(light-grey);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.has-tabs:not(.has-title) {\n\n\t\t\t.sweet-title {\n\t\t\t\theight: 84px;\n\t\t\t\tline-height: 84px;\n\t\t\t}\n\t\t}\n\n\t\t&.has-tabs.has-title {\n\n\t\t\tul.sweet-modal-tabs {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 48px;\n\n\t\t\t\tmargin: 0;\n\t\t\t\tborder-bottom: 1px solid color(border);\n\n\t\t\t\tli.sweet-modal-tab a {\n\t\t\t\t\tmargin-top: -4px;\n\n\t\t\t\t\tspan.sweet-modal-tab-icon {\n\t\t\t\t\t\tdisplay: inline-block;\n\n\t\t\t\t\t\tsvg, img {\n\t\t\t\t\t\t\tvertical-align: middle;\n\n\t\t\t\t\t\t\tmargin: {\n\t\t\t\t\t\t\t\ttop: -2px;\n\t\t\t\t\t\t\t\tright: 8px;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tspan.sweet-modal-tab-title {\n\t\t\t\t\t\tdisplay: inline-block;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t.sweet-content {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\n\t\t\tpadding: {\n\t\t\t\tleft: 32px;\n\t\t\t\tright: 32px;\n\t\t\t\ttop: 24px;\n\t\t\t\tbottom: 24px;\n\t\t\t}\n\n\t\t\tline-height: 1.5;\n\n\t\t\t.sweet-content-content {\n\t\t\t\tflex-grow: 1;\n\t\t\t}\n\n\t\t\t.sweet-modal-tab:not(.active) {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\n\t\t\t.sweet-modal-icon {\n\t\t\t\tmargin-bottom: 36px;\n\t\t\t}\n\t\t}\n\n\t\t.sweet-buttons {\n\t\t\ttext-align: right;\n\n\t\t\tpadding: {\n\t\t\t\tleft: 20px;\n\t\t\t\tright: 20px;\n\t\t\t\ttop: 12px;\n\t\t\t\tbottom: 12px;\n\t\t\t}\n\t\t}\n\n\t\t.sweet-content + .sweet-buttons {\n\t\t\tborder-top: 1px solid color(border);\n\t\t}\n\n\t\t// Special Styles\n\t\t&.is-alert {\n\n\t\t\t.sweet-content {\n\t\t\t\tdisplay: block;\n\n\t\t\t\ttext-align: center;\n\t\t\t\tfont-size: 16px;\n\n\t\t\t\tpadding: {\n\t\t\t\t\ttop: 64px;\n\t\t\t\t\tbottom: 64px;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.has-tabs.has-icon .sweet-content {\n\t\t\tpadding: {\n\t\t\t\ttop: 32px;\n\t\t\t\tbottom: 32px;\n\t\t\t}\n\n\t\t\t.sweet-content-content {\n\t\t\t\tpadding-left: 32px;\n\t\t\t}\n\n\t\t\t.sweet-modal-icon {\n\t\t\t\tmargin-bottom: 0;\n\t\t\t}\n\t\t}\n\n\t\t&:not(.has-content) {\n\n\t\t\t.sweet-modal-icon {\n\t\t\t\tmargin-bottom: 0;\n\t\t\t}\n\t\t}\n\n\t\t// Theming\n\t\t&.theme-dark {\n\t\t\t$color: color(dark-modal);\n\n\t\t\tbackground: $color;\n\t\t\tcolor: #fff;\n\n\t\t\t.sweet-box-actions {\n\n\t\t\t\t.sweet-action-close {\n\t\t\t\t\tcolor: #fff;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t.sweet-title {\n\t\t\t\tborder-bottom-color: darken($color, 8%);\n\t\t\t\tbox-shadow: 0px 1px 0px lighten($color, 8%);\n\t\t\t}\n\n\t\t\tul.sweet-modal-tabs li {\n\n\t\t\t\ta {\n\t\t\t\t\tcolor: #fff;\n\t\t\t\t}\n\n\t\t\t\t&.active a {\n\t\t\t\t\tcolor: color(blue);\n\t\t\t\t}\n\n\t\t\t\t&.disabled a {\n\t\t\t\t\tcolor: lighten($color, 20%);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&.has-tabs.has-title {\n\n\t\t\t\tul.sweet-modal-tabs {\n\t\t\t\t\tborder-bottom-color: darken($color, 8%);\n\t\t\t\t\tbox-shadow: 0px 1px 0px lighten($color, 8%);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t.sweet-content + .sweet-buttons {\n\t\t\t\tborder-top-color: lighten($color, 8%);\n\t\t\t\tbox-shadow: 0px -1px 0px darken($color, 8%);\n\t\t\t}\n\t\t}\n\n\t\t// Animation\n\t\ttransform: scale(0.9) translate(calc(-50% - 32px), -50%);\n\t\topacity: 0;\n\n\t\ttransition: {\n\t\t\tproperty: transform, opacity;\n\t\t\tduration: 0.3s;\n\t\t\tdelay: 0.05s;\n\t\t\ttiming-function: cubic-bezier(0.52, 0.02, 0.19, 1.02);\n\t\t}\n\n\t\t.sweet-buttons,\n\t\t.sweet-content {\n\t\t\topacity: 0;\n\n\t\t\ttransition: {\n\t\t\t\tproperty: transform, opacity;\n\t\t\t\tduration: 0.3s;\n\t\t\t\tdelay: 0.09s;\n\t\t\t\ttiming-function: cubic-bezier(0.52, 0.02, 0.19, 1.02);\n\t\t\t}\n\t\t}\n\n\t\t.sweet-content {\n\t\t\ttransform: translateY(-8px);\n\t\t}\n\n\t\t.sweet-buttons {\n\t\t\ttransform: translateY(16px);\n\t\t}\n\n\t\t&.is-visible {\n\t\t\ttransform: translate(-50%, -50%);\n\t\t\topacity: 1;\n\n\t\t\t.sweet-buttons,\n\t\t\t.sweet-content {\n\t\t\t\ttransform: none;\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t}\n\n\t\t&.bounce {\n\t\t\tanimation-name: bounce;\n\t\t\tanimation-duration: 0.3s;\n\t\t\tanimation-iteration-count: 2;\n\t\t\tanimation-direction: alternate;\n\t\t}\n\n\t\t// Responsiveness\n\t\t@include media(desktop) {\n\t\t\t// Bouncing animation\n\t\t\t@keyframes bounce {\n\t\t\t\t0% {\n\t\t\t\t\ttransform: scale(1) translate(-50%, -50%);\n\t\t\t\t}\n\n\t\t\t\t50% {\n\t\t\t\t\ttransform: scale(1.02) translate(calc(-50% + 8px), -50%);\n\t\t\t\t}\n\n\t\t\t\t100% {\n\t\t\t\t\ttransform: scale(1) translate(-50%, -50%);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.is-mobile-fullscreen {\n\t\t\t\n\t\t\t@include media(mobile) {\n\n\t\t\t\t& {\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100vh;\n\n\t\t\t\t\tleft: 0;\n\t\t\t\t\ttop: 0;\n\n\t\t\t\t\ttransform: scale(0.9);\n\n\t\t\t\t\t&.is-visible {\n\t\t\t\t\t\ttransform: none;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t.sweet-buttons {\n\t\t\t\t\t@include border-box;\n\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tbottom: 0;\n\t\t\t\t\tleft: 0;\n\n\t\t\t\t\twidth: 100%;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n</style>\n","<template lang=\"pug\">\n  div\n    div(@click=\"openModal\")\n      slot\n    sweet-modal(\n      @open=\"$emit('open'); clearModalContentOnClose ? modalContentInDom = true : ''\"\n      @close=\"$emit('close'); clearModalContentOnClose ? modalContentInDom = false : ''\"\n      ref=\"modal\"\n      overlay-theme=\"dark\"\n      :blocking=\"blocking\"\n      :enable-mobile-fullscreen=\"false\"\n      :data-purpose='dataPurposeProp'\n      hide-close-button\n    )\n      .flex.justify-end.pt-4.sticky.top-0\n        button.cursor-pointer.text-3xl.text-indigo-500.border.border-blue-100.rounded-full.p-2.shadow-sm(class=\"focus:outline-none\" @click=\"closeModal\")\n          sw-icon(name=\"close\")\n      slot(name=\"modal-content\" v-if=\"modalContentInDom\")\n</template>\n\n<script>\nimport SweetModal from 'sweet-modal-vue/src/components/SweetModal.vue';\n\nexport default {\n  name: 'SwModal',\n  components: {\n    SweetModal,\n  },\n  props: {\n    blocking: {\n      type: Boolean,\n      default: false,\n    },\n    open: {\n      type: Boolean,\n      default: false,\n    },\n    dataPurposeProp: {\n      type: String,\n      default: null,\n    },\n    clearModalContentOnClose: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  data () {\n    return {\n      modalContentInDom: true,\n    };\n  },\n  watch: {\n    open () {\n      this.open ? this.openModal() : this.closeModal();\n    },\n  },\n  mounted () {\n    if (this.open) this.openModal();\n  },\n  beforeDestroy () {\n    this.$refs.modal.close();\n  },\n  methods: {\n    openModal () {\n      this.$refs.modal.open();\n    },\n    closeModal () {\n      this.$refs.modal.close();\n    },\n  },\n};\n</script>\n\n<style lang=\"scss\">\n  .sweet-modal {\n    @apply w-11/12 mb-20 max-h-screen-9/10;\n    @screen sm {\n      @apply mb-6;\n    }\n    @screen md {\n      @apply w-auto;\n    }\n    &.is-visible {\n      @apply transform translate-y-0 -translate-x-1/2;\n      @screen md {\n        @apply -translate-y-1/2;\n      }\n    }\n    &.is-alert {\n      @apply rounded bottom-0 top-auto;\n      @screen md {\n        @apply bottom-auto top-1/2;\n      }\n      .sweet-content {\n        @apply pt-0 pb-8 px-6;\n      }\n    }\n  }\n  .sweet-modal-overlay {\n    @apply bg-white bg-opacity-75;\n    &.theme-dark {\n      @apply bg-black bg-opacity-75;\n    }\n  }\n\n</style>\n"],"names":["_sfc_main","c","t","width","maxWidth","tabId","openingTabs","tab","openingTab","event","$ref","classMap","cl","classes","$el","SweetModal"],"mappings":"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","x_google_ignoreList":[0]}