@instockng/storefront-ui 1.0.107 → 1.0.108

package/dist/index210.mjs

@@ -1,26 +1,5 @@
 'use client';
-import { __exports as r } from "./index266.mjs";
-import { __require as s } from "./index130.mjs";
-var a;
-function _() {
-  return a ? r : (a = 1, function(t) {
-    Object.defineProperty(t, "__esModule", {
-      value: !0
-    }), Object.defineProperty(t, "addPathSuffix", {
-      enumerable: !0,
-      get: function() {
-        return n;
-      }
-    });
-    const i = s();
-    function n(e, u) {
-      if (!e.startsWith("/") || !u)
-        return e;
-      const { pathname: f, query: d, hash: o } = (0, i.parsePath)(e);
-      return "" + f + u + d + o;
-    }
-  }(r), r);
-}
+var a = {};
 export {
-  _ as __require
+  a as __exports
 };

package/dist/index211.mjs

@@ -1,5 +1,26 @@
 'use client';
-var a = {};
+import { __exports as r } from "./index262.mjs";
+import { __require as s } from "./index130.mjs";
+var a;
+function _() {
+  return a ? r : (a = 1, function(t) {
+    Object.defineProperty(t, "__esModule", {
+      value: !0
+    }), Object.defineProperty(t, "addPathSuffix", {
+      enumerable: !0,
+      get: function() {
+        return n;
+      }
+    });
+    const i = s();
+    function n(e, u) {
+      if (!e.startsWith("/") || !u)
+        return e;
+      const { pathname: f, query: d, hash: o } = (0, i.parsePath)(e);
+      return "" + f + u + d + o;
+    }
+  }(r), r);
+}
 export {
-  a as __exports
+  _ as __require
 };

package/dist/index212.mjs

@@ -1,5 +1,5 @@
 'use client';
-var r = {};
+var a = {};
 export {
-  r as __exports
+  a as __exports
 };

package/dist/index213.mjs

@@ -1,5 +1,5 @@
 'use client';
-var o = {};
+var r = {};
 export {
-  o as __exports
+  r as __exports
 };

package/dist/index215.mjs

@@ -1,5 +1,5 @@
 'use client';
-var e = {};
+var o = {};
 export {
-  e as __exports
+  o as __exports
 };

package/dist/index216.mjs

@@ -1,5 +1,5 @@
 'use client';
-var o = {};
+var e = {};
 export {
-  o as __exports
+  e as __exports
 };

package/dist/index217.mjs

@@ -1,5 +1,5 @@
 'use client';
-var s = {};
+var o = {};
 export {
-  s as __exports
+  o as __exports
 };

package/dist/index218.mjs

@@ -1,5 +1,5 @@
 'use client';
-var o = {};
+var s = {};
 export {
-  o as __exports
+  s as __exports
 };

package/dist/index219.mjs

@@ -1,130 +1,5 @@
 'use client';
-import { __module as b } from "./index262.mjs";
-import S from "./index263.mjs";
-var _;
-function $() {
-  return _ ? b.exports : (_ = 1, (() => {
-    var O = { 154: (t, m, n) => {
-      var i = n(781), u = ["write", "end", "destroy"], f = ["resume", "pause"], l = ["data", "close"], c = Array.prototype.slice;
-      t.exports = s;
-      function r(o, a) {
-        if (o.forEach)
-          return o.forEach(a);
-        for (var e = 0; e < o.length; e++)
-          a(o[e], e);
-      }
-      function s(o, a) {
-        var e = new i(), d = !1;
-        return r(u, x), r(f, z), r(l, E), a.on("end", F), o.on("drain", function() {
-          e.emit("drain");
-        }), o.on("error", w), a.on("error", w), e.writable = o.writable, e.readable = a.readable, e;
-        function x(p) {
-          e[p] = h;
-          function h() {
-            return o[p].apply(o, arguments);
-          }
-        }
-        function z(p) {
-          e[p] = h;
-          function h() {
-            e.emit(p);
-            var y = a[p];
-            if (y)
-              return y.apply(a, arguments);
-            a.emit(p);
-          }
-        }
-        function E(p) {
-          a.on(p, h);
-          function h() {
-            var y = c.call(arguments);
-            y.unshift(p), e.emit.apply(e, y);
-          }
-        }
-        function F() {
-          if (!d) {
-            d = !0;
-            var p = c.call(arguments);
-            p.unshift("end"), e.emit.apply(e, p);
-          }
-        }
-        function w(p) {
-          e.emit("error", p);
-        }
-      }
-    }, 349: (t, m, n) => {
-      const i = n(147), u = n(781), f = n(796), l = n(154), c = n(530), r = (s) => Object.assign({ level: 9 }, s);
-      t.exports = (s, o) => s ? c(f.gzip)(s, r(o)).then((a) => a.length).catch((a) => 0) : Promise.resolve(0), t.exports.sync = (s, o) => f.gzipSync(s, r(o)).length, t.exports.stream = (s) => {
-        const o = new u.PassThrough(), a = new u.PassThrough(), e = l(o, a);
-        let d = 0;
-        const x = f.createGzip(r(s)).on("data", (z) => {
-          d += z.length;
-        }).on("error", () => {
-          e.gzipSize = 0;
-        }).on("end", () => {
-          e.gzipSize = d, e.emit("gzip-size", d), a.end();
-        });
-        return o.pipe(x), o.pipe(a, { end: !1 }), e;
-      }, t.exports.file = (s, o) => new Promise((a, e) => {
-        const d = i.createReadStream(s);
-        d.on("error", e);
-        const x = d.pipe(t.exports.stream(o));
-        x.on("error", e), x.on("gzip-size", a);
-      }), t.exports.fileSync = (s, o) => t.exports.sync(i.readFileSync(s), o);
-    }, 530: (t) => {
-      const m = (n, i) => function(...u) {
-        const f = i.promiseModule;
-        return new f((l, c) => {
-          i.multiArgs ? u.push((...r) => {
-            i.errorFirst ? r[0] ? c(r) : (r.shift(), l(r)) : l(r);
-          }) : i.errorFirst ? u.push((r, s) => {
-            r ? c(r) : l(s);
-          }) : u.push(l), n.apply(this, u);
-        });
-      };
-      t.exports = (n, i) => {
-        i = Object.assign({ exclude: [/.+(Sync|Stream)$/], errorFirst: !0, promiseModule: Promise }, i);
-        const u = typeof n;
-        if (!(n !== null && (u === "object" || u === "function")))
-          throw new TypeError(`Expected \`input\` to be a \`Function\` or \`Object\`, got \`${n === null ? "null" : u}\``);
-        const f = (c) => {
-          const r = (s) => typeof s == "string" ? c === s : s.test(c);
-          return i.include ? i.include.some(r) : !i.exclude.some(r);
-        };
-        let l;
-        u === "function" ? l = function(...c) {
-          return i.excludeMain ? n(...c) : m(n, i).apply(this, c);
-        } : l = Object.create(Object.getPrototypeOf(n));
-        for (const c in n) {
-          const r = n[c];
-          l[c] = typeof r == "function" && f(c) ? m(r, i) : r;
-        }
-        return l;
-      };
-    }, 147: (t) => {
-      t.exports = S;
-    }, 781: (t) => {
-      t.exports = S;
-    }, 796: (t) => {
-      t.exports = S;
-    } }, v = {};
-    function g(t) {
-      var m = v[t];
-      if (m !== void 0)
-        return m.exports;
-      var n = v[t] = { exports: {} }, i = !0;
-      try {
-        O[t](n, n.exports, g), i = !1;
-      } finally {
-        i && delete v[t];
-      }
-      return n.exports;
-    }
-    typeof g < "u" && (g.ab = __dirname + "/");
-    var j = g(349);
-    b.exports = j;
-  })(), b.exports);
-}
+var o = {};
 export {
-  $ as __require
+  o as __exports
 };

package/dist/index22.mjs

@@ -1,48 +1,266 @@
 'use client';
-import { jsxs as e, jsx as t } from "react/jsx-runtime";
-import { Sparkles as i } from "lucide-react";
-import { cn as r } from "./index30.mjs";
-function u({
-  faqs: o = [],
-  onAsk: s,
-  className: n
+import { jsxs as l, jsx as r } from "react/jsx-runtime";
+import { useState as m, useRef as b, useCallback as V, useEffect as N } from "react";
+import { createPortal as O } from "react-dom";
+import { Sparkles as Q, X as ee, Loader2 as te, Send as re } from "lucide-react";
+import { cn as k, formatCurrency as se } from "./index30.mjs";
+import { useHideBodyOverflow as ne } from "./index53.mjs";
+function me({
+  isOpen: c,
+  onClose: y,
+  apiUrl: T,
+  brandSlug: C,
+  productSlug: I,
+  initialQuestion: x,
+  assistantName: $ = "AI Assistant",
+  className: X,
+  disablePortal: G = !1
 }) {
-  return o.length === 0 ? null : /* @__PURE__ */ e("div", { className: r("space-y-2", n), children: [
-    /* @__PURE__ */ e("div", { className: "flex items-center gap-1.5 text-sm font-medium text-gray-700", children: [
-      /* @__PURE__ */ t(i, { className: "h-4 w-4 text-orange-500" }),
-      "Ask AI"
-    ] }),
-    /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-2", children: [
-      o.map((l, a) => /* @__PURE__ */ t(
-        "button",
-        {
-          type: "button",
-          onClick: () => s(l.question),
-          className: r(
-            "rounded-full border border-gray-200 bg-blue-50/60 px-3 py-1.5 text-sm text-gray-700",
-            "hover:bg-blue-100 hover:border-blue-200 transition-colors",
-            "active:scale-95"
-          ),
-          children: l.question
-        },
-        a
-      )),
-      /* @__PURE__ */ t(
-        "button",
-        {
-          type: "button",
-          onClick: () => s(""),
-          className: r(
-            "rounded-full border border-gray-300 bg-gray-800 px-3 py-1.5 text-sm text-white font-medium",
-            "hover:bg-gray-700 transition-colors",
-            "active:scale-95"
-          ),
-          children: "Ask something else"
+  const [u, d] = m([]), [w, S] = m(""), [f, D] = m(!1), [J, h] = m(null), [L, P] = m(!1), [K, W] = m(!1), q = b(null), F = b(null), E = b(!1), M = b([]);
+  M.current = u, ne(c);
+  const z = V((e, a) => {
+    if (e === "token")
+      d((s) => {
+        const o = [...s], t = o[o.length - 1];
+        return (t == null ? void 0 : t.role) === "assistant" && (o[o.length - 1] = { ...t, content: t.content + a }), o;
+      });
+    else if (e === "done")
+      try {
+        const s = JSON.parse(a);
+        d((o) => {
+          var i;
+          const t = [...o], n = t[t.length - 1];
+          return (n == null ? void 0 : n.role) === "assistant" && (t[t.length - 1] = {
+            ...n,
+            content: s.answer || n.content,
+            products: ((i = s.products) == null ? void 0 : i.length) > 0 ? s.products : void 0
+          }), t;
+        });
+      } catch {
+      }
+    else if (e === "error")
+      try {
+        const s = JSON.parse(a);
+        h(s.message || "An error occurred");
+      } catch {
+        h("An error occurred");
+      }
+  }, []), v = b(), B = V(
+    async (e) => {
+      var o;
+      if (!e.trim()) return;
+      h(null);
+      const a = { role: "user", content: e }, s = M.current.map((t) => ({
+        role: t.role,
+        content: t.content
+      }));
+      d((t) => [...t, a]), S(""), D(!0), d((t) => [...t, { role: "assistant", content: "" }]);
+      try {
+        const t = await fetch(`${T}/v1/assistant/ask`, {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            question: e,
+            brandSlug: C,
+            productSlug: I,
+            history: s
+          })
+        });
+        if (!t.ok) {
+          const g = await t.json().catch(() => ({}));
+          throw new Error(
+            ((o = g == null ? void 0 : g.error) == null ? void 0 : o.message) || `Request failed (${t.status})`
+          );
         }
-      )
-    ] })
-  ] });
+        if (!t.body) throw new Error("No response body");
+        const n = t.body.getReader(), i = new TextDecoder();
+        let A = "", j = "";
+        for (; ; ) {
+          const { done: g, value: Z } = await n.read();
+          if (g) break;
+          A += i.decode(Z, { stream: !0 });
+          const U = A.split(`
+`);
+          A = U.pop() || "";
+          for (const p of U) {
+            if (p.trim() === "") {
+              j = "";
+              continue;
+            }
+            if (p.trimStart().startsWith("event:"))
+              j = p.trimStart().slice(6).trim();
+            else if (p.trimStart().startsWith("data:")) {
+              const R = p.trimStart().slice(5), _ = R.startsWith(" ") ? R.slice(1) : R;
+              z(j || "token", _);
+            }
+          }
+        }
+      } catch (t) {
+        h(t.message || "Something went wrong"), d((n) => {
+          const i = n[n.length - 1];
+          return (i == null ? void 0 : i.role) === "assistant" && !i.content ? n.slice(0, -1) : n;
+        });
+      } finally {
+        D(!1);
+      }
+    },
+    [T, C, I, z]
+  );
+  v.current = B, N(() => {
+    if (c)
+      W(!0), requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          P(!0);
+        });
+      });
+    else {
+      P(!1);
+      const e = setTimeout(() => {
+        W(!1), d([]), S(""), h(null), E.current = !1;
+      }, 300);
+      return () => clearTimeout(e);
+    }
+  }, [c]), N(() => {
+    c && x && !E.current && (E.current = !0, x.trim() ? setTimeout(() => {
+      var e;
+      return (e = v.current) == null ? void 0 : e.call(v, x);
+    }, 100) : setTimeout(() => {
+      var e;
+      return (e = F.current) == null ? void 0 : e.focus();
+    }, 350));
+  }, [c, x]), N(() => {
+    var e;
+    (e = q.current) == null || e.scrollIntoView({ behavior: "smooth" });
+  }, [u]), N(() => {
+    const e = (a) => {
+      a.key === "Escape" && c && y();
+    };
+    if (c)
+      return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+  }, [c, y]);
+  const Y = (e) => {
+    e.preventDefault(), w.trim() && B(w.trim());
+  };
+  if (!K) return null;
+  const H = /* @__PURE__ */ l(
+    "div",
+    {
+      className: k(
+        "fixed inset-0 z-50 transition-opacity duration-300",
+        L ? "opacity-100" : "opacity-0"
+      ),
+      children: [
+        /* @__PURE__ */ r(
+          "div",
+          {
+            className: "absolute inset-0 bg-black/40 backdrop-blur-sm",
+            onClick: y
+          }
+        ),
+        /* @__PURE__ */ l(
+          "div",
+          {
+            className: k(
+              "absolute bg-white flex flex-col transition-transform duration-300 ease-out",
+              // Mobile: bottom sheet
+              "inset-x-0 bottom-0 top-[10vh] rounded-t-2xl",
+              // Desktop: right side drawer
+              "sm:inset-y-0 sm:right-0 sm:left-auto sm:w-[420px] sm:max-w-full sm:rounded-t-none sm:rounded-l-2xl",
+              // Animation
+              L ? "translate-y-0 sm:translate-x-0" : "translate-y-full sm:translate-y-0 sm:translate-x-full",
+              X
+            ),
+            children: [
+              /* @__PURE__ */ l("div", { className: "flex items-center justify-between border-b border-gray-200 px-4 py-3 flex-shrink-0", children: [
+                /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ r(Q, { className: "h-5 w-5 text-orange-500" }),
+                  /* @__PURE__ */ r("span", { className: "font-semibold text-gray-900", children: $ }),
+                  /* @__PURE__ */ r("span", { className: "text-xs text-gray-400 bg-gray-100 rounded px-1.5 py-0.5", children: "beta" })
+                ] }),
+                /* @__PURE__ */ r(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: y,
+                    className: "p-2 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-lg transition-colors",
+                    "aria-label": "Close",
+                    children: /* @__PURE__ */ r(ee, { className: "h-5 w-5" })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ l("div", { className: "flex-1 overflow-y-auto p-4 space-y-4 min-h-0", children: [
+                u.length === 0 && !f && /* @__PURE__ */ r("div", { className: "text-center text-gray-400 text-sm py-8", children: "Ask me anything about our products!" }),
+                u.map((e, a) => /* @__PURE__ */ r("div", { children: e.role === "user" ? /* @__PURE__ */ r("div", { className: "flex justify-end", children: /* @__PURE__ */ r("div", { className: "bg-gray-800 text-white rounded-2xl rounded-br-sm px-4 py-2 max-w-[80%] text-sm", children: e.content }) }) : /* @__PURE__ */ l("div", { className: "space-y-3", children: [
+                  /* @__PURE__ */ l("div", { className: "text-sm text-gray-800 leading-relaxed whitespace-pre-wrap", children: [
+                    e.content,
+                    f && a === u.length - 1 && /* @__PURE__ */ r("span", { className: "inline-block w-1.5 h-4 bg-gray-400 animate-pulse ml-0.5 align-text-bottom" })
+                  ] }),
+                  e.products && e.products.length > 0 && /* @__PURE__ */ r("div", { className: "space-y-2", children: e.products.map((s) => /* @__PURE__ */ l(
+                    "a",
+                    {
+                      href: `/product/${s.slug}`,
+                      className: "flex items-center gap-3 w-full rounded-xl border border-gray-200 p-2 hover:bg-gray-50 transition-colors text-left no-underline",
+                      children: [
+                        s.thumbnailUrl ? /* @__PURE__ */ r(
+                          "img",
+                          {
+                            src: s.thumbnailUrl,
+                            alt: s.name,
+                            className: "h-16 w-16 rounded-lg object-cover flex-shrink-0"
+                          }
+                        ) : /* @__PURE__ */ r("div", { className: "h-16 w-16 rounded-lg bg-gray-100 flex-shrink-0" }),
+                        /* @__PURE__ */ l("div", { className: "min-w-0", children: [
+                          /* @__PURE__ */ r("p", { className: "text-sm font-medium text-gray-900 line-clamp-2", children: s.name }),
+                          /* @__PURE__ */ r("p", { className: "text-sm font-semibold text-blue-600", children: se(s.price) })
+                        ] })
+                      ]
+                    },
+                    s.slug
+                  )) })
+                ] }) }, a)),
+                J && /* @__PURE__ */ r("div", { className: "rounded-lg bg-red-50 border border-red-200 p-3 text-sm text-red-700", children: J }),
+                /* @__PURE__ */ r("div", { ref: q })
+              ] }),
+              /* @__PURE__ */ r("div", { className: "border-t border-gray-200 p-3 flex-shrink-0", children: /* @__PURE__ */ l("form", { onSubmit: Y, className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ r(
+                  "input",
+                  {
+                    ref: F,
+                    type: "text",
+                    value: w,
+                    onChange: (e) => S(e.target.value),
+                    placeholder: `Ask ${$} a question`,
+                    disabled: f,
+                    className: k(
+                      "flex-1 rounded-full border border-gray-300 px-4 py-2.5 text-sm",
+                      "focus:border-blue-400 focus:outline-none focus:ring-2 focus:ring-blue-400/30",
+                      "disabled:opacity-50"
+                    )
+                  }
+                ),
+                /* @__PURE__ */ r(
+                  "button",
+                  {
+                    type: "submit",
+                    disabled: !w.trim() || f,
+                    className: k(
+                      "flex h-10 w-10 items-center justify-center rounded-full",
+                      "bg-gray-800 text-white",
+                      "hover:bg-gray-700 transition-colors",
+                      "disabled:opacity-40 disabled:cursor-not-allowed"
+                    ),
+                    children: f ? /* @__PURE__ */ r(te, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ r(re, { className: "h-4 w-4" })
+                  }
+                )
+              ] }) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+  return G ? H : O(H, document.body);
 }
 export {
-  u as ProductAssistantChips
+  me as AssistantDrawer
 };