@instockng/storefront-ui 1.0.20 → 1.0.21

package/dist/index4.mjs

@@ -1,88 +1,92 @@
 'use client';
 import { jsx as m } from "react/jsx-runtime";
-import { createContext as x, useContext as g, useState as w, useEffect as _ } from "react";
-import l from "./index37.mjs";
-const d = x(null);
-function z({ children: r, pixelId: c, debug: f }) {
-  const [a, P] = w(!1), p = typeof process < "u" && process.env.NODE_ENV === "development", i = f ?? p;
+import { createContext as w, useContext as h, useState as d, useEffect as _ } from "react";
+const P = w(null);
+function b({ children: c, pixelId: r, debug: f }) {
+  const [s, p] = d(!1), [a, x] = d(null), k = typeof process < "u" && process.env.NODE_ENV === "development", o = f ?? k;
   _(() => {
-    if (typeof window > "u") return;
-    if (!c) {
-      i && console.log("[Meta Pixel] No pixel ID provided, tracking disabled");
-      return;
+    if (!(typeof window > "u")) {
+      if (!r) {
+        o && console.log("[Meta Pixel] No pixel ID provided, tracking disabled");
+        return;
+      }
+      import("./index37.mjs").then((e) => e.f).then((e) => {
+        const t = e.default, i = {
+          autoConfig: !0,
+          debug: o
+        };
+        t.init(r, void 0, i), x(t), p(!0), o && console.log("[Meta Pixel] Initialized with ID:", r);
+      }).catch((e) => {
+        console.error("[Meta Pixel] Failed to load react-facebook-pixel:", e);
+      });
     }
-    const e = {
-      autoConfig: !0,
-      debug: i
-    };
-    l.init(c, void 0, e), P(!0), i && console.log("[Meta Pixel] Initialized with ID:", c);
-  }, [c, i]);
-  const o = (e, t) => {
-    if (!a) {
-      i && console.log("[Meta Pixel] Track (not initialized):", e, t);
+  }, [r, o]);
+  const n = (e, t) => {
+    if (!s || !a) {
+      o && console.log("[Meta Pixel] Track (not initialized):", e, t);
       return;
     }
-    l.track(e, t), i && console.log("[Meta Pixel] Track:", e, t);
-  }, k = {
-    track: o,
+    a.track(e, t), o && console.log("[Meta Pixel] Track:", e, t);
+  }, g = {
+    track: n,
     trackPageView: () => {
-      if (!a) {
-        i && console.log("[Meta Pixel] PageView (not initialized)");
+      if (!s || !a) {
+        o && console.log("[Meta Pixel] PageView (not initialized)");
         return;
       }
-      l.pageView(), i && console.log("[Meta Pixel] PageView");
+      a.pageView(), o && console.log("[Meta Pixel] PageView");
     },
-    trackProductView: (e, t, n) => {
-      o("ViewContent", {
+    trackProductView: (e, t, i) => {
+      n("ViewContent", {
         content_ids: [e],
         content_name: t,
         content_type: "product",
-        value: n,
+        value: i,
         currency: "NGN"
       });
     },
-    trackAddToCart: (e, t, n, s) => {
-      o("AddToCart", {
+    trackAddToCart: (e, t, i, l) => {
+      n("AddToCart", {
         content_ids: [e],
         content_name: t,
         content_type: "product",
-        value: n,
+        value: i,
         currency: "NGN",
-        num_items: s
+        num_items: l
       });
     },
     trackInitiateCheckout: (e, t) => {
-      o("InitiateCheckout", {
+      n("InitiateCheckout", {
         value: e,
         currency: "NGN",
         num_items: t
       });
     },
-    trackPurchase: (e, t, n, s) => {
-      o("Purchase", {
+    trackPurchase: (e, t, i, l) => {
+      n("Purchase", {
         value: e,
         currency: t,
         content_type: "product",
-        contents: s.map((u) => ({
+        contents: l.map((u) => ({
           id: u.id,
           // SKU
           quantity: u.quantity,
           item_price: u.item_price
         })),
-        order_id: n
+        order_id: i
       });
     },
-    isInitialized: a
+    isInitialized: s
   };
-  return /* @__PURE__ */ m(d.Provider, { value: k, children: r });
+  return /* @__PURE__ */ m(P.Provider, { value: g, children: c });
 }
-function D() {
-  const r = g(d);
-  if (!r)
+function z() {
+  const c = h(P);
+  if (!c)
     throw new Error("useMetaPixel must be used within MetaPixelProvider");
-  return r;
+  return c;
 }
 export {
-  z as MetaPixelProvider,
-  D as useMetaPixel
+  b as MetaPixelProvider,
+  z as useMetaPixel
 };

package/dist/index42.mjs

@@ -1,6 +1,6 @@
 'use client';
 import * as l from "react";
-import { composeRefs as m } from "./index63.mjs";
+import { composeRefs as m } from "./index60.mjs";
 import { jsx as u } from "react/jsx-runtime";
 // @__NO_SIDE_EFFECTS__
 function y(e) {

package/dist/index60.mjs

@@ -1,27 +1,26 @@
 'use client';
-function n(e) {
-  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
+import "react";
+function i(n, o) {
+  if (typeof n == "function")
+    return n(o);
+  n != null && (n.current = o);
 }
-function c(e) {
-  if (e.__esModule) return e;
-  var o = e.default;
-  if (typeof o == "function") {
-    var t = function r() {
-      return this instanceof r ? Reflect.construct(o, arguments, this.constructor) : o.apply(this, arguments);
-    };
-    t.prototype = o.prototype;
-  } else t = {};
-  return Object.defineProperty(t, "__esModule", { value: !0 }), Object.keys(e).forEach(function(r) {
-    var u = Object.getOwnPropertyDescriptor(e, r);
-    Object.defineProperty(t, r, u.get ? u : {
-      enumerable: !0,
-      get: function() {
-        return e[r];
-      }
+function f(...n) {
+  return (o) => {
+    let u = !1;
+    const c = n.map((t) => {
+      const e = i(t, o);
+      return !u && typeof e == "function" && (u = !0), e;
     });
-  }), t;
+    if (u)
+      return () => {
+        for (let t = 0; t < c.length; t++) {
+          const e = c[t];
+          typeof e == "function" ? e() : i(n[t], null);
+        }
+      };
+  };
 }
 export {
-  c as getAugmentedNamespace,
-  n as getDefaultExportFromCjs
+  f as composeRefs
 };

package/dist/index61.mjs

@@ -1,5 +1,27 @@
 'use client';
-var e = { exports: {} };
+function n(e) {
+  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
+}
+function c(e) {
+  if (e.__esModule) return e;
+  var o = e.default;
+  if (typeof o == "function") {
+    var t = function r() {
+      return this instanceof r ? Reflect.construct(o, arguments, this.constructor) : o.apply(this, arguments);
+    };
+    t.prototype = o.prototype;
+  } else t = {};
+  return Object.defineProperty(t, "__esModule", { value: !0 }), Object.keys(e).forEach(function(r) {
+    var u = Object.getOwnPropertyDescriptor(e, r);
+    Object.defineProperty(t, r, u.get ? u : {
+      enumerable: !0,
+      get: function() {
+        return e[r];
+      }
+    });
+  }), t;
+}
 export {
-  e as __module
+  c as getAugmentedNamespace,
+  n as getDefaultExportFromCjs
 };

package/dist/index63.mjs

@@ -1,26 +1,5 @@
 'use client';
-import "react";
-function i(n, o) {
-  if (typeof n == "function")
-    return n(o);
-  n != null && (n.current = o);
-}
-function f(...n) {
-  return (o) => {
-    let u = !1;
-    const c = n.map((t) => {
-      const e = i(t, o);
-      return !u && typeof e == "function" && (u = !0), e;
-    });
-    if (u)
-      return () => {
-        for (let t = 0; t < c.length; t++) {
-          const e = c[t];
-          typeof e == "function" ? e() : i(n[t], null);
-        }
-      };
-  };
-}
+var e = { exports: {} };
 export {
-  f as composeRefs
+  e as __module
 };

package/dist/index66.mjs

@@ -1,5 +1,5 @@
 'use client';
-import { getDefaultExportFromCjs as d } from "./index60.mjs";
+import { getDefaultExportFromCjs as d } from "./index61.mjs";
 import { __module as v } from "./index94.mjs";
 v.exports = function(n) {
   return g(m(n), n);

package/dist/providers/MetaPixelProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MetaPixelProvider.d.ts","sourceRoot":"","sources":["../../src/providers/MetaPixelProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAkD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvF,UAAU,YAAY;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,qBAAqB;IAC7B;;OAEG;IACH,KAAK,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IAE/D;;OAEG;IACH,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B;;OAEG;IACH,gBAAgB,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAElF;;;;;;OAMG;IACH,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAElG;;OAEG;IACH,qBAAqB,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAEtE;;;;;;OAMG;IACH,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;IAEtG;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;CACxB;AAID,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,sBAAsB,2CAsHrF;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,0BAQ3B;AAED,YAAY,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"MetaPixelProvider.d.ts","sourceRoot":"","sources":["../../src/providers/MetaPixelProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAkD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvF,UAAU,YAAY;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,qBAAqB;IAC7B;;OAEG;IACH,KAAK,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IAE/D;;OAEG;IACH,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B;;OAEG;IACH,gBAAgB,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAElF;;;;;;OAMG;IACH,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAElG;;OAEG;IACH,qBAAqB,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAEtE;;;;;;OAMG;IACH,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;IAEtG;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;CACxB;AAID,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,sBAAsB,2CA+HrF;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,0BAQ3B;AAED,YAAY,EAAE,YAAY,EAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instockng/storefront-ui",
-  "version": "1.0.20",
+  "version": "1.0.21",
   "description": "Pre-built UI components for OMS e-commerce sites",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -20,13 +20,6 @@
     "src",
     "README.md"
   ],
-  "scripts": {
-    "type-check": "tsc --noEmit",
-    "build": "vite build && vite build --config vite.config.css.ts && tsc --project tsconfig.build.json",
-    "prepublishOnly": "npm run build",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build"
-  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/ola-wale/oms.git",
@@ -65,8 +58,8 @@
     "@storybook/test": "^8.6.14",
     "@tailwindcss/postcss": "^4.1.14",
     "@tanstack/react-query": "^5.17.19",
-    "@types/react": "npm:types-react@^19.0.0-rc.1",
-    "@types/react-dom": "npm:types-react-dom@^19.0.0-rc.1",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
     "@vitejs/plugin-react": "^4.7.0",
     "autoprefixer": "^10.4.21",
     "lucide-react": "^0.536.0",
@@ -79,5 +72,11 @@
     "tailwindcss": "^4.1.14",
     "typescript": "^5.3.3",
     "vite": "^5.4.20"
+  },
+  "scripts": {
+    "type-check": "tsc --noEmit",
+    "build": "vite build && vite build --config vite.config.css.ts && tsc --project tsconfig.build.json || true",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
   }
-}
+}

package/src/components/ui/modal.tsx

@@ -46,7 +46,7 @@ export function Modal({
   size = 'md',
   closeOnOverlayClick = true,
   showCloseButton = true,
-}: ModalProps): JSX.Element | null {
+}: ModalProps): React.ReactElement | null {
   const modalRef = useRef<HTMLDivElement>(null);
   const [isAnimating, setIsAnimating] = useState(false);
   const [shouldRender, setShouldRender] = useState(isOpen);

package/src/providers/MetaPixelProvider.tsx

@@ -7,7 +7,6 @@
  */
 
 import { createContext, useContext, useEffect, useState, type ReactNode } from 'react';
-import ReactPixel from 'react-facebook-pixel';
 
 interface PurchaseItem {
   id: string; // SKU
@@ -90,6 +89,7 @@ export interface MetaPixelProviderProps {
  */
 export function MetaPixelProvider({ children, pixelId, debug }: MetaPixelProviderProps) {
   const [isInitialized, setIsInitialized] = useState(false);
+  const [reactPixel, setReactPixel] = useState<any>(null);
   const isDevelopment = typeof process !== 'undefined' && process.env.NODE_ENV === 'development';
   const shouldDebug = debug ?? isDevelopment;
 
@@ -104,29 +104,37 @@ export function MetaPixelProvider({ children, pixelId, debug }: MetaPixelProvide
       return;
     }
 
-    // Initialize Meta Pixel (client-side only)
-    const options = {
-      autoConfig: true,
-      debug: shouldDebug,
-    };
+    // Dynamically import react-facebook-pixel only on client
+    import('react-facebook-pixel').then((module) => {
+      const ReactPixel = module.default;
 
-    ReactPixel.init(pixelId, undefined, options);
-    setIsInitialized(true);
+      // Initialize Meta Pixel (client-side only)
+      const options = {
+        autoConfig: true,
+        debug: shouldDebug,
+      };
 
-    if (shouldDebug) {
-      console.log('[Meta Pixel] Initialized with ID:', pixelId);
-    }
+      ReactPixel.init(pixelId, undefined, options);
+      setReactPixel(ReactPixel);
+      setIsInitialized(true);
+
+      if (shouldDebug) {
+        console.log('[Meta Pixel] Initialized with ID:', pixelId);
+      }
+    }).catch((error) => {
+      console.error('[Meta Pixel] Failed to load react-facebook-pixel:', error);
+    });
   }, [pixelId, shouldDebug]);
 
   const track = (event: string, data?: Record<string, unknown>) => {
-    if (!isInitialized) {
+    if (!isInitialized || !reactPixel) {
       if (shouldDebug) {
         console.log('[Meta Pixel] Track (not initialized):', event, data);
       }
       return;
     }
 
-    ReactPixel.track(event, data);
+    reactPixel.track(event, data);
 
     if (shouldDebug) {
       console.log('[Meta Pixel] Track:', event, data);
@@ -134,14 +142,14 @@ export function MetaPixelProvider({ children, pixelId, debug }: MetaPixelProvide
   };
 
   const trackPageView = () => {
-    if (!isInitialized) {
+    if (!isInitialized || !reactPixel) {
       if (shouldDebug) {
         console.log('[Meta Pixel] PageView (not initialized)');
       }
       return;
     }
 
-    ReactPixel.pageView();
+    reactPixel.pageView();
 
     if (shouldDebug) {
       console.log('[Meta Pixel] PageView');