@times-components/ts-components 1.94.0 → 1.96.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,7 +3,7 @@
3
3
  exports[`OptaFootballFixturesTicker with flags should render correctly 1`] = `
4
4
  <DocumentFragment>
5
5
  <div
6
- class="sc-htpNat sc-ifAKCX jhYhmi"
6
+ class="sc-htpNat sc-ifAKCX kknaRS"
7
7
  />
8
8
  <div
9
9
  class="sc-bwzfXH uxFfR"
@@ -17,7 +17,7 @@ exports[`OptaFootballFixturesTicker with flags should render correctly 1`] = `
17
17
  exports[`OptaFootballFixturesTicker with flags should render correctly 2`] = `
18
18
  <DocumentFragment>
19
19
  <div
20
- class="sc-htpNat sc-ifAKCX jhYhmi"
20
+ class="sc-htpNat sc-ifAKCX kknaRS"
21
21
  >
22
22
  <div>
23
23
  Widget
@@ -29,7 +29,7 @@ exports[`OptaFootballFixturesTicker with flags should render correctly 2`] = `
29
29
  exports[`OptaFootballFixturesTicker without flags should render correctly 1`] = `
30
30
  <DocumentFragment>
31
31
  <div
32
- class="sc-htpNat sc-ifAKCX jhYhmi"
32
+ class="sc-htpNat sc-ifAKCX kknaRS"
33
33
  />
34
34
  <div
35
35
  class="sc-bwzfXH uxFfR"
@@ -43,7 +43,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly 1`] =
43
43
  exports[`OptaFootballFixturesTicker without flags should render correctly 2`] = `
44
44
  <DocumentFragment>
45
45
  <div
46
- class="sc-htpNat sc-ifAKCX jhYhmi"
46
+ class="sc-htpNat sc-ifAKCX kknaRS"
47
47
  >
48
48
  <div>
49
49
  Widget
@@ -55,7 +55,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly 2`] =
55
55
  exports[`OptaFootballFixturesTicker without flags should render correctly with fixturesPageUrl 1`] = `
56
56
  <DocumentFragment>
57
57
  <div
58
- class="sc-htpNat sc-ifAKCX jhYhmi"
58
+ class="sc-htpNat sc-ifAKCX kknaRS"
59
59
  />
60
60
  <div
61
61
  class="sc-bwzfXH uxFfR"
@@ -69,7 +69,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly with f
69
69
  exports[`OptaFootballFixturesTicker without flags should render correctly with fixturesPageUrl 2`] = `
70
70
  <DocumentFragment>
71
71
  <div
72
- class="sc-htpNat sc-ifAKCX jhYhmi"
72
+ class="sc-htpNat sc-ifAKCX kknaRS"
73
73
  >
74
74
  <div>
75
75
  Widget
@@ -81,7 +81,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly with f
81
81
  exports[`OptaFootballFixturesTicker without flags should render correctly with isApp property 1`] = `
82
82
  <DocumentFragment>
83
83
  <div
84
- class="sc-htpNat sc-ifAKCX kSjimB"
84
+ class="sc-htpNat sc-ifAKCX dmkFkw"
85
85
  />
86
86
  <div
87
87
  class="sc-bwzfXH uxFfR"
@@ -95,7 +95,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly with i
95
95
  exports[`OptaFootballFixturesTicker without flags should render correctly with isApp property 2`] = `
96
96
  <DocumentFragment>
97
97
  <div
98
- class="sc-htpNat sc-ifAKCX kSjimB"
98
+ class="sc-htpNat sc-ifAKCX dmkFkw"
99
99
  >
100
100
  <div>
101
101
  Widget
@@ -1,4 +1,4 @@
1
- import styled, { css } from 'styled-components';
1
+ import styled from 'styled-components';
2
2
  import { breakpoints, colours, fonts } from '@times-components/ts-styleguide';
3
3
 
4
4
  import { WidgetContainerBase } from '../shared-styles';
@@ -57,16 +57,16 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
57
57
  }
58
58
  }
59
59
 
60
- ${({ isApp }) =>
61
- !isApp &&
62
- css`
63
- @media (max-width: ${breakpoints.small}px) {
64
- .Opta-Window {
65
- left: 0 !important;
66
- right: 0 !important;
67
- }
68
- }
69
- `} .fixtures-page-link.Opta-fixture {
60
+ @media (max-width: ${breakpoints.small}px) {
61
+ .Opta-Window {
62
+ left: 0 !important;
63
+ right: 0 !important;
64
+ overflow-x: auto;
65
+ position: relative;
66
+ }
67
+ }
68
+
69
+ .fixtures-page-link.Opta-fixture {
70
70
  width: 85px !important;
71
71
  padding: 10px 8px;
72
72
  border: 1px solid black;
@@ -34,6 +34,17 @@ const showcase = {
34
34
  ),
35
35
  name: 'PlayerStats (assists)',
36
36
  type: 'story'
37
+ },
38
+ {
39
+ component: () => (
40
+ <OptaFootballPlayerStats
41
+ season="2023"
42
+ competition="3"
43
+ visible_categories="cards_red"
44
+ />
45
+ ),
46
+ name: 'PlayerStats (red cards)',
47
+ type: 'story'
37
48
  }
38
49
  ],
39
50
  name: 'Typescript Component/In Article/Football/PlayerStats'
@@ -20,6 +20,7 @@ export const OptaFootballPlayerStats: React.FC<{
20
20
  competition: string;
21
21
  visible_categories: string; // goals | assists | cards_red | cards_yellow
22
22
  classes?: string;
23
+ hide_zeroes?: boolean;
23
24
  show_title?: boolean;
24
25
  full_width?: boolean;
25
26
  }> = React.memo(
@@ -27,6 +28,7 @@ export const OptaFootballPlayerStats: React.FC<{
27
28
  season,
28
29
  competition,
29
30
  full_width,
31
+ hide_zeroes = true,
30
32
  show_title = true,
31
33
  visible_categories,
32
34
  classes
@@ -48,6 +50,7 @@ export const OptaFootballPlayerStats: React.FC<{
48
50
  ref.current.innerHTML = initElement('opta-widget', {
49
51
  sport,
50
52
  widget: 'player_ranking',
53
+ hide_zeroes,
51
54
  season,
52
55
  competition,
53
56
  template: 'normal',