@ldelia/react-media 0.4.3 → 0.4.5

package/dist/components/__tests__/timeline/timeline.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './reproduction-widget';
+export * from './timeline';

package/dist/components/reproduction-widget/ReproductionWidget.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { Reproduction } from './models/Reproduction';
+interface BaseProps {
+    trainingMode: boolean;
+    onInit: (reproduction: Reproduction) => void;
+}
+interface TrainingProps extends BaseProps {
+    trainingMode: true;
+    videoId: string;
+}
+interface NonTrainingProps extends BaseProps {
+    trainingMode: false;
+    videoId?: never;
+}
+export type ReproductionWidgetProps = TrainingProps | NonTrainingProps;
+export declare const ReproductionWidget: ({ trainingMode, videoId, onInit, }: ReproductionWidgetProps) => React.JSX.Element;
+export {};

package/dist/components/reproduction-widget/index.d.ts

@@ -0,0 +1,2 @@
+export * from './models/Reproduction';
+export * from './ReproductionWidget';

package/dist/components/reproduction-widget/index.js

@@ -1 +1,2 @@
+export * from './models/Reproduction';
 export * from './ReproductionWidget';

package/dist/components/reproduction-widget/inner-players/PlayAlongInnerPlayer.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface Props {
+    onReady: (event: {
+        target: string;
+    }) => void;
+}
+export declare const PlayAlongInnerPlayer: ({ onReady }: Props) => React.JSX.Element;
+export {};

package/dist/components/reproduction-widget/inner-players/YouTubeInnerPlayer.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { YouTubePlayer as InnerYouTubePlayer } from 'react-youtube';
+interface Props {
+    videoId: string;
+    onReady: (event: {
+        target: InnerYouTubePlayer;
+    }) => void;
+}
+export declare const YouTubeInnerPlayer: ({ videoId, onReady }: Props) => React.JSX.Element;
+export {};

package/dist/components/reproduction-widget/models/Player/PlayAlongPlayer.d.ts

@@ -0,0 +1,30 @@
+declare const dispatchOnReadyHandlers: unique symbol;
+declare const dispatchOnFinishHandlers: unique symbol;
+export declare class PlayAlongPlayer {
+    private readonly duration;
+    private currentTime;
+    private isRunning;
+    private currentPlaybackRate;
+    private innerPlayer;
+    private interval;
+    private [dispatchOnReadyHandlers];
+    private [dispatchOnFinishHandlers];
+    static get EVENTS(): {
+        readonly READY: "READY";
+        readonly FINISH: "FINISH";
+    };
+    constructor(duration: number, innerPlayer: string);
+    private setInnerPlayer;
+    play(): void;
+    pause(): void;
+    stop(): void;
+    seekTo(seconds: number): void;
+    getCurrentTime(): number;
+    getDuration(): number;
+    isAvailable(): boolean;
+    getAvailablePlaybackRates(): number[];
+    setPlaybackRate(playbackRate: number): void;
+    on(eventName: keyof typeof PlayAlongPlayer.EVENTS, handler: () => void): number | undefined;
+    dispatch(eventName: keyof typeof PlayAlongPlayer.EVENTS): void;
+}
+export {};

package/dist/components/reproduction-widget/models/Player/PlayerEvents.d.ts

@@ -0,0 +1,4 @@
+export declare const PLAYER_EVENTS: {
+    readonly READY: "READY";
+    readonly FINISH: "FINISH";
+};

package/dist/components/reproduction-widget/models/Player/YouTubePlayer.d.ts

@@ -0,0 +1,30 @@
+import { YouTubePlayer as InnerYouTubePlayer } from 'react-youtube';
+import { PlayAlongPlayer } from './PlayAlongPlayer';
+declare const dispatchOnReadyHandlers: unique symbol;
+declare const dispatchOnFinishHandlers: unique symbol;
+export declare class YouTubePlayer {
+    private currentTime;
+    private isRunning;
+    private innerPlayer;
+    private [dispatchOnReadyHandlers];
+    private [dispatchOnFinishHandlers];
+    static get EVENTS(): {
+        readonly READY: "READY";
+        readonly FINISH: "FINISH";
+    };
+    constructor(innerPlayer: InnerYouTubePlayer);
+    private setInnerPlayer;
+    getInnerPlayer(): any;
+    play(): void;
+    pause(): void;
+    stop(): void;
+    seekTo(seconds: number): void;
+    getCurrentTime(): any;
+    getDuration(): any;
+    getAvailablePlaybackRates(): any;
+    setPlaybackRate(playbackRate: number): void;
+    isAvailable(): boolean;
+    on(eventName: keyof typeof PlayAlongPlayer.EVENTS, handler: () => void): number | undefined;
+    dispatch(eventName: keyof typeof PlayAlongPlayer.EVENTS): void;
+}
+export {};

package/dist/components/reproduction-widget/models/Reproduction.d.ts

@@ -0,0 +1,66 @@
+import { ReproductionBuilder } from './ReproductionBuilder';
+import { PlayAlongPlayer } from './Player/PlayAlongPlayer';
+import { YouTubePlayer } from './Player/YouTubePlayer';
+type Player = PlayAlongPlayer | YouTubePlayer;
+declare const dispatchOnReadyHandlers: unique symbol;
+declare const dispatchOnSongStartHandlers: unique symbol;
+declare const dispatchOnCountingInHandlers: unique symbol;
+declare const dispatchOnPlayHandlers: unique symbol;
+declare const dispatchOnPlayingHandlers: unique symbol;
+declare const dispatchOnPausedHandlers: unique symbol;
+declare const dispatchOnFinishHandlers: unique symbol;
+export declare class Reproduction {
+    private player;
+    private requiresCountingIn;
+    private songTempo;
+    private state;
+    private ready;
+    private interval;
+    private countingInCounter;
+    private [dispatchOnReadyHandlers];
+    private [dispatchOnSongStartHandlers];
+    private [dispatchOnCountingInHandlers];
+    private [dispatchOnPlayHandlers];
+    private [dispatchOnPlayingHandlers];
+    private [dispatchOnPausedHandlers];
+    private [dispatchOnFinishHandlers];
+    static get EVENTS(): {
+        readonly READY: "READY";
+        readonly START: "START";
+        readonly COUNTING_IN: "COUNTING_IN";
+        readonly PLAY: "PLAY";
+        readonly PLAYING: "PLAYING";
+        readonly PAUSED: "PAUSED";
+        readonly FINISH: "FINISH";
+    };
+    static get STATES(): {
+        STOPPED: number;
+        COUNTING_IN: number;
+        PLAYING: number;
+        PAUSED: number;
+    };
+    constructor(player: Player, requiresCountingIn: boolean, songTempo: number);
+    on(eventName: keyof typeof Reproduction.EVENTS, handler: () => void): number | undefined;
+    dispatch(eventName: keyof typeof Reproduction.EVENTS): void;
+    private countIn;
+    start(): void;
+    play(): void;
+    pause(): void;
+    stop(): void;
+    isReady(): boolean;
+    isPlaying(): boolean;
+    isStopped(): boolean;
+    isPaused(): boolean;
+    isCountingIn(): boolean;
+    getPlayer(): Player;
+    getTempo(): number;
+    getCurrentTime(): any;
+    getDuration(): any;
+    seekTo(seconds: number): void;
+    getAvailablePlaybackRates(): any;
+    setPlaybackRate(playbackRate: number): void;
+    isAvailable(): boolean;
+    getBPMInterval(): number;
+    static newBuilder(): ReproductionBuilder;
+}
+export {};

package/dist/components/reproduction-widget/models/ReproductionBuilder.d.ts

@@ -0,0 +1,16 @@
+import { Reproduction } from './Reproduction';
+import { YouTubePlayer as InnerYouTubePlayer } from 'react-youtube';
+export declare class ReproductionBuilder {
+    private trainingMode;
+    private requiresCountingIn;
+    private songDuration;
+    private songTempo;
+    private innerPlayer;
+    constructor();
+    withSongDuration(songDuration: number): this;
+    withSongTempo(songTempo: number): this;
+    withTrainingMode(trainingMode: boolean): this;
+    withCountingIn(requiresCountingIn: boolean): this;
+    withInnerPlayer(innerPlayer: InnerYouTubePlayer | string): this;
+    createReproduction(): Reproduction;
+}

package/dist/components/timeline/RangeSelectorCanvas/RangeSelectorCanvas.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export interface RangeSelectorCanvasProps {
+    selectedRange: number[];
+    onChange: (value: number) => void;
+    onRangeChange: (value: number[]) => void;
+}
+declare const _default: React.NamedExoticComponent<RangeSelectorCanvasProps>;
+export default _default;

package/dist/components/timeline/Timeline.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface TimelineProps {
+    duration: number;
+    value: number;
+    zoomLevel?: number;
+    className?: string;
+    selectedRange?: number[];
+    withTimeBlocks?: boolean;
+    onChange?: (value: number) => void;
+    onRangeChange?: (value: number[]) => void;
+}
+export declare const Timeline: React.FC<TimelineProps>;

package/dist/components/timeline/TimelineCanvas/TickTime.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export type Props = {
+    start: number;
+    leftPosition: string;
+};
+declare const TickTime: React.FC<Props>;
+export default TickTime;

package/dist/components/timeline/TimelineCanvas/TickTimeCollectionDisplay.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface TickTimeCollectionDisplayProps {
+    tickTimes: number[];
+}
+declare const TickTimeCollectionDisplay: React.FC<TickTimeCollectionDisplayProps>;
+export default TickTimeCollectionDisplay;

package/dist/components/timeline/TimelineCanvas/TimelineCanvas.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export interface VaLueLineCanvasProps {
+    duration: number;
+    withTimeBlocks: boolean;
+}
+declare const TimelineCanvas: React.ForwardRefExoticComponent<VaLueLineCanvasProps & React.RefAttributes<HTMLCanvasElement>>;
+export default TimelineCanvas;

package/dist/components/timeline/TimelineCanvas/drawTimeBlocksOnCanvas.d.ts

@@ -0,0 +1,2 @@
+import { ZoomContextType } from '../ZoomContext/ZoomContext';
+export declare const drawTimeBlocksOnCanvas: (canvas: HTMLCanvasElement, blockStartingTimes: number[], zoomContextValue: ZoomContextType) => void;

package/dist/components/timeline/TimelineValue/TimelineValue.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface Props {
+    canvasRef: React.RefObject<HTMLCanvasElement>;
+    value: number;
+}
+export declare const TimelineValue: React.FC<Props>;
+export {};

package/dist/components/timeline/ZoomContext/ZoomContext.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export type ZoomContextType = {
+    blockOffset: number;
+    pixelsInSecond: number;
+    timelineWrapperWidth: number;
+};
+export declare const ZoomContext: React.Context<ZoomContextType>;

package/dist/components/timeline/constants.d.ts

@@ -0,0 +1 @@
+export declare const zoomLevelConfigurations: number[][];

package/dist/components/timeline/index.d.ts

@@ -0,0 +1 @@
+export * from './Timeline';

package/dist/components/timeline/utils/utils.d.ts

@@ -0,0 +1,7 @@
+import { ZoomContextType } from '../ZoomContext/ZoomContext';
+export declare const secondsToPixel: (zoomContextValue: ZoomContextType, seconds: number) => number;
+export declare const pixelToSeconds: (zoomContextValue: ZoomContextType, pixel: number) => number;
+export declare const getComputedElementWidth: (element: HTMLElement) => number;
+export declare const numberToPxString: (number: number) => string;
+export declare const getTimelineWrapperWidth: (timeLineContainerWidth: number, zoomLevel: number) => number;
+export declare function getBlockOffsetForZoomLevel(zoomLevel: number, duration: number, timelineWrapperWidth: number): number;

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from './components';

package/dist/setupTests.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/stories/reproduction-widget.stories.d.ts

@@ -0,0 +1,4 @@
+import { ReproductionWidgetProps } from '../components/reproduction-widget';
+declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/dist/types-a5624094").R, import("@storybook/csf").Args>;
+export default _default;
+export declare const Default: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/dist/types-a5624094").R, ReproductionWidgetProps>;

package/dist/stories/timeline.stories.d.ts

@@ -0,0 +1,9 @@
+import { TimelineProps } from '../components/timeline';
+import './timeline.stories.custom.css';
+declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/dist/types-a5624094").R, import("@storybook/csf").Args>;
+export default _default;
+export declare const Default: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/dist/types-a5624094").R, TimelineProps>;
+export declare const WithSelectedRange: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/dist/types-a5624094").R, TimelineProps>;
+export declare const WithCustomClassName: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/dist/types-a5624094").R, TimelineProps>;
+export declare const WithoutTimeBlocks: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/dist/types-a5624094").R, TimelineProps>;
+export declare const Minimalist: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/dist/types-a5624094").R, TimelineProps>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ldelia/react-media",
-  "version": "0.4.3",
+  "version": "0.4.5",
   "description": "A React components collection for media-related features.",
   "private": false,
   "keywords": [