@cuekit-ai/react 1.2.2 → 1.3.0

package/dist/index.js

@@ -55,12 +55,223 @@ var init_globals = __esm({
   }
 });
 
+// src/core/intent-store.ts
+var store, GlobalStore;
+var init_intent_store = __esm({
+  "src/core/intent-store.ts"() {
+    "use strict";
+    store = {
+      screenMetadata: {},
+      allElementsData: []
+    };
+    GlobalStore = {
+      // 🔹 Screen Metadata Methods
+      setMetadata(screen, metadata) {
+        store.screenMetadata[screen] = metadata;
+      },
+      getMetadata(screen) {
+        return store.screenMetadata[screen];
+      },
+      clearMetadata(screen) {
+        delete store.screenMetadata[screen];
+      },
+      // 🔹 Generic Store Access Methods
+      setData(key, value) {
+        store[key] = value;
+      },
+      getData(key) {
+        return store[key];
+      },
+      clearData(key) {
+        delete store[key];
+      },
+      // 🔹 Element Data Management
+      setElement(elementData) {
+        const index2 = store.allElementsData.findIndex((e3) => e3.elementId === elementData.elementId);
+        if (index2 >= 0) {
+          console.log("Updating existing element");
+          store.allElementsData[index2] = elementData;
+        } else {
+          console.log("Adding new element");
+          store.allElementsData.push(elementData);
+        }
+      },
+      getElementById(elementId) {
+        const match = store.allElementsData.find((e3) => e3.elementId === elementId);
+        if (!match) {
+          console.warn(`[GlobalStore] No element found for ID: ${elementId}`);
+          console.log("All elements in store:", store.allElementsData);
+        }
+        return match;
+      },
+      deleteElementById(id) {
+        store.allElementsData = store.allElementsData.filter((e3) => e3.elementId !== id);
+      },
+      clearAllElements() {
+        store.allElementsData = [];
+      }
+    };
+  }
+});
+
+// src/core/navigation.ts
+function setNavigationHandler(handler) {
+  navigationHandler = handler;
+}
+function navigate(path2, params) {
+  const safeParams = params || {};
+  const absolutePath = path2.startsWith("/") ? path2 : `/${path2}`;
+  if (navigationHandler) {
+    try {
+      navigationHandler(absolutePath, safeParams);
+    } catch (error) {
+      console.error("[CueKit] navigation handler failed, falling back to default:", error);
+    }
+    return;
+  }
+  let fullPath = absolutePath;
+  if (safeParams) {
+    const searchParams = new URLSearchParams(safeParams).toString();
+    if (searchParams) {
+      fullPath += `?${searchParams}`;
+    }
+  }
+  if (navigation) {
+    navigation.push(fullPath);
+  } else {
+    if (typeof window !== "undefined") {
+      window.location.href = fullPath;
+    }
+  }
+}
+function getCurrentScreenName() {
+  try {
+    const path2 = getCurrentPath();
+    return path2 || "UnknownScreen";
+  } catch (e3) {
+    return "UnknownScreen";
+  }
+}
+function getCurrentRouteParams() {
+  try {
+    const params = {};
+    const searchParams = getSearchParams();
+    if (searchParams instanceof URLSearchParams) {
+      searchParams.forEach((value, key) => {
+        params[key] = value;
+      });
+    } else {
+      return searchParams;
+    }
+    return params;
+  } catch (e3) {
+    return {};
+  }
+}
+function onStateChange() {
+  const routeName = getCurrentScreenName();
+  const params = getCurrentRouteParams();
+  if (params && params.metadata) {
+    try {
+      const metadata = JSON.parse(params.metadata);
+      GlobalStore.setMetadata(routeName, metadata);
+    } catch (error) {
+      console.error("Failed to parse metadata from URL:", error);
+    }
+  }
+}
+function getElementPath(element3) {
+  if (element3.id) {
+    return `id(${element3.id})`;
+  }
+  const path2 = [];
+  let current = element3;
+  while (current && current !== document.body) {
+    let index2 = 1;
+    let sibling = current.previousElementSibling;
+    while (sibling) {
+      if (sibling.tagName === current.tagName) {
+        index2++;
+      }
+      sibling = sibling.previousElementSibling;
+    }
+    path2.unshift(`${current.tagName.toLowerCase()}[${index2}]`);
+    current = current.parentElement;
+  }
+  return path2.join("/");
+}
+var navigation, navigationHandler, getCurrentPath, getSearchParams, safeNavigate, handleNavigationAndClick;
+var init_navigation = __esm({
+  "src/core/navigation.ts"() {
+    "use strict";
+    init_intent_store();
+    navigationHandler = null;
+    getCurrentPath = () => {
+      if (typeof window === "undefined") return "";
+      return window.location.pathname;
+    };
+    getSearchParams = () => {
+      if (typeof window === "undefined") return new URLSearchParams();
+      return new URLSearchParams(window.location.search);
+    };
+    safeNavigate = (name2, params = {}) => {
+      if (name2) {
+        navigate(name2, params);
+      } else {
+        console.warn("[CueKit] route name not provided");
+      }
+    };
+    handleNavigationAndClick = (routeName, elementHash) => {
+      safeNavigate(routeName);
+      if (typeof MutationObserver === "undefined" || typeof document === "undefined") return;
+      const observer = new MutationObserver((mutationsList, observer2) => {
+        setTimeout(() => {
+          const allElements = document.querySelectorAll("*");
+          let elementToClick = null;
+          for (const element3 of allElements) {
+            if (element3 instanceof HTMLElement) {
+              const tagName = element3.tagName.toLowerCase();
+              const text7 = (element3.textContent || "").trim().substring(0, 50);
+              let sibling = element3.previousElementSibling;
+              let position3 = 1;
+              while (sibling) {
+                if (sibling.tagName === element3.tagName) {
+                  position3++;
+                }
+                sibling = sibling.previousElementSibling;
+              }
+              const path2 = getElementPath(element3);
+              const idString = `${tagName}[${position3}]_(${text7})_${path2}`;
+              let hash = 0;
+              for (let i2 = 0; i2 < idString.length; i2++) {
+                const char = idString.charCodeAt(i2);
+                hash = (hash << 5) - hash + char;
+                hash |= 0;
+              }
+              const elementHashValue = hash.toString(36);
+              if (elementHashValue === elementHash) {
+                elementToClick = element3;
+                break;
+              }
+            }
+          }
+          if (elementToClick) {
+            elementToClick.click();
+            observer2.disconnect();
+          }
+        }, 100);
+      });
+      observer.observe(document.body, { childList: true, subtree: true });
+    };
+  }
+});
+
 // src/constants/index.ts
 var WEBRTC_BACKEND_SERVER_URL;
 var init_constants = __esm({
   "src/constants/index.ts"() {
     "use strict";
-    WEBRTC_BACKEND_SERVER_URL = "https://api-webrtc.cuekit.ai";
+    WEBRTC_BACKEND_SERVER_URL = "https://api-webrtc-dev.cuekit.ai";
   }
 });
 
@@ -4472,15 +4683,15 @@ function requireSdp() {
       return Math.random().toString().substr(2, 22);
     };
     SDPUtils2.writeSessionBoilerplate = function(sessId, sessVer, sessUser) {
-      let sessionId2;
+      let sessionId;
       const version2 = sessVer !== void 0 ? sessVer : 2;
       if (sessId) {
-        sessionId2 = sessId;
+        sessionId = sessId;
       } else {
-        sessionId2 = SDPUtils2.generateSessionId();
+        sessionId = SDPUtils2.generateSessionId();
       }
       const user = sessUser || "thisisadapterortc";
-      return "v=0\r\no=" + user + " " + sessionId2 + " " + version2 + " IN IP4 127.0.0.1\r\ns=-\r\nt=0 0\r\n";
+      return "v=0\r\no=" + user + " " + sessionId + " " + version2 + " IN IP4 127.0.0.1\r\ns=-\r\nt=0 0\r\n";
     };
     SDPUtils2.getDirection = function(mediaSection, sessionpart) {
       const lines = SDPUtils2.splitLines(mediaSection);
@@ -5204,8 +5415,8 @@ function isWeb() {
 function isReactNative() {
   return navigator.product == "ReactNative";
 }
-function isCloud(serverUrl3) {
-  return serverUrl3.hostname.endsWith(".livekit.cloud") || serverUrl3.hostname.endsWith(".livekit.run");
+function isCloud(serverUrl2) {
+  return serverUrl2.hostname.endsWith(".livekit.cloud") || serverUrl2.hostname.endsWith(".livekit.run");
 }
 function getLKReactNativeInfo() {
   if (global && global.LiveKitReactNativeGlobal) {
@@ -7127,8 +7338,8 @@ function applyUserDataCompat(newObj, oldObj) {
   newObj.destinationIdentities = destinationIdentities;
   oldObj.destinationIdentities = destinationIdentities;
 }
-function getCloudConfigUrl(serverUrl3) {
-  return "".concat(serverUrl3.protocol.replace("ws", "http"), "//").concat(serverUrl3.host, "/settings");
+function getCloudConfigUrl(serverUrl2) {
+  return "".concat(serverUrl2.protocol.replace("ws", "http"), "//").concat(serverUrl2.host, "/settings");
 }
 function isElementInPiP(el) {
   var _a, _b;
@@ -22657,6 +22868,142 @@ var init_livekit_client_esm = __esm({
   }
 });
 
+// src/utils/jsx-encoder.ts
+function generateStableDOMId(element3) {
+  const tagName = element3.tagName.toLowerCase();
+  const text7 = (element3.textContent || "").trim().substring(0, 50);
+  let sibling = element3.previousElementSibling;
+  let position3 = 1;
+  while (sibling) {
+    if (sibling.tagName === element3.tagName) {
+      position3++;
+    }
+    sibling = sibling.previousElementSibling;
+  }
+  const path2 = getElementPath2(element3);
+  const idString = `${tagName}[${position3}]_(${text7})_${path2}`;
+  let hash = 0;
+  for (let i2 = 0; i2 < idString.length; i2++) {
+    const char = idString.charCodeAt(i2);
+    hash = (hash << 5) - hash + char;
+    hash |= 0;
+  }
+  return hash.toString(36);
+}
+function getElementPath2(element3) {
+  if (element3.id) {
+    return `id(${element3.id})`;
+  }
+  if (element3.tagName.toLowerCase() === "body") {
+    return "/body";
+  }
+  let ix = 0;
+  const siblings = element3.parentNode?.children || new HTMLCollection();
+  for (let i2 = 0; i2 < siblings.length; i2++) {
+    const sibling = siblings[i2];
+    if (sibling === element3) {
+      return `${getElementPath2(element3.parentNode)}/${element3.tagName}[${ix + 1}]`;
+    }
+    if (sibling.nodeType === 1 && sibling.tagName === element3.tagName) {
+      ix++;
+    }
+  }
+  return "not_found";
+}
+var init_jsx_encoder = __esm({
+  "src/utils/jsx-encoder.ts"() {
+    "use strict";
+  }
+});
+
+// src/utils/patch-react.ts
+function getImmediateText(element3) {
+  let text7 = "";
+  if (element3.childNodes) {
+    for (const node2 of Array.from(element3.childNodes)) {
+      if (node2.nodeType === 3) {
+        text7 += node2.textContent || "";
+      }
+    }
+  }
+  return text7.trim();
+}
+function captureFullDOMStructure() {
+  console.log("\u{1F333} Capturing full DOM structure...");
+  const components = [];
+  const interactiveElements = document.querySelectorAll(
+    'a, button, input, textarea, select, [role="button"], [onclick]'
+  );
+  interactiveElements.forEach((element3) => {
+    if (element3 instanceof HTMLElement && !element3.closest("[data-cuekit-ignore]")) {
+      const nodeData = buildFlatDOMNode(element3);
+      if (nodeData) {
+        components.push(nodeData);
+      }
+    }
+  });
+  const result = { components };
+  console.log("\u{1F333} Full DOM structure captured:", result);
+  return result;
+}
+function buildFlatDOMNode(element3) {
+  if (element3.tagName.toLowerCase() === "script" || element3.hasAttribute("data-cuekit-ignore") || element3.style.display === "none" || element3.style.visibility === "hidden") {
+    return null;
+  }
+  const hash = generateStableDOMId(element3);
+  const text7 = getImmediateText(element3).substring(0, 100);
+  const isClickable = isElementClickable(element3);
+  const componentType = element3.tagName.toLowerCase();
+  return {
+    hash,
+    text: text7,
+    isClickable,
+    componentType,
+    children: []
+    // No children in a flat structure
+  };
+}
+function isElementClickable(element3) {
+  const interactiveSelectors = [
+    "button",
+    "a",
+    "input",
+    "select",
+    "textarea",
+    '[role="button"]',
+    '[role="link"]',
+    '[role="tab"]',
+    "[data-onclick-id]",
+    "[data-on-press-id]",
+    "[onclick]",
+    "[onmousedown]",
+    "[onmouseup]",
+    "[ontouchstart]",
+    "[ontouchend]",
+    "[onkeydown]",
+    "[onkeyup]",
+    "[onkeypress]"
+  ];
+  for (const selector of interactiveSelectors) {
+    if (element3.matches(selector)) {
+      return true;
+    }
+  }
+  const hasClickEvents = element3.onclick !== null || element3.getAttribute("onclick") !== null;
+  const hasInteractiveEvents = element3.ontouchstart !== null || element3.getAttribute("ontouchstart") !== null || element3.ontouchend !== null || element3.getAttribute("ontouchend") !== null || element3.onkeydown !== null || element3.getAttribute("onkeydown") !== null || element3.onkeyup !== null || element3.getAttribute("onkeyup") !== null || element3.onkeypress !== null || element3.getAttribute("onkeypress") !== null;
+  const hasPointerCursor = element3.style.cursor === "pointer" || getComputedStyle(element3).cursor === "pointer";
+  const hasTabIndex = element3.hasAttribute("tabindex") && parseInt(element3.getAttribute("tabindex") || "0") >= 0;
+  const hasInteractiveDataAttrs = element3.hasAttribute("data-clickable") || element3.hasAttribute("data-interactive") || element3.hasAttribute("data-action") || element3.hasAttribute("data-handler");
+  const hasInteractiveAria = element3.hasAttribute("aria-pressed") || element3.hasAttribute("aria-expanded") || element3.hasAttribute("aria-selected") || element3.hasAttribute("aria-checked");
+  return hasClickEvents || hasInteractiveEvents || hasPointerCursor || hasTabIndex || hasInteractiveDataAttrs || hasInteractiveAria;
+}
+var init_patch_react = __esm({
+  "src/utils/patch-react.ts"() {
+    "use strict";
+    init_jsx_encoder();
+  }
+});
+
 // src/utils/webrtc-service.ts
 var webrtc_service_exports = {};
 __export(webrtc_service_exports, {
@@ -22668,6 +23015,7 @@ __export(webrtc_service_exports, {
   getRoomName: () => getRoomName,
   isConnected: () => isConnected,
   sendData: () => sendData,
+  sendRuntimeData: () => sendRuntimeData,
   sendScreenStatus: () => sendScreenStatus,
   sendStaticData: () => sendStaticData,
   sendUserCommand: () => sendUserCommand,
@@ -22787,19 +23135,17 @@ function setupEventListeners() {
   }).on(RoomEvent.TrackUnsubscribed, (track) => {
     track.detach().forEach((element3) => element3.remove());
   }).on(RoomEvent.DataReceived, (payload, participant) => {
-    handleDataReceived(payload, participant);
+    try {
+      const message = JSON.parse(new TextDecoder().decode(payload));
+      callbacks.onNavigationCommand?.(message);
+    } catch (error) {
+      const message = new TextDecoder().decode(payload);
+      callbacks.onNavigationCommand?.({ type: "raw_text", data: message });
+    }
   }).on(RoomEvent.Disconnected, () => {
     setWebRTCConnectionState({ isConnected: false, isConnecting: false });
   });
 }
-function handleDataReceived(payload, participant) {
-  try {
-    const message = JSON.parse(new TextDecoder().decode(payload));
-    callbacks.onNavigationCommand?.(message);
-  } catch (error) {
-    console.error("\u{1F3A4} WebRTCService: Error parsing data:", error);
-  }
-}
 function updateParticipantsList() {
   if (!room) return;
   const participants = [
@@ -22812,7 +23158,9 @@ function updateParticipantsList() {
 async function sendData(data, reliable = true) {
   if (!room) throw new Error("Not connected to room");
   try {
-    await room.localParticipant.publishData(new TextEncoder().encode(JSON.stringify(data)), {
+    const encoder = new TextEncoder();
+    const encodedData = encoder.encode(data);
+    await room.localParticipant.publishData(encodedData, {
       reliable
     });
   } catch (error) {
@@ -22843,14 +23191,28 @@ function getParticipants() {
 }
 async function sendUserCommand(command) {
   if (!room) return;
-  const userCommand = {
-    type: "user_command",
-    data: {
-      command,
-      timestamp: (/* @__PURE__ */ new Date()).toISOString()
-    }
-  };
-  await sendData(userCommand);
+  await sendData(command);
+}
+async function sendRuntimeData() {
+  if (!room) {
+    console.error("\u274C Cannot send runtime data without a room connection");
+    return;
+  }
+  try {
+    const domStructure = captureFullDOMStructure();
+    const screenName = getCurrentScreenName();
+    const response = {
+      type: "runtime_data_response",
+      data: {
+        components: domStructure.components,
+        current_screen: screenName
+      }
+    };
+    await sendData(JSON.stringify(response));
+    console.log("\u{1F4E6} Runtime data sent successfully");
+  } catch (error) {
+    console.error("\u274C Failed to send runtime data:", error);
+  }
 }
 async function sendStaticData(componentData, appId = "default") {
   try {
@@ -22881,10 +23243,6 @@ async function disconnectFromRoom() {
     await room.disconnect();
     room = null;
   }
-  if (eventSource) {
-    eventSource.close();
-    eventSource = null;
-  }
   if (reconnectTimeout) {
     clearTimeout(reconnectTimeout);
     reconnectTimeout = null;
@@ -22898,15 +23256,16 @@ async function disconnectFromRoom() {
 function getRoom() {
   return room;
 }
-var room, eventSource, reconnectTimeout, serverUrl, callbacks, audioContainerRef, livekitUrl, token, roomName;
+var room, reconnectTimeout, serverUrl, callbacks, audioContainerRef, livekitUrl, token, roomName;
 var init_webrtc_service = __esm({
   "src/utils/webrtc-service.ts"() {
     "use strict";
     init_livekit_client_esm();
     init_globals();
     init_constants();
+    init_patch_react();
+    init_navigation();
     room = null;
-    eventSource = null;
     reconnectTimeout = null;
     serverUrl = WEBRTC_BACKEND_SERVER_URL || "https://bdd4c945f073.ngrok-free.app";
     callbacks = {};
@@ -23258,19 +23617,11 @@ __export(index_exports, {
   VoiceIntensityVisualizer: () => VoiceIntensityVisualizer,
   captureFullDOMStructure: () => captureFullDOMStructure,
   configureWebRTCServer: () => configureWebRTCServer,
-  connectSSE: () => connectSSE,
-  disconnectSSE: () => disconnectSSE,
   executeAction: () => executeAction,
   getFullDOMStructure: () => getFullDOMStructure,
-  getSSEConnectionState: () => getSSEConnectionState,
-  getSSEConnectionStatus: () => getSSEConnectionStatus,
   getWebRTCServerConfig: () => getWebRTCServerConfig,
   initWebRTC: () => initWebRTC,
   initWebRTCWithDeployedBackend: () => initWebRTCWithDeployedBackend,
-  sendDashboardData: () => sendDashboardData,
-  sendElementData: () => sendElementData,
-  sendRuntimeData: () => sendRuntimeData,
-  setSSECallbacks: () => setSSECallbacks,
   useCuekit: () => useCuekit,
   useQubeContext: () => useQubeContext,
   useWebRTC: () => useWebRTC
@@ -23296,204 +23647,9 @@ function InitCuekit(config) {
   setWebRTCConfig(webRTCConfig);
 }
 
-// src/core/intent-store.ts
-var store = {
-  screenMetadata: {},
-  allElementsData: []
-};
-var GlobalStore = {
-  // 🔹 Screen Metadata Methods
-  setMetadata(screen, metadata) {
-    store.screenMetadata[screen] = metadata;
-  },
-  getMetadata(screen) {
-    return store.screenMetadata[screen];
-  },
-  clearMetadata(screen) {
-    delete store.screenMetadata[screen];
-  },
-  // 🔹 Generic Store Access Methods
-  setData(key, value) {
-    store[key] = value;
-  },
-  getData(key) {
-    return store[key];
-  },
-  clearData(key) {
-    delete store[key];
-  },
-  // 🔹 Element Data Management
-  setElement(elementData) {
-    const index2 = store.allElementsData.findIndex((e3) => e3.elementId === elementData.elementId);
-    if (index2 >= 0) {
-      console.log("Updating existing element");
-      store.allElementsData[index2] = elementData;
-    } else {
-      console.log("Adding new element");
-      store.allElementsData.push(elementData);
-    }
-  },
-  getElementById(elementId) {
-    const match = store.allElementsData.find((e3) => e3.elementId === elementId);
-    if (!match) {
-      console.warn(`[GlobalStore] No element found for ID: ${elementId}`);
-      console.log("All elements in store:", store.allElementsData);
-    }
-    return match;
-  },
-  deleteElementById(id) {
-    store.allElementsData = store.allElementsData.filter((e3) => e3.elementId !== id);
-  },
-  clearAllElements() {
-    store.allElementsData = [];
-  }
-};
-
-// src/core/navigation.ts
-var navigation;
-var navigationHandler = null;
-function setNavigationHandler(handler) {
-  navigationHandler = handler;
-}
-function navigate(path2, params) {
-  const safeParams = params || {};
-  const absolutePath = path2.startsWith("/") ? path2 : `/${path2}`;
-  if (navigationHandler) {
-    try {
-      navigationHandler(absolutePath, safeParams);
-    } catch (error) {
-      console.error("[CueKit] navigation handler failed, falling back to default:", error);
-    }
-    return;
-  }
-  let fullPath = absolutePath;
-  if (safeParams) {
-    const searchParams = new URLSearchParams(safeParams).toString();
-    if (searchParams) {
-      fullPath += `?${searchParams}`;
-    }
-  }
-  if (navigation) {
-    navigation.push(fullPath);
-  } else {
-    if (typeof window !== "undefined") {
-      window.location.href = fullPath;
-    }
-  }
-}
-var getCurrentPath = () => {
-  if (typeof window === "undefined") return "";
-  return window.location.pathname;
-};
-var getSearchParams = () => {
-  if (typeof window === "undefined") return new URLSearchParams();
-  return new URLSearchParams(window.location.search);
-};
-var safeNavigate = (name2, params = {}) => {
-  if (name2) {
-    navigate(name2, params);
-  } else {
-    console.warn("[CueKit] route name not provided");
-  }
-};
-function getCurrentScreenName() {
-  try {
-    const path2 = getCurrentPath();
-    return path2 || "UnknownScreen";
-  } catch (e3) {
-    return "UnknownScreen";
-  }
-}
-function getCurrentRouteParams() {
-  try {
-    const params = {};
-    const searchParams = getSearchParams();
-    if (searchParams instanceof URLSearchParams) {
-      searchParams.forEach((value, key) => {
-        params[key] = value;
-      });
-    } else {
-      return searchParams;
-    }
-    return params;
-  } catch (e3) {
-    return {};
-  }
-}
-function onStateChange() {
-  const routeName = getCurrentScreenName();
-  const params = getCurrentRouteParams();
-  if (params && params.metadata) {
-    try {
-      const metadata = JSON.parse(params.metadata);
-      GlobalStore.setMetadata(routeName, metadata);
-    } catch (error) {
-      console.error("Failed to parse metadata from URL:", error);
-    }
-  }
-}
-var handleNavigationAndClick = (routeName, elementHash) => {
-  safeNavigate(routeName);
-  if (typeof MutationObserver === "undefined" || typeof document === "undefined") return;
-  const observer = new MutationObserver((mutationsList, observer2) => {
-    setTimeout(() => {
-      const allElements = document.querySelectorAll("*");
-      let elementToClick = null;
-      for (const element3 of allElements) {
-        if (element3 instanceof HTMLElement) {
-          const tagName = element3.tagName.toLowerCase();
-          const text7 = (element3.textContent || "").trim().substring(0, 50);
-          let sibling = element3.previousElementSibling;
-          let position3 = 1;
-          while (sibling) {
-            if (sibling.tagName === element3.tagName) {
-              position3++;
-            }
-            sibling = sibling.previousElementSibling;
-          }
-          const path2 = getElementPath(element3);
-          const idString = `${tagName}[${position3}]_(${text7})_${path2}`;
-          let hash = 0;
-          for (let i2 = 0; i2 < idString.length; i2++) {
-            const char = idString.charCodeAt(i2);
-            hash = (hash << 5) - hash + char;
-            hash |= 0;
-          }
-          const elementHashValue = hash.toString(36);
-          if (elementHashValue === elementHash) {
-            elementToClick = element3;
-            break;
-          }
-        }
-      }
-      if (elementToClick) {
-        elementToClick.click();
-        observer2.disconnect();
-      }
-    }, 100);
-  });
-  observer.observe(document.body, { childList: true, subtree: true });
-};
-function getElementPath(element3) {
-  if (element3.id) {
-    return `id(${element3.id})`;
-  }
-  const path2 = [];
-  let current = element3;
-  while (current && current !== document.body) {
-    let index2 = 1;
-    let sibling = current.previousElementSibling;
-    while (sibling) {
-      if (sibling.tagName === current.tagName) {
-        index2++;
-      }
-      sibling = sibling.previousElementSibling;
-    }
-    path2.unshift(`${current.tagName.toLowerCase()}[${index2}]`);
-    current = current.parentElement;
-  }
-  return path2.join("/");
-}
+// src/providers/cuekit-provider.tsx
+init_navigation();
+init_intent_store();
 
 // src/utils/webrtc-config.ts
 init_constants();
@@ -23714,8 +23870,7 @@ var CuekitProvider = ({
 };
 
 // src/components/mic-button.tsx
-var import_react9 = __toESM(require("react"));
-var import_lucide_react2 = require("lucide-react");
+var import_react15 = __toESM(require("react"));
 
 // src/hooks/use-cuekit.ts
 var import_react3 = require("react");
@@ -23726,7 +23881,7 @@ init_livekit_client_esm();
 init_webrtc_service();
 init_globals();
 var useWebRTC = (options) => {
-  const [isConnected4, setIsConnected] = (0, import_react2.useState)(false);
+  const [isConnected3, setIsConnected] = (0, import_react2.useState)(false);
   const [isConnecting, setIsConnecting] = (0, import_react2.useState)(false);
   const [connectionState, setConnectionState] = (0, import_react2.useState)(null);
   const [participants, setParticipants] = (0, import_react2.useState)([]);
@@ -23790,7 +23945,7 @@ var useWebRTC = (options) => {
     return getParticipants().map((p) => p.identity);
   }, [participants]);
   return {
-    isConnected: isConnected4,
+    isConnected: isConnected3,
     isConnecting,
     connectionState,
     room: room2,
@@ -23807,335 +23962,12 @@ var useWebRTC = (options) => {
   };
 };
 
-// src/utils/sse-service.ts
-init_constants();
-
-// src/utils/jsx-encoder.ts
-function generateStableDOMId(element3) {
-  const tagName = element3.tagName.toLowerCase();
-  const text7 = (element3.textContent || "").trim().substring(0, 50);
-  let sibling = element3.previousElementSibling;
-  let position3 = 1;
-  while (sibling) {
-    if (sibling.tagName === element3.tagName) {
-      position3++;
-    }
-    sibling = sibling.previousElementSibling;
-  }
-  const path2 = getElementPath2(element3);
-  const idString = `${tagName}[${position3}]_(${text7})_${path2}`;
-  let hash = 0;
-  for (let i2 = 0; i2 < idString.length; i2++) {
-    const char = idString.charCodeAt(i2);
-    hash = (hash << 5) - hash + char;
-    hash |= 0;
-  }
-  return hash.toString(36);
-}
-function getElementPath2(element3) {
-  if (element3.id) {
-    return `id(${element3.id})`;
-  }
-  if (element3.tagName.toLowerCase() === "body") {
-    return "/body";
-  }
-  let ix = 0;
-  const siblings = element3.parentNode?.children || new HTMLCollection();
-  for (let i2 = 0; i2 < siblings.length; i2++) {
-    const sibling = siblings[i2];
-    if (sibling === element3) {
-      return `${getElementPath2(element3.parentNode)}/${element3.tagName}[${ix + 1}]`;
-    }
-    if (sibling.nodeType === 1 && sibling.tagName === element3.tagName) {
-      ix++;
-    }
-  }
-  return "not_found";
-}
-
-// src/utils/patch-react.ts
-function getImmediateText(element3) {
-  let text7 = "";
-  if (element3.childNodes) {
-    for (const node2 of Array.from(element3.childNodes)) {
-      if (node2.nodeType === 3) {
-        text7 += node2.textContent || "";
-      }
-    }
-  }
-  return text7.trim();
-}
-function captureFullDOMStructure() {
-  console.log("\u{1F333} Capturing full DOM structure...");
-  const components = [];
-  const interactiveElements = document.querySelectorAll(
-    'a, button, input, textarea, select, [role="button"], [onclick]'
-  );
-  interactiveElements.forEach((element3) => {
-    if (element3 instanceof HTMLElement && !element3.closest("[data-cuekit-ignore]")) {
-      const nodeData = buildFlatDOMNode(element3);
-      if (nodeData) {
-        components.push(nodeData);
-      }
-    }
-  });
-  const result = { components };
-  console.log("\u{1F333} Full DOM structure captured:", result);
-  return result;
-}
-function buildFlatDOMNode(element3) {
-  if (element3.tagName.toLowerCase() === "script" || element3.hasAttribute("data-cuekit-ignore") || element3.style.display === "none" || element3.style.visibility === "hidden") {
-    return null;
-  }
-  const hash = generateStableDOMId(element3);
-  const text7 = getImmediateText(element3).substring(0, 100);
-  const isClickable = isElementClickable(element3);
-  const componentType = element3.tagName.toLowerCase();
-  return {
-    hash,
-    text: text7,
-    isClickable,
-    componentType,
-    children: []
-    // No children in a flat structure
-  };
-}
-function isElementClickable(element3) {
-  const interactiveSelectors = [
-    "button",
-    "a",
-    "input",
-    "select",
-    "textarea",
-    '[role="button"]',
-    '[role="link"]',
-    '[role="tab"]',
-    "[data-onclick-id]",
-    "[data-on-press-id]",
-    "[onclick]",
-    "[onmousedown]",
-    "[onmouseup]",
-    "[ontouchstart]",
-    "[ontouchend]",
-    "[onkeydown]",
-    "[onkeyup]",
-    "[onkeypress]"
-  ];
-  for (const selector of interactiveSelectors) {
-    if (element3.matches(selector)) {
-      return true;
-    }
-  }
-  const hasClickEvents = element3.onclick !== null || element3.getAttribute("onclick") !== null;
-  const hasInteractiveEvents = element3.ontouchstart !== null || element3.getAttribute("ontouchstart") !== null || element3.ontouchend !== null || element3.getAttribute("ontouchend") !== null || element3.onkeydown !== null || element3.getAttribute("onkeydown") !== null || element3.onkeyup !== null || element3.getAttribute("onkeyup") !== null || element3.onkeypress !== null || element3.getAttribute("onkeypress") !== null;
-  const hasPointerCursor = element3.style.cursor === "pointer" || getComputedStyle(element3).cursor === "pointer";
-  const hasTabIndex = element3.hasAttribute("tabindex") && parseInt(element3.getAttribute("tabindex") || "0") >= 0;
-  const hasInteractiveDataAttrs = element3.hasAttribute("data-clickable") || element3.hasAttribute("data-interactive") || element3.hasAttribute("data-action") || element3.hasAttribute("data-handler");
-  const hasInteractiveAria = element3.hasAttribute("aria-pressed") || element3.hasAttribute("aria-expanded") || element3.hasAttribute("aria-selected") || element3.hasAttribute("aria-checked");
-  return hasClickEvents || hasInteractiveEvents || hasPointerCursor || hasTabIndex || hasInteractiveDataAttrs || hasInteractiveAria;
-}
-
-// src/utils/sse-service.ts
-init_globals();
-var eventSource2 = null;
-var isConnected3 = false;
-var serverUrl2 = WEBRTC_BACKEND_SERVER_URL || "https://bdd4c945f073.ngrok-free.app";
-var callbacks2 = {};
-var sessionId = null;
-function setSSECallbacks(newCallbacks) {
-  callbacks2 = newCallbacks;
-}
-async function connectSSE(newSessionId) {
-  if (eventSource2) {
-    eventSource2.close();
-  }
-  if (typeof EventSource === "undefined") {
-    console.warn("\u{1F527} EventSource not available, SSE functionality disabled");
-    callbacks2.onError?.("EventSource not available");
-    return;
-  }
-  try {
-    const url = `${serverUrl2}/navigation/stream?session_id=${newSessionId}`;
-    eventSource2 = new EventSource(url);
-    sessionId = newSessionId;
-    eventSource2.onopen = () => {
-      console.log("\u{1F517} SSE connection opened");
-      isConnected3 = true;
-      callbacks2.onConnectionChange?.(true);
-    };
-    eventSource2.onmessage = (event) => {
-      console.log("\u{1F4E1} SSE MESSAGE RECEIVED:", event.data);
-      try {
-        const data = JSON.parse(event.data);
-        console.log("\u{1F4E1} SSE MESSAGE PARSED:", data);
-        handleSSEMessage(data);
-      } catch (error) {
-        console.error("\u274C Failed to parse SSE message:", error);
-      }
-    };
-    eventSource2.onerror = (error) => {
-      console.error("\u274C SSE connection error:", error);
-      isConnected3 = false;
-      callbacks2.onConnectionChange?.(false);
-      callbacks2.onError?.("SSE connection failed");
-    };
-  } catch (error) {
-    console.error("\u274C Failed to create SSE connection:", error);
-    callbacks2.onError?.("Failed to create SSE connection");
-  }
-}
-function handleSSEMessage(data) {
-  console.log("\u{1F50D} Processing SSE message type:", data.type);
-  console.log("\u{1F50D} Full SSE data:", data);
-  console.log("\u{1F50D} SSE data.data:", data.data);
-  const actionEvent = data;
-  console.log("\u{1F50D} Created action event:", actionEvent);
-  callbacks2.onActionEvent?.(actionEvent);
-  switch (actionEvent.type) {
-    case "static_data_ready":
-      console.log("\u{1F4E6} Handling static_data_ready event");
-      callbacks2.onStaticDataUpdate?.(actionEvent.data);
-      break;
-    case "ai_intent":
-      console.log("\u{1F3AF} Handling ai_intent event");
-      callbacks2.onIntentUpdate?.(actionEvent.data);
-      break;
-    case "request_runtime_data":
-      console.log("\u{1F4E6} Handling request_runtime_data event");
-      sendRuntimeData();
-      break;
-    case "user_speech_chunk":
-      console.log("\u{1F464} Handling user_speech_chunk event");
-      const userSpeechEntry = {
-        speaker: "user",
-        text: actionEvent.data?.text_chunk,
-        is_final: actionEvent.data?.is_final
-      };
-      callbacks2.onConversationUpdate?.(userSpeechEntry);
-      break;
-    case "ai_speech_chunk":
-      console.log("\u{1F916} Handling ai_speech_chunk event");
-      callbacks2.onConversationUpdate?.({
-        speaker: "ai",
-        text: actionEvent.data?.text_chunk,
-        is_final: actionEvent.data?.is_final
-      });
-      break;
-    case "ai_interrupted":
-      console.log("\u{1F507} Handling ai_interrupted event");
-      break;
-    case "tool_log":
-      console.log("\u{1F527} Handling tool_log event");
-      callbacks2.onToolStatusUpdate?.(actionEvent.data);
-      break;
-    case "connection":
-      console.log("\u{1F517} Handling connection event");
-      break;
-    case "keepalive":
-      console.log("\u{1F493} Handling keepalive event");
-      break;
-    default:
-      console.log("\u{1F50D} Unknown SSE message type:", data.type);
-  }
-}
-async function sendRuntimeData() {
-  if (!sessionId) {
-    console.error("\u274C Cannot send runtime data without a session ID");
-    return;
-  }
-  try {
-    const domStructure = captureFullDOMStructure();
-    const screenName = getCurrentScreenName();
-    const response = await fetch(`${serverUrl2}/api/runtime/data/${sessionId}`, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        Authorization: `Bearer ${_apiKey}`
-      },
-      body: JSON.stringify({
-        session_id: sessionId,
-        components: domStructure.components,
-        screen: screenName
-      })
-    });
-    if (!response.ok) {
-      const errorData = await response.json();
-      throw new Error(errorData.detail || "Failed to send runtime data");
-    }
-    console.log("\u{1F4E6} Runtime data sent successfully");
-  } catch (error) {
-    console.error("\u274C Failed to send runtime data:", error);
-    callbacks2.onError?.("Failed to send runtime data");
-  }
-}
-async function sendDashboardData(dashboardData) {
-  try {
-    console.log("\u{1F4E4} SSEService: Sending dashboard data...");
-    const response = await fetch(`${serverUrl2}/ai/data`, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json"
-      },
-      body: JSON.stringify({
-        type: "dashboard_data",
-        data: dashboardData
-      })
-    });
-    if (!response.ok) {
-      throw new Error(`HTTP ${response.status}: ${response.statusText}`);
-    }
-    console.log("\u2705 SSEService: Dashboard data sent successfully");
-  } catch (error) {
-    console.error("\u274C SSEService: Failed to send dashboard data:", error);
-  }
-}
-async function sendElementData(appId = "default") {
-  try {
-    console.log("\u{1F4E4} SSEService: Sending element data...");
-    const domStructure = captureFullDOMStructure();
-    const currentPage = getCurrentScreenName();
-    const elementData = {
-      app_id: appId,
-      current_page: currentPage,
-      dom_structure: domStructure,
-      timestamp: Date.now()
-    };
-    const response = await fetch(`${serverUrl2}/ai/data`, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json"
-      },
-      body: JSON.stringify(elementData)
-    });
-    if (!response.ok) {
-      throw new Error(`HTTP ${response.status}: ${response.statusText}`);
-    }
-    console.log("\u2705 SSEService: Element data sent successfully");
-    return elementData;
-  } catch (error) {
-    console.error("\u274C SSEService: Failed to send element data:", error);
-    throw error;
-  }
-}
-function disconnectSSE() {
-  console.log("\u{1F50C} SSEService: Disconnecting SSE...");
-  if (eventSource2) {
-    eventSource2.close();
-    eventSource2 = null;
-  }
-  isConnected3 = false;
-  callbacks2.onConnectionChange?.(false);
-}
-function getSSEConnectionStatus() {
-  return isConnected3 && eventSource2?.readyState === EventSource.OPEN;
-}
-function getSSEConnectionState() {
-  if (isConnected3 && eventSource2?.readyState === EventSource.OPEN) return "connected";
-  if (eventSource2?.readyState === EventSource.CONNECTING) return "connecting";
-  return "disconnected";
-}
+// src/hooks/use-cuekit.ts
+init_webrtc_service();
 
 // src/utils/element-service.ts
+init_patch_react();
+init_navigation();
 function executeAction(action) {
   console.log("\u{1F3AF} Executing element action:", action);
   const { action_type, target_element, target } = action;
@@ -24320,89 +24152,83 @@ var useCuekit = (options) => {
   }, []);
   const [micState, setMicState] = (0, import_react3.useState)("idle");
   const [status, setStatus] = (0, import_react3.useState)("");
-  const [isSseConnected, setIsSseConnected] = (0, import_react3.useState)(false);
-  const [lastActionEvent, setLastActionEvent] = (0, import_react3.useState)(null);
-  (0, import_react3.useEffect)(() => {
-    setSSECallbacks({
-      onActionEvent: (event) => {
-        setLastActionEvent(event);
-        switch (event.type) {
-          case "user_speech_chunk":
-          case "ai_speech_chunk": {
-            const role = event.type === "user_speech_chunk" ? "user" : "ai";
-            if (role === "user" && currentAIMessageRef.current) {
-              const finalMessageId = currentAIMessageRef.current.id;
-              setMessages(
-                (prev) => prev.map((m) => m.id === finalMessageId ? { ...m, isFinal: true } : m)
-              );
-              currentAIMessageRef.current = null;
-            }
-            if (role === "ai" && currentUserMessageRef.current) {
-              const finalMessageId = currentUserMessageRef.current.id;
-              setMessages(
-                (prev) => prev.map((m) => m.id === finalMessageId ? { ...m, isFinal: true } : m)
-              );
-              currentUserMessageRef.current = null;
-            }
-            const entry = {
-              speaker: role,
-              text: event.data.text_chunk,
-              is_final: event.data.is_final,
-              timestamp: new Date(event.timestamp || Date.now()).toISOString()
-            };
-            handleMessageChunk(entry.text, entry.speaker, entry.is_final);
-            if (entry.is_final) {
-              if (entry.speaker === "user") {
-                setMicState("thinking");
-              } else if (entry.speaker === "ai") {
-                setTimeout(() => setMicState("listening"), 1e3);
-              }
-            }
-            break;
-          }
-          case "ai_intent": {
-            const intent = event.data;
-            if (intent.actionType === "click" && intent.actionMetadata.elementId) {
-              executeAction({
-                action_type: "click",
-                target_element: intent.actionMetadata.elementId
-              });
-            } else if (intent.actionType === "navigate" && intent.actionMetadata.routeName) {
-              executeAction({
-                action_type: "navigate",
-                target_element: intent.actionMetadata.routeName
-              });
-            }
-            break;
-          }
-          case "ai_interrupted": {
-            handleAIInterruption();
-            break;
-          }
-          case "keepalive": {
-            if (currentUserMessageRef.current) {
-              const finalMessageId = currentUserMessageRef.current.id;
-              setMessages(
-                (prev) => prev.map((m) => m.id === finalMessageId ? { ...m, isFinal: true } : m)
-              );
-              currentUserMessageRef.current = null;
-            }
-            if (currentAIMessageRef.current) {
-              const finalMessageId = currentAIMessageRef.current.id;
-              setMessages(
-                (prev) => prev.map((m) => m.id === finalMessageId ? { ...m, isFinal: true } : m)
-              );
-              currentAIMessageRef.current = null;
-            }
-            break;
+  const handleNavigationCommand = (event) => {
+    switch (event.type) {
+      case "user_speech_chunk":
+      case "ai_speech_chunk": {
+        const role = event.type === "user_speech_chunk" ? "user" : "ai";
+        if (role === "user" && currentAIMessageRef.current) {
+          const finalMessageId = currentAIMessageRef.current.id;
+          setMessages(
+            (prev) => prev.map((m) => m.id === finalMessageId ? { ...m, isFinal: true } : m)
+          );
+          currentAIMessageRef.current = null;
+        }
+        if (role === "ai" && currentUserMessageRef.current) {
+          const finalMessageId = currentUserMessageRef.current.id;
+          setMessages(
+            (prev) => prev.map((m) => m.id === finalMessageId ? { ...m, isFinal: true } : m)
+          );
+          currentUserMessageRef.current = null;
+        }
+        const entry = {
+          speaker: role,
+          text: event.data.text_chunk,
+          is_final: event.data.is_final,
+          timestamp: new Date(event.timestamp || Date.now()).toISOString()
+        };
+        handleMessageChunk(entry.text, entry.speaker, entry.is_final);
+        if (entry.is_final) {
+          if (entry.speaker === "user") {
+            setMicState("thinking");
+          } else if (entry.speaker === "ai") {
+            setTimeout(() => setMicState("listening"), 1e3);
           }
         }
-      },
-      onConnectionChange: (isConnected4) => {
-        setIsSseConnected(isConnected4);
+        break;
       }
-    });
-  }, [handleMessageChunk, handleAIInterruption]);
+      case "ai_intent": {
+        const intent = event.data;
+        if (intent.actionType === "click" && intent.actionMetadata.elementId) {
+          executeAction({
+            action_type: "click",
+            target_element: intent.actionMetadata.elementId
+          });
+        } else if (intent.actionType === "navigate" && intent.actionMetadata.routeName) {
+          executeAction({
+            action_type: "navigate",
+            target_element: intent.actionMetadata.routeName
+          });
+        }
+        break;
+      }
+      case "request_runtime_data": {
+        sendRuntimeData();
+        break;
+      }
+      case "ai_interrupted": {
+        handleAIInterruption();
+        break;
+      }
+      case "keepalive": {
+        if (currentUserMessageRef.current) {
+          const finalMessageId = currentUserMessageRef.current.id;
+          setMessages(
+            (prev) => prev.map((m) => m.id === finalMessageId ? { ...m, isFinal: true } : m)
+          );
+          currentUserMessageRef.current = null;
+        }
+        if (currentAIMessageRef.current) {
+          const finalMessageId = currentAIMessageRef.current.id;
+          setMessages(
+            (prev) => prev.map((m) => m.id === finalMessageId ? { ...m, isFinal: true } : m)
+          );
+          currentAIMessageRef.current = null;
+        }
+        break;
+      }
+    }
+  };
   const handleConnectionStateChange = (state) => {
     switch (state) {
       case "connecting":
@@ -24426,32 +24252,22 @@ var useCuekit = (options) => {
   };
   const webrtc = useWebRTC({
     ...options,
-    onConnectionStateChange: handleConnectionStateChange
+    onConnectionStateChange: handleConnectionStateChange,
+    onNavigationCommand: handleNavigationCommand
   });
   const connect = (0, import_react3.useCallback)(
     async (identity, apiKey, appId) => {
-      const authData = await webrtc.connect(identity, apiKey, appId);
-      if (authData?.session_id) {
-        connectSSE(authData.session_id);
-      }
+      await webrtc.connect(identity, apiKey, appId);
     },
     [webrtc]
   );
   const disconnect = (0, import_react3.useCallback)(async () => {
     await webrtc.disconnect();
-    disconnectSSE();
     clearMessages();
     setMicState("idle");
   }, [webrtc, clearMessages]);
-  (0, import_react3.useEffect)(() => {
-    if (lastActionEvent?.type === "ai_interrupted") {
-      handleAIInterruption();
-    }
-  }, [lastActionEvent, handleAIInterruption]);
   return {
     ...webrtc,
-    isSseConnected,
-    lastActionEvent,
     messages,
     micState,
     setMicState,
@@ -24463,8 +24279,7 @@ var useCuekit = (options) => {
 };
 
 // src/components/chat-popup.tsx
-var import_react5 = __toESM(require("react"));
-var import_lucide_react = require("lucide-react");
+var import_react9 = __toESM(require("react"));
 
 // node_modules/devlop/lib/default.js
 function ok() {
@@ -37105,6 +36920,109 @@ function remarkGfm(options) {
   toMarkdownExtensions.push(gfmToMarkdown(settings));
 }
 
+// src/components/svgs/sun.tsx
+var import_react5 = __toESM(require("react"));
+var SunIcon = ({ width = 24, height = 24, className, ...props }) => {
+  return /* @__PURE__ */ import_react5.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      className,
+      ...props
+    },
+    /* @__PURE__ */ import_react5.default.createElement("circle", { cx: "12", cy: "12", r: "4" }),
+    /* @__PURE__ */ import_react5.default.createElement("path", { d: "M12 2v2" }),
+    /* @__PURE__ */ import_react5.default.createElement("path", { d: "M12 20v2" }),
+    /* @__PURE__ */ import_react5.default.createElement("path", { d: "m4.93 4.93 1.41 1.41" }),
+    /* @__PURE__ */ import_react5.default.createElement("path", { d: "m17.66 17.66 1.41 1.41" }),
+    /* @__PURE__ */ import_react5.default.createElement("path", { d: "M2 12h2" }),
+    /* @__PURE__ */ import_react5.default.createElement("path", { d: "M20 12h2" }),
+    /* @__PURE__ */ import_react5.default.createElement("path", { d: "m6.34 17.66-1.41 1.41" }),
+    /* @__PURE__ */ import_react5.default.createElement("path", { d: "m19.07 4.93-1.41 1.41" })
+  );
+};
+var sun_default = SunIcon;
+
+// src/components/svgs/moon.tsx
+var import_react6 = __toESM(require("react"));
+var MoonIcon = ({ width = 24, height = 24, className, ...props }) => {
+  return /* @__PURE__ */ import_react6.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      className,
+      ...props
+    },
+    /* @__PURE__ */ import_react6.default.createElement("path", { d: "M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401" })
+  );
+};
+var moon_default = MoonIcon;
+
+// src/components/svgs/close.tsx
+var import_react7 = __toESM(require("react"));
+var CloseIcon = ({ width = 24, height = 24, className, ...props }) => {
+  return /* @__PURE__ */ import_react7.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      className,
+      ...props
+    },
+    /* @__PURE__ */ import_react7.default.createElement("path", { d: "M18 6 6 18" }),
+    /* @__PURE__ */ import_react7.default.createElement("path", { d: "m6 6 12 12" })
+  );
+};
+var close_default = CloseIcon;
+
+// src/components/svgs/phone-off.tsx
+var import_react8 = __toESM(require("react"));
+var PhoneOffIcon = ({ width = 24, height = 24, className, ...props }) => {
+  return /* @__PURE__ */ import_react8.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      className,
+      ...props
+    },
+    /* @__PURE__ */ import_react8.default.createElement("path", { 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" }),
+    /* @__PURE__ */ import_react8.default.createElement("path", { d: "M22 2 2 22" }),
+    /* @__PURE__ */ import_react8.default.createElement("path", { 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" })
+  );
+};
+var phone_off_default = PhoneOffIcon;
+
 // src/components/chat-popup.tsx
 var ChatPopup = ({
   isOpen,
@@ -37115,7 +37033,7 @@ var ChatPopup = ({
   onSendText,
   onEndCall,
   messages,
-  isConnected: isConnected4,
+  isConnected: isConnected3,
   micState,
   error,
   currentTheme = "dark",
@@ -37123,13 +37041,13 @@ var ChatPopup = ({
   status,
   anchor
 }) => {
-  const [inputText, setInputText] = (0, import_react5.useState)("");
-  const [isSending, setIsSending] = (0, import_react5.useState)(false);
-  const messagesEndRef = (0, import_react5.useRef)(null);
+  const [inputText, setInputText] = (0, import_react9.useState)("");
+  const [isSending, setIsSending] = (0, import_react9.useState)(false);
+  const messagesEndRef = (0, import_react9.useRef)(null);
   const scrollToBottom = () => {
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
   };
-  (0, import_react5.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     console.log("\u{1F4EC} ChatPopup received messages:", JSON.stringify(messages, null, 2));
     scrollToBottom();
   }, [messages]);
@@ -37191,7 +37109,7 @@ var ChatPopup = ({
     }
   };
   const positionStyle = getPositionStyle();
-  return /* @__PURE__ */ import_react5.default.createElement(
+  return /* @__PURE__ */ import_react9.default.createElement(
     "div",
     {
       "data-cuekit-ignore": true,
@@ -37214,7 +37132,7 @@ var ChatPopup = ({
         ...positionStyle
       }
     },
-    /* @__PURE__ */ import_react5.default.createElement(
+    /* @__PURE__ */ import_react9.default.createElement(
       "div",
       {
         style: {
@@ -37225,14 +37143,14 @@ var ChatPopup = ({
           justifyContent: "space-between"
         }
       },
-      /* @__PURE__ */ import_react5.default.createElement("div", { style: { display: "flex", alignItems: "center", gap: 0 } }, /* @__PURE__ */ import_react5.default.createElement(
+      /* @__PURE__ */ import_react9.default.createElement("div", { style: { display: "flex", alignItems: "center", gap: 0 } }, /* @__PURE__ */ import_react9.default.createElement(
         "img",
         {
           src: "https://dashboard.cuekit.ai/_next/image?url=%2Fimages%2Fcuekit-logo-2.png&w=256&q=100",
           alt: "Cuekit AI",
           style: { width: 58, objectFit: "cover" }
         }
-      ), /* @__PURE__ */ import_react5.default.createElement(
+      ), /* @__PURE__ */ import_react9.default.createElement(
         "div",
         {
           style: {
@@ -37243,7 +37161,7 @@ var ChatPopup = ({
             justifyContent: "center"
           }
         },
-        /* @__PURE__ */ import_react5.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement(
           "span",
           {
             style: {
@@ -37260,7 +37178,7 @@ var ChatPopup = ({
           },
           "Cuekit.ai"
         ),
-        /* @__PURE__ */ import_react5.default.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 4 } }, /* @__PURE__ */ import_react5.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 4 } }, /* @__PURE__ */ import_react9.default.createElement(
           "div",
           {
             style: {
@@ -37276,7 +37194,7 @@ var ChatPopup = ({
               fontWeight: "500"
             }
           },
-          /* @__PURE__ */ import_react5.default.createElement(
+          /* @__PURE__ */ import_react9.default.createElement(
             "span",
             {
               style: {
@@ -37287,8 +37205,8 @@ var ChatPopup = ({
           )
         ))
       )),
-      /* @__PURE__ */ import_react5.default.createElement("div", { style: { minWidth: 100, textAlign: "center" } }),
-      /* @__PURE__ */ import_react5.default.createElement(
+      /* @__PURE__ */ import_react9.default.createElement("div", { style: { minWidth: 100, textAlign: "center" } }),
+      /* @__PURE__ */ import_react9.default.createElement(
         "div",
         {
           style: {
@@ -37300,7 +37218,7 @@ var ChatPopup = ({
             top: 16
           }
         },
-        onThemeToggle && /* @__PURE__ */ import_react5.default.createElement(
+        onThemeToggle && /* @__PURE__ */ import_react9.default.createElement(
           "button",
           {
             onClick: () => {
@@ -37330,8 +37248,8 @@ var ChatPopup = ({
             "aria-label": "Toggle theme",
             title: `Switch to ${currentTheme === "dark" ? "light" : "dark"} mode`
           },
-          currentTheme === "dark" ? /* @__PURE__ */ import_react5.default.createElement(
-            import_lucide_react.Sun,
+          currentTheme === "dark" ? /* @__PURE__ */ import_react9.default.createElement(
+            sun_default,
             {
               style: {
                 width: 16,
@@ -37340,8 +37258,8 @@ var ChatPopup = ({
                 animation: "themeToggleEnter 0.3s ease-in-out"
               }
             }
-          ) : /* @__PURE__ */ import_react5.default.createElement(
-            import_lucide_react.Moon,
+          ) : /* @__PURE__ */ import_react9.default.createElement(
+            moon_default,
             {
               style: {
                 width: 16,
@@ -37352,7 +37270,7 @@ var ChatPopup = ({
             }
           )
         ),
-        /* @__PURE__ */ import_react5.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement(
           "button",
           {
             onClick: onMinimize,
@@ -37379,11 +37297,11 @@ var ChatPopup = ({
             "aria-label": "Minimize",
             title: "Minimize chat"
           },
-          /* @__PURE__ */ import_react5.default.createElement(import_lucide_react.X, { style: { width: 16, height: 16, color: "hsl(var(--voice-text-muted))" } })
+          /* @__PURE__ */ import_react9.default.createElement(close_default, { style: { width: 16, height: 16, color: "hsl(var(--voice-text-muted))" } })
         )
       )
     ),
-    /* @__PURE__ */ import_react5.default.createElement(
+    /* @__PURE__ */ import_react9.default.createElement(
       "div",
       {
         style: {
@@ -37396,7 +37314,7 @@ var ChatPopup = ({
           color: "hsl(var(--voice-text))"
         }
       },
-      messages.length === 0 ? /* @__PURE__ */ import_react5.default.createElement(
+      messages.length === 0 ? /* @__PURE__ */ import_react9.default.createElement(
         "div",
         {
           style: {
@@ -37406,7 +37324,7 @@ var ChatPopup = ({
           }
         },
         "Start a conversation with CueKit AI"
-      ) : messages.map((message, index2) => /* @__PURE__ */ import_react5.default.createElement(
+      ) : messages.map((message, index2) => /* @__PURE__ */ import_react9.default.createElement(
         "div",
         {
           key: index2,
@@ -37420,7 +37338,7 @@ var ChatPopup = ({
             justifyContent: message.sender === "user" ? "flex-end" : "flex-start"
           }
         },
-        message.sender === "assistant" && /* @__PURE__ */ import_react5.default.createElement(
+        message.sender === "assistant" && /* @__PURE__ */ import_react9.default.createElement(
           "div",
           {
             style: {
@@ -37435,7 +37353,7 @@ var ChatPopup = ({
               overflow: "hidden"
             }
           },
-          /* @__PURE__ */ import_react5.default.createElement(
+          /* @__PURE__ */ import_react9.default.createElement(
             "img",
             {
               src: "https://dashboard.cuekit.ai/_next/image?url=%2Fimages%2Fcuekit-logo-2.png&w=256&q=100",
@@ -37449,7 +37367,7 @@ var ChatPopup = ({
             }
           )
         ),
-        /* @__PURE__ */ import_react5.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement(
           "div",
           {
             style: {
@@ -37460,7 +37378,7 @@ var ChatPopup = ({
               flex: 1
             }
           },
-          /* @__PURE__ */ import_react5.default.createElement(
+          /* @__PURE__ */ import_react9.default.createElement(
             "div",
             {
               style: {
@@ -37478,12 +37396,12 @@ var ChatPopup = ({
                 marginLeft: message.sender === "user" ? "auto" : 0
               }
             },
-            /* @__PURE__ */ import_react5.default.createElement("div", null, /* @__PURE__ */ import_react5.default.createElement(
+            /* @__PURE__ */ import_react9.default.createElement("div", null, /* @__PURE__ */ import_react9.default.createElement(
               Markdown,
               {
                 remarkPlugins: [remarkGfm],
                 components: {
-                  p: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  p: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "p",
                     {
                       style: {
@@ -37494,7 +37412,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  h1: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  h1: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "h1",
                     {
                       style: {
@@ -37506,7 +37424,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  h2: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  h2: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "h2",
                     {
                       style: {
@@ -37518,7 +37436,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  h3: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  h3: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "h3",
                     {
                       style: {
@@ -37530,7 +37448,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  ul: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  ul: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "ul",
                     {
                       style: {
@@ -37542,7 +37460,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  ol: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  ol: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "ol",
                     {
                       style: {
@@ -37554,7 +37472,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  li: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  li: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "li",
                     {
                       style: {
@@ -37565,7 +37483,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  strong: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  strong: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "strong",
                     {
                       style: {
@@ -37576,7 +37494,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  em: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  em: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "em",
                     {
                       style: {
@@ -37587,7 +37505,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  code: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  code: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "code",
                     {
                       style: {
@@ -37600,7 +37518,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  pre: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  pre: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "pre",
                     {
                       style: {
@@ -37615,7 +37533,7 @@ var ChatPopup = ({
                     },
                     children
                   ),
-                  blockquote: ({ children }) => /* @__PURE__ */ import_react5.default.createElement(
+                  blockquote: ({ children }) => /* @__PURE__ */ import_react9.default.createElement(
                     "blockquote",
                     {
                       style: {
@@ -37634,7 +37552,7 @@ var ChatPopup = ({
               message.text
             ))
           ),
-          message.sender === "user" && /* @__PURE__ */ import_react5.default.createElement(
+          message.sender === "user" && /* @__PURE__ */ import_react9.default.createElement(
             "div",
             {
               style: {
@@ -37655,9 +37573,9 @@ var ChatPopup = ({
           )
         )
       )),
-      /* @__PURE__ */ import_react5.default.createElement("div", { ref: messagesEndRef })
+      /* @__PURE__ */ import_react9.default.createElement("div", { ref: messagesEndRef })
     ),
-    /* @__PURE__ */ import_react5.default.createElement(
+    /* @__PURE__ */ import_react9.default.createElement(
       "div",
       {
         style: {
@@ -37666,7 +37584,7 @@ var ChatPopup = ({
           background: "hsl(var(--voice-bg))"
         }
       },
-      /* @__PURE__ */ import_react5.default.createElement(
+      /* @__PURE__ */ import_react9.default.createElement(
         "form",
         {
           onSubmit: (e3) => {
@@ -37675,7 +37593,7 @@ var ChatPopup = ({
           },
           style: { display: "flex", alignItems: "center", gap: 8, margin: 0 }
         },
-        /* @__PURE__ */ import_react5.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement(
           "input",
           {
             type: "text",
@@ -37702,7 +37620,7 @@ var ChatPopup = ({
             }
           }
         ),
-        isConnected4 && onEndCall && /* @__PURE__ */ import_react5.default.createElement(
+        isConnected3 && onEndCall && /* @__PURE__ */ import_react9.default.createElement(
           "button",
           {
             type: "submit",
@@ -37721,7 +37639,7 @@ var ChatPopup = ({
               cursor: "pointer"
             }
           },
-          /* @__PURE__ */ import_react5.default.createElement(import_lucide_react.PhoneOff, { size: 16 })
+          /* @__PURE__ */ import_react9.default.createElement(phone_off_default, { style: { width: 16, height: 16 } })
         )
       )
     )
@@ -37729,7 +37647,7 @@ var ChatPopup = ({
 };
 
 // src/components/border-glow.tsx
-var import_react6 = __toESM(require("react"));
+var import_react10 = __toESM(require("react"));
 var BorderGlow = ({ isActive }) => {
   if (!isActive) return null;
   const styles = {
@@ -37856,7 +37774,7 @@ var BorderGlow = ({ isActive }) => {
       opacity: 0.6
     }
   };
-  return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement("style", null, `
+  return /* @__PURE__ */ import_react10.default.createElement(import_react10.default.Fragment, null, /* @__PURE__ */ import_react10.default.createElement("style", null, `
           @keyframes borderPulse {
             0%, 100% {
               opacity: 1;
@@ -37865,12 +37783,12 @@ var BorderGlow = ({ isActive }) => {
               opacity: 0.5;
             }
           }
-        `), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.container }, /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.rightBorder1 }), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.rightBorder2 }), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.rightBorder3 }), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.leftBorder1 }), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.leftBorder2 }), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.leftBorder3 }), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.cornerTopLeft }), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.cornerTopRight }), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.cornerBottomRight }), /* @__PURE__ */ import_react6.default.createElement("div", { style: styles.cornerBottomLeft })));
+        `), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.container }, /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.rightBorder1 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.rightBorder2 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.rightBorder3 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.leftBorder1 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.leftBorder2 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.leftBorder3 }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.cornerTopLeft }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.cornerTopRight }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.cornerBottomRight }), /* @__PURE__ */ import_react10.default.createElement("div", { style: styles.cornerBottomLeft })));
 };
 var border_glow_default = BorderGlow;
 
 // src/components/voice-intensity-visualizer.tsx
-var import_react8 = __toESM(require("react"));
+var import_react12 = __toESM(require("react"));
 
 // node_modules/@livekit/components-react/dist/hooks-C2Bp5v2q.mjs
 var r2 = __toESM(require("react"), 1);
@@ -39516,7 +39434,7 @@ function Yt(e3, t = {}) {
 
 // node_modules/@livekit/components-react/dist/components-Bz2b1Fa9.mjs
 var e2 = __toESM(require("react"), 1);
-var import_react7 = require("react");
+var import_react11 = require("react");
 init_livekit_client_esm();
 var Y;
 var ue;
@@ -39611,8 +39529,8 @@ var Dt = (t) => {
 };
 var fe2 = (t) => [[Math.floor(t / 2)], [-1]];
 var Ut2 = (t, n, a) => {
-  const [r3, c] = (0, import_react7.useState)(0), [s, o2] = (0, import_react7.useState)([[]]);
-  (0, import_react7.useEffect)(() => {
+  const [r3, c] = (0, import_react11.useState)(0), [s, o2] = (0, import_react11.useState)([[]]);
+  (0, import_react11.useEffect)(() => {
     if (t === "thinking")
       o2(fe2(n));
     else if (t === "connecting" || t === "initializing") {
@@ -39621,8 +39539,8 @@ var Ut2 = (t, n, a) => {
     } else o2(t === "listening" ? fe2(n) : t === void 0 || t === "speaking" ? [new Array(n).fill(0).map((i2, u) => u)] : [[]]);
     c(0);
   }, [t, n]);
-  const l = (0, import_react7.useRef)(null);
-  return (0, import_react7.useEffect)(() => {
+  const l = (0, import_react11.useRef)(null);
+  return (0, import_react11.useEffect)(() => {
     let i2 = performance.now();
     const u = (d) => {
       d - i2 >= a && (c((f) => f + 1), i2 = d), l.current = requestAnimationFrame(u);
@@ -39692,8 +39610,8 @@ var Xt = /* @__PURE__ */ e2.forwardRef(
 init_livekit_client_esm();
 init_webrtc_service();
 var VoiceIntensityWithRoom = (props) => {
-  const [room2, setRoom] = (0, import_react8.useState)(null);
-  (0, import_react8.useEffect)(() => {
+  const [room2, setRoom] = (0, import_react12.useState)(null);
+  (0, import_react12.useEffect)(() => {
     if (props.isActive) {
       const currentRoom = getRoom();
       if (currentRoom) {
@@ -39706,7 +39624,7 @@ var VoiceIntensityWithRoom = (props) => {
   if (!room2) {
     return null;
   }
-  return /* @__PURE__ */ import_react8.default.createElement(Wn.Provider, { value: room2 }, /* @__PURE__ */ import_react8.default.createElement(VoiceIntensityBars, { ...props }));
+  return /* @__PURE__ */ import_react12.default.createElement(Wn.Provider, { value: room2 }, /* @__PURE__ */ import_react12.default.createElement(VoiceIntensityBars, { ...props }));
 };
 var VoiceIntensityBars = ({
   isActive,
@@ -39769,7 +39687,7 @@ var VoiceIntensityBars = ({
   if (!trackRef) {
     return null;
   }
-  return /* @__PURE__ */ import_react8.default.createElement(
+  return /* @__PURE__ */ import_react12.default.createElement(
     "div",
     {
       className: `voice-intensity-visualizer ${className}`,
@@ -39786,16 +39704,21 @@ var VoiceIntensityBars = ({
         pointerEvents: "none"
       }
     },
-    /* @__PURE__ */ import_react8.default.createElement(
+    /* @__PURE__ */ import_react12.default.createElement(
       Xt,
       {
         barCount,
         state: "speaking",
         options: { minHeight },
         trackRef,
-        className: "flex items-center justify-center gap-1"
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: "0.25rem"
+        }
       },
-      /* @__PURE__ */ import_react8.default.createElement("span", { className: "bg-muted min-h-4 w-4 rounded-full origin-center transition-colors duration-250 ease-linear data-[lk-highlighted=true]:bg-foreground data-[lk-muted=true]:bg-muted" })
+      /* @__PURE__ */ import_react12.default.createElement("span", { className: "cuekit-voice-intensity-bar" })
     )
   );
 };
@@ -39803,12 +39726,62 @@ var VoiceIntensityVisualizer = VoiceIntensityWithRoom;
 
 // src/components/mic-button.tsx
 init_webrtc_service();
+
+// src/components/svgs/mic.tsx
+var import_react13 = __toESM(require("react"));
+var MicIcon = ({ width = 24, height = 24, className, ...props }) => {
+  return /* @__PURE__ */ import_react13.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width,
+      height,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      className,
+      ...props
+    },
+    /* @__PURE__ */ import_react13.default.createElement("path", { d: "M12 19v3" }),
+    /* @__PURE__ */ import_react13.default.createElement("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
+    /* @__PURE__ */ import_react13.default.createElement("rect", { x: "9", y: "2", width: "6", height: "13", rx: "3" })
+  );
+};
+var mic_default = MicIcon;
+
+// src/components/svgs/loader.tsx
+var import_react14 = __toESM(require("react"));
+var LoaderIcon = ({ width = 24, height = 24, className, ...props }) => {
+  return /* @__PURE__ */ import_react14.default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      className,
+      ...props
+    },
+    /* @__PURE__ */ import_react14.default.createElement("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
+  );
+};
+var loader_default = LoaderIcon;
+
+// src/components/mic-button.tsx
 var chatState = {
   isOpen: false,
   isMinimized: false
 };
 var VoiceIntensityWrapper = ({ active, buttonSize }) => {
-  return /* @__PURE__ */ import_react9.default.createElement(
+  return /* @__PURE__ */ import_react15.default.createElement(
     VoiceIntensityVisualizer,
     {
       isActive: active,
@@ -39832,27 +39805,26 @@ var MicButton = ({
   showBorderGlow = false
 }) => {
   const { apiKey, appId } = useQubeContext();
-  const [showBodyGlow, setShowBodyGlow] = (0, import_react9.useState)(false);
-  const [currentTheme, setCurrentTheme] = (0, import_react9.useState)("dark");
-  const [isChatOpen, setIsChatOpen] = (0, import_react9.useState)(chatState.isOpen);
-  const [isChatMinimized, setIsChatMinimized] = (0, import_react9.useState)(chatState.isMinimized);
-  (0, import_react9.useEffect)(() => {
+  const [showBodyGlow, setShowBodyGlow] = (0, import_react15.useState)(false);
+  const [currentTheme, setCurrentTheme] = (0, import_react15.useState)("dark");
+  const [isChatOpen, setIsChatOpen] = (0, import_react15.useState)(chatState.isOpen);
+  const [isChatMinimized, setIsChatMinimized] = (0, import_react15.useState)(chatState.isMinimized);
+  (0, import_react15.useEffect)(() => {
     chatState.isOpen = isChatOpen;
     chatState.isMinimized = isChatMinimized;
   }, [isChatOpen, isChatMinimized]);
-  const audioContainerRef2 = (0, import_react9.useRef)(null);
-  const silenceTimerRef = (0, import_react9.useRef)(null);
-  const aiSpeakingRef = (0, import_react9.useRef)(false);
-  const aiSpeechTimeoutRef = (0, import_react9.useRef)(null);
-  const activeAITracksRef = (0, import_react9.useRef)(/* @__PURE__ */ new Set());
+  const audioContainerRef2 = (0, import_react15.useRef)(null);
+  const silenceTimerRef = (0, import_react15.useRef)(null);
+  const aiSpeakingRef = (0, import_react15.useRef)(false);
+  const aiSpeechTimeoutRef = (0, import_react15.useRef)(null);
+  const activeAITracksRef = (0, import_react15.useRef)(/* @__PURE__ */ new Set());
   const {
-    isConnected: isConnected4,
+    isConnected: isConnected3,
     isConnecting,
     error: voiceError,
     connect: voiceConnect,
     disconnect: voiceDisconnect,
     sendUserCommand: sendUserCommand2,
-    lastActionEvent,
     messages: messageManagerMessages,
     micState,
     setMicState,
@@ -39873,10 +39845,10 @@ var MicButton = ({
     onAISpeechEnd: (trackId) => handleAISpeech(false, trackId),
     appId
   });
-  (0, import_react9.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     console.log("\u{1F3A4} MicButton received messages:", JSON.stringify(messageManagerMessages, null, 2));
   }, [messageManagerMessages]);
-  (0, import_react9.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     const checkTheme = () => {
       if (typeof document !== "undefined") {
         let newTheme;
@@ -39899,31 +39871,31 @@ var MicButton = ({
       return () => observer.disconnect();
     }
   }, [defaultTheme]);
-  const openChat = (0, import_react9.useCallback)(() => {
+  const openChat = (0, import_react15.useCallback)(() => {
     setIsChatOpen(true);
     setIsChatMinimized(false);
   }, []);
-  const minimizeChat = (0, import_react9.useCallback)(() => {
+  const minimizeChat = (0, import_react15.useCallback)(() => {
     setIsChatMinimized(true);
     if (showBorderGlow) {
       setShowBodyGlow(false);
     }
   }, [showBorderGlow]);
-  const restoreChat = (0, import_react9.useCallback)(() => {
+  const restoreChat = (0, import_react15.useCallback)(() => {
     setIsChatMinimized(false);
     setIsChatOpen(true);
     if (showBorderGlow && (micState === "listening" || micState === "thinking" || micState === "replying")) {
       setShowBodyGlow(true);
     }
   }, [showBorderGlow, micState]);
-  const closeChat = (0, import_react9.useCallback)(() => {
+  const closeChat = (0, import_react15.useCallback)(() => {
     setIsChatOpen(false);
     setIsChatMinimized(false);
     if (showBorderGlow) {
       setShowBodyGlow(false);
     }
   }, [showBorderGlow]);
-  const handleAISpeech = (0, import_react9.useCallback)(
+  const handleAISpeech = (0, import_react15.useCallback)(
     (isSpeaking, trackId) => {
       console.log("\u{1F3A4} MicButton: ===== AI SPEECH EVENT START =====");
       console.log("\u{1F3A4} MicButton: Event type:", isSpeaking ? "START" : "END");
@@ -39932,8 +39904,8 @@ var MicButton = ({
       console.log("\u{1F3A4} MicButton: Current active AI tracks:", Array.from(activeAITracksRef.current));
       console.log("\u{1F3A4} MicButton: Current status:", status);
       console.log("\u{1F3A4} MicButton: Current mic state:", micState);
-      console.log("\u{1F3A4} MicButton: Is listening:", isConnected4);
-      console.log("\u{1F3A4} MicButton: Is connected:", isConnected4);
+      console.log("\u{1F3A4} MicButton: Is listening:", isConnected3);
+      console.log("\u{1F3A4} MicButton: Is connected:", isConnected3);
       if (isSpeaking && trackId) {
         console.log("\u{1F3A4} MicButton: ===== AI SPEECH START =====");
         console.log("\u{1F3A4} MicButton: Adding track to active set:", trackId);
@@ -39988,9 +39960,9 @@ var MicButton = ({
       console.log("\u{1F3A4} MicButton: - Status:", status);
       console.log("\u{1F3A4} MicButton: ================================");
     },
-    [status, micState, isConnected4]
+    [status, micState, isConnected3]
   );
-  (0, import_react9.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     if (audioContainerRef2.current) {
       console.log("\u{1F3A4} MicButton: Setting up audio container on mount");
       setAudioContainer(audioContainerRef2);
@@ -40001,10 +39973,9 @@ var MicButton = ({
       }
     };
   }, [handleAISpeech]);
-  const isListening = isConnected4;
-  const transcript = (lastActionEvent?.type === "user_speech_chunk" || lastActionEvent?.type === "ai_speech_chunk") && lastActionEvent?.data?.text_chunk ? lastActionEvent.data.text_chunk : "";
-  const getUserFriendlyStatus = (micState2, isConnected5) => {
-    if (!isConnected5) {
+  const isListening = isConnected3;
+  const getUserFriendlyStatus = (micState2, isConnected4) => {
+    if (!isConnected4) {
       return "Connecting...";
     }
     if (status && !status.includes("error") && !status.includes("failed") && !status.includes("Connection error") && !status.includes("Unable to")) {
@@ -40014,36 +39985,36 @@ var MicButton = ({
     if (micState2 === "thinking") return "Thinking...";
     if (micState2 === "replying") return "Responding...";
     if (micState2 === "idle") {
-      if (isConnected5) return "Listening...";
+      if (isConnected4) return "Listening...";
       return "Connecting...";
     }
-    return isConnected5 ? "Ready" : "Connecting...";
+    return isConnected4 ? "Ready" : "Connecting...";
   };
-  (0, import_react9.useEffect)(() => {
-    if (isConnected4) {
+  (0, import_react15.useEffect)(() => {
+    if (isConnected3) {
       console.log("\u{1F3A4} MicButton: WebRTC and SSE connections established - ready for commands");
     } else {
       console.log("\u{1F3A4} MicButton: WebRTC not yet connected - ignoring speech");
     }
-  }, [isConnected4]);
-  (0, import_react9.useEffect)(() => {
+  }, [isConnected3]);
+  (0, import_react15.useEffect)(() => {
     console.log("\u{1F3A4} MicButton: Auto-open check:", {
-      isConnected: isConnected4,
+      isConnected: isConnected3,
       chatIsOpen: isChatOpen
     });
-    if (isConnected4 && !isChatOpen) {
+    if (isConnected3 && !isChatOpen) {
       console.log("\u{1F3A4} MicButton: Auto-opening chat popup");
       openChat();
     }
-  }, [isConnected4, isChatOpen, openChat]);
-  (0, import_react9.useEffect)(() => {
+  }, [isConnected3, isChatOpen, openChat]);
+  (0, import_react15.useEffect)(() => {
     if (messageManagerMessages.length > 0 && !isChatOpen) {
       console.log("\u{1F3A4} MicButton: Auto-opening chat popup due to messages");
       openChat();
     }
   }, [messageManagerMessages.length, isChatOpen, openChat]);
-  const handleMicClick = (0, import_react9.useCallback)(() => {
-    const shouldStop = micState === "listening" && isConnected4;
+  const handleMicClick = (0, import_react15.useCallback)(() => {
+    const shouldStop = micState === "listening" && isConnected3;
     if (shouldStop) {
       console.log("\u{1F3A4} MicButton: User wants to stop - closing everything");
       voiceDisconnect().then(() => {
@@ -40068,7 +40039,7 @@ var MicButton = ({
     }
   }, [
     micState,
-    isConnected4,
+    isConnected3,
     voiceDisconnect,
     voiceConnect,
     apiKey,
@@ -40076,19 +40047,6 @@ var MicButton = ({
     openChat,
     showBorderGlow
   ]);
-  (0, import_react9.useEffect)(() => {
-    if (!isConnected4) {
-      return;
-    }
-    if (transcript && transcript.trim() && !aiSpeakingRef.current) {
-      console.log("\u{1F3A4} MicButton: Processing new transcript:", transcript);
-      sendUserCommand2(transcript).then(() => {
-        console.log("\u{1F3A4} MicButton: User command sent successfully");
-      }).catch((error) => {
-        console.error("\u{1F3A4} MicButton: Failed to send user command:", error);
-      });
-    }
-  }, [transcript, isConnected4, sendUserCommand2]);
   const handleSendText = async (textToSend) => {
     console.log("\u{1F3A4} MicButton: handleSendText called with:", textToSend);
     setMicState("thinking");
@@ -40096,7 +40054,7 @@ var MicButton = ({
     if (!isChatOpen) {
       openChat();
     }
-    if (isConnected4) {
+    if (isConnected3) {
       console.log("\u{1F3A4} MicButton: Sending via WebRTC");
       try {
         await sendUserCommand2(textToSend);
@@ -40139,7 +40097,7 @@ var MicButton = ({
         ...imageStyle
       };
       const animatedImageStyle = micState === "thinking" ? { ...baseImageStyle, animation: "spin 1s linear infinite" } : micState === "replying" ? { ...baseImageStyle, animation: "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite" } : baseImageStyle;
-      return /* @__PURE__ */ import_react9.default.createElement("img", { src: imageSource, alt: "Voice Assistant", style: animatedImageStyle });
+      return /* @__PURE__ */ import_react15.default.createElement("img", { src: imageSource, alt: "Voice Assistant", style: animatedImageStyle });
     }
     const iconStyle = {
       width: `100%`,
@@ -40149,13 +40107,13 @@ var MicButton = ({
     };
     switch (micState) {
       case "thinking":
-        return /* @__PURE__ */ import_react9.default.createElement(import_lucide_react2.Loader2, { style: { ...iconStyle, animation: "spin 1s linear infinite" } });
+        return /* @__PURE__ */ import_react15.default.createElement(loader_default, { style: { ...iconStyle, animation: "spin 1s linear infinite" } });
       case "replying":
-        return /* @__PURE__ */ import_react9.default.createElement(VoiceIntensityWrapper, { active: true, buttonSize });
+        return /* @__PURE__ */ import_react15.default.createElement(VoiceIntensityWrapper, { active: true, buttonSize });
       case "listening":
-        return /* @__PURE__ */ import_react9.default.createElement(VoiceIntensityWrapper, { active: true, buttonSize });
+        return /* @__PURE__ */ import_react15.default.createElement(VoiceIntensityWrapper, { active: true, buttonSize });
       default:
-        return /* @__PURE__ */ import_react9.default.createElement(import_lucide_react2.Mic, { style: iconStyle });
+        return /* @__PURE__ */ import_react15.default.createElement(mic_default, { style: iconStyle });
     }
   };
   const getPositionStyle = () => {
@@ -40235,7 +40193,7 @@ var MicButton = ({
     }
     return baseStyle;
   };
-  return /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, /* @__PURE__ */ import_react9.default.createElement("div", { "data-cuekit-ignore": true, style: { ...buttonStyles.container, ...getPositionStyle() } }, /* @__PURE__ */ import_react9.default.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: "8px" } }, /* @__PURE__ */ import_react9.default.createElement(
+  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement("div", { "data-cuekit-ignore": true, style: { ...buttonStyles.container, ...getPositionStyle() } }, /* @__PURE__ */ import_react15.default.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: "8px" } }, /* @__PURE__ */ import_react15.default.createElement(
     "button",
     {
       "data-testid": "ignore",
@@ -40256,8 +40214,8 @@ var MicButton = ({
       },
       "aria-label": micState === "thinking" ? "Processing..." : micState === "replying" ? "AI is responding..." : isListening ? "Stop listening" : "Start listening"
     },
-    /* @__PURE__ */ import_react9.default.createElement("div", { style: buttonStyles.iconContainer }, getIcon())
-  ), hasText && text7 && /* @__PURE__ */ import_react9.default.createElement(
+    /* @__PURE__ */ import_react15.default.createElement("div", { style: buttonStyles.iconContainer }, getIcon())
+  ), hasText && text7 && /* @__PURE__ */ import_react15.default.createElement(
     "div",
     {
       style: {
@@ -40278,8 +40236,8 @@ var MicButton = ({
         ...textStyle
       }
     },
-    /* @__PURE__ */ import_react9.default.createElement("span", null, text7)
-  ))), /* @__PURE__ */ import_react9.default.createElement(
+    /* @__PURE__ */ import_react15.default.createElement("span", null, text7)
+  ))), /* @__PURE__ */ import_react15.default.createElement(
     ChatPopup,
     {
       isOpen: isChatOpen,
@@ -40293,16 +40251,16 @@ var MicButton = ({
         text: msg.text,
         sender: msg.role === "ai" ? "assistant" : "user"
       })),
-      isConnected: isConnected4 ?? false,
+      isConnected: isConnected3 ?? false,
       micState,
       participants,
       error: voiceError,
       currentTheme,
       onThemeToggle: setCurrentTheme,
-      status: getUserFriendlyStatus(micState, isConnected4 ?? false),
+      status: getUserFriendlyStatus(micState, isConnected3 ?? false),
       anchor: { position: screenPosition, bottom: bottomSpace, size: buttonSize }
     }
-  ), isChatOpen && isChatMinimized && /* @__PURE__ */ import_react9.default.createElement(
+  ), isChatOpen && isChatMinimized && /* @__PURE__ */ import_react15.default.createElement(
     "button",
     {
       onClick: restoreChat,
@@ -40323,6 +40281,9 @@ var MicButton = ({
       className: `cuekit-voice-popup ${currentTheme === "dark" ? "cuekit-dark" : ""}`,
       "aria-label": "Open chat"
     },
-    /* @__PURE__ */ import_react9.default.createElement("span", { style: { fontSize: 12, fontWeight: 600, color: "hsl(var(--voice-text))" } }, "Open chat")
-  ), /* @__PURE__ */ import_react9.default.createElement("div", { ref: audioContainerRef2, style: { display: "none" } }), showBorderGlow && showBodyGlow && /* @__PURE__ */ import_react9.default.createElement(border_glow_default, { isActive: true }));
+    /* @__PURE__ */ import_react15.default.createElement("span", { style: { fontSize: 12, fontWeight: 600, color: "hsl(var(--voice-text))" } }, "Open chat")
+  ), /* @__PURE__ */ import_react15.default.createElement("div", { ref: audioContainerRef2, style: { display: "none" } }), showBorderGlow && showBodyGlow && /* @__PURE__ */ import_react15.default.createElement(border_glow_default, { isActive: true }));
 };
+
+// src/index.ts
+init_patch_react();