interview-widget 0.1.4 → 0.1.5

package/dist/widget.es.js

@@ -1,9 +1,9 @@
 var ve = Object.defineProperty;
 var je = (i, r, e) => r in i ? ve(i, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[r] = e;
 var D = (i, r, e) => je(i, typeof r != "symbol" ? r + "" : r, e);
-import oe, { createContext as Ne, useContext as Te, useRef as E, useState as k, useEffect as $, useCallback as A, useMemo as J } from "react";
+import ce, { createContext as Ne, useContext as Te, useRef as S, useState as T, useEffect as P, useCallback as A, useMemo as V } from "react";
 import { createPortal as ke } from "react-dom";
-var le = { exports: {} }, X = {};
+var de = { exports: {} }, J = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -14,9 +14,9 @@ var le = { exports: {} }, X = {};
  * LICENSE file in the root directory of this source tree.
  */
 var Ie = Symbol.for("react.transitional.element"), Ee = Symbol.for("react.fragment");
-function de(i, r, e) {
-  var n = null;
-  if (e !== void 0 && (n = "" + e), r.key !== void 0 && (n = "" + r.key), "key" in r) {
+function we(i, r, e) {
+  var o = null;
+  if (e !== void 0 && (o = "" + e), r.key !== void 0 && (o = "" + r.key), "key" in r) {
     e = {};
     for (var s in r)
       s !== "key" && (e[s] = r[s]);
@@ -24,17 +24,17 @@ function de(i, r, e) {
   return r = e.ref, {
     $$typeof: Ie,
     type: i,
-    key: n,
+    key: o,
     ref: r !== void 0 ? r : null,
     props: e
   };
 }
-X.Fragment = Ee;
-X.jsx = de;
-X.jsxs = de;
-le.exports = X;
-var t = le.exports;
-const O = {
+J.Fragment = Ee;
+J.jsx = we;
+J.jsxs = we;
+de.exports = J;
+var t = de.exports;
+const $ = {
   api: {
     baseUrl: "/api",
     retryConfig: {
@@ -62,48 +62,48 @@ const O = {
       provider: "piper"
     }
   }
-}, we = Ne(
+}, ue = Ne(
   null
 );
 function Re({
   config: i = {},
   children: r
 }) {
-  var n, s, c, a;
+  var o, s, c, a;
   const e = {
     api: {
-      ...O.api,
+      ...$.api,
       ...i.api,
       retryConfig: {
-        ...O.api.retryConfig,
-        ...(n = i.api) == null ? void 0 : n.retryConfig
+        ...$.api.retryConfig,
+        ...(o = i.api) == null ? void 0 : o.retryConfig
       }
     },
     ui: {
-      ...O.ui,
+      ...$.ui,
       ...i.ui
     },
     interview: {
-      ...O.interview,
+      ...$.interview,
       ...i.interview,
       timers: {
-        ...O.interview.timers,
+        ...$.interview.timers,
         ...(s = i.interview) == null ? void 0 : s.timers
       },
       stt: {
-        ...O.interview.stt,
+        ...$.interview.stt,
         ...(c = i.interview) == null ? void 0 : c.stt
       },
       tts: {
-        ...O.interview.tts,
+        ...$.interview.tts,
         ...(a = i.interview) == null ? void 0 : a.tts
       }
     }
   };
-  return /* @__PURE__ */ t.jsx(we.Provider, { value: e, children: r });
+  return /* @__PURE__ */ t.jsx(ue.Provider, { value: e, children: r });
 }
-function Z() {
-  const i = Te(we);
+function X() {
+  const i = Te(ue);
   if (!i)
     throw new Error(
       "useInterviewConfig must be used within an InterviewWidgetProvider. Wrap your component tree with <InterviewWidgetProvider config={...}>"
@@ -111,15 +111,15 @@ function Z() {
   return i;
 }
 function Se() {
-  return Z().api || O.api;
+  return X().api || $.api;
 }
-function Q() {
-  return Z().ui || O.ui;
+function W() {
+  return X().ui || $.ui;
 }
 function Ce() {
-  return Z().interview || O.interview;
+  return X().interview || $.interview;
 }
-const ue = ({
+const he = ({
   className: i,
   ...r
 }) => /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsxs(
@@ -148,17 +148,17 @@ const ue = ({
       /* @__PURE__ */ t.jsx("path", { d: "M7.75 7.75l-2.15 -2.15" })
     ]
   }
-) }), ie = ({
+) }), se = ({
   children: i,
   variant: r = "primary",
   size: e = "md",
-  fullWidth: n = !1,
+  fullWidth: o = !1,
   isLoading: s = !1,
   disabled: c,
   className: a = "",
-  ...o
+  ...n
 }) => {
-  const w = "iw-inline-flex iw-items-center iw-justify-center iw-rounded-md iw-font-medium iw-transition-colors iw-focus:outline-none iw-focus:ring-2 iw-focus:ring-primary-500 iw-focus:ring-offset-2", g = {
+  const w = "iw-inline-flex iw-items-center iw-justify-center iw-rounded-md iw-font-medium iw-transition-colors iw-focus:outline-none iw-focus:ring-2 iw-focus:ring-primary-500 iw-focus:ring-offset-2", m = {
     primary: "iw-bg-primary-600 iw-text-white iw-hover:bg-primary-700 iw-border iw-border-transparent",
     secondary: "iw-bg-primary-100 iw-text-primary-700 iw-hover:bg-primary-200 iw-border iw-border-transparent",
     outline: "iw-bg-transparent iw-text-primary-700 iw-border iw-border-primary-500 iw-hover:bg-primary-50",
@@ -168,15 +168,15 @@ const ue = ({
     sm: "iw-px-3 iw-py-1.5 iw-text-sm",
     md: "iw-px-4 iw-py-2.5 iw-text-sm",
     lg: "iw-px-5 iw-py-3 iw-text-base"
-  }, h = "iw-disabled:opacity-50 iw-disabled:cursor-not-allowed iw-disabled:pointer-events-none", u = n ? "iw-w-full" : "";
+  }, h = "iw-disabled:opacity-50 iw-disabled:cursor-not-allowed iw-disabled:pointer-events-none", u = o ? "iw-w-full" : "";
   return /* @__PURE__ */ t.jsxs(
     "button",
     {
-      className: `${w} ${g[r]} ${d[e]} ${u} ${h} ${a}`,
+      className: `${w} ${m[r]} ${d[e]} ${u} ${h} ${a}`,
       disabled: c || s,
-      ...o,
+      ...n,
       children: [
-        s && /* @__PURE__ */ t.jsx(ue, { height: 16, width: 16, style: { marginRight: "3px" } }),
+        s && /* @__PURE__ */ t.jsx(he, { height: 16, width: 16, style: { marginRight: "3px" } }),
         i
       ]
     }
@@ -191,28 +191,28 @@ function Me(i) {
   } : null;
 }
 function Ae(i, r, e) {
-  return "#" + [i, r, e].map((n) => {
-    const s = Math.round(n).toString(16);
+  return "#" + [i, r, e].map((o) => {
+    const s = Math.round(o).toString(16);
     return s.length === 1 ? "0" + s : s;
   }).join("");
 }
-function he(i, r) {
+function me(i, r) {
   const e = Me(i);
   if (!e) return i;
-  const n = e.r + (255 - e.r) * r, s = e.g + (255 - e.g) * r, c = e.b + (255 - e.b) * r;
-  return Ae(n, s, c);
+  const o = e.r + (255 - e.r) * r, s = e.g + (255 - e.g) * r, c = e.b + (255 - e.b) * r;
+  return Ae(o, s, c);
 }
 function De(i, r = 0.8) {
   return {
-    background: `linear-gradient(to bottom, ${he(i, r)}, #ffffff)`,
+    background: `linear-gradient(to bottom, ${me(i, r)}, #ffffff)`,
     color: "#1f2937"
   };
 }
 function Pe(i) {
   return new Promise((r) => setTimeout(r, i));
 }
-function me(i) {
-  return `linear-gradient(to left, ${he(i, 0.4)}, ${i})`;
+function ge(i) {
+  return `linear-gradient(to left, ${me(i, 0.4)}, ${i})`;
 }
 const $e = (i) => /* @__PURE__ */ t.jsxs(
   "svg",
@@ -245,35 +245,35 @@ const $e = (i) => /* @__PURE__ */ t.jsxs(
   onClose: e
 }) => {
   var j;
-  const n = E(null), s = E(null), { baseColor: c, borderRadius: a } = Q(), [o, w] = k(!1), [g, d] = k(null), [h, u] = k(!1), m = () => {
+  const o = S(null), s = S(null), { baseColor: c, borderRadius: a } = W(), [n, w] = T(!1), [m, d] = T(null), [h, u] = T(!1), g = () => {
     s.current && (s.current.getTracks().forEach((l) => l.stop()), s.current = null);
-  }, v = async () => {
+  }, y = async () => {
     u(!0), d(null);
     try {
       const l = await navigator.mediaDevices.getUserMedia({
         video: { width: { ideal: 1280 }, height: { ideal: 720 } },
         audio: !0
       });
-      s.current = l, n.current && (n.current.srcObject = l), w(!0);
+      s.current = l, o.current && (o.current.srcObject = l), w(!0);
     } catch (l) {
       console.error("Media permission error:", l);
-      let f = "Unable to access camera or microphone.";
-      (l == null ? void 0 : l.name) === "NotAllowedError" ? f = "Permissions denied. Please allow access to camera and microphone." : (l == null ? void 0 : l.name) === "NotFoundError" ? f = "No camera/microphone found. Please connect a device and retry." : l != null && l.message && (f = l.message), w(!1), d(f);
+      let p = "Unable to access camera or microphone.";
+      (l == null ? void 0 : l.name) === "NotAllowedError" ? p = "Permissions denied. Please allow access to camera and microphone." : (l == null ? void 0 : l.name) === "NotFoundError" ? p = "No camera/microphone found. Please connect a device and retry." : l != null && l.message && (p = l.message), w(!1), d(p);
     } finally {
       u(!1);
     }
   };
-  if ($(() => {
+  if (P(() => {
     if (!i) {
-      m();
+      g();
       return;
     }
-    return v(), () => {
-      m();
+    return y(), () => {
+      g();
     };
   }, [i]), !i) return null;
-  const N = () => {
-    r(), m();
+  const k = () => {
+    r(), g();
   };
   return /* @__PURE__ */ t.jsx("div", { className: "iw-fixed iw-inset-0 iw-z-50 iw-flex iw-items-center iw-justify-center iw-bg-black/50 iw-backdrop-blur-sm", children: /* @__PURE__ */ t.jsxs("div", { className: "iw-bg-white iw-rounded-xl iw-shadow-2xl iw-w-full iw-max-w-[800px] iw-mx-4", children: [
     /* @__PURE__ */ t.jsxs("div", { className: "iw-px-5 iw-py-4 iw-border-b iw-border-gray-200 iw-flex iw-items-center iw-justify-between", children: [
@@ -284,7 +284,7 @@ const $e = (i) => /* @__PURE__ */ t.jsxs(
           "aria-label": "Close",
           className: "iw-text-gray-500 hover:iw-text-gray-700",
           onClick: () => {
-            m(), e == null || e();
+            g(), e == null || e();
           },
           children: "✕"
         }
@@ -295,7 +295,7 @@ const $e = (i) => /* @__PURE__ */ t.jsxs(
         /* @__PURE__ */ t.jsx("div", { className: "iw-border iw-border-gray-200 iw-rounded-lg iw-overflow-hidden iw-bg-gray-900", children: /* @__PURE__ */ t.jsx(
           "video",
           {
-            ref: n,
+            ref: o,
             autoPlay: !0,
             playsInline: !0,
             muted: !0,
@@ -307,9 +307,9 @@ const $e = (i) => /* @__PURE__ */ t.jsxs(
         ) }),
         /* @__PURE__ */ t.jsxs("div", { className: "iw-grid iw-grid-cols-2 iw-gap-2 iw-mt-3", children: [
           /* @__PURE__ */ t.jsx(
-            ie,
+            se,
             {
-              onClick: v,
+              onClick: y,
               disabled: h,
               variant: "outline",
               size: "sm",
@@ -318,17 +318,17 @@ const $e = (i) => /* @__PURE__ */ t.jsxs(
                 borderRadius: a,
                 color: c
               },
-              children: o ? "Recheck Permissions" : "Enable Camera & Mic"
+              children: n ? "Recheck Permissions" : "Enable Camera & Mic"
             }
           ),
           /* @__PURE__ */ t.jsx(
-            ie,
+            se,
             {
-              onClick: N,
-              disabled: !o,
+              onClick: k,
+              disabled: !n,
               size: "sm",
               style: {
-                background: me(c),
+                background: ge(c),
                 borderRadius: a
               },
               children: "Start Interview"
@@ -342,13 +342,13 @@ const $e = (i) => /* @__PURE__ */ t.jsxs(
           /* @__PURE__ */ t.jsx("h3", { children: "Interview Guidelines" })
         ] }),
         !((j = navigator.mediaDevices) != null && j.getUserMedia) && /* @__PURE__ */ t.jsx("div", { className: "iw-text-xs iw-text-red-600", children: "Your browser does not support media devices. Please use a modern browser like Chrome, Edge, or Firefox." }),
-        g && /* @__PURE__ */ t.jsx("div", { className: "iw-text-xs iw-text-red-600", children: g }),
-        /* @__PURE__ */ t.jsx("ul", { className: "iw-mt-1 iw-text-sm iw-text-gray-500 iw-list-disc iw-pl-4 iw-space-y-1.5", children: _e.map((l, f) => /* @__PURE__ */ t.jsx("li", { children: l }, f)) })
+        m && /* @__PURE__ */ t.jsx("div", { className: "iw-text-xs iw-text-red-600", children: m }),
+        /* @__PURE__ */ t.jsx("ul", { className: "iw-mt-1 iw-text-sm iw-text-gray-500 iw-list-disc iw-pl-4 iw-space-y-1.5", children: _e.map((l, p) => /* @__PURE__ */ t.jsx("li", { children: l }, p)) })
       ] })
     ] })
   ] }) });
 };
-var I = /* @__PURE__ */ ((i) => (i.IDLE = "idle", i.FETCHING_QUESTION = "fetching_question", i.READING_QUESTION = "reading_question", i.THINKING = "thinking", i.ANSWERING = "answering", i.TRANSCRIBING = "transcribing", i.EDITING = "editing", i.SUBMITTING = "submitting", i.COMPLETED = "completed", i))(I || {});
+var R = /* @__PURE__ */ ((i) => (i.IDLE = "idle", i.FETCHING_QUESTION = "fetching_question", i.READING_QUESTION = "reading_question", i.THINKING = "thinking", i.ANSWERING = "answering", i.TRANSCRIBING = "transcribing", i.EDITING = "editing", i.SUBMITTING = "submitting", i.COMPLETED = "completed", i))(R || {});
 const Oe = {
   thinkingDuration: 30,
   answeringDuration: 120,
@@ -415,8 +415,8 @@ class Ue {
     const r = this.state.phase, e = Fe[r];
     if (!e) return;
     this.stopPhaseTimer(), this.state.phase = e.next;
-    const n = this.getDurationForPhase(e.next);
-    n > 0 ? (this.state.currentPhaseTimeRemaining = n, this.startPhaseTimer()) : this.state.currentPhaseTimeRemaining = 0, this.notifyChange();
+    const o = this.getDurationForPhase(e.next);
+    o > 0 ? (this.state.currentPhaseTimeRemaining = o, this.startPhaseTimer()) : this.state.currentPhaseTimeRemaining = 0, this.notifyChange();
   }
   /**
    * Manually complete the interview
@@ -484,62 +484,62 @@ class Ue {
   }
 }
 function Ge(i = {}) {
-  const { config: r = {}, callbacks: e = {} } = i, n = E(null);
-  n.current || (n.current = new Ue(r, {}));
-  const s = n.current, [c, a] = k(s.getState()), o = A(() => {
+  const { config: r = {}, callbacks: e = {} } = i, o = S(null);
+  o.current || (o.current = new Ue(r, {}));
+  const s = o.current, [c, a] = T(s.getState()), n = A(() => {
     a(s.getState());
   }, [s]);
-  $(() => {
+  P(() => {
     const h = {
-      onPhaseChange: (u, m) => {
-        var v;
-        o(), (v = e.onPhaseChange) == null || v.call(e, u, m);
+      onPhaseChange: (u, g) => {
+        var y;
+        n(), (y = e.onPhaseChange) == null || y.call(e, u, g);
       },
       onTick: (u) => {
-        var m;
-        o(), (m = e.onTick) == null || m.call(e, u);
+        var g;
+        n(), (g = e.onTick) == null || g.call(e, u);
       },
       onInterviewEnd: () => {
         var u;
-        o(), (u = e.onInterviewEnd) == null || u.call(e);
+        n(), (u = e.onInterviewEnd) == null || u.call(e);
       }
     };
     s.callbacks = h;
-  }, [s, e, o]), $(() => () => {
+  }, [s, e, n]), P(() => () => {
     s.destroy();
   }, [s]);
   const w = A(() => {
-    s.startQuestion(), o();
-  }, [s, o]), g = A(() => {
-    s.nextPhase(), o();
-  }, [s, o]), d = A(() => {
-    s.completeInterview(), o();
-  }, [s, o]);
+    s.startQuestion(), n();
+  }, [s, n]), m = A(() => {
+    s.nextPhase(), n();
+  }, [s, n]), d = A(() => {
+    s.completeInterview(), n();
+  }, [s, n]);
   return {
     state: c,
     startQuestion: w,
-    nextPhase: g,
+    nextPhase: m,
     completeInterview: d,
     timerService: s
   };
 }
 function qe(i, r = {}) {
-  const [e, n] = k({
+  const [e, o] = T({
     data: null,
     loading: !1,
     error: null
   }), s = A(
     async (...c) => {
-      var a, o, w, g;
-      n((d) => ({ ...d, loading: !0, error: null }));
+      var a, n, w, m;
+      o((d) => ({ ...d, loading: !0, error: null }));
       try {
         const d = await i(...c);
-        n((h) => ({
+        o((h) => ({
           ...h,
           data: d,
           loading: !1,
           error: null
-        })), (a = r.onSuccess) == null || a.call(r, d), (o = r.onSettled) == null || o.call(r, d, null);
+        })), (a = r.onSuccess) == null || a.call(r, d), (n = r.onSettled) == null || n.call(r, d, null);
       } catch (d) {
         const h = d.type ? d : {
           type: "unknown",
@@ -548,11 +548,11 @@ function qe(i, r = {}) {
           userMessage: "Something went wrong. Please try again.",
           originalError: d
         };
-        n((u) => ({
+        o((u) => ({
           ...u,
           loading: !1,
           error: h
-        })), (w = r.onError) == null || w.call(r, h), (g = r.onSettled) == null || g.call(r, null, h);
+        })), (w = r.onError) == null || w.call(r, h), (m = r.onSettled) == null || m.call(r, null, h);
       }
     },
     [i, r]
@@ -621,37 +621,37 @@ function Be(i) {
     originalError: i
   };
 }
-async function se(i, r = {}, e = {
+async function ae(i, r = {}, e = {
   attempts: 3,
   backoff: "exponential",
   baseDelay: 1e3,
   maxDelay: 1e4,
   jitter: !0
 }) {
-  let n;
+  let o;
   for (let s = 1; s <= e.attempts; s++)
     try {
-      const c = new AbortController(), a = setTimeout(() => c.abort(), 6e4), o = await fetch(i, {
+      const c = new AbortController(), a = setTimeout(() => c.abort(), 6e4), n = await fetch(i, {
         ...r,
         signal: c.signal
       });
-      if (clearTimeout(a), o.status >= 400 && o.status < 500 && o.status !== 429)
-        return o;
-      if (!o.ok)
-        throw new Error(`HTTP ${o.status}: ${o.statusText}`);
-      return o;
+      if (clearTimeout(a), n.status >= 400 && n.status < 500 && n.status !== 429)
+        return n;
+      if (!n.ok)
+        throw new Error(`HTTP ${n.status}: ${n.statusText}`);
+      return n;
     } catch (c) {
-      n = c;
+      o = c;
       const a = Be(c);
       if (!a.retryable || s === e.attempts)
         throw a;
-      const o = ze(s, e);
+      const n = ze(s, e);
       console.warn(
-        `API request failed (attempt ${s}/${e.attempts}), retrying in ${o}ms:`,
+        `API request failed (attempt ${s}/${e.attempts}), retrying in ${n}ms:`,
         a.message
-      ), await new Promise((w) => setTimeout(w, o));
+      ), await new Promise((w) => setTimeout(w, n));
     }
-  throw n;
+  throw o;
 }
 function ze(i, r) {
   let e;
@@ -692,12 +692,12 @@ class Qe {
   async generateQuestion({
     interviewId: r,
     isInterviewDone: e = !1,
-    qnaId: n,
+    qnaId: o,
     question: s,
     answer: c,
     answerDuration: a
   }) {
-    const o = await se(
+    const n = await ae(
       `${this.getBaseUrl()}/questions/next`,
       {
         method: "POST",
@@ -705,7 +705,7 @@ class Qe {
         body: JSON.stringify({
           interview_id: r,
           is_interview_done: e,
-          qna_id: n,
+          qna_id: o,
           question: s,
           answer: c,
           // TODO: Hardcoded for now, will be dynamic later
@@ -713,21 +713,21 @@ class Qe {
         })
       }
     );
-    if (!o.ok)
-      throw new Error(`Failed to get questions: ${o.status}`);
-    return await o.json();
+    if (!n.ok)
+      throw new Error(`Failed to get questions: ${n.status}`);
+    return await n.json();
   }
 }
 function We() {
-  const i = Z();
-  return J(() => {
+  const i = X();
+  return V(() => {
     const e = i.api || {};
     return new Qe(e);
   }, [i.api]);
 }
-class y extends Error {
-  constructor(r, e, n = !1) {
-    super(r), this.code = e, this.recoverable = n, this.name = "STTError";
+class v extends Error {
+  constructor(r, e, o = !1) {
+    super(r), this.code = e, this.recoverable = o, this.name = "STTError";
   }
 }
 class He {
@@ -763,15 +763,15 @@ class He {
    * Start recording audio from user's microphone
    */
   async startRecording(r, e) {
-    var n;
+    var o;
     if (!this.isRecordingSupported())
-      throw new y(
+      throw new v(
         "Audio recording is not supported in this browser",
         "RECORDING_NOT_SUPPORTED",
         !1
       );
     if (this.isRecording())
-      throw new y(
+      throw new v(
         "Recording is already in progress",
         "ALREADY_RECORDING",
         !0
@@ -794,28 +794,28 @@ class He {
         var c;
         (c = e == null ? void 0 : e.onStop) == null || c.call(e);
       }, this.mediaRecorder.onerror = (c) => {
-        var o;
-        const a = new y(
+        var n;
+        const a = new v(
           `Recording failed: ${c.error}`,
           "RECORDING_ERROR",
           !0
         );
-        (o = e == null ? void 0 : e.onError) == null || o.call(e, a), this.cleanup();
-      }, this.mediaRecorder.start(100), (n = e == null ? void 0 : e.onStart) == null || n.call(e), r && r > 0 && (this.autoStopTimeoutId = setTimeout(() => {
+        (n = e == null ? void 0 : e.onError) == null || n.call(e, a), this.cleanup();
+      }, this.mediaRecorder.start(100), (o = e == null ? void 0 : e.onStart) == null || o.call(e), r && r > 0 && (this.autoStopTimeoutId = setTimeout(() => {
         this.isRecording() && this.stopRecording();
       }, r * 1e3));
     } catch (s) {
       if (this.cleanup(), s instanceof Error) {
         if (s.name === "NotAllowedError" || s.name === "PermissionDeniedError")
-          throw new y(
+          throw new v(
             "Microphone permission was denied",
             "PERMISSION_DENIED",
             !1
           );
         if (s.name === "NotFoundError")
-          throw new y("No microphone found", "NO_MICROPHONE", !1);
+          throw new v("No microphone found", "NO_MICROPHONE", !1);
       }
-      throw new y(
+      throw new v(
         `Failed to start recording: ${s instanceof Error ? s.message : String(s)}`,
         "START_RECORDING_FAILED",
         !0
@@ -827,7 +827,7 @@ class He {
    */
   async stopRecording() {
     if (this.autoStopTimeoutId && (clearTimeout(this.autoStopTimeoutId), this.autoStopTimeoutId = null), !this.mediaRecorder || !this.isRecording())
-      throw new y(
+      throw new v(
         "No active recording to stop",
         "NO_ACTIVE_RECORDING",
         !1
@@ -835,17 +835,17 @@ class He {
     return new Promise((r, e) => {
       if (!this.mediaRecorder) {
         e(
-          new y("MediaRecorder is null", "MEDIARECORDER_NULL", !1)
+          new v("MediaRecorder is null", "MEDIARECORDER_NULL", !1)
         );
         return;
       }
-      const n = this.mediaRecorder, s = () => {
+      const o = this.mediaRecorder, s = () => {
         try {
-          const c = n.mimeType || "audio/webm", a = new Blob(this.audioChunks, { type: c });
+          const c = o.mimeType || "audio/webm", a = new Blob(this.audioChunks, { type: c });
           this.cleanup(), r(a);
         } catch (c) {
           e(
-            new y(
+            new v(
               `Failed to create audio blob: ${c instanceof Error ? c.message : String(c)}`,
               "BLOB_CREATION_FAILED",
               !1
@@ -853,7 +853,7 @@ class He {
           );
         }
       };
-      n.addEventListener("stop", s, { once: !0 }), n.stop();
+      o.addEventListener("stop", s, { once: !0 }), o.stop();
     });
   }
   /**
@@ -862,31 +862,34 @@ class He {
   async transcribe(r) {
     const {
       audioBlob: e,
-      model: n = this.config.model,
+      model: o = this.config.model,
       language: s = this.config.language,
       includeTimestamps: c = this.config.includeTimestamps,
       temperature: a = this.config.temperature
     } = r;
     if (!e || e.size === 0)
-      throw new y(
+      throw new v(
         "Audio blob is empty or invalid",
         "INVALID_AUDIO",
         !1
       );
     try {
-      const o = new FormData(), w = new File([e], "recording.wav", {
+      const n = new FormData(), w = new File([e], "recording.wav", {
         type: e.type || "audio/wav"
       });
-      o.append("file", w), o.append("model", n || "whisper-large-v3-turbo"), o.append("language", s || "en"), o.append("include_timestamps", String(c || !1)), o.append("temperature", String(a || 0));
-      const g = await se(
+      n.append("file", w), n.append("model", o || "whisper-large-v3-turbo"), n.append("language", s || "en"), n.append("include_timestamps", String(c || !1)), n.append("temperature", String(a || 0));
+      const m = await ae(
         `${this.config.baseUrl}/speech/transcribe`,
         {
           method: "POST",
           headers: {
             accept: "application/json",
-            "X-STT-Provider": this.config.provider || "groq"
+            "X-STT-Provider": this.config.provider || "groq",
+            ...this.config.authToken && {
+              Authorization: `Bearer ${this.config.authToken}`
+            }
           },
-          body: o
+          body: n
         },
         {
           attempts: 1,
@@ -896,27 +899,27 @@ class He {
           jitter: !0
         }
       );
-      if (!g.ok) {
-        const h = await g.text();
-        let u = `STT request failed: ${g.status} ${g.statusText}`;
+      if (!m.ok) {
+        const h = await m.text();
+        let u = `STT request failed: ${m.status} ${m.statusText}`;
         try {
-          const m = JSON.parse(h);
-          u = m.message || m.error || u;
+          const g = JSON.parse(h);
+          u = g.message || g.error || u;
         } catch {
           u = h || u;
         }
-        throw new y(
+        throw new v(
           u,
-          `HTTP_${g.status}`,
-          g.status >= 500
+          `HTTP_${m.status}`,
+          m.status >= 500
         );
       }
       return {
-        transcript: (await g.json()).data.text ?? ""
+        transcript: (await m.json()).data.text ?? ""
       };
-    } catch (o) {
-      throw o instanceof y ? o : new y(
-        `Transcription failed: ${o instanceof Error ? o.message : String(o)}`,
+    } catch (n) {
+      throw n instanceof v ? n : new v(
+        `Transcription failed: ${n instanceof Error ? n.message : String(n)}`,
         "TRANSCRIPTION_FAILED",
         !0
       );
@@ -957,13 +960,13 @@ class He {
     this.recordingStream && (this.recordingStream.getTracks().forEach((r) => r.stop()), this.recordingStream = null), this.mediaRecorder = null, this.audioChunks = [], this.autoStopTimeoutId && (clearTimeout(this.autoStopTimeoutId), this.autoStopTimeoutId = null);
   }
 }
-const z = new He(), Ye = (i = {}) => {
-  const [r, e] = k(!1), [n, s] = k(!1), [c, a] = k(null), [o, w] = k(null), [g, d] = k(null);
-  i.config && z.updateConfig(i.config);
-  const h = A(async (N) => {
+const Q = new He(), Ye = (i = {}) => {
+  const [r, e] = T(!1), [o, s] = T(!1), [c, a] = T(null), [n, w] = T(null), [m, d] = T(null);
+  i.config && Q.updateConfig(i.config);
+  const h = A(async (k) => {
     var j;
     try {
-      w(null), a(null), d(null), await z.startRecording(N, {
+      w(null), a(null), d(null), await Q.startRecording(k, {
         onStart: () => {
           var l;
           e(!0), (l = i.onStart) == null || l.call(i);
@@ -973,65 +976,65 @@ const z = new He(), Ye = (i = {}) => {
           e(!1), (l = i.onStop) == null || l.call(i);
         },
         onError: (l) => {
-          var M;
-          const f = l instanceof y ? l : new y(l.message, "RECORDING_ERROR", !0);
-          w(f), e(!1), (M = i.onError) == null || M.call(i, f);
+          var I;
+          const p = l instanceof v ? l : new v(l.message, "RECORDING_ERROR", !0);
+          w(p), e(!1), (I = i.onError) == null || I.call(i, p);
         }
       });
     } catch (l) {
-      const f = l instanceof y ? l : new y(
+      const p = l instanceof v ? l : new v(
         l instanceof Error ? l.message : String(l),
         "START_FAILED",
         !1
       );
-      throw w(f), e(!1), (j = i.onError) == null || j.call(i, f), f;
+      throw w(p), e(!1), (j = i.onError) == null || j.call(i, p), p;
     }
   }, []), u = A(async () => {
-    var N, j;
+    var k, j;
     try {
-      const l = await z.stopRecording();
-      return d(l), e(!1), (N = i.onStop) == null || N.call(i), l;
+      const l = await Q.stopRecording();
+      return d(l), e(!1), (k = i.onStop) == null || k.call(i), l;
     } catch (l) {
-      const f = l instanceof y ? l : new y(
+      const p = l instanceof v ? l : new v(
         l instanceof Error ? l.message : String(l),
         "STOP_FAILED",
         !1
       );
-      throw w(f), e(!1), (j = i.onError) == null || j.call(i, f), f;
+      throw w(p), e(!1), (j = i.onError) == null || j.call(i, p), p;
     }
-  }, []), m = A(
-    async (N, j = {}) => {
-      var l, f;
+  }, []), g = A(
+    async (k, j = {}) => {
+      var l, p;
       try {
         w(null), s(!0);
-        const M = {
-          audioBlob: N,
+        const I = {
+          audioBlob: k,
           ...j
-        }, b = await z.transcribe(M);
+        }, b = await Q.transcribe(I);
         return a(b.transcript), s(!1), (l = i.onTranscriptionComplete) == null || l.call(i, b), b;
-      } catch (M) {
-        const b = M instanceof y ? M : new y(
-          M instanceof Error ? M.message : String(M),
+      } catch (I) {
+        const b = I instanceof v ? I : new v(
+          I instanceof Error ? I.message : String(I),
           "TRANSCRIPTION_FAILED",
           !0
         );
-        throw w(b), s(!1), (f = i.onError) == null || f.call(i, b), b;
+        throw w(b), s(!1), (p = i.onError) == null || p.call(i, b), b;
       }
     },
     []
-  ), v = A(() => {
-    z.cancelRecording(), e(!1), d(null);
+  ), y = A(() => {
+    Q.cancelRecording(), e(!1), d(null);
   }, []);
   return {
     startRecording: h,
     stopRecording: u,
-    transcribe: m,
-    cancelRecording: v,
+    transcribe: g,
+    cancelRecording: y,
     isRecording: r,
-    isTranscribing: n,
+    isTranscribing: o,
     transcript: c,
-    error: o,
-    audioBlob: g
+    error: n,
+    audioBlob: m
   };
 };
 class Ve {
@@ -1058,18 +1061,21 @@ class Ve {
   async synthesizeSpeech(r) {
     const {
       text: e,
-      voice: n = this.config.voice,
+      voice: o = this.config.voice,
       speed: s = this.config.speed
     } = r, c = new URLSearchParams();
-    c.append("text", e), c.append("voice", n || "string"), c.append("speed", (s == null ? void 0 : s.toString()) || "1");
-    const a = await se(
+    c.append("text", e), c.append("voice", o || "string"), c.append("speed", (s == null ? void 0 : s.toString()) || "1");
+    const a = await ae(
       `${this.config.baseUrl}/speech/synthesize`,
       {
         method: "POST",
         headers: {
           accept: "application/json",
           "X-TTS-Provider": this.config.provider || "piper",
-          "Content-Type": "application/x-www-form-urlencoded"
+          "Content-Type": "application/x-www-form-urlencoded",
+          ...this.config.authToken && {
+            Authorization: `Bearer ${this.config.authToken}`
+          }
         },
         body: c
       },
@@ -1085,8 +1091,8 @@ class Ve {
       throw new Error(
         `TTS request failed: ${a.status} ${a.statusText}`
       );
-    const o = a.headers.get("content-type");
-    if (o && o.includes("audio/"))
+    const n = a.headers.get("content-type");
+    if (n && n.includes("audio/"))
       return a.blob();
     try {
       const w = await a.json();
@@ -1099,25 +1105,25 @@ class Ve {
    * Speak text and return a promise that resolves when playback completes
    */
   async speak(r, e) {
-    var n, s;
+    var o, s;
     try {
-      this.stop(), (n = e == null ? void 0 : e.onStart) == null || n.call(e);
+      this.stop(), (o = e == null ? void 0 : e.onStart) == null || o.call(e);
       const c = await this.synthesizeSpeech(r), a = URL.createObjectURL(c);
-      return this.currentAudio = new Audio(a), new Promise((o, w) => {
+      return this.currentAudio = new Audio(a), new Promise((n, w) => {
         if (!this.currentAudio) {
           w(new Error("Audio element not created"));
           return;
         }
-        const g = this.currentAudio;
-        g.onended = () => {
+        const m = this.currentAudio;
+        m.onended = () => {
           var d;
-          URL.revokeObjectURL(a), this.currentAudio = null, (d = e == null ? void 0 : e.onEnd) == null || d.call(e), o();
-        }, g.onerror = (d) => {
+          URL.revokeObjectURL(a), this.currentAudio = null, (d = e == null ? void 0 : e.onEnd) == null || d.call(e), n();
+        }, m.onerror = (d) => {
           var u;
           URL.revokeObjectURL(a), this.currentAudio = null;
           const h = new Error(`Audio playback failed: ${d}`);
           (u = e == null ? void 0 : e.onError) == null || u.call(e, h), w(h);
-        }, g.play().catch((d) => {
+        }, m.play().catch((d) => {
           var u;
           URL.revokeObjectURL(a), this.currentAudio = null;
           const h = new Error(`Failed to play audio: ${d.message}`);
@@ -1142,51 +1148,51 @@ class Ve {
     return this.currentAudio !== null && !this.currentAudio.paused;
   }
 }
-const re = new Ve(), Je = (i = {}) => {
-  const [r, e] = k(!1), [n, s] = k(!1), [c, a] = k(null);
-  i.config && re.updateConfig(i.config);
-  const o = A(
-    async (g, d = {}) => {
+const ie = new Ve(), Je = (i = {}) => {
+  const [r, e] = T(!1), [o, s] = T(!1), [c, a] = T(null);
+  i.config && ie.updateConfig(i.config);
+  const n = A(
+    async (m, d = {}) => {
       var h;
       try {
         a(null), s(!0);
         const u = {
-          text: g,
+          text: m,
           ...d
         };
-        await re.speak(u, {
+        await ie.speak(u, {
           onStart: () => {
-            var m;
-            s(!1), e(!0), (m = i.onStart) == null || m.call(i);
+            var g;
+            s(!1), e(!0), (g = i.onStart) == null || g.call(i);
           },
           onEnd: () => {
-            var m;
-            e(!1), (m = i.onEnd) == null || m.call(i);
+            var g;
+            e(!1), (g = i.onEnd) == null || g.call(i);
           },
-          onError: (m) => {
-            var v;
-            e(!1), s(!1), a(m), (v = i.onError) == null || v.call(i, m);
+          onError: (g) => {
+            var y;
+            e(!1), s(!1), a(g), (y = i.onError) == null || y.call(i, g);
           }
         });
       } catch (u) {
-        const m = u instanceof Error ? u : new Error(String(u));
-        throw a(m), e(!1), s(!1), (h = i.onError) == null || h.call(i, m), m;
+        const g = u instanceof Error ? u : new Error(String(u));
+        throw a(g), e(!1), s(!1), (h = i.onError) == null || h.call(i, g), g;
       }
     },
     [i]
   ), w = A(() => {
-    re.stop(), e(!1), s(!1);
+    ie.stop(), e(!1), s(!1);
   }, []);
   return {
-    speak: o,
+    speak: n,
     stop: w,
     isPlaying: r,
-    isLoading: n,
+    isLoading: o,
     error: c
   };
 }, Xe = ({ className: i = "" }) => {
-  const r = E(null);
-  return $(() => {
+  const r = S(null);
+  return P(() => {
     let e = null;
     return (async () => {
       try {
@@ -1205,28 +1211,28 @@ const re = new Ve(), Je = (i = {}) => {
     {
       ref: r,
       autoPlay: !0,
+      playsInline: !0,
       muted: !0,
-      hidden: !0,
       className: "iw-w-full iw-h-full iw-object-cover iw-scale-75 iw-rounded-md iw-min-h-[400px] iw-max-h-[600px] iw-aspect-video",
       style: {
         transform: "scaleX(-1)"
       }
     }
   ) });
-}, W = (i) => {
-  const { baseColor: r, borderRadius: e } = Q(), { loading: n, children: s, ...c } = i;
+}, Z = (i) => {
+  const { baseColor: r, borderRadius: e } = W(), { loading: o, children: s, ...c } = i;
   return /* @__PURE__ */ t.jsx(
-    ie,
+    se,
     {
       style: {
-        background: me(r),
+        background: ge(r),
         borderRadius: e
       },
       ...c,
-      children: n ? /* @__PURE__ */ t.jsx(ue, {}) : s
+      children: o ? /* @__PURE__ */ t.jsx(he, {}) : s
     }
   );
-}, ae = (i) => /* @__PURE__ */ t.jsxs(
+}, ne = (i) => /* @__PURE__ */ t.jsxs(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -1248,27 +1254,27 @@ const re = new Ve(), Je = (i = {}) => {
       /* @__PURE__ */ t.jsx("path", { d: "M8.644 21.42a10 10 0 0 0 7.631-.38" })
     ]
   }
-), Ze = (i, r, e) => Math.max(r, Math.min(e, i)), ce = (i) => {
-  const r = Math.max(0, Math.floor(i)), e = Math.floor(r / 60).toString().padStart(2, "0"), n = (r % 60).toString().padStart(2, "0");
-  return `${e}:${n}`;
-}, ne = ({
+), Ze = (i, r, e) => Math.max(r, Math.min(e, i)), le = (i) => {
+  const r = Math.max(0, Math.floor(i)), e = Math.floor(r / 60).toString().padStart(2, "0"), o = (r % 60).toString().padStart(2, "0");
+  return `${e}:${o}`;
+}, oe = ({
   total: i,
   remaining: r,
   size: e = 64,
-  strokeWidth: n = 6,
+  strokeWidth: o = 6,
   className: s = "",
   showLabel: c = !0
 }) => {
-  const a = Math.max(1, i || 1), o = Ze(r / a, 0, 1), { radius: w, circumference: g, dashOffset: d, center: h } = J(() => {
-    const v = (e - n) / 2, N = 2 * Math.PI * v, j = N * (1 - o), l = Math.round(n) % 2 === 1, f = e / 2 + (l ? 0.5 : 0);
-    return { radius: v, circumference: N, dashOffset: j, center: f };
-  }, [e, n, o]), u = J(() => o <= 0.25 ? "iw-stroke-red-500" : o <= 0.5 ? "iw-stroke-yellow-500" : "iw-stroke-green-500", [o]), m = o <= 0.25 ? "iw-animate-pulse" : "";
+  const a = Math.max(1, i || 1), n = Ze(r / a, 0, 1), { radius: w, circumference: m, dashOffset: d, center: h } = V(() => {
+    const y = (e - o) / 2, k = 2 * Math.PI * y, j = k * (1 - n), l = Math.round(o) % 2 === 1, p = e / 2 + (l ? 0.5 : 0);
+    return { radius: y, circumference: k, dashOffset: j, center: p };
+  }, [e, o, n]), u = V(() => n <= 0.25 ? "iw-stroke-red-500" : n <= 0.5 ? "iw-stroke-yellow-500" : "iw-stroke-green-500", [n]), g = n <= 0.25 ? "iw-animate-pulse" : "";
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: `iw-relative iw-inline-flex iw-items-center iw-justify-center iw-rounded-full iw-bg-white ${s}`,
       style: { width: e, height: e },
-      "aria-label": `Time remaining ${ce(r)}`,
+      "aria-label": `Time remaining ${le(r)}`,
       role: "timer",
       "aria-live": "polite",
       children: [
@@ -1287,7 +1293,7 @@ const re = new Ve(), Je = (i = {}) => {
                   cy: h,
                   r: w,
                   className: "iw-stroke-gray-200",
-                  strokeWidth: n,
+                  strokeWidth: o,
                   fill: "none",
                   shapeRendering: "geometricPrecision",
                   vectorEffect: "non-scaling-stroke"
@@ -1299,11 +1305,11 @@ const re = new Ve(), Je = (i = {}) => {
                   cx: h,
                   cy: h,
                   r: w,
-                  className: `${u} ${m}`,
-                  strokeWidth: n,
+                  className: `${u} ${g}`,
+                  strokeWidth: o,
                   strokeLinecap: "round",
                   fill: "none",
-                  strokeDasharray: g,
+                  strokeDasharray: m,
                   strokeDashoffset: d,
                   shapeRendering: "geometricPrecision",
                   vectorEffect: "non-scaling-stroke",
@@ -1318,8 +1324,8 @@ const re = new Ve(), Je = (i = {}) => {
         c && /* @__PURE__ */ t.jsx("div", { className: "iw-absolute iw-inset-0 iw-flex iw-items-center iw-justify-center iw-rotate-0", children: /* @__PURE__ */ t.jsx(
           "span",
           {
-            className: `iw-text-[11px] iw-font-semibold iw-tabular-nums ${o <= 0.25 ? "iw-text-red-600" : o <= 0.5 ? "iw-text-yellow-600" : "iw-text-green-600"}`,
-            children: ce(r)
+            className: `iw-text-[11px] iw-font-semibold iw-tabular-nums ${n <= 0.25 ? "iw-text-red-600" : n <= 0.5 ? "iw-text-yellow-600" : "iw-text-green-600"}`,
+            children: le(r)
           }
         ) })
       ]
@@ -1329,11 +1335,11 @@ const re = new Ve(), Je = (i = {}) => {
   label: i,
   error: r,
   fullWidth: e = !1,
-  className: n = "",
+  className: o = "",
   id: s,
   ...c
 }) => {
-  const a = s || `textarea-${Math.random().toString(36).substring(2, 9)}`, o = "iw-block iw-rounded-md iw-border iw-border-gray-300 iw-shadow-sm iw-px-4 iw-py-2 iw-text-sm  iw-transition-all", w = r ? "iw-border-red-500 iw-focus:border-red-500 iw-focus:ring-red-500" : "", g = e ? "iw-w-full" : "", d = n.includes("iw-h-full") || e ? "iw-h-full" : "";
+  const a = s || `textarea-${Math.random().toString(36).substring(2, 9)}`, n = "iw-block iw-rounded-md iw-border iw-border-gray-300 iw-shadow-sm iw-px-4 iw-py-2 iw-text-sm  iw-transition-all", w = r ? "iw-border-red-500 iw-focus:border-red-500 iw-focus:ring-red-500" : "", m = e ? "iw-w-full" : "", d = o.includes("iw-h-full") || e ? "iw-h-full" : "";
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
@@ -1351,7 +1357,7 @@ const re = new Ve(), Je = (i = {}) => {
           "textarea",
           {
             id: a,
-            className: `${o} ${w} ${g} ${d} ${n}`,
+            className: `${n} ${w} ${m} ${d} ${o}`,
             "aria-invalid": r ? "true" : "false",
             ...c
           }
@@ -1364,23 +1370,23 @@ const re = new Ve(), Je = (i = {}) => {
   value: i,
   onChange: r,
   onSubmit: e,
-  isSubmitDisabled: n,
+  isSubmitDisabled: o,
   state: s,
   editingTime: c
 }) => {
-  const a = (o) => {
-    o.key === "Enter" && (o.ctrlKey || o.metaKey) && !n && (o.preventDefault(), e());
+  const a = (n) => {
+    n.key === "Enter" && (n.ctrlKey || n.metaKey) && !o && (n.preventDefault(), e());
   };
   return /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-flex-col iw-h-full ", children: [
     /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-justify-between", children: [
       /* @__PURE__ */ t.jsx("h3", { className: "iw-text-lg iw-font-semibold iw-text-gray-900 iw-mb-1", children: "Your Answer" }),
       /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-justify-center iw-gap-2", children: [
         /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-gap-1", children: [
-          /* @__PURE__ */ t.jsx(ae, { className: "iw-size-4 iw-text-orange-600" }),
+          /* @__PURE__ */ t.jsx(ne, { className: "iw-size-4 iw-text-orange-600" }),
           /* @__PURE__ */ t.jsx("p", { className: "iw-text-gray-700 iw-text-sm", children: "Time to edit: " })
         ] }),
         /* @__PURE__ */ t.jsx(
-          ne,
+          oe,
           {
             total: c,
             remaining: s.currentPhaseTimeRemaining,
@@ -1399,38 +1405,38 @@ const re = new Ve(), Je = (i = {}) => {
           onKeyDown: a,
           placeholder: "Type your answer here...",
           className: " iw-w-full iw-h-full iw-flex-1 iw-resize-none !iw-p-4 iw-bg-transparent iw-min-h-full  focus-visible:iw-outline-0",
-          onPaste: (o) => o.preventDefault(),
-          onCopy: (o) => o.preventDefault(),
-          onCut: (o) => o.preventDefault(),
-          onDrop: (o) => o.preventDefault(),
-          onDragOver: (o) => o.preventDefault()
+          onPaste: (n) => n.preventDefault(),
+          onCopy: (n) => n.preventDefault(),
+          onCut: (n) => n.preventDefault(),
+          onDrop: (n) => n.preventDefault(),
+          onDragOver: (n) => n.preventDefault()
         }
       ),
-      /* @__PURE__ */ t.jsx("div", { className: "iw-w-full iw-grid iw-grid-cols-1 iw-mt-4", children: /* @__PURE__ */ t.jsx(W, { onClick: e, disabled: n, children: "Submit Answer" }) })
+      /* @__PURE__ */ t.jsx("div", { className: "iw-w-full iw-grid iw-grid-cols-1 iw-mt-4", children: /* @__PURE__ */ t.jsx(Z, { onClick: e, disabled: o, children: "Submit Answer" }) })
     ] })
   ] });
 }, tt = ({
   className: i = "",
   width: r,
   height: e = 56,
-  barWidth: n = 3,
+  barWidth: o = 3,
   gap: s = 2,
   fftSize: c = 1024,
   smoothingTimeConstant: a = 0.8,
-  mediaStream: o,
+  mediaStream: n,
   startOnMount: w = !0
 }) => {
-  const { baseColor: g } = Q(), d = E(null), h = E(null), u = E(null), m = E(null), v = E(null), N = E(null), j = E(!1), [l, f] = k(null);
-  $(() => {
+  const { baseColor: m } = W(), d = S(null), h = S(null), u = S(null), g = S(null), y = S(null), k = S(null), j = S(!1), [l, p] = T(null);
+  P(() => {
     if (r || !h.current) return;
-    const b = h.current, P = () => {
-      const R = d.current;
-      if (!R) return;
-      const S = b.clientWidth, C = e;
-      R.width = Math.max(1, Math.floor(S * window.devicePixelRatio || 1)), R.height = Math.max(1, Math.floor(C * window.devicePixelRatio || 1));
-    }, x = new ResizeObserver(P);
-    return x.observe(b), P(), () => x.disconnect();
-  }, [r, e]), $(() => {
+    const b = h.current, _ = () => {
+      const N = d.current;
+      if (!N) return;
+      const C = b.clientWidth, M = e;
+      N.width = Math.max(1, Math.floor(C * window.devicePixelRatio || 1)), N.height = Math.max(1, Math.floor(M * window.devicePixelRatio || 1));
+    }, x = new ResizeObserver(_);
+    return x.observe(b), _(), () => x.disconnect();
+  }, [r, e]), P(() => {
     if (!r) return;
     const b = d.current;
     b && (b.width = Math.max(
@@ -1440,58 +1446,58 @@ const re = new Ve(), Je = (i = {}) => {
       1,
       Math.floor(e * (window.devicePixelRatio || 1))
     ));
-  }, [r, e]), $(() => {
+  }, [r, e]), P(() => {
     let b = !1;
     return (async () => {
       try {
         const x = new (window.AudioContext || window.webkitAudioContext)();
         u.current = x;
-        let R = o;
-        if (!R) {
+        let N = n;
+        if (!N) {
           if (!w) return;
-          R = await navigator.mediaDevices.getUserMedia({
+          N = await navigator.mediaDevices.getUserMedia({
             audio: !0,
             video: !1
           }), j.current = !0;
         }
         if (b) return;
-        const S = x.createAnalyser();
-        S.fftSize = c, S.smoothingTimeConstant = a, m.current = S;
-        const C = x.createMediaStreamSource(R);
-        v.current = C, C.connect(S), M();
+        const C = x.createAnalyser();
+        C.fftSize = c, C.smoothingTimeConstant = a, g.current = C;
+        const M = x.createMediaStreamSource(N);
+        y.current = M, M.connect(C), I();
       } catch (x) {
-        f((x == null ? void 0 : x.message) || "Failed to initialize microphone");
+        p((x == null ? void 0 : x.message) || "Failed to initialize microphone");
       }
     })(), () => {
-      var x, R, S, C;
-      b = !0, N.current && cancelAnimationFrame(N.current);
+      var x, N, C, M;
+      b = !0, k.current && cancelAnimationFrame(k.current);
       try {
-        (x = v.current) == null || x.disconnect();
+        (x = y.current) == null || x.disconnect();
       } catch {
       }
       try {
-        (R = m.current) == null || R.disconnect();
+        (N = g.current) == null || N.disconnect();
       } catch {
       }
-      j.current && ((C = ((S = v.current) == null ? void 0 : S.mediaStream) || void 0) == null || C.getTracks().forEach((G) => G.stop())), u.current && u.current.state !== "closed" && u.current.close();
+      j.current && ((M = ((C = y.current) == null ? void 0 : C.mediaStream) || void 0) == null || M.getTracks().forEach((q) => q.stop())), u.current && u.current.state !== "closed" && u.current.close();
     };
-  }, [o, c, a, w]);
-  const M = () => {
-    const b = d.current, P = m.current;
-    if (!b || !P) return;
+  }, [n, c, a, w]);
+  const I = () => {
+    const b = d.current, _ = g.current;
+    if (!b || !_) return;
     const x = b.getContext("2d");
     if (!x) return;
-    const R = window.devicePixelRatio || 1, S = b.width, C = b.height, G = P.frequencyBinCount, _ = new Uint8Array(G), F = () => {
-      N.current = requestAnimationFrame(F), P.getByteTimeDomainData(_), x.clearRect(0, 0, S, C), x.fillStyle = "rgba(0,0,0,0)", x.fillRect(0, 0, S, C);
-      const T = Math.max(1, Math.floor(n * R)), q = Math.max(1, Math.floor(s * R)), H = T + q, Y = Math.max(8, Math.floor((S + q) / H)), K = Math.floor(_.length / Y);
-      for (let B = 0; B < Y; B++) {
-        const ee = Math.min(_.length - 1, B * K), te = _[ee] / 128 - 1, U = Math.abs(te), p = Math.pow(U, 0.6), L = Math.max(C * 0.06, p * (C * 0.9)), V = B * H, fe = (C - L) / 2, xe = 140 - Math.min(140, 140 * U), pe = 85, be = 48 + Math.floor(12 * (1 - U));
-        x.fillStyle = `${g}`, x.shadowColor = `hsla(${xe}, ${pe}%, ${be}%, ${0.25 * U})`, x.shadowBlur = 8 * U;
-        const ye = Math.min(T / 2, L / 2);
-        rt(x, V, fe, T, L, ye), x.fill();
+    const N = window.devicePixelRatio || 1, C = b.width, M = b.height, q = _.frequencyBinCount, U = new Uint8Array(q), L = () => {
+      k.current = requestAnimationFrame(L), _.getByteTimeDomainData(U), x.clearRect(0, 0, C, M), x.fillStyle = "rgba(0,0,0,0)", x.fillRect(0, 0, C, M);
+      const O = Math.max(1, Math.floor(o * N)), E = Math.max(1, Math.floor(s * N)), B = O + E, H = Math.max(8, Math.floor((C + E) / B)), K = Math.floor(U.length / H);
+      for (let z = 0; z < H; z++) {
+        const ee = Math.min(U.length - 1, z * K), te = U[ee] / 128 - 1, G = Math.abs(te), re = Math.pow(G, 0.6), f = Math.max(M * 0.06, re * (M * 0.9)), F = z * B, Y = (M - f) / 2, xe = 140 - Math.min(140, 140 * G), pe = 85, be = 48 + Math.floor(12 * (1 - G));
+        x.fillStyle = `${m}`, x.shadowColor = `hsla(${xe}, ${pe}%, ${be}%, ${0.25 * G})`, x.shadowBlur = 8 * G;
+        const ye = Math.min(O / 2, f / 2);
+        rt(x, F, Y, O, f, ye), x.fill();
       }
     };
-    F();
+    L();
   };
   return /* @__PURE__ */ t.jsxs(
     "div",
@@ -1506,26 +1512,26 @@ const re = new Ve(), Je = (i = {}) => {
     }
   );
 };
-function rt(i, r, e, n, s, c) {
-  const a = Math.min(c, n / 2, s / 2);
-  i.beginPath(), i.moveTo(r + a, e), i.lineTo(r + n - a, e), i.quadraticCurveTo(r + n, e, r + n, e + a), i.lineTo(r + n, e + s - a), i.quadraticCurveTo(r + n, e + s, r + n - a, e + s), i.lineTo(r + a, e + s), i.quadraticCurveTo(r, e + s, r, e + s - a), i.lineTo(r, e + a), i.quadraticCurveTo(r, e, r + a, e), i.closePath();
+function rt(i, r, e, o, s, c) {
+  const a = Math.min(c, o / 2, s / 2);
+  i.beginPath(), i.moveTo(r + a, e), i.lineTo(r + o - a, e), i.quadraticCurveTo(r + o, e, r + o, e + a), i.lineTo(r + o, e + s - a), i.quadraticCurveTo(r + o, e + s, r + o - a, e + s), i.lineTo(r + a, e + s), i.quadraticCurveTo(r, e + s, r, e + s - a), i.lineTo(r, e + a), i.quadraticCurveTo(r, e, r + a, e), i.closePath();
 }
 const it = ({
   state: i,
   answeringTime: r,
   nextPhase: e,
-  sttError: n
+  sttError: o
 }) => /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-flex-col iw-justify-between iw-h-full ", children: [
   /* @__PURE__ */ t.jsxs("div", { children: [
     /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-justify-between", children: [
       /* @__PURE__ */ t.jsx("h3", { className: "iw-text-lg iw-font-semibold iw-text-gray-900 iw-mb-1", children: "You may start speaking now. We're listening...." }),
       /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-justify-center iw-gap-2", children: [
         /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-gap-1", children: [
-          /* @__PURE__ */ t.jsx(ae, { className: "iw-size-4 iw-text-orange-600" }),
+          /* @__PURE__ */ t.jsx(ne, { className: "iw-size-4 iw-text-orange-600" }),
           /* @__PURE__ */ t.jsx("p", { className: "iw-text-gray-700 iw-text-sm", children: "Time to talk: " })
         ] }),
         /* @__PURE__ */ t.jsx(
-          ne,
+          oe,
           {
             total: r,
             remaining: i.currentPhaseTimeRemaining,
@@ -1539,13 +1545,13 @@ const it = ({
   ] }),
   /* @__PURE__ */ t.jsxs("div", { children: [
     /* @__PURE__ */ t.jsx(tt, {}),
-    n && /* @__PURE__ */ t.jsxs("div", { className: "iw-mt-2 iw-text-xs iw-text-red-600", children: [
+    o && /* @__PURE__ */ t.jsxs("div", { className: "iw-mt-2 iw-text-xs iw-text-red-600", children: [
       "Recording error: ",
-      n.message
+      o.message
     ] })
   ] }),
   /* @__PURE__ */ t.jsx("div", { className: "iw-w-full iw-grid iw-grid-cols-1", children: /* @__PURE__ */ t.jsx(
-    W,
+    Z,
     {
       onClick: () => {
         e();
@@ -1555,18 +1561,18 @@ const it = ({
   ) })
 ] });
 function st() {
-  const [i, r] = k(!0), e = J(
-    () => [0, 1, 2].map((n) => ({ id: n })),
+  const [i, r] = T(!0), e = V(
+    () => [0, 1, 2].map((o) => ({ id: o })),
     []
   );
-  return $(() => {
-    const n = setInterval(() => {
+  return P(() => {
+    const o = setInterval(() => {
       r((s) => !s);
     }, 1500);
-    return () => clearInterval(n);
+    return () => clearInterval(o);
   }, []), /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-flex-col iw-items-center iw-justify-center iw-gap-8 iw-h-full", children: [
-    /* @__PURE__ */ t.jsx("div", { className: "iw-relative iw-w-80 iw-h-48 ", "aria-hidden": !0, children: e.map((n, s) => {
-      const c = s * 50, a = i ? c : c + 12, o = i ? 1 : 0.08, w = s * 140;
+    /* @__PURE__ */ t.jsx("div", { className: "iw-relative iw-w-80 iw-h-48 ", "aria-hidden": !0, children: e.map((o, s) => {
+      const c = s * 50, a = i ? c : c + 12, n = i ? 1 : 0.08, w = s * 140;
       return /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -1575,7 +1581,7 @@ function st() {
           style: {
             top: 0,
             transform: `translateY(${a}px)`,
-            opacity: o,
+            opacity: n,
             transition: `transform 600ms cubic-bezier(.2,.9,.3,1) ${w}ms, opacity 400ms ease ${w}ms`
           },
           children: /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-gap-3 iw-items-center", children: [
@@ -1586,34 +1592,34 @@ function st() {
             ] })
           ] })
         },
-        n.id
+        o.id
       );
     }) }),
     /* @__PURE__ */ t.jsx("div", { className: "iw-text-center", children: /* @__PURE__ */ t.jsx("p", { className: "iw-text-gray-500  iw-font-medium", children: "Preparing your question..." }) })
   ] });
 }
-const ge = ({
+const fe = ({
   isOpen: i,
   onClose: r,
   children: e,
-  title: n,
+  title: o,
   showCloseButton: s = !0,
   closeOnOverlayClick: c = !0,
   closeOnEscape: a = !0,
-  className: o = ""
+  className: n = ""
 }) => {
-  if ($(() => {
+  if (P(() => {
     if (!i || !a) return;
     const d = (h) => {
       h.key === "Escape" && r();
     };
     return document.addEventListener("keydown", d), () => document.removeEventListener("keydown", d);
-  }, [i, a, r]), $(() => (i ? (document.body.style.overflow = "hidden", document.body.classList.add("interview-widget-container")) : (document.body.style.overflow = "unset", document.body.classList.remove("interview-widget-container")), () => {
+  }, [i, a, r]), P(() => (i ? (document.body.style.overflow = "hidden", document.body.classList.add("interview-widget-container")) : (document.body.style.overflow = "unset", document.body.classList.remove("interview-widget-container")), () => {
     document.body.style.overflow = "unset", document.body.classList.remove("interview-widget-container");
   }), [i]), !i) return null;
   const w = (d) => {
     c && d.target === d.currentTarget && r();
-  }, g = /* @__PURE__ */ t.jsxs("div", { className: "iw-fixed iw-inset-0 iw-z-50 iw-flex iw-items-center iw-justify-center", children: [
+  }, m = /* @__PURE__ */ t.jsxs("div", { className: "iw-fixed iw-inset-0 iw-z-50 iw-flex iw-items-center iw-justify-center", children: [
     /* @__PURE__ */ t.jsx(
       "div",
       {
@@ -1624,18 +1630,18 @@ const ge = ({
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: `iw-relative iw-bg-white iw-rounded-lg iw-shadow-xl iw-max-w-md iw-w-full iw-mx-4 iw-max-h-[90vh] iw-overflow-hidden ${o}`,
+        className: `iw-relative iw-bg-white iw-rounded-lg iw-shadow-xl iw-max-w-md iw-w-full iw-mx-4 iw-max-h-[90vh] iw-overflow-hidden ${n}`,
         role: "dialog",
         "aria-modal": "true",
-        "aria-labelledby": n ? "dialog-title" : void 0,
+        "aria-labelledby": o ? "dialog-title" : void 0,
         children: [
-          (n || s) && /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-justify-between iw-p-4 iw-border-b iw-border-gray-200", children: [
-            n && /* @__PURE__ */ t.jsx(
+          (o || s) && /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-justify-between iw-p-4 iw-border-b iw-border-gray-200", children: [
+            o && /* @__PURE__ */ t.jsx(
               "h2",
               {
                 id: "dialog-title",
                 className: "iw-text-lg iw-font-semibold iw-text-gray-900",
-                children: n
+                children: o
               }
             ),
             s && /* @__PURE__ */ t.jsx(
@@ -1670,12 +1676,12 @@ const ge = ({
       }
     )
   ] });
-  return ke(g, document.body);
+  return ke(m, document.body);
 }, at = ({
   open: i,
   onClose: r
 }) => /* @__PURE__ */ t.jsx(
-  ge,
+  fe,
   {
     isOpen: i,
     onClose: r || (() => {
@@ -1701,22 +1707,14 @@ const ge = ({
           )
         }
       ),
-      /* @__PURE__ */ t.jsx("p", { className: "iw-text-gray-600 iw-mb-6", children: "Thank you for your time. Your answers have been recorded and submitted for review." }),
-      /* @__PURE__ */ t.jsx(
-        W,
-        {
-          className: "iw-mt-2 iw-px-6 iw-py-2 iw-bg-primary-500 iw-text-white iw-font-semibold iw-rounded-lg iw-shadow iw-transition hover:iw-bg-primary-600 focus:iw-outline-none",
-          onClick: r,
-          children: "Close"
-        }
-      )
+      /* @__PURE__ */ t.jsx("p", { className: "iw-text-gray-600 iw-mb-6", children: "Thank you for your time. Your answers have been recorded and submitted for review." })
     ] })
   }
 ), nt = ({
   size: i = "192px",
   className: r,
   colors: e,
-  animationDuration: n = 20
+  animationDuration: o = 20
 }) => {
   const c = { ...{
     bg: "oklch(95% 0.02 264.695)",
@@ -1726,7 +1724,7 @@ const ge = ({
     // Pastel blue
     c3: "oklch(78% 0.14 280)"
     // Pastel purple/lavender
-  }, ...e }, a = parseInt(i.replace("px", ""), 10), o = a < 50 ? Math.max(a * 8e-3, 1) : Math.max(a * 0.015, 4), w = a < 50 ? Math.max(a * 4e-3, 1.2) : Math.max(a * 8e-3, 1.5), g = a < 50 ? Math.max(a * 4e-3, 0.05) : Math.max(a * 8e-3, 0.1), d = a < 50 ? Math.max(a * 4e-3, 0.5) : Math.max(a * 8e-3, 2), h = a < 30 ? "0%" : a < 50 ? "5%" : a < 100 ? "15%" : "25%", u = a < 30 ? 1.1 : a < 50 ? Math.max(w * 1.2, 1.3) : w;
+  }, ...e }, a = parseInt(i.replace("px", ""), 10), n = a < 50 ? Math.max(a * 8e-3, 1) : Math.max(a * 0.015, 4), w = a < 50 ? Math.max(a * 4e-3, 1.2) : Math.max(a * 8e-3, 1.5), m = a < 50 ? Math.max(a * 4e-3, 0.05) : Math.max(a * 8e-3, 0.1), d = a < 50 ? Math.max(a * 4e-3, 0.5) : Math.max(a * 8e-3, 2), h = a < 30 ? "0%" : a < 50 ? "5%" : a < 100 ? "15%" : "25%", u = a < 30 ? 1.1 : a < 50 ? Math.max(w * 1.2, 1.3) : w;
   return /* @__PURE__ */ t.jsx(
     "div",
     {
@@ -1738,10 +1736,10 @@ const ge = ({
         "--c1": c.c1,
         "--c2": c.c2,
         "--c3": c.c3,
-        "--animation-duration": `${n}s`,
-        "--blur-amount": `${o}px`,
+        "--animation-duration": `${o}s`,
+        "--blur-amount": `${n}px`,
         "--contrast-amount": u,
-        "--dot-size": `${g}px`,
+        "--dot-size": `${m}px`,
         "--shadow-spread": `${d}px`,
         "--mask-radius": h
       },
@@ -1871,11 +1869,11 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
   ] }),
   /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-justify-center iw-gap-2", children: [
     /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-gap-1", children: [
-      /* @__PURE__ */ t.jsx(ae, { className: "iw-size-4 iw-text-orange-600" }),
+      /* @__PURE__ */ t.jsx(ne, { className: "iw-size-4 iw-text-orange-600" }),
       /* @__PURE__ */ t.jsx("p", { className: "iw-text-gray-700 iw-text-sm", children: "Time to think: " })
     ] }),
     /* @__PURE__ */ t.jsx(
-      ne,
+      oe,
       {
         total: r,
         remaining: i.currentPhaseTimeRemaining,
@@ -1885,7 +1883,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
     )
   ] }),
   /* @__PURE__ */ t.jsx("div", { className: "iw-w-full iw-grid iw-grid-cols-1", children: /* @__PURE__ */ t.jsx(
-    W,
+    Z,
     {
       onClick: () => {
         e();
@@ -1960,7 +1958,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
   question: i,
   isLoading: r = !1
 }) => {
-  const { baseColor: e } = Q();
+  const { baseColor: e } = W();
   return /* @__PURE__ */ t.jsx(
     "div",
     {
@@ -1988,7 +1986,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
   confirmExitInterview: i,
   isOpen: r,
   onClose: e
-}) => /* @__PURE__ */ t.jsx(ge, { isOpen: r, onClose: e, title: "Exit Interview", children: /* @__PURE__ */ t.jsxs("div", { className: "iw-space-y-4", children: [
+}) => /* @__PURE__ */ t.jsx(fe, { isOpen: r, onClose: e, title: "Exit Interview", children: /* @__PURE__ */ t.jsxs("div", { className: "iw-space-y-4", children: [
   /* @__PURE__ */ t.jsx("p", { className: "iw-text-base iw-text-gray-700", children: "Are you sure you want to exit the interview? All progress will be lost and you will not be able to resume." }),
   /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-justify-end iw-space-x-2", children: [
     /* @__PURE__ */ t.jsx(
@@ -2009,7 +2007,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
     )
   ] })
 ] }) }), ht = ({ title: i, onExit: r }) => {
-  const { baseColor: e } = Q(), [n, s] = k(!1);
+  const { baseColor: e } = W(), [o, s] = T(!1);
   return /* @__PURE__ */ t.jsxs("header", { className: "iw-w-full iw-text-gray-900", children: [
     /* @__PURE__ */ t.jsxs("div", { className: "iw-mx-auto iw-flex iw-items-center iw-justify-between iw-px-4 iw-py-3", children: [
       /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-items-center iw-space-x-2", children: [
@@ -2037,7 +2035,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
     /* @__PURE__ */ t.jsx(
       ut,
       {
-        isOpen: n,
+        isOpen: o,
         confirmExitInterview: () => {
           r(), s(!1);
         },
@@ -2050,71 +2048,73 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
   onComplete: r,
   className: e = ""
 }) => {
-  const n = We(), { baseUrl: s } = Se(), { timers: c, stt: a, tts: o } = Ce(), [w, g] = k(null), [d, h] = k(""), u = E(""), m = E(null), v = {
-    thinkingTime: (c == null ? void 0 : c.thinkingDuration) || 30,
-    answeringTime: (c == null ? void 0 : c.answeringDuration) || 120,
-    editingTime: (c == null ? void 0 : c.editingDuration) || 30
-  }, { thinkingTime: N, answeringTime: j, editingTime: l } = v;
-  $(() => {
-    u.current = d;
-  }, [d]);
-  const f = E(!1), { speak: M, error: b } = Je({
+  const o = We(), { baseUrl: s, authToken: c } = Se(), { timers: a, stt: n, tts: w } = Ce(), [m, d] = T(null), [h, u] = T(""), g = S(""), y = S(null), k = {
+    thinkingTime: (a == null ? void 0 : a.thinkingDuration) || 30,
+    answeringTime: (a == null ? void 0 : a.answeringDuration) || 120,
+    editingTime: (a == null ? void 0 : a.editingDuration) || 30
+  }, { thinkingTime: j, answeringTime: l, editingTime: p } = k;
+  P(() => {
+    g.current = h;
+  }, [h]);
+  const I = S(!1), { speak: b, error: _ } = Je({
     config: {
       baseUrl: s,
-      provider: o == null ? void 0 : o.provider
+      provider: w == null ? void 0 : w.provider,
+      authToken: c
     },
     onEnd: () => {
-      f.current = !1, T();
+      I.current = !1, E();
     },
     onError: () => {
-      f.current || (f.current = !0, T());
+      I.current || (I.current = !0, E());
     }
-  }), P = E(!1), x = E(!1), {
-    startRecording: R,
-    stopRecording: S,
-    transcribe: C,
-    error: G
+  }), x = S(!1), N = S(!1), {
+    startRecording: C,
+    stopRecording: M,
+    transcribe: q,
+    error: U
   } = Ye({
     config: {
       baseUrl: s,
-      provider: a == null ? void 0 : a.provider,
-      model: a == null ? void 0 : a.model,
-      language: a == null ? void 0 : a.language
+      provider: n == null ? void 0 : n.provider,
+      model: n == null ? void 0 : n.model,
+      language: n == null ? void 0 : n.language,
+      authToken: c
     },
     onStart: () => {
-      P.current = !1, x.current = !1;
+      x.current = !1, N.current = !1;
     },
     onStop: () => {
     },
-    onTranscriptionComplete: (p) => {
-      h(p.transcript), x.current || (x.current = !0, T());
+    onTranscriptionComplete: (f) => {
+      u(f.transcript), N.current || (N.current = !0, E());
     },
-    onError: (p) => {
-      console.error("STT Error:", p), P.current || (P.current = !0, T());
+    onError: (f) => {
+      console.error("STT Error:", f), x.current || (x.current = !0, E());
     }
-  }), { state: _, startQuestion: F, nextPhase: T, completeInterview: q } = Ge({
+  }), { state: L, startQuestion: O, nextPhase: E, completeInterview: B } = Ge({
     config: {
-      thinkingDuration: N,
-      answeringDuration: j,
-      editingDuration: l
+      thinkingDuration: j,
+      answeringDuration: l,
+      editingDuration: p
     },
     callbacks: {
-      onPhaseChange: (p) => {
-        switch (p) {
-          case I.FETCHING_QUESTION:
+      onPhaseChange: (f) => {
+        switch (f) {
+          case R.FETCHING_QUESTION:
             H();
             break;
-          case I.READING_QUESTION:
-            B();
-            break;
-          case I.ANSWERING:
+          case R.READING_QUESTION:
             ee();
             break;
-          case I.TRANSCRIBING:
+          case R.ANSWERING:
             te();
             break;
-          case I.SUBMITTING:
-            K();
+          case R.TRANSCRIBING:
+            G();
+            break;
+          case R.SUBMITTING:
+            z();
             break;
         }
       },
@@ -2123,101 +2123,101 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
       }
     }
   });
-  $(() => {
-    F();
+  P(() => {
+    O();
   }, []);
-  const { execute: H, loading: Y } = qe(
+  const { execute: H, loading: K } = qe(
     async () => {
-      var L, V;
-      const p = await n.generateQuestion({
+      var F, Y;
+      const f = await o.generateQuestion({
         interviewId: i,
-        question: ((L = m.current) == null ? void 0 : L.question) || "",
-        qnaId: ((V = m.current) == null ? void 0 : V.qna_id) || "",
-        answer: u.current
+        question: ((F = y.current) == null ? void 0 : F.question) || "",
+        qnaId: ((Y = y.current) == null ? void 0 : Y.qna_id) || "",
+        answer: g.current
       });
-      return m.current = p.data, p;
+      return y.current = f.data, f;
     },
     {
-      onSuccess: async (p) => {
-        p && p.data && (h(""), g(p.data), T());
+      onSuccess: async (f) => {
+        f && f.data && (u(""), d(f.data), E());
       },
-      onError: (p) => {
-        console.error("Failed to fetch questions:", p);
+      onError: (f) => {
+        console.error("Failed to fetch questions:", f);
       }
     }
-  ), K = A(async () => {
-    F();
-  }, [F]), B = A(async () => {
-    var p;
-    if ((p = m.current) != null && p.question)
+  ), z = A(async () => {
+    O();
+  }, [O]), ee = A(async () => {
+    var f;
+    if ((f = y.current) != null && f.question)
       try {
-        f.current = !1, await M(m.current.question), m.current.is_interview_done && (await Pe(2e3), q());
-      } catch (L) {
-        console.error("Failed to speak question:", L);
+        I.current = !1, await b(y.current.question), y.current.is_interview_done && (await Pe(2e3), B());
+      } catch (F) {
+        console.error("Failed to speak question:", F);
       }
     else
-      T();
-  }, [M, T, q]), ee = A(async () => {
+      E();
+  }, [b, E, B]), te = A(async () => {
     try {
-      await R(j);
-    } catch (p) {
-      console.error("Failed to start recording:", p), T();
+      await C(l);
+    } catch (f) {
+      console.error("Failed to start recording:", f), E();
     }
-  }, [R, T]), te = A(async () => {
+  }, [C, E]), G = A(async () => {
     try {
-      const p = await S();
-      await C(p);
-    } catch (p) {
-      console.error("STT processing failed:", p), !P.current && !x.current && (P.current = !0, T());
+      const f = await M();
+      await q(f);
+    } catch (f) {
+      console.error("STT processing failed:", f), !x.current && !N.current && (x.current = !0, E());
     }
-  }, [S, C, T]), U = () => {
-    const { phase: p } = _;
-    switch (p) {
-      case I.IDLE:
+  }, [M, q, E]), re = () => {
+    const { phase: f } = L;
+    switch (f) {
+      case R.IDLE:
         return /* @__PURE__ */ t.jsxs("div", { className: "iw-text-center iw-flex iw-flex-col iw-items-center iw-justify-center iw-gap-2 iw-h-full", children: [
           /* @__PURE__ */ t.jsx("h3", { className: "iw-text-lg iw-font-semibold iw-text-gray-900 iw-mb-1", children: "Ready to start the Interview?" }),
           /* @__PURE__ */ t.jsx("p", { className: "iw-max-w-xl iw-text-gray-500 iw-text-xs iw-leading-[21px]", children: `You will be asked a series of behavioral and technical questions. For each one you'll get a short thinking period, then a timed recording window. We'll transcribe your response so you can review and edit it before submitting. Click "Start Interview" when you're ready.` }),
-          /* @__PURE__ */ t.jsx(W, { onClick: F, className: "iw-mt-2 iw-w-40", children: "Start Interview" })
+          /* @__PURE__ */ t.jsx(Z, { onClick: O, className: "iw-mt-2 iw-w-40", children: "Start Interview" })
         ] });
-      case I.FETCHING_QUESTION:
+      case R.FETCHING_QUESTION:
         return /* @__PURE__ */ t.jsx(st, {});
-      case I.READING_QUESTION:
-        return /* @__PURE__ */ t.jsx(ot, { ttsError: b });
-      case I.THINKING:
+      case R.READING_QUESTION:
+        return /* @__PURE__ */ t.jsx(ot, { ttsError: _ });
+      case R.THINKING:
         return /* @__PURE__ */ t.jsx(
           ct,
           {
-            state: _,
-            thinkingTime: N,
-            nextPhase: T
+            state: L,
+            thinkingTime: j,
+            nextPhase: E
           }
         );
-      case I.ANSWERING:
+      case R.ANSWERING:
         return /* @__PURE__ */ t.jsx(
           it,
           {
-            state: _,
-            answeringTime: j,
-            nextPhase: T,
-            sttError: G
+            state: L,
+            answeringTime: l,
+            nextPhase: E,
+            sttError: U
           }
         );
-      case I.TRANSCRIBING:
-        return /* @__PURE__ */ t.jsx(lt, { sttError: G });
-      case I.EDITING:
-      case I.SUBMITTING:
+      case R.TRANSCRIBING:
+        return /* @__PURE__ */ t.jsx(lt, { sttError: U });
+      case R.EDITING:
+      case R.SUBMITTING:
         return /* @__PURE__ */ t.jsx("div", { className: "iw-space-y-4 iw-h-full", children: /* @__PURE__ */ t.jsx(
           et,
           {
-            value: d,
-            onChange: (L) => h(L.target.value),
-            onSubmit: () => T(),
-            isSubmitDisabled: !d.trim() || Y,
-            state: _,
-            editingTime: l
+            value: h,
+            onChange: (F) => u(F.target.value),
+            onSubmit: () => E(),
+            isSubmitDisabled: !h.trim() || K,
+            state: L,
+            editingTime: p
           }
         ) });
-      case I.COMPLETED:
+      case R.COMPLETED:
         return /* @__PURE__ */ t.jsx("div", { className: "iw-fixed iw-inset-0 iw-bg-white", children: /* @__PURE__ */ t.jsx(
           at,
           {
@@ -2235,7 +2235,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
       ht,
       {
         title: "Interview for Python Developer",
-        onExit: q
+        onExit: B
       }
     ),
     /* @__PURE__ */ t.jsxs(
@@ -2246,13 +2246,13 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
           /* @__PURE__ */ t.jsx("div", { className: "iw-flex iw-items-start iw-justify-between iw-gap-3", children: /* @__PURE__ */ t.jsx("div", { className: "iw-flex-1", children: /* @__PURE__ */ t.jsx(
             wt,
             {
-              question: w,
-              isLoading: _.phase === I.FETCHING_QUESTION || _.phase === I.IDLE
+              question: m,
+              isLoading: L.phase === R.FETCHING_QUESTION || L.phase === R.IDLE
             }
           ) }) }),
           /* @__PURE__ */ t.jsxs("div", { className: "iw iw-bg-[#F6F6F6] iw-grid iw-grid-cols-2 iw-rounded-xl iw-p-4", children: [
             /* @__PURE__ */ t.jsx("div", { className: "iw-min-h-[400px] iw-max-h-[600px]", children: /* @__PURE__ */ t.jsx(Xe, {}) }),
-            /* @__PURE__ */ t.jsx("div", { className: "iw-bg-white iw-rounded-lg iw-shadow iw-p-6", children: U() })
+            /* @__PURE__ */ t.jsx("div", { className: "iw-bg-white iw-rounded-lg iw-shadow iw-p-6", children: re() })
           ] })
         ]
       }
@@ -2263,11 +2263,11 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
   onInterviewEnd: r,
   className: e = ""
 }) => {
-  const [n, s] = oe.useState(!1), [c, a] = oe.useState(!0), o = E(null);
-  return n ? /* @__PURE__ */ t.jsx("div", { className: "interview-widget-container", children: /* @__PURE__ */ t.jsx(
+  const [o, s] = ce.useState(!1), [c, a] = ce.useState(!0), n = S(null);
+  return o ? /* @__PURE__ */ t.jsx("div", { className: "interview-widget-container", children: /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: o,
+      ref: n,
       className: `iw-flex iw-flex-col iw-rounded-xl iw-shadow-lg iw-overflow-hidden  iw-h-[calc(100vh-1rem)] ${e}`,
       children: /* @__PURE__ */ t.jsx("div", { className: " iw-h-full iw-flex iw-flex-col", children: /* @__PURE__ */ t.jsx(
         mt,