src/anims/VideoSplash.tsx

import React from 'react';
import { TransitionImplementationProps } from 'remotion-transition-series/lib/components/Transition';
import { OffthreadVideo, Video, staticFile } from 'remotion'
import { z } from "zod";

export const VideoSplash:
  React.FC<z.infer<typeof VideoSplashSchema>> = (props) => {

    let {
      file,
      durationInFrames,
    } = props
    return (
      <div
        style={{
          width: '100%',
          height: '100%',
          position: 'absolute',
          left: 0,
          top: 0,
          right: 0,
          bottom: 0,
        }}
      >

        <Video  {...props} playbackRate={1}
          volume={0} style={{
            position: 'absolute',
            height: '100%', width: '100%',
          }}
          src={staticFile((file || 'assets/effects/effect_zipper.webm'))} />

      </div>
    );
  };



export const VideoSplashSchema = z.object({
  file: z.string(),
  durationInFrames: z.number().optional(),
  style: z.any()
});