{"version":3,"file":"help-center-article.page.js","sources":["../../../../KNHS.Website.Frontend/script/vue/apps/help-center/config/index.ts","../../../../KNHS.Website.Frontend/script/vue/apps/help-center/components/download-accordion.component.vue","../../../../KNHS.Website.Frontend/script/vue/apps/help-center/index.ts","../../../../KNHS.Website.Frontend/script/help-center-article.page.ts"],"sourcesContent":["const NAME_SPACE = 'HelpCenterArticlePage';\n\nexport { NAME_SPACE };\n","<template>\n    <div class=\"accordion__body\">\n        <div class=\"item\">\n            <button class=\"item__title\" @click=\"toggle\" :class=\"{ 'is-active': isActive }\">\n                Downloads\n                <span class=\"icon\"></span>\n            </button>\n            <Transition name=\"accordion\" @enter=\"enter\" @after-enter=\"afterEnter\" @leave=\"leave\">\n                <div class=\"item__body\" v-if=\"isActive\">\n                    <template v-for=\"(item, index) in items\" :key=\"`item-${index}`\">\n                        <a class=\"download-item\" :href=\"item.Url\" :target=\"item.Target\">\n                            <svgComponent\n                                :width=\"24\"\n                                :height=\"24\"\n                                class-name=\"icon-download\"\n                                icon-name=\"icon-download\"></svgComponent>\n                            <span class=\"title\">{{ item.Text }}</span>\n                        </a>\n                    </template>\n                </div>\n            </Transition>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport type { Ref } from 'vue';\nimport svgComponent from '../../../components/svgComponent.vue';\n\ninterface IDownloadItem {\n    Text: string;\n    Url: string;\n    Target: string;\n    Active: boolean;\n}\n\ndefineProps<{\n    items: IDownloadItem[];\n}>();\n\nconst isActive: Ref<boolean> = ref(false);\n\nconst toggle = () => {\n    isActive.value = !isActive.value;\n};\n\nconst enter = (el: HTMLElement) => {\n    el.style.height = 'auto';\n\n    const height = getComputedStyle(el).height;\n    el.style.height = '0';\n\n    getComputedStyle(el);\n\n    setTimeout(() => {\n        el.style.height = height;\n    });\n};\n\nconst afterEnter = (el: HTMLElement) => {\n    el.style.height = 'auto';\n};\n\nconst leave = (el: HTMLElement) => {\n    el.style.height = getComputedStyle(el).height;\n\n    getComputedStyle(el);\n\n    setTimeout(() => {\n        el.style.height = '0';\n    });\n};\n</script>\n","import { NAME_SPACE } from './config';\nimport DownloadAccordion from './components/download-accordion.component.vue';\n\nexport default {\n    name: NAME_SPACE,\n    components: {\n        'download-accordion': DownloadAccordion,\n    },\n};\n","import { createApp } from './vue';\n\nimport HelpCenter from './vue/apps/help-center';\n\nconst helpCenterArticleMountingContainer = document.getElementById('js-help-center-article');\n\nif (helpCenterArticleMountingContainer) {\n    createApp(HelpCenter).mount(helpCenterArticleMountingContainer);\n\n    const lightbox: HTMLElement | null =\n        helpCenterArticleMountingContainer.querySelector('.js-lightbox');\n    const btnCloseLightbox = lightbox?.querySelector('.js-close');\n    const images = helpCenterArticleMountingContainer.querySelectorAll('img');\n    const body = document.body;\n\n    images.forEach((i) => {\n        i.addEventListener('click', () => {\n            openLightbox(i);\n        });\n    });\n\n    btnCloseLightbox?.addEventListener('click', () => {\n        closeLightbox();\n    });\n\n    const closeLightbox = () => {\n        lightbox?.classList.remove('is-visible');\n        enableBodyScroll();\n    };\n\n    const openLightbox = (el: HTMLImageElement) => {\n        const imageSrc = el.src.split('?')[0];\n        if (lightbox) {\n            disableBodyScroll();\n            const target: HTMLImageElement | null = lightbox.querySelector('.js-target');\n            lightbox?.classList.add('is-visible');\n\n            if (target) {\n                target.src = imageSrc;\n            }\n        }\n    };\n\n    const enableBodyScroll = () => {\n        body.classList.remove('hide-overflow');\n    };\n\n    const disableBodyScroll = () => {\n        body.classList.add('hide-overflow');\n    };\n}\n"],"names":["NAME_SPACE","isActive","ref","toggle","enter","el","height","afterEnter","leave","HelpCenter","DownloadAccordion","helpCenterArticleMountingContainer","createApp","lightbox","btnCloseLightbox","images","body","i","openLightbox","closeLightbox","enableBodyScroll","imageSrc","disableBodyScroll","target"],"mappings":"yNAAA,MAAMA,EAAa,kPCyCb,MAAAC,EAAyBC,EAAI,EAAK,EAElCC,EAAS,IAAM,CACRF,EAAA,MAAQ,CAACA,EAAS,KAAA,EAGzBG,EAASC,GAAoB,CAC/BA,EAAG,MAAM,OAAS,OAEZ,MAAAC,EAAS,iBAAiBD,CAAE,EAAE,OACpCA,EAAG,MAAM,OAAS,IAElB,iBAAiBA,CAAE,EAEnB,WAAW,IAAM,CACbA,EAAG,MAAM,OAASC,CAAA,CACrB,CAAA,EAGCC,EAAcF,GAAoB,CACpCA,EAAG,MAAM,OAAS,MAAA,EAGhBG,EAASH,GAAoB,CAC/BA,EAAG,MAAM,OAAS,iBAAiBA,CAAE,EAAE,OAEvC,iBAAiBA,CAAE,EAEnB,WAAW,IAAM,CACbA,EAAG,MAAM,OAAS,GAAA,CACrB,CAAA,+eCpEUI,EAAA,CACX,KAAMT,EACN,WAAY,CACR,qBAAsBU,CAC1B,CACJ,ECJMC,EAAqC,SAAS,eAAe,wBAAwB,EAE3F,GAAIA,EAAoC,CAC1BC,EAAAH,CAAU,EAAE,MAAME,CAAkC,EAExD,MAAAE,EACFF,EAAmC,cAAc,cAAc,EAC7DG,EAAmBD,GAAA,YAAAA,EAAU,cAAc,aAC3CE,EAASJ,EAAmC,iBAAiB,KAAK,EAClEK,EAAO,SAAS,KAEfD,EAAA,QAASE,GAAM,CAChBA,EAAA,iBAAiB,QAAS,IAAM,CAC9BC,EAAaD,CAAC,CAAA,CACjB,CAAA,CACJ,EAEiBH,GAAA,MAAAA,EAAA,iBAAiB,QAAS,IAAM,CAChCK,GAAA,GAGlB,MAAMA,EAAgB,IAAM,CACdN,GAAA,MAAAA,EAAA,UAAU,OAAO,cACVO,GAAA,EAGfF,EAAgBb,GAAyB,CAC3C,MAAMgB,EAAWhB,EAAG,IAAI,MAAM,GAAG,EAAE,GACnC,GAAIQ,EAAU,CACQS,IACZ,MAAAC,EAAkCV,EAAS,cAAc,YAAY,EACjEA,GAAA,MAAAA,EAAA,UAAU,IAAI,cAEpBU,IACAA,EAAO,IAAMF,EAErB,CAAA,EAGED,EAAmB,IAAM,CACtBJ,EAAA,UAAU,OAAO,eAAe,CAAA,EAGnCM,EAAoB,IAAM,CACvBN,EAAA,UAAU,IAAI,eAAe,CAAA,CAE1C"}