@instockng/storefront-ui 1.0.75 → 1.0.77

package/dist/index108.mjs

@@ -1,25 +1,218 @@
 'use client';
-import { __exports as r } from "./index167.mjs";
-import { __require as m } from "./index168.mjs";
-import { __require as l } from "./index169.mjs";
-var i;
-function p() {
-  return i ? r : (i = 1, function(t) {
-    Object.defineProperty(t, "__esModule", {
+import { __module as m } from "./index158.mjs";
+import "./index98.mjs";
+import { __require as j } from "./index159.mjs";
+import { __require as V } from "./index160.mjs";
+import { __require as k } from "./index161.mjs";
+import { __require as G } from "./index162.mjs";
+import { __require as W } from "./index163.mjs";
+import { __exports as X } from "./index103.mjs";
+var M;
+function ee() {
+  return M ? m.exports : (M = 1, function(N, c) {
+    Object.defineProperty(c, "__esModule", {
       value: !0
-    }), Object.defineProperty(t, "denormalizePagePath", {
-      enumerable: !0,
-      get: function() {
-        return o;
+    });
+    function b(t, e) {
+      for (var r in e) Object.defineProperty(t, r, {
+        enumerable: !0,
+        get: e[r]
+      });
+    }
+    b(c, {
+      createRouteLoader: function() {
+        return B;
+      },
+      getClientBuildManifest: function() {
+        return q;
+      },
+      isAssetError: function() {
+        return L;
+      },
+      markAssetError: function() {
+        return f;
       }
     });
-    const a = m(), n = l();
-    function o(u) {
-      let e = (0, n.normalizePathSep)(u);
-      return e.startsWith("/index/") && !(0, a.isDynamicRoute)(e) ? e.slice(6) : e !== "/index" ? e : "/";
+    const D = /* @__PURE__ */ X._(j()), v = V(), p = k(), A = G(), y = W(), S = 3800;
+    function P(t, e, r) {
+      let l = e.get(t);
+      if (l)
+        return "future" in l ? l.future : Promise.resolve(l);
+      let s;
+      const a = new Promise((d) => {
+        s = d;
+      });
+      return e.set(t, {
+        resolve: s,
+        future: a
+      }), r ? r().then((d) => (s(d), d)).catch((d) => {
+        throw e.delete(t), d;
+      }) : a;
+    }
+    const w = Symbol("ASSET_LOAD_ERROR");
+    function f(t) {
+      return Object.defineProperty(t, w, {});
+    }
+    function L(t) {
+      return t && w in t;
+    }
+    function T(t) {
+      try {
+        return t = document.createElement("link"), // detect IE11 since it supports prefetch but isn't detected
+        // with relList.support
+        !!window.MSInputMethodContext && !!document.documentMode || t.relList.supports("prefetch");
+      } catch {
+        return !1;
+      }
+    }
+    const C = T(), h = () => (0, A.getDeploymentIdQueryOrEmptyString)();
+    function F(t, e, r) {
+      return new Promise((l, s) => {
+        const a = `
+      link[rel="prefetch"][href^="` + t + `"],
+      link[rel="preload"][href^="` + t + `"],
+      script[src^="` + t + '"]';
+        if (document.querySelector(a))
+          return l();
+        r = document.createElement("link"), r.as = e, r.rel = "prefetch", r.crossOrigin = process.env.__NEXT_CROSS_ORIGIN, r.onload = l, r.onerror = () => s(f(new Error("Failed to prefetch: " + t))), r.href = t, document.head.appendChild(r);
+      });
+    }
+    function R(t, e) {
+      return new Promise((r, l) => {
+        e = document.createElement("script"), e.onload = r, e.onerror = () => l(f(new Error("Failed to load script: " + t))), e.crossOrigin = process.env.__NEXT_CROSS_ORIGIN, e.src = t, document.body.appendChild(e);
+      });
+    }
+    let g;
+    function I(t, e, r) {
+      return new Promise((l, s) => {
+        let a = !1;
+        t.then((d) => {
+          a = !0, l(d);
+        }).catch(s), process.env.NODE_ENV === "development" && (g || Promise.resolve()).then(() => {
+          (0, p.requestIdleCallback)(() => setTimeout(() => {
+            a || s(r);
+          }, e));
+        }), process.env.NODE_ENV !== "development" && (0, p.requestIdleCallback)(() => setTimeout(() => {
+          a || s(r);
+        }, e));
+      });
+    }
+    function q() {
+      if (self.__BUILD_MANIFEST)
+        return Promise.resolve(self.__BUILD_MANIFEST);
+      const t = new Promise((e) => {
+        const r = self.__BUILD_MANIFEST_CB;
+        self.__BUILD_MANIFEST_CB = () => {
+          e(self.__BUILD_MANIFEST), r && r();
+        };
+      });
+      return I(t, S, f(new Error("Failed to load client build manifest")));
+    }
+    function O(t, e) {
+      if (process.env.NODE_ENV === "development") {
+        const r = t + "/_next/static/chunks/pages" + (0, y.encodeURIPath)((0, D.default)(e, ".js")) + h();
+        return Promise.resolve({
+          scripts: [
+            (0, v.__unsafeCreateTrustedScriptURL)(r)
+          ],
+          // Styles are handled by `style-loader` in development:
+          css: []
+        });
+      }
+      return q().then((r) => {
+        if (!(e in r))
+          throw f(new Error("Failed to lookup route: " + e));
+        const l = r[e].map((s) => t + "/_next/" + (0, y.encodeURIPath)(s));
+        return {
+          scripts: l.filter((s) => s.endsWith(".js")).map((s) => (0, v.__unsafeCreateTrustedScriptURL)(s) + h()),
+          css: l.filter((s) => s.endsWith(".css")).map((s) => s + h())
+        };
+      });
+    }
+    function B(t) {
+      const e = /* @__PURE__ */ new Map(), r = /* @__PURE__ */ new Map(), l = /* @__PURE__ */ new Map(), s = /* @__PURE__ */ new Map();
+      function a(n) {
+        if (process.env.NODE_ENV !== "development") {
+          let i = r.get(n.toString());
+          return i || (document.querySelector('script[src^="' + n + '"]') ? Promise.resolve() : (r.set(n.toString(), i = R(n)), i));
+        } else
+          return R(n);
+      }
+      function d(n) {
+        let i = l.get(n);
+        return i || (l.set(n, i = fetch(n, {
+          credentials: "same-origin"
+        }).then((o) => {
+          if (!o.ok)
+            throw new Error("Failed to load stylesheet: " + n);
+          return o.text().then((u) => ({
+            href: n,
+            content: u
+          }));
+        }).catch((o) => {
+          throw f(o);
+        })), i);
+      }
+      return {
+        whenEntrypoint(n) {
+          return P(n, e);
+        },
+        onEntrypoint(n, i) {
+          (i ? Promise.resolve().then(() => i()).then((o) => ({
+            component: o && o.default || o,
+            exports: o
+          }), (o) => ({
+            error: o
+          })) : Promise.resolve(void 0)).then((o) => {
+            const u = e.get(n);
+            u && "resolve" in u ? o && (e.set(n, o), u.resolve(o)) : (o ? e.set(n, o) : e.delete(n), s.delete(n));
+          });
+        },
+        loadRoute(n, i) {
+          return P(n, s, () => {
+            let o;
+            return process.env.NODE_ENV === "development" && (g = new Promise((u) => {
+              o = u;
+            })), I(O(t, n).then((u) => {
+              let { scripts: _, css: E } = u;
+              return Promise.all([
+                e.has(n) ? [] : Promise.all(_.map(a)),
+                Promise.all(E.map(d))
+              ]);
+            }).then((u) => this.whenEntrypoint(n).then((_) => ({
+              entrypoint: _,
+              styles: u[1]
+            }))), S, f(new Error("Route did not complete loading: " + n))).then((u) => {
+              let { entrypoint: _, styles: E } = u;
+              const U = Object.assign({
+                styles: E
+              }, _);
+              return "error" in _ ? _ : U;
+            }).catch((u) => {
+              if (i)
+                throw u;
+              return {
+                error: u
+              };
+            }).finally(() => o == null ? void 0 : o());
+          });
+        },
+        prefetch(n) {
+          let i;
+          return (i = navigator.connection) && (i.saveData || /2g/.test(i.effectiveType)) ? Promise.resolve() : O(t, n).then((o) => Promise.all(C ? o.scripts.map((u) => F(u.toString(), "script")) : [])).then(() => {
+            (0, p.requestIdleCallback)(() => this.loadRoute(n, !0).catch(() => {
+            }));
+          }).catch(
+            // swallow prefetch errors
+            () => {
+            }
+          );
+        }
+      };
     }
-  }(r), r);
+    (typeof c.default == "function" || typeof c.default == "object" && c.default !== null) && typeof c.default.__esModule > "u" && (Object.defineProperty(c.default, "__esModule", { value: !0 }), Object.assign(c.default, c), N.exports = c.default);
+  }(m, m.exports), m.exports);
 }
 export {
-  p as __require
+  ee as __require
 };

package/dist/index109.mjs

@@ -1,26 +1,183 @@
 'use client';
-import { __exports as t } from "./index170.mjs";
-var i;
-function s() {
-  return i ? t : (i = 1, function(o) {
+import { __module as L } from "./index164.mjs";
+import "./index98.mjs";
+import { __require as K } from "./index106.mjs";
+import F from "react/jsx-runtime";
+import J from "react-dom";
+import N from "react";
+import { __require as B } from "./index165.mjs";
+import { __require as D } from "./index166.mjs";
+import { __require as G } from "./index161.mjs";
+import { __exports as Q } from "./index103.mjs";
+var w;
+function ie() {
+  return w ? L.exports : (w = 1, function(x, o) {
+    "use client";
     Object.defineProperty(o, "__esModule", {
       value: !0
-    }), Object.defineProperty(o, "normalizeLocalePath", {
-      enumerable: !0,
-      get: function() {
-        return u;
+    });
+    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 $;
       }
     });
-    function u(r, l) {
-      let a;
-      const e = r.split("/");
-      return (l || []).some((n) => e[1] && e[1].toLowerCase() === n.toLowerCase() ? (a = n, e.splice(1, 1), r = e.join("/") || "/", !0) : !1), {
-        pathname: r,
-        detectedLocale: a
-      };
+    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);
+        });
+      }
+    }, 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));
+      });
     }
-  }(t), 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 null;
+    }
+    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 {
-  s as __require
+  ie as __require
 };

package/dist/index11.mjs

@@ -1,106 +1,134 @@
 'use client';
-import { jsx as i, jsxs as t, Fragment as g } from "react/jsx-runtime";
-import "./index23.mjs";
-import { useGetCartRecommendations as F } from "./index35.mjs";
+import { jsx as i, jsxs as s, Fragment as f } from "react/jsx-runtime";
+import "./index24.mjs";
+import { useGetCartRecommendations as U } from "./index36.mjs";
 import "@tanstack/react-query";
-import { useCart as T } from "./index3.mjs";
-import { cn as x, formatCurrency as L } from "./index22.mjs";
-import { Button as S } from "./index16.mjs";
-import { Loader2 as N, Package as U, ShoppingCart as q } from "lucide-react";
-import { useState as d, useEffect as z } from "react";
-function K({
-  limit: v,
-  className: w
+import { useCart as q } from "./index3.mjs";
+import { cn as p, formatCurrency as z } from "./index23.mjs";
+import { Button as B } from "./index17.mjs";
+import { Loader2 as b, Package as D, ShoppingCart as E } from "lucide-react";
+import { useState as r, useEffect as G } from "react";
+import { VariantPickerModal as H } from "./index12.mjs";
+function _({
+  limit: P,
+  className: C
 }) {
-  const { cart: a, addItem: p } = T(), { data: r, isLoading: b, error: y } = F(a == null ? void 0 : a.id, v), [P, o] = d([]), [I, m] = d([]), [C, f] = d([]), [k, h] = d([]);
-  if (z(() => {
-    h([]), m([]), f([]);
-  }, [r]), !a)
+  const { cart: o, addItem: k } = q(), { data: c, isLoading: I, error: A } = U(o == null ? void 0 : o.id, P), [j, h] = r([]), [F, u] = r([]), [V, g] = r([]), [L, x] = r([]), [v, m] = r(null), [M, w] = r(!1);
+  if (G(() => {
+    x([]), u([]), g([]);
+  }, [c]), !o)
     return null;
-  if (b)
-    return /* @__PURE__ */ i("div", { className: "py-6", children: /* @__PURE__ */ i("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ i(N, { className: "h-6 w-6 animate-spin text-accent-500" }) }) });
-  const n = r == null ? void 0 : r.filter(
-    (e) => !k.includes(e.id)
+  if (I)
+    return /* @__PURE__ */ i("div", { className: "py-6", children: /* @__PURE__ */ i("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ i(b, { className: "h-6 w-6 animate-spin text-accent-500" }) }) });
+  const a = c == null ? void 0 : c.filter(
+    (e) => !L.includes(e.id)
   );
-  if (y || !n || n.length === 0)
+  if (A || !a || a.length === 0)
     return null;
-  const j = async (e, l) => {
-    o((s) => [...s, e.id]);
+  const N = async (e, t) => {
+    h((n) => [...n, e.id]);
     try {
-      await p(e.slug, e.name, l.price, l.sku, 1), m((s) => [...s, e.id]), setTimeout(() => {
-        f((s) => [...s, e.id]);
+      await k(e.slug, e.name, t.price, t.sku, 1), u((n) => [...n, e.id]), setTimeout(() => {
+        g((n) => [...n, e.id]);
       }, 500), setTimeout(() => {
-        h((s) => [...s, e.id]);
+        x((n) => [...n, e.id]);
       }, 1e3);
     } finally {
-      o((s) => s.filter((c) => c !== e.id));
+      h((n) => n.filter((l) => l !== e.id));
+    }
+  }, T = (e) => {
+    if (e.variants.length > 1) {
+      m(e);
+      return;
+    }
+    const t = e.variants[0];
+    t && N(e, t);
+  }, S = async (e, t) => {
+    w(!0);
+    try {
+      const n = a.find((d) => d.id === e.id), l = n == null ? void 0 : n.variants.find((d) => d.id === t.id);
+      n && l && await N(n, l), m(null);
+    } finally {
+      w(!1);
     }
   };
-  return /* @__PURE__ */ t("div", { className: x("pt-2", w), children: [
-    /* @__PURE__ */ i("div", { className: "mb-2 px-4", children: /* @__PURE__ */ i("h3", { className: "text-lg font-semibold text-gray-900", children: "Frequently bought together" }) }),
-    /* @__PURE__ */ i("div", { className: "overflow-x-auto", children: /* @__PURE__ */ t("div", { className: "flex gap-4 pb-2 transition-all duration-500", children: [
-      /* @__PURE__ */ i("div", { className: "flex-shrink-0 w-1" }),
-      n == null ? void 0 : n.map((e) => {
-        const l = e.variants[0];
-        if (!l) return null;
-        const s = P.includes(e.id), c = I.includes(e.id), A = C.includes(e.id);
-        return /* @__PURE__ */ i(
-          "div",
-          {
-            className: x(
-              "flex flex-row flex-shrink-0 w-64 h-24 bg-white border border-gray-300 rounded-lg overflow-hidden transition-all duration-500",
-              c && "opacity-0 blur-sm scale-95 pointer-events-none",
-              A && "w-0 h-0 mr-[-1rem] overflow-hidden"
-            ),
-            children: /* @__PURE__ */ t(
-              "a",
-              {
-                href: `/product/${e.slug}`,
-                className: "flex flex-row flex-1 hover:bg-gray-50 transition-colors",
-                children: [
-                  /* @__PURE__ */ i("div", { className: "relative w-20 h-full flex-shrink-0 bg-gray-100", children: e.thumbnailUrl ? /* @__PURE__ */ i(
-                    "img",
-                    {
-                      src: e.thumbnailUrl,
-                      alt: 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__ */ t("div", { className: "p-2 flex flex-col flex-1 justify-between", children: [
-                    /* @__PURE__ */ t("div", { children: [
-                      /* @__PURE__ */ i("h4", { className: "text-xs font-medium text-gray-900 line-clamp-2 leading-tight", children: e.name }),
-                      /* @__PURE__ */ i("p", { className: "text-xs font-semibold text-accent-600 mt-0.5", children: L(l.price) })
-                    ] }),
-                    /* @__PURE__ */ i(
-                      S,
+  return /* @__PURE__ */ s(f, { children: [
+    /* @__PURE__ */ s("div", { className: p("pt-2", C), children: [
+      /* @__PURE__ */ i("div", { className: "mb-2 px-4", children: /* @__PURE__ */ i("h3", { className: "text-lg font-semibold text-gray-900", children: "Frequently bought together" }) }),
+      /* @__PURE__ */ i("div", { className: "overflow-x-auto", children: /* @__PURE__ */ s("div", { className: "flex gap-4 pb-2 transition-all duration-500", children: [
+        /* @__PURE__ */ i("div", { className: "flex-shrink-0 w-1" }),
+        a == null ? void 0 : a.map((e) => {
+          const t = e.variants[0];
+          if (!t) return null;
+          const n = j.includes(e.id), l = F.includes(e.id), d = V.includes(e.id);
+          return /* @__PURE__ */ i(
+            "div",
+            {
+              className: p(
+                "flex flex-row flex-shrink-0 w-64 h-24 bg-white border border-gray-300 rounded-lg overflow-hidden transition-all duration-500",
+                l && "opacity-0 blur-sm scale-95 pointer-events-none",
+                d && "w-0 h-0 mr-[-1rem] overflow-hidden"
+              ),
+              children: /* @__PURE__ */ s(
+                "a",
+                {
+                  href: `/product/${e.slug}`,
+                  className: "flex flex-row flex-1 hover:bg-gray-50 transition-colors",
+                  children: [
+                    /* @__PURE__ */ i("div", { className: "relative w-20 h-full flex-shrink-0 bg-gray-100", children: e.thumbnailUrl ? /* @__PURE__ */ i(
+                      "img",
                       {
-                        size: "sm",
-                        onClick: (u) => {
-                          u.preventDefault(), u.stopPropagation(), j(e, l);
-                        },
-                        disabled: s,
-                        className: "w-full bg-accent-500 hover:bg-accent-600 text-white text-xs h-6 mt-1",
-                        children: s ? /* @__PURE__ */ t(g, { children: [
-                          /* @__PURE__ */ i(N, { className: "h-3 w-3 animate-spin" }),
-                          "Adding..."
-                        ] }) : /* @__PURE__ */ t(g, { children: [
-                          /* @__PURE__ */ i(q, { className: "h-3 w-3" }),
-                          "Add"
-                        ] })
+                        src: e.thumbnailUrl,
+                        alt: e.name,
+                        className: "w-full h-full object-cover"
                       }
-                    )
-                  ] })
-                ]
-              }
-            )
-          },
-          e.id
-        );
-      }),
-      /* @__PURE__ */ i("div", { className: "flex-shrink-0 w-1" })
-    ] }) })
+                    ) : /* @__PURE__ */ i("div", { className: "w-full h-full flex items-center justify-center", children: /* @__PURE__ */ i(D, { className: "h-8 w-8 text-gray-300" }) }) }),
+                    /* @__PURE__ */ s("div", { className: "p-2 flex flex-col flex-1 justify-between", children: [
+                      /* @__PURE__ */ s("div", { children: [
+                        /* @__PURE__ */ i("h4", { className: "text-xs font-medium text-gray-900 line-clamp-2 leading-tight", children: e.name }),
+                        /* @__PURE__ */ i("p", { className: "text-xs font-semibold text-accent-600 mt-0.5", children: z(t.price) })
+                      ] }),
+                      /* @__PURE__ */ i(
+                        B,
+                        {
+                          size: "sm",
+                          onClick: (y) => {
+                            y.preventDefault(), y.stopPropagation(), T(e);
+                          },
+                          disabled: n,
+                          className: "w-full bg-accent-500 hover:bg-accent-600 text-white text-xs h-6 mt-1",
+                          children: n ? /* @__PURE__ */ s(f, { children: [
+                            /* @__PURE__ */ i(b, { className: "h-3 w-3 animate-spin" }),
+                            "Adding..."
+                          ] }) : /* @__PURE__ */ s(f, { children: [
+                            /* @__PURE__ */ i(E, { className: "h-3 w-3" }),
+                            "Add"
+                          ] })
+                        }
+                      )
+                    ] })
+                  ]
+                }
+              )
+            },
+            e.id
+          );
+        }),
+        /* @__PURE__ */ i("div", { className: "flex-shrink-0 w-1" })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ i(
+      H,
+      {
+        isOpen: !!v,
+        onClose: () => m(null),
+        product: v,
+        onConfirm: S,
+        isLoading: M
+      }
+    )
   ] });
 }
 export {
-  K as RecommendedProducts
+  _ as RecommendedProducts
 };