@maestro_io/maestro-web-sdk 5.0.0 → 5.1.0

package/dist/src/modules/espn/fantasy/view/FantasyView.d.ts

@@ -0,0 +1,34 @@
+import { Component } from 'react';
+import './FantasyView.styles.css';
+import { Direction } from '@/external/spatial-navigation/utils';
+import FantasyViewModel, { FantasyErrorState, FantasyItem } from '../view-model/FantasyViewModel';
+interface State {
+    container: HTMLDivElement | null;
+    items: FantasyItem[];
+    isDataLoading: boolean;
+    errorState: FantasyErrorState;
+    headerHeights: Map<string, number>;
+}
+declare class FantasyView extends Component<{}, State> {
+    private container;
+    private itemsListener;
+    private isDataLoadingListener;
+    private errorStateListener;
+    private maxHeightCleanup;
+    private vm;
+    constructor(props: {});
+    get viewModel(): FantasyViewModel;
+    componentDidMount(): void;
+    componentDidUpdate(_prevProps: {}, prevState: State): void;
+    componentWillUnmount(): void;
+    private recalculateMaxHeight;
+    setContainerRef: (e: HTMLDivElement | null) => void;
+    clearTabLoadFailure: () => void;
+    onHeaderRef: (id: string, ref: HTMLDivElement | null) => void;
+    getMaxHeaderHeight: () => number;
+    onArrowPress: (d: Direction) => void;
+    onEnterPress: (item: FantasyItem) => void;
+    renderItems: () => JSX.Element | JSX.Element[] | null;
+    render(): JSX.Element;
+}
+export default FantasyView;

package/dist/src/modules/espn/fantasy/view/FantasyView.js

@@ -0,0 +1,212 @@
+import React, { Component } from 'react';
+import './FantasyView.styles.css';
+import ScrollableContainer from '@/components/core/ScrollableContainer';
+import SDK from '@/index';
+import TabLoadErrorView from '@/components/molecules/TabLoadError';
+import { captureException } from '@/sentry';
+import FantasyItemView from './FantasyItemView';
+import FantasyHeaderView from './FantasyHeaderView';
+import { setupMaxHeightToBottom } from '@/hooks/useMaxHeightToBottom';
+class FantasyView extends Component {
+    constructor(props) {
+        super(props);
+        Object.defineProperty(this, "container", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "itemsListener", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "isDataLoadingListener", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "errorStateListener", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "maxHeightCleanup", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "vm", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "recalculateMaxHeight", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                if (this.container) {
+                    const rect = this.container.getBoundingClientRect();
+                    this.container.style.maxHeight = `${window.innerHeight - rect.top}px`;
+                }
+            }
+        });
+        Object.defineProperty(this, "setContainerRef", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (e) => {
+                // Update instance variable synchronously
+                this.container = e;
+                // Setup/cleanup height listener with current container reference
+                if (e) {
+                    if (this.maxHeightCleanup) {
+                        this.maxHeightCleanup();
+                    }
+                    // Pass this.container directly (already updated above)
+                    this.maxHeightCleanup = setupMaxHeightToBottom(() => this.container);
+                }
+            }
+        });
+        Object.defineProperty(this, "clearTabLoadFailure", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                this.viewModel.clearTabLoadFailure();
+            }
+        });
+        Object.defineProperty(this, "onHeaderRef", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (id, ref) => {
+                if (!ref)
+                    return;
+                const height = ref.clientHeight;
+                this.setState((prev) => {
+                    const current = prev.headerHeights.get(id);
+                    if (current === height)
+                        return null;
+                    const next = new Map(prev.headerHeights);
+                    next.set(id, height);
+                    return { headerHeights: next };
+                });
+            }
+        });
+        Object.defineProperty(this, "getMaxHeaderHeight", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                const { headerHeights } = this.state;
+                if (headerHeights.size === 0)
+                    return 40;
+                return Math.max(...Array.from(headerHeights.values()));
+            }
+        });
+        Object.defineProperty(this, "onArrowPress", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (d) => {
+                if (d === 'left') {
+                    SDK.getMaestroEventViewModel().deliverFocus();
+                }
+            }
+        });
+        Object.defineProperty(this, "onEnterPress", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (item) => {
+                if (item.type === 'notLoggedIn') {
+                    this.viewModel.onAskLogin();
+                }
+                this.viewModel.onEngage(item.type);
+            }
+        });
+        Object.defineProperty(this, "renderItems", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                const { items } = this.state;
+                if (this.state.errorState === 'tabLoadFailure') {
+                    return (React.createElement(TabLoadErrorView, { onEnterPress: this.clearTabLoadFailure, onArrowPress: this.onArrowPress }));
+                }
+                try {
+                    return items.map((item, i) => {
+                        if (item.type === 'fantasy-group') {
+                            return (React.createElement("div", { key: item.id, className: "fantasy-group-container", style: { position: 'relative' } },
+                                React.createElement(FantasyHeaderView, { ref: (ref) => this.onHeaderRef(item.id, ref), item: item.header }),
+                                item.items.map((subItem) => (React.createElement(FantasyItemView, { key: subItem.id, item: subItem, onEnterPress: this.onEnterPress })))));
+                        }
+                        return (React.createElement(FantasyItemView, { key: item.type + i, item: item, onEnterPress: this.onEnterPress }));
+                    });
+                }
+                catch (error) {
+                    captureException(error, { items });
+                    console.error('Error rendering fantasy components:', error);
+                    return null;
+                }
+            }
+        });
+        this.vm = SDK.getMaestroEventViewModel()
+            .fantasyViewModel;
+        this.state = {
+            container: null,
+            items: this.viewModel.fantasyItems.value,
+            isDataLoading: this.viewModel.isDataLoading.value,
+            errorState: this.viewModel.errorState.value,
+            headerHeights: new Map(),
+        };
+    }
+    get viewModel() {
+        if (!this.vm) {
+            throw new Error('FantasyViewModel is not initialized');
+        }
+        return this.vm;
+    }
+    componentDidMount() {
+        this.maxHeightCleanup = setupMaxHeightToBottom(() => this.container);
+        this.itemsListener = this.viewModel.fantasyItems.subscribe((items) => {
+            this.setState({ items });
+        });
+        this.isDataLoadingListener = this.viewModel.isDataLoading.subscribe((isDataLoading) => {
+            this.setState({ isDataLoading });
+        });
+        this.errorStateListener = this.viewModel.errorState.subscribe((errorState) => {
+            this.setState({ errorState });
+        });
+        // Initialize the view model
+        this.viewModel.init();
+    }
+    componentDidUpdate(_prevProps, prevState) {
+        // Recalculate max height when header heights change (due to focus changes)
+        if (prevState.headerHeights !== this.state.headerHeights) {
+            this.recalculateMaxHeight();
+        }
+    }
+    componentWillUnmount() {
+        this.itemsListener && this.itemsListener();
+        this.isDataLoadingListener && this.isDataLoadingListener();
+        this.errorStateListener && this.errorStateListener();
+        this.maxHeightCleanup && this.maxHeightCleanup();
+        // Clean up the view model
+        this.viewModel.cleanup();
+    }
+    render() {
+        return (React.createElement(ScrollableContainer, { scrollableContainerRef: this.container, containerTopOffset: this.getMaxHeaderHeight() || 40, "data-has-error": this.state.errorState !== 'none' },
+            React.createElement("div", { className: "fantasy-view", ref: this.setContainerRef },
+                this.renderItems(),
+                React.createElement("div", { className: "fantasy-bottom-padding" }))));
+    }
+}
+export default FantasyView;

package/dist/src/modules/espn/fantasy/view/InactiveLeague/DraftDateCountdown.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="node" />
+import React from 'react';
+declare class DraftDateCountDown extends React.Component<{
+    draftDate: number;
+}> {
+    interval: NodeJS.Timer | null;
+    state: {
+        days: string;
+        hours: string;
+        minutes: string;
+        seconds: string;
+    };
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    updateDate(): void;
+    getFormattedTimestamp(): string;
+    get items(): {
+        label: string;
+        value: string;
+    }[];
+    render(): JSX.Element;
+}
+export default DraftDateCountDown;

package/dist/src/modules/espn/fantasy/view/InactiveLeague/DraftDateCountdown.js

@@ -0,0 +1,95 @@
+import React from 'react';
+class DraftDateCountDown extends React.Component {
+    constructor() {
+        super(...arguments);
+        Object.defineProperty(this, "interval", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "state", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {
+                days: '0',
+                hours: '0',
+                minutes: '0',
+                seconds: '0',
+            }
+        });
+    }
+    componentDidMount() {
+        this.updateDate();
+        this.interval = setInterval(() => this.updateDate(), 1000);
+    }
+    componentWillUnmount() {
+        if (this.interval) {
+            clearInterval(this.interval);
+        }
+    }
+    updateDate() {
+        const now = new Date();
+        const futureDate = new Date(this.props.draftDate);
+        const totalSeconds = Math.floor((futureDate.getTime() - now.getTime()) / 1000);
+        const days = Math.floor(totalSeconds / (3600 * 24))
+            .toString()
+            .padStart(2, '0');
+        const hours = Math.floor((totalSeconds % (3600 * 24)) / 3600)
+            .toString()
+            .padStart(2, '0');
+        const minutes = Math.floor((totalSeconds % 3600) / 60)
+            .toString()
+            .padStart(2, '0');
+        const seconds = (totalSeconds % 60).toString().padStart(2, '0');
+        this.setState({ days, hours, minutes, seconds });
+        // check if the countdown has ended
+        if (totalSeconds <= 0) {
+            if (this.interval) {
+                clearInterval(this.interval);
+            }
+        }
+    }
+    getFormattedTimestamp() {
+        const date = new Date(this.props.draftDate);
+        const options = {
+            month: 'long',
+            day: 'numeric',
+            hour: 'numeric',
+            minute: 'numeric',
+            hour12: true,
+        };
+        return date.toLocaleString('en-US', options);
+    }
+    get items() {
+        return [
+            {
+                label: 'Days',
+                value: this.state.days,
+            },
+            {
+                label: 'Hours',
+                value: this.state.hours,
+            },
+            {
+                label: 'Minutes',
+                value: this.state.minutes,
+            },
+            {
+                label: 'Seconds',
+                value: this.state.seconds,
+            },
+        ];
+    }
+    render() {
+        return (React.createElement("div", { className: "draft-date T02" },
+            React.createElement("div", { className: "date-countdown" }, this.items.map((item) => (React.createElement("div", { key: item.label, className: "segment" },
+                React.createElement("div", { className: "segment-value T50 FONT_BOLD" }, item.value),
+                React.createElement("div", { className: "segment-label" }, item.label))))),
+            React.createElement("span", null,
+                "Snake Draft | ",
+                this.getFormattedTimestamp())));
+    }
+}
+export default DraftDateCountDown;

package/dist/src/modules/espn/fantasy/view/InactiveLeague/InactiveLeague.d.ts

@@ -0,0 +1,100 @@
+/// <reference types="prop-types" />
+import React from 'react';
+import { WithFocusableProps } from '@/external/spatial-navigation';
+import './InactiveLeague.styles.css';
+import { InactiveLeague } from '../../view-model/FantasyViewModel';
+type Props = {
+    item: InactiveLeague;
+};
+declare const _default: {
+    new (props: (Props & WithFocusableProps) | Readonly<Props & 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?: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onClickPressHandler: (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<Props & 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<Props & 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<Props & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<Props & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<Props & WithFocusableProps>, prevState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<Props & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Props & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<Props & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<Props & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    new (props: Props & 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?: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onClickPressHandler: (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<Props & 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<Props & 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<Props & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<Props & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<Props & WithFocusableProps>, prevState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<Props & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Props & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<Props & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<Props & 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;

package/dist/src/modules/espn/fantasy/view/InactiveLeague/InactiveLeague.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { withFocusable, } from '@/external/spatial-navigation';
+import './InactiveLeague.styles.css';
+import LeagueCard from '../../components/LeagueCard';
+import DraftDateCountDown from './DraftDateCountdown';
+class InactiveLeagueView extends React.Component {
+    render() {
+        return (React.createElement(LeagueCard, { leagueColor: this.props.item.leagueColor, leagueLogo: this.props.item.leagueLogo, renderTitle: () => React.createElement("span", null, this.props.item.leagueName), shouldExpand: false, expanded: false, ...this.props },
+            !this.props.item.draftDate ? (React.createElement("div", { className: "T30 FONT_BOLD" }, "Draft Date not set")) : (React.createElement(DraftDateCountDown, { draftDate: this.props.item.draftDate })),
+            React.createElement("div", { className: "description T10" }, "You can try a Mock Draft in the ESPN Fantasy App before Draft Day starts.")));
+    }
+}
+export default withFocusable()(InactiveLeagueView);

package/dist/src/modules/espn/fantasy/view/InactiveLeague/index.d.ts

@@ -0,0 +1,2 @@
+import InactiveLeague from './InactiveLeague';
+export default InactiveLeague;

package/dist/src/modules/espn/fantasy/view/InactiveLeague/index.js

@@ -0,0 +1,2 @@
+import InactiveLeague from './InactiveLeague';
+export default InactiveLeague;

package/dist/src/modules/espn/fantasy/view/LoginView/LoginView.d.ts

@@ -0,0 +1,96 @@
+/// <reference types="prop-types" />
+import { WithFocusableProps } from '@/external/spatial-navigation';
+import React from 'react';
+import './LoginView.styles.css';
+declare const _default: {
+    new (props: (object & WithFocusableProps) | Readonly<object & 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?: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onClickPressHandler: (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<object & 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<object & 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<object & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<object & WithFocusableProps>, prevState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<object & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<object & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    new (props: object & 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?: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../external/spatial-navigation/utils").Details) => void;
+        onClickPressHandler: (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<object & 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<object & 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<object & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<object & WithFocusableProps>, prevState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<object & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<object & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<object & 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;

package/dist/src/modules/espn/fantasy/view/LoginView/LoginView.js

@@ -0,0 +1,27 @@
+import { withFocusable, } from '@/external/spatial-navigation';
+import React from 'react';
+import './LoginView.styles.css';
+import ActionButton from '@/components/molecules/ActionButton';
+class LoginView extends React.Component {
+    render() {
+        const { focused } = this.props;
+        return (React.createElement("div", { "data-focused": focused, className: "login-view focus-ring" },
+            React.createElement("svg", { width: "169", height: "71", viewBox: "0 0 169 71", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+                React.createElement("path", { d: "M96.4307 35.0936C96.3936 33.803 95.1664 31.735 94.3102 31.763C93.6302 31.7847 93.0398 32.2574 92.7987 34.4747C92.5576 36.692 92.4711 40.2372 92.4093 42.0875C92.3443 43.9378 92.4556 47.6354 92.5793 48.9384C92.7029 50.2414 93.3891 51.1215 94.8604 51.0779C96.3318 51.0344 96.6409 50.6083 96.7676 49.7469C96.8943 48.8855 96.9562 47.0227 96.8665 45.0791C96.7769 43.1355 96.4709 36.3872 96.4307 35.0936Z", fill: "#F1F2F4" }),
+                React.createElement("path", { d: "M55.8486 11.8354C52.9709 11.4062 49.5615 11.1606 47.5554 11.2196C42.14 11.3814 38.8913 12.6222 38.2236 12.8772C37.2469 13.2503 35.6488 15.5454 35.6704 16.2793C35.7014 17.2869 36.9347 18.0052 38.5729 17.9555C39.4693 17.9275 40.9314 17.8342 40.9128 17.1531C40.8912 16.4721 38.3504 16.3384 38.3411 15.9932C38.3256 15.477 41.4692 14.911 46.7085 14.7555C60.0092 14.3574 84.8363 25.9632 85.2103 38.5983C85.4761 47.6416 73.5108 49.5634 68.2746 49.7189C66.049 49.7842 63.7771 49.5323 61.5732 49.0627C61.533 46.2795 61.4527 42.9427 61.4156 41.6521C61.3754 40.3087 61.397 38.3091 61.4032 36.6515C66.2623 36.6826 74.1475 37.5254 74.2031 39.4472C74.2402 40.7223 71.3965 40.9057 71.4181 41.6956C71.4305 42.1061 72.9791 42.8649 74.3021 42.8245C75.625 42.7841 78.1442 41.3193 78.0607 38.4552C77.9526 34.7608 72.0085 31.6386 62.0894 31.9371L61.5547 31.9558C61.5485 31.34 61.5083 27.8881 61.091 25.9943C60.6335 23.9107 59.425 22.5486 58.8408 22.5642C57.388 22.6077 56.9212 29.6576 56.8223 32.4253C49.7531 33.5293 43.7102 36.3188 43.8091 39.6618C43.8771 41.9071 48.6033 47.598 56.4514 51.0996C56.6925 53.2765 57.3323 55.9509 58.9737 55.9012C61.6567 55.8203 61.5145 54.8127 61.5794 52.9095C64.4788 53.6746 67.6625 54.1006 71.0874 53.998C84.0851 53.6092 90.7432 46.3354 90.5145 38.5827C90.1776 27.1853 72.5958 14.3357 55.8456 11.8385L55.8486 11.8354ZM56.3927 47.542C50.2384 45.247 45.5524 41.7267 45.4968 39.8951C45.4443 38.1442 51.8056 37.2144 56.7759 36.8412C56.7481 39.8173 56.677 43.7916 56.3927 47.542Z", fill: "#F1F2F4" }),
+                React.createElement("path", { d: "M106.529 19.8276C106.479 18.167 105.41 16.5592 102.823 16.5996C102.579 15.987 101.759 14.7493 98.8384 14.8364C92.474 15.0261 87.5778 19.7685 87.686 23.5065C87.7231 24.7224 88.3042 25.786 89.1604 26.6567C88.9379 27.2662 88.9163 27.6767 88.9224 27.91C88.941 28.5599 89.9116 30.2734 90.6596 30.2516C91.2902 30.233 91.7198 29.639 92.3287 28.675C93.3673 29.0793 94.3997 29.2845 95.2219 29.2596C101.206 29.0793 106.637 23.4381 106.529 19.8276ZM92.712 21.2985C91.8558 22.2657 91.1758 23.1178 90.675 23.861C90.5854 23.7086 90.4989 23.4692 90.4865 23.0929C90.4618 22.2657 91.8805 19.0968 95.4507 18.8356C94.5419 19.4638 93.6208 20.2661 92.712 21.2954V21.2985ZM102.282 19.2585C103.438 19.2243 103.741 19.9427 103.766 20.7388C103.803 21.9765 101.574 25.5932 96.5542 25.7424C95.4538 25.7767 94.5265 25.6927 93.7846 25.5683C94.5203 24.5203 98.3408 19.3767 102.279 19.2585H102.282Z", fill: "#F1F2F4" }),
+                React.createElement("path", { d: "M109.836 31.4144C106.331 31.5202 99.8091 32.6366 98.8756 35.8428C98.4305 37.3759 98.2481 39.2293 99.5371 40.0503C100.826 40.8713 104.6 40.8526 107.116 40.9833C109.632 41.1139 113.981 41.8105 114.025 43.241C114.056 44.3201 112.22 46.329 106.158 46.5125C99.3547 46.7146 101.259 43.8132 102.619 43.7727C105.002 43.7012 104.798 45.3929 108.934 45.2686C109.849 45.2406 111.92 44.7181 111.889 43.7012C111.852 42.448 107.16 41.3471 104.127 41.4373C101.098 41.5275 99.2929 43.0917 99.3454 44.855C99.4042 46.839 102.189 50.7449 108.946 50.5428C111.187 50.4775 114.111 49.3579 114.983 48.9474C115.669 48.624 117.19 47.7688 117.072 43.7199C116.921 38.5918 111.861 38.4737 108.711 38.2808C105.645 38.0943 102.304 37.9325 102.282 37.2017C102.242 35.821 113.366 35.3452 115.57 35.1213C117.44 34.9316 117.783 33.554 117.765 32.8947C117.731 31.7689 113.342 31.3118 109.836 31.4144Z", fill: "#F1F2F4" }),
+                React.createElement("path", { d: "M128.348 28.6526C126.596 28.7055 128.46 31.9241 129.656 38.1655C130.184 40.9238 130.806 43.4241 129.971 43.449C129.134 43.4739 124.172 32.6736 121.802 32.742C118.881 32.829 117.904 43.0292 117.99 46.0301C118.08 49.0311 118.772 50.5518 120.349 50.5051C121.391 50.474 122.04 49.4696 122.157 47.5912C122.275 45.7129 122.312 39.4809 122.754 39.4685C123.576 39.4436 127.189 49.5224 130.364 49.4291C133.711 49.3296 134.231 44.4659 134.119 40.7497C133.884 32.7482 129.637 28.6153 128.342 28.6526H128.348Z", fill: "#F1F2F4" }),
+                React.createElement("path", { d: "M147.099 44.6214C145.788 44.6619 142.598 45.2652 141.423 45.601C140.249 45.9369 139.337 46.139 139.628 45.2247C139.859 44.497 140.369 42.768 140.567 42.0963L146.558 41.9159C147.726 41.8817 147.788 41.2908 147.887 39.8261C147.986 38.3614 146.997 38.548 145.875 38.5822C145.875 38.5822 143.89 38.6631 141.77 38.7688L142.719 36.225C144.898 36.1441 147.17 35.9047 148.576 35.8643C151.324 35.7834 151.587 35.0744 151.577 34.7883C151.568 34.5022 151.293 33.7651 150.57 32.7202C149.843 31.6785 149.197 31.2369 146.925 31.3022C144.811 31.3644 135.668 32.1138 135.705 33.3702C135.72 33.9424 136.527 35.2174 137.56 35.715C137.94 35.8985 138.431 36.0229 139 36.1068L137.597 39.0176C137.396 39.0331 137.226 39.0518 137.09 39.0673C135.39 39.2601 135.85 40.3921 136.039 41.4183C136.122 41.8724 136.231 42.0807 136.37 42.1709C135.792 43.7476 135.186 45.7783 135.232 47.2927C135.316 50.1507 137.782 51.746 139.597 51.69C143.828 51.5625 147.881 48.12 148.632 47.3985C149.383 46.677 148.406 44.5779 147.095 44.6152L147.099 44.6214Z", fill: "#F1F2F4" }),
+                React.createElement("path", { d: "M168.995 38.2405C168.897 34.8788 167.617 32.4936 165.475 32.5558C162.341 32.6491 157.837 37.4164 154.217 43.3966C153.893 40.9678 155.797 37.233 157.42 34.6176C158.56 32.7828 158.359 30.5998 157.886 30.6153C157.222 30.634 150.805 36.1041 151.024 43.6049C151.068 45.0603 151.445 46.2856 152.072 47.2838C149.618 52.1538 147.967 57.316 148.082 61.2033C148.211 65.5818 150.882 67.2145 151.695 67.1896C152.508 67.1647 152.548 65.8711 152.693 64.9039C153.519 59.4369 154.944 54.5918 156.57 50.5211C157.213 50.6828 157.849 50.7606 158.44 50.7419C163.416 50.5926 169.184 44.6094 168.995 38.2405ZM158.712 45.7662C161.707 39.8701 164.798 36.5115 165.886 36.4773C167.771 36.4213 166.176 44.995 158.712 45.7662Z", fill: "#F1F2F4" }),
+                React.createElement("path", { d: "M40.6716 34.2326C40.3285 33.9247 39.9266 33.7661 39.4753 33.7661C39.1662 33.7661 38.8695 33.8501 38.5975 34.018C38.3193 34.189 38.106 34.4565 37.9669 34.8079L33.2191 45.4434C33.1851 45.518 33.1233 45.6549 33.0615 45.7855C33.0213 45.6549 32.978 45.5242 32.9502 45.4527C32.9131 45.3532 32.7771 45.0702 32.7771 45.0702L28.1653 34.7737C27.8562 34.1051 27.3369 33.7661 26.6229 33.7661C25.7419 33.7443 24.7435 34.4627 24.7744 35.3956C24.7744 35.6382 24.8239 35.8434 24.9197 36.0518L31.1821 49.4364C30.7896 50.2729 30.4001 51.1094 30.0075 51.946C29.3832 53.2832 28.7588 54.6173 28.1313 55.9545C27.8562 56.5391 27.5718 57.0958 27.578 57.7271C27.5625 58.6165 28.2117 59.369 29.1266 59.3473C30.1776 59.3473 30.7154 58.1003 30.7154 58.1003L41.0487 36.0487C41.1445 35.8341 41.194 35.6009 41.194 35.3614C41.194 34.9261 41.0178 34.5436 40.6685 34.2295L40.6716 34.2326Z", fill: "#F1F2F4" }),
+                React.createElement("path", { d: "M21.8504 27.8349C21.5166 27.4866 21.0839 27.3125 20.5646 27.3125C19.832 27.3125 19.2385 27.7385 18.7996 28.5751L11.4832 42.6531C11.4832 42.6531 11.3502 42.8926 11.3131 42.9796C11.2761 43.0667 11.2142 43.2067 11.1771 43.2937C11.14 43.2098 11.0751 43.0667 11.0411 42.9796C11.0071 42.8957 10.8711 42.6531 10.8711 42.6531L3.55159 28.5751C3.11266 27.7354 2.51609 27.3125 1.78661 27.3125C1.26732 27.3125 0.834576 27.4898 0.500746 27.8349C0.170006 28.1801 0 28.6311 0 29.1722V49.3143C0 49.8336 0.15146 50.2597 0.448198 50.5831C0.748028 50.9096 1.15604 51.0744 1.6537 51.0744C2.15135 51.0744 2.5841 50.9127 2.87465 50.5986C3.16212 50.2877 3.30739 49.8523 3.30739 49.3112V35.0124L3.30121 34.7138L3.45576 35.087L9.43999 46.3662C9.87891 47.181 10.4631 47.5946 11.174 47.5946C11.885 47.5946 12.4692 47.181 12.9081 46.3662L18.8923 35.087L19.0469 34.7138L19.0407 35.0124V49.3112C19.0407 49.8523 19.186 50.2846 19.4734 50.5986C19.764 50.9158 20.1751 51.0744 20.6944 51.0744C21.2137 51.0744 21.6001 50.9096 21.8999 50.5831C22.1966 50.2597 22.3481 49.8336 22.3481 49.3143V29.1722C22.3481 28.6311 22.1812 28.1801 21.8474 27.8349H21.8504Z", fill: "#F1F2F4" })),
+            React.createElement("p", { className: "T10" },
+                "Log into your MyDisney account.",
+                React.createElement("br", null),
+                " ",
+                "If you don't have one, you will be prompted to create one."),
+            React.createElement(ActionButton, { "data-focused": focused, onEnterPress: this.props.onEnterPress }, "Login")));
+    }
+}
+export default withFocusable()(LoginView);

package/dist/src/modules/espn/fantasy/view/LoginView/index.d.ts

@@ -0,0 +1,2 @@
+import LoginView from './LoginView';
+export default LoginView;

package/dist/src/modules/espn/fantasy/view/LoginView/index.js

@@ -0,0 +1,2 @@
+import LoginView from './LoginView';
+export default LoginView;