@skippr/live-agent-sdk 0.45.0 → 0.47.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,14 +8,35 @@ 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 useCallback10, useMemo as useMemo5, useRef as useRef13, useState as useState15 } from "react";
11
+ import { useCallback as useCallback11, useEffect as useEffect20, useMemo as useMemo6, useRef as useRef15, useState as useState16 } from "react";
12
12
 
13
13
  // src/context/LiveAgentContext.tsx
14
14
  import { createContext } from "react";
15
15
  var LiveAgentContext = createContext(null);
16
16
 
17
17
  // src/hooks/useAdoptionGoals.ts
18
- import { useCallback, useEffect, useState } from "react";
18
+ import { useCallback, useEffect, useMemo, useState } from "react";
19
+
20
+ // src/lib/hashMatch.ts
21
+ function globToRegExp(pattern) {
22
+ const escaped = pattern.replace(/[.*+?^${}()|[\]\\]/g, "\\$&").replace(/\\\*\\\*/g, ".*").replace(/\\\*/g, "[^/]*");
23
+ return new RegExp(`^${escaped}$`);
24
+ }
25
+ function normalizeHash(rawHash) {
26
+ return rawHash.replace(/^#/, "").toLowerCase();
27
+ }
28
+ function matchesHash(rawHash, matchType, hashPattern) {
29
+ const hash = normalizeHash(rawHash);
30
+ const pattern = hashPattern.toLowerCase();
31
+ switch (matchType) {
32
+ case "exact" /* Exact */:
33
+ return hash === pattern;
34
+ case "prefix" /* Prefix */:
35
+ return hash.startsWith(pattern);
36
+ case "glob" /* Glob */:
37
+ return globToRegExp(pattern).test(hash);
38
+ }
39
+ }
19
40
 
20
41
  // src/lib/navigation.ts
21
42
  var listeners = new Set;
@@ -62,7 +83,8 @@ function useAdoptionGoals({
62
83
  bearerToken,
63
84
  authedFetch
64
85
  }) {
65
- const [goals, setGoals] = useState([]);
86
+ const [candidates, setCandidates] = useState([]);
87
+ const [hash, setHash] = useState(window.location.hash);
66
88
  const match = useCallback(async () => {
67
89
  try {
68
90
  const resp = await authedFetch(`${API_URL}/v1/adoption/goals/match`, {
@@ -71,28 +93,30 @@ function useAdoptionGoals({
71
93
  body: JSON.stringify({ url: window.location.origin + window.location.pathname })
72
94
  });
73
95
  if (!resp.ok) {
74
- setGoals([]);
96
+ setCandidates([]);
75
97
  return;
76
98
  }
77
99
  const data = await resp.json();
78
- setGoals(Array.isArray(data?.goals) ? data.goals : []);
100
+ setCandidates(Array.isArray(data?.goals) ? data.goals : []);
79
101
  } catch (e) {
80
102
  console.warn("[Skippr] adoption match failed", e);
81
- setGoals([]);
103
+ setCandidates([]);
82
104
  }
83
105
  }, [authedFetch]);
84
106
  useEffect(() => {
85
107
  if (!enabled || !bearerToken) {
86
- setGoals([]);
108
+ setCandidates([]);
87
109
  return;
88
110
  }
89
111
  match();
90
112
  let lastPath = window.location.pathname;
91
113
  let timer;
92
114
  const unsubscribe = subscribeToLocationChange(() => {
115
+ setHash(window.location.hash);
93
116
  if (window.location.pathname === lastPath)
94
117
  return;
95
118
  lastPath = window.location.pathname;
119
+ setCandidates([]);
96
120
  if (timer)
97
121
  clearTimeout(timer);
98
122
  timer = setTimeout(() => {
@@ -105,6 +129,12 @@ function useAdoptionGoals({
105
129
  unsubscribe();
106
130
  };
107
131
  }, [enabled, bearerToken, match]);
132
+ const goals = useMemo(() => {
133
+ const hashSpecific = candidates.filter((goal) => goal.hashPattern !== null && matchesHash(hash, goal.matchType, goal.hashPattern));
134
+ if (hashSpecific.length > 0)
135
+ return hashSpecific;
136
+ return candidates.filter((goal) => goal.hashPattern === null);
137
+ }, [candidates, hash]);
108
138
  const postStatus = useCallback((goalId, status) => {
109
139
  authedFetch(`${API_URL}/v1/adoption/goals/${goalId}/status`, {
110
140
  method: "POST",
@@ -112,14 +142,10 @@ function useAdoptionGoals({
112
142
  body: JSON.stringify({ status })
113
143
  }).catch((e) => console.warn("[Skippr] adoption status update failed", e));
114
144
  }, [authedFetch]);
115
- const dismissGoal = useCallback((goalId) => {
116
- setGoals((prev) => prev.filter((goal) => goal.goalId !== goalId));
117
- postStatus(goalId, "dismissed" /* Dismissed */);
118
- }, [postStatus]);
119
145
  const attendGoal = useCallback((goalId) => {
120
146
  postStatus(goalId, "attended" /* Attended */);
121
147
  }, [postStatus]);
122
- return { goals, dismissGoal, attendGoal };
148
+ return { goals, attendGoal };
123
149
  }
124
150
 
125
151
  // src/hooks/useAuth.ts
@@ -285,9 +311,11 @@ function useAvailableModules({
285
311
  }) {
286
312
  const [modules, setModules] = useState3([]);
287
313
  const [isLoading, setIsLoading] = useState3(false);
314
+ const [hasResolved, setHasResolved] = useState3(false);
288
315
  const [error, setError] = useState3(null);
289
316
  const fetchModules = useCallback3(async () => {
290
317
  setIsLoading(true);
318
+ setHasResolved(false);
291
319
  setError(null);
292
320
  try {
293
321
  const resp = await authedFetch(`${API_URL3}/v1/modules/available`);
@@ -301,6 +329,7 @@ function useAvailableModules({
301
329
  setError(e instanceof Error ? e.message : "Failed to load modules");
302
330
  } finally {
303
331
  setIsLoading(false);
332
+ setHasResolved(true);
304
333
  }
305
334
  }, [authedFetch]);
306
335
  useEffect3(() => {
@@ -311,6 +340,7 @@ function useAvailableModules({
311
340
  return {
312
341
  modules,
313
342
  isLoading,
343
+ hasResolved,
314
344
  error,
315
345
  refetch: fetchModules
316
346
  };
@@ -649,13 +679,6 @@ function useSession({
649
679
  };
650
680
  }
651
681
 
652
- // src/lib/agentMode.ts
653
- var AGENT_MODE = {
654
- Standard: "standard",
655
- AlwaysOn: "always_on"
656
- };
657
- var AGENT_MODES = Object.values(AGENT_MODE);
658
-
659
682
  // src/lib/constants.ts
660
683
  var SIDEBAR_WIDTH = 360;
661
684
  var WIDGET_ROOT_ID = "skippr-sdk-root";
@@ -665,8 +688,16 @@ var DOM_SNAPSHOT_TOPIC = "skippr.dom-snapshot";
665
688
  var DOM_EVENTS_TOPIC = "skippr.dom-events";
666
689
  var HIGHLIGHT_TOPIC = "skippr.highlight";
667
690
  var PAGE_ACTIONS_TOPIC = "skippr.page-actions";
691
+ var TEXT_MODE_TOPIC = "skippr.text-mode";
668
692
  var NAME_MAX_CHARS = 80;
669
693
 
694
+ // src/lib/agentMode.ts
695
+ var AGENT_MODE = {
696
+ Standard: "standard",
697
+ AlwaysOn: "always_on"
698
+ };
699
+ var AGENT_MODES = Object.values(AGENT_MODE);
700
+
670
701
  // src/lib/sessionStatus.ts
671
702
  var SESSION_STATUS = {
672
703
  pending: "pending",
@@ -1673,7 +1704,7 @@ var hasA11yProp = (props) => {
1673
1704
  };
1674
1705
 
1675
1706
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/context.js
1676
- import { createContext as createContext2, useContext, useMemo, createElement } from "react";
1707
+ import { createContext as createContext2, useContext, useMemo as useMemo2, createElement } from "react";
1677
1708
  var LucideContext = createContext2({});
1678
1709
  var useLucideContext = () => useContext(LucideContext);
1679
1710
 
@@ -1745,16 +1776,12 @@ var __iconNode4 = [
1745
1776
  ["circle", { cx: "4", cy: "20", r: "2", key: "6kqj1y" }]
1746
1777
  ];
1747
1778
  var Sparkles = createLucideIcon("sparkles", __iconNode4);
1748
- // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/bot.js
1779
+ // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/arrow-right.js
1749
1780
  var __iconNode5 = [
1750
- ["path", { d: "M12 8V4H8", key: "hb8ula" }],
1751
- ["rect", { width: "16", height: "12", x: "4", y: "8", rx: "2", key: "enze0r" }],
1752
- ["path", { d: "M2 14h2", key: "vft8re" }],
1753
- ["path", { d: "M20 14h2", key: "4cs60a" }],
1754
- ["path", { d: "M15 13v2", key: "1xurst" }],
1755
- ["path", { d: "M9 13v2", key: "rq6x2g" }]
1781
+ ["path", { d: "M5 12h14", key: "1ays0h" }],
1782
+ ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
1756
1783
  ];
1757
- var Bot = createLucideIcon("bot", __iconNode5);
1784
+ var ArrowRight = createLucideIcon("arrow-right", __iconNode5);
1758
1785
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/calendar.js
1759
1786
  var __iconNode6 = [
1760
1787
  ["path", { d: "M8 2v4", key: "1cmpym" }],
@@ -1769,45 +1796,27 @@ var ChevronDown = createLucideIcon("chevron-down", __iconNode7);
1769
1796
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/circle.js
1770
1797
  var __iconNode8 = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
1771
1798
  var Circle = createLucideIcon("circle", __iconNode8);
1772
- // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/clock.js
1799
+ // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/lightbulb.js
1773
1800
  var __iconNode9 = [
1774
- ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
1775
- ["path", { d: "M12 6v6l4 2", key: "mmk7yg" }]
1776
- ];
1777
- var Clock = createLucideIcon("clock", __iconNode9);
1778
- // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/graduation-cap.js
1779
- var __iconNode10 = [
1780
- [
1781
- "path",
1782
- {
1783
- d: "M21.42 10.922a1 1 0 0 0-.019-1.838L12.83 5.18a2 2 0 0 0-1.66 0L2.6 9.08a1 1 0 0 0 0 1.832l8.57 3.908a2 2 0 0 0 1.66 0z",
1784
- key: "j76jl0"
1785
- }
1786
- ],
1787
- ["path", { d: "M22 10v6", key: "1lu8f3" }],
1788
- ["path", { d: "M6 12.5V16a6 3 0 0 0 12 0v-3.5", key: "1r8lef" }]
1789
- ];
1790
- var GraduationCap = createLucideIcon("graduation-cap", __iconNode10);
1791
- // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/headset.js
1792
- var __iconNode11 = [
1793
1801
  [
1794
1802
  "path",
1795
1803
  {
1796
- d: "M3 11h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-5Zm0 0a9 9 0 1 1 18 0m0 0v5a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3Z",
1797
- key: "12oyoe"
1804
+ d: "M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5",
1805
+ key: "1gvzjb"
1798
1806
  }
1799
1807
  ],
1800
- ["path", { d: "M21 16v2a4 4 0 0 1-4 4h-5", key: "1x7m43" }]
1808
+ ["path", { d: "M9 18h6", key: "x1upvd" }],
1809
+ ["path", { d: "M10 22h4", key: "ceow96" }]
1801
1810
  ];
1802
- var Headset = createLucideIcon("headset", __iconNode11);
1811
+ var Lightbulb = createLucideIcon("lightbulb", __iconNode9);
1803
1812
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mail.js
1804
- var __iconNode12 = [
1813
+ var __iconNode10 = [
1805
1814
  ["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
1806
1815
  ["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
1807
1816
  ];
1808
- var Mail = createLucideIcon("mail", __iconNode12);
1817
+ var Mail = createLucideIcon("mail", __iconNode10);
1809
1818
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-circle.js
1810
- var __iconNode13 = [
1819
+ var __iconNode11 = [
1811
1820
  [
1812
1821
  "path",
1813
1822
  {
@@ -1816,9 +1825,9 @@ var __iconNode13 = [
1816
1825
  }
1817
1826
  ]
1818
1827
  ];
1819
- var MessageCircle = createLucideIcon("message-circle", __iconNode13);
1828
+ var MessageCircle = createLucideIcon("message-circle", __iconNode11);
1820
1829
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-square.js
1821
- var __iconNode14 = [
1830
+ var __iconNode12 = [
1822
1831
  [
1823
1832
  "path",
1824
1833
  {
@@ -1827,9 +1836,9 @@ var __iconNode14 = [
1827
1836
  }
1828
1837
  ]
1829
1838
  ];
1830
- var MessageSquare = createLucideIcon("message-square", __iconNode14);
1839
+ var MessageSquare = createLucideIcon("message-square", __iconNode12);
1831
1840
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic-off.js
1832
- var __iconNode15 = [
1841
+ var __iconNode13 = [
1833
1842
  ["path", { d: "M12 19v3", key: "npa21l" }],
1834
1843
  ["path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33", key: "1gzdoj" }],
1835
1844
  ["path", { d: "M16.95 16.95A7 7 0 0 1 5 12v-2", key: "cqa7eg" }],
@@ -1837,40 +1846,40 @@ var __iconNode15 = [
1837
1846
  ["path", { d: "m2 2 20 20", key: "1ooewy" }],
1838
1847
  ["path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12", key: "r2i35w" }]
1839
1848
  ];
1840
- var MicOff = createLucideIcon("mic-off", __iconNode15);
1849
+ var MicOff = createLucideIcon("mic-off", __iconNode13);
1841
1850
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic.js
1842
- var __iconNode16 = [
1851
+ var __iconNode14 = [
1843
1852
  ["path", { d: "M12 19v3", key: "npa21l" }],
1844
1853
  ["path", { d: "M19 10v2a7 7 0 0 1-14 0v-2", key: "1vc78b" }],
1845
1854
  ["rect", { x: "9", y: "2", width: "6", height: "13", rx: "3", key: "s6n7sd" }]
1846
1855
  ];
1847
- var Mic = createLucideIcon("mic", __iconNode16);
1856
+ var Mic = createLucideIcon("mic", __iconNode14);
1848
1857
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/minimize-2.js
1849
- var __iconNode17 = [
1858
+ var __iconNode15 = [
1850
1859
  ["path", { d: "m14 10 7-7", key: "oa77jy" }],
1851
1860
  ["path", { d: "M20 10h-6V4", key: "mjg0md" }],
1852
1861
  ["path", { d: "m3 21 7-7", key: "tjx5ai" }],
1853
1862
  ["path", { d: "M4 14h6v6", key: "rmj7iw" }]
1854
1863
  ];
1855
- var Minimize2 = createLucideIcon("minimize-2", __iconNode17);
1864
+ var Minimize2 = createLucideIcon("minimize-2", __iconNode15);
1856
1865
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor-off.js
1857
- var __iconNode18 = [
1866
+ var __iconNode16 = [
1858
1867
  ["path", { d: "M12 17v4", key: "1riwvh" }],
1859
1868
  ["path", { d: "M17 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 1.184-1.826", key: "cv7jms" }],
1860
1869
  ["path", { d: "m2 2 20 20", key: "1ooewy" }],
1861
1870
  ["path", { d: "M8 21h8", key: "1ev6f3" }],
1862
1871
  ["path", { d: "M8.656 3H20a2 2 0 0 1 2 2v10a2 2 0 0 1-.293 1.042", key: "z8ni2w" }]
1863
1872
  ];
1864
- var MonitorOff = createLucideIcon("monitor-off", __iconNode18);
1873
+ var MonitorOff = createLucideIcon("monitor-off", __iconNode16);
1865
1874
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor.js
1866
- var __iconNode19 = [
1875
+ var __iconNode17 = [
1867
1876
  ["rect", { width: "20", height: "14", x: "2", y: "3", rx: "2", key: "48i651" }],
1868
1877
  ["line", { x1: "8", x2: "16", y1: "21", y2: "21", key: "1svkeh" }],
1869
1878
  ["line", { x1: "12", x2: "12", y1: "17", y2: "21", key: "vw1qmm" }]
1870
1879
  ];
1871
- var Monitor = createLucideIcon("monitor", __iconNode19);
1880
+ var Monitor = createLucideIcon("monitor", __iconNode17);
1872
1881
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mouse-pointer-2.js
1873
- var __iconNode20 = [
1882
+ var __iconNode18 = [
1874
1883
  [
1875
1884
  "path",
1876
1885
  {
@@ -1879,65 +1888,9 @@ var __iconNode20 = [
1879
1888
  }
1880
1889
  ]
1881
1890
  ];
1882
- var MousePointer2 = createLucideIcon("mouse-pointer-2", __iconNode20);
1883
- // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/pause.js
1884
- var __iconNode21 = [
1885
- ["rect", { x: "14", y: "3", width: "5", height: "18", rx: "1", key: "kaeet6" }],
1886
- ["rect", { x: "5", y: "3", width: "5", height: "18", rx: "1", key: "1wsw3u" }]
1887
- ];
1888
- var Pause = createLucideIcon("pause", __iconNode21);
1889
- // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/phone-off.js
1890
- var __iconNode22 = [
1891
- [
1892
- "path",
1893
- {
1894
- d: "M10.1 13.9a14 14 0 0 0 3.732 2.668 1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2 18 18 0 0 1-12.728-5.272",
1895
- key: "1wngk7"
1896
- }
1897
- ],
1898
- ["path", { d: "M22 2 2 22", key: "y4kqgn" }],
1899
- [
1900
- "path",
1901
- {
1902
- d: "M4.76 13.582A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 .244.473",
1903
- key: "10hv5p"
1904
- }
1905
- ]
1906
- ];
1907
- var PhoneOff = createLucideIcon("phone-off", __iconNode22);
1908
- // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/play.js
1909
- var __iconNode23 = [
1910
- [
1911
- "path",
1912
- {
1913
- d: "M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z",
1914
- key: "10ikf1"
1915
- }
1916
- ]
1917
- ];
1918
- var Play = createLucideIcon("play", __iconNode23);
1919
- // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/rocket.js
1920
- var __iconNode24 = [
1921
- ["path", { d: "M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5", key: "qeys4" }],
1922
- [
1923
- "path",
1924
- {
1925
- d: "M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09",
1926
- key: "u4xsad"
1927
- }
1928
- ],
1929
- [
1930
- "path",
1931
- {
1932
- d: "M9 12a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.4 22.4 0 0 1-4 2z",
1933
- key: "676m9"
1934
- }
1935
- ],
1936
- ["path", { d: "M9 12H4s.55-3.03 2-4c1.62-1.08 5 .05 5 .05", key: "92ym6u" }]
1937
- ];
1938
- var Rocket = createLucideIcon("rocket", __iconNode24);
1891
+ var MousePointer2 = createLucideIcon("mouse-pointer-2", __iconNode18);
1939
1892
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/send.js
1940
- var __iconNode25 = [
1893
+ var __iconNode19 = [
1941
1894
  [
1942
1895
  "path",
1943
1896
  {
@@ -1947,21 +1900,13 @@ var __iconNode25 = [
1947
1900
  ],
1948
1901
  ["path", { d: "m21.854 2.147-10.94 10.939", key: "12cjpa" }]
1949
1902
  ];
1950
- var Send = createLucideIcon("send", __iconNode25);
1951
- // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/user-plus.js
1952
- var __iconNode26 = [
1953
- ["path", { d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2", key: "1yyitq" }],
1954
- ["circle", { cx: "9", cy: "7", r: "4", key: "nufk8" }],
1955
- ["line", { x1: "19", x2: "19", y1: "8", y2: "14", key: "1bvyxn" }],
1956
- ["line", { x1: "22", x2: "16", y1: "11", y2: "11", key: "1shjgl" }]
1957
- ];
1958
- var UserPlus = createLucideIcon("user-plus", __iconNode26);
1903
+ var Send = createLucideIcon("send", __iconNode19);
1959
1904
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/x.js
1960
- var __iconNode27 = [
1905
+ var __iconNode20 = [
1961
1906
  ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
1962
1907
  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
1963
1908
  ];
1964
- var X = createLucideIcon("x", __iconNode27);
1909
+ var X = createLucideIcon("x", __iconNode20);
1965
1910
  // src/components/HighlightOverlay.tsx
1966
1911
  import { useCallback as useCallback5, useEffect as useEffect7, useRef as useRef4, useState as useState5 } from "react";
1967
1912
 
@@ -2198,60 +2143,7 @@ function HighlightOverlay() {
2198
2143
  }
2199
2144
 
2200
2145
  // src/components/MinimizedBubble.tsx
2201
- import { useContext as useContext3, useEffect as useEffect8 } from "react";
2202
-
2203
- // src/hooks/useLiveAgent.ts
2204
- import { useContext as useContext2 } from "react";
2205
- function useLiveAgent() {
2206
- const ctx = useContext2(LiveAgentContext);
2207
- if (!ctx) {
2208
- throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
2209
- }
2210
- const {
2211
- usesHostAuth,
2212
- authFailed,
2213
- connection,
2214
- shouldConnect,
2215
- historyMessages,
2216
- phasesSnapshot,
2217
- setPhasesSnapshot,
2218
- adoptionGoals,
2219
- dismissAdoptionGoal,
2220
- startAdoptionSession,
2221
- ...publicValue
2222
- } = ctx;
2223
- return publicValue;
2224
- }
2225
-
2226
- // src/hooks/useMediaControls.ts
2227
- import { useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
2228
- import { ScreenSharePresets as ScreenSharePresets2 } from "livekit-client";
2229
- import { useCallback as useCallback6 } from "react";
2230
- var SCREEN_SHARE_OPTIONS = {
2231
- video: { displaySurface: "browser" },
2232
- resolution: ScreenSharePresets2.h720fps30.resolution,
2233
- contentHint: "detail"
2234
- };
2235
- function useMediaControls() {
2236
- const { localParticipant } = useLocalParticipant3();
2237
- const isMuted = !localParticipant.isMicrophoneEnabled;
2238
- const isScreenSharing = localParticipant.isScreenShareEnabled;
2239
- const toggleMute = useCallback6(async () => {
2240
- try {
2241
- await localParticipant.setMicrophoneEnabled(isMuted);
2242
- } catch (error) {
2243
- console.error("Failed to toggle microphone:", error);
2244
- }
2245
- }, [localParticipant, isMuted]);
2246
- const toggleScreenShare = useCallback6(async () => {
2247
- try {
2248
- await localParticipant.setScreenShareEnabled(!isScreenSharing, SCREEN_SHARE_OPTIONS);
2249
- } catch (error) {
2250
- console.error("Failed to toggle screen share:", error);
2251
- }
2252
- }, [localParticipant, isScreenSharing]);
2253
- return { isMuted, toggleMute, isScreenSharing, toggleScreenShare };
2254
- }
2146
+ import { useContext as useContext2, useEffect as useEffect8, useRef as useRef5, useState as useState6 } from "react";
2255
2147
 
2256
2148
  // src/lib/utils.ts
2257
2149
  import { clsx } from "clsx";
@@ -2262,369 +2154,147 @@ function cn(...inputs) {
2262
2154
 
2263
2155
  // src/components/AdoptionBubble.tsx
2264
2156
  import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
2265
- function AdoptionBubble({ goal, onAttend, onDismiss }) {
2266
- return /* @__PURE__ */ jsxs2("div", {
2267
- className: cn("skippr:flex skippr:max-w-72 skippr:items-center skippr:gap-1.5", "skippr:rounded-full skippr:bg-bubble/95 skippr:backdrop-blur-sm", "skippr:py-1.5 skippr:pr-1.5 skippr:pl-3.5", "skippr:text-xs skippr:font-medium skippr:text-white", "skippr:shadow-[0_8px_24px_rgba(45,43,61,0.35)]", "skippr:animate-[skippr-bubble-in_0.28s_ease-out]"),
2268
- children: [
2269
- /* @__PURE__ */ jsx2("button", {
2270
- type: "button",
2271
- onClick: () => onAttend(goal),
2272
- className: "skippr:min-w-0 skippr:flex-1 skippr:cursor-pointer skippr:truncate skippr:rounded-full skippr:text-left skippr:transition-opacity skippr:hover:opacity-90 skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-inset skippr:focus-visible:ring-white/70",
2273
- children: goal.displayMessage
2274
- }),
2275
- /* @__PURE__ */ jsx2("button", {
2276
- type: "button",
2277
- onClick: () => onDismiss(goal.goalId),
2278
- "aria-label": "Dismiss suggestion",
2279
- className: cn("skippr:flex skippr:size-5 skippr:shrink-0 skippr:items-center skippr:justify-center", "skippr:rounded-full skippr:text-white/70 skippr:cursor-pointer", "skippr:transition-colors skippr:hover:bg-white/15 skippr:hover:text-white", "skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-white/70"),
2280
- children: /* @__PURE__ */ jsx2(X, {
2281
- className: "skippr:size-3.5"
2282
- })
2283
- })
2284
- ]
2285
- });
2286
- }
2287
-
2288
- // src/hooks/useAgentVoiceState.ts
2289
- import { useVoiceAssistant } from "@livekit/components-react/hooks";
2290
- function useAgentVoiceState() {
2291
- const { state } = useVoiceAssistant();
2292
- return {
2293
- state,
2294
- isSpeaking: state === "speaking",
2295
- isListening: state === "listening"
2296
- };
2297
- }
2298
-
2299
- // src/components/LauncherStatusPill.tsx
2300
- import { jsx as jsx3, jsxs as jsxs3, Fragment } from "react/jsx-runtime";
2301
- function pillStatusFromAgent(state, canSeePage) {
2302
- if (state === "speaking")
2303
- return "talking";
2304
- if (state === "thinking")
2305
- return "thinking";
2306
- return canSeePage ? "observing" : "connected";
2307
- }
2308
- function LauncherStatusPill() {
2309
- const { isConnected, isStarting, isPaused, expandPanel, setSidebarTab, position, captureMode } = useLiveAgent();
2310
- const { state } = useAgentVoiceState();
2311
- const { isScreenSharing } = useMediaControls();
2312
- const isStandingBy = isStarting && !isConnected;
2313
- if (!isConnected && !isStandingBy && !isPaused)
2314
- return null;
2315
- const canSeePage = captureMode === "auto" || isScreenSharing;
2316
- let status;
2317
- if (isPaused) {
2318
- status = "paused";
2319
- } else if (isStandingBy) {
2320
- status = "standing-by";
2321
- } else {
2322
- status = pillStatusFromAgent(state, canSeePage);
2323
- }
2324
- let ariaLabel;
2325
- if (isStandingBy) {
2326
- ariaLabel = "Skippr is standing by — click to open";
2327
- } else if (isPaused) {
2328
- ariaLabel = "Session paused — click to open";
2329
- } else {
2330
- ariaLabel = `Skippr is ${status} — click to open chat`;
2331
- }
2332
- const handleClick = () => {
2333
- if (!isStandingBy)
2334
- setSidebarTab("chat");
2335
- expandPanel();
2336
- };
2337
- return /* @__PURE__ */ jsx3("button", {
2338
- type: "button",
2339
- onClick: handleClick,
2340
- className: cn("skippr:fixed skippr:bottom-20 skippr:z-[9999]", "skippr:flex skippr:items-center skippr:gap-2", "skippr:rounded-full skippr:bg-bubble/95 skippr:backdrop-blur-sm", "skippr:px-3 skippr:py-1.5", "skippr:text-xs skippr:font-medium skippr:text-white", "skippr:shadow-[0_8px_24px_rgba(45,43,61,0.35)]", "skippr:cursor-pointer skippr:transition-colors skippr:hover:bg-bubble", "skippr:animate-[skippr-bubble-in_0.28s_ease-out]", position === "right" ? "skippr:right-6" : "skippr:left-6"),
2341
- "aria-label": ariaLabel,
2342
- children: /* @__PURE__ */ jsxs3("span", {
2343
- className: "skippr:flex skippr:items-center skippr:gap-2 skippr:animate-[skippr-pill-content_0.22s_ease-out]",
2157
+ function AdoptionBubble({
2158
+ goal,
2159
+ onAttend,
2160
+ appearDelayMs = 0,
2161
+ exitDelayMs = 0,
2162
+ hidden = false
2163
+ }) {
2164
+ return /* @__PURE__ */ jsx2("div", {
2165
+ style: {
2166
+ animationDelay: `${appearDelayMs}ms`,
2167
+ transitionDelay: hidden ? `${exitDelayMs}ms` : "0ms"
2168
+ },
2169
+ className: cn("skippr:group skippr:relative", "skippr:transition-opacity skippr:duration-300", "skippr:[animation:skippr-tip-in_360ms_cubic-bezier(0.34,1.3,0.64,1)_backwards]", hidden && "skippr:opacity-0 skippr:pointer-events-none"),
2170
+ children: /* @__PURE__ */ jsxs2("button", {
2171
+ type: "button",
2172
+ onClick: () => onAttend(goal),
2173
+ 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"),
2344
2174
  children: [
2345
- status === "standing-by" && /* @__PURE__ */ jsxs3(Fragment, {
2346
- children: [
2347
- /* @__PURE__ */ jsx3("span", {
2348
- children: "Standing by"
2349
- }),
2350
- /* @__PURE__ */ jsx3(ThinkingDots, {})
2351
- ]
2352
- }),
2353
- status === "observing" && /* @__PURE__ */ jsxs3(Fragment, {
2354
- children: [
2355
- /* @__PURE__ */ jsx3(ObservingIcon, {}),
2356
- /* @__PURE__ */ jsx3("span", {
2357
- children: "Skippr is observing"
2358
- })
2359
- ]
2360
- }),
2361
- status === "connected" && /* @__PURE__ */ jsxs3(Fragment, {
2362
- children: [
2363
- /* @__PURE__ */ jsx3(ConnectedDot, {}),
2364
- /* @__PURE__ */ jsx3("span", {
2365
- children: "Skippr is connected"
2366
- })
2367
- ]
2368
- }),
2369
- status === "talking" && /* @__PURE__ */ jsxs3(Fragment, {
2370
- children: [
2371
- /* @__PURE__ */ jsx3(SpeakingBars, {}),
2372
- /* @__PURE__ */ jsx3("span", {
2373
- children: "Skippr is talking"
2374
- })
2375
- ]
2175
+ /* @__PURE__ */ jsx2("span", {
2176
+ className: cn("skippr:flex skippr:h-6 skippr:w-6 skippr:shrink-0 skippr:items-center skippr:justify-center", "skippr:text-amber-700"),
2177
+ children: /* @__PURE__ */ jsx2(Lightbulb, {
2178
+ className: "skippr:h-3.5 skippr:w-3.5",
2179
+ fill: "currentColor"
2180
+ })
2376
2181
  }),
2377
- status === "thinking" && /* @__PURE__ */ jsxs3(Fragment, {
2378
- children: [
2379
- /* @__PURE__ */ jsx3(ThinkingDots, {}),
2380
- /* @__PURE__ */ jsx3("span", {
2381
- children: "Skippr is thinking"
2382
- })
2383
- ]
2182
+ /* @__PURE__ */ jsx2("span", {
2183
+ className: "skippr:min-w-0 skippr:truncate skippr:text-[13px] skippr:font-semibold skippr:text-amber-950",
2184
+ children: goal.displayMessage
2384
2185
  }),
2385
- status === "paused" && /* @__PURE__ */ jsxs3(Fragment, {
2386
- children: [
2387
- /* @__PURE__ */ jsx3(PausedDot, {}),
2388
- /* @__PURE__ */ jsx3("span", {
2389
- children: "Session paused"
2390
- })
2391
- ]
2186
+ /* @__PURE__ */ jsx2(ArrowRight, {
2187
+ className: "skippr:h-3.5 skippr:w-3.5 skippr:shrink-0 skippr:text-amber-700"
2392
2188
  })
2393
2189
  ]
2394
- }, status)
2190
+ })
2395
2191
  });
2396
2192
  }
2397
- function ConnectedDot() {
2398
- return /* @__PURE__ */ jsxs3("span", {
2399
- className: "skippr:relative skippr:flex skippr:size-2",
2193
+
2194
+ // src/components/ModulePill.tsx
2195
+ import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
2196
+ var RING_RADIUS = 8;
2197
+ var RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS;
2198
+ function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2199
+ const completedPhases = progress?.completed ?? module.currentSession?.currentPhaseIndex ?? 0;
2200
+ const totalPhases = progress?.total ?? module.totalPhases;
2201
+ const showProgress = module.mode !== AGENT_MODE.AlwaysOn && totalPhases > 0;
2202
+ const progressFraction = showProgress ? Math.min(completedPhases / totalPhases, 1) : 0;
2203
+ return /* @__PURE__ */ jsxs3("button", {
2204
+ type: "button",
2205
+ onClick: () => onSelect(module.id),
2206
+ 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"),
2400
2207
  children: [
2401
- /* @__PURE__ */ jsx3("span", {
2402
- className: "skippr:absolute skippr:inline-flex skippr:size-full skippr:animate-ping skippr:rounded-full skippr:bg-emerald-400 skippr:opacity-75"
2208
+ isLive && /* @__PURE__ */ jsx3("span", {
2209
+ "aria-hidden": "true",
2210
+ className: "skippr:size-[6px] skippr:shrink-0 skippr:rounded-full skippr:bg-emerald-500 skippr:animate-pulse skippr:motion-reduce:animate-none"
2211
+ }),
2212
+ showProgress && !isLive && /* @__PURE__ */ jsxs3("svg", {
2213
+ viewBox: "0 0 20 20",
2214
+ className: "skippr:size-4 skippr:shrink-0 skippr:-rotate-90",
2215
+ "aria-hidden": "true",
2216
+ children: [
2217
+ /* @__PURE__ */ jsx3("circle", {
2218
+ cx: "10",
2219
+ cy: "10",
2220
+ r: RING_RADIUS,
2221
+ fill: "none",
2222
+ strokeWidth: "2.5",
2223
+ className: "skippr:stroke-black/15"
2224
+ }),
2225
+ /* @__PURE__ */ jsx3("circle", {
2226
+ cx: "10",
2227
+ cy: "10",
2228
+ r: RING_RADIUS,
2229
+ fill: "none",
2230
+ strokeWidth: "2.5",
2231
+ strokeLinecap: "round",
2232
+ strokeDasharray: RING_CIRCUMFERENCE,
2233
+ strokeDashoffset: RING_CIRCUMFERENCE * (1 - progressFraction),
2234
+ className: "skippr:stroke-bubble"
2235
+ })
2236
+ ]
2403
2237
  }),
2404
2238
  /* @__PURE__ */ jsx3("span", {
2405
- className: "skippr:relative skippr:inline-flex skippr:size-2 skippr:rounded-full skippr:bg-emerald-400"
2406
- })
2407
- ]
2408
- });
2409
- }
2410
- function PausedDot() {
2411
- return /* @__PURE__ */ jsx3("span", {
2412
- className: "skippr:inline-flex skippr:size-2 skippr:rounded-full skippr:bg-amber-400"
2413
- });
2414
- }
2415
- function ObservingIcon() {
2416
- return /* @__PURE__ */ jsxs3("svg", {
2417
- viewBox: "0 0 24 24",
2418
- className: "skippr:size-3.5",
2419
- fill: "none",
2420
- stroke: "currentColor",
2421
- strokeWidth: "2",
2422
- strokeLinecap: "round",
2423
- strokeLinejoin: "round",
2424
- "aria-hidden": "true",
2425
- children: [
2426
- /* @__PURE__ */ jsx3("path", {
2427
- d: "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z"
2239
+ className: "skippr:min-w-0 skippr:flex-1 skippr:truncate skippr:text-left",
2240
+ children: label ?? module.name
2428
2241
  }),
2429
- /* @__PURE__ */ jsx3("circle", {
2430
- cx: "12",
2431
- cy: "12",
2432
- r: "3",
2433
- fill: "currentColor",
2434
- stroke: "none",
2435
- className: "skippr:origin-center skippr:animate-[skippr-banner-look_2.4s_ease-in-out_infinite]"
2242
+ showProgress && /* @__PURE__ */ jsxs3("span", {
2243
+ 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"),
2244
+ children: [
2245
+ completedPhases,
2246
+ "/",
2247
+ totalPhases
2248
+ ]
2436
2249
  })
2437
2250
  ]
2438
2251
  });
2439
2252
  }
2440
- function SpeakingBars() {
2441
- return /* @__PURE__ */ jsxs3("span", {
2442
- className: "skippr:flex skippr:items-center skippr:gap-[2px] skippr:h-3.5",
2443
- children: [
2444
- /* @__PURE__ */ jsx3("span", {
2445
- className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_infinite] skippr:h-1.5"
2446
- }),
2447
- /* @__PURE__ */ jsx3("span", {
2448
- className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.15s_infinite] skippr:h-3"
2449
- }),
2450
- /* @__PURE__ */ jsx3("span", {
2451
- className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.3s_infinite] skippr:h-2"
2452
- }),
2453
- /* @__PURE__ */ jsx3("span", {
2454
- className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.45s_infinite] skippr:h-3.5"
2455
- }),
2456
- /* @__PURE__ */ jsx3("span", {
2457
- className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.6s_infinite] skippr:h-1"
2253
+
2254
+ // src/components/MinimizedBubble.tsx
2255
+ import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
2256
+ var GOALS_AUTO_HIDE_MS = 1e4;
2257
+ var GOAL_FADE_OUT_MS = 300;
2258
+ var GOAL_APPEAR_STAGGER_MS = 150;
2259
+ var GOAL_EXIT_STAGGER_MS = 250;
2260
+ var MAX_GOAL_BUBBLES = 3;
2261
+ var MAX_MODULE_PILLS = 3;
2262
+ function IdleLauncher({ position, onClick }) {
2263
+ return /* @__PURE__ */ jsx4("button", {
2264
+ type: "button",
2265
+ onClick,
2266
+ "aria-label": "Ask Me Anything",
2267
+ 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"),
2268
+ children: /* @__PURE__ */ jsx4("svg", {
2269
+ viewBox: "0 0 15.4044 18.4853",
2270
+ 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]"),
2271
+ fill: "none",
2272
+ "aria-hidden": "true",
2273
+ children: /* @__PURE__ */ jsx4("path", {
2274
+ 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",
2275
+ className: "skippr:fill-brand"
2458
2276
  })
2459
- ]
2277
+ })
2460
2278
  });
2461
2279
  }
2462
- function ThinkingDots() {
2463
- return /* @__PURE__ */ jsxs3("span", {
2464
- className: "skippr:flex skippr:items-center skippr:gap-[3px]",
2280
+ function WelcomeBubble({
2281
+ message,
2282
+ position,
2283
+ onDismiss
2284
+ }) {
2285
+ useEffect8(() => {
2286
+ const timer = setTimeout(onDismiss, 5000);
2287
+ return () => clearTimeout(timer);
2288
+ }, [onDismiss]);
2289
+ return /* @__PURE__ */ jsxs4("button", {
2290
+ type: "button",
2291
+ className: cn("skippr:absolute skippr:bottom-full skippr:mb-3", "skippr:max-w-64 skippr:rounded-xl skippr:bg-card skippr:shadow-lg", "skippr:border skippr:border-border skippr:px-4 skippr:py-3", "skippr:text-sm skippr:text-foreground skippr:leading-relaxed skippr:text-left", "skippr:animate-[skippr-fade-in_0.3s_ease-out]", "skippr:cursor-pointer", position === "right" ? "skippr:right-0" : "skippr:left-0"),
2292
+ onClick: onDismiss,
2293
+ "aria-label": "Dismiss",
2465
2294
  children: [
2466
- /* @__PURE__ */ jsx3("span", {
2467
- className: "skippr:size-1 skippr:rounded-full skippr:bg-white skippr:animate-bounce skippr:[animation-delay:0ms]"
2468
- }),
2469
- /* @__PURE__ */ jsx3("span", {
2470
- className: "skippr:size-1 skippr:rounded-full skippr:bg-white skippr:animate-bounce skippr:[animation-delay:150ms]"
2471
- }),
2472
- /* @__PURE__ */ jsx3("span", {
2473
- className: "skippr:size-1 skippr:rounded-full skippr:bg-white skippr:animate-bounce skippr:[animation-delay:300ms]"
2474
- })
2475
- ]
2476
- });
2477
- }
2478
-
2479
- // src/components/Logo.tsx
2480
- import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
2481
- function Logo({ className }) {
2482
- return /* @__PURE__ */ jsxs4("svg", {
2483
- width: "1em",
2484
- height: "1em",
2485
- viewBox: "0 0 200 200",
2486
- fill: "none",
2487
- xmlns: "http://www.w3.org/2000/svg",
2488
- role: "img",
2489
- "aria-label": "Skippr",
2490
- className,
2491
- children: [
2492
- /* @__PURE__ */ jsx4("rect", {
2493
- width: "200",
2494
- height: "200",
2495
- rx: "40",
2496
- fill: "#2D2D3F"
2497
- }),
2498
- /* @__PURE__ */ jsxs4("g", {
2499
- transform: "translate(100 100) scale(0.8) translate(-100 -100)",
2500
- children: [
2501
- /* @__PURE__ */ jsx4("path", {
2502
- d: "M144.497 59C149.193 59 153 62.8071 153 67.5033V116.397C153 118.034 152.536 119.562 151.735 120.859L114.894 92.4811L114.894 92.4804C105.42 85.1648 91.2971 91.7058 91.297 104.015V124.901H54.5033C49.8071 124.901 46 121.094 46 116.397V67.5033C46 62.8071 49.8071 59 54.5033 59H144.497ZM101.272 104.015C101.272 100.172 105.736 98.0111 108.798 100.375L140.637 124.901H101.272V104.015Z",
2503
- fill: "white"
2504
- }),
2505
- /* @__PURE__ */ jsx4("path", {
2506
- d: "M108.798 99.8856C105.736 97.5211 101.271 99.6824 101.271 103.525V155.892C101.271 160.27 106.852 162.191 109.594 158.755L122.619 142.437C123.1 141.836 123.712 141.35 124.409 141.016C125.106 140.683 125.871 140.51 126.645 140.51H147.946C152.386 140.51 154.316 134.944 150.81 132.247L108.798 99.8856Z",
2507
- fill: "#2BC0AE"
2508
- })
2509
- ]
2510
- })
2511
- ]
2512
- });
2513
- }
2514
-
2515
- // src/components/MinimizedBubble.tsx
2516
- import { jsx as jsx5, jsxs as jsxs5, Fragment as Fragment2 } from "react/jsx-runtime";
2517
- var CONTROL_BUTTON = "skippr:flex skippr:size-12 skippr:items-center skippr:justify-center skippr:rounded-[14px] skippr:cursor-pointer skippr:transition-all skippr:hover:-translate-y-0.5 skippr:active:translate-y-0";
2518
- var CONTROL_SHADOW = "skippr:shadow-[0_4px_16px_rgba(0,0,0,0.15),0_2px_4px_rgba(0,0,0,0.1)]";
2519
- function ConnectedLauncher() {
2520
- const {
2521
- expandPanel,
2522
- disconnect,
2523
- pauseSession,
2524
- resumeSession,
2525
- isPaused,
2526
- isPausing,
2527
- captureMode,
2528
- setSidebarTab
2529
- } = useLiveAgent();
2530
- const { isMuted, toggleMute, isScreenSharing, toggleScreenShare } = useMediaControls();
2531
- const showScreenShareToggle = captureMode === "screenshare";
2532
- const showPaused = isPaused || isPausing;
2533
- const openChat = () => {
2534
- setSidebarTab("chat");
2535
- expandPanel();
2536
- };
2537
- return /* @__PURE__ */ jsxs5(Fragment2, {
2538
- children: [
2539
- !showPaused && /* @__PURE__ */ jsxs5(Fragment2, {
2540
- children: [
2541
- /* @__PURE__ */ jsx5("button", {
2542
- type: "button",
2543
- onClick: toggleMute,
2544
- "aria-label": isMuted ? "Unmute" : "Mute",
2545
- className: cn(CONTROL_BUTTON, CONTROL_SHADOW, isMuted ? "skippr:bg-destructive/10 skippr:text-destructive skippr:hover:bg-destructive/20" : "skippr:bg-white skippr:text-foreground skippr:hover:bg-muted"),
2546
- children: isMuted ? /* @__PURE__ */ jsx5(MicOff, {
2547
- className: "skippr:size-5"
2548
- }) : /* @__PURE__ */ jsx5(Mic, {
2549
- className: "skippr:size-5"
2550
- })
2551
- }),
2552
- showScreenShareToggle && /* @__PURE__ */ jsx5("button", {
2553
- type: "button",
2554
- onClick: toggleScreenShare,
2555
- "aria-label": isScreenSharing ? "Stop sharing screen" : "Share screen",
2556
- className: cn(CONTROL_BUTTON, CONTROL_SHADOW, isScreenSharing ? "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90" : "skippr:bg-white skippr:text-foreground skippr:hover:bg-muted"),
2557
- children: isScreenSharing ? /* @__PURE__ */ jsx5(MonitorOff, {
2558
- className: "skippr:size-5"
2559
- }) : /* @__PURE__ */ jsx5(Monitor, {
2560
- className: "skippr:size-5"
2561
- })
2562
- })
2563
- ]
2564
- }),
2565
- /* @__PURE__ */ jsx5("button", {
2566
- type: "button",
2567
- onClick: () => isPaused ? resumeSession() : pauseSession(),
2568
- disabled: isPausing,
2569
- "aria-label": showPaused ? "Resume session" : "Pause session",
2570
- className: cn(CONTROL_BUTTON, CONTROL_SHADOW, "skippr:bg-white skippr:text-foreground skippr:hover:bg-muted skippr:disabled:opacity-60"),
2571
- children: showPaused ? /* @__PURE__ */ jsx5(Play, {
2572
- className: "skippr:size-5"
2573
- }) : /* @__PURE__ */ jsx5(Pause, {
2574
- className: "skippr:size-5"
2575
- })
2576
- }),
2577
- /* @__PURE__ */ jsx5("button", {
2578
- type: "button",
2579
- onClick: () => disconnect(),
2580
- "aria-label": "End session",
2581
- className: cn(CONTROL_BUTTON, "skippr:bg-destructive skippr:text-destructive-foreground skippr:hover:bg-destructive/90", "skippr:shadow-[0_4px_16px_rgba(217,79,79,0.45),0_2px_4px_rgba(0,0,0,0.1)]"),
2582
- children: /* @__PURE__ */ jsx5(PhoneOff, {
2583
- className: "skippr:size-5"
2584
- })
2585
- }),
2586
- !showPaused && /* @__PURE__ */ jsx5("button", {
2587
- type: "button",
2588
- onClick: openChat,
2589
- "aria-label": "Open chat",
2590
- className: cn(CONTROL_BUTTON, "skippr:bg-bubble skippr:text-white skippr:overflow-hidden", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)]", "skippr:hover:shadow-[0_6px_24px_rgba(45,43,61,0.55),0_4px_8px_rgba(0,0,0,0.1)]"),
2591
- children: /* @__PURE__ */ jsx5(MessageSquare, {
2592
- className: "skippr:size-5"
2593
- })
2594
- })
2595
- ]
2596
- });
2597
- }
2598
- function IdleLauncher() {
2599
- const { expandPanel } = useLiveAgent();
2600
- return /* @__PURE__ */ jsx5("button", {
2601
- type: "button",
2602
- onClick: expandPanel,
2603
- "aria-label": "Skippr assistant",
2604
- className: cn("skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:rounded-[10px] skippr:overflow-hidden skippr:cursor-pointer", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)]", "skippr:transition-all skippr:hover:brightness-110 skippr:hover:-translate-y-0.5 skippr:active:translate-y-0"),
2605
- children: /* @__PURE__ */ jsx5(Logo, {
2606
- className: "skippr:size-12"
2607
- })
2608
- });
2609
- }
2610
- function WelcomeBubble({
2611
- message,
2612
- position,
2613
- onDismiss
2614
- }) {
2615
- useEffect8(() => {
2616
- const timer = setTimeout(onDismiss, 5000);
2617
- return () => clearTimeout(timer);
2618
- }, [onDismiss]);
2619
- return /* @__PURE__ */ jsxs5("button", {
2620
- type: "button",
2621
- className: cn("skippr:absolute skippr:bottom-full skippr:mb-3", "skippr:max-w-64 skippr:rounded-xl skippr:bg-card skippr:shadow-lg", "skippr:border skippr:border-border skippr:px-4 skippr:py-3", "skippr:text-sm skippr:text-foreground skippr:leading-relaxed skippr:text-left", "skippr:animate-[skippr-fade-in_0.3s_ease-out]", "skippr:cursor-pointer", position === "right" ? "skippr:right-0" : "skippr:left-0"),
2622
- onClick: onDismiss,
2623
- "aria-label": "Dismiss",
2624
- children: [
2625
- message,
2626
- /* @__PURE__ */ jsx5("span", {
2627
- className: cn("skippr:absolute skippr:top-full skippr:size-2.5", "skippr:border-l skippr:border-t skippr:border-border skippr:bg-card", "skippr:rotate-[225deg]", position === "right" ? "skippr:right-5" : "skippr:left-5", "skippr:-mt-[5px]")
2295
+ message,
2296
+ /* @__PURE__ */ jsx4("span", {
2297
+ className: cn("skippr:absolute skippr:top-full skippr:size-2.5", "skippr:border-l skippr:border-t skippr:border-border skippr:bg-card", "skippr:rotate-[225deg]", position === "right" ? "skippr:right-5" : "skippr:left-5", "skippr:-mt-[5px]")
2628
2298
  })
2629
2299
  ]
2630
2300
  });
@@ -2634,42 +2304,117 @@ function MinimizedBubble({
2634
2304
  welcomeDismissed,
2635
2305
  onDismissWelcome
2636
2306
  }) {
2637
- const ctx = useContext3(LiveAgentContext);
2307
+ const ctx = useContext2(LiveAgentContext);
2638
2308
  if (!ctx) {
2639
2309
  throw new Error("MinimizedBubble must be used within a <LiveAgent> provider");
2640
2310
  }
2641
2311
  const {
2642
- isConnected,
2643
2312
  isStarting,
2644
- isPaused,
2645
- isPausing,
2646
2313
  position,
2647
2314
  adoptionGoals,
2648
- dismissAdoptionGoal,
2649
- startAdoptionSession
2315
+ startAdoptionSession,
2316
+ hasModuleSelector,
2317
+ isAuthenticated,
2318
+ availableModules,
2319
+ hasResolvedModules,
2320
+ selectModule,
2321
+ expandPanel
2650
2322
  } = ctx;
2651
- const inSession = isConnected || isPaused || isPausing;
2652
- return /* @__PURE__ */ jsxs5(Fragment2, {
2323
+ const [goalsAutoHidden, setGoalsAutoHidden] = useState6(false);
2324
+ const [isLauncherHovered, setIsLauncherHovered] = useState6(false);
2325
+ const [visitHref, setVisitHref] = useState6(() => window.location.href);
2326
+ const revealedHrefRef = useRef5(null);
2327
+ const hoverContainerRef = useRef5(null);
2328
+ useEffect8(() => subscribeToLocationChange(() => setVisitHref(window.location.href)), []);
2329
+ useEffect8(() => {
2330
+ const el = hoverContainerRef.current;
2331
+ if (!el)
2332
+ return;
2333
+ const onEnter = () => setIsLauncherHovered(true);
2334
+ const onLeave = () => setIsLauncherHovered(false);
2335
+ el.addEventListener("mouseenter", onEnter);
2336
+ el.addEventListener("mouseleave", onLeave);
2337
+ return () => {
2338
+ el.removeEventListener("mouseenter", onEnter);
2339
+ el.removeEventListener("mouseleave", onLeave);
2340
+ };
2341
+ }, []);
2342
+ const actionableModules = hasModuleSelector ? availableModules.filter((module) => {
2343
+ const state = getModuleSessionState(module.currentSession, module.mode);
2344
+ return state !== "completed" && state !== "expired";
2345
+ }) : [];
2346
+ const alwaysOnModule = actionableModules.find((module) => module.mode === AGENT_MODE.AlwaysOn);
2347
+ const pillCandidates = actionableModules.filter((module) => module.mode !== AGENT_MODE.AlwaysOn);
2348
+ const onboardingModule = pillCandidates.find((module) => module.type === "onboarding");
2349
+ const modulePills = onboardingModule ? [onboardingModule] : pillCandidates.slice(0, MAX_MODULE_PILLS).reverse();
2350
+ const goalsEligible = adoptionGoals.length > 0 && !onboardingModule && (!hasModuleSelector || hasResolvedModules);
2351
+ useEffect8(() => {
2352
+ if (!goalsEligible)
2353
+ return;
2354
+ if (revealedHrefRef.current === visitHref) {
2355
+ setGoalsAutoHidden(true);
2356
+ return;
2357
+ }
2358
+ revealedHrefRef.current = visitHref;
2359
+ setGoalsAutoHidden(false);
2360
+ const timer = setTimeout(() => setGoalsAutoHidden(true), GOALS_AUTO_HIDE_MS);
2361
+ return () => clearTimeout(timer);
2362
+ }, [goalsEligible, visitHref]);
2363
+ const matchedGoals = goalsEligible ? adoptionGoals.slice(0, MAX_GOAL_BUBBLES) : [];
2364
+ const goalsHidden = goalsAutoHidden && !isLauncherHovered;
2365
+ const [goalsUnmounted, setGoalsUnmounted] = useState6(false);
2366
+ useEffect8(() => {
2367
+ if (!goalsHidden) {
2368
+ setGoalsUnmounted(false);
2369
+ return;
2370
+ }
2371
+ const exitTotalMs = GOAL_FADE_OUT_MS + GOAL_EXIT_STAGGER_MS * (MAX_GOAL_BUBBLES - 1);
2372
+ const timer = setTimeout(() => setGoalsUnmounted(true), exitTotalMs);
2373
+ return () => clearTimeout(timer);
2374
+ }, [goalsHidden]);
2375
+ const visibleGoals = goalsUnmounted ? [] : matchedGoals;
2376
+ const launchDefaultSession = () => {
2377
+ if (isStarting)
2378
+ return;
2379
+ if (!hasModuleSelector || !isAuthenticated) {
2380
+ expandPanel();
2381
+ return;
2382
+ }
2383
+ const target = alwaysOnModule ?? onboardingModule ?? pillCandidates[0];
2384
+ if (target) {
2385
+ selectModule(target.id);
2386
+ return;
2387
+ }
2388
+ expandPanel();
2389
+ };
2390
+ return /* @__PURE__ */ jsxs4("div", {
2391
+ ref: hoverContainerRef,
2392
+ className: cn("skippr:fixed skippr:bottom-12 skippr:z-[9999]", "skippr:flex skippr:items-center skippr:gap-2", position === "right" ? "skippr:right-3" : "skippr:left-3"),
2653
2393
  children: [
2654
- /* @__PURE__ */ jsx5(LauncherStatusPill, {}),
2655
- /* @__PURE__ */ jsxs5("div", {
2656
- className: cn("skippr:fixed skippr:bottom-6 skippr:z-[9999]", "skippr:flex skippr:items-center skippr:gap-2", position === "right" ? "skippr:right-6" : "skippr:left-6"),
2394
+ (modulePills.length > 0 || visibleGoals.length > 0) && /* @__PURE__ */ jsxs4("div", {
2395
+ className: cn("skippr:absolute skippr:bottom-full skippr:mb-3 skippr:flex skippr:flex-col skippr:gap-2", position === "right" ? "skippr:right-0 skippr:items-end" : "skippr:left-0 skippr:items-start"),
2657
2396
  children: [
2658
- !inSession && !isStarting && adoptionGoals.length > 0 && /* @__PURE__ */ jsx5("div", {
2659
- className: cn("skippr:absolute skippr:bottom-full skippr:mb-3 skippr:flex skippr:flex-col skippr:gap-2", position === "right" ? "skippr:right-0 skippr:items-end" : "skippr:left-0 skippr:items-start"),
2660
- children: adoptionGoals.map((goal) => /* @__PURE__ */ jsx5(AdoptionBubble, {
2661
- goal,
2662
- onAttend: startAdoptionSession,
2663
- onDismiss: dismissAdoptionGoal
2664
- }, goal.goalId))
2665
- }),
2666
- welcomeMessage && !isConnected && !isStarting && !welcomeDismissed && adoptionGoals.length === 0 && /* @__PURE__ */ jsx5(WelcomeBubble, {
2667
- message: welcomeMessage,
2668
- position,
2669
- onDismiss: onDismissWelcome
2670
- }),
2671
- inSession ? /* @__PURE__ */ jsx5(ConnectedLauncher, {}) : /* @__PURE__ */ jsx5(IdleLauncher, {})
2397
+ visibleGoals.map((goal, index2) => /* @__PURE__ */ jsx4(AdoptionBubble, {
2398
+ goal,
2399
+ onAttend: startAdoptionSession,
2400
+ appearDelayMs: (visibleGoals.length - 1 - index2) * GOAL_APPEAR_STAGGER_MS,
2401
+ exitDelayMs: (visibleGoals.length - 1 - index2) * GOAL_EXIT_STAGGER_MS,
2402
+ hidden: goalsHidden
2403
+ }, goal.goalId)),
2404
+ modulePills.map((module) => /* @__PURE__ */ jsx4(ModulePill, {
2405
+ module,
2406
+ onSelect: selectModule
2407
+ }, module.id))
2672
2408
  ]
2409
+ }),
2410
+ welcomeMessage && !welcomeDismissed && adoptionGoals.length === 0 && modulePills.length === 0 && /* @__PURE__ */ jsx4(WelcomeBubble, {
2411
+ message: welcomeMessage,
2412
+ position,
2413
+ onDismiss: onDismissWelcome
2414
+ }),
2415
+ /* @__PURE__ */ jsx4(IdleLauncher, {
2416
+ position,
2417
+ onClick: launchDefaultSession
2673
2418
  })
2674
2419
  ]
2675
2420
  });
@@ -2677,19 +2422,19 @@ function MinimizedBubble({
2677
2422
 
2678
2423
  // src/components/PageActionHandler.tsx
2679
2424
  import { useDataChannel as useDataChannel2 } from "@livekit/components-react/hooks";
2680
- import { useCallback as useCallback7, useEffect as useEffect10, useRef as useRef6, useState as useState7 } from "react";
2425
+ import { useCallback as useCallback6, useEffect as useEffect10, useRef as useRef7, useState as useState8 } from "react";
2681
2426
 
2682
2427
  // src/components/AgentActivityIndicator.tsx
2683
- import { useEffect as useEffect9, useRef as useRef5, useState as useState6 } from "react";
2684
- import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
2428
+ import { useEffect as useEffect9, useRef as useRef6, useState as useState7 } from "react";
2429
+ import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
2685
2430
  var Z_INDEX2 = 2147483646;
2686
2431
  function centerOf(element) {
2687
2432
  const rect = getRectInTopViewport(element);
2688
2433
  return { left: rect.left + rect.width / 2, top: rect.top + rect.height / 2 };
2689
2434
  }
2690
2435
  function AgentActivityIndicator({ target }) {
2691
- const [position, setPosition] = useState6(null);
2692
- const frameRef = useRef5(null);
2436
+ const [position, setPosition] = useState7(null);
2437
+ const frameRef = useRef6(null);
2693
2438
  useEffect9(() => {
2694
2439
  if (!target || !target.element.isConnected) {
2695
2440
  setPosition(null);
@@ -2728,21 +2473,21 @@ function AgentActivityIndicator({ target }) {
2728
2473
  zIndex: Z_INDEX2,
2729
2474
  transition: "left 0.45s cubic-bezier(0.22, 1, 0.36, 1), top 0.45s cubic-bezier(0.22, 1, 0.36, 1)"
2730
2475
  };
2731
- return /* @__PURE__ */ jsx6("div", {
2476
+ return /* @__PURE__ */ jsx5("div", {
2732
2477
  "data-skippr-private": "true",
2733
2478
  style: containerStyle,
2734
- children: /* @__PURE__ */ jsxs6("div", {
2479
+ children: /* @__PURE__ */ jsxs5("div", {
2735
2480
  className: "skippr:relative",
2736
2481
  children: [
2737
- /* @__PURE__ */ jsx6(MousePointer2, {
2482
+ /* @__PURE__ */ jsx5(MousePointer2, {
2738
2483
  "aria-hidden": "true",
2739
2484
  className: "skippr:h-5 skippr:w-5 skippr:text-cyan-500 skippr:drop-shadow-[0_1px_3px_rgba(0,0,0,0.35)] skippr:animate-skippr-press",
2740
2485
  fill: "currentColor"
2741
2486
  }),
2742
- /* @__PURE__ */ jsx6("div", {
2487
+ /* @__PURE__ */ jsx5("div", {
2743
2488
  role: "status",
2744
2489
  className: "skippr:absolute skippr:left-5 skippr:top-4 skippr:flex skippr:items-center skippr:gap-1.5 skippr:rounded-full skippr:bg-cyan-500 skippr:px-2.5 skippr:py-1 skippr:shadow-[0_4px_12px_rgba(0,0,0,0.18)]",
2745
- children: /* @__PURE__ */ jsx6("span", {
2490
+ children: /* @__PURE__ */ jsx5("span", {
2746
2491
  className: "skippr:text-[11px] skippr:font-medium skippr:text-white skippr:whitespace-nowrap",
2747
2492
  children: target.label
2748
2493
  })
@@ -2753,7 +2498,7 @@ function AgentActivityIndicator({ target }) {
2753
2498
  }
2754
2499
 
2755
2500
  // src/components/PageActionHandler.tsx
2756
- import { jsx as jsx7 } from "react/jsx-runtime";
2501
+ import { jsx as jsx6 } from "react/jsx-runtime";
2757
2502
  var INDICATOR_LINGER_MS = 1400;
2758
2503
  var CURSOR_LEAD_BEFORE_ACTION_MS = 350;
2759
2504
  var SETTLE_MS = 250;
@@ -2897,14 +2642,14 @@ function labelFor(action) {
2897
2642
  }
2898
2643
  }
2899
2644
  function PageActionHandler() {
2900
- const [activity, setActivity] = useState7(null);
2901
- const mountedRef = useRef6(true);
2902
- const queueRef = useRef6([]);
2903
- const drainingRef = useRef6(false);
2904
- const timersRef = useRef6(new Set);
2905
- const wakesRef = useRef6(new Set);
2906
- const indicatorTimerRef = useRef6(null);
2907
- const sleep = useCallback7((ms) => {
2645
+ const [activity, setActivity] = useState8(null);
2646
+ const mountedRef = useRef7(true);
2647
+ const queueRef = useRef7([]);
2648
+ const drainingRef = useRef7(false);
2649
+ const timersRef = useRef7(new Set);
2650
+ const wakesRef = useRef7(new Set);
2651
+ const indicatorTimerRef = useRef7(null);
2652
+ const sleep = useCallback6((ms) => {
2908
2653
  return new Promise((resolve) => {
2909
2654
  const wake = () => {
2910
2655
  wakesRef.current.delete(wake);
@@ -2918,7 +2663,7 @@ function PageActionHandler() {
2918
2663
  timersRef.current.add(timer);
2919
2664
  });
2920
2665
  }, []);
2921
- const showActivity = useCallback7((target) => {
2666
+ const showActivity = useCallback6((target) => {
2922
2667
  if (indicatorTimerRef.current) {
2923
2668
  clearTimeout(indicatorTimerRef.current);
2924
2669
  indicatorTimerRef.current = null;
@@ -2933,7 +2678,7 @@ function PageActionHandler() {
2933
2678
  indicatorTimerRef.current = timer;
2934
2679
  }
2935
2680
  }, []);
2936
- const processOne = useCallback7(async (action) => {
2681
+ const processOne = useCallback6(async (action) => {
2937
2682
  if (action.type === "navigate") {
2938
2683
  queueRef.current.length = 0;
2939
2684
  if (!isSameOriginHttpUrl(action.url))
@@ -2959,7 +2704,7 @@ function PageActionHandler() {
2959
2704
  runAgentAction(() => performAction(action, element));
2960
2705
  await sleep(SETTLE_MS);
2961
2706
  }, [showActivity, sleep]);
2962
- const drain = useCallback7(async () => {
2707
+ const drain = useCallback6(async () => {
2963
2708
  if (drainingRef.current)
2964
2709
  return;
2965
2710
  drainingRef.current = true;
@@ -2974,7 +2719,7 @@ function PageActionHandler() {
2974
2719
  drainingRef.current = false;
2975
2720
  }
2976
2721
  }, [processOne]);
2977
- const onMessage = useCallback7((msg) => {
2722
+ const onMessage = useCallback6((msg) => {
2978
2723
  const action = parsePageAction(msg.payload);
2979
2724
  if (!action)
2980
2725
  return;
@@ -3000,15 +2745,476 @@ function PageActionHandler() {
3000
2745
  };
3001
2746
  }, []);
3002
2747
  useDataChannel2(PAGE_ACTIONS_TOPIC, onMessage);
3003
- return /* @__PURE__ */ jsx7(AgentActivityIndicator, {
2748
+ return /* @__PURE__ */ jsx6(AgentActivityIndicator, {
3004
2749
  target: activity
3005
2750
  });
3006
2751
  }
3007
2752
 
2753
+ // src/components/SessionControlBar.tsx
2754
+ import { useContext as useContext5 } from "react";
2755
+
2756
+ // src/hooks/useAgentVoiceState.ts
2757
+ import { useVoiceAssistant } from "@livekit/components-react/hooks";
2758
+ function useAgentVoiceState() {
2759
+ const { state } = useVoiceAssistant();
2760
+ return {
2761
+ state,
2762
+ isSpeaking: state === "speaking",
2763
+ isListening: state === "listening"
2764
+ };
2765
+ }
2766
+
2767
+ // src/hooks/useLiveAgent.ts
2768
+ import { useContext as useContext3 } from "react";
2769
+ function useLiveAgent() {
2770
+ const ctx = useContext3(LiveAgentContext);
2771
+ if (!ctx) {
2772
+ throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
2773
+ }
2774
+ const {
2775
+ usesHostAuth,
2776
+ authFailed,
2777
+ connection,
2778
+ shouldConnect,
2779
+ historyMessages,
2780
+ phasesSnapshot,
2781
+ setPhasesSnapshot,
2782
+ hasResolvedModules,
2783
+ adoptionGoals,
2784
+ startAdoptionSession,
2785
+ ...publicValue
2786
+ } = ctx;
2787
+ return publicValue;
2788
+ }
2789
+
2790
+ // src/hooks/useMediaControls.ts
2791
+ import { useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
2792
+ import { ScreenSharePresets as ScreenSharePresets2 } from "livekit-client";
2793
+ import { useCallback as useCallback7 } from "react";
2794
+ var SCREEN_SHARE_OPTIONS = {
2795
+ video: { displaySurface: "browser" },
2796
+ resolution: ScreenSharePresets2.h720fps30.resolution,
2797
+ contentHint: "detail"
2798
+ };
2799
+ function useMediaControls() {
2800
+ const { localParticipant } = useLocalParticipant3();
2801
+ const isMuted = !localParticipant.isMicrophoneEnabled;
2802
+ const isScreenSharing = localParticipant.isScreenShareEnabled;
2803
+ const toggleMute = useCallback7(async () => {
2804
+ try {
2805
+ await localParticipant.setMicrophoneEnabled(isMuted);
2806
+ } catch (error) {
2807
+ console.error("Failed to toggle microphone:", error);
2808
+ }
2809
+ }, [localParticipant, isMuted]);
2810
+ const toggleScreenShare = useCallback7(async () => {
2811
+ try {
2812
+ await localParticipant.setScreenShareEnabled(!isScreenSharing, SCREEN_SHARE_OPTIONS);
2813
+ } catch (error) {
2814
+ console.error("Failed to toggle screen share:", error);
2815
+ }
2816
+ }, [localParticipant, isScreenSharing]);
2817
+ return { isMuted, toggleMute, isScreenSharing, toggleScreenShare };
2818
+ }
2819
+
2820
+ // src/hooks/useMicLevel.ts
2821
+ import { useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react/hooks";
2822
+ import { useEffect as useEffect11, useRef as useRef8, useState as useState9 } from "react";
2823
+ var MIC_BARS = 5;
2824
+ var IDLE_BAR_HEIGHT_PX = 5;
2825
+ var MAX_BAR_GROWTH_PX = 17;
2826
+ var BAR_NOISE_GATE = 0.25;
2827
+ var TALKING_LEVEL_THRESHOLD = 0.2;
2828
+ var TALKING_HOLD_MS = 400;
2829
+ function useMicLevel(enabled) {
2830
+ const { microphoneTrack } = useLocalParticipant4();
2831
+ const barRefs = useRef8([]);
2832
+ const [isTalking, setIsTalking] = useState9(false);
2833
+ const mediaStreamTrack = microphoneTrack?.track?.mediaStreamTrack;
2834
+ useEffect11(() => {
2835
+ if (!enabled || !mediaStreamTrack) {
2836
+ for (const bar of barRefs.current) {
2837
+ if (bar)
2838
+ bar.style.height = `${IDLE_BAR_HEIGHT_PX}px`;
2839
+ }
2840
+ setIsTalking(false);
2841
+ return;
2842
+ }
2843
+ const AudioContextCtor = window.AudioContext ?? window.webkitAudioContext;
2844
+ const audioContext = new AudioContextCtor;
2845
+ const analyser = audioContext.createAnalyser();
2846
+ analyser.fftSize = 64;
2847
+ analyser.smoothingTimeConstant = 0.6;
2848
+ audioContext.createMediaStreamSource(new MediaStream([mediaStreamTrack])).connect(analyser);
2849
+ const frequencyData = new Uint8Array(analyser.frequencyBinCount);
2850
+ let rafId = 0;
2851
+ let talkingHoldUntil = 0;
2852
+ const tick = () => {
2853
+ analyser.getByteFrequencyData(frequencyData);
2854
+ let levelSum = 0;
2855
+ for (let i = 0;i < MIC_BARS; i++) {
2856
+ const binIndex = 1 + Math.floor(i / MIC_BARS * (frequencyData.length - 2));
2857
+ const level = (frequencyData[binIndex] ?? 0) / 255;
2858
+ const gatedLevel = Math.max(0, level - BAR_NOISE_GATE) / (1 - BAR_NOISE_GATE);
2859
+ levelSum += gatedLevel;
2860
+ const bar = barRefs.current[i];
2861
+ if (bar) {
2862
+ bar.style.height = `${IDLE_BAR_HEIGHT_PX + Math.min(1, gatedLevel * 1.8) * MAX_BAR_GROWTH_PX}px`;
2863
+ }
2864
+ }
2865
+ const now = performance.now();
2866
+ if (levelSum / MIC_BARS > TALKING_LEVEL_THRESHOLD) {
2867
+ talkingHoldUntil = now + TALKING_HOLD_MS;
2868
+ }
2869
+ const talking = now < talkingHoldUntil;
2870
+ setIsTalking((prev) => prev === talking ? prev : talking);
2871
+ rafId = requestAnimationFrame(tick);
2872
+ };
2873
+ rafId = requestAnimationFrame(tick);
2874
+ return () => {
2875
+ cancelAnimationFrame(rafId);
2876
+ audioContext.close().catch(() => {});
2877
+ setIsTalking(false);
2878
+ };
2879
+ }, [enabled, mediaStreamTrack]);
2880
+ return { barRefs, isTalking };
2881
+ }
2882
+
2883
+ // src/hooks/usePhaseUpdates.ts
2884
+ import { useCallback as useCallback8, useContext as useContext4, useEffect as useEffect13 } from "react";
2885
+
2886
+ // src/hooks/useAgentState.ts
2887
+ import { useRemoteParticipants } from "@livekit/components-react/hooks";
2888
+ import { useEffect as useEffect12, useState as useState10 } from "react";
2889
+ function useAgentState(attributeKey, parse, initial) {
2890
+ const [value, setValue] = useState10(initial);
2891
+ const remoteParticipants = useRemoteParticipants();
2892
+ useEffect12(() => {
2893
+ const agentParticipant = remoteParticipants.find((p) => p.attributes?.[attributeKey]);
2894
+ if (agentParticipant) {
2895
+ const attr = agentParticipant.attributes?.[attributeKey];
2896
+ if (attr) {
2897
+ const parsed = parse(attr);
2898
+ if (parsed)
2899
+ setValue(parsed);
2900
+ }
2901
+ }
2902
+ const handlers = new Map;
2903
+ for (const p of remoteParticipants) {
2904
+ const handler = (changedAttributes) => {
2905
+ if (changedAttributes[attributeKey]) {
2906
+ const parsed = parse(changedAttributes[attributeKey]);
2907
+ if (parsed)
2908
+ setValue(parsed);
2909
+ } else if (p.attributes?.[attributeKey]) {
2910
+ const parsed = parse(p.attributes[attributeKey]);
2911
+ if (parsed)
2912
+ setValue(parsed);
2913
+ }
2914
+ };
2915
+ handlers.set(p, handler);
2916
+ p.on("attributesChanged", handler);
2917
+ }
2918
+ return () => {
2919
+ for (const [p, handler] of handlers) {
2920
+ p.off("attributesChanged", handler);
2921
+ }
2922
+ };
2923
+ }, [remoteParticipants, attributeKey, parse]);
2924
+ return value;
2925
+ }
2926
+
2927
+ // src/hooks/usePhaseUpdates.ts
2928
+ function parsePhases(json) {
2929
+ try {
2930
+ const data = JSON.parse(json);
2931
+ if (data.type === "phase_update" && Array.isArray(data.phases)) {
2932
+ return data.phases;
2933
+ }
2934
+ } catch {}
2935
+ return null;
2936
+ }
2937
+ function usePhaseUpdates() {
2938
+ const parse = useCallback8(parsePhases, []);
2939
+ const livePhases = useAgentState("phases", parse, []);
2940
+ const ctx = useContext4(LiveAgentContext);
2941
+ useEffect13(() => {
2942
+ if (livePhases.length > 0)
2943
+ ctx?.setPhasesSnapshot(livePhases);
2944
+ }, [livePhases, ctx?.setPhasesSnapshot]);
2945
+ const phases = livePhases.length > 0 ? livePhases : ctx?.phasesSnapshot ?? [];
2946
+ return { phases };
2947
+ }
2948
+
2949
+ // src/components/SessionControlBar.tsx
2950
+ import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
2951
+ var STANDBY_BAR_WIDTH = 168;
2952
+ var READY_BAR_WIDTH = 176;
2953
+ var TEXT_BAR_WIDTH = 64;
2954
+ var SCREEN_SHARE_EXTRA_WIDTH = 56;
2955
+ var MIC_REGION_WIDTH = 104;
2956
+ var MIC_SQUARE_WIDTH = 48;
2957
+ var SQUARE_BUTTON = "skippr:flex skippr:size-12 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-2xl skippr:cursor-pointer skippr:transition-colors";
2958
+ function AgentActivity({ state }) {
2959
+ return /* @__PURE__ */ jsxs6("span", {
2960
+ role: "status",
2961
+ className: "skippr:flex skippr:h-5 skippr:w-12 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:text-bubble",
2962
+ "aria-label": `Agent is ${state}`,
2963
+ children: [
2964
+ state === "speaking" && /* @__PURE__ */ jsxs6("span", {
2965
+ className: "skippr:flex skippr:h-5 skippr:items-center skippr:gap-[2px]",
2966
+ children: [
2967
+ /* @__PURE__ */ jsx7("span", {
2968
+ className: "skippr:h-2 skippr:w-[2px] skippr:rounded-full skippr:bg-current skippr:[animation:skippr-speak_1.1s_ease-in-out_infinite]"
2969
+ }),
2970
+ /* @__PURE__ */ jsx7("span", {
2971
+ className: "skippr:h-4 skippr:w-[2px] skippr:rounded-full skippr:bg-current skippr:[animation:skippr-speak_1.1s_ease-in-out_0.15s_infinite]"
2972
+ }),
2973
+ /* @__PURE__ */ jsx7("span", {
2974
+ className: "skippr:h-2.5 skippr:w-[2px] skippr:rounded-full skippr:bg-current skippr:[animation:skippr-speak_1.1s_ease-in-out_0.3s_infinite]"
2975
+ }),
2976
+ /* @__PURE__ */ jsx7("span", {
2977
+ className: "skippr:h-3.5 skippr:w-[2px] skippr:rounded-full skippr:bg-current skippr:[animation:skippr-speak_1.1s_ease-in-out_0.45s_infinite]"
2978
+ })
2979
+ ]
2980
+ }),
2981
+ state === "thinking" && /* @__PURE__ */ jsxs6("span", {
2982
+ className: "skippr:flex skippr:items-center skippr:gap-[3px]",
2983
+ children: [
2984
+ /* @__PURE__ */ jsx7("span", {
2985
+ className: "skippr:size-[5px] skippr:rounded-full skippr:bg-current skippr:animate-bounce skippr:[animation-delay:0ms]"
2986
+ }),
2987
+ /* @__PURE__ */ jsx7("span", {
2988
+ className: "skippr:size-[5px] skippr:rounded-full skippr:bg-current skippr:animate-bounce skippr:[animation-delay:150ms]"
2989
+ }),
2990
+ /* @__PURE__ */ jsx7("span", {
2991
+ className: "skippr:size-[5px] skippr:rounded-full skippr:bg-current skippr:animate-bounce skippr:[animation-delay:300ms]"
2992
+ })
2993
+ ]
2994
+ }),
2995
+ state === "listening" && /* @__PURE__ */ jsxs6("svg", {
2996
+ viewBox: "0 0 24 24",
2997
+ className: "skippr:size-5",
2998
+ fill: "none",
2999
+ stroke: "currentColor",
3000
+ strokeWidth: "2",
3001
+ strokeLinecap: "round",
3002
+ strokeLinejoin: "round",
3003
+ "aria-hidden": "true",
3004
+ children: [
3005
+ /* @__PURE__ */ jsx7("path", {
3006
+ d: "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z"
3007
+ }),
3008
+ /* @__PURE__ */ jsx7("circle", {
3009
+ cx: "12",
3010
+ cy: "12",
3011
+ r: "2.5",
3012
+ fill: "currentColor",
3013
+ stroke: "none",
3014
+ className: "skippr:origin-center skippr:[animation:skippr-banner-look_2.4s_ease-in-out_infinite]"
3015
+ })
3016
+ ]
3017
+ })
3018
+ ]
3019
+ });
3020
+ }
3021
+ function SessionControlBar() {
3022
+ const {
3023
+ expandPanel,
3024
+ minimizePanel,
3025
+ isPanelOpen,
3026
+ pauseSession,
3027
+ isPausing,
3028
+ captureMode,
3029
+ setSidebarTab,
3030
+ activeModule,
3031
+ position
3032
+ } = useLiveAgent();
3033
+ const textMode = useContext5(LiveAgentContext)?.textMode ?? false;
3034
+ const { isMuted, toggleMute, isScreenSharing, toggleScreenShare } = useMediaControls();
3035
+ const { state } = useAgentVoiceState();
3036
+ const { phases } = usePhaseUpdates();
3037
+ const isReady = state === "listening" || state === "thinking" || state === "speaking";
3038
+ const { barRefs, isTalking } = useMicLevel(isReady && !isMuted && !textMode);
3039
+ const showScreenShareToggle = captureMode === "screenshare";
3040
+ const screenShareExtra = showScreenShareToggle ? SCREEN_SHARE_EXTRA_WIDTH : 0;
3041
+ let barWidth = STANDBY_BAR_WIDTH;
3042
+ if (isReady) {
3043
+ barWidth = textMode ? TEXT_BAR_WIDTH + screenShareExtra : READY_BAR_WIDTH + screenShareExtra;
3044
+ }
3045
+ const agendaModule = activeModule && activeModule.mode !== AGENT_MODE.AlwaysOn && activeModule.totalPhases > 0 ? activeModule : null;
3046
+ const agendaProgress = phases.length > 0 ? {
3047
+ completed: phases.filter((phase) => phase.status === "completed").length,
3048
+ total: phases.length
3049
+ } : agendaModule ? {
3050
+ completed: agendaModule.currentSession?.currentPhaseIndex ?? 0,
3051
+ total: agendaModule.totalPhases
3052
+ } : null;
3053
+ const currentPhaseName = phases.find((phase) => phase.status === "active")?.name ?? phases.find((phase) => phase.status === "pending")?.name;
3054
+ const openAgenda = () => {
3055
+ setSidebarTab("agenda");
3056
+ expandPanel();
3057
+ };
3058
+ const togglePanel = () => {
3059
+ if (isPanelOpen) {
3060
+ minimizePanel();
3061
+ return;
3062
+ }
3063
+ setSidebarTab(agendaModule && !textMode ? "agenda" : "chat");
3064
+ expandPanel();
3065
+ };
3066
+ return /* @__PURE__ */ jsxs6("div", {
3067
+ className: cn("skippr:fixed skippr:bottom-12 skippr:z-[9999]", position === "right" ? "skippr:right-3" : "skippr:left-3"),
3068
+ children: [
3069
+ !isPanelOpen && agendaModule && agendaProgress && /* @__PURE__ */ jsx7("div", {
3070
+ className: cn("skippr:absolute skippr:bottom-full skippr:mb-3", position === "right" ? "skippr:right-0" : "skippr:left-0"),
3071
+ children: /* @__PURE__ */ jsx7(ModulePill, {
3072
+ module: agendaModule,
3073
+ onSelect: openAgenda,
3074
+ progress: agendaProgress,
3075
+ label: currentPhaseName ?? agendaModule.name,
3076
+ isLive: true
3077
+ })
3078
+ }),
3079
+ /* @__PURE__ */ jsxs6("div", {
3080
+ style: { width: barWidth },
3081
+ className: cn("skippr:group skippr:relative skippr:flex skippr:h-16 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] skippr:duration-300 skippr:ease-out", "skippr:[animation:skippr-toolset-pop_440ms_cubic-bezier(0.22,1,0.36,1)]"),
3082
+ children: [
3083
+ !isReady && /* @__PURE__ */ jsxs6("span", {
3084
+ className: "skippr:flex skippr:h-12 skippr:items-center skippr:justify-center skippr:gap-2 skippr:text-[13px] skippr:font-medium skippr:text-bubble skippr:[animation:skippr-stage-fade_240ms_ease-out]",
3085
+ children: [
3086
+ /* @__PURE__ */ jsxs6("span", {
3087
+ className: "skippr:flex skippr:items-center skippr:gap-[3px]",
3088
+ children: [
3089
+ /* @__PURE__ */ jsx7("span", {
3090
+ className: "skippr:size-1.5 skippr:rounded-full skippr:bg-bubble skippr:animate-bounce skippr:[animation-delay:0ms]"
3091
+ }),
3092
+ /* @__PURE__ */ jsx7("span", {
3093
+ className: "skippr:size-1.5 skippr:rounded-full skippr:bg-bubble skippr:animate-bounce skippr:[animation-delay:150ms]"
3094
+ }),
3095
+ /* @__PURE__ */ jsx7("span", {
3096
+ className: "skippr:size-1.5 skippr:rounded-full skippr:bg-bubble skippr:animate-bounce skippr:[animation-delay:300ms]"
3097
+ })
3098
+ ]
3099
+ }),
3100
+ /* @__PURE__ */ jsx7("span", {
3101
+ children: "Standing by…"
3102
+ })
3103
+ ]
3104
+ }),
3105
+ isReady && /* @__PURE__ */ jsxs6("div", {
3106
+ className: "skippr:flex skippr:items-center skippr:gap-2 skippr:[animation:skippr-stage-fade_240ms_ease-out]",
3107
+ children: [
3108
+ !textMode && /* @__PURE__ */ jsxs6("div", {
3109
+ className: "skippr:relative skippr:h-12",
3110
+ style: { width: MIC_REGION_WIDTH },
3111
+ children: [
3112
+ !isTalking && /* @__PURE__ */ jsx7("span", {
3113
+ className: "skippr:absolute skippr:inset-y-0 skippr:right-[-3px] skippr:flex skippr:w-14 skippr:items-center skippr:justify-center skippr:[animation:skippr-agent-in_200ms_ease-out_240ms_both]",
3114
+ children: /* @__PURE__ */ jsx7(AgentActivity, {
3115
+ state
3116
+ })
3117
+ }),
3118
+ /* @__PURE__ */ jsxs6("div", {
3119
+ className: "skippr:absolute skippr:top-0 skippr:left-0 skippr:z-10 skippr:flex skippr:h-12 skippr:items-center skippr:gap-2.5 skippr:overflow-hidden skippr:rounded-2xl skippr:bg-bubble skippr:pl-3.5 skippr:text-white skippr:transition-[width] skippr:duration-300 skippr:ease-out",
3120
+ style: { width: isTalking ? MIC_REGION_WIDTH : MIC_SQUARE_WIDTH },
3121
+ children: [
3122
+ /* @__PURE__ */ jsx7("button", {
3123
+ type: "button",
3124
+ onClick: () => void toggleMute(),
3125
+ "aria-label": isMuted ? "Unmute" : "Mute",
3126
+ className: cn("skippr:flex skippr:shrink-0 skippr:items-center skippr:justify-center skippr:cursor-pointer skippr:transition-colors", isMuted ? "skippr:text-red-400 skippr:hover:text-red-300" : "skippr:text-white skippr:hover:text-white/80"),
3127
+ children: isMuted ? /* @__PURE__ */ jsx7(MicOff, {
3128
+ className: "skippr:size-5"
3129
+ }) : /* @__PURE__ */ jsx7(Mic, {
3130
+ className: "skippr:size-5"
3131
+ })
3132
+ }),
3133
+ /* @__PURE__ */ jsx7("span", {
3134
+ className: cn("skippr:flex skippr:h-6 skippr:flex-1 skippr:items-center skippr:justify-center skippr:gap-[3px] skippr:transition-opacity skippr:duration-200", isTalking ? "skippr:opacity-100" : "skippr:opacity-0"),
3135
+ children: Array.from({ length: MIC_BARS }).map((_, index2) => /* @__PURE__ */ jsx7("span", {
3136
+ ref: (el) => {
3137
+ barRefs.current[index2] = el;
3138
+ },
3139
+ className: "skippr:w-[3px] skippr:rounded-full skippr:bg-white skippr:transition-[height] skippr:duration-75",
3140
+ style: { height: 5 }
3141
+ }, index2))
3142
+ })
3143
+ ]
3144
+ })
3145
+ ]
3146
+ }),
3147
+ showScreenShareToggle && /* @__PURE__ */ jsx7("button", {
3148
+ type: "button",
3149
+ onClick: () => void toggleScreenShare(),
3150
+ "aria-label": isScreenSharing ? "Stop sharing screen" : "Share screen",
3151
+ 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"),
3152
+ children: isScreenSharing ? /* @__PURE__ */ jsx7(MonitorOff, {
3153
+ className: "skippr:size-5"
3154
+ }) : /* @__PURE__ */ jsx7(Monitor, {
3155
+ className: "skippr:size-5"
3156
+ })
3157
+ }),
3158
+ /* @__PURE__ */ jsx7("button", {
3159
+ type: "button",
3160
+ onClick: togglePanel,
3161
+ "aria-label": isPanelOpen ? "Close panel" : agendaModule && !textMode ? "Open agenda" : "Open chat",
3162
+ className: cn(SQUARE_BUTTON, "skippr:text-neutral-700", textMode ? "skippr:hover:bg-neutral-100" : "skippr:bg-neutral-100 skippr:hover:bg-neutral-200"),
3163
+ children: /* @__PURE__ */ jsx7(MessageSquare, {
3164
+ className: "skippr:size-5"
3165
+ })
3166
+ })
3167
+ ]
3168
+ }, textMode ? "ready-text" : "ready"),
3169
+ isReady && /* @__PURE__ */ jsxs6("button", {
3170
+ type: "button",
3171
+ onClick: () => void pauseSession(),
3172
+ disabled: isPausing,
3173
+ "aria-label": "Pause session",
3174
+ "aria-busy": isPausing,
3175
+ className: cn("skippr:absolute skippr:-top-2 skippr:-right-2 skippr:z-20 skippr:flex skippr:size-6 skippr:items-center skippr:justify-center", "skippr:rounded-full skippr:bg-bubble skippr:text-white", "skippr:shadow-[0_4px_14px_rgba(0,0,0,0.3)]", "skippr:transition-opacity skippr:duration-150", isPausing ? "skippr:opacity-100 skippr:cursor-default" : "skippr:opacity-0 skippr:cursor-pointer skippr:hover:bg-[#3a384b] skippr:group-hover:opacity-100 skippr:focus-visible:opacity-100"),
3176
+ children: [
3177
+ /* @__PURE__ */ jsx7(X, {
3178
+ className: cn("skippr:size-3.5 skippr:transition-opacity skippr:duration-200", isPausing && "skippr:opacity-40"),
3179
+ strokeWidth: 2.5
3180
+ }),
3181
+ isPausing && /* @__PURE__ */ jsxs6("svg", {
3182
+ viewBox: "0 0 24 24",
3183
+ fill: "none",
3184
+ "aria-hidden": "true",
3185
+ className: "skippr:absolute skippr:inset-0 skippr:size-full skippr:animate-spin skippr:motion-reduce:hidden",
3186
+ children: [
3187
+ /* @__PURE__ */ jsx7("circle", {
3188
+ cx: "12",
3189
+ cy: "12",
3190
+ r: "10.5",
3191
+ stroke: "white",
3192
+ strokeOpacity: "0.2",
3193
+ strokeWidth: "1.5"
3194
+ }),
3195
+ /* @__PURE__ */ jsx7("circle", {
3196
+ cx: "12",
3197
+ cy: "12",
3198
+ r: "10.5",
3199
+ stroke: "white",
3200
+ strokeWidth: "1.5",
3201
+ strokeLinecap: "round",
3202
+ strokeDasharray: "17 49"
3203
+ })
3204
+ ]
3205
+ })
3206
+ ]
3207
+ })
3208
+ ]
3209
+ })
3210
+ ]
3211
+ });
3212
+ }
3213
+
3008
3214
  // src/components/ShadowHost.tsx
3009
- import { useLayoutEffect, useRef as useRef7, useState as useState8 } from "react";
3215
+ import { useLayoutEffect, useRef as useRef9, useState as useState11 } from "react";
3010
3216
  import { createPortal } from "react-dom";
3011
- import { jsx as jsx8, Fragment as Fragment3 } from "react/jsx-runtime";
3217
+ import { jsx as jsx8, Fragment } from "react/jsx-runtime";
3012
3218
  var PROPERTIES_STYLE_ID = "skippr-tw-properties";
3013
3219
  var PROPERTY_RULE = /@property\s+[^{]+\{[^}]*\}/g;
3014
3220
  function hoistTailwindProperties(css) {
@@ -3023,10 +3229,10 @@ function hoistTailwindProperties(css) {
3023
3229
  return css.replace(PROPERTY_RULE, "");
3024
3230
  }
3025
3231
  function ShadowHost({ children }) {
3026
- const hostRef = useRef7(null);
3027
- const [shadowRoot, setShadowRoot] = useState8(null);
3232
+ const hostRef = useRef9(null);
3233
+ const [shadowRoot, setShadowRoot] = useState11(null);
3028
3234
  const css = `/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
3029
- @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-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking: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-400:oklch(70.4% .191 22.216);--skippr-color-red-700:oklch(50.5% .213 27.518);--skippr-color-amber-400:oklch(82.8% .189 84.429);--skippr-color-emerald-400:oklch(76.5% .177 163.223);--skippr-color-cyan-400:oklch(78.9% .154 211.53);--skippr-color-cyan-500:oklch(71.5% .143 215.221);--skippr-color-cyan-900:oklch(39.8% .07 227.392);--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-tracking-wide:.025em;--skippr-tracking-wider:.05em;--skippr-leading-tight:1.25;--skippr-leading-snug:1.375;--skippr-leading-relaxed:1.625;--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\\:top-0{top:calc(var(--skippr-spacing)*0)}.skippr\\:top-4{top:calc(var(--skippr-spacing)*4)}.skippr\\:top-full{top:100%}.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-2{bottom:calc(var(--skippr-spacing)*-2)}.skippr\\:-bottom-9{bottom:calc(var(--skippr-spacing)*-9)}.skippr\\:bottom-0{bottom:calc(var(--skippr-spacing)*0)}.skippr\\:bottom-6{bottom:calc(var(--skippr-spacing)*6)}.skippr\\:bottom-20{bottom:calc(var(--skippr-spacing)*20)}.skippr\\:bottom-\\[88px\\]{bottom:88px}.skippr\\:bottom-full{bottom:100%}.skippr\\:left-0{left:calc(var(--skippr-spacing)*0)}.skippr\\:left-1\\/2{left:50%}.skippr\\:left-3{left:calc(var(--skippr-spacing)*3)}.skippr\\:left-5{left:calc(var(--skippr-spacing)*5)}.skippr\\:left-6{left:calc(var(--skippr-spacing)*6)}.skippr\\:z-10{z-index:10}.skippr\\:z-\\[9998\\]{z-index:9998}.skippr\\:z-\\[9999\\]{z-index:9999}.skippr\\:col-span-2{grid-column:span 2/span 2}.skippr\\:mx-auto{margin-inline:auto}.skippr\\:-mt-\\[5px\\]{margin-top:-5px}.skippr\\:mt-0\\.5{margin-top:calc(var(--skippr-spacing)*.5)}.skippr\\:mt-1{margin-top:calc(var(--skippr-spacing)*1)}.skippr\\:mt-1\\.5{margin-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:mt-3{margin-top:calc(var(--skippr-spacing)*3)}.skippr\\:mb-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\\:line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.skippr\\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.skippr\\:flex{display:flex}.skippr\\:grid{display:grid}.skippr\\:inline-flex{display:inline-flex}.skippr\\:size-1{width:calc(var(--skippr-spacing)*1);height:calc(var(--skippr-spacing)*1)}.skippr\\:size-1\\.5{width:calc(var(--skippr-spacing)*1.5);height:calc(var(--skippr-spacing)*1.5)}.skippr\\:size-2{width:calc(var(--skippr-spacing)*2);height:calc(var(--skippr-spacing)*2)}.skippr\\:size-2\\.5{width:calc(var(--skippr-spacing)*2.5);height:calc(var(--skippr-spacing)*2.5)}.skippr\\:size-3\\.5{width:calc(var(--skippr-spacing)*3.5);height:calc(var(--skippr-spacing)*3.5)}.skippr\\:size-4{width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}.skippr\\:size-5{width:calc(var(--skippr-spacing)*5);height:calc(var(--skippr-spacing)*5)}.skippr\\:size-6{width:calc(var(--skippr-spacing)*6);height:calc(var(--skippr-spacing)*6)}.skippr\\:size-7{width:calc(var(--skippr-spacing)*7);height:calc(var(--skippr-spacing)*7)}.skippr\\:size-8{width:calc(var(--skippr-spacing)*8);height:calc(var(--skippr-spacing)*8)}.skippr\\:size-9{width:calc(var(--skippr-spacing)*9);height:calc(var(--skippr-spacing)*9)}.skippr\\:size-10{width:calc(var(--skippr-spacing)*10);height:calc(var(--skippr-spacing)*10)}.skippr\\:size-11{width:calc(var(--skippr-spacing)*11);height:calc(var(--skippr-spacing)*11)}.skippr\\:size-12{width:calc(var(--skippr-spacing)*12);height:calc(var(--skippr-spacing)*12)}.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-8{height:calc(var(--skippr-spacing)*8)}.skippr\\:h-9{height:calc(var(--skippr-spacing)*9)}.skippr\\:h-10{height:calc(var(--skippr-spacing)*10)}.skippr\\:h-12{height:calc(var(--skippr-spacing)*12)}.skippr\\:h-\\[min\\(460px\\,calc\\(100vh-200px\\)\\)\\]{height:min(460px,100vh - 200px)}.skippr\\:h-full{height:100%}.skippr\\:min-h-0{min-height:calc(var(--skippr-spacing)*0)}.skippr\\:w-0{width:calc(var(--skippr-spacing)*0)}.skippr\\:w-3{width:calc(var(--skippr-spacing)*3)}.skippr\\:w-4{width:calc(var(--skippr-spacing)*4)}.skippr\\:w-5{width:calc(var(--skippr-spacing)*5)}.skippr\\:w-9{width:calc(var(--skippr-spacing)*9)}.skippr\\:w-10{width:calc(var(--skippr-spacing)*10)}.skippr\\:w-\\[2px\\]{width:2px}.skippr\\:w-full{width:100%}.skippr\\:max-w-64{max-width:calc(var(--skippr-spacing)*64)}.skippr\\:max-w-72{max-width:calc(var(--skippr-spacing)*72)}.skippr\\:max-w-\\[80\\%\\]{max-width:80%}.skippr\\:min-w-0{min-width:calc(var(--skippr-spacing)*0)}.skippr\\:flex-1{flex:1}.skippr\\:shrink-0{flex-shrink:0}.skippr\\:origin-bottom-left{transform-origin:0 100%}.skippr\\:origin-bottom-right{transform-origin:100% 100%}.skippr\\:origin-center{transform-origin:50%}.skippr\\:-translate-x-1\\/2{--tw-translate-x: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-\\[225deg\\]{rotate:225deg}.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-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-pointer{cursor:pointer}.skippr\\:resize-none{resize:none}.skippr\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.skippr\\:flex-col{flex-direction:column}.skippr\\:items-center{align-items:center}.skippr\\:items-end{align-items:flex-end}.skippr\\:items-start{align-items:flex-start}.skippr\\:justify-between{justify-content:space-between}.skippr\\:justify-center{justify-content:center}.skippr\\:justify-end{justify-content:flex-end}.skippr\\:gap-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-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}.skippr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.skippr\\:overflow-hidden{overflow:hidden}.skippr\\:overflow-y-auto{overflow-y:auto}.skippr\\:rounded-2xl{border-radius:1.125rem}.skippr\\:rounded-\\[1rem\\]{border-radius:1rem}.skippr\\:rounded-\\[10px\\]{border-radius:10px}.skippr\\:rounded-\\[14px\\]{border-radius:14px}.skippr\\:rounded-full{border-radius:3.40282e38px}.skippr\\:rounded-lg{border-radius:.625rem}.skippr\\:rounded-md{border-radius:.5rem}.skippr\\:rounded-sm{border-radius:.375rem}.skippr\\:rounded-xl{border-radius:.875rem}.skippr\\:border{border-style:var(--tw-border-style);border-width:1px}.skippr\\:border-0{border-style:var(--tw-border-style);border-width:0}.skippr\\:border-2{border-style:var(--tw-border-style);border-width:2px}.skippr\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.skippr\\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.skippr\\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.skippr\\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.skippr\\:border-border{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-cyan-400{border-color:var(--skippr-color-cyan-400)}.skippr\\:border-destructive\\/20{border-color:oklab(61.4357% .15892 .0698893/.2)}.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-amber-400{background-color:var(--skippr-color-amber-400)}.skippr\\:bg-background{background-color:oklch(100% 0 0)}.skippr\\:bg-bubble{background-color:#2d2b3d}.skippr\\:bg-bubble\\/15{background-color:oklab(29.9244% .0107414 -.0305411/.15)}.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-cyan-400{background-color:var(--skippr-color-cyan-400)}.skippr\\:bg-cyan-500{background-color:var(--skippr-color-cyan-500)}.skippr\\:bg-destructive{background-color:#d94f4f}.skippr\\:bg-destructive\\/10{background-color:oklab(61.4357% .15892 .0698893/.1)}.skippr\\:bg-destructive\\/15{background-color:oklab(61.4357% .15892 .0698893/.15)}.skippr\\:bg-emerald-400{background-color:var(--skippr-color-emerald-400)}.skippr\\:bg-foreground{background-color:oklch(14.7% .004 49.25)}.skippr\\:bg-muted{background-color:oklch(97% .001 106.424)}.skippr\\:bg-muted-foreground\\/20{background-color:oklab(55.3% .00687528 .0110332/.2)}.skippr\\:bg-muted-foreground\\/40{background-color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:bg-muted\\/50{background-color:oklab(97% -.000282743 .000959196/.5)}.skippr\\:bg-primary{background-color:#2d2b3d}.skippr\\:bg-primary-foreground\\/15{background-color:oklab(100% 0 5.96046e-8/.15)}.skippr\\:bg-primary-foreground\\/20{background-color:oklab(100% 0 5.96046e-8/.2)}.skippr\\:bg-primary\\/10{background-color:oklab(29.9244% .0107414 -.0305411/.1)}.skippr\\:bg-red-50{background-color:var(--skippr-color-red-50)}.skippr\\:bg-red-400{background-color:var(--skippr-color-red-400)}.skippr\\:bg-secondary{background-color:#ffdfb5}.skippr\\:bg-transparent{background-color:#0000}.skippr\\:bg-white{background-color:var(--skippr-color-white)}.skippr\\:bg-gradient-to-t{--tw-gradient-position:to top in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.skippr\\:from-background{--tw-gradient-from:oklch(100% 0 0);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.skippr\\:to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.skippr\\:fill-primary\\/30{fill:oklab(29.9244% .0107414 -.0305411/.3)}.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\\:p-6{padding:calc(var(--skippr-spacing)*6)}.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-3{padding-top:calc(var(--skippr-spacing)*3)}.skippr\\:pr-1\\.5{padding-right:calc(var(--skippr-spacing)*1.5)}.skippr\\:pb-5{padding-bottom:calc(var(--skippr-spacing)*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-\\[9px\\]{font-size:9px}.skippr\\:text-\\[10px\\]{font-size:10px}.skippr\\:text-\\[11px\\]{font-size:11px}.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\\:tracking-wide{--tw-tracking:var(--skippr-tracking-wide);letter-spacing:var(--skippr-tracking-wide)}.skippr\\:tracking-wider{--tw-tracking:var(--skippr-tracking-wider);letter-spacing:var(--skippr-tracking-wider)}.skippr\\:whitespace-nowrap{white-space:nowrap}.skippr\\:text-background{color:oklch(100% 0 0)}.skippr\\:text-bubble{color:#2d2b3d}.skippr\\:text-chart-3{color:oklch(66.6% .179 58.318)}.skippr\\:text-cyan-500{color:var(--skippr-color-cyan-500)}.skippr\\:text-cyan-900{color:var(--skippr-color-cyan-900)}.skippr\\:text-destructive{color:#d94f4f}.skippr\\:text-destructive-foreground{color:oklch(100% 0 0)}.skippr\\:text-foreground{color:oklch(14.7% .004 49.25)}.skippr\\:text-muted-foreground{color:oklch(55.3% .013 58.071)}.skippr\\:text-muted-foreground\\/30{color:oklab(55.3% .00687528 .0110332/.3)}.skippr\\:text-muted-foreground\\/40{color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:text-muted-foreground\\/60{color:oklab(55.3% .00687528 .0110332/.6)}.skippr\\:text-muted-foreground\\/70{color:oklab(55.3% .00687528 .0110332/.7)}.skippr\\:text-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-700{color:var(--skippr-color-red-700)}.skippr\\:text-secondary-foreground{color:#613700}.skippr\\:text-white,.skippr\\:text-white\\/70{color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:text-white\\/70{color:color-mix(in oklab,var(--skippr-color-white)70%,transparent)}}.skippr\\:uppercase{text-transform:uppercase}.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-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-\\[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_12px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 4px 12px 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_4px_16px_rgba\\(0\\,0\\,0\\,0\\.15\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#00000026),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_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_4px_16px_rgba\\(217\\,79\\,79\\,0\\.45\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#d94f4f73),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\\(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-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-foreground\\/10{--tw-ring-color:oklab(14.7% .00261104 .00303026/.1)}.skippr\\:ring-offset-background{--tw-ring-offset-color:oklch(100% 0 0)}.skippr\\:drop-shadow-\\[0_1px_3px_rgba\\(0\\,0\\,0\\,0\\.35\\)\\]{--tw-drop-shadow-size:drop-shadow(0 1px 3px var(--tw-drop-shadow-color,#00000059));--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-\\[opacity\\,transform\\]{transition-property:opacity,transform;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-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:duration-150{--tw-duration:.15s;transition-duration:.15s}.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\\:outline-none{--tw-outline-style:none;outline-style:none}.skippr\\:\\[animation-delay\\:0ms\\]{animation-delay:0s}.skippr\\:\\[animation-delay\\:150ms\\]{animation-delay:.15s}.skippr\\:\\[animation-delay\\:200ms\\]{animation-delay:.2s}.skippr\\:\\[animation-delay\\:300ms\\]{animation-delay:.3s}.skippr\\:\\[animation-delay\\:400ms\\]{animation-delay:.4s}.skippr\\: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\\: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-accent:hover{background-color:#e7e5e4}.skippr\\:hover\\:bg-bubble:hover{background-color:#2d2b3d}.skippr\\:hover\\:bg-destructive\\/20:hover{background-color:oklab(61.4357% .15892 .0698893/.2)}.skippr\\:hover\\:bg-destructive\\/25:hover{background-color:oklab(61.4357% .15892 .0698893/.25)}.skippr\\:hover\\:bg-destructive\\/90:hover{background-color:oklab(61.4357% .15892 .0698893/.9)}.skippr\\:hover\\:bg-muted:hover{background-color:oklch(97% .001 106.424)}.skippr\\:hover\\:bg-muted\\/50:hover{background-color:oklab(97% -.000282743 .000959196/.5)}.skippr\\:hover\\:bg-muted\\/80:hover{background-color:oklab(97% -.000282743 .000959196/.8)}.skippr\\:hover\\:bg-primary-foreground\\/10:hover{background-color:oklab(100% 0 5.96046e-8/.1)}.skippr\\:hover\\:bg-primary\\/90:hover{background-color:oklab(29.9244% .0107414 -.0305411/.9)}.skippr\\:hover\\:bg-secondary\\/80:hover{background-color:oklab(91.9963% .0175391 .0626889/.8)}.skippr\\:hover\\:bg-white\\/15:hover{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:hover\\:bg-white\\/15:hover{background-color:color-mix(in oklab,var(--skippr-color-white)15%,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\\:text-white:hover{color:var(--skippr-color-white)}.skippr\\:hover\\:opacity-90:hover{opacity:.9}.skippr\\:hover\\:shadow-\\[0_6px_24px_rgba\\(45\\,43\\,61\\,0\\.55\\)\\,0_4px_8px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]:hover{--tw-shadow:0 6px 24px var(--tw-shadow-color,#2d2b3d8c),0 4px 8px 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\\: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-ring:focus-visible{--tw-ring-color:oklch(70.9% .01 56.259)}.skippr\\:focus-visible\\:ring-white\\/70:focus-visible{--tw-ring-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:focus-visible\\:ring-white\\/70:focus-visible{--tw-ring-color:color-mix(in oklab,var(--skippr-color-white)70%,transparent)}}.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\\:focus-visible\\:ring-inset:focus-visible{--tw-ring-inset:inset}.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}.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-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 #22d3ee73}50%{box-shadow:0 0 0 10px #22d3ee00}}@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-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)}}.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-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{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}}`;
3235
+ @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--skippr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--skippr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--skippr-color-red-50:oklch(97.1% .013 17.38);--skippr-color-red-300:oklch(80.8% .114 19.571);--skippr-color-red-400:oklch(70.4% .191 22.216);--skippr-color-red-700:oklch(50.5% .213 27.518);--skippr-color-amber-50:oklch(98.7% .022 95.277);--skippr-color-amber-100:oklch(96.2% .059 95.617);--skippr-color-amber-400:oklch(82.8% .189 84.429);--skippr-color-amber-700:oklch(55.5% .163 48.998);--skippr-color-amber-950:oklch(27.9% .077 45.635);--skippr-color-emerald-400:oklch(76.5% .177 163.223);--skippr-color-emerald-500:oklch(69.6% .17 162.48);--skippr-color-cyan-400:oklch(78.9% .154 211.53);--skippr-color-cyan-500:oklch(71.5% .143 215.221);--skippr-color-cyan-900:oklch(39.8% .07 227.392);--skippr-color-neutral-100:oklch(97% 0 0);--skippr-color-neutral-200:oklch(92.2% 0 0);--skippr-color-neutral-700:oklch(37.1% 0 0);--skippr-color-black:#000;--skippr-color-white:#fff;--skippr-spacing:.25rem;--skippr-text-xs:.75rem;--skippr-text-xs--line-height:calc(1/.75);--skippr-text-sm:.875rem;--skippr-text-sm--line-height:calc(1.25/.875);--skippr-font-weight-medium:500;--skippr-font-weight-semibold:600;--skippr-leading-tight:1.25;--skippr-leading-relaxed:1.625;--skippr-ease-out:cubic-bezier(0,0,.2,1);--skippr-ease-in-out:cubic-bezier(.4,0,.2,1);--skippr-animate-spin:spin 1s linear infinite;--skippr-animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--skippr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--skippr-animate-bounce:bounce 1s infinite;--skippr-blur-sm:8px;--skippr-default-transition-duration:.15s;--skippr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--skippr-default-font-family:var(--skippr-font-sans);--skippr-default-mono-font-family:var(--skippr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--skippr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--skippr-default-font-feature-settings,normal);font-variation-settings:var(--skippr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--skippr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--skippr-default-mono-font-feature-settings,normal);font-variation-settings:var(--skippr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.skippr\\:pointer-events-none{pointer-events:none}.skippr\\:absolute{position:absolute}.skippr\\:fixed{position:fixed}.skippr\\:relative{position:relative}.skippr\\:sticky{position:sticky}.skippr\\:inset-0{inset:calc(var(--skippr-spacing)*0)}.skippr\\:inset-y-0{inset-block:calc(var(--skippr-spacing)*0)}.skippr\\:-top-2{top:calc(var(--skippr-spacing)*-2)}.skippr\\:top-0{top:calc(var(--skippr-spacing)*0)}.skippr\\:top-1\\/2{top:50%}.skippr\\:top-4{top:calc(var(--skippr-spacing)*4)}.skippr\\:top-full{top:100%}.skippr\\:-right-2{right:calc(var(--skippr-spacing)*-2)}.skippr\\:right-0{right:calc(var(--skippr-spacing)*0)}.skippr\\:right-3{right:calc(var(--skippr-spacing)*3)}.skippr\\:right-5{right:calc(var(--skippr-spacing)*5)}.skippr\\:right-6{right:calc(var(--skippr-spacing)*6)}.skippr\\:right-\\[-3px\\]{right:-3px}.skippr\\:right-\\[24px\\]{right:24px}.skippr\\:-bottom-2{bottom:calc(var(--skippr-spacing)*-2)}.skippr\\:-bottom-9{bottom:calc(var(--skippr-spacing)*-9)}.skippr\\:bottom-6{bottom:calc(var(--skippr-spacing)*6)}.skippr\\:bottom-12{bottom:calc(var(--skippr-spacing)*12)}.skippr\\:bottom-20{bottom:calc(var(--skippr-spacing)*20)}.skippr\\:bottom-\\[88px\\]{bottom:88px}.skippr\\:bottom-\\[124px\\]{bottom:124px}.skippr\\:bottom-full{bottom:100%}.skippr\\:left-0{left:calc(var(--skippr-spacing)*0)}.skippr\\:left-1\\/2{left:50%}.skippr\\:left-3{left:calc(var(--skippr-spacing)*3)}.skippr\\:left-5{left:calc(var(--skippr-spacing)*5)}.skippr\\:left-6{left:calc(var(--skippr-spacing)*6)}.skippr\\:left-\\[24px\\]{left:24px}.skippr\\:z-10{z-index:10}.skippr\\:z-20{z-index:20}.skippr\\:z-\\[9998\\]{z-index:9998}.skippr\\:z-\\[9999\\]{z-index:9999}.skippr\\:mx-auto{margin-inline:auto}.skippr\\:-mt-\\[5px\\]{margin-top:-5px}.skippr\\:mt-0\\.5{margin-top:calc(var(--skippr-spacing)*.5)}.skippr\\:mt-1{margin-top:calc(var(--skippr-spacing)*1)}.skippr\\:mt-1\\.5{margin-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:mb-1\\.5{margin-bottom:calc(var(--skippr-spacing)*1.5)}.skippr\\:mb-2{margin-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:mb-3{margin-bottom:calc(var(--skippr-spacing)*3)}.skippr\\:mb-4{margin-bottom:calc(var(--skippr-spacing)*4)}.skippr\\:ml-0\\.5{margin-left:calc(var(--skippr-spacing)*.5)}.skippr\\:flex{display:flex}.skippr\\:inline-flex{display:inline-flex}.skippr\\:size-1{width:calc(var(--skippr-spacing)*1);height:calc(var(--skippr-spacing)*1)}.skippr\\:size-1\\.5{width:calc(var(--skippr-spacing)*1.5);height:calc(var(--skippr-spacing)*1.5)}.skippr\\:size-2{width:calc(var(--skippr-spacing)*2);height:calc(var(--skippr-spacing)*2)}.skippr\\:size-2\\.5{width:calc(var(--skippr-spacing)*2.5);height:calc(var(--skippr-spacing)*2.5)}.skippr\\:size-3\\.5{width:calc(var(--skippr-spacing)*3.5);height:calc(var(--skippr-spacing)*3.5)}.skippr\\:size-4{width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}.skippr\\:size-5{width:calc(var(--skippr-spacing)*5);height:calc(var(--skippr-spacing)*5)}.skippr\\:size-6{width:calc(var(--skippr-spacing)*6);height:calc(var(--skippr-spacing)*6)}.skippr\\:size-7{width:calc(var(--skippr-spacing)*7);height:calc(var(--skippr-spacing)*7)}.skippr\\:size-8{width:calc(var(--skippr-spacing)*8);height:calc(var(--skippr-spacing)*8)}.skippr\\:size-9{width:calc(var(--skippr-spacing)*9);height:calc(var(--skippr-spacing)*9)}.skippr\\:size-10{width:calc(var(--skippr-spacing)*10);height:calc(var(--skippr-spacing)*10)}.skippr\\:size-12{width:calc(var(--skippr-spacing)*12);height:calc(var(--skippr-spacing)*12)}.skippr\\:size-\\[5px\\]{width:5px;height:5px}.skippr\\:size-\\[6px\\]{width:6px;height:6px}.skippr\\:size-full{width:100%;height:100%}.skippr\\:h-0{height:calc(var(--skippr-spacing)*0)}.skippr\\:h-0\\.5{height:calc(var(--skippr-spacing)*.5)}.skippr\\:h-1{height:calc(var(--skippr-spacing)*1)}.skippr\\:h-1\\.5{height:calc(var(--skippr-spacing)*1.5)}.skippr\\:h-2{height:calc(var(--skippr-spacing)*2)}.skippr\\:h-2\\.5{height:calc(var(--skippr-spacing)*2.5)}.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-8{height:calc(var(--skippr-spacing)*8)}.skippr\\:h-9{height:calc(var(--skippr-spacing)*9)}.skippr\\:h-10{height:calc(var(--skippr-spacing)*10)}.skippr\\:h-12{height:calc(var(--skippr-spacing)*12)}.skippr\\:h-16{height:calc(var(--skippr-spacing)*16)}.skippr\\:h-\\[18\\.5px\\]{height:18.5px}.skippr\\:h-\\[50px\\]{height:50px}.skippr\\:h-\\[min\\(460px\\,calc\\(100vh-200px\\)\\)\\]{height:min(460px,100vh - 200px)}.skippr\\:h-full{height:100%}.skippr\\:min-h-0{min-height:calc(var(--skippr-spacing)*0)}.skippr\\:w-0{width:calc(var(--skippr-spacing)*0)}.skippr\\:w-3{width:calc(var(--skippr-spacing)*3)}.skippr\\:w-3\\.5{width:calc(var(--skippr-spacing)*3.5)}.skippr\\:w-5{width:calc(var(--skippr-spacing)*5)}.skippr\\:w-6{width:calc(var(--skippr-spacing)*6)}.skippr\\:w-10{width:calc(var(--skippr-spacing)*10)}.skippr\\:w-12{width:calc(var(--skippr-spacing)*12)}.skippr\\:w-14{width:calc(var(--skippr-spacing)*14)}.skippr\\:w-40{width:calc(var(--skippr-spacing)*40)}.skippr\\:w-\\[2px\\]{width:2px}.skippr\\:w-\\[3px\\]{width:3px}.skippr\\:w-\\[15\\.4px\\]{width:15.4px}.skippr\\:w-\\[50px\\]{width:50px}.skippr\\:w-full{width:100%}.skippr\\:max-w-64{max-width:calc(var(--skippr-spacing)*64)}.skippr\\:max-w-72{max-width:calc(var(--skippr-spacing)*72)}.skippr\\:max-w-\\[80\\%\\]{max-width:80%}.skippr\\:min-w-0{min-width:calc(var(--skippr-spacing)*0)}.skippr\\:flex-1{flex:1}.skippr\\:shrink-0{flex-shrink:0}.skippr\\:origin-bottom-left{transform-origin:0 100%}.skippr\\:origin-bottom-right{transform-origin:100% 100%}.skippr\\:origin-center{transform-origin:50%}.skippr\\:origin-left{transform-origin:0}.skippr\\:origin-right{transform-origin:100%}.skippr\\:-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-\\[225deg\\]{rotate:225deg}.skippr\\:\\[animation\\:skippr-agent-in_200ms_ease-out_240ms_both\\]{animation:.2s ease-out .24s both skippr-agent-in}.skippr\\:\\[animation\\:skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:\\[animation\\:skippr-orb-in_320ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)\\]{animation:.32s cubic-bezier(.34,1.3,.64,1) skippr-orb-in}.skippr\\:\\[animation\\:skippr-speak_1\\.1s_ease-in-out_0\\.3s_infinite\\]{animation:1.1s ease-in-out .3s infinite skippr-speak}.skippr\\:\\[animation\\:skippr-speak_1\\.1s_ease-in-out_0\\.15s_infinite\\]{animation:1.1s ease-in-out .15s infinite skippr-speak}.skippr\\:\\[animation\\:skippr-speak_1\\.1s_ease-in-out_0\\.45s_infinite\\]{animation:1.1s ease-in-out .45s infinite skippr-speak}.skippr\\:\\[animation\\:skippr-speak_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-speak}.skippr\\:\\[animation\\:skippr-stage-fade_240ms_ease-out\\]{animation:.24s ease-out skippr-stage-fade}.skippr\\:\\[animation\\:skippr-tip-in_360ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)_backwards\\]{animation:.36s cubic-bezier(.34,1.3,.64,1) backwards skippr-tip-in}.skippr\\:\\[animation\\:skippr-toolset-pop_440ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{animation:.44s cubic-bezier(.22,1,.36,1) skippr-toolset-pop}.skippr\\:animate-\\[skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:animate-\\[skippr-bubble-in_0\\.28s_ease-out\\]{animation:.28s ease-out skippr-bubble-in}.skippr\\:animate-\\[skippr-fade-in_0\\.3s_ease-out\\]{animation:.3s ease-out skippr-fade-in}.skippr\\:animate-\\[skippr-pill-content_0\\.22s_ease-out\\]{animation:.22s ease-out skippr-pill-content}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.3s_infinite\\]{animation:1.1s ease-in-out .3s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.6s_infinite\\]{animation:1.1s ease-in-out .6s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.15s_infinite\\]{animation:1.1s ease-in-out .15s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.45s_infinite\\]{animation:1.1s ease-in-out .45s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-speak}.skippr\\:animate-bounce{animation:var(--skippr-animate-bounce)}.skippr\\:animate-ping{animation:var(--skippr-animate-ping)}.skippr\\:animate-pulse{animation:var(--skippr-animate-pulse)}.skippr\\:animate-skippr-annotation-pulse{animation:1.8s ease-in-out infinite skippr-annotation-pulse}.skippr\\:animate-skippr-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-pointer{cursor:pointer}.skippr\\:resize-none{resize:none}.skippr\\:flex-col{flex-direction:column}.skippr\\:items-center{align-items:center}.skippr\\:items-end{align-items:flex-end}.skippr\\:items-start{align-items:flex-start}.skippr\\:justify-between{justify-content:space-between}.skippr\\:justify-center{justify-content:center}.skippr\\:justify-end{justify-content:flex-end}.skippr\\:gap-1{gap:calc(var(--skippr-spacing)*1)}.skippr\\:gap-1\\.5{gap:calc(var(--skippr-spacing)*1.5)}.skippr\\:gap-2{gap:calc(var(--skippr-spacing)*2)}.skippr\\:gap-2\\.5{gap:calc(var(--skippr-spacing)*2.5)}.skippr\\:gap-3{gap:calc(var(--skippr-spacing)*3)}.skippr\\:gap-\\[2px\\]{gap:2px}.skippr\\:gap-\\[3px\\]{gap:3px}:where(.skippr\\:space-y-0\\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*.5)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*.5)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}.skippr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.skippr\\:overflow-hidden{overflow:hidden}.skippr\\:overflow-y-auto{overflow-y:auto}.skippr\\:rounded-2xl{border-radius:1.125rem}.skippr\\:rounded-\\[1rem\\]{border-radius:1rem}.skippr\\:rounded-\\[10px\\]{border-radius:10px}.skippr\\:rounded-\\[14px\\]{border-radius:14px}.skippr\\:rounded-\\[16px\\]{border-radius:16px}.skippr\\:rounded-\\[20px\\]{border-radius:20px}.skippr\\:rounded-full{border-radius:3.40282e38px}.skippr\\:rounded-lg{border-radius:.625rem}.skippr\\:rounded-md{border-radius:.5rem}.skippr\\:rounded-sm{border-radius:.375rem}.skippr\\:rounded-xl{border-radius:.875rem}.skippr\\:border{border-style:var(--tw-border-style);border-width:1px}.skippr\\:border-0{border-style:var(--tw-border-style);border-width:0}.skippr\\:border-2{border-style:var(--tw-border-style);border-width:2px}.skippr\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.skippr\\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.skippr\\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.skippr\\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.skippr\\:border-border{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-cyan-400{border-color:var(--skippr-color-cyan-400)}.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-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-cyan-400{background-color:var(--skippr-color-cyan-400)}.skippr\\:bg-cyan-500{background-color:var(--skippr-color-cyan-500)}.skippr\\:bg-destructive{background-color:#d94f4f}.skippr\\:bg-emerald-400{background-color:var(--skippr-color-emerald-400)}.skippr\\:bg-emerald-500{background-color:var(--skippr-color-emerald-500)}.skippr\\:bg-foreground{background-color:oklch(14.7% .004 49.25)}.skippr\\:bg-launcher{background-color:#2d2d3f}.skippr\\:bg-muted{background-color:oklch(97% .001 106.424)}.skippr\\:bg-muted-foreground\\/20{background-color:oklab(55.3% .00687528 .0110332/.2)}.skippr\\:bg-muted-foreground\\/40{background-color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:bg-muted\\/50{background-color:oklab(97% -.000282743 .000959196/.5)}.skippr\\:bg-neutral-100{background-color:var(--skippr-color-neutral-100)}.skippr\\:bg-primary{background-color:#2d2b3d}.skippr\\:bg-primary-foreground\\/20{background-color:oklab(100% 0 5.96046e-8/.2)}.skippr\\:bg-primary\\/10{background-color:oklab(29.9244% .0107414 -.0305411/.1)}.skippr\\:bg-red-50{background-color:var(--skippr-color-red-50)}.skippr\\:bg-red-400{background-color:var(--skippr-color-red-400)}.skippr\\:bg-secondary{background-color:#ffdfb5}.skippr\\:bg-transparent{background-color:#0000}.skippr\\:bg-white{background-color:var(--skippr-color-white)}.skippr\\:fill-brand{fill:#2bc0ae}.skippr\\:fill-primary\\/30{fill:oklab(29.9244% .0107414 -.0305411/.3)}.skippr\\:stroke-black\\/15{stroke:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:stroke-black\\/15{stroke:color-mix(in oklab,var(--skippr-color-black)15%,transparent)}}.skippr\\:stroke-bubble{stroke:#2d2b3d}.skippr\\:p-2{padding:calc(var(--skippr-spacing)*2)}.skippr\\:p-3{padding:calc(var(--skippr-spacing)*3)}.skippr\\:p-4{padding:calc(var(--skippr-spacing)*4)}.skippr\\:px-1{padding-inline:calc(var(--skippr-spacing)*1)}.skippr\\:px-1\\.5{padding-inline:calc(var(--skippr-spacing)*1.5)}.skippr\\:px-2{padding-inline:calc(var(--skippr-spacing)*2)}.skippr\\:px-2\\.5{padding-inline:calc(var(--skippr-spacing)*2.5)}.skippr\\:px-3{padding-inline:calc(var(--skippr-spacing)*3)}.skippr\\:px-4{padding-inline:calc(var(--skippr-spacing)*4)}.skippr\\:px-6{padding-inline:calc(var(--skippr-spacing)*6)}.skippr\\:px-8{padding-inline:calc(var(--skippr-spacing)*8)}.skippr\\:py-0\\.5{padding-block:calc(var(--skippr-spacing)*.5)}.skippr\\:py-1{padding-block:calc(var(--skippr-spacing)*1)}.skippr\\:py-1\\.5{padding-block:calc(var(--skippr-spacing)*1.5)}.skippr\\:py-2{padding-block:calc(var(--skippr-spacing)*2)}.skippr\\:py-2\\.5{padding-block:calc(var(--skippr-spacing)*2.5)}.skippr\\:py-3{padding-block:calc(var(--skippr-spacing)*3)}.skippr\\:py-4{padding-block:calc(var(--skippr-spacing)*4)}.skippr\\:pt-3{padding-top:calc(var(--skippr-spacing)*3)}.skippr\\:pr-3{padding-right:calc(var(--skippr-spacing)*3)}.skippr\\:pb-1{padding-bottom:calc(var(--skippr-spacing)*1)}.skippr\\:pl-1\\.5{padding-left:calc(var(--skippr-spacing)*1.5)}.skippr\\:pl-3\\.5{padding-left:calc(var(--skippr-spacing)*3.5)}.skippr\\:text-center{text-align:center}.skippr\\:text-left{text-align:left}.skippr\\:font-mono{font-family:var(--skippr-font-mono)}.skippr\\:text-sm{font-size:var(--skippr-text-sm);line-height:var(--tw-leading,var(--skippr-text-sm--line-height))}.skippr\\:text-xs{font-size:var(--skippr-text-xs);line-height:var(--tw-leading,var(--skippr-text-xs--line-height))}.skippr\\:text-\\[10px\\]{font-size:10px}.skippr\\:text-\\[11px\\]{font-size:11px}.skippr\\:text-\\[13px\\]{font-size:13px}.skippr\\:leading-5{--tw-leading:calc(var(--skippr-spacing)*5);line-height:calc(var(--skippr-spacing)*5)}.skippr\\:leading-relaxed{--tw-leading:var(--skippr-leading-relaxed);line-height:var(--skippr-leading-relaxed)}.skippr\\:leading-tight{--tw-leading:var(--skippr-leading-tight);line-height:var(--skippr-leading-tight)}.skippr\\:font-medium{--tw-font-weight:var(--skippr-font-weight-medium);font-weight:var(--skippr-font-weight-medium)}.skippr\\:font-semibold{--tw-font-weight:var(--skippr-font-weight-semibold);font-weight:var(--skippr-font-weight-semibold)}.skippr\\:whitespace-nowrap{white-space:nowrap}.skippr\\:text-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-cyan-500{color:var(--skippr-color-cyan-500)}.skippr\\:text-cyan-900{color:var(--skippr-color-cyan-900)}.skippr\\:text-destructive{color:#d94f4f}.skippr\\:text-foreground{color:oklch(14.7% .004 49.25)}.skippr\\:text-muted-foreground{color:oklch(55.3% .013 58.071)}.skippr\\:text-muted-foreground\\/30{color:oklab(55.3% .00687528 .0110332/.3)}.skippr\\:text-muted-foreground\\/40{color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:text-muted-foreground\\/60{color:oklab(55.3% .00687528 .0110332/.6)}.skippr\\:text-muted-foreground\\/70{color:oklab(55.3% .00687528 .0110332/.7)}.skippr\\:text-neutral-700{color:var(--skippr-color-neutral-700)}.skippr\\:text-primary{color:#2d2b3d}.skippr\\:text-primary-foreground{color:#fff}.skippr\\:text-primary-foreground\\/70{color:oklab(100% 0 5.96046e-8/.7)}.skippr\\:text-red-400{color:var(--skippr-color-red-400)}.skippr\\:text-red-700{color:var(--skippr-color-red-700)}.skippr\\:text-secondary-foreground{color:#613700}.skippr\\:text-white{color:var(--skippr-color-white)}.skippr\\:line-through{text-decoration-line:line-through}.skippr\\:placeholder-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}.skippr\\:opacity-0{opacity:0}.skippr\\:opacity-40{opacity:.4}.skippr\\:opacity-75{opacity:.75}.skippr\\:opacity-100{opacity:1}.skippr\\:shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[-6px_6px_22px_rgba\\(0\\,0\\,0\\,0\\.3\\)\\]{--tw-shadow:-6px 6px 22px var(--tw-shadow-color,#0000004d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\]{--tw-shadow:0 4px 12px var(--tw-shadow-color,#0000001f);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 4px 12px 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_4px_14px_rgba\\(0\\,0\\,0\\,0\\.3\\)\\]{--tw-shadow:0 4px 14px var(--tw-shadow-color,#0000004d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_16px_rgba\\(45\\,43\\,61\\,0\\.45\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#2d2b3d73),0 2px 4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(45\\,43\\,61\\,0\\.35\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#2d2b3d59);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_30px_rgba\\(0\\,0\\,0\\,0\\.16\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\]{--tw-shadow:0 8px 30px var(--tw-shadow-color,#00000029),0 4px 12px var(--tw-shadow-color,#00000014);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_10px_32px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 10px 32px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-black\\/5{--tw-ring-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-black\\/5{--tw-ring-color:color-mix(in oklab,var(--skippr-color-black)5%,transparent)}}.skippr\\:ring-foreground\\/10{--tw-ring-color:oklab(14.7% .00261104 .00303026/.1)}.skippr\\:ring-offset-background{--tw-ring-offset-color:oklch(100% 0 0)}.skippr\\:drop-shadow-\\[0_1px_3px_rgba\\(0\\,0\\,0\\,0\\.35\\)\\]{--tw-drop-shadow-size:drop-shadow(0 1px 3px var(--tw-drop-shadow-color,#00000059));--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\\]{transition-property:opacity,transform;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[width\\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:duration-75{--tw-duration:75ms;transition-duration:75ms}.skippr\\:duration-150{--tw-duration:.15s;transition-duration:.15s}.skippr\\:duration-200{--tw-duration:.2s;transition-duration:.2s}.skippr\\:duration-300{--tw-duration:.3s;transition-duration:.3s}.skippr\\:ease-in-out{--tw-ease:var(--skippr-ease-in-out);transition-timing-function:var(--skippr-ease-in-out)}.skippr\\:ease-out{--tw-ease:var(--skippr-ease-out);transition-timing-function:var(--skippr-ease-out)}.skippr\\:outline-none{--tw-outline-style:none;outline-style:none}.skippr\\:\\[animation-delay\\:0ms\\]{animation-delay:0s}.skippr\\:\\[animation-delay\\:150ms\\]{animation-delay:.15s}.skippr\\:\\[animation-delay\\:200ms\\]{animation-delay:.2s}.skippr\\:\\[animation-delay\\:300ms\\]{animation-delay:.3s}.skippr\\:\\[animation-delay\\:400ms\\]{animation-delay:.4s}.skippr\\: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\\:opacity-100:is(:where(.skippr\\:group):hover *){opacity:1}}.skippr\\:placeholder\\:text-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}@media (hover:hover){.skippr\\:hover\\:-translate-y-0\\.5:hover{--tw-translate-y:calc(var(--skippr-spacing)*-.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:hover\\:scale-110:hover{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:hover\\:bg-\\[\\#3a384b\\]:hover{background-color:#3a384b}.skippr\\:hover\\:bg-accent:hover{background-color:#e7e5e4}.skippr\\:hover\\:bg-amber-100:hover{background-color:var(--skippr-color-amber-100)}.skippr\\:hover\\:bg-bubble:hover{background-color:#2d2b3d}.skippr\\:hover\\:bg-destructive\\/90:hover{background-color:oklab(61.4357% .15892 .0698893/.9)}.skippr\\:hover\\:bg-muted\\/70:hover{background-color:oklab(97% -.000282743 .000959196/.7)}.skippr\\:hover\\:bg-neutral-100:hover{background-color:var(--skippr-color-neutral-100)}.skippr\\:hover\\:bg-neutral-200:hover{background-color:var(--skippr-color-neutral-200)}.skippr\\:hover\\:bg-primary-foreground\\/10:hover{background-color:oklab(100% 0 5.96046e-8/.1)}.skippr\\:hover\\:bg-primary\\/90:hover{background-color:oklab(29.9244% .0107414 -.0305411/.9)}.skippr\\:hover\\:bg-secondary\\/80:hover{background-color:oklab(91.9963% .0175391 .0626889/.8)}.skippr\\:hover\\:text-accent-foreground:hover{color:oklch(21.6% .006 56.043)}.skippr\\:hover\\:text-foreground:hover{color:oklch(14.7% .004 49.25)}.skippr\\:hover\\:text-primary-foreground:hover{color:#fff}.skippr\\:hover\\:text-red-300:hover{color:var(--skippr-color-red-300)}.skippr\\:hover\\:text-white\\/80:hover{color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:hover\\:text-white\\/80:hover{color:color-mix(in oklab,var(--skippr-color-white)80%,transparent)}}.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\\:opacity-100:focus-visible{opacity:1}.skippr\\:focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:focus-visible\\:ring-bubble\\/60:focus-visible{--tw-ring-color:oklab(29.9244% .0107414 -.0305411/.6)}.skippr\\:focus-visible\\:ring-ring:focus-visible{--tw-ring-color:oklch(70.9% .01 56.259)}.skippr\\:focus-visible\\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.skippr\\:focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.skippr\\:active\\:translate-y-0:active{--tw-translate-y:calc(var(--skippr-spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.skippr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.skippr\\:disabled\\:opacity-50:disabled{opacity:.5}.skippr\\:disabled\\:opacity-60:disabled{opacity:.6}@media (prefers-reduced-motion:reduce){.skippr\\:motion-reduce\\:hidden{display:none}.skippr\\:motion-reduce\\:animate-none{animation:none}}.skippr\\:\\[\\&_svg\\]\\:pointer-events-none svg{pointer-events:none}.skippr\\:\\[\\&_svg\\]\\:shrink-0 svg{flex-shrink:0}.skippr\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 svg:not([class*=size-]){width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}}@keyframes skippr-tap{0%{transform:scale(1)}45%{transform:scale(.7)}to{transform:scale(1)}}@keyframes skippr-press{0%{transform:scale(1)}55%{transform:scale(1)}85%{transform:scale(.68)}to{transform:scale(1)}}@keyframes skippr-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 #22d3ee73}50%{box-shadow:0 0 0 10px #22d3ee00}}@keyframes skippr-speak-ripple{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(1.8)}}@keyframes skippr-bar{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}@keyframes skippr-breathe{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes skippr-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-wave{0%,to{opacity:.4;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-bubble-in{0%{opacity:0;transform:translateY(12px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-tip-in{0%{opacity:0;transform:translateY(14px)scale(.96)}60%{opacity:1;transform:translateY(-2px)scale(1.01)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-pill-content{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes skippr-banner-look{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}@keyframes skippr-toolset-pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes skippr-stage-fade{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes skippr-agent-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes skippr-orb-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.skippr-no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.skippr-no-scrollbar::-webkit-scrollbar{display:none}:host{color:var(--color-foreground)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}`;
3030
3236
  useLayoutEffect(() => {
3031
3237
  const host = hostRef.current;
3032
3238
  if (!host || !css)
@@ -3041,7 +3247,7 @@ function ShadowHost({ children }) {
3041
3247
  setShadowRoot(root);
3042
3248
  }, [css]);
3043
3249
  if (!css)
3044
- return /* @__PURE__ */ jsx8(Fragment3, {
3250
+ return /* @__PURE__ */ jsx8(Fragment, {
3045
3251
  children
3046
3252
  });
3047
3253
  return /* @__PURE__ */ jsx8("div", {
@@ -3051,14 +3257,14 @@ function ShadowHost({ children }) {
3051
3257
  }
3052
3258
 
3053
3259
  // src/components/Sidebar.tsx
3054
- import { useContext as useContext6, useEffect as useEffect19 } from "react";
3260
+ import { useContext as useContext8, useEffect as useEffect19 } from "react";
3055
3261
 
3056
3262
  // src/hooks/useCombinedMessages.ts
3057
- import { useContext as useContext4, useMemo as useMemo4 } from "react";
3263
+ import { useContext as useContext6, useMemo as useMemo5 } from "react";
3058
3264
 
3059
3265
  // src/hooks/useChatMessages.ts
3060
- import { useChat, useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react/hooks";
3061
- import { useMemo as useMemo2 } from "react";
3266
+ import { useChat, useLocalParticipant as useLocalParticipant5 } from "@livekit/components-react/hooks";
3267
+ import { useMemo as useMemo3 } from "react";
3062
3268
 
3063
3269
  // src/lib/filterSystemMessages.ts
3064
3270
  var SYSTEM_MESSAGE_PATTERN = /^\[\w+\]$/;
@@ -3069,9 +3275,9 @@ function filterSystemMessages(messages) {
3069
3275
  // src/hooks/useChatMessages.ts
3070
3276
  function useChatMessages() {
3071
3277
  const { chatMessages: rawMessages, send, isSending } = useChat();
3072
- const { localParticipant } = useLocalParticipant4();
3278
+ const { localParticipant } = useLocalParticipant5();
3073
3279
  const localIdentity = localParticipant.identity;
3074
- const chatMessages = useMemo2(() => {
3280
+ const chatMessages = useMemo3(() => {
3075
3281
  const sortedMessages = rawMessages.map((msg) => ({
3076
3282
  id: msg.id,
3077
3283
  role: msg.from?.identity === localIdentity ? "user" : "assistant",
@@ -3085,128 +3291,62 @@ function useChatMessages() {
3085
3291
  }
3086
3292
 
3087
3293
  // src/hooks/useStreamingTranscript.ts
3088
- import { useLocalParticipant as useLocalParticipant5, useTranscriptions } from "@livekit/components-react/hooks";
3089
- import { useMemo as useMemo3 } from "react";
3294
+ import { useLocalParticipant as useLocalParticipant6, useTranscriptions } from "@livekit/components-react/hooks";
3295
+ import { useMemo as useMemo4 } from "react";
3090
3296
  function useStreamingTranscript() {
3091
3297
  const transcriptions = useTranscriptions();
3092
- const { localParticipant } = useLocalParticipant5();
3298
+ const { localParticipant } = useLocalParticipant6();
3093
3299
  const localIdentity = localParticipant.identity;
3094
- const transcriptMessages = useMemo3(() => filterSystemMessages(transcriptions.filter((stream) => stream.text.trim().length > 0).map((stream) => ({
3300
+ const transcriptMessages = useMemo4(() => filterSystemMessages(transcriptions.filter((stream) => stream.text.trim().length > 0).map((stream) => ({
3095
3301
  id: stream.streamInfo.id,
3096
3302
  role: stream.participantInfo.identity === localIdentity ? "user" : "assistant",
3097
3303
  content: stream.text,
3098
- source: "voice-transcript",
3099
- timestamp: stream.streamInfo.timestamp
3100
- }))), [transcriptions, localIdentity]);
3101
- return { transcriptMessages };
3102
- }
3103
-
3104
- // src/hooks/useCombinedMessages.ts
3105
- function mergeChatsIntoTranscripts(transcripts, chats) {
3106
- const merged = [];
3107
- let chatIndex = 0;
3108
- for (const transcript of transcripts) {
3109
- while (chatIndex < chats.length && (chats[chatIndex].timestamp ?? 0) <= (transcript.timestamp ?? 0)) {
3110
- merged.push(chats[chatIndex]);
3111
- chatIndex++;
3112
- }
3113
- merged.push(transcript);
3114
- }
3115
- while (chatIndex < chats.length) {
3116
- merged.push(chats[chatIndex]);
3117
- chatIndex++;
3118
- }
3119
- return merged;
3120
- }
3121
- function useCombinedMessages() {
3122
- const { transcriptMessages } = useStreamingTranscript();
3123
- const { chatMessages, sendChatMessage, isSendingChat } = useChatMessages();
3124
- const { state: agentState } = useAgentVoiceState();
3125
- const historyMessages = useContext4(LiveAgentContext)?.historyMessages ?? [];
3126
- const liveMessages = useMemo4(() => {
3127
- if (chatMessages.length === 0)
3128
- return transcriptMessages;
3129
- if (transcriptMessages.length === 0)
3130
- return chatMessages;
3131
- return mergeChatsIntoTranscripts(transcriptMessages, chatMessages);
3132
- }, [transcriptMessages, chatMessages]);
3133
- const allMessages = useMemo4(() => {
3134
- if (historyMessages.length === 0)
3135
- return liveMessages;
3136
- const seenIds = new Set(liveMessages.map((message) => message.id));
3137
- return [...historyMessages.filter((message) => !seenIds.has(message.id)), ...liveMessages];
3138
- }, [historyMessages, liveMessages]);
3139
- return { allMessages, agentState, sendChatMessage, isSendingChat };
3140
- }
3141
-
3142
- // src/hooks/usePhaseUpdates.ts
3143
- import { useCallback as useCallback8, useContext as useContext5, useEffect as useEffect12 } from "react";
3144
-
3145
- // src/hooks/useAgentState.ts
3146
- import { useRemoteParticipants } from "@livekit/components-react/hooks";
3147
- import { useEffect as useEffect11, useState as useState9 } from "react";
3148
- function useAgentState(attributeKey, parse, initial) {
3149
- const [value, setValue] = useState9(initial);
3150
- const remoteParticipants = useRemoteParticipants();
3151
- useEffect11(() => {
3152
- const agentParticipant = remoteParticipants.find((p) => p.attributes?.[attributeKey]);
3153
- if (agentParticipant) {
3154
- const attr = agentParticipant.attributes?.[attributeKey];
3155
- if (attr) {
3156
- const parsed = parse(attr);
3157
- if (parsed)
3158
- setValue(parsed);
3159
- }
3160
- }
3161
- const handlers = new Map;
3162
- for (const p of remoteParticipants) {
3163
- const handler = (changedAttributes) => {
3164
- if (changedAttributes[attributeKey]) {
3165
- const parsed = parse(changedAttributes[attributeKey]);
3166
- if (parsed)
3167
- setValue(parsed);
3168
- } else if (p.attributes?.[attributeKey]) {
3169
- const parsed = parse(p.attributes[attributeKey]);
3170
- if (parsed)
3171
- setValue(parsed);
3172
- }
3173
- };
3174
- handlers.set(p, handler);
3175
- p.on("attributesChanged", handler);
3176
- }
3177
- return () => {
3178
- for (const [p, handler] of handlers) {
3179
- p.off("attributesChanged", handler);
3180
- }
3181
- };
3182
- }, [remoteParticipants, attributeKey, parse]);
3183
- return value;
3304
+ source: "voice-transcript",
3305
+ timestamp: stream.streamInfo.timestamp
3306
+ }))), [transcriptions, localIdentity]);
3307
+ return { transcriptMessages };
3184
3308
  }
3185
3309
 
3186
- // src/hooks/usePhaseUpdates.ts
3187
- function parsePhases(json) {
3188
- try {
3189
- const data = JSON.parse(json);
3190
- if (data.type === "phase_update" && Array.isArray(data.phases)) {
3191
- return data.phases;
3310
+ // src/hooks/useCombinedMessages.ts
3311
+ function mergeChatsIntoTranscripts(transcripts, chats) {
3312
+ const merged = [];
3313
+ let chatIndex = 0;
3314
+ for (const transcript of transcripts) {
3315
+ while (chatIndex < chats.length && (chats[chatIndex].timestamp ?? 0) <= (transcript.timestamp ?? 0)) {
3316
+ merged.push(chats[chatIndex]);
3317
+ chatIndex++;
3192
3318
  }
3193
- } catch {}
3194
- return null;
3319
+ merged.push(transcript);
3320
+ }
3321
+ while (chatIndex < chats.length) {
3322
+ merged.push(chats[chatIndex]);
3323
+ chatIndex++;
3324
+ }
3325
+ return merged;
3195
3326
  }
3196
- function usePhaseUpdates() {
3197
- const parse = useCallback8(parsePhases, []);
3198
- const livePhases = useAgentState("phases", parse, []);
3199
- const ctx = useContext5(LiveAgentContext);
3200
- useEffect12(() => {
3201
- if (livePhases.length > 0)
3202
- ctx?.setPhasesSnapshot(livePhases);
3203
- }, [livePhases, ctx?.setPhasesSnapshot]);
3204
- const phases = livePhases.length > 0 ? livePhases : ctx?.phasesSnapshot ?? [];
3205
- return { phases };
3327
+ function useCombinedMessages() {
3328
+ const { transcriptMessages } = useStreamingTranscript();
3329
+ const { chatMessages, sendChatMessage, isSendingChat } = useChatMessages();
3330
+ const { state: agentState } = useAgentVoiceState();
3331
+ const historyMessages = useContext6(LiveAgentContext)?.historyMessages ?? [];
3332
+ const liveMessages = useMemo5(() => {
3333
+ if (chatMessages.length === 0)
3334
+ return transcriptMessages;
3335
+ if (transcriptMessages.length === 0)
3336
+ return chatMessages;
3337
+ return mergeChatsIntoTranscripts(transcriptMessages, chatMessages);
3338
+ }, [transcriptMessages, chatMessages]);
3339
+ const allMessages = useMemo5(() => {
3340
+ if (historyMessages.length === 0)
3341
+ return liveMessages;
3342
+ const seenIds = new Set(liveMessages.map((message) => message.id));
3343
+ return [...historyMessages.filter((message) => !seenIds.has(message.id)), ...liveMessages];
3344
+ }, [historyMessages, liveMessages]);
3345
+ return { allMessages, agentState, sendChatMessage, isSendingChat };
3206
3346
  }
3207
3347
 
3208
3348
  // src/hooks/useSessionRemaining.ts
3209
- import { useEffect as useEffect13, useRef as useRef8, useState as useState10 } from "react";
3349
+ import { useEffect as useEffect14, useRef as useRef10, useState as useState12 } from "react";
3210
3350
 
3211
3351
  // src/lib/format.ts
3212
3352
  function formatTime(seconds) {
@@ -3222,9 +3362,9 @@ function parseNumber(s) {
3222
3362
  // src/hooks/useSessionRemaining.ts
3223
3363
  function useSessionRemaining() {
3224
3364
  const maxCallDuration = useAgentState("maxCallDuration", parseNumber, null);
3225
- const endTimeRef = useRef8(null);
3226
- const [remaining, setRemaining] = useState10(null);
3227
- useEffect13(() => {
3365
+ const endTimeRef = useRef10(null);
3366
+ const [remaining, setRemaining] = useState12(null);
3367
+ useEffect14(() => {
3228
3368
  if (maxCallDuration === null || endTimeRef.current !== null)
3229
3369
  return;
3230
3370
  const endTime = Date.now() + maxCallDuration * 1000;
@@ -3240,11 +3380,44 @@ function useSessionRemaining() {
3240
3380
  return remaining;
3241
3381
  }
3242
3382
 
3383
+ // src/hooks/useTextMode.ts
3384
+ import { useLocalParticipant as useLocalParticipant7 } from "@livekit/components-react/hooks";
3385
+ import { useCallback as useCallback9, useContext as useContext7, useRef as useRef11 } from "react";
3386
+ var textEncoder3 = new TextEncoder;
3387
+ function useTextMode() {
3388
+ const ctx = useContext7(LiveAgentContext);
3389
+ if (!ctx) {
3390
+ throw new Error("useTextMode must be used within a <LiveAgent> provider");
3391
+ }
3392
+ const { textMode, setTextModeState, sidebarTab, setSidebarTab } = ctx;
3393
+ const { localParticipant } = useLocalParticipant7();
3394
+ const confirmedTextModeRef = useRef11(false);
3395
+ const toggleTextMode = useCallback9(async () => {
3396
+ const next = !textMode;
3397
+ setTextModeState(next);
3398
+ if (next && sidebarTab === "agenda") {
3399
+ setSidebarTab("chat");
3400
+ }
3401
+ try {
3402
+ await localParticipant.publishData(textEncoder3.encode(JSON.stringify({ textMode: next })), {
3403
+ reliable: true,
3404
+ topic: TEXT_MODE_TOPIC
3405
+ });
3406
+ await localParticipant.setMicrophoneEnabled(!next);
3407
+ confirmedTextModeRef.current = next;
3408
+ } catch (error) {
3409
+ setTextModeState(confirmedTextModeRef.current);
3410
+ console.error("Failed to switch session mode:", error);
3411
+ }
3412
+ }, [textMode, setTextModeState, sidebarTab, setSidebarTab, localParticipant]);
3413
+ return { textMode, toggleTextMode };
3414
+ }
3415
+
3243
3416
  // src/hooks/useElapsedSeconds.ts
3244
- import { useEffect as useEffect14, useState as useState11 } from "react";
3417
+ import { useEffect as useEffect15, useState as useState13 } from "react";
3245
3418
  function useElapsedSeconds(isRunning) {
3246
- const [elapsed, setElapsed] = useState11(0);
3247
- useEffect14(() => {
3419
+ const [elapsed, setElapsed] = useState13(0);
3420
+ useEffect15(() => {
3248
3421
  if (!isRunning) {
3249
3422
  setElapsed(0);
3250
3423
  return;
@@ -3342,7 +3515,7 @@ function LoadingDots({ label }) {
3342
3515
  }
3343
3516
 
3344
3517
  // src/components/LoginFlow.tsx
3345
- import { useCallback as useCallback9, useEffect as useEffect15, useRef as useRef9, useState as useState12 } from "react";
3518
+ import { useCallback as useCallback10, useEffect as useEffect16, useRef as useRef12, useState as useState14 } from "react";
3346
3519
 
3347
3520
  // src/components/ui/button.tsx
3348
3521
  import { forwardRef as forwardRef3 } from "react";
@@ -3378,20 +3551,20 @@ import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
3378
3551
  var OTP_LENGTH = 6;
3379
3552
  var DIGIT_KEYS = ["d0", "d1", "d2", "d3", "d4", "d5"];
3380
3553
  function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
3381
- const [step, setStep] = useState12("email");
3382
- const [email, setEmail] = useState12("");
3383
- const handleRequestOtp = useCallback9(async (emailValue) => {
3554
+ const [step, setStep] = useState14("email");
3555
+ const [email, setEmail] = useState14("");
3556
+ const handleRequestOtp = useCallback10(async (emailValue) => {
3384
3557
  const success = await requestOtp(emailValue);
3385
3558
  if (success)
3386
3559
  setStep("otp");
3387
3560
  }, [requestOtp]);
3388
- const handleVerifyOtp = useCallback9(async (code) => {
3561
+ const handleVerifyOtp = useCallback10(async (code) => {
3389
3562
  await verifyOtp(email, code);
3390
3563
  }, [verifyOtp, email]);
3391
- const handleBack = useCallback9(() => {
3564
+ const handleBack = useCallback10(() => {
3392
3565
  setStep("email");
3393
3566
  }, []);
3394
- const handleResend = useCallback9(async () => {
3567
+ const handleResend = useCallback10(async () => {
3395
3568
  await requestOtp(email);
3396
3569
  }, [requestOtp, email]);
3397
3570
  if (step === "otp") {
@@ -3468,30 +3641,30 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
3468
3641
  });
3469
3642
  }
3470
3643
  function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
3471
- const [digits, setDigits] = useState12(Array(OTP_LENGTH).fill(""));
3472
- const [resendCooldown, setResendCooldown] = useState12(0);
3473
- const inputRefs = useRef9([]);
3474
- const submittedRef = useRef9(false);
3475
- useEffect15(() => {
3644
+ const [digits, setDigits] = useState14(Array(OTP_LENGTH).fill(""));
3645
+ const [resendCooldown, setResendCooldown] = useState14(0);
3646
+ const inputRefs = useRef12([]);
3647
+ const submittedRef = useRef12(false);
3648
+ useEffect16(() => {
3476
3649
  inputRefs.current[0]?.focus();
3477
3650
  }, []);
3478
- useEffect15(() => {
3651
+ useEffect16(() => {
3479
3652
  if (error)
3480
3653
  submittedRef.current = false;
3481
3654
  }, [error]);
3482
- useEffect15(() => {
3655
+ useEffect16(() => {
3483
3656
  if (resendCooldown <= 0)
3484
3657
  return;
3485
3658
  const timer = setTimeout(() => setResendCooldown((c) => c - 1), 1000);
3486
3659
  return () => clearTimeout(timer);
3487
3660
  }, [resendCooldown]);
3488
- const submitCode = useCallback9((code) => {
3661
+ const submitCode = useCallback10((code) => {
3489
3662
  if (submittedRef.current || isSubmitting)
3490
3663
  return;
3491
3664
  submittedRef.current = true;
3492
3665
  onSubmit(code);
3493
3666
  }, [onSubmit, isSubmitting]);
3494
- const handleDigitChange = useCallback9((index2, value) => {
3667
+ const handleDigitChange = useCallback10((index2, value) => {
3495
3668
  const digit = value.replace(/\D/g, "").slice(-1);
3496
3669
  const newDigits = [...digits];
3497
3670
  newDigits[index2] = digit;
@@ -3505,12 +3678,12 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
3505
3678
  submitCode(code);
3506
3679
  }
3507
3680
  }, [digits, submitCode]);
3508
- const handleKeyDown = useCallback9((index2, e) => {
3681
+ const handleKeyDown = useCallback10((index2, e) => {
3509
3682
  if (e.key === "Backspace" && !digits[index2] && index2 > 0) {
3510
3683
  inputRefs.current[index2 - 1]?.focus();
3511
3684
  }
3512
3685
  }, [digits]);
3513
- const handlePaste = useCallback9((e) => {
3686
+ const handlePaste = useCallback10((e) => {
3514
3687
  e.preventDefault();
3515
3688
  const pasted = e.clipboardData.getData("text").replace(/\D/g, "").slice(0, OTP_LENGTH);
3516
3689
  if (pasted.length > 0) {
@@ -3619,101 +3792,18 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
3619
3792
  });
3620
3793
  }
3621
3794
 
3622
- // src/components/MeetingControls.tsx
3623
- import { jsx as jsx13, jsxs as jsxs10, Fragment as Fragment4 } from "react/jsx-runtime";
3624
- var CONTROL_BUTTON2 = "skippr:flex skippr:size-11 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-full skippr:transition-colors skippr:disabled:cursor-not-allowed skippr:disabled:opacity-60";
3625
- var MUTED_BUTTON = "skippr:bg-muted skippr:text-foreground skippr:hover:bg-muted/80";
3626
- function MeetingControls({
3627
- onHangUp,
3628
- onPause,
3629
- onResume,
3630
- isPaused = false,
3631
- isPausing = false,
3632
- showScreenShareToggle = true
3633
- }) {
3634
- const { isMuted, toggleMute, isScreenSharing, toggleScreenShare } = useMediaControls();
3635
- const showPaused = isPaused || isPausing;
3636
- return /* @__PURE__ */ jsxs10("div", {
3637
- className: "skippr:shrink-0 skippr:border-t skippr:border-border skippr:bg-background skippr:px-4 skippr:py-4",
3638
- children: [
3639
- /* @__PURE__ */ jsxs10("div", {
3640
- className: "skippr:flex skippr:items-center skippr:justify-center skippr:gap-3",
3641
- children: [
3642
- !showPaused && /* @__PURE__ */ jsxs10(Fragment4, {
3643
- children: [
3644
- /* @__PURE__ */ jsx13("button", {
3645
- type: "button",
3646
- onClick: toggleMute,
3647
- "aria-label": isMuted ? "Unmute" : "Mute",
3648
- className: cn(CONTROL_BUTTON2, isMuted ? "skippr:bg-destructive/15 skippr:text-destructive skippr:hover:bg-destructive/25" : MUTED_BUTTON),
3649
- children: isMuted ? /* @__PURE__ */ jsx13(MicOff, {
3650
- className: "skippr:size-5"
3651
- }) : /* @__PURE__ */ jsx13(Mic, {
3652
- className: "skippr:size-5"
3653
- })
3654
- }),
3655
- showScreenShareToggle && /* @__PURE__ */ jsx13("button", {
3656
- type: "button",
3657
- onClick: toggleScreenShare,
3658
- "aria-label": isScreenSharing ? "Stop sharing screen" : "Share screen",
3659
- className: cn(CONTROL_BUTTON2, isScreenSharing ? "skippr:bg-bubble skippr:text-white skippr:hover:brightness-110" : MUTED_BUTTON),
3660
- children: isScreenSharing ? /* @__PURE__ */ jsx13(MonitorOff, {
3661
- className: "skippr:size-5"
3662
- }) : /* @__PURE__ */ jsx13(Monitor, {
3663
- className: "skippr:size-5"
3664
- })
3665
- })
3666
- ]
3667
- }),
3668
- showPaused ? onResume && /* @__PURE__ */ jsx13("button", {
3669
- type: "button",
3670
- onClick: onResume,
3671
- disabled: isPausing,
3672
- "aria-label": "Resume session",
3673
- className: cn(CONTROL_BUTTON2, MUTED_BUTTON),
3674
- children: /* @__PURE__ */ jsx13(Play, {
3675
- className: "skippr:size-5"
3676
- })
3677
- }) : onPause && /* @__PURE__ */ jsx13("button", {
3678
- type: "button",
3679
- onClick: onPause,
3680
- "aria-label": "Pause session",
3681
- className: cn(CONTROL_BUTTON2, MUTED_BUTTON),
3682
- children: /* @__PURE__ */ jsx13(Pause, {
3683
- className: "skippr:size-5"
3684
- })
3685
- }),
3686
- /* @__PURE__ */ jsx13("button", {
3687
- type: "button",
3688
- onClick: onHangUp,
3689
- "aria-label": "End session",
3690
- className: cn(CONTROL_BUTTON2, "skippr:bg-destructive skippr:text-destructive-foreground skippr:hover:bg-destructive/90"),
3691
- children: /* @__PURE__ */ jsx13(PhoneOff, {
3692
- className: "skippr:size-5"
3693
- })
3694
- })
3695
- ]
3696
- }),
3697
- /* @__PURE__ */ jsx13("p", {
3698
- className: "skippr:mt-3 skippr:text-center skippr:text-[10px] skippr:text-muted-foreground",
3699
- children: "Powered by Skippr"
3700
- })
3701
- ]
3702
- });
3703
- }
3704
-
3705
3795
  // src/components/MessageList.tsx
3706
- import { useEffect as useEffect17, useRef as useRef11 } from "react";
3796
+ import { useEffect as useEffect18, useRef as useRef14 } from "react";
3707
3797
 
3708
3798
  // src/components/ChatInput.tsx
3709
- import { useEffect as useEffect16, useRef as useRef10, useState as useState13 } from "react";
3710
- import { jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
3799
+ import { useEffect as useEffect17, useRef as useRef13, useState as useState15 } from "react";
3800
+ import { jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
3711
3801
  var MAX_INPUT_HEIGHT = 60;
3712
3802
  function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
3713
- const [inputText, setInputText] = useState13("");
3714
- const textareaRef = useRef10(null);
3803
+ const [inputText, setInputText] = useState15("");
3804
+ const textareaRef = useRef13(null);
3715
3805
  const canSend = inputText.trim().length > 0 && !isSendingChat;
3716
- useEffect16(() => {
3806
+ useEffect17(() => {
3717
3807
  if (autoFocus)
3718
3808
  textareaRef.current?.focus();
3719
3809
  }, [autoFocus]);
@@ -3744,13 +3834,13 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
3744
3834
  handleSubmit(e);
3745
3835
  }
3746
3836
  }
3747
- return /* @__PURE__ */ jsx14("form", {
3837
+ return /* @__PURE__ */ jsx13("form", {
3748
3838
  onSubmit: handleSubmit,
3749
3839
  className: "skippr:border-t skippr:border-border skippr:p-3",
3750
- children: /* @__PURE__ */ jsxs11("div", {
3840
+ children: /* @__PURE__ */ jsxs10("div", {
3751
3841
  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",
3752
3842
  children: [
3753
- /* @__PURE__ */ jsx14("textarea", {
3843
+ /* @__PURE__ */ jsx13("textarea", {
3754
3844
  ref: textareaRef,
3755
3845
  rows: 1,
3756
3846
  value: inputText,
@@ -3760,12 +3850,12 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
3760
3850
  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",
3761
3851
  style: { maxHeight: `${MAX_INPUT_HEIGHT}px` }
3762
3852
  }),
3763
- /* @__PURE__ */ jsx14("button", {
3853
+ /* @__PURE__ */ jsx13("button", {
3764
3854
  type: "submit",
3765
3855
  disabled: !canSend,
3766
3856
  "aria-label": "Send message",
3767
3857
  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"),
3768
- children: /* @__PURE__ */ jsx14(Send, {
3858
+ children: /* @__PURE__ */ jsx13(Send, {
3769
3859
  className: "skippr:size-3.5"
3770
3860
  })
3771
3861
  })
@@ -3775,7 +3865,7 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
3775
3865
  }
3776
3866
 
3777
3867
  // src/components/ChatMessage.tsx
3778
- import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
3868
+ import { jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
3779
3869
  function formatTimestamp(ts) {
3780
3870
  return new Date(ts).toLocaleTimeString("en-US", {
3781
3871
  hour: "numeric",
@@ -3785,23 +3875,23 @@ function formatTimestamp(ts) {
3785
3875
  }
3786
3876
  function ChatMessage({ message }) {
3787
3877
  const isAgent = message.role === "assistant";
3788
- return /* @__PURE__ */ jsxs12("div", {
3878
+ return /* @__PURE__ */ jsxs11("div", {
3789
3879
  className: cn("skippr:flex skippr:gap-2", isAgent ? "skippr:items-start" : "skippr:justify-end"),
3790
3880
  children: [
3791
- isAgent && /* @__PURE__ */ jsx15("div", {
3881
+ isAgent && /* @__PURE__ */ jsx14("div", {
3792
3882
  className: "skippr:mt-0.5 skippr:flex skippr:size-7 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-md skippr:bg-primary",
3793
- children: /* @__PURE__ */ jsx15(Sparkles, {
3883
+ children: /* @__PURE__ */ jsx14(Sparkles, {
3794
3884
  className: "skippr:size-3.5 skippr:text-primary-foreground"
3795
3885
  })
3796
3886
  }),
3797
- /* @__PURE__ */ jsxs12("div", {
3887
+ /* @__PURE__ */ jsxs11("div", {
3798
3888
  className: cn("skippr:flex skippr:max-w-[80%] skippr:flex-col", isAgent ? "skippr:items-start" : "skippr:items-end"),
3799
3889
  children: [
3800
- /* @__PURE__ */ jsx15("div", {
3890
+ /* @__PURE__ */ jsx14("div", {
3801
3891
  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"),
3802
3892
  children: message.content
3803
3893
  }),
3804
- message.timestamp && /* @__PURE__ */ jsx15("span", {
3894
+ message.timestamp && /* @__PURE__ */ jsx14("span", {
3805
3895
  className: "skippr:mt-1 skippr:px-1 skippr:text-[10px] skippr:text-muted-foreground/60",
3806
3896
  children: formatTimestamp(message.timestamp)
3807
3897
  })
@@ -3812,33 +3902,33 @@ function ChatMessage({ message }) {
3812
3902
  }
3813
3903
 
3814
3904
  // src/components/TypingIndicator.tsx
3815
- import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
3905
+ import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
3816
3906
  function TypingIndicator() {
3817
- return /* @__PURE__ */ jsxs13("div", {
3907
+ return /* @__PURE__ */ jsxs12("div", {
3818
3908
  className: "skippr:flex skippr:items-start skippr:gap-2 skippr:animate-skippr-tab-fade",
3819
3909
  children: [
3820
- /* @__PURE__ */ jsx16("div", {
3910
+ /* @__PURE__ */ jsx15("div", {
3821
3911
  className: "skippr:mt-0.5 skippr:flex skippr:size-7 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-md skippr:bg-primary",
3822
- children: /* @__PURE__ */ jsx16(Sparkles, {
3912
+ children: /* @__PURE__ */ jsx15(Sparkles, {
3823
3913
  className: "skippr:size-3.5 skippr:text-primary-foreground"
3824
3914
  })
3825
3915
  }),
3826
- /* @__PURE__ */ jsxs13("div", {
3916
+ /* @__PURE__ */ jsxs12("div", {
3827
3917
  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",
3828
3918
  children: [
3829
- /* @__PURE__ */ jsx16("span", {
3919
+ /* @__PURE__ */ jsx15("span", {
3830
3920
  children: "Agent is analyzing your screen"
3831
3921
  }),
3832
- /* @__PURE__ */ jsxs13("span", {
3922
+ /* @__PURE__ */ jsxs12("span", {
3833
3923
  className: "skippr:inline-flex skippr:items-center skippr:gap-[2px]",
3834
3924
  children: [
3835
- /* @__PURE__ */ jsx16("span", {
3925
+ /* @__PURE__ */ jsx15("span", {
3836
3926
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:0ms]"
3837
3927
  }),
3838
- /* @__PURE__ */ jsx16("span", {
3928
+ /* @__PURE__ */ jsx15("span", {
3839
3929
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:200ms]"
3840
3930
  }),
3841
- /* @__PURE__ */ jsx16("span", {
3931
+ /* @__PURE__ */ jsx15("span", {
3842
3932
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:400ms]"
3843
3933
  })
3844
3934
  ]
@@ -3850,7 +3940,7 @@ function TypingIndicator() {
3850
3940
  }
3851
3941
 
3852
3942
  // src/components/MessageList.tsx
3853
- import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
3943
+ import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
3854
3944
  function MessageList({
3855
3945
  messages,
3856
3946
  isStreaming,
@@ -3858,31 +3948,31 @@ function MessageList({
3858
3948
  isSendingChat,
3859
3949
  autoFocus = false
3860
3950
  }) {
3861
- const scrollRef = useRef11(null);
3951
+ const scrollRef = useRef14(null);
3862
3952
  const lastMessage = messages.length > 0 ? messages[messages.length - 1] : undefined;
3863
- useEffect17(() => {
3953
+ useEffect18(() => {
3864
3954
  scrollRef.current?.scrollIntoView({ behavior: "smooth" });
3865
3955
  }, [messages.length, lastMessage?.content]);
3866
3956
  const showTyping = isStreaming && lastMessage?.role === "assistant" && lastMessage.content === "";
3867
- return /* @__PURE__ */ jsxs14("div", {
3957
+ return /* @__PURE__ */ jsxs13("div", {
3868
3958
  className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
3869
3959
  children: [
3870
- /* @__PURE__ */ jsxs14("div", {
3960
+ /* @__PURE__ */ jsxs13("div", {
3871
3961
  className: "skippr:min-h-0 skippr:flex-1 skippr:space-y-4 skippr:overflow-y-auto skippr:p-4",
3872
3962
  children: [
3873
- messages.length === 0 && !showTyping && /* @__PURE__ */ jsx17(LoadingDots, {
3963
+ messages.length === 0 && !showTyping && /* @__PURE__ */ jsx16(LoadingDots, {
3874
3964
  label: "Waiting for conversation to begin..."
3875
3965
  }),
3876
- messages.map((message) => /* @__PURE__ */ jsx17(ChatMessage, {
3966
+ messages.map((message) => /* @__PURE__ */ jsx16(ChatMessage, {
3877
3967
  message
3878
3968
  }, message.id)),
3879
- showTyping && /* @__PURE__ */ jsx17(TypingIndicator, {}),
3880
- /* @__PURE__ */ jsx17("div", {
3969
+ showTyping && /* @__PURE__ */ jsx16(TypingIndicator, {}),
3970
+ /* @__PURE__ */ jsx16("div", {
3881
3971
  ref: scrollRef
3882
3972
  })
3883
3973
  ]
3884
3974
  }),
3885
- /* @__PURE__ */ jsx17(ChatInput, {
3975
+ /* @__PURE__ */ jsx16(ChatInput, {
3886
3976
  sendChatMessage,
3887
3977
  isSendingChat,
3888
3978
  autoFocus
@@ -3891,239 +3981,50 @@ function MessageList({
3891
3981
  });
3892
3982
  }
3893
3983
 
3894
- // src/components/ModuleSelector.tsx
3895
- import { useEffect as useEffect18, useRef as useRef12, useState as useState14 } from "react";
3896
- import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
3897
- var AGENT_TYPE_ICONS = {
3898
- onboarding: UserPlus,
3899
- demo: Rocket,
3900
- training: GraduationCap,
3901
- support: Headset
3902
- };
3903
- function getAgentIcon(type) {
3904
- return AGENT_TYPE_ICONS[type] ?? Bot;
3905
- }
3906
- function ModuleSelector() {
3907
- const {
3908
- availableModules,
3909
- isLoadingModules,
3910
- modulesError,
3911
- refetchModules,
3912
- selectModule,
3913
- isStarting,
3914
- isDisconnecting,
3915
- error
3916
- } = useLiveAgent();
3917
- const isBusy = isStarting || isDisconnecting;
3918
- const scrollRef = useRef12(null);
3919
- const [showScrollHint, setShowScrollHint] = useState14(false);
3920
- const [isScrolled, setIsScrolled] = useState14(false);
3921
- useEffect18(() => {
3922
- const el = scrollRef.current;
3923
- if (!el)
3924
- return;
3925
- function update() {
3926
- if (!el)
3927
- return;
3928
- const overflows = el.scrollHeight > el.clientHeight + 1;
3929
- const atBottom = el.scrollHeight - el.scrollTop - el.clientHeight < 4;
3930
- setShowScrollHint(overflows && !atBottom);
3931
- setIsScrolled(el.scrollTop > 0);
3932
- }
3933
- update();
3934
- el.addEventListener("scroll", update, { passive: true });
3935
- const observer = new ResizeObserver(update);
3936
- observer.observe(el);
3937
- return () => {
3938
- el.removeEventListener("scroll", update);
3939
- observer.disconnect();
3940
- };
3941
- }, []);
3942
- if (isLoadingModules && availableModules.length === 0) {
3943
- return /* @__PURE__ */ jsx18("div", {
3944
- className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center skippr:p-6",
3945
- children: /* @__PURE__ */ jsx18(LoadingDots, {
3946
- label: "Loading modules..."
3947
- })
3948
- });
3949
- }
3950
- if (modulesError) {
3951
- return /* @__PURE__ */ jsxs15("div", {
3952
- className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:p-6 skippr:text-center",
3953
- children: [
3954
- /* @__PURE__ */ jsx18("p", {
3955
- className: "skippr:text-sm skippr:text-foreground",
3956
- children: "Couldn't load modules."
3957
- }),
3958
- /* @__PURE__ */ jsx18("p", {
3959
- className: "skippr:text-xs skippr:text-muted-foreground",
3960
- children: modulesError
3961
- }),
3962
- /* @__PURE__ */ jsx18("button", {
3963
- type: "button",
3964
- onClick: () => void refetchModules(),
3965
- className: "skippr:cursor-pointer skippr:rounded-lg skippr:bg-foreground skippr:px-3 skippr:py-1.5 skippr:text-xs skippr:font-medium skippr:text-background",
3966
- children: "Try again"
3967
- })
3968
- ]
3969
- });
3970
- }
3971
- if (availableModules.length === 0) {
3972
- return /* @__PURE__ */ jsx18("div", {
3973
- className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center skippr:p-6 skippr:text-center",
3974
- children: /* @__PURE__ */ jsx18("p", {
3975
- className: "skippr:text-sm skippr:text-muted-foreground",
3976
- children: "No experts available."
3977
- })
3978
- });
3979
- }
3980
- return /* @__PURE__ */ jsxs15("div", {
3981
- className: "skippr:relative skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
3982
- children: [
3983
- /* @__PURE__ */ jsxs15("div", {
3984
- ref: scrollRef,
3985
- className: "skippr-no-scrollbar skippr:flex-1 skippr:overflow-y-auto",
3986
- children: [
3987
- /* @__PURE__ */ jsx18("h3", {
3988
- className: `skippr:sticky skippr:top-0 skippr:z-10 skippr:bg-background skippr:px-4 skippr:py-3 skippr:text-xs skippr:font-medium skippr:uppercase skippr:tracking-wider skippr:text-muted-foreground skippr:transition-shadow ${isScrolled ? "skippr:border-b skippr:border-border" : ""}`,
3989
- children: "Choose an agent"
3990
- }),
3991
- /* @__PURE__ */ jsxs15("div", {
3992
- className: "skippr:px-4 skippr:pt-3 skippr:pb-5",
3993
- children: [
3994
- error && /* @__PURE__ */ jsx18("div", {
3995
- role: "alert",
3996
- className: "skippr:mb-3 skippr:rounded-lg skippr:border skippr:border-destructive/20 skippr:bg-destructive/10 skippr:px-3 skippr:py-2 skippr:text-xs skippr:text-destructive",
3997
- children: error
3998
- }),
3999
- /* @__PURE__ */ jsx18("div", {
4000
- className: "skippr:grid skippr:grid-cols-2 skippr:gap-2.5",
4001
- children: availableModules.map((module, index2) => {
4002
- const isFeatured = index2 === 0;
4003
- const isWide = index2 === availableModules.length - 1 && availableModules.length % 2 === 1;
4004
- const Icon2 = getAgentIcon(module.type);
4005
- const sessionState = getModuleSessionState(module.currentSession, module.mode);
4006
- const isTerminal = sessionState === "completed" || sessionState === "expired";
4007
- const base = "skippr:group skippr:flex skippr:cursor-pointer skippr:gap-3 skippr:rounded-xl skippr:text-left skippr:transition-colors skippr:disabled:cursor-not-allowed skippr:disabled:opacity-50";
4008
- const layout = isWide ? "skippr:items-center skippr:p-3.5 skippr:pb-5" : "skippr:flex-col skippr:items-start skippr:p-3.5";
4009
- const variant = isFeatured ? "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90" : "skippr:bg-background skippr:ring-1 skippr:ring-foreground/10 skippr:hover:bg-muted/50";
4010
- const span = isWide ? "skippr:col-span-2" : "";
4011
- return /* @__PURE__ */ jsxs15("button", {
4012
- type: "button",
4013
- disabled: isBusy || isTerminal,
4014
- onClick: () => selectModule(module.id),
4015
- className: `${base} ${layout} ${variant} ${span}`,
4016
- children: [
4017
- /* @__PURE__ */ jsx18("div", {
4018
- className: isFeatured ? "skippr:flex skippr:h-9 skippr:w-9 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-lg skippr:bg-primary-foreground/15" : "skippr:flex skippr:h-9 skippr:w-9 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-lg skippr:bg-muted",
4019
- children: /* @__PURE__ */ jsx18(Icon2, {
4020
- className: isFeatured ? "skippr:h-4 skippr:w-4" : "skippr:h-4 skippr:w-4 skippr:text-muted-foreground"
4021
- })
4022
- }),
4023
- /* @__PURE__ */ jsxs15("div", {
4024
- className: "skippr:min-w-0 skippr:w-full skippr:space-y-0.5",
4025
- children: [
4026
- /* @__PURE__ */ jsxs15("div", {
4027
- className: "skippr:flex skippr:items-center skippr:gap-1.5",
4028
- children: [
4029
- /* @__PURE__ */ jsx18("p", {
4030
- className: "skippr:line-clamp-1 skippr:text-sm skippr:font-semibold",
4031
- children: module.name
4032
- }),
4033
- sessionState === "resume" && /* @__PURE__ */ jsxs15("span", {
4034
- className: `skippr:inline-flex skippr:shrink-0 skippr:items-center skippr:gap-0.5 skippr:rounded-full skippr:px-1.5 skippr:py-0.5 skippr:text-[9px] skippr:font-medium skippr:uppercase skippr:tracking-wide ${isFeatured ? "skippr:bg-primary-foreground/20 skippr:text-primary-foreground" : "skippr:bg-bubble/15 skippr:text-bubble"}`,
4035
- children: [
4036
- /* @__PURE__ */ jsx18(Play, {
4037
- className: "skippr:size-2.5"
4038
- }),
4039
- "Resume"
4040
- ]
4041
- }),
4042
- sessionState === "completed" && /* @__PURE__ */ jsxs15("span", {
4043
- className: "skippr:inline-flex skippr:shrink-0 skippr:items-center skippr:gap-0.5 skippr:rounded-full skippr:bg-muted skippr:px-1.5 skippr:py-0.5 skippr:text-[9px] skippr:font-medium skippr:uppercase skippr:tracking-wide skippr:text-muted-foreground",
4044
- children: [
4045
- /* @__PURE__ */ jsx18(CircleCheck, {
4046
- className: "skippr:size-2.5"
4047
- }),
4048
- "Completed"
4049
- ]
4050
- }),
4051
- sessionState === "expired" && /* @__PURE__ */ jsxs15("span", {
4052
- className: "skippr:inline-flex skippr:shrink-0 skippr:items-center skippr:gap-0.5 skippr:rounded-full skippr:bg-muted skippr:px-1.5 skippr:py-0.5 skippr:text-[9px] skippr:font-medium skippr:uppercase skippr:tracking-wide skippr:text-muted-foreground",
4053
- children: [
4054
- /* @__PURE__ */ jsx18(Clock, {
4055
- className: "skippr:size-2.5"
4056
- }),
4057
- "Expired"
4058
- ]
4059
- })
4060
- ]
4061
- }),
4062
- module.description && /* @__PURE__ */ jsx18("p", {
4063
- className: isFeatured ? "skippr:line-clamp-2 skippr:text-[11px] skippr:leading-snug skippr:text-primary-foreground/70" : "skippr:line-clamp-2 skippr:text-[11px] skippr:leading-snug skippr:text-muted-foreground",
4064
- children: module.description
4065
- })
4066
- ]
4067
- })
4068
- ]
4069
- }, module.id);
4070
- })
4071
- })
4072
- ]
4073
- })
4074
- ]
4075
- }),
4076
- showScrollHint && /* @__PURE__ */ jsx18("div", {
4077
- className: "skippr:pointer-events-none skippr:absolute skippr:bottom-0 skippr:left-0 skippr:right-0 skippr:h-12 skippr:bg-gradient-to-t skippr:from-background skippr:to-transparent"
4078
- })
4079
- ]
4080
- });
4081
- }
4082
-
4083
3984
  // src/components/SessionAgenda.tsx
4084
- import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
3985
+ import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
4085
3986
  function SessionAgenda({ phases, hasStarted }) {
4086
3987
  if (phases.length === 0 || !hasStarted) {
4087
- return /* @__PURE__ */ jsx19("div", {
3988
+ return /* @__PURE__ */ jsx17("div", {
4088
3989
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
4089
- children: /* @__PURE__ */ jsx19(LoadingDots, {
3990
+ children: /* @__PURE__ */ jsx17(LoadingDots, {
4090
3991
  label: "Waiting for agenda to load..."
4091
3992
  })
4092
3993
  });
4093
3994
  }
4094
- return /* @__PURE__ */ jsx19("div", {
3995
+ return /* @__PURE__ */ jsx17("div", {
4095
3996
  className: "skippr:flex-1 skippr:overflow-y-auto skippr:px-4 skippr:py-4",
4096
- children: /* @__PURE__ */ jsx19("div", {
3997
+ children: /* @__PURE__ */ jsx17("div", {
4097
3998
  className: "skippr:space-y-1",
4098
3999
  children: phases.map((phase) => {
4099
4000
  const isActive = phase.status === "active";
4100
4001
  const isCompleted = phase.status === "completed";
4101
- return /* @__PURE__ */ jsxs16("div", {
4002
+ return /* @__PURE__ */ jsxs14("div", {
4102
4003
  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"),
4103
4004
  children: [
4104
- /* @__PURE__ */ jsx19("div", {
4005
+ /* @__PURE__ */ jsx17("div", {
4105
4006
  className: "skippr:mt-0.5",
4106
- children: isCompleted ? /* @__PURE__ */ jsx19(CircleCheck, {
4007
+ children: isCompleted ? /* @__PURE__ */ jsx17(CircleCheck, {
4107
4008
  className: "skippr:size-4 skippr:text-chart-3"
4108
- }) : isActive ? /* @__PURE__ */ jsx19(Circle, {
4009
+ }) : isActive ? /* @__PURE__ */ jsx17(Circle, {
4109
4010
  className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
4110
- }) : /* @__PURE__ */ jsx19(Circle, {
4011
+ }) : /* @__PURE__ */ jsx17(Circle, {
4111
4012
  className: "skippr:size-4 skippr:text-muted-foreground/30"
4112
4013
  })
4113
4014
  }),
4114
- /* @__PURE__ */ jsxs16("div", {
4015
+ /* @__PURE__ */ jsxs14("div", {
4115
4016
  className: "skippr:min-w-0 skippr:flex-1",
4116
4017
  children: [
4117
- /* @__PURE__ */ jsx19("p", {
4018
+ /* @__PURE__ */ jsx17("p", {
4118
4019
  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"),
4119
4020
  children: phase.name
4120
4021
  }),
4121
- phase.highlights.length > 0 && /* @__PURE__ */ jsx19("ul", {
4022
+ phase.highlights.length > 0 && /* @__PURE__ */ jsx17("ul", {
4122
4023
  className: "skippr:mt-1 skippr:space-y-0.5",
4123
- children: phase.highlights.map((text) => /* @__PURE__ */ jsxs16("li", {
4024
+ children: phase.highlights.map((text) => /* @__PURE__ */ jsxs14("li", {
4124
4025
  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"),
4125
4026
  children: [
4126
- /* @__PURE__ */ jsx19("span", {
4027
+ /* @__PURE__ */ jsx17("span", {
4127
4028
  className: "skippr:size-1 skippr:shrink-0 skippr:rounded-full skippr:bg-current"
4128
4029
  }),
4129
4030
  text
@@ -4140,12 +4041,12 @@ function SessionAgenda({ phases, hasStarted }) {
4140
4041
  }
4141
4042
 
4142
4043
  // src/components/SessionWarningBanner.tsx
4143
- import { jsx as jsx20 } from "react/jsx-runtime";
4044
+ import { jsx as jsx18 } from "react/jsx-runtime";
4144
4045
  var SESSION_WARNING_THRESHOLD_SECS = 60;
4145
4046
  function SessionWarningBanner({ remaining }) {
4146
4047
  if (remaining === null || remaining <= 0 || remaining > SESSION_WARNING_THRESHOLD_SECS)
4147
4048
  return null;
4148
- return /* @__PURE__ */ jsx20("div", {
4049
+ return /* @__PURE__ */ jsx18("div", {
4149
4050
  "data-testid": "session-warning-banner",
4150
4051
  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",
4151
4052
  children: "Session ending soon"
@@ -4153,7 +4054,7 @@ function SessionWarningBanner({ remaining }) {
4153
4054
  }
4154
4055
 
4155
4056
  // src/components/StartSessionPrompt.tsx
4156
- import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
4057
+ import { jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
4157
4058
  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";
4158
4059
  function StartSessionPrompt({
4159
4060
  onStartSession,
@@ -4165,16 +4066,16 @@ function StartSessionPrompt({
4165
4066
  canResume = false,
4166
4067
  onResume
4167
4068
  }) {
4168
- return /* @__PURE__ */ jsxs17("div", {
4069
+ return /* @__PURE__ */ jsxs15("div", {
4169
4070
  className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:px-4",
4170
4071
  children: [
4171
- canResume && onResume ? /* @__PURE__ */ jsx21("button", {
4072
+ canResume && onResume ? /* @__PURE__ */ jsx19("button", {
4172
4073
  type: "button",
4173
4074
  onClick: onResume,
4174
4075
  disabled: isStarting,
4175
4076
  className: PROMPT_BUTTON,
4176
4077
  children: isStarting ? "Resuming..." : "Resume session"
4177
- }) : /* @__PURE__ */ jsx21("button", {
4078
+ }) : /* @__PURE__ */ jsx19("button", {
4178
4079
  type: "button",
4179
4080
  onClick: () => {
4180
4081
  if (!agentId)
@@ -4185,7 +4086,7 @@ function StartSessionPrompt({
4185
4086
  className: PROMPT_BUTTON,
4186
4087
  children: isStarting ? "Starting..." : label
4187
4088
  }),
4188
- error && /* @__PURE__ */ jsx21("p", {
4089
+ error && /* @__PURE__ */ jsx19("p", {
4189
4090
  className: "skippr:text-xs skippr:text-destructive",
4190
4091
  children: error
4191
4092
  })
@@ -4194,7 +4095,7 @@ function StartSessionPrompt({
4194
4095
  }
4195
4096
 
4196
4097
  // src/components/Sidebar.tsx
4197
- import { jsx as jsx22, jsxs as jsxs18, Fragment as Fragment5 } from "react/jsx-runtime";
4098
+ import { jsx as jsx20, jsxs as jsxs16, Fragment as Fragment2 } from "react/jsx-runtime";
4198
4099
  function Sidebar({
4199
4100
  hideControls = false,
4200
4101
  hideHeader = false,
@@ -4209,10 +4110,8 @@ function Sidebar({
4209
4110
  isPaused,
4210
4111
  error,
4211
4112
  startSession,
4212
- pauseSession,
4213
4113
  resumeSession,
4214
4114
  resumableSession,
4215
- disconnect,
4216
4115
  isPanelOpen,
4217
4116
  position,
4218
4117
  isAuthenticated,
@@ -4224,13 +4123,11 @@ function Sidebar({
4224
4123
  sidebarTab: activeTab,
4225
4124
  setSidebarTab: setActiveTab,
4226
4125
  autoFocusChat,
4227
- captureMode,
4228
- hasModuleSelector,
4229
4126
  agentId,
4230
4127
  agentMode,
4231
4128
  agentControls
4232
4129
  } = useLiveAgent();
4233
- const internalCtx = useContext6(LiveAgentContext);
4130
+ const internalCtx = useContext8(LiveAgentContext);
4234
4131
  const usesHostAuth = internalCtx?.usesHostAuth ?? false;
4235
4132
  const authFailed = internalCtx?.authFailed ?? false;
4236
4133
  const showAgenda = agentMode !== AGENT_MODE.AlwaysOn;
@@ -4250,21 +4147,19 @@ function Sidebar({
4250
4147
  document.body.style.transition = "";
4251
4148
  };
4252
4149
  }, [isSidebar, isPanelOpen, position]);
4253
- return /* @__PURE__ */ jsxs18("div", {
4254
- 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:bottom-[88px] skippr:h-[min(460px,calc(100vh-200px))] 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] skippr:duration-300 skippr:ease-in-out", isFloating && (position === "right" ? "skippr:origin-bottom-right" : "skippr:origin-bottom-left"), isFloating && !isPanelOpen && "skippr:scale-0 skippr:opacity-0 skippr:pointer-events-none", isFloating && isPanelOpen && "skippr:scale-100 skippr:opacity-100", isSidebar && "skippr:top-0 skippr:h-full", isSidebar && "skippr:transition-[width] skippr:duration-300 skippr:ease-in-out", isSidebar && position === "right" && "skippr:right-0 skippr:border-l skippr:border-l-border", isSidebar && position === "left" && "skippr:left-0 skippr:border-r skippr:border-r-border", isSidebar && !isPanelOpen && "skippr:w-0 skippr:border-0"),
4150
+ return /* @__PURE__ */ jsxs16("div", {
4151
+ 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:h-[min(460px,calc(100vh-200px))] skippr:rounded-2xl skippr:shadow-[0_8px_30px_rgba(0,0,0,0.16),0_4px_12px_rgba(0,0,0,0.08)]", isFloating && (isConnected || isStarting || isPausing ? "skippr:bottom-[124px]" : "skippr:bottom-[88px]"), isFloating && (position === "right" ? "skippr:right-6" : "skippr:left-6"), isFloating && "skippr:transition-[opacity,transform] skippr:duration-300 skippr:ease-in-out", isFloating && (position === "right" ? "skippr:origin-bottom-right" : "skippr:origin-bottom-left"), isFloating && !isPanelOpen && "skippr:scale-0 skippr:opacity-0 skippr:pointer-events-none", isFloating && isPanelOpen && "skippr:scale-100 skippr:opacity-100", isSidebar && "skippr:top-0 skippr:h-full", isSidebar && "skippr:transition-[width] skippr:duration-300 skippr:ease-in-out", isSidebar && position === "right" && "skippr:right-0 skippr:border-l skippr:border-l-border", isSidebar && position === "left" && "skippr:left-0 skippr:border-r skippr:border-r-border", isSidebar && !isPanelOpen && "skippr:w-0 skippr:border-0"),
4255
4152
  style: { width: isPanelOpen ? SIDEBAR_WIDTH : undefined },
4256
4153
  children: [
4257
- !hideHeader && /* @__PURE__ */ jsx22(ChatHeader, {}),
4258
- authFailed ? /* @__PURE__ */ jsx22(AuthError, {}) : isAuthenticated ? /* @__PURE__ */ jsx22(AuthenticatedContent, {
4154
+ !hideHeader && /* @__PURE__ */ jsx20(ChatHeader, {}),
4155
+ authFailed ? /* @__PURE__ */ jsx20(AuthError, {}) : isAuthenticated ? /* @__PURE__ */ jsx20(AuthenticatedContent, {
4259
4156
  isConnected,
4260
4157
  isPaused,
4261
4158
  isPausing,
4262
4159
  isDisconnecting,
4263
4160
  canResume: resumableSession !== null,
4264
4161
  onStartSession: startSession,
4265
- onPause: pauseSession,
4266
4162
  onResume: resumeSession,
4267
- onDisconnect: disconnect,
4268
4163
  isStarting,
4269
4164
  error,
4270
4165
  activeTab,
@@ -4272,17 +4167,15 @@ function Sidebar({
4272
4167
  hideControls,
4273
4168
  startSessionLabel,
4274
4169
  autoFocusChat,
4275
- showScreenShareToggle: captureMode === "screenshare",
4276
- hasModuleSelector,
4277
4170
  agentId,
4278
4171
  agentControls,
4279
4172
  showAgenda
4280
- }) : usesHostAuth || isValidating ? /* @__PURE__ */ jsx22("div", {
4173
+ }) : usesHostAuth || isValidating ? /* @__PURE__ */ jsx20("div", {
4281
4174
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
4282
- children: /* @__PURE__ */ jsx22(LoadingDots, {
4175
+ children: /* @__PURE__ */ jsx20(LoadingDots, {
4283
4176
  label: "Loading..."
4284
4177
  })
4285
- }) : /* @__PURE__ */ jsx22(LoginFlow, {
4178
+ }) : /* @__PURE__ */ jsx20(LoginFlow, {
4286
4179
  requestOtp,
4287
4180
  verifyOtp,
4288
4181
  error: authError,
@@ -4298,9 +4191,7 @@ function AuthenticatedContent({
4298
4191
  isDisconnecting,
4299
4192
  canResume,
4300
4193
  onStartSession,
4301
- onPause,
4302
4194
  onResume,
4303
- onDisconnect,
4304
4195
  isStarting,
4305
4196
  error,
4306
4197
  activeTab,
@@ -4308,15 +4199,11 @@ function AuthenticatedContent({
4308
4199
  hideControls,
4309
4200
  startSessionLabel,
4310
4201
  autoFocusChat,
4311
- showScreenShareToggle,
4312
- hasModuleSelector,
4313
4202
  agentId,
4314
4203
  agentControls,
4315
4204
  showAgenda
4316
4205
  }) {
4317
4206
  const inSession = isConnected || isStarting || isPaused || isPausing;
4318
- const showSelectorAsPrompt = hasModuleSelector && !inSession && !isDisconnecting;
4319
- const showTabBar = !showSelectorAsPrompt;
4320
4207
  const effectiveTab = showAgenda ? activeTab : "chat";
4321
4208
  let transitionLabel = null;
4322
4209
  if (isPausing) {
@@ -4326,63 +4213,63 @@ function AuthenticatedContent({
4326
4213
  } else if (isPaused) {
4327
4214
  transitionLabel = "Paused";
4328
4215
  }
4329
- return /* @__PURE__ */ jsxs18(Fragment5, {
4216
+ return /* @__PURE__ */ jsxs16(Fragment2, {
4330
4217
  children: [
4331
- isConnected && /* @__PURE__ */ jsx22(ConnectedBanner, {}),
4332
- showTabBar && /* @__PURE__ */ jsxs18("div", {
4218
+ isConnected && /* @__PURE__ */ jsx20(ConnectedBanner, {}),
4219
+ /* @__PURE__ */ jsxs16("div", {
4333
4220
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:border-b skippr:border-border skippr:px-3 skippr:py-2",
4334
4221
  children: [
4335
- /* @__PURE__ */ jsxs18("button", {
4222
+ /* @__PURE__ */ jsxs16("button", {
4336
4223
  type: "button",
4337
4224
  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-2 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "chat" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
4338
4225
  onClick: () => onTabChange("chat"),
4339
4226
  children: [
4340
- /* @__PURE__ */ jsx22(MessageCircle, {
4227
+ /* @__PURE__ */ jsx20(MessageCircle, {
4341
4228
  className: "skippr:size-3.5"
4342
4229
  }),
4343
4230
  "Chat",
4344
- activeTab === "chat" && /* @__PURE__ */ jsx22("span", {
4231
+ activeTab === "chat" && /* @__PURE__ */ jsx20("span", {
4345
4232
  className: "skippr:absolute skippr:-bottom-2 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
4346
4233
  })
4347
4234
  ]
4348
4235
  }),
4349
- showAgenda && /* @__PURE__ */ jsxs18("button", {
4236
+ showAgenda && /* @__PURE__ */ jsxs16("button", {
4350
4237
  type: "button",
4351
4238
  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-2 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "agenda" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
4352
4239
  onClick: () => onTabChange("agenda"),
4353
4240
  children: [
4354
- /* @__PURE__ */ jsx22(Calendar, {
4241
+ /* @__PURE__ */ jsx20(Calendar, {
4355
4242
  className: "skippr:size-3.5"
4356
4243
  }),
4357
4244
  "Agenda",
4358
- activeTab === "agenda" && /* @__PURE__ */ jsx22("span", {
4245
+ activeTab === "agenda" && /* @__PURE__ */ jsx20("span", {
4359
4246
  className: "skippr:absolute skippr:-bottom-2 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
4360
4247
  })
4361
4248
  ]
4362
4249
  })
4363
4250
  ]
4364
4251
  }),
4365
- /* @__PURE__ */ jsx22("div", {
4252
+ /* @__PURE__ */ jsx20("div", {
4366
4253
  className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
4367
- children: isDisconnecting ? /* @__PURE__ */ jsx22("div", {
4254
+ children: isDisconnecting ? /* @__PURE__ */ jsx20("div", {
4368
4255
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
4369
- children: /* @__PURE__ */ jsx22(LoadingDots, {
4256
+ children: /* @__PURE__ */ jsx20(LoadingDots, {
4370
4257
  label: "Ending session..."
4371
4258
  })
4372
- }) : showSelectorAsPrompt ? /* @__PURE__ */ jsx22(ModuleSelector, {}) : inSession ? /* @__PURE__ */ jsxs18(Fragment5, {
4259
+ }) : inSession ? /* @__PURE__ */ jsxs16(Fragment2, {
4373
4260
  children: [
4374
- transitionLabel && /* @__PURE__ */ jsx22("div", {
4261
+ transitionLabel && /* @__PURE__ */ jsx20("div", {
4375
4262
  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",
4376
4263
  children: transitionLabel
4377
4264
  }),
4378
- /* @__PURE__ */ jsx22(ConnectedBody, {
4265
+ /* @__PURE__ */ jsx20(ConnectedBody, {
4379
4266
  activeTab: effectiveTab,
4380
4267
  autoFocusChat
4381
4268
  })
4382
4269
  ]
4383
- }) : /* @__PURE__ */ jsx22("div", {
4270
+ }) : /* @__PURE__ */ jsx20("div", {
4384
4271
  className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
4385
- children: /* @__PURE__ */ jsx22(StartSessionPrompt, {
4272
+ children: /* @__PURE__ */ jsx20(StartSessionPrompt, {
4386
4273
  onStartSession,
4387
4274
  agentId,
4388
4275
  agentControls,
@@ -4394,29 +4281,58 @@ function AuthenticatedContent({
4394
4281
  })
4395
4282
  }, `${activeTab}-empty`)
4396
4283
  }),
4397
- (isConnected || isPaused) && !isDisconnecting && !hideControls && /* @__PURE__ */ jsx22(MeetingControls, {
4398
- onHangUp: onDisconnect,
4399
- onPause,
4400
- onResume,
4401
- isPaused,
4402
- isPausing,
4403
- showScreenShareToggle
4284
+ !hideControls && /* @__PURE__ */ jsxs16("div", {
4285
+ className: "skippr:shrink-0 skippr:border-t skippr:border-border",
4286
+ children: [
4287
+ isConnected && !isDisconnecting && /* @__PURE__ */ jsx20(ModeToggleRow, {}),
4288
+ /* @__PURE__ */ jsx20("div", {
4289
+ className: "skippr:px-4 skippr:py-3 skippr:text-center skippr:text-[10px] skippr:text-muted-foreground",
4290
+ children: "Powered by Skippr"
4291
+ })
4292
+ ]
4404
4293
  })
4405
4294
  ]
4406
4295
  });
4407
4296
  }
4297
+ function ModeToggleRow() {
4298
+ const { textMode, toggleTextMode } = useTextMode();
4299
+ return /* @__PURE__ */ jsx20("div", {
4300
+ className: "skippr:flex skippr:justify-center skippr:px-3 skippr:pt-3 skippr:pb-1",
4301
+ children: /* @__PURE__ */ jsx20("button", {
4302
+ type: "button",
4303
+ "aria-label": textMode ? "Switch to voice mode" : "Switch to text mode",
4304
+ className: "skippr:flex skippr:cursor-pointer skippr:items-center skippr:gap-2 skippr:rounded-xl skippr:bg-muted skippr:px-4 skippr:py-2 skippr:text-sm skippr:font-medium skippr:text-foreground skippr:transition-colors skippr:hover:bg-muted/70",
4305
+ onClick: () => void toggleTextMode(),
4306
+ children: textMode ? /* @__PURE__ */ jsxs16(Fragment2, {
4307
+ children: [
4308
+ /* @__PURE__ */ jsx20(Mic, {
4309
+ className: "skippr:size-4"
4310
+ }),
4311
+ "Voice mode"
4312
+ ]
4313
+ }) : /* @__PURE__ */ jsxs16(Fragment2, {
4314
+ children: [
4315
+ /* @__PURE__ */ jsx20(MessageSquare, {
4316
+ className: "skippr:size-4"
4317
+ }),
4318
+ "Text mode"
4319
+ ]
4320
+ })
4321
+ })
4322
+ });
4323
+ }
4408
4324
  function AuthError() {
4409
- return /* @__PURE__ */ jsxs18("div", {
4325
+ return /* @__PURE__ */ jsxs16("div", {
4410
4326
  className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:px-6 skippr:py-4 skippr:text-center",
4411
4327
  children: [
4412
- /* @__PURE__ */ jsx22(CircleAlert, {
4328
+ /* @__PURE__ */ jsx20(CircleAlert, {
4413
4329
  className: "skippr:mb-3 skippr:size-7 skippr:text-destructive"
4414
4330
  }),
4415
- /* @__PURE__ */ jsx22("p", {
4331
+ /* @__PURE__ */ jsx20("p", {
4416
4332
  className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
4417
4333
  children: "We couldn't verify your session"
4418
4334
  }),
4419
- /* @__PURE__ */ jsx22("p", {
4335
+ /* @__PURE__ */ jsx20("p", {
4420
4336
  className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
4421
4337
  children: "Please contact administrator."
4422
4338
  })
@@ -4425,7 +4341,7 @@ function AuthError() {
4425
4341
  }
4426
4342
  function ConnectedBanner() {
4427
4343
  const remaining = useSessionRemaining();
4428
- return /* @__PURE__ */ jsx22(SessionWarningBanner, {
4344
+ return /* @__PURE__ */ jsx20(SessionWarningBanner, {
4429
4345
  remaining
4430
4346
  });
4431
4347
  }
@@ -4436,17 +4352,17 @@ function ConnectedBody({
4436
4352
  const { allMessages, agentState, sendChatMessage, isSendingChat } = useCombinedMessages();
4437
4353
  const { phases } = usePhaseUpdates();
4438
4354
  if (activeTab === "agenda") {
4439
- return /* @__PURE__ */ jsx22("div", {
4355
+ return /* @__PURE__ */ jsx20("div", {
4440
4356
  className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto skippr:animate-skippr-tab-fade",
4441
- children: /* @__PURE__ */ jsx22(SessionAgenda, {
4357
+ children: /* @__PURE__ */ jsx20(SessionAgenda, {
4442
4358
  phases,
4443
4359
  hasStarted: allMessages.length > 0 || agentState === "speaking"
4444
4360
  })
4445
4361
  }, "agenda");
4446
4362
  }
4447
- return /* @__PURE__ */ jsx22("div", {
4363
+ return /* @__PURE__ */ jsx20("div", {
4448
4364
  className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
4449
- children: /* @__PURE__ */ jsx22(MessageList, {
4365
+ children: /* @__PURE__ */ jsx20(MessageList, {
4450
4366
  messages: allMessages,
4451
4367
  isStreaming: agentState === "speaking",
4452
4368
  sendChatMessage,
@@ -4456,29 +4372,75 @@ function ConnectedBody({
4456
4372
  }, "chat");
4457
4373
  }
4458
4374
 
4375
+ // src/components/Logo.tsx
4376
+ import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
4377
+ function Logo({ className }) {
4378
+ return /* @__PURE__ */ jsxs17("svg", {
4379
+ width: "1em",
4380
+ height: "1em",
4381
+ viewBox: "0 0 200 200",
4382
+ fill: "none",
4383
+ xmlns: "http://www.w3.org/2000/svg",
4384
+ role: "img",
4385
+ "aria-label": "Skippr",
4386
+ className,
4387
+ children: [
4388
+ /* @__PURE__ */ jsx21("rect", {
4389
+ width: "200",
4390
+ height: "200",
4391
+ rx: "40",
4392
+ fill: "#2D2D3F"
4393
+ }),
4394
+ /* @__PURE__ */ jsxs17("g", {
4395
+ transform: "translate(100 100) scale(0.8) translate(-100 -100)",
4396
+ children: [
4397
+ /* @__PURE__ */ jsx21("path", {
4398
+ d: "M144.497 59C149.193 59 153 62.8071 153 67.5033V116.397C153 118.034 152.536 119.562 151.735 120.859L114.894 92.4811L114.894 92.4804C105.42 85.1648 91.2971 91.7058 91.297 104.015V124.901H54.5033C49.8071 124.901 46 121.094 46 116.397V67.5033C46 62.8071 49.8071 59 54.5033 59H144.497ZM101.272 104.015C101.272 100.172 105.736 98.0111 108.798 100.375L140.637 124.901H101.272V104.015Z",
4399
+ fill: "white"
4400
+ }),
4401
+ /* @__PURE__ */ jsx21("path", {
4402
+ d: "M108.798 99.8856C105.736 97.5211 101.271 99.6824 101.271 103.525V155.892C101.271 160.27 106.852 162.191 109.594 158.755L122.619 142.437C123.1 141.836 123.712 141.35 124.409 141.016C125.106 140.683 125.871 140.51 126.645 140.51H147.946C152.386 140.51 154.316 134.944 150.81 132.247L108.798 99.8856Z",
4403
+ className: "skippr:fill-brand"
4404
+ })
4405
+ ]
4406
+ })
4407
+ ]
4408
+ });
4409
+ }
4410
+
4459
4411
  // src/components/SidebarTrigger.tsx
4460
- import { jsx as jsx23 } from "react/jsx-runtime";
4412
+ import { jsx as jsx22 } from "react/jsx-runtime";
4461
4413
  function SidebarTrigger() {
4462
- const { isPanelOpen, togglePanel, minimizePanel, minimizable, position, isMinimized } = useLiveAgent();
4463
- if (isMinimized)
4414
+ const {
4415
+ isPanelOpen,
4416
+ togglePanel,
4417
+ minimizePanel,
4418
+ minimizable,
4419
+ position,
4420
+ isMinimized,
4421
+ isConnected,
4422
+ isStarting,
4423
+ isPausing
4424
+ } = useLiveAgent();
4425
+ if (isMinimized || isConnected || isStarting || isPausing)
4464
4426
  return null;
4465
4427
  const handleClick = isPanelOpen && minimizable ? minimizePanel : togglePanel;
4466
- return /* @__PURE__ */ jsx23("button", {
4428
+ return /* @__PURE__ */ jsx22("button", {
4467
4429
  type: "button",
4468
4430
  onClick: handleClick,
4469
4431
  title: isPanelOpen ? "Close chat" : "Open chat",
4470
4432
  "aria-label": isPanelOpen ? "Close chat" : "Open chat",
4471
4433
  className: cn("skippr:fixed skippr:bottom-6 skippr:z-[9998]", "skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)] skippr:transition-all", "skippr:cursor-pointer skippr:hover:brightness-110 skippr:hover:-translate-y-0.5 skippr:active:translate-y-0", isPanelOpen ? "skippr:rounded-[14px] skippr:bg-bubble skippr:text-white" : "skippr:rounded-[10px] skippr:overflow-hidden", position === "right" ? "skippr:right-6" : "skippr:left-6"),
4472
- children: isPanelOpen ? /* @__PURE__ */ jsx23(ChevronDown, {
4434
+ children: isPanelOpen ? /* @__PURE__ */ jsx22(ChevronDown, {
4473
4435
  className: "skippr:size-5"
4474
- }) : /* @__PURE__ */ jsx23(Logo, {
4436
+ }) : /* @__PURE__ */ jsx22(Logo, {
4475
4437
  className: "skippr:size-12"
4476
4438
  })
4477
4439
  });
4478
4440
  }
4479
4441
 
4480
4442
  // src/components/LiveAgent.tsx
4481
- import { jsx as jsx24, jsxs as jsxs19 } from "react/jsx-runtime";
4443
+ import { jsx as jsx23, jsxs as jsxs18 } from "react/jsx-runtime";
4482
4444
  function LiveAgent(props) {
4483
4445
  const {
4484
4446
  agentId: hostAgentId,
@@ -4510,20 +4472,20 @@ function LiveAgent(props) {
4510
4472
  const usesHostAuth = !!getUserToken || !!userToken || !!authTokenProp;
4511
4473
  const effectiveAuthToken = usesHostAuth ? authTokenProp : auth.authToken ?? undefined;
4512
4474
  const hasModuleSelector = !hostAgentId;
4513
- const [activeModule, setActiveModule] = useState15(null);
4475
+ const [activeModule, setActiveModule] = useState16(null);
4514
4476
  const agentId = hasModuleSelector ? activeModule?.id ?? null : hostAgentId;
4515
4477
  const agentControls = hasModuleSelector ? activeModule?.controls : hostAgentControls;
4516
- const minimizeOnSessionStart = useCallback10(() => {
4478
+ const minimizeOnSessionStart = useCallback11(() => {
4517
4479
  if (minimizable) {
4518
4480
  setIsMinimized(true);
4519
4481
  setIsPanelOpen(false);
4520
4482
  }
4521
4483
  }, [minimizable]);
4522
- const expandOnSessionStartError = useCallback10(() => {
4484
+ const expandOnSessionStartError = useCallback11(() => {
4523
4485
  setIsMinimized(false);
4524
4486
  setIsPanelOpen(true);
4525
4487
  }, []);
4526
- const minimizeOnSessionDisconnect = useCallback10(() => {
4488
+ const minimizeOnSessionDisconnect = useCallback11(() => {
4527
4489
  if (hasModuleSelector) {
4528
4490
  setActiveModule(null);
4529
4491
  }
@@ -4559,39 +4521,42 @@ function LiveAgent(props) {
4559
4521
  onStartError: expandOnSessionStartError,
4560
4522
  onDisconnect: minimizeOnSessionDisconnect
4561
4523
  });
4562
- const teardownInFlightRef = useRef13(false);
4524
+ const teardownInFlightRef = useRef15(false);
4563
4525
  teardownInFlightRef.current = isPaused || isPausing || isDisconnecting;
4564
- const handleRoomDisconnected = useCallback10(() => {
4526
+ const handleRoomDisconnected = useCallback11(() => {
4565
4527
  if (teardownInFlightRef.current)
4566
4528
  return;
4567
4529
  disconnect();
4568
4530
  }, [disconnect]);
4569
- const inSession = connection !== null || isStarting || isPaused || isPausing || isDisconnecting;
4570
- const [isPanelOpen, setIsPanelOpen] = useState15(defaultOpen);
4571
- const [isMinimized, setIsMinimized] = useState15(minimizable && !defaultOpen);
4572
- const [sidebarTab, setSidebarTab] = useState15("agenda");
4573
- const [phasesSnapshot, setPhasesSnapshot] = useState15([]);
4531
+ const isSessionLive = connection !== null || isStarting || isPausing || isDisconnecting;
4532
+ const [isPanelOpen, setIsPanelOpen] = useState16(defaultOpen);
4533
+ const [isMinimized, setIsMinimized] = useState16(minimizable && !defaultOpen);
4534
+ const [sidebarTab, setSidebarTab] = useState16("agenda");
4535
+ const [phasesSnapshot, setPhasesSnapshot] = useState16([]);
4536
+ const [textMode, setTextMode] = useState16(false);
4537
+ const isConnected = connection !== null;
4538
+ const showControlBar = isConnected || isStarting || isPausing;
4539
+ useEffect20(() => {
4540
+ if (!isConnected)
4541
+ setTextMode(false);
4542
+ }, [isConnected]);
4574
4543
  const {
4575
4544
  modules: availableModules,
4576
4545
  isLoading: isLoadingModules,
4546
+ hasResolved: hasResolvedModules,
4577
4547
  error: modulesError,
4578
4548
  refetch: refetchModules
4579
4549
  } = useAvailableModules({
4580
- enabled: !inSession,
4550
+ enabled: !isSessionLive,
4581
4551
  bearerToken,
4582
4552
  authedFetch
4583
4553
  });
4584
- const hasAlwaysOnModule = availableModules.some((m) => m.mode === AGENT_MODE.AlwaysOn);
4585
- const {
4586
- goals: adoptionGoals,
4587
- dismissGoal: dismissAdoptionGoal,
4588
- attendGoal
4589
- } = useAdoptionGoals({
4590
- enabled: !inSession && hasAlwaysOnModule,
4554
+ const { goals: adoptionGoals, attendGoal } = useAdoptionGoals({
4555
+ enabled: !isSessionLive,
4591
4556
  bearerToken,
4592
4557
  authedFetch
4593
4558
  });
4594
- const activeModuleForAgent = useMemo5(() => {
4559
+ const activeModuleForAgent = useMemo6(() => {
4595
4560
  if (activeModule)
4596
4561
  return activeModule;
4597
4562
  if (!hostAgentId)
@@ -4599,8 +4564,8 @@ function LiveAgent(props) {
4599
4564
  return availableModules.find((m) => m.id === hostAgentId) ?? null;
4600
4565
  }, [activeModule, hostAgentId, availableModules]);
4601
4566
  const agentMode = activeModuleForAgent?.mode ?? null;
4602
- const resumableSession = useMemo5(() => getResumableSession(activeModuleForAgent), [activeModuleForAgent]);
4603
- const resumeSession = useCallback10(async () => {
4567
+ const resumableSession = useMemo6(() => getResumableSession(activeModuleForAgent), [activeModuleForAgent]);
4568
+ const resumeSession = useCallback11(async () => {
4604
4569
  if (!resumableSession)
4605
4570
  return;
4606
4571
  await startSession({
@@ -4609,7 +4574,7 @@ function LiveAgent(props) {
4609
4574
  existingSessionId: resumableSession.id
4610
4575
  });
4611
4576
  }, [resumableSession, startSession, agentControls]);
4612
- const selectModule = useCallback10((moduleId) => {
4577
+ const selectModule = useCallback11((moduleId) => {
4613
4578
  const found = availableModules.find((m) => m.id === moduleId);
4614
4579
  if (!found)
4615
4580
  return;
@@ -4620,7 +4585,7 @@ function LiveAgent(props) {
4620
4585
  existingSessionId: getResumableSessionId(found.currentSession, found.mode)
4621
4586
  });
4622
4587
  }, [availableModules, startSession]);
4623
- const startAdoptionSession = useCallback10((goal) => {
4588
+ const startAdoptionSession = useCallback11((goal) => {
4624
4589
  attendGoal(goal.goalId);
4625
4590
  const found = availableModules.find((m) => m.id === goal.agentId);
4626
4591
  if (found)
@@ -4631,9 +4596,9 @@ function LiveAgent(props) {
4631
4596
  adoptionGoalId: goal.goalId
4632
4597
  });
4633
4598
  }, [attendGoal, availableModules, startSession]);
4634
- const [welcomeDismissed, setWelcomeDismissed] = useState15(false);
4635
- const dismissWelcome = useCallback10(() => setWelcomeDismissed(true), []);
4636
- const [currentPosition, setCurrentPosition] = useState15(() => {
4599
+ const [welcomeDismissed, setWelcomeDismissed] = useState16(false);
4600
+ const dismissWelcome = useCallback11(() => setWelcomeDismissed(true), []);
4601
+ const [currentPosition, setCurrentPosition] = useState16(() => {
4637
4602
  try {
4638
4603
  const saved = localStorage.getItem("skippr_widget_position");
4639
4604
  if (saved === "left" || saved === "right")
@@ -4641,28 +4606,31 @@ function LiveAgent(props) {
4641
4606
  } catch {}
4642
4607
  return position;
4643
4608
  });
4644
- const setPositionWithPersist = useCallback10((pos) => {
4609
+ const setPositionWithPersist = useCallback11((pos) => {
4645
4610
  setCurrentPosition(pos);
4646
4611
  try {
4647
4612
  localStorage.setItem("skippr_widget_position", pos);
4648
4613
  } catch {}
4649
4614
  }, []);
4650
- const openPanel = useCallback10(() => setIsPanelOpen(true), []);
4651
- const closePanel = useCallback10(() => setIsPanelOpen(false), []);
4652
- const togglePanel = useCallback10(() => setIsPanelOpen((prev) => !prev), []);
4653
- const expandPanel = useCallback10(() => {
4615
+ const openPanel = useCallback11(() => setIsPanelOpen(true), []);
4616
+ const closePanel = useCallback11(() => setIsPanelOpen(false), []);
4617
+ const togglePanel = useCallback11(() => setIsPanelOpen((prev) => !prev), []);
4618
+ const expandPanel = useCallback11(() => {
4654
4619
  setIsMinimized(false);
4655
4620
  setIsPanelOpen(true);
4656
4621
  }, []);
4657
- const minimizePanel = useCallback10(() => {
4622
+ const minimizePanel = useCallback11(() => {
4658
4623
  if (!minimizable)
4659
4624
  return;
4660
4625
  setIsMinimized(true);
4661
4626
  setIsPanelOpen(false);
4662
4627
  }, [minimizable]);
4663
- const isConnected = connection !== null;
4628
+ const pauseSessionAndMinimize = useCallback11(async () => {
4629
+ await pauseSession();
4630
+ minimizePanel();
4631
+ }, [pauseSession, minimizePanel]);
4664
4632
  const isAuthenticated = bearerToken !== null || auth.isAuthenticated;
4665
- const ctx = useMemo5(() => ({
4633
+ const ctx = useMemo6(() => ({
4666
4634
  connection,
4667
4635
  shouldConnect,
4668
4636
  isConnected,
@@ -4672,7 +4640,7 @@ function LiveAgent(props) {
4672
4640
  error,
4673
4641
  errorCode,
4674
4642
  startSession,
4675
- pauseSession,
4643
+ pauseSession: pauseSessionAndMinimize,
4676
4644
  resumeSession,
4677
4645
  disconnect,
4678
4646
  isPaused,
@@ -4702,6 +4670,8 @@ function LiveAgent(props) {
4702
4670
  isAuthSubmitting: auth.isSubmitting,
4703
4671
  sidebarTab,
4704
4672
  setSidebarTab,
4673
+ textMode,
4674
+ setTextModeState: setTextMode,
4705
4675
  autoFocusChat,
4706
4676
  captureMode,
4707
4677
  agentId,
@@ -4714,8 +4684,8 @@ function LiveAgent(props) {
4714
4684
  modulesError,
4715
4685
  refetchModules,
4716
4686
  selectModule,
4687
+ hasResolvedModules,
4717
4688
  adoptionGoals,
4718
- dismissAdoptionGoal,
4719
4689
  startAdoptionSession
4720
4690
  }), [
4721
4691
  connection,
@@ -4727,7 +4697,7 @@ function LiveAgent(props) {
4727
4697
  error,
4728
4698
  errorCode,
4729
4699
  startSession,
4730
- pauseSession,
4700
+ pauseSessionAndMinimize,
4731
4701
  resumeSession,
4732
4702
  disconnect,
4733
4703
  isPaused,
@@ -4755,6 +4725,7 @@ function LiveAgent(props) {
4755
4725
  auth.logout,
4756
4726
  auth.isSubmitting,
4757
4727
  sidebarTab,
4728
+ textMode,
4758
4729
  autoFocusChat,
4759
4730
  captureMode,
4760
4731
  agentId,
@@ -4767,38 +4738,39 @@ function LiveAgent(props) {
4767
4738
  modulesError,
4768
4739
  refetchModules,
4769
4740
  selectModule,
4741
+ hasResolvedModules,
4770
4742
  adoptionGoals,
4771
- dismissAdoptionGoal,
4772
4743
  startAdoptionSession
4773
4744
  ]);
4774
- return /* @__PURE__ */ jsx24(LiveAgentContext.Provider, {
4745
+ return /* @__PURE__ */ jsx23(LiveAgentContext.Provider, {
4775
4746
  value: ctx,
4776
- children: /* @__PURE__ */ jsxs19(LiveKitRoom, {
4747
+ children: /* @__PURE__ */ jsxs18(LiveKitRoom, {
4777
4748
  serverUrl: connection?.livekitUrl,
4778
4749
  token: connection?.token,
4779
4750
  connect: shouldConnect,
4780
4751
  audio: true,
4781
4752
  onDisconnected: handleRoomDisconnected,
4782
4753
  children: [
4783
- connection && /* @__PURE__ */ jsx24(RoomAudioRenderer, {}),
4784
- connection && captureMode === "screenshare" && /* @__PURE__ */ jsx24(AutoStartMedia, {
4754
+ connection && !textMode && /* @__PURE__ */ jsx23(RoomAudioRenderer, {}),
4755
+ connection && captureMode === "screenshare" && /* @__PURE__ */ jsx23(AutoStartMedia, {
4785
4756
  pendingScreenStream
4786
4757
  }),
4787
- connection && captureMode === "auto" && /* @__PURE__ */ jsx24(DomCapture, {}),
4788
- /* @__PURE__ */ jsxs19(ShadowHost, {
4758
+ connection && captureMode === "auto" && /* @__PURE__ */ jsx23(DomCapture, {}),
4759
+ /* @__PURE__ */ jsxs18(ShadowHost, {
4789
4760
  children: [
4790
- connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */ jsx24(HighlightOverlay, {}),
4791
- connection && captureMode === "auto" && agentControls?.actions && /* @__PURE__ */ jsx24(PageActionHandler, {}),
4792
- /* @__PURE__ */ jsxs19("div", {
4761
+ connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */ jsx23(HighlightOverlay, {}),
4762
+ connection && captureMode === "auto" && agentControls?.actions && /* @__PURE__ */ jsx23(PageActionHandler, {}),
4763
+ /* @__PURE__ */ jsxs18("div", {
4793
4764
  id: WIDGET_ROOT_ID,
4794
4765
  children: [
4795
- isMinimized && /* @__PURE__ */ jsx24(MinimizedBubble, {
4766
+ isMinimized && !showControlBar && /* @__PURE__ */ jsx23(MinimizedBubble, {
4796
4767
  welcomeMessage,
4797
4768
  welcomeDismissed,
4798
4769
  onDismissWelcome: dismissWelcome
4799
4770
  }),
4800
- /* @__PURE__ */ jsx24(SidebarTrigger, {}),
4801
- /* @__PURE__ */ jsx24(Sidebar, {
4771
+ showControlBar && !hideControls && /* @__PURE__ */ jsx23(SessionControlBar, {}),
4772
+ /* @__PURE__ */ jsx23(SidebarTrigger, {}),
4773
+ /* @__PURE__ */ jsx23(Sidebar, {
4802
4774
  hideControls,
4803
4775
  hideHeader,
4804
4776
  startSessionLabel
@@ -4813,9 +4785,9 @@ function LiveAgent(props) {
4813
4785
  });
4814
4786
  }
4815
4787
  // src/hooks/useIsLocalSpeaking.ts
4816
- import { useIsSpeaking, useLocalParticipant as useLocalParticipant6 } from "@livekit/components-react/hooks";
4788
+ import { useIsSpeaking, useLocalParticipant as useLocalParticipant8 } from "@livekit/components-react/hooks";
4817
4789
  function useIsLocalSpeaking() {
4818
- const { localParticipant } = useLocalParticipant6();
4790
+ const { localParticipant } = useLocalParticipant8();
4819
4791
  return useIsSpeaking(localParticipant);
4820
4792
  }
4821
4793
  export {