interview-widget 3.3.0 → 3.3.2

package/README.md

@@ -201,21 +201,25 @@ Pass this object to `InterviewWidgetProvider` via the `config` prop. Tables list
 
 ### UI
 
-| Prop         | Type           | Default   | Description                            |
-| ------------ | -------------- | --------- | -------------------------------------- |
-| baseColor    | `string (hex)` | "#3B82F6" | Primary brand color used by the widget |
-| borderRadius | `string (CSS)` | "8px"     | Global corner radius for components    |
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| baseColor | `string (hex)` | "#3B82F6" | Primary brand color used by the widget |
+| borderRadius | `string (CSS)` | "8px" | Global corner radius for components |
+| retryProgressSavedText | `string` | `"Your progress is saved — tap Retry or exit the interview..."` | Text to show in next-question retry modal |
+| retryMaxAttempts | `number` | 3 | Maximum number of attempts allowed for retrying next question |
+| retryNoAttemptsLeftText | `string` | `"Retry limit reached. Please exit and resume later."` | Error message shown when max attempts are reached |
 
 ### Interview
 
-| Prop                 | Type      | Default | Description                                |
-| -------------------- | --------- | ------- | ------------------------------------------ |
-| allow_answer_editing | `boolean` | true    | Enable/disable answer editing phase        |
-| capture_screenshots  | `boolean` | false   | Enable/disable periodic screenshot captures |
-| timers               | `object`  | [see below](#timers)             | Per-phase and global timing configuration  |
-| stt                  | `object`  | [see below](#stt-speech-to-text) | Speech-to-Text provider settings           |
-| tts                  | `object`  | [see below](#tts-text-to-speech) | Text-to-Speech provider settings           |
-| proctoring           | `object`  | [see below](#proctoring)         | Proctoring settings and cheating detection |
+| Prop                 | Type      | Default                          | Description                                 |
+| -------------------- | --------- | -------------------------------- | ------------------------------------------- |
+| allow_answer_editing | `boolean` | true                             | Enable/disable answer editing phase         |
+| capture_screenshots  | `boolean` | false                            | Enable/disable periodic screenshot captures |
+| record_video         | `boolean` | false                            | Enable/disable video recording              |
+| timers               | `object`  | [see below](#timers)             | Per-phase and global timing configuration   |
+| stt                  | `object`  | [see below](#stt-speech-to-text) | Speech-to-Text provider settings            |
+| tts                  | `object`  | [see below](#tts-text-to-speech) | Text-to-Speech provider settings            |
+| proctoring           | `object`  | [see below](#proctoring)         | Proctoring settings and cheating detection  |
 
 #### Timers
 

package/dist/assets/index.d.ts

@@ -17,11 +17,15 @@ export * from './mic-icon';
 export * from './mic-off-icon';
 export * from './monitor-icon';
 export * from './mouse-pointer-click-icon';
+export * from './net-cross-icon';
 export * from './shield-icon';
 export * from './speak-icon';
+export * from './speech-icon';
 export * from './target-icon';
 export * from './users-icon';
 export * from './video-icon';
 export * from './video-off-icon';
 export * from './volumn-icon';
-export * from './speech-icon';
+export * from './wifi-icon';
+export * from './wifi-low-icon';
+export * from './wifi-off-icon';

package/dist/assets/net-cross-icon.d.ts

@@ -0,0 +1 @@
+export declare const NetCrossIcon: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/wifi-icon.d.ts

@@ -0,0 +1 @@
+export declare const WifiIcon: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/wifi-low-icon.d.ts

@@ -0,0 +1 @@
+export declare const WifiLowIcon: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/wifi-off-icon.d.ts

@@ -0,0 +1 @@
+export declare const WifiOffIcon: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/interview/interview-content.d.ts

@@ -22,6 +22,11 @@ interface InterviewContentProps {
     onAnswerChange?: ((e: React.ChangeEvent<HTMLTextAreaElement>) => void) | undefined;
     editingTime?: number | undefined;
     disableSubmitButton?: boolean;
+    fetchQuestionError?: any;
+    onRetryQuestion?: () => void;
+    retryClicksCount?: number;
+    isFetchingQuestion?: boolean;
+    onExitInterview?: () => void;
 }
 export declare const InterviewContent: React.FC<InterviewContentProps>;
 export {};

package/dist/components/interview/proctoring/gaze-detection/hooks/use-gaze-analysis.d.ts

@@ -2,7 +2,7 @@ import { Landmark, ReferenceData } from '../utils/types';
 export declare const useGazeAnalysis: () => {
     engagement: number;
     isLookingAway: boolean;
-    analyzeGaze: (landmarks: Landmark[], reference: ReferenceData, gazeAnalysisEnabled: boolean) => {
+    analyzeGaze: (landmarks: Landmark[] | null, reference: ReferenceData, gazeAnalysisEnabled: boolean) => {
         engagement: number;
         isLookingAway: boolean;
     } | undefined;

package/dist/components/interview/proctoring/gaze-detection/hooks/use-render-loop.d.ts

@@ -1,5 +1,5 @@
 import { Landmark } from '../utils/types';
-export declare const useRenderLoop: (videoRef: React.RefObject<HTMLVideoElement | null>, canvasRef: React.RefObject<HTMLCanvasElement | null>, faceLandmarkerRef: React.RefObject<any>, updateFPS: () => void, analyzeFace: (results: any, referenceSet: boolean, referenceRef: Landmark[], setStatusMessage: (message: string) => void) => Landmark[] | null, drawWithEngagementBar: (canvas: HTMLCanvasElement, video: HTMLVideoElement, landmarks: Landmark[], showLandmarks: boolean, showEngagementBar: boolean, gazeAnalysisEnabled: boolean, referenceSet: boolean) => void, clearCanvas: (canvas: HTMLCanvasElement, video: HTMLVideoElement) => void, analyzeGaze: (landmarks: Landmark[], reference: any, gazeAnalysisEnabled: boolean) => void, referenceSet: boolean, referenceRef: React.RefObject<any>, showLandmarks: boolean, showEngagementBar: boolean, gazeAnalysisEnabled: boolean, setStatusMessage: (message: string) => void, setReferenceFaceNotDetected: (detected: boolean) => void) => {
+export declare const useRenderLoop: (videoRef: React.RefObject<HTMLVideoElement | null>, canvasRef: React.RefObject<HTMLCanvasElement | null>, faceLandmarkerRef: React.RefObject<any>, updateFPS: () => void, analyzeFace: (results: any, referenceSet: boolean, referenceRef: Landmark[], setStatusMessage: (message: string) => void) => Landmark[] | null, drawWithEngagementBar: (canvas: HTMLCanvasElement, video: HTMLVideoElement, landmarks: Landmark[], showLandmarks: boolean, showEngagementBar: boolean, gazeAnalysisEnabled: boolean, referenceSet: boolean) => void, clearCanvas: (canvas: HTMLCanvasElement, video: HTMLVideoElement) => void, analyzeGaze: (landmarks: Landmark[] | null, reference: any, gazeAnalysisEnabled: boolean) => void, referenceSet: boolean, referenceRef: React.RefObject<any>, showLandmarks: boolean, showEngagementBar: boolean, gazeAnalysisEnabled: boolean, setStatusMessage: (message: string) => void, setReferenceFaceNotDetected: (detected: boolean) => void) => {
     renderLoop: () => void;
     animationFrameRef: import('react').RefObject<number | null>;
 };

package/dist/components/media/video-feed.d.ts

@@ -18,6 +18,7 @@ interface VideoFeedProps {
     cheatingWarningVisible?: boolean;
     isDeviceLoading?: boolean;
     videoAllowed?: boolean;
+    questionNumber?: number;
 }
 declare const VideoFeed: import('react').ForwardRefExoticComponent<VideoFeedProps & import('react').RefAttributes<VideoFeedHandle>>;
 export default VideoFeed;

package/dist/components/modals/retry-confirmation-modal.d.ts

@@ -0,0 +1,9 @@
+interface RetryConfirmationModalProps {
+    isOpen: boolean;
+    onRetry: () => void;
+    onExit: () => void;
+    retryClicksCount: number;
+    isLoading: boolean;
+}
+export declare const RetryConfirmationModal: ({ isOpen, onRetry, onExit, retryClicksCount, isLoading, }: RetryConfirmationModalProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/network/network-quality-bar.d.ts

@@ -0,0 +1,6 @@
+import { NetworkQualityLevel } from './network-quality-config';
+interface NetworkQualityBarProps {
+    quality: NetworkQualityLevel;
+}
+export declare function NetworkQualityBar({ quality }: NetworkQualityBarProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/network/network-quality-config.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+export type NetworkQualityLevel = "good" | "fair" | "poor" | "disconnected";
+export interface NetworkQualityConfig {
+    /** Tailwind bar fill color class */
+    barColor: string;
+    /** Number of lit bars out of 3 */
+    activeBars: number;
+    /** Short label for tooltip */
+    label: string;
+    /** Whether to trigger the warning modal */
+    showModal: boolean;
+    /** Icon component for the warning modal */
+    modalIcon: React.ComponentType<React.SVGProps<SVGSVGElement>>;
+    modalIconColor: string;
+    modalIconBg: string;
+    modalIconBorder: string;
+    modalTitle: string;
+    modalSubtitle: string;
+    modalDescription?: string;
+}
+export declare const networkQualityConfigs: Record<NetworkQualityLevel, NetworkQualityConfig>;

package/dist/components/network/network-warning-modal.d.ts

@@ -0,0 +1,12 @@
+import { NetworkQualityLevel } from './network-quality-config';
+interface NetworkWarningModalProps {
+    isOpen: boolean;
+    quality: NetworkQualityLevel;
+    onClose: () => void;
+}
+/**
+ * Shown when network quality drops to "poor" or "disconnected".
+ * Styled identically to GazeWarningModal.
+ */
+export declare function NetworkWarningModal({ isOpen, quality, onClose, }: NetworkWarningModalProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/context/interview-widget-context.d.ts

@@ -21,6 +21,9 @@ export declare function useAPIConfig(): {
 export declare function useUIConfig(): {
     baseColor?: string;
     borderRadius?: string;
+    retryProgressSavedText?: string;
+    retryMaxAttempts?: number;
+    retryNoAttemptsLeftText?: string;
 };
 export declare function useInterviewConfigSection(): NonNullable<InterviewWidgetConfig["interview"]>;
 export declare function useSTTConfig(): {

package/dist/context/proctoring-context.d.ts

@@ -1,8 +1,21 @@
 import { default as React } from 'react';
 import { ViolationLogger } from '../types';
 import { GazeViolationCounters, GazeViolationType } from '../components/interview/proctoring/gaze-detection/utils/types';
+export type ProctoringState = {
+    logViolations: ViolationLogger[];
+    totalViolations: number;
+    gazeViolationCounters: GazeViolationCounters;
+    referenceSet: boolean;
+    referenceRef: {
+        x: number;
+        y: number;
+        noseX: number;
+        noseY: number;
+    };
+};
 export declare const ProctoringProvider: React.FC<{
     children: React.ReactNode;
+    interviewId?: string;
 }>;
 export declare const useProctoringStore: () => {
     logViolations: ViolationLogger[];

package/dist/hooks/index.d.ts

@@ -3,6 +3,7 @@ export * from './use-dialog';
 export * from './use-full-screen';
 export * from './use-interview-api';
 export * from './use-keyboard-prevention';
+export * from './use-network-quality';
 export * from './use-stt';
 export * from './use-tab-switch';
 export * from './use-text-selection-prevention';

package/dist/hooks/use-network-quality.d.ts

@@ -0,0 +1,10 @@
+export type NetworkQualityLevel = "good" | "fair" | "poor" | "disconnected";
+export interface NetworkQualityState {
+    quality: NetworkQualityLevel;
+    isOnline: boolean;
+    effectiveType?: string | undefined;
+    rtt?: number | undefined;
+    downlink?: number | undefined;
+    isInitialising: boolean;
+}
+export declare function useNetworkQuality(): NetworkQualityState;

package/dist/hooks/use-video-recording.d.ts

@@ -1,4 +1,4 @@
-export declare function useVideoRecordingStream(interviewId: string): {
+export declare function useVideoRecordingStream(interviewId: string, record_video?: boolean, questionNumber?: number): {
     startRecording: (stream: MediaStream) => void;
     stopRecording: () => void;
     isRecording: boolean;

package/dist/services/api/endpoints.d.ts

@@ -15,4 +15,5 @@ export declare const API_ENDPOINTS: {
     EXIT: (interviewId: string) => string;
     CONFIG: (interviewId: string) => string;
     TRANSCRIPTION: (interviewId: string) => string;
+    VIOLATIONS: (interviewId: string) => string;
 };

package/dist/services/api/interview-api.d.ts

@@ -1,4 +1,4 @@
-import { InterviewConfigResponse, InterviewQuestionPayload, InterviewQuestionResponse, InterviewSubmitAnswerPayload, InterviewTranscriptResponse, InterviewWidgetConfig, ScreenshotUploadRequestResponse } from '../../types';
+import { InterviewConfigResponse, InterviewQuestionPayload, InterviewQuestionResponse, InterviewSubmitAnswerPayload, InterviewTranscriptResponse, InterviewViolationsPayload, InterviewViolationsResponse, InterviewWidgetConfig, ScreenshotUploadRequestResponse } from '../../types';
 declare class InterviewAPI {
     private config;
     constructor(config?: InterviewWidgetConfig["api"]);
@@ -46,6 +46,14 @@ declare class InterviewAPI {
      * Get interview transcription
      */
     getInterviewTranscription(interviewId: string): Promise<InterviewTranscriptResponse>;
+    /**
+     * Get violations snapshot for an interview
+     */
+    getViolations(interviewId: string): Promise<InterviewViolationsResponse>;
+    /**
+     * Update violations snapshot for an interview
+     */
+    updateViolations({ interviewId, violations, }: InterviewViolationsPayload): Promise<InterviewViolationsResponse>;
 }
 export declare const interviewAPI: InterviewAPI;
 export { InterviewAPI };

package/dist/services/common-service.d.ts

@@ -0,0 +1 @@
+export declare const stopAllServices: () => void;

package/dist/services/stt/stt-service.d.ts

@@ -44,6 +44,7 @@ declare class STTService {
     private pendingStopPromise;
     private isStarting;
     private recordingStartTime;
+    private lastRecordedBlob;
     static activeStream: MediaStream | null;
     constructor(config?: STTConfig);
     /**

package/dist/types.d.ts

@@ -46,10 +46,14 @@ export interface InterviewWidgetConfig {
     ui?: {
         baseColor?: string;
         borderRadius?: string;
+        retryProgressSavedText?: string;
+        retryMaxAttempts?: number;
+        retryNoAttemptsLeftText?: string;
     };
     interview?: {
         allow_answer_editing?: boolean;
         capture_screenshots?: boolean;
+        record_video?: boolean;
         timers?: {
             thinkingDuration?: number;
             answeringDuration?: number;
@@ -135,3 +139,14 @@ export interface TranscriptMessage {
     question_generated_at: string;
     answer_submitted_at: string | null;
 }
+export interface InterviewViolationsResponse {
+    success: boolean;
+    message: string;
+    data: any;
+    error?: string | null;
+    code?: number;
+}
+export interface InterviewViolationsPayload {
+    interviewId: string;
+    violations: any;
+}

package/dist/utils/safari-audio-utils.d.ts

@@ -0,0 +1,49 @@
+/**
+ * Safari Audio Utilities
+ *
+ * Centralises all Safari-specific audio quirks so every call site stays clean.
+ * Each function is a transparent no-op / pass-through on non-Safari browsers.
+ *
+ * Safari-specific lines are tagged with // [SAFARI] for easy auditing.
+ */
+/**
+ * Returns true only for genuine Safari (desktop + iOS).
+ * Chrome/Edge on iOS report as Safari in the UA, but they also advertise
+ * "Chrome" or "CriOS" / "EdgA" — we exclude those. [SAFARI]
+ */
+export declare function isSafari(): boolean;
+/**
+ * Returns the best supported MIME type for MediaRecorder.
+ *
+ * Safari only supports audio/mp4 (AAC-LC). Offering audio/webm first causes
+ * MediaRecorder construction to throw a NotSupportedError on Safari. [SAFARI]
+ */
+export declare function getSupportedMimeType(): string;
+/**
+ * Strips constraints that throw OverconstrainedError on Safari.
+ *
+ * Safari rejects `sampleRate` and `channelCount` as MediaTrackConstraints,
+ * raising an OverconstrainedError that blocks mic access entirely. [SAFARI]
+ * All other browsers receive the full constraint set unchanged.
+ */
+export declare function getSafariSafeAudioConstraints(base?: MediaTrackConstraints): MediaTrackConstraints;
+/**
+ * Returns the timeslice argument (ms) to pass to MediaRecorder.start().
+ *
+ * Safari silently suppresses `ondataavailable` events when a timeslice is
+ * provided — it will only emit one blob when stop() is called. [SAFARI]
+ * Returning `undefined` causes the caller to call `start()` with no argument,
+ * which is the correct Safari behaviour.
+ *
+ * Other browsers get 100 ms streaming chunks for real-time processing.
+ */
+export declare function getMediaRecorderStartArg(): number | undefined;
+/**
+ * [SAFARI] Do NOT call requestData() before stop().
+ * Without a timeslice, stop() guarantees one ondataavailable fires
+ * synchronously before onstop. Calling requestData() first queues a
+ * SECOND ondataavailable as a separate task — on some Safari versions
+ * that second event arrives AFTER onstop, so audioChunks is empty
+ * when the blob is assembled. Just call stop().
+ */
+export declare function safariSafeStop(recorder: MediaRecorder): void;