Event Game Play

Generic event prediction component for sports and entertainment events. Supports flexible outcome types — boolean, number, enum, free input — with countdown timers, points display, and detailed result breakdowns.

Import

import { EventGamePlay } from "fansunited-frontend-components";
import { EventGamePlayProps, WidgetTemplate } from "fansunited-frontend-core";

Required props

Prop	Type	Description
`entityId`	`string`	Event Game identifier.
`sdk`	`FansUnitedSDKModel`	SDK instance.
`template`	`WidgetTemplate`	`STANDARD`, `SPLIT`, or `OVERLAY`.
`language`	`LanguageType`	Display language.

Optional props

Prop	Type	Description
`themeOptions`	`CustomThemeOptions`	See Theming.
`leads`	`LeadsOptions`	Lead collection is not supported on this component; this prop is reserved.
`imagePosition`	`"left" \| "right"`	`STANDARD` template only.
`defaultImagePlaceholderUrl`	`string`	Fallback image URL.
`userIsLoggedIn`	`boolean`	Host auth state.
`signInCTA`	`SignInCTADetails`	See Sign-in CTA.
`additionalCTA`	`AdditionalCTADetails`	See Additional CTA.
`showCountdown`	`boolean`	Show countdown timer while the game is `OPEN`.
`showPoints`	`boolean`	Show points display per fixture.
`showPredictionDetails`	`boolean`	Show detailed prediction results after settling.
`rulesDisplay`	`RulesDisplay`	See Rules Display.

Outcome types

EventGamePlay supports four flexible outcome types per fixture, configured in the Fans United backend:

Type	Description	Example
`BOOLEAN`	Yes/No prediction	"Will the total points exceed 225?"
`NUMBER`	Numeric prediction (with optional min/max validation)	"How many total points will be scored?"
`ENUM`	Multiple-choice selection from predefined options	"Who will be the game's leading scorer?"
`FREE_INPUT`	Open text input	"What will be the exact final score?"

Status lifecycle

Status	Behavior
`PENDING`	Not yet open for predictions.
`OPEN`	Default playable state.
`LIVE`	Event has started — no new predictions accepted.
`CLOSED`	Backend resolving predictions.
`SETTLED`	Predictions resolved; leaderboard available.

Examples

Basic

<EventGamePlay
  entityId="event-game-123"
  sdk={sdk}
  template={WidgetTemplate.STANDARD}
  language="en"
/>

Fully configured

<EventGamePlay
  entityId="event-game-123"
  sdk={sdk}
  template={WidgetTemplate.OVERLAY}
  language="en"
  showCountdown
  showPoints
  showPredictionDetails
  themeOptions={{
    mode: "dark",
    colorSchemes: {
      dark: {
        textPrimary: "#ffffff",
        surface: "#1a1a1a",
      },
    },
  }}
/>

Updated about 1 month ago

Did this page help you?