@skippr/live-agent-sdk 0.73.0 → 0.75.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.
@@ -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 useCallback15, useEffect as useEffect25, useMemo as useMemo6, useRef as useRef17, useState as useState18 } from "react";
11
+ import { useCallback as useCallback15, useEffect as useEffect26, useMemo as useMemo6, useRef as useRef17, useState as useState19 } from "react";
12
12
 
13
13
  // src/capture/useAgentCursor.ts
14
14
  import { useEffect, useState } from "react";
@@ -74,8 +74,128 @@ var NAME_MAX_CHARS = 80;
74
74
  // src/context/LiveAgentContext.tsx
75
75
  var LiveAgentContext = createContext(null);
76
76
 
77
+ // src/context/SessionHoldContext.tsx
78
+ import { createContext as createContext2, useContext as useContext2 } from "react";
79
+
80
+ // src/hooks/useLiveAgent.ts
81
+ import { useContext } from "react";
82
+ function useLiveAgent() {
83
+ const ctx = useContext(LiveAgentContext);
84
+ if (!ctx) {
85
+ throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
86
+ }
87
+ const {
88
+ usesHostAuth,
89
+ authFailed,
90
+ connection,
91
+ shouldConnect,
92
+ historyMessages,
93
+ phasesSnapshot,
94
+ setPhasesSnapshot,
95
+ hasResolvedModules,
96
+ adoptionGoals,
97
+ startAdoptionSession,
98
+ launcherBottomPx,
99
+ setLauncherBottomPx,
100
+ popsDown,
101
+ panelExpanded,
102
+ togglePanelExpanded,
103
+ ...publicValue
104
+ } = ctx;
105
+ return publicValue;
106
+ }
107
+
108
+ // src/hooks/useSessionHold.ts
109
+ import { useLocalParticipant } from "@livekit/components-react/hooks";
110
+ import { useCallback, useEffect as useEffect2, useState as useState2 } from "react";
111
+ var textEncoder = new TextEncoder;
112
+ var FALLBACK_PAUSE_TIMEOUT_SECONDS = 120;
113
+ function useSessionHold({
114
+ pauseSession,
115
+ pauseTimeoutSeconds
116
+ }) {
117
+ const { localParticipant } = useLocalParticipant();
118
+ const timeoutSeconds = pauseTimeoutSeconds ?? FALLBACK_PAUSE_TIMEOUT_SECONDS;
119
+ const [isHeld, setIsHeld] = useState2(false);
120
+ const [countdown, setCountdown] = useState2(timeoutSeconds);
121
+ const publish = useCallback(async (type) => {
122
+ await localParticipant.publishData(textEncoder.encode(JSON.stringify({ type })), {
123
+ reliable: true,
124
+ topic: SESSION_HOLD_TOPIC
125
+ });
126
+ }, [localParticipant]);
127
+ const hold = useCallback(async () => {
128
+ try {
129
+ await localParticipant.setMicrophoneEnabled(false);
130
+ await publish("pause");
131
+ setIsHeld(true);
132
+ } catch (error) {
133
+ console.error("Failed to hold session:", error);
134
+ }
135
+ }, [localParticipant, publish]);
136
+ const release = useCallback(async () => {
137
+ try {
138
+ await localParticipant.setMicrophoneEnabled(true);
139
+ await publish("resume");
140
+ setIsHeld(false);
141
+ } catch (error) {
142
+ console.error("Failed to release session:", error);
143
+ }
144
+ }, [localParticipant, publish]);
145
+ useEffect2(() => {
146
+ if (!isHeld) {
147
+ setCountdown(timeoutSeconds);
148
+ return;
149
+ }
150
+ const id = setInterval(() => {
151
+ setCountdown((seconds) => Math.max(0, seconds - 1));
152
+ }, 1000);
153
+ return () => clearInterval(id);
154
+ }, [isHeld, timeoutSeconds]);
155
+ useEffect2(() => {
156
+ if (isHeld && countdown === 0) {
157
+ setIsHeld(false);
158
+ pauseSession();
159
+ }
160
+ }, [isHeld, countdown, pauseSession]);
161
+ const toggle = useCallback(() => {
162
+ if (isHeld) {
163
+ release();
164
+ } else {
165
+ hold();
166
+ }
167
+ }, [isHeld, hold, release]);
168
+ return { isHeld, countdown, toggle };
169
+ }
170
+
171
+ // src/context/SessionHoldContext.tsx
172
+ import { jsx } from "react/jsx-runtime";
173
+ var SessionHoldContext = createContext2({
174
+ isHeld: false,
175
+ countdown: 0,
176
+ toggle: () => {}
177
+ });
178
+ function SessionHoldProvider({ children }) {
179
+ const { pauseSession } = useLiveAgent();
180
+ const internalCtx = useContext2(LiveAgentContext);
181
+ if (!internalCtx) {
182
+ throw new Error("SessionHoldProvider must be used within a <LiveAgent> provider");
183
+ }
184
+ const hold = useSessionHold({
185
+ pauseSession,
186
+ pauseTimeoutSeconds: internalCtx.pauseTimeoutSeconds
187
+ });
188
+ return /* @__PURE__ */ jsx(SessionHoldContext.Provider, {
189
+ value: hold,
190
+ children
191
+ });
192
+ }
193
+ function useSessionHoldContext() {
194
+ return useContext2(SessionHoldContext);
195
+ }
196
+
77
197
  // src/hooks/useAdoptionGoals.ts
78
- import { useCallback, useEffect as useEffect2, useMemo, useState as useState2 } from "react";
198
+ import { useCallback as useCallback2, useEffect as useEffect3, useMemo, useState as useState3 } from "react";
79
199
 
80
200
  // src/lib/hashMatch.ts
81
201
  function globToRegExp(pattern) {
@@ -143,9 +263,9 @@ function useAdoptionGoals({
143
263
  bearerToken,
144
264
  authedFetch
145
265
  }) {
146
- const [candidates, setCandidates] = useState2([]);
147
- const [hash, setHash] = useState2(window.location.hash);
148
- const match = useCallback(async () => {
266
+ const [candidates, setCandidates] = useState3([]);
267
+ const [hash, setHash] = useState3(window.location.hash);
268
+ const match = useCallback2(async () => {
149
269
  try {
150
270
  const resp = await authedFetch(`${API_URL}/v1/adoption/goals/match`, {
151
271
  method: "POST",
@@ -163,7 +283,7 @@ function useAdoptionGoals({
163
283
  setCandidates([]);
164
284
  }
165
285
  }, [authedFetch]);
166
- useEffect2(() => {
286
+ useEffect3(() => {
167
287
  if (!enabled || !bearerToken) {
168
288
  setCandidates([]);
169
289
  return;
@@ -195,21 +315,21 @@ function useAdoptionGoals({
195
315
  return hashSpecific;
196
316
  return candidates.filter((goal) => goal.hashPattern === null);
197
317
  }, [candidates, hash]);
198
- const postStatus = useCallback((goalId, status) => {
318
+ const postStatus = useCallback2((goalId, status) => {
199
319
  authedFetch(`${API_URL}/v1/adoption/goals/${goalId}/status`, {
200
320
  method: "POST",
201
321
  headers: { "Content-Type": "application/json" },
202
322
  body: JSON.stringify({ status })
203
323
  }).catch((e) => console.warn("[Skippr] adoption status update failed", e));
204
324
  }, [authedFetch]);
205
- const attendGoal = useCallback((goalId) => {
325
+ const attendGoal = useCallback2((goalId) => {
206
326
  postStatus(goalId, "attended" /* Attended */);
207
327
  }, [postStatus]);
208
328
  return { goals, attendGoal };
209
329
  }
210
330
 
211
331
  // src/hooks/useAuth.ts
212
- import { useCallback as useCallback2, useEffect as useEffect3, useState as useState3 } from "react";
332
+ import { useCallback as useCallback3, useEffect as useEffect4, useState as useState4 } from "react";
213
333
  var API_URL2 = "https://specialist.skippr.ai/api";
214
334
  function storageKey(appKey) {
215
335
  return `skippr_auth_${appKey}`;
@@ -236,12 +356,12 @@ function clearStoredToken(appKey) {
236
356
  }
237
357
  }
238
358
  function useAuth({ appKey }) {
239
- const [authToken, setAuthToken] = useState3(null);
240
- const [isValidating, setIsValidating] = useState3(false);
241
- const [isSubmitting, setIsSubmitting] = useState3(false);
242
- const [error, setError] = useState3("");
359
+ const [authToken, setAuthToken] = useState4(null);
360
+ const [isValidating, setIsValidating] = useState4(false);
361
+ const [isSubmitting, setIsSubmitting] = useState4(false);
362
+ const [error, setError] = useState4("");
243
363
  const isAuthenticated = authToken !== null;
244
- useEffect3(() => {
364
+ useEffect4(() => {
245
365
  if (!appKey)
246
366
  return;
247
367
  const stored = getStoredToken(appKey);
@@ -267,7 +387,7 @@ function useAuth({ appKey }) {
267
387
  }
268
388
  validateStoredToken();
269
389
  }, [appKey]);
270
- useEffect3(() => {
390
+ useEffect4(() => {
271
391
  function handleLogout() {
272
392
  setAuthToken(null);
273
393
  setError("");
@@ -275,7 +395,7 @@ function useAuth({ appKey }) {
275
395
  window.addEventListener("skippr:logout", handleLogout);
276
396
  return () => window.removeEventListener("skippr:logout", handleLogout);
277
397
  }, []);
278
- const requestOtp = useCallback2(async (email) => {
398
+ const requestOtp = useCallback3(async (email) => {
279
399
  if (!appKey)
280
400
  return false;
281
401
  setIsSubmitting(true);
@@ -302,7 +422,7 @@ function useAuth({ appKey }) {
302
422
  setIsSubmitting(false);
303
423
  }
304
424
  }, [appKey]);
305
- const verifyOtp = useCallback2(async (email, code) => {
425
+ const verifyOtp = useCallback3(async (email, code) => {
306
426
  if (!appKey)
307
427
  return;
308
428
  setIsSubmitting(true);
@@ -331,7 +451,7 @@ function useAuth({ appKey }) {
331
451
  setIsSubmitting(false);
332
452
  }
333
453
  }, [appKey]);
334
- const logout = useCallback2(async () => {
454
+ const logout = useCallback3(async () => {
335
455
  const token = authToken;
336
456
  if (appKey)
337
457
  clearStoredToken(appKey);
@@ -362,43 +482,49 @@ function useAuth({ appKey }) {
362
482
  }
363
483
 
364
484
  // src/hooks/useAvailableModules.ts
365
- import { useCallback as useCallback3, useEffect as useEffect4, useState as useState4 } from "react";
485
+ import { useCallback as useCallback4, useEffect as useEffect5, useState as useState5 } from "react";
486
+ var EMPTY_DEFAULT = { agentId: null, sessionId: null };
366
487
  var API_URL3 = "https://specialist.skippr.ai/api";
367
488
  function useAvailableModules({
368
489
  enabled,
369
490
  bearerToken,
370
- authedFetch
491
+ authedFetch,
492
+ agentId
371
493
  }) {
372
- const [modules, setModules] = useState4([]);
373
- const [isLoading, setIsLoading] = useState4(false);
374
- const [hasResolved, setHasResolved] = useState4(false);
375
- const [error, setError] = useState4(null);
376
- const fetchModules = useCallback3(async () => {
494
+ const [modules, setModules] = useState5([]);
495
+ const [defaultSelection, setDefaultSelection] = useState5(EMPTY_DEFAULT);
496
+ const [isLoading, setIsLoading] = useState5(false);
497
+ const [hasResolved, setHasResolved] = useState5(false);
498
+ const [error, setError] = useState5(null);
499
+ const fetchModules = useCallback4(async () => {
377
500
  setIsLoading(true);
378
501
  setHasResolved(false);
379
502
  setError(null);
380
503
  try {
381
- const resp = await authedFetch(`${API_URL3}/v1/modules/available`);
504
+ const query = agentId ? `?agentId=${encodeURIComponent(agentId)}` : "";
505
+ const resp = await authedFetch(`${API_URL3}/v1/modules/available${query}`);
382
506
  if (!resp.ok) {
383
507
  const body = await resp.json().catch(() => null);
384
508
  throw new Error(body?.detail || `Failed to load modules: ${resp.status}`);
385
509
  }
386
510
  const data = await resp.json();
387
511
  setModules(Array.isArray(data?.modules) ? data.modules : []);
512
+ setDefaultSelection(data?.default ?? EMPTY_DEFAULT);
388
513
  } catch (e) {
389
514
  setError(e instanceof Error ? e.message : "Failed to load modules");
390
515
  } finally {
391
516
  setIsLoading(false);
392
517
  setHasResolved(true);
393
518
  }
394
- }, [authedFetch]);
395
- useEffect4(() => {
519
+ }, [authedFetch, agentId]);
520
+ useEffect5(() => {
396
521
  if (!enabled || !bearerToken)
397
522
  return;
398
523
  fetchModules();
399
524
  }, [enabled, bearerToken, fetchModules]);
400
525
  return {
401
526
  modules,
527
+ defaultSelection,
402
528
  isLoading,
403
529
  hasResolved,
404
530
  error,
@@ -406,44 +532,16 @@ function useAvailableModules({
406
532
  };
407
533
  }
408
534
 
409
- // src/hooks/useLiveAgent.ts
410
- import { useContext } from "react";
411
- function useLiveAgent() {
412
- const ctx = useContext(LiveAgentContext);
413
- if (!ctx) {
414
- throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
415
- }
416
- const {
417
- usesHostAuth,
418
- authFailed,
419
- connection,
420
- shouldConnect,
421
- historyMessages,
422
- phasesSnapshot,
423
- setPhasesSnapshot,
424
- hasResolvedModules,
425
- adoptionGoals,
426
- startAdoptionSession,
427
- launcherBottomPx,
428
- setLauncherBottomPx,
429
- popsDown,
430
- panelExpanded,
431
- togglePanelExpanded,
432
- ...publicValue
433
- } = ctx;
434
- return publicValue;
435
- }
436
-
437
535
  // src/hooks/usePlanUpdates.ts
438
- import { useCallback as useCallback4 } from "react";
536
+ import { useCallback as useCallback5 } from "react";
439
537
 
440
538
  // src/hooks/useAgentState.ts
441
539
  import { useRemoteParticipants } from "@livekit/components-react/hooks";
442
- import { useEffect as useEffect5, useState as useState5 } from "react";
540
+ import { useEffect as useEffect6, useState as useState6 } from "react";
443
541
  function useAgentState(attributeKey, parse, initial) {
444
- const [value, setValue] = useState5(initial);
542
+ const [value, setValue] = useState6(initial);
445
543
  const remoteParticipants = useRemoteParticipants();
446
- useEffect5(() => {
544
+ useEffect6(() => {
447
545
  const agentParticipant = remoteParticipants.find((p) => p.attributes?.[attributeKey]);
448
546
  if (agentParticipant) {
449
547
  const attr = agentParticipant.attributes?.[attributeKey];
@@ -489,12 +587,75 @@ function parsePlan(json) {
489
587
  return null;
490
588
  }
491
589
  function usePlanUpdates() {
492
- const parse = useCallback4(parsePlan, []);
590
+ const parse = useCallback5(parsePlan, []);
493
591
  return useAgentState(PLAN_ATTR, parse, null);
494
592
  }
495
593
 
496
594
  // src/hooks/useSession.ts
497
- import { useCallback as useCallback5, useEffect as useEffect6, useRef, useState as useState6 } from "react";
595
+ import { useCallback as useCallback6, useEffect as useEffect7, useRef, useState as useState7 } from "react";
596
+
597
+ // src/lib/agentMode.ts
598
+ var AGENT_MODE = {
599
+ Standard: "standard",
600
+ AlwaysOn: "always_on"
601
+ };
602
+ var AGENT_MODES = Object.values(AGENT_MODE);
603
+
604
+ // src/lib/sessionStatus.ts
605
+ var SESSION_STATUS = {
606
+ pending: "pending",
607
+ active: "active",
608
+ paused: "paused",
609
+ completed: "completed",
610
+ expired: "expired"
611
+ };
612
+ var SESSION_STATUSES = Object.values(SESSION_STATUS);
613
+
614
+ // src/lib/session.ts
615
+ function mapApiMessages(messages) {
616
+ return messages.filter((message) => message.role !== "system").map((message) => ({
617
+ id: message.id,
618
+ role: message.role === "user" ? "user" : "assistant",
619
+ content: message.content,
620
+ source: "chat",
621
+ timestamp: new Date(message.createdAt).getTime()
622
+ }));
623
+ }
624
+ function getResumableSessionId(currentSession, mode) {
625
+ if (!currentSession)
626
+ return;
627
+ const { id, status } = currentSession;
628
+ if (status === SESSION_STATUS.paused || status === SESSION_STATUS.active)
629
+ return id;
630
+ if (mode === AGENT_MODE.AlwaysOn && (status === SESSION_STATUS.expired || status === SESSION_STATUS.completed))
631
+ return id;
632
+ return;
633
+ }
634
+ function canResumeSession(currentSession, mode) {
635
+ return getResumableSessionId(currentSession, mode) !== undefined;
636
+ }
637
+ function getResumableSession(module) {
638
+ if (!module)
639
+ return null;
640
+ const id = getResumableSessionId(module.currentSession, module.mode);
641
+ return id ? { id, agentId: module.id } : null;
642
+ }
643
+ function getModuleSessionState(currentSession, mode) {
644
+ if (!currentSession)
645
+ return null;
646
+ if (canResumeSession(currentSession, mode))
647
+ return "resume";
648
+ if (mode === AGENT_MODE.Standard) {
649
+ const { status } = currentSession;
650
+ if (status === SESSION_STATUS.completed)
651
+ return "completed";
652
+ if (status === SESSION_STATUS.expired)
653
+ return "expired";
654
+ }
655
+ return null;
656
+ }
657
+
658
+ // src/hooks/useSession.ts
498
659
  var API_URL4 = "https://specialist.skippr.ai/api";
499
660
  async function fetchSessionMessages(sessionId, authedFetch) {
500
661
  try {
@@ -502,13 +663,7 @@ async function fetchSessionMessages(sessionId, authedFetch) {
502
663
  if (!resp.ok)
503
664
  return [];
504
665
  const { messages } = await resp.json();
505
- return messages.filter((message) => message.role !== "system").map((message) => ({
506
- id: message.id,
507
- role: message.role === "user" ? "user" : "assistant",
508
- content: message.content,
509
- source: "chat",
510
- timestamp: new Date(message.createdAt).getTime()
511
- }));
666
+ return mapApiMessages(messages);
512
667
  } catch {
513
668
  return [];
514
669
  }
@@ -552,27 +707,27 @@ function useSession({
552
707
  onStartError,
553
708
  onDisconnect
554
709
  }) {
555
- const [connection, setConnection] = useState6(null);
556
- const [shouldConnect, setShouldConnect] = useState6(false);
557
- const [isStarting, setIsStarting] = useState6(false);
558
- const [isDisconnecting, setIsDisconnecting] = useState6(false);
559
- const [error, setError] = useState6("");
560
- const [errorCode, setErrorCode] = useState6(null);
561
- const [sessionId, setSessionId] = useState6(null);
562
- const [bearerToken, setBearerToken] = useState6(authToken ?? null);
563
- const [pendingScreenStream, setPendingScreenStream] = useState6(null);
564
- const [isPaused, setIsPaused] = useState6(false);
565
- const [isPausing, setIsPausing] = useState6(false);
566
- const [pauseTimeoutSeconds, setPauseTimeoutSeconds] = useState6(null);
567
- const [historyMessages, setHistoryMessages] = useState6([]);
568
- const [authFailed, setAuthFailed] = useState6(false);
710
+ const [connection, setConnection] = useState7(null);
711
+ const [shouldConnect, setShouldConnect] = useState7(false);
712
+ const [isStarting, setIsStarting] = useState7(false);
713
+ const [isDisconnecting, setIsDisconnecting] = useState7(false);
714
+ const [error, setError] = useState7("");
715
+ const [errorCode, setErrorCode] = useState7(null);
716
+ const [sessionId, setSessionId] = useState7(null);
717
+ const [bearerToken, setBearerToken] = useState7(authToken ?? null);
718
+ const [pendingScreenStream, setPendingScreenStream] = useState7(null);
719
+ const [isPaused, setIsPaused] = useState7(false);
720
+ const [isPausing, setIsPausing] = useState7(false);
721
+ const [pauseTimeoutSeconds, setPauseTimeoutSeconds] = useState7(null);
722
+ const [historyMessages, setHistoryMessages] = useState7([]);
723
+ const [authFailed, setAuthFailed] = useState7(false);
569
724
  const tokenRef = useRef(authToken ? { token: authToken, expiresAt: null } : null);
570
725
  const getUserTokenRef = useRef(getUserToken);
571
726
  getUserTokenRef.current = getUserToken ?? (userToken ? () => Promise.resolve(userToken) : undefined);
572
727
  const failedBearerRef = useRef(null);
573
728
  const inFlightExchangeRef = useRef(null);
574
- const canExchange = useCallback5(() => !!appKey && !!getUserTokenRef.current, [appKey]);
575
- const reExchange = useCallback5(async () => {
729
+ const canExchange = useCallback6(() => !!appKey && !!getUserTokenRef.current, [appKey]);
730
+ const reExchange = useCallback6(async () => {
576
731
  if (inFlightExchangeRef.current)
577
732
  return inFlightExchangeRef.current;
578
733
  const provider = getUserTokenRef.current;
@@ -592,7 +747,7 @@ function useSession({
592
747
  inFlightExchangeRef.current = null;
593
748
  }
594
749
  }, [appKey]);
595
- const getValidBearer = useCallback5(async () => {
750
+ const getValidBearer = useCallback6(async () => {
596
751
  const current = tokenRef.current;
597
752
  if (current) {
598
753
  if (current.expiresAt === null)
@@ -604,7 +759,7 @@ function useSession({
604
759
  return reExchange();
605
760
  return current?.token ?? null;
606
761
  }, [canExchange, reExchange]);
607
- const authedFetch = useCallback5(async (input, init = {}) => {
762
+ const authedFetch = useCallback6(async (input, init = {}) => {
608
763
  const isSecretMode = canExchange();
609
764
  const onTerminalAuthFailure = () => {
610
765
  if (isSecretMode)
@@ -646,7 +801,7 @@ function useSession({
646
801
  setAuthFailed(false);
647
802
  return resp;
648
803
  }, [canExchange, getValidBearer, reExchange]);
649
- useEffect6(() => {
804
+ useEffect7(() => {
650
805
  let stale = false;
651
806
  if (authToken) {
652
807
  tokenRef.current = { token: authToken, expiresAt: null };
@@ -667,7 +822,7 @@ function useSession({
667
822
  }, [authToken, canExchange, reExchange]);
668
823
  const pauseOnUnloadRef = useRef(null);
669
824
  pauseOnUnloadRef.current = connection !== null && !isPaused && sessionId && bearerToken ? { sessionId, bearerToken } : null;
670
- useEffect6(() => {
825
+ useEffect7(() => {
671
826
  const onPageHide = () => {
672
827
  const pending = pauseOnUnloadRef.current;
673
828
  if (!pending)
@@ -682,7 +837,7 @@ function useSession({
682
837
  window.addEventListener("pagehide", onPageHide);
683
838
  return () => window.removeEventListener("pagehide", onPageHide);
684
839
  }, []);
685
- const startSession = useCallback5(async ({ agentId, agentControls, existingSessionId, adoptionGoalId }) => {
840
+ const startSession = useCallback6(async ({ agentId, agentControls, existingSessionId, adoptionGoalId }) => {
686
841
  if (!bearerToken) {
687
842
  setError("No auth token available");
688
843
  return;
@@ -763,7 +918,7 @@ function useSession({
763
918
  setIsStarting(false);
764
919
  }
765
920
  }, [captureMode, bearerToken, authedFetch, onStart, onStartError]);
766
- const pauseSession = useCallback5(async () => {
921
+ const pauseSession = useCallback6(async () => {
767
922
  if (!sessionId || !bearerToken)
768
923
  return;
769
924
  setIsPausing(true);
@@ -789,7 +944,7 @@ function useSession({
789
944
  setIsPaused(true);
790
945
  setIsPausing(false);
791
946
  }, [sessionId, bearerToken, authedFetch, pendingScreenStream]);
792
- const disconnect = useCallback5(async () => {
947
+ const disconnect = useCallback6(async () => {
793
948
  setIsDisconnecting(true);
794
949
  try {
795
950
  if (sessionId && bearerToken) {
@@ -833,6 +988,55 @@ function useSession({
833
988
  };
834
989
  }
835
990
 
991
+ // src/hooks/useSessionHistory.ts
992
+ import { useEffect as useEffect8, useState as useState8 } from "react";
993
+ var API_URL5 = "https://specialist.skippr.ai/api";
994
+ var EMPTY = { messages: [], phases: [] };
995
+ function useSessionHistory({
996
+ agentId,
997
+ enabled,
998
+ authedFetch
999
+ }) {
1000
+ const [history2, setHistory] = useState8(EMPTY);
1001
+ const [loadedAgentId, setLoadedAgentId] = useState8(null);
1002
+ const activeAgentId = enabled && agentId ? agentId : null;
1003
+ const isLoading = activeAgentId !== null && activeAgentId !== loadedAgentId;
1004
+ useEffect8(() => {
1005
+ if (!enabled || !agentId) {
1006
+ setHistory(EMPTY);
1007
+ setLoadedAgentId(null);
1008
+ return;
1009
+ }
1010
+ let stale = false;
1011
+ (async () => {
1012
+ try {
1013
+ const resp = await authedFetch(`${API_URL5}/v1/modules/${agentId}/history`);
1014
+ if (!resp.ok)
1015
+ throw new Error(`Failed to load agent history: ${resp.status}`);
1016
+ const data = await resp.json();
1017
+ if (stale)
1018
+ return;
1019
+ setHistory({
1020
+ messages: mapApiMessages(data.messages),
1021
+ phases: data.phases
1022
+ });
1023
+ } catch (e) {
1024
+ if (stale)
1025
+ return;
1026
+ console.warn("[Skippr] Failed to load session history:", e);
1027
+ setHistory(EMPTY);
1028
+ } finally {
1029
+ if (!stale)
1030
+ setLoadedAgentId(agentId);
1031
+ }
1032
+ })();
1033
+ return () => {
1034
+ stale = true;
1035
+ };
1036
+ }, [enabled, agentId, authedFetch]);
1037
+ return { ...history2, isLoading };
1038
+ }
1039
+
836
1040
  // src/lib/launcher.ts
837
1041
  var DEFAULT_LAUNCHER_BOTTOM_PX = 48;
838
1042
  var LAUNCHER_HEIGHT_PX = 50;
@@ -851,61 +1055,18 @@ function clampLauncherBottom(px) {
851
1055
  const maxBottom = window.innerHeight - LAUNCHER_HEIGHT_PX - VIEWPORT_MARGIN_PX;
852
1056
  return Math.round(Math.min(Math.max(px, VIEWPORT_MARGIN_PX), maxBottom));
853
1057
  }
1058
+ function verticalAlignToBottomPx(align) {
1059
+ if (align === "top") {
1060
+ return clampLauncherBottom(window.innerHeight - LAUNCHER_HEIGHT_PX - DEFAULT_LAUNCHER_BOTTOM_PX);
1061
+ }
1062
+ if (align === "middle") {
1063
+ return clampLauncherBottom(window.innerHeight / 2 - LAUNCHER_HEIGHT_PX / 2);
1064
+ }
1065
+ return clampLauncherBottom(DEFAULT_LAUNCHER_BOTTOM_PX);
1066
+ }
854
1067
  function launcherPopsDown(bottomPx) {
855
1068
  return bottomPx + LAUNCHER_HEIGHT_PX / 2 > window.innerHeight / 2;
856
1069
  }
857
-
858
- // src/lib/agentMode.ts
859
- var AGENT_MODE = {
860
- Standard: "standard",
861
- AlwaysOn: "always_on"
862
- };
863
- var AGENT_MODES = Object.values(AGENT_MODE);
864
-
865
- // src/lib/sessionStatus.ts
866
- var SESSION_STATUS = {
867
- pending: "pending",
868
- active: "active",
869
- paused: "paused",
870
- completed: "completed",
871
- expired: "expired"
872
- };
873
- var SESSION_STATUSES = Object.values(SESSION_STATUS);
874
-
875
- // src/lib/session.ts
876
- function getResumableSessionId(currentSession, mode) {
877
- if (!currentSession)
878
- return;
879
- const { id, status } = currentSession;
880
- if (status === SESSION_STATUS.paused || status === SESSION_STATUS.active)
881
- return id;
882
- if (mode === AGENT_MODE.AlwaysOn && (status === SESSION_STATUS.expired || status === SESSION_STATUS.completed))
883
- return id;
884
- return;
885
- }
886
- function canResumeSession(currentSession, mode) {
887
- return getResumableSessionId(currentSession, mode) !== undefined;
888
- }
889
- function getResumableSession(module) {
890
- if (!module)
891
- return null;
892
- const id = getResumableSessionId(module.currentSession, module.mode);
893
- return id ? { id, agentId: module.id } : null;
894
- }
895
- function getModuleSessionState(currentSession, mode) {
896
- if (!currentSession)
897
- return null;
898
- if (canResumeSession(currentSession, mode))
899
- return "resume";
900
- if (mode === AGENT_MODE.Standard) {
901
- const { status } = currentSession;
902
- if (status === SESSION_STATUS.completed)
903
- return "completed";
904
- if (status === SESSION_STATUS.expired)
905
- return "expired";
906
- }
907
- return null;
908
- }
909
1070
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
910
1071
  import { forwardRef as forwardRef2, createElement as createElement3 } from "react";
911
1072
 
@@ -953,9 +1114,9 @@ var hasA11yProp = (props) => {
953
1114
  };
954
1115
 
955
1116
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/context.js
956
- import { createContext as createContext2, useContext as useContext2, useMemo as useMemo2, createElement } from "react";
957
- var LucideContext = createContext2({});
958
- var useLucideContext = () => useContext2(LucideContext);
1117
+ import { createContext as createContext3, useContext as useContext3, useMemo as useMemo2, createElement } from "react";
1118
+ var LucideContext = createContext3({});
1119
+ var useLucideContext = () => useContext3(LucideContext);
959
1120
 
960
1121
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
961
1122
  var Icon = forwardRef(({ color, size, strokeWidth, absoluteStrokeWidth, className = "", children, iconNode, ...rest }, ref) => {
@@ -1179,7 +1340,7 @@ var __iconNode23 = [
1179
1340
  ];
1180
1341
  var X = createLucideIcon("x", __iconNode23);
1181
1342
  // src/components/AgentCursor.tsx
1182
- import { useContext as useContext3, useEffect as useEffect7, useLayoutEffect, useRef as useRef2, useState as useState7 } from "react";
1343
+ import { useContext as useContext4, useEffect as useEffect9, useLayoutEffect, useRef as useRef2, useState as useState9 } from "react";
1183
1344
 
1184
1345
  // src/capture/elementRef.ts
1185
1346
  function safeGetIframeDocument(iframe) {
@@ -1316,7 +1477,7 @@ function traceRing(path, durationMs, onFrame, onDone) {
1316
1477
  }
1317
1478
 
1318
1479
  // src/components/AgentCursor.tsx
1319
- import { jsx, jsxs } from "react/jsx-runtime";
1480
+ import { jsx as jsx2, jsxs } from "react/jsx-runtime";
1320
1481
  var Z_INDEX = 2147483646;
1321
1482
  var BRAND_TEAL = "#2bc0ae";
1322
1483
  var GLIDE_EASE = "cubic-bezier(0.45, 0, 0.25, 1)";
@@ -1361,12 +1522,12 @@ function AgentCursor({
1361
1522
  target,
1362
1523
  animated = false
1363
1524
  }) {
1364
- const ctx = useContext3(LiveAgentContext);
1365
- const [cursor, setCursor] = useState7(null);
1366
- const [glideMs, setGlideMs] = useState7(0);
1367
- const [phase, setPhase] = useState7("idle");
1368
- const [ringBox, setRingBox] = useState7(null);
1369
- const [clickPulse, setClickPulse] = useState7(0);
1525
+ const ctx = useContext4(LiveAgentContext);
1526
+ const [cursor, setCursor] = useState9(null);
1527
+ const [glideMs, setGlideMs] = useState9(0);
1528
+ const [phase, setPhase] = useState9("idle");
1529
+ const [ringBox, setRingBox] = useState9(null);
1530
+ const [clickPulse, setClickPulse] = useState9(0);
1370
1531
  const cursorElRef = useRef2(null);
1371
1532
  const pathRef = useRef2(null);
1372
1533
  const prevCursorRef = useRef2(null);
@@ -1489,7 +1650,7 @@ function AgentCursor({
1489
1650
  });
1490
1651
  return cancelAnimation;
1491
1652
  }, [target, animated]);
1492
- useEffect7(() => {
1653
+ useEffect9(() => {
1493
1654
  if (!target || target.kind === "gesture" || phase === "idle")
1494
1655
  return;
1495
1656
  const track = () => {
@@ -1521,7 +1682,7 @@ function AgentCursor({
1521
1682
  }
1522
1683
  };
1523
1684
  }, [target, phase]);
1524
- useEffect7(() => {
1685
+ useEffect9(() => {
1525
1686
  return () => {
1526
1687
  traceRef.current?.cancel();
1527
1688
  for (const t of timersRef.current)
@@ -1538,10 +1699,10 @@ function AgentCursor({
1538
1699
  "data-skippr-private": "true",
1539
1700
  "aria-hidden": "true",
1540
1701
  children: [
1541
- drawing && ringBox && /* @__PURE__ */ jsx("svg", {
1702
+ drawing && ringBox && /* @__PURE__ */ jsx2("svg", {
1542
1703
  "aria-hidden": "true",
1543
1704
  style: { ...ringBoxStyle(ringBox, Z_INDEX), overflow: "visible" },
1544
- children: /* @__PURE__ */ jsx("path", {
1705
+ children: /* @__PURE__ */ jsx2("path", {
1545
1706
  ref: pathRef,
1546
1707
  d: ringPathD(ringBox),
1547
1708
  fill: "none",
@@ -1555,20 +1716,20 @@ function AgentCursor({
1555
1716
  style: ringBoxStyle(ringBox, Z_INDEX),
1556
1717
  className: "skippr:relative",
1557
1718
  children: [
1558
- /* @__PURE__ */ jsx("div", {
1719
+ /* @__PURE__ */ jsx2("div", {
1559
1720
  className: "skippr:absolute skippr:inset-0 skippr:rounded-[1rem] skippr:border-2 skippr:border-[#2bc0ae] skippr:animate-skippr-annotation-pulse"
1560
1721
  }),
1561
- /* @__PURE__ */ jsx("div", {
1722
+ /* @__PURE__ */ jsx2("div", {
1562
1723
  role: "status",
1563
1724
  className: "skippr:absolute skippr:-bottom-9 skippr:left-1/2 skippr:-translate-x-1/2 skippr:flex skippr:items-center skippr:gap-1.5 skippr:rounded-full skippr:bg-[#2bc0ae] skippr:px-2.5 skippr:py-1 skippr:shadow-[0_4px_12px_rgba(0,0,0,0.12)]",
1564
- children: /* @__PURE__ */ jsx("span", {
1725
+ children: /* @__PURE__ */ jsx2("span", {
1565
1726
  className: "skippr:text-[11px] skippr:font-medium skippr:text-white skippr:whitespace-nowrap",
1566
1727
  children: target.label
1567
1728
  })
1568
1729
  })
1569
1730
  ]
1570
1731
  }),
1571
- target.kind === "gesture" && /* @__PURE__ */ jsx("div", {
1732
+ target.kind === "gesture" && /* @__PURE__ */ jsx2("div", {
1572
1733
  role: "status",
1573
1734
  className: "skippr:fixed skippr:-translate-x-1/2 skippr:flex skippr:items-center skippr:gap-1.5 skippr:rounded-full skippr:bg-[#2bc0ae] skippr:px-2.5 skippr:py-1 skippr:shadow-[0_4px_12px_rgba(0,0,0,0.12)]",
1574
1735
  style: {
@@ -1578,12 +1739,12 @@ function AgentCursor({
1578
1739
  pointerEvents: "none",
1579
1740
  transition: `left ${glideMs}ms ${GLIDE_EASE}, top ${glideMs}ms ${GLIDE_EASE}`
1580
1741
  },
1581
- children: /* @__PURE__ */ jsx("span", {
1742
+ children: /* @__PURE__ */ jsx2("span", {
1582
1743
  className: "skippr:text-[11px] skippr:font-medium skippr:text-white skippr:whitespace-nowrap",
1583
1744
  children: target.label
1584
1745
  })
1585
1746
  }),
1586
- /* @__PURE__ */ jsx("div", {
1747
+ /* @__PURE__ */ jsx2("div", {
1587
1748
  ref: cursorElRef,
1588
1749
  style: {
1589
1750
  position: "fixed",
@@ -1593,12 +1754,12 @@ function AgentCursor({
1593
1754
  zIndex: Z_INDEX,
1594
1755
  transition: `left ${glideMs}ms ${GLIDE_EASE}, top ${glideMs}ms ${GLIDE_EASE}`
1595
1756
  },
1596
- children: /* @__PURE__ */ jsx(MousePointer2, {
1757
+ children: /* @__PURE__ */ jsx2(MousePointer2, {
1597
1758
  className: `skippr:h-5 skippr:w-5 skippr:text-[#2bc0ae] skippr:drop-shadow-[0_2px_5px_rgba(0,0,0,0.4)] ${clickPulse > 0 ? "skippr:animate-skippr-press" : "skippr:animate-skippr-cursor-pop"}`,
1598
1759
  fill: "currentColor"
1599
1760
  }, clickPulse)
1600
1761
  }),
1601
- clickPulse > 0 && rippleCenter && /* @__PURE__ */ jsx("span", {
1762
+ clickPulse > 0 && rippleCenter && /* @__PURE__ */ jsx2("span", {
1602
1763
  className: "skippr:fixed skippr:h-7 skippr:w-7 skippr:rounded-full skippr:bg-[#2bc0ae]/50 skippr:animate-skippr-click-ping",
1603
1764
  style: {
1604
1765
  left: `${rippleCenter.x}px`,
@@ -1612,14 +1773,14 @@ function AgentCursor({
1612
1773
  }
1613
1774
 
1614
1775
  // src/components/AutoStartMedia.tsx
1615
- import { useConnectionState, useLocalParticipant } from "@livekit/components-react/hooks";
1776
+ import { useConnectionState, useLocalParticipant as useLocalParticipant2 } from "@livekit/components-react/hooks";
1616
1777
  import { ConnectionState, Track } from "livekit-client";
1617
- import { useEffect as useEffect8, useRef as useRef3 } from "react";
1778
+ import { useEffect as useEffect10, useRef as useRef3 } from "react";
1618
1779
  function AutoStartMedia({ pendingScreenStream }) {
1619
- const { localParticipant } = useLocalParticipant();
1780
+ const { localParticipant } = useLocalParticipant2();
1620
1781
  const connectionState = useConnectionState();
1621
1782
  const didStartRef = useRef3(false);
1622
- useEffect8(() => {
1783
+ useEffect10(() => {
1623
1784
  if (didStartRef.current)
1624
1785
  return;
1625
1786
  if (connectionState !== ConnectionState.Connected)
@@ -1642,9 +1803,9 @@ function AutoStartMedia({ pendingScreenStream }) {
1642
1803
  }
1643
1804
 
1644
1805
  // src/components/DomCapture.tsx
1645
- import { useConnectionState as useConnectionState2, useLocalParticipant as useLocalParticipant2 } from "@livekit/components-react/hooks";
1806
+ import { useConnectionState as useConnectionState2, useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
1646
1807
  import { ConnectionState as ConnectionState2, ScreenSharePresets, Track as Track2 } from "livekit-client";
1647
- import { useEffect as useEffect9, useRef as useRef4 } from "react";
1808
+ import { useEffect as useEffect11, useRef as useRef4 } from "react";
1648
1809
 
1649
1810
  // src/capture/a11yUtils.ts
1650
1811
  var ROLE_BY_TAG = {
@@ -2259,7 +2420,7 @@ function subscribeActionsBusy(cb) {
2259
2420
 
2260
2421
  // src/capture/domEvents.ts
2261
2422
  var MUTATION_DEBOUNCE_MS = 250;
2262
- var textEncoder = new TextEncoder;
2423
+ var textEncoder2 = new TextEncoder;
2263
2424
  function isInsideWidget(target) {
2264
2425
  if (!(target instanceof Node))
2265
2426
  return false;
@@ -2285,7 +2446,7 @@ function installDomEventListeners(localParticipant, options = {}) {
2285
2446
  const { onTriggerEvent } = options;
2286
2447
  function publishDomEvent(event) {
2287
2448
  try {
2288
- localParticipant.publishData(textEncoder.encode(JSON.stringify(event)), {
2449
+ localParticipant.publishData(textEncoder2.encode(JSON.stringify(event)), {
2289
2450
  reliable: true,
2290
2451
  topic: DOM_EVENTS_TOPIC
2291
2452
  }).catch(() => {
@@ -2451,7 +2612,7 @@ var CAPTURE_BITRATE = 4000000;
2451
2612
  var DOM_SNAPSHOT_GZIP_THRESHOLD_BYTES = 14000;
2452
2613
  var MAX_CANVAS_DPR = 1.5;
2453
2614
  var CONSECUTIVE_FAILURES_BEFORE_REPORT = 3;
2454
- var textEncoder2 = new TextEncoder;
2615
+ var textEncoder3 = new TextEncoder;
2455
2616
  function shouldIncludeInSnapshot(element) {
2456
2617
  if (!(element instanceof Element))
2457
2618
  return true;
@@ -2526,7 +2687,7 @@ async function buildDomSnapshotFrame() {
2526
2687
  title: document.title,
2527
2688
  capturedAt: new Date().toISOString()
2528
2689
  });
2529
- const snapshotBytes = textEncoder2.encode(snapshotJson);
2690
+ const snapshotBytes = textEncoder3.encode(snapshotJson);
2530
2691
  const { bytes, compressionFlag } = await gzipIfBeneficial(snapshotBytes);
2531
2692
  const frame = new Uint8Array(bytes.byteLength + 1);
2532
2693
  frame[0] = compressionFlag;
@@ -2535,7 +2696,7 @@ async function buildDomSnapshotFrame() {
2535
2696
  }
2536
2697
  function reportCaptureError(localParticipant) {
2537
2698
  try {
2538
- localParticipant.publishData(textEncoder2.encode(JSON.stringify({ type: "capture_error" })), {
2699
+ localParticipant.publishData(textEncoder3.encode(JSON.stringify({ type: "capture_error" })), {
2539
2700
  reliable: true,
2540
2701
  topic: DOM_SNAPSHOT_TOPIC
2541
2702
  }).catch(() => {
@@ -2550,10 +2711,10 @@ async function unpublishAndStopTrack(localParticipant, videoTrack) {
2550
2711
  videoTrack.stop();
2551
2712
  }
2552
2713
  function DomCapture() {
2553
- const { localParticipant } = useLocalParticipant2();
2714
+ const { localParticipant } = useLocalParticipant3();
2554
2715
  const connectionState = useConnectionState2();
2555
2716
  const didStartRef = useRef4(false);
2556
- useEffect9(() => {
2717
+ useEffect11(() => {
2557
2718
  if (didStartRef.current)
2558
2719
  return;
2559
2720
  if (connectionState !== ConnectionState2.Connected)
@@ -2663,7 +2824,7 @@ function DomCapture() {
2663
2824
 
2664
2825
  // src/components/HighlightOverlay.tsx
2665
2826
  import { useDataChannel } from "@livekit/components-react/hooks";
2666
- import { useCallback as useCallback6, useEffect as useEffect10, useRef as useRef5 } from "react";
2827
+ import { useCallback as useCallback7, useEffect as useEffect12, useRef as useRef5 } from "react";
2667
2828
  var HIGHLIGHT_AUTO_CLEAR_MS = 1e4;
2668
2829
  var textDecoder = new TextDecoder;
2669
2830
  function parseHighlightMessage(payload) {
@@ -2688,14 +2849,14 @@ function parseHighlightMessage(payload) {
2688
2849
  function HighlightOverlay() {
2689
2850
  const targetRef = useRef5(null);
2690
2851
  const autoClearRef = useRef5(null);
2691
- const clear = useCallback6(() => {
2852
+ const clear = useCallback7(() => {
2692
2853
  if (autoClearRef.current)
2693
2854
  clearTimeout(autoClearRef.current);
2694
2855
  autoClearRef.current = null;
2695
2856
  targetRef.current = null;
2696
2857
  clearCursorTarget("guide");
2697
2858
  }, []);
2698
- const onHighlightMessage = useCallback6((msg) => {
2859
+ const onHighlightMessage = useCallback7((msg) => {
2699
2860
  const parsed = parseHighlightMessage(msg.payload);
2700
2861
  if (!parsed)
2701
2862
  return;
@@ -2719,7 +2880,7 @@ function HighlightOverlay() {
2719
2880
  autoClearRef.current = setTimeout(clear, HIGHLIGHT_AUTO_CLEAR_MS);
2720
2881
  }, [clear]);
2721
2882
  useDataChannel(HIGHLIGHT_TOPIC, onHighlightMessage);
2722
- useEffect10(() => {
2883
+ useEffect12(() => {
2723
2884
  const onClick = (event) => {
2724
2885
  const target = targetRef.current;
2725
2886
  const node = event.target;
@@ -2729,15 +2890,15 @@ function HighlightOverlay() {
2729
2890
  document.addEventListener("click", onClick, { capture: true });
2730
2891
  return () => document.removeEventListener("click", onClick, { capture: true });
2731
2892
  }, [clear]);
2732
- useEffect10(() => clear, [clear]);
2893
+ useEffect12(() => clear, [clear]);
2733
2894
  return null;
2734
2895
  }
2735
2896
 
2736
2897
  // src/components/MinimizedBubble.tsx
2737
- import { useContext as useContext4, useEffect as useEffect12, useRef as useRef7, useState as useState8 } from "react";
2898
+ import { useContext as useContext5, useEffect as useEffect14, useRef as useRef7, useState as useState10 } from "react";
2738
2899
 
2739
2900
  // src/hooks/useLauncherDrag.ts
2740
- import { useEffect as useEffect11, useRef as useRef6 } from "react";
2901
+ import { useEffect as useEffect13, useRef as useRef6 } from "react";
2741
2902
  import { flushSync } from "react-dom";
2742
2903
  var DRAG_THRESHOLD_PX = 5;
2743
2904
  function useLauncherDrag(containerRef, onDrop, followRefs, reportDragging) {
@@ -2748,7 +2909,7 @@ function useLauncherDrag(containerRef, onDrop, followRefs, reportDragging) {
2748
2909
  followTargetsRef.current = followRefs;
2749
2910
  const reportDraggingRef = useRef6(reportDragging);
2750
2911
  reportDraggingRef.current = reportDragging;
2751
- useEffect11(() => {
2912
+ useEffect13(() => {
2752
2913
  const el = containerRef.current;
2753
2914
  if (!el)
2754
2915
  return;
@@ -2897,7 +3058,7 @@ function cn(...inputs) {
2897
3058
  }
2898
3059
 
2899
3060
  // src/components/AdoptionBubble.tsx
2900
- import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
3061
+ import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
2901
3062
  function AdoptionBubble({
2902
3063
  goal,
2903
3064
  onAttend,
@@ -2905,7 +3066,7 @@ function AdoptionBubble({
2905
3066
  exitDelayMs = 0,
2906
3067
  hidden = false
2907
3068
  }) {
2908
- return /* @__PURE__ */ jsx2("div", {
3069
+ return /* @__PURE__ */ jsx3("div", {
2909
3070
  style: {
2910
3071
  animationDelay: `${appearDelayMs}ms`,
2911
3072
  transitionDelay: hidden ? `${exitDelayMs}ms` : "0ms"
@@ -2916,18 +3077,18 @@ function AdoptionBubble({
2916
3077
  onClick: () => onAttend(goal),
2917
3078
  className: cn("skippr:flex skippr:max-w-72 skippr:items-center skippr:gap-2", "skippr:rounded-[14px] skippr:bg-amber-50 skippr:py-1.5 skippr:pr-3 skippr:pl-1.5", "skippr:text-left skippr:shadow-[0_8px_24px_rgba(0,0,0,0.18)]", "skippr:transition-colors skippr:cursor-pointer skippr:hover:bg-amber-100", "skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-bubble/60"),
2918
3079
  children: [
2919
- /* @__PURE__ */ jsx2("span", {
3080
+ /* @__PURE__ */ jsx3("span", {
2920
3081
  className: cn("skippr:flex skippr:h-6 skippr:w-6 skippr:shrink-0 skippr:items-center skippr:justify-center", "skippr:text-amber-700"),
2921
- children: /* @__PURE__ */ jsx2(Lightbulb, {
3082
+ children: /* @__PURE__ */ jsx3(Lightbulb, {
2922
3083
  className: "skippr:h-3.5 skippr:w-3.5",
2923
3084
  fill: "currentColor"
2924
3085
  })
2925
3086
  }),
2926
- /* @__PURE__ */ jsx2("span", {
3087
+ /* @__PURE__ */ jsx3("span", {
2927
3088
  className: "skippr:min-w-0 skippr:truncate skippr:text-[13px] skippr:font-semibold skippr:text-amber-950",
2928
3089
  children: goal.displayMessage
2929
3090
  }),
2930
- /* @__PURE__ */ jsx2(ArrowRight, {
3091
+ /* @__PURE__ */ jsx3(ArrowRight, {
2931
3092
  className: "skippr:h-3.5 skippr:w-3.5 skippr:shrink-0 skippr:text-amber-700"
2932
3093
  })
2933
3094
  ]
@@ -2936,12 +3097,12 @@ function AdoptionBubble({
2936
3097
  }
2937
3098
 
2938
3099
  // src/components/ModulePill.tsx
2939
- import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
3100
+ import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
2940
3101
  var RING_RADIUS = 8;
2941
3102
  var RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS;
2942
- function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2943
- const completedPhases = progress?.completed ?? module.currentSession?.currentPhaseIndex ?? 0;
2944
- const totalPhases = progress?.total ?? module.totalPhases;
3103
+ function ModulePill({ module, onSelect }) {
3104
+ const completedPhases = module.currentSession?.currentPhaseIndex ?? 0;
3105
+ const totalPhases = module.totalPhases;
2945
3106
  const showProgress = module.mode !== AGENT_MODE.AlwaysOn && totalPhases > 0;
2946
3107
  const progressFraction = showProgress ? Math.min(completedPhases / totalPhases, 1) : 0;
2947
3108
  return /* @__PURE__ */ jsxs3("button", {
@@ -2949,16 +3110,12 @@ function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2949
3110
  onClick: () => onSelect(module.id),
2950
3111
  className: cn("skippr:flex skippr:w-40 skippr:items-center skippr:gap-1.5 skippr:whitespace-nowrap", "skippr:rounded-[14px] skippr:bg-white skippr:px-3 skippr:py-1.5", "skippr:text-[13px] skippr:font-medium skippr:text-black", "skippr:shadow-[0_8px_24px_rgba(0,0,0,0.18)]", "skippr:transition-colors skippr:cursor-pointer skippr:hover:bg-neutral-100", "skippr:animate-[skippr-bubble-in_0.28s_ease-out]", "skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-bubble/60"),
2951
3112
  children: [
2952
- isLive && /* @__PURE__ */ jsx3("span", {
2953
- "aria-hidden": "true",
2954
- className: "skippr:size-[6px] skippr:shrink-0 skippr:rounded-full skippr:bg-emerald-500 skippr:animate-pulse skippr:motion-reduce:animate-none"
2955
- }),
2956
- showProgress && !isLive && /* @__PURE__ */ jsxs3("svg", {
3113
+ showProgress && /* @__PURE__ */ jsxs3("svg", {
2957
3114
  viewBox: "0 0 20 20",
2958
3115
  className: "skippr:size-4 skippr:shrink-0 skippr:-rotate-90",
2959
3116
  "aria-hidden": "true",
2960
3117
  children: [
2961
- /* @__PURE__ */ jsx3("circle", {
3118
+ /* @__PURE__ */ jsx4("circle", {
2962
3119
  cx: "10",
2963
3120
  cy: "10",
2964
3121
  r: RING_RADIUS,
@@ -2966,7 +3123,7 @@ function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2966
3123
  strokeWidth: "2.5",
2967
3124
  className: "skippr:stroke-black/15"
2968
3125
  }),
2969
- /* @__PURE__ */ jsx3("circle", {
3126
+ /* @__PURE__ */ jsx4("circle", {
2970
3127
  cx: "10",
2971
3128
  cy: "10",
2972
3129
  r: RING_RADIUS,
@@ -2979,9 +3136,9 @@ function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2979
3136
  })
2980
3137
  ]
2981
3138
  }),
2982
- /* @__PURE__ */ jsx3("span", {
3139
+ /* @__PURE__ */ jsx4("span", {
2983
3140
  className: "skippr:min-w-0 skippr:flex-1 skippr:truncate skippr:text-left",
2984
- children: label ?? module.name
3141
+ children: module.name
2985
3142
  }),
2986
3143
  showProgress && /* @__PURE__ */ jsxs3("span", {
2987
3144
  className: cn("skippr:ml-0.5 skippr:inline-flex skippr:shrink-0 skippr:items-center skippr:gap-1 skippr:rounded-full", "skippr:bg-black/[0.07] skippr:px-1.5 skippr:py-0.5", "skippr:text-[10px] skippr:font-semibold"),
@@ -2996,29 +3153,86 @@ function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2996
3153
  }
2997
3154
 
2998
3155
  // src/components/MinimizedBubble.tsx
2999
- import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
3156
+ import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
3000
3157
  var GOALS_AUTO_HIDE_MS = 1e4;
3001
3158
  var GOAL_FADE_OUT_MS = 300;
3002
3159
  var GOAL_APPEAR_STAGGER_MS = 150;
3003
3160
  var GOAL_EXIT_STAGGER_MS = 250;
3004
3161
  var MAX_GOAL_BUBBLES = 3;
3005
3162
  var MAX_MODULE_PILLS = 3;
3006
- function IdleLauncher({ position, onClick }) {
3007
- return /* @__PURE__ */ jsx4("button", {
3163
+ function SkipprMark({ onStart }) {
3164
+ return /* @__PURE__ */ jsx5("button", {
3008
3165
  type: "button",
3009
- onClick,
3166
+ onClick: onStart,
3010
3167
  "aria-label": "Ask Me Anything",
3011
- className: cn("skippr:group skippr:relative skippr:h-[50px] skippr:w-[50px]", "skippr:rounded-[16px] skippr:bg-launcher skippr:cursor-pointer", "skippr:shadow-[-6px_6px_22px_rgba(0,0,0,0.3)]", "skippr:[animation:skippr-orb-in_320ms_cubic-bezier(0.34,1.3,0.64,1)]", "skippr:transition-transform skippr:duration-200 skippr:ease-out skippr:hover:scale-110", position === "right" ? "skippr:translate-x-7 skippr:origin-right" : "skippr:-translate-x-7 skippr:origin-left"),
3012
- children: /* @__PURE__ */ jsx4("svg", {
3168
+ className: "skippr:flex skippr:h-[36px] skippr:w-[36px] skippr:shrink-0 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:bg-transparent skippr:p-0",
3169
+ children: /* @__PURE__ */ jsx5("svg", {
3013
3170
  viewBox: "0 0 15.4044 18.4853",
3014
- className: cn("skippr:absolute skippr:top-1/2 skippr:-translate-y-1/2 skippr:h-[18.5px] skippr:w-[15.4px]", position === "right" ? "skippr:right-[24px]" : "skippr:left-[24px]"),
3171
+ className: "skippr:h-[18.5px] skippr:w-[15.4px]",
3015
3172
  fill: "none",
3016
3173
  "aria-hidden": "true",
3017
- children: /* @__PURE__ */ jsx4("path", {
3174
+ children: /* @__PURE__ */ jsx5("path", {
3018
3175
  d: "M2.25789 0.295419C1.33925 -0.413932 0 0.234459 0 1.38715V17.0972C0 18.4106 1.67407 18.987 2.49664 17.9562L6.40435 13.061C6.54853 12.8805 6.73209 12.7348 6.94126 12.6347C7.15043 12.5345 7.37978 12.4826 7.6121 12.4828H14.0025C15.3343 12.4828 15.9134 10.8128 14.8614 10.0037L2.25789 0.295419Z",
3019
3176
  className: "skippr:fill-brand"
3020
3177
  })
3021
- })
3178
+ })
3179
+ });
3180
+ }
3181
+ function ChatButton({
3182
+ revealed,
3183
+ position,
3184
+ onClick
3185
+ }) {
3186
+ return /* @__PURE__ */ jsx5("button", {
3187
+ type: "button",
3188
+ onClick,
3189
+ "aria-label": "Open chat",
3190
+ tabIndex: revealed ? 0 : -1,
3191
+ className: cn("skippr:h-[36px] skippr:shrink-0 skippr:overflow-hidden skippr:p-0", "skippr:transition-all skippr:duration-[400ms] skippr:ease-[cubic-bezier(0.22,1,0.36,1)]", position === "right" ? "skippr:order-last" : "skippr:order-first"),
3192
+ style: {
3193
+ width: revealed ? 36 : 0,
3194
+ opacity: revealed ? 1 : 0,
3195
+ transform: revealed ? "scale(1)" : "scale(0.55)",
3196
+ cursor: revealed ? "pointer" : "default"
3197
+ },
3198
+ children: /* @__PURE__ */ jsx5("span", {
3199
+ className: "skippr:flex skippr:h-[36px] skippr:w-[36px] skippr:items-center skippr:justify-center skippr:rounded-[11px] skippr:bg-white",
3200
+ children: /* @__PURE__ */ jsx5("svg", {
3201
+ width: "18",
3202
+ height: "18",
3203
+ viewBox: "0 0 24 24",
3204
+ fill: "none",
3205
+ stroke: "#1c1f2a",
3206
+ strokeWidth: "2",
3207
+ strokeLinecap: "round",
3208
+ strokeLinejoin: "round",
3209
+ "aria-hidden": "true",
3210
+ children: /* @__PURE__ */ jsx5("path", {
3211
+ d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"
3212
+ })
3213
+ })
3214
+ })
3215
+ });
3216
+ }
3217
+ function IdleLauncher({
3218
+ position,
3219
+ isHovered,
3220
+ onStart,
3221
+ onChat
3222
+ }) {
3223
+ return /* @__PURE__ */ jsxs4("div", {
3224
+ className: cn("skippr:flex skippr:h-[48px] skippr:items-center", "skippr:bg-launcher skippr:p-1.5 skippr:shadow-[-6px_8px_30px_rgba(15,18,26,0.32)]", "skippr:[animation:skippr-orb-in_320ms_cubic-bezier(0.34,1.3,0.64,1)]", "skippr:transition-transform skippr:duration-[400ms] skippr:ease-[cubic-bezier(0.22,1,0.36,1)]", position === "right" ? "skippr:rounded-l-[18px] skippr:origin-right" : "skippr:rounded-r-[18px] skippr:origin-left", position === "right" ? isHovered ? "skippr:translate-x-3" : "skippr:translate-x-7" : isHovered ? "skippr:-translate-x-3" : "skippr:-translate-x-7"),
3225
+ style: { gap: isHovered ? 8 : 0 },
3226
+ children: [
3227
+ /* @__PURE__ */ jsx5(ChatButton, {
3228
+ revealed: isHovered,
3229
+ position,
3230
+ onClick: onChat
3231
+ }),
3232
+ /* @__PURE__ */ jsx5(SkipprMark, {
3233
+ onStart
3234
+ })
3235
+ ]
3022
3236
  });
3023
3237
  }
3024
3238
  function WelcomeBubble({
@@ -3028,7 +3242,7 @@ function WelcomeBubble({
3028
3242
  onDismiss,
3029
3243
  onClick
3030
3244
  }) {
3031
- useEffect12(() => {
3245
+ useEffect14(() => {
3032
3246
  const timer = setTimeout(onDismiss, 5000);
3033
3247
  return () => clearTimeout(timer);
3034
3248
  }, [onDismiss]);
@@ -3039,7 +3253,7 @@ function WelcomeBubble({
3039
3253
  "aria-label": "Dismiss",
3040
3254
  children: [
3041
3255
  message,
3042
- /* @__PURE__ */ jsx4("span", {
3256
+ /* @__PURE__ */ jsx5("span", {
3043
3257
  className: cn("skippr:absolute skippr:size-2.5", "skippr:border-l skippr:border-t skippr:border-border skippr:bg-card", popsDown ? "skippr:bottom-full skippr:rotate-45 skippr:-mb-[5px]" : "skippr:top-full skippr:rotate-[225deg] skippr:-mt-[5px]", position === "right" ? "skippr:right-5" : "skippr:left-5")
3044
3258
  })
3045
3259
  ]
@@ -3050,7 +3264,7 @@ function MinimizedBubble({
3050
3264
  welcomeDismissed,
3051
3265
  onDismissWelcome
3052
3266
  }) {
3053
- const ctx = useContext4(LiveAgentContext);
3267
+ const ctx = useContext5(LiveAgentContext);
3054
3268
  if (!ctx) {
3055
3269
  throw new Error("MinimizedBubble must be used within a <LiveAgent> provider");
3056
3270
  }
@@ -3063,19 +3277,22 @@ function MinimizedBubble({
3063
3277
  startAdoptionSession,
3064
3278
  isAuthenticated,
3065
3279
  displayModules,
3280
+ defaultAgentId,
3281
+ startDefaultSession,
3066
3282
  hasResolvedModules,
3067
3283
  isLoadingModules,
3068
3284
  selectModule,
3069
3285
  expandPanel,
3286
+ setSidebarTab,
3070
3287
  commitLauncherDrop
3071
3288
  } = ctx;
3072
- const [goalsAutoHidden, setGoalsAutoHidden] = useState8(false);
3073
- const [isLauncherHovered, setIsLauncherHovered] = useState8(false);
3074
- const [visitHref, setVisitHref] = useState8(() => window.location.href);
3289
+ const [goalsAutoHidden, setGoalsAutoHidden] = useState10(false);
3290
+ const [isLauncherHovered, setIsLauncherHovered] = useState10(false);
3291
+ const [visitHref, setVisitHref] = useState10(() => window.location.href);
3075
3292
  const revealedHrefRef = useRef7(null);
3076
3293
  const hoverContainerRef = useRef7(null);
3077
- useEffect12(() => subscribeToLocationChange(() => setVisitHref(window.location.href)), []);
3078
- useEffect12(() => {
3294
+ useEffect14(() => subscribeToLocationChange(() => setVisitHref(window.location.href)), []);
3295
+ useEffect14(() => {
3079
3296
  const el = hoverContainerRef.current;
3080
3297
  if (!el)
3081
3298
  return;
@@ -3093,12 +3310,11 @@ function MinimizedBubble({
3093
3310
  const state = getModuleSessionState(module.currentSession, module.mode);
3094
3311
  return state !== "completed" && state !== "expired";
3095
3312
  });
3096
- const alwaysOnModule = actionableModules.find((module) => module.mode === AGENT_MODE.AlwaysOn);
3097
3313
  const pillCandidates = actionableModules.filter((module) => module.mode !== AGENT_MODE.AlwaysOn);
3098
3314
  const onboardingModule = pillCandidates.find((module) => module.type === "onboarding");
3099
3315
  const modulePills = onboardingModule ? [onboardingModule] : pillCandidates.slice(0, MAX_MODULE_PILLS).reverse();
3100
3316
  const goalsEligible = adoptionGoals.length > 0 && !onboardingModule && hasResolvedModules;
3101
- useEffect12(() => {
3317
+ useEffect14(() => {
3102
3318
  if (!goalsEligible)
3103
3319
  return;
3104
3320
  if (revealedHrefRef.current === visitHref) {
@@ -3112,8 +3328,8 @@ function MinimizedBubble({
3112
3328
  }, [goalsEligible, visitHref]);
3113
3329
  const matchedGoals = goalsEligible ? adoptionGoals.slice(0, MAX_GOAL_BUBBLES) : [];
3114
3330
  const goalsHidden = goalsAutoHidden && !isLauncherHovered;
3115
- const [goalsUnmounted, setGoalsUnmounted] = useState8(false);
3116
- useEffect12(() => {
3331
+ const [goalsUnmounted, setGoalsUnmounted] = useState10(false);
3332
+ useEffect14(() => {
3117
3333
  if (!goalsHidden) {
3118
3334
  setGoalsUnmounted(false);
3119
3335
  return;
@@ -3123,12 +3339,18 @@ function MinimizedBubble({
3123
3339
  return () => clearTimeout(timer);
3124
3340
  }, [goalsHidden]);
3125
3341
  const visibleGoals = goalsUnmounted ? [] : matchedGoals;
3342
+ const openChat = (e) => {
3343
+ e.stopPropagation();
3344
+ if (wasDraggedRef.current)
3345
+ return;
3346
+ setSidebarTab("chat");
3347
+ expandPanel();
3348
+ };
3126
3349
  const launchDefaultSession = () => {
3127
3350
  if (wasDraggedRef.current || isStarting || isLoadingModules)
3128
3351
  return;
3129
- const target = isAuthenticated ? alwaysOnModule ?? onboardingModule ?? pillCandidates[0] : null;
3130
- if (target) {
3131
- selectModule(target.id);
3352
+ if (isAuthenticated && defaultAgentId) {
3353
+ startDefaultSession();
3132
3354
  } else {
3133
3355
  expandPanel();
3134
3356
  }
@@ -3141,7 +3363,7 @@ function MinimizedBubble({
3141
3363
  (modulePills.length > 0 || visibleGoals.length > 0) && /* @__PURE__ */ jsxs4("div", {
3142
3364
  className: cn("skippr:absolute skippr:gap-2", popsDown ? "skippr:top-full skippr:mt-3 skippr:flex skippr:flex-col-reverse" : "skippr:bottom-full skippr:mb-3 skippr:flex skippr:flex-col", position === "right" ? "skippr:right-0 skippr:items-end" : "skippr:left-0 skippr:items-start"),
3143
3365
  children: [
3144
- visibleGoals.map((goal, index2) => /* @__PURE__ */ jsx4(AdoptionBubble, {
3366
+ visibleGoals.map((goal, index2) => /* @__PURE__ */ jsx5(AdoptionBubble, {
3145
3367
  goal,
3146
3368
  onAttend: (attended) => {
3147
3369
  if (!wasDraggedRef.current)
@@ -3151,7 +3373,7 @@ function MinimizedBubble({
3151
3373
  exitDelayMs: (visibleGoals.length - 1 - index2) * GOAL_EXIT_STAGGER_MS,
3152
3374
  hidden: goalsHidden
3153
3375
  }, goal.goalId)),
3154
- modulePills.map((module) => /* @__PURE__ */ jsx4(ModulePill, {
3376
+ modulePills.map((module) => /* @__PURE__ */ jsx5(ModulePill, {
3155
3377
  module,
3156
3378
  onSelect: (id) => {
3157
3379
  if (!wasDraggedRef.current)
@@ -3160,7 +3382,7 @@ function MinimizedBubble({
3160
3382
  }, module.id))
3161
3383
  ]
3162
3384
  }),
3163
- welcomeMessage && !welcomeDismissed && adoptionGoals.length === 0 && modulePills.length === 0 && /* @__PURE__ */ jsx4(WelcomeBubble, {
3385
+ welcomeMessage && !welcomeDismissed && adoptionGoals.length === 0 && modulePills.length === 0 && /* @__PURE__ */ jsx5(WelcomeBubble, {
3164
3386
  message: welcomeMessage,
3165
3387
  position,
3166
3388
  popsDown,
@@ -3170,9 +3392,11 @@ function MinimizedBubble({
3170
3392
  onDismissWelcome();
3171
3393
  }
3172
3394
  }),
3173
- /* @__PURE__ */ jsx4(IdleLauncher, {
3395
+ /* @__PURE__ */ jsx5(IdleLauncher, {
3174
3396
  position,
3175
- onClick: launchDefaultSession
3397
+ isHovered: isLauncherHovered,
3398
+ onStart: launchDefaultSession,
3399
+ onChat: openChat
3176
3400
  })
3177
3401
  ]
3178
3402
  });
@@ -3180,7 +3404,7 @@ function MinimizedBubble({
3180
3404
 
3181
3405
  // src/components/PageActionHandler.tsx
3182
3406
  import { useDataChannel as useDataChannel2 } from "@livekit/components-react/hooks";
3183
- import { useCallback as useCallback7, useEffect as useEffect13, useRef as useRef8 } from "react";
3407
+ import { useCallback as useCallback8, useEffect as useEffect15, useRef as useRef8 } from "react";
3184
3408
  var STEP_MAX_WAIT_MS = 5000;
3185
3409
  var POST_ACTION_SETTLE_SNAPSHOT_MS = 300;
3186
3410
  var textDecoder2 = new TextDecoder;
@@ -3402,7 +3626,7 @@ function PageActionHandler() {
3402
3626
  const drainingRef = useRef8(false);
3403
3627
  const settleTimerRef = useRef8(null);
3404
3628
  const endStepRef = useRef8(null);
3405
- const runStep = useCallback7((action) => {
3629
+ const runStep = useCallback8((action) => {
3406
3630
  return new Promise((resolve) => {
3407
3631
  if (action.type === "scroll_page") {
3408
3632
  let scrolled = false;
@@ -3471,7 +3695,7 @@ function PageActionHandler() {
3471
3695
  });
3472
3696
  });
3473
3697
  }, []);
3474
- const drain = useCallback7(async () => {
3698
+ const drain = useCallback8(async () => {
3475
3699
  if (drainingRef.current)
3476
3700
  return;
3477
3701
  drainingRef.current = true;
@@ -3502,14 +3726,14 @@ function PageActionHandler() {
3502
3726
  }
3503
3727
  }
3504
3728
  }, [runStep]);
3505
- const onMessage = useCallback7((msg) => {
3729
+ const onMessage = useCallback8((msg) => {
3506
3730
  const action = parsePageAction(msg.payload);
3507
3731
  if (!action)
3508
3732
  return;
3509
3733
  queueRef.current.push(action);
3510
3734
  drain();
3511
3735
  }, [drain]);
3512
- useEffect13(() => {
3736
+ useEffect15(() => {
3513
3737
  mountedRef.current = true;
3514
3738
  drainingRef.current = false;
3515
3739
  return () => {
@@ -3521,7 +3745,7 @@ function PageActionHandler() {
3521
3745
  setActionsBusy(false);
3522
3746
  };
3523
3747
  }, []);
3524
- useEffect13(() => {
3748
+ useEffect15(() => {
3525
3749
  return onActionsPausedChange((paused) => {
3526
3750
  if (paused) {
3527
3751
  clearCursorTarget("act");
@@ -3540,22 +3764,22 @@ function PageActionHandler() {
3540
3764
  import { useContext as useContext6, useEffect as useEffect18 } from "react";
3541
3765
 
3542
3766
  // src/hooks/useActionControl.ts
3543
- import { useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
3544
- import { useCallback as useCallback8, useEffect as useEffect14, useState as useState9 } from "react";
3545
- var textEncoder3 = new TextEncoder;
3767
+ import { useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react/hooks";
3768
+ import { useCallback as useCallback9, useEffect as useEffect16, useState as useState11 } from "react";
3769
+ var textEncoder4 = new TextEncoder;
3546
3770
  function useActionControl() {
3547
- const { localParticipant } = useLocalParticipant3();
3771
+ const { localParticipant } = useLocalParticipant4();
3548
3772
  const plan = usePlanUpdates();
3549
- const [busy, setBusy] = useState9(isActionsBusy);
3550
- const [actionsPaused2, setPaused] = useState9(false);
3551
- useEffect14(() => subscribeActionsBusy(setBusy), []);
3773
+ const [busy, setBusy] = useState11(isActionsBusy);
3774
+ const [actionsPaused2, setPaused] = useState11(false);
3775
+ useEffect16(() => subscribeActionsBusy(setBusy), []);
3552
3776
  const actionsActive = busy || plan?.state === "executing";
3553
- const togglePaused = useCallback8(async () => {
3777
+ const togglePaused = useCallback9(async () => {
3554
3778
  const next = !actionsPaused2;
3555
3779
  setPaused(next);
3556
3780
  setActionsPaused(next);
3557
3781
  try {
3558
- await localParticipant.publishData(textEncoder3.encode(JSON.stringify({ type: next ? "pause" : "resume" })), { reliable: true, topic: ACTION_CONTROL_TOPIC });
3782
+ await localParticipant.publishData(textEncoder4.encode(JSON.stringify({ type: next ? "pause" : "resume" })), { reliable: true, topic: ACTION_CONTROL_TOPIC });
3559
3783
  } catch (error) {
3560
3784
  console.error("Failed to send action pause/resume:", error);
3561
3785
  }
@@ -3576,13 +3800,13 @@ function useAgentVoiceState() {
3576
3800
  }
3577
3801
 
3578
3802
  // src/hooks/useAudioLevelBars.ts
3579
- import { useEffect as useEffect15, useRef as useRef9, useState as useState10 } from "react";
3803
+ import { useEffect as useEffect17, useRef as useRef9, useState as useState12 } from "react";
3580
3804
  var TALKING_LEVEL_THRESHOLD = 0.2;
3581
3805
  var TALKING_HOLD_MS = 400;
3582
3806
  function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowthPx, noiseGate }) {
3583
3807
  const barRefs = useRef9([]);
3584
- const [isTalking, setIsTalking] = useState10(false);
3585
- useEffect15(() => {
3808
+ const [isTalking, setIsTalking] = useState12(false);
3809
+ useEffect17(() => {
3586
3810
  if (!mediaStreamTrack) {
3587
3811
  for (const bar of barRefs.current) {
3588
3812
  if (bar)
@@ -3633,26 +3857,26 @@ function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowth
3633
3857
  }
3634
3858
 
3635
3859
  // src/hooks/useMediaControls.ts
3636
- import { useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react/hooks";
3860
+ import { useLocalParticipant as useLocalParticipant5 } from "@livekit/components-react/hooks";
3637
3861
  import { ScreenSharePresets as ScreenSharePresets2 } from "livekit-client";
3638
- import { useCallback as useCallback9 } from "react";
3862
+ import { useCallback as useCallback10 } from "react";
3639
3863
  var SCREEN_SHARE_OPTIONS = {
3640
3864
  video: { displaySurface: "browser" },
3641
3865
  resolution: ScreenSharePresets2.h720fps30.resolution,
3642
3866
  contentHint: "detail"
3643
3867
  };
3644
3868
  function useMediaControls() {
3645
- const { localParticipant } = useLocalParticipant4();
3869
+ const { localParticipant } = useLocalParticipant5();
3646
3870
  const isMuted = !localParticipant.isMicrophoneEnabled;
3647
3871
  const isScreenSharing = localParticipant.isScreenShareEnabled;
3648
- const toggleMute = useCallback9(async () => {
3872
+ const toggleMute = useCallback10(async () => {
3649
3873
  try {
3650
3874
  await localParticipant.setMicrophoneEnabled(isMuted);
3651
3875
  } catch (error) {
3652
3876
  console.error("Failed to toggle microphone:", error);
3653
3877
  }
3654
3878
  }, [localParticipant, isMuted]);
3655
- const toggleScreenShare = useCallback9(async () => {
3879
+ const toggleScreenShare = useCallback10(async () => {
3656
3880
  try {
3657
3881
  await localParticipant.setScreenShareEnabled(!isScreenSharing, SCREEN_SHARE_OPTIONS);
3658
3882
  } catch (error) {
@@ -3663,13 +3887,13 @@ function useMediaControls() {
3663
3887
  }
3664
3888
 
3665
3889
  // src/hooks/useMicLevel.ts
3666
- import { useLocalParticipant as useLocalParticipant5 } from "@livekit/components-react/hooks";
3890
+ import { useLocalParticipant as useLocalParticipant6 } from "@livekit/components-react/hooks";
3667
3891
  var MIC_BARS = 5;
3668
3892
  var IDLE_BAR_HEIGHT_PX = 5;
3669
3893
  var MAX_BAR_GROWTH_PX = 17;
3670
3894
  var MIC_NOISE_GATE = 0.15;
3671
3895
  function useMicLevel(enabled) {
3672
- const { microphoneTrack } = useLocalParticipant5();
3896
+ const { microphoneTrack } = useLocalParticipant6();
3673
3897
  const mediaStreamTrack = microphoneTrack?.track?.mediaStreamTrack;
3674
3898
  return useAudioLevelBars(enabled ? mediaStreamTrack : undefined, {
3675
3899
  barCount: MIC_BARS,
@@ -3679,92 +3903,6 @@ function useMicLevel(enabled) {
3679
3903
  });
3680
3904
  }
3681
3905
 
3682
- // src/hooks/usePhaseUpdates.ts
3683
- import { useCallback as useCallback10, useContext as useContext5, useEffect as useEffect16 } from "react";
3684
- function parsePhases(json) {
3685
- try {
3686
- const data = JSON.parse(json);
3687
- if (data.type === "phase_update" && Array.isArray(data.phases)) {
3688
- return data.phases;
3689
- }
3690
- } catch {}
3691
- return null;
3692
- }
3693
- function usePhaseUpdates() {
3694
- const parse = useCallback10(parsePhases, []);
3695
- const livePhases = useAgentState("phases", parse, []);
3696
- const ctx = useContext5(LiveAgentContext);
3697
- useEffect16(() => {
3698
- if (livePhases.length > 0)
3699
- ctx?.setPhasesSnapshot(livePhases);
3700
- }, [livePhases, ctx?.setPhasesSnapshot]);
3701
- const phases = livePhases.length > 0 ? livePhases : ctx?.phasesSnapshot ?? [];
3702
- return { phases };
3703
- }
3704
-
3705
- // src/hooks/useSessionHold.ts
3706
- import { useLocalParticipant as useLocalParticipant6 } from "@livekit/components-react/hooks";
3707
- import { useCallback as useCallback11, useEffect as useEffect17, useState as useState11 } from "react";
3708
- var textEncoder4 = new TextEncoder;
3709
- var FALLBACK_PAUSE_TIMEOUT_SECONDS = 120;
3710
- function useSessionHold({
3711
- pauseSession,
3712
- pauseTimeoutSeconds
3713
- }) {
3714
- const { localParticipant } = useLocalParticipant6();
3715
- const timeoutSeconds = pauseTimeoutSeconds ?? FALLBACK_PAUSE_TIMEOUT_SECONDS;
3716
- const [isHeld, setIsHeld] = useState11(false);
3717
- const [countdown, setCountdown] = useState11(timeoutSeconds);
3718
- const publish = useCallback11(async (type) => {
3719
- await localParticipant.publishData(textEncoder4.encode(JSON.stringify({ type })), {
3720
- reliable: true,
3721
- topic: SESSION_HOLD_TOPIC
3722
- });
3723
- }, [localParticipant]);
3724
- const hold = useCallback11(async () => {
3725
- try {
3726
- await localParticipant.setMicrophoneEnabled(false);
3727
- await publish("pause");
3728
- setIsHeld(true);
3729
- } catch (error) {
3730
- console.error("Failed to hold session:", error);
3731
- }
3732
- }, [localParticipant, publish]);
3733
- const release = useCallback11(async () => {
3734
- try {
3735
- await localParticipant.setMicrophoneEnabled(true);
3736
- await publish("resume");
3737
- setIsHeld(false);
3738
- } catch (error) {
3739
- console.error("Failed to release session:", error);
3740
- }
3741
- }, [localParticipant, publish]);
3742
- useEffect17(() => {
3743
- if (!isHeld) {
3744
- setCountdown(timeoutSeconds);
3745
- return;
3746
- }
3747
- const id = setInterval(() => {
3748
- setCountdown((seconds) => Math.max(0, seconds - 1));
3749
- }, 1000);
3750
- return () => clearInterval(id);
3751
- }, [isHeld, timeoutSeconds]);
3752
- useEffect17(() => {
3753
- if (isHeld && countdown === 0) {
3754
- setIsHeld(false);
3755
- pauseSession();
3756
- }
3757
- }, [isHeld, countdown, pauseSession]);
3758
- const toggle = useCallback11(() => {
3759
- if (isHeld) {
3760
- release();
3761
- } else {
3762
- hold();
3763
- }
3764
- }, [isHeld, hold, release]);
3765
- return { isHeld, countdown, toggle };
3766
- }
3767
-
3768
3906
  // src/components/PausedCountdown.tsx
3769
3907
  import { jsxs as jsxs5 } from "react/jsx-runtime";
3770
3908
  function PausedCountdown({ secondsRemaining }) {
@@ -3789,10 +3927,10 @@ function PausedCountdown({ secondsRemaining }) {
3789
3927
  }
3790
3928
 
3791
3929
  // src/components/SessionControlBar.tsx
3792
- import { jsx as jsx5, jsxs as jsxs6, Fragment } from "react/jsx-runtime";
3930
+ import { jsx as jsx6, jsxs as jsxs6, Fragment } from "react/jsx-runtime";
3793
3931
  var STANDBY_BAR_WIDTH = 168;
3794
3932
  var READY_BAR_WIDTH = 238;
3795
- var PAUSED_BAR_WIDTH = 200;
3933
+ var PAUSED_BAR_WIDTH = 248;
3796
3934
  var TEXT_BAR_WIDTH = 100;
3797
3935
  var SCREEN_SHARE_EXTRA_WIDTH = 46;
3798
3936
  var ACTION_CONTROL_EXTRA_WIDTH = 46;
@@ -3827,16 +3965,16 @@ function AgentActivity({
3827
3965
  className: "skippr:flex skippr:items-center skippr:gap-1.5 skippr:text-bubble",
3828
3966
  "aria-label": isActing ? "Agent is acting" : `Agent is ${state}`,
3829
3967
  children: [
3830
- /* @__PURE__ */ jsx5("span", {
3968
+ /* @__PURE__ */ jsx6("span", {
3831
3969
  className: "skippr:flex skippr:size-5 skippr:shrink-0 skippr:items-center skippr:justify-center",
3832
- children: isActing ? /* @__PURE__ */ jsx5(MousePointerClick, {
3970
+ children: isActing ? /* @__PURE__ */ jsx6(MousePointerClick, {
3833
3971
  strokeWidth: 2,
3834
3972
  className: "skippr:size-5 skippr:[animation:skippr-finger-tap_1.1s_ease-in-out_infinite]"
3835
3973
  }) : /* @__PURE__ */ jsxs6(Fragment, {
3836
3974
  children: [
3837
- state === "speaking" && /* @__PURE__ */ jsx5("span", {
3975
+ state === "speaking" && /* @__PURE__ */ jsx6("span", {
3838
3976
  className: "skippr:flex skippr:h-5 skippr:items-center skippr:gap-[2px]",
3839
- children: Array.from({ length: AGENT_BARS }).map((_, index2) => /* @__PURE__ */ jsx5("span", {
3977
+ children: Array.from({ length: AGENT_BARS }).map((_, index2) => /* @__PURE__ */ jsx6("span", {
3840
3978
  ref: (el) => {
3841
3979
  barRefs.current[index2] = el;
3842
3980
  },
@@ -3847,13 +3985,13 @@ function AgentActivity({
3847
3985
  state === "thinking" && /* @__PURE__ */ jsxs6("span", {
3848
3986
  className: "skippr:flex skippr:items-center skippr:gap-[3px]",
3849
3987
  children: [
3850
- /* @__PURE__ */ jsx5("span", {
3988
+ /* @__PURE__ */ jsx6("span", {
3851
3989
  className: "skippr:size-[5px] skippr:rounded-full skippr:bg-current skippr:animate-bounce skippr:[animation-delay:0ms]"
3852
3990
  }),
3853
- /* @__PURE__ */ jsx5("span", {
3991
+ /* @__PURE__ */ jsx6("span", {
3854
3992
  className: "skippr:size-[5px] skippr:rounded-full skippr:bg-current skippr:animate-bounce skippr:[animation-delay:150ms]"
3855
3993
  }),
3856
- /* @__PURE__ */ jsx5("span", {
3994
+ /* @__PURE__ */ jsx6("span", {
3857
3995
  className: "skippr:size-[5px] skippr:rounded-full skippr:bg-current skippr:animate-bounce skippr:[animation-delay:300ms]"
3858
3996
  })
3859
3997
  ]
@@ -3868,10 +4006,10 @@ function AgentActivity({
3868
4006
  strokeLinejoin: "round",
3869
4007
  "aria-hidden": "true",
3870
4008
  children: [
3871
- /* @__PURE__ */ jsx5("path", {
4009
+ /* @__PURE__ */ jsx6("path", {
3872
4010
  d: "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z"
3873
4011
  }),
3874
- /* @__PURE__ */ jsx5("circle", {
4012
+ /* @__PURE__ */ jsx6("circle", {
3875
4013
  cx: "12",
3876
4014
  cy: "12",
3877
4015
  r: "2.5",
@@ -3884,7 +4022,7 @@ function AgentActivity({
3884
4022
  ]
3885
4023
  })
3886
4024
  }),
3887
- /* @__PURE__ */ jsx5("span", {
4025
+ /* @__PURE__ */ jsx6("span", {
3888
4026
  className: "skippr:text-[11px] skippr:font-medium skippr:capitalize",
3889
4027
  children: label
3890
4028
  })
@@ -3911,11 +4049,9 @@ function SessionControlBar() {
3911
4049
  const {
3912
4050
  textMode,
3913
4051
  launcherBottomPx,
3914
- popsDown,
3915
4052
  controlBarRef,
3916
4053
  commitLauncherDrop,
3917
4054
  panelRef,
3918
- pauseTimeoutSeconds,
3919
4055
  isDragging,
3920
4056
  setIsDragging
3921
4057
  } = internalCtx;
@@ -3924,16 +4060,8 @@ function SessionControlBar() {
3924
4060
  const { wasDraggedRef } = useLauncherDrag(controlBarRef, commitLauncherDrop, panelFollowers, setIsDragging);
3925
4061
  const { isMuted, toggleMute, isScreenSharing, toggleScreenShare } = useMediaControls();
3926
4062
  const { state, mediaStreamTrack: agentMediaStreamTrack } = useAgentVoiceState();
3927
- const { phases } = usePhaseUpdates();
3928
4063
  const { actionsActive, actionsPaused: actionsPaused2, togglePaused } = useActionControl();
3929
- const {
3930
- isHeld,
3931
- countdown,
3932
- toggle: togglePause
3933
- } = useSessionHold({
3934
- pauseSession,
3935
- pauseTimeoutSeconds
3936
- });
4064
+ const { isHeld, countdown, toggle: togglePause } = useSessionHoldContext();
3937
4065
  useEffect18(() => {
3938
4066
  if (isHeld)
3939
4067
  minimizePanel();
@@ -3955,18 +4083,6 @@ function SessionControlBar() {
3955
4083
  }
3956
4084
  }
3957
4085
  const agendaModule = activeModule && activeModule.mode !== AGENT_MODE.AlwaysOn && activeModule.totalPhases > 0 ? activeModule : null;
3958
- const agendaProgress = phases.length > 0 ? {
3959
- completed: phases.filter((phase) => phase.status === "completed").length,
3960
- total: phases.length
3961
- } : agendaModule ? {
3962
- completed: agendaModule.currentSession?.currentPhaseIndex ?? 0,
3963
- total: agendaModule.totalPhases
3964
- } : null;
3965
- const currentPhaseName = phases.find((phase) => phase.status === "active")?.name ?? phases.find((phase) => phase.status === "pending")?.name;
3966
- const openAgenda = () => {
3967
- setSidebarTab("agenda");
3968
- expandPanel();
3969
- };
3970
4086
  const togglePanel = () => {
3971
4087
  if (isPanelOpen) {
3972
4088
  minimizePanel();
@@ -3980,21 +4096,20 @@ function SessionControlBar() {
3980
4096
  return;
3981
4097
  action();
3982
4098
  };
4099
+ const panelToggleButton = /* @__PURE__ */ jsx6("button", {
4100
+ type: "button",
4101
+ onClick: ifNotDragged(togglePanel),
4102
+ "aria-label": isPanelOpen ? "Close panel" : agendaModule && !textMode ? "Open agenda" : "Open chat",
4103
+ className: cn(SQUARE_BUTTON, "skippr:text-neutral-700", textMode ? "skippr:hover:bg-neutral-100" : "skippr:bg-neutral-100 skippr:hover:bg-neutral-200"),
4104
+ children: /* @__PURE__ */ jsx6(MessageSquare, {
4105
+ className: "skippr:size-5"
4106
+ })
4107
+ });
3983
4108
  return /* @__PURE__ */ jsxs6("div", {
3984
4109
  ref: controlBarRef,
3985
4110
  style: { bottom: launcherBottomPx },
3986
4111
  className: cn("skippr:fixed skippr:z-[9999] skippr:touch-none skippr:cursor-grab", position === "right" ? "skippr:right-3" : "skippr:left-3"),
3987
4112
  children: [
3988
- !isPanelOpen && agendaModule && agendaProgress && /* @__PURE__ */ jsx5("div", {
3989
- className: cn("skippr:absolute", popsDown ? "skippr:top-full skippr:mt-3" : "skippr:bottom-full skippr:mb-3", isReady ? position === "right" ? "skippr:right-7" : "skippr:left-7" : position === "right" ? "skippr:right-0" : "skippr:left-0"),
3990
- children: /* @__PURE__ */ jsx5(ModulePill, {
3991
- module: agendaModule,
3992
- onSelect: ifNotDragged(openAgenda),
3993
- progress: agendaProgress,
3994
- label: currentPhaseName ?? agendaModule.name,
3995
- isLive: true
3996
- })
3997
- }),
3998
4113
  /* @__PURE__ */ jsxs6("div", {
3999
4114
  style: { width: barWidth },
4000
4115
  className: cn("skippr:group skippr:relative skippr:flex skippr:h-[54px] skippr:items-center skippr:justify-center skippr:gap-2", "skippr:rounded-[20px] skippr:bg-white skippr:p-2", "skippr:shadow-[0_10px_32px_rgba(0,0,0,0.18)] skippr:ring-1 skippr:ring-black/5", "skippr:transition-[width,margin] skippr:duration-300 skippr:ease-out", "skippr:[animation:skippr-toolset-pop_440ms_cubic-bezier(0.22,1,0.36,1)]", isReady && (position === "right" ? "skippr:mr-7" : "skippr:ml-7")),
@@ -4005,18 +4120,18 @@ function SessionControlBar() {
4005
4120
  /* @__PURE__ */ jsxs6("span", {
4006
4121
  className: "skippr:flex skippr:items-center skippr:gap-[3px]",
4007
4122
  children: [
4008
- /* @__PURE__ */ jsx5("span", {
4123
+ /* @__PURE__ */ jsx6("span", {
4009
4124
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-bubble skippr:animate-bounce skippr:[animation-delay:0ms]"
4010
4125
  }),
4011
- /* @__PURE__ */ jsx5("span", {
4126
+ /* @__PURE__ */ jsx6("span", {
4012
4127
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-bubble skippr:animate-bounce skippr:[animation-delay:150ms]"
4013
4128
  }),
4014
- /* @__PURE__ */ jsx5("span", {
4129
+ /* @__PURE__ */ jsx6("span", {
4015
4130
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-bubble skippr:animate-bounce skippr:[animation-delay:300ms]"
4016
4131
  })
4017
4132
  ]
4018
4133
  }),
4019
- /* @__PURE__ */ jsx5("span", {
4134
+ /* @__PURE__ */ jsx6("span", {
4020
4135
  children: "Standing by…"
4021
4136
  })
4022
4137
  ]
@@ -4024,32 +4139,37 @@ function SessionControlBar() {
4024
4139
  isReady && /* @__PURE__ */ jsxs6("div", {
4025
4140
  className: cn("skippr:flex skippr:items-center skippr:gap-2 skippr:[animation:skippr-stage-fade_240ms_ease-out]", isHeld && "skippr:w-full skippr:justify-start"),
4026
4141
  children: [
4027
- /* @__PURE__ */ jsx5("button", {
4142
+ /* @__PURE__ */ jsx6("button", {
4028
4143
  type: "button",
4029
4144
  onClick: ifNotDragged(togglePause),
4030
4145
  "aria-label": isHeld ? "Resume" : "Pause",
4031
4146
  title: isHeld ? "Resume" : "Pause",
4032
4147
  className: cn(SQUARE_BUTTON, isHeld ? "skippr:bg-bubble skippr:text-white skippr:hover:bg-[#3a384b]" : "skippr:bg-neutral-100 skippr:text-neutral-700 skippr:hover:bg-neutral-200"),
4033
- children: isHeld ? /* @__PURE__ */ jsx5(Play, {
4148
+ children: isHeld ? /* @__PURE__ */ jsx6(Play, {
4034
4149
  className: "skippr:size-5",
4035
4150
  fill: "currentColor"
4036
- }) : /* @__PURE__ */ jsx5(Pause, {
4151
+ }) : /* @__PURE__ */ jsx6(Pause, {
4037
4152
  className: "skippr:size-5",
4038
4153
  fill: "currentColor"
4039
4154
  })
4040
4155
  }),
4041
- isHeld ? /* @__PURE__ */ jsx5(PausedCountdown, {
4042
- secondsRemaining: countdown
4156
+ isHeld ? /* @__PURE__ */ jsxs6(Fragment, {
4157
+ children: [
4158
+ /* @__PURE__ */ jsx6(PausedCountdown, {
4159
+ secondsRemaining: countdown
4160
+ }),
4161
+ panelToggleButton
4162
+ ]
4043
4163
  }) : /* @__PURE__ */ jsxs6(Fragment, {
4044
4164
  children: [
4045
4165
  !textMode && /* @__PURE__ */ jsxs6("div", {
4046
4166
  className: "skippr:relative skippr:h-[38px]",
4047
4167
  style: { width: MIC_REGION_WIDTH },
4048
4168
  children: [
4049
- !isTalking && /* @__PURE__ */ jsx5("span", {
4169
+ !isTalking && /* @__PURE__ */ jsx6("span", {
4050
4170
  className: "skippr:absolute skippr:inset-y-0 skippr:right-0 skippr:flex skippr:items-center skippr:justify-center skippr:[animation:skippr-agent-in_200ms_ease-out_240ms_both]",
4051
4171
  style: { width: AGENT_ACTIVITY_WIDTH },
4052
- children: /* @__PURE__ */ jsx5(AgentActivity, {
4172
+ children: /* @__PURE__ */ jsx6(AgentActivity, {
4053
4173
  state,
4054
4174
  isActing: showActionControl && !actionsPaused2,
4055
4175
  mediaStreamTrack: agentMediaStreamTrack
@@ -4062,17 +4182,17 @@ function SessionControlBar() {
4062
4182
  className: cn("skippr:group skippr:absolute skippr:top-0 skippr:left-0 skippr:z-10 skippr:flex skippr:h-[38px] skippr:items-center skippr:gap-2.5 skippr:overflow-hidden skippr:rounded-[12px] skippr:bg-bubble skippr:text-white skippr:cursor-pointer skippr:transition-[width] skippr:duration-300 skippr:ease-out", isTalking ? "skippr:justify-start skippr:pl-3.5" : "skippr:justify-center"),
4063
4183
  style: { width: isTalking ? MIC_REGION_WIDTH : MIC_SQUARE_WIDTH },
4064
4184
  children: [
4065
- /* @__PURE__ */ jsx5("span", {
4185
+ /* @__PURE__ */ jsx6("span", {
4066
4186
  className: cn("skippr:flex skippr:shrink-0 skippr:items-center skippr:justify-center skippr:transition-colors", isMuted ? "skippr:text-red-400 skippr:group-hover:text-red-300" : "skippr:text-white skippr:group-hover:text-white/80"),
4067
- children: isMuted ? /* @__PURE__ */ jsx5(MicOff, {
4187
+ children: isMuted ? /* @__PURE__ */ jsx6(MicOff, {
4068
4188
  className: "skippr:size-5"
4069
- }) : /* @__PURE__ */ jsx5(Mic, {
4189
+ }) : /* @__PURE__ */ jsx6(Mic, {
4070
4190
  className: "skippr:size-5"
4071
4191
  })
4072
4192
  }),
4073
- /* @__PURE__ */ jsx5("span", {
4193
+ /* @__PURE__ */ jsx6("span", {
4074
4194
  className: cn("skippr:h-6 skippr:flex-1 skippr:items-center skippr:justify-center skippr:gap-[3px] skippr:transition-opacity skippr:duration-200", isTalking ? "skippr:flex skippr:opacity-100" : "skippr:hidden"),
4075
- children: Array.from({ length: MIC_BARS }).map((_, index2) => /* @__PURE__ */ jsx5("span", {
4195
+ children: Array.from({ length: MIC_BARS }).map((_, index2) => /* @__PURE__ */ jsx6("span", {
4076
4196
  ref: (el) => {
4077
4197
  barRefs.current[index2] = el;
4078
4198
  },
@@ -4084,36 +4204,28 @@ function SessionControlBar() {
4084
4204
  })
4085
4205
  ]
4086
4206
  }),
4087
- showScreenShareToggle && /* @__PURE__ */ jsx5("button", {
4207
+ showScreenShareToggle && /* @__PURE__ */ jsx6("button", {
4088
4208
  type: "button",
4089
4209
  onClick: ifNotDragged(() => void toggleScreenShare()),
4090
4210
  "aria-label": isScreenSharing ? "Stop sharing screen" : "Share screen",
4091
4211
  className: cn(SQUARE_BUTTON, isScreenSharing ? "skippr:bg-bubble skippr:text-white skippr:hover:bg-[#3a384b]" : "skippr:bg-neutral-100 skippr:text-neutral-700 skippr:hover:bg-neutral-200"),
4092
- children: isScreenSharing ? /* @__PURE__ */ jsx5(MonitorOff, {
4212
+ children: isScreenSharing ? /* @__PURE__ */ jsx6(MonitorOff, {
4093
4213
  className: "skippr:size-5"
4094
- }) : /* @__PURE__ */ jsx5(Monitor, {
4095
- className: "skippr:size-5"
4096
- })
4097
- }),
4098
- /* @__PURE__ */ jsx5("button", {
4099
- type: "button",
4100
- onClick: ifNotDragged(togglePanel),
4101
- "aria-label": isPanelOpen ? "Close panel" : agendaModule && !textMode ? "Open agenda" : "Open chat",
4102
- className: cn(SQUARE_BUTTON, "skippr:text-neutral-700", textMode ? "skippr:hover:bg-neutral-100" : "skippr:bg-neutral-100 skippr:hover:bg-neutral-200"),
4103
- children: /* @__PURE__ */ jsx5(MessageSquare, {
4214
+ }) : /* @__PURE__ */ jsx6(Monitor, {
4104
4215
  className: "skippr:size-5"
4105
4216
  })
4106
4217
  }),
4107
- showActionControl && /* @__PURE__ */ jsx5("button", {
4218
+ panelToggleButton,
4219
+ showActionControl && /* @__PURE__ */ jsx6("button", {
4108
4220
  type: "button",
4109
4221
  onClick: ifNotDragged(() => void togglePaused()),
4110
4222
  "aria-label": actionsPaused2 ? "Resume actions" : "Stop actions",
4111
4223
  title: actionsPaused2 ? "Resume" : "Stop",
4112
4224
  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"),
4113
- children: actionsPaused2 ? /* @__PURE__ */ jsx5(Play, {
4225
+ children: actionsPaused2 ? /* @__PURE__ */ jsx6(Play, {
4114
4226
  className: "skippr:size-5",
4115
4227
  fill: "currentColor"
4116
- }) : /* @__PURE__ */ jsx5(Square, {
4228
+ }) : /* @__PURE__ */ jsx6(Square, {
4117
4229
  className: "skippr:size-5",
4118
4230
  fill: "currentColor"
4119
4231
  })
@@ -4124,7 +4236,7 @@ function SessionControlBar() {
4124
4236
  }, textMode ? "ready-text" : "ready")
4125
4237
  ]
4126
4238
  }),
4127
- isReady && !isDragging && /* @__PURE__ */ jsx5("button", {
4239
+ isReady && !isDragging && /* @__PURE__ */ jsx6("button", {
4128
4240
  type: "button",
4129
4241
  onClick: ifNotDragged(() => void pauseSession()),
4130
4242
  disabled: isPausing,
@@ -4134,7 +4246,7 @@ function SessionControlBar() {
4134
4246
  children: /* @__PURE__ */ jsxs6("span", {
4135
4247
  className: "skippr:relative skippr:flex skippr:size-5 skippr:items-center skippr:justify-center",
4136
4248
  children: [
4137
- /* @__PURE__ */ jsx5(X, {
4249
+ /* @__PURE__ */ jsx6(X, {
4138
4250
  className: cn("skippr:size-4 skippr:transition-opacity skippr:duration-200", isPausing && "skippr:opacity-40"),
4139
4251
  strokeWidth: 2.5
4140
4252
  }),
@@ -4144,7 +4256,7 @@ function SessionControlBar() {
4144
4256
  "aria-hidden": "true",
4145
4257
  className: "skippr:absolute skippr:inset-0 skippr:size-full skippr:animate-spin skippr:motion-reduce:hidden",
4146
4258
  children: [
4147
- /* @__PURE__ */ jsx5("circle", {
4259
+ /* @__PURE__ */ jsx6("circle", {
4148
4260
  cx: "12",
4149
4261
  cy: "12",
4150
4262
  r: "10.5",
@@ -4152,7 +4264,7 @@ function SessionControlBar() {
4152
4264
  strokeOpacity: "0.2",
4153
4265
  strokeWidth: "1.5"
4154
4266
  }),
4155
- /* @__PURE__ */ jsx5("circle", {
4267
+ /* @__PURE__ */ jsx6("circle", {
4156
4268
  cx: "12",
4157
4269
  cy: "12",
4158
4270
  r: "10.5",
@@ -4171,9 +4283,9 @@ function SessionControlBar() {
4171
4283
  }
4172
4284
 
4173
4285
  // src/components/ShadowHost.tsx
4174
- import { useLayoutEffect as useLayoutEffect2, useRef as useRef10, useState as useState12 } from "react";
4286
+ import { useLayoutEffect as useLayoutEffect2, useRef as useRef10, useState as useState13 } from "react";
4175
4287
  import { createPortal } from "react-dom";
4176
- import { jsx as jsx6, Fragment as Fragment2 } from "react/jsx-runtime";
4288
+ import { jsx as jsx7, Fragment as Fragment2 } from "react/jsx-runtime";
4177
4289
  var PROPERTIES_STYLE_ID = "skippr-tw-properties";
4178
4290
  var PROPERTY_RULE = /@property\s+[^{]+\{[^}]*\}/g;
4179
4291
  function hoistTailwindProperties(css) {
@@ -4189,9 +4301,9 @@ function hoistTailwindProperties(css) {
4189
4301
  }
4190
4302
  function ShadowHost({ children }) {
4191
4303
  const hostRef = useRef10(null);
4192
- const [shadowRoot, setShadowRoot] = useState12(null);
4304
+ const [shadowRoot, setShadowRoot] = useState13(null);
4193
4305
  const css = `/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
4194
- @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-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction: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-500:oklch(63.7% .237 25.331);--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-500:oklch(55.6% 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-0{top:calc(var(--skippr-spacing)*0)}.skippr\\:top-1\\/2{top:50%}.skippr\\:top-full{top:100%}.skippr\\:-right-8{right:calc(var(--skippr-spacing)*-8)}.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-7{right:calc(var(--skippr-spacing)*7)}.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-3{bottom:calc(var(--skippr-spacing)*3)}.skippr\\:bottom-20{bottom:calc(var(--skippr-spacing)*20)}.skippr\\:bottom-full{bottom:100%}.skippr\\:-left-8{left:calc(var(--skippr-spacing)*-8)}.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-7{left:calc(var(--skippr-spacing)*7)}.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-\\[27px\\]{margin-top:-27px}.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\\:mr-7{margin-right:calc(var(--skippr-spacing)*7)}.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\\:ml-1{margin-left:calc(var(--skippr-spacing)*1)}.skippr\\:ml-7{margin-left:calc(var(--skippr-spacing)*7)}.skippr\\:flex{display:flex}.skippr\\:hidden{display:none}.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{width:calc(var(--skippr-spacing)*3);height:calc(var(--skippr-spacing)*3)}.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-\\[38px\\]{width:38px;height:38px}.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-4{height:calc(var(--skippr-spacing)*4)}.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-\\[18\\.5px\\]{height:18.5px}.skippr\\:h-\\[38px\\]{height:38px}.skippr\\:h-\\[50px\\]{height:50px}.skippr\\:h-\\[54px\\]{height:54px}.skippr\\:h-full{height:100%}.skippr\\:min-h-0{min-height:calc(var(--skippr-spacing)*0)}.skippr\\:min-h-11{min-height:calc(var(--skippr-spacing)*11)}.skippr\\:w-0{width:calc(var(--skippr-spacing)*0)}.skippr\\:w-3\\.5{width:calc(var(--skippr-spacing)*3.5)}.skippr\\:w-4{width:calc(var(--skippr-spacing)*4)}.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-8{width:calc(var(--skippr-spacing)*8)}.skippr\\:w-10{width:calc(var(--skippr-spacing)*10)}.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\\:min-w-11{min-width:calc(var(--skippr-spacing)*11)}.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_280ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{animation:.28s cubic-bezier(.22,1,.36,1) skippr-toolset-pop}.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\\:justify-start{justify-content:flex-start}.skippr\\:gap-0\\.5{gap:calc(var(--skippr-spacing)*.5)}.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-\\[12px\\]{border-radius:12px}.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-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-red-500{background-color:var(--skippr-color-red-500)}.skippr\\:bg-secondary{background-color:#ffdfb5}.skippr\\:bg-transparent{background-color:#0000}.skippr\\:bg-white,.skippr\\:bg-white\\/15{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-white\\/15{background-color:color-mix(in oklab,var(--skippr-color-white)15%,transparent)}}.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-0\\.5{padding:calc(var(--skippr-spacing)*.5)}.skippr\\:p-1\\.5{padding:calc(var(--skippr-spacing)*1.5)}.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\\:pr-2\\.5{padding-right:calc(var(--skippr-spacing)*2.5)}.skippr\\:pr-3{padding-right:calc(var(--skippr-spacing)*3)}.skippr\\:pb-2{padding-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:pl-1\\.5{padding-left:calc(var(--skippr-spacing)*1.5)}.skippr\\:pl-2\\.5{padding-left:calc(var(--skippr-spacing)*2.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-500{color:var(--skippr-color-neutral-500)}.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\\:capitalize{text-transform:capitalize}.skippr\\:tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,)var(--tw-slashed-zero,)var(--tw-numeric-figure,)var(--tw-numeric-spacing,)var(--tw-numeric-fraction,)}.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\\(239\\,68\\,68\\,0\\.45\\)\\]{--tw-shadow:0 4px 14px var(--tw-shadow-color,#ef444473);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-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px 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-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px 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-white\\/30{--tw-ring-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-white\\/30{--tw-ring-color:color-mix(in oklab,var(--skippr-color-white)30%,transparent)}}.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\\,margin\\]{transition-property:width,margin;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\\:select-none{-webkit-user-select:none;user-select: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:hover{background-color:oklch(97% .001 106.424)}.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\\/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-red-600:hover{background-color:var(--skippr-color-red-600)}.skippr\\:hover\\:bg-secondary\\/80:hover{background-color:oklab(91.9963% .0175391 .0626889/.8)}.skippr\\:hover\\:bg-white\\/10:hover{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:hover\\:bg-white\\/10:hover{background-color:color-mix(in oklab,var(--skippr-color-white)10%,transparent)}}.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-brand:focus-visible{--tw-ring-color:#2bc0ae}.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-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{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}}`;
4306
+ @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-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction: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-500:oklch(63.7% .237 25.331);--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-neutral-100:oklch(97% 0 0);--skippr-color-neutral-200:oklch(92.2% 0 0);--skippr-color-neutral-500:oklch(55.6% 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-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-0{top:calc(var(--skippr-spacing)*0)}.skippr\\:top-1\\/2{top:50%}.skippr\\:top-full{top:100%}.skippr\\:-right-8{right:calc(var(--skippr-spacing)*-8)}.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\\:-bottom-1{bottom:calc(var(--skippr-spacing)*-1)}.skippr\\:-bottom-9{bottom:calc(var(--skippr-spacing)*-9)}.skippr\\:bottom-3{bottom:calc(var(--skippr-spacing)*3)}.skippr\\:bottom-20{bottom:calc(var(--skippr-spacing)*20)}.skippr\\:bottom-full{bottom:100%}.skippr\\:-left-8{left:calc(var(--skippr-spacing)*-8)}.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\\:z-10{z-index:10}.skippr\\:z-20{z-index:20}.skippr\\:z-\\[9998\\]{z-index:9998}.skippr\\:z-\\[9999\\]{z-index:9999}.skippr\\:order-first{order:-9999}.skippr\\:order-last{order:9999}.skippr\\:mx-auto{margin-inline:auto}.skippr\\:-mt-\\[5px\\]{margin-top:-5px}.skippr\\:-mt-\\[27px\\]{margin-top:-27px}.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-2{margin-top:calc(var(--skippr-spacing)*2)}.skippr\\:mt-3{margin-top:calc(var(--skippr-spacing)*3)}.skippr\\:mt-3\\.5{margin-top:calc(var(--skippr-spacing)*3.5)}.skippr\\:mr-7{margin-right:calc(var(--skippr-spacing)*7)}.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\\:ml-1{margin-left:calc(var(--skippr-spacing)*1)}.skippr\\:ml-7{margin-left:calc(var(--skippr-spacing)*7)}.skippr\\:flex{display:flex}.skippr\\:hidden{display:none}.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{width:calc(var(--skippr-spacing)*3);height:calc(var(--skippr-spacing)*3)}.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-\\[38px\\]{width:38px;height:38px}.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-4{height:calc(var(--skippr-spacing)*4)}.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-\\[18\\.5px\\]{height:18.5px}.skippr\\:h-\\[36px\\]{height:36px}.skippr\\:h-\\[38px\\]{height:38px}.skippr\\:h-\\[48px\\]{height:48px}.skippr\\:h-\\[54px\\]{height:54px}.skippr\\:h-full{height:100%}.skippr\\:min-h-0{min-height:calc(var(--skippr-spacing)*0)}.skippr\\:min-h-11{min-height:calc(var(--skippr-spacing)*11)}.skippr\\:w-0{width:calc(var(--skippr-spacing)*0)}.skippr\\:w-3\\.5{width:calc(var(--skippr-spacing)*3.5)}.skippr\\:w-4{width:calc(var(--skippr-spacing)*4)}.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-8{width:calc(var(--skippr-spacing)*8)}.skippr\\:w-10{width:calc(var(--skippr-spacing)*10)}.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-\\[36px\\]{width:36px}.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\\:min-w-11{min-width:calc(var(--skippr-spacing)*11)}.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-3{--tw-translate-x:calc(var(--skippr-spacing)*-3);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-3{--tw-translate-x:calc(var(--skippr-spacing)*3);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\\: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_280ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{animation:.28s cubic-bezier(.22,1,.36,1) skippr-toolset-pop}.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-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-not-allowed{cursor:not-allowed}.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\\:justify-start{justify-content:flex-start}.skippr\\:gap-0\\.5{gap:calc(var(--skippr-spacing)*.5)}.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-\\[11px\\]{border-radius:11px}.skippr\\:rounded-\\[12px\\]{border-radius:12px}.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-l-\\[18px\\]{border-top-left-radius:18px;border-bottom-left-radius:18px}.skippr\\:rounded-tl-md{border-top-left-radius:.5rem}.skippr\\:rounded-r-\\[18px\\]{border-top-right-radius:18px;border-bottom-right-radius:18px}.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-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-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-red-500{background-color:var(--skippr-color-red-500)}.skippr\\:bg-secondary{background-color:#ffdfb5}.skippr\\:bg-transparent{background-color:#0000}.skippr\\:bg-white,.skippr\\:bg-white\\/15{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-white\\/15{background-color:color-mix(in oklab,var(--skippr-color-white)15%,transparent)}}.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-0{padding:calc(var(--skippr-spacing)*0)}.skippr\\:p-0\\.5{padding:calc(var(--skippr-spacing)*.5)}.skippr\\:p-1\\.5{padding:calc(var(--skippr-spacing)*1.5)}.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\\:py-6{padding-block:calc(var(--skippr-spacing)*6)}.skippr\\:pt-1\\.5{padding-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:pr-2\\.5{padding-right:calc(var(--skippr-spacing)*2.5)}.skippr\\:pr-3{padding-right:calc(var(--skippr-spacing)*3)}.skippr\\:pb-2{padding-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:pl-1\\.5{padding-left:calc(var(--skippr-spacing)*1.5)}.skippr\\:pl-2\\.5{padding-left:calc(var(--skippr-spacing)*2.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-500{color:var(--skippr-color-neutral-500)}.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\\:capitalize{text-transform:capitalize}.skippr\\:tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,)var(--tw-slashed-zero,)var(--tw-numeric-figure,)var(--tw-numeric-spacing,)var(--tw-numeric-fraction,)}.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_8px_30px_rgba\\(15\\,18\\,26\\,0\\.32\\)\\]{--tw-shadow:-6px 8px 30px var(--tw-shadow-color,#0f121a52);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\\(239\\,68\\,68\\,0\\.45\\)\\]{--tw-shadow:0 4px 14px var(--tw-shadow-color,#ef444473);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-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px 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-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px 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-white\\/30{--tw-ring-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-white\\/30{--tw-ring-color:color-mix(in oklab,var(--skippr-color-white)30%,transparent)}}.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\\,margin\\]{transition-property:width,margin;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\\:duration-\\[400ms\\]{--tw-duration:.4s;transition-duration:.4s}.skippr\\:ease-\\[cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{--tw-ease:cubic-bezier(.22,1,.36,1);transition-timing-function:cubic-bezier(.22,1,.36,1)}.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\\:select-none{-webkit-user-select:none;user-select: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\\: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:hover{background-color:oklch(97% .001 106.424)}.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\\/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-red-600:hover{background-color:var(--skippr-color-red-600)}.skippr\\:hover\\:bg-secondary\\/80:hover{background-color:oklab(91.9963% .0175391 .0626889/.8)}.skippr\\:hover\\:bg-white\\/10:hover{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:hover\\:bg-white\\/10:hover{background-color:color-mix(in oklab,var(--skippr-color-white)10%,transparent)}}.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-brand:focus-visible{--tw-ring-color:#2bc0ae}.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\\:\\[\\&_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-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{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 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}}`;
4195
4307
  useLayoutEffect2(() => {
4196
4308
  const host = hostRef.current;
4197
4309
  if (!host || !css)
@@ -4206,17 +4318,17 @@ function ShadowHost({ children }) {
4206
4318
  setShadowRoot(root);
4207
4319
  }, [css]);
4208
4320
  if (!css)
4209
- return /* @__PURE__ */ jsx6(Fragment2, {
4321
+ return /* @__PURE__ */ jsx7(Fragment2, {
4210
4322
  children
4211
4323
  });
4212
- return /* @__PURE__ */ jsx6("div", {
4324
+ return /* @__PURE__ */ jsx7("div", {
4213
4325
  ref: hostRef,
4214
4326
  children: shadowRoot && createPortal(children, shadowRoot)
4215
4327
  });
4216
4328
  }
4217
4329
 
4218
4330
  // src/components/Sidebar.tsx
4219
- import { useContext as useContext10, useEffect as useEffect24 } from "react";
4331
+ import { useContext as useContext11, useEffect as useEffect25 } from "react";
4220
4332
 
4221
4333
  // src/hooks/useCombinedMessages.ts
4222
4334
  import { useContext as useContext7, useMemo as useMemo5 } from "react";
@@ -4304,8 +4416,31 @@ function useCombinedMessages() {
4304
4416
  return { allMessages, agentState, sendChatMessage, isSendingChat };
4305
4417
  }
4306
4418
 
4419
+ // src/hooks/usePhaseUpdates.ts
4420
+ import { useCallback as useCallback11, useContext as useContext8, useEffect as useEffect19 } from "react";
4421
+ function parsePhases(json) {
4422
+ try {
4423
+ const data = JSON.parse(json);
4424
+ if (data.type === "phase_update" && Array.isArray(data.phases)) {
4425
+ return data.phases;
4426
+ }
4427
+ } catch {}
4428
+ return null;
4429
+ }
4430
+ function usePhaseUpdates() {
4431
+ const parse = useCallback11(parsePhases, []);
4432
+ const livePhases = useAgentState("phases", parse, []);
4433
+ const ctx = useContext8(LiveAgentContext);
4434
+ useEffect19(() => {
4435
+ if (livePhases.length > 0)
4436
+ ctx?.setPhasesSnapshot(livePhases);
4437
+ }, [livePhases, ctx?.setPhasesSnapshot]);
4438
+ const phases = livePhases.length > 0 ? livePhases : ctx?.phasesSnapshot ?? [];
4439
+ return { phases };
4440
+ }
4441
+
4307
4442
  // src/hooks/useSessionRemaining.ts
4308
- import { useEffect as useEffect19, useRef as useRef11, useState as useState13 } from "react";
4443
+ import { useEffect as useEffect20, useRef as useRef11, useState as useState14 } from "react";
4309
4444
 
4310
4445
  // src/lib/format.ts
4311
4446
  function formatTime(seconds) {
@@ -4322,8 +4457,8 @@ function parseNumber(s) {
4322
4457
  function useSessionRemaining() {
4323
4458
  const maxCallDuration = useAgentState("maxCallDuration", parseNumber, null);
4324
4459
  const endTimeRef = useRef11(null);
4325
- const [remaining, setRemaining] = useState13(null);
4326
- useEffect19(() => {
4460
+ const [remaining, setRemaining] = useState14(null);
4461
+ useEffect20(() => {
4327
4462
  if (maxCallDuration === null || endTimeRef.current !== null)
4328
4463
  return;
4329
4464
  const endTime = Date.now() + maxCallDuration * 1000;
@@ -4340,13 +4475,13 @@ function useSessionRemaining() {
4340
4475
  }
4341
4476
 
4342
4477
  // src/components/ChatHeader.tsx
4343
- import { useContext as useContext9, useRef as useRef13 } from "react";
4478
+ import { useContext as useContext10, useRef as useRef13 } from "react";
4344
4479
 
4345
4480
  // src/hooks/useElapsedSeconds.ts
4346
- import { useEffect as useEffect20, useState as useState14 } from "react";
4481
+ import { useEffect as useEffect21, useState as useState15 } from "react";
4347
4482
  function useElapsedSeconds(isRunning) {
4348
- const [elapsed, setElapsed] = useState14(0);
4349
- useEffect20(() => {
4483
+ const [elapsed, setElapsed] = useState15(0);
4484
+ useEffect21(() => {
4350
4485
  if (!isRunning) {
4351
4486
  setElapsed(0);
4352
4487
  return;
@@ -4363,10 +4498,10 @@ function useElapsedSeconds(isRunning) {
4363
4498
 
4364
4499
  // src/hooks/useTextMode.ts
4365
4500
  import { useLocalParticipant as useLocalParticipant9 } from "@livekit/components-react/hooks";
4366
- import { useCallback as useCallback12, useContext as useContext8, useRef as useRef12 } from "react";
4501
+ import { useCallback as useCallback12, useContext as useContext9, useRef as useRef12 } from "react";
4367
4502
  var textEncoder5 = new TextEncoder;
4368
4503
  function useTextMode() {
4369
- const ctx = useContext8(LiveAgentContext);
4504
+ const ctx = useContext9(LiveAgentContext);
4370
4505
  if (!ctx) {
4371
4506
  throw new Error("useTextMode must be used within a <LiveAgent> provider");
4372
4507
  }
@@ -4395,9 +4530,9 @@ function useTextMode() {
4395
4530
  }
4396
4531
 
4397
4532
  // src/components/ChatHeader.tsx
4398
- import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
4533
+ import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
4399
4534
  function ChatHeader() {
4400
- const ctx = useContext9(LiveAgentContext);
4535
+ const ctx = useContext10(LiveAgentContext);
4401
4536
  if (!ctx) {
4402
4537
  throw new Error("ChatHeader must be used within a <LiveAgent> provider");
4403
4538
  }
@@ -4424,26 +4559,26 @@ function ChatHeader() {
4424
4559
  /* @__PURE__ */ jsxs7("div", {
4425
4560
  className: "skippr:flex skippr:items-center skippr:gap-3",
4426
4561
  children: [
4427
- isConnected && /* @__PURE__ */ jsx7(HeaderModeToggle, {}),
4562
+ isConnected && /* @__PURE__ */ jsx8(HeaderModeToggle, {}),
4428
4563
  isConnected && /* @__PURE__ */ jsxs7("div", {
4429
4564
  className: "skippr:flex skippr:items-center skippr:gap-1.5 skippr:rounded-full skippr:bg-primary-foreground/20 skippr:px-2.5 skippr:py-1",
4430
4565
  children: [
4431
4566
  /* @__PURE__ */ jsxs7("span", {
4432
4567
  className: "skippr:relative skippr:flex skippr:size-1.5",
4433
4568
  children: [
4434
- /* @__PURE__ */ jsx7("span", {
4569
+ /* @__PURE__ */ jsx8("span", {
4435
4570
  className: "skippr:absolute skippr:inline-flex skippr:h-full skippr:w-full skippr:animate-ping skippr:rounded-full skippr:bg-red-400 skippr:opacity-75"
4436
4571
  }),
4437
- /* @__PURE__ */ jsx7("span", {
4572
+ /* @__PURE__ */ jsx8("span", {
4438
4573
  className: "skippr:relative skippr:inline-flex skippr:size-1.5 skippr:rounded-full skippr:bg-red-400"
4439
4574
  })
4440
4575
  ]
4441
4576
  }),
4442
- /* @__PURE__ */ jsx7("span", {
4577
+ /* @__PURE__ */ jsx8("span", {
4443
4578
  className: "skippr:text-[10px] skippr:font-medium skippr:text-primary-foreground",
4444
4579
  children: "REC"
4445
4580
  }),
4446
- /* @__PURE__ */ jsx7("span", {
4581
+ /* @__PURE__ */ jsx8("span", {
4447
4582
  className: "skippr:text-[10px] skippr:font-mono skippr:text-primary-foreground",
4448
4583
  children: formatTime(elapsed)
4449
4584
  })
@@ -4451,7 +4586,7 @@ function ChatHeader() {
4451
4586
  })
4452
4587
  ]
4453
4588
  }),
4454
- minimizable && /* @__PURE__ */ jsx7("button", {
4589
+ minimizable && /* @__PURE__ */ jsx8("button", {
4455
4590
  type: "button",
4456
4591
  onClick: () => {
4457
4592
  if (!wasDraggedRef.current)
@@ -4460,7 +4595,7 @@ function ChatHeader() {
4460
4595
  "aria-label": "Close",
4461
4596
  title: "Close",
4462
4597
  className: "skippr:flex skippr:h-8 skippr:w-8 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-lg skippr:text-primary-foreground/70 skippr:transition-colors skippr:hover:bg-white/10 skippr:hover:text-primary-foreground skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand",
4463
- children: /* @__PURE__ */ jsx7(X, {
4598
+ children: /* @__PURE__ */ jsx8(X, {
4464
4599
  className: "skippr:h-4 skippr:w-4"
4465
4600
  })
4466
4601
  })
@@ -4469,28 +4604,32 @@ function ChatHeader() {
4469
4604
  }
4470
4605
  function HeaderModeToggle() {
4471
4606
  const { textMode, toggleTextMode } = useTextMode();
4607
+ const { isHeld } = useSessionHoldContext();
4472
4608
  return /* @__PURE__ */ jsxs7("fieldset", {
4473
4609
  "aria-label": "Response mode",
4474
- className: "skippr:flex skippr:items-center skippr:gap-0.5 skippr:rounded-lg skippr:bg-white/15 skippr:p-0.5 skippr:text-xs skippr:font-medium skippr:ring-1 skippr:ring-white/30",
4610
+ disabled: isHeld,
4611
+ className: "skippr:flex skippr:items-center skippr:gap-0.5 skippr:rounded-lg skippr:bg-white/15 skippr:p-0.5 skippr:text-xs skippr:font-medium skippr:ring-1 skippr:ring-white/30 skippr:disabled:opacity-50",
4475
4612
  children: [
4476
- /* @__PURE__ */ jsx7("button", {
4613
+ /* @__PURE__ */ jsx8("button", {
4477
4614
  type: "button",
4478
4615
  "aria-pressed": !textMode,
4616
+ disabled: isHeld,
4479
4617
  onClick: () => {
4480
4618
  if (textMode)
4481
4619
  toggleTextMode();
4482
4620
  },
4483
- className: cn("skippr:cursor-pointer skippr:rounded-md skippr:px-2.5 skippr:py-1 skippr:transition-colors skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand", textMode ? "skippr:font-semibold skippr:text-primary-foreground" : "skippr:bg-white skippr:text-primary skippr:shadow-sm"),
4621
+ className: cn("skippr:rounded-md skippr:px-2.5 skippr:py-1 skippr:transition-colors skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand skippr:disabled:cursor-not-allowed", isHeld ? "skippr:cursor-not-allowed" : "skippr:cursor-pointer", textMode ? "skippr:font-semibold skippr:text-primary-foreground" : "skippr:bg-white skippr:text-primary skippr:shadow-sm"),
4484
4622
  children: "Voice"
4485
4623
  }),
4486
- /* @__PURE__ */ jsx7("button", {
4624
+ /* @__PURE__ */ jsx8("button", {
4487
4625
  type: "button",
4488
4626
  "aria-pressed": textMode,
4627
+ disabled: isHeld,
4489
4628
  onClick: () => {
4490
4629
  if (!textMode)
4491
4630
  toggleTextMode();
4492
4631
  },
4493
- className: cn("skippr:cursor-pointer skippr:rounded-md skippr:px-2.5 skippr:py-1 skippr:transition-colors skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand", textMode ? "skippr:bg-white skippr:text-primary skippr:shadow-sm" : "skippr:font-semibold skippr:text-primary-foreground"),
4632
+ className: cn("skippr:rounded-md skippr:px-2.5 skippr:py-1 skippr:transition-colors skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand skippr:disabled:cursor-not-allowed", isHeld ? "skippr:cursor-not-allowed" : "skippr:cursor-pointer", textMode ? "skippr:bg-white skippr:text-primary skippr:shadow-sm" : "skippr:font-semibold skippr:text-primary-foreground"),
4494
4633
  children: "Text"
4495
4634
  })
4496
4635
  ]
@@ -4498,7 +4637,7 @@ function HeaderModeToggle() {
4498
4637
  }
4499
4638
 
4500
4639
  // src/components/LoadingDots.tsx
4501
- import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
4640
+ import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
4502
4641
  function LoadingDots({ label }) {
4503
4642
  return /* @__PURE__ */ jsxs8("div", {
4504
4643
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:py-4",
@@ -4506,18 +4645,18 @@ function LoadingDots({ label }) {
4506
4645
  /* @__PURE__ */ jsxs8("div", {
4507
4646
  className: "skippr:flex skippr:gap-1",
4508
4647
  children: [
4509
- /* @__PURE__ */ jsx8("span", {
4648
+ /* @__PURE__ */ jsx9("span", {
4510
4649
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:0ms]"
4511
4650
  }),
4512
- /* @__PURE__ */ jsx8("span", {
4651
+ /* @__PURE__ */ jsx9("span", {
4513
4652
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:150ms]"
4514
4653
  }),
4515
- /* @__PURE__ */ jsx8("span", {
4654
+ /* @__PURE__ */ jsx9("span", {
4516
4655
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:300ms]"
4517
4656
  })
4518
4657
  ]
4519
4658
  }),
4520
- /* @__PURE__ */ jsx8("p", {
4659
+ /* @__PURE__ */ jsx9("p", {
4521
4660
  className: "skippr:text-xs skippr:text-muted-foreground",
4522
4661
  children: label
4523
4662
  })
@@ -4526,11 +4665,11 @@ function LoadingDots({ label }) {
4526
4665
  }
4527
4666
 
4528
4667
  // src/components/LoginFlow.tsx
4529
- import { useCallback as useCallback13, useEffect as useEffect21, useRef as useRef14, useState as useState15 } from "react";
4668
+ import { useCallback as useCallback13, useEffect as useEffect22, useRef as useRef14, useState as useState16 } from "react";
4530
4669
 
4531
4670
  // src/components/ui/button.tsx
4532
4671
  import { forwardRef as forwardRef3 } from "react";
4533
- import { jsx as jsx9 } from "react/jsx-runtime";
4672
+ import { jsx as jsx10 } from "react/jsx-runtime";
4534
4673
  var variantClasses = {
4535
4674
  default: "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90",
4536
4675
  destructive: "skippr:bg-destructive skippr:text-white skippr:hover:bg-destructive/90",
@@ -4549,7 +4688,7 @@ var sizeClasses = {
4549
4688
  "icon-lg": "skippr:size-10"
4550
4689
  };
4551
4690
  var Button = forwardRef3(({ className, variant = "default", size = "default", ...props }, ref) => {
4552
- return /* @__PURE__ */ jsx9("button", {
4691
+ return /* @__PURE__ */ jsx10("button", {
4553
4692
  className: cn("skippr:inline-flex skippr:items-center skippr:justify-center skippr:gap-2 skippr:whitespace-nowrap skippr:rounded-md skippr:text-sm skippr:font-medium skippr:ring-offset-background skippr:transition-all skippr:cursor-pointer skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-ring skippr:focus-visible:ring-offset-2 skippr:disabled:pointer-events-none skippr:disabled:opacity-50 skippr:shrink-0 skippr:[&_svg]:pointer-events-none skippr:[&_svg:not([class*='size-'])]:size-4 skippr:[&_svg]:shrink-0", variantClasses[variant], sizeClasses[size], className),
4554
4693
  ref,
4555
4694
  ...props
@@ -4558,12 +4697,12 @@ var Button = forwardRef3(({ className, variant = "default", size = "default", ..
4558
4697
  Button.displayName = "Button";
4559
4698
 
4560
4699
  // src/components/LoginFlow.tsx
4561
- import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
4700
+ import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
4562
4701
  var OTP_LENGTH = 6;
4563
4702
  var DIGIT_KEYS = ["d0", "d1", "d2", "d3", "d4", "d5"];
4564
4703
  function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
4565
- const [step, setStep] = useState15("email");
4566
- const [email, setEmail] = useState15("");
4704
+ const [step, setStep] = useState16("email");
4705
+ const [email, setEmail] = useState16("");
4567
4706
  const handleRequestOtp = useCallback13(async (emailValue) => {
4568
4707
  const success = await requestOtp(emailValue);
4569
4708
  if (success)
@@ -4579,7 +4718,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
4579
4718
  await requestOtp(email);
4580
4719
  }, [requestOtp, email]);
4581
4720
  if (step === "otp") {
4582
- return /* @__PURE__ */ jsx10(OtpStep, {
4721
+ return /* @__PURE__ */ jsx11(OtpStep, {
4583
4722
  email,
4584
4723
  onSubmit: handleVerifyOtp,
4585
4724
  onResend: handleResend,
@@ -4588,7 +4727,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
4588
4727
  isSubmitting
4589
4728
  });
4590
4729
  }
4591
- return /* @__PURE__ */ jsx10(EmailStep, {
4730
+ return /* @__PURE__ */ jsx11(EmailStep, {
4592
4731
  email,
4593
4732
  onEmailChange: setEmail,
4594
4733
  onSubmit: handleRequestOtp,
@@ -4608,14 +4747,14 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
4608
4747
  /* @__PURE__ */ jsxs9("div", {
4609
4748
  className: "skippr:mb-4 skippr:text-center",
4610
4749
  children: [
4611
- /* @__PURE__ */ jsx10(Mail, {
4750
+ /* @__PURE__ */ jsx11(Mail, {
4612
4751
  className: "skippr:mx-auto skippr:mb-2 skippr:size-6 skippr:text-primary"
4613
4752
  }),
4614
- /* @__PURE__ */ jsx10("p", {
4753
+ /* @__PURE__ */ jsx11("p", {
4615
4754
  className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
4616
4755
  children: "Sign in to continue"
4617
4756
  }),
4618
- /* @__PURE__ */ jsx10("p", {
4757
+ /* @__PURE__ */ jsx11("p", {
4619
4758
  className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
4620
4759
  children: "Your email will be used to identify you across sessions"
4621
4760
  })
@@ -4625,7 +4764,7 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
4625
4764
  onSubmit: handleSubmit,
4626
4765
  className: "skippr:flex skippr:flex-col skippr:gap-3",
4627
4766
  children: [
4628
- /* @__PURE__ */ jsx10("input", {
4767
+ /* @__PURE__ */ jsx11("input", {
4629
4768
  type: "email",
4630
4769
  placeholder: "you@example.com",
4631
4770
  value: email,
@@ -4634,15 +4773,15 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
4634
4773
  required: true,
4635
4774
  className: "skippr:w-full skippr:rounded-md skippr:border skippr:border-border skippr:bg-background skippr:px-3 skippr:py-2 skippr:text-sm skippr:text-foreground skippr:placeholder-muted-foreground skippr:outline-none focus:skippr:ring-2 focus:skippr:ring-primary/30 focus:skippr:border-primary disabled:skippr:opacity-50"
4636
4775
  }),
4637
- /* @__PURE__ */ jsx10(Button, {
4776
+ /* @__PURE__ */ jsx11(Button, {
4638
4777
  type: "submit",
4639
4778
  disabled: isSubmitting || !email.trim(),
4640
4779
  className: "skippr:w-full",
4641
- children: isSubmitting ? /* @__PURE__ */ jsx10(LoaderCircle, {
4780
+ children: isSubmitting ? /* @__PURE__ */ jsx11(LoaderCircle, {
4642
4781
  className: "skippr:size-4 skippr:animate-spin"
4643
4782
  }) : "Continue"
4644
4783
  }),
4645
- error && /* @__PURE__ */ jsx10("p", {
4784
+ error && /* @__PURE__ */ jsx11("p", {
4646
4785
  className: "skippr:text-xs skippr:text-center skippr:text-destructive",
4647
4786
  children: error
4648
4787
  })
@@ -4652,18 +4791,18 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
4652
4791
  });
4653
4792
  }
4654
4793
  function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4655
- const [digits, setDigits] = useState15(Array(OTP_LENGTH).fill(""));
4656
- const [resendCooldown, setResendCooldown] = useState15(0);
4794
+ const [digits, setDigits] = useState16(Array(OTP_LENGTH).fill(""));
4795
+ const [resendCooldown, setResendCooldown] = useState16(0);
4657
4796
  const inputRefs = useRef14([]);
4658
4797
  const submittedRef = useRef14(false);
4659
- useEffect21(() => {
4798
+ useEffect22(() => {
4660
4799
  inputRefs.current[0]?.focus();
4661
4800
  }, []);
4662
- useEffect21(() => {
4801
+ useEffect22(() => {
4663
4802
  if (error)
4664
4803
  submittedRef.current = false;
4665
4804
  }, [error]);
4666
- useEffect21(() => {
4805
+ useEffect22(() => {
4667
4806
  if (resendCooldown <= 0)
4668
4807
  return;
4669
4808
  const timer = setTimeout(() => setResendCooldown((c) => c - 1), 1000);
@@ -4728,7 +4867,7 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4728
4867
  /* @__PURE__ */ jsxs9("div", {
4729
4868
  className: "skippr:mb-4 skippr:text-center",
4730
4869
  children: [
4731
- /* @__PURE__ */ jsx10("p", {
4870
+ /* @__PURE__ */ jsx11("p", {
4732
4871
  className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
4733
4872
  children: "Enter verification code"
4734
4873
  }),
@@ -4737,7 +4876,7 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4737
4876
  children: [
4738
4877
  "We sent a 6-digit code to",
4739
4878
  " ",
4740
- /* @__PURE__ */ jsx10("span", {
4879
+ /* @__PURE__ */ jsx11("span", {
4741
4880
  className: "skippr:font-medium skippr:text-foreground",
4742
4881
  children: email
4743
4882
  })
@@ -4749,9 +4888,9 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4749
4888
  onSubmit: handleSubmit,
4750
4889
  className: "skippr:flex skippr:flex-col skippr:gap-3",
4751
4890
  children: [
4752
- /* @__PURE__ */ jsx10("div", {
4891
+ /* @__PURE__ */ jsx11("div", {
4753
4892
  className: "skippr:flex skippr:justify-center skippr:gap-1.5",
4754
- children: digits.map((digit, index2) => /* @__PURE__ */ jsx10("input", {
4893
+ children: digits.map((digit, index2) => /* @__PURE__ */ jsx11("input", {
4755
4894
  ref: (el) => {
4756
4895
  inputRefs.current[index2] = el;
4757
4896
  },
@@ -4766,29 +4905,29 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4766
4905
  className: "skippr:h-10 skippr:w-10 skippr:rounded-md skippr:border skippr:border-border skippr:bg-background skippr:text-center skippr:text-sm skippr:font-semibold skippr:text-foreground skippr:outline-none focus:skippr:ring-2 focus:skippr:ring-primary/30 focus:skippr:border-primary disabled:skippr:opacity-50"
4767
4906
  }, DIGIT_KEYS[index2]))
4768
4907
  }),
4769
- error && /* @__PURE__ */ jsx10("p", {
4908
+ error && /* @__PURE__ */ jsx11("p", {
4770
4909
  className: "skippr:text-xs skippr:text-center skippr:text-destructive",
4771
4910
  children: error
4772
4911
  }),
4773
- /* @__PURE__ */ jsx10(Button, {
4912
+ /* @__PURE__ */ jsx11(Button, {
4774
4913
  type: "submit",
4775
4914
  disabled: isSubmitting || digits.join("").length !== OTP_LENGTH,
4776
4915
  className: "skippr:w-full",
4777
- children: isSubmitting ? /* @__PURE__ */ jsx10(LoaderCircle, {
4916
+ children: isSubmitting ? /* @__PURE__ */ jsx11(LoaderCircle, {
4778
4917
  className: "skippr:size-4 skippr:animate-spin"
4779
4918
  }) : "Verify"
4780
4919
  }),
4781
4920
  /* @__PURE__ */ jsxs9("div", {
4782
4921
  className: "skippr:flex skippr:items-center skippr:justify-between skippr:text-xs",
4783
4922
  children: [
4784
- /* @__PURE__ */ jsx10("button", {
4923
+ /* @__PURE__ */ jsx11("button", {
4785
4924
  type: "button",
4786
4925
  onClick: onBack,
4787
4926
  disabled: isSubmitting,
4788
4927
  className: "skippr:text-muted-foreground hover:skippr:text-foreground skippr:transition-colors disabled:skippr:opacity-50",
4789
4928
  children: "Change email"
4790
4929
  }),
4791
- /* @__PURE__ */ jsx10("button", {
4930
+ /* @__PURE__ */ jsx11("button", {
4792
4931
  type: "button",
4793
4932
  onClick: handleResend,
4794
4933
  disabled: isSubmitting || resendCooldown > 0,
@@ -4804,17 +4943,17 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4804
4943
  }
4805
4944
 
4806
4945
  // src/components/MessageList.tsx
4807
- import { useCallback as useCallback14, useLayoutEffect as useLayoutEffect3, useRef as useRef16, useState as useState17 } from "react";
4946
+ import { useCallback as useCallback14, useLayoutEffect as useLayoutEffect3, useRef as useRef16, useState as useState18 } from "react";
4808
4947
 
4809
4948
  // src/components/ChatInput.tsx
4810
- import { useEffect as useEffect22, useRef as useRef15, useState as useState16 } from "react";
4811
- import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
4949
+ import { useEffect as useEffect23, useRef as useRef15, useState as useState17 } from "react";
4950
+ import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
4812
4951
  var MAX_INPUT_HEIGHT = 60;
4813
4952
  function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
4814
- const [inputText, setInputText] = useState16("");
4953
+ const [inputText, setInputText] = useState17("");
4815
4954
  const textareaRef = useRef15(null);
4816
4955
  const canSend = inputText.trim().length > 0 && !isSendingChat;
4817
- useEffect22(() => {
4956
+ useEffect23(() => {
4818
4957
  if (autoFocus)
4819
4958
  textareaRef.current?.focus();
4820
4959
  }, [autoFocus]);
@@ -4845,13 +4984,13 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
4845
4984
  handleSubmit(e);
4846
4985
  }
4847
4986
  }
4848
- return /* @__PURE__ */ jsx11("form", {
4987
+ return /* @__PURE__ */ jsx12("form", {
4849
4988
  onSubmit: handleSubmit,
4850
4989
  className: "skippr:border-t skippr:border-border skippr:p-3",
4851
4990
  children: /* @__PURE__ */ jsxs10("div", {
4852
4991
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:rounded-xl skippr:bg-background skippr:ring-1 skippr:ring-foreground/10 skippr:px-3 skippr:py-2",
4853
4992
  children: [
4854
- /* @__PURE__ */ jsx11("textarea", {
4993
+ /* @__PURE__ */ jsx12("textarea", {
4855
4994
  ref: textareaRef,
4856
4995
  rows: 1,
4857
4996
  value: inputText,
@@ -4861,12 +5000,12 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
4861
5000
  className: "skippr:flex-1 skippr:resize-none skippr:overflow-y-auto skippr:bg-transparent skippr:text-sm skippr:leading-5 skippr:text-foreground skippr:placeholder:text-muted-foreground skippr:outline-none",
4862
5001
  style: { maxHeight: `${MAX_INPUT_HEIGHT}px` }
4863
5002
  }),
4864
- /* @__PURE__ */ jsx11("button", {
5003
+ /* @__PURE__ */ jsx12("button", {
4865
5004
  type: "submit",
4866
5005
  disabled: !canSend,
4867
5006
  "aria-label": "Send message",
4868
5007
  className: cn("skippr:flex skippr:size-8 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-lg skippr:transition-colors", canSend ? "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90" : "skippr:bg-muted-foreground/20 skippr:text-muted-foreground/60"),
4869
- children: /* @__PURE__ */ jsx11(Send, {
5008
+ children: /* @__PURE__ */ jsx12(Send, {
4870
5009
  className: "skippr:size-3.5"
4871
5010
  })
4872
5011
  })
@@ -4876,7 +5015,7 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
4876
5015
  }
4877
5016
 
4878
5017
  // src/components/ChatMessage.tsx
4879
- import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
5018
+ import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
4880
5019
  function formatTimestamp(ts) {
4881
5020
  return new Date(ts).toLocaleTimeString("en-US", {
4882
5021
  hour: "numeric",
@@ -4886,16 +5025,16 @@ function formatTimestamp(ts) {
4886
5025
  }
4887
5026
  function ChatMessage({ message }) {
4888
5027
  const isAgent = message.role === "assistant";
4889
- return /* @__PURE__ */ jsx12("div", {
5028
+ return /* @__PURE__ */ jsx13("div", {
4890
5029
  className: cn("skippr:flex skippr:gap-2", isAgent ? "skippr:items-start" : "skippr:justify-end"),
4891
5030
  children: /* @__PURE__ */ jsxs11("div", {
4892
5031
  className: cn("skippr:flex skippr:max-w-[80%] skippr:flex-col", isAgent ? "skippr:items-start" : "skippr:items-end"),
4893
5032
  children: [
4894
- /* @__PURE__ */ jsx12("div", {
5033
+ /* @__PURE__ */ jsx13("div", {
4895
5034
  className: cn("skippr:rounded-2xl skippr:px-4 skippr:py-2.5 skippr:text-sm skippr:leading-relaxed", isAgent ? "skippr:border skippr:border-border skippr:bg-card skippr:text-foreground" : "skippr:bg-primary skippr:text-primary-foreground"),
4896
5035
  children: message.content
4897
5036
  }),
4898
- message.timestamp && /* @__PURE__ */ jsx12("span", {
5037
+ message.timestamp && /* @__PURE__ */ jsx13("span", {
4899
5038
  className: "skippr:mt-1 skippr:px-1 skippr:text-[10px] skippr:text-muted-foreground/60",
4900
5039
  children: formatTimestamp(message.timestamp)
4901
5040
  })
@@ -4905,34 +5044,34 @@ function ChatMessage({ message }) {
4905
5044
  }
4906
5045
 
4907
5046
  // src/components/PlanCard.tsx
4908
- import { useEffect as useEffect23 } from "react";
4909
- import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
5047
+ import { useEffect as useEffect24 } from "react";
5048
+ import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
4910
5049
  var APPROVE_MESSAGE = "Yes, go ahead.";
4911
5050
  var CANCEL_MESSAGE = "No, cancel that.";
4912
5051
  var COMPLETED_CARD_VISIBLE_MS = 2500;
4913
5052
  function StepIcon({ status }) {
4914
5053
  if (status === "done") {
4915
- return /* @__PURE__ */ jsx13(CircleCheck, {
5054
+ return /* @__PURE__ */ jsx14(CircleCheck, {
4916
5055
  className: "skippr:size-4 skippr:text-chart-3"
4917
5056
  });
4918
5057
  }
4919
5058
  if (status === "failed") {
4920
- return /* @__PURE__ */ jsx13(CircleX, {
5059
+ return /* @__PURE__ */ jsx14(CircleX, {
4921
5060
  className: "skippr:size-4 skippr:text-destructive"
4922
5061
  });
4923
5062
  }
4924
5063
  if (status === "active") {
4925
- return /* @__PURE__ */ jsx13(Circle, {
5064
+ return /* @__PURE__ */ jsx14(Circle, {
4926
5065
  className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
4927
5066
  });
4928
5067
  }
4929
- return /* @__PURE__ */ jsx13(Circle, {
5068
+ return /* @__PURE__ */ jsx14(Circle, {
4930
5069
  className: "skippr:size-4 skippr:text-muted-foreground/30"
4931
5070
  });
4932
5071
  }
4933
5072
  function PlanCard({ plan, sendChatMessage, onDismiss }) {
4934
5073
  const awaitingApproval = plan.state === "proposed";
4935
- useEffect23(() => {
5074
+ useEffect24(() => {
4936
5075
  if (plan.state !== "completed")
4937
5076
  return;
4938
5077
  const timer = setTimeout(onDismiss, COMPLETED_CARD_VISIBLE_MS);
@@ -4941,19 +5080,19 @@ function PlanCard({ plan, sendChatMessage, onDismiss }) {
4941
5080
  return /* @__PURE__ */ jsxs12("div", {
4942
5081
  className: "skippr:rounded-2xl skippr:rounded-tl-md skippr:bg-card skippr:p-3.5 skippr:ring-2 skippr:ring-brand",
4943
5082
  children: [
4944
- /* @__PURE__ */ jsx13("p", {
5083
+ /* @__PURE__ */ jsx14("p", {
4945
5084
  className: "skippr:mb-3 skippr:text-sm skippr:font-semibold skippr:leading-snug skippr:text-foreground",
4946
5085
  children: "Plan"
4947
5086
  }),
4948
- /* @__PURE__ */ jsx13("div", {
5087
+ /* @__PURE__ */ jsx14("div", {
4949
5088
  className: "skippr:space-y-2",
4950
5089
  children: plan.steps.map((step) => /* @__PURE__ */ jsxs12("div", {
4951
5090
  className: "skippr:flex skippr:items-center skippr:gap-2",
4952
5091
  children: [
4953
- /* @__PURE__ */ jsx13(StepIcon, {
5092
+ /* @__PURE__ */ jsx14(StepIcon, {
4954
5093
  status: step.status
4955
5094
  }),
4956
- /* @__PURE__ */ jsx13("p", {
5095
+ /* @__PURE__ */ jsx14("p", {
4957
5096
  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"),
4958
5097
  children: step.label
4959
5098
  })
@@ -4963,12 +5102,12 @@ function PlanCard({ plan, sendChatMessage, onDismiss }) {
4963
5102
  awaitingApproval && /* @__PURE__ */ jsxs12("div", {
4964
5103
  className: "skippr:mt-3.5 skippr:flex skippr:gap-2",
4965
5104
  children: [
4966
- /* @__PURE__ */ jsx13(Button, {
5105
+ /* @__PURE__ */ jsx14(Button, {
4967
5106
  className: "skippr:flex-1 skippr:py-2",
4968
5107
  onClick: () => sendChatMessage(APPROVE_MESSAGE),
4969
5108
  children: "Approve"
4970
5109
  }),
4971
- /* @__PURE__ */ jsx13(Button, {
5110
+ /* @__PURE__ */ jsx14(Button, {
4972
5111
  variant: "outline",
4973
5112
  className: "skippr:flex-1 skippr:py-2",
4974
5113
  onClick: () => sendChatMessage(CANCEL_MESSAGE),
@@ -4981,26 +5120,26 @@ function PlanCard({ plan, sendChatMessage, onDismiss }) {
4981
5120
  }
4982
5121
 
4983
5122
  // src/components/TypingIndicator.tsx
4984
- import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
5123
+ import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
4985
5124
  function TypingIndicator() {
4986
- return /* @__PURE__ */ jsx14("div", {
5125
+ return /* @__PURE__ */ jsx15("div", {
4987
5126
  className: "skippr:flex skippr:items-start skippr:gap-2 skippr:animate-skippr-tab-fade",
4988
5127
  children: /* @__PURE__ */ jsxs13("div", {
4989
5128
  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",
4990
5129
  children: [
4991
- /* @__PURE__ */ jsx14("span", {
5130
+ /* @__PURE__ */ jsx15("span", {
4992
5131
  children: "Agent is analyzing your screen"
4993
5132
  }),
4994
5133
  /* @__PURE__ */ jsxs13("span", {
4995
5134
  className: "skippr:inline-flex skippr:items-center skippr:gap-[2px]",
4996
5135
  children: [
4997
- /* @__PURE__ */ jsx14("span", {
5136
+ /* @__PURE__ */ jsx15("span", {
4998
5137
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:0ms]"
4999
5138
  }),
5000
- /* @__PURE__ */ jsx14("span", {
5139
+ /* @__PURE__ */ jsx15("span", {
5001
5140
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:200ms]"
5002
5141
  }),
5003
- /* @__PURE__ */ jsx14("span", {
5142
+ /* @__PURE__ */ jsx15("span", {
5004
5143
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:400ms]"
5005
5144
  })
5006
5145
  ]
@@ -5011,7 +5150,7 @@ function TypingIndicator() {
5011
5150
  }
5012
5151
 
5013
5152
  // src/components/MessageList.tsx
5014
- import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
5153
+ import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
5015
5154
  var BOTTOM_THRESHOLD_PX = 32;
5016
5155
  function isPlanVisible(plan) {
5017
5156
  return !!plan && plan.steps.length > 0 && plan.state !== "abandoned";
@@ -5020,16 +5159,17 @@ function MessageList({
5020
5159
  messages,
5021
5160
  isStreaming,
5022
5161
  sendChatMessage,
5023
- isSendingChat,
5162
+ isSendingChat = false,
5024
5163
  plan,
5025
- autoFocus = false
5164
+ autoFocus = false,
5165
+ readOnly = false
5026
5166
  }) {
5027
5167
  const containerRef = useRef16(null);
5028
5168
  const isPinnedToBottom = useRef16(true);
5029
5169
  const lastSeenMessageId = useRef16(undefined);
5030
- const [showJumpToLatest, setShowJumpToLatest] = useState17(false);
5170
+ const [showJumpToLatest, setShowJumpToLatest] = useState18(false);
5031
5171
  const lastMessage = messages.length > 0 ? messages[messages.length - 1] : undefined;
5032
- const [dismissedPlanId, setDismissedPlanId] = useState17(null);
5172
+ const [dismissedPlanId, setDismissedPlanId] = useState18(null);
5033
5173
  const dismissPlan = useCallback14(() => {
5034
5174
  if (plan)
5035
5175
  setDismissedPlanId(plan.planId);
@@ -5077,35 +5217,38 @@ function MessageList({
5077
5217
  onScroll: handleScroll,
5078
5218
  className: "skippr:min-h-0 skippr:flex-1 skippr:space-y-4 skippr:overflow-y-auto skippr:p-4 skippr:[overflow-anchor:none]",
5079
5219
  children: [
5080
- messages.length === 0 && !showTyping && /* @__PURE__ */ jsx15(LoadingDots, {
5220
+ messages.length === 0 && !showTyping && (readOnly ? /* @__PURE__ */ jsx16("p", {
5221
+ className: "skippr:px-2 skippr:py-6 skippr:text-center skippr:text-sm skippr:text-muted-foreground",
5222
+ children: "No messages in this conversation yet."
5223
+ }) : /* @__PURE__ */ jsx16(LoadingDots, {
5081
5224
  label: "Waiting for conversation to begin..."
5082
- }),
5083
- messages.map((message) => /* @__PURE__ */ jsx15(ChatMessage, {
5225
+ })),
5226
+ messages.map((message) => /* @__PURE__ */ jsx16(ChatMessage, {
5084
5227
  message
5085
5228
  }, message.id)),
5086
- showTyping && /* @__PURE__ */ jsx15(TypingIndicator, {})
5229
+ showTyping && /* @__PURE__ */ jsx16(TypingIndicator, {})
5087
5230
  ]
5088
5231
  }),
5089
- showJumpToLatest && /* @__PURE__ */ jsx15("button", {
5232
+ showJumpToLatest && /* @__PURE__ */ jsx16("button", {
5090
5233
  type: "button",
5091
5234
  onClick: jumpToLatest,
5092
5235
  "aria-label": "Jump to latest message",
5093
5236
  className: "skippr:-translate-x-1/2 skippr:absolute skippr:bottom-3 skippr:left-1/2 skippr:flex skippr:min-h-11 skippr:min-w-11 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-full skippr:border skippr:border-border skippr:bg-background skippr:p-1.5 skippr:text-foreground skippr:shadow-md skippr:transition-colors skippr:hover:bg-muted",
5094
- children: /* @__PURE__ */ jsx15(ChevronDown, {
5237
+ children: /* @__PURE__ */ jsx16(ChevronDown, {
5095
5238
  className: "skippr:size-4"
5096
5239
  })
5097
5240
  })
5098
5241
  ]
5099
5242
  }),
5100
- isPlanVisible(plan) && plan.planId !== dismissedPlanId && /* @__PURE__ */ jsx15("div", {
5243
+ sendChatMessage && isPlanVisible(plan) && plan.planId !== dismissedPlanId && /* @__PURE__ */ jsx16("div", {
5101
5244
  className: "skippr:shrink-0 skippr:border-t skippr:border-border skippr:p-3",
5102
- children: /* @__PURE__ */ jsx15(PlanCard, {
5245
+ children: /* @__PURE__ */ jsx16(PlanCard, {
5103
5246
  plan,
5104
5247
  sendChatMessage,
5105
5248
  onDismiss: dismissPlan
5106
5249
  }, plan.planId)
5107
5250
  }),
5108
- /* @__PURE__ */ jsx15(ChatInput, {
5251
+ !readOnly && sendChatMessage && /* @__PURE__ */ jsx16(ChatInput, {
5109
5252
  sendChatMessage,
5110
5253
  isSendingChat,
5111
5254
  autoFocus
@@ -5115,19 +5258,19 @@ function MessageList({
5115
5258
  }
5116
5259
 
5117
5260
  // src/components/SessionAgenda.tsx
5118
- import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
5261
+ import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
5119
5262
  function SessionAgenda({ phases, hasStarted }) {
5120
5263
  if (phases.length === 0 || !hasStarted) {
5121
- return /* @__PURE__ */ jsx16("div", {
5264
+ return /* @__PURE__ */ jsx17("div", {
5122
5265
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
5123
- children: /* @__PURE__ */ jsx16(LoadingDots, {
5266
+ children: /* @__PURE__ */ jsx17(LoadingDots, {
5124
5267
  label: "Waiting for agenda to load..."
5125
5268
  })
5126
5269
  });
5127
5270
  }
5128
- return /* @__PURE__ */ jsx16("div", {
5271
+ return /* @__PURE__ */ jsx17("div", {
5129
5272
  className: "skippr:flex-1 skippr:overflow-y-auto skippr:px-4 skippr:py-4",
5130
- children: /* @__PURE__ */ jsx16("div", {
5273
+ children: /* @__PURE__ */ jsx17("div", {
5131
5274
  className: "skippr:space-y-1",
5132
5275
  children: phases.map((phase) => {
5133
5276
  const isActive = phase.status === "active";
@@ -5135,29 +5278,29 @@ function SessionAgenda({ phases, hasStarted }) {
5135
5278
  return /* @__PURE__ */ jsxs15("div", {
5136
5279
  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"),
5137
5280
  children: [
5138
- /* @__PURE__ */ jsx16("div", {
5281
+ /* @__PURE__ */ jsx17("div", {
5139
5282
  className: "skippr:mt-0.5",
5140
- children: isCompleted ? /* @__PURE__ */ jsx16(CircleCheck, {
5283
+ children: isCompleted ? /* @__PURE__ */ jsx17(CircleCheck, {
5141
5284
  className: "skippr:size-4 skippr:text-chart-3"
5142
- }) : isActive ? /* @__PURE__ */ jsx16(Circle, {
5285
+ }) : isActive ? /* @__PURE__ */ jsx17(Circle, {
5143
5286
  className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
5144
- }) : /* @__PURE__ */ jsx16(Circle, {
5287
+ }) : /* @__PURE__ */ jsx17(Circle, {
5145
5288
  className: "skippr:size-4 skippr:text-muted-foreground/30"
5146
5289
  })
5147
5290
  }),
5148
5291
  /* @__PURE__ */ jsxs15("div", {
5149
5292
  className: "skippr:min-w-0 skippr:flex-1",
5150
5293
  children: [
5151
- /* @__PURE__ */ jsx16("p", {
5294
+ /* @__PURE__ */ jsx17("p", {
5152
5295
  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"),
5153
5296
  children: phase.name
5154
5297
  }),
5155
- phase.highlights.length > 0 && /* @__PURE__ */ jsx16("ul", {
5298
+ phase.highlights.length > 0 && /* @__PURE__ */ jsx17("ul", {
5156
5299
  className: "skippr:mt-1 skippr:space-y-0.5",
5157
5300
  children: phase.highlights.map((text) => /* @__PURE__ */ jsxs15("li", {
5158
5301
  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"),
5159
5302
  children: [
5160
- /* @__PURE__ */ jsx16("span", {
5303
+ /* @__PURE__ */ jsx17("span", {
5161
5304
  className: "skippr:size-1 skippr:shrink-0 skippr:rounded-full skippr:bg-current"
5162
5305
  }),
5163
5306
  text
@@ -5174,61 +5317,20 @@ function SessionAgenda({ phases, hasStarted }) {
5174
5317
  }
5175
5318
 
5176
5319
  // src/components/SessionWarningBanner.tsx
5177
- import { jsx as jsx17 } from "react/jsx-runtime";
5320
+ import { jsx as jsx18 } from "react/jsx-runtime";
5178
5321
  var SESSION_WARNING_THRESHOLD_SECS = 60;
5179
5322
  function SessionWarningBanner({ remaining }) {
5180
5323
  if (remaining === null || remaining <= 0 || remaining > SESSION_WARNING_THRESHOLD_SECS)
5181
5324
  return null;
5182
- return /* @__PURE__ */ jsx17("div", {
5325
+ return /* @__PURE__ */ jsx18("div", {
5183
5326
  "data-testid": "session-warning-banner",
5184
5327
  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",
5185
5328
  children: "Session ending soon"
5186
5329
  });
5187
5330
  }
5188
5331
 
5189
- // src/components/StartSessionPrompt.tsx
5190
- import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
5191
- 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";
5192
- function StartSessionPrompt({
5193
- onStartSession,
5194
- agentId,
5195
- agentControls,
5196
- isStarting,
5197
- error,
5198
- label = "Talk to Skippr",
5199
- canResume = false,
5200
- onResume
5201
- }) {
5202
- return /* @__PURE__ */ jsxs16("div", {
5203
- className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:px-4",
5204
- children: [
5205
- canResume && onResume ? /* @__PURE__ */ jsx18("button", {
5206
- type: "button",
5207
- onClick: onResume,
5208
- disabled: isStarting,
5209
- className: PROMPT_BUTTON,
5210
- children: isStarting ? "Resuming..." : "Resume session"
5211
- }) : /* @__PURE__ */ jsx18("button", {
5212
- type: "button",
5213
- onClick: () => {
5214
- if (!agentId)
5215
- return;
5216
- onStartSession(agentControls ? { agentId, agentControls } : { agentId });
5217
- },
5218
- disabled: isStarting || !agentId,
5219
- className: PROMPT_BUTTON,
5220
- children: isStarting ? "Starting..." : label
5221
- }),
5222
- error && /* @__PURE__ */ jsx18("p", {
5223
- className: "skippr:text-xs skippr:text-destructive",
5224
- children: error
5225
- })
5226
- ]
5227
- });
5228
- }
5229
-
5230
5332
  // src/components/Sidebar.tsx
5231
- import { jsx as jsx19, jsxs as jsxs17, Fragment as Fragment3 } from "react/jsx-runtime";
5333
+ import { jsx as jsx19, jsxs as jsxs16, Fragment as Fragment3 } from "react/jsx-runtime";
5232
5334
  var PANEL_GAP_PX = 12;
5233
5335
  var PANEL_VIEWPORT_MARGIN_PX = 24;
5234
5336
  var PANEL_MAX_HEIGHT_PX = 460;
@@ -5245,9 +5347,6 @@ function Sidebar({
5245
5347
  isPausing,
5246
5348
  isPaused,
5247
5349
  error,
5248
- startSession,
5249
- resumeSession,
5250
- resumableSession,
5251
5350
  isPanelOpen,
5252
5351
  position,
5253
5352
  isAuthenticated,
@@ -5259,17 +5358,26 @@ function Sidebar({
5259
5358
  sidebarTab: activeTab,
5260
5359
  setSidebarTab: setActiveTab,
5261
5360
  autoFocusChat,
5262
- agentId,
5263
5361
  agentMode,
5264
- agentControls
5362
+ displayModules
5265
5363
  } = useLiveAgent();
5266
- const internalCtx = useContext10(LiveAgentContext);
5364
+ const internalCtx = useContext11(LiveAgentContext);
5365
+ const defaultAgentId = internalCtx?.defaultAgentId ?? null;
5366
+ const startDefaultSession = internalCtx?.startDefaultSession ?? (() => {});
5367
+ const talkDisabled = !(internalCtx?.hasResolvedModules ?? false);
5267
5368
  const usesHostAuth = internalCtx?.usesHostAuth ?? false;
5268
5369
  const authFailed = internalCtx?.authFailed ?? false;
5370
+ const idleHistory = internalCtx?.idleHistory ?? {
5371
+ messages: [],
5372
+ phases: [],
5373
+ isLoading: false
5374
+ };
5269
5375
  const launcherBottomPx = internalCtx?.launcherBottomPx ?? DEFAULT_LAUNCHER_BOTTOM_PX;
5270
5376
  const popsDown = internalCtx?.popsDown ?? false;
5271
5377
  const panelExpanded = internalCtx?.panelExpanded ?? false;
5272
- const showAgenda = agentMode !== AGENT_MODE.AlwaysOn;
5378
+ const defaultModule = displayModules.find((m) => m.id === defaultAgentId) ?? null;
5379
+ const displayedMode = agentMode ?? defaultModule?.mode ?? null;
5380
+ const showAgenda = displayedMode !== AGENT_MODE.AlwaysOn;
5273
5381
  const isFloating = variant === "floating";
5274
5382
  const isSidebar = variant === "sidebar";
5275
5383
  const inSession = isConnected || isStarting || isPausing;
@@ -5282,7 +5390,7 @@ function Sidebar({
5282
5390
  height: panelExpanded ? availableHeight : `min(${PANEL_MAX_HEIGHT_PX}px, ${availableHeight})`
5283
5391
  };
5284
5392
  }
5285
- useEffect24(() => {
5393
+ useEffect25(() => {
5286
5394
  if (!isSidebar)
5287
5395
  return;
5288
5396
  const prop = position === "right" ? "marginRight" : "marginLeft";
@@ -5296,7 +5404,7 @@ function Sidebar({
5296
5404
  document.body.style.transition = "";
5297
5405
  };
5298
5406
  }, [isSidebar, isPanelOpen, position]);
5299
- return /* @__PURE__ */ jsxs17("div", {
5407
+ return /* @__PURE__ */ jsxs16("div", {
5300
5408
  ref: internalCtx?.panelRef,
5301
5409
  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"),
5302
5410
  style: { width: isPanelOpen ? SIDEBAR_WIDTH : undefined, ...floatingStyle },
@@ -5307,19 +5415,17 @@ function Sidebar({
5307
5415
  isPaused,
5308
5416
  isPausing,
5309
5417
  isDisconnecting,
5310
- canResume: resumableSession !== null,
5311
- onStartSession: startSession,
5312
- onResume: resumeSession,
5313
5418
  isStarting,
5314
5419
  error,
5315
5420
  activeTab,
5316
5421
  onTabChange: setActiveTab,
5317
5422
  hideControls,
5318
- startSessionLabel,
5319
5423
  autoFocusChat,
5320
- agentId,
5321
- agentControls,
5322
- showAgenda
5424
+ showAgenda,
5425
+ idleHistory,
5426
+ onTalk: startDefaultSession,
5427
+ talkLabel: startSessionLabel,
5428
+ talkDisabled
5323
5429
  }) : usesHostAuth || isValidating ? /* @__PURE__ */ jsx19("div", {
5324
5430
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
5325
5431
  children: /* @__PURE__ */ jsx19(LoadingDots, {
@@ -5339,35 +5445,31 @@ function AuthenticatedContent({
5339
5445
  isPaused,
5340
5446
  isPausing,
5341
5447
  isDisconnecting,
5342
- canResume,
5343
- onStartSession,
5344
- onResume,
5345
5448
  isStarting,
5346
5449
  error,
5347
5450
  activeTab,
5348
5451
  onTabChange,
5349
5452
  hideControls,
5350
- startSessionLabel,
5351
5453
  autoFocusChat,
5352
- agentId,
5353
- agentControls,
5354
- showAgenda
5454
+ showAgenda,
5455
+ idleHistory,
5456
+ onTalk,
5457
+ talkLabel,
5458
+ talkDisabled
5355
5459
  }) {
5356
5460
  const inSession = isConnected || isStarting || isPaused || isPausing;
5357
5461
  const effectiveTab = showAgenda ? activeTab : "chat";
5358
5462
  let transitionLabel = null;
5359
5463
  if (isStarting && !isConnected) {
5360
5464
  transitionLabel = "Reconnecting...";
5361
- } else if (isPaused) {
5362
- transitionLabel = "Paused";
5363
5465
  }
5364
- return /* @__PURE__ */ jsxs17(Fragment3, {
5466
+ return /* @__PURE__ */ jsxs16(Fragment3, {
5365
5467
  children: [
5366
5468
  isConnected && /* @__PURE__ */ jsx19(ConnectedBanner, {}),
5367
- showAgenda && /* @__PURE__ */ jsxs17("div", {
5469
+ showAgenda && /* @__PURE__ */ jsxs16("div", {
5368
5470
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:border-b skippr:border-border skippr:px-3 skippr:py-1",
5369
5471
  children: [
5370
- /* @__PURE__ */ jsxs17("button", {
5472
+ /* @__PURE__ */ jsxs16("button", {
5371
5473
  type: "button",
5372
5474
  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"),
5373
5475
  onClick: () => onTabChange("chat"),
@@ -5381,7 +5483,7 @@ function AuthenticatedContent({
5381
5483
  })
5382
5484
  ]
5383
5485
  }),
5384
- /* @__PURE__ */ jsxs17("button", {
5486
+ /* @__PURE__ */ jsxs16("button", {
5385
5487
  type: "button",
5386
5488
  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"),
5387
5489
  onClick: () => onTabChange("agenda"),
@@ -5404,7 +5506,7 @@ function AuthenticatedContent({
5404
5506
  children: /* @__PURE__ */ jsx19(LoadingDots, {
5405
5507
  label: "Ending session..."
5406
5508
  })
5407
- }) : inSession ? /* @__PURE__ */ jsxs17(Fragment3, {
5509
+ }) : inSession ? /* @__PURE__ */ jsxs16(Fragment3, {
5408
5510
  children: [
5409
5511
  transitionLabel && /* @__PURE__ */ jsx19("div", {
5410
5512
  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",
@@ -5415,26 +5517,21 @@ function AuthenticatedContent({
5415
5517
  autoFocusChat
5416
5518
  })
5417
5519
  ]
5418
- }) : /* @__PURE__ */ jsx19("div", {
5419
- className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
5420
- children: /* @__PURE__ */ jsx19(StartSessionPrompt, {
5421
- onStartSession,
5422
- agentId,
5423
- agentControls,
5424
- isStarting,
5425
- error,
5426
- label: startSessionLabel,
5427
- canResume,
5428
- onResume
5429
- })
5430
- }, `${activeTab}-empty`)
5520
+ }) : /* @__PURE__ */ jsx19(IdleHistory, {
5521
+ activeTab: effectiveTab,
5522
+ history: idleHistory,
5523
+ onTalk,
5524
+ talkLabel,
5525
+ talkDisabled,
5526
+ error
5527
+ })
5431
5528
  }),
5432
5529
  !hideControls && /* @__PURE__ */ jsx19("div", {
5433
5530
  className: "skippr:shrink-0 skippr:border-t skippr:border-border",
5434
- children: /* @__PURE__ */ jsxs17("div", {
5531
+ children: /* @__PURE__ */ jsxs16("div", {
5435
5532
  className: "skippr:flex skippr:items-center skippr:justify-center skippr:gap-1 skippr:px-4 skippr:pt-1.5 skippr:pb-2 skippr:text-[10px] skippr:text-muted-foreground",
5436
5533
  children: [
5437
- /* @__PURE__ */ jsxs17("svg", {
5534
+ /* @__PURE__ */ jsxs16("svg", {
5438
5535
  viewBox: "21 21 109 109",
5439
5536
  className: "skippr:size-3",
5440
5537
  fill: "none",
@@ -5458,7 +5555,7 @@ function AuthenticatedContent({
5458
5555
  });
5459
5556
  }
5460
5557
  function AuthError() {
5461
- return /* @__PURE__ */ jsxs17("div", {
5558
+ return /* @__PURE__ */ jsxs16("div", {
5462
5559
  className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:px-6 skippr:py-4 skippr:text-center",
5463
5560
  children: [
5464
5561
  /* @__PURE__ */ jsx19(CircleAlert, {
@@ -5481,6 +5578,60 @@ function ConnectedBanner() {
5481
5578
  remaining
5482
5579
  });
5483
5580
  }
5581
+ function IdleHistory({
5582
+ activeTab,
5583
+ history: history2,
5584
+ onTalk,
5585
+ talkLabel,
5586
+ talkDisabled,
5587
+ error
5588
+ }) {
5589
+ if (history2.isLoading) {
5590
+ return /* @__PURE__ */ jsx19("div", {
5591
+ className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
5592
+ children: /* @__PURE__ */ jsx19(LoadingDots, {
5593
+ label: "Loading conversation..."
5594
+ })
5595
+ });
5596
+ }
5597
+ return /* @__PURE__ */ jsxs16("div", {
5598
+ className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
5599
+ children: [
5600
+ activeTab === "agenda" ? /* @__PURE__ */ jsx19("div", {
5601
+ className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto",
5602
+ children: /* @__PURE__ */ jsx19(SessionAgenda, {
5603
+ phases: history2.phases,
5604
+ hasStarted: history2.phases.length > 0
5605
+ })
5606
+ }) : /* @__PURE__ */ jsx19(MessageList, {
5607
+ messages: history2.messages,
5608
+ isStreaming: false,
5609
+ readOnly: true
5610
+ }),
5611
+ /* @__PURE__ */ jsxs16("div", {
5612
+ className: "skippr:shrink-0 skippr:border-t skippr:border-border skippr:p-3",
5613
+ children: [
5614
+ /* @__PURE__ */ jsxs16("button", {
5615
+ type: "button",
5616
+ onClick: onTalk,
5617
+ disabled: talkDisabled,
5618
+ className: "skippr:flex skippr:w-full skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:gap-2 skippr:rounded-xl skippr:bg-primary skippr:px-4 skippr:py-3 skippr:font-semibold skippr:text-[13px] skippr:text-primary-foreground skippr:transition-colors skippr:hover:bg-primary/90 skippr:disabled:cursor-not-allowed skippr:disabled:opacity-50",
5619
+ children: [
5620
+ /* @__PURE__ */ jsx19(Mic, {
5621
+ className: "skippr:size-4"
5622
+ }),
5623
+ talkLabel
5624
+ ]
5625
+ }),
5626
+ error && /* @__PURE__ */ jsx19("p", {
5627
+ className: "skippr:mt-2 skippr:text-center skippr:text-xs skippr:text-destructive",
5628
+ children: error
5629
+ })
5630
+ ]
5631
+ })
5632
+ ]
5633
+ }, `idle-${activeTab}`);
5634
+ }
5484
5635
  function ConnectedBody({
5485
5636
  activeTab,
5486
5637
  autoFocusChat
@@ -5488,7 +5639,8 @@ function ConnectedBody({
5488
5639
  const { allMessages, agentState, sendChatMessage, isSendingChat } = useCombinedMessages();
5489
5640
  const { phases } = usePhaseUpdates();
5490
5641
  const plan = usePlanUpdates();
5491
- const { agentControls } = useLiveAgent();
5642
+ const { agentControls, isPaused } = useLiveAgent();
5643
+ const { isHeld } = useSessionHoldContext();
5492
5644
  if (activeTab === "agenda") {
5493
5645
  return /* @__PURE__ */ jsx19("div", {
5494
5646
  className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto skippr:animate-skippr-tab-fade",
@@ -5506,18 +5658,19 @@ function ConnectedBody({
5506
5658
  sendChatMessage,
5507
5659
  isSendingChat,
5508
5660
  plan: agentControls?.actions ? plan : null,
5509
- autoFocus: autoFocusChat
5661
+ autoFocus: autoFocusChat,
5662
+ readOnly: isPaused || isHeld
5510
5663
  })
5511
5664
  }, "chat");
5512
5665
  }
5513
5666
 
5514
5667
  // src/components/SidebarTrigger.tsx
5515
- import { useContext as useContext11 } from "react";
5668
+ import { useContext as useContext12 } from "react";
5516
5669
 
5517
5670
  // src/components/Logo.tsx
5518
- import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
5671
+ import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
5519
5672
  function Logo({ className }) {
5520
- return /* @__PURE__ */ jsxs18("svg", {
5673
+ return /* @__PURE__ */ jsxs17("svg", {
5521
5674
  width: "1em",
5522
5675
  height: "1em",
5523
5676
  viewBox: "0 0 200 200",
@@ -5533,7 +5686,7 @@ function Logo({ className }) {
5533
5686
  rx: "40",
5534
5687
  fill: "#2D2D3F"
5535
5688
  }),
5536
- /* @__PURE__ */ jsxs18("g", {
5689
+ /* @__PURE__ */ jsxs17("g", {
5537
5690
  transform: "translate(100 100) scale(0.8) translate(-100 -100)",
5538
5691
  children: [
5539
5692
  /* @__PURE__ */ jsx20("path", {
@@ -5564,7 +5717,7 @@ function SidebarTrigger() {
5564
5717
  isStarting,
5565
5718
  isPausing
5566
5719
  } = useLiveAgent();
5567
- const internalCtx = useContext11(LiveAgentContext);
5720
+ const internalCtx = useContext12(LiveAgentContext);
5568
5721
  const launcherBottomPx = internalCtx?.launcherBottomPx ?? DEFAULT_LAUNCHER_BOTTOM_PX;
5569
5722
  const popsDown = internalCtx?.popsDown ?? false;
5570
5723
  if (isMinimized || isConnected || isStarting || isPausing)
@@ -5586,7 +5739,15 @@ function SidebarTrigger() {
5586
5739
  }
5587
5740
 
5588
5741
  // src/components/LiveAgent.tsx
5589
- import { jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
5742
+ import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
5743
+ function readSavedLauncherBottom() {
5744
+ try {
5745
+ const saved = Number.parseInt(localStorage.getItem("skippr_widget_bottom") ?? "", 10);
5746
+ return Number.isFinite(saved) && saved > 0 ? saved : null;
5747
+ } catch {
5748
+ return null;
5749
+ }
5750
+ }
5590
5751
  function AgentCursorMount({ animated }) {
5591
5752
  return /* @__PURE__ */ jsx22(AgentCursor, {
5592
5753
  target: useAgentCursor(),
@@ -5597,7 +5758,7 @@ function PlanPanelOpener() {
5597
5758
  const plan = usePlanUpdates();
5598
5759
  const { expandPanel } = useLiveAgent();
5599
5760
  const surfacedPlanIdRef = useRef17(null);
5600
- useEffect25(() => {
5761
+ useEffect26(() => {
5601
5762
  if (plan?.state !== "proposed" || surfacedPlanIdRef.current === plan.planId)
5602
5763
  return;
5603
5764
  surfacedPlanIdRef.current = plan.planId;
@@ -5613,6 +5774,7 @@ function LiveAgent(props) {
5613
5774
  getUserToken,
5614
5775
  userToken,
5615
5776
  position = "right",
5777
+ verticalAlign = "bottom",
5616
5778
  variant = "floating",
5617
5779
  minimizable = true,
5618
5780
  defaultOpen = false,
@@ -5636,7 +5798,7 @@ function LiveAgent(props) {
5636
5798
  const auth = useAuth({ appKey });
5637
5799
  const usesHostAuth = !!getUserToken || !!userToken || !!authTokenProp;
5638
5800
  const effectiveAuthToken = usesHostAuth ? authTokenProp : auth.authToken ?? undefined;
5639
- const [activeModule, setActiveModule] = useState18(null);
5801
+ const [activeModule, setActiveModule] = useState19(null);
5640
5802
  const minimizeOnSessionStart = useCallback15(() => {
5641
5803
  if (minimizable) {
5642
5804
  setIsMinimized(true);
@@ -5690,27 +5852,28 @@ function LiveAgent(props) {
5690
5852
  disconnect();
5691
5853
  }, [disconnect]);
5692
5854
  const isSessionLive = connection !== null || isStarting || isPausing || isDisconnecting;
5693
- const [isPanelOpen, setIsPanelOpen] = useState18(defaultOpen);
5694
- const [isMinimized, setIsMinimized] = useState18(minimizable && !defaultOpen);
5695
- const [sidebarTab, setSidebarTab] = useState18("agenda");
5696
- const [phasesSnapshot, setPhasesSnapshot] = useState18([]);
5697
- const [textMode, setTextMode] = useState18(false);
5698
- const [panelExpanded, setPanelExpanded] = useState18(false);
5855
+ const [isPanelOpen, setIsPanelOpen] = useState19(defaultOpen);
5856
+ const [isMinimized, setIsMinimized] = useState19(minimizable && !defaultOpen);
5857
+ const [sidebarTab, setSidebarTab] = useState19("agenda");
5858
+ const [phasesSnapshot, setPhasesSnapshot] = useState19([]);
5859
+ const [textMode, setTextMode] = useState19(false);
5860
+ const [panelExpanded, setPanelExpanded] = useState19(false);
5699
5861
  const togglePanelExpanded = useCallback15(() => setPanelExpanded((prev) => !prev), []);
5700
5862
  const panelRef = useRef17(null);
5701
5863
  const controlBarRef = useRef17(null);
5702
- const [isDragging, setIsDragging] = useState18(false);
5864
+ const [isDragging, setIsDragging] = useState19(false);
5703
5865
  const setTextModeState = useCallback15((enabled) => {
5704
5866
  setTextMode(enabled);
5705
5867
  }, []);
5706
5868
  const isConnected = connection !== null;
5707
5869
  const showControlBar = isConnected || isStarting || isPausing;
5708
- useEffect25(() => {
5870
+ useEffect26(() => {
5709
5871
  if (!isConnected)
5710
5872
  setTextModeState(false);
5711
5873
  }, [isConnected, setTextModeState]);
5712
5874
  const {
5713
5875
  modules: availableModules,
5876
+ defaultSelection,
5714
5877
  isLoading: isLoadingModules,
5715
5878
  hasResolved: hasResolvedModules,
5716
5879
  error: modulesError,
@@ -5718,15 +5881,15 @@ function LiveAgent(props) {
5718
5881
  } = useAvailableModules({
5719
5882
  enabled: !isSessionLive,
5720
5883
  bearerToken,
5721
- authedFetch
5884
+ authedFetch,
5885
+ agentId: hostAgentId ?? undefined
5722
5886
  });
5723
5887
  const { goals: adoptionGoals, attendGoal } = useAdoptionGoals({
5724
5888
  enabled: !isSessionLive,
5725
5889
  bearerToken,
5726
5890
  authedFetch
5727
5891
  });
5728
- const displayModules = useMemo6(() => hostAgentId ? availableModules.filter((m) => m.id === hostAgentId) : availableModules, [hostAgentId, availableModules]);
5729
- const operatingModule = activeModule ?? (hostAgentId ? displayModules[0] ?? null : null);
5892
+ const operatingModule = activeModule ?? (hostAgentId ? availableModules[0] ?? null : null);
5730
5893
  const agentId = operatingModule?.id ?? null;
5731
5894
  const agentControls = operatingModule?.controls ?? hostAgentControls;
5732
5895
  const agentMode = operatingModule?.mode ?? null;
@@ -5763,9 +5926,9 @@ function LiveAgent(props) {
5763
5926
  adoptionGoalId: goal.goalId
5764
5927
  });
5765
5928
  }, [attendGoal, availableModules, startSession]);
5766
- const [welcomeDismissed, setWelcomeDismissed] = useState18(false);
5929
+ const [welcomeDismissed, setWelcomeDismissed] = useState19(false);
5767
5930
  const dismissWelcome = useCallback15(() => setWelcomeDismissed(true), []);
5768
- const [currentPosition, setCurrentPosition] = useState18(() => {
5931
+ const [currentPosition, setCurrentPosition] = useState19(() => {
5769
5932
  try {
5770
5933
  const saved = localStorage.getItem("skippr_widget_position");
5771
5934
  if (saved === "left" || saved === "right")
@@ -5779,16 +5942,13 @@ function LiveAgent(props) {
5779
5942
  localStorage.setItem("skippr_widget_position", pos);
5780
5943
  } catch {}
5781
5944
  }, []);
5782
- const [launcherBottomPx, setLauncherBottomPxState] = useState18(() => {
5783
- try {
5784
- const saved = Number.parseInt(localStorage.getItem("skippr_widget_bottom") ?? "", 10);
5785
- if (Number.isFinite(saved) && saved > 0)
5786
- return clampLauncherBottom(saved);
5787
- } catch {}
5788
- return DEFAULT_LAUNCHER_BOTTOM_PX;
5789
- });
5790
- const [popsDown, setPopsDown] = useState18(() => launcherPopsDown(launcherBottomPx));
5945
+ const savedLauncherBottom = readSavedLauncherBottom();
5946
+ const hasDraggedRef = useRef17(savedLauncherBottom !== null);
5947
+ const verticalAlignRef = useRef17(verticalAlign);
5948
+ const [launcherBottomPx, setLauncherBottomPxState] = useState19(() => savedLauncherBottom !== null ? clampLauncherBottom(savedLauncherBottom) : verticalAlignToBottomPx(verticalAlign));
5949
+ const [popsDown, setPopsDown] = useState19(() => launcherPopsDown(launcherBottomPx));
5791
5950
  const setLauncherBottomPx = useCallback15((px) => {
5951
+ hasDraggedRef.current = true;
5792
5952
  setLauncherBottomPxState(px);
5793
5953
  setPopsDown(launcherPopsDown(px));
5794
5954
  try {
@@ -5801,11 +5961,11 @@ function LiveAgent(props) {
5801
5961
  setPositionWithPersist(side);
5802
5962
  setLauncherBottomPx(bottomPx);
5803
5963
  }, [setPositionWithPersist, setLauncherBottomPx]);
5804
- useEffect25(() => {
5964
+ useEffect26(() => {
5805
5965
  const syncToViewport = () => {
5806
- const clamped = clampLauncherBottom(launcherBottomPxRef.current);
5807
- setLauncherBottomPxState(clamped);
5808
- setPopsDown(launcherPopsDown(clamped));
5966
+ const next = hasDraggedRef.current ? clampLauncherBottom(launcherBottomPxRef.current) : verticalAlignToBottomPx(verticalAlignRef.current);
5967
+ setLauncherBottomPxState(next);
5968
+ setPopsDown(launcherPopsDown(next));
5809
5969
  };
5810
5970
  syncToViewport();
5811
5971
  window.addEventListener("resize", syncToViewport);
@@ -5829,6 +5989,32 @@ function LiveAgent(props) {
5829
5989
  minimizePanel();
5830
5990
  }, [pauseSession, minimizePanel]);
5831
5991
  const isAuthenticated = bearerToken !== null || auth.isAuthenticated;
5992
+ const defaultAgentId = hostAgentId ?? defaultSelection.agentId;
5993
+ const startDefaultSession = useCallback15(() => {
5994
+ const target = availableModules.find((m) => m.id === defaultAgentId);
5995
+ if (!target)
5996
+ return;
5997
+ startSession({
5998
+ agentId: target.id,
5999
+ agentControls: target.controls,
6000
+ existingSessionId: defaultSelection.sessionId ?? undefined
6001
+ });
6002
+ }, [defaultAgentId, availableModules, defaultSelection.sessionId, startSession]);
6003
+ const idleHistoryEnabled = !isSessionLive && !isPaused && isPanelOpen && isAuthenticated;
6004
+ const {
6005
+ messages: idleHistoryMessages,
6006
+ phases: idleHistoryPhases,
6007
+ isLoading: isLoadingHistory
6008
+ } = useSessionHistory({
6009
+ agentId: defaultAgentId ?? undefined,
6010
+ enabled: idleHistoryEnabled,
6011
+ authedFetch
6012
+ });
6013
+ const idleHistory = useMemo6(() => ({
6014
+ messages: idleHistoryMessages,
6015
+ phases: idleHistoryPhases,
6016
+ isLoading: isLoadingHistory
6017
+ }), [idleHistoryMessages, idleHistoryPhases, isLoadingHistory]);
5832
6018
  const ctx = useMemo6(() => ({
5833
6019
  connection,
5834
6020
  shouldConnect,
@@ -5846,6 +6032,7 @@ function LiveAgent(props) {
5846
6032
  pauseTimeoutSeconds,
5847
6033
  resumableSession,
5848
6034
  historyMessages,
6035
+ idleHistory,
5849
6036
  phasesSnapshot,
5850
6037
  setPhasesSnapshot,
5851
6038
  isPanelOpen,
@@ -5887,8 +6074,10 @@ function LiveAgent(props) {
5887
6074
  agentId,
5888
6075
  agentMode,
5889
6076
  agentControls,
5890
- displayModules,
6077
+ displayModules: availableModules,
5891
6078
  activeModule,
6079
+ defaultAgentId,
6080
+ startDefaultSession,
5892
6081
  isLoadingModules,
5893
6082
  modulesError,
5894
6083
  refetchModules,
@@ -5913,6 +6102,7 @@ function LiveAgent(props) {
5913
6102
  pauseTimeoutSeconds,
5914
6103
  resumableSession,
5915
6104
  historyMessages,
6105
+ idleHistory,
5916
6106
  phasesSnapshot,
5917
6107
  isPanelOpen,
5918
6108
  openPanel,
@@ -5949,8 +6139,10 @@ function LiveAgent(props) {
5949
6139
  agentId,
5950
6140
  agentMode,
5951
6141
  agentControls,
5952
- displayModules,
6142
+ availableModules,
5953
6143
  activeModule,
6144
+ defaultAgentId,
6145
+ startDefaultSession,
5954
6146
  isLoadingModules,
5955
6147
  modulesError,
5956
6148
  refetchModules,
@@ -5961,7 +6153,7 @@ function LiveAgent(props) {
5961
6153
  ]);
5962
6154
  return /* @__PURE__ */ jsx22(LiveAgentContext.Provider, {
5963
6155
  value: ctx,
5964
- children: /* @__PURE__ */ jsxs19(LiveKitRoom, {
6156
+ children: /* @__PURE__ */ jsxs18(LiveKitRoom, {
5965
6157
  serverUrl: connection?.livekitUrl,
5966
6158
  token: connection?.token,
5967
6159
  connect: shouldConnect,
@@ -5973,7 +6165,7 @@ function LiveAgent(props) {
5973
6165
  pendingScreenStream
5974
6166
  }),
5975
6167
  connection && captureMode === CAPTURE_MODE.Auto && /* @__PURE__ */ jsx22(DomCapture, {}),
5976
- /* @__PURE__ */ jsxs19(ShadowHost, {
6168
+ /* @__PURE__ */ jsxs18(ShadowHost, {
5977
6169
  children: [
5978
6170
  connection && captureMode === CAPTURE_MODE.Auto && agentControls?.highlight && /* @__PURE__ */ jsx22(HighlightOverlay, {}),
5979
6171
  connection && captureMode === CAPTURE_MODE.Auto && agentControls?.actions && /* @__PURE__ */ jsx22(PageActionHandler, {}),
@@ -5981,22 +6173,24 @@ function LiveAgent(props) {
5981
6173
  connection && captureMode === CAPTURE_MODE.Auto && (agentControls?.highlight || agentControls?.actions) && /* @__PURE__ */ jsx22(AgentCursorMount, {
5982
6174
  animated: shouldAnimateCursor
5983
6175
  }),
5984
- /* @__PURE__ */ jsxs19("div", {
5985
- id: WIDGET_ROOT_ID,
5986
- children: [
5987
- isMinimized && !showControlBar && /* @__PURE__ */ jsx22(MinimizedBubble, {
5988
- welcomeMessage,
5989
- welcomeDismissed,
5990
- onDismissWelcome: dismissWelcome
5991
- }),
5992
- showControlBar && !hideControls && /* @__PURE__ */ jsx22(SessionControlBar, {}),
5993
- /* @__PURE__ */ jsx22(SidebarTrigger, {}),
5994
- /* @__PURE__ */ jsx22(Sidebar, {
5995
- hideControls,
5996
- hideHeader,
5997
- startSessionLabel
5998
- })
5999
- ]
6176
+ /* @__PURE__ */ jsx22(SessionHoldProvider, {
6177
+ children: /* @__PURE__ */ jsxs18("div", {
6178
+ id: WIDGET_ROOT_ID,
6179
+ children: [
6180
+ isMinimized && !showControlBar && /* @__PURE__ */ jsx22(MinimizedBubble, {
6181
+ welcomeMessage,
6182
+ welcomeDismissed,
6183
+ onDismissWelcome: dismissWelcome
6184
+ }),
6185
+ showControlBar && !hideControls && /* @__PURE__ */ jsx22(SessionControlBar, {}),
6186
+ /* @__PURE__ */ jsx22(SidebarTrigger, {}),
6187
+ /* @__PURE__ */ jsx22(Sidebar, {
6188
+ hideControls,
6189
+ hideHeader,
6190
+ startSessionLabel
6191
+ })
6192
+ ]
6193
+ })
6000
6194
  })
6001
6195
  ]
6002
6196
  }),