@easypayment/medusa-paypal-ui 1.0.41 → 1.0.42

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.
Files changed (10) hide show
  1. package/dist/index.cjs +134 -137
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +0 -43
  4. package/dist/index.d.ts +0 -43
  5. package/dist/index.mjs +134 -137
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
  8. package/src/adapters/MedusaNextPayPalAdapter.tsx +0 -16
  9. package/src/components/PayPalPaymentSection.tsx +0 -86
  10. package/src/components/PayPalSmartButtons.tsx +0 -6
package/dist/index.cjs CHANGED
@@ -194,149 +194,146 @@ function PayPalSmartButtons(props) {
194
194
  const [processing, setProcessing] = react.useState(false);
195
195
  if (!config.currency_supported) return null;
196
196
  const containerWidth = BUTTON_WIDTH_MAP[config.button_width ?? "responsive"] ?? "100%";
197
- return (
198
- // ── CHANGED: added position: relative so the overlay can sit on top ──────
199
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { width: containerWidth, position: "relative" }, children: [
200
- /* @__PURE__ */ jsxRuntime.jsx("style", { children: SPIN_STYLE }),
201
- processing && /* @__PURE__ */ jsxRuntime.jsxs(
202
- "div",
203
- {
204
- style: {
205
- position: "absolute",
206
- inset: 0,
207
- zIndex: 10,
208
- background: "rgba(255,255,255,0.90)",
209
- borderRadius: 8,
210
- display: "flex",
211
- flexDirection: "column",
212
- alignItems: "center",
213
- justifyContent: "center",
214
- gap: 10,
215
- minHeight: 60
216
- },
217
- children: [
218
- /* @__PURE__ */ jsxRuntime.jsx(
219
- "div",
220
- {
221
- style: {
222
- width: 28,
223
- height: 28,
224
- borderRadius: "50%",
225
- border: "2.5px solid #e5e7eb",
226
- borderTopColor: "#0070ba",
227
- animation: "_pp_spin .7s linear infinite"
228
- }
229
- }
230
- ),
231
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "center" }, children: [
232
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 13, color: "#374151", fontWeight: 500 }, children: "Processing your payment\u2026" }),
233
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 12, color: "#6b7280", marginTop: 4 }, children: "Please do not close or refresh this page" })
234
- ] })
235
- ]
236
- }
237
- ),
238
- config.environment === "sandbox" && /* @__PURE__ */ jsxRuntime.jsxs(
239
- "div",
240
- {
241
- style: {
242
- display: "flex",
243
- alignItems: "flex-start",
244
- gap: 8,
245
- padding: "10px 14px",
246
- background: "#eff6ff",
247
- border: "1px solid #bfdbfe",
248
- borderRadius: 8,
249
- fontSize: 13,
250
- color: "#1e40af",
251
- lineHeight: 1.5,
252
- marginBottom: 10
253
- },
254
- children: [
255
- /* @__PURE__ */ jsxRuntime.jsxs(
256
- "svg",
257
- {
258
- width: "16",
259
- height: "16",
260
- viewBox: "0 0 24 24",
261
- fill: "none",
262
- stroke: "#1e40af",
263
- strokeWidth: "2",
264
- strokeLinecap: "round",
265
- style: { flexShrink: 0, marginTop: 1 },
266
- children: [
267
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
268
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 8v4M12 16h.01" })
269
- ]
197
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { width: containerWidth, position: "relative" }, children: [
198
+ /* @__PURE__ */ jsxRuntime.jsx("style", { children: SPIN_STYLE }),
199
+ processing && /* @__PURE__ */ jsxRuntime.jsxs(
200
+ "div",
201
+ {
202
+ style: {
203
+ position: "absolute",
204
+ inset: 0,
205
+ zIndex: 10,
206
+ background: "rgba(255,255,255,0.90)",
207
+ borderRadius: 8,
208
+ display: "flex",
209
+ flexDirection: "column",
210
+ alignItems: "center",
211
+ justifyContent: "center",
212
+ gap: 10,
213
+ minHeight: 60
214
+ },
215
+ children: [
216
+ /* @__PURE__ */ jsxRuntime.jsx(
217
+ "div",
218
+ {
219
+ style: {
220
+ width: 28,
221
+ height: 28,
222
+ borderRadius: "50%",
223
+ border: "2.5px solid #e5e7eb",
224
+ borderTopColor: "#0070ba",
225
+ animation: "_pp_spin .7s linear infinite"
270
226
  }
271
- ),
272
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Sandbox mode \u2014 you will not be charged. Use your PayPal sandbox account to complete the payment." })
273
- ]
274
- }
275
- ),
276
- /* @__PURE__ */ jsxRuntime.jsx(
277
- reactPaypalJs.PayPalButtons,
278
- {
279
- style: {
280
- layout: "vertical",
281
- color: config.button_color,
282
- shape: config.button_shape,
283
- label: config.button_label,
284
- height: config.button_height
285
- },
286
- createOrder: async () => {
287
- setError(null);
288
- const r = await api.createOrder(cartId);
289
- return r.id;
290
- },
291
- onApprove: async (data) => {
292
- try {
293
- setProcessing(true);
294
- setError(null);
295
- const orderId = String(data?.orderID || "");
296
- const result = await api.captureOrder(cartId, orderId);
297
- onPaid?.(result);
298
- } catch (e) {
299
- const msg = e instanceof Error ? e.message : "Payment capture failed";
300
- setError(msg);
301
- onError?.(msg);
302
- setProcessing(false);
303
227
  }
304
- },
305
- onCancel: () => {
306
- setProcessing(false);
307
- },
308
- onError: (err) => {
309
- setProcessing(false);
310
- const msg = err instanceof Error ? err.message : err?.message || "PayPal error";
228
+ ),
229
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "center" }, children: [
230
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 13, color: "#374151", fontWeight: 500 }, children: "Processing your payment\u2026" }),
231
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 12, color: "#6b7280", marginTop: 4 }, children: "Please do not close or refresh this page" })
232
+ ] })
233
+ ]
234
+ }
235
+ ),
236
+ config.environment === "sandbox" && /* @__PURE__ */ jsxRuntime.jsxs(
237
+ "div",
238
+ {
239
+ style: {
240
+ display: "flex",
241
+ alignItems: "flex-start",
242
+ gap: 8,
243
+ padding: "10px 14px",
244
+ background: "#eff6ff",
245
+ border: "1px solid #bfdbfe",
246
+ borderRadius: 8,
247
+ fontSize: 13,
248
+ color: "#1e40af",
249
+ lineHeight: 1.5,
250
+ marginBottom: 10
251
+ },
252
+ children: [
253
+ /* @__PURE__ */ jsxRuntime.jsxs(
254
+ "svg",
255
+ {
256
+ width: "16",
257
+ height: "16",
258
+ viewBox: "0 0 24 24",
259
+ fill: "none",
260
+ stroke: "#1e40af",
261
+ strokeWidth: "2",
262
+ strokeLinecap: "round",
263
+ style: { flexShrink: 0, marginTop: 1 },
264
+ children: [
265
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
266
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 8v4M12 16h.01" })
267
+ ]
268
+ }
269
+ ),
270
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Sandbox mode \u2014 you will not be charged. Use your PayPal sandbox account to complete the payment." })
271
+ ]
272
+ }
273
+ ),
274
+ /* @__PURE__ */ jsxRuntime.jsx(
275
+ reactPaypalJs.PayPalButtons,
276
+ {
277
+ style: {
278
+ layout: "vertical",
279
+ color: config.button_color,
280
+ shape: config.button_shape,
281
+ label: config.button_label,
282
+ height: config.button_height
283
+ },
284
+ createOrder: async () => {
285
+ setError(null);
286
+ const r = await api.createOrder(cartId);
287
+ return r.id;
288
+ },
289
+ onApprove: async (data) => {
290
+ try {
291
+ setProcessing(true);
292
+ setError(null);
293
+ const orderId = String(data?.orderID || "");
294
+ const result = await api.captureOrder(cartId, orderId);
295
+ onPaid?.(result);
296
+ } catch (e) {
297
+ const msg = e instanceof Error ? e.message : "Payment capture failed";
311
298
  setError(msg);
312
299
  onError?.(msg);
300
+ setProcessing(false);
313
301
  }
302
+ },
303
+ onCancel: () => {
304
+ setProcessing(false);
305
+ },
306
+ onError: (err) => {
307
+ setProcessing(false);
308
+ const msg = err instanceof Error ? err.message : err?.message || "PayPal error";
309
+ setError(msg);
310
+ onError?.(msg);
314
311
  }
315
- ),
316
- error ? /* @__PURE__ */ jsxRuntime.jsxs(
317
- "div",
318
- {
319
- style: {
320
- marginTop: 10,
321
- display: "flex",
322
- alignItems: "flex-start",
323
- gap: 8,
324
- padding: "10px 14px",
325
- background: "#fef2f2",
326
- border: "1px solid #fecaca",
327
- borderRadius: 8,
328
- fontSize: 13,
329
- color: "#b91c1c",
330
- lineHeight: 1.5
331
- },
332
- children: [
333
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { flexShrink: 0, fontSize: 15 }, children: "\u26A0\uFE0F" }),
334
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: error })
335
- ]
336
- }
337
- ) : null
338
- ] })
339
- );
312
+ }
313
+ ),
314
+ error ? /* @__PURE__ */ jsxRuntime.jsxs(
315
+ "div",
316
+ {
317
+ style: {
318
+ marginTop: 10,
319
+ display: "flex",
320
+ alignItems: "flex-start",
321
+ gap: 8,
322
+ padding: "10px 14px",
323
+ background: "#fef2f2",
324
+ border: "1px solid #fecaca",
325
+ borderRadius: 8,
326
+ fontSize: 13,
327
+ color: "#b91c1c",
328
+ lineHeight: 1.5
329
+ },
330
+ children: [
331
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { flexShrink: 0, fontSize: 15 }, children: "\u26A0\uFE0F" }),
332
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: error })
333
+ ]
334
+ }
335
+ ) : null
336
+ ] });
340
337
  }
341
338
  var SPIN_STYLE2 = `@keyframes _pp_spin { to { transform: rotate(360deg) } }`;
342
339
  var cardStyle = {