@dialtribe/react-sdk 0.1.0-alpha.12 → 0.1.0-alpha.15

package/dist/dialtribe-streamer.d.mts

@@ -1,501 +1,4 @@
-export { A as ApiClientConfig, h as AudioWaveform, B as Broadcast, C as CDN_DOMAIN, d as DIALTRIBE_API_BASE, c as DialtribeClient, a as DialtribeContextValue, i as DialtribeOverlay, k as DialtribeOverlayMode, j as DialtribeOverlayProps, e as DialtribePlayer, g as DialtribePlayerErrorBoundary, f as DialtribePlayerProps, D as DialtribeProvider, b as DialtribeProviderProps, E as ENDPOINTS, H as HTTP_STATUS, q as HttpStatusCode, L as LoadingSpinner, m as TranscriptData, l as TranscriptSegment, T as TranscriptWord, o as buildBroadcastCdnUrl, p as buildBroadcastS3KeyPrefix, n as formatTime, u as useDialtribe, r as useDialtribeOptional } from './dialtribe-player-Rc9kfQiX.mjs';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import React$1, { RefObject } from 'react';
-
-/**
- * Props for the DialtribeStreamer component.
- *
- * @example
- * ```tsx
- * // Inside DialtribeProvider (recommended)
- * <DialtribeProvider sessionToken={token}>
- *   <DialtribeStreamer
- *     streamKey={keyFromBackend}
- *     onDone={() => window.close()}
- *   />
- * </DialtribeProvider>
- *
- * // Standalone (e.g., popup window)
- * <DialtribeStreamer
- *   sessionToken={token}
- *   streamKey={keyFromBackend}
- *   onDone={() => window.close()}
- * />
- * ```
- */
-interface DialtribeStreamerProps {
-    /**
-     * Session token for API authentication.
-     *
-     * Required for permission checks. Can be provided via:
-     * 1. DialtribeProvider context (recommended for main app)
-     * 2. This prop (required for popup windows)
-     *
-     * Must include `broadcasts:stream` permission.
-     */
-    sessionToken?: string;
-    /**
-     * Stream key for broadcasting.
-     *
-     * **Production apps should always provide this from their backend.**
-     * The stream key authenticates the broadcaster with the encoder server.
-     *
-     * If omitted, a manual input form is shown. This is intended for
-     * development/testing only - end users should never see or handle stream keys.
-     *
-     * @example "w1_abc123def456..."
-     */
-    streamKey?: string;
-    /**
-     * Called when streaming ends (user stops, terminates, or clicks Done).
-     * Use this to close the popup or navigate away.
-     *
-     * @example () => window.close()
-     */
-    onDone?: () => void;
-    /**
-     * Called when the stream key changes (e.g., user edits it in preview mode).
-     * Useful for persisting the key or updating parent state.
-     */
-    onStreamKeyChange?: (key: string) => void;
-    /**
-     * Custom encoder server URL. Defaults to Dialtribe's production encoder.
-     * Only change this for self-hosted encoder deployments.
-     *
-     * @default "https://broadcastapi.dialtribe.com"
-     */
-    encoderServerUrl?: string;
-    /**
-     * Custom API base URL for broadcast availability checks.
-     * Only change this for self-hosted API deployments.
-     *
-     * @default "https://dialtribe.com/api/public/v1"
-     */
-    apiBaseUrl?: string;
-    /**
-     * When true, the streamer fills its parent container instead of the viewport.
-     * Use this when embedding the streamer inline within a page.
-     *
-     * @default false
-     */
-    inline?: boolean;
-}
-declare function DialtribeStreamer({ sessionToken: propSessionToken, streamKey: initialStreamKey, onDone, onStreamKeyChange, encoderServerUrl, apiBaseUrl, inline, }: DialtribeStreamerProps): react_jsx_runtime.JSX.Element;
-
-interface StreamingPreviewProps {
-    videoRef: RefObject<HTMLVideoElement>;
-    isVideoKey: boolean;
-    isVideoEnabled: boolean;
-    mediaStream: MediaStream | null;
-    facingMode: "user" | "environment";
-}
-declare function StreamingPreview({ videoRef, isVideoKey, isVideoEnabled, mediaStream, facingMode, }: StreamingPreviewProps): react_jsx_runtime.JSX.Element;
-
-type StreamingControlState = "previewing" | "connecting" | "live" | "stopping";
-interface MediaDeviceInfo {
-    deviceId: string;
-    label: string;
-}
-interface StreamingControlsProps {
-    state: StreamingControlState;
-    isVideoKey: boolean;
-    isMuted: boolean;
-    isVideoEnabled: boolean;
-    facingMode: "user" | "environment";
-    hasMultipleCameras: boolean;
-    startTime: Date | null;
-    bytesSent: number;
-    showStopConfirm: boolean;
-    streamKey: string;
-    onStreamKeyChange?: (newKey: string) => void;
-    onStart: () => void;
-    onStop: () => void;
-    onConfirmStop: () => void;
-    onCancelStop: () => void;
-    onToggleMute: () => void;
-    onToggleVideo: () => void;
-    onFlipCamera: () => void;
-    onClose?: () => void;
-    showCloseConfirm?: boolean;
-    onConfirmClose?: () => void;
-    onCancelClose?: () => void;
-    videoDevices?: MediaDeviceInfo[];
-    audioDevices?: MediaDeviceInfo[];
-    selectedVideoDeviceId?: string;
-    selectedAudioDeviceId?: string;
-    onVideoDeviceChange?: (deviceId: string) => void;
-    onAudioDeviceChange?: (deviceId: string) => void;
-    mediaStream?: MediaStream | null;
-}
-declare function StreamingControls({ state, isVideoKey, isMuted, isVideoEnabled, facingMode: _facingMode, // Reserved for future use (e.g., showing camera direction)
-hasMultipleCameras, startTime, bytesSent, showStopConfirm, streamKey, onStreamKeyChange, onStart, onStop, onConfirmStop, onCancelStop, onToggleMute, onToggleVideo, onFlipCamera, onClose, showCloseConfirm, onConfirmClose, onCancelClose, videoDevices, audioDevices, selectedVideoDeviceId, selectedAudioDeviceId, onVideoDeviceChange, onAudioDeviceChange, mediaStream, }: StreamingControlsProps): react_jsx_runtime.JSX.Element;
-
-interface StreamKeyDisplayProps {
-    streamKey: string;
-    className?: string;
-    showLabel?: boolean;
-    showCopy?: boolean;
-    editable?: boolean;
-    onChange?: (newKey: string) => void;
-    size?: 'sm' | 'md' | 'lg';
-    layout?: 'vertical' | 'horizontal';
-    darkMode?: boolean;
-}
-/**
- * Shared component for displaying stream keys with reveal/copy functionality
- * Obscures the stream key by default, showing only first 6 and last 6 characters
- * When revealed and editable, becomes an input field for editing
- */
-declare function StreamKeyDisplay({ streamKey, className, showLabel, showCopy, editable, onChange, size, layout, darkMode, }: StreamKeyDisplayProps): react_jsx_runtime.JSX.Element;
-
-interface StreamKeyInputProps {
-    onSubmit: (key: string) => void;
-    /**
-     * When true, the input fills its parent container instead of the viewport.
-     * Use this when embedding inline within a page.
-     */
-    inline?: boolean;
-}
-/**
- * Stream key input form for manual entry
- * Validates stream key format before submission
- */
-declare function StreamKeyInput({ onSubmit, inline }: StreamKeyInputProps): react_jsx_runtime.JSX.Element;
-
-/**
- * WebSocket streaming client for sending media chunks to encoder server
- * Based on prankcast reference implementation
- */
-/** Default encoder server URL */
-declare const DEFAULT_ENCODER_SERVER_URL = "https://broadcastapi.dialtribe.com";
-interface WebSocketStreamerOptions {
-    streamKey: string;
-    mediaStream: MediaStream;
-    isVideo: boolean;
-    /** Optional custom encoder server URL (defaults to DEFAULT_ENCODER_SERVER_URL) */
-    encoderServerUrl?: string;
-    onBytesUpdate?: (bytes: number) => void;
-    onStateChange?: (state: "connecting" | "live" | "stopped" | "terminated" | "error") => void;
-    onError?: (error: string) => void;
-}
-declare class WebSocketStreamer {
-    private streamKey;
-    private mediaStream;
-    private isVideo;
-    private encoderServerUrl;
-    private websocket;
-    private mediaRecorder;
-    private bytesSent;
-    private userStopped;
-    private onBytesUpdate?;
-    private onStateChange?;
-    private onError?;
-    constructor(options: WebSocketStreamerOptions);
-    /**
-     * Validate stream key format
-     * Stream keys must follow format: {tierCode}{foreignId}_{randomKey}
-     * Tier codes: a (audio shared), b (audio VIP), v (video shared), w (video VIP)
-     */
-    private validateStreamKeyFormat;
-    /**
-     * Build WebSocket URL from stream key
-     */
-    private buildWebSocketUrl;
-    /**
-     * Start streaming
-     */
-    start(): Promise<void>;
-    /**
-     * Stop streaming
-     */
-    stop(): void;
-    /**
-     * Get total bytes sent
-     */
-    getBytesSent(): number;
-    /**
-     * Update the media stream (e.g., when flipping camera)
-     * This keeps the WebSocket connection alive while swapping the media source
-     *
-     * Note: Errors are thrown to the caller, not sent to onError callback
-     * This allows the caller to handle camera flip failures gracefully
-     */
-    updateMediaStream(newMediaStream: MediaStream): Promise<void>;
-    /**
-     * Set up WebSocket event handlers
-     */
-    private setupWebSocketHandlers;
-    /**
-     * Set up MediaRecorder event handlers
-     */
-    private setupMediaRecorderHandlers;
-}
-
-/**
- * Media constraints for browser streaming
- * Based on prankcast reference implementation
- */
-interface MediaConstraintsOptions {
-    isVideo: boolean;
-    facingMode?: "user" | "environment";
-}
-declare function getMediaConstraints(options: MediaConstraintsOptions): MediaStreamConstraints;
-/**
- * MediaRecorder options for encoding
- */
-declare function getMediaRecorderOptions(isVideo: boolean): MediaRecorderOptions;
-/**
- * Check browser compatibility
- */
-declare function checkBrowserCompatibility(): {
-    compatible: boolean;
-    error?: string;
-};
-
-/**
- * Utility functions for opening broadcast streamer popup windows
- */
-interface PopupDimensions {
-    width: number;
-    height: number;
-    left: number;
-    top: number;
-}
-/**
- * Calculate optimal popup dimensions based on screen size
- * - Desktop/wider screens: 16:9 landscape ratio (e.g., 1280x720) to match modern webcams
- * - Mobile/narrower screens: 9:16 portrait ratio (e.g., 720x1280) for vertical video
- */
-declare function calculatePopupDimensions(): PopupDimensions;
-/**
- * Options for opening a broadcast streamer popup window.
- */
-interface OpenDialtribeStreamerPopupOptions {
-    /**
-     * Session token for API authentication. **Required.**
-     * The token must include `broadcasts:stream` permission.
-     * Sent securely via postMessage (not in the URL).
-     */
-    sessionToken: string;
-    /**
-     * Stream key for broadcasting. **Required for production use.**
-     * Fetch this from your backend and pass it here.
-     * The key is sent securely via postMessage (not in the URL).
-     *
-     * @example "w1_abc123def456..."
-     */
-    streamKey: string;
-    /**
-     * URL path for the streamer page. **Required.**
-     * This is the route in your app where the popup page is hosted.
-     *
-     * @example "/broadcasts/new"
-     * @example "/stream/live"
-     */
-    streamerUrl: string;
-    /** Optional app ID to include in the postMessage payload */
-    appId?: number;
-    /** Additional URL parameters to pass to the popup page */
-    additionalParams?: Record<string, string>;
-}
-/**
- * Open broadcast streamer popup window with credentials sent via postMessage
- * This is more secure than passing sensitive data in the URL
- *
- * @example
- * ```tsx
- * import { openDialtribeStreamerPopup } from '@dialtribe/react-sdk/dialtribe-streamer';
- *
- * // Open popup for live streaming
- * openDialtribeStreamerPopup({
- *   sessionToken: 'sess_xxx...',
- *   streamKey: 'w1_abc123...',
- *   streamerUrl: '/broadcasts/new',
- * });
- * ```
- *
- * @returns The popup window reference, or null if popup was blocked
- */
-declare function openDialtribeStreamerPopup(options: OpenDialtribeStreamerPopupOptions): Window | null;
-/**
- * Legacy function name for backwards compatibility
- * @deprecated Use openDialtribeStreamerPopup instead
- */
-declare const openBroadcastPopup: typeof openDialtribeStreamerPopup;
-
-/**
- * Return value from useDialtribeStreamerPopup hook.
- */
-interface UseDialtribeStreamerPopupReturn {
-    /**
-     * Session token received from parent window.
-     * Will be null until credentials are received via postMessage.
-     */
-    sessionToken: string | null;
-    /**
-     * Stream key received from parent window.
-     * Will be null until credentials are received via postMessage.
-     */
-    streamKey: string | null;
-    /**
-     * API base URL received from parent window.
-     * Defaults to empty string (uses SDK default).
-     */
-    apiBaseUrl: string;
-    /**
-     * Function to update the stream key.
-     * Pass this to DialtribeStreamer's onStreamKeyChange prop.
-     */
-    setStreamKey: React.Dispatch<React.SetStateAction<string | null>>;
-    /**
-     * True if credentials have been received from the parent window.
-     */
-    isReady: boolean;
-}
-/**
- * Hook for popup pages that receive streaming credentials via postMessage.
- *
- * Use this in your popup page component to handle the postMessage communication
- * with the parent window that opened the popup via `openDialtribeStreamerPopup()`.
- *
- * @example
- * ```tsx
- * import { DialtribeStreamer, useDialtribeStreamerPopup } from '@dialtribe/react-sdk/dialtribe-streamer';
- *
- * export default function BroadcastPopupPage() {
- *   const { sessionToken, streamKey, apiBaseUrl, setStreamKey } = useDialtribeStreamerPopup();
- *
- *   return (
- *     <DialtribeStreamer
- *       sessionToken={sessionToken}
- *       streamKey={streamKey}
- *       apiBaseUrl={apiBaseUrl}
- *       onDone={() => window.close()}
- *       onStreamKeyChange={setStreamKey}
- *     />
- *   );
- * }
- * ```
- */
-declare function useDialtribeStreamerPopup(): UseDialtribeStreamerPopupReturn;
-
-/**
- * Fallback behavior when popup is blocked by the browser.
- */
-type PopupFallbackMode = 'fullscreen' | 'newTab' | 'none';
-/**
- * Options for the useDialtribeStreamerLauncher hook.
- */
-interface UseDialtribeStreamerLauncherOptions {
-    /**
-     * Session token for API authentication.
-     */
-    sessionToken: string | null;
-    /**
-     * Stream key for broadcasting.
-     */
-    streamKey: string;
-    /**
-     * URL path for the streamer page (e.g., '/broadcasts/new').
-     */
-    streamerUrl: string;
-    /**
-     * API base URL for the streamer.
-     */
-    apiBaseUrl?: string;
-    /**
-     * What to do if the popup is blocked by the browser.
-     * - 'fullscreen': Show a fullscreen overlay in the current page
-     * - 'newTab': Open in a new browser tab (less likely to be blocked)
-     * - 'none': Do nothing, let the caller handle it
-     *
-     * @default 'fullscreen'
-     */
-    fallback?: PopupFallbackMode;
-    /**
-     * Callback when popup is blocked (called regardless of fallback mode).
-     */
-    onPopupBlocked?: () => void;
-    /**
-     * Callback when streaming ends (from fullscreen fallback mode).
-     */
-    onDone?: () => void;
-    /**
-     * Callback when stream key changes (from fallback streamer).
-     */
-    onStreamKeyChange?: (key: string) => void;
-}
-/**
- * Return value from useDialtribeStreamerLauncher hook.
- */
-interface UseDialtribeStreamerLauncherReturn {
-    /**
-     * Launch the streamer. Tries popup first, falls back if blocked.
-     */
-    launch: () => void;
-    /**
-     * Portal component that renders the fallback overlay.
-     * Include this once in your JSX - it renders via portal to document.body.
-     *
-     * @example
-     * ```tsx
-     * const { launch, Fallback } = useDialtribeStreamerLauncher({...});
-     * return (
-     *   <>
-     *     <button onClick={launch}>Start</button>
-     *     <Fallback />
-     *   </>
-     * );
-     * ```
-     */
-    Fallback: React$1.FC;
-    /**
-     * Whether the fallback fullscreen overlay is currently shown.
-     * Use this for custom fallback rendering.
-     */
-    showFallback: boolean;
-    /**
-     * Close the fallback overlay.
-     * Use this for custom fallback rendering.
-     */
-    closeFallback: () => void;
-    /**
-     * Reference to the popup window (if successfully opened).
-     */
-    popupRef: Window | null;
-    /**
-     * Whether the last launch attempt was blocked.
-     */
-    wasBlocked: boolean;
-}
-/**
- * Hook for launching the DialtribeStreamer with automatic popup fallback.
- *
- * This hook tries to open the streamer in a popup window first. If the popup
- * is blocked by the browser, it automatically falls back to a fullscreen
- * overlay or new tab (configurable).
- *
- * @example
- * ```tsx
- * import { useDialtribeStreamerLauncher } from '@dialtribe/react-sdk/dialtribe-streamer';
- *
- * function StreamButton({ sessionToken, streamKey }: Props) {
- *   const { launch, Fallback } = useDialtribeStreamerLauncher({
- *     sessionToken,
- *     streamKey,
- *     streamerUrl: '/broadcasts/new',
- *     fallback: 'fullscreen',
- *   });
- *
- *   return (
- *     <>
- *       <button onClick={launch}>Start Streaming</button>
- *       <Fallback />
- *     </>
- *   );
- * }
- * ```
- */
-declare function useDialtribeStreamerLauncher(options: UseDialtribeStreamerLauncherOptions): UseDialtribeStreamerLauncherReturn;
-
-export { DEFAULT_ENCODER_SERVER_URL, DialtribeStreamer, type DialtribeStreamerProps, type MediaConstraintsOptions, type OpenDialtribeStreamerPopupOptions, type PopupDimensions, type PopupFallbackMode, StreamKeyDisplay, type StreamKeyDisplayProps, StreamKeyInput, type StreamKeyInputProps, type StreamingControlState, StreamingControls, type StreamingControlsProps, StreamingPreview, type StreamingPreviewProps, type UseDialtribeStreamerLauncherOptions, type UseDialtribeStreamerLauncherReturn, type UseDialtribeStreamerPopupReturn, WebSocketStreamer, type WebSocketStreamerOptions, calculatePopupDimensions, checkBrowserCompatibility, getMediaConstraints, getMediaRecorderOptions, openBroadcastPopup, openDialtribeStreamerPopup, useDialtribeStreamerLauncher, useDialtribeStreamerPopup };
+export { A as ApiClientConfig, h as AudioWaveform, B as Broadcast, C as CDN_DOMAIN, d as DIALTRIBE_API_BASE, c as DialtribeClient, a as DialtribeContextValue, i as DialtribeOverlay, k as DialtribeOverlayMode, j as DialtribeOverlayProps, e as DialtribePlayer, g as DialtribePlayerErrorBoundary, f as DialtribePlayerProps, D as DialtribeProvider, b as DialtribeProviderProps, E as ENDPOINTS, H as HTTP_STATUS, q as HttpStatusCode, L as LoadingSpinner, m as TranscriptData, l as TranscriptSegment, T as TranscriptWord, o as buildBroadcastCdnUrl, p as buildBroadcastS3KeyPrefix, n as formatTime, u as useDialtribe, r as useDialtribeOptional } from './dialtribe-player-CNriUtNi.mjs';
+export { j as DEFAULT_ENCODER_SERVER_URL, D as DialtribeStreamer, a as DialtribeStreamerProps, M as MediaConstraintsOptions, O as OpenDialtribeStreamerPopupOptions, P as PopupDimensions, w as PopupFallbackMode, f as StreamKeyDisplay, g as StreamKeyDisplayProps, h as StreamKeyInput, i as StreamKeyInputProps, e as StreamingControlState, c as StreamingControls, d as StreamingControlsProps, S as StreamingPreview, b as StreamingPreviewProps, t as UseDialtribeStreamerLauncherOptions, v as UseDialtribeStreamerLauncherReturn, U as UseDialtribeStreamerPopupReturn, W as WebSocketStreamer, k as WebSocketStreamerOptions, r as calculatePopupDimensions, o as checkBrowserCompatibility, m as getMediaConstraints, n as getMediaRecorderOptions, q as openBroadcastPopup, p as openDialtribeStreamerPopup, s as useDialtribeStreamerLauncher, u as useDialtribeStreamerPopup } from './dialtribe-streamer-Bc17hH6o.mjs';
+import 'react/jsx-runtime';
+import 'react';