{"version":3,"file":"Src_Scripts_components_period-picker_js.dcbe6874f363c584b86a.js","sources":["webpack://haveselskabet/./Src/Scripts/components/period-picker.js"],"sourcesContent":["import { easepick } from '@easepick/bundle';\nimport { RangePlugin } from '@easepick/range-plugin';\n\nexport default class PeriodPicker {\n    constructor(elm, args) {\n        var periodPicker = elm.querySelector('#period-picker');\n        var from = elm.querySelector('#from-period');\n        var to = elm.querySelector('#to-period');\n\n        let pickingFrom;\n        from.addEventListener('click', () => {\n            pickingFrom = true;\n            periodPicker.click();\n            setTimeout(() => {\n                const picker = document.querySelector('.easepick-wrapper');\n                if (document.body.offsetWidth < 992) {\n                    picker.scrollIntoView();\n                }\n            }, 100)\n        });\n\n        to.addEventListener('click', () => {\n            periodPicker.click();\n            pickingFrom = false;\n        });\n\n        var resetFromButton = elm.querySelector('[data-period-picker-reset-from-input]');\n        var resetToButton = elm.querySelector('[data-period-picker-reset-to-input]');\n\n        resetFromButton.onclick = () => {\n            from.value = '';\n            from.dispatchEvent(new Event('change', { bubbles: true }));\n            const closeButton = from.parentNode.querySelector('.period-picker__close-button');\n            from.classList.remove('period-picker__from-period--filled');\n            closeButton.classList.remove('period-picker__close-button--filled');\n        }\n\n        resetToButton.onclick = () => {\n            to.value = '';\n            to.dispatchEvent(new Event('change', { bubbles: true }));\n            const closeButton = to.parentNode.querySelector('.period-picker__close-button');\n            closeButton.classList.remove('period-picker__close-button--filled');\n            to.classList.remove('period-picker__to-period--filled');\n        }\n\n        const picker = new easepick.create({\n            element: periodPicker,\n            css: [\n                'https://cdn.jsdelivr.net/npm/@easepick/bundle@1.1.7/dist/index.css',\n                'https://cdn.jsdelivr.net/npm/@easepick/range-plugin@1.1.7/dist/index.css',\n                '/Frontend/Styles/periodpicker.css',\n            ],\n            lang: 'da-DK',\n            zIndex: 10,\n            setup(picker) {\n                picker.on('select', (evt) => {\n                    const { date } = evt.detail;\n                    if (pickingFrom) {\n                        from.value = date ? date.format('DD/MM-YYYY') : null;\n                        from.dispatchEvent(new Event('change', { bubbles: true }));\n\n                        if (date) {\n                            from.classList.add('period-picker__from-period--filled');\n                            const closeButton = from.parentNode.querySelector('.period-picker__close-button');\n                            closeButton.classList.add('period-picker__close-button--filled');\n                        }\n                    } else {\n                        to.value = date ? date.format('DD/MM-YYYY') : null;\n                        to.dispatchEvent(new Event('change', { bubbles: true }));\n\n                        if (date) {\n                            to.classList.add('period-picker__to-period--filled')\n                            const closeButton = to.parentNode.querySelector('.period-picker__close-button');\n                            closeButton.classList.add('period-picker__close-button--filled');\n                        }\n                    }\n                });\n            }\n        })\n    }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;;A;;A","sourceRoot":""}