clawbot/skills/remotion-prompt-video/node_modules/remotion/dist/cjs/Composition.js

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Composition = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const react_dom_1 = require("react-dom");
const CanUseRemotionHooks_js_1 = require("./CanUseRemotionHooks.js");
const CompositionManagerContext_js_1 = require("./CompositionManagerContext.js");
const Folder_js_1 = require("./Folder.js");
const ResolveCompositionConfig_js_1 = require("./ResolveCompositionConfig.js");
const input_props_serialization_js_1 = require("./input-props-serialization.js");
const is_player_js_1 = require("./is-player.js");
const loading_indicator_js_1 = require("./loading-indicator.js");
const nonce_js_1 = require("./nonce.js");
const portal_node_js_1 = require("./portal-node.js");
const use_delay_render_js_1 = require("./use-delay-render.js");
const use_lazy_component_js_1 = require("./use-lazy-component.js");
const use_remotion_environment_js_1 = require("./use-remotion-environment.js");
const use_video_js_1 = require("./use-video.js");
const validate_composition_id_js_1 = require("./validation/validate-composition-id.js");
const validate_default_props_js_1 = require("./validation/validate-default-props.js");
const Fallback = () => {
    const { continueRender, delayRender } = (0, use_delay_render_js_1.useDelayRender)();
    (0, react_1.useEffect)(() => {
        const fallback = delayRender('Waiting for Root component to unsuspend');
        return () => continueRender(fallback);
    }, [continueRender, delayRender]);
    return null;
};
const InnerComposition = ({ width, height, fps, durationInFrames, id, defaultProps, schema, ...compProps }) => {
    var _a, _b, _c;
    const compManager = (0, react_1.useContext)(CompositionManagerContext_js_1.CompositionSetters);
    const { registerComposition, unregisterComposition } = compManager;
    const video = (0, use_video_js_1.useVideo)();
    const lazy = (0, use_lazy_component_js_1.useLazyComponent)({
        compProps: compProps,
        componentName: 'Composition',
        noSuspense: false,
    });
    const nonce = (0, nonce_js_1.useNonce)();
    const isPlayer = (0, is_player_js_1.useIsPlayer)();
    const environment = (0, use_remotion_environment_js_1.useRemotionEnvironment)();
    const canUseComposition = (0, react_1.useContext)(CanUseRemotionHooks_js_1.CanUseRemotionHooks);
    // Record seen composition IDs as early as possible so that overlays can access them
    if (typeof window !== 'undefined') {
        window.remotion_seenCompositionIds = Array.from(new Set([...((_a = window.remotion_seenCompositionIds) !== null && _a !== void 0 ? _a : []), id]));
    }
    if (canUseComposition) {
        if (isPlayer) {
            throw new Error('<Composition> was mounted inside the `component` that was passed to the <Player>. See https://remotion.dev/docs/wrong-composition-mount for help.');
        }
        throw new Error('<Composition> mounted inside another composition. See https://remotion.dev/docs/wrong-composition-mount for help.');
    }
    const { folderName, parentName } = (0, react_1.useContext)(Folder_js_1.FolderContext);
    (0, react_1.useEffect)(() => {
        var _a;
        // Ensure it's a URL safe id
        if (!id) {
            throw new Error('No id for composition passed.');
        }
        (0, validate_composition_id_js_1.validateCompositionId)(id);
        (0, validate_default_props_js_1.validateDefaultAndInputProps)(defaultProps, 'defaultProps', id);
        registerComposition({
            durationInFrames: durationInFrames !== null && durationInFrames !== void 0 ? durationInFrames : undefined,
            fps: fps !== null && fps !== void 0 ? fps : undefined,
            height: height !== null && height !== void 0 ? height : undefined,
            width: width !== null && width !== void 0 ? width : undefined,
            id,
            folderName,
            component: lazy,
            defaultProps: (0, input_props_serialization_js_1.serializeThenDeserializeInStudio)((defaultProps !== null && defaultProps !== void 0 ? defaultProps : {})),
            nonce,
            parentFolderName: parentName,
            schema: schema !== null && schema !== void 0 ? schema : null,
            calculateMetadata: (_a = compProps.calculateMetadata) !== null && _a !== void 0 ? _a : null,
        });
        return () => {
            unregisterComposition(id);
        };
    }, [
        durationInFrames,
        fps,
        height,
        lazy,
        id,
        folderName,
        defaultProps,
        width,
        nonce,
        parentName,
        schema,
        compProps.calculateMetadata,
        registerComposition,
        unregisterComposition,
    ]);
    (0, react_1.useEffect)(() => {
        window.dispatchEvent(new CustomEvent(ResolveCompositionConfig_js_1.PROPS_UPDATED_EXTERNALLY, {
            detail: {
                resetUnsaved: id,
            },
        }));
    }, [defaultProps, id]);
    const resolved = (0, ResolveCompositionConfig_js_1.useResolvedVideoConfig)(id);
    if (environment.isStudio &&
        video &&
        video.component === lazy &&
        video.id === id) {
        const Comp = lazy;
        if (resolved === null ||
            (resolved.type !== 'success' &&
                resolved.type !== 'success-and-refreshing')) {
            return null;
        }
        return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(CanUseRemotionHooks_js_1.CanUseRemotionHooksProvider, { children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(loading_indicator_js_1.Loading, {}), children: (0, jsx_runtime_1.jsx)(Comp, { ...((_b = resolved.result.props) !== null && _b !== void 0 ? _b : {}) }) }) }), (0, portal_node_js_1.portalNode)());
    }
    if (environment.isRendering &&
        video &&
        video.component === lazy &&
        video.id === id) {
        const Comp = lazy;
        if (resolved === null ||
            (resolved.type !== 'success' &&
                resolved.type !== 'success-and-refreshing')) {
            return null;
        }
        return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(CanUseRemotionHooks_js_1.CanUseRemotionHooksProvider, { children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(Fallback, {}), children: (0, jsx_runtime_1.jsx)(Comp, { ...((_c = resolved.result.props) !== null && _c !== void 0 ? _c : {}) }) }) }), (0, portal_node_js_1.portalNode)());
    }
    return null;
};
/*
 * @description This component is used to register a video to make it renderable and make it show in the sidebar, in dev mode.
 * @see [Documentation](https://remotion.dev/docs/composition)
 */
const Composition = (props) => {
    const { onlyRenderComposition } = (0, react_1.useContext)(CompositionManagerContext_js_1.CompositionSetters);
    if (onlyRenderComposition && onlyRenderComposition !== props.id) {
        return null;
    }
    // @ts-expect-error
    return (0, jsx_runtime_1.jsx)(InnerComposition, { ...props });
};
exports.Composition = Composition;