@skippr/live-agent-sdk 0.21.0 → 0.22.0
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/esm/lib-exports.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// src/components/LiveAgent.tsx
|
|
2
2
|
import { LiveKitRoom, RoomAudioRenderer } from "@livekit/components-react";
|
|
3
|
-
import { useCallback as useCallback8, useEffect as
|
|
3
|
+
import { useCallback as useCallback8, useEffect as useEffect9, useMemo as useMemo5, useRef as useRef5, useState as useState9 } from "react";
|
|
4
4
|
|
|
5
5
|
// src/context/LiveAgentContext.tsx
|
|
6
6
|
import { createContext } from "react";
|
|
@@ -259,30 +259,30 @@ function useSession({ agentId, authToken, appKey, userToken }) {
|
|
|
259
259
|
// src/components/MinimizedBubble.tsx
|
|
260
260
|
import { useLocalParticipant, useVoiceAssistant } from "@livekit/components-react";
|
|
261
261
|
import { ScreenSharePresets } from "livekit-client";
|
|
262
|
-
// ../../node_modules/.bun/lucide-react@
|
|
263
|
-
import { forwardRef as forwardRef2, createElement as
|
|
262
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
|
|
263
|
+
import { forwardRef as forwardRef2, createElement as createElement3 } from "react";
|
|
264
264
|
|
|
265
|
-
// ../../node_modules/.bun/lucide-react@
|
|
265
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/mergeClasses.js
|
|
266
266
|
var mergeClasses = (...classes) => classes.filter((className, index, array) => {
|
|
267
267
|
return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index;
|
|
268
268
|
}).join(" ").trim();
|
|
269
269
|
|
|
270
|
-
// ../../node_modules/.bun/lucide-react@
|
|
270
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toKebabCase.js
|
|
271
271
|
var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
|
|
272
272
|
|
|
273
|
-
// ../../node_modules/.bun/lucide-react@
|
|
273
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toCamelCase.js
|
|
274
274
|
var toCamelCase = (string) => string.replace(/^([A-Z])|[\s-_]+(\w)/g, (match, p1, p2) => p2 ? p2.toUpperCase() : p1.toLowerCase());
|
|
275
275
|
|
|
276
|
-
// ../../node_modules/.bun/lucide-react@
|
|
276
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toPascalCase.js
|
|
277
277
|
var toPascalCase = (string) => {
|
|
278
278
|
const camelCase = toCamelCase(string);
|
|
279
279
|
return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
|
|
280
280
|
};
|
|
281
281
|
|
|
282
|
-
// ../../node_modules/.bun/lucide-react@
|
|
283
|
-
import { forwardRef, createElement } from "react";
|
|
282
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
|
|
283
|
+
import { forwardRef, createElement as createElement2 } from "react";
|
|
284
284
|
|
|
285
|
-
// ../../node_modules/.bun/lucide-react@
|
|
285
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/defaultAttributes.js
|
|
286
286
|
var defaultAttributes = {
|
|
287
287
|
xmlns: "http://www.w3.org/2000/svg",
|
|
288
288
|
width: 24,
|
|
@@ -295,7 +295,7 @@ var defaultAttributes = {
|
|
|
295
295
|
strokeLinejoin: "round"
|
|
296
296
|
};
|
|
297
297
|
|
|
298
|
-
// ../../node_modules/.bun/lucide-react@
|
|
298
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/hasA11yProp.js
|
|
299
299
|
var hasA11yProp = (props) => {
|
|
300
300
|
for (const prop in props) {
|
|
301
301
|
if (prop.startsWith("aria-") || prop === "role" || prop === "title") {
|
|
@@ -305,34 +305,42 @@ var hasA11yProp = (props) => {
|
|
|
305
305
|
return false;
|
|
306
306
|
};
|
|
307
307
|
|
|
308
|
-
// ../../node_modules/.bun/lucide-react@
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
absoluteStrokeWidth,
|
|
314
|
-
className = "",
|
|
315
|
-
children,
|
|
316
|
-
iconNode,
|
|
317
|
-
...rest
|
|
318
|
-
}, ref) => createElement("svg", {
|
|
319
|
-
ref,
|
|
320
|
-
...defaultAttributes,
|
|
321
|
-
width: size,
|
|
322
|
-
height: size,
|
|
323
|
-
stroke: color,
|
|
324
|
-
strokeWidth: absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
|
|
325
|
-
className: mergeClasses("lucide", className),
|
|
326
|
-
...!children && !hasA11yProp(rest) && { "aria-hidden": "true" },
|
|
327
|
-
...rest
|
|
328
|
-
}, [
|
|
329
|
-
...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),
|
|
330
|
-
...Array.isArray(children) ? children : [children]
|
|
331
|
-
]));
|
|
308
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/context.js
|
|
309
|
+
import { createContext as createContext2, useContext, useMemo, createElement } from "react";
|
|
310
|
+
"use client";
|
|
311
|
+
var LucideContext = createContext2({});
|
|
312
|
+
var useLucideContext = () => useContext(LucideContext);
|
|
332
313
|
|
|
333
|
-
// ../../node_modules/.bun/lucide-react@
|
|
314
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
|
|
315
|
+
"use client";
|
|
316
|
+
var Icon = forwardRef(({ color, size, strokeWidth, absoluteStrokeWidth, className = "", children, iconNode, ...rest }, ref) => {
|
|
317
|
+
const {
|
|
318
|
+
size: contextSize = 24,
|
|
319
|
+
strokeWidth: contextStrokeWidth = 2,
|
|
320
|
+
absoluteStrokeWidth: contextAbsoluteStrokeWidth = false,
|
|
321
|
+
color: contextColor = "currentColor",
|
|
322
|
+
className: contextClass = ""
|
|
323
|
+
} = useLucideContext() ?? {};
|
|
324
|
+
const calculatedStrokeWidth = absoluteStrokeWidth ?? contextAbsoluteStrokeWidth ? Number(strokeWidth ?? contextStrokeWidth) * 24 / Number(size ?? contextSize) : strokeWidth ?? contextStrokeWidth;
|
|
325
|
+
return createElement2("svg", {
|
|
326
|
+
ref,
|
|
327
|
+
...defaultAttributes,
|
|
328
|
+
width: size ?? contextSize ?? defaultAttributes.width,
|
|
329
|
+
height: size ?? contextSize ?? defaultAttributes.height,
|
|
330
|
+
stroke: color ?? contextColor,
|
|
331
|
+
strokeWidth: calculatedStrokeWidth,
|
|
332
|
+
className: mergeClasses("lucide", contextClass, className),
|
|
333
|
+
...!children && !hasA11yProp(rest) && { "aria-hidden": "true" },
|
|
334
|
+
...rest
|
|
335
|
+
}, [
|
|
336
|
+
...iconNode.map(([tag, attrs]) => createElement2(tag, attrs)),
|
|
337
|
+
...Array.isArray(children) ? children : [children]
|
|
338
|
+
]);
|
|
339
|
+
});
|
|
340
|
+
|
|
341
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
|
|
334
342
|
var createLucideIcon = (iconName, iconNode) => {
|
|
335
|
-
const Component = forwardRef2(({ className, ...props }, ref) =>
|
|
343
|
+
const Component = forwardRef2(({ className, ...props }, ref) => createElement3(Icon, {
|
|
336
344
|
ref,
|
|
337
345
|
iconNode,
|
|
338
346
|
className: mergeClasses(`lucide-${toKebabCase(toPascalCase(iconName))}`, `lucide-${iconName}`, className),
|
|
@@ -342,10 +350,10 @@ var createLucideIcon = (iconName, iconNode) => {
|
|
|
342
350
|
return Component;
|
|
343
351
|
};
|
|
344
352
|
|
|
345
|
-
// ../../node_modules/.bun/lucide-react@
|
|
353
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/loader-circle.js
|
|
346
354
|
var __iconNode = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]];
|
|
347
355
|
var LoaderCircle = createLucideIcon("loader-circle", __iconNode);
|
|
348
|
-
// ../../node_modules/.bun/lucide-react@
|
|
356
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-circle-question-mark.js
|
|
349
357
|
var __iconNode2 = [
|
|
350
358
|
[
|
|
351
359
|
"path",
|
|
@@ -358,13 +366,13 @@ var __iconNode2 = [
|
|
|
358
366
|
["path", { d: "M12 17h.01", key: "p32p05" }]
|
|
359
367
|
];
|
|
360
368
|
var MessageCircleQuestionMark = createLucideIcon("message-circle-question-mark", __iconNode2);
|
|
361
|
-
// ../../node_modules/.bun/lucide-react@
|
|
369
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/panel-left.js
|
|
362
370
|
var __iconNode3 = [
|
|
363
371
|
["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
|
|
364
372
|
["path", { d: "M9 3v18", key: "fh3hqa" }]
|
|
365
373
|
];
|
|
366
374
|
var PanelLeft = createLucideIcon("panel-left", __iconNode3);
|
|
367
|
-
// ../../node_modules/.bun/lucide-react@
|
|
375
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/send-horizontal.js
|
|
368
376
|
var __iconNode4 = [
|
|
369
377
|
[
|
|
370
378
|
"path",
|
|
@@ -376,13 +384,13 @@ var __iconNode4 = [
|
|
|
376
384
|
["path", { d: "M6 12h16", key: "s4cdu5" }]
|
|
377
385
|
];
|
|
378
386
|
var SendHorizontal = createLucideIcon("send-horizontal", __iconNode4);
|
|
379
|
-
// ../../node_modules/.bun/lucide-react@
|
|
387
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/arrow-left.js
|
|
380
388
|
var __iconNode5 = [
|
|
381
389
|
["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
|
|
382
390
|
["path", { d: "M19 12H5", key: "x3x0zl" }]
|
|
383
391
|
];
|
|
384
392
|
var ArrowLeft = createLucideIcon("arrow-left", __iconNode5);
|
|
385
|
-
// ../../node_modules/.bun/lucide-react@
|
|
393
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/bot.js
|
|
386
394
|
var __iconNode6 = [
|
|
387
395
|
["path", { d: "M12 8V4H8", key: "hb8ula" }],
|
|
388
396
|
["rect", { width: "16", height: "12", x: "4", y: "8", rx: "2", key: "enze0r" }],
|
|
@@ -392,19 +400,19 @@ var __iconNode6 = [
|
|
|
392
400
|
["path", { d: "M9 13v2", key: "rq6x2g" }]
|
|
393
401
|
];
|
|
394
402
|
var Bot = createLucideIcon("bot", __iconNode6);
|
|
395
|
-
// ../../node_modules/.bun/lucide-react@
|
|
403
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/check.js
|
|
396
404
|
var __iconNode7 = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
|
|
397
405
|
var Check = createLucideIcon("check", __iconNode7);
|
|
398
|
-
// ../../node_modules/.bun/lucide-react@
|
|
406
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/circle.js
|
|
399
407
|
var __iconNode8 = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
|
|
400
408
|
var Circle = createLucideIcon("circle", __iconNode8);
|
|
401
|
-
// ../../node_modules/.bun/lucide-react@
|
|
409
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mail.js
|
|
402
410
|
var __iconNode9 = [
|
|
403
411
|
["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
|
|
404
412
|
["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
|
|
405
413
|
];
|
|
406
414
|
var Mail = createLucideIcon("mail", __iconNode9);
|
|
407
|
-
// ../../node_modules/.bun/lucide-react@
|
|
415
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-circle.js
|
|
408
416
|
var __iconNode10 = [
|
|
409
417
|
[
|
|
410
418
|
"path",
|
|
@@ -415,8 +423,19 @@ var __iconNode10 = [
|
|
|
415
423
|
]
|
|
416
424
|
];
|
|
417
425
|
var MessageCircle = createLucideIcon("message-circle", __iconNode10);
|
|
418
|
-
// ../../node_modules/.bun/lucide-react@
|
|
426
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-square.js
|
|
419
427
|
var __iconNode11 = [
|
|
428
|
+
[
|
|
429
|
+
"path",
|
|
430
|
+
{
|
|
431
|
+
d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z",
|
|
432
|
+
key: "18887p"
|
|
433
|
+
}
|
|
434
|
+
]
|
|
435
|
+
];
|
|
436
|
+
var MessageSquare = createLucideIcon("message-square", __iconNode11);
|
|
437
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic-off.js
|
|
438
|
+
var __iconNode12 = [
|
|
420
439
|
["path", { d: "M12 19v3", key: "npa21l" }],
|
|
421
440
|
["path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33", key: "1gzdoj" }],
|
|
422
441
|
["path", { d: "M16.95 16.95A7 7 0 0 1 5 12v-2", key: "cqa7eg" }],
|
|
@@ -424,38 +443,38 @@ var __iconNode11 = [
|
|
|
424
443
|
["path", { d: "m2 2 20 20", key: "1ooewy" }],
|
|
425
444
|
["path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12", key: "r2i35w" }]
|
|
426
445
|
];
|
|
427
|
-
var MicOff = createLucideIcon("mic-off",
|
|
428
|
-
// ../../node_modules/.bun/lucide-react@
|
|
429
|
-
var
|
|
446
|
+
var MicOff = createLucideIcon("mic-off", __iconNode12);
|
|
447
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic.js
|
|
448
|
+
var __iconNode13 = [
|
|
430
449
|
["path", { d: "M12 19v3", key: "npa21l" }],
|
|
431
450
|
["path", { d: "M19 10v2a7 7 0 0 1-14 0v-2", key: "1vc78b" }],
|
|
432
451
|
["rect", { x: "9", y: "2", width: "6", height: "13", rx: "3", key: "s6n7sd" }]
|
|
433
452
|
];
|
|
434
|
-
var Mic = createLucideIcon("mic",
|
|
435
|
-
// ../../node_modules/.bun/lucide-react@
|
|
436
|
-
var
|
|
453
|
+
var Mic = createLucideIcon("mic", __iconNode13);
|
|
454
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor-off.js
|
|
455
|
+
var __iconNode14 = [
|
|
437
456
|
["path", { d: "M12 17v4", key: "1riwvh" }],
|
|
438
457
|
["path", { d: "M17 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 1.184-1.826", key: "cv7jms" }],
|
|
439
458
|
["path", { d: "m2 2 20 20", key: "1ooewy" }],
|
|
440
459
|
["path", { d: "M8 21h8", key: "1ev6f3" }],
|
|
441
460
|
["path", { d: "M8.656 3H20a2 2 0 0 1 2 2v10a2 2 0 0 1-.293 1.042", key: "z8ni2w" }]
|
|
442
461
|
];
|
|
443
|
-
var MonitorOff = createLucideIcon("monitor-off",
|
|
444
|
-
// ../../node_modules/.bun/lucide-react@
|
|
445
|
-
var
|
|
462
|
+
var MonitorOff = createLucideIcon("monitor-off", __iconNode14);
|
|
463
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor.js
|
|
464
|
+
var __iconNode15 = [
|
|
446
465
|
["rect", { width: "20", height: "14", x: "2", y: "3", rx: "2", key: "48i651" }],
|
|
447
466
|
["line", { x1: "8", x2: "16", y1: "21", y2: "21", key: "1svkeh" }],
|
|
448
467
|
["line", { x1: "12", x2: "12", y1: "17", y2: "21", key: "vw1qmm" }]
|
|
449
468
|
];
|
|
450
|
-
var Monitor = createLucideIcon("monitor",
|
|
451
|
-
// ../../node_modules/.bun/lucide-react@
|
|
452
|
-
var
|
|
469
|
+
var Monitor = createLucideIcon("monitor", __iconNode15);
|
|
470
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/panel-right.js
|
|
471
|
+
var __iconNode16 = [
|
|
453
472
|
["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
|
|
454
473
|
["path", { d: "M15 3v18", key: "14nvp0" }]
|
|
455
474
|
];
|
|
456
|
-
var PanelRight = createLucideIcon("panel-right",
|
|
457
|
-
// ../../node_modules/.bun/lucide-react@
|
|
458
|
-
var
|
|
475
|
+
var PanelRight = createLucideIcon("panel-right", __iconNode16);
|
|
476
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/phone-off.js
|
|
477
|
+
var __iconNode17 = [
|
|
459
478
|
[
|
|
460
479
|
"path",
|
|
461
480
|
{
|
|
@@ -472,9 +491,9 @@ var __iconNode16 = [
|
|
|
472
491
|
}
|
|
473
492
|
]
|
|
474
493
|
];
|
|
475
|
-
var PhoneOff = createLucideIcon("phone-off",
|
|
476
|
-
// ../../node_modules/.bun/lucide-react@
|
|
477
|
-
var
|
|
494
|
+
var PhoneOff = createLucideIcon("phone-off", __iconNode17);
|
|
495
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/settings.js
|
|
496
|
+
var __iconNode18 = [
|
|
478
497
|
[
|
|
479
498
|
"path",
|
|
480
499
|
{
|
|
@@ -484,15 +503,15 @@ var __iconNode17 = [
|
|
|
484
503
|
],
|
|
485
504
|
["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
|
|
486
505
|
];
|
|
487
|
-
var Settings = createLucideIcon("settings",
|
|
488
|
-
// ../../node_modules/.bun/lucide-react@
|
|
489
|
-
var
|
|
506
|
+
var Settings = createLucideIcon("settings", __iconNode18);
|
|
507
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/x.js
|
|
508
|
+
var __iconNode19 = [
|
|
490
509
|
["path", { d: "M18 6 6 18", key: "1bl5f8" }],
|
|
491
510
|
["path", { d: "m6 6 12 12", key: "d8bk6v" }]
|
|
492
511
|
];
|
|
493
|
-
var X = createLucideIcon("x",
|
|
512
|
+
var X = createLucideIcon("x", __iconNode19);
|
|
494
513
|
// src/components/MinimizedBubble.tsx
|
|
495
|
-
import { useCallback as useCallback3 } from "react";
|
|
514
|
+
import { useCallback as useCallback3, useEffect as useEffect3, useRef, useState as useState3 } from "react";
|
|
496
515
|
|
|
497
516
|
// src/hooks/useLiveAgent.ts
|
|
498
517
|
import { use } from "react";
|
|
@@ -512,39 +531,55 @@ function cn(...inputs) {
|
|
|
512
531
|
return twMerge(clsx(inputs));
|
|
513
532
|
}
|
|
514
533
|
|
|
534
|
+
// src/components/ui/tooltip.tsx
|
|
535
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
536
|
+
function Tooltip({ label, children, position = "top" }) {
|
|
537
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
538
|
+
className: "skippr:relative skippr:inline-flex skippr:group",
|
|
539
|
+
children: [
|
|
540
|
+
children,
|
|
541
|
+
/* @__PURE__ */ jsx("span", {
|
|
542
|
+
className: cn("skippr:pointer-events-none skippr:absolute skippr:left-1/2 skippr:-translate-x-1/2 skippr:z-10", "skippr:whitespace-nowrap skippr:rounded-md skippr:bg-foreground skippr:px-2 skippr:py-1", "skippr:text-[11px] skippr:text-background skippr:font-medium", "skippr:opacity-0 skippr:scale-95 skippr:transition-all skippr:duration-150", "skippr:group-hover:opacity-100 skippr:group-hover:scale-100", "skippr:group-focus-within:opacity-100 skippr:group-focus-within:scale-100", position === "top" && "skippr:bottom-full skippr:mb-1.5", position === "bottom" && "skippr:top-full skippr:mt-1.5"),
|
|
543
|
+
"aria-hidden": "true",
|
|
544
|
+
children: label
|
|
545
|
+
})
|
|
546
|
+
]
|
|
547
|
+
});
|
|
548
|
+
}
|
|
549
|
+
|
|
515
550
|
// src/components/MinimizedBubble.tsx
|
|
516
|
-
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
551
|
+
import { jsx as jsx2, jsxs as jsxs2, Fragment } from "react/jsx-runtime";
|
|
517
552
|
function AgentAvatar({ agentState }) {
|
|
518
553
|
if (agentState === "speaking") {
|
|
519
|
-
return /* @__PURE__ */
|
|
554
|
+
return /* @__PURE__ */ jsxs2("div", {
|
|
520
555
|
className: "skippr:flex skippr:items-end skippr:justify-center skippr:gap-[3px] skippr:h-5",
|
|
521
556
|
children: [
|
|
522
|
-
/* @__PURE__ */
|
|
557
|
+
/* @__PURE__ */ jsx2("span", {
|
|
523
558
|
className: "skippr:w-[3px] skippr:h-full skippr:rounded-full skippr:bg-primary-foreground skippr:origin-bottom skippr:animate-skippr-bar-1"
|
|
524
559
|
}),
|
|
525
|
-
/* @__PURE__ */
|
|
560
|
+
/* @__PURE__ */ jsx2("span", {
|
|
526
561
|
className: "skippr:w-[3px] skippr:h-full skippr:rounded-full skippr:bg-primary-foreground skippr:origin-bottom skippr:animate-skippr-bar-2"
|
|
527
562
|
}),
|
|
528
|
-
/* @__PURE__ */
|
|
563
|
+
/* @__PURE__ */ jsx2("span", {
|
|
529
564
|
className: "skippr:w-[3px] skippr:h-full skippr:rounded-full skippr:bg-primary-foreground skippr:origin-bottom skippr:animate-skippr-bar-3"
|
|
530
565
|
}),
|
|
531
|
-
/* @__PURE__ */
|
|
566
|
+
/* @__PURE__ */ jsx2("span", {
|
|
532
567
|
className: "skippr:w-[3px] skippr:h-full skippr:rounded-full skippr:bg-primary-foreground skippr:origin-bottom skippr:animate-skippr-bar-4"
|
|
533
568
|
})
|
|
534
569
|
]
|
|
535
570
|
});
|
|
536
571
|
}
|
|
537
572
|
if (agentState === "listening") {
|
|
538
|
-
return /* @__PURE__ */
|
|
573
|
+
return /* @__PURE__ */ jsx2(Bot, {
|
|
539
574
|
className: "skippr:relative skippr:z-10 skippr:size-5 skippr:animate-skippr-breathe"
|
|
540
575
|
});
|
|
541
576
|
}
|
|
542
577
|
if (agentState === "thinking") {
|
|
543
|
-
return /* @__PURE__ */
|
|
578
|
+
return /* @__PURE__ */ jsx2(Bot, {
|
|
544
579
|
className: "skippr:relative skippr:z-10 skippr:size-5 skippr:animate-pulse"
|
|
545
580
|
});
|
|
546
581
|
}
|
|
547
|
-
return /* @__PURE__ */
|
|
582
|
+
return /* @__PURE__ */ jsx2(Bot, {
|
|
548
583
|
className: "skippr:relative skippr:z-10 skippr:size-5"
|
|
549
584
|
});
|
|
550
585
|
}
|
|
@@ -574,69 +609,81 @@ function ConnectedBubbleContent() {
|
|
|
574
609
|
}, [localParticipant, isScreenSharing]);
|
|
575
610
|
const isSpeaking = agentState === "speaking";
|
|
576
611
|
const isListening = agentState === "listening";
|
|
577
|
-
return /* @__PURE__ */
|
|
612
|
+
return /* @__PURE__ */ jsxs2(Fragment, {
|
|
578
613
|
children: [
|
|
579
|
-
/* @__PURE__ */
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
614
|
+
/* @__PURE__ */ jsx2(Tooltip, {
|
|
615
|
+
label: "Open chat & transcript",
|
|
616
|
+
children: /* @__PURE__ */ jsxs2("button", {
|
|
617
|
+
type: "button",
|
|
618
|
+
onClick: expandPanel,
|
|
619
|
+
className: cn("skippr:relative skippr:size-11 skippr:rounded-full", "skippr:bg-primary skippr:text-primary-foreground", "skippr:flex skippr:items-center skippr:justify-center", "skippr:cursor-pointer skippr:transition-all skippr:duration-300", "skippr:hover:brightness-110", isListening && "skippr:animate-skippr-pulse-ring"),
|
|
620
|
+
"aria-label": "Open chat & transcript",
|
|
621
|
+
children: [
|
|
622
|
+
isSpeaking && /* @__PURE__ */ jsxs2(Fragment, {
|
|
623
|
+
children: [
|
|
624
|
+
/* @__PURE__ */ jsx2("span", {
|
|
625
|
+
className: "skippr:absolute skippr:inset-0 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-speak-ripple"
|
|
626
|
+
}),
|
|
627
|
+
/* @__PURE__ */ jsx2("span", {
|
|
628
|
+
className: "skippr:absolute skippr:inset-0 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-speak-ripple-delayed"
|
|
629
|
+
})
|
|
630
|
+
]
|
|
631
|
+
}),
|
|
632
|
+
/* @__PURE__ */ jsx2(AgentAvatar, {
|
|
633
|
+
agentState
|
|
634
|
+
})
|
|
635
|
+
]
|
|
636
|
+
})
|
|
599
637
|
}),
|
|
600
|
-
/* @__PURE__ */
|
|
638
|
+
/* @__PURE__ */ jsx2("div", {
|
|
601
639
|
className: "skippr:mx-1 skippr:h-6 skippr:w-px skippr:bg-border"
|
|
602
640
|
}),
|
|
603
|
-
/* @__PURE__ */
|
|
641
|
+
/* @__PURE__ */ jsxs2("div", {
|
|
604
642
|
className: "skippr:flex skippr:items-center skippr:gap-1",
|
|
605
643
|
children: [
|
|
606
|
-
/* @__PURE__ */
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
644
|
+
/* @__PURE__ */ jsx2(Tooltip, {
|
|
645
|
+
label: isMuted ? "Unmute" : "Mute",
|
|
646
|
+
children: /* @__PURE__ */ jsx2("button", {
|
|
647
|
+
type: "button",
|
|
648
|
+
onClick: toggleMute,
|
|
649
|
+
className: cn("skippr:size-9 skippr:rounded-full skippr:flex skippr:items-center skippr:justify-center", "skippr:transition-colors skippr:cursor-pointer", isMuted ? "skippr:bg-destructive skippr:text-white" : "skippr:text-foreground skippr:hover:bg-accent"),
|
|
650
|
+
"aria-label": isMuted ? "Unmute" : "Mute",
|
|
651
|
+
children: isMuted ? /* @__PURE__ */ jsx2(MicOff, {
|
|
652
|
+
className: "skippr:size-4"
|
|
653
|
+
}) : /* @__PURE__ */ jsx2(Mic, {
|
|
654
|
+
className: "skippr:size-4"
|
|
655
|
+
})
|
|
615
656
|
})
|
|
616
657
|
}),
|
|
617
|
-
/* @__PURE__ */
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
658
|
+
/* @__PURE__ */ jsx2(Tooltip, {
|
|
659
|
+
label: isScreenSharing ? "Stop sharing" : "Share screen",
|
|
660
|
+
children: /* @__PURE__ */ jsx2("button", {
|
|
661
|
+
type: "button",
|
|
662
|
+
onClick: toggleScreenShare,
|
|
663
|
+
className: cn("skippr:size-9 skippr:rounded-full skippr:flex skippr:items-center skippr:justify-center", "skippr:transition-colors skippr:cursor-pointer", isScreenSharing ? "skippr:text-foreground skippr:hover:bg-accent" : "skippr:bg-destructive skippr:text-white"),
|
|
664
|
+
"aria-label": isScreenSharing ? "Stop sharing" : "Share screen",
|
|
665
|
+
children: isScreenSharing ? /* @__PURE__ */ jsx2(MonitorOff, {
|
|
666
|
+
className: "skippr:size-4"
|
|
667
|
+
}) : /* @__PURE__ */ jsx2(Monitor, {
|
|
668
|
+
className: "skippr:size-4"
|
|
669
|
+
})
|
|
626
670
|
})
|
|
627
671
|
})
|
|
628
672
|
]
|
|
629
673
|
}),
|
|
630
|
-
/* @__PURE__ */
|
|
674
|
+
/* @__PURE__ */ jsx2("div", {
|
|
631
675
|
className: "skippr:mx-1 skippr:h-6 skippr:w-px skippr:bg-border"
|
|
632
676
|
}),
|
|
633
|
-
/* @__PURE__ */
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
677
|
+
/* @__PURE__ */ jsx2(Tooltip, {
|
|
678
|
+
label: "End session",
|
|
679
|
+
children: /* @__PURE__ */ jsx2("button", {
|
|
680
|
+
type: "button",
|
|
681
|
+
onClick: () => disconnect(),
|
|
682
|
+
className: "skippr:size-9 skippr:rounded-full skippr:flex skippr:items-center skippr:justify-center skippr:bg-destructive skippr:text-white skippr:cursor-pointer skippr:transition-colors skippr:hover:bg-destructive/90",
|
|
683
|
+
"aria-label": "Hang up",
|
|
684
|
+
children: /* @__PURE__ */ jsx2(PhoneOff, {
|
|
685
|
+
className: "skippr:size-4"
|
|
686
|
+
})
|
|
640
687
|
})
|
|
641
688
|
})
|
|
642
689
|
]
|
|
@@ -644,6 +691,15 @@ function ConnectedBubbleContent() {
|
|
|
644
691
|
}
|
|
645
692
|
function IdleBubbleContent() {
|
|
646
693
|
const { expandPanel, startSession, isStarting, isAuthenticated } = useLiveAgent();
|
|
694
|
+
const [showCapabilities, setShowCapabilities] = useState3(true);
|
|
695
|
+
const fadeTimer = useRef(null);
|
|
696
|
+
useEffect3(() => {
|
|
697
|
+
fadeTimer.current = setTimeout(() => setShowCapabilities(false), 5000);
|
|
698
|
+
return () => {
|
|
699
|
+
if (fadeTimer.current)
|
|
700
|
+
clearTimeout(fadeTimer.current);
|
|
701
|
+
};
|
|
702
|
+
}, []);
|
|
647
703
|
const handleStart = useCallback3(() => {
|
|
648
704
|
if (!isAuthenticated) {
|
|
649
705
|
expandPanel();
|
|
@@ -651,54 +707,161 @@ function IdleBubbleContent() {
|
|
|
651
707
|
}
|
|
652
708
|
startSession();
|
|
653
709
|
}, [isAuthenticated, expandPanel, startSession]);
|
|
654
|
-
return /* @__PURE__ */
|
|
710
|
+
return /* @__PURE__ */ jsxs2("div", {
|
|
711
|
+
className: "skippr:flex skippr:items-center skippr:gap-0",
|
|
712
|
+
onMouseEnter: () => !isStarting && setShowCapabilities(true),
|
|
713
|
+
onMouseLeave: () => !isStarting && setShowCapabilities(false),
|
|
655
714
|
children: [
|
|
656
|
-
/* @__PURE__ */
|
|
715
|
+
/* @__PURE__ */ jsx2("button", {
|
|
657
716
|
type: "button",
|
|
658
717
|
onClick: handleStart,
|
|
659
718
|
disabled: isStarting,
|
|
660
|
-
className: cn("skippr:relative skippr:size-11 skippr:rounded-full", "skippr:bg-primary skippr:text-primary-foreground", "skippr:flex skippr:items-center skippr:justify-center", "skippr:cursor-pointer skippr:transition-all skippr:duration-300", "skippr:hover:brightness-110", isStarting && "skippr:animate-skippr-pulse-ring"),
|
|
719
|
+
className: cn("skippr:relative skippr:size-11 skippr:rounded-full", "skippr:bg-primary skippr:text-primary-foreground", "skippr:flex skippr:items-center skippr:justify-center", "skippr:cursor-pointer skippr:transition-all skippr:duration-300", "skippr:hover:brightness-110", isStarting && "skippr:animate-skippr-pulse-ring skippr:cursor-not-allowed"),
|
|
661
720
|
"aria-label": "AI Agent",
|
|
662
|
-
children: /* @__PURE__ */
|
|
721
|
+
children: /* @__PURE__ */ jsx2(Bot, {
|
|
663
722
|
className: "skippr:relative skippr:z-10 skippr:size-5"
|
|
664
723
|
})
|
|
665
724
|
}),
|
|
666
|
-
/* @__PURE__ */
|
|
667
|
-
className: "skippr:
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
children:
|
|
676
|
-
|
|
677
|
-
|
|
725
|
+
isStarting ? /* @__PURE__ */ jsxs2("div", {
|
|
726
|
+
className: "skippr:flex skippr:items-center skippr:gap-2 skippr:ml-2 skippr:mr-1 skippr:whitespace-nowrap skippr:text-xs skippr:text-muted-foreground",
|
|
727
|
+
children: [
|
|
728
|
+
/* @__PURE__ */ jsx2("span", {
|
|
729
|
+
className: "skippr:inline-block skippr:size-1.5 skippr:rounded-full skippr:bg-primary skippr:animate-pulse"
|
|
730
|
+
}),
|
|
731
|
+
"Setting up voice & screen..."
|
|
732
|
+
]
|
|
733
|
+
}) : /* @__PURE__ */ jsxs2(Fragment, {
|
|
734
|
+
children: [
|
|
735
|
+
/* @__PURE__ */ jsx2("div", {
|
|
736
|
+
className: cn("skippr:overflow-hidden skippr:transition-all skippr:duration-500 skippr:ease-in-out", showCapabilities ? "skippr:max-w-64 skippr:opacity-100 skippr:ml-2 skippr:mr-1" : "skippr:max-w-0 skippr:opacity-0 skippr:ml-0 skippr:mr-0"),
|
|
737
|
+
"aria-hidden": !showCapabilities,
|
|
738
|
+
children: /* @__PURE__ */ jsxs2("button", {
|
|
739
|
+
type: "button",
|
|
740
|
+
onClick: handleStart,
|
|
741
|
+
tabIndex: showCapabilities ? 0 : -1,
|
|
742
|
+
className: "skippr:flex skippr:items-center skippr:gap-3 skippr:whitespace-nowrap skippr:text-xs skippr:text-muted-foreground skippr:cursor-pointer skippr:hover:text-foreground skippr:transition-colors",
|
|
743
|
+
children: [
|
|
744
|
+
/* @__PURE__ */ jsxs2("span", {
|
|
745
|
+
className: "skippr:flex skippr:items-center skippr:gap-1",
|
|
746
|
+
children: [
|
|
747
|
+
/* @__PURE__ */ jsx2(Mic, {
|
|
748
|
+
className: "skippr:size-3"
|
|
749
|
+
}),
|
|
750
|
+
"Talk"
|
|
751
|
+
]
|
|
752
|
+
}),
|
|
753
|
+
/* @__PURE__ */ jsx2("span", {
|
|
754
|
+
className: "skippr:text-border",
|
|
755
|
+
children: "·"
|
|
756
|
+
}),
|
|
757
|
+
/* @__PURE__ */ jsxs2("span", {
|
|
758
|
+
className: "skippr:flex skippr:items-center skippr:gap-1",
|
|
759
|
+
children: [
|
|
760
|
+
/* @__PURE__ */ jsx2(Monitor, {
|
|
761
|
+
className: "skippr:size-3"
|
|
762
|
+
}),
|
|
763
|
+
"Screen"
|
|
764
|
+
]
|
|
765
|
+
}),
|
|
766
|
+
/* @__PURE__ */ jsx2("span", {
|
|
767
|
+
className: "skippr:text-border",
|
|
768
|
+
children: "·"
|
|
769
|
+
}),
|
|
770
|
+
/* @__PURE__ */ jsxs2("span", {
|
|
771
|
+
className: "skippr:flex skippr:items-center skippr:gap-1",
|
|
772
|
+
children: [
|
|
773
|
+
/* @__PURE__ */ jsx2(MessageSquare, {
|
|
774
|
+
className: "skippr:size-3"
|
|
775
|
+
}),
|
|
776
|
+
"Chat"
|
|
777
|
+
]
|
|
778
|
+
})
|
|
779
|
+
]
|
|
780
|
+
})
|
|
781
|
+
}),
|
|
782
|
+
/* @__PURE__ */ jsx2("div", {
|
|
783
|
+
className: cn("skippr:overflow-hidden skippr:transition-all skippr:duration-500 skippr:ease-in-out", showCapabilities ? "skippr:max-w-0 skippr:opacity-0" : "skippr:max-w-12 skippr:opacity-100"),
|
|
784
|
+
"aria-hidden": showCapabilities,
|
|
785
|
+
children: /* @__PURE__ */ jsxs2("div", {
|
|
786
|
+
className: "skippr:flex skippr:items-center",
|
|
787
|
+
children: [
|
|
788
|
+
/* @__PURE__ */ jsx2("div", {
|
|
789
|
+
className: "skippr:mx-1 skippr:h-6 skippr:w-px skippr:bg-border"
|
|
790
|
+
}),
|
|
791
|
+
/* @__PURE__ */ jsx2(Tooltip, {
|
|
792
|
+
label: "Start session",
|
|
793
|
+
children: /* @__PURE__ */ jsx2("button", {
|
|
794
|
+
type: "button",
|
|
795
|
+
onClick: handleStart,
|
|
796
|
+
tabIndex: showCapabilities ? -1 : 0,
|
|
797
|
+
className: "skippr:size-9 skippr:rounded-full skippr:flex skippr:items-center skippr:justify-center skippr:transition-colors skippr:cursor-pointer skippr:bg-primary skippr:text-primary-foreground skippr:hover:brightness-110",
|
|
798
|
+
"aria-label": "Start session",
|
|
799
|
+
children: /* @__PURE__ */ jsx2(Monitor, {
|
|
800
|
+
className: "skippr:size-4"
|
|
801
|
+
})
|
|
802
|
+
})
|
|
803
|
+
})
|
|
804
|
+
]
|
|
805
|
+
})
|
|
806
|
+
})
|
|
807
|
+
]
|
|
678
808
|
})
|
|
679
809
|
]
|
|
680
810
|
});
|
|
681
811
|
}
|
|
682
|
-
function
|
|
812
|
+
function WelcomeBubble({
|
|
813
|
+
message,
|
|
814
|
+
position,
|
|
815
|
+
onDismiss
|
|
816
|
+
}) {
|
|
817
|
+
useEffect3(() => {
|
|
818
|
+
const timer = setTimeout(onDismiss, 5000);
|
|
819
|
+
return () => clearTimeout(timer);
|
|
820
|
+
}, [onDismiss]);
|
|
821
|
+
return /* @__PURE__ */ jsxs2("button", {
|
|
822
|
+
type: "button",
|
|
823
|
+
className: cn("skippr:absolute skippr:bottom-full skippr:mb-3", "skippr:max-w-64 skippr:rounded-xl skippr:bg-card skippr:shadow-lg", "skippr:border skippr:border-border skippr:px-4 skippr:py-3", "skippr:text-sm skippr:text-foreground skippr:leading-relaxed skippr:text-left", "skippr:animate-[skippr-fade-in_0.3s_ease-out]", "skippr:cursor-pointer", position === "right" ? "skippr:right-0" : "skippr:left-0"),
|
|
824
|
+
onClick: onDismiss,
|
|
825
|
+
"aria-label": "Dismiss",
|
|
826
|
+
children: [
|
|
827
|
+
message,
|
|
828
|
+
/* @__PURE__ */ jsx2("span", {
|
|
829
|
+
className: cn("skippr:absolute skippr:top-full skippr:size-2.5", "skippr:border-l skippr:border-t skippr:border-border skippr:bg-card", "skippr:rotate-[225deg]", position === "right" ? "skippr:right-5" : "skippr:left-5", "skippr:-mt-[5px]")
|
|
830
|
+
})
|
|
831
|
+
]
|
|
832
|
+
});
|
|
833
|
+
}
|
|
834
|
+
function MinimizedBubble({
|
|
835
|
+
welcomeMessage,
|
|
836
|
+
welcomeDismissed,
|
|
837
|
+
onDismissWelcome
|
|
838
|
+
}) {
|
|
683
839
|
const { isConnected, position } = useLiveAgent();
|
|
684
|
-
return /* @__PURE__ */
|
|
840
|
+
return /* @__PURE__ */ jsxs2("div", {
|
|
685
841
|
className: cn("skippr:fixed skippr:bottom-6 skippr:z-[9999]", "skippr:flex skippr:items-center skippr:gap-0", "skippr:rounded-full skippr:bg-card skippr:shadow-2xl", "skippr:border skippr:border-border", "skippr:p-1.5", "skippr:transition-all skippr:duration-300 skippr:ease-in-out", position === "right" ? "skippr:right-6" : "skippr:left-6"),
|
|
686
|
-
children:
|
|
842
|
+
children: [
|
|
843
|
+
welcomeMessage && !isConnected && !welcomeDismissed && /* @__PURE__ */ jsx2(WelcomeBubble, {
|
|
844
|
+
message: welcomeMessage,
|
|
845
|
+
position,
|
|
846
|
+
onDismiss: onDismissWelcome
|
|
847
|
+
}),
|
|
848
|
+
isConnected ? /* @__PURE__ */ jsx2(ConnectedBubbleContent, {}) : /* @__PURE__ */ jsx2(IdleBubbleContent, {})
|
|
849
|
+
]
|
|
687
850
|
});
|
|
688
851
|
}
|
|
689
852
|
|
|
690
853
|
// src/components/Sidebar.tsx
|
|
691
854
|
import { useConnectionState } from "@livekit/components-react";
|
|
692
855
|
import { ConnectionState } from "livekit-client";
|
|
693
|
-
import { useEffect as
|
|
856
|
+
import { useEffect as useEffect8, useState as useState8 } from "react";
|
|
694
857
|
|
|
695
858
|
// src/hooks/useCombinedMessages.ts
|
|
696
859
|
import { useVoiceAssistant as useVoiceAssistant2 } from "@livekit/components-react";
|
|
697
|
-
import { useMemo as
|
|
860
|
+
import { useMemo as useMemo4 } from "react";
|
|
698
861
|
|
|
699
862
|
// src/hooks/useChatMessages.ts
|
|
700
863
|
import { useChat, useLocalParticipant as useLocalParticipant2 } from "@livekit/components-react";
|
|
701
|
-
import { useMemo } from "react";
|
|
864
|
+
import { useMemo as useMemo2 } from "react";
|
|
702
865
|
|
|
703
866
|
// src/lib/filterSystemMessages.ts
|
|
704
867
|
var SYSTEM_MESSAGE_PATTERN = /^\[\w+\]$/;
|
|
@@ -711,7 +874,7 @@ function useChatMessages() {
|
|
|
711
874
|
const { chatMessages: rawMessages, send, isSending } = useChat();
|
|
712
875
|
const { localParticipant } = useLocalParticipant2();
|
|
713
876
|
const localIdentity = localParticipant.identity;
|
|
714
|
-
const chatMessages =
|
|
877
|
+
const chatMessages = useMemo2(() => {
|
|
715
878
|
const sortedMessages = rawMessages.map((msg) => ({
|
|
716
879
|
id: msg.id,
|
|
717
880
|
role: msg.from?.identity === localIdentity ? "user" : "assistant",
|
|
@@ -726,12 +889,12 @@ function useChatMessages() {
|
|
|
726
889
|
|
|
727
890
|
// src/hooks/useStreamingTranscript.ts
|
|
728
891
|
import { useLocalParticipant as useLocalParticipant3, useTranscriptions } from "@livekit/components-react";
|
|
729
|
-
import { useMemo as
|
|
892
|
+
import { useMemo as useMemo3 } from "react";
|
|
730
893
|
function useStreamingTranscript() {
|
|
731
894
|
const transcriptions = useTranscriptions();
|
|
732
895
|
const { localParticipant } = useLocalParticipant3();
|
|
733
896
|
const localIdentity = localParticipant.identity;
|
|
734
|
-
const transcriptMessages =
|
|
897
|
+
const transcriptMessages = useMemo3(() => filterSystemMessages(transcriptions.filter((stream) => stream.text.trim().length > 0).map((stream) => ({
|
|
735
898
|
id: stream.streamInfo.id,
|
|
736
899
|
role: stream.participantInfo.identity === localIdentity ? "user" : "assistant",
|
|
737
900
|
content: stream.text,
|
|
@@ -762,7 +925,7 @@ function useCombinedMessages() {
|
|
|
762
925
|
const { transcriptMessages } = useStreamingTranscript();
|
|
763
926
|
const { chatMessages, sendChatMessage, isSendingChat } = useChatMessages();
|
|
764
927
|
const { state: agentState } = useVoiceAssistant2();
|
|
765
|
-
const allMessages =
|
|
928
|
+
const allMessages = useMemo4(() => {
|
|
766
929
|
if (chatMessages.length === 0)
|
|
767
930
|
return transcriptMessages;
|
|
768
931
|
if (transcriptMessages.length === 0)
|
|
@@ -777,11 +940,11 @@ import { useCallback as useCallback4 } from "react";
|
|
|
777
940
|
|
|
778
941
|
// src/hooks/useAgentState.ts
|
|
779
942
|
import { useRemoteParticipants } from "@livekit/components-react";
|
|
780
|
-
import { useEffect as
|
|
943
|
+
import { useEffect as useEffect4, useState as useState4 } from "react";
|
|
781
944
|
function useAgentState(attributeKey, parse, initial) {
|
|
782
|
-
const [value, setValue] =
|
|
945
|
+
const [value, setValue] = useState4(initial);
|
|
783
946
|
const remoteParticipants = useRemoteParticipants();
|
|
784
|
-
|
|
947
|
+
useEffect4(() => {
|
|
785
948
|
const agentParticipant = remoteParticipants.find((p) => p.attributes?.[attributeKey]);
|
|
786
949
|
if (agentParticipant) {
|
|
787
950
|
const attr = agentParticipant.attributes?.[attributeKey];
|
|
@@ -854,7 +1017,7 @@ var SIDEBAR_WIDTH = 480;
|
|
|
854
1017
|
|
|
855
1018
|
// src/components/ui/button.tsx
|
|
856
1019
|
import { forwardRef as forwardRef3 } from "react";
|
|
857
|
-
import { jsx as
|
|
1020
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
858
1021
|
var variantClasses = {
|
|
859
1022
|
default: "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90",
|
|
860
1023
|
destructive: "skippr:bg-destructive skippr:text-white skippr:hover:bg-destructive/90",
|
|
@@ -873,8 +1036,8 @@ var sizeClasses = {
|
|
|
873
1036
|
"icon-lg": "skippr:size-10"
|
|
874
1037
|
};
|
|
875
1038
|
var Button = forwardRef3(({ className, variant = "default", size = "default", ...props }, ref) => {
|
|
876
|
-
return /* @__PURE__ */
|
|
877
|
-
className: cn("skippr:inline-flex skippr:items-center skippr:justify-center skippr:gap-2 skippr:whitespace-nowrap skippr:rounded-md skippr:text-sm skippr:font-medium skippr:ring-offset-background skippr:transition-all skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-ring skippr:focus-visible:ring-offset-2 skippr:disabled:pointer-events-none skippr:disabled:opacity-50 skippr:shrink-0 skippr:[&_svg]:pointer-events-none skippr:[&_svg:not([class*='size-'])]:size-4 skippr:[&_svg]:shrink-0", variantClasses[variant], sizeClasses[size], className),
|
|
1039
|
+
return /* @__PURE__ */ jsx3("button", {
|
|
1040
|
+
className: cn("skippr:inline-flex skippr:items-center skippr:justify-center skippr:gap-2 skippr:whitespace-nowrap skippr:rounded-md skippr:text-sm skippr:font-medium skippr:ring-offset-background skippr:transition-all skippr:cursor-pointer skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-ring skippr:focus-visible:ring-offset-2 skippr:disabled:pointer-events-none skippr:disabled:opacity-50 skippr:shrink-0 skippr:[&_svg]:pointer-events-none skippr:[&_svg:not([class*='size-'])]:size-4 skippr:[&_svg]:shrink-0", variantClasses[variant], sizeClasses[size], className),
|
|
878
1041
|
ref,
|
|
879
1042
|
...props
|
|
880
1043
|
});
|
|
@@ -882,45 +1045,45 @@ var Button = forwardRef3(({ className, variant = "default", size = "default", ..
|
|
|
882
1045
|
Button.displayName = "Button";
|
|
883
1046
|
|
|
884
1047
|
// src/components/ChatHeader.tsx
|
|
885
|
-
import { jsx as
|
|
1048
|
+
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
886
1049
|
function ChatHeader({ onOpenSettings }) {
|
|
887
1050
|
const { closePanel, minimizePanel, minimizable } = useLiveAgent();
|
|
888
|
-
return /* @__PURE__ */
|
|
1051
|
+
return /* @__PURE__ */ jsxs3("div", {
|
|
889
1052
|
className: "skippr:flex skippr:items-center skippr:gap-3 skippr:bg-primary skippr:px-4 skippr:py-3 skippr:text-primary-foreground",
|
|
890
1053
|
children: [
|
|
891
|
-
/* @__PURE__ */
|
|
1054
|
+
/* @__PURE__ */ jsx4("div", {
|
|
892
1055
|
className: "skippr:flex skippr:size-6 skippr:items-center skippr:justify-center skippr:rounded-full skippr:bg-primary-foreground/20",
|
|
893
|
-
children: /* @__PURE__ */
|
|
1056
|
+
children: /* @__PURE__ */ jsx4(Bot, {
|
|
894
1057
|
className: "skippr:size-3.5 skippr:text-primary-foreground"
|
|
895
1058
|
})
|
|
896
1059
|
}),
|
|
897
|
-
/* @__PURE__ */
|
|
1060
|
+
/* @__PURE__ */ jsx4("div", {
|
|
898
1061
|
className: "skippr:flex-1",
|
|
899
|
-
children: /* @__PURE__ */
|
|
1062
|
+
children: /* @__PURE__ */ jsx4("p", {
|
|
900
1063
|
className: "skippr:text-sm skippr:font-semibold skippr:leading-none",
|
|
901
1064
|
children: "AI Agent"
|
|
902
1065
|
})
|
|
903
1066
|
}),
|
|
904
|
-
/* @__PURE__ */
|
|
1067
|
+
/* @__PURE__ */ jsxs3("div", {
|
|
905
1068
|
className: "skippr:flex skippr:items-center skippr:gap-1",
|
|
906
1069
|
children: [
|
|
907
|
-
/* @__PURE__ */
|
|
1070
|
+
/* @__PURE__ */ jsx4(Button, {
|
|
908
1071
|
variant: "ghost",
|
|
909
1072
|
size: "icon-xs",
|
|
910
1073
|
onClick: onOpenSettings,
|
|
911
1074
|
className: "skippr:text-primary-foreground skippr:hover:bg-primary-foreground/20 skippr:hover:text-primary-foreground",
|
|
912
1075
|
"aria-label": "Settings",
|
|
913
|
-
children: /* @__PURE__ */
|
|
1076
|
+
children: /* @__PURE__ */ jsx4(Settings, {
|
|
914
1077
|
className: "skippr:size-4"
|
|
915
1078
|
})
|
|
916
1079
|
}),
|
|
917
|
-
/* @__PURE__ */
|
|
1080
|
+
/* @__PURE__ */ jsx4(Button, {
|
|
918
1081
|
variant: "ghost",
|
|
919
1082
|
size: "icon-xs",
|
|
920
1083
|
onClick: minimizable ? minimizePanel : closePanel,
|
|
921
1084
|
className: "skippr:text-primary-foreground skippr:hover:bg-primary-foreground/20 skippr:hover:text-primary-foreground",
|
|
922
1085
|
"aria-label": "Close",
|
|
923
|
-
children: /* @__PURE__ */
|
|
1086
|
+
children: /* @__PURE__ */ jsx4(X, {
|
|
924
1087
|
className: "skippr:size-4"
|
|
925
1088
|
})
|
|
926
1089
|
})
|
|
@@ -931,13 +1094,13 @@ function ChatHeader({ onOpenSettings }) {
|
|
|
931
1094
|
}
|
|
932
1095
|
|
|
933
1096
|
// src/components/LoginFlow.tsx
|
|
934
|
-
import { useCallback as useCallback6, useEffect as
|
|
935
|
-
import { jsx as
|
|
1097
|
+
import { useCallback as useCallback6, useEffect as useEffect5, useRef as useRef2, useState as useState5 } from "react";
|
|
1098
|
+
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
936
1099
|
var OTP_LENGTH = 6;
|
|
937
1100
|
var DIGIT_KEYS = ["d0", "d1", "d2", "d3", "d4", "d5"];
|
|
938
1101
|
function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
|
|
939
|
-
const [step, setStep] =
|
|
940
|
-
const [email, setEmail] =
|
|
1102
|
+
const [step, setStep] = useState5("email");
|
|
1103
|
+
const [email, setEmail] = useState5("");
|
|
941
1104
|
const handleRequestOtp = useCallback6(async (emailValue) => {
|
|
942
1105
|
const success = await requestOtp(emailValue);
|
|
943
1106
|
if (success)
|
|
@@ -953,7 +1116,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
|
|
|
953
1116
|
await requestOtp(email);
|
|
954
1117
|
}, [requestOtp, email]);
|
|
955
1118
|
if (step === "otp") {
|
|
956
|
-
return /* @__PURE__ */
|
|
1119
|
+
return /* @__PURE__ */ jsx5(OtpStep, {
|
|
957
1120
|
email,
|
|
958
1121
|
onSubmit: handleVerifyOtp,
|
|
959
1122
|
onResend: handleResend,
|
|
@@ -962,7 +1125,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
|
|
|
962
1125
|
isSubmitting
|
|
963
1126
|
});
|
|
964
1127
|
}
|
|
965
|
-
return /* @__PURE__ */
|
|
1128
|
+
return /* @__PURE__ */ jsx5(EmailStep, {
|
|
966
1129
|
email,
|
|
967
1130
|
onEmailChange: setEmail,
|
|
968
1131
|
onSubmit: handleRequestOtp,
|
|
@@ -976,30 +1139,30 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
|
|
|
976
1139
|
if (email.trim())
|
|
977
1140
|
onSubmit(email.trim());
|
|
978
1141
|
}
|
|
979
|
-
return /* @__PURE__ */
|
|
1142
|
+
return /* @__PURE__ */ jsxs4("div", {
|
|
980
1143
|
className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:px-4 skippr:py-4",
|
|
981
1144
|
children: [
|
|
982
|
-
/* @__PURE__ */
|
|
1145
|
+
/* @__PURE__ */ jsxs4("div", {
|
|
983
1146
|
className: "skippr:mb-4 skippr:text-center",
|
|
984
1147
|
children: [
|
|
985
|
-
/* @__PURE__ */
|
|
1148
|
+
/* @__PURE__ */ jsx5(Mail, {
|
|
986
1149
|
className: "skippr:mx-auto skippr:mb-2 skippr:size-6 skippr:text-primary"
|
|
987
1150
|
}),
|
|
988
|
-
/* @__PURE__ */
|
|
1151
|
+
/* @__PURE__ */ jsx5("p", {
|
|
989
1152
|
className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
|
|
990
1153
|
children: "Sign in to continue"
|
|
991
1154
|
}),
|
|
992
|
-
/* @__PURE__ */
|
|
1155
|
+
/* @__PURE__ */ jsx5("p", {
|
|
993
1156
|
className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
|
|
994
1157
|
children: "Your email will be used to identify you across sessions"
|
|
995
1158
|
})
|
|
996
1159
|
]
|
|
997
1160
|
}),
|
|
998
|
-
/* @__PURE__ */
|
|
1161
|
+
/* @__PURE__ */ jsxs4("form", {
|
|
999
1162
|
onSubmit: handleSubmit,
|
|
1000
1163
|
className: "skippr:flex skippr:flex-col skippr:gap-3",
|
|
1001
1164
|
children: [
|
|
1002
|
-
/* @__PURE__ */
|
|
1165
|
+
/* @__PURE__ */ jsx5("input", {
|
|
1003
1166
|
type: "email",
|
|
1004
1167
|
placeholder: "you@example.com",
|
|
1005
1168
|
value: email,
|
|
@@ -1008,15 +1171,15 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
|
|
|
1008
1171
|
required: true,
|
|
1009
1172
|
className: "skippr:w-full skippr:rounded-md skippr:border skippr:border-border skippr:bg-background skippr:px-3 skippr:py-2 skippr:text-sm skippr:text-foreground skippr:placeholder-muted-foreground skippr:outline-none focus:skippr:ring-2 focus:skippr:ring-primary/30 focus:skippr:border-primary disabled:skippr:opacity-50"
|
|
1010
1173
|
}),
|
|
1011
|
-
/* @__PURE__ */
|
|
1174
|
+
/* @__PURE__ */ jsx5(Button, {
|
|
1012
1175
|
type: "submit",
|
|
1013
1176
|
disabled: isSubmitting || !email.trim(),
|
|
1014
1177
|
className: "skippr:w-full",
|
|
1015
|
-
children: isSubmitting ? /* @__PURE__ */
|
|
1178
|
+
children: isSubmitting ? /* @__PURE__ */ jsx5(LoaderCircle, {
|
|
1016
1179
|
className: "skippr:size-4 skippr:animate-spin"
|
|
1017
1180
|
}) : "Continue"
|
|
1018
1181
|
}),
|
|
1019
|
-
error && /* @__PURE__ */
|
|
1182
|
+
error && /* @__PURE__ */ jsx5("p", {
|
|
1020
1183
|
className: "skippr:text-xs skippr:text-center skippr:text-destructive",
|
|
1021
1184
|
children: error
|
|
1022
1185
|
})
|
|
@@ -1026,18 +1189,18 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
|
|
|
1026
1189
|
});
|
|
1027
1190
|
}
|
|
1028
1191
|
function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
1029
|
-
const [digits, setDigits] =
|
|
1030
|
-
const [resendCooldown, setResendCooldown] =
|
|
1031
|
-
const inputRefs =
|
|
1032
|
-
const submittedRef =
|
|
1033
|
-
|
|
1192
|
+
const [digits, setDigits] = useState5(Array(OTP_LENGTH).fill(""));
|
|
1193
|
+
const [resendCooldown, setResendCooldown] = useState5(0);
|
|
1194
|
+
const inputRefs = useRef2([]);
|
|
1195
|
+
const submittedRef = useRef2(false);
|
|
1196
|
+
useEffect5(() => {
|
|
1034
1197
|
inputRefs.current[0]?.focus();
|
|
1035
1198
|
}, []);
|
|
1036
|
-
|
|
1199
|
+
useEffect5(() => {
|
|
1037
1200
|
if (error)
|
|
1038
1201
|
submittedRef.current = false;
|
|
1039
1202
|
}, [error]);
|
|
1040
|
-
|
|
1203
|
+
useEffect5(() => {
|
|
1041
1204
|
if (resendCooldown <= 0)
|
|
1042
1205
|
return;
|
|
1043
1206
|
const timer = setTimeout(() => setResendCooldown((c) => c - 1), 1000);
|
|
@@ -1096,22 +1259,22 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
|
1096
1259
|
submittedRef.current = false;
|
|
1097
1260
|
inputRefs.current[0]?.focus();
|
|
1098
1261
|
}
|
|
1099
|
-
return /* @__PURE__ */
|
|
1262
|
+
return /* @__PURE__ */ jsxs4("div", {
|
|
1100
1263
|
className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:px-4 skippr:py-4",
|
|
1101
1264
|
children: [
|
|
1102
|
-
/* @__PURE__ */
|
|
1265
|
+
/* @__PURE__ */ jsxs4("div", {
|
|
1103
1266
|
className: "skippr:mb-4 skippr:text-center",
|
|
1104
1267
|
children: [
|
|
1105
|
-
/* @__PURE__ */
|
|
1268
|
+
/* @__PURE__ */ jsx5("p", {
|
|
1106
1269
|
className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
|
|
1107
1270
|
children: "Enter verification code"
|
|
1108
1271
|
}),
|
|
1109
|
-
/* @__PURE__ */
|
|
1272
|
+
/* @__PURE__ */ jsxs4("p", {
|
|
1110
1273
|
className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
|
|
1111
1274
|
children: [
|
|
1112
1275
|
"We sent a 6-digit code to",
|
|
1113
1276
|
" ",
|
|
1114
|
-
/* @__PURE__ */
|
|
1277
|
+
/* @__PURE__ */ jsx5("span", {
|
|
1115
1278
|
className: "skippr:font-medium skippr:text-foreground",
|
|
1116
1279
|
children: email
|
|
1117
1280
|
})
|
|
@@ -1119,13 +1282,13 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
|
1119
1282
|
})
|
|
1120
1283
|
]
|
|
1121
1284
|
}),
|
|
1122
|
-
/* @__PURE__ */
|
|
1285
|
+
/* @__PURE__ */ jsxs4("form", {
|
|
1123
1286
|
onSubmit: handleSubmit,
|
|
1124
1287
|
className: "skippr:flex skippr:flex-col skippr:gap-3",
|
|
1125
1288
|
children: [
|
|
1126
|
-
/* @__PURE__ */
|
|
1289
|
+
/* @__PURE__ */ jsx5("div", {
|
|
1127
1290
|
className: "skippr:flex skippr:justify-center skippr:gap-1.5",
|
|
1128
|
-
children: digits.map((digit, index2) => /* @__PURE__ */
|
|
1291
|
+
children: digits.map((digit, index2) => /* @__PURE__ */ jsx5("input", {
|
|
1129
1292
|
ref: (el) => {
|
|
1130
1293
|
inputRefs.current[index2] = el;
|
|
1131
1294
|
},
|
|
@@ -1140,29 +1303,29 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
|
1140
1303
|
className: "skippr:h-10 skippr:w-10 skippr:rounded-md skippr:border skippr:border-border skippr:bg-background skippr:text-center skippr:text-sm skippr:font-semibold skippr:text-foreground skippr:outline-none focus:skippr:ring-2 focus:skippr:ring-primary/30 focus:skippr:border-primary disabled:skippr:opacity-50"
|
|
1141
1304
|
}, DIGIT_KEYS[index2]))
|
|
1142
1305
|
}),
|
|
1143
|
-
error && /* @__PURE__ */
|
|
1306
|
+
error && /* @__PURE__ */ jsx5("p", {
|
|
1144
1307
|
className: "skippr:text-xs skippr:text-center skippr:text-destructive",
|
|
1145
1308
|
children: error
|
|
1146
1309
|
}),
|
|
1147
|
-
/* @__PURE__ */
|
|
1310
|
+
/* @__PURE__ */ jsx5(Button, {
|
|
1148
1311
|
type: "submit",
|
|
1149
1312
|
disabled: isSubmitting || digits.join("").length !== OTP_LENGTH,
|
|
1150
1313
|
className: "skippr:w-full",
|
|
1151
|
-
children: isSubmitting ? /* @__PURE__ */
|
|
1314
|
+
children: isSubmitting ? /* @__PURE__ */ jsx5(LoaderCircle, {
|
|
1152
1315
|
className: "skippr:size-4 skippr:animate-spin"
|
|
1153
1316
|
}) : "Verify"
|
|
1154
1317
|
}),
|
|
1155
|
-
/* @__PURE__ */
|
|
1318
|
+
/* @__PURE__ */ jsxs4("div", {
|
|
1156
1319
|
className: "skippr:flex skippr:items-center skippr:justify-between skippr:text-xs",
|
|
1157
1320
|
children: [
|
|
1158
|
-
/* @__PURE__ */
|
|
1321
|
+
/* @__PURE__ */ jsx5("button", {
|
|
1159
1322
|
type: "button",
|
|
1160
1323
|
onClick: onBack,
|
|
1161
1324
|
disabled: isSubmitting,
|
|
1162
1325
|
className: "skippr:text-muted-foreground hover:skippr:text-foreground skippr:transition-colors disabled:skippr:opacity-50",
|
|
1163
1326
|
children: "Change email"
|
|
1164
1327
|
}),
|
|
1165
|
-
/* @__PURE__ */
|
|
1328
|
+
/* @__PURE__ */ jsx5("button", {
|
|
1166
1329
|
type: "button",
|
|
1167
1330
|
onClick: handleResend,
|
|
1168
1331
|
disabled: isSubmitting || resendCooldown > 0,
|
|
@@ -1180,7 +1343,7 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
|
1180
1343
|
// src/components/MeetingControls.tsx
|
|
1181
1344
|
import { useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react";
|
|
1182
1345
|
import { ScreenSharePresets as ScreenSharePresets2 } from "livekit-client";
|
|
1183
|
-
import { useCallback as useCallback7, useEffect as
|
|
1346
|
+
import { useCallback as useCallback7, useEffect as useEffect6, useRef as useRef3, useState as useState6 } from "react";
|
|
1184
1347
|
|
|
1185
1348
|
// src/lib/format.ts
|
|
1186
1349
|
function formatTime(seconds) {
|
|
@@ -1194,12 +1357,12 @@ function parseNumber(s) {
|
|
|
1194
1357
|
}
|
|
1195
1358
|
|
|
1196
1359
|
// src/components/SessionWarningBanner.tsx
|
|
1197
|
-
import { jsx as
|
|
1360
|
+
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
1198
1361
|
var SESSION_WARNING_THRESHOLD_SECS = 60;
|
|
1199
1362
|
function SessionWarningBanner({ remaining }) {
|
|
1200
1363
|
if (remaining === null || remaining <= 0 || remaining > SESSION_WARNING_THRESHOLD_SECS)
|
|
1201
1364
|
return null;
|
|
1202
|
-
return /* @__PURE__ */
|
|
1365
|
+
return /* @__PURE__ */ jsx6("div", {
|
|
1203
1366
|
"data-testid": "session-warning-banner",
|
|
1204
1367
|
className: "skippr:bg-red-50 skippr:px-4 skippr:py-1.5 skippr:text-center skippr:text-xs skippr:font-medium skippr:text-red-700",
|
|
1205
1368
|
children: "Session ending soon"
|
|
@@ -1207,15 +1370,15 @@ function SessionWarningBanner({ remaining }) {
|
|
|
1207
1370
|
}
|
|
1208
1371
|
|
|
1209
1372
|
// src/components/MeetingControls.tsx
|
|
1210
|
-
import { jsx as
|
|
1373
|
+
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
1211
1374
|
function MeetingControls({ onHangUp }) {
|
|
1212
1375
|
const maxCallDuration = useAgentState("maxCallDuration", parseNumber, null);
|
|
1213
1376
|
const { localParticipant } = useLocalParticipant4();
|
|
1214
1377
|
const isMuted = !localParticipant.isMicrophoneEnabled;
|
|
1215
1378
|
const isScreenSharing = localParticipant.isScreenShareEnabled;
|
|
1216
|
-
const endTimeRef =
|
|
1217
|
-
const [remaining, setRemaining] =
|
|
1218
|
-
|
|
1379
|
+
const endTimeRef = useRef3(null);
|
|
1380
|
+
const [remaining, setRemaining] = useState6(null);
|
|
1381
|
+
useEffect6(() => {
|
|
1219
1382
|
if (maxCallDuration === null || endTimeRef.current !== null)
|
|
1220
1383
|
return;
|
|
1221
1384
|
endTimeRef.current = Date.now() + maxCallDuration * 1000;
|
|
@@ -1245,55 +1408,64 @@ function MeetingControls({ onHangUp }) {
|
|
|
1245
1408
|
console.error("Failed to toggle screen share:", e);
|
|
1246
1409
|
}
|
|
1247
1410
|
}, [localParticipant, isScreenSharing]);
|
|
1248
|
-
|
|
1411
|
+
useEffect6(() => {
|
|
1249
1412
|
toggleMute().then(() => toggleScreenShare());
|
|
1250
1413
|
}, []);
|
|
1251
|
-
return /* @__PURE__ */
|
|
1414
|
+
return /* @__PURE__ */ jsxs5("div", {
|
|
1252
1415
|
children: [
|
|
1253
|
-
/* @__PURE__ */
|
|
1416
|
+
/* @__PURE__ */ jsx7(SessionWarningBanner, {
|
|
1254
1417
|
remaining
|
|
1255
1418
|
}),
|
|
1256
|
-
/* @__PURE__ */
|
|
1419
|
+
/* @__PURE__ */ jsxs5("div", {
|
|
1257
1420
|
className: "skippr:flex skippr:items-center skippr:justify-between skippr:border-b skippr:px-4 skippr:py-3",
|
|
1258
1421
|
children: [
|
|
1259
|
-
/* @__PURE__ */
|
|
1422
|
+
/* @__PURE__ */ jsxs5("div", {
|
|
1260
1423
|
className: "skippr:flex skippr:items-center skippr:gap-2",
|
|
1261
1424
|
children: [
|
|
1262
|
-
/* @__PURE__ */
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1425
|
+
/* @__PURE__ */ jsx7(Tooltip, {
|
|
1426
|
+
label: isMuted ? "Unmute" : "Mute",
|
|
1427
|
+
children: /* @__PURE__ */ jsx7(Button, {
|
|
1428
|
+
size: "icon-sm",
|
|
1429
|
+
variant: isMuted ? "destructive" : "outline",
|
|
1430
|
+
onClick: toggleMute,
|
|
1431
|
+
"aria-label": isMuted ? "Unmute" : "Mute",
|
|
1432
|
+
children: isMuted ? /* @__PURE__ */ jsx7(MicOff, {
|
|
1433
|
+
className: "skippr:size-4"
|
|
1434
|
+
}) : /* @__PURE__ */ jsx7(Mic, {
|
|
1435
|
+
className: "skippr:size-4"
|
|
1436
|
+
})
|
|
1271
1437
|
})
|
|
1272
1438
|
}),
|
|
1273
|
-
/* @__PURE__ */
|
|
1274
|
-
|
|
1275
|
-
|
|
1276
|
-
|
|
1277
|
-
|
|
1278
|
-
|
|
1279
|
-
|
|
1280
|
-
|
|
1281
|
-
|
|
1439
|
+
/* @__PURE__ */ jsx7(Tooltip, {
|
|
1440
|
+
label: isScreenSharing ? "Stop sharing" : "Share screen",
|
|
1441
|
+
children: /* @__PURE__ */ jsx7(Button, {
|
|
1442
|
+
size: "icon-sm",
|
|
1443
|
+
variant: isScreenSharing ? "outline" : "destructive",
|
|
1444
|
+
onClick: toggleScreenShare,
|
|
1445
|
+
"aria-label": isScreenSharing ? "Stop sharing" : "Share screen",
|
|
1446
|
+
children: isScreenSharing ? /* @__PURE__ */ jsx7(MonitorOff, {
|
|
1447
|
+
className: "skippr:size-4"
|
|
1448
|
+
}) : /* @__PURE__ */ jsx7(Monitor, {
|
|
1449
|
+
className: "skippr:size-4"
|
|
1450
|
+
})
|
|
1282
1451
|
})
|
|
1283
1452
|
})
|
|
1284
1453
|
]
|
|
1285
1454
|
}),
|
|
1286
|
-
remaining !== null && /* @__PURE__ */
|
|
1455
|
+
remaining !== null && /* @__PURE__ */ jsx7("span", {
|
|
1287
1456
|
className: cn("skippr:text-sm skippr:font-medium skippr:tabular-nums", remaining <= SESSION_WARNING_THRESHOLD_SECS ? "skippr:text-red-600 skippr:animate-pulse" : "skippr:text-muted-foreground"),
|
|
1288
1457
|
children: formatTime(remaining)
|
|
1289
1458
|
}),
|
|
1290
|
-
/* @__PURE__ */
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1459
|
+
/* @__PURE__ */ jsx7(Tooltip, {
|
|
1460
|
+
label: "End session",
|
|
1461
|
+
children: /* @__PURE__ */ jsx7(Button, {
|
|
1462
|
+
size: "icon-sm",
|
|
1463
|
+
variant: "destructive",
|
|
1464
|
+
onClick: onHangUp,
|
|
1465
|
+
"aria-label": "Hang up",
|
|
1466
|
+
children: /* @__PURE__ */ jsx7(PhoneOff, {
|
|
1467
|
+
className: "skippr:size-4"
|
|
1468
|
+
})
|
|
1297
1469
|
})
|
|
1298
1470
|
})
|
|
1299
1471
|
]
|
|
@@ -1303,13 +1475,13 @@ function MeetingControls({ onHangUp }) {
|
|
|
1303
1475
|
}
|
|
1304
1476
|
|
|
1305
1477
|
// src/components/MessageList.tsx
|
|
1306
|
-
import { useEffect as
|
|
1478
|
+
import { useEffect as useEffect7, useRef as useRef4 } from "react";
|
|
1307
1479
|
|
|
1308
1480
|
// src/components/ChatInput.tsx
|
|
1309
|
-
import { useState as
|
|
1310
|
-
import { jsx as
|
|
1481
|
+
import { useState as useState7 } from "react";
|
|
1482
|
+
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
1311
1483
|
function ChatInput({ sendChatMessage, isSendingChat }) {
|
|
1312
|
-
const [inputText, setInputText] =
|
|
1484
|
+
const [inputText, setInputText] = useState7("");
|
|
1313
1485
|
const canSend = inputText.trim().length > 0 && !isSendingChat;
|
|
1314
1486
|
function handleSubmit(e) {
|
|
1315
1487
|
e.preventDefault();
|
|
@@ -1319,11 +1491,11 @@ function ChatInput({ sendChatMessage, isSendingChat }) {
|
|
|
1319
1491
|
setInputText("");
|
|
1320
1492
|
sendChatMessage(text).catch(() => setInputText(text));
|
|
1321
1493
|
}
|
|
1322
|
-
return /* @__PURE__ */
|
|
1494
|
+
return /* @__PURE__ */ jsxs6("form", {
|
|
1323
1495
|
onSubmit: handleSubmit,
|
|
1324
1496
|
className: "skippr:flex skippr:items-center skippr:gap-2 skippr:border-t skippr:border-border skippr:px-3 skippr:py-2",
|
|
1325
1497
|
children: [
|
|
1326
|
-
/* @__PURE__ */
|
|
1498
|
+
/* @__PURE__ */ jsx8("input", {
|
|
1327
1499
|
type: "text",
|
|
1328
1500
|
value: inputText,
|
|
1329
1501
|
onChange: (e) => setInputText(e.target.value),
|
|
@@ -1331,12 +1503,12 @@ function ChatInput({ sendChatMessage, isSendingChat }) {
|
|
|
1331
1503
|
className: cn("skippr:flex-1 skippr:rounded-lg skippr:border skippr:border-border skippr:bg-background", "skippr:px-3 skippr:py-2 skippr:text-sm skippr:text-foreground", "skippr:placeholder:text-muted-foreground skippr:outline-none", "skippr:focus:ring-1 skippr:focus:ring-ring"),
|
|
1332
1504
|
disabled: isSendingChat
|
|
1333
1505
|
}),
|
|
1334
|
-
/* @__PURE__ */
|
|
1506
|
+
/* @__PURE__ */ jsx8("button", {
|
|
1335
1507
|
type: "submit",
|
|
1336
1508
|
disabled: !canSend,
|
|
1337
1509
|
"aria-label": "Send message",
|
|
1338
1510
|
className: cn("skippr:flex skippr:size-9 skippr:shrink-0 skippr:items-center skippr:justify-center", "skippr:rounded-lg skippr:bg-primary skippr:text-primary-foreground", "skippr:transition-opacity", !canSend && "skippr:opacity-50 skippr:cursor-not-allowed"),
|
|
1339
|
-
children: /* @__PURE__ */
|
|
1511
|
+
children: /* @__PURE__ */ jsx8(SendHorizontal, {
|
|
1340
1512
|
className: "skippr:size-4"
|
|
1341
1513
|
})
|
|
1342
1514
|
})
|
|
@@ -1345,12 +1517,12 @@ function ChatInput({ sendChatMessage, isSendingChat }) {
|
|
|
1345
1517
|
}
|
|
1346
1518
|
|
|
1347
1519
|
// src/components/ChatMessage.tsx
|
|
1348
|
-
import { jsx as
|
|
1520
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
1349
1521
|
function ChatMessage({ message }) {
|
|
1350
1522
|
const isUser = message.role === "user";
|
|
1351
|
-
return /* @__PURE__ */
|
|
1523
|
+
return /* @__PURE__ */ jsx9("div", {
|
|
1352
1524
|
className: cn("skippr:flex skippr:w-full skippr:px-4 skippr:py-1", isUser ? "skippr:justify-end" : "skippr:justify-start"),
|
|
1353
|
-
children: /* @__PURE__ */
|
|
1525
|
+
children: /* @__PURE__ */ jsx9("div", {
|
|
1354
1526
|
className: cn("skippr:max-w-[85%] skippr:whitespace-pre-wrap skippr:rounded-2xl skippr:px-4 skippr:py-2.5 skippr:text-sm skippr:leading-relaxed", isUser ? "skippr:rounded-br-sm skippr:bg-primary skippr:text-primary-foreground" : "skippr:rounded-bl-sm skippr:bg-muted skippr:text-foreground"),
|
|
1355
1527
|
children: message.content
|
|
1356
1528
|
})
|
|
@@ -1358,20 +1530,20 @@ function ChatMessage({ message }) {
|
|
|
1358
1530
|
}
|
|
1359
1531
|
|
|
1360
1532
|
// src/components/TypingIndicator.tsx
|
|
1361
|
-
import { jsx as
|
|
1533
|
+
import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1362
1534
|
function TypingIndicator() {
|
|
1363
|
-
return /* @__PURE__ */
|
|
1535
|
+
return /* @__PURE__ */ jsx10("div", {
|
|
1364
1536
|
className: "skippr:flex skippr:items-center skippr:gap-1 skippr:px-4 skippr:py-3",
|
|
1365
|
-
children: /* @__PURE__ */
|
|
1537
|
+
children: /* @__PURE__ */ jsxs7("div", {
|
|
1366
1538
|
className: "skippr:flex skippr:items-center skippr:gap-1 skippr:rounded-2xl skippr:rounded-bl-sm skippr:bg-muted skippr:px-4 skippr:py-2.5",
|
|
1367
1539
|
children: [
|
|
1368
|
-
/* @__PURE__ */
|
|
1540
|
+
/* @__PURE__ */ jsx10("span", {
|
|
1369
1541
|
className: "skippr:size-1.5 skippr:animate-bounce skippr:rounded-full skippr:bg-muted-foreground/60 skippr:[animation-delay:0ms]"
|
|
1370
1542
|
}),
|
|
1371
|
-
/* @__PURE__ */
|
|
1543
|
+
/* @__PURE__ */ jsx10("span", {
|
|
1372
1544
|
className: "skippr:size-1.5 skippr:animate-bounce skippr:rounded-full skippr:bg-muted-foreground/60 skippr:[animation-delay:150ms]"
|
|
1373
1545
|
}),
|
|
1374
|
-
/* @__PURE__ */
|
|
1546
|
+
/* @__PURE__ */ jsx10("span", {
|
|
1375
1547
|
className: "skippr:size-1.5 skippr:animate-bounce skippr:rounded-full skippr:bg-muted-foreground/60 skippr:[animation-delay:300ms]"
|
|
1376
1548
|
})
|
|
1377
1549
|
]
|
|
@@ -1380,38 +1552,67 @@ function TypingIndicator() {
|
|
|
1380
1552
|
}
|
|
1381
1553
|
|
|
1382
1554
|
// src/components/MessageList.tsx
|
|
1383
|
-
import { jsx as
|
|
1555
|
+
import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1384
1556
|
function MessageList({
|
|
1385
1557
|
messages,
|
|
1386
1558
|
isStreaming,
|
|
1387
1559
|
sendChatMessage,
|
|
1388
1560
|
isSendingChat
|
|
1389
1561
|
}) {
|
|
1390
|
-
const scrollRef =
|
|
1562
|
+
const scrollRef = useRef4(null);
|
|
1391
1563
|
const lastMessage = messages.length > 0 ? messages[messages.length - 1] : undefined;
|
|
1392
|
-
|
|
1564
|
+
useEffect7(() => {
|
|
1393
1565
|
scrollRef.current?.scrollIntoView({ behavior: "smooth" });
|
|
1394
1566
|
}, [messages.length, lastMessage?.content]);
|
|
1395
1567
|
const showTyping = isStreaming && lastMessage?.role === "assistant" && lastMessage.content === "";
|
|
1396
|
-
return /* @__PURE__ */
|
|
1568
|
+
return /* @__PURE__ */ jsxs8("div", {
|
|
1397
1569
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
|
|
1398
1570
|
children: [
|
|
1399
|
-
/* @__PURE__ */
|
|
1571
|
+
/* @__PURE__ */ jsx11("div", {
|
|
1400
1572
|
className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto",
|
|
1401
|
-
children: /* @__PURE__ */
|
|
1573
|
+
children: /* @__PURE__ */ jsxs8("div", {
|
|
1402
1574
|
className: "skippr:flex skippr:flex-col skippr:gap-1 skippr:py-3",
|
|
1403
1575
|
children: [
|
|
1404
|
-
messages.
|
|
1576
|
+
messages.length === 0 && !showTyping && /* @__PURE__ */ jsxs8("div", {
|
|
1577
|
+
className: "skippr:flex skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:py-10 skippr:text-center skippr:px-4",
|
|
1578
|
+
children: [
|
|
1579
|
+
/* @__PURE__ */ jsxs8("div", {
|
|
1580
|
+
className: "skippr:flex skippr:items-end skippr:justify-center skippr:gap-[3px] skippr:h-5",
|
|
1581
|
+
children: [
|
|
1582
|
+
/* @__PURE__ */ jsx11("span", {
|
|
1583
|
+
className: "skippr:w-[3px] skippr:rounded-full skippr:bg-primary/40 skippr:animate-[skippr-wave_1.2s_ease-in-out_infinite] skippr:h-2"
|
|
1584
|
+
}),
|
|
1585
|
+
/* @__PURE__ */ jsx11("span", {
|
|
1586
|
+
className: "skippr:w-[3px] skippr:rounded-full skippr:bg-primary/40 skippr:animate-[skippr-wave_1.2s_ease-in-out_0.15s_infinite] skippr:h-3"
|
|
1587
|
+
}),
|
|
1588
|
+
/* @__PURE__ */ jsx11("span", {
|
|
1589
|
+
className: "skippr:w-[3px] skippr:rounded-full skippr:bg-primary/40 skippr:animate-[skippr-wave_1.2s_ease-in-out_0.3s_infinite] skippr:h-4"
|
|
1590
|
+
}),
|
|
1591
|
+
/* @__PURE__ */ jsx11("span", {
|
|
1592
|
+
className: "skippr:w-[3px] skippr:rounded-full skippr:bg-primary/40 skippr:animate-[skippr-wave_1.2s_ease-in-out_0.45s_infinite] skippr:h-3"
|
|
1593
|
+
}),
|
|
1594
|
+
/* @__PURE__ */ jsx11("span", {
|
|
1595
|
+
className: "skippr:w-[3px] skippr:rounded-full skippr:bg-primary/40 skippr:animate-[skippr-wave_1.2s_ease-in-out_0.6s_infinite] skippr:h-2"
|
|
1596
|
+
})
|
|
1597
|
+
]
|
|
1598
|
+
}),
|
|
1599
|
+
/* @__PURE__ */ jsx11("p", {
|
|
1600
|
+
className: "skippr:text-xs skippr:text-muted-foreground",
|
|
1601
|
+
children: "Agent is getting ready..."
|
|
1602
|
+
})
|
|
1603
|
+
]
|
|
1604
|
+
}),
|
|
1605
|
+
messages.map((message) => /* @__PURE__ */ jsx11(ChatMessage, {
|
|
1405
1606
|
message
|
|
1406
1607
|
}, message.id)),
|
|
1407
|
-
showTyping && /* @__PURE__ */
|
|
1408
|
-
/* @__PURE__ */
|
|
1608
|
+
showTyping && /* @__PURE__ */ jsx11(TypingIndicator, {}),
|
|
1609
|
+
/* @__PURE__ */ jsx11("div", {
|
|
1409
1610
|
ref: scrollRef
|
|
1410
1611
|
})
|
|
1411
1612
|
]
|
|
1412
1613
|
})
|
|
1413
1614
|
}),
|
|
1414
|
-
/* @__PURE__ */
|
|
1615
|
+
/* @__PURE__ */ jsx11(ChatInput, {
|
|
1415
1616
|
sendChatMessage,
|
|
1416
1617
|
isSendingChat
|
|
1417
1618
|
})
|
|
@@ -1420,30 +1621,30 @@ function MessageList({
|
|
|
1420
1621
|
}
|
|
1421
1622
|
|
|
1422
1623
|
// src/components/QuickActions.tsx
|
|
1423
|
-
import { jsx as
|
|
1624
|
+
import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1424
1625
|
function QuickActions({ onStartSession, isStarting, error }) {
|
|
1425
|
-
return /* @__PURE__ */
|
|
1626
|
+
return /* @__PURE__ */ jsxs9("div", {
|
|
1426
1627
|
className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:gap-6 skippr:overflow-y-auto skippr:px-4 skippr:py-4",
|
|
1427
1628
|
children: [
|
|
1428
|
-
/* @__PURE__ */
|
|
1629
|
+
/* @__PURE__ */ jsx12("p", {
|
|
1429
1630
|
className: "skippr:mb-1 skippr:text-sm skippr:text-muted-foreground",
|
|
1430
1631
|
children: "How can I help you today?"
|
|
1431
1632
|
}),
|
|
1432
|
-
/* @__PURE__ */
|
|
1633
|
+
/* @__PURE__ */ jsxs9(Button, {
|
|
1433
1634
|
variant: "outline",
|
|
1434
1635
|
className: "skippr:h-auto skippr:flex-col skippr:gap-1.5 skippr:whitespace-normal skippr:py-3 skippr:text-xs",
|
|
1435
1636
|
onClick: onStartSession,
|
|
1436
1637
|
disabled: isStarting,
|
|
1437
1638
|
children: [
|
|
1438
|
-
isStarting ? /* @__PURE__ */
|
|
1639
|
+
isStarting ? /* @__PURE__ */ jsx12(LoaderCircle, {
|
|
1439
1640
|
className: "skippr:size-4 skippr:animate-spin skippr:text-primary"
|
|
1440
|
-
}) : /* @__PURE__ */
|
|
1641
|
+
}) : /* @__PURE__ */ jsx12(MessageCircleQuestionMark, {
|
|
1441
1642
|
className: "skippr:size-4 skippr:text-primary"
|
|
1442
1643
|
}),
|
|
1443
1644
|
isStarting ? "Starting..." : "Start Session"
|
|
1444
1645
|
]
|
|
1445
1646
|
}),
|
|
1446
|
-
error && /* @__PURE__ */
|
|
1647
|
+
error && /* @__PURE__ */ jsx12("p", {
|
|
1447
1648
|
className: "skippr:text-xs skippr:text-destructive",
|
|
1448
1649
|
children: error
|
|
1449
1650
|
})
|
|
@@ -1452,52 +1653,52 @@ function QuickActions({ onStartSession, isStarting, error }) {
|
|
|
1452
1653
|
}
|
|
1453
1654
|
|
|
1454
1655
|
// src/components/SessionAgenda.tsx
|
|
1455
|
-
import { jsx as
|
|
1656
|
+
import { jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1456
1657
|
function SessionAgenda({ phases, questions = [] }) {
|
|
1457
1658
|
if (phases.length === 0) {
|
|
1458
|
-
return /* @__PURE__ */
|
|
1659
|
+
return /* @__PURE__ */ jsxs10("div", {
|
|
1459
1660
|
className: "skippr:flex skippr:flex-col skippr:gap-3 skippr:p-4",
|
|
1460
1661
|
children: [
|
|
1461
|
-
/* @__PURE__ */
|
|
1662
|
+
/* @__PURE__ */ jsx13("h3", {
|
|
1462
1663
|
className: "skippr:text-sm skippr:font-semibold",
|
|
1463
1664
|
children: "Agenda"
|
|
1464
1665
|
}),
|
|
1465
|
-
/* @__PURE__ */
|
|
1666
|
+
/* @__PURE__ */ jsx13("p", {
|
|
1466
1667
|
className: "skippr:text-xs skippr:text-muted-foreground",
|
|
1467
1668
|
children: "Waiting for session..."
|
|
1468
1669
|
})
|
|
1469
1670
|
]
|
|
1470
1671
|
});
|
|
1471
1672
|
}
|
|
1472
|
-
return /* @__PURE__ */
|
|
1673
|
+
return /* @__PURE__ */ jsxs10("div", {
|
|
1473
1674
|
className: "skippr:flex skippr:flex-col skippr:gap-3 skippr:p-4",
|
|
1474
1675
|
children: [
|
|
1475
|
-
/* @__PURE__ */
|
|
1676
|
+
/* @__PURE__ */ jsx13("h3", {
|
|
1476
1677
|
className: "skippr:text-sm skippr:font-semibold",
|
|
1477
1678
|
children: "Agenda"
|
|
1478
1679
|
}),
|
|
1479
|
-
/* @__PURE__ */
|
|
1680
|
+
/* @__PURE__ */ jsx13("ul", {
|
|
1480
1681
|
className: "skippr:flex skippr:flex-col skippr:gap-2",
|
|
1481
1682
|
children: phases.map((phase) => {
|
|
1482
1683
|
const phaseQuestions = questions.filter((q) => q.phaseName === phase.name);
|
|
1483
1684
|
const answeredCount = phaseQuestions.filter((q) => q.status === "answered").length;
|
|
1484
1685
|
const totalCount = phaseQuestions.length;
|
|
1485
|
-
return /* @__PURE__ */
|
|
1686
|
+
return /* @__PURE__ */ jsxs10("li", {
|
|
1486
1687
|
className: "skippr:flex skippr:flex-col skippr:gap-0.5",
|
|
1487
1688
|
children: [
|
|
1488
|
-
/* @__PURE__ */
|
|
1689
|
+
/* @__PURE__ */ jsxs10("div", {
|
|
1489
1690
|
className: "skippr:flex skippr:items-center skippr:gap-2 skippr:text-sm",
|
|
1490
1691
|
children: [
|
|
1491
|
-
/* @__PURE__ */
|
|
1692
|
+
/* @__PURE__ */ jsx13(PhaseIcon, {
|
|
1492
1693
|
status: phase.status
|
|
1493
1694
|
}),
|
|
1494
|
-
/* @__PURE__ */
|
|
1695
|
+
/* @__PURE__ */ jsx13("span", {
|
|
1495
1696
|
className: cn(phase.status === "completed" && "skippr:text-muted-foreground skippr:line-through", phase.status === "active" && "skippr:font-medium skippr:text-primary"),
|
|
1496
1697
|
children: phase.name
|
|
1497
1698
|
})
|
|
1498
1699
|
]
|
|
1499
1700
|
}),
|
|
1500
|
-
totalCount > 0 && /* @__PURE__ */
|
|
1701
|
+
totalCount > 0 && /* @__PURE__ */ jsxs10("span", {
|
|
1501
1702
|
className: "skippr:ml-6 skippr:text-xs skippr:text-muted-foreground",
|
|
1502
1703
|
children: [
|
|
1503
1704
|
answeredCount,
|
|
@@ -1515,84 +1716,84 @@ function SessionAgenda({ phases, questions = [] }) {
|
|
|
1515
1716
|
}
|
|
1516
1717
|
function PhaseIcon({ status }) {
|
|
1517
1718
|
if (status === "completed") {
|
|
1518
|
-
return /* @__PURE__ */
|
|
1719
|
+
return /* @__PURE__ */ jsx13("div", {
|
|
1519
1720
|
className: "skippr:flex skippr:size-4 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-full skippr:bg-primary",
|
|
1520
|
-
children: /* @__PURE__ */
|
|
1721
|
+
children: /* @__PURE__ */ jsx13(Check, {
|
|
1521
1722
|
className: "skippr:size-2.5 skippr:text-primary-foreground",
|
|
1522
1723
|
strokeWidth: 3
|
|
1523
1724
|
})
|
|
1524
1725
|
});
|
|
1525
1726
|
}
|
|
1526
1727
|
if (status === "active") {
|
|
1527
|
-
return /* @__PURE__ */
|
|
1728
|
+
return /* @__PURE__ */ jsx13(LoaderCircle, {
|
|
1528
1729
|
className: "skippr:size-4 skippr:shrink-0 skippr:text-primary skippr:animate-spin"
|
|
1529
1730
|
});
|
|
1530
1731
|
}
|
|
1531
|
-
return /* @__PURE__ */
|
|
1732
|
+
return /* @__PURE__ */ jsx13(Circle, {
|
|
1532
1733
|
className: "skippr:size-4 skippr:shrink-0 skippr:text-muted-foreground"
|
|
1533
1734
|
});
|
|
1534
1735
|
}
|
|
1535
1736
|
|
|
1536
1737
|
// src/components/SettingsView.tsx
|
|
1537
|
-
import { jsx as
|
|
1738
|
+
import { jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1538
1739
|
function SettingsView({ onBack }) {
|
|
1539
1740
|
const { position, setPosition } = useLiveAgent();
|
|
1540
|
-
return /* @__PURE__ */
|
|
1741
|
+
return /* @__PURE__ */ jsxs11("div", {
|
|
1541
1742
|
className: "skippr:flex skippr:flex-1 skippr:flex-col",
|
|
1542
1743
|
children: [
|
|
1543
|
-
/* @__PURE__ */
|
|
1744
|
+
/* @__PURE__ */ jsxs11("div", {
|
|
1544
1745
|
className: "skippr:flex skippr:items-center skippr:gap-2 skippr:border-b skippr:border-border skippr:px-4 skippr:py-3",
|
|
1545
1746
|
children: [
|
|
1546
|
-
/* @__PURE__ */
|
|
1747
|
+
/* @__PURE__ */ jsx14(Button, {
|
|
1547
1748
|
variant: "ghost",
|
|
1548
1749
|
size: "icon-xs",
|
|
1549
1750
|
onClick: onBack,
|
|
1550
1751
|
"aria-label": "Back",
|
|
1551
|
-
children: /* @__PURE__ */
|
|
1752
|
+
children: /* @__PURE__ */ jsx14(ArrowLeft, {
|
|
1552
1753
|
className: "skippr:size-4"
|
|
1553
1754
|
})
|
|
1554
1755
|
}),
|
|
1555
|
-
/* @__PURE__ */
|
|
1756
|
+
/* @__PURE__ */ jsx14("p", {
|
|
1556
1757
|
className: "skippr:text-sm skippr:font-semibold",
|
|
1557
1758
|
children: "Settings"
|
|
1558
1759
|
})
|
|
1559
1760
|
]
|
|
1560
1761
|
}),
|
|
1561
|
-
/* @__PURE__ */
|
|
1762
|
+
/* @__PURE__ */ jsx14("div", {
|
|
1562
1763
|
className: "skippr:flex-1 skippr:overflow-y-auto skippr:p-4",
|
|
1563
|
-
children: /* @__PURE__ */
|
|
1764
|
+
children: /* @__PURE__ */ jsxs11("div", {
|
|
1564
1765
|
className: "skippr:mb-4",
|
|
1565
1766
|
children: [
|
|
1566
|
-
/* @__PURE__ */
|
|
1767
|
+
/* @__PURE__ */ jsx14("p", {
|
|
1567
1768
|
className: "skippr:mb-2 skippr:text-xs skippr:font-medium skippr:uppercase skippr:tracking-wide skippr:text-muted-foreground",
|
|
1568
1769
|
children: "Widget Position"
|
|
1569
1770
|
}),
|
|
1570
|
-
/* @__PURE__ */
|
|
1771
|
+
/* @__PURE__ */ jsxs11("div", {
|
|
1571
1772
|
className: "skippr:flex skippr:gap-2",
|
|
1572
1773
|
children: [
|
|
1573
|
-
/* @__PURE__ */
|
|
1774
|
+
/* @__PURE__ */ jsxs11("button", {
|
|
1574
1775
|
type: "button",
|
|
1575
1776
|
onClick: () => setPosition("left"),
|
|
1576
1777
|
className: cn("skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:gap-2 skippr:rounded-lg skippr:border skippr:p-3 skippr:cursor-pointer skippr:transition-colors", position === "left" ? "skippr:border-primary skippr:bg-primary/5 skippr:text-primary" : "skippr:border-border skippr:text-muted-foreground skippr:hover:border-primary/40"),
|
|
1577
1778
|
children: [
|
|
1578
|
-
/* @__PURE__ */
|
|
1779
|
+
/* @__PURE__ */ jsx14(PanelLeft, {
|
|
1579
1780
|
className: "skippr:size-5"
|
|
1580
1781
|
}),
|
|
1581
|
-
/* @__PURE__ */
|
|
1782
|
+
/* @__PURE__ */ jsx14("span", {
|
|
1582
1783
|
className: "skippr:text-xs skippr:font-medium",
|
|
1583
1784
|
children: "Left"
|
|
1584
1785
|
})
|
|
1585
1786
|
]
|
|
1586
1787
|
}),
|
|
1587
|
-
/* @__PURE__ */
|
|
1788
|
+
/* @__PURE__ */ jsxs11("button", {
|
|
1588
1789
|
type: "button",
|
|
1589
1790
|
onClick: () => setPosition("right"),
|
|
1590
1791
|
className: cn("skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:gap-2 skippr:rounded-lg skippr:border skippr:p-3 skippr:cursor-pointer skippr:transition-colors", position === "right" ? "skippr:border-primary skippr:bg-primary/5 skippr:text-primary" : "skippr:border-border skippr:text-muted-foreground skippr:hover:border-primary/40"),
|
|
1591
1792
|
children: [
|
|
1592
|
-
/* @__PURE__ */
|
|
1793
|
+
/* @__PURE__ */ jsx14(PanelRight, {
|
|
1593
1794
|
className: "skippr:size-5"
|
|
1594
1795
|
}),
|
|
1595
|
-
/* @__PURE__ */
|
|
1796
|
+
/* @__PURE__ */ jsx14("span", {
|
|
1596
1797
|
className: "skippr:text-xs skippr:font-medium",
|
|
1597
1798
|
children: "Right"
|
|
1598
1799
|
})
|
|
@@ -1608,7 +1809,7 @@ function SettingsView({ onBack }) {
|
|
|
1608
1809
|
}
|
|
1609
1810
|
|
|
1610
1811
|
// src/components/Sidebar.tsx
|
|
1611
|
-
import { jsx as
|
|
1812
|
+
import { jsx as jsx15, jsxs as jsxs12, Fragment as Fragment2 } from "react/jsx-runtime";
|
|
1612
1813
|
function Sidebar() {
|
|
1613
1814
|
const {
|
|
1614
1815
|
variant,
|
|
@@ -1626,10 +1827,10 @@ function Sidebar() {
|
|
|
1626
1827
|
verifyOtp,
|
|
1627
1828
|
isAuthSubmitting
|
|
1628
1829
|
} = useLiveAgent();
|
|
1629
|
-
const [view, setView] =
|
|
1830
|
+
const [view, setView] = useState8("main");
|
|
1630
1831
|
const isFloating = variant === "floating";
|
|
1631
1832
|
const isSidebar = variant === "sidebar";
|
|
1632
|
-
|
|
1833
|
+
useEffect8(() => {
|
|
1633
1834
|
if (!isSidebar)
|
|
1634
1835
|
return;
|
|
1635
1836
|
const prop = position === "right" ? "marginRight" : "marginLeft";
|
|
@@ -1643,29 +1844,29 @@ function Sidebar() {
|
|
|
1643
1844
|
document.body.style.transition = "";
|
|
1644
1845
|
};
|
|
1645
1846
|
}, [isSidebar, isPanelOpen, position]);
|
|
1646
|
-
return /* @__PURE__ */
|
|
1847
|
+
return /* @__PURE__ */ jsx15("div", {
|
|
1647
1848
|
className: cn("skippr:fixed skippr:z-[9999]", "skippr:bg-background skippr:border skippr:border-border", "skippr:flex skippr:flex-col", "skippr:overflow-hidden", isFloating && "skippr:bottom-4 skippr:min-h-[28rem] skippr:max-h-[calc(100vh-6rem)] skippr:rounded-2xl skippr:shadow-2xl", isFloating && (position === "right" ? "skippr:right-4" : "skippr:left-4"), isFloating && "skippr:transition-[opacity,transform] skippr:duration-300 skippr:ease-in-out", isFloating && (position === "right" ? "skippr:origin-bottom-right" : "skippr:origin-bottom-left"), isFloating && !isPanelOpen && "skippr:scale-0 skippr:opacity-0 skippr:pointer-events-none", isFloating && isPanelOpen && "skippr:scale-100 skippr:opacity-100", isSidebar && "skippr:top-0 skippr:h-full", isSidebar && "skippr:transition-[width] skippr:duration-300 skippr:ease-in-out", isSidebar && position === "right" && "skippr:right-0 skippr:border-l skippr:border-l-border", isSidebar && position === "left" && "skippr:left-0 skippr:border-r skippr:border-r-border", isSidebar && !isPanelOpen && "skippr:w-0 skippr:border-0"),
|
|
1648
1849
|
style: { width: isPanelOpen ? SIDEBAR_WIDTH : undefined },
|
|
1649
|
-
children: view === "settings" ? /* @__PURE__ */
|
|
1850
|
+
children: view === "settings" ? /* @__PURE__ */ jsx15(SettingsView, {
|
|
1650
1851
|
onBack: () => setView("main")
|
|
1651
|
-
}) : /* @__PURE__ */
|
|
1852
|
+
}) : /* @__PURE__ */ jsxs12(Fragment2, {
|
|
1652
1853
|
children: [
|
|
1653
|
-
/* @__PURE__ */
|
|
1854
|
+
/* @__PURE__ */ jsx15(ChatHeader, {
|
|
1654
1855
|
onOpenSettings: () => setView("settings")
|
|
1655
1856
|
}),
|
|
1656
|
-
isConnected ? /* @__PURE__ */
|
|
1857
|
+
isConnected ? /* @__PURE__ */ jsx15(ConnectedContent, {
|
|
1657
1858
|
onDisconnect: disconnect
|
|
1658
|
-
}) : isValidating ? /* @__PURE__ */
|
|
1859
|
+
}) : isValidating ? /* @__PURE__ */ jsx15("div", {
|
|
1659
1860
|
className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
|
|
1660
|
-
children: /* @__PURE__ */
|
|
1861
|
+
children: /* @__PURE__ */ jsx15("p", {
|
|
1661
1862
|
className: "skippr:text-sm skippr:text-muted-foreground",
|
|
1662
1863
|
children: "Loading..."
|
|
1663
1864
|
})
|
|
1664
|
-
}) : isAuthenticated ? /* @__PURE__ */
|
|
1865
|
+
}) : isAuthenticated ? /* @__PURE__ */ jsx15(QuickActions, {
|
|
1665
1866
|
onStartSession: startSession,
|
|
1666
1867
|
isStarting,
|
|
1667
1868
|
error
|
|
1668
|
-
}) : /* @__PURE__ */
|
|
1869
|
+
}) : /* @__PURE__ */ jsx15(LoginFlow, {
|
|
1669
1870
|
requestOtp,
|
|
1670
1871
|
verifyOtp,
|
|
1671
1872
|
error: authError,
|
|
@@ -1682,33 +1883,33 @@ function ConnectedContent({ onDisconnect }) {
|
|
|
1682
1883
|
const { phases } = usePhaseUpdates();
|
|
1683
1884
|
const { questions } = useQuestionUpdates();
|
|
1684
1885
|
if (!isConnected) {
|
|
1685
|
-
return /* @__PURE__ */
|
|
1886
|
+
return /* @__PURE__ */ jsx15("div", {
|
|
1686
1887
|
className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
|
|
1687
|
-
children: /* @__PURE__ */
|
|
1888
|
+
children: /* @__PURE__ */ jsx15("p", {
|
|
1688
1889
|
className: "skippr:text-sm skippr:text-muted-foreground",
|
|
1689
1890
|
children: "Connecting..."
|
|
1690
1891
|
})
|
|
1691
1892
|
});
|
|
1692
1893
|
}
|
|
1693
1894
|
const isAgentSpeaking = agentState === "speaking";
|
|
1694
|
-
return /* @__PURE__ */
|
|
1895
|
+
return /* @__PURE__ */ jsxs12(Fragment2, {
|
|
1695
1896
|
children: [
|
|
1696
|
-
/* @__PURE__ */
|
|
1897
|
+
/* @__PURE__ */ jsx15(MeetingControls, {
|
|
1697
1898
|
onHangUp: onDisconnect
|
|
1698
1899
|
}),
|
|
1699
|
-
/* @__PURE__ */
|
|
1900
|
+
/* @__PURE__ */ jsxs12("div", {
|
|
1700
1901
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1",
|
|
1701
1902
|
children: [
|
|
1702
|
-
/* @__PURE__ */
|
|
1903
|
+
/* @__PURE__ */ jsx15("div", {
|
|
1703
1904
|
className: "skippr:w-[180px] skippr:shrink-0 skippr:overflow-y-auto skippr:border-r",
|
|
1704
|
-
children: /* @__PURE__ */
|
|
1905
|
+
children: /* @__PURE__ */ jsx15(SessionAgenda, {
|
|
1705
1906
|
phases,
|
|
1706
1907
|
questions
|
|
1707
1908
|
})
|
|
1708
1909
|
}),
|
|
1709
|
-
/* @__PURE__ */
|
|
1910
|
+
/* @__PURE__ */ jsx15("div", {
|
|
1710
1911
|
className: "skippr:flex skippr:min-w-0 skippr:flex-1 skippr:flex-col",
|
|
1711
|
-
children: /* @__PURE__ */
|
|
1912
|
+
children: /* @__PURE__ */ jsx15(MessageList, {
|
|
1712
1913
|
messages: allMessages,
|
|
1713
1914
|
isStreaming: isAgentSpeaking,
|
|
1714
1915
|
sendChatMessage,
|
|
@@ -1722,26 +1923,26 @@ function ConnectedContent({ onDisconnect }) {
|
|
|
1722
1923
|
}
|
|
1723
1924
|
|
|
1724
1925
|
// src/components/SidebarTrigger.tsx
|
|
1725
|
-
import { jsx as
|
|
1926
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
1726
1927
|
function SidebarTrigger() {
|
|
1727
1928
|
const { isPanelOpen, togglePanel, position, isMinimized } = useLiveAgent();
|
|
1728
1929
|
if (isMinimized)
|
|
1729
1930
|
return null;
|
|
1730
|
-
return /* @__PURE__ */
|
|
1931
|
+
return /* @__PURE__ */ jsx16(Button, {
|
|
1731
1932
|
size: "icon-lg",
|
|
1732
1933
|
onClick: togglePanel,
|
|
1733
1934
|
className: cn("skippr:fixed skippr:bottom-6 skippr:z-[9998] skippr:size-14 skippr:rounded-full skippr:shadow-lg skippr:transition-all skippr:duration-300", position === "right" ? "skippr:right-6" : "skippr:left-6"),
|
|
1734
1935
|
title: isPanelOpen ? "Close chat" : "Chat with us",
|
|
1735
|
-
children: isPanelOpen ? /* @__PURE__ */
|
|
1936
|
+
children: isPanelOpen ? /* @__PURE__ */ jsx16(X, {
|
|
1736
1937
|
className: "skippr:size-6"
|
|
1737
|
-
}) : /* @__PURE__ */
|
|
1938
|
+
}) : /* @__PURE__ */ jsx16(MessageCircle, {
|
|
1738
1939
|
className: "skippr:size-6"
|
|
1739
1940
|
})
|
|
1740
1941
|
});
|
|
1741
1942
|
}
|
|
1742
1943
|
|
|
1743
1944
|
// src/components/LiveAgent.tsx
|
|
1744
|
-
import { jsx as
|
|
1945
|
+
import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1745
1946
|
function LiveAgent({
|
|
1746
1947
|
agentId,
|
|
1747
1948
|
authToken: authTokenProp,
|
|
@@ -1751,6 +1952,7 @@ function LiveAgent({
|
|
|
1751
1952
|
variant = "floating",
|
|
1752
1953
|
minimizable = true,
|
|
1753
1954
|
defaultOpen = false,
|
|
1955
|
+
welcomeMessage,
|
|
1754
1956
|
children
|
|
1755
1957
|
}) {
|
|
1756
1958
|
const auth = useAuth({ appKey });
|
|
@@ -1761,9 +1963,11 @@ function LiveAgent({
|
|
|
1761
1963
|
appKey,
|
|
1762
1964
|
userToken
|
|
1763
1965
|
});
|
|
1764
|
-
const [isPanelOpen, setIsPanelOpen] =
|
|
1765
|
-
const [isMinimized, setIsMinimized] =
|
|
1766
|
-
const [
|
|
1966
|
+
const [isPanelOpen, setIsPanelOpen] = useState9(defaultOpen);
|
|
1967
|
+
const [isMinimized, setIsMinimized] = useState9(minimizable && !defaultOpen);
|
|
1968
|
+
const [welcomeDismissed, setWelcomeDismissed] = useState9(false);
|
|
1969
|
+
const dismissWelcome = useCallback8(() => setWelcomeDismissed(true), []);
|
|
1970
|
+
const [currentPosition, setCurrentPosition] = useState9(() => {
|
|
1767
1971
|
try {
|
|
1768
1972
|
const saved = localStorage.getItem("skippr_widget_position");
|
|
1769
1973
|
if (saved === "left" || saved === "right")
|
|
@@ -1792,8 +1996,8 @@ function LiveAgent({
|
|
|
1792
1996
|
}, [minimizable]);
|
|
1793
1997
|
const isConnected = connection !== null;
|
|
1794
1998
|
const isAuthenticated = !!userToken || !!authTokenProp || auth.isAuthenticated;
|
|
1795
|
-
const prevConnectionRef =
|
|
1796
|
-
|
|
1999
|
+
const prevConnectionRef = useRef5(connection);
|
|
2000
|
+
useEffect9(() => {
|
|
1797
2001
|
const connectionChanged = prevConnectionRef.current !== connection;
|
|
1798
2002
|
prevConnectionRef.current = connection;
|
|
1799
2003
|
if (connectionChanged && minimizable) {
|
|
@@ -1801,7 +2005,7 @@ function LiveAgent({
|
|
|
1801
2005
|
setIsPanelOpen(false);
|
|
1802
2006
|
}
|
|
1803
2007
|
}, [connection, minimizable]);
|
|
1804
|
-
const ctx =
|
|
2008
|
+
const ctx = useMemo5(() => ({
|
|
1805
2009
|
connection,
|
|
1806
2010
|
shouldConnect,
|
|
1807
2011
|
isConnected,
|
|
@@ -1856,27 +2060,26 @@ function LiveAgent({
|
|
|
1856
2060
|
auth.logout,
|
|
1857
2061
|
auth.isSubmitting
|
|
1858
2062
|
]);
|
|
1859
|
-
|
|
1860
|
-
children: [
|
|
1861
|
-
connection && /* @__PURE__ */ jsx16(RoomAudioRenderer, {}),
|
|
1862
|
-
isMinimized && /* @__PURE__ */ jsx16(MinimizedBubble, {}),
|
|
1863
|
-
/* @__PURE__ */ jsx16(SidebarTrigger, {}),
|
|
1864
|
-
/* @__PURE__ */ jsx16(Sidebar, {})
|
|
1865
|
-
]
|
|
1866
|
-
});
|
|
1867
|
-
return /* @__PURE__ */ jsxs12(LiveAgentContext.Provider, {
|
|
2063
|
+
return /* @__PURE__ */ jsx17(LiveAgentContext.Provider, {
|
|
1868
2064
|
value: ctx,
|
|
1869
|
-
children:
|
|
1870
|
-
connection
|
|
1871
|
-
|
|
1872
|
-
|
|
1873
|
-
|
|
1874
|
-
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
2065
|
+
children: /* @__PURE__ */ jsxs13(LiveKitRoom, {
|
|
2066
|
+
serverUrl: connection?.livekitUrl,
|
|
2067
|
+
token: connection?.token,
|
|
2068
|
+
connect: shouldConnect,
|
|
2069
|
+
audio: true,
|
|
2070
|
+
onDisconnected: disconnect,
|
|
2071
|
+
children: [
|
|
2072
|
+
connection && /* @__PURE__ */ jsx17(RoomAudioRenderer, {}),
|
|
2073
|
+
isMinimized && /* @__PURE__ */ jsx17(MinimizedBubble, {
|
|
2074
|
+
welcomeMessage,
|
|
2075
|
+
welcomeDismissed,
|
|
2076
|
+
onDismissWelcome: dismissWelcome
|
|
2077
|
+
}),
|
|
2078
|
+
/* @__PURE__ */ jsx17(SidebarTrigger, {}),
|
|
2079
|
+
/* @__PURE__ */ jsx17(Sidebar, {}),
|
|
2080
|
+
children
|
|
2081
|
+
]
|
|
2082
|
+
})
|
|
1880
2083
|
});
|
|
1881
2084
|
}
|
|
1882
2085
|
export {
|