@times-components/ts-components 1.145.1-82bc6796129e892c1eb22c6257c5e3809c159767.3 → 1.145.1-cfea81c4084e6f91221ea00fec9fc730d5b933cb.4

package/dist/components/opta/football/opta-match-stats/matchday-live/styles/__tests__/NavigationWrapper.test.js

@@ -1,33 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import { NavigationWrapper } from '../NavigationWrapper';
-const HomeColour = { light: '#123456', dark: '#abcdef' };
-const AwayColour = { light: '#654321', dark: '#fedcba' };
-describe('Matchday Live NavigationWrapper', () => {
-    it('renders with active home', () => {
-        const { container } = render(React.createElement(NavigationWrapper, { isApp: false, activeTeam: "home", homeTeamColor: HomeColour, awayTeamColor: AwayColour },
-            React.createElement("div", { className: "navigation-buttons" },
-                React.createElement("button", { className: "active home" }, "Home"),
-                React.createElement("button", { className: "away" }, "Away")),
-            React.createElement("div", { className: "home-widget-container" }, "Home widget"),
-            React.createElement("div", { className: "away-widget-container" }, "Away widget")));
-        expect(container.querySelector('.navigation-buttons')).toBeInTheDocument();
-        expect(container.querySelector('.navigation-buttons .active.home')).toBeInTheDocument();
-        expect(container.querySelector('.home-widget-container')).toBeInTheDocument();
-        expect(container.querySelector('.away-widget-container')).toBeInTheDocument();
-    });
-    it('renders with active away and isApp true', () => {
-        const { container } = render(React.createElement(NavigationWrapper, { isApp: true, activeTeam: "away", homeTeamColor: HomeColour, awayTeamColor: AwayColour },
-            React.createElement("div", { className: "navigation-buttons" },
-                React.createElement("button", { className: "home" }, "Home"),
-                React.createElement("button", { className: "active away" }, "Away")),
-            React.createElement("div", { className: "home-widget-container" }, "Home widget"),
-            React.createElement("div", { className: "away-widget-container" }, "Away widget")));
-        expect(container.querySelector('.navigation-buttons')).toBeInTheDocument();
-        expect(container.querySelector('.navigation-buttons .active.away')).toBeInTheDocument();
-        expect(container.querySelector('.home-widget-container')).toBeInTheDocument();
-        expect(container.querySelector('.away-widget-container')).toBeInTheDocument();
-    });
-});
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTmF2aWdhdGlvbldyYXBwZXIudGVzdC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL29wdGEvZm9vdGJhbGwvb3B0YS1tYXRjaC1zdGF0cy9tYXRjaGRheS1saXZlL3N0eWxlcy9fX3Rlc3RzX18vTmF2aWdhdGlvbldyYXBwZXIudGVzdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUNoRCxPQUFPLDJCQUEyQixDQUFDO0FBQ25DLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBRXpELE1BQU0sVUFBVSxHQUFHLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLENBQUM7QUFDekQsTUFBTSxVQUFVLEdBQUcsRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUUsQ0FBQztBQUV6RCxRQUFRLENBQUMsaUNBQWlDLEVBQUUsR0FBRyxFQUFFO0lBQy9DLEVBQUUsQ0FBQywwQkFBMEIsRUFBRSxHQUFHLEVBQUU7UUFDbEMsTUFBTSxFQUFFLFNBQVMsRUFBRSxHQUFHLE1BQU0sQ0FDMUIsb0JBQUMsaUJBQWlCLElBQ2hCLEtBQUssRUFBRSxLQUFLLEVBQ1osVUFBVSxFQUFDLE1BQU0sRUFDakIsYUFBYSxFQUFFLFVBQVUsRUFDekIsYUFBYSxFQUFFLFVBQVU7WUFFekIsNkJBQUssU0FBUyxFQUFDLG9CQUFvQjtnQkFDakMsZ0NBQVEsU0FBUyxFQUFDLGFBQWEsV0FBYztnQkFDN0MsZ0NBQVEsU0FBUyxFQUFDLE1BQU0sV0FBYyxDQUNsQztZQUNOLDZCQUFLLFNBQVMsRUFBQyx1QkFBdUIsa0JBQWtCO1lBQ3hELDZCQUFLLFNBQVMsRUFBQyx1QkFBdUIsa0JBQWtCLENBQ3RDLENBQ3JCLENBQUM7UUFFRixNQUFNLENBQUMsU0FBUyxDQUFDLGFBQWEsQ0FBQyxxQkFBcUIsQ0FBQyxDQUFDLENBQUMsaUJBQWlCLEVBQUUsQ0FBQztRQUMzRSxNQUFNLENBQ0osU0FBUyxDQUFDLGFBQWEsQ0FBQyxrQ0FBa0MsQ0FBQyxDQUM1RCxDQUFDLGlCQUFpQixFQUFFLENBQUM7UUFDdEIsTUFBTSxDQUNKLFNBQVMsQ0FBQyxhQUFhLENBQUMsd0JBQXdCLENBQUMsQ0FDbEQsQ0FBQyxpQkFBaUIsRUFBRSxDQUFDO1FBQ3RCLE1BQU0sQ0FDSixTQUFTLENBQUMsYUFBYSxDQUFDLHdCQUF3QixDQUFDLENBQ2xELENBQUMsaUJBQWlCLEVBQUUsQ0FBQztJQUN4QixDQUFDLENBQUMsQ0FBQztJQUVILEVBQUUsQ0FBQyx5Q0FBeUMsRUFBRSxHQUFHLEVBQUU7UUFDakQsTUFBTSxFQUFFLFNBQVMsRUFBRSxHQUFHLE1BQU0sQ0FDMUIsb0JBQUMsaUJBQWlCLElBQ2hCLEtBQUssRUFBRSxJQUFJLEVBQ1gsVUFBVSxFQUFDLE1BQU0sRUFDakIsYUFBYSxFQUFFLFVBQVUsRUFDekIsYUFBYSxFQUFFLFVBQVU7WUFFekIsNkJBQUssU0FBUyxFQUFDLG9CQUFvQjtnQkFDakMsZ0NBQVEsU0FBUyxFQUFDLE1BQU0sV0FBYztnQkFDdEMsZ0NBQVEsU0FBUyxFQUFDLGFBQWEsV0FBYyxDQUN6QztZQUNOLDZCQUFLLFNBQVMsRUFBQyx1QkFBdUIsa0JBQWtCO1lBQ3hELDZCQUFLLFNBQVMsRUFBQyx1QkFBdUIsa0JBQWtCLENBQ3RDLENBQ3JCLENBQUM7UUFFRixNQUFNLENBQUMsU0FBUyxDQUFDLGFBQWEsQ0FBQyxxQkFBcUIsQ0FBQyxDQUFDLENBQUMsaUJBQWlCLEVBQUUsQ0FBQztRQUMzRSxNQUFNLENBQ0osU0FBUyxDQUFDLGFBQWEsQ0FBQyxrQ0FBa0MsQ0FBQyxDQUM1RCxDQUFDLGlCQUFpQixFQUFFLENBQUM7UUFDdEIsTUFBTSxDQUNKLFNBQVMsQ0FBQyxhQUFhLENBQUMsd0JBQXdCLENBQUMsQ0FDbEQsQ0FBQyxpQkFBaUIsRUFBRSxDQUFDO1FBQ3RCLE1BQU0sQ0FDSixTQUFTLENBQUMsYUFBYSxDQUFDLHdCQUF3QixDQUFDLENBQ2xELENBQUMsaUJBQWlCLEVBQUUsQ0FBQztJQUN4QixDQUFDLENBQUMsQ0FBQztBQUNMLENBQUMsQ0FBQyxDQUFDIn0=

package/dist/components/opta/football/opta-match-stats/matchday-live/styles/__tests__/WidgetContainer.test.js

@@ -1,36 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import { WidgetContainer } from '../WidgetContainer';
-describe('Matchday Live WidgetContainer', () => {
-    const baseProps = {
-        isApp: true,
-        homeTeamColor: { light: '#000000', dark: '#a19c9cff' },
-        awayTeamColor: { light: '#007A3F', dark: '#007A3F' }
-    };
-    it('generates styles', () => {
-        const { container } = render(React.createElement(WidgetContainer, Object.assign({}, baseProps),
-            React.createElement("div", { className: "Opta" },
-                React.createElement("div", { className: "Opta_W" }, "content"))));
-        expect(container.querySelector('.Opta > .Opta_W')).toBeTruthy();
-    });
-    it('generates dark-mode styles under .Opta-Overlay .Opta-Flex', () => {
-        const { container } = render(React.createElement(WidgetContainer, Object.assign({}, baseProps),
-            React.createElement("div", { className: "Opta-Overlay" },
-                React.createElement("div", { className: "Opta-Flex" }, "flex"))));
-        expect(container.querySelector('.Opta-Overlay .Opta-Flex')).toBeTruthy();
-    });
-    it('applies home-widget-container styles', () => {
-        const { container } = render(React.createElement(WidgetContainer, Object.assign({}, baseProps, { className: "home-widget-container" }),
-            React.createElement("div", { className: "Opta-MatchHeader" },
-                React.createElement("div", { className: "Opta-Away" }, "Away Team"))));
-        expect(container.querySelector('.home-widget-container .Opta-MatchHeader .Opta-Away')).toBeTruthy();
-    });
-    it('applies away-widget-container styles', () => {
-        const { container } = render(React.createElement(WidgetContainer, Object.assign({}, baseProps, { className: "away-widget-container" }),
-            React.createElement("div", { className: "Opta-MatchHeader" },
-                React.createElement("div", { className: "Opta-Home" }, "Home Team"))));
-        expect(container.querySelector('.away-widget-container .Opta-MatchHeader .Opta-Home')).toBeTruthy();
-    });
-});
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiV2lkZ2V0Q29udGFpbmVyLnRlc3QuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9vcHRhL2Zvb3RiYWxsL29wdGEtbWF0Y2gtc3RhdHMvbWF0Y2hkYXktbGl2ZS9zdHlsZXMvX190ZXN0c19fL1dpZGdldENvbnRhaW5lci50ZXN0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ2hELE9BQU8sMkJBQTJCLENBQUM7QUFDbkMsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLG9CQUFvQixDQUFDO0FBRXJELFFBQVEsQ0FBQywrQkFBK0IsRUFBRSxHQUFHLEVBQUU7SUFDN0MsTUFBTSxTQUFTLEdBQUc7UUFDaEIsS0FBSyxFQUFFLElBQUk7UUFDWCxhQUFhLEVBQUUsRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLElBQUksRUFBRSxXQUFXLEVBQUU7UUFDdEQsYUFBYSxFQUFFLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFO0tBQ3JELENBQUM7SUFFRixFQUFFLENBQUMsa0JBQWtCLEVBQUUsR0FBRyxFQUFFO1FBQzFCLE1BQU0sRUFBRSxTQUFTLEVBQUUsR0FBRyxNQUFNLENBQzFCLG9CQUFDLGVBQWUsb0JBQUssU0FBUztZQUM1Qiw2QkFBSyxTQUFTLEVBQUMsTUFBTTtnQkFDbkIsNkJBQUssU0FBUyxFQUFDLFFBQVEsY0FBYyxDQUNqQyxDQUNVLENBQ25CLENBQUM7UUFDRixNQUFNLENBQUMsU0FBUyxDQUFDLGFBQWEsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDLENBQUMsVUFBVSxFQUFFLENBQUM7SUFDbEUsQ0FBQyxDQUFDLENBQUM7SUFFSCxFQUFFLENBQUMsMkRBQTJELEVBQUUsR0FBRyxFQUFFO1FBQ25FLE1BQU0sRUFBRSxTQUFTLEVBQUUsR0FBRyxNQUFNLENBQzFCLG9CQUFDLGVBQWUsb0JBQUssU0FBUztZQUM1Qiw2QkFBSyxTQUFTLEVBQUMsY0FBYztnQkFDM0IsNkJBQUssU0FBUyxFQUFDLFdBQVcsV0FBVyxDQUNqQyxDQUNVLENBQ25CLENBQUM7UUFDRixNQUFNLENBQUMsU0FBUyxDQUFDLGFBQWEsQ0FBQywwQkFBMEIsQ0FBQyxDQUFDLENBQUMsVUFBVSxFQUFFLENBQUM7SUFDM0UsQ0FBQyxDQUFDLENBQUM7SUFFSCxFQUFFLENBQUMsc0NBQXNDLEVBQUUsR0FBRyxFQUFFO1FBQzlDLE1BQU0sRUFBRSxTQUFTLEVBQUUsR0FBRyxNQUFNLENBQzFCLG9CQUFDLGVBQWUsb0JBQUssU0FBUyxJQUFFLFNBQVMsRUFBQyx1QkFBdUI7WUFDL0QsNkJBQUssU0FBUyxFQUFDLGtCQUFrQjtnQkFDL0IsNkJBQUssU0FBUyxFQUFDLFdBQVcsZ0JBQWdCLENBQ3RDLENBQ1UsQ0FDbkIsQ0FBQztRQUNGLE1BQU0sQ0FDSixTQUFTLENBQUMsYUFBYSxDQUNyQixxREFBcUQsQ0FDdEQsQ0FDRixDQUFDLFVBQVUsRUFBRSxDQUFDO0lBQ2pCLENBQUMsQ0FBQyxDQUFDO0lBRUgsRUFBRSxDQUFDLHNDQUFzQyxFQUFFLEdBQUcsRUFBRTtRQUM5QyxNQUFNLEVBQUUsU0FBUyxFQUFFLEdBQUcsTUFBTSxDQUMxQixvQkFBQyxlQUFlLG9CQUFLLFNBQVMsSUFBRSxTQUFTLEVBQUMsdUJBQXVCO1lBQy9ELDZCQUFLLFNBQVMsRUFBQyxrQkFBa0I7Z0JBQy9CLDZCQUFLLFNBQVMsRUFBQyxXQUFXLGdCQUFnQixDQUN0QyxDQUNVLENBQ25CLENBQUM7UUFDRixNQUFNLENBQ0osU0FBUyxDQUFDLGFBQWEsQ0FDckIscURBQXFELENBQ3RELENBQ0YsQ0FBQyxVQUFVLEVBQUUsQ0FBQztJQUNqQixDQUFDLENBQUMsQ0FBQztBQUNMLENBQUMsQ0FBQyxDQUFDIn0=

package/src/components/opta/football/opta-match-stats/matchday-live/DesktopWidget.tsx

@@ -1,108 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { Placeholder } from '@times-components/image';
-import {
-  initSettings,
-  initStyleSheet,
-  initScript,
-  initElement,
-  initComponent
-} from '../../../utils/config';
-import { PlaceholderContainer } from '../../../shared/shared-styles';
-import { WidgetContainer } from './styles/WidgetContainer';
-import { WidgetWrapper } from '../shared/styles';
-import { TeamColor } from '../shared/types';
-
-export const DesktopWidget: React.FC<{
-  season: string;
-  competition: string;
-  match: string;
-  isApp?: boolean;
-  homeTeamColor?: TeamColor;
-  awayTeamColor?: TeamColor;
-}> = React.memo(
-  ({
-    season,
-    competition,
-    match,
-    isApp = false,
-    homeTeamColor = { light: '#000000', dark: '#a19c9cff' },
-    awayTeamColor = { light: '#007A3F', dark: '#007A3F' }
-  }) => {
-    const ref = React.createRef<HTMLDivElement>();
-    const [isReady, setIsReady] = useState<boolean>(false);
-
-    useEffect(() => {
-      const sport = 'football';
-
-      initSettings();
-      initStyleSheet(sport);
-      initScript()
-        .then(() => {
-          if (ref.current) {
-            ref.current.innerHTML = initElement('opta-widget', {
-              sport,
-              widget: 'matchday_live',
-              season,
-              competition,
-              match,
-              template: 'normal',
-              live: true,
-              orientation: 'horizontal',
-              side: 'both',
-              show_match_header: true,
-              show_crests: true,
-              show_pitch_crests: false,
-              show_team_formation: true,
-              show_score: false,
-              show_halftime_score: false,
-              show_competition_name: false,
-              show_date: false,
-              date_format: 'dddd D MMMM YYYY',
-              narrow_date_format: 'DD/MM/YY',
-              show_referee: true,
-              show_venue: true,
-              show_attendance: true,
-              show_images: false,
-              show_pitch_images: false,
-              show_team_sheets: false,
-              show_event_icons: true,
-              show_player_names: true,
-              show_player_stats: true,
-              show_subs: 'all',
-              competition_naming: 'brief',
-              team_naming: 'full',
-              player_naming: 'last_name',
-              show_live: false,
-              show_logo: false,
-              show_title: false,
-              breakpoints: '400, 700'
-            }).outerHTML;
-
-            initComponent();
-          }
-        })
-        .then(() => {
-          setIsReady(true);
-        });
-    }, []);
-
-    return (
-      <>
-        <WidgetWrapper isApp={isApp} className="matchday-live-widget-desktop">
-          <h3>Line-ups</h3>
-          <WidgetContainer
-            ref={ref}
-            isApp={isApp}
-            homeTeamColor={homeTeamColor}
-            awayTeamColor={awayTeamColor}
-          />
-        </WidgetWrapper>
-        {!isReady && (
-          <PlaceholderContainer data-testid="placeholder">
-            <Placeholder />
-          </PlaceholderContainer>
-        )}
-      </>
-    );
-  }
-);

package/src/components/opta/football/opta-match-stats/matchday-live/MobileWidget.tsx

@@ -1,158 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { Placeholder } from '@times-components/image';
-import {
-  initSettings,
-  initStyleSheet,
-  initScript,
-  initElement,
-  initComponent
-} from '../../../utils/config';
-import { PlaceholderContainer } from '../../../shared/shared-styles';
-import { TeamColor } from '../shared/types';
-import { NavigationWrapper } from './styles/NavigationWrapper';
-import { WidgetContainer } from './styles/WidgetContainer';
-
-const widgetOptions = {
-  widget: 'matchday_live',
-  template: 'normal',
-  live: true,
-  orientation: 'vertical',
-  show_match_header: true,
-  show_crests: false,
-  show_pitch_crests: false,
-  show_team_formation: true,
-  show_score: false,
-  show_halftime_score: false,
-  show_competition_name: false,
-  show_date: false,
-  date_format: 'dddd D MMMM YYYY',
-  narrow_date_format: 'DD/MM/YY',
-  show_referee: true,
-  show_venue: false,
-  show_attendance: false,
-  show_images: false,
-  show_pitch_images: false,
-  show_team_sheets: false,
-  show_event_icons: true,
-  show_player_names: true,
-  show_player_stats: true,
-  show_subs: 'all',
-  competition_naming: 'brief',
-  team_naming: 'full',
-  player_naming: 'last_name',
-  show_live: false,
-  show_logo: false,
-  show_title: false
-};
-
-export const MobileWidget: React.FC<{
-  season: string;
-  competition: string;
-  match: string;
-  isApp?: boolean;
-  homeTeamColor?: TeamColor;
-  awayTeamColor?: TeamColor;
-  homeTeamName: string;
-  awayTeamName: string;
-}> = React.memo(
-  ({
-    season,
-    competition,
-    match,
-    isApp = false,
-    homeTeamColor = { light: '#000000', dark: '#a19c9cff' },
-    awayTeamColor = { light: '#007A3F', dark: '#007A3F' },
-    homeTeamName,
-    awayTeamName
-  }) => {
-    const homeRef = React.createRef<HTMLDivElement>();
-    const awayRef = React.createRef<HTMLDivElement>();
-    const [isReady, setIsReady] = useState(false);
-    const [activeTeam, setActiveTeam] = useState<'home' | 'away'>('home');
-
-    useEffect(() => {
-      const sport = 'football';
-
-      initSettings();
-      initStyleSheet(sport);
-      initScript()
-        .then(() => {
-          if (homeRef.current) {
-            homeRef.current.innerHTML = initElement('opta-widget', {
-              ...widgetOptions,
-              sport,
-              season,
-              competition,
-              match,
-              side: 'home'
-            }).outerHTML;
-            initComponent();
-          }
-        })
-        .then(() => {
-          if (awayRef.current) {
-            awayRef.current.innerHTML = initElement('opta-widget', {
-              ...widgetOptions,
-              sport,
-              season,
-              competition,
-              match,
-              side: 'away'
-            }).outerHTML;
-            initComponent();
-          }
-        })
-        .finally(() => {
-          setIsReady(true);
-        });
-    }, []);
-
-    return (
-      <>
-        <div className="matchday-live-widget-mobile">
-          <NavigationWrapper
-            data-testid="mobile-navigation-wrapper"
-            activeTeam={activeTeam}
-            homeTeamColor={homeTeamColor}
-            awayTeamColor={awayTeamColor}
-            isApp={isApp}
-          >
-            <div className="navigation-buttons">
-              <button
-                className={activeTeam === 'home' ? 'active home' : 'home'}
-                onClick={() => setActiveTeam('home')}
-              >
-                {homeTeamName}
-              </button>
-              <button
-                className={activeTeam === 'away' ? 'active away' : 'away'}
-                onClick={() => setActiveTeam('away')}
-              >
-                {awayTeamName}
-              </button>
-            </div>
-            <WidgetContainer
-              className="home-widget-container"
-              ref={homeRef}
-              isApp={isApp}
-              homeTeamColor={homeTeamColor}
-              awayTeamColor={awayTeamColor}
-            />
-            <WidgetContainer
-              className="away-widget-container"
-              ref={awayRef}
-              isApp={isApp}
-              homeTeamColor={homeTeamColor}
-              awayTeamColor={awayTeamColor}
-            />
-            {!isReady && (
-              <PlaceholderContainer data-testid="placeholder">
-                <Placeholder />
-              </PlaceholderContainer>
-            )}
-          </NavigationWrapper>
-        </div>
-      </>
-    );
-  }
-);

package/src/components/opta/football/opta-match-stats/matchday-live/OptaMatchStatsMatchdayLive.stories.tsx

@@ -1,38 +0,0 @@
-import React from 'react';
-import { showcaseConverter } from '@times-components/storybook';
-
-import { ArticleHarness } from '../../../../../fixtures/article-harness/ArticleHarness';
-import { OptaMatchStatsMatchdayLive } from './OptaMatchStatsMatchdayLive';
-
-const showcase = {
-  children: [
-    {
-      decorator: (storyFn: () => React.ReactNode) => (
-        <ArticleHarness>{storyFn()}</ArticleHarness>
-      ),
-      type: 'decorator'
-    },
-    {
-      component: () => {
-        return (
-          <>
-            <OptaMatchStatsMatchdayLive
-              season="2025"
-              competition="8"
-              match="2562026"
-              homeTeamName="Arsenal"
-              awayTeamName="Brentford"
-            />
-          </>
-        );
-      },
-      name: 'Summary',
-      type: 'story'
-    }
-  ],
-  name:
-    'Typescript Component/Opta Match Stats/Football/Match Stats Matchday Live'
-};
-
-// @ts-ignore
-showcaseConverter(module, showcase);

package/src/components/opta/football/opta-match-stats/matchday-live/OptaMatchStatsMatchdayLive.tsx

@@ -1,23 +0,0 @@
-import React from 'react';
-import { TeamColor } from '../shared/types';
-import { DesktopWidget } from './DesktopWidget';
-import { MobileWidget } from './MobileWidget';
-import { MatchdayLiveController } from './styles/MatchdayLiveController';
-
-export const OptaMatchStatsMatchdayLive: React.FC<{
-  season: string;
-  competition: string;
-  match: string;
-  isApp?: boolean;
-  homeTeamColor?: TeamColor;
-  awayTeamColor?: TeamColor;
-  homeTeamName: string;
-  awayTeamName: string;
-}> = React.memo(props => {
-  return (
-    <MatchdayLiveController>
-      <DesktopWidget {...props} />
-      <MobileWidget {...props} />
-    </MatchdayLiveController>
-  );
-});

package/src/components/opta/football/opta-match-stats/matchday-live/__tests__/MobileWidget.test.tsx

@@ -1,69 +0,0 @@
-import React from 'react';
-import { render, screen, fireEvent, act } from '@testing-library/react';
-import '@testing-library/jest-dom';
-
-jest.mock('@times-components/image', () => ({
-  Placeholder: () => <>Placeholder</>
-}));
-
-const mockInitSettings = jest.fn();
-const mockInitStyleSheet = jest.fn();
-const mockInitComponent = jest.fn();
-
-const mockInitElement = () => {
-  const element = document.createElement('div');
-  element.appendChild(document.createTextNode('Widget'));
-  return element;
-};
-
-jest.mock('../../../../utils/config', () => ({
-  initSettings: mockInitSettings,
-  initStyleSheet: mockInitStyleSheet,
-  initScript: () => Promise.resolve({}),
-  initElement: mockInitElement,
-  initComponent: mockInitComponent
-}));
-
-import { MobileWidget } from '../MobileWidget';
-
-const requiredProps = {
-  season: '2020',
-  competition: '3',
-  match: '2041900',
-  homeTeamName: 'Liverpool',
-  awayTeamName: 'Manchester City'
-};
-
-describe('MobileWidget navigation buttons state', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it('renders with home active and toggles to away on click', async () => {
-    render(<MobileWidget {...requiredProps} />);
-
-    const homeBtn = screen.getByRole('button', { name: 'Liverpool' });
-    const awayBtn = screen.getByRole('button', { name: 'Manchester City' });
-    expect(homeBtn).toHaveClass('home');
-    expect(homeBtn).toHaveClass('active');
-    expect(awayBtn).toHaveClass('away');
-    expect(awayBtn).not.toHaveClass('active');
-
-    fireEvent.click(awayBtn);
-    expect(awayBtn).toHaveClass('active');
-    expect(homeBtn).not.toHaveClass('active');
-
-    expect(homeBtn).toHaveClass('home');
-
-    await act(async () => {
-      await Promise.resolve();
-    });
-    // Placeholder may still be present during async; assert wrapper exists
-    expect(screen.getByTestId('mobile-navigation-wrapper')).toBeInTheDocument();
-
-    fireEvent.click(homeBtn);
-    expect(homeBtn).toHaveClass('active');
-    expect(awayBtn).not.toHaveClass('active');
-    expect(awayBtn).toHaveClass('away');
-  });
-});

package/src/components/opta/football/opta-match-stats/matchday-live/__tests__/OptaMatchStatsMatchdayLive.test.tsx

@@ -1,61 +0,0 @@
-import React from 'react';
-import { render, act } from '@testing-library/react';
-
-import 'regenerator-runtime';
-import '@testing-library/jest-dom';
-
-jest.mock('@times-components/image', () => ({
-  Placeholder: () => <>Placeholder</>
-}));
-
-const mockInitSettings = jest.fn();
-const mockInitStyleSheet = jest.fn();
-const mockInitComponent = jest.fn();
-const mockHasMatchEvents = jest.fn();
-
-const mockInitElement = () => {
-  const element = document.createElement('div');
-  element.appendChild(document.createTextNode('Widget'));
-  return element;
-};
-
-jest.mock('../../../../utils/config', () => ({
-  initSettings: mockInitSettings,
-  initStyleSheet: mockInitStyleSheet,
-  initScript: () => new Promise(resolve => resolve({})),
-  initElement: mockInitElement,
-  initComponent: mockInitComponent
-}));
-
-import { OptaMatchStatsMatchdayLive } from '../OptaMatchStatsMatchdayLive';
-
-const requiredProps = {
-  season: '2020',
-  competition: '3',
-  match: '2041900',
-  homeTeamName: 'Liverpool',
-  awayTeamName: 'Manchester City'
-};
-
-describe('OptaMatchStatsMatchdayLive', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it('should render correctly', async () => {
-    const { asFragment } = render(
-      <OptaMatchStatsMatchdayLive {...requiredProps} />
-    );
-
-    act(() => {
-      mockInitComponent();
-      mockHasMatchEvents();
-    });
-
-    expect(mockInitSettings).toHaveBeenCalledTimes(2);
-    expect(mockInitStyleSheet).toHaveBeenCalledTimes(2);
-    expect(mockInitComponent).toHaveBeenCalledTimes(1);
-
-    expect(asFragment()).toMatchSnapshot();
-  });
-});

package/src/components/opta/football/opta-match-stats/matchday-live/__tests__/__snapshots__/OptaMatchStatsMatchdayLive.test.tsx.snap

@@ -1,61 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`OptaMatchStatsMatchdayLive should render correctly 1`] = `
-<DocumentFragment>
-  <div
-    class="sc-bZQynM inSDsQ"
-  >
-    <div
-      class="matchday-live-widget-desktop sc-bxivhb iQCzHr"
-    >
-      <h3>
-        Line-ups
-      </h3>
-      <div
-        class="sc-ifAKCX hfZGOd"
-      />
-    </div>
-    <div
-      class="sc-bwzfXH eSqyJ"
-      data-testid="placeholder"
-    >
-      Placeholder
-    </div>
-    <div
-      class="matchday-live-widget-mobile"
-    >
-      <div
-        class="sc-EHOje fBqPPh"
-        data-testid="mobile-navigation-wrapper"
-      >
-        <div
-          class="navigation-buttons"
-        >
-          <button
-            class="active home"
-          >
-            Liverpool
-          </button>
-          <button
-            class="away"
-          >
-            Manchester City
-          </button>
-        </div>
-        <div
-          class="home-widget-container sc-ifAKCX hfZGOd"
-        />
-        <div
-          class="away-widget-container sc-ifAKCX hfZGOd"
-        />
-        <div
-          class="sc-bwzfXH eSqyJ"
-          data-testid="placeholder"
-        >
-          Placeholder
-        </div>
-      </div>
-    </div>
-  </div>
-</DocumentFragment>
-`;

package/src/components/opta/football/opta-match-stats/matchday-live/styles/MatchdayLiveController.tsx

@@ -1,19 +0,0 @@
-import styled from 'styled-components';
-import { breakpoints } from '@times-components/ts-styleguide';
-
-export const MatchdayLiveController = styled.div`
-  .matchday-live-widget-mobile {
-    display: block;
-  }
-  .matchday-live-widget-desktop {
-    display: none;
-  }
-  @media (min-width: ${breakpoints.medium}px) {
-    .matchday-live-widget-mobile {
-      display: none;
-    }
-    .matchday-live-widget-desktop {
-      display: block;
-    }
-  }
-`;