@clickview/player 0.0.0-rc.13 → 0.0.0-rc.15

package/dist/projects/player/src/plugins/interactive-plugin/interfaces/InteractionProps.d.ts

@@ -0,0 +1,8 @@
+import { Interaction } from 'libs/shared/interfaces';
+export interface InteractionProps<T> {
+    interaction: Interaction;
+    state: T;
+    setState: (value: T) => void;
+    recalculateScroll?: () => void;
+    showFeedback: boolean;
+}

package/dist/projects/player/src/plugins/interactive-plugin/interfaces/InteractiveMode.d.ts

@@ -0,0 +1,4 @@
+export declare enum InteractiveMode {
+    View = 0,
+    Create = 1
+}

package/dist/projects/player/src/plugins/interactive-plugin/interfaces/SubmissionFunction.d.ts

@@ -0,0 +1,2 @@
+import { Interaction } from 'libs/shared/interfaces';
+export declare type SubmissionFunction = (state: any, interaction: Interaction) => Promise<void>;

package/dist/projects/player/src/plugins/interactive-plugin/interfaces/ValidationFunction.d.ts

@@ -0,0 +1,2 @@
+import { Interaction } from 'libs/shared/interfaces';
+export declare type ValidationFunction = (state: any, interaction: Interaction) => boolean;

package/dist/projects/player/src/plugins/interactive-plugin/interfaces/index.d.ts

@@ -0,0 +1,5 @@
+export * from './InteractiveMode';
+export * from './InteractionProps';
+export * from './InteractionComponent';
+export * from './SubmissionFunction';
+export * from './ValidationFunction';

package/dist/projects/player/src/plugins/interactive-plugin/utils/getInteractionComponents.d.ts

@@ -0,0 +1,3 @@
+import { InteractionTypeId } from 'libs/shared/interfaces';
+import { InteractionComponent, InteractiveMode } from 'projects/player/plugins/interactive-plugin/interfaces';
+export declare function getInteractionComponent(typeId: InteractionTypeId, mode: InteractiveMode): InteractionComponent;

package/dist/projects/player/src/plugins/interactive-plugin/utils/getInteractionStateId.d.ts

@@ -0,0 +1,2 @@
+import { Interaction } from 'libs/shared/interfaces';
+export declare function getInteractionStateId(interaction: Interaction): string;

package/dist/projects/player/src/plugins/interactive-plugin/utils/getSubmissionFunction.d.ts

@@ -0,0 +1,3 @@
+import { InteractionTypeId } from 'libs/shared/interfaces';
+import { InteractiveMode, SubmissionFunction } from 'projects/player/plugins/interactive-plugin/interfaces';
+export declare function getSubmissionFunction(typeId: InteractionTypeId, mode: InteractiveMode): SubmissionFunction;

package/dist/projects/player/src/plugins/interactive-plugin/utils/getTimepointStateId.d.ts

@@ -0,0 +1,2 @@
+import { Timepoint } from 'libs/shared/interfaces';
+export declare function getTimepointStateId(timepoint: Timepoint): string;

package/dist/projects/player/src/plugins/interactive-plugin/utils/getValidationFunction.d.ts

@@ -0,0 +1,3 @@
+import { InteractionTypeId } from 'libs/shared/interfaces';
+import { InteractiveMode, ValidationFunction } from 'projects/player/plugins/interactive-plugin/interfaces';
+export declare function getValidationFunction(typeId: InteractionTypeId, mode: InteractiveMode): ValidationFunction;

package/dist/projects/player/src/plugins/interactive-plugin/utils/useInteractiveTrack.d.ts

@@ -0,0 +1,18 @@
+import { VideoJsPlayer } from 'video.js';
+import { InteractiveMode } from 'projects/player/plugins/interactive-plugin/interfaces';
+import { Interactive } from 'libs/shared/interfaces';
+interface useInteractiveTrackResponse {
+    open: boolean;
+    timepoint: any;
+    continueInteractive: () => void;
+    lockPlayer: () => void;
+    unlockPlayer: () => void;
+}
+interface useInteractiveOptions {
+    player: VideoJsPlayer;
+    track: TextTrack;
+    interactive: Interactive;
+    mode: InteractiveMode;
+}
+export declare function useInteractiveTrack(options: useInteractiveOptions): useInteractiveTrackResponse;
+export {};

package/dist/projects/player/src/plugins/localcache-plugin/LocalCache.d.ts

@@ -0,0 +1,12 @@
+import { LocalCacheAddress } from 'projects/player/interfaces/models/PlaybackObject';
+export declare class LocalCache {
+    name: string;
+    playbackProfile?: string;
+    address: URL;
+    constructor(address: LocalCacheAddress);
+    getUrl(url: string): string;
+    /**
+     * Pings the local cache. Returns true if the local cache is accessible
+     */
+    ping(): Promise<boolean>;
+}

package/dist/projects/player/src/plugins/localcache-plugin/compontents/local-cache-indicator.d.ts

@@ -0,0 +1 @@
+import './local-cache-indicator.scss';

package/dist/projects/player/src/plugins/localcache-plugin/localcache-middleware.d.ts

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

package/dist/projects/player/src/plugins/localcache-plugin/localcache-plugin.d.ts

@@ -0,0 +1,62 @@
+import { LocalCacheAddress } from 'projects/player/interfaces/models/PlaybackObject';
+import videojs, { VideoJsPlayer } from 'video.js';
+import { LocalCache } from './LocalCache';
+import 'projects/player/plugins/localcache-plugin/localcache-middleware';
+import 'projects/player/plugins/localcache-plugin/compontents/local-cache-indicator';
+declare const Plugin: {
+    new (player: VideoJsPlayer, options?: any): videojs.Plugin;
+    prototype: videojs.Plugin;
+    BASE_PLUGIN_NAME: string;
+    deregisterPlugin(name: string): void;
+    getPlugin(name: string): any;
+    getPluginVersion(name: string): string;
+    getPlugins(names?: string[]): {
+        [name: string]: videojs.Plugin;
+    };
+    isBasic(plugin: string | (() => any)): boolean;
+    registerPlugin<T, K>(name: string, plugin: (this: VideoJsPlayer, ...options: K[]) => T): (...options: K[]) => T;
+    registerPlugin<T_1 extends any>(name: string, plugin: T_1): () => T_1;
+};
+interface LocalCachePluginOptions {
+    localCacheAddresses: LocalCacheAddress[];
+    enabled: boolean;
+}
+export declare class LocalCachePlugin extends Plugin {
+    private localCaches_;
+    private activeLocalCache_;
+    private enabled_;
+    private logger_;
+    constructor(player: VideoJsPlayer, options?: LocalCachePluginOptions);
+    get isEnabled(): boolean;
+    /**
+     * Enable local cache support
+     */
+    enable(): void;
+    /**
+     * Disable local cache support
+     */
+    disable(): void;
+    /**
+     * Get the active local cache
+     */
+    getActiveLocalCache(): Promise<LocalCache | null>;
+    /**
+     * Resets the active local cache and starts the checks to find a new active local cache
+     */
+    resetActiveLocalCache(): void;
+    /**
+     * Clears the active local cache
+     */
+    clearActiveLocalCache(): void;
+    dispose(): void;
+    private initialize;
+    private onPlayerError;
+    private getActiveLocalCacheInternal;
+    private onLocalCacheChange;
+}
+declare module 'video.js' {
+    interface VideoJsPlayer {
+        localCache(options?: LocalCachePluginOptions): LocalCachePlugin;
+    }
+}
+export {};

package/dist/projects/player/src/plugins/next-video-plugin/components/up-next/up-next.d.ts

@@ -0,0 +1 @@
+import './up-next.scss';

package/dist/projects/player/src/plugins/next-video-plugin/next-video-plugin.d.ts

@@ -0,0 +1,52 @@
+import videojs, { VideoJsPlayer } from 'video.js';
+import { NextVideo } from 'projects/player/interfaces/NextVideo';
+import 'projects/player/plugins/next-video-plugin/components/up-next/up-next';
+declare const Plugin: {
+    new (player: VideoJsPlayer, options?: any): videojs.Plugin;
+    prototype: videojs.Plugin;
+    BASE_PLUGIN_NAME: string;
+    deregisterPlugin(name: string): void;
+    getPlugin(name: string): any;
+    getPluginVersion(name: string): string;
+    getPlugins(names?: string[]): {
+        [name: string]: videojs.Plugin;
+    };
+    isBasic(plugin: string | (() => any)): boolean;
+    registerPlugin<T, K>(name: string, plugin: (this: VideoJsPlayer, ...options: K[]) => T): (...options: K[]) => T;
+    registerPlugin<T_1 extends any>(name: string, plugin: T_1): () => T_1;
+};
+declare class NextVideoPlugin extends Plugin {
+    private shouldPlayNextVideo;
+    private hasLocalStorage;
+    private chapterTrack;
+    private upNextRendered;
+    private upNextTimepoint;
+    /**
+     * @Matt These values are intended to be used to render the up next widget
+     * and to be called when the up next widget is clicked on
+     * or the video ends.
+     *
+     * Note: Cam suggested we check if there is a chapter called "Credits"
+     * and trigger the up next widget then, rather than in the last 5 seconds
+     */
+    private nextVideo;
+    private callback;
+    constructor(player: VideoJsPlayer);
+    private initialize;
+    setNextVideo(nextVideo: NextVideo, callback: () => void): void;
+    getShouldPlayNext(): boolean;
+    setShouldPlayNext(val: boolean): void;
+    private setChapterTrack;
+    private bindListeners;
+    private unbindListeners;
+    private onTimeUpdate;
+    private showUpNext;
+    private hideUpNext;
+    private testHasLocalStorage;
+}
+declare module 'video.js' {
+    interface VideoJsPlayer {
+        nextVideoPlugin(): NextVideoPlugin;
+    }
+}
+export {};

package/dist/projects/player/src/plugins/open-externally-plugin/components/open-externally-button.d.ts

@@ -0,0 +1 @@
+import './open-externally-button.scss';

package/dist/projects/player/src/plugins/open-externally-plugin/interfaces/ExternalLinkOptions.d.ts

@@ -0,0 +1,3 @@
+export interface ExternalLinkOptions {
+    currentTime: number;
+}

package/dist/projects/player/src/plugins/open-externally-plugin/open-externally-plugin.d.ts

@@ -0,0 +1 @@
+import 'projects/player/plugins/open-externally-plugin/components/open-externally-button';

package/dist/projects/player/src/plugins/persist-volume-plugin/persist-volume-plugin.d.ts

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

package/dist/projects/player/src/plugins/persist-volume-plugin/persist-volume-plugin.test.d.ts

@@ -0,0 +1 @@
+import '../../plugins/persist-volume-plugin/persist-volume-plugin';

package/dist/projects/player/src/plugins/progress-reporter-plugin/progress-reporter-plugin.d.ts

@@ -0,0 +1,9 @@
+interface Event {
+    time: number;
+    type: string;
+}
+export interface ProgressEvent {
+    start: Event;
+    end: Event;
+}
+export {};

package/dist/projects/player/src/plugins/progressive-files-plugin/ProgressiveFilesPluginOptions.d.ts

@@ -0,0 +1,4 @@
+import { Source } from 'projects/player/plugins/progressive-files-plugin/interfaces/Source';
+export interface ProgressiveFilesPluginOptions {
+    sources: Source[];
+}

package/dist/projects/player/src/plugins/progressive-files-plugin/ProgressiveRepresentation.d.ts

@@ -0,0 +1,10 @@
+import { Representation } from 'videojs-contrib-quality-levels';
+import { Source } from 'projects/player/plugins/progressive-files-plugin/interfaces/Source';
+import { ProgressiveFilesPlugin } from 'projects/player/plugins/progressive-files-plugin/progressive-files-plugin';
+export declare class ProgressiveRepresentation implements Representation {
+    id: string;
+    private plugin;
+    private source;
+    constructor(plugin: ProgressiveFilesPlugin, source: Source);
+    enabled(enabled: boolean): boolean;
+}

package/dist/projects/player/src/plugins/progressive-files-plugin/interfaces/Source.d.ts

@@ -0,0 +1,6 @@
+export interface Source {
+    id: string;
+    url: string;
+    mimeType: string;
+    default: boolean;
+}

package/dist/projects/player/src/plugins/progressive-files-plugin/progressive-files-plugin.d.ts

@@ -0,0 +1,38 @@
+import videojs, { VideoJsPlayer } from 'video.js';
+import { Source } from 'projects/player/plugins/progressive-files-plugin/interfaces/Source';
+import { ProgressiveFilesPluginOptions } from 'projects/player/plugins/progressive-files-plugin/ProgressiveFilesPluginOptions';
+declare const Plugin: {
+    new (player: VideoJsPlayer, options?: any): videojs.Plugin;
+    prototype: videojs.Plugin;
+    BASE_PLUGIN_NAME: string;
+    deregisterPlugin(name: string): void;
+    getPlugin(name: string): any;
+    getPluginVersion(name: string): string;
+    getPlugins(names?: string[]): {
+        [name: string]: videojs.Plugin;
+    };
+    isBasic(plugin: string | (() => any)): boolean;
+    registerPlugin<T, K>(name: string, plugin: (this: VideoJsPlayer, ...options: K[]) => T): (...options: K[]) => T;
+    registerPlugin<T_1 extends any>(name: string, plugin: T_1): () => T_1;
+};
+export declare class ProgressiveFilesPlugin extends Plugin {
+    private sources;
+    private _currentSource;
+    private qualityLevels;
+    constructor(player: VideoJsPlayer, options: ProgressiveFilesPluginOptions);
+    get currentSource(): Source;
+    /**
+     * Sets the current player source. If the id cannot be found, the current source is returned
+     * @param id the id of the source to set
+     */
+    setSource(id: string): Source;
+    getSourceById(id: string): Source;
+    private populateSources;
+    private sourceChangeUpdateQualityLevels;
+}
+declare module 'video.js' {
+    interface VideoJsPlayer {
+        progressiveFiles(options: ProgressiveFilesPluginOptions): void;
+    }
+}
+export {};

package/dist/projects/player/src/plugins/touch-controls-plugin/components/touch-controls/touch-controls.d.ts

@@ -0,0 +1,59 @@
+import videojs, { VideoJsPlayer } from 'video.js';
+import './touch-controls.scss';
+declare const Component: {
+    new (player: VideoJsPlayer, options?: videojs.ComponentOptions, ready?: videojs.Component.ReadyCallback): videojs.Component;
+    prototype: videojs.Component;
+    getComponent(name: "button" | "Button"): {
+        new (player: VideoJsPlayer, options?: videojs.ComponentOptions): videojs.Button;
+        prototype: videojs.Button;
+    };
+    getComponent(name: "ClickableComponent" | "clickablecomponent"): {
+        new (player: VideoJsPlayer, options?: videojs.ComponentOptions): videojs.ClickableComponent;
+        prototype: videojs.ClickableComponent;
+    };
+    getComponent(name: "ModalDialog" | "modaldialog"): {
+        new (player: VideoJsPlayer, options?: videojs.ModalDialogOptions): videojs.ModalDialog;
+        prototype: videojs.ModalDialog;
+    };
+    getComponent(name: "menu" | "Menu"): {
+        new (player: VideoJsPlayer, options?: videojs.MenuOptions): videojs.Menu;
+        prototype: videojs.Menu;
+    };
+    getComponent(name: "MenuButton" | "menubutton"): {
+        new (player: VideoJsPlayer, options?: videojs.MenuButtonOptions): videojs.MenuButton;
+        prototype: videojs.MenuButton;
+    };
+    getComponent(name: "menuitem" | "MenuItem"): {
+        new (player: VideoJsPlayer, options?: videojs.MenuItemOptions): videojs.MenuItem;
+        prototype: videojs.MenuItem;
+    };
+    getComponent(name: "MouseTimeDisplay" | "mouseTimeDisplay"): {
+        new (player: VideoJsPlayer, options?: videojs.ComponentOptions): videojs.MouseTimeDisplay;
+        prototype: videojs.MouseTimeDisplay;
+    };
+    getComponent(name: "Spacer" | "spacer"): {
+        new (player: VideoJsPlayer, options?: videojs.ComponentOptions, ready?: videojs.Component.ReadyCallback): videojs.Spacer;
+        prototype: videojs.Spacer;
+    };
+    getComponent(name: "Player" | "player"): {
+        new (player: VideoJsPlayer, options?: import("video.js").VideoJsPlayerOptions): VideoJsPlayer;
+        prototype: VideoJsPlayer;
+        getTagSettings(tag: Element): any;
+    };
+    getComponent(name: "timeTooltip" | "TimeTooltip"): {
+        new (player: VideoJsPlayer, options?: videojs.ComponentOptions): videojs.TimeToolTip;
+        prototype: videojs.TimeToolTip;
+    };
+    getComponent(name: string): any;
+    registerComponent(name: string, ComponentToRegister: any): any;
+};
+export declare class TouchControls extends Component {
+    private el_;
+    private timeoutId;
+    constructor(player: VideoJsPlayer, options?: videojs.ComponentOptions);
+    buildCSSClass(): string;
+    createEl(tagName?: string, properties?: any, attributes?: any): Element;
+    setUi(amount: number, timeout: number): void;
+    removeText(): void;
+}
+export {};

package/dist/projects/player/src/plugins/touch-controls-plugin/touch-controls-plugin.d.ts

@@ -0,0 +1 @@
+import './components/touch-controls/touch-controls';

package/dist/projects/player/src/react/CreateClipPlayer.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { CreateClipPlayerOptions } from 'projects/player/players/create-clip-player';
+export declare function ClickViewCreateClipPlayer(props: CreateClipPlayerOptions): React.ReactElement;

package/dist/projects/player/src/react/InteractivePlayer.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { InteractiveMode } from 'projects/player/plugins/interactive-plugin/interfaces';
+import { InteractivePlayer, InteractivePlayerOptions } from 'projects/player/players/interactive-player';
+interface ClickViewInteractivePlayerProps {
+    onReady?: (player: InteractivePlayer) => void;
+    mode?: InteractiveMode;
+}
+export declare function ClickViewInteractivePlayer(props: InteractivePlayerOptions & ClickViewInteractivePlayerProps): React.ReactElement;
+export {};

package/dist/projects/player/src/react/Player.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { Player, PlayerOptions } from 'projects/player/players/player';
+export interface ClickViewPlayerProps extends Omit<PlayerOptions, 'playerApi'> {
+    playerApi?: string;
+    className?: string;
+    onReady?: (player: Player) => void;
+    onError?: (error: any) => void;
+    onDispose?: () => void;
+}
+export declare function ClickViewPlayer(props: ClickViewPlayerProps): React.ReactElement;

package/dist/projects/player/src/react/react-component.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import videojs, { VideoJsPlayer } from 'video.js';
+import { HashObject } from 'libs/common/react/interfaces';
+declare type BaseReactComponentCtor<T> = new (player: VideoJsPlayer, options?: T) => videojs.Component;
+interface RootNodeOptions {
+    tagName?: string;
+    properties?: any;
+    attributes?: any;
+}
+export declare function getReactComponent<T extends HashObject>(componentCtor: (player: VideoJsPlayer, options?: T) => React.ReactElement, options?: RootNodeOptions): BaseReactComponentCtor<T>;
+export {};

package/dist/projects/player/src/services/analytics-service.d.ts

@@ -0,0 +1,15 @@
+import { ProgressEvent } from 'projects/player/plugins/progress-reporter-plugin/progress-reporter-plugin';
+declare class StaticAnalyticsService {
+    private static instance;
+    private collectionApiClient;
+    constructor();
+    static get Instance(): StaticAnalyticsService;
+    logStream(): void;
+    logVideoProgress(events: ProgressEvent[]): void;
+    private initialize;
+    private setupCollectionApiClient;
+    private getCurrentUser;
+    private getActionContext;
+}
+export declare const AnalyticsService: StaticAnalyticsService;
+export {};

package/dist/projects/player/src/utils/ajax-helper.d.ts

@@ -0,0 +1,6 @@
+declare class StaticAjaxHelper {
+    get<T>(url: string): Promise<T>;
+    private parseResponse;
+}
+export declare const AjaxHelper: StaticAjaxHelper;
+export {};

package/dist/projects/player/src/utils/fn.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Wraps the given function, `fn`, with a new function that only invokes `fn`
+ * at most once per every `wait` milliseconds.
+ *
+ * @function
+ * @param    {Function} fn
+ *           The function to be throttled.
+ *
+ * @param    {number}   wait
+ *           The number of milliseconds by which to throttle.
+ *
+ * @return   {Function}
+ */
+export declare const throttle: (fn: any, wait: any) => any;

package/dist/projects/player/src/utils/formatTime.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Direct copy from format-time.js within video.js
+ * Unfortunately video.js doesn't expose this
+ */
+export declare function formatTime(seconds: number, guide?: number): string;

package/dist/projects/player/src/utils/hotkeys.d.ts

@@ -0,0 +1,5 @@
+/**
+ * handleHotKeys is to be used as userActions.hotkeys in VideoJsPlayerOptions.
+ * `this` will be a reference to the player.
+ */
+export declare function handleHotKeys(event: KeyboardEvent): void;

package/dist/projects/player/src/utils/quality-helper.d.ts

@@ -0,0 +1,19 @@
+import { QualityLevel, QualityLevelList } from 'videojs-contrib-quality-levels';
+export declare class QualityHelper {
+    /**
+     * Returns a list of known profiles, ordered from best to worst
+     */
+    static getKnownProfiles(): string[];
+    /**
+     * Enables the provided profile, or the next best option
+     * @param qualities
+     * @param profile The profile which we want to select
+     */
+    static enableProfileOrNextBest(qualities: QualityLevelList, profile: string): QualityLevel | null;
+    /**
+     * Gets the next best quality for the given profile
+     * @param qualities
+     * @param profile
+     */
+    private static getNextBestQuality;
+}

package/dist/projects/player/src/utils/quality-helper.test.d.ts

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

package/dist/projects/player/src/utils/scrollbar-helper.d.ts

@@ -0,0 +1,6 @@
+import videojs from 'video.js';
+export declare const ScrollbarHelper: {
+    initMenuScrollbar(component: videojs.MenuButton): void;
+    unMountScrollbar(component: videojs.MenuButton): void;
+    getMenuEl(component: videojs.MenuButton): HTMLElement;
+};

package/dist/projects/player/src/utils/track-helper.d.ts

@@ -0,0 +1,7 @@
+import { VideoJsPlayer } from 'video.js';
+declare type TrackKind = 'metadata' | 'chapters';
+declare type TrackLabel = 'interactive' | 'thumbnails' | false;
+export declare const TrackHelper: {
+    useTrack(player: VideoJsPlayer, kind: TrackKind, label: TrackLabel, callback: (track: TextTrack) => void): void;
+};
+export {};

package/dist/projects/player/test/players/test-player.d.ts

@@ -0,0 +1,17 @@
+import { VideoJsPlayer } from 'video.js';
+import { BasePlayer, BasePlayerOptions } from '../../src/players/base-player';
+export interface TestPlayerOptions extends BasePlayerOptions {
+    configurePlugins?: (player: VideoJsPlayer) => void;
+}
+export declare class TestPlayer extends BasePlayer {
+    protected options: TestPlayerOptions;
+    player: VideoJsPlayer;
+    constructor(id: string | Element, options: TestPlayerOptions);
+    /**
+     * TODO: Look at reimplementing this. At the moment it's causing
+     * problems because the test will dispose of the player before the
+     * fetch has completed.
+     */
+    protected fetch(): Promise<void>;
+    protected configurePlugins(): void;
+}

package/dist/projects/player/test/utils/test-helpers.d.ts

@@ -0,0 +1,8 @@
+import { TestPlayer, TestPlayerOptions } from '../players/test-player';
+interface PlayerOptions extends Omit<TestPlayerOptions, 'viewKey'> {
+}
+export declare const TestHelpers: {
+    makeEl(): HTMLElement;
+    makePlayer(playerOptions?: PlayerOptions, containerEl?: HTMLElement): TestPlayer;
+};
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clickview/player",
-  "version": "0.0.0-rc.13",
+  "version": "0.0.0-rc.15",
   "description": "ClickView Player",
   "main": "dist/player-app.js",
   "scripts": {
@@ -28,7 +28,7 @@
     "@babel/core": "7.11.6",
     "@clickview/eslint-config": "1.0.0",
     "@clickview/player-font": "0.0.1",
-    "@clickview/tooling": "0.0.19-rc.2",
+    "@clickview/tooling": "0.0.19-rc.4",
     "@storybook/react": "6.0.26",
     "@types/simplebar": "5.1.1",
     "@types/video.js": "7.3.11",
@@ -37,7 +37,7 @@
     "webpack-dev-server": "3.11.0"
   },
   "dependencies": {
-    "@clickview/styles": "1.0.12-rc.2",
+    "@clickview/styles": "1.0.12-rc.4",
     "keycode": "2.2.0",
     "simplebar": "5.3.0",
     "simplebar-react": "2.3.0",