MediaSFU ReactJS
    Preparing search index...

    Interface BackgroundModalOptions

    interface BackgroundModalOptions {
        isVisible: boolean;
        onClose: () => void;
        parameters: BackgroundModalParameters;
        position?: string;
        backgroundColor?: string;
        title?: ReactNode;
        overlayProps?: HTMLAttributes<HTMLDivElement>;
        contentProps?: HTMLAttributes<HTMLDivElement>;
        headerProps?: HTMLAttributes<HTMLDivElement>;
        titleProps?: HTMLAttributes<HTMLHeadingElement>;
        closeButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
        closeIconComponent?: ReactNode;
        headerDividerProps?: HTMLAttributes<HTMLHRElement>;
        bodyProps?: HTMLAttributes<HTMLDivElement>;
        defaultImagesContainerProps?: HTMLAttributes<HTMLDivElement>;
        uploadWrapperProps?: HTMLAttributes<HTMLDivElement>;
        uploadLabelProps?: LabelHTMLAttributes<HTMLLabelElement>;
        uploadLabel?: ReactNode;
        uploadInputProps?: InputHTMLAttributes<HTMLInputElement>;
        mainCanvasProps?: CanvasHTMLAttributes<HTMLCanvasElement>;
        backgroundCanvasProps?: CanvasHTMLAttributes<HTMLCanvasElement>;
        captureVideoProps?: VideoHTMLAttributes<HTMLVideoElement>;
        previewVideoProps?: VideoHTMLAttributes<HTMLVideoElement>;
        loadingOverlayProps?: HTMLAttributes<HTMLDivElement>;
        loadingSpinner?: ReactNode;
        buttonsWrapperProps?: HTMLAttributes<HTMLDivElement>;
        applyButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
        saveButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
        applyButtonLabel?: string;
        applyButtonAppliedLabel?: string;
        saveButtonLabel?: string;
        renderHeader?: (
            options: { defaultHeader: ReactNode; onClose: () => void },
        ) => ReactNode;
        renderButtons?: (
            options: {
                defaultButtons: ReactNode;
                applyButtonRef: RefObject<HTMLButtonElement | null>;
                saveButtonRef: RefObject<HTMLButtonElement | null>;
            },
        ) => ReactNode;
        renderBody?: (options: { defaultBody: ReactNode }) => ReactNode;
        renderContent?: (options: { defaultContent: ReactNode }) => ReactNode;
        isDarkMode?: boolean;
        enableGlassmorphism?: boolean;
        renderMode?: ModalRenderMode;
    }
    Index

    Properties

    isVisible: boolean
    onClose: () => void
    position?: string
    backgroundColor?: string
    title?: ReactNode
    overlayProps?: HTMLAttributes<HTMLDivElement>
    contentProps?: HTMLAttributes<HTMLDivElement>
    headerProps?: HTMLAttributes<HTMLDivElement>
    titleProps?: HTMLAttributes<HTMLHeadingElement>
    closeButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>
    closeIconComponent?: ReactNode
    headerDividerProps?: HTMLAttributes<HTMLHRElement>
    bodyProps?: HTMLAttributes<HTMLDivElement>
    defaultImagesContainerProps?: HTMLAttributes<HTMLDivElement>
    uploadWrapperProps?: HTMLAttributes<HTMLDivElement>
    uploadLabelProps?: LabelHTMLAttributes<HTMLLabelElement>
    uploadLabel?: ReactNode
    uploadInputProps?: InputHTMLAttributes<HTMLInputElement>
    mainCanvasProps?: CanvasHTMLAttributes<HTMLCanvasElement>
    backgroundCanvasProps?: CanvasHTMLAttributes<HTMLCanvasElement>
    captureVideoProps?: VideoHTMLAttributes<HTMLVideoElement>
    previewVideoProps?: VideoHTMLAttributes<HTMLVideoElement>
    loadingOverlayProps?: HTMLAttributes<HTMLDivElement>
    loadingSpinner?: ReactNode
    buttonsWrapperProps?: HTMLAttributes<HTMLDivElement>
    applyButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>
    saveButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>
    applyButtonLabel?: string
    applyButtonAppliedLabel?: string
    saveButtonLabel?: string
    renderHeader?: (
        options: { defaultHeader: ReactNode; onClose: () => void },
    ) => ReactNode
    renderButtons?: (
        options: {
            defaultButtons: ReactNode;
            applyButtonRef: RefObject<HTMLButtonElement | null>;
            saveButtonRef: RefObject<HTMLButtonElement | null>;
        },
    ) => ReactNode
    renderBody?: (options: { defaultBody: ReactNode }) => ReactNode
    renderContent?: (options: { defaultContent: ReactNode }) => ReactNode
    isDarkMode?: boolean

    Theme control - whether dark mode is active

    enableGlassmorphism?: boolean

    Enable glassmorphism effects (modern UI)

    renderMode?: ModalRenderMode

    Render mode: modal (default overlay), sidebar (inline for desktop), inline (no wrapper)