@instockng/storefront-ui 1.0.110 → 1.0.112

package/dist/index21.mjs

@@ -1,42 +1,42 @@
 'use client';
 import { jsxs as a, jsx as e, Fragment as O } from "react/jsx-runtime";
-import { useState as C, useEffect as Z, useMemo as V, useCallback as qe } from "react";
-import { object as Q, string as S, ValidationError as _e } from "./index54.mjs";
+import { useState as C, useEffect as _, useMemo as V, useCallback as qe } from "react";
+import { object as Q, string as S, ValidationError as Le } from "./index54.mjs";
 import "./index31.mjs";
 import "@tanstack/react-query";
-import { useGetDeliveryZones as Le } from "./index47.mjs";
-import { useCart as Ze } from "./index3.mjs";
+import { useGetDeliveryZones as Ze } from "./index47.mjs";
+import { useCart as _e } from "./index3.mjs";
 import { Modal as fe } from "./index27.mjs";
 import { FormInput as W } from "./index28.mjs";
 import { FormSelect as ve } from "./index29.mjs";
 import { Button as $ } from "./index24.mjs";
-import { Loader2 as R, ChevronLeft as ze, ChevronRight as Fe, Package as ge, Banknote as Ne, Phone as Te, ChevronDown as Ae, Zap as Be } from "lucide-react";
+import { Loader2 as K, ChevronLeft as ze, ChevronRight as Fe, Package as ge, Banknote as Ne, Phone as Te, ChevronDown as Ae, Zap as Be } from "lucide-react";
 import { PostPurchaseUpsell as We } from "./index55.mjs";
-import { formatCurrency as _, cn as M, getFbCookies as Y, getTikTokCookies as J } from "./index30.mjs";
-import $e from "./index56.mjs";
+import { formatCurrency as L, WHATSAPP_HELP_LINK as $e, cn as M, getFbCookies as Y, getTikTokCookies as J } from "./index30.mjs";
+import Ke from "./index56.mjs";
 import { usePaystackPayment as Re } from "./index57.mjs";
-const Ue = "2348125648668", He = `https://wa.me/${Ue}`, Ke = (d) => d.replace(/\D/g, ""), U = (d) => {
+const Ue = (d) => d.replace(/\D/g, ""), R = (d) => {
   const x = d.trim().split(/\s+/), i = x[0] || "", b = x.slice(1).join(" ") || "-";
   return { firstName: i, lastName: b };
 }, Ge = Q({
   fullName: S().required("Name is required").min(2, "Name must be at least 2 characters").max(100, "Name must be less than 100 characters"),
   phone: S().required("Phone number is required").test("nigerian-phone", "Please enter a valid Nigerian phone number (e.g. 0812 564 8668)", (d) => {
     if (!d) return !1;
-    const x = Ke(d);
+    const x = Ue(d);
     return [
       /^0[789]\d{9}$/
       // 0xxxxxxxxx (11 digits total)
     ].some((b) => b.test(x));
   })
-}), Oe = Q({
+}), He = Q({
   address: S().required("Street address is required").min(10, "Please provide a complete address"),
   city: S().required("City is required").min(3, "City name must be at least 3 characters"),
   state: S().required("State is required").test("not-empty", "State is required", (d) => !!d && d.trim() !== ""),
   deliveryZoneId: S().required("Delivery zone is required").test("not-empty", "Delivery zone is required", (d) => !!d && d.trim() !== "")
-}), Ve = Q({
+}), Oe = Q({
   paymentMethod: S().oneOf(["cod", "online"], "Please select a payment method").required("Payment method is required")
 });
-function mt({
+function ct({
   isOpen: d,
   onClose: x,
   initialData: i,
@@ -46,14 +46,14 @@ function mt({
   refundPolicy: z
 }) {
   var ie, de, oe, ce, me, he, ue, pe, ye;
-  const [m, w] = C("customer"), [F, xe] = C(void 0), [y, X] = C(void 0), [f, H] = C(null), { refetch: E, isLoading: D, cart: t, updateCartMutation: P, checkoutMutation: we, clearAndCreateNewCart: ee } = Ze(), te = (ie = t == null ? void 0 : t.brand) == null ? void 0 : ie.paystackPublicKey, ae = Re({
+  const [m, w] = C("customer"), [F, xe] = C(void 0), [y, X] = C(void 0), [f, U] = C(null), { refetch: E, isLoading: D, cart: t, updateCartMutation: k, checkoutMutation: we, clearAndCreateNewCart: ee } = _e(), te = (ie = t == null ? void 0 : t.brand) == null ? void 0 : ie.paystackPublicKey, ae = Re({
     isOpen: d,
     publicKey: te || "",
     onSuccess: async (n) => {
       try {
-        const { fbc: r, fbp: l } = Y(), { ttp: o, ttclid: g } = J(), { firstName: p, lastName: L } = U(s.fullName), N = await j.mutateAsync({
+        const { fbc: r, fbp: l } = Y(), { ttp: o, ttclid: g } = J(), { firstName: p, lastName: Z } = R(s.fullName), N = await j.mutateAsync({
           firstName: p,
-          lastName: L,
+          lastName: Z,
           phone: s.phone,
           address: s.address,
           city: s.city,
@@ -70,7 +70,7 @@ function mt({
           c == null || c(new Error((I == null ? void 0 : I.message) || "Checkout failed"));
           return;
         }
-        H(N), ee(), b == null || b(N);
+        U(N), ee(), b == null || b(N);
       } catch (r) {
         c == null || c(r);
       }
@@ -79,16 +79,16 @@ function mt({
       console.log("Payment popup closed by user");
     }
   });
-  Z(() => {
+  _(() => {
     d && E();
   }, [d, E]);
-  const { data: k } = Le(((de = t == null ? void 0 : t.brand) == null ? void 0 : de.id) || "", {
+  const { data: P } = Ze(((de = t == null ? void 0 : t.brand) == null ? void 0 : de.id) || "", {
     enabled: !!((oe = t == null ? void 0 : t.brand) != null && oe.id)
-  }), u = V(() => k == null ? void 0 : k.find((n) => n.id === F), [k, F]), h = V(() => u == null ? void 0 : u.zones.find((n) => n.id === y), [u, y]), j = we;
-  Z(() => {
-    d || (H(null), w("customer"), j.reset());
+  }), u = V(() => P == null ? void 0 : P.find((n) => n.id === F), [P, F]), h = V(() => u == null ? void 0 : u.zones.find((n) => n.id === y), [u, y]), j = we;
+  _(() => {
+    d || (U(null), w("customer"), j.reset());
   }, [d]);
-  const [s, K] = C({
+  const [s, G] = C({
     fullName: (i == null ? void 0 : i.fullName) || "",
     phone: (i == null ? void 0 : i.phone) || "",
     address: (i == null ? void 0 : i.address) || "",
@@ -97,14 +97,14 @@ function mt({
     paymentMethod: (i == null ? void 0 : i.paymentMethod) || "online",
     notes: (i == null ? void 0 : i.notes) || ""
   });
-  Z(() => {
+  _(() => {
     d && w("customer");
   }, [d]);
   const [se, re] = C(!1);
-  Z(() => {
+  _(() => {
     if (d && t && !i && !se) {
       const n = [t.customerFirstName, t.customerLastName].filter(Boolean).join(" ");
-      K((r) => {
+      G((r) => {
         var l;
         return {
           ...r,
@@ -115,28 +115,28 @@ function mt({
       }), re(!0);
     }
     d || re(!1);
-  }, [d, t, i, se]), Z(() => {
+  }, [d, t, i, se]), _(() => {
     if (y) {
       const n = u == null ? void 0 : u.zones.find((r) => r.id === y);
-      n && K((r) => ({
+      n && G((r) => ({
         ...r,
         paymentMethod: n.allowOnline ? "online" : "cod"
       }));
     }
   }, [y, u]);
-  const [v, T] = C({}), [G, Ce] = C(!1), q = (n) => {
+  const [v, T] = C({}), [H, Ce] = C(!1), q = (n) => {
     const { name: r, value: l } = n.target;
-    K((o) => ({ ...o, [r]: l })), v[r] && T((o) => ({ ...o, [r]: void 0 }));
+    G((o) => ({ ...o, [r]: l })), v[r] && T((o) => ({ ...o, [r]: void 0 }));
   }, ne = qe(
     (n) => {
       const r = s[n];
       if (r)
         if (n === "fullName") {
-          const { firstName: l, lastName: o } = U(r);
-          P.mutate({ customerFirstName: l, customerLastName: o });
-        } else n === "phone" && P.mutate({ customerPhone: r });
+          const { firstName: l, lastName: o } = R(r);
+          k.mutate({ customerFirstName: l, customerLastName: o });
+        } else n === "phone" && k.mutate({ customerPhone: r });
     },
-    [s, P]
+    [s, k]
   ), A = (n) => {
     const r = {};
     try {
@@ -149,17 +149,17 @@ function mt({
           state: F || s.state || "",
           deliveryZoneId: y || s.deliveryZoneId || ""
         };
-        Oe.validateSync(l, { abortEarly: !1 });
-      } else n === "payment" && Ve.validateSync(s, { abortEarly: !1 });
+        He.validateSync(l, { abortEarly: !1 });
+      } else n === "payment" && Oe.validateSync(s, { abortEarly: !1 });
     } catch (l) {
-      l instanceof _e && l.inner.forEach((o) => {
+      l instanceof Le && l.inner.forEach((o) => {
         o.path && (r[o.path] = o.message);
       });
     }
     return T(r), Object.keys(r).length === 0;
-  }, Pe = () => {
-    A(m) && (m === "customer" ? w("delivery") : m === "delivery" && w("payment"));
   }, ke = () => {
+    A(m) && (m === "customer" ? w("delivery") : m === "delivery" && w("payment"));
+  }, Pe = () => {
     m === "payment" ? w("delivery") : m === "delivery" && w("customer");
   }, Ie = async () => {
     var n;
@@ -181,7 +181,7 @@ function mt({
           c == null || c(new Error("Payment system is loading. Please try again."));
           return;
         }
-        const r = Math.round(t.pricing.total * 100), { fbc: l, fbp: o } = Y(), { ttp: g, ttclid: p } = J(), { firstName: L, lastName: N } = U(s.fullName);
+        const r = Math.round(t.pricing.total * 100), { fbc: l, fbp: o } = Y(), { ttp: g, ttclid: p } = J(), { firstName: Z, lastName: N } = R(s.fullName);
         ae.initializePayment({
           email: (t == null ? void 0 : t.customerEmail) || `${s.phone.replace(/\D/g, "")}@customer.instock.ng`,
           phone: s.phone,
@@ -193,7 +193,7 @@ function mt({
             address: s.address,
             city: s.city,
             delivery_zone_id: y || s.deliveryZoneId,
-            firstName: L,
+            firstName: Z,
             lastName: N,
             phone: s.phone,
             fbc: l,
@@ -232,9 +232,9 @@ function mt({
         return;
       }
       try {
-        const { fbc: r, fbp: l } = Y(), { ttp: o, ttclid: g } = J(), { firstName: p, lastName: L } = U(s.fullName), N = await j.mutateAsync({
+        const { fbc: r, fbp: l } = Y(), { ttp: o, ttclid: g } = J(), { firstName: p, lastName: Z } = R(s.fullName), N = await j.mutateAsync({
           firstName: p,
-          lastName: L,
+          lastName: Z,
           phone: s.phone,
           address: s.address,
           city: s.city,
@@ -250,7 +250,7 @@ function mt({
           c == null || c(new Error((I == null ? void 0 : I.message) || "Checkout failed"));
           return;
         }
-        H(N), ee(), b == null || b(N);
+        U(N), ee(), b == null || b(N);
       } catch (r) {
         c == null || c(r);
       }
@@ -261,16 +261,16 @@ function mt({
     payment: "Payment Method"
   }, Se = V(() => Me[m], [m]), je = /* @__PURE__ */ a("div", { className: "space-y-3", children: [
     (m === "payment" || m === "delivery") && ((ce = t == null ? void 0 : t.pricing) == null ? void 0 : ce.total) && /* @__PURE__ */ a("div", { className: "text-sm text-black relative", children: [
-      D && /* @__PURE__ */ e("div", { className: "absolute flex items-center justify-center inset-0 bg-white opacity-50", children: /* @__PURE__ */ e(R, { className: "animate-spin text-accent-500" }) }),
+      D && /* @__PURE__ */ e("div", { className: "absolute flex items-center justify-center inset-0 bg-white opacity-50", children: /* @__PURE__ */ e(K, { className: "animate-spin text-accent-500" }) }),
       /* @__PURE__ */ a("div", { className: "flex items-center justify-between font-medium", children: [
         /* @__PURE__ */ e("span", { children: "Subtotal" }),
-        /* @__PURE__ */ e("span", { children: _(((me = t == null ? void 0 : t.pricing) == null ? void 0 : me.subtotal) ?? 0) })
+        /* @__PURE__ */ e("span", { children: L(((me = t == null ? void 0 : t.pricing) == null ? void 0 : me.subtotal) ?? 0) })
       ] }),
       t.pricing.discount && /* @__PURE__ */ a("div", { className: "flex items-center justify-between font-medium", children: [
         /* @__PURE__ */ e("span", { children: "Discount" }),
         /* @__PURE__ */ a("span", { className: "text-green-600", children: [
           "-",
-          _(((ue = (he = t == null ? void 0 : t.pricing) == null ? void 0 : he.discount) == null ? void 0 : ue.amount) ?? 0)
+          L(((ue = (he = t == null ? void 0 : t.pricing) == null ? void 0 : he.discount) == null ? void 0 : ue.amount) ?? 0)
         ] })
       ] }),
       /* @__PURE__ */ a("div", { className: "flex items-center justify-between font-medium", children: [
@@ -282,14 +282,14 @@ function mt({
           const n = (o = t == null ? void 0 : t.brand) == null ? void 0 : o.freeShippingThreshold, r = ((g = t == null ? void 0 : t.pricing) == null ? void 0 : g.subtotal) ?? 0;
           if (n && r >= n)
             return /* @__PURE__ */ e("span", { className: "text-green-600", children: "Free" });
-          const l = P.isPending ? (h == null ? void 0 : h.deliveryCost) ?? 0 : ((p = t == null ? void 0 : t.pricing) == null ? void 0 : p.deliveryCharge) ?? 0;
-          return l === 0 ? /* @__PURE__ */ e("span", { className: "text-green-600", children: "Free" }) : _(l);
+          const l = k.isPending ? (h == null ? void 0 : h.deliveryCost) ?? 0 : ((p = t == null ? void 0 : t.pricing) == null ? void 0 : p.deliveryCharge) ?? 0;
+          return l === 0 ? /* @__PURE__ */ e("span", { className: "text-green-600", children: "Free" }) : L(l);
         })() })
       ] }),
       /* @__PURE__ */ e("hr", { className: "border-gray-200 my-2" }),
       /* @__PURE__ */ a("div", { className: "flex items-center justify-between font-medium", children: [
         /* @__PURE__ */ e("span", { children: "Total" }),
-        /* @__PURE__ */ e("span", { children: _(((pe = t == null ? void 0 : t.pricing) == null ? void 0 : pe.total) ?? 0) })
+        /* @__PURE__ */ e("span", { children: L(((pe = t == null ? void 0 : t.pricing) == null ? void 0 : pe.total) ?? 0) })
       ] })
     ] }),
     /* @__PURE__ */ a("div", { className: "flex gap-3", children: [
@@ -298,7 +298,7 @@ function mt({
         {
           type: "button",
           variant: "outline",
-          onClick: ke,
+          onClick: Pe,
           className: "flex-1 border-gray-400",
           size: "lg",
           children: [
@@ -311,12 +311,12 @@ function mt({
         $,
         {
           type: "button",
-          onClick: Pe,
-          disabled: m === "delivery" && P.isPending,
+          onClick: ke,
+          disabled: m === "delivery" && k.isPending,
           className: "flex-1 bg-accent-500 text-white hover:bg-accent-600",
           size: "lg",
-          children: m === "delivery" && P.isPending ? /* @__PURE__ */ a(O, { children: [
-            /* @__PURE__ */ e(R, { className: "mr-2 h-4 w-4 animate-spin" }),
+          children: m === "delivery" && k.isPending ? /* @__PURE__ */ a(O, { children: [
+            /* @__PURE__ */ e(K, { className: "mr-2 h-4 w-4 animate-spin" }),
             "Updating..."
           ] }) : /* @__PURE__ */ a(O, { children: [
             "Next",
@@ -332,7 +332,7 @@ function mt({
           className: "flex-1 bg-accent-500 text-white hover:bg-accent-600",
           size: "lg",
           children: j.isPending ? /* @__PURE__ */ a(O, { children: [
-            /* @__PURE__ */ e(R, { className: "mr-2 h-4 w-4 animate-spin" }),
+            /* @__PURE__ */ e(K, { className: "mr-2 h-4 w-4 animate-spin" }),
             "Processing..."
           ] }) : be
         }
@@ -397,7 +397,7 @@ function mt({
               ] }),
               /* @__PURE__ */ a("div", { className: "flex justify-between text-sm", children: [
                 /* @__PURE__ */ e("span", { className: "text-gray-600", children: "Total" }),
-                /* @__PURE__ */ e("span", { className: "font-bold text-gray-900", children: _(f.totalPrice) })
+                /* @__PURE__ */ e("span", { className: "font-bold text-gray-900", children: L(f.totalPrice) })
               ] })
             ] })
           ] }),
@@ -423,7 +423,7 @@ function mt({
       footer: je,
       size: "lg",
       contentClassName: "p-0",
-      children: D ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center min-h-[300px]", children: /* @__PURE__ */ e(R, { className: "h-8 w-8 animate-spin text-gray-600" }) }) : /* @__PURE__ */ e("div", { className: "w-full overflow-hidden", children: /* @__PURE__ */ a("div", { className: "relative w-full", children: [
+      children: D ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center min-h-[300px]", children: /* @__PURE__ */ e(K, { className: "h-8 w-8 animate-spin text-gray-600" }) }) : /* @__PURE__ */ e("div", { className: "w-full overflow-hidden", children: /* @__PURE__ */ a("div", { className: "relative w-full", children: [
         le && /* @__PURE__ */ a("div", { className: "space-y-3 p-4 pb-0", children: [
           h.noteTitle && h.noteContent && /* @__PURE__ */ e("div", { className: "bg-amber-50 border border-amber-200 rounded-lg p-4", children: /* @__PURE__ */ a("div", { className: "flex items-start gap-3", children: [
             /* @__PURE__ */ e(ge, { className: "h-5 w-5 text-amber-600 flex-shrink-0 mt-0.5" }),
@@ -443,7 +443,7 @@ function mt({
         /* @__PURE__ */ e("div", { className: "p-4", children: /* @__PURE__ */ a(
           "a",
           {
-            href: He,
+            href: $e,
             target: "_blank",
             rel: "noopener noreferrer",
             className: "flex items-center justify-center gap-2 p-3 bg-green-500 hover:bg-green-600 rounded-lg transition-colors",
@@ -547,7 +547,7 @@ function mt({
                       required: !0,
                       children: [
                         /* @__PURE__ */ e("option", { disabled: !0, value: "", children: "Select State" }),
-                        k == null ? void 0 : k.slice().sort((n, r) => {
+                        P == null ? void 0 : P.slice().sort((n, r) => {
                           const l = n.name.toLowerCase() === "lagos" ? 0 : 1, o = r.name.toLowerCase() === "lagos" ? 0 : 1;
                           return l - o;
                         }).map((n) => /* @__PURE__ */ e("option", { value: n.id, children: n.name }, n.id))
@@ -561,7 +561,7 @@ function mt({
                       value: y || "",
                       onChange: (n) => {
                         const r = n.target.value;
-                        X(r || void 0), v.deliveryZoneId && T((l) => ({ ...l, deliveryZoneId: void 0 })), r && P.mutate({ deliveryZoneId: r });
+                        X(r || void 0), v.deliveryZoneId && T((l) => ({ ...l, deliveryZoneId: void 0 })), r && k.mutate({ deliveryZoneId: r });
                       },
                       disabled: !u,
                       error: v.deliveryZoneId,
@@ -573,7 +573,7 @@ function mt({
                           const n = ((o = t == null ? void 0 : t.pricing) == null ? void 0 : o.subtotal) ?? 0, r = (g = t == null ? void 0 : t.brand) == null ? void 0 : g.freeShippingThreshold, l = r && n >= r;
                           return u == null ? void 0 : u.zones.map((p) => /* @__PURE__ */ a("option", { value: p.id, children: [
                             p.name,
-                            l ? "" : ` (${_(p.deliveryCost)})`
+                            l ? "" : ` (${L(p.deliveryCost)})`
                           ] }, p.id));
                         })()
                       ]
@@ -587,7 +587,7 @@ function mt({
                     "button",
                     {
                       type: "button",
-                      onClick: () => Ce(!G),
+                      onClick: () => Ce(!H),
                       className: "overflow-hidden w-full flex items-center overflow-hidden rounded-lg rounded-b-none justify-between p-4 text-left hover:bg-gray-50 transition-colors",
                       children: [
                         /* @__PURE__ */ e("span", { className: "text-sm font-bold text-accent-700", children: z.title || "Yes, we offer refunds!" }),
@@ -597,7 +597,7 @@ function mt({
                             size: 16,
                             className: M(
                               "transform transition-transform duration-200 text-gray-500",
-                              G && "rotate-180"
+                              H && "rotate-180"
                             )
                           }
                         )
@@ -609,7 +609,7 @@ function mt({
                     {
                       className: M(
                         "overflow-hidden transition-all duration-300 ease-in-out",
-                        G ? "max-h-96 opacity-100" : "max-h-0 opacity-0"
+                        H ? "max-h-96 opacity-100" : "max-h-0 opacity-0"
                       ),
                       children: /* @__PURE__ */ e("div", { className: "px-4 pb-4 border-t border-gray-100", children: /* @__PURE__ */ e("div", { className: "text-sm text-gray-600 space-y-3 pt-4", children: z.policies && /* @__PURE__ */ a("div", { children: [
                         /* @__PURE__ */ e("h4", { className: "font-bold text-gray-800 mb-2", children: "Our Refund Policy" }),
@@ -660,7 +660,7 @@ function mt({
                             /* @__PURE__ */ e(
                               "img",
                               {
-                                src: $e,
+                                src: Ke,
                                 alt: "Paystack",
                                 className: "h-4 w-auto mt-2 mx-auto"
                               }
@@ -723,5 +723,5 @@ function mt({
   );
 }
 export {
-  mt as Checkout
+  ct as Checkout
 };

package/dist/index211.mjs

@@ -1,5 +1,5 @@
 'use client';
-import { __exports as r } from "./index262.mjs";
+import { __exports as r } from "./index249.mjs";
 import { __require as s } from "./index130.mjs";
 var a;
 function _() {