aizek-chatbot 1.0.2 → 1.0.4

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.
Files changed (5) hide show
  1. package/dist/index.cjs +273 -190
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.mjs +246 -180
  4. package/dist/index.mjs.map +1 -1
  5. package/package.json +7 -3
package/dist/index.cjs CHANGED
@@ -1,24 +1,35 @@
1
- 'use strict';
1
+ "use client";
2
+ "use strict";
2
3
 
3
- var React = require('react');
4
- var jsxRuntime = require('react/jsx-runtime');
5
- var OpenAI = require('openai');
6
- var ReactMarkdown = require('react-markdown');
7
- var remarkGfm = require('remark-gfm');
4
+ var React = require("react");
5
+ var jsxRuntime = require("react/jsx-runtime");
6
+ var OpenAI = require("openai");
7
+ var ReactMarkdown = require("react-markdown");
8
+ var remarkGfm = require("remark-gfm");
8
9
 
9
- function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
10
+ function _interopDefault(e) {
11
+ return e && e.__esModule ? e : { default: e };
12
+ }
10
13
 
11
14
  function _interopNamespace(e) {
12
15
  if (e && e.__esModule) return e;
13
16
  var n = Object.create(null);
14
17
  if (e) {
15
18
  Object.keys(e).forEach(function (k) {
16
- if (k !== 'default') {
19
+ if (k !== "default") {
17
20
  var d = Object.getOwnPropertyDescriptor(e, k);
18
- Object.defineProperty(n, k, d.get ? d : {
19
- enumerable: true,
20
- get: function () { return e[k]; }
21
- });
21
+ Object.defineProperty(
22
+ n,
23
+ k,
24
+ d.get
25
+ ? d
26
+ : {
27
+ enumerable: true,
28
+ get: function () {
29
+ return e[k];
30
+ },
31
+ }
32
+ );
22
33
  }
23
34
  });
24
35
  }
@@ -26,10 +37,10 @@ function _interopNamespace(e) {
26
37
  return Object.freeze(n);
27
38
  }
28
39
 
29
- var React__namespace = /*#__PURE__*/_interopNamespace(React);
30
- var OpenAI__default = /*#__PURE__*/_interopDefault(OpenAI);
31
- var ReactMarkdown__default = /*#__PURE__*/_interopDefault(ReactMarkdown);
32
- var remarkGfm__default = /*#__PURE__*/_interopDefault(remarkGfm);
40
+ var React__namespace = /*#__PURE__*/ _interopNamespace(React);
41
+ var OpenAI__default = /*#__PURE__*/ _interopDefault(OpenAI);
42
+ var ReactMarkdown__default = /*#__PURE__*/ _interopDefault(ReactMarkdown);
43
+ var remarkGfm__default = /*#__PURE__*/ _interopDefault(remarkGfm);
33
44
 
34
45
  // src/utils/cx.ts
35
46
  function cx(...args) {
@@ -44,18 +55,18 @@ var base = {
44
55
  lineHeight: 1,
45
56
  transition: "background-color .2s ease, color .2s ease, border-color .2s ease",
46
57
  outline: "none",
47
- cursor: "pointer"
58
+ cursor: "pointer",
48
59
  };
49
60
  var sizes = {
50
61
  sm: { height: 36, padding: "0 12px", fontSize: 14 },
51
62
  md: { height: 40, padding: "0 16px", fontSize: 16 },
52
- lg: { height: 44, padding: "0 20px", fontSize: 18 }
63
+ lg: { height: 44, padding: "0 20px", fontSize: 18 },
53
64
  };
54
65
  var palette = {
55
66
  brand: {
56
67
  primary: "#2563eb",
57
- primaryHover: "#1d4ed8"
58
- }
68
+ primaryHover: "#1d4ed8",
69
+ },
59
70
  };
60
71
  function styleFor(variant) {
61
72
  switch (variant) {
@@ -63,45 +74,45 @@ function styleFor(variant) {
63
74
  return {
64
75
  background: "transparent",
65
76
  color: palette.brand.primary,
66
- border: `1px solid ${palette.brand.primary}`
77
+ border: `1px solid ${palette.brand.primary}`,
67
78
  };
68
79
  case "ghost":
69
80
  return {
70
81
  background: "transparent",
71
82
  color: palette.brand.primary,
72
- border: "1px solid transparent"
83
+ border: "1px solid transparent",
73
84
  };
74
85
  default:
75
86
  return {
76
87
  background: palette.brand.primary,
77
88
  color: "#fff",
78
- border: "1px solid transparent"
89
+ border: "1px solid transparent",
79
90
  };
80
91
  }
81
92
  }
82
- var Button = React__namespace.forwardRef(
83
- ({ variant = "primary", size = "md", style, className, onMouseEnter, onMouseLeave, ...props }, ref) => {
84
- const [hover, setHover] = React__namespace.useState(false);
85
- const hoverStyle = variant === "primary" ? { background: hover ? palette.brand.primaryHover : palette.brand.primary } : variant === "outline" ? { borderColor: hover ? palette.brand.primaryHover : palette.brand.primary } : { background: hover ? "rgba(37, 99, 235, 0.08)" : "transparent" };
86
- return /* @__PURE__ */ jsxRuntime.jsx(
87
- "button",
88
- {
89
- ref,
90
- className: cx("rui-btn", className),
91
- style: { ...base, ...sizes[size], ...styleFor(variant), ...hover ? hoverStyle : {}, ...style },
92
- onMouseEnter: (e) => {
93
- setHover(true);
94
- onMouseEnter?.(e);
95
- },
96
- onMouseLeave: (e) => {
97
- setHover(false);
98
- onMouseLeave?.(e);
99
- },
100
- ...props
101
- }
102
- );
103
- }
104
- );
93
+ var Button = React__namespace.forwardRef(({ variant = "primary", size = "md", style, className, onMouseEnter, onMouseLeave, ...props }, ref) => {
94
+ const [hover, setHover] = React__namespace.useState(false);
95
+ const hoverStyle =
96
+ variant === "primary"
97
+ ? { background: hover ? palette.brand.primaryHover : palette.brand.primary }
98
+ : variant === "outline"
99
+ ? { borderColor: hover ? palette.brand.primaryHover : palette.brand.primary }
100
+ : { background: hover ? "rgba(37, 99, 235, 0.08)" : "transparent" };
101
+ return /* @__PURE__ */ jsxRuntime.jsx("button", {
102
+ ref,
103
+ className: cx("rui-btn", className),
104
+ style: { ...base, ...sizes[size], ...styleFor(variant), ...(hover ? hoverStyle : {}), ...style },
105
+ onMouseEnter: (e) => {
106
+ setHover(true);
107
+ onMouseEnter?.(e);
108
+ },
109
+ onMouseLeave: (e) => {
110
+ setHover(false);
111
+ onMouseLeave?.(e);
112
+ },
113
+ ...props,
114
+ });
115
+ });
105
116
  Button.displayName = "Button";
106
117
  var useChatbot = (options = {}) => {
107
118
  const { mcpUrl, apiKey } = options;
@@ -117,7 +128,7 @@ var useChatbot = (options = {}) => {
117
128
  id: generateId(),
118
129
  content,
119
130
  role,
120
- timestamp: /* @__PURE__ */ new Date()
131
+ timestamp: /* @__PURE__ */ new Date(),
121
132
  };
122
133
  setMessages((prev) => [...prev, newMessage]);
123
134
  return newMessage;
@@ -127,23 +138,39 @@ var useChatbot = (options = {}) => {
127
138
  addMessage(message, "user");
128
139
  setIsLoading(true);
129
140
  try {
130
- const resp = await client.responses.create({
131
- model: "gpt-5",
132
- tools: [
133
- {
134
- type: "mcp",
135
- server_label: "aizek-mcp",
136
- server_url: mcpUrl,
137
- require_approval: "never",
138
- headers: {
139
- Authorization: options.userToken ? `Bearer ${options.userToken}` : ""
140
- }
141
- }
142
- ],
143
- input: message,
144
- previous_response_id: responseId || void 0
145
- });
146
- console.log(resp);
141
+ let resp;
142
+ if (options.userToken) {
143
+ resp = await client.responses.create({
144
+ model: "gpt-5",
145
+ tools: [
146
+ {
147
+ type: "mcp",
148
+ server_label: "aizek-mcp",
149
+ server_url: mcpUrl,
150
+ require_approval: "never",
151
+ headers: {
152
+ Authorization: `Bearer ${options.userToken}`,
153
+ },
154
+ },
155
+ ],
156
+ input: message,
157
+ previous_response_id: responseId || void 0,
158
+ });
159
+ } else {
160
+ resp = await client.responses.create({
161
+ model: "gpt-5",
162
+ tools: [
163
+ {
164
+ type: "mcp",
165
+ server_label: "aizek-mcp",
166
+ server_url: mcpUrl,
167
+ require_approval: "never",
168
+ },
169
+ ],
170
+ input: message,
171
+ previous_response_id: responseId || void 0,
172
+ });
173
+ }
147
174
  setResponseId(resp.id);
148
175
  let responseText = "";
149
176
  if (resp && Array.isArray(resp)) {
@@ -176,7 +203,7 @@ var useChatbot = (options = {}) => {
176
203
  messages,
177
204
  isLoading,
178
205
  sendMessage,
179
- addMessage
206
+ addMessage,
180
207
  };
181
208
  };
182
209
 
@@ -187,8 +214,8 @@ var fetchChatWidgetSettings = async (clientId) => {
187
214
  const response = await fetch(`${API_BASE_URL}/ChatWidgetSettings/GetByClientId?client_id=${clientId}`, {
188
215
  method: "GET",
189
216
  headers: {
190
- "Content-Type": "application/json"
191
- }
217
+ "Content-Type": "application/json",
218
+ },
192
219
  });
193
220
  if (!response.ok) {
194
221
  throw new Error(`HTTP error! status: ${response.status}`);
@@ -205,9 +232,9 @@ var mapApiSettingsToConfig = (apiSettings) => {
205
232
  return null;
206
233
  }
207
234
  const buttonSizeMap = {
208
- "small": "sm",
209
- "medium": "md",
210
- "large": "lg"
235
+ small: "sm",
236
+ medium: "md",
237
+ large: "lg",
211
238
  };
212
239
  return {
213
240
  welcomeMessage: apiSettings.welcome_message,
@@ -221,7 +248,7 @@ var mapApiSettingsToConfig = (apiSettings) => {
221
248
  initialOpen: apiSettings.initial_open,
222
249
  headerBackground: apiSettings.header_background,
223
250
  companyLogo: apiSettings.company_logo || void 0,
224
- companyName: apiSettings.company_name
251
+ companyName: apiSettings.company_name,
225
252
  };
226
253
  };
227
254
 
@@ -235,27 +262,29 @@ var getMessageBubbleStyles = (isUser) => ({
235
262
  lineHeight: 1.4,
236
263
  fontSize: "14px",
237
264
  position: "relative",
238
- ...isUser ? {
239
- background: "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
240
- color: "#ffffff",
241
- marginLeft: "auto",
242
- marginRight: "0"
243
- } : {
244
- background: "#f8fafc",
245
- color: "#334155",
246
- border: "1px solid #e2e8f0",
247
- marginLeft: "0",
248
- marginRight: "auto"
249
- }
265
+ ...(isUser
266
+ ? {
267
+ background: "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
268
+ color: "#ffffff",
269
+ marginLeft: "auto",
270
+ marginRight: "0",
271
+ }
272
+ : {
273
+ background: "#f8fafc",
274
+ color: "#334155",
275
+ border: "1px solid #e2e8f0",
276
+ marginLeft: "0",
277
+ marginRight: "auto",
278
+ }),
250
279
  });
251
280
  var getTimeStyles = (isUser) => ({
252
281
  fontSize: "11px",
253
282
  opacity: 0.7,
254
283
  marginTop: "4px",
255
- textAlign: isUser ? "right" : "left"
284
+ textAlign: isUser ? "right" : "left",
256
285
  });
257
286
  var getMarkdownStyles = () => ({
258
- lineHeight: 1.6
287
+ lineHeight: 1.6,
259
288
  });
260
289
  var getMarkdownElementStyles = (isUser) => `
261
290
  .markdown-content p {
@@ -416,7 +445,7 @@ var getMessageContainerStyles = (isUser) => ({
416
445
  display: "flex",
417
446
  flexDirection: "column",
418
447
  alignItems: isUser ? "flex-end" : "flex-start",
419
- width: "100%"
448
+ width: "100%",
420
449
  });
421
450
 
422
451
  // src/styles/inputStyles.ts
@@ -427,7 +456,7 @@ var getInputContainerStyles = () => ({
427
456
  padding: "16px",
428
457
  background: "#ffffff",
429
458
  borderTop: "1px solid #e2e8f0",
430
- borderRadius: "0 0 12px 12px"
459
+ borderRadius: "0 0 12px 12px",
431
460
  });
432
461
  var getTextareaStyles = (isLoading) => ({
433
462
  flex: 1,
@@ -444,10 +473,12 @@ var getTextareaStyles = (isLoading) => ({
444
473
  fontFamily: "inherit",
445
474
  background: "#f8fafc",
446
475
  color: "#334155",
447
- ...isLoading ? {
448
- opacity: 0.6,
449
- cursor: "not-allowed"
450
- } : {}
476
+ ...(isLoading
477
+ ? {
478
+ opacity: 0.6,
479
+ cursor: "not-allowed",
480
+ }
481
+ : {}),
451
482
  });
452
483
  var getSendButtonStyles = (isLoading, hasMessage) => ({
453
484
  width: "44px",
@@ -461,7 +492,7 @@ var getSendButtonStyles = (isLoading, hasMessage) => ({
461
492
  alignItems: "center",
462
493
  justifyContent: "center",
463
494
  transition: "all 0.2s ease",
464
- fontSize: "16px"
495
+ fontSize: "16px",
465
496
  });
466
497
 
467
498
  // src/styles/headerStyles.ts
@@ -471,7 +502,7 @@ var getHeaderStyles = (headerBackground) => ({
471
502
  color: "#ffffff",
472
503
  display: "flex",
473
504
  alignItems: "center",
474
- gap: "12px"
505
+ gap: "12px",
475
506
  });
476
507
  var getLogoContainerStyles = () => ({
477
508
  width: "40px",
@@ -482,34 +513,34 @@ var getLogoContainerStyles = () => ({
482
513
  alignItems: "center",
483
514
  justifyContent: "center",
484
515
  fontSize: "18px",
485
- overflow: "hidden"
516
+ overflow: "hidden",
486
517
  });
487
518
  var getLogoImageStyles = () => ({
488
519
  width: "100%",
489
520
  height: "100%",
490
521
  objectFit: "cover",
491
- borderRadius: "50%"
522
+ borderRadius: "50%",
492
523
  });
493
524
  var getLogoTextStyles = () => ({
494
525
  fontSize: "16px",
495
- fontWeight: "bold"
526
+ fontWeight: "bold",
496
527
  });
497
528
  var getCompanyNameStyles = () => ({
498
529
  margin: 0,
499
530
  fontSize: "16px",
500
- fontWeight: 600
531
+ fontWeight: 600,
501
532
  });
502
533
  var getStatusTextStyles = () => ({
503
534
  margin: 0,
504
535
  fontSize: "12px",
505
- opacity: 0.8
536
+ opacity: 0.8,
506
537
  });
507
538
 
508
539
  // src/styles/containerStyles.ts
509
540
  var getButtonSizes = () => ({
510
541
  sm: { width: "50px", height: "50px", fontSize: "20px" },
511
542
  md: { width: "60px", height: "60px", fontSize: "24px" },
512
- lg: { width: "70px", height: "70px", fontSize: "28px" }
543
+ lg: { width: "70px", height: "70px", fontSize: "28px" },
513
544
  });
514
545
  var getFloatingButtonStyles = (buttonPosition, buttonSize, buttonBackground, isOpen) => {
515
546
  const buttonSizes = getButtonSizes();
@@ -532,7 +563,7 @@ var getFloatingButtonStyles = (buttonPosition, buttonSize, buttonBackground, isO
532
563
  boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
533
564
  transition: "all 0.3s ease",
534
565
  zIndex: 1e3,
535
- transform: isOpen ? "scale(0.9)" : "scale(1)"
566
+ transform: isOpen ? "scale(0.9)" : "scale(1)",
536
567
  };
537
568
  };
538
569
  var getChatContainerStyles = (buttonPosition, chatWidth, chatHeight, isOpen) => ({
@@ -546,7 +577,7 @@ var getChatContainerStyles = (buttonPosition, chatWidth, chatHeight, isOpen) =>
546
577
  opacity: isOpen ? 1 : 0,
547
578
  visibility: isOpen ? "visible" : "hidden",
548
579
  transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
549
- transformOrigin: buttonPosition === "bottom-left" ? "bottom left" : "bottom right"
580
+ transformOrigin: buttonPosition === "bottom-left" ? "bottom left" : "bottom right",
550
581
  });
551
582
  var getOverlayStyles = (isOpen) => ({
552
583
  position: "fixed",
@@ -558,7 +589,7 @@ var getOverlayStyles = (isOpen) => ({
558
589
  zIndex: 998,
559
590
  opacity: isOpen ? 1 : 0,
560
591
  visibility: isOpen ? "visible" : "hidden",
561
- transition: "all 0.3s ease"
592
+ transition: "all 0.3s ease",
562
593
  });
563
594
  var getChatbotContainerStyles = () => ({
564
595
  display: "flex",
@@ -568,7 +599,7 @@ var getChatbotContainerStyles = () => ({
568
599
  borderRadius: "12px",
569
600
  boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
570
601
  border: "1px solid #e2e8f0",
571
- overflow: "hidden"
602
+ overflow: "hidden",
572
603
  });
573
604
  var getMessagesContainerStyles = () => ({
574
605
  flex: 1,
@@ -577,7 +608,7 @@ var getMessagesContainerStyles = () => ({
577
608
  display: "flex",
578
609
  flexDirection: "column",
579
610
  gap: "4px",
580
- background: "#f8fafc"
611
+ background: "#f8fafc",
581
612
  });
582
613
  var getEmptyStateStyles = () => ({
583
614
  display: "flex",
@@ -587,7 +618,7 @@ var getEmptyStateStyles = () => ({
587
618
  height: "100%",
588
619
  color: "#64748b",
589
620
  textAlign: "center",
590
- padding: "40px 20px"
621
+ padding: "40px 20px",
591
622
  });
592
623
 
593
624
  // src/styles/loadingStyles.ts
@@ -597,7 +628,7 @@ var getLoadingSpinnerStyles = () => ({
597
628
  border: "2px solid transparent",
598
629
  borderTop: "2px solid currentColor",
599
630
  borderRadius: "50%",
600
- animation: "spin 1s linear infinite"
631
+ animation: "spin 1s linear infinite",
601
632
  });
602
633
  var AizekChatBot = ({ clientId, userToken }) => {
603
634
  const defaultConfig = {
@@ -612,7 +643,7 @@ var AizekChatBot = ({ clientId, userToken }) => {
612
643
  initialOpen: true,
613
644
  headerBackground: "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
614
645
  companyLogo: void 0,
615
- companyName: "AI Asistan"
646
+ companyName: "AI Asistan",
616
647
  };
617
648
  const [config, setConfig] = React.useState(defaultConfig);
618
649
  const [isConfigLoading, setIsConfigLoading] = React.useState(true);
@@ -657,21 +688,38 @@ var AizekChatBot = ({ clientId, userToken }) => {
657
688
  }, [messages]);
658
689
  const MessageBubble = ({ message }) => {
659
690
  const isUser = message.role === "user";
660
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: getMessageContainerStyles(isUser), children: [
661
- /* @__PURE__ */ jsxRuntime.jsx("style", { children: getMarkdownElementStyles(isUser) }),
662
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: getMessageBubbleStyles(isUser), children: [
663
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: getMarkdownStyles(), className: "markdown-content", children: /* @__PURE__ */ jsxRuntime.jsx(ReactMarkdown__default.default, { remarkPlugins: [remarkGfm__default.default], children: message.content }) }),
664
- message.isTyping && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
665
- display: "inline-flex",
666
- alignItems: "center",
667
- marginLeft: "8px"
668
- }, children: /* @__PURE__ */ jsxRuntime.jsx(TypingDots, {}) })
669
- ] }),
670
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: getTimeStyles(isUser), children: message.timestamp.toLocaleTimeString("tr-TR", {
671
- hour: "2-digit",
672
- minute: "2-digit"
673
- }) })
674
- ] });
691
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", {
692
+ style: getMessageContainerStyles(isUser),
693
+ children: [
694
+ /* @__PURE__ */ jsxRuntime.jsx("style", { children: getMarkdownElementStyles(isUser) }),
695
+ /* @__PURE__ */ jsxRuntime.jsxs("div", {
696
+ style: getMessageBubbleStyles(isUser),
697
+ children: [
698
+ /* @__PURE__ */ jsxRuntime.jsx("div", {
699
+ style: getMarkdownStyles(),
700
+ className: "markdown-content",
701
+ children: /* @__PURE__ */ jsxRuntime.jsx(ReactMarkdown__default.default, { remarkPlugins: [remarkGfm__default.default], children: message.content }),
702
+ }),
703
+ message.isTyping &&
704
+ /* @__PURE__ */ jsxRuntime.jsx("div", {
705
+ style: {
706
+ display: "inline-flex",
707
+ alignItems: "center",
708
+ marginLeft: "8px",
709
+ },
710
+ children: /* @__PURE__ */ jsxRuntime.jsx(TypingDots, {}),
711
+ }),
712
+ ],
713
+ }),
714
+ /* @__PURE__ */ jsxRuntime.jsx("div", {
715
+ style: getTimeStyles(isUser),
716
+ children: message.timestamp.toLocaleTimeString("tr-TR", {
717
+ hour: "2-digit",
718
+ minute: "2-digit",
719
+ }),
720
+ }),
721
+ ],
722
+ });
675
723
  };
676
724
  const TypingDots = () => {
677
725
  const [dots, setDots] = React.useState("");
@@ -711,22 +759,20 @@ var AizekChatBot = ({ clientId, userToken }) => {
711
759
  textarea.style.height = "auto";
712
760
  textarea.style.height = Math.min(textarea.scrollHeight, 120) + "px";
713
761
  };
714
- return /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, style: getInputContainerStyles(), children: [
715
- /* @__PURE__ */ jsxRuntime.jsx(
716
- "textarea",
717
- {
762
+ return /* @__PURE__ */ jsxRuntime.jsxs("form", {
763
+ onSubmit: handleSubmit,
764
+ style: getInputContainerStyles(),
765
+ children: [
766
+ /* @__PURE__ */ jsxRuntime.jsx("textarea", {
718
767
  ref: textareaRef,
719
768
  value: message,
720
769
  onChange: handleInputChange,
721
770
  onKeyDown: handleKeyDown,
722
771
  placeholder,
723
772
  disabled: isLoading,
724
- style: getTextareaStyles(isLoading)
725
- }
726
- ),
727
- /* @__PURE__ */ jsxRuntime.jsx(
728
- "button",
729
- {
773
+ style: getTextareaStyles(isLoading),
774
+ }),
775
+ /* @__PURE__ */ jsxRuntime.jsx("button", {
730
776
  type: "submit",
731
777
  disabled: isLoading || !message.trim(),
732
778
  style: getSendButtonStyles(isLoading, !!message.trim()),
@@ -738,10 +784,12 @@ var AizekChatBot = ({ clientId, userToken }) => {
738
784
  onMouseLeave: (e) => {
739
785
  e.currentTarget.style.transform = "scale(1)";
740
786
  },
741
- children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LoadingSpinner, {}) : /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" }) })
742
- }
743
- )
744
- ] });
787
+ children: isLoading
788
+ ? /* @__PURE__ */ jsxRuntime.jsx(LoadingSpinner, {})
789
+ : /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" }) }),
790
+ }),
791
+ ],
792
+ });
745
793
  };
746
794
  const LoadingSpinner = () => {
747
795
  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: getLoadingSpinnerStyles() });
@@ -749,55 +797,76 @@ var AizekChatBot = ({ clientId, userToken }) => {
749
797
  if (isConfigLoading) {
750
798
  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: getFloatingButtonStyles(buttonPosition, buttonSize, buttonBackground, false), children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: getLoadingSpinnerStyles() }) });
751
799
  }
752
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
753
- isOpen && /* @__PURE__ */ jsxRuntime.jsx(
754
- "div",
755
- {
756
- style: getOverlayStyles(isOpen),
757
- onClick: toggleChat,
758
- className: "floating-chat-overlay"
759
- }
760
- ),
761
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: getChatContainerStyles(buttonPosition, chatWidth, chatHeight, isOpen), className: "floating-chat-container", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: getChatbotContainerStyles(), children: [
762
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: getHeaderStyles(headerBackground), children: [
763
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: getLogoContainerStyles(), children: companyLogo ? companyLogo.startsWith("http") || companyLogo.startsWith("data:") ? /* @__PURE__ */ jsxRuntime.jsx(
764
- "img",
765
- {
766
- src: companyLogo,
767
- alt: "Company Logo",
768
- style: getLogoImageStyles()
769
- }
770
- ) : /* @__PURE__ */ jsxRuntime.jsx("span", { style: getLogoTextStyles(), children: companyLogo }) : "\u{1F916}" }),
771
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
772
- /* @__PURE__ */ jsxRuntime.jsx("h3", { style: getCompanyNameStyles(), children: companyName }),
773
- /* @__PURE__ */ jsxRuntime.jsx("p", { style: getStatusTextStyles(), children: isLoading ? "Yaz\u0131yor..." : "\xC7evrimi\xE7i" })
774
- ] })
775
- ] }),
776
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: getMessagesContainerStyles(), children: [
777
- messages.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: getEmptyStateStyles(), children: [
778
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: "48px", marginBottom: "16px" }, children: "\u{1F4AC}" }),
779
- /* @__PURE__ */ jsxRuntime.jsx("h4", { style: { margin: "0 0 8px 0", fontSize: "18px" }, children: welcomeMessage }),
780
- /* @__PURE__ */ jsxRuntime.jsx("p", { style: { margin: 0, fontSize: "14px", opacity: 0.8 }, children: "A\u015Fa\u011F\u0131daki alana mesaj\u0131n\u0131z\u0131 yazarak ba\u015Flayabilirsiniz." })
781
- ] }) : messages.map((message) => /* @__PURE__ */ jsxRuntime.jsx(MessageBubble, { message }, message.id)),
782
- showTypingIndicator && isLoading && messages.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
783
- MessageBubble,
784
- {
785
- message: {
786
- id: "typing",
787
- content: "",
788
- role: "assistant",
789
- timestamp: /* @__PURE__ */ new Date(),
790
- isTyping: true
791
- }
792
- }
793
- ),
794
- /* @__PURE__ */ jsxRuntime.jsx("div", { ref: messagesEndRef })
795
- ] }),
796
- /* @__PURE__ */ jsxRuntime.jsx(ChatInput, {})
797
- ] }) }),
798
- /* @__PURE__ */ jsxRuntime.jsx(
799
- "button",
800
- {
800
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
801
+ children: [
802
+ isOpen &&
803
+ /* @__PURE__ */ jsxRuntime.jsx("div", {
804
+ style: getOverlayStyles(isOpen),
805
+ onClick: toggleChat,
806
+ className: "floating-chat-overlay",
807
+ }),
808
+ /* @__PURE__ */ jsxRuntime.jsx("div", {
809
+ style: getChatContainerStyles(buttonPosition, chatWidth, chatHeight, isOpen),
810
+ className: "floating-chat-container",
811
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", {
812
+ style: getChatbotContainerStyles(),
813
+ children: [
814
+ /* @__PURE__ */ jsxRuntime.jsxs("div", {
815
+ style: getHeaderStyles(headerBackground),
816
+ children: [
817
+ /* @__PURE__ */ jsxRuntime.jsx("div", {
818
+ style: getLogoContainerStyles(),
819
+ children: companyLogo
820
+ ? companyLogo.startsWith("http") || companyLogo.startsWith("data:")
821
+ ? /* @__PURE__ */ jsxRuntime.jsx("img", {
822
+ src: companyLogo,
823
+ alt: "Company Logo",
824
+ style: getLogoImageStyles(),
825
+ })
826
+ : /* @__PURE__ */ jsxRuntime.jsx("span", { style: getLogoTextStyles(), children: companyLogo })
827
+ : "\u{1F916}",
828
+ }),
829
+ /* @__PURE__ */ jsxRuntime.jsxs("div", {
830
+ children: [
831
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { style: getCompanyNameStyles(), children: companyName }),
832
+ /* @__PURE__ */ jsxRuntime.jsx("p", { style: getStatusTextStyles(), children: isLoading ? "Yaz\u0131yor..." : "\xC7evrimi\xE7i" }),
833
+ ],
834
+ }),
835
+ ],
836
+ }),
837
+ /* @__PURE__ */ jsxRuntime.jsxs("div", {
838
+ style: getMessagesContainerStyles(),
839
+ children: [
840
+ messages.length === 0
841
+ ? /* @__PURE__ */ jsxRuntime.jsxs("div", {
842
+ style: getEmptyStateStyles(),
843
+ children: [
844
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: "48px", marginBottom: "16px" }, children: "\u{1F4AC}" }),
845
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { style: { margin: "0 0 8px 0", fontSize: "18px" }, children: welcomeMessage }),
846
+ /* @__PURE__ */ jsxRuntime.jsx("p", { style: { margin: 0, fontSize: "14px", opacity: 0.8 }, children: "A\u015Fa\u011F\u0131daki alana mesaj\u0131n\u0131z\u0131 yazarak ba\u015Flayabilirsiniz." }),
847
+ ],
848
+ })
849
+ : messages.map((message) => /* @__PURE__ */ jsxRuntime.jsx(MessageBubble, { message }, message.id)),
850
+ showTypingIndicator &&
851
+ isLoading &&
852
+ messages.length > 0 &&
853
+ /* @__PURE__ */ jsxRuntime.jsx(MessageBubble, {
854
+ message: {
855
+ id: "typing",
856
+ content: "",
857
+ role: "assistant",
858
+ timestamp: /* @__PURE__ */ new Date(),
859
+ isTyping: true,
860
+ },
861
+ }),
862
+ /* @__PURE__ */ jsxRuntime.jsx("div", { ref: messagesEndRef }),
863
+ ],
864
+ }),
865
+ /* @__PURE__ */ jsxRuntime.jsx(ChatInput, {}),
866
+ ],
867
+ }),
868
+ }),
869
+ /* @__PURE__ */ jsxRuntime.jsx("button", {
801
870
  onClick: toggleChat,
802
871
  style: getFloatingButtonStyles(buttonPosition, buttonSize, buttonBackground, isOpen),
803
872
  onMouseEnter: (e) => {
@@ -810,14 +879,28 @@ var AizekChatBot = ({ clientId, userToken }) => {
810
879
  },
811
880
  className: "floating-chat-button",
812
881
  "aria-label": isOpen ? "Chati kapat" : "Chati a\xE7",
813
- children: isOpen ? /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h4l4 4 4-4h4c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z" }) })
814
- }
815
- )
816
- ] });
882
+ children: isOpen
883
+ ? /* @__PURE__ */ jsxRuntime.jsx("svg", {
884
+ width: "24",
885
+ height: "24",
886
+ viewBox: "0 0 24 24",
887
+ fill: "currentColor",
888
+ children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }),
889
+ })
890
+ : /* @__PURE__ */ jsxRuntime.jsx("svg", {
891
+ width: "24",
892
+ height: "24",
893
+ viewBox: "0 0 24 24",
894
+ fill: "currentColor",
895
+ children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h4l4 4 4-4h4c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z" }),
896
+ }),
897
+ }),
898
+ ],
899
+ });
817
900
  };
818
901
 
819
902
  exports.AizekChatBot = AizekChatBot;
820
903
  exports.Button = Button;
821
904
  exports.useChatbot = useChatbot;
822
905
  //# sourceMappingURL=index.cjs.map
823
- //# sourceMappingURL=index.cjs.map
906
+ //# sourceMappingURL=index.cjs.map