{"version":3,"file":"./modules/Ingredient.xxxxxxxx.js","mappings":"oKAGA,MAAMA,EAAiB,6BAER,MAAMC,EAGjB,YAAOC,CAAMC,EAAmBH,GAC5BI,MAAMC,KAAKC,SAASC,iBAAiBJ,IAAWK,QAAQC,IAAuBA,EAAKC,QAAQC,oBAAmBC,SAASC,IACpH,IAAIZ,EAAWY,GACfA,EAAQH,QAAQC,kBAAoB,MAAM,GAElD,CAEA,WAAAG,CAAmBD,EAAsBE,EAAwC,CAAC,GAA/D,KAAAF,QAAAA,EACfG,KAAKD,SAAU,QAAWC,KAAKH,QAASI,OAAOC,OAAOF,KAAKG,oBAAqBJ,IAChF,MAAMK,EAAkBhB,MAAMC,KAAKC,SAASC,iBAAiBS,KAAKD,QAAQM,iBACtED,GAAiBA,EAAgBE,KAAIC,GAAkBA,EAAeC,iBAAiB,SAAUC,GAAUT,KAAKU,mBAAmBD,MAC3I,CAEA,kBAAAC,CAAmBD,GACfA,EAAME,iBAEN,MAAMC,EAAaH,EAAMI,cACrBC,EAAwBF,GAAa,QAAWA,GAAc,CAAC,EAEnE,IACI,IAAIG,EAAef,KAAKgB,gBAAgBF,E,CAC1C,MAAOG,GACLC,EAAQC,MAAMF,E,CAGdF,GACAK,OAAOC,MAAMC,MAAK,QAAkBP,GAE5C,CAEQ,eAAAC,CAAgBF,GACpB,GAAqD,IAAjDb,OAAOsB,QAAQT,GAAuBU,OACtC,KAAM,kDAGV,MAAM,MAAEC,EAAK,MAAEC,EAAK,YAAEC,EAAW,QAAEC,GAAYd,GACzC,SAAEe,EAAQ,aAAEC,EAAY,cAAEC,GAAkB/B,KAAKD,QAkBvD,MAXqB,kJALH0B,EAAQ,mDAAmDA,cAAoB,+BAD7EC,EAAQ,qEAAqEA,SAAe,+BAExFC,EAAc,mEAAmEA,QAAoB,+BAC7GC,GAAWC,EAAW,iFAAiFD,MAAYC,cAAuB,+BACnIC,GAAgBC,EAAgB,2FAA2FD,MAAiBC,QAAsB,gDAc7L,CAEO,iBAAA5B,GACH,MAAO,CACHE,eAAgB,sBAExB,EAgBApB,EAAWC,MAAMF,E","sources":["webpack:///./modules/Ingredient.ts"],"sourcesContent":["import { getOptions } from '../helpers/helperFunctions';\r\nimport { adjustLayerMarkUp } from '../helpers/DOMHelpers';\r\n\r\nconst moduleSelector = '[data-module=\"Ingredient\"]';\r\n\r\nexport default class Ingredient {\r\n    protected options: IngredientsOptions;\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 Ingredient(element);\r\n            element.dataset.moduleInitialized = 'true';\r\n        });\r\n    }\r\n\r\n    constructor(public element: HTMLElement, options: Optional<IngredientsOptions> = {}) {\r\n        this.options = getOptions(this.element, Object.assign(this.getDefaultOptions(), options));\r\n        const ingredientItems = Array.from(document.querySelectorAll(this.options.IngredientItem));\r\n        if (ingredientItems) ingredientItems.map(ingredientItem => ingredientItem.addEventListener('click', (event) => this.showIngredientInfo(event)));\r\n    }\r\n\r\n    showIngredientInfo(event) {\r\n        event.preventDefault();\r\n\r\n        const ingredient = event.currentTarget as HTMLElement,\r\n            ingredientItemOptions = ingredient ? getOptions(ingredient) : {};\r\n\r\n        try {\r\n            var layerContent = this.getLayerContent(ingredientItemOptions);\r\n        } catch (err) {\r\n            console.error(err);\r\n        }\r\n\r\n        if (layerContent) {\r\n            NiveaX.layer.open(adjustLayerMarkUp(layerContent));\r\n        }\r\n    }\r\n\r\n    private getLayerContent(ingredientItemOptions): string {\r\n        if (Object.entries(ingredientItemOptions).length === 0) {\r\n            throw ('Ingredient item options are empty or not set...');\r\n        }\r\n\r\n        const { image, title, description, ctaLink } = ingredientItemOptions;\r\n        const { ctaLabel, glossaryLink, glossaryLabel } = this.options;\r\n        const titleMarkup = title ? `<h2 class=\"nx-txt-uppercase nx-font--extrabold nx-font-heading-2\">${title}</h2>` : '',\r\n            imageMarkup = image ? `<div class=\"nx-ingredient-item-image\"><img src=\"${image}\" /></div>` : '',\r\n            descriptionMarkup = description ? `<p class=\"nx-cpy-1 nx-u-mt-base-0 nx-font--bold nx-font-body-1\">${description}</p>` : '',\r\n            ctaMarkup = ctaLink && ctaLabel ? `<div class=\"nx-content-teaser__btn\"><a class=\"nx-btn nx-btn--secondary\" href=\"${ctaLink}\">${ctaLabel}</a></div>` : '',\r\n            actionLinkMarkup = glossaryLink && glossaryLabel ? `<a class=\"nx-action-link nx-font-text-link-medium nx-font--bold nx-txt-uppercase\" href=\"${glossaryLink}\">${glossaryLabel}</a>` : '';\r\n\r\n        const layerContent = ` \r\n            <div class=\"nx-u-container\">\r\n                <div class=\"nx-layer__ingredient-info nx-u-txt--center\">\r\n                        ${imageMarkup}\r\n                        ${titleMarkup}\r\n                        ${descriptionMarkup}\r\n                        ${ctaMarkup}\r\n                        ${actionLinkMarkup}\r\n                </div>\r\n            </div>`;\r\n\r\n        return layerContent;\r\n    }\r\n\r\n    public getDefaultOptions() {\r\n        return {\r\n            IngredientItem: '.nx-ingredient-item'\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    Ingredient.setup(moduleSelector);\r\n\r\n    module.hot.accept(() => {\r\n        Ingredient.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    Ingredient.setup(moduleSelector);\r\n}"],"names":["moduleSelector","Ingredient","setup","selector","Array","from","document","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","element","constructor","options","this","Object","assign","getDefaultOptions","ingredientItems","IngredientItem","map","ingredientItem","addEventListener","event","showIngredientInfo","preventDefault","ingredient","currentTarget","ingredientItemOptions","layerContent","getLayerContent","err","console","error","NiveaX","layer","open","entries","length","image","title","description","ctaLink","ctaLabel","glossaryLink","glossaryLabel"],"sourceRoot":""}