@thunderphone/widget 0.2.3 → 0.3.1

package/dist/index.mjs

@@ -1,94 +1,46 @@
-// src/ThunderPhoneWidget.tsx
-import { useCallback, useState as useState2 } from "react";
-import { LiveKitRoom } from "@livekit/components-react";
-
-// src/AudioHandler.tsx
-import { useEffect, useRef } from "react";
-import { useRoomContext } from "@livekit/components-react";
-import { RoomEvent, Track } from "livekit-client";
-import { jsx } from "react/jsx-runtime";
-function AudioHandler({ onAgentConnected, onDisconnected }) {
-  const room = useRoomContext();
-  const audioRef = useRef(null);
-  useEffect(() => {
-    if (room.remoteParticipants.size > 0) {
-      onAgentConnected();
-    }
-    const handleParticipantConnected = () => onAgentConnected();
-    const handleDisconnect = () => onDisconnected();
-    const attachTrack = (track, _pub, _participant) => {
-      if (track.kind === Track.Kind.Audio && audioRef.current) {
-        const stream = new MediaStream([track.mediaStreamTrack]);
-        audioRef.current.srcObject = stream;
-        audioRef.current.play().catch(() => {
-        });
-      }
-    };
-    room.on(RoomEvent.ParticipantConnected, handleParticipantConnected);
-    room.on(RoomEvent.Disconnected, handleDisconnect);
-    room.on(RoomEvent.TrackSubscribed, attachTrack);
-    for (const participant of room.remoteParticipants.values()) {
-      for (const pub of participant.trackPublications.values()) {
-        if (pub.track && pub.isSubscribed && pub.track.kind === Track.Kind.Audio && audioRef.current) {
-          const stream = new MediaStream([pub.track.mediaStreamTrack]);
-          audioRef.current.srcObject = stream;
-          audioRef.current.play().catch(() => {
-          });
-        }
-      }
-    }
-    return () => {
-      room.off(RoomEvent.ParticipantConnected, handleParticipantConnected);
-      room.off(RoomEvent.Disconnected, handleDisconnect);
-      room.off(RoomEvent.TrackSubscribed, attachTrack);
-    };
-  }, [room, onAgentConnected, onDisconnected]);
-  return /* @__PURE__ */ jsx("audio", { ref: audioRef, autoPlay: true });
-}
-
 // src/WidgetButton.tsx
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 function WidgetButton({ state, muted, onClick, onMuteToggle }) {
   if (state === "connected") {
     return /* @__PURE__ */ jsxs("div", { className: "tp-button-group", children: [
-      /* @__PURE__ */ jsx2("button", { className: "tp-button tp-button--mute", onClick: onMuteToggle, type: "button", children: muted ? /* @__PURE__ */ jsxs("svg", { className: "tp-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-        /* @__PURE__ */ jsx2("line", { x1: "1", y1: "1", x2: "23", y2: "23" }),
-        /* @__PURE__ */ jsx2("path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12M15 9.34V4a3 3 0 0 0-5.94-.6" }),
-        /* @__PURE__ */ jsx2("path", { d: "M17 16.95A7 7 0 0 1 5 12v-2m14 0v2c0 .76-.13 1.49-.36 2.18" }),
-        /* @__PURE__ */ jsx2("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
-        /* @__PURE__ */ jsx2("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
+      /* @__PURE__ */ jsx("button", { className: "tp-button tp-button--mute", onClick: onMuteToggle, type: "button", children: muted ? /* @__PURE__ */ jsxs("svg", { className: "tp-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+        /* @__PURE__ */ jsx("line", { x1: "1", y1: "1", x2: "23", y2: "23" }),
+        /* @__PURE__ */ jsx("path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12M15 9.34V4a3 3 0 0 0-5.94-.6" }),
+        /* @__PURE__ */ jsx("path", { d: "M17 16.95A7 7 0 0 1 5 12v-2m14 0v2c0 .76-.13 1.49-.36 2.18" }),
+        /* @__PURE__ */ jsx("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
+        /* @__PURE__ */ jsx("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
       ] }) : /* @__PURE__ */ jsxs("svg", { className: "tp-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-        /* @__PURE__ */ jsx2("path", { d: "M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z" }),
-        /* @__PURE__ */ jsx2("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
-        /* @__PURE__ */ jsx2("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
-        /* @__PURE__ */ jsx2("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
+        /* @__PURE__ */ jsx("path", { d: "M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z" }),
+        /* @__PURE__ */ jsx("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
+        /* @__PURE__ */ jsx("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
+        /* @__PURE__ */ jsx("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
       ] }) }),
-      /* @__PURE__ */ jsx2("button", { className: "tp-button tp-button--end", onClick, type: "button", children: /* @__PURE__ */ jsx2("svg", { className: "tp-icon", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx2("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2" }) }) })
+      /* @__PURE__ */ jsx("button", { className: "tp-button tp-button--end", onClick, type: "button", children: /* @__PURE__ */ jsx("svg", { className: "tp-icon", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2" }) }) })
     ] });
   }
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx(
     "button",
     {
       className: `tp-button tp-button--start ${state === "connecting" ? "tp-button--loading" : ""}`,
       onClick,
       disabled: state === "connecting",
       type: "button",
-      children: state === "connecting" ? /* @__PURE__ */ jsx2("svg", { className: "tp-icon tp-spin", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx2("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }) }) : /* @__PURE__ */ jsxs("svg", { className: "tp-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-        /* @__PURE__ */ jsx2("path", { d: "M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z" }),
-        /* @__PURE__ */ jsx2("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
-        /* @__PURE__ */ jsx2("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
-        /* @__PURE__ */ jsx2("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
+      children: state === "connecting" ? /* @__PURE__ */ jsx("svg", { className: "tp-icon tp-spin", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }) }) : /* @__PURE__ */ jsxs("svg", { className: "tp-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+        /* @__PURE__ */ jsx("path", { d: "M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z" }),
+        /* @__PURE__ */ jsx("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
+        /* @__PURE__ */ jsx("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
+        /* @__PURE__ */ jsx("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
       ] })
     }
   );
 }
 
 // src/WidgetStatus.tsx
-import { useEffect as useEffect2, useState } from "react";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function WidgetStatus({ state, agentName, errorMessage }) {
   const [elapsed, setElapsed] = useState(0);
-  useEffect2(() => {
+  useEffect(() => {
     if (state !== "connected") {
       setElapsed(0);
       return;
@@ -109,14 +61,62 @@ function WidgetStatus({ state, agentName, errorMessage }) {
     error: "Unable to connect"
   };
   return /* @__PURE__ */ jsxs2("div", { className: "tp-status", children: [
-    agentName && /* @__PURE__ */ jsx3("div", { className: "tp-status__name", children: agentName }),
+    agentName && /* @__PURE__ */ jsx2("div", { className: "tp-status__name", children: agentName }),
     /* @__PURE__ */ jsxs2("div", { className: `tp-status__text tp-status--${state}`, children: [
-      state === "connected" && /* @__PURE__ */ jsx3("span", { className: "tp-status__dot" }),
+      state === "connected" && /* @__PURE__ */ jsx2("span", { className: "tp-status__dot" }),
       errorMessage && state === "error" ? errorMessage : statusText[state]
     ] })
   ] });
 }
 
+// src/useThunderPhone.ts
+import { useCallback, useState as useState2, createElement } from "react";
+import { LiveKitRoom } from "@livekit/components-react";
+
+// src/AudioHandler.tsx
+import { useEffect as useEffect2, useRef } from "react";
+import { useRoomContext } from "@livekit/components-react";
+import { RoomEvent, Track } from "livekit-client";
+import { jsx as jsx3 } from "react/jsx-runtime";
+function AudioHandler({ onAgentConnected, onDisconnected }) {
+  const room = useRoomContext();
+  const audioRef = useRef(null);
+  useEffect2(() => {
+    if (room.remoteParticipants.size > 0) {
+      onAgentConnected();
+    }
+    const handleParticipantConnected = () => onAgentConnected();
+    const handleDisconnect = () => onDisconnected();
+    const attachTrack = (track, _pub, _participant) => {
+      if (track.kind === Track.Kind.Audio && audioRef.current) {
+        const stream = new MediaStream([track.mediaStreamTrack]);
+        audioRef.current.srcObject = stream;
+        audioRef.current.play().catch(() => {
+        });
+      }
+    };
+    room.on(RoomEvent.ParticipantConnected, handleParticipantConnected);
+    room.on(RoomEvent.Disconnected, handleDisconnect);
+    room.on(RoomEvent.TrackSubscribed, attachTrack);
+    for (const participant of room.remoteParticipants.values()) {
+      for (const pub of participant.trackPublications.values()) {
+        if (pub.track && pub.isSubscribed && pub.track.kind === Track.Kind.Audio && audioRef.current) {
+          const stream = new MediaStream([pub.track.mediaStreamTrack]);
+          audioRef.current.srcObject = stream;
+          audioRef.current.play().catch(() => {
+          });
+        }
+      }
+    }
+    return () => {
+      room.off(RoomEvent.ParticipantConnected, handleParticipantConnected);
+      room.off(RoomEvent.Disconnected, handleDisconnect);
+      room.off(RoomEvent.TrackSubscribed, attachTrack);
+    };
+  }, [room, onAgentConnected, onDisconnected]);
+  return /* @__PURE__ */ jsx3("audio", { ref: audioRef, autoPlay: true });
+}
+
 // src/api.ts
 var DEFAULT_API_BASE = "https://api.thunderphone.com/v1";
 var WidgetAPIError = class extends Error {
@@ -146,98 +146,113 @@ async function createWidgetSession(apiKey, agentId, apiBase) {
   return response.json();
 }
 
-// src/ThunderPhoneWidget.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-function ThunderPhoneWidget({
-  apiKey,
-  agentId,
-  apiBase,
-  onConnect,
-  onDisconnect,
-  onError,
-  className
-}) {
+// src/useThunderPhone.ts
+function useThunderPhone(opts) {
   const [state, setState] = useState2("idle");
   const [session, setSession] = useState2(null);
   const [muted, setMuted] = useState2(false);
-  const [errorMessage, setErrorMessage] = useState2();
-  const handleConnect = useCallback(async () => {
+  const [error, setError] = useState2();
+  const handleDisconnect = useCallback(() => {
+    setState("disconnected");
+    setSession(null);
+    setMuted(false);
+    opts.onDisconnect?.();
+    setTimeout(() => setState("idle"), 1500);
+  }, [opts.onDisconnect]);
+  const handleAgentConnected = useCallback(() => {
+    setState("connected");
+    opts.onConnect?.();
+  }, [opts.onConnect]);
+  const connect = useCallback(async () => {
     if (state === "connecting" || state === "connected") return;
     setState("connecting");
-    setErrorMessage(void 0);
+    setError(void 0);
     try {
-      const sess = await createWidgetSession(apiKey, agentId, apiBase);
+      const sess = await createWidgetSession(opts.apiKey, opts.agentId, opts.apiBase);
       setSession(sess);
     } catch (err) {
       setState("error");
       if (err instanceof WidgetAPIError) {
-        setErrorMessage(err.message);
-        onError?.({ error: err.code, message: err.message });
+        setError(err.message);
+        opts.onError?.({ error: err.code, message: err.message });
       } else {
-        setErrorMessage("Unable to connect.");
-        onError?.({ error: "unknown", message: "Unable to connect." });
+        setError("Unable to connect.");
+        opts.onError?.({ error: "unknown", message: "Unable to connect." });
       }
     }
-  }, [apiKey, agentId, apiBase, state, onError]);
-  const handleDisconnect = useCallback(() => {
-    setState("disconnected");
-    setSession(null);
-    setMuted(false);
-    onDisconnect?.();
-    setTimeout(() => setState("idle"), 1500);
-  }, [onDisconnect]);
-  const handleAgentConnected = useCallback(() => {
-    setState("connected");
-    onConnect?.();
-  }, [onConnect]);
+  }, [opts.apiKey, opts.agentId, opts.apiBase, state, opts.onError]);
+  const disconnect = useCallback(() => {
+    handleDisconnect();
+  }, [handleDisconnect]);
+  const toggleMute = useCallback(() => setMuted((m) => !m), []);
+  const audio = session ? createElement(
+    LiveKitRoom,
+    {
+      token: session.token,
+      serverUrl: session.server_url,
+      audio: !muted,
+      video: false,
+      connect: true
+    },
+    createElement(AudioHandler, {
+      onAgentConnected: handleAgentConnected,
+      onDisconnected: handleDisconnect
+    })
+  ) : null;
+  return {
+    state,
+    connect,
+    disconnect,
+    toggleMute,
+    isMuted: muted,
+    error,
+    agentName: session?.agent_name,
+    audio
+  };
+}
+
+// src/ThunderPhoneWidget.tsx
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+function ThunderPhoneWidget({
+  apiKey,
+  agentId,
+  apiBase,
+  onConnect,
+  onDisconnect,
+  onError,
+  className
+}) {
+  const phone = useThunderPhone({ apiKey, agentId, apiBase, onConnect, onDisconnect, onError });
   const handleClick = () => {
-    if (state === "connected") {
-      handleDisconnect();
-    } else if (state === "idle" || state === "error" || state === "disconnected") {
-      handleConnect();
+    if (phone.state === "connected") {
+      phone.disconnect();
+    } else if (phone.state === "idle" || phone.state === "error" || phone.state === "disconnected") {
+      phone.connect();
     }
   };
-  const handleMuteToggle = useCallback(() => {
-    setMuted((m) => !m);
-  }, []);
   return /* @__PURE__ */ jsxs3("div", { className: `tp-widget ${className || ""}`, children: [
     /* @__PURE__ */ jsx4(
       WidgetStatus,
       {
-        state,
-        agentName: session?.agent_name || null,
-        errorMessage
+        state: phone.state,
+        agentName: phone.agentName || null,
+        errorMessage: phone.error
       }
     ),
     /* @__PURE__ */ jsx4(
       WidgetButton,
       {
-        state,
-        muted,
+        state: phone.state,
+        muted: phone.isMuted,
         onClick: handleClick,
-        onMuteToggle: handleMuteToggle
+        onMuteToggle: phone.toggleMute
       }
     ),
-    session && /* @__PURE__ */ jsx4(
-      LiveKitRoom,
-      {
-        token: session.token,
-        serverUrl: session.server_url,
-        audio: !muted,
-        video: false,
-        connect: true,
-        children: /* @__PURE__ */ jsx4(
-          AudioHandler,
-          {
-            onAgentConnected: handleAgentConnected,
-            onDisconnected: handleDisconnect
-          }
-        )
-      }
-    )
+    phone.audio
   ] });
 }
 export {
-  ThunderPhoneWidget
+  ThunderPhoneWidget,
+  useThunderPhone
 };
 //# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/ThunderPhoneWidget.tsx","../src/AudioHandler.tsx","../src/WidgetButton.tsx","../src/WidgetStatus.tsx","../src/api.ts"],"sourcesContent":["import { useCallback, useState } from 'react'\nimport { LiveKitRoom } from '@livekit/components-react'\nimport { AudioHandler } from './AudioHandler'\nimport { WidgetButton } from './WidgetButton'\nimport { WidgetStatus } from './WidgetStatus'\nimport { createWidgetSession, WidgetAPIError } from './api'\nimport type { ThunderPhoneWidgetProps, WidgetState, WidgetSessionResponse } from './types'\n\nexport function ThunderPhoneWidget({\n  apiKey,\n  agentId,\n  apiBase,\n  onConnect,\n  onDisconnect,\n  onError,\n  className,\n}: ThunderPhoneWidgetProps) {\n  const [state, setState] = useState<WidgetState>('idle')\n  const [session, setSession] = useState<WidgetSessionResponse | null>(null)\n  const [muted, setMuted] = useState(false)\n  const [errorMessage, setErrorMessage] = useState<string | undefined>()\n\n  const handleConnect = useCallback(async () => {\n    if (state === 'connecting' || state === 'connected') return\n    setState('connecting')\n    setErrorMessage(undefined)\n    try {\n      const sess = await createWidgetSession(apiKey, agentId, apiBase)\n      setSession(sess)\n    } catch (err) {\n      setState('error')\n      if (err instanceof WidgetAPIError) {\n        setErrorMessage(err.message)\n        onError?.({ error: err.code, message: err.message })\n      } else {\n        setErrorMessage('Unable to connect.')\n        onError?.({ error: 'unknown', message: 'Unable to connect.' })\n      }\n    }\n  }, [apiKey, agentId, apiBase, state, onError])\n\n  const handleDisconnect = useCallback(() => {\n    setState('disconnected')\n    setSession(null)\n    setMuted(false)\n    onDisconnect?.()\n    setTimeout(() => setState('idle'), 1500)\n  }, [onDisconnect])\n\n  const handleAgentConnected = useCallback(() => {\n    setState('connected')\n    onConnect?.()\n  }, [onConnect])\n\n  const handleClick = () => {\n    if (state === 'connected') {\n      handleDisconnect()\n    } else if (state === 'idle' || state === 'error' || state === 'disconnected') {\n      handleConnect()\n    }\n  }\n\n  const handleMuteToggle = useCallback(() => {\n    setMuted(m => !m)\n  }, [])\n\n  return (\n    <div className={`tp-widget ${className || ''}`}>\n      <WidgetStatus\n        state={state}\n        agentName={session?.agent_name || null}\n        errorMessage={errorMessage}\n      />\n      <WidgetButton\n        state={state}\n        muted={muted}\n        onClick={handleClick}\n        onMuteToggle={handleMuteToggle}\n      />\n      {session && (\n        <LiveKitRoom\n          token={session.token}\n          serverUrl={session.server_url}\n          audio={!muted}\n          video={false}\n          connect={true}\n        >\n          <AudioHandler\n            onAgentConnected={handleAgentConnected}\n            onDisconnected={handleDisconnect}\n          />\n        </LiveKitRoom>\n      )}\n    </div>\n  )\n}\n","import { useEffect, useRef } from 'react'\nimport { useRoomContext } from '@livekit/components-react'\nimport { RoomEvent, Track, type RemoteTrackPublication, type RemoteParticipant } from 'livekit-client'\n\ninterface AudioHandlerProps {\n  onAgentConnected: () => void\n  onDisconnected: () => void\n}\n\nexport function AudioHandler({ onAgentConnected, onDisconnected }: AudioHandlerProps) {\n  const room = useRoomContext()\n  const audioRef = useRef<HTMLAudioElement>(null)\n\n  useEffect(() => {\n    if (room.remoteParticipants.size > 0) {\n      onAgentConnected()\n    }\n\n    const handleParticipantConnected = () => onAgentConnected()\n    const handleDisconnect = () => onDisconnected()\n\n    const attachTrack = (\n      track: { kind: Track.Kind; mediaStreamTrack: MediaStreamTrack },\n      _pub: RemoteTrackPublication,\n      _participant: RemoteParticipant,\n    ) => {\n      if (track.kind === Track.Kind.Audio && audioRef.current) {\n        const stream = new MediaStream([track.mediaStreamTrack])\n        audioRef.current.srcObject = stream\n        audioRef.current.play().catch(() => {})\n      }\n    }\n\n    room.on(RoomEvent.ParticipantConnected, handleParticipantConnected)\n    room.on(RoomEvent.Disconnected, handleDisconnect)\n    room.on(RoomEvent.TrackSubscribed, attachTrack)\n\n    for (const participant of room.remoteParticipants.values()) {\n      for (const pub of participant.trackPublications.values()) {\n        if (pub.track && pub.isSubscribed && pub.track.kind === Track.Kind.Audio && audioRef.current) {\n          const stream = new MediaStream([pub.track.mediaStreamTrack])\n          audioRef.current.srcObject = stream\n          audioRef.current.play().catch(() => {})\n        }\n      }\n    }\n\n    return () => {\n      room.off(RoomEvent.ParticipantConnected, handleParticipantConnected)\n      room.off(RoomEvent.Disconnected, handleDisconnect)\n      room.off(RoomEvent.TrackSubscribed, attachTrack)\n    }\n  }, [room, onAgentConnected, onDisconnected])\n\n  return <audio ref={audioRef} autoPlay />\n}\n","import type { WidgetState } from './types'\n\ninterface WidgetButtonProps {\n  state: WidgetState\n  muted: boolean\n  onClick: () => void\n  onMuteToggle: () => void\n}\n\nexport function WidgetButton({ state, muted, onClick, onMuteToggle }: WidgetButtonProps) {\n  if (state === 'connected') {\n    return (\n      <div className=\"tp-button-group\">\n        <button className=\"tp-button tp-button--mute\" onClick={onMuteToggle} type=\"button\">\n          {muted ? (\n            <svg className=\"tp-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n              <line x1=\"1\" y1=\"1\" x2=\"23\" y2=\"23\" />\n              <path d=\"M9 9v3a3 3 0 0 0 5.12 2.12M15 9.34V4a3 3 0 0 0-5.94-.6\" />\n              <path d=\"M17 16.95A7 7 0 0 1 5 12v-2m14 0v2c0 .76-.13 1.49-.36 2.18\" />\n              <line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"23\" />\n              <line x1=\"8\" y1=\"23\" x2=\"16\" y2=\"23\" />\n            </svg>\n          ) : (\n            <svg className=\"tp-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n              <path d=\"M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z\" />\n              <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\" />\n              <line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"23\" />\n              <line x1=\"8\" y1=\"23\" x2=\"16\" y2=\"23\" />\n            </svg>\n          )}\n        </button>\n        <button className=\"tp-button tp-button--end\" onClick={onClick} type=\"button\">\n          <svg className=\"tp-icon\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <rect x=\"6\" y=\"6\" width=\"12\" height=\"12\" rx=\"2\" />\n          </svg>\n        </button>\n      </div>\n    )\n  }\n\n  return (\n    <button\n      className={`tp-button tp-button--start ${state === 'connecting' ? 'tp-button--loading' : ''}`}\n      onClick={onClick}\n      disabled={state === 'connecting'}\n      type=\"button\"\n    >\n      {state === 'connecting' ? (\n        <svg className=\"tp-icon tp-spin\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n          <path d=\"M21 12a9 9 0 1 1-6.219-8.56\" />\n        </svg>\n      ) : (\n        <svg className=\"tp-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n          <path d=\"M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z\" />\n          <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\" />\n          <line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"23\" />\n          <line x1=\"8\" y1=\"23\" x2=\"16\" y2=\"23\" />\n        </svg>\n      )}\n    </button>\n  )\n}\n","import { useEffect, useState } from 'react'\nimport type { WidgetState } from './types'\n\ninterface WidgetStatusProps {\n  state: WidgetState\n  agentName: string | null\n  errorMessage?: string\n}\n\nexport function WidgetStatus({ state, agentName, errorMessage }: WidgetStatusProps) {\n  const [elapsed, setElapsed] = useState(0)\n\n  useEffect(() => {\n    if (state !== 'connected') {\n      setElapsed(0)\n      return\n    }\n    const interval = setInterval(() => setElapsed(s => s + 1), 1000)\n    return () => clearInterval(interval)\n  }, [state])\n\n  const formatTime = (seconds: number) => {\n    const m = Math.floor(seconds / 60)\n    const s = seconds % 60\n    return `${m}:${s.toString().padStart(2, '0')}`\n  }\n\n  const statusText: Record<WidgetState, string> = {\n    idle: 'Ready',\n    connecting: 'Connecting...',\n    connected: formatTime(elapsed),\n    disconnected: 'Disconnected',\n    error: 'Unable to connect',\n  }\n\n  return (\n    <div className=\"tp-status\">\n      {agentName && <div className=\"tp-status__name\">{agentName}</div>}\n      <div className={`tp-status__text tp-status--${state}`}>\n        {state === 'connected' && <span className=\"tp-status__dot\" />}\n        {errorMessage && state === 'error' ? errorMessage : statusText[state]}\n      </div>\n    </div>\n  )\n}\n","import type { WidgetSessionResponse, WidgetError } from './types'\n\nconst DEFAULT_API_BASE = 'https://api.thunderphone.com/v1'\n\nexport class WidgetAPIError extends Error {\n  constructor(public code: string, message: string) {\n    super(message)\n    this.name = 'WidgetAPIError'\n  }\n}\n\nexport async function createWidgetSession(\n  apiKey: string,\n  agentId: number,\n  apiBase?: string,\n): Promise<WidgetSessionResponse> {\n  const base = apiBase || DEFAULT_API_BASE\n  const response = await fetch(`${base}/widget/session`, {\n    method: 'POST',\n    headers: {\n      'Content-Type': 'application/json',\n      'X-API-Key': apiKey,\n    },\n    body: JSON.stringify({ agent_id: agentId }),\n  })\n\n  if (!response.ok) {\n    const data: WidgetError = await response.json().catch(() => ({\n      error: 'unknown',\n      message: 'Unable to connect.',\n    }))\n    throw new WidgetAPIError(data.error, data.message)\n  }\n\n  return response.json()\n}\n"],"mappings":"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","names":["useState","jsx","useEffect","jsx","jsxs","jsx","jsxs","useState"]}
+{"version":3,"sources":["../src/WidgetButton.tsx","../src/WidgetStatus.tsx","../src/useThunderPhone.ts","../src/AudioHandler.tsx","../src/api.ts","../src/ThunderPhoneWidget.tsx"],"sourcesContent":["import type { WidgetState } from './types'\n\ninterface WidgetButtonProps {\n  state: WidgetState\n  muted: boolean\n  onClick: () => void\n  onMuteToggle: () => void\n}\n\nexport function WidgetButton({ state, muted, onClick, onMuteToggle }: WidgetButtonProps) {\n  if (state === 'connected') {\n    return (\n      <div className=\"tp-button-group\">\n        <button className=\"tp-button tp-button--mute\" onClick={onMuteToggle} type=\"button\">\n          {muted ? (\n            <svg className=\"tp-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n              <line x1=\"1\" y1=\"1\" x2=\"23\" y2=\"23\" />\n              <path d=\"M9 9v3a3 3 0 0 0 5.12 2.12M15 9.34V4a3 3 0 0 0-5.94-.6\" />\n              <path d=\"M17 16.95A7 7 0 0 1 5 12v-2m14 0v2c0 .76-.13 1.49-.36 2.18\" />\n              <line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"23\" />\n              <line x1=\"8\" y1=\"23\" x2=\"16\" y2=\"23\" />\n            </svg>\n          ) : (\n            <svg className=\"tp-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n              <path d=\"M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z\" />\n              <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\" />\n              <line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"23\" />\n              <line x1=\"8\" y1=\"23\" x2=\"16\" y2=\"23\" />\n            </svg>\n          )}\n        </button>\n        <button className=\"tp-button tp-button--end\" onClick={onClick} type=\"button\">\n          <svg className=\"tp-icon\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <rect x=\"6\" y=\"6\" width=\"12\" height=\"12\" rx=\"2\" />\n          </svg>\n        </button>\n      </div>\n    )\n  }\n\n  return (\n    <button\n      className={`tp-button tp-button--start ${state === 'connecting' ? 'tp-button--loading' : ''}`}\n      onClick={onClick}\n      disabled={state === 'connecting'}\n      type=\"button\"\n    >\n      {state === 'connecting' ? (\n        <svg className=\"tp-icon tp-spin\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n          <path d=\"M21 12a9 9 0 1 1-6.219-8.56\" />\n        </svg>\n      ) : (\n        <svg className=\"tp-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n          <path d=\"M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z\" />\n          <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\" />\n          <line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"23\" />\n          <line x1=\"8\" y1=\"23\" x2=\"16\" y2=\"23\" />\n        </svg>\n      )}\n    </button>\n  )\n}\n","import { useEffect, useState } from 'react'\nimport type { WidgetState } from './types'\n\ninterface WidgetStatusProps {\n  state: WidgetState\n  agentName: string | null\n  errorMessage?: string\n}\n\nexport function WidgetStatus({ state, agentName, errorMessage }: WidgetStatusProps) {\n  const [elapsed, setElapsed] = useState(0)\n\n  useEffect(() => {\n    if (state !== 'connected') {\n      setElapsed(0)\n      return\n    }\n    const interval = setInterval(() => setElapsed(s => s + 1), 1000)\n    return () => clearInterval(interval)\n  }, [state])\n\n  const formatTime = (seconds: number) => {\n    const m = Math.floor(seconds / 60)\n    const s = seconds % 60\n    return `${m}:${s.toString().padStart(2, '0')}`\n  }\n\n  const statusText: Record<WidgetState, string> = {\n    idle: 'Ready',\n    connecting: 'Connecting...',\n    connected: formatTime(elapsed),\n    disconnected: 'Disconnected',\n    error: 'Unable to connect',\n  }\n\n  return (\n    <div className=\"tp-status\">\n      {agentName && <div className=\"tp-status__name\">{agentName}</div>}\n      <div className={`tp-status__text tp-status--${state}`}>\n        {state === 'connected' && <span className=\"tp-status__dot\" />}\n        {errorMessage && state === 'error' ? errorMessage : statusText[state]}\n      </div>\n    </div>\n  )\n}\n","import { useCallback, useState, type ReactNode, createElement } from 'react'\nimport { LiveKitRoom } from '@livekit/components-react'\nimport { AudioHandler } from './AudioHandler'\nimport { createWidgetSession, WidgetAPIError } from './api'\nimport type { WidgetState, WidgetSessionResponse } from './types'\n\nexport interface UseThunderPhoneOptions {\n  apiKey: string\n  agentId: number\n  apiBase?: string\n  onConnect?: () => void\n  onDisconnect?: () => void\n  onError?: (error: { error: string; message: string }) => void\n}\n\nexport interface UseThunderPhoneReturn {\n  state: WidgetState\n  connect: () => void\n  disconnect: () => void\n  toggleMute: () => void\n  isMuted: boolean\n  error: string | undefined\n  agentName: string | undefined\n  /** Render this somewhere in your tree — it's invisible but handles audio. */\n  audio: ReactNode\n}\n\nexport function useThunderPhone(opts: UseThunderPhoneOptions): UseThunderPhoneReturn {\n  const [state, setState] = useState<WidgetState>('idle')\n  const [session, setSession] = useState<WidgetSessionResponse | null>(null)\n  const [muted, setMuted] = useState(false)\n  const [error, setError] = useState<string | undefined>()\n\n  const handleDisconnect = useCallback(() => {\n    setState('disconnected')\n    setSession(null)\n    setMuted(false)\n    opts.onDisconnect?.()\n    setTimeout(() => setState('idle'), 1500)\n  }, [opts.onDisconnect])\n\n  const handleAgentConnected = useCallback(() => {\n    setState('connected')\n    opts.onConnect?.()\n  }, [opts.onConnect])\n\n  const connect = useCallback(async () => {\n    if (state === 'connecting' || state === 'connected') return\n    setState('connecting')\n    setError(undefined)\n    try {\n      const sess = await createWidgetSession(opts.apiKey, opts.agentId, opts.apiBase)\n      setSession(sess)\n    } catch (err) {\n      setState('error')\n      if (err instanceof WidgetAPIError) {\n        setError(err.message)\n        opts.onError?.({ error: err.code, message: err.message })\n      } else {\n        setError('Unable to connect.')\n        opts.onError?.({ error: 'unknown', message: 'Unable to connect.' })\n      }\n    }\n  }, [opts.apiKey, opts.agentId, opts.apiBase, state, opts.onError])\n\n  const disconnect = useCallback(() => {\n    handleDisconnect()\n  }, [handleDisconnect])\n\n  const toggleMute = useCallback(() => setMuted(m => !m), [])\n\n  const audio: ReactNode = session\n    ? createElement(\n        LiveKitRoom,\n        {\n          token: session.token,\n          serverUrl: session.server_url,\n          audio: !muted,\n          video: false,\n          connect: true,\n        },\n        createElement(AudioHandler, {\n          onAgentConnected: handleAgentConnected,\n          onDisconnected: handleDisconnect,\n        }),\n      )\n    : null\n\n  return {\n    state,\n    connect,\n    disconnect,\n    toggleMute,\n    isMuted: muted,\n    error,\n    agentName: session?.agent_name,\n    audio,\n  }\n}\n","import { useEffect, useRef } from 'react'\nimport { useRoomContext } from '@livekit/components-react'\nimport { RoomEvent, Track, type RemoteTrackPublication, type RemoteParticipant } from 'livekit-client'\n\ninterface AudioHandlerProps {\n  onAgentConnected: () => void\n  onDisconnected: () => void\n}\n\nexport function AudioHandler({ onAgentConnected, onDisconnected }: AudioHandlerProps) {\n  const room = useRoomContext()\n  const audioRef = useRef<HTMLAudioElement>(null)\n\n  useEffect(() => {\n    if (room.remoteParticipants.size > 0) {\n      onAgentConnected()\n    }\n\n    const handleParticipantConnected = () => onAgentConnected()\n    const handleDisconnect = () => onDisconnected()\n\n    const attachTrack = (\n      track: { kind: Track.Kind; mediaStreamTrack: MediaStreamTrack },\n      _pub: RemoteTrackPublication,\n      _participant: RemoteParticipant,\n    ) => {\n      if (track.kind === Track.Kind.Audio && audioRef.current) {\n        const stream = new MediaStream([track.mediaStreamTrack])\n        audioRef.current.srcObject = stream\n        audioRef.current.play().catch(() => {})\n      }\n    }\n\n    room.on(RoomEvent.ParticipantConnected, handleParticipantConnected)\n    room.on(RoomEvent.Disconnected, handleDisconnect)\n    room.on(RoomEvent.TrackSubscribed, attachTrack)\n\n    for (const participant of room.remoteParticipants.values()) {\n      for (const pub of participant.trackPublications.values()) {\n        if (pub.track && pub.isSubscribed && pub.track.kind === Track.Kind.Audio && audioRef.current) {\n          const stream = new MediaStream([pub.track.mediaStreamTrack])\n          audioRef.current.srcObject = stream\n          audioRef.current.play().catch(() => {})\n        }\n      }\n    }\n\n    return () => {\n      room.off(RoomEvent.ParticipantConnected, handleParticipantConnected)\n      room.off(RoomEvent.Disconnected, handleDisconnect)\n      room.off(RoomEvent.TrackSubscribed, attachTrack)\n    }\n  }, [room, onAgentConnected, onDisconnected])\n\n  return <audio ref={audioRef} autoPlay />\n}\n","import type { WidgetSessionResponse, WidgetError } from './types'\n\nconst DEFAULT_API_BASE = 'https://api.thunderphone.com/v1'\n\nexport class WidgetAPIError extends Error {\n  constructor(public code: string, message: string) {\n    super(message)\n    this.name = 'WidgetAPIError'\n  }\n}\n\nexport async function createWidgetSession(\n  apiKey: string,\n  agentId: number,\n  apiBase?: string,\n): Promise<WidgetSessionResponse> {\n  const base = apiBase || DEFAULT_API_BASE\n  const response = await fetch(`${base}/widget/session`, {\n    method: 'POST',\n    headers: {\n      'Content-Type': 'application/json',\n      'X-API-Key': apiKey,\n    },\n    body: JSON.stringify({ agent_id: agentId }),\n  })\n\n  if (!response.ok) {\n    const data: WidgetError = await response.json().catch(() => ({\n      error: 'unknown',\n      message: 'Unable to connect.',\n    }))\n    throw new WidgetAPIError(data.error, data.message)\n  }\n\n  return response.json()\n}\n","import { WidgetButton } from './WidgetButton'\nimport { WidgetStatus } from './WidgetStatus'\nimport { useThunderPhone } from './useThunderPhone'\nimport type { ThunderPhoneWidgetProps } from './types'\n\nexport function ThunderPhoneWidget({\n  apiKey,\n  agentId,\n  apiBase,\n  onConnect,\n  onDisconnect,\n  onError,\n  className,\n}: ThunderPhoneWidgetProps) {\n  const phone = useThunderPhone({ apiKey, agentId, apiBase, onConnect, onDisconnect, onError })\n\n  const handleClick = () => {\n    if (phone.state === 'connected') {\n      phone.disconnect()\n    } else if (phone.state === 'idle' || phone.state === 'error' || phone.state === 'disconnected') {\n      phone.connect()\n    }\n  }\n\n  return (\n    <div className={`tp-widget ${className || ''}`}>\n      <WidgetStatus\n        state={phone.state}\n        agentName={phone.agentName || null}\n        errorMessage={phone.error}\n      />\n      <WidgetButton\n        state={phone.state}\n        muted={phone.isMuted}\n        onClick={handleClick}\n        onMuteToggle={phone.toggleMute}\n      />\n      {phone.audio}\n    </div>\n  )\n}\n"],"mappings":";AAeY,SACE,KADF;AANL,SAAS,aAAa,EAAE,OAAO,OAAO,SAAS,aAAa,GAAsB;AACvF,MAAI,UAAU,aAAa;AACzB,WACE,qBAAC,SAAI,WAAU,mBACb;AAAA,0BAAC,YAAO,WAAU,6BAA4B,SAAS,cAAc,MAAK,UACvE,kBACC,qBAAC,SAAI,WAAU,WAAU,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,KACzF;AAAA,4BAAC,UAAK,IAAG,KAAI,IAAG,KAAI,IAAG,MAAK,IAAG,MAAK;AAAA,QACpC,oBAAC,UAAK,GAAE,0DAAyD;AAAA,QACjE,oBAAC,UAAK,GAAE,8DAA6D;AAAA,QACrE,oBAAC,UAAK,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK;AAAA,QACtC,oBAAC,UAAK,IAAG,KAAI,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK;AAAA,SACvC,IAEA,qBAAC,SAAI,WAAU,WAAU,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,KACzF;AAAA,4BAAC,UAAK,GAAE,wDAAuD;AAAA,QAC/D,oBAAC,UAAK,GAAE,8BAA6B;AAAA,QACrC,oBAAC,UAAK,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK;AAAA,QACtC,oBAAC,UAAK,IAAG,KAAI,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK;AAAA,SACvC,GAEJ;AAAA,MACA,oBAAC,YAAO,WAAU,4BAA2B,SAAkB,MAAK,UAClE,8BAAC,SAAI,WAAU,WAAU,SAAQ,aAAY,MAAK,gBAChD,8BAAC,UAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,KAAI,GAClD,GACF;AAAA,OACF;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,8BAA8B,UAAU,eAAe,uBAAuB,EAAE;AAAA,MAC3F;AAAA,MACA,UAAU,UAAU;AAAA,MACpB,MAAK;AAAA,MAEJ,oBAAU,eACT,oBAAC,SAAI,WAAU,mBAAkB,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,KACjG,8BAAC,UAAK,GAAE,+BAA8B,GACxC,IAEA,qBAAC,SAAI,WAAU,WAAU,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,KACzF;AAAA,4BAAC,UAAK,GAAE,wDAAuD;AAAA,QAC/D,oBAAC,UAAK,GAAE,8BAA6B;AAAA,QACrC,oBAAC,UAAK,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK;AAAA,QACtC,oBAAC,UAAK,IAAG,KAAI,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK;AAAA,SACvC;AAAA;AAAA,EAEJ;AAEJ;;;AC7DA,SAAS,WAAW,gBAAgB;AAqChB,gBAAAA,MACd,QAAAC,aADc;AA5Bb,SAAS,aAAa,EAAE,OAAO,WAAW,aAAa,GAAsB;AAClF,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,CAAC;AAExC,YAAU,MAAM;AACd,QAAI,UAAU,aAAa;AACzB,iBAAW,CAAC;AACZ;AAAA,IACF;AACA,UAAM,WAAW,YAAY,MAAM,WAAW,OAAK,IAAI,CAAC,GAAG,GAAI;AAC/D,WAAO,MAAM,cAAc,QAAQ;AAAA,EACrC,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,aAAa,CAAC,YAAoB;AACtC,UAAM,IAAI,KAAK,MAAM,UAAU,EAAE;AACjC,UAAM,IAAI,UAAU;AACpB,WAAO,GAAG,CAAC,IAAI,EAAE,SAAS,EAAE,SAAS,GAAG,GAAG,CAAC;AAAA,EAC9C;AAEA,QAAM,aAA0C;AAAA,IAC9C,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,WAAW,WAAW,OAAO;AAAA,IAC7B,cAAc;AAAA,IACd,OAAO;AAAA,EACT;AAEA,SACE,gBAAAA,MAAC,SAAI,WAAU,aACZ;AAAA,iBAAa,gBAAAD,KAAC,SAAI,WAAU,mBAAmB,qBAAU;AAAA,IAC1D,gBAAAC,MAAC,SAAI,WAAW,8BAA8B,KAAK,IAChD;AAAA,gBAAU,eAAe,gBAAAD,KAAC,UAAK,WAAU,kBAAiB;AAAA,MAC1D,gBAAgB,UAAU,UAAU,eAAe,WAAW,KAAK;AAAA,OACtE;AAAA,KACF;AAEJ;;;AC5CA,SAAS,aAAa,YAAAE,WAA0B,qBAAqB;AACrE,SAAS,mBAAmB;;;ACD5B,SAAS,aAAAC,YAAW,cAAc;AAClC,SAAS,sBAAsB;AAC/B,SAAS,WAAW,aAAkE;AAoD7E,gBAAAC,YAAA;AA7CF,SAAS,aAAa,EAAE,kBAAkB,eAAe,GAAsB;AACpF,QAAM,OAAO,eAAe;AAC5B,QAAM,WAAW,OAAyB,IAAI;AAE9C,EAAAD,WAAU,MAAM;AACd,QAAI,KAAK,mBAAmB,OAAO,GAAG;AACpC,uBAAiB;AAAA,IACnB;AAEA,UAAM,6BAA6B,MAAM,iBAAiB;AAC1D,UAAM,mBAAmB,MAAM,eAAe;AAE9C,UAAM,cAAc,CAClB,OACA,MACA,iBACG;AACH,UAAI,MAAM,SAAS,MAAM,KAAK,SAAS,SAAS,SAAS;AACvD,cAAM,SAAS,IAAI,YAAY,CAAC,MAAM,gBAAgB,CAAC;AACvD,iBAAS,QAAQ,YAAY;AAC7B,iBAAS,QAAQ,KAAK,EAAE,MAAM,MAAM;AAAA,QAAC,CAAC;AAAA,MACxC;AAAA,IACF;AAEA,SAAK,GAAG,UAAU,sBAAsB,0BAA0B;AAClE,SAAK,GAAG,UAAU,cAAc,gBAAgB;AAChD,SAAK,GAAG,UAAU,iBAAiB,WAAW;AAE9C,eAAW,eAAe,KAAK,mBAAmB,OAAO,GAAG;AAC1D,iBAAW,OAAO,YAAY,kBAAkB,OAAO,GAAG;AACxD,YAAI,IAAI,SAAS,IAAI,gBAAgB,IAAI,MAAM,SAAS,MAAM,KAAK,SAAS,SAAS,SAAS;AAC5F,gBAAM,SAAS,IAAI,YAAY,CAAC,IAAI,MAAM,gBAAgB,CAAC;AAC3D,mBAAS,QAAQ,YAAY;AAC7B,mBAAS,QAAQ,KAAK,EAAE,MAAM,MAAM;AAAA,UAAC,CAAC;AAAA,QACxC;AAAA,MACF;AAAA,IACF;AAEA,WAAO,MAAM;AACX,WAAK,IAAI,UAAU,sBAAsB,0BAA0B;AACnE,WAAK,IAAI,UAAU,cAAc,gBAAgB;AACjD,WAAK,IAAI,UAAU,iBAAiB,WAAW;AAAA,IACjD;AAAA,EACF,GAAG,CAAC,MAAM,kBAAkB,cAAc,CAAC;AAE3C,SAAO,gBAAAC,KAAC,WAAM,KAAK,UAAU,UAAQ,MAAC;AACxC;;;ACrDA,IAAM,mBAAmB;AAElB,IAAM,iBAAN,cAA6B,MAAM;AAAA,EACxC,YAAmB,MAAc,SAAiB;AAChD,UAAM,OAAO;AADI;AAEjB,SAAK,OAAO;AAAA,EACd;AACF;AAEA,eAAsB,oBACpB,QACA,SACA,SACgC;AAChC,QAAM,OAAO,WAAW;AACxB,QAAM,WAAW,MAAM,MAAM,GAAG,IAAI,mBAAmB;AAAA,IACrD,QAAQ;AAAA,IACR,SAAS;AAAA,MACP,gBAAgB;AAAA,MAChB,aAAa;AAAA,IACf;AAAA,IACA,MAAM,KAAK,UAAU,EAAE,UAAU,QAAQ,CAAC;AAAA,EAC5C,CAAC;AAED,MAAI,CAAC,SAAS,IAAI;AAChB,UAAM,OAAoB,MAAM,SAAS,KAAK,EAAE,MAAM,OAAO;AAAA,MAC3D,OAAO;AAAA,MACP,SAAS;AAAA,IACX,EAAE;AACF,UAAM,IAAI,eAAe,KAAK,OAAO,KAAK,OAAO;AAAA,EACnD;AAEA,SAAO,SAAS,KAAK;AACvB;;;AFRO,SAAS,gBAAgB,MAAqD;AACnF,QAAM,CAAC,OAAO,QAAQ,IAAIC,UAAsB,MAAM;AACtD,QAAM,CAAC,SAAS,UAAU,IAAIA,UAAuC,IAAI;AACzE,QAAM,CAAC,OAAO,QAAQ,IAAIA,UAAS,KAAK;AACxC,QAAM,CAAC,OAAO,QAAQ,IAAIA,UAA6B;AAEvD,QAAM,mBAAmB,YAAY,MAAM;AACzC,aAAS,cAAc;AACvB,eAAW,IAAI;AACf,aAAS,KAAK;AACd,SAAK,eAAe;AACpB,eAAW,MAAM,SAAS,MAAM,GAAG,IAAI;AAAA,EACzC,GAAG,CAAC,KAAK,YAAY,CAAC;AAEtB,QAAM,uBAAuB,YAAY,MAAM;AAC7C,aAAS,WAAW;AACpB,SAAK,YAAY;AAAA,EACnB,GAAG,CAAC,KAAK,SAAS,CAAC;AAEnB,QAAM,UAAU,YAAY,YAAY;AACtC,QAAI,UAAU,gBAAgB,UAAU,YAAa;AACrD,aAAS,YAAY;AACrB,aAAS,MAAS;AAClB,QAAI;AACF,YAAM,OAAO,MAAM,oBAAoB,KAAK,QAAQ,KAAK,SAAS,KAAK,OAAO;AAC9E,iBAAW,IAAI;AAAA,IACjB,SAAS,KAAK;AACZ,eAAS,OAAO;AAChB,UAAI,eAAe,gBAAgB;AACjC,iBAAS,IAAI,OAAO;AACpB,aAAK,UAAU,EAAE,OAAO,IAAI,MAAM,SAAS,IAAI,QAAQ,CAAC;AAAA,MAC1D,OAAO;AACL,iBAAS,oBAAoB;AAC7B,aAAK,UAAU,EAAE,OAAO,WAAW,SAAS,qBAAqB,CAAC;AAAA,MACpE;AAAA,IACF;AAAA,EACF,GAAG,CAAC,KAAK,QAAQ,KAAK,SAAS,KAAK,SAAS,OAAO,KAAK,OAAO,CAAC;AAEjE,QAAM,aAAa,YAAY,MAAM;AACnC,qBAAiB;AAAA,EACnB,GAAG,CAAC,gBAAgB,CAAC;AAErB,QAAM,aAAa,YAAY,MAAM,SAAS,OAAK,CAAC,CAAC,GAAG,CAAC,CAAC;AAE1D,QAAM,QAAmB,UACrB;AAAA,IACE;AAAA,IACA;AAAA,MACE,OAAO,QAAQ;AAAA,MACf,WAAW,QAAQ;AAAA,MACnB,OAAO,CAAC;AAAA,MACR,OAAO;AAAA,MACP,SAAS;AAAA,IACX;AAAA,IACA,cAAc,cAAc;AAAA,MAC1B,kBAAkB;AAAA,MAClB,gBAAgB;AAAA,IAClB,CAAC;AAAA,EACH,IACA;AAEJ,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,WAAW,SAAS;AAAA,IACpB;AAAA,EACF;AACF;;;AGzEI,SACE,OAAAC,MADF,QAAAC,aAAA;AApBG,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA4B;AAC1B,QAAM,QAAQ,gBAAgB,EAAE,QAAQ,SAAS,SAAS,WAAW,cAAc,QAAQ,CAAC;AAE5F,QAAM,cAAc,MAAM;AACxB,QAAI,MAAM,UAAU,aAAa;AAC/B,YAAM,WAAW;AAAA,IACnB,WAAW,MAAM,UAAU,UAAU,MAAM,UAAU,WAAW,MAAM,UAAU,gBAAgB;AAC9F,YAAM,QAAQ;AAAA,IAChB;AAAA,EACF;AAEA,SACE,gBAAAA,MAAC,SAAI,WAAW,aAAa,aAAa,EAAE,IAC1C;AAAA,oBAAAD;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,MAAM;AAAA,QACb,WAAW,MAAM,aAAa;AAAA,QAC9B,cAAc,MAAM;AAAA;AAAA,IACtB;AAAA,IACA,gBAAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,MAAM;AAAA,QACb,OAAO,MAAM;AAAA,QACb,SAAS;AAAA,QACT,cAAc,MAAM;AAAA;AAAA,IACtB;AAAA,IACC,MAAM;AAAA,KACT;AAEJ;","names":["jsx","jsxs","useState","useEffect","jsx","useState","jsx","jsxs"]}