{"version":3,"file":"modal-controller-C9HRvLxG.js","sources":["../../../app/frontend/src/yobbers/js/controllers/modal-controller.js"],"sourcesContent":["import { disableBodyScroll, clearAllBodyScrollLocks } from 'body-scroll-lock';\nimport { Controller } from '@hotwired/stimulus';\nimport { useMatchMedia } from 'stimulus-use';\nimport { useHotkeys } from 'stimulus-use/hotkeys';\nimport { MEDIA_QUERIES } from '~/src/global/utils/breakpoints';\nimport { gsap } from 'gsap';\n\nconst CLASSES = {\n open: '-is-open',\n sm: 'modal--sm'\n};\n\nconst LOADING_TEMPLATE = `\n
\n
\n
\n
\n
\n`;\n\nexport default class extends Controller {\n static targets = [\n 'container',\n 'content',\n 'box',\n 'scroll',\n 'template',\n 'frame',\n 'component'\n ];\n static values = {\n isOpen: {\n default: false,\n type: Boolean\n },\n openOnConnect: {\n default: false,\n type: Boolean\n }\n };\n\n connect() {\n window.modal = this;\n\n this.isOpenValue = false;\n\n useMatchMedia(this, {\n mediaQueries: MEDIA_QUERIES\n });\n\n useHotkeys(this, {\n esc: [this.escKeyHandler]\n });\n\n if (this.openOnConnectValue === true) {\n this.openTemplate();\n } else {\n if (this.isOpenValue === true) this.open();\n }\n\n if (this.hasTemplateTarget) {\n this.templateTarget.style.display = 'none';\n }\n }\n\n isSmall({ name, media, matches, event }) {\n this.openAnimationOptions = {\n opacity: 1,\n y: '0%'\n };\n\n this.extraOpenAnimationOptions = {\n ease: 'power4.out',\n duration: 0.35\n };\n\n this.closeAnimationOptions = {\n y: '100%'\n };\n\n this.extraCloseAnimationOptions = {\n ease: 'power3.in',\n duration: 0.2\n };\n }\n\n isLarge({ name, media, matches, event }) {\n this.openAnimationOptions = {\n opacity: 1,\n scale: 1,\n y: 0\n };\n\n this.extraOpenAnimationOptions = {\n ease: 'expo.out',\n duration: 0.4\n };\n\n this.closeAnimationOptions = {\n opacity: 0,\n scale: 1,\n y: 120\n };\n\n this.extraCloseAnimationOptions = {\n ease: 'power3.in',\n duration: 0.2\n };\n }\n\n openTemplate() {\n if (this.hasTemplateTarget) {\n this.contentTarget.scrollTo(0, 0);\n this.frameTarget.innerHTML = this.templateTarget.innerHTML;\n }\n\n this.isOpenValue = true;\n this.containerTarget.classList.add(CLASSES.open);\n this.boxTarget.style.opacity = '';\n\n this.dispatch('open');\n\n gsap.fromTo(\n this.boxTarget,\n {\n ...this.closeAnimationOptions,\n ...this.extraCloseAnimationOptions,\n duration: 0\n },\n {\n ...this.openAnimationOptions,\n ...this.extraOpenAnimationOptions,\n duration: 0,\n onComplete: () => {\n this.isAnimating = false;\n }\n }\n );\n\n this._setupEventListeners();\n }\n\n openInline(e) {\n const modalId = e.currentTarget.dataset.modalId;\n if (modalId) {\n this.open(e, modalId);\n } else {\n this.open(e);\n }\n\n if (this.hasTemplateTarget && e.target.tagName.toLowerCase() !== 'a') {\n this.contentTarget.scrollTo(0, 0);\n if (modalId) {\n this.frameTarget.innerHTML = document.getElementById(modalId).innerHTML;\n } else {\n this.frameTarget.innerHTML = this.templateTarget.innerHTML;\n }\n }\n }\n\n open(e, modalId = null) {\n if (this.isAnimating) return;\n this.isAnimating = true;\n e.currentTarget.blur();\n this.isOpenValue = true;\n this.containerTarget.classList.add(CLASSES.open);\n this.boxTarget.style.opacity = '';\n\n if (e.currentTarget.dataset.modalSize == 'sm') {\n this.containerTarget.classList.add(CLASSES.sm);\n }\n\n this.dispatch('open');\n\n gsap.fromTo(\n this.boxTarget,\n {\n ...this.closeAnimationOptions,\n ...this.extraCloseAnimationOptions\n },\n {\n ...this.openAnimationOptions,\n ...this.extraOpenAnimationOptions,\n onComplete: () => {\n this.isAnimating = false;\n }\n }\n );\n\n this._setupEventListeners();\n }\n\n scrollTargetConnected(target) {\n if (this.isOpenValue === true)\n disableBodyScroll(target, {\n reserveScrollBarGap: true\n });\n const autofocusElement = target.querySelector('[autofocus]');\n\n if (autofocusElement) autofocusElement.focus();\n }\n\n escKeyHandler() {\n if (this.isOpenValue === true) this.close();\n }\n\n close(e) {\n if (this.isAnimating) return;\n this.isAnimating = true;\n if (e) e.preventDefault();\n this.isOpenValue = false;\n this.containerTarget.classList.remove(CLASSES.open);\n\n this._removeEventListeners();\n\n gsap.fromTo(\n this.boxTarget,\n {\n ...this.openAnimationOptions,\n ...this.extraOpenAnimationOptions\n },\n {\n ...this.closeAnimationOptions,\n ...this.extraCloseAnimationOptions,\n onComplete: () => {\n this.isAnimating = false;\n this.boxTarget.style.opacity = '0';\n this.dispatch('close');\n clearAllBodyScrollLocks();\n if (this.hasFrameTarget) {\n this.frameTarget.innerHTML = LOADING_TEMPLATE;\n }\n }\n }\n );\n }\n\n closeOnSubmit(e) {\n if (e.detail.success) this.close();\n }\n\n _setupEventListeners() {\n this.containerTarget.addEventListener('click', this._handleClickOutside);\n }\n\n _removeEventListeners() {\n this.containerTarget.removeEventListener('click', this._handleClickOutside);\n }\n\n _handleClickOutside = (event) => {\n if (\n this.hasComponentTarget &&\n this.componentTarget.dataset.closeOnOutsideClick == 'false'\n ) {\n return;\n }\n\n if (event.target === this.element.querySelector('.modal__bg')) this.close();\n };\n}\n"],"names":["CLASSES","LOADING_TEMPLATE","ModalController","Controller","__publicField","event","useMatchMedia","MEDIA_QUERIES","useHotkeys","name","media","matches","gsap","e","modalId","target","disableBodyScroll","autofocusElement","clearAllBodyScrollLocks"],"mappings":"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"}