@skippr/live-agent-sdk 0.20.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.
@@ -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 useEffect8, useMemo as useMemo4, useRef as useRef4, useState as useState8 } from "react";
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
263
- import { forwardRef as forwardRef2, createElement as createElement2 } from "react";
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/mergeClasses.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toKebabCase.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toCamelCase.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toPascalCase.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/defaultAttributes.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/hasA11yProp.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
309
- var Icon = forwardRef(({
310
- color = "currentColor",
311
- size = 24,
312
- strokeWidth = 2,
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
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) => createElement2(Icon, {
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/loader-circle.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-circle-question-mark.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/panel-left.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/send-horizontal.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/arrow-left.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/bot.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/check.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/circle.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mail.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-circle.js
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@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic-off.js
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", __iconNode11);
428
- // ../../node_modules/.bun/lucide-react@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic.js
429
- var __iconNode12 = [
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", __iconNode12);
435
- // ../../node_modules/.bun/lucide-react@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor-off.js
436
- var __iconNode13 = [
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", __iconNode13);
444
- // ../../node_modules/.bun/lucide-react@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor.js
445
- var __iconNode14 = [
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", __iconNode14);
451
- // ../../node_modules/.bun/lucide-react@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/panel-right.js
452
- var __iconNode15 = [
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", __iconNode15);
457
- // ../../node_modules/.bun/lucide-react@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/phone-off.js
458
- var __iconNode16 = [
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", __iconNode16);
476
- // ../../node_modules/.bun/lucide-react@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/settings.js
477
- var __iconNode17 = [
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", __iconNode17);
488
- // ../../node_modules/.bun/lucide-react@0.563.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/x.js
489
- var __iconNode18 = [
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", __iconNode18);
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__ */ jsxs("div", {
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__ */ jsx("span", {
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__ */ jsx("span", {
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__ */ jsx("span", {
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__ */ jsx("span", {
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__ */ jsx(Bot, {
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__ */ jsx(Bot, {
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__ */ jsx(Bot, {
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__ */ jsxs(Fragment, {
612
+ return /* @__PURE__ */ jsxs2(Fragment, {
578
613
  children: [
579
- /* @__PURE__ */ jsxs("button", {
580
- type: "button",
581
- onClick: expandPanel,
582
- 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"),
583
- "aria-label": "Expand meeting panel",
584
- children: [
585
- isSpeaking && /* @__PURE__ */ jsxs(Fragment, {
586
- children: [
587
- /* @__PURE__ */ jsx("span", {
588
- className: "skippr:absolute skippr:inset-0 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-speak-ripple"
589
- }),
590
- /* @__PURE__ */ jsx("span", {
591
- className: "skippr:absolute skippr:inset-0 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-speak-ripple-delayed"
592
- })
593
- ]
594
- }),
595
- /* @__PURE__ */ jsx(AgentAvatar, {
596
- agentState
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__ */ jsx("div", {
638
+ /* @__PURE__ */ jsx2("div", {
601
639
  className: "skippr:mx-1 skippr:h-6 skippr:w-px skippr:bg-border"
602
640
  }),
603
- /* @__PURE__ */ jsxs("div", {
641
+ /* @__PURE__ */ jsxs2("div", {
604
642
  className: "skippr:flex skippr:items-center skippr:gap-1",
605
643
  children: [
606
- /* @__PURE__ */ jsx("button", {
607
- type: "button",
608
- onClick: toggleMute,
609
- 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"),
610
- "aria-label": isMuted ? "Unmute" : "Mute",
611
- children: isMuted ? /* @__PURE__ */ jsx(MicOff, {
612
- className: "skippr:size-4"
613
- }) : /* @__PURE__ */ jsx(Mic, {
614
- className: "skippr:size-4"
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__ */ jsx("button", {
618
- type: "button",
619
- onClick: toggleScreenShare,
620
- 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"),
621
- "aria-label": isScreenSharing ? "Stop sharing" : "Share screen",
622
- children: isScreenSharing ? /* @__PURE__ */ jsx(MonitorOff, {
623
- className: "skippr:size-4"
624
- }) : /* @__PURE__ */ jsx(Monitor, {
625
- className: "skippr:size-4"
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__ */ jsx("div", {
674
+ /* @__PURE__ */ jsx2("div", {
631
675
  className: "skippr:mx-1 skippr:h-6 skippr:w-px skippr:bg-border"
632
676
  }),
633
- /* @__PURE__ */ jsx("button", {
634
- type: "button",
635
- onClick: () => disconnect(),
636
- 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",
637
- "aria-label": "Hang up",
638
- children: /* @__PURE__ */ jsx(PhoneOff, {
639
- className: "skippr:size-4"
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__ */ jsxs(Fragment, {
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__ */ jsx("button", {
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__ */ jsx(Bot, {
721
+ children: /* @__PURE__ */ jsx2(Bot, {
663
722
  className: "skippr:relative skippr:z-10 skippr:size-5"
664
723
  })
665
724
  }),
666
- /* @__PURE__ */ jsx("div", {
667
- className: "skippr:mx-1 skippr:h-6 skippr:w-px skippr:bg-border"
668
- }),
669
- /* @__PURE__ */ jsx("button", {
670
- type: "button",
671
- onClick: handleStart,
672
- disabled: isStarting,
673
- className: cn("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", isStarting && "skippr:animate-skippr-pulse-ring skippr:cursor-not-allowed"),
674
- "aria-label": "Start session",
675
- children: /* @__PURE__ */ jsx(Monitor, {
676
- className: "skippr:size-4"
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 MinimizedBubble() {
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__ */ jsx("div", {
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: isConnected ? /* @__PURE__ */ jsx(ConnectedBubbleContent, {}) : /* @__PURE__ */ jsx(IdleBubbleContent, {})
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 useEffect7, useState as useState7 } from "react";
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 useMemo3 } from "react";
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 = useMemo(() => {
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 useMemo2 } from "react";
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 = useMemo2(() => filterSystemMessages(transcriptions.filter((stream) => stream.text.trim().length > 0).map((stream) => ({
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 = useMemo3(() => {
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 useEffect3, useState as useState3 } from "react";
943
+ import { useEffect as useEffect4, useState as useState4 } from "react";
781
944
  function useAgentState(attributeKey, parse, initial) {
782
- const [value, setValue] = useState3(initial);
945
+ const [value, setValue] = useState4(initial);
783
946
  const remoteParticipants = useRemoteParticipants();
784
- useEffect3(() => {
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 jsx2 } from "react/jsx-runtime";
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__ */ jsx2("button", {
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 jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
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__ */ jsxs2("div", {
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__ */ jsx3("div", {
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__ */ jsx3(Bot, {
1056
+ children: /* @__PURE__ */ jsx4(Bot, {
894
1057
  className: "skippr:size-3.5 skippr:text-primary-foreground"
895
1058
  })
896
1059
  }),
897
- /* @__PURE__ */ jsx3("div", {
1060
+ /* @__PURE__ */ jsx4("div", {
898
1061
  className: "skippr:flex-1",
899
- children: /* @__PURE__ */ jsx3("p", {
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__ */ jsxs2("div", {
1067
+ /* @__PURE__ */ jsxs3("div", {
905
1068
  className: "skippr:flex skippr:items-center skippr:gap-1",
906
1069
  children: [
907
- /* @__PURE__ */ jsx3(Button, {
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__ */ jsx3(Settings, {
1076
+ children: /* @__PURE__ */ jsx4(Settings, {
914
1077
  className: "skippr:size-4"
915
1078
  })
916
1079
  }),
917
- /* @__PURE__ */ jsx3(Button, {
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__ */ jsx3(X, {
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 useEffect4, useRef, useState as useState4 } from "react";
935
- import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
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] = useState4("email");
940
- const [email, setEmail] = useState4("");
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__ */ jsx4(OtpStep, {
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__ */ jsx4(EmailStep, {
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__ */ jsxs3("div", {
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__ */ jsxs3("div", {
1145
+ /* @__PURE__ */ jsxs4("div", {
983
1146
  className: "skippr:mb-4 skippr:text-center",
984
1147
  children: [
985
- /* @__PURE__ */ jsx4(Mail, {
1148
+ /* @__PURE__ */ jsx5(Mail, {
986
1149
  className: "skippr:mx-auto skippr:mb-2 skippr:size-6 skippr:text-primary"
987
1150
  }),
988
- /* @__PURE__ */ jsx4("p", {
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__ */ jsx4("p", {
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__ */ jsxs3("form", {
1161
+ /* @__PURE__ */ jsxs4("form", {
999
1162
  onSubmit: handleSubmit,
1000
1163
  className: "skippr:flex skippr:flex-col skippr:gap-3",
1001
1164
  children: [
1002
- /* @__PURE__ */ jsx4("input", {
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__ */ jsx4(Button, {
1174
+ /* @__PURE__ */ jsx5(Button, {
1012
1175
  type: "submit",
1013
1176
  disabled: isSubmitting || !email.trim(),
1014
1177
  className: "skippr:w-full",
1015
- children: isSubmitting ? /* @__PURE__ */ jsx4(LoaderCircle, {
1178
+ children: isSubmitting ? /* @__PURE__ */ jsx5(LoaderCircle, {
1016
1179
  className: "skippr:size-4 skippr:animate-spin"
1017
1180
  }) : "Continue"
1018
1181
  }),
1019
- error && /* @__PURE__ */ jsx4("p", {
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] = useState4(Array(OTP_LENGTH).fill(""));
1030
- const [resendCooldown, setResendCooldown] = useState4(0);
1031
- const inputRefs = useRef([]);
1032
- const submittedRef = useRef(false);
1033
- useEffect4(() => {
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
- useEffect4(() => {
1199
+ useEffect5(() => {
1037
1200
  if (error)
1038
1201
  submittedRef.current = false;
1039
1202
  }, [error]);
1040
- useEffect4(() => {
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__ */ jsxs3("div", {
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__ */ jsxs3("div", {
1265
+ /* @__PURE__ */ jsxs4("div", {
1103
1266
  className: "skippr:mb-4 skippr:text-center",
1104
1267
  children: [
1105
- /* @__PURE__ */ jsx4("p", {
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__ */ jsxs3("p", {
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__ */ jsx4("span", {
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__ */ jsxs3("form", {
1285
+ /* @__PURE__ */ jsxs4("form", {
1123
1286
  onSubmit: handleSubmit,
1124
1287
  className: "skippr:flex skippr:flex-col skippr:gap-3",
1125
1288
  children: [
1126
- /* @__PURE__ */ jsx4("div", {
1289
+ /* @__PURE__ */ jsx5("div", {
1127
1290
  className: "skippr:flex skippr:justify-center skippr:gap-1.5",
1128
- children: digits.map((digit, index2) => /* @__PURE__ */ jsx4("input", {
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__ */ jsx4("p", {
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__ */ jsx4(Button, {
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__ */ jsx4(LoaderCircle, {
1314
+ children: isSubmitting ? /* @__PURE__ */ jsx5(LoaderCircle, {
1152
1315
  className: "skippr:size-4 skippr:animate-spin"
1153
1316
  }) : "Verify"
1154
1317
  }),
1155
- /* @__PURE__ */ jsxs3("div", {
1318
+ /* @__PURE__ */ jsxs4("div", {
1156
1319
  className: "skippr:flex skippr:items-center skippr:justify-between skippr:text-xs",
1157
1320
  children: [
1158
- /* @__PURE__ */ jsx4("button", {
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__ */ jsx4("button", {
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 useEffect5, useRef as useRef2, useState as useState5 } from "react";
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 jsx5 } from "react/jsx-runtime";
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__ */ jsx5("div", {
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 jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
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 = useRef2(null);
1217
- const [remaining, setRemaining] = useState5(null);
1218
- useEffect5(() => {
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
- useEffect5(() => {
1411
+ useEffect6(() => {
1249
1412
  toggleMute().then(() => toggleScreenShare());
1250
1413
  }, []);
1251
- return /* @__PURE__ */ jsxs4("div", {
1414
+ return /* @__PURE__ */ jsxs5("div", {
1252
1415
  children: [
1253
- /* @__PURE__ */ jsx6(SessionWarningBanner, {
1416
+ /* @__PURE__ */ jsx7(SessionWarningBanner, {
1254
1417
  remaining
1255
1418
  }),
1256
- /* @__PURE__ */ jsxs4("div", {
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__ */ jsxs4("div", {
1422
+ /* @__PURE__ */ jsxs5("div", {
1260
1423
  className: "skippr:flex skippr:items-center skippr:gap-2",
1261
1424
  children: [
1262
- /* @__PURE__ */ jsx6(Button, {
1263
- size: "icon-sm",
1264
- variant: isMuted ? "destructive" : "outline",
1265
- onClick: toggleMute,
1266
- "aria-label": isMuted ? "Unmute" : "Mute",
1267
- children: isMuted ? /* @__PURE__ */ jsx6(MicOff, {
1268
- className: "skippr:size-4"
1269
- }) : /* @__PURE__ */ jsx6(Mic, {
1270
- className: "skippr:size-4"
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__ */ jsx6(Button, {
1274
- size: "icon-sm",
1275
- variant: isScreenSharing ? "outline" : "destructive",
1276
- onClick: toggleScreenShare,
1277
- "aria-label": isScreenSharing ? "Stop sharing" : "Share screen",
1278
- children: isScreenSharing ? /* @__PURE__ */ jsx6(MonitorOff, {
1279
- className: "skippr:size-4"
1280
- }) : /* @__PURE__ */ jsx6(Monitor, {
1281
- className: "skippr:size-4"
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__ */ jsx6("span", {
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__ */ jsx6(Button, {
1291
- size: "icon-sm",
1292
- variant: "destructive",
1293
- onClick: onHangUp,
1294
- "aria-label": "Hang up",
1295
- children: /* @__PURE__ */ jsx6(PhoneOff, {
1296
- className: "skippr:size-4"
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 useEffect6, useRef as useRef3 } from "react";
1478
+ import { useEffect as useEffect7, useRef as useRef4 } from "react";
1307
1479
 
1308
1480
  // src/components/ChatInput.tsx
1309
- import { useState as useState6 } from "react";
1310
- import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
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] = useState6("");
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__ */ jsxs5("form", {
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__ */ jsx7("input", {
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__ */ jsx7("button", {
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__ */ jsx7(SendHorizontal, {
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 jsx8 } from "react/jsx-runtime";
1520
+ import { jsx as jsx9 } from "react/jsx-runtime";
1349
1521
  function ChatMessage({ message }) {
1350
1522
  const isUser = message.role === "user";
1351
- return /* @__PURE__ */ jsx8("div", {
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__ */ jsx8("div", {
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 jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
1533
+ import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
1362
1534
  function TypingIndicator() {
1363
- return /* @__PURE__ */ jsx9("div", {
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__ */ jsxs6("div", {
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__ */ jsx9("span", {
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__ */ jsx9("span", {
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__ */ jsx9("span", {
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 jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
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 = useRef3(null);
1562
+ const scrollRef = useRef4(null);
1391
1563
  const lastMessage = messages.length > 0 ? messages[messages.length - 1] : undefined;
1392
- useEffect6(() => {
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__ */ jsxs7("div", {
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__ */ jsx10("div", {
1571
+ /* @__PURE__ */ jsx11("div", {
1400
1572
  className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto",
1401
- children: /* @__PURE__ */ jsxs7("div", {
1573
+ children: /* @__PURE__ */ jsxs8("div", {
1402
1574
  className: "skippr:flex skippr:flex-col skippr:gap-1 skippr:py-3",
1403
1575
  children: [
1404
- messages.map((message) => /* @__PURE__ */ jsx10(ChatMessage, {
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__ */ jsx10(TypingIndicator, {}),
1408
- /* @__PURE__ */ jsx10("div", {
1608
+ showTyping && /* @__PURE__ */ jsx11(TypingIndicator, {}),
1609
+ /* @__PURE__ */ jsx11("div", {
1409
1610
  ref: scrollRef
1410
1611
  })
1411
1612
  ]
1412
1613
  })
1413
1614
  }),
1414
- /* @__PURE__ */ jsx10(ChatInput, {
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 jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
1624
+ import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
1424
1625
  function QuickActions({ onStartSession, isStarting, error }) {
1425
- return /* @__PURE__ */ jsxs8("div", {
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__ */ jsx11("p", {
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__ */ jsxs8(Button, {
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__ */ jsx11(LoaderCircle, {
1639
+ isStarting ? /* @__PURE__ */ jsx12(LoaderCircle, {
1439
1640
  className: "skippr:size-4 skippr:animate-spin skippr:text-primary"
1440
- }) : /* @__PURE__ */ jsx11(MessageCircleQuestionMark, {
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__ */ jsx11("p", {
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 jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
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__ */ jsxs9("div", {
1659
+ return /* @__PURE__ */ jsxs10("div", {
1459
1660
  className: "skippr:flex skippr:flex-col skippr:gap-3 skippr:p-4",
1460
1661
  children: [
1461
- /* @__PURE__ */ jsx12("h3", {
1662
+ /* @__PURE__ */ jsx13("h3", {
1462
1663
  className: "skippr:text-sm skippr:font-semibold",
1463
1664
  children: "Agenda"
1464
1665
  }),
1465
- /* @__PURE__ */ jsx12("p", {
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__ */ jsxs9("div", {
1673
+ return /* @__PURE__ */ jsxs10("div", {
1473
1674
  className: "skippr:flex skippr:flex-col skippr:gap-3 skippr:p-4",
1474
1675
  children: [
1475
- /* @__PURE__ */ jsx12("h3", {
1676
+ /* @__PURE__ */ jsx13("h3", {
1476
1677
  className: "skippr:text-sm skippr:font-semibold",
1477
1678
  children: "Agenda"
1478
1679
  }),
1479
- /* @__PURE__ */ jsx12("ul", {
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__ */ jsxs9("li", {
1686
+ return /* @__PURE__ */ jsxs10("li", {
1486
1687
  className: "skippr:flex skippr:flex-col skippr:gap-0.5",
1487
1688
  children: [
1488
- /* @__PURE__ */ jsxs9("div", {
1689
+ /* @__PURE__ */ jsxs10("div", {
1489
1690
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:text-sm",
1490
1691
  children: [
1491
- /* @__PURE__ */ jsx12(PhaseIcon, {
1692
+ /* @__PURE__ */ jsx13(PhaseIcon, {
1492
1693
  status: phase.status
1493
1694
  }),
1494
- /* @__PURE__ */ jsx12("span", {
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__ */ jsxs9("span", {
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__ */ jsx12("div", {
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__ */ jsx12(Check, {
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__ */ jsx12(LoaderCircle, {
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__ */ jsx12(Circle, {
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 jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
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__ */ jsxs10("div", {
1741
+ return /* @__PURE__ */ jsxs11("div", {
1541
1742
  className: "skippr:flex skippr:flex-1 skippr:flex-col",
1542
1743
  children: [
1543
- /* @__PURE__ */ jsxs10("div", {
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__ */ jsx13(Button, {
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__ */ jsx13(ArrowLeft, {
1752
+ children: /* @__PURE__ */ jsx14(ArrowLeft, {
1552
1753
  className: "skippr:size-4"
1553
1754
  })
1554
1755
  }),
1555
- /* @__PURE__ */ jsx13("p", {
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__ */ jsx13("div", {
1762
+ /* @__PURE__ */ jsx14("div", {
1562
1763
  className: "skippr:flex-1 skippr:overflow-y-auto skippr:p-4",
1563
- children: /* @__PURE__ */ jsxs10("div", {
1764
+ children: /* @__PURE__ */ jsxs11("div", {
1564
1765
  className: "skippr:mb-4",
1565
1766
  children: [
1566
- /* @__PURE__ */ jsx13("p", {
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__ */ jsxs10("div", {
1771
+ /* @__PURE__ */ jsxs11("div", {
1571
1772
  className: "skippr:flex skippr:gap-2",
1572
1773
  children: [
1573
- /* @__PURE__ */ jsxs10("button", {
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__ */ jsx13(PanelLeft, {
1779
+ /* @__PURE__ */ jsx14(PanelLeft, {
1579
1780
  className: "skippr:size-5"
1580
1781
  }),
1581
- /* @__PURE__ */ jsx13("span", {
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__ */ jsxs10("button", {
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__ */ jsx13(PanelRight, {
1793
+ /* @__PURE__ */ jsx14(PanelRight, {
1593
1794
  className: "skippr:size-5"
1594
1795
  }),
1595
- /* @__PURE__ */ jsx13("span", {
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 jsx14, jsxs as jsxs11, Fragment as Fragment2 } from "react/jsx-runtime";
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] = useState7("main");
1830
+ const [view, setView] = useState8("main");
1630
1831
  const isFloating = variant === "floating";
1631
1832
  const isSidebar = variant === "sidebar";
1632
- useEffect7(() => {
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__ */ jsx14("div", {
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__ */ jsx14(SettingsView, {
1850
+ children: view === "settings" ? /* @__PURE__ */ jsx15(SettingsView, {
1650
1851
  onBack: () => setView("main")
1651
- }) : /* @__PURE__ */ jsxs11(Fragment2, {
1852
+ }) : /* @__PURE__ */ jsxs12(Fragment2, {
1652
1853
  children: [
1653
- /* @__PURE__ */ jsx14(ChatHeader, {
1854
+ /* @__PURE__ */ jsx15(ChatHeader, {
1654
1855
  onOpenSettings: () => setView("settings")
1655
1856
  }),
1656
- isConnected ? /* @__PURE__ */ jsx14(ConnectedContent, {
1857
+ isConnected ? /* @__PURE__ */ jsx15(ConnectedContent, {
1657
1858
  onDisconnect: disconnect
1658
- }) : isValidating ? /* @__PURE__ */ jsx14("div", {
1859
+ }) : isValidating ? /* @__PURE__ */ jsx15("div", {
1659
1860
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
1660
- children: /* @__PURE__ */ jsx14("p", {
1861
+ children: /* @__PURE__ */ jsx15("p", {
1661
1862
  className: "skippr:text-sm skippr:text-muted-foreground",
1662
1863
  children: "Loading..."
1663
1864
  })
1664
- }) : isAuthenticated ? /* @__PURE__ */ jsx14(QuickActions, {
1865
+ }) : isAuthenticated ? /* @__PURE__ */ jsx15(QuickActions, {
1665
1866
  onStartSession: startSession,
1666
1867
  isStarting,
1667
1868
  error
1668
- }) : /* @__PURE__ */ jsx14(LoginFlow, {
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__ */ jsx14("div", {
1886
+ return /* @__PURE__ */ jsx15("div", {
1686
1887
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
1687
- children: /* @__PURE__ */ jsx14("p", {
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__ */ jsxs11(Fragment2, {
1895
+ return /* @__PURE__ */ jsxs12(Fragment2, {
1695
1896
  children: [
1696
- /* @__PURE__ */ jsx14(MeetingControls, {
1897
+ /* @__PURE__ */ jsx15(MeetingControls, {
1697
1898
  onHangUp: onDisconnect
1698
1899
  }),
1699
- /* @__PURE__ */ jsxs11("div", {
1900
+ /* @__PURE__ */ jsxs12("div", {
1700
1901
  className: "skippr:flex skippr:min-h-0 skippr:flex-1",
1701
1902
  children: [
1702
- /* @__PURE__ */ jsx14("div", {
1903
+ /* @__PURE__ */ jsx15("div", {
1703
1904
  className: "skippr:w-[180px] skippr:shrink-0 skippr:overflow-y-auto skippr:border-r",
1704
- children: /* @__PURE__ */ jsx14(SessionAgenda, {
1905
+ children: /* @__PURE__ */ jsx15(SessionAgenda, {
1705
1906
  phases,
1706
1907
  questions
1707
1908
  })
1708
1909
  }),
1709
- /* @__PURE__ */ jsx14("div", {
1910
+ /* @__PURE__ */ jsx15("div", {
1710
1911
  className: "skippr:flex skippr:min-w-0 skippr:flex-1 skippr:flex-col",
1711
- children: /* @__PURE__ */ jsx14(MessageList, {
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 jsx15 } from "react/jsx-runtime";
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__ */ jsx15(Button, {
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__ */ jsx15(X, {
1936
+ children: isPanelOpen ? /* @__PURE__ */ jsx16(X, {
1736
1937
  className: "skippr:size-6"
1737
- }) : /* @__PURE__ */ jsx15(MessageCircle, {
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 jsx16, jsxs as jsxs12, Fragment as Fragment3 } from "react/jsx-runtime";
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] = useState8(defaultOpen);
1765
- const [isMinimized, setIsMinimized] = useState8(minimizable && !defaultOpen);
1766
- const [currentPosition, setCurrentPosition] = useState8(() => {
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 = useRef4(connection);
1796
- useEffect8(() => {
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 = useMemo4(() => ({
2008
+ const ctx = useMemo5(() => ({
1805
2009
  connection,
1806
2010
  shouldConnect,
1807
2011
  isConnected,
@@ -1856,25 +2060,26 @@ function LiveAgent({
1856
2060
  auth.logout,
1857
2061
  auth.isSubmitting
1858
2062
  ]);
1859
- const widgetContent = /* @__PURE__ */ jsxs12(Fragment3, {
1860
- children: [
1861
- connection && /* @__PURE__ */ jsx16(RoomAudioRenderer, {}),
1862
- isMinimized && /* @__PURE__ */ jsx16(MinimizedBubble, {}),
1863
- /* @__PURE__ */ jsx16(SidebarTrigger, {}),
1864
- /* @__PURE__ */ jsx16(Sidebar, {}),
1865
- children
1866
- ]
1867
- });
1868
- return /* @__PURE__ */ jsx16(LiveAgentContext.Provider, {
2063
+ return /* @__PURE__ */ jsx17(LiveAgentContext.Provider, {
1869
2064
  value: ctx,
1870
- children: connection ? /* @__PURE__ */ jsx16(LiveKitRoom, {
1871
- serverUrl: connection.livekitUrl,
1872
- token: connection.token,
2065
+ children: /* @__PURE__ */ jsxs13(LiveKitRoom, {
2066
+ serverUrl: connection?.livekitUrl,
2067
+ token: connection?.token,
1873
2068
  connect: shouldConnect,
1874
2069
  audio: true,
1875
2070
  onDisconnected: disconnect,
1876
- children: widgetContent
1877
- }) : widgetContent
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
+ })
1878
2083
  });
1879
2084
  }
1880
2085
  export {