@adyen/adyen-web 6.37.0 → 6.39.0

package/dist/es-legacy/components/internal/FormFields/Select/Select.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useRef as t,useState as n,useMemo as r,useEffect as l}from"../../../../external/preact/hooks/dist/hooks.js";import s from"../../../../_virtual/index.js";import o from"./components/SelectButton.js";import a from"./components/SelectList.js";import i from"../../../../utils/uuid.js";import{keys as c}from"./constants.js";import{ARIA_ERROR_SUFFIX as u,ARIA_CONTEXT_SUFFIX as d}from"../../../../core/Errors/constants.js";import{simulateFocusScroll as m}from"../utils.js";import{useCoreContext as f}from"../../../../core/Context/CoreProvider.js";function p({items:p=[],className:g="",classNameModifiers:v=[],filterable:h=!0,readonly:y=!1,onChange:b=()=>{},onInput:k,selectedValue:w,name:I,isInvalid:L,isValid:j,placeholder:D,uniqueId:x,disabled:C,disableTextFilter:E,clearOnSelect:T,blurOnClose:N,onListToggle:B,required:S}){const{i18n:$}=f(),_=t(null),M=t(null),P=t(null),R=t(null),[q,O]=n(null),[V,A]=n(!1),[F,H]=n(null),K=r(()=>`select-${i()}`,[]),U=p.find(e=>e.id===w)||{},[z,G]=n(),[J,Q]=n(U),W=U,X=E?p:p.filter(e=>!q||e.name.toLowerCase().includes(q.toLowerCase())),Y=x?`${x}${L?u:d}`:null,Z=e=>{if(!e)return;const t=document.getElementById(`listItem-${e.id}`);m(t)},ee=()=>{N&&_.current.blur(),A(!1)},te=()=>{A(!0)},ne=e=>{const t=e.currentTarget.getAttribute("data-value");return X.find(e=>e.id==t)},re=e=>{let t;e.preventDefault(),t=e.currentTarget instanceof HTMLElement&&"option"===e.currentTarget.getAttribute("role")?ne(e):J.id&&X.some(e=>e.id===J.id)?J:q?X[0]:{id:w},t&&!t.disabled&&(b({target:{value:t.id,name:I}}),T&&G(null),ee())},le=e=>{switch(e.key){case c.space:case c.enter:re(e);break;case c.arrowDown:e.preventDefault(),(()=>{if(!X||X.length<1)return;const e=X.findIndex(e=>e===J)+1,t=e<X.length?e:0,n=X[t];Z(n),Q(n)})();break;case c.arrowUp:e.preventDefault(),(()=>{if(!X||X.length<1)return;const e=X.findIndex(e=>e===J)-1,t=e<0?X.length-1:e,n=X[t];Z(n),Q(n)})()}};return l(()=>{V?G(null):O(null)},[V]),l(()=>{V&&h&&_.current&&_.current.focus(),null==B||B(V)},[V]),l(()=>{function e(e){(e.composedPath?!e.composedPath().includes(M.current):!M.current.contains(e.target))&&ee()}return document.addEventListener("click",e,!1),()=>{document.removeEventListener("click",e,!1)}},[M]),l(()=>{V&&0===X.length?H($.get("select.noOptionsFound")):H(null)},[V,X.length,$]),e("div",{className:s(["adyen-checkout__dropdown",g,...v.map(e=>`adyen-checkout__dropdown--${e}`)]),ref:M},e(o,{inputText:z,id:null!=x?x:null,active:J,selected:W,filterInputRef:_,filterable:h,isInvalid:L,isValid:j,onButtonKeyDown:e=>{e.key===c.enter&&h&&V&&q?re(e):e.key===c.escape?ee():![c.arrowUp,c.arrowDown,c.enter].includes(e.key)&&(e.key!==c.space||h&&V)?(e.shiftKey&&e.key===c.tab||e.key===c.tab)&&ee():(e.preventDefault(),V?le(e):te())},onInput:e=>{const t=e.target.value;G(t),O(t),V||te(),k&&k(t)},placeholder:D,readonly:y,selectListId:K,showList:V,toggleButtonRef:P,toggleList:e=>{e.preventDefault(),V?(G(W.name),ee()):(G(null),te())},disabled:C,ariaDescribedBy:Y,required:S}),e(a,{active:J,filteredItems:X,onHover:e=>{e.preventDefault();const t=ne(e);Q(t)},onSelect:re,selected:W,selectListId:K,selectListRef:R,showList:V}),e("div",{role:"status","aria-live":"polite","aria-relevant":"all",className:"adyen-checkout-sr-panel--sr-only"},F))}p.defaultProps={className:"",classNameModifiers:[],filterable:!0,items:[],readonly:!1,onChange:()=>{}};export{p as default};
+import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useRef as t,useState as n,useMemo as r,useEffect as l}from"../../../../external/preact/hooks/dist/hooks.js";import s from"../../../../_virtual/index.js";import o from"./components/SelectButton.js";import a from"./components/SelectList.js";import i from"../../../../utils/uuid.js";import{keys as c}from"./constants.js";import{ARIA_ERROR_SUFFIX as u,ARIA_CONTEXT_SUFFIX as d}from"../../../../core/Errors/constants.js";import{simulateFocusScroll as m}from"../utils.js";import{useCoreContext as f}from"../../../../core/Context/CoreProvider.js";function p({items:p=[],className:g="",classNameModifiers:v=[],filterable:h=!0,readonly:y=!1,onChange:k=()=>{},onInput:b,selectedValue:w,name:I,isInvalid:L,isValid:j,placeholder:x,uniqueId:D,disabled:T,disableTextFilter:C,clearOnSelect:E,blurOnClose:N,onListToggle:B,required:S}){const{i18n:$}=f(),_=t(null),M=t(null),P=t(null),R=t(null),[q,O]=n(null),[V,A]=n(!1),[F,H]=n(null),K=r(()=>`select-${i()}`,[]),U=p.find(e=>e.id===w)||{},[z,G]=n(),[J,Q]=n(U),W=U,X=C?p:p.filter(e=>!q||e.name.toLowerCase().includes(q.toLowerCase())),Y=D?`${D}${L?u:d}`:null,Z=e=>{if(!e)return;const t=document.getElementById(`listItem-${e.id}`);m(t)},ee=()=>{N&&_.current.blur(),A(!1)},te=()=>{A(!0)},ne=e=>{const t=e.currentTarget.getAttribute("data-value");return X.find(e=>e.id==t)},re=e=>{let t;e.preventDefault(),t=e.currentTarget instanceof HTMLElement&&"option"===e.currentTarget.getAttribute("role")?ne(e):J.id&&X.some(e=>e.id===J.id)?J:q?X[0]:{id:w},t&&!t.disabled&&(k({target:{value:t.id,name:I}}),E&&G(null),ee())},le=e=>{switch(e.key){case c.space:case c.enter:re(e);break;case c.arrowDown:e.preventDefault(),(()=>{if(!X||X.length<1)return;const e=X.findIndex(e=>e===J)+1,t=e<X.length?e:0,n=X[t];Z(n),Q(n)})();break;case c.arrowUp:e.preventDefault(),(()=>{if(!X||X.length<1)return;const e=X.findIndex(e=>e===J)-1,t=e<0?X.length-1:e,n=X[t];Z(n),Q(n)})()}};return l(()=>{V?G(null):O(null)},[V]),l(()=>{V&&h&&_.current&&_.current.focus(),null==B||B(V)},[V]),l(()=>{function e(e){(e.composedPath?!e.composedPath().includes(M.current):!M.current.contains(e.target))&&ee()}return document.addEventListener("click",e,!1),()=>{document.removeEventListener("click",e,!1)}},[M]),l(()=>{const e=setTimeout(()=>{0===X.length?H($.get("select.noOptionsFound")):H($.get("select.results",{values:{count:X.length}}))},500);return()=>clearTimeout(e)},[V,X.length,$]),e("div",{className:s(["adyen-checkout__dropdown",g,...v.map(e=>`adyen-checkout__dropdown--${e}`)]),ref:M},e(o,{inputText:z,id:null!=D?D:null,active:J,selected:W,filterInputRef:_,filterable:h,isInvalid:L,isValid:j,onButtonKeyDown:e=>{e.key===c.enter&&h&&V&&q?re(e):e.key===c.escape?ee():![c.arrowUp,c.arrowDown,c.enter].includes(e.key)&&(e.key!==c.space||h&&V)?(e.shiftKey&&e.key===c.tab||e.key===c.tab)&&ee():(e.preventDefault(),V?le(e):te())},onInput:e=>{const t=e.target.value;G(t),O(t),V||te(),b&&b(t)},placeholder:x,readonly:y,selectListId:K,showList:V,toggleButtonRef:P,toggleList:e=>{e.preventDefault(),V?(G(W.name),ee()):(G(null),te())},disabled:T,ariaDescribedBy:Y,required:S}),e(a,{active:J,filteredItems:X,onHover:e=>{e.preventDefault();const t=ne(e);Q(t)},onSelect:re,selected:W,selectListId:K,selectListRef:R,showList:V}),e("div",{key:z,role:"status","aria-live":"polite","aria-relevant":"additions text",className:"adyen-checkout-sr-panel--sr-only"},F))}p.defaultProps={className:"",classNameModifiers:[],filterable:!0,items:[],readonly:!1,onChange:()=>{}};export{p as default};
 //# sourceMappingURL=Select.js.map

package/dist/es-legacy/components/internal/FormFields/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../../../../src/components/internal/FormFields/Select/Select.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useMemo, useRef, useState } from 'preact/hooks';\nimport cx from 'classnames';\nimport SelectButton from './components/SelectButton';\nimport SelectList from './components/SelectList';\nimport uuid from '../../../../utils/uuid';\nimport { keys } from './constants';\nimport { SelectItem, SelectProps } from './types';\nimport './Select.scss';\nimport { ARIA_CONTEXT_SUFFIX, ARIA_ERROR_SUFFIX } from '../../../../core/Errors/constants';\nimport { simulateFocusScroll } from '../utils';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\n\nfunction Select({\n    items = [],\n    className = '',\n    classNameModifiers = [],\n    filterable = true,\n    readonly = false,\n    onChange = () => {},\n    onInput,\n    selectedValue,\n    name,\n    isInvalid,\n    isValid,\n    placeholder,\n    uniqueId,\n    disabled,\n    disableTextFilter,\n    clearOnSelect,\n    blurOnClose,\n    onListToggle,\n    required\n}: Readonly<SelectProps>) {\n    const { i18n } = useCoreContext();\n    const filterInputRef = useRef(null);\n    const selectContainerRef = useRef(null);\n    const toggleButtonRef = useRef(null);\n    const selectListRef = useRef(null);\n    const [textFilter, setTextFilter] = useState<string>(null);\n    const [showList, setShowList] = useState<boolean>(false);\n    const [statusMessage, setStatusMessage] = useState<string>(null);\n    const selectListId: string = useMemo(() => `select-${uuid()}`, []);\n\n    const active: SelectItem = items.find(i => i.id === selectedValue) || ({} as SelectItem);\n\n    const [inputText, setInputText] = useState<string>();\n\n    const [activeOption, setActiveOption] = useState<SelectItem>(active);\n\n    const selectedOption = active;\n\n    const filteredItems = disableTextFilter ? items : items.filter(item => !textFilter || item.name.toLowerCase().includes(textFilter.toLowerCase()));\n\n    const suffix = isInvalid ? ARIA_ERROR_SUFFIX : ARIA_CONTEXT_SUFFIX;\n    const ariaDescribedBy = uniqueId ? `${uniqueId}${suffix}` : null;\n\n    const setNextActive = () => {\n        if (!filteredItems || filteredItems.length < 1) return;\n        const possibleNextIndex = filteredItems.findIndex(listItem => listItem === activeOption) + 1;\n        const nextIndex = possibleNextIndex < filteredItems.length ? possibleNextIndex : 0;\n        const nextItem = filteredItems[nextIndex];\n        scrollToItem(nextItem);\n        setActiveOption(nextItem);\n    };\n\n    const setPreviousActive = () => {\n        if (!filteredItems || filteredItems.length < 1) return;\n        const possibleNextIndex = filteredItems.findIndex(listItem => listItem === activeOption) - 1;\n        const nextIndex = possibleNextIndex < 0 ? filteredItems.length - 1 : possibleNextIndex;\n        const nextItem = filteredItems[nextIndex];\n        scrollToItem(nextItem);\n        setActiveOption(nextItem);\n    };\n\n    const scrollToItem = (item: SelectItem) => {\n        if (!item) return;\n        const nextElement = document.getElementById(`listItem-${item.id}`);\n        simulateFocusScroll(nextElement);\n    };\n\n    /**\n     * Closes the selectList, empties the text filter and focuses the button element\n     */\n    const closeList = () => {\n        //blurs the field when the list is closed, makes for a better UX for most users, needs more testing\n        blurOnClose && filterInputRef.current.blur();\n        setShowList(false);\n    };\n\n    const openList = () => {\n        setShowList(true);\n    };\n\n    const extractItemFromEvent = (e: Event): SelectItem => {\n        const value = (e.currentTarget as HTMLInputElement).getAttribute('data-value');\n        return filteredItems.find(listItem => listItem.id == value);\n    };\n\n    /**\n     * Closes the select list and fires an onChange\n     * @param e - Event\n     */\n    const handleSelect = (e: Event) => {\n        e.preventDefault();\n\n        // We use a local variable here since writing and if statement is cleaner then a long ternary\n        let valueToEmit;\n\n        if (e.currentTarget instanceof HTMLElement && e.currentTarget.getAttribute('role') === 'option') {\n            // This is the main scenario when clicking and item in the list\n            // Item comes from the event\n            valueToEmit = extractItemFromEvent(e);\n        } else if (activeOption.id && filteredItems.some(item => item.id === activeOption.id)) {\n            // This is the scenario where a user is using the keyboard to navigate\n            // In the case item comes from the visually select item\n            valueToEmit = activeOption;\n        } else {\n            // This is the scenario the user didn't select anything\n            if (textFilter) {\n                // if we filtering for something then select the first option\n                valueToEmit = filteredItems[0];\n            } else {\n                // This will happen when we want to keep an already chosen option\n                // If no active option we should just emit again with the value that was already selected\n                valueToEmit = { id: selectedValue };\n            }\n        }\n\n        if (valueToEmit && !valueToEmit.disabled) {\n            onChange({ target: { value: valueToEmit.id, name: name } });\n\n            if (clearOnSelect) setInputText(null);\n\n            closeList();\n        }\n    };\n\n    /**\n     * Handles hovering and directions\n     * @param e - Event\n     */\n    const handleHover = (e: Event) => {\n        e.preventDefault();\n        const item = extractItemFromEvent(e);\n        setActiveOption(item);\n    };\n\n    /**\n     * Handle keyDown events on the selectList button\n     * Responsible for opening and closing the list\n     * @param e - KeyboardEvent\n     */\n    const handleButtonKeyDown = (e: KeyboardEvent) => {\n        if (e.key === keys.enter && filterable && showList && textFilter) {\n            handleSelect(e);\n        } else if (e.key === keys.escape) {\n            // When user has focused Select button but not yet moved into Select list - close list and keep focus on the Select Button re. a11y guidelines\n            // https://w3c.github.io/aria-practices/examples/disclosure/disclosure-navigation.html\n            closeList();\n        } else if ([keys.arrowUp, keys.arrowDown, keys.enter].includes(e.key) || (e.key === keys.space && (!filterable || !showList))) {\n            e.preventDefault();\n            if (!showList) {\n                openList();\n            } else {\n                handleNavigationKeys(e);\n            }\n        } else if (e.shiftKey && e.key === keys.tab) {\n            // Shift-Tab out of Select - close list re. a11y guidelines (above)\n            closeList();\n        } else if (e.key === keys.tab) {\n            closeList();\n        }\n    };\n\n    /**\n     * Handles movement with navigation keys and enter\n     * Navigates through the list, or select an element, or focus the filter input, or close the menu.\n     * @param e - KeyDownEvent\n     */\n    const handleNavigationKeys = (e: KeyboardEvent) => {\n        switch (e.key) {\n            case keys.space:\n            case keys.enter:\n                handleSelect(e);\n                break;\n            case keys.arrowDown:\n                e.preventDefault();\n                setNextActive();\n                break;\n            case keys.arrowUp:\n                e.preventDefault();\n                setPreviousActive();\n                break;\n            default:\n        }\n    };\n\n    /**\n     * Updates the state with the current text filter value and opens the dropdown\n     * @param e - KeyboardEvent\n     */\n    const handleTextFilter = (e: KeyboardEvent) => {\n        const value: string = (e.target as HTMLInputElement).value;\n        setInputText(value);\n        setTextFilter(value);\n\n        // Open the dropdown when user starts typing\n        if (!showList) {\n            openList();\n        }\n\n        if (onInput) {\n            onInput(value);\n        }\n    };\n\n    /**\n     * Toggles the selectList and focuses in either the filter input or in the selectList button\n     * @param e - Event\n     */\n    const toggleList = (e: Event) => {\n        e.preventDefault();\n        if (!showList) {\n            setInputText(null);\n            openList();\n        } else {\n            setInputText(selectedOption.name);\n            closeList();\n        }\n    };\n\n    useEffect(() => {\n        if (showList) {\n            setInputText(null);\n        } else {\n            setTextFilter(null);\n        }\n    }, [showList]);\n\n    /**\n     * Focus on the input if filterable\n     */\n    useEffect(() => {\n        if (showList && filterable && filterInputRef.current) {\n            filterInputRef.current.focus();\n        }\n        onListToggle?.(showList);\n    }, [showList]);\n\n    useEffect(() => {\n        /**\n         * Close the select list when clicking outside the list\n         * @param e - MouseEvent\n         */\n        function handleClickOutside(e: MouseEvent) {\n            // use composedPath so it can also check when inside a web component\n            // if composedPath is not available fallback to e.target\n            const clickIsOutside = e.composedPath\n                ? !e.composedPath().includes(selectContainerRef.current)\n                : !selectContainerRef.current.contains(e.target);\n            if (clickIsOutside) {\n                closeList();\n            }\n        }\n\n        document.addEventListener('click', handleClickOutside, false);\n\n        return () => {\n            document.removeEventListener('click', handleClickOutside, false);\n        };\n    }, [selectContainerRef]);\n\n    /**\n     * Update status message for screen readers when no options are found\n     */\n    useEffect(() => {\n        if (showList && filteredItems.length === 0) {\n            setStatusMessage(i18n.get('select.noOptionsFound'));\n        } else {\n            setStatusMessage(null);\n        }\n    }, [showList, filteredItems.length, i18n]);\n\n    return (\n        <div\n            className={cx(['adyen-checkout__dropdown', className, ...classNameModifiers.map(m => `adyen-checkout__dropdown--${m}`)])}\n            ref={selectContainerRef}\n        >\n            <SelectButton\n                inputText={inputText}\n                id={uniqueId ?? null}\n                active={activeOption}\n                selected={selectedOption}\n                filterInputRef={filterInputRef}\n                filterable={filterable}\n                isInvalid={isInvalid}\n                isValid={isValid}\n                onButtonKeyDown={handleButtonKeyDown}\n                onInput={handleTextFilter}\n                placeholder={placeholder}\n                readonly={readonly}\n                selectListId={selectListId}\n                showList={showList}\n                toggleButtonRef={toggleButtonRef}\n                toggleList={toggleList}\n                disabled={disabled}\n                ariaDescribedBy={ariaDescribedBy}\n                required={required}\n            />\n            <SelectList\n                active={activeOption}\n                filteredItems={filteredItems}\n                onHover={handleHover}\n                onSelect={handleSelect}\n                selected={selectedOption}\n                selectListId={selectListId}\n                selectListRef={selectListRef}\n                showList={showList}\n            />\n            <div\n                role=\"status\"\n                aria-live=\"polite\"\n                // aria-relevant seems to be needed here make make sure a second time we get\n                // \"No options found\" we still announce the status message.\n                // What happens otherwise is that just the first status message is announced\n                // tested on VoiceOver on Chrome\n                aria-relevant=\"all\"\n                className=\"adyen-checkout-sr-panel--sr-only\"\n            >\n                {statusMessage}\n            </div>\n        </div>\n    );\n}\n\nSelect.defaultProps = {\n    className: '',\n    classNameModifiers: [],\n    filterable: true,\n    items: [],\n    readonly: false,\n    onChange: () => {}\n};\n\nexport default Select;\n"],"names":["Select","items","className","classNameModifiers","filterable","readonly","onChange","onInput","selectedValue","name","isInvalid","isValid","placeholder","uniqueId","disabled","disableTextFilter","clearOnSelect","blurOnClose","onListToggle","required","i18n","useCoreContext","filterInputRef","useRef","selectContainerRef","toggleButtonRef","selectListRef","textFilter","setTextFilter","useState","showList","setShowList","statusMessage","setStatusMessage","selectListId","useMemo","uuid","active","find","i","id","inputText","setInputText","activeOption","setActiveOption","selectedOption","filteredItems","filter","item","toLowerCase","includes","ariaDescribedBy","ARIA_ERROR_SUFFIX","ARIA_CONTEXT_SUFFIX","scrollToItem","nextElement","document","getElementById","simulateFocusScroll","closeList","current","blur","openList","extractItemFromEvent","e","value","currentTarget","getAttribute","listItem","handleSelect","valueToEmit","preventDefault","HTMLElement","some","target","handleNavigationKeys","key","keys","space","enter","arrowDown","length","possibleNextIndex","findIndex","nextIndex","nextItem","setNextActive","arrowUp","setPreviousActive","useEffect","focus","handleClickOutside","composedPath","contains","addEventListener","removeEventListener","get","h","div","cx","map","m","ref","SelectButton","selected","onButtonKeyDown","escape","shiftKey","tab","toggleList","SelectList","onHover","onSelect","role","aria-live","aria-relevant","defaultProps"],"mappings":"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"}
+{"version":3,"file":"Select.js","sources":["../../../../../../src/components/internal/FormFields/Select/Select.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useMemo, useRef, useState } from 'preact/hooks';\nimport cx from 'classnames';\nimport SelectButton from './components/SelectButton';\nimport SelectList from './components/SelectList';\nimport uuid from '../../../../utils/uuid';\nimport { keys } from './constants';\nimport { SelectItem, SelectProps } from './types';\nimport './Select.scss';\nimport { ARIA_CONTEXT_SUFFIX, ARIA_ERROR_SUFFIX } from '../../../../core/Errors/constants';\nimport { simulateFocusScroll } from '../utils';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\n\nfunction Select({\n    items = [],\n    className = '',\n    classNameModifiers = [],\n    filterable = true,\n    readonly = false,\n    onChange = () => {},\n    onInput,\n    selectedValue,\n    name,\n    isInvalid,\n    isValid,\n    placeholder,\n    uniqueId,\n    disabled,\n    disableTextFilter,\n    clearOnSelect,\n    blurOnClose,\n    onListToggle,\n    required\n}: Readonly<SelectProps>) {\n    const { i18n } = useCoreContext();\n    const filterInputRef = useRef(null);\n    const selectContainerRef = useRef(null);\n    const toggleButtonRef = useRef(null);\n    const selectListRef = useRef(null);\n    const [textFilter, setTextFilter] = useState<string>(null);\n    const [showList, setShowList] = useState<boolean>(false);\n    const [statusMessage, setStatusMessage] = useState<string | null>(null);\n    const selectListId: string = useMemo(() => `select-${uuid()}`, []);\n\n    const active: SelectItem = items.find(i => i.id === selectedValue) || ({} as SelectItem);\n\n    const [inputText, setInputText] = useState<string>();\n\n    const [activeOption, setActiveOption] = useState<SelectItem>(active);\n\n    const selectedOption = active;\n\n    const filteredItems = disableTextFilter ? items : items.filter(item => !textFilter || item.name.toLowerCase().includes(textFilter.toLowerCase()));\n\n    const suffix = isInvalid ? ARIA_ERROR_SUFFIX : ARIA_CONTEXT_SUFFIX;\n    const ariaDescribedBy = uniqueId ? `${uniqueId}${suffix}` : null;\n\n    const setNextActive = () => {\n        if (!filteredItems || filteredItems.length < 1) return;\n        const possibleNextIndex = filteredItems.findIndex(listItem => listItem === activeOption) + 1;\n        const nextIndex = possibleNextIndex < filteredItems.length ? possibleNextIndex : 0;\n        const nextItem = filteredItems[nextIndex];\n        scrollToItem(nextItem);\n        setActiveOption(nextItem);\n    };\n\n    const setPreviousActive = () => {\n        if (!filteredItems || filteredItems.length < 1) return;\n        const possibleNextIndex = filteredItems.findIndex(listItem => listItem === activeOption) - 1;\n        const nextIndex = possibleNextIndex < 0 ? filteredItems.length - 1 : possibleNextIndex;\n        const nextItem = filteredItems[nextIndex];\n        scrollToItem(nextItem);\n        setActiveOption(nextItem);\n    };\n\n    const scrollToItem = (item: SelectItem) => {\n        if (!item) return;\n        const nextElement = document.getElementById(`listItem-${item.id}`);\n        simulateFocusScroll(nextElement);\n    };\n\n    /**\n     * Closes the selectList, empties the text filter and focuses the button element\n     */\n    const closeList = () => {\n        //blurs the field when the list is closed, makes for a better UX for most users, needs more testing\n        if (blurOnClose) {\n            filterInputRef.current.blur();\n        }\n        setShowList(false);\n    };\n\n    const openList = () => {\n        setShowList(true);\n    };\n\n    const extractItemFromEvent = (e: Event): SelectItem => {\n        const value = (e.currentTarget as HTMLInputElement).getAttribute('data-value');\n        return filteredItems.find(listItem => listItem.id == value);\n    };\n\n    /**\n     * Closes the select list and fires an onChange\n     * @param e - Event\n     */\n    const handleSelect = (e: Event) => {\n        e.preventDefault();\n\n        // We use a local variable here since writing and if statement is cleaner then a long ternary\n        let valueToEmit;\n\n        if (e.currentTarget instanceof HTMLElement && e.currentTarget.getAttribute('role') === 'option') {\n            // This is the main scenario when clicking and item in the list\n            // Item comes from the event\n            valueToEmit = extractItemFromEvent(e);\n        } else if (activeOption.id && filteredItems.some(item => item.id === activeOption.id)) {\n            // This is the scenario where a user is using the keyboard to navigate\n            // In the case item comes from the visually select item\n            valueToEmit = activeOption;\n        } else {\n            // This is the scenario the user didn't select anything\n            if (textFilter) {\n                // if we filtering for something then select the first option\n                valueToEmit = filteredItems[0];\n            } else {\n                // This will happen when we want to keep an already chosen option\n                // If no active option we should just emit again with the value that was already selected\n                valueToEmit = { id: selectedValue };\n            }\n        }\n\n        if (valueToEmit && !valueToEmit.disabled) {\n            onChange({ target: { value: valueToEmit.id, name: name } });\n\n            if (clearOnSelect) setInputText(null);\n\n            closeList();\n        }\n    };\n\n    /**\n     * Handles hovering and directions\n     * @param e - Event\n     */\n    const handleHover = (e: Event) => {\n        e.preventDefault();\n        const item = extractItemFromEvent(e);\n        setActiveOption(item);\n    };\n\n    /**\n     * Handle keyDown events on the selectList button\n     * Responsible for opening and closing the list\n     * @param e - KeyboardEvent\n     */\n    const handleButtonKeyDown = (e: KeyboardEvent) => {\n        if (e.key === keys.enter && filterable && showList && textFilter) {\n            handleSelect(e);\n        } else if (e.key === keys.escape) {\n            // When user has focused Select button but not yet moved into Select list - close list and keep focus on the Select Button re. a11y guidelines\n            // https://w3c.github.io/aria-practices/examples/disclosure/disclosure-navigation.html\n            closeList();\n        } else if ([keys.arrowUp, keys.arrowDown, keys.enter].includes(e.key) || (e.key === keys.space && (!filterable || !showList))) {\n            e.preventDefault();\n            if (!showList) {\n                openList();\n            } else {\n                handleNavigationKeys(e);\n            }\n        } else if (e.shiftKey && e.key === keys.tab) {\n            // Shift-Tab out of Select - close list re. a11y guidelines (above)\n            closeList();\n        } else if (e.key === keys.tab) {\n            closeList();\n        }\n    };\n\n    /**\n     * Handles movement with navigation keys and enter\n     * Navigates through the list, or select an element, or focus the filter input, or close the menu.\n     * @param e - KeyDownEvent\n     */\n    const handleNavigationKeys = (e: KeyboardEvent) => {\n        switch (e.key) {\n            case keys.space:\n            case keys.enter:\n                handleSelect(e);\n                break;\n            case keys.arrowDown:\n                e.preventDefault();\n                setNextActive();\n                break;\n            case keys.arrowUp:\n                e.preventDefault();\n                setPreviousActive();\n                break;\n            default:\n        }\n    };\n\n    /**\n     * Updates the state with the current text filter value and opens the dropdown\n     * @param e - KeyboardEvent\n     */\n    const handleTextFilter = (e: KeyboardEvent) => {\n        const value: string = (e.target as HTMLInputElement).value;\n        setInputText(value);\n        setTextFilter(value);\n\n        // Open the dropdown when user starts typing\n        if (!showList) {\n            openList();\n        }\n\n        if (onInput) {\n            onInput(value);\n        }\n    };\n\n    /**\n     * Toggles the selectList and focuses in either the filter input or in the selectList button\n     * @param e - Event\n     */\n    const toggleList = (e: Event) => {\n        e.preventDefault();\n        if (!showList) {\n            setInputText(null);\n            openList();\n        } else {\n            setInputText(selectedOption.name);\n            closeList();\n        }\n    };\n\n    useEffect(() => {\n        if (showList) {\n            setInputText(null);\n        } else {\n            setTextFilter(null);\n        }\n    }, [showList]);\n\n    /**\n     * Focus on the input if filterable\n     */\n    useEffect(() => {\n        if (showList && filterable && filterInputRef.current) {\n            filterInputRef.current.focus();\n        }\n        onListToggle?.(showList);\n    }, [showList]);\n\n    useEffect(() => {\n        /**\n         * Close the select list when clicking outside the list\n         * @param e - MouseEvent\n         */\n        function handleClickOutside(e: MouseEvent) {\n            // use composedPath so it can also check when inside a web component\n            // if composedPath is not available fallback to e.target\n            const clickIsOutside = e.composedPath\n                ? !e.composedPath().includes(selectContainerRef.current)\n                : !selectContainerRef.current.contains(e.target);\n            if (clickIsOutside) {\n                closeList();\n            }\n        }\n\n        document.addEventListener('click', handleClickOutside, false);\n\n        return () => {\n            document.removeEventListener('click', handleClickOutside, false);\n        };\n    }, [selectContainerRef]);\n\n    /**\n     * Update status message for screen readers when no options are found\n     */\n    useEffect(() => {\n        // Debounce to avoid announcing on every keystroke\n        const SR_ANNOUNCEMENT_DELAY_MS = 500;\n        const timer = setTimeout(() => {\n            if (filteredItems.length === 0) {\n                setStatusMessage(i18n.get('select.noOptionsFound'));\n            } else {\n                setStatusMessage(i18n.get('select.results', { values: { count: filteredItems.length } }));\n            }\n        }, SR_ANNOUNCEMENT_DELAY_MS);\n\n        return () => clearTimeout(timer);\n    }, [showList, filteredItems.length, i18n]);\n\n    return (\n        <div\n            className={cx(['adyen-checkout__dropdown', className, ...classNameModifiers.map(m => `adyen-checkout__dropdown--${m}`)])}\n            ref={selectContainerRef}\n        >\n            <SelectButton\n                inputText={inputText}\n                id={uniqueId ?? null}\n                active={activeOption}\n                selected={selectedOption}\n                filterInputRef={filterInputRef}\n                filterable={filterable}\n                isInvalid={isInvalid}\n                isValid={isValid}\n                onButtonKeyDown={handleButtonKeyDown}\n                onInput={handleTextFilter}\n                placeholder={placeholder}\n                readonly={readonly}\n                selectListId={selectListId}\n                showList={showList}\n                toggleButtonRef={toggleButtonRef}\n                toggleList={toggleList}\n                disabled={disabled}\n                ariaDescribedBy={ariaDescribedBy}\n                required={required}\n            />\n            <SelectList\n                active={activeOption}\n                filteredItems={filteredItems}\n                onHover={handleHover}\n                onSelect={handleSelect}\n                selected={selectedOption}\n                selectListId={selectListId}\n                selectListRef={selectListRef}\n                showList={showList}\n            />\n            <div\n                key={inputText}\n                role=\"status\"\n                aria-live=\"polite\"\n                // aria-relevant seems to be needed here make make sure a second time we get\n                // \"No options found\" we still announce the status message.\n                // What happens otherwise is that just the first status message is announced\n                // tested on VoiceOver on Chrome\n                aria-relevant=\"additions text\"\n                className=\"adyen-checkout-sr-panel--sr-only\"\n            >\n                {statusMessage}\n            </div>\n        </div>\n    );\n}\n\nSelect.defaultProps = {\n    className: '',\n    classNameModifiers: [],\n    filterable: true,\n    items: [],\n    readonly: false,\n    onChange: () => {}\n};\n\nexport default Select;\n"],"names":["Select","items","className","classNameModifiers","filterable","readonly","onChange","onInput","selectedValue","name","isInvalid","isValid","placeholder","uniqueId","disabled","disableTextFilter","clearOnSelect","blurOnClose","onListToggle","required","i18n","useCoreContext","filterInputRef","useRef","selectContainerRef","toggleButtonRef","selectListRef","textFilter","setTextFilter","useState","showList","setShowList","statusMessage","setStatusMessage","selectListId","useMemo","uuid","active","find","i","id","inputText","setInputText","activeOption","setActiveOption","selectedOption","filteredItems","filter","item","toLowerCase","includes","ariaDescribedBy","ARIA_ERROR_SUFFIX","ARIA_CONTEXT_SUFFIX","scrollToItem","nextElement","document","getElementById","simulateFocusScroll","closeList","current","blur","openList","extractItemFromEvent","e","value","currentTarget","getAttribute","listItem","handleSelect","valueToEmit","preventDefault","HTMLElement","some","target","handleNavigationKeys","key","keys","space","enter","arrowDown","length","possibleNextIndex","findIndex","nextIndex","nextItem","setNextActive","arrowUp","setPreviousActive","useEffect","focus","handleClickOutside","composedPath","contains","addEventListener","removeEventListener","timer","setTimeout","get","values","count","clearTimeout","h","div","cx","map","m","ref","SelectButton","selected","onButtonKeyDown","escape","shiftKey","tab","toggleList","SelectList","onHover","onSelect","role","aria-live","aria-relevant","defaultProps"],"mappings":"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"}

package/dist/es-legacy/components/internal/FormFields/Select/components/SelectList.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../../../external/preact/dist/preact.js";import t from"../../../../../_virtual/index.js";import o from"./SelectListItem.js";import{useCoreContext as r}from"../../../../../core/Context/CoreProvider.js";function n(e,t){if(null==e)return{};var o,r,n,l={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(o=Reflect.ownKeys(Object(e)),n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(l[r]=e[r]);return l}if(l=function(e,t){if(null==e)return{};var o,r,n={},l=Object.getOwnPropertyNames(e);for(r=0;r<l.length;r++)o=l[r],t.indexOf(o)>=0||Object.prototype.propertyIsEnumerable.call(e,o)&&(n[o]=e[o]);return n}(e,t),Object.getOwnPropertySymbols)for(o=Object.getOwnPropertySymbols(e),n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(l[r]=e[r]);return l}function l(l){let{selected:c,active:i,filteredItems:s,showList:d}=l,a=n(l,["selected","active","filteredItems","showList"]);const{i18n:p}=r();return e("ul",{className:t({"adyen-checkout__dropdown__list":!0,"adyen-checkout__dropdown__list--active":d}),id:a.selectListId,ref:a.selectListRef,role:"listbox"},s.length?s.map(t=>e(o,{active:t.id===i.id,item:t,key:t.id,onSelect:a.onSelect,onHover:a.onHover,selected:t.id===c.id})):e("div",{className:"adyen-checkout__dropdown__element adyen-checkout__dropdown__element--no-options"},p.get("select.noOptionsFound")))}export{l as default};
+import{createElement as e}from"../../../../../external/preact/dist/preact.js";import t from"../../../../../_virtual/index.js";import o from"./SelectListItem.js";import{useCoreContext as r}from"../../../../../core/Context/CoreProvider.js";function n(e,t){if(null==e)return{};var o,r,n,l={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(o=Reflect.ownKeys(Object(e)),n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(l[r]=e[r]);return l}if(l=function(e,t){if(null==e)return{};var o,r,n={},l=Object.getOwnPropertyNames(e);for(r=0;r<l.length;r++)o=l[r],t.indexOf(o)>=0||Object.prototype.propertyIsEnumerable.call(e,o)&&(n[o]=e[o]);return n}(e,t),Object.getOwnPropertySymbols)for(o=Object.getOwnPropertySymbols(e),n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(l[r]=e[r]);return l}function l(l){let{selected:i,active:c,filteredItems:s,showList:d}=l,a=n(l,["selected","active","filteredItems","showList"]);const{i18n:p}=r();return e("ul",{className:t({"adyen-checkout__dropdown__list":!0,"adyen-checkout__dropdown__list--active":d}),id:a.selectListId,ref:a.selectListRef,role:"listbox"},s.length?s.map(t=>e(o,{active:t.id===c.id,item:t,key:t.id,onSelect:a.onSelect,onHover:a.onHover,selected:t.id===i.id})):e("li",null,e("div",{className:"adyen-checkout__dropdown__element adyen-checkout__dropdown__element--no-options"},p.get("select.noOptionsFound"))))}export{l as default};
 //# sourceMappingURL=SelectList.js.map

package/dist/es-legacy/components/internal/FormFields/Select/components/SelectList.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectList.js","sources":["../../../../../../../src/components/internal/FormFields/Select/components/SelectList.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\nimport SelectListItem from './SelectListItem';\nimport { useCoreContext } from '../../../../../core/Context/CoreProvider';\nimport { SelectListProps } from '../types';\n\nfunction SelectList({ selected, active, filteredItems, showList, ...props }: Readonly<SelectListProps>) {\n    const { i18n } = useCoreContext();\n\n    return (\n        /* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n        <ul\n            className={cx({\n                'adyen-checkout__dropdown__list': true,\n                'adyen-checkout__dropdown__list--active': showList\n            })}\n            id={props.selectListId}\n            ref={props.selectListRef}\n            role=\"listbox\"\n        >\n            {filteredItems.length ? (\n                filteredItems.map(item => (\n                    <SelectListItem\n                        active={item.id === active.id}\n                        item={item}\n                        key={item.id}\n                        onSelect={props.onSelect}\n                        onHover={props.onHover}\n                        selected={item.id === selected.id}\n                    />\n                ))\n            ) : (\n                <div className=\"adyen-checkout__dropdown__element adyen-checkout__dropdown__element--no-options\">\n                    {i18n.get('select.noOptionsFound')}\n                </div>\n            )}\n        </ul>\n    );\n}\n\nexport default SelectList;\n"],"names":["SelectList","_0","selected","active","filteredItems","showList","props","i18n","useCoreContext","h","ul","className","cx","id","selectListId","ref","selectListRef","role","length","map","item","SelectListItem","key","onSelect","onHover","div","get"],"mappings":"u2BAMA,SAASA,EAAWC,OAAAC,SAAEA,EAAQC,OAAEA,EAAMC,cAAEA,EAAaC,SAAEA,GAA+CJ,EAAlCK,EAAAA,EAAAA,EAAAA,kDAChE,MAAMC,KAAEA,GAASC,IAEjB,OAEIC,EAACC,KAAAA,CACGC,UAAWC,EAAG,CACV,kCAAkC,EAClC,yCAA0CP,IAE9CQ,GAAIP,EAAMQ,aACVC,IAAKT,EAAMU,cACXC,KAAK,WAEJb,EAAcc,OACXd,EAAce,IAAIC,GACdX,EAACY,EAAAA,CACGlB,OAAQiB,EAAKP,KAAOV,EAAOU,GAC3BO,KAAMA,EACNE,IAAKF,EAAKP,GACVU,SAAUjB,EAAMiB,SAChBC,QAASlB,EAAMkB,QACftB,SAAUkB,EAAKP,KAAOX,EAASW,MAIvCJ,EAACgB,MAAAA,CAAId,UAAU,mFACVJ,EAAKmB,IAAI,0BAK9B"}
+{"version":3,"file":"SelectList.js","sources":["../../../../../../../src/components/internal/FormFields/Select/components/SelectList.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\nimport SelectListItem from './SelectListItem';\nimport { useCoreContext } from '../../../../../core/Context/CoreProvider';\nimport { SelectListProps } from '../types';\n\nfunction SelectList({ selected, active, filteredItems, showList, ...props }: Readonly<SelectListProps>) {\n    const { i18n } = useCoreContext();\n\n    return (\n        /* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n        <ul\n            className={cx({\n                'adyen-checkout__dropdown__list': true,\n                'adyen-checkout__dropdown__list--active': showList\n            })}\n            id={props.selectListId}\n            ref={props.selectListRef}\n            role=\"listbox\"\n        >\n            {filteredItems.length ? (\n                filteredItems.map(item => (\n                    <SelectListItem\n                        active={item.id === active.id}\n                        item={item}\n                        key={item.id}\n                        onSelect={props.onSelect}\n                        onHover={props.onHover}\n                        selected={item.id === selected.id}\n                    />\n                ))\n            ) : (\n                <li>\n                    <div className=\"adyen-checkout__dropdown__element adyen-checkout__dropdown__element--no-options\">\n                        {i18n.get('select.noOptionsFound')}\n                    </div>\n                </li>\n            )}\n        </ul>\n    );\n}\n\nexport default SelectList;\n"],"names":["SelectList","_0","selected","active","filteredItems","showList","props","i18n","useCoreContext","h","ul","className","cx","id","selectListId","ref","selectListRef","role","length","map","item","SelectListItem","key","onSelect","onHover","li","div","get"],"mappings":"u2BAMA,SAASA,EAAWC,OAAAC,SAAEA,EAAQC,OAAEA,EAAMC,cAAEA,EAAaC,SAAEA,GAA+CJ,EAAlCK,EAAAA,EAAAA,EAAAA,kDAChE,MAAMC,KAAEA,GAASC,IAEjB,OAEIC,EAACC,KAAAA,CACGC,UAAWC,EAAG,CACV,kCAAkC,EAClC,yCAA0CP,IAE9CQ,GAAIP,EAAMQ,aACVC,IAAKT,EAAMU,cACXC,KAAK,WAEJb,EAAcc,OACXd,EAAce,IAAIC,GACdX,EAACY,EAAAA,CACGlB,OAAQiB,EAAKP,KAAOV,EAAOU,GAC3BO,KAAMA,EACNE,IAAKF,EAAKP,GACVU,SAAUjB,EAAMiB,SAChBC,QAASlB,EAAMkB,QACftB,SAAUkB,EAAKP,KAAOX,EAASW,MAIvCJ,EAACgB,UACGhB,EAACiB,MAAAA,CAAIf,UAAU,mFACVJ,EAAKoB,IAAI,2BAMlC"}

package/dist/es-legacy/components/internal/Img/Img.js.map

@@ -1 +1 @@
-{"version":3,"file":"Img.js","sources":["../../../../../src/components/internal/Img/Img.tsx"],"sourcesContent":["import { JSX } from 'preact';\nimport { useRef, useState, useEffect } from 'preact/hooks';\nimport cx from 'classnames';\nimport './Img.scss';\nimport { h } from 'preact';\nimport { ImgProps } from './types';\n\nexport default function Img(props: Readonly<ImgProps>) {\n    const { backgroundUrl = '', className = '', classNameModifiers = [], src = '', alt = '', showOnError = false } = props;\n    const [loaded, setLoaded] = useState(false);\n    const imageRef = useRef(null);\n\n    const handleLoad = () => {\n        setLoaded(true);\n    };\n\n    const handleError = (e: JSX.TargetedEvent<HTMLImageElement, Event>) => {\n        setLoaded(showOnError);\n        props?.onError?.(e);\n    };\n\n    const classNames = cx(\n        [className],\n        'adyen-checkout__image',\n        { 'adyen-checkout__image--loaded': loaded },\n        ...classNameModifiers.map(modifier => `adyen-checkout__image--${modifier}`)\n    );\n\n    useEffect(() => {\n        const image = backgroundUrl ? new Image() : imageRef.current;\n        image.src = backgroundUrl || src;\n        image.onload = handleLoad;\n        setLoaded(!!image.complete);\n    }, []);\n\n    if (backgroundUrl) {\n        return <div data-testid=\"background\" style={{ backgroundUrl } as JSX.CSSProperties} {...props} className={classNames} />;\n    }\n\n    return <img {...props} alt={alt} ref={imageRef} className={classNames} onError={handleError} />;\n}\n"],"names":["Img","props","backgroundUrl","className","classNameModifiers","src","alt","showOnError","loaded","setLoaded","useState","imageRef","useRef","handleLoad","classNames","cx","map","modifier","useEffect","image","Image","current","onload","complete","h","div","data-testid","style","img","ref","onError","e"],"mappings":"8/BAOe,SAASA,EAAIC,GACxB,MAAMC,cAAEA,EAAgB,GAAEC,UAAEA,EAAY,GAAEC,mBAAEA,EAAqB,GAAEC,IAAEA,EAAM,GAAEC,IAAEA,EAAM,GAAEC,YAAEA,GAAc,GAAUN,GAC1GO,EAAQC,GAAaC,GAAS,GAC/BC,EAAWC,EAAO,MAElBC,EAAa,KACfJ,GAAU,IAQRK,EAAaC,EACf,CAACZ,GACD,wBACA,CAAE,gCAAiCK,MAChCJ,EAAmBY,IAAIC,GAAY,0BAA0BA,MAUpE,OAPAC,EAAU,KACN,MAAMC,EAAQjB,EAAgB,IAAIkB,MAAUT,EAASU,QACrDF,EAAMd,IAAMH,GAAiBG,EAC7Bc,EAAMG,OAAST,EACfJ,IAAYU,EAAMI,WACnB,IAECrB,EACOsB,EAACC,MAAAA,EAAAA,EAAAA,CAAIC,cAAY,aAAaC,MAAO,CAAEzB,kBAA0CD,GAAAA,CAAOE,UAAWW,KAGvGU,EAACI,MAAAA,EAAAA,EAAAA,CAAAA,EAAQ3B,GAAAA,CAAOK,IAAKA,EAAKuB,IAAKlB,EAAUR,UAAWW,EAAYgB,QAvBlDC,IAEjB9B,IAAAA,EADAQ,EAAUF,GACVN,SAAc,QAAdA,EAAAA,EAAO6B,eAAP7B,IAAAA,GAAAA,OAAAA,EAAiB8B,MAsBzB"}
+{"version":3,"file":"Img.js","sources":["../../../../../src/components/internal/Img/Img.tsx"],"sourcesContent":["import { JSX } from 'preact';\nimport { useRef, useState, useEffect } from 'preact/hooks';\nimport cx from 'classnames';\nimport './Img.scss';\nimport { h } from 'preact';\nimport { ImgProps } from './types';\n\nexport default function Img(props: Readonly<ImgProps>) {\n    const { backgroundUrl = '', className = '', classNameModifiers = [], src = '', alt = '', showOnError = false } = props;\n    const [loaded, setLoaded] = useState(false);\n    const imageRef = useRef(null);\n\n    const handleLoad = () => {\n        setLoaded(true);\n    };\n\n    const handleError = (e: JSX.TargetedEvent<HTMLImageElement, Event>) => {\n        setLoaded(showOnError);\n        props?.onError?.(e);\n    };\n\n    const classNames = cx(\n        [className],\n        'adyen-checkout__image',\n        { 'adyen-checkout__image--loaded': loaded },\n        ...classNameModifiers.map(modifier => `adyen-checkout__image--${modifier}`)\n    );\n\n    useEffect(() => {\n        const image = backgroundUrl ? new Image() : imageRef.current;\n        image.src = backgroundUrl || src;\n        image.onload = handleLoad;\n        setLoaded(!!image.complete);\n    }, []);\n\n    if (backgroundUrl) {\n        return <div data-testid=\"background\" style={{ backgroundUrl }} {...props} className={classNames} />;\n    }\n\n    return <img {...props} alt={alt} ref={imageRef} className={classNames} onError={handleError} />;\n}\n"],"names":["Img","props","backgroundUrl","className","classNameModifiers","src","alt","showOnError","loaded","setLoaded","useState","imageRef","useRef","handleLoad","classNames","cx","map","modifier","useEffect","image","Image","current","onload","complete","h","div","data-testid","style","img","ref","onError","e"],"mappings":"8/BAOe,SAASA,EAAIC,GACxB,MAAMC,cAAEA,EAAgB,GAAEC,UAAEA,EAAY,GAAEC,mBAAEA,EAAqB,GAAEC,IAAEA,EAAM,GAAEC,IAAEA,EAAM,GAAEC,YAAEA,GAAc,GAAUN,GAC1GO,EAAQC,GAAaC,GAAS,GAC/BC,EAAWC,EAAO,MAElBC,EAAa,KACfJ,GAAU,IAQRK,EAAaC,EACf,CAACZ,GACD,wBACA,CAAE,gCAAiCK,MAChCJ,EAAmBY,IAAIC,GAAY,0BAA0BA,MAUpE,OAPAC,EAAU,KACN,MAAMC,EAAQjB,EAAgB,IAAIkB,MAAUT,EAASU,QACrDF,EAAMd,IAAMH,GAAiBG,EAC7Bc,EAAMG,OAAST,EACfJ,IAAYU,EAAMI,WACnB,IAECrB,EACOsB,EAACC,MAAAA,EAAAA,EAAAA,CAAIC,cAAY,aAAaC,MAAO,CAAEzB,kBAAqBD,GAAAA,CAAOE,UAAWW,KAGlFU,EAACI,MAAAA,EAAAA,EAAAA,CAAAA,EAAQ3B,GAAAA,CAAOK,IAAKA,EAAKuB,IAAKlB,EAAUR,UAAWW,EAAYgB,QAvBlDC,IAEjB9B,IAAAA,EADAQ,EAAUF,GACVN,SAAc,QAAdA,EAAAA,EAAO6B,eAAP7B,IAAAA,GAAAA,OAAAA,EAAiB8B,MAsBzB"}

package/dist/es-legacy/components/internal/IssuerList/IssuerList.js

@@ -1,2 +1,2 @@
-import{createElement as e,Fragment as t}from"../../../external/preact/dist/preact.js";import{useState as s,useRef as r,useCallback as o,useEffect as n}from"../../../external/preact/hooks/dist/hooks.js";import i from"../../../utils/useForm/useForm.js";import l from"../FormFields/Field/Field.js";import a from"./IssuerButtonGroup/IssuerButtonGroup.js";import u from"../ContentSeparator/ContentSeparator.js";import{useCoreContext as c}from"../../../core/Context/CoreProvider.js";import m from"../../../core/Errors/useSRPanelContext.js";import{ERROR_ACTION_FOCUS_FIELD as d}from"../../../core/Errors/constants.js";import{setFocusOnField as p}from"../../../utils/setFocus.js";import f from"../DisclaimerMessage/DisclaimerMessage.js";import g from"../FormFields/Select/Select.js";import{ANALYTICS_SEARCH_DEBOUNCE_TIME as h}from"../../../core/Analytics/constants.js";import{debounce as y}from"../../../utils/debounce.js";import{AnalyticsInfoEvent as b,UiTarget as j,InfoEventType as v}from"../../../core/Analytics/events/AnalyticsInfoEvent.js";function O(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}function C(e,t){if(null==e)return{};var s,r,o,n={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(s=Reflect.ownKeys(Object(e)),o=0;o<s.length;o++)r=s[o],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r]);return n}if(n=function(e,t){if(null==e)return{};var s,r,o={},n=Object.getOwnPropertyNames(e);for(r=0;r<n.length;r++)s=n[r],t.indexOf(s)>=0||Object.prototype.propertyIsEnumerable.call(e,s)&&(o[s]=e[s]);return o}(e,t),Object.getOwnPropertySymbols)for(s=Object.getOwnPropertySymbols(e),o=0;o<s.length;o++)r=s[o],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r]);return n}const x=({issuer:e,items:t},s)=>{var r;const o=null===(r=t.find(t=>t.id===e))||void 0===r?void 0:r.name;return e&&o?`${s.get("continueTo")} ${o}`:s.get("continue")},S=["issuer"],w={issuer:{validate:e=>!!e&&e.length>0,errorMessage:"issuerList.selectField.contextualText",modes:["blur"]}};function F(F){let{items:I,placeholder:E,issuer:A,highlightedIds:P=[],showContextualElement:_,contextualText:M,selectFieldLabel:R}=F,k=C(F,["items","placeholder","issuer","highlightedIds","showContextualElement","contextualText","selectFieldLabel"]);const{i18n:T}=c(),{handleChangeFor:V,triggerValidation:L,data:N,valid:B,errors:D,isValid:K}=i({schema:S,defaultData:{issuer:A},rules:w}),[G,$]=s("ready"),[q,z]=s(1),{setSRMessagesFromObjects:H,shouldMoveFocusSR:J}=m(),Q=null==H?void 0:H({}),U=r(null),W=o(e=>t=>{const s=1===e?j.list:j.featuredIssuer,r=I.find(e=>e.id===t.target.value),o=new b({component:k.type,type:v.selected,target:s,issuer:r.name});k.onSubmitAnalytics(o),z(e),V("issuer")(t)},[V,k.type]),X=o(e=>{if(e){const e=new b({component:k.type,type:v.displayed,target:j.list});k.onSubmitAnalytics(e)}},[k.type,k.onSubmitAnalytics]),Y=r(y(k.onSubmitAnalytics,h)),Z=o(()=>{Y.current({type:v.input,target:j.listSearch})},[]),ee=r({setStatus:$,showValidation:()=>{L()}});n(()=>{k.setComponentRef(ee.current)},[k.setComponentRef]),n(()=>{k.onChange({data:N,valid:B,errors:D,isValid:K});const e=null==Q?void 0:Q({errors:D,isValidating:!0});(null==e?void 0:e.action)===d&&J&&p(U.current,"issuer-list")},[N,B,D,K]);const{highlightedItems:te}=I.reduce((e,t)=>(P.includes(t.id)&&e.highlightedItems.push(function(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{},r=Object.keys(s);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(s).filter(function(e){return Object.getOwnPropertyDescriptor(s,e).enumerable}))),r.forEach(function(t){O(e,t,s[t])})}return e}({},t)),e),{highlightedItems:[]});return e("div",{ref:U,className:"adyen-checkout__issuer-list"},!!te.length&&e(t,null,e(a,{selectedIssuerId:0===q?N.issuer:null,items:te,onChange:W(0)}),e(u,null)),e(l,{label:null!=R?R:T.get("issuerList.selectField.label"),errorMessage:(se=D.issuer,se&&se.errorMessage?T.get(se.errorMessage):!!se),classNameModifiers:["issuer-list"],name:"issuer",showContextualElement:_,contextualText:M},e(g,{items:I,selectedValue:1===q?N.issuer:null,placeholder:E,name:"issuer",className:"adyen-checkout__issuer-list__dropdown",onChange:W(1),onListToggle:X,onInput:Z})),k.termsAndConditions&&e("div",{className:"adyen-checkout__issuer-list__termsAndConditions"},e(f,{message:T.get(k.termsAndConditions.translationKey),urls:k.termsAndConditions.urls})),k.showPayButton&&k.payButton({status:G,label:x({issuer:N.issuer,items:[...I,...te]},T)}));var se}F.defaultProps={onChange:()=>{}};export{F as default};
+import{createElement as e,Fragment as t}from"../../../external/preact/dist/preact.js";import{useState as s,useRef as r,useCallback as o,useEffect as n}from"../../../external/preact/hooks/dist/hooks.js";import i from"../../../utils/useForm/useForm.js";import{setFocusOnField as l}from"../../../utils/setFocus.js";import a from"../FormFields/Field/Field.js";import u from"./IssuerButtonGroup/IssuerButtonGroup.js";import c from"../ContentSeparator/ContentSeparator.js";import{useCoreContext as m}from"../../../core/Context/CoreProvider.js";import d from"../../../core/Errors/useSRPanelContext.js";import{ERROR_ACTION_FOCUS_FIELD as p}from"../../../core/Errors/constants.js";import f from"../DisclaimerMessage/DisclaimerMessage.js";import g from"../FormFields/Select/Select.js";import{ANALYTICS_SEARCH_DEBOUNCE_TIME as h}from"../../../core/Analytics/constants.js";import{debounce as y}from"../../../utils/debounce.js";import{AnalyticsInfoEvent as b,UiTarget as j,InfoEventType as v}from"../../../core/Analytics/events/AnalyticsInfoEvent.js";function O(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}function C(e,t){if(null==e)return{};var s,r,o,n={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(s=Reflect.ownKeys(Object(e)),o=0;o<s.length;o++)r=s[o],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r]);return n}if(n=function(e,t){if(null==e)return{};var s,r,o={},n=Object.getOwnPropertyNames(e);for(r=0;r<n.length;r++)s=n[r],t.indexOf(s)>=0||Object.prototype.propertyIsEnumerable.call(e,s)&&(o[s]=e[s]);return o}(e,t),Object.getOwnPropertySymbols)for(s=Object.getOwnPropertySymbols(e),o=0;o<s.length;o++)r=s[o],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r]);return n}const x=({issuer:e,items:t},s)=>{var r;const o=null===(r=t.find(t=>t.id===e))||void 0===r?void 0:r.name;return e&&o?`${s.get("continueTo")} ${o}`:s.get("continue")},S=["issuer"],w={issuer:{validate:e=>!!e&&e.length>0,errorMessage:"issuerList.selectField.contextualText",modes:["blur"]}};function F(F){let{items:I,placeholder:E,issuer:A,highlightedIds:P=[],showContextualElement:_,contextualText:M,selectFieldLabel:R}=F,k=C(F,["items","placeholder","issuer","highlightedIds","showContextualElement","contextualText","selectFieldLabel"]);const{i18n:T}=m(),{handleChangeFor:V,triggerValidation:L,data:N,valid:B,errors:D,isValid:K}=i({schema:S,defaultData:{issuer:A},rules:w}),[G,$]=s("ready"),[q,z]=s(1),{setSRMessagesFromObjects:H,shouldMoveFocusSR:J}=d(),Q=null==H?void 0:H({}),U=r(null),W=o(e=>t=>{const s=1===e?j.list:j.featuredIssuer,r=I.find(e=>e.id===t.target.value),o=new b({component:k.type,type:v.selected,target:s,issuer:r.name});k.onSubmitAnalytics(o),z(e),V("issuer")(t)},[V,k.type]),X=o(e=>{if(e){const e=new b({component:k.type,type:v.displayed,target:j.list});k.onSubmitAnalytics(e)}},[k.type,k.onSubmitAnalytics]),Y=r(y(k.onSubmitAnalytics,h)),Z=o(()=>{Y.current({type:v.input,target:j.listSearch})},[]),ee=r({setStatus:$,showValidation:()=>{L()}});n(()=>{k.setComponentRef(ee.current)},[k.setComponentRef]),n(()=>{k.onChange({data:N,valid:B,errors:D,isValid:K});const e=null==Q?void 0:Q({errors:D,isValidating:!0});(null==e?void 0:e.action)===p&&J&&l(U.current,"issuer-list")},[N,B,D,K]);const{highlightedItems:te}=I.reduce((e,t)=>(P.includes(t.id)&&e.highlightedItems.push(function(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{},r=Object.keys(s);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(s).filter(function(e){return Object.getOwnPropertyDescriptor(s,e).enumerable}))),r.forEach(function(t){O(e,t,s[t])})}return e}({},t)),e),{highlightedItems:[]});return e("div",{ref:U,className:"adyen-checkout__issuer-list"},!!te.length&&e(t,null,e(u,{selectedIssuerId:0===q?N.issuer:null,items:te,onChange:W(0)}),e(c,null)),e(a,{label:null!=R?R:T.get("issuerList.selectField.label"),errorMessage:(se=D.issuer,se&&se.errorMessage?T.get(se.errorMessage):!!se),classNameModifiers:["issuer-list"],name:"issuer",showContextualElement:_,contextualText:M},e(g,{items:I,selectedValue:1===q?N.issuer:null,placeholder:E,name:"issuer",className:"adyen-checkout__issuer-list__dropdown",onChange:W(1),onListToggle:X,onInput:Z})),k.termsAndConditions&&e("div",{className:"adyen-checkout__issuer-list__termsAndConditions"},e(f,{message:T.get(k.termsAndConditions.translationKey),urls:k.termsAndConditions.urls})),k.showPayButton&&k.payButton({status:G,label:x({issuer:N.issuer,items:[...I,...te]},T)}));var se}F.defaultProps={onChange:()=>{}};export{F as default};
 //# sourceMappingURL=IssuerList.js.map

package/dist/es-legacy/components/internal/PersonalDetails/PersonalDetails.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import{useMemo as r,useRef as t,useEffect as a}from"../../../external/preact/hooks/dist/hooks.js";import l from"../FormFields/Fieldset/Fieldset.js";import s from"../FormFields/Field/Field.js";import i from"./ReadOnlyPersonalDetails.js";import{personalDetailsValidationRules as o}from"./validate.js";import{useCoreContext as n}from"../../../core/Context/CoreProvider.js";import{checkDateInputSupport as m}from"../FormFields/InputDate/utils.js";import{getFormattedData as p}from"./utils.js";import u from"../../../utils/useForm/useForm.js";import d from"../FormFields/InputText.js";import f from"../FormFields/InputDate/InputDate.js";import c from"../FormFields/InputEmail.js";import h from"../FormFields/InputTelephone.js";import{getErrorMessage as b}from"../../../utils/getErrorMessage.js";function N(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function O(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},a=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),a.forEach(function(r){N(e,r,t[r])})}return e}function g(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}),e}const j=["firstName","lastName","dateOfBirth","shopperEmail","telephoneNumber"];function F(N){const{label:j="",namePrefix:F,placeholders:y,requiredFields:v,visibility:M}=N,{i18n:B}=n(),E=r(m,[]),{handleChangeFor:P,triggerValidation:I,data:w,valid:D,errors:q,isValid:C}=u({schema:v,rules:O({},o,N.validationRules),defaultData:N.data}),k=t({showValidation:()=>{I()}});a(()=>{N.setComponentRef(k.current)},[N.setComponentRef]);const x=e=>r=>{const{name:t}=r.target,a=t.split(`${F}.`).pop();P(a,e)(r)},R=e=>`${F?`${F}.`:""}${e}`;return a(()=>{const e=p(w);N.onChange({data:e,valid:D,errors:q,isValid:C})},[w,D,q,C]),"hidden"===M?null:"readOnly"===M?e(i,g(O({},N),{data:w})):e(l,{classNameModifiers:["personalDetails"],label:j},v.includes("firstName")&&e(s,{label:B.get("firstName"),classNameModifiers:["col-50","firstName"],errorMessage:b(B,q.firstName,B.get("firstName")),name:"firstName",i18n:B},e(d,{name:R("firstName"),value:w.firstName,classNameModifiers:["firstName"],onInput:x("input"),onBlur:x("blur"),placeholder:y.firstName,spellcheck:!1,required:!0})),v.includes("lastName")&&e(s,{label:B.get("lastName"),classNameModifiers:["col-50","lastName"],errorMessage:b(B,q.lastName,B.get("lastName")),name:"lastName",i18n:B},e(d,{name:R("lastName"),value:w.lastName,classNameModifiers:["lastName"],onInput:x("input"),onBlur:x("blur"),placeholder:y.lastName,spellcheck:!1,required:!0})),v.includes("dateOfBirth")&&e(s,{label:B.get("dateOfBirth"),classNameModifiers:["col-50","dateOfBirth"],errorMessage:b(B,q.dateOfBirth,B.get("dateOfBirth")),helper:E?null:B.get("dateOfBirth.format"),name:"dateOfBirth",i18n:B},e(f,{name:R("dateOfBirth"),value:w.dateOfBirth,classNameModifiers:["dateOfBirth"],onInput:x("input"),onBlur:x("blur"),placeholder:y.dateOfBirth,required:!0})),v.includes("shopperEmail")&&e(s,{label:B.get("shopperEmail"),classNameModifiers:["shopperEmail"],errorMessage:b(B,q.shopperEmail,B.get("shopperEmail")),dir:"ltr",name:"emailAddress",i18n:B},e(c,{name:R("shopperEmail"),value:w.shopperEmail,classNameModifiers:["shopperEmail"],onInput:x("input"),onBlur:x("blur"),placeholder:y.shopperEmail,required:!0})),v.includes("telephoneNumber")&&e(s,{label:B.get("telephoneNumber"),classNameModifiers:["telephoneNumber"],errorMessage:b(B,q.telephoneNumber,B.get("telephoneNumber")),dir:"ltr",name:"telephoneNumber",i18n:B},e(h,{name:R("telephoneNumber"),value:w.telephoneNumber,classNameModifiers:["telephoneNumber"],onInput:x("input"),onBlur:x("blur"),placeholder:y.telephoneNumber,required:!0})))}F.defaultProps={data:{},onChange:()=>{},placeholders:{},requiredFields:j,validationRules:o,visibility:"editable"};export{j as PERSONAL_DETAILS_SCHEMA,F as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import{useMemo as r,useRef as t,useEffect as a}from"../../../external/preact/hooks/dist/hooks.js";import s from"../FormFields/Fieldset/Fieldset.js";import i from"../FormFields/Field/Field.js";import l from"./ReadOnlyPersonalDetails.js";import{personalDetailsValidationRules as o}from"./validate.js";import{useCoreContext as n}from"../../../core/Context/CoreProvider.js";import{checkDateInputSupport as m}from"../FormFields/InputDate/utils.js";import{getFormattedData as p}from"./utils.js";import u from"../../../utils/useForm/useForm.js";import"../SecuredFields/lib/CSF/utils/userAgent.js";import d from"../FormFields/InputText.js";import f from"../FormFields/InputDate/InputDate.js";import c from"../FormFields/InputEmail.js";import h from"../FormFields/InputTelephone.js";import{getErrorMessage as b}from"../../../utils/getErrorMessage.js";function N(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function O(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},a=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),a.forEach(function(r){N(e,r,t[r])})}return e}function g(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}),e}const j=["firstName","lastName","dateOfBirth","shopperEmail","telephoneNumber"];function F(N){const{label:j="",namePrefix:F,placeholders:y,requiredFields:v,visibility:M}=N,{i18n:B}=n(),E=r(m,[]),{handleChangeFor:P,triggerValidation:I,data:w,valid:D,errors:C,isValid:q}=u({schema:v,rules:O({},o,N.validationRules),defaultData:N.data}),k=t({showValidation:()=>{I()}});a(()=>{N.setComponentRef(k.current)},[N.setComponentRef]);const x=e=>r=>{const{name:t}=r.target,a=t.split(`${F}.`).pop();P(a,e)(r)},R=e=>`${F?`${F}.`:""}${e}`;return a(()=>{const e=p(w);N.onChange({data:e,valid:D,errors:C,isValid:q})},[w,D,C,q]),"hidden"===M?null:"readOnly"===M?e(l,g(O({},N),{data:w})):e(s,{classNameModifiers:["personalDetails"],label:j},v.includes("firstName")&&e(i,{label:B.get("firstName"),classNameModifiers:["col-50","firstName"],errorMessage:b(B,C.firstName,B.get("firstName")),name:"firstName",i18n:B},e(d,{name:R("firstName"),value:w.firstName,classNameModifiers:["firstName"],onInput:x("input"),onBlur:x("blur"),placeholder:y.firstName,spellcheck:!1,required:!0})),v.includes("lastName")&&e(i,{label:B.get("lastName"),classNameModifiers:["col-50","lastName"],errorMessage:b(B,C.lastName,B.get("lastName")),name:"lastName",i18n:B},e(d,{name:R("lastName"),value:w.lastName,classNameModifiers:["lastName"],onInput:x("input"),onBlur:x("blur"),placeholder:y.lastName,spellcheck:!1,required:!0})),v.includes("dateOfBirth")&&e(i,{label:B.get("dateOfBirth"),classNameModifiers:["col-50","dateOfBirth"],errorMessage:b(B,C.dateOfBirth,B.get("dateOfBirth")),helper:E?null:B.get("dateOfBirth.format"),name:"dateOfBirth",i18n:B},e(f,{name:R("dateOfBirth"),value:w.dateOfBirth,classNameModifiers:["dateOfBirth"],onInput:x("input"),onBlur:x("blur"),placeholder:y.dateOfBirth,required:!0})),v.includes("shopperEmail")&&e(i,{label:B.get("shopperEmail"),classNameModifiers:["shopperEmail"],errorMessage:b(B,C.shopperEmail,B.get("shopperEmail")),dir:"ltr",name:"emailAddress",i18n:B},e(c,{name:R("shopperEmail"),value:w.shopperEmail,classNameModifiers:["shopperEmail"],onInput:x("input"),onBlur:x("blur"),placeholder:y.shopperEmail,required:!0})),v.includes("telephoneNumber")&&e(i,{label:B.get("telephoneNumber"),classNameModifiers:["telephoneNumber"],errorMessage:b(B,C.telephoneNumber,B.get("telephoneNumber")),dir:"ltr",name:"telephoneNumber",i18n:B},e(h,{name:R("telephoneNumber"),value:w.telephoneNumber,classNameModifiers:["telephoneNumber"],onInput:x("input"),onBlur:x("blur"),placeholder:y.telephoneNumber,required:!0})))}F.defaultProps={data:{},onChange:()=>{},placeholders:{},requiredFields:j,validationRules:o,visibility:"editable"};export{j as PERSONAL_DETAILS_SCHEMA,F as default};
 //# sourceMappingURL=PersonalDetails.js.map

package/dist/es-legacy/components/internal/PersonalDetails/PersonalDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"PersonalDetails.js","sources":["../../../../../src/components/internal/PersonalDetails/PersonalDetails.tsx"],"sourcesContent":["import { GenericEventHandler, h } from 'preact';\nimport { useEffect, useMemo, useRef } from 'preact/hooks';\nimport Fieldset from '../FormFields/Fieldset';\nimport Field from '../FormFields/Field';\nimport ReadOnlyPersonalDetails from './ReadOnlyPersonalDetails';\nimport { personalDetailsValidationRules } from './validate';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { PersonalDetailsProps } from './types';\nimport { checkDateInputSupport } from '../FormFields/InputDate/utils';\nimport { PersonalDetailsSchema } from '../../../types';\nimport { getFormattedData } from './utils';\nimport useForm from '../../../utils/useForm';\nimport InputText from '../FormFields/InputText';\nimport InputDate from '../FormFields/InputDate';\nimport InputEmail from '../FormFields/InputEmail';\nimport InputTelephone from '../FormFields/InputTelephone';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport { ComponentMethodsRef } from '../UIElement/types';\nimport { HandleChangeForModeType } from '../../../utils/useForm/types';\nimport './PersonalDetails.scss';\n\nexport const PERSONAL_DETAILS_SCHEMA = ['firstName', 'lastName', 'dateOfBirth', 'shopperEmail', 'telephoneNumber'];\n\nexport default function PersonalDetails(props: Readonly<PersonalDetailsProps>) {\n    const { label = '', namePrefix, placeholders, requiredFields, visibility } = props;\n\n    const { i18n } = useCoreContext();\n\n    const isDateInputSupported = useMemo(checkDateInputSupport, []);\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<PersonalDetailsSchema>({\n        schema: requiredFields,\n        // Ensure any passed validation rules are merged with the default ones\n        rules: { ...personalDetailsValidationRules, ...props.validationRules },\n        defaultData: props.data\n    });\n\n    const personalDetailsRef = useRef<ComponentMethodsRef>({\n        showValidation: () => {\n            triggerValidation();\n        }\n    });\n\n    useEffect(() => {\n        props.setComponentRef(personalDetailsRef.current);\n    }, [props.setComponentRef]);\n\n    const eventHandler =\n        (mode: HandleChangeForModeType): GenericEventHandler<EventTarget> =>\n        (e: Event): void => {\n            const { name } = e.target as HTMLInputElement;\n            const key = name.split(`${namePrefix}.`).pop();\n\n            handleChangeFor(key, mode)(e);\n        };\n\n    const generateFieldName = (name: string): string => `${namePrefix ? `${namePrefix}.` : ''}${name}`;\n\n    useEffect(() => {\n        const formattedData = getFormattedData(data);\n        props.onChange({ data: formattedData, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    if (visibility === 'hidden') return null;\n    if (visibility === 'readOnly') return <ReadOnlyPersonalDetails {...props} data={data} />;\n\n    return (\n        <Fieldset classNameModifiers={['personalDetails']} label={label}>\n            {requiredFields.includes('firstName') && (\n                <Field\n                    label={i18n.get('firstName')}\n                    classNameModifiers={['col-50', 'firstName']}\n                    errorMessage={getErrorMessage(i18n, errors.firstName, i18n.get('firstName'))}\n                    name={'firstName'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        name={generateFieldName('firstName')}\n                        value={data.firstName}\n                        classNameModifiers={['firstName']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.firstName}\n                        spellcheck={false}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {requiredFields.includes('lastName') && (\n                <Field\n                    label={i18n.get('lastName')}\n                    classNameModifiers={['col-50', 'lastName']}\n                    errorMessage={getErrorMessage(i18n, errors.lastName, i18n.get('lastName'))}\n                    name={'lastName'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        name={generateFieldName('lastName')}\n                        value={data.lastName}\n                        classNameModifiers={['lastName']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.lastName}\n                        spellcheck={false}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {requiredFields.includes('dateOfBirth') && (\n                <Field\n                    label={i18n.get('dateOfBirth')}\n                    classNameModifiers={['col-50', 'dateOfBirth']}\n                    errorMessage={getErrorMessage(i18n, errors.dateOfBirth, i18n.get('dateOfBirth'))}\n                    helper={isDateInputSupported ? null : i18n.get('dateOfBirth.format')}\n                    name={'dateOfBirth'}\n                    i18n={i18n}\n                >\n                    <InputDate\n                        name={generateFieldName('dateOfBirth')}\n                        value={data.dateOfBirth}\n                        classNameModifiers={['dateOfBirth']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.dateOfBirth}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {requiredFields.includes('shopperEmail') && (\n                <Field\n                    label={i18n.get('shopperEmail')}\n                    classNameModifiers={['shopperEmail']}\n                    errorMessage={getErrorMessage(i18n, errors.shopperEmail, i18n.get('shopperEmail'))}\n                    dir={'ltr'}\n                    name={'emailAddress'}\n                    i18n={i18n}\n                >\n                    <InputEmail\n                        name={generateFieldName('shopperEmail')}\n                        value={data.shopperEmail}\n                        classNameModifiers={['shopperEmail']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.shopperEmail}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {requiredFields.includes('telephoneNumber') && (\n                <Field\n                    label={i18n.get('telephoneNumber')}\n                    classNameModifiers={['telephoneNumber']}\n                    errorMessage={getErrorMessage(i18n, errors.telephoneNumber, i18n.get('telephoneNumber'))}\n                    dir={'ltr'}\n                    name={'telephoneNumber'}\n                    i18n={i18n}\n                >\n                    <InputTelephone\n                        name={generateFieldName('telephoneNumber')}\n                        value={data.telephoneNumber}\n                        classNameModifiers={['telephoneNumber']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.telephoneNumber}\n                        required={true}\n                    />\n                </Field>\n            )}\n        </Fieldset>\n    );\n}\n\nPersonalDetails.defaultProps = {\n    data: {},\n    onChange: () => {},\n    placeholders: {},\n    requiredFields: PERSONAL_DETAILS_SCHEMA,\n    validationRules: personalDetailsValidationRules,\n    visibility: 'editable'\n};\n"],"names":["PERSONAL_DETAILS_SCHEMA","PersonalDetails","props","label","namePrefix","placeholders","requiredFields","visibility","i18n","useCoreContext","isDateInputSupported","useMemo","checkDateInputSupport","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","rules","_object_spread","personalDetailsValidationRules","validationRules","defaultData","personalDetailsRef","useRef","showValidation","useEffect","setComponentRef","current","eventHandler","mode","e","name","target","key","split","pop","generateFieldName","formattedData","getFormattedData","onChange","h","ReadOnlyPersonalDetails","Fieldset","classNameModifiers","includes","Field","get","errorMessage","getErrorMessage","firstName","InputText","value","onInput","onBlur","placeholder","spellcheck","required","lastName","dateOfBirth","helper","InputDate","shopperEmail","dir","InputEmail","telephoneNumber","InputTelephone","defaultProps"],"mappings":"6oDAqBaA,EAA0B,CAAC,YAAa,WAAY,cAAe,eAAgB,mBAEjF,SAASC,EAAgBC,GACpC,MAAMC,MAAEA,EAAQ,GAAEC,WAAEA,EAAUC,aAAEA,EAAYC,eAAEA,EAAcC,WAAEA,GAAeL,GAEvEM,KAAEA,GAASC,IAEXC,EAAuBC,EAAQC,EAAuB,KACtDC,gBAAEA,EAAeC,kBAAEA,EAAiBC,KAAEA,EAAIC,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,GAAYC,EAA+B,CACxGC,OAAQd,EAERe,MAAOC,EAAA,CAAA,EAAKC,EAAmCrB,EAAMsB,iBACrDC,YAAavB,EAAMa,OAGjBW,EAAqBC,EAA4B,CACnDC,eAAgB,KACZd,OAIRe,EAAU,KACN3B,EAAM4B,gBAAgBJ,EAAmBK,UAC1C,CAAC7B,EAAM4B,kBAEV,MAAME,EACDC,GACAC,IACG,MAAMC,KAAEA,GAASD,EAAEE,OACbC,EAAMF,EAAKG,MAAM,GAAGlC,MAAemC,MAEzC1B,EAAgBwB,EAAKJ,EAArBpB,CAA2BqB,IAG7BM,EAAqBL,GAAyB,GAAG/B,EAAa,GAAGA,KAAgB,KAAK+B,IAO5F,OALAN,EAAU,KACN,MAAMY,EAAgBC,EAAiB3B,GACvCb,EAAMyC,SAAS,CAAE5B,KAAM0B,EAAezB,QAAOC,SAAQC,aACtD,CAACH,EAAMC,EAAOC,EAAQC,IAEN,WAAfX,EAAgC,KACjB,aAAfA,EAAkCqC,EAACC,EAAAA,EAAAA,EAAAA,GAA4B3C,GAAAA,CAAOa,KAAMA,KAG5E6B,EAACE,EAAAA,CAASC,mBAAoB,CAAC,mBAAoB5C,MAAOA,GACrDG,EAAe0C,SAAS,cACrBJ,EAACK,EAAAA,CACG9C,MAAOK,EAAK0C,IAAI,aAChBH,mBAAoB,CAAC,SAAU,aAC/BI,aAAcC,EAAgB5C,EAAMS,EAAOoC,UAAW7C,EAAK0C,IAAI,cAC/Df,KAAM,YACN3B,KAAMA,GAENoC,EAACU,EAAAA,CACGnB,KAAMK,EAAkB,aACxBe,MAAOxC,EAAKsC,UACZN,mBAAoB,CAAC,aACrBS,QAASxB,EAAa,SACtByB,OAAQzB,EAAa,QACrB0B,YAAarD,EAAagD,UAC1BM,YAAY,EACZC,UAAU,KAKrBtD,EAAe0C,SAAS,aACrBJ,EAACK,EAAAA,CACG9C,MAAOK,EAAK0C,IAAI,YAChBH,mBAAoB,CAAC,SAAU,YAC/BI,aAAcC,EAAgB5C,EAAMS,EAAO4C,SAAUrD,EAAK0C,IAAI,aAC9Df,KAAM,WACN3B,KAAMA,GAENoC,EAACU,EAAAA,CACGnB,KAAMK,EAAkB,YACxBe,MAAOxC,EAAK8C,SACZd,mBAAoB,CAAC,YACrBS,QAASxB,EAAa,SACtByB,OAAQzB,EAAa,QACrB0B,YAAarD,EAAawD,SAC1BF,YAAY,EACZC,UAAU,KAKrBtD,EAAe0C,SAAS,gBACrBJ,EAACK,EAAAA,CACG9C,MAAOK,EAAK0C,IAAI,eAChBH,mBAAoB,CAAC,SAAU,eAC/BI,aAAcC,EAAgB5C,EAAMS,EAAO6C,YAAatD,EAAK0C,IAAI,gBACjEa,OAAQrD,EAAuB,KAAOF,EAAK0C,IAAI,sBAC/Cf,KAAM,cACN3B,KAAMA,GAENoC,EAACoB,EAAAA,CACG7B,KAAMK,EAAkB,eACxBe,MAAOxC,EAAK+C,YACZf,mBAAoB,CAAC,eACrBS,QAASxB,EAAa,SACtByB,OAAQzB,EAAa,QACrB0B,YAAarD,EAAayD,YAC1BF,UAAU,KAKrBtD,EAAe0C,SAAS,iBACrBJ,EAACK,EAAAA,CACG9C,MAAOK,EAAK0C,IAAI,gBAChBH,mBAAoB,CAAC,gBACrBI,aAAcC,EAAgB5C,EAAMS,EAAOgD,aAAczD,EAAK0C,IAAI,iBAClEgB,IAAK,MACL/B,KAAM,eACN3B,KAAMA,GAENoC,EAACuB,EAAAA,CACGhC,KAAMK,EAAkB,gBACxBe,MAAOxC,EAAKkD,aACZlB,mBAAoB,CAAC,gBACrBS,QAASxB,EAAa,SACtByB,OAAQzB,EAAa,QACrB0B,YAAarD,EAAa4D,aAC1BL,UAAU,KAKrBtD,EAAe0C,SAAS,oBACrBJ,EAACK,EAAAA,CACG9C,MAAOK,EAAK0C,IAAI,mBAChBH,mBAAoB,CAAC,mBACrBI,aAAcC,EAAgB5C,EAAMS,EAAOmD,gBAAiB5D,EAAK0C,IAAI,oBACrEgB,IAAK,MACL/B,KAAM,kBACN3B,KAAMA,GAENoC,EAACyB,EAAAA,CACGlC,KAAMK,EAAkB,mBACxBe,MAAOxC,EAAKqD,gBACZrB,mBAAoB,CAAC,mBACrBS,QAASxB,EAAa,SACtByB,OAAQzB,EAAa,QACrB0B,YAAarD,EAAa+D,gBAC1BR,UAAU,KAMlC,CAEA3D,EAAgBqE,aAAe,CAC3BvD,KAAM,CAAA,EACN4B,SAAU,OACVtC,aAAc,CAAA,EACdC,eAAgBN,EAChBwB,gBAAiBD,EACjBhB,WAAY"}
+{"version":3,"file":"PersonalDetails.js","sources":["../../../../../src/components/internal/PersonalDetails/PersonalDetails.tsx"],"sourcesContent":["import { GenericEventHandler, h } from 'preact';\nimport { useEffect, useMemo, useRef } from 'preact/hooks';\nimport Fieldset from '../FormFields/Fieldset';\nimport Field from '../FormFields/Field';\nimport ReadOnlyPersonalDetails from './ReadOnlyPersonalDetails';\nimport { personalDetailsValidationRules } from './validate';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { PersonalDetailsProps } from './types';\nimport { checkDateInputSupport } from '../FormFields/InputDate/utils';\nimport { PersonalDetailsSchema } from '../../../types';\nimport { getFormattedData } from './utils';\nimport useForm from '../../../utils/useForm';\nimport InputText from '../FormFields/InputText';\nimport InputDate from '../FormFields/InputDate';\nimport InputEmail from '../FormFields/InputEmail';\nimport InputTelephone from '../FormFields/InputTelephone';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport { ComponentMethodsRef } from '../UIElement/types';\nimport { HandleChangeForModeType } from '../../../utils/useForm/types';\nimport './PersonalDetails.scss';\n\nexport const PERSONAL_DETAILS_SCHEMA = ['firstName', 'lastName', 'dateOfBirth', 'shopperEmail', 'telephoneNumber'];\n\nexport default function PersonalDetails(props: Readonly<PersonalDetailsProps>) {\n    const { label = '', namePrefix, placeholders, requiredFields, visibility } = props;\n\n    const { i18n } = useCoreContext();\n\n    const isDateInputSupported = useMemo(checkDateInputSupport, []);\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<PersonalDetailsSchema>({\n        schema: requiredFields,\n        // Ensure any passed validation rules are merged with the default ones\n        rules: { ...personalDetailsValidationRules, ...props.validationRules },\n        defaultData: props.data\n    });\n\n    const personalDetailsRef = useRef<ComponentMethodsRef>({\n        showValidation: () => {\n            triggerValidation();\n        }\n    });\n\n    useEffect(() => {\n        props.setComponentRef(personalDetailsRef.current);\n    }, [props.setComponentRef]);\n\n    const eventHandler =\n        (mode: HandleChangeForModeType): GenericEventHandler<EventTarget> =>\n        (e: Event): void => {\n            const { name } = e.target as HTMLInputElement;\n            const key = name.split(`${namePrefix}.`).pop();\n\n            handleChangeFor(key, mode)(e);\n        };\n\n    const generateFieldName = (name: string): string => `${namePrefix ? `${namePrefix}.` : ''}${name}`;\n\n    useEffect(() => {\n        const formattedData = getFormattedData(data);\n        props.onChange({ data: formattedData, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    if (visibility === 'hidden') return null;\n    if (visibility === 'readOnly') return <ReadOnlyPersonalDetails {...props} data={data} />;\n\n    return (\n        <Fieldset classNameModifiers={['personalDetails']} label={label}>\n            {requiredFields.includes('firstName') && (\n                <Field\n                    label={i18n.get('firstName')}\n                    classNameModifiers={['col-50', 'firstName']}\n                    errorMessage={getErrorMessage(i18n, errors.firstName, i18n.get('firstName'))}\n                    name={'firstName'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        name={generateFieldName('firstName')}\n                        value={data.firstName}\n                        classNameModifiers={['firstName']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.firstName}\n                        spellcheck={false}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {requiredFields.includes('lastName') && (\n                <Field\n                    label={i18n.get('lastName')}\n                    classNameModifiers={['col-50', 'lastName']}\n                    errorMessage={getErrorMessage(i18n, errors.lastName, i18n.get('lastName'))}\n                    name={'lastName'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        name={generateFieldName('lastName')}\n                        value={data.lastName}\n                        classNameModifiers={['lastName']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.lastName}\n                        spellcheck={false}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {requiredFields.includes('dateOfBirth') && (\n                <Field\n                    label={i18n.get('dateOfBirth')}\n                    classNameModifiers={['col-50', 'dateOfBirth']}\n                    errorMessage={getErrorMessage(i18n, errors.dateOfBirth, i18n.get('dateOfBirth'))}\n                    helper={isDateInputSupported ? null : i18n.get('dateOfBirth.format')}\n                    name={'dateOfBirth'}\n                    i18n={i18n}\n                >\n                    <InputDate\n                        name={generateFieldName('dateOfBirth')}\n                        value={data.dateOfBirth}\n                        classNameModifiers={['dateOfBirth']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.dateOfBirth}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {requiredFields.includes('shopperEmail') && (\n                <Field\n                    label={i18n.get('shopperEmail')}\n                    classNameModifiers={['shopperEmail']}\n                    errorMessage={getErrorMessage(i18n, errors.shopperEmail, i18n.get('shopperEmail'))}\n                    dir={'ltr'}\n                    name={'emailAddress'}\n                    i18n={i18n}\n                >\n                    <InputEmail\n                        name={generateFieldName('shopperEmail')}\n                        value={data.shopperEmail}\n                        classNameModifiers={['shopperEmail']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.shopperEmail}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {requiredFields.includes('telephoneNumber') && (\n                <Field\n                    label={i18n.get('telephoneNumber')}\n                    classNameModifiers={['telephoneNumber']}\n                    errorMessage={getErrorMessage(i18n, errors.telephoneNumber, i18n.get('telephoneNumber'))}\n                    dir={'ltr'}\n                    name={'telephoneNumber'}\n                    i18n={i18n}\n                >\n                    <InputTelephone\n                        name={generateFieldName('telephoneNumber')}\n                        value={data.telephoneNumber}\n                        classNameModifiers={['telephoneNumber']}\n                        onInput={eventHandler('input')}\n                        onBlur={eventHandler('blur')}\n                        placeholder={placeholders.telephoneNumber}\n                        required={true}\n                    />\n                </Field>\n            )}\n        </Fieldset>\n    );\n}\n\nPersonalDetails.defaultProps = {\n    data: {},\n    onChange: () => {},\n    placeholders: {},\n    requiredFields: PERSONAL_DETAILS_SCHEMA,\n    validationRules: personalDetailsValidationRules,\n    visibility: 'editable'\n};\n"],"names":["PERSONAL_DETAILS_SCHEMA","PersonalDetails","props","label","namePrefix","placeholders","requiredFields","visibility","i18n","useCoreContext","isDateInputSupported","useMemo","checkDateInputSupport","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","rules","_object_spread","personalDetailsValidationRules","validationRules","defaultData","personalDetailsRef","useRef","showValidation","useEffect","setComponentRef","current","eventHandler","mode","e","name","target","key","split","pop","generateFieldName","formattedData","getFormattedData","onChange","h","ReadOnlyPersonalDetails","Fieldset","classNameModifiers","includes","Field","get","errorMessage","getErrorMessage","firstName","InputText","value","onInput","onBlur","placeholder","spellcheck","required","lastName","dateOfBirth","helper","InputDate","shopperEmail","dir","InputEmail","telephoneNumber","InputTelephone","defaultProps"],"mappings":"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"}

package/dist/es-legacy/components/internal/PhoneInput/PhoneInputFields.js

@@ -1,2 +1,2 @@
-import{createElement as e,Fragment as r}from"../../../external/preact/dist/preact.js";import{useEffect as o}from"../../../external/preact/hooks/dist/hooks.js";import n from"../FormFields/Field/Field.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import l from"../FormFields/Select/Select.js";import p from"../FormFields/InputText.js";function i(e,r){if(null==e)return{};var o,n,t,l={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(o=Reflect.ownKeys(Object(e)),t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(l[n]=e[n]);return l}if(l=function(e,r){if(null==e)return{};var o,n,t={},l=Object.getOwnPropertyNames(e);for(n=0;n<l.length;n++)o=l[n],r.indexOf(o)>=0||Object.prototype.propertyIsEnumerable.call(e,o)&&(t[o]=e[o]);return t}(e,r),Object.getOwnPropertySymbols)for(o=Object.getOwnPropertySymbols(e),t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(l[n]=e[n]);return l}function a(a){let{getError:u,showNumber:c,showPrefix:m,form:h,canSelectPrefix:s=!0}=a,d=i(a,["getError","showNumber","showPrefix","form","canSelectPrefix"]);var f,b,y;const{i18n:x}=t(),{handleChangeFor:N,data:g,valid:P}=h;return o(()=>{g.phoneNumber&&N("phoneNumber","blur")(g.phoneNumber)},[g.phonePrefix]),e(r,null,m&&e(n,{className:"adyen-checkout-field--phone-prefix",label:x.get("telephonePrefix"),errorMessage:u("phonePrefix"),showValidIcon:!1,isValid:P.phonePrefix,dir:"ltr",i18n:x,name:"phonePrefix"},e(l,{readonly:!s,className:"adyen-checkout-dropdown adyen-checkout-dropdown--countrycode-selector",name:"phonePrefix",items:d.items,onChange:N("phonePrefix"),placeholder:null==d||null===(f=d.placeholders)||void 0===f?void 0:f.phonePrefix,selectedValue:g.phonePrefix})),c&&e(n,{className:"adyen-checkout-field--phone-number",label:d.phoneNumberKey?x.get(d.phoneNumberKey):x.get("telephoneNumber"),errorMessage:u("phoneNumber"),isValid:P.phoneNumber,filled:(null==g||null===(b=g.phoneNumber)||void 0===b?void 0:b.length)>0,dir:"ltr",i18n:x,name:"phoneNumber"},e(p,{className:"adyen-checkout__input adyen-checkout-input adyen-checkout-input--phone-number",type:"tel",name:"phoneNumber",value:g.phoneNumber,onInput:N("phoneNumber","input"),onBlur:N("phoneNumber","blur"),placeholder:null==d||null===(y=d.placeholders)||void 0===y?void 0:y.phoneNumber,autoCorrect:"off",required:!0})))}export{a as default};
+import{createElement as e,Fragment as r}from"../../../external/preact/dist/preact.js";import{useEffect as o}from"../../../external/preact/hooks/dist/hooks.js";import n from"../FormFields/Field/Field.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import l from"../FormFields/Select/Select.js";import i from"../FormFields/InputText.js";function p(e,r){if(null==e)return{};var o,n,t,l={};if("undefined"!=typeof Reflect&&Reflect.ownKeys){for(o=Reflect.ownKeys(Object(e)),t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(l[n]=e[n]);return l}if(l=function(e,r){if(null==e)return{};var o,n,t={},l=Object.getOwnPropertyNames(e);for(n=0;n<l.length;n++)o=l[n],r.indexOf(o)>=0||Object.prototype.propertyIsEnumerable.call(e,o)&&(t[o]=e[o]);return t}(e,r),Object.getOwnPropertySymbols)for(o=Object.getOwnPropertySymbols(e),t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(l[n]=e[n]);return l}function a(a){let{getError:u,showNumber:c,showPrefix:m,form:h,canSelectPrefix:s=!0,errorLive:d}=a,f=p(a,["getError","showNumber","showPrefix","form","canSelectPrefix","errorLive"]);var b,y,x;const{i18n:N}=t(),{handleChangeFor:g,data:P,valid:v}=h;return o(()=>{P.phoneNumber&&g("phoneNumber","blur")(P.phoneNumber)},[P.phonePrefix]),e(r,null,m&&e(n,{className:"adyen-checkout-field--phone-prefix",label:N.get("telephonePrefix"),errorMessage:u("phonePrefix"),showValidIcon:!1,isValid:v.phonePrefix,dir:"ltr",i18n:N,name:"phonePrefix",errorLive:d},e(l,{readonly:!s,className:"adyen-checkout-dropdown adyen-checkout-dropdown--countrycode-selector",name:"phonePrefix",items:f.items,onChange:g("phonePrefix"),placeholder:null==f||null===(b=f.placeholders)||void 0===b?void 0:b.phonePrefix,selectedValue:P.phonePrefix})),c&&e(n,{className:"adyen-checkout-field--phone-number",label:f.phoneNumberKey?N.get(f.phoneNumberKey):N.get("telephoneNumber"),errorMessage:u("phoneNumber"),isValid:v.phoneNumber,filled:(null==P||null===(y=P.phoneNumber)||void 0===y?void 0:y.length)>0,dir:"ltr",i18n:N,name:"phoneNumber",errorLive:d},e(i,{className:"adyen-checkout__input adyen-checkout-input adyen-checkout-input--phone-number",type:"tel",name:"phoneNumber",value:P.phoneNumber,onInput:g("phoneNumber","input"),onBlur:g("phoneNumber","blur"),placeholder:null==f||null===(x=f.placeholders)||void 0===x?void 0:x.phoneNumber,autoCorrect:"off",required:!0})))}export{a as default};
 //# sourceMappingURL=PhoneInputFields.js.map

package/dist/es-legacy/components/internal/PhoneInput/PhoneInputFields.js.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneInputFields.js","sources":["../../../../../src/components/internal/PhoneInput/PhoneInputFields.tsx"],"sourcesContent":["import { Fragment, h } from 'preact';\nimport { useEffect } from 'preact/hooks';\nimport Field from '../FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './PhoneInput.scss';\nimport Select from '../FormFields/Select';\nimport { PhoneInputSchema } from './types';\nimport InputText from '../FormFields/InputText';\nimport { DataSet } from '../../../core/Services/data-set';\nimport { Form } from '../../../utils/useForm/types';\n\nexport interface PhoneInputFieldProps {\n    items: DataSet;\n    requiredFields?: string[];\n    form: Form<PhoneInputSchema>;\n    getError: (key: string) => string | boolean;\n    phoneNumberKey?: string;\n    phonePrefixErrorKey?: string;\n    phoneNumberErrorKey?: string;\n    placeholders?: PhoneInputSchema;\n    showPrefix?: boolean;\n    showNumber?: boolean;\n    canSelectPrefix?: boolean;\n}\n/**\n *\n * @param PhoneInputFormProps\n * @constructor\n */\nexport default function PhoneInputFields({\n    getError,\n    showNumber,\n    showPrefix,\n    form,\n    canSelectPrefix = true,\n    ...props\n}: Readonly<PhoneInputFieldProps>) {\n    const { i18n } = useCoreContext();\n\n    const { handleChangeFor, data, valid } = form;\n\n    // Force re-validation of the phoneNumber when data.phonePrefix changes (since the validation rules will also change)\n    useEffect((): void => {\n        if (data.phoneNumber) {\n            handleChangeFor('phoneNumber', 'blur')(data.phoneNumber);\n        }\n    }, [data.phonePrefix]);\n\n    return (\n        <Fragment>\n            {showPrefix && (\n                <Field\n                    className={'adyen-checkout-field--phone-prefix'}\n                    label={i18n.get('telephonePrefix')}\n                    errorMessage={getError('phonePrefix')}\n                    showValidIcon={false}\n                    isValid={valid.phonePrefix}\n                    dir={'ltr'}\n                    i18n={i18n}\n                    name={'phonePrefix'}\n                >\n                    <Select\n                        readonly={!canSelectPrefix}\n                        className={'adyen-checkout-dropdown adyen-checkout-dropdown--countrycode-selector'}\n                        name={'phonePrefix'}\n                        items={props.items}\n                        onChange={handleChangeFor('phonePrefix')}\n                        placeholder={props?.placeholders?.phonePrefix}\n                        selectedValue={data.phonePrefix}\n                    />\n                </Field>\n            )}\n\n            {showNumber && (\n                <Field\n                    className={'adyen-checkout-field--phone-number'}\n                    label={props.phoneNumberKey ? i18n.get(props.phoneNumberKey) : i18n.get('telephoneNumber')}\n                    errorMessage={getError('phoneNumber')}\n                    isValid={valid.phoneNumber}\n                    filled={data?.phoneNumber?.length > 0}\n                    dir={'ltr'}\n                    i18n={i18n}\n                    name={'phoneNumber'}\n                >\n                    <InputText\n                        className=\"adyen-checkout__input adyen-checkout-input adyen-checkout-input--phone-number\"\n                        type=\"tel\"\n                        name=\"phoneNumber\"\n                        value={data.phoneNumber}\n                        onInput={handleChangeFor('phoneNumber', 'input')}\n                        onBlur={handleChangeFor('phoneNumber', 'blur')}\n                        placeholder={props?.placeholders?.phoneNumber}\n                        autoCorrect=\"off\"\n                        required={true}\n                    />\n                </Field>\n            )}\n        </Fragment>\n    );\n}\n"],"names":["PhoneInputFields","_0","getError","showNumber","showPrefix","form","canSelectPrefix","props","data","i18n","useCoreContext","handleChangeFor","valid","useEffect","phoneNumber","phonePrefix","h","Fragment","Field","className","label","get","errorMessage","showValidIcon","isValid","dir","name","Select","readonly","items","onChange","placeholder","placeholders","selectedValue","phoneNumberKey","filled","length","InputText","type","value","onInput","onBlur","autoCorrect","required"],"mappings":"m+BA6Be,SAASA,EAAiBC,OAAAC,SACrCA,EAAQC,WACRA,EAAUC,WACVA,EAAUC,KACVA,EAAIC,gBACJA,GAAkB,GAEWL,EAD1BM,EAAAA,EAAAA,EAAAA,iEAgC8BA,IAAAA,EAYTC,EAYSD,EAtDjC,MAAME,KAAEA,GAASC,KAEXC,gBAAEA,EAAeH,KAAEA,EAAII,MAAEA,GAAUP,EASzC,OANAQ,EAAU,KACFL,EAAKM,aACLH,EAAgB,cAAe,OAA/BA,CAAuCH,EAAKM,cAEjD,CAACN,EAAKO,cAGLC,EAACC,EAAAA,KACIb,GACGY,EAACE,EAAAA,CACGC,UAAW,qCACXC,MAAOX,EAAKY,IAAI,mBAChBC,aAAcpB,EAAS,eACvBqB,eAAe,EACfC,QAASZ,EAAMG,YACfU,IAAK,MACLhB,KAAMA,EACNiB,KAAM,eAENV,EAACW,EAAAA,CACGC,UAAWtB,EACXa,UAAW,wEACXO,KAAM,cACNG,MAAOtB,EAAMsB,MACbC,SAAUnB,EAAgB,eAC1BoB,YAAaxB,SAAmB,QAAnBA,EAAAA,EAAOyB,oBAAPzB,IAAAA,OAAAA,EAAAA,EAAqBQ,YAClCkB,cAAezB,EAAKO,eAK/BZ,GACGa,EAACE,EAAAA,CACGC,UAAW,qCACXC,MAAOb,EAAM2B,eAAiBzB,EAAKY,IAAId,EAAM2B,gBAAkBzB,EAAKY,IAAI,mBACxEC,aAAcpB,EAAS,eACvBsB,QAASZ,EAAME,YACfqB,QAAQ3B,SAAiB,QAAjBA,EAAAA,EAAMM,mBAANN,IAAAA,OAAAA,EAAAA,EAAmB4B,QAAS,EACpCX,IAAK,MACLhB,KAAMA,EACNiB,KAAM,eAENV,EAACqB,EAAAA,CACGlB,UAAU,gFACVmB,KAAK,MACLZ,KAAK,cACLa,MAAO/B,EAAKM,YACZ0B,QAAS7B,EAAgB,cAAe,SACxC8B,OAAQ9B,EAAgB,cAAe,QACvCoB,YAAaxB,SAAmB,QAAnBA,EAAAA,EAAOyB,oBAAPzB,IAAAA,OAAAA,EAAAA,EAAqBO,YAClC4B,YAAY,MACZC,UAAU,KAMlC"}
+{"version":3,"file":"PhoneInputFields.js","sources":["../../../../../src/components/internal/PhoneInput/PhoneInputFields.tsx"],"sourcesContent":["import { Fragment, h } from 'preact';\nimport { useEffect } from 'preact/hooks';\nimport Field from '../FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './PhoneInput.scss';\nimport Select from '../FormFields/Select';\nimport { PhoneInputSchema } from './types';\nimport InputText from '../FormFields/InputText';\nimport { DataSet } from '../../../core/Services/data-set';\nimport { Form } from '../../../utils/useForm/types';\n\nexport interface PhoneInputFieldProps {\n    items: DataSet;\n    requiredFields?: string[];\n    form: Form<PhoneInputSchema>;\n    getError: (key: string) => string | boolean;\n    phoneNumberKey?: string;\n    phonePrefixErrorKey?: string;\n    phoneNumberErrorKey?: string;\n    placeholders?: PhoneInputSchema;\n    showPrefix?: boolean;\n    showNumber?: boolean;\n    canSelectPrefix?: boolean;\n    errorLive?: boolean;\n}\n/**\n *\n * @param PhoneInputFormProps\n * @constructor\n */\nexport default function PhoneInputFields({\n    getError,\n    showNumber,\n    showPrefix,\n    form,\n    canSelectPrefix = true,\n    errorLive,\n    ...props\n}: Readonly<PhoneInputFieldProps>) {\n    const { i18n } = useCoreContext();\n\n    const { handleChangeFor, data, valid } = form;\n\n    // Force re-validation of the phoneNumber when data.phonePrefix changes (since the validation rules will also change)\n    useEffect((): void => {\n        if (data.phoneNumber) {\n            handleChangeFor('phoneNumber', 'blur')(data.phoneNumber);\n        }\n    }, [data.phonePrefix]);\n\n    return (\n        <Fragment>\n            {showPrefix && (\n                <Field\n                    className={'adyen-checkout-field--phone-prefix'}\n                    label={i18n.get('telephonePrefix')}\n                    errorMessage={getError('phonePrefix')}\n                    showValidIcon={false}\n                    isValid={valid.phonePrefix}\n                    dir={'ltr'}\n                    i18n={i18n}\n                    name={'phonePrefix'}\n                    errorLive={errorLive}\n                >\n                    <Select\n                        readonly={!canSelectPrefix}\n                        className={'adyen-checkout-dropdown adyen-checkout-dropdown--countrycode-selector'}\n                        name={'phonePrefix'}\n                        items={props.items}\n                        onChange={handleChangeFor('phonePrefix')}\n                        placeholder={props?.placeholders?.phonePrefix}\n                        selectedValue={data.phonePrefix}\n                    />\n                </Field>\n            )}\n\n            {showNumber && (\n                <Field\n                    className={'adyen-checkout-field--phone-number'}\n                    label={props.phoneNumberKey ? i18n.get(props.phoneNumberKey) : i18n.get('telephoneNumber')}\n                    errorMessage={getError('phoneNumber')}\n                    isValid={valid.phoneNumber}\n                    filled={data?.phoneNumber?.length > 0}\n                    dir={'ltr'}\n                    i18n={i18n}\n                    name={'phoneNumber'}\n                    errorLive={errorLive}\n                >\n                    <InputText\n                        className=\"adyen-checkout__input adyen-checkout-input adyen-checkout-input--phone-number\"\n                        type=\"tel\"\n                        name=\"phoneNumber\"\n                        value={data.phoneNumber}\n                        onInput={handleChangeFor('phoneNumber', 'input')}\n                        onBlur={handleChangeFor('phoneNumber', 'blur')}\n                        placeholder={props?.placeholders?.phoneNumber}\n                        autoCorrect=\"off\"\n                        required={true}\n                    />\n                </Field>\n            )}\n        </Fragment>\n    );\n}\n"],"names":["PhoneInputFields","_0","getError","showNumber","showPrefix","form","canSelectPrefix","errorLive","props","data","i18n","useCoreContext","handleChangeFor","valid","useEffect","phoneNumber","phonePrefix","h","Fragment","Field","className","label","get","errorMessage","showValidIcon","isValid","dir","name","Select","readonly","items","onChange","placeholder","placeholders","selectedValue","phoneNumberKey","filled","length","InputText","type","value","onInput","onBlur","autoCorrect","required"],"mappings":"m+BA8Be,SAASA,EAAiBC,GAAA,IAAAC,SACrCA,EAAQC,WACRA,EAAUC,WACVA,EAAUC,KACVA,EAAIC,gBACJA,GAAkB,EAAIC,UACtBA,GAE6BN,EAD1BO,EAAAA,EAAAA,EAAAA,6EAiC8BA,IAAAA,EAYTC,EAaSD,EAxDjC,MAAME,KAAEA,GAASC,KAEXC,gBAAEA,EAAeH,KAAEA,EAAII,MAAEA,GAAUR,EASzC,OANAS,EAAU,KACFL,EAAKM,aACLH,EAAgB,cAAe,OAA/BA,CAAuCH,EAAKM,cAEjD,CAACN,EAAKO,cAGLC,EAACC,EAAAA,KACId,GACGa,EAACE,EAAAA,CACGC,UAAW,qCACXC,MAAOX,EAAKY,IAAI,mBAChBC,aAAcrB,EAAS,eACvBsB,eAAe,EACfC,QAASZ,EAAMG,YACfU,IAAK,MACLhB,KAAMA,EACNiB,KAAM,cACNpB,UAAWA,GAEXU,EAACW,EAAAA,CACGC,UAAWvB,EACXc,UAAW,wEACXO,KAAM,cACNG,MAAOtB,EAAMsB,MACbC,SAAUnB,EAAgB,eAC1BoB,YAAaxB,SAAmB,QAAnBA,EAAAA,EAAOyB,oBAAPzB,IAAAA,OAAAA,EAAAA,EAAqBQ,YAClCkB,cAAezB,EAAKO,eAK/Bb,GACGc,EAACE,EAAAA,CACGC,UAAW,qCACXC,MAAOb,EAAM2B,eAAiBzB,EAAKY,IAAId,EAAM2B,gBAAkBzB,EAAKY,IAAI,mBACxEC,aAAcrB,EAAS,eACvBuB,QAASZ,EAAME,YACfqB,QAAQ3B,SAAiB,QAAjBA,EAAAA,EAAMM,mBAANN,IAAAA,OAAAA,EAAAA,EAAmB4B,QAAS,EACpCX,IAAK,MACLhB,KAAMA,EACNiB,KAAM,cACNpB,UAAWA,GAEXU,EAACqB,EAAAA,CACGlB,UAAU,gFACVmB,KAAK,MACLZ,KAAK,cACLa,MAAO/B,EAAKM,YACZ0B,QAAS7B,EAAgB,cAAe,SACxC8B,OAAQ9B,EAAgB,cAAe,QACvCoB,YAAaxB,SAAmB,QAAnBA,EAAAA,EAAOyB,oBAAPzB,IAAAA,OAAAA,EAAAA,EAAqBO,YAClC4B,YAAY,MACZC,UAAU,KAMlC"}

package/dist/es-legacy/components/internal/PhoneInput/PhoneInputForm.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import{useEffect as r,useRef as t,useCallback as o}from"../../../external/preact/hooks/dist/hooks.js";import n from"../../../utils/useForm/useForm.js";import{useCoreContext as i}from"../../../core/Context/CoreProvider.js";import{phoneFormatters as s,phoneValidationRules as l}from"./validate.js";import a from"../FormFields/Fieldset/Fieldset.js";import u from"./PhoneInputFields.js";function c(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function p(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),o.forEach(function(r){c(e,r,t[r])})}return e}function f(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}),e}function m(c){var m,d;const{i18n:b}=i(),h=c.requiredFields||[...(null==c||null===(m=c.items)||void 0===m?void 0:m.length)?["phonePrefix"]:[],"phoneNumber"],O=h.includes("phonePrefix")&&!!(null==c||null===(d=c.items)||void 0===d?void 0:d.length),j=h.includes("phoneNumber"),y=n(f(p({i18n:b},c),{schema:h,defaultData:c.data,rules:l,formatters:s}));r(()=>{y.setSchema(h)},[h.toString()]);const{data:g,valid:P,errors:v,isValid:w,triggerValidation:x}=y;r(()=>{c.onChange({data:g,valid:P,errors:v,isValid:w})},[g,P,v,w]);const F=t({showValidation:x});r(()=>{c.setComponentRef(F.current)},[c.setComponentRef]);const E=o(e=>{if(v[e]){var r;const t="phoneNumber"===e?"phoneNumberErrorKey":"phonePrefixErrorKey",o=c[t]?c[t]:v[e].errorMessage;return null!==(r=b.get(o))&&void 0!==r?r:null}return null},[v]);return e(a,{classNameModifiers:["phone-input"]},e(u,p({getError:E,showNumber:j,showPrefix:O,form:y},c)))}m.defaultProps={phoneLabel:"telephoneNumber"};export{m as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import{useEffect as r,useRef as t,useCallback as o}from"../../../external/preact/hooks/dist/hooks.js";import n from"../../../utils/useForm/useForm.js";import"../SecuredFields/lib/CSF/utils/userAgent.js";import{useCoreContext as i}from"../../../core/Context/CoreProvider.js";import{phoneFormatters as s,phoneValidationRules as l}from"./validate.js";import a from"../FormFields/Fieldset/Fieldset.js";import u from"./PhoneInputFields.js";function c(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function p(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),o.forEach(function(r){c(e,r,t[r])})}return e}function f(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}),e}function m(c){var m,d;const{i18n:b}=i(),h=c.requiredFields||[...(null==c||null===(m=c.items)||void 0===m?void 0:m.length)?["phonePrefix"]:[],"phoneNumber"],j=h.includes("phonePrefix")&&!!(null==c||null===(d=c.items)||void 0===d?void 0:d.length),O=h.includes("phoneNumber"),g=n(f(p({i18n:b},c),{schema:h,defaultData:c.data,rules:l,formatters:s}));r(()=>{g.setSchema(h)},[h.toString()]);const{data:y,valid:P,errors:v,isValid:w,triggerValidation:F}=g;r(()=>{c.onChange({data:y,valid:P,errors:v,isValid:w})},[y,P,v,w]);const x=t({showValidation:F});r(()=>{c.setComponentRef(x.current)},[c.setComponentRef]);const S=o(e=>{if(v[e]){var r;const t="phoneNumber"===e?"phoneNumberErrorKey":"phonePrefixErrorKey",o=c[t]?c[t]:v[e].errorMessage;return null!==(r=b.get(o))&&void 0!==r?r:null}return null},[v]);return e(a,{classNameModifiers:["phone-input"]},e(u,p({getError:S,showNumber:O,showPrefix:j,form:g},c)))}m.defaultProps={phoneLabel:"telephoneNumber"};export{m as default};
 //# sourceMappingURL=PhoneInputForm.js.map

package/dist/es-legacy/components/internal/PhoneInput/PhoneInputForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneInputForm.js","sources":["../../../../../src/components/internal/PhoneInput/PhoneInputForm.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useCallback, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './PhoneInput.scss';\nimport { phoneFormatters, phoneValidationRules } from './validate';\nimport { PhoneInputFormProps, PhoneInputSchema } from './types';\nimport Fieldset from '../FormFields/Fieldset';\nimport PhoneInputFields from './PhoneInputFields';\nimport { ComponentMethodsRef } from '../UIElement/types';\n\n/**\n *\n * @param PhoneInputFormProps\n * @constructor\n */\nfunction PhoneInputForm(props: Readonly<PhoneInputFormProps>) {\n    const { i18n } = useCoreContext();\n\n    const schema = props.requiredFields || [...(props?.items?.length ? ['phonePrefix'] : []), 'phoneNumber'];\n    const showPrefix = schema.includes('phonePrefix') && !!props?.items?.length;\n    const showNumber = schema.includes('phoneNumber');\n\n    const form = useForm<PhoneInputSchema>({\n        i18n,\n        ...props,\n        schema,\n        defaultData: props.data,\n        rules: phoneValidationRules,\n        formatters: phoneFormatters\n    });\n\n    useEffect(() => {\n        form.setSchema(schema);\n    }, [schema.toString()]);\n\n    const { data, valid, errors, isValid, triggerValidation } = form;\n\n    useEffect(() => {\n        props.onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    const componentRef = useRef<ComponentMethodsRef>({\n        showValidation: triggerValidation\n    });\n\n    useEffect(() => {\n        props.setComponentRef(componentRef.current);\n    }, [props.setComponentRef]);\n\n    // This is here for MBWay, prob should be moved up\n    // MBWay has a weird way of loading its error messages\n    // They come form the prop phoneNumberErrorKey: 'mobileNumber.invalid'\n    // Strangely it's defined as invalidPhoneNumber in the validation rules\n    const getPhoneFieldError = useCallback(\n        (field: string) => {\n            if (errors[field]) {\n                const propsField = field === 'phoneNumber' ? 'phoneNumberErrorKey' : 'phonePrefixErrorKey';\n                const key = props[propsField] ? props[propsField] : errors[field].errorMessage;\n                return i18n.get(key) ?? null;\n            }\n            return null;\n        },\n        [errors]\n    );\n\n    return (\n        <Fieldset classNameModifiers={['phone-input']}>\n            <PhoneInputFields getError={getPhoneFieldError} showNumber={showNumber} showPrefix={showPrefix} form={form} {...props} />\n        </Fieldset>\n    );\n}\n\nPhoneInputForm.defaultProps = {\n    phoneLabel: 'telephoneNumber'\n};\n\nexport default PhoneInputForm;\n"],"names":["PhoneInputForm","props","i18n","useCoreContext","schema","requiredFields","items","length","showPrefix","includes","showNumber","form","useForm","_object_spread_props","_object_spread","defaultData","data","rules","phoneValidationRules","formatters","phoneFormatters","useEffect","setSchema","toString","valid","errors","isValid","triggerValidation","onChange","componentRef","useRef","showValidation","setComponentRef","current","getPhoneFieldError","useCallback","field","propsField","key","errorMessage","get","h","Fieldset","classNameModifiers","PhoneInputFields","getError","defaultProps","phoneLabel"],"mappings":"gvCAgBA,SAASA,EAAeC,OAGwBA,EACWA,EAHvD,MAAMC,KAAEA,GAASC,IAEXC,EAASH,EAAMI,gBAAkB,KAAKJ,SAAY,QAAZA,EAAAA,EAAOK,aAAPL,IAAAA,SAAAA,EAAcM,QAAS,CAAC,eAAiB,GAAK,eACpFC,EAAaJ,EAAOK,SAAS,mBAAoBR,SAAY,QAAZA,EAAAA,EAAOK,iBAAPL,OAAAA,EAAAA,EAAcM,QAC/DG,EAAaN,EAAOK,SAAS,eAE7BE,EAAOC,EAA0BC,EAAAC,EAAA,CACnCZ,QACGD,GAAAA,CACHG,SACAW,YAAad,EAAMe,KACnBC,MAAOC,EACPC,WAAYC,KAGhBC,EAAU,KACNV,EAAKW,UAAUlB,IAChB,CAACA,EAAOmB,aAEX,MAAMP,KAAEA,EAAIQ,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,EAAOC,kBAAEA,GAAsBhB,EAE5DU,EAAU,KACNpB,EAAM2B,SAAS,CAAEZ,OAAMQ,QAAOC,SAAQC,aACvC,CAACV,EAAMQ,EAAOC,EAAQC,IAEzB,MAAMG,EAAeC,EAA4B,CAC7CC,eAAgBJ,IAGpBN,EAAU,KACNpB,EAAM+B,gBAAgBH,EAAaI,UACpC,CAAChC,EAAM+B,kBAMV,MAAME,EAAqBC,EACtBC,IACG,GAAIX,EAAOW,GAAQ,CAGRlC,IAAAA,EAFP,MAAMmC,EAAuB,gBAAVD,EAA0B,sBAAwB,sBAC/DE,EAAMrC,EAAMoC,GAAcpC,EAAMoC,GAAcZ,EAAOW,GAAOG,aAClE,OAAgBD,QAATpC,EAAAA,EAAKsC,IAAIF,cAATpC,EAAAA,EAAiB,IAC5B,CACA,OAAO,MAEX,CAACuB,IAGL,OACIgB,EAACC,EAAAA,CAASC,mBAAoB,CAAC,gBAC3BF,EAACG,EAAAA,EAAAA,CAAiBC,SAAUX,EAAoBxB,WAAYA,EAAYF,WAAYA,EAAYG,KAAMA,GAAUV,IAG5H,CAEAD,EAAe8C,aAAe,CAC1BC,WAAY"}
+{"version":3,"file":"PhoneInputForm.js","sources":["../../../../../src/components/internal/PhoneInput/PhoneInputForm.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useCallback, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './PhoneInput.scss';\nimport { phoneFormatters, phoneValidationRules } from './validate';\nimport { PhoneInputFormProps, PhoneInputSchema } from './types';\nimport Fieldset from '../FormFields/Fieldset';\nimport PhoneInputFields from './PhoneInputFields';\nimport { ComponentMethodsRef } from '../UIElement/types';\n\n/**\n *\n * @param PhoneInputFormProps\n * @constructor\n */\nfunction PhoneInputForm(props: Readonly<PhoneInputFormProps>) {\n    const { i18n } = useCoreContext();\n\n    const schema = props.requiredFields || [...(props?.items?.length ? ['phonePrefix'] : []), 'phoneNumber'];\n    const showPrefix = schema.includes('phonePrefix') && !!props?.items?.length;\n    const showNumber = schema.includes('phoneNumber');\n\n    const form = useForm<PhoneInputSchema>({\n        i18n,\n        ...props,\n        schema,\n        defaultData: props.data,\n        rules: phoneValidationRules,\n        formatters: phoneFormatters\n    });\n\n    useEffect(() => {\n        form.setSchema(schema);\n    }, [schema.toString()]);\n\n    const { data, valid, errors, isValid, triggerValidation } = form;\n\n    useEffect(() => {\n        props.onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    const componentRef = useRef<ComponentMethodsRef>({\n        showValidation: triggerValidation\n    });\n\n    useEffect(() => {\n        props.setComponentRef(componentRef.current);\n    }, [props.setComponentRef]);\n\n    // This is here for MBWay, prob should be moved up\n    // MBWay has a weird way of loading its error messages\n    // They come form the prop phoneNumberErrorKey: 'mobileNumber.invalid'\n    // Strangely it's defined as invalidPhoneNumber in the validation rules\n    const getPhoneFieldError = useCallback(\n        (field: string) => {\n            if (errors[field]) {\n                const propsField = field === 'phoneNumber' ? 'phoneNumberErrorKey' : 'phonePrefixErrorKey';\n                const key = props[propsField] ? props[propsField] : errors[field].errorMessage;\n                return i18n.get(key) ?? null;\n            }\n            return null;\n        },\n        [errors]\n    );\n\n    return (\n        <Fieldset classNameModifiers={['phone-input']}>\n            <PhoneInputFields getError={getPhoneFieldError} showNumber={showNumber} showPrefix={showPrefix} form={form} {...props} />\n        </Fieldset>\n    );\n}\n\nPhoneInputForm.defaultProps = {\n    phoneLabel: 'telephoneNumber'\n};\n\nexport default PhoneInputForm;\n"],"names":["PhoneInputForm","props","i18n","useCoreContext","schema","requiredFields","items","length","showPrefix","includes","showNumber","form","useForm","_object_spread_props","_object_spread","defaultData","data","rules","phoneValidationRules","formatters","phoneFormatters","useEffect","setSchema","toString","valid","errors","isValid","triggerValidation","onChange","componentRef","useRef","showValidation","setComponentRef","current","getPhoneFieldError","useCallback","field","propsField","key","errorMessage","get","h","Fieldset","classNameModifiers","PhoneInputFields","getError","defaultProps","phoneLabel"],"mappings":"oyCAgBA,SAASA,EAAeC,OAGwBA,EACWA,EAHvD,MAAMC,KAAEA,GAASC,IAEXC,EAASH,EAAMI,gBAAkB,KAAKJ,SAAY,QAAZA,EAAAA,EAAOK,aAAPL,IAAAA,SAAAA,EAAcM,QAAS,CAAC,eAAiB,GAAK,eACpFC,EAAaJ,EAAOK,SAAS,mBAAoBR,SAAY,QAAZA,EAAAA,EAAOK,iBAAPL,OAAAA,EAAAA,EAAcM,QAC/DG,EAAaN,EAAOK,SAAS,eAE7BE,EAAOC,EAA0BC,EAAAC,EAAA,CACnCZ,QACGD,GAAAA,CACHG,SACAW,YAAad,EAAMe,KACnBC,MAAOC,EACPC,WAAYC,KAGhBC,EAAU,KACNV,EAAKW,UAAUlB,IAChB,CAACA,EAAOmB,aAEX,MAAMP,KAAEA,EAAIQ,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,EAAOC,kBAAEA,GAAsBhB,EAE5DU,EAAU,KACNpB,EAAM2B,SAAS,CAAEZ,OAAMQ,QAAOC,SAAQC,aACvC,CAACV,EAAMQ,EAAOC,EAAQC,IAEzB,MAAMG,EAAeC,EAA4B,CAC7CC,eAAgBJ,IAGpBN,EAAU,KACNpB,EAAM+B,gBAAgBH,EAAaI,UACpC,CAAChC,EAAM+B,kBAMV,MAAME,EAAqBC,EACtBC,IACG,GAAIX,EAAOW,GAAQ,CAGRlC,IAAAA,EAFP,MAAMmC,EAAuB,gBAAVD,EAA0B,sBAAwB,sBAC/DE,EAAMrC,EAAMoC,GAAcpC,EAAMoC,GAAcZ,EAAOW,GAAOG,aAClE,OAAgBD,QAATpC,EAAAA,EAAKsC,IAAIF,cAATpC,EAAAA,EAAiB,IAC5B,CACA,OAAO,MAEX,CAACuB,IAGL,OACIgB,EAACC,EAAAA,CAASC,mBAAoB,CAAC,gBAC3BF,EAACG,EAAAA,EAAAA,CAAiBC,SAAUX,EAAoBxB,WAAYA,EAAYF,WAAYA,EAAYG,KAAMA,GAAUV,IAG5H,CAEAD,EAAe8C,aAAe,CAC1BC,WAAY"}

package/dist/es-legacy/components/internal/SecuredFields/binLookup/extensions.js.map

@@ -1 +1 @@
-{"version":3,"file":"extensions.js","sources":["../../../../../../src/components/internal/SecuredFields/binLookup/extensions.ts"],"sourcesContent":["import { SingleBrandResetObject } from '../SFP/types';\nimport { BrandObject } from '../../../Card/types';\nimport createCardVariantSwitcher from './createCardVariantSwitcher';\nimport { BRAND_ICON_UI_EXCLUSION_LIST } from '../lib/constants';\nimport { requiresDualBrandSelection } from '../../../Card/components/CardInput/utils';\nimport { DUAL_BRANDS_THAT_NEED_SELECTION_MECHANISM } from '../../../Card/constants';\n\n// Externally testable utils\nexport const containsExcludedBrand = (brandsArr: BrandObject[], excludedBrands: string[]): boolean => {\n    return brandsArr.reduce((acc, brandObj) => acc || excludedBrands.includes(brandObj.brand), false);\n};\n\nexport const cloneBrandsArr = (brandsArr: BrandObject[]): BrandObject[] => brandsArr.map(item => ({ ...item }));\n\nexport const removeExcludedBrand = (brandsArr: BrandObject[], mainBrand1 = 'mc', mainBrand2 = 'visa'): BrandObject[] => {\n    const clonedBrands: BrandObject[] = cloneBrandsArr(brandsArr);\n\n    if (clonedBrands[0].brand !== mainBrand1 && clonedBrands[0].brand !== mainBrand2) clonedBrands.reverse();\n    clonedBrands.length = 1;\n    return clonedBrands;\n};\n// --\n\nexport default function extensions(props, refs, states, hasPanLengthRef: Partial<{ current }> = {}) {\n    // Destructure props, refs and state hooks\n    const { type, cvcPolicy } = props;\n    const { sfp } = refs;\n    const { dualBrandSelectElements, setDualBrandSelectElements, setSelectedBrandValue, issuingCountryCode, setIssuingCountryCode } = states;\n\n    return {\n        /**\n         * Handle the binLookup response object generated in triggerBinLookup and process it in relation to the CardInput and it's sub-components.\n         * e.g. we might need to add/remove additional markup (a selector for brands), and inform SFP of the issuingCountryCode & detected brand(s).\n         *\n         * @param binLookupResponse -\n         * @param isReset -\n         */\n        processBinLookup: (binLookupResponse, isReset) => {\n            const issuingCode = binLookupResponse?.issuingCountryCode ? binLookupResponse.issuingCountryCode.toLowerCase() : null;\n            setIssuingCountryCode(issuingCode);\n\n            // Reset UI\n            if (!binLookupResponse || !Object.keys(binLookupResponse).length) {\n                setDualBrandSelectElements([]);\n                setSelectedBrandValue('');\n\n                // If /binLookup has 'reset' then for a generic card the internal regex will kick in to show the right brand icon - so set to null\n                // However for a single-branded card we need to pass the \"base\" type so the brand logo is reset - so set to type\n                const brandToReset = isReset && type !== 'card' ? type : null;\n\n                sfp.current.processBinLookupResponse(binLookupResponse, {\n                    brand: brandToReset,\n                    cvcPolicy: cvcPolicy // undefined except for Bancontact\n                } as SingleBrandResetObject);\n\n                // Reset storage var\n                hasPanLengthRef.current = 0;\n                return;\n            }\n\n            // RESULT: binLookup has found a result so proceed accordingly\n            if (binLookupResponse.supportedBrands?.length) {\n                const hasExcludedBrand: boolean = containsExcludedBrand(binLookupResponse.supportedBrands, BRAND_ICON_UI_EXCLUSION_LIST);\n\n                const supportedBrands: BrandObject[] = hasExcludedBrand\n                    ? removeExcludedBrand(binLookupResponse.supportedBrands)\n                    : cloneBrandsArr(binLookupResponse.supportedBrands);\n\n                // 1) Multiple options found - add to the UI & inform SFP\n                if (supportedBrands.length > 1) {\n                    // --\n\n                    //  Only if the brands in DUAL_BRANDS_THAT_NEED_SELECTION_MECHANISM are present in the binLookup response should we show the dual brand selector\n                    const preselectBrand = requiresDualBrandSelection(DUAL_BRANDS_THAT_NEED_SELECTION_MECHANISM, supportedBrands, 'brand');\n\n                    const switcherObj = createCardVariantSwitcher(supportedBrands, preselectBrand);\n\n                    // Set properties on state to trigger the dual branding icons in the UI\n                    setDualBrandSelectElements(switcherObj.dualBrandSelectElements);\n                    setSelectedBrandValue(switcherObj.selectedBrandValue); // initially this value from switcherObj will be ''\n\n                    // Pass an object through to SFP\n                    sfp.current.processBinLookupResponse({\n                        issuingCountryCode: binLookupResponse.issuingCountryCode,\n                        supportedBrands: [switcherObj.leadBrand]\n                    });\n\n                    // Store the fact the binLookup obj has a panLength prop\n                    if (switcherObj.leadBrand.panLength > 0) {\n                        hasPanLengthRef.current = switcherObj.leadBrand.panLength;\n                    }\n\n                    // 2) Single option found (binValueObject.supportedBrands.length === 1)\n                } else {\n                    // Reset UI\n                    setDualBrandSelectElements([]);\n                    setSelectedBrandValue('');\n\n                    // Set (single) value from binLookup so it will be added to the 'brand' property in the paymentMethod object\n                    // EXCEPT - if we are dealing with a brand that we exclude from the UI\n                    if (!hasExcludedBrand) setSelectedBrandValue(supportedBrands[0].brand);\n\n                    // Pass object through to SFP\n                    sfp.current.processBinLookupResponse({\n                        issuingCountryCode: binLookupResponse.issuingCountryCode,\n                        supportedBrands\n                    });\n\n                    // Store the fact the binLookup obj has a panLength prop\n                    if (supportedBrands[0].panLength > 0) {\n                        hasPanLengthRef.current = supportedBrands[0].panLength;\n                    }\n                }\n            }\n        },\n        /**\n         * Handler for clicks on the icons added in response to the /binLookup call\n         * Inform SFP of the brand changes when these selections are made\n         */\n        handleDualBrandSelection: (brandValue: string): void => {\n            // Check if we have a value and whether that value corresponds to a brandObject we can propagate\n            // If either are false then abandon the process\n            let brandObjArr: BrandObject[] = [];\n            if (brandValue) {\n                // Find the brandObject with the matching brand value and place into an array\n                brandObjArr = dualBrandSelectElements.reduce((acc, item) => {\n                    if (item.brandObject.brand === brandValue) {\n                        acc.push(item.brandObject);\n                    }\n                    return acc;\n                }, []);\n\n                if (!brandObjArr.length) {\n                    return; // no brand object associated with value was found\n                }\n            } else {\n                return; // no value passed\n            }\n\n            setSelectedBrandValue(brandValue);\n\n            // Pass brand object into SecuredFields\n            sfp.current.processBinLookupResponse({\n                issuingCountryCode,\n                supportedBrands: brandObjArr,\n                isDualBrandSelection: true\n            });\n        }\n    };\n}\n"],"names":["containsExcludedBrand","brandsArr","excludedBrands","reduce","acc","brandObj","includes","brand","cloneBrandsArr","map","item","_object_spread","removeExcludedBrand","mainBrand1","mainBrand2","clonedBrands","reverse","length","extensions","props","refs","states","hasPanLengthRef","type","cvcPolicy","sfp","dualBrandSelectElements","setDualBrandSelectElements","setSelectedBrandValue","issuingCountryCode","setIssuingCountryCode","processBinLookup","binLookupResponse","isReset","issuingCode","toLowerCase","Object","keys","brandToReset","current","processBinLookupResponse","supportedBrands","hasExcludedBrand","BRAND_ICON_UI_EXCLUSION_LIST","preselectBrand","requiresDualBrandSelection","DUAL_BRANDS_THAT_NEED_SELECTION_MECHANISM","switcherObj","createCardVariantSwitcher","selectedBrandValue","leadBrand","panLength","handleDualBrandSelection","brandValue","brandObjArr","brandObject","push","isDualBrandSelection"],"mappings":"yZAQO,MAAMA,EAAwB,CAACC,EAA0BC,IACrDD,EAAUE,OAAO,CAACC,EAAKC,IAAaD,GAAOF,EAAeI,SAASD,EAASE,QAAQ,GAGlFC,EAAkBP,GAA4CA,EAAUQ,IAAIC,qUAASC,CAAA,CAAA,EAAKD,IAE1FE,EAAsB,CAACX,EAA0BY,EAAa,KAAMC,EAAa,UAC1F,MAAMC,EAA8BP,EAAeP,GAInD,OAFIc,EAAa,GAAGR,QAAUM,GAAcE,EAAa,GAAGR,QAAUO,GAAYC,EAAaC,UAC/FD,EAAaE,OAAS,EACfF,GAII,SAASG,EAAWC,EAAOC,EAAMC,EAAQC,EAAwC,CAAA,GAE5F,MAAMC,KAAEA,EAAIC,UAAEA,GAAcL,GACtBM,IAAEA,GAAQL,GACVM,wBAAEA,EAAuBC,2BAAEA,EAA0BC,sBAAEA,EAAqBC,mBAAEA,EAAkBC,sBAAEA,GAA0BT,EAElI,MAAO,CAQHU,iBAAkB,CAACC,EAAmBC,KAwB9BD,IAAAA,EAvBJ,MAAME,GAAcF,eAAAA,EAAmBH,oBAAqBG,EAAkBH,mBAAmBM,cAAgB,KAIjH,GAHAL,EAAsBI,IAGjBF,IAAsBI,OAAOC,KAAKL,GAAmBf,OAAQ,CAC9DU,EAA2B,IAC3BC,EAAsB,IAItB,MAAMU,EAAeL,GAAoB,SAATV,EAAkBA,EAAO,KASzD,OAPAE,EAAIc,QAAQC,yBAAyBR,EAAmB,CACpDzB,MAAO+B,EACPd,UAAWA,SAIfF,EAAgBiB,QAAU,EAE9B,CAGA,WAAIP,EAAAA,EAAkBS,2BAAlBT,OAAAA,EAAAA,EAAmCf,OAAQ,CAC3C,MAAMyB,EAA4B1C,EAAsBgC,EAAkBS,gBAAiBE,GAErFF,EAAiCC,EACjC9B,EAAoBoB,EAAkBS,iBACtCjC,EAAewB,EAAkBS,iBAGvC,GAAIA,EAAgBxB,OAAS,EAAG,CAI5B,MAAM2B,EAAiBC,EAA2BC,EAA2CL,EAAiB,SAExGM,EAAcC,EAA0BP,EAAiBG,GAG/DjB,EAA2BoB,EAAYrB,yBACvCE,EAAsBmB,EAAYE,oBAGlCxB,EAAIc,QAAQC,yBAAyB,CACjCX,mBAAoBG,EAAkBH,mBACtCY,gBAAiB,CAACM,EAAYG,aAI9BH,EAAYG,UAAUC,UAAY,IAClC7B,EAAgBiB,QAAUQ,EAAYG,UAAUC,UAIxD,MAEIxB,EAA2B,IAC3BC,EAAsB,IAIjBc,GAAkBd,EAAsBa,EAAgB,GAAGlC,OAGhEkB,EAAIc,QAAQC,yBAAyB,CACjCX,mBAAoBG,EAAkBH,mBACtCY,oBAIAA,EAAgB,GAAGU,UAAY,IAC/B7B,EAAgBiB,QAAUE,EAAgB,GAAGU,UAGzD,GAMJC,yBAA2BC,IAGvB,IAAIC,EAA6B,GAC7BD,IAEAC,EAAc5B,EAAwBvB,OAAO,CAACC,EAAKM,KAC3CA,EAAK6C,YAAYhD,QAAU8C,GAC3BjD,EAAIoD,KAAK9C,EAAK6C,aAEXnD,GACR,IAEEkD,EAAYrC,SAOrBW,EAAsByB,GAGtB5B,EAAIc,QAAQC,yBAAyB,CACjCX,qBACAY,gBAAiBa,EACjBG,sBAAsB,OAItC"}
+{"version":3,"file":"extensions.js","sources":["../../../../../../src/components/internal/SecuredFields/binLookup/extensions.ts"],"sourcesContent":["import { BrandObject } from '../../../Card/types';\nimport createCardVariantSwitcher from './createCardVariantSwitcher';\nimport { BRAND_ICON_UI_EXCLUSION_LIST } from '../lib/constants';\nimport { requiresDualBrandSelection } from '../../../Card/components/CardInput/utils';\nimport { DUAL_BRANDS_THAT_NEED_SELECTION_MECHANISM } from '../../../Card/constants';\n\n// Externally testable utils\nexport const containsExcludedBrand = (brandsArr: BrandObject[], excludedBrands: string[]): boolean => {\n    return brandsArr.reduce((acc, brandObj) => acc || excludedBrands.includes(brandObj.brand), false);\n};\n\nexport const cloneBrandsArr = (brandsArr: BrandObject[]): BrandObject[] => brandsArr.map(item => ({ ...item }));\n\nexport const removeExcludedBrand = (brandsArr: BrandObject[], mainBrand1 = 'mc', mainBrand2 = 'visa'): BrandObject[] => {\n    const clonedBrands: BrandObject[] = cloneBrandsArr(brandsArr);\n\n    if (clonedBrands[0].brand !== mainBrand1 && clonedBrands[0].brand !== mainBrand2) clonedBrands.reverse();\n    clonedBrands.length = 1;\n    return clonedBrands;\n};\n// --\n\nexport default function extensions(props, refs, states, hasPanLengthRef: Partial<{ current }> = {}) {\n    // Destructure props, refs and state hooks\n    const { type, cvcPolicy } = props;\n    const { sfp } = refs;\n    const { dualBrandSelectElements, setDualBrandSelectElements, setSelectedBrandValue, issuingCountryCode, setIssuingCountryCode } = states;\n\n    return {\n        /**\n         * Handle the binLookup response object generated in triggerBinLookup and process it in relation to the CardInput and it's sub-components.\n         * e.g. we might need to add/remove additional markup (a selector for brands), and inform SFP of the issuingCountryCode & detected brand(s).\n         *\n         * @param binLookupResponse -\n         * @param isReset -\n         */\n        processBinLookup: (binLookupResponse, isReset) => {\n            const issuingCode = binLookupResponse?.issuingCountryCode ? binLookupResponse.issuingCountryCode.toLowerCase() : null;\n            setIssuingCountryCode(issuingCode);\n\n            // Reset UI\n            if (!binLookupResponse || !Object.keys(binLookupResponse).length) {\n                setDualBrandSelectElements([]);\n                setSelectedBrandValue('');\n\n                // If /binLookup has 'reset' then for a generic card the internal regex will kick in to show the right brand icon - so set to null\n                // However for a single-branded card we need to pass the \"base\" type so the brand logo is reset - so set to type\n                const brandToReset = isReset && type !== 'card' ? type : null;\n\n                sfp.current.processBinLookupResponse(binLookupResponse, {\n                    brand: brandToReset,\n                    cvcPolicy: cvcPolicy // undefined except for Bancontact\n                });\n\n                // Reset storage var\n                hasPanLengthRef.current = 0;\n                return;\n            }\n\n            // RESULT: binLookup has found a result so proceed accordingly\n            if (binLookupResponse.supportedBrands?.length) {\n                const hasExcludedBrand: boolean = containsExcludedBrand(binLookupResponse.supportedBrands, BRAND_ICON_UI_EXCLUSION_LIST);\n\n                const supportedBrands: BrandObject[] = hasExcludedBrand\n                    ? removeExcludedBrand(binLookupResponse.supportedBrands)\n                    : cloneBrandsArr(binLookupResponse.supportedBrands);\n\n                // 1) Multiple options found - add to the UI & inform SFP\n                if (supportedBrands.length > 1) {\n                    // --\n\n                    //  Only if the brands in DUAL_BRANDS_THAT_NEED_SELECTION_MECHANISM are present in the binLookup response should we show the dual brand selector\n                    const preselectBrand = requiresDualBrandSelection(DUAL_BRANDS_THAT_NEED_SELECTION_MECHANISM, supportedBrands, 'brand');\n\n                    const switcherObj = createCardVariantSwitcher(supportedBrands, preselectBrand);\n\n                    // Set properties on state to trigger the dual branding icons in the UI\n                    setDualBrandSelectElements(switcherObj.dualBrandSelectElements);\n                    setSelectedBrandValue(switcherObj.selectedBrandValue); // initially this value from switcherObj will be ''\n\n                    // Pass an object through to SFP\n                    sfp.current.processBinLookupResponse({\n                        issuingCountryCode: binLookupResponse.issuingCountryCode,\n                        supportedBrands: [switcherObj.leadBrand]\n                    });\n\n                    // Store the fact the binLookup obj has a panLength prop\n                    if (switcherObj.leadBrand.panLength > 0) {\n                        hasPanLengthRef.current = switcherObj.leadBrand.panLength;\n                    }\n\n                    // 2) Single option found (binValueObject.supportedBrands.length === 1)\n                } else {\n                    // Reset UI\n                    setDualBrandSelectElements([]);\n                    setSelectedBrandValue('');\n\n                    // Set (single) value from binLookup so it will be added to the 'brand' property in the paymentMethod object\n                    // EXCEPT - if we are dealing with a brand that we exclude from the UI\n                    if (!hasExcludedBrand) setSelectedBrandValue(supportedBrands[0].brand);\n\n                    // Pass object through to SFP\n                    sfp.current.processBinLookupResponse({\n                        issuingCountryCode: binLookupResponse.issuingCountryCode,\n                        supportedBrands\n                    });\n\n                    // Store the fact the binLookup obj has a panLength prop\n                    if (supportedBrands[0].panLength > 0) {\n                        hasPanLengthRef.current = supportedBrands[0].panLength;\n                    }\n                }\n            }\n        },\n        /**\n         * Handler for clicks on the icons added in response to the /binLookup call\n         * Inform SFP of the brand changes when these selections are made\n         */\n        handleDualBrandSelection: (brandValue: string): void => {\n            // Check if we have a value and whether that value corresponds to a brandObject we can propagate\n            // If either are false then abandon the process\n            let brandObjArr: BrandObject[] = [];\n            if (brandValue) {\n                // Find the brandObject with the matching brand value and place into an array\n                brandObjArr = dualBrandSelectElements.reduce((acc, item) => {\n                    if (item.brandObject.brand === brandValue) {\n                        acc.push(item.brandObject);\n                    }\n                    return acc;\n                }, []);\n\n                if (!brandObjArr.length) {\n                    return; // no brand object associated with value was found\n                }\n            } else {\n                return; // no value passed\n            }\n\n            setSelectedBrandValue(brandValue);\n\n            // Pass brand object into SecuredFields\n            sfp.current.processBinLookupResponse({\n                issuingCountryCode,\n                supportedBrands: brandObjArr,\n                isDualBrandSelection: true\n            });\n        }\n    };\n}\n"],"names":["containsExcludedBrand","brandsArr","excludedBrands","reduce","acc","brandObj","includes","brand","cloneBrandsArr","map","item","_object_spread","removeExcludedBrand","mainBrand1","mainBrand2","clonedBrands","reverse","length","extensions","props","refs","states","hasPanLengthRef","type","cvcPolicy","sfp","dualBrandSelectElements","setDualBrandSelectElements","setSelectedBrandValue","issuingCountryCode","setIssuingCountryCode","processBinLookup","binLookupResponse","isReset","issuingCode","toLowerCase","Object","keys","brandToReset","current","processBinLookupResponse","supportedBrands","hasExcludedBrand","BRAND_ICON_UI_EXCLUSION_LIST","preselectBrand","requiresDualBrandSelection","DUAL_BRANDS_THAT_NEED_SELECTION_MECHANISM","switcherObj","createCardVariantSwitcher","selectedBrandValue","leadBrand","panLength","handleDualBrandSelection","brandValue","brandObjArr","brandObject","push","isDualBrandSelection"],"mappings":"yZAOO,MAAMA,EAAwB,CAACC,EAA0BC,IACrDD,EAAUE,OAAO,CAACC,EAAKC,IAAaD,GAAOF,EAAeI,SAASD,EAASE,QAAQ,GAGlFC,EAAkBP,GAA4CA,EAAUQ,IAAIC,qUAASC,CAAA,CAAA,EAAKD,IAE1FE,EAAsB,CAACX,EAA0BY,EAAa,KAAMC,EAAa,UAC1F,MAAMC,EAA8BP,EAAeP,GAInD,OAFIc,EAAa,GAAGR,QAAUM,GAAcE,EAAa,GAAGR,QAAUO,GAAYC,EAAaC,UAC/FD,EAAaE,OAAS,EACfF,GAII,SAASG,EAAWC,EAAOC,EAAMC,EAAQC,EAAwC,CAAA,GAE5F,MAAMC,KAAEA,EAAIC,UAAEA,GAAcL,GACtBM,IAAEA,GAAQL,GACVM,wBAAEA,EAAuBC,2BAAEA,EAA0BC,sBAAEA,EAAqBC,mBAAEA,EAAkBC,sBAAEA,GAA0BT,EAElI,MAAO,CAQHU,iBAAkB,CAACC,EAAmBC,KAwB9BD,IAAAA,EAvBJ,MAAME,GAAcF,eAAAA,EAAmBH,oBAAqBG,EAAkBH,mBAAmBM,cAAgB,KAIjH,GAHAL,EAAsBI,IAGjBF,IAAsBI,OAAOC,KAAKL,GAAmBf,OAAQ,CAC9DU,EAA2B,IAC3BC,EAAsB,IAItB,MAAMU,EAAeL,GAAoB,SAATV,EAAkBA,EAAO,KASzD,OAPAE,EAAIc,QAAQC,yBAAyBR,EAAmB,CACpDzB,MAAO+B,EACPd,UAAWA,SAIfF,EAAgBiB,QAAU,EAE9B,CAGA,WAAIP,EAAAA,EAAkBS,2BAAlBT,OAAAA,EAAAA,EAAmCf,OAAQ,CAC3C,MAAMyB,EAA4B1C,EAAsBgC,EAAkBS,gBAAiBE,GAErFF,EAAiCC,EACjC9B,EAAoBoB,EAAkBS,iBACtCjC,EAAewB,EAAkBS,iBAGvC,GAAIA,EAAgBxB,OAAS,EAAG,CAI5B,MAAM2B,EAAiBC,EAA2BC,EAA2CL,EAAiB,SAExGM,EAAcC,EAA0BP,EAAiBG,GAG/DjB,EAA2BoB,EAAYrB,yBACvCE,EAAsBmB,EAAYE,oBAGlCxB,EAAIc,QAAQC,yBAAyB,CACjCX,mBAAoBG,EAAkBH,mBACtCY,gBAAiB,CAACM,EAAYG,aAI9BH,EAAYG,UAAUC,UAAY,IAClC7B,EAAgBiB,QAAUQ,EAAYG,UAAUC,UAIxD,MAEIxB,EAA2B,IAC3BC,EAAsB,IAIjBc,GAAkBd,EAAsBa,EAAgB,GAAGlC,OAGhEkB,EAAIc,QAAQC,yBAAyB,CACjCX,mBAAoBG,EAAkBH,mBACtCY,oBAIAA,EAAgB,GAAGU,UAAY,IAC/B7B,EAAgBiB,QAAUE,EAAgB,GAAGU,UAGzD,GAMJC,yBAA2BC,IAGvB,IAAIC,EAA6B,GAC7BD,IAEAC,EAAc5B,EAAwBvB,OAAO,CAACC,EAAKM,KAC3CA,EAAK6C,YAAYhD,QAAU8C,GAC3BjD,EAAIoD,KAAK9C,EAAK6C,aAEXnD,GACR,IAEEkD,EAAYrC,SAOrBW,EAAsByB,GAGtB5B,EAAIc,QAAQC,yBAAyB,CACjCX,qBACAY,gBAAiBa,EACjBG,sBAAsB,OAItC"}

package/dist/es-legacy/components/internal/SecuredFields/binLookup/triggerBinLookUp.js

@@ -1,2 +1,2 @@
-import{httpPost as e}from"../../../../core/Services/http.js";import{DEFAULT_CARD_GROUP_TYPES as r}from"../lib/constants.js";import{SF_ErrorCodes as n}from"../../../../core/Errors/constants.js";function t(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}var o=o=>{let s=null;return p=>{if(!1!==o.props.doBinLookup){if(p.encryptedBin&&o.props.clientKey)s=p.uuid,e({loadingContext:o.props.loadingContext,path:`v3/bin/binLookup?token=${o.props.clientKey}`},{type:o.props.brand,supportedBrands:o.props.brands||r,encryptedBin:p.encryptedBin,requestId:p.uuid}).then(e=>{var d;if((null==e?void 0:e.requestId)===s)if(null===(d=e.brands)||void 0===d?void 0:d.length){const s=e.brands.reduce((e,r)=>(e.detectedBrands.push(r.brand),e.paymentMethodVariants.push(r.paymentMethodVariant),!0===r.supported?(e.supportedBrands.push(r),e):e),{supportedBrands:[],detectedBrands:[],paymentMethodVariants:[]});if(s.supportedBrands.length)return o.processBinLookupResponse(function(e){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{},o=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),o.forEach(function(r){t(e,r,n[r])})}return e}({issuingCountryCode:e.issuingCountryCode,supportedBrands:s.supportedBrands},e.showSocialSecurityNumber?{showSocialSecurityNumber:e.showSocialSecurityNumber}:{})),void o.onBinLookup({type:p.type,detectedBrands:s.detectedBrands,supportedBrands:s.supportedBrands.map(e=>e.brand),paymentMethodVariants:s.paymentMethodVariants,supportedBrandsRaw:s.supportedBrands,brands:o.props.brands||r,issuingCountryCode:e.issuingCountryCode});if(s.detectedBrands.length){const e={type:"card",fieldType:"encryptedCardNumber",error:n.ERROR_MSG_UNSUPPORTED_CARD_ENTERED,detectedBrands:s.detectedBrands};return o.handleUnsupportedCard(e),void o.onBinLookup({type:p.type,detectedBrands:s.detectedBrands,supportedBrands:null,paymentMethodVariants:s.paymentMethodVariants,brands:o.props.brands||r})}}else o.onBinLookup({type:p.type,detectedBrands:null,supportedBrands:null,paymentMethodVariants:null,brands:o.props.brands||r}),o.processBinLookupResponse({},!0);else(null==e?void 0:e.requestId)||o.props.onError(e||{errorType:"binLookup",message:"unknownError"})});else if(s){o.processBinLookupResponse(null,!0),s=null;const e={type:"card",fieldType:"encryptedCardNumber",error:""};o.handleUnsupportedCard(e),o.onBinLookup({isReset:!0})}o.props.onBinValue&&o.props.onBinValue(p)}else o.props.onBinValue&&o.props.onBinValue(p)}};export{o as default};
+import{httpPost as e}from"../../../../core/Services/http.js";import{DEFAULT_CARD_GROUP_TYPES as r}from"../lib/constants.js";import{SF_ErrorCodes as n}from"../../../../core/Errors/constants.js";function t(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}var o=o=>{let s=null;return p=>{if(!1!==o.props.doBinLookup){if(p.encryptedBin&&o.props.clientKey)s=p.uuid,e({loadingContext:o.props.loadingContext,path:`v3/bin/binLookup?token=${o.props.clientKey}`},{type:o.props.brand,supportedBrands:o.props.brands||r,encryptedBin:p.encryptedBin,requestId:p.uuid}).then(e=>{var d;if((null==e?void 0:e.requestId)===s)if(null===(d=e.brands)||void 0===d?void 0:d.length){const s=e.brands.reduce((e,r)=>(e.detectedBrands.push(r.brand),e.paymentMethodVariants.push(r.paymentMethodVariant),!0===r.supported?(e.supportedBrands.push(r),e):e),{supportedBrands:[],detectedBrands:[],paymentMethodVariants:[]});if(s.supportedBrands.length)return o.processBinLookupResponse(function(e){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{},o=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),o.forEach(function(r){t(e,r,n[r])})}return e}({issuingCountryCode:e.issuingCountryCode,supportedBrands:s.supportedBrands},e.showSocialSecurityNumber?{showSocialSecurityNumber:e.showSocialSecurityNumber}:{})),void o.onBinLookup({type:p.type,detectedBrands:s.detectedBrands,supportedBrands:s.supportedBrands.map(e=>e.brand),paymentMethodVariants:s.paymentMethodVariants,supportedBrandsRaw:s.supportedBrands,brands:o.props.brands||r,issuingCountryCode:e.issuingCountryCode});if(s.detectedBrands.length){const e={type:"card",fieldType:"encryptedCardNumber",error:n.ERROR_MSG_UNSUPPORTED_CARD_ENTERED,detectedBrands:s.detectedBrands};return o.handleUnsupportedCard(e),void o.onBinLookup({type:p.type,detectedBrands:s.detectedBrands,supportedBrands:null,paymentMethodVariants:s.paymentMethodVariants,brands:o.props.brands||r})}}else o.onBinLookup({type:p.type,detectedBrands:null,supportedBrands:null,brands:o.props.brands||r}),o.processBinLookupResponse({},!0);else(null==e?void 0:e.requestId)||o.props.onError(e||{errorType:"binLookup",message:"unknownError"})});else if(s){o.processBinLookupResponse(null,!0),s=null;const e={type:"card",fieldType:"encryptedCardNumber",error:""};o.handleUnsupportedCard(e),o.onBinLookup({isReset:!0})}o.props.onBinValue&&o.props.onBinValue(p)}else o.props.onBinValue&&o.props.onBinValue(p)}};export{o as default};
 //# sourceMappingURL=triggerBinLookUp.js.map

package/dist/es-legacy/components/internal/SecuredFields/binLookup/triggerBinLookUp.js.map

@@ -1 +1 @@
-{"version":3,"file":"triggerBinLookUp.js","sources":["../../../../../../src/components/internal/SecuredFields/binLookup/triggerBinLookUp.ts"],"sourcesContent":["import { httpPost } from '../../../../core/Services/http';\nimport { CardBinLookupData, CardBinValueData, CardErrorData } from '../lib/types';\nimport { DEFAULT_CARD_GROUP_TYPES } from '../lib/constants';\nimport { SF_ErrorCodes } from '../../../../core/Errors/constants';\nimport { BinLookupResponse, BinLookupResponseRaw } from '../../../Card/types';\n\nif (process.env.NODE_ENV === 'development') {\n    window.mockBinCount = 0; // Set to 0 to turn off mocking, 1 to turn it on\n}\n\nexport default parent => {\n    let currentRequestId = null;\n\n    return (callbackObj: CardBinValueData) => {\n        // Allow way for merchant to disallow binLookup by specifically setting the prop to false\n        if (parent.props.doBinLookup === false) {\n            if (parent.props.onBinValue) parent.props.onBinValue(callbackObj);\n            return;\n        }\n\n        // Do binLookup when encryptedBin property is present (and only if the merchant is using a clientKey)\n        if (callbackObj.encryptedBin && parent.props.clientKey) {\n            // Store id of request we're about to make\n            currentRequestId = callbackObj.uuid;\n\n            void httpPost(\n                {\n                    loadingContext: parent.props.loadingContext,\n                    path: `v3/bin/binLookup?token=${parent.props.clientKey}`\n                },\n                {\n                    type: parent.props.brand,\n                    supportedBrands: parent.props.brands || DEFAULT_CARD_GROUP_TYPES,\n                    encryptedBin: callbackObj.encryptedBin,\n                    requestId: callbackObj.uuid // Pass id of request\n                }\n            ).then((data: BinLookupResponseRaw) => {\n                // If response is the one we were waiting for...\n                if (data?.requestId === currentRequestId) {\n                    if (process.env.NODE_ENV === 'development') {\n                        // TODO mocking\n                        if (window.mockBinCount >= 1) {\n                            switch (window.mockBinCount) {\n                                case 1:\n                                    console.log('\\n### triggerBinLookUp::mock first response:: ');\n                                    data.brands = [\n                                        {\n                                            brand: 'mc',\n                                            cvcPolicy: 'optional',\n                                            enableLuhnCheck: true,\n                                            // showExpiryDate: true, // deprecated in /binLookup v3\n                                            expiryDatePolicy: 'optional',\n                                            // panLength: 16,\n                                            supported: true\n                                        }\n                                    ];\n                                    // data.issuingCountryCode = 'KR'; // needed to mock korean_local_card\n                                    // increment to alter second response\n                                    window.mockBinCount++;\n\n                                    break;\n                                case 2:\n                                    console.log('\\n### triggerBinLookUp::mock second response:: ');\n                                    // data.brands = null;\n                                    data.brands = [\n                                        {\n                                            brand: 'maestro',\n                                            cvcPolicy: 'required',\n                                            enableLuhnCheck: true,\n                                            showExpiryDate: true,\n                                            supported: true,\n                                            showSocialSecurityNumber: false\n                                            // panLength: 16\n                                        }\n                                    ];\n                                    break;\n                                default:\n                            }\n                        }\n                        // TODO end\n                    }\n\n                    if (data.brands?.length) {\n                        const mappedResponse = data.brands.reduce(\n                            (acc, item) => {\n                                // All brand strings end up in the detectedBrands array\n                                acc.detectedBrands.push(item.brand);\n                                // Also add the paymentMethodVariants (more granular description of the txvariant)\n                                acc.paymentMethodVariants.push(item.paymentMethodVariant);\n\n                                // Add supported brand objects to the supportedBrands array\n                                if (item.supported === true) {\n                                    acc.supportedBrands.push(item);\n                                    return acc;\n                                }\n\n                                return acc;\n                            },\n                            { supportedBrands: [], detectedBrands: [], paymentMethodVariants: [] }\n                        );\n\n                        /**\n                         * supportedBrands = merchant supports this brand(s); we have detected the card number to be of this brand(s); carry on!\n                         */\n                        if (mappedResponse.supportedBrands.length) {\n                            // ...call processBinLookupResponse with, a simplified, response object if it contains at least one supported brand\n                            parent.processBinLookupResponse({\n                                issuingCountryCode: data.issuingCountryCode,\n                                supportedBrands: mappedResponse.supportedBrands,\n                                ...(data.showSocialSecurityNumber ? { showSocialSecurityNumber: data.showSocialSecurityNumber } : {})\n                            } as BinLookupResponse);\n\n                            // Inform merchant of the result\n                            parent.onBinLookup({\n                                type: callbackObj.type,\n                                detectedBrands: mappedResponse.detectedBrands,\n                                // supportedBrands contains the subset of this.props.brands that matches the card number that the shopper has typed\n                                supportedBrands: mappedResponse.supportedBrands.map(item => item.brand),\n                                paymentMethodVariants: mappedResponse.paymentMethodVariants,\n                                supportedBrandsRaw: mappedResponse.supportedBrands, // full supportedBrands data (for customCard comp)\n                                brands: parent.props.brands || DEFAULT_CARD_GROUP_TYPES,\n                                issuingCountryCode: data.issuingCountryCode\n                            } as CardBinLookupData);\n\n                            return;\n                        }\n\n                        /**\n                         * detectedBrands = no brands the merchant supports were found; what we did detect the shopper to be entering was this brand;\n                         * error!\n                         */\n                        if (mappedResponse.detectedBrands.length) {\n                            const errObj: CardErrorData = {\n                                type: 'card',\n                                fieldType: 'encryptedCardNumber',\n                                error: SF_ErrorCodes.ERROR_MSG_UNSUPPORTED_CARD_ENTERED,\n                                detectedBrands: mappedResponse.detectedBrands\n                            };\n                            parent.handleUnsupportedCard(errObj);\n\n                            // Inform merchant of the result\n                            parent.onBinLookup({\n                                type: callbackObj.type,\n                                detectedBrands: mappedResponse.detectedBrands,\n                                supportedBrands: null,\n                                paymentMethodVariants: mappedResponse.paymentMethodVariants,\n                                brands: parent.props.brands || DEFAULT_CARD_GROUP_TYPES\n                            } as CardBinLookupData);\n\n                            return;\n                        }\n                    } else {\n                        /**\n                         *  BIN not in DB (a failed lookup will just contain a requestId)\n                         */\n                        parent.onBinLookup({\n                            type: callbackObj.type,\n                            detectedBrands: null,\n                            supportedBrands: null,\n                            paymentMethodVariants: null,\n                            brands: parent.props.brands || DEFAULT_CARD_GROUP_TYPES\n                        } as CardBinLookupData);\n\n                        // Reset the UI and let the native, regex branding happen (for the generic card)\n                        // For a single-branded card we need to pass a boolean to prompt resetting the brand logo to the 'base' type\n                        parent.processBinLookupResponse({}, true);\n                    }\n                } else {\n                    if (!data?.requestId) {\n                        // Some other kind of error on the backend\n                        parent.props.onError(data || { errorType: 'binLookup', message: 'unknownError' });\n                    }\n                    // Else - response with wrong requestId\n                }\n            });\n        } else if (currentRequestId) {\n            /**\n             * If onBinValue callback is called AND we have been doing binLookup BUT passed object doesn't have an encryptedBin property\n             * - then THE NUMBER OF DIGITS IN NUMBER FIELD HAS DROPPED BELOW THRESHOLD for BIN lookup - so reset the UI\n             */\n            parent.processBinLookupResponse(null, true);\n\n            currentRequestId = null; // Ignore any pending responses\n\n            // Reset any errors\n            const errObj: CardErrorData = {\n                type: 'card',\n                fieldType: 'encryptedCardNumber',\n                error: ''\n            };\n            parent.handleUnsupportedCard(errObj);\n\n            // CustomCard needs this to reset the UI\n            parent.onBinLookup({\n                isReset: true\n            } as CardBinLookupData);\n        }\n\n        if (parent.props.onBinValue) parent.props.onBinValue(callbackObj);\n    };\n};\n"],"names":["triggerBinLookUp","parent","currentRequestId","callbackObj","props","doBinLookup","encryptedBin","clientKey","uuid","httpPost","loadingContext","path","type","brand","supportedBrands","brands","DEFAULT_CARD_GROUP_TYPES","requestId","then","data","length","mappedResponse","reduce","acc","item","detectedBrands","push","paymentMethodVariants","paymentMethodVariant","supported","processBinLookupResponse","_object_spread","issuingCountryCode","showSocialSecurityNumber","onBinLookup","map","supportedBrandsRaw","errObj","fieldType","error","SF_ErrorCodes","ERROR_MSG_UNSUPPORTED_CARD_ENTERED","handleUnsupportedCard","onError","errorType","message","isReset","onBinValue"],"mappings":"yTAUA,IAAAA,EAAeC,IACX,IAAIC,EAAmB,KAEvB,OAAQC,IAEJ,IAAiC,IAA7BF,EAAOG,MAAMC,YAAjB,CAMA,GAAIF,EAAYG,cAAgBL,EAAOG,MAAMG,UAEzCL,EAAmBC,EAAYK,KAE1BC,EACD,CACIC,eAAgBT,EAAOG,MAAMM,eAC7BC,KAAM,0BAA0BV,EAAOG,MAAMG,aAEjD,CACIK,KAAMX,EAAOG,MAAMS,MACnBC,gBAAiBb,EAAOG,MAAMW,QAAUC,EACxCV,aAAcH,EAAYG,aAC1BW,UAAWd,EAAYK,OAE7BU,KAAMC,IA8CIA,IAAAA,EA5CR,IAAIA,eAAAA,EAAMF,aAAcf,EA4CpB,WAAIiB,EAAAA,EAAKJ,kBAALI,OAAAA,EAAAA,EAAaC,OAAQ,CACrB,MAAMC,EAAiBF,EAAKJ,OAAOO,OAC/B,CAACC,EAAKC,KAEFD,EAAIE,eAAeC,KAAKF,EAAKX,OAE7BU,EAAII,sBAAsBD,KAAKF,EAAKI,uBAGb,IAAnBJ,EAAKK,WACLN,EAAIT,gBAAgBY,KAAKF,GAClBD,GAGJA,GAEX,CAAET,gBAAiB,GAAIW,eAAgB,GAAIE,sBAAuB,KAMtE,GAAIN,EAAeP,gBAAgBM,OAoB/B,OAlBAnB,EAAO6B,2VAAyBC,CAAA,CAC5BC,mBAAoBb,EAAKa,mBACzBlB,gBAAiBO,EAAeP,iBAC5BK,EAAKc,yBAA2B,CAAEA,yBAA0Bd,EAAKc,0BAA6B,CAAA,SAItGhC,EAAOiC,YAAY,CACftB,KAAMT,EAAYS,KAClBa,eAAgBJ,EAAeI,eAE/BX,gBAAiBO,EAAeP,gBAAgBqB,IAAIX,GAAQA,EAAKX,OACjEc,sBAAuBN,EAAeM,sBACtCS,mBAAoBf,EAAeP,gBACnCC,OAAQd,EAAOG,MAAMW,QAAUC,EAC/BgB,mBAAoBb,EAAKa,qBAUjC,GAAIX,EAAeI,eAAeL,OAAQ,CACtC,MAAMiB,EAAwB,CAC1BzB,KAAM,OACN0B,UAAW,sBACXC,MAAOC,EAAcC,mCACrBhB,eAAgBJ,EAAeI,gBAanC,OAXAxB,EAAOyC,sBAAsBL,QAG7BpC,EAAOiC,YAAY,CACftB,KAAMT,EAAYS,KAClBa,eAAgBJ,EAAeI,eAC/BX,gBAAiB,KACjBa,sBAAuBN,EAAeM,sBACtCZ,OAAQd,EAAOG,MAAMW,QAAUC,GAIvC,CACJ,MAIIf,EAAOiC,YAAY,CACftB,KAAMT,EAAYS,KAClBa,eAAgB,KAChBX,gBAAiB,KACjBa,sBAAuB,KACvBZ,OAAQd,EAAOG,MAAMW,QAAUC,IAKnCf,EAAO6B,yBAAyB,CAAA,GAAI,QAGnCX,eAAAA,EAAMF,YAEPhB,EAAOG,MAAMuC,QAAQxB,GAAQ,CAAEyB,UAAW,YAAaC,QAAS,wBAKzE,GAAI3C,EAAkB,CAKzBD,EAAO6B,yBAAyB,MAAM,GAEtC5B,EAAmB,KAGnB,MAAMmC,EAAwB,CAC1BzB,KAAM,OACN0B,UAAW,sBACXC,MAAO,IAEXtC,EAAOyC,sBAAsBL,GAG7BpC,EAAOiC,YAAY,CACfY,SAAS,GAEjB,CAEI7C,EAAOG,MAAM2C,YAAY9C,EAAOG,MAAM2C,WAAW5C,EApLrD,MAFQF,EAAOG,MAAM2C,YAAY9C,EAAOG,MAAM2C,WAAW5C,GAwLjE"}
+{"version":3,"file":"triggerBinLookUp.js","sources":["../../../../../../src/components/internal/SecuredFields/binLookup/triggerBinLookUp.ts"],"sourcesContent":["import { httpPost } from '../../../../core/Services/http';\nimport { CardBinValueData, CardErrorData } from '../lib/types';\nimport { DEFAULT_CARD_GROUP_TYPES } from '../lib/constants';\nimport { SF_ErrorCodes } from '../../../../core/Errors/constants';\nimport { BinLookupResponseRaw } from '../../../Card/types';\n\nif (process.env.NODE_ENV === 'development') {\n    window.mockBinCount = 0; // Set to 0 to turn off mocking, 1 to turn it on\n}\n\nexport default parent => {\n    let currentRequestId = null;\n\n    return (callbackObj: CardBinValueData) => {\n        // Allow way for merchant to disallow binLookup by specifically setting the prop to false\n        if (parent.props.doBinLookup === false) {\n            if (parent.props.onBinValue) parent.props.onBinValue(callbackObj);\n            return;\n        }\n\n        // Do binLookup when encryptedBin property is present (and only if the merchant is using a clientKey)\n        if (callbackObj.encryptedBin && parent.props.clientKey) {\n            // Store id of request we're about to make\n            currentRequestId = callbackObj.uuid;\n\n            void httpPost(\n                {\n                    loadingContext: parent.props.loadingContext,\n                    path: `v3/bin/binLookup?token=${parent.props.clientKey}`\n                },\n                {\n                    type: parent.props.brand,\n                    supportedBrands: parent.props.brands || DEFAULT_CARD_GROUP_TYPES,\n                    encryptedBin: callbackObj.encryptedBin,\n                    requestId: callbackObj.uuid // Pass id of request\n                }\n            ).then((data: BinLookupResponseRaw) => {\n                // If response is the one we were waiting for...\n                if (data?.requestId === currentRequestId) {\n                    if (process.env.NODE_ENV === 'development') {\n                        // TODO mocking\n                        if (window.mockBinCount >= 1) {\n                            switch (window.mockBinCount) {\n                                case 1:\n                                    console.log('\\n### triggerBinLookUp::mock first response:: ');\n                                    data.brands = [\n                                        {\n                                            brand: 'mc',\n                                            cvcPolicy: 'optional',\n                                            enableLuhnCheck: true,\n                                            // showExpiryDate: true, // deprecated in /binLookup v3\n                                            expiryDatePolicy: 'optional',\n                                            // panLength: 16,\n                                            supported: true\n                                        }\n                                    ];\n                                    // data.issuingCountryCode = 'KR'; // needed to mock korean_local_card\n                                    // increment to alter second response\n                                    window.mockBinCount++;\n\n                                    break;\n                                case 2:\n                                    console.log('\\n### triggerBinLookUp::mock second response:: ');\n                                    // data.brands = null;\n                                    data.brands = [\n                                        {\n                                            brand: 'maestro',\n                                            cvcPolicy: 'required',\n                                            enableLuhnCheck: true,\n                                            showExpiryDate: true,\n                                            supported: true,\n                                            showSocialSecurityNumber: false\n                                            // panLength: 16\n                                        }\n                                    ];\n                                    break;\n                                default:\n                            }\n                        }\n                        // TODO end\n                    }\n\n                    if (data.brands?.length) {\n                        const mappedResponse = data.brands.reduce(\n                            (acc, item) => {\n                                // All brand strings end up in the detectedBrands array\n                                acc.detectedBrands.push(item.brand);\n                                // Also add the paymentMethodVariants (more granular description of the txvariant)\n                                acc.paymentMethodVariants.push(item.paymentMethodVariant);\n\n                                // Add supported brand objects to the supportedBrands array\n                                if (item.supported === true) {\n                                    acc.supportedBrands.push(item);\n                                    return acc;\n                                }\n\n                                return acc;\n                            },\n                            { supportedBrands: [], detectedBrands: [], paymentMethodVariants: [] }\n                        );\n\n                        /**\n                         * supportedBrands = merchant supports this brand(s); we have detected the card number to be of this brand(s); carry on!\n                         */\n                        if (mappedResponse.supportedBrands.length) {\n                            // ...call processBinLookupResponse with, a simplified, response object if it contains at least one supported brand\n                            parent.processBinLookupResponse({\n                                issuingCountryCode: data.issuingCountryCode,\n                                supportedBrands: mappedResponse.supportedBrands,\n                                ...(data.showSocialSecurityNumber ? { showSocialSecurityNumber: data.showSocialSecurityNumber } : {})\n                            });\n\n                            // Inform merchant of the result\n                            parent.onBinLookup({\n                                type: callbackObj.type,\n                                detectedBrands: mappedResponse.detectedBrands,\n                                // supportedBrands contains the subset of this.props.brands that matches the card number that the shopper has typed\n                                supportedBrands: mappedResponse.supportedBrands.map(item => item.brand),\n                                paymentMethodVariants: mappedResponse.paymentMethodVariants,\n                                supportedBrandsRaw: mappedResponse.supportedBrands, // full supportedBrands data (for customCard comp)\n                                brands: parent.props.brands || DEFAULT_CARD_GROUP_TYPES,\n                                issuingCountryCode: data.issuingCountryCode\n                            });\n\n                            return;\n                        }\n\n                        /**\n                         * detectedBrands = no brands the merchant supports were found; what we did detect the shopper to be entering was this brand;\n                         * error!\n                         */\n                        if (mappedResponse.detectedBrands.length) {\n                            const errObj: CardErrorData = {\n                                type: 'card',\n                                fieldType: 'encryptedCardNumber',\n                                error: SF_ErrorCodes.ERROR_MSG_UNSUPPORTED_CARD_ENTERED,\n                                detectedBrands: mappedResponse.detectedBrands\n                            };\n                            parent.handleUnsupportedCard(errObj);\n\n                            // Inform merchant of the result\n                            parent.onBinLookup({\n                                type: callbackObj.type,\n                                detectedBrands: mappedResponse.detectedBrands,\n                                supportedBrands: null,\n                                paymentMethodVariants: mappedResponse.paymentMethodVariants,\n                                brands: parent.props.brands || DEFAULT_CARD_GROUP_TYPES\n                            });\n\n                            return;\n                        }\n                    } else {\n                        /**\n                         *  BIN not in DB (a failed lookup will just contain a requestId)\n                         */\n                        parent.onBinLookup({\n                            type: callbackObj.type,\n                            detectedBrands: null,\n                            supportedBrands: null,\n                            brands: parent.props.brands || DEFAULT_CARD_GROUP_TYPES\n                        });\n\n                        // Reset the UI and let the native, regex branding happen (for the generic card)\n                        // For a single-branded card we need to pass a boolean to prompt resetting the brand logo to the 'base' type\n                        parent.processBinLookupResponse({}, true);\n                    }\n                } else {\n                    if (!data?.requestId) {\n                        // Some other kind of error on the backend\n                        parent.props.onError(data || { errorType: 'binLookup', message: 'unknownError' });\n                    }\n                    // Else - response with wrong requestId\n                }\n            });\n        } else if (currentRequestId) {\n            /**\n             * If onBinValue callback is called AND we have been doing binLookup BUT passed object doesn't have an encryptedBin property\n             * - then THE NUMBER OF DIGITS IN NUMBER FIELD HAS DROPPED BELOW THRESHOLD for BIN lookup - so reset the UI\n             */\n            parent.processBinLookupResponse(null, true);\n\n            currentRequestId = null; // Ignore any pending responses\n\n            // Reset any errors\n            const errObj: CardErrorData = {\n                type: 'card',\n                fieldType: 'encryptedCardNumber',\n                error: ''\n            };\n            parent.handleUnsupportedCard(errObj);\n\n            // CustomCard needs this to reset the UI\n            parent.onBinLookup({\n                isReset: true\n            });\n        }\n\n        if (parent.props.onBinValue) parent.props.onBinValue(callbackObj);\n    };\n};\n"],"names":["triggerBinLookUp","parent","currentRequestId","callbackObj","props","doBinLookup","encryptedBin","clientKey","uuid","httpPost","loadingContext","path","type","brand","supportedBrands","brands","DEFAULT_CARD_GROUP_TYPES","requestId","then","data","length","mappedResponse","reduce","acc","item","detectedBrands","push","paymentMethodVariants","paymentMethodVariant","supported","processBinLookupResponse","_object_spread","issuingCountryCode","showSocialSecurityNumber","onBinLookup","map","supportedBrandsRaw","errObj","fieldType","error","SF_ErrorCodes","ERROR_MSG_UNSUPPORTED_CARD_ENTERED","handleUnsupportedCard","onError","errorType","message","isReset","onBinValue"],"mappings":"yTAUA,IAAAA,EAAeC,IACX,IAAIC,EAAmB,KAEvB,OAAQC,IAEJ,IAAiC,IAA7BF,EAAOG,MAAMC,YAAjB,CAMA,GAAIF,EAAYG,cAAgBL,EAAOG,MAAMG,UAEzCL,EAAmBC,EAAYK,KAE1BC,EACD,CACIC,eAAgBT,EAAOG,MAAMM,eAC7BC,KAAM,0BAA0BV,EAAOG,MAAMG,aAEjD,CACIK,KAAMX,EAAOG,MAAMS,MACnBC,gBAAiBb,EAAOG,MAAMW,QAAUC,EACxCV,aAAcH,EAAYG,aAC1BW,UAAWd,EAAYK,OAE7BU,KAAMC,IA8CIA,IAAAA,EA5CR,IAAIA,eAAAA,EAAMF,aAAcf,EA4CpB,WAAIiB,EAAAA,EAAKJ,kBAALI,OAAAA,EAAAA,EAAaC,OAAQ,CACrB,MAAMC,EAAiBF,EAAKJ,OAAOO,OAC/B,CAACC,EAAKC,KAEFD,EAAIE,eAAeC,KAAKF,EAAKX,OAE7BU,EAAII,sBAAsBD,KAAKF,EAAKI,uBAGb,IAAnBJ,EAAKK,WACLN,EAAIT,gBAAgBY,KAAKF,GAClBD,GAGJA,GAEX,CAAET,gBAAiB,GAAIW,eAAgB,GAAIE,sBAAuB,KAMtE,GAAIN,EAAeP,gBAAgBM,OAoB/B,OAlBAnB,EAAO6B,2VAAyBC,CAAA,CAC5BC,mBAAoBb,EAAKa,mBACzBlB,gBAAiBO,EAAeP,iBAC5BK,EAAKc,yBAA2B,CAAEA,yBAA0Bd,EAAKc,0BAA6B,CAAA,SAItGhC,EAAOiC,YAAY,CACftB,KAAMT,EAAYS,KAClBa,eAAgBJ,EAAeI,eAE/BX,gBAAiBO,EAAeP,gBAAgBqB,IAAIX,GAAQA,EAAKX,OACjEc,sBAAuBN,EAAeM,sBACtCS,mBAAoBf,EAAeP,gBACnCC,OAAQd,EAAOG,MAAMW,QAAUC,EAC/BgB,mBAAoBb,EAAKa,qBAUjC,GAAIX,EAAeI,eAAeL,OAAQ,CACtC,MAAMiB,EAAwB,CAC1BzB,KAAM,OACN0B,UAAW,sBACXC,MAAOC,EAAcC,mCACrBhB,eAAgBJ,EAAeI,gBAanC,OAXAxB,EAAOyC,sBAAsBL,QAG7BpC,EAAOiC,YAAY,CACftB,KAAMT,EAAYS,KAClBa,eAAgBJ,EAAeI,eAC/BX,gBAAiB,KACjBa,sBAAuBN,EAAeM,sBACtCZ,OAAQd,EAAOG,MAAMW,QAAUC,GAIvC,CACJ,MAIIf,EAAOiC,YAAY,CACftB,KAAMT,EAAYS,KAClBa,eAAgB,KAChBX,gBAAiB,KACjBC,OAAQd,EAAOG,MAAMW,QAAUC,IAKnCf,EAAO6B,yBAAyB,CAAA,GAAI,QAGnCX,eAAAA,EAAMF,YAEPhB,EAAOG,MAAMuC,QAAQxB,GAAQ,CAAEyB,UAAW,YAAaC,QAAS,wBAKzE,GAAI3C,EAAkB,CAKzBD,EAAO6B,yBAAyB,MAAM,GAEtC5B,EAAmB,KAGnB,MAAMmC,EAAwB,CAC1BzB,KAAM,OACN0B,UAAW,sBACXC,MAAO,IAEXtC,EAAOyC,sBAAsBL,GAG7BpC,EAAOiC,YAAY,CACfY,SAAS,GAEjB,CAEI7C,EAAOG,MAAM2C,YAAY9C,EAAOG,MAAM2C,WAAW5C,EAnLrD,MAFQF,EAAOG,MAAM2C,YAAY9C,EAAOG,MAAM2C,WAAW5C,GAuLjE"}