Skip to content

Commit 5bbfd70

Browse files
andrewHEguardianoliverabrahamsJamieB-gu
authored
Create Cricket Scorecard component (#13683)
* create cricket scorecard component - bowling table - Batters table - fall of wickets Co-authored-by: Oliver Abrahams <[email protected]> Co-authored-by: oliverabrahams <[email protected]> Co-authored-by: Jamie B <[email protected]>
1 parent f5b2a03 commit 5bbfd70

File tree

6 files changed

+702
-24
lines changed

6 files changed

+702
-24
lines changed

‎dotcom-rendering/src/components/CricketScorecard.stories.tsx

Lines changed: 287 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,287 @@
1+
import { breakpoints } from '@guardian/source/foundations';
2+
import type { Meta, StoryObj } from '@storybook/react';
3+
import { CricketScorecard as CricketScorecardComponent } from './CricketScorecard';
4+
5+
const meta = {
6+
component: CricketScorecardComponent,
7+
title: 'Components/CricketScorecard',
8+
decorators: [
9+
// To make the story not shoved in the corner.
10+
(Story) => (
11+
<>
12+
<div css={{ padding: 16 }}>
13+
<Story />
14+
</div>
15+
</>
16+
),
17+
],
18+
parameters: {
19+
chromatic: {
20+
viewports: [breakpoints.mobileLandscape],
21+
},
22+
},
23+
} satisfies Meta<typeof CricketScorecardComponent>;
24+
25+
export default meta;
26+
27+
type Story = StoryObj<typeof meta>;
28+
29+
export const CricketScorecard = {
30+
name: 'Cricket Scorecard',
31+
args: {
32+
allInnings: [
33+
{
34+
description: 'India first innings',
35+
inningsTotals: {
36+
runs: 254,
37+
overs: '49.0',
38+
extras: 8,
39+
wickets: 7,
40+
},
41+
extras: {
42+
byes: 1,
43+
legByes: 2,
44+
wides: 5,
45+
noBalls: 0,
46+
penalties: 0,
47+
},
48+
batters: [
49+
{
50+
name: 'Rohit Sharma',
51+
ballsFaced: 83,
52+
runs: 76,
53+
fours: 7,
54+
sixes: 3,
55+
howOut: 'st Latham b Ravindra',
56+
},
57+
{
58+
name: 'Shubman Gill',
59+
ballsFaced: 50,
60+
runs: 31,
61+
fours: 0,
62+
sixes: 1,
63+
howOut: 'c Phillips b Santner',
64+
},
65+
{
66+
name: 'Virat Kohli',
67+
ballsFaced: 2,
68+
runs: 1,
69+
fours: 0,
70+
sixes: 0,
71+
howOut: 'lbw b Bracewell',
72+
},
73+
{
74+
name: 'Shreyas Iyer',
75+
ballsFaced: 62,
76+
runs: 48,
77+
fours: 2,
78+
sixes: 2,
79+
howOut: 'c Ravindra b Santner',
80+
},
81+
],
82+
bowlers: [
83+
{
84+
name: 'Mohammed Shami',
85+
overs: 9,
86+
maidens: 0,
87+
runs: 74,
88+
wickets: 1,
89+
balls: 55,
90+
},
91+
{
92+
name: 'Hardik Pandya',
93+
overs: 3,
94+
maidens: 0,
95+
runs: 30,
96+
wickets: 0,
97+
balls: 18,
98+
},
99+
{
100+
name: 'Varun Chakaravarthy',
101+
overs: 10,
102+
maidens: 0,
103+
runs: 45,
104+
wickets: 2,
105+
balls: 60,
106+
},
107+
{
108+
name: 'Kuldeep Yadav',
109+
overs: 10,
110+
maidens: 0,
111+
runs: 40,
112+
wickets: 2,
113+
balls: 60,
114+
},
115+
{
116+
name: 'Axar Patel',
117+
overs: 8,
118+
maidens: 0,
119+
runs: 29,
120+
wickets: 0,
121+
balls: 48,
122+
},
123+
{
124+
name: 'Ravindra Jadeja',
125+
overs: 10,
126+
maidens: 0,
127+
runs: 30,
128+
wickets: 1,
129+
balls: 60,
130+
},
131+
],
132+
fallOfWickets: [
133+
{
134+
order: 1,
135+
name: 'Shubman Gill',
136+
runs: 105,
137+
},
138+
{
139+
order: 2,
140+
name: 'Virat Kohli',
141+
runs: 106,
142+
},
143+
{
144+
order: 3,
145+
name: 'Rohit Sharma',
146+
runs: 122,
147+
},
148+
],
149+
},
150+
{
151+
inningsTotals: {
152+
runs: 254,
153+
overs: '49.0',
154+
extras: 8,
155+
wickets: 7,
156+
},
157+
extras: {
158+
byes: 0,
159+
legByes: 3,
160+
noBalls: 0,
161+
penalties: 0,
162+
wides: 13,
163+
},
164+
description: 'New Zealand first innings',
165+
batters: [
166+
{
167+
name: 'Will Young',
168+
ballsFaced: 23,
169+
runs: 15,
170+
fours: 2,
171+
sixes: 0,
172+
howOut: 'lbw b Vinod',
173+
},
174+
{
175+
name: 'Rachin Ravindra',
176+
ballsFaced: 29,
177+
runs: 37,
178+
fours: 4,
179+
sixes: 1,
180+
howOut: 'b Yadav',
181+
},
182+
{
183+
name: 'Kane Williamson',
184+
ballsFaced: 14,
185+
runs: 11,
186+
fours: 1,
187+
sixes: 0,
188+
howOut: 'c & b Yadav',
189+
},
190+
{
191+
name: 'Daryl Mitchell',
192+
ballsFaced: 101,
193+
runs: 63,
194+
fours: 3,
195+
sixes: 0,
196+
howOut: 'c Sharma b Ahmed',
197+
},
198+
],
199+
bowlers: [
200+
{
201+
name: 'Mohammed Shami',
202+
overs: 9,
203+
maidens: 0,
204+
runs: 74,
205+
wickets: 1,
206+
balls: 54,
207+
},
208+
{
209+
name: 'Hardik Pandya',
210+
overs: 3,
211+
maidens: 0,
212+
runs: 30,
213+
wickets: 0,
214+
balls: 18,
215+
},
216+
{
217+
name: 'Varun Chakaravarthy',
218+
overs: 10,
219+
maidens: 0,
220+
runs: 45,
221+
wickets: 2,
222+
balls: 60,
223+
},
224+
{
225+
name: 'Kuldeep Yadav',
226+
overs: 10,
227+
maidens: 0,
228+
runs: 40,
229+
wickets: 2,
230+
balls: 60,
231+
},
232+
],
233+
fallOfWickets: [
234+
{
235+
order: 1,
236+
name: 'Will Young',
237+
runs: 57,
238+
},
239+
{
240+
order: 2,
241+
name: 'Rachin Ravindra',
242+
runs: 69,
243+
},
244+
],
245+
},
246+
],
247+
officials: [
248+
'P R Reiffel',
249+
'R K Illingworth',
250+
'J S Wilson',
251+
'H D P K Dharmasena',
252+
'R S Madugalle',
253+
],
254+
homeTeam: {
255+
name: 'India',
256+
lineup: [
257+
'Rohit Sharma',
258+
'Shubman Gill',
259+
'Virat Kohli',
260+
'Shreyas Iyer',
261+
'Axar Patel',
262+
'Lokesh Rahul',
263+
'Hardik Pandya',
264+
'Ravindra Jadeja',
265+
'Mohammed Shami',
266+
'Kuldeep Yadav',
267+
'Varun Chakaravarthy',
268+
],
269+
},
270+
awayTeam: {
271+
name: 'New Zealand',
272+
lineup: [
273+
'Rachin Ravindra',
274+
'Will Young',
275+
'Kane Williamson',
276+
'Daryl Mitchell',
277+
'Tom Latham',
278+
'Glenn Phillips',
279+
'Michael Bracewell',
280+
'Mitchell Santner',
281+
'Nathan Smith',
282+
'Kyle Jamieson',
283+
"Will O'Rourke",
284+
],
285+
},
286+
},
287+
} satisfies Story;

0 commit comments

Comments
 (0)