react-native-firework-sdk 2.2.4 → 2.3.0

package/src/components/VideoFeed.tsx

@@ -11,13 +11,14 @@ import {
 } from 'react-native';
 
 import FireworkSDK from '../FireworkSDK';
+import type AdConfiguration from '../models/AdConfiguration';
 import type FWError from '../models/FWError';
 import { FWEventName } from '../models/FWEventName';
-import type AdConfiguration from '../models/AdConfiguration';
 import type VideoFeedConfiguration from '../models/VideoFeedConfiguration';
 import type { VideoFeedSource } from '../models/VideoFeedSource';
 import type VideoPlayerConfiguration from '../models/VideoPlayerConfiguration';
 import { FireworkSDKModuleEventEmitter } from '../modules/FireworkSDKModule';
+import FWGlobalState from '../utils/FWGlobalState';
 import FWLoggerUtil from '../utils/FWLoggerUtil';
 import FWVideoFeed from './FWVideoFeed';
 
@@ -84,12 +85,16 @@ export interface IVideoFeedProps {
   onVideoFeedLoadFinished?: (error?: FWError) => void;
 }
 
+interface IVideoFeedState {
+  sdkInitCalled: boolean;
+}
+
 const NativeComponentName = 'FWVideoFeed';
 
 /**
  * VideoFeed component.
  */
-class VideoFeed extends React.Component<IVideoFeedProps> {
+class VideoFeed extends React.Component<IVideoFeedProps, IVideoFeedState> {
   /**
    * @ignore
    */
@@ -101,6 +106,13 @@ class VideoFeed extends React.Component<IVideoFeedProps> {
 
   private _subscriptions: EmitterSubscription[] = [];
 
+  constructor(props: IVideoFeedProps) {
+    super(props);
+    this.state = {
+      sdkInitCalled: FWGlobalState.getInstance().sdkInitCalled,
+    };
+  }
+
   public refresh = () => {
     FWLoggerUtil.log(`VideoFeed refresh ${JSON.stringify(this.props)}`);
 
@@ -148,6 +160,12 @@ class VideoFeed extends React.Component<IVideoFeedProps> {
       `VideoFeed componentDidMount ${JSON.stringify(this.props)}`
     );
 
+    if (!this.state.sdkInitCalled) {
+      FWGlobalState.getInstance().sdkInitCalledPromise.then(() => {
+        this.setState({ sdkInitCalled: true });
+      });
+    }
+
     const subscriptionOfShareBaseURLUpdated =
       FireworkSDKModuleEventEmitter.addListener(
         FWEventName.ShareBaseURLUpdated,
@@ -210,16 +228,29 @@ class VideoFeed extends React.Component<IVideoFeedProps> {
    * @ignore
    */
   render() {
-    FWLoggerUtil.log(`VideoFeed render ${JSON.stringify(this.props)}`);
+    FWLoggerUtil.log(
+      `VideoFeed render props ${JSON.stringify(
+        this.props
+      )} state ${JSON.stringify(this.state)}`
+    );
+
+    if (!this.state.sdkInitCalled) {
+      return null;
+    }
+
     const gShareBaseURL = FireworkSDK.getInstance().shareBaseURL ?? '';
     const appLanguage = FireworkSDK.getInstance().appLanguage ?? '';
+    const videoLaunchBehavior =
+      FireworkSDK.getInstance().videoLaunchBehavior ?? '';
     const adBadgeConfiguration =
       FireworkSDK.getInstance().adBadgeConfiguration ?? {};
     const adBadgeTextType = adBadgeConfiguration.badgeTextType ?? '';
     const backgroundColorOfAdBadge = adBadgeConfiguration.backgroundColor ?? '';
     const textColorOfAdBadge = adBadgeConfiguration.textColor ?? '';
-    const videoLaunchBehavior =
-      FireworkSDK.getInstance().videoLaunchBehavior ?? 'default';
+    const androidFontIsCustomOfAdBadge =
+      adBadgeConfiguration.androidFontInfo?.isCustom?.toString() ?? '';
+    const androidFontTypefaceNameOfAdBadge =
+      adBadgeConfiguration.androidFontInfo?.typefaceName ?? '';
 
     const {
       source,
@@ -236,15 +267,50 @@ class VideoFeed extends React.Component<IVideoFeedProps> {
       this._generateDynamicContentParametersString();
 
     const videoFeedConfiguration = this._getVideoFeedConfiguration();
-    const titleHidden = videoFeedConfiguration?.title?.hidden ?? false;
-    const titlePosition = videoFeedConfiguration?.titlePosition ?? 'nested';
-    const enableAutoplay = videoFeedConfiguration?.enableAutoplay ?? false;
-    const gridColumns = videoFeedConfiguration?.gridColumns ?? 2;
-    const showAdBadge = videoFeedConfiguration?.showAdBadge ?? false;
-
+    const cornerRadius = videoFeedConfiguration?.cornerRadius?.toFixed(5) ?? '';
+
+    const titleHidden = videoFeedConfiguration?.title?.hidden?.toString() ?? '';
+    const titleTextColor = videoFeedConfiguration?.title?.textColor ?? '';
+    const titleFontSize =
+      videoFeedConfiguration?.title?.fontSize?.toFixed(5) ?? '';
+    const titleAndroidFontInfo = videoFeedConfiguration?.title?.androidFontInfo;
+    const titleGradientDrawable =
+      videoFeedConfiguration?.title?.gradientDrawable;
+    const titlePosition = videoFeedConfiguration?.titlePosition ?? '';
+    const playIconHidden =
+      videoFeedConfiguration?.playIcon?.hidden?.toString() ?? '';
+    const playIconWidth =
+      videoFeedConfiguration?.playIcon?.iconWidth?.toFixed(5) ?? '';
+    const showAdBadge = videoFeedConfiguration?.showAdBadge?.toString() ?? '';
+    const enableAutoplay =
+      videoFeedConfiguration?.enableAutoplay?.toString() ?? '';
+    const gridColumns = videoFeedConfiguration?.gridColumns?.toFixed(5) ?? '';
+    const itemSpacing = videoFeedConfiguration?.itemSpacing?.toFixed(5) ?? '';
+
+    const playerStyle = videoPlayerConfiguration?.playerStyle ?? '';
+    const videoCompleteAction =
+      videoPlayerConfiguration?.videoCompleteAction ?? '';
+    const showShareButton =
+      videoPlayerConfiguration?.showShareButton?.toString() ?? '';
+    const showPlaybackButton =
+      videoPlayerConfiguration?.showPlaybackButton?.toString() ?? '';
+    const showMuteButton =
+      videoPlayerConfiguration?.showMuteButton?.toString() ?? '';
+    const showBranding =
+      videoPlayerConfiguration?.showBranding?.toString() ?? '';
+    const ctaDelayType = videoPlayerConfiguration?.ctaDelay?.type ?? '';
+    const ctaDelayValue = (
+      videoPlayerConfiguration?.ctaDelay?.value ?? 0
+    ).toFixed(5);
+    const ctaHighlightDelayType =
+      videoPlayerConfiguration?.ctaHighlightDelay?.type ?? '';
+    const ctaHighlightDelayValue = (
+      videoPlayerConfiguration?.ctaHighlightDelay?.value ?? 0
+    ).toFixed(5);
     const shareBaseURL = videoPlayerConfiguration?.shareBaseURL ?? '';
+    const ctaWidth = videoPlayerConfiguration?.ctaWidth ?? '';
 
-    const requiresAds = adConfiguration?.requiresAds ?? false;
+    const requiresAds = adConfiguration?.requiresAds?.toString() ?? '';
     const adsFetchTimeout = adConfiguration?.adsFetchTimeout ?? 10;
     const vastAttributesString = this._generateVastAttributesString();
 
@@ -252,10 +318,14 @@ class VideoFeed extends React.Component<IVideoFeedProps> {
     if (Platform.OS === 'ios') {
       key += `_appLanguage:${appLanguage}`;
     }
+    key += `_videoLaunchBehavior:${videoLaunchBehavior}`;
     key += `_adBadgeTextType:${adBadgeTextType}`;
     key += `_backgroundColorOfAdBadge:${backgroundColorOfAdBadge}`;
     key += `_textColorOfAdBadge:${textColorOfAdBadge}`;
-    key += `_videoLaunchBehavior:${videoLaunchBehavior}`;
+    if (Platform.OS === 'android') {
+      key += `_androidFontIsCustomOfAdBadge${androidFontIsCustomOfAdBadge}`;
+      key += `_androidFontTypefaceNameOfAdBadge${androidFontTypefaceNameOfAdBadge}`;
+    }
 
     key += `_source:${source}`;
     key += `_channel:${channel}`;
@@ -267,12 +337,46 @@ class VideoFeed extends React.Component<IVideoFeedProps> {
     key += `_enablePictureInPicture:${enablePictureInPicture}`;
 
     key += `_titleHidden:${titleHidden}`;
+    if (Platform.OS === 'android') {
+      key += `_cornerRadius:${cornerRadius}`;
+      key += `_titleTextColor:${titleTextColor}`;
+      key += `_titleFontSize:${titleFontSize}`;
+      key += `_titleAndroidFontInfo.isCustom:${
+        titleAndroidFontInfo?.isCustom?.toString() ?? ''
+      }`;
+      key += `_titleAndroidFontInfo.typefaceName:${
+        titleAndroidFontInfo?.typefaceName ?? ''
+      }`;
+      key += `_titleGradientDrawable.orientation:${
+        titleGradientDrawable?.orientation ?? ''
+      }`;
+      key += `_titleGradientDrawable.colors:${(
+        titleGradientDrawable?.colors ?? []
+      ).join(',')}`;
+      key += `_playIconHidden:${playIconHidden}`;
+      key += `_playIconWidth:${playIconWidth}`;
+      key += `_showAdBadge:${showAdBadge}`;
+    }
+
     key += `_titlePosition:${titlePosition}`;
     key += `_enableAutoplay:${enableAutoplay}`;
     key += `_gridColumns:${gridColumns}`;
-    key += `_showAdBadge:${showAdBadge}`;
+    key += `_itemSpacing:${itemSpacing}`;
 
     key += `_shareBaseURL:${shareBaseURL}`;
+    if (Platform.OS === 'android') {
+      key += `_playerStyle:${playerStyle}`;
+      key += `_videoCompleteAction:${videoCompleteAction}`;
+      key += `_showShareButton:${showShareButton}`;
+      key += `_showPlaybackButton:${showPlaybackButton}`;
+      key += `_showMuteButton:${showMuteButton}`;
+      key += `_showBranding:${showBranding}`;
+      key += `_ctaDelayType:${ctaDelayType}`;
+      key += `_ctaDelayValue:${ctaDelayValue}`;
+      key += `_ctaHighlightDelayType:${ctaHighlightDelayType}`;
+      key += `_ctaHighlightDelayValue:${ctaHighlightDelayValue}`;
+      key += `_ctaWidth:${ctaWidth}`;
+    }
 
     key += `_requiresAds:${requiresAds}`;
     key += `_adsFetchTimeout:${adsFetchTimeout}`;
@@ -286,7 +390,6 @@ class VideoFeed extends React.Component<IVideoFeedProps> {
         ref={this._nativeComponentRef}
         onVideoFeedLoadFinished={this._onVideoFeedLoadFinished}
         mode={mode}
-        style={Object.assign({}, this.props.style, { zIndex: -1 })}
       />
     );
   }
@@ -336,18 +439,39 @@ class VideoFeed extends React.Component<IVideoFeedProps> {
       return videoFeedConfiguration;
     }
 
+    let resultVideoFeedConfiguration = videoFeedConfiguration;
+
     if (
-      videoFeedConfiguration.gridColumns &&
-      Math.floor(videoFeedConfiguration.gridColumns!) !==
-        videoFeedConfiguration.gridColumns
+      resultVideoFeedConfiguration.gridColumns &&
+      Math.floor(resultVideoFeedConfiguration.gridColumns) !==
+        resultVideoFeedConfiguration.gridColumns
     ) {
-      return {
-        ...videoFeedConfiguration,
-        gridColumns: Math.floor(videoFeedConfiguration.gridColumns!),
+      const gridColumns = Math.floor(resultVideoFeedConfiguration.gridColumns);
+      resultVideoFeedConfiguration = {
+        ...resultVideoFeedConfiguration,
+        gridColumns,
+      };
+    }
+
+    if (
+      resultVideoFeedConfiguration.title &&
+      resultVideoFeedConfiguration.title.numberOfLines &&
+      Math.floor(resultVideoFeedConfiguration.title.numberOfLines) !==
+        resultVideoFeedConfiguration.title.numberOfLines
+    ) {
+      const numberOfLines = Math.floor(
+        resultVideoFeedConfiguration.title.numberOfLines
+      );
+      resultVideoFeedConfiguration = {
+        ...resultVideoFeedConfiguration,
+        title: {
+          ...resultVideoFeedConfiguration.title,
+          numberOfLines,
+        },
       };
-    } else {
-      return videoFeedConfiguration;
     }
+
+    return resultVideoFeedConfiguration;
   }
 }
 

package/src/index.ts

@@ -36,6 +36,8 @@ import type {
   VideoFeedClickEvent,
   VideoPlaybackEvent,
 } from './models/FWEvents';
+import type GradientDrawable from './models/GradientDrawable';
+import type { GradientDrawableOrientation } from './models/GradientDrawable';
 import type IOSFontInfo from './models/IOSFontInfo';
 import type {
   IOSSystemFontStyle,
@@ -57,11 +59,12 @@ import type { ProductPrice, ProductUnitOption } from './models/ProductUnit';
 import type SDKInitOptions from './models/SDKInitOptions';
 import type { VideoLaunchBehavior } from './models/SDKInitOptions';
 import type ShoppingCTAResult from './models/ShoppingCTAResult';
+import type { StoryBlockConfiguration } from './models/StoryBlockConfiguration';
 import type { StoryBlockSource } from './models/StoryBlockSource';
 import type TrackPurchaseParameters from './models/TrackPurchaseParameters';
 import type VideoFeedConfiguration from './models/VideoFeedConfiguration';
 import type {
-  VideoFeedContentPadding,
+  VideoFeedPadding,
   VideoFeedPlayIconConfiguration,
   VideoFeedTitleConfiguration,
   VideoFeedTitlePosition,
@@ -70,14 +73,15 @@ import type { VideoFeedSource } from './models/VideoFeedSource';
 import type VideoPlaybackDetails from './models/VideoPlaybackDetails';
 import type { VideoPlayerSize } from './models/VideoPlaybackDetails';
 import VideoPlaybackEventName from './models/VideoPlaybackEventName';
+import type { VideoPlayerCompleteAction } from './models/VideoPlayerCompleteAction';
 import type VideoPlayerConfiguration from './models/VideoPlayerConfiguration';
 import type {
-  VideoPlayerCompleteAction,
   VideoPlayerCTADelay,
   VideoPlayerCTADelayType,
-  VideoPlayerCTAStyle,
-  VideoPlayerStyle,
-} from './models/VideoPlayerConfiguration';
+} from './models/VideoPlayerCTADelay';
+import type { VideoPlayerCTAStyle } from './models/VideoPlayerCTAStyle';
+import type { VideoPlayerCTAWidth } from './models/VideoPlayerCTAWidth';
+import type { VideoPlayerStyle } from './models/VideoPlayerStyle';
 import type {
   CustomClickCartIconCallback,
   CustomClickLinkButtonCallback,
@@ -102,6 +106,8 @@ export {
   FireworkSDK,
   FWError,
   FWNavigator,
+  GradientDrawable,
+  GradientDrawableOrientation,
   IOSFontInfo,
   IOSSystemFontStyle,
   IOSSystemFontWeight,
@@ -132,6 +138,7 @@ export {
   ShoppingCTAEvent,
   ShoppingCTAResult,
   StoryBlock,
+  StoryBlockConfiguration,
   StoryBlockSource,
   TrackPurchaseParameters,
   UpdateProductDetailsCallback,
@@ -141,8 +148,8 @@ export {
   VideoFeedClickCallback,
   VideoFeedClickEvent,
   VideoFeedConfiguration,
-  VideoFeedContentPadding,
   VideoFeedMode,
+  VideoFeedPadding,
   VideoFeedPlayIconConfiguration,
   VideoFeedSource,
   VideoFeedTitleConfiguration,
@@ -157,6 +164,7 @@ export {
   VideoPlayerCTADelay,
   VideoPlayerCTADelayType,
   VideoPlayerCTAStyle,
+  VideoPlayerCTAWidth,
   VideoPlayerSize,
   VideoPlayerStyle,
   VideoShopping,

package/src/models/AdBadgeConfiguration.ts

@@ -1,3 +1,5 @@
+import type AndroidFontInfo from './AndroidFontInfo';
+
 export type AdBadgeTextType = 'ad' | 'sponsored';
 
 export default interface AdBadgeConfiguration {
@@ -6,11 +8,17 @@ export default interface AdBadgeConfiguration {
    */
   badgeTextType?: AdBadgeTextType;
   /**
-   * The background color of the ad badge. Only supported on iOS.
+   * The background color of the ad badge.
    */
   backgroundColor?: string;
   /**
-   * The color of the ad badge text. Only supported on iOS.
+   * The color of the ad badge text.
    */
   textColor?: string;
+  /**
+   * The Android font info of ad badge.
+   * The property is ignored when fontSize is not set.
+   * Only supported on Android.
+   */
+  androidFontInfo?: AndroidFontInfo;
 }

package/src/models/FWEvents.ts

@@ -52,17 +52,6 @@ export interface UpdateProductDetailsEvent {
   productIds: string[];
 }
 
-export interface LiveStreamEvent {
-  eventName: LiveStreamEventName;
-  info: LiveStreamEventDetails;
-}
-
-export interface LiveStreamChatEvent {
-  eventName: LiveStreamChatEventName;
-  message: LiveStreamMessageDetails;
-  liveStream: LiveStreamEventDetails;
-}
-
 export interface CustomClickLinkButtonEvent {
   /**
    * The url for the product unit
@@ -77,3 +66,14 @@ export interface CustomClickLinkButtonEvent {
    */
   unitId: string;
 }
+
+export interface LiveStreamEvent {
+  eventName: LiveStreamEventName;
+  info: LiveStreamEventDetails;
+}
+
+export interface LiveStreamChatEvent {
+  eventName: LiveStreamChatEventName;
+  message: LiveStreamMessageDetails;
+  liveStream: LiveStreamEventDetails;
+}

package/src/models/GradientDrawable.ts

@@ -0,0 +1,14 @@
+export type GradientDrawableOrientation =
+  | 'TOP_BOTTOM'
+  | 'TR_BL'
+  | 'RIGHT_LEFT'
+  | 'BR_TL'
+  | 'BOTTOM_TOP'
+  | 'BL_TR'
+  | 'LEFT_RIGHT'
+  | 'TL_BR';
+
+export default interface GradientDrawable {
+  orientation?: GradientDrawableOrientation;
+  colors?: string[];
+}

package/src/models/IOSFontInfo.ts

@@ -19,11 +19,13 @@ export default interface IOSFontInfo {
   /**
    * The iOS system font style.
    * The property is ignored when fontName is non-empty.
+   * Only supported on iOS.
    */
   systemFontStyle?: IOSSystemFontStyle;
   /**
    * The iOS system font weight.
    * The property is ignored when fontName is non-empty or systemFontStyle is italic.
+   * Only supported on iOS.
    */
   systemFontWeight?: IOSSystemFontWeight;
 }

package/src/models/ProductInfoViewConfiguration.ts

@@ -36,7 +36,7 @@ export default interface ProductInfoViewConfiguration {
    */
   ctaButton?: ShoppingCTAButtonConfiguration;
   /**
-   * Configuration of link button next to "Add to cart" button.
+   * Configuration of link button next to shopping CTA button.
    */
   linkButton?: LinkButtonConfiguration;
 }

package/src/models/StoryBlockConfiguration.ts

@@ -0,0 +1,38 @@
+import type { VideoPlayerCTADelay } from './VideoPlayerCTADelay';
+import type { VideoPlayerCTAWidth } from './VideoPlayerCTAWidth';
+import type { VideoPlayerCompleteAction } from './VideoPlayerCompleteAction';
+
+export interface StoryBlockConfiguration {
+  /**
+   * Behavior occurring after video is complete.
+   */
+  videoCompleteAction?: VideoPlayerCompleteAction;
+  /**
+   * Indicates if the video player shows share button.
+   */
+  showShareButton?: boolean;
+  /**
+   * Indicates if the video player shows playback button.
+   */
+  showPlaybackButton?: boolean;
+  /**
+   * Indicates if Firework branding should be showed or not.
+   */
+  showBranding?: boolean;
+  /**
+   * Specifies the delay before showing the CTA.
+   */
+  ctaDelay?: VideoPlayerCTADelay;
+  /**
+   * Specifies the delay before the highlight animation occurs. Only supported on iOS.
+   */
+  ctaHighlightDelay?: VideoPlayerCTADelay;
+  /**
+   * The share base URL of the video.
+   */
+  shareBaseURL?: string;
+  /**
+   * Specifies the desired width for the Video Player CTA button.
+   */
+  ctaWidth?: VideoPlayerCTAWidth;
+}

package/src/models/VideoFeedConfiguration.ts

@@ -1,5 +1,6 @@
 import type IOSFontInfo from './IOSFontInfo';
 import type AndroidFontInfo from './AndroidFontInfo';
+import type GradientDrawable from './GradientDrawable';
 
 export interface VideoFeedTitleConfiguration {
   /**
@@ -14,6 +15,11 @@ export interface VideoFeedTitleConfiguration {
    * The font size of video feed title.
    */
   fontSize?: number;
+  /**
+   * Specifies the number of allowed lines for the label.
+   * Only supported on iOS.
+   */
+  numberOfLines?: number;
   /**
    * The iOS font info of video feed title.
    * The property is ignored when fontSize is not set.
@@ -26,6 +32,17 @@ export interface VideoFeedTitleConfiguration {
    * Only supported on Android.
    */
   androidFontInfo?: AndroidFontInfo;
+  /**
+   * The background color of video feed title.
+   * The property is ignored when gradientDrawable is set.
+   * Only supported on Android.
+   */
+  backgroundColor?: string;
+  /**
+   * The background drawable of video feed title.
+   * Only supported on Android.
+   */
+  gradientDrawable?: GradientDrawable;
 }
 
 export interface VideoFeedPlayIconConfiguration {
@@ -35,7 +52,7 @@ export interface VideoFeedPlayIconConfiguration {
 
 export type VideoFeedTitlePosition = 'stacked' | 'nested';
 
-export interface VideoFeedContentPadding {
+export interface VideoFeedPadding {
   top?: number;
   right?: number;
   bottom?: number;
@@ -59,6 +76,10 @@ export default interface VideoFeedConfiguration {
    * Title position of video feed item.
    */
   titlePosition?: VideoFeedTitlePosition;
+  /**
+   * The padding of video feed title. Only supported on iOS.
+   */
+  titlePadding?: VideoFeedPadding;
   /**
    * Configuration of video feed item play icon.
    */
@@ -72,11 +93,11 @@ export default interface VideoFeedConfiguration {
    */
   aspectRatio?: number;
   /**
-   * The content padding for video feed. Only supported on iOS.
+   * The padding of video feed content. Only supported on iOS.
    */
-  contentPadding?: VideoFeedContentPadding;
+  contentPadding?: VideoFeedPadding;
   /**
-   * The item spacing for video feed. Only supported on iOS.
+   * The item spacing for video feed.
    */
   itemSpacing?: number;
   /**

package/src/models/VideoPlaybackDetails.ts

@@ -34,6 +34,7 @@ export default interface VideoPlaybackDetails {
   progress?: number | null;
   /**
    * The type of the CTA button clicked: "buy" "download" "view" "book".
+   * Only supported on iOS.
    */
   ctaActionType?: string | null;
   /**

package/src/models/VideoPlayerCTADelay.ts

@@ -0,0 +1,11 @@
+export type VideoPlayerCTADelayType = 'constant' | 'percentage';
+export interface VideoPlayerCTADelay {
+  type: VideoPlayerCTADelayType;
+  /**
+   * If type is constant, the value is the number of seconds of delay.
+   * Value should be greater than or equal to 0 and less than or equal to 10 when type is constant.
+   * If type is percentage, the value is a percentage based on the the total duration of the video length.
+   * Value must be greater than or equal to 0 and less than 1 when type is percentage.
+   */
+  value: number;
+}

package/src/models/VideoPlayerCTAStyle.ts

@@ -0,0 +1,22 @@
+import type IOSFontInfo from './IOSFontInfo';
+
+export interface VideoPlayerCTAStyle {
+  /**
+   * The background color of CTA button.
+   */
+  backgroundColor?: string;
+  /**
+   * The text color of CTA button.
+   */
+  textColor?: string;
+  /**
+   * The font size of CTA button.
+   */
+  fontSize?: number;
+  /**
+   * The iOS font info of CTA button.
+   * The property is ignored when fontSize is not set.
+   * Only supported on iOS.
+   */
+  iOSFontInfo?: IOSFontInfo;
+}

package/src/models/VideoPlayerCTAWidth.ts

@@ -0,0 +1 @@
+export type VideoPlayerCTAWidth = 'fullWidth' | 'compact' | 'sizeToFit';

package/src/models/VideoPlayerCompleteAction.ts

@@ -0,0 +1 @@
+export type VideoPlayerCompleteAction = 'loop' | 'advanceToNext';

package/src/models/VideoPlayerConfiguration.ts

@@ -1,39 +1,8 @@
-import type IOSFontInfo from './IOSFontInfo';
-
-export type VideoPlayerStyle = 'full' | 'fit';
-export type VideoPlayerCompleteAction = 'loop' | 'advanceToNext';
-export interface VideoPlayerCTAStyle {
-  /**
-   * The background color of CTA button.
-   */
-  backgroundColor?: string;
-  /**
-   * The text color of CTA button.
-   */
-  textColor?: string;
-  /**
-   * The font size of CTA button.
-   */
-  fontSize?: number;
-  /**
-   * The iOS font info of CTA button.
-   * The property is ignored when fontSize is not set.
-   * Only supported on iOS.
-   */
-  iOSFontInfo?: IOSFontInfo;
-}
-
-export type VideoPlayerCTADelayType = 'constant' | 'percentage';
-export interface VideoPlayerCTADelay {
-  type: VideoPlayerCTADelayType;
-  /**
-   * If type is constant, the value is the number of seconds of delay.
-   * Value should be greater than or equal to 0 and less than or equal to 10 when type is constant.
-   * If type is percentage, the value is a percentage based on the the total duration of the video length.
-   * Value must be greater than or equal to 0 and less than 1 when type is percentage.
-   */
-  value: number;
-}
+import type { VideoPlayerCTADelay } from './VideoPlayerCTADelay';
+import type { VideoPlayerCTAStyle } from './VideoPlayerCTAStyle';
+import type { VideoPlayerCTAWidth } from './VideoPlayerCTAWidth';
+import type { VideoPlayerCompleteAction } from './VideoPlayerCompleteAction';
+import type { VideoPlayerStyle } from './VideoPlayerStyle';
 
 export default interface VideoPlayerConfiguration {
   /**
@@ -76,4 +45,8 @@ export default interface VideoPlayerConfiguration {
    * The share base URL of the video.
    */
   shareBaseURL?: string;
+  /**
+   * Specifies the desired width for the Video Player CTA button.
+   */
+  ctaWidth?: VideoPlayerCTAWidth;
 }

package/src/models/VideoPlayerStyle.ts

@@ -0,0 +1 @@
+export type VideoPlayerStyle = 'full' | 'fit';

package/src/modules/LiveStreamModule.ts

@@ -14,7 +14,7 @@ const LiveStreamModule = NativeModules.LiveStreamModule
     );
 
 interface ILiveStreamModule extends NativeModule {
-  init(): void;
+  init(): Promise<any>;
 }
 const LiveStreamModuleEventEmitter = new NativeEventEmitter(LiveStreamModule);
 export { LiveStreamModuleEventEmitter };