sera-ai 1.0.17 → 1.0.19

package/dist/index.d.mts

@@ -13,6 +13,7 @@ interface AudioRecorderProps {
     onSuccess?: (data: any) => void;
     onError?: (error: string) => void;
     className?: string;
+    visualizerClassName?: string;
     style?: React.CSSProperties;
 }
 interface APIResponse<T = any> {

package/dist/index.d.ts

@@ -13,6 +13,7 @@ interface AudioRecorderProps {
     onSuccess?: (data: any) => void;
     onError?: (error: string) => void;
     className?: string;
+    visualizerClassName?: string;
     style?: React.CSSProperties;
 }
 interface APIResponse<T = any> {

package/dist/index.js

@@ -3872,8 +3872,9 @@ function createParticle(isIdle, x, y, intensity = 1) {
 function AudioVisualizerImproved({
   mediaStream,
   isRecording,
-  forceLight = true
+  forceLight = true,
   // Default to light theme for login page
+  className
 }) {
   const canvasRef = React3__namespace.useRef(null);
   const animationFrameRef = React3__namespace.useRef(0);
@@ -4016,6 +4017,7 @@ function AudioVisualizerImproved({
       ctx.fillStyle = isDarkMode ? "#121826" : "#ffffff";
       ctx.fillRect(0, 0, canvas.width, canvas.height);
       const createDynamicBackground = () => {
+        if (!isDarkMode) return;
         const pulseIntensity = 0.5 + (isRecording ? avgAudioLevel * 0.5 : Math.sin(timeRef.current * 0.2) * 0.2);
         const mainGradient = ctx.createRadialGradient(
           centerX,
@@ -4025,17 +4027,10 @@ function AudioVisualizerImproved({
           centerY,
           canvas.width * 0.6 * pulseIntensity
         );
-        if (isDarkMode) {
-          mainGradient.addColorStop(0, "rgba(91, 33, 182, 0.4)");
-          mainGradient.addColorStop(0.4, "rgba(67, 56, 202, 0.3)");
-          mainGradient.addColorStop(0.6, "rgba(30, 41, 59, 0.2)");
-          mainGradient.addColorStop(1, "rgba(18, 24, 38, 0.0)");
-        } else {
-          mainGradient.addColorStop(0, "rgba(228, 228, 255, 0.7)");
-          mainGradient.addColorStop(0.4, "rgba(240, 240, 255, 0.5)");
-          mainGradient.addColorStop(0.6, "rgba(245, 245, 255, 0.3)");
-          mainGradient.addColorStop(1, "rgba(255, 255, 255, 0.0)");
-        }
+        mainGradient.addColorStop(0, "rgba(91, 33, 182, 0.4)");
+        mainGradient.addColorStop(0.4, "rgba(67, 56, 202, 0.3)");
+        mainGradient.addColorStop(0.6, "rgba(30, 41, 59, 0.2)");
+        mainGradient.addColorStop(1, "rgba(18, 24, 38, 0.0)");
         ctx.fillStyle = mainGradient;
         ctx.fillRect(0, 0, canvas.width, canvas.height);
         const lightCount = 3;
@@ -4241,7 +4236,7 @@ function AudioVisualizerImproved({
       }
     };
   }, [mediaStream, isRecording, isDarkMode]);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full flex justify-center items-center overflow-visible", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 w-full", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full aspect-square max-w-lg mx-auto relative", children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `w-full flex justify-center items-center overflow-visible ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 w-full h-full", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full h-full mx-auto relative", children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
@@ -4386,6 +4381,7 @@ var AudioRecorder = ({
   onSuccess,
   onError,
   className = "",
+  visualizerClassName = "",
   style
 }) => {
   React3__namespace.useEffect(() => {
@@ -4552,12 +4548,13 @@ var AudioRecorder = ({
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block text-xs text-blue-600 dark:text-blue-400 mt-1", children: "Please wait while we process your recording" })
       ] })
     ] }),
-    isRecording && !isPaused && mediaStreamRef.current && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full max-w-lg mx-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
+    isRecording && !isPaused && mediaStreamRef.current && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `w-full ${visualizerClassName || "max-w-lg"} mx-auto`, children: /* @__PURE__ */ jsxRuntime.jsx(
       AudioVisualizerImproved,
       {
         mediaStream: mediaStreamRef.current,
         isRecording: isRecording && !isPaused,
-        forceLight: false
+        forceLight: false,
+        className: visualizerClassName
       }
     ) }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center", children: isProcessing ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center space-x-2 bg-teal-600 hover:bg-teal-700 text-white py-2 px-4 rounded-full", children: [