@remotion/player 4.0.0-alpha.4 → 4.0.0-alpha11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE.md +8 -8
- package/README.md +1 -1
- package/dist/cjs/MediaVolumeSlider.d.ts +5 -0
- package/dist/cjs/MediaVolumeSlider.js +142 -0
- package/dist/cjs/PlaybackrateControl.d.ts +5 -0
- package/dist/cjs/PlaybackrateControl.js +136 -0
- package/dist/cjs/Player.d.ts +52 -0
- package/dist/{Player.js → cjs/Player.js} +53 -83
- package/dist/{PlayerControls.d.ts → cjs/PlayerControls.d.ts} +18 -2
- package/dist/cjs/PlayerControls.js +171 -0
- package/dist/{PlayerSeekBar.d.ts → cjs/PlayerSeekBar.d.ts} +4 -0
- package/dist/{PlayerSeekBar.js → cjs/PlayerSeekBar.js} +41 -17
- package/dist/cjs/PlayerUI.d.ts +40 -0
- package/dist/{PlayerUI.js → cjs/PlayerUI.js} +115 -88
- package/dist/cjs/SharedPlayerContext.d.ts +15 -0
- package/dist/cjs/SharedPlayerContext.js +75 -0
- package/dist/cjs/Thumbnail.d.ts +24 -0
- package/dist/cjs/Thumbnail.js +46 -0
- package/dist/cjs/ThumbnailUI.d.ts +11 -0
- package/dist/cjs/ThumbnailUI.js +107 -0
- package/dist/{calculate-next-frame.d.ts → cjs/calculate-next-frame.d.ts} +0 -0
- package/dist/{calculate-next-frame.js → cjs/calculate-next-frame.js} +0 -0
- package/dist/cjs/calculate-scale.d.ts +39 -0
- package/dist/cjs/calculate-scale.js +85 -0
- package/dist/cjs/emitter-context.d.ts +4 -0
- package/dist/{emitter-context.js → cjs/emitter-context.js} +2 -1
- package/dist/{error-boundary.d.ts → cjs/error-boundary.d.ts} +0 -0
- package/dist/{error-boundary.js → cjs/error-boundary.js} +0 -0
- package/dist/cjs/event-emitter.d.ts +81 -0
- package/dist/cjs/event-emitter.js +103 -0
- package/dist/{format-time.d.ts → cjs/format-time.d.ts} +0 -0
- package/dist/{format-time.js → cjs/format-time.js} +0 -0
- package/dist/{icons.d.ts → cjs/icons.d.ts} +5 -1
- package/dist/{icons.js → cjs/icons.js} +11 -7
- package/dist/{index.d.ts → cjs/index.d.ts} +22 -12
- package/dist/cjs/index.js +25 -0
- package/dist/cjs/is-backgrounded.d.ts +2 -0
- package/dist/cjs/is-backgrounded.js +24 -0
- package/dist/{player-css-classname.d.ts → cjs/player-css-classname.d.ts} +0 -1
- package/dist/cjs/player-css-classname.js +4 -0
- package/dist/{player-methods.d.ts → cjs/player-methods.d.ts} +8 -4
- package/dist/{player-methods.js → cjs/player-methods.js} +0 -0
- package/dist/{test → cjs/test}/index.test.d.ts +0 -0
- package/dist/cjs/test/index.test.js +9 -0
- package/dist/{test → cjs/test}/test-utils.d.ts +0 -0
- package/dist/{test → cjs/test}/test-utils.js +0 -0
- package/dist/{test/validate-prop.test.d.ts → cjs/test/validate-in-out-frames.test.d.ts} +0 -0
- package/dist/cjs/test/validate-in-out-frames.test.js +56 -0
- package/dist/cjs/test/validate-prop.test.d.ts +1 -0
- package/dist/cjs/test/validate-prop.test.js +131 -0
- package/dist/{use-hover-state.d.ts → cjs/use-hover-state.d.ts} +0 -0
- package/dist/{use-hover-state.js → cjs/use-hover-state.js} +0 -0
- package/dist/{use-playback.d.ts → cjs/use-playback.d.ts} +0 -0
- package/dist/{use-playback.js → cjs/use-playback.js} +49 -9
- package/dist/{use-player.d.ts → cjs/use-player.d.ts} +3 -1
- package/dist/{use-player.js → cjs/use-player.js} +15 -8
- package/dist/cjs/use-thumbnail.d.ts +6 -0
- package/dist/cjs/use-thumbnail.js +18 -0
- package/dist/cjs/use-video-controls-resize.d.ts +11 -0
- package/dist/cjs/use-video-controls-resize.js +39 -0
- package/dist/{utils → cjs/utils}/calculate-player-size.d.ts +1 -1
- package/dist/{utils → cjs/utils}/calculate-player-size.js +9 -10
- package/dist/{utils → cjs/utils}/cancellable-promise.d.ts +0 -0
- package/dist/{utils → cjs/utils}/cancellable-promise.js +0 -0
- package/dist/{utils → cjs/utils}/delay.d.ts +0 -0
- package/dist/{utils → cjs/utils}/delay.js +0 -0
- package/dist/{utils → cjs/utils}/is-node.d.ts +0 -0
- package/dist/{utils → cjs/utils}/is-node.js +0 -0
- package/dist/cjs/utils/preview-size.d.ts +8 -0
- package/dist/{utils → cjs/utils}/preview-size.js +0 -0
- package/dist/cjs/utils/props-if-has-props.d.ts +10 -0
- package/dist/cjs/utils/props-if-has-props.js +2 -0
- package/dist/{utils → cjs/utils}/use-cancellable-promises.d.ts +1 -1
- package/dist/{utils → cjs/utils}/use-cancellable-promises.js +0 -0
- package/dist/{utils → cjs/utils}/use-click-prevention-on-double-click.d.ts +0 -0
- package/dist/{utils → cjs/utils}/use-click-prevention-on-double-click.js +5 -5
- package/dist/cjs/utils/use-component-visible.d.ts +6 -0
- package/dist/cjs/utils/use-component-visible.js +21 -0
- package/dist/{utils → cjs/utils}/use-element-size.d.ts +1 -0
- package/dist/{utils → cjs/utils}/use-element-size.js +24 -12
- package/dist/cjs/utils/validate-in-out-frame.d.ts +6 -0
- package/dist/cjs/utils/validate-in-out-frame.js +54 -0
- package/dist/cjs/utils/validate-initial-frame.d.ts +4 -0
- package/dist/cjs/utils/validate-initial-frame.js +27 -0
- package/dist/{utils → cjs/utils}/validate-playbackrate.d.ts +0 -0
- package/dist/{utils → cjs/utils}/validate-playbackrate.js +0 -0
- package/dist/{volume-persistance.d.ts → cjs/volume-persistance.d.ts} +0 -0
- package/dist/{volume-persistance.js → cjs/volume-persistance.js} +0 -0
- package/dist/esm/MediaVolumeSlider.d.ts +5 -0
- package/dist/esm/PlaybackrateControl.d.ts +5 -0
- package/dist/esm/Player.d.ts +52 -0
- package/dist/esm/PlayerControls.d.ts +41 -0
- package/dist/esm/PlayerSeekBar.d.ts +8 -0
- package/dist/esm/PlayerUI.d.ts +40 -0
- package/dist/esm/SharedPlayerContext.d.ts +15 -0
- package/dist/esm/Thumbnail.d.ts +24 -0
- package/dist/esm/ThumbnailUI.d.ts +11 -0
- package/dist/esm/calculate-next-frame.d.ts +14 -0
- package/dist/esm/calculate-scale.d.ts +39 -0
- package/dist/esm/emitter-context.d.ts +4 -0
- package/dist/esm/error-boundary.d.ts +19 -0
- package/dist/esm/event-emitter.d.ts +81 -0
- package/dist/esm/format-time.d.ts +1 -0
- package/dist/esm/icons.d.ts +13 -0
- package/dist/esm/index.d.ts +61 -0
- package/dist/esm/index.mjs +2112 -0
- package/dist/esm/is-backgrounded.d.ts +2 -0
- package/dist/esm/player-css-classname.d.ts +1 -0
- package/dist/esm/player-methods.d.ts +24 -0
- package/dist/esm/test/index.test.d.ts +1 -0
- package/dist/esm/test/test-utils.d.ts +6 -0
- package/dist/esm/test/validate-in-out-frames.test.d.ts +1 -0
- package/dist/esm/test/validate-prop.test.d.ts +1 -0
- package/dist/esm/use-hover-state.d.ts +1 -0
- package/dist/esm/use-playback.d.ts +7 -0
- package/dist/esm/use-player.d.ts +19 -0
- package/dist/esm/use-thumbnail.d.ts +6 -0
- package/dist/esm/use-video-controls-resize.d.ts +11 -0
- package/dist/esm/utils/calculate-player-size.d.ts +9 -0
- package/dist/esm/utils/cancellable-promise.d.ts +5 -0
- package/dist/esm/utils/delay.d.ts +1 -0
- package/dist/esm/utils/is-node.d.ts +1 -0
- package/dist/esm/utils/preview-size.d.ts +8 -0
- package/dist/esm/utils/props-if-has-props.d.ts +10 -0
- package/dist/esm/utils/use-cancellable-promises.d.ts +7 -0
- package/dist/esm/utils/use-click-prevention-on-double-click.d.ts +3 -0
- package/dist/esm/utils/use-component-visible.d.ts +5 -0
- package/dist/esm/utils/use-element-size.d.ts +16 -0
- package/dist/esm/utils/validate-in-out-frame.d.ts +6 -0
- package/dist/esm/utils/validate-initial-frame.d.ts +4 -0
- package/dist/esm/utils/validate-playbackrate.d.ts +1 -0
- package/dist/esm/volume-persistance.d.ts +2 -0
- package/dist/tsconfig-esm.tsbuildinfo +1 -0
- package/dist/tsconfig.tsbuildinfo +1 -0
- package/package.json +80 -66
- package/dist/MediaVolumeSlider.d.ts +0 -2
- package/dist/MediaVolumeSlider.d.ts.map +0 -1
- package/dist/MediaVolumeSlider.js +0 -93
- package/dist/MediaVolumeSlider.js.map +0 -1
- package/dist/Player.d.ts +0 -41
- package/dist/Player.d.ts.map +0 -1
- package/dist/Player.js.map +0 -1
- package/dist/PlayerControls.d.ts.map +0 -1
- package/dist/PlayerControls.js +0 -95
- package/dist/PlayerControls.js.map +0 -1
- package/dist/PlayerSeekBar.d.ts.map +0 -1
- package/dist/PlayerSeekBar.js.map +0 -1
- package/dist/PlayerUI.d.ts +0 -31
- package/dist/PlayerUI.d.ts.map +0 -1
- package/dist/PlayerUI.js.map +0 -1
- package/dist/calculate-next-frame.d.ts.map +0 -1
- package/dist/calculate-next-frame.js.map +0 -1
- package/dist/calculate-scale.d.ts +0 -14
- package/dist/calculate-scale.d.ts.map +0 -1
- package/dist/calculate-scale.js +0 -24
- package/dist/calculate-scale.js.map +0 -1
- package/dist/emitter-context.d.ts +0 -3
- package/dist/emitter-context.d.ts.map +0 -1
- package/dist/emitter-context.js.map +0 -1
- package/dist/error-boundary.d.ts.map +0 -1
- package/dist/error-boundary.js.map +0 -1
- package/dist/event-emitter.d.ts +0 -42
- package/dist/event-emitter.d.ts.map +0 -1
- package/dist/event-emitter.js +0 -55
- package/dist/event-emitter.js.map +0 -1
- package/dist/format-time.d.ts.map +0 -1
- package/dist/format-time.js.map +0 -1
- package/dist/icons.d.ts.map +0 -1
- package/dist/icons.js.map +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/index.js +0 -22
- package/dist/index.js.map +0 -1
- package/dist/player-css-classname.d.ts.map +0 -1
- package/dist/player-css-classname.js +0 -5
- package/dist/player-css-classname.js.map +0 -1
- package/dist/player-methods.d.ts.map +0 -1
- package/dist/player-methods.js.map +0 -1
- package/dist/test/index.test.d.ts.map +0 -1
- package/dist/test/index.test.js +0 -8
- package/dist/test/index.test.js.map +0 -1
- package/dist/test/test-utils.d.ts.map +0 -1
- package/dist/test/test-utils.js.map +0 -1
- package/dist/test/validate-prop.test.d.ts.map +0 -1
- package/dist/test/validate-prop.test.js +0 -130
- package/dist/test/validate-prop.test.js.map +0 -1
- package/dist/use-hover-state.d.ts.map +0 -1
- package/dist/use-hover-state.js.map +0 -1
- package/dist/use-playback.d.ts.map +0 -1
- package/dist/use-playback.js.map +0 -1
- package/dist/use-player.d.ts.map +0 -1
- package/dist/use-player.js.map +0 -1
- package/dist/utils/browser-supports-fullscreen.d.ts +0 -12
- package/dist/utils/browser-supports-fullscreen.d.ts.map +0 -1
- package/dist/utils/browser-supports-fullscreen.js +0 -6
- package/dist/utils/browser-supports-fullscreen.js.map +0 -1
- package/dist/utils/calculate-player-size.d.ts.map +0 -1
- package/dist/utils/calculate-player-size.js.map +0 -1
- package/dist/utils/cancellable-promise.d.ts.map +0 -1
- package/dist/utils/cancellable-promise.js.map +0 -1
- package/dist/utils/delay.d.ts.map +0 -1
- package/dist/utils/delay.js.map +0 -1
- package/dist/utils/is-node.d.ts.map +0 -1
- package/dist/utils/is-node.js.map +0 -1
- package/dist/utils/preview-size.d.ts +0 -1
- package/dist/utils/preview-size.d.ts.map +0 -1
- package/dist/utils/preview-size.js.map +0 -1
- package/dist/utils/use-cancellable-promises.d.ts.map +0 -1
- package/dist/utils/use-cancellable-promises.js.map +0 -1
- package/dist/utils/use-click-prevention-on-double-click.d.ts.map +0 -1
- package/dist/utils/use-click-prevention-on-double-click.js.map +0 -1
- package/dist/utils/use-element-size.d.ts.map +0 -1
- package/dist/utils/use-element-size.js.map +0 -1
- package/dist/utils/validate-playbackrate.d.ts.map +0 -1
- package/dist/utils/validate-playbackrate.js.map +0 -1
- package/dist/volume-persistance.d.ts.map +0 -1
- package/dist/volume-persistance.js.map +0 -1
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
declare type SeekPayload = {
|
|
2
|
+
frame: number;
|
|
3
|
+
};
|
|
4
|
+
declare type ErrorPayload = {
|
|
5
|
+
error: Error;
|
|
6
|
+
};
|
|
7
|
+
declare type TimeUpdateEventPayload = {
|
|
8
|
+
frame: number;
|
|
9
|
+
};
|
|
10
|
+
declare type FrameUpdateEventPayload = {
|
|
11
|
+
frame: number;
|
|
12
|
+
};
|
|
13
|
+
declare type RateChangeEventPayload = {
|
|
14
|
+
playbackRate: number;
|
|
15
|
+
};
|
|
16
|
+
declare type ScaleChangeEventPayload = {
|
|
17
|
+
scale: number;
|
|
18
|
+
};
|
|
19
|
+
declare type VolumeChangeEventPayload = {
|
|
20
|
+
volume: number;
|
|
21
|
+
};
|
|
22
|
+
declare type FullscreenChangeEventPayload = {
|
|
23
|
+
isFullscreen: boolean;
|
|
24
|
+
};
|
|
25
|
+
declare type MuteChangeEventPayload = {
|
|
26
|
+
isMuted: boolean;
|
|
27
|
+
};
|
|
28
|
+
declare type PlayerStateEventMap = {
|
|
29
|
+
seeked: SeekPayload;
|
|
30
|
+
pause: undefined;
|
|
31
|
+
play: undefined;
|
|
32
|
+
ratechange: RateChangeEventPayload;
|
|
33
|
+
scalechange: ScaleChangeEventPayload;
|
|
34
|
+
volumechange: VolumeChangeEventPayload;
|
|
35
|
+
ended: undefined;
|
|
36
|
+
error: ErrorPayload;
|
|
37
|
+
timeupdate: TimeUpdateEventPayload;
|
|
38
|
+
frameupdate: FrameUpdateEventPayload;
|
|
39
|
+
fullscreenchange: FullscreenChangeEventPayload;
|
|
40
|
+
mutechange: MuteChangeEventPayload;
|
|
41
|
+
};
|
|
42
|
+
declare type ThumbnailStateEventMap = {
|
|
43
|
+
error: ErrorPayload;
|
|
44
|
+
};
|
|
45
|
+
export declare type PlayerEventTypes = keyof PlayerStateEventMap;
|
|
46
|
+
export declare type ThumbnailEventTypes = keyof ThumbnailStateEventMap;
|
|
47
|
+
export declare type CallbackListener<T extends PlayerEventTypes> = (data: {
|
|
48
|
+
detail: PlayerStateEventMap[T];
|
|
49
|
+
}) => void;
|
|
50
|
+
declare type PlayerListeners = {
|
|
51
|
+
[EventType in PlayerEventTypes]: CallbackListener<EventType>[];
|
|
52
|
+
};
|
|
53
|
+
declare type ThumbnailListeners = {
|
|
54
|
+
[EventType in ThumbnailEventTypes]: CallbackListener<EventType>[];
|
|
55
|
+
};
|
|
56
|
+
export declare class PlayerEmitter {
|
|
57
|
+
listeners: PlayerListeners;
|
|
58
|
+
addEventListener<Q extends PlayerEventTypes>(name: Q, callback: CallbackListener<Q>): void;
|
|
59
|
+
removeEventListener<Q extends PlayerEventTypes>(name: Q, callback: CallbackListener<Q>): void;
|
|
60
|
+
private dispatchEvent;
|
|
61
|
+
dispatchSeek(frame: number): void;
|
|
62
|
+
dispatchVolumeChange(volume: number): void;
|
|
63
|
+
dispatchPause(): void;
|
|
64
|
+
dispatchPlay(): void;
|
|
65
|
+
dispatchEnded(): void;
|
|
66
|
+
dispatchRateChange(playbackRate: number): void;
|
|
67
|
+
dispatchScaleChange(scale: number): void;
|
|
68
|
+
dispatchError(error: Error): void;
|
|
69
|
+
dispatchTimeUpdate(event: TimeUpdateEventPayload): void;
|
|
70
|
+
dispatchFrameUpdate(event: FrameUpdateEventPayload): void;
|
|
71
|
+
dispatchFullscreenChange(event: FullscreenChangeEventPayload): void;
|
|
72
|
+
dispatchMuteChange(event: MuteChangeEventPayload): void;
|
|
73
|
+
}
|
|
74
|
+
export declare class ThumbnailEmitter {
|
|
75
|
+
listeners: ThumbnailListeners;
|
|
76
|
+
addEventListener<Q extends ThumbnailEventTypes>(name: Q, callback: CallbackListener<Q>): void;
|
|
77
|
+
removeEventListener<Q extends ThumbnailEventTypes>(name: Q, callback: CallbackListener<Q>): void;
|
|
78
|
+
private dispatchEvent;
|
|
79
|
+
dispatchError(error: Error): void;
|
|
80
|
+
}
|
|
81
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const formatTime: (timeInSeconds: number) => string;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const ICON_SIZE = 25;
|
|
3
|
+
export declare const fullscreenIconSize = 16;
|
|
4
|
+
export declare const PlayIcon: React.FC;
|
|
5
|
+
export declare const PauseIcon: React.FC;
|
|
6
|
+
export declare const FullscreenIcon: React.FC<{
|
|
7
|
+
isFullscreen: boolean;
|
|
8
|
+
}>;
|
|
9
|
+
export declare const VolumeOffIcon: React.FC;
|
|
10
|
+
export declare const VolumeOnIcon: React.FC;
|
|
11
|
+
export declare const SettingsIcon: React.FC<{
|
|
12
|
+
iconSize?: number;
|
|
13
|
+
}>;
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { CallbackListener, PlayerEventTypes } from './event-emitter.js';
|
|
3
|
+
import { PlayerEmitter } from './event-emitter.js';
|
|
4
|
+
export { PlayerMethods, PlayerRef, ThumbnailMethods, ThumbnailRef, } from './player-methods.js';
|
|
5
|
+
export { Player, PlayerProps } from './Player.js';
|
|
6
|
+
export type { RenderFullscreenButton, RenderPlayPauseButton, } from './PlayerControls.js';
|
|
7
|
+
export type { ErrorFallback, RenderLoading, RenderPoster } from './PlayerUI.js';
|
|
8
|
+
export { Thumbnail } from './Thumbnail.js';
|
|
9
|
+
export { PreviewSize, Translation } from './utils/preview-size.js';
|
|
10
|
+
export { Size } from './utils/use-element-size.js';
|
|
11
|
+
export type { CallbackListener, PlayerEventTypes as EventTypes };
|
|
12
|
+
export declare const PlayerInternals: {
|
|
13
|
+
PlayerEventEmitterContext: import("react").Context<PlayerEmitter | undefined>;
|
|
14
|
+
PlayerEmitter: typeof PlayerEmitter;
|
|
15
|
+
usePlayer: () => {
|
|
16
|
+
frameBack: (frames: number) => void;
|
|
17
|
+
frameForward: (frames: number) => void;
|
|
18
|
+
isLastFrame: boolean;
|
|
19
|
+
isFirstFrame: boolean;
|
|
20
|
+
emitter: PlayerEmitter;
|
|
21
|
+
playing: boolean;
|
|
22
|
+
play: (e?: import("react").SyntheticEvent<Element, Event> | undefined) => void;
|
|
23
|
+
pause: () => void;
|
|
24
|
+
pauseAndReturnToPlayStart: () => void;
|
|
25
|
+
seek: (newFrame: number) => void;
|
|
26
|
+
getCurrentFrame: () => number;
|
|
27
|
+
isPlaying: () => boolean;
|
|
28
|
+
hasPlayed: boolean;
|
|
29
|
+
};
|
|
30
|
+
usePlayback: ({ loop, playbackRate, moveToBeginningWhenEnded, inFrame, outFrame, }: {
|
|
31
|
+
loop: boolean;
|
|
32
|
+
playbackRate: number;
|
|
33
|
+
moveToBeginningWhenEnded: boolean;
|
|
34
|
+
inFrame: number | null;
|
|
35
|
+
outFrame: number | null;
|
|
36
|
+
}) => void;
|
|
37
|
+
useElementSize: (ref: import("react").RefObject<HTMLElement>, options: {
|
|
38
|
+
triggerOnWindowResize: boolean;
|
|
39
|
+
shouldApplyCssTransforms: boolean;
|
|
40
|
+
}) => import("./utils/use-element-size.js").Size | null;
|
|
41
|
+
calculateCanvasTransformation: ({ previewSize, compositionWidth, compositionHeight, canvasSize, }: {
|
|
42
|
+
previewSize: number | "auto";
|
|
43
|
+
compositionWidth: number;
|
|
44
|
+
compositionHeight: number;
|
|
45
|
+
canvasSize: import("./utils/use-element-size.js").Size;
|
|
46
|
+
}) => {
|
|
47
|
+
centerX: number;
|
|
48
|
+
centerY: number;
|
|
49
|
+
xCorrection: number;
|
|
50
|
+
yCorrection: number;
|
|
51
|
+
scale: number;
|
|
52
|
+
};
|
|
53
|
+
useHoverState: (ref: import("react").RefObject<HTMLDivElement>) => boolean;
|
|
54
|
+
updateAllElementsSizes: () => void;
|
|
55
|
+
calculateScale: ({ canvasSize, compositionHeight, compositionWidth, previewSize, }: {
|
|
56
|
+
previewSize: number | "auto";
|
|
57
|
+
compositionWidth: number;
|
|
58
|
+
compositionHeight: number;
|
|
59
|
+
canvasSize: import("./utils/use-element-size.js").Size;
|
|
60
|
+
}) => number;
|
|
61
|
+
};
|