@instockng/storefront-ui 1.0.107 → 1.0.109

package/dist/index14.mjs

@@ -1,101 +1,105 @@
 'use client';
-import { jsxs as t, jsx as a } from "react/jsx-runtime";
-import { Package as g, Trash2 as p } from "lucide-react";
-import { cn as N, formatCurrency as h } from "./index30.mjs";
-import { useCart as w } from "./index3.mjs";
-import { useState as f, useCallback as y } from "react";
-function U({
-  item: e,
-  className: b,
-  disabled: r = !1
+import { jsx as i, jsxs as n, Fragment as d } from "react/jsx-runtime";
+import { useState as u } from "react";
+import { Modal as k } from "./index27.mjs";
+import { Button as C } from "./index24.mjs";
+import { formatCurrency as s, cn as S } from "./index30.mjs";
+import { Package as U, Loader2 as j, ShoppingCart as I } from "lucide-react";
+function F({
+  isOpen: b,
+  onClose: g,
+  product: e,
+  onConfirm: y,
+  isLoading: m = !1,
+  discountPercent: r
 }) {
-  const [i, n] = f(!1), [s, c] = f(!1), { removeItem: o, updateItem: d } = w(), m = y(async (l) => {
-    if (!(l <= 0)) {
-      c(!0);
-      try {
-        await d(e.id, l);
-      } catch (v) {
-        console.error("Failed to update item quantity:", v);
-      }
-      c(!1);
-    }
-  }, [e.id, d]), x = y(async () => {
-    n(!0);
-    try {
-      await o(e.id);
-    } catch (l) {
-      console.error("Failed to remove item:", l);
-    }
-    n(!1);
-  }, [e.id, o]), u = e.variant.thumbnailUrl ?? e.variant.product.thumbnailUrl;
-  return /* @__PURE__ */ t(
-    "div",
+  var h, o;
+  const [x, N] = u(null), v = ((h = e == null ? void 0 : e.variants.find((l) => !l.availability || l.availability.available)) == null ? void 0 : h.id) || ((o = e == null ? void 0 : e.variants[0]) == null ? void 0 : o.id) || null, c = x || v, a = e == null ? void 0 : e.variants.find((l) => l.id === c), p = () => {
+    e && a && y(e, a);
+  };
+  return e ? /* @__PURE__ */ i(
+    k,
     {
-      className: N(
-        "flex gap-3 transition-opacity",
-        (r || i || s) && "opacity-50",
-        b
+      isOpen: b,
+      onClose: g,
+      title: "Select Option",
+      size: "sm",
+      footer: /* @__PURE__ */ i(
+        C,
+        {
+          onClick: p,
+          disabled: !a || m || (a == null ? void 0 : a.availability) && !a.availability.available,
+          className: "w-full bg-accent-500 hover:bg-accent-600 text-white",
+          size: "lg",
+          children: m ? /* @__PURE__ */ n(d, { children: [
+            /* @__PURE__ */ i(j, { className: "h-4 w-4 animate-spin mr-2" }),
+            "Adding..."
+          ] }) : /* @__PURE__ */ n(d, { children: [
+            /* @__PURE__ */ i(I, { className: "h-4 w-4 mr-2" }),
+            "Add to Cart - ",
+            a && (r ? /* @__PURE__ */ n("span", { children: [
+              /* @__PURE__ */ i("span", { className: "line-through opacity-60 mr-1", children: s(a.price) }),
+              s(Math.round(a.price * (1 - r / 100)))
+            ] }) : s(a.price))
+          ] })
+        }
       ),
-      children: [
-        /* @__PURE__ */ a("div", { className: "h-20 w-20 flex-shrink-0 overflow-hidden rounded-lg bg-gray-100", children: u ? /* @__PURE__ */ a(
-          "img",
-          {
-            src: u,
-            alt: e.variant.product.name,
-            className: "h-full w-full object-cover"
-          }
-        ) : /* @__PURE__ */ a("div", { className: "flex h-full w-full items-center justify-center", children: /* @__PURE__ */ a(g, { className: "h-6 w-6 text-gray-400" }) }) }),
-        /* @__PURE__ */ t("div", { className: "flex flex-1 flex-col justify-between py-1", children: [
-          /* @__PURE__ */ a("div", { children: /* @__PURE__ */ t("div", { className: "flex items-start justify-between gap-2", children: [
-            /* @__PURE__ */ t("div", { className: "flex-1", children: [
-              /* @__PURE__ */ a("h3", { className: "text-base font-semibold leading-tight", children: e.variant.product.name }),
-              e.variant.name && /* @__PURE__ */ a("p", { className: "mt-0.5 text-sm text-gray-600", children: e.variant.name })
-            ] }),
-            /* @__PURE__ */ a(
-              "button",
-              {
-                onClick: x,
-                disabled: r || i,
-                className: "text-gray-400 hover:text-red-600 disabled:cursor-not-allowed disabled:opacity-50",
-                "aria-label": "Remove item",
-                children: /* @__PURE__ */ a(p, { className: "h-5 w-5" })
-              }
-            )
-          ] }) }),
-          /* @__PURE__ */ t("div", { className: "flex items-center justify-between mt-2", children: [
-            /* @__PURE__ */ t("div", { className: "inline-flex items-center overflow-hidden rounded-full bg-gray-200 text-gray-700", children: [
-              /* @__PURE__ */ a(
-                "button",
-                {
-                  "aria-label": "Decrease quantity",
-                  onClick: () => m(e.quantity - 1),
-                  disabled: r || e.quantity <= 1 || s,
-                  className: "flex h-8 w-8 items-center justify-center transition-colors hover:bg-gray-300 disabled:cursor-not-allowed disabled:opacity-50",
-                  children: "−"
-                }
-              ),
-              /* @__PURE__ */ a("span", { className: "px-3 text-base font-medium select-none", children: e.quantity }),
-              /* @__PURE__ */ a(
-                "button",
-                {
-                  "aria-label": "Increase quantity",
-                  onClick: () => m(e.quantity + 1),
-                  disabled: r || s,
-                  className: "flex h-8 w-8 items-center justify-center transition-colors hover:bg-gray-300 disabled:cursor-not-allowed disabled:opacity-50",
-                  children: "+"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ t("div", { className: "text-right", children: [
-              /* @__PURE__ */ a("p", { className: "text-base font-medium", children: h(e.subtotal) }),
-              e.basePrice !== e.finalPrice && /* @__PURE__ */ a("p", { className: "text-xs text-[#DC143C] line-through", children: h(e.basePrice * e.quantity) })
+      children: /* @__PURE__ */ n("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ n("div", { className: "flex gap-4", children: [
+          /* @__PURE__ */ i("div", { className: "w-20 h-20 flex-shrink-0 rounded-lg overflow-hidden bg-gray-100", children: a != null && a.thumbnailUrl || e.thumbnailUrl ? /* @__PURE__ */ i(
+            "img",
+            {
+              src: (a == null ? void 0 : a.thumbnailUrl) || e.thumbnailUrl || "",
+              alt: (a == null ? void 0 : a.name) || e.name,
+              className: "w-full h-full object-cover"
+            }
+          ) : /* @__PURE__ */ i("div", { className: "w-full h-full flex items-center justify-center", children: /* @__PURE__ */ i(U, { className: "h-8 w-8 text-gray-300" }) }) }),
+          /* @__PURE__ */ n("div", { className: "flex-1", children: [
+            /* @__PURE__ */ i("h3", { className: "font-semibold text-gray-900", children: e.name }),
+            /* @__PURE__ */ n("p", { className: "text-sm text-gray-500 mt-1", children: [
+              e.variants.length,
+              " options available"
             ] })
           ] })
+        ] }),
+        /* @__PURE__ */ n("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ i("p", { className: "text-sm font-medium text-gray-700", children: "Choose an option:" }),
+          /* @__PURE__ */ i("div", { className: "flex flex-wrap gap-2", children: e.variants.map((l) => {
+            const w = l.id === c, t = l.availability && !l.availability.available, f = l.thumbnailUrl || e.thumbnailUrl;
+            return /* @__PURE__ */ n(
+              "button",
+              {
+                onClick: () => !t && N(l.id),
+                disabled: !!t,
+                className: S(
+                  "flex items-center gap-2 px-3 py-2 rounded-full text-sm font-medium border-2 transition-all",
+                  t ? "border-gray-200 bg-gray-50 text-gray-400 cursor-not-allowed opacity-60" : w ? "border-accent-500 bg-accent-50 text-accent-700" : "border-gray-200 bg-white text-gray-700 hover:border-gray-300"
+                ),
+                children: [
+                  f && /* @__PURE__ */ i(
+                    "img",
+                    {
+                      src: f,
+                      alt: l.name || "Variant",
+                      className: "w-6 h-6 rounded-full object-cover flex-shrink-0"
+                    }
+                  ),
+                  l.name || "Default",
+                  " - ",
+                  t ? /* @__PURE__ */ i("span", { className: "text-gray-400", children: "Sold out" }) : r ? /* @__PURE__ */ n("span", { children: [
+                    /* @__PURE__ */ i("span", { className: "line-through opacity-60 mr-1", children: s(l.price) }),
+                    s(Math.round(l.price * (1 - r / 100)))
+                  ] }) : s(l.price)
+                ]
+              },
+              l.id
+            );
+          }) })
         ] })
-      ]
+      ] })
     }
-  );
+  ) : null;
 }
 export {
-  U as CartItem
+  F as VariantPickerModal
 };

package/dist/index140.mjs

@@ -1,37 +1,22 @@
 'use client';
-import { __exports as o } from "./index211.mjs";
-var c;
-function p() {
-  return c ? o : (c = 1, function(a) {
-    Object.defineProperty(a, "__esModule", {
+import { __exports as e } from "./index214.mjs";
+var t;
+function u() {
+  return t ? e : (t = 1, function(o) {
+    Object.defineProperty(o, "__esModule", {
       value: !0
-    }), Object.defineProperty(a, "compareRouterStates", {
+    }), Object.defineProperty(o, "isBot", {
       enumerable: !0,
       get: function() {
         return i;
       }
     });
-    function i(r, e) {
-      const n = Object.keys(r);
-      if (n.length !== Object.keys(e).length) return !1;
-      for (let y = n.length; y--; ) {
-        const t = n[y];
-        if (t === "query") {
-          const u = Object.keys(r.query);
-          if (u.length !== Object.keys(e.query).length)
-            return !1;
-          for (let f = u.length; f--; ) {
-            const s = u[f];
-            if (!e.query.hasOwnProperty(s) || r.query[s] !== e.query[s])
-              return !1;
-          }
-        } else if (!e.hasOwnProperty(t) || r[t] !== e[t])
-          return !1;
-      }
-      return !0;
+    const r = /Googlebot|Mediapartners-Google|AdsBot-Google|googleweblight|Storebot-Google|Google-PageRenderer|Bingbot|BingPreview|Slurp|DuckDuckBot|baiduspider|yandex|sogou|LinkedInBot|bitlybot|tumblr|vkShare|quora link preview|facebookexternalhit|facebookcatalog|Twitterbot|applebot|redditbot|Slackbot|Discordbot|WhatsApp|SkypeUriPreview|ia_archiver/i;
+    function i(n) {
+      return r.test(n);
     }
-  }(o), o);
+  }(e), e);
 }
 export {
-  p as __require
+  u as __require
 };

package/dist/index141.mjs

@@ -1,30 +1,24 @@
 'use client';
-import { __exports as r } from "./index212.mjs";
-import { __require as c } from "./index122.mjs";
-import { __require as l } from "./index135.mjs";
-var n;
-function h() {
-  return n ? r : (n = 1, function(t) {
+import { __exports as r } from "./index215.mjs";
+var u;
+function m() {
+  return u ? r : (u = 1, function(t) {
     Object.defineProperty(t, "__esModule", {
       value: !0
-    }), Object.defineProperty(t, "isLocalURL", {
+    }), Object.defineProperty(t, "omit", {
       enumerable: !0,
       get: function() {
-        return u;
+        return o;
       }
     });
-    const i = c(), s = l();
-    function u(o) {
-      if (!(0, i.isAbsoluteUrl)(o)) return !0;
-      try {
-        const e = (0, i.getLocationOrigin)(), a = new URL(o, e);
-        return a.origin === e && (0, s.hasBasePath)(a.pathname);
-      } catch {
-        return !1;
-      }
+    function o(i, f) {
+      const n = {};
+      return Object.keys(i).forEach((e) => {
+        f.includes(e) || (n[e] = i[e]);
+      }), n;
     }
   }(r), r);
 }
 export {
-  h as __require
+  m as __require
 };

package/dist/index142.mjs

@@ -1,22 +1,50 @@
 'use client';
-import { __exports as e } from "./index213.mjs";
-var t;
-function u() {
-  return t ? e : (t = 1, function(o) {
-    Object.defineProperty(o, "__esModule", {
+import { __exports as u } from "./index216.mjs";
+import { __require as A } from "./index124.mjs";
+import { __require as x } from "./index125.mjs";
+var d;
+function v() {
+  return d ? u : (d = 1, function(c) {
+    Object.defineProperty(c, "__esModule", {
       value: !0
-    }), Object.defineProperty(o, "isBot", {
+    }), Object.defineProperty(c, "interpolateAs", {
       enumerable: !0,
       get: function() {
-        return i;
+        return y;
       }
     });
-    const r = /Googlebot|Mediapartners-Google|AdsBot-Google|googleweblight|Storebot-Google|Google-PageRenderer|Bingbot|BingPreview|Slurp|DuckDuckBot|baiduspider|yandex|sogou|LinkedInBot|bitlybot|tumblr|vkShare|quora link preview|facebookexternalhit|facebookcatalog|Twitterbot|applebot|redditbot|Slackbot|Discordbot|WhatsApp|SkypeUriPreview|ia_archiver/i;
-    function i(n) {
-      return r.test(n);
+    const m = A(), R = x();
+    function y(o, s, g) {
+      let t = "";
+      const a = (0, R.getRouteRegex)(o), p = a.groups, l = (
+        // Try to match the dynamic route against the asPath
+        (s !== o ? (0, m.getRouteMatcher)(a)(s) : "") || // Fall back to reading the values from the href
+        // TODO: should this take priority; also need to change in the router.
+        g
+      );
+      t = o;
+      const f = Object.keys(p);
+      return f.every((r) => {
+        let e = l[r] || "";
+        const { repeat: n, optional: _ } = p[r];
+        let i = "[" + (n ? "..." : "") + r + "]";
+        return _ && (i = (e ? "" : "/") + "[" + i + "]"), n && !Array.isArray(e) && (e = [
+          e
+        ]), (_ || r in l) && // Interpolate group into data URL if present
+        (t = t.replace(i, n ? e.map(
+          // these values should be fully encoded instead of just
+          // path delimiter escaped since they are being inserted
+          // into the URL and we expect URL encoded segments
+          // when parsing dynamic route params
+          (q) => encodeURIComponent(q)
+        ).join("/") : encodeURIComponent(e)) || "/");
+      }) || (t = ""), {
+        params: f,
+        result: t
+      };
     }
-  }(e), e);
+  }(u), u);
 }
 export {
-  u as __require
+  v as __require
 };

package/dist/index143.mjs

@@ -1,24 +1,26 @@
 'use client';
-import { __exports as r } from "./index214.mjs";
-var u;
-function m() {
-  return u ? r : (u = 1, function(t) {
-    Object.defineProperty(t, "__esModule", {
+import { __exports as t } from "./index217.mjs";
+var n;
+function i() {
+  return n ? t : (n = 1, function(o) {
+    Object.defineProperty(o, "__esModule", {
       value: !0
-    }), Object.defineProperty(t, "omit", {
+    }), Object.defineProperty(o, "handleSmoothScroll", {
       enumerable: !0,
       get: function() {
-        return o;
+        return c;
       }
     });
-    function o(i, f) {
-      const n = {};
-      return Object.keys(i).forEach((e) => {
-        f.includes(e) || (n[e] = i[e]);
-      }), n;
+    function c(l, e) {
+      if (e === void 0 && (e = {}), e.onlyHashChange) {
+        l();
+        return;
+      }
+      const r = document.documentElement, u = r.style.scrollBehavior;
+      r.style.scrollBehavior = "auto", e.dontForceLayout || r.getClientRects(), l(), r.style.scrollBehavior = u;
     }
-  }(r), r);
+  }(t), t);
 }
 export {
-  m as __require
+  i as __require
 };