BlazeStoryPlayerTitleImageStyle - React Native

The BlazeStoryPlayerTitleImageStyle interface represents the style and appearance of the title image in a story player.

Properties

isVisible

isVisible?: boolean

Indicates whether the title image is visible. Defaults to true.

size

size?: number

The size (width and height) of the title image in points. Clamped to a maximum of 32. Defaults to 20.

source

source?: BlazeStoryPlayerTitleImageSource

The source strategy for the title image. Defaults to { type: 'dynamic' } (no fallback).

BlazeStoryPlayerTitleImageSource

The BlazeStoryPlayerTitleImageSource type represents the source strategy for the story player title image. It is a discriminated union keyed by type.

type BlazeStoryPlayerTitleImageSource =
  | { type: 'static'; staticSource: BlazeStoryPlayerTitleImageStaticSource }
  | { type: 'dynamic'; fallback?: BlazeStoryPlayerTitleImageStaticSource };

static

{ type: 'static'; staticSource: BlazeStoryPlayerTitleImageStaticSource }

A static image provided by the SDK consumer: either a bundled image or a remote URL.

dynamic

{ type: 'dynamic'; fallback?: BlazeStoryPlayerTitleImageStaticSource }

A dynamic image sourced from the backend (titleImageUrl). An optional fallback is used when the backend image is unavailable or fails to load. Omit fallback to show a gray placeholder on failure.

BlazeStoryPlayerTitleImageStaticSource

The BlazeStoryPlayerTitleImageStaticSource type represents a concrete static image, either from the app's native assets or from a remote URL. It is a discriminated union keyed by type.

type BlazeStoryPlayerTitleImageStaticSource =
  | { type: 'image'; image: BlazeImage }
  | { type: 'url'; url: string };

image

{ type: 'image'; image: BlazeImage }

A static image loaded from the app's native image assets via BlazeImage (same pattern used across the SDK for bundled images).

url

{ type: 'url'; url: string }

A static image loaded from a remote URL.

Usage example

import {
  BlazeStoryPlayerStyle,
} from '@wscsports/blaze-rtn-sdk';

const storyPlayerStyle: BlazeStoryPlayerStyle = {
  title: {
    isVisible: true,
    image: {
      isVisible: true,
      size: 24,
      source: {
        type: 'dynamic',
        fallback: {
          type: 'image',
          image: { imageName: 'story_placeholder' },
        },
      },
    },
  },
};