@remotion/player
Advanced tools
Comparing version 2.1.3 to 2.1.4
@@ -23,3 +23,3 @@ import React, { MutableRefObject } from 'react'; | ||
} & PropsIfHasProps<T> & CompProps<T>; | ||
export declare const PlayerFn: <T>({ durationInFrames, compositionHeight: height, compositionWidth: width, fps, controls, style, loop, autoPlay, showVolumeControls, allowFullscreen, inputProps, clickToPlay, ...componentProps }: PlayerProps<T>, ref: MutableRefObject<PlayerRef>) => JSX.Element; | ||
export declare const PlayerFn: <T>({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls, loop, autoPlay, showVolumeControls, allowFullscreen, clickToPlay, ...componentProps }: PlayerProps<T>, ref: MutableRefObject<PlayerRef>) => JSX.Element; | ||
declare module 'react' { | ||
@@ -26,0 +26,0 @@ function forwardRef<T, P = {}>(render: (props: P, ref: React.MutableRefObject<T>) => React.ReactElement | null): (props: P & React.RefAttributes<T>) => React.ReactElement | null; |
@@ -16,3 +16,3 @@ "use strict"; | ||
remotion_1.Internals.CSSUtils.injectCSS(remotion_1.Internals.CSSUtils.makeDefaultCSS(`.${player_css_classname_1.PLAYER_CSS_CLASSNAME}`)); | ||
const PlayerFn = ({ durationInFrames, compositionHeight: height, compositionWidth: width, fps, controls, style, loop, autoPlay, showVolumeControls = true, allowFullscreen = true, inputProps, clickToPlay = true, ...componentProps }, ref) => { | ||
const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls = false, loop = false, autoPlay = false, showVolumeControls = true, allowFullscreen = true, clickToPlay = true, ...componentProps }, ref) => { | ||
const component = remotion_1.Internals.useLazyComponent(componentProps); | ||
@@ -26,2 +26,32 @@ const [frame, setFrame] = react_1.useState(0); | ||
const [mediaVolume, setMediaVolume] = react_1.useState(volume_persistance_1.getPreferredVolume()); | ||
if (typeof compositionHeight !== 'number') { | ||
throw new TypeError(`'compositionHeight' must be a number but got '${typeof compositionHeight}' instead`); | ||
} | ||
if (typeof compositionWidth !== 'number') { | ||
throw new TypeError(`'compositionWidth' must be a number but got '${typeof compositionWidth}' instead`); | ||
} | ||
remotion_1.Internals.validateDimension(compositionHeight, 'compositionHeight'); | ||
remotion_1.Internals.validateDimension(compositionWidth, 'compositionWidth'); | ||
remotion_1.Internals.validateDurationInFrames(durationInFrames); | ||
remotion_1.Internals.validateFps(fps); | ||
if (typeof controls !== 'boolean' && typeof controls !== 'undefined') { | ||
throw new TypeError(`'controls' must be a boolean or undefined but got '${typeof controls}' instead`); | ||
} | ||
if (typeof autoPlay !== 'boolean' && typeof autoPlay !== 'undefined') { | ||
throw new TypeError(`'autoPlay' must be a boolean or undefined but got '${typeof autoPlay}' instead`); | ||
} | ||
if (typeof loop !== 'boolean' && typeof loop !== 'undefined') { | ||
throw new TypeError(`'loop' must be a boolean or undefined but got '${typeof loop}' instead`); | ||
} | ||
if (typeof showVolumeControls !== 'boolean' && | ||
typeof showVolumeControls !== 'undefined') { | ||
throw new TypeError(`'showVolumeControls' must be a boolean or undefined but got '${typeof showVolumeControls}' instead`); | ||
} | ||
if (typeof allowFullscreen !== 'boolean' && | ||
typeof allowFullscreen !== 'undefined') { | ||
throw new TypeError(`'allowFullscreen' must be a boolean or undefined but got '${typeof allowFullscreen}' instead`); | ||
} | ||
if (typeof clickToPlay !== 'boolean' && typeof clickToPlay !== 'undefined') { | ||
throw new TypeError(`'clickToPlay' must be a boolean or undefined but got '${typeof clickToPlay}' instead`); | ||
} | ||
const setMediaVolumeAndPersist = react_1.useCallback((vol) => { | ||
@@ -64,4 +94,4 @@ setMediaVolume(vol); | ||
durationInFrames, | ||
height, | ||
width, | ||
height: compositionHeight, | ||
width: compositionWidth, | ||
fps, | ||
@@ -84,3 +114,10 @@ id: 'player-comp', | ||
}; | ||
}, [component, durationInFrames, height, width, fps, inputProps]); | ||
}, [ | ||
component, | ||
durationInFrames, | ||
compositionHeight, | ||
compositionWidth, | ||
fps, | ||
inputProps, | ||
]); | ||
const passedInputProps = react_1.useMemo(() => { | ||
@@ -87,0 +124,0 @@ return inputProps !== null && inputProps !== void 0 ? inputProps : {}; |
@@ -111,3 +111,3 @@ "use strict"; | ||
backgroundColor: 'rgba(255, 255, 255, 1)', | ||
width: (frame / durationInFrames) * 100 + '%', | ||
width: (frame / (durationInFrames - 1)) * 100 + '%', | ||
borderRadius: BAR_HEIGHT / 2, | ||
@@ -114,0 +114,0 @@ }; |
{ | ||
"name": "@remotion/player", | ||
"version": "2.1.3", | ||
"version": "2.1.4", | ||
"description": "Remotion Player", | ||
@@ -27,3 +27,3 @@ "main": "dist/index.js", | ||
"dependencies": { | ||
"remotion": "^2.1.3" | ||
"remotion": "^2.1.4" | ||
}, | ||
@@ -30,0 +30,0 @@ "peerDependencies": { |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
161139
146
2088
Updatedremotion@^2.1.4