@skippr/live-agent-sdk 0.61.0 → 0.62.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 +702 -387
- package/dist/skippr-sdk.css +1 -1
- package/dist/skippr-sdk.js +150 -150
- package/dist/types/capture/agentActionSignal.d.ts +12 -0
- package/dist/types/components/MessageList.d.ts +3 -1
- package/dist/types/components/PlanCard.d.ts +8 -0
- package/dist/types/hooks/useActionControl.d.ts +8 -0
- package/dist/types/hooks/usePlanUpdates.d.ts +14 -0
- package/dist/types/lib/constants.d.ts +2 -0
- package/package.json +1 -1
package/dist/esm/lib-exports.js
CHANGED
|
@@ -8,7 +8,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
|
|
|
8
8
|
|
|
9
9
|
// src/components/LiveAgent.tsx
|
|
10
10
|
import { LiveKitRoom, RoomAudioRenderer } from "@livekit/components-react";
|
|
11
|
-
import { useCallback as
|
|
11
|
+
import { useCallback as useCallback14, useEffect as useEffect23, useMemo as useMemo6, useRef as useRef17, useState as useState17 } from "react";
|
|
12
12
|
|
|
13
13
|
// src/capture/useAgentCursor.ts
|
|
14
14
|
import { useEffect, useState } from "react";
|
|
@@ -384,8 +384,109 @@ function useAvailableModules({
|
|
|
384
384
|
};
|
|
385
385
|
}
|
|
386
386
|
|
|
387
|
+
// src/hooks/useLiveAgent.ts
|
|
388
|
+
import { useContext } from "react";
|
|
389
|
+
function useLiveAgent() {
|
|
390
|
+
const ctx = useContext(LiveAgentContext);
|
|
391
|
+
if (!ctx) {
|
|
392
|
+
throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
|
|
393
|
+
}
|
|
394
|
+
const {
|
|
395
|
+
usesHostAuth,
|
|
396
|
+
authFailed,
|
|
397
|
+
connection,
|
|
398
|
+
shouldConnect,
|
|
399
|
+
historyMessages,
|
|
400
|
+
phasesSnapshot,
|
|
401
|
+
setPhasesSnapshot,
|
|
402
|
+
hasResolvedModules,
|
|
403
|
+
adoptionGoals,
|
|
404
|
+
startAdoptionSession,
|
|
405
|
+
launcherBottomPx,
|
|
406
|
+
setLauncherBottomPx,
|
|
407
|
+
popsDown,
|
|
408
|
+
panelExpanded,
|
|
409
|
+
togglePanelExpanded,
|
|
410
|
+
...publicValue
|
|
411
|
+
} = ctx;
|
|
412
|
+
return publicValue;
|
|
413
|
+
}
|
|
414
|
+
|
|
415
|
+
// src/hooks/usePlanUpdates.ts
|
|
416
|
+
import { useCallback as useCallback4 } from "react";
|
|
417
|
+
|
|
418
|
+
// src/lib/constants.ts
|
|
419
|
+
var SIDEBAR_WIDTH = 360;
|
|
420
|
+
var WIDGET_ROOT_ID = "skippr-sdk-root";
|
|
421
|
+
var REF_ATTR = "data-skippr-ref";
|
|
422
|
+
var PRIVATE_ATTR = "data-skippr-private";
|
|
423
|
+
var DOM_SNAPSHOT_TOPIC = "skippr.dom-snapshot";
|
|
424
|
+
var DOM_EVENTS_TOPIC = "skippr.dom-events";
|
|
425
|
+
var HIGHLIGHT_TOPIC = "skippr.highlight";
|
|
426
|
+
var PAGE_ACTIONS_TOPIC = "skippr.page-actions";
|
|
427
|
+
var TEXT_MODE_TOPIC = "skippr.text-mode";
|
|
428
|
+
var ACTION_CONTROL_TOPIC = "skippr.action-control";
|
|
429
|
+
var PLAN_ATTR = "skippr.action-plan";
|
|
430
|
+
var NAME_MAX_CHARS = 80;
|
|
431
|
+
|
|
432
|
+
// src/hooks/useAgentState.ts
|
|
433
|
+
import { useRemoteParticipants } from "@livekit/components-react/hooks";
|
|
434
|
+
import { useEffect as useEffect5, useState as useState5 } from "react";
|
|
435
|
+
function useAgentState(attributeKey, parse, initial) {
|
|
436
|
+
const [value, setValue] = useState5(initial);
|
|
437
|
+
const remoteParticipants = useRemoteParticipants();
|
|
438
|
+
useEffect5(() => {
|
|
439
|
+
const agentParticipant = remoteParticipants.find((p) => p.attributes?.[attributeKey]);
|
|
440
|
+
if (agentParticipant) {
|
|
441
|
+
const attr = agentParticipant.attributes?.[attributeKey];
|
|
442
|
+
if (attr) {
|
|
443
|
+
const parsed = parse(attr);
|
|
444
|
+
if (parsed)
|
|
445
|
+
setValue(parsed);
|
|
446
|
+
}
|
|
447
|
+
}
|
|
448
|
+
const handlers = new Map;
|
|
449
|
+
for (const p of remoteParticipants) {
|
|
450
|
+
const handler = (changedAttributes) => {
|
|
451
|
+
if (changedAttributes[attributeKey]) {
|
|
452
|
+
const parsed = parse(changedAttributes[attributeKey]);
|
|
453
|
+
if (parsed)
|
|
454
|
+
setValue(parsed);
|
|
455
|
+
} else if (p.attributes?.[attributeKey]) {
|
|
456
|
+
const parsed = parse(p.attributes[attributeKey]);
|
|
457
|
+
if (parsed)
|
|
458
|
+
setValue(parsed);
|
|
459
|
+
}
|
|
460
|
+
};
|
|
461
|
+
handlers.set(p, handler);
|
|
462
|
+
p.on("attributesChanged", handler);
|
|
463
|
+
}
|
|
464
|
+
return () => {
|
|
465
|
+
for (const [p, handler] of handlers) {
|
|
466
|
+
p.off("attributesChanged", handler);
|
|
467
|
+
}
|
|
468
|
+
};
|
|
469
|
+
}, [remoteParticipants, attributeKey, parse]);
|
|
470
|
+
return value;
|
|
471
|
+
}
|
|
472
|
+
|
|
473
|
+
// src/hooks/usePlanUpdates.ts
|
|
474
|
+
function parsePlan(json) {
|
|
475
|
+
try {
|
|
476
|
+
const data = JSON.parse(json);
|
|
477
|
+
if (data.type === "plan_update" && typeof data.planId === "string" && Array.isArray(data.steps)) {
|
|
478
|
+
return { planId: data.planId, steps: data.steps, state: data.state };
|
|
479
|
+
}
|
|
480
|
+
} catch {}
|
|
481
|
+
return null;
|
|
482
|
+
}
|
|
483
|
+
function usePlanUpdates() {
|
|
484
|
+
const parse = useCallback4(parsePlan, []);
|
|
485
|
+
return useAgentState(PLAN_ATTR, parse, null);
|
|
486
|
+
}
|
|
487
|
+
|
|
387
488
|
// src/hooks/useSession.ts
|
|
388
|
-
import { useCallback as
|
|
489
|
+
import { useCallback as useCallback5, useEffect as useEffect6, useRef, useState as useState6 } from "react";
|
|
389
490
|
var API_URL4 = "https://specialist.skippr.ai/api";
|
|
390
491
|
async function fetchSessionMessages(sessionId, authedFetch) {
|
|
391
492
|
try {
|
|
@@ -443,26 +544,26 @@ function useSession({
|
|
|
443
544
|
onStartError,
|
|
444
545
|
onDisconnect
|
|
445
546
|
}) {
|
|
446
|
-
const [connection, setConnection] =
|
|
447
|
-
const [shouldConnect, setShouldConnect] =
|
|
448
|
-
const [isStarting, setIsStarting] =
|
|
449
|
-
const [isDisconnecting, setIsDisconnecting] =
|
|
450
|
-
const [error, setError] =
|
|
451
|
-
const [errorCode, setErrorCode] =
|
|
452
|
-
const [sessionId, setSessionId] =
|
|
453
|
-
const [bearerToken, setBearerToken] =
|
|
454
|
-
const [pendingScreenStream, setPendingScreenStream] =
|
|
455
|
-
const [isPaused, setIsPaused] =
|
|
456
|
-
const [isPausing, setIsPausing] =
|
|
457
|
-
const [historyMessages, setHistoryMessages] =
|
|
458
|
-
const [authFailed, setAuthFailed] =
|
|
547
|
+
const [connection, setConnection] = useState6(null);
|
|
548
|
+
const [shouldConnect, setShouldConnect] = useState6(false);
|
|
549
|
+
const [isStarting, setIsStarting] = useState6(false);
|
|
550
|
+
const [isDisconnecting, setIsDisconnecting] = useState6(false);
|
|
551
|
+
const [error, setError] = useState6("");
|
|
552
|
+
const [errorCode, setErrorCode] = useState6(null);
|
|
553
|
+
const [sessionId, setSessionId] = useState6(null);
|
|
554
|
+
const [bearerToken, setBearerToken] = useState6(authToken ?? null);
|
|
555
|
+
const [pendingScreenStream, setPendingScreenStream] = useState6(null);
|
|
556
|
+
const [isPaused, setIsPaused] = useState6(false);
|
|
557
|
+
const [isPausing, setIsPausing] = useState6(false);
|
|
558
|
+
const [historyMessages, setHistoryMessages] = useState6([]);
|
|
559
|
+
const [authFailed, setAuthFailed] = useState6(false);
|
|
459
560
|
const tokenRef = useRef(authToken ? { token: authToken, expiresAt: null } : null);
|
|
460
561
|
const getUserTokenRef = useRef(getUserToken);
|
|
461
562
|
getUserTokenRef.current = getUserToken ?? (userToken ? () => Promise.resolve(userToken) : undefined);
|
|
462
563
|
const failedBearerRef = useRef(null);
|
|
463
564
|
const inFlightExchangeRef = useRef(null);
|
|
464
|
-
const canExchange =
|
|
465
|
-
const reExchange =
|
|
565
|
+
const canExchange = useCallback5(() => !!appKey && !!getUserTokenRef.current, [appKey]);
|
|
566
|
+
const reExchange = useCallback5(async () => {
|
|
466
567
|
if (inFlightExchangeRef.current)
|
|
467
568
|
return inFlightExchangeRef.current;
|
|
468
569
|
const provider = getUserTokenRef.current;
|
|
@@ -482,7 +583,7 @@ function useSession({
|
|
|
482
583
|
inFlightExchangeRef.current = null;
|
|
483
584
|
}
|
|
484
585
|
}, [appKey]);
|
|
485
|
-
const getValidBearer =
|
|
586
|
+
const getValidBearer = useCallback5(async () => {
|
|
486
587
|
const current = tokenRef.current;
|
|
487
588
|
if (current) {
|
|
488
589
|
if (current.expiresAt === null)
|
|
@@ -494,7 +595,7 @@ function useSession({
|
|
|
494
595
|
return reExchange();
|
|
495
596
|
return current?.token ?? null;
|
|
496
597
|
}, [canExchange, reExchange]);
|
|
497
|
-
const authedFetch =
|
|
598
|
+
const authedFetch = useCallback5(async (input, init = {}) => {
|
|
498
599
|
const isSecretMode = canExchange();
|
|
499
600
|
const onTerminalAuthFailure = () => {
|
|
500
601
|
if (isSecretMode)
|
|
@@ -536,7 +637,7 @@ function useSession({
|
|
|
536
637
|
setAuthFailed(false);
|
|
537
638
|
return resp;
|
|
538
639
|
}, [canExchange, getValidBearer, reExchange]);
|
|
539
|
-
|
|
640
|
+
useEffect6(() => {
|
|
540
641
|
let stale = false;
|
|
541
642
|
if (authToken) {
|
|
542
643
|
tokenRef.current = { token: authToken, expiresAt: null };
|
|
@@ -557,7 +658,7 @@ function useSession({
|
|
|
557
658
|
}, [authToken, canExchange, reExchange]);
|
|
558
659
|
const pauseOnUnloadRef = useRef(null);
|
|
559
660
|
pauseOnUnloadRef.current = connection !== null && !isPaused && sessionId && bearerToken ? { sessionId, bearerToken } : null;
|
|
560
|
-
|
|
661
|
+
useEffect6(() => {
|
|
561
662
|
const onPageHide = () => {
|
|
562
663
|
const pending = pauseOnUnloadRef.current;
|
|
563
664
|
if (!pending)
|
|
@@ -572,7 +673,7 @@ function useSession({
|
|
|
572
673
|
window.addEventListener("pagehide", onPageHide);
|
|
573
674
|
return () => window.removeEventListener("pagehide", onPageHide);
|
|
574
675
|
}, []);
|
|
575
|
-
const startSession =
|
|
676
|
+
const startSession = useCallback5(async ({ agentId, agentControls, existingSessionId, adoptionGoalId }) => {
|
|
576
677
|
if (!bearerToken) {
|
|
577
678
|
setError("No auth token available");
|
|
578
679
|
return;
|
|
@@ -648,7 +749,7 @@ function useSession({
|
|
|
648
749
|
setIsStarting(false);
|
|
649
750
|
}
|
|
650
751
|
}, [captureMode, bearerToken, authedFetch, onStart, onStartError]);
|
|
651
|
-
const pauseSession =
|
|
752
|
+
const pauseSession = useCallback5(async () => {
|
|
652
753
|
if (!sessionId || !bearerToken)
|
|
653
754
|
return;
|
|
654
755
|
setIsPausing(true);
|
|
@@ -674,7 +775,7 @@ function useSession({
|
|
|
674
775
|
setIsPaused(true);
|
|
675
776
|
setIsPausing(false);
|
|
676
777
|
}, [sessionId, bearerToken, authedFetch, pendingScreenStream]);
|
|
677
|
-
const disconnect =
|
|
778
|
+
const disconnect = useCallback5(async () => {
|
|
678
779
|
setIsDisconnecting(true);
|
|
679
780
|
try {
|
|
680
781
|
if (sessionId && bearerToken) {
|
|
@@ -717,18 +818,6 @@ function useSession({
|
|
|
717
818
|
};
|
|
718
819
|
}
|
|
719
820
|
|
|
720
|
-
// src/lib/constants.ts
|
|
721
|
-
var SIDEBAR_WIDTH = 360;
|
|
722
|
-
var WIDGET_ROOT_ID = "skippr-sdk-root";
|
|
723
|
-
var REF_ATTR = "data-skippr-ref";
|
|
724
|
-
var PRIVATE_ATTR = "data-skippr-private";
|
|
725
|
-
var DOM_SNAPSHOT_TOPIC = "skippr.dom-snapshot";
|
|
726
|
-
var DOM_EVENTS_TOPIC = "skippr.dom-events";
|
|
727
|
-
var HIGHLIGHT_TOPIC = "skippr.highlight";
|
|
728
|
-
var PAGE_ACTIONS_TOPIC = "skippr.page-actions";
|
|
729
|
-
var TEXT_MODE_TOPIC = "skippr.text-mode";
|
|
730
|
-
var NAME_MAX_CHARS = 80;
|
|
731
|
-
|
|
732
821
|
// src/lib/launcher.ts
|
|
733
822
|
var DEFAULT_LAUNCHER_BOTTOM_PX = 48;
|
|
734
823
|
var LAUNCHER_HEIGHT_PX = 50;
|
|
@@ -849,9 +938,9 @@ var hasA11yProp = (props) => {
|
|
|
849
938
|
};
|
|
850
939
|
|
|
851
940
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/context.js
|
|
852
|
-
import { createContext as createContext2, useContext, useMemo as useMemo2, createElement } from "react";
|
|
941
|
+
import { createContext as createContext2, useContext as useContext2, useMemo as useMemo2, createElement } from "react";
|
|
853
942
|
var LucideContext = createContext2({});
|
|
854
|
-
var useLucideContext = () =>
|
|
943
|
+
var useLucideContext = () => useContext2(LucideContext);
|
|
855
944
|
|
|
856
945
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
|
|
857
946
|
var Icon = forwardRef(({ color, size, strokeWidth, absoluteStrokeWidth, className = "", children, iconNode, ...rest }, ref) => {
|
|
@@ -904,11 +993,18 @@ var __iconNode2 = [
|
|
|
904
993
|
["path", { d: "m9 12 2 2 4-4", key: "dzmm74" }]
|
|
905
994
|
];
|
|
906
995
|
var CircleCheck = createLucideIcon("circle-check", __iconNode2);
|
|
996
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/circle-x.js
|
|
997
|
+
var __iconNode3 = [
|
|
998
|
+
["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
|
|
999
|
+
["path", { d: "m15 9-6 6", key: "1uzhvr" }],
|
|
1000
|
+
["path", { d: "m9 9 6 6", key: "z0biqf" }]
|
|
1001
|
+
];
|
|
1002
|
+
var CircleX = createLucideIcon("circle-x", __iconNode3);
|
|
907
1003
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/loader-circle.js
|
|
908
|
-
var
|
|
909
|
-
var LoaderCircle = createLucideIcon("loader-circle",
|
|
1004
|
+
var __iconNode4 = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]];
|
|
1005
|
+
var LoaderCircle = createLucideIcon("loader-circle", __iconNode4);
|
|
910
1006
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/sparkles.js
|
|
911
|
-
var
|
|
1007
|
+
var __iconNode5 = [
|
|
912
1008
|
[
|
|
913
1009
|
"path",
|
|
914
1010
|
{
|
|
@@ -920,29 +1016,29 @@ var __iconNode4 = [
|
|
|
920
1016
|
["path", { d: "M22 4h-4", key: "gwowj6" }],
|
|
921
1017
|
["circle", { cx: "4", cy: "20", r: "2", key: "6kqj1y" }]
|
|
922
1018
|
];
|
|
923
|
-
var Sparkles = createLucideIcon("sparkles",
|
|
1019
|
+
var Sparkles = createLucideIcon("sparkles", __iconNode5);
|
|
924
1020
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/arrow-right.js
|
|
925
|
-
var
|
|
1021
|
+
var __iconNode6 = [
|
|
926
1022
|
["path", { d: "M5 12h14", key: "1ays0h" }],
|
|
927
1023
|
["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
|
|
928
1024
|
];
|
|
929
|
-
var ArrowRight = createLucideIcon("arrow-right",
|
|
1025
|
+
var ArrowRight = createLucideIcon("arrow-right", __iconNode6);
|
|
930
1026
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/calendar.js
|
|
931
|
-
var
|
|
1027
|
+
var __iconNode7 = [
|
|
932
1028
|
["path", { d: "M8 2v4", key: "1cmpym" }],
|
|
933
1029
|
["path", { d: "M16 2v4", key: "4m81vk" }],
|
|
934
1030
|
["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
|
|
935
1031
|
["path", { d: "M3 10h18", key: "8toen8" }]
|
|
936
1032
|
];
|
|
937
|
-
var Calendar = createLucideIcon("calendar",
|
|
1033
|
+
var Calendar = createLucideIcon("calendar", __iconNode7);
|
|
938
1034
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/chevron-down.js
|
|
939
|
-
var
|
|
940
|
-
var ChevronDown = createLucideIcon("chevron-down",
|
|
1035
|
+
var __iconNode8 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
|
|
1036
|
+
var ChevronDown = createLucideIcon("chevron-down", __iconNode8);
|
|
941
1037
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/circle.js
|
|
942
|
-
var
|
|
943
|
-
var Circle = createLucideIcon("circle",
|
|
1038
|
+
var __iconNode9 = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
|
|
1039
|
+
var Circle = createLucideIcon("circle", __iconNode9);
|
|
944
1040
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/lightbulb.js
|
|
945
|
-
var
|
|
1041
|
+
var __iconNode10 = [
|
|
946
1042
|
[
|
|
947
1043
|
"path",
|
|
948
1044
|
{
|
|
@@ -953,23 +1049,23 @@ var __iconNode9 = [
|
|
|
953
1049
|
["path", { d: "M9 18h6", key: "x1upvd" }],
|
|
954
1050
|
["path", { d: "M10 22h4", key: "ceow96" }]
|
|
955
1051
|
];
|
|
956
|
-
var Lightbulb = createLucideIcon("lightbulb",
|
|
1052
|
+
var Lightbulb = createLucideIcon("lightbulb", __iconNode10);
|
|
957
1053
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mail.js
|
|
958
|
-
var
|
|
1054
|
+
var __iconNode11 = [
|
|
959
1055
|
["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
|
|
960
1056
|
["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
|
|
961
1057
|
];
|
|
962
|
-
var Mail = createLucideIcon("mail",
|
|
1058
|
+
var Mail = createLucideIcon("mail", __iconNode11);
|
|
963
1059
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/maximize-2.js
|
|
964
|
-
var
|
|
1060
|
+
var __iconNode12 = [
|
|
965
1061
|
["path", { d: "M15 3h6v6", key: "1q9fwt" }],
|
|
966
1062
|
["path", { d: "m21 3-7 7", key: "1l2asr" }],
|
|
967
1063
|
["path", { d: "m3 21 7-7", key: "tjx5ai" }],
|
|
968
1064
|
["path", { d: "M9 21H3v-6", key: "wtvkvv" }]
|
|
969
1065
|
];
|
|
970
|
-
var Maximize2 = createLucideIcon("maximize-2",
|
|
1066
|
+
var Maximize2 = createLucideIcon("maximize-2", __iconNode12);
|
|
971
1067
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-circle.js
|
|
972
|
-
var
|
|
1068
|
+
var __iconNode13 = [
|
|
973
1069
|
[
|
|
974
1070
|
"path",
|
|
975
1071
|
{
|
|
@@ -978,9 +1074,9 @@ var __iconNode12 = [
|
|
|
978
1074
|
}
|
|
979
1075
|
]
|
|
980
1076
|
];
|
|
981
|
-
var MessageCircle = createLucideIcon("message-circle",
|
|
1077
|
+
var MessageCircle = createLucideIcon("message-circle", __iconNode13);
|
|
982
1078
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-square.js
|
|
983
|
-
var
|
|
1079
|
+
var __iconNode14 = [
|
|
984
1080
|
[
|
|
985
1081
|
"path",
|
|
986
1082
|
{
|
|
@@ -989,9 +1085,9 @@ var __iconNode13 = [
|
|
|
989
1085
|
}
|
|
990
1086
|
]
|
|
991
1087
|
];
|
|
992
|
-
var MessageSquare = createLucideIcon("message-square",
|
|
1088
|
+
var MessageSquare = createLucideIcon("message-square", __iconNode14);
|
|
993
1089
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic-off.js
|
|
994
|
-
var
|
|
1090
|
+
var __iconNode15 = [
|
|
995
1091
|
["path", { d: "M12 19v3", key: "npa21l" }],
|
|
996
1092
|
["path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33", key: "1gzdoj" }],
|
|
997
1093
|
["path", { d: "M16.95 16.95A7 7 0 0 1 5 12v-2", key: "cqa7eg" }],
|
|
@@ -999,40 +1095,40 @@ var __iconNode14 = [
|
|
|
999
1095
|
["path", { d: "m2 2 20 20", key: "1ooewy" }],
|
|
1000
1096
|
["path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12", key: "r2i35w" }]
|
|
1001
1097
|
];
|
|
1002
|
-
var MicOff = createLucideIcon("mic-off",
|
|
1098
|
+
var MicOff = createLucideIcon("mic-off", __iconNode15);
|
|
1003
1099
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic.js
|
|
1004
|
-
var
|
|
1100
|
+
var __iconNode16 = [
|
|
1005
1101
|
["path", { d: "M12 19v3", key: "npa21l" }],
|
|
1006
1102
|
["path", { d: "M19 10v2a7 7 0 0 1-14 0v-2", key: "1vc78b" }],
|
|
1007
1103
|
["rect", { x: "9", y: "2", width: "6", height: "13", rx: "3", key: "s6n7sd" }]
|
|
1008
1104
|
];
|
|
1009
|
-
var Mic = createLucideIcon("mic",
|
|
1105
|
+
var Mic = createLucideIcon("mic", __iconNode16);
|
|
1010
1106
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/minimize-2.js
|
|
1011
|
-
var
|
|
1107
|
+
var __iconNode17 = [
|
|
1012
1108
|
["path", { d: "m14 10 7-7", key: "oa77jy" }],
|
|
1013
1109
|
["path", { d: "M20 10h-6V4", key: "mjg0md" }],
|
|
1014
1110
|
["path", { d: "m3 21 7-7", key: "tjx5ai" }],
|
|
1015
1111
|
["path", { d: "M4 14h6v6", key: "rmj7iw" }]
|
|
1016
1112
|
];
|
|
1017
|
-
var Minimize2 = createLucideIcon("minimize-2",
|
|
1113
|
+
var Minimize2 = createLucideIcon("minimize-2", __iconNode17);
|
|
1018
1114
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor-off.js
|
|
1019
|
-
var
|
|
1115
|
+
var __iconNode18 = [
|
|
1020
1116
|
["path", { d: "M12 17v4", key: "1riwvh" }],
|
|
1021
1117
|
["path", { d: "M17 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 1.184-1.826", key: "cv7jms" }],
|
|
1022
1118
|
["path", { d: "m2 2 20 20", key: "1ooewy" }],
|
|
1023
1119
|
["path", { d: "M8 21h8", key: "1ev6f3" }],
|
|
1024
1120
|
["path", { d: "M8.656 3H20a2 2 0 0 1 2 2v10a2 2 0 0 1-.293 1.042", key: "z8ni2w" }]
|
|
1025
1121
|
];
|
|
1026
|
-
var MonitorOff = createLucideIcon("monitor-off",
|
|
1122
|
+
var MonitorOff = createLucideIcon("monitor-off", __iconNode18);
|
|
1027
1123
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor.js
|
|
1028
|
-
var
|
|
1124
|
+
var __iconNode19 = [
|
|
1029
1125
|
["rect", { width: "20", height: "14", x: "2", y: "3", rx: "2", key: "48i651" }],
|
|
1030
1126
|
["line", { x1: "8", x2: "16", y1: "21", y2: "21", key: "1svkeh" }],
|
|
1031
1127
|
["line", { x1: "12", x2: "12", y1: "17", y2: "21", key: "vw1qmm" }]
|
|
1032
1128
|
];
|
|
1033
|
-
var Monitor = createLucideIcon("monitor",
|
|
1129
|
+
var Monitor = createLucideIcon("monitor", __iconNode19);
|
|
1034
1130
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mouse-pointer-2.js
|
|
1035
|
-
var
|
|
1131
|
+
var __iconNode20 = [
|
|
1036
1132
|
[
|
|
1037
1133
|
"path",
|
|
1038
1134
|
{
|
|
@@ -1041,9 +1137,35 @@ var __iconNode19 = [
|
|
|
1041
1137
|
}
|
|
1042
1138
|
]
|
|
1043
1139
|
];
|
|
1044
|
-
var MousePointer2 = createLucideIcon("mouse-pointer-2",
|
|
1140
|
+
var MousePointer2 = createLucideIcon("mouse-pointer-2", __iconNode20);
|
|
1141
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mouse-pointer-click.js
|
|
1142
|
+
var __iconNode21 = [
|
|
1143
|
+
["path", { d: "M14 4.1 12 6", key: "ita8i4" }],
|
|
1144
|
+
["path", { d: "m5.1 8-2.9-.8", key: "1go3kf" }],
|
|
1145
|
+
["path", { d: "m6 12-1.9 2", key: "mnht97" }],
|
|
1146
|
+
["path", { d: "M7.2 2.2 8 5.1", key: "1cfko1" }],
|
|
1147
|
+
[
|
|
1148
|
+
"path",
|
|
1149
|
+
{
|
|
1150
|
+
d: "M9.037 9.69a.498.498 0 0 1 .653-.653l11 4.5a.5.5 0 0 1-.074.949l-4.349 1.041a1 1 0 0 0-.74.739l-1.04 4.35a.5.5 0 0 1-.95.074z",
|
|
1151
|
+
key: "s0h3yz"
|
|
1152
|
+
}
|
|
1153
|
+
]
|
|
1154
|
+
];
|
|
1155
|
+
var MousePointerClick = createLucideIcon("mouse-pointer-click", __iconNode21);
|
|
1156
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/play.js
|
|
1157
|
+
var __iconNode22 = [
|
|
1158
|
+
[
|
|
1159
|
+
"path",
|
|
1160
|
+
{
|
|
1161
|
+
d: "M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z",
|
|
1162
|
+
key: "10ikf1"
|
|
1163
|
+
}
|
|
1164
|
+
]
|
|
1165
|
+
];
|
|
1166
|
+
var Play = createLucideIcon("play", __iconNode22);
|
|
1045
1167
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/send.js
|
|
1046
|
-
var
|
|
1168
|
+
var __iconNode23 = [
|
|
1047
1169
|
[
|
|
1048
1170
|
"path",
|
|
1049
1171
|
{
|
|
@@ -1053,15 +1175,20 @@ var __iconNode20 = [
|
|
|
1053
1175
|
],
|
|
1054
1176
|
["path", { d: "m21.854 2.147-10.94 10.939", key: "12cjpa" }]
|
|
1055
1177
|
];
|
|
1056
|
-
var Send = createLucideIcon("send",
|
|
1178
|
+
var Send = createLucideIcon("send", __iconNode23);
|
|
1179
|
+
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/square.js
|
|
1180
|
+
var __iconNode24 = [
|
|
1181
|
+
["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }]
|
|
1182
|
+
];
|
|
1183
|
+
var Square = createLucideIcon("square", __iconNode24);
|
|
1057
1184
|
// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/x.js
|
|
1058
|
-
var
|
|
1185
|
+
var __iconNode25 = [
|
|
1059
1186
|
["path", { d: "M18 6 6 18", key: "1bl5f8" }],
|
|
1060
1187
|
["path", { d: "m6 6 12 12", key: "d8bk6v" }]
|
|
1061
1188
|
];
|
|
1062
|
-
var X = createLucideIcon("x",
|
|
1189
|
+
var X = createLucideIcon("x", __iconNode25);
|
|
1063
1190
|
// src/components/AgentCursor.tsx
|
|
1064
|
-
import { useContext as
|
|
1191
|
+
import { useContext as useContext3, useEffect as useEffect7, useLayoutEffect, useRef as useRef2, useState as useState7 } from "react";
|
|
1065
1192
|
|
|
1066
1193
|
// src/capture/elementRef.ts
|
|
1067
1194
|
function safeGetIframeDocument(iframe) {
|
|
@@ -1243,12 +1370,12 @@ function AgentCursor({
|
|
|
1243
1370
|
target,
|
|
1244
1371
|
animated = false
|
|
1245
1372
|
}) {
|
|
1246
|
-
const ctx =
|
|
1247
|
-
const [cursor, setCursor] =
|
|
1248
|
-
const [glideMs, setGlideMs] =
|
|
1249
|
-
const [phase, setPhase] =
|
|
1250
|
-
const [ringBox, setRingBox] =
|
|
1251
|
-
const [clickPulse, setClickPulse] =
|
|
1373
|
+
const ctx = useContext3(LiveAgentContext);
|
|
1374
|
+
const [cursor, setCursor] = useState7(null);
|
|
1375
|
+
const [glideMs, setGlideMs] = useState7(0);
|
|
1376
|
+
const [phase, setPhase] = useState7("idle");
|
|
1377
|
+
const [ringBox, setRingBox] = useState7(null);
|
|
1378
|
+
const [clickPulse, setClickPulse] = useState7(0);
|
|
1252
1379
|
const cursorElRef = useRef2(null);
|
|
1253
1380
|
const pathRef = useRef2(null);
|
|
1254
1381
|
const prevCursorRef = useRef2(null);
|
|
@@ -1371,7 +1498,7 @@ function AgentCursor({
|
|
|
1371
1498
|
});
|
|
1372
1499
|
return cancelAnimation;
|
|
1373
1500
|
}, [target, animated]);
|
|
1374
|
-
|
|
1501
|
+
useEffect7(() => {
|
|
1375
1502
|
if (!target || target.kind === "gesture" || phase === "idle")
|
|
1376
1503
|
return;
|
|
1377
1504
|
const track = () => {
|
|
@@ -1403,7 +1530,7 @@ function AgentCursor({
|
|
|
1403
1530
|
}
|
|
1404
1531
|
};
|
|
1405
1532
|
}, [target, phase]);
|
|
1406
|
-
|
|
1533
|
+
useEffect7(() => {
|
|
1407
1534
|
return () => {
|
|
1408
1535
|
traceRef.current?.cancel();
|
|
1409
1536
|
for (const t of timersRef.current)
|
|
@@ -1496,12 +1623,12 @@ function AgentCursor({
|
|
|
1496
1623
|
// src/components/AutoStartMedia.tsx
|
|
1497
1624
|
import { useConnectionState, useLocalParticipant } from "@livekit/components-react/hooks";
|
|
1498
1625
|
import { ConnectionState, Track } from "livekit-client";
|
|
1499
|
-
import { useEffect as
|
|
1626
|
+
import { useEffect as useEffect8, useRef as useRef3 } from "react";
|
|
1500
1627
|
function AutoStartMedia({ pendingScreenStream }) {
|
|
1501
1628
|
const { localParticipant } = useLocalParticipant();
|
|
1502
1629
|
const connectionState = useConnectionState();
|
|
1503
1630
|
const didStartRef = useRef3(false);
|
|
1504
|
-
|
|
1631
|
+
useEffect8(() => {
|
|
1505
1632
|
if (didStartRef.current)
|
|
1506
1633
|
return;
|
|
1507
1634
|
if (connectionState !== ConnectionState.Connected)
|
|
@@ -1526,7 +1653,7 @@ function AutoStartMedia({ pendingScreenStream }) {
|
|
|
1526
1653
|
// src/components/DomCapture.tsx
|
|
1527
1654
|
import { useConnectionState as useConnectionState2, useLocalParticipant as useLocalParticipant2 } from "@livekit/components-react/hooks";
|
|
1528
1655
|
import { ConnectionState as ConnectionState2, ScreenSharePresets, Track as Track2 } from "livekit-client";
|
|
1529
|
-
import { useEffect as
|
|
1656
|
+
import { useEffect as useEffect9, useRef as useRef4 } from "react";
|
|
1530
1657
|
|
|
1531
1658
|
// src/capture/a11yUtils.ts
|
|
1532
1659
|
var ROLE_BY_TAG = {
|
|
@@ -2081,6 +2208,53 @@ function runAgentAction(dispatch) {
|
|
|
2081
2208
|
function isAgentActionInProgress() {
|
|
2082
2209
|
return isDispatchingAgentAction;
|
|
2083
2210
|
}
|
|
2211
|
+
var snapshotRequestHandler = null;
|
|
2212
|
+
function onSnapshotRequest(handler) {
|
|
2213
|
+
snapshotRequestHandler = handler;
|
|
2214
|
+
return () => {
|
|
2215
|
+
if (snapshotRequestHandler === handler)
|
|
2216
|
+
snapshotRequestHandler = null;
|
|
2217
|
+
};
|
|
2218
|
+
}
|
|
2219
|
+
function requestSnapshotAfterAction() {
|
|
2220
|
+
snapshotRequestHandler?.();
|
|
2221
|
+
}
|
|
2222
|
+
var actionsPaused = false;
|
|
2223
|
+
var pausedSubscribers = new Set;
|
|
2224
|
+
function setActionsPaused(paused) {
|
|
2225
|
+
if (actionsPaused === paused)
|
|
2226
|
+
return;
|
|
2227
|
+
actionsPaused = paused;
|
|
2228
|
+
for (const cb of pausedSubscribers)
|
|
2229
|
+
cb(paused);
|
|
2230
|
+
}
|
|
2231
|
+
function isActionsPaused() {
|
|
2232
|
+
return actionsPaused;
|
|
2233
|
+
}
|
|
2234
|
+
function onActionsPausedChange(cb) {
|
|
2235
|
+
pausedSubscribers.add(cb);
|
|
2236
|
+
return () => {
|
|
2237
|
+
pausedSubscribers.delete(cb);
|
|
2238
|
+
};
|
|
2239
|
+
}
|
|
2240
|
+
var actionsBusy = false;
|
|
2241
|
+
var busySubscribers = new Set;
|
|
2242
|
+
function setActionsBusy(busy) {
|
|
2243
|
+
if (actionsBusy === busy)
|
|
2244
|
+
return;
|
|
2245
|
+
actionsBusy = busy;
|
|
2246
|
+
for (const cb of busySubscribers)
|
|
2247
|
+
cb(busy);
|
|
2248
|
+
}
|
|
2249
|
+
function isActionsBusy() {
|
|
2250
|
+
return actionsBusy;
|
|
2251
|
+
}
|
|
2252
|
+
function subscribeActionsBusy(cb) {
|
|
2253
|
+
busySubscribers.add(cb);
|
|
2254
|
+
return () => {
|
|
2255
|
+
busySubscribers.delete(cb);
|
|
2256
|
+
};
|
|
2257
|
+
}
|
|
2084
2258
|
|
|
2085
2259
|
// src/capture/domEvents.ts
|
|
2086
2260
|
var MUTATION_DEBOUNCE_MS = 250;
|
|
@@ -2378,7 +2552,7 @@ function DomCapture() {
|
|
|
2378
2552
|
const { localParticipant } = useLocalParticipant2();
|
|
2379
2553
|
const connectionState = useConnectionState2();
|
|
2380
2554
|
const didStartRef = useRef4(false);
|
|
2381
|
-
|
|
2555
|
+
useEffect9(() => {
|
|
2382
2556
|
if (didStartRef.current)
|
|
2383
2557
|
return;
|
|
2384
2558
|
if (connectionState !== ConnectionState2.Connected)
|
|
@@ -2454,6 +2628,10 @@ function DomCapture() {
|
|
|
2454
2628
|
tickSnapshot();
|
|
2455
2629
|
}
|
|
2456
2630
|
});
|
|
2631
|
+
const cleanupSnapshotRequest = onSnapshotRequest(() => {
|
|
2632
|
+
tickA11yPublish();
|
|
2633
|
+
tickSnapshot();
|
|
2634
|
+
});
|
|
2457
2635
|
let snapshotTimer = null;
|
|
2458
2636
|
const scheduleNextSnapshot = (delay) => {
|
|
2459
2637
|
if (cancelled)
|
|
@@ -2473,6 +2651,7 @@ function DomCapture() {
|
|
|
2473
2651
|
clearTimeout(snapshotTimer);
|
|
2474
2652
|
clearInterval(a11yPublishTimer);
|
|
2475
2653
|
cleanupDomEventListeners();
|
|
2654
|
+
cleanupSnapshotRequest();
|
|
2476
2655
|
unpublishAndStopTrack(localParticipant, videoTrack);
|
|
2477
2656
|
for (const track of canvasStream.getTracks())
|
|
2478
2657
|
track.stop();
|
|
@@ -2483,7 +2662,7 @@ function DomCapture() {
|
|
|
2483
2662
|
|
|
2484
2663
|
// src/components/HighlightOverlay.tsx
|
|
2485
2664
|
import { useDataChannel } from "@livekit/components-react/hooks";
|
|
2486
|
-
import { useCallback as
|
|
2665
|
+
import { useCallback as useCallback6, useEffect as useEffect10, useRef as useRef5 } from "react";
|
|
2487
2666
|
var HIGHLIGHT_AUTO_CLEAR_MS = 1e4;
|
|
2488
2667
|
var textDecoder = new TextDecoder;
|
|
2489
2668
|
function parseHighlightMessage(payload) {
|
|
@@ -2508,14 +2687,14 @@ function parseHighlightMessage(payload) {
|
|
|
2508
2687
|
function HighlightOverlay() {
|
|
2509
2688
|
const targetRef = useRef5(null);
|
|
2510
2689
|
const autoClearRef = useRef5(null);
|
|
2511
|
-
const clear =
|
|
2690
|
+
const clear = useCallback6(() => {
|
|
2512
2691
|
if (autoClearRef.current)
|
|
2513
2692
|
clearTimeout(autoClearRef.current);
|
|
2514
2693
|
autoClearRef.current = null;
|
|
2515
2694
|
targetRef.current = null;
|
|
2516
2695
|
clearCursorTarget("guide");
|
|
2517
2696
|
}, []);
|
|
2518
|
-
const onHighlightMessage =
|
|
2697
|
+
const onHighlightMessage = useCallback6((msg) => {
|
|
2519
2698
|
const parsed = parseHighlightMessage(msg.payload);
|
|
2520
2699
|
if (!parsed)
|
|
2521
2700
|
return;
|
|
@@ -2539,7 +2718,7 @@ function HighlightOverlay() {
|
|
|
2539
2718
|
autoClearRef.current = setTimeout(clear, HIGHLIGHT_AUTO_CLEAR_MS);
|
|
2540
2719
|
}, [clear]);
|
|
2541
2720
|
useDataChannel(HIGHLIGHT_TOPIC, onHighlightMessage);
|
|
2542
|
-
|
|
2721
|
+
useEffect10(() => {
|
|
2543
2722
|
const onClick = (event) => {
|
|
2544
2723
|
const target = targetRef.current;
|
|
2545
2724
|
const node = event.target;
|
|
@@ -2549,15 +2728,15 @@ function HighlightOverlay() {
|
|
|
2549
2728
|
document.addEventListener("click", onClick, { capture: true });
|
|
2550
2729
|
return () => document.removeEventListener("click", onClick, { capture: true });
|
|
2551
2730
|
}, [clear]);
|
|
2552
|
-
|
|
2731
|
+
useEffect10(() => clear, [clear]);
|
|
2553
2732
|
return null;
|
|
2554
2733
|
}
|
|
2555
2734
|
|
|
2556
2735
|
// src/components/MinimizedBubble.tsx
|
|
2557
|
-
import { useContext as
|
|
2736
|
+
import { useContext as useContext4, useEffect as useEffect12, useRef as useRef7, useState as useState8 } from "react";
|
|
2558
2737
|
|
|
2559
2738
|
// src/hooks/useLauncherDrag.ts
|
|
2560
|
-
import { useEffect as
|
|
2739
|
+
import { useEffect as useEffect11, useRef as useRef6 } from "react";
|
|
2561
2740
|
import { flushSync } from "react-dom";
|
|
2562
2741
|
var DRAG_THRESHOLD_PX = 5;
|
|
2563
2742
|
function useLauncherDrag(containerRef, onDrop, followRef) {
|
|
@@ -2566,7 +2745,7 @@ function useLauncherDrag(containerRef, onDrop, followRef) {
|
|
|
2566
2745
|
onDropRef.current = onDrop;
|
|
2567
2746
|
const followTargetRef = useRef6(followRef);
|
|
2568
2747
|
followTargetRef.current = followRef;
|
|
2569
|
-
|
|
2748
|
+
useEffect11(() => {
|
|
2570
2749
|
const el = containerRef.current;
|
|
2571
2750
|
if (!el)
|
|
2572
2751
|
return;
|
|
@@ -2819,7 +2998,7 @@ function WelcomeBubble({
|
|
|
2819
2998
|
onDismiss,
|
|
2820
2999
|
onClick
|
|
2821
3000
|
}) {
|
|
2822
|
-
|
|
3001
|
+
useEffect12(() => {
|
|
2823
3002
|
const timer = setTimeout(onDismiss, 5000);
|
|
2824
3003
|
return () => clearTimeout(timer);
|
|
2825
3004
|
}, [onDismiss]);
|
|
@@ -2841,7 +3020,7 @@ function MinimizedBubble({
|
|
|
2841
3020
|
welcomeDismissed,
|
|
2842
3021
|
onDismissWelcome
|
|
2843
3022
|
}) {
|
|
2844
|
-
const ctx =
|
|
3023
|
+
const ctx = useContext4(LiveAgentContext);
|
|
2845
3024
|
if (!ctx) {
|
|
2846
3025
|
throw new Error("MinimizedBubble must be used within a <LiveAgent> provider");
|
|
2847
3026
|
}
|
|
@@ -2861,13 +3040,13 @@ function MinimizedBubble({
|
|
|
2861
3040
|
selectModule,
|
|
2862
3041
|
expandPanel
|
|
2863
3042
|
} = ctx;
|
|
2864
|
-
const [goalsAutoHidden, setGoalsAutoHidden] =
|
|
2865
|
-
const [isLauncherHovered, setIsLauncherHovered] =
|
|
2866
|
-
const [visitHref, setVisitHref] =
|
|
3043
|
+
const [goalsAutoHidden, setGoalsAutoHidden] = useState8(false);
|
|
3044
|
+
const [isLauncherHovered, setIsLauncherHovered] = useState8(false);
|
|
3045
|
+
const [visitHref, setVisitHref] = useState8(() => window.location.href);
|
|
2867
3046
|
const revealedHrefRef = useRef7(null);
|
|
2868
3047
|
const hoverContainerRef = useRef7(null);
|
|
2869
|
-
|
|
2870
|
-
|
|
3048
|
+
useEffect12(() => subscribeToLocationChange(() => setVisitHref(window.location.href)), []);
|
|
3049
|
+
useEffect12(() => {
|
|
2871
3050
|
const el = hoverContainerRef.current;
|
|
2872
3051
|
if (!el)
|
|
2873
3052
|
return;
|
|
@@ -2893,7 +3072,7 @@ function MinimizedBubble({
|
|
|
2893
3072
|
const onboardingModule = pillCandidates.find((module) => module.type === "onboarding");
|
|
2894
3073
|
const modulePills = onboardingModule ? [onboardingModule] : pillCandidates.slice(0, MAX_MODULE_PILLS).reverse();
|
|
2895
3074
|
const goalsEligible = adoptionGoals.length > 0 && !onboardingModule && (!hasModuleSelector || hasResolvedModules);
|
|
2896
|
-
|
|
3075
|
+
useEffect12(() => {
|
|
2897
3076
|
if (!goalsEligible)
|
|
2898
3077
|
return;
|
|
2899
3078
|
if (revealedHrefRef.current === visitHref) {
|
|
@@ -2907,8 +3086,8 @@ function MinimizedBubble({
|
|
|
2907
3086
|
}, [goalsEligible, visitHref]);
|
|
2908
3087
|
const matchedGoals = goalsEligible ? adoptionGoals.slice(0, MAX_GOAL_BUBBLES) : [];
|
|
2909
3088
|
const goalsHidden = goalsAutoHidden && !isLauncherHovered;
|
|
2910
|
-
const [goalsUnmounted, setGoalsUnmounted] =
|
|
2911
|
-
|
|
3089
|
+
const [goalsUnmounted, setGoalsUnmounted] = useState8(false);
|
|
3090
|
+
useEffect12(() => {
|
|
2912
3091
|
if (!goalsHidden) {
|
|
2913
3092
|
setGoalsUnmounted(false);
|
|
2914
3093
|
return;
|
|
@@ -2976,8 +3155,9 @@ function MinimizedBubble({
|
|
|
2976
3155
|
|
|
2977
3156
|
// src/components/PageActionHandler.tsx
|
|
2978
3157
|
import { useDataChannel as useDataChannel2 } from "@livekit/components-react/hooks";
|
|
2979
|
-
import { useCallback as
|
|
3158
|
+
import { useCallback as useCallback7, useEffect as useEffect13, useRef as useRef8 } from "react";
|
|
2980
3159
|
var STEP_MAX_WAIT_MS = 5000;
|
|
3160
|
+
var POST_ACTION_SETTLE_SNAPSHOT_MS = 300;
|
|
2981
3161
|
var textDecoder2 = new TextDecoder;
|
|
2982
3162
|
function parseScrollDirection(value) {
|
|
2983
3163
|
return value === "down" || value === "up" || value === "top" || value === "bottom" ? value : null;
|
|
@@ -3209,13 +3389,15 @@ function PageActionHandler() {
|
|
|
3209
3389
|
const mountedRef = useRef8(true);
|
|
3210
3390
|
const queueRef = useRef8([]);
|
|
3211
3391
|
const drainingRef = useRef8(false);
|
|
3212
|
-
const
|
|
3392
|
+
const settleTimerRef = useRef8(null);
|
|
3393
|
+
const endStepRef = useRef8(null);
|
|
3394
|
+
const runStep = useCallback7((action) => {
|
|
3213
3395
|
return new Promise((resolve) => {
|
|
3214
3396
|
if (action.type === "navigate") {
|
|
3215
3397
|
queueRef.current.length = 0;
|
|
3216
3398
|
if (isSameOriginHttpUrl(action.url))
|
|
3217
3399
|
window.location.assign(action.url);
|
|
3218
|
-
resolve();
|
|
3400
|
+
resolve(true);
|
|
3219
3401
|
return;
|
|
3220
3402
|
}
|
|
3221
3403
|
if (action.type === "scroll_page") {
|
|
@@ -3224,7 +3406,7 @@ function PageActionHandler() {
|
|
|
3224
3406
|
if (scrolled)
|
|
3225
3407
|
return;
|
|
3226
3408
|
scrolled = true;
|
|
3227
|
-
resolve();
|
|
3409
|
+
resolve(true);
|
|
3228
3410
|
};
|
|
3229
3411
|
const fallback2 = setTimeout(finishScroll, STEP_MAX_WAIT_MS);
|
|
3230
3412
|
setCursorTarget("act", {
|
|
@@ -3244,20 +3426,23 @@ function PageActionHandler() {
|
|
|
3244
3426
|
}
|
|
3245
3427
|
const element = findElementByRef(action.ref);
|
|
3246
3428
|
if (!element?.isConnected || !isVisible2(element) || isActionBlocked(element)) {
|
|
3247
|
-
resolve();
|
|
3429
|
+
resolve(false);
|
|
3248
3430
|
return;
|
|
3249
3431
|
}
|
|
3250
3432
|
if (action.type === "click" && isActionBlocked(resolveClickTarget(element))) {
|
|
3251
|
-
resolve();
|
|
3433
|
+
resolve(false);
|
|
3252
3434
|
return;
|
|
3253
3435
|
}
|
|
3436
|
+
let acted = false;
|
|
3254
3437
|
let done = false;
|
|
3255
3438
|
const finish = () => {
|
|
3256
3439
|
if (done)
|
|
3257
3440
|
return;
|
|
3258
3441
|
done = true;
|
|
3259
|
-
|
|
3442
|
+
endStepRef.current = null;
|
|
3443
|
+
resolve(acted);
|
|
3260
3444
|
};
|
|
3445
|
+
endStepRef.current = finish;
|
|
3261
3446
|
const fallback = setTimeout(finish, STEP_MAX_WAIT_MS);
|
|
3262
3447
|
setCursorTarget("act", {
|
|
3263
3448
|
element,
|
|
@@ -3266,47 +3451,83 @@ function PageActionHandler() {
|
|
|
3266
3451
|
onAct: () => {
|
|
3267
3452
|
clearTimeout(fallback);
|
|
3268
3453
|
const resolved = action.type === "click" ? resolveClickTarget(element) : element;
|
|
3269
|
-
if (mountedRef.current && element.isConnected && !isActionBlocked(element) && !isActionBlocked(resolved)) {
|
|
3454
|
+
if (mountedRef.current && !isActionsPaused() && element.isConnected && !isActionBlocked(element) && !isActionBlocked(resolved)) {
|
|
3455
|
+
acted = true;
|
|
3270
3456
|
runAgentAction(() => performAction(action, element));
|
|
3457
|
+
requestSnapshotAfterAction();
|
|
3458
|
+
if (settleTimerRef.current)
|
|
3459
|
+
clearTimeout(settleTimerRef.current);
|
|
3460
|
+
settleTimerRef.current = setTimeout(() => {
|
|
3461
|
+
if (mountedRef.current)
|
|
3462
|
+
requestSnapshotAfterAction();
|
|
3463
|
+
}, POST_ACTION_SETTLE_SNAPSHOT_MS);
|
|
3271
3464
|
}
|
|
3272
3465
|
finish();
|
|
3273
3466
|
}
|
|
3274
3467
|
});
|
|
3275
3468
|
});
|
|
3276
3469
|
}, []);
|
|
3277
|
-
const drain =
|
|
3470
|
+
const drain = useCallback7(async () => {
|
|
3278
3471
|
if (drainingRef.current)
|
|
3279
3472
|
return;
|
|
3280
3473
|
drainingRef.current = true;
|
|
3474
|
+
setActionsBusy(true);
|
|
3475
|
+
let pausedMidQueue = false;
|
|
3281
3476
|
try {
|
|
3282
3477
|
while (mountedRef.current && queueRef.current.length > 0) {
|
|
3283
|
-
|
|
3478
|
+
if (isActionsPaused()) {
|
|
3479
|
+
pausedMidQueue = true;
|
|
3480
|
+
break;
|
|
3481
|
+
}
|
|
3482
|
+
const action = queueRef.current[0];
|
|
3284
3483
|
if (!action)
|
|
3285
3484
|
break;
|
|
3286
|
-
await runStep(action);
|
|
3485
|
+
const acted = await runStep(action);
|
|
3486
|
+
if (isActionsPaused() && !acted) {
|
|
3487
|
+
pausedMidQueue = true;
|
|
3488
|
+
break;
|
|
3489
|
+
}
|
|
3490
|
+
queueRef.current.shift();
|
|
3287
3491
|
}
|
|
3288
3492
|
} finally {
|
|
3289
3493
|
drainingRef.current = false;
|
|
3290
|
-
if (mountedRef.current)
|
|
3494
|
+
if (mountedRef.current) {
|
|
3291
3495
|
clearCursorTarget("act");
|
|
3496
|
+
if (!pausedMidQueue)
|
|
3497
|
+
setActionsBusy(false);
|
|
3498
|
+
}
|
|
3292
3499
|
}
|
|
3293
3500
|
}, [runStep]);
|
|
3294
|
-
const onMessage =
|
|
3501
|
+
const onMessage = useCallback7((msg) => {
|
|
3295
3502
|
const action = parsePageAction(msg.payload);
|
|
3296
3503
|
if (!action)
|
|
3297
3504
|
return;
|
|
3298
3505
|
queueRef.current.push(action);
|
|
3299
3506
|
drain();
|
|
3300
3507
|
}, [drain]);
|
|
3301
|
-
|
|
3508
|
+
useEffect13(() => {
|
|
3302
3509
|
mountedRef.current = true;
|
|
3303
3510
|
drainingRef.current = false;
|
|
3304
3511
|
return () => {
|
|
3305
3512
|
mountedRef.current = false;
|
|
3306
3513
|
queueRef.current.length = 0;
|
|
3514
|
+
if (settleTimerRef.current)
|
|
3515
|
+
clearTimeout(settleTimerRef.current);
|
|
3307
3516
|
clearCursorTarget("act");
|
|
3517
|
+
setActionsBusy(false);
|
|
3308
3518
|
};
|
|
3309
3519
|
}, []);
|
|
3520
|
+
useEffect13(() => {
|
|
3521
|
+
return onActionsPausedChange((paused) => {
|
|
3522
|
+
if (paused) {
|
|
3523
|
+
clearCursorTarget("act");
|
|
3524
|
+
clearCursorTarget("guide");
|
|
3525
|
+
endStepRef.current?.();
|
|
3526
|
+
} else {
|
|
3527
|
+
drain();
|
|
3528
|
+
}
|
|
3529
|
+
});
|
|
3530
|
+
}, [drain]);
|
|
3310
3531
|
useDataChannel2(PAGE_ACTIONS_TOPIC, onMessage);
|
|
3311
3532
|
return null;
|
|
3312
3533
|
}
|
|
@@ -3314,6 +3535,30 @@ function PageActionHandler() {
|
|
|
3314
3535
|
// src/components/SessionControlBar.tsx
|
|
3315
3536
|
import { useContext as useContext6, useRef as useRef10 } from "react";
|
|
3316
3537
|
|
|
3538
|
+
// src/hooks/useActionControl.ts
|
|
3539
|
+
import { useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
|
|
3540
|
+
import { useCallback as useCallback8, useEffect as useEffect14, useState as useState9 } from "react";
|
|
3541
|
+
var textEncoder3 = new TextEncoder;
|
|
3542
|
+
function useActionControl() {
|
|
3543
|
+
const { localParticipant } = useLocalParticipant3();
|
|
3544
|
+
const plan = usePlanUpdates();
|
|
3545
|
+
const [busy, setBusy] = useState9(isActionsBusy);
|
|
3546
|
+
const [actionsPaused2, setPaused] = useState9(false);
|
|
3547
|
+
useEffect14(() => subscribeActionsBusy(setBusy), []);
|
|
3548
|
+
const actionsActive = busy || plan?.state === "executing";
|
|
3549
|
+
const togglePaused = useCallback8(async () => {
|
|
3550
|
+
const next = !actionsPaused2;
|
|
3551
|
+
setPaused(next);
|
|
3552
|
+
setActionsPaused(next);
|
|
3553
|
+
try {
|
|
3554
|
+
await localParticipant.publishData(textEncoder3.encode(JSON.stringify({ type: next ? "pause" : "resume" })), { reliable: true, topic: ACTION_CONTROL_TOPIC });
|
|
3555
|
+
} catch (error) {
|
|
3556
|
+
console.error("Failed to send action pause/resume:", error);
|
|
3557
|
+
}
|
|
3558
|
+
}, [actionsPaused2, localParticipant]);
|
|
3559
|
+
return { actionsActive, actionsPaused: actionsPaused2, togglePaused };
|
|
3560
|
+
}
|
|
3561
|
+
|
|
3317
3562
|
// src/hooks/useAgentVoiceState.ts
|
|
3318
3563
|
import { useVoiceAssistant } from "@livekit/components-react/hooks";
|
|
3319
3564
|
function useAgentVoiceState() {
|
|
@@ -3327,13 +3572,13 @@ function useAgentVoiceState() {
|
|
|
3327
3572
|
}
|
|
3328
3573
|
|
|
3329
3574
|
// src/hooks/useAudioLevelBars.ts
|
|
3330
|
-
import { useEffect as
|
|
3575
|
+
import { useEffect as useEffect15, useRef as useRef9, useState as useState10 } from "react";
|
|
3331
3576
|
var TALKING_LEVEL_THRESHOLD = 0.2;
|
|
3332
3577
|
var TALKING_HOLD_MS = 400;
|
|
3333
3578
|
function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowthPx, noiseGate }) {
|
|
3334
3579
|
const barRefs = useRef9([]);
|
|
3335
|
-
const [isTalking, setIsTalking] =
|
|
3336
|
-
|
|
3580
|
+
const [isTalking, setIsTalking] = useState10(false);
|
|
3581
|
+
useEffect15(() => {
|
|
3337
3582
|
if (!mediaStreamTrack) {
|
|
3338
3583
|
for (const bar of barRefs.current) {
|
|
3339
3584
|
if (bar)
|
|
@@ -3383,55 +3628,27 @@ function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowth
|
|
|
3383
3628
|
return { barRefs, isTalking };
|
|
3384
3629
|
}
|
|
3385
3630
|
|
|
3386
|
-
// src/hooks/useLiveAgent.ts
|
|
3387
|
-
import { useContext as useContext4 } from "react";
|
|
3388
|
-
function useLiveAgent() {
|
|
3389
|
-
const ctx = useContext4(LiveAgentContext);
|
|
3390
|
-
if (!ctx) {
|
|
3391
|
-
throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
|
|
3392
|
-
}
|
|
3393
|
-
const {
|
|
3394
|
-
usesHostAuth,
|
|
3395
|
-
authFailed,
|
|
3396
|
-
connection,
|
|
3397
|
-
shouldConnect,
|
|
3398
|
-
historyMessages,
|
|
3399
|
-
phasesSnapshot,
|
|
3400
|
-
setPhasesSnapshot,
|
|
3401
|
-
hasResolvedModules,
|
|
3402
|
-
adoptionGoals,
|
|
3403
|
-
startAdoptionSession,
|
|
3404
|
-
launcherBottomPx,
|
|
3405
|
-
setLauncherBottomPx,
|
|
3406
|
-
popsDown,
|
|
3407
|
-
panelExpanded,
|
|
3408
|
-
togglePanelExpanded,
|
|
3409
|
-
...publicValue
|
|
3410
|
-
} = ctx;
|
|
3411
|
-
return publicValue;
|
|
3412
|
-
}
|
|
3413
|
-
|
|
3414
3631
|
// src/hooks/useMediaControls.ts
|
|
3415
|
-
import { useLocalParticipant as
|
|
3632
|
+
import { useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react/hooks";
|
|
3416
3633
|
import { ScreenSharePresets as ScreenSharePresets2 } from "livekit-client";
|
|
3417
|
-
import { useCallback as
|
|
3634
|
+
import { useCallback as useCallback9 } from "react";
|
|
3418
3635
|
var SCREEN_SHARE_OPTIONS = {
|
|
3419
3636
|
video: { displaySurface: "browser" },
|
|
3420
3637
|
resolution: ScreenSharePresets2.h720fps30.resolution,
|
|
3421
3638
|
contentHint: "detail"
|
|
3422
3639
|
};
|
|
3423
3640
|
function useMediaControls() {
|
|
3424
|
-
const { localParticipant } =
|
|
3641
|
+
const { localParticipant } = useLocalParticipant4();
|
|
3425
3642
|
const isMuted = !localParticipant.isMicrophoneEnabled;
|
|
3426
3643
|
const isScreenSharing = localParticipant.isScreenShareEnabled;
|
|
3427
|
-
const toggleMute =
|
|
3644
|
+
const toggleMute = useCallback9(async () => {
|
|
3428
3645
|
try {
|
|
3429
3646
|
await localParticipant.setMicrophoneEnabled(isMuted);
|
|
3430
3647
|
} catch (error) {
|
|
3431
3648
|
console.error("Failed to toggle microphone:", error);
|
|
3432
3649
|
}
|
|
3433
3650
|
}, [localParticipant, isMuted]);
|
|
3434
|
-
const toggleScreenShare =
|
|
3651
|
+
const toggleScreenShare = useCallback9(async () => {
|
|
3435
3652
|
try {
|
|
3436
3653
|
await localParticipant.setScreenShareEnabled(!isScreenSharing, SCREEN_SHARE_OPTIONS);
|
|
3437
3654
|
} catch (error) {
|
|
@@ -3442,13 +3659,13 @@ function useMediaControls() {
|
|
|
3442
3659
|
}
|
|
3443
3660
|
|
|
3444
3661
|
// src/hooks/useMicLevel.ts
|
|
3445
|
-
import { useLocalParticipant as
|
|
3662
|
+
import { useLocalParticipant as useLocalParticipant5 } from "@livekit/components-react/hooks";
|
|
3446
3663
|
var MIC_BARS = 5;
|
|
3447
3664
|
var IDLE_BAR_HEIGHT_PX = 5;
|
|
3448
3665
|
var MAX_BAR_GROWTH_PX = 17;
|
|
3449
3666
|
var MIC_NOISE_GATE = 0.15;
|
|
3450
3667
|
function useMicLevel(enabled) {
|
|
3451
|
-
const { microphoneTrack } =
|
|
3668
|
+
const { microphoneTrack } = useLocalParticipant5();
|
|
3452
3669
|
const mediaStreamTrack = microphoneTrack?.track?.mediaStreamTrack;
|
|
3453
3670
|
return useAudioLevelBars(enabled ? mediaStreamTrack : undefined, {
|
|
3454
3671
|
barCount: MIC_BARS,
|
|
@@ -3459,50 +3676,7 @@ function useMicLevel(enabled) {
|
|
|
3459
3676
|
}
|
|
3460
3677
|
|
|
3461
3678
|
// src/hooks/usePhaseUpdates.ts
|
|
3462
|
-
import { useCallback as
|
|
3463
|
-
|
|
3464
|
-
// src/hooks/useAgentState.ts
|
|
3465
|
-
import { useRemoteParticipants } from "@livekit/components-react/hooks";
|
|
3466
|
-
import { useEffect as useEffect14, useState as useState9 } from "react";
|
|
3467
|
-
function useAgentState(attributeKey, parse, initial) {
|
|
3468
|
-
const [value, setValue] = useState9(initial);
|
|
3469
|
-
const remoteParticipants = useRemoteParticipants();
|
|
3470
|
-
useEffect14(() => {
|
|
3471
|
-
const agentParticipant = remoteParticipants.find((p) => p.attributes?.[attributeKey]);
|
|
3472
|
-
if (agentParticipant) {
|
|
3473
|
-
const attr = agentParticipant.attributes?.[attributeKey];
|
|
3474
|
-
if (attr) {
|
|
3475
|
-
const parsed = parse(attr);
|
|
3476
|
-
if (parsed)
|
|
3477
|
-
setValue(parsed);
|
|
3478
|
-
}
|
|
3479
|
-
}
|
|
3480
|
-
const handlers = new Map;
|
|
3481
|
-
for (const p of remoteParticipants) {
|
|
3482
|
-
const handler = (changedAttributes) => {
|
|
3483
|
-
if (changedAttributes[attributeKey]) {
|
|
3484
|
-
const parsed = parse(changedAttributes[attributeKey]);
|
|
3485
|
-
if (parsed)
|
|
3486
|
-
setValue(parsed);
|
|
3487
|
-
} else if (p.attributes?.[attributeKey]) {
|
|
3488
|
-
const parsed = parse(p.attributes[attributeKey]);
|
|
3489
|
-
if (parsed)
|
|
3490
|
-
setValue(parsed);
|
|
3491
|
-
}
|
|
3492
|
-
};
|
|
3493
|
-
handlers.set(p, handler);
|
|
3494
|
-
p.on("attributesChanged", handler);
|
|
3495
|
-
}
|
|
3496
|
-
return () => {
|
|
3497
|
-
for (const [p, handler] of handlers) {
|
|
3498
|
-
p.off("attributesChanged", handler);
|
|
3499
|
-
}
|
|
3500
|
-
};
|
|
3501
|
-
}, [remoteParticipants, attributeKey, parse]);
|
|
3502
|
-
return value;
|
|
3503
|
-
}
|
|
3504
|
-
|
|
3505
|
-
// src/hooks/usePhaseUpdates.ts
|
|
3679
|
+
import { useCallback as useCallback10, useContext as useContext5, useEffect as useEffect16 } from "react";
|
|
3506
3680
|
function parsePhases(json) {
|
|
3507
3681
|
try {
|
|
3508
3682
|
const data = JSON.parse(json);
|
|
@@ -3513,10 +3687,10 @@ function parsePhases(json) {
|
|
|
3513
3687
|
return null;
|
|
3514
3688
|
}
|
|
3515
3689
|
function usePhaseUpdates() {
|
|
3516
|
-
const parse =
|
|
3690
|
+
const parse = useCallback10(parsePhases, []);
|
|
3517
3691
|
const livePhases = useAgentState("phases", parse, []);
|
|
3518
3692
|
const ctx = useContext5(LiveAgentContext);
|
|
3519
|
-
|
|
3693
|
+
useEffect16(() => {
|
|
3520
3694
|
if (livePhases.length > 0)
|
|
3521
3695
|
ctx?.setPhasesSnapshot(livePhases);
|
|
3522
3696
|
}, [livePhases, ctx?.setPhasesSnapshot]);
|
|
@@ -3530,6 +3704,7 @@ var STANDBY_BAR_WIDTH = 168;
|
|
|
3530
3704
|
var READY_BAR_WIDTH = 176;
|
|
3531
3705
|
var TEXT_BAR_WIDTH = 64;
|
|
3532
3706
|
var SCREEN_SHARE_EXTRA_WIDTH = 56;
|
|
3707
|
+
var ACTION_CONTROL_EXTRA_WIDTH = 56;
|
|
3533
3708
|
var MIC_REGION_WIDTH = 104;
|
|
3534
3709
|
var MIC_SQUARE_WIDTH = 48;
|
|
3535
3710
|
var SQUARE_BUTTON = "skippr:flex skippr:size-12 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-2xl skippr:cursor-pointer skippr:transition-colors";
|
|
@@ -3539,6 +3714,7 @@ var AGENT_BAR_MAX_GROWTH_PX = 12;
|
|
|
3539
3714
|
var AGENT_NOISE_GATE = 0;
|
|
3540
3715
|
function AgentActivity({
|
|
3541
3716
|
state,
|
|
3717
|
+
isActing,
|
|
3542
3718
|
mediaStreamTrack
|
|
3543
3719
|
}) {
|
|
3544
3720
|
const { barRefs } = useAudioLevelBars(state === "speaking" ? mediaStreamTrack : undefined, {
|
|
@@ -3547,6 +3723,17 @@ function AgentActivity({
|
|
|
3547
3723
|
maxGrowthPx: AGENT_BAR_MAX_GROWTH_PX,
|
|
3548
3724
|
noiseGate: AGENT_NOISE_GATE
|
|
3549
3725
|
});
|
|
3726
|
+
if (isActing) {
|
|
3727
|
+
return /* @__PURE__ */ jsx5("span", {
|
|
3728
|
+
role: "status",
|
|
3729
|
+
className: "skippr:flex skippr:h-5 skippr:w-12 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:text-bubble",
|
|
3730
|
+
"aria-label": "Agent is acting",
|
|
3731
|
+
children: /* @__PURE__ */ jsx5(MousePointerClick, {
|
|
3732
|
+
strokeWidth: 2,
|
|
3733
|
+
className: "skippr:size-5 skippr:[animation:skippr-finger-tap_1.1s_ease-in-out_infinite]"
|
|
3734
|
+
})
|
|
3735
|
+
});
|
|
3736
|
+
}
|
|
3550
3737
|
return /* @__PURE__ */ jsxs5("span", {
|
|
3551
3738
|
role: "status",
|
|
3552
3739
|
className: "skippr:flex skippr:h-5 skippr:w-12 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:text-bubble",
|
|
@@ -3627,13 +3814,17 @@ function SessionControlBar() {
|
|
|
3627
3814
|
const { isMuted, toggleMute, isScreenSharing, toggleScreenShare } = useMediaControls();
|
|
3628
3815
|
const { state, mediaStreamTrack: agentMediaStreamTrack } = useAgentVoiceState();
|
|
3629
3816
|
const { phases } = usePhaseUpdates();
|
|
3817
|
+
const { actionsActive, actionsPaused: actionsPaused2, togglePaused } = useActionControl();
|
|
3630
3818
|
const isReady = state === "listening" || state === "thinking" || state === "speaking";
|
|
3631
3819
|
const { barRefs, isTalking } = useMicLevel(isReady && !isMuted && !textMode);
|
|
3632
3820
|
const showScreenShareToggle = captureMode === "screenshare";
|
|
3821
|
+
const showActionControl = captureMode === "auto" && actionsActive;
|
|
3633
3822
|
const screenShareExtra = showScreenShareToggle ? SCREEN_SHARE_EXTRA_WIDTH : 0;
|
|
3823
|
+
const actionControlExtra = showActionControl ? ACTION_CONTROL_EXTRA_WIDTH : 0;
|
|
3634
3824
|
let barWidth = STANDBY_BAR_WIDTH;
|
|
3635
3825
|
if (isReady) {
|
|
3636
|
-
|
|
3826
|
+
const base = textMode ? TEXT_BAR_WIDTH : READY_BAR_WIDTH;
|
|
3827
|
+
barWidth = base + screenShareExtra + actionControlExtra;
|
|
3637
3828
|
}
|
|
3638
3829
|
const agendaModule = activeModule && activeModule.mode !== AGENT_MODE.AlwaysOn && activeModule.totalPhases > 0 ? activeModule : null;
|
|
3639
3830
|
const agendaProgress = phases.length > 0 ? {
|
|
@@ -3713,6 +3904,7 @@ function SessionControlBar() {
|
|
|
3713
3904
|
className: "skippr:absolute skippr:inset-y-0 skippr:right-[-3px] skippr:flex skippr:w-14 skippr:items-center skippr:justify-center skippr:[animation:skippr-agent-in_200ms_ease-out_240ms_both]",
|
|
3714
3905
|
children: /* @__PURE__ */ jsx5(AgentActivity, {
|
|
3715
3906
|
state,
|
|
3907
|
+
isActing: showActionControl && !actionsPaused2,
|
|
3716
3908
|
mediaStreamTrack: agentMediaStreamTrack
|
|
3717
3909
|
})
|
|
3718
3910
|
}),
|
|
@@ -3764,6 +3956,20 @@ function SessionControlBar() {
|
|
|
3764
3956
|
children: /* @__PURE__ */ jsx5(MessageSquare, {
|
|
3765
3957
|
className: "skippr:size-5"
|
|
3766
3958
|
})
|
|
3959
|
+
}),
|
|
3960
|
+
showActionControl && /* @__PURE__ */ jsx5("button", {
|
|
3961
|
+
type: "button",
|
|
3962
|
+
onClick: ifNotDragged(() => void togglePaused()),
|
|
3963
|
+
"aria-label": actionsPaused2 ? "Resume actions" : "Stop actions",
|
|
3964
|
+
title: actionsPaused2 ? "Resume" : "Stop",
|
|
3965
|
+
className: cn(SQUARE_BUTTON, actionsPaused2 ? "skippr:bg-green-100 skippr:text-green-700 skippr:hover:bg-green-200" : "skippr:bg-red-100 skippr:text-red-600 skippr:hover:bg-red-200"),
|
|
3966
|
+
children: actionsPaused2 ? /* @__PURE__ */ jsx5(Play, {
|
|
3967
|
+
className: "skippr:size-5",
|
|
3968
|
+
fill: "currentColor"
|
|
3969
|
+
}) : /* @__PURE__ */ jsx5(Square, {
|
|
3970
|
+
className: "skippr:size-5",
|
|
3971
|
+
fill: "currentColor"
|
|
3972
|
+
})
|
|
3767
3973
|
})
|
|
3768
3974
|
]
|
|
3769
3975
|
}, textMode ? "ready-text" : "ready"),
|
|
@@ -3813,7 +4019,7 @@ function SessionControlBar() {
|
|
|
3813
4019
|
}
|
|
3814
4020
|
|
|
3815
4021
|
// src/components/ShadowHost.tsx
|
|
3816
|
-
import { useLayoutEffect as useLayoutEffect2, useRef as useRef11, useState as
|
|
4022
|
+
import { useLayoutEffect as useLayoutEffect2, useRef as useRef11, useState as useState11 } from "react";
|
|
3817
4023
|
import { createPortal } from "react-dom";
|
|
3818
4024
|
import { jsx as jsx6, Fragment } from "react/jsx-runtime";
|
|
3819
4025
|
var PROPERTIES_STYLE_ID = "skippr-tw-properties";
|
|
@@ -3831,9 +4037,9 @@ function hoistTailwindProperties(css) {
|
|
|
3831
4037
|
}
|
|
3832
4038
|
function ShadowHost({ children }) {
|
|
3833
4039
|
const hostRef = useRef11(null);
|
|
3834
|
-
const [shadowRoot, setShadowRoot] =
|
|
4040
|
+
const [shadowRoot, setShadowRoot] = useState11(null);
|
|
3835
4041
|
const css = `/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
|
|
3836
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--skippr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--skippr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--skippr-color-red-50:oklch(97.1% .013 17.38);--skippr-color-red-300:oklch(80.8% .114 19.571);--skippr-color-red-400:oklch(70.4% .191 22.216);--skippr-color-red-700:oklch(50.5% .213 27.518);--skippr-color-amber-50:oklch(98.7% .022 95.277);--skippr-color-amber-100:oklch(96.2% .059 95.617);--skippr-color-amber-400:oklch(82.8% .189 84.429);--skippr-color-amber-700:oklch(55.5% .163 48.998);--skippr-color-amber-950:oklch(27.9% .077 45.635);--skippr-color-emerald-400:oklch(76.5% .177 163.223);--skippr-color-emerald-500:oklch(69.6% .17 162.48);--skippr-color-neutral-100:oklch(97% 0 0);--skippr-color-neutral-200:oklch(92.2% 0 0);--skippr-color-neutral-700:oklch(37.1% 0 0);--skippr-color-black:#000;--skippr-color-white:#fff;--skippr-spacing:.25rem;--skippr-text-xs:.75rem;--skippr-text-xs--line-height:calc(1/.75);--skippr-text-sm:.875rem;--skippr-text-sm--line-height:calc(1.25/.875);--skippr-font-weight-medium:500;--skippr-font-weight-semibold:600;--skippr-leading-tight:1.25;--skippr-leading-relaxed:1.625;--skippr-ease-out:cubic-bezier(0,0,.2,1);--skippr-ease-in-out:cubic-bezier(.4,0,.2,1);--skippr-animate-spin:spin 1s linear infinite;--skippr-animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--skippr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--skippr-animate-bounce:bounce 1s infinite;--skippr-blur-sm:8px;--skippr-default-transition-duration:.15s;--skippr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--skippr-default-font-family:var(--skippr-font-sans);--skippr-default-mono-font-family:var(--skippr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--skippr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--skippr-default-font-feature-settings,normal);font-variation-settings:var(--skippr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--skippr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--skippr-default-mono-font-feature-settings,normal);font-variation-settings:var(--skippr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.skippr\\:pointer-events-none{pointer-events:none}.skippr\\:absolute{position:absolute}.skippr\\:fixed{position:fixed}.skippr\\:relative{position:relative}.skippr\\:sticky{position:sticky}.skippr\\:inset-0{inset:calc(var(--skippr-spacing)*0)}.skippr\\:inset-y-0{inset-block:calc(var(--skippr-spacing)*0)}.skippr\\:-top-2{top:calc(var(--skippr-spacing)*-2)}.skippr\\:top-0{top:calc(var(--skippr-spacing)*0)}.skippr\\:top-1\\/2{top:50%}.skippr\\:top-full{top:100%}.skippr\\:-right-2{right:calc(var(--skippr-spacing)*-2)}.skippr\\:right-0{right:calc(var(--skippr-spacing)*0)}.skippr\\:right-3{right:calc(var(--skippr-spacing)*3)}.skippr\\:right-5{right:calc(var(--skippr-spacing)*5)}.skippr\\:right-6{right:calc(var(--skippr-spacing)*6)}.skippr\\:right-\\[-3px\\]{right:-3px}.skippr\\:right-\\[24px\\]{right:24px}.skippr\\:-bottom-1{bottom:calc(var(--skippr-spacing)*-1)}.skippr\\:-bottom-9{bottom:calc(var(--skippr-spacing)*-9)}.skippr\\:bottom-20{bottom:calc(var(--skippr-spacing)*20)}.skippr\\:bottom-full{bottom:100%}.skippr\\:left-0{left:calc(var(--skippr-spacing)*0)}.skippr\\:left-1\\/2{left:50%}.skippr\\:left-3{left:calc(var(--skippr-spacing)*3)}.skippr\\:left-5{left:calc(var(--skippr-spacing)*5)}.skippr\\:left-6{left:calc(var(--skippr-spacing)*6)}.skippr\\:left-\\[24px\\]{left:24px}.skippr\\:z-10{z-index:10}.skippr\\:z-20{z-index:20}.skippr\\:z-\\[9998\\]{z-index:9998}.skippr\\:z-\\[9999\\]{z-index:9999}.skippr\\:mx-auto{margin-inline:auto}.skippr\\:-mt-\\[5px\\]{margin-top:-5px}.skippr\\:mt-0\\.5{margin-top:calc(var(--skippr-spacing)*.5)}.skippr\\:mt-1{margin-top:calc(var(--skippr-spacing)*1)}.skippr\\:mt-1\\.5{margin-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:mt-3{margin-top:calc(var(--skippr-spacing)*3)}.skippr\\:-mb-\\[5px\\]{margin-bottom:-5px}.skippr\\:mb-1\\.5{margin-bottom:calc(var(--skippr-spacing)*1.5)}.skippr\\:mb-2{margin-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:mb-3{margin-bottom:calc(var(--skippr-spacing)*3)}.skippr\\:mb-4{margin-bottom:calc(var(--skippr-spacing)*4)}.skippr\\:ml-0\\.5{margin-left:calc(var(--skippr-spacing)*.5)}.skippr\\:flex{display:flex}.skippr\\:inline-flex{display:inline-flex}.skippr\\:size-1{width:calc(var(--skippr-spacing)*1);height:calc(var(--skippr-spacing)*1)}.skippr\\:size-1\\.5{width:calc(var(--skippr-spacing)*1.5);height:calc(var(--skippr-spacing)*1.5)}.skippr\\:size-2{width:calc(var(--skippr-spacing)*2);height:calc(var(--skippr-spacing)*2)}.skippr\\:size-2\\.5{width:calc(var(--skippr-spacing)*2.5);height:calc(var(--skippr-spacing)*2.5)}.skippr\\:size-3\\.5{width:calc(var(--skippr-spacing)*3.5);height:calc(var(--skippr-spacing)*3.5)}.skippr\\:size-4{width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}.skippr\\:size-5{width:calc(var(--skippr-spacing)*5);height:calc(var(--skippr-spacing)*5)}.skippr\\:size-6{width:calc(var(--skippr-spacing)*6);height:calc(var(--skippr-spacing)*6)}.skippr\\:size-7{width:calc(var(--skippr-spacing)*7);height:calc(var(--skippr-spacing)*7)}.skippr\\:size-8{width:calc(var(--skippr-spacing)*8);height:calc(var(--skippr-spacing)*8)}.skippr\\:size-9{width:calc(var(--skippr-spacing)*9);height:calc(var(--skippr-spacing)*9)}.skippr\\:size-10{width:calc(var(--skippr-spacing)*10);height:calc(var(--skippr-spacing)*10)}.skippr\\:size-12{width:calc(var(--skippr-spacing)*12);height:calc(var(--skippr-spacing)*12)}.skippr\\:size-\\[5px\\]{width:5px;height:5px}.skippr\\:size-\\[6px\\]{width:6px;height:6px}.skippr\\:size-full{width:100%;height:100%}.skippr\\:h-0{height:calc(var(--skippr-spacing)*0)}.skippr\\:h-0\\.5{height:calc(var(--skippr-spacing)*.5)}.skippr\\:h-1{height:calc(var(--skippr-spacing)*1)}.skippr\\:h-1\\.5{height:calc(var(--skippr-spacing)*1.5)}.skippr\\:h-2{height:calc(var(--skippr-spacing)*2)}.skippr\\:h-3{height:calc(var(--skippr-spacing)*3)}.skippr\\:h-3\\.5{height:calc(var(--skippr-spacing)*3.5)}.skippr\\:h-5{height:calc(var(--skippr-spacing)*5)}.skippr\\:h-6{height:calc(var(--skippr-spacing)*6)}.skippr\\:h-7{height:calc(var(--skippr-spacing)*7)}.skippr\\:h-8{height:calc(var(--skippr-spacing)*8)}.skippr\\:h-9{height:calc(var(--skippr-spacing)*9)}.skippr\\:h-10{height:calc(var(--skippr-spacing)*10)}.skippr\\:h-12{height:calc(var(--skippr-spacing)*12)}.skippr\\:h-16{height:calc(var(--skippr-spacing)*16)}.skippr\\:h-\\[18\\.5px\\]{height:18.5px}.skippr\\:h-\\[50px\\]{height:50px}.skippr\\:h-full{height:100%}.skippr\\:min-h-0{min-height:calc(var(--skippr-spacing)*0)}.skippr\\:w-0{width:calc(var(--skippr-spacing)*0)}.skippr\\:w-3\\.5{width:calc(var(--skippr-spacing)*3.5)}.skippr\\:w-5{width:calc(var(--skippr-spacing)*5)}.skippr\\:w-6{width:calc(var(--skippr-spacing)*6)}.skippr\\:w-7{width:calc(var(--skippr-spacing)*7)}.skippr\\:w-10{width:calc(var(--skippr-spacing)*10)}.skippr\\:w-12{width:calc(var(--skippr-spacing)*12)}.skippr\\:w-14{width:calc(var(--skippr-spacing)*14)}.skippr\\:w-40{width:calc(var(--skippr-spacing)*40)}.skippr\\:w-\\[2px\\]{width:2px}.skippr\\:w-\\[3px\\]{width:3px}.skippr\\:w-\\[15\\.4px\\]{width:15.4px}.skippr\\:w-\\[50px\\]{width:50px}.skippr\\:w-full{width:100%}.skippr\\:max-w-64{max-width:calc(var(--skippr-spacing)*64)}.skippr\\:max-w-72{max-width:calc(var(--skippr-spacing)*72)}.skippr\\:max-w-\\[80\\%\\]{max-width:80%}.skippr\\:min-w-0{min-width:calc(var(--skippr-spacing)*0)}.skippr\\:flex-1{flex:1}.skippr\\:shrink-0{flex-shrink:0}.skippr\\:origin-bottom-left{transform-origin:0 100%}.skippr\\:origin-bottom-right{transform-origin:100% 100%}.skippr\\:origin-center{transform-origin:50%}.skippr\\:origin-left{transform-origin:0}.skippr\\:origin-right{transform-origin:100%}.skippr\\:origin-top-left{transform-origin:0 0}.skippr\\:origin-top-right{transform-origin:100% 0}.skippr\\:-translate-x-1\\/2{--tw-translate-x:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:-translate-x-7{--tw-translate-x:calc(var(--skippr-spacing)*-7);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:translate-x-7{--tw-translate-x:calc(var(--skippr-spacing)*7);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:-translate-y-1\\/2{--tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:scale-0{--tw-scale-x:0%;--tw-scale-y:0%;--tw-scale-z:0%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-95{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:-rotate-90{rotate:-90deg}.skippr\\:rotate-45{rotate:45deg}.skippr\\:rotate-\\[225deg\\]{rotate:225deg}.skippr\\:\\[animation\\:skippr-agent-in_200ms_ease-out_240ms_both\\]{animation:.2s ease-out .24s both skippr-agent-in}.skippr\\:\\[animation\\:skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:\\[animation\\:skippr-orb-in_320ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)\\]{animation:.32s cubic-bezier(.34,1.3,.64,1) skippr-orb-in}.skippr\\:\\[animation\\:skippr-stage-fade_240ms_ease-out\\]{animation:.24s ease-out skippr-stage-fade}.skippr\\:\\[animation\\:skippr-tip-in_360ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)_backwards\\]{animation:.36s cubic-bezier(.34,1.3,.64,1) backwards skippr-tip-in}.skippr\\:\\[animation\\:skippr-toolset-pop_440ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{animation:.44s cubic-bezier(.22,1,.36,1) skippr-toolset-pop}.skippr\\:animate-\\[skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:animate-\\[skippr-bubble-in_0\\.28s_ease-out\\]{animation:.28s ease-out skippr-bubble-in}.skippr\\:animate-\\[skippr-fade-in_0\\.3s_ease-out\\]{animation:.3s ease-out skippr-fade-in}.skippr\\:animate-\\[skippr-pill-content_0\\.22s_ease-out\\]{animation:.22s ease-out skippr-pill-content}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.3s_infinite\\]{animation:1.1s ease-in-out .3s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.6s_infinite\\]{animation:1.1s ease-in-out .6s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.15s_infinite\\]{animation:1.1s ease-in-out .15s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.45s_infinite\\]{animation:1.1s ease-in-out .45s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-speak}.skippr\\:animate-bounce{animation:var(--skippr-animate-bounce)}.skippr\\:animate-ping{animation:var(--skippr-animate-ping)}.skippr\\:animate-pulse{animation:var(--skippr-animate-pulse)}.skippr\\:animate-skippr-annotation-pulse{animation:1.8s ease-in-out infinite skippr-annotation-pulse}.skippr\\:animate-skippr-click-ping{animation:.5s ease-out forwards skippr-click-ping}.skippr\\:animate-skippr-cursor-pop{animation:.22s ease-out skippr-cursor-pop}.skippr\\:animate-skippr-press{animation:.5s ease-in-out skippr-press}.skippr\\:animate-skippr-tab-fade{animation:.2s ease-out skippr-tab-fade}.skippr\\:animate-skippr-thinking-dot{animation:1.2s ease-in-out infinite skippr-thinking-dot}.skippr\\:animate-spin{animation:var(--skippr-animate-spin)}.skippr\\:cursor-default{cursor:default}.skippr\\:cursor-grab{cursor:grab}.skippr\\:cursor-pointer{cursor:pointer}.skippr\\:touch-none{touch-action:none}.skippr\\:resize-none{resize:none}.skippr\\:flex-col{flex-direction:column}.skippr\\:flex-col-reverse{flex-direction:column-reverse}.skippr\\:items-center{align-items:center}.skippr\\:items-end{align-items:flex-end}.skippr\\:items-start{align-items:flex-start}.skippr\\:justify-between{justify-content:space-between}.skippr\\:justify-center{justify-content:center}.skippr\\:justify-end{justify-content:flex-end}.skippr\\:gap-1{gap:calc(var(--skippr-spacing)*1)}.skippr\\:gap-1\\.5{gap:calc(var(--skippr-spacing)*1.5)}.skippr\\:gap-2{gap:calc(var(--skippr-spacing)*2)}.skippr\\:gap-2\\.5{gap:calc(var(--skippr-spacing)*2.5)}.skippr\\:gap-3{gap:calc(var(--skippr-spacing)*3)}.skippr\\:gap-\\[2px\\]{gap:2px}.skippr\\:gap-\\[3px\\]{gap:3px}:where(.skippr\\:space-y-0\\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*.5)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*.5)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}.skippr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.skippr\\:overflow-hidden{overflow:hidden}.skippr\\:overflow-y-auto{overflow-y:auto}.skippr\\:rounded-2xl{border-radius:1.125rem}.skippr\\:rounded-\\[1rem\\]{border-radius:1rem}.skippr\\:rounded-\\[10px\\]{border-radius:10px}.skippr\\:rounded-\\[14px\\]{border-radius:14px}.skippr\\:rounded-\\[16px\\]{border-radius:16px}.skippr\\:rounded-\\[20px\\]{border-radius:20px}.skippr\\:rounded-full{border-radius:3.40282e38px}.skippr\\:rounded-lg{border-radius:.625rem}.skippr\\:rounded-md{border-radius:.5rem}.skippr\\:rounded-sm{border-radius:.375rem}.skippr\\:rounded-xl{border-radius:.875rem}.skippr\\:border{border-style:var(--tw-border-style);border-width:1px}.skippr\\:border-0{border-style:var(--tw-border-style);border-width:0}.skippr\\:border-2{border-style:var(--tw-border-style);border-width:2px}.skippr\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.skippr\\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.skippr\\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.skippr\\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.skippr\\:border-\\[\\#2bc0ae\\]{border-color:#2bc0ae}.skippr\\:border-border,.skippr\\:border-input{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-primary\\/20{border-color:oklab(29.9244% .0107414 -.0305411/.2)}.skippr\\:border-r-border{border-right-color:oklch(92.3% .003 48.717)}.skippr\\:border-l-border{border-left-color:oklch(92.3% .003 48.717)}.skippr\\:bg-\\[\\#2bc0ae\\]{background-color:#2bc0ae}.skippr\\:bg-\\[\\#2bc0ae\\]\\/50{background-color:oklab(72.9347% -.121518 -.00545585/.5)}.skippr\\:bg-amber-50{background-color:var(--skippr-color-amber-50)}.skippr\\:bg-amber-400{background-color:var(--skippr-color-amber-400)}.skippr\\:bg-background{background-color:oklch(100% 0 0)}.skippr\\:bg-black\\/\\[0\\.07\\]{background-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-black\\/\\[0\\.07\\]{background-color:color-mix(in oklab,var(--skippr-color-black)7.0%,transparent)}}.skippr\\:bg-bubble{background-color:#2d2b3d}.skippr\\:bg-bubble\\/95{background-color:oklab(29.9244% .0107414 -.0305411/.95)}.skippr\\:bg-card{background-color:oklch(100% 0 0)}.skippr\\:bg-current{background-color:currentColor}.skippr\\:bg-destructive{background-color:#d94f4f}.skippr\\:bg-emerald-400{background-color:var(--skippr-color-emerald-400)}.skippr\\:bg-emerald-500{background-color:var(--skippr-color-emerald-500)}.skippr\\:bg-foreground{background-color:oklch(14.7% .004 49.25)}.skippr\\:bg-launcher{background-color:#2d2d3f}.skippr\\:bg-muted{background-color:oklch(97% .001 106.424)}.skippr\\:bg-muted-foreground\\/20{background-color:oklab(55.3% .00687528 .0110332/.2)}.skippr\\:bg-muted-foreground\\/40{background-color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:bg-muted\\/50{background-color:oklab(97% -.000282743 .000959196/.5)}.skippr\\:bg-neutral-100{background-color:var(--skippr-color-neutral-100)}.skippr\\:bg-primary{background-color:#2d2b3d}.skippr\\:bg-primary-foreground\\/20{background-color:oklab(100% 0 5.96046e-8/.2)}.skippr\\:bg-primary\\/10{background-color:oklab(29.9244% .0107414 -.0305411/.1)}.skippr\\:bg-red-50{background-color:var(--skippr-color-red-50)}.skippr\\:bg-red-400{background-color:var(--skippr-color-red-400)}.skippr\\:bg-secondary{background-color:#ffdfb5}.skippr\\:bg-transparent{background-color:#0000}.skippr\\:bg-white{background-color:var(--skippr-color-white)}.skippr\\:fill-brand{fill:#2bc0ae}.skippr\\:fill-primary\\/30{fill:oklab(29.9244% .0107414 -.0305411/.3)}.skippr\\:stroke-black\\/15{stroke:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:stroke-black\\/15{stroke:color-mix(in oklab,var(--skippr-color-black)15%,transparent)}}.skippr\\:stroke-bubble{stroke:#2d2b3d}.skippr\\:p-2{padding:calc(var(--skippr-spacing)*2)}.skippr\\:p-3{padding:calc(var(--skippr-spacing)*3)}.skippr\\:p-4{padding:calc(var(--skippr-spacing)*4)}.skippr\\:px-1{padding-inline:calc(var(--skippr-spacing)*1)}.skippr\\:px-1\\.5{padding-inline:calc(var(--skippr-spacing)*1.5)}.skippr\\:px-2{padding-inline:calc(var(--skippr-spacing)*2)}.skippr\\:px-2\\.5{padding-inline:calc(var(--skippr-spacing)*2.5)}.skippr\\:px-3{padding-inline:calc(var(--skippr-spacing)*3)}.skippr\\:px-4{padding-inline:calc(var(--skippr-spacing)*4)}.skippr\\:px-6{padding-inline:calc(var(--skippr-spacing)*6)}.skippr\\:px-8{padding-inline:calc(var(--skippr-spacing)*8)}.skippr\\:py-0\\.5{padding-block:calc(var(--skippr-spacing)*.5)}.skippr\\:py-1{padding-block:calc(var(--skippr-spacing)*1)}.skippr\\:py-1\\.5{padding-block:calc(var(--skippr-spacing)*1.5)}.skippr\\:py-2{padding-block:calc(var(--skippr-spacing)*2)}.skippr\\:py-2\\.5{padding-block:calc(var(--skippr-spacing)*2.5)}.skippr\\:py-3{padding-block:calc(var(--skippr-spacing)*3)}.skippr\\:py-4{padding-block:calc(var(--skippr-spacing)*4)}.skippr\\:pt-1\\.5{padding-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:pt-2{padding-top:calc(var(--skippr-spacing)*2)}.skippr\\:pr-3{padding-right:calc(var(--skippr-spacing)*3)}.skippr\\:pb-0{padding-bottom:calc(var(--skippr-spacing)*0)}.skippr\\:pb-2{padding-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:pl-1\\.5{padding-left:calc(var(--skippr-spacing)*1.5)}.skippr\\:pl-3\\.5{padding-left:calc(var(--skippr-spacing)*3.5)}.skippr\\:text-center{text-align:center}.skippr\\:text-left{text-align:left}.skippr\\:font-mono{font-family:var(--skippr-font-mono)}.skippr\\:text-sm{font-size:var(--skippr-text-sm);line-height:var(--tw-leading,var(--skippr-text-sm--line-height))}.skippr\\:text-xs{font-size:var(--skippr-text-xs);line-height:var(--tw-leading,var(--skippr-text-xs--line-height))}.skippr\\:text-\\[10px\\]{font-size:10px}.skippr\\:text-\\[11px\\]{font-size:11px}.skippr\\:text-\\[13px\\]{font-size:13px}.skippr\\:leading-5{--tw-leading:calc(var(--skippr-spacing)*5);line-height:calc(var(--skippr-spacing)*5)}.skippr\\:leading-relaxed{--tw-leading:var(--skippr-leading-relaxed);line-height:var(--skippr-leading-relaxed)}.skippr\\:leading-tight{--tw-leading:var(--skippr-leading-tight);line-height:var(--skippr-leading-tight)}.skippr\\:font-medium{--tw-font-weight:var(--skippr-font-weight-medium);font-weight:var(--skippr-font-weight-medium)}.skippr\\:font-semibold{--tw-font-weight:var(--skippr-font-weight-semibold);font-weight:var(--skippr-font-weight-semibold)}.skippr\\:whitespace-nowrap{white-space:nowrap}.skippr\\:text-\\[\\#2bc0ae\\]{color:#2bc0ae}.skippr\\:text-amber-700{color:var(--skippr-color-amber-700)}.skippr\\:text-amber-950{color:var(--skippr-color-amber-950)}.skippr\\:text-background{color:oklch(100% 0 0)}.skippr\\:text-black{color:var(--skippr-color-black)}.skippr\\:text-bubble{color:#2d2b3d}.skippr\\:text-chart-3{color:oklch(66.6% .179 58.318)}.skippr\\:text-destructive{color:#d94f4f}.skippr\\:text-foreground{color:oklch(14.7% .004 49.25)}.skippr\\:text-muted-foreground{color:oklch(55.3% .013 58.071)}.skippr\\:text-muted-foreground\\/30{color:oklab(55.3% .00687528 .0110332/.3)}.skippr\\:text-muted-foreground\\/40{color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:text-muted-foreground\\/60{color:oklab(55.3% .00687528 .0110332/.6)}.skippr\\:text-muted-foreground\\/70{color:oklab(55.3% .00687528 .0110332/.7)}.skippr\\:text-neutral-700{color:var(--skippr-color-neutral-700)}.skippr\\:text-primary{color:#2d2b3d}.skippr\\:text-primary-foreground{color:#fff}.skippr\\:text-primary-foreground\\/70{color:oklab(100% 0 5.96046e-8/.7)}.skippr\\:text-red-400{color:var(--skippr-color-red-400)}.skippr\\:text-red-700{color:var(--skippr-color-red-700)}.skippr\\:text-secondary-foreground{color:#613700}.skippr\\:text-white{color:var(--skippr-color-white)}.skippr\\:line-through{text-decoration-line:line-through}.skippr\\:placeholder-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}.skippr\\:opacity-0{opacity:0}.skippr\\:opacity-40{opacity:.4}.skippr\\:opacity-75{opacity:.75}.skippr\\:opacity-100{opacity:1}.skippr\\:shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[-6px_6px_22px_rgba\\(0\\,0\\,0\\,0\\.3\\)\\]{--tw-shadow:-6px 6px 22px var(--tw-shadow-color,#0000004d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\]{--tw-shadow:0 4px 12px var(--tw-shadow-color,#0000001f);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_14px_rgba\\(0\\,0\\,0\\,0\\.3\\)\\]{--tw-shadow:0 4px 14px var(--tw-shadow-color,#0000004d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_16px_rgba\\(45\\,43\\,61\\,0\\.45\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#2d2b3d73),0 2px 4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(45\\,43\\,61\\,0\\.35\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#2d2b3d59);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_30px_rgba\\(0\\,0\\,0\\,0\\.16\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\]{--tw-shadow:0 8px 30px var(--tw-shadow-color,#00000029),0 4px 12px var(--tw-shadow-color,#00000014);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_10px_32px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 10px 32px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-black\\/5{--tw-ring-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-black\\/5{--tw-ring-color:color-mix(in oklab,var(--skippr-color-black)5%,transparent)}}.skippr\\:ring-foreground\\/10{--tw-ring-color:oklab(14.7% .00261104 .00303026/.1)}.skippr\\:ring-offset-background{--tw-ring-offset-color:oklch(100% 0 0)}.skippr\\:drop-shadow-\\[0_2px_5px_rgba\\(0\\,0\\,0\\,0\\.4\\)\\]{--tw-drop-shadow-size:drop-shadow(0 2px 5px var(--tw-drop-shadow-color,#0006));--tw-drop-shadow:var(--tw-drop-shadow-size);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.skippr\\:backdrop-blur-sm{--tw-backdrop-blur:blur(var(--skippr-blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.skippr\\:transition-\\[height\\]{transition-property:height;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[opacity\\,transform\\,height\\]{transition-property:opacity,transform,height;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[width\\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:duration-75{--tw-duration:75ms;transition-duration:75ms}.skippr\\:duration-150{--tw-duration:.15s;transition-duration:.15s}.skippr\\:duration-200{--tw-duration:.2s;transition-duration:.2s}.skippr\\:duration-300{--tw-duration:.3s;transition-duration:.3s}.skippr\\:ease-in-out{--tw-ease:var(--skippr-ease-in-out);transition-timing-function:var(--skippr-ease-in-out)}.skippr\\:ease-out{--tw-ease:var(--skippr-ease-out);transition-timing-function:var(--skippr-ease-out)}.skippr\\:outline-none{--tw-outline-style:none;outline-style:none}.skippr\\:\\[animation-delay\\:0ms\\]{animation-delay:0s}.skippr\\:\\[animation-delay\\:150ms\\]{animation-delay:.15s}.skippr\\:\\[animation-delay\\:200ms\\]{animation-delay:.2s}.skippr\\:\\[animation-delay\\:300ms\\]{animation-delay:.3s}.skippr\\:\\[animation-delay\\:400ms\\]{animation-delay:.4s}.skippr\\:\\[overflow-anchor\\:none\\]{overflow-anchor:none}.skippr\\:group-focus-within\\:scale-100:is(:where(.skippr\\:group):focus-within *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-focus-within\\:opacity-100:is(:where(.skippr\\:group):focus-within *){opacity:1}@media (hover:hover){.skippr\\:group-hover\\:scale-100:is(:where(.skippr\\:group):hover *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-hover\\:text-red-300:is(:where(.skippr\\:group):hover *){color:var(--skippr-color-red-300)}.skippr\\:group-hover\\:text-white\\/80:is(:where(.skippr\\:group):hover *){color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:group-hover\\:text-white\\/80:is(:where(.skippr\\:group):hover *){color:color-mix(in oklab,var(--skippr-color-white)80%,transparent)}}.skippr\\:group-hover\\:opacity-100:is(:where(.skippr\\:group):hover *){opacity:1}}.skippr\\:placeholder\\:text-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}@media (hover:hover){.skippr\\:hover\\:-translate-y-0\\.5:hover{--tw-translate-y:calc(var(--skippr-spacing)*-.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:hover\\:scale-110:hover{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:hover\\:bg-\\[\\#3a384b\\]:hover{background-color:#3a384b}.skippr\\:hover\\:bg-accent:hover{background-color:#e7e5e4}.skippr\\:hover\\:bg-amber-100:hover{background-color:var(--skippr-color-amber-100)}.skippr\\:hover\\:bg-bubble:hover{background-color:#2d2b3d}.skippr\\:hover\\:bg-destructive\\/90:hover{background-color:oklab(61.4357% .15892 .0698893/.9)}.skippr\\:hover\\:bg-muted\\/70:hover{background-color:oklab(97% -.000282743 .000959196/.7)}.skippr\\:hover\\:bg-neutral-100:hover{background-color:var(--skippr-color-neutral-100)}.skippr\\:hover\\:bg-neutral-200:hover{background-color:var(--skippr-color-neutral-200)}.skippr\\:hover\\:bg-primary-foreground\\/10:hover{background-color:oklab(100% 0 5.96046e-8/.1)}.skippr\\:hover\\:bg-primary\\/90:hover{background-color:oklab(29.9244% .0107414 -.0305411/.9)}.skippr\\:hover\\:bg-secondary\\/80:hover{background-color:oklab(91.9963% .0175391 .0626889/.8)}.skippr\\:hover\\:text-accent-foreground:hover{color:oklch(21.6% .006 56.043)}.skippr\\:hover\\:text-foreground:hover{color:oklch(14.7% .004 49.25)}.skippr\\:hover\\:text-primary-foreground:hover{color:#fff}.skippr\\:hover\\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}.skippr\\:focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:focus-visible\\:ring-bubble\\/60:focus-visible{--tw-ring-color:oklab(29.9244% .0107414 -.0305411/.6)}.skippr\\:focus-visible\\:ring-ring:focus-visible{--tw-ring-color:oklch(70.9% .01 56.259)}.skippr\\:focus-visible\\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.skippr\\:focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.skippr\\:active\\:translate-y-0:active{--tw-translate-y:calc(var(--skippr-spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.skippr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.skippr\\:disabled\\:opacity-50:disabled{opacity:.5}.skippr\\:disabled\\:opacity-60:disabled{opacity:.6}@media (prefers-reduced-motion:reduce){.skippr\\:motion-reduce\\:hidden{display:none}.skippr\\:motion-reduce\\:animate-none{animation:none}}.skippr\\:\\[\\&_svg\\]\\:pointer-events-none svg{pointer-events:none}.skippr\\:\\[\\&_svg\\]\\:shrink-0 svg{flex-shrink:0}.skippr\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 svg:not([class*=size-]){width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}}@keyframes skippr-tap{0%{transform:scale(1)}45%{transform:scale(.7)}to{transform:scale(1)}}@keyframes skippr-press{0%{transform:scale(1)}55%{transform:scale(1)}85%{transform:scale(.68)}to{transform:scale(1)}}@keyframes skippr-cursor-pop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes skippr-click-ping{0%{opacity:.9;transform:translate(-50%,-50%)scale(.4)}to{opacity:0;transform:translate(-50%,-50%)scale(2.4)}}@keyframes skippr-tab-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-speak{0%,to{opacity:.6;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-thinking-dot{0%,80%,to{opacity:.2;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}@keyframes skippr-pulse-ring{0%,to{box-shadow:0 0 #2d2b3d66}50%{box-shadow:0 0 0 10px #2d2b3d00}}@keyframes skippr-annotation-pulse{0%,to{box-shadow:0 0 #2bc0ae80}50%{box-shadow:0 0 0 6px #2bc0ae00}}@keyframes skippr-speak-ripple{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(1.8)}}@keyframes skippr-bar{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}@keyframes skippr-breathe{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes skippr-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-wave{0%,to{opacity:.4;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-bubble-in{0%{opacity:0;transform:translateY(12px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-tip-in{0%{opacity:0;transform:translateY(14px)scale(.96)}60%{opacity:1;transform:translateY(-2px)scale(1.01)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-pill-content{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes skippr-banner-look{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}@keyframes skippr-toolset-pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes skippr-stage-fade{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes skippr-agent-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes skippr-orb-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.skippr-no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.skippr-no-scrollbar::-webkit-scrollbar{display:none}:host{color:var(--color-foreground)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}`;
|
|
4042
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--skippr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--skippr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--skippr-color-red-50:oklch(97.1% .013 17.38);--skippr-color-red-100:oklch(93.6% .032 17.717);--skippr-color-red-200:oklch(88.5% .062 18.334);--skippr-color-red-300:oklch(80.8% .114 19.571);--skippr-color-red-400:oklch(70.4% .191 22.216);--skippr-color-red-600:oklch(57.7% .245 27.325);--skippr-color-red-700:oklch(50.5% .213 27.518);--skippr-color-amber-50:oklch(98.7% .022 95.277);--skippr-color-amber-100:oklch(96.2% .059 95.617);--skippr-color-amber-400:oklch(82.8% .189 84.429);--skippr-color-amber-700:oklch(55.5% .163 48.998);--skippr-color-amber-950:oklch(27.9% .077 45.635);--skippr-color-green-100:oklch(96.2% .044 156.743);--skippr-color-green-200:oklch(92.5% .084 155.995);--skippr-color-green-700:oklch(52.7% .154 150.069);--skippr-color-emerald-400:oklch(76.5% .177 163.223);--skippr-color-emerald-500:oklch(69.6% .17 162.48);--skippr-color-neutral-100:oklch(97% 0 0);--skippr-color-neutral-200:oklch(92.2% 0 0);--skippr-color-neutral-700:oklch(37.1% 0 0);--skippr-color-black:#000;--skippr-color-white:#fff;--skippr-spacing:.25rem;--skippr-text-xs:.75rem;--skippr-text-xs--line-height:calc(1/.75);--skippr-text-sm:.875rem;--skippr-text-sm--line-height:calc(1.25/.875);--skippr-font-weight-medium:500;--skippr-font-weight-semibold:600;--skippr-leading-tight:1.25;--skippr-leading-snug:1.375;--skippr-leading-relaxed:1.625;--skippr-ease-out:cubic-bezier(0,0,.2,1);--skippr-ease-in-out:cubic-bezier(.4,0,.2,1);--skippr-animate-spin:spin 1s linear infinite;--skippr-animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--skippr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--skippr-animate-bounce:bounce 1s infinite;--skippr-blur-sm:8px;--skippr-default-transition-duration:.15s;--skippr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--skippr-default-font-family:var(--skippr-font-sans);--skippr-default-mono-font-family:var(--skippr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--skippr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--skippr-default-font-feature-settings,normal);font-variation-settings:var(--skippr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--skippr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--skippr-default-mono-font-feature-settings,normal);font-variation-settings:var(--skippr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.skippr\\:pointer-events-none{pointer-events:none}.skippr\\:absolute{position:absolute}.skippr\\:fixed{position:fixed}.skippr\\:relative{position:relative}.skippr\\:sticky{position:sticky}.skippr\\:inset-0{inset:calc(var(--skippr-spacing)*0)}.skippr\\:inset-y-0{inset-block:calc(var(--skippr-spacing)*0)}.skippr\\:-top-2{top:calc(var(--skippr-spacing)*-2)}.skippr\\:top-0{top:calc(var(--skippr-spacing)*0)}.skippr\\:top-1\\/2{top:50%}.skippr\\:top-full{top:100%}.skippr\\:-right-2{right:calc(var(--skippr-spacing)*-2)}.skippr\\:right-0{right:calc(var(--skippr-spacing)*0)}.skippr\\:right-3{right:calc(var(--skippr-spacing)*3)}.skippr\\:right-5{right:calc(var(--skippr-spacing)*5)}.skippr\\:right-6{right:calc(var(--skippr-spacing)*6)}.skippr\\:right-\\[-3px\\]{right:-3px}.skippr\\:right-\\[24px\\]{right:24px}.skippr\\:-bottom-1{bottom:calc(var(--skippr-spacing)*-1)}.skippr\\:-bottom-9{bottom:calc(var(--skippr-spacing)*-9)}.skippr\\:bottom-20{bottom:calc(var(--skippr-spacing)*20)}.skippr\\:bottom-full{bottom:100%}.skippr\\:left-0{left:calc(var(--skippr-spacing)*0)}.skippr\\:left-1\\/2{left:50%}.skippr\\:left-3{left:calc(var(--skippr-spacing)*3)}.skippr\\:left-5{left:calc(var(--skippr-spacing)*5)}.skippr\\:left-6{left:calc(var(--skippr-spacing)*6)}.skippr\\:left-\\[24px\\]{left:24px}.skippr\\:z-10{z-index:10}.skippr\\:z-20{z-index:20}.skippr\\:z-\\[9998\\]{z-index:9998}.skippr\\:z-\\[9999\\]{z-index:9999}.skippr\\:mx-auto{margin-inline:auto}.skippr\\:-mt-\\[5px\\]{margin-top:-5px}.skippr\\:mt-0\\.5{margin-top:calc(var(--skippr-spacing)*.5)}.skippr\\:mt-1{margin-top:calc(var(--skippr-spacing)*1)}.skippr\\:mt-1\\.5{margin-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:mt-3{margin-top:calc(var(--skippr-spacing)*3)}.skippr\\:mt-3\\.5{margin-top:calc(var(--skippr-spacing)*3.5)}.skippr\\:-mb-\\[5px\\]{margin-bottom:-5px}.skippr\\:mb-1\\.5{margin-bottom:calc(var(--skippr-spacing)*1.5)}.skippr\\:mb-2{margin-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:mb-3{margin-bottom:calc(var(--skippr-spacing)*3)}.skippr\\:mb-4{margin-bottom:calc(var(--skippr-spacing)*4)}.skippr\\:ml-0\\.5{margin-left:calc(var(--skippr-spacing)*.5)}.skippr\\:flex{display:flex}.skippr\\:inline-flex{display:inline-flex}.skippr\\:size-1{width:calc(var(--skippr-spacing)*1);height:calc(var(--skippr-spacing)*1)}.skippr\\:size-1\\.5{width:calc(var(--skippr-spacing)*1.5);height:calc(var(--skippr-spacing)*1.5)}.skippr\\:size-2{width:calc(var(--skippr-spacing)*2);height:calc(var(--skippr-spacing)*2)}.skippr\\:size-2\\.5{width:calc(var(--skippr-spacing)*2.5);height:calc(var(--skippr-spacing)*2.5)}.skippr\\:size-3\\.5{width:calc(var(--skippr-spacing)*3.5);height:calc(var(--skippr-spacing)*3.5)}.skippr\\:size-4{width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}.skippr\\:size-5{width:calc(var(--skippr-spacing)*5);height:calc(var(--skippr-spacing)*5)}.skippr\\:size-6{width:calc(var(--skippr-spacing)*6);height:calc(var(--skippr-spacing)*6)}.skippr\\:size-7{width:calc(var(--skippr-spacing)*7);height:calc(var(--skippr-spacing)*7)}.skippr\\:size-8{width:calc(var(--skippr-spacing)*8);height:calc(var(--skippr-spacing)*8)}.skippr\\:size-9{width:calc(var(--skippr-spacing)*9);height:calc(var(--skippr-spacing)*9)}.skippr\\:size-10{width:calc(var(--skippr-spacing)*10);height:calc(var(--skippr-spacing)*10)}.skippr\\:size-12{width:calc(var(--skippr-spacing)*12);height:calc(var(--skippr-spacing)*12)}.skippr\\:size-\\[5px\\]{width:5px;height:5px}.skippr\\:size-\\[6px\\]{width:6px;height:6px}.skippr\\:size-full{width:100%;height:100%}.skippr\\:h-0{height:calc(var(--skippr-spacing)*0)}.skippr\\:h-0\\.5{height:calc(var(--skippr-spacing)*.5)}.skippr\\:h-1{height:calc(var(--skippr-spacing)*1)}.skippr\\:h-1\\.5{height:calc(var(--skippr-spacing)*1.5)}.skippr\\:h-2{height:calc(var(--skippr-spacing)*2)}.skippr\\:h-3{height:calc(var(--skippr-spacing)*3)}.skippr\\:h-3\\.5{height:calc(var(--skippr-spacing)*3.5)}.skippr\\:h-5{height:calc(var(--skippr-spacing)*5)}.skippr\\:h-6{height:calc(var(--skippr-spacing)*6)}.skippr\\:h-7{height:calc(var(--skippr-spacing)*7)}.skippr\\:h-8{height:calc(var(--skippr-spacing)*8)}.skippr\\:h-9{height:calc(var(--skippr-spacing)*9)}.skippr\\:h-10{height:calc(var(--skippr-spacing)*10)}.skippr\\:h-12{height:calc(var(--skippr-spacing)*12)}.skippr\\:h-16{height:calc(var(--skippr-spacing)*16)}.skippr\\:h-\\[18\\.5px\\]{height:18.5px}.skippr\\:h-\\[50px\\]{height:50px}.skippr\\:h-full{height:100%}.skippr\\:min-h-0{min-height:calc(var(--skippr-spacing)*0)}.skippr\\:w-0{width:calc(var(--skippr-spacing)*0)}.skippr\\:w-3\\.5{width:calc(var(--skippr-spacing)*3.5)}.skippr\\:w-5{width:calc(var(--skippr-spacing)*5)}.skippr\\:w-6{width:calc(var(--skippr-spacing)*6)}.skippr\\:w-7{width:calc(var(--skippr-spacing)*7)}.skippr\\:w-10{width:calc(var(--skippr-spacing)*10)}.skippr\\:w-12{width:calc(var(--skippr-spacing)*12)}.skippr\\:w-14{width:calc(var(--skippr-spacing)*14)}.skippr\\:w-40{width:calc(var(--skippr-spacing)*40)}.skippr\\:w-\\[2px\\]{width:2px}.skippr\\:w-\\[3px\\]{width:3px}.skippr\\:w-\\[15\\.4px\\]{width:15.4px}.skippr\\:w-\\[50px\\]{width:50px}.skippr\\:w-full{width:100%}.skippr\\:max-w-64{max-width:calc(var(--skippr-spacing)*64)}.skippr\\:max-w-72{max-width:calc(var(--skippr-spacing)*72)}.skippr\\:max-w-\\[80\\%\\]{max-width:80%}.skippr\\:min-w-0{min-width:calc(var(--skippr-spacing)*0)}.skippr\\:flex-1{flex:1}.skippr\\:shrink-0{flex-shrink:0}.skippr\\:origin-bottom-left{transform-origin:0 100%}.skippr\\:origin-bottom-right{transform-origin:100% 100%}.skippr\\:origin-center{transform-origin:50%}.skippr\\:origin-left{transform-origin:0}.skippr\\:origin-right{transform-origin:100%}.skippr\\:origin-top-left{transform-origin:0 0}.skippr\\:origin-top-right{transform-origin:100% 0}.skippr\\:-translate-x-1\\/2{--tw-translate-x:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:-translate-x-7{--tw-translate-x:calc(var(--skippr-spacing)*-7);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:translate-x-7{--tw-translate-x:calc(var(--skippr-spacing)*7);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:-translate-y-1\\/2{--tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:scale-0{--tw-scale-x:0%;--tw-scale-y:0%;--tw-scale-z:0%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-95{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:-rotate-90{rotate:-90deg}.skippr\\:rotate-45{rotate:45deg}.skippr\\:rotate-\\[225deg\\]{rotate:225deg}.skippr\\:\\[animation\\:skippr-agent-in_200ms_ease-out_240ms_both\\]{animation:.2s ease-out .24s both skippr-agent-in}.skippr\\:\\[animation\\:skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:\\[animation\\:skippr-finger-tap_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-finger-tap}.skippr\\:\\[animation\\:skippr-orb-in_320ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)\\]{animation:.32s cubic-bezier(.34,1.3,.64,1) skippr-orb-in}.skippr\\:\\[animation\\:skippr-stage-fade_240ms_ease-out\\]{animation:.24s ease-out skippr-stage-fade}.skippr\\:\\[animation\\:skippr-tip-in_360ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)_backwards\\]{animation:.36s cubic-bezier(.34,1.3,.64,1) backwards skippr-tip-in}.skippr\\:\\[animation\\:skippr-toolset-pop_440ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{animation:.44s cubic-bezier(.22,1,.36,1) skippr-toolset-pop}.skippr\\:animate-\\[skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:animate-\\[skippr-bubble-in_0\\.28s_ease-out\\]{animation:.28s ease-out skippr-bubble-in}.skippr\\:animate-\\[skippr-fade-in_0\\.3s_ease-out\\]{animation:.3s ease-out skippr-fade-in}.skippr\\:animate-\\[skippr-pill-content_0\\.22s_ease-out\\]{animation:.22s ease-out skippr-pill-content}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.3s_infinite\\]{animation:1.1s ease-in-out .3s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.6s_infinite\\]{animation:1.1s ease-in-out .6s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.15s_infinite\\]{animation:1.1s ease-in-out .15s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.45s_infinite\\]{animation:1.1s ease-in-out .45s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-speak}.skippr\\:animate-bounce{animation:var(--skippr-animate-bounce)}.skippr\\:animate-ping{animation:var(--skippr-animate-ping)}.skippr\\:animate-pulse{animation:var(--skippr-animate-pulse)}.skippr\\:animate-skippr-annotation-pulse{animation:1.8s ease-in-out infinite skippr-annotation-pulse}.skippr\\:animate-skippr-click-ping{animation:.5s ease-out forwards skippr-click-ping}.skippr\\:animate-skippr-cursor-pop{animation:.22s ease-out skippr-cursor-pop}.skippr\\:animate-skippr-press{animation:.5s ease-in-out skippr-press}.skippr\\:animate-skippr-tab-fade{animation:.2s ease-out skippr-tab-fade}.skippr\\:animate-skippr-thinking-dot{animation:1.2s ease-in-out infinite skippr-thinking-dot}.skippr\\:animate-spin{animation:var(--skippr-animate-spin)}.skippr\\:cursor-default{cursor:default}.skippr\\:cursor-grab{cursor:grab}.skippr\\:cursor-pointer{cursor:pointer}.skippr\\:touch-none{touch-action:none}.skippr\\:resize-none{resize:none}.skippr\\:flex-col{flex-direction:column}.skippr\\:flex-col-reverse{flex-direction:column-reverse}.skippr\\:items-center{align-items:center}.skippr\\:items-end{align-items:flex-end}.skippr\\:items-start{align-items:flex-start}.skippr\\:justify-between{justify-content:space-between}.skippr\\:justify-center{justify-content:center}.skippr\\:justify-end{justify-content:flex-end}.skippr\\:gap-1{gap:calc(var(--skippr-spacing)*1)}.skippr\\:gap-1\\.5{gap:calc(var(--skippr-spacing)*1.5)}.skippr\\:gap-2{gap:calc(var(--skippr-spacing)*2)}.skippr\\:gap-2\\.5{gap:calc(var(--skippr-spacing)*2.5)}.skippr\\:gap-3{gap:calc(var(--skippr-spacing)*3)}.skippr\\:gap-\\[2px\\]{gap:2px}.skippr\\:gap-\\[3px\\]{gap:3px}:where(.skippr\\:space-y-0\\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*.5)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*.5)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}.skippr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.skippr\\:overflow-hidden{overflow:hidden}.skippr\\:overflow-y-auto{overflow-y:auto}.skippr\\:rounded-2xl{border-radius:1.125rem}.skippr\\:rounded-\\[1rem\\]{border-radius:1rem}.skippr\\:rounded-\\[10px\\]{border-radius:10px}.skippr\\:rounded-\\[14px\\]{border-radius:14px}.skippr\\:rounded-\\[16px\\]{border-radius:16px}.skippr\\:rounded-\\[20px\\]{border-radius:20px}.skippr\\:rounded-full{border-radius:3.40282e38px}.skippr\\:rounded-lg{border-radius:.625rem}.skippr\\:rounded-md{border-radius:.5rem}.skippr\\:rounded-sm{border-radius:.375rem}.skippr\\:rounded-xl{border-radius:.875rem}.skippr\\:rounded-tl-md{border-top-left-radius:.5rem}.skippr\\:border{border-style:var(--tw-border-style);border-width:1px}.skippr\\:border-0{border-style:var(--tw-border-style);border-width:0}.skippr\\:border-2{border-style:var(--tw-border-style);border-width:2px}.skippr\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.skippr\\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.skippr\\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.skippr\\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.skippr\\:border-\\[\\#2bc0ae\\]{border-color:#2bc0ae}.skippr\\:border-border,.skippr\\:border-input{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-primary\\/20{border-color:oklab(29.9244% .0107414 -.0305411/.2)}.skippr\\:border-r-border{border-right-color:oklch(92.3% .003 48.717)}.skippr\\:border-l-border{border-left-color:oklch(92.3% .003 48.717)}.skippr\\:bg-\\[\\#2bc0ae\\]{background-color:#2bc0ae}.skippr\\:bg-\\[\\#2bc0ae\\]\\/50{background-color:oklab(72.9347% -.121518 -.00545585/.5)}.skippr\\:bg-amber-50{background-color:var(--skippr-color-amber-50)}.skippr\\:bg-amber-400{background-color:var(--skippr-color-amber-400)}.skippr\\:bg-background{background-color:oklch(100% 0 0)}.skippr\\:bg-black\\/\\[0\\.07\\]{background-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-black\\/\\[0\\.07\\]{background-color:color-mix(in oklab,var(--skippr-color-black)7.0%,transparent)}}.skippr\\:bg-bubble{background-color:#2d2b3d}.skippr\\:bg-bubble\\/95{background-color:oklab(29.9244% .0107414 -.0305411/.95)}.skippr\\:bg-card{background-color:oklch(100% 0 0)}.skippr\\:bg-current{background-color:currentColor}.skippr\\:bg-destructive{background-color:#d94f4f}.skippr\\:bg-emerald-400{background-color:var(--skippr-color-emerald-400)}.skippr\\:bg-emerald-500{background-color:var(--skippr-color-emerald-500)}.skippr\\:bg-foreground{background-color:oklch(14.7% .004 49.25)}.skippr\\:bg-green-100{background-color:var(--skippr-color-green-100)}.skippr\\:bg-launcher{background-color:#2d2d3f}.skippr\\:bg-muted{background-color:oklch(97% .001 106.424)}.skippr\\:bg-muted-foreground\\/20{background-color:oklab(55.3% .00687528 .0110332/.2)}.skippr\\:bg-muted-foreground\\/40{background-color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:bg-muted\\/50{background-color:oklab(97% -.000282743 .000959196/.5)}.skippr\\:bg-neutral-100{background-color:var(--skippr-color-neutral-100)}.skippr\\:bg-primary{background-color:#2d2b3d}.skippr\\:bg-primary-foreground\\/20{background-color:oklab(100% 0 5.96046e-8/.2)}.skippr\\:bg-primary\\/10{background-color:oklab(29.9244% .0107414 -.0305411/.1)}.skippr\\:bg-red-50{background-color:var(--skippr-color-red-50)}.skippr\\:bg-red-100{background-color:var(--skippr-color-red-100)}.skippr\\:bg-red-400{background-color:var(--skippr-color-red-400)}.skippr\\:bg-secondary{background-color:#ffdfb5}.skippr\\:bg-transparent{background-color:#0000}.skippr\\:bg-white{background-color:var(--skippr-color-white)}.skippr\\:fill-brand{fill:#2bc0ae}.skippr\\:fill-primary\\/30{fill:oklab(29.9244% .0107414 -.0305411/.3)}.skippr\\:stroke-black\\/15{stroke:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:stroke-black\\/15{stroke:color-mix(in oklab,var(--skippr-color-black)15%,transparent)}}.skippr\\:stroke-bubble{stroke:#2d2b3d}.skippr\\:p-2{padding:calc(var(--skippr-spacing)*2)}.skippr\\:p-3{padding:calc(var(--skippr-spacing)*3)}.skippr\\:p-3\\.5{padding:calc(var(--skippr-spacing)*3.5)}.skippr\\:p-4{padding:calc(var(--skippr-spacing)*4)}.skippr\\:px-1{padding-inline:calc(var(--skippr-spacing)*1)}.skippr\\:px-1\\.5{padding-inline:calc(var(--skippr-spacing)*1.5)}.skippr\\:px-2{padding-inline:calc(var(--skippr-spacing)*2)}.skippr\\:px-2\\.5{padding-inline:calc(var(--skippr-spacing)*2.5)}.skippr\\:px-3{padding-inline:calc(var(--skippr-spacing)*3)}.skippr\\:px-4{padding-inline:calc(var(--skippr-spacing)*4)}.skippr\\:px-6{padding-inline:calc(var(--skippr-spacing)*6)}.skippr\\:px-8{padding-inline:calc(var(--skippr-spacing)*8)}.skippr\\:py-0\\.5{padding-block:calc(var(--skippr-spacing)*.5)}.skippr\\:py-1{padding-block:calc(var(--skippr-spacing)*1)}.skippr\\:py-1\\.5{padding-block:calc(var(--skippr-spacing)*1.5)}.skippr\\:py-2{padding-block:calc(var(--skippr-spacing)*2)}.skippr\\:py-2\\.5{padding-block:calc(var(--skippr-spacing)*2.5)}.skippr\\:py-3{padding-block:calc(var(--skippr-spacing)*3)}.skippr\\:py-4{padding-block:calc(var(--skippr-spacing)*4)}.skippr\\:pt-1\\.5{padding-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:pt-2{padding-top:calc(var(--skippr-spacing)*2)}.skippr\\:pr-3{padding-right:calc(var(--skippr-spacing)*3)}.skippr\\:pb-0{padding-bottom:calc(var(--skippr-spacing)*0)}.skippr\\:pb-2{padding-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:pl-1\\.5{padding-left:calc(var(--skippr-spacing)*1.5)}.skippr\\:pl-3\\.5{padding-left:calc(var(--skippr-spacing)*3.5)}.skippr\\:text-center{text-align:center}.skippr\\:text-left{text-align:left}.skippr\\:font-mono{font-family:var(--skippr-font-mono)}.skippr\\:text-sm{font-size:var(--skippr-text-sm);line-height:var(--tw-leading,var(--skippr-text-sm--line-height))}.skippr\\:text-xs{font-size:var(--skippr-text-xs);line-height:var(--tw-leading,var(--skippr-text-xs--line-height))}.skippr\\:text-\\[10px\\]{font-size:10px}.skippr\\:text-\\[11px\\]{font-size:11px}.skippr\\:text-\\[13px\\]{font-size:13px}.skippr\\:leading-5{--tw-leading:calc(var(--skippr-spacing)*5);line-height:calc(var(--skippr-spacing)*5)}.skippr\\:leading-relaxed{--tw-leading:var(--skippr-leading-relaxed);line-height:var(--skippr-leading-relaxed)}.skippr\\:leading-snug{--tw-leading:var(--skippr-leading-snug);line-height:var(--skippr-leading-snug)}.skippr\\:leading-tight{--tw-leading:var(--skippr-leading-tight);line-height:var(--skippr-leading-tight)}.skippr\\:font-medium{--tw-font-weight:var(--skippr-font-weight-medium);font-weight:var(--skippr-font-weight-medium)}.skippr\\:font-semibold{--tw-font-weight:var(--skippr-font-weight-semibold);font-weight:var(--skippr-font-weight-semibold)}.skippr\\:whitespace-nowrap{white-space:nowrap}.skippr\\:text-\\[\\#2bc0ae\\]{color:#2bc0ae}.skippr\\:text-amber-700{color:var(--skippr-color-amber-700)}.skippr\\:text-amber-950{color:var(--skippr-color-amber-950)}.skippr\\:text-background{color:oklch(100% 0 0)}.skippr\\:text-black{color:var(--skippr-color-black)}.skippr\\:text-bubble{color:#2d2b3d}.skippr\\:text-chart-3{color:oklch(66.6% .179 58.318)}.skippr\\:text-destructive{color:#d94f4f}.skippr\\:text-foreground{color:oklch(14.7% .004 49.25)}.skippr\\:text-green-700{color:var(--skippr-color-green-700)}.skippr\\:text-muted-foreground{color:oklch(55.3% .013 58.071)}.skippr\\:text-muted-foreground\\/30{color:oklab(55.3% .00687528 .0110332/.3)}.skippr\\:text-muted-foreground\\/40{color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:text-muted-foreground\\/60{color:oklab(55.3% .00687528 .0110332/.6)}.skippr\\:text-muted-foreground\\/70{color:oklab(55.3% .00687528 .0110332/.7)}.skippr\\:text-neutral-700{color:var(--skippr-color-neutral-700)}.skippr\\:text-primary{color:#2d2b3d}.skippr\\:text-primary-foreground{color:#fff}.skippr\\:text-primary-foreground\\/70{color:oklab(100% 0 5.96046e-8/.7)}.skippr\\:text-red-400{color:var(--skippr-color-red-400)}.skippr\\:text-red-600{color:var(--skippr-color-red-600)}.skippr\\:text-red-700{color:var(--skippr-color-red-700)}.skippr\\:text-secondary-foreground{color:#613700}.skippr\\:text-white{color:var(--skippr-color-white)}.skippr\\:line-through{text-decoration-line:line-through}.skippr\\:placeholder-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}.skippr\\:opacity-0{opacity:0}.skippr\\:opacity-40{opacity:.4}.skippr\\:opacity-75{opacity:.75}.skippr\\:opacity-100{opacity:1}.skippr\\:shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[-6px_6px_22px_rgba\\(0\\,0\\,0\\,0\\.3\\)\\]{--tw-shadow:-6px 6px 22px var(--tw-shadow-color,#0000004d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\]{--tw-shadow:0 4px 12px var(--tw-shadow-color,#0000001f);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_14px_rgba\\(0\\,0\\,0\\,0\\.3\\)\\]{--tw-shadow:0 4px 14px var(--tw-shadow-color,#0000004d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_16px_rgba\\(45\\,43\\,61\\,0\\.45\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#2d2b3d73),0 2px 4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(45\\,43\\,61\\,0\\.35\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#2d2b3d59);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_30px_rgba\\(0\\,0\\,0\\,0\\.16\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\]{--tw-shadow:0 8px 30px var(--tw-shadow-color,#00000029),0 4px 12px var(--tw-shadow-color,#00000014);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_10px_32px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 10px 32px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-2{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-black\\/5{--tw-ring-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-black\\/5{--tw-ring-color:color-mix(in oklab,var(--skippr-color-black)5%,transparent)}}.skippr\\:ring-brand{--tw-ring-color:#2bc0ae}.skippr\\:ring-foreground\\/10{--tw-ring-color:oklab(14.7% .00261104 .00303026/.1)}.skippr\\:ring-offset-background{--tw-ring-offset-color:oklch(100% 0 0)}.skippr\\:drop-shadow-\\[0_2px_5px_rgba\\(0\\,0\\,0\\,0\\.4\\)\\]{--tw-drop-shadow-size:drop-shadow(0 2px 5px var(--tw-drop-shadow-color,#0006));--tw-drop-shadow:var(--tw-drop-shadow-size);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.skippr\\:backdrop-blur-sm{--tw-backdrop-blur:blur(var(--skippr-blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.skippr\\:transition-\\[height\\]{transition-property:height;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[opacity\\,transform\\,height\\]{transition-property:opacity,transform,height;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[width\\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:duration-75{--tw-duration:75ms;transition-duration:75ms}.skippr\\:duration-150{--tw-duration:.15s;transition-duration:.15s}.skippr\\:duration-200{--tw-duration:.2s;transition-duration:.2s}.skippr\\:duration-300{--tw-duration:.3s;transition-duration:.3s}.skippr\\:ease-in-out{--tw-ease:var(--skippr-ease-in-out);transition-timing-function:var(--skippr-ease-in-out)}.skippr\\:ease-out{--tw-ease:var(--skippr-ease-out);transition-timing-function:var(--skippr-ease-out)}.skippr\\:outline-none{--tw-outline-style:none;outline-style:none}.skippr\\:\\[animation-delay\\:0ms\\]{animation-delay:0s}.skippr\\:\\[animation-delay\\:150ms\\]{animation-delay:.15s}.skippr\\:\\[animation-delay\\:200ms\\]{animation-delay:.2s}.skippr\\:\\[animation-delay\\:300ms\\]{animation-delay:.3s}.skippr\\:\\[animation-delay\\:400ms\\]{animation-delay:.4s}.skippr\\:\\[overflow-anchor\\:none\\]{overflow-anchor:none}.skippr\\:group-focus-within\\:scale-100:is(:where(.skippr\\:group):focus-within *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-focus-within\\:opacity-100:is(:where(.skippr\\:group):focus-within *){opacity:1}@media (hover:hover){.skippr\\:group-hover\\:scale-100:is(:where(.skippr\\:group):hover *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-hover\\:text-red-300:is(:where(.skippr\\:group):hover *){color:var(--skippr-color-red-300)}.skippr\\:group-hover\\:text-white\\/80:is(:where(.skippr\\:group):hover *){color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:group-hover\\:text-white\\/80:is(:where(.skippr\\:group):hover *){color:color-mix(in oklab,var(--skippr-color-white)80%,transparent)}}.skippr\\:group-hover\\:opacity-100:is(:where(.skippr\\:group):hover *){opacity:1}}.skippr\\:placeholder\\:text-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}@media (hover:hover){.skippr\\:hover\\:-translate-y-0\\.5:hover{--tw-translate-y:calc(var(--skippr-spacing)*-.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:hover\\:scale-110:hover{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:hover\\:bg-\\[\\#3a384b\\]:hover{background-color:#3a384b}.skippr\\:hover\\:bg-accent:hover{background-color:#e7e5e4}.skippr\\:hover\\:bg-amber-100:hover{background-color:var(--skippr-color-amber-100)}.skippr\\:hover\\:bg-bubble:hover{background-color:#2d2b3d}.skippr\\:hover\\:bg-destructive\\/90:hover{background-color:oklab(61.4357% .15892 .0698893/.9)}.skippr\\:hover\\:bg-green-200:hover{background-color:var(--skippr-color-green-200)}.skippr\\:hover\\:bg-muted\\/70:hover{background-color:oklab(97% -.000282743 .000959196/.7)}.skippr\\:hover\\:bg-neutral-100:hover{background-color:var(--skippr-color-neutral-100)}.skippr\\:hover\\:bg-neutral-200:hover{background-color:var(--skippr-color-neutral-200)}.skippr\\:hover\\:bg-primary-foreground\\/10:hover{background-color:oklab(100% 0 5.96046e-8/.1)}.skippr\\:hover\\:bg-primary\\/90:hover{background-color:oklab(29.9244% .0107414 -.0305411/.9)}.skippr\\:hover\\:bg-red-200:hover{background-color:var(--skippr-color-red-200)}.skippr\\:hover\\:bg-secondary\\/80:hover{background-color:oklab(91.9963% .0175391 .0626889/.8)}.skippr\\:hover\\:text-accent-foreground:hover{color:oklch(21.6% .006 56.043)}.skippr\\:hover\\:text-foreground:hover{color:oklch(14.7% .004 49.25)}.skippr\\:hover\\:text-primary-foreground:hover{color:#fff}.skippr\\:hover\\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}.skippr\\:focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:focus-visible\\:ring-bubble\\/60:focus-visible{--tw-ring-color:oklab(29.9244% .0107414 -.0305411/.6)}.skippr\\:focus-visible\\:ring-ring:focus-visible{--tw-ring-color:oklch(70.9% .01 56.259)}.skippr\\:focus-visible\\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.skippr\\:focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.skippr\\:active\\:translate-y-0:active{--tw-translate-y:calc(var(--skippr-spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.skippr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.skippr\\:disabled\\:opacity-50:disabled{opacity:.5}.skippr\\:disabled\\:opacity-60:disabled{opacity:.6}@media (prefers-reduced-motion:reduce){.skippr\\:motion-reduce\\:hidden{display:none}.skippr\\:motion-reduce\\:animate-none{animation:none}}.skippr\\:\\[\\&_svg\\]\\:pointer-events-none svg{pointer-events:none}.skippr\\:\\[\\&_svg\\]\\:shrink-0 svg{flex-shrink:0}.skippr\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 svg:not([class*=size-]){width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}}@keyframes skippr-tap{0%{transform:scale(1)}45%{transform:scale(.7)}to{transform:scale(1)}}@keyframes skippr-press{0%{transform:scale(1)}55%{transform:scale(1)}85%{transform:scale(.68)}to{transform:scale(1)}}@keyframes skippr-cursor-pop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes skippr-click-ping{0%{opacity:.9;transform:translate(-50%,-50%)scale(.4)}to{opacity:0;transform:translate(-50%,-50%)scale(2.4)}}@keyframes skippr-tab-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-speak{0%,to{opacity:.6;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-thinking-dot{0%,80%,to{opacity:.2;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}@keyframes skippr-pulse-ring{0%,to{box-shadow:0 0 #2d2b3d66}50%{box-shadow:0 0 0 10px #2d2b3d00}}@keyframes skippr-annotation-pulse{0%,to{box-shadow:0 0 #2bc0ae80}50%{box-shadow:0 0 0 6px #2bc0ae00}}@keyframes skippr-speak-ripple{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(1.8)}}@keyframes skippr-bar{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}@keyframes skippr-breathe{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes skippr-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-wave{0%,to{opacity:.4;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-bubble-in{0%{opacity:0;transform:translateY(12px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-tip-in{0%{opacity:0;transform:translateY(14px)scale(.96)}60%{opacity:1;transform:translateY(-2px)scale(1.01)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-pill-content{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes skippr-banner-look{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}@keyframes skippr-finger-tap{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(2px)rotate(-6deg)}}@keyframes skippr-toolset-pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes skippr-stage-fade{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes skippr-agent-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes skippr-orb-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.skippr-no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.skippr-no-scrollbar::-webkit-scrollbar{display:none}:host{color:var(--color-foreground)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}`;
|
|
3837
4043
|
useLayoutEffect2(() => {
|
|
3838
4044
|
const host = hostRef.current;
|
|
3839
4045
|
if (!host || !css)
|
|
@@ -3858,13 +4064,13 @@ function ShadowHost({ children }) {
|
|
|
3858
4064
|
}
|
|
3859
4065
|
|
|
3860
4066
|
// src/components/Sidebar.tsx
|
|
3861
|
-
import { useContext as useContext10, useEffect as
|
|
4067
|
+
import { useContext as useContext10, useEffect as useEffect22 } from "react";
|
|
3862
4068
|
|
|
3863
4069
|
// src/hooks/useCombinedMessages.ts
|
|
3864
4070
|
import { useContext as useContext7, useMemo as useMemo5 } from "react";
|
|
3865
4071
|
|
|
3866
4072
|
// src/hooks/useChatMessages.ts
|
|
3867
|
-
import { useChat, useLocalParticipant as
|
|
4073
|
+
import { useChat, useLocalParticipant as useLocalParticipant6 } from "@livekit/components-react/hooks";
|
|
3868
4074
|
import { useMemo as useMemo3 } from "react";
|
|
3869
4075
|
|
|
3870
4076
|
// src/lib/filterSystemMessages.ts
|
|
@@ -3876,7 +4082,7 @@ function filterSystemMessages(messages) {
|
|
|
3876
4082
|
// src/hooks/useChatMessages.ts
|
|
3877
4083
|
function useChatMessages() {
|
|
3878
4084
|
const { chatMessages: rawMessages, send, isSending } = useChat();
|
|
3879
|
-
const { localParticipant } =
|
|
4085
|
+
const { localParticipant } = useLocalParticipant6();
|
|
3880
4086
|
const localIdentity = localParticipant.identity;
|
|
3881
4087
|
const chatMessages = useMemo3(() => {
|
|
3882
4088
|
const sortedMessages = rawMessages.map((msg) => ({
|
|
@@ -3892,11 +4098,11 @@ function useChatMessages() {
|
|
|
3892
4098
|
}
|
|
3893
4099
|
|
|
3894
4100
|
// src/hooks/useStreamingTranscript.ts
|
|
3895
|
-
import { useLocalParticipant as
|
|
4101
|
+
import { useLocalParticipant as useLocalParticipant7, useTranscriptions } from "@livekit/components-react/hooks";
|
|
3896
4102
|
import { useMemo as useMemo4 } from "react";
|
|
3897
4103
|
function useStreamingTranscript() {
|
|
3898
4104
|
const transcriptions = useTranscriptions();
|
|
3899
|
-
const { localParticipant } =
|
|
4105
|
+
const { localParticipant } = useLocalParticipant7();
|
|
3900
4106
|
const localIdentity = localParticipant.identity;
|
|
3901
4107
|
const transcriptMessages = useMemo4(() => filterSystemMessages(transcriptions.filter((stream) => stream.text.trim().length > 0).map((stream) => ({
|
|
3902
4108
|
id: stream.streamInfo.id,
|
|
@@ -3947,7 +4153,7 @@ function useCombinedMessages() {
|
|
|
3947
4153
|
}
|
|
3948
4154
|
|
|
3949
4155
|
// src/hooks/useSessionRemaining.ts
|
|
3950
|
-
import { useEffect as
|
|
4156
|
+
import { useEffect as useEffect17, useRef as useRef12, useState as useState12 } from "react";
|
|
3951
4157
|
|
|
3952
4158
|
// src/lib/format.ts
|
|
3953
4159
|
function formatTime(seconds) {
|
|
@@ -3964,8 +4170,8 @@ function parseNumber(s) {
|
|
|
3964
4170
|
function useSessionRemaining() {
|
|
3965
4171
|
const maxCallDuration = useAgentState("maxCallDuration", parseNumber, null);
|
|
3966
4172
|
const endTimeRef = useRef12(null);
|
|
3967
|
-
const [remaining, setRemaining] =
|
|
3968
|
-
|
|
4173
|
+
const [remaining, setRemaining] = useState12(null);
|
|
4174
|
+
useEffect17(() => {
|
|
3969
4175
|
if (maxCallDuration === null || endTimeRef.current !== null)
|
|
3970
4176
|
return;
|
|
3971
4177
|
const endTime = Date.now() + maxCallDuration * 1000;
|
|
@@ -3982,25 +4188,25 @@ function useSessionRemaining() {
|
|
|
3982
4188
|
}
|
|
3983
4189
|
|
|
3984
4190
|
// src/hooks/useTextMode.ts
|
|
3985
|
-
import { useLocalParticipant as
|
|
3986
|
-
import { useCallback as
|
|
3987
|
-
var
|
|
4191
|
+
import { useLocalParticipant as useLocalParticipant8 } from "@livekit/components-react/hooks";
|
|
4192
|
+
import { useCallback as useCallback11, useContext as useContext8, useRef as useRef13 } from "react";
|
|
4193
|
+
var textEncoder4 = new TextEncoder;
|
|
3988
4194
|
function useTextMode() {
|
|
3989
4195
|
const ctx = useContext8(LiveAgentContext);
|
|
3990
4196
|
if (!ctx) {
|
|
3991
4197
|
throw new Error("useTextMode must be used within a <LiveAgent> provider");
|
|
3992
4198
|
}
|
|
3993
4199
|
const { textMode, setTextModeState, sidebarTab, setSidebarTab } = ctx;
|
|
3994
|
-
const { localParticipant } =
|
|
4200
|
+
const { localParticipant } = useLocalParticipant8();
|
|
3995
4201
|
const confirmedTextModeRef = useRef13(false);
|
|
3996
|
-
const toggleTextMode =
|
|
4202
|
+
const toggleTextMode = useCallback11(async () => {
|
|
3997
4203
|
const next = !textMode;
|
|
3998
4204
|
setTextModeState(next);
|
|
3999
4205
|
if (next && sidebarTab === "agenda") {
|
|
4000
4206
|
setSidebarTab("chat");
|
|
4001
4207
|
}
|
|
4002
4208
|
try {
|
|
4003
|
-
await localParticipant.publishData(
|
|
4209
|
+
await localParticipant.publishData(textEncoder4.encode(JSON.stringify({ textMode: next })), {
|
|
4004
4210
|
reliable: true,
|
|
4005
4211
|
topic: TEXT_MODE_TOPIC
|
|
4006
4212
|
});
|
|
@@ -4018,10 +4224,10 @@ function useTextMode() {
|
|
|
4018
4224
|
import { useContext as useContext9 } from "react";
|
|
4019
4225
|
|
|
4020
4226
|
// src/hooks/useElapsedSeconds.ts
|
|
4021
|
-
import { useEffect as
|
|
4227
|
+
import { useEffect as useEffect18, useState as useState13 } from "react";
|
|
4022
4228
|
function useElapsedSeconds(isRunning) {
|
|
4023
|
-
const [elapsed, setElapsed] =
|
|
4024
|
-
|
|
4229
|
+
const [elapsed, setElapsed] = useState13(0);
|
|
4230
|
+
useEffect18(() => {
|
|
4025
4231
|
if (!isRunning) {
|
|
4026
4232
|
setElapsed(0);
|
|
4027
4233
|
return;
|
|
@@ -4125,7 +4331,7 @@ function LoadingDots({ label }) {
|
|
|
4125
4331
|
}
|
|
4126
4332
|
|
|
4127
4333
|
// src/components/LoginFlow.tsx
|
|
4128
|
-
import { useCallback as
|
|
4334
|
+
import { useCallback as useCallback12, useEffect as useEffect19, useRef as useRef14, useState as useState14 } from "react";
|
|
4129
4335
|
|
|
4130
4336
|
// src/components/ui/button.tsx
|
|
4131
4337
|
import { forwardRef as forwardRef3 } from "react";
|
|
@@ -4161,20 +4367,20 @@ import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
|
4161
4367
|
var OTP_LENGTH = 6;
|
|
4162
4368
|
var DIGIT_KEYS = ["d0", "d1", "d2", "d3", "d4", "d5"];
|
|
4163
4369
|
function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
|
|
4164
|
-
const [step, setStep] =
|
|
4165
|
-
const [email, setEmail] =
|
|
4166
|
-
const handleRequestOtp =
|
|
4370
|
+
const [step, setStep] = useState14("email");
|
|
4371
|
+
const [email, setEmail] = useState14("");
|
|
4372
|
+
const handleRequestOtp = useCallback12(async (emailValue) => {
|
|
4167
4373
|
const success = await requestOtp(emailValue);
|
|
4168
4374
|
if (success)
|
|
4169
4375
|
setStep("otp");
|
|
4170
4376
|
}, [requestOtp]);
|
|
4171
|
-
const handleVerifyOtp =
|
|
4377
|
+
const handleVerifyOtp = useCallback12(async (code) => {
|
|
4172
4378
|
await verifyOtp(email, code);
|
|
4173
4379
|
}, [verifyOtp, email]);
|
|
4174
|
-
const handleBack =
|
|
4380
|
+
const handleBack = useCallback12(() => {
|
|
4175
4381
|
setStep("email");
|
|
4176
4382
|
}, []);
|
|
4177
|
-
const handleResend =
|
|
4383
|
+
const handleResend = useCallback12(async () => {
|
|
4178
4384
|
await requestOtp(email);
|
|
4179
4385
|
}, [requestOtp, email]);
|
|
4180
4386
|
if (step === "otp") {
|
|
@@ -4251,30 +4457,30 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
|
|
|
4251
4457
|
});
|
|
4252
4458
|
}
|
|
4253
4459
|
function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
4254
|
-
const [digits, setDigits] =
|
|
4255
|
-
const [resendCooldown, setResendCooldown] =
|
|
4460
|
+
const [digits, setDigits] = useState14(Array(OTP_LENGTH).fill(""));
|
|
4461
|
+
const [resendCooldown, setResendCooldown] = useState14(0);
|
|
4256
4462
|
const inputRefs = useRef14([]);
|
|
4257
4463
|
const submittedRef = useRef14(false);
|
|
4258
|
-
|
|
4464
|
+
useEffect19(() => {
|
|
4259
4465
|
inputRefs.current[0]?.focus();
|
|
4260
4466
|
}, []);
|
|
4261
|
-
|
|
4467
|
+
useEffect19(() => {
|
|
4262
4468
|
if (error)
|
|
4263
4469
|
submittedRef.current = false;
|
|
4264
4470
|
}, [error]);
|
|
4265
|
-
|
|
4471
|
+
useEffect19(() => {
|
|
4266
4472
|
if (resendCooldown <= 0)
|
|
4267
4473
|
return;
|
|
4268
4474
|
const timer = setTimeout(() => setResendCooldown((c) => c - 1), 1000);
|
|
4269
4475
|
return () => clearTimeout(timer);
|
|
4270
4476
|
}, [resendCooldown]);
|
|
4271
|
-
const submitCode =
|
|
4477
|
+
const submitCode = useCallback12((code) => {
|
|
4272
4478
|
if (submittedRef.current || isSubmitting)
|
|
4273
4479
|
return;
|
|
4274
4480
|
submittedRef.current = true;
|
|
4275
4481
|
onSubmit(code);
|
|
4276
4482
|
}, [onSubmit, isSubmitting]);
|
|
4277
|
-
const handleDigitChange =
|
|
4483
|
+
const handleDigitChange = useCallback12((index2, value) => {
|
|
4278
4484
|
const digit = value.replace(/\D/g, "").slice(-1);
|
|
4279
4485
|
const newDigits = [...digits];
|
|
4280
4486
|
newDigits[index2] = digit;
|
|
@@ -4288,12 +4494,12 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
|
4288
4494
|
submitCode(code);
|
|
4289
4495
|
}
|
|
4290
4496
|
}, [digits, submitCode]);
|
|
4291
|
-
const handleKeyDown =
|
|
4497
|
+
const handleKeyDown = useCallback12((index2, e) => {
|
|
4292
4498
|
if (e.key === "Backspace" && !digits[index2] && index2 > 0) {
|
|
4293
4499
|
inputRefs.current[index2 - 1]?.focus();
|
|
4294
4500
|
}
|
|
4295
4501
|
}, [digits]);
|
|
4296
|
-
const handlePaste =
|
|
4502
|
+
const handlePaste = useCallback12((e) => {
|
|
4297
4503
|
e.preventDefault();
|
|
4298
4504
|
const pasted = e.clipboardData.getData("text").replace(/\D/g, "").slice(0, OTP_LENGTH);
|
|
4299
4505
|
if (pasted.length > 0) {
|
|
@@ -4403,17 +4609,17 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
|
4403
4609
|
}
|
|
4404
4610
|
|
|
4405
4611
|
// src/components/MessageList.tsx
|
|
4406
|
-
import { useLayoutEffect as useLayoutEffect3, useRef as useRef16 } from "react";
|
|
4612
|
+
import { useCallback as useCallback13, useLayoutEffect as useLayoutEffect3, useRef as useRef16, useState as useState16 } from "react";
|
|
4407
4613
|
|
|
4408
4614
|
// src/components/ChatInput.tsx
|
|
4409
|
-
import { useEffect as
|
|
4615
|
+
import { useEffect as useEffect20, useRef as useRef15, useState as useState15 } from "react";
|
|
4410
4616
|
import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
4411
4617
|
var MAX_INPUT_HEIGHT = 60;
|
|
4412
4618
|
function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
|
|
4413
|
-
const [inputText, setInputText] =
|
|
4619
|
+
const [inputText, setInputText] = useState15("");
|
|
4414
4620
|
const textareaRef = useRef15(null);
|
|
4415
4621
|
const canSend = inputText.trim().length > 0 && !isSendingChat;
|
|
4416
|
-
|
|
4622
|
+
useEffect20(() => {
|
|
4417
4623
|
if (autoFocus)
|
|
4418
4624
|
textareaRef.current?.focus();
|
|
4419
4625
|
}, [autoFocus]);
|
|
@@ -4511,34 +4717,110 @@ function ChatMessage({ message }) {
|
|
|
4511
4717
|
});
|
|
4512
4718
|
}
|
|
4513
4719
|
|
|
4514
|
-
// src/components/
|
|
4720
|
+
// src/components/PlanCard.tsx
|
|
4721
|
+
import { useEffect as useEffect21 } from "react";
|
|
4515
4722
|
import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
4516
|
-
|
|
4723
|
+
var APPROVE_MESSAGE = "Yes, go ahead.";
|
|
4724
|
+
var CANCEL_MESSAGE = "No, cancel that.";
|
|
4725
|
+
var COMPLETED_CARD_VISIBLE_MS = 2500;
|
|
4726
|
+
function StepIcon({ status }) {
|
|
4727
|
+
if (status === "done") {
|
|
4728
|
+
return /* @__PURE__ */ jsx13(CircleCheck, {
|
|
4729
|
+
className: "skippr:size-4 skippr:text-chart-3"
|
|
4730
|
+
});
|
|
4731
|
+
}
|
|
4732
|
+
if (status === "failed") {
|
|
4733
|
+
return /* @__PURE__ */ jsx13(CircleX, {
|
|
4734
|
+
className: "skippr:size-4 skippr:text-destructive"
|
|
4735
|
+
});
|
|
4736
|
+
}
|
|
4737
|
+
if (status === "active") {
|
|
4738
|
+
return /* @__PURE__ */ jsx13(Circle, {
|
|
4739
|
+
className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
|
|
4740
|
+
});
|
|
4741
|
+
}
|
|
4742
|
+
return /* @__PURE__ */ jsx13(Circle, {
|
|
4743
|
+
className: "skippr:size-4 skippr:text-muted-foreground/30"
|
|
4744
|
+
});
|
|
4745
|
+
}
|
|
4746
|
+
function PlanCard({ plan, sendChatMessage, onDismiss }) {
|
|
4747
|
+
const awaitingApproval = plan.state === "proposed";
|
|
4748
|
+
useEffect21(() => {
|
|
4749
|
+
if (plan.state !== "completed")
|
|
4750
|
+
return;
|
|
4751
|
+
const timer = setTimeout(onDismiss, COMPLETED_CARD_VISIBLE_MS);
|
|
4752
|
+
return () => clearTimeout(timer);
|
|
4753
|
+
}, [plan.state, onDismiss]);
|
|
4517
4754
|
return /* @__PURE__ */ jsxs11("div", {
|
|
4518
|
-
className: "skippr:
|
|
4755
|
+
className: "skippr:rounded-2xl skippr:rounded-tl-md skippr:bg-card skippr:p-3.5 skippr:ring-2 skippr:ring-brand",
|
|
4519
4756
|
children: [
|
|
4757
|
+
/* @__PURE__ */ jsx13("p", {
|
|
4758
|
+
className: "skippr:mb-3 skippr:text-sm skippr:font-semibold skippr:leading-snug skippr:text-foreground",
|
|
4759
|
+
children: "Plan"
|
|
4760
|
+
}),
|
|
4520
4761
|
/* @__PURE__ */ jsx13("div", {
|
|
4762
|
+
className: "skippr:space-y-2",
|
|
4763
|
+
children: plan.steps.map((step) => /* @__PURE__ */ jsxs11("div", {
|
|
4764
|
+
className: "skippr:flex skippr:items-center skippr:gap-2",
|
|
4765
|
+
children: [
|
|
4766
|
+
/* @__PURE__ */ jsx13(StepIcon, {
|
|
4767
|
+
status: step.status
|
|
4768
|
+
}),
|
|
4769
|
+
/* @__PURE__ */ jsx13("p", {
|
|
4770
|
+
className: cn("skippr:text-sm skippr:leading-snug", step.status === "done" && "skippr:text-muted-foreground skippr:line-through", step.status === "active" && "skippr:font-medium skippr:text-foreground", step.status === "pending" && "skippr:text-muted-foreground", step.status === "failed" && "skippr:text-destructive"),
|
|
4771
|
+
children: step.label
|
|
4772
|
+
})
|
|
4773
|
+
]
|
|
4774
|
+
}, step.index))
|
|
4775
|
+
}),
|
|
4776
|
+
awaitingApproval && /* @__PURE__ */ jsxs11("div", {
|
|
4777
|
+
className: "skippr:mt-3.5 skippr:flex skippr:gap-2",
|
|
4778
|
+
children: [
|
|
4779
|
+
/* @__PURE__ */ jsx13(Button, {
|
|
4780
|
+
className: "skippr:flex-1 skippr:py-2",
|
|
4781
|
+
onClick: () => sendChatMessage(APPROVE_MESSAGE),
|
|
4782
|
+
children: "Approve"
|
|
4783
|
+
}),
|
|
4784
|
+
/* @__PURE__ */ jsx13(Button, {
|
|
4785
|
+
variant: "outline",
|
|
4786
|
+
className: "skippr:flex-1 skippr:py-2",
|
|
4787
|
+
onClick: () => sendChatMessage(CANCEL_MESSAGE),
|
|
4788
|
+
children: "Cancel"
|
|
4789
|
+
})
|
|
4790
|
+
]
|
|
4791
|
+
})
|
|
4792
|
+
]
|
|
4793
|
+
});
|
|
4794
|
+
}
|
|
4795
|
+
|
|
4796
|
+
// src/components/TypingIndicator.tsx
|
|
4797
|
+
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
4798
|
+
function TypingIndicator() {
|
|
4799
|
+
return /* @__PURE__ */ jsxs12("div", {
|
|
4800
|
+
className: "skippr:flex skippr:items-start skippr:gap-2 skippr:animate-skippr-tab-fade",
|
|
4801
|
+
children: [
|
|
4802
|
+
/* @__PURE__ */ jsx14("div", {
|
|
4521
4803
|
className: "skippr:mt-0.5 skippr:flex skippr:size-7 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-md skippr:bg-primary",
|
|
4522
|
-
children: /* @__PURE__ */
|
|
4804
|
+
children: /* @__PURE__ */ jsx14(Sparkles, {
|
|
4523
4805
|
className: "skippr:size-3.5 skippr:text-primary-foreground"
|
|
4524
4806
|
})
|
|
4525
4807
|
}),
|
|
4526
|
-
/* @__PURE__ */
|
|
4808
|
+
/* @__PURE__ */ jsxs12("div", {
|
|
4527
4809
|
className: "skippr:inline-flex skippr:items-center skippr:gap-1 skippr:rounded-2xl skippr:border skippr:border-primary/20 skippr:bg-primary/10 skippr:px-4 skippr:py-2 skippr:text-xs skippr:text-primary",
|
|
4528
4810
|
children: [
|
|
4529
|
-
/* @__PURE__ */
|
|
4811
|
+
/* @__PURE__ */ jsx14("span", {
|
|
4530
4812
|
children: "Agent is analyzing your screen"
|
|
4531
4813
|
}),
|
|
4532
|
-
/* @__PURE__ */
|
|
4814
|
+
/* @__PURE__ */ jsxs12("span", {
|
|
4533
4815
|
className: "skippr:inline-flex skippr:items-center skippr:gap-[2px]",
|
|
4534
4816
|
children: [
|
|
4535
|
-
/* @__PURE__ */
|
|
4817
|
+
/* @__PURE__ */ jsx14("span", {
|
|
4536
4818
|
className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:0ms]"
|
|
4537
4819
|
}),
|
|
4538
|
-
/* @__PURE__ */
|
|
4820
|
+
/* @__PURE__ */ jsx14("span", {
|
|
4539
4821
|
className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:200ms]"
|
|
4540
4822
|
}),
|
|
4541
|
-
/* @__PURE__ */
|
|
4823
|
+
/* @__PURE__ */ jsx14("span", {
|
|
4542
4824
|
className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:400ms]"
|
|
4543
4825
|
})
|
|
4544
4826
|
]
|
|
@@ -4550,16 +4832,25 @@ function TypingIndicator() {
|
|
|
4550
4832
|
}
|
|
4551
4833
|
|
|
4552
4834
|
// src/components/MessageList.tsx
|
|
4553
|
-
import { jsx as
|
|
4835
|
+
import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
4836
|
+
function isPlanVisible(plan) {
|
|
4837
|
+
return !!plan && plan.steps.length > 0 && plan.state !== "abandoned";
|
|
4838
|
+
}
|
|
4554
4839
|
function MessageList({
|
|
4555
4840
|
messages,
|
|
4556
4841
|
isStreaming,
|
|
4557
4842
|
sendChatMessage,
|
|
4558
4843
|
isSendingChat,
|
|
4844
|
+
plan,
|
|
4559
4845
|
autoFocus = false
|
|
4560
4846
|
}) {
|
|
4561
4847
|
const containerRef = useRef16(null);
|
|
4562
4848
|
const lastMessage = messages.length > 0 ? messages[messages.length - 1] : undefined;
|
|
4849
|
+
const [dismissedPlanId, setDismissedPlanId] = useState16(null);
|
|
4850
|
+
const dismissPlan = useCallback13(() => {
|
|
4851
|
+
if (plan)
|
|
4852
|
+
setDismissedPlanId(plan.planId);
|
|
4853
|
+
}, [plan]);
|
|
4563
4854
|
useLayoutEffect3(() => {
|
|
4564
4855
|
const container = containerRef.current;
|
|
4565
4856
|
if (!container)
|
|
@@ -4569,23 +4860,31 @@ function MessageList({
|
|
|
4569
4860
|
container.scrollTop = container.scrollHeight;
|
|
4570
4861
|
}, [messages.length, lastMessage?.content]);
|
|
4571
4862
|
const showTyping = isStreaming && lastMessage?.role === "assistant" && lastMessage.content === "";
|
|
4572
|
-
return /* @__PURE__ */
|
|
4863
|
+
return /* @__PURE__ */ jsxs13("div", {
|
|
4573
4864
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
|
|
4574
4865
|
children: [
|
|
4575
|
-
/* @__PURE__ */
|
|
4866
|
+
/* @__PURE__ */ jsxs13("div", {
|
|
4576
4867
|
ref: containerRef,
|
|
4577
4868
|
className: "skippr:min-h-0 skippr:flex-1 skippr:space-y-4 skippr:overflow-y-auto skippr:p-4 skippr:[overflow-anchor:none]",
|
|
4578
4869
|
children: [
|
|
4579
|
-
messages.length === 0 && !showTyping && /* @__PURE__ */
|
|
4870
|
+
messages.length === 0 && !showTyping && /* @__PURE__ */ jsx15(LoadingDots, {
|
|
4580
4871
|
label: "Waiting for conversation to begin..."
|
|
4581
4872
|
}),
|
|
4582
|
-
messages.map((message) => /* @__PURE__ */
|
|
4873
|
+
messages.map((message) => /* @__PURE__ */ jsx15(ChatMessage, {
|
|
4583
4874
|
message
|
|
4584
4875
|
}, message.id)),
|
|
4585
|
-
showTyping && /* @__PURE__ */
|
|
4876
|
+
showTyping && /* @__PURE__ */ jsx15(TypingIndicator, {})
|
|
4586
4877
|
]
|
|
4587
4878
|
}),
|
|
4588
|
-
/* @__PURE__ */
|
|
4879
|
+
isPlanVisible(plan) && plan.planId !== dismissedPlanId && /* @__PURE__ */ jsx15("div", {
|
|
4880
|
+
className: "skippr:shrink-0 skippr:border-t skippr:border-border skippr:p-3",
|
|
4881
|
+
children: /* @__PURE__ */ jsx15(PlanCard, {
|
|
4882
|
+
plan,
|
|
4883
|
+
sendChatMessage,
|
|
4884
|
+
onDismiss: dismissPlan
|
|
4885
|
+
}, plan.planId)
|
|
4886
|
+
}),
|
|
4887
|
+
/* @__PURE__ */ jsx15(ChatInput, {
|
|
4589
4888
|
sendChatMessage,
|
|
4590
4889
|
isSendingChat,
|
|
4591
4890
|
autoFocus
|
|
@@ -4595,49 +4894,49 @@ function MessageList({
|
|
|
4595
4894
|
}
|
|
4596
4895
|
|
|
4597
4896
|
// src/components/SessionAgenda.tsx
|
|
4598
|
-
import { jsx as
|
|
4897
|
+
import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
4599
4898
|
function SessionAgenda({ phases, hasStarted }) {
|
|
4600
4899
|
if (phases.length === 0 || !hasStarted) {
|
|
4601
|
-
return /* @__PURE__ */
|
|
4900
|
+
return /* @__PURE__ */ jsx16("div", {
|
|
4602
4901
|
className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
|
|
4603
|
-
children: /* @__PURE__ */
|
|
4902
|
+
children: /* @__PURE__ */ jsx16(LoadingDots, {
|
|
4604
4903
|
label: "Waiting for agenda to load..."
|
|
4605
4904
|
})
|
|
4606
4905
|
});
|
|
4607
4906
|
}
|
|
4608
|
-
return /* @__PURE__ */
|
|
4907
|
+
return /* @__PURE__ */ jsx16("div", {
|
|
4609
4908
|
className: "skippr:flex-1 skippr:overflow-y-auto skippr:px-4 skippr:py-4",
|
|
4610
|
-
children: /* @__PURE__ */
|
|
4909
|
+
children: /* @__PURE__ */ jsx16("div", {
|
|
4611
4910
|
className: "skippr:space-y-1",
|
|
4612
4911
|
children: phases.map((phase) => {
|
|
4613
4912
|
const isActive = phase.status === "active";
|
|
4614
4913
|
const isCompleted = phase.status === "completed";
|
|
4615
|
-
return /* @__PURE__ */
|
|
4914
|
+
return /* @__PURE__ */ jsxs14("div", {
|
|
4616
4915
|
className: cn("skippr:flex skippr:items-start skippr:gap-2.5 skippr:rounded-lg skippr:p-2 skippr:transition-colors", isActive && "skippr:bg-primary/10"),
|
|
4617
4916
|
children: [
|
|
4618
|
-
/* @__PURE__ */
|
|
4917
|
+
/* @__PURE__ */ jsx16("div", {
|
|
4619
4918
|
className: "skippr:mt-0.5",
|
|
4620
|
-
children: isCompleted ? /* @__PURE__ */
|
|
4919
|
+
children: isCompleted ? /* @__PURE__ */ jsx16(CircleCheck, {
|
|
4621
4920
|
className: "skippr:size-4 skippr:text-chart-3"
|
|
4622
|
-
}) : isActive ? /* @__PURE__ */
|
|
4921
|
+
}) : isActive ? /* @__PURE__ */ jsx16(Circle, {
|
|
4623
4922
|
className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
|
|
4624
|
-
}) : /* @__PURE__ */
|
|
4923
|
+
}) : /* @__PURE__ */ jsx16(Circle, {
|
|
4625
4924
|
className: "skippr:size-4 skippr:text-muted-foreground/30"
|
|
4626
4925
|
})
|
|
4627
4926
|
}),
|
|
4628
|
-
/* @__PURE__ */
|
|
4927
|
+
/* @__PURE__ */ jsxs14("div", {
|
|
4629
4928
|
className: "skippr:min-w-0 skippr:flex-1",
|
|
4630
4929
|
children: [
|
|
4631
|
-
/* @__PURE__ */
|
|
4930
|
+
/* @__PURE__ */ jsx16("p", {
|
|
4632
4931
|
className: cn("skippr:text-sm", isCompleted && "skippr:text-muted-foreground skippr:line-through", isActive && "skippr:font-medium skippr:text-foreground", phase.status === "pending" && "skippr:text-muted-foreground"),
|
|
4633
4932
|
children: phase.name
|
|
4634
4933
|
}),
|
|
4635
|
-
phase.highlights.length > 0 && /* @__PURE__ */
|
|
4934
|
+
phase.highlights.length > 0 && /* @__PURE__ */ jsx16("ul", {
|
|
4636
4935
|
className: "skippr:mt-1 skippr:space-y-0.5",
|
|
4637
|
-
children: phase.highlights.map((text) => /* @__PURE__ */
|
|
4936
|
+
children: phase.highlights.map((text) => /* @__PURE__ */ jsxs14("li", {
|
|
4638
4937
|
className: cn("skippr:flex skippr:items-center skippr:gap-1.5 skippr:text-[11px] skippr:leading-tight", isCompleted ? "skippr:text-muted-foreground/40 skippr:line-through" : "skippr:text-muted-foreground/70"),
|
|
4639
4938
|
children: [
|
|
4640
|
-
/* @__PURE__ */
|
|
4939
|
+
/* @__PURE__ */ jsx16("span", {
|
|
4641
4940
|
className: "skippr:size-1 skippr:shrink-0 skippr:rounded-full skippr:bg-current"
|
|
4642
4941
|
}),
|
|
4643
4942
|
text
|
|
@@ -4654,12 +4953,12 @@ function SessionAgenda({ phases, hasStarted }) {
|
|
|
4654
4953
|
}
|
|
4655
4954
|
|
|
4656
4955
|
// src/components/SessionWarningBanner.tsx
|
|
4657
|
-
import { jsx as
|
|
4956
|
+
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
4658
4957
|
var SESSION_WARNING_THRESHOLD_SECS = 60;
|
|
4659
4958
|
function SessionWarningBanner({ remaining }) {
|
|
4660
4959
|
if (remaining === null || remaining <= 0 || remaining > SESSION_WARNING_THRESHOLD_SECS)
|
|
4661
4960
|
return null;
|
|
4662
|
-
return /* @__PURE__ */
|
|
4961
|
+
return /* @__PURE__ */ jsx17("div", {
|
|
4663
4962
|
"data-testid": "session-warning-banner",
|
|
4664
4963
|
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",
|
|
4665
4964
|
children: "Session ending soon"
|
|
@@ -4667,7 +4966,7 @@ function SessionWarningBanner({ remaining }) {
|
|
|
4667
4966
|
}
|
|
4668
4967
|
|
|
4669
4968
|
// src/components/StartSessionPrompt.tsx
|
|
4670
|
-
import { jsx as
|
|
4969
|
+
import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
4671
4970
|
var PROMPT_BUTTON = "skippr:cursor-pointer skippr:rounded-xl skippr:bg-primary skippr:px-8 skippr:py-3 skippr:text-sm skippr:font-medium skippr:text-primary-foreground skippr:transition-all skippr:hover:bg-primary/90 skippr:disabled:cursor-not-allowed skippr:disabled:opacity-60";
|
|
4672
4971
|
function StartSessionPrompt({
|
|
4673
4972
|
onStartSession,
|
|
@@ -4679,16 +4978,16 @@ function StartSessionPrompt({
|
|
|
4679
4978
|
canResume = false,
|
|
4680
4979
|
onResume
|
|
4681
4980
|
}) {
|
|
4682
|
-
return /* @__PURE__ */
|
|
4981
|
+
return /* @__PURE__ */ jsxs15("div", {
|
|
4683
4982
|
className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:px-4",
|
|
4684
4983
|
children: [
|
|
4685
|
-
canResume && onResume ? /* @__PURE__ */
|
|
4984
|
+
canResume && onResume ? /* @__PURE__ */ jsx18("button", {
|
|
4686
4985
|
type: "button",
|
|
4687
4986
|
onClick: onResume,
|
|
4688
4987
|
disabled: isStarting,
|
|
4689
4988
|
className: PROMPT_BUTTON,
|
|
4690
4989
|
children: isStarting ? "Resuming..." : "Resume session"
|
|
4691
|
-
}) : /* @__PURE__ */
|
|
4990
|
+
}) : /* @__PURE__ */ jsx18("button", {
|
|
4692
4991
|
type: "button",
|
|
4693
4992
|
onClick: () => {
|
|
4694
4993
|
if (!agentId)
|
|
@@ -4699,7 +4998,7 @@ function StartSessionPrompt({
|
|
|
4699
4998
|
className: PROMPT_BUTTON,
|
|
4700
4999
|
children: isStarting ? "Starting..." : label
|
|
4701
5000
|
}),
|
|
4702
|
-
error && /* @__PURE__ */
|
|
5001
|
+
error && /* @__PURE__ */ jsx18("p", {
|
|
4703
5002
|
className: "skippr:text-xs skippr:text-destructive",
|
|
4704
5003
|
children: error
|
|
4705
5004
|
})
|
|
@@ -4708,7 +5007,7 @@ function StartSessionPrompt({
|
|
|
4708
5007
|
}
|
|
4709
5008
|
|
|
4710
5009
|
// src/components/Sidebar.tsx
|
|
4711
|
-
import { jsx as
|
|
5010
|
+
import { jsx as jsx19, jsxs as jsxs16, Fragment as Fragment2 } from "react/jsx-runtime";
|
|
4712
5011
|
var PANEL_GAP_PX = 12;
|
|
4713
5012
|
var PANEL_VIEWPORT_MARGIN_PX = 24;
|
|
4714
5013
|
var PANEL_MAX_HEIGHT_PX = 460;
|
|
@@ -4762,7 +5061,7 @@ function Sidebar({
|
|
|
4762
5061
|
height: panelExpanded ? availableHeight : `min(${PANEL_MAX_HEIGHT_PX}px, ${availableHeight})`
|
|
4763
5062
|
};
|
|
4764
5063
|
}
|
|
4765
|
-
|
|
5064
|
+
useEffect22(() => {
|
|
4766
5065
|
if (!isSidebar)
|
|
4767
5066
|
return;
|
|
4768
5067
|
const prop = position === "right" ? "marginRight" : "marginLeft";
|
|
@@ -4776,13 +5075,13 @@ function Sidebar({
|
|
|
4776
5075
|
document.body.style.transition = "";
|
|
4777
5076
|
};
|
|
4778
5077
|
}, [isSidebar, isPanelOpen, position]);
|
|
4779
|
-
return /* @__PURE__ */
|
|
5078
|
+
return /* @__PURE__ */ jsxs16("div", {
|
|
4780
5079
|
ref: internalCtx?.panelRef,
|
|
4781
5080
|
className: cn("skippr:fixed skippr:z-[9999]", "skippr:bg-card", "skippr:flex skippr:flex-col", "skippr:overflow-hidden", isFloating && "skippr:border skippr:border-border skippr:rounded-2xl skippr:shadow-[0_8px_30px_rgba(0,0,0,0.16),0_4px_12px_rgba(0,0,0,0.08)]", isFloating && (position === "right" ? "skippr:right-6" : "skippr:left-6"), isFloating && "skippr:transition-[opacity,transform,height] skippr:duration-300 skippr:ease-in-out", isFloating && (popsDown ? position === "right" ? "skippr:origin-top-right" : "skippr:origin-top-left" : 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"),
|
|
4782
5081
|
style: { width: isPanelOpen ? SIDEBAR_WIDTH : undefined, ...floatingStyle },
|
|
4783
5082
|
children: [
|
|
4784
|
-
!hideHeader && /* @__PURE__ */
|
|
4785
|
-
authFailed ? /* @__PURE__ */
|
|
5083
|
+
!hideHeader && /* @__PURE__ */ jsx19(ChatHeader, {}),
|
|
5084
|
+
authFailed ? /* @__PURE__ */ jsx19(AuthError, {}) : isAuthenticated ? /* @__PURE__ */ jsx19(AuthenticatedContent, {
|
|
4786
5085
|
isConnected,
|
|
4787
5086
|
isPaused,
|
|
4788
5087
|
isPausing,
|
|
@@ -4800,12 +5099,12 @@ function Sidebar({
|
|
|
4800
5099
|
agentId,
|
|
4801
5100
|
agentControls,
|
|
4802
5101
|
showAgenda
|
|
4803
|
-
}) : usesHostAuth || isValidating ? /* @__PURE__ */
|
|
5102
|
+
}) : usesHostAuth || isValidating ? /* @__PURE__ */ jsx19("div", {
|
|
4804
5103
|
className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
|
|
4805
|
-
children: /* @__PURE__ */
|
|
5104
|
+
children: /* @__PURE__ */ jsx19(LoadingDots, {
|
|
4806
5105
|
label: "Loading..."
|
|
4807
5106
|
})
|
|
4808
|
-
}) : /* @__PURE__ */
|
|
5107
|
+
}) : /* @__PURE__ */ jsx19(LoginFlow, {
|
|
4809
5108
|
requestOtp,
|
|
4810
5109
|
verifyOtp,
|
|
4811
5110
|
error: authError,
|
|
@@ -4843,63 +5142,63 @@ function AuthenticatedContent({
|
|
|
4843
5142
|
} else if (isPaused) {
|
|
4844
5143
|
transitionLabel = "Paused";
|
|
4845
5144
|
}
|
|
4846
|
-
return /* @__PURE__ */
|
|
5145
|
+
return /* @__PURE__ */ jsxs16(Fragment2, {
|
|
4847
5146
|
children: [
|
|
4848
|
-
isConnected && /* @__PURE__ */
|
|
4849
|
-
/* @__PURE__ */
|
|
5147
|
+
isConnected && /* @__PURE__ */ jsx19(ConnectedBanner, {}),
|
|
5148
|
+
/* @__PURE__ */ jsxs16("div", {
|
|
4850
5149
|
className: "skippr:flex skippr:items-center skippr:gap-2 skippr:border-b skippr:border-border skippr:px-3 skippr:py-1",
|
|
4851
5150
|
children: [
|
|
4852
|
-
/* @__PURE__ */
|
|
5151
|
+
/* @__PURE__ */ jsxs16("button", {
|
|
4853
5152
|
type: "button",
|
|
4854
5153
|
className: cn("skippr:relative skippr:inline-flex skippr:cursor-pointer skippr:items-center skippr:gap-1.5 skippr:rounded-lg skippr:px-3 skippr:py-1.5 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "chat" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
|
|
4855
5154
|
onClick: () => onTabChange("chat"),
|
|
4856
5155
|
children: [
|
|
4857
|
-
/* @__PURE__ */
|
|
5156
|
+
/* @__PURE__ */ jsx19(MessageCircle, {
|
|
4858
5157
|
className: "skippr:size-3.5"
|
|
4859
5158
|
}),
|
|
4860
5159
|
"Chat",
|
|
4861
|
-
activeTab === "chat" && /* @__PURE__ */
|
|
5160
|
+
activeTab === "chat" && /* @__PURE__ */ jsx19("span", {
|
|
4862
5161
|
className: "skippr:absolute skippr:-bottom-1 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
|
|
4863
5162
|
})
|
|
4864
5163
|
]
|
|
4865
5164
|
}),
|
|
4866
|
-
showAgenda && /* @__PURE__ */
|
|
5165
|
+
showAgenda && /* @__PURE__ */ jsxs16("button", {
|
|
4867
5166
|
type: "button",
|
|
4868
5167
|
className: cn("skippr:relative skippr:inline-flex skippr:cursor-pointer skippr:items-center skippr:gap-1.5 skippr:rounded-lg skippr:px-3 skippr:py-1.5 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "agenda" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
|
|
4869
5168
|
onClick: () => onTabChange("agenda"),
|
|
4870
5169
|
children: [
|
|
4871
|
-
/* @__PURE__ */
|
|
5170
|
+
/* @__PURE__ */ jsx19(Calendar, {
|
|
4872
5171
|
className: "skippr:size-3.5"
|
|
4873
5172
|
}),
|
|
4874
5173
|
"Agenda",
|
|
4875
|
-
activeTab === "agenda" && /* @__PURE__ */
|
|
5174
|
+
activeTab === "agenda" && /* @__PURE__ */ jsx19("span", {
|
|
4876
5175
|
className: "skippr:absolute skippr:-bottom-1 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
|
|
4877
5176
|
})
|
|
4878
5177
|
]
|
|
4879
5178
|
})
|
|
4880
5179
|
]
|
|
4881
5180
|
}),
|
|
4882
|
-
/* @__PURE__ */
|
|
5181
|
+
/* @__PURE__ */ jsx19("div", {
|
|
4883
5182
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
|
|
4884
|
-
children: isDisconnecting ? /* @__PURE__ */
|
|
5183
|
+
children: isDisconnecting ? /* @__PURE__ */ jsx19("div", {
|
|
4885
5184
|
className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
|
|
4886
|
-
children: /* @__PURE__ */
|
|
5185
|
+
children: /* @__PURE__ */ jsx19(LoadingDots, {
|
|
4887
5186
|
label: "Ending session..."
|
|
4888
5187
|
})
|
|
4889
|
-
}) : inSession ? /* @__PURE__ */
|
|
5188
|
+
}) : inSession ? /* @__PURE__ */ jsxs16(Fragment2, {
|
|
4890
5189
|
children: [
|
|
4891
|
-
transitionLabel && /* @__PURE__ */
|
|
5190
|
+
transitionLabel && /* @__PURE__ */ jsx19("div", {
|
|
4892
5191
|
className: "skippr:shrink-0 skippr:border-b skippr:border-border skippr:bg-muted/50 skippr:px-3 skippr:py-1.5 skippr:text-center skippr:text-xs skippr:text-muted-foreground",
|
|
4893
5192
|
children: transitionLabel
|
|
4894
5193
|
}),
|
|
4895
|
-
/* @__PURE__ */
|
|
5194
|
+
/* @__PURE__ */ jsx19(ConnectedBody, {
|
|
4896
5195
|
activeTab: effectiveTab,
|
|
4897
5196
|
autoFocusChat
|
|
4898
5197
|
})
|
|
4899
5198
|
]
|
|
4900
|
-
}) : /* @__PURE__ */
|
|
5199
|
+
}) : /* @__PURE__ */ jsx19("div", {
|
|
4901
5200
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
|
|
4902
|
-
children: /* @__PURE__ */
|
|
5201
|
+
children: /* @__PURE__ */ jsx19(StartSessionPrompt, {
|
|
4903
5202
|
onStartSession,
|
|
4904
5203
|
agentId,
|
|
4905
5204
|
agentControls,
|
|
@@ -4911,11 +5210,11 @@ function AuthenticatedContent({
|
|
|
4911
5210
|
})
|
|
4912
5211
|
}, `${activeTab}-empty`)
|
|
4913
5212
|
}),
|
|
4914
|
-
!hideControls && /* @__PURE__ */
|
|
5213
|
+
!hideControls && /* @__PURE__ */ jsxs16("div", {
|
|
4915
5214
|
className: "skippr:shrink-0 skippr:border-t skippr:border-border",
|
|
4916
5215
|
children: [
|
|
4917
|
-
isConnected && !isDisconnecting && /* @__PURE__ */
|
|
4918
|
-
/* @__PURE__ */
|
|
5216
|
+
isConnected && !isDisconnecting && /* @__PURE__ */ jsx19(ModeToggleRow, {}),
|
|
5217
|
+
/* @__PURE__ */ jsx19("div", {
|
|
4919
5218
|
className: "skippr:px-4 skippr:pt-1.5 skippr:pb-2 skippr:text-center skippr:text-[10px] skippr:text-muted-foreground",
|
|
4920
5219
|
children: "Powered by Skippr"
|
|
4921
5220
|
})
|
|
@@ -4926,23 +5225,23 @@ function AuthenticatedContent({
|
|
|
4926
5225
|
}
|
|
4927
5226
|
function ModeToggleRow() {
|
|
4928
5227
|
const { textMode, toggleTextMode } = useTextMode();
|
|
4929
|
-
return /* @__PURE__ */
|
|
5228
|
+
return /* @__PURE__ */ jsx19("div", {
|
|
4930
5229
|
className: "skippr:flex skippr:justify-center skippr:px-3 skippr:pt-2 skippr:pb-0",
|
|
4931
|
-
children: /* @__PURE__ */
|
|
5230
|
+
children: /* @__PURE__ */ jsx19("button", {
|
|
4932
5231
|
type: "button",
|
|
4933
5232
|
"aria-label": textMode ? "Switch to voice mode" : "Switch to text mode",
|
|
4934
5233
|
className: "skippr:flex skippr:cursor-pointer skippr:items-center skippr:gap-2 skippr:rounded-xl skippr:bg-muted skippr:px-4 skippr:py-1.5 skippr:text-sm skippr:font-medium skippr:text-foreground skippr:transition-colors skippr:hover:bg-muted/70",
|
|
4935
5234
|
onClick: () => void toggleTextMode(),
|
|
4936
|
-
children: textMode ? /* @__PURE__ */
|
|
5235
|
+
children: textMode ? /* @__PURE__ */ jsxs16(Fragment2, {
|
|
4937
5236
|
children: [
|
|
4938
|
-
/* @__PURE__ */
|
|
5237
|
+
/* @__PURE__ */ jsx19(Mic, {
|
|
4939
5238
|
className: "skippr:size-4"
|
|
4940
5239
|
}),
|
|
4941
5240
|
"Voice mode"
|
|
4942
5241
|
]
|
|
4943
|
-
}) : /* @__PURE__ */
|
|
5242
|
+
}) : /* @__PURE__ */ jsxs16(Fragment2, {
|
|
4944
5243
|
children: [
|
|
4945
|
-
/* @__PURE__ */
|
|
5244
|
+
/* @__PURE__ */ jsx19(MessageSquare, {
|
|
4946
5245
|
className: "skippr:size-4"
|
|
4947
5246
|
}),
|
|
4948
5247
|
"Text mode"
|
|
@@ -4952,17 +5251,17 @@ function ModeToggleRow() {
|
|
|
4952
5251
|
});
|
|
4953
5252
|
}
|
|
4954
5253
|
function AuthError() {
|
|
4955
|
-
return /* @__PURE__ */
|
|
5254
|
+
return /* @__PURE__ */ jsxs16("div", {
|
|
4956
5255
|
className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:px-6 skippr:py-4 skippr:text-center",
|
|
4957
5256
|
children: [
|
|
4958
|
-
/* @__PURE__ */
|
|
5257
|
+
/* @__PURE__ */ jsx19(CircleAlert, {
|
|
4959
5258
|
className: "skippr:mb-3 skippr:size-7 skippr:text-destructive"
|
|
4960
5259
|
}),
|
|
4961
|
-
/* @__PURE__ */
|
|
5260
|
+
/* @__PURE__ */ jsx19("p", {
|
|
4962
5261
|
className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
|
|
4963
5262
|
children: "We couldn't verify your session"
|
|
4964
5263
|
}),
|
|
4965
|
-
/* @__PURE__ */
|
|
5264
|
+
/* @__PURE__ */ jsx19("p", {
|
|
4966
5265
|
className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
|
|
4967
5266
|
children: "Please contact administrator."
|
|
4968
5267
|
})
|
|
@@ -4971,7 +5270,7 @@ function AuthError() {
|
|
|
4971
5270
|
}
|
|
4972
5271
|
function ConnectedBanner() {
|
|
4973
5272
|
const remaining = useSessionRemaining();
|
|
4974
|
-
return /* @__PURE__ */
|
|
5273
|
+
return /* @__PURE__ */ jsx19(SessionWarningBanner, {
|
|
4975
5274
|
remaining
|
|
4976
5275
|
});
|
|
4977
5276
|
}
|
|
@@ -4981,22 +5280,25 @@ function ConnectedBody({
|
|
|
4981
5280
|
}) {
|
|
4982
5281
|
const { allMessages, agentState, sendChatMessage, isSendingChat } = useCombinedMessages();
|
|
4983
5282
|
const { phases } = usePhaseUpdates();
|
|
5283
|
+
const plan = usePlanUpdates();
|
|
5284
|
+
const { agentControls } = useLiveAgent();
|
|
4984
5285
|
if (activeTab === "agenda") {
|
|
4985
|
-
return /* @__PURE__ */
|
|
5286
|
+
return /* @__PURE__ */ jsx19("div", {
|
|
4986
5287
|
className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto skippr:animate-skippr-tab-fade",
|
|
4987
|
-
children: /* @__PURE__ */
|
|
5288
|
+
children: /* @__PURE__ */ jsx19(SessionAgenda, {
|
|
4988
5289
|
phases,
|
|
4989
5290
|
hasStarted: allMessages.length > 0 || agentState === "speaking"
|
|
4990
5291
|
})
|
|
4991
5292
|
}, "agenda");
|
|
4992
5293
|
}
|
|
4993
|
-
return /* @__PURE__ */
|
|
5294
|
+
return /* @__PURE__ */ jsx19("div", {
|
|
4994
5295
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
|
|
4995
|
-
children: /* @__PURE__ */
|
|
5296
|
+
children: /* @__PURE__ */ jsx19(MessageList, {
|
|
4996
5297
|
messages: allMessages,
|
|
4997
5298
|
isStreaming: agentState === "speaking",
|
|
4998
5299
|
sendChatMessage,
|
|
4999
5300
|
isSendingChat,
|
|
5301
|
+
plan: agentControls?.actions ? plan : null,
|
|
5000
5302
|
autoFocus: autoFocusChat
|
|
5001
5303
|
})
|
|
5002
5304
|
}, "chat");
|
|
@@ -5006,9 +5308,9 @@ function ConnectedBody({
|
|
|
5006
5308
|
import { useContext as useContext11 } from "react";
|
|
5007
5309
|
|
|
5008
5310
|
// src/components/Logo.tsx
|
|
5009
|
-
import { jsx as
|
|
5311
|
+
import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
5010
5312
|
function Logo({ className }) {
|
|
5011
|
-
return /* @__PURE__ */
|
|
5313
|
+
return /* @__PURE__ */ jsxs17("svg", {
|
|
5012
5314
|
width: "1em",
|
|
5013
5315
|
height: "1em",
|
|
5014
5316
|
viewBox: "0 0 200 200",
|
|
@@ -5018,20 +5320,20 @@ function Logo({ className }) {
|
|
|
5018
5320
|
"aria-label": "Skippr",
|
|
5019
5321
|
className,
|
|
5020
5322
|
children: [
|
|
5021
|
-
/* @__PURE__ */
|
|
5323
|
+
/* @__PURE__ */ jsx20("rect", {
|
|
5022
5324
|
width: "200",
|
|
5023
5325
|
height: "200",
|
|
5024
5326
|
rx: "40",
|
|
5025
5327
|
fill: "#2D2D3F"
|
|
5026
5328
|
}),
|
|
5027
|
-
/* @__PURE__ */
|
|
5329
|
+
/* @__PURE__ */ jsxs17("g", {
|
|
5028
5330
|
transform: "translate(100 100) scale(0.8) translate(-100 -100)",
|
|
5029
5331
|
children: [
|
|
5030
|
-
/* @__PURE__ */
|
|
5332
|
+
/* @__PURE__ */ jsx20("path", {
|
|
5031
5333
|
d: "M144.497 59C149.193 59 153 62.8071 153 67.5033V116.397C153 118.034 152.536 119.562 151.735 120.859L114.894 92.4811L114.894 92.4804C105.42 85.1648 91.2971 91.7058 91.297 104.015V124.901H54.5033C49.8071 124.901 46 121.094 46 116.397V67.5033C46 62.8071 49.8071 59 54.5033 59H144.497ZM101.272 104.015C101.272 100.172 105.736 98.0111 108.798 100.375L140.637 124.901H101.272V104.015Z",
|
|
5032
5334
|
fill: "white"
|
|
5033
5335
|
}),
|
|
5034
|
-
/* @__PURE__ */
|
|
5336
|
+
/* @__PURE__ */ jsx20("path", {
|
|
5035
5337
|
d: "M108.798 99.8856C105.736 97.5211 101.271 99.6824 101.271 103.525V155.892C101.271 160.27 106.852 162.191 109.594 158.755L122.619 142.437C123.1 141.836 123.712 141.35 124.409 141.016C125.106 140.683 125.871 140.51 126.645 140.51H147.946C152.386 140.51 154.316 134.944 150.81 132.247L108.798 99.8856Z",
|
|
5036
5338
|
className: "skippr:fill-brand"
|
|
5037
5339
|
})
|
|
@@ -5042,7 +5344,7 @@ function Logo({ className }) {
|
|
|
5042
5344
|
}
|
|
5043
5345
|
|
|
5044
5346
|
// src/components/SidebarTrigger.tsx
|
|
5045
|
-
import { jsx as
|
|
5347
|
+
import { jsx as jsx21 } from "react/jsx-runtime";
|
|
5046
5348
|
function SidebarTrigger() {
|
|
5047
5349
|
const {
|
|
5048
5350
|
isPanelOpen,
|
|
@@ -5061,29 +5363,41 @@ function SidebarTrigger() {
|
|
|
5061
5363
|
if (isMinimized || isConnected || isStarting || isPausing)
|
|
5062
5364
|
return null;
|
|
5063
5365
|
const handleClick = isPanelOpen && minimizable ? minimizePanel : togglePanel;
|
|
5064
|
-
return /* @__PURE__ */
|
|
5366
|
+
return /* @__PURE__ */ jsx21("button", {
|
|
5065
5367
|
type: "button",
|
|
5066
5368
|
onClick: handleClick,
|
|
5067
5369
|
title: isPanelOpen ? "Close chat" : "Open chat",
|
|
5068
5370
|
"aria-label": isPanelOpen ? "Close chat" : "Open chat",
|
|
5069
5371
|
style: { bottom: triggerBottomPx(launcherBottomPx, popsDown) },
|
|
5070
5372
|
className: cn("skippr:fixed skippr:z-[9998]", "skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)] skippr:transition-all", "skippr:cursor-pointer skippr:hover:brightness-110 skippr:hover:-translate-y-0.5 skippr:active:translate-y-0", isPanelOpen ? "skippr:rounded-[14px] skippr:bg-bubble skippr:text-white" : "skippr:rounded-[10px] skippr:overflow-hidden", position === "right" ? "skippr:right-6" : "skippr:left-6"),
|
|
5071
|
-
children: isPanelOpen ? /* @__PURE__ */
|
|
5373
|
+
children: isPanelOpen ? /* @__PURE__ */ jsx21(ChevronDown, {
|
|
5072
5374
|
className: "skippr:size-5"
|
|
5073
|
-
}) : /* @__PURE__ */
|
|
5375
|
+
}) : /* @__PURE__ */ jsx21(Logo, {
|
|
5074
5376
|
className: "skippr:size-12"
|
|
5075
5377
|
})
|
|
5076
5378
|
});
|
|
5077
5379
|
}
|
|
5078
5380
|
|
|
5079
5381
|
// src/components/LiveAgent.tsx
|
|
5080
|
-
import { jsx as
|
|
5382
|
+
import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
5081
5383
|
function AgentCursorMount({ animated }) {
|
|
5082
|
-
return /* @__PURE__ */
|
|
5384
|
+
return /* @__PURE__ */ jsx22(AgentCursor, {
|
|
5083
5385
|
target: useAgentCursor(),
|
|
5084
5386
|
animated
|
|
5085
5387
|
});
|
|
5086
5388
|
}
|
|
5389
|
+
function PlanPanelOpener() {
|
|
5390
|
+
const plan = usePlanUpdates();
|
|
5391
|
+
const { expandPanel } = useLiveAgent();
|
|
5392
|
+
const surfacedPlanIdRef = useRef17(null);
|
|
5393
|
+
useEffect23(() => {
|
|
5394
|
+
if (plan?.state !== "proposed" || surfacedPlanIdRef.current === plan.planId)
|
|
5395
|
+
return;
|
|
5396
|
+
surfacedPlanIdRef.current = plan.planId;
|
|
5397
|
+
expandPanel();
|
|
5398
|
+
}, [plan?.planId, plan?.state, expandPanel]);
|
|
5399
|
+
return null;
|
|
5400
|
+
}
|
|
5087
5401
|
function LiveAgent(props) {
|
|
5088
5402
|
const {
|
|
5089
5403
|
agentId: hostAgentId,
|
|
@@ -5116,20 +5430,20 @@ function LiveAgent(props) {
|
|
|
5116
5430
|
const usesHostAuth = !!getUserToken || !!userToken || !!authTokenProp;
|
|
5117
5431
|
const effectiveAuthToken = usesHostAuth ? authTokenProp : auth.authToken ?? undefined;
|
|
5118
5432
|
const hasModuleSelector = !hostAgentId;
|
|
5119
|
-
const [activeModule, setActiveModule] =
|
|
5433
|
+
const [activeModule, setActiveModule] = useState17(null);
|
|
5120
5434
|
const agentId = hasModuleSelector ? activeModule?.id ?? null : hostAgentId;
|
|
5121
5435
|
const agentControls = hasModuleSelector ? activeModule?.controls : hostAgentControls;
|
|
5122
|
-
const minimizeOnSessionStart =
|
|
5436
|
+
const minimizeOnSessionStart = useCallback14(() => {
|
|
5123
5437
|
if (minimizable) {
|
|
5124
5438
|
setIsMinimized(true);
|
|
5125
5439
|
setIsPanelOpen(false);
|
|
5126
5440
|
}
|
|
5127
5441
|
}, [minimizable]);
|
|
5128
|
-
const expandOnSessionStartError =
|
|
5442
|
+
const expandOnSessionStartError = useCallback14(() => {
|
|
5129
5443
|
setIsMinimized(false);
|
|
5130
5444
|
setIsPanelOpen(true);
|
|
5131
5445
|
}, []);
|
|
5132
|
-
const minimizeOnSessionDisconnect =
|
|
5446
|
+
const minimizeOnSessionDisconnect = useCallback14(() => {
|
|
5133
5447
|
if (hasModuleSelector) {
|
|
5134
5448
|
setActiveModule(null);
|
|
5135
5449
|
}
|
|
@@ -5167,27 +5481,27 @@ function LiveAgent(props) {
|
|
|
5167
5481
|
});
|
|
5168
5482
|
const teardownInFlightRef = useRef17(false);
|
|
5169
5483
|
teardownInFlightRef.current = isPaused || isPausing || isDisconnecting;
|
|
5170
|
-
const handleRoomDisconnected =
|
|
5484
|
+
const handleRoomDisconnected = useCallback14(() => {
|
|
5171
5485
|
if (teardownInFlightRef.current)
|
|
5172
5486
|
return;
|
|
5173
5487
|
disconnect();
|
|
5174
5488
|
}, [disconnect]);
|
|
5175
5489
|
const isSessionLive = connection !== null || isStarting || isPausing || isDisconnecting;
|
|
5176
|
-
const [isPanelOpen, setIsPanelOpen] =
|
|
5177
|
-
const [isMinimized, setIsMinimized] =
|
|
5178
|
-
const [sidebarTab, setSidebarTab] =
|
|
5179
|
-
const [phasesSnapshot, setPhasesSnapshot] =
|
|
5180
|
-
const [textMode, setTextMode] =
|
|
5181
|
-
const [panelExpanded, setPanelExpanded] =
|
|
5182
|
-
const togglePanelExpanded =
|
|
5490
|
+
const [isPanelOpen, setIsPanelOpen] = useState17(defaultOpen);
|
|
5491
|
+
const [isMinimized, setIsMinimized] = useState17(minimizable && !defaultOpen);
|
|
5492
|
+
const [sidebarTab, setSidebarTab] = useState17("agenda");
|
|
5493
|
+
const [phasesSnapshot, setPhasesSnapshot] = useState17([]);
|
|
5494
|
+
const [textMode, setTextMode] = useState17(false);
|
|
5495
|
+
const [panelExpanded, setPanelExpanded] = useState17(false);
|
|
5496
|
+
const togglePanelExpanded = useCallback14(() => setPanelExpanded((prev) => !prev), []);
|
|
5183
5497
|
const panelRef = useRef17(null);
|
|
5184
|
-
const setTextModeState =
|
|
5498
|
+
const setTextModeState = useCallback14((enabled) => {
|
|
5185
5499
|
setTextMode(enabled);
|
|
5186
5500
|
setPanelExpanded(enabled);
|
|
5187
5501
|
}, []);
|
|
5188
5502
|
const isConnected = connection !== null;
|
|
5189
5503
|
const showControlBar = isConnected || isStarting || isPausing;
|
|
5190
|
-
|
|
5504
|
+
useEffect23(() => {
|
|
5191
5505
|
if (!isConnected)
|
|
5192
5506
|
setTextModeState(false);
|
|
5193
5507
|
}, [isConnected, setTextModeState]);
|
|
@@ -5217,7 +5531,7 @@ function LiveAgent(props) {
|
|
|
5217
5531
|
const agentMode = activeModuleForAgent?.mode ?? null;
|
|
5218
5532
|
const shouldAnimateCursor = activeModuleForAgent?.uiPreferences?.animateCursor ?? animateAgentCursor;
|
|
5219
5533
|
const resumableSession = useMemo6(() => getResumableSession(activeModuleForAgent), [activeModuleForAgent]);
|
|
5220
|
-
const resumeSession =
|
|
5534
|
+
const resumeSession = useCallback14(async () => {
|
|
5221
5535
|
if (!resumableSession)
|
|
5222
5536
|
return;
|
|
5223
5537
|
await startSession({
|
|
@@ -5226,7 +5540,7 @@ function LiveAgent(props) {
|
|
|
5226
5540
|
existingSessionId: resumableSession.id
|
|
5227
5541
|
});
|
|
5228
5542
|
}, [resumableSession, startSession, agentControls]);
|
|
5229
|
-
const selectModule =
|
|
5543
|
+
const selectModule = useCallback14((moduleId) => {
|
|
5230
5544
|
const found = availableModules.find((m) => m.id === moduleId);
|
|
5231
5545
|
if (!found)
|
|
5232
5546
|
return;
|
|
@@ -5237,7 +5551,7 @@ function LiveAgent(props) {
|
|
|
5237
5551
|
existingSessionId: getResumableSessionId(found.currentSession, found.mode)
|
|
5238
5552
|
});
|
|
5239
5553
|
}, [availableModules, startSession]);
|
|
5240
|
-
const startAdoptionSession =
|
|
5554
|
+
const startAdoptionSession = useCallback14((goal) => {
|
|
5241
5555
|
attendGoal(goal.goalId);
|
|
5242
5556
|
const found = availableModules.find((m) => m.id === goal.agentId);
|
|
5243
5557
|
if (found)
|
|
@@ -5248,9 +5562,9 @@ function LiveAgent(props) {
|
|
|
5248
5562
|
adoptionGoalId: goal.goalId
|
|
5249
5563
|
});
|
|
5250
5564
|
}, [attendGoal, availableModules, startSession]);
|
|
5251
|
-
const [welcomeDismissed, setWelcomeDismissed] =
|
|
5252
|
-
const dismissWelcome =
|
|
5253
|
-
const [currentPosition, setCurrentPosition] =
|
|
5565
|
+
const [welcomeDismissed, setWelcomeDismissed] = useState17(false);
|
|
5566
|
+
const dismissWelcome = useCallback14(() => setWelcomeDismissed(true), []);
|
|
5567
|
+
const [currentPosition, setCurrentPosition] = useState17(() => {
|
|
5254
5568
|
try {
|
|
5255
5569
|
const saved = localStorage.getItem("skippr_widget_position");
|
|
5256
5570
|
if (saved === "left" || saved === "right")
|
|
@@ -5258,13 +5572,13 @@ function LiveAgent(props) {
|
|
|
5258
5572
|
} catch {}
|
|
5259
5573
|
return position;
|
|
5260
5574
|
});
|
|
5261
|
-
const setPositionWithPersist =
|
|
5575
|
+
const setPositionWithPersist = useCallback14((pos) => {
|
|
5262
5576
|
setCurrentPosition(pos);
|
|
5263
5577
|
try {
|
|
5264
5578
|
localStorage.setItem("skippr_widget_position", pos);
|
|
5265
5579
|
} catch {}
|
|
5266
5580
|
}, []);
|
|
5267
|
-
const [launcherBottomPx, setLauncherBottomPxState] =
|
|
5581
|
+
const [launcherBottomPx, setLauncherBottomPxState] = useState17(() => {
|
|
5268
5582
|
try {
|
|
5269
5583
|
const saved = Number.parseInt(localStorage.getItem("skippr_widget_bottom") ?? "", 10);
|
|
5270
5584
|
if (Number.isFinite(saved) && saved > 0)
|
|
@@ -5272,8 +5586,8 @@ function LiveAgent(props) {
|
|
|
5272
5586
|
} catch {}
|
|
5273
5587
|
return DEFAULT_LAUNCHER_BOTTOM_PX;
|
|
5274
5588
|
});
|
|
5275
|
-
const [popsDown, setPopsDown] =
|
|
5276
|
-
const setLauncherBottomPx =
|
|
5589
|
+
const [popsDown, setPopsDown] = useState17(() => launcherPopsDown(launcherBottomPx));
|
|
5590
|
+
const setLauncherBottomPx = useCallback14((px) => {
|
|
5277
5591
|
setLauncherBottomPxState(px);
|
|
5278
5592
|
setPopsDown(launcherPopsDown(px));
|
|
5279
5593
|
try {
|
|
@@ -5282,7 +5596,7 @@ function LiveAgent(props) {
|
|
|
5282
5596
|
}, []);
|
|
5283
5597
|
const launcherBottomPxRef = useRef17(launcherBottomPx);
|
|
5284
5598
|
launcherBottomPxRef.current = launcherBottomPx;
|
|
5285
|
-
|
|
5599
|
+
useEffect23(() => {
|
|
5286
5600
|
const syncToViewport = () => {
|
|
5287
5601
|
const clamped = clampLauncherBottom(launcherBottomPxRef.current);
|
|
5288
5602
|
setLauncherBottomPxState(clamped);
|
|
@@ -5292,20 +5606,20 @@ function LiveAgent(props) {
|
|
|
5292
5606
|
window.addEventListener("resize", syncToViewport);
|
|
5293
5607
|
return () => window.removeEventListener("resize", syncToViewport);
|
|
5294
5608
|
}, []);
|
|
5295
|
-
const openPanel =
|
|
5296
|
-
const closePanel =
|
|
5297
|
-
const togglePanel =
|
|
5298
|
-
const expandPanel =
|
|
5609
|
+
const openPanel = useCallback14(() => setIsPanelOpen(true), []);
|
|
5610
|
+
const closePanel = useCallback14(() => setIsPanelOpen(false), []);
|
|
5611
|
+
const togglePanel = useCallback14(() => setIsPanelOpen((prev) => !prev), []);
|
|
5612
|
+
const expandPanel = useCallback14(() => {
|
|
5299
5613
|
setIsMinimized(false);
|
|
5300
5614
|
setIsPanelOpen(true);
|
|
5301
5615
|
}, []);
|
|
5302
|
-
const minimizePanel =
|
|
5616
|
+
const minimizePanel = useCallback14(() => {
|
|
5303
5617
|
if (!minimizable)
|
|
5304
5618
|
return;
|
|
5305
5619
|
setIsMinimized(true);
|
|
5306
5620
|
setIsPanelOpen(false);
|
|
5307
5621
|
}, [minimizable]);
|
|
5308
|
-
const pauseSessionAndMinimize =
|
|
5622
|
+
const pauseSessionAndMinimize = useCallback14(async () => {
|
|
5309
5623
|
await pauseSession();
|
|
5310
5624
|
minimizePanel();
|
|
5311
5625
|
}, [pauseSession, minimizePanel]);
|
|
@@ -5434,38 +5748,39 @@ function LiveAgent(props) {
|
|
|
5434
5748
|
adoptionGoals,
|
|
5435
5749
|
startAdoptionSession
|
|
5436
5750
|
]);
|
|
5437
|
-
return /* @__PURE__ */
|
|
5751
|
+
return /* @__PURE__ */ jsx22(LiveAgentContext.Provider, {
|
|
5438
5752
|
value: ctx,
|
|
5439
|
-
children: /* @__PURE__ */
|
|
5753
|
+
children: /* @__PURE__ */ jsxs18(LiveKitRoom, {
|
|
5440
5754
|
serverUrl: connection?.livekitUrl,
|
|
5441
5755
|
token: connection?.token,
|
|
5442
5756
|
connect: shouldConnect,
|
|
5443
5757
|
audio: true,
|
|
5444
5758
|
onDisconnected: handleRoomDisconnected,
|
|
5445
5759
|
children: [
|
|
5446
|
-
connection && !textMode && /* @__PURE__ */
|
|
5447
|
-
connection && captureMode === "screenshare" && /* @__PURE__ */
|
|
5760
|
+
connection && !textMode && /* @__PURE__ */ jsx22(RoomAudioRenderer, {}),
|
|
5761
|
+
connection && captureMode === "screenshare" && /* @__PURE__ */ jsx22(AutoStartMedia, {
|
|
5448
5762
|
pendingScreenStream
|
|
5449
5763
|
}),
|
|
5450
|
-
connection && captureMode === "auto" && /* @__PURE__ */
|
|
5451
|
-
/* @__PURE__ */
|
|
5764
|
+
connection && captureMode === "auto" && /* @__PURE__ */ jsx22(DomCapture, {}),
|
|
5765
|
+
/* @__PURE__ */ jsxs18(ShadowHost, {
|
|
5452
5766
|
children: [
|
|
5453
|
-
connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */
|
|
5454
|
-
connection && captureMode === "auto" && agentControls?.actions && /* @__PURE__ */
|
|
5455
|
-
connection && captureMode === "auto" &&
|
|
5767
|
+
connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */ jsx22(HighlightOverlay, {}),
|
|
5768
|
+
connection && captureMode === "auto" && agentControls?.actions && /* @__PURE__ */ jsx22(PageActionHandler, {}),
|
|
5769
|
+
connection && captureMode === "auto" && agentControls?.actions && /* @__PURE__ */ jsx22(PlanPanelOpener, {}),
|
|
5770
|
+
connection && captureMode === "auto" && (agentControls?.highlight || agentControls?.actions) && /* @__PURE__ */ jsx22(AgentCursorMount, {
|
|
5456
5771
|
animated: shouldAnimateCursor
|
|
5457
5772
|
}),
|
|
5458
|
-
/* @__PURE__ */
|
|
5773
|
+
/* @__PURE__ */ jsxs18("div", {
|
|
5459
5774
|
id: WIDGET_ROOT_ID,
|
|
5460
5775
|
children: [
|
|
5461
|
-
isMinimized && !showControlBar && /* @__PURE__ */
|
|
5776
|
+
isMinimized && !showControlBar && /* @__PURE__ */ jsx22(MinimizedBubble, {
|
|
5462
5777
|
welcomeMessage,
|
|
5463
5778
|
welcomeDismissed,
|
|
5464
5779
|
onDismissWelcome: dismissWelcome
|
|
5465
5780
|
}),
|
|
5466
|
-
showControlBar && !hideControls && /* @__PURE__ */
|
|
5467
|
-
/* @__PURE__ */
|
|
5468
|
-
/* @__PURE__ */
|
|
5781
|
+
showControlBar && !hideControls && /* @__PURE__ */ jsx22(SessionControlBar, {}),
|
|
5782
|
+
/* @__PURE__ */ jsx22(SidebarTrigger, {}),
|
|
5783
|
+
/* @__PURE__ */ jsx22(Sidebar, {
|
|
5469
5784
|
hideControls,
|
|
5470
5785
|
hideHeader,
|
|
5471
5786
|
startSessionLabel
|
|
@@ -5480,9 +5795,9 @@ function LiveAgent(props) {
|
|
|
5480
5795
|
});
|
|
5481
5796
|
}
|
|
5482
5797
|
// src/hooks/useIsLocalSpeaking.ts
|
|
5483
|
-
import { useIsSpeaking, useLocalParticipant as
|
|
5798
|
+
import { useIsSpeaking, useLocalParticipant as useLocalParticipant9 } from "@livekit/components-react/hooks";
|
|
5484
5799
|
function useIsLocalSpeaking() {
|
|
5485
|
-
const { localParticipant } =
|
|
5800
|
+
const { localParticipant } = useLocalParticipant9();
|
|
5486
5801
|
return useIsSpeaking(localParticipant);
|
|
5487
5802
|
}
|
|
5488
5803
|
export {
|