@open-mercato/gateway-stripe 0.5.1-develop.2856.35de414092 → 0.5.1-develop.2874.77704bccbd
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.
|
@@ -155,7 +155,7 @@ function StripeEmbeddedPaymentRenderer(props) {
|
|
|
155
155
|
if (!payload.publishableKey || !payload.clientSecret || !stripePromise) {
|
|
156
156
|
return null;
|
|
157
157
|
}
|
|
158
|
-
return /* @__PURE__ */ jsxs("div", { className: "space-y-3 rounded-
|
|
158
|
+
return /* @__PURE__ */ jsxs("div", { className: "space-y-3 rounded-xl border border-border/70 bg-white/80 p-4 shadow-sm backdrop-blur", children: [
|
|
159
159
|
/* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
|
|
160
160
|
/* @__PURE__ */ jsx("p", { className: "text-sm font-semibold", children: t("gateway_stripe.payments.title", "Secure Stripe payment") }),
|
|
161
161
|
/* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("gateway_stripe.payments.description", "Complete the payment below without leaving this page.") })
|
|
@@ -169,7 +169,7 @@ function StripeEmbeddedPaymentRenderer(props) {
|
|
|
169
169
|
appearance
|
|
170
170
|
},
|
|
171
171
|
children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
|
|
172
|
-
/* @__PURE__ */ jsx("div", { className: "rounded-
|
|
172
|
+
/* @__PURE__ */ jsx("div", { className: "rounded-xl border bg-background px-4 py-4 shadow-sm", children: /* @__PURE__ */ jsx(PaymentElement, { options: paymentElementOptions }) }),
|
|
173
173
|
/* @__PURE__ */ jsx(
|
|
174
174
|
StripeEmbeddedPaymentForm,
|
|
175
175
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/modules/gateway_stripe/widgets/payments/client.tsx"],
|
|
4
|
-
"sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Elements, PaymentElement, useElements, useStripe } from '@stripe/react-stripe-js'\n// Use the `/pure` entry so that Stripe.js is only fetched when `loadStripe`\n// is actually called (i.e., when the embedded payment form renders on a\n// checkout page), instead of as an import side effect that leaks onto every\n// admin route that bootstraps payment renderer registrations.\nimport { loadStripe } from '@stripe/stripe-js/pure'\nimport type { StripePaymentElementOptions } from '@stripe/stripe-js'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport {\n registerEmbeddedPaymentGatewayRenderer,\n type EmbeddedPaymentGatewayRendererProps,\n} from '@open-mercato/shared/modules/payment_gateways/client'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Spinner } from '@open-mercato/ui/primitives/spinner'\nimport type { StripePaymentElementSettings } from '../../lib/shared'\n\ntype StripeRendererPayload = {\n clientSecret?: string\n publishableKey?: string\n returnUrl?: string\n}\n\nfunction readStripePayload(payload: Record<string, unknown> | undefined): StripeRendererPayload {\n return {\n clientSecret: typeof payload?.clientSecret === 'string' ? payload.clientSecret : undefined,\n publishableKey: typeof payload?.publishableKey === 'string' ? payload.publishableKey : undefined,\n returnUrl: typeof payload?.returnUrl === 'string' ? payload.returnUrl : undefined,\n }\n}\n\nfunction resolveAppearanceVariables(): Record<string, string> {\n if (typeof window === 'undefined') {\n return {\n colorPrimary: '#111827',\n colorText: '#111827',\n colorDanger: '#dc2626',\n colorTextPlaceholder: '#6b7280',\n }\n }\n const styles = window.getComputedStyle(document.documentElement)\n return {\n colorPrimary: `hsl(${styles.getPropertyValue('--foreground').trim() || '222.2 84% 4.9%'})`,\n colorText: `hsl(${styles.getPropertyValue('--foreground').trim() || '222.2 84% 4.9%'})`,\n colorDanger: `hsl(${styles.getPropertyValue('--destructive').trim() || '0 84.2% 60.2%'})`,\n colorTextPlaceholder: `hsl(${styles.getPropertyValue('--muted-foreground').trim() || '215.4 16.3% 46.9%'})`,\n }\n}\n\nfunction readRendererSettings(session: EmbeddedPaymentGatewayRendererProps['session']): StripePaymentElementSettings {\n const settings = session.settings\n const layout = settings?.layout === 'tabs' || settings?.layout === 'accordion'\n ? settings.layout\n : undefined\n const billingDetails = settings?.billingDetails === 'auto'\n || settings?.billingDetails === 'never'\n || settings?.billingDetails === 'if_required'\n ? settings.billingDetails\n : undefined\n const paymentMethodOrder = Array.isArray(settings?.paymentMethodOrder)\n ? settings.paymentMethodOrder.filter((value): value is string => typeof value === 'string' && value.trim().length > 0)\n : []\n\n return {\n ...(layout ? { layout } : {}),\n ...(billingDetails ? { billingDetails } : {}),\n ...(paymentMethodOrder.length > 0 ? { paymentMethodOrder } : {}),\n }\n}\n\nfunction buildPaymentElementOptions(\n rendererSettings: StripePaymentElementSettings,\n): StripePaymentElementOptions {\n const options: StripePaymentElementOptions = {}\n\n if (rendererSettings.layout) {\n options.layout = rendererSettings.layout\n }\n\n if (rendererSettings.paymentMethodOrder?.length) {\n options.paymentMethodOrder = rendererSettings.paymentMethodOrder\n }\n\n if (rendererSettings.billingDetails === 'auto' || rendererSettings.billingDetails === 'never') {\n options.fields = {\n billingDetails: {\n name: rendererSettings.billingDetails,\n email: rendererSettings.billingDetails,\n phone: rendererSettings.billingDetails,\n address: rendererSettings.billingDetails,\n },\n }\n } else if (rendererSettings.billingDetails === 'if_required') {\n options.fields = {\n billingDetails: {\n address: 'if_required',\n },\n }\n }\n\n return options\n}\n\nfunction StripeEmbeddedPaymentForm({\n returnUrl,\n disabled = false,\n onComplete,\n onError,\n}: {\n returnUrl?: string\n disabled?: boolean\n onComplete: () => void\n onError: (message: string) => void\n}) {\n const t = useT()\n const stripe = useStripe()\n const elements = useElements()\n const [isSubmitting, setIsSubmitting] = React.useState(false)\n\n const handleSubmit = React.useCallback(async () => {\n if (!stripe || !elements) {\n onError(t('gateway_stripe.payments.notReady', 'The Stripe payment form is still loading.'))\n return\n }\n setIsSubmitting(true)\n onError('')\n try {\n const result = await stripe.confirmPayment({\n elements,\n confirmParams: returnUrl ? { return_url: returnUrl } : undefined,\n redirect: 'if_required',\n })\n if (result.error) {\n onError(result.error.message ?? t('gateway_stripe.payments.failed', 'Stripe could not confirm the payment.'))\n return\n }\n onComplete()\n } catch (error) {\n onError(error instanceof Error ? error.message : t('gateway_stripe.payments.failed', 'Stripe could not confirm the payment.'))\n } finally {\n setIsSubmitting(false)\n }\n }, [elements, onComplete, onError, returnUrl, stripe, t])\n\n return (\n <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n <p className=\"text-xs text-muted-foreground\">\n {t('gateway_stripe.payments.helper', 'Use Stripe test mode cards or wallets configured for this account.')}\n </p>\n <Button\n type=\"button\"\n disabled={disabled || isSubmitting || !stripe || !elements}\n onClick={() => { void handleSubmit() }}\n >\n {isSubmitting ? <Spinner className=\"mr-2 size-4\" /> : null}\n {isSubmitting\n ? t('gateway_stripe.payments.processing', 'Confirming payment...')\n : t('gateway_stripe.payments.submit', 'Pay securely')}\n </Button>\n </div>\n )\n}\n\nfunction StripeEmbeddedPaymentRenderer(props: EmbeddedPaymentGatewayRendererProps) {\n const t = useT()\n const payload = readStripePayload(props.session.payload)\n const rendererSettings = React.useMemo(() => readRendererSettings(props.session), [props.session])\n const paymentElementOptions = React.useMemo(\n () => buildPaymentElementOptions(rendererSettings),\n [rendererSettings],\n )\n const onError = props.onError\n const stripePromise = React.useMemo(\n () => (payload.publishableKey ? loadStripe(payload.publishableKey) : null),\n [payload.publishableKey],\n )\n const appearance = React.useMemo(\n () => ({\n theme: 'stripe' as const,\n variables: resolveAppearanceVariables(),\n rules: {\n '.Input': {\n borderRadius: '14px',\n },\n },\n }),\n [],\n )\n\n React.useEffect(() => {\n if (!payload.publishableKey || !payload.clientSecret) {\n onError(t('gateway_stripe.payments.unavailable', 'Stripe is configured for embedded checkout, but the public payment form could not be prepared.'))\n }\n }, [onError, payload.clientSecret, payload.publishableKey, t])\n\n if (!payload.publishableKey || !payload.clientSecret || !stripePromise) {\n return null\n }\n\n return (\n <div className=\"space-y-3 rounded-
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Elements, PaymentElement, useElements, useStripe } from '@stripe/react-stripe-js'\n// Use the `/pure` entry so that Stripe.js is only fetched when `loadStripe`\n// is actually called (i.e., when the embedded payment form renders on a\n// checkout page), instead of as an import side effect that leaks onto every\n// admin route that bootstraps payment renderer registrations.\nimport { loadStripe } from '@stripe/stripe-js/pure'\nimport type { StripePaymentElementOptions } from '@stripe/stripe-js'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport {\n registerEmbeddedPaymentGatewayRenderer,\n type EmbeddedPaymentGatewayRendererProps,\n} from '@open-mercato/shared/modules/payment_gateways/client'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Spinner } from '@open-mercato/ui/primitives/spinner'\nimport type { StripePaymentElementSettings } from '../../lib/shared'\n\ntype StripeRendererPayload = {\n clientSecret?: string\n publishableKey?: string\n returnUrl?: string\n}\n\nfunction readStripePayload(payload: Record<string, unknown> | undefined): StripeRendererPayload {\n return {\n clientSecret: typeof payload?.clientSecret === 'string' ? payload.clientSecret : undefined,\n publishableKey: typeof payload?.publishableKey === 'string' ? payload.publishableKey : undefined,\n returnUrl: typeof payload?.returnUrl === 'string' ? payload.returnUrl : undefined,\n }\n}\n\nfunction resolveAppearanceVariables(): Record<string, string> {\n if (typeof window === 'undefined') {\n return {\n colorPrimary: '#111827',\n colorText: '#111827',\n colorDanger: '#dc2626',\n colorTextPlaceholder: '#6b7280',\n }\n }\n const styles = window.getComputedStyle(document.documentElement)\n return {\n colorPrimary: `hsl(${styles.getPropertyValue('--foreground').trim() || '222.2 84% 4.9%'})`,\n colorText: `hsl(${styles.getPropertyValue('--foreground').trim() || '222.2 84% 4.9%'})`,\n colorDanger: `hsl(${styles.getPropertyValue('--destructive').trim() || '0 84.2% 60.2%'})`,\n colorTextPlaceholder: `hsl(${styles.getPropertyValue('--muted-foreground').trim() || '215.4 16.3% 46.9%'})`,\n }\n}\n\nfunction readRendererSettings(session: EmbeddedPaymentGatewayRendererProps['session']): StripePaymentElementSettings {\n const settings = session.settings\n const layout = settings?.layout === 'tabs' || settings?.layout === 'accordion'\n ? settings.layout\n : undefined\n const billingDetails = settings?.billingDetails === 'auto'\n || settings?.billingDetails === 'never'\n || settings?.billingDetails === 'if_required'\n ? settings.billingDetails\n : undefined\n const paymentMethodOrder = Array.isArray(settings?.paymentMethodOrder)\n ? settings.paymentMethodOrder.filter((value): value is string => typeof value === 'string' && value.trim().length > 0)\n : []\n\n return {\n ...(layout ? { layout } : {}),\n ...(billingDetails ? { billingDetails } : {}),\n ...(paymentMethodOrder.length > 0 ? { paymentMethodOrder } : {}),\n }\n}\n\nfunction buildPaymentElementOptions(\n rendererSettings: StripePaymentElementSettings,\n): StripePaymentElementOptions {\n const options: StripePaymentElementOptions = {}\n\n if (rendererSettings.layout) {\n options.layout = rendererSettings.layout\n }\n\n if (rendererSettings.paymentMethodOrder?.length) {\n options.paymentMethodOrder = rendererSettings.paymentMethodOrder\n }\n\n if (rendererSettings.billingDetails === 'auto' || rendererSettings.billingDetails === 'never') {\n options.fields = {\n billingDetails: {\n name: rendererSettings.billingDetails,\n email: rendererSettings.billingDetails,\n phone: rendererSettings.billingDetails,\n address: rendererSettings.billingDetails,\n },\n }\n } else if (rendererSettings.billingDetails === 'if_required') {\n options.fields = {\n billingDetails: {\n address: 'if_required',\n },\n }\n }\n\n return options\n}\n\nfunction StripeEmbeddedPaymentForm({\n returnUrl,\n disabled = false,\n onComplete,\n onError,\n}: {\n returnUrl?: string\n disabled?: boolean\n onComplete: () => void\n onError: (message: string) => void\n}) {\n const t = useT()\n const stripe = useStripe()\n const elements = useElements()\n const [isSubmitting, setIsSubmitting] = React.useState(false)\n\n const handleSubmit = React.useCallback(async () => {\n if (!stripe || !elements) {\n onError(t('gateway_stripe.payments.notReady', 'The Stripe payment form is still loading.'))\n return\n }\n setIsSubmitting(true)\n onError('')\n try {\n const result = await stripe.confirmPayment({\n elements,\n confirmParams: returnUrl ? { return_url: returnUrl } : undefined,\n redirect: 'if_required',\n })\n if (result.error) {\n onError(result.error.message ?? t('gateway_stripe.payments.failed', 'Stripe could not confirm the payment.'))\n return\n }\n onComplete()\n } catch (error) {\n onError(error instanceof Error ? error.message : t('gateway_stripe.payments.failed', 'Stripe could not confirm the payment.'))\n } finally {\n setIsSubmitting(false)\n }\n }, [elements, onComplete, onError, returnUrl, stripe, t])\n\n return (\n <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n <p className=\"text-xs text-muted-foreground\">\n {t('gateway_stripe.payments.helper', 'Use Stripe test mode cards or wallets configured for this account.')}\n </p>\n <Button\n type=\"button\"\n disabled={disabled || isSubmitting || !stripe || !elements}\n onClick={() => { void handleSubmit() }}\n >\n {isSubmitting ? <Spinner className=\"mr-2 size-4\" /> : null}\n {isSubmitting\n ? t('gateway_stripe.payments.processing', 'Confirming payment...')\n : t('gateway_stripe.payments.submit', 'Pay securely')}\n </Button>\n </div>\n )\n}\n\nfunction StripeEmbeddedPaymentRenderer(props: EmbeddedPaymentGatewayRendererProps) {\n const t = useT()\n const payload = readStripePayload(props.session.payload)\n const rendererSettings = React.useMemo(() => readRendererSettings(props.session), [props.session])\n const paymentElementOptions = React.useMemo(\n () => buildPaymentElementOptions(rendererSettings),\n [rendererSettings],\n )\n const onError = props.onError\n const stripePromise = React.useMemo(\n () => (payload.publishableKey ? loadStripe(payload.publishableKey) : null),\n [payload.publishableKey],\n )\n const appearance = React.useMemo(\n () => ({\n theme: 'stripe' as const,\n variables: resolveAppearanceVariables(),\n rules: {\n '.Input': {\n borderRadius: '14px',\n },\n },\n }),\n [],\n )\n\n React.useEffect(() => {\n if (!payload.publishableKey || !payload.clientSecret) {\n onError(t('gateway_stripe.payments.unavailable', 'Stripe is configured for embedded checkout, but the public payment form could not be prepared.'))\n }\n }, [onError, payload.clientSecret, payload.publishableKey, t])\n\n if (!payload.publishableKey || !payload.clientSecret || !stripePromise) {\n return null\n }\n\n return (\n <div className=\"space-y-3 rounded-xl border border-border/70 bg-white/80 p-4 shadow-sm backdrop-blur\">\n <div className=\"space-y-1\">\n <p className=\"text-sm font-semibold\">{t('gateway_stripe.payments.title', 'Secure Stripe payment')}</p>\n <p className=\"text-sm text-muted-foreground\">\n {t('gateway_stripe.payments.description', 'Complete the payment below without leaving this page.')}\n </p>\n </div>\n <Elements\n stripe={stripePromise}\n options={{\n clientSecret: payload.clientSecret,\n appearance,\n }}\n >\n <div className=\"space-y-4\">\n <div className=\"rounded-xl border bg-background px-4 py-4 shadow-sm\">\n <PaymentElement options={paymentElementOptions} />\n </div>\n <StripeEmbeddedPaymentForm\n returnUrl={payload.returnUrl}\n disabled={props.disabled}\n onComplete={props.onComplete}\n onError={onError}\n />\n </div>\n </Elements>\n </div>\n )\n}\n\nregisterEmbeddedPaymentGatewayRenderer({\n providerKey: 'stripe',\n rendererKey: 'stripe.payment_element',\n Component: StripeEmbeddedPaymentRenderer,\n})\n\nexport default null\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@open-mercato/gateway-stripe",
|
|
3
|
-
"version": "0.5.1-develop.
|
|
3
|
+
"version": "0.5.1-develop.2874.77704bccbd",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -61,20 +61,20 @@
|
|
|
61
61
|
}
|
|
62
62
|
},
|
|
63
63
|
"dependencies": {
|
|
64
|
-
"@open-mercato/core": "0.5.1-develop.
|
|
65
|
-
"@open-mercato/queue": "0.5.1-develop.
|
|
66
|
-
"@open-mercato/ui": "0.5.1-develop.
|
|
64
|
+
"@open-mercato/core": "0.5.1-develop.2874.77704bccbd",
|
|
65
|
+
"@open-mercato/queue": "0.5.1-develop.2874.77704bccbd",
|
|
66
|
+
"@open-mercato/ui": "0.5.1-develop.2874.77704bccbd",
|
|
67
67
|
"@stripe/react-stripe-js": "^6.2.0",
|
|
68
68
|
"@stripe/stripe-js": "^9.2.0",
|
|
69
69
|
"stripe": "^22.0.2"
|
|
70
70
|
},
|
|
71
71
|
"peerDependencies": {
|
|
72
72
|
"@mikro-orm/postgresql": "^7.0.10",
|
|
73
|
-
"@open-mercato/shared": "0.5.1-develop.
|
|
73
|
+
"@open-mercato/shared": "0.5.1-develop.2874.77704bccbd",
|
|
74
74
|
"react": "^19.0.0"
|
|
75
75
|
},
|
|
76
76
|
"devDependencies": {
|
|
77
|
-
"@open-mercato/shared": "0.5.1-develop.
|
|
77
|
+
"@open-mercato/shared": "0.5.1-develop.2874.77704bccbd",
|
|
78
78
|
"@types/jest": "^30.0.0",
|
|
79
79
|
"esbuild": "^0.28.0",
|
|
80
80
|
"glob": "^13.0.6",
|
|
@@ -200,7 +200,7 @@ function StripeEmbeddedPaymentRenderer(props: EmbeddedPaymentGatewayRendererProp
|
|
|
200
200
|
}
|
|
201
201
|
|
|
202
202
|
return (
|
|
203
|
-
<div className="space-y-3 rounded-
|
|
203
|
+
<div className="space-y-3 rounded-xl border border-border/70 bg-white/80 p-4 shadow-sm backdrop-blur">
|
|
204
204
|
<div className="space-y-1">
|
|
205
205
|
<p className="text-sm font-semibold">{t('gateway_stripe.payments.title', 'Secure Stripe payment')}</p>
|
|
206
206
|
<p className="text-sm text-muted-foreground">
|
|
@@ -215,7 +215,7 @@ function StripeEmbeddedPaymentRenderer(props: EmbeddedPaymentGatewayRendererProp
|
|
|
215
215
|
}}
|
|
216
216
|
>
|
|
217
217
|
<div className="space-y-4">
|
|
218
|
-
<div className="rounded-
|
|
218
|
+
<div className="rounded-xl border bg-background px-4 py-4 shadow-sm">
|
|
219
219
|
<PaymentElement options={paymentElementOptions} />
|
|
220
220
|
</div>
|
|
221
221
|
<StripeEmbeddedPaymentForm
|