interview-widget 0.1.5 → 0.1.7

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 ce, { createContext as Ne, useContext as Te, useRef as S, useState as T, useEffect as P, useCallback as A, useMemo as V } from "react";
+var je = (r, i, e) => i in r ? ve(r, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[i] = e;
+var D = (r, i, e) => je(r, typeof i != "symbol" ? i + "" : i, e);
+import de, { createContext as Ne, useContext as Te, useRef as S, useState as k, useEffect as P, useCallback as A, useMemo as X } from "react";
 import { createPortal as ke } from "react-dom";
-var de = { exports: {} }, J = {};
+var ue = { exports: {} }, Z = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -14,27 +14,27 @@ var de = { exports: {} }, J = {};
  * LICENSE file in the root directory of this source tree.
  */
 var Ie = Symbol.for("react.transitional.element"), Ee = Symbol.for("react.fragment");
-function we(i, r, e) {
-  var o = null;
-  if (e !== void 0 && (o = "" + e), r.key !== void 0 && (o = "" + r.key), "key" in r) {
+function he(r, i, e) {
+  var a = null;
+  if (e !== void 0 && (a = "" + e), i.key !== void 0 && (a = "" + i.key), "key" in i) {
     e = {};
-    for (var s in r)
-      s !== "key" && (e[s] = r[s]);
-  } else e = r;
-  return r = e.ref, {
+    for (var s in i)
+      s !== "key" && (e[s] = i[s]);
+  } else e = i;
+  return i = e.ref, {
     $$typeof: Ie,
-    type: i,
-    key: o,
-    ref: r !== void 0 ? r : null,
+    type: r,
+    key: a,
+    ref: i !== void 0 ? i : null,
     props: e
   };
 }
-J.Fragment = Ee;
-J.jsx = we;
-J.jsxs = we;
-de.exports = J;
-var t = de.exports;
-const $ = {
+Z.Fragment = Ee;
+Z.jsx = he;
+Z.jsxs = he;
+ue.exports = Z;
+var t = ue.exports;
+const _ = {
   api: {
     baseUrl: "/api",
     retryConfig: {
@@ -62,66 +62,66 @@ const $ = {
       provider: "piper"
     }
   }
-}, ue = Ne(
+}, me = Ne(
   null
 );
 function Re({
-  config: i = {},
-  children: r
+  config: r = {},
+  children: i
 }) {
-  var o, s, c, a;
+  var a, s, c, o;
   const e = {
     api: {
-      ...$.api,
-      ...i.api,
+      ..._.api,
+      ...r.api,
       retryConfig: {
-        ...$.api.retryConfig,
-        ...(o = i.api) == null ? void 0 : o.retryConfig
+        ..._.api.retryConfig,
+        ...(a = r.api) == null ? void 0 : a.retryConfig
       }
     },
     ui: {
-      ...$.ui,
-      ...i.ui
+      ..._.ui,
+      ...r.ui
     },
     interview: {
-      ...$.interview,
-      ...i.interview,
+      ..._.interview,
+      ...r.interview,
       timers: {
-        ...$.interview.timers,
-        ...(s = i.interview) == null ? void 0 : s.timers
+        ..._.interview.timers,
+        ...(s = r.interview) == null ? void 0 : s.timers
       },
       stt: {
-        ...$.interview.stt,
-        ...(c = i.interview) == null ? void 0 : c.stt
+        ..._.interview.stt,
+        ...(c = r.interview) == null ? void 0 : c.stt
       },
       tts: {
-        ...$.interview.tts,
-        ...(a = i.interview) == null ? void 0 : a.tts
+        ..._.interview.tts,
+        ...(o = r.interview) == null ? void 0 : o.tts
       }
     }
   };
-  return /* @__PURE__ */ t.jsx(ue.Provider, { value: e, children: r });
+  return /* @__PURE__ */ t.jsx(me.Provider, { value: e, children: i });
 }
-function X() {
-  const i = Te(ue);
-  if (!i)
+function K() {
+  const r = Te(me);
+  if (!r)
     throw new Error(
       "useInterviewConfig must be used within an InterviewWidgetProvider. Wrap your component tree with <InterviewWidgetProvider config={...}>"
     );
-  return i;
+  return r;
 }
 function Se() {
-  return X().api || $.api;
+  return K().api || _.api;
 }
-function W() {
-  return X().ui || $.ui;
+function V() {
+  return K().ui || _.ui;
 }
 function Ce() {
-  return X().interview || $.interview;
+  return K().interview || _.interview;
 }
-const he = ({
-  className: i,
-  ...r
+const ge = ({
+  className: r,
+  ...i
 }) => /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsxs(
   "svg",
   {
@@ -134,8 +134,8 @@ const he = ({
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    className: `iw-animate-spin ${i}`,
-    ...r,
+    className: `iw-animate-spin ${r}`,
+    ...i,
     children: [
       /* @__PURE__ */ t.jsx("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
       /* @__PURE__ */ t.jsx("path", { d: "M12 6l0 -3" }),
@@ -148,73 +148,73 @@ const he = ({
       /* @__PURE__ */ t.jsx("path", { d: "M7.75 7.75l-2.15 -2.15" })
     ]
   }
-) }), se = ({
-  children: i,
-  variant: r = "primary",
+) }), ne = ({
+  children: r,
+  variant: i = "primary",
   size: e = "md",
-  fullWidth: o = !1,
+  fullWidth: a = !1,
   isLoading: s = !1,
   disabled: c,
-  className: a = "",
+  className: 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", m = {
+  const l = "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",
     text: "iw-bg-transparent iw-text-primary-600 iw-hover:bg-primary-50 iw-border iw-border-transparent",
     gradient: "iw-text-white iw-border iw-border-transparent iw-bg-gradient-to-r iw-from-purple-500 iw-to-indigo-500 hover:iw-from-purple-600 hover:iw-to-indigo-600"
-  }, d = {
+  }, w = {
     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 = o ? "iw-w-full" : "";
+  }, h = "iw-disabled:opacity-50 iw-disabled:cursor-not-allowed iw-disabled:pointer-events-none", u = a ? "iw-w-full" : "";
   return /* @__PURE__ */ t.jsxs(
     "button",
     {
-      className: `${w} ${m[r]} ${d[e]} ${u} ${h} ${a}`,
+      className: `${l} ${m[i]} ${w[e]} ${u} ${h} ${o}`,
       disabled: c || s,
       ...n,
       children: [
-        s && /* @__PURE__ */ t.jsx(he, { height: 16, width: 16, style: { marginRight: "3px" } }),
-        i
+        s && /* @__PURE__ */ t.jsx(ge, { height: 16, width: 16, style: { marginRight: "3px" } }),
+        r
       ]
     }
   );
 };
-function Me(i) {
-  const r = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(i);
-  return r ? {
-    r: parseInt(r[1], 16),
-    g: parseInt(r[2], 16),
-    b: parseInt(r[3], 16)
+function Me(r) {
+  const i = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(r);
+  return i ? {
+    r: parseInt(i[1], 16),
+    g: parseInt(i[2], 16),
+    b: parseInt(i[3], 16)
   } : null;
 }
-function Ae(i, r, e) {
-  return "#" + [i, r, e].map((o) => {
-    const s = Math.round(o).toString(16);
+function Ae(r, i, e) {
+  return "#" + [r, i, e].map((a) => {
+    const s = Math.round(a).toString(16);
     return s.length === 1 ? "0" + s : s;
   }).join("");
 }
-function me(i, r) {
-  const e = Me(i);
-  if (!e) return i;
-  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 fe(r, i) {
+  const e = Me(r);
+  if (!e) return r;
+  const a = e.r + (255 - e.r) * i, s = e.g + (255 - e.g) * i, c = e.b + (255 - e.b) * i;
+  return Ae(a, s, c);
 }
-function De(i, r = 0.8) {
+function De(r, i = 0.8) {
   return {
-    background: `linear-gradient(to bottom, ${me(i, r)}, #ffffff)`,
+    background: `linear-gradient(to bottom, ${fe(r, i)}, #ffffff)`,
     color: "#1f2937"
   };
 }
-function Pe(i) {
-  return new Promise((r) => setTimeout(r, i));
+function Pe(r) {
+  return new Promise((i) => setTimeout(i, r));
 }
-function ge(i) {
-  return `linear-gradient(to left, ${me(i, 0.4)}, ${i})`;
+function xe(r) {
+  return `linear-gradient(to left, ${fe(r, 0.4)}, ${r})`;
 }
-const $e = (i) => /* @__PURE__ */ t.jsxs(
+const $e = (r) => /* @__PURE__ */ t.jsxs(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -226,7 +226,7 @@ const $e = (i) => /* @__PURE__ */ t.jsxs(
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...i,
+    ...r,
     children: [
       /* @__PURE__ */ t.jsx("path", { d: "M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z" }),
       /* @__PURE__ */ t.jsx("path", { d: "m9 12 2 2 4-4" })
@@ -240,40 +240,40 @@ const $e = (i) => /* @__PURE__ */ t.jsxs(
   "Do not disable or interfere with audio/video monitoring",
   "All activities are being recorded, and any violations may result in penalties, including disqualification"
 ], Le = ({
-  isOpen: i,
-  onStart: r,
+  isOpen: r,
+  onStart: i,
   onClose: e
 }) => {
-  var j;
-  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);
-  }, y = async () => {
-    u(!0), d(null);
+  var I;
+  const a = S(null), s = S(null), { baseColor: c, borderRadius: o } = V(), [n, l] = k(!1), [m, w] = k(null), [h, u] = k(!1), g = () => {
+    s.current && (s.current.getTracks().forEach((d) => d.stop()), s.current = null);
+  }, j = async () => {
+    u(!0), w(null);
     try {
-      const l = await navigator.mediaDevices.getUserMedia({
+      const d = await navigator.mediaDevices.getUserMedia({
         video: { width: { ideal: 1280 }, height: { ideal: 720 } },
         audio: !0
       });
-      s.current = l, o.current && (o.current.srcObject = l), w(!0);
-    } catch (l) {
-      console.error("Media permission error:", l);
-      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);
+      s.current = d, a.current && (a.current.srcObject = d), l(!0);
+    } catch (d) {
+      console.error("Media permission error:", d);
+      let x = "Unable to access camera or microphone.";
+      (d == null ? void 0 : d.name) === "NotAllowedError" ? x = "Permissions denied. Please allow access to camera and microphone." : (d == null ? void 0 : d.name) === "NotFoundError" ? x = "No camera/microphone found. Please connect a device and retry." : d != null && d.message && (x = d.message), l(!1), w(x);
     } finally {
       u(!1);
     }
   };
   if (P(() => {
-    if (!i) {
+    if (!r) {
       g();
       return;
     }
-    return y(), () => {
+    return j(), () => {
       g();
     };
-  }, [i]), !i) return null;
-  const k = () => {
-    r(), g();
+  }, [r]), !r) return null;
+  const y = () => {
+    i(), 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: [
@@ -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: o,
+            ref: a,
             autoPlay: !0,
             playsInline: !0,
             muted: !0,
@@ -307,29 +307,29 @@ 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(
-            se,
+            ne,
             {
-              onClick: y,
+              onClick: j,
               disabled: h,
               variant: "outline",
               size: "sm",
               style: {
                 borderColor: c,
-                borderRadius: a,
+                borderRadius: o,
                 color: c
               },
               children: n ? "Recheck Permissions" : "Enable Camera & Mic"
             }
           ),
           /* @__PURE__ */ t.jsx(
-            se,
+            ne,
             {
-              onClick: k,
+              onClick: y,
               disabled: !n,
               size: "sm",
               style: {
-                background: ge(c),
-                borderRadius: a
+                background: xe(c),
+                borderRadius: o
               },
               children: "Start Interview"
             }
@@ -341,14 +341,14 @@ const $e = (i) => /* @__PURE__ */ t.jsxs(
           /* @__PURE__ */ t.jsx($e, {}),
           /* @__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." }),
+        !((I = navigator.mediaDevices) != null && I.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." }),
         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)) })
+        /* @__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((d, x) => /* @__PURE__ */ t.jsx("li", { children: d }, x)) })
       ] })
     ] })
   ] }) });
 };
-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 || {});
+var R = /* @__PURE__ */ ((r) => (r.IDLE = "idle", r.FETCHING_QUESTION = "fetching_question", r.READING_QUESTION = "reading_question", r.THINKING = "thinking", r.ANSWERING = "answering", r.TRANSCRIBING = "transcribing", r.EDITING = "editing", r.SUBMITTING = "submitting", r.COMPLETED = "completed", r))(R || {});
 const Oe = {
   thinkingDuration: 30,
   answeringDuration: 120,
@@ -383,13 +383,13 @@ const Oe = {
   }
 };
 class Ue {
-  constructor(r = {}, e = {}) {
+  constructor(i = {}, e = {}) {
     D(this, "config");
     D(this, "state");
     D(this, "phaseIntervalId", null);
     D(this, "globalIntervalId", null);
     D(this, "callbacks");
-    this.config = { ...Oe, ...r }, this.callbacks = e, this.state = {
+    this.config = { ...Oe, ...i }, this.callbacks = e, this.state = {
       phase: "idle",
       currentPhaseTimeRemaining: 0,
       totalTimeElapsed: 0,
@@ -412,18 +412,18 @@ class Ue {
    * Move to next phase
    */
   nextPhase() {
-    const r = this.state.phase, e = Fe[r];
+    const i = this.state.phase, e = Fe[i];
     if (!e) return;
     this.stopPhaseTimer(), this.state.phase = e.next;
-    const o = this.getDurationForPhase(e.next);
-    o > 0 ? (this.state.currentPhaseTimeRemaining = o, this.startPhaseTimer()) : this.state.currentPhaseTimeRemaining = 0, this.notifyChange();
+    const a = this.getDurationForPhase(e.next);
+    a > 0 ? (this.state.currentPhaseTimeRemaining = a, this.startPhaseTimer()) : this.state.currentPhaseTimeRemaining = 0, this.notifyChange();
   }
   /**
    * Manually complete the interview
    */
   completeInterview() {
-    var r, e;
-    this.stopGlobalTimer(), this.stopPhaseTimer(), this.state.phase = "completed", (e = (r = this.callbacks).onInterviewEnd) == null || e.call(r), this.notifyChange();
+    var i, e, a, s;
+    (e = (i = this.callbacks).onComplete) == null || e.call(i), this.stopGlobalTimer(), this.stopPhaseTimer(), this.state.phase = "completed", (s = (a = this.callbacks).onInterviewEnd) == null || s.call(a), this.notifyChange();
   }
   /**
    * Cleanup
@@ -434,8 +434,8 @@ class Ue {
   /**
    * Get duration for a phase
    */
-  getDurationForPhase(r) {
-    switch (r) {
+  getDurationForPhase(i) {
+    switch (i) {
       case "thinking":
         return this.config.thinkingDuration;
       case "answering":
@@ -451,8 +451,8 @@ class Ue {
    */
   startGlobalTimer() {
     this.globalIntervalId = setInterval(() => {
-      var r, e;
-      this.state.totalTimeElapsed++, (e = (r = this.callbacks).onTick) == null || e.call(r, this.getState());
+      var i, e;
+      this.state.totalTimeElapsed++, (e = (i = this.callbacks).onTick) == null || e.call(i, this.getState());
     }, 1e3);
   }
   /**
@@ -479,21 +479,21 @@ class Ue {
    * Notify phase change
    */
   notifyChange() {
-    var r, e;
-    (e = (r = this.callbacks).onPhaseChange) == null || e.call(r, this.state.phase, this.getState());
+    var i, e;
+    (e = (i = this.callbacks).onPhaseChange) == null || e.call(i, this.state.phase, this.getState());
   }
 }
-function Ge(i = {}) {
-  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());
+function Ge(r = {}) {
+  const { config: i = {}, callbacks: e = {} } = r, a = S(null);
+  a.current || (a.current = new Ue(i, {}));
+  const s = a.current, [c, o] = k(s.getState()), n = A(() => {
+    o(s.getState());
   }, [s]);
   P(() => {
     const h = {
       onPhaseChange: (u, g) => {
-        var y;
-        n(), (y = e.onPhaseChange) == null || y.call(e, u, g);
+        var j;
+        n(), (j = e.onPhaseChange) == null || j.call(e, u, g);
       },
       onTick: (u) => {
         var g;
@@ -508,62 +508,62 @@ function Ge(i = {}) {
   }, [s, e, n]), P(() => () => {
     s.destroy();
   }, [s]);
-  const w = A(() => {
+  const l = A(() => {
     s.startQuestion(), n();
   }, [s, n]), m = A(() => {
     s.nextPhase(), n();
-  }, [s, n]), d = A(() => {
+  }, [s, n]), w = A(() => {
     s.completeInterview(), n();
   }, [s, n]);
   return {
     state: c,
-    startQuestion: w,
+    startQuestion: l,
     nextPhase: m,
-    completeInterview: d,
+    completeInterview: w,
     timerService: s
   };
 }
-function qe(i, r = {}) {
-  const [e, o] = T({
+function qe(r, i = {}) {
+  const [e, a] = k({
     data: null,
     loading: !1,
     error: null
   }), s = A(
     async (...c) => {
-      var a, n, w, m;
-      o((d) => ({ ...d, loading: !0, error: null }));
+      var o, n, l, m;
+      a((w) => ({ ...w, loading: !0, error: null }));
       try {
-        const d = await i(...c);
-        o((h) => ({
+        const w = await r(...c);
+        a((h) => ({
           ...h,
-          data: d,
+          data: w,
           loading: !1,
           error: 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 : {
+        })), (o = i.onSuccess) == null || o.call(i, w), (n = i.onSettled) == null || n.call(i, w, null);
+      } catch (w) {
+        const h = w.type ? w : {
           type: "unknown",
-          message: d.message || "Unknown error",
+          message: w.message || "Unknown error",
           retryable: !0,
           userMessage: "Something went wrong. Please try again.",
-          originalError: d
+          originalError: w
         };
-        o((u) => ({
+        a((u) => ({
           ...u,
           loading: !1,
           error: h
-        })), (w = r.onError) == null || w.call(r, h), (m = r.onSettled) == null || m.call(r, null, h);
+        })), (l = i.onError) == null || l.call(i, h), (m = i.onSettled) == null || m.call(i, null, h);
       }
     },
-    [i, r]
+    [r, i]
   );
   return {
     ...e,
     execute: s
   };
 }
-function Be(i) {
-  var r;
+function Be(r) {
+  var i;
   if (!navigator.onLine)
     return {
       type: "network",
@@ -571,15 +571,15 @@ function Be(i) {
       retryable: !0,
       userMessage: "Please check your internet connection and try again."
     };
-  if (i.name === "AbortError" || (r = i.message) != null && r.includes("timeout"))
+  if (r.name === "AbortError" || (i = r.message) != null && i.includes("timeout"))
     return {
       type: "timeout",
       message: "Request timed out",
       retryable: !0,
       userMessage: "The request is taking longer than expected. Please try again."
     };
-  if (i.status) {
-    const { status: e } = i;
+  if (r.status) {
+    const { status: e } = r;
     if (e === 401 || e === 403)
       return {
         type: "auth",
@@ -615,101 +615,101 @@ function Be(i) {
   }
   return {
     type: "unknown",
-    message: i.message || "Unknown error occurred",
+    message: r.message || "Unknown error occurred",
     retryable: !0,
     userMessage: "Something unexpected happened. Please try again.",
-    originalError: i
+    originalError: r
   };
 }
-async function ae(i, r = {}, e = {
+async function oe(r, i = {}, e = {
   attempts: 3,
   backoff: "exponential",
   baseDelay: 1e3,
   maxDelay: 1e4,
   jitter: !0
 }) {
-  let o;
+  let a;
   for (let s = 1; s <= e.attempts; s++)
     try {
-      const c = new AbortController(), a = setTimeout(() => c.abort(), 6e4), n = await fetch(i, {
-        ...r,
+      const c = new AbortController(), o = setTimeout(() => c.abort(), 6e4), n = await fetch(r, {
+        ...i,
         signal: c.signal
       });
-      if (clearTimeout(a), n.status >= 400 && n.status < 500 && n.status !== 429)
+      if (clearTimeout(o), 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) {
-      o = c;
-      const a = Be(c);
-      if (!a.retryable || s === e.attempts)
-        throw a;
+      a = c;
+      const o = Be(c);
+      if (!o.retryable || s === e.attempts)
+        throw o;
       const n = ze(s, e);
       console.warn(
         `API request failed (attempt ${s}/${e.attempts}), retrying in ${n}ms:`,
-        a.message
-      ), await new Promise((w) => setTimeout(w, n));
+        o.message
+      ), await new Promise((l) => setTimeout(l, n));
     }
-  throw o;
+  throw a;
 }
-function ze(i, r) {
+function ze(r, i) {
   let e;
-  return r.backoff === "exponential" ? e = r.baseDelay * Math.pow(2, i - 1) : e = r.baseDelay, e = Math.min(e, r.maxDelay), r.jitter && (e = e * (0.5 + Math.random() * 0.5)), Math.round(e);
+  return i.backoff === "exponential" ? e = i.baseDelay * Math.pow(2, r - 1) : e = i.baseDelay, e = Math.min(e, i.maxDelay), i.jitter && (e = e * (0.5 + Math.random() * 0.5)), Math.round(e);
 }
 class Qe {
-  constructor(r = {}) {
+  constructor(i = {}) {
     D(this, "config");
-    this.config = r;
+    this.config = i;
   }
   /**
    * Update configuration
    */
-  updateConfig(r) {
-    this.config = { ...this.config, ...r };
+  updateConfig(i) {
+    this.config = { ...this.config, ...i };
   }
   /**
    * Get default headers for API requests
    */
   getHeaders() {
     var e;
-    const r = {
+    const i = {
       "Content-Type": "application/json",
       "X-Auth-Token": "appkey"
     };
-    return (e = this.config) != null && e.authToken && (r.Authorization = `Bearer ${this.config.authToken}`), r;
+    return (e = this.config) != null && e.authToken && (i.Authorization = `Bearer ${this.config.authToken}`), i;
   }
   /**
    * Get base URL from config with fallback
    */
   getBaseUrl() {
-    var r;
-    return ((r = this.config) == null ? void 0 : r.baseUrl) || "/api";
+    var i;
+    return ((i = this.config) == null ? void 0 : i.baseUrl) || "/api";
   }
   /**
    * Get questions for an interview
    */
   async generateQuestion({
-    interviewId: r,
+    interviewId: i,
     isInterviewDone: e = !1,
-    qnaId: o,
+    qnaId: a,
     question: s,
     answer: c,
-    answerDuration: a
+    answerDuration: o
   }) {
-    const n = await ae(
+    const n = await oe(
       `${this.getBaseUrl()}/questions/next`,
       {
         method: "POST",
         headers: this.getHeaders(),
         body: JSON.stringify({
-          interview_id: r,
+          interview_id: i,
           is_interview_done: e,
-          qna_id: o,
+          qna_id: a,
           question: s,
           answer: c,
           // TODO: Hardcoded for now, will be dynamic later
-          answer_duration: a ?? "00:00:30"
+          answer_duration: o ?? "00:00:30"
         })
       }
     );
@@ -719,19 +719,19 @@ class Qe {
   }
 }
 function We() {
-  const i = X();
-  return V(() => {
-    const e = i.api || {};
+  const r = K();
+  return X(() => {
+    const e = r.api || {};
     return new Qe(e);
-  }, [i.api]);
+  }, [r.api]);
 }
 class v extends Error {
-  constructor(r, e, o = !1) {
-    super(r), this.code = e, this.recoverable = o, this.name = "STTError";
+  constructor(i, e, a = !1) {
+    super(i), this.code = e, this.recoverable = a, this.name = "STTError";
   }
 }
 class He {
-  constructor(r = {}) {
+  constructor(i = {}) {
     D(this, "config");
     D(this, "mediaRecorder", null);
     D(this, "audioChunks", []);
@@ -744,14 +744,14 @@ class He {
       language: "en",
       includeTimestamps: !1,
       temperature: 0,
-      ...r
+      ...i
     };
   }
   /**
    * Update STT configuration
    */
-  updateConfig(r) {
-    this.config = { ...this.config, ...r };
+  updateConfig(i) {
+    this.config = { ...this.config, ...i };
   }
   /**
    * Check if browser supports audio recording
@@ -762,8 +762,8 @@ class He {
   /**
    * Start recording audio from user's microphone
    */
-  async startRecording(r, e) {
-    var o;
+  async startRecording(i, e) {
+    var a;
     if (!this.isRecordingSupported())
       throw new v(
         "Audio recording is not supported in this browser",
@@ -788,22 +788,22 @@ class He {
       this.mediaRecorder = new MediaRecorder(this.recordingStream, {
         mimeType: s
       }), this.mediaRecorder.ondataavailable = (c) => {
-        var a;
-        c.data.size > 0 && (this.audioChunks.push(c.data), (a = e == null ? void 0 : e.onDataAvailable) == null || a.call(e, c.data));
+        var o;
+        c.data.size > 0 && (this.audioChunks.push(c.data), (o = e == null ? void 0 : e.onDataAvailable) == null || o.call(e, c.data));
       }, this.mediaRecorder.onstop = () => {
         var c;
         (c = e == null ? void 0 : e.onStop) == null || c.call(e);
       }, this.mediaRecorder.onerror = (c) => {
         var n;
-        const a = new v(
+        const o = new v(
           `Recording failed: ${c.error}`,
           "RECORDING_ERROR",
           !0
         );
-        (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(() => {
+        (n = e == null ? void 0 : e.onError) == null || n.call(e, o), this.cleanup();
+      }, this.mediaRecorder.start(100), (a = e == null ? void 0 : e.onStart) == null || a.call(e), i && i > 0 && (this.autoStopTimeoutId = setTimeout(() => {
         this.isRecording() && this.stopRecording();
-      }, r * 1e3));
+      }, i * 1e3));
     } catch (s) {
       if (this.cleanup(), s instanceof Error) {
         if (s.name === "NotAllowedError" || s.name === "PermissionDeniedError")
@@ -832,17 +832,17 @@ class He {
         "NO_ACTIVE_RECORDING",
         !1
       );
-    return new Promise((r, e) => {
+    return new Promise((i, e) => {
       if (!this.mediaRecorder) {
         e(
           new v("MediaRecorder is null", "MEDIARECORDER_NULL", !1)
         );
         return;
       }
-      const o = this.mediaRecorder, s = () => {
+      const a = this.mediaRecorder, s = () => {
         try {
-          const c = o.mimeType || "audio/webm", a = new Blob(this.audioChunks, { type: c });
-          this.cleanup(), r(a);
+          const c = a.mimeType || "audio/webm", o = new Blob(this.audioChunks, { type: c });
+          this.cleanup(), i(o);
         } catch (c) {
           e(
             new v(
@@ -853,20 +853,20 @@ class He {
           );
         }
       };
-      o.addEventListener("stop", s, { once: !0 }), o.stop();
+      a.addEventListener("stop", s, { once: !0 }), a.stop();
     });
   }
   /**
    * Transcribe audio blob using the STT API
    */
-  async transcribe(r) {
+  async transcribe(i) {
     const {
       audioBlob: e,
-      model: o = this.config.model,
+      model: a = this.config.model,
       language: s = this.config.language,
       includeTimestamps: c = this.config.includeTimestamps,
-      temperature: a = this.config.temperature
-    } = r;
+      temperature: o = this.config.temperature
+    } = i;
     if (!e || e.size === 0)
       throw new v(
         "Audio blob is empty or invalid",
@@ -874,11 +874,11 @@ class He {
         !1
       );
     try {
-      const n = new FormData(), w = new File([e], "recording.wav", {
+      const n = new FormData(), l = new File([e], "recording.wav", {
         type: e.type || "audio/wav"
       });
-      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(
+      n.append("file", l), n.append("model", a || "whisper-large-v3-turbo"), n.append("language", s || "en"), n.append("include_timestamps", String(c || !1)), n.append("temperature", String(o || 0));
+      const m = await oe(
         `${this.config.baseUrl}/speech/transcribe`,
         {
           method: "POST",
@@ -941,14 +941,14 @@ class He {
    * Get supported MIME type for recording
    */
   getSupportedMimeType() {
-    const r = [
+    const i = [
       "audio/webm",
       "audio/webm;codecs=opus",
       "audio/ogg;codecs=opus",
       "audio/mp4",
       "audio/wav"
     ];
-    for (const e of r)
+    for (const e of i)
       if (MediaRecorder.isTypeSupported(e))
         return e;
     return "audio/webm";
@@ -957,88 +957,88 @@ class He {
    * Clean up recording resources
    */
   cleanup() {
-    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);
+    this.recordingStream && (this.recordingStream.getTracks().forEach((i) => i.stop()), this.recordingStream = null), this.mediaRecorder = null, this.audioChunks = [], this.autoStopTimeoutId && (clearTimeout(this.autoStopTimeoutId), this.autoStopTimeoutId = null);
   }
 }
-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;
+const Y = new He(), Ye = (r = {}) => {
+  const [i, e] = k(!1), [a, s] = k(!1), [c, o] = k(null), [n, l] = k(null), [m, w] = k(null);
+  r.config && Y.updateConfig(r.config);
+  const h = A(async (y) => {
+    var I;
     try {
-      w(null), a(null), d(null), await Q.startRecording(k, {
+      l(null), o(null), w(null), await Y.startRecording(y, {
         onStart: () => {
-          var l;
-          e(!0), (l = i.onStart) == null || l.call(i);
+          var d;
+          e(!0), (d = r.onStart) == null || d.call(r);
         },
         onStop: () => {
-          var l;
-          e(!1), (l = i.onStop) == null || l.call(i);
+          var d;
+          e(!1), (d = r.onStop) == null || d.call(r);
         },
-        onError: (l) => {
-          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);
+        onError: (d) => {
+          var C;
+          const x = d instanceof v ? d : new v(d.message, "RECORDING_ERROR", !0);
+          l(x), e(!1), (C = r.onError) == null || C.call(r, x);
         }
       });
-    } catch (l) {
-      const p = l instanceof v ? l : new v(
-        l instanceof Error ? l.message : String(l),
+    } catch (d) {
+      const x = d instanceof v ? d : new v(
+        d instanceof Error ? d.message : String(d),
         "START_FAILED",
         !1
       );
-      throw w(p), e(!1), (j = i.onError) == null || j.call(i, p), p;
+      throw l(x), e(!1), (I = r.onError) == null || I.call(r, x), x;
     }
   }, []), u = A(async () => {
-    var k, j;
+    var y, I;
     try {
-      const l = await Q.stopRecording();
-      return d(l), e(!1), (k = i.onStop) == null || k.call(i), l;
-    } catch (l) {
-      const p = l instanceof v ? l : new v(
-        l instanceof Error ? l.message : String(l),
+      const d = await Y.stopRecording();
+      return w(d), e(!1), (y = r.onStop) == null || y.call(r), d;
+    } catch (d) {
+      const x = d instanceof v ? d : new v(
+        d instanceof Error ? d.message : String(d),
         "STOP_FAILED",
         !1
       );
-      throw w(p), e(!1), (j = i.onError) == null || j.call(i, p), p;
+      throw l(x), e(!1), (I = r.onError) == null || I.call(r, x), x;
     }
   }, []), g = A(
-    async (k, j = {}) => {
-      var l, p;
+    async (y, I = {}) => {
+      var d, x;
       try {
-        w(null), s(!0);
-        const I = {
-          audioBlob: k,
-          ...j
-        }, b = await Q.transcribe(I);
-        return a(b.transcript), s(!1), (l = i.onTranscriptionComplete) == null || l.call(i, b), b;
-      } catch (I) {
-        const b = I instanceof v ? I : new v(
-          I instanceof Error ? I.message : String(I),
+        l(null), s(!0);
+        const C = {
+          audioBlob: y,
+          ...I
+        }, p = await Y.transcribe(C);
+        return o(p.transcript), s(!1), (d = r.onTranscriptionComplete) == null || d.call(r, p), p;
+      } catch (C) {
+        const p = C instanceof v ? C : new v(
+          C instanceof Error ? C.message : String(C),
           "TRANSCRIPTION_FAILED",
           !0
         );
-        throw w(b), s(!1), (p = i.onError) == null || p.call(i, b), b;
+        throw l(p), s(!1), (x = r.onError) == null || x.call(r, p), p;
       }
     },
     []
-  ), y = A(() => {
-    Q.cancelRecording(), e(!1), d(null);
+  ), j = A(() => {
+    Y.cancelRecording(), e(!1), w(null);
   }, []);
   return {
     startRecording: h,
     stopRecording: u,
     transcribe: g,
-    cancelRecording: y,
-    isRecording: r,
-    isTranscribing: o,
+    cancelRecording: j,
+    isRecording: i,
+    isTranscribing: a,
     transcript: c,
     error: n,
     audioBlob: m
   };
 };
 class Ve {
-  constructor(r = {}) {
+  constructor(i = {}) {
     D(this, "config");
     D(this, "currentAudio", null);
     this.config = {
@@ -1046,26 +1046,26 @@ class Ve {
       provider: "piper",
       voice: "string",
       speed: 1,
-      ...r
+      ...i
     };
   }
   /**
    * Update TTS configuration
    */
-  updateConfig(r) {
-    this.config = { ...this.config, ...r };
+  updateConfig(i) {
+    this.config = { ...this.config, ...i };
   }
   /**
    * Get TTS audio from the API and return as blob
    */
-  async synthesizeSpeech(r) {
+  async synthesizeSpeech(i) {
     const {
       text: e,
-      voice: o = this.config.voice,
+      voice: a = this.config.voice,
       speed: s = this.config.speed
-    } = r, c = new URLSearchParams();
-    c.append("text", e), c.append("voice", o || "string"), c.append("speed", (s == null ? void 0 : s.toString()) || "1");
-    const a = await ae(
+    } = i, c = new URLSearchParams();
+    c.append("text", e), c.append("voice", a || "string"), c.append("speed", (s == null ? void 0 : s.toString()) || "1");
+    const o = await oe(
       `${this.config.baseUrl}/speech/synthesize`,
       {
         method: "POST",
@@ -1087,16 +1087,16 @@ class Ve {
         jitter: !1
       }
     );
-    if (!a.ok)
+    if (!o.ok)
       throw new Error(
-        `TTS request failed: ${a.status} ${a.statusText}`
+        `TTS request failed: ${o.status} ${o.statusText}`
       );
-    const n = a.headers.get("content-type");
+    const n = o.headers.get("content-type");
     if (n && n.includes("audio/"))
-      return a.blob();
+      return o.blob();
     try {
-      const w = await a.json();
-      throw new Error(`TTS Error: ${JSON.stringify(w)}`);
+      const l = await o.json();
+      throw new Error(`TTS Error: ${JSON.stringify(l)}`);
     } catch {
       throw new Error("TTS request failed with unknown error");
     }
@@ -1104,35 +1104,35 @@ class Ve {
   /**
    * Speak text and return a promise that resolves when playback completes
    */
-  async speak(r, e) {
-    var o, s;
+  async speak(i, e) {
+    var a, s;
     try {
-      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((n, w) => {
+      this.stop(), (a = e == null ? void 0 : e.onStart) == null || a.call(e);
+      const c = await this.synthesizeSpeech(i), o = URL.createObjectURL(c);
+      return this.currentAudio = new Audio(o), new Promise((n, l) => {
         if (!this.currentAudio) {
-          w(new Error("Audio element not created"));
+          l(new Error("Audio element not created"));
           return;
         }
         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), n();
-        }, m.onerror = (d) => {
+          var w;
+          URL.revokeObjectURL(o), this.currentAudio = null, (w = e == null ? void 0 : e.onEnd) == null || w.call(e), n();
+        }, m.onerror = (w) => {
           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);
-        }, m.play().catch((d) => {
+          URL.revokeObjectURL(o), this.currentAudio = null;
+          const h = new Error(`Audio playback failed: ${w}`);
+          (u = e == null ? void 0 : e.onError) == null || u.call(e, h), l(h);
+        }, m.play().catch((w) => {
           var u;
-          URL.revokeObjectURL(a), this.currentAudio = null;
-          const h = new Error(`Failed to play audio: ${d.message}`);
-          (u = e == null ? void 0 : e.onError) == null || u.call(e, h), w(h);
+          URL.revokeObjectURL(o), this.currentAudio = null;
+          const h = new Error(`Failed to play audio: ${w.message}`);
+          (u = e == null ? void 0 : e.onError) == null || u.call(e, h), l(h);
         });
       });
     } catch (c) {
-      const a = c instanceof Error ? c : new Error(`TTS Error: ${String(c)}`);
-      throw (s = e == null ? void 0 : e.onError) == null || s.call(e, a), a;
+      const o = c instanceof Error ? c : new Error(`TTS Error: ${String(c)}`);
+      throw (s = e == null ? void 0 : e.onError) == null || s.call(e, o), o;
     }
   }
   /**
@@ -1148,50 +1148,50 @@ class Ve {
     return this.currentAudio !== null && !this.currentAudio.paused;
   }
 }
-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 ae = new Ve(), Je = (r = {}) => {
+  const [i, e] = k(!1), [a, s] = k(!1), [c, o] = k(null);
+  r.config && ae.updateConfig(r.config);
   const n = A(
-    async (m, d = {}) => {
+    async (m, w = {}) => {
       var h;
       try {
-        a(null), s(!0);
+        o(null), s(!0);
         const u = {
           text: m,
-          ...d
+          ...w
         };
-        await ie.speak(u, {
+        await ae.speak(u, {
           onStart: () => {
             var g;
-            s(!1), e(!0), (g = i.onStart) == null || g.call(i);
+            s(!1), e(!0), (g = r.onStart) == null || g.call(r);
           },
           onEnd: () => {
             var g;
-            e(!1), (g = i.onEnd) == null || g.call(i);
+            e(!1), (g = r.onEnd) == null || g.call(r);
           },
           onError: (g) => {
-            var y;
-            e(!1), s(!1), a(g), (y = i.onError) == null || y.call(i, g);
+            var j;
+            e(!1), s(!1), o(g), (j = r.onError) == null || j.call(r, g);
           }
         });
       } catch (u) {
         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;
+        throw o(g), e(!1), s(!1), (h = r.onError) == null || h.call(r, g), g;
       }
     },
-    [i]
-  ), w = A(() => {
-    ie.stop(), e(!1), s(!1);
+    [r]
+  ), l = A(() => {
+    ae.stop(), e(!1), s(!1);
   }, []);
   return {
     speak: n,
-    stop: w,
-    isPlaying: r,
-    isLoading: o,
+    stop: l,
+    isPlaying: i,
+    isLoading: a,
     error: c
   };
-}, Xe = ({ className: i = "" }) => {
-  const r = S(null);
+}, Xe = ({ className: r = "" }) => {
+  const i = S(null);
   return P(() => {
     let e = null;
     return (async () => {
@@ -1199,17 +1199,17 @@ const ie = new Ve(), Je = (i = {}) => {
         e = await navigator.mediaDevices.getUserMedia({
           video: !0,
           audio: !1
-        }), r.current && (r.current.srcObject = e);
+        }), i.current && (i.current.srcObject = e);
       } catch (s) {
         console.error("Error accessing camera:", s);
       }
     })(), () => {
       e && e.getTracks().forEach((s) => s.stop());
     };
-  }, []), /* @__PURE__ */ t.jsx("div", { className: `iw-relative ${i}`, children: /* @__PURE__ */ t.jsx(
+  }, []), /* @__PURE__ */ t.jsx("div", { className: `iw-relative ${r}`, children: /* @__PURE__ */ t.jsx(
     "video",
     {
-      ref: r,
+      ref: i,
       autoPlay: !0,
       playsInline: !0,
       muted: !0,
@@ -1219,20 +1219,20 @@ const ie = new Ve(), Je = (i = {}) => {
       }
     }
   ) });
-}, Z = (i) => {
-  const { baseColor: r, borderRadius: e } = W(), { loading: o, children: s, ...c } = i;
+}, ee = (r) => {
+  const { baseColor: i, borderRadius: e } = V(), { loading: a, children: s, ...c } = r;
   return /* @__PURE__ */ t.jsx(
-    se,
+    ne,
     {
       style: {
-        background: ge(r),
+        background: xe(i),
         borderRadius: e
       },
       ...c,
-      children: o ? /* @__PURE__ */ t.jsx(he, {}) : s
+      children: a ? /* @__PURE__ */ t.jsx(ge, {}) : s
     }
   );
-}, ne = (i) => /* @__PURE__ */ t.jsxs(
+}, ce = (r) => /* @__PURE__ */ t.jsxs(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -1244,7 +1244,7 @@ const ie = new Ve(), Je = (i = {}) => {
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...i,
+    ...r,
     children: [
       /* @__PURE__ */ t.jsx("path", { d: "M12 2a10 10 0 0 1 7.38 16.75" }),
       /* @__PURE__ */ t.jsx("path", { d: "M12 6v6l4 2" }),
@@ -1254,27 +1254,27 @@ const ie = 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)), 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,
+), Ze = (r, i, e) => Math.max(i, Math.min(e, r)), we = (r) => {
+  const i = Math.max(0, Math.floor(r)), e = Math.floor(i / 60).toString().padStart(2, "0"), a = (i % 60).toString().padStart(2, "0");
+  return `${e}:${a}`;
+}, le = ({
+  total: r,
+  remaining: i,
   size: e = 64,
-  strokeWidth: o = 6,
+  strokeWidth: a = 6,
   className: s = "",
   showLabel: c = !0
 }) => {
-  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" : "";
+  const o = Math.max(1, r || 1), n = Ze(i / o, 0, 1), { radius: l, circumference: m, dashOffset: w, center: h } = X(() => {
+    const j = (e - a) / 2, y = 2 * Math.PI * j, I = y * (1 - n), d = Math.round(a) % 2 === 1, x = e / 2 + (d ? 0.5 : 0);
+    return { radius: j, circumference: y, dashOffset: I, center: x };
+  }, [e, a, n]), u = X(() => 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 ${le(r)}`,
+      "aria-label": `Time remaining ${we(i)}`,
       role: "timer",
       "aria-live": "polite",
       children: [
@@ -1291,9 +1291,9 @@ const ie = new Ve(), Je = (i = {}) => {
                 {
                   cx: h,
                   cy: h,
-                  r: w,
+                  r: l,
                   className: "iw-stroke-gray-200",
-                  strokeWidth: o,
+                  strokeWidth: a,
                   fill: "none",
                   shapeRendering: "geometricPrecision",
                   vectorEffect: "non-scaling-stroke"
@@ -1304,13 +1304,13 @@ const ie = new Ve(), Je = (i = {}) => {
                 {
                   cx: h,
                   cy: h,
-                  r: w,
+                  r: l,
                   className: `${u} ${g}`,
-                  strokeWidth: o,
+                  strokeWidth: a,
                   strokeLinecap: "round",
                   fill: "none",
                   strokeDasharray: m,
-                  strokeDashoffset: d,
+                  strokeDashoffset: w,
                   shapeRendering: "geometricPrecision",
                   vectorEffect: "non-scaling-stroke",
                   style: {
@@ -1325,68 +1325,68 @@ const ie = new Ve(), Je = (i = {}) => {
           "span",
           {
             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)
+            children: we(i)
           }
         ) })
       ]
     }
   );
 }, Ke = ({
-  label: i,
-  error: r,
+  label: r,
+  error: i,
   fullWidth: e = !1,
-  className: o = "",
+  className: a = "",
   id: s,
   ...c
 }) => {
-  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" : "";
+  const o = 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", l = i ? "iw-border-red-500 iw-focus:border-red-500 iw-focus:ring-red-500" : "", m = e ? "iw-w-full" : "", w = a.includes("iw-h-full") || e ? "iw-h-full" : "";
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: `iw-h-full iw-flex iw-flex-col ${e ? "iw-w-full" : ""}`,
       children: [
-        i && /* @__PURE__ */ t.jsx(
+        r && /* @__PURE__ */ t.jsx(
           "label",
           {
-            htmlFor: a,
+            htmlFor: o,
             className: "iw-block iw-text-sm iw-font-medium iw-text-gray-700 iw-mb-1",
-            children: i
+            children: r
           }
         ),
         /* @__PURE__ */ t.jsx(
           "textarea",
           {
-            id: a,
-            className: `${n} ${w} ${m} ${d} ${o}`,
-            "aria-invalid": r ? "true" : "false",
+            id: o,
+            className: `${n} ${l} ${m} ${w} ${a}`,
+            "aria-invalid": i ? "true" : "false",
             ...c
           }
         ),
-        r && /* @__PURE__ */ t.jsx("p", { className: "iw-mt-1 iw-text-sm iw-text-red-600", children: r })
+        i && /* @__PURE__ */ t.jsx("p", { className: "iw-mt-1 iw-text-sm iw-text-red-600", children: i })
       ]
     }
   );
 }, et = ({
-  value: i,
-  onChange: r,
+  value: r,
+  onChange: i,
   onSubmit: e,
-  isSubmitDisabled: o,
+  isSubmitDisabled: a,
   state: s,
   editingTime: c
 }) => {
-  const a = (n) => {
-    n.key === "Enter" && (n.ctrlKey || n.metaKey) && !o && (n.preventDefault(), e());
+  const o = (n) => {
+    n.key === "Enter" && (n.ctrlKey || n.metaKey) && !a && (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(ne, { className: "iw-size-4 iw-text-orange-600" }),
+          /* @__PURE__ */ t.jsx(ce, { 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(
-          oe,
+          le,
           {
             total: c,
             remaining: s.currentPhaseTimeRemaining,
@@ -1400,9 +1400,9 @@ const ie = new Ve(), Je = (i = {}) => {
       /* @__PURE__ */ t.jsx(
         Ke,
         {
-          value: i,
-          onChange: r,
-          onKeyDown: a,
+          value: r,
+          onChange: i,
+          onKeyDown: o,
           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: (n) => n.preventDefault(),
@@ -1412,129 +1412,129 @@ const ie = new Ve(), Je = (i = {}) => {
           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(Z, { onClick: e, disabled: o, children: "Submit Answer" }) })
+      /* @__PURE__ */ t.jsx("div", { className: "iw-w-full iw-grid iw-grid-cols-1 iw-mt-4", children: /* @__PURE__ */ t.jsx(ee, { onClick: e, disabled: a, children: "Submit Answer" }) })
     ] })
   ] });
 }, tt = ({
-  className: i = "",
-  width: r,
+  className: r = "",
+  width: i,
   height: e = 56,
-  barWidth: o = 3,
+  barWidth: a = 3,
   gap: s = 2,
   fftSize: c = 1024,
-  smoothingTimeConstant: a = 0.8,
+  smoothingTimeConstant: o = 0.8,
   mediaStream: n,
-  startOnMount: w = !0
+  startOnMount: l = !0
 }) => {
-  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);
+  const { baseColor: m } = V(), w = S(null), h = S(null), u = S(null), g = S(null), j = S(null), y = S(null), I = S(!1), [d, x] = k(null);
   P(() => {
-    if (r || !h.current) return;
-    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(
+    if (i || !h.current) return;
+    const p = h.current, $ = () => {
+      const M = w.current;
+      if (!M) return;
+      const N = p.clientWidth, T = e;
+      M.width = Math.max(1, Math.floor(N * window.devicePixelRatio || 1)), M.height = Math.max(1, Math.floor(T * window.devicePixelRatio || 1));
+    }, b = new ResizeObserver($);
+    return b.observe(p), $(), () => b.disconnect();
+  }, [i, e]), P(() => {
+    if (!i) return;
+    const p = w.current;
+    p && (p.width = Math.max(
       1,
-      Math.floor(r * (window.devicePixelRatio || 1))
-    ), b.height = Math.max(
+      Math.floor(i * (window.devicePixelRatio || 1))
+    ), p.height = Math.max(
       1,
       Math.floor(e * (window.devicePixelRatio || 1))
     ));
-  }, [r, e]), P(() => {
-    let b = !1;
+  }, [i, e]), P(() => {
+    let p = !1;
     return (async () => {
       try {
-        const x = new (window.AudioContext || window.webkitAudioContext)();
-        u.current = x;
-        let N = n;
-        if (!N) {
-          if (!w) return;
-          N = await navigator.mediaDevices.getUserMedia({
+        const b = new (window.AudioContext || window.webkitAudioContext)();
+        u.current = b;
+        let M = n;
+        if (!M) {
+          if (!l) return;
+          M = await navigator.mediaDevices.getUserMedia({
             audio: !0,
             video: !1
-          }), j.current = !0;
+          }), I.current = !0;
         }
-        if (b) return;
-        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) {
-        p((x == null ? void 0 : x.message) || "Failed to initialize microphone");
+        if (p) return;
+        const N = b.createAnalyser();
+        N.fftSize = c, N.smoothingTimeConstant = o, g.current = N;
+        const T = b.createMediaStreamSource(M);
+        j.current = T, T.connect(N), C();
+      } catch (b) {
+        x((b == null ? void 0 : b.message) || "Failed to initialize microphone");
       }
     })(), () => {
-      var x, N, C, M;
-      b = !0, k.current && cancelAnimationFrame(k.current);
+      var b, M, N, T;
+      p = !0, y.current && cancelAnimationFrame(y.current);
       try {
-        (x = y.current) == null || x.disconnect();
+        (b = j.current) == null || b.disconnect();
       } catch {
       }
       try {
-        (N = g.current) == null || N.disconnect();
+        (M = g.current) == null || M.disconnect();
       } catch {
       }
-      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();
+      I.current && ((T = ((N = j.current) == null ? void 0 : N.mediaStream) || void 0) == null || T.getTracks().forEach((q) => q.stop())), u.current && u.current.state !== "closed" && u.current.close();
     };
-  }, [n, c, a, w]);
-  const I = () => {
-    const b = d.current, _ = g.current;
-    if (!b || !_) return;
-    const x = b.getContext("2d");
-    if (!x) return;
-    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();
+  }, [n, c, o, l]);
+  const C = () => {
+    const p = w.current, $ = g.current;
+    if (!p || !$) return;
+    const b = p.getContext("2d");
+    if (!b) return;
+    const M = window.devicePixelRatio || 1, N = p.width, T = p.height, q = $.frequencyBinCount, F = new Uint8Array(q), Q = () => {
+      y.current = requestAnimationFrame(Q), $.getByteTimeDomainData(F), b.clearRect(0, 0, N, T), b.fillStyle = "rgba(0,0,0,0)", b.fillRect(0, 0, N, T);
+      const B = Math.max(1, Math.floor(a * M)), L = Math.max(1, Math.floor(s * M)), U = B + L, E = Math.max(8, Math.floor((N + L) / U)), W = Math.floor(F.length / E);
+      for (let z = 0; z < E; z++) {
+        const te = Math.min(F.length - 1, z * W), re = F[te] / 128 - 1, G = Math.abs(re), ie = Math.pow(G, 0.6), H = Math.max(T * 0.06, ie * (T * 0.9)), se = z * U, f = (T - H) / 2, O = 140 - Math.min(140, 140 * G), J = 85, be = 48 + Math.floor(12 * (1 - G));
+        b.fillStyle = `${m}`, b.shadowColor = `hsla(${O}, ${J}%, ${be}%, ${0.25 * G})`, b.shadowBlur = 8 * G;
+        const ye = Math.min(B / 2, H / 2);
+        rt(b, se, f, B, H, ye), b.fill();
       }
     };
-    L();
+    Q();
   };
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       ref: h,
-      className: `iw-relative iw-w-full iw-overflow-hidden iw-rounded-md iw-bg-gray-50 ${i}`,
+      className: `iw-relative iw-w-full iw-overflow-hidden iw-rounded-md iw-bg-gray-50 ${r}`,
       style: { height: e },
       children: [
-        /* @__PURE__ */ t.jsx("canvas", { ref: d, className: "iw-w-full iw-h-full" }),
-        l && /* @__PURE__ */ t.jsx("div", { className: "iw-absolute iw-inset-0 iw-flex iw-items-center iw-justify-center", children: /* @__PURE__ */ t.jsx("span", { className: "iw-text-xs iw-text-red-600 iw-bg-red-50 iw-border iw-border-red-200 iw-px-2 iw-py-1 iw-rounded", children: l }) })
+        /* @__PURE__ */ t.jsx("canvas", { ref: w, className: "iw-w-full iw-h-full" }),
+        d && /* @__PURE__ */ t.jsx("div", { className: "iw-absolute iw-inset-0 iw-flex iw-items-center iw-justify-center", children: /* @__PURE__ */ t.jsx("span", { className: "iw-text-xs iw-text-red-600 iw-bg-red-50 iw-border iw-border-red-200 iw-px-2 iw-py-1 iw-rounded", children: d }) })
       ]
     }
   );
 };
-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();
+function rt(r, i, e, a, s, c) {
+  const o = Math.min(c, a / 2, s / 2);
+  r.beginPath(), r.moveTo(i + o, e), r.lineTo(i + a - o, e), r.quadraticCurveTo(i + a, e, i + a, e + o), r.lineTo(i + a, e + s - o), r.quadraticCurveTo(i + a, e + s, i + a - o, e + s), r.lineTo(i + o, e + s), r.quadraticCurveTo(i, e + s, i, e + s - o), r.lineTo(i, e + o), r.quadraticCurveTo(i, e, i + o, e), r.closePath();
 }
 const it = ({
-  state: i,
-  answeringTime: r,
+  state: r,
+  answeringTime: i,
   nextPhase: e,
-  sttError: o
+  sttError: a
 }) => /* @__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(ne, { className: "iw-size-4 iw-text-orange-600" }),
+          /* @__PURE__ */ t.jsx(ce, { 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(
-          oe,
+          le,
           {
-            total: r,
-            remaining: i.currentPhaseTimeRemaining,
+            total: i,
+            remaining: r.currentPhaseTimeRemaining,
             size: 50,
             strokeWidth: 4
           }
@@ -1545,13 +1545,13 @@ const it = ({
   ] }),
   /* @__PURE__ */ t.jsxs("div", { children: [
     /* @__PURE__ */ t.jsx(tt, {}),
-    o && /* @__PURE__ */ t.jsxs("div", { className: "iw-mt-2 iw-text-xs iw-text-red-600", children: [
+    a && /* @__PURE__ */ t.jsxs("div", { className: "iw-mt-2 iw-text-xs iw-text-red-600", children: [
       "Recording error: ",
-      o.message
+      a.message
     ] })
   ] }),
   /* @__PURE__ */ t.jsx("div", { className: "iw-w-full iw-grid iw-grid-cols-1", children: /* @__PURE__ */ t.jsx(
-    Z,
+    ee,
     {
       onClick: () => {
         e();
@@ -1561,18 +1561,18 @@ const it = ({
   ) })
 ] });
 function st() {
-  const [i, r] = T(!0), e = V(
-    () => [0, 1, 2].map((o) => ({ id: o })),
+  const [r, i] = k(!0), e = X(
+    () => [0, 1, 2].map((a) => ({ id: a })),
     []
   );
   return P(() => {
-    const o = setInterval(() => {
-      r((s) => !s);
+    const a = setInterval(() => {
+      i((s) => !s);
     }, 1500);
-    return () => clearInterval(o);
+    return () => clearInterval(a);
   }, []), /* @__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((o, s) => {
-      const c = s * 50, a = i ? c : c + 12, n = 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((a, s) => {
+      const c = s * 50, o = r ? c : c + 12, n = r ? 1 : 0.08, l = s * 140;
       return /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -1580,9 +1580,9 @@ function st() {
           className: "iw-absolute iw-w-full iw-rounded-lg iw-p-4 iw-shadow-md iw-bg-gradient-to-b iw-from-gray-50 iw-to-gray-100 iw-overflow-hidden",
           style: {
             top: 0,
-            transform: `translateY(${a}px)`,
+            transform: `translateY(${o}px)`,
             opacity: n,
-            transition: `transform 600ms cubic-bezier(.2,.9,.3,1) ${w}ms, opacity 400ms ease ${w}ms`
+            transition: `transform 600ms cubic-bezier(.2,.9,.3,1) ${l}ms, opacity 400ms ease ${l}ms`
           },
           children: /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-gap-3 iw-items-center", children: [
             /* @__PURE__ */ t.jsx("div", { className: "iw-w-10 iw-h-10 iw-bg-gray-300 iw-rounded iw-flex-shrink-0" }),
@@ -1592,39 +1592,39 @@ function st() {
             ] })
           ] })
         },
-        o.id
+        a.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 fe = ({
-  isOpen: i,
-  onClose: r,
+const pe = ({
+  isOpen: r,
+  onClose: i,
   children: e,
-  title: o,
+  title: a,
   showCloseButton: s = !0,
   closeOnOverlayClick: c = !0,
-  closeOnEscape: a = !0,
+  closeOnEscape: o = !0,
   className: n = ""
 }) => {
   if (P(() => {
-    if (!i || !a) return;
-    const d = (h) => {
-      h.key === "Escape" && r();
+    if (!r || !o) return;
+    const w = (h) => {
+      h.key === "Escape" && i();
     };
-    return document.addEventListener("keydown", d), () => document.removeEventListener("keydown", d);
-  }, [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")), () => {
+    return document.addEventListener("keydown", w), () => document.removeEventListener("keydown", w);
+  }, [r, o, i]), P(() => (r ? (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();
+  }), [r]), !r) return null;
+  const l = (w) => {
+    c && w.target === w.currentTarget && i();
   }, 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",
       {
         className: "iw-fixed iw-inset-0 iw-bg-black iw-bg-opacity-50 iw-transition-opacity",
-        onClick: w
+        onClick: l
       }
     ),
     /* @__PURE__ */ t.jsxs(
@@ -1633,21 +1633,21 @@ const fe = ({
         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": o ? "dialog-title" : void 0,
+        "aria-labelledby": a ? "dialog-title" : void 0,
         children: [
-          (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(
+          (a || 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: [
+            a && /* @__PURE__ */ t.jsx(
               "h2",
               {
                 id: "dialog-title",
                 className: "iw-text-lg iw-font-semibold iw-text-gray-900",
-                children: o
+                children: a
               }
             ),
             s && /* @__PURE__ */ t.jsx(
               "button",
               {
-                onClick: r,
+                onClick: i,
                 className: "iw-p-1 iw-text-gray-400 iw-hover:text-gray-600 iw-transition-colors iw-rounded iw-hover:bg-gray-100",
                 "aria-label": "Close dialog",
                 children: /* @__PURE__ */ t.jsx(
@@ -1678,13 +1678,13 @@ const fe = ({
   ] });
   return ke(m, document.body);
 }, at = ({
-  open: i,
-  onClose: r
+  open: r,
+  onClose: i
 }) => /* @__PURE__ */ t.jsx(
-  fe,
+  pe,
   {
-    isOpen: i,
-    onClose: r || (() => {
+    isOpen: r,
+    onClose: i || (() => {
     }),
     title: "Interview Complete!",
     className: "",
@@ -1711,10 +1711,10 @@ const fe = ({
     ] })
   }
 ), nt = ({
-  size: i = "192px",
-  className: r,
+  size: r = "192px",
+  className: i,
   colors: e,
-  animationDuration: o = 20
+  animationDuration: a = 20
 }) => {
   const c = { ...{
     bg: "oklch(95% 0.02 264.695)",
@@ -1724,23 +1724,23 @@ const fe = ({
     // Pastel blue
     c3: "oklch(78% 0.14 280)"
     // Pastel purple/lavender
-  }, ...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;
+  }, ...e }, o = parseInt(r.replace("px", ""), 10), n = o < 50 ? Math.max(o * 8e-3, 1) : Math.max(o * 0.015, 4), l = o < 50 ? Math.max(o * 4e-3, 1.2) : Math.max(o * 8e-3, 1.5), m = o < 50 ? Math.max(o * 4e-3, 0.05) : Math.max(o * 8e-3, 0.1), w = o < 50 ? Math.max(o * 4e-3, 0.5) : Math.max(o * 8e-3, 2), h = o < 30 ? "0%" : o < 50 ? "5%" : o < 100 ? "15%" : "25%", u = o < 30 ? 1.1 : o < 50 ? Math.max(l * 1.2, 1.3) : l;
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      className: `siri-orb ${r}`,
+      className: `siri-orb ${i}`,
       style: {
-        width: i,
-        height: i,
+        width: r,
+        height: r,
         "--bg": c.bg,
         "--c1": c.c1,
         "--c2": c.c2,
         "--c3": c.c3,
-        "--animation-duration": `${o}s`,
+        "--animation-duration": `${a}s`,
         "--blur-amount": `${n}px`,
         "--contrast-amount": u,
         "--dot-size": `${m}px`,
-        "--shadow-spread": `${d}px`,
+        "--shadow-spread": `${w}px`,
         "--mask-radius": h
       },
       children: /* @__PURE__ */ t.jsx("style", { children: `
@@ -1852,38 +1852,38 @@ const fe = ({
     }
   );
 };
-function ot({ ttsError: i }) {
+function ot({ ttsError: r }) {
   return /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-flex-col iw-items-center iw-justify-center iw-gap-8 iw-w-full iw-h-full", children: [
     /* @__PURE__ */ t.jsx(nt, { size: "80px" }),
-    i && /* @__PURE__ */ t.jsxs("div", { className: "iw-mt-2 iw-text-xs iw-text-red-600", children: [
+    r && /* @__PURE__ */ t.jsxs("div", { className: "iw-mt-2 iw-text-xs iw-text-red-600", children: [
       "Audio playback failed: ",
-      i.message
+      r.message
     ] }),
     /* @__PURE__ */ t.jsx("p", { className: "iw-text- iw-text-gray-700", children: "Your AI interviewer is speaking..." })
   ] });
 }
-const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-flex-col iw-gap-6 iw-items-center iw-justify-center iw-text-center iw-h-full ", children: [
+const ct = ({ state: r, thinkingTime: i, nextPhase: e }) => /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-flex-col iw-gap-6 iw-items-center iw-justify-center iw-text-center iw-h-full ", children: [
   /* @__PURE__ */ t.jsxs("div", { children: [
     /* @__PURE__ */ t.jsx("h3", { className: "iw-text-lg iw-font-semibold iw-text-gray-900 iw-mb-1", children: "Get Ready to Answer" }),
     /* @__PURE__ */ t.jsx("p", { className: "iw-max-w-lg iw-text-gray-500 iw-text-xs iw-leading-[21px]", children: "After 30-seconds thinking time, recording will start automatically, or you can begin recording early by clicking the button below." })
   ] }),
   /* @__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(ne, { className: "iw-size-4 iw-text-orange-600" }),
+      /* @__PURE__ */ t.jsx(ce, { 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(
-      oe,
+      le,
       {
-        total: r,
-        remaining: i.currentPhaseTimeRemaining,
+        total: i,
+        remaining: r.currentPhaseTimeRemaining,
         size: 50,
         strokeWidth: 4
       }
     )
   ] }),
   /* @__PURE__ */ t.jsx("div", { className: "iw-w-full iw-grid iw-grid-cols-1", children: /* @__PURE__ */ t.jsx(
-    Z,
+    ee,
     {
       onClick: () => {
         e();
@@ -1891,7 +1891,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
       children: "Start Answering"
     }
   ) })
-] }), lt = ({ sttError: i }) => /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-flex-col iw-items-center iw-justify-center iw-h-full", children: [
+] }), lt = ({ sttError: r }) => /* @__PURE__ */ t.jsxs("div", { className: "iw-flex iw-flex-col iw-items-center iw-justify-center iw-h-full", children: [
   /* @__PURE__ */ t.jsxs("svg", { width: "48", height: "48", viewBox: "0 0 60 60", fill: "none", children: [
     /* @__PURE__ */ t.jsx(
       "rect",
@@ -1927,12 +1927,12 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
   ] }),
   /* @__PURE__ */ t.jsx("h3", { className: "iw-text-lg iw-font-semibold iw-text-gray-900 iw-mb-1 iw-mt-3", children: "Just a moment... We're analyzing your response" }),
   /* @__PURE__ */ t.jsx("p", { className: "iw-max-w-lg iw-text-gray-500 iw-text-xs iw-leading-[21px]", children: "After transcription, you'll have 45 sec to review your answer." }),
-  i && /* @__PURE__ */ t.jsxs("div", { className: "iw-mt-2 iw-text-xs iw-text-red-600", children: [
+  r && /* @__PURE__ */ t.jsxs("div", { className: "iw-mt-2 iw-text-xs iw-text-red-600", children: [
     "Transcription error: ",
-    i.message,
-    i.recoverable && " (attempting to continue)"
+    r.message,
+    r.recoverable && " (attempting to continue)"
   ] })
-] }), dt = (i) => /* @__PURE__ */ t.jsxs(
+] }), dt = (r) => /* @__PURE__ */ t.jsxs(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -1944,7 +1944,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...i,
+    ...r,
     children: [
       /* @__PURE__ */ t.jsx("path", { d: "M12 8V4H8" }),
       /* @__PURE__ */ t.jsx("rect", { width: "16", height: "12", x: "4", y: "8", rx: "2" }),
@@ -1955,10 +1955,10 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
     ]
   }
 ), wt = ({
-  question: i,
-  isLoading: r = !1
+  question: r,
+  isLoading: i = !1
 }) => {
-  const { baseColor: e } = W();
+  const { baseColor: e } = V();
   return /* @__PURE__ */ t.jsx(
     "div",
     {
@@ -1975,18 +1975,18 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
           ) }),
           /* @__PURE__ */ t.jsx("div", { className: "iw-absolute iw-bottom-2 iw-translate-x-1/2  iw-flex iw-mt-2", children: /* @__PURE__ */ t.jsx("div", { className: "iw-text-sm", children: "Novara" }) })
         ] }),
-        r ? /* @__PURE__ */ t.jsxs("div", { className: "iw-animate-pulse iw-w-full iw-space-y-3 iw-mr-10", children: [
+        i ? /* @__PURE__ */ t.jsxs("div", { className: "iw-animate-pulse iw-w-full iw-space-y-3 iw-mr-10", children: [
           /* @__PURE__ */ t.jsx("div", { className: "iw-h-5 iw-bg-gray-200 iw-rounded iw-w-full" }),
           /* @__PURE__ */ t.jsx("div", { className: "iw-h-5 iw-bg-gray-200 iw-rounded iw-w-3/4" })
-        ] }) : /* @__PURE__ */ t.jsx("p", { className: "iw-text-lg iw-leading-8", children: i == null ? void 0 : i.question })
+        ] }) : /* @__PURE__ */ t.jsx("p", { className: "iw-text-lg iw-leading-8", children: r == null ? void 0 : r.question })
       ] })
     }
   );
 }, ut = ({
-  confirmExitInterview: i,
-  isOpen: r,
+  confirmExitInterview: r,
+  isOpen: i,
   onClose: e
-}) => /* @__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(pe, { isOpen: i, 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(
@@ -2001,13 +2001,13 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
       "button",
       {
         className: "iw-px-4 iw-py-2 iw-bg-red-600 iw-text-white iw-rounded iw-font-medium",
-        onClick: i,
+        onClick: r,
         children: "Confirm Exit"
       }
     )
   ] })
-] }) }), ht = ({ title: i, onExit: r }) => {
-  const { baseColor: e } = W(), [o, s] = T(!1);
+] }) }), ht = ({ title: r, onExit: i }) => {
+  const { baseColor: e } = V(), [a, s] = k(!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: [
@@ -2021,7 +2021,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
         ),
         /* @__PURE__ */ t.jsx("p", { className: "iw-text-sm iw-font-medium", children: "Novara" })
       ] }),
-      /* @__PURE__ */ t.jsx("h1", { className: "iw-text-base iw-font-bold", children: i }),
+      /* @__PURE__ */ t.jsx("h1", { className: "iw-text-base iw-font-bold", children: r }),
       /* @__PURE__ */ t.jsx(
         "button",
         {
@@ -2035,160 +2035,165 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
     /* @__PURE__ */ t.jsx(
       ut,
       {
-        isOpen: o,
+        isOpen: a,
         confirmExitInterview: () => {
-          r(), s(!1);
+          i(), s(!1);
         },
         onClose: () => s(!1)
       }
     )
   ] });
 }, mt = ({
+  interviewTitle: r,
   interviewId: i,
-  onComplete: r,
-  className: e = ""
+  onComplete: e,
+  className: a = ""
 }) => {
-  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;
+  const s = We(), { baseUrl: c, authToken: o } = Se(), { timers: n, stt: l, tts: m } = Ce(), [w, h] = k(null), [u, g] = k(""), j = S(""), y = S(null), I = {
+    thinkingTime: (n == null ? void 0 : n.thinkingDuration) || 30,
+    answeringTime: (n == null ? void 0 : n.answeringDuration) || 120,
+    editingTime: (n == null ? void 0 : n.editingDuration) || 30
+  }, { thinkingTime: d, answeringTime: x, editingTime: C } = I;
   P(() => {
-    g.current = h;
-  }, [h]);
-  const I = S(!1), { speak: b, error: _ } = Je({
+    j.current = u;
+  }, [u]);
+  const p = S(!1), {
+    speak: $,
+    stop: b,
+    error: M
+  } = Je({
     config: {
-      baseUrl: s,
-      provider: w == null ? void 0 : w.provider,
-      authToken: c
+      baseUrl: c,
+      provider: m == null ? void 0 : m.provider,
+      authToken: o
     },
     onEnd: () => {
-      I.current = !1, E();
+      p.current = !1, E();
     },
     onError: () => {
-      I.current || (I.current = !0, E());
+      p.current || (p.current = !0, E());
     }
-  }), x = S(!1), N = S(!1), {
-    startRecording: C,
-    stopRecording: M,
-    transcribe: q,
-    error: U
+  }), N = S(!1), T = S(!1), {
+    startRecording: q,
+    stopRecording: F,
+    transcribe: Q,
+    error: B
   } = Ye({
     config: {
-      baseUrl: s,
-      provider: n == null ? void 0 : n.provider,
-      model: n == null ? void 0 : n.model,
-      language: n == null ? void 0 : n.language,
-      authToken: c
+      baseUrl: c,
+      provider: l == null ? void 0 : l.provider,
+      model: l == null ? void 0 : l.model,
+      language: l == null ? void 0 : l.language,
+      authToken: o
     },
     onStart: () => {
-      x.current = !1, N.current = !1;
+      N.current = !1, T.current = !1;
     },
     onStop: () => {
     },
     onTranscriptionComplete: (f) => {
-      u(f.transcript), N.current || (N.current = !0, E());
+      g(f.transcript), T.current || (T.current = !0, E());
     },
     onError: (f) => {
-      console.error("STT Error:", f), x.current || (x.current = !0, E());
+      console.error("STT Error:", f), N.current || (N.current = !0, E());
     }
-  }), { state: L, startQuestion: O, nextPhase: E, completeInterview: B } = Ge({
+  }), { state: L, startQuestion: U, nextPhase: E, completeInterview: W } = Ge({
     config: {
-      thinkingDuration: j,
-      answeringDuration: l,
-      editingDuration: p
+      thinkingDuration: d,
+      answeringDuration: x,
+      editingDuration: C
     },
     callbacks: {
       onPhaseChange: (f) => {
         switch (f) {
           case R.FETCHING_QUESTION:
-            H();
+            z();
             break;
           case R.READING_QUESTION:
-            ee();
+            G();
             break;
           case R.ANSWERING:
-            te();
+            ie();
             break;
           case R.TRANSCRIBING:
-            G();
+            H();
             break;
           case R.SUBMITTING:
-            z();
+            re();
             break;
         }
       },
       onInterviewEnd: () => {
-        r == null || r();
+        e == null || e();
       }
     }
   });
   P(() => {
-    O();
+    U();
   }, []);
-  const { execute: H, loading: K } = qe(
+  const { execute: z, loading: te } = qe(
     async () => {
-      var F, Y;
-      const f = await o.generateQuestion({
+      var O, J;
+      const f = await s.generateQuestion({
         interviewId: i,
-        question: ((F = y.current) == null ? void 0 : F.question) || "",
-        qnaId: ((Y = y.current) == null ? void 0 : Y.qna_id) || "",
-        answer: g.current
+        question: ((O = y.current) == null ? void 0 : O.question) || "",
+        qnaId: ((J = y.current) == null ? void 0 : J.qna_id) || "",
+        answer: j.current
       });
       return y.current = f.data, f;
     },
     {
       onSuccess: async (f) => {
-        f && f.data && (u(""), d(f.data), E());
+        f && f.data && (g(""), h(f.data), E());
       },
       onError: (f) => {
         console.error("Failed to fetch questions:", f);
       }
     }
-  ), z = A(async () => {
-    O();
-  }, [O]), ee = A(async () => {
+  ), re = A(async () => {
+    U();
+  }, [U]), G = A(async () => {
     var f;
     if ((f = y.current) != null && f.question)
       try {
-        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);
+        p.current = !1, await $(y.current.question), y.current.is_interview_done && (await Pe(2e3), W());
+      } catch (O) {
+        console.error("Failed to speak question:", O);
       }
     else
       E();
-  }, [b, E, B]), te = A(async () => {
+  }, [$, E, W]), ie = A(async () => {
     try {
-      await C(l);
+      await q(x);
     } catch (f) {
       console.error("Failed to start recording:", f), E();
     }
-  }, [C, E]), G = A(async () => {
+  }, [q, E]), H = A(async () => {
     try {
-      const f = await M();
-      await q(f);
+      const f = await F();
+      await Q(f);
     } catch (f) {
-      console.error("STT processing failed:", f), !x.current && !N.current && (x.current = !0, E());
+      console.error("STT processing failed:", f), !N.current && !T.current && (N.current = !0, E());
     }
-  }, [M, q, E]), re = () => {
+  }, [F, Q, E]), se = () => {
     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(Z, { onClick: O, className: "iw-mt-2 iw-w-40", children: "Start Interview" })
+          /* @__PURE__ */ t.jsx(ee, { onClick: U, className: "iw-mt-2 iw-w-40", children: "Start Interview" })
         ] });
       case R.FETCHING_QUESTION:
         return /* @__PURE__ */ t.jsx(st, {});
       case R.READING_QUESTION:
-        return /* @__PURE__ */ t.jsx(ot, { ttsError: _ });
+        return /* @__PURE__ */ t.jsx(ot, { ttsError: M });
       case R.THINKING:
         return /* @__PURE__ */ t.jsx(
           ct,
           {
             state: L,
-            thinkingTime: j,
+            thinkingTime: d,
             nextPhase: E
           }
         );
@@ -2197,24 +2202,24 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
           it,
           {
             state: L,
-            answeringTime: l,
+            answeringTime: x,
             nextPhase: E,
-            sttError: U
+            sttError: B
           }
         );
       case R.TRANSCRIBING:
-        return /* @__PURE__ */ t.jsx(lt, { sttError: U });
+        return /* @__PURE__ */ t.jsx(lt, { sttError: B });
       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: h,
-            onChange: (F) => u(F.target.value),
+            value: u,
+            onChange: (O) => g(O.target.value),
             onSubmit: () => E(),
-            isSubmitDisabled: !h.trim() || K,
+            isSubmitDisabled: !u.trim() || te,
             state: L,
-            editingTime: p
+            editingTime: C
           }
         ) });
       case R.COMPLETED:
@@ -2222,7 +2227,7 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
           at,
           {
             open: !0,
-            onClose: r || (() => {
+            onClose: e || (() => {
             })
           }
         ) });
@@ -2234,47 +2239,54 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
     /* @__PURE__ */ t.jsx(
       ht,
       {
-        title: "Interview for Python Developer",
-        onExit: B
+        title: r,
+        onExit: async () => {
+          b(), (await s.generateQuestion({
+            interviewId: i,
+            isInterviewDone: !0
+          })).success && W();
+        }
       }
     ),
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: `iw-p-4 iw-space-y-4 iw-pb-6 ${e}  iw-min-h-[calc(100vh_-_3.8rem)] iw-flex iw-flex-col iw-justify-between`,
+        className: `iw-p-4 iw-space-y-4 iw-pb-6 ${a}  iw-min-h-[calc(100vh_-_3.8rem)] iw-flex iw-flex-col iw-justify-between`,
         children: [
           /* @__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: m,
+              question: w,
               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: re() })
+            /* @__PURE__ */ t.jsx("div", { className: "iw-bg-white iw-rounded-lg iw-shadow iw-p-6", children: se() })
           ] })
         ]
       }
     )
   ] });
 }, gt = ({
+  title: r,
   interviewId: i,
-  onInterviewEnd: r,
-  className: e = ""
+  onInterviewEnd: e,
+  className: a = ""
 }) => {
-  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(
+  const [s, c] = de.useState(!1), [o, n] = de.useState(!0), l = S(null);
+  return s ? /* @__PURE__ */ t.jsx("div", { className: "interview-widget-container", children: /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: n,
-      className: `iw-flex iw-flex-col iw-rounded-xl iw-shadow-lg iw-overflow-hidden  iw-h-[calc(100vh-1rem)] ${e}`,
+      ref: l,
+      className: `iw-flex iw-flex-col iw-rounded-xl iw-shadow-lg iw-overflow-hidden  iw-h-[calc(100vh-1rem)] ${a}`,
       children: /* @__PURE__ */ t.jsx("div", { className: " iw-h-full iw-flex iw-flex-col", children: /* @__PURE__ */ t.jsx(
         mt,
         {
+          interviewTitle: r ?? "Interview",
           interviewId: i,
-          className: e,
-          onComplete: r || (() => {
+          className: a,
+          onComplete: e || (() => {
           })
         }
       ) })
@@ -2282,9 +2294,9 @@ const ct = ({ state: i, thinkingTime: r, nextPhase: e }) => /* @__PURE__ */ t.js
   ) }) : /* @__PURE__ */ t.jsx("div", { className: "interview-widget-container", children: /* @__PURE__ */ t.jsx(
     Le,
     {
-      isOpen: c,
+      isOpen: o,
       onStart: () => {
-        console.log("Permissions granted, starting interview"), s(!0), a(!1);
+        console.log("Permissions granted, starting interview"), c(!0), n(!1);
       }
     }
   ) });