@maestro_io/maestro-web-sdk 4.0.0 → 4.0.2

package/dist/src/modules/bets/view/components/Bet/Bet.js

@@ -0,0 +1,32 @@
+import React from 'react';
+import './Bet.styles.css';
+import { withFocusable, } from '@/external/spatial-navigation';
+import Image from '@/components/atoms/Image';
+import FocusableItem from '@/components/core/ScrollableContainer/FocusableItem';
+class Bet extends React.Component {
+    render() {
+        const accruedValue = this.props.leg.points
+            ? Number(this.props.leg.points)
+            : 0;
+        return (React.createElement(FocusableItem, null,
+            React.createElement("div", { className: "single-bet focus-ring focus-opacity", "data-focusable": this.props.focusable, "data-focused": this.props.focused },
+                this.props.leg.iconDark && (React.createElement(Image, { crossOrigin: "anonymous", src: this.props.leg.iconDark, alt: "Bet Icon" })),
+                React.createElement("div", { className: "single-bet-main-content T02" },
+                    React.createElement("div", { className: "single-bet-info" },
+                        React.createElement("div", null,
+                            React.createElement("div", { className: "T05_ALT" }, this.props.leg.selectionText),
+                            React.createElement("span", { className: "single-bet-info-description" }, this.props.leg.marketText)),
+                        !this.props.hideWagers && (React.createElement("div", { className: "single-bet-odds T01" }, this.props.leg.odds))),
+                    this.props.leg.accrued && (React.createElement("div", { className: "single-bet-accrued" },
+                        React.createElement("div", { className: "single-bet-accrued-goal" },
+                            accruedValue,
+                            React.createElement("span", null,
+                                "/",
+                                this.props.leg.accrued.goal),
+                            React.createElement("div", null,
+                                Math.round((accruedValue / this.props.leg.accrued.goal) * 100),
+                                "%")),
+                        React.createElement("progress", { "data-complete": accruedValue === this.props.leg.accrued.goal, value: accruedValue, max: this.props.leg.accrued.goal })))))));
+    }
+}
+export default withFocusable()(Bet);

package/dist/src/modules/bets/view/components/BetPill/BetPill.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import './BetPill.styles.css';
+declare const BetPill: (props: {
+    children: React.ReactNode;
+}) => JSX.Element;
+export default BetPill;

package/dist/src/modules/bets/view/components/BetPill/BetPill.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import './BetPill.styles.css';
+const BetPill = (props) => {
+    return React.createElement("label", { className: "bet-pill" }, props.children);
+};
+export default BetPill;

package/dist/src/modules/bets/view/components/BetsCard/BetsCard.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import './BetsCard.styles.css';
+import { WithFocusableProps } from '@/external/spatial-navigation';
+export type BetsCardProps = {
+    children: React.ReactNode;
+    header: (props: BetsCardProps & WithFocusableProps) => React.ReactNode;
+    footer: (props: BetsCardProps & WithFocusableProps) => React.ReactNode;
+};
+declare const _default: React.ComponentType<BetsCardProps & WithFocusableProps>;
+export default _default;

package/dist/src/modules/bets/view/components/BetsCard/BetsCard.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import './BetsCard.styles.css';
+import { withFocusable, } from '@/external/spatial-navigation';
+import FocusableItem from '@/components/core/ScrollableContainer/FocusableItem';
+class BetsCard extends React.Component {
+    render() {
+        return (React.createElement(FocusableItem, null,
+            React.createElement("div", { className: "bets-card focus-ring", "data-focused": this.props.focused },
+                this.props.header(this.props),
+                React.createElement("div", { className: "bets-card-divider" }),
+                this.props.children,
+                this.props.footer(this.props))));
+    }
+}
+export default withFocusable()(BetsCard);

package/dist/src/modules/bets/view/components/BetsCard/BetsCardHeader.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { WithFocusableProps } from '@/external/spatial-navigation';
+type BetsCardHeaderProps = {
+    betCardProps: WithFocusableProps;
+    cardExpanded: boolean;
+    children?: React.ReactNode;
+    legCountThreshold?: number;
+    overrideOutcome?: string;
+    outcome?: string;
+    betType: string;
+    renderIcon?: () => React.ReactNode;
+    iconUrl?: string;
+    legCount?: number;
+};
+declare const BetsCardHeader: (props: BetsCardHeaderProps) => JSX.Element;
+export default BetsCardHeader;

package/dist/src/modules/bets/view/components/BetsCard/BetsCardHeader.js

@@ -0,0 +1,20 @@
+import Icon from '@/components/atoms/SvgIcon';
+import React from 'react';
+import OutcomeBadge from '../../UserBets/OutcomeBadge/OutcomeBadge';
+import Image from '@/components/atoms/Image';
+const BetsCardHeader = (props) => {
+    const outcome = props.overrideOutcome !== 'NOT_SET' ? props.overrideOutcome : props.outcome;
+    return (React.createElement("div", { className: "bets-card-header T05_ALT" },
+        props.renderIcon
+            ? props.renderIcon()
+            : props.iconUrl && (React.createElement(Image, { crossOrigin: "anonymous", src: props.iconUrl, alt: `${props.betType} Icon`, width: 28, height: 22 })),
+        React.createElement("div", { className: "T05_ALT" }, props.betType.toLocaleLowerCase()),
+        React.createElement("span", { className: "T02" }, props.children),
+        React.createElement("div", { className: "bets-card-status-container" },
+            outcome && outcome !== 'PENDING' && React.createElement(OutcomeBadge, { outcome: outcome }),
+            props.legCountThreshold &&
+                props.legCount &&
+                props.legCount > props.legCountThreshold && (React.createElement("div", { className: "icon-container", "data-focused": props.betCardProps.focused },
+                React.createElement(Icon, { iconName: props.cardExpanded ? 'collapse' : 'expand', width: 48, height: 48 }))))));
+};
+export default BetsCardHeader;

package/dist/src/modules/bets/view/components/GamblingDisclaimer/GamblingDisclaimer.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import './GamblingDisclaimer.styles.css';
+declare class GamblingDisclaimer extends React.Component<{
+    text: string;
+}> {
+    render(): JSX.Element;
+}
+export default GamblingDisclaimer;

package/dist/src/modules/bets/view/components/GamblingDisclaimer/GamblingDisclaimer.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import Icon from '@/components/atoms/SvgIcon/Icon';
+import './GamblingDisclaimer.styles.css';
+import FocusableItem from '@/components/core/ScrollableContainer/FocusableItem';
+const FALLBACK_DISCLAIMER_TEXT = 'Odds by ESPN BET; 21+. Gambling Problem? Call 1-800-GAMBLER';
+class GamblingDisclaimer extends React.Component {
+    render() {
+        return (React.createElement(FocusableItem, null,
+            React.createElement("div", { className: "gambling-disclaimer" },
+                React.createElement(Icon, { iconName: "mobilePhone", width: 32, height: 32 }),
+                React.createElement("div", { className: "gambling-disclaimer-text T02" }, this.props.text || FALLBACK_DISCLAIMER_TEXT))));
+    }
+}
+export default GamblingDisclaimer;

package/dist/src/modules/bets/view/components/LocationWarning/LocationWarning.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import './LocationWarning.styles.css';
+interface LocationWarningProps {
+    /** Location disclaimer text from API, falls back to default if not provided */
+    disclaimerText?: string;
+}
+declare class LocationWarning extends React.Component<LocationWarningProps> {
+    render(): JSX.Element;
+}
+export default LocationWarning;

package/dist/src/modules/bets/view/components/LocationWarning/LocationWarning.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import Icon from '@/components/atoms/SvgIcon/Icon';
+import './LocationWarning.styles.css';
+import FocusableItem from '@/components/core/ScrollableContainer/FocusableItem';
+const FALLBACK_WARNING_TEXT = 'You are in a location outside of our operating area. Visit about.espnbet.com for more detail.';
+class LocationWarning extends React.Component {
+    render() {
+        const { disclaimerText } = this.props;
+        const displayText = disclaimerText || FALLBACK_WARNING_TEXT;
+        return (React.createElement(FocusableItem, null,
+            React.createElement("div", { className: "location-warning" },
+                React.createElement(Icon, { iconName: "betsWarning", width: 32, height: 32 }),
+                React.createElement("div", { className: "location-warning-text T02" }, displayText))));
+    }
+}
+export default LocationWarning;

package/dist/src/modules/bets/view/components/PromoCodeBanner/PromoCodeBanner.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="prop-types" />
+import React from 'react';
+import './PromoCodeBanner.styles.css';
+import { Direction, Layout } from '@/external/spatial-navigation/utils';
+import { IBetPromo } from '@/modules/bets/view-model/BetsViewModel';
+export default class FocusablePromoCodeBannerWrapper extends React.Component<IBetPromo> {
+    static contextTypes: {
+        refsMap: import("prop-types").Requireable<(HTMLElement | null | undefined)[]>;
+        setRef: import("prop-types").Requireable<(...args: any[]) => any>;
+        scrollToFocusedElement: import("prop-types").Requireable<(...args: any[]) => any>;
+    };
+    context: import("@/components/core/ScrollableContainer/ScrollableContainer").ScrollableContainerContextType;
+    onBecameFocused: (layout: Layout) => void;
+    onArrowPress: (d: Direction, _props: any) => void;
+    get viewModel(): import("@/modules/bets/view-model/BetsViewModel").BetsViewModel;
+    onEnterPress: () => void;
+    render(): JSX.Element;
+}

package/dist/src/modules/bets/view/components/PromoCodeBanner/PromoCodeBanner.js

@@ -0,0 +1,78 @@
+import React from 'react';
+import './PromoCodeBanner.styles.css';
+import { withFocusable, } from '@/external/spatial-navigation';
+import FocusableItem from '@/components/core/ScrollableContainer/FocusableItem';
+import { DEFAULT_SCROLLABLE_CONTAINER_CONTEXT, SCROLLABLE_CONTEXT_TYPE, } from '@/components/core/ScrollableContainer/ScrollableContainer';
+import SDK from '@/index';
+class PromoCodeBanner extends React.Component {
+    render() {
+        const { title, description, logo, qrCode, backgroundImage, focused, } = this.props;
+        return (React.createElement(FocusableItem, null,
+            React.createElement("div", { className: "promo-code-banner focus-ring", "data-focused": focused, style: {
+                    backgroundImage: `url(${backgroundImage})`,
+                } },
+                React.createElement("div", { className: "promo-content" },
+                    React.createElement("div", { className: "promo-logo-container" },
+                        React.createElement("img", { src: logo, alt: "ESPN Bet Logo", className: "promo-logo" })),
+                    React.createElement("div", { className: "promo-tagline T20" }, title)),
+                React.createElement("div", { className: "promo-action-area" },
+                    React.createElement("div", { className: "qr-code-container" },
+                        React.createElement("img", { src: qrCode, alt: "QR Code", className: "qr-code" })),
+                    React.createElement("div", { className: "promo-description T20" }, description)))));
+    }
+}
+const FocusablePromoCodeBanner = withFocusable()(PromoCodeBanner);
+export default class FocusablePromoCodeBannerWrapper extends React.Component {
+    constructor() {
+        super(...arguments);
+        Object.defineProperty(this, "context", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: DEFAULT_SCROLLABLE_CONTAINER_CONTEXT
+        });
+        Object.defineProperty(this, "onBecameFocused", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (layout) => {
+                this.context.scrollToFocusedElement(layout);
+            }
+        });
+        Object.defineProperty(this, "onArrowPress", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (d, _props) => {
+                if (d === 'left') {
+                    SDK.getMaestroEventViewModel().deliverFocus();
+                }
+            }
+        });
+        Object.defineProperty(this, "onEnterPress", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                // Track card click for promo
+                this.viewModel.trackCardClick('promo');
+            }
+        });
+    }
+    get viewModel() {
+        const vm = SDK.getMaestroEventViewModel().betsViewModel;
+        if (!vm) {
+            throw new Error('BetsViewModel is not initialized');
+        }
+        return vm;
+    }
+    render() {
+        return (React.createElement(FocusablePromoCodeBanner, { ...this.props, onBecameFocused: this.onBecameFocused, onArrowPress: this.onArrowPress, onEnterPress: this.onEnterPress }));
+    }
+}
+Object.defineProperty(FocusablePromoCodeBannerWrapper, "contextTypes", {
+    enumerable: true,
+    configurable: true,
+    writable: true,
+    value: SCROLLABLE_CONTEXT_TYPE
+});

package/dist/src/modules/bets/view/components/PromoCodeBanner/index.d.ts

@@ -0,0 +1 @@
+export { default as BetItemPromoCode } from './PromoCodeBanner';

package/dist/src/modules/bets/view/components/PromoCodeBanner/index.js

@@ -0,0 +1 @@
+export { default as BetItemPromoCode } from './PromoCodeBanner';

package/dist/src/modules/bets/view-model/BetsViewModel.d.ts

@@ -0,0 +1,219 @@
+import { Observable } from '../../../helpers/Observable';
+import { ITeam, IUserBet, IBetLeg } from '../interfaces/IBets';
+import { ViewModel } from '../../../view-models/ViewModel';
+import { TestUseCase } from '@/interfaces/IMaestroEvent';
+import IMaestroEventDelegate from '@/interfaces/IMaestroEventDelegate';
+import { BetCardType, BetType } from '../types/BetsAnalyticsTypes';
+declare const BET_ITEM_TYPE: {
+    readonly ODDS: "odds";
+    readonly USER_BETS: "userBets";
+    readonly PROMO: "promo";
+    readonly HOT_PROPS: "hotProps";
+    readonly LOCATION_DISCLAIMER: "locationDisclaimer";
+    readonly GAMBLING_MESSAGE: "gamblingMessage";
+};
+export type BetItemType = typeof BET_ITEM_TYPE[keyof typeof BET_ITEM_TYPE];
+type TeamOdd = {
+    teamAbbreviation: string;
+    startOfGameFirstLine: string;
+    startOfGameSecondLine: string;
+    gameSpreadFirstLine: string;
+    gameSpreadSecondLine: string;
+    totalPointsFirstLine: string;
+    totalPointsSecondLine: string;
+    moneylineFirstLine: string;
+};
+export type ISixPackOdds = {
+    topTeamOdds: TeamOdd;
+    bottomTeamOdds: TeamOdd;
+    drawOdds?: TeamOdd;
+    orderedColumns: {
+        abbreviation: string;
+        type: string;
+    }[];
+    gameState: string;
+};
+export type IUserBets = {
+    defaultTab: string;
+    bets: {
+        live: IUserBet[];
+        upcoming: IUserBet[];
+        settled: IUserBet[];
+    };
+};
+export type IHotProps = {
+    items: IBetLeg[];
+};
+export type ILocationDisclaimer = {
+    text: string;
+};
+export type IGamblingMessage = {
+    text: string;
+};
+export type IBetPromo = {
+    title: string;
+    description: string;
+    logo: string;
+    qrCode: string;
+    backgroundImage: string;
+};
+export type PromoBetItem = {
+    id: string;
+    type: 'promo';
+    data: IBetPromo;
+};
+export type LocationDisclaimerBetItem = {
+    type: 'locationDisclaimer';
+    id: string;
+    data: ILocationDisclaimer;
+};
+export type GamblingMessageBetItem = {
+    type: 'gamblingMessage';
+    id: string;
+    data: IGamblingMessage;
+};
+export type SixPackBetItem = {
+    type: 'sixPack';
+    data: ISixPackOdds;
+    teamInfo?: {
+        home: ITeam;
+        away: ITeam;
+    };
+    id: string;
+    hideWagers: boolean;
+};
+export type UserBetsBetItem = {
+    type: 'userBets';
+    data: IUserBets;
+    id: string;
+    hideWagers: boolean;
+};
+export type HotPropsBetItem = {
+    type: 'hotProps';
+    data: IHotProps;
+    id: string;
+    hideWagers: boolean;
+};
+export type BetItem = SixPackBetItem | UserBetsBetItem | PromoBetItem | HotPropsBetItem | LocationDisclaimerBetItem | GamblingMessageBetItem;
+declare const BET_ERROR_STATE: {
+    readonly NONE: "none";
+    readonly TAB_LOAD_FAILURE: "tabLoadFailure";
+};
+export type BetsErrorState = typeof BET_ERROR_STATE[keyof typeof BET_ERROR_STATE];
+export interface IBetsViewModelDelegate {
+    userIsAuthenticated(): Promise<boolean>;
+    getUserSWID(): Promise<string | null>;
+    getUserToken(): Promise<string | null>;
+}
+export declare class BetsViewModel extends ViewModel {
+    betsItems: Observable<BetItem[]>;
+    isDataLoading: Observable<boolean>;
+    errorState: Observable<BetsErrorState>;
+    hasEverSuccessfullyLoaded: Observable<boolean>;
+    hideWagers: Observable<boolean>;
+    private eventId;
+    private delegate;
+    private betsService;
+    private analyticsService;
+    private pollingInterval;
+    private pollingTask;
+    private lastNonPersonalizedResponseHash;
+    private lastPersonalizedResponseHash;
+    private useMockData;
+    private userSettingsManager;
+    private settingsSubscription;
+    initialized: boolean;
+    constructor(eventId: string, delegate: IMaestroEventDelegate, options?: {
+        useMockData?: boolean;
+    });
+    /**
+     * Initialize the ViewModel and start data fetching
+     */
+    init(): Promise<void>;
+    /**
+     * Clean up resources when the ViewModel is no longer needed
+     */
+    cleanup(): void;
+    /**
+     * Track panel view event
+     */
+    private trackPanelView;
+    /**
+     * Track card click event
+     */
+    trackCardClick(cardType: BetCardType, betType?: BetType | null): Promise<void>;
+    /**
+     * Get user bet counts for analytics
+     */
+    private getUserBetCounts;
+    /**
+     * Refresh polling for bet data
+     */
+    refreshPolling(): void;
+    /**
+     * Get user credentials from delegate
+     */
+    private getUserCredentials;
+    /**
+     * @description Update polling interval checking either response header or panel config.
+     * Refresh polling if necessary.
+     */
+    private updatePollingInterval;
+    private getPanelConfigInterval;
+    private getResponseHeaderPollingIntervalValue;
+    /**
+     * Poll with the personalized endpoint for both authenticated and anonymous users
+     *
+     * SWID format is provided by the client app delegate:
+     * - Logged in: {6D201B58-440C-47A6-970B-0F8C78C0BAB8} (with curly braces)
+     * - Anonymous: 6D201B58-440C-47A6-970B-0F8C78C0BAB8 (without curly braces)
+     * - Failsafe: Empty string if local storage fails
+     */
+    private pollWithInterval;
+    /**
+     * Process data received from polling
+     */
+    private processPolledData;
+    /**
+     * Process the bets data and update the betsItems
+     */
+    private processBetsData;
+    private processLocationDisclaimer;
+    private processPromoCode;
+    private processGamblingMessage;
+    private processSixPackData;
+    private processUserBetsData;
+    private processHotProps;
+    /**
+     * Handle errors that occur during polling
+     */
+    private handlePollingError;
+    /**
+     * Stop polling for bet data
+     */
+    stopPolling(): void;
+    /**
+     * Fetch new bet data immediately (one-time)
+     */
+    fetchNewData(): Promise<void>;
+    /**
+     * Fetch personalized bet data
+     */
+    private fetchPersonalizedData;
+    /**
+     * Fetch mock data for testing
+     */
+    private fetchMockData;
+    simulateUseCase<T = any>(useCase: TestUseCase, _: T): void;
+    clearTabLoadFailure(): void;
+    /**
+     * Check if wagers should be hidden based on user settings
+     */
+    shouldHideWagers(): boolean;
+    /**
+     * Update hideWagers Observable from current settings
+     */
+    private updateHideWagersFromSettings;
+    private refreshBetItemsWithNewSettings;
+}
+export default BetsViewModel;