@times-components/ts-components 1.25.1 → 1.26.2

package/dist/components/opta/rugby/fixtures/styles.js

@@ -0,0 +1,255 @@
+import styled from 'styled-components';
+import { breakpoints, colours, fonts } from '@times-components/styleguide';
+import { WidgetContainerBase } from '../shared-styles';
+export const WidgetContainerOverride = styled(WidgetContainerBase) `
+  .Opta {
+    h2 {
+      margin: 20px 0 0 0 !important;
+    }
+
+    .Opta-js-main {
+      table {
+        tbody {
+          td.Opta-title {
+            background-color: transparent !important;
+            border-bottom: 1px solid #e4e4e4;
+
+            h3 {
+              margin: 20px 0 0 0 !important;
+              font-family: ${fonts.headline} !important;
+              font-size: 16px !important;
+              line-height: 30px !important;
+              text-align: center;
+
+              span {
+                font-size: inherit;
+              }
+
+              @media (min-width: ${breakpoints.medium}px) {
+                font-size: 18px !important;
+                line-height: 40px !important;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+export const WidgetContainer = styled(WidgetContainerBase) `
+  .Opta {
+    .Opta-js-main {
+      padding: 0;
+      background-color: transparent;
+
+      table {
+        tbody {
+          td.Opta-title {
+            height: 40px;
+            background-color: ${colours.functional.backgroundSecondary};
+
+            h3 {
+              height: auto;
+              margin: 0 0 0 10px;
+              color: ${colours.functional.brandColour};
+              font-family: ${fonts.supporting};
+              font-size: 14px;
+              line-height: 14px;
+              font-weight: normal;
+              background-color: transparent;
+              border-bottom: 0;
+
+              span {
+                float: none;
+                padding: 0;
+              }
+
+              @media (min-width: ${breakpoints.medium}px) {
+                margin: 0 0 0 20px;
+              }
+            }
+          }
+
+          tr.Opta-Scoreline {
+            height: 40px;
+            background-color: transparent !important;
+            border-bottom: 1px solid #e4e4e4;
+
+            @media (min-width: ${breakpoints.medium}px) {
+              height: 50px;
+            }
+
+            td {
+              max-width: none !important;
+              padding: 3px 0 0 0;
+              color: ${colours.functional.brandColour} !important;
+              font-family: ${fonts.headline};
+              font-size: 14px;
+              line-height: 14px;
+              background-color: transparent;
+
+              &.Opta-Time {
+                width: 50px !important;
+                padding: 6px 0 0 10px;
+                color: ${colours.section.sport} !important;
+                font-family: ${fonts.supporting};
+
+                abbr {
+                  font-size: inherit;
+                  line-height: inherit;
+                  text-decoration: none;
+                }
+
+                @media (min-width: ${breakpoints.medium}px) {
+                  width: 60px !important;
+                  padding: 6px 0 0 20px;
+                  font-size: 14px;
+                  line-height: 14px;
+                }
+              }
+
+              &.Opta-Team {
+                width: 30% !important;
+                padding-left: 10px;
+
+                &.Opta-Home {
+                  padding-right: 10px;
+                  padding-left: 0;
+                  text-align: right;
+                }
+
+                @media (min-width: ${breakpoints.medium}px) {
+                  padding-left: 15px;
+
+                  &.Opta-Home {
+                    padding-right: 15px;
+                    padding-left: 0;
+                  }
+                }
+              }
+
+              &.Opta-Score {
+                width: 25px !important;
+                font-size: 16px;
+                line-height: 16px;
+                text-align: left !important;
+
+                &.Opta-Home {
+                  text-align: right !important;
+                }
+
+                span {
+                  font-size: inherit;
+                  line-height: inherit;
+                }
+
+                @media (min-width: ${breakpoints.medium}px) {
+                  width: 30px !important;
+                  font-size: 24px;
+                  line-height: 24px;
+                }
+              }
+
+              &.Opta-Crest {
+                width: 20px !important;
+                margin-top: -3px;
+
+                img {
+                  width: 20px;
+                }
+              }
+
+              &.Opta-Divider {
+                width: 20px !important;
+                text-align: center;
+
+                abbr {
+                  font-size: inherit;
+                  line-height: inherit;
+                  text-decoration: none;
+                }
+              }
+
+              &.Opta-Outer:not(.Opta-Time) {
+                width: 50px !important;
+                padding: 0 10px 0 0;
+
+                @media (min-width: ${breakpoints.medium}px) {
+                  width: 60px !important;
+                  padding: 0 20px 0 0;
+                }
+              }
+
+              @media (min-width: ${breakpoints.medium}px) {
+                font-size: 16px;
+                line-height: 16px;
+              }
+            }
+          }
+
+          tr.Opta-agg {
+            background-color: transparent !important;
+
+            td {
+              padding: 10px;
+              color: ${colours.functional.primary};
+              font-family: ${fonts.supporting};
+              font-size: 14px;
+              line-height: 16px;
+              background-color: transparent;
+
+              span {
+                font-size: inherit;
+                line-height: inherit;
+              }
+
+              span.Opta-agg-text {
+                text-transform: uppercase;
+              }
+            }
+          }
+
+          tr {
+            td.Opta-Nest {
+              padding: 0;
+
+              .Opta_W {
+                > .Opta-Cf {
+                  background-color: transparent;
+                  border-bottom: 1px solid #e4e4e4;
+
+                  .Opta-Events {
+                    padding: 10px 0 2px 0;
+
+                    li {
+                      padding: 0 0 8px 0;
+
+                      .Opta-Event-Text {
+                        color: ${colours.functional.primary};
+                        font-family: ${fonts.supporting};
+                        font-size: 14px;
+                        line-height: 16px;
+
+                        .Opta-Event-Player,
+                        .Opta-Event-Time,
+                        .Opta-Event-Text-Type {
+                          font-size: inherit;
+                          line-height: inherit;
+                        }
+
+                        .Opta-Event-Time {
+                          color: ${colours.section.sport};
+                        }
+                      }
+                    }
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvb3B0YS9ydWdieS9maXh0dXJlcy9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxNQUFNLE1BQU0sbUJBQW1CLENBQUM7QUFDdkMsT0FBTyxFQUFFLFdBQVcsRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFFM0UsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFFdkQsTUFBTSxDQUFDLE1BQU0sdUJBQXVCLEdBQUcsTUFBTSxDQUFDLG1CQUFtQixDQUFDLENBQUE7Ozs7Ozs7Ozs7Ozs7Ozs2QkFlckMsS0FBSyxDQUFDLFFBQVE7Ozs7Ozs7OzttQ0FTUixXQUFXLENBQUMsTUFBTTs7Ozs7Ozs7OztDQVVwRCxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sZUFBZSxHQUFHLE1BQU0sQ0FBQyxtQkFBbUIsQ0FBQyxDQUFBOzs7Ozs7Ozs7O2dDQVUxQixPQUFPLENBQUMsVUFBVSxDQUFDLG1CQUFtQjs7Ozs7dUJBSy9DLE9BQU8sQ0FBQyxVQUFVLENBQUMsV0FBVzs2QkFDeEIsS0FBSyxDQUFDLFVBQVU7Ozs7Ozs7Ozs7OzttQ0FZVixXQUFXLENBQUMsTUFBTTs7Ozs7Ozs7Ozs7aUNBV3BCLFdBQVcsQ0FBQyxNQUFNOzs7Ozs7O3VCQU81QixPQUFPLENBQUMsVUFBVSxDQUFDLFdBQVc7NkJBQ3hCLEtBQUssQ0FBQyxRQUFROzs7Ozs7Ozt5QkFRbEIsT0FBTyxDQUFDLE9BQU8sQ0FBQyxLQUFLOytCQUNmLEtBQUssQ0FBQyxVQUFVOzs7Ozs7OztxQ0FRVixXQUFXLENBQUMsTUFBTTs7Ozs7Ozs7Ozs7Ozs7Ozs7O3FDQWtCbEIsV0FBVyxDQUFDLE1BQU07Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7cUNBeUJsQixXQUFXLENBQUMsTUFBTTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztxQ0ErQmxCLFdBQVcsQ0FBQyxNQUFNOzs7Ozs7bUNBTXBCLFdBQVcsQ0FBQyxNQUFNOzs7Ozs7Ozs7Ozs7dUJBWTlCLE9BQU8sQ0FBQyxVQUFVLENBQUMsT0FBTzs2QkFDcEIsS0FBSyxDQUFDLFVBQVU7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O2lDQWdDWixPQUFPLENBQUMsVUFBVSxDQUFDLE9BQU87dUNBQ3BCLEtBQUssQ0FBQyxVQUFVOzs7Ozs7Ozs7Ozs7bUNBWXBCLE9BQU8sQ0FBQyxPQUFPLENBQUMsS0FBSzs7Ozs7Ozs7Ozs7OztDQWF2RCxDQUFDIn0=

package/dist/components/opta/rugby/match-stats/OptaRugbyMatchStats.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export declare const OptaRugbyMatchStats: React.FC<{
+    season: string;
+    competition: string;
+    match: string;
+    full_width?: boolean;
+}>;

package/dist/components/opta/rugby/match-stats/OptaRugbyMatchStats.js

@@ -0,0 +1,43 @@
+import React, { useState, useEffect } from 'react';
+import { Placeholder } from '@times-components/image';
+import { initSettings, initStyleSheet, initScript, initElement, initComponent } from '../../utils/config';
+import { Container, PlaceholderContainer } from '../shared-styles';
+import { WidgetContainer } from './styles';
+export const OptaRugbyMatchStats = React.memo(({ season, competition, match, full_width }) => {
+    const ref = React.createRef();
+    const [isReady, setIsReady] = useState(false);
+    useEffect(() => {
+        const sport = 'rugby';
+        initSettings();
+        initStyleSheet(sport);
+        initScript().then(() => {
+            if (ref.current) {
+                ref.current.innerHTML = initElement('opta-widget', {
+                    sport,
+                    widget: 'matchstats',
+                    season,
+                    competition,
+                    match,
+                    template: 'custom',
+                    graph_style: 'relative',
+                    stats_categories: 'Category 1|tries,passes,tackles,carries,metres,lineouts_won_percent,scrums_won_percent,turnovers_conceded,yellow_cards,red_cards',
+                    live: true,
+                    show_match_header: true,
+                    show_halftime_score: true,
+                    show_competition_name: true,
+                    show_date: true,
+                    show_crests: true,
+                    date_format: 'DD/MM/YYYY',
+                    breakpoints: '520'
+                }).outerHTML;
+                initComponent();
+                setIsReady(true);
+            }
+        });
+    }, []);
+    return (React.createElement(Container, { border: isReady, fullWidth: full_width },
+        React.createElement(WidgetContainer, { ref: ref }),
+        !isReady && (React.createElement(PlaceholderContainer, null,
+            React.createElement(Placeholder, null)))));
+});
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3B0YVJ1Z2J5TWF0Y2hTdGF0cy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL29wdGEvcnVnYnkvbWF0Y2gtc3RhdHMvT3B0YVJ1Z2J5TWF0Y2hTdGF0cy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEVBQUUsRUFBRSxRQUFRLEVBQUUsU0FBUyxFQUFFLE1BQU0sT0FBTyxDQUFDO0FBRW5ELE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQztBQUV0RCxPQUFPLEVBQ0wsWUFBWSxFQUNaLGNBQWMsRUFDZCxVQUFVLEVBQ1YsV0FBVyxFQUNYLGFBQWEsRUFDZCxNQUFNLG9CQUFvQixDQUFDO0FBRTVCLE9BQU8sRUFBRSxTQUFTLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQztBQUNuRSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sVUFBVSxDQUFDO0FBRTNDLE1BQU0sQ0FBQyxNQUFNLG1CQUFtQixHQUszQixLQUFLLENBQUMsSUFBSSxDQUFDLENBQUMsRUFBRSxNQUFNLEVBQUUsV0FBVyxFQUFFLEtBQUssRUFBRSxVQUFVLEVBQUUsRUFBRSxFQUFFO0lBQzdELE1BQU0sR0FBRyxHQUFHLEtBQUssQ0FBQyxTQUFTLEVBQWtCLENBQUM7SUFFOUMsTUFBTSxDQUFDLE9BQU8sRUFBRSxVQUFVLENBQUMsR0FBRyxRQUFRLENBQVUsS0FBSyxDQUFDLENBQUM7SUFFdkQsU0FBUyxDQUFDLEdBQUcsRUFBRTtRQUNiLE1BQU0sS0FBSyxHQUFHLE9BQU8sQ0FBQztRQUV0QixZQUFZLEVBQUUsQ0FBQztRQUNmLGNBQWMsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUV0QixVQUFVLEVBQUUsQ0FBQyxJQUFJLENBQUMsR0FBRyxFQUFFO1lBQ3JCLElBQUksR0FBRyxDQUFDLE9BQU8sRUFBRTtnQkFDZixHQUFHLENBQUMsT0FBTyxDQUFDLFNBQVMsR0FBRyxXQUFXLENBQUMsYUFBYSxFQUFFO29CQUNqRCxLQUFLO29CQUNMLE1BQU0sRUFBRSxZQUFZO29CQUNwQixNQUFNO29CQUNOLFdBQVc7b0JBQ1gsS0FBSztvQkFDTCxRQUFRLEVBQUUsUUFBUTtvQkFDbEIsV0FBVyxFQUFFLFVBQVU7b0JBQ3ZCLGdCQUFnQixFQUNkLGtJQUFrSTtvQkFDcEksSUFBSSxFQUFFLElBQUk7b0JBQ1YsaUJBQWlCLEVBQUUsSUFBSTtvQkFDdkIsbUJBQW1CLEVBQUUsSUFBSTtvQkFDekIscUJBQXFCLEVBQUUsSUFBSTtvQkFDM0IsU0FBUyxFQUFFLElBQUk7b0JBQ2YsV0FBVyxFQUFFLElBQUk7b0JBQ2pCLFdBQVcsRUFBRSxZQUFZO29CQUN6QixXQUFXLEVBQUUsS0FBSztpQkFDbkIsQ0FBQyxDQUFDLFNBQVMsQ0FBQztnQkFFYixhQUFhLEVBQUUsQ0FBQztnQkFDaEIsVUFBVSxDQUFDLElBQUksQ0FBQyxDQUFDO2FBQ2xCO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUM7SUFFUCxPQUFPLENBQ0wsb0JBQUMsU0FBUyxJQUFDLE1BQU0sRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVU7UUFDL0Msb0JBQUMsZUFBZSxJQUFDLEdBQUcsRUFBRSxHQUFHLEdBQUk7UUFFNUIsQ0FBQyxPQUFPLElBQUksQ0FDWCxvQkFBQyxvQkFBb0I7WUFDbkIsb0JBQUMsV0FBVyxPQUFHLENBQ00sQ0FDeEIsQ0FDUyxDQUNiLENBQUM7QUFDSixDQUFDLENBQUMsQ0FBQyJ9

package/dist/components/opta/rugby/match-stats/OptaRugbyMatchStats.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/opta/rugby/match-stats/OptaRugbyMatchStats.stories.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { showcaseConverter } from '@times-components/storybook';
+import { ArticleHarness } from '../../../../fixtures/article-harness/ArticleHarness';
+import { OptaRugbyMatchStats } from './OptaRugbyMatchStats';
+const showcase = {
+    children: [
+        {
+            decorator: (storyFn) => (React.createElement(ArticleHarness, null, storyFn())),
+            type: 'decorator'
+        },
+        {
+            component: () => (React.createElement(OptaRugbyMatchStats, { season: "2022", competition: "209", match: "921100" })),
+            name: 'MatchStats',
+            type: 'story'
+        },
+        {
+            component: () => (React.createElement(OptaRugbyMatchStats, { season: "2022", competition: "209", match: "921087" })),
+            name: 'MatchStats (results)',
+            type: 'story'
+        }
+    ],
+    name: 'Typescript Component/In Article/Rugby/MatchStats'
+};
+// @ts-ignore
+showcaseConverter(module, showcase);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3B0YVJ1Z2J5TWF0Y2hTdGF0cy5zdG9yaWVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvb3B0YS9ydWdieS9tYXRjaC1zdGF0cy9PcHRhUnVnYnlNYXRjaFN0YXRzLnN0b3JpZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUVoRSxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0scURBQXFELENBQUM7QUFDckYsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFFNUQsTUFBTSxRQUFRLEdBQUc7SUFDZixRQUFRLEVBQUU7UUFDUjtZQUNFLFNBQVMsRUFBRSxDQUFDLE9BQThCLEVBQUUsRUFBRSxDQUFDLENBQzdDLG9CQUFDLGNBQWMsUUFBRSxPQUFPLEVBQUUsQ0FBa0IsQ0FDN0M7WUFDRCxJQUFJLEVBQUUsV0FBVztTQUNsQjtRQUNEO1lBQ0UsU0FBUyxFQUFFLEdBQUcsRUFBRSxDQUFDLENBQ2Ysb0JBQUMsbUJBQW1CLElBQUMsTUFBTSxFQUFDLE1BQU0sRUFBQyxXQUFXLEVBQUMsS0FBSyxFQUFDLEtBQUssRUFBQyxRQUFRLEdBQUcsQ0FDdkU7WUFDRCxJQUFJLEVBQUUsWUFBWTtZQUNsQixJQUFJLEVBQUUsT0FBTztTQUNkO1FBQ0Q7WUFDRSxTQUFTLEVBQUUsR0FBRyxFQUFFLENBQUMsQ0FDZixvQkFBQyxtQkFBbUIsSUFBQyxNQUFNLEVBQUMsTUFBTSxFQUFDLFdBQVcsRUFBQyxLQUFLLEVBQUMsS0FBSyxFQUFDLFFBQVEsR0FBRyxDQUN2RTtZQUNELElBQUksRUFBRSxzQkFBc0I7WUFDNUIsSUFBSSxFQUFFLE9BQU87U0FDZDtLQUNGO0lBQ0QsSUFBSSxFQUFFLGtEQUFrRDtDQUN6RCxDQUFDO0FBRUYsYUFBYTtBQUNiLGlCQUFpQixDQUFDLE1BQU0sRUFBRSxRQUFRLENBQUMsQ0FBQyJ9

package/dist/components/opta/rugby/match-stats/__tests__/OptaRugbyMatchStats.test.d.ts

@@ -0,0 +1,2 @@
+import 'regenerator-runtime';
+import '@testing-library/jest-dom';

package/dist/components/opta/rugby/match-stats/__tests__/OptaRugbyMatchStats.test.js

@@ -0,0 +1,40 @@
+import React from 'react';
+import { render, waitForElementToBeRemoved } from '@testing-library/react';
+import 'regenerator-runtime';
+import '@testing-library/jest-dom';
+jest.mock('@times-components/image', () => ({
+    Placeholder: () => React.createElement(React.Fragment, null, "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: () => new Promise(resolve => resolve({})),
+    initElement: mockInitElement,
+    initComponent: mockInitComponent
+}));
+import { OptaRugbyMatchStats } from '../OptaRugbyMatchStats';
+const requiredProps = {
+    season: '2022',
+    competition: '209',
+    match: '921100'
+};
+describe('OptaRugbyMatchStats', () => {
+    it('should render correctly', async () => {
+        const { asFragment, getByText } = render(React.createElement(OptaRugbyMatchStats, Object.assign({}, requiredProps)));
+        expect(asFragment()).toMatchSnapshot();
+        await waitForElementToBeRemoved(getByText('Placeholder'));
+        expect(mockInitSettings).toHaveBeenCalledTimes(1);
+        expect(mockInitStyleSheet).toHaveBeenCalledTimes(1);
+        expect(mockInitComponent).toHaveBeenCalledTimes(1);
+        expect(asFragment()).toMatchSnapshot();
+    });
+});
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3B0YVJ1Z2J5TWF0Y2hTdGF0cy50ZXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvb3B0YS9ydWdieS9tYXRjaC1zdGF0cy9fX3Rlc3RzX18vT3B0YVJ1Z2J5TWF0Y2hTdGF0cy50ZXN0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUFFLE1BQU0sRUFBRSx5QkFBeUIsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBRTNFLE9BQU8scUJBQXFCLENBQUM7QUFDN0IsT0FBTywyQkFBMkIsQ0FBQztBQUVuQyxJQUFJLENBQUMsSUFBSSxDQUFDLHlCQUF5QixFQUFFLEdBQUcsRUFBRSxDQUFDLENBQUM7SUFDMUMsV0FBVyxFQUFFLEdBQUcsRUFBRSxDQUFDLHdEQUFnQjtDQUNwQyxDQUFDLENBQUMsQ0FBQztBQUVKLE1BQU0sZ0JBQWdCLEdBQUcsSUFBSSxDQUFDLEVBQUUsRUFBRSxDQUFDO0FBQ25DLE1BQU0sa0JBQWtCLEdBQUcsSUFBSSxDQUFDLEVBQUUsRUFBRSxDQUFDO0FBQ3JDLE1BQU0saUJBQWlCLEdBQUcsSUFBSSxDQUFDLEVBQUUsRUFBRSxDQUFDO0FBRXBDLE1BQU0sZUFBZSxHQUFHLEdBQUcsRUFBRTtJQUMzQixNQUFNLE9BQU8sR0FBRyxRQUFRLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzlDLE9BQU8sQ0FBQyxXQUFXLENBQUMsUUFBUSxDQUFDLGNBQWMsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDO0lBQ3ZELE9BQU8sT0FBTyxDQUFDO0FBQ2pCLENBQUMsQ0FBQztBQUVGLElBQUksQ0FBQyxJQUFJLENBQUMsdUJBQXVCLEVBQUUsR0FBRyxFQUFFLENBQUMsQ0FBQztJQUN4QyxZQUFZLEVBQUUsZ0JBQWdCO0lBQzlCLGNBQWMsRUFBRSxrQkFBa0I7SUFDbEMsVUFBVSxFQUFFLEdBQUcsRUFBRSxDQUFDLElBQUksT0FBTyxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUMsT0FBTyxDQUFDLEVBQUUsQ0FBQyxDQUFDO0lBQ3JELFdBQVcsRUFBRSxlQUFlO0lBQzVCLGFBQWEsRUFBRSxpQkFBaUI7Q0FDakMsQ0FBQyxDQUFDLENBQUM7QUFFSixPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUU3RCxNQUFNLGFBQWEsR0FBRztJQUNwQixNQUFNLEVBQUUsTUFBTTtJQUNkLFdBQVcsRUFBRSxLQUFLO0lBQ2xCLEtBQUssRUFBRSxRQUFRO0NBQ2hCLENBQUM7QUFFRixRQUFRLENBQUMscUJBQXFCLEVBQUUsR0FBRyxFQUFFO0lBQ25DLEVBQUUsQ0FBQyx5QkFBeUIsRUFBRSxLQUFLLElBQUksRUFBRTtRQUN2QyxNQUFNLEVBQUUsVUFBVSxFQUFFLFNBQVMsRUFBRSxHQUFHLE1BQU0sQ0FDdEMsb0JBQUMsbUJBQW1CLG9CQUFLLGFBQWEsRUFBSSxDQUMzQyxDQUFDO1FBQ0YsTUFBTSxDQUFDLFVBQVUsRUFBRSxDQUFDLENBQUMsZUFBZSxFQUFFLENBQUM7UUFFdkMsTUFBTSx5QkFBeUIsQ0FBQyxTQUFTLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQztRQUUxRCxNQUFNLENBQUMsZ0JBQWdCLENBQUMsQ0FBQyxxQkFBcUIsQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUNsRCxNQUFNLENBQUMsa0JBQWtCLENBQUMsQ0FBQyxxQkFBcUIsQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUNwRCxNQUFNLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxxQkFBcUIsQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUVuRCxNQUFNLENBQUMsVUFBVSxFQUFFLENBQUMsQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUN6QyxDQUFDLENBQUMsQ0FBQztBQUNMLENBQUMsQ0FBQyxDQUFDIn0=

package/dist/components/opta/rugby/match-stats/styles.d.ts

@@ -0,0 +1 @@
+export declare const WidgetContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/opta/rugby/match-stats/styles.js

@@ -0,0 +1,153 @@
+import styled from 'styled-components';
+import { breakpoints, colours, fonts } from '@times-components/styleguide';
+import { WidgetContainerBase } from '../shared-styles';
+export const WidgetContainer = styled(WidgetContainerBase) `
+  .Opta {
+    h2 {
+      margin: 20px 0 10px 0 !important;
+    }
+
+    .Opta-Cf {
+      padding: 0;
+      background-color: transparent;
+
+      table {
+        tbody {
+          tr {
+            th.Opta-Stats-Bars-Text {
+              height: auto;
+              padding: 20px 0 0 0;
+              color: ${colours.functional.brandColour};
+              font-family: ${fonts.supporting};
+              font-size: 14px;
+              line-height: 14px;
+            }
+
+            td {
+              height: auto;
+              color: ${colours.functional.brandColour};
+              font-family: ${fonts.headline};
+              font-size: 18px;
+              line-height: 18px;
+              padding: 0;
+
+              &.Opta-Crest {
+                text-align: left;
+
+                &.Opta-Home {
+                  text-align: right;
+                }
+
+                img {
+                  width: 40px;
+                }
+              }
+
+              &.Opta-Team {
+                padding-left: 10px;
+                font-size: 18px;
+                line-height: 18px;
+
+                &.Opta-Home {
+                  padding-right: 10px;
+                  padding-left: 0;
+                  text-align: right;
+                }
+              }
+
+              &.Opta-Score {
+                width: 20px;
+                font-size: 24px;
+                line-height: 24px;
+                text-align: left;
+
+                &.Opta-Home {
+                  text-align: right;
+                }
+
+                span {
+                  min-width: 0;
+                  padding: 0;
+                  color: inherit;
+                  font-family: inherit;
+                  font-size: inherit;
+                  line-height: inherit;
+                  text-align: inherit;
+                  background-color: transparent !important;
+                }
+
+                @media (min-width: ${breakpoints.medium}px) {
+                  width: 30px;
+                  font-size: 32px;
+                  line-height: 32px;
+                }
+              }
+
+              &.Opta-Divider {
+                width: 20px;
+                text-align: center;
+
+                abbr {
+                  font-size: inherit;
+                  line-height: inherit;
+                  text-decoration: none;
+                }
+              }
+
+              .Opta-Bars {
+                margin: 0;
+
+                .Opta-Percent.Opta-Home {
+                  background-color: ${colours.section.sport};
+                }
+
+                .Opta-Percent.Opta-Away {
+                  background-color: ${colours.section.sport};
+                  opacity: 0.5;
+                }
+              }
+            }
+
+            &.Opta-Score-Extras {
+              td {
+                color: ${colours.functional.brandColour};
+                font-family: ${fonts.supporting};
+                font-size: 14px;
+                line-height: 28px;
+
+                span {
+                  color: inherit;
+                  font-size: inherit;
+                }
+              }
+            }
+
+            &.Opta-MatchHeader-Details {
+              div {
+                padding: 0;
+                color: ${colours.section.sport};
+                font-family: ${fonts.supporting};
+                font-size: 12px;
+                line-height: 12px;
+                letter-spacing: 1px;
+                text-transform: uppercase;
+                background-color: transparent;
+
+                span {
+                  margin: 0 6px;
+                  color: inherit;
+                  font-size: inherit;
+                }
+              }
+            }
+          }
+        }
+
+        &.Opta-Stats-Bars {
+          margin-bottom: 20px;
+        }
+      }
+    }
+  }
+`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvb3B0YS9ydWdieS9tYXRjaC1zdGF0cy9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxNQUFNLE1BQU0sbUJBQW1CLENBQUM7QUFDdkMsT0FBTyxFQUFFLFdBQVcsRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFFM0UsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFFdkQsTUFBTSxDQUFDLE1BQU0sZUFBZSxHQUFHLE1BQU0sQ0FBQyxtQkFBbUIsQ0FBQyxDQUFBOzs7Ozs7Ozs7Ozs7Ozs7O3VCQWdCbkMsT0FBTyxDQUFDLFVBQVUsQ0FBQyxXQUFXOzZCQUN4QixLQUFLLENBQUMsVUFBVTs7Ozs7Ozt1QkFPdEIsT0FBTyxDQUFDLFVBQVUsQ0FBQyxXQUFXOzZCQUN4QixLQUFLLENBQUMsUUFBUTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7cUNBa0ROLFdBQVcsQ0FBQyxNQUFNOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O3NDQXNCakIsT0FBTyxDQUFDLE9BQU8sQ0FBQyxLQUFLOzs7O3NDQUlyQixPQUFPLENBQUMsT0FBTyxDQUFDLEtBQUs7Ozs7Ozs7O3lCQVFsQyxPQUFPLENBQUMsVUFBVSxDQUFDLFdBQVc7K0JBQ3hCLEtBQUssQ0FBQyxVQUFVOzs7Ozs7Ozs7Ozs7Ozt5QkFjdEIsT0FBTyxDQUFDLE9BQU8sQ0FBQyxLQUFLOytCQUNmLEtBQUssQ0FBQyxVQUFVOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztDQXVCOUMsQ0FBQyJ9

package/dist/components/opta/rugby/shared-styles.d.ts

@@ -0,0 +1,6 @@
+export declare const Container: import("styled-components").StyledComponent<"div", any, {
+    border: boolean;
+    fullWidth?: boolean | undefined;
+}, never>;
+export declare const PlaceholderContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const WidgetContainerBase: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/opta/rugby/shared-styles.js

@@ -0,0 +1,72 @@
+import styled from 'styled-components';
+import { breakpoints, colours, fonts } from '@times-components/styleguide';
+export const Container = styled.div `
+  margin: 0 auto 20px auto;
+  background-color: ${colours.functional.backgroundPrimary};
+  border-top: ${({ border }) => border ? `2px solid ${colours.section.sport}` : 'none'};
+
+  a {
+    text-decoration: none;
+  }
+
+  @media (min-width: ${breakpoints.medium}px) {
+    flex-direction: row;
+    width: ${({ fullWidth }) => (fullWidth ? '100%' : '80.8%')};
+  }
+
+  @media (min-width: ${breakpoints.wide}px) {
+    width: ${({ fullWidth }) => (fullWidth ? '100%' : '56.2%')};
+  }
+`;
+export const PlaceholderContainer = styled.div `
+  position: relative;
+  height: 200px;
+`;
+export const WidgetContainerBase = styled.div `
+  .Opta {
+    .Opta_W {
+      margin: 0;
+      background-color: transparent;
+
+      h2 {
+        height: auto;
+        margin: 20px 0;
+        color: ${colours.section.sport};
+        font-family: ${fonts.supporting};
+        font-size: 12px;
+        line-height: 14px;
+        font-weight: normal;
+        letter-spacing: 1px;
+        text-align: center;
+        text-transform: uppercase;
+        background-color: transparent;
+
+        span {
+          height: auto;
+          font-size: 12px;
+          line-height: 14px;
+          font-weight: normal;
+        }
+      }
+
+      table {
+        width: 100%;
+        margin: 0;
+        border-collapse: collapse;
+        border-spacing: 0;
+      }
+    }
+
+    p {
+      margin: 20px 0 0 0 !important;
+      padding: 0 0 20px 0 !important;
+      color: ${colours.functional.brandColour};
+      font-family: ${fonts.supporting};
+      font-size: 14px;
+      line-height: 14px;
+      text-align: center;
+      background: transparent !important;
+    }
+  }
+`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2hhcmVkLXN0eWxlcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL29wdGEvcnVnYnkvc2hhcmVkLXN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLE1BQU0sTUFBTSxtQkFBbUIsQ0FBQztBQUN2QyxPQUFPLEVBQUUsV0FBVyxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUUzRSxNQUFNLENBQUMsTUFBTSxTQUFTLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBMEM7O3NCQUV2RCxPQUFPLENBQUMsVUFBVSxDQUFDLGlCQUFpQjtnQkFDMUMsQ0FBQyxFQUFFLE1BQU0sRUFBRSxFQUFFLEVBQUUsQ0FDM0IsTUFBTSxDQUFDLENBQUMsQ0FBQyxhQUFhLE9BQU8sQ0FBQyxPQUFPLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQyxDQUFDLE1BQU07Ozs7Ozt1QkFNbkMsV0FBVyxDQUFDLE1BQU07O2FBRTVCLENBQUMsRUFBRSxTQUFTLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDOzs7dUJBR3ZDLFdBQVcsQ0FBQyxJQUFJO2FBQzFCLENBQUMsRUFBRSxTQUFTLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDOztDQUU3RCxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sb0JBQW9CLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBQTs7O0NBRzdDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxtQkFBbUIsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOzs7Ozs7Ozs7aUJBUzVCLE9BQU8sQ0FBQyxPQUFPLENBQUMsS0FBSzt1QkFDZixLQUFLLENBQUMsVUFBVTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztlQTRCeEIsT0FBTyxDQUFDLFVBQVUsQ0FBQyxXQUFXO3FCQUN4QixLQUFLLENBQUMsVUFBVTs7Ozs7OztDQU9wQyxDQUFDIn0=

package/dist/components/opta/rugby/standings/OptaRugbyStandings.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare const OptaRugbyStandings: React.FC<{
+    season: string;
+    competition: string;
+    default_nav?: string;
+    navigation?: boolean;
+    full_width?: boolean;
+}>;

package/dist/components/opta/rugby/standings/OptaRugbyStandings.js

@@ -0,0 +1,36 @@
+import React, { useState, useEffect } from 'react';
+import { Placeholder } from '@times-components/image';
+import { initSettings, initStyleSheet, initScript, initElement, initComponent } from '../../utils/config';
+import { Container, PlaceholderContainer } from '../shared-styles';
+import { WidgetContainer } from './styles';
+export const OptaRugbyStandings = React.memo(({ season, competition, default_nav = 1, navigation, full_width }) => {
+    const ref = React.createRef();
+    const [isReady, setIsReady] = useState(false);
+    useEffect(() => {
+        const sport = 'rugby';
+        initSettings();
+        initStyleSheet(sport);
+        initScript().then(() => {
+            if (ref.current) {
+                ref.current.innerHTML = initElement('opta-widget', {
+                    sport,
+                    widget: 'standings',
+                    season,
+                    competition,
+                    live: true,
+                    navigation: navigation ? 'dropdown' : undefined,
+                    default_nav,
+                    show_crests: true,
+                    breakpoints: 520
+                }).outerHTML;
+                initComponent();
+                setIsReady(true);
+            }
+        });
+    }, []);
+    return (React.createElement(Container, { border: isReady, fullWidth: full_width },
+        React.createElement(WidgetContainer, { ref: ref }),
+        !isReady && (React.createElement(PlaceholderContainer, null,
+            React.createElement(Placeholder, null)))));
+});
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3B0YVJ1Z2J5U3RhbmRpbmdzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvb3B0YS9ydWdieS9zdGFuZGluZ3MvT3B0YVJ1Z2J5U3RhbmRpbmdzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsTUFBTSxPQUFPLENBQUM7QUFFbkQsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBRXRELE9BQU8sRUFDTCxZQUFZLEVBQ1osY0FBYyxFQUNkLFVBQVUsRUFDVixXQUFXLEVBQ1gsYUFBYSxFQUNkLE1BQU0sb0JBQW9CLENBQUM7QUFFNUIsT0FBTyxFQUFFLFNBQVMsRUFBRSxvQkFBb0IsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBQ25FLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxVQUFVLENBQUM7QUFFM0MsTUFBTSxDQUFDLE1BQU0sa0JBQWtCLEdBTTFCLEtBQUssQ0FBQyxJQUFJLENBQ2IsQ0FBQyxFQUFFLE1BQU0sRUFBRSxXQUFXLEVBQUUsV0FBVyxHQUFHLENBQUMsRUFBRSxVQUFVLEVBQUUsVUFBVSxFQUFFLEVBQUUsRUFBRTtJQUNuRSxNQUFNLEdBQUcsR0FBRyxLQUFLLENBQUMsU0FBUyxFQUFrQixDQUFDO0lBRTlDLE1BQU0sQ0FBQyxPQUFPLEVBQUUsVUFBVSxDQUFDLEdBQUcsUUFBUSxDQUFVLEtBQUssQ0FBQyxDQUFDO0lBRXZELFNBQVMsQ0FBQyxHQUFHLEVBQUU7UUFDYixNQUFNLEtBQUssR0FBRyxPQUFPLENBQUM7UUFFdEIsWUFBWSxFQUFFLENBQUM7UUFDZixjQUFjLENBQUMsS0FBSyxDQUFDLENBQUM7UUFFdEIsVUFBVSxFQUFFLENBQUMsSUFBSSxDQUFDLEdBQUcsRUFBRTtZQUNyQixJQUFJLEdBQUcsQ0FBQyxPQUFPLEVBQUU7Z0JBQ2YsR0FBRyxDQUFDLE9BQU8sQ0FBQyxTQUFTLEdBQUcsV0FBVyxDQUFDLGFBQWEsRUFBRTtvQkFDakQsS0FBSztvQkFDTCxNQUFNLEVBQUUsV0FBVztvQkFDbkIsTUFBTTtvQkFDTixXQUFXO29CQUNYLElBQUksRUFBRSxJQUFJO29CQUNWLFVBQVUsRUFBRSxVQUFVLENBQUMsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsU0FBUztvQkFDL0MsV0FBVztvQkFDWCxXQUFXLEVBQUUsSUFBSTtvQkFDakIsV0FBVyxFQUFFLEdBQUc7aUJBQ2pCLENBQUMsQ0FBQyxTQUFTLENBQUM7Z0JBRWIsYUFBYSxFQUFFLENBQUM7Z0JBQ2hCLFVBQVUsQ0FBQyxJQUFJLENBQUMsQ0FBQzthQUNsQjtRQUNILENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDO0lBRVAsT0FBTyxDQUNMLG9CQUFDLFNBQVMsSUFBQyxNQUFNLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxVQUFVO1FBQy9DLG9CQUFDLGVBQWUsSUFBQyxHQUFHLEVBQUUsR0FBRyxHQUFJO1FBRTVCLENBQUMsT0FBTyxJQUFJLENBQ1gsb0JBQUMsb0JBQW9CO1lBQ25CLG9CQUFDLFdBQVcsT0FBRyxDQUNNLENBQ3hCLENBQ1MsQ0FDYixDQUFDO0FBQ0osQ0FBQyxDQUNGLENBQUMifQ==

package/dist/components/opta/rugby/standings/OptaRugbyStandings.stories.d.ts

@@ -0,0 +1 @@
+export {};