react-sigma-chatbox 1.0.4 → 1.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -1,5 +1,5 @@
1
- import ce, { useState as E, useRef as ne, useEffect as B, useMemo as K } from "react";
2
- var H = { exports: {} }, W = {};
1
+ import de, { useState as k, useEffect as I, useRef as ne, useMemo as Z } from "react";
2
+ var H = { exports: {} }, Y = {};
3
3
  /**
4
4
  * @license React
5
5
  * react-jsx-runtime.production.js
@@ -10,28 +10,28 @@ var H = { exports: {} }, W = {};
10
10
  * LICENSE file in the root directory of this source tree.
11
11
  */
12
12
  var se;
13
- function de() {
14
- if (se) return W;
13
+ function ue() {
14
+ if (se) return Y;
15
15
  se = 1;
16
- var r = Symbol.for("react.transitional.element"), c = Symbol.for("react.fragment");
17
- function n(o, l, d) {
18
- var x = null;
19
- if (d !== void 0 && (x = "" + d), l.key !== void 0 && (x = "" + l.key), "key" in l) {
16
+ var r = Symbol.for("react.transitional.element"), i = Symbol.for("react.fragment");
17
+ function n(s, l, d) {
18
+ var m = null;
19
+ if (d !== void 0 && (m = "" + d), l.key !== void 0 && (m = "" + l.key), "key" in l) {
20
20
  d = {};
21
- for (var i in l)
22
- i !== "key" && (d[i] = l[i]);
21
+ for (var c in l)
22
+ c !== "key" && (d[c] = l[c]);
23
23
  } else d = l;
24
24
  return l = d.ref, {
25
25
  $$typeof: r,
26
- type: o,
27
- key: x,
26
+ type: s,
27
+ key: m,
28
28
  ref: l !== void 0 ? l : null,
29
29
  props: d
30
30
  };
31
31
  }
32
- return W.Fragment = c, W.jsx = n, W.jsxs = n, W;
32
+ return Y.Fragment = i, Y.jsx = n, Y.jsxs = n, Y;
33
33
  }
34
- var Y = {};
34
+ var U = {};
35
35
  /**
36
36
  * @license React
37
37
  * react-jsx-runtime.development.js
@@ -42,101 +42,101 @@ var Y = {};
42
42
  * LICENSE file in the root directory of this source tree.
43
43
  */
44
44
  var ae;
45
- function ue() {
45
+ function he() {
46
46
  return ae || (ae = 1, process.env.NODE_ENV !== "production" && (function() {
47
47
  function r(t) {
48
48
  if (t == null) return null;
49
49
  if (typeof t == "function")
50
- return t.$$typeof === N ? null : t.displayName || t.name || null;
50
+ return t.$$typeof === T ? null : t.displayName || t.name || null;
51
51
  if (typeof t == "string") return t;
52
52
  switch (t) {
53
53
  case R:
54
54
  return "Fragment";
55
55
  case q:
56
56
  return "Profiler";
57
- case C:
57
+ case A:
58
58
  return "StrictMode";
59
59
  case z:
60
60
  return "Suspense";
61
- case J:
62
- return "SuspenseList";
63
61
  case G:
62
+ return "SuspenseList";
63
+ case J:
64
64
  return "Activity";
65
65
  }
66
66
  if (typeof t == "object")
67
67
  switch (typeof t.tag == "number" && console.error(
68
68
  "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
69
69
  ), t.$$typeof) {
70
- case _:
70
+ case v:
71
71
  return "Portal";
72
72
  case X:
73
73
  return t.displayName || "Context";
74
74
  case V:
75
75
  return (t._context.displayName || "Context") + ".Consumer";
76
- case U:
77
- var a = t.render;
78
- return t = t.displayName, t || (t = a.displayName || a.name || "", t = t !== "" ? "ForwardRef(" + t + ")" : "ForwardRef"), t;
79
- case v:
80
- return a = t.displayName || null, a !== null ? a : r(t.type) || "Memo";
81
- case A:
82
- a = t._payload, t = t._init;
76
+ case F:
77
+ var o = t.render;
78
+ return t = t.displayName, t || (t = o.displayName || o.name || "", t = t !== "" ? "ForwardRef(" + t + ")" : "ForwardRef"), t;
79
+ case w:
80
+ return o = t.displayName || null, o !== null ? o : r(t.type) || "Memo";
81
+ case S:
82
+ o = t._payload, t = t._init;
83
83
  try {
84
- return r(t(a));
84
+ return r(t(o));
85
85
  } catch {
86
86
  }
87
87
  }
88
88
  return null;
89
89
  }
90
- function c(t) {
90
+ function i(t) {
91
91
  return "" + t;
92
92
  }
93
93
  function n(t) {
94
94
  try {
95
- c(t);
96
- var a = !1;
95
+ i(t);
96
+ var o = !1;
97
97
  } catch {
98
- a = !0;
98
+ o = !0;
99
99
  }
100
- if (a) {
101
- a = console;
102
- var p = a.error, f = typeof Symbol == "function" && Symbol.toStringTag && t[Symbol.toStringTag] || t.constructor.name || "Object";
100
+ if (o) {
101
+ o = console;
102
+ var p = o.error, f = typeof Symbol == "function" && Symbol.toStringTag && t[Symbol.toStringTag] || t.constructor.name || "Object";
103
103
  return p.call(
104
- a,
104
+ o,
105
105
  "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
106
106
  f
107
- ), c(t);
107
+ ), i(t);
108
108
  }
109
109
  }
110
- function o(t) {
110
+ function s(t) {
111
111
  if (t === R) return "<>";
112
- if (typeof t == "object" && t !== null && t.$$typeof === A)
112
+ if (typeof t == "object" && t !== null && t.$$typeof === S)
113
113
  return "<...>";
114
114
  try {
115
- var a = r(t);
116
- return a ? "<" + a + ">" : "<...>";
115
+ var o = r(t);
116
+ return o ? "<" + o + ">" : "<...>";
117
117
  } catch {
118
118
  return "<...>";
119
119
  }
120
120
  }
121
121
  function l() {
122
- var t = y.A;
122
+ var t = N.A;
123
123
  return t === null ? null : t.getOwner();
124
124
  }
125
125
  function d() {
126
126
  return Error("react-stack-top-frame");
127
127
  }
128
- function x(t) {
129
- if (k.call(t, "key")) {
130
- var a = Object.getOwnPropertyDescriptor(t, "key").get;
131
- if (a && a.isReactWarning) return !1;
128
+ function m(t) {
129
+ if (E.call(t, "key")) {
130
+ var o = Object.getOwnPropertyDescriptor(t, "key").get;
131
+ if (o && o.isReactWarning) return !1;
132
132
  }
133
133
  return t.key !== void 0;
134
134
  }
135
- function i(t, a) {
135
+ function c(t, o) {
136
136
  function p() {
137
- I || (I = !0, console.error(
137
+ O || (O = !0, console.error(
138
138
  "%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)",
139
- a
139
+ o
140
140
  ));
141
141
  }
142
142
  p.isReactWarning = !0, Object.defineProperty(t, "key", {
@@ -144,23 +144,23 @@ function ue() {
144
144
  configurable: !0
145
145
  });
146
146
  }
147
- function h() {
147
+ function u() {
148
148
  var t = r(this.type);
149
- return M[t] || (M[t] = !0, console.error(
149
+ return L[t] || (L[t] = !0, console.error(
150
150
  "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."
151
151
  )), t = this.props.ref, t !== void 0 ? t : null;
152
152
  }
153
- function s(t, a, p, f, F, Q) {
153
+ function x(t, o, p, f, B, Q) {
154
154
  var g = p.ref;
155
155
  return t = {
156
- $$typeof: S,
156
+ $$typeof: _,
157
157
  type: t,
158
- key: a,
158
+ key: o,
159
159
  props: p,
160
160
  _owner: f
161
161
  }, (g !== void 0 ? g : null) !== null ? Object.defineProperty(t, "ref", {
162
162
  enumerable: !1,
163
- get: h
163
+ get: u
164
164
  }) : Object.defineProperty(t, "ref", { enumerable: !1, value: null }), t._store = {}, Object.defineProperty(t._store, "validated", {
165
165
  configurable: !1,
166
166
  enumerable: !1,
@@ -175,7 +175,7 @@ function ue() {
175
175
  configurable: !1,
176
176
  enumerable: !1,
177
177
  writable: !0,
178
- value: F
178
+ value: B
179
179
  }), Object.defineProperty(t, "_debugTask", {
180
180
  configurable: !1,
181
181
  enumerable: !1,
@@ -183,23 +183,23 @@ function ue() {
183
183
  value: Q
184
184
  }), Object.freeze && (Object.freeze(t.props), Object.freeze(t)), t;
185
185
  }
186
- function u(t, a, p, f, F, Q) {
187
- var g = a.children;
186
+ function h(t, o, p, f, B, Q) {
187
+ var g = o.children;
188
188
  if (g !== void 0)
189
189
  if (f)
190
- if (O(g)) {
190
+ if (M(g)) {
191
191
  for (f = 0; f < g.length; f++)
192
- m(g[f]);
192
+ a(g[f]);
193
193
  Object.freeze && Object.freeze(g);
194
194
  } else
195
195
  console.error(
196
196
  "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
197
197
  );
198
- else m(g);
199
- if (k.call(a, "key")) {
198
+ else a(g);
199
+ if (E.call(o, "key")) {
200
200
  g = r(t);
201
- var P = Object.keys(a).filter(function(ie) {
202
- return ie !== "key";
201
+ var P = Object.keys(o).filter(function(ce) {
202
+ return ce !== "key";
203
203
  });
204
204
  f = 0 < P.length ? "{key: someKey, " + P.join(": ..., ") + ": ...}" : "{key: someKey}", re[g + f] || (P = 0 < P.length ? "{" + P.join(": ..., ") + ": ...}" : "{}", console.error(
205
205
  `A props object containing a "key" prop is being spread into JSX:
@@ -214,80 +214,80 @@ React keys must be passed directly to JSX without using spread:
214
214
  g
215
215
  ), re[g + f] = !0);
216
216
  }
217
- if (g = null, p !== void 0 && (n(p), g = "" + p), x(a) && (n(a.key), g = "" + a.key), "key" in a) {
217
+ if (g = null, p !== void 0 && (n(p), g = "" + p), m(o) && (n(o.key), g = "" + o.key), "key" in o) {
218
218
  p = {};
219
- for (var Z in a)
220
- Z !== "key" && (p[Z] = a[Z]);
221
- } else p = a;
222
- return g && i(
219
+ for (var K in o)
220
+ K !== "key" && (p[K] = o[K]);
221
+ } else p = o;
222
+ return g && c(
223
223
  p,
224
224
  typeof t == "function" ? t.displayName || t.name || "Unknown" : t
225
- ), s(
225
+ ), x(
226
226
  t,
227
227
  g,
228
228
  p,
229
229
  l(),
230
- F,
230
+ B,
231
231
  Q
232
232
  );
233
233
  }
234
- function m(t) {
235
- 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));
234
+ function a(t) {
235
+ 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));
236
236
  }
237
- function j(t) {
238
- return typeof t == "object" && t !== null && t.$$typeof === S;
237
+ function b(t) {
238
+ return typeof t == "object" && t !== null && t.$$typeof === _;
239
239
  }
240
- var b = ce, S = Symbol.for("react.transitional.element"), _ = Symbol.for("react.portal"), R = Symbol.for("react.fragment"), C = Symbol.for("react.strict_mode"), q = Symbol.for("react.profiler"), V = Symbol.for("react.consumer"), X = Symbol.for("react.context"), U = Symbol.for("react.forward_ref"), z = 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() {
240
+ 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() {
241
241
  return null;
242
242
  };
243
- b = {
243
+ j = {
244
244
  react_stack_bottom_frame: function(t) {
245
245
  return t();
246
246
  }
247
247
  };
248
- var I, M = {}, ee = b.react_stack_bottom_frame.bind(
249
- b,
248
+ var O, L = {}, ee = j.react_stack_bottom_frame.bind(
249
+ j,
250
250
  d
251
- )(), te = D(o(d)), re = {};
252
- Y.Fragment = R, Y.jsx = function(t, a, p) {
253
- var f = 1e4 > y.recentlyCreatedOwnerStacks++;
254
- return u(
251
+ )(), te = W(s(d)), re = {};
252
+ U.Fragment = R, U.jsx = function(t, o, p) {
253
+ var f = 1e4 > N.recentlyCreatedOwnerStacks++;
254
+ return h(
255
255
  t,
256
- a,
256
+ o,
257
257
  p,
258
258
  !1,
259
259
  f ? Error("react-stack-top-frame") : ee,
260
- f ? D(o(t)) : te
260
+ f ? W(s(t)) : te
261
261
  );
262
- }, Y.jsxs = function(t, a, p) {
263
- var f = 1e4 > y.recentlyCreatedOwnerStacks++;
264
- return u(
262
+ }, U.jsxs = function(t, o, p) {
263
+ var f = 1e4 > N.recentlyCreatedOwnerStacks++;
264
+ return h(
265
265
  t,
266
- a,
266
+ o,
267
267
  p,
268
268
  !0,
269
269
  f ? Error("react-stack-top-frame") : ee,
270
- f ? D(o(t)) : te
270
+ f ? W(s(t)) : te
271
271
  );
272
272
  };
273
- })()), Y;
273
+ })()), U;
274
274
  }
275
275
  var oe;
276
- function he() {
277
- return oe || (oe = 1, process.env.NODE_ENV === "production" ? H.exports = de() : H.exports = ue()), H.exports;
276
+ function me() {
277
+ return oe || (oe = 1, process.env.NODE_ENV === "production" ? H.exports = ue() : H.exports = he()), H.exports;
278
278
  }
279
- var e = he(), T = /* @__PURE__ */ ((r) => (r.TEXT = "text", r.PRODUCT_LIST = "product_list", r.LOADING = "loading", r))(T || {}), w = /* @__PURE__ */ ((r) => (r.USER = "user", r.AI = "ai", r))(w || {});
280
- const me = ({
279
+ 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 || {});
280
+ const xe = ({
281
281
  title: r,
282
- primaryColor: c,
282
+ primaryColor: i,
283
283
  onClose: n,
284
- onReset: o,
284
+ onReset: s,
285
285
  onToggleExpand: l,
286
286
  isExpanded: d,
287
- language: x,
288
- onLanguageChange: i
287
+ language: m,
288
+ onLanguageChange: c
289
289
  }) => {
290
- const h = [
290
+ const u = [
291
291
  { value: "en", label: "EN" },
292
292
  { value: "vi", label: "VI" },
293
293
  { value: "ja", label: "JA" }
@@ -302,7 +302,7 @@ const me = ({
302
302
  "img",
303
303
  {
304
304
  src: "https://fptshop.com.vn/img/bitu/bitu-avatar.png",
305
- onError: (s) => s.currentTarget.src = "https://cdn-icons-png.flaticon.com/512/4712/4712035.png",
305
+ onError: (x) => x.currentTarget.src = "https://cdn-icons-png.flaticon.com/512/4712/4712035.png",
306
306
  className: "w-full h-full object-contain",
307
307
  alt: "Bot Icon"
308
308
  }
@@ -324,11 +324,11 @@ const me = ({
324
324
  /* @__PURE__ */ e.jsx(
325
325
  "select",
326
326
  {
327
- value: x,
328
- onChange: (s) => i(s.target.value),
327
+ value: m,
328
+ onChange: (x) => c(x.target.value),
329
329
  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",
330
330
  title: "Select language",
331
- children: h.map((s) => /* @__PURE__ */ e.jsx("option", { value: s.value, className: "font-sans font-bold", children: s.label }, s.value))
331
+ children: u.map((x) => /* @__PURE__ */ e.jsx("option", { value: x.value, className: "font-sans font-bold", children: x.label }, x.value))
332
332
  }
333
333
  ),
334
334
  /* @__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 = ({
336
336
  /* @__PURE__ */ e.jsx(
337
337
  "button",
338
338
  {
339
- onClick: o,
339
+ onClick: s,
340
340
  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",
341
341
  title: "Reset chat",
342
342
  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: [
@@ -382,7 +382,7 @@ const me = ({
382
382
  ]
383
383
  }
384
384
  );
385
- }, xe = ({ product: r, primaryColor: c }) => /* @__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: [
385
+ }, 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: [
386
386
  /* @__PURE__ */ e.jsxs("div", { className: "relative h-32 w-full bg-white flex items-center justify-center p-2", children: [
387
387
  /* @__PURE__ */ e.jsx(
388
388
  "img",
@@ -406,19 +406,19 @@ const me = ({
406
406
  "button",
407
407
  {
408
408
  className: "w-full py-1.5 rounded-lg text-[11px] font-bold border transition-all duration-300 active:scale-95 shadow-sm",
409
- style: { borderColor: c, color: c },
409
+ style: { borderColor: i, color: i },
410
410
  onMouseEnter: (n) => {
411
- n.currentTarget.style.backgroundColor = c, n.currentTarget.style.color = "white";
411
+ n.currentTarget.style.backgroundColor = i, n.currentTarget.style.color = "white";
412
412
  },
413
413
  onMouseLeave: (n) => {
414
- n.currentTarget.style.backgroundColor = "transparent", n.currentTarget.style.color = c;
414
+ n.currentTarget.style.backgroundColor = "transparent", n.currentTarget.style.color = i;
415
415
  },
416
416
  children: "Chọn mua"
417
417
  }
418
418
  )
419
419
  ] })
420
- ] }), pe = ({ text: r }) => {
421
- const [c, n] = E(!1), o = async () => {
420
+ ] }), fe = ({ text: r }) => {
421
+ const [i, n] = k(!1), s = async () => {
422
422
  try {
423
423
  await navigator.clipboard.writeText(r), n(!0), setTimeout(() => n(!1), 2e3);
424
424
  } catch (l) {
@@ -428,106 +428,118 @@ const me = ({
428
428
  return /* @__PURE__ */ e.jsx(
429
429
  "button",
430
430
  {
431
- onClick: o,
431
+ onClick: s,
432
432
  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",
433
433
  title: "Copy message",
434
- children: c ? /* @__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: [
434
+ 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: [
435
435
  /* @__PURE__ */ e.jsx("rect", { width: "8", height: "4", x: "8", y: "2", rx: "1", ry: "1" }),
436
436
  /* @__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" })
437
437
  ] })
438
438
  }
439
439
  );
440
+ }, ge = ({ text: r, speed: i = 8, onComplete: n }) => {
441
+ const [s, l] = k(""), [d, m] = k(0);
442
+ return I(() => {
443
+ r.length < s.length && (l(""), m(0));
444
+ }, [r]), I(() => {
445
+ if (d < r.length) {
446
+ const c = setTimeout(() => {
447
+ l((u) => u + r.charAt(d)), m((u) => u + 1);
448
+ }, i);
449
+ return () => clearTimeout(c);
450
+ } else n && r.length > 0 && n();
451
+ }, [d, r, i, n]), /* @__PURE__ */ e.jsx("span", { children: s });
440
452
  }, $ = (r) => {
441
- const c = /(\*\*.*?\*\*|\[.*?\]\(.*?\))/g;
442
- return r.split(c).map((o, l) => {
443
- if (o.startsWith("**") && o.endsWith("**")) {
444
- const x = o.slice(2, -2);
445
- return /* @__PURE__ */ e.jsx("strong", { className: "font-bold text-gray-900", children: x }, l);
453
+ const i = /(\*\*.*?\*\*|\[.*?\]\(.*?\))/g;
454
+ return r.split(i).map((s, l) => {
455
+ if (s.startsWith("**") && s.endsWith("**")) {
456
+ const m = s.slice(2, -2);
457
+ return /* @__PURE__ */ e.jsx("strong", { className: "font-bold text-gray-900", children: m }, l);
446
458
  }
447
- const d = o.match(/\[(.*?)\]\((.*?)\)/);
459
+ const d = s.match(/\[(.*?)\]\((.*?)\)/);
448
460
  if (d) {
449
- const [x, i, h] = d;
461
+ const [m, c, u] = d;
450
462
  return /* @__PURE__ */ e.jsx(
451
463
  "a",
452
464
  {
453
- href: h,
465
+ href: u,
454
466
  target: "_blank",
455
467
  rel: "noopener noreferrer",
456
468
  className: "text-blue-600 hover:underline break-all font-semibold",
457
- children: i
469
+ children: c
458
470
  },
459
471
  l
460
472
  );
461
473
  }
462
- return o;
474
+ return s;
463
475
  });
464
- }, fe = ({ text: r }) => {
465
- const c = r.replace(/\r/g, "").split(`
476
+ }, be = ({ text: r }) => {
477
+ const i = r.replace(/\r/g, "").split(`
466
478
  `), n = [];
467
- let o = [], l = !1;
468
- const d = (x) => {
469
- if (o.length > 0) {
470
- const h = o.length > 1 && o[1].every((s) => s.trim().match(/^:?-+:?$/)) ? [o[0], ...o.slice(2)] : o;
471
- h.length > 0 && n.push(
479
+ let s = [], l = !1;
480
+ const d = (m) => {
481
+ if (s.length > 0) {
482
+ const u = s.length > 1 && s[1].every((x) => x.trim().match(/^:?-+:?$/)) ? [s[0], ...s.slice(2)] : s;
483
+ u.length > 0 && n.push(
472
484
  /* @__PURE__ */ e.jsxs("div", { className: "my-4 relative group/table", children: [
473
485
  /* @__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: [
474
- /* @__PURE__ */ e.jsx("thead", { className: "bg-slate-50 border-b border-slate-200", children: /* @__PURE__ */ e.jsx("tr", { children: h[0].map((s, u) => /* @__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: $(s.trim()) }, u)) }) }),
475
- /* @__PURE__ */ e.jsx("tbody", { className: "divide-y divide-slate-100", children: h.slice(1).map((s, u) => /* @__PURE__ */ e.jsx("tr", { className: "hover:bg-slate-50/50 transition-colors", children: s.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)) }, u)) })
486
+ /* @__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)) }) }),
487
+ /* @__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)) })
476
488
  ] }) }),
477
489
  /* @__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" })
478
- ] }, `table-wrapper-${x}`)
479
- ), o = [], l = !1;
490
+ ] }, `table-wrapper-${m}`)
491
+ ), s = [], l = !1;
480
492
  }
481
493
  };
482
- return c.forEach((x, i) => {
483
- const h = x.trim();
484
- if (h.includes("|") && (h.startsWith("|") || h.split("|").length > 1)) {
485
- let m = h.split("|");
486
- h.startsWith("|") && m.shift(), h.endsWith("|") && m.pop(), o.push(m), l = !0;
494
+ return i.forEach((m, c) => {
495
+ const u = m.trim();
496
+ if (u.includes("|") && (u.startsWith("|") || u.split("|").length > 1)) {
497
+ let a = u.split("|");
498
+ u.startsWith("|") && a.shift(), u.endsWith("|") && a.pop(), s.push(a), l = !0;
487
499
  return;
488
- } else l && d(i);
489
- const s = h.match(/^(#{1,4})\s+(.*)$/);
490
- if (s) {
491
- const m = s[1].length, j = s[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";
492
- n.push(/* @__PURE__ */ e.jsx("div", { className: b, children: $(j) }, i));
500
+ } else l && d(c);
501
+ const x = u.match(/^(#{1,4})\s+(.*)$/);
502
+ if (x) {
503
+ 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";
504
+ n.push(/* @__PURE__ */ e.jsx("div", { className: j, children: $(b) }, c));
493
505
  return;
494
506
  }
495
- const u = h.match(/^[*+-]\s+(.*)$/);
496
- if (u) {
497
- const m = u[1];
507
+ const h = u.match(/^[*+-]\s+(.*)$/);
508
+ if (h) {
509
+ const a = h[1];
498
510
  n.push(
499
511
  /* @__PURE__ */ e.jsxs("div", { className: "flex gap-3 pl-1 mb-2 items-start group", children: [
500
512
  /* @__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" }),
501
- /* @__PURE__ */ e.jsx("div", { className: "flex-1 leading-relaxed text-slate-700", children: $(m) })
502
- ] }, i)
513
+ /* @__PURE__ */ e.jsx("div", { className: "flex-1 leading-relaxed text-slate-700", children: $(a) })
514
+ ] }, c)
503
515
  );
504
516
  return;
505
517
  }
506
- if (h === "") {
507
- n.push(/* @__PURE__ */ e.jsx("div", { className: "h-3" }, i));
518
+ if (u === "") {
519
+ n.push(/* @__PURE__ */ e.jsx("div", { className: "h-3" }, c));
508
520
  return;
509
521
  }
510
522
  n.push(
511
- /* @__PURE__ */ e.jsx("div", { className: "mb-1.5 leading-relaxed text-slate-700", children: $(x) }, i)
523
+ /* @__PURE__ */ e.jsx("div", { className: "mb-1.5 leading-relaxed text-slate-700", children: $(m) }, c)
512
524
  );
513
- }), l && d(c.length), /* @__PURE__ */ e.jsx("div", { className: "markdown-render w-full", children: n });
514
- }, ge = ({
525
+ }), l && d(i.length), /* @__PURE__ */ e.jsx("div", { className: "markdown-render w-full", children: n });
526
+ }, ve = ({
515
527
  messages: r,
516
- isLoading: c,
528
+ isLoading: i,
517
529
  description: n,
518
- quickReplies: o,
530
+ quickReplies: s,
519
531
  onQuickReply: l,
520
532
  primaryColor: d,
521
- renderMarkdown: x = !1
533
+ renderMarkdown: m = !1
522
534
  }) => {
523
- const i = "https://fptshop.com.vn/img/bitu/bitu-avatar.png", h = "https://cdn-icons-png.flaticon.com/512/4712/4712035.png";
535
+ 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"]));
524
536
  return /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-8 pb-4", children: [
525
537
  /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col items-center justify-center pt-4 text-center animate-msg", children: [
526
538
  /* @__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(
527
539
  "img",
528
540
  {
529
- src: i,
530
- onError: (s) => s.currentTarget.src = h,
541
+ src: c,
542
+ onError: (a) => a.currentTarget.src = u,
531
543
  className: "w-full h-full object-contain",
532
544
  alt: "Sigma AI Hero"
533
545
  }
@@ -536,58 +548,67 @@ const me = ({
536
548
  "Sigma ",
537
549
  /* @__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" })
538
550
  ] }),
539
- /* @__PURE__ */ e.jsx("div", { className: "text-[14px] text-gray-600 mt-3 leading-relaxed px-4 max-w-[280px]", children: n && /* @__PURE__ */ e.jsx("div", { className: "bot-description", children: $(n) }) })
551
+ /* @__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) }) })
540
552
  ] }),
541
- r.map((s, u) => /* @__PURE__ */ e.jsxs(
542
- "div",
543
- {
544
- className: `flex flex-col animate-msg group ${s.sender === w.USER ? "items-end" : "items-start"}`,
545
- style: { animationDelay: `${u * 0.05}s` },
546
- children: [
547
- s.sender === w.AI && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between w-full max-w-[96%] mb-2 ml-1", children: [
548
- /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1.5", children: [
553
+ r.map((a, b) => {
554
+ const _ = a.sender === y.AI && b === r.length - 1 && !i && !x.has(a.id);
555
+ return /* @__PURE__ */ e.jsxs(
556
+ "div",
557
+ {
558
+ className: `flex flex-col animate-msg group ${a.sender === y.USER ? "items-end" : "items-start"}`,
559
+ style: { animationDelay: `${b * 0.05}s` },
560
+ children: [
561
+ a.sender === y.AI && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between w-full max-w-[96%] mb-2 ml-1", children: [
562
+ /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1.5", children: [
563
+ /* @__PURE__ */ e.jsx(
564
+ "img",
565
+ {
566
+ src: c,
567
+ onError: (v) => v.currentTarget.src = u,
568
+ className: "w-4 h-4 object-contain",
569
+ alt: "AI"
570
+ }
571
+ ),
572
+ /* @__PURE__ */ e.jsx("span", { className: "text-[11px] font-bold text-gray-400 uppercase tracking-widest", children: "AI Agent" })
573
+ ] }),
574
+ /* @__PURE__ */ e.jsx("div", { className: "opacity-0 group-hover:opacity-100 transition-opacity duration-200", children: /* @__PURE__ */ e.jsx(fe, { text: a.content }) })
575
+ ] }),
576
+ /* @__PURE__ */ e.jsxs("div", { className: `flex flex-col ${a.sender === y.USER ? "items-end" : "items-start"} w-full max-w-[96%]`, children: [
549
577
  /* @__PURE__ */ e.jsx(
550
- "img",
578
+ "div",
551
579
  {
552
- src: i,
553
- onError: (m) => m.currentTarget.src = h,
554
- className: "w-4 h-4 object-contain",
555
- alt: "AI"
580
+ 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" : ""}`,
581
+ children: _ ? /* @__PURE__ */ e.jsx(
582
+ ge,
583
+ {
584
+ text: a.content,
585
+ onComplete: () => h((v) => new Set(v).add(a.id))
586
+ }
587
+ ) : m && a.sender === y.AI ? /* @__PURE__ */ e.jsx(be, { text: a.content }) : a.content
556
588
  }
557
589
  ),
558
- /* @__PURE__ */ e.jsx("span", { className: "text-[11px] font-bold text-gray-400 uppercase tracking-widest", children: "AI Agent" })
559
- ] }),
560
- /* @__PURE__ */ e.jsx("div", { className: "opacity-0 group-hover:opacity-100 transition-opacity duration-200", children: /* @__PURE__ */ e.jsx(pe, { text: s.content }) })
561
- ] }),
562
- /* @__PURE__ */ e.jsxs("div", { className: `flex flex-col ${s.sender === w.USER ? "items-end" : "items-start"} w-full max-w-[96%]`, children: [
563
- /* @__PURE__ */ e.jsx(
564
- "div",
565
- {
566
- className: `px-4 py-3 rounded-[20px] shadow-sm border border-black/[0.02] overflow-hidden transition-all duration-300 ${s.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 hover:shadow-md"} ${!x || s.sender === w.USER ? "whitespace-pre-line" : ""}`,
567
- children: x && s.sender === w.AI ? /* @__PURE__ */ e.jsx(fe, { text: s.content }) : s.content
568
- }
569
- ),
570
- s.type === T.PRODUCT_LIST && s.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: s.products.map((m) => /* @__PURE__ */ e.jsx("div", { className: "product-card-snap", children: /* @__PURE__ */ e.jsx(xe, { product: m, primaryColor: d }) }, m.id)) }),
571
- u === 0 && r.length === 1 && s.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(
572
- "button",
573
- {
574
- onClick: () => l(m),
575
- 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",
576
- children: m
577
- },
578
- j
579
- )) })
580
- ] })
581
- ]
582
- },
583
- s.id
584
- )),
585
- c && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5 items-start animate-msg", children: [
590
+ 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)) }),
591
+ 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(
592
+ "button",
593
+ {
594
+ onClick: () => l(v),
595
+ 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",
596
+ children: v
597
+ },
598
+ R
599
+ )) })
600
+ ] })
601
+ ]
602
+ },
603
+ a.id
604
+ );
605
+ }),
606
+ i && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5 items-start animate-msg", children: [
586
607
  /* @__PURE__ */ e.jsx("div", { className: "flex items-center gap-1.5 ml-1", children: /* @__PURE__ */ e.jsx(
587
608
  "img",
588
609
  {
589
- src: i,
590
- onError: (s) => s.currentTarget.src = h,
610
+ src: c,
611
+ onError: (a) => a.currentTarget.src = u,
591
612
  className: "w-4 h-4 object-contain",
592
613
  alt: "AI Loading"
593
614
  }
@@ -599,19 +620,19 @@ const me = ({
599
620
  ] })
600
621
  ] })
601
622
  ] });
602
- }, be = ({ placeholder: r, onSendMessage: c, primaryColor: n }) => {
603
- const [o, l] = E(""), d = () => {
604
- o.trim() && (c(o), l(""));
605
- }, x = (i) => {
606
- i.key === "Enter" && !i.shiftKey && (i.preventDefault(), d());
623
+ }, je = ({ placeholder: r, onSendMessage: i, primaryColor: n }) => {
624
+ const [s, l] = k(""), d = () => {
625
+ s.trim() && (i(s), l(""));
626
+ }, m = (c) => {
627
+ c.key === "Enter" && !c.shiftKey && (c.preventDefault(), d());
607
628
  };
608
629
  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: [
609
630
  /* @__PURE__ */ e.jsx(
610
631
  "textarea",
611
632
  {
612
- value: o,
613
- onChange: (i) => l(i.target.value),
614
- onKeyDown: x,
633
+ value: s,
634
+ onChange: (c) => l(c.target.value),
635
+ onKeyDown: m,
615
636
  placeholder: r,
616
637
  rows: 1,
617
638
  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",
@@ -622,8 +643,8 @@ const me = ({
622
643
  "button",
623
644
  {
624
645
  onClick: d,
625
- disabled: !o.trim(),
626
- 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"}`,
646
+ disabled: !s.trim(),
647
+ 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"}`,
627
648
  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: [
628
649
  /* @__PURE__ */ e.jsx("path", { d: "m5 12 7-7 7 7" }),
629
650
  /* @__PURE__ */ e.jsx("path", { d: "M12 19V5" })
@@ -631,10 +652,10 @@ const me = ({
631
652
  }
632
653
  )
633
654
  ] }) });
634
- }, ve = ({ isOpen: r, onClick: c, primaryColor: n, 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(
655
+ }, 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(
635
656
  "button",
636
657
  {
637
- onClick: c,
658
+ onClick: i,
638
659
  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"}`,
639
660
  children: /* @__PURE__ */ e.jsx(
640
661
  "img",
@@ -646,142 +667,144 @@ const me = ({
646
667
  }
647
668
  )
648
669
  }
649
- ) }), le = () => Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15), L = (r, c, n) => typeof r == "object" && r !== null && !Array.isArray(r) ? r[c] || r.en || Object.values(r)[0] || n : r ?? n, we = ({ config: r, onGetAiResponse: c }) => {
650
- const [n, o] = E(!1), [l, d] = E(!1), [x, i] = E(!1), [h, s] = E(le()), [u, m] = E("en"), [j, b] = E([]), [S, _] = E(!1), R = ne(null), C = ne(0);
651
- B(() => {
652
- const v = L(r.welcomeMessage, u, "Hello!");
653
- b([{
670
+ ) }), 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 }) => {
671
+ 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);
672
+ I(() => {
673
+ localStorage.setItem(le, h);
674
+ }, [h]), I(() => {
675
+ const w = D(r.welcomeMessage, h, "Hello!");
676
+ j([{
654
677
  id: "welcome",
655
- type: T.TEXT,
656
- sender: w.AI,
657
- content: v,
678
+ type: C.TEXT,
679
+ sender: y.AI,
680
+ content: w,
658
681
  timestamp: /* @__PURE__ */ new Date()
659
682
  }]);
660
683
  }, []);
661
- const q = K(() => L(r.placeholder, u, "Type a message..."), [r.placeholder, u]), V = K(() => L(r.quickReplies, u, []), [r.quickReplies, u]), X = K(() => L(r.description, u, ""), [r.description, u]);
662
- B(() => {
663
- if (j.length === 1 && j[0].id === "welcome") {
664
- const v = L(r.welcomeMessage, u, "Hello!");
665
- b([{ ...j[0], content: v }]);
684
+ 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]);
685
+ I(() => {
686
+ if (b.length === 1 && (b[0].id === "welcome" || b[0].sender === y.AI)) {
687
+ const w = D(r.welcomeMessage, h, "Hello!");
688
+ j([{ ...b[0], content: w }]);
666
689
  }
667
- }, [u]), B(() => {
690
+ }, [h]), I(() => {
668
691
  if (n) {
669
- const v = setTimeout(() => i(!0), 50);
670
- return () => clearTimeout(v);
692
+ const w = setTimeout(() => c(!0), 50);
693
+ return () => clearTimeout(w);
671
694
  } else
672
- i(!1);
673
- }, [n]), B(() => {
695
+ c(!1);
696
+ }, [n]), I(() => {
674
697
  R.current && n && (R.current.scrollTop = R.current.scrollHeight);
675
- }, [j, n, S]);
676
- const U = async (v) => {
677
- if (!v.trim() || S) return;
678
- const A = ++C.current, G = {
698
+ }, [b, n, _]);
699
+ const F = async (w) => {
700
+ if (!w.trim() || _) return;
701
+ const S = ++A.current, J = {
679
702
  id: `user-${Date.now()}`,
680
- type: T.TEXT,
681
- sender: w.USER,
682
- content: v,
703
+ type: C.TEXT,
704
+ sender: y.USER,
705
+ content: w,
683
706
  timestamp: /* @__PURE__ */ new Date()
684
707
  };
685
- b((N) => [...N, G]), _(!0);
708
+ j((T) => [...T, J]), v(!0);
686
709
  try {
687
- const N = c(v, h, u);
688
- if (N && typeof N == "object" && Symbol.asyncIterator in N) {
689
- let y = "", k = !1;
690
- const O = `ai-${Date.now()}`;
691
- for await (const D of N) {
692
- if (A !== C.current) return;
693
- k || (b((I) => [...I, {
694
- id: O,
695
- type: T.TEXT,
696
- sender: w.AI,
710
+ const T = i(w, u, h);
711
+ if (T && typeof T == "object" && Symbol.asyncIterator in T) {
712
+ let N = "", E = !1;
713
+ const M = `ai-${Date.now()}`;
714
+ for await (const W of T) {
715
+ if (S !== A.current) return;
716
+ E || (j((O) => [...O, {
717
+ id: M,
718
+ type: C.TEXT,
719
+ sender: y.AI,
697
720
  content: "",
698
721
  timestamp: /* @__PURE__ */ new Date()
699
- }]), _(!1), k = !0), y += D, b((I) => I.map(
700
- (M) => M.id === O ? { ...M, content: y } : M
722
+ }]), v(!1), E = !0), N += W, j((O) => O.map(
723
+ (L) => L.id === M ? { ...L, content: N } : L
701
724
  ));
702
725
  }
703
726
  } else {
704
- const y = await N;
705
- if (A !== C.current) return;
706
- _(!1);
707
- const k = typeof y == "string" ? { text: y, products: void 0 } : y;
708
- b((O) => [...O, {
727
+ const N = await T;
728
+ if (S !== A.current) return;
729
+ v(!1);
730
+ const E = typeof N == "string" ? { text: N, products: void 0 } : N;
731
+ j((M) => [...M, {
709
732
  id: `ai-${Date.now()}`,
710
- type: k.products ? T.PRODUCT_LIST : T.TEXT,
711
- sender: w.AI,
712
- content: k.text,
713
- products: k.products,
733
+ type: E.products ? C.PRODUCT_LIST : C.TEXT,
734
+ sender: y.AI,
735
+ content: E.text,
736
+ products: E.products,
714
737
  timestamp: /* @__PURE__ */ new Date()
715
738
  }]);
716
739
  }
717
- } catch (N) {
718
- if (A !== C.current) return;
719
- console.error("Chatbox Error:", N), _(!1);
720
- const y = u === "vi" ? "Hệ thống đang bận, vui lòng thử lại sau." : "System is busy, please try again later.";
721
- b((k) => [...k, {
740
+ } catch (T) {
741
+ if (S !== A.current) return;
742
+ console.error("Chatbox Error:", T), v(!1);
743
+ const N = h === "vi" ? "Hệ thống đang bận, vui lòng thử lại sau." : "System is busy, please try again later.";
744
+ j((E) => [...E, {
722
745
  id: `err-${Date.now()}`,
723
- type: T.TEXT,
724
- sender: w.AI,
725
- content: y,
746
+ type: C.TEXT,
747
+ sender: y.AI,
748
+ content: N,
726
749
  timestamp: /* @__PURE__ */ new Date()
727
750
  }]);
728
751
  }
729
752
  }, z = () => {
730
- C.current++, s(le());
731
- const v = L(r.welcomeMessage, u, "Hello!");
732
- b([{
753
+ A.current++, x(ie());
754
+ const w = D(r.welcomeMessage, h, "Hello!");
755
+ j([{
733
756
  id: "welcome",
734
- type: T.TEXT,
735
- sender: w.AI,
736
- content: v,
757
+ type: C.TEXT,
758
+ sender: y.AI,
759
+ content: w,
737
760
  timestamp: /* @__PURE__ */ new Date()
738
- }]), _(!1), d(!1);
739
- }, J = `
761
+ }]), v(!1);
762
+ }, G = `
740
763
  fixed z-[99] overflow-hidden flex flex-col border border-white/40 shadow-2xl bg-white animate-chat-pop
741
- ${x ? "transition-[width,height,border-radius,right,bottom] duration-300 ease-in-out" : ""}
764
+ ${m ? "transition-[width,height,border-radius,right,bottom] duration-300 ease-in-out" : ""}
742
765
  ${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]"}
743
766
  `;
744
767
  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
745
768
  /* @__PURE__ */ e.jsx(
746
- ve,
769
+ we,
747
770
  {
748
771
  isOpen: n,
749
- onClick: () => o(!n),
772
+ onClick: () => s(!n),
750
773
  primaryColor: r.primaryColor,
751
774
  className: n ? "hidden md:flex" : "flex"
752
775
  }
753
776
  ),
754
- n && /* @__PURE__ */ e.jsxs("div", { className: J, style: { left: "auto" }, children: [
777
+ n && /* @__PURE__ */ e.jsxs("div", { className: G, style: { left: "auto" }, children: [
755
778
  /* @__PURE__ */ e.jsx(
756
- me,
779
+ xe,
757
780
  {
758
781
  title: r.botName,
759
782
  primaryColor: r.primaryColor,
760
- onClose: () => o(!1),
783
+ onClose: () => s(!1),
761
784
  onReset: z,
762
785
  onToggleExpand: () => d(!l),
763
786
  isExpanded: l,
764
- language: u,
765
- onLanguageChange: m
787
+ language: h,
788
+ onLanguageChange: a
766
789
  }
767
790
  ),
768
791
  /* @__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(
769
- ge,
792
+ ve,
770
793
  {
771
- messages: j,
772
- isLoading: S,
794
+ messages: b,
795
+ isLoading: _,
773
796
  description: X,
774
797
  quickReplies: V,
775
- onQuickReply: (v) => U(v),
798
+ onQuickReply: (w) => F(w),
776
799
  primaryColor: r.primaryColor,
777
800
  renderMarkdown: r.renderMarkdown
778
801
  }
779
802
  ) }),
780
803
  /* @__PURE__ */ e.jsx("div", { className: "bg-white p-3 border-t border-slate-100", children: /* @__PURE__ */ e.jsx(
781
- be,
804
+ je,
782
805
  {
783
806
  placeholder: q,
784
- onSendMessage: U,
807
+ onSendMessage: F,
785
808
  primaryColor: r.primaryColor
786
809
  }
787
810
  ) })
@@ -789,7 +812,7 @@ const me = ({
789
812
  ] });
790
813
  };
791
814
  export {
792
- we as Chatbox,
793
- T as MessageType,
794
- w as SenderType
815
+ Ne as Chatbox,
816
+ C as MessageType,
817
+ y as SenderType
795
818
  };