{"version":3,"file":"index.es.min.js","sources":["../../../packages/helpers/src/props.helpers.js","../../../packages/components/src/constants.mjs","../../../packages/helpers/src/assets/js/eventDispatch.js","../../../packages/helpers/src/utils.ts","../../../packages/components/src/form/form.js"],"sourcesContent":["const getData = attributes => attributes.find(attribute => attribute.nodeName === 'data')\n\nconst createProps = attributes => {\n const data = getData([...attributes])\n const props = [...attributes]\n .filter(attribute => attribute.nodeName !== 'data')\n .reduce((all, attr) => {\n return { ...all, [attr.nodeName]: attr.nodeValue }\n }, {})\n\n if (isNil(data)) {\n return props\n }\n\n try {\n return { ...props, ...JSON.parse(data.nodeValue) }\n } catch (error) {\n console.log('ERROR: No data', error, data?.nodeValue)\n }\n}\n\nconst isNil = obj => obj === undefined || obj === null\n\nexport const parseBool = value => (!value || value === 'false' ? false : true)\n\nexport default createProps\n","export const MAX_WIDTH_CONTAINER = 1160\n\nexport const BREAKPOINT_XL = 1920\nexport const BREAKPOINT_TABLET = 1024\nexport const BREAKPOINT_L = 996\nexport const BREAKPOINT_M = 768\nexport const BREAKPOINT_S = 750\nexport const BREAKPOINT_XS = 375\n\nexport const CTA_PRIMARY = 'primary'\nexport const CTA_PRIMARY_TRANSPARENT = 'primary_transparent'\nexport const CTA_SUBTLE = 'subtle'\nexport const CTA_LINK = 'link'\nexport const CTA_LINK_UNDERLINE = 'link-underline'\nexport const CTA_LINK_GOLD = 'link-gold'\nexport const CTA_LINK_ADD_TO_CART_SMALL = 'AddToCart_small'\nexport const CTA_LINK_ADD_TO_CART_LARGE = 'AddToCart_large'\n\nexport const EVENT_TAB_CHANGE = 'EVENT_TAB_CHANGE'\n\nexport const EVENT_VIDEO = 'WEB_COMPONENT_VIDEO'\nexport const EVENT_POPIN_OPEN = 'WEB_COMPONENT_POPIN_OPEN'\nexport const EVENT_POPIN_OPENED = 'WEB_COMPONENT_POPIN_OPENED'\nexport const EVENT_POPIN_CLOSE = 'WEB_COMPONENT_POPIN_CLOSE'\nexport const EVENT_POPIN_CLOSED = 'WEB_COMPONENT_POPIN_CLOSED'\nexport const EVENT_POPIN_CLOSE_CLICK = 'WEB_COMPONENT_POPIN_CLOSE_CLICK'\nexport const EVENT_POPIN_KEY_DOWN = 'keydown'\nexport const EVENT_POPIN_FORM_TOGGLE_TITLE = 'WEB_COMPONENT_POPIN_FORM_TOGGLE_TITLE'\nexport const EVENT_CTA_CLICK = 'WEB_COMPONENT_CTA_CLICK'\nexport const EVENT_HERO_REORDER_OPEN = 'WEB_COMPONENT_HERO_REORDER_OPEN'\nexport const EVENT_HERO_REORDER_CLOSE = 'WEB_COMPONENT_HERO_REORDER_CLOSE'\nexport const EVENT_QUICKVIEW_OPEN = 'WEB_COMPONENT_QUICKVIEW_OPEN'\nexport const EVENT_QS_OPEN = 'WEB_COMPONENT_QS_OPEN'\nexport const EVENT_QS_OPENED = 'WEB_COMPONENT_QS_OPENED'\nexport const EVENT_QS_CLOSE = 'WEB_COMPONENT_QS_CLOSE'\nexport const EVENT_QS_CLOSED = 'WEB_COMPONENT_QS_CLOSED'\nexport const EVENT_QS_CLOSE_CLICK = 'WEB_COMPONENT_QS_CLOSE_CLICK'\nexport const EVENT_QS_KEY_DOWN = 'keydown'\nexport const EVENT_ADD_TO_CART = 'WEB_COMPONENT_ADD_TO_CART'\nexport const EVENT_CART_UPDATED = 'WEB_COMPONENT_CART_UPDATED'\nexport const EVENT_VIDEO_TOGGLE = 'WEB_COMPONENT_VIDEO_TOGGLE'\nexport const VIDEO_ON_HOVER = 'VIDEO_ON_HOVER'\nexport const VIDEO_ON_OUT = 'VIDEO_ON_OUT'\nexport const EVENT_DETAIL_OPEN = 'WEB_COMPONENT_DETAIL_OPEN'\nexport const EVENT_SLIDER_READY = 'WEB_COMPONENT_SLIDER_READY'\nexport const EVENT_SLIDE_CHANGE = 'WEB_COMPONENT_SLIDE_CHANGE'\nexport const EVENT_OVERLAY_OPEN = 'WEB_COMPONENT_OVERLAY_OPEN'\nexport const EVENT_OVERLAY_CLOSE = 'WEB_COMPONENT_OVERLAY_CLOSE'\nexport const EVENT_OVERLAY_CLICKED = 'WEB_COMPONENT_OVERLAY_CLICKED'\nexport const EVENT_OPEN_PRODUCT_AR_CLICKED = 'OPEN_PRODUCT_AR_CLICKED'\nexport const EVENT_SORT_BY_CHANGE = 'WEB_COMPONENT_SORT_BY_CHANGE'\n\nexport const EVENT_BUBBLE_SELECTED = 'EVENT_BUBBLE_SELECTED'\nexport const EVENT_RECO_TOOL_OPTION_CLICKED = 'EVENT_RECO_TOOL_OPTION_CLICKED'\nexport const WEB_COMPONENT_PROJECTS_LOADED = 'WEB_COMPONENT_PROJECTS_LOADED'\nexport const WEB_COMPONENT_ANCHOR_LOADED = 'WEB_COMPONENT_ANCHOR_LOADED'\n\nexport const EVENT_SWIPED_UP = 'swiped-up'\nexport const EVENT_SWIPED_DOWN = 'swiped-down'\nexport const EVENT_SWIPED_LEFT = 'swiped-left'\nexport const EVENT_SWIPED_RIGHT = 'swiped-right'\n\nexport const EVENT_HEADER_POSITION_CHANGED = 'EVENT_HEADER_POSITION_CHANGED'\n\nexport const keys = { ESC: 'Escape' }\n\nexport const ADD_TO_CART_MODIFIER_MINI = 'mini'\nexport const ADD_TO_CART_MODIFIER_DEFAULT = ADD_TO_CART_MODIFIER_MINI\n\nexport const COFFEE_ORIGINAL = 'original'\nexport const COFFEE_VERTUO = 'vertuo'\nexport const COFFEE_PRO = 'pro'\nexport const COFFEE_OL = 'OL'\nexport const COFFEE_VL = 'VL'\nexport const INTENSITY_MAX_OL = 14\nexport const INTENSITY_MAX_VL = 12\nexport const DEFAULT_BUBBLE_ICON = ''\n\nexport const NUMBER_PRODUCTS_SLIDER = 8\nexport const NUMBER_FEATURES_PDP = 8\n\nexport const ALIGNMENT = ['center', 'left', 'right']\nexport const POSITION = ['top', 'right', 'bottom', 'left']\nexport const TRANSLATION_ADD_TO_CART = 'Add to cart'\nexport const TRANSLATION_UPDATE_BASKET = 'Update basket'\n\nexport const TIME_INSTANT = 1\nexport const TIME_FAST = 300\nexport const TIME_MEDIUM = 600\nexport const TIME_SLOW = 1200\n\nexport const APP_APPLE_LINK = {\n default: 'https://apps.apple.com/us/app/nespresso/id342879434',\n us: 'https://apps.apple.com/us/app/nespresso-new/id1609639566',\n uk: 'https://apps.apple.com/gb/app/nespresso-new/id1609639566',\n kr: 'https://apps.apple.com/kr/app/%EB%84%A4%EC%8A%A4%ED%94%84%EB%A0%88%EC%86%8C-%EB%B6%80%ED%8B%B0%ED%81%AC/id1609639566'\n}\nexport const APP_ANDROID_LINK =\n 'https://play.google.com/store/apps/details?id=com.nespresso.activities'\nexport const APP_HUAWEI_LINK = 'https://appgallery.huawei.com/app/C102571517'\n\nexport const SRC_PAGE_PLP = 'plp'\nexport const SRC_PAGE_PDP = 'pdp'\n\nexport const PLP_TYPE_COFFEE = 'coffee'\nexport const PLP_TYPE_MACHINE = 'machine'\nexport const PLP_TYPE_ACCESSORY = 'accessory'\nexport const CALLEO_API_DOMAIN = 'https://www.contact.nespresso.com/'\n\n// SCSS RELATED\n// Todo : should be shared by JS and SCSS\nexport const BROWSER_CONTEXT = 16 // 1rem = 16px\nexport const COLOR_WHITE_1000 = '#FFFFFF' // Do not change for #FFF shortcut, it will break slider-natural gradients !\n\nexport const CONTRAST_DARK = 'dark'\nexport const CONTRAST_LIGHT = 'light'\n\nexport const B2B_CONTACT_FORM_POPIN_ID = 'b2b-contact-form-popin-id'\nexport const B2B_CONTACT_FORM_POPIN_SRC_SEARCH = 'coveo-search'\n\nexport const B2B_CONTACT_FORM_POPIN_SRC_SKU_MAIN_INFO = 'sku-main-info'\n\nexport const B2B_CONTACT_FORM_POPIN_SRC_SKU_MAIN_INFO_AUTO = 'sku-main-info-auto'\n\nexport const ASPECT_RATIO_16_9 = '16/9'\nexport const ASPECT_RATIO_1_1 = '1/1'\n\nexport const NESPRESSO_PRODUCTION_DOMAIN = 'https://www.nespresso.com'\nexport const NESPRESSO_ROLLOUT_DOMAIN = 'https://nc2-env-rollout.nespresso.com'\n\nexport const EVENT_QUIZ_ON_GO_BACK = 'WEB_COMPONENT_EVENT_QUIZ_ON_GO_BACK'\nexport const EVENT_QUIZ_SUBMIT = 'WEB_COMPONENT_EVENT_QUIZ_SUBMIT'\n","export const dispatchEvent = ({ eventName, args, element }) => {\n // Use the provided element or fallback to window if available\n if (!element) {\n if (typeof window !== 'undefined') {\n element = window\n } else {\n throw new Error(\n '`element` is not provided and `window` is unavailable. Provide a valid element to dispatch the event.'\n )\n }\n }\n\n let event\n if (args) {\n event = new CustomEvent(eventName, { detail: args, bubbles: true })\n } else {\n if (typeof Event === 'function') {\n event = new Event(eventName)\n } else {\n event = document.createEvent('Event')\n event.initEvent(eventName, true, true)\n }\n }\n element.dispatchEvent(event)\n}\n\nexport const readEvent = e => {\n if (!e.detail) {\n return\n }\n return e.detail\n}\n","export { waitForSelector } from './waitForSelector'\n\nexport const constants = {\n LEFT: 37,\n UP: 38,\n RIGHT: 39,\n DOWN: 40,\n ESC: 27,\n SPACE: 32,\n ENTER: 13,\n TAB: 9\n}\n\nexport function capitalize(s = '') {\n return s[0].toUpperCase() + s.slice(1)\n}\n\nexport const convertToCamelCase = (str: string): string => {\n const arr = str.match(/[a-z]+|\\d+/gi)\n if (!arr) { return str }\n return arr.map((m, i) => {\n let low = m.toLowerCase()\n if (i !== 0) {\n low = low.split('').map((s, k) => (k === 0 ? s.toUpperCase() : s)).join(\"\")\n }\n return low\n }).join(\"\")\n}\n\nexport function slug(s = '') {\n return s\n .toLowerCase()\n .trim()\n .replace(/\\s+/g, '-') // Replace spaces with -\n .replace(/[^\\w-]+/g, '') // Remove all non-word chars\n .replace(/--+/g, '-') // Replace multiple - with single -\n}\n\nexport function pxToEm(target: number, stripedInnerFontSize = 1) {\n return target / 14 / stripedInnerFontSize + 'em'\n}\n\nexport function percent(target: number) {\n return target + '%'\n}\n\nexport function parseHTML(str: string) {\n const tmp = document.implementation.createHTMLDocument('')\n tmp.body.innerHTML = str\n return tmp.body.childNodes\n}\n\nexport function stripHTML(str: string) {\n const tmp = document.implementation.createHTMLDocument('')\n tmp.body.innerHTML = str\n return (tmp.body.textContent ?? \"\").replace(RegExp('[\\\\s|\\'|\"]', 'g'), '')\n}\n\nexport function makeId(length: number) {\n var result = ''\n var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'\n var charactersLength = characters.length\n for (var i = 0; i < length; i++) {\n result += characters.charAt(Math.floor(Math.random() * charactersLength))\n }\n return result\n}\n\nexport function removeEmptyValues(obj: { [key: string]: any }): { [key: string]: any } {\n const findText = [\n 'Default campaign ID (tracking missing in Page Builder export)',\n 'Default campaign name (tracking missing in Page Builder export)',\n 'promoname', \n 'promoid', \n 'promocreative', \n 'undefined'\n ];\n \n for (let key in obj) {\n const value = obj[key];\n \n if (value === null || value === undefined || value === '') {\n delete obj[key];\n continue;\n }\n \n if (typeof value === 'string') {\n for (const text of findText) {\n if (value.includes(text)) {\n delete obj[key];\n break;\n }\n }\n }\n }\n \n return obj;\n}\n\nexport function makeHash(str: string) {\n var hash = 0,\n i,\n chr\n if (!str) {\n return hash\n }\n for (i = 0; i < str.length; i++) {\n chr = str.charCodeAt(i)\n hash = (hash << 5) - hash + chr\n hash |= 0 // Convert to 32bit integer\n }\n return 'id-' + hash\n}\n\nexport function getHashLink(link: string) {\n let linkHash = link\n let linkNoHash = link\n if (link.indexOf('#') !== -1) {\n linkNoHash = link.replace('#', '')\n } else {\n linkHash = '#' + link\n }\n\n return { linkNoHash, linkHash }\n}\n\nexport function lazyLoad(node: Element, attribute: string, value: any, url: string) {\n const CLASSNAME_OUT_OF_SCREEN = 'lazy-load'\n const CLASSNAME_IN_SCREEN = 'lazy-loaded'\n const CLASSNAME_ON_ERROR = 'lazy-loaded-error'\n\n const isOldIOS = () => {\n var agent = window.navigator.userAgent,\n start = agent.indexOf('OS ')\n if ((agent.indexOf('iPhone') > -1 || agent.indexOf('iPad') > -1) && start > -1) {\n return window.Number(agent.substr(start + 3, 3).replace('_', '.')) < 14\n }\n return false\n }\n\n const inViewPort = (attribute: string, value: any) => {\n node.setAttribute(attribute, value)\n\n const cb = () => node.classList.add(CLASSNAME_IN_SCREEN)\n\n if (url) {\n const img = new Image()\n img.src = url\n img.onload = cb\n img.onerror = () => {\n cb()\n node.classList.add(CLASSNAME_ON_ERROR)\n throw new Error(`Image ${url} cannot be loaded`)\n }\n\n return\n }\n\n cb()\n }\n\n if (/Trident\\/|MSIE/.test(window.navigator.userAgent) || isOldIOS()) {\n inViewPort(attribute, value)\n } else {\n if ('IntersectionObserver' in window) {\n node.classList.add(CLASSNAME_OUT_OF_SCREEN)\n let lazyBackgroundObserver = new IntersectionObserver(function (entries) {\n entries.forEach(function (entry) {\n if (entry.isIntersecting) {\n inViewPort(attribute, value)\n lazyBackgroundObserver.unobserve(entry.target)\n }\n })\n })\n lazyBackgroundObserver.observe(node)\n } else {\n inViewPort(attribute, value)\n }\n }\n}\n\nexport function lazyLoadCallback(node: Element, cb: () => void) {\n const isOldIOS = () => {\n var agent = window.navigator.userAgent,\n start = agent.indexOf('OS ')\n if ((agent.indexOf('iPhone') > -1 || agent.indexOf('iPad') > -1) && start > -1) {\n return window.Number(agent.substr(start + 3, 3).replace('_', '.')) < 14\n }\n return false\n }\n\n if (/Trident\\/|MSIE/.test(window.navigator.userAgent) || isOldIOS()) {\n cb()\n } else {\n if ('IntersectionObserver' in window) {\n let lazyBackgroundObserver = new IntersectionObserver(\n function (entries) {\n entries.forEach(function (entry) {\n if (entry.isIntersecting) {\n cb()\n lazyBackgroundObserver.unobserve(entry.target)\n }\n })\n },\n { rootMargin: '150% 0px' }\n )\n lazyBackgroundObserver.observe(node)\n }\n }\n}\n\n// Debounce\nexport function debounce<T>(func: (v: T) => void, time = 100) {\n let timer: number\n return function (event: T) {\n if (timer) {\n window.clearTimeout(timer)\n }\n timer = window.setTimeout(func, time, event)\n }\n}\n\n// isIE - to check for internet explorer\nexport function isIE() {\n let ua = window.navigator.userAgent,\n isIE = /MSIE|Trident/.test(ua)\n\n return isIE\n}\n\n// Load external script\nexport const loadExternalScript = ({\n src,\n callback = null,\n async = false,\n defer = false,\n module = false,\n id = ''\n}: {\n src: string;\n callback: null | GlobalEventHandlers[\"onload\"]\n module: boolean,\n defer: boolean,\n async: boolean,\n id: string\n}) => {\n const script = document.createElement('script')\n script.type = module ? 'module' : 'text/javascript'\n script.src = src\n id ? (script.id = id) : false // add id attribute only if passed\n if (typeof callback === 'function') {\n script.onload = callback\n }\n script.async = async\n script.defer = defer\n document.body.appendChild(script)\n}\n\n// Load external css\nexport const loadExternalCss = ({ src }: { src: string }) => {\n const script = document.createElement('link')\n script.rel = 'stylesheet'\n script.href = src\n document.body.appendChild(script)\n}\n// Lazy load vendor script\nexport const lazyLoadVendorScript = (handler, el) => {\n const observer = new IntersectionObserver(handler)\n observer.observe(el)\n}\n\n/**\n * Replaces variable inside a given string\n * Each variable have to be enclosed between stChr and enChr\n * The values have to be contained in the vars object, they key must match\n * example :\n * txt : 'See {resultsLength} Results'\n * vars : {resultsLength:'30'}\n * stChr : '{'\n * enChr : '}'\n *\n * will return : 'See 30 Results'\n *\n * @param {string} txt\n * @param {object} vars\n * @param {string} stChr\n * @param {string} enChr\n */\nexport function interpolate(txt: string, vars: Record<string, null | undefined | string>, stChr: string, enChr: string) {\n let curIdx = 0\n\n while (txt) {\n const stIdx = txt.indexOf(stChr, curIdx)\n if (stIdx === -1) {\n break\n }\n const enIdx = txt.indexOf(enChr, stIdx + 1)\n if (enIdx === -1) {\n break\n }\n const hashId = txt.substring(stIdx + stChr.length, enIdx)\n if (vars[hashId] != null) {\n txt = txt.substr(0, stIdx) + vars[hashId] + txt.substr(enIdx + enChr.length)\n curIdx = stIdx\n } else {\n curIdx = enIdx\n }\n }\n return txt\n}\n\n/**\n * Find in container element, add height to equal size of element\n * @param container css path where my element is contain e.g. `.c-container`\n * @param el css path of elements to equalized\n */\nexport const equalHeight = (containerSelector: string, el: string, elementScope: HTMLElement) => {\n const container = elementScope.querySelector<HTMLElement>(containerSelector)\n if (!container) {\n return\n }\n\n const items = container.querySelectorAll<HTMLElement>(el)\n let max = -1\n\n for (let i = 0; i < [...items].length; i++) {\n const item = [...items][i]\n let h = item.offsetHeight\n max = h > max ? h : max\n }\n\n if (max <= 0) {\n return\n }\n\n for (let i = 0; i < [...items].length; i++) {\n const item = [...items][i]\n item.style.height = `${max}px`\n }\n}\n\nexport const stringifyCurlyQuote = (data: {}) => JSON.stringify(data).replace(\"'\", '’')\n\nexport const stringifyForAttribute = (data = {}) => {\n return escapeHtml(JSON.stringify(data))\n}\n\n/**\n * This function is included instead of sanitizeString because for\n * inserting HTML into innerHTML we need to make sure all HTML\n * entities are escaped.\n */\nexport const escapeHtml = (text: string) => {\n const map = {\n '&': '&',\n '<': '<',\n '>': '>',\n '\"': '"',\n \"'\": '''\n } as { [s: string]: string }\n\n return text.replace(/[&<>\"']/g, (m) => map[m])\n}\n\n/**\n * Because setting attributes escapes more than the characters above and then preact also\n * escapes text we need a more complete way of unescaping all html entities (not just the ones\n * above)\n */\nconst domParser = new DOMParser()\nexport const unescapeHtml = (text: string) => {\n return domParser.parseFromString(text, \"text/html\").body.textContent\n}\n\nexport const sanitizeString = (data: {}) => {\n if (!data) {\n return ''\n }\n\n return data.toString().replace(/\"/g, '"').replace(/'/g, ''')\n}\n\nexport const stripTags = (s: string) => {\n return (s || '').replace(/(<([^>]+)>)/gi, '')\n}\n\nexport const setAttributes = (element: Element, attrs: Record<string, any>) => {\n for (let key in attrs) {\n element.setAttribute(key, attrs[key])\n }\n return element\n}\n\nexport const getMetaContent = (metaName: string) => {\n const metaTag = document.querySelector(`meta[name=${metaName}]`)\n if (!metaTag) {\n return ''\n }\n return metaTag.getAttribute('content')\n}\n\nexport const isObjectEmpty = (obj: {}) => {\n return Object.keys(obj).length === 0\n}\n","import createProps from '@kissui/helpers/src/props.helpers'\nimport { EVENT_POPIN_FORM_TOGGLE_TITLE } from '../constants.mjs'\n// Todo : We will need to remove this if modal is updated by DS Team with always title on top with icon before\nimport { dispatchEvent } from '@kissui/helpers/src/assets/js/eventDispatch'\nimport { loadExternalScript, stringifyForAttribute } from '@kissui/helpers/src/utils'\n\nconst SHOW_LOADER_CLASS = 'show-loader'\nconst HIDE_FORM_CLASS = 'hide-form'\n\nclass Form extends HTMLElement {\n constructor() {\n super()\n this.boundCancel = this.onCancel.bind(this)\n this.boundSubmit = this.onSubmit.bind(this)\n this.boundFormData = this.onFormData.bind(this)\n this.boundBackToForm = this.onBackToForm.bind(this)\n this.boundClose = this.onClose.bind(this)\n\n this.url = null\n }\n\n connectedCallback() {\n this.props = createProps(this.attributes)\n this.classList.add('nb-form')\n this.render()\n this.bindEvent()\n }\n\n render() {\n const { element_id, element_name, elements } = this.props\n\n if (!elements || !elements.length) {\n return null\n }\n\n this.innerHTML = `\n <form id=\"${element_id}\" name=\"${element_name}\" method=\"post\" tabindex=\"0\" novalidate/>\n ${this.renderElements()}\n ${this.renderTermsOfUse()}\n ${this.renderGoogleCaptcha()}\n <div class='cb-action'>\n ${this.renderSubmit()}\n ${this.renderCancel()}\n </div>\n </form>\n <div class=\"cb-overlay\"><nb-loader></nb-loader></div>\n `\n\n this.form = this.querySelector('form')\n this.elements = this.querySelectorAll(\n 'nb-checkbox, nb-input-text, nb-textarea, nb-star-rating'\n )\n this.ctaDropdownList = this.querySelectorAll('.nb-dropdown')\n this.ctaCancel = this.querySelector('.cb-cancel')\n this.ctaSubmit = this.querySelector('.cb-submit')\n }\n\n renderGoogleCaptcha() {\n const { recaptcha_id, captcha_message = 'Captcha is required', element_id } = this.props\n if (!recaptcha_id) {\n return ''\n }\n\n loadExternalScript({\n src: 'https://www.google.com/recaptcha/api.js',\n async: true,\n defer: true\n })\n\n // Google reCaptcha is expecting these callback functions in window object,so we can't pass custom functions from web components\n window.NNPBCaptchaSuccess = () => {\n const captchaBadge = document.querySelector(`form#${element_id} .grecaptcha-badge`)\n captchaBadge.classList.remove('cb-empty')\n }\n\n window.NNPBCaptchaExpired = () => {\n const captchaBadge = document.querySelector(`form#${element_id} .grecaptcha-badge`)\n captchaBadge.classList.add('cb-empty')\n }\n\n return `<div class=\"grecaptcha-badge\">\n <div class=\"g-recaptcha\" data-sitekey=\"${recaptcha_id}\"\n data-callback=\"NNPBCaptchaSuccess\"\n data-expired-callback=\"NNPBCaptchaExpired\"> </div>\n <input type=\"hidden\" name=\"captchaToken\" id=\"captchaToken\" />\n <mark role=\"alert\" class=\"cb-empty t-2xs-500-sl\">${captcha_message}</mark>\n </div>`\n }\n\n renderElements() {\n const { elements } = this.props\n if (!elements || !elements.length) {\n return ''\n }\n\n return elements\n .map(\n element =>\n `<nb-${element.type} ${\n element.className ? `class='${element.className}'` : ''\n } data='${stringifyForAttribute(element)}'></nb-${element.type}>`\n )\n .join('')\n }\n\n renderTermsOfUse() {\n const { terms_of_use } = this.props\n\n if (!terms_of_use) {\n return ''\n }\n\n return `<p class=\"wysiwyg t-sm-400\">${terms_of_use}</p>`\n }\n\n renderCancel() {\n const { cancel_cta } = this.props\n\n if (!cancel_cta) {\n return ''\n }\n\n return `<nb-cta class=\"cb-cancel\" variation=\"tertiary\">${cancel_cta}</nb-cta>`\n }\n\n renderSubmit() {\n const { submit_cta } = this.props\n\n if (!submit_cta) {\n return ''\n }\n\n return `<nb-cta class=\"cb-submit\" variation=\"secondary\">${submit_cta}</nb-cta>`\n }\n\n onCancel(e) {\n e.preventDefault()\n // Close popin\n }\n\n onSubmit(e) {\n e.preventDefault()\n new FormData(this.form)\n }\n\n onFormData(e) {\n let isValid = true\n\n // Please keep commented, useful for debugging formData values\n // for (let value of e.formData.entries()) {\n // console.log(value[0], value[1])\n // }\n\n this.elements.forEach(el => {\n let success = el.checkValidity()\n isValid = isValid && success\n })\n\n if (window.grecaptcha) {\n let successCaptcha = this.checkGoogleReCaptcha()\n isValid = isValid && successCaptcha\n }\n\n if (!isValid) {\n return\n }\n\n // Sending\n this.toggleLoader()\n this.submitValidForm(e)\n\n // Todo : Temp this is a way to send form via request, but we will have an API\n // const request = new XMLHttpRequest()\n // request.addEventListener('load', this.onSuccess())\n // request.addEventListener('error', this.onError())\n // request.open(\"POST\", \"submitform.php\")\n // request.send(formData)\n\n // Todo :Temp always triggering error\n // setTimeout(() => {\n // this.onError()\n // }, 2000)\n\n // Todo : Temp always triggering error\n // setTimeout(() => {\n // this.onSuccess()\n // }, 2000)\n }\n\n checkGoogleReCaptcha() {\n // do not act as the captcha token belongs to Calleo agency\n if (window.nnEearlyAccessFormSubmit) {\n return\n }\n const captchaBadge = this.querySelector('.grecaptcha-badge')\n const captchaEl = captchaBadge.querySelector('.g-recaptcha-response')\n\n if (!captchaEl) {\n return true\n }\n if (!captchaEl?.value) {\n captchaBadge.classList.add('cb-empty')\n } else {\n captchaBadge.classList.remove('cb-empty')\n }\n return !!captchaEl?.value\n }\n\n // Implement it in the caller\n submitValidForm() {}\n\n toggleElement(classname) {\n if (this.classList.contains(classname)) {\n this.classList.remove(classname)\n } else {\n this.classList.add(classname)\n }\n }\n\n toggleLoader() {\n this.toggleElement(SHOW_LOADER_CLASS)\n }\n\n toggleForm() {\n this.toggleElement(HIDE_FORM_CLASS)\n }\n\n onError(errorMessage) {\n const { error } = this.props\n this.error = true\n this.renderRequestMessage(error, errorMessage)\n }\n\n onSuccess() {\n const { success } = this.props\n this.success = true\n this.renderRequestMessage(success)\n }\n\n renderRequestMessage(value, errorMessage) {\n this.requestMessage = document.createElement('div')\n this.requestMessage.classList.add('cb-message')\n this.requestMessage.setAttribute('role', 'alert')\n this.requestMessage.setAttribute('tabindex', '0')\n let errorMessageElement = ''\n if (errorMessage) {\n errorMessageElement = `<p class='t-sm-400'>${errorMessage}</p>`\n }\n\n this.requestMessage.innerHTML = `\n <nb-icon icon=\"${value.icon}\"></nb-icon>\n <h2 class=\"h-lg-700\">${value.heading}</h2>\n <p class='t-sm-400'>${value.description}</p>\n ${errorMessageElement}\n <nb-cta class='cb-back' variation=\"secondary\">${value.cta}</nb-cta>\n `\n // Insert after js trick\n this.form.parentNode.insertBefore(this.requestMessage, this.form.nextSibling)\n this.bindRequestMessageCta()\n this.toggleForm()\n this.toggleLoader()\n this.requestMessage.focus()\n // Todo : We will need to remove this if modal is updated by DS Team with always title on top with icon before\n dispatchEvent({\n eventName: EVENT_POPIN_FORM_TOGGLE_TITLE,\n args: {}\n })\n }\n\n bindRequestMessageCta() {\n this.ctaBack = this.querySelector('.cb-back')\n if (this.error) {\n this.ctaBack.addEventListener('click', this.boundBackToForm)\n }\n if (this.success) {\n this.ctaBack.addEventListener('click', this.boundClose)\n }\n }\n\n onBackToForm() {\n this.toggleLoader()\n setTimeout(() => {\n this.requestMessage.remove()\n this.toggleForm()\n this.toggleLoader()\n this.form.focus()\n // Todo : We will need to remove this if modal is updated by DS Team with always title on top with icon before\n dispatchEvent({\n eventName: EVENT_POPIN_FORM_TOGGLE_TITLE,\n args: {}\n })\n }, 500)\n }\n\n onClose() {\n // Close popin\n }\n\n setUrl(url) {\n this.url = url\n }\n\n bindEvent() {\n if (this.ctaDropdownList) {\n for (let i = 0; i < this.ctaDropdownList.length; i++) {\n this.ctaDropdownList[i].addEventListener('click', e => {\n e.preventDefault()\n e.stopPropagation()\n })\n }\n }\n if (this.ctaSubmit) {\n this.ctaSubmit.addEventListener('click', this.boundSubmit)\n }\n if (this.ctaCancel) {\n this.ctaCancel.addEventListener('click', this.boundCancel)\n }\n if (this.form) {\n this.form.addEventListener('formdata', this.boundFormData)\n }\n }\n\n unbindEvent() {\n if (this.ctaSubmit) {\n this.ctaSubmit.removeEventListener('click', this.boundSubmit)\n }\n if (this.ctaCancel) {\n this.ctaCancel.removeEventListener('click', this.boundCancel)\n }\n if (this.form) {\n this.form.removeEventListener('formdata', this.boundFormData)\n }\n }\n\n disconnectedCallback() {\n this.unbindEvent()\n }\n}\n\ncustomElements.get('nb-form') || customElements.define('nb-form', Form)\n\nexport default Form\n"],"names":["isNil","obj","EVENT_POPIN_FORM_TOGGLE_TITLE","dispatchEvent","eventName","args","element","window","Error","event","CustomEvent","detail","bubbles","Event","document","createEvent","initEvent","escapeHtml","text","map","replace","m","DOMParser","Form","HTMLElement","constructor","super","this","boundCancel","onCancel","bind","boundSubmit","onSubmit","boundFormData","onFormData","boundBackToForm","onBackToForm","boundClose","onClose","url","connectedCallback","props","attributes","data","find","attribute","nodeName","getData","filter","reduce","all","attr","nodeValue","JSON","parse","error","console","log","createProps","classList","add","render","bindEvent","element_id","element_name","elements","length","innerHTML","renderElements","renderTermsOfUse","renderGoogleCaptcha","renderSubmit","renderCancel","form","querySelector","querySelectorAll","ctaDropdownList","ctaCancel","ctaSubmit","recaptcha_id","captcha_message","loadExternalScript","src","callback","async","defer","module","id","script","createElement","type","onload","body","appendChild","NNPBCaptchaSuccess","remove","NNPBCaptchaExpired","className","stringifyForAttribute","stringify","join","terms_of_use","cancel_cta","submit_cta","e","preventDefault","FormData","isValid","forEach","el","success","checkValidity","grecaptcha","successCaptcha","checkGoogleReCaptcha","toggleLoader","submitValidForm","nnEearlyAccessFormSubmit","captchaBadge","captchaEl","value","toggleElement","classname","contains","toggleForm","onError","errorMessage","renderRequestMessage","onSuccess","requestMessage","setAttribute","errorMessageElement","icon","heading","description","cta","parentNode","insertBefore","nextSibling","bindRequestMessageCta","focus","ctaBack","addEventListener","setTimeout","setUrl","i","stopPropagation","unbindEvent","removeEventListener","disconnectedCallback","customElements","get","define"],"mappings":"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"}