@bikdotai/bik-component-library 0.0.862 → 0.0.863-beta.1

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 (92) hide show
  1. package/dist/cjs/components/bik-copilot/BIKCopilot.js +2 -0
  2. package/dist/cjs/components/bik-copilot/BIKCopilot.js.map +1 -0
  3. package/dist/cjs/components/bik-copilot/ControlledCopilot.js +2 -0
  4. package/dist/cjs/components/bik-copilot/ControlledCopilot.js.map +1 -0
  5. package/dist/cjs/components/bik-copilot/ControlledCopilot.styled.js +27 -0
  6. package/dist/cjs/components/bik-copilot/ControlledCopilot.styled.js.map +1 -0
  7. package/dist/cjs/components/bik-copilot/CopilotBall.js +2 -0
  8. package/dist/cjs/components/bik-copilot/CopilotBall.js.map +1 -0
  9. package/dist/cjs/components/bik-copilot/CopilotBall.styled.js +42 -0
  10. package/dist/cjs/components/bik-copilot/CopilotBall.styled.js.map +1 -0
  11. package/dist/cjs/components/bik-copilot/CopilotPanel.js +2 -0
  12. package/dist/cjs/components/bik-copilot/CopilotPanel.js.map +1 -0
  13. package/dist/cjs/components/bik-copilot/CopilotPanel.styled.js +460 -0
  14. package/dist/cjs/components/bik-copilot/CopilotPanel.styled.js.map +1 -0
  15. package/dist/cjs/components/bik-copilot/copilotPlacement.js +2 -0
  16. package/dist/cjs/components/bik-copilot/copilotPlacement.js.map +1 -0
  17. package/dist/cjs/components/bik-copilot/services/copilotDb.js +2 -0
  18. package/dist/cjs/components/bik-copilot/services/copilotDb.js.map +1 -0
  19. package/dist/cjs/components/bik-copilot/services/copilotIcebreakersClient.js +2 -0
  20. package/dist/cjs/components/bik-copilot/services/copilotIcebreakersClient.js.map +1 -0
  21. package/dist/cjs/components/bik-copilot/services/copilotMessagesClient.js +2 -0
  22. package/dist/cjs/components/bik-copilot/services/copilotMessagesClient.js.map +1 -0
  23. package/dist/cjs/components/bik-copilot/services/copilotPageSession.js +2 -0
  24. package/dist/cjs/components/bik-copilot/services/copilotPageSession.js.map +1 -0
  25. package/dist/cjs/components/bik-copilot/services/copilotSseParser.js +7 -0
  26. package/dist/cjs/components/bik-copilot/services/copilotSseParser.js.map +1 -0
  27. package/dist/cjs/components/bik-copilot/services/copilotStreamClient.js +2 -0
  28. package/dist/cjs/components/bik-copilot/services/copilotStreamClient.js.map +1 -0
  29. package/dist/cjs/components/bik-copilot/useCopilotIcebreakers.js +2 -0
  30. package/dist/cjs/components/bik-copilot/useCopilotIcebreakers.js.map +1 -0
  31. package/dist/cjs/components/bik-copilot/useCopilotStreamChat.js +2 -0
  32. package/dist/cjs/components/bik-copilot/useCopilotStreamChat.js.map +1 -0
  33. package/dist/cjs/components/bik-copilot/useDraggableFloater.js +2 -0
  34. package/dist/cjs/components/bik-copilot/useDraggableFloater.js.map +1 -0
  35. package/dist/cjs/index.js +1 -1
  36. package/dist/esm/components/bik-copilot/BIKCopilot.d.ts +32 -0
  37. package/dist/esm/components/bik-copilot/BIKCopilot.js +114 -0
  38. package/dist/esm/components/bik-copilot/BIKCopilot.js.map +1 -0
  39. package/dist/esm/components/bik-copilot/ControlledCopilot.d.ts +14 -0
  40. package/dist/esm/components/bik-copilot/ControlledCopilot.js +170 -0
  41. package/dist/esm/components/bik-copilot/ControlledCopilot.js.map +1 -0
  42. package/dist/esm/components/bik-copilot/ControlledCopilot.styled.d.ts +7 -0
  43. package/dist/esm/components/bik-copilot/ControlledCopilot.styled.js +31 -0
  44. package/dist/esm/components/bik-copilot/ControlledCopilot.styled.js.map +1 -0
  45. package/dist/esm/components/bik-copilot/CopilotBall.d.ts +13 -0
  46. package/dist/esm/components/bik-copilot/CopilotBall.js +50 -0
  47. package/dist/esm/components/bik-copilot/CopilotBall.js.map +1 -0
  48. package/dist/esm/components/bik-copilot/CopilotBall.styled.d.ts +9 -0
  49. package/dist/esm/components/bik-copilot/CopilotBall.styled.js +46 -0
  50. package/dist/esm/components/bik-copilot/CopilotBall.styled.js.map +1 -0
  51. package/dist/esm/components/bik-copilot/CopilotPanel.d.ts +9 -0
  52. package/dist/esm/components/bik-copilot/CopilotPanel.js +379 -0
  53. package/dist/esm/components/bik-copilot/CopilotPanel.js.map +1 -0
  54. package/dist/esm/components/bik-copilot/CopilotPanel.styled.d.ts +64 -0
  55. package/dist/esm/components/bik-copilot/CopilotPanel.styled.js +496 -0
  56. package/dist/esm/components/bik-copilot/CopilotPanel.styled.js.map +1 -0
  57. package/dist/esm/components/bik-copilot/copilotPlacement.d.ts +24 -0
  58. package/dist/esm/components/bik-copilot/copilotPlacement.js +38 -0
  59. package/dist/esm/components/bik-copilot/copilotPlacement.js.map +1 -0
  60. package/dist/esm/components/bik-copilot/index.d.ts +16 -0
  61. package/dist/esm/components/bik-copilot/model.d.ts +674 -0
  62. package/dist/esm/components/bik-copilot/services/copilotDb.d.ts +90 -0
  63. package/dist/esm/components/bik-copilot/services/copilotDb.js +96 -0
  64. package/dist/esm/components/bik-copilot/services/copilotDb.js.map +1 -0
  65. package/dist/esm/components/bik-copilot/services/copilotIcebreakersClient.d.ts +11 -0
  66. package/dist/esm/components/bik-copilot/services/copilotIcebreakersClient.js +54 -0
  67. package/dist/esm/components/bik-copilot/services/copilotIcebreakersClient.js.map +1 -0
  68. package/dist/esm/components/bik-copilot/services/copilotMessagesClient.d.ts +23 -0
  69. package/dist/esm/components/bik-copilot/services/copilotMessagesClient.js +78 -0
  70. package/dist/esm/components/bik-copilot/services/copilotMessagesClient.js.map +1 -0
  71. package/dist/esm/components/bik-copilot/services/copilotPageSession.d.ts +37 -0
  72. package/dist/esm/components/bik-copilot/services/copilotPageSession.js +35 -0
  73. package/dist/esm/components/bik-copilot/services/copilotPageSession.js.map +1 -0
  74. package/dist/esm/components/bik-copilot/services/copilotSseParser.d.ts +22 -0
  75. package/dist/esm/components/bik-copilot/services/copilotSseParser.js +52 -0
  76. package/dist/esm/components/bik-copilot/services/copilotSseParser.js.map +1 -0
  77. package/dist/esm/components/bik-copilot/services/copilotStreamClient.d.ts +31 -0
  78. package/dist/esm/components/bik-copilot/services/copilotStreamClient.js +103 -0
  79. package/dist/esm/components/bik-copilot/services/copilotStreamClient.js.map +1 -0
  80. package/dist/esm/components/bik-copilot/useCopilotIcebreakers.d.ts +17 -0
  81. package/dist/esm/components/bik-copilot/useCopilotIcebreakers.js +60 -0
  82. package/dist/esm/components/bik-copilot/useCopilotIcebreakers.js.map +1 -0
  83. package/dist/esm/components/bik-copilot/useCopilotStreamChat.d.ts +20 -0
  84. package/dist/esm/components/bik-copilot/useCopilotStreamChat.js +333 -0
  85. package/dist/esm/components/bik-copilot/useCopilotStreamChat.js.map +1 -0
  86. package/dist/esm/components/bik-copilot/useDraggableFloater.d.ts +9 -0
  87. package/dist/esm/components/bik-copilot/useDraggableFloater.js +118 -0
  88. package/dist/esm/components/bik-copilot/useDraggableFloater.js.map +1 -0
  89. package/dist/esm/index.d.ts +1 -0
  90. package/dist/esm/index.js +832 -782
  91. package/dist/esm/index.js.map +1 -1
  92. package/package.json +1 -1
@@ -0,0 +1,496 @@
1
+ import t from "styled-components";
2
+ import { COLORS as e } from "../../constants/Theme.js";
3
+ const i = t.div`
4
+ display: flex;
5
+ flex-direction: column;
6
+ min-height: 0;
7
+ overflow: hidden;
8
+ background: ${e.surface.standard};
9
+ border: 1px solid ${e.stroke.primary};
10
+ border-radius: 16px;
11
+ box-shadow: 0 16px 48px rgba(40, 3, 78, 0.18);
12
+ `, a = t.div`
13
+ display: flex;
14
+ align-items: flex-start;
15
+ gap: 10px;
16
+ padding: 12px 12px 12px 16px;
17
+ border-bottom: 1px solid ${e.stroke.primary};
18
+ flex-shrink: 0;
19
+ `, s = t.div`
20
+ width: 32px;
21
+ height: 32px;
22
+ flex-shrink: 0;
23
+ border-radius: 8px;
24
+ background: ${e.background.base};
25
+ display: flex;
26
+ align-items: center;
27
+ justify-content: center;
28
+ color: ${e.content.brand};
29
+ overflow: hidden;
30
+ `, d = t.div`
31
+ display: flex;
32
+ flex-direction: column;
33
+ gap: 2px;
34
+ min-width: 0;
35
+ flex: 1;
36
+ `, l = t.div`
37
+ display: flex;
38
+ align-items: center;
39
+ gap: 6px;
40
+ `, p = t.span`
41
+ padding: 1px 6px;
42
+ border-radius: 4px;
43
+ background: ${e.background.brandLight};
44
+ color: ${e.content.brand};
45
+ font-size: 10px;
46
+ font-weight: 600;
47
+ line-height: 16px;
48
+ white-space: nowrap;
49
+ `, c = t.div`
50
+ display: flex;
51
+ align-items: center;
52
+ gap: 2px;
53
+ flex-shrink: 0;
54
+ `, x = t.button`
55
+ width: 28px;
56
+ height: 28px;
57
+ display: flex;
58
+ align-items: center;
59
+ justify-content: center;
60
+ padding: 0;
61
+ border: none;
62
+ border-radius: 6px;
63
+ background: transparent;
64
+ color: ${e.content.secondary};
65
+ cursor: pointer;
66
+ transition: background 0.15s ease, color 0.15s ease;
67
+
68
+ &:hover {
69
+ background: ${e.surface.hovered};
70
+ color: ${e.content.primary};
71
+ }
72
+
73
+ &:focus-visible {
74
+ outline: 2px solid ${e.stroke.brand};
75
+ outline-offset: 1px;
76
+ }
77
+ `, g = t.div`
78
+ position: relative;
79
+ flex: 1;
80
+ min-height: 0;
81
+ display: flex;
82
+ flex-direction: column;
83
+ `, b = t.div`
84
+ flex: 1;
85
+ min-height: 0;
86
+ overflow-y: auto;
87
+ padding: 16px;
88
+ display: flex;
89
+ flex-direction: column;
90
+ gap: 12px;
91
+
92
+ &::-webkit-scrollbar {
93
+ width: 6px;
94
+ }
95
+
96
+ &::-webkit-scrollbar-thumb {
97
+ background: ${e.background.inactive};
98
+ border-radius: 3px;
99
+ }
100
+ `, f = t.div`
101
+ position: absolute;
102
+ left: 0;
103
+ right: 0;
104
+ bottom: 0;
105
+ height: 72px;
106
+ pointer-events: none;
107
+ opacity: ${(n) => n.$visible ? 1 : 0};
108
+ transition: opacity 0.2s ease;
109
+ background: linear-gradient(
110
+ to bottom,
111
+ ${e.surface.standard}00 0%,
112
+ ${e.surface.standard}B3 55%,
113
+ ${e.surface.standard} 100%
114
+ );
115
+
116
+ &::after {
117
+ content: '';
118
+ position: absolute;
119
+ inset: 0;
120
+ backdrop-filter: blur(2px);
121
+ -webkit-backdrop-filter: blur(2px);
122
+ mask-image: linear-gradient(to bottom, transparent 0%, #000 60%);
123
+ -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 60%);
124
+ }
125
+ `, u = t.button`
126
+ position: absolute;
127
+ left: 50%;
128
+ bottom: 12px;
129
+ transform: translateX(-50%)
130
+ translateY(${(n) => n.$visible ? "0" : "6px"});
131
+ width: 28px;
132
+ height: 28px;
133
+ display: flex;
134
+ align-items: center;
135
+ justify-content: center;
136
+ padding: 0;
137
+ border: 1px solid ${e.stroke.primary};
138
+ border-radius: 999px;
139
+ background: ${e.surface.standard};
140
+ color: ${e.content.secondary};
141
+ box-shadow: 0 2px 8px rgba(40, 3, 78, 0.16);
142
+ cursor: pointer;
143
+ opacity: ${(n) => n.$visible ? 1 : 0};
144
+ /* Hidden to the pointer and to focus order while it is faded out. */
145
+ visibility: ${(n) => n.$visible ? "visible" : "hidden"};
146
+ transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease,
147
+ background 0.15s ease, color 0.15s ease;
148
+
149
+ &:hover {
150
+ background: ${e.surface.hovered};
151
+ color: ${e.content.primary};
152
+ }
153
+
154
+ &:focus-visible {
155
+ outline: 2px solid ${e.stroke.brand};
156
+ outline-offset: 1px;
157
+ }
158
+ `, h = t.div`
159
+ flex: 1;
160
+ display: flex;
161
+ flex-direction: column;
162
+ align-items: center;
163
+ justify-content: center;
164
+ gap: 8px;
165
+ text-align: center;
166
+ padding: 8px 4px;
167
+ `, m = t.div`
168
+ color: ${e.content.brand};
169
+ display: flex;
170
+ align-items: center;
171
+ justify-content: center;
172
+ margin-bottom: 4px;
173
+ `, y = t.div`
174
+ display: flex;
175
+ flex-direction: column;
176
+ align-items: center;
177
+ gap: 8px;
178
+ margin-top: 12px;
179
+ width: 100%;
180
+ `, k = t.button`
181
+ display: inline-flex;
182
+ align-items: center;
183
+ gap: 6px;
184
+ max-width: 100%;
185
+ padding: 8px 14px;
186
+ border: 1px solid ${e.stroke.primary};
187
+ border-radius: 999px;
188
+ background: ${e.surface.standard};
189
+ color: ${e.content.primary};
190
+ font-family: Inter;
191
+ font-size: 13px;
192
+ line-height: 18px;
193
+ text-align: left;
194
+ cursor: pointer;
195
+ transition: border-color 0.15s ease, background 0.15s ease;
196
+
197
+ svg {
198
+ flex-shrink: 0;
199
+ color: ${e.content.brand};
200
+ }
201
+
202
+ &:hover:not(:disabled) {
203
+ border-color: ${e.stroke.brand};
204
+ background: ${e.background.brandVeryLight};
205
+ }
206
+
207
+ &:disabled {
208
+ cursor: not-allowed;
209
+ opacity: 0.5;
210
+ }
211
+ `, $ = t.div`
212
+ font-family: Inter;
213
+ font-size: 13px;
214
+ line-height: 20px;
215
+ word-break: break-word;
216
+ overflow-wrap: break-word;
217
+
218
+ ${(n) => n.$role === "user" ? `
219
+ align-self: flex-end;
220
+ max-width: 85%;
221
+ padding: 10px 14px;
222
+ border-radius: 12px;
223
+ border-bottom-right-radius: 4px;
224
+ background: ${e.background.brandLight};
225
+ color: ${e.content.primary};
226
+ ` : n.$role === "system" ? `
227
+ align-self: center;
228
+ max-width: 90%;
229
+ padding: 6px 10px;
230
+ border-radius: 8px;
231
+ background: ${e.surface.grey};
232
+ color: ${e.content.secondary};
233
+ font-size: 12px;
234
+ text-align: center;
235
+ ` : `
236
+ align-self: flex-start;
237
+ max-width: 90%;
238
+ padding: 10px 14px;
239
+ border-radius: 12px;
240
+ border-bottom-left-radius: 4px;
241
+ background: ${e.surface.grey};
242
+ color: ${e.content.primary};
243
+ border: 1px solid ${e.stroke.primary};
244
+ `}
245
+
246
+ /* Markdown emitted by renderMarkdownLite */
247
+ h1,
248
+ h2,
249
+ h3,
250
+ h4 {
251
+ font-size: 14px;
252
+ font-weight: 600;
253
+ margin: 4px 0;
254
+ }
255
+
256
+ pre {
257
+ background: ${e.background.base};
258
+ border-radius: 6px;
259
+ padding: 8px;
260
+ margin: 6px 0;
261
+ overflow-x: auto;
262
+ font-size: 12px;
263
+ }
264
+
265
+ a {
266
+ color: ${e.content.brand};
267
+ }
268
+ `, v = t.div`
269
+ align-self: flex-start;
270
+ display: inline-flex;
271
+ align-items: center;
272
+ gap: 8px;
273
+ padding: 12px 14px;
274
+ border-radius: 12px;
275
+ border-bottom-left-radius: 4px;
276
+ background: ${e.surface.grey};
277
+ border: 1px solid ${e.stroke.primary};
278
+ `, w = t.div`
279
+ align-self: center;
280
+ display: inline-flex;
281
+ align-items: center;
282
+ gap: 8px;
283
+ padding: 4px 0;
284
+ font-family: Inter;
285
+ font-size: 11px;
286
+ line-height: 16px;
287
+ color: ${e.content.placeholder};
288
+ `, I = t.div`
289
+ display: flex;
290
+ flex-direction: column;
291
+ align-items: stretch;
292
+ gap: 8px;
293
+ margin-top: 4px;
294
+ `, z = t.div`
295
+ font-family: Inter;
296
+ font-size: 11px;
297
+ line-height: 16px;
298
+ color: ${e.content.placeholder};
299
+ `, L = t.button`
300
+ display: flex;
301
+ align-items: center;
302
+ gap: 8px;
303
+ width: 100%;
304
+ padding: 10px 14px;
305
+ border: 1px solid ${e.stroke.primary};
306
+ border-radius: 10px;
307
+ background: ${e.surface.standard};
308
+ color: ${e.content.primary};
309
+ font-family: Inter;
310
+ font-size: 13px;
311
+ line-height: 18px;
312
+ text-align: left;
313
+ cursor: pointer;
314
+ transition: border-color 0.15s ease, background 0.15s ease;
315
+
316
+ svg {
317
+ flex-shrink: 0;
318
+ color: ${e.content.secondary};
319
+ }
320
+
321
+ &:hover:not(:disabled) {
322
+ border-color: ${e.stroke.brand};
323
+ background: ${e.background.brandVeryLight};
324
+ }
325
+
326
+ &:disabled {
327
+ cursor: not-allowed;
328
+ opacity: 0.5;
329
+ }
330
+ `, H = t.div`
331
+ align-self: flex-start;
332
+ display: inline-flex;
333
+ align-items: center;
334
+ gap: 6px;
335
+ font-family: Inter;
336
+ font-size: 12px;
337
+ line-height: 18px;
338
+ color: ${e.content.secondary};
339
+
340
+ svg {
341
+ flex-shrink: 0;
342
+ color: ${e.content.inactive};
343
+ }
344
+ `, M = t.div`
345
+ align-self: flex-start;
346
+ display: flex;
347
+ align-items: center;
348
+ gap: 2px;
349
+ margin-top: -4px;
350
+ `, A = t.button`
351
+ display: inline-flex;
352
+ align-items: center;
353
+ gap: 4px;
354
+ height: 24px;
355
+ padding: 0 6px;
356
+ border: none;
357
+ border-radius: 6px;
358
+ background: transparent;
359
+ color: ${e.content.placeholder};
360
+ font-family: Inter;
361
+ font-size: 11px;
362
+ line-height: 16px;
363
+ cursor: pointer;
364
+ transition: background 0.15s ease, color 0.15s ease;
365
+
366
+ svg {
367
+ flex-shrink: 0;
368
+ }
369
+
370
+ &:hover {
371
+ background: ${e.surface.hovered};
372
+ color: ${e.content.secondary};
373
+ }
374
+
375
+ &:focus-visible {
376
+ outline: 2px solid ${e.stroke.brand};
377
+ outline-offset: 1px;
378
+ }
379
+
380
+ /* Confirmation reads as success, not as another affordance. */
381
+ &[data-copied='true'],
382
+ &[data-copied='true']:hover {
383
+ color: ${e.content.positive};
384
+ }
385
+ `, B = t.span`
386
+ font-family: Inter;
387
+ font-size: 13px;
388
+ line-height: 20px;
389
+ color: ${e.content.secondary};
390
+ `, S = t.div`
391
+ margin: 0 16px;
392
+ padding: 8px 10px;
393
+ border-radius: 8px;
394
+ background: ${e.background.negative.light};
395
+ color: ${e.content.negative};
396
+ font-family: Inter;
397
+ font-size: 12px;
398
+ line-height: 18px;
399
+ flex-shrink: 0;
400
+ `, j = t.div`
401
+ padding: 12px 16px 4px;
402
+ flex-shrink: 0;
403
+ `, C = t.div`
404
+ display: flex;
405
+ align-items: flex-end;
406
+ gap: 8px;
407
+ padding: 8px 8px 8px 12px;
408
+ border: 1px solid
409
+ ${(n) => n.$focused ? e.stroke.brand : e.stroke.primary};
410
+ border-radius: 12px;
411
+ background: ${e.surface.standard};
412
+ transition: border-color 0.15s ease;
413
+ `, T = t.textarea`
414
+ flex: 1;
415
+ border: none;
416
+ outline: none;
417
+ resize: none;
418
+ background: transparent;
419
+ font-family: Inter;
420
+ font-size: 13px;
421
+ line-height: 20px;
422
+ color: ${e.content.primary};
423
+ max-height: 96px;
424
+ min-height: 20px;
425
+ padding: 4px 0;
426
+
427
+ &::placeholder {
428
+ color: ${e.content.placeholder};
429
+ }
430
+
431
+ &:disabled {
432
+ cursor: not-allowed;
433
+ }
434
+ `, F = t.button`
435
+ width: 28px;
436
+ height: 28px;
437
+ flex-shrink: 0;
438
+ display: flex;
439
+ align-items: center;
440
+ justify-content: center;
441
+ padding: 0;
442
+ border: none;
443
+ border-radius: 8px;
444
+ background: ${(n) => n.$active ? e.background.brand : e.background.brandLight};
445
+ color: ${(n) => n.$active ? e.content.primaryInverse : e.content.inactive};
446
+ cursor: ${(n) => n.$active ? "pointer" : "not-allowed"};
447
+ transition: background 0.15s ease, color 0.15s ease;
448
+
449
+ &:focus-visible {
450
+ outline: 2px solid ${e.stroke.brand};
451
+ outline-offset: 1px;
452
+ }
453
+ `, E = t.div`
454
+ padding: 6px 16px 12px;
455
+ text-align: center;
456
+ font-family: Inter;
457
+ font-size: 11px;
458
+ line-height: 16px;
459
+ color: ${e.content.placeholder};
460
+ flex-shrink: 0;
461
+ `;
462
+ export {
463
+ E as Disclaimer,
464
+ h as EmptyState,
465
+ m as EmptyStateIcon,
466
+ S as ErrorBanner,
467
+ L as FollowUpChip,
468
+ I as FollowUpList,
469
+ z as FollowUpsLabel,
470
+ c as HeaderActions,
471
+ s as HeaderAvatar,
472
+ p as HeaderBadge,
473
+ d as HeaderText,
474
+ l as HeaderTitleRow,
475
+ w as HistoryLoader,
476
+ x as IconAction,
477
+ j as InputArea,
478
+ C as InputWrapper,
479
+ H as InterruptedNote,
480
+ u as JumpToLatestButton,
481
+ A as MessageAction,
482
+ M as MessageActions,
483
+ $ as MessageBubble,
484
+ T as MessageInput,
485
+ b as MessagesArea,
486
+ g as MessagesViewport,
487
+ i as PanelContainer,
488
+ a as PanelHeader,
489
+ f as ScrollFade,
490
+ F as SendButton,
491
+ k as SuggestionChip,
492
+ y as SuggestionList,
493
+ v as ThinkingBubble,
494
+ B as ThinkingLabel
495
+ };
496
+ //# sourceMappingURL=CopilotPanel.styled.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CopilotPanel.styled.js","sources":["../../../../src/components/bik-copilot/CopilotPanel.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const PanelContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-height: 0;\n\toverflow: hidden;\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 16px;\n\tbox-shadow: 0 16px 48px rgba(40, 3, 78, 0.18);\n`;\n\nexport const PanelHeader = styled.div`\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 10px;\n\tpadding: 12px 12px 12px 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const HeaderAvatar = styled.div`\n\twidth: 32px;\n\theight: 32px;\n\tflex-shrink: 0;\n\tborder-radius: 8px;\n\tbackground: ${COLORS.background.base};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tcolor: ${COLORS.content.brand};\n\toverflow: hidden;\n`;\n\nexport const HeaderText = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 2px;\n\tmin-width: 0;\n\tflex: 1;\n`;\n\nexport const HeaderTitleRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 6px;\n`;\n\nexport const HeaderBadge = styled.span`\n\tpadding: 1px 6px;\n\tborder-radius: 4px;\n\tbackground: ${COLORS.background.brandLight};\n\tcolor: ${COLORS.content.brand};\n\tfont-size: 10px;\n\tfont-weight: 600;\n\tline-height: 16px;\n\twhite-space: nowrap;\n`;\n\nexport const HeaderActions = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 2px;\n\tflex-shrink: 0;\n`;\n\nexport const IconAction = styled.button`\n\twidth: 28px;\n\theight: 28px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tpadding: 0;\n\tborder: none;\n\tborder-radius: 6px;\n\tbackground: transparent;\n\tcolor: ${COLORS.content.secondary};\n\tcursor: pointer;\n\ttransition: background 0.15s ease, color 0.15s ease;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.hovered};\n\t\tcolor: ${COLORS.content.primary};\n\t}\n\n\t&:focus-visible {\n\t\toutline: 2px solid ${COLORS.stroke.brand};\n\t\toutline-offset: 1px;\n\t}\n`;\n\n/**\n * Wraps the scroller so the bottom fade and the jump-to-latest button can be\n * absolutely positioned over it.\n */\nexport const MessagesViewport = styled.div`\n\tposition: relative;\n\tflex: 1;\n\tmin-height: 0;\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const MessagesArea = styled.div`\n\tflex: 1;\n\tmin-height: 0;\n\toverflow-y: auto;\n\tpadding: 16px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 12px;\n\n\t&::-webkit-scrollbar {\n\t\twidth: 6px;\n\t}\n\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground: ${COLORS.background.inactive};\n\t\tborder-radius: 3px;\n\t}\n`;\n\n/**\n * Softens the cut-off edge of a long answer the reader has scrolled up from, so\n * the clipped line reads as continuing rather than as the end of the message.\n *\n * Two layers, because one element cannot ramp a gradient and a blur\n * independently: the element itself whitens the text out, and `::after` lays a\n * masked blur over it that strengthens towards the bottom. Browsers without\n * `backdrop-filter` still get the fade.\n */\nexport const ScrollFade = styled.div<{ $visible: boolean }>`\n\tposition: absolute;\n\tleft: 0;\n\tright: 0;\n\tbottom: 0;\n\theight: 72px;\n\tpointer-events: none;\n\topacity: ${(props) => (props.$visible ? 1 : 0)};\n\ttransition: opacity 0.2s ease;\n\tbackground: linear-gradient(\n\t\tto bottom,\n\t\t${COLORS.surface.standard}00 0%,\n\t\t${COLORS.surface.standard}B3 55%,\n\t\t${COLORS.surface.standard} 100%\n\t);\n\n\t&::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tinset: 0;\n\t\tbackdrop-filter: blur(2px);\n\t\t-webkit-backdrop-filter: blur(2px);\n\t\tmask-image: linear-gradient(to bottom, transparent 0%, #000 60%);\n\t\t-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 60%);\n\t}\n`;\n\nexport const JumpToLatestButton = styled.button<{ $visible: boolean }>`\n\tposition: absolute;\n\tleft: 50%;\n\tbottom: 12px;\n\ttransform: translateX(-50%)\n\t\ttranslateY(${(props) => (props.$visible ? '0' : '6px')});\n\twidth: 28px;\n\theight: 28px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tpadding: 0;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 999px;\n\tbackground: ${COLORS.surface.standard};\n\tcolor: ${COLORS.content.secondary};\n\tbox-shadow: 0 2px 8px rgba(40, 3, 78, 0.16);\n\tcursor: pointer;\n\topacity: ${(props) => (props.$visible ? 1 : 0)};\n\t/* Hidden to the pointer and to focus order while it is faded out. */\n\tvisibility: ${(props) => (props.$visible ? 'visible' : 'hidden')};\n\ttransition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease,\n\t\tbackground 0.15s ease, color 0.15s ease;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.hovered};\n\t\tcolor: ${COLORS.content.primary};\n\t}\n\n\t&:focus-visible {\n\t\toutline: 2px solid ${COLORS.stroke.brand};\n\t\toutline-offset: 1px;\n\t}\n`;\n\nexport const EmptyState = styled.div`\n\tflex: 1;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: 8px;\n\ttext-align: center;\n\tpadding: 8px 4px;\n`;\n\nexport const EmptyStateIcon = styled.div`\n\tcolor: ${COLORS.content.brand};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmargin-bottom: 4px;\n`;\n\nexport const SuggestionList = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tgap: 8px;\n\tmargin-top: 12px;\n\twidth: 100%;\n`;\n\nexport const SuggestionChip = styled.button`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tmax-width: 100%;\n\tpadding: 8px 14px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 999px;\n\tbackground: ${COLORS.surface.standard};\n\tcolor: ${COLORS.content.primary};\n\tfont-family: Inter;\n\tfont-size: 13px;\n\tline-height: 18px;\n\ttext-align: left;\n\tcursor: pointer;\n\ttransition: border-color 0.15s ease, background 0.15s ease;\n\n\tsvg {\n\t\tflex-shrink: 0;\n\t\tcolor: ${COLORS.content.brand};\n\t}\n\n\t&:hover:not(:disabled) {\n\t\tborder-color: ${COLORS.stroke.brand};\n\t\tbackground: ${COLORS.background.brandVeryLight};\n\t}\n\n\t&:disabled {\n\t\tcursor: not-allowed;\n\t\topacity: 0.5;\n\t}\n`;\n\nexport const MessageBubble = styled.div<{\n\t$role: 'user' | 'assistant' | 'system';\n}>`\n\tfont-family: Inter;\n\tfont-size: 13px;\n\tline-height: 20px;\n\tword-break: break-word;\n\toverflow-wrap: break-word;\n\n\t${(props) => {\n\t\tif (props.$role === 'user') {\n\t\t\treturn `\n\t\t\t\talign-self: flex-end;\n\t\t\t\tmax-width: 85%;\n\t\t\t\tpadding: 10px 14px;\n\t\t\t\tborder-radius: 12px;\n\t\t\t\tborder-bottom-right-radius: 4px;\n\t\t\t\tbackground: ${COLORS.background.brandLight};\n\t\t\t\tcolor: ${COLORS.content.primary};\n\t\t\t`;\n\t\t}\n\t\tif (props.$role === 'system') {\n\t\t\treturn `\n\t\t\t\talign-self: center;\n\t\t\t\tmax-width: 90%;\n\t\t\t\tpadding: 6px 10px;\n\t\t\t\tborder-radius: 8px;\n\t\t\t\tbackground: ${COLORS.surface.grey};\n\t\t\t\tcolor: ${COLORS.content.secondary};\n\t\t\t\tfont-size: 12px;\n\t\t\t\ttext-align: center;\n\t\t\t`;\n\t\t}\n\t\treturn `\n\t\t\talign-self: flex-start;\n\t\t\tmax-width: 90%;\n\t\t\tpadding: 10px 14px;\n\t\t\tborder-radius: 12px;\n\t\t\tborder-bottom-left-radius: 4px;\n\t\t\tbackground: ${COLORS.surface.grey};\n\t\t\tcolor: ${COLORS.content.primary};\n\t\t\tborder: 1px solid ${COLORS.stroke.primary};\n\t\t`;\n\t}}\n\n\t/* Markdown emitted by renderMarkdownLite */\n\th1,\n\th2,\n\th3,\n\th4 {\n\t\tfont-size: 14px;\n\t\tfont-weight: 600;\n\t\tmargin: 4px 0;\n\t}\n\n\tpre {\n\t\tbackground: ${COLORS.background.base};\n\t\tborder-radius: 6px;\n\t\tpadding: 8px;\n\t\tmargin: 6px 0;\n\t\toverflow-x: auto;\n\t\tfont-size: 12px;\n\t}\n\n\ta {\n\t\tcolor: ${COLORS.content.brand};\n\t}\n`;\n\nexport const ThinkingBubble = styled.div`\n\talign-self: flex-start;\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 12px 14px;\n\tborder-radius: 12px;\n\tborder-bottom-left-radius: 4px;\n\tbackground: ${COLORS.surface.grey};\n\tborder: 1px solid ${COLORS.stroke.primary};\n`;\n\n/** Sits above the oldest message while the page before it is fetched. */\nexport const HistoryLoader = styled.div`\n\talign-self: center;\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 4px 0;\n\tfont-family: Inter;\n\tfont-size: 11px;\n\tline-height: 16px;\n\tcolor: ${COLORS.content.placeholder};\n`;\n\nexport const FollowUpList = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: stretch;\n\tgap: 8px;\n\tmargin-top: 4px;\n`;\n\nexport const FollowUpsLabel = styled.div`\n\tfont-family: Inter;\n\tfont-size: 11px;\n\tline-height: 16px;\n\tcolor: ${COLORS.content.placeholder};\n`;\n\nexport const FollowUpChip = styled.button`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\twidth: 100%;\n\tpadding: 10px 14px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 10px;\n\tbackground: ${COLORS.surface.standard};\n\tcolor: ${COLORS.content.primary};\n\tfont-family: Inter;\n\tfont-size: 13px;\n\tline-height: 18px;\n\ttext-align: left;\n\tcursor: pointer;\n\ttransition: border-color 0.15s ease, background 0.15s ease;\n\n\tsvg {\n\t\tflex-shrink: 0;\n\t\tcolor: ${COLORS.content.secondary};\n\t}\n\n\t&:hover:not(:disabled) {\n\t\tborder-color: ${COLORS.stroke.brand};\n\t\tbackground: ${COLORS.background.brandVeryLight};\n\t}\n\n\t&:disabled {\n\t\tcursor: not-allowed;\n\t\topacity: 0.5;\n\t}\n`;\n\n/**\n * Bubble-less on purpose: a stopped reply is a note about the transcript, not a\n * message in it.\n */\nexport const InterruptedNote = styled.div`\n\talign-self: flex-start;\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tline-height: 18px;\n\tcolor: ${COLORS.content.secondary};\n\n\tsvg {\n\t\tflex-shrink: 0;\n\t\tcolor: ${COLORS.content.inactive};\n\t}\n`;\n\n/**\n * Actions under a finished assistant reply. Kept low-contrast so a row of icons\n * under every message does not compete with the answer itself.\n */\nexport const MessageActions = styled.div`\n\talign-self: flex-start;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 2px;\n\tmargin-top: -4px;\n`;\n\nexport const MessageAction = styled.button`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 4px;\n\theight: 24px;\n\tpadding: 0 6px;\n\tborder: none;\n\tborder-radius: 6px;\n\tbackground: transparent;\n\tcolor: ${COLORS.content.placeholder};\n\tfont-family: Inter;\n\tfont-size: 11px;\n\tline-height: 16px;\n\tcursor: pointer;\n\ttransition: background 0.15s ease, color 0.15s ease;\n\n\tsvg {\n\t\tflex-shrink: 0;\n\t}\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.hovered};\n\t\tcolor: ${COLORS.content.secondary};\n\t}\n\n\t&:focus-visible {\n\t\toutline: 2px solid ${COLORS.stroke.brand};\n\t\toutline-offset: 1px;\n\t}\n\n\t/* Confirmation reads as success, not as another affordance. */\n\t&[data-copied='true'],\n\t&[data-copied='true']:hover {\n\t\tcolor: ${COLORS.content.positive};\n\t}\n`;\n\nexport const ThinkingLabel = styled.span`\n\tfont-family: Inter;\n\tfont-size: 13px;\n\tline-height: 20px;\n\tcolor: ${COLORS.content.secondary};\n`;\n\nexport const ErrorBanner = styled.div`\n\tmargin: 0 16px;\n\tpadding: 8px 10px;\n\tborder-radius: 8px;\n\tbackground: ${COLORS.background.negative.light};\n\tcolor: ${COLORS.content.negative};\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tline-height: 18px;\n\tflex-shrink: 0;\n`;\n\nexport const InputArea = styled.div`\n\tpadding: 12px 16px 4px;\n\tflex-shrink: 0;\n`;\n\nexport const InputWrapper = styled.div<{ $focused: boolean }>`\n\tdisplay: flex;\n\talign-items: flex-end;\n\tgap: 8px;\n\tpadding: 8px 8px 8px 12px;\n\tborder: 1px solid\n\t\t${(props) => (props.$focused ? COLORS.stroke.brand : COLORS.stroke.primary)};\n\tborder-radius: 12px;\n\tbackground: ${COLORS.surface.standard};\n\ttransition: border-color 0.15s ease;\n`;\n\nexport const MessageInput = styled.textarea`\n\tflex: 1;\n\tborder: none;\n\toutline: none;\n\tresize: none;\n\tbackground: transparent;\n\tfont-family: Inter;\n\tfont-size: 13px;\n\tline-height: 20px;\n\tcolor: ${COLORS.content.primary};\n\tmax-height: 96px;\n\tmin-height: 20px;\n\tpadding: 4px 0;\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.placeholder};\n\t}\n\n\t&:disabled {\n\t\tcursor: not-allowed;\n\t}\n`;\n\nexport const SendButton = styled.button<{ $active: boolean }>`\n\twidth: 28px;\n\theight: 28px;\n\tflex-shrink: 0;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tpadding: 0;\n\tborder: none;\n\tborder-radius: 8px;\n\tbackground: ${(props) =>\n\t\tprops.$active ? COLORS.background.brand : COLORS.background.brandLight};\n\tcolor: ${(props) =>\n\t\tprops.$active ? COLORS.content.primaryInverse : COLORS.content.inactive};\n\tcursor: ${(props) => (props.$active ? 'pointer' : 'not-allowed')};\n\ttransition: background 0.15s ease, color 0.15s ease;\n\n\t&:focus-visible {\n\t\toutline: 2px solid ${COLORS.stroke.brand};\n\t\toutline-offset: 1px;\n\t}\n`;\n\nexport const Disclaimer = styled.div`\n\tpadding: 6px 16px 12px;\n\ttext-align: center;\n\tfont-family: Inter;\n\tfont-size: 11px;\n\tline-height: 16px;\n\tcolor: ${COLORS.content.placeholder};\n\tflex-shrink: 0;\n`;\n"],"names":["PanelContainer","styled","COLORS","PanelHeader","HeaderAvatar","HeaderText","HeaderTitleRow","HeaderBadge","HeaderActions","IconAction","MessagesViewport","MessagesArea","ScrollFade","props","JumpToLatestButton","EmptyState","EmptyStateIcon","SuggestionList","SuggestionChip","MessageBubble","ThinkingBubble","HistoryLoader","FollowUpList","FollowUpsLabel","FollowUpChip","InterruptedNote","MessageActions","MessageAction","ThinkingLabel","ErrorBanner","InputArea","InputWrapper","MessageInput","SendButton","Disclaimer"],"mappings":"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"}
@@ -0,0 +1,24 @@
1
+ import { CopilotBallPosition, CopilotViewport } from './model';
2
+ export interface CopilotPanelPlacementOptions {
3
+ ballPosition: CopilotBallPosition;
4
+ ballSize: number;
5
+ panelWidth: number;
6
+ panelHeight: number;
7
+ gap: number;
8
+ viewport: CopilotViewport;
9
+ }
10
+ export interface CopilotPanelPlacement {
11
+ left: number;
12
+ top: number;
13
+ width: number;
14
+ height: number;
15
+ }
16
+ /**
17
+ * Places the panel next to the ball, on whichever side has room.
18
+ *
19
+ * The panel opens towards the middle of the screen: a ball parked bottom-right
20
+ * gets a panel above and to its left, a ball parked top-left gets one below and
21
+ * to its right. The result is always clamped inside the viewport, and the panel
22
+ * shrinks on viewports too small to hold it at full size.
23
+ */
24
+ export declare const getCopilotPanelPlacement: ({ ballPosition, ballSize, panelWidth, panelHeight, gap, viewport, }: CopilotPanelPlacementOptions) => CopilotPanelPlacement;
@@ -0,0 +1,38 @@
1
+ const M = (t, I, R) => Math.min(Math.max(t, I), Math.max(I, R)), E = ({
2
+ ballPosition: t,
3
+ ballSize: I,
4
+ panelWidth: R,
5
+ panelHeight: P,
6
+ gap: n,
7
+ viewport: h
8
+ }) => {
9
+ if (!h.width || !h.height)
10
+ return {
11
+ left: 8,
12
+ top: 8,
13
+ width: R,
14
+ height: P
15
+ };
16
+ const _ = Math.min(R, h.width - 16), e = Math.min(
17
+ P,
18
+ h.height - 16
19
+ ), c = t.x + I / 2, s = t.y + I / 2, T = c > h.width / 2, X = s > h.height / 2, d = T ? t.x + I - _ : t.x, A = X ? t.y - n - e : t.y + I + n;
20
+ return {
21
+ left: M(
22
+ d,
23
+ 8,
24
+ h.width - _ - 8
25
+ ),
26
+ top: M(
27
+ A,
28
+ 8,
29
+ h.height - e - 8
30
+ ),
31
+ width: _,
32
+ height: e
33
+ };
34
+ };
35
+ export {
36
+ E as getCopilotPanelPlacement
37
+ };
38
+ //# sourceMappingURL=copilotPlacement.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"copilotPlacement.js","sources":["../../../../src/components/bik-copilot/copilotPlacement.ts"],"sourcesContent":["import { CopilotBallPosition, CopilotViewport } from './model';\n\n/** Smallest gap kept between the panel and the viewport edges. */\nconst VIEWPORT_MARGIN_PX = 8;\n\nexport interface CopilotPanelPlacementOptions {\n\tballPosition: CopilotBallPosition;\n\tballSize: number;\n\tpanelWidth: number;\n\tpanelHeight: number;\n\tgap: number;\n\tviewport: CopilotViewport;\n}\n\nexport interface CopilotPanelPlacement {\n\tleft: number;\n\ttop: number;\n\twidth: number;\n\theight: number;\n}\n\nconst clamp = (value: number, min: number, max: number) =>\n\tMath.min(Math.max(value, min), Math.max(min, max));\n\n/**\n * Places the panel next to the ball, on whichever side has room.\n *\n * The panel opens towards the middle of the screen: a ball parked bottom-right\n * gets a panel above and to its left, a ball parked top-left gets one below and\n * to its right. The result is always clamped inside the viewport, and the panel\n * shrinks on viewports too small to hold it at full size.\n */\nexport const getCopilotPanelPlacement = ({\n\tballPosition,\n\tballSize,\n\tpanelWidth,\n\tpanelHeight,\n\tgap,\n\tviewport,\n}: CopilotPanelPlacementOptions): CopilotPanelPlacement => {\n\tif (!viewport.width || !viewport.height) {\n\t\treturn {\n\t\t\tleft: VIEWPORT_MARGIN_PX,\n\t\t\ttop: VIEWPORT_MARGIN_PX,\n\t\t\twidth: panelWidth,\n\t\t\theight: panelHeight,\n\t\t};\n\t}\n\n\tconst width = Math.min(panelWidth, viewport.width - VIEWPORT_MARGIN_PX * 2);\n\tconst height = Math.min(\n\t\tpanelHeight,\n\t\tviewport.height - VIEWPORT_MARGIN_PX * 2,\n\t);\n\n\tconst ballCenterX = ballPosition.x + ballSize / 2;\n\tconst ballCenterY = ballPosition.y + ballSize / 2;\n\tconst opensLeftwards = ballCenterX > viewport.width / 2;\n\tconst opensUpwards = ballCenterY > viewport.height / 2;\n\n\t// Align the panel's near edge with the ball's, then push it towards the\n\t// screen centre.\n\tconst preferredLeft = opensLeftwards\n\t\t? ballPosition.x + ballSize - width\n\t\t: ballPosition.x;\n\tconst preferredTop = opensUpwards\n\t\t? ballPosition.y - gap - height\n\t\t: ballPosition.y + ballSize + gap;\n\n\treturn {\n\t\tleft: clamp(\n\t\t\tpreferredLeft,\n\t\t\tVIEWPORT_MARGIN_PX,\n\t\t\tviewport.width - width - VIEWPORT_MARGIN_PX,\n\t\t),\n\t\ttop: clamp(\n\t\t\tpreferredTop,\n\t\t\tVIEWPORT_MARGIN_PX,\n\t\t\tviewport.height - height - VIEWPORT_MARGIN_PX,\n\t\t),\n\t\twidth,\n\t\theight,\n\t};\n};\n"],"names":["clamp","value","min","max","getCopilotPanelPlacement","ballPosition","ballSize","panelWidth","panelHeight","gap","viewport","width","height","ballCenterX","ballCenterY","opensLeftwards","opensUpwards","preferredLeft","preferredTop"],"mappings":"AAqBA,MAAMA,IAAQ,CAACC,GAAeC,GAAaC,MAC1C,KAAK,IAAI,KAAK,IAAIF,GAAOC,CAAG,GAAG,KAAK,IAAIA,GAAKC,CAAG,CAAC,GAUrCC,IAA2B,CAAC;AAAA,EACxC,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,KAAAC;AAAA,EACA,UAAAC;AACD,MAA2D;AAC1D,MAAI,CAACA,EAAS,SAAS,CAACA,EAAS;AAChC,WAAO;AAAA,MACN,MAAM;AAAA,MACN,KAAK;AAAA,MACL,OAAOH;AAAA,MACP,QAAQC;AAAA,IAAA;AAIV,QAAMG,IAAQ,KAAK,IAAIJ,GAAYG,EAAS,QAAQ,EAAsB,GACpEE,IAAS,KAAK;AAAA,IACnBJ;AAAA,IACAE,EAAS,SAAS;AAAA,EAAqB,GAGlCG,IAAcR,EAAa,IAAIC,IAAW,GAC1CQ,IAAcT,EAAa,IAAIC,IAAW,GAC1CS,IAAiBF,IAAcH,EAAS,QAAQ,GAChDM,IAAeF,IAAcJ,EAAS,SAAS,GAI/CO,IAAgBF,IACnBV,EAAa,IAAIC,IAAWK,IAC5BN,EAAa,GACVa,IAAeF,IAClBX,EAAa,IAAII,IAAMG,IACvBP,EAAa,IAAIC,IAAWG;AAE/B,SAAO;AAAA,IACN,MAAMT;AAAA,MACLiB;AAAA,MACA;AAAA,MACAP,EAAS,QAAQC,IAAQ;AAAA,IAAA;AAAA,IAE1B,KAAKX;AAAA,MACJkB;AAAA,MACA;AAAA,MACAR,EAAS,SAASE,IAAS;AAAA,IAAA;AAAA,IAE5B,OAAAD;AAAA,IACA,QAAAC;AAAA,EAAA;AAEF;"}
@@ -0,0 +1,16 @@
1
+ export { ControlledCopilot, default as default } from './ControlledCopilot';
2
+ export { BIKCopilot } from './BIKCopilot';
3
+ export { COPILOT_BALL_ATTRIBUTE, CopilotBall } from './CopilotBall';
4
+ export { CopilotPanel } from './CopilotPanel';
5
+ export { getCopilotPanelPlacement } from './copilotPlacement';
6
+ export { DEFAULT_COPILOT_AGENT, DEFAULT_COPILOT_ROUTE, useCopilotIcebreakers, } from './useCopilotIcebreakers';
7
+ export { useCopilotStreamChat } from './useCopilotStreamChat';
8
+ export { useDraggableFloater } from './useDraggableFloater';
9
+ export { COPILOT_ICEBREAKERS_PATH, fetchCopilotIcebreakers, } from './services/copilotIcebreakersClient';
10
+ export { COPILOT_ENDPOINT_PATH, streamCopilotChat, } from './services/copilotStreamClient';
11
+ export { CopilotSseParser } from './services/copilotSseParser';
12
+ export { COPILOT_HISTORY_PAGE_SIZE, COPILOT_MESSAGES_PATH, fetchCopilotMessages, } from './services/copilotMessagesClient';
13
+ export { COPILOT_SESSION_TTL_MS, MAX_PERSISTED_MESSAGES, copilotSessionKey, createCopilotSession, createCopilotSessionId, deleteCopilotSession, findLatestCopilotSessionId, isCopilotSessionExpired, listCopilotSessionKeys, loadCopilotSession, persistCopilotTurn, pruneCopilotSessions, saveCopilotSession, } from './services/copilotDb';
14
+ export { clearCopilotPageSessions, getCopilotSessionIdForRoute, resetCopilotSessionForRoute, resolveCopilotSessionIdForRoute, } from './services/copilotPageSession';
15
+ export type { CopilotPanelPlacement, CopilotPanelPlacementOptions, } from './copilotPlacement';
16
+ export type { ControlledCopilotProps, BIKCopilotProps, CopilotAgent, CopilotBallPosition, CopilotBallProps, CopilotCorner, CopilotDragHandlers, CopilotIcebreakersResult, CopilotAnswerPayload, CopilotMessage, CopilotMessagesPage, CopilotPanelProps, CopilotSessionRecord, CopilotShellProps, CopilotStreamEvent, CopilotStreamHandlers, CopilotStreamRequest, CopilotTransportOptions, CopilotViewport, CopilotStoredMessageRow, FetchCopilotIcebreakersOptions, FetchCopilotMessagesOptions, StreamCopilotChatOptions, UseCopilotIcebreakersOptions, UseCopilotIcebreakersResult, UseCopilotStreamChatOptions, UseCopilotStreamChatResult, UseDraggableFloaterOptions, UseDraggableFloaterResult, } from './model';