@adyen/adyen-web 6.36.0 → 6.37.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/adyen.css +2 -2
- package/dist/cjs/adyen.css.map +1 -1
- package/dist/cjs/index.cjs +1 -1
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/index.d.cts +13 -7
- package/dist/es/adyen.css +2 -2
- package/dist/es/adyen.css.map +1 -1
- package/dist/es/components/Card/components/CardInput/components/BrandIcon.js +1 -1
- package/dist/es/components/Card/components/CardInput/components/BrandIcon.js.map +1 -1
- package/dist/es/components/Card/components/CardInput/components/CVC.js +1 -1
- package/dist/es/components/Card/components/CardInput/components/CVC.js.map +1 -1
- package/dist/es/components/Card/components/CardInput/components/CVCHint.js +1 -1
- package/dist/es/components/Card/components/CardInput/components/CVCHint.js.map +1 -1
- package/dist/es/components/Card/components/CardInput/components/ExpirationDate.js +1 -1
- package/dist/es/components/Card/components/CardInput/components/ExpirationDate.js.map +1 -1
- package/dist/es/components/PayTo/components/PayToComponent.js +1 -1
- package/dist/es/components/PayTo/components/PayToComponent.js.map +1 -1
- package/dist/es/components/ThreeDS2/ThreeDS2Challenge.js +1 -1
- package/dist/es/components/ThreeDS2/ThreeDS2Challenge.js.map +1 -1
- package/dist/es/components/ThreeDS2/ThreeDS2DeviceFingerprint.js +1 -1
- package/dist/es/components/ThreeDS2/ThreeDS2DeviceFingerprint.js.map +1 -1
- package/dist/es/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.js +1 -1
- package/dist/es/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.js.map +1 -1
- package/dist/es/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.js +1 -1
- package/dist/es/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.js.map +1 -1
- package/dist/es/components/ThreeDS2/components/utils.js +1 -1
- package/dist/es/components/ThreeDS2/components/utils.js.map +1 -1
- package/dist/es/components/UPI/UPI.js +1 -1
- package/dist/es/components/UPI/UPI.js.map +1 -1
- package/dist/es/components/UPI/components/UPIComponent/UPIComponent.js +1 -1
- package/dist/es/components/UPI/components/UPIComponent/UPIComponent.js.map +1 -1
- package/dist/es/components/UPI/components/UPIIntentAppList/UPIIntentAppList.js +1 -1
- package/dist/es/components/UPI/components/UPIIntentAppList/UPIIntentAppList.js.map +1 -1
- package/dist/es/components/UPI/constants.js +1 -1
- package/dist/es/components/UPI/constants.js.map +1 -1
- package/dist/es/components/internal/FormFields/Select/components/SelectButton.js +1 -1
- package/dist/es/components/internal/FormFields/Select/components/SelectButton.js.map +1 -1
- package/dist/es/components/internal/SegmentedControl/SegmentedControl.js +1 -1
- package/dist/es/components/internal/SegmentedControl/SegmentedControl.js.map +1 -1
- package/dist/es/components/internal/SegmentedControl/SegmentedControlRegion.js +1 -1
- package/dist/es/components/internal/SegmentedControl/SegmentedControlRegion.js.map +1 -1
- package/dist/es/core/Analytics/events/AnalyticsInfoEvent.js +1 -1
- package/dist/es/core/Analytics/events/AnalyticsInfoEvent.js.map +1 -1
- package/dist/es/core/ProcessResponse/PaymentAction/actionTypes.js +1 -1
- package/dist/es/core/ProcessResponse/PaymentAction/actionTypes.js.map +1 -1
- package/dist/es/core/config.js +1 -1
- package/dist/es/index.d.ts +13 -7
- package/dist/es-legacy/adyen.css +2 -2
- package/dist/es-legacy/adyen.css.map +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/BrandIcon.js +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/BrandIcon.js.map +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/CVC.js +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/CVC.js.map +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/CVCHint.js +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/CVCHint.js.map +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/ExpirationDate.js +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/ExpirationDate.js.map +1 -1
- package/dist/es-legacy/components/PayTo/components/PayToComponent.js +1 -1
- package/dist/es-legacy/components/PayTo/components/PayToComponent.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/ThreeDS2Challenge.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/ThreeDS2Challenge.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/ThreeDS2DeviceFingerprint.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/ThreeDS2DeviceFingerprint.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/utils.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/utils.js.map +1 -1
- package/dist/es-legacy/components/UPI/UPI.js +1 -1
- package/dist/es-legacy/components/UPI/UPI.js.map +1 -1
- package/dist/es-legacy/components/UPI/components/UPIComponent/UPIComponent.js +1 -1
- package/dist/es-legacy/components/UPI/components/UPIComponent/UPIComponent.js.map +1 -1
- package/dist/es-legacy/components/UPI/components/UPIIntentAppList/UPIIntentAppList.js +1 -1
- package/dist/es-legacy/components/UPI/components/UPIIntentAppList/UPIIntentAppList.js.map +1 -1
- package/dist/es-legacy/components/UPI/constants.js +1 -1
- package/dist/es-legacy/components/UPI/constants.js.map +1 -1
- package/dist/es-legacy/components/internal/FormFields/Select/components/SelectButton.js +1 -1
- package/dist/es-legacy/components/internal/FormFields/Select/components/SelectButton.js.map +1 -1
- package/dist/es-legacy/components/internal/SegmentedControl/SegmentedControl.js +1 -1
- package/dist/es-legacy/components/internal/SegmentedControl/SegmentedControl.js.map +1 -1
- package/dist/es-legacy/components/internal/SegmentedControl/SegmentedControlRegion.js +1 -1
- package/dist/es-legacy/components/internal/SegmentedControl/SegmentedControlRegion.js.map +1 -1
- package/dist/es-legacy/core/Analytics/events/AnalyticsInfoEvent.js +1 -1
- package/dist/es-legacy/core/Analytics/events/AnalyticsInfoEvent.js.map +1 -1
- package/dist/es-legacy/core/ProcessResponse/PaymentAction/actionTypes.js +1 -1
- package/dist/es-legacy/core/ProcessResponse/PaymentAction/actionTypes.js.map +1 -1
- package/dist/es-legacy/core/config.js +1 -1
- package/package.json +2 -2
- package/styles/adyen.css +2 -2
package/dist/es/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PrepareFingerprint3DS2.js","sources":["../../../../../../src/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport DoFingerprint3DS2 from './DoFingerprint3DS2';\nimport { createFingerprintResolveData, createOldFingerprintResolveData, isErrorObject, prepareFingerPrintData } from '../utils';\nimport { PrepareFingerprint3DS2Props, PrepareFingerprint3DS2State } from './types';\nimport { FingerPrintData, ResultObject, ErrorCodeObject, LegacyFingerprintResolveData, FingerprintResolveData } from '../../types';\nimport { ErrorObject } from '../../../../core/Errors/types';\nimport { isValidHttpUrl } from '../../../../utils/isValidURL';\nimport { THREEDS2_FINGERPRINT, THREEDS2_FINGERPRINT_ERROR, THREEDS2_NUM, MISSING_TOKEN_IN_ACTION_MSG, TIMEOUT } from '../../constants';\nimport { AnalyticsLogEvent, LogEventSubtype, LogEventType } from '../../../../core/Analytics/events/AnalyticsLogEvent';\nimport { AbstractAnalyticsEvent } from '../../../../core/Analytics/events/AbstractAnalyticsEvent';\nimport { AnalyticsErrorEvent, ErrorEventCode, ErrorEventType } from '../../../../core/Analytics/events/AnalyticsErrorEvent';\n\nclass PrepareFingerprint3DS2 extends Component<PrepareFingerprint3DS2Props, PrepareFingerprint3DS2State> {\n public static readonly type = 'scheme';\n\n public static readonly defaultProps = {\n onComplete: () => {},\n onError: () => {},\n paymentData: '',\n showSpinner: true,\n isMDFlow: false\n };\n\n constructor(props) {\n super(props);\n const { token, notificationURL } = this.props; // See comments on prepareFingerPrintData regarding notificationURL\n\n if (token) {\n const fingerPrintData: FingerPrintData | ErrorObject = prepareFingerPrintData({ token, notificationURL });\n\n this.state = {\n status: 'init',\n fingerPrintData: fingerPrintData as FingerPrintData\n };\n } else {\n // Will be picked up in componentDidMount\n this.state = { fingerPrintData: { success: false, error: MISSING_TOKEN_IN_ACTION_MSG } };\n\n console.debug(`${THREEDS2_FINGERPRINT_ERROR}: ${MISSING_TOKEN_IN_ACTION_MSG}`);\n }\n }\n\n public onFormSubmit = (msg: string) => {\n const event = new AnalyticsLogEvent({\n component: this.props.type,\n type: LogEventType.threeDS2,\n subType: LogEventSubtype.fingerprintDataSentWeb,\n message: msg\n });\n\n this.props.onSubmitAnalytics(event);\n };\n\n componentDidMount() {\n const hasFingerPrintData = !isErrorObject(this.state.fingerPrintData);\n\n if (hasFingerPrintData) {\n const shouldAllowHttpDomains =\n /** Allow http urls if in development and testing against localhost:8080 */\n (process.env.NODE_ENV === 'development' && process.env.__CLIENT_ENV__?.includes('localhost:8080')) ||\n /**\n * Allows the checkoutshopper demo on localhost:8080 to work -\n * requires a configuration in localhost of environment: 'test', _environmentUrls: {api: 'http://localhost:8080/'}\n */\n (this.props.environment === 'test' && this.props._environmentUrls?.api?.includes('http://localhost:8080'));\n\n /**\n * Check the structure of the created fingerPrintData\n */\n const { threeDSMethodURL, threeDSMethodNotificationURL, postMessageDomain, threeDSServerTransID } = this.state\n .fingerPrintData as FingerPrintData;\n\n const hasValid3DSMethodURL = isValidHttpUrl(threeDSMethodURL, shouldAllowHttpDomains);\n\n // Only render component if we have a threeDSMethodURL. Otherwise, exit with threeDSCompInd: 'U'\n if (!hasValid3DSMethodURL) {\n this.setStatusComplete(\n { threeDSCompInd: 'U' },\n {\n errorCode: ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_THREEDSMETHODURL,\n message: `${THREEDS2_FINGERPRINT_ERROR}: Decoded token is missing a valid threeDSMethodURL property`\n }\n );\n\n /**\n * NOTE: we can now use this.props.isMDFlow to decide if we want to send any of these errors to the onError handler\n * - this is problematic in the regular flow since merchants tend to treat any calls to their onError handler as 'fatal',\n * but in the MDFlow we control what the onError handler does.\n */\n // if (this.props.isMDFlow) {}\n\n console.debug('### PrepareFingerprint3DS2::exiting:: no valid threeDSMethodURL');\n return;\n }\n\n const hasValid3DSMethodNotificationURL = isValidHttpUrl(threeDSMethodNotificationURL, shouldAllowHttpDomains);\n const hasValidPostMessageDomain = isValidHttpUrl(postMessageDomain, shouldAllowHttpDomains);\n const hasTransServerID = threeDSServerTransID?.length;\n\n if (!hasValid3DSMethodNotificationURL || !hasValidPostMessageDomain || !hasTransServerID) {\n /**\n * NOTE: EMVCo_3DS_CoreSpec_v2.3.1_20220831.pdf states that we should return: threeDSCompInd: 'N'\n * when the fingerprinting process \"Did not run or did not successfully complete\"\n */\n this.setStatusComplete(\n { threeDSCompInd: 'N' },\n {\n errorCode: ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS,\n message: `${THREEDS2_FINGERPRINT_ERROR}: Decoded token is missing one or more of the following properties (threeDSMethodNotificationURL | postMessageDomain | threeDSServerTransID)`\n }\n );\n\n console.debug(\n '### PrepareFingerprint3DS2::exiting:: Decoded token is missing one or more of the following properties (threeDSMethodNotificationURL | postMessageDomain | threeDSServerTransID)'\n );\n\n return;\n }\n\n // Proceed to allow component to render\n this.setState({ status: 'retrievingFingerPrint' });\n //\n } else {\n // Only render component if we have fingerPrintData. Otherwise, complete with threeDSCompInd: 'N'\n\n const errorMsg: string = (this.state.fingerPrintData as ErrorObject).error;\n\n const errorCode = errorMsg.includes(MISSING_TOKEN_IN_ACTION_MSG)\n ? ErrorEventCode.THREEDS2_ACTION_IS_MISSING_TOKEN\n : ErrorEventCode.THREEDS2_TOKEN_DECODE_OR_PARSING_FAILED;\n\n this.setStatusComplete(\n { threeDSCompInd: 'N' },\n {\n errorCode,\n message: `${THREEDS2_FINGERPRINT_ERROR}: ${errorMsg}` // can be: 'Missing \"token\" property from threeDS2 action', 'not base64', 'malformed URI sequence' or 'Could not JSON parse token'\n }\n );\n\n console.debug('### PrepareFingerprint3DS2:: token does not exist or could not be base64 decoded &/or JSON.parsed');\n }\n }\n\n setStatusComplete(resultObj: ResultObject, errorCodeObject: ErrorCodeObject = null) {\n this.setState({ status: 'complete' }, () => {\n /**\n * Create the data in the way that the /details endpoint expects.\n * This is different for the flow triggered by the threeds2InMDFlow process than for the new, v67, 'threeDS2' action\n */\n const resolveDataFunction = this.props.isMDFlow ? createOldFingerprintResolveData : createFingerprintResolveData;\n const data: LegacyFingerprintResolveData | FingerprintResolveData = resolveDataFunction(\n this.props.dataKey,\n resultObj,\n this.props.paymentData\n );\n\n let event: AbstractAnalyticsEvent;\n\n /** Are we in an error scenario? If so, submit analytics about it */\n const finalResObject = errorCodeObject ? errorCodeObject : resultObj;\n if (finalResObject.errorCode) {\n const errorTypeAndCode = {\n code: finalResObject.errorCode === TIMEOUT ? ErrorEventCode.THREEDS2_TIMEOUT : finalResObject.errorCode,\n errorType: ErrorEventType.threeDS2\n };\n\n /**\n * Timeout or data parsing problems:\n *\n * (threeDSCompInd:\"U\"):\n * - Decoded token is missing a valid threeDSMethodURL property,\n * or, (threeDSCompInd:\"N\"):\n * - Fingerprint process has timed out,\n * also, (threeDSCompInd:\"N\"):\n * - Missing \"token\" property from threeDS2 action\n * - or, decoded token is missing one or more of the following properties (threeDSMethodNotificationURL | postMessageDomain | threeDSServerTransID)\n * - or, token could not be base64 decoded &/or JSON.parsed\n */\n\n event = new AnalyticsErrorEvent({\n component: this.props.type,\n message: (finalResObject as ErrorCodeObject).message,\n ...errorTypeAndCode\n });\n\n // Send error to analytics endpoint\n this.props.onSubmitAnalytics(event);\n }\n\n /** Calculate \"result\" for analytics */\n let result: string;\n\n switch (resultObj?.threeDSCompInd) {\n case 'Y':\n result = 'success';\n break;\n case 'N': {\n if (!errorCodeObject) {\n result = 'failed'; // 'failed' is the result returned from the threeDSMethodURL\n } else {\n result = errorCodeObject.errorCode === TIMEOUT ? TIMEOUT : 'failedInternal'; // timed-out; or, 'failed' as a result of internal checks\n }\n break;\n }\n case 'U':\n result = 'noThreeDSMethodURL';\n break;\n default:\n }\n\n /**\n * The fingerprint process is completed, one way or another.\n * The resultObj will be {threeDSCompInd:\"Y\"} in the case of success,\n * else {threeDSCompInd:\"U\"} or {threeDSCompInd:\"N\"} - if we've had some kind of timeout or data parsing problem (as described above)\n */\n\n event = new AnalyticsLogEvent({\n component: this.props.type,\n type: LogEventType.threeDS2,\n subType: LogEventSubtype.fingerprintCompleted,\n message: `${THREEDS2_NUM} fingerprinting has completed`,\n result\n });\n // Send log to analytics endpoint\n this.props.onSubmitAnalytics(event);\n\n /**\n * Equals call to callSubmit3DS2Fingerprint (except for in 3DS2InMDFlow)\n */\n this.props.onComplete(data);\n });\n }\n\n render({ showSpinner }, { status, fingerPrintData }) {\n if (status === 'retrievingFingerPrint') {\n return (\n <DoFingerprint3DS2\n onCompleteFingerprint={fingerprint => {\n this.setStatusComplete(fingerprint.result);\n }}\n onErrorFingerprint={fingerprint => {\n /**\n * Called when fingerprint times-out (which is still a valid scenario)...\n */\n const timeoutObject: ErrorCodeObject = {\n errorCode: fingerprint.errorCode, // 'timeout'\n message: `${THREEDS2_FINGERPRINT}: ${fingerprint.errorCode}`\n };\n\n this.setStatusComplete(fingerprint.result, timeoutObject); // fingerprint.result = threeDSCompInd: 'N'\n }}\n showSpinner={showSpinner}\n {...fingerPrintData}\n onActionHandled={this.props.onActionHandled}\n onFormSubmit={this.onFormSubmit}\n />\n );\n }\n\n return null;\n }\n}\n\nexport default PrepareFingerprint3DS2;\n"],"names":["PrepareFingerprint3DS2","Component","componentDidMount","isErrorObject","this","state","fingerPrintData","shouldAllowHttpDomains","props","environment","_environmentUrls","api","includes","threeDSMethodURL","threeDSMethodNotificationURL","postMessageDomain","threeDSServerTransID","isValidHttpUrl","setStatusComplete","threeDSCompInd","errorCode","ErrorEventCode","THREEDS2_TOKEN_IS_MISSING_THREEDSMETHODURL","message","THREEDS2_FINGERPRINT_ERROR","console","debug","hasValid3DSMethodNotificationURL","hasValidPostMessageDomain","hasTransServerID","length","THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS","setState","status","errorMsg","error","MISSING_TOKEN_IN_ACTION_MSG","THREEDS2_ACTION_IS_MISSING_TOKEN","THREEDS2_TOKEN_DECODE_OR_PARSING_FAILED","resultObj","errorCodeObject","data","isMDFlow","createOldFingerprintResolveData","createFingerprintResolveData","dataKey","paymentData","event","finalResObject","errorTypeAndCode","code","TIMEOUT","THREEDS2_TIMEOUT","errorType","ErrorEventType","threeDS2","AnalyticsErrorEvent","component","type","onSubmitAnalytics","result","AnalyticsLogEvent","LogEventType","subType","LogEventSubtype","fingerprintCompleted","THREEDS2_NUM","onComplete","render","showSpinner","h","DoFingerprint3DS2","onCompleteFingerprint","fingerprint","onErrorFingerprint","timeoutObject","THREEDS2_FINGERPRINT","onActionHandled","onFormSubmit","constructor","super","_define_property","msg","fingerprintDataSentWeb","token","notificationURL","prepareFingerPrintData","success","defaultProps","onError"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PrepareFingerprint3DS2.js","sources":["../../../../../../src/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport DoFingerprint3DS2 from './DoFingerprint3DS2';\nimport { createFingerprintResolveData, isErrorObject, prepareFingerPrintData } from '../utils';\nimport { PrepareFingerprint3DS2Props, PrepareFingerprint3DS2State } from './types';\nimport { FingerPrintData, ResultObject, ErrorCodeObject, FingerprintResolveData } from '../../types';\nimport { ErrorObject } from '../../../../core/Errors/types';\nimport { isValidHttpUrl } from '../../../../utils/isValidURL';\nimport { THREEDS2_FINGERPRINT, THREEDS2_FINGERPRINT_ERROR, THREEDS2_NUM, MISSING_TOKEN_IN_ACTION_MSG, TIMEOUT } from '../../constants';\nimport { AnalyticsLogEvent, LogEventSubtype, LogEventType } from '../../../../core/Analytics/events/AnalyticsLogEvent';\nimport { AbstractAnalyticsEvent } from '../../../../core/Analytics/events/AbstractAnalyticsEvent';\nimport { AnalyticsErrorEvent, ErrorEventCode, ErrorEventType } from '../../../../core/Analytics/events/AnalyticsErrorEvent';\n\nclass PrepareFingerprint3DS2 extends Component<PrepareFingerprint3DS2Props, PrepareFingerprint3DS2State> {\n public static readonly type = 'scheme';\n\n public static readonly defaultProps = {\n onComplete: () => {},\n onError: () => {},\n paymentData: '',\n showSpinner: true,\n isMDFlow: false\n };\n\n constructor(props) {\n super(props);\n const { token, notificationURL } = this.props; // See comments on prepareFingerPrintData regarding notificationURL\n\n if (token) {\n const fingerPrintData: FingerPrintData | ErrorObject = prepareFingerPrintData({ token, notificationURL });\n\n this.state = {\n status: 'init',\n fingerPrintData: fingerPrintData as FingerPrintData\n };\n } else {\n // Will be picked up in componentDidMount\n this.state = { fingerPrintData: { success: false, error: MISSING_TOKEN_IN_ACTION_MSG } };\n\n console.debug(`${THREEDS2_FINGERPRINT_ERROR}: ${MISSING_TOKEN_IN_ACTION_MSG}`);\n }\n }\n\n public onFormSubmit = (msg: string) => {\n const event = new AnalyticsLogEvent({\n component: this.props.type,\n type: LogEventType.threeDS2,\n subType: LogEventSubtype.fingerprintDataSentWeb,\n message: msg\n });\n\n this.props.onSubmitAnalytics(event);\n };\n\n componentDidMount() {\n const hasFingerPrintData = !isErrorObject(this.state.fingerPrintData);\n\n if (hasFingerPrintData) {\n const shouldAllowHttpDomains =\n /** Allow http urls if in development and testing against localhost:8080 */\n (process.env.NODE_ENV === 'development' && process.env.__CLIENT_ENV__?.includes('localhost:8080')) ||\n /**\n * Allows the checkoutshopper demo on localhost:8080 to work -\n * requires a configuration in localhost of environment: 'test', _environmentUrls: {api: 'http://localhost:8080/'}\n */\n (this.props.environment === 'test' && this.props._environmentUrls?.api?.includes('http://localhost:8080'));\n\n /**\n * Check the structure of the created fingerPrintData\n */\n const { threeDSMethodURL, threeDSMethodNotificationURL, postMessageDomain, threeDSServerTransID } = this.state\n .fingerPrintData as FingerPrintData;\n\n const hasValid3DSMethodURL = isValidHttpUrl(threeDSMethodURL, shouldAllowHttpDomains);\n\n // Only render component if we have a threeDSMethodURL. Otherwise, exit with threeDSCompInd: 'U'\n if (!hasValid3DSMethodURL) {\n this.setStatusComplete(\n { threeDSCompInd: 'U' },\n {\n errorCode: ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_THREEDSMETHODURL,\n message: `${THREEDS2_FINGERPRINT_ERROR}: Decoded token is missing a valid threeDSMethodURL property`\n }\n );\n\n /**\n * NOTE: we can now use this.props.isMDFlow to decide if we want to send any of these errors to the onError handler\n * - this is problematic in the regular flow since merchants tend to treat any calls to their onError handler as 'fatal',\n * but in the MDFlow we control what the onError handler does.\n */\n // if (this.props.isMDFlow) {}\n\n console.debug('### PrepareFingerprint3DS2::exiting:: no valid threeDSMethodURL');\n return;\n }\n\n const hasValid3DSMethodNotificationURL = isValidHttpUrl(threeDSMethodNotificationURL, shouldAllowHttpDomains);\n const hasValidPostMessageDomain = isValidHttpUrl(postMessageDomain, shouldAllowHttpDomains);\n const hasTransServerID = threeDSServerTransID?.length;\n\n if (!hasValid3DSMethodNotificationURL || !hasValidPostMessageDomain || !hasTransServerID) {\n /**\n * NOTE: EMVCo_3DS_CoreSpec_v2.3.1_20220831.pdf states that we should return: threeDSCompInd: 'N'\n * when the fingerprinting process \"Did not run or did not successfully complete\"\n */\n this.setStatusComplete(\n { threeDSCompInd: 'N' },\n {\n errorCode: ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS,\n message: `${THREEDS2_FINGERPRINT_ERROR}: Decoded token is missing one or more of the following properties (threeDSMethodNotificationURL | postMessageDomain | threeDSServerTransID)`\n }\n );\n\n console.debug(\n '### PrepareFingerprint3DS2::exiting:: Decoded token is missing one or more of the following properties (threeDSMethodNotificationURL | postMessageDomain | threeDSServerTransID)'\n );\n\n return;\n }\n\n // Proceed to allow component to render\n this.setState({ status: 'retrievingFingerPrint' });\n //\n } else {\n // Only render component if we have fingerPrintData. Otherwise, complete with threeDSCompInd: 'N'\n\n const errorMsg: string = (this.state.fingerPrintData as ErrorObject).error;\n\n const errorCode = errorMsg.includes(MISSING_TOKEN_IN_ACTION_MSG)\n ? ErrorEventCode.THREEDS2_ACTION_IS_MISSING_TOKEN\n : ErrorEventCode.THREEDS2_TOKEN_DECODE_OR_PARSING_FAILED;\n\n this.setStatusComplete(\n { threeDSCompInd: 'N' },\n {\n errorCode,\n message: `${THREEDS2_FINGERPRINT_ERROR}: ${errorMsg}` // can be: 'Missing \"token\" property from threeDS2 action', 'not base64', 'malformed URI sequence' or 'Could not JSON parse token'\n }\n );\n\n console.debug('### PrepareFingerprint3DS2:: token does not exist or could not be base64 decoded &/or JSON.parsed');\n }\n }\n\n setStatusComplete(resultObj: ResultObject, errorCodeObject: ErrorCodeObject = null) {\n this.setState({ status: 'complete' }, () => {\n const data: FingerprintResolveData = createFingerprintResolveData(this.props.dataKey, resultObj, this.props.paymentData);\n\n let event: AbstractAnalyticsEvent;\n\n /** Are we in an error scenario? If so, submit analytics about it */\n const finalResObject = errorCodeObject ? errorCodeObject : resultObj;\n if (finalResObject.errorCode) {\n const errorTypeAndCode = {\n code: finalResObject.errorCode === TIMEOUT ? ErrorEventCode.THREEDS2_TIMEOUT : finalResObject.errorCode,\n errorType: ErrorEventType.threeDS2\n };\n\n /**\n * Timeout or data parsing problems:\n *\n * (threeDSCompInd:\"U\"):\n * - Decoded token is missing a valid threeDSMethodURL property,\n * or, (threeDSCompInd:\"N\"):\n * - Fingerprint process has timed out,\n * also, (threeDSCompInd:\"N\"):\n * - Missing \"token\" property from threeDS2 action\n * - or, decoded token is missing one or more of the following properties (threeDSMethodNotificationURL | postMessageDomain | threeDSServerTransID)\n * - or, token could not be base64 decoded &/or JSON.parsed\n */\n\n event = new AnalyticsErrorEvent({\n component: this.props.type,\n message: (finalResObject as ErrorCodeObject).message,\n ...errorTypeAndCode\n });\n\n // Send error to analytics endpoint\n this.props.onSubmitAnalytics(event);\n }\n\n /** Calculate \"result\" for analytics */\n let result: string;\n\n switch (resultObj?.threeDSCompInd) {\n case 'Y':\n result = 'success';\n break;\n case 'N': {\n if (!errorCodeObject) {\n result = 'failed'; // 'failed' is the result returned from the threeDSMethodURL\n } else {\n result = errorCodeObject.errorCode === TIMEOUT ? TIMEOUT : 'failedInternal'; // timed-out; or, 'failed' as a result of internal checks\n }\n break;\n }\n case 'U':\n result = 'noThreeDSMethodURL';\n break;\n default:\n }\n\n /**\n * The fingerprint process is completed, one way or another.\n * The resultObj will be {threeDSCompInd:\"Y\"} in the case of success,\n * else {threeDSCompInd:\"U\"} or {threeDSCompInd:\"N\"} - if we've had some kind of timeout or data parsing problem (as described above)\n */\n\n event = new AnalyticsLogEvent({\n component: this.props.type,\n type: LogEventType.threeDS2,\n subType: LogEventSubtype.fingerprintCompleted,\n message: `${THREEDS2_NUM} fingerprinting has completed`,\n result\n });\n // Send log to analytics endpoint\n this.props.onSubmitAnalytics(event);\n\n /**\n * Equals call to callSubmit3DS2Fingerprint (except for in 3DS2InMDFlow)\n */\n this.props.onComplete(data);\n });\n }\n\n render({ showSpinner }, { status, fingerPrintData }) {\n if (status === 'retrievingFingerPrint') {\n return (\n <DoFingerprint3DS2\n onCompleteFingerprint={fingerprint => {\n this.setStatusComplete(fingerprint.result);\n }}\n onErrorFingerprint={fingerprint => {\n /**\n * Called when fingerprint times-out (which is still a valid scenario)...\n */\n const timeoutObject: ErrorCodeObject = {\n errorCode: fingerprint.errorCode, // 'timeout'\n message: `${THREEDS2_FINGERPRINT}: ${fingerprint.errorCode}`\n };\n\n this.setStatusComplete(fingerprint.result, timeoutObject); // fingerprint.result = threeDSCompInd: 'N'\n }}\n showSpinner={showSpinner}\n {...fingerPrintData}\n onActionHandled={this.props.onActionHandled}\n onFormSubmit={this.onFormSubmit}\n />\n );\n }\n\n return null;\n }\n}\n\nexport default PrepareFingerprint3DS2;\n"],"names":["PrepareFingerprint3DS2","Component","componentDidMount","isErrorObject","this","state","fingerPrintData","shouldAllowHttpDomains","props","environment","_environmentUrls","api","includes","threeDSMethodURL","threeDSMethodNotificationURL","postMessageDomain","threeDSServerTransID","isValidHttpUrl","setStatusComplete","threeDSCompInd","errorCode","ErrorEventCode","THREEDS2_TOKEN_IS_MISSING_THREEDSMETHODURL","message","THREEDS2_FINGERPRINT_ERROR","console","debug","hasValid3DSMethodNotificationURL","hasValidPostMessageDomain","hasTransServerID","length","THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS","setState","status","errorMsg","error","MISSING_TOKEN_IN_ACTION_MSG","THREEDS2_ACTION_IS_MISSING_TOKEN","THREEDS2_TOKEN_DECODE_OR_PARSING_FAILED","resultObj","errorCodeObject","data","createFingerprintResolveData","dataKey","paymentData","event","finalResObject","errorTypeAndCode","code","TIMEOUT","THREEDS2_TIMEOUT","errorType","ErrorEventType","threeDS2","AnalyticsErrorEvent","component","type","onSubmitAnalytics","result","AnalyticsLogEvent","LogEventType","subType","LogEventSubtype","fingerprintCompleted","THREEDS2_NUM","onComplete","render","showSpinner","h","DoFingerprint3DS2","onCompleteFingerprint","fingerprint","onErrorFingerprint","timeoutObject","THREEDS2_FINGERPRINT","onActionHandled","onFormSubmit","constructor","super","_define_property","msg","fingerprintDataSentWeb","token","notificationURL","prepareFingerPrintData","success","defaultProps","onError","isMDFlow"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{CHALLENGE_WINDOW_SIZES as e,DEFAULT_CHALLENGE_WINDOW_SIZE as t}from"../constants.js";import{getOrigin as r}from"../../../utils/getOrigin.js";import
|
|
1
|
+
import{CHALLENGE_WINDOW_SIZES as e,DEFAULT_CHALLENGE_WINDOW_SIZE as t}from"../constants.js";import{getOrigin as r}from"../../../utils/getOrigin.js";import n from"../../../utils/base64.js";const s=e=>"success"in e&&!e.success,o=e=>{const t=n.decode(e);if(t.success)try{return JSON.parse(t.data)}catch(e){return{success:!1,error:"Could not JSON parse token"}}return t},a=e=>{if(!e||!Object.keys(e).length)throw new Error("No (populated) data object to encode");return n.encode(JSON.stringify(e))},i=r=>{const n=1===r.length?`0${r}`:r;return Object.prototype.hasOwnProperty.call(e,n)?n:t},c=t=>e[i(t)],p=({token:e,size:t})=>{const n=o(e);if(s(n))return n;const{acsTransID:a,acsURL:p,messageVersion:h,threeDSNotificationURL:u,threeDSServerTransID:l}=n,D=r(u);return{acsURL:p,cReqData:{acsTransID:a,messageVersion:h,threeDSServerTransID:l,messageType:"CReq",challengeWindowSize:i(t)},iframeSizeArr:c(t),postMessageDomain:D}},h=({token:e,notificationURL:t})=>{const n=o(e);if(s(n))return n;const{threeDSMethodNotificationURL:a,threeDSMethodUrl:i,threeDSServerTransID:c}=n,p=t||a;return{threeDSServerTransID:c,threeDSMethodURL:i,threeDSMethodNotificationURL:p,postMessageDomain:r(p)}},u=(e,t,r)=>({data:{[e]:a({threeDSCompInd:t.threeDSCompInd}),paymentData:r}}),l=(e,t,r)=>({data:{details:{[e]:a({transStatus:t,authorisationToken:r})}}}),D=e=>{let t=window.btoa(e).split("=")[0];return t=t.replace(/\+/g,"-"),t=t.replace(/\//g,"_"),t},S=(e,t)=>"fingerprint"===e?{showSpinner:!t.isDropin,statusType:"loading",...t.elementRef&&{elementRef:t.elementRef}}:{statusType:"custom",i18n:t.i18n,elementRef:t.elementRef};export{l as createChallengeResolveData,u as createFingerprintResolveData,o as decodeAndParseToken,D as encodeBase64URL,a as encodeObject,S as get3DS2FlowProps,c as getChallengeWindowSize,s as isErrorObject,p as prepareChallengeData,h as prepareFingerPrintData,i as validateChallengeWindowSize};
|
|
2
2
|
//# sourceMappingURL=utils.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../../../../src/components/ThreeDS2/components/utils.ts"],"sourcesContent":["import { CHALLENGE_WINDOW_SIZES, DEFAULT_CHALLENGE_WINDOW_SIZE } from '../constants';\nimport { getOrigin } from '../../../utils/getOrigin';\nimport base64 from '../../../utils/base64';\nimport type {\n ChallengeData,\n ThreeDS2Token,\n FingerPrintData,\n ResultObject,\n FingerprintResolveData,\n ChallengeResolveData,\n ThreeDS2FlowProps,\n ThreeDS2ActionProps\n} from '../types';\nimport type { DecodeObject } from '../../../types/global-types';\nimport type { ErrorObject } from '../../../core/Errors/types';\n\n/**\n * Check if we have been passed an ErrorObject because either base64 decoding or JSON.parse failed\n * @param obj -\n */\nexport const isErrorObject = (obj: ErrorObject | ThreeDS2Token): boolean => {\n return 'success' in obj && !obj.success;\n};\n\nexport const decodeAndParseToken = (token: string): ThreeDS2Token | ErrorObject => {\n const decodedToken: DecodeObject = base64.decode(token);\n if (decodedToken.success) {\n try {\n return JSON.parse(decodedToken.data) as ThreeDS2Token;\n } catch (e) {\n return {\n success: false,\n error: 'Could not JSON parse token'\n };\n }\n }\n\n // base64.decode failed - object will contain error msg: 'not base64' or 'malformed URI sequence'\n return decodedToken as ErrorObject;\n};\n\n/**\n * Performs JSON.stringify on passed object & and base64 encodes result\n * @param obj -\n * @returns encoded result\n */\nexport const encodeObject = obj => {\n if (!obj || !Object.keys(obj).length) {\n throw new Error('No (populated) data object to encode');\n }\n return base64.encode(JSON.stringify(obj));\n};\n\n/**\n * Accepts a size string for the challenge window & returns it if it is valid else returns a default value\n * @param sizeStr - the size string to check the validity of\n * @returns a valid size string\n */\nexport const validateChallengeWindowSize = (sizeStr: string): string => {\n const sizeString = sizeStr.length === 1 ? `0${sizeStr}` : sizeStr;\n const hasSize = Object.prototype.hasOwnProperty.call(CHALLENGE_WINDOW_SIZES, sizeString);\n return hasSize ? sizeString : DEFAULT_CHALLENGE_WINDOW_SIZE;\n};\n\n/**\n * Accepts a size string for the challenge window & returns the corresponding array of w/h values\n * @param sizeStr -\n */\nexport const getChallengeWindowSize = (sizeStr: string): string[] => CHALLENGE_WINDOW_SIZES[validateChallengeWindowSize(sizeStr)];\n\n/**\n * prepareChallengeData\n *\n * Requires an object containing the challenge parameters:\n * @param token - challengeToken string received from /submitThreeDS2Fingerprint, /details or /payments call: contains acsTransID, acsURL, messageVersion,\n * threeDSNotificationURL and threeDSServerTransID\n * @param size - one of five possible challenge window sizes\n */\nexport const prepareChallengeData = ({ token, size }): ChallengeData | ErrorObject => {\n const decodedChallengeToken = decodeAndParseToken(token);\n\n if (isErrorObject(decodedChallengeToken)) {\n return decodedChallengeToken as ErrorObject;\n }\n\n const { acsTransID, acsURL, messageVersion, threeDSNotificationURL, threeDSServerTransID } = decodedChallengeToken as ThreeDS2Token;\n const notificationURLOrigin = getOrigin(threeDSNotificationURL);\n\n return {\n acsURL,\n cReqData: {\n acsTransID,\n messageVersion,\n threeDSServerTransID,\n messageType: 'CReq',\n challengeWindowSize: validateChallengeWindowSize(size)\n },\n iframeSizeArr: getChallengeWindowSize(size),\n postMessageDomain: notificationURLOrigin\n } as ChallengeData;\n};\n\n/**\n * prepareFingerPrintData\n *\n * Requires an object containing the fingerprint parameters:\n * @param token - fingerprintToken string received from /payments call: contains threeDSMethodNotificationURL, threeDSMethodUrl and\n * threeDSServerTransID\n * @param notificationURL - the URL that the final notification is expected to be postMessaged from.\n *\n * NOTE: we don't expect merchants to alter the default by passing in a notificationURL of their own via props;\n * and if 3DS2 is being done via createFromAction or handleAction we won't accept it.\n * But if the merchant is using checkout.create('threeDS2DeviceFingerprint') we still support the fact that they might want to set their own\n * notificationURL (aka threeDSMethodNotificationURL)\n */\nexport const prepareFingerPrintData = ({ token, notificationURL }): FingerPrintData | ErrorObject => {\n const decodedFingerPrintToken = decodeAndParseToken(token);\n\n if (isErrorObject(decodedFingerPrintToken)) {\n return decodedFingerPrintToken as ErrorObject;\n }\n\n const { threeDSMethodNotificationURL, threeDSMethodUrl: threeDSMethodURL, threeDSServerTransID } = decodedFingerPrintToken as ThreeDS2Token;\n const receivedNotificationURL = notificationURL || threeDSMethodNotificationURL;\n const notificationURLOrigin = getOrigin(receivedNotificationURL);\n\n return {\n threeDSServerTransID,\n threeDSMethodURL,\n threeDSMethodNotificationURL: receivedNotificationURL,\n postMessageDomain: notificationURLOrigin\n } as FingerPrintData;\n};\n\nexport const createFingerprintResolveData = (dataKey: string, resultObj: ResultObject, paymentData: string): FingerprintResolveData => ({\n data: {\n [dataKey]: encodeObject({ threeDSCompInd: resultObj.threeDSCompInd }),\n paymentData\n }\n});\n\n// Old 3DS2 flow\nexport const createOldFingerprintResolveData = (dataKey: string, resultObj: ResultObject, paymentData: string): any => ({\n data: {\n details: { 'threeds2.fingerprint': encodeObject(resultObj) },\n paymentData\n }\n});\n\nexport const createChallengeResolveData = (dataKey: string, transStatus: string, authorisationToken: string): ChallengeResolveData => ({\n data: {\n details: { [dataKey]: encodeObject({ transStatus, authorisationToken }) }\n }\n});\n\n// Needed for old 3DS2 flow & threeds2InMDFlow\nexport const createOldChallengeResolveData = (dataKey: string, transStatus: string, authorisationToken: string): any => ({\n data: {\n details: { 'threeds2.challengeResult': encodeObject({ transStatus }) },\n paymentData: authorisationToken\n }\n});\n\n/**\n *\n * Takes a string and encodes it as a base64url string\n * (https://en.wikipedia.org/wiki/Base64#URL_applications)\n * (See also https://tools.ietf.org/html/rfc7515)\n *\n * @example\n * ```\n * const jsonStr = JSON.stringify( {name:'john', surname:'smith'} );\n * const base64url = encodeBase64URL(jsonStr);\n * ```\n *\n * @param dataStr - data, as a string, to be encoded\n *\n * @returns base64URL - a base64url encoded string\n */\nexport const encodeBase64URL = (dataStr: string): string => {\n const base64Data = window.btoa(dataStr);\n let base64url = base64Data.split('=')[0]; // Remove any trailing '='s\n\n base64url = base64url.replace(/\\+/g, '-'); // 62nd char of encoding\n base64url = base64url.replace(/\\//g, '_'); // 63rd char of encoding\n\n return base64url;\n};\n\n/**\n * Add props specifically needed for the type of 3DS2 flow: fingerprint or challenge\n *\n * @param actionSubtype - 3DS2 flow type: fingerprint or challenge\n * @param props - object from which to extract particular properties\n */\nexport const get3DS2FlowProps = (actionSubtype: string, props: ThreeDS2ActionProps): ThreeDS2FlowProps => {\n if (actionSubtype === 'fingerprint') {\n return {\n showSpinner: !props.isDropin,\n statusType: 'loading',\n // elementRef exists when the fingerprint component is created from the Dropin\n ...(props.elementRef && { elementRef: props.elementRef })\n };\n }\n\n // Challenge\n return {\n statusType: 'custom',\n i18n: props.i18n,\n elementRef: props.elementRef\n };\n};\n"],"names":["isErrorObject","obj","success","decodeAndParseToken","token","decodedToken","base64","decode","JSON","parse","data","e","error","encodeObject","Object","keys","length","Error","encode","stringify","validateChallengeWindowSize","sizeStr","sizeString","prototype","hasOwnProperty","call","CHALLENGE_WINDOW_SIZES","DEFAULT_CHALLENGE_WINDOW_SIZE","getChallengeWindowSize","prepareChallengeData","size","decodedChallengeToken","acsTransID","acsURL","messageVersion","threeDSNotificationURL","threeDSServerTransID","notificationURLOrigin","getOrigin","cReqData","messageType","challengeWindowSize","iframeSizeArr","postMessageDomain","prepareFingerPrintData","notificationURL","decodedFingerPrintToken","threeDSMethodNotificationURL","threeDSMethodUrl","threeDSMethodURL","receivedNotificationURL","createFingerprintResolveData","dataKey","resultObj","paymentData","threeDSCompInd","createOldFingerprintResolveData","details","createChallengeResolveData","transStatus","authorisationToken","createOldChallengeResolveData","encodeBase64URL","dataStr","base64url","window","btoa","split","replace","get3DS2FlowProps","actionSubtype","props","showSpinner","isDropin","statusType","elementRef","i18n"],"mappings":"4LAoBO,MAAMA,EAAiBC,GACnB,YAAaA,IAAQA,EAAIC,QAGvBC,EAAuBC,IAChC,MAAMC,EAA6BC,EAAOC,OAAOH,GACjD,GAAIC,EAAaH,QACb,IACI,OAAOM,KAAKC,MAAMJ,EAAaK,KACnC,CAAE,MAAOC,GACL,MAAO,CACHT,SAAS,EACTU,MAAO,6BAEf,CAIJ,OAAOP,GAQEQ,EAAeZ,IACxB,IAAKA,IAAQa,OAAOC,KAAKd,GAAKe,OAC1B,MAAM,IAAIC,MAAM,wCAEpB,OAAOX,EAAOY,OAAOV,KAAKW,UAAUlB,KAQ3BmB,EAA+BC,IACxC,MAAMC,EAAgC,IAAnBD,EAAQL,OAAe,IAAIK,IAAYA,EAE1D,OADgBP,OAAOS,UAAUC,eAAeC,KAAKC,EAAwBJ,GAC5DA,EAAaK,GAOrBC,EAA0BP,GAA8BK,EAAuBN,EAA4BC,IAU3GQ,EAAuB,EAAGzB,QAAO0B,WAC1C,MAAMC,EAAwB5B,EAAoBC,GAElD,GAAIJ,EAAc+B,GACd,OAAOA,EAGX,MAAMC,WAAEA,EAAUC,OAAEA,EAAMC,eAAEA,EAAcC,uBAAEA,EAAsBC,qBAAEA,GAAyBL,EACvFM,EAAwBC,EAAUH,GAExC,MAAO,CACHF,SACAM,SAAU,CACNP,aACAE,iBACAE,uBACAI,YAAa,OACbC,oBAAqBrB,EAA4BU,IAErDY,cAAed,EAAuBE,GACtCa,kBAAmBN,IAiBdO,EAAyB,EAAGxC,QAAOyC,sBAC5C,MAAMC,EAA0B3C,EAAoBC,GAEpD,GAAIJ,EAAc8C,GACd,OAAOA,EAGX,MAAMC,6BAAEA,EAA8BC,iBAAkBC,EAAgBb,qBAAEA,GAAyBU,EAC7FI,EAA0BL,GAAmBE,EAGnD,MAAO,CACHX,uBACAa,mBACAF,6BAA8BG,EAC9BP,kBAN0BL,EAAUY,KAU/BC,EAA+B,CAACC,EAAiBC,EAAyBC,MACnF5C,KAAM,CACF0C,CAACA,GAAUvC,EAAa,CAAE0C,eAAgBF,EAAUE,iBACpDD,iBAKKE,EAAkC,CAACJ,EAAiBC,EAAyBC,MACtF5C,KAAM,CACF+C,QAAS,CAAE,uBAAwB5C,EAAawC,IAChDC,iBAIKI,EAA6B,CAACN,EAAiBO,EAAqBC,MAC7ElD,KAAM,CACF+C,QAAS,CAAEL,CAACA,GAAUvC,EAAa,CAAE8C,cAAaC,2BAK7CC,EAAgC,CAACT,EAAiBO,EAAqBC,MAChFlD,KAAM,CACF+C,QAAS,CAAE,2BAA4B5C,EAAa,CAAE8C,iBACtDL,YAAaM,KAoBRE,EAAmBC,IAE5B,IAAIC,EADeC,OAAOC,KAAKH,GACJI,MAAM,KAAK,GAKtC,OAHAH,EAAYA,EAAUI,QAAQ,MAAO,KACrCJ,EAAYA,EAAUI,QAAQ,MAAO,KAE9BJ,GASEK,EAAmB,CAACC,EAAuBC,IAC9B,gBAAlBD,EACO,CACHE,aAAcD,EAAME,SACpBC,WAAY,aAERH,EAAMI,YAAc,CAAEA,WAAYJ,EAAMI,aAK7C,CACHD,WAAY,SACZE,KAAML,EAAMK,KACZD,WAAYJ,EAAMI"}
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../../src/components/ThreeDS2/components/utils.ts"],"sourcesContent":["import { CHALLENGE_WINDOW_SIZES, DEFAULT_CHALLENGE_WINDOW_SIZE } from '../constants';\nimport { getOrigin } from '../../../utils/getOrigin';\nimport base64 from '../../../utils/base64';\nimport type {\n ChallengeData,\n ThreeDS2Token,\n FingerPrintData,\n ResultObject,\n FingerprintResolveData,\n ChallengeResolveData,\n ThreeDS2FlowProps,\n ThreeDS2ActionProps\n} from '../types';\nimport type { DecodeObject } from '../../../types/global-types';\nimport type { ErrorObject } from '../../../core/Errors/types';\n\n/**\n * Check if we have been passed an ErrorObject because either base64 decoding or JSON.parse failed\n * @param obj -\n */\nexport const isErrorObject = (obj: ErrorObject | ThreeDS2Token): boolean => {\n return 'success' in obj && !obj.success;\n};\n\nexport const decodeAndParseToken = (token: string): ThreeDS2Token | ErrorObject => {\n const decodedToken: DecodeObject = base64.decode(token);\n if (decodedToken.success) {\n try {\n return JSON.parse(decodedToken.data) as ThreeDS2Token;\n } catch (e) {\n return {\n success: false,\n error: 'Could not JSON parse token'\n };\n }\n }\n\n // base64.decode failed - object will contain error msg: 'not base64' or 'malformed URI sequence'\n return decodedToken as ErrorObject;\n};\n\n/**\n * Performs JSON.stringify on passed object & and base64 encodes result\n * @param obj -\n * @returns encoded result\n */\nexport const encodeObject = obj => {\n if (!obj || !Object.keys(obj).length) {\n throw new Error('No (populated) data object to encode');\n }\n return base64.encode(JSON.stringify(obj));\n};\n\n/**\n * Accepts a size string for the challenge window & returns it if it is valid else returns a default value\n * @param sizeStr - the size string to check the validity of\n * @returns a valid size string\n */\nexport const validateChallengeWindowSize = (sizeStr: string): string => {\n const sizeString = sizeStr.length === 1 ? `0${sizeStr}` : sizeStr;\n const hasSize = Object.prototype.hasOwnProperty.call(CHALLENGE_WINDOW_SIZES, sizeString);\n return hasSize ? sizeString : DEFAULT_CHALLENGE_WINDOW_SIZE;\n};\n\n/**\n * Accepts a size string for the challenge window & returns the corresponding array of w/h values\n * @param sizeStr -\n */\nexport const getChallengeWindowSize = (sizeStr: string): string[] => CHALLENGE_WINDOW_SIZES[validateChallengeWindowSize(sizeStr)];\n\n/**\n * prepareChallengeData\n *\n * Requires an object containing the challenge parameters:\n * @param token - challengeToken string received from /submitThreeDS2Fingerprint, /details or /payments call: contains acsTransID, acsURL, messageVersion,\n * threeDSNotificationURL and threeDSServerTransID\n * @param size - one of five possible challenge window sizes\n */\nexport const prepareChallengeData = ({ token, size }): ChallengeData | ErrorObject => {\n const decodedChallengeToken = decodeAndParseToken(token);\n\n if (isErrorObject(decodedChallengeToken)) {\n return decodedChallengeToken as ErrorObject;\n }\n\n const { acsTransID, acsURL, messageVersion, threeDSNotificationURL, threeDSServerTransID } = decodedChallengeToken as ThreeDS2Token;\n const notificationURLOrigin = getOrigin(threeDSNotificationURL);\n\n return {\n acsURL,\n cReqData: {\n acsTransID,\n messageVersion,\n threeDSServerTransID,\n messageType: 'CReq',\n challengeWindowSize: validateChallengeWindowSize(size)\n },\n iframeSizeArr: getChallengeWindowSize(size),\n postMessageDomain: notificationURLOrigin\n } as ChallengeData;\n};\n\n/**\n * prepareFingerPrintData\n *\n * Requires an object containing the fingerprint parameters:\n * @param token - fingerprintToken string received from /payments call: contains threeDSMethodNotificationURL, threeDSMethodUrl and\n * threeDSServerTransID\n * @param notificationURL - the URL that the final notification is expected to be postMessaged from.\n *\n * NOTE: we don't expect merchants to alter the default by passing in a notificationURL of their own via props;\n * and if 3DS2 is being done via createFromAction or handleAction we won't accept it.\n * But if the merchant is using checkout.create('threeDS2DeviceFingerprint') we still support the fact that they might want to set their own\n * notificationURL (aka threeDSMethodNotificationURL)\n */\nexport const prepareFingerPrintData = ({ token, notificationURL }): FingerPrintData | ErrorObject => {\n const decodedFingerPrintToken = decodeAndParseToken(token);\n\n if (isErrorObject(decodedFingerPrintToken)) {\n return decodedFingerPrintToken as ErrorObject;\n }\n\n const { threeDSMethodNotificationURL, threeDSMethodUrl: threeDSMethodURL, threeDSServerTransID } = decodedFingerPrintToken as ThreeDS2Token;\n const receivedNotificationURL = notificationURL || threeDSMethodNotificationURL;\n const notificationURLOrigin = getOrigin(receivedNotificationURL);\n\n return {\n threeDSServerTransID,\n threeDSMethodURL,\n threeDSMethodNotificationURL: receivedNotificationURL,\n postMessageDomain: notificationURLOrigin\n } as FingerPrintData;\n};\n\nexport const createFingerprintResolveData = (dataKey: string, resultObj: ResultObject, paymentData: string): FingerprintResolveData => ({\n data: {\n [dataKey]: encodeObject({ threeDSCompInd: resultObj.threeDSCompInd }),\n paymentData\n }\n});\n\nexport const createChallengeResolveData = (dataKey: string, transStatus: string, authorisationToken: string): ChallengeResolveData => ({\n data: {\n details: { [dataKey]: encodeObject({ transStatus, authorisationToken }) }\n }\n});\n\n/**\n *\n * Takes a string and encodes it as a base64url string\n * (https://en.wikipedia.org/wiki/Base64#URL_applications)\n * (See also https://tools.ietf.org/html/rfc7515)\n *\n * @example\n * ```\n * const jsonStr = JSON.stringify( {name:'john', surname:'smith'} );\n * const base64url = encodeBase64URL(jsonStr);\n * ```\n *\n * @param dataStr - data, as a string, to be encoded\n *\n * @returns base64URL - a base64url encoded string\n */\nexport const encodeBase64URL = (dataStr: string): string => {\n const base64Data = window.btoa(dataStr);\n let base64url = base64Data.split('=')[0]; // Remove any trailing '='s\n\n base64url = base64url.replace(/\\+/g, '-'); // 62nd char of encoding\n base64url = base64url.replace(/\\//g, '_'); // 63rd char of encoding\n\n return base64url;\n};\n\n/**\n * Add props specifically needed for the type of 3DS2 flow: fingerprint or challenge\n *\n * @param actionSubtype - 3DS2 flow type: fingerprint or challenge\n * @param props - object from which to extract particular properties\n */\nexport const get3DS2FlowProps = (actionSubtype: string, props: ThreeDS2ActionProps): ThreeDS2FlowProps => {\n if (actionSubtype === 'fingerprint') {\n return {\n showSpinner: !props.isDropin,\n statusType: 'loading',\n // elementRef exists when the fingerprint component is created from the Dropin\n ...(props.elementRef && { elementRef: props.elementRef })\n };\n }\n\n // Challenge\n return {\n statusType: 'custom',\n i18n: props.i18n,\n elementRef: props.elementRef\n };\n};\n"],"names":["isErrorObject","obj","success","decodeAndParseToken","token","decodedToken","base64","decode","JSON","parse","data","e","error","encodeObject","Object","keys","length","Error","encode","stringify","validateChallengeWindowSize","sizeStr","sizeString","prototype","hasOwnProperty","call","CHALLENGE_WINDOW_SIZES","DEFAULT_CHALLENGE_WINDOW_SIZE","getChallengeWindowSize","prepareChallengeData","size","decodedChallengeToken","acsTransID","acsURL","messageVersion","threeDSNotificationURL","threeDSServerTransID","notificationURLOrigin","getOrigin","cReqData","messageType","challengeWindowSize","iframeSizeArr","postMessageDomain","prepareFingerPrintData","notificationURL","decodedFingerPrintToken","threeDSMethodNotificationURL","threeDSMethodUrl","threeDSMethodURL","receivedNotificationURL","createFingerprintResolveData","dataKey","resultObj","paymentData","threeDSCompInd","createChallengeResolveData","transStatus","authorisationToken","details","encodeBase64URL","dataStr","base64url","window","btoa","split","replace","get3DS2FlowProps","actionSubtype","props","showSpinner","isDropin","statusType","elementRef","i18n"],"mappings":"4LAoBO,MAAMA,EAAiBC,GACnB,YAAaA,IAAQA,EAAIC,QAGvBC,EAAuBC,IAChC,MAAMC,EAA6BC,EAAOC,OAAOH,GACjD,GAAIC,EAAaH,QACb,IACI,OAAOM,KAAKC,MAAMJ,EAAaK,KACnC,CAAE,MAAOC,GACL,MAAO,CACHT,SAAS,EACTU,MAAO,6BAEf,CAIJ,OAAOP,GAQEQ,EAAeZ,IACxB,IAAKA,IAAQa,OAAOC,KAAKd,GAAKe,OAC1B,MAAM,IAAIC,MAAM,wCAEpB,OAAOX,EAAOY,OAAOV,KAAKW,UAAUlB,KAQ3BmB,EAA+BC,IACxC,MAAMC,EAAgC,IAAnBD,EAAQL,OAAe,IAAIK,IAAYA,EAE1D,OADgBP,OAAOS,UAAUC,eAAeC,KAAKC,EAAwBJ,GAC5DA,EAAaK,GAOrBC,EAA0BP,GAA8BK,EAAuBN,EAA4BC,IAU3GQ,EAAuB,EAAGzB,QAAO0B,WAC1C,MAAMC,EAAwB5B,EAAoBC,GAElD,GAAIJ,EAAc+B,GACd,OAAOA,EAGX,MAAMC,WAAEA,EAAUC,OAAEA,EAAMC,eAAEA,EAAcC,uBAAEA,EAAsBC,qBAAEA,GAAyBL,EACvFM,EAAwBC,EAAUH,GAExC,MAAO,CACHF,SACAM,SAAU,CACNP,aACAE,iBACAE,uBACAI,YAAa,OACbC,oBAAqBrB,EAA4BU,IAErDY,cAAed,EAAuBE,GACtCa,kBAAmBN,IAiBdO,EAAyB,EAAGxC,QAAOyC,sBAC5C,MAAMC,EAA0B3C,EAAoBC,GAEpD,GAAIJ,EAAc8C,GACd,OAAOA,EAGX,MAAMC,6BAAEA,EAA8BC,iBAAkBC,EAAgBb,qBAAEA,GAAyBU,EAC7FI,EAA0BL,GAAmBE,EAGnD,MAAO,CACHX,uBACAa,mBACAF,6BAA8BG,EAC9BP,kBAN0BL,EAAUY,KAU/BC,EAA+B,CAACC,EAAiBC,EAAyBC,MACnF5C,KAAM,CACF0C,CAACA,GAAUvC,EAAa,CAAE0C,eAAgBF,EAAUE,iBACpDD,iBAIKE,EAA6B,CAACJ,EAAiBK,EAAqBC,MAC7EhD,KAAM,CACFiD,QAAS,CAAEP,CAACA,GAAUvC,EAAa,CAAE4C,cAAaC,2BAoB7CE,EAAmBC,IAE5B,IAAIC,EADeC,OAAOC,KAAKH,GACJI,MAAM,KAAK,GAKtC,OAHAH,EAAYA,EAAUI,QAAQ,MAAO,KACrCJ,EAAYA,EAAUI,QAAQ,MAAO,KAE9BJ,GASEK,EAAmB,CAACC,EAAuBC,IAC9B,gBAAlBD,EACO,CACHE,aAAcD,EAAME,SACpBC,WAAY,aAERH,EAAMI,YAAc,CAAEA,WAAYJ,EAAMI,aAK7C,CACHD,WAAY,SACZE,KAAML,EAAMK,KACZD,WAAYJ,EAAMI"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import o from"./components/UPIComponent/UPIComponent.js";import{Await as n}from"../internal/Await/Await.js";import{QRLoader as
|
|
1
|
+
import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import o from"./components/UPIComponent/UPIComponent.js";import{Await as n}from"../internal/Await/Await.js";import{QRLoader as i}from"../internal/QRLoader/QRLoader.js";import"../../core/Context/CoreProvider.js";import"../../external/preact/hooks/dist/hooks.js";import"../../core/Errors/SRPanelContext.js";import"../internal/Button/Button.js";import"../internal/QRLoader/QRLoaderDetailsProvider.js";import{TxVariants as s}from"../tx-variants.js";import r from"../../utils/isMobile.js";import{UPI_MODE as a,UPI_COUNTDOWN_TIME as p}from"./constants.js";function m(t,e,o){return e in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t}class d extends e{formatProps(t){return{showOtherInsteadOfNumber:!r(),...t}}get isValid(){return this.state.isValid}formatData(){const{app:t}=this.state.data||{};return{paymentMethod:{type:this.paymentType,...this.paymentType===s.upi_intent&&t?.id&&{appId:t.id}}}}get brands(){const{showPaymentMethodItemImages:t}=this.props;return t?this.appsList.map(t=>({icon:t.icon,name:t.name})):[]}get paymentType(){return this.mode===a.QR_CODE?s.upi_qr:s.upi_intent}componentToRender(){const{type:e,url:r,paymentMethodType:a}=this.props,p=!!this.props.mandate;switch(e){case"qrCode":return t(i,{...this.props,qrCodeData:this.props.qrCodeData?encodeURIComponent(this.props.qrCodeData):void 0,type:s.upi_qr,brandLogo:this.props.brandLogo||this.icon,onComplete:this.onComplete,introduction:this.props.i18n?.get("upi.qrCodeWaitingMessage")??"",countdownTime:this.props.countdownTime,onActionHandled:this.onActionHandled,showAmount:!p});case"await":return t(n,{url:r,type:a??"",showCountdownTimer:!0,shouldRedirectAutomatically:!0,showAmount:!p,countdownTime:this.props.countdownTime,clientKey:this.props.clientKey??"",paymentData:this.props.paymentData,onActionHandled:this.onActionHandled,onError:this.props.onError,messageText:this.props.i18n?.get("upi.vpaWaitingMessage")??"",awaitText:this.props.i18n?.get("await.waitForConfirmation")??"",onComplete:this.onComplete,brandLogo:this.icon});default:return t(o,{setComponentRef:this.setComponentRef,payButton:this.payButton,onChange:this.setState,appsList:this.appsList,mode:this.mode,showPayButton:this.props.showPayButton??!0,mandate:this.props.mandate,onSubmitAnalytics:this.submitAnalytics})}}constructor(t,e){super(t,e),m(this,"mode",void 0),m(this,"appsList",void 0);const{apps:o=[]}=this.props,n=o.length>0;this.mode=r()&&n?a.INTENT:a.QR_CODE,this.appsList=o.map(t=>{const e=`upi/${t.id.toLowerCase()}`,o=this.core.modules.resources?.getImage()(e)??"";return{id:t.id,name:t.name,icon:o}})}}m(d,"type",s.upi),m(d,"txVariants",[s.upi,s.upi_qr,s.upi_intent]),m(d,"defaultProps",{showPaymentMethodItemImages:!0,countdownTime:p});export{d as default};
|
|
2
2
|
//# sourceMappingURL=UPI.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UPI.js","sources":["../../../../src/components/UPI/UPI.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport UPIComponent from './components/UPIComponent';\nimport { Await } from '../internal/Await';\nimport { QRLoader } from '../internal/QRLoader';\nimport { UPIAppList, UPIConfiguration, UpiMode, UpiPaymentData, UpiType } from './types';\nimport { TxVariants } from '../tx-variants';\nimport isMobile from '../../utils/isMobile';\nimport { UPI_COUNTDOWN_TIME, UPI_MODE } from './constants';\nimport { PaymentMethodBrand } from '../../types/global-types';\nimport { ICore } from '../../types';\n\n/**\n * For mobile:\n * We should show upi_intent depending on if `apps` are returned in /paymentMethods response.\n *\n * For non-mobile:\n * We should never show the upi_intent (ignore `apps` in /paymentMethods response)\n * Show upi_qr as default\n */\n\nclass UPI extends UIElement<UPIConfiguration> {\n public static readonly type = TxVariants.upi;\n public static readonly txVariants = [TxVariants.upi, TxVariants.upi_qr, TxVariants.upi_intent];\n private readonly mode: UpiMode;\n private readonly appsList: UPIAppList;\n\n protected static readonly defaultProps = {\n showPaymentMethodItemImages: true,\n countdownTime: UPI_COUNTDOWN_TIME\n };\n\n constructor(checkout: ICore, props: UPIConfiguration) {\n super(checkout, props);\n const { apps = [] } = this.props;\n const hasIntentApps = apps.length > 0;\n\n this.mode = isMobile() && hasIntentApps ? UPI_MODE.INTENT : UPI_MODE.QR_CODE;\n\n this.appsList = apps.map(app => {\n const imageName = `upi/${app.id.toLowerCase()}`;\n const brandIcon = this.core.modules.resources?.getImage()(imageName);\n return { id: app.id, name: app.name, icon: brandIcon };\n });\n }\n\n protected formatProps(props: UPIConfiguration): UPIConfiguration {\n return {\n showOtherInsteadOfNumber: !isMobile(),\n ...props\n };\n }\n\n public get isValid(): boolean {\n return this.state.isValid;\n }\n\n public formatData(): UpiPaymentData {\n const { app } = this.state.data || {};\n\n return {\n paymentMethod: {\n type: this.paymentType,\n ...(this.paymentType === TxVariants.upi_intent && app?.id && { appId: app.id })\n }\n };\n }\n\n get brands(): PaymentMethodBrand[] {\n const { showPaymentMethodItemImages } = this.props;\n\n if (!showPaymentMethodItemImages) {\n return [];\n }\n\n return this.appsList.map(app => ({ icon: app.icon, name: app.name }));\n }\n\n get paymentType(): UpiType {\n if (this.mode === UPI_MODE.QR_CODE) {\n return TxVariants.upi_qr;\n }\n return TxVariants.upi_intent;\n }\n\n protected override componentToRender(): h.JSX.Element {\n const { type, url, paymentMethodType } = this.props;\n\n const isAutoPay = !!this.props.mandate;\n\n switch (type) {\n case 'qrCode':\n return (\n <QRLoader\n {...this.props}\n qrCodeData={this.props.qrCodeData ? encodeURIComponent(this.props.qrCodeData) :
|
|
1
|
+
{"version":3,"file":"UPI.js","sources":["../../../../src/components/UPI/UPI.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport UPIComponent from './components/UPIComponent';\nimport { Await } from '../internal/Await';\nimport { QRLoader } from '../internal/QRLoader';\nimport { UPIAppList, UPIConfiguration, UpiMode, UpiPaymentData, UpiType } from './types';\nimport { TxVariants } from '../tx-variants';\nimport isMobile from '../../utils/isMobile';\nimport { UPI_COUNTDOWN_TIME, UPI_MODE } from './constants';\nimport { PaymentMethodBrand } from '../../types/global-types';\nimport { ICore } from '../../types';\n\n/**\n * For mobile:\n * We should show upi_intent depending on if `apps` are returned in /paymentMethods response.\n *\n * For non-mobile:\n * We should never show the upi_intent (ignore `apps` in /paymentMethods response)\n * Show upi_qr as default\n */\n\nclass UPI extends UIElement<UPIConfiguration> {\n public static readonly type = TxVariants.upi;\n public static readonly txVariants = [TxVariants.upi, TxVariants.upi_qr, TxVariants.upi_intent];\n private readonly mode: UpiMode;\n private readonly appsList: UPIAppList;\n\n protected static readonly defaultProps = {\n showPaymentMethodItemImages: true,\n countdownTime: UPI_COUNTDOWN_TIME\n };\n\n constructor(checkout: ICore, props: UPIConfiguration) {\n super(checkout, props);\n const { apps = [] } = this.props;\n const hasIntentApps = apps.length > 0;\n\n this.mode = isMobile() && hasIntentApps ? UPI_MODE.INTENT : UPI_MODE.QR_CODE;\n\n this.appsList = apps.map(app => {\n const imageName = `upi/${app.id.toLowerCase()}`;\n const brandIcon = this.core.modules.resources?.getImage()(imageName) ?? '';\n return { id: app.id, name: app.name, icon: brandIcon };\n });\n }\n\n protected formatProps(props: UPIConfiguration): UPIConfiguration {\n return {\n showOtherInsteadOfNumber: !isMobile(),\n ...props\n };\n }\n\n public get isValid(): boolean {\n return this.state.isValid;\n }\n\n public formatData(): UpiPaymentData {\n const { app } = this.state.data || {};\n\n return {\n paymentMethod: {\n type: this.paymentType,\n ...(this.paymentType === TxVariants.upi_intent && app?.id && { appId: app.id })\n }\n };\n }\n\n get brands(): PaymentMethodBrand[] {\n const { showPaymentMethodItemImages } = this.props;\n\n if (!showPaymentMethodItemImages) {\n return [];\n }\n\n return this.appsList.map(app => ({ icon: app.icon, name: app.name }));\n }\n\n get paymentType(): UpiType {\n if (this.mode === UPI_MODE.QR_CODE) {\n return TxVariants.upi_qr;\n }\n return TxVariants.upi_intent;\n }\n\n protected override componentToRender(): h.JSX.Element {\n const { type, url, paymentMethodType } = this.props;\n\n const isAutoPay = !!this.props.mandate;\n\n switch (type) {\n case 'qrCode':\n return (\n <QRLoader\n {...this.props}\n qrCodeData={this.props.qrCodeData ? encodeURIComponent(this.props.qrCodeData) : undefined}\n type={TxVariants.upi_qr}\n brandLogo={this.props.brandLogo || this.icon}\n onComplete={this.onComplete}\n introduction={this.props.i18n?.get('upi.qrCodeWaitingMessage') ?? ''}\n countdownTime={this.props.countdownTime}\n onActionHandled={this.onActionHandled}\n showAmount={!isAutoPay}\n />\n );\n case 'await':\n return (\n <Await\n url={url}\n type={paymentMethodType ?? ''}\n showCountdownTimer\n shouldRedirectAutomatically\n showAmount={!isAutoPay}\n countdownTime={this.props.countdownTime}\n clientKey={this.props.clientKey ?? ''}\n paymentData={this.props.paymentData}\n onActionHandled={this.onActionHandled}\n onError={this.props.onError}\n messageText={this.props.i18n?.get('upi.vpaWaitingMessage') ?? ''}\n awaitText={this.props.i18n?.get('await.waitForConfirmation') ?? ''}\n onComplete={this.onComplete}\n brandLogo={this.icon}\n />\n );\n default:\n return (\n <UPIComponent\n setComponentRef={this.setComponentRef}\n payButton={this.payButton}\n onChange={this.setState}\n appsList={this.appsList}\n mode={this.mode}\n showPayButton={this.props.showPayButton ?? true}\n mandate={this.props.mandate}\n onSubmitAnalytics={this.submitAnalytics}\n />\n );\n }\n }\n}\n\nexport default UPI;\n"],"names":["UPI","UIElement","formatProps","props","showOtherInsteadOfNumber","isMobile","isValid","this","state","formatData","app","data","paymentMethod","type","paymentType","TxVariants","upi_intent","id","appId","brands","showPaymentMethodItemImages","appsList","map","icon","name","mode","UPI_MODE","QR_CODE","upi_qr","componentToRender","url","paymentMethodType","isAutoPay","mandate","h","QRLoader","qrCodeData","encodeURIComponent","undefined","brandLogo","onComplete","introduction","i18n","get","countdownTime","onActionHandled","showAmount","Await","showCountdownTimer","shouldRedirectAutomatically","clientKey","paymentData","onError","messageText","awaitText","UPIComponent","setComponentRef","payButton","onChange","setState","showPayButton","onSubmitAnalytics","submitAnalytics","constructor","checkout","super","_define_property","apps","hasIntentApps","length","INTENT","imageName","toLowerCase","brandIcon","core","modules","resources","getImage","upi","txVariants","defaultProps","UPI_COUNTDOWN_TIME"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e,Fragment as t}from"../../../../external/preact/dist/preact.js";import{useState as
|
|
1
|
+
import{createElement as e,Fragment as t}from"../../../../external/preact/dist/preact.js";import{useState as n,useRef as a,useMemo as o,useEffect as s,useCallback as i}from"../../../../external/preact/hooks/dist/hooks.js";import r from"../../../../core/Context/useImage.js";import{MAX_PRIMARY_APPS as p,UPI_MODE as l,A11Y as d}from"../../constants.js";import"../../../../_virtual/index.js";import{SegmentedControlRegion as c}from"../../../internal/SegmentedControl/SegmentedControlRegion.js";import m from"../UPIIntentAppList/UPIIntentAppList.js";import{useCoreContext as u}from"../../../../core/Context/CoreProvider.js";import g from"../../../internal/Alert/Alert.js";import f from"../UPIMandate/UPIMandate.js";import{useAmount as y}from"../../../../core/Context/AmountProvider.js";import{BrandIcons as I}from"../../../internal/BrandIcons/BrandIcons.js";import h from"../../../internal/ContentSeparator/ContentSeparator.js";import N from"../../../internal/FormFields/Field/Field.js";import j from"../../../internal/FormFields/Select/Select.js";import{AnalyticsInfoEvent as C,InfoEventType as b,UiTarget as A}from"../../../../core/Analytics/events/AnalyticsInfoEvent.js";import{ANALYTICS_SEARCH_DEBOUNCE_TIME as S}from"../../../../core/Analytics/constants.js";import{debounce as E}from"../../../../utils/debounce.js";function T({mode:T,onChange:k,payButton:_,setComponentRef:B,showPayButton:w,mandate:L,appsList:R,onSubmitAnalytics:v}){const{i18n:x}=u(),F=r(),[P,Q]=n("ready"),[M,V]=n(null),{amount:O}=y(),[U,q]=n(T===l.QR_CODE),D=L&&e(f,{mandate:L,amount:O}),$=a({setStatus:Q,showValidation:()=>{T===l.INTENT&&Z()}}),z=o(()=>R.slice(0,p),[R]),G=o(()=>R.slice(p),[R]);s(()=>{B($.current)},[B]);const H=i((e,t)=>{e&&e.id!==M?.id&&(V(e),q(!0),Q("ready"),v(new C({component:"upi_intent",type:b.selected,target:t,issuer:e.name})))},[M,v]),J=i(e=>H(e,A.list),[H]),K=i(e=>{const t=G.find(t=>t.id===e.target.value);H(t,A.listSearch)},[G,H]),W=i(e=>{e&&v(new C({component:"upi_intent",type:b.displayed,target:A.list}))},[v]),X=a(E(v,S)),Y=i(()=>{X.current({type:b.input,target:A.listSearch})},[]),Z=i(()=>{M?(Q("ready"),q(!0)):(Q("error"),q(!1))},[M]),ee=o(()=>R.map(e=>({src:e.icon,alt:e.name})),[R]);return s(()=>{T!==l.QR_CODE?k({data:{...M&&{app:M}},isValid:U}):k({data:{},valid:{},errors:{},isValid:!0})},[M,U,T,k]),s(()=>{T===l.INTENT&&0!==z.length&&v(new C({component:"upi_intent",type:b.displayed,target:A.list,presentedValues:z.map(e=>e.id)}))},[]),e(t,null,T===l.INTENT&&e(c,{id:d.AreaId.INTENT,ariaLabelledBy:d.ButtonId.INTENT,className:"adyen-checkout-upi-area-intent"},e("span",{className:"adyen-checkout-upi-instruction-label"},x.get("upi.intent.instruction")),e("span",{className:"adyen-checkout-upi-instruction-title"},x.get("upi.intent.apps.title")),"error"===P&&e(g,{icon:"cross"},x.get("upi.error.noAppSelected")),e(m,{disabled:"loading"===P,appsList:z,selectedAppId:M?.id,onAppSelect:J}),G.length>0&&e(t,null,e(h,{classNames:["adyen-checkout-upi-instruction-separator"],label:"issuerList.separatorText"}),e(N,{label:x.get("upi.intent.apps.dropdown.label"),classNameModifiers:["upi-app-list"],name:"upi-app-list"},e(j,{items:G,selectedValue:G.some(e=>e.id===M?.id)?M?.id:void 0,placeholder:x.get("upi.intent.apps.dropdown.placeholder"),name:"upi-app-list",className:"adyen-checkout__upi-app-list__dropdown",onChange:K,onInput:Y,onListToggle:W}))),D,w&&_({label:x.get("continue"),status:P})),T===l.QR_CODE&&e(c,{id:d.AreaId.QR,ariaLabelledBy:d.ButtonId.QR,className:"adyen-checkout-upi-area-qr-code"},e("span",{className:"adyen-checkout-upi-instruction-label-caption"},x.get("upi.qrCode.instruction")),e(I,{className:"adyen-checkout-upi-brands",brandIcons:ee,showIconOnError:!0,smallIcons:!0,remainingBrandsLabel:`+ ${x.get("paymentMethodBrand.other")}`}),D,w&&_({label:x.get("generateQRCode"),icon:F({imageFolder:"components/"})("qr"),status:P})))}export{T as default};
|
|
2
2
|
//# sourceMappingURL=UPIComponent.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UPIComponent.js","sources":["../../../../../../src/components/UPI/components/UPIComponent/UPIComponent.tsx"],"sourcesContent":["import { Fragment, h } from 'preact';\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'preact/hooks';\nimport { ComponentMethodsRef, UIElementStatus } from '../../../types';\nimport { App, UPIAppList, UpiMode } from '../../types';\nimport useImage from '../../../../core/Context/useImage';\nimport { A11Y, UPI_MODE } from '../../constants';\nimport { SegmentedControlRegion } from '../../../internal/SegmentedControl';\nimport UPIIntentAppList from '../UPIIntentAppList';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport Alert from '../../../internal/Alert';\nimport UPIMandate, { Mandate } from '../UPIMandate/UPIMandate';\nimport { PayButtonProps } from '../../../internal/PayButton/PayButton';\nimport { useAmount } from '../../../../core/Context/AmountProvider';\nimport { BrandIcon } from '../../../internal/BrandIcons/types';\nimport { BrandIcons } from '../../../internal/BrandIcons/BrandIcons';\nimport { ValidationRuleResult } from '../../../../utils/Validator/ValidationRuleResult';\nimport './UPIComponent.scss';\n\ntype UpiData = { app?: App };\n\ntype OnChangeProps = { data: UpiData; valid?: { [key: string]: boolean }; errors?: { [key: string]: ValidationRuleResult }; isValid: boolean };\ninterface UPIComponentProps {\n mode: UpiMode;\n showPayButton: boolean;\n appsList: UPIAppList;\n mandate?: Mandate;\n setComponentRef: (ref: ComponentMethodsRef) => void;\n payButton(props: PayButtonProps): h.JSX.Element;\n onChange({ data, valid, errors, isValid }: OnChangeProps): void;\n}\n\nexport default function UPIComponent({\n mode,\n onChange,\n payButton,\n setComponentRef,\n showPayButton,\n mandate,\n appsList\n}: Readonly<UPIComponentProps>): h.JSX.Element {\n const { i18n } = useCoreContext();\n const getImage = useImage();\n const [status, setStatus] = useState<UIElementStatus>('ready');\n const [selectedApp, setSelectedApp] = useState<App>(null);\n const { amount } = useAmount();\n const [isValid, setIsValid] = useState<boolean>(mode === UPI_MODE.QR_CODE);\n const mandateComponent = mandate && <UPIMandate mandate={mandate} amount={amount} />;\n\n const upiRef = useRef<ComponentMethodsRef>({\n setStatus: setStatus,\n showValidation: () => {\n if (mode === UPI_MODE.INTENT) {\n validateIntentApp();\n }\n }\n });\n\n useEffect(() => {\n setComponentRef(upiRef.current);\n }, [setComponentRef]);\n\n const handleAppSelect = useCallback(\n (app: App) => {\n if (app?.id === selectedApp?.id) return;\n\n setSelectedApp(app);\n setIsValid(true);\n setStatus('ready');\n },\n [selectedApp]\n );\n\n const validateIntentApp = useCallback(() => {\n if (selectedApp) {\n setStatus('ready');\n setIsValid(true);\n } else {\n setStatus('error');\n setIsValid(false);\n }\n }, [selectedApp]);\n\n const brandIcons: BrandIcon[] = useMemo(\n () =>\n appsList.map(app => ({\n src: app.icon,\n alt: app.name\n })),\n [appsList]\n );\n\n useEffect(() => {\n if (mode === UPI_MODE.QR_CODE) {\n /**\n * When selecting QR code mode, we need to clear the state data and trigger 'onChange'.\n */\n onChange({ data: {}, valid: {}, errors: {}, isValid: true });\n return;\n }\n onChange({\n data: { ...(selectedApp && { app: selectedApp }) },\n isValid\n });\n }, [selectedApp, isValid, mode, onChange]);\n\n return (\n <Fragment>\n {mode === UPI_MODE.INTENT && (\n <SegmentedControlRegion id={A11Y.AreaId.INTENT} ariaLabelledBy={A11Y.ButtonId.INTENT} className=\"adyen-checkout-upi-area-intent\">\n <span className=\"adyen-checkout-upi-instruction-label\">{i18n.get('upi.intent.instruction')}</span>\n {status === 'error' && <Alert icon=\"cross\">{i18n.get('upi.error.noAppSelected')}</Alert>}\n <UPIIntentAppList\n disabled={status === 'loading'}\n appsList={appsList}\n selectedAppId={selectedApp?.id}\n onAppSelect={handleAppSelect}\n />\n {mandateComponent}\n {showPayButton &&\n payButton({\n label: i18n.get('continue'),\n status\n })}\n </SegmentedControlRegion>\n )}\n {mode === UPI_MODE.QR_CODE && (\n <SegmentedControlRegion id={A11Y.AreaId.QR} ariaLabelledBy={A11Y.ButtonId.QR} className=\"adyen-checkout-upi-area-qr-code\">\n <span className=\"adyen-checkout-upi-instruction-label\">{i18n.get('upi.qrCode.instruction')}</span>\n <BrandIcons\n className=\"adyen-checkout-upi-brands\"\n brandIcons={brandIcons}\n showIconOnError\n smallIcons\n remainingBrandsLabel={`+ ${i18n.get('paymentMethodBrand.other')}`}\n />\n {mandateComponent}\n {showPayButton &&\n payButton({\n label: i18n.get('generateQRCode'),\n icon: getImage({ imageFolder: 'components/' })('qr'),\n status\n })}\n </SegmentedControlRegion>\n )}\n </Fragment>\n );\n}\n"],"names":["UPIComponent","mode","onChange","payButton","setComponentRef","showPayButton","mandate","appsList","i18n","useCoreContext","getImage","useImage","status","setStatus","useState","selectedApp","setSelectedApp","amount","useAmount","isValid","setIsValid","UPI_MODE","QR_CODE","mandateComponent","h","UPIMandate","upiRef","useRef","showValidation","INTENT","validateIntentApp","useEffect","current","handleAppSelect","useCallback","app","id","brandIcons","useMemo","map","src","icon","alt","name","data","valid","errors","Fragment","SegmentedControlRegion","A11Y","AreaId","ariaLabelledBy","ButtonId","className","span","get","Alert","UPIIntentAppList","disabled","selectedAppId","onAppSelect","label","QR","BrandIcons","showIconOnError","smallIcons","remainingBrandsLabel","imageFolder"],"mappings":"g0BA+Be,SAASA,GAAaC,KACjCA,EAAIC,SACJA,EAAQC,UACRA,EAASC,gBACTA,EAAeC,cACfA,EAAaC,QACbA,EAAOC,SACPA,IAEA,MAAMC,KAAEA,GAASC,IACXC,EAAWC,KACVC,EAAQC,GAAaC,EAA0B,UAC/CC,EAAaC,GAAkBF,EAAc,OAC9CG,OAAEA,GAAWC,KACZC,EAASC,GAAcN,EAAkBb,IAASoB,EAASC,SAC5DC,EAAmBjB,GAAWkB,EAACC,EAAAA,CAAWnB,QAASA,EAASW,OAAQA,IAEpES,EAASC,EAA4B,CACvCd,UAAWA,EACXe,eAAgB,KACR3B,IAASoB,EAASQ,QAClBC,OAKZC,EAAU,KACN3B,EAAgBsB,EAAOM,UACxB,CAAC5B,IAEJ,MAAM6B,EAAkBC,EACnBC,IACOA,GAAKC,KAAOrB,GAAaqB,KAE7BpB,EAAemB,GACff,GAAW,GACXP,EAAU,WAEd,CAACE,IAGCe,EAAoBI,EAAY,KAC9BnB,GACAF,EAAU,SACVO,GAAW,KAEXP,EAAU,SACVO,GAAW,KAEhB,CAACL,IAEEsB,EAA0BC,EAC5B,IACI/B,EAASgC,IAAIJ,KACTK,IAAKL,EAAIM,KACTC,IAAKP,EAAIQ,QAEjB,CAACpC,IAiBL,OAdAwB,EAAU,KACF9B,IAASoB,EAASC,QAOtBpB,EAAS,CACL0C,KAAM,IAAM7B,GAAe,CAAEoB,IAAKpB,IAClCI,YALAjB,EAAS,CAAE0C,KAAM,CAAA,EAAIC,MAAO,CAAA,EAAIC,OAAQ,CAAA,EAAI3B,SAAS,KAO1D,CAACJ,EAAaI,EAASlB,EAAMC,IAG5BsB,EAACuB,EAAAA,KACI9C,IAASoB,EAASQ,QACfL,EAACwB,EAAAA,CAAuBZ,GAAIa,EAAKC,OAAOrB,OAAQsB,eAAgBF,EAAKG,SAASvB,OAAQwB,UAAU,kCAC5F7B,EAAC8B,OAAAA,CAAKD,UAAU,wCAAwC7C,EAAK+C,IAAI,2BACrD,UAAX3C,GAAsBY,EAACgC,EAAAA,CAAMf,KAAK,SAASjC,EAAK+C,IAAI,4BACrD/B,EAACiC,EAAAA,CACGC,SAAqB,YAAX9C,EACVL,SAAUA,EACVoD,cAAe5C,GAAaqB,GAC5BwB,YAAa3B,IAEhBV,EACAlB,GACGF,EAAU,CACN0D,MAAOrD,EAAK+C,IAAI,YAChB3C,YAIfX,IAASoB,EAASC,SACfE,EAACwB,EAAAA,CAAuBZ,GAAIa,EAAKC,OAAOY,GAAIX,eAAgBF,EAAKG,SAASU,GAAIT,UAAU,mCACpF7B,EAAC8B,OAAAA,CAAKD,UAAU,wCAAwC7C,EAAK+C,IAAI,2BACjE/B,EAACuC,EAAAA,CACGV,UAAU,4BACVhB,WAAYA,EACZ2B,iBAAAA,EACAC,YAAAA,EACAC,qBAAsB,KAAK1D,EAAK+C,IAAI,gCAEvChC,EACAlB,GACGF,EAAU,CACN0D,MAAOrD,EAAK+C,IAAI,kBAChBd,KAAM/B,EAAS,CAAEyD,YAAa,eAAxBzD,CAAyC,MAC/CE,YAM5B"}
|
|
1
|
+
{"version":3,"file":"UPIComponent.js","sources":["../../../../../../src/components/UPI/components/UPIComponent/UPIComponent.tsx"],"sourcesContent":["import { Fragment, h } from 'preact';\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'preact/hooks';\nimport { ComponentMethodsRef, UIElementStatus } from '../../../types';\nimport { App, UPIAppList, UpiMode } from '../../types';\nimport useImage from '../../../../core/Context/useImage';\nimport { A11Y, MAX_PRIMARY_APPS, UPI_MODE } from '../../constants';\nimport { SegmentedControlRegion } from '../../../internal/SegmentedControl';\nimport UPIIntentAppList from '../UPIIntentAppList';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport Alert from '../../../internal/Alert';\nimport UPIMandate, { Mandate } from '../UPIMandate/UPIMandate';\nimport { PayButtonProps } from '../../../internal/PayButton/PayButton';\nimport { useAmount } from '../../../../core/Context/AmountProvider';\nimport { BrandIcon } from '../../../internal/BrandIcons/types';\nimport { BrandIcons } from '../../../internal/BrandIcons/BrandIcons';\nimport { ValidationRuleResult } from '../../../../utils/Validator/ValidationRuleResult';\nimport './UPIComponent.scss';\nimport ContentSeparator from '../../../internal/ContentSeparator';\nimport Field from '../../../internal/FormFields/Field';\nimport Select from '../../../internal/FormFields/Select';\nimport { SelectTargetObject } from '../../../internal/FormFields/Select/types';\nimport { AnalyticsInfoEvent, InfoEventType, UiTarget } from '../../../../core/Analytics/events/AnalyticsInfoEvent';\nimport { AbstractAnalyticsEvent } from '../../../../core/Analytics/events/AbstractAnalyticsEvent';\nimport { ANALYTICS_SEARCH_DEBOUNCE_TIME } from '../../../../core/Analytics/constants';\nimport { debounce } from '../../../../utils/debounce';\n\ntype UpiData = { app?: App };\n\ntype OnChangeProps = { data: UpiData; valid?: { [key: string]: boolean }; errors?: { [key: string]: ValidationRuleResult }; isValid: boolean };\ninterface UPIComponentProps {\n mode: UpiMode;\n showPayButton: boolean;\n appsList: UPIAppList;\n mandate?: Mandate;\n setComponentRef: (ref: ComponentMethodsRef) => void;\n payButton(props: PayButtonProps): h.JSX.Element;\n onChange({ data, valid, errors, isValid }: OnChangeProps): void;\n onSubmitAnalytics(event: AbstractAnalyticsEvent): void;\n}\n\nexport default function UPIComponent({\n mode,\n onChange,\n payButton,\n setComponentRef,\n showPayButton,\n mandate,\n appsList,\n onSubmitAnalytics\n}: Readonly<UPIComponentProps>): h.JSX.Element {\n const { i18n } = useCoreContext();\n const getImage = useImage();\n const [status, setStatus] = useState<UIElementStatus>('ready');\n const [selectedApp, setSelectedApp] = useState<App | null>(null);\n const { amount } = useAmount();\n const [isValid, setIsValid] = useState<boolean>(mode === UPI_MODE.QR_CODE);\n const mandateComponent = mandate && <UPIMandate mandate={mandate} amount={amount} />;\n\n const upiRef = useRef<ComponentMethodsRef>({\n setStatus: setStatus,\n showValidation: () => {\n if (mode === UPI_MODE.INTENT) {\n validateIntentApp();\n }\n }\n });\n\n const priorityApps = useMemo(() => appsList.slice(0, MAX_PRIMARY_APPS), [appsList]);\n const lowPriorityApps = useMemo(() => appsList.slice(MAX_PRIMARY_APPS), [appsList]);\n\n useEffect(() => {\n setComponentRef(upiRef.current);\n }, [setComponentRef]);\n\n const selectApp = useCallback(\n (app: App | undefined, target: UiTarget) => {\n if (!app || app.id === selectedApp?.id) return;\n\n setSelectedApp(app);\n setIsValid(true);\n setStatus('ready');\n\n onSubmitAnalytics(\n new AnalyticsInfoEvent({\n component: 'upi_intent',\n type: InfoEventType.selected,\n target,\n issuer: app.name\n })\n );\n },\n [selectedApp, onSubmitAnalytics]\n );\n\n const handleAppSelect = useCallback((app: App) => selectApp(app, UiTarget.list), [selectApp]);\n\n const handleDropdownSelect = useCallback(\n (event: { target: SelectTargetObject }) => {\n const app = lowPriorityApps.find(a => a.id === event.target.value);\n selectApp(app, UiTarget.listSearch);\n },\n [lowPriorityApps, selectApp]\n );\n\n const handleListToggle = useCallback(\n (isOpen: boolean) => {\n if (isOpen) {\n onSubmitAnalytics(\n new AnalyticsInfoEvent({\n component: 'upi_intent',\n type: InfoEventType.displayed,\n target: UiTarget.list\n })\n );\n }\n },\n [onSubmitAnalytics]\n );\n\n const debounceSearchAnalytics = useRef(debounce(onSubmitAnalytics, ANALYTICS_SEARCH_DEBOUNCE_TIME));\n\n const handleSearch = useCallback(() => {\n debounceSearchAnalytics.current({ type: InfoEventType.input, target: UiTarget.listSearch });\n }, []);\n\n const validateIntentApp = useCallback(() => {\n if (selectedApp) {\n setStatus('ready');\n setIsValid(true);\n } else {\n setStatus('error');\n setIsValid(false);\n }\n }, [selectedApp]);\n\n const brandIcons: BrandIcon[] = useMemo(\n () =>\n appsList.map(app => ({\n src: app.icon,\n alt: app.name\n })),\n [appsList]\n );\n\n useEffect(() => {\n if (mode === UPI_MODE.QR_CODE) {\n /**\n * When selecting QR code mode, we need to clear the state data and trigger 'onChange'.\n */\n onChange({ data: {}, valid: {}, errors: {}, isValid: true });\n return;\n }\n onChange({\n data: { ...(selectedApp && { app: selectedApp }) },\n isValid\n });\n }, [selectedApp, isValid, mode, onChange]);\n\n useEffect(() => {\n if (mode !== UPI_MODE.INTENT || priorityApps.length === 0) return;\n\n onSubmitAnalytics(\n new AnalyticsInfoEvent({\n component: 'upi_intent',\n type: InfoEventType.displayed,\n target: UiTarget.list,\n presentedValues: priorityApps.map(a => a.id)\n })\n );\n }, []);\n\n return (\n <Fragment>\n {mode === UPI_MODE.INTENT && (\n <SegmentedControlRegion id={A11Y.AreaId.INTENT} ariaLabelledBy={A11Y.ButtonId.INTENT} className=\"adyen-checkout-upi-area-intent\">\n <span className=\"adyen-checkout-upi-instruction-label\">{i18n.get('upi.intent.instruction')}</span>\n <span className=\"adyen-checkout-upi-instruction-title\">{i18n.get('upi.intent.apps.title')}</span>\n {status === 'error' && <Alert icon={'cross'}>{i18n.get('upi.error.noAppSelected')}</Alert>}\n <UPIIntentAppList\n disabled={status === 'loading'}\n appsList={priorityApps}\n selectedAppId={selectedApp?.id}\n onAppSelect={handleAppSelect}\n />\n {lowPriorityApps.length > 0 && (\n <Fragment>\n <ContentSeparator classNames={['adyen-checkout-upi-instruction-separator']} label=\"issuerList.separatorText\" />\n <Field label={i18n.get('upi.intent.apps.dropdown.label')} classNameModifiers={['upi-app-list']} name={'upi-app-list'}>\n <Select\n items={lowPriorityApps}\n selectedValue={lowPriorityApps.some(a => a.id === selectedApp?.id) ? selectedApp?.id : undefined}\n placeholder={i18n.get('upi.intent.apps.dropdown.placeholder')}\n name={'upi-app-list'}\n className={'adyen-checkout__upi-app-list__dropdown'}\n onChange={handleDropdownSelect}\n onInput={handleSearch}\n onListToggle={handleListToggle}\n />\n </Field>\n </Fragment>\n )}\n {mandateComponent}\n {showPayButton &&\n payButton({\n label: i18n.get('continue'),\n status\n })}\n </SegmentedControlRegion>\n )}\n {mode === UPI_MODE.QR_CODE && (\n <SegmentedControlRegion id={A11Y.AreaId.QR} ariaLabelledBy={A11Y.ButtonId.QR} className=\"adyen-checkout-upi-area-qr-code\">\n <span className=\"adyen-checkout-upi-instruction-label-caption\">{i18n.get('upi.qrCode.instruction')}</span>\n <BrandIcons\n className=\"adyen-checkout-upi-brands\"\n brandIcons={brandIcons}\n showIconOnError\n smallIcons\n remainingBrandsLabel={`+ ${i18n.get('paymentMethodBrand.other')}`}\n />\n {mandateComponent}\n {showPayButton &&\n payButton({\n label: i18n.get('generateQRCode'),\n icon: getImage({ imageFolder: 'components/' })('qr'),\n status\n })}\n </SegmentedControlRegion>\n )}\n </Fragment>\n );\n}\n"],"names":["UPIComponent","mode","onChange","payButton","setComponentRef","showPayButton","mandate","appsList","onSubmitAnalytics","i18n","useCoreContext","getImage","useImage","status","setStatus","useState","selectedApp","setSelectedApp","amount","useAmount","isValid","setIsValid","UPI_MODE","QR_CODE","mandateComponent","h","UPIMandate","upiRef","useRef","showValidation","INTENT","validateIntentApp","priorityApps","useMemo","slice","MAX_PRIMARY_APPS","lowPriorityApps","useEffect","current","selectApp","useCallback","app","target","id","AnalyticsInfoEvent","component","type","InfoEventType","selected","issuer","name","handleAppSelect","UiTarget","list","handleDropdownSelect","event","find","a","value","listSearch","handleListToggle","isOpen","displayed","debounceSearchAnalytics","debounce","ANALYTICS_SEARCH_DEBOUNCE_TIME","handleSearch","input","brandIcons","map","src","icon","alt","data","valid","errors","length","presentedValues","Fragment","SegmentedControlRegion","A11Y","AreaId","ariaLabelledBy","ButtonId","className","span","get","Alert","UPIIntentAppList","disabled","selectedAppId","onAppSelect","ContentSeparator","classNames","label","Field","classNameModifiers","Select","items","selectedValue","some","undefined","placeholder","onInput","onListToggle","QR","BrandIcons","showIconOnError","smallIcons","remainingBrandsLabel","imageFolder"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../../external/preact/dist/preact.js";import t from"../../../../_virtual/index.js";import
|
|
1
|
+
import{createElement as e}from"../../../../external/preact/dist/preact.js";import t from"../../../../_virtual/index.js";import p from"./UPIIntentAppItem/UPIIntentAppItem.js";import{useCoreContext as a}from"../../../../core/Context/CoreProvider.js";const r=({appsList:r,selectedAppId:i,disabled:o,onAppSelect:n})=>{const{i18n:s}=a();return e("ul",{className:t({"adyen-checkout-upi-app-list":!0,"adyen-checkout-upi-app-list--loading":o}),role:"radiogroup","aria-label":s.get("paymentMethodsList.aria.label")},r.map(t=>{const a=`adyen-checkout-upi-app-item-${t.id}`,r=i===t.id;return e(p,{key:a,app:t,imgSrc:t.icon,isSelected:r,onSelect:n})}))};export{r as default};
|
|
2
2
|
//# sourceMappingURL=UPIIntentAppList.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UPIIntentAppList.js","sources":["../../../../../../src/components/UPI/components/UPIIntentAppList/UPIIntentAppList.tsx"],"sourcesContent":["import { h } from 'preact';\nimport classNames from 'classnames';\nimport { App, UPIAppList } from '../../types';\nimport UPIIntentAppItem from './UPIIntentAppItem';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport './UPIIntentAppList.scss';\n\ninterface UPIIntentAppListProps {\n appsList: UPIAppList;\n selectedAppId?: string;\n disabled?: boolean;\n onAppSelect: (app: App) => void;\n}\n\nconst UPIIntentAppList = ({ appsList, selectedAppId, disabled, onAppSelect }: Readonly<UPIIntentAppListProps>): h.JSX.Element => {\n const { i18n } = useCoreContext();\n\n return (\n /* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n <ul\n className={classNames({\n 'adyen-checkout-upi-app-list': true,\n 'adyen-checkout-upi-app-list--loading': disabled\n })}\n role=\"radiogroup\"\n aria-label={i18n.get('paymentMethodsList.aria.label')}\n >\n {appsList.map(app => {\n const key = `adyen-checkout-upi-app-item-${app.id}`;\n const isSelected = selectedAppId === app.id;\n return
|
|
1
|
+
{"version":3,"file":"UPIIntentAppList.js","sources":["../../../../../../src/components/UPI/components/UPIIntentAppList/UPIIntentAppList.tsx"],"sourcesContent":["import { h } from 'preact';\nimport classNames from 'classnames';\nimport { App, UPIAppList } from '../../types';\nimport UPIIntentAppItem from './UPIIntentAppItem';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport './UPIIntentAppList.scss';\n\ninterface UPIIntentAppListProps {\n appsList: UPIAppList;\n selectedAppId?: string;\n disabled?: boolean;\n onAppSelect: (app: App) => void;\n}\n\nconst UPIIntentAppList = ({ appsList, selectedAppId, disabled, onAppSelect }: Readonly<UPIIntentAppListProps>): h.JSX.Element => {\n const { i18n } = useCoreContext();\n\n return (\n /* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n <ul\n className={classNames({\n 'adyen-checkout-upi-app-list': true,\n 'adyen-checkout-upi-app-list--loading': disabled\n })}\n role=\"radiogroup\"\n aria-label={i18n.get('paymentMethodsList.aria.label')}\n >\n {appsList.map(app => {\n const key = `adyen-checkout-upi-app-item-${app.id}`;\n const isSelected = selectedAppId === app.id;\n return <UPIIntentAppItem key={key} app={app} imgSrc={app.icon} isSelected={isSelected} onSelect={onAppSelect} />;\n })}\n </ul>\n );\n};\n\nexport default UPIIntentAppList;\n"],"names":["UPIIntentAppList","appsList","selectedAppId","disabled","onAppSelect","i18n","useCoreContext","h","ul","className","classNames","role","aria-label","get","map","app","key","id","isSelected","UPIIntentAppItem","imgSrc","icon","onSelect"],"mappings":"wPAcA,MAAMA,EAAmB,EAAGC,WAAUC,gBAAeC,WAAUC,kBAC3D,MAAMC,KAAEA,GAASC,IAEjB,OAEIC,EAACC,KAAAA,CACGC,UAAWC,EAAW,CAClB,+BAA+B,EAC/B,uCAAwCP,IAE5CQ,KAAK,aACLC,aAAYP,EAAKQ,IAAI,kCAEpBZ,EAASa,IAAIC,IACV,MAAMC,EAAM,+BAA+BD,EAAIE,KACzCC,EAAahB,IAAkBa,EAAIE,GACzC,OAAOV,EAACY,EAAAA,CAAiBH,IAAKA,EAAKD,IAAKA,EAAKK,OAAQL,EAAIM,KAAMH,WAAYA,EAAYI,SAAUlB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const t={QR_CODE:"qrCode",INTENT:"intent"},e={ButtonId:{QR:"upi-button-qrCode",INTENT:"upi-button-intent"},AreaId:{QR:"upi-area-qrCode",INTENT:"upi-area-intent"}},
|
|
1
|
+
const t={QR_CODE:"qrCode",INTENT:"intent"},e=4,n={ButtonId:{QR:"upi-button-qrCode",INTENT:"upi-button-intent"},AreaId:{QR:"upi-area-qrCode",INTENT:"upi-area-intent"}},o=5;export{n as A11Y,e as MAX_PRIMARY_APPS,o as UPI_COUNTDOWN_TIME,t as UPI_MODE};
|
|
2
2
|
//# sourceMappingURL=constants.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../../../src/components/UPI/constants.ts"],"sourcesContent":["import { UpiMode } from './types';\n\nexport const UPI_MODE = {\n QR_CODE: 'qrCode' as UpiMode,\n INTENT: 'intent' as UpiMode\n} as const;\n\nexport const A11Y = {\n ButtonId: {\n QR: 'upi-button-qrCode',\n INTENT: 'upi-button-intent'\n },\n AreaId: {\n QR: 'upi-area-qrCode',\n INTENT: 'upi-area-intent'\n }\n};\n\nexport const UPI_COUNTDOWN_TIME = 5;\n"],"names":["UPI_MODE","QR_CODE","INTENT","A11Y","ButtonId","QR","AreaId","UPI_COUNTDOWN_TIME"],"mappings":"MAEaA,EAAW,CACpBC,QAAS,SACTC,OAAQ,UAGCC,EAAO,CAChBC,SAAU,CACNC,GAAI,
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../../src/components/UPI/constants.ts"],"sourcesContent":["import { UpiMode } from './types';\n\nexport const UPI_MODE = {\n QR_CODE: 'qrCode' as UpiMode,\n INTENT: 'intent' as UpiMode\n} as const;\n\nexport const MAX_PRIMARY_APPS = 4;\n\nexport const A11Y = {\n ButtonId: {\n QR: 'upi-button-qrCode',\n INTENT: 'upi-button-intent'\n },\n AreaId: {\n QR: 'upi-area-qrCode',\n INTENT: 'upi-area-intent'\n }\n};\n\nexport const UPI_COUNTDOWN_TIME = 5;\n"],"names":["UPI_MODE","QR_CODE","INTENT","MAX_PRIMARY_APPS","A11Y","ButtonId","QR","AreaId","UPI_COUNTDOWN_TIME"],"mappings":"MAEaA,EAAW,CACpBC,QAAS,SACTC,OAAQ,UAGCC,EAAmB,EAEnBC,EAAO,CAChBC,SAAU,CACNC,GAAI,oBACJJ,OAAQ,qBAEZK,OAAQ,CACJD,GAAI,kBACJJ,OAAQ,oBAIHM,EAAqB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
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:"adyen-checkout__filter-input",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};
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=SelectButton.js.map
|
|
@@ -1 +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, 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 const displayInputText = showList ?
|
|
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, 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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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../external/preact/dist/preact.js";import
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=SegmentedControl.js.map
|
|
@@ -1 +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=\"
|
|
1
|
+
{"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../external/preact/dist/preact.js";const a=({id:a,ariaLabelledBy:
|
|
1
|
+
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};
|
|
2
2
|
//# sourceMappingURL=SegmentedControlRegion.js.map
|
|
@@ -1 +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:
|
|
1
|
+
{"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{AbstractAnalyticsEvent as e,AnalyticsEventCategory as t}from"./AbstractAnalyticsEvent.js";import{mapErrorCodesForAnalytics as o}from"../utils.js";function
|
|
1
|
+
import{AbstractAnalyticsEvent as e,AnalyticsEventCategory as t}from"./AbstractAnalyticsEvent.js";import{mapErrorCodesForAnalytics as o}from"../utils.js";function r(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}var i=function(e){return e.instantPaymentButton="instant_payment_button",e.dualBrandButton="dual_brand_button",e.fastlaneSignupConsentToggle="fastlane_signup_consent_toggle",e.otherPaymentMethodButton="otherpaymentmethod_button",e.featuredIssuer="featured_issuer",e.list="list",e.listSearch="list_search",e.qrDownloadButton="qr_download_button",e.segmentedControl="segmented_control",e.cardNumber="card_number",e.expiryDate="expiry_date",e.expiryMonth="expiry_month",e.expiryYear="expiry_year",e.securityCode="security_code",e.donationAmountButton="donation_amount_button",e}({}),d=function(e){return e.clicked="clicked",e.rendered="rendered",e.selected="selected",e.validationError="validationError",e.focus="focus",e.unfocus="unfocus",e.configured="configured",e.displayed="displayed",e.input="input",e.download="download",e.sdkDownloadInitiated="sdkDownloadInitiated",e.sdkDownloadFailed="sdkDownloadFailed",e.sdkDownloadAborted="sdkDownloadAborted",e.sdkDownloadCompleted="sdkDownloadCompleted",e.Initialized="initialized",e.LookupStarted="lookupStarted",e.LookupUserNotFound="lookupUserNotFound",e.OtpStarted="otpStarted",e.OtpSucceeded="otpSucceeded",e.OtpCanceled="otpCanceled",e.OtpFailed="otpFailed",e.AddressSelectorClicked="addressSelectorClicked",e.AddressSelectorClosed="addressSelectorClosed",e.AddressChanged="addressChanged",e}({});class s extends e{get configDataExcludedFields(){return["paymentMethodsConfiguration","elementRef","isDropin","oneClick","storedPaymentMethodId","paymentMethodId","isInstantPayment","type","data","holderName","shopperEmail","email","telephoneNumber","clickToPayConfiguration","modules","i18n"]}createAnalyticsConfigData(e){if(!e)return{};const t={};try{for(const[o,r]of Object.entries(e))this.configDataExcludedFields.includes(o)||("function"==typeof r?t[o]="function":Array.isArray(r)?t[o]=r.join(", ").substring(0,128):t[o]="object"==typeof r&&null!==r?JSON.stringify(r).substring(0,128):r);return t}catch(e){return t}}getEventCategory(){return t.info}constructor(e){super(e.component),r(this,"type",void 0),r(this,"configData",void 0),r(this,"target",void 0),r(this,"issuer",void 0),r(this,"isExpress",void 0),r(this,"expressPage",void 0),r(this,"isStoredPaymentMethod",void 0),r(this,"brand",void 0),r(this,"selectedValue",void 0),r(this,"validationErrorCode",void 0),r(this,"validationErrorMessage",void 0),r(this,"presentedValues",void 0),r(this,"cdnUrl",void 0),this.type=e.type,e.target&&(this.target=e.target),e.issuer&&(this.issuer=e.issuer),void 0!==e.isStoredPaymentMethod&&(this.isStoredPaymentMethod=e.isStoredPaymentMethod),void 0!==e.isExpress&&(this.isExpress=e.isExpress),e.expressPage&&(this.expressPage=e.expressPage),e.brand&&(this.brand=e.brand),e.cdnUrl&&(this.cdnUrl=e.cdnUrl),e.selectedValue&&(this.selectedValue=e.selectedValue),e.validationErrorCode&&(this.validationErrorCode=e.validationErrorCode),e.validationErrorMessage&&(this.validationErrorMessage=e.validationErrorMessage),e.presentedValues&&(this.presentedValues=e.presentedValues),"rendered"===this.type&&(this.configData=this.createAnalyticsConfigData(e?.configData)),"validationError"===this.type&&(this.validationErrorCode=o(this.validationErrorCode,this.target))}}export{s as AnalyticsInfoEvent,d as InfoEventType,i as UiTarget};
|
|
2
2
|
//# sourceMappingURL=AnalyticsInfoEvent.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnalyticsInfoEvent.js","sources":["../../../../../src/core/Analytics/events/AnalyticsInfoEvent.ts"],"sourcesContent":["import { AbstractAnalyticsEvent, AnalyticsEventCategory } from './AbstractAnalyticsEvent';\nimport { mapErrorCodesForAnalytics } from '../utils';\n\ntype AnalyticsInfoEventProps = {\n type: InfoEventType;\n component: string;\n target?: UiTarget;\n issuer?: string;\n isExpress?: boolean;\n expressPage?: string;\n isStoredPaymentMethod?: boolean;\n brand?: string;\n validationErrorCode?: string;\n validationErrorMessage?: string;\n configData?: Record<string, any>;\n cdnUrl?: string;\n selectedValue?: string;\n};\n\nexport enum UiTarget {\n instantPaymentButton = 'instant_payment_button',\n dualBrandButton = 'dual_brand_button',\n fastlaneSignupConsentToggle = 'fastlane_signup_consent_toggle',\n otherPaymentMethodButton = 'otherpaymentmethod_button',\n featuredIssuer = 'featured_issuer',\n list = 'list',\n listSearch = 'list_search',\n qrDownloadButton = 'qr_download_button',\n segmentedControl = 'segmented_control',\n cardNumber = 'card_number',\n expiryDate = 'expiry_date',\n expiryMonth = 'expiry_month',\n expiryYear = 'expiry_year',\n securityCode = 'security_code',\n donationAmountButton = 'donation_amount_button'\n}\n\nexport enum InfoEventType {\n /** When a UI element is clicked */\n clicked = 'clicked',\n /** When a component is rendered in the browser (e.g. render() method is called) */\n rendered = 'rendered',\n /** When a list item is selected (e.g. issuer list) */\n selected = 'selected',\n /** When there is a validation issue with the input */\n validationError = 'validationError',\n /** When input gets focus */\n focus = 'focus',\n /** When input gets unfocus */\n unfocus = 'unfocus',\n /** When iframe fields are configured */\n configured = 'configured',\n /** When a dropdown list is displayed */\n displayed = 'displayed',\n /** When shopper utilizes an input field to search for values (e.g. issuer list) */\n input = 'input',\n /** When shopper clicks to download the image (e.g. QR code image) */\n download = 'download',\n sdkDownloadInitiated = 'sdkDownloadInitiated',\n sdkDownloadFailed = 'sdkDownloadFailed',\n sdkDownloadAborted = 'sdkDownloadAborted',\n sdkDownloadCompleted = 'sdkDownloadCompleted',\n Initialized = 'initialized',\n LookupStarted = 'lookupStarted',\n LookupUserNotFound = 'lookupUserNotFound',\n OtpStarted = 'otpStarted',\n OtpSucceeded = 'otpSucceeded',\n OtpCanceled = 'otpCanceled',\n OtpFailed = 'otpFailed',\n AddressSelectorClicked = 'addressSelectorClicked',\n AddressSelectorClosed = 'addressSelectorClosed',\n AddressChanged = 'addressChanged'\n}\n\nexport class AnalyticsInfoEvent extends AbstractAnalyticsEvent {\n /**\n * Analytics event type\n */\n private readonly type: InfoEventType;\n\n /**\n * Component config data set by the merchant. Sent only in 'rendered' events\n * @private\n */\n private readonly configData?: Record<string, string | boolean>;\n private readonly target?: UiTarget;\n private readonly issuer?: string;\n private readonly isExpress?: boolean;\n private readonly expressPage?: string;\n private readonly isStoredPaymentMethod?: boolean;\n private readonly brand?: string;\n private readonly selectedValue?: string;\n private readonly validationErrorCode?: string;\n private readonly validationErrorMessage?: string;\n\n /**\n * Third party script URL's (e.g. Apple Pay)\n */\n public cdnUrl?: string;\n\n constructor(props: AnalyticsInfoEventProps) {\n super(props.component);\n\n this.type = props.type;\n\n if (props.target) this.target = props.target;\n if (props.issuer) this.issuer = props.issuer;\n if (props.isStoredPaymentMethod !== undefined) this.isStoredPaymentMethod = props.isStoredPaymentMethod;\n if (props.isExpress !== undefined) this.isExpress = props.isExpress;\n if (props.expressPage) this.expressPage = props.expressPage;\n if (props.brand) this.brand = props.brand;\n if (props.cdnUrl) this.cdnUrl = props.cdnUrl;\n if (props.selectedValue) this.selectedValue = props.selectedValue;\n if (props.validationErrorCode) this.validationErrorCode = props.validationErrorCode;\n if (props.validationErrorMessage) this.validationErrorMessage = props.validationErrorMessage;\n if (this.type === InfoEventType.rendered || this.type === InfoEventType.displayed) {\n this.configData = this.createAnalyticsConfigData(props?.configData);\n }\n\n // Some of the more generic validation error codes required combination with target to retrieve a specific code\n if (this.type === InfoEventType.validationError) {\n this.validationErrorCode = mapErrorCodesForAnalytics(this.validationErrorCode, this.target);\n }\n }\n\n /**\n * Set of properties that must not be included when creating the configData for Analytics\n * @private\n */\n private get configDataExcludedFields() {\n const DROPIN_FIELDS = ['paymentMethodsConfiguration'];\n const FIELDS_INJECTED_BY_DROPIN = [\n 'elementRef',\n 'isDropin',\n 'oneClick',\n 'storedPaymentMethodId',\n 'paymentMethodId',\n 'isInstantPayment',\n 'type'\n ];\n const PII_FIELDS = ['data', 'holderName', 'shopperEmail', 'email', 'telephoneNumber', 'clickToPayConfiguration'];\n\n /**\n * TODO: Many unit tests are passing 'modules' as props, which leads to circular structure issue\n * The components must use the 'modules' from the core and not from the props\n */\n const UNIT_TEST_FIELDS = ['modules', 'i18n'];\n\n return [...DROPIN_FIELDS, ...FIELDS_INJECTED_BY_DROPIN, ...PII_FIELDS, ...UNIT_TEST_FIELDS];\n }\n\n /**\n * Creates a serializable analytics payload from the given config object.\n * Functions are replaced with 'function', and objects/arrays are stringified.\n */\n private createAnalyticsConfigData(config: Record<string, any>) {\n if (!config) return {};\n\n const MAX_STRING_LENGTH = 128;\n const result: Record<string, string> = {};\n\n try {\n for (const [key, value] of Object.entries(config)) {\n if (!this.configDataExcludedFields.includes(key)) {\n if (typeof value === 'function') {\n result[key] = 'function';\n } else if (Array.isArray(value)) {\n result[key] = value.join(', ').substring(0, MAX_STRING_LENGTH);\n } else if (typeof value === 'object' && value !== null) {\n result[key] = JSON.stringify(value).substring(0, MAX_STRING_LENGTH);\n } else {\n result[key] = value;\n }\n }\n }\n\n return result;\n } catch (error: unknown) {\n if (process.env.NODE_ENV === 'development') console.warn('AnalyticsInfoEvent: Error when creating configData\\n', error);\n return result;\n }\n }\n\n public getEventCategory(): AnalyticsEventCategory {\n return AnalyticsEventCategory.info;\n }\n}\n"],"names":["UiTarget","InfoEventType","AnalyticsInfoEvent","AbstractAnalyticsEvent","configDataExcludedFields","createAnalyticsConfigData","config","result","key","value","Object","entries","this","includes","Array","isArray","join","substring","JSON","stringify","error","getEventCategory","AnalyticsEventCategory","info","constructor","props","super","component","_define_property","type","configData","target","issuer","isExpress","expressPage","isStoredPaymentMethod","brand","selectedValue","validationErrorCode","validationErrorMessage","cdnUrl","undefined","mapErrorCodesForAnalytics"],"mappings":"iRAmBO,IAAAA,EAAKA,SAAAA,GAAAA,2iBAAAA,CAgBZ,CAhBYA,CAgBZ,CAAA,GAEOC,EAAKA,SAAAA,GAAAA,OACyBA,EAAA,QAAA,UAEgDA,EAAA,SAAA,WAE7BA,EAAA,SAAA,WAEAA,EAAA,gBAAA,kBAE1BA,EAAA,MAAA,QAEEA,EAAA,QAAA,UAEUA,EAAA,WAAA,aAEAA,EAAA,UAAA,YAE2CA,EAAA,MAAA,QAEdA,EAAA,SAAA,+gBAnB3DA,CAmCZ,CAnCYA,CAmCZ,CAAA,GAEO,MAAMC,UAA2BC,EAuDpC,4BAAYC,GAmBR,MAAO,CAlBgB,8BAEnB,aACA,WACA,WACA,wBACA,kBACA,mBACA,OAEgB,OAAQ,aAAc,eAAgB,QAAS,kBAAmB,0BAM5D,UAAW,OAGzC,CAMQC,yBAAAA,CAA0BC,GAC9B,IAAKA,EAAQ,MAAO,CAAA,EAEpB,MACMC,EAAiC,CAAA,EAEvC,IACI,IAAK,MAAOC,EAAKC,KAAUC,OAAOC,QAAQL,GACjCM,KAAKR,yBAAyBS,SAASL,KACnB,mBAAVC,EACPF,EAAOC,GAAO,WACPM,MAAMC,QAAQN,GACrBF,EAAOC,GAAOC,EAAMO,KAAK,MAAMC,UAAU,EAT/B,KAWVV,EAAOC,GADiB,iBAAVC,GAAgC,OAAVA,EACtBS,KAAKC,UAAUV,GAAOQ,UAAU,EAXpC,KAaIR,GAK1B,OAAOF,CACX,CAAE,MAAOa,GAEL,OAAOb,CACX,CACJ,CAEOc,gBAAAA,GACH,OAAOC,EAAuBC,IAClC,CArFA,WAAAC,CAAYC,GACRC,MAAMD,EAAME,WAvBhBC,EAAAhB,KAAiBiB,eAMjBD,OAAiBE,qBACjBF,EAAAhB,KAAiBmB,iBACjBH,EAAAhB,KAAiBoB,cAAjB,GACAJ,EAAAhB,KAAiBqB,iBAAjB,GACAL,OAAiBM,mBAAjB,GACAN,EAAAhB,KAAiBuB,6BAAjB,GACAP,OAAiBQ,aAAjB,GACAR,EAAAhB,KAAiByB,wBACjBT,OAAiBU,8BACjBV,EAAAhB,KAAiB2B,iCAKjBX,EAAAhB,KAAO4B,iBAKH5B,KAAKiB,KAAOJ,EAAMI,KAEdJ,EAAMM,SAAQnB,KAAKmB,OAASN,EAAMM,QAClCN,EAAMO,SAAQpB,KAAKoB,OAASP,EAAMO,aACFS,IAAhChB,EAAMU,wBAAqCvB,KAAKuB,sBAAwBV,EAAMU,4BAC1DM,IAApBhB,EAAMQ,YAAyBrB,KAAKqB,UAAYR,EAAMQ,WACtDR,EAAMS,cAAatB,KAAKsB,YAAcT,EAAMS,aAC5CT,EAAMW,QAAOxB,KAAKwB,MAAQX,EAAMW,OAChCX,EAAMe,SAAQ5B,KAAK4B,OAASf,EAAMe,QAClCf,EAAMY,gBAAezB,KAAKyB,cAAgBZ,EAAMY,eAChDZ,EAAMa,sBAAqB1B,KAAK0B,oBAAsBb,EAAMa,qBAC5Db,EAAMc,yBAAwB3B,KAAK2B,uBAAyBd,EAAMc,qCAClE3B,KAAKiB,MAA4C,cAATjB,KAAKiB,OAC7CjB,KAAKkB,WAAalB,KAAKP,0BAA0BoB,GAAOK,aAI/C,oBAATlB,KAAKiB,OACLjB,KAAK0B,oBAAsBI,EAA0B9B,KAAK0B,oBAAqB1B,KAAKmB,QAE5F"}
|
|
1
|
+
{"version":3,"file":"AnalyticsInfoEvent.js","sources":["../../../../../src/core/Analytics/events/AnalyticsInfoEvent.ts"],"sourcesContent":["import { AbstractAnalyticsEvent, AnalyticsEventCategory } from './AbstractAnalyticsEvent';\nimport { mapErrorCodesForAnalytics } from '../utils';\n\ntype AnalyticsInfoEventProps = {\n type: InfoEventType;\n component: string;\n target?: UiTarget;\n issuer?: string;\n isExpress?: boolean;\n expressPage?: string;\n isStoredPaymentMethod?: boolean;\n brand?: string;\n validationErrorCode?: string;\n validationErrorMessage?: string;\n configData?: Record<string, any>;\n cdnUrl?: string;\n selectedValue?: string;\n presentedValues?: Array<string>;\n};\n\nexport enum UiTarget {\n instantPaymentButton = 'instant_payment_button',\n dualBrandButton = 'dual_brand_button',\n fastlaneSignupConsentToggle = 'fastlane_signup_consent_toggle',\n otherPaymentMethodButton = 'otherpaymentmethod_button',\n featuredIssuer = 'featured_issuer',\n list = 'list',\n listSearch = 'list_search',\n qrDownloadButton = 'qr_download_button',\n segmentedControl = 'segmented_control',\n cardNumber = 'card_number',\n expiryDate = 'expiry_date',\n expiryMonth = 'expiry_month',\n expiryYear = 'expiry_year',\n securityCode = 'security_code',\n donationAmountButton = 'donation_amount_button'\n}\n\nexport enum InfoEventType {\n /** When a UI element is clicked */\n clicked = 'clicked',\n /** When a component is rendered in the browser (e.g. render() method is called) */\n rendered = 'rendered',\n /** When a list item is selected (e.g. issuer list) */\n selected = 'selected',\n /** When there is a validation issue with the input */\n validationError = 'validationError',\n /** When input gets focus */\n focus = 'focus',\n /** When input gets unfocus */\n unfocus = 'unfocus',\n /** When iframe fields are configured */\n configured = 'configured',\n /** When a dropdown list is displayed */\n displayed = 'displayed',\n /** When shopper utilizes an input field to search for values (e.g. issuer list) */\n input = 'input',\n /** When shopper clicks to download the image (e.g. QR code image) */\n download = 'download',\n sdkDownloadInitiated = 'sdkDownloadInitiated',\n sdkDownloadFailed = 'sdkDownloadFailed',\n sdkDownloadAborted = 'sdkDownloadAborted',\n sdkDownloadCompleted = 'sdkDownloadCompleted',\n Initialized = 'initialized',\n LookupStarted = 'lookupStarted',\n LookupUserNotFound = 'lookupUserNotFound',\n OtpStarted = 'otpStarted',\n OtpSucceeded = 'otpSucceeded',\n OtpCanceled = 'otpCanceled',\n OtpFailed = 'otpFailed',\n AddressSelectorClicked = 'addressSelectorClicked',\n AddressSelectorClosed = 'addressSelectorClosed',\n AddressChanged = 'addressChanged'\n}\n\nexport class AnalyticsInfoEvent extends AbstractAnalyticsEvent {\n /**\n * Analytics event type\n */\n private readonly type: InfoEventType;\n\n /**\n * Component config data set by the merchant. Sent only in 'rendered' events\n * @private\n */\n private readonly configData?: Record<string, string | boolean>;\n private readonly target?: UiTarget;\n private readonly issuer?: string;\n private readonly isExpress?: boolean;\n private readonly expressPage?: string;\n private readonly isStoredPaymentMethod?: boolean;\n private readonly brand?: string;\n private readonly selectedValue?: string;\n private readonly validationErrorCode?: string;\n private readonly validationErrorMessage?: string;\n private readonly presentedValues?: string[];\n\n /**\n * Third party script URL's (e.g. Apple Pay)\n */\n public cdnUrl?: string;\n\n constructor(props: AnalyticsInfoEventProps) {\n super(props.component);\n\n this.type = props.type;\n\n if (props.target) this.target = props.target;\n if (props.issuer) this.issuer = props.issuer;\n if (props.isStoredPaymentMethod !== undefined) this.isStoredPaymentMethod = props.isStoredPaymentMethod;\n if (props.isExpress !== undefined) this.isExpress = props.isExpress;\n if (props.expressPage) this.expressPage = props.expressPage;\n if (props.brand) this.brand = props.brand;\n if (props.cdnUrl) this.cdnUrl = props.cdnUrl;\n if (props.selectedValue) this.selectedValue = props.selectedValue;\n if (props.validationErrorCode) this.validationErrorCode = props.validationErrorCode;\n if (props.validationErrorMessage) this.validationErrorMessage = props.validationErrorMessage;\n if (props.presentedValues) this.presentedValues = props.presentedValues;\n if (this.type === InfoEventType.rendered) {\n this.configData = this.createAnalyticsConfigData(props?.configData);\n }\n\n // Some of the more generic validation error codes required combination with target to retrieve a specific code\n if (this.type === InfoEventType.validationError) {\n this.validationErrorCode = mapErrorCodesForAnalytics(this.validationErrorCode, this.target);\n }\n }\n\n /**\n * Set of properties that must not be included when creating the configData for Analytics\n * @private\n */\n private get configDataExcludedFields() {\n const DROPIN_FIELDS = ['paymentMethodsConfiguration'];\n const FIELDS_INJECTED_BY_DROPIN = [\n 'elementRef',\n 'isDropin',\n 'oneClick',\n 'storedPaymentMethodId',\n 'paymentMethodId',\n 'isInstantPayment',\n 'type'\n ];\n const PII_FIELDS = ['data', 'holderName', 'shopperEmail', 'email', 'telephoneNumber', 'clickToPayConfiguration'];\n\n /**\n * TODO: Many unit tests are passing 'modules' as props, which leads to circular structure issue\n * The components must use the 'modules' from the core and not from the props\n */\n const UNIT_TEST_FIELDS = ['modules', 'i18n'];\n\n return [...DROPIN_FIELDS, ...FIELDS_INJECTED_BY_DROPIN, ...PII_FIELDS, ...UNIT_TEST_FIELDS];\n }\n\n /**\n * Creates a serializable analytics payload from the given config object.\n * Functions are replaced with 'function', and objects/arrays are stringified.\n */\n private createAnalyticsConfigData(config: Record<string, any>) {\n if (!config) return {};\n\n const MAX_STRING_LENGTH = 128;\n const result: Record<string, string> = {};\n\n try {\n for (const [key, value] of Object.entries(config)) {\n if (!this.configDataExcludedFields.includes(key)) {\n if (typeof value === 'function') {\n result[key] = 'function';\n } else if (Array.isArray(value)) {\n result[key] = value.join(', ').substring(0, MAX_STRING_LENGTH);\n } else if (typeof value === 'object' && value !== null) {\n result[key] = JSON.stringify(value).substring(0, MAX_STRING_LENGTH);\n } else {\n result[key] = value;\n }\n }\n }\n\n return result;\n } catch (error: unknown) {\n if (process.env.NODE_ENV === 'development') console.warn('AnalyticsInfoEvent: Error when creating configData\\n', error);\n return result;\n }\n }\n\n public getEventCategory(): AnalyticsEventCategory {\n return AnalyticsEventCategory.info;\n }\n}\n"],"names":["UiTarget","InfoEventType","AnalyticsInfoEvent","AbstractAnalyticsEvent","configDataExcludedFields","createAnalyticsConfigData","config","result","key","value","Object","entries","this","includes","Array","isArray","join","substring","JSON","stringify","error","getEventCategory","AnalyticsEventCategory","info","constructor","props","super","component","_define_property","type","configData","target","issuer","isExpress","expressPage","isStoredPaymentMethod","brand","selectedValue","validationErrorCode","validationErrorMessage","presentedValues","cdnUrl","undefined","mapErrorCodesForAnalytics"],"mappings":"iRAoBO,IAAAA,EAAKA,SAAAA,GAAAA,2iBAAAA,CAgBZ,CAhBYA,CAgBZ,CAAA,GAEOC,EAAKA,SAAAA,GAAAA,OACyBA,EAAA,QAAA,UAEgDA,EAAA,SAAA,WAE7BA,EAAA,SAAA,WAEAA,EAAA,gBAAA,kBAE1BA,EAAA,MAAA,QAEEA,EAAA,QAAA,UAEUA,EAAA,WAAA,aAEAA,EAAA,UAAA,YAE2CA,EAAA,MAAA,QAEdA,EAAA,SAAA,+gBAnB3DA,CAmCZ,CAnCYA,CAmCZ,CAAA,GAEO,MAAMC,UAA2BC,EAyDpC,4BAAYC,GAmBR,MAAO,CAlBgB,8BAEnB,aACA,WACA,WACA,wBACA,kBACA,mBACA,OAEgB,OAAQ,aAAc,eAAgB,QAAS,kBAAmB,0BAM5D,UAAW,OAGzC,CAMQC,yBAAAA,CAA0BC,GAC9B,IAAKA,EAAQ,MAAO,CAAA,EAEpB,MACMC,EAAiC,CAAA,EAEvC,IACI,IAAK,MAAOC,EAAKC,KAAUC,OAAOC,QAAQL,GACjCM,KAAKR,yBAAyBS,SAASL,KACnB,mBAAVC,EACPF,EAAOC,GAAO,WACPM,MAAMC,QAAQN,GACrBF,EAAOC,GAAOC,EAAMO,KAAK,MAAMC,UAAU,EAT/B,KAWVV,EAAOC,GADiB,iBAAVC,GAAgC,OAAVA,EACtBS,KAAKC,UAAUV,GAAOQ,UAAU,EAXpC,KAaIR,GAK1B,OAAOF,CACX,CAAE,MAAOa,GAEL,OAAOb,CACX,CACJ,CAEOc,gBAAAA,GACH,OAAOC,EAAuBC,IAClC,CAtFA,WAAAC,CAAYC,GACRC,MAAMD,EAAME,WAxBhBC,EAAAhB,KAAiBiB,eAMjBD,OAAiBE,kBAAjB,GACAF,EAAAhB,KAAiBmB,cAAjB,GACAH,EAAAhB,KAAiBoB,cAAjB,GACAJ,OAAiBK,iBAAjB,GACAL,EAAAhB,KAAiBsB,mBAAjB,GACAN,EAAAhB,KAAiBuB,gCACjBP,OAAiBQ,gBACjBR,EAAAhB,KAAiByB,qBAAjB,GACAT,EAAAhB,KAAiB0B,2BAAjB,GACAV,OAAiBW,8BAAjB,GACAX,EAAAhB,KAAiB4B,uBAAjB,GAKAZ,EAAAhB,KAAO6B,iBAKH7B,KAAKiB,KAAOJ,EAAMI,KAEdJ,EAAMM,SAAQnB,KAAKmB,OAASN,EAAMM,QAClCN,EAAMO,SAAQpB,KAAKoB,OAASP,EAAMO,aACFU,IAAhCjB,EAAMU,wBAAqCvB,KAAKuB,sBAAwBV,EAAMU,4BAC1DO,IAApBjB,EAAMQ,YAAyBrB,KAAKqB,UAAYR,EAAMQ,WACtDR,EAAMS,cAAatB,KAAKsB,YAAcT,EAAMS,aAC5CT,EAAMW,QAAOxB,KAAKwB,MAAQX,EAAMW,OAChCX,EAAMgB,SAAQ7B,KAAK6B,OAAShB,EAAMgB,QAClChB,EAAMY,gBAAezB,KAAKyB,cAAgBZ,EAAMY,eAChDZ,EAAMa,sBAAqB1B,KAAK0B,oBAAsBb,EAAMa,qBAC5Db,EAAMc,yBAAwB3B,KAAK2B,uBAAyBd,EAAMc,wBAClEd,EAAMe,kBAAiB5B,KAAK4B,gBAAkBf,EAAMe,iBAC3C,aAAT5B,KAAKiB,OACLjB,KAAKkB,WAAalB,KAAKP,0BAA0BoB,GAAOK,aAI/C,oBAATlB,KAAKiB,OACLjB,KAAK0B,oBAAsBK,EAA0B/B,KAAK0B,oBAAqB1B,KAAKmB,QAE5F"}
|