{"version":3,"file":"embedded-listing.js","names":[],"sources":["../resources/javascript/listing/embedded.js","../resources/javascript/embedded-listing.js"],"sourcesContent":["import { initBasketForm } from '../features/basket';\nimport { initChoosersForContainer } from '../pdp/chooser/chooser-helpers';\nimport { productOptionChanged } from '../pdp/chooser/constants';\nimport {\n    dispatchResultsRendered,\n    initSwatches,\n    reloadResult,\n    resultRendered,\n} from './result';\nimport 'scheduler-polyfill';\n\nexport const initEmbeddedListing = ({ container }) => {\n    const expandedResultPositions = {};\n\n    // Add an event listener that initialises swatches when a result card is\n    // rendered.\n    container.addEventListener(resultRendered, e => {\n        const resultCard = e.detail.result;\n        initSwatches(resultCard);\n        initChoosersForContainer(resultCard);\n\n        const basketForm = resultCard.querySelector('.js-add-to-basket-form');\n        if (basketForm) {\n            initBasketForm(basketForm);\n        }\n\n        // Initialise expandable containers.\n        resultCard.querySelectorAll('.expander').forEach(expander => {\n            if (expander.dataset.expander) {\n                return;\n            }\n\n            // Set the initial state of the expander.\n            const previouslyExpanded =\n                expandedResultPositions[resultCard.dataset.position] ?? false;\n            expander.classList.toggle(\n                'expander--expanded-a',\n                previouslyExpanded\n            );\n            expander.classList.toggle(\n                'expander--expanded-b',\n                previouslyExpanded\n            );\n\n            // Add an event listener that toggles the expander.\n            // Use delayed class remove to allow granular control over the animation\n            expander\n                .querySelector('.expander__toggle')\n                .addEventListener('click', e => {\n                    e.preventDefault();\n                    e.stopPropagation();\n\n                    if (expander.dataset.expanding) {\n                        return;\n                    }\n\n                    const expanded = () => {\n                        if (\n                            expander.classList.contains('expander--expanded-b')\n                        ) {\n                            expander.classList.remove('expander--expanded-b');\n\n                            setTimeout(() => {\n                                expander.classList.remove(\n                                    'expander--expanded-a'\n                                );\n                                delete expander.dataset.expanding;\n                            }, 250);\n                        } else {\n                            expander.classList.add('expander--expanded-a');\n\n                            setTimeout(() => {\n                                expander.classList.add('expander--expanded-b');\n                                expandedResultPositions[\n                                    resultCard.dataset.position\n                                ] = true;\n                                delete expander.dataset.expanding;\n                            }, 250);\n                        }\n                    };\n\n                    expander.dataset.expanding = true;\n\n                    expandedResultPositions[resultCard.dataset.position] =\n                        expanded();\n                });\n\n            expander.dataset.expander = true;\n        });\n    });\n\n    // Add an event listener that reloads the result card when a product option\n    // is changed.\n    container.addEventListener(productOptionChanged, e => {\n        e.stopPropagation();\n        const { optionValues } = e.detail;\n\n        const resultCard = e.target.closest('.listing-item');\n\n        // Load the result in a separate task, to avoid blocking the main thread.\n        scheduler.postTask(() => reloadResult(resultCard, optionValues), {\n            priority: 'background',\n        });\n    });\n\n    // Dispatch an event for all the result cards that are already rendered, to\n    // initialise the options.\n    dispatchResultsRendered(container);\n};\n","import { initEmbeddedListing } from './listing/embedded';\n\ndocument.addEventListener('DOMContentLoaded', () => {\n    document.querySelectorAll('.listing--embedded').forEach(listing => {\n        initEmbeddedListing({ container: listing });\n    });\n});\n"],"mappings":"kLAWA,MAAa,GAAuB,CAAE,eAAgB,CAClD,IAAM,EAA0B,EAAE,CAIlC,EAAU,iBAAiB,EAAgB,GAAK,CAC5C,IAAM,EAAa,EAAE,OAAO,OAC5B,EAAa,EAAW,CACxB,EAAyB,EAAW,CAEpC,IAAM,EAAa,EAAW,cAAc,yBAAyB,CACjE,GACA,EAAe,EAAW,CAI9B,EAAW,iBAAiB,YAAY,CAAC,QAAQ,GAAY,CACzD,GAAI,EAAS,QAAQ,SACjB,OAIJ,IAAM,EACF,EAAwB,EAAW,QAAQ,WAAa,GAC5D,EAAS,UAAU,OACf,uBACA,EACH,CACD,EAAS,UAAU,OACf,uBACA,EACH,CAID,EACK,cAAc,oBAAoB,CAClC,iBAAiB,QAAS,GAAK,CAI5B,GAHA,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,CAEf,EAAS,QAAQ,UACjB,OAGJ,IAAM,MAAiB,CAEf,EAAS,UAAU,SAAS,uBAAuB,EAEnD,EAAS,UAAU,OAAO,uBAAuB,CAEjD,eAAiB,CACb,EAAS,UAAU,OACf,uBACH,CACD,OAAO,EAAS,QAAQ,WACzB,IAAI,GAEP,EAAS,UAAU,IAAI,uBAAuB,CAE9C,eAAiB,CACb,EAAS,UAAU,IAAI,uBAAuB,CAC9C,EACI,EAAW,QAAQ,UACnB,GACJ,OAAO,EAAS,QAAQ,WACzB,IAAI,GAIf,EAAS,QAAQ,UAAY,GAE7B,EAAwB,EAAW,QAAQ,UACvC,GAAU,EAChB,CAEN,EAAS,QAAQ,SAAW,IAC9B,EACJ,CAIF,EAAU,iBAAiB,EAAsB,GAAK,CAClD,EAAE,iBAAiB,CACnB,GAAM,CAAE,gBAAiB,EAAE,OAErB,EAAa,EAAE,OAAO,QAAQ,gBAAgB,CAGpD,UAAU,aAAe,EAAa,EAAY,EAAa,CAAE,CAC7D,SAAU,aACb,CAAC,EACJ,CAIF,EAAwB,EAAU,ECzGtC,SAAS,iBAAiB,uBAA0B,CAChD,SAAS,iBAAiB,qBAAqB,CAAC,QAAQ,GAAW,CAC/D,EAAoB,CAAE,UAAW,EAAS,CAAC,EAC7C,EACJ"}