{"version":3,"file":"./modules/EnhancedListScrollGrid.xxxxxxxx.js","mappings":"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","sources":["webpack:///./modules/EnhancedListScrollGrid/EnhancedListScrollGrid.ts","webpack:///./modules/EnhancedListScrollGrid/index.ts","webpack:///./modules/ScrollBar.ts"],"sourcesContent":["import { getOptions } from '../../helpers/helperFunctions';\r\nimport ScrollBar from '../ScrollBar';\r\n\r\nconst moduleSelector = '[data-module=\"EnhancedListScrollGrid\"]';\r\n\r\nexport default class EnhancedListScrollGrid {\r\n private scrollGridElement: Element;\r\n private scrollBar: ScrollBar;\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 EnhancedListScrollGrid(element);\r\n element.dataset.moduleInitialized = 'true';\r\n });\r\n }\r\n\r\n constructor(public element: HTMLElement, private options?: ScrollGridOptions) {\r\n this.getScrollGridOptions()\r\n .getScrollGridElement()\r\n .initScrollBar(this.scrollGridElement as HTMLElement);\r\n this.onResize();\r\n }\r\n\r\n private getScrollGridOptions() {\r\n this.options = getOptions(this.element, Object.assign(this.getDefaultOptions(), this.options));\r\n return this;\r\n }\r\n\r\n private getScrollGridElement() {\r\n this.scrollGridElement = this.element.querySelector(`.${this.options.scrollGridNodeSelector}`);\r\n return this;\r\n }\r\n\r\n private initScrollBar(scrollGridElement: HTMLElement) {\r\n this.scrollBar = new ScrollBar(scrollGridElement, this.options.scrollBarOptions);\r\n this.checkIfIsScrollApplied();\r\n\r\n return this;\r\n }\r\n\r\n private checkIfIsScrollApplied(): void {\r\n const scrollableElement = this.scrollBar.psb.element.querySelector('.nx-scroll--list'),\r\n scrollBarX = this.scrollBar.psb.scrollbarXRail;\r\n\r\n if(this.scrollBar.psb.contentWidth <= this.scrollBar.psb.containerWidth) {\r\n scrollBarX.style.backgroundColor = \"transparent\";\r\n scrollableElement.style.justifyContent = \"center\";\r\n } else {\r\n scrollBarX.style.backgroundColor = \"\"; \r\n scrollableElement.style.justifyContent = \"\";\r\n }\r\n }\r\n\r\n private onResize() {\r\n NiveaX.addToEventStore('resize', this.reinit.bind(this), window);\r\n\r\n return this;\r\n }\r\n\r\n private reinit() {\r\n this.reinitScrollBar();\r\n return this;\r\n }\r\n\r\n private reinitScrollBar() {\r\n this.scrollBar?.destroy();\r\n this.initScrollBar(this.scrollGridElement as HTMLElement);\r\n return this;\r\n }\r\n\r\n private getDefaultOptions(): ScrollGridOptions {\r\n return {\r\n scrollGridNodeSelector: 'nx-scroll-container',\r\n scrollBarOptions: {\r\n sbListSelector: 'nx-scroll-container',\r\n sbListItem: 'nx-scroll-container',\r\n fadeSide: false,\r\n },\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 EnhancedListScrollGrid.setup(moduleSelector);\r\n\r\n module.hot.accept(() => {\r\n EnhancedListScrollGrid.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 EnhancedListScrollGrid.setup(moduleSelector);\r\n}\r\n","import EnhancedListScrollGrid from './EnhancedListScrollGrid';\r\n\r\nexport default EnhancedListScrollGrid;","import PerfectScrollbar from 'perfect-scrollbar';\r\nimport { getOptions } from '../helpers/helperFunctions';\r\n\r\nconst moduleSelector = '[data-module=\"ScrollBar\"]';\r\n\r\nexport default class ScrollBar {\r\n psb: PerfectScrollbar;\r\n list: HTMLElement;\r\n fadeSide: FadeSide;\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 ScrollBar(element);\r\n element.dataset.moduleInitialized = 'true';\r\n });\r\n }\r\n\r\n constructor(public element: HTMLElement, private options: PSBOptions = {}) {\r\n this.options = getOptions(this.element, Object.assign(this.getDefaultOptions(), this.options));\r\n this.list = this.element.querySelector(`.${this.options.sbListSelector}`);\r\n\r\n this.init();\r\n }\r\n\r\n private init(): ScrollBar {\r\n this.psb = new PerfectScrollbar(this.element, this.options);\r\n this.onPageLoaded()\r\n .onResize();\r\n\r\n return this;\r\n }\r\n\r\n private initFadeSide(): ScrollBar {\r\n this.fadeSide = new FadeSide(this.element, this.options.fadeWidth);\r\n return this;\r\n }\r\n\r\n public updateScrollBar(): ScrollBar {\r\n // REVISIT\r\n if (!!this.element.closest('.nx-advantages')) {\r\n this.adjustScrollBarListWidth();\r\n }\r\n\r\n this.psb && this.psb.update();\r\n return this;\r\n }\r\n\r\n private getScrollBarListWidth(): number {\r\n const benefitItem = this.list.querySelector(`.${this.options.sbListItem}`);\r\n const benefitItemsLength = this.list.querySelectorAll(`.${this.options.sbListItem}`).length;\r\n\r\n return Math.ceil((benefitItemsLength * benefitItem.offsetWidth) + 1);\r\n }\r\n\r\n private adjustScrollBarListWidth(): ScrollBar {\r\n this.clearScrollBarListWidth();\r\n this.list.style.width = this.getScrollBarListWidth() + 'px';\r\n return this;\r\n }\r\n\r\n private clearScrollBarListWidth(): ScrollBar {\r\n this.list.style.width = '';\r\n return this;\r\n }\r\n\r\n private initScrollBarAfterPageLoaded(): ScrollBar {\r\n this.updateScrollBar();\r\n\r\n if (this.options.fadeSide) {\r\n this.initFadeSide();\r\n }\r\n\r\n return this;\r\n }\r\n\r\n private onResize(): ScrollBar {\r\n NiveaX.addToEventStore('resize', this.updateScrollBar.bind(this), window);\r\n return this;\r\n }\r\n\r\n private onPageLoaded(): ScrollBar {\r\n if (document.readyState === 'complete') {\r\n this.initScrollBarAfterPageLoaded();\r\n } else {\r\n NiveaX.addToEventStore('load', this.initScrollBarAfterPageLoaded.bind(this), window);\r\n }\r\n\r\n return this;\r\n }\r\n\r\n private getDefaultOptions(): PSBOptions {\r\n return {\r\n fadeSide: true,\r\n suppressScrollY: true,\r\n sbListSelector: 'nx-benefits__list',\r\n fadeWidth: null,\r\n sbListItem: 'nx-benefit',\r\n useBothWheelAxes: true,\r\n swipeEasing: true\r\n }\r\n }\r\n\r\n destroy(): ScrollBar {\r\n this.psb?.destroy();\r\n this.psb = null;\r\n // this.clearScrollBarListWidth();\r\n return this;\r\n }\r\n\r\n rebuild(): ScrollBar {\r\n this.psb = new PerfectScrollbar(this.element, this.options);\r\n this.updateScrollBar();\r\n return this;\r\n }\r\n}\r\n\r\nclass FadeSide {\r\n private fadeWidth: number;\r\n leftMaskWidth: number = 0;\r\n rightMaskWidth: number = 0;\r\n\r\n constructor(public element: HTMLElement, fadeWidth?: number) {\r\n this.fadeWidth = fadeWidth || this.getFadeWidth();\r\n this.leftMaskWidth = this.fadeWidth;\r\n this.rightMaskWidth = this.fadeWidth;\r\n\r\n this.init();\r\n }\r\n\r\n private init(): void {\r\n this.adjustFadeElements();\r\n this.element.addEventListener('ps-scroll-x', () => {\r\n this.adjustFadeElements()\r\n });\r\n }\r\n\r\n public adjustFadeElements(): void {\r\n let scrollWidth = this.element.scrollWidth,\r\n scrollLeft = Math.abs(this.element.scrollLeft),\r\n scrollRight = Math.abs(scrollWidth - (scrollLeft + this.element.clientWidth)),\r\n fdLeftWidth, fdRightWidth;\r\n\r\n if (scrollLeft <= this.fadeWidth) {\r\n fdLeftWidth = (scrollLeft / this.fadeWidth) * (this.fadeWidth);\r\n }\r\n\r\n if (scrollRight <= this.fadeWidth) {\r\n fdRightWidth = (scrollRight / this.fadeWidth) * (this.fadeWidth);\r\n }\r\n\r\n if(fdLeftWidth == undefined && fdRightWidth == undefined) {\r\n fdLeftWidth = this.fadeWidth;\r\n fdRightWidth = this.fadeWidth;\r\n }\r\n\r\n let leftWidth = (document.dir == 'ltr') ? fdLeftWidth : fdRightWidth;\r\n let rightWidth = (document.dir == 'ltr') ? fdRightWidth : fdLeftWidth;\r\n\r\n this.leftMaskWidth = leftWidth != undefined ? leftWidth : this.leftMaskWidth;\r\n this.rightMaskWidth = rightWidth != undefined ? rightWidth : this.rightMaskWidth;\r\n\r\n this.element.setAttribute('style', `-webkit-mask-image: linear-gradient(to right, transparent 0px, black ${this.leftMaskWidth}px), linear-gradient(to left, transparent 0px, black ${this.rightMaskWidth}px);\r\n mask-image: linear-gradient(to right, transparent 0px, black ${this.leftMaskWidth}px), linear-gradient(to left, transparent 0px, black ${this.rightMaskWidth}px);`)\r\n\r\n }\r\n\r\n public setFadeWith(fadeWidth: number) {\r\n this.fadeWidth = fadeWidth;\r\n }\r\n\r\n private getFadeWidth(): number {\r\n return this.element.querySelector('.nx-benefit')?.clientWidth;\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 ScrollBar.setup(moduleSelector);\r\n\r\n module.hot.accept(() => {\r\n ScrollBar.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 ScrollBar.setup(moduleSelector);\r\n}"],"names":["moduleSelector","EnhancedListScrollGrid","setup","selector","Array","from","document","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","element","constructor","options","this","getScrollGridOptions","getScrollGridElement","initScrollBar","scrollGridElement","onResize","Object","assign","getDefaultOptions","querySelector","scrollGridNodeSelector","scrollBar","scrollBarOptions","checkIfIsScrollApplied","scrollableElement","psb","scrollBarX","scrollbarXRail","contentWidth","containerWidth","style","backgroundColor","justifyContent","NiveaX","addToEventStore","reinit","bind","window","reinitScrollBar","destroy","sbListSelector","sbListItem","fadeSide","ScrollBar","list","init","onPageLoaded","initFadeSide","FadeSide","fadeWidth","updateScrollBar","closest","adjustScrollBarListWidth","update","getScrollBarListWidth","benefitItem","benefitItemsLength","length","Math","ceil","offsetWidth","clearScrollBarListWidth","width","initScrollBarAfterPageLoaded","readyState","suppressScrollY","useBothWheelAxes","swipeEasing","rebuild","leftMaskWidth","rightMaskWidth","getFadeWidth","adjustFadeElements","addEventListener","fdLeftWidth","fdRightWidth","scrollWidth","scrollLeft","abs","scrollRight","clientWidth","undefined","leftWidth","dir","rightWidth","setAttribute","setFadeWith"],"sourceRoot":""}