Hiyve Components - v1.0.0
    Preparing search index...

    Interface DevicePreviewProps

    Props for DevicePreview component

    interface DevicePreviewProps {
        audioDeviceId?: string;
        colors?: Partial<DevicePreviewColors>;
        height?: string | number;
        labels?: Partial<DevicePreviewLabels>;
        onDeviceChange?: (devices: SelectedDevices) => void;
        onError?: (error: Error) => void;
        onReady?: () => void;
        persistSelection?: boolean | DevicePersistenceConfig;
        readyButtonLabel?: string;
        renderProps?: DevicePreviewRenderProps;
        selectorIcons?: Partial<DeviceSelectorIcons>;
        selectorLabels?: Partial<DeviceSelectorLabels>;
        showAudioLevel?: boolean;
        showAudioOutput?: boolean;
        showControls?: boolean;
        showRefreshButton?: boolean;
        showVideo?: boolean;
        styles?: Partial<DevicePreviewStyles>;
        sx?: SxProps<Theme>;
        videoDeviceId?: string;
        width?: string | number;
    }
    Index

    Properties

    audioDeviceId? colors? height? labels? onDeviceChange? onError? onReady? persistSelection? readyButtonLabel? renderProps? selectorIcons? selectorLabels? showAudioLevel? showAudioOutput? showControls? showRefreshButton? showVideo? styles? sx? videoDeviceId? width?

    Properties

    audioDeviceId?: string

    Selected audio device ID

    colors?: Partial<DevicePreviewColors>

    Custom colors

    height?: string | number

    Height of the preview (default: 300)

    labels?: Partial<DevicePreviewLabels>

    Custom labels for i18n support

    onDeviceChange?: (devices: SelectedDevices) => void

    Callback when devices change

    onError?: (error: Error) => void

    Callback when an error occurs during device enumeration or selection

    onReady?: () => void

    Callback when user is ready to join

    persistSelection?: boolean | DevicePersistenceConfig

    Enable persistence of device selections to localStorage. When enabled, selections are saved automatically and restored on mount.

    • Pass true to enable with default storage key ('hiyve-selected-devices')
    • Pass a config object to customize the storage key
    // Enable with defaults
    <DevicePreview persistSelection onReady={handleJoin} />

    // Custom storage key
    <DevicePreview
      persistSelection={{ storageKey: 'my-app-devices' }}
      onReady={handleJoin}
    />
    readyButtonLabel?: string

    Label for the ready button (default: 'Join') - deprecated, use labels.readyButton

    renderProps?: DevicePreviewRenderProps

    Render props for advanced customization

    selectorIcons?: Partial<DeviceSelectorIcons>

    Icons to pass to nested DeviceSelector

    selectorLabels?: Partial<DeviceSelectorLabels>

    Labels to pass to nested DeviceSelector

    showAudioLevel?: boolean

    Show audio level indicator (default: true)

    showAudioOutput?: boolean

    Show the audio output device selector.

    false (DevicePreview focuses on camera/mic, use DeviceSelector directly for full control)
    showControls?: boolean

    Show device selector controls (default: true)

    showRefreshButton?: boolean

    Show the refresh button to re-enumerate devices.

    true
    showVideo?: boolean

    Show video preview (default: true)

    styles?: Partial<DevicePreviewStyles>

    Custom styles

    sx?: SxProps<Theme>

    MUI sx styling prop

    videoDeviceId?: string

    Selected video device ID

    width?: string | number

    Width of the preview (default: 400)

    Settings

    Member Visibility

    On This Page

    Properties