react-sigma-chatbox 1.0.3 → 1.0.5

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import ce, { useState as R, useRef as ne, useEffect as q, useMemo as K } from "react";
-var H = { exports: {} }, W = {};
+import de, { useState as k, useEffect as I, useRef as ne, useMemo as Z } from "react";
+var H = { exports: {} }, Y = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -10,28 +10,28 @@ var H = { exports: {} }, W = {};
  * LICENSE file in the root directory of this source tree.
  */
 var se;
-function de() {
-  if (se) return W;
+function ue() {
+  if (se) return Y;
   se = 1;
-  var r = Symbol.for("react.transitional.element"), u = Symbol.for("react.fragment");
-  function s(o, l, c) {
-    var x = null;
-    if (c !== void 0 && (x = "" + c), l.key !== void 0 && (x = "" + l.key), "key" in l) {
-      c = {};
-      for (var i in l)
-        i !== "key" && (c[i] = l[i]);
-    } else c = l;
-    return l = c.ref, {
+  var r = Symbol.for("react.transitional.element"), i = Symbol.for("react.fragment");
+  function n(s, l, d) {
+    var m = null;
+    if (d !== void 0 && (m = "" + d), l.key !== void 0 && (m = "" + l.key), "key" in l) {
+      d = {};
+      for (var c in l)
+        c !== "key" && (d[c] = l[c]);
+    } else d = l;
+    return l = d.ref, {
       $$typeof: r,
-      type: o,
-      key: x,
+      type: s,
+      key: m,
       ref: l !== void 0 ? l : null,
-      props: c
+      props: d
     };
   }
-  return W.Fragment = u, W.jsx = s, W.jsxs = s, W;
+  return Y.Fragment = i, Y.jsx = n, Y.jsxs = n, Y;
 }
-var Y = {};
+var U = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -42,125 +42,125 @@ var Y = {};
  * LICENSE file in the root directory of this source tree.
  */
 var ae;
-function ue() {
+function he() {
   return ae || (ae = 1, process.env.NODE_ENV !== "production" && (function() {
     function r(t) {
       if (t == null) return null;
       if (typeof t == "function")
-        return t.$$typeof === N ? null : t.displayName || t.name || null;
+        return t.$$typeof === T ? null : t.displayName || t.name || null;
       if (typeof t == "string") return t;
       switch (t) {
-        case T:
+        case R:
           return "Fragment";
-        case X:
+        case q:
           return "Profiler";
-        case C:
+        case A:
           return "StrictMode";
-        case V:
+        case z:
           return "Suspense";
-        case J:
-          return "SuspenseList";
         case G:
+          return "SuspenseList";
+        case J:
           return "Activity";
       }
       if (typeof t == "object")
         switch (typeof t.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
         ), t.$$typeof) {
-          case _:
+          case v:
             return "Portal";
-          case B:
+          case X:
             return t.displayName || "Context";
-          case z:
+          case V:
             return (t._context.displayName || "Context") + ".Consumer";
-          case U:
-            var a = t.render;
-            return t = t.displayName, t || (t = a.displayName || a.name || "", t = t !== "" ? "ForwardRef(" + t + ")" : "ForwardRef"), t;
-          case v:
-            return a = t.displayName || null, a !== null ? a : r(t.type) || "Memo";
-          case A:
-            a = t._payload, t = t._init;
+          case F:
+            var o = t.render;
+            return t = t.displayName, t || (t = o.displayName || o.name || "", t = t !== "" ? "ForwardRef(" + t + ")" : "ForwardRef"), t;
+          case w:
+            return o = t.displayName || null, o !== null ? o : r(t.type) || "Memo";
+          case S:
+            o = t._payload, t = t._init;
             try {
-              return r(t(a));
+              return r(t(o));
             } catch {
             }
         }
       return null;
     }
-    function u(t) {
+    function i(t) {
       return "" + t;
     }
-    function s(t) {
+    function n(t) {
       try {
-        u(t);
-        var a = !1;
+        i(t);
+        var o = !1;
       } catch {
-        a = !0;
+        o = !0;
       }
-      if (a) {
-        a = console;
-        var f = a.error, p = typeof Symbol == "function" && Symbol.toStringTag && t[Symbol.toStringTag] || t.constructor.name || "Object";
-        return f.call(
-          a,
+      if (o) {
+        o = console;
+        var p = o.error, f = typeof Symbol == "function" && Symbol.toStringTag && t[Symbol.toStringTag] || t.constructor.name || "Object";
+        return p.call(
+          o,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          p
-        ), u(t);
+          f
+        ), i(t);
       }
     }
-    function o(t) {
-      if (t === T) return "<>";
-      if (typeof t == "object" && t !== null && t.$$typeof === A)
+    function s(t) {
+      if (t === R) return "<>";
+      if (typeof t == "object" && t !== null && t.$$typeof === S)
         return "<...>";
       try {
-        var a = r(t);
-        return a ? "<" + a + ">" : "<...>";
+        var o = r(t);
+        return o ? "<" + o + ">" : "<...>";
       } catch {
         return "<...>";
       }
     }
     function l() {
-      var t = y.A;
+      var t = N.A;
       return t === null ? null : t.getOwner();
     }
-    function c() {
+    function d() {
       return Error("react-stack-top-frame");
     }
-    function x(t) {
-      if (k.call(t, "key")) {
-        var a = Object.getOwnPropertyDescriptor(t, "key").get;
-        if (a && a.isReactWarning) return !1;
+    function m(t) {
+      if (E.call(t, "key")) {
+        var o = Object.getOwnPropertyDescriptor(t, "key").get;
+        if (o && o.isReactWarning) return !1;
       }
       return t.key !== void 0;
     }
-    function i(t, a) {
-      function f() {
-        I || (I = !0, console.error(
+    function c(t, o) {
+      function p() {
+        O || (O = !0, console.error(
           "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
-          a
+          o
         ));
       }
-      f.isReactWarning = !0, Object.defineProperty(t, "key", {
-        get: f,
+      p.isReactWarning = !0, Object.defineProperty(t, "key", {
+        get: p,
         configurable: !0
       });
     }
-    function h() {
+    function u() {
       var t = r(this.type);
-      return M[t] || (M[t] = !0, console.error(
+      return L[t] || (L[t] = !0, console.error(
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), t = this.props.ref, t !== void 0 ? t : null;
     }
-    function n(t, a, f, p, F, Q) {
-      var g = f.ref;
+    function x(t, o, p, f, B, Q) {
+      var g = p.ref;
       return t = {
-        $$typeof: S,
+        $$typeof: _,
         type: t,
-        key: a,
-        props: f,
-        _owner: p
+        key: o,
+        props: p,
+        _owner: f
       }, (g !== void 0 ? g : null) !== null ? Object.defineProperty(t, "ref", {
         enumerable: !1,
-        get: h
+        get: u
       }) : Object.defineProperty(t, "ref", { enumerable: !1, value: null }), t._store = {}, Object.defineProperty(t._store, "validated", {
         configurable: !1,
         enumerable: !1,
@@ -175,7 +175,7 @@ function ue() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: F
+        value: B
       }), Object.defineProperty(t, "_debugTask", {
         configurable: !1,
         enumerable: !1,
@@ -183,111 +183,111 @@ function ue() {
         value: Q
       }), Object.freeze && (Object.freeze(t.props), Object.freeze(t)), t;
     }
-    function d(t, a, f, p, F, Q) {
-      var g = a.children;
+    function h(t, o, p, f, B, Q) {
+      var g = o.children;
       if (g !== void 0)
-        if (p)
-          if (O(g)) {
-            for (p = 0; p < g.length; p++)
-              m(g[p]);
+        if (f)
+          if (M(g)) {
+            for (f = 0; f < g.length; f++)
+              a(g[f]);
             Object.freeze && Object.freeze(g);
           } else
             console.error(
               "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
             );
-        else m(g);
-      if (k.call(a, "key")) {
+        else a(g);
+      if (E.call(o, "key")) {
         g = r(t);
-        var P = Object.keys(a).filter(function(ie) {
-          return ie !== "key";
+        var P = Object.keys(o).filter(function(ce) {
+          return ce !== "key";
         });
-        p = 0 < P.length ? "{key: someKey, " + P.join(": ..., ") + ": ...}" : "{key: someKey}", re[g + p] || (P = 0 < P.length ? "{" + P.join(": ..., ") + ": ...}" : "{}", console.error(
+        f = 0 < P.length ? "{key: someKey, " + P.join(": ..., ") + ": ...}" : "{key: someKey}", re[g + f] || (P = 0 < P.length ? "{" + P.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
-          p,
+          f,
           g,
           P,
           g
-        ), re[g + p] = !0);
+        ), re[g + f] = !0);
       }
-      if (g = null, f !== void 0 && (s(f), g = "" + f), x(a) && (s(a.key), g = "" + a.key), "key" in a) {
-        f = {};
-        for (var Z in a)
-          Z !== "key" && (f[Z] = a[Z]);
-      } else f = a;
-      return g && i(
-        f,
+      if (g = null, p !== void 0 && (n(p), g = "" + p), m(o) && (n(o.key), g = "" + o.key), "key" in o) {
+        p = {};
+        for (var K in o)
+          K !== "key" && (p[K] = o[K]);
+      } else p = o;
+      return g && c(
+        p,
         typeof t == "function" ? t.displayName || t.name || "Unknown" : t
-      ), n(
+      ), x(
         t,
         g,
-        f,
+        p,
         l(),
-        F,
+        B,
         Q
       );
     }
-    function m(t) {
-      j(t) ? t._store && (t._store.validated = 1) : typeof t == "object" && t !== null && t.$$typeof === A && (t._payload.status === "fulfilled" ? j(t._payload.value) && t._payload.value._store && (t._payload.value._store.validated = 1) : t._store && (t._store.validated = 1));
+    function a(t) {
+      b(t) ? t._store && (t._store.validated = 1) : typeof t == "object" && t !== null && t.$$typeof === S && (t._payload.status === "fulfilled" ? b(t._payload.value) && t._payload.value._store && (t._payload.value._store.validated = 1) : t._store && (t._store.validated = 1));
     }
-    function j(t) {
-      return typeof t == "object" && t !== null && t.$$typeof === S;
+    function b(t) {
+      return typeof t == "object" && t !== null && t.$$typeof === _;
     }
-    var b = ce, S = Symbol.for("react.transitional.element"), _ = Symbol.for("react.portal"), T = Symbol.for("react.fragment"), C = Symbol.for("react.strict_mode"), X = Symbol.for("react.profiler"), z = Symbol.for("react.consumer"), B = Symbol.for("react.context"), U = Symbol.for("react.forward_ref"), V = Symbol.for("react.suspense"), J = Symbol.for("react.suspense_list"), v = Symbol.for("react.memo"), A = Symbol.for("react.lazy"), G = Symbol.for("react.activity"), N = Symbol.for("react.client.reference"), y = b.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, k = Object.prototype.hasOwnProperty, O = Array.isArray, D = console.createTask ? console.createTask : function() {
+    var j = de, _ = Symbol.for("react.transitional.element"), v = Symbol.for("react.portal"), R = Symbol.for("react.fragment"), A = Symbol.for("react.strict_mode"), q = Symbol.for("react.profiler"), V = Symbol.for("react.consumer"), X = Symbol.for("react.context"), F = Symbol.for("react.forward_ref"), z = Symbol.for("react.suspense"), G = Symbol.for("react.suspense_list"), w = Symbol.for("react.memo"), S = Symbol.for("react.lazy"), J = Symbol.for("react.activity"), T = Symbol.for("react.client.reference"), N = j.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, E = Object.prototype.hasOwnProperty, M = Array.isArray, W = console.createTask ? console.createTask : function() {
       return null;
     };
-    b = {
+    j = {
       react_stack_bottom_frame: function(t) {
         return t();
       }
     };
-    var I, M = {}, ee = b.react_stack_bottom_frame.bind(
-      b,
-      c
-    )(), te = D(o(c)), re = {};
-    Y.Fragment = T, Y.jsx = function(t, a, f) {
-      var p = 1e4 > y.recentlyCreatedOwnerStacks++;
-      return d(
+    var O, L = {}, ee = j.react_stack_bottom_frame.bind(
+      j,
+      d
+    )(), te = W(s(d)), re = {};
+    U.Fragment = R, U.jsx = function(t, o, p) {
+      var f = 1e4 > N.recentlyCreatedOwnerStacks++;
+      return h(
         t,
-        a,
-        f,
+        o,
+        p,
         !1,
-        p ? Error("react-stack-top-frame") : ee,
-        p ? D(o(t)) : te
+        f ? Error("react-stack-top-frame") : ee,
+        f ? W(s(t)) : te
       );
-    }, Y.jsxs = function(t, a, f) {
-      var p = 1e4 > y.recentlyCreatedOwnerStacks++;
-      return d(
+    }, U.jsxs = function(t, o, p) {
+      var f = 1e4 > N.recentlyCreatedOwnerStacks++;
+      return h(
         t,
-        a,
-        f,
+        o,
+        p,
         !0,
-        p ? Error("react-stack-top-frame") : ee,
-        p ? D(o(t)) : te
+        f ? Error("react-stack-top-frame") : ee,
+        f ? W(s(t)) : te
       );
     };
-  })()), Y;
+  })()), U;
 }
 var oe;
-function he() {
-  return oe || (oe = 1, process.env.NODE_ENV === "production" ? H.exports = de() : H.exports = ue()), H.exports;
+function me() {
+  return oe || (oe = 1, process.env.NODE_ENV === "production" ? H.exports = ue() : H.exports = he()), H.exports;
 }
-var e = he(), E = /* @__PURE__ */ ((r) => (r.TEXT = "text", r.PRODUCT_LIST = "product_list", r.LOADING = "loading", r))(E || {}), w = /* @__PURE__ */ ((r) => (r.USER = "user", r.AI = "ai", r))(w || {});
-const me = ({
+var e = me(), C = /* @__PURE__ */ ((r) => (r.TEXT = "text", r.PRODUCT_LIST = "product_list", r.LOADING = "loading", r))(C || {}), y = /* @__PURE__ */ ((r) => (r.USER = "user", r.AI = "ai", r))(y || {});
+const xe = ({
   title: r,
-  primaryColor: u,
-  onClose: s,
-  onReset: o,
+  primaryColor: i,
+  onClose: n,
+  onReset: s,
   onToggleExpand: l,
-  isExpanded: c,
-  language: x,
-  onLanguageChange: i
+  isExpanded: d,
+  language: m,
+  onLanguageChange: c
 }) => {
-  const h = [
+  const u = [
     { value: "en", label: "EN" },
     { value: "vi", label: "VI" },
     { value: "ja", label: "JA" }
@@ -302,7 +302,7 @@ const me = ({
             "img",
             {
               src: "https://fptshop.com.vn/img/bitu/bitu-avatar.png",
-              onError: (n) => n.currentTarget.src = "https://cdn-icons-png.flaticon.com/512/4712/4712035.png",
+              onError: (x) => x.currentTarget.src = "https://cdn-icons-png.flaticon.com/512/4712/4712035.png",
               className: "w-full h-full object-contain",
               alt: "Bot Icon"
             }
@@ -324,11 +324,11 @@ const me = ({
             /* @__PURE__ */ e.jsx(
               "select",
               {
-                value: x,
-                onChange: (n) => i(n.target.value),
+                value: m,
+                onChange: (x) => c(x.target.value),
                 className: "appearance-none bg-white/50 border border-gray-200 rounded-lg px-2 pr-5 py-1 text-[10px] font-black text-indigo-600 cursor-pointer hover:bg-white transition-all focus:outline-none focus:ring-2 focus:ring-indigo-100 uppercase",
                 title: "Select language",
-                children: h.map((n) => /* @__PURE__ */ e.jsx("option", { value: n.value, className: "font-sans font-bold", children: n.label }, n.value))
+                children: u.map((x) => /* @__PURE__ */ e.jsx("option", { value: x.value, className: "font-sans font-bold", children: x.label }, x.value))
               }
             ),
             /* @__PURE__ */ e.jsx("div", { className: "absolute right-1.5 top-1/2 -translate-y-1/2 pointer-events-none text-indigo-400", children: /* @__PURE__ */ e.jsx("svg", { width: "8", height: "8", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "4", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ e.jsx("path", { d: "m6 9 6 6 6-6" }) }) })
@@ -336,7 +336,7 @@ const me = ({
           /* @__PURE__ */ e.jsx(
             "button",
             {
-              onClick: o,
+              onClick: s,
               className: "w-8 h-8 flex items-center justify-center rounded-lg hover:bg-white/60 text-gray-500 hover:text-indigo-600 transition-all",
               title: "Reset chat",
               children: /* @__PURE__ */ e.jsxs("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
@@ -352,8 +352,8 @@ const me = ({
             {
               onClick: l,
               className: "w-8 h-8 hidden md:flex items-center justify-center rounded-lg hover:bg-white/60 text-gray-500 hover:text-indigo-600 transition-all",
-              title: c ? "Collapse" : "Expand",
-              children: c ? /* @__PURE__ */ e.jsxs("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+              title: d ? "Collapse" : "Expand",
+              children: d ? /* @__PURE__ */ e.jsxs("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
                 /* @__PURE__ */ e.jsx("path", { d: "M4 14h6v6" }),
                 /* @__PURE__ */ e.jsx("path", { d: "M20 10h-6V4" }),
                 /* @__PURE__ */ e.jsx("path", { d: "M14 10l7-7" }),
@@ -369,7 +369,7 @@ const me = ({
           /* @__PURE__ */ e.jsx(
             "button",
             {
-              onClick: s,
+              onClick: n,
               className: "w-8 h-8 flex items-center justify-center rounded-lg hover:bg-red-50 text-gray-500 hover:text-red-500 transition-all",
               title: "Close",
               children: /* @__PURE__ */ e.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
@@ -382,7 +382,7 @@ const me = ({
       ]
     }
   );
-}, xe = ({ product: r, primaryColor: u }) => /* @__PURE__ */ e.jsxs("div", { className: "min-w-[170px] max-w-[170px] bg-white rounded-xl border border-gray-50 shadow-sm overflow-hidden flex flex-col hover:shadow-lg transition-all duration-300 group", children: [
+}, pe = ({ product: r, primaryColor: i }) => /* @__PURE__ */ e.jsxs("div", { className: "min-w-[170px] max-w-[170px] bg-white rounded-xl border border-gray-50 shadow-sm overflow-hidden flex flex-col hover:shadow-lg transition-all duration-300 group", children: [
   /* @__PURE__ */ e.jsxs("div", { className: "relative h-32 w-full bg-white flex items-center justify-center p-2", children: [
     /* @__PURE__ */ e.jsx(
       "img",
@@ -406,105 +406,140 @@ const me = ({
       "button",
       {
         className: "w-full py-1.5 rounded-lg text-[11px] font-bold border transition-all duration-300 active:scale-95 shadow-sm",
-        style: { borderColor: u, color: u },
-        onMouseEnter: (s) => {
-          s.currentTarget.style.backgroundColor = u, s.currentTarget.style.color = "white";
+        style: { borderColor: i, color: i },
+        onMouseEnter: (n) => {
+          n.currentTarget.style.backgroundColor = i, n.currentTarget.style.color = "white";
         },
-        onMouseLeave: (s) => {
-          s.currentTarget.style.backgroundColor = "transparent", s.currentTarget.style.color = u;
+        onMouseLeave: (n) => {
+          n.currentTarget.style.backgroundColor = "transparent", n.currentTarget.style.color = i;
         },
         children: "Chọn mua"
       }
     )
   ] })
-] }), $ = (r) => {
-  const u = /(\*\*.*?\*\*|\[.*?\]\(.*?\))/g;
-  return r.split(u).map((o, l) => {
-    if (o.startsWith("**") && o.endsWith("**")) {
-      const x = o.slice(2, -2);
-      return /* @__PURE__ */ e.jsx("strong", { className: "font-bold text-gray-900", children: x }, l);
+] }), fe = ({ text: r }) => {
+  const [i, n] = k(!1), s = async () => {
+    try {
+      await navigator.clipboard.writeText(r), n(!0), setTimeout(() => n(!1), 2e3);
+    } catch (l) {
+      console.error("Failed to copy text: ", l);
+    }
+  };
+  return /* @__PURE__ */ e.jsx(
+    "button",
+    {
+      onClick: s,
+      className: "p-1.5 rounded-md hover:bg-slate-100 text-slate-400 hover:text-indigo-600 transition-all active:scale-90 flex items-center gap-1 group/copy",
+      title: "Copy message",
+      children: i ? /* @__PURE__ */ e.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", className: "text-green-500", children: /* @__PURE__ */ e.jsx("path", { d: "M20 6 9 17l-5-5" }) }) : /* @__PURE__ */ e.jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+        /* @__PURE__ */ e.jsx("rect", { width: "8", height: "4", x: "8", y: "2", rx: "1", ry: "1" }),
+        /* @__PURE__ */ e.jsx("path", { d: "M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2" })
+      ] })
+    }
+  );
+}, ge = ({ text: r, speed: i = 8, onComplete: n }) => {
+  const [s, l] = k(""), [d, m] = k(0);
+  return I(() => {
+    r.length < s.length && (l(""), m(0));
+  }, [r]), I(() => {
+    if (d < r.length) {
+      const c = setTimeout(() => {
+        l((u) => u + r.charAt(d)), m((u) => u + 1);
+      }, i);
+      return () => clearTimeout(c);
+    } else n && r.length > 0 && n();
+  }, [d, r, i, n]), /* @__PURE__ */ e.jsx("span", { children: s });
+}, $ = (r) => {
+  const i = /(\*\*.*?\*\*|\[.*?\]\(.*?\))/g;
+  return r.split(i).map((s, l) => {
+    if (s.startsWith("**") && s.endsWith("**")) {
+      const m = s.slice(2, -2);
+      return /* @__PURE__ */ e.jsx("strong", { className: "font-bold text-gray-900", children: m }, l);
     }
-    const c = o.match(/\[(.*?)\]\((.*?)\)/);
-    if (c) {
-      const [x, i, h] = c;
+    const d = s.match(/\[(.*?)\]\((.*?)\)/);
+    if (d) {
+      const [m, c, u] = d;
       return /* @__PURE__ */ e.jsx(
         "a",
         {
-          href: h,
+          href: u,
           target: "_blank",
           rel: "noopener noreferrer",
           className: "text-blue-600 hover:underline break-all font-semibold",
-          children: i
+          children: c
         },
         l
       );
     }
-    return o;
+    return s;
   });
-}, fe = ({ text: r }) => {
-  const u = r.replace(/\r/g, "").split(`
-`), s = [];
-  let o = [], l = !1;
-  const c = (x) => {
-    if (o.length > 0) {
-      const h = o.length > 1 && o[1].every((n) => n.trim().match(/^:?-+:?$/)) ? [o[0], ...o.slice(2)] : o;
-      h.length > 0 && s.push(
-        /* @__PURE__ */ e.jsx("div", { className: "my-4 overflow-x-auto border border-slate-200 rounded-xl shadow-sm bg-white", children: /* @__PURE__ */ e.jsxs("table", { className: "min-w-full border-collapse text-[13px] leading-normal", children: [
-          /* @__PURE__ */ e.jsx("thead", { className: "bg-slate-50 border-b border-slate-200", children: /* @__PURE__ */ e.jsx("tr", { children: h[0].map((n, d) => /* @__PURE__ */ e.jsx("th", { className: "px-4 py-3 text-left font-bold text-slate-700 border-r last:border-r-0 border-slate-200 whitespace-nowrap", children: $(n.trim()) }, d)) }) }),
-          /* @__PURE__ */ e.jsx("tbody", { className: "divide-y divide-slate-100", children: h.slice(1).map((n, d) => /* @__PURE__ */ e.jsx("tr", { className: "hover:bg-slate-50/50 transition-colors", children: n.map((m, j) => /* @__PURE__ */ e.jsx("td", { className: "px-4 py-3 text-slate-600 border-r last:border-r-0 border-slate-200 align-top", children: $(m.trim()) }, j)) }, d)) })
-        ] }) }, `table-wrapper-${x}`)
-      ), o = [], l = !1;
+}, be = ({ text: r }) => {
+  const i = r.replace(/\r/g, "").split(`
+`), n = [];
+  let s = [], l = !1;
+  const d = (m) => {
+    if (s.length > 0) {
+      const u = s.length > 1 && s[1].every((x) => x.trim().match(/^:?-+:?$/)) ? [s[0], ...s.slice(2)] : s;
+      u.length > 0 && n.push(
+        /* @__PURE__ */ e.jsxs("div", { className: "my-4 relative group/table", children: [
+          /* @__PURE__ */ e.jsx("div", { className: "overflow-x-auto border border-slate-200 rounded-xl shadow-sm bg-white chat-scrollbar custom-table-scroll", children: /* @__PURE__ */ e.jsxs("table", { className: "min-w-full border-collapse text-[13px] leading-normal", children: [
+            /* @__PURE__ */ e.jsx("thead", { className: "bg-slate-50 border-b border-slate-200", children: /* @__PURE__ */ e.jsx("tr", { children: u[0].map((x, h) => /* @__PURE__ */ e.jsx("th", { className: "px-4 py-3 text-left font-bold text-slate-700 border-r last:border-r-0 border-slate-200 whitespace-nowrap", children: $(x.trim()) }, h)) }) }),
+            /* @__PURE__ */ e.jsx("tbody", { className: "divide-y divide-slate-100", children: u.slice(1).map((x, h) => /* @__PURE__ */ e.jsx("tr", { className: "hover:bg-slate-50/50 transition-colors", children: x.map((a, b) => /* @__PURE__ */ e.jsx("td", { className: "px-4 py-3 text-slate-600 border-r last:border-r-0 border-slate-200 align-top", children: $(a.trim()) }, b)) }, h)) })
+          ] }) }),
+          /* @__PURE__ */ e.jsx("div", { className: "absolute right-0 top-0 bottom-0 w-8 bg-gradient-to-l from-white/80 to-transparent pointer-events-none md:hidden opacity-0 group-hover/table:opacity-100 transition-opacity" })
+        ] }, `table-wrapper-${m}`)
+      ), s = [], l = !1;
     }
   };
-  return u.forEach((x, i) => {
-    const h = x.trim();
-    if (h.includes("|") && (h.startsWith("|") || h.split("|").length > 1)) {
-      let m = h.split("|");
-      h.startsWith("|") && m.shift(), h.endsWith("|") && m.pop(), o.push(m), l = !0;
+  return i.forEach((m, c) => {
+    const u = m.trim();
+    if (u.includes("|") && (u.startsWith("|") || u.split("|").length > 1)) {
+      let a = u.split("|");
+      u.startsWith("|") && a.shift(), u.endsWith("|") && a.pop(), s.push(a), l = !0;
       return;
-    } else l && c(i);
-    const n = h.match(/^(#{1,4})\s+(.*)$/);
-    if (n) {
-      const m = n[1].length, j = n[2], b = m === 1 ? "text-xl font-bold mb-4 mt-6 first:mt-1" : m === 2 ? "text-lg font-bold mb-3 mt-5" : "text-[13px] font-black mb-2 mt-5 text-indigo-600 uppercase tracking-widest";
-      s.push(/* @__PURE__ */ e.jsx("div", { className: b, children: $(j) }, i));
+    } else l && d(c);
+    const x = u.match(/^(#{1,4})\s+(.*)$/);
+    if (x) {
+      const a = x[1].length, b = x[2], j = a === 1 ? "text-xl font-bold mb-4 mt-6 first:mt-1" : a === 2 ? "text-lg font-bold mb-3 mt-5" : "text-[13px] font-black mb-2 mt-5 text-indigo-600 uppercase tracking-widest";
+      n.push(/* @__PURE__ */ e.jsx("div", { className: j, children: $(b) }, c));
       return;
     }
-    const d = h.match(/^[*+-]\s+(.*)$/);
-    if (d) {
-      const m = d[1];
-      s.push(
+    const h = u.match(/^[*+-]\s+(.*)$/);
+    if (h) {
+      const a = h[1];
+      n.push(
         /* @__PURE__ */ e.jsxs("div", { className: "flex gap-3 pl-1 mb-2 items-start group", children: [
           /* @__PURE__ */ e.jsx("span", { className: "text-indigo-400 flex-shrink-0 mt-2 w-1.5 h-1.5 bg-indigo-400 rounded-full group-hover:scale-125 transition-transform" }),
-          /* @__PURE__ */ e.jsx("div", { className: "flex-1 leading-relaxed text-slate-700", children: $(m) })
-        ] }, i)
+          /* @__PURE__ */ e.jsx("div", { className: "flex-1 leading-relaxed text-slate-700", children: $(a) })
+        ] }, c)
       );
       return;
     }
-    if (h === "") {
-      s.push(/* @__PURE__ */ e.jsx("div", { className: "h-3" }, i));
+    if (u === "") {
+      n.push(/* @__PURE__ */ e.jsx("div", { className: "h-3" }, c));
       return;
     }
-    s.push(
-      /* @__PURE__ */ e.jsx("div", { className: "mb-1.5 leading-relaxed text-slate-700", children: $(x) }, i)
+    n.push(
+      /* @__PURE__ */ e.jsx("div", { className: "mb-1.5 leading-relaxed text-slate-700", children: $(m) }, c)
     );
-  }), l && c(u.length), /* @__PURE__ */ e.jsx("div", { className: "markdown-render w-full", children: s });
-}, pe = ({
+  }), l && d(i.length), /* @__PURE__ */ e.jsx("div", { className: "markdown-render w-full", children: n });
+}, ve = ({
   messages: r,
-  isLoading: u,
-  description: s,
-  quickReplies: o,
+  isLoading: i,
+  description: n,
+  quickReplies: s,
   onQuickReply: l,
-  primaryColor: c,
-  renderMarkdown: x = !1
+  primaryColor: d,
+  renderMarkdown: m = !1
 }) => {
-  const i = "https://fptshop.com.vn/img/bitu/bitu-avatar.png", h = "https://cdn-icons-png.flaticon.com/512/4712/4712035.png";
+  const c = "https://fptshop.com.vn/img/bitu/bitu-avatar.png", u = "https://cdn-icons-png.flaticon.com/512/4712/4712035.png", [x, h] = k(/* @__PURE__ */ new Set(["welcome"]));
   return /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-8 pb-4", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col items-center justify-center pt-4 text-center animate-msg", children: [
       /* @__PURE__ */ e.jsx("div", { className: "relative mb-5", children: /* @__PURE__ */ e.jsx("div", { className: "w-20 h-20 flex items-center justify-center", children: /* @__PURE__ */ e.jsx(
         "img",
         {
-          src: i,
-          onError: (n) => n.currentTarget.src = h,
+          src: c,
+          onError: (a) => a.currentTarget.src = u,
           className: "w-full h-full object-contain",
           alt: "Sigma AI Hero"
         }
@@ -513,55 +548,67 @@ const me = ({
         "Sigma ",
         /* @__PURE__ */ e.jsx("span", { className: "bg-indigo-600 text-white text-[10px] px-1.5 py-0.5 rounded-md leading-none ml-1 uppercase font-bold tracking-tight", children: "AI" })
       ] }),
-      /* @__PURE__ */ e.jsx("div", { className: "text-[14px] text-gray-600 mt-3 leading-relaxed px-4 max-w-[280px]", children: s && /* @__PURE__ */ e.jsx("div", { className: "bot-description", children: $(s) }) })
+      /* @__PURE__ */ e.jsx("div", { className: "text-[14px] text-gray-600 mt-3 leading-relaxed px-4 max-w-[320px]", children: n && /* @__PURE__ */ e.jsx("div", { className: "bot-description", children: $(n) }) })
     ] }),
-    r.map((n, d) => /* @__PURE__ */ e.jsxs(
-      "div",
-      {
-        className: `flex flex-col animate-msg ${n.sender === w.USER ? "items-end" : "items-start"}`,
-        style: { animationDelay: `${d * 0.05}s` },
-        children: [
-          n.sender === w.AI && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1.5 mb-2 ml-1", children: [
-            /* @__PURE__ */ e.jsx(
-              "img",
-              {
-                src: i,
-                onError: (m) => m.currentTarget.src = h,
-                className: "w-4 h-4 object-contain",
-                alt: "AI"
-              }
-            ),
-            /* @__PURE__ */ e.jsx("span", { className: "text-[11px] font-bold text-gray-400 uppercase tracking-widest", children: "AI Agent" })
-          ] }),
-          /* @__PURE__ */ e.jsxs("div", { className: `flex flex-col ${n.sender === w.USER ? "items-end" : "items-start"} w-full max-w-[96%]`, children: [
-            /* @__PURE__ */ e.jsx(
-              "div",
-              {
-                className: `px-4 py-3 rounded-[20px] shadow-sm border border-black/[0.02] overflow-hidden ${n.sender === w.USER ? "bg-indigo-600 text-white rounded-tr-none whitespace-pre-line shadow-indigo-100/50" : "bg-white text-slate-800 border-none rounded-tl-none"} ${!x || n.sender === w.USER ? "whitespace-pre-line" : ""}`,
-                children: x && n.sender === w.AI ? /* @__PURE__ */ e.jsx(fe, { text: n.content }) : n.content
-              }
-            ),
-            n.type === E.PRODUCT_LIST && n.products && /* @__PURE__ */ e.jsx("div", { className: "w-full mt-4 flex gap-4 overflow-x-auto pb-4 pt-1 no-scrollbar snap-x", children: n.products.map((m) => /* @__PURE__ */ e.jsx("div", { className: "product-card-snap", children: /* @__PURE__ */ e.jsx(xe, { product: m, primaryColor: c }) }, m.id)) }),
-            d === 0 && r.length === 1 && n.sender === w.AI && /* @__PURE__ */ e.jsx("div", { className: "mt-5 flex flex-wrap gap-2.5 w-full", children: o.map((m, j) => /* @__PURE__ */ e.jsx(
-              "button",
-              {
-                onClick: () => l(m),
-                className: "px-4 py-2 rounded-full text-[13px] font-semibold border border-transparent bg-white text-gray-600 hover:text-indigo-600 hover:border-indigo-100 transition-all duration-200 shadow-sm active:scale-95",
-                children: m
-              },
-              j
-            )) })
-          ] })
-        ]
-      },
-      n.id
-    )),
-    u && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5 items-start animate-msg", children: [
+    r.map((a, b) => {
+      const _ = a.sender === y.AI && b === r.length - 1 && !i && !x.has(a.id);
+      return /* @__PURE__ */ e.jsxs(
+        "div",
+        {
+          className: `flex flex-col animate-msg group ${a.sender === y.USER ? "items-end" : "items-start"}`,
+          style: { animationDelay: `${b * 0.05}s` },
+          children: [
+            a.sender === y.AI && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between w-full max-w-[96%] mb-2 ml-1", children: [
+              /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1.5", children: [
+                /* @__PURE__ */ e.jsx(
+                  "img",
+                  {
+                    src: c,
+                    onError: (v) => v.currentTarget.src = u,
+                    className: "w-4 h-4 object-contain",
+                    alt: "AI"
+                  }
+                ),
+                /* @__PURE__ */ e.jsx("span", { className: "text-[11px] font-bold text-gray-400 uppercase tracking-widest", children: "AI Agent" })
+              ] }),
+              /* @__PURE__ */ e.jsx("div", { className: "opacity-0 group-hover:opacity-100 transition-opacity duration-200", children: /* @__PURE__ */ e.jsx(fe, { text: a.content }) })
+            ] }),
+            /* @__PURE__ */ e.jsxs("div", { className: `flex flex-col ${a.sender === y.USER ? "items-end" : "items-start"} w-full max-w-[96%]`, children: [
+              /* @__PURE__ */ e.jsx(
+                "div",
+                {
+                  className: `px-4 py-3 rounded-[20px] shadow-sm border border-black/[0.02] overflow-hidden transition-all duration-300 ${a.sender === y.USER ? "bg-indigo-600 text-white rounded-tr-none whitespace-pre-line shadow-indigo-100/50" : "bg-white text-slate-800 border-none rounded-tl-none hover:shadow-md"} ${(!m || a.sender === y.USER) && !_ ? "whitespace-pre-line" : ""}`,
+                  children: _ ? /* @__PURE__ */ e.jsx(
+                    ge,
+                    {
+                      text: a.content,
+                      onComplete: () => h((v) => new Set(v).add(a.id))
+                    }
+                  ) : m && a.sender === y.AI ? /* @__PURE__ */ e.jsx(be, { text: a.content }) : a.content
+                }
+              ),
+              a.type === C.PRODUCT_LIST && a.products && /* @__PURE__ */ e.jsx("div", { className: "w-full mt-4 flex gap-4 overflow-x-auto pb-4 pt-1 no-scrollbar snap-x", children: a.products.map((v) => /* @__PURE__ */ e.jsx("div", { className: "product-card-snap", children: /* @__PURE__ */ e.jsx(pe, { product: v, primaryColor: d }) }, v.id)) }),
+              b === 0 && r.length === 1 && a.sender === y.AI && /* @__PURE__ */ e.jsx("div", { className: "mt-5 flex flex-wrap gap-2.5 w-full", children: s.map((v, R) => /* @__PURE__ */ e.jsx(
+                "button",
+                {
+                  onClick: () => l(v),
+                  className: "px-4 py-2 rounded-full text-[13px] font-semibold border border-transparent bg-white text-gray-600 hover:text-indigo-600 hover:border-indigo-100 transition-all duration-200 shadow-sm active:scale-95",
+                  children: v
+                },
+                R
+              )) })
+            ] })
+          ]
+        },
+        a.id
+      );
+    }),
+    i && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5 items-start animate-msg", children: [
       /* @__PURE__ */ e.jsx("div", { className: "flex items-center gap-1.5 ml-1", children: /* @__PURE__ */ e.jsx(
         "img",
         {
-          src: i,
-          onError: (n) => n.currentTarget.src = h,
+          src: c,
+          onError: (a) => a.currentTarget.src = u,
           className: "w-4 h-4 object-contain",
           alt: "AI Loading"
         }
@@ -573,19 +620,19 @@ const me = ({
       ] })
     ] })
   ] });
-}, ge = ({ placeholder: r, onSendMessage: u, primaryColor: s }) => {
-  const [o, l] = R(""), c = () => {
-    o.trim() && (u(o), l(""));
-  }, x = (i) => {
-    i.key === "Enter" && !i.shiftKey && (i.preventDefault(), c());
+}, je = ({ placeholder: r, onSendMessage: i, primaryColor: n }) => {
+  const [s, l] = k(""), d = () => {
+    s.trim() && (i(s), l(""));
+  }, m = (c) => {
+    c.key === "Enter" && !c.shiftKey && (c.preventDefault(), d());
   };
   return /* @__PURE__ */ e.jsx("div", { className: "p-1", children: /* @__PURE__ */ e.jsxs("div", { className: "relative flex items-center bg-gray-50/50 rounded-2xl border border-gray-100 focus-within:border-indigo-100 focus-within:bg-white transition-all duration-200 pr-2 pl-3 py-1", children: [
     /* @__PURE__ */ e.jsx(
       "textarea",
       {
-        value: o,
-        onChange: (i) => l(i.target.value),
-        onKeyDown: x,
+        value: s,
+        onChange: (c) => l(c.target.value),
+        onKeyDown: m,
         placeholder: r,
         rows: 1,
         className: "w-full bg-transparent border-none outline-none focus:ring-0 text-[14px] text-gray-700 font-normal py-3 px-1 resize-none chat-scrollbar min-h-[44px] max-h-[120px] leading-relaxed placeholder:text-gray-400",
@@ -595,9 +642,9 @@ const me = ({
     /* @__PURE__ */ e.jsx(
       "button",
       {
-        onClick: c,
-        disabled: !o.trim(),
-        className: `w-9 h-9 rounded-xl flex-shrink-0 flex items-center justify-center transition-all duration-300 shadow-sm ${o.trim() ? "bg-indigo-600 text-white hover:bg-indigo-700 active:scale-95" : "bg-gray-200 text-gray-400 cursor-not-allowed"}`,
+        onClick: d,
+        disabled: !s.trim(),
+        className: `w-9 h-9 rounded-xl flex-shrink-0 flex items-center justify-center transition-all duration-300 shadow-sm ${s.trim() ? "bg-indigo-600 text-white hover:bg-indigo-700 active:scale-95" : "bg-gray-200 text-gray-400 cursor-not-allowed"}`,
         children: /* @__PURE__ */ e.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", children: [
           /* @__PURE__ */ e.jsx("path", { d: "m5 12 7-7 7 7" }),
           /* @__PURE__ */ e.jsx("path", { d: "M12 19V5" })
@@ -605,10 +652,10 @@ const me = ({
       }
     )
   ] }) });
-}, be = ({ isOpen: r, onClick: u, primaryColor: s, className: o = "" }) => /* @__PURE__ */ e.jsx("div", { className: `fixed bottom-4 right-4 md:bottom-6 md:right-6 z-[100] ${o}`, children: /* @__PURE__ */ e.jsx(
+}, we = ({ isOpen: r, onClick: i, primaryColor: n, className: s = "" }) => /* @__PURE__ */ e.jsx("div", { className: `fixed bottom-4 right-4 md:bottom-6 md:right-6 z-[100] ${s}`, children: /* @__PURE__ */ e.jsx(
   "button",
   {
-    onClick: u,
+    onClick: i,
     className: `w-12 h-12 bg-white rounded-2xl shadow-lg flex items-center justify-center border transition-all duration-300 overflow-hidden ${r ? "border-indigo-500 ring-4 ring-indigo-50 scale-105 rotate-0" : "border-slate-100 hover:scale-110 hover:shadow-xl"}`,
     children: /* @__PURE__ */ e.jsx(
       "img",
@@ -620,142 +667,144 @@ const me = ({
       }
     )
   }
-) }), le = () => Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15), L = (r, u, s) => typeof r == "object" && r !== null && !Array.isArray(r) ? r[u] || r.en || Object.values(r)[0] || s : r ?? s, je = ({ config: r, onGetAiResponse: u }) => {
-  const [s, o] = R(!1), [l, c] = R(!1), [x, i] = R(!1), [h, n] = R(le()), [d, m] = R("en"), [j, b] = R([]), [S, _] = R(!1), T = ne(null), C = ne(0);
-  q(() => {
-    const v = L(r.welcomeMessage, d, "Hello!");
-    b([{
+) }), le = "sigma-chat-language", ie = () => Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15), D = (r, i, n) => typeof r == "object" && r !== null && !Array.isArray(r) ? r[i] || r.en || Object.values(r)[0] || n : r ?? n, Ne = ({ config: r, onGetAiResponse: i }) => {
+  const [n, s] = k(!1), [l, d] = k(!1), [m, c] = k(!1), [u, x] = k(ie()), [h, a] = k(() => localStorage.getItem(le) || "en"), [b, j] = k([]), [_, v] = k(!1), R = ne(null), A = ne(0);
+  I(() => {
+    localStorage.setItem(le, h);
+  }, [h]), I(() => {
+    const w = D(r.welcomeMessage, h, "Hello!");
+    j([{
       id: "welcome",
-      type: E.TEXT,
-      sender: w.AI,
-      content: v,
+      type: C.TEXT,
+      sender: y.AI,
+      content: w,
       timestamp: /* @__PURE__ */ new Date()
     }]);
   }, []);
-  const X = K(() => L(r.placeholder, d, "Type a message..."), [r.placeholder, d]), z = K(() => L(r.quickReplies, d, []), [r.quickReplies, d]), B = K(() => L(r.description, d, ""), [r.description, d]);
-  q(() => {
-    if (j.length === 1 && j[0].id === "welcome") {
-      const v = L(r.welcomeMessage, d, "Hello!");
-      b([{ ...j[0], content: v }]);
+  const q = Z(() => D(r.placeholder, h, "Type a message..."), [r.placeholder, h]), V = Z(() => D(r.quickReplies, h, []), [r.quickReplies, h]), X = Z(() => D(r.description, h, ""), [r.description, h]);
+  I(() => {
+    if (b.length === 1 && (b[0].id === "welcome" || b[0].sender === y.AI)) {
+      const w = D(r.welcomeMessage, h, "Hello!");
+      j([{ ...b[0], content: w }]);
     }
-  }, [d]), q(() => {
-    if (s) {
-      const v = setTimeout(() => i(!0), 50);
-      return () => clearTimeout(v);
+  }, [h]), I(() => {
+    if (n) {
+      const w = setTimeout(() => c(!0), 50);
+      return () => clearTimeout(w);
     } else
-      i(!1);
-  }, [s]), q(() => {
-    T.current && s && (T.current.scrollTop = T.current.scrollHeight);
-  }, [j, s, S]);
-  const U = async (v) => {
-    if (!v.trim() || S) return;
-    const A = ++C.current, G = {
+      c(!1);
+  }, [n]), I(() => {
+    R.current && n && (R.current.scrollTop = R.current.scrollHeight);
+  }, [b, n, _]);
+  const F = async (w) => {
+    if (!w.trim() || _) return;
+    const S = ++A.current, J = {
       id: `user-${Date.now()}`,
-      type: E.TEXT,
-      sender: w.USER,
-      content: v,
+      type: C.TEXT,
+      sender: y.USER,
+      content: w,
       timestamp: /* @__PURE__ */ new Date()
     };
-    b((N) => [...N, G]), _(!0);
+    j((T) => [...T, J]), v(!0);
     try {
-      const N = u(v, h, d);
-      if (N && typeof N == "object" && Symbol.asyncIterator in N) {
-        let y = "", k = !1;
-        const O = `ai-${Date.now()}`;
-        for await (const D of N) {
-          if (A !== C.current) return;
-          k || (b((I) => [...I, {
-            id: O,
-            type: E.TEXT,
-            sender: w.AI,
+      const T = i(w, u, h);
+      if (T && typeof T == "object" && Symbol.asyncIterator in T) {
+        let N = "", E = !1;
+        const M = `ai-${Date.now()}`;
+        for await (const W of T) {
+          if (S !== A.current) return;
+          E || (j((O) => [...O, {
+            id: M,
+            type: C.TEXT,
+            sender: y.AI,
             content: "",
             timestamp: /* @__PURE__ */ new Date()
-          }]), _(!1), k = !0), y += D, b((I) => I.map(
-            (M) => M.id === O ? { ...M, content: y } : M
+          }]), v(!1), E = !0), N += W, j((O) => O.map(
+            (L) => L.id === M ? { ...L, content: N } : L
           ));
         }
       } else {
-        const y = await N;
-        if (A !== C.current) return;
-        _(!1);
-        const k = typeof y == "string" ? { text: y, products: void 0 } : y;
-        b((O) => [...O, {
+        const N = await T;
+        if (S !== A.current) return;
+        v(!1);
+        const E = typeof N == "string" ? { text: N, products: void 0 } : N;
+        j((M) => [...M, {
           id: `ai-${Date.now()}`,
-          type: k.products ? E.PRODUCT_LIST : E.TEXT,
-          sender: w.AI,
-          content: k.text,
-          products: k.products,
+          type: E.products ? C.PRODUCT_LIST : C.TEXT,
+          sender: y.AI,
+          content: E.text,
+          products: E.products,
           timestamp: /* @__PURE__ */ new Date()
         }]);
       }
-    } catch (N) {
-      if (A !== C.current) return;
-      console.error("Chatbox Error:", N), _(!1);
-      const y = d === "vi" ? "Hệ thống đang bận, vui lòng thử lại sau." : "System is busy, please try again later.";
-      b((k) => [...k, {
+    } catch (T) {
+      if (S !== A.current) return;
+      console.error("Chatbox Error:", T), v(!1);
+      const N = h === "vi" ? "Hệ thống đang bận, vui lòng thử lại sau." : "System is busy, please try again later.";
+      j((E) => [...E, {
         id: `err-${Date.now()}`,
-        type: E.TEXT,
-        sender: w.AI,
-        content: y,
+        type: C.TEXT,
+        sender: y.AI,
+        content: N,
         timestamp: /* @__PURE__ */ new Date()
       }]);
     }
-  }, V = () => {
-    C.current++, n(le());
-    const v = L(r.welcomeMessage, d, "Hello!");
-    b([{
+  }, z = () => {
+    A.current++, x(ie());
+    const w = D(r.welcomeMessage, h, "Hello!");
+    j([{
       id: "welcome",
-      type: E.TEXT,
-      sender: w.AI,
-      content: v,
+      type: C.TEXT,
+      sender: y.AI,
+      content: w,
       timestamp: /* @__PURE__ */ new Date()
-    }]), _(!1), c(!1);
-  }, J = `
+    }]), v(!1);
+  }, G = `
     fixed z-[99] overflow-hidden flex flex-col border border-white/40 shadow-2xl bg-white animate-chat-pop
-    ${x ? "transition-[width,height,border-radius,right,bottom] duration-300 ease-in-out" : ""}
+    ${m ? "transition-[width,height,border-radius,right,bottom] duration-300 ease-in-out" : ""}
     ${l ? "bottom-0 right-0 w-full h-full md:bottom-6 md:right-28 md:w-[850px] md:h-[85vh] rounded-none md:rounded-[32px]" : "bottom-0 right-0 w-full h-[80vh] md:bottom-6 md:right-28 md:w-[420px] md:h-[580px] rounded-t-[28px] md:rounded-[28px]"}
   `;
   return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsx(
-      be,
+      we,
       {
-        isOpen: s,
-        onClick: () => o(!s),
+        isOpen: n,
+        onClick: () => s(!n),
         primaryColor: r.primaryColor,
-        className: s ? "hidden md:flex" : "flex"
+        className: n ? "hidden md:flex" : "flex"
       }
     ),
-    s && /* @__PURE__ */ e.jsxs("div", { className: J, style: { left: "auto" }, children: [
+    n && /* @__PURE__ */ e.jsxs("div", { className: G, style: { left: "auto" }, children: [
       /* @__PURE__ */ e.jsx(
-        me,
+        xe,
         {
           title: r.botName,
           primaryColor: r.primaryColor,
-          onClose: () => o(!1),
-          onReset: V,
-          onToggleExpand: () => c(!l),
+          onClose: () => s(!1),
+          onReset: z,
+          onToggleExpand: () => d(!l),
           isExpanded: l,
-          language: d,
-          onLanguageChange: m
+          language: h,
+          onLanguageChange: a
         }
       ),
-      /* @__PURE__ */ e.jsx("div", { className: "flex-1 overflow-y-auto chat-scrollbar px-5 py-5 bg-slate-50/30", ref: T, children: /* @__PURE__ */ e.jsx(
-        pe,
+      /* @__PURE__ */ e.jsx("div", { className: "flex-1 overflow-y-auto chat-scrollbar px-5 py-5 bg-slate-50/30", ref: R, children: /* @__PURE__ */ e.jsx(
+        ve,
         {
-          messages: j,
-          isLoading: S,
-          description: B,
-          quickReplies: z,
-          onQuickReply: (v) => U(v),
+          messages: b,
+          isLoading: _,
+          description: X,
+          quickReplies: V,
+          onQuickReply: (w) => F(w),
           primaryColor: r.primaryColor,
           renderMarkdown: r.renderMarkdown
         }
       ) }),
       /* @__PURE__ */ e.jsx("div", { className: "bg-white p-3 border-t border-slate-100", children: /* @__PURE__ */ e.jsx(
-        ge,
+        je,
         {
-          placeholder: X,
-          onSendMessage: U,
+          placeholder: q,
+          onSendMessage: F,
           primaryColor: r.primaryColor
         }
       ) })
@@ -763,7 +812,7 @@ const me = ({
   ] });
 };
 export {
-  je as Chatbox,
-  E as MessageType,
-  w as SenderType
+  Ne as Chatbox,
+  C as MessageType,
+  y as SenderType
 };