@instockng/storefront-ui 1.0.27 → 1.0.29

package/dist/index99.mjs

@@ -1,42 +1,183 @@
 'use client';
-import { __exports as l } from "./index177.mjs";
-import { __require as _ } from "./index81.mjs";
-import { __require as v } from "./index178.mjs";
-import { __require as q } from "./index174.mjs";
-var s;
-function N() {
-  return s ? l : (s = 1, function(h) {
-    Object.defineProperty(h, "__esModule", {
+import { __module as L } from "./index155.mjs";
+import "./index69.mjs";
+import { __require as K } from "./index96.mjs";
+import F from "react/jsx-runtime";
+import J from "react-dom";
+import N from "react";
+import { __require as B } from "./index156.mjs";
+import { __require as D } from "./index157.mjs";
+import { __require as G } from "./index152.mjs";
+import { __exports as Q } from "./index74.mjs";
+var w;
+function ie() {
+  return w ? L.exports : (w = 1, function(x, o) {
+    "use client";
+    Object.defineProperty(o, "__esModule", {
       value: !0
-    }), Object.defineProperty(h, "getNextPathnameInfo", {
-      enumerable: !0,
-      get: function() {
-        return p;
+    });
+    function M(t, e) {
+      for (var n in e) Object.defineProperty(t, n, {
+        enumerable: !0,
+        get: e[n]
+      });
+    }
+    M(o, {
+      default: function() {
+        return z;
+      },
+      handleClientScriptLoad: function() {
+        return C;
+      },
+      initScriptLoader: function() {
+        return $;
       }
     });
-    const c = _(), u = v(), d = q();
-    function p(i, t) {
-      var f;
-      const { basePath: r, i18n: o, trailingSlash: P } = (f = t.nextConfig) != null ? f : {}, e = {
-        pathname: i,
-        trailingSlash: i !== "/" ? i.endsWith("/") : P
-      };
-      r && (0, d.pathHasPrefix)(e.pathname, r) && (e.pathname = (0, u.removePathPrefix)(e.pathname, r), e.basePath = r);
-      let n = e.pathname;
-      if (e.pathname.startsWith("/_next/data/") && e.pathname.endsWith(".json")) {
-        const a = e.pathname.replace(/^\/_next\/data\//, "").replace(/\.json$/, "").split("/"), x = a[0];
-        e.buildId = x, n = a[1] !== "index" ? "/" + a.slice(1).join("/") : "/", t.parseData === !0 && (e.pathname = n);
+    const j = Q, P = K(), O = F, h = /* @__PURE__ */ j._(J), g = /* @__PURE__ */ P._(N), R = B(), k = D(), I = G(), v = /* @__PURE__ */ new Map(), p = /* @__PURE__ */ new Set(), A = (t) => {
+      if (h.default.preinit) {
+        t.forEach((e) => {
+          h.default.preinit(e, {
+            as: "style"
+          });
+        });
+        return;
+      }
+      if (typeof window < "u") {
+        let e = document.head;
+        t.forEach((n) => {
+          let s = document.createElement("link");
+          s.type = "text/css", s.rel = "stylesheet", s.href = n, e.appendChild(s);
+        });
       }
-      if (o) {
-        let a = t.i18nProvider ? t.i18nProvider.analyze(e.pathname) : (0, c.normalizeLocalePath)(e.pathname, o.locales);
-        e.locale = a.detectedLocale;
-        var m;
-        e.pathname = (m = a.pathname) != null ? m : e.pathname, !a.detectedLocale && e.buildId && (a = t.i18nProvider ? t.i18nProvider.analyze(n) : (0, c.normalizeLocalePath)(n, o.locales), a.detectedLocale && (e.locale = a.detectedLocale));
+    }, y = (t) => {
+      const { src: e, id: n, onLoad: s = () => {
+      }, onReady: l = null, dangerouslySetInnerHTML: i, children: _ = "", strategy: S = "afterInteractive", onError: r, stylesheets: q } = t, c = n || e;
+      if (c && p.has(c))
+        return;
+      if (v.has(e)) {
+        p.add(c), v.get(e).then(s, r);
+        return;
+      }
+      const d = () => {
+        l && l(), p.add(c);
+      }, a = document.createElement("script"), u = new Promise((m, b) => {
+        a.addEventListener("load", function(f) {
+          m(), s && s.call(this, f), d();
+        }), a.addEventListener("error", function(f) {
+          b(f);
+        });
+      }).catch(function(m) {
+        r && r(m);
+      });
+      i ? (a.innerHTML = i.__html || "", d()) : _ ? (a.textContent = typeof _ == "string" ? _ : Array.isArray(_) ? _.join("") : "", d()) : e && (a.src = e, v.set(e, u)), (0, k.setAttributesFromProps)(a, t), S === "worker" && a.setAttribute("type", "text/partytown"), a.setAttribute("data-nscript", S), q && A(q), document.body.appendChild(a);
+    };
+    function C(t) {
+      const { strategy: e = "afterInteractive" } = t;
+      e === "lazyOnload" ? window.addEventListener("load", () => {
+        (0, I.requestIdleCallback)(() => y(t));
+      }) : y(t);
+    }
+    function H(t) {
+      document.readyState === "complete" ? (0, I.requestIdleCallback)(() => y(t)) : window.addEventListener("load", () => {
+        (0, I.requestIdleCallback)(() => y(t));
+      });
+    }
+    function T() {
+      [
+        ...document.querySelectorAll('[data-nscript="beforeInteractive"]'),
+        ...document.querySelectorAll('[data-nscript="beforePageRender"]')
+      ].forEach((e) => {
+        const n = e.id || e.getAttribute("src");
+        p.add(n);
+      });
+    }
+    function $(t) {
+      t.forEach(C), T();
+    }
+    function E(t) {
+      const { id: e, src: n = "", onLoad: s = () => {
+      }, onReady: l = null, strategy: i = "afterInteractive", onError: _, stylesheets: S, ...r } = t, { updateScripts: q, scripts: c, getIsSsr: d, appDir: a, nonce: u } = (0, g.useContext)(R.HeadManagerContext), m = (0, g.useRef)(!1);
+      (0, g.useEffect)(() => {
+        const f = e || n;
+        m.current || (l && f && p.has(f) && l(), m.current = !0);
+      }, [
+        l,
+        e,
+        n
+      ]);
+      const b = (0, g.useRef)(!1);
+      if ((0, g.useEffect)(() => {
+        b.current || (i === "afterInteractive" ? y(t) : i === "lazyOnload" && H(t), b.current = !0);
+      }, [
+        t,
+        i
+      ]), (i === "beforeInteractive" || i === "worker") && (q ? (c[i] = (c[i] || []).concat([
+        {
+          id: e,
+          src: n,
+          onLoad: s,
+          onReady: l,
+          onError: _,
+          ...r
+        }
+      ]), q(c)) : d && d() ? p.add(e || n) : d && !d() && y(t)), a) {
+        if (S && S.forEach((f) => {
+          h.default.preinit(f, {
+            as: "style"
+          });
+        }), i === "beforeInteractive")
+          return n ? (h.default.preload(n, r.integrity ? {
+            as: "script",
+            integrity: r.integrity,
+            nonce: u,
+            crossOrigin: r.crossOrigin
+          } : {
+            as: "script",
+            nonce: u,
+            crossOrigin: r.crossOrigin
+          }), /* @__PURE__ */ (0, O.jsx)("script", {
+            nonce: u,
+            dangerouslySetInnerHTML: {
+              __html: "(self.__next_s=self.__next_s||[]).push(" + JSON.stringify([
+                n,
+                {
+                  ...r,
+                  id: e
+                }
+              ]) + ")"
+            }
+          })) : (r.dangerouslySetInnerHTML && (r.children = r.dangerouslySetInnerHTML.__html, delete r.dangerouslySetInnerHTML), /* @__PURE__ */ (0, O.jsx)("script", {
+            nonce: u,
+            dangerouslySetInnerHTML: {
+              __html: "(self.__next_s=self.__next_s||[]).push(" + JSON.stringify([
+                0,
+                {
+                  ...r,
+                  id: e
+                }
+              ]) + ")"
+            }
+          }));
+        i === "afterInteractive" && n && h.default.preload(n, r.integrity ? {
+          as: "script",
+          integrity: r.integrity,
+          nonce: u,
+          crossOrigin: r.crossOrigin
+        } : {
+          as: "script",
+          nonce: u,
+          crossOrigin: r.crossOrigin
+        });
       }
-      return e;
+      return null;
     }
-  }(l), l);
+    Object.defineProperty(E, "__nextScript", {
+      value: !0
+    });
+    const z = E;
+    (typeof o.default == "function" || typeof o.default == "object" && o.default !== null) && typeof o.default.__esModule > "u" && (Object.defineProperty(o.default, "__esModule", { value: !0 }), Object.assign(o.default, o), x.exports = o.default);
+  }(L, L.exports), L.exports);
 }
 export {
-  N as __require
+  ie as __require
 };

package/dist/lib/utils.d.ts

@@ -4,4 +4,12 @@ export declare function formatCurrency(amount: number): string;
 export declare function formatDate(date: string | Date): string;
 export declare function formatDateTime(date: string | Date): string;
 export declare function getStatusColor(status: string): string;
+/**
+ * Extract Facebook attribution cookies (fbc & fbp) for Meta Pixel CAPI
+ * @returns Object with fbc (Facebook Click ID) and fbp (Facebook Browser ID) cookies
+ */
+export declare function getFbCookies(): {
+    fbc: string | undefined;
+    fbp: string | undefined;
+};
 //# sourceMappingURL=utils.d.ts.map

package/dist/lib/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAA;AAG5C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAKrD;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAOtD;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAS1D;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAUrD"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAA;AAG5C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAKrD;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAOtD;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAS1D;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAUrD;AAED;;;GAGG;AACH,wBAAgB,YAAY,IAAI;IAAE,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IAAC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAA;CAAE,CAcnF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instockng/storefront-ui",
-  "version": "1.0.27",
+  "version": "1.0.29",
   "description": "Pre-built UI components for OMS e-commerce sites",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/components/Checkout.tsx

@@ -28,7 +28,7 @@ import {
   CheckCircle,
   Package,
 } from 'lucide-react';
-import { formatCurrency, cn } from '../lib/utils';
+import { formatCurrency, cn, getFbCookies } from '../lib/utils';
 import PaystackSVG from "../paystack.svg"
 import { usePaystackPayment } from '../hooks/usePaystackPayment';
 
@@ -155,6 +155,9 @@ export function Checkout({
     onSuccess: async (response) => {
 
       try {
+        // Get Facebook attribution cookies for CAPI
+        const { fbc, fbp } = getFbCookies();
+
         const order = await checkout.mutateAsync({
           firstName: formData.firstName,
           lastName: formData.lastName,
@@ -165,6 +168,8 @@ export function Checkout({
           deliveryZoneId: selectedDeliveryZoneId || formData.deliveryZoneId,
           paymentMethod: formData.paymentMethod,
           paystackReference: response.reference,
+          fbc,
+          fbp,
         });
 
         // Check if response is an error
@@ -419,6 +424,9 @@ export function Checkout({
 
     // For COD payment, proceed directly with checkout
     try {
+      // Get Facebook attribution cookies for CAPI
+      const { fbc, fbp } = getFbCookies();
+
       const order = await checkout.mutateAsync({
         firstName: formData.firstName,
         lastName: formData.lastName,
@@ -428,6 +436,8 @@ export function Checkout({
         city: formData.city,
         deliveryZoneId: selectedDeliveryZoneId || formData.deliveryZoneId,
         paymentMethod: formData.paymentMethod,
+        fbc,
+        fbp,
       });
 
       // Check if response is an error

package/src/components/ShoppingCart.tsx

@@ -29,6 +29,8 @@ export interface ShoppingCartProps {
   className?: string;
   /** Show discount code input */
   showDiscountCode?: boolean;
+  /** Show continue shopping button */
+  showContinueShopping?: boolean;
   /** Checkout button text */
   checkoutButtonText?: string;
   /** Continue shopping button text */
@@ -50,6 +52,7 @@ export function ShoppingCart({
   onContinueShopping,
   className,
   showDiscountCode = true,
+  showContinueShopping = true,
   checkoutButtonText = 'Complete Purchase',
   continueShoppingText = 'Continue Shopping',
   checkoutButtonClassName,
@@ -240,14 +243,14 @@ export function ShoppingCart({
                     <Package className="h-5 w-5" />
                     {checkoutButtonText}
                   </Button>
-                  <Button
+                  {showContinueShopping && <Button
                     onClick={handleContinueShopping}
                     variant="outline"
                     className={cn('w-full border-gray-300 text-gray-600 hover:bg-gray-100', continueShoppingButtonClassName)}
                     size="lg"
                   >
                     {continueShoppingText}
-                  </Button>
+                  </Button>}
                 </div>
               </div>
             </>

package/src/contexts/CartContext.tsx

@@ -23,6 +23,7 @@ import {
 } from '@instockng/api-client';
 import { ShoppingCart } from '../components/ShoppingCart';
 import { useMetaPixel } from '../providers/MetaPixelProvider';
+import { getFbCookies } from '../lib/utils';
 
 const CART_ID_KEY = 'oms_cart_id';
 
@@ -96,25 +97,6 @@ export function CartProvider({ children, brandSlug, initialCartId, shoppingCartP
   // Get Meta Pixel tracking methods
   const { trackAddToCart, trackInitiateCheckout } = useMetaPixel();
 
-  /**
-   * Extract fbc (Facebook Click ID) and fbp (Facebook Browser ID) cookies for attribution
-   */
-  const getFbCookies = useCallback(() => {
-    if (typeof document === 'undefined') return { fbc: undefined, fbp: undefined };
-
-    const getCookie = (name: string) => {
-      const value = `; ${document.cookie}`;
-      const parts = value.split(`; ${name}=`);
-      if (parts.length === 2) return parts.pop()?.split(';').shift();
-      return undefined;
-    };
-
-    return {
-      fbc: getCookie('_fbc'),
-      fbp: getCookie('_fbp'),
-    };
-  }, []);
-
   // Set mounted flag on client
   useEffect(() => {
     setIsMounted(true);
@@ -281,7 +263,7 @@ export function CartProvider({ children, brandSlug, initialCartId, shoppingCartP
       }
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [cartId, trackAddToCart, getFbCookies]
+    [cartId, trackAddToCart]
   );
 
   const updateItem = useCallback(

package/src/lib/utils.ts

@@ -43,3 +43,23 @@ export function getStatusColor(status: string): string {
   }
   return colors[status] || 'bg-gray-100 text-gray-800'
 }
+
+/**
+ * Extract Facebook attribution cookies (fbc & fbp) for Meta Pixel CAPI
+ * @returns Object with fbc (Facebook Click ID) and fbp (Facebook Browser ID) cookies
+ */
+export function getFbCookies(): { fbc: string | undefined; fbp: string | undefined } {
+  if (typeof document === 'undefined') return { fbc: undefined, fbp: undefined };
+
+  const getCookie = (name: string) => {
+    const value = `; ${document.cookie}`;
+    const parts = value.split(`; ${name}=`);
+    if (parts.length === 2) return parts.pop()?.split(';').shift();
+    return undefined;
+  };
+
+  return {
+    fbc: getCookie('_fbc'),
+    fbp: getCookie('_fbp'),
+  };
+}