@remotion/player 4.0.233 → 4.0.235

package/dist/cjs/PlayerUI.js

@@ -29,6 +29,7 @@ const remotion_1 = require("remotion");
 const PlayerControls_js_1 = require("./PlayerControls.js");
 const calculate_scale_js_1 = require("./calculate-scale.js");
 const error_boundary_js_1 = require("./error-boundary.js");
+const license_blacklist_js_1 = require("./license-blacklist.js");
 const player_css_classname_js_1 = require("./player-css-classname.js");
 const use_playback_js_1 = require("./use-playback.js");
 const use_player_js_1 = require("./use-player.js");
@@ -417,11 +418,11 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
             showPosterWhenBuffering && showBufferIndicator && player.isPlaying(),
         ].some(Boolean);
     const { left, top, width, height, ...outerWithoutScale } = outer;
-    const content = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { style: outer, onPointerDown: clickToPlay ? handlePointerDown : undefined, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined, children: (0, jsx_runtime_1.jsxs)("div", { style: containerStyle, className: (0, player_css_classname_js_1.playerCssClassname)(overrideInternalClassName), children: [VideoComponent ? ((0, jsx_runtime_1.jsx)(error_boundary_js_1.ErrorBoundary, { onError: onError, errorFallback: errorFallback, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CurrentScaleContext.Provider, { value: currentScale, children: (0, jsx_runtime_1.jsx)(VideoComponent, { ...((_c = video === null || video === void 0 ? void 0 : video.props) !== null && _c !== void 0 ? _c : {}), ...(inputProps !== null && inputProps !== void 0 ? inputProps : {}) }) }) })) : null, shouldShowPoster && posterFillMode === 'composition-size' ? ((0, jsx_runtime_1.jsx)("div", { style: {
-                                ...outerWithoutScale,
-                                width: config.width,
-                                height: config.height,
-                            }, onPointerDown: clickToPlay ? handlePointerDown : undefined, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined, children: poster })) : null] }) }), shouldShowPoster && posterFillMode === 'player-size' ? ((0, jsx_runtime_1.jsx)("div", { style: outer, onPointerDown: clickToPlay ? handlePointerDown : undefined, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined, children: poster })) : null, controls ? ((0, jsx_runtime_1.jsx)(PlayerControls_js_1.Controls, { fps: config.fps, playing: player.playing, toggle: player.toggle, durationInFrames: config.durationInFrames, containerRef: container, onFullscreenButtonClick: onFullscreenButtonClick, isFullscreen: isFullscreen, allowFullscreen: allowFullscreen, showVolumeControls: showVolumeControls, onExitFullscreenButtonClick: onExitFullscreenButtonClick, spaceKeyToPlayOrPause: spaceKeyToPlayOrPause, onSeekEnd: onSeekEnd, onSeekStart: onSeekStart, inFrame: inFrame, outFrame: outFrame, initiallyShowControls: initiallyShowControls, canvasSize: canvasSize, renderFullscreenButton: renderFullscreenButton, renderPlayPauseButton: renderPlayPauseButton, alwaysShowControls: alwaysShowControls, showPlaybackRateControl: showPlaybackRateControl, buffering: showBufferIndicator, hideControlsWhenPointerDoesntMove: hideControlsWhenPointerDoesntMove, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined, onPointerDown: clickToPlay
+    const content = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { style: outer, onPointerDown: clickToPlay ? handlePointerDown : undefined, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined, children: [(0, jsx_runtime_1.jsxs)("div", { style: containerStyle, className: (0, player_css_classname_js_1.playerCssClassname)(overrideInternalClassName), children: [VideoComponent ? ((0, jsx_runtime_1.jsx)(error_boundary_js_1.ErrorBoundary, { onError: onError, errorFallback: errorFallback, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CurrentScaleContext.Provider, { value: currentScale, children: (0, jsx_runtime_1.jsx)(VideoComponent, { ...((_c = video === null || video === void 0 ? void 0 : video.props) !== null && _c !== void 0 ? _c : {}), ...(inputProps !== null && inputProps !== void 0 ? inputProps : {}) }) }) })) : null, shouldShowPoster && posterFillMode === 'composition-size' ? ((0, jsx_runtime_1.jsx)("div", { style: {
+                                    ...outerWithoutScale,
+                                    width: config.width,
+                                    height: config.height,
+                                }, onPointerDown: clickToPlay ? handlePointerDown : undefined, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined, children: poster })) : null] }), (0, jsx_runtime_1.jsx)(license_blacklist_js_1.RenderWarningIfBlacklist, {})] }), shouldShowPoster && posterFillMode === 'player-size' ? ((0, jsx_runtime_1.jsx)("div", { style: outer, onPointerDown: clickToPlay ? handlePointerDown : undefined, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined, children: poster })) : null, controls ? ((0, jsx_runtime_1.jsx)(PlayerControls_js_1.Controls, { fps: config.fps, playing: player.playing, toggle: player.toggle, durationInFrames: config.durationInFrames, containerRef: container, onFullscreenButtonClick: onFullscreenButtonClick, isFullscreen: isFullscreen, allowFullscreen: allowFullscreen, showVolumeControls: showVolumeControls, onExitFullscreenButtonClick: onExitFullscreenButtonClick, spaceKeyToPlayOrPause: spaceKeyToPlayOrPause, onSeekEnd: onSeekEnd, onSeekStart: onSeekStart, inFrame: inFrame, outFrame: outFrame, initiallyShowControls: initiallyShowControls, canvasSize: canvasSize, renderFullscreenButton: renderFullscreenButton, renderPlayPauseButton: renderPlayPauseButton, alwaysShowControls: alwaysShowControls, showPlaybackRateControl: showPlaybackRateControl, buffering: showBufferIndicator, hideControlsWhenPointerDoesntMove: hideControlsWhenPointerDoesntMove, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined, onPointerDown: clickToPlay
                     ? handlePointerDown
                     : undefined, renderMuteButton: renderMuteButton, renderVolumeSlider: renderVolumeSlider })) : null] }));
     if (is_node_js_1.IS_NODE && !doesReactVersionSupportSuspense) {

package/dist/cjs/error-boundary.d.ts

@@ -15,5 +15,5 @@ export declare class ErrorBoundary extends React.Component<{
         hasError: Error;
     };
     componentDidCatch(error: Error): void;
-    render(): string | number | boolean | import("react/jsx-runtime").JSX.Element | Iterable<React.ReactNode> | null | undefined;
+    render(): string | number | boolean | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined;
 }

package/dist/cjs/license-blacklist.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const getHashOfDomain: () => Promise<string | null>;
+export declare const RenderWarningIfBlacklist: React.FC;

package/dist/cjs/license-blacklist.js

@@ -0,0 +1,86 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RenderWarningIfBlacklist = exports.getHashOfDomain = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const getHashOfDomain = async () => {
+    if (typeof window === 'undefined') {
+        return null;
+    }
+    if (typeof window.crypto === 'undefined') {
+        return null;
+    }
+    if (typeof window.crypto.subtle === 'undefined') {
+        return null;
+    }
+    try {
+        const hashBuffer = await crypto.subtle.digest('SHA-256', new TextEncoder().encode(window.location.hostname));
+        return Array.from(new Uint8Array(hashBuffer))
+            .map((b) => b.toString(16).padStart(2, '0'))
+            .join('');
+    }
+    catch (_a) {
+        return null;
+    }
+};
+exports.getHashOfDomain = getHashOfDomain;
+const style = {
+    backgroundColor: 'red',
+    position: 'absolute',
+    padding: 12,
+    fontFamily: 'Arial',
+};
+const DOMAIN_BLACKLIST = [
+    '28d262b44cc61fa750f1686b16ad0604dabfe193fbc263eec05c89b7ad4c2cd6',
+    '4db1b0a94be33165dfefcb3ba03d04c7a2666dd27c496d3dc9fa41858e94925e',
+    'fbc48530bbf245da790f63675e84e06bab38c3b114fab07eb350025119922bdc',
+    '7baf10a8932757b1b3a22b3fce10a048747ac2f8eaf638603487e3705b07eb83',
+    '8a6c21a598d8c667272b5207c051b85997bf5b45d5fb712378be3f27cd72c6a6',
+    'a2f7aaac9c50a9255e7fc376110c4e0bfe153722dc66ed3c5d3bf2a135f65518',
+];
+let ran = false;
+const RenderWarningIfBlacklist = () => {
+    const [unlicensed, setUnlicensed] = react_1.default.useState(false);
+    (0, react_1.useEffect)(() => {
+        // Prevent firing twice in strict mode
+        if (ran) {
+            return;
+        }
+        ran = true;
+        (0, exports.getHashOfDomain)()
+            .then((hash) => {
+            if (hash && DOMAIN_BLACKLIST.includes(hash)) {
+                setUnlicensed(true);
+            }
+        })
+            .catch(() => { });
+    }, []);
+    if (!unlicensed) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)("div", { style: style, children: (0, jsx_runtime_1.jsx)("a", { style: { color: 'white' }, href: "https://github.com/remotion-dev/remotion/pull/4589", children: "Remotion Unlicensed \u2013 Contact hi@remotion.dev" }) }));
+};
+exports.RenderWarningIfBlacklist = RenderWarningIfBlacklist;

package/dist/esm/index.mjs

@@ -1136,7 +1136,7 @@ var useElementSize = (ref, options) => {
 // src/Player.tsx
 import {
   forwardRef as forwardRef2,
-  useEffect as useEffect13,
+  useEffect as useEffect14,
   useImperativeHandle as useImperativeHandle2,
   useLayoutEffect,
   useMemo as useMemo14,
@@ -1146,12 +1146,12 @@ import {
 import { Composition, Internals as Internals13 } from "remotion";
 
 // src/PlayerUI.tsx
-import React9, {
+import React10, {
   Suspense,
   forwardRef,
   useCallback as useCallback11,
   useContext as useContext6,
-  useEffect as useEffect12,
+  useEffect as useEffect13,
   useImperativeHandle,
   useMemo as useMemo12,
   useRef as useRef10,
@@ -2151,6 +2151,68 @@ class ErrorBoundary extends React8.Component {
   }
 }
 
+// src/license-blacklist.tsx
+import React9, { useEffect as useEffect12 } from "react";
+import { jsx as jsx11 } from "react/jsx-runtime";
+var getHashOfDomain = async () => {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  if (typeof window.crypto === "undefined") {
+    return null;
+  }
+  if (typeof window.crypto.subtle === "undefined") {
+    return null;
+  }
+  try {
+    const hashBuffer = await crypto.subtle.digest("SHA-256", new TextEncoder().encode(window.location.hostname));
+    return Array.from(new Uint8Array(hashBuffer)).map((b) => b.toString(16).padStart(2, "0")).join("");
+  } catch {
+    return null;
+  }
+};
+var style = {
+  backgroundColor: "red",
+  position: "absolute",
+  padding: 12,
+  fontFamily: "Arial"
+};
+var DOMAIN_BLACKLIST = [
+  "28d262b44cc61fa750f1686b16ad0604dabfe193fbc263eec05c89b7ad4c2cd6",
+  "4db1b0a94be33165dfefcb3ba03d04c7a2666dd27c496d3dc9fa41858e94925e",
+  "fbc48530bbf245da790f63675e84e06bab38c3b114fab07eb350025119922bdc",
+  "7baf10a8932757b1b3a22b3fce10a048747ac2f8eaf638603487e3705b07eb83",
+  "8a6c21a598d8c667272b5207c051b85997bf5b45d5fb712378be3f27cd72c6a6",
+  "a2f7aaac9c50a9255e7fc376110c4e0bfe153722dc66ed3c5d3bf2a135f65518"
+];
+var ran = false;
+var RenderWarningIfBlacklist = () => {
+  const [unlicensed, setUnlicensed] = React9.useState(false);
+  useEffect12(() => {
+    if (ran) {
+      return;
+    }
+    ran = true;
+    getHashOfDomain().then((hash) => {
+      if (hash && DOMAIN_BLACKLIST.includes(hash)) {
+        setUnlicensed(true);
+      }
+    }).catch(() => {
+    });
+  }, []);
+  if (!unlicensed) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx11("div", {
+    style,
+    children: /* @__PURE__ */ jsx11("a", {
+      style: { color: "white" },
+      href: "https://github.com/remotion-dev/remotion/pull/4589",
+      children: "Remotion Unlicensed – Contact hi@remotion.dev"
+    })
+  });
+};
+
 // src/player-css-classname.ts
 var playerCssClassname = (override) => {
   return override ?? "__remotion-player";
@@ -2252,15 +2314,15 @@ var useClickPreventionOnDoubleClick = (onClick, onDoubleClick, doubleClickToFull
 };
 
 // src/PlayerUI.tsx
-import { jsx as jsx11, jsxs as jsxs9, Fragment as Fragment3 } from "react/jsx-runtime";
-var reactVersion = React9.version.split(".")[0];
+import { jsx as jsx12, jsxs as jsxs9, Fragment as Fragment3 } from "react/jsx-runtime";
+var reactVersion = React10.version.split(".")[0];
 if (reactVersion === "0") {
   throw new Error(`Version ${reactVersion} of "react" is not supported by Remotion`);
 }
 var doesReactVersionSupportSuspense = parseInt(reactVersion, 10) >= 18;
 var PlayerUI = ({
   controls,
-  style,
+  style: style2,
   loop,
   autoPlay,
   allowFullscreen,
@@ -2323,13 +2385,13 @@ var PlayerUI = ({
     getCurrentFrame: player.getCurrentFrame,
     browserMediaControlsBehavior
   });
-  useEffect12(() => {
+  useEffect13(() => {
     if (hasPausedToResume && !player.playing) {
       setHasPausedToResume(false);
       player.play();
     }
   }, [hasPausedToResume, player]);
-  useEffect12(() => {
+  useEffect13(() => {
     const { current } = container;
     if (!current) {
       return;
@@ -2371,7 +2433,7 @@ var PlayerUI = ({
       document.exitFullscreen();
     }
   }, []);
-  useEffect12(() => {
+  useEffect13(() => {
     const { current } = container;
     if (!current) {
       return;
@@ -2409,7 +2471,7 @@ var PlayerUI = ({
   }, [canvasSize, config]);
   const scale = layout?.scale ?? 1;
   const initialScaleIgnored = useRef10(false);
-  useEffect12(() => {
+  useEffect13(() => {
     if (!initialScaleIgnored.current) {
       initialScaleIgnored.current = true;
       return;
@@ -2418,17 +2480,17 @@ var PlayerUI = ({
   }, [player.emitter, scale]);
   const { setMediaVolume, setMediaMuted } = useContext6(Internals11.SetMediaVolumeContext);
   const { mediaMuted, mediaVolume } = useContext6(Internals11.MediaVolumeContext);
-  useEffect12(() => {
+  useEffect13(() => {
     player.emitter.dispatchVolumeChange(mediaVolume);
   }, [player.emitter, mediaVolume]);
   const isMuted = mediaMuted || mediaVolume === 0;
-  useEffect12(() => {
+  useEffect13(() => {
     player.emitter.dispatchMuteChange({
       isMuted
     });
   }, [player.emitter, isMuted]);
   const [showBufferIndicator, setShowBufferState] = useState11(false);
-  useEffect12(() => {
+  useEffect13(() => {
     let timeout = null;
     let stopped = false;
     const onBuffer = () => {
@@ -2549,11 +2611,11 @@ var PlayerUI = ({
     return calculateOuterStyle({
       canvasSize,
       config,
-      style,
+      style: style2,
       overflowVisible,
       layout
     });
-  }, [canvasSize, config, layout, overflowVisible, style]);
+  }, [canvasSize, config, layout, overflowVisible, style2]);
   const outer = useMemo12(() => {
     return calculateOuter({ config, layout, scale, overflowVisible });
   }, [config, layout, overflowVisible, scale]);
@@ -2601,7 +2663,7 @@ var PlayerUI = ({
     }
   }, [exitFullscreen, isFullscreen, requestFullscreen]);
   const { handlePointerDown, handleDoubleClick } = useClickPreventionOnDoubleClick(onSingleClick, onDoubleClick, doubleClickToFullscreen && allowFullscreen && supportsFullScreen);
-  useEffect12(() => {
+  useEffect13(() => {
     if (shouldAutoplay) {
       player.play();
       setShouldAutoPlay(false);
@@ -2640,45 +2702,48 @@ var PlayerUI = ({
   const { left, top, width, height, ...outerWithoutScale } = outer;
   const content = /* @__PURE__ */ jsxs9(Fragment3, {
     children: [
-      /* @__PURE__ */ jsx11("div", {
+      /* @__PURE__ */ jsxs9("div", {
         style: outer,
         onPointerDown: clickToPlay ? handlePointerDown : undefined,
         onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined,
-        children: /* @__PURE__ */ jsxs9("div", {
-          style: containerStyle3,
-          className: playerCssClassname(overrideInternalClassName),
-          children: [
-            VideoComponent ? /* @__PURE__ */ jsx11(ErrorBoundary, {
-              onError,
-              errorFallback,
-              children: /* @__PURE__ */ jsx11(Internals11.CurrentScaleContext.Provider, {
-                value: currentScale,
-                children: /* @__PURE__ */ jsx11(VideoComponent, {
-                  ...video?.props ?? {},
-                  ...inputProps ?? {}
+        children: [
+          /* @__PURE__ */ jsxs9("div", {
+            style: containerStyle3,
+            className: playerCssClassname(overrideInternalClassName),
+            children: [
+              VideoComponent ? /* @__PURE__ */ jsx12(ErrorBoundary, {
+                onError,
+                errorFallback,
+                children: /* @__PURE__ */ jsx12(Internals11.CurrentScaleContext.Provider, {
+                  value: currentScale,
+                  children: /* @__PURE__ */ jsx12(VideoComponent, {
+                    ...video?.props ?? {},
+                    ...inputProps ?? {}
+                  })
                 })
-              })
-            }) : null,
-            shouldShowPoster && posterFillMode === "composition-size" ? /* @__PURE__ */ jsx11("div", {
-              style: {
-                ...outerWithoutScale,
-                width: config.width,
-                height: config.height
-              },
-              onPointerDown: clickToPlay ? handlePointerDown : undefined,
-              onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined,
-              children: poster
-            }) : null
-          ]
-        })
+              }) : null,
+              shouldShowPoster && posterFillMode === "composition-size" ? /* @__PURE__ */ jsx12("div", {
+                style: {
+                  ...outerWithoutScale,
+                  width: config.width,
+                  height: config.height
+                },
+                onPointerDown: clickToPlay ? handlePointerDown : undefined,
+                onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined,
+                children: poster
+              }) : null
+            ]
+          }),
+          /* @__PURE__ */ jsx12(RenderWarningIfBlacklist, {})
+        ]
       }),
-      shouldShowPoster && posterFillMode === "player-size" ? /* @__PURE__ */ jsx11("div", {
+      shouldShowPoster && posterFillMode === "player-size" ? /* @__PURE__ */ jsx12("div", {
         style: outer,
         onPointerDown: clickToPlay ? handlePointerDown : undefined,
         onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined,
         children: poster
       }) : null,
-      controls ? /* @__PURE__ */ jsx11(Controls, {
+      controls ? /* @__PURE__ */ jsx12(Controls, {
         fps: config.fps,
         playing: player.playing,
         toggle: player.toggle,
@@ -2710,18 +2775,18 @@ var PlayerUI = ({
     ]
   });
   if (IS_NODE && !doesReactVersionSupportSuspense) {
-    return /* @__PURE__ */ jsx11("div", {
+    return /* @__PURE__ */ jsx12("div", {
       ref: container,
       style: outerStyle,
       className: className2,
       children: content
     });
   }
-  return /* @__PURE__ */ jsx11("div", {
+  return /* @__PURE__ */ jsx12("div", {
     ref: container,
     style: outerStyle,
     className: className2,
-    children: /* @__PURE__ */ jsx11(Suspense, {
+    children: /* @__PURE__ */ jsx12(Suspense, {
       fallback: loadingMarkup,
       children: content
     })
@@ -2758,7 +2823,7 @@ var getPreferredVolume = () => {
 };
 
 // src/SharedPlayerContext.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var PLAYER_COMP_ID = "player-comp";
 var SharedPlayerContexts = ({
   children,
@@ -2833,22 +2898,22 @@ var SharedPlayerContexts = ({
       setMediaVolume: setMediaVolumeAndPersist
     };
   }, [setMediaVolumeAndPersist]);
-  return /* @__PURE__ */ jsx12(Internals12.CanUseRemotionHooksProvider, {
-    children: /* @__PURE__ */ jsx12(Internals12.Timeline.TimelineContext.Provider, {
+  return /* @__PURE__ */ jsx13(Internals12.CanUseRemotionHooksProvider, {
+    children: /* @__PURE__ */ jsx13(Internals12.Timeline.TimelineContext.Provider, {
       value: timelineContext,
-      children: /* @__PURE__ */ jsx12(Internals12.CompositionManager.Provider, {
+      children: /* @__PURE__ */ jsx13(Internals12.CompositionManager.Provider, {
         value: compositionManagerContext,
-        children: /* @__PURE__ */ jsx12(Internals12.ResolveCompositionConfig, {
-          children: /* @__PURE__ */ jsx12(Internals12.PrefetchProvider, {
-            children: /* @__PURE__ */ jsx12(Internals12.DurationsContextProvider, {
-              children: /* @__PURE__ */ jsx12(Internals12.MediaVolumeContext.Provider, {
+        children: /* @__PURE__ */ jsx13(Internals12.ResolveCompositionConfig, {
+          children: /* @__PURE__ */ jsx13(Internals12.PrefetchProvider, {
+            children: /* @__PURE__ */ jsx13(Internals12.DurationsContextProvider, {
+              children: /* @__PURE__ */ jsx13(Internals12.MediaVolumeContext.Provider, {
                 value: mediaVolumeContextValue,
-                children: /* @__PURE__ */ jsx12(Internals12.SetMediaVolumeContext.Provider, {
+                children: /* @__PURE__ */ jsx13(Internals12.SetMediaVolumeContext.Provider, {
                   value: setMediaVolumeContextValue,
-                  children: /* @__PURE__ */ jsx12(Internals12.SharedAudioContextProvider, {
+                  children: /* @__PURE__ */ jsx13(Internals12.SharedAudioContextProvider, {
                     numberOfAudioTags: numberOfSharedAudioTags,
                     component,
-                    children: /* @__PURE__ */ jsx12(Internals12.BufferingProvider, {
+                    children: /* @__PURE__ */ jsx13(Internals12.BufferingProvider, {
                       children
                     })
                   })
@@ -2960,7 +3025,7 @@ var validateDurationInFrames = NoReactInternals.validateDurationInFrames;
 var validateDefaultAndInputProps = NoReactInternals.validateDefaultAndInputProps;
 
 // src/Player.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var componentOrNullIfLazy = (props) => {
   if ("component" in props) {
     return props.component;
@@ -2973,7 +3038,7 @@ var PlayerFn = ({
   compositionWidth,
   fps,
   inputProps,
-  style,
+  style: style2,
   controls = false,
   loop = false,
   autoPlay = false,
@@ -3085,7 +3150,7 @@ var PlayerFn = ({
     throw new TypeError(`'numberOfSharedAudioTags' must be an integer but got '${numberOfSharedAudioTags}' instead`);
   }
   validatePlaybackRate(currentPlaybackRate);
-  useEffect13(() => {
+  useEffect14(() => {
     setCurrentPlaybackRate(playbackRate);
   }, [playbackRate]);
   useImperativeHandle2(ref, () => rootRef.current, []);
@@ -3119,8 +3184,8 @@ var PlayerFn = ({
       mode: "prevent-media-session"
     };
   }, [passedBrowserMediaControlsBehavior]);
-  return /* @__PURE__ */ jsx13(Internals13.IsPlayerContextProvider, {
-    children: /* @__PURE__ */ jsx13(SharedPlayerContexts, {
+  return /* @__PURE__ */ jsx14(Internals13.IsPlayerContextProvider, {
+    children: /* @__PURE__ */ jsx14(SharedPlayerContexts, {
       timelineContext: timelineContextValue,
       component,
       compositionHeight,
@@ -3129,11 +3194,11 @@ var PlayerFn = ({
       fps,
       numberOfSharedAudioTags,
       initiallyMuted,
-      children: /* @__PURE__ */ jsx13(Internals13.Timeline.SetTimelineContext.Provider, {
+      children: /* @__PURE__ */ jsx14(Internals13.Timeline.SetTimelineContext.Provider, {
         value: setTimelineContextValue,
-        children: /* @__PURE__ */ jsx13(PlayerEmitterProvider, {
+        children: /* @__PURE__ */ jsx14(PlayerEmitterProvider, {
           currentPlaybackRate,
-          children: /* @__PURE__ */ jsx13(PlayerUI_default, {
+          children: /* @__PURE__ */ jsx14(PlayerUI_default, {
             ref: rootRef,
             posterFillMode,
             renderLoading,
@@ -3141,7 +3206,7 @@ var PlayerFn = ({
             loop: Boolean(loop),
             controls: Boolean(controls),
             errorFallback,
-            style,
+            style: style2,
             inputProps: actualInputProps,
             allowFullscreen: Boolean(allowFullscreen),
             moveToBeginningWhenEnded: Boolean(moveToBeginningWhenEnded),
@@ -3190,7 +3255,7 @@ import {
 import { Internals as Internals15, random as random2 } from "remotion";
 
 // src/ThumbnailUI.tsx
-import React12, {
+import React13, {
   forwardRef as forwardRef3,
   Suspense as Suspense2,
   useCallback as useCallback13,
@@ -3216,14 +3281,14 @@ var useThumbnail = () => {
 };
 
 // src/ThumbnailUI.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
-var reactVersion2 = React12.version.split(".")[0];
+import { jsx as jsx15 } from "react/jsx-runtime";
+var reactVersion2 = React13.version.split(".")[0];
 if (reactVersion2 === "0") {
   throw new Error(`Version ${reactVersion2} of "react" is not supported by Remotion`);
 }
 var doesReactVersionSupportSuspense2 = parseInt(reactVersion2, 10) >= 18;
 var ThumbnailUI = ({
-  style,
+  style: style2,
   inputProps,
   errorFallback,
   renderLoading,
@@ -3263,12 +3328,12 @@ var ThumbnailUI = ({
   const outerStyle = useMemo16(() => {
     return calculateOuterStyle({
       config,
-      style,
+      style: style2,
       canvasSize,
       overflowVisible,
       layout
     });
-  }, [canvasSize, config, layout, overflowVisible, style]);
+  }, [canvasSize, config, layout, overflowVisible, style2]);
   const outer = useMemo16(() => {
     return calculateOuter({ config, layout, scale, overflowVisible });
   }, [config, layout, overflowVisible, scale]);
@@ -3300,17 +3365,17 @@ var ThumbnailUI = ({
   if (!config) {
     return null;
   }
-  const content = /* @__PURE__ */ jsx14("div", {
+  const content = /* @__PURE__ */ jsx15("div", {
     style: outer,
-    children: /* @__PURE__ */ jsx14("div", {
+    children: /* @__PURE__ */ jsx15("div", {
       style: containerStyle3,
       className: playerCssClassname(overrideInternalClassName),
-      children: VideoComponent ? /* @__PURE__ */ jsx14(ErrorBoundary, {
+      children: VideoComponent ? /* @__PURE__ */ jsx15(ErrorBoundary, {
         onError,
         errorFallback,
-        children: /* @__PURE__ */ jsx14(Internals14.CurrentScaleContext.Provider, {
+        children: /* @__PURE__ */ jsx15(Internals14.CurrentScaleContext.Provider, {
           value: currentScaleContext,
-          children: /* @__PURE__ */ jsx14(VideoComponent, {
+          children: /* @__PURE__ */ jsx15(VideoComponent, {
             ...video?.props ?? {},
             ...inputProps ?? {}
           })
@@ -3319,18 +3384,18 @@ var ThumbnailUI = ({
     })
   });
   if (IS_NODE && !doesReactVersionSupportSuspense2) {
-    return /* @__PURE__ */ jsx14("div", {
+    return /* @__PURE__ */ jsx15("div", {
       ref: container,
       style: outerStyle,
       className: className2,
       children: content
     });
   }
-  return /* @__PURE__ */ jsx14("div", {
+  return /* @__PURE__ */ jsx15("div", {
     ref: container,
     style: outerStyle,
     className: className2,
-    children: /* @__PURE__ */ jsx14(Suspense2, {
+    children: /* @__PURE__ */ jsx15(Suspense2, {
       fallback: loadingMarkup,
       children: content
     })
@@ -3339,10 +3404,10 @@ var ThumbnailUI = ({
 var ThumbnailUI_default = forwardRef3(ThumbnailUI);
 
 // src/Thumbnail.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 var ThumbnailFn = ({
   frameToDisplay,
-  style,
+  style: style2,
   inputProps,
   compositionHeight,
   compositionWidth,
@@ -3386,8 +3451,8 @@ var ThumbnailFn = ({
   const passedInputProps = useMemo17(() => {
     return inputProps ?? {};
   }, [inputProps]);
-  return /* @__PURE__ */ jsx15(Internals15.IsPlayerContextProvider, {
-    children: /* @__PURE__ */ jsx15(SharedPlayerContexts, {
+  return /* @__PURE__ */ jsx16(Internals15.IsPlayerContextProvider, {
+    children: /* @__PURE__ */ jsx16(SharedPlayerContexts, {
       timelineContext: timelineState,
       component: Component,
       compositionHeight,
@@ -3396,15 +3461,15 @@ var ThumbnailFn = ({
       fps,
       numberOfSharedAudioTags: 0,
       initiallyMuted: true,
-      children: /* @__PURE__ */ jsx15(ThumbnailEmitterContext.Provider, {
+      children: /* @__PURE__ */ jsx16(ThumbnailEmitterContext.Provider, {
         value: emitter,
-        children: /* @__PURE__ */ jsx15(ThumbnailUI_default, {
+        children: /* @__PURE__ */ jsx16(ThumbnailUI_default, {
           ref: rootRef,
           className: className2,
           errorFallback,
           inputProps: passedInputProps,
           renderLoading,
-          style,
+          style: style2,
           overflowVisible,
           overrideInternalClassName
         })

package/package.json

@@ -3,7 +3,7 @@
     "url": "https://github.com/remotion-dev/remotion/tree/main/packages/player"
   },
   "name": "@remotion/player",
-  "version": "4.0.233",
+  "version": "4.0.235",
   "description": "React component for embedding a Remotion preview into your app",
   "main": "dist/cjs/index.js",
   "types": "dist/cjs/index.d.ts",
@@ -28,7 +28,7 @@
   ],
   "license": "SEE LICENSE IN LICENSE.md",
   "dependencies": {
-    "remotion": "4.0.233"
+    "remotion": "4.0.235"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -43,7 +43,7 @@
     "webpack": "5.96.1",
     "zod": "3.22.3",
     "eslint": "9.14.0",
-    "@remotion/eslint-config-internal": "4.0.233"
+    "@remotion/eslint-config-internal": "4.0.235"
   },
   "keywords": [
     "remotion",

package/LICENSE.md

@@ -1,49 +0,0 @@
-# Remotion License
-
-In Remotion 5.0, the license will slightly change. [View the changes here](https://github.com/remotion-dev/remotion/pull/3750).
-
----
-
-Depending on the type of your legal entity, you are granted permission to use Remotion for your project. Individuals and small companies are allowed to use Remotion to create videos for free (even commercial), while a company license is required for for-profit organizations of a certain size. This two-tier system was designed to ensure funding for this project while still allowing the source code to be available and the program to be free for most. Read below for the exact terms of use.
-
-- [Free license](#free-license)
-- [Company license](#company-license)
-
-## Free license
-
-Copyright © 2024 [Remotion](https://www.remotion.dev)
-
-### Eligibility
-
-You are eligible to use Remotion for free if you are:
-
-- an individual
-- a for-profit organization with up to 3 employees
-- a non-profit or not-for-profit organization
-- evaluating whether Remotion is a good fit, and are not yet using it in a commercial way
-
-### Allowed use cases
-
-Permission is hereby granted, free of charge, to any person eligible for the "Free license", to use the software non-commercially or commercially for the purpose of creating videos and images and to modify the software to their own liking, for the purpose of fulfilling their custom use case or to contribute bug fixes or improvements back to Remotion.
-
-### Disallowed use cases
-
-It is not allowed to copy or modify Remotion code for the purpose of selling, renting, licensing, relicensing, or sublicensing your own derivate of Remotion.
-
-### Warranty notice
-
-The software is provided "as is", without warranty of any kind, express or implied, including but not limited to the warranties of merchantability, fitness for a particular purpose, and non-infringement. In no event shall the author or copyright holders be liable for any claim, damages or other liability, whether in an action of contract, tort or otherwise, arising from, out of or in connection with the software or the use or other dealings in the software.
-
-### Support
-
-Support is provided on a best-we-can-do basis via GitHub Issues and Discord.
-
-## Company license
-
-You are required to obtain a company license to use Remotion if you are not within the group of entities eligible for a free license. This license will enable you to use Remotion for the allowed use cases specified in the free license, and give you access to prioritized support (read the [Support Policy](https://www.remotion.dev/docs/support)).
-
-Visit [remotion.pro](https://www.remotion.pro/license) for pricing and to buy a license.
-
-### FAQs
-
-Are you not sure whether you need a company license because of an edge case? Here are some [frequently asked questions](https://www.remotion.pro/faq).