{"version":3,"file":"./modules/Tab.xxxxxxxx.js","mappings":"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","sources":["webpack:///./modules/Tab.ts"],"sourcesContent":["/// <reference path=\"../typings/niveax.d.ts\"/>\r\nconst moduleSelector = '[data-module=\"Tab\"]';\r\nimport { getElementHeight } from '../helpers/DOMHelpers';\r\nimport { horizontalScrolling } from '../helpers/helperFunctions';\r\n\r\nexport default class Tab {\r\n    protected cssClass: any;\r\n    protected tabLinks: HTMLElement[] = Array.from(this.element.querySelectorAll('[data-tab]'));\r\n    protected tabSections: HTMLElement[] = Array.from(this.element.querySelectorAll('.nx-tabs__item'));\r\n    protected tabList: HTMLElement = this.element.querySelector('.nx-scroll-wrapper__inner');\r\n    protected wrapperSelector = this.element.querySelector('.nx-scroll-wrapper__inner');\r\n    protected imageList: HTMLElement[] = Array.from(this.element.querySelectorAll('.nx-tab-background'));\r\n\r\n    static setup(selector: string = moduleSelector): void {\r\n        Array.from(document.querySelectorAll(selector)).filter((node: HTMLElement) => !node.dataset.moduleInitialized).forEach((element: HTMLElement) => {\r\n            new Tab(element);\r\n            element.dataset.moduleInitialized = 'true';\r\n        });\r\n    }\r\n\r\n    constructor(public element: HTMLElement) {\r\n        if (this.tabLinks.length <= 1) return;\r\n\r\n        this.cssClass = {\r\n            activeLink: 'nx-tabs-links__item--active',\r\n            activeSection: 'nx-tabs__item--active',\r\n            activeImage: 'nx-tab-background--active'\r\n        };\r\n\r\n        this.init();\r\n        this.element.addEventListener(\"niveax:openTab\", (event) => this.openTabFromAnchor(event));\r\n    }\r\n\r\n    protected init() {\r\n        this.setTabEventHandler();\r\n        this.setActiveTabOnChange(0);\r\n        horizontalScrolling(this.tabList);\r\n        this.openTabFromAnchorOnLoad();\r\n    }\r\n\r\n    private setTabEventHandler(): Tab {\r\n        this.tabLinks.forEach(link => link.addEventListener('click', (e) => this.onTabClick(e)));\r\n        return this;\r\n    }\r\n\r\n    private onTabClick(e) {\r\n        e.preventDefault();\r\n        this.changeTab(e);\r\n    }\r\n\r\n    protected changeTab(e: Event, tabLink = null): Tab {\r\n        this.clearActiveClass();\r\n        this.setActiveContainer(e, tabLink);\r\n        return this;\r\n    }\r\n\r\n    private openTabFromAnchor(event: Event) {\r\n        const tabItem = (<CustomEvent>event).detail.tabNode as HTMLElement;\r\n        const tabID = tabItem.getAttribute('data-tab-idx');\r\n        this.changeTab(event, tabID)\r\n        this.scrollToActive(tabID);\r\n    }\r\n\r\n    protected openTabFromAnchorOnLoad() {\r\n        const hash: string = window.location.hash.substring(1);\r\n        if (hash && hash.indexOf('layer') === -1 && this.element.contains(document.getElementById(`${hash}`))) {\r\n            const tabItem = this.findTabItemByAnchor(hash);\r\n            this.openTab(tabItem);\r\n\r\n            document.getElementById(`${hash}`).scrollIntoView();\r\n\r\n            const anchorNavHeight = (<HTMLElement>document.querySelector('.nx-anchor-navigation'));\r\n            window.scrollBy({\r\n                top: anchorNavHeight ? -anchorNavHeight.clientHeight : 0,\r\n                left: 0,\r\n                behavior: 'auto'\r\n            });\r\n        }\r\n    }\r\n\r\n    private findTabItemByAnchor(hash: string): HTMLElement {\r\n        const tabItems = this.element.querySelectorAll('.nx-tab-container-item');\r\n        const anchorTabItem: HTMLElement = Array.from(tabItems).find(element => element.contains(document.getElementById(`${hash}`))) as HTMLElement;\r\n        return anchorTabItem;\r\n    }\r\n\r\n    private openTab(tabItem: HTMLElement) {\r\n        const tabID = tabItem.getAttribute('data-tab-idx');\r\n        this.changeTab(null, tabID)\r\n        this.scrollToActive(tabID);\r\n    }\r\n\r\n    private scrollToActive(tabID) {\r\n        const activeTab = this.element.querySelector(`.${this.cssClass.activeLink}[data-tab=\"${tabID}\"]`);\r\n        if (!activeTab)\r\n            return false;\r\n\r\n        const scrollValue = (activeTab.getBoundingClientRect().left - (window.innerWidth / 2)) + 40;\r\n        this.wrapperSelector.scrollLeft += scrollValue;\r\n    }\r\n\r\n    protected setActiveTabOnChange(index: number) {\r\n        (<HTMLElement>this.tabLinks[index]).classList.add(this.cssClass.activeLink);\r\n        (<HTMLElement>this.tabSections[index]).classList.add(this.cssClass.activeSection);\r\n    }\r\n\r\n    protected clearActiveClass(): void {\r\n        this.tabLinks.forEach(link => link.classList.remove(this.cssClass.activeLink));\r\n        this.tabSections.forEach(section => section.classList.remove(this.cssClass.activeSection));\r\n        this.imageList.forEach(image => image.classList.remove(this.cssClass.activeImage))\r\n        this.element.setAttribute('style', '');\r\n    }\r\n\r\n    protected setActiveContainer(e: Event, tabID = null): void {\r\n        let id = tabID || (<HTMLElement>e.currentTarget).getAttribute('data-tab'),\r\n            activeTab = this.element.querySelector(`[id=\"${id}\"], [data-tab-idx=\"${id}\"]`) as HTMLElement,\r\n            activeImage = this.element.querySelector(`[data-tab-image-id=\"${id}\"]`) as HTMLElement;\r\n        const activeLink = tabID ? <HTMLElement>this.element.querySelector(`.nx-tabs-links__item[data-tab=\"${tabID}\"]`) : (<HTMLElement>e.target)\r\n\r\n        this.setActiveLink(activeLink);\r\n        this.setActiveTab(activeTab);\r\n        activeImage ? this.setActiveImage(activeImage): '';\r\n        this.updateBackgroundColor(activeLink);\r\n    }\r\n\r\n    protected setActiveLink(activeLink: HTMLElement) {\r\n        activeLink.classList.add(this.cssClass.activeLink);\r\n    }\r\n\r\n    protected setActiveTab(activeTab: HTMLElement) {\r\n        activeTab.classList.add(this.cssClass.activeSection);\r\n    }\r\n\r\n    protected getHeightActiveTab(activeTab: HTMLElement): number {\r\n        return activeTab ? getElementHeight(activeTab) : 0;\r\n    }\r\n\r\n    protected setActiveImage(image: HTMLElement) {\r\n        image.classList.add(this.cssClass.activeImage);\r\n    }\r\n    \r\n    private updateBackgroundColor(activeLink: HTMLElement) {\r\n        this.element.setAttribute('style', activeLink?.getAttribute('data-style'))\r\n    }\r\n}\r\n\r\n\r\n// Hot Module Replacement\r\nif (module.hot) {\r\n    let nodesCache: HMRNodes[] = Array.from(document.querySelectorAll(moduleSelector)).map((element: Node) => ({ nodeToReplace: element, nodeOrigin: element.cloneNode(true) }));\r\n\r\n    Tab.setup(moduleSelector);\r\n\r\n    module.hot.accept(() => {\r\n        Tab.setup(moduleSelector);\r\n    });\r\n    module.hot.dispose(() => {\r\n        nodesCache.forEach(({ nodeToReplace, nodeOrigin }) => { nodeToReplace = nodeToReplace.parentElement.replaceChild(nodeOrigin.cloneNode(true), nodeToReplace) });\r\n    });\r\n} else {\r\n    Tab.setup(moduleSelector);\r\n}"],"names":["moduleSelector","Tab","setup","selector","Array","from","document","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","element","constructor","tabLinks","this","tabSections","tabList","querySelector","wrapperSelector","imageList","length","cssClass","activeLink","activeSection","activeImage","init","addEventListener","event","openTabFromAnchor","setTabEventHandler","setActiveTabOnChange","openTabFromAnchorOnLoad","link","e","onTabClick","preventDefault","changeTab","tabLink","clearActiveClass","setActiveContainer","tabID","detail","tabNode","getAttribute","scrollToActive","hash","window","location","substring","indexOf","contains","getElementById","tabItem","findTabItemByAnchor","openTab","scrollIntoView","anchorNavHeight","scrollBy","top","clientHeight","left","behavior","tabItems","find","activeTab","scrollValue","getBoundingClientRect","innerWidth","scrollLeft","index","classList","add","remove","section","image","setAttribute","id","currentTarget","target","setActiveLink","setActiveTab","setActiveImage","updateBackgroundColor","getHeightActiveTab"],"sourceRoot":""}