@adyen/adyen-web 6.35.0 → 6.37.0

package/dist/es/components/internal/FormFields/Select/components/SelectButton.js

@@ -1,2 +1,2 @@
-import{createElement as e,Fragment as t}from"../../../../../external/preact/dist/preact.js";import o from"../../../../../_virtual/index.js";import n from"../../../Img/Img.js";import{useMemo as a}from"../../../../../external/preact/hooks/dist/hooks.js";function d({filterable:t,toggleButtonRef:o,...n}){if(t){const{id:t,...a}=n;return e("div",{...a,ref:o})}return e("button",{id:n.id,"aria-expanded":n.showList,"aria-disabled":n.readonly,"aria-describedby":n.ariaDescribedBy,type:"button",...n,ref:o})}function r(r){const{active:i,selected:c,inputText:l,readonly:s,showList:u,required:_}=r,p=a(()=>{const e=c.selectedOptionName||c.name;return!0!==("string"==typeof e&&""!==e.trim())},[c,r.placeholder]),y=c.selectedOptionName||c.name||r.placeholder||"",b=u?l:y,f=s?null:r.filterable?e=>{e.preventDefault(),document.activeElement===r.filterInputRef.current?r.showList||r.toggleList(e):r.filterInputRef.current&&r.filterInputRef.current.focus()}:r.toggleList,m=i.id?`listItem-${i.id}`:"";return e(d,{className:o({"adyen-checkout__dropdown__button":!0,"adyen-checkout__dropdown__button--readonly":s,"adyen-checkout__dropdown__button--active":u,"adyen-checkout__dropdown__button--invalid":r.isInvalid,"adyen-checkout__dropdown__button--valid":r.isValid,"adyen-checkout__dropdown__button--disabled":c.disabled}),disabled:r.disabled,filterable:r.filterable,onClick:f,onKeyDown:s?null:r.onButtonKeyDown,toggleButtonRef:r.toggleButtonRef,id:r.id},r.filterable?e(t,null,!u&&c.icon&&e(n,{className:"adyen-checkout__dropdown__button__icon",src:c.icon,alt:c.name}),e("input",{value:b,"aria-autocomplete":"list","aria-controls":r.selectListId,"aria-expanded":u,"aria-owns":r.selectListId,autoComplete:"off",className:"adyen-checkout__filter-input",onInput:r.onInput,ref:r.filterInputRef,role:"combobox","aria-activedescendant":m,type:"text",readOnly:r.readonly,"aria-disabled":r.readonly,id:r.id,"aria-describedby":r.ariaDescribedBy,required:_}),!u&&c.secondaryText&&e("span",{className:"adyen-checkout__dropdown__button__secondary-text"},c.secondaryText)):e(t,null,c.icon&&e(n,{className:"adyen-checkout__dropdown__button__icon",src:c.icon,alt:c.name}),e("span",{className:o("adyen-checkout__dropdown__button__text",{"adyen-checkout__dropdown__button__text-placeholder":p})},y),c.secondaryText&&e("span",{className:"adyen-checkout__dropdown__button__secondary-text"},c.secondaryText)))}export{r as default};
+import{createElement as e,Fragment as t}from"../../../../../external/preact/dist/preact.js";import o from"../../../../../_virtual/index.js";import a from"../../../Img/Img.js";import{useMemo as n}from"../../../../../external/preact/hooks/dist/hooks.js";function d({filterable:t,toggleButtonRef:o,showList:a,selectListId:n,...d}){if(t){const{id:t,...a}=d;return e("div",{...a,ref:o})}return e("button",{id:d.id,"aria-haspopup":"listbox","aria-expanded":a,"aria-controls":n,"aria-disabled":d.readonly,"aria-describedby":d.ariaDescribedBy,"aria-labelledby":d.id?`${d.id}-label ${d.id}-value`:void 0,type:"button",...d,ref:o})}function i(i){const{active:r,selected:l,inputText:c,readonly:s,showList:u,required:_}=i,p=n(()=>{const e=l.selectedOptionName||l.name;return!0!==("string"==typeof e&&""!==e.trim())},[l,i.placeholder]),b=l.selectedOptionName||l.name||i.placeholder||"",y=u?c??"":b,f=s?null:i.filterable?e=>{e.preventDefault(),document.activeElement===i.filterInputRef.current?i.showList||i.toggleList(e):i.filterInputRef.current&&i.filterInputRef.current.focus()}:i.toggleList,m=r.id?`listItem-${r.id}`:"";return e(d,{className:o({"adyen-checkout__dropdown__button":!0,"adyen-checkout__dropdown__button--readonly":s,"adyen-checkout__dropdown__button--active":u,"adyen-checkout__dropdown__button--invalid":i.isInvalid,"adyen-checkout__dropdown__button--valid":i.isValid,"adyen-checkout__dropdown__button--disabled":l.disabled}),disabled:i.disabled,filterable:i.filterable,onClick:f,onKeyDown:s?null:i.onButtonKeyDown,toggleButtonRef:i.toggleButtonRef,id:i.id,showList:u,selectListId:i.selectListId},i.filterable?e(t,null,!u&&l.icon&&e(a,{className:"adyen-checkout__dropdown__button__icon",src:l.icon,alt:l.name}),e("input",{value:y,"aria-autocomplete":"list","aria-controls":i.selectListId,"aria-expanded":u,"aria-owns":i.selectListId,autoComplete:"off",className:o("adyen-checkout__filter-input",{"adyen-checkout__filter-input--placeholder":!u&&p}),onInput:i.onInput,ref:i.filterInputRef,role:"combobox","aria-activedescendant":m,type:"text",readOnly:i.readonly,"aria-disabled":i.readonly,id:i.id,"aria-describedby":i.ariaDescribedBy,required:_}),!u&&l.secondaryText&&e("span",{className:"adyen-checkout__dropdown__button__secondary-text"},l.secondaryText)):e(t,null,l.icon&&e(a,{className:"adyen-checkout__dropdown__button__icon",src:l.icon,alt:l.name}),e("span",{id:i.id?`${i.id}-value`:void 0,className:o("adyen-checkout__dropdown__button__text",{"adyen-checkout__dropdown__button__text-placeholder":p})},b),l.secondaryText&&e("span",{className:"adyen-checkout__dropdown__button__secondary-text"},l.secondaryText)))}export{i as default};
 //# sourceMappingURL=SelectButton.js.map

package/dist/es/components/internal/FormFields/Select/components/SelectButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectButton.js","sources":["../../../../../../../src/components/internal/FormFields/Select/components/SelectButton.tsx"],"sourcesContent":["import { h, Fragment } from 'preact';\nimport cx from 'classnames';\nimport { SelectButtonProps } from '../types';\nimport Img from '../../../Img';\nimport { useMemo } from 'preact/hooks';\nimport classnames from 'classnames';\n\nfunction SelectButtonElement({ filterable, toggleButtonRef, ...props }) {\n    if (filterable) {\n        // Even if passed, we can't add an id to this div since it is not allowed to associate a div with a label element\n        const { id, ...strippedProps } = props;\n        return <div {...strippedProps} ref={toggleButtonRef} />;\n    }\n\n    return <button id={props.id} aria-expanded={props.showList} aria-disabled={props.readonly} aria-describedby={props.ariaDescribedBy} type={'button'} {...props} ref={toggleButtonRef} />;\n}\n\nfunction SelectButton(props: Readonly<SelectButtonProps>) {\n    const { active, selected, inputText, readonly, showList, required } = props;\n\n    const isShowingPlaceholder = useMemo(() => {\n        const displayText = selected.selectedOptionName || selected.name;\n        const isValidValue = typeof displayText === 'string' && displayText.trim() !== '';\n        return isValidValue !== true;\n    }, [selected, props.placeholder]);\n\n    // display fallback order\n    const displayText = selected.selectedOptionName || selected.name || props.placeholder || '';\n    // displayInputText only used for the text input for the filter\n    // display the \"typed\" filter text when showing the dropdown,\n    // hide it and show the \"selected\" value when collapsed\n    const displayInputText = showList ? inputText : displayText;\n\n    const setFocus = (e: Event) => {\n        e.preventDefault();\n        if (document.activeElement === props.filterInputRef.current) {\n            if (!props.showList) {\n                props.toggleList(e);\n            }\n        } else if (props.filterInputRef.current) props.filterInputRef.current.focus();\n    };\n\n    // 1. If readonly we ignore the click action\n    // 2. If filterable we want to show the list and focus on the input\n    // 3. Otherwise we just toggle the list\n    const onClickHandler = readonly ? null : props.filterable ? setFocus : props.toggleList;\n\n\n    // check COWEB-1301 [Investigate] Drop-in Accessibility - ADA Compliance questions\n    const currentSelectedItemId = active.id ? `listItem-${active.id}` : '';\n\n    return (\n        <SelectButtonElement\n            className={cx({\n                'adyen-checkout__dropdown__button': true,\n                'adyen-checkout__dropdown__button--readonly': readonly,\n                'adyen-checkout__dropdown__button--active': showList,\n                'adyen-checkout__dropdown__button--invalid': props.isInvalid,\n                'adyen-checkout__dropdown__button--valid': props.isValid,\n                'adyen-checkout__dropdown__button--disabled': selected.disabled\n            })}\n            disabled={props.disabled}\n            filterable={props.filterable}\n            onClick={onClickHandler}\n            onKeyDown={!readonly ? props.onButtonKeyDown : null}\n            toggleButtonRef={props.toggleButtonRef}\n            id={props.id}\n        >\n            {!props.filterable ? (\n                <Fragment>\n                    {selected.icon && <Img className=\"adyen-checkout__dropdown__button__icon\" src={selected.icon} alt={selected.name} />}\n                    <span\n                        className={classnames('adyen-checkout__dropdown__button__text', {\n                            'adyen-checkout__dropdown__button__text-placeholder': isShowingPlaceholder\n                        })}\n                    >\n                        {displayText}\n                    </span>\n                    {selected.secondaryText && <span className=\"adyen-checkout__dropdown__button__secondary-text\">{selected.secondaryText}</span>}\n                </Fragment>\n            ) : (\n                <Fragment>\n                    {!showList && selected.icon && <Img className=\"adyen-checkout__dropdown__button__icon\" src={selected.icon} alt={selected.name} />}\n                    <input\n                        value={displayInputText}\n                        aria-autocomplete=\"list\"\n                        aria-controls={props.selectListId}\n                        aria-expanded={showList}\n                        aria-owns={props.selectListId}\n                        autoComplete=\"off\"\n                        className=\"adyen-checkout__filter-input\"\n                        onInput={props.onInput}\n                        ref={props.filterInputRef}\n                        role=\"combobox\"\n                        aria-activedescendant={currentSelectedItemId}\n                        type=\"text\"\n                        readOnly={props.readonly}\n                        aria-disabled={props.readonly}\n                        id={props.id}\n                        aria-describedby={props.ariaDescribedBy}\n                        required={required}\n                    />\n                    {!showList && selected.secondaryText && (\n                        <span className=\"adyen-checkout__dropdown__button__secondary-text\">{selected.secondaryText}</span>\n                    )}\n                </Fragment>\n            )}\n        </SelectButtonElement>\n    );\n}\n\nexport default SelectButton;\n"],"names":["SelectButtonElement","filterable","toggleButtonRef","props","id","strippedProps","h","div","ref","button","aria-expanded","showList","aria-disabled","readonly","aria-describedby","ariaDescribedBy","type","SelectButton","active","selected","inputText","required","isShowingPlaceholder","useMemo","displayText","selectedOptionName","name","trim","placeholder","displayInputText","onClickHandler","e","preventDefault","document","activeElement","filterInputRef","current","toggleList","focus","currentSelectedItemId","className","cx","isInvalid","isValid","disabled","onClick","onKeyDown","onButtonKeyDown","Fragment","icon","Img","src","alt","input","value","aria-autocomplete","aria-controls","selectListId","aria-owns","autoComplete","onInput","role","aria-activedescendant","readOnly","secondaryText","span","classnames"],"mappings":"4PAOA,SAASA,GAAoBC,WAAEA,EAAUC,gBAAEA,KAAoBC,IAC3D,GAAIF,EAAY,CAEZ,MAAMG,GAAEA,KAAOC,GAAkBF,EACjC,OAAOG,EAACC,MAAAA,IAAQF,EAAeG,IAAKN,GACxC,CAEA,OAAOI,EAACG,SAAAA,CAAOL,GAAID,EAAMC,GAAIM,gBAAeP,EAAMQ,SAAUC,gBAAeT,EAAMU,SAAUC,mBAAkBX,EAAMY,gBAAiBC,KAAM,YAAcb,EAAOK,IAAKN,GACxK,CAEA,SAASe,EAAad,GAClB,MAAMe,OAAEA,EAAMC,SAAEA,EAAQC,UAAEA,EAASP,SAAEA,EAAQF,SAAEA,EAAQU,SAAEA,GAAalB,EAEhEmB,EAAuBC,EAAQ,KACjC,MAAMC,EAAcL,EAASM,oBAAsBN,EAASO,KAE5D,OAAwB,KADoB,iBAAhBF,GAAmD,KAAvBA,EAAYG,SAErE,CAACR,EAAUhB,EAAMyB,cAGdJ,EAAcL,EAASM,oBAAsBN,EAASO,MAAQvB,EAAMyB,aAAe,GAInFC,EAAmBlB,EAAWS,EAAYI,EAc1CM,EAAiBjB,EAAW,KAAOV,EAAMF,WAZ7B8B,IACdA,EAAEC,iBACEC,SAASC,gBAAkB/B,EAAMgC,eAAeC,QAC3CjC,EAAMQ,UACPR,EAAMkC,WAAWN,GAEd5B,EAAMgC,eAAeC,SAASjC,EAAMgC,eAAeC,QAAQE,SAMHnC,EAAMkC,WAIvEE,EAAwBrB,EAAOd,GAAK,YAAYc,EAAOd,KAAO,GAEpE,OACIE,EAACN,EAAAA,CACGwC,UAAWC,EAAG,CACV,oCAAoC,EACpC,6CAA8C5B,EAC9C,2CAA4CF,EAC5C,4CAA6CR,EAAMuC,UACnD,0CAA2CvC,EAAMwC,QACjD,6CAA8CxB,EAASyB,WAE3DA,SAAUzC,EAAMyC,SAChB3C,WAAYE,EAAMF,WAClB4C,QAASf,EACTgB,UAAYjC,EAAmC,KAAxBV,EAAM4C,gBAC7B7C,gBAAiBC,EAAMD,gBACvBE,GAAID,EAAMC,IAERD,EAAMF,WAaJK,EAAC0C,EAAAA,MACKrC,GAAYQ,EAAS8B,MAAQ3C,EAAC4C,EAAAA,CAAIV,UAAU,yCAAyCW,IAAKhC,EAAS8B,KAAMG,IAAKjC,EAASO,OACzHpB,EAAC+C,QAAAA,CACGC,MAAOzB,EACP0B,oBAAkB,OAClBC,gBAAerD,EAAMsD,aACrB/C,gBAAeC,EACf+C,YAAWvD,EAAMsD,aACjBE,aAAa,MACbnB,UAAU,+BACVoB,QAASzD,EAAMyD,QACfpD,IAAKL,EAAMgC,eACX0B,KAAK,WACLC,wBAAuBvB,EACvBvB,KAAK,OACL+C,SAAU5D,EAAMU,SAChBD,gBAAeT,EAAMU,SACrBT,GAAID,EAAMC,GACVU,mBAAkBX,EAAMY,gBACxBM,SAAUA,KAEZV,GAAYQ,EAAS6C,eACnB1D,EAAC2D,OAAAA,CAAKzB,UAAU,oDAAoDrB,EAAS6C,gBAlCrF1D,EAAC0C,OACI7B,EAAS8B,MAAQ3C,EAAC4C,EAAAA,CAAIV,UAAU,yCAAyCW,IAAKhC,EAAS8B,KAAMG,IAAKjC,EAASO,OAC5GpB,EAAC2D,OAAAA,CACGzB,UAAW0B,EAAW,yCAA0C,CAC5D,qDAAsD5C,KAGzDE,GAEJL,EAAS6C,eAAiB1D,EAAC2D,OAAAA,CAAKzB,UAAU,oDAAoDrB,EAAS6C,gBA+B5H"}
+{"version":3,"file":"SelectButton.js","sources":["../../../../../../../src/components/internal/FormFields/Select/components/SelectButton.tsx"],"sourcesContent":["import { h, Fragment } from 'preact';\nimport cx from 'classnames';\nimport { SelectButtonProps } from '../types';\nimport Img from '../../../Img';\nimport { useMemo } from 'preact/hooks';\nimport classnames from 'classnames';\n\nfunction SelectButtonElement({ filterable, toggleButtonRef, showList, selectListId, ...props }) {\n    if (filterable) {\n        // Even if passed, we can't add an id to this div since it is not allowed to associate a div with a label element\n        const { id, ...strippedProps } = props;\n        return <div {...strippedProps} ref={toggleButtonRef} />;\n    }\n\n    return (\n        <button\n            id={props.id}\n            aria-haspopup=\"listbox\"\n            aria-expanded={showList}\n            aria-controls={selectListId}\n            aria-disabled={props.readonly}\n            aria-describedby={props.ariaDescribedBy}\n            aria-labelledby={props.id ? `${props.id}-label ${props.id}-value` : undefined}\n            type={'button'}\n            {...props}\n            ref={toggleButtonRef}\n        />\n    );\n}\n\nfunction SelectButton(props: Readonly<SelectButtonProps>) {\n    const { active, selected, inputText, readonly, showList, required } = props;\n\n    const isShowingPlaceholder = useMemo(() => {\n        const displayText = selected.selectedOptionName || selected.name;\n        const isValidValue = typeof displayText === 'string' && displayText.trim() !== '';\n        return isValidValue !== true;\n    }, [selected, props.placeholder]);\n\n    // display fallback order\n    const displayText = selected.selectedOptionName || selected.name || props.placeholder || '';\n    // displayInputText only used for the text input for the filter\n    // display the \"typed\" filter text when showing the dropdown,\n    // hide it and show the \"selected\" value when collapsed\n    // When list is open, show user's typed input (or empty); otherwise show selected value\n    const textWhenListOpen = inputText ?? '';\n    const displayInputText = showList ? textWhenListOpen : displayText;\n\n    const setFocus = (e: Event) => {\n        e.preventDefault();\n        if (document.activeElement === props.filterInputRef.current) {\n            if (!props.showList) {\n                props.toggleList(e);\n            }\n        } else if (props.filterInputRef.current) props.filterInputRef.current.focus();\n    };\n\n    // 1. If readonly we ignore the click action\n    // 2. If filterable we want to show the list and focus on the input\n    // 3. Otherwise we just toggle the list\n    const onClickHandler = readonly ? null : props.filterable ? setFocus : props.toggleList;\n\n    // check COWEB-1301 [Investigate] Drop-in Accessibility - ADA Compliance questions\n    const currentSelectedItemId = active.id ? `listItem-${active.id}` : '';\n\n    return (\n        <SelectButtonElement\n            className={cx({\n                'adyen-checkout__dropdown__button': true,\n                'adyen-checkout__dropdown__button--readonly': readonly,\n                'adyen-checkout__dropdown__button--active': showList,\n                'adyen-checkout__dropdown__button--invalid': props.isInvalid,\n                'adyen-checkout__dropdown__button--valid': props.isValid,\n                'adyen-checkout__dropdown__button--disabled': selected.disabled\n            })}\n            disabled={props.disabled}\n            filterable={props.filterable}\n            onClick={onClickHandler}\n            onKeyDown={!readonly ? props.onButtonKeyDown : null}\n            toggleButtonRef={props.toggleButtonRef}\n            id={props.id}\n            showList={showList}\n            selectListId={props.selectListId}\n        >\n            {!props.filterable ? (\n                <Fragment>\n                    {selected.icon && <Img className=\"adyen-checkout__dropdown__button__icon\" src={selected.icon} alt={selected.name} />}\n                    <span\n                        id={props.id ? `${props.id}-value` : undefined}\n                        className={classnames('adyen-checkout__dropdown__button__text', {\n                            'adyen-checkout__dropdown__button__text-placeholder': isShowingPlaceholder\n                        })}\n                    >\n                        {displayText}\n                    </span>\n                    {selected.secondaryText && <span className=\"adyen-checkout__dropdown__button__secondary-text\">{selected.secondaryText}</span>}\n                </Fragment>\n            ) : (\n                <Fragment>\n                    {!showList && selected.icon && <Img className=\"adyen-checkout__dropdown__button__icon\" src={selected.icon} alt={selected.name} />}\n                    <input\n                        value={displayInputText}\n                        aria-autocomplete=\"list\"\n                        aria-controls={props.selectListId}\n                        aria-expanded={showList}\n                        aria-owns={props.selectListId}\n                        autoComplete=\"off\"\n                        className={classnames('adyen-checkout__filter-input', {\n                            'adyen-checkout__filter-input--placeholder': !showList && isShowingPlaceholder\n                        })}\n                        onInput={props.onInput}\n                        ref={props.filterInputRef}\n                        role=\"combobox\"\n                        aria-activedescendant={currentSelectedItemId}\n                        type=\"text\"\n                        readOnly={props.readonly}\n                        aria-disabled={props.readonly}\n                        id={props.id}\n                        aria-describedby={props.ariaDescribedBy}\n                        required={required}\n                    />\n                    {!showList && selected.secondaryText && (\n                        <span className=\"adyen-checkout__dropdown__button__secondary-text\">{selected.secondaryText}</span>\n                    )}\n                </Fragment>\n            )}\n        </SelectButtonElement>\n    );\n}\n\nexport default SelectButton;\n"],"names":["SelectButtonElement","filterable","toggleButtonRef","showList","selectListId","props","id","strippedProps","h","div","ref","button","aria-haspopup","aria-expanded","aria-controls","aria-disabled","readonly","aria-describedby","ariaDescribedBy","aria-labelledby","undefined","type","SelectButton","active","selected","inputText","required","isShowingPlaceholder","useMemo","displayText","selectedOptionName","name","trim","placeholder","displayInputText","onClickHandler","e","preventDefault","document","activeElement","filterInputRef","current","toggleList","focus","currentSelectedItemId","className","cx","isInvalid","isValid","disabled","onClick","onKeyDown","onButtonKeyDown","Fragment","icon","Img","src","alt","input","value","aria-autocomplete","aria-owns","autoComplete","classnames","onInput","role","aria-activedescendant","readOnly","secondaryText","span"],"mappings":"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"}

package/dist/es/components/internal/IssuerList/IssuerButtonGroup/IssuerButtonGroup.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useCallback as t}from"../../../../external/preact/hooks/dist/hooks.js";import r from"./IssuerButton.js";import{useCoreContext as o}from"../../../../core/Context/CoreProvider.js";const s=({items:s=[],selectedIssuerId:a,onChange:c})=>{const{i18n:i}=o(),l=t(e=>{const t=e.currentTarget.value;Object.defineProperty(e.target,"value",{value:t}),c(e)},[c]);return e("div",{className:"adyen-checkout__issuer-button-group",role:"group","aria-label":i.get("issuerList.selectField.contextualText")},s.map(t=>e(r,{key:t.id,...t,selected:a===t.id,onClick:l})))};export{s as default};
+import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useCallback as t}from"../../../../external/preact/hooks/dist/hooks.js";import r from"./IssuerButton.js";import{useCoreContext as s}from"../../../../core/Context/CoreProvider.js";const o=({items:o=[],selectedIssuerId:a,onChange:c})=>{const{i18n:i}=s(),l=t(e=>{const t=e.currentTarget.value;Object.defineProperty(e.target,"value",{value:t}),c(e)},[c]);return e("fieldset",{className:"adyen-checkout__issuer-button-group","aria-label":i.get("issuerList.selectField.contextualText")},o.map(t=>e(r,{key:t.id,...t,selected:a===t.id,onClick:l})))};export{o as default};
 //# sourceMappingURL=IssuerButtonGroup.js.map

package/dist/es/components/internal/IssuerList/IssuerButtonGroup/IssuerButtonGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"IssuerButtonGroup.js","sources":["../../../../../../src/components/internal/IssuerList/IssuerButtonGroup/IssuerButtonGroup.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useCallback } from 'preact/hooks';\nimport IssuerButton from './IssuerButton';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport './IssuerButtonGroup.scss';\nimport { IssuerItem } from '../types';\n\ninterface IssuerButtonGroupProps {\n    items: IssuerItem[];\n    selectedIssuerId: string;\n    onChange: (event: UIEvent) => void;\n}\n\nconst IssuerButtonGroup = ({ items = [], selectedIssuerId, onChange }: Readonly<IssuerButtonGroupProps>) => {\n    const { i18n } = useCoreContext();\n\n    const handleClick = useCallback(\n        (event: UIEvent) => {\n            const value = (event.currentTarget as HTMLButtonElement).value;\n            Object.defineProperty(event.target, 'value', { value });\n            onChange(event);\n        },\n        [onChange]\n    );\n\n    return (\n        <div className=\"adyen-checkout__issuer-button-group\" role=\"group\" aria-label={i18n.get('issuerList.selectField.contextualText')}>\n            {items.map(issuer => (\n                <IssuerButton key={issuer.id} {...issuer} selected={selectedIssuerId === issuer.id} onClick={handleClick} />\n            ))}\n        </div>\n    );\n};\n\nexport default IssuerButtonGroup;\n"],"names":["IssuerButtonGroup","items","selectedIssuerId","onChange","i18n","useCoreContext","handleClick","useCallback","event","value","currentTarget","Object","defineProperty","target","h","div","className","role","aria-label","get","map","issuer","IssuerButton","key","id","selected","onClick"],"mappings":"oQAaA,MAAMA,EAAoB,EAAGC,QAAQ,GAAIC,mBAAkBC,eACvD,MAAMC,KAAEA,GAASC,IAEXC,EAAcC,EACfC,IACG,MAAMC,EAASD,EAAME,cAAoCD,MACzDE,OAAOC,eAAeJ,EAAMK,OAAQ,QAAS,CAAEJ,UAC/CN,EAASK,IAEb,CAACL,IAGL,OACIW,EAACC,MAAAA,CAAIC,UAAU,sCAAsCC,KAAK,QAAQC,aAAYd,EAAKe,IAAI,0CAClFlB,EAAMmB,IAAIC,GACPP,EAACQ,EAAAA,CAAaC,IAAKF,EAAOG,MAAQH,EAAQI,SAAUvB,IAAqBmB,EAAOG,GAAIE,QAASpB"}
+{"version":3,"file":"IssuerButtonGroup.js","sources":["../../../../../../src/components/internal/IssuerList/IssuerButtonGroup/IssuerButtonGroup.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useCallback } from 'preact/hooks';\nimport IssuerButton from './IssuerButton';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport './IssuerButtonGroup.scss';\nimport { IssuerItem } from '../types';\n\ninterface IssuerButtonGroupProps {\n    items: IssuerItem[];\n    selectedIssuerId: string;\n    onChange: (event: UIEvent) => void;\n}\n\nconst IssuerButtonGroup = ({ items = [], selectedIssuerId, onChange }: Readonly<IssuerButtonGroupProps>) => {\n    const { i18n } = useCoreContext();\n\n    const handleClick = useCallback(\n        (event: UIEvent) => {\n            const value = (event.currentTarget as HTMLButtonElement).value;\n            Object.defineProperty(event.target, 'value', { value });\n            onChange(event);\n        },\n        [onChange]\n    );\n\n    return (\n        <fieldset className=\"adyen-checkout__issuer-button-group\" aria-label={i18n.get('issuerList.selectField.contextualText')}>\n            {items.map(issuer => (\n                <IssuerButton key={issuer.id} {...issuer} selected={selectedIssuerId === issuer.id} onClick={handleClick} />\n            ))}\n        </fieldset>\n    );\n};\n\nexport default IssuerButtonGroup;\n"],"names":["IssuerButtonGroup","items","selectedIssuerId","onChange","i18n","useCoreContext","handleClick","useCallback","event","value","currentTarget","Object","defineProperty","target","h","fieldset","className","aria-label","get","map","issuer","IssuerButton","key","id","selected","onClick"],"mappings":"oQAaA,MAAMA,EAAoB,EAAGC,QAAQ,GAAIC,mBAAkBC,eACvD,MAAMC,KAAEA,GAASC,IAEXC,EAAcC,EACfC,IACG,MAAMC,EAASD,EAAME,cAAoCD,MACzDE,OAAOC,eAAeJ,EAAMK,OAAQ,QAAS,CAAEJ,UAC/CN,EAASK,IAEb,CAACL,IAGL,OACIW,EAACC,WAAAA,CAASC,UAAU,sCAAsCC,aAAYb,EAAKc,IAAI,0CAC1EjB,EAAMkB,IAAIC,GACPN,EAACO,EAAAA,CAAaC,IAAKF,EAAOG,MAAQH,EAAQI,SAAUtB,IAAqBkB,EAAOG,GAAIE,QAASnB"}

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

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

package/dist/es/components/internal/IssuerList/IssuerList.js.map

@@ -1 +1 @@
-{"version":3,"file":"IssuerList.js","sources":["../../../../../src/components/internal/IssuerList/IssuerList.tsx"],"sourcesContent":["import { Fragment, h } from 'preact';\nimport { useState, useEffect, useCallback, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport Field from '../FormFields/Field';\nimport IssuerButtonGroup from './IssuerButtonGroup';\nimport ContentSeparator from '../ContentSeparator';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { ValidatorRules } from '../../../utils/Validator/types';\nimport { IssuerListProps } from './types';\nimport './IssuerList.scss';\nimport useSRPanelContext from '../../../core/Errors/useSRPanelContext';\nimport { SetSRMessagesReturnFn } from '../../../core/Errors/SRPanelProvider';\nimport { SetSRMessagesReturnObject } from '../../../core/Errors/types';\nimport { ERROR_ACTION_FOCUS_FIELD } from '../../../core/Errors/constants';\nimport { setFocusOnField } from '../../../utils/setFocus';\nimport DisclaimerMessage from '../DisclaimerMessage';\nimport Select from '../FormFields/Select';\nimport { SelectTargetObject } from '../FormFields/Select/types';\nimport { ANALYTICS_SEARCH_DEBOUNCE_TIME } from '../../../core/Analytics/constants';\nimport { debounce } from '../../../utils/debounce';\nimport { AnalyticsInfoEvent, InfoEventType, UiTarget } from '../../../core/Analytics/events/AnalyticsInfoEvent';\n\nconst payButtonLabel = ({ issuer, items }, i18n): string => {\n    const issuerName = items.find(i => i.id === issuer)?.name;\n    if (!issuer || !issuerName) return i18n.get('continue');\n    return `${i18n.get('continueTo')} ${issuerName}`;\n};\n\nconst schema = ['issuer'];\nconst validationRules: ValidatorRules = {\n    issuer: {\n        validate: issuer => !!issuer && issuer.length > 0,\n        errorMessage: 'issuerList.selectField.contextualText',\n        modes: ['blur']\n    }\n};\n\nenum IssuerListInputTypes {\n    ButtonGroup,\n    Dropdown\n}\n\nfunction IssuerList({\n    items,\n    placeholder,\n    issuer,\n    highlightedIds = [],\n    showContextualElement,\n    contextualText,\n    selectFieldLabel,\n    ...props\n}: Readonly<IssuerListProps>) {\n    const { i18n } = useCoreContext();\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm({\n        schema,\n        defaultData: { issuer },\n        rules: validationRules\n    });\n    const [status, setStatus] = useState('ready');\n    const [inputType, setInputType] = useState<IssuerListInputTypes>(IssuerListInputTypes.Dropdown);\n\n    const { setSRMessagesFromObjects, shouldMoveFocusSR } = useSRPanelContext();\n    const setSRMessages: SetSRMessagesReturnFn = setSRMessagesFromObjects?.({});\n\n    const containerRef = useRef<HTMLDivElement>(null);\n\n    const getErrorMessage = error => (error && error.errorMessage ? i18n.get(error.errorMessage) : !!error);\n\n    this.setStatus = newStatus => {\n        setStatus(newStatus);\n    };\n\n    const handleInputChange = useCallback(\n        (type: IssuerListInputTypes) => (event: h.JSX.TargetedKeyboardEvent<HTMLInputElement>) => {\n            const target = type === IssuerListInputTypes.Dropdown ? UiTarget.list : UiTarget.featuredIssuer;\n            const issuerObj = items.find(issuer => issuer.id === (event.target as SelectTargetObject).value);\n\n            const analyticsEvent = new AnalyticsInfoEvent({\n                component: props.type,\n                type: InfoEventType.selected,\n                target,\n                issuer: issuerObj.name\n            });\n            props.onSubmitAnalytics(analyticsEvent);\n\n            setInputType(type);\n            handleChangeFor('issuer')(event);\n        },\n        [handleChangeFor, props.type]\n    );\n\n    const handleListToggle = useCallback(\n        (isOpen: boolean) => {\n            if (isOpen) {\n                const event = new AnalyticsInfoEvent({\n                    component: props.type,\n                    type: InfoEventType.displayed,\n                    target: UiTarget.list\n                });\n                props.onSubmitAnalytics(event);\n            }\n        },\n        [props.type, props.onSubmitAnalytics]\n    );\n\n    const debounceSearchAnalytics = useRef(debounce(props.onSubmitAnalytics, ANALYTICS_SEARCH_DEBOUNCE_TIME));\n\n    const handleSearch = useCallback(() => {\n        debounceSearchAnalytics.current({ type: InfoEventType.input, target: UiTarget.listSearch });\n    }, []);\n\n    useEffect(() => {\n        props.onChange({ data, valid, errors, isValid });\n\n        const srPanelResp: SetSRMessagesReturnObject = setSRMessages?.({ errors, isValidating: true });\n        if (srPanelResp?.action === ERROR_ACTION_FOCUS_FIELD) {\n            // Focus field in error, if required\n            if (shouldMoveFocusSR) setFocusOnField(containerRef.current, 'issuer-list');\n        }\n    }, [data, valid, errors, isValid]);\n\n    this.showValidation = () => {\n        triggerValidation();\n    };\n\n    const { highlightedItems } = items.reduce(\n        (memo, item) => {\n            if (highlightedIds.includes(item.id)) memo.highlightedItems.push({ ...item });\n            return memo;\n        },\n        { highlightedItems: [] }\n    );\n\n    return (\n        <div ref={containerRef} className=\"adyen-checkout__issuer-list\">\n            {!!highlightedItems.length && (\n                <Fragment>\n                    <IssuerButtonGroup\n                        selectedIssuerId={inputType === IssuerListInputTypes.ButtonGroup ? data['issuer'] : null}\n                        items={highlightedItems}\n                        onChange={handleInputChange(IssuerListInputTypes.ButtonGroup)}\n                    />\n                    <ContentSeparator />\n                </Fragment>\n            )}\n\n            <Field\n                label={selectFieldLabel ?? i18n.get('issuerList.selectField.label')}\n                errorMessage={getErrorMessage(errors.issuer)}\n                classNameModifiers={['issuer-list']}\n                name={'issuer'}\n                showContextualElement={showContextualElement}\n                contextualText={contextualText}\n            >\n                <Select\n                    items={items}\n                    selectedValue={inputType === IssuerListInputTypes.Dropdown ? data['issuer'] : null}\n                    placeholder={placeholder}\n                    name={'issuer'}\n                    className={'adyen-checkout__issuer-list__dropdown'}\n                    onChange={handleInputChange(IssuerListInputTypes.Dropdown)}\n                    onListToggle={handleListToggle}\n                    onInput={handleSearch}\n                />\n            </Field>\n\n            {props.termsAndConditions && (\n                <div className=\"adyen-checkout__issuer-list__termsAndConditions\">\n                    <DisclaimerMessage message={i18n.get(props.termsAndConditions.translationKey)} urls={props.termsAndConditions.urls} />\n                </div>\n            )}\n\n            {props.showPayButton &&\n                props.payButton({\n                    status,\n                    label: payButtonLabel({ issuer: data['issuer'], items: [...items, ...highlightedItems] }, i18n)\n                })}\n        </div>\n    );\n}\n\nIssuerList.defaultProps = {\n    onChange: () => {}\n};\n\nexport default IssuerList;\n"],"names":["payButtonLabel","issuer","items","i18n","issuerName","find","i","id","name","get","schema","validationRules","validate","length","errorMessage","modes","IssuerList","placeholder","highlightedIds","showContextualElement","contextualText","selectFieldLabel","props","useCoreContext","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","defaultData","rules","status","setStatus","useState","inputType","setInputType","setSRMessagesFromObjects","shouldMoveFocusSR","useSRPanelContext","setSRMessages","containerRef","useRef","this","newStatus","handleInputChange","useCallback","type","event","target","UiTarget","list","featuredIssuer","issuerObj","value","analyticsEvent","AnalyticsInfoEvent","component","InfoEventType","selected","onSubmitAnalytics","handleListToggle","isOpen","displayed","debounceSearchAnalytics","debounce","ANALYTICS_SEARCH_DEBOUNCE_TIME","handleSearch","current","input","listSearch","useEffect","onChange","srPanelResp","isValidating","action","ERROR_ACTION_FOCUS_FIELD","setFocusOnField","showValidation","highlightedItems","reduce","memo","item","includes","push","h","div","ref","className","Fragment","IssuerButtonGroup","selectedIssuerId","ContentSeparator","Field","label","error","classNameModifiers","Select","selectedValue","onListToggle","onInput","termsAndConditions","DisclaimerMessage","message","translationKey","urls","showPayButton","payButton","defaultProps"],"mappings":"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"}
+{"version":3,"file":"IssuerList.js","sources":["../../../../../src/components/internal/IssuerList/IssuerList.tsx"],"sourcesContent":["import { Fragment, h } from 'preact';\nimport { useState, useEffect, useCallback, useRef } from 'preact/hooks';\n\nimport useForm from '../../../utils/useForm';\nimport Field from '../FormFields/Field';\nimport IssuerButtonGroup from './IssuerButtonGroup';\nimport ContentSeparator from '../ContentSeparator';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { ValidatorRules } from '../../../utils/Validator/types';\nimport { IssuerListProps } from './types';\nimport useSRPanelContext from '../../../core/Errors/useSRPanelContext';\nimport { SetSRMessagesReturnFn } from '../../../core/Errors/SRPanelProvider';\nimport { SetSRMessagesReturnObject } from '../../../core/Errors/types';\nimport { ERROR_ACTION_FOCUS_FIELD } from '../../../core/Errors/constants';\nimport { setFocusOnField } from '../../../utils/setFocus';\nimport DisclaimerMessage from '../DisclaimerMessage';\nimport Select from '../FormFields/Select';\nimport { SelectTargetObject } from '../FormFields/Select/types';\nimport { ANALYTICS_SEARCH_DEBOUNCE_TIME } from '../../../core/Analytics/constants';\nimport { debounce } from '../../../utils/debounce';\nimport { AnalyticsInfoEvent, InfoEventType, UiTarget } from '../../../core/Analytics/events/AnalyticsInfoEvent';\nimport { ComponentMethodsRef } from '../UIElement/types';\nimport './IssuerList.scss';\n\nconst payButtonLabel = ({ issuer, items }, i18n): string => {\n    const issuerName = items.find(i => i.id === issuer)?.name;\n    if (!issuer || !issuerName) return i18n.get('continue');\n    return `${i18n.get('continueTo')} ${issuerName}`;\n};\n\nconst schema = ['issuer'];\nconst validationRules: ValidatorRules = {\n    issuer: {\n        validate: issuer => !!issuer && issuer.length > 0,\n        errorMessage: 'issuerList.selectField.contextualText',\n        modes: ['blur']\n    }\n};\n\nenum IssuerListInputTypes {\n    ButtonGroup,\n    Dropdown\n}\n\nfunction IssuerList({\n    items,\n    placeholder,\n    issuer,\n    highlightedIds = [],\n    showContextualElement,\n    contextualText,\n    selectFieldLabel,\n    ...props\n}: Readonly<IssuerListProps>) {\n    const { i18n } = useCoreContext();\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm({\n        schema,\n        defaultData: { issuer },\n        rules: validationRules\n    });\n    const [status, setStatus] = useState('ready');\n    const [inputType, setInputType] = useState<IssuerListInputTypes>(IssuerListInputTypes.Dropdown);\n\n    const { setSRMessagesFromObjects, shouldMoveFocusSR } = useSRPanelContext();\n    const setSRMessages: SetSRMessagesReturnFn = setSRMessagesFromObjects?.({});\n\n    const containerRef = useRef<HTMLDivElement>(null);\n\n    const getErrorMessage = error => (error && error.errorMessage ? i18n.get(error.errorMessage) : !!error);\n\n    const handleInputChange = useCallback(\n        (type: IssuerListInputTypes) => (event: h.JSX.TargetedKeyboardEvent<HTMLInputElement>) => {\n            const target = type === IssuerListInputTypes.Dropdown ? UiTarget.list : UiTarget.featuredIssuer;\n            const issuerObj = items.find(issuer => issuer.id === (event.target as SelectTargetObject).value);\n\n            const analyticsEvent = new AnalyticsInfoEvent({\n                component: props.type,\n                type: InfoEventType.selected,\n                target,\n                issuer: issuerObj.name\n            });\n            props.onSubmitAnalytics(analyticsEvent);\n\n            setInputType(type);\n            handleChangeFor('issuer')(event);\n        },\n        [handleChangeFor, props.type]\n    );\n\n    const handleListToggle = useCallback(\n        (isOpen: boolean) => {\n            if (isOpen) {\n                const event = new AnalyticsInfoEvent({\n                    component: props.type,\n                    type: InfoEventType.displayed,\n                    target: UiTarget.list\n                });\n                props.onSubmitAnalytics(event);\n            }\n        },\n        [props.type, props.onSubmitAnalytics]\n    );\n\n    const debounceSearchAnalytics = useRef(debounce(props.onSubmitAnalytics, ANALYTICS_SEARCH_DEBOUNCE_TIME));\n\n    const handleSearch = useCallback(() => {\n        debounceSearchAnalytics.current({ type: InfoEventType.input, target: UiTarget.listSearch });\n    }, []);\n\n    const issuerListRef = useRef<ComponentMethodsRef>({\n        setStatus: setStatus,\n        showValidation: () => {\n            triggerValidation();\n        }\n    });\n\n    useEffect(() => {\n        props.setComponentRef(issuerListRef.current);\n    }, [props.setComponentRef]);\n\n    useEffect(() => {\n        props.onChange({ data, valid, errors, isValid });\n\n        const srPanelResp: SetSRMessagesReturnObject = setSRMessages?.({ errors, isValidating: true });\n        if (srPanelResp?.action === ERROR_ACTION_FOCUS_FIELD) {\n            // Focus field in error, if required\n            if (shouldMoveFocusSR) setFocusOnField(containerRef.current, 'issuer-list');\n        }\n    }, [data, valid, errors, isValid]);\n\n    const { highlightedItems } = items.reduce(\n        (memo, item) => {\n            if (highlightedIds.includes(item.id)) memo.highlightedItems.push({ ...item });\n            return memo;\n        },\n        { highlightedItems: [] }\n    );\n\n    return (\n        <div ref={containerRef} className=\"adyen-checkout__issuer-list\">\n            {!!highlightedItems.length && (\n                <Fragment>\n                    <IssuerButtonGroup\n                        selectedIssuerId={inputType === IssuerListInputTypes.ButtonGroup ? data['issuer'] : null}\n                        items={highlightedItems}\n                        onChange={handleInputChange(IssuerListInputTypes.ButtonGroup)}\n                    />\n                    <ContentSeparator />\n                </Fragment>\n            )}\n\n            <Field\n                label={selectFieldLabel ?? i18n.get('issuerList.selectField.label')}\n                errorMessage={getErrorMessage(errors.issuer)}\n                classNameModifiers={['issuer-list']}\n                name={'issuer'}\n                showContextualElement={showContextualElement}\n                contextualText={contextualText}\n            >\n                <Select\n                    items={items}\n                    selectedValue={inputType === IssuerListInputTypes.Dropdown ? data['issuer'] : null}\n                    placeholder={placeholder}\n                    name={'issuer'}\n                    className={'adyen-checkout__issuer-list__dropdown'}\n                    onChange={handleInputChange(IssuerListInputTypes.Dropdown)}\n                    onListToggle={handleListToggle}\n                    onInput={handleSearch}\n                />\n            </Field>\n\n            {props.termsAndConditions && (\n                <div className=\"adyen-checkout__issuer-list__termsAndConditions\">\n                    <DisclaimerMessage message={i18n.get(props.termsAndConditions.translationKey)} urls={props.termsAndConditions.urls} />\n                </div>\n            )}\n\n            {props.showPayButton &&\n                props.payButton({\n                    status,\n                    label: payButtonLabel({ issuer: data['issuer'], items: [...items, ...highlightedItems] }, i18n)\n                })}\n        </div>\n    );\n}\n\nIssuerList.defaultProps = {\n    onChange: () => {}\n};\n\nexport default IssuerList;\n"],"names":["payButtonLabel","issuer","items","i18n","issuerName","find","i","id","name","get","schema","validationRules","validate","length","errorMessage","modes","IssuerList","placeholder","highlightedIds","showContextualElement","contextualText","selectFieldLabel","props","useCoreContext","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","defaultData","rules","status","setStatus","useState","inputType","setInputType","setSRMessagesFromObjects","shouldMoveFocusSR","useSRPanelContext","setSRMessages","containerRef","useRef","handleInputChange","useCallback","type","event","target","UiTarget","list","featuredIssuer","issuerObj","value","analyticsEvent","AnalyticsInfoEvent","component","InfoEventType","selected","onSubmitAnalytics","handleListToggle","isOpen","displayed","debounceSearchAnalytics","debounce","ANALYTICS_SEARCH_DEBOUNCE_TIME","handleSearch","current","input","listSearch","issuerListRef","showValidation","useEffect","setComponentRef","onChange","srPanelResp","isValidating","action","ERROR_ACTION_FOCUS_FIELD","setFocusOnField","highlightedItems","reduce","memo","item","includes","push","h","div","ref","className","Fragment","IssuerButtonGroup","selectedIssuerId","ContentSeparator","Field","label","error","classNameModifiers","Select","selectedValue","onListToggle","onInput","termsAndConditions","DisclaimerMessage","message","translationKey","urls","showPayButton","payButton","defaultProps"],"mappings":"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"}

package/dist/es/components/internal/SecuredFields/lib/CSF/CSF.js.map

@@ -1 +1 @@
-{"version":3,"file":"CSF.js","sources":["../../../../../../../src/components/internal/SecuredFields/lib/CSF/CSF.ts"],"sourcesContent":["import AbstractCSF from './AbstractCSF';\nimport { CSFReturnObject, CSFSetupObject, CSFStateObject, CSFThisObject, CSFCallbacksConfig, CSFConfigObject } from './types';\nimport { StylesObject, CardAdditionalSFData, SFFieldType } from '../types';\nimport { BinLookupResponse } from '../../../../Card/types';\nimport { handleConfig } from './extensions/handleConfig';\nimport { configureCallbacks } from './extensions/configureCallbacks';\nimport { handleValidation } from './extensions/handleValidation';\nimport { handleEncryption } from './extensions/handleEncryption';\nimport { createSecuredFields, createNonCardSecuredFields, createCardSecuredFields, setupSecuredField } from './extensions/createSecuredFields';\nimport handleIOSTouchEvents from './extensions/handleIOSTouchEvents';\nimport handleTab from './extensions/handleTab';\nimport handleBrandFromBinLookup, { sendBrandToCardSF, sendExpiryDatePolicyToSF } from './extensions/handleBrandFromBinLookup';\nimport { setFocusOnFrame } from './partials/setFocusOnFrame';\nimport { postMessageToAllIframes } from './partials/postMessageToAllIframes';\nimport processBrand from './partials/processBrand';\nimport { processAutoComplete } from './partials/processAutoComplete';\nimport { handleFocus } from './partials/handleFocus';\nimport { handleIframeConfigFeedback } from './partials/handleIframeConfigFeedback';\nimport { isConfigured } from './partials/isConfigured';\nimport validateForm from './partials/validateForm';\nimport { handleBinValue } from './partials/handleBinValue';\nimport { destroySecuredFields } from './utils/destroySecuredFields';\nimport postMessageToIframe from './utils/iframes/postMessageToIframe';\nimport getIframeContentWin from './utils/iframes/getIframeContentWin';\nimport * as logger from '../utilities/logger';\nimport { selectOne } from '../utilities/dom';\nimport { on } from '../../../../../utils/listenerUtils';\nimport { partial } from '../utilities/commonUtils';\nimport { hasOwnProperty } from '../../../../../utils/hasOwnProperty';\nimport ua from './utils/userAgent';\nimport { SingleBrandResetObject } from '../../SFP/types';\n\nconst notConfiguredWarning = (str = 'You cannot use secured fields') => {\n    logger.warn(`${str} - they are not yet configured. Use the 'onConfigSuccess' callback to know when this has happened.`);\n};\n\nclass CSF extends AbstractCSF {\n    declare protected callbacks: CSFCallbacksConfig;\n    declare protected config: CSFConfigObject;\n    declare protected state: CSFStateObject;\n\n    constructor(setupObj: CSFSetupObject) {\n        /**\n         * Initialises:\n         *  - this.props = setupObj: CSFSetupObject\n         *\n         * and empty objects for:\n         *  - this.config: CSFConfigObject (populated in handleConfig.ts)\n         *  - this.callbacks: CSFCallbacksConfig (populated in configureCallbacks.ts\n         *  - this.state: CSFStateObject (populated below)\n         */\n        super(setupObj);\n\n        this.state = {\n            /**\n             *  For generic card will always be 'card'.\n             *  For non-generic card will be hardcoded to a particular txVariant e.g. 'mc' or 'visa'\n             *  For other types of SecuredField will be the passed type e.g. 'ach' or 'giftcard'\n             */\n            type: this.props.type,\n            /**\n             *  For generic card will change as shopper types\n             *  For non-generic card will be fixed\n             */\n            brand: this.props.type !== 'card' ? { brand: this.props.type, cvcPolicy: 'required' } : { brand: null, cvcPolicy: 'required' },\n            allValid: undefined,\n            numIframes: 0,\n            originalNumIframes: 0,\n            iframeCount: 0,\n            iframeConfigCount: 0,\n            isConfigured: false,\n            hasSeparateDateFields: false,\n            currentFocusObject: null,\n            registerFieldForIos: false,\n            securedFields: {},\n            isKCP: false\n        } as CSFStateObject;\n\n        // Create object of references to properties on 'this', that can be used to set up the partials\n        const thisObj: CSFThisObject = { csfState: this.state, csfConfig: this.config, csfProps: this.props, csfCallbacks: this.callbacks };\n\n        // Setup 'this' references\n        this.configHandler = handleConfig.bind(this);\n\n        this.callbacksHandler = configureCallbacks.bind(this);\n\n        this.validateForm = partial(validateForm, thisObj);\n\n        this.isConfigured = partial(isConfigured, thisObj, this.validateForm);\n        this.handleIframeConfigFeedback = partial(handleIframeConfigFeedback, thisObj, this.isConfigured);\n\n        this.processBrand = partial(processBrand, thisObj);\n\n        this.handleValidation = handleValidation.bind(this);\n        this.handleEncryption = handleEncryption.bind(this);\n\n        this.createSecuredFields = createSecuredFields.bind(this);\n        this.createNonCardSecuredFields = createNonCardSecuredFields.bind(this);\n        this.createCardSecuredFields = createCardSecuredFields.bind(this);\n         \n        this.setupSecuredField = setupSecuredField.bind(this);\n\n        this.postMessageToAllIframes = partial(postMessageToAllIframes, thisObj);\n\n        this.handleIOSTouchEvents = handleIOSTouchEvents.handleTouchend.bind(this);\n        this.touchendListener = handleIOSTouchEvents.touchendListener.bind(this);\n        this.destroyTouchendListener = handleIOSTouchEvents.destroyTouchendListener.bind(this);\n        this.touchstartListener = handleIOSTouchEvents.touchstartListener.bind(this);\n        this.destroyTouchstartListener = handleIOSTouchEvents.destroyTouchstartListener.bind(this);\n\n        this.setFocusOnFrame = partial(setFocusOnFrame, thisObj);\n        this.handleFocus = partial(handleFocus, thisObj, this.handleIOSTouchEvents);\n\n        this.handleSFShiftTab = handleTab.handleSFShiftTab.bind(this);\n        this.handleShiftTab = handleTab.handleShiftTab.bind(this);\n\n        this.destroySecuredFields = destroySecuredFields.bind(this);\n\n        this.processAutoComplete = partial(processAutoComplete, thisObj);\n\n        this.handleBinValue = partial(handleBinValue, thisObj);\n\n        this.handleBrandFromBinLookup = handleBrandFromBinLookup.bind(this);\n        this.sendBrandToCardSF = sendBrandToCardSF.bind(this);\n        this.sendExpiryDatePolicyToSF = sendExpiryDatePolicyToSF.bind(this);\n\n        // Populate config & callbacks objects & create securedFields\n        this.init();\n    }\n\n    private init(): void {\n        this.configHandler(this.props);\n        this.callbacksHandler(this.props.callbacks);\n\n        /**\n         * Create all the securedFields\n         */\n        const numIframes: number = this.createSecuredFields();\n\n        this.state.numIframes = this.state.originalNumIframes = numIframes;\n\n        this.state.isKCP = !!this.props.isKCP;\n\n        /**\n         * Add touchstart listener\n         * re. Disabling arrow keys in iOS\n         */\n        if (ua.__IS_IOS && this.props.shouldDisableIOSArrowKeys) {\n            this.hasGenuineTouchEvents = false;\n            on(document, 'touchstart', this.touchstartListener);\n        }\n    }\n\n    // Expose functions that can be called on the CSF instance\n    public createReturnObject(): CSFReturnObject {\n        // --\n        const returnObj: CSFReturnObject = {\n            // --\n            updateStyles: (pStyleObject: StylesObject): void => {\n                if (this.state.isConfigured) {\n                    this.postMessageToAllIframes({ styleObject: pStyleObject });\n                } else {\n                    logger.warn(\n                        'You cannot update the secured fields styling ' +\n                            \"- they are not yet configured. Use the 'onConfigSuccess' callback to know when this has happened.\"\n                    );\n                }\n            },\n            setFocusOnFrame: (pFieldType: SFFieldType): void => {\n                if (this.state.isConfigured) {\n                    this.setFocusOnFrame(pFieldType);\n                    // Comment in a quick way to test destroying secured fields (also see comment in destroySecuredFields)\n                    // this.destroySecuredFields();\n                } else {\n                    notConfiguredWarning('You cannot set focus on any secured field');\n                }\n            },\n            // For component based implementation - if showValidation function is called on the component use this\n            // function as a way to notify the CSF that a field is in error\n            isValidated: (pFieldType: SFFieldType, code: string): void => {\n                if (this.state.isConfigured) {\n                    if (hasOwnProperty(this.state.securedFields, pFieldType)) {\n                        this.state.securedFields[pFieldType].hasError = true;\n\n                        // If there's not already an errorType, set one\n                        // NOTE: fixes issue in Components where you first validate and then start typing a maestro number\n                        // - w/o this and the corresponding fix in the SecuredField class the maestro PM will never register as valid\n                        if (this.state.securedFields[pFieldType].errorType === '') {\n                            this.state.securedFields[pFieldType].errorType = 'isValidated';\n                        }\n\n                        // Inform iframe\n                        const dataObj: object = {\n                            txVariant: this.state.type,\n                            fieldType: pFieldType,\n                            externalValidation: true,\n                            code,\n                            numKey: this.state.securedFields[pFieldType].numKey\n                        };\n                        postMessageToIframe(dataObj, getIframeContentWin(this.state, pFieldType), this.config.loadingContext);\n                    }\n                } else {\n                    notConfiguredWarning('You cannot set validated on any secured field');\n                }\n            },\n            hasUnsupportedCard: (pFieldType: SFFieldType, code: string): void => {\n                if (this.state.isConfigured) {\n                    if (hasOwnProperty(this.state.securedFields, pFieldType)) {\n                        //\n                        this.state.securedFields[pFieldType].hasError = !!code;\n                        this.state.securedFields[pFieldType].errorType = code;\n\n                        // Inform iframe\n                        const dataObj: object = {\n                            txVariant: this.state.type,\n                            fieldType: pFieldType,\n                            unsupportedCard: !!code,\n                            code,\n                            numKey: this.state.securedFields[pFieldType].numKey\n                        };\n                        postMessageToIframe(dataObj, getIframeContentWin(this.state, pFieldType), this.config.loadingContext);\n                    }\n                } else {\n                    notConfiguredWarning('You cannot set hasUnsupportedCard on any secured field');\n                }\n            },\n            destroy: (): void => {\n                if (this.state.isConfigured) {\n                    this.destroySecuredFields();\n                } else {\n                    notConfiguredWarning('You cannot destroy secured fields');\n                }\n            },\n            brandsFromBinLookup: (binLookupResponse: BinLookupResponse, resetObj: SingleBrandResetObject): void => {\n                if (!this.config.isCreditCardType) return null;\n\n                if (this.state.isConfigured) {\n                    this.handleBrandFromBinLookup(binLookupResponse, resetObj);\n                } else {\n                    notConfiguredWarning('You cannot set pass brands to secured fields');\n                }\n            },\n            addSecuredField: (pFieldType: SFFieldType): void => {\n                const securedField: HTMLElement = selectOne(this.props.rootNode, `[data-cse=\"${pFieldType}\"]`);\n                if (securedField) {\n                    this.state.numIframes += 1;\n                    this.setupSecuredField(securedField);\n                }\n            },\n            removeSecuredField: (pFieldType: SFFieldType): void => {\n                if (this.state.securedFields[pFieldType]) {\n                    this.state.securedFields[pFieldType].destroy();\n                    delete this.state.securedFields[pFieldType];\n                    this.state.numIframes -= 1;\n                    this.state.iframeCount -= 1;\n\n                    const callbackObj: CardAdditionalSFData = { additionalIframeRemoved: true, fieldType: pFieldType, type: this.state.type };\n                    this.callbacks.onAdditionalSFRemoved(callbackObj);\n                }\n            },\n            setKCPStatus: (isKCP: boolean): void => {\n                this.state.isKCP = isKCP;\n            },\n            sfIsOptionalOrHidden: (fieldType: string): boolean => {\n                return this.state.securedFields[fieldType].isOptionalOrHidden();\n            }\n        };\n\n        return returnObj;\n    }\n}\n\nexport default CSF;\n"],"names":["notConfiguredWarning","str","logger","CSF","AbstractCSF","init","this","configHandler","props","callbacksHandler","callbacks","numIframes","createSecuredFields","state","originalNumIframes","isKCP","ua","__IS_IOS","shouldDisableIOSArrowKeys","hasGenuineTouchEvents","on","document","touchstartListener","createReturnObject","updateStyles","pStyleObject","isConfigured","postMessageToAllIframes","styleObject","setFocusOnFrame","pFieldType","isValidated","code","hasOwnProperty","securedFields","hasError","errorType","dataObj","txVariant","type","fieldType","externalValidation","numKey","postMessageToIframe","getIframeContentWin","config","loadingContext","hasUnsupportedCard","unsupportedCard","destroy","destroySecuredFields","brandsFromBinLookup","binLookupResponse","resetObj","isCreditCardType","handleBrandFromBinLookup","addSecuredField","securedField","selectOne","rootNode","setupSecuredField","removeSecuredField","iframeCount","callbackObj","additionalIframeRemoved","onAdditionalSFRemoved","setKCPStatus","sfIsOptionalOrHidden","isOptionalOrHidden","constructor","setupObj","super","brand","cvcPolicy","allValid","undefined","iframeConfigCount","hasSeparateDateFields","currentFocusObject","registerFieldForIos","thisObj","csfState","csfConfig","csfProps","csfCallbacks","handleConfig","bind","configureCallbacks","validateForm","partial","handleIframeConfigFeedback","processBrand","handleValidation","handleEncryption","createNonCardSecuredFields","createCardSecuredFields","handleIOSTouchEvents","handleTouchend","touchendListener","destroyTouchendListener","destroyTouchstartListener","handleFocus","handleSFShiftTab","handleTab","handleShiftTab","processAutoComplete","handleBinValue","sendBrandToCardSF","sendExpiryDatePolicyToSF"],"mappings":"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"}
+{"version":3,"file":"CSF.js","sources":["../../../../../../../src/components/internal/SecuredFields/lib/CSF/CSF.ts"],"sourcesContent":["import AbstractCSF from './AbstractCSF';\nimport { CSFReturnObject, CSFSetupObject, CSFStateObject, CSFThisObject, CSFCallbacksConfig, CSFConfigObject } from './types';\nimport { StylesObject, CardAdditionalSFData, SFFieldType } from '../types';\nimport { BinLookupResponse } from '../../../../Card/types';\nimport { handleConfig } from './extensions/handleConfig';\nimport { configureCallbacks } from './extensions/configureCallbacks';\nimport { handleValidation } from './extensions/handleValidation';\nimport { handleEncryption } from './extensions/handleEncryption';\nimport { createSecuredFields, createNonCardSecuredFields, createCardSecuredFields, setupSecuredField } from './extensions/createSecuredFields';\nimport handleIOSTouchEvents from './extensions/handleIOSTouchEvents';\nimport handleTab from './extensions/handleTab';\nimport handleBrandFromBinLookup, { sendBrandToCardSF, sendExpiryDatePolicyToSF } from './extensions/handleBrandFromBinLookup';\nimport { setFocusOnFrame } from './partials/setFocusOnFrame';\nimport { postMessageToAllIframes } from './partials/postMessageToAllIframes';\nimport processBrand from './partials/processBrand';\nimport { processAutoComplete } from './partials/processAutoComplete';\nimport { handleFocus } from './partials/handleFocus';\nimport { handleIframeConfigFeedback } from './partials/handleIframeConfigFeedback';\nimport { isConfigured } from './partials/isConfigured';\nimport validateForm from './partials/validateForm';\nimport { handleBinValue } from './partials/handleBinValue';\nimport { destroySecuredFields } from './utils/destroySecuredFields';\nimport postMessageToIframe from './utils/iframes/postMessageToIframe';\nimport getIframeContentWin from './utils/iframes/getIframeContentWin';\nimport * as logger from '../utilities/logger';\nimport { selectOne } from '../utilities/dom';\nimport { on } from '../../../../../utils/listenerUtils';\nimport { partial } from '../utilities/commonUtils';\nimport { hasOwnProperty } from '../../../../../utils/hasOwnProperty';\nimport ua from './utils/userAgent';\nimport { SingleBrandResetObject } from '../../SFP/types';\n\nconst notConfiguredWarning = (str = 'You cannot use secured fields') => {\n    logger.warn(`${str} - they are not yet configured. Use the 'onConfigSuccess' callback to know when this has happened.`);\n};\n\nclass CSF extends AbstractCSF {\n    declare protected callbacks: CSFCallbacksConfig;\n    declare protected config: CSFConfigObject;\n    declare protected state: CSFStateObject;\n\n    constructor(setupObj: CSFSetupObject) {\n        /**\n         * Initialises:\n         *  - this.props = setupObj: CSFSetupObject\n         *\n         * and empty objects for:\n         *  - this.config: CSFConfigObject (populated in handleConfig.ts)\n         *  - this.callbacks: CSFCallbacksConfig (populated in configureCallbacks.ts\n         *  - this.state: CSFStateObject (populated below)\n         */\n        super(setupObj);\n\n        this.state = {\n            /**\n             *  For generic card will always be 'card'.\n             *  For non-generic card will be hardcoded to a particular txVariant e.g. 'mc' or 'visa'\n             *  For other types of SecuredField will be the passed type e.g. 'ach' or 'giftcard'\n             */\n            type: this.props.type,\n            /**\n             *  For generic card will change as shopper types\n             *  For non-generic card will be fixed\n             */\n            brand: this.props.type !== 'card' ? { brand: this.props.type, cvcPolicy: 'required' } : { brand: null, cvcPolicy: 'required' },\n            allValid: undefined,\n            numIframes: 0,\n            originalNumIframes: 0,\n            iframeCount: 0,\n            iframeConfigCount: 0,\n            isConfigured: false,\n            hasSeparateDateFields: false,\n            currentFocusObject: null,\n            registerFieldForIos: false,\n            securedFields: {},\n            isKCP: false\n        } as CSFStateObject;\n\n        // Create object of references to properties on 'this', that can be used to set up the partials\n        const thisObj: CSFThisObject = { csfState: this.state, csfConfig: this.config, csfProps: this.props, csfCallbacks: this.callbacks };\n\n        // Setup 'this' references\n        this.configHandler = handleConfig.bind(this);\n\n        this.callbacksHandler = configureCallbacks.bind(this);\n\n        this.validateForm = partial(validateForm, thisObj);\n\n        this.isConfigured = partial(isConfigured, thisObj, this.validateForm);\n        this.handleIframeConfigFeedback = partial(handleIframeConfigFeedback, thisObj, this.isConfigured);\n\n        this.processBrand = partial(processBrand, thisObj);\n\n        this.handleValidation = handleValidation.bind(this);\n        this.handleEncryption = handleEncryption.bind(this);\n\n        this.createSecuredFields = createSecuredFields.bind(this);\n        this.createNonCardSecuredFields = createNonCardSecuredFields.bind(this);\n        this.createCardSecuredFields = createCardSecuredFields.bind(this);\n\n        this.setupSecuredField = setupSecuredField.bind(this);\n\n        this.postMessageToAllIframes = partial(postMessageToAllIframes, thisObj);\n\n        this.handleIOSTouchEvents = handleIOSTouchEvents.handleTouchend.bind(this);\n        this.touchendListener = handleIOSTouchEvents.touchendListener.bind(this);\n        this.destroyTouchendListener = handleIOSTouchEvents.destroyTouchendListener.bind(this);\n        this.touchstartListener = handleIOSTouchEvents.touchstartListener.bind(this);\n        this.destroyTouchstartListener = handleIOSTouchEvents.destroyTouchstartListener.bind(this);\n\n        this.setFocusOnFrame = partial(setFocusOnFrame, thisObj);\n        this.handleFocus = partial(handleFocus, thisObj, this.handleIOSTouchEvents);\n\n        this.handleSFShiftTab = handleTab.handleSFShiftTab.bind(this);\n        this.handleShiftTab = handleTab.handleShiftTab.bind(this);\n\n        this.destroySecuredFields = destroySecuredFields.bind(this);\n\n        this.processAutoComplete = partial(processAutoComplete, thisObj);\n\n        this.handleBinValue = partial(handleBinValue, thisObj);\n\n        this.handleBrandFromBinLookup = handleBrandFromBinLookup.bind(this);\n        this.sendBrandToCardSF = sendBrandToCardSF.bind(this);\n        this.sendExpiryDatePolicyToSF = sendExpiryDatePolicyToSF.bind(this);\n\n        // Populate config & callbacks objects & create securedFields\n        this.init();\n    }\n\n    private init(): void {\n        this.configHandler(this.props);\n        this.callbacksHandler(this.props.callbacks);\n\n        /**\n         * Create all the securedFields\n         */\n        const numIframes: number = this.createSecuredFields();\n\n        this.state.numIframes = this.state.originalNumIframes = numIframes;\n\n        this.state.isKCP = !!this.props.isKCP;\n\n        /**\n         * Add touchstart listener\n         * re. Disabling arrow keys in iOS\n         */\n        if (ua.__IS_IOS && this.props.shouldDisableIOSArrowKeys) {\n            this.hasGenuineTouchEvents = false;\n            on(document, 'touchstart', this.touchstartListener);\n        }\n    }\n\n    // Expose functions that can be called on the CSF instance\n    public createReturnObject(): CSFReturnObject {\n        // --\n        const returnObj: CSFReturnObject = {\n            // --\n            updateStyles: (pStyleObject: StylesObject): void => {\n                if (this.state.isConfigured) {\n                    this.postMessageToAllIframes({ styleObject: pStyleObject });\n                } else {\n                    logger.warn(\n                        'You cannot update the secured fields styling ' +\n                            \"- they are not yet configured. Use the 'onConfigSuccess' callback to know when this has happened.\"\n                    );\n                }\n            },\n            setFocusOnFrame: (pFieldType: SFFieldType): void => {\n                if (this.state.isConfigured) {\n                    this.setFocusOnFrame(pFieldType);\n                    // Comment in a quick way to test destroying secured fields (also see comment in destroySecuredFields)\n                    // this.destroySecuredFields();\n                } else {\n                    notConfiguredWarning('You cannot set focus on any secured field');\n                }\n            },\n            // For component based implementation - if showValidation function is called on the component use this\n            // function as a way to notify the CSF that a field is in error\n            isValidated: (pFieldType: SFFieldType, code: string): void => {\n                if (this.state.isConfigured) {\n                    if (hasOwnProperty(this.state.securedFields, pFieldType)) {\n                        this.state.securedFields[pFieldType].hasError = true;\n\n                        // If there's not already an errorType, set one\n                        // NOTE: fixes issue in Components where you first validate and then start typing a maestro number\n                        // - w/o this and the corresponding fix in the SecuredField class the maestro PM will never register as valid\n                        if (this.state.securedFields[pFieldType].errorType === '') {\n                            this.state.securedFields[pFieldType].errorType = 'isValidated';\n                        }\n\n                        // Inform iframe\n                        const dataObj: object = {\n                            txVariant: this.state.type,\n                            fieldType: pFieldType,\n                            externalValidation: true,\n                            code,\n                            numKey: this.state.securedFields[pFieldType].numKey\n                        };\n                        postMessageToIframe(dataObj, getIframeContentWin(this.state, pFieldType), this.config.loadingContext);\n                    }\n                } else {\n                    notConfiguredWarning('You cannot set validated on any secured field');\n                }\n            },\n            hasUnsupportedCard: (pFieldType: SFFieldType, code: string): void => {\n                if (this.state.isConfigured) {\n                    if (hasOwnProperty(this.state.securedFields, pFieldType)) {\n                        //\n                        this.state.securedFields[pFieldType].hasError = !!code;\n                        this.state.securedFields[pFieldType].errorType = code;\n\n                        // Inform iframe\n                        const dataObj: object = {\n                            txVariant: this.state.type,\n                            fieldType: pFieldType,\n                            unsupportedCard: !!code,\n                            code,\n                            numKey: this.state.securedFields[pFieldType].numKey\n                        };\n                        postMessageToIframe(dataObj, getIframeContentWin(this.state, pFieldType), this.config.loadingContext);\n                    }\n                } else {\n                    notConfiguredWarning('You cannot set hasUnsupportedCard on any secured field');\n                }\n            },\n            destroy: (): void => {\n                if (this.state.isConfigured) {\n                    this.destroySecuredFields();\n                } else {\n                    notConfiguredWarning('You cannot destroy secured fields');\n                }\n            },\n            brandsFromBinLookup: (binLookupResponse: BinLookupResponse, resetObj: SingleBrandResetObject): void => {\n                if (!this.config.isCreditCardType) return null;\n\n                if (this.state.isConfigured) {\n                    this.handleBrandFromBinLookup(binLookupResponse, resetObj);\n                } else {\n                    notConfiguredWarning('You cannot set pass brands to secured fields');\n                }\n            },\n            addSecuredField: (pFieldType: SFFieldType): void => {\n                const securedField: HTMLElement = selectOne(this.props.rootNode, `[data-cse=\"${pFieldType}\"]`);\n                if (securedField) {\n                    this.state.numIframes += 1;\n                    this.setupSecuredField(securedField);\n                }\n            },\n            removeSecuredField: (pFieldType: SFFieldType): void => {\n                if (this.state.securedFields[pFieldType]) {\n                    this.state.securedFields[pFieldType].destroy();\n                    delete this.state.securedFields[pFieldType];\n                    this.state.numIframes -= 1;\n                    this.state.iframeCount -= 1;\n\n                    const callbackObj: CardAdditionalSFData = { additionalIframeRemoved: true, fieldType: pFieldType, type: this.state.type };\n                    this.callbacks.onAdditionalSFRemoved(callbackObj);\n                }\n            },\n            setKCPStatus: (isKCP: boolean): void => {\n                this.state.isKCP = isKCP;\n            },\n            sfIsOptionalOrHidden: (fieldType: string): boolean => {\n                return this.state.securedFields[fieldType].isOptionalOrHidden();\n            }\n        };\n\n        return returnObj;\n    }\n}\n\nexport default CSF;\n"],"names":["notConfiguredWarning","str","logger","CSF","AbstractCSF","init","this","configHandler","props","callbacksHandler","callbacks","numIframes","createSecuredFields","state","originalNumIframes","isKCP","ua","__IS_IOS","shouldDisableIOSArrowKeys","hasGenuineTouchEvents","on","document","touchstartListener","createReturnObject","updateStyles","pStyleObject","isConfigured","postMessageToAllIframes","styleObject","setFocusOnFrame","pFieldType","isValidated","code","hasOwnProperty","securedFields","hasError","errorType","dataObj","txVariant","type","fieldType","externalValidation","numKey","postMessageToIframe","getIframeContentWin","config","loadingContext","hasUnsupportedCard","unsupportedCard","destroy","destroySecuredFields","brandsFromBinLookup","binLookupResponse","resetObj","isCreditCardType","handleBrandFromBinLookup","addSecuredField","securedField","selectOne","rootNode","setupSecuredField","removeSecuredField","iframeCount","callbackObj","additionalIframeRemoved","onAdditionalSFRemoved","setKCPStatus","sfIsOptionalOrHidden","isOptionalOrHidden","constructor","setupObj","super","brand","cvcPolicy","allValid","undefined","iframeConfigCount","hasSeparateDateFields","currentFocusObject","registerFieldForIos","thisObj","csfState","csfConfig","csfProps","csfCallbacks","handleConfig","bind","configureCallbacks","validateForm","partial","handleIframeConfigFeedback","processBrand","handleValidation","handleEncryption","createNonCardSecuredFields","createCardSecuredFields","handleIOSTouchEvents","handleTouchend","touchendListener","destroyTouchendListener","destroyTouchstartListener","handleFocus","handleSFShiftTab","handleTab","handleShiftTab","processAutoComplete","handleBinValue","sendBrandToCardSF","sendExpiryDatePolicyToSF"],"mappings":"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"}

package/dist/es/components/internal/SegmentedControl/SegmentedControl.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import o from"../../../_virtual/index.js";import{stopPropagationForActionKeys as t}from"../Button/stopPropagationForActionKeys.js";const n=({classNameModifiers:n=[],selectedValue:a,disabled:s=!1,options:c,onChange:l})=>c&&0!==c.length?e("div",{className:o("adyen-checkout__segmented-control",{"adyen-checkout__segmented-control--disabled":s},...n.map(e=>`adyen-checkout__segmented-control--${e}`)),role:"group"},c.map(({label:n,value:c,controls:r,htmlProps:d})=>e("button",{disabled:s,key:c,onClick:e=>l(c,e),onKeyPress:t,onKeyDown:t,className:o("adyen-checkout__segmented-control-segment",{"adyen-checkout__segmented-control-segment--selected":a===c}),"aria-controls":r,"aria-expanded":a===c,type:"button",...d},n))):null;export{n as SegmentedControl};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import t from"../../../_virtual/index.js";import{stopPropagationForActionKeys as o}from"../Button/stopPropagationForActionKeys.js";const n=({classNameModifiers:n=[],selectedValue:s,disabled:a=!1,options:l,onChange:c})=>l&&0!==l.length?e("div",{className:t("adyen-checkout__segmented-control",{"adyen-checkout__segmented-control--disabled":a},...n.map(e=>`adyen-checkout__segmented-control--${e}`)),role:"tablist"},l.map(({label:n,value:l,id:r,controls:d,htmlProps:i})=>e("button",{role:"tab",id:r,disabled:a,key:l,onClick:e=>c(l,e),onKeyPress:o,onKeyDown:o,className:t("adyen-checkout__segmented-control-segment",{"adyen-checkout__segmented-control-segment--selected":s===l}),"aria-controls":d,"aria-selected":s===l,type:"button",...i},n))):null;export{n as SegmentedControl};
 //# sourceMappingURL=SegmentedControl.js.map

package/dist/es/components/internal/SegmentedControl/SegmentedControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.js","sources":["../../../../../src/components/internal/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\nimport './SegmentedControl.scss';\nimport { stopPropagationForActionKeys } from '../Button/stopPropagationForActionKeys';\n\nexport interface SegmentedControlOption<T> {\n    readonly label: string;\n    readonly value: T;\n    readonly id: string;\n    readonly controls: string;\n    readonly htmlProps?: {};\n}\n\nexport type SegmentedControlOptions<T> = Array<SegmentedControlOption<T>>;\n\nexport interface SegmentedControlProps<T> {\n    classNameModifiers?: string[];\n    selectedValue: T;\n    disabled?: boolean;\n    options: SegmentedControlOptions<T>;\n    onChange: (value: T, event: MouseEvent) => void;\n}\n\n/**\n *\n * example:\n * <SegmentedControl\n *   onChange={(value) = setMode(value)}\n *   selectedValue={mode}\n *   disabled={status === 'loading'}\n *   classNameModifiers={['css-class']}\n *   options={segmentedControlOptions}\n * />\n *\n * @param classNameModifiers\n * @param selectedValue\n * @param disabled\n * @param options\n * @param onChange\n * @constructor\n */\nexport const SegmentedControl = <T,>({\n    classNameModifiers = [],\n    selectedValue,\n    disabled = false,\n    options,\n    onChange\n}: Readonly<SegmentedControlProps<T>>) => {\n    if (!options || options.length === 0) {\n        return null;\n    }\n\n    return (\n        <div\n            className={cx(\n                'adyen-checkout__segmented-control',\n                { 'adyen-checkout__segmented-control--disabled': disabled },\n                ...classNameModifiers.map(modifier => `adyen-checkout__segmented-control--${modifier}`)\n            )}\n            role=\"group\"\n        >\n            {options.map(({ label, value, controls, htmlProps }: SegmentedControlOption<T>) => (\n                <button\n                    disabled={disabled}\n                    key={value}\n                    onClick={(event: MouseEvent) => onChange(value, event)}\n                    // Workaround: See ADR-0001-uielement-keyboard-event-propagation-workaround\n                    onKeyPress={stopPropagationForActionKeys}\n                    onKeyDown={stopPropagationForActionKeys}\n                    className={cx('adyen-checkout__segmented-control-segment', {\n                        'adyen-checkout__segmented-control-segment--selected': selectedValue === value\n                    })}\n                    aria-controls={controls}\n                    aria-expanded={selectedValue === value}\n                    type=\"button\"\n                    {...htmlProps}\n                >\n                    {label}\n                </button>\n            ))}\n        </div>\n    );\n};\n"],"names":["SegmentedControl","classNameModifiers","selectedValue","disabled","options","onChange","length","h","div","className","cx","map","modifier","role","label","value","controls","htmlProps","button","key","onClick","event","onKeyPress","stopPropagationForActionKeys","onKeyDown","aria-controls","aria-expanded","type"],"mappings":"2MAyCO,MAAMA,EAAmB,EAC5BC,qBAAqB,GACrBC,gBACAC,YAAW,EACXC,UACAC,cAEKD,GAA8B,IAAnBA,EAAQE,OAKpBC,EAACC,MAAAA,CACGC,UAAWC,EACP,oCACA,CAAE,8CAA+CP,MAC9CF,EAAmBU,IAAIC,GAAY,sCAAsCA,MAEhFC,KAAK,SAEJT,EAAQO,IAAI,EAAGG,QAAOC,QAAOC,WAAUC,eACpCV,EAACW,SAAAA,CACGf,SAAUA,EACVgB,IAAKJ,EACLK,QAAUC,GAAsBhB,EAASU,EAAOM,GAEhDC,WAAYC,EACZC,UAAWD,EACXd,UAAWC,EAAG,4CAA6C,CACvD,sDAAuDR,IAAkBa,IAE7EU,gBAAeT,EACfU,gBAAexB,IAAkBa,EACjCY,KAAK,YACDV,GAEHH,KA5BN"}
+{"version":3,"file":"SegmentedControl.js","sources":["../../../../../src/components/internal/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\n\nimport './SegmentedControl.scss';\nimport { stopPropagationForActionKeys } from '../Button/stopPropagationForActionKeys';\n\nexport interface SegmentedControlOption<T> {\n    readonly label: string;\n    readonly value: T;\n    readonly id: string;\n    readonly controls: string;\n    readonly htmlProps?: {};\n}\n\nexport type SegmentedControlOptions<T> = Array<SegmentedControlOption<T>>;\n\nexport interface SegmentedControlProps<T> {\n    classNameModifiers?: string[];\n    selectedValue: T;\n    disabled?: boolean;\n    options: SegmentedControlOptions<T>;\n    onChange: (value: T, event: MouseEvent) => void;\n}\n\n/**\n *\n * example:\n * <SegmentedControl\n *   onChange={(value) = setMode(value)}\n *   selectedValue={mode}\n *   disabled={status === 'loading'}\n *   classNameModifiers={['css-class']}\n *   options={segmentedControlOptions}\n * />\n *\n * @param classNameModifiers\n * @param selectedValue\n * @param disabled\n * @param options\n * @param onChange\n * @constructor\n */\nexport const SegmentedControl = <T,>({\n    classNameModifiers = [],\n    selectedValue,\n    disabled = false,\n    options,\n    onChange\n}: Readonly<SegmentedControlProps<T>>) => {\n    if (!options || options.length === 0) {\n        return null;\n    }\n\n    return (\n        <div\n            className={cx(\n                'adyen-checkout__segmented-control',\n                { 'adyen-checkout__segmented-control--disabled': disabled },\n                ...classNameModifiers.map(modifier => `adyen-checkout__segmented-control--${modifier}`)\n            )}\n            role=\"tablist\"\n        >\n            {options.map(({ label, value, id, controls, htmlProps }: SegmentedControlOption<T>) => (\n                <button\n                    role=\"tab\"\n                    id={id}\n                    disabled={disabled}\n                    key={value}\n                    onClick={(event: MouseEvent) => onChange(value, event)}\n                    // Workaround: See ADR-0001-uielement-keyboard-event-propagation-workaround\n                    onKeyPress={stopPropagationForActionKeys}\n                    onKeyDown={stopPropagationForActionKeys}\n                    className={cx('adyen-checkout__segmented-control-segment', {\n                        'adyen-checkout__segmented-control-segment--selected': selectedValue === value\n                    })}\n                    aria-controls={controls}\n                    aria-selected={selectedValue === value}\n                    type=\"button\"\n                    {...htmlProps}\n                >\n                    {label}\n                </button>\n            ))}\n        </div>\n    );\n};\n"],"names":["SegmentedControl","classNameModifiers","selectedValue","disabled","options","onChange","length","h","div","className","cx","map","modifier","role","label","value","id","controls","htmlProps","button","key","onClick","event","onKeyPress","stopPropagationForActionKeys","onKeyDown","aria-controls","aria-selected","type"],"mappings":"2MA0CO,MAAMA,EAAmB,EAC5BC,qBAAqB,GACrBC,gBACAC,YAAW,EACXC,UACAC,cAEKD,GAA8B,IAAnBA,EAAQE,OAKpBC,EAACC,MAAAA,CACGC,UAAWC,EACP,oCACA,CAAE,8CAA+CP,MAC9CF,EAAmBU,IAAIC,GAAY,sCAAsCA,MAEhFC,KAAK,WAEJT,EAAQO,IAAI,EAAGG,QAAOC,QAAOC,KAAIC,WAAUC,eACxCX,EAACY,SAAAA,CACGN,KAAK,MACLG,GAAIA,EACJb,SAAUA,EACViB,IAAKL,EACLM,QAAUC,GAAsBjB,EAASU,EAAOO,GAEhDC,WAAYC,EACZC,UAAWD,EACXf,UAAWC,EAAG,4CAA6C,CACvD,sDAAuDR,IAAkBa,IAE7EW,gBAAeT,EACfU,gBAAezB,IAAkBa,EACjCa,KAAK,YACDV,GAEHJ,KA9BN"}

package/dist/es/components/internal/SegmentedControl/SegmentedControlRegion.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";const a=({id:a,ariaLabelledBy:r,className:l,children:i})=>e("div",{id:a,"aria-labelledby":r,className:l,role:"region"},i);export{a as SegmentedControlRegion};
+import{createElement as e}from"../../../external/preact/dist/preact.js";const a=({id:a,ariaLabelledBy:l,className:r,children:t})=>e("div",{id:a,"aria-labelledby":l,className:r,role:"tabpanel"},t);export{a as SegmentedControlRegion};
 //# sourceMappingURL=SegmentedControlRegion.js.map

package/dist/es/components/internal/SegmentedControl/SegmentedControlRegion.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlRegion.js","sources":["../../../../../src/components/internal/SegmentedControl/SegmentedControlRegion.tsx"],"sourcesContent":["import { h } from 'preact';\n\nexport interface SegmentedControlRegionProps {\n    id: string;\n    ariaLabelledBy: string;\n    className?: string;\n    children: h.JSX.Element | h.JSX.Element[];\n}\n\nexport const SegmentedControlRegion = ({ id, ariaLabelledBy, className, children }: Readonly<SegmentedControlRegionProps>) => {\n    return (\n        <div id={id} aria-labelledby={ariaLabelledBy} className={className} role=\"region\">\n            {children}\n        </div>\n    );\n};\n"],"names":["SegmentedControlRegion","id","ariaLabelledBy","className","children","h","div","aria-labelledby","role"],"mappings":"wEASO,MAAMA,EAAyB,EAAGC,KAAIC,iBAAgBC,YAAWC,cAEhEC,EAACC,MAAAA,CAAIL,GAAIA,EAAIM,kBAAiBL,EAAgBC,UAAWA,EAAWK,KAAK,UACpEJ"}
+{"version":3,"file":"SegmentedControlRegion.js","sources":["../../../../../src/components/internal/SegmentedControl/SegmentedControlRegion.tsx"],"sourcesContent":["import { ComponentChildren, h } from 'preact';\n\nexport interface SegmentedControlRegionProps {\n    id: string;\n    ariaLabelledBy: string;\n    className?: string;\n    children: ComponentChildren;\n}\n\nexport const SegmentedControlRegion = ({ id, ariaLabelledBy, className, children }: Readonly<SegmentedControlRegionProps>) => {\n    return (\n        <div id={id} aria-labelledby={ariaLabelledBy} className={className} role=\"tabpanel\">\n            {children}\n        </div>\n    );\n};\n"],"names":["SegmentedControlRegion","id","ariaLabelledBy","className","children","h","div","aria-labelledby","role"],"mappings":"wEASO,MAAMA,EAAyB,EAAGC,KAAIC,iBAAgBC,YAAWC,cAEhEC,EAACC,MAAAA,CAAIL,GAAIA,EAAIM,kBAAiBL,EAAgBC,UAAWA,EAAWK,KAAK,YACpEJ"}

package/dist/es/components/internal/UIElement/UIElement.js

@@ -1,2 +1,2 @@
-import{createElement as e,createRef as t}from"../../../external/preact/dist/preact.js";import s,{NETWORK_ERROR as i}from"../../../core/Errors/AdyenCheckoutError.js";import{hasOwnProperty as n}from"../../../utils/hasOwnProperty.js";import o from"../BaseElement/BaseElement.js";import r from"../PayButton/PayButton.js";import{assertIsDropin as a,getRegulatoryDefaults as h,sanitizeResponse as d,verifyPaymentDidNotFail as l,cleanupFinalResult as m}from"./utils.js";import{AnalyticsErrorEvent as p,ErrorEventType as c}from"../../../core/Analytics/events/AnalyticsErrorEvent.js";import{AnalyticsInfoEvent as u,InfoEventType as y}from"../../../core/Analytics/events/AnalyticsInfoEvent.js";import{AnalyticsLogEvent as f,LogEventType as R}from"../../../core/Analytics/events/AnalyticsLogEvent.js";import b from"../../../core/Errors/CancelError.js";import{CoreProvider as P}from"../../../core/Context/CoreProvider.js";import A from"../../../core/Errors/SRPanelProvider.js";import{AmountProvider as E}from"../../../core/Context/AmountProvider.js";function g(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}class v extends o{createBeforeRenderHook(e){const t=this.render;this.render=(...s)=>(this.beforeRender(e),t.apply(this,s))}beforeRender(e){if(e?.originalAction)return;const t=new u({type:y.rendered,component:this.type,configData:{...e,showPayButton:this.props.showPayButton},...e?.oneClick&&{isStoredPaymentMethod:!0}});this.analytics.sendAnalytics(t)}reportIntegrationFlavor(){this.analytics.sendFlavor("components")}get analytics(){return this.core.modules.analytics}get srPanel(){return this.core.modules.srPanel}getPaymentMethodConfigFromResponse(e){return e?.storedPaymentMethodId?this.getStoredPaymentMethodDetails(e.storedPaymentMethodId):this.getPaymentMethodFromPaymentMethodsResponse(e?.type,e?.paymentMethodId)}buildElementProps(e){const t={showPayButton:!0,...this.core.getCorePropsForComponent(),...this.getPaymentMethodConfigFromResponse(e),...e},s=a(this);this.props=this.formatProps({...this.constructor.defaultProps,...h(this.core.options.countryCode,s),...t})}getStoredPaymentMethodDetails(e){return this.core.paymentMethodsResponse.findStoredPaymentMethod(e)}getPaymentMethodFromPaymentMethodsResponse(e,t){return t?this.core.paymentMethodsResponse.findById(t):this.core.paymentMethodsResponse?.find(e||this.constructor.type)}storeElementRefOnCore(e){e?.isDropin||this.core.storeElementReference(this)}isAvailable(){return Promise.resolve()}setState(e){this.state={...this.state,...e},this.onChange()}showValidation(){return this.componentRef&&this.componentRef.showValidation&&this.componentRef.showValidation(),this}updateAmount(e,t){this.props={...this.props,...e&&{amount:e},...t&&{secondaryAmount:t}},this.amountProviderRef.current?.update(e,t)}setElementStatus(e,t){return this.elementRef?.setStatus(e,t),this}setStatus(e,t){return this.componentRef?.setStatus&&this.componentRef.setStatus(e,t),this}onChange(){this.props.onChange?.({data:this.data,isValid:this.isValid,errors:this.state.errors,valid:this.state.valid},this.elementRef)}submitAnalytics(e){this.analytics.sendAnalytics(e)}submit(){this.isValid?this.makePaymentsCall().then(d).then(l).then(this.handleResponse).catch(e=>{e instanceof b?this.setElementStatus("ready"):this.handleFailedResult(e)}):this.showValidation()}makePaymentsCall(){if(this.setElementStatus("loading"),this.props.onSubmit)return this.submitUsingAdvancedFlow();if(this.core.session){return(this.props.beforeSubmit?new Promise((e,t)=>{this.props.beforeSubmit(this.data,this.elementRef,{resolve:e,reject:()=>t(new b("beforeSubmitRejected"))})}):Promise.resolve(this.data)).then(this.submitUsingSessionsFlow)}this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments call. Callback "onSubmit" is missing or Checkout session is not available'))}async submitUsingAdvancedFlow(){const e=new f({component:this.type,type:R.submit,message:"Shopper clicked pay"});return this.submitAnalytics(e),new Promise((e,t)=>{this.props.onSubmit({data:this.data,isValid:this.isValid},this.elementRef,{resolve:e,reject:t})})}async submitUsingSessionsFlow(e){const t=new f({component:this.type,type:R.submit,message:"Shopper clicked pay"});this.submitAnalytics(t);try{return await this.core.session.submitPayment(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /payments call",{cause:e})),Promise.reject(e)}}onComplete(e){this.handleAdditionalDetails(e)}handleAdditionalDetails(e){this.makeAdditionalDetailsCall(e).then(d).then(l).then(this.handleResponse).catch(this.handleFailedResult)}makeAdditionalDetailsCall(e){return this.props.onAdditionalDetails?new Promise((t,s)=>{this.props.onAdditionalDetails(e,this.elementRef,{resolve:t,reject:s})}):this.core.session?this.submitAdditionalDetailsUsingSessionsFlow(e.data):void this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments/details call. Callback "onAdditionalDetails" is missing or Checkout session is not available'))}async submitAdditionalDetailsUsingSessionsFlow(e){try{return await this.core.session.submitDetails(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /details call",{cause:e})),Promise.reject(e)}}handleAction(e,t={}){if(!e||!e.type){if(n(e,"action")&&n(e,"resultCode"))throw new Error('handleAction::Invalid Action - the passed action object itself has an "action" property and a "resultCode": have you passed in the whole response object by mistake?');throw new Error('handleAction::Invalid Action - the passed action object does not have a "type" property')}const s=this.core.createFromAction(e,{...this.elementRef.props,...t});return s?(this.unmount(),s.mount(this._node)):null}onActionHandled(e){this.props?.onActionHandled?.({originalAction:this.props.originalAction,...e})}handleResponse(e){e.action?this.elementRef.handleAction(e.action):e.order?.remainingAmount?.value>0?this.handleOrder(e):this.handleSuccessResult(e)}handleKeyPress(e){"Enter"!==e.key&&"Enter"!==e.code||(e.preventDefault(),this.onEnterKeyPressed(document?.activeElement,this))}onEnterKeyPressed(e,t){this.props.onEnterKeyPressed?this.props.onEnterKeyPressed(e,t):(e.blur(),this.submit())}updateParent(e={}){return this.elementRef.core.update(e)}get isValid(){return!1}get icon(){const e=this.props.paymentMethodType||this.type;return this.props.icon??this.resources.getImage()(e)}get displayName(){const e=this.core.paymentMethodsResponse?.paymentMethods?.find(e=>e.type===this.type);return this.props.name||e?.name||this.type}get accessibleName(){return this.displayName}get additionalInfo(){return null}get type(){return this.props.type||this.constructor.type}async handleAdvanceFlowPaymentMethodsUpdate(e,t){return new Promise((t,s)=>{if(!this.props.onPaymentMethodsRequest)return t();this.props.onPaymentMethodsRequest({...e&&{order:{orderData:e.orderData,pspReference:e.pspReference}},locale:this.core.options.locale},{resolve:t,reject:s})}).catch(e=>{this.handleError(new s("IMPLEMENTATION_ERROR","Something failed during payment methods update or onPaymentMethodsRequest was not implemented",{cause:e}))}).then(s=>this.core.update({...s&&{paymentMethodsResponse:s},order:e,amount:e?e.remainingAmount:t}))}render(){return e(P,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources,analytics:this.analytics},e(A,{srPanel:this.srPanel},e(E,{amount:this.props.amount,secondaryAmount:this.props.secondaryAmount,providerRef:this.amountProviderRef},this.componentToRender())))}constructor(s,n){super(s,n),g(this,"componentRef",void 0),g(this,"resources",void 0),g(this,"elementRef",void 0),g(this,"amountProviderRef",t()),g(this,"handleError",e=>{if(this.setElementStatus("ready"),e.name===i&&e.options.code){const t=new p({component:this.type,errorType:c.apiError,code:e.options.code});this.submitAnalytics(t)}this.props.onError&&this.props.onError(e,this.elementRef)}),g(this,"handleOrder",e=>{const{order:t}=e;(this.core.session?this.core.update({order:t}):this.handleAdvanceFlowPaymentMethodsUpdate(t)).then(()=>{this.props.onOrderUpdated?.({order:t})})}),g(this,"handleFailedResult",e=>{a(this.elementRef)&&this.elementRef.displayFinalAnimation("error"),m(e),this.props.onPaymentFailed?.(e,this.elementRef)}),g(this,"handleSuccessResult",e=>{a(this.elementRef)&&this.elementRef.displayFinalAnimation("success"),m(e),this.props.onPaymentCompleted?.(e,this.elementRef)}),g(this,"setComponentRef",e=>{this.componentRef=e}),g(this,"payButton",t=>e(r,{...t,onClick:this.submit})),this.core.register(this.constructor),this.submit=this.submit.bind(this),this.setState=this.setState.bind(this),this.onComplete=this.onComplete.bind(this),this.handleAction=this.handleAction.bind(this),this.handleOrder=this.handleOrder.bind(this),this.handleAdditionalDetails=this.handleAdditionalDetails.bind(this),this.handleResponse=this.handleResponse.bind(this),this.setElementStatus=this.setElementStatus.bind(this),this.submitAnalytics=this.submitAnalytics.bind(this),this.makePaymentsCall=this.makePaymentsCall.bind(this),this.makeAdditionalDetailsCall=this.makeAdditionalDetailsCall.bind(this),this.submitUsingSessionsFlow=this.submitUsingSessionsFlow.bind(this),this.updateAmount=this.updateAmount.bind(this),this.elementRef=n&&n.elementRef||this,this.resources=this.props.modules?this.props.modules.resources:void 0,this.storeElementRefOnCore(this.props),this.onEnterKeyPressed=this.onEnterKeyPressed.bind(this),this.onActionHandled=this.onActionHandled.bind(this),this.createBeforeRenderHook(n),this.reportIntegrationFlavor()}}g(v,"type",void 0),g(v,"txVariants",[]);export{v as UIElement,v as default};
+import{createElement as e,createRef as t}from"../../../external/preact/dist/preact.js";import s,{NETWORK_ERROR as i}from"../../../core/Errors/AdyenCheckoutError.js";import{hasOwnProperty as n}from"../../../utils/hasOwnProperty.js";import o from"../BaseElement/BaseElement.js";import r from"../PayButton/PayButton.js";import{assertIsDropin as a,getRegulatoryDefaults as h,sanitizeResponse as d,verifyPaymentDidNotFail as l,cleanupFinalResult as m}from"./utils.js";import{AnalyticsErrorEvent as p,ErrorEventType as c}from"../../../core/Analytics/events/AnalyticsErrorEvent.js";import{AnalyticsInfoEvent as u,InfoEventType as y}from"../../../core/Analytics/events/AnalyticsInfoEvent.js";import{AnalyticsLogEvent as f,LogEventType as R}from"../../../core/Analytics/events/AnalyticsLogEvent.js";import b from"../../../core/Errors/CancelError.js";import{CoreProvider as P}from"../../../core/Context/CoreProvider.js";import A from"../../../core/Errors/SRPanelProvider.js";import{AmountProvider as E}from"../../../core/Context/AmountProvider.js";import{TxVariants as g}from"../../tx-variants.js";function v(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}class w extends o{createBeforeRenderHook(e){const t=this.render;this.render=(...s)=>(this.beforeRender(e),t.apply(this,s))}beforeRender(e){if(e?.originalAction)return;const t=new u({type:y.rendered,component:this.type,configData:{...e,showPayButton:this.props.showPayButton},...e?.oneClick&&{isStoredPaymentMethod:!0}});this.analytics.sendAnalytics(t)}reportIntegrationFlavor(){this.analytics.sendFlavor("components")}get analytics(){return this.core.modules.analytics}get srPanel(){return this.core.modules.srPanel}getPaymentMethodConfigFromResponse(e){return e?.storedPaymentMethodId?this.getStoredPaymentMethodDetails(e.storedPaymentMethodId):this.getPaymentMethodFromPaymentMethodsResponse(e?.type,e?.paymentMethodId)}buildElementProps(e){const t={showPayButton:!0,...this.core.getCorePropsForComponent(),...this.getPaymentMethodConfigFromResponse(e),...e},s=a(this);this.props=this.formatProps({...this.constructor.defaultProps,...h(this.core.options.countryCode,s),...t})}getStoredPaymentMethodDetails(e){return this.core.paymentMethodsResponse.findStoredPaymentMethod(e)}getPaymentMethodFromPaymentMethodsResponse(e,t){return t?this.core.paymentMethodsResponse.findById(t):this.core.paymentMethodsResponse?.find(e||this.constructor.type)}storeElementRefOnCore(e){e?.isDropin||this.core.storeElementReference(this)}isAvailable(){return Promise.resolve()}setState(e){this.state={...this.state,...e},this.onChange()}showValidation(){return this.componentRef&&this.componentRef.showValidation&&this.componentRef.showValidation(),this}updateAmount(e,t){this.props={...this.props,...e&&{amount:e},...t&&{secondaryAmount:t}},this.amountProviderRef.current?.update(e,t)}setElementStatus(e,t){return this.elementRef?.setStatus(e,t),this}setStatus(e,t){return this.componentRef?.setStatus&&this.componentRef.setStatus(e,t),this}onChange(){this.props.onChange?.({data:this.data,isValid:this.isValid,errors:this.state.errors,valid:this.state.valid},this.elementRef)}submitAnalytics(e){this.analytics.sendAnalytics(e)}submit(){this.isValid?this.makePaymentsCall().then(d).then(l).then(this.handleResponse).catch(e=>{e instanceof b?this.setElementStatus("ready"):this.handleFailedResult(e)}):this.showValidation()}makePaymentsCall(){if(this.setElementStatus("loading"),this.props.onSubmit)return this.submitUsingAdvancedFlow();if(this.core.session){return(this.props.beforeSubmit?new Promise((e,t)=>{this.props.beforeSubmit(this.data,this.elementRef,{resolve:e,reject:()=>t(new b("beforeSubmitRejected"))})}):Promise.resolve(this.data)).then(this.submitUsingSessionsFlow)}this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments call. Callback "onSubmit" is missing or Checkout session is not available'))}async submitUsingAdvancedFlow(){const e=new f({component:this.type,type:R.submit,message:"Shopper clicked pay"});return this.submitAnalytics(e),new Promise((e,t)=>{this.props.onSubmit({data:this.data,isValid:this.isValid},this.elementRef,{resolve:e,reject:t})})}async submitUsingSessionsFlow(e){const t=new f({component:this.type,type:R.submit,message:"Shopper clicked pay"});this.submitAnalytics(t);try{return await this.core.session.submitPayment(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /payments call",{cause:e})),Promise.reject(e)}}onComplete(e){this.handleAdditionalDetails(e)}handleAdditionalDetails(e){this.makeAdditionalDetailsCall(e).then(d).then(l).then(this.handleResponse).catch(this.handleFailedResult)}makeAdditionalDetailsCall(e){return this.props.onAdditionalDetails?new Promise((t,s)=>{this.props.onAdditionalDetails(e,this.elementRef,{resolve:t,reject:s})}):this.core.session?this.submitAdditionalDetailsUsingSessionsFlow(e.data):void this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments/details call. Callback "onAdditionalDetails" is missing or Checkout session is not available'))}async submitAdditionalDetailsUsingSessionsFlow(e){try{return await this.core.session.submitDetails(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /details call",{cause:e})),Promise.reject(e)}}handleAction(e,t={}){if(!e||!e.type){if(n(e,"action")&&n(e,"resultCode"))throw new Error('handleAction::Invalid Action - the passed action object itself has an "action" property and a "resultCode": have you passed in the whole response object by mistake?');throw new Error('handleAction::Invalid Action - the passed action object does not have a "type" property')}const s=this.core.createFromAction(e,{...this.elementRef.props,...t});return s?(this.unmount(),s.mount(this._node)):null}onActionHandled(e){this.props?.onActionHandled?.({originalAction:this.props.originalAction,...e})}setupSessionsDonation(){const{amount:e,donation:t}=this.props;if(!1!==t?.autoMount){const t=a(this.elementRef)?this.elementRef._node:this._node;new(this.core.getComponent(g.donation))(this.core,{rootNode:t,commercialTxAmount:e.value})}}handleResponse(e){e.action?this.elementRef.handleAction(e.action):e.order?.remainingAmount?.value>0?this.handleOrder(e):this.handleSuccessResult(e)}handleKeyPress(e){"Enter"!==e.key&&"Enter"!==e.code||(e.preventDefault(),this.onEnterKeyPressed(document?.activeElement,this))}onEnterKeyPressed(e,t){this.props.onEnterKeyPressed?this.props.onEnterKeyPressed(e,t):(e.blur(),this.submit())}updateParent(e={}){return this.elementRef.core.update(e)}get isValid(){return!1}get icon(){const e=this.props.paymentMethodType||this.type;return this.props.icon??this.resources.getImage()(e)}get displayName(){const e=this.core.paymentMethodsResponse?.paymentMethods?.find(e=>e.type===this.type);return this.props.name||e?.name||this.type}get accessibleName(){return this.displayName}get additionalInfo(){return null}get type(){return this.props.type||this.constructor.type}async handleAdvanceFlowPaymentMethodsUpdate(e,t){return new Promise((t,s)=>{if(!this.props.onPaymentMethodsRequest)return t();this.props.onPaymentMethodsRequest({...e&&{order:{orderData:e.orderData,pspReference:e.pspReference}},locale:this.core.options.locale},{resolve:t,reject:s})}).catch(e=>{this.handleError(new s("IMPLEMENTATION_ERROR","Something failed during payment methods update or onPaymentMethodsRequest was not implemented",{cause:e}))}).then(s=>this.core.update({...s&&{paymentMethodsResponse:s},order:e,amount:e?e.remainingAmount:t}))}render(){return e(P,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources,analytics:this.analytics},e(A,{srPanel:this.srPanel},e(E,{amount:this.props.amount,secondaryAmount:this.props.secondaryAmount,providerRef:this.amountProviderRef},this.componentToRender())))}constructor(s,n){super(s,n),v(this,"componentRef",void 0),v(this,"resources",void 0),v(this,"elementRef",void 0),v(this,"amountProviderRef",t()),v(this,"handleError",e=>{if(this.setElementStatus("ready"),e.name===i&&e.options.code){const t=new p({component:this.type,errorType:c.apiError,code:e.options.code});this.submitAnalytics(t)}this.props.onError&&this.props.onError(e,this.elementRef)}),v(this,"handleOrder",e=>{const{order:t}=e;(this.core.session?this.core.update({order:t}):this.handleAdvanceFlowPaymentMethodsUpdate(t)).then(()=>{this.props.onOrderUpdated?.({order:t})})}),v(this,"handleFailedResult",e=>{a(this.elementRef)&&this.elementRef.displayFinalAnimation("error"),m(e),this.props.onPaymentFailed?.(e,this.elementRef)}),v(this,"handleSuccessResult",e=>{a(this.elementRef)&&this.elementRef.displayFinalAnimation("success"),m(e),this.core.session&&!0===e.askDonation&&this.setupSessionsDonation(),this.props.onPaymentCompleted?.(e,this.elementRef)}),v(this,"setComponentRef",e=>{this.componentRef=e}),v(this,"payButton",t=>e(r,{...t,onClick:this.submit})),this.core.register(this.constructor),this.submit=this.submit.bind(this),this.setState=this.setState.bind(this),this.onComplete=this.onComplete.bind(this),this.handleAction=this.handleAction.bind(this),this.handleOrder=this.handleOrder.bind(this),this.handleAdditionalDetails=this.handleAdditionalDetails.bind(this),this.handleResponse=this.handleResponse.bind(this),this.setElementStatus=this.setElementStatus.bind(this),this.submitAnalytics=this.submitAnalytics.bind(this),this.makePaymentsCall=this.makePaymentsCall.bind(this),this.makeAdditionalDetailsCall=this.makeAdditionalDetailsCall.bind(this),this.submitUsingSessionsFlow=this.submitUsingSessionsFlow.bind(this),this.updateAmount=this.updateAmount.bind(this),this.setupSessionsDonation=this.setupSessionsDonation.bind(this),this.elementRef=n&&n.elementRef||this,this.resources=this.props.modules?this.props.modules.resources:void 0,this.storeElementRefOnCore(this.props),this.onEnterKeyPressed=this.onEnterKeyPressed.bind(this),this.onActionHandled=this.onActionHandled.bind(this),this.createBeforeRenderHook(n),this.reportIntegrationFlavor()}}v(w,"type",void 0),v(w,"txVariants",[]);export{w as UIElement,w as default};
 //# sourceMappingURL=UIElement.js.map