@skippr/live-agent-sdk 0.61.0 → 0.63.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 +713 -388
- 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 = {
|
|
@@ -1709,6 +1836,16 @@ function isInteractive(element, role) {
|
|
|
1709
1836
|
return true;
|
|
1710
1837
|
return false;
|
|
1711
1838
|
}
|
|
1839
|
+
function isCursorClickable(element, rect) {
|
|
1840
|
+
if (!intersectsViewport(rect, window.innerWidth, window.innerHeight))
|
|
1841
|
+
return false;
|
|
1842
|
+
if (window.getComputedStyle(element).cursor !== "pointer")
|
|
1843
|
+
return false;
|
|
1844
|
+
const parent = element.parentElement;
|
|
1845
|
+
if (parent && window.getComputedStyle(parent).cursor === "pointer")
|
|
1846
|
+
return false;
|
|
1847
|
+
return true;
|
|
1848
|
+
}
|
|
1712
1849
|
function isBlindRegion(role) {
|
|
1713
1850
|
return role === "video" || role === "iframe" || role === "canvas" || role === "audio" || role === "embed" || role === "object";
|
|
1714
1851
|
}
|
|
@@ -1990,7 +2127,7 @@ function walkAndCollect(element, depth, entries) {
|
|
|
1990
2127
|
if (shouldSkipSubtree(element))
|
|
1991
2128
|
return;
|
|
1992
2129
|
const rect = element.getBoundingClientRect();
|
|
1993
|
-
const role = inferRole(element);
|
|
2130
|
+
const role = inferRole(element) ?? (isCursorClickable(element, rect) ? "button" : null);
|
|
1994
2131
|
const isVisibleAndEmittable = role !== null && isVisible(element, rect) && shouldEmitElement(element, role);
|
|
1995
2132
|
let childDepth = depth;
|
|
1996
2133
|
if (isVisibleAndEmittable && role) {
|
|
@@ -2081,6 +2218,53 @@ function runAgentAction(dispatch) {
|
|
|
2081
2218
|
function isAgentActionInProgress() {
|
|
2082
2219
|
return isDispatchingAgentAction;
|
|
2083
2220
|
}
|
|
2221
|
+
var snapshotRequestHandler = null;
|
|
2222
|
+
function onSnapshotRequest(handler) {
|
|
2223
|
+
snapshotRequestHandler = handler;
|
|
2224
|
+
return () => {
|
|
2225
|
+
if (snapshotRequestHandler === handler)
|
|
2226
|
+
snapshotRequestHandler = null;
|
|
2227
|
+
};
|
|
2228
|
+
}
|
|
2229
|
+
function requestSnapshotAfterAction() {
|
|
2230
|
+
snapshotRequestHandler?.();
|
|
2231
|
+
}
|
|
2232
|
+
var actionsPaused = false;
|
|
2233
|
+
var pausedSubscribers = new Set;
|
|
2234
|
+
function setActionsPaused(paused) {
|
|
2235
|
+
if (actionsPaused === paused)
|
|
2236
|
+
return;
|
|
2237
|
+
actionsPaused = paused;
|
|
2238
|
+
for (const cb of pausedSubscribers)
|
|
2239
|
+
cb(paused);
|
|
2240
|
+
}
|
|
2241
|
+
function isActionsPaused() {
|
|
2242
|
+
return actionsPaused;
|
|
2243
|
+
}
|
|
2244
|
+
function onActionsPausedChange(cb) {
|
|
2245
|
+
pausedSubscribers.add(cb);
|
|
2246
|
+
return () => {
|
|
2247
|
+
pausedSubscribers.delete(cb);
|
|
2248
|
+
};
|
|
2249
|
+
}
|
|
2250
|
+
var actionsBusy = false;
|
|
2251
|
+
var busySubscribers = new Set;
|
|
2252
|
+
function setActionsBusy(busy) {
|
|
2253
|
+
if (actionsBusy === busy)
|
|
2254
|
+
return;
|
|
2255
|
+
actionsBusy = busy;
|
|
2256
|
+
for (const cb of busySubscribers)
|
|
2257
|
+
cb(busy);
|
|
2258
|
+
}
|
|
2259
|
+
function isActionsBusy() {
|
|
2260
|
+
return actionsBusy;
|
|
2261
|
+
}
|
|
2262
|
+
function subscribeActionsBusy(cb) {
|
|
2263
|
+
busySubscribers.add(cb);
|
|
2264
|
+
return () => {
|
|
2265
|
+
busySubscribers.delete(cb);
|
|
2266
|
+
};
|
|
2267
|
+
}
|
|
2084
2268
|
|
|
2085
2269
|
// src/capture/domEvents.ts
|
|
2086
2270
|
var MUTATION_DEBOUNCE_MS = 250;
|
|
@@ -2378,7 +2562,7 @@ function DomCapture() {
|
|
|
2378
2562
|
const { localParticipant } = useLocalParticipant2();
|
|
2379
2563
|
const connectionState = useConnectionState2();
|
|
2380
2564
|
const didStartRef = useRef4(false);
|
|
2381
|
-
|
|
2565
|
+
useEffect9(() => {
|
|
2382
2566
|
if (didStartRef.current)
|
|
2383
2567
|
return;
|
|
2384
2568
|
if (connectionState !== ConnectionState2.Connected)
|
|
@@ -2454,6 +2638,10 @@ function DomCapture() {
|
|
|
2454
2638
|
tickSnapshot();
|
|
2455
2639
|
}
|
|
2456
2640
|
});
|
|
2641
|
+
const cleanupSnapshotRequest = onSnapshotRequest(() => {
|
|
2642
|
+
tickA11yPublish();
|
|
2643
|
+
tickSnapshot();
|
|
2644
|
+
});
|
|
2457
2645
|
let snapshotTimer = null;
|
|
2458
2646
|
const scheduleNextSnapshot = (delay) => {
|
|
2459
2647
|
if (cancelled)
|
|
@@ -2473,6 +2661,7 @@ function DomCapture() {
|
|
|
2473
2661
|
clearTimeout(snapshotTimer);
|
|
2474
2662
|
clearInterval(a11yPublishTimer);
|
|
2475
2663
|
cleanupDomEventListeners();
|
|
2664
|
+
cleanupSnapshotRequest();
|
|
2476
2665
|
unpublishAndStopTrack(localParticipant, videoTrack);
|
|
2477
2666
|
for (const track of canvasStream.getTracks())
|
|
2478
2667
|
track.stop();
|
|
@@ -2483,7 +2672,7 @@ function DomCapture() {
|
|
|
2483
2672
|
|
|
2484
2673
|
// src/components/HighlightOverlay.tsx
|
|
2485
2674
|
import { useDataChannel } from "@livekit/components-react/hooks";
|
|
2486
|
-
import { useCallback as
|
|
2675
|
+
import { useCallback as useCallback6, useEffect as useEffect10, useRef as useRef5 } from "react";
|
|
2487
2676
|
var HIGHLIGHT_AUTO_CLEAR_MS = 1e4;
|
|
2488
2677
|
var textDecoder = new TextDecoder;
|
|
2489
2678
|
function parseHighlightMessage(payload) {
|
|
@@ -2508,14 +2697,14 @@ function parseHighlightMessage(payload) {
|
|
|
2508
2697
|
function HighlightOverlay() {
|
|
2509
2698
|
const targetRef = useRef5(null);
|
|
2510
2699
|
const autoClearRef = useRef5(null);
|
|
2511
|
-
const clear =
|
|
2700
|
+
const clear = useCallback6(() => {
|
|
2512
2701
|
if (autoClearRef.current)
|
|
2513
2702
|
clearTimeout(autoClearRef.current);
|
|
2514
2703
|
autoClearRef.current = null;
|
|
2515
2704
|
targetRef.current = null;
|
|
2516
2705
|
clearCursorTarget("guide");
|
|
2517
2706
|
}, []);
|
|
2518
|
-
const onHighlightMessage =
|
|
2707
|
+
const onHighlightMessage = useCallback6((msg) => {
|
|
2519
2708
|
const parsed = parseHighlightMessage(msg.payload);
|
|
2520
2709
|
if (!parsed)
|
|
2521
2710
|
return;
|
|
@@ -2539,7 +2728,7 @@ function HighlightOverlay() {
|
|
|
2539
2728
|
autoClearRef.current = setTimeout(clear, HIGHLIGHT_AUTO_CLEAR_MS);
|
|
2540
2729
|
}, [clear]);
|
|
2541
2730
|
useDataChannel(HIGHLIGHT_TOPIC, onHighlightMessage);
|
|
2542
|
-
|
|
2731
|
+
useEffect10(() => {
|
|
2543
2732
|
const onClick = (event) => {
|
|
2544
2733
|
const target = targetRef.current;
|
|
2545
2734
|
const node = event.target;
|
|
@@ -2549,15 +2738,15 @@ function HighlightOverlay() {
|
|
|
2549
2738
|
document.addEventListener("click", onClick, { capture: true });
|
|
2550
2739
|
return () => document.removeEventListener("click", onClick, { capture: true });
|
|
2551
2740
|
}, [clear]);
|
|
2552
|
-
|
|
2741
|
+
useEffect10(() => clear, [clear]);
|
|
2553
2742
|
return null;
|
|
2554
2743
|
}
|
|
2555
2744
|
|
|
2556
2745
|
// src/components/MinimizedBubble.tsx
|
|
2557
|
-
import { useContext as
|
|
2746
|
+
import { useContext as useContext4, useEffect as useEffect12, useRef as useRef7, useState as useState8 } from "react";
|
|
2558
2747
|
|
|
2559
2748
|
// src/hooks/useLauncherDrag.ts
|
|
2560
|
-
import { useEffect as
|
|
2749
|
+
import { useEffect as useEffect11, useRef as useRef6 } from "react";
|
|
2561
2750
|
import { flushSync } from "react-dom";
|
|
2562
2751
|
var DRAG_THRESHOLD_PX = 5;
|
|
2563
2752
|
function useLauncherDrag(containerRef, onDrop, followRef) {
|
|
@@ -2566,7 +2755,7 @@ function useLauncherDrag(containerRef, onDrop, followRef) {
|
|
|
2566
2755
|
onDropRef.current = onDrop;
|
|
2567
2756
|
const followTargetRef = useRef6(followRef);
|
|
2568
2757
|
followTargetRef.current = followRef;
|
|
2569
|
-
|
|
2758
|
+
useEffect11(() => {
|
|
2570
2759
|
const el = containerRef.current;
|
|
2571
2760
|
if (!el)
|
|
2572
2761
|
return;
|
|
@@ -2819,7 +3008,7 @@ function WelcomeBubble({
|
|
|
2819
3008
|
onDismiss,
|
|
2820
3009
|
onClick
|
|
2821
3010
|
}) {
|
|
2822
|
-
|
|
3011
|
+
useEffect12(() => {
|
|
2823
3012
|
const timer = setTimeout(onDismiss, 5000);
|
|
2824
3013
|
return () => clearTimeout(timer);
|
|
2825
3014
|
}, [onDismiss]);
|
|
@@ -2841,7 +3030,7 @@ function MinimizedBubble({
|
|
|
2841
3030
|
welcomeDismissed,
|
|
2842
3031
|
onDismissWelcome
|
|
2843
3032
|
}) {
|
|
2844
|
-
const ctx =
|
|
3033
|
+
const ctx = useContext4(LiveAgentContext);
|
|
2845
3034
|
if (!ctx) {
|
|
2846
3035
|
throw new Error("MinimizedBubble must be used within a <LiveAgent> provider");
|
|
2847
3036
|
}
|
|
@@ -2861,13 +3050,13 @@ function MinimizedBubble({
|
|
|
2861
3050
|
selectModule,
|
|
2862
3051
|
expandPanel
|
|
2863
3052
|
} = ctx;
|
|
2864
|
-
const [goalsAutoHidden, setGoalsAutoHidden] =
|
|
2865
|
-
const [isLauncherHovered, setIsLauncherHovered] =
|
|
2866
|
-
const [visitHref, setVisitHref] =
|
|
3053
|
+
const [goalsAutoHidden, setGoalsAutoHidden] = useState8(false);
|
|
3054
|
+
const [isLauncherHovered, setIsLauncherHovered] = useState8(false);
|
|
3055
|
+
const [visitHref, setVisitHref] = useState8(() => window.location.href);
|
|
2867
3056
|
const revealedHrefRef = useRef7(null);
|
|
2868
3057
|
const hoverContainerRef = useRef7(null);
|
|
2869
|
-
|
|
2870
|
-
|
|
3058
|
+
useEffect12(() => subscribeToLocationChange(() => setVisitHref(window.location.href)), []);
|
|
3059
|
+
useEffect12(() => {
|
|
2871
3060
|
const el = hoverContainerRef.current;
|
|
2872
3061
|
if (!el)
|
|
2873
3062
|
return;
|
|
@@ -2893,7 +3082,7 @@ function MinimizedBubble({
|
|
|
2893
3082
|
const onboardingModule = pillCandidates.find((module) => module.type === "onboarding");
|
|
2894
3083
|
const modulePills = onboardingModule ? [onboardingModule] : pillCandidates.slice(0, MAX_MODULE_PILLS).reverse();
|
|
2895
3084
|
const goalsEligible = adoptionGoals.length > 0 && !onboardingModule && (!hasModuleSelector || hasResolvedModules);
|
|
2896
|
-
|
|
3085
|
+
useEffect12(() => {
|
|
2897
3086
|
if (!goalsEligible)
|
|
2898
3087
|
return;
|
|
2899
3088
|
if (revealedHrefRef.current === visitHref) {
|
|
@@ -2907,8 +3096,8 @@ function MinimizedBubble({
|
|
|
2907
3096
|
}, [goalsEligible, visitHref]);
|
|
2908
3097
|
const matchedGoals = goalsEligible ? adoptionGoals.slice(0, MAX_GOAL_BUBBLES) : [];
|
|
2909
3098
|
const goalsHidden = goalsAutoHidden && !isLauncherHovered;
|
|
2910
|
-
const [goalsUnmounted, setGoalsUnmounted] =
|
|
2911
|
-
|
|
3099
|
+
const [goalsUnmounted, setGoalsUnmounted] = useState8(false);
|
|
3100
|
+
useEffect12(() => {
|
|
2912
3101
|
if (!goalsHidden) {
|
|
2913
3102
|
setGoalsUnmounted(false);
|
|
2914
3103
|
return;
|
|
@@ -2976,8 +3165,9 @@ function MinimizedBubble({
|
|
|
2976
3165
|
|
|
2977
3166
|
// src/components/PageActionHandler.tsx
|
|
2978
3167
|
import { useDataChannel as useDataChannel2 } from "@livekit/components-react/hooks";
|
|
2979
|
-
import { useCallback as
|
|
3168
|
+
import { useCallback as useCallback7, useEffect as useEffect13, useRef as useRef8 } from "react";
|
|
2980
3169
|
var STEP_MAX_WAIT_MS = 5000;
|
|
3170
|
+
var POST_ACTION_SETTLE_SNAPSHOT_MS = 300;
|
|
2981
3171
|
var textDecoder2 = new TextDecoder;
|
|
2982
3172
|
function parseScrollDirection(value) {
|
|
2983
3173
|
return value === "down" || value === "up" || value === "top" || value === "bottom" ? value : null;
|
|
@@ -3209,13 +3399,15 @@ function PageActionHandler() {
|
|
|
3209
3399
|
const mountedRef = useRef8(true);
|
|
3210
3400
|
const queueRef = useRef8([]);
|
|
3211
3401
|
const drainingRef = useRef8(false);
|
|
3212
|
-
const
|
|
3402
|
+
const settleTimerRef = useRef8(null);
|
|
3403
|
+
const endStepRef = useRef8(null);
|
|
3404
|
+
const runStep = useCallback7((action) => {
|
|
3213
3405
|
return new Promise((resolve) => {
|
|
3214
3406
|
if (action.type === "navigate") {
|
|
3215
3407
|
queueRef.current.length = 0;
|
|
3216
3408
|
if (isSameOriginHttpUrl(action.url))
|
|
3217
3409
|
window.location.assign(action.url);
|
|
3218
|
-
resolve();
|
|
3410
|
+
resolve(true);
|
|
3219
3411
|
return;
|
|
3220
3412
|
}
|
|
3221
3413
|
if (action.type === "scroll_page") {
|
|
@@ -3224,7 +3416,7 @@ function PageActionHandler() {
|
|
|
3224
3416
|
if (scrolled)
|
|
3225
3417
|
return;
|
|
3226
3418
|
scrolled = true;
|
|
3227
|
-
resolve();
|
|
3419
|
+
resolve(true);
|
|
3228
3420
|
};
|
|
3229
3421
|
const fallback2 = setTimeout(finishScroll, STEP_MAX_WAIT_MS);
|
|
3230
3422
|
setCursorTarget("act", {
|
|
@@ -3244,20 +3436,23 @@ function PageActionHandler() {
|
|
|
3244
3436
|
}
|
|
3245
3437
|
const element = findElementByRef(action.ref);
|
|
3246
3438
|
if (!element?.isConnected || !isVisible2(element) || isActionBlocked(element)) {
|
|
3247
|
-
resolve();
|
|
3439
|
+
resolve(false);
|
|
3248
3440
|
return;
|
|
3249
3441
|
}
|
|
3250
3442
|
if (action.type === "click" && isActionBlocked(resolveClickTarget(element))) {
|
|
3251
|
-
resolve();
|
|
3443
|
+
resolve(false);
|
|
3252
3444
|
return;
|
|
3253
3445
|
}
|
|
3446
|
+
let acted = false;
|
|
3254
3447
|
let done = false;
|
|
3255
3448
|
const finish = () => {
|
|
3256
3449
|
if (done)
|
|
3257
3450
|
return;
|
|
3258
3451
|
done = true;
|
|
3259
|
-
|
|
3452
|
+
endStepRef.current = null;
|
|
3453
|
+
resolve(acted);
|
|
3260
3454
|
};
|
|
3455
|
+
endStepRef.current = finish;
|
|
3261
3456
|
const fallback = setTimeout(finish, STEP_MAX_WAIT_MS);
|
|
3262
3457
|
setCursorTarget("act", {
|
|
3263
3458
|
element,
|
|
@@ -3266,47 +3461,83 @@ function PageActionHandler() {
|
|
|
3266
3461
|
onAct: () => {
|
|
3267
3462
|
clearTimeout(fallback);
|
|
3268
3463
|
const resolved = action.type === "click" ? resolveClickTarget(element) : element;
|
|
3269
|
-
if (mountedRef.current && element.isConnected && !isActionBlocked(element) && !isActionBlocked(resolved)) {
|
|
3464
|
+
if (mountedRef.current && !isActionsPaused() && element.isConnected && !isActionBlocked(element) && !isActionBlocked(resolved)) {
|
|
3465
|
+
acted = true;
|
|
3270
3466
|
runAgentAction(() => performAction(action, element));
|
|
3467
|
+
requestSnapshotAfterAction();
|
|
3468
|
+
if (settleTimerRef.current)
|
|
3469
|
+
clearTimeout(settleTimerRef.current);
|
|
3470
|
+
settleTimerRef.current = setTimeout(() => {
|
|
3471
|
+
if (mountedRef.current)
|
|
3472
|
+
requestSnapshotAfterAction();
|
|
3473
|
+
}, POST_ACTION_SETTLE_SNAPSHOT_MS);
|
|
3271
3474
|
}
|
|
3272
3475
|
finish();
|
|
3273
3476
|
}
|
|
3274
3477
|
});
|
|
3275
3478
|
});
|
|
3276
3479
|
}, []);
|
|
3277
|
-
const drain =
|
|
3480
|
+
const drain = useCallback7(async () => {
|
|
3278
3481
|
if (drainingRef.current)
|
|
3279
3482
|
return;
|
|
3280
3483
|
drainingRef.current = true;
|
|
3484
|
+
setActionsBusy(true);
|
|
3485
|
+
let pausedMidQueue = false;
|
|
3281
3486
|
try {
|
|
3282
3487
|
while (mountedRef.current && queueRef.current.length > 0) {
|
|
3283
|
-
|
|
3488
|
+
if (isActionsPaused()) {
|
|
3489
|
+
pausedMidQueue = true;
|
|
3490
|
+
break;
|
|
3491
|
+
}
|
|
3492
|
+
const action = queueRef.current[0];
|
|
3284
3493
|
if (!action)
|
|
3285
3494
|
break;
|
|
3286
|
-
await runStep(action);
|
|
3495
|
+
const acted = await runStep(action);
|
|
3496
|
+
if (isActionsPaused() && !acted) {
|
|
3497
|
+
pausedMidQueue = true;
|
|
3498
|
+
break;
|
|
3499
|
+
}
|
|
3500
|
+
queueRef.current.shift();
|
|
3287
3501
|
}
|
|
3288
3502
|
} finally {
|
|
3289
3503
|
drainingRef.current = false;
|
|
3290
|
-
if (mountedRef.current)
|
|
3504
|
+
if (mountedRef.current) {
|
|
3291
3505
|
clearCursorTarget("act");
|
|
3506
|
+
if (!pausedMidQueue)
|
|
3507
|
+
setActionsBusy(false);
|
|
3508
|
+
}
|
|
3292
3509
|
}
|
|
3293
3510
|
}, [runStep]);
|
|
3294
|
-
const onMessage =
|
|
3511
|
+
const onMessage = useCallback7((msg) => {
|
|
3295
3512
|
const action = parsePageAction(msg.payload);
|
|
3296
3513
|
if (!action)
|
|
3297
3514
|
return;
|
|
3298
3515
|
queueRef.current.push(action);
|
|
3299
3516
|
drain();
|
|
3300
3517
|
}, [drain]);
|
|
3301
|
-
|
|
3518
|
+
useEffect13(() => {
|
|
3302
3519
|
mountedRef.current = true;
|
|
3303
3520
|
drainingRef.current = false;
|
|
3304
3521
|
return () => {
|
|
3305
3522
|
mountedRef.current = false;
|
|
3306
3523
|
queueRef.current.length = 0;
|
|
3524
|
+
if (settleTimerRef.current)
|
|
3525
|
+
clearTimeout(settleTimerRef.current);
|
|
3307
3526
|
clearCursorTarget("act");
|
|
3527
|
+
setActionsBusy(false);
|
|
3308
3528
|
};
|
|
3309
3529
|
}, []);
|
|
3530
|
+
useEffect13(() => {
|
|
3531
|
+
return onActionsPausedChange((paused) => {
|
|
3532
|
+
if (paused) {
|
|
3533
|
+
clearCursorTarget("act");
|
|
3534
|
+
clearCursorTarget("guide");
|
|
3535
|
+
endStepRef.current?.();
|
|
3536
|
+
} else {
|
|
3537
|
+
drain();
|
|
3538
|
+
}
|
|
3539
|
+
});
|
|
3540
|
+
}, [drain]);
|
|
3310
3541
|
useDataChannel2(PAGE_ACTIONS_TOPIC, onMessage);
|
|
3311
3542
|
return null;
|
|
3312
3543
|
}
|
|
@@ -3314,6 +3545,30 @@ function PageActionHandler() {
|
|
|
3314
3545
|
// src/components/SessionControlBar.tsx
|
|
3315
3546
|
import { useContext as useContext6, useRef as useRef10 } from "react";
|
|
3316
3547
|
|
|
3548
|
+
// src/hooks/useActionControl.ts
|
|
3549
|
+
import { useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
|
|
3550
|
+
import { useCallback as useCallback8, useEffect as useEffect14, useState as useState9 } from "react";
|
|
3551
|
+
var textEncoder3 = new TextEncoder;
|
|
3552
|
+
function useActionControl() {
|
|
3553
|
+
const { localParticipant } = useLocalParticipant3();
|
|
3554
|
+
const plan = usePlanUpdates();
|
|
3555
|
+
const [busy, setBusy] = useState9(isActionsBusy);
|
|
3556
|
+
const [actionsPaused2, setPaused] = useState9(false);
|
|
3557
|
+
useEffect14(() => subscribeActionsBusy(setBusy), []);
|
|
3558
|
+
const actionsActive = busy || plan?.state === "executing";
|
|
3559
|
+
const togglePaused = useCallback8(async () => {
|
|
3560
|
+
const next = !actionsPaused2;
|
|
3561
|
+
setPaused(next);
|
|
3562
|
+
setActionsPaused(next);
|
|
3563
|
+
try {
|
|
3564
|
+
await localParticipant.publishData(textEncoder3.encode(JSON.stringify({ type: next ? "pause" : "resume" })), { reliable: true, topic: ACTION_CONTROL_TOPIC });
|
|
3565
|
+
} catch (error) {
|
|
3566
|
+
console.error("Failed to send action pause/resume:", error);
|
|
3567
|
+
}
|
|
3568
|
+
}, [actionsPaused2, localParticipant]);
|
|
3569
|
+
return { actionsActive, actionsPaused: actionsPaused2, togglePaused };
|
|
3570
|
+
}
|
|
3571
|
+
|
|
3317
3572
|
// src/hooks/useAgentVoiceState.ts
|
|
3318
3573
|
import { useVoiceAssistant } from "@livekit/components-react/hooks";
|
|
3319
3574
|
function useAgentVoiceState() {
|
|
@@ -3327,13 +3582,13 @@ function useAgentVoiceState() {
|
|
|
3327
3582
|
}
|
|
3328
3583
|
|
|
3329
3584
|
// src/hooks/useAudioLevelBars.ts
|
|
3330
|
-
import { useEffect as
|
|
3585
|
+
import { useEffect as useEffect15, useRef as useRef9, useState as useState10 } from "react";
|
|
3331
3586
|
var TALKING_LEVEL_THRESHOLD = 0.2;
|
|
3332
3587
|
var TALKING_HOLD_MS = 400;
|
|
3333
3588
|
function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowthPx, noiseGate }) {
|
|
3334
3589
|
const barRefs = useRef9([]);
|
|
3335
|
-
const [isTalking, setIsTalking] =
|
|
3336
|
-
|
|
3590
|
+
const [isTalking, setIsTalking] = useState10(false);
|
|
3591
|
+
useEffect15(() => {
|
|
3337
3592
|
if (!mediaStreamTrack) {
|
|
3338
3593
|
for (const bar of barRefs.current) {
|
|
3339
3594
|
if (bar)
|
|
@@ -3383,55 +3638,27 @@ function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowth
|
|
|
3383
3638
|
return { barRefs, isTalking };
|
|
3384
3639
|
}
|
|
3385
3640
|
|
|
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
3641
|
// src/hooks/useMediaControls.ts
|
|
3415
|
-
import { useLocalParticipant as
|
|
3642
|
+
import { useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react/hooks";
|
|
3416
3643
|
import { ScreenSharePresets as ScreenSharePresets2 } from "livekit-client";
|
|
3417
|
-
import { useCallback as
|
|
3644
|
+
import { useCallback as useCallback9 } from "react";
|
|
3418
3645
|
var SCREEN_SHARE_OPTIONS = {
|
|
3419
3646
|
video: { displaySurface: "browser" },
|
|
3420
3647
|
resolution: ScreenSharePresets2.h720fps30.resolution,
|
|
3421
3648
|
contentHint: "detail"
|
|
3422
3649
|
};
|
|
3423
3650
|
function useMediaControls() {
|
|
3424
|
-
const { localParticipant } =
|
|
3651
|
+
const { localParticipant } = useLocalParticipant4();
|
|
3425
3652
|
const isMuted = !localParticipant.isMicrophoneEnabled;
|
|
3426
3653
|
const isScreenSharing = localParticipant.isScreenShareEnabled;
|
|
3427
|
-
const toggleMute =
|
|
3654
|
+
const toggleMute = useCallback9(async () => {
|
|
3428
3655
|
try {
|
|
3429
3656
|
await localParticipant.setMicrophoneEnabled(isMuted);
|
|
3430
3657
|
} catch (error) {
|
|
3431
3658
|
console.error("Failed to toggle microphone:", error);
|
|
3432
3659
|
}
|
|
3433
3660
|
}, [localParticipant, isMuted]);
|
|
3434
|
-
const toggleScreenShare =
|
|
3661
|
+
const toggleScreenShare = useCallback9(async () => {
|
|
3435
3662
|
try {
|
|
3436
3663
|
await localParticipant.setScreenShareEnabled(!isScreenSharing, SCREEN_SHARE_OPTIONS);
|
|
3437
3664
|
} catch (error) {
|
|
@@ -3442,13 +3669,13 @@ function useMediaControls() {
|
|
|
3442
3669
|
}
|
|
3443
3670
|
|
|
3444
3671
|
// src/hooks/useMicLevel.ts
|
|
3445
|
-
import { useLocalParticipant as
|
|
3672
|
+
import { useLocalParticipant as useLocalParticipant5 } from "@livekit/components-react/hooks";
|
|
3446
3673
|
var MIC_BARS = 5;
|
|
3447
3674
|
var IDLE_BAR_HEIGHT_PX = 5;
|
|
3448
3675
|
var MAX_BAR_GROWTH_PX = 17;
|
|
3449
3676
|
var MIC_NOISE_GATE = 0.15;
|
|
3450
3677
|
function useMicLevel(enabled) {
|
|
3451
|
-
const { microphoneTrack } =
|
|
3678
|
+
const { microphoneTrack } = useLocalParticipant5();
|
|
3452
3679
|
const mediaStreamTrack = microphoneTrack?.track?.mediaStreamTrack;
|
|
3453
3680
|
return useAudioLevelBars(enabled ? mediaStreamTrack : undefined, {
|
|
3454
3681
|
barCount: MIC_BARS,
|
|
@@ -3459,50 +3686,7 @@ function useMicLevel(enabled) {
|
|
|
3459
3686
|
}
|
|
3460
3687
|
|
|
3461
3688
|
// 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
|
|
3689
|
+
import { useCallback as useCallback10, useContext as useContext5, useEffect as useEffect16 } from "react";
|
|
3506
3690
|
function parsePhases(json) {
|
|
3507
3691
|
try {
|
|
3508
3692
|
const data = JSON.parse(json);
|
|
@@ -3513,10 +3697,10 @@ function parsePhases(json) {
|
|
|
3513
3697
|
return null;
|
|
3514
3698
|
}
|
|
3515
3699
|
function usePhaseUpdates() {
|
|
3516
|
-
const parse =
|
|
3700
|
+
const parse = useCallback10(parsePhases, []);
|
|
3517
3701
|
const livePhases = useAgentState("phases", parse, []);
|
|
3518
3702
|
const ctx = useContext5(LiveAgentContext);
|
|
3519
|
-
|
|
3703
|
+
useEffect16(() => {
|
|
3520
3704
|
if (livePhases.length > 0)
|
|
3521
3705
|
ctx?.setPhasesSnapshot(livePhases);
|
|
3522
3706
|
}, [livePhases, ctx?.setPhasesSnapshot]);
|
|
@@ -3530,6 +3714,7 @@ var STANDBY_BAR_WIDTH = 168;
|
|
|
3530
3714
|
var READY_BAR_WIDTH = 176;
|
|
3531
3715
|
var TEXT_BAR_WIDTH = 64;
|
|
3532
3716
|
var SCREEN_SHARE_EXTRA_WIDTH = 56;
|
|
3717
|
+
var ACTION_CONTROL_EXTRA_WIDTH = 56;
|
|
3533
3718
|
var MIC_REGION_WIDTH = 104;
|
|
3534
3719
|
var MIC_SQUARE_WIDTH = 48;
|
|
3535
3720
|
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 +3724,7 @@ var AGENT_BAR_MAX_GROWTH_PX = 12;
|
|
|
3539
3724
|
var AGENT_NOISE_GATE = 0;
|
|
3540
3725
|
function AgentActivity({
|
|
3541
3726
|
state,
|
|
3727
|
+
isActing,
|
|
3542
3728
|
mediaStreamTrack
|
|
3543
3729
|
}) {
|
|
3544
3730
|
const { barRefs } = useAudioLevelBars(state === "speaking" ? mediaStreamTrack : undefined, {
|
|
@@ -3547,6 +3733,17 @@ function AgentActivity({
|
|
|
3547
3733
|
maxGrowthPx: AGENT_BAR_MAX_GROWTH_PX,
|
|
3548
3734
|
noiseGate: AGENT_NOISE_GATE
|
|
3549
3735
|
});
|
|
3736
|
+
if (isActing) {
|
|
3737
|
+
return /* @__PURE__ */ jsx5("span", {
|
|
3738
|
+
role: "status",
|
|
3739
|
+
className: "skippr:flex skippr:h-5 skippr:w-12 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:text-bubble",
|
|
3740
|
+
"aria-label": "Agent is acting",
|
|
3741
|
+
children: /* @__PURE__ */ jsx5(MousePointerClick, {
|
|
3742
|
+
strokeWidth: 2,
|
|
3743
|
+
className: "skippr:size-5 skippr:[animation:skippr-finger-tap_1.1s_ease-in-out_infinite]"
|
|
3744
|
+
})
|
|
3745
|
+
});
|
|
3746
|
+
}
|
|
3550
3747
|
return /* @__PURE__ */ jsxs5("span", {
|
|
3551
3748
|
role: "status",
|
|
3552
3749
|
className: "skippr:flex skippr:h-5 skippr:w-12 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:text-bubble",
|
|
@@ -3627,13 +3824,17 @@ function SessionControlBar() {
|
|
|
3627
3824
|
const { isMuted, toggleMute, isScreenSharing, toggleScreenShare } = useMediaControls();
|
|
3628
3825
|
const { state, mediaStreamTrack: agentMediaStreamTrack } = useAgentVoiceState();
|
|
3629
3826
|
const { phases } = usePhaseUpdates();
|
|
3827
|
+
const { actionsActive, actionsPaused: actionsPaused2, togglePaused } = useActionControl();
|
|
3630
3828
|
const isReady = state === "listening" || state === "thinking" || state === "speaking";
|
|
3631
3829
|
const { barRefs, isTalking } = useMicLevel(isReady && !isMuted && !textMode);
|
|
3632
3830
|
const showScreenShareToggle = captureMode === "screenshare";
|
|
3831
|
+
const showActionControl = captureMode === "auto" && actionsActive;
|
|
3633
3832
|
const screenShareExtra = showScreenShareToggle ? SCREEN_SHARE_EXTRA_WIDTH : 0;
|
|
3833
|
+
const actionControlExtra = showActionControl ? ACTION_CONTROL_EXTRA_WIDTH : 0;
|
|
3634
3834
|
let barWidth = STANDBY_BAR_WIDTH;
|
|
3635
3835
|
if (isReady) {
|
|
3636
|
-
|
|
3836
|
+
const base = textMode ? TEXT_BAR_WIDTH : READY_BAR_WIDTH;
|
|
3837
|
+
barWidth = base + screenShareExtra + actionControlExtra;
|
|
3637
3838
|
}
|
|
3638
3839
|
const agendaModule = activeModule && activeModule.mode !== AGENT_MODE.AlwaysOn && activeModule.totalPhases > 0 ? activeModule : null;
|
|
3639
3840
|
const agendaProgress = phases.length > 0 ? {
|
|
@@ -3713,6 +3914,7 @@ function SessionControlBar() {
|
|
|
3713
3914
|
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
3915
|
children: /* @__PURE__ */ jsx5(AgentActivity, {
|
|
3715
3916
|
state,
|
|
3917
|
+
isActing: showActionControl && !actionsPaused2,
|
|
3716
3918
|
mediaStreamTrack: agentMediaStreamTrack
|
|
3717
3919
|
})
|
|
3718
3920
|
}),
|
|
@@ -3764,6 +3966,20 @@ function SessionControlBar() {
|
|
|
3764
3966
|
children: /* @__PURE__ */ jsx5(MessageSquare, {
|
|
3765
3967
|
className: "skippr:size-5"
|
|
3766
3968
|
})
|
|
3969
|
+
}),
|
|
3970
|
+
showActionControl && /* @__PURE__ */ jsx5("button", {
|
|
3971
|
+
type: "button",
|
|
3972
|
+
onClick: ifNotDragged(() => void togglePaused()),
|
|
3973
|
+
"aria-label": actionsPaused2 ? "Resume actions" : "Stop actions",
|
|
3974
|
+
title: actionsPaused2 ? "Resume" : "Stop",
|
|
3975
|
+
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"),
|
|
3976
|
+
children: actionsPaused2 ? /* @__PURE__ */ jsx5(Play, {
|
|
3977
|
+
className: "skippr:size-5",
|
|
3978
|
+
fill: "currentColor"
|
|
3979
|
+
}) : /* @__PURE__ */ jsx5(Square, {
|
|
3980
|
+
className: "skippr:size-5",
|
|
3981
|
+
fill: "currentColor"
|
|
3982
|
+
})
|
|
3767
3983
|
})
|
|
3768
3984
|
]
|
|
3769
3985
|
}, textMode ? "ready-text" : "ready"),
|
|
@@ -3813,7 +4029,7 @@ function SessionControlBar() {
|
|
|
3813
4029
|
}
|
|
3814
4030
|
|
|
3815
4031
|
// src/components/ShadowHost.tsx
|
|
3816
|
-
import { useLayoutEffect as useLayoutEffect2, useRef as useRef11, useState as
|
|
4032
|
+
import { useLayoutEffect as useLayoutEffect2, useRef as useRef11, useState as useState11 } from "react";
|
|
3817
4033
|
import { createPortal } from "react-dom";
|
|
3818
4034
|
import { jsx as jsx6, Fragment } from "react/jsx-runtime";
|
|
3819
4035
|
var PROPERTIES_STYLE_ID = "skippr-tw-properties";
|
|
@@ -3831,9 +4047,9 @@ function hoistTailwindProperties(css) {
|
|
|
3831
4047
|
}
|
|
3832
4048
|
function ShadowHost({ children }) {
|
|
3833
4049
|
const hostRef = useRef11(null);
|
|
3834
|
-
const [shadowRoot, setShadowRoot] =
|
|
4050
|
+
const [shadowRoot, setShadowRoot] = useState11(null);
|
|
3835
4051
|
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}}`;
|
|
4052
|
+
@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
4053
|
useLayoutEffect2(() => {
|
|
3838
4054
|
const host = hostRef.current;
|
|
3839
4055
|
if (!host || !css)
|
|
@@ -3858,13 +4074,13 @@ function ShadowHost({ children }) {
|
|
|
3858
4074
|
}
|
|
3859
4075
|
|
|
3860
4076
|
// src/components/Sidebar.tsx
|
|
3861
|
-
import { useContext as useContext10, useEffect as
|
|
4077
|
+
import { useContext as useContext10, useEffect as useEffect22 } from "react";
|
|
3862
4078
|
|
|
3863
4079
|
// src/hooks/useCombinedMessages.ts
|
|
3864
4080
|
import { useContext as useContext7, useMemo as useMemo5 } from "react";
|
|
3865
4081
|
|
|
3866
4082
|
// src/hooks/useChatMessages.ts
|
|
3867
|
-
import { useChat, useLocalParticipant as
|
|
4083
|
+
import { useChat, useLocalParticipant as useLocalParticipant6 } from "@livekit/components-react/hooks";
|
|
3868
4084
|
import { useMemo as useMemo3 } from "react";
|
|
3869
4085
|
|
|
3870
4086
|
// src/lib/filterSystemMessages.ts
|
|
@@ -3876,7 +4092,7 @@ function filterSystemMessages(messages) {
|
|
|
3876
4092
|
// src/hooks/useChatMessages.ts
|
|
3877
4093
|
function useChatMessages() {
|
|
3878
4094
|
const { chatMessages: rawMessages, send, isSending } = useChat();
|
|
3879
|
-
const { localParticipant } =
|
|
4095
|
+
const { localParticipant } = useLocalParticipant6();
|
|
3880
4096
|
const localIdentity = localParticipant.identity;
|
|
3881
4097
|
const chatMessages = useMemo3(() => {
|
|
3882
4098
|
const sortedMessages = rawMessages.map((msg) => ({
|
|
@@ -3892,11 +4108,11 @@ function useChatMessages() {
|
|
|
3892
4108
|
}
|
|
3893
4109
|
|
|
3894
4110
|
// src/hooks/useStreamingTranscript.ts
|
|
3895
|
-
import { useLocalParticipant as
|
|
4111
|
+
import { useLocalParticipant as useLocalParticipant7, useTranscriptions } from "@livekit/components-react/hooks";
|
|
3896
4112
|
import { useMemo as useMemo4 } from "react";
|
|
3897
4113
|
function useStreamingTranscript() {
|
|
3898
4114
|
const transcriptions = useTranscriptions();
|
|
3899
|
-
const { localParticipant } =
|
|
4115
|
+
const { localParticipant } = useLocalParticipant7();
|
|
3900
4116
|
const localIdentity = localParticipant.identity;
|
|
3901
4117
|
const transcriptMessages = useMemo4(() => filterSystemMessages(transcriptions.filter((stream) => stream.text.trim().length > 0).map((stream) => ({
|
|
3902
4118
|
id: stream.streamInfo.id,
|
|
@@ -3947,7 +4163,7 @@ function useCombinedMessages() {
|
|
|
3947
4163
|
}
|
|
3948
4164
|
|
|
3949
4165
|
// src/hooks/useSessionRemaining.ts
|
|
3950
|
-
import { useEffect as
|
|
4166
|
+
import { useEffect as useEffect17, useRef as useRef12, useState as useState12 } from "react";
|
|
3951
4167
|
|
|
3952
4168
|
// src/lib/format.ts
|
|
3953
4169
|
function formatTime(seconds) {
|
|
@@ -3964,8 +4180,8 @@ function parseNumber(s) {
|
|
|
3964
4180
|
function useSessionRemaining() {
|
|
3965
4181
|
const maxCallDuration = useAgentState("maxCallDuration", parseNumber, null);
|
|
3966
4182
|
const endTimeRef = useRef12(null);
|
|
3967
|
-
const [remaining, setRemaining] =
|
|
3968
|
-
|
|
4183
|
+
const [remaining, setRemaining] = useState12(null);
|
|
4184
|
+
useEffect17(() => {
|
|
3969
4185
|
if (maxCallDuration === null || endTimeRef.current !== null)
|
|
3970
4186
|
return;
|
|
3971
4187
|
const endTime = Date.now() + maxCallDuration * 1000;
|
|
@@ -3982,25 +4198,25 @@ function useSessionRemaining() {
|
|
|
3982
4198
|
}
|
|
3983
4199
|
|
|
3984
4200
|
// src/hooks/useTextMode.ts
|
|
3985
|
-
import { useLocalParticipant as
|
|
3986
|
-
import { useCallback as
|
|
3987
|
-
var
|
|
4201
|
+
import { useLocalParticipant as useLocalParticipant8 } from "@livekit/components-react/hooks";
|
|
4202
|
+
import { useCallback as useCallback11, useContext as useContext8, useRef as useRef13 } from "react";
|
|
4203
|
+
var textEncoder4 = new TextEncoder;
|
|
3988
4204
|
function useTextMode() {
|
|
3989
4205
|
const ctx = useContext8(LiveAgentContext);
|
|
3990
4206
|
if (!ctx) {
|
|
3991
4207
|
throw new Error("useTextMode must be used within a <LiveAgent> provider");
|
|
3992
4208
|
}
|
|
3993
4209
|
const { textMode, setTextModeState, sidebarTab, setSidebarTab } = ctx;
|
|
3994
|
-
const { localParticipant } =
|
|
4210
|
+
const { localParticipant } = useLocalParticipant8();
|
|
3995
4211
|
const confirmedTextModeRef = useRef13(false);
|
|
3996
|
-
const toggleTextMode =
|
|
4212
|
+
const toggleTextMode = useCallback11(async () => {
|
|
3997
4213
|
const next = !textMode;
|
|
3998
4214
|
setTextModeState(next);
|
|
3999
4215
|
if (next && sidebarTab === "agenda") {
|
|
4000
4216
|
setSidebarTab("chat");
|
|
4001
4217
|
}
|
|
4002
4218
|
try {
|
|
4003
|
-
await localParticipant.publishData(
|
|
4219
|
+
await localParticipant.publishData(textEncoder4.encode(JSON.stringify({ textMode: next })), {
|
|
4004
4220
|
reliable: true,
|
|
4005
4221
|
topic: TEXT_MODE_TOPIC
|
|
4006
4222
|
});
|
|
@@ -4018,10 +4234,10 @@ function useTextMode() {
|
|
|
4018
4234
|
import { useContext as useContext9 } from "react";
|
|
4019
4235
|
|
|
4020
4236
|
// src/hooks/useElapsedSeconds.ts
|
|
4021
|
-
import { useEffect as
|
|
4237
|
+
import { useEffect as useEffect18, useState as useState13 } from "react";
|
|
4022
4238
|
function useElapsedSeconds(isRunning) {
|
|
4023
|
-
const [elapsed, setElapsed] =
|
|
4024
|
-
|
|
4239
|
+
const [elapsed, setElapsed] = useState13(0);
|
|
4240
|
+
useEffect18(() => {
|
|
4025
4241
|
if (!isRunning) {
|
|
4026
4242
|
setElapsed(0);
|
|
4027
4243
|
return;
|
|
@@ -4125,7 +4341,7 @@ function LoadingDots({ label }) {
|
|
|
4125
4341
|
}
|
|
4126
4342
|
|
|
4127
4343
|
// src/components/LoginFlow.tsx
|
|
4128
|
-
import { useCallback as
|
|
4344
|
+
import { useCallback as useCallback12, useEffect as useEffect19, useRef as useRef14, useState as useState14 } from "react";
|
|
4129
4345
|
|
|
4130
4346
|
// src/components/ui/button.tsx
|
|
4131
4347
|
import { forwardRef as forwardRef3 } from "react";
|
|
@@ -4161,20 +4377,20 @@ import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
|
4161
4377
|
var OTP_LENGTH = 6;
|
|
4162
4378
|
var DIGIT_KEYS = ["d0", "d1", "d2", "d3", "d4", "d5"];
|
|
4163
4379
|
function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
|
|
4164
|
-
const [step, setStep] =
|
|
4165
|
-
const [email, setEmail] =
|
|
4166
|
-
const handleRequestOtp =
|
|
4380
|
+
const [step, setStep] = useState14("email");
|
|
4381
|
+
const [email, setEmail] = useState14("");
|
|
4382
|
+
const handleRequestOtp = useCallback12(async (emailValue) => {
|
|
4167
4383
|
const success = await requestOtp(emailValue);
|
|
4168
4384
|
if (success)
|
|
4169
4385
|
setStep("otp");
|
|
4170
4386
|
}, [requestOtp]);
|
|
4171
|
-
const handleVerifyOtp =
|
|
4387
|
+
const handleVerifyOtp = useCallback12(async (code) => {
|
|
4172
4388
|
await verifyOtp(email, code);
|
|
4173
4389
|
}, [verifyOtp, email]);
|
|
4174
|
-
const handleBack =
|
|
4390
|
+
const handleBack = useCallback12(() => {
|
|
4175
4391
|
setStep("email");
|
|
4176
4392
|
}, []);
|
|
4177
|
-
const handleResend =
|
|
4393
|
+
const handleResend = useCallback12(async () => {
|
|
4178
4394
|
await requestOtp(email);
|
|
4179
4395
|
}, [requestOtp, email]);
|
|
4180
4396
|
if (step === "otp") {
|
|
@@ -4251,30 +4467,30 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
|
|
|
4251
4467
|
});
|
|
4252
4468
|
}
|
|
4253
4469
|
function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
4254
|
-
const [digits, setDigits] =
|
|
4255
|
-
const [resendCooldown, setResendCooldown] =
|
|
4470
|
+
const [digits, setDigits] = useState14(Array(OTP_LENGTH).fill(""));
|
|
4471
|
+
const [resendCooldown, setResendCooldown] = useState14(0);
|
|
4256
4472
|
const inputRefs = useRef14([]);
|
|
4257
4473
|
const submittedRef = useRef14(false);
|
|
4258
|
-
|
|
4474
|
+
useEffect19(() => {
|
|
4259
4475
|
inputRefs.current[0]?.focus();
|
|
4260
4476
|
}, []);
|
|
4261
|
-
|
|
4477
|
+
useEffect19(() => {
|
|
4262
4478
|
if (error)
|
|
4263
4479
|
submittedRef.current = false;
|
|
4264
4480
|
}, [error]);
|
|
4265
|
-
|
|
4481
|
+
useEffect19(() => {
|
|
4266
4482
|
if (resendCooldown <= 0)
|
|
4267
4483
|
return;
|
|
4268
4484
|
const timer = setTimeout(() => setResendCooldown((c) => c - 1), 1000);
|
|
4269
4485
|
return () => clearTimeout(timer);
|
|
4270
4486
|
}, [resendCooldown]);
|
|
4271
|
-
const submitCode =
|
|
4487
|
+
const submitCode = useCallback12((code) => {
|
|
4272
4488
|
if (submittedRef.current || isSubmitting)
|
|
4273
4489
|
return;
|
|
4274
4490
|
submittedRef.current = true;
|
|
4275
4491
|
onSubmit(code);
|
|
4276
4492
|
}, [onSubmit, isSubmitting]);
|
|
4277
|
-
const handleDigitChange =
|
|
4493
|
+
const handleDigitChange = useCallback12((index2, value) => {
|
|
4278
4494
|
const digit = value.replace(/\D/g, "").slice(-1);
|
|
4279
4495
|
const newDigits = [...digits];
|
|
4280
4496
|
newDigits[index2] = digit;
|
|
@@ -4288,12 +4504,12 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
|
4288
4504
|
submitCode(code);
|
|
4289
4505
|
}
|
|
4290
4506
|
}, [digits, submitCode]);
|
|
4291
|
-
const handleKeyDown =
|
|
4507
|
+
const handleKeyDown = useCallback12((index2, e) => {
|
|
4292
4508
|
if (e.key === "Backspace" && !digits[index2] && index2 > 0) {
|
|
4293
4509
|
inputRefs.current[index2 - 1]?.focus();
|
|
4294
4510
|
}
|
|
4295
4511
|
}, [digits]);
|
|
4296
|
-
const handlePaste =
|
|
4512
|
+
const handlePaste = useCallback12((e) => {
|
|
4297
4513
|
e.preventDefault();
|
|
4298
4514
|
const pasted = e.clipboardData.getData("text").replace(/\D/g, "").slice(0, OTP_LENGTH);
|
|
4299
4515
|
if (pasted.length > 0) {
|
|
@@ -4403,17 +4619,17 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
|
4403
4619
|
}
|
|
4404
4620
|
|
|
4405
4621
|
// src/components/MessageList.tsx
|
|
4406
|
-
import { useLayoutEffect as useLayoutEffect3, useRef as useRef16 } from "react";
|
|
4622
|
+
import { useCallback as useCallback13, useLayoutEffect as useLayoutEffect3, useRef as useRef16, useState as useState16 } from "react";
|
|
4407
4623
|
|
|
4408
4624
|
// src/components/ChatInput.tsx
|
|
4409
|
-
import { useEffect as
|
|
4625
|
+
import { useEffect as useEffect20, useRef as useRef15, useState as useState15 } from "react";
|
|
4410
4626
|
import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
4411
4627
|
var MAX_INPUT_HEIGHT = 60;
|
|
4412
4628
|
function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
|
|
4413
|
-
const [inputText, setInputText] =
|
|
4629
|
+
const [inputText, setInputText] = useState15("");
|
|
4414
4630
|
const textareaRef = useRef15(null);
|
|
4415
4631
|
const canSend = inputText.trim().length > 0 && !isSendingChat;
|
|
4416
|
-
|
|
4632
|
+
useEffect20(() => {
|
|
4417
4633
|
if (autoFocus)
|
|
4418
4634
|
textareaRef.current?.focus();
|
|
4419
4635
|
}, [autoFocus]);
|
|
@@ -4511,34 +4727,110 @@ function ChatMessage({ message }) {
|
|
|
4511
4727
|
});
|
|
4512
4728
|
}
|
|
4513
4729
|
|
|
4514
|
-
// src/components/
|
|
4730
|
+
// src/components/PlanCard.tsx
|
|
4731
|
+
import { useEffect as useEffect21 } from "react";
|
|
4515
4732
|
import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
4516
|
-
|
|
4733
|
+
var APPROVE_MESSAGE = "Yes, go ahead.";
|
|
4734
|
+
var CANCEL_MESSAGE = "No, cancel that.";
|
|
4735
|
+
var COMPLETED_CARD_VISIBLE_MS = 2500;
|
|
4736
|
+
function StepIcon({ status }) {
|
|
4737
|
+
if (status === "done") {
|
|
4738
|
+
return /* @__PURE__ */ jsx13(CircleCheck, {
|
|
4739
|
+
className: "skippr:size-4 skippr:text-chart-3"
|
|
4740
|
+
});
|
|
4741
|
+
}
|
|
4742
|
+
if (status === "failed") {
|
|
4743
|
+
return /* @__PURE__ */ jsx13(CircleX, {
|
|
4744
|
+
className: "skippr:size-4 skippr:text-destructive"
|
|
4745
|
+
});
|
|
4746
|
+
}
|
|
4747
|
+
if (status === "active") {
|
|
4748
|
+
return /* @__PURE__ */ jsx13(Circle, {
|
|
4749
|
+
className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
|
|
4750
|
+
});
|
|
4751
|
+
}
|
|
4752
|
+
return /* @__PURE__ */ jsx13(Circle, {
|
|
4753
|
+
className: "skippr:size-4 skippr:text-muted-foreground/30"
|
|
4754
|
+
});
|
|
4755
|
+
}
|
|
4756
|
+
function PlanCard({ plan, sendChatMessage, onDismiss }) {
|
|
4757
|
+
const awaitingApproval = plan.state === "proposed";
|
|
4758
|
+
useEffect21(() => {
|
|
4759
|
+
if (plan.state !== "completed")
|
|
4760
|
+
return;
|
|
4761
|
+
const timer = setTimeout(onDismiss, COMPLETED_CARD_VISIBLE_MS);
|
|
4762
|
+
return () => clearTimeout(timer);
|
|
4763
|
+
}, [plan.state, onDismiss]);
|
|
4517
4764
|
return /* @__PURE__ */ jsxs11("div", {
|
|
4518
|
-
className: "skippr:
|
|
4765
|
+
className: "skippr:rounded-2xl skippr:rounded-tl-md skippr:bg-card skippr:p-3.5 skippr:ring-2 skippr:ring-brand",
|
|
4519
4766
|
children: [
|
|
4767
|
+
/* @__PURE__ */ jsx13("p", {
|
|
4768
|
+
className: "skippr:mb-3 skippr:text-sm skippr:font-semibold skippr:leading-snug skippr:text-foreground",
|
|
4769
|
+
children: "Plan"
|
|
4770
|
+
}),
|
|
4520
4771
|
/* @__PURE__ */ jsx13("div", {
|
|
4772
|
+
className: "skippr:space-y-2",
|
|
4773
|
+
children: plan.steps.map((step) => /* @__PURE__ */ jsxs11("div", {
|
|
4774
|
+
className: "skippr:flex skippr:items-center skippr:gap-2",
|
|
4775
|
+
children: [
|
|
4776
|
+
/* @__PURE__ */ jsx13(StepIcon, {
|
|
4777
|
+
status: step.status
|
|
4778
|
+
}),
|
|
4779
|
+
/* @__PURE__ */ jsx13("p", {
|
|
4780
|
+
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"),
|
|
4781
|
+
children: step.label
|
|
4782
|
+
})
|
|
4783
|
+
]
|
|
4784
|
+
}, step.index))
|
|
4785
|
+
}),
|
|
4786
|
+
awaitingApproval && /* @__PURE__ */ jsxs11("div", {
|
|
4787
|
+
className: "skippr:mt-3.5 skippr:flex skippr:gap-2",
|
|
4788
|
+
children: [
|
|
4789
|
+
/* @__PURE__ */ jsx13(Button, {
|
|
4790
|
+
className: "skippr:flex-1 skippr:py-2",
|
|
4791
|
+
onClick: () => sendChatMessage(APPROVE_MESSAGE),
|
|
4792
|
+
children: "Approve"
|
|
4793
|
+
}),
|
|
4794
|
+
/* @__PURE__ */ jsx13(Button, {
|
|
4795
|
+
variant: "outline",
|
|
4796
|
+
className: "skippr:flex-1 skippr:py-2",
|
|
4797
|
+
onClick: () => sendChatMessage(CANCEL_MESSAGE),
|
|
4798
|
+
children: "Cancel"
|
|
4799
|
+
})
|
|
4800
|
+
]
|
|
4801
|
+
})
|
|
4802
|
+
]
|
|
4803
|
+
});
|
|
4804
|
+
}
|
|
4805
|
+
|
|
4806
|
+
// src/components/TypingIndicator.tsx
|
|
4807
|
+
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
4808
|
+
function TypingIndicator() {
|
|
4809
|
+
return /* @__PURE__ */ jsxs12("div", {
|
|
4810
|
+
className: "skippr:flex skippr:items-start skippr:gap-2 skippr:animate-skippr-tab-fade",
|
|
4811
|
+
children: [
|
|
4812
|
+
/* @__PURE__ */ jsx14("div", {
|
|
4521
4813
|
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__ */
|
|
4814
|
+
children: /* @__PURE__ */ jsx14(Sparkles, {
|
|
4523
4815
|
className: "skippr:size-3.5 skippr:text-primary-foreground"
|
|
4524
4816
|
})
|
|
4525
4817
|
}),
|
|
4526
|
-
/* @__PURE__ */
|
|
4818
|
+
/* @__PURE__ */ jsxs12("div", {
|
|
4527
4819
|
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
4820
|
children: [
|
|
4529
|
-
/* @__PURE__ */
|
|
4821
|
+
/* @__PURE__ */ jsx14("span", {
|
|
4530
4822
|
children: "Agent is analyzing your screen"
|
|
4531
4823
|
}),
|
|
4532
|
-
/* @__PURE__ */
|
|
4824
|
+
/* @__PURE__ */ jsxs12("span", {
|
|
4533
4825
|
className: "skippr:inline-flex skippr:items-center skippr:gap-[2px]",
|
|
4534
4826
|
children: [
|
|
4535
|
-
/* @__PURE__ */
|
|
4827
|
+
/* @__PURE__ */ jsx14("span", {
|
|
4536
4828
|
className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:0ms]"
|
|
4537
4829
|
}),
|
|
4538
|
-
/* @__PURE__ */
|
|
4830
|
+
/* @__PURE__ */ jsx14("span", {
|
|
4539
4831
|
className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:200ms]"
|
|
4540
4832
|
}),
|
|
4541
|
-
/* @__PURE__ */
|
|
4833
|
+
/* @__PURE__ */ jsx14("span", {
|
|
4542
4834
|
className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:400ms]"
|
|
4543
4835
|
})
|
|
4544
4836
|
]
|
|
@@ -4550,16 +4842,25 @@ function TypingIndicator() {
|
|
|
4550
4842
|
}
|
|
4551
4843
|
|
|
4552
4844
|
// src/components/MessageList.tsx
|
|
4553
|
-
import { jsx as
|
|
4845
|
+
import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
4846
|
+
function isPlanVisible(plan) {
|
|
4847
|
+
return !!plan && plan.steps.length > 0 && plan.state !== "abandoned";
|
|
4848
|
+
}
|
|
4554
4849
|
function MessageList({
|
|
4555
4850
|
messages,
|
|
4556
4851
|
isStreaming,
|
|
4557
4852
|
sendChatMessage,
|
|
4558
4853
|
isSendingChat,
|
|
4854
|
+
plan,
|
|
4559
4855
|
autoFocus = false
|
|
4560
4856
|
}) {
|
|
4561
4857
|
const containerRef = useRef16(null);
|
|
4562
4858
|
const lastMessage = messages.length > 0 ? messages[messages.length - 1] : undefined;
|
|
4859
|
+
const [dismissedPlanId, setDismissedPlanId] = useState16(null);
|
|
4860
|
+
const dismissPlan = useCallback13(() => {
|
|
4861
|
+
if (plan)
|
|
4862
|
+
setDismissedPlanId(plan.planId);
|
|
4863
|
+
}, [plan]);
|
|
4563
4864
|
useLayoutEffect3(() => {
|
|
4564
4865
|
const container = containerRef.current;
|
|
4565
4866
|
if (!container)
|
|
@@ -4569,23 +4870,31 @@ function MessageList({
|
|
|
4569
4870
|
container.scrollTop = container.scrollHeight;
|
|
4570
4871
|
}, [messages.length, lastMessage?.content]);
|
|
4571
4872
|
const showTyping = isStreaming && lastMessage?.role === "assistant" && lastMessage.content === "";
|
|
4572
|
-
return /* @__PURE__ */
|
|
4873
|
+
return /* @__PURE__ */ jsxs13("div", {
|
|
4573
4874
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
|
|
4574
4875
|
children: [
|
|
4575
|
-
/* @__PURE__ */
|
|
4876
|
+
/* @__PURE__ */ jsxs13("div", {
|
|
4576
4877
|
ref: containerRef,
|
|
4577
4878
|
className: "skippr:min-h-0 skippr:flex-1 skippr:space-y-4 skippr:overflow-y-auto skippr:p-4 skippr:[overflow-anchor:none]",
|
|
4578
4879
|
children: [
|
|
4579
|
-
messages.length === 0 && !showTyping && /* @__PURE__ */
|
|
4880
|
+
messages.length === 0 && !showTyping && /* @__PURE__ */ jsx15(LoadingDots, {
|
|
4580
4881
|
label: "Waiting for conversation to begin..."
|
|
4581
4882
|
}),
|
|
4582
|
-
messages.map((message) => /* @__PURE__ */
|
|
4883
|
+
messages.map((message) => /* @__PURE__ */ jsx15(ChatMessage, {
|
|
4583
4884
|
message
|
|
4584
4885
|
}, message.id)),
|
|
4585
|
-
showTyping && /* @__PURE__ */
|
|
4886
|
+
showTyping && /* @__PURE__ */ jsx15(TypingIndicator, {})
|
|
4586
4887
|
]
|
|
4587
4888
|
}),
|
|
4588
|
-
/* @__PURE__ */
|
|
4889
|
+
isPlanVisible(plan) && plan.planId !== dismissedPlanId && /* @__PURE__ */ jsx15("div", {
|
|
4890
|
+
className: "skippr:shrink-0 skippr:border-t skippr:border-border skippr:p-3",
|
|
4891
|
+
children: /* @__PURE__ */ jsx15(PlanCard, {
|
|
4892
|
+
plan,
|
|
4893
|
+
sendChatMessage,
|
|
4894
|
+
onDismiss: dismissPlan
|
|
4895
|
+
}, plan.planId)
|
|
4896
|
+
}),
|
|
4897
|
+
/* @__PURE__ */ jsx15(ChatInput, {
|
|
4589
4898
|
sendChatMessage,
|
|
4590
4899
|
isSendingChat,
|
|
4591
4900
|
autoFocus
|
|
@@ -4595,49 +4904,49 @@ function MessageList({
|
|
|
4595
4904
|
}
|
|
4596
4905
|
|
|
4597
4906
|
// src/components/SessionAgenda.tsx
|
|
4598
|
-
import { jsx as
|
|
4907
|
+
import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
4599
4908
|
function SessionAgenda({ phases, hasStarted }) {
|
|
4600
4909
|
if (phases.length === 0 || !hasStarted) {
|
|
4601
|
-
return /* @__PURE__ */
|
|
4910
|
+
return /* @__PURE__ */ jsx16("div", {
|
|
4602
4911
|
className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
|
|
4603
|
-
children: /* @__PURE__ */
|
|
4912
|
+
children: /* @__PURE__ */ jsx16(LoadingDots, {
|
|
4604
4913
|
label: "Waiting for agenda to load..."
|
|
4605
4914
|
})
|
|
4606
4915
|
});
|
|
4607
4916
|
}
|
|
4608
|
-
return /* @__PURE__ */
|
|
4917
|
+
return /* @__PURE__ */ jsx16("div", {
|
|
4609
4918
|
className: "skippr:flex-1 skippr:overflow-y-auto skippr:px-4 skippr:py-4",
|
|
4610
|
-
children: /* @__PURE__ */
|
|
4919
|
+
children: /* @__PURE__ */ jsx16("div", {
|
|
4611
4920
|
className: "skippr:space-y-1",
|
|
4612
4921
|
children: phases.map((phase) => {
|
|
4613
4922
|
const isActive = phase.status === "active";
|
|
4614
4923
|
const isCompleted = phase.status === "completed";
|
|
4615
|
-
return /* @__PURE__ */
|
|
4924
|
+
return /* @__PURE__ */ jsxs14("div", {
|
|
4616
4925
|
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
4926
|
children: [
|
|
4618
|
-
/* @__PURE__ */
|
|
4927
|
+
/* @__PURE__ */ jsx16("div", {
|
|
4619
4928
|
className: "skippr:mt-0.5",
|
|
4620
|
-
children: isCompleted ? /* @__PURE__ */
|
|
4929
|
+
children: isCompleted ? /* @__PURE__ */ jsx16(CircleCheck, {
|
|
4621
4930
|
className: "skippr:size-4 skippr:text-chart-3"
|
|
4622
|
-
}) : isActive ? /* @__PURE__ */
|
|
4931
|
+
}) : isActive ? /* @__PURE__ */ jsx16(Circle, {
|
|
4623
4932
|
className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
|
|
4624
|
-
}) : /* @__PURE__ */
|
|
4933
|
+
}) : /* @__PURE__ */ jsx16(Circle, {
|
|
4625
4934
|
className: "skippr:size-4 skippr:text-muted-foreground/30"
|
|
4626
4935
|
})
|
|
4627
4936
|
}),
|
|
4628
|
-
/* @__PURE__ */
|
|
4937
|
+
/* @__PURE__ */ jsxs14("div", {
|
|
4629
4938
|
className: "skippr:min-w-0 skippr:flex-1",
|
|
4630
4939
|
children: [
|
|
4631
|
-
/* @__PURE__ */
|
|
4940
|
+
/* @__PURE__ */ jsx16("p", {
|
|
4632
4941
|
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
4942
|
children: phase.name
|
|
4634
4943
|
}),
|
|
4635
|
-
phase.highlights.length > 0 && /* @__PURE__ */
|
|
4944
|
+
phase.highlights.length > 0 && /* @__PURE__ */ jsx16("ul", {
|
|
4636
4945
|
className: "skippr:mt-1 skippr:space-y-0.5",
|
|
4637
|
-
children: phase.highlights.map((text) => /* @__PURE__ */
|
|
4946
|
+
children: phase.highlights.map((text) => /* @__PURE__ */ jsxs14("li", {
|
|
4638
4947
|
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
4948
|
children: [
|
|
4640
|
-
/* @__PURE__ */
|
|
4949
|
+
/* @__PURE__ */ jsx16("span", {
|
|
4641
4950
|
className: "skippr:size-1 skippr:shrink-0 skippr:rounded-full skippr:bg-current"
|
|
4642
4951
|
}),
|
|
4643
4952
|
text
|
|
@@ -4654,12 +4963,12 @@ function SessionAgenda({ phases, hasStarted }) {
|
|
|
4654
4963
|
}
|
|
4655
4964
|
|
|
4656
4965
|
// src/components/SessionWarningBanner.tsx
|
|
4657
|
-
import { jsx as
|
|
4966
|
+
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
4658
4967
|
var SESSION_WARNING_THRESHOLD_SECS = 60;
|
|
4659
4968
|
function SessionWarningBanner({ remaining }) {
|
|
4660
4969
|
if (remaining === null || remaining <= 0 || remaining > SESSION_WARNING_THRESHOLD_SECS)
|
|
4661
4970
|
return null;
|
|
4662
|
-
return /* @__PURE__ */
|
|
4971
|
+
return /* @__PURE__ */ jsx17("div", {
|
|
4663
4972
|
"data-testid": "session-warning-banner",
|
|
4664
4973
|
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
4974
|
children: "Session ending soon"
|
|
@@ -4667,7 +4976,7 @@ function SessionWarningBanner({ remaining }) {
|
|
|
4667
4976
|
}
|
|
4668
4977
|
|
|
4669
4978
|
// src/components/StartSessionPrompt.tsx
|
|
4670
|
-
import { jsx as
|
|
4979
|
+
import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
4671
4980
|
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
4981
|
function StartSessionPrompt({
|
|
4673
4982
|
onStartSession,
|
|
@@ -4679,16 +4988,16 @@ function StartSessionPrompt({
|
|
|
4679
4988
|
canResume = false,
|
|
4680
4989
|
onResume
|
|
4681
4990
|
}) {
|
|
4682
|
-
return /* @__PURE__ */
|
|
4991
|
+
return /* @__PURE__ */ jsxs15("div", {
|
|
4683
4992
|
className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:px-4",
|
|
4684
4993
|
children: [
|
|
4685
|
-
canResume && onResume ? /* @__PURE__ */
|
|
4994
|
+
canResume && onResume ? /* @__PURE__ */ jsx18("button", {
|
|
4686
4995
|
type: "button",
|
|
4687
4996
|
onClick: onResume,
|
|
4688
4997
|
disabled: isStarting,
|
|
4689
4998
|
className: PROMPT_BUTTON,
|
|
4690
4999
|
children: isStarting ? "Resuming..." : "Resume session"
|
|
4691
|
-
}) : /* @__PURE__ */
|
|
5000
|
+
}) : /* @__PURE__ */ jsx18("button", {
|
|
4692
5001
|
type: "button",
|
|
4693
5002
|
onClick: () => {
|
|
4694
5003
|
if (!agentId)
|
|
@@ -4699,7 +5008,7 @@ function StartSessionPrompt({
|
|
|
4699
5008
|
className: PROMPT_BUTTON,
|
|
4700
5009
|
children: isStarting ? "Starting..." : label
|
|
4701
5010
|
}),
|
|
4702
|
-
error && /* @__PURE__ */
|
|
5011
|
+
error && /* @__PURE__ */ jsx18("p", {
|
|
4703
5012
|
className: "skippr:text-xs skippr:text-destructive",
|
|
4704
5013
|
children: error
|
|
4705
5014
|
})
|
|
@@ -4708,7 +5017,7 @@ function StartSessionPrompt({
|
|
|
4708
5017
|
}
|
|
4709
5018
|
|
|
4710
5019
|
// src/components/Sidebar.tsx
|
|
4711
|
-
import { jsx as
|
|
5020
|
+
import { jsx as jsx19, jsxs as jsxs16, Fragment as Fragment2 } from "react/jsx-runtime";
|
|
4712
5021
|
var PANEL_GAP_PX = 12;
|
|
4713
5022
|
var PANEL_VIEWPORT_MARGIN_PX = 24;
|
|
4714
5023
|
var PANEL_MAX_HEIGHT_PX = 460;
|
|
@@ -4762,7 +5071,7 @@ function Sidebar({
|
|
|
4762
5071
|
height: panelExpanded ? availableHeight : `min(${PANEL_MAX_HEIGHT_PX}px, ${availableHeight})`
|
|
4763
5072
|
};
|
|
4764
5073
|
}
|
|
4765
|
-
|
|
5074
|
+
useEffect22(() => {
|
|
4766
5075
|
if (!isSidebar)
|
|
4767
5076
|
return;
|
|
4768
5077
|
const prop = position === "right" ? "marginRight" : "marginLeft";
|
|
@@ -4776,13 +5085,13 @@ function Sidebar({
|
|
|
4776
5085
|
document.body.style.transition = "";
|
|
4777
5086
|
};
|
|
4778
5087
|
}, [isSidebar, isPanelOpen, position]);
|
|
4779
|
-
return /* @__PURE__ */
|
|
5088
|
+
return /* @__PURE__ */ jsxs16("div", {
|
|
4780
5089
|
ref: internalCtx?.panelRef,
|
|
4781
5090
|
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
5091
|
style: { width: isPanelOpen ? SIDEBAR_WIDTH : undefined, ...floatingStyle },
|
|
4783
5092
|
children: [
|
|
4784
|
-
!hideHeader && /* @__PURE__ */
|
|
4785
|
-
authFailed ? /* @__PURE__ */
|
|
5093
|
+
!hideHeader && /* @__PURE__ */ jsx19(ChatHeader, {}),
|
|
5094
|
+
authFailed ? /* @__PURE__ */ jsx19(AuthError, {}) : isAuthenticated ? /* @__PURE__ */ jsx19(AuthenticatedContent, {
|
|
4786
5095
|
isConnected,
|
|
4787
5096
|
isPaused,
|
|
4788
5097
|
isPausing,
|
|
@@ -4800,12 +5109,12 @@ function Sidebar({
|
|
|
4800
5109
|
agentId,
|
|
4801
5110
|
agentControls,
|
|
4802
5111
|
showAgenda
|
|
4803
|
-
}) : usesHostAuth || isValidating ? /* @__PURE__ */
|
|
5112
|
+
}) : usesHostAuth || isValidating ? /* @__PURE__ */ jsx19("div", {
|
|
4804
5113
|
className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
|
|
4805
|
-
children: /* @__PURE__ */
|
|
5114
|
+
children: /* @__PURE__ */ jsx19(LoadingDots, {
|
|
4806
5115
|
label: "Loading..."
|
|
4807
5116
|
})
|
|
4808
|
-
}) : /* @__PURE__ */
|
|
5117
|
+
}) : /* @__PURE__ */ jsx19(LoginFlow, {
|
|
4809
5118
|
requestOtp,
|
|
4810
5119
|
verifyOtp,
|
|
4811
5120
|
error: authError,
|
|
@@ -4843,63 +5152,63 @@ function AuthenticatedContent({
|
|
|
4843
5152
|
} else if (isPaused) {
|
|
4844
5153
|
transitionLabel = "Paused";
|
|
4845
5154
|
}
|
|
4846
|
-
return /* @__PURE__ */
|
|
5155
|
+
return /* @__PURE__ */ jsxs16(Fragment2, {
|
|
4847
5156
|
children: [
|
|
4848
|
-
isConnected && /* @__PURE__ */
|
|
4849
|
-
/* @__PURE__ */
|
|
5157
|
+
isConnected && /* @__PURE__ */ jsx19(ConnectedBanner, {}),
|
|
5158
|
+
/* @__PURE__ */ jsxs16("div", {
|
|
4850
5159
|
className: "skippr:flex skippr:items-center skippr:gap-2 skippr:border-b skippr:border-border skippr:px-3 skippr:py-1",
|
|
4851
5160
|
children: [
|
|
4852
|
-
/* @__PURE__ */
|
|
5161
|
+
/* @__PURE__ */ jsxs16("button", {
|
|
4853
5162
|
type: "button",
|
|
4854
5163
|
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
5164
|
onClick: () => onTabChange("chat"),
|
|
4856
5165
|
children: [
|
|
4857
|
-
/* @__PURE__ */
|
|
5166
|
+
/* @__PURE__ */ jsx19(MessageCircle, {
|
|
4858
5167
|
className: "skippr:size-3.5"
|
|
4859
5168
|
}),
|
|
4860
5169
|
"Chat",
|
|
4861
|
-
activeTab === "chat" && /* @__PURE__ */
|
|
5170
|
+
activeTab === "chat" && /* @__PURE__ */ jsx19("span", {
|
|
4862
5171
|
className: "skippr:absolute skippr:-bottom-1 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
|
|
4863
5172
|
})
|
|
4864
5173
|
]
|
|
4865
5174
|
}),
|
|
4866
|
-
showAgenda && /* @__PURE__ */
|
|
5175
|
+
showAgenda && /* @__PURE__ */ jsxs16("button", {
|
|
4867
5176
|
type: "button",
|
|
4868
5177
|
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
5178
|
onClick: () => onTabChange("agenda"),
|
|
4870
5179
|
children: [
|
|
4871
|
-
/* @__PURE__ */
|
|
5180
|
+
/* @__PURE__ */ jsx19(Calendar, {
|
|
4872
5181
|
className: "skippr:size-3.5"
|
|
4873
5182
|
}),
|
|
4874
5183
|
"Agenda",
|
|
4875
|
-
activeTab === "agenda" && /* @__PURE__ */
|
|
5184
|
+
activeTab === "agenda" && /* @__PURE__ */ jsx19("span", {
|
|
4876
5185
|
className: "skippr:absolute skippr:-bottom-1 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
|
|
4877
5186
|
})
|
|
4878
5187
|
]
|
|
4879
5188
|
})
|
|
4880
5189
|
]
|
|
4881
5190
|
}),
|
|
4882
|
-
/* @__PURE__ */
|
|
5191
|
+
/* @__PURE__ */ jsx19("div", {
|
|
4883
5192
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
|
|
4884
|
-
children: isDisconnecting ? /* @__PURE__ */
|
|
5193
|
+
children: isDisconnecting ? /* @__PURE__ */ jsx19("div", {
|
|
4885
5194
|
className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
|
|
4886
|
-
children: /* @__PURE__ */
|
|
5195
|
+
children: /* @__PURE__ */ jsx19(LoadingDots, {
|
|
4887
5196
|
label: "Ending session..."
|
|
4888
5197
|
})
|
|
4889
|
-
}) : inSession ? /* @__PURE__ */
|
|
5198
|
+
}) : inSession ? /* @__PURE__ */ jsxs16(Fragment2, {
|
|
4890
5199
|
children: [
|
|
4891
|
-
transitionLabel && /* @__PURE__ */
|
|
5200
|
+
transitionLabel && /* @__PURE__ */ jsx19("div", {
|
|
4892
5201
|
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
5202
|
children: transitionLabel
|
|
4894
5203
|
}),
|
|
4895
|
-
/* @__PURE__ */
|
|
5204
|
+
/* @__PURE__ */ jsx19(ConnectedBody, {
|
|
4896
5205
|
activeTab: effectiveTab,
|
|
4897
5206
|
autoFocusChat
|
|
4898
5207
|
})
|
|
4899
5208
|
]
|
|
4900
|
-
}) : /* @__PURE__ */
|
|
5209
|
+
}) : /* @__PURE__ */ jsx19("div", {
|
|
4901
5210
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
|
|
4902
|
-
children: /* @__PURE__ */
|
|
5211
|
+
children: /* @__PURE__ */ jsx19(StartSessionPrompt, {
|
|
4903
5212
|
onStartSession,
|
|
4904
5213
|
agentId,
|
|
4905
5214
|
agentControls,
|
|
@@ -4911,11 +5220,11 @@ function AuthenticatedContent({
|
|
|
4911
5220
|
})
|
|
4912
5221
|
}, `${activeTab}-empty`)
|
|
4913
5222
|
}),
|
|
4914
|
-
!hideControls && /* @__PURE__ */
|
|
5223
|
+
!hideControls && /* @__PURE__ */ jsxs16("div", {
|
|
4915
5224
|
className: "skippr:shrink-0 skippr:border-t skippr:border-border",
|
|
4916
5225
|
children: [
|
|
4917
|
-
isConnected && !isDisconnecting && /* @__PURE__ */
|
|
4918
|
-
/* @__PURE__ */
|
|
5226
|
+
isConnected && !isDisconnecting && /* @__PURE__ */ jsx19(ModeToggleRow, {}),
|
|
5227
|
+
/* @__PURE__ */ jsx19("div", {
|
|
4919
5228
|
className: "skippr:px-4 skippr:pt-1.5 skippr:pb-2 skippr:text-center skippr:text-[10px] skippr:text-muted-foreground",
|
|
4920
5229
|
children: "Powered by Skippr"
|
|
4921
5230
|
})
|
|
@@ -4926,23 +5235,23 @@ function AuthenticatedContent({
|
|
|
4926
5235
|
}
|
|
4927
5236
|
function ModeToggleRow() {
|
|
4928
5237
|
const { textMode, toggleTextMode } = useTextMode();
|
|
4929
|
-
return /* @__PURE__ */
|
|
5238
|
+
return /* @__PURE__ */ jsx19("div", {
|
|
4930
5239
|
className: "skippr:flex skippr:justify-center skippr:px-3 skippr:pt-2 skippr:pb-0",
|
|
4931
|
-
children: /* @__PURE__ */
|
|
5240
|
+
children: /* @__PURE__ */ jsx19("button", {
|
|
4932
5241
|
type: "button",
|
|
4933
5242
|
"aria-label": textMode ? "Switch to voice mode" : "Switch to text mode",
|
|
4934
5243
|
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
5244
|
onClick: () => void toggleTextMode(),
|
|
4936
|
-
children: textMode ? /* @__PURE__ */
|
|
5245
|
+
children: textMode ? /* @__PURE__ */ jsxs16(Fragment2, {
|
|
4937
5246
|
children: [
|
|
4938
|
-
/* @__PURE__ */
|
|
5247
|
+
/* @__PURE__ */ jsx19(Mic, {
|
|
4939
5248
|
className: "skippr:size-4"
|
|
4940
5249
|
}),
|
|
4941
5250
|
"Voice mode"
|
|
4942
5251
|
]
|
|
4943
|
-
}) : /* @__PURE__ */
|
|
5252
|
+
}) : /* @__PURE__ */ jsxs16(Fragment2, {
|
|
4944
5253
|
children: [
|
|
4945
|
-
/* @__PURE__ */
|
|
5254
|
+
/* @__PURE__ */ jsx19(MessageSquare, {
|
|
4946
5255
|
className: "skippr:size-4"
|
|
4947
5256
|
}),
|
|
4948
5257
|
"Text mode"
|
|
@@ -4952,17 +5261,17 @@ function ModeToggleRow() {
|
|
|
4952
5261
|
});
|
|
4953
5262
|
}
|
|
4954
5263
|
function AuthError() {
|
|
4955
|
-
return /* @__PURE__ */
|
|
5264
|
+
return /* @__PURE__ */ jsxs16("div", {
|
|
4956
5265
|
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
5266
|
children: [
|
|
4958
|
-
/* @__PURE__ */
|
|
5267
|
+
/* @__PURE__ */ jsx19(CircleAlert, {
|
|
4959
5268
|
className: "skippr:mb-3 skippr:size-7 skippr:text-destructive"
|
|
4960
5269
|
}),
|
|
4961
|
-
/* @__PURE__ */
|
|
5270
|
+
/* @__PURE__ */ jsx19("p", {
|
|
4962
5271
|
className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
|
|
4963
5272
|
children: "We couldn't verify your session"
|
|
4964
5273
|
}),
|
|
4965
|
-
/* @__PURE__ */
|
|
5274
|
+
/* @__PURE__ */ jsx19("p", {
|
|
4966
5275
|
className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
|
|
4967
5276
|
children: "Please contact administrator."
|
|
4968
5277
|
})
|
|
@@ -4971,7 +5280,7 @@ function AuthError() {
|
|
|
4971
5280
|
}
|
|
4972
5281
|
function ConnectedBanner() {
|
|
4973
5282
|
const remaining = useSessionRemaining();
|
|
4974
|
-
return /* @__PURE__ */
|
|
5283
|
+
return /* @__PURE__ */ jsx19(SessionWarningBanner, {
|
|
4975
5284
|
remaining
|
|
4976
5285
|
});
|
|
4977
5286
|
}
|
|
@@ -4981,22 +5290,25 @@ function ConnectedBody({
|
|
|
4981
5290
|
}) {
|
|
4982
5291
|
const { allMessages, agentState, sendChatMessage, isSendingChat } = useCombinedMessages();
|
|
4983
5292
|
const { phases } = usePhaseUpdates();
|
|
5293
|
+
const plan = usePlanUpdates();
|
|
5294
|
+
const { agentControls } = useLiveAgent();
|
|
4984
5295
|
if (activeTab === "agenda") {
|
|
4985
|
-
return /* @__PURE__ */
|
|
5296
|
+
return /* @__PURE__ */ jsx19("div", {
|
|
4986
5297
|
className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto skippr:animate-skippr-tab-fade",
|
|
4987
|
-
children: /* @__PURE__ */
|
|
5298
|
+
children: /* @__PURE__ */ jsx19(SessionAgenda, {
|
|
4988
5299
|
phases,
|
|
4989
5300
|
hasStarted: allMessages.length > 0 || agentState === "speaking"
|
|
4990
5301
|
})
|
|
4991
5302
|
}, "agenda");
|
|
4992
5303
|
}
|
|
4993
|
-
return /* @__PURE__ */
|
|
5304
|
+
return /* @__PURE__ */ jsx19("div", {
|
|
4994
5305
|
className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
|
|
4995
|
-
children: /* @__PURE__ */
|
|
5306
|
+
children: /* @__PURE__ */ jsx19(MessageList, {
|
|
4996
5307
|
messages: allMessages,
|
|
4997
5308
|
isStreaming: agentState === "speaking",
|
|
4998
5309
|
sendChatMessage,
|
|
4999
5310
|
isSendingChat,
|
|
5311
|
+
plan: agentControls?.actions ? plan : null,
|
|
5000
5312
|
autoFocus: autoFocusChat
|
|
5001
5313
|
})
|
|
5002
5314
|
}, "chat");
|
|
@@ -5006,9 +5318,9 @@ function ConnectedBody({
|
|
|
5006
5318
|
import { useContext as useContext11 } from "react";
|
|
5007
5319
|
|
|
5008
5320
|
// src/components/Logo.tsx
|
|
5009
|
-
import { jsx as
|
|
5321
|
+
import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
5010
5322
|
function Logo({ className }) {
|
|
5011
|
-
return /* @__PURE__ */
|
|
5323
|
+
return /* @__PURE__ */ jsxs17("svg", {
|
|
5012
5324
|
width: "1em",
|
|
5013
5325
|
height: "1em",
|
|
5014
5326
|
viewBox: "0 0 200 200",
|
|
@@ -5018,20 +5330,20 @@ function Logo({ className }) {
|
|
|
5018
5330
|
"aria-label": "Skippr",
|
|
5019
5331
|
className,
|
|
5020
5332
|
children: [
|
|
5021
|
-
/* @__PURE__ */
|
|
5333
|
+
/* @__PURE__ */ jsx20("rect", {
|
|
5022
5334
|
width: "200",
|
|
5023
5335
|
height: "200",
|
|
5024
5336
|
rx: "40",
|
|
5025
5337
|
fill: "#2D2D3F"
|
|
5026
5338
|
}),
|
|
5027
|
-
/* @__PURE__ */
|
|
5339
|
+
/* @__PURE__ */ jsxs17("g", {
|
|
5028
5340
|
transform: "translate(100 100) scale(0.8) translate(-100 -100)",
|
|
5029
5341
|
children: [
|
|
5030
|
-
/* @__PURE__ */
|
|
5342
|
+
/* @__PURE__ */ jsx20("path", {
|
|
5031
5343
|
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
5344
|
fill: "white"
|
|
5033
5345
|
}),
|
|
5034
|
-
/* @__PURE__ */
|
|
5346
|
+
/* @__PURE__ */ jsx20("path", {
|
|
5035
5347
|
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
5348
|
className: "skippr:fill-brand"
|
|
5037
5349
|
})
|
|
@@ -5042,7 +5354,7 @@ function Logo({ className }) {
|
|
|
5042
5354
|
}
|
|
5043
5355
|
|
|
5044
5356
|
// src/components/SidebarTrigger.tsx
|
|
5045
|
-
import { jsx as
|
|
5357
|
+
import { jsx as jsx21 } from "react/jsx-runtime";
|
|
5046
5358
|
function SidebarTrigger() {
|
|
5047
5359
|
const {
|
|
5048
5360
|
isPanelOpen,
|
|
@@ -5061,29 +5373,41 @@ function SidebarTrigger() {
|
|
|
5061
5373
|
if (isMinimized || isConnected || isStarting || isPausing)
|
|
5062
5374
|
return null;
|
|
5063
5375
|
const handleClick = isPanelOpen && minimizable ? minimizePanel : togglePanel;
|
|
5064
|
-
return /* @__PURE__ */
|
|
5376
|
+
return /* @__PURE__ */ jsx21("button", {
|
|
5065
5377
|
type: "button",
|
|
5066
5378
|
onClick: handleClick,
|
|
5067
5379
|
title: isPanelOpen ? "Close chat" : "Open chat",
|
|
5068
5380
|
"aria-label": isPanelOpen ? "Close chat" : "Open chat",
|
|
5069
5381
|
style: { bottom: triggerBottomPx(launcherBottomPx, popsDown) },
|
|
5070
5382
|
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__ */
|
|
5383
|
+
children: isPanelOpen ? /* @__PURE__ */ jsx21(ChevronDown, {
|
|
5072
5384
|
className: "skippr:size-5"
|
|
5073
|
-
}) : /* @__PURE__ */
|
|
5385
|
+
}) : /* @__PURE__ */ jsx21(Logo, {
|
|
5074
5386
|
className: "skippr:size-12"
|
|
5075
5387
|
})
|
|
5076
5388
|
});
|
|
5077
5389
|
}
|
|
5078
5390
|
|
|
5079
5391
|
// src/components/LiveAgent.tsx
|
|
5080
|
-
import { jsx as
|
|
5392
|
+
import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
5081
5393
|
function AgentCursorMount({ animated }) {
|
|
5082
|
-
return /* @__PURE__ */
|
|
5394
|
+
return /* @__PURE__ */ jsx22(AgentCursor, {
|
|
5083
5395
|
target: useAgentCursor(),
|
|
5084
5396
|
animated
|
|
5085
5397
|
});
|
|
5086
5398
|
}
|
|
5399
|
+
function PlanPanelOpener() {
|
|
5400
|
+
const plan = usePlanUpdates();
|
|
5401
|
+
const { expandPanel } = useLiveAgent();
|
|
5402
|
+
const surfacedPlanIdRef = useRef17(null);
|
|
5403
|
+
useEffect23(() => {
|
|
5404
|
+
if (plan?.state !== "proposed" || surfacedPlanIdRef.current === plan.planId)
|
|
5405
|
+
return;
|
|
5406
|
+
surfacedPlanIdRef.current = plan.planId;
|
|
5407
|
+
expandPanel();
|
|
5408
|
+
}, [plan?.planId, plan?.state, expandPanel]);
|
|
5409
|
+
return null;
|
|
5410
|
+
}
|
|
5087
5411
|
function LiveAgent(props) {
|
|
5088
5412
|
const {
|
|
5089
5413
|
agentId: hostAgentId,
|
|
@@ -5116,20 +5440,20 @@ function LiveAgent(props) {
|
|
|
5116
5440
|
const usesHostAuth = !!getUserToken || !!userToken || !!authTokenProp;
|
|
5117
5441
|
const effectiveAuthToken = usesHostAuth ? authTokenProp : auth.authToken ?? undefined;
|
|
5118
5442
|
const hasModuleSelector = !hostAgentId;
|
|
5119
|
-
const [activeModule, setActiveModule] =
|
|
5443
|
+
const [activeModule, setActiveModule] = useState17(null);
|
|
5120
5444
|
const agentId = hasModuleSelector ? activeModule?.id ?? null : hostAgentId;
|
|
5121
5445
|
const agentControls = hasModuleSelector ? activeModule?.controls : hostAgentControls;
|
|
5122
|
-
const minimizeOnSessionStart =
|
|
5446
|
+
const minimizeOnSessionStart = useCallback14(() => {
|
|
5123
5447
|
if (minimizable) {
|
|
5124
5448
|
setIsMinimized(true);
|
|
5125
5449
|
setIsPanelOpen(false);
|
|
5126
5450
|
}
|
|
5127
5451
|
}, [minimizable]);
|
|
5128
|
-
const expandOnSessionStartError =
|
|
5452
|
+
const expandOnSessionStartError = useCallback14(() => {
|
|
5129
5453
|
setIsMinimized(false);
|
|
5130
5454
|
setIsPanelOpen(true);
|
|
5131
5455
|
}, []);
|
|
5132
|
-
const minimizeOnSessionDisconnect =
|
|
5456
|
+
const minimizeOnSessionDisconnect = useCallback14(() => {
|
|
5133
5457
|
if (hasModuleSelector) {
|
|
5134
5458
|
setActiveModule(null);
|
|
5135
5459
|
}
|
|
@@ -5167,27 +5491,27 @@ function LiveAgent(props) {
|
|
|
5167
5491
|
});
|
|
5168
5492
|
const teardownInFlightRef = useRef17(false);
|
|
5169
5493
|
teardownInFlightRef.current = isPaused || isPausing || isDisconnecting;
|
|
5170
|
-
const handleRoomDisconnected =
|
|
5494
|
+
const handleRoomDisconnected = useCallback14(() => {
|
|
5171
5495
|
if (teardownInFlightRef.current)
|
|
5172
5496
|
return;
|
|
5173
5497
|
disconnect();
|
|
5174
5498
|
}, [disconnect]);
|
|
5175
5499
|
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 =
|
|
5500
|
+
const [isPanelOpen, setIsPanelOpen] = useState17(defaultOpen);
|
|
5501
|
+
const [isMinimized, setIsMinimized] = useState17(minimizable && !defaultOpen);
|
|
5502
|
+
const [sidebarTab, setSidebarTab] = useState17("agenda");
|
|
5503
|
+
const [phasesSnapshot, setPhasesSnapshot] = useState17([]);
|
|
5504
|
+
const [textMode, setTextMode] = useState17(false);
|
|
5505
|
+
const [panelExpanded, setPanelExpanded] = useState17(false);
|
|
5506
|
+
const togglePanelExpanded = useCallback14(() => setPanelExpanded((prev) => !prev), []);
|
|
5183
5507
|
const panelRef = useRef17(null);
|
|
5184
|
-
const setTextModeState =
|
|
5508
|
+
const setTextModeState = useCallback14((enabled) => {
|
|
5185
5509
|
setTextMode(enabled);
|
|
5186
5510
|
setPanelExpanded(enabled);
|
|
5187
5511
|
}, []);
|
|
5188
5512
|
const isConnected = connection !== null;
|
|
5189
5513
|
const showControlBar = isConnected || isStarting || isPausing;
|
|
5190
|
-
|
|
5514
|
+
useEffect23(() => {
|
|
5191
5515
|
if (!isConnected)
|
|
5192
5516
|
setTextModeState(false);
|
|
5193
5517
|
}, [isConnected, setTextModeState]);
|
|
@@ -5217,7 +5541,7 @@ function LiveAgent(props) {
|
|
|
5217
5541
|
const agentMode = activeModuleForAgent?.mode ?? null;
|
|
5218
5542
|
const shouldAnimateCursor = activeModuleForAgent?.uiPreferences?.animateCursor ?? animateAgentCursor;
|
|
5219
5543
|
const resumableSession = useMemo6(() => getResumableSession(activeModuleForAgent), [activeModuleForAgent]);
|
|
5220
|
-
const resumeSession =
|
|
5544
|
+
const resumeSession = useCallback14(async () => {
|
|
5221
5545
|
if (!resumableSession)
|
|
5222
5546
|
return;
|
|
5223
5547
|
await startSession({
|
|
@@ -5226,7 +5550,7 @@ function LiveAgent(props) {
|
|
|
5226
5550
|
existingSessionId: resumableSession.id
|
|
5227
5551
|
});
|
|
5228
5552
|
}, [resumableSession, startSession, agentControls]);
|
|
5229
|
-
const selectModule =
|
|
5553
|
+
const selectModule = useCallback14((moduleId) => {
|
|
5230
5554
|
const found = availableModules.find((m) => m.id === moduleId);
|
|
5231
5555
|
if (!found)
|
|
5232
5556
|
return;
|
|
@@ -5237,7 +5561,7 @@ function LiveAgent(props) {
|
|
|
5237
5561
|
existingSessionId: getResumableSessionId(found.currentSession, found.mode)
|
|
5238
5562
|
});
|
|
5239
5563
|
}, [availableModules, startSession]);
|
|
5240
|
-
const startAdoptionSession =
|
|
5564
|
+
const startAdoptionSession = useCallback14((goal) => {
|
|
5241
5565
|
attendGoal(goal.goalId);
|
|
5242
5566
|
const found = availableModules.find((m) => m.id === goal.agentId);
|
|
5243
5567
|
if (found)
|
|
@@ -5248,9 +5572,9 @@ function LiveAgent(props) {
|
|
|
5248
5572
|
adoptionGoalId: goal.goalId
|
|
5249
5573
|
});
|
|
5250
5574
|
}, [attendGoal, availableModules, startSession]);
|
|
5251
|
-
const [welcomeDismissed, setWelcomeDismissed] =
|
|
5252
|
-
const dismissWelcome =
|
|
5253
|
-
const [currentPosition, setCurrentPosition] =
|
|
5575
|
+
const [welcomeDismissed, setWelcomeDismissed] = useState17(false);
|
|
5576
|
+
const dismissWelcome = useCallback14(() => setWelcomeDismissed(true), []);
|
|
5577
|
+
const [currentPosition, setCurrentPosition] = useState17(() => {
|
|
5254
5578
|
try {
|
|
5255
5579
|
const saved = localStorage.getItem("skippr_widget_position");
|
|
5256
5580
|
if (saved === "left" || saved === "right")
|
|
@@ -5258,13 +5582,13 @@ function LiveAgent(props) {
|
|
|
5258
5582
|
} catch {}
|
|
5259
5583
|
return position;
|
|
5260
5584
|
});
|
|
5261
|
-
const setPositionWithPersist =
|
|
5585
|
+
const setPositionWithPersist = useCallback14((pos) => {
|
|
5262
5586
|
setCurrentPosition(pos);
|
|
5263
5587
|
try {
|
|
5264
5588
|
localStorage.setItem("skippr_widget_position", pos);
|
|
5265
5589
|
} catch {}
|
|
5266
5590
|
}, []);
|
|
5267
|
-
const [launcherBottomPx, setLauncherBottomPxState] =
|
|
5591
|
+
const [launcherBottomPx, setLauncherBottomPxState] = useState17(() => {
|
|
5268
5592
|
try {
|
|
5269
5593
|
const saved = Number.parseInt(localStorage.getItem("skippr_widget_bottom") ?? "", 10);
|
|
5270
5594
|
if (Number.isFinite(saved) && saved > 0)
|
|
@@ -5272,8 +5596,8 @@ function LiveAgent(props) {
|
|
|
5272
5596
|
} catch {}
|
|
5273
5597
|
return DEFAULT_LAUNCHER_BOTTOM_PX;
|
|
5274
5598
|
});
|
|
5275
|
-
const [popsDown, setPopsDown] =
|
|
5276
|
-
const setLauncherBottomPx =
|
|
5599
|
+
const [popsDown, setPopsDown] = useState17(() => launcherPopsDown(launcherBottomPx));
|
|
5600
|
+
const setLauncherBottomPx = useCallback14((px) => {
|
|
5277
5601
|
setLauncherBottomPxState(px);
|
|
5278
5602
|
setPopsDown(launcherPopsDown(px));
|
|
5279
5603
|
try {
|
|
@@ -5282,7 +5606,7 @@ function LiveAgent(props) {
|
|
|
5282
5606
|
}, []);
|
|
5283
5607
|
const launcherBottomPxRef = useRef17(launcherBottomPx);
|
|
5284
5608
|
launcherBottomPxRef.current = launcherBottomPx;
|
|
5285
|
-
|
|
5609
|
+
useEffect23(() => {
|
|
5286
5610
|
const syncToViewport = () => {
|
|
5287
5611
|
const clamped = clampLauncherBottom(launcherBottomPxRef.current);
|
|
5288
5612
|
setLauncherBottomPxState(clamped);
|
|
@@ -5292,20 +5616,20 @@ function LiveAgent(props) {
|
|
|
5292
5616
|
window.addEventListener("resize", syncToViewport);
|
|
5293
5617
|
return () => window.removeEventListener("resize", syncToViewport);
|
|
5294
5618
|
}, []);
|
|
5295
|
-
const openPanel =
|
|
5296
|
-
const closePanel =
|
|
5297
|
-
const togglePanel =
|
|
5298
|
-
const expandPanel =
|
|
5619
|
+
const openPanel = useCallback14(() => setIsPanelOpen(true), []);
|
|
5620
|
+
const closePanel = useCallback14(() => setIsPanelOpen(false), []);
|
|
5621
|
+
const togglePanel = useCallback14(() => setIsPanelOpen((prev) => !prev), []);
|
|
5622
|
+
const expandPanel = useCallback14(() => {
|
|
5299
5623
|
setIsMinimized(false);
|
|
5300
5624
|
setIsPanelOpen(true);
|
|
5301
5625
|
}, []);
|
|
5302
|
-
const minimizePanel =
|
|
5626
|
+
const minimizePanel = useCallback14(() => {
|
|
5303
5627
|
if (!minimizable)
|
|
5304
5628
|
return;
|
|
5305
5629
|
setIsMinimized(true);
|
|
5306
5630
|
setIsPanelOpen(false);
|
|
5307
5631
|
}, [minimizable]);
|
|
5308
|
-
const pauseSessionAndMinimize =
|
|
5632
|
+
const pauseSessionAndMinimize = useCallback14(async () => {
|
|
5309
5633
|
await pauseSession();
|
|
5310
5634
|
minimizePanel();
|
|
5311
5635
|
}, [pauseSession, minimizePanel]);
|
|
@@ -5434,38 +5758,39 @@ function LiveAgent(props) {
|
|
|
5434
5758
|
adoptionGoals,
|
|
5435
5759
|
startAdoptionSession
|
|
5436
5760
|
]);
|
|
5437
|
-
return /* @__PURE__ */
|
|
5761
|
+
return /* @__PURE__ */ jsx22(LiveAgentContext.Provider, {
|
|
5438
5762
|
value: ctx,
|
|
5439
|
-
children: /* @__PURE__ */
|
|
5763
|
+
children: /* @__PURE__ */ jsxs18(LiveKitRoom, {
|
|
5440
5764
|
serverUrl: connection?.livekitUrl,
|
|
5441
5765
|
token: connection?.token,
|
|
5442
5766
|
connect: shouldConnect,
|
|
5443
5767
|
audio: true,
|
|
5444
5768
|
onDisconnected: handleRoomDisconnected,
|
|
5445
5769
|
children: [
|
|
5446
|
-
connection && !textMode && /* @__PURE__ */
|
|
5447
|
-
connection && captureMode === "screenshare" && /* @__PURE__ */
|
|
5770
|
+
connection && !textMode && /* @__PURE__ */ jsx22(RoomAudioRenderer, {}),
|
|
5771
|
+
connection && captureMode === "screenshare" && /* @__PURE__ */ jsx22(AutoStartMedia, {
|
|
5448
5772
|
pendingScreenStream
|
|
5449
5773
|
}),
|
|
5450
|
-
connection && captureMode === "auto" && /* @__PURE__ */
|
|
5451
|
-
/* @__PURE__ */
|
|
5774
|
+
connection && captureMode === "auto" && /* @__PURE__ */ jsx22(DomCapture, {}),
|
|
5775
|
+
/* @__PURE__ */ jsxs18(ShadowHost, {
|
|
5452
5776
|
children: [
|
|
5453
|
-
connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */
|
|
5454
|
-
connection && captureMode === "auto" && agentControls?.actions && /* @__PURE__ */
|
|
5455
|
-
connection && captureMode === "auto" &&
|
|
5777
|
+
connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */ jsx22(HighlightOverlay, {}),
|
|
5778
|
+
connection && captureMode === "auto" && agentControls?.actions && /* @__PURE__ */ jsx22(PageActionHandler, {}),
|
|
5779
|
+
connection && captureMode === "auto" && agentControls?.actions && /* @__PURE__ */ jsx22(PlanPanelOpener, {}),
|
|
5780
|
+
connection && captureMode === "auto" && (agentControls?.highlight || agentControls?.actions) && /* @__PURE__ */ jsx22(AgentCursorMount, {
|
|
5456
5781
|
animated: shouldAnimateCursor
|
|
5457
5782
|
}),
|
|
5458
|
-
/* @__PURE__ */
|
|
5783
|
+
/* @__PURE__ */ jsxs18("div", {
|
|
5459
5784
|
id: WIDGET_ROOT_ID,
|
|
5460
5785
|
children: [
|
|
5461
|
-
isMinimized && !showControlBar && /* @__PURE__ */
|
|
5786
|
+
isMinimized && !showControlBar && /* @__PURE__ */ jsx22(MinimizedBubble, {
|
|
5462
5787
|
welcomeMessage,
|
|
5463
5788
|
welcomeDismissed,
|
|
5464
5789
|
onDismissWelcome: dismissWelcome
|
|
5465
5790
|
}),
|
|
5466
|
-
showControlBar && !hideControls && /* @__PURE__ */
|
|
5467
|
-
/* @__PURE__ */
|
|
5468
|
-
/* @__PURE__ */
|
|
5791
|
+
showControlBar && !hideControls && /* @__PURE__ */ jsx22(SessionControlBar, {}),
|
|
5792
|
+
/* @__PURE__ */ jsx22(SidebarTrigger, {}),
|
|
5793
|
+
/* @__PURE__ */ jsx22(Sidebar, {
|
|
5469
5794
|
hideControls,
|
|
5470
5795
|
hideHeader,
|
|
5471
5796
|
startSessionLabel
|
|
@@ -5480,9 +5805,9 @@ function LiveAgent(props) {
|
|
|
5480
5805
|
});
|
|
5481
5806
|
}
|
|
5482
5807
|
// src/hooks/useIsLocalSpeaking.ts
|
|
5483
|
-
import { useIsSpeaking, useLocalParticipant as
|
|
5808
|
+
import { useIsSpeaking, useLocalParticipant as useLocalParticipant9 } from "@livekit/components-react/hooks";
|
|
5484
5809
|
function useIsLocalSpeaking() {
|
|
5485
|
-
const { localParticipant } =
|
|
5810
|
+
const { localParticipant } = useLocalParticipant9();
|
|
5486
5811
|
return useIsSpeaking(localParticipant);
|
|
5487
5812
|
}
|
|
5488
5813
|
export {
|