{"version":3,"file":"ComparisonPreviewSection.js","names":["ComparisonPreviewSection","a","setters","AbstractComparison","default","deepMerge","on","off","trigger","Event","mix","Accessibility","AnalyticsMixin","execute","with","constructor","element","options","arguments","length","isValid","comparisonModal","footerPrefix","initCache","selectors","products","querySelectorAll","compareButton","querySelector","previewItemRemove","classes","expanded","bindEvents","onProductClick","bind","onCompareButtonClick","event","target","matches","productElement","closest","pid","getAttribute","setRemovedIndex","Array","from","removeProduct","emit","analytics","label","sendAnalytics","getReloadData","params","classList","contains","Object","keys","selectedProducts","afterInit","toggleStickyBars","restoreFocusAfterRemove","contentUrl","state","instanceId","stickyBarState","bubbles","storeUpdated","currentState","showComparisonButtons","syncProducts","destroy"],"sources":["components/search/ComparisonPreviewSection.js"],"sourcesContent":["import AbstractComparison from 'components/search/AbstractComparison';\nimport { deepMerge } from 'toolbox/deepMerge';\nimport { on, off, trigger } from 'toolbox/event';\nimport { Event } from 'services/EventEmitter';\nimport { mix } from 'core/mixwith';\nimport Accessibility from 'mixins/Accessibility';\nimport AnalyticsMixin from 'mixins/Analytics';\n\n/**\n * This is a description of the ComparisonPreviewSection constructor function.\n * @class\n * @classdesc ComparisonPreviewSection class designed to handle client-side logic\n * related to comparison preview section functionality.\n * @extends AbstractComparison\n */\nexport default class ComparisonPreviewSection extends mix(AbstractComparison).with(Accessibility, AnalyticsMixin) {\n    /**\n     * Constructor of the class that mainly merge the options of the components\n     * @param {HTMLElement} element HTMLElement of the component\n     * @param {object} options options that belongs to the component\n     */\n    constructor(element, options = {}) {\n        super(element, deepMerge({\n            isValid: false,\n            comparisonModal: null, // comparison modal options\n            footerPrefix: 'footer', // used to hide/show footer sticky bar\n        }, options));\n    }\n\n    /**\n     * All selectors must be cached. Never cache elements that are out of the component scope\n     */\n    initCache() {\n        this.selectors.products = this.element.querySelectorAll('[data-js-selected-product]');\n        this.selectors.compareButton = this.element.querySelector('[data-js-compare]');\n\n        this.selectors.previewItemRemove = '[data-js-selected-remove]';\n\n        this.classes = {\n            expanded: 'm-expanded',\n        };\n    }\n\n    /**\n     * Should contain only event listeners and nothing else\n     * All the event handlers should be into a separated function. No usage of anonyous function\n     */\n    bindEvents() {\n        on('click', this.selectors.products, this.onProductClick.bind(this));\n        on('click', this.selectors.compareButton, this.onCompareButtonClick.bind(this));\n    }\n\n    /**\n     * Selected product item \"click\" event handler\n     * @param {Object} event event object\n     */\n    onProductClick(event) {\n        if (event.target.matches('[data-js-selected-remove]')) {\n            // remove product from list of selected products\n            const productElement = event.target.closest('[data-js-selected-product]');\n            const pid = productElement && productElement.getAttribute('data-js-pid');\n\n            // save index of the removed item to restore focus on the nearest remove button later\n            this.setRemovedIndex(event.target, Array.from(this.element.querySelectorAll(this.selectors.previewItemRemove)));\n\n            this.removeProduct(pid);\n        }\n    }\n\n    /**\n     * Compare button \"click\" event handler\n     */\n    onCompareButtonClick() {\n        if (this.options.isValid) {\n            Event.emit('modal.open', this.options.comparisonModal);\n\n            this.analytics.label = '{{dataLayer.page.category}}';\n            this.sendAnalytics(this.analytics);\n        }\n    }\n\n    /**\n     * Returns object with product ids\n     * @param {Array} products array of selected pids\n     * @returns {Object} object with selected pid\n     */\n    getReloadData(products) {\n        const params = super.getReloadData(products);\n\n        params.expanded = this.element.classList.contains(this.classes.expanded)\n            // if first product selected, expand section\n            || (Object.keys(this.options.selectedProducts).length === 0 && Object.keys(products).length === 1);\n\n        return params;\n    }\n\n    /**\n     * After init\n     * Run any script after the component is fully initialized\n     */\n    afterInit() {\n        this.toggleStickyBars(this.options.selectedProducts.length > 0);\n        super.afterInit();\n        // restore focus on remove or toggle button\n        this.restoreFocusAfterRemove(Array.from(this.element.querySelectorAll(this.selectors.previewItemRemove)));\n\n        if (this.options.comparisonModal) {\n            this.options.comparisonModal.options.contentUrl += `&comparisonId=${this.state.instanceId}`;\n        }\n    }\n\n    /**\n    * Show and hide preview section and footer sticky bar\n    *  @param {boolean} stickyBarState boolean value to toggle stickybar\n    */\n    toggleStickyBars(stickyBarState) {\n        let event;\n        if (stickyBarState) {\n            event = 'stickybar.show';\n            Event.emit(`${this.options.footerPrefix}.stickybar.hide`);\n        } else {\n            event = 'stickybar.hide';\n            Event.emit(`${this.options.footerPrefix}.stickybar.show`);\n        }\n        trigger(event, this.element, { bubbles: true });\n    }\n\n    /**\n    * Store update hook\n    * @param {Object} state new state\n    */\n    storeUpdated(state) {\n        const currentState = state[this.state.instanceId];\n        this.toggleStickyBars(currentState.showComparisonButtons);\n        this.syncProducts(state);\n    }\n\n    /**\n     * Destroy is called automatically after the component is being removed from the DOM\n     * You must always destroy the listeners attached to an element to avoid any memory leaks\n     */\n    destroy() {\n        off('click', this.selectors.products);\n        off('click', this.selectors.compareButton);\n    }\n}\n"],"mappings":"0OAeqBA,CAAwB,QAAAC,CAAA,oBAAAC,OAAA,WAAAD,CAAA,EAftCE,CAAkB,CAAAF,CAAA,CAAAG,OAAA,WAAAH,CAAA,EAChBI,CAAS,CAAAJ,CAAA,CAATI,SAAS,WAAAJ,CAAA,EACTK,CAAE,CAAAL,CAAA,CAAFK,EAAE,CAAEC,CAAG,CAAAN,CAAA,CAAHM,GAAG,CAAEC,CAAO,CAAAP,CAAA,CAAPO,OAAO,WAAAP,CAAA,EAChBQ,CAAK,CAAAR,CAAA,CAALQ,KAAK,WAAAR,CAAA,EACLS,CAAG,CAAAT,CAAA,CAAHS,GAAG,WAAAT,CAAA,EACLU,CAAa,CAAAV,CAAA,CAAAG,OAAA,WAAAH,CAAA,EACbW,CAAc,CAAAX,CAAA,CAAAG,OAAA,GAAAS,OAAA,SAAAA,CAAA,EAAAZ,CAAA,WASAD,CAAwB,CAA9B,aAAuC,CAAAU,CAAG,CAACP,CAAkB,CAAC,CAACW,IAAI,CAACH,CAAa,CAAEC,CAAc,CAAE,CAM9GG,WAAWA,CAACC,CAAO,CAAgB,IAAd,CAAAC,CAAO,GAAAC,SAAA,CAAAC,MAAA,WAAAD,SAAA,IAAAA,SAAA,IAAG,CAAC,CAAC,CAC7B,KAAK,CAACF,CAAO,CAAEX,CAAS,CAAC,CACrBe,OAAO,GAAO,CACdC,eAAe,CAAE,IAAI,CACrBC,YAAY,CAAE,QAClB,CAAC,CAAEL,CAAO,CAAC,CACf,CAKAM,SAASA,CAAA,CAAG,CACR,IAAI,CAACC,SAAS,CAACC,QAAQ,CAAG,IAAI,CAACT,OAAO,CAACU,gBAAgB,CAAC,4BAA4B,CAAC,CACrF,IAAI,CAACF,SAAS,CAACG,aAAa,CAAG,IAAI,CAACX,OAAO,CAACY,aAAa,CAAC,mBAAmB,CAAC,CAE9E,IAAI,CAACJ,SAAS,CAACK,iBAAiB,CAAG,2BAA2B,CAE9D,IAAI,CAACC,OAAO,CAAG,CACXC,QAAQ,CAAE,YACd,CACJ,CAMAC,UAAUA,CAAA,CAAG,CACT1B,CAAE,CAAC,OAAO,CAAE,IAAI,CAACkB,SAAS,CAACC,QAAQ,CAAE,IAAI,CAACQ,cAAc,CAACC,IAAI,CAAC,IAAI,CAAC,CAAC,CACpE5B,CAAE,CAAC,OAAO,CAAE,IAAI,CAACkB,SAAS,CAACG,aAAa,CAAE,IAAI,CAACQ,oBAAoB,CAACD,IAAI,CAAC,IAAI,CAAC,CAClF,CAMAD,cAAcA,CAACG,CAAK,CAAE,CAClB,GAAIA,CAAK,CAACC,MAAM,CAACC,OAAO,CAAC,2BAA2B,CAAC,CAAE,MAE7C,CAAAC,CAAc,CAAGH,CAAK,CAACC,MAAM,CAACG,OAAO,CAAC,4BAA4B,CAAC,CACnEC,CAAG,CAAGF,CAAc,EAAIA,CAAc,CAACG,YAAY,CAAC,aAAa,CAAC,CAGxE,IAAI,CAACC,eAAe,CAACP,CAAK,CAACC,MAAM,CAAEO,KAAK,CAACC,IAAI,CAAC,IAAI,CAAC7B,OAAO,CAACU,gBAAgB,CAAC,IAAI,CAACF,SAAS,CAACK,iBAAiB,CAAC,CAAC,CAAC,CAE/G,IAAI,CAACiB,aAAa,CAACL,CAAG,CAC1B,CACJ,CAKAN,oBAAoBA,CAAA,CAAG,CACf,IAAI,CAAClB,OAAO,CAACG,OAAO,GACpBX,CAAK,CAACsC,IAAI,CAAC,YAAY,CAAE,IAAI,CAAC9B,OAAO,CAACI,eAAe,CAAC,CAEtD,IAAI,CAAC2B,SAAS,CAACC,KAAK,CAAG,6BAA6B,CACpD,IAAI,CAACC,aAAa,CAAC,IAAI,CAACF,SAAS,CAAC,CAE1C,CAOAG,aAAaA,CAAC1B,CAAQ,CAAE,CACpB,KAAM,CAAA2B,CAAM,CAAG,KAAK,CAACD,aAAa,CAAC1B,CAAQ,CAAC,CAM5C,MAJA,CAAA2B,CAAM,CAACrB,QAAQ,CAAG,IAAI,CAACf,OAAO,CAACqC,SAAS,CAACC,QAAQ,CAAC,IAAI,CAACxB,OAAO,CAACC,QAAQ,CAAC,EAEV,CAAC,GAAvDwB,MAAM,CAACC,IAAI,CAAC,IAAI,CAACvC,OAAO,CAACwC,gBAAgB,CAAC,CAACtC,MAAY,EAAqC,CAAC,GAAlCoC,MAAM,CAACC,IAAI,CAAC/B,CAAQ,CAAC,CAACN,MAAa,CAE/FiC,CACX,CAMAM,SAASA,CAAA,CAAG,CACR,IAAI,CAACC,gBAAgB,CAAwC,CAAC,CAAxC,IAAI,CAAC1C,OAAO,CAACwC,gBAAgB,CAACtC,MAAU,CAAC,CAC/D,KAAK,CAACuC,SAAS,CAAC,CAAC,CAEjB,IAAI,CAACE,uBAAuB,CAAChB,KAAK,CAACC,IAAI,CAAC,IAAI,CAAC7B,OAAO,CAACU,gBAAgB,CAAC,IAAI,CAACF,SAAS,CAACK,iBAAiB,CAAC,CAAC,CAAC,CAErG,IAAI,CAACZ,OAAO,CAACI,eAAe,GAC5B,IAAI,CAACJ,OAAO,CAACI,eAAe,CAACJ,OAAO,CAAC4C,UAAU,EAAK,iBAAgB,IAAI,CAACC,KAAK,CAACC,UAAW,EAAC,CAEnG,CAMAJ,gBAAgBA,CAACK,CAAc,CAAE,CAC7B,GAAI,CAAA5B,CAAK,CACL4B,CAAc,EACd5B,CAAK,CAAG,gBAAgB,CACxB3B,CAAK,CAACsC,IAAI,CAAE,GAAE,IAAI,CAAC9B,OAAO,CAACK,YAAa,iBAAgB,CAAC,GAEzDc,CAAK,CAAG,gBAAgB,CACxB3B,CAAK,CAACsC,IAAI,CAAE,GAAE,IAAI,CAAC9B,OAAO,CAACK,YAAa,iBAAgB,CAAC,EAE7Dd,CAAO,CAAC4B,CAAK,CAAE,IAAI,CAACpB,OAAO,CAAE,CAAEiD,OAAO,GAAO,CAAC,CAClD,CAMAC,YAAYA,CAACJ,CAAK,CAAE,CAChB,KAAM,CAAAK,CAAY,CAAGL,CAAK,CAAC,IAAI,CAACA,KAAK,CAACC,UAAU,CAAC,CACjD,IAAI,CAACJ,gBAAgB,CAACQ,CAAY,CAACC,qBAAqB,CAAC,CACzD,IAAI,CAACC,YAAY,CAACP,CAAK,CAC3B,CAMAQ,OAAOA,CAAA,CAAG,CACN/D,CAAG,CAAC,OAAO,CAAE,IAAI,CAACiB,SAAS,CAACC,QAAQ,CAAC,CACrClB,CAAG,CAAC,OAAO,CAAE,IAAI,CAACiB,SAAS,CAACG,aAAa,CAC7C,CACJ,CAAC","ignoreList":[]}