{"version":3,"file":"./modules/FormElement.xxxxxxxx.js","mappings":"mMACA,MAAMA,EAAiB,8BAER,MAAMC,EACjB,YAAOC,CAAMC,EAAmBH,GAC5BI,MAAMC,KAAKC,SAASC,iBAAiBJ,IAAWK,QAAQC,IAAuBA,EAAKC,QAAQC,oBAAmBC,SAASC,IACpH,IAAIZ,EAAYY,GAChBA,EAAQH,QAAQC,kBAAoB,MAAM,GAElD,CAEA,WAAAG,CAAmBD,GAAA,KAAAA,QAAAA,EACf,MAAME,EAAUC,KAAKH,QAAQH,QAAQO,QAErCF,EAEM,IAAIG,EAAsBF,KAAKH,QAASE,GACxC,IAAII,EAAmBH,KAAKH,QACtC,EAGG,MAAMM,EAKT,WAAAL,CAAmBD,GAAA,KAAAA,QAAAA,EACfG,KAAKI,mBAAkCJ,KAAKH,QAAQQ,cAAc,kBAClEL,KAAKM,UAAyBN,KAAKH,QAAQQ,cAAc,6BACzDL,KAAKO,UAA8BP,KAAKH,QAAQQ,cAAc,yBAC1DL,KAAKI,oBAAsBJ,KAAKM,WAAaN,KAAKO,WAAWP,KAAKQ,MAC1E,CAEU,IAAAA,GAIN,OAHAR,KAAKS,aACLT,KAAKO,UAAUG,iBAAiB,SAAS,IAAMV,KAAKW,eACpDX,KAAKM,UAAUI,iBAAiB,SAAS,IAAMV,KAAKY,eAC7CZ,IACX,CAEU,UAAAS,GAQN,OAPAT,KAAKO,UAAUG,iBAAiB,SAAS,KACrCV,KAAKI,mBAAmBS,UAAUC,IAAI,yBAAyB,IAGnEd,KAAKO,UAAUG,iBAAiB,QAAQ,KACpCV,KAAKI,mBAAmBS,UAAUE,OAAO,yBAAyB,IAE/Df,IACX,CAEU,UAAAW,GAEN,OADA,QAAYX,KAAKI,mBAAoB,iCAAkCJ,KAAKO,UAAUS,MAAMC,OAAS,GAC9FjB,IACX,CAEU,UAAAY,GAIN,OAHAZ,KAAKO,UAAUS,MAAQ,GACvBhB,KAAKW,aACLX,KAAKO,UAAUW,OACRlB,IACX,EAIG,MAAME,UAA8BC,EAGvC,WAAAL,CAAmBD,EAA8BI,GAC7CkB,MAAMtB,GADS,KAAAA,QAAAA,EAA8B,KAAAI,QAAAA,EAE7CD,KAAKoB,QAA4BpB,KAAKH,QAAQQ,cAAc,WAC5DL,KAAKqB,mBACT,CAEQ,iBAAAA,GACJrB,KAAKoB,QAAQV,iBAAiB,SAAS,KACnC,IAAIY,EAAatB,KAAKO,UAAUS,MAC5BO,GAAoBvB,KAAKC,QAAQuB,QAAQ,KAAO,IAAM,IAC1DC,OAAOC,OAAOC,MAAMC,UAAU,GAAG5B,KAAKC,UAAUsB,UAAyBD,IAAa,GAE9F,EAgBArC,EAAYC,MAAMF,E","sources":["webpack:///./modules/FormElement.ts"],"sourcesContent":["import { toggleClass } from \"../helpers/DOMHelpers\";\r\nconst moduleSelector = '[data-module=\"FormElement\"]';\r\n\r\nexport default class FormElement {\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 FormElement(element);\r\n            element.dataset.moduleInitialized = 'true';\r\n        });\r\n    }\r\n\r\n    constructor(public element: HTMLElement) {\r\n        const ajaxURL = this.element.dataset.ajaxUrl;\r\n\r\n        ajaxURL\r\n\r\n            ? new FormElementNewsletter(this.element, ajaxURL)\r\n            : new DefaultFormElement(this.element);\r\n    }\r\n}\r\n\r\nexport class DefaultFormElement {\r\n    protected formFieldContainer: HTMLElement;\r\n    protected clearIcon: HTMLElement;\r\n    protected inputText: HTMLInputElement;\r\n\r\n    constructor(public element: HTMLElement) {\r\n        this.formFieldContainer = <HTMLElement>this.element.querySelector('.nx-input-text');\r\n        this.clearIcon = <HTMLElement>this.element.querySelector('.nx-input-text__clear-btn');\r\n        this.inputText = <HTMLInputElement>this.element.querySelector('.nx-input-text__field');\r\n        if (this.formFieldContainer && this.clearIcon && this.inputText) this.init();\r\n    }\r\n\r\n    protected init(): DefaultFormElement {\r\n        this.checkFocus();\r\n        this.inputText.addEventListener('input', () => this.checkEmpty());\r\n        this.clearIcon.addEventListener('click', () => this.clearInput());\r\n        return this;\r\n    }\r\n\r\n    protected checkFocus(): DefaultFormElement {\r\n        this.inputText.addEventListener('focus', () => {\r\n            this.formFieldContainer.classList.add('nx-input-text--focused');\r\n        });\r\n\r\n        this.inputText.addEventListener('blur', () => {\r\n            this.formFieldContainer.classList.remove('nx-input-text--focused');\r\n        });\r\n        return this;\r\n    }\r\n\r\n    protected checkEmpty(): DefaultFormElement {\r\n        toggleClass(this.formFieldContainer, 'nx-input-text__clear-btn--show', this.inputText.value.length > 0);\r\n        return this;\r\n    }\r\n\r\n    protected clearInput(): DefaultFormElement {\r\n        this.inputText.value = '';\r\n        this.checkEmpty();\r\n        this.inputText.blur();\r\n        return this;\r\n    }\r\n\r\n}\r\n\r\nexport class FormElementNewsletter extends DefaultFormElement {\r\n    private formBtn: HTMLInputElement;\r\n\r\n    constructor(public element: HTMLElement, private ajaxUrl: string) {\r\n        super(element);\r\n        this.formBtn = <HTMLInputElement>this.element.querySelector('.nx-btn');\r\n        this.initFormWithParam();\r\n    }\r\n\r\n    private initFormWithParam() {\r\n        this.formBtn.addEventListener('click', () => {\r\n            let emailValue = this.inputText.value;\r\n            let connectToAjaxUrl = ~this.ajaxUrl.indexOf(\"?\") ? '&' : '?';\r\n            window.NiveaX.layer.openAsync(`${this.ajaxUrl}${connectToAjaxUrl}email=${emailValue}`);\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    FormElement.setup(moduleSelector);\r\n\r\n    module.hot.accept(() => {\r\n        FormElement.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    FormElement.setup(moduleSelector);\r\n}"],"names":["moduleSelector","FormElement","setup","selector","Array","from","document","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","element","constructor","ajaxURL","this","ajaxUrl","FormElementNewsletter","DefaultFormElement","formFieldContainer","querySelector","clearIcon","inputText","init","checkFocus","addEventListener","checkEmpty","clearInput","classList","add","remove","value","length","blur","super","formBtn","initFormWithParam","emailValue","connectToAjaxUrl","indexOf","window","NiveaX","layer","openAsync"],"sourceRoot":""}