@rexai/pulse-react 1.0.0

package/dist/index.mjs

@@ -0,0 +1,805 @@
+// src/components/PulseScanner.tsx
+import { useEffect as useEffect3, useState as useState4, useRef as useRef4, useCallback as useCallback4 } from "react";
+
+// src/hooks/useCamera.ts
+import { useState, useRef, useCallback, useEffect } from "react";
+function useCamera(options = {}) {
+  const {
+    width = 640,
+    height = 480,
+    facingMode = "user",
+    autoStart = false
+  } = options;
+  const videoRef = useRef(null);
+  const streamRef = useRef(null);
+  const [isActive, setIsActive] = useState(false);
+  const [error, setError] = useState(null);
+  const start = useCallback(async () => {
+    setError(null);
+    try {
+      const mediaStream = await navigator.mediaDevices.getUserMedia({
+        video: {
+          width: { ideal: width },
+          height: { ideal: height },
+          facingMode
+        },
+        audio: false
+      });
+      streamRef.current = mediaStream;
+      if (videoRef.current) {
+        videoRef.current.srcObject = mediaStream;
+        await new Promise((resolve) => {
+          if (videoRef.current) {
+            videoRef.current.onloadedmetadata = () => resolve();
+          }
+        });
+      }
+      setIsActive(true);
+    } catch (err) {
+      const errorMessage = err.name === "NotAllowedError" ? "Camera access denied. Please allow camera permissions." : err.name === "NotFoundError" ? "No camera found on this device." : err.message || "Failed to access camera.";
+      setError(errorMessage);
+      setIsActive(false);
+    }
+  }, [width, height, facingMode]);
+  const stop = useCallback(() => {
+    if (streamRef.current) {
+      streamRef.current.getTracks().forEach((track) => track.stop());
+      streamRef.current = null;
+    }
+    if (videoRef.current) {
+      videoRef.current.srcObject = null;
+    }
+    setIsActive(false);
+  }, []);
+  useEffect(() => {
+    if (autoStart) {
+      start();
+    }
+    return () => {
+      stop();
+    };
+  }, [autoStart]);
+  return {
+    videoRef,
+    stream: streamRef.current,
+    isActive,
+    error,
+    start,
+    stop
+  };
+}
+
+// src/hooks/useFaceDetection.ts
+import { useState as useState2, useEffect as useEffect2, useRef as useRef2, useCallback as useCallback2 } from "react";
+var FACE_LANDMARKS_TESSELATION = null;
+var FACE_LANDMARKS_RIGHT_IRIS = null;
+var FACE_LANDMARKS_LEFT_IRIS = null;
+var DrawingUtils = null;
+function useFaceDetection(videoElement, options = {}) {
+  const { enabled = true, meshCanvas = null, drawMesh = false } = options;
+  const [isLoading, setIsLoading] = useState2(true);
+  const [landmarker, setLandmarker] = useState2(null);
+  const [result, setResult] = useState2({
+    detected: false,
+    landmarks: null,
+    qualityMessage: "Initializing face detection...",
+    isQualityGood: false,
+    brightness: 0
+  });
+  const latestLandmarksRef = useRef2(null);
+  const brightnessCanvasRef = useRef2(null);
+  useEffect2(() => {
+    if (!enabled) {
+      setIsLoading(false);
+      return;
+    }
+    const loadMediaPipe = async () => {
+      try {
+        const mediapipe = await import("@mediapipe/tasks-vision");
+        const { FilesetResolver, FaceLandmarker } = mediapipe;
+        FACE_LANDMARKS_TESSELATION = FaceLandmarker.FACE_LANDMARKS_TESSELATION;
+        FACE_LANDMARKS_RIGHT_IRIS = FaceLandmarker.FACE_LANDMARKS_RIGHT_IRIS;
+        FACE_LANDMARKS_LEFT_IRIS = FaceLandmarker.FACE_LANDMARKS_LEFT_IRIS;
+        DrawingUtils = mediapipe.DrawingUtils;
+        const vision = await FilesetResolver.forVisionTasks(
+          "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.3/wasm"
+        );
+        const fl = await FaceLandmarker.createFromOptions(vision, {
+          baseOptions: {
+            modelAssetPath: `https://storage.googleapis.com/mediapipe-models/face_landmarker/face_landmarker/float16/1/face_landmarker.task`,
+            delegate: "GPU"
+          },
+          outputFaceBlendshapes: false,
+          runningMode: "VIDEO",
+          numFaces: 1
+        });
+        setLandmarker(fl);
+        setIsLoading(false);
+        setResult((prev) => ({
+          ...prev,
+          qualityMessage: "Waiting for camera..."
+        }));
+      } catch (err) {
+        console.error("Failed to load MediaPipe:", err);
+        setIsLoading(false);
+        setResult((prev) => ({
+          ...prev,
+          qualityMessage: "Face detection unavailable"
+        }));
+      }
+    };
+    loadMediaPipe();
+  }, [enabled]);
+  useEffect2(() => {
+    brightnessCanvasRef.current = document.createElement("canvas");
+    brightnessCanvasRef.current.width = 64;
+    brightnessCanvasRef.current.height = 48;
+  }, []);
+  const calculateBrightness = useCallback2((video) => {
+    const canvas = brightnessCanvasRef.current;
+    if (!canvas) return 100;
+    const ctx = canvas.getContext("2d", { willReadFrequently: true });
+    if (!ctx) return 100;
+    ctx.drawImage(video, 0, 0, 64, 48);
+    const frame = ctx.getImageData(0, 0, 64, 48);
+    let sum = 0;
+    for (let i = 0; i < frame.data.length; i += 4) {
+      sum += (frame.data[i] + frame.data[i + 1] + frame.data[i + 2]) / 3;
+    }
+    return sum / (64 * 48);
+  }, []);
+  useEffect2(() => {
+    if (!videoElement || !landmarker || !enabled) return;
+    let lastTime = -1;
+    let frameId;
+    let brightnessCheckCounter = 0;
+    const detect = () => {
+      if (videoElement.paused || videoElement.ended) {
+        frameId = requestAnimationFrame(detect);
+        return;
+      }
+      if (videoElement.currentTime !== lastTime && videoElement.readyState >= 2) {
+        lastTime = videoElement.currentTime;
+        try {
+          const results = landmarker.detectForVideo(videoElement, performance.now());
+          let brightness = result.brightness;
+          brightnessCheckCounter++;
+          if (brightnessCheckCounter >= 15) {
+            brightness = calculateBrightness(videoElement);
+            brightnessCheckCounter = 0;
+          }
+          if (drawMesh && meshCanvas && DrawingUtils) {
+            const ctx = meshCanvas.getContext("2d");
+            if (ctx) {
+              meshCanvas.width = videoElement.videoWidth;
+              meshCanvas.height = videoElement.videoHeight;
+              ctx.clearRect(0, 0, meshCanvas.width, meshCanvas.height);
+              if (results.faceLandmarks && results.faceLandmarks.length > 0) {
+                const drawingUtils = new DrawingUtils(ctx);
+                for (const landmarks of results.faceLandmarks) {
+                  drawingUtils.drawConnectors(
+                    landmarks,
+                    FACE_LANDMARKS_TESSELATION,
+                    { color: "#30d5c8aa", lineWidth: 1 }
+                  );
+                  drawingUtils.drawConnectors(
+                    landmarks,
+                    FACE_LANDMARKS_RIGHT_IRIS,
+                    { color: "#00FF00", lineWidth: 2 }
+                  );
+                  drawingUtils.drawConnectors(
+                    landmarks,
+                    FACE_LANDMARKS_LEFT_IRIS,
+                    { color: "#00FF00", lineWidth: 2 }
+                  );
+                }
+              }
+            }
+          }
+          if (results.faceLandmarks && results.faceLandmarks.length > 0) {
+            latestLandmarksRef.current = results.faceLandmarks[0];
+            let qualityMessage = "Face detected";
+            let isQualityGood = true;
+            if (brightness < 60) {
+              qualityMessage = "Too dark - add more light";
+              isQualityGood = false;
+            } else if (brightness > 200) {
+              qualityMessage = "Too bright - reduce light";
+              isQualityGood = false;
+            } else {
+              qualityMessage = "Face locked. Ready to scan.";
+            }
+            setResult({
+              detected: true,
+              landmarks: results.faceLandmarks[0],
+              qualityMessage,
+              isQualityGood,
+              brightness
+            });
+          } else {
+            latestLandmarksRef.current = null;
+            setResult({
+              detected: false,
+              landmarks: null,
+              qualityMessage: "Position face in frame",
+              isQualityGood: false,
+              brightness
+            });
+          }
+        } catch (err) {
+        }
+      }
+      frameId = requestAnimationFrame(detect);
+    };
+    detect();
+    return () => {
+      if (frameId) {
+        cancelAnimationFrame(frameId);
+      }
+    };
+  }, [videoElement, landmarker, enabled, calculateBrightness, result.brightness, drawMesh, meshCanvas]);
+  return {
+    ...result,
+    isLoading,
+    latestLandmarks: latestLandmarksRef
+  };
+}
+
+// src/hooks/useRecording.ts
+import { useState as useState3, useRef as useRef3, useCallback as useCallback3 } from "react";
+function useRecording(stream, options = {}) {
+  const {
+    duration = 10,
+    mimeType = "video/webm;codecs=vp9",
+    onComplete
+  } = options;
+  const mediaRecorderRef = useRef3(null);
+  const timerRef = useRef3(null);
+  const chunksRef = useRef3([]);
+  const [isRecording, setIsRecording] = useState3(false);
+  const [timeLeft, setTimeLeft] = useState3(duration);
+  const [blob, setBlob] = useState3(null);
+  const cleanup = useCallback3(() => {
+    if (timerRef.current) {
+      clearInterval(timerRef.current);
+      timerRef.current = null;
+    }
+  }, []);
+  const start = useCallback3(() => {
+    if (!stream || isRecording) return;
+    chunksRef.current = [];
+    setBlob(null);
+    setTimeLeft(duration);
+    let actualMimeType = mimeType;
+    if (!MediaRecorder.isTypeSupported(mimeType)) {
+      actualMimeType = "video/webm";
+      if (!MediaRecorder.isTypeSupported(actualMimeType)) {
+        actualMimeType = "video/mp4";
+      }
+    }
+    try {
+      const recorder = new MediaRecorder(stream, { mimeType: actualMimeType });
+      recorder.ondataavailable = (e) => {
+        if (e.data.size > 0) {
+          chunksRef.current.push(e.data);
+        }
+      };
+      recorder.onstop = () => {
+        const videoBlob = new Blob(chunksRef.current, { type: actualMimeType });
+        setBlob(videoBlob);
+        setIsRecording(false);
+        cleanup();
+        onComplete?.(videoBlob);
+      };
+      recorder.onerror = (e) => {
+        console.error("MediaRecorder error:", e);
+        setIsRecording(false);
+        cleanup();
+      };
+      mediaRecorderRef.current = recorder;
+      recorder.start(100);
+      setIsRecording(true);
+      timerRef.current = setInterval(() => {
+        setTimeLeft((prev) => {
+          if (prev <= 1) {
+            recorder.stop();
+            return 0;
+          }
+          return prev - 1;
+        });
+      }, 1e3);
+    } catch (err) {
+      console.error("Failed to start recording:", err);
+    }
+  }, [stream, isRecording, duration, mimeType, onComplete, cleanup]);
+  const stop = useCallback3(() => {
+    if (mediaRecorderRef.current && isRecording) {
+      mediaRecorderRef.current.stop();
+    }
+  }, [isRecording]);
+  const reset = useCallback3(() => {
+    cleanup();
+    setIsRecording(false);
+    setTimeLeft(duration);
+    setBlob(null);
+    chunksRef.current = [];
+  }, [duration, cleanup]);
+  return {
+    isRecording,
+    timeLeft,
+    blob,
+    start,
+    stop,
+    reset
+  };
+}
+
+// src/client.ts
+var PulseClient = class {
+  constructor(config) {
+    if (!config.apiKey) {
+      throw new Error("PulseAI SDK: apiKey is required");
+    }
+    this.apiKey = config.apiKey;
+    this.baseUrl = config.baseUrl || typeof import.meta !== "undefined" && import.meta.env?.VITE_API_URL || "http://localhost:8123";
+    this.timeout = config.timeout || 6e4;
+  }
+  /**
+   * Analyze video for medical vital signs
+   * Returns heart rate, HRV, SpO2, stress index, and more.
+   */
+  async analyze(options) {
+    const formData = new FormData();
+    formData.append("video", options.video, "scan.webm");
+    if (options.age !== void 0) {
+      formData.append("age", options.age.toString());
+    }
+    if (options.sex) {
+      formData.append("sex", options.sex);
+    }
+    if (options.weight !== void 0) {
+      formData.append("weight", options.weight.toString());
+    }
+    if (options.height !== void 0) {
+      formData.append("height", options.height.toString());
+    }
+    const response = await this.request("/analyze", formData);
+    return response;
+  }
+  /**
+   * Analyze video for beauty/skin metrics
+   * Returns skin age, texture, hydration, symmetry, and recommendations.
+   */
+  async analyzeBeauty(options) {
+    const formData = new FormData();
+    formData.append("video", options.video, "beauty_scan.webm");
+    if (options.age !== void 0) {
+      formData.append("age", options.age.toString());
+    }
+    if (options.gender) {
+      formData.append("gender", options.gender);
+    }
+    const response = await this.request("/analyze/beauty", formData);
+    return response;
+  }
+  /**
+   * Check API health status
+   */
+  async health() {
+    const response = await fetch(`${this.baseUrl}/health`, {
+      method: "GET",
+      headers: { "X-API-Key": this.apiKey }
+    });
+    if (!response.ok) {
+      throw new Error("Health check failed");
+    }
+    return response.json();
+  }
+  /**
+   * Internal request handler with timeout and error handling
+   */
+  async request(endpoint, formData) {
+    const controller = new AbortController();
+    const timeoutId = setTimeout(() => controller.abort(), this.timeout);
+    try {
+      const response = await fetch(`${this.baseUrl}${endpoint}`, {
+        method: "POST",
+        headers: {
+          "X-API-Key": this.apiKey
+          // Don't set Content-Type - browser sets it with boundary for FormData
+        },
+        body: formData,
+        signal: controller.signal
+      });
+      clearTimeout(timeoutId);
+      if (!response.ok) {
+        const errorData = await response.json().catch(() => ({}));
+        const message = errorData.detail || `Request failed with status ${response.status}`;
+        if (response.status === 401) {
+          throw new Error("Invalid API key. Please check your credentials.");
+        }
+        if (response.status === 402) {
+          throw new Error("API quota exceeded. Please upgrade your plan.");
+        }
+        if (response.status === 403) {
+          throw new Error("API key missing. Include X-API-Key header.");
+        }
+        if (response.status >= 500) {
+          throw new Error("Server error. Please try again later.");
+        }
+        throw new Error(message);
+      }
+      const result = await response.json();
+      if (result.status !== "success") {
+        throw new Error(result.message || "Analysis failed");
+      }
+      return result.data;
+    } catch (err) {
+      clearTimeout(timeoutId);
+      if (err.name === "AbortError") {
+        throw new Error("Request timed out. The video may be too long or the connection too slow.");
+      }
+      throw err;
+    }
+  }
+};
+
+// src/components/PulseScanner.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var PulseScanner = ({
+  apiKey,
+  apiUrl,
+  duration = 10,
+  onResult,
+  onError,
+  onStatusChange,
+  showPreview = true,
+  showOverlay = true,
+  showMesh = false,
+  showCountdown = true,
+  className = "",
+  theme = "light",
+  userData,
+  autoStart = false
+}) => {
+  const clientRef = useRef4(null);
+  const meshCanvasRef = useRef4(null);
+  useEffect3(() => {
+    clientRef.current = new PulseClient({
+      apiKey,
+      baseUrl: apiUrl
+      // undefined is fine - client will use env var
+    });
+  }, [apiKey, apiUrl]);
+  const {
+    videoRef,
+    stream,
+    isActive: isCameraActive,
+    error: cameraError,
+    start: startCamera,
+    stop: stopCamera
+  } = useCamera({ autoStart });
+  const {
+    detected: faceDetected,
+    qualityMessage,
+    isQualityGood,
+    isLoading: isFaceDetectionLoading
+  } = useFaceDetection(videoRef.current, {
+    enabled: isCameraActive,
+    meshCanvas: meshCanvasRef.current,
+    drawMesh: showMesh
+  });
+  const {
+    isRecording,
+    timeLeft,
+    blob: recordedBlob,
+    start: startRecording,
+    reset: resetRecording
+  } = useRecording(stream, { duration });
+  const [status, setStatus] = useState4("idle");
+  const [error, setError] = useState4(null);
+  useEffect3(() => {
+    onStatusChange?.(status);
+  }, [status, onStatusChange]);
+  useEffect3(() => {
+    if (cameraError) {
+      setError(cameraError);
+      setStatus("error");
+      onError?.(new Error(cameraError));
+    }
+  }, [cameraError, onError]);
+  useEffect3(() => {
+    if (isFaceDetectionLoading) {
+      setStatus("loading");
+    } else if (isCameraActive && !isRecording) {
+      setStatus("ready");
+    }
+  }, [isFaceDetectionLoading, isCameraActive, isRecording]);
+  useEffect3(() => {
+    if (isRecording) {
+      setStatus("recording");
+    }
+  }, [isRecording]);
+  useEffect3(() => {
+    if (recordedBlob && !isRecording) {
+      analyzeVideo(recordedBlob);
+    }
+  }, [recordedBlob, isRecording]);
+  const analyzeVideo = useCallback4(async (videoBlob) => {
+    if (!clientRef.current) {
+      setError("Client not initialized");
+      setStatus("error");
+      return;
+    }
+    setStatus("uploading");
+    setError(null);
+    try {
+      setStatus("analyzing");
+      const result = await clientRef.current.analyze({
+        video: videoBlob,
+        age: userData?.age,
+        sex: userData?.sex,
+        weight: userData?.weight,
+        height: userData?.height
+      });
+      setStatus("complete");
+      onResult(result);
+    } catch (err) {
+      setError(err.message);
+      setStatus("error");
+      onError?.(err);
+    }
+  }, [userData, onResult, onError]);
+  const handleStartScan = useCallback4(() => {
+    setError(null);
+    startRecording();
+  }, [startRecording]);
+  const handleReset = useCallback4(() => {
+    resetRecording();
+    setError(null);
+    setStatus(isCameraActive ? "ready" : "idle");
+  }, [resetRecording, isCameraActive]);
+  const handleEnableCamera = useCallback4(async () => {
+    setError(null);
+    setStatus("loading");
+    await startCamera();
+  }, [startCamera]);
+  useEffect3(() => {
+    return () => {
+      stopCamera();
+    };
+  }, [stopCamera]);
+  const themeClass = `pulse-scanner--${theme}`;
+  const statusClass = `pulse-scanner--${status}`;
+  return /* @__PURE__ */ jsxs("div", { className: `pulse-scanner ${themeClass} ${statusClass} ${className}`, children: [
+    showPreview && /* @__PURE__ */ jsxs("div", { className: "pulse-scanner__preview", children: [
+      /* @__PURE__ */ jsx(
+        "video",
+        {
+          ref: videoRef,
+          autoPlay: true,
+          playsInline: true,
+          muted: true,
+          className: "pulse-scanner__video"
+        }
+      ),
+      showMesh && /* @__PURE__ */ jsx(
+        "canvas",
+        {
+          ref: meshCanvasRef,
+          className: "pulse-scanner__mesh-canvas"
+        }
+      ),
+      showOverlay && isCameraActive && /* @__PURE__ */ jsxs("div", { className: "pulse-scanner__overlay", children: [
+        /* @__PURE__ */ jsx("div", { className: `pulse-scanner__face-guide ${faceDetected ? "pulse-scanner__face-guide--detected" : ""}` }),
+        /* @__PURE__ */ jsx("div", { className: `pulse-scanner__quality ${isQualityGood ? "pulse-scanner__quality--good" : ""}`, children: isRecording ? "Hold still..." : qualityMessage })
+      ] }),
+      showCountdown && isRecording && /* @__PURE__ */ jsxs("div", { className: "pulse-scanner__countdown", children: [
+        /* @__PURE__ */ jsxs("div", { className: "pulse-scanner__countdown-ring", children: [
+          /* @__PURE__ */ jsx("svg", { viewBox: "0 0 100 100", children: /* @__PURE__ */ jsx(
+            "circle",
+            {
+              cx: "50",
+              cy: "50",
+              r: "45",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "4",
+              strokeDasharray: `${timeLeft / duration * 283} 283`,
+              transform: "rotate(-90 50 50)"
+            }
+          ) }),
+          /* @__PURE__ */ jsx("span", { className: "pulse-scanner__countdown-number", children: timeLeft })
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "pulse-scanner__countdown-label", children: "seconds" })
+      ] }),
+      (status === "uploading" || status === "analyzing") && /* @__PURE__ */ jsxs("div", { className: "pulse-scanner__processing", children: [
+        /* @__PURE__ */ jsx("div", { className: "pulse-scanner__spinner" }),
+        /* @__PURE__ */ jsx("span", { className: "pulse-scanner__processing-text", children: status === "uploading" ? "Uploading..." : "Analyzing vitals..." })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "pulse-scanner__controls", children: !isCameraActive ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: handleEnableCamera,
+        disabled: status === "loading",
+        className: "pulse-scanner__btn pulse-scanner__btn--primary",
+        children: status === "loading" ? "Loading..." : "Enable Camera"
+      }
+    ) : status === "complete" || status === "error" ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: handleReset,
+        className: "pulse-scanner__btn pulse-scanner__btn--secondary",
+        children: "Scan Again"
+      }
+    ) : /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: handleStartScan,
+        disabled: isRecording || status === "uploading" || status === "analyzing",
+        className: "pulse-scanner__btn pulse-scanner__btn--primary",
+        children: isRecording ? `Recording ${timeLeft}s` : status === "uploading" || status === "analyzing" ? "Processing..." : `Start ${duration}s Scan`
+      }
+    ) }),
+    error && /* @__PURE__ */ jsxs("div", { className: "pulse-scanner__error", children: [
+      /* @__PURE__ */ jsx("span", { className: "pulse-scanner__error-icon", children: "!" }),
+      /* @__PURE__ */ jsx("span", { className: "pulse-scanner__error-text", children: error })
+    ] })
+  ] });
+};
+
+// src/components/VitalsCard.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function getHeartRateStatus(hr) {
+  if (hr < 55) return { label: "Low", color: "blue" };
+  if (hr > 100) return { label: "Elevated", color: "orange" };
+  return { label: "Normal", color: "green" };
+}
+function getSpo2Status(spo2) {
+  if (spo2 < 95) return { label: "Low", color: "orange" };
+  return { label: "Optimal", color: "green" };
+}
+function getStressStatus(stress) {
+  if (stress > 70) return { label: "High", color: "red" };
+  if (stress < 40) return { label: "Relaxed", color: "green" };
+  return { label: "Moderate", color: "blue" };
+}
+function getHrvStatus(hrv) {
+  if (hrv < 30) return { label: "Low", color: "orange" };
+  if (hrv > 60) return { label: "Excellent", color: "green" };
+  return { label: "Balanced", color: "blue" };
+}
+var VitalsCard = ({
+  heartRate,
+  spo2,
+  stressIndex,
+  hrvSdnn,
+  hrvRmssd,
+  respiratoryRate,
+  bloodPressure,
+  recoveryScore,
+  loading = false,
+  error = null,
+  compact = false,
+  showAll = false,
+  className = "",
+  theme = "light"
+}) => {
+  if (loading) {
+    return /* @__PURE__ */ jsxs2("div", { className: `vitals-card vitals-card--loading vitals-card--${theme} ${className}`, children: [
+      /* @__PURE__ */ jsx2("div", { className: "vitals-card__spinner" }),
+      /* @__PURE__ */ jsx2("span", { className: "vitals-card__loading-text", children: "Analyzing vitals..." })
+    ] });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxs2("div", { className: `vitals-card vitals-card--error vitals-card--${theme} ${className}`, children: [
+      /* @__PURE__ */ jsx2("span", { className: "vitals-card__error-icon", children: "!" }),
+      /* @__PURE__ */ jsx2("span", { className: "vitals-card__error-text", children: error })
+    ] });
+  }
+  const hrStatus = heartRate !== void 0 ? getHeartRateStatus(heartRate) : null;
+  const spo2Status = spo2 !== void 0 ? getSpo2Status(spo2) : null;
+  const stressStatus = stressIndex !== void 0 ? getStressStatus(stressIndex) : null;
+  const hrvStatus = hrvSdnn !== void 0 ? getHrvStatus(hrvSdnn) : null;
+  return /* @__PURE__ */ jsxs2("div", { className: `vitals-card vitals-card--${theme} ${compact ? "vitals-card--compact" : ""} ${className}`, children: [
+    /* @__PURE__ */ jsxs2("div", { className: "vitals-card__grid", children: [
+      /* @__PURE__ */ jsxs2("div", { className: "vitals-card__item", children: [
+        /* @__PURE__ */ jsx2("span", { className: "vitals-card__label", children: "Heart Rate" }),
+        /* @__PURE__ */ jsxs2("span", { className: "vitals-card__value", children: [
+          heartRate !== void 0 ? heartRate : "--",
+          /* @__PURE__ */ jsx2("small", { className: "vitals-card__unit", children: "BPM" })
+        ] }),
+        hrStatus && /* @__PURE__ */ jsx2("span", { className: `vitals-card__status vitals-card__status--${hrStatus.color}`, children: hrStatus.label })
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "vitals-card__item", children: [
+        /* @__PURE__ */ jsx2("span", { className: "vitals-card__label", children: "SpO2" }),
+        /* @__PURE__ */ jsxs2("span", { className: "vitals-card__value", children: [
+          spo2 !== void 0 ? spo2 : "--",
+          /* @__PURE__ */ jsx2("small", { className: "vitals-card__unit", children: "%" })
+        ] }),
+        spo2Status && /* @__PURE__ */ jsx2("span", { className: `vitals-card__status vitals-card__status--${spo2Status.color}`, children: spo2Status.label })
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "vitals-card__item", children: [
+        /* @__PURE__ */ jsx2("span", { className: "vitals-card__label", children: "Stress" }),
+        /* @__PURE__ */ jsxs2("span", { className: "vitals-card__value", children: [
+          stressIndex !== void 0 ? stressIndex : "--",
+          /* @__PURE__ */ jsx2("small", { className: "vitals-card__unit", children: "/100" })
+        ] }),
+        stressStatus && /* @__PURE__ */ jsx2("span", { className: `vitals-card__status vitals-card__status--${stressStatus.color}`, children: stressStatus.label })
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "vitals-card__item", children: [
+        /* @__PURE__ */ jsx2("span", { className: "vitals-card__label", children: "HRV" }),
+        /* @__PURE__ */ jsxs2("span", { className: "vitals-card__value", children: [
+          hrvSdnn !== void 0 ? hrvSdnn : "--",
+          /* @__PURE__ */ jsx2("small", { className: "vitals-card__unit", children: "ms" })
+        ] }),
+        hrvStatus && /* @__PURE__ */ jsx2("span", { className: `vitals-card__status vitals-card__status--${hrvStatus.color}`, children: hrvStatus.label })
+      ] })
+    ] }),
+    showAll && /* @__PURE__ */ jsxs2("div", { className: "vitals-card__extended", children: [
+      respiratoryRate !== void 0 && /* @__PURE__ */ jsxs2("div", { className: "vitals-card__item vitals-card__item--small", children: [
+        /* @__PURE__ */ jsx2("span", { className: "vitals-card__label", children: "Respiration" }),
+        /* @__PURE__ */ jsxs2("span", { className: "vitals-card__value", children: [
+          respiratoryRate,
+          /* @__PURE__ */ jsx2("small", { className: "vitals-card__unit", children: "/min" })
+        ] })
+      ] }),
+      bloodPressure && /* @__PURE__ */ jsxs2("div", { className: "vitals-card__item vitals-card__item--small", children: [
+        /* @__PURE__ */ jsx2("span", { className: "vitals-card__label", children: "Blood Pressure" }),
+        /* @__PURE__ */ jsxs2("span", { className: "vitals-card__value", children: [
+          bloodPressure.systolic,
+          "/",
+          bloodPressure.diastolic,
+          /* @__PURE__ */ jsx2("small", { className: "vitals-card__unit", children: "mmHg" })
+        ] })
+      ] }),
+      recoveryScore !== void 0 && /* @__PURE__ */ jsxs2("div", { className: "vitals-card__item vitals-card__item--small", children: [
+        /* @__PURE__ */ jsx2("span", { className: "vitals-card__label", children: "Recovery" }),
+        /* @__PURE__ */ jsxs2("span", { className: "vitals-card__value", children: [
+          recoveryScore,
+          /* @__PURE__ */ jsx2("small", { className: "vitals-card__unit", children: "%" })
+        ] })
+      ] }),
+      hrvRmssd !== void 0 && /* @__PURE__ */ jsxs2("div", { className: "vitals-card__item vitals-card__item--small", children: [
+        /* @__PURE__ */ jsx2("span", { className: "vitals-card__label", children: "RMSSD" }),
+        /* @__PURE__ */ jsxs2("span", { className: "vitals-card__value", children: [
+          hrvRmssd,
+          /* @__PURE__ */ jsx2("small", { className: "vitals-card__unit", children: "ms" })
+        ] })
+      ] })
+    ] })
+  ] });
+};
+var VitalsCardFromResult = ({ result, ...props }) => {
+  if (!result) {
+    return /* @__PURE__ */ jsx2(VitalsCard, { ...props });
+  }
+  return /* @__PURE__ */ jsx2(
+    VitalsCard,
+    {
+      heartRate: result.heart_rate,
+      spo2: result.spo2,
+      stressIndex: result.stress_index,
+      hrvSdnn: result.hrv_sdnn,
+      hrvRmssd: result.hrv_rmssd,
+      respiratoryRate: result.respiratory_rate,
+      bloodPressure: result.blood_pressure,
+      recoveryScore: result.recovery_score,
+      ...props
+    }
+  );
+};
+
+// src/index.ts
+var VERSION = "1.0.0";
+export {
+  PulseClient,
+  PulseScanner,
+  VERSION,
+  VitalsCard,
+  VitalsCardFromResult,
+  useCamera,
+  useFaceDetection,
+  useRecording
+};