JezK

Edit File: sc-checkout-mollie-payment_3.entry.js.map

{"file":"sc-checkout-mollie-payment.sc-checkout-paystack-payment-provider.sc-checkout-razorpay-payment-provider.entry.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEO,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,OAA0B,EAAE,QAAQ,KACjE,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,EAAE,QAAQ,EAAE,QAAQ;;IAEhC,IAAI,GAAG,KAAK,IAAI;QAAE,OAAO;;IAGzB,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;QAC1B,IAAI,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,GAAG,CAAC,CAAC,CAAC,EAAE;YAC5F,OAAO,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;SACrC;KACF;;IAGD,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE;QAC/B,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,OAAO,CAAC,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,OAAO,CAAC,CAAC;YAAE,OAAO;QACxF,OAAO,QAAQ,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,OAAO,CAAC,EAAE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,OAAO,CAAC,CAAC,CAAC;KAC3D;AACH,CAAC,CAAC;;ACnBJ,MAAM,0BAA0B,GAAG,sBAAsB,CAAC;AAC1D,sCAAe,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mECqF9B,UAAE;;;isBAkB+B,eAAO,CAAC,UAAE,gTAEnC,UAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6CCxDgB,eAAO,CAAC,UAAE;;;;;;;;;yCAWlB,eAAO,CAAC,UAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6CCoDF,eAAO,CAAC,UAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qDAgCN,UAAE;;;;;;;;;;;;;;;;;gKAmBQ,UAAE;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/store/checkout/functions.ts","src/components/controllers/checkout-form/sc-checkout-mollie-payment/sc-checkout-mollie-payment.css?tag=sc-checkout-mollie-payment&encapsulation=shadow","src/components/controllers/checkout-form/sc-checkout-mollie-payment/sc-checkout-mollie-payment.tsx","src/components/controllers/checkout-form/sc-checkout-paystack-payment-provider/sc-checkout-paystack-payment-provider.tsx","src/components/controllers/checkout-form/sc-checkout-razorpay-payment-provider/sc-checkout-razorpay-payment-provider.tsx"],"sourcesContent":["import { on } from './store';\n\nexport const listenTo = (prop, propKey: string | string[], callback) =>\n on('set', (key, newValue, oldValue) => {\n // ignore non-keys\n if (key !== prop) return;\n\n // handle an array, if one has changed, run callback.\n if (Array.isArray(propKey)) {\n if (propKey.some(key => JSON.stringify(newValue?.[key]) !== JSON.stringify(oldValue?.[key]))) {\n return callback(newValue, oldValue);\n }\n }\n\n // handle string.\n if (typeof propKey === 'string') {\n if (JSON.stringify(newValue?.[propKey]) === JSON.stringify(oldValue?.[propKey])) return;\n return callback(newValue?.[propKey], oldValue?.[propKey]);\n }\n });\n",":host {\n display: block;\n}\n","import { Component, Fragment, h, Prop, State } from '@stencil/core';\nimport { Address, Pagination, PaymentMethodType, ResponseError } from '../../../../types';\nimport { sprintf, __ } from '@wordpress/i18n';\nimport { addQueryArgs } from '@wordpress/url';\nimport { state as selectedProcessor } from '@store/selected-processor';\nimport { state as processorsState } from '@store/processors';\nimport { hasMultipleMethodChoices, availableMethodTypes, availableManualPaymentMethods, getAvailableProcessor } from '@store/processors/getters';\n// checkout store.\nimport { state as checkoutState } from '@store/checkout';\nimport { listenTo } from '@store/checkout/functions';\nimport { checkoutIsLocked } from '@store/checkout/getters';\nimport { lockCheckout, unLockCheckout } from '@store/checkout/mutations';\n\nimport apiFetch from '../../../../functions/fetch';\n\nimport { ManualPaymentMethods } from '../payment/ManualPaymentMethods';\nimport { createErrorNotice } from '@store/notices/mutations';\nimport { MockProcessor } from '../payment/MockProcessor';\n\n@Component({\n tag: 'sc-checkout-mollie-payment',\n styleUrl: 'sc-checkout-mollie-payment.css',\n shadow: true,\n})\nexport class ScCheckoutMolliePayment {\n @Prop() processorId: string;\n @Prop() method: string;\n\n @State() error: ResponseError;\n @State() methods: PaymentMethodType[];\n\n componentWillLoad() {\n selectedProcessor.id = 'mollie';\n this.fetchMethods();\n listenTo('checkout', ['total_amount', 'subtotal_amount', 'currency', 'reusabled_payment_method_required', 'shipping_address'], () => this.fetchMethods());\n }\n\n async fetchMethods() {\n const checkout = checkoutState.checkout;\n if (!checkout?.currency) return; // wait until we have a currency.\n try {\n lockCheckout('methods');\n const response = (await apiFetch({\n path: addQueryArgs(`surecart/v1/processors/${this.processorId}/payment_method_types`, {\n amount: checkout?.total_amount,\n country: (checkout?.shipping_address as Address)?.country || 'us',\n currency: checkout?.currency,\n ...(checkout?.reusable_payment_method_required ? { reusable: checkout?.reusable_payment_method_required } : {}),\n per_page: 100,\n }),\n })) as {\n object: 'list';\n pagination: Pagination;\n data: PaymentMethodType[];\n };\n processorsState.methods = response?.data || [];\n } catch (e) {\n createErrorNotice(e);\n console.error(e);\n } finally {\n unLockCheckout('methods');\n }\n }\n\n renderLoading() {\n return (\n <sc-card>\n <sc-skeleton style={{ width: '50%', marginBottom: '0.5em' }}></sc-skeleton>\n <sc-skeleton style={{ width: '30%', marginBottom: '0.5em' }}></sc-skeleton>\n <sc-skeleton style={{ width: '60%', marginBottom: '0.5em' }}></sc-skeleton>\n </sc-card>\n );\n }\n\n render() {\n if (checkoutIsLocked('methods') && !availableMethodTypes()?.length) {\n return this.renderLoading();\n }\n\n if (!checkoutState.checkout?.currency) {\n return this.renderLoading();\n }\n\n if (!availableMethodTypes()?.length) {\n return (\n <sc-alert type=\"warning\" open>\n {__('No available payment methods', 'surecart')}{' '}\n </sc-alert>\n );\n }\n\n const Tag = hasMultipleMethodChoices() ? 'sc-toggles' : 'div';\n\n return (\n <Fragment>\n <Tag collapsible={false} theme=\"container\">\n {(availableMethodTypes() || []).map(method => (\n <sc-payment-method-choice processor-id=\"mollie\" method-id={method?.id} key={method?.id}>\n <span slot=\"summary\" class=\"sc-payment-toggle-summary\">\n {!!method?.image && <img src={method?.image} aria-hidden=\"true\" />}\n <span>{method?.description}</span>\n </span>\n\n <sc-card>\n <sc-payment-selected label={sprintf(__('%s selected for check out.', 'surecart'), method?.description)}>\n {!!method?.image && <img slot=\"icon\" src={method?.image} style={{ width: '32px' }} />}\n {__('Another step will appear after submitting your order to complete your purchase details.', 'surecart')}\n </sc-payment-selected>\n </sc-card>\n </sc-payment-method-choice>\n ))}\n <MockProcessor processor={getAvailableProcessor('mock')} />\n <ManualPaymentMethods methods={availableManualPaymentMethods()} />\n </Tag>\n {!!checkoutIsLocked('methods') && <sc-block-ui class=\"busy-block-ui\" z-index={9} style={{ '--sc-block-ui-opacity': '0.4' }}></sc-block-ui>}\n </Fragment>\n );\n }\n}\n","/**\n * External dependencies.\n */\nimport PaystackPop from '@paystack/inline-js';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Component } from '@stencil/core';\n\n/**\n * Internal dependencies.\n */\nimport { state as checkoutState } from '@store/checkout';\nimport { state as selectedProcessor } from '@store/selected-processor';\nimport { onChange as onChangeFormState } from '@store/form';\nimport { currentFormState } from '@store/form/getters';\nimport { updateFormState } from '@store/form/mutations';\nimport { createErrorNotice } from '@store/notices/mutations';\n\n@Component({\n tag: 'sc-checkout-paystack-payment-provider',\n shadow: true,\n})\nexport class ScCheckoutPaystackPaymentProvider {\n private unlistenToFormState: () => void;\n\n componentWillLoad() {\n // we need to listen to the form state and pay when the form state enters the paying state.\n this.unlistenToFormState = onChangeFormState('formState', () => {\n // are we paying?\n if ('paying' === currentFormState()) {\n this.confirm();\n }\n });\n }\n\n disconnectedCallback() {\n this.unlistenToFormState();\n }\n\n async confirm() {\n // this processor is not selected.\n if (selectedProcessor?.id !== 'paystack') return;\n // Must be a paystack session\n if (!checkoutState?.checkout?.payment_intent?.processor_data.paystack) return;\n // Prevent if already paid.\n if (checkoutState?.checkout?.status === 'paid') return;\n\n try {\n // must have a public key and access code.\n const { public_key, access_code } = checkoutState?.checkout?.payment_intent.processor_data.paystack;\n if (!public_key || !access_code) {\n createErrorNotice({ message: sprintf(__('Payment gateway configuration incomplete. Please ensure Paystack is properly configured for transactions.', 'surecart')) });\n return;\n }\n\n const paystack = new PaystackPop();\n\n await paystack.newTransaction({\n key: public_key,\n accessCode: access_code, // We'll use accessCode which will handle product, price on our server.\n onSuccess: async transaction => {\n if (transaction?.status !== 'success') {\n throw { message: sprintf(__('Paystack transaction could not be finished. Status: %s', 'surecart'), transaction?.status) };\n }\n return updateFormState('PAID');\n },\n onClose: () => updateFormState('REJECT'),\n });\n } catch (err) {\n createErrorNotice(err);\n console.error(err);\n updateFormState('REJECT');\n }\n }\n}\n","/**\n * External dependencies.\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Component, Prop } from '@stencil/core';\nimport { addQueryArgs } from '@wordpress/url';\n\n/**\n * Internal dependencies.\n */\nimport { state as checkoutState } from '@store/checkout';\nimport { listenTo } from '@store/checkout/functions';\nimport { lockCheckout, unLockCheckout } from '@store/checkout/mutations';\nimport { state as processorsState } from '@store/processors';\nimport { state as selectedProcessor } from '@store/selected-processor';\nimport { onChange as onChangeFormState } from '@store/form';\nimport { currentFormState } from '@store/form/getters';\nimport { updateFormState } from '@store/form/mutations';\nimport { createErrorNotice } from '@store/notices/mutations';\nimport { loadRazorpay } from 'src/functions/razorpay';\nimport apiFetch from '../../../../functions/fetch';\nimport { Customer, Pagination, PaymentMethodType, RazorpayConstructor, ResponseError } from 'src/types';\n\n@Component({\n tag: 'sc-checkout-razorpay-payment-provider',\n shadow: true,\n})\nexport class ScCheckoutRazorpayPaymentProvider {\n /** Razorpay processor id. Required for the recurring `payment_method_types` fetch. */\n @Prop() processorId: string;\n\n private unlistenToFormState?: () => void;\n private unlistenToCheckout?: () => void;\n private razorpayInstance: RazorpayConstructor | null = null;\n private confirming: boolean = false;\n\n componentWillLoad() {\n // Preload Razorpay script.\n loadRazorpay()\n .then(instance => (this.razorpayInstance = instance))\n .catch(err => createErrorNotice({ message: err.message }));\n\n // we need to listen to the form state and pay when the form state enters the paying state.\n this.unlistenToFormState = onChangeFormState('formState', () => {\n // are we paying?\n if ('paying' === currentFormState()) {\n this.confirm();\n }\n });\n\n // Keep the recurring payment_method_types in sync with the checkout.\n this.fetchMethods();\n this.unlistenToCheckout = listenTo('checkout', ['currency', 'reusable_payment_method_required'], () => this.fetchMethods());\n }\n\n disconnectedCallback() {\n // Guarded — Stencil can disconnect before componentWillLoad fires on mid-render reparenting.\n this.unlistenToFormState?.();\n this.unlistenToCheckout?.();\n // Release shared state so a later mollie / non-recurring flow starts clean.\n processorsState.methods = [];\n }\n\n /** Fetch enabled `payment_method_types` for recurring checkouts. No-op otherwise. */\n async fetchMethods() {\n const checkout = checkoutState.checkout;\n if (!this.processorId || !checkout?.currency) return;\n\n // One-time — Razorpay handles method selection in its modal. Clear any stale recurring methods.\n if (!checkout?.reusable_payment_method_required) {\n if (processorsState.methods.length) processorsState.methods = [];\n return;\n }\n\n try {\n lockCheckout('methods');\n const response = (await apiFetch({\n path: addQueryArgs(`surecart/v1/processors/${this.processorId}/payment_method_types`, {\n currency: checkout.currency,\n reusable: true,\n per_page: 100,\n }),\n })) as {\n object: 'list';\n pagination: Pagination;\n data: PaymentMethodType[];\n };\n processorsState.methods = response?.data || [];\n } catch (e) {\n createErrorNotice(e as ResponseError);\n console.error(e);\n } finally {\n unLockCheckout('methods');\n }\n }\n\n async confirm() {\n // this processor is not selected.\n if (selectedProcessor?.id !== 'razorpay') return;\n // Must be a razorpay session\n if (!checkoutState?.checkout?.payment_intent?.processor_data?.razorpay) return;\n // Prevent if already paid.\n if (checkoutState?.checkout?.status === 'paid') return;\n // Prevent multiple simultaneous payment attempts\n if (this.confirming) return;\n\n this.confirming = true;\n\n try {\n // must have a public_key and external_intent_id.\n const { external_intent_id, processor_data, reusable } = checkoutState?.checkout?.payment_intent || {};\n const { public_key, customer_id } = processor_data?.razorpay || {};\n if (!external_intent_id || !public_key) {\n createErrorNotice({ message: sprintf(__('Payment gateway configuration incomplete. Please ensure Razorpay is properly configured for transactions.', 'surecart')) });\n return;\n }\n\n // Wait for script to load if not loaded yet.\n if (!this.razorpayInstance) {\n this.razorpayInstance = await loadRazorpay();\n }\n\n const customer = checkoutState?.checkout?.customer as Customer | undefined;\n const prefill = customer\n ? {\n ...(customer.name && { name: customer.name }),\n ...(customer.email && { email: customer.email }),\n ...(customer.phone && { contact: customer.phone }),\n }\n : undefined;\n\n /*\n * Razorpay options.\n * @see https://razorpay.com/docs/payments/payment-gateway/web-integration/standard/integration-steps/#123-checkout-options\n */\n let options = {\n key: public_key,\n order_id: external_intent_id,\n prefill,\n customer_id,\n recurring: reusable,\n handler: (response: any) => {\n if (response?.razorpay_payment_id) {\n return updateFormState('PAID');\n } else {\n createErrorNotice({ message: __('Payment verification failed. Please contact support.', 'surecart') });\n updateFormState('REJECT');\n }\n },\n modal: {\n ondismiss: () => {\n updateFormState('REJECT');\n },\n },\n };\n\n if (window?.wp?.hooks?.applyFilters) {\n options = window.wp.hooks.applyFilters('surecart_razorpay_checkout_options', options);\n }\n\n const razorpay = new this.razorpayInstance(options);\n\n razorpay.on('payment.failed', response => {\n createErrorNotice({\n message: response?.error?.description || __('Payment failed. Please try again.', 'surecart'),\n });\n updateFormState('REJECT');\n console.error('payment.failed', response);\n });\n\n razorpay.open();\n } catch (err) {\n createErrorNotice(err);\n console.error(err);\n updateFormState('REJECT');\n } finally {\n this.confirming = false;\n }\n }\n}\n"],"version":3}