@tivio/sdk-react 2.3.4 → 2.4.2-alpha

package/dist/services/bundleLoader.d.ts

@@ -3,6 +3,9 @@
  * nangu.TV, a.s PROPRIETARY/CONFIDENTIAL. Use is subject to license terms.
  */
 import { InternalConfig, RemoteBundleState, TivioBundle } from 'src/types/bundle.types';
+/**
+ * @throws if fetch fails
+ */
 declare const fetchBundle: (secret: string, conf: InternalConfig) => Promise<string>;
 /**
  * Fetch & load CommonJS remote module.

package/dist/services/bundlePromise.d.ts

@@ -1,2 +1,4 @@
+import { TivioBundle } from '../types/bundle.types';
 import type { RemoteBundleState } from './bundleLoader';
+export declare let tivioBundle: TivioBundle | null;
 export declare const bundlePromise: Promise<RemoteBundleState>;

package/dist/services/localFetch/coreReactDomDist.d.ts

@@ -0,0 +1 @@
+export declare const loadBundleFromDist: () => import("../../types/bundle.types").TivioBundle;

package/dist/services/localFetch/none.d.ts

@@ -0,0 +1 @@
+export declare const loadBundleFromDist: () => void;

package/dist/types/bundle.types.d.ts

@@ -1,33 +1,46 @@
-import { SubscribeToTaggedVideos } from '@tivio/common';
+import { Currency, SubscribeToTaggedVideos, UseCancelSubscription } from '@tivio/common';
 import { ComponentType } from 'react';
 import { Logger } from '../services/logger';
 import { FetchPackage } from '../services/packageLoader';
 import { Disposer, Empty, Nullable } from './common';
 import { Channel, Language, RemoteProviderProps, Section, TivioSources, TivioWidgetProps, UserData, WebPlayerProps, Widget } from './types';
 import type { AdSource, PlayerWrapper } from './customPlayer.types';
-import type { Monetization, QerkoPaymentInfo, Screen, SubscribeToItemsInRow, SubscribeToRowsInScreen, SubscribeToScreen, TvAppProps, Video, User, Purchase } from '@tivio/common';
+import type { Monetization, Purchase, QerkoPaymentInfo, Screen, SubscribeToItemsInRow, SubscribeToRowsInScreen, SubscribeToScreen, TvAppProps, User, UseSearch, Video } from '@tivio/common';
 import type React from 'react';
 declare type Settings = {
     onSetUser: (handler: (userId: string, userPayload: unknown) => void) => void;
     setUser: (userId: string, userPayload: unknown) => void;
 };
+interface PlayerCapability {
+    codec: 'h264' | 'h265';
+    encryption: 'fairplay' | 'none' | 'playready' | 'widevine';
+    protocol: 'dash' | 'hls';
+}
 declare type InternalConfig = {
-    enable?: boolean;
-    secret: string | null;
-    verbose?: boolean;
-    resolverUrl: string;
+    /**
+     * @private URL of remote code bundle to be fetched directly (without using resolver)
+     */
     bundleUrlOverride?: string;
+    currency: Currency;
+    deviceCapabilities: PlayerCapability[];
     disableUnmounting?: boolean;
-    logger?: Logger | null;
-    fetchPackage: FetchPackage;
-    pubSub: PubSub;
-    LoaderComponent?: ComponentType;
+    enable?: boolean;
+    enableSentry?: boolean;
     ErrorComponent?: ComponentType<{
         error: string | null;
     }>;
+    fetchPackage: FetchPackage;
     language?: string;
+    LoaderComponent?: ComponentType;
+    logger?: Logger | null;
+    pubSub: PubSub;
+    /**
+     * @private URL of resolver. Resolver is a script used to fetch remove code bundle
+     */
+    resolverUrl: string;
     sdkVersion: string;
-    enableSentry?: boolean;
+    secret: string | null;
+    verbose?: boolean;
 };
 declare type Events = {
     'on-ready': RemoteBundleState;
@@ -37,7 +50,9 @@ interface PubSub {
     publish: <K extends keyof Events>(triggerName: K, payload: Events[K]) => Empty;
     subscribe: <K extends keyof Events>(triggerName: K, onMessage: (data: Events[K]) => Empty) => Disposer;
 }
-declare type Config = Pick<InternalConfig, 'enable' | 'secret' | 'verbose' | 'logger' | 'disableUnmounting' | 'bundleUrlOverride' | 'LoaderComponent' | 'ErrorComponent' | 'language' | 'enableSentry'>;
+declare type Config = Pick<InternalConfig, 'bundleUrlOverride' | 'currency' | 'disableUnmounting' | 'enable' | 'enableSentry' | 'ErrorComponent' | 'language' | 'LoaderComponent' | 'logger' | 'secret' | 'verbose'> & {
+    deviceCapabilities: PlayerCapability[] | 'auto';
+};
 declare type TivioSubscriptions = {
     subscribeToUser: (cb: (error: string | null, user: User | null) => void) => void;
     /**
@@ -98,6 +113,10 @@ declare type TivioSubscriptions = {
     subscribeToItemsInRow: SubscribeToItemsInRow;
     subscribeToRowsInScreen: SubscribeToRowsInScreen;
     subscribeToTaggedVideos: SubscribeToTaggedVideos;
+    registerOverlayCallbacks: (callbacks: {
+        onShow: () => void;
+        onHide: () => void;
+    }) => void;
 };
 declare type TivioGetters = {
     isTivioLoaded: (cb: (isLoaded: boolean) => void) => boolean;
@@ -136,22 +155,6 @@ declare type TivioGetters = {
      * @returns {Promise<Widget | null>} widget or null if widget does not exists
      */
     getWidgetById: (widgetId: string) => Promise<Widget | null>;
-    /**
-     * Search channels by its name.
-     * Returns array of channels.
-     * @param query - channel name query
-     * @param limit - max count of returned channels
-     * @returns {Promise<Channel[] | null>} channels array
-     */
-    searchChannels: (query: string, limit?: number) => Promise<Channel[]>;
-    /**
-     * Search videos by its name.
-     * Returns array of videos. Video section will be always null
-     * @param query - video name query
-     * @param limit - max count of returned videos
-     * @returns {Promise<Video[] | null>} videos array
-     */
-    searchVideos: (query: string, limit?: number) => Promise<Video[]>;
 };
 interface TivioAuth {
     changePassword: (newPassword: string) => Promise<void>;
@@ -178,6 +181,7 @@ declare type TivioComponents = {
     Markers: React.ReactNode;
     PlayerDataContext: React.ReactNode;
     Provider: React.ComponentType<RemoteProviderProps>;
+    Recommendation: React.ReactNode;
     SkipButtonWeb: React.ReactNode;
     VideoAdBanner: React.ReactNode;
     WebPlayer: React.ComponentType<WebPlayerProps>;
@@ -197,6 +201,10 @@ declare type TivioComponents = {
 };
 declare type TivioHooks = {
     useAd: () => [(AdSource | null)];
+    useCancelSubscription: UseCancelSubscription;
+    useSearch: UseSearch;
+    useVoucher: (voucherId: string) => any;
+    useLastVideoByWidgetId: (widgetId: string) => Video | null;
 };
 declare type TivioBundle = {
     components: TivioComponents;
@@ -204,17 +212,24 @@ declare type TivioBundle = {
     auth: TivioAuth;
     hooks: TivioHooks;
     init: (config: Config) => void | Promise<void>;
-    purchaseVideoWithQerko: (videoId: string, monetizationId: string) => Promise<QerkoPaymentInfo>;
-    purchaseSubscriptionWithQerko: (monetizationId: string) => Promise<QerkoPaymentInfo>;
+    purchaseVideoWithQerko: (videoId: string, monetizationId: string, voucher?: {
+        expirationDate: Date;
+    }) => Promise<QerkoPaymentInfo>;
+    purchaseSubscriptionWithQerko: (monetizationId: string, voucher?: {
+        expirationDate: Date;
+    }) => Promise<QerkoPaymentInfo>;
     setLanguage: (language: Language) => void;
     setUser: (userId: string, userPayload?: unknown) => void;
     sources: TivioSources;
     subscriptions: TivioSubscriptions;
 };
+declare type TivioBundleFile = {
+    Tivio: TivioBundle;
+};
 declare type RemoteBundleState = {
     config: InternalConfig;
     error: string | null;
     settings: Settings;
     state: 'loading' | 'error' | 'ready';
 } & Nullable<TivioBundle>;
-export type { RemoteBundleState, Config, Settings, InternalConfig, TivioBundle, TivioHooks, TivioComponents, TivioAuth, TivioGetters, TivioSubscriptions, Events, PubSub, };
+export type { RemoteBundleState, Config, Settings, InternalConfig, TivioBundle, TivioBundleFile, TivioHooks, TivioComponents, TivioAuth, TivioGetters, TivioSubscriptions, Events, PubSub, PlayerCapability, Currency, };

package/dist/types/customPlayer.types.d.ts

@@ -1,38 +1,171 @@
 import { Empty } from './common';
-export interface BasicSource {
+export declare type ChannelSource = {
+    new (uri: string, originalOptions: Record<string, any>, channelName: string, programName: string, programDescription: string, from: Date, to: Date): ChannelSource;
     description: string;
     name: string;
     uri: string;
-    type: 'AD' | 'VOD' | 'CHANNEL';
-}
-export interface ChannelSource extends BasicSource {
     from: Date;
     channelName: string;
     to: Date;
-    type: 'CHANNEL';
-}
-export interface AdSource extends BasicSource {
+    type: 'channel';
+    watchWithoutAdsRecommendation: {
+        purchase: () => void;
+    } | null;
+};
+export declare type AdSource = {
+    new (uri: string, name: string, description: string, skipDelayMs: number | null, adDurationMs: number, trackingContext?: any, // internal Tivio types
+    adMarker?: any, // internal Tivio types
+    packInfo?: any, // internal Tivio types
+    provider?: any): AdSource;
+    description: string;
+    name: string;
+    uri: string;
     durationMs: number;
     skipDelayMs: number | null;
-    type: 'AD';
-    canSkip?: boolean;
-    skip?: () => void;
-}
-export interface VodSource extends BasicSource {
-    type: 'VOD';
-}
-export declare type InputSource = AdSource | ChannelSource | VodSource;
-export declare type PlayerInterface = {
-    play: () => Empty;
-    pause: () => Empty;
-    seekTo: (positionMs: number) => Empty;
-    setSource: (source: InputSource | null) => Empty;
-    setVolume: (volume: number) => Empty;
+    type: 'ad';
+    /**
+     * true if is skippable and skip countdown has passed
+     */
+    canSkip: boolean;
+    /**
+     * true ad if is skippable after some skipDelayMs (if it is skippable, skipDelayMs is defined)
+     */
+    isSkippable: boolean;
+    /**
+     * Skip ad. Only works when canSkip is true
+     */
+    skip: () => void;
+    /**
+     * Order in ad break (ad break is a group of ads played right after each other)
+     */
+    order: number;
+    /**
+     * Total number of ads in ad break (ad break is a group of ads played right after each other)
+     */
+    totalCount: number;
+    secondsToEnd: number;
+    secondsToSkippable: number | null;
 };
+export declare type VodTivioSource = {
+    new (uri: string, videoId: string, name: string, description: string, adMonetizationId?: string): VodTivioSource;
+    type: 'vod_tivio';
+    description: string;
+    name: string;
+    uri: string;
+};
+export declare type VodExternalSource = {
+    new (uri: string, monetizationId: string, name: string, description: string, originalOptions: Record<string, any>): VodTivioSource;
+    type: 'vod_external';
+    description: string;
+    name: string;
+    uri: string;
+};
+export declare type InputSource = AdSource | ChannelSource | VodTivioSource | VodExternalSource;
+declare type PlayerState = 'playing' | 'paused' | 'idle';
+export interface PlayerInterface {
+    pause: () => void;
+    /**
+     * unpause
+     */
+    play: () => void;
+    /**
+     * @param {number} ms - milliseconds relative to start of video (relative to 0 ms)
+     *  or in case of TV programs relative to start of the program (relative to source.from ms)
+     */
+    seekTo: (ms: number) => void;
+    /**
+     * Source to be passed to player.
+     *
+     * Depending on autoplay settings it should either start playing
+     * immediately or just be loaded by player and stay paused.
+     */
+    setSource: (source: InputSource | null) => void;
+    /**
+     * volume in [0,1]
+     */
+    setVolume?: (volume: number) => void;
+    mute?: () => void;
+    /**
+     * restore volume to previous value
+     */
+    unmute?: () => void;
+}
 export declare type PlayerWrapper = {
+    /**
+     * Report that playback of video has finished
+     */
+    onPlaybackEnded: () => void;
+    /**
+     * Report video progress in milliseconds
+     */
+    onTimeChanged: (ms: number) => void;
+    /**
+     * Report that video state changed
+     */
+    onStateChanged: (state: PlayerState) => void;
+    /**
+     * Send source to Tivio
+     */
+    onSourceChanged: (source: InputSource | null) => void;
+    /**
+     * Report that video failed to load (never started playing)
+     */
+    onLoadError: (error: Error) => void;
+    /**
+     * Report that video failed during playback (successfully loaded and then failed, e.g. part of stream is invalid)
+     */
+    onError: (error: Error) => void;
+    /**
+     * Unpause video
+     */
+    play: () => void;
+    /**
+     * Pause video
+     */
+    pause: () => void;
+    /**
+     * Currently playing source
+     */
+    source: InputSource | null;
     events: {
-        addListener: <T = any>(event: string, cb: (value: T) => Empty) => Empty;
-        removeAllListeners: () => Empty;
+        isSupported: (even: string) => boolean;
+        addListener: <T = any>(event: string, cb: (value: T) => Empty) => void;
+        removeListener: <T = any>(event: string, cb: (value: T) => Empty) => void;
+        removeAllListeners: () => void;
     };
+    /**
+     * Register a low level player that implements player methods, like play video, change volume, etc.
+     */
+    register: (playerInterface: PlayerInterface) => void;
+    /**
+     * duration of current source in ms (both setter and getter)
+     */
+    durationMs: number | null;
+    isPlaybackStarted: boolean;
+    isPaused: boolean;
+    isPlaying: boolean;
+    isIdle: boolean;
+    error: Error | null;
+    /**
+     * Replay the video that finished playback
+     */
+    replay: () => void;
+    /**
+     * Retry to play a video that failed to start playing (e.g. due to a network error)
+     */
+    retry: () => void;
+    togglePlayPause: () => void;
+    seekTo: (ms: number) => void;
+    /**
+     * set volume to value between 0,1
+     */
+    setVolume: (volume: number) => void;
+    /**
+     * change volume by value between -1,1
+     */
+    changeVolumeBy: (volume: number) => void;
+    setMuted: (muted: boolean) => void;
+    toggleMuted: () => void;
 };
 export declare type UsePlayerEvent = <T = any>(eventName: string) => T | null;
+export {};

package/dist/types/types.d.ts

@@ -51,7 +51,7 @@ declare type Section = {
     channel: Channel;
     videos: Video[];
 };
-declare type Chapter = object;
+declare type Chapter = any;
 declare type Purchase = {
     isPurchased: boolean;
     monetizationId: string;
@@ -102,7 +102,7 @@ export interface TivioWidgetRef {
         x: number;
     });
 }
-interface VodTivioSource {
+interface VodTivioSourcePojo {
     type: 'VodTivioSource';
     description: string;
     path: string;
@@ -111,7 +111,7 @@ interface VodTivioSource {
     poster?: string;
     adMonetizationId?: string;
 }
-interface ChannelSource {
+interface ChannelSourcePojo {
     type: 'ChannelSource';
     uri: string;
     originalOptions: any;
@@ -125,7 +125,7 @@ interface ChannelSource {
 declare type VideoPath = string;
 interface WebPlayerProps {
     id: string;
-    source?: VodTivioSource | ChannelSource | VideoPath | null;
+    source?: VodTivioSourcePojo | ChannelSourcePojo | VideoPath | null;
     onEnded?: () => any;
     className?: string;
     /**
@@ -173,4 +173,4 @@ declare type TivioSources = {
     VodExternalSource: any;
     VodTivioSource: any;
 };
-export type { RemoteProviderProps, WebPlayerProps, Marker, BetOffer, Purchase, Chapter, Language, Widget, Channel, Section, Video, TivioSources, UserData, User, Monetization, VodTivioSource, };
+export type { RemoteProviderProps, WebPlayerProps, Marker, BetOffer, Purchase, Chapter, Language, Widget, Channel, Section, Video, TivioSources, UserData, User, Monetization, VodTivioSourcePojo, ChannelSourcePojo, };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@tivio/sdk-react",
-    "version": "2.3.4",
+    "version": "2.4.2-alpha",
     "main": "dist/index.js",
     "typings": "dist/index.d.ts",
     "source": "src/index.ts",
@@ -11,52 +11,47 @@
     "scripts": {
         "build": "bash ./scripts/build_prod.sh",
         "build:dev": "bash ./scripts/build_dev.sh",
-        "start": "bash ./scripts/start.sh",
+        "start": "yarn ts-node ./scripts/start.ts",
         "test": "jest --config=./jest.config.js --coverage",
         "clean": "rm -rf dist",
-        "prepublishOnly": "yarn && yarn ts-node ./scripts/prepublish.ts && yarn run build",
+        "prepublishOnly": "yarn && yarn run build && yarn ts-node ./scripts/prepublish.ts",
         "postpublish": "yarn ts-node ./scripts/postpublish.ts",
         "publish:alpha": "npm publish --tag alpha",
         "check:cycles   ": "npx madge --circular src/**/*"
     },
     "peerDependencies": {
-        "react": "^17.0.2",
-        "react-dom": "^17.0.2"
+        "react": "^17.0.0",
+        "react-dom": "^17.0.0"
     },
     "dependencies": {
         "@material-ui/core": "^4.11.2",
         "@material-ui/icons": "^4.11.2",
         "@sentry/browser": "^6.1.0",
-        "@tivio/common": "1.1.39",
+        "@tivio/common": "1.1.68",
         "firebase": "^8.2.3",
         "formik": "^2.2.7",
         "i18next": "^19.8.4",
         "mobx-react": "^7.1.0",
         "mobx": "^6.0.4",
-        "react-dom": "^17.0.2",
         "react-i18next": "^9.0.10",
         "react-router-dom": "^5.2.0",
-        "react-scripts": "4.0.3",
         "react-spring": "^9.2.4",
         "react-virtualized": "^9.22.3",
-        "react": "^17.0.2",
         "styled-components": "^5.2.1",
         "yup": "^0.32.9"
     },
     "devDependencies": {
-        "web-vitals": "^1.0.1",
-        "madge": "^5.0.1",
-        "@testing-library/user-event": "^12.1.10",
         "@testing-library/jest-dom": "^5.11.9",
         "@testing-library/react": "^11.2.3",
         "@testing-library/react-hooks": "^5.0.3",
+        "@testing-library/user-event": "^12.1.10",
         "@types/jest": "^26.0.15",
         "@types/node": "^12.0.0",
+        "@types/node-fetch": "^2.5.8",
         "@types/react": "^17.0.0",
         "@types/react-dom": "^17.0.0",
         "@types/react-router-dom": "^5.1.6",
         "@types/react-virtualized": "^9.21.13",
-        "@types/node-fetch": "^2.5.8",
         "@types/styled-components": "^5.1.7",
         "@typescript-eslint/eslint-plugin": "^4.14.0",
         "@typescript-eslint/parser": "^4.14.2",
@@ -65,13 +60,18 @@
         "jest": "^27.0.1",
         "jest-cli": "^26.6.3",
         "jest-fetch-mock": "^3.0.3",
+        "madge": "^5.0.1",
         "node-fetch": "^2.6.1",
+        "react": "^17.0.2",
+        "react-dom": "^17.0.2",
         "stream-browserify": "^3.0.0",
         "timers-browserify": "^2.0.12",
         "ts-jest": "^26.4.4",
         "typescript": "^4.1.3",
+        "web-vitals": "^1.0.1",
         "webpack": "^5.15.0",
         "webpack-cli": "^4.4.0",
-        "webpack-merge": "^5.7.3"
+        "webpack-merge": "^5.7.3",
+        "yargs": "17"
     }
 }