npm - @pandait.tech/payment-nuvei - Versions diffs - 0.2.0 → 0.3.0 - Mend

@pandait.tech/payment-nuvei 0.2.0 → 0.3.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.

Files changed (9) hide show

package/README.md +37 -18
package/dist/handlers/index.cjs +84 -26
package/dist/handlers/index.cjs.map +1 -1
package/dist/handlers/index.d.cts +5 -4
package/dist/handlers/index.d.ts +5 -4
package/dist/handlers/index.js +84 -26
package/dist/handlers/index.js.map +1 -1
package/dist/ui/styles.css +2 -0
package/package.json +6 -2

package/README.md CHANGED Viewed

@@ -141,9 +141,44 @@ A production-validated implementation of both (`threeDSCallback` + `nuveiProxy`,
 ## UI components — usage
-All `/ui` exports are client components (`"use client"`) and expect a Tailwind setup. The components consume CSS variables for theming so the same components work for every white-label client with their own branding.
+All `/ui` exports are client components (`"use client"`). They consume CSS variables for theming so the same components work for every white-label client with their own branding.
-### 1. Define CSS variables in your global stylesheet
+### 1. Load the styles
+You have two options. **Option A is recommended** — it works without Tailwind, on any Tailwind version, and doesn't require configuring your build to scan this package.
+**Option A — import the prebuilt stylesheet (recommended, standalone):**
+```ts
+// once, e.g. in app/layout.tsx or your global entry
+import "@pandait.tech/payment-nuvei/ui/styles.css";
+```
+This ships the exact utility classes the components use (no Tailwind Preflight/reset — it won't touch your page's base styles). You still define the brand tokens (step 2) for theming.
+**Option B — let your own Tailwind build the classes (Tailwind v4 users):**
+Skip the CSS import and instead point Tailwind at the package so it generates the classes itself. Tailwind **v4** (`@source` in your CSS):
+```css
+@import "tailwindcss";
+@source "../node_modules/@pandait.tech/payment-nuvei/dist/**/*.{js,cjs}";
+```
+Tailwind **v3** (`content` in `tailwind.config`):
+```js
+export default {
+  content: [
+    "./app/**/*.{ts,tsx}",
+    "./node_modules/@pandait.tech/payment-nuvei/dist/**/*.{js,cjs}",
+  ],
+};
+```
+> If components render unstyled, you forgot Option A's import or Option B's `@source`/`content` entry. Option A removes that failure mode entirely.
+### 2. Define CSS variables in your global stylesheet
 Add this to your `app/globals.css` (Next.js) or equivalent, in `:root`:
@@ -177,22 +212,6 @@ Add this to your `app/globals.css` (Next.js) or equivalent, in `:root`:
 }
 ```
-### 2. Add the package to Tailwind's content config
-Tailwind needs to detect the arbitrary-value utility classes (e.g. `bg-[var(--color-primary)]`) inside the package's compiled output:
-```js
-// tailwind.config.ts
-export default {
-  content: [
-    "./app/**/*.{ts,tsx}",
-    "./src/**/*.{ts,tsx}",
-    "./node_modules/@pandait.tech/payment-nuvei/dist/**/*.{js,cjs}",
-  ],
-  // ...
-};
-```
 ### 3. Use the components
 ```tsx

package/dist/handlers/index.cjs CHANGED Viewed

@@ -922,7 +922,43 @@ function createWebhookHandler(deps) {
 }
 // src/handlers/3ds-callback.ts
+function pickCres(src) {
+  for (const key of Object.keys(src)) {
+    const k = key.toLowerCase();
+    if (k === "cres" || k === "cres_value" || k === "cresvalue" || k === "value" || k === "param.value" || k === "paramvalue") {
+      const v = src[key];
+      if (typeof v === "string" && v.length > 0) return v;
+    }
+  }
+  return src.cres || src.CRes || src.CRES || src.value || "";
+}
+function transStatusFromCres(cres, logger) {
+  try {
+    const base64 = cres.replace(/-/g, "+").replace(/_/g, "/");
+    const pad = base64.length % 4;
+    const padded = pad ? base64 + "=".repeat(4 - pad) : base64;
+    const decoded = JSON.parse(
+      Buffer.from(padded, "base64").toString("utf-8")
+    );
+    if (decoded && typeof decoded.transStatus === "string") {
+      return decoded.transStatus;
+    }
+  } catch (e) {
+    logger.warn(
+      "[3ds-callback] Could not decode CRES payload:",
+      e instanceof Error ? e.message : e
+    );
+  }
+  return null;
+}
+function paramsToObject(params) {
+  const obj = {};
+  for (const [k, v] of params.entries()) obj[k] = v;
+  return obj;
+}
 function buildCompletionPage(orderId, transStatus) {
+  const safeOrderId = String(orderId).replace(/[^a-zA-Z0-9_-]/g, "");
+  const safeTransStatus = String(transStatus).replace(/[^a-zA-Z0-9]/g, "");
   const html = `<!DOCTYPE html>
 <html><head><meta charset="utf-8"><title>3DS Verification</title></head>
 <body>
@@ -930,8 +966,8 @@ function buildCompletionPage(orderId, transStatus) {
 (function() {
   var message = {
     type: "3DS_COMPLETE",
-    orderId: "${orderId}",
-    transStatus: "${transStatus}"
+    orderId: "${safeOrderId}",
+    transStatus: "${safeTransStatus}"
   };
   try {
     if (window.parent && window.parent !== window) {
@@ -954,46 +990,68 @@ Verificando autenticaci&oacute;n...
 function create3dsCallbackHandler(deps) {
   const logger = deps.logger ?? console;
   const { db } = deps.firebase;
-  async function storeCres(orderId, cres) {
-    if (orderId && cres) {
-      try {
-        await db.collection("orders").doc(orderId).update({
-          threeDSCres: cres,
-          updatedAt: /* @__PURE__ */ new Date()
-        });
-      } catch (err) {
-        logger.error("Failed to store cres on order:", err);
+  async function persist(orderId, cres, transStatus) {
+    if (!orderId) return;
+    try {
+      const ref = db.collection("orders").doc(orderId);
+      const snap = await ref.get();
+      const status = snap.data()?.status;
+      if (!snap.exists || status !== "3ds-pending") {
+        logger.warn(
+          "[3ds-callback] rejected: order not in 3ds-pending state",
+          { orderId, status }
+        );
+        return;
       }
+      const update = { updatedAt: /* @__PURE__ */ new Date() };
+      if (cres) update.threeDSCres = cres;
+      if (transStatus) update.threeDSTransStatus = transStatus;
+      await ref.update(update);
+    } catch (err) {
+      logger.error("[3ds-callback] failed to store cres on order:", err);
     }
   }
+  function resolveTransStatus(cres, fallback) {
+    if (cres) {
+      const fromCres = transStatusFromCres(cres, logger);
+      if (fromCres) return fromCres;
+    }
+    return fallback;
+  }
   const POST = async function POST2(request) {
-    const { searchParams } = new URL(request.url);
-    const orderId = searchParams.get("orderId") || "";
+    const orderId = new URL(request.url).searchParams.get("orderId") || "";
     let transStatus = "U";
     let cres = "";
     try {
       const contentType = request.headers.get("content-type") || "";
+      const raw = await request.text();
       if (contentType.includes("application/x-www-form-urlencoded")) {
-        const text = await request.text();
-        const params = new URLSearchParams(text);
-        transStatus = params.get("transStatus") || "U";
-        cres = params.get("cres") || params.get("CRes") || "";
+        const obj = paramsToObject(new URLSearchParams(raw));
+        transStatus = obj.transStatus || obj.TransStatus || "U";
+        cres = pickCres(obj);
       } else {
-        const body = await request.json();
-        transStatus = body.transStatus || "U";
-        cres = body.cres || body.CRes || "";
+        try {
+          const body = JSON.parse(raw);
+          transStatus = body.transStatus || body.TransStatus || "U";
+          cres = pickCres(body);
+        } catch {
+        }
+      }
+      if (!cres && raw) {
+        cres = pickCres(paramsToObject(new URLSearchParams(raw)));
       }
     } catch {
     }
-    await storeCres(orderId, cres);
+    transStatus = resolveTransStatus(cres, transStatus);
+    await persist(orderId, cres, transStatus);
     return buildCompletionPage(orderId, transStatus);
   };
   const GET = async function GET2(request) {
-    const { searchParams } = new URL(request.url);
-    const orderId = searchParams.get("orderId") || "";
-    const transStatus = searchParams.get("transStatus") || "Y";
-    const cres = searchParams.get("cres") || searchParams.get("CRes") || "";
-    await storeCres(orderId, cres);
+    const params = new URL(request.url).searchParams;
+    const orderId = params.get("orderId") || "";
+    const cres = params.get("cres") || params.get("CRes") || params.get("value") || "";
+    const transStatus = resolveTransStatus(cres, params.get("transStatus") || "Y");
+    await persist(orderId, cres, transStatus);
     return buildCompletionPage(orderId, transStatus);
   };
   return { POST, GET };