@remotion/player/.rollup.cache/Users/jonathanburger/remotion/packages/player/dist/esm/SharedPlayerContext.js

React component for embedding a Remotion preview into your app

import { jsx as _jsx } from "react/jsx-runtime";
import { useCallback, useMemo, useState } from 'react';
import { Internals } from 'remotion';
import { getPreferredVolume, persistVolume } from './volume-persistance.js';
export const PLAYER_COMP_ID = 'player-comp';
export const SharedPlayerContexts = ({ children, timelineContext, fps, compositionHeight, compositionWidth, durationInFrames, component, numberOfSharedAudioTags, initiallyMuted, }) => {
    const compositionManagerContext = useMemo(() => {
        const context = {
            compositions: [
                {
                    component: component,
                    durationInFrames,
                    height: compositionHeight,
                    width: compositionWidth,
                    fps,
                    id: PLAYER_COMP_ID,
                    nonce: 777,
                    folderName: null,
                    parentFolderName: null,
                    schema: null,
                    calculateMetadata: null,
                },
            ],
            folders: [],
            registerFolder: () => undefined,
            unregisterFolder: () => undefined,
            registerComposition: () => undefined,
            unregisterComposition: () => undefined,
            currentCompositionMetadata: null,
            setCurrentCompositionMetadata: () => undefined,
            canvasContent: { type: 'composition', compositionId: 'player-comp' },
            setCanvasContent: () => undefined,
        };
        return context;
    }, [component, durationInFrames, compositionHeight, compositionWidth, fps]);
    const [mediaMuted, setMediaMuted] = useState(() => initiallyMuted);
    const [mediaVolume, setMediaVolume] = useState(() => getPreferredVolume());
    const mediaVolumeContextValue = useMemo(() => {
        return {
            mediaMuted,
            mediaVolume,
        };
    }, [mediaMuted, mediaVolume]);
    const setMediaVolumeAndPersist = useCallback((vol) => {
        setMediaVolume(vol);
        persistVolume(vol);
    }, []);
    const setMediaVolumeContextValue = useMemo(() => {
        return {
            setMediaMuted,
            setMediaVolume: setMediaVolumeAndPersist,
        };
    }, [setMediaVolumeAndPersist]);
    return (_jsx(Internals.CanUseRemotionHooksProvider, { children: _jsx(Internals.Timeline.TimelineContext.Provider, { value: timelineContext, children: _jsx(Internals.CompositionManager.Provider, { value: compositionManagerContext, children: _jsx(Internals.ResolveCompositionConfig, { children: _jsx(Internals.PrefetchProvider, { children: _jsx(Internals.DurationsContextProvider, { children: _jsx(Internals.MediaVolumeContext.Provider, { value: mediaVolumeContextValue, children: _jsx(Internals.NativeLayersProvider, { children: _jsx(Internals.SetMediaVolumeContext.Provider, { value: setMediaVolumeContextValue, children: _jsx(Internals.SharedAudioContextProvider, { numberOfAudioTags: numberOfSharedAudioTags, component: component, children: _jsx(Internals.BufferingProvider, { children: children }) }) }) }) }) }) }) }) }) }) }));
};