@times-components/ts-components 1.89.0 → 1.89.1-alpha.1

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.
Files changed (25) hide show
  1. package/dist/components/opta/football/fixtures-tournament/OptaFootballFixturesTournament.d.ts +2 -0
  2. package/dist/components/opta/football/fixtures-tournament/OptaFootballFixturesTournament.js +3 -3
  3. package/dist/components/opta/football/fixtures-tournament/styles.d.ts +1 -0
  4. package/dist/components/opta/football/fixtures-tournament/styles.js +7 -5
  5. package/dist/components/opta/football/player-stats/OptaFootballPlayerStats.d.ts +1 -0
  6. package/dist/components/opta/football/player-stats/OptaFootballPlayerStats.js +3 -3
  7. package/dist/components/opta/football/shared-styles.js +7 -1
  8. package/dist/components/opta/football/standings/OptaFootballStandings.d.ts +1 -0
  9. package/dist/components/opta/football/standings/OptaFootballStandings.js +3 -3
  10. package/dist/components/opta/utils/replaceNationalTeamDetails.js +8 -4
  11. package/package.json +16 -16
  12. package/rnw.js +1 -1
  13. package/src/components/opta/football/fixtures/__tests__/__snapshots__/OptaFootballFixtures.test.tsx.snap +2 -2
  14. package/src/components/opta/football/fixtures-ticker/__tests__/__snapshots__/OptaFootballFixturesTicker.test.tsx.snap +4 -4
  15. package/src/components/opta/football/fixtures-tournament/OptaFootballFixturesTournament.tsx +6 -0
  16. package/src/components/opta/football/fixtures-tournament/__tests__/__snapshots__/OptaFootballFixturesTournament.test.tsx.snap +6 -6
  17. package/src/components/opta/football/fixtures-tournament/styles.ts +7 -4
  18. package/src/components/opta/football/match-stats/__tests__/__snapshots__/OptaFootballMatchStats.test.tsx.snap +2 -2
  19. package/src/components/opta/football/player-stats/OptaFootballPlayerStats.tsx +4 -2
  20. package/src/components/opta/football/player-stats/__tests__/__snapshots__/OptaFootballPlayerStats.test.tsx.snap +2 -2
  21. package/src/components/opta/football/shared-styles.ts +6 -0
  22. package/src/components/opta/football/standings/OptaFootballStandings.tsx +3 -1
  23. package/src/components/opta/football/standings/__tests__/__snapshots__/OptaFootballStandings.test.tsx.snap +4 -4
  24. package/src/components/opta/football/summary/__tests__/__snapshots__/OptaFootballSummary.test.tsx.snap +2 -2
  25. package/src/components/opta/utils/replaceNationalTeamDetails.ts +17 -5
package/src/components/opta/football/fixtures/__tests__/__snapshots__/OptaFootballFixtures.test.tsx.snap CHANGED
@@ -6,7 +6,7 @@ exports[`OptaFootballFixtures should render correctly 1`] = `
6
6
  class="sc-bdVaJa giUBsz"
7
7
  >
8
8
  <div
9
- class="sc-htpNat sc-ifAKCX iHxEZu"
9
+ class="sc-htpNat sc-ifAKCX kxBLBz"
10
10
  />
11
11
  <div
12
12
  class="sc-bwzfXH kVYHKf"
@@ -23,7 +23,7 @@ exports[`OptaFootballFixtures should render correctly 2`] = `
23
23
  class="sc-bdVaJa hGXeaj"
24
24
  >
25
25
  <div
26
- class="sc-htpNat sc-ifAKCX iHxEZu"
26
+ class="sc-htpNat sc-ifAKCX kxBLBz"
27
27
  >
28
28
  <div>
29
29
  Widget
package/src/components/opta/football/fixtures-ticker/__tests__/__snapshots__/OptaFootballFixturesTicker.test.tsx.snap CHANGED
@@ -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 iDswry"
6
+ class="sc-htpNat sc-ifAKCX bHwso"
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 iDswry"
20
+ class="sc-htpNat sc-ifAKCX bHwso"
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 iDswry"
32
+ class="sc-htpNat sc-ifAKCX bHwso"
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 iDswry"
46
+ class="sc-htpNat sc-ifAKCX bHwso"
47
47
  >
48
48
  <div>
49
49
  Widget
package/src/components/opta/football/fixtures-tournament/OptaFootballFixturesTournament.tsx CHANGED
@@ -24,7 +24,9 @@ export const OptaFootballFixturesTournament: React.FC<{
24
24
  days_before?: number;
25
25
  matchday?: string;
26
26
  round?: string;
27
+ classes?: string;
27
28
  show_title?: boolean;
29
+ hide_matchday?: boolean;
28
30
  columns?: boolean;
29
31
  full_width?: boolean;
30
32
  }> = React.memo(
@@ -37,6 +39,8 @@ export const OptaFootballFixturesTournament: React.FC<{
37
39
  days_before,
38
40
  matchday,
39
41
  round,
42
+ classes,
43
+ hide_matchday,
40
44
  show_title = true,
41
45
  columns = true,
42
46
  full_width
@@ -104,7 +108,9 @@ export const OptaFootballFixturesTournament: React.FC<{
104
108
  <WidgetContainer
105
109
  ref={ref}
106
110
  isNationalComp={isNationalComp}
111
+ hide_matchday={hide_matchday}
107
112
  columns={columns}
113
+ className={classes}
108
114
  />
109
115
 
110
116
  {!isReady && (
package/src/components/opta/football/fixtures-tournament/__tests__/__snapshots__/OptaFootballFixturesTournament.test.tsx.snap CHANGED
@@ -6,7 +6,7 @@ exports[`OptaFootballFixturesTournament should render national competitions corr
6
6
  class="sc-bdVaJa giUBsz"
7
7
  >
8
8
  <div
9
- class="sc-htpNat sc-ifAKCX hfjbYe team-flags"
9
+ class="sc-htpNat sc-ifAKCX jhbbQl team-flags"
10
10
  />
11
11
  <div
12
12
  class="sc-bwzfXH kVYHKf"
@@ -23,7 +23,7 @@ exports[`OptaFootballFixturesTournament should render national competitions corr
23
23
  class="sc-bdVaJa hGXeaj"
24
24
  >
25
25
  <div
26
- class="sc-htpNat sc-ifAKCX hfjbYe team-flags"
26
+ class="sc-htpNat sc-ifAKCX jhbbQl team-flags"
27
27
  >
28
28
  <div>
29
29
  Widget
@@ -39,7 +39,7 @@ exports[`OptaFootballFixturesTournament should render national competitions corr
39
39
  class="sc-bdVaJa giUBsz"
40
40
  >
41
41
  <div
42
- class="sc-htpNat sc-ifAKCX dNyttf team-flags"
42
+ class="sc-htpNat sc-ifAKCX dzTAxP team-flags"
43
43
  />
44
44
  <div
45
45
  class="sc-bwzfXH kVYHKf"
@@ -56,7 +56,7 @@ exports[`OptaFootballFixturesTournament should render national competitions corr
56
56
  class="sc-bdVaJa hGXeaj"
57
57
  >
58
58
  <div
59
- class="sc-htpNat sc-ifAKCX dNyttf team-flags"
59
+ class="sc-htpNat sc-ifAKCX dzTAxP team-flags"
60
60
  >
61
61
  <div>
62
62
  Widget
@@ -72,7 +72,7 @@ exports[`OptaFootballFixturesTournament should render other competitions correct
72
72
  class="sc-bdVaJa giUBsz"
73
73
  >
74
74
  <div
75
- class="sc-htpNat sc-ifAKCX dLyiar"
75
+ class="sc-htpNat sc-ifAKCX cqjxbm"
76
76
  />
77
77
  <div
78
78
  class="sc-bwzfXH kVYHKf"
@@ -89,7 +89,7 @@ exports[`OptaFootballFixturesTournament should render other competitions correct
89
89
  class="sc-bdVaJa hGXeaj"
90
90
  >
91
91
  <div
92
- class="sc-htpNat sc-ifAKCX dLyiar"
92
+ class="sc-htpNat sc-ifAKCX cqjxbm"
93
93
  >
94
94
  <div>
95
95
  Widget
package/src/components/opta/football/fixtures-tournament/styles.ts CHANGED
@@ -41,6 +41,7 @@ export const WidgetContainerOverride = styled(WidgetContainerBase)`
41
41
 
42
42
  export const WidgetContainer = styled(WidgetContainerBase)<{
43
43
  isNationalComp?: boolean;
44
+ hide_matchday?: boolean;
44
45
  columns?: boolean;
45
46
  }>`
46
47
  .Opta {
@@ -61,6 +62,7 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
61
62
  &:has(h3) {
62
63
  column-span: all;
63
64
  margin-top: 24px;
65
+ ${({ hide_matchday }) => hide_matchday && 'display: none;'};
64
66
  }
65
67
 
66
68
  td.Opta-Nest.Opta-JS-Nest-Content.Opta-Expanded {
@@ -112,6 +114,7 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
112
114
 
113
115
  td {
114
116
  max-width: none !important;
117
+ padding: 0;
115
118
  color: ${colours.functional.brandColour} !important;
116
119
  font-family: ${fonts.headline};
117
120
  font-size: 14px;
@@ -122,7 +125,6 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
122
125
  &.Opta-Time {
123
126
  padding-left: 10px;
124
127
  color: ${colours.section.sport} !important;
125
- font-family: ${fonts.supporting};
126
128
 
127
129
  abbr {
128
130
  font-size: inherit;
@@ -140,11 +142,11 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
140
142
  background-position: center left;
141
143
  width: 34%;
142
144
  padding-left: ${({ isNationalComp }) =>
143
- isNationalComp ? '38px;' : '10px;'}
145
+ isNationalComp ? '24px;' : '10px;'}
144
146
  &.Opta-Home {
145
147
  background-position: center right;
146
148
  padding-right: ${({ isNationalComp }) =>
147
- isNationalComp ? '38px;' : '10px;'};
149
+ isNationalComp ? '24px;' : '10px;'};
148
150
  padding-left: 0;
149
151
  text-align: right;
150
152
  }
@@ -167,7 +169,7 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
167
169
  font-size: 16px;
168
170
  line-height: 16px;
169
171
  text-align: center !important;
170
- min-width: 25px;
172
+ width: 20px;
171
173
 
172
174
  span {
173
175
  font-size: inherit;
@@ -188,6 +190,7 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
188
190
 
189
191
  &.Opta-Divider {
190
192
  text-align: center;
193
+ width: 8px;
191
194
 
192
195
  abbr {
193
196
  font-size: inherit;
package/src/components/opta/football/match-stats/__tests__/__snapshots__/OptaFootballMatchStats.test.tsx.snap CHANGED
@@ -6,7 +6,7 @@ exports[`OptaFootballMatchStats should render correctly 1`] = `
6
6
  class="sc-bdVaJa giUBsz"
7
7
  >
8
8
  <div
9
- class="sc-htpNat sc-bxivhb iNxpQd"
9
+ class="sc-htpNat sc-bxivhb kuUNOE"
10
10
  />
11
11
  <div
12
12
  class="sc-bwzfXH kVYHKf"
@@ -23,7 +23,7 @@ exports[`OptaFootballMatchStats should render correctly 2`] = `
23
23
  class="sc-bdVaJa hGXeaj"
24
24
  >
25
25
  <div
26
- class="sc-htpNat sc-bxivhb iNxpQd"
26
+ class="sc-htpNat sc-bxivhb kuUNOE"
27
27
  >
28
28
  <div>
29
29
  Widget
package/src/components/opta/football/player-stats/OptaFootballPlayerStats.tsx CHANGED
@@ -19,6 +19,7 @@ export const OptaFootballPlayerStats: React.FC<{
19
19
  season: string;
20
20
  competition: string;
21
21
  visible_categories: string; // goals | assists | cards_red | cards_yellow
22
+ classes?: string;
22
23
  show_title?: boolean;
23
24
  full_width?: boolean;
24
25
  }> = React.memo(
@@ -27,7 +28,8 @@ export const OptaFootballPlayerStats: React.FC<{
27
28
  competition,
28
29
  full_width,
29
30
  show_title = true,
30
- visible_categories
31
+ visible_categories,
32
+ classes
31
33
  }) => {
32
34
  const ref = React.createRef<HTMLDivElement>();
33
35
 
@@ -74,7 +76,7 @@ export const OptaFootballPlayerStats: React.FC<{
74
76
 
75
77
  return (
76
78
  <Container border={isReady} fullWidth={full_width}>
77
- <WidgetContainer ref={ref} />
79
+ <WidgetContainer ref={ref} className={classes} />
78
80
 
79
81
  {!isReady && (
80
82
  <PlaceholderContainer>
package/src/components/opta/football/player-stats/__tests__/__snapshots__/OptaFootballPlayerStats.test.tsx.snap CHANGED
@@ -6,7 +6,7 @@ exports[`OptaFootballPlayerStats should render correctly 1`] = `
6
6
  class="sc-bdVaJa giUBsz"
7
7
  >
8
8
  <div
9
- class="sc-htpNat sc-bxivhb iNxpQd team-flags"
9
+ class="sc-htpNat sc-bxivhb kuUNOE team-flags"
10
10
  />
11
11
  <div
12
12
  class="sc-bwzfXH kVYHKf"
@@ -23,7 +23,7 @@ exports[`OptaFootballPlayerStats should render correctly 2`] = `
23
23
  class="sc-bdVaJa hGXeaj"
24
24
  >
25
25
  <div
26
- class="sc-htpNat sc-bxivhb iNxpQd team-flags"
26
+ class="sc-htpNat sc-bxivhb kuUNOE team-flags"
27
27
  >
28
28
  <div>
29
29
  Widget
package/src/components/opta/football/shared-styles.ts CHANGED
@@ -50,6 +50,12 @@ const flagStyles = Object.keys(countries).map(
50
50
  background-position: 10px 8px;
51
51
  padding-left: 38px !important;
52
52
  }
53
+ .Opta-Scoreline .Opta-Team-${countryCode}.Opta-Team {
54
+ padding-left: 28px !important;
55
+ }
56
+ .Opta-Scoreline .Opta-Home.Opta-Team-${countryCode}.Opta-Team {
57
+ padding-left: 0 !important;
58
+ }
53
59
 
54
60
  .Opta-Player .Opta-Image-Team-${countryCode} {
55
61
  width: 100%;
package/src/components/opta/football/standings/OptaFootballStandings.tsx CHANGED
@@ -19,6 +19,7 @@ export const OptaFootballStandings: React.FC<{
19
19
  season: string;
20
20
  competition: string;
21
21
  default_nav?: string;
22
+ classes?: string;
22
23
  navigation?: boolean;
23
24
  full_width?: boolean;
24
25
  show_title?: boolean;
@@ -28,6 +29,7 @@ export const OptaFootballStandings: React.FC<{
28
29
  season,
29
30
  competition,
30
31
  default_nav = 1,
32
+ classes,
31
33
  navigation,
32
34
  show_title = true,
33
35
  full_width,
@@ -70,7 +72,7 @@ export const OptaFootballStandings: React.FC<{
70
72
 
71
73
  return (
72
74
  <Container border={isReady} fullWidth={full_width}>
73
- <WidgetContainer ref={ref} columns={columns} />
75
+ <WidgetContainer ref={ref} columns={columns} className={classes} />
74
76
 
75
77
  {!isReady && (
76
78
  <PlaceholderContainer>
package/src/components/opta/football/standings/__tests__/__snapshots__/OptaFootballStandings.test.tsx.snap CHANGED
@@ -6,7 +6,7 @@ exports[`OptaFootballStandings should render correctly 1`] = `
6
6
  class="sc-bdVaJa giUBsz"
7
7
  >
8
8
  <div
9
- class="sc-htpNat sc-bxivhb jlQRkQ team-flags"
9
+ class="sc-htpNat sc-bxivhb emBoTf team-flags"
10
10
  />
11
11
  <div
12
12
  class="sc-bwzfXH kVYHKf"
@@ -23,7 +23,7 @@ exports[`OptaFootballStandings should render correctly 2`] = `
23
23
  class="sc-bdVaJa hGXeaj"
24
24
  >
25
25
  <div
26
- class="sc-htpNat sc-bxivhb jlQRkQ team-flags"
26
+ class="sc-htpNat sc-bxivhb emBoTf team-flags"
27
27
  >
28
28
  <div>
29
29
  Widget
@@ -39,7 +39,7 @@ exports[`OptaFootballStandings should render correctly, with columns 1`] = `
39
39
  class="sc-bdVaJa giUBsz"
40
40
  >
41
41
  <div
42
- class="sc-htpNat sc-bxivhb hCEQsc team-flags"
42
+ class="sc-htpNat sc-bxivhb fuTTUJ team-flags"
43
43
  />
44
44
  <div
45
45
  class="sc-bwzfXH kVYHKf"
@@ -56,7 +56,7 @@ exports[`OptaFootballStandings should render correctly, with columns 2`] = `
56
56
  class="sc-bdVaJa hGXeaj"
57
57
  >
58
58
  <div
59
- class="sc-htpNat sc-bxivhb hCEQsc team-flags"
59
+ class="sc-htpNat sc-bxivhb fuTTUJ team-flags"
60
60
  >
61
61
  <div>
62
62
  Widget
package/src/components/opta/football/summary/__tests__/__snapshots__/OptaFootballSummary.test.tsx.snap CHANGED
@@ -6,7 +6,7 @@ exports[`OptaFootballSummary should render correctly 1`] = `
6
6
  class="sc-bdVaJa giUBsz"
7
7
  >
8
8
  <div
9
- class="sc-htpNat sc-bxivhb kUcFdM"
9
+ class="sc-htpNat sc-bxivhb bVfwPK"
10
10
  />
11
11
  <div
12
12
  class="sc-bwzfXH kVYHKf"
@@ -23,7 +23,7 @@ exports[`OptaFootballSummary should render correctly 2`] = `
23
23
  class="sc-bdVaJa hGXeaj"
24
24
  >
25
25
  <div
26
- class="sc-htpNat sc-bxivhb kUcFdM"
26
+ class="sc-htpNat sc-bxivhb bVfwPK"
27
27
  >
28
28
  <div>
29
29
  Widget
package/src/components/opta/utils/replaceNationalTeamDetails.ts CHANGED
@@ -18,11 +18,23 @@ export const replaceWithTBD = (element: HTMLCollectionOf<Element>) => {
18
18
  for (let optaFlagContainer of element) {
19
19
  const country = (optaFlagContainer as HTMLElement).innerText;
20
20
 
21
- if (
22
- country &&
23
- (country.includes('Third Place') || country.includes('Group'))
24
- ) {
25
- (optaFlagContainer as HTMLElement).innerText = 'TBD';
21
+ if (country) {
22
+ if (country.includes('Third Place') || country.includes('Group')) {
23
+ (optaFlagContainer as HTMLElement).innerText = 'TBD';
24
+ }
25
+
26
+ (optaFlagContainer as HTMLElement).innerText = (optaFlagContainer as HTMLElement).innerText.replace(
27
+ /Quarter-Finalist/,
28
+ 'QF'
29
+ );
30
+ (optaFlagContainer as HTMLElement).innerText = (optaFlagContainer as HTMLElement).innerText.replace(
31
+ /Semi-Finalist/,
32
+ 'SF'
33
+ );
34
+ (optaFlagContainer as HTMLElement).innerText = (optaFlagContainer as HTMLElement).innerText.replace(
35
+ /Semi-Final/,
36
+ 'SF'
37
+ );
26
38
  }
27
39
  }
28
40
  }, 500);