llmasaservice-ui 0.9.1 → 0.9.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.
Files changed (10) hide show
  1. package/dist/index.css +89 -2
  2. package/dist/index.d.mts +2 -1
  3. package/dist/index.d.ts +2 -1
  4. package/dist/index.js +368 -235
  5. package/dist/index.mjs +355 -222
  6. package/package.json +1 -1
  7. package/src/AgentPanel.tsx +0 -5
  8. package/src/ChatPanel.css +105 -5
  9. package/src/ChatPanel.tsx +296 -73
  10. package/src/CallToActionModal.tsx +0 -62
package/dist/index.css CHANGED
@@ -28,6 +28,8 @@
28
28
  --button-background-color-hover: #777;
29
29
  --button-text-color-hover: #fff;
30
30
  --button-drop-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);
31
+ --button-disabled-color: #ccc;
32
+ --button-disabled-background-color: #eee;
31
33
  --button-action-background-color: transparent;
32
34
  --button-action-text-color: #999;
33
35
  --prompt-background-color: #eeeeee;
@@ -39,6 +41,9 @@
39
41
  --button-scroll-background-color-hover: #999;
40
42
  --table-border-color: #777;
41
43
  --powered-by-text-color: #999;
44
+ --background-color-mandatory: #ffcccc;
45
+ --border-color-mandatory: #ff5555;
46
+ --text-color-manadatory: #ff5555;
42
47
  }
43
48
  .dark-theme {
44
49
  --background-color: #171717;
@@ -54,6 +59,8 @@
54
59
  --button-background-color-hover: #505050;
55
60
  --button-text-color-hover: #fff;
56
61
  --button-drop-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
62
+ --button-disabled-color: #808080;
63
+ --button-disabled-background-color: #505050;
57
64
  --button-action-background-color: transparent;
58
65
  --button-action-text-color: #bbb;
59
66
  --prompt-background-color: #333333;
@@ -64,6 +71,9 @@
64
71
  --button-scroll-text-color: #fff;
65
72
  --button-scroll-background-color-hover: #606060;
66
73
  --table-border-color: #444;
74
+ --background-color-mandatory: #2c2c2c;
75
+ --border-color-mandatory: #ff5555;
76
+ --text-color-manadatory: #e0e0e0;
67
77
  }
68
78
  .llm-panel {
69
79
  font-family:
@@ -94,6 +104,60 @@
94
104
  align-items: center;
95
105
  margin-top: var(--spacing-small);
96
106
  }
107
+ .llm-panel .email-input-container {
108
+ display: flex;
109
+ flex-direction: row;
110
+ width: 100%;
111
+ gap: var(--spacing-small);
112
+ margin-top: var(--spacing-small);
113
+ margin-bottom: var(--spacing-small);
114
+ padding-right: var(--spacing-small);
115
+ }
116
+ .llm-panel .email-input {
117
+ flex: 1;
118
+ color: var(--input-text-color);
119
+ padding: var(--spacing-small);
120
+ background-color: var(--input-background-color);
121
+ border: 1px solid var(--input-border-color);
122
+ }
123
+ .llm-panel .email-input-invalid {
124
+ flex: 1;
125
+ color: var(--input-text-color);
126
+ padding: var(--spacing-small);
127
+ background-color: var(--background-color-mandatory);
128
+ border: 1px solid var(--border-color-mandatory);
129
+ }
130
+ .llm-panel .email-input-message {
131
+ color: var(--text-color-manadatory);
132
+ font-size: 0.8em;
133
+ margin-top: var(--spacing-small);
134
+ }
135
+ .llm-panel .email-input-invalid::placeholder {
136
+ color: var(--text-color-manadatory);
137
+ }
138
+ .llm-panel .email-input-set {
139
+ flex: 1;
140
+ color: var(--input-text-color);
141
+ padding: var(--spacing-small);
142
+ background-color: var(--background-color);
143
+ border: 0px solid var(--background-color);
144
+ opacity: 0.7;
145
+ user-select: none;
146
+ }
147
+ .llm-panel .email-input-button:hover {
148
+ background-color: var(--button-background-color-hover);
149
+ color: var(--button-text-color-hover);
150
+ }
151
+ .llm-panel .email-input-button {
152
+ padding: var(--spacing-small);
153
+ background-color: var(--button-background-color);
154
+ color: var(--button-text-color);
155
+ border-radius: var(--border-radius);
156
+ border: 1px solid var(--button-border-color);
157
+ cursor: pointer;
158
+ transition: background-color 0.3s ease;
159
+ white-space: nowrap;
160
+ }
97
161
  .llm-panel .chat-input {
98
162
  flex: 1;
99
163
  color: var(--input-text-color);
@@ -112,6 +176,13 @@
112
176
  border: 2px solid var(--button-background-color-hover);
113
177
  box-shadow: 0 0 5px var(--button-background-color-hover);
114
178
  }
179
+ .llm-panel .chat-input:disabled {
180
+ background-color: var(--button-disabled-background-color);
181
+ cursor: not-allowed;
182
+ }
183
+ .llm-panel .chat-input:disabled::placeholder {
184
+ color: var(--button-disabled-color);
185
+ }
115
186
  .llm-panel .send-button {
116
187
  margin-right: var(--spacing-small);
117
188
  padding: var(--spacing-small);
@@ -129,6 +200,11 @@
129
200
  background-color: var(--button-background-color-hover);
130
201
  color: var(--button-text-color-hover);
131
202
  }
203
+ .llm-panel .send-button:disabled {
204
+ cursor: not-allowed;
205
+ color: var(--button-disabled-color);
206
+ background-color: var(--button-disabled-background-color);
207
+ }
132
208
  .llm-panel .history-entry {
133
209
  background-color: var(--background-color);
134
210
  padding-bottom: var(--spacing-medium);
@@ -180,6 +256,12 @@
180
256
  background-color: var(--button-background-color-hover);
181
257
  box-shadow: 0 0 5px var(--button-background-color-hover);
182
258
  }
259
+ .llm-panel .copy-button:disabled,
260
+ .llm-panel .thumbs-button:disabled {
261
+ cursor: not-allowed;
262
+ color: var(--button-disabled-color);
263
+ background-color: var(--button-disabled-background-color);
264
+ }
183
265
  .llm-panel .icon-svg {
184
266
  width: var(--icon-size-small);
185
267
  height: var(--icon-size-small);
@@ -242,6 +324,11 @@
242
324
  transition: background-color 0.3s ease, transform 0.3s ease;
243
325
  box-shadow: var(--button-drop-shadow);
244
326
  }
327
+ .llm-panel .save-button:disabled {
328
+ cursor: not-allowed;
329
+ color: var(--button-disabled-color);
330
+ background-color: var(--button-disabled-background-color);
331
+ }
245
332
  .llm-panel .save-button:hover {
246
333
  background-color: var(--button-background-color-hover);
247
334
  color: var(--button-text-color-hover);
@@ -262,8 +349,8 @@
262
349
  color: var(--button-text-color-hover);
263
350
  }
264
351
  .llm-panel .suggestion-button:disabled {
265
- background-color: #cccccc;
266
- color: #666666;
352
+ background-color: var(--button-disabled-color);
353
+ color: var(--button-disabled-background-color);
267
354
  cursor: not-allowed;
268
355
  }
269
356
  .powered-by {
package/dist/index.d.mts CHANGED
@@ -57,7 +57,6 @@ interface ChatPanelProps {
57
57
  callToActionButtonText?: string;
58
58
  callToActionEmailAddress?: string;
59
59
  callToActionEmailSubject?: string;
60
- callToActionMustSendEmail?: boolean;
61
60
  initialHistory?: {
62
61
  [prompt: string]: {
63
62
  content: string;
@@ -66,6 +65,8 @@ interface ChatPanelProps {
66
65
  };
67
66
  hideRagContextInPrompt?: boolean;
68
67
  createConversationOnFirstChat?: boolean;
68
+ customerEmailCaptureMode?: "hide" | "optional" | "required";
69
+ customerEmailCapturePlaceholder?: string;
69
70
  }
70
71
  interface ExtraProps$1 extends React.HTMLAttributes<HTMLElement> {
71
72
  inline?: boolean;
package/dist/index.d.ts CHANGED
@@ -57,7 +57,6 @@ interface ChatPanelProps {
57
57
  callToActionButtonText?: string;
58
58
  callToActionEmailAddress?: string;
59
59
  callToActionEmailSubject?: string;
60
- callToActionMustSendEmail?: boolean;
61
60
  initialHistory?: {
62
61
  [prompt: string]: {
63
62
  content: string;
@@ -66,6 +65,8 @@ interface ChatPanelProps {
66
65
  };
67
66
  hideRagContextInPrompt?: boolean;
68
67
  createConversationOnFirstChat?: boolean;
68
+ customerEmailCaptureMode?: "hide" | "optional" | "required";
69
+ customerEmailCapturePlaceholder?: string;
69
70
  }
70
71
  interface ExtraProps$1 extends React.HTMLAttributes<HTMLElement> {
71
72
  inline?: boolean;