@maestro_io/maestro-web-sdk 4.0.0 → 4.0.2

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

@@ -0,0 +1,149 @@
+import React from 'react';
+import { withFocusable, } from '@/external/spatial-navigation';
+import BetsCard from '../../components/BetsCard/BetsCard';
+import BetsCardHeader from '../../components/BetsCard/BetsCardHeader';
+import BetsCardFooter from './BetsCardFooter';
+import BetsCardEvent from './BetsCardEvent';
+import { DEFAULT_SCROLLABLE_CONTAINER_CONTEXT, SCROLLABLE_CONTEXT_TYPE, } from '@/components/core/ScrollableContainer/ScrollableContainer';
+import SDK from '@/index';
+export const EVENTS_COUNT_THRESHOLD = 3;
+class UserBetsCard extends React.Component {
+    constructor() {
+        super(...arguments);
+        Object.defineProperty(this, "context", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: DEFAULT_SCROLLABLE_CONTAINER_CONTEXT
+        });
+        Object.defineProperty(this, "onEnterPress", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                if (!this.props.hasFocusedChild) {
+                    // Track card click for bet sub-card with bet type (always track, regardless of focusable state)
+                    const cardType = `my bets > ${this.getCurrentSegment()}`;
+                    const betType = this.betType;
+                    this.viewModel.trackCardClick(cardType, betType);
+                    // Only set focus if the bet is focusable (has more than 3 events)
+                    if (this.betsFocusable) {
+                        SDK.getMaestroEventViewModel().navigation.setFocus(`sdk-bets-card-${this.betType}-bet-${this.props.bet.id}-0-0`);
+                    }
+                }
+            }
+        });
+        Object.defineProperty(this, "getCurrentSegment", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                // Determine the current segment based on bet status
+                if (this.props.bet.betStatus === 'OPEN') {
+                    return 'live';
+                }
+                else if (this.props.bet.betStatus === 'SETTLED') {
+                    return 'settled';
+                }
+                else {
+                    return 'upcoming';
+                }
+            }
+        });
+        Object.defineProperty(this, "focusCard", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                // Focus the card itself
+                SDK.getMaestroEventViewModel().navigation.setFocus(`${this.focusKeyPrefix}-${this.props.bet.id}`);
+            }
+        });
+        Object.defineProperty(this, "handleBetArrowPress", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (eventIndex, legIndex) => (d, _props) => {
+                if (d === 'up' && legIndex === 0 && eventIndex === 0) {
+                    // If the first leg of the first event is focused and up arrow is pressed,
+                    this.focusCard();
+                    // Return false to prevent further propagation
+                    return false;
+                }
+                if (d === 'left') {
+                    SDK.getMaestroEventViewModel().deliverFocus();
+                }
+            }
+        });
+        Object.defineProperty(this, "handleCardArrowPress", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (d, _props) => {
+                if (d === 'left') {
+                    SDK.getMaestroEventViewModel().deliverFocus();
+                }
+            }
+        });
+        Object.defineProperty(this, "renderHeader", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (headerProps) => {
+                return (React.createElement(BetsCardHeader, { betCardProps: headerProps, betType: this.betType, iconUrl: this.props.bet.rewardInfo.icon?.dark, legCount: this.props.bet.legCount, outcome: this.props.bet.outcome, overrideOutcome: this.props.bet.overrideOutcome, cardExpanded: !!this.props.hasFocusedChild, legCountThreshold: EVENTS_COUNT_THRESHOLD }, this.props.renderHeaderContent?.(headerProps)));
+            }
+        });
+        Object.defineProperty(this, "renderFooter", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                return (React.createElement(BetsCardFooter, { bet: this.props.bet, hideWagers: this.props.hideWagers }));
+            }
+        });
+        Object.defineProperty(this, "becameFocused", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (layout) => {
+                this.context.scrollToFocusedElement(layout);
+            }
+        });
+    }
+    get betsFocusable() {
+        return this.props.bet.events.length > EVENTS_COUNT_THRESHOLD;
+    }
+    get events() {
+        return this.props.hasFocusedChild
+            ? this.props.bet.events
+            : this.props.bet.events.slice(0, EVENTS_COUNT_THRESHOLD);
+    }
+    get focusKeyPrefix() {
+        return `sdk-${this.props.bet.type.toLowerCase()}-card`;
+    }
+    get betType() {
+        return this.props.bet.type.toLowerCase();
+    }
+    get viewModel() {
+        const vm = SDK.getMaestroEventViewModel().betsViewModel;
+        if (!vm) {
+            throw new Error('BetsViewModel is not initialized');
+        }
+        return vm;
+    }
+    render() {
+        return (React.createElement(BetsCard, { header: this.renderHeader, footer: this.renderFooter, onEnterPress: this.onEnterPress, focusKey: `${this.focusKeyPrefix}-${this.props.bet.id}`, onArrowPress: this.handleCardArrowPress, onBecameFocused: this.becameFocused, focused: this.props.focused },
+            this.events.map((event, eventIndex) => (React.createElement(BetsCardEvent, { betType: this.betType, betsFocusable: this.betsFocusable, event: event, eventIndex: eventIndex, onBetArrowPress: this.handleBetArrowPress, key: event.displayName, betId: this.props.bet.id, parentFocusKey: this.props.focusKey, onBetBackPress: this.focusCard, hideWagers: this.props.hideWagers }))),
+            !this.props.hasFocusedChild && this.betsFocusable && (React.createElement("div", { className: "more-bets T05_ALT" },
+                "+",
+                this.props.bet.legCount - EVENTS_COUNT_THRESHOLD,
+                " more"))));
+    }
+}
+Object.defineProperty(UserBetsCard, "contextTypes", {
+    enumerable: true,
+    configurable: true,
+    writable: true,
+    value: SCROLLABLE_CONTEXT_TYPE
+});
+export default withFocusable({ trackChildren: true })(UserBetsCard);

package/dist/src/modules/bets/view/UserBets/BetsCard/BetsCardEvent.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="prop-types" />
+import { IUserBet } from '@/modules/bets/interfaces/IBets';
+import React from 'react';
+import { Details, Direction, Layout } from '@/external/spatial-navigation/utils';
+type BetsCardEventProps = {
+    event: IUserBet['events'][number];
+    betsFocusable: boolean;
+    betId: string;
+    parentFocusKey: string;
+    eventIndex: number;
+    betType: string;
+    onBetArrowPress: (eventIndex: number, legIndex: number) => (direction: Direction, props: any, details: Details) => void;
+    onBetBackPress: () => void;
+    hideWagers?: boolean;
+};
+declare class BetsCardEvent extends React.Component<BetsCardEventProps> {
+    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;
+    render(): JSX.Element;
+}
+export default BetsCardEvent;

package/dist/src/modules/bets/view/UserBets/BetsCard/BetsCardEvent.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import Bet from '../../components/Bet/Bet';
+import { DEFAULT_SCROLLABLE_CONTAINER_CONTEXT, SCROLLABLE_CONTEXT_TYPE, } from '@/components/core/ScrollableContainer/ScrollableContainer';
+class BetsCardEvent 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);
+            }
+        });
+    }
+    render() {
+        return (React.createElement("div", { key: this.props.event.displayName, className: "bets-card-event T10" },
+            React.createElement("div", { className: "T10" }, this.props.event.displayName),
+            React.createElement("div", { className: "bets-card-bets" }, this.props.event.legs.map((leg, index) => (React.createElement(Bet, { key: `${this.props.betId}-${this.props.eventIndex}-${index}`, focusable: this.props.betsFocusable, focusKey: `sdk-bets-card-${this.props.betType}-bet-${this.props.betId}-${this.props.eventIndex}-${index}`, onArrowPress: this.props.onBetArrowPress(this.props.eventIndex, index), onBecameFocused: this.onBecameFocused, parentFocusKey: this.props.parentFocusKey, onBackPress: this.props.onBetBackPress, leg: leg, hideWagers: this.props.hideWagers }))))));
+    }
+}
+Object.defineProperty(BetsCardEvent, "contextTypes", {
+    enumerable: true,
+    configurable: true,
+    writable: true,
+    value: SCROLLABLE_CONTEXT_TYPE
+});
+export default BetsCardEvent;

package/dist/src/modules/bets/view/UserBets/BetsCard/BetsCardFooter.d.ts

@@ -0,0 +1,7 @@
+import { IUserBet } from '@/modules/bets/interfaces/IBets';
+type BetsCardFooterProps = {
+    bet: IUserBet;
+    hideWagers?: boolean;
+};
+declare const BetsCardFooter: (props: BetsCardFooterProps) => JSX.Element | null;
+export default BetsCardFooter;

package/dist/src/modules/bets/view/UserBets/BetsCard/BetsCardFooter.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import BetPill from '../../components/BetPill/BetPill';
+import BetResult from '../../UserBets/BetResult/BetResult';
+const BetsCardFooter = (props) => {
+    // Hide entire footer when hideWagers is true
+    if (props.hideWagers) {
+        return null;
+    }
+    const outcome = props.bet.overrideOutcome !== 'NOT_SET'
+        ? props.bet.overrideOutcome
+        : props.bet.outcome;
+    return (React.createElement("div", { className: "bets-card-footer T02" },
+        React.createElement(BetPill, null, `$${props.bet.betAmount} ${props.bet.type.toLowerCase()} ${props.bet.odds}`),
+        outcome !== 'LOSS' && (React.createElement(BetResult, null,
+            props.bet.betDisplayStatement,
+            React.createElement("span", null, `$${props.bet.payoutAmount}`)))));
+};
+export default BetsCardFooter;

package/dist/src/modules/bets/view/UserBets/Boost/Boost.d.ts

@@ -0,0 +1,7 @@
+import { IUserBet } from '@/modules/bets/interfaces/IBets';
+type BoostProps = {
+    bet: IUserBet;
+    hideWagers?: boolean;
+};
+declare const Boost: ({ bet, hideWagers }: BoostProps) => JSX.Element;
+export default Boost;

package/dist/src/modules/bets/view/UserBets/Boost/Boost.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import UserBetsCard from '../BetsCard/BetsCard';
+const Boost = ({ bet, hideWagers }) => {
+    return (React.createElement(UserBetsCard, { focusKey: `bets-boost-card-${bet.id}`, bet: bet, hideWagers: hideWagers }));
+};
+export default Boost;

package/dist/src/modules/bets/view/UserBets/OutcomeBadge/OutcomeBadge.d.ts

@@ -0,0 +1,6 @@
+import './OutcomeBadge.styles.css';
+type Props = {
+    outcome: string;
+};
+declare const OutcomeBadge: (props: Props) => JSX.Element;
+export default OutcomeBadge;

package/dist/src/modules/bets/view/UserBets/OutcomeBadge/OutcomeBadge.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import './OutcomeBadge.styles.css';
+import Icon from '@/components/atoms/SvgIcon';
+const OutcomeBadge = (props) => {
+    return (React.createElement("div", { className: "bet-outcome-badge T02" },
+        React.createElement(Icon, { iconName: props.outcome === 'WIN' ? 'checkmark' : 'times', width: 24, height: 24 }),
+        props.outcome));
+};
+export default OutcomeBadge;

package/dist/src/modules/bets/view/UserBets/Parlay/Parlay.d.ts

@@ -0,0 +1,8 @@
+import './Parlay.styles.css';
+import { IUserBet } from '@/modules/bets/interfaces/IBets';
+type ParlayProps = {
+    bet: IUserBet;
+    hideWagers?: boolean;
+};
+declare const Parlay: ({ bet, hideWagers }: ParlayProps) => JSX.Element;
+export default Parlay;

package/dist/src/modules/bets/view/UserBets/Parlay/Parlay.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import './Parlay.styles.css';
+import UserBetsCard from '../BetsCard/BetsCard';
+const Parlay = ({ bet, hideWagers }) => {
+    const renderHeaderContent = () => {
+        return (React.createElement("div", null,
+            bet.legCount,
+            " Leg",
+            bet.legCount > 1 ? 's' : ''));
+    };
+    return (React.createElement(UserBetsCard, { focusKey: `bets-parlay-card-${bet.id}`, bet: bet, renderHeaderContent: renderHeaderContent, hideWagers: hideWagers }));
+};
+export default Parlay;

package/dist/src/modules/bets/view/UserBets/Straight/Straight.d.ts

@@ -0,0 +1,7 @@
+import { IUserBet } from '@/modules/bets/interfaces/IBets';
+type StraightProps = {
+    bet: IUserBet;
+    hideWagers?: boolean;
+};
+declare const Straight: ({ bet, hideWagers }: StraightProps) => JSX.Element;
+export default Straight;

package/dist/src/modules/bets/view/UserBets/Straight/Straight.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import UserBetsCard from '../BetsCard/BetsCard';
+const Straight = ({ bet, hideWagers }) => {
+    return (React.createElement(UserBetsCard, { focusKey: `bets-straight-card-${bet.id}`, bet: bet, hideWagers: hideWagers }));
+};
+export default Straight;

package/dist/src/modules/bets/view/UserBets/Teaser/Teaser.d.ts

@@ -0,0 +1,7 @@
+import { IUserBet } from '@/modules/bets/interfaces/IBets';
+type TeaserProps = {
+    bet: IUserBet;
+    hideWagers?: boolean;
+};
+declare const Teaser: ({ bet, hideWagers }: TeaserProps) => JSX.Element;
+export default Teaser;

package/dist/src/modules/bets/view/UserBets/Teaser/Teaser.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import UserBetsCard from '../BetsCard/BetsCard';
+const Teaser = ({ bet, hideWagers }) => {
+    const renderHeaderContent = () => {
+        return (React.createElement("div", null,
+            bet.legCount,
+            " Point",
+            bet.legCount !== 1 ? 's' : '',
+            " Teaser"));
+    };
+    return (React.createElement(UserBetsCard, { focusKey: `bets-teaser-card-${bet.id}`, bet: bet, renderHeaderContent: renderHeaderContent, hideWagers: hideWagers }));
+};
+export default Teaser;

package/dist/src/modules/bets/view/UserBets/UserBetsView.d.ts

@@ -0,0 +1,25 @@
+import { SegmentItem } from '@/components/organisms/SegmentController/SegmentController';
+import React from 'react';
+import './UserBetsView.styles.css';
+import { IUserBet } from '../../interfaces/IBets';
+import { UserBetsBetItem } from '../../view-model/BetsViewModel';
+export type Segments = 'live' | 'settled' | 'upcoming';
+type UserBetsViewProps = {
+    item: UserBetsBetItem;
+};
+declare class UserBetsView extends React.Component<UserBetsViewProps, {
+    activeSegment: string;
+}> {
+    state: {
+        activeSegment: string;
+    };
+    setSegment: (segment: Segments) => () => void;
+    segmentItems: (SegmentItem & {
+        type: Segments;
+    })[];
+    renderBet: (bet: IUserBet) => JSX.Element | null;
+    renderBets: () => JSX.Element | (JSX.Element | null)[];
+    get bets(): IUserBet[] | null;
+    render(): JSX.Element;
+}
+export default UserBetsView;

package/dist/src/modules/bets/view/UserBets/UserBetsView.js

@@ -0,0 +1,107 @@
+import SegmentController from '@/components/organisms/SegmentController/SegmentController';
+import React from 'react';
+import './UserBetsView.styles.css';
+import Parlay from './Parlay/Parlay';
+import Boost from './Boost/Boost';
+import Straight from './Straight/Straight';
+import Teaser from './Teaser/Teaser';
+class UserBetsView extends React.Component {
+    constructor() {
+        super(...arguments);
+        Object.defineProperty(this, "state", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {
+                activeSegment: this.props.item.data.defaultTab,
+            }
+        });
+        Object.defineProperty(this, "setSegment", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (segment) => {
+                return () => {
+                    if (this.state.activeSegment !== segment) {
+                        this.setState({ activeSegment: segment });
+                    }
+                };
+            }
+        });
+        Object.defineProperty(this, "segmentItems", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: [
+                {
+                    title: 'Live',
+                    type: 'live',
+                    onEnter: this.setSegment('live'),
+                },
+                {
+                    title: 'Settled',
+                    type: 'settled',
+                    onEnter: this.setSegment('settled'),
+                },
+                {
+                    title: 'Upcoming',
+                    type: 'upcoming',
+                    onEnter: this.setSegment('upcoming'),
+                },
+            ]
+        });
+        Object.defineProperty(this, "renderBet", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (bet) => {
+                const { hideWagers } = this.props.item;
+                switch (bet.type) {
+                    case 'PARLAY':
+                        return React.createElement(Parlay, { key: bet.id, bet: bet, hideWagers: hideWagers });
+                    case 'BOOST':
+                        return React.createElement(Boost, { key: bet.id, bet: bet, hideWagers: hideWagers });
+                    case 'STRAIGHT':
+                        return React.createElement(Straight, { key: bet.id, bet: bet, hideWagers: hideWagers });
+                    case 'TEASER':
+                        return React.createElement(Teaser, { key: bet.id, bet: bet, hideWagers: hideWagers });
+                    default:
+                        console.warn('unknown type', bet.type);
+                        return null;
+                }
+            }
+        });
+        Object.defineProperty(this, "renderBets", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                if (this.bets?.length) {
+                    return this.bets.map((bet) => this.renderBet(bet));
+                }
+                return (React.createElement("div", { className: "no-user-bets T05_ALT" },
+                    "No ",
+                    this.state.activeSegment,
+                    " Bets"));
+            }
+        });
+    }
+    get bets() {
+        switch (this.state.activeSegment) {
+            case 'live':
+                return this.props.item.data.bets.live;
+            case 'settled':
+                return this.props.item.data.bets.settled;
+            case 'upcoming':
+                return this.props.item.data.bets.upcoming;
+            default:
+                return null;
+        }
+    }
+    render() {
+        return (React.createElement("section", { className: "my-bets-view" },
+            React.createElement(SegmentController, { items: this.segmentItems }),
+            this.renderBets()));
+    }
+}
+export default UserBetsView;

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

@@ -0,0 +1,158 @@
+/// <reference types="prop-types" />
+import React from 'react';
+import './Bet.styles.css';
+import { WithFocusableProps } from '@/external/spatial-navigation';
+import { IBetLeg } from '@/modules/bets/interfaces/IBets';
+declare const _default: {
+    new (props: ({
+        leg: IBetLeg;
+        hideWagers?: boolean | undefined;
+    } & WithFocusableProps) | Readonly<{
+        leg: IBetLeg;
+        hideWagers?: boolean | undefined;
+    } & WithFocusableProps>): {
+        state: import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState;
+        navigation: import("../../../../../external/spatial-navigation/spatialNavigation").default;
+        getChildContext(): {
+            parentFocusKey: string;
+        };
+        setFocus: (focusKey: string) => void;
+        navigateByDirection: (direction: import("../../../../../external/spatial-navigation/utils").Direction, details?: Record<string, any>) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onEnterReleaseHandler: () => void;
+        onBackPressHandler: (details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onArrowPressHandler: (direction: import("../../../../../external/spatial-navigation/utils").Direction, details: import("../../../../../external/spatial-navigation/utils").Details) => boolean | void;
+        onBecameFocusedHandler: (layout: import("../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onBecameBlurredHandler: (layout: import("../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        componentWillUnmount(): void;
+        render(): React.ReactElement<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps, string | React.JSXElementConstructor<any>>;
+        context: any;
+        setState<K extends keyof import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>) => import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, prevState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    new (props: {
+        leg: IBetLeg;
+        hideWagers?: boolean | undefined;
+    } & WithFocusableProps, context: any): {
+        state: import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState;
+        navigation: import("../../../../../external/spatial-navigation/spatialNavigation").default;
+        getChildContext(): {
+            parentFocusKey: string;
+        };
+        setFocus: (focusKey: string) => void;
+        navigateByDirection: (direction: import("../../../../../external/spatial-navigation/utils").Direction, details?: Record<string, any>) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onEnterReleaseHandler: () => void;
+        onBackPressHandler: (details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onArrowPressHandler: (direction: import("../../../../../external/spatial-navigation/utils").Direction, details: import("../../../../../external/spatial-navigation/utils").Details) => boolean | void;
+        onBecameFocusedHandler: (layout: import("../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onBecameBlurredHandler: (layout: import("../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        componentWillUnmount(): void;
+        render(): React.ReactElement<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps, string | React.JSXElementConstructor<any>>;
+        context: any;
+        setState<K extends keyof import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>) => import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, prevState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<{
+            leg: IBetLeg;
+            hideWagers?: boolean | undefined;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    contextTypes: {
+        parentFocusKey: import("prop-types").Requireable<string>;
+    };
+    childContextTypes: {
+        parentFocusKey: import("prop-types").Requireable<string>;
+    };
+    contextType?: React.Context<any> | undefined;
+};
+export default _default;