@xcelsior/ui-chat 2.0.1 → 2.0.2

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
@@ -912,7 +912,50 @@ function ChatHeader({ agent, onClose, onMinimize, theme }) {
912
912
 
913
913
  // src/components/MessageList.tsx
914
914
  import { useCallback as useCallback4, useEffect as useEffect6, useRef as useRef4 } from "react";
915
- import { Spinner } from "@xcelsior/design-system";
915
+
916
+ // src/components/Spinner.tsx
917
+ import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
918
+ var SIZE_MAP = {
919
+ sm: 16,
920
+ md: 24,
921
+ lg: 36
922
+ };
923
+ var BORDER_MAP = {
924
+ sm: 2,
925
+ md: 2,
926
+ lg: 3
927
+ };
928
+ function Spinner({ size = "md", color = "currentColor" }) {
929
+ const px = SIZE_MAP[size];
930
+ const border = BORDER_MAP[size];
931
+ return /* @__PURE__ */ jsxs3(Fragment, { children: [
932
+ /* @__PURE__ */ jsx3("style", { children: `
933
+ @keyframes xchat-spin {
934
+ to { transform: rotate(360deg); }
935
+ }
936
+ .xchat-spinner {
937
+ animation: xchat-spin 0.75s linear infinite;
938
+ border-radius: 50%;
939
+ display: inline-block;
940
+ flex-shrink: 0;
941
+ }
942
+ ` }),
943
+ /* @__PURE__ */ jsx3(
944
+ "span",
945
+ {
946
+ className: "xchat-spinner",
947
+ role: "status",
948
+ "aria-label": "Loading",
949
+ style: {
950
+ width: px,
951
+ height: px,
952
+ border: `${border}px solid rgba(128,128,128,0.25)`,
953
+ borderTopColor: color
954
+ }
955
+ }
956
+ )
957
+ ] });
958
+ }
916
959
 
917
960
  // src/components/MessageItem.tsx
918
961
  import { formatDistanceToNow } from "date-fns";
@@ -1007,7 +1050,7 @@ function getMarkdownStyles(theme, isLightTheme) {
1007
1050
  }
1008
1051
 
1009
1052
  // src/components/MarkdownMessage.tsx
1010
- import { jsx as jsx3 } from "react/jsx-runtime";
1053
+ import { jsx as jsx4 } from "react/jsx-runtime";
1011
1054
  function computeIsLightTheme(theme) {
1012
1055
  const bgColor = theme?.background || "#00001a";
1013
1056
  if (!bgColor.startsWith("#")) return false;
@@ -1026,18 +1069,18 @@ function MarkdownMessage({ content, theme }) {
1026
1069
  // inside the bubble.
1027
1070
  display: "block"
1028
1071
  };
1029
- return /* @__PURE__ */ jsx3("div", { style: wrapperStyle, children: /* @__PURE__ */ jsx3(
1072
+ return /* @__PURE__ */ jsx4("div", { style: wrapperStyle, children: /* @__PURE__ */ jsx4(
1030
1073
  ReactMarkdown,
1031
1074
  {
1032
1075
  components: {
1033
1076
  // Paragraphs
1034
- p: ({ children }) => /* @__PURE__ */ jsx3("p", { style: styles.paragraph, children }),
1077
+ p: ({ children }) => /* @__PURE__ */ jsx4("p", { style: styles.paragraph, children }),
1035
1078
  // Bold
1036
- strong: ({ children }) => /* @__PURE__ */ jsx3("strong", { style: styles.strong, children }),
1079
+ strong: ({ children }) => /* @__PURE__ */ jsx4("strong", { style: styles.strong, children }),
1037
1080
  // Italic
1038
- em: ({ children }) => /* @__PURE__ */ jsx3("em", { style: styles.emphasis, children }),
1081
+ em: ({ children }) => /* @__PURE__ */ jsx4("em", { style: styles.emphasis, children }),
1039
1082
  // Links — open in new tab
1040
- a: ({ href, children }) => /* @__PURE__ */ jsx3(
1083
+ a: ({ href, children }) => /* @__PURE__ */ jsx4(
1041
1084
  "a",
1042
1085
  {
1043
1086
  href,
@@ -1048,9 +1091,9 @@ function MarkdownMessage({ content, theme }) {
1048
1091
  }
1049
1092
  ),
1050
1093
  // Unordered list
1051
- ul: ({ children }) => /* @__PURE__ */ jsx3("ul", { style: { ...styles.list, listStyleType: "disc" }, children }),
1094
+ ul: ({ children }) => /* @__PURE__ */ jsx4("ul", { style: { ...styles.list, listStyleType: "disc" }, children }),
1052
1095
  // Ordered list
1053
- ol: ({ children }) => /* @__PURE__ */ jsx3(
1096
+ ol: ({ children }) => /* @__PURE__ */ jsx4(
1054
1097
  "ol",
1055
1098
  {
1056
1099
  style: { ...styles.list, listStyleType: "decimal" },
@@ -1058,7 +1101,7 @@ function MarkdownMessage({ content, theme }) {
1058
1101
  }
1059
1102
  ),
1060
1103
  // List item
1061
- li: ({ children }) => /* @__PURE__ */ jsx3("li", { style: styles.listItem, children }),
1104
+ li: ({ children }) => /* @__PURE__ */ jsx4("li", { style: styles.listItem, children }),
1062
1105
  // Inline code vs code block — react-markdown wraps fenced
1063
1106
  // code blocks as <pre><code className="language-*">. The
1064
1107
  // cleanest heuristic: if the className starts with
@@ -1068,7 +1111,7 @@ function MarkdownMessage({ content, theme }) {
1068
1111
  className?.startsWith("language-")
1069
1112
  );
1070
1113
  if (isBlock) {
1071
- return /* @__PURE__ */ jsx3(
1114
+ return /* @__PURE__ */ jsx4(
1072
1115
  "code",
1073
1116
  {
1074
1117
  className,
@@ -1077,10 +1120,10 @@ function MarkdownMessage({ content, theme }) {
1077
1120
  }
1078
1121
  );
1079
1122
  }
1080
- return /* @__PURE__ */ jsx3("code", { style: styles.code, children });
1123
+ return /* @__PURE__ */ jsx4("code", { style: styles.code, children });
1081
1124
  }),
1082
1125
  // Pre wrapper for code blocks
1083
- pre: ({ children }) => /* @__PURE__ */ jsx3(
1126
+ pre: ({ children }) => /* @__PURE__ */ jsx4(
1084
1127
  "pre",
1085
1128
  {
1086
1129
  style: {
@@ -1094,7 +1137,7 @@ function MarkdownMessage({ content, theme }) {
1094
1137
  }
1095
1138
  ),
1096
1139
  // Headings — h1 through h6 with progressive size reduction
1097
- h1: ({ children }) => /* @__PURE__ */ jsx3(
1140
+ h1: ({ children }) => /* @__PURE__ */ jsx4(
1098
1141
  "h1",
1099
1142
  {
1100
1143
  style: {
@@ -1104,7 +1147,7 @@ function MarkdownMessage({ content, theme }) {
1104
1147
  children
1105
1148
  }
1106
1149
  ),
1107
- h2: ({ children }) => /* @__PURE__ */ jsx3(
1150
+ h2: ({ children }) => /* @__PURE__ */ jsx4(
1108
1151
  "h2",
1109
1152
  {
1110
1153
  style: {
@@ -1114,7 +1157,7 @@ function MarkdownMessage({ content, theme }) {
1114
1157
  children
1115
1158
  }
1116
1159
  ),
1117
- h3: ({ children }) => /* @__PURE__ */ jsx3(
1160
+ h3: ({ children }) => /* @__PURE__ */ jsx4(
1118
1161
  "h3",
1119
1162
  {
1120
1163
  style: {
@@ -1124,8 +1167,8 @@ function MarkdownMessage({ content, theme }) {
1124
1167
  children
1125
1168
  }
1126
1169
  ),
1127
- h4: ({ children }) => /* @__PURE__ */ jsx3("h4", { style: { ...styles.heading, fontSize: "1em" }, children }),
1128
- h5: ({ children }) => /* @__PURE__ */ jsx3(
1170
+ h4: ({ children }) => /* @__PURE__ */ jsx4("h4", { style: { ...styles.heading, fontSize: "1em" }, children }),
1171
+ h5: ({ children }) => /* @__PURE__ */ jsx4(
1129
1172
  "h5",
1130
1173
  {
1131
1174
  style: {
@@ -1135,7 +1178,7 @@ function MarkdownMessage({ content, theme }) {
1135
1178
  children
1136
1179
  }
1137
1180
  ),
1138
- h6: ({ children }) => /* @__PURE__ */ jsx3(
1181
+ h6: ({ children }) => /* @__PURE__ */ jsx4(
1139
1182
  "h6",
1140
1183
  {
1141
1184
  style: {
@@ -1146,9 +1189,9 @@ function MarkdownMessage({ content, theme }) {
1146
1189
  }
1147
1190
  ),
1148
1191
  // Blockquote
1149
- blockquote: ({ children }) => /* @__PURE__ */ jsx3("blockquote", { style: styles.blockquote, children }),
1192
+ blockquote: ({ children }) => /* @__PURE__ */ jsx4("blockquote", { style: styles.blockquote, children }),
1150
1193
  // Horizontal rule
1151
- hr: () => /* @__PURE__ */ jsx3("hr", { style: styles.hr })
1194
+ hr: () => /* @__PURE__ */ jsx4("hr", { style: styles.hr })
1152
1195
  },
1153
1196
  children: content
1154
1197
  }
@@ -1156,7 +1199,7 @@ function MarkdownMessage({ content, theme }) {
1156
1199
  }
1157
1200
 
1158
1201
  // src/components/MessageItem.tsx
1159
- import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
1202
+ import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
1160
1203
  function MessageItem({
1161
1204
  message,
1162
1205
  currentUser,
@@ -1182,7 +1225,7 @@ function MessageItem({
1182
1225
  const textColor = theme?.text || (isLightTheme ? "#1a1a2e" : "#f7f7f8");
1183
1226
  const textMuted = theme?.textMuted || (isLightTheme ? "rgba(0,0,0,0.35)" : "rgba(247,247,248,0.35)");
1184
1227
  if (isSystemMessage) {
1185
- return /* @__PURE__ */ jsx4("div", { className: "flex justify-center my-3", children: /* @__PURE__ */ jsx4(
1228
+ return /* @__PURE__ */ jsx5("div", { className: "flex justify-center my-3", children: /* @__PURE__ */ jsx5(
1186
1229
  "div",
1187
1230
  {
1188
1231
  className: "px-4 py-1.5 rounded-full",
@@ -1190,7 +1233,7 @@ function MessageItem({
1190
1233
  backgroundColor: isLightTheme ? "rgba(0,0,0,0.04)" : "rgba(255,255,255,0.03)",
1191
1234
  boxShadow: isLightTheme ? "inset 0 0 0 1px rgba(0,0,0,0.06)" : "inset 0 0 0 0.5px rgba(255,255,255,0.06)"
1192
1235
  },
1193
- children: /* @__PURE__ */ jsx4(
1236
+ children: /* @__PURE__ */ jsx5(
1194
1237
  "p",
1195
1238
  {
1196
1239
  style: {
@@ -1229,12 +1272,12 @@ function MessageItem({
1229
1272
  borderRadius: "18px 18px 18px 4px",
1230
1273
  boxShadow: "inset 0 0 0 0.5px rgba(255,255,255,0.06), inset 0 1px 0 0 rgba(255,255,255,0.08)"
1231
1274
  };
1232
- return /* @__PURE__ */ jsxs3(
1275
+ return /* @__PURE__ */ jsxs4(
1233
1276
  "div",
1234
1277
  {
1235
1278
  className: `flex gap-2.5 mb-3 ${isOwnMessage ? "flex-row-reverse" : "flex-row"}`,
1236
1279
  children: [
1237
- showAvatar && !isOwnMessage && /* @__PURE__ */ jsx4("div", { className: "flex-shrink-0 mt-auto mb-5", children: isBotMessage || isAIMessage ? /* @__PURE__ */ jsx4(XcelsiorAvatar, { size: 28 }) : /* @__PURE__ */ jsx4(
1280
+ showAvatar && !isOwnMessage && /* @__PURE__ */ jsx5("div", { className: "flex-shrink-0 mt-auto mb-5", children: isBotMessage || isAIMessage ? /* @__PURE__ */ jsx5(XcelsiorAvatar, { size: 28 }) : /* @__PURE__ */ jsx5(
1238
1281
  "div",
1239
1282
  {
1240
1283
  className: "h-7 w-7 rounded-full flex items-center justify-center",
@@ -1242,7 +1285,7 @@ function MessageItem({
1242
1285
  background: isLightTheme ? `linear-gradient(135deg, ${primaryColor}30, rgba(0,0,0,0.04))` : `linear-gradient(135deg, ${primaryColor}60, rgba(255,255,255,0.06))`,
1243
1286
  boxShadow: isLightTheme ? "inset 0 0 0 1px rgba(0,0,0,0.08)" : "inset 0 0 0 0.5px rgba(255,255,255,0.1)"
1244
1287
  },
1245
- children: /* @__PURE__ */ jsxs3(
1288
+ children: /* @__PURE__ */ jsxs4(
1246
1289
  "svg",
1247
1290
  {
1248
1291
  width: "14",
@@ -1255,21 +1298,21 @@ function MessageItem({
1255
1298
  strokeLinejoin: "round",
1256
1299
  "aria-hidden": "true",
1257
1300
  children: [
1258
- /* @__PURE__ */ jsx4("title", { children: "Agent" }),
1259
- /* @__PURE__ */ jsx4("path", { d: "M3 18v-6a9 9 0 0 1 18 0v6" }),
1260
- /* @__PURE__ */ jsx4("path", { d: "M21 19a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3zM3 19a2 2 0 0 0 2 2h1a2 2 0 0 0 2-2v-3a2 2 0 0 0-2-2H3z" })
1301
+ /* @__PURE__ */ jsx5("title", { children: "Agent" }),
1302
+ /* @__PURE__ */ jsx5("path", { d: "M3 18v-6a9 9 0 0 1 18 0v6" }),
1303
+ /* @__PURE__ */ jsx5("path", { d: "M21 19a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3zM3 19a2 2 0 0 0 2 2h1a2 2 0 0 0 2-2v-3a2 2 0 0 0-2-2H3z" })
1261
1304
  ]
1262
1305
  }
1263
1306
  )
1264
1307
  }
1265
1308
  ) }),
1266
- showAvatar && isOwnMessage && /* @__PURE__ */ jsx4("div", { className: "w-7 flex-shrink-0" }),
1267
- /* @__PURE__ */ jsxs3(
1309
+ showAvatar && isOwnMessage && /* @__PURE__ */ jsx5("div", { className: "w-7 flex-shrink-0" }),
1310
+ /* @__PURE__ */ jsxs4(
1268
1311
  "div",
1269
1312
  {
1270
1313
  className: `flex flex-col max-w-[75%] ${isOwnMessage ? "items-end" : "items-start"}`,
1271
1314
  children: [
1272
- senderLabel && /* @__PURE__ */ jsx4(
1315
+ senderLabel && /* @__PURE__ */ jsx5(
1273
1316
  "span",
1274
1317
  {
1275
1318
  className: "mb-1 px-1 font-medium",
@@ -1281,7 +1324,7 @@ function MessageItem({
1281
1324
  children: senderLabel
1282
1325
  }
1283
1326
  ),
1284
- /* @__PURE__ */ jsxs3(
1327
+ /* @__PURE__ */ jsxs4(
1285
1328
  "div",
1286
1329
  {
1287
1330
  className: "px-4 py-2.5",
@@ -1294,12 +1337,12 @@ function MessageItem({
1294
1337
  children: [
1295
1338
  message.messageType === "text" && (isOwnMessage ? (
1296
1339
  // User messages: plain text — no markdown parsing
1297
- /* @__PURE__ */ jsx4("span", { style: { whiteSpace: "pre-wrap", wordBreak: "break-word" }, children: message.content })
1340
+ /* @__PURE__ */ jsx5("span", { style: { whiteSpace: "pre-wrap", wordBreak: "break-word" }, children: message.content })
1298
1341
  ) : (
1299
1342
  // Bot / agent messages: full markdown rendering
1300
- /* @__PURE__ */ jsx4(MarkdownMessage, { content: message.content, theme })
1343
+ /* @__PURE__ */ jsx5(MarkdownMessage, { content: message.content, theme })
1301
1344
  )),
1302
- message.messageType === "image" && /* @__PURE__ */ jsx4("div", { children: /* @__PURE__ */ jsx4(
1345
+ message.messageType === "image" && /* @__PURE__ */ jsx5("div", { children: /* @__PURE__ */ jsx5(
1303
1346
  "img",
1304
1347
  {
1305
1348
  src: message.content,
@@ -1308,8 +1351,8 @@ function MessageItem({
1308
1351
  loading: "lazy"
1309
1352
  }
1310
1353
  ) }),
1311
- message.messageType === "file" && /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2", children: [
1312
- /* @__PURE__ */ jsxs3(
1354
+ message.messageType === "file" && /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
1355
+ /* @__PURE__ */ jsxs4(
1313
1356
  "svg",
1314
1357
  {
1315
1358
  width: "18",
@@ -1322,12 +1365,12 @@ function MessageItem({
1322
1365
  strokeLinejoin: "round",
1323
1366
  "aria-hidden": "true",
1324
1367
  children: [
1325
- /* @__PURE__ */ jsx4("title", { children: "File" }),
1326
- /* @__PURE__ */ jsx4("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 01-8.49-8.49l9.19-9.19a4 4 0 015.66 5.66l-9.2 9.19a2 2 0 01-2.83-2.83l8.49-8.48" })
1368
+ /* @__PURE__ */ jsx5("title", { children: "File" }),
1369
+ /* @__PURE__ */ jsx5("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 01-8.49-8.49l9.19-9.19a4 4 0 015.66 5.66l-9.2 9.19a2 2 0 01-2.83-2.83l8.49-8.48" })
1327
1370
  ]
1328
1371
  }
1329
1372
  ),
1330
- /* @__PURE__ */ jsx4(
1373
+ /* @__PURE__ */ jsx5(
1331
1374
  "a",
1332
1375
  {
1333
1376
  href: message.content,
@@ -1345,12 +1388,12 @@ function MessageItem({
1345
1388
  ]
1346
1389
  }
1347
1390
  ),
1348
- showTimestamp && /* @__PURE__ */ jsxs3(
1391
+ showTimestamp && /* @__PURE__ */ jsxs4(
1349
1392
  "div",
1350
1393
  {
1351
1394
  className: `flex items-center gap-1.5 mt-1 px-1 ${isOwnMessage ? "flex-row-reverse" : "flex-row"}`,
1352
1395
  children: [
1353
- /* @__PURE__ */ jsx4(
1396
+ /* @__PURE__ */ jsx5(
1354
1397
  "span",
1355
1398
  {
1356
1399
  style: {
@@ -1363,8 +1406,8 @@ function MessageItem({
1363
1406
  })
1364
1407
  }
1365
1408
  ),
1366
- isOwnMessage && message.status && /* @__PURE__ */ jsxs3("span", { style: { color: textMuted }, children: [
1367
- message.status === "sent" && /* @__PURE__ */ jsxs3(
1409
+ isOwnMessage && message.status && /* @__PURE__ */ jsxs4("span", { style: { color: textMuted }, children: [
1410
+ message.status === "sent" && /* @__PURE__ */ jsxs4(
1368
1411
  "svg",
1369
1412
  {
1370
1413
  width: "14",
@@ -1377,12 +1420,12 @@ function MessageItem({
1377
1420
  strokeLinejoin: "round",
1378
1421
  "aria-hidden": "true",
1379
1422
  children: [
1380
- /* @__PURE__ */ jsx4("title", { children: "Sent" }),
1381
- /* @__PURE__ */ jsx4("polyline", { points: "20 6 9 17 4 12" })
1423
+ /* @__PURE__ */ jsx5("title", { children: "Sent" }),
1424
+ /* @__PURE__ */ jsx5("polyline", { points: "20 6 9 17 4 12" })
1382
1425
  ]
1383
1426
  }
1384
1427
  ),
1385
- message.status === "delivered" && /* @__PURE__ */ jsxs3(
1428
+ message.status === "delivered" && /* @__PURE__ */ jsxs4(
1386
1429
  "svg",
1387
1430
  {
1388
1431
  width: "14",
@@ -1395,13 +1438,13 @@ function MessageItem({
1395
1438
  strokeLinejoin: "round",
1396
1439
  "aria-hidden": "true",
1397
1440
  children: [
1398
- /* @__PURE__ */ jsx4("title", { children: "Delivered" }),
1399
- /* @__PURE__ */ jsx4("polyline", { points: "18 6 7 17 2 12" }),
1400
- /* @__PURE__ */ jsx4("polyline", { points: "22 6 11 17" })
1441
+ /* @__PURE__ */ jsx5("title", { children: "Delivered" }),
1442
+ /* @__PURE__ */ jsx5("polyline", { points: "18 6 7 17 2 12" }),
1443
+ /* @__PURE__ */ jsx5("polyline", { points: "22 6 11 17" })
1401
1444
  ]
1402
1445
  }
1403
1446
  ),
1404
- message.status === "read" && /* @__PURE__ */ jsxs3(
1447
+ message.status === "read" && /* @__PURE__ */ jsxs4(
1405
1448
  "svg",
1406
1449
  {
1407
1450
  width: "14",
@@ -1414,9 +1457,9 @@ function MessageItem({
1414
1457
  strokeLinejoin: "round",
1415
1458
  "aria-hidden": "true",
1416
1459
  children: [
1417
- /* @__PURE__ */ jsx4("title", { children: "Read" }),
1418
- /* @__PURE__ */ jsx4("polyline", { points: "18 6 7 17 2 12" }),
1419
- /* @__PURE__ */ jsx4("polyline", { points: "22 6 11 17" })
1460
+ /* @__PURE__ */ jsx5("title", { children: "Read" }),
1461
+ /* @__PURE__ */ jsx5("polyline", { points: "18 6 7 17 2 12" }),
1462
+ /* @__PURE__ */ jsx5("polyline", { points: "22 6 11 17" })
1420
1463
  ]
1421
1464
  }
1422
1465
  )
@@ -1434,7 +1477,7 @@ function MessageItem({
1434
1477
 
1435
1478
  // src/components/ThinkingIndicator.tsx
1436
1479
  import { useEffect as useEffect5, useRef as useRef3, useState as useState6 } from "react";
1437
- import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
1480
+ import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
1438
1481
  var PHRASE_POOLS = {
1439
1482
  // ── Greetings & small talk ──
1440
1483
  greeting: [
@@ -1653,7 +1696,7 @@ function ThinkingIndicator({
1653
1696
  }
1654
1697
  return () => clearTimeout(timeout);
1655
1698
  }, [displayText, isDeleting, phraseIndex]);
1656
- return /* @__PURE__ */ jsxs4(
1699
+ return /* @__PURE__ */ jsxs5(
1657
1700
  "div",
1658
1701
  {
1659
1702
  className: "flex gap-2.5 mb-3",
@@ -1661,8 +1704,8 @@ function ThinkingIndicator({
1661
1704
  "aria-live": "polite",
1662
1705
  "aria-label": "Xcelsior is thinking",
1663
1706
  children: [
1664
- showAvatar && /* @__PURE__ */ jsx5("div", { className: "flex-shrink-0 mt-auto mb-5", children: /* @__PURE__ */ jsx5(XcelsiorAvatar, { size: 28 }) }),
1665
- /* @__PURE__ */ jsx5("div", { className: "flex flex-col items-start", children: /* @__PURE__ */ jsx5(
1707
+ showAvatar && /* @__PURE__ */ jsx6("div", { className: "flex-shrink-0 mt-auto mb-5", children: /* @__PURE__ */ jsx6(XcelsiorAvatar, { size: 28 }) }),
1708
+ /* @__PURE__ */ jsx6("div", { className: "flex flex-col items-start", children: /* @__PURE__ */ jsx6(
1666
1709
  "div",
1667
1710
  {
1668
1711
  style: {
@@ -1672,8 +1715,8 @@ function ThinkingIndicator({
1672
1715
  padding: "12px 16px",
1673
1716
  minWidth: 160
1674
1717
  },
1675
- children: /* @__PURE__ */ jsxs4("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
1676
- /* @__PURE__ */ jsx5("div", { style: { display: "flex", gap: 4, alignItems: "center" }, children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx5(
1718
+ children: /* @__PURE__ */ jsxs5("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
1719
+ /* @__PURE__ */ jsx6("div", { style: { display: "flex", gap: 4, alignItems: "center" }, children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx6(
1677
1720
  "span",
1678
1721
  {
1679
1722
  style: {
@@ -1687,7 +1730,7 @@ function ThinkingIndicator({
1687
1730
  },
1688
1731
  i
1689
1732
  )) }),
1690
- /* @__PURE__ */ jsxs4(
1733
+ /* @__PURE__ */ jsxs5(
1691
1734
  "span",
1692
1735
  {
1693
1736
  style: {
@@ -1698,7 +1741,7 @@ function ThinkingIndicator({
1698
1741
  },
1699
1742
  children: [
1700
1743
  displayText,
1701
- /* @__PURE__ */ jsx5(
1744
+ /* @__PURE__ */ jsx6(
1702
1745
  "span",
1703
1746
  {
1704
1747
  style: {
@@ -1724,7 +1767,7 @@ function ThinkingIndicator({
1724
1767
  }
1725
1768
 
1726
1769
  // src/components/MessageList.tsx
1727
- import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
1770
+ import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
1728
1771
  function MessageList({
1729
1772
  messages,
1730
1773
  currentUser,
@@ -1805,11 +1848,11 @@ function MessageList({
1805
1848
  return () => container.removeEventListener("scroll", handleScroll);
1806
1849
  }, [handleScroll]);
1807
1850
  if (isLoading) {
1808
- return /* @__PURE__ */ jsx6("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsx6(Spinner, { size: "lg" }) });
1851
+ return /* @__PURE__ */ jsx7("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsx7(Spinner, { size: "lg" }) });
1809
1852
  }
1810
1853
  if (messages.length === 0) {
1811
- return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col items-center justify-center h-full text-center", style: { padding: "40px 32px" }, children: [
1812
- /* @__PURE__ */ jsx6(
1854
+ return /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center justify-center h-full text-center", style: { padding: "40px 32px" }, children: [
1855
+ /* @__PURE__ */ jsx7(
1813
1856
  "h3",
1814
1857
  {
1815
1858
  className: "font-semibold mb-2",
@@ -1821,7 +1864,7 @@ function MessageList({
1821
1864
  children: "How can we help?"
1822
1865
  }
1823
1866
  ),
1824
- /* @__PURE__ */ jsx6(
1867
+ /* @__PURE__ */ jsx7(
1825
1868
  "p",
1826
1869
  {
1827
1870
  className: "max-w-[240px]",
@@ -1835,11 +1878,11 @@ function MessageList({
1835
1878
  children: "Ask us anything. We are here to help you get the most out of Xcelsior."
1836
1879
  }
1837
1880
  ),
1838
- /* @__PURE__ */ jsx6("div", { className: "flex flex-wrap justify-center gap-2", children: [
1881
+ /* @__PURE__ */ jsx7("div", { className: "flex flex-wrap justify-center gap-2", children: [
1839
1882
  { label: "Our services", message: "What services does Xcelsior offer?" },
1840
1883
  { label: "Get a quote", message: "I would like to get a quote for a project" },
1841
1884
  { label: "Support", message: "I need help with something" }
1842
- ].map((action) => /* @__PURE__ */ jsx6(
1885
+ ].map((action) => /* @__PURE__ */ jsx7(
1843
1886
  "button",
1844
1887
  {
1845
1888
  type: "button",
@@ -1871,14 +1914,14 @@ function MessageList({
1871
1914
  )) })
1872
1915
  ] });
1873
1916
  }
1874
- return /* @__PURE__ */ jsxs5(
1917
+ return /* @__PURE__ */ jsxs6(
1875
1918
  "div",
1876
1919
  {
1877
1920
  ref: containerRef,
1878
1921
  className: "flex-1 overflow-y-auto px-4 py-3",
1879
1922
  style: { scrollBehavior: "smooth" },
1880
1923
  children: [
1881
- /* @__PURE__ */ jsx6("style", { children: `
1924
+ /* @__PURE__ */ jsx7("style", { children: `
1882
1925
  @keyframes thinkingPulse {
1883
1926
  0%, 60%, 100% { opacity: 0.3; transform: scale(0.8); }
1884
1927
  30% { opacity: 1; transform: scale(1); }
@@ -1888,9 +1931,9 @@ function MessageList({
1888
1931
  50% { opacity: 0; }
1889
1932
  }
1890
1933
  ` }),
1891
- isLoadingMore && /* @__PURE__ */ jsx6("div", { className: "flex justify-center py-3", children: /* @__PURE__ */ jsx6(Spinner, { size: "sm" }) }),
1892
- /* @__PURE__ */ jsx6("div", { ref: loadMoreTriggerRef }),
1893
- messages.map((message) => /* @__PURE__ */ jsx6(
1934
+ isLoadingMore && /* @__PURE__ */ jsx7("div", { className: "flex justify-center py-3", children: /* @__PURE__ */ jsx7(Spinner, { size: "sm" }) }),
1935
+ /* @__PURE__ */ jsx7("div", { ref: loadMoreTriggerRef }),
1936
+ messages.map((message) => /* @__PURE__ */ jsx7(
1894
1937
  MessageItem,
1895
1938
  {
1896
1939
  message,
@@ -1901,10 +1944,10 @@ function MessageList({
1901
1944
  },
1902
1945
  message.id
1903
1946
  )),
1904
- isTyping && /* @__PURE__ */ jsxs5("div", { className: "flex gap-2.5 mb-3", children: [
1905
- /* @__PURE__ */ jsx6("div", { className: "flex-shrink-0 mt-auto mb-5", children: /* @__PURE__ */ jsx6(XcelsiorAvatar, { size: 28 }) }),
1906
- /* @__PURE__ */ jsxs5("div", { className: "flex flex-col items-start", children: [
1907
- /* @__PURE__ */ jsx6(
1947
+ isTyping && /* @__PURE__ */ jsxs6("div", { className: "flex gap-2.5 mb-3", children: [
1948
+ /* @__PURE__ */ jsx7("div", { className: "flex-shrink-0 mt-auto mb-5", children: /* @__PURE__ */ jsx7(XcelsiorAvatar, { size: 28 }) }),
1949
+ /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-start", children: [
1950
+ /* @__PURE__ */ jsx7(
1908
1951
  "div",
1909
1952
  {
1910
1953
  className: "px-4 py-3",
@@ -1913,7 +1956,7 @@ function MessageList({
1913
1956
  borderRadius: "18px 18px 18px 4px",
1914
1957
  boxShadow: isLightTheme ? "inset 0 0 0 1px rgba(0,0,0,0.06)" : "inset 0 0 0 0.5px rgba(255,255,255,0.06), inset 0 1px 0 0 rgba(255,255,255,0.08)"
1915
1958
  },
1916
- children: /* @__PURE__ */ jsx6("div", { className: "flex gap-1.5 items-center", style: { height: 16 }, children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx6(
1959
+ children: /* @__PURE__ */ jsx7("div", { className: "flex gap-1.5 items-center", style: { height: 16 }, children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx7(
1917
1960
  "span",
1918
1961
  {
1919
1962
  className: "rounded-full animate-bounce",
@@ -1929,7 +1972,7 @@ function MessageList({
1929
1972
  )) })
1930
1973
  }
1931
1974
  ),
1932
- typingUser && /* @__PURE__ */ jsxs5(
1975
+ typingUser && /* @__PURE__ */ jsxs6(
1933
1976
  "span",
1934
1977
  {
1935
1978
  className: "mt-1 px-1",
@@ -1946,14 +1989,14 @@ function MessageList({
1946
1989
  )
1947
1990
  ] })
1948
1991
  ] }),
1949
- isBotThinking && !isTyping && /* @__PURE__ */ jsx6(
1992
+ isBotThinking && !isTyping && /* @__PURE__ */ jsx7(
1950
1993
  ThinkingIndicator,
1951
1994
  {
1952
1995
  theme,
1953
1996
  lastUserMessage: messages.filter((m) => m.senderType === "customer").pop()?.content
1954
1997
  }
1955
1998
  ),
1956
- /* @__PURE__ */ jsx6("div", { ref: messagesEndRef })
1999
+ /* @__PURE__ */ jsx7("div", { ref: messagesEndRef })
1957
2000
  ]
1958
2001
  }
1959
2002
  );
@@ -1963,7 +2006,7 @@ function MessageList({
1963
2006
  import { useEffect as useEffect7, useRef as useRef5, useState as useState7 } from "react";
1964
2007
  import { createPortal } from "react-dom";
1965
2008
  import Picker from "@emoji-mart/react";
1966
- import { Fragment, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
2009
+ import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
1967
2010
  function isLightColor(color) {
1968
2011
  let r = 0, g = 0, b = 0;
1969
2012
  if (color.startsWith("#")) {
@@ -2141,7 +2184,7 @@ ${uploadedFile.markdown}
2141
2184
  };
2142
2185
  const canSend = message.trim().length > 0 && !disabled;
2143
2186
  const placeholderColor = isLightTheme ? "rgba(0,0,0,0.35)" : "rgba(247,247,248,0.3)";
2144
- return /* @__PURE__ */ jsxs6(
2187
+ return /* @__PURE__ */ jsxs7(
2145
2188
  "div",
2146
2189
  {
2147
2190
  className: "px-4 py-3",
@@ -2149,7 +2192,7 @@ ${uploadedFile.markdown}
2149
2192
  borderTop: isLightTheme ? "1px solid rgba(0,0,0,0.06)" : "1px solid rgba(255,255,255,0.06)"
2150
2193
  },
2151
2194
  children: [
2152
- /* @__PURE__ */ jsxs6(
2195
+ /* @__PURE__ */ jsxs7(
2153
2196
  "div",
2154
2197
  {
2155
2198
  className: "relative flex items-center rounded-full transition-all duration-200",
@@ -2161,8 +2204,8 @@ ${uploadedFile.markdown}
2161
2204
  backdropFilter: "blur(32px)"
2162
2205
  },
2163
2206
  children: [
2164
- /* @__PURE__ */ jsx7("style", { children: `.xchat-input::placeholder { color: ${placeholderColor}; }` }),
2165
- /* @__PURE__ */ jsx7(
2207
+ /* @__PURE__ */ jsx8("style", { children: `.xchat-input::placeholder { color: ${placeholderColor}; }` }),
2208
+ /* @__PURE__ */ jsx8(
2166
2209
  "textarea",
2167
2210
  {
2168
2211
  ref: textAreaRef,
@@ -2191,8 +2234,8 @@ ${uploadedFile.markdown}
2191
2234
  disabled
2192
2235
  }
2193
2236
  ),
2194
- /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-1 px-2 shrink-0", children: [
2195
- enableEmoji && /* @__PURE__ */ jsx7(
2237
+ /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-1 px-2 shrink-0", children: [
2238
+ enableEmoji && /* @__PURE__ */ jsx8(
2196
2239
  "button",
2197
2240
  {
2198
2241
  ref: emojiButtonRef,
@@ -2222,7 +2265,7 @@ ${uploadedFile.markdown}
2222
2265
  },
2223
2266
  disabled,
2224
2267
  "aria-label": "Add emoji",
2225
- children: /* @__PURE__ */ jsxs6(
2268
+ children: /* @__PURE__ */ jsxs7(
2226
2269
  "svg",
2227
2270
  {
2228
2271
  width: "18",
@@ -2235,18 +2278,18 @@ ${uploadedFile.markdown}
2235
2278
  strokeLinejoin: "round",
2236
2279
  "aria-hidden": "true",
2237
2280
  children: [
2238
- /* @__PURE__ */ jsx7("title", { children: "Emoji" }),
2239
- /* @__PURE__ */ jsx7("circle", { cx: "12", cy: "12", r: "10" }),
2240
- /* @__PURE__ */ jsx7("path", { d: "M8 14s1.5 2 4 2 4-2 4-2" }),
2241
- /* @__PURE__ */ jsx7("line", { x1: "9", y1: "9", x2: "9.01", y2: "9" }),
2242
- /* @__PURE__ */ jsx7("line", { x1: "15", y1: "9", x2: "15.01", y2: "9" })
2281
+ /* @__PURE__ */ jsx8("title", { children: "Emoji" }),
2282
+ /* @__PURE__ */ jsx8("circle", { cx: "12", cy: "12", r: "10" }),
2283
+ /* @__PURE__ */ jsx8("path", { d: "M8 14s1.5 2 4 2 4-2 4-2" }),
2284
+ /* @__PURE__ */ jsx8("line", { x1: "9", y1: "9", x2: "9.01", y2: "9" }),
2285
+ /* @__PURE__ */ jsx8("line", { x1: "15", y1: "9", x2: "15.01", y2: "9" })
2243
2286
  ]
2244
2287
  }
2245
2288
  )
2246
2289
  }
2247
2290
  ),
2248
- enableFileUpload && fileUpload.canUpload && /* @__PURE__ */ jsxs6(Fragment, { children: [
2249
- /* @__PURE__ */ jsx7(
2291
+ enableFileUpload && fileUpload.canUpload && /* @__PURE__ */ jsxs7(Fragment2, { children: [
2292
+ /* @__PURE__ */ jsx8(
2250
2293
  "button",
2251
2294
  {
2252
2295
  type: "button",
@@ -2266,7 +2309,7 @@ ${uploadedFile.markdown}
2266
2309
  },
2267
2310
  disabled: disabled || fileUpload.isUploading,
2268
2311
  "aria-label": "Attach file",
2269
- children: fileUpload.isUploading ? /* @__PURE__ */ jsxs6(
2312
+ children: fileUpload.isUploading ? /* @__PURE__ */ jsxs7(
2270
2313
  "svg",
2271
2314
  {
2272
2315
  width: "18",
@@ -2278,11 +2321,11 @@ ${uploadedFile.markdown}
2278
2321
  className: "animate-spin",
2279
2322
  "aria-hidden": "true",
2280
2323
  children: [
2281
- /* @__PURE__ */ jsx7("title", { children: "Uploading" }),
2282
- /* @__PURE__ */ jsx7("path", { d: "M21 12a9 9 0 11-6.219-8.56" })
2324
+ /* @__PURE__ */ jsx8("title", { children: "Uploading" }),
2325
+ /* @__PURE__ */ jsx8("path", { d: "M21 12a9 9 0 11-6.219-8.56" })
2283
2326
  ]
2284
2327
  }
2285
- ) : /* @__PURE__ */ jsxs6(
2328
+ ) : /* @__PURE__ */ jsxs7(
2286
2329
  "svg",
2287
2330
  {
2288
2331
  width: "18",
@@ -2295,14 +2338,14 @@ ${uploadedFile.markdown}
2295
2338
  strokeLinejoin: "round",
2296
2339
  "aria-hidden": "true",
2297
2340
  children: [
2298
- /* @__PURE__ */ jsx7("title", { children: "Attach file" }),
2299
- /* @__PURE__ */ jsx7("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 01-8.49-8.49l9.19-9.19a4 4 0 015.66 5.66l-9.2 9.19a2 2 0 01-2.83-2.83l8.49-8.48" })
2341
+ /* @__PURE__ */ jsx8("title", { children: "Attach file" }),
2342
+ /* @__PURE__ */ jsx8("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 01-8.49-8.49l9.19-9.19a4 4 0 015.66 5.66l-9.2 9.19a2 2 0 01-2.83-2.83l8.49-8.48" })
2300
2343
  ]
2301
2344
  }
2302
2345
  )
2303
2346
  }
2304
2347
  ),
2305
- /* @__PURE__ */ jsx7(
2348
+ /* @__PURE__ */ jsx8(
2306
2349
  "input",
2307
2350
  {
2308
2351
  ref: fileInputRef,
@@ -2313,7 +2356,7 @@ ${uploadedFile.markdown}
2313
2356
  }
2314
2357
  )
2315
2358
  ] }),
2316
- /* @__PURE__ */ jsx7(
2359
+ /* @__PURE__ */ jsx8(
2317
2360
  "button",
2318
2361
  {
2319
2362
  type: "button",
@@ -2328,7 +2371,7 @@ ${uploadedFile.markdown}
2328
2371
  boxShadow: canSend ? `0 2px 8px -2px ${primaryColor}60` : "none"
2329
2372
  },
2330
2373
  "aria-label": "Send message",
2331
- children: /* @__PURE__ */ jsxs6(
2374
+ children: /* @__PURE__ */ jsxs7(
2332
2375
  "svg",
2333
2376
  {
2334
2377
  width: "18",
@@ -2341,9 +2384,9 @@ ${uploadedFile.markdown}
2341
2384
  strokeLinejoin: "round",
2342
2385
  "aria-hidden": "true",
2343
2386
  children: [
2344
- /* @__PURE__ */ jsx7("title", { children: "Send" }),
2345
- /* @__PURE__ */ jsx7("line", { x1: "22", y1: "2", x2: "11", y2: "13" }),
2346
- /* @__PURE__ */ jsx7("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })
2387
+ /* @__PURE__ */ jsx8("title", { children: "Send" }),
2388
+ /* @__PURE__ */ jsx8("line", { x1: "22", y1: "2", x2: "11", y2: "13" }),
2389
+ /* @__PURE__ */ jsx8("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })
2347
2390
  ]
2348
2391
  }
2349
2392
  )
@@ -2353,8 +2396,8 @@ ${uploadedFile.markdown}
2353
2396
  ]
2354
2397
  }
2355
2398
  ),
2356
- fileUpload.isUploading && /* @__PURE__ */ jsxs6("div", { className: "mt-2 px-1", children: [
2357
- /* @__PURE__ */ jsx7(
2399
+ fileUpload.isUploading && /* @__PURE__ */ jsxs7("div", { className: "mt-2 px-1", children: [
2400
+ /* @__PURE__ */ jsx8(
2358
2401
  "div",
2359
2402
  {
2360
2403
  className: "w-full rounded-full overflow-hidden",
@@ -2362,7 +2405,7 @@ ${uploadedFile.markdown}
2362
2405
  height: 3,
2363
2406
  backgroundColor: isLightTheme ? "rgba(0,0,0,0.06)" : "rgba(255,255,255,0.06)"
2364
2407
  },
2365
- children: /* @__PURE__ */ jsx7(
2408
+ children: /* @__PURE__ */ jsx8(
2366
2409
  "div",
2367
2410
  {
2368
2411
  className: "h-full rounded-full transition-all duration-300",
@@ -2374,7 +2417,7 @@ ${uploadedFile.markdown}
2374
2417
  )
2375
2418
  }
2376
2419
  ),
2377
- /* @__PURE__ */ jsxs6(
2420
+ /* @__PURE__ */ jsxs7(
2378
2421
  "p",
2379
2422
  {
2380
2423
  className: "mt-1",
@@ -2392,7 +2435,7 @@ ${uploadedFile.markdown}
2392
2435
  )
2393
2436
  ] }),
2394
2437
  showEmojiPicker && emojiData && emojiPickerPosition && typeof document !== "undefined" && createPortal(
2395
- /* @__PURE__ */ jsx7(
2438
+ /* @__PURE__ */ jsx8(
2396
2439
  "div",
2397
2440
  {
2398
2441
  ref: emojiPickerRef,
@@ -2407,7 +2450,7 @@ ${uploadedFile.markdown}
2407
2450
  "0 16px 48px -8px rgba(0,0,0,0.5)"
2408
2451
  ].join(", ")
2409
2452
  },
2410
- children: /* @__PURE__ */ jsx7(
2453
+ children: /* @__PURE__ */ jsx8(
2411
2454
  Picker,
2412
2455
  {
2413
2456
  data: emojiData,
@@ -2433,7 +2476,7 @@ ${uploadedFile.markdown}
2433
2476
  }
2434
2477
 
2435
2478
  // src/components/ChatWidget.tsx
2436
- import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
2479
+ import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
2437
2480
  function getAnonymousUser() {
2438
2481
  let anonId;
2439
2482
  try {
@@ -2567,14 +2610,14 @@ function ChatWidget({
2567
2610
  outlineOffset: -1,
2568
2611
  transition: "outline 150ms ease"
2569
2612
  };
2570
- return /* @__PURE__ */ jsxs7(
2613
+ return /* @__PURE__ */ jsxs8(
2571
2614
  "div",
2572
2615
  {
2573
2616
  className: isFullPage ? `flex flex-col h-full ${className}` : `fixed bottom-20 ${positionClass} z-50 flex flex-col overflow-hidden ${className}`,
2574
2617
  style: { ...containerStyle, ...dotGridBg, ...edgeHintStyle },
2575
2618
  ...!isFullPage ? containerResizeProps : {},
2576
2619
  children: [
2577
- !isFullPage && /* @__PURE__ */ jsx8(
2620
+ !isFullPage && /* @__PURE__ */ jsx9(
2578
2621
  ChatHeader,
2579
2622
  {
2580
2623
  agent: effectiveUser.type === "customer" ? {
@@ -2588,7 +2631,7 @@ function ChatWidget({
2588
2631
  theme: config.theme
2589
2632
  }
2590
2633
  ),
2591
- !websocket.isConnected && /* @__PURE__ */ jsx8(
2634
+ !websocket.isConnected && /* @__PURE__ */ jsx9(
2592
2635
  "div",
2593
2636
  {
2594
2637
  className: "px-4 py-2",
@@ -2596,15 +2639,15 @@ function ChatWidget({
2596
2639
  backgroundColor: isLightTheme ? "rgba(255,169,56,0.08)" : "rgba(255,169,56,0.06)",
2597
2640
  borderBottom: `1px solid rgba(255,169,56,${isLightTheme ? "0.15" : "0.12"})`
2598
2641
  },
2599
- children: /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2", children: [
2600
- /* @__PURE__ */ jsx8(
2642
+ children: /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-2", children: [
2643
+ /* @__PURE__ */ jsx9(
2601
2644
  "div",
2602
2645
  {
2603
2646
  className: "w-1.5 h-1.5 rounded-full animate-pulse",
2604
2647
  style: { backgroundColor: config.theme?.statusCaution || "#ffa938" }
2605
2648
  }
2606
2649
  ),
2607
- /* @__PURE__ */ jsx8(
2650
+ /* @__PURE__ */ jsx9(
2608
2651
  "span",
2609
2652
  {
2610
2653
  style: {
@@ -2615,7 +2658,7 @@ function ChatWidget({
2615
2658
  children: "Reconnecting..."
2616
2659
  }
2617
2660
  ),
2618
- /* @__PURE__ */ jsx8(
2661
+ /* @__PURE__ */ jsx9(
2619
2662
  "button",
2620
2663
  {
2621
2664
  type: "button",
@@ -2639,8 +2682,8 @@ function ChatWidget({
2639
2682
  ] })
2640
2683
  }
2641
2684
  ),
2642
- isLoading ? /* @__PURE__ */ jsx8("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxs7("div", { className: "text-center", children: [
2643
- /* @__PURE__ */ jsx8(
2685
+ isLoading ? /* @__PURE__ */ jsx9("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxs8("div", { className: "text-center", children: [
2686
+ /* @__PURE__ */ jsx9(
2644
2687
  "div",
2645
2688
  {
2646
2689
  className: "w-7 h-7 border-2 border-t-transparent rounded-full animate-spin mx-auto mb-3",
@@ -2650,7 +2693,7 @@ function ChatWidget({
2650
2693
  }
2651
2694
  }
2652
2695
  ),
2653
- /* @__PURE__ */ jsx8(
2696
+ /* @__PURE__ */ jsx9(
2654
2697
  "p",
2655
2698
  {
2656
2699
  style: {
@@ -2661,7 +2704,7 @@ function ChatWidget({
2661
2704
  children: "Loading messages..."
2662
2705
  }
2663
2706
  )
2664
- ] }) }) : /* @__PURE__ */ jsx8(
2707
+ ] }) }) : /* @__PURE__ */ jsx9(
2665
2708
  MessageList,
2666
2709
  {
2667
2710
  messages,
@@ -2677,7 +2720,7 @@ function ChatWidget({
2677
2720
  isBotThinking
2678
2721
  }
2679
2722
  ),
2680
- /* @__PURE__ */ jsx8(
2723
+ /* @__PURE__ */ jsx9(
2681
2724
  ChatInput,
2682
2725
  {
2683
2726
  onSend: handleSendMessage,
@@ -2687,7 +2730,7 @@ function ChatWidget({
2687
2730
  disabled: !websocket.isConnected
2688
2731
  }
2689
2732
  ),
2690
- !isFullPage && /* @__PURE__ */ jsx8(
2733
+ !isFullPage && /* @__PURE__ */ jsx9(
2691
2734
  "div",
2692
2735
  {
2693
2736
  className: "px-4 py-1.5 text-center",
@@ -2695,7 +2738,7 @@ function ChatWidget({
2695
2738
  borderTop: isLightTheme ? "1px solid rgba(0,0,0,0.06)" : "1px solid rgba(255,255,255,0.06)",
2696
2739
  backgroundColor: isLightTheme ? "rgba(0,0,0,0.03)" : "rgba(0,0,0,0.2)"
2697
2740
  },
2698
- children: /* @__PURE__ */ jsxs7(
2741
+ children: /* @__PURE__ */ jsxs8(
2699
2742
  "p",
2700
2743
  {
2701
2744
  style: {
@@ -2706,7 +2749,7 @@ function ChatWidget({
2706
2749
  children: [
2707
2750
  "Powered by",
2708
2751
  " ",
2709
- /* @__PURE__ */ jsx8("span", { style: {
2752
+ /* @__PURE__ */ jsx9("span", { style: {
2710
2753
  fontWeight: 600,
2711
2754
  color: isLightTheme ? "rgba(0,0,0,0.5)" : "rgba(247,247,248,0.45)"
2712
2755
  }, children: "Xcelsior" })
@@ -2725,7 +2768,7 @@ import { useCallback as useCallback8, useEffect as useEffect10, useState as useS
2725
2768
 
2726
2769
  // src/components/PreChatForm.tsx
2727
2770
  import { useState as useState8 } from "react";
2728
- import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
2771
+ import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
2729
2772
  function PreChatForm({
2730
2773
  onSubmit,
2731
2774
  className = "",
@@ -2786,7 +2829,7 @@ function PreChatForm({
2786
2829
  transition: "box-shadow 0.2s ease",
2787
2830
  caretColor: "#337eff"
2788
2831
  });
2789
- return /* @__PURE__ */ jsxs8(
2832
+ return /* @__PURE__ */ jsxs9(
2790
2833
  "div",
2791
2834
  {
2792
2835
  className: `fixed bottom-4 right-4 z-50 flex flex-col overflow-hidden ${className}`,
@@ -2806,7 +2849,7 @@ function PreChatForm({
2806
2849
  backgroundSize: "24px 24px"
2807
2850
  },
2808
2851
  children: [
2809
- /* @__PURE__ */ jsxs8(
2852
+ /* @__PURE__ */ jsxs9(
2810
2853
  "div",
2811
2854
  {
2812
2855
  className: "relative text-white overflow-hidden",
@@ -2814,7 +2857,7 @@ function PreChatForm({
2814
2857
  background: "linear-gradient(135deg, #337eff 0%, #005eff 50%, #001a66 100%)"
2815
2858
  },
2816
2859
  children: [
2817
- /* @__PURE__ */ jsx9(
2860
+ /* @__PURE__ */ jsx10(
2818
2861
  "div",
2819
2862
  {
2820
2863
  className: "absolute inset-0 pointer-events-none",
@@ -2823,9 +2866,9 @@ function PreChatForm({
2823
2866
  }
2824
2867
  }
2825
2868
  ),
2826
- /* @__PURE__ */ jsx9("div", { className: "relative px-5 py-4", children: /* @__PURE__ */ jsxs8("div", { className: "flex items-start justify-between", children: [
2827
- /* @__PURE__ */ jsxs8("div", { className: "flex-1", children: [
2828
- /* @__PURE__ */ jsx9(
2869
+ /* @__PURE__ */ jsx10("div", { className: "relative px-5 py-4", children: /* @__PURE__ */ jsxs9("div", { className: "flex items-start justify-between", children: [
2870
+ /* @__PURE__ */ jsxs9("div", { className: "flex-1", children: [
2871
+ /* @__PURE__ */ jsx10(
2829
2872
  "h2",
2830
2873
  {
2831
2874
  className: "font-semibold",
@@ -2836,7 +2879,7 @@ function PreChatForm({
2836
2879
  children: "Start a Conversation"
2837
2880
  }
2838
2881
  ),
2839
- /* @__PURE__ */ jsx9(
2882
+ /* @__PURE__ */ jsx10(
2840
2883
  "p",
2841
2884
  {
2842
2885
  className: "mt-1",
@@ -2849,8 +2892,8 @@ function PreChatForm({
2849
2892
  }
2850
2893
  )
2851
2894
  ] }),
2852
- /* @__PURE__ */ jsxs8("div", { className: "flex gap-1 ml-2", children: [
2853
- /* @__PURE__ */ jsx9(
2895
+ /* @__PURE__ */ jsxs9("div", { className: "flex gap-1 ml-2", children: [
2896
+ /* @__PURE__ */ jsx10(
2854
2897
  "button",
2855
2898
  {
2856
2899
  type: "button",
@@ -2864,7 +2907,7 @@ function PreChatForm({
2864
2907
  e.currentTarget.style.backgroundColor = "transparent";
2865
2908
  },
2866
2909
  "aria-label": "Minimize chat",
2867
- children: /* @__PURE__ */ jsxs8(
2910
+ children: /* @__PURE__ */ jsxs9(
2868
2911
  "svg",
2869
2912
  {
2870
2913
  width: "18",
@@ -2873,8 +2916,8 @@ function PreChatForm({
2873
2916
  stroke: "currentColor",
2874
2917
  viewBox: "0 0 24 24",
2875
2918
  children: [
2876
- /* @__PURE__ */ jsx9("title", { children: "Minimize" }),
2877
- /* @__PURE__ */ jsx9(
2919
+ /* @__PURE__ */ jsx10("title", { children: "Minimize" }),
2920
+ /* @__PURE__ */ jsx10(
2878
2921
  "path",
2879
2922
  {
2880
2923
  strokeLinecap: "round",
@@ -2888,7 +2931,7 @@ function PreChatForm({
2888
2931
  )
2889
2932
  }
2890
2933
  ),
2891
- /* @__PURE__ */ jsx9(
2934
+ /* @__PURE__ */ jsx10(
2892
2935
  "button",
2893
2936
  {
2894
2937
  type: "button",
@@ -2902,7 +2945,7 @@ function PreChatForm({
2902
2945
  e.currentTarget.style.backgroundColor = "transparent";
2903
2946
  },
2904
2947
  "aria-label": "Close chat",
2905
- children: /* @__PURE__ */ jsxs8(
2948
+ children: /* @__PURE__ */ jsxs9(
2906
2949
  "svg",
2907
2950
  {
2908
2951
  width: "18",
@@ -2911,8 +2954,8 @@ function PreChatForm({
2911
2954
  stroke: "currentColor",
2912
2955
  viewBox: "0 0 24 24",
2913
2956
  children: [
2914
- /* @__PURE__ */ jsx9("title", { children: "Close" }),
2915
- /* @__PURE__ */ jsx9(
2957
+ /* @__PURE__ */ jsx10("title", { children: "Close" }),
2958
+ /* @__PURE__ */ jsx10(
2916
2959
  "path",
2917
2960
  {
2918
2961
  strokeLinecap: "round",
@@ -2928,7 +2971,7 @@ function PreChatForm({
2928
2971
  )
2929
2972
  ] })
2930
2973
  ] }) }),
2931
- /* @__PURE__ */ jsx9(
2974
+ /* @__PURE__ */ jsx10(
2932
2975
  "div",
2933
2976
  {
2934
2977
  className: "h-px",
@@ -2940,9 +2983,9 @@ function PreChatForm({
2940
2983
  ]
2941
2984
  }
2942
2985
  ),
2943
- /* @__PURE__ */ jsxs8("form", { onSubmit: handleSubmit, className: "p-5 flex flex-col gap-4", children: [
2944
- /* @__PURE__ */ jsxs8("div", { children: [
2945
- /* @__PURE__ */ jsxs8(
2986
+ /* @__PURE__ */ jsxs9("form", { onSubmit: handleSubmit, className: "p-5 flex flex-col gap-4", children: [
2987
+ /* @__PURE__ */ jsxs9("div", { children: [
2988
+ /* @__PURE__ */ jsxs9(
2946
2989
  "label",
2947
2990
  {
2948
2991
  htmlFor: "chat-name",
@@ -2954,11 +2997,11 @@ function PreChatForm({
2954
2997
  },
2955
2998
  children: [
2956
2999
  "Name ",
2957
- /* @__PURE__ */ jsx9("span", { style: { color: "#ff6363" }, children: "*" })
3000
+ /* @__PURE__ */ jsx10("span", { style: { color: "#ff6363" }, children: "*" })
2958
3001
  ]
2959
3002
  }
2960
3003
  ),
2961
- /* @__PURE__ */ jsx9(
3004
+ /* @__PURE__ */ jsx10(
2962
3005
  "input",
2963
3006
  {
2964
3007
  type: "text",
@@ -2978,7 +3021,7 @@ function PreChatForm({
2978
3021
  autoComplete: "name"
2979
3022
  }
2980
3023
  ),
2981
- errors.name && /* @__PURE__ */ jsx9(
3024
+ errors.name && /* @__PURE__ */ jsx10(
2982
3025
  "p",
2983
3026
  {
2984
3027
  className: "mt-1.5",
@@ -2992,8 +3035,8 @@ function PreChatForm({
2992
3035
  }
2993
3036
  )
2994
3037
  ] }),
2995
- /* @__PURE__ */ jsxs8("div", { children: [
2996
- /* @__PURE__ */ jsxs8(
3038
+ /* @__PURE__ */ jsxs9("div", { children: [
3039
+ /* @__PURE__ */ jsxs9(
2997
3040
  "label",
2998
3041
  {
2999
3042
  htmlFor: "chat-email",
@@ -3005,11 +3048,11 @@ function PreChatForm({
3005
3048
  },
3006
3049
  children: [
3007
3050
  "Email ",
3008
- /* @__PURE__ */ jsx9("span", { style: { color: "#ff6363" }, children: "*" })
3051
+ /* @__PURE__ */ jsx10("span", { style: { color: "#ff6363" }, children: "*" })
3009
3052
  ]
3010
3053
  }
3011
3054
  ),
3012
- /* @__PURE__ */ jsx9(
3055
+ /* @__PURE__ */ jsx10(
3013
3056
  "input",
3014
3057
  {
3015
3058
  type: "email",
@@ -3029,7 +3072,7 @@ function PreChatForm({
3029
3072
  autoComplete: "email"
3030
3073
  }
3031
3074
  ),
3032
- errors.email && /* @__PURE__ */ jsx9(
3075
+ errors.email && /* @__PURE__ */ jsx10(
3033
3076
  "p",
3034
3077
  {
3035
3078
  className: "mt-1.5",
@@ -3043,7 +3086,7 @@ function PreChatForm({
3043
3086
  }
3044
3087
  )
3045
3088
  ] }),
3046
- /* @__PURE__ */ jsx9(
3089
+ /* @__PURE__ */ jsx10(
3047
3090
  "button",
3048
3091
  {
3049
3092
  type: "submit",
@@ -3065,8 +3108,8 @@ function PreChatForm({
3065
3108
  onMouseLeave: (e) => {
3066
3109
  e.currentTarget.style.boxShadow = "0 4px 16px -4px rgba(51,126,255,0.4)";
3067
3110
  },
3068
- children: isSubmitting ? /* @__PURE__ */ jsxs8("span", { className: "flex items-center justify-center gap-2", children: [
3069
- /* @__PURE__ */ jsxs8(
3111
+ children: isSubmitting ? /* @__PURE__ */ jsxs9("span", { className: "flex items-center justify-center gap-2", children: [
3112
+ /* @__PURE__ */ jsxs9(
3070
3113
  "svg",
3071
3114
  {
3072
3115
  className: "animate-spin",
@@ -3078,8 +3121,8 @@ function PreChatForm({
3078
3121
  strokeWidth: "2",
3079
3122
  "aria-label": "Loading",
3080
3123
  children: [
3081
- /* @__PURE__ */ jsx9("title", { children: "Loading" }),
3082
- /* @__PURE__ */ jsx9("path", { d: "M21 12a9 9 0 11-6.219-8.56" })
3124
+ /* @__PURE__ */ jsx10("title", { children: "Loading" }),
3125
+ /* @__PURE__ */ jsx10("path", { d: "M21 12a9 9 0 11-6.219-8.56" })
3083
3126
  ]
3084
3127
  }
3085
3128
  ),
@@ -3087,7 +3130,7 @@ function PreChatForm({
3087
3130
  ] }) : "Start Chat"
3088
3131
  }
3089
3132
  ),
3090
- /* @__PURE__ */ jsx9(
3133
+ /* @__PURE__ */ jsx10(
3091
3134
  "p",
3092
3135
  {
3093
3136
  className: "text-center",
@@ -3100,7 +3143,7 @@ function PreChatForm({
3100
3143
  }
3101
3144
  )
3102
3145
  ] }),
3103
- /* @__PURE__ */ jsx9(
3146
+ /* @__PURE__ */ jsx10(
3104
3147
  "div",
3105
3148
  {
3106
3149
  className: "px-4 py-1.5 text-center",
@@ -3108,7 +3151,7 @@ function PreChatForm({
3108
3151
  borderTop: "1px solid rgba(255,255,255,0.06)",
3109
3152
  backgroundColor: "rgba(0,0,0,0.2)"
3110
3153
  },
3111
- children: /* @__PURE__ */ jsxs8(
3154
+ children: /* @__PURE__ */ jsxs9(
3112
3155
  "p",
3113
3156
  {
3114
3157
  style: {
@@ -3119,7 +3162,7 @@ function PreChatForm({
3119
3162
  children: [
3120
3163
  "Powered by",
3121
3164
  " ",
3122
- /* @__PURE__ */ jsx9("span", { style: { fontWeight: 600, color: "rgba(247,247,248,0.45)" }, children: "Xcelsior" })
3165
+ /* @__PURE__ */ jsx10("span", { style: { fontWeight: 600, color: "rgba(247,247,248,0.45)" }, children: "Xcelsior" })
3123
3166
  ]
3124
3167
  }
3125
3168
  )
@@ -3233,7 +3276,7 @@ function useChatWidgetState({
3233
3276
  }
3234
3277
 
3235
3278
  // src/components/Chat.tsx
3236
- import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
3279
+ import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
3237
3280
  function generateSessionId() {
3238
3281
  if (typeof crypto !== "undefined" && crypto.randomUUID) {
3239
3282
  return crypto.randomUUID();
@@ -3364,7 +3407,7 @@ function Chat({
3364
3407
  const primaryColor = config.theme?.primary || "#337eff";
3365
3408
  const primaryStrong = config.theme?.primaryStrong || "#005eff";
3366
3409
  if (currentState === "minimized") {
3367
- return /* @__PURE__ */ jsx10("div", { className: `fixed bottom-5 ${positionClass} z-50 ${className}`, children: /* @__PURE__ */ jsxs9(
3410
+ return /* @__PURE__ */ jsx11("div", { className: `fixed bottom-5 ${positionClass} z-50 ${className}`, children: /* @__PURE__ */ jsxs10(
3368
3411
  "button",
3369
3412
  {
3370
3413
  type: "button",
@@ -3389,8 +3432,8 @@ function Chat({
3389
3432
  "aria-label": "Open chat",
3390
3433
  ...handlers,
3391
3434
  children: [
3392
- /* @__PURE__ */ jsx10(ChatBubbleIcon, { size: 28, color: "white", className: "pointer-events-none" }),
3393
- /* @__PURE__ */ jsx10(
3435
+ /* @__PURE__ */ jsx11(ChatBubbleIcon, { size: 28, color: "white", className: "pointer-events-none" }),
3436
+ /* @__PURE__ */ jsx11(
3394
3437
  "span",
3395
3438
  {
3396
3439
  className: "absolute inset-0 rounded-full animate-ping pointer-events-none",
@@ -3406,7 +3449,7 @@ function Chat({
3406
3449
  ) });
3407
3450
  }
3408
3451
  if (identityMode === "form" && (!userInfo || !userInfo.email || !userInfo.name)) {
3409
- return /* @__PURE__ */ jsx10(
3452
+ return /* @__PURE__ */ jsx11(
3410
3453
  PreChatForm,
3411
3454
  {
3412
3455
  onSubmit: handlePreChatSubmit,
@@ -3432,7 +3475,7 @@ function Chat({
3432
3475
  transform: "translateY(12px) scale(0.97)",
3433
3476
  transition: "opacity 0.2s ease-in, transform 0.2s ease-in"
3434
3477
  };
3435
- return /* @__PURE__ */ jsx10("div", { style: widgetAnimationStyle, children: /* @__PURE__ */ jsx10(
3478
+ return /* @__PURE__ */ jsx11("div", { style: widgetAnimationStyle, children: /* @__PURE__ */ jsx11(
3436
3479
  ChatWidget,
3437
3480
  {
3438
3481
  config: fullConfig,
@@ -3445,12 +3488,12 @@ function Chat({
3445
3488
  }
3446
3489
 
3447
3490
  // src/components/TypingIndicator.tsx
3448
- import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
3491
+ import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
3449
3492
  function TypingIndicator({ isTyping, userName }) {
3450
3493
  if (!isTyping) {
3451
3494
  return null;
3452
3495
  }
3453
- return /* @__PURE__ */ jsx11(
3496
+ return /* @__PURE__ */ jsx12(
3454
3497
  "div",
3455
3498
  {
3456
3499
  className: "px-4 py-2",
@@ -3458,8 +3501,8 @@ function TypingIndicator({ isTyping, userName }) {
3458
3501
  borderTop: "1px solid rgba(255,255,255,0.06)",
3459
3502
  backgroundColor: "rgba(0,0,0,0.15)"
3460
3503
  },
3461
- children: /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
3462
- /* @__PURE__ */ jsx11("div", { className: "flex gap-1", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx11(
3504
+ children: /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
3505
+ /* @__PURE__ */ jsx12("div", { className: "flex gap-1", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx12(
3463
3506
  "span",
3464
3507
  {
3465
3508
  className: "rounded-full animate-bounce",
@@ -3473,7 +3516,7 @@ function TypingIndicator({ isTyping, userName }) {
3473
3516
  },
3474
3517
  i
3475
3518
  )) }),
3476
- /* @__PURE__ */ jsx11(
3519
+ /* @__PURE__ */ jsx12(
3477
3520
  "span",
3478
3521
  {
3479
3522
  style: {