@universal-tennis/ui-shared 0.1.14 → 0.1.16

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.
@@ -1,3 +1,3 @@
1
1
  /// <reference types="react" />
2
2
  import { DrawCardProps } from "./sharedTypes";
3
- export default function DrawCard({ options, onChange, onEditClick, selectedOptions, dateLabel, locationLabel, emptyLabel, isDisabled, ...props }: DrawCardProps): JSX.Element;
3
+ export default function DrawCard({ options, onChange, onEditClick, selectedOptions, dateLabel, locationLabel, emptyLabel, isDisabled, isSelectActive, isPosition1Winner, isPosition2Winner, isScorelessMatch, position1Team, position2Team, ...props }: DrawCardProps): JSX.Element;
@@ -14,7 +14,9 @@ import Box from '@mui/material/Box';
14
14
  import { styled } from '@mui/material/styles';
15
15
  import Select from '@mui/material/Select';
16
16
  import MenuItem from '@mui/material/MenuItem';
17
- import { FormControl, InputLabel } from '@mui/material';
17
+ import { Divider, FormControl, InputLabel } from '@mui/material';
18
+ import HighlightOffIcon from '@mui/icons-material/HighlightOff';
19
+ import IconButton from '@mui/material/IconButton';
18
20
  import Button from '../../atoms/Button/Button';
19
21
  import Typography, { SECONDARY_SIZES_ENUM, CATEGORY_ENUM } from '../../atoms/Typography/Typography';
20
22
  const StyledCard = styled(Box)({
@@ -28,21 +30,18 @@ const StyledCard = styled(Box)({
28
30
  cursor: 'pointer'
29
31
  },
30
32
  });
31
- const StyledMuiSelect = styled(Select)({
32
- border: '1px solid var(--cool-grey-600)',
33
- });
34
33
  const BottomGrid = styled(Box)({
35
34
  display: 'flex',
36
35
  alignItems: 'center',
37
36
  justifyContent: 'space-between',
38
37
  paddingTop: '32px',
39
38
  });
40
- const Positions = {
41
- ONE: '1',
42
- TWO: '2',
39
+ const positions = {
40
+ ONE: 1,
41
+ TWO: 2,
43
42
  };
44
43
  export default function DrawCard(_a) {
45
- var { options, onChange, onEditClick, selectedOptions, dateLabel, locationLabel, emptyLabel, isDisabled } = _a, props = __rest(_a, ["options", "onChange", "onEditClick", "selectedOptions", "dateLabel", "locationLabel", "emptyLabel", "isDisabled"]);
44
+ var { options, onChange, onEditClick, selectedOptions, dateLabel, locationLabel, emptyLabel, isDisabled, isSelectActive, isPosition1Winner, isPosition2Winner, isScorelessMatch, position1Team, position2Team } = _a, props = __rest(_a, ["options", "onChange", "onEditClick", "selectedOptions", "dateLabel", "locationLabel", "emptyLabel", "isDisabled", "isSelectActive", "isPosition1Winner", "isPosition2Winner", "isScorelessMatch", "position1Team", "position2Team"]);
46
45
  const { optionOne, optionTwo } = selectedOptions || {};
47
46
  const handleOnSelectionChange = (event, position) => {
48
47
  const id = event.target.value;
@@ -51,17 +50,29 @@ export default function DrawCard(_a) {
51
50
  }
52
51
  };
53
52
  return (React.createElement(StyledCard, Object.assign({}, props),
54
- React.createElement(FormControl, null,
55
- React.createElement(InputLabel, { id: "draw-card-select-top" }, emptyLabel),
56
- React.createElement(StyledMuiSelect, { labelId: "draw-card-select-top", id: "draw-card-select-top", value: optionOne, disabled: isDisabled, onChange: (e) => handleOnSelectionChange(e, Positions.ONE) },
57
- options.map((option) => React.createElement(MenuItem, { key: option.id, value: option.id }, option.label)),
58
- React.createElement(MenuItem, { sx: { borderTop: '1px solid var(--cool-grey-500)' }, value: "bye" }, "Set bye"))),
59
- React.createElement(Box, { pt: 1 }),
60
- React.createElement(FormControl, null,
61
- React.createElement(InputLabel, { id: "draw-card-select-bot" }, emptyLabel),
62
- React.createElement(StyledMuiSelect, { labelId: "draw-card-select-bot", id: "draw-card-select-bot", value: optionTwo, disabled: isDisabled, onChange: (e) => handleOnSelectionChange(e, Positions.TWO) },
63
- options.map((option) => React.createElement(MenuItem, { key: option.id, value: option.id }, option.label)),
64
- React.createElement(MenuItem, { sx: { borderTop: '1px solid var(--cool-grey-500)' }, value: "bye" }, "Set bye"))),
53
+ isSelectActive ? (React.createElement(React.Fragment, null,
54
+ React.createElement(FormControl, { style: { display: 'flex', flexDirection: 'row', alignItems: 'center' } },
55
+ React.createElement(InputLabel, { id: "draw-card-select-top" }, emptyLabel),
56
+ React.createElement(Select, { sx: { width: '100%' }, labelId: "draw-card-select-top", id: "draw-card-select-top", label: emptyLabel, value: optionOne, disabled: isDisabled, onChange: (e) => handleOnSelectionChange(e, positions.ONE) },
57
+ options.map((option) => React.createElement(MenuItem, { key: option.id, value: option.id }, option.label)),
58
+ React.createElement(MenuItem, { sx: { borderTop: '1px solid var(--cool-grey-500)' }, value: "bye" }, "Set bye")),
59
+ React.createElement(IconButton, { onClick: () => onChange({ position: positions.ONE, id: null }), sx: { marginLeft: '8px' }, size: "small" },
60
+ React.createElement(HighlightOffIcon, { sx: { fontSize: '16px' } }))),
61
+ React.createElement(Box, { pt: 2 }),
62
+ React.createElement(FormControl, { style: { display: 'flex', flexDirection: 'row', alignItems: 'center' } },
63
+ React.createElement(InputLabel, { id: "draw-card-select-bot" }, emptyLabel),
64
+ React.createElement(Select, { sx: { width: '100%' }, labelId: "draw-card-select-bot", id: "draw-card-select-bot", label: emptyLabel, value: optionTwo, disabled: isDisabled, onChange: (e) => handleOnSelectionChange(e, positions.TWO) },
65
+ options.map((option) => React.createElement(MenuItem, { key: option.id, value: option.id }, option.label)),
66
+ React.createElement(MenuItem, { sx: { borderTop: '1px solid var(--cool-grey-500)' }, value: "bye" }, "Set bye")),
67
+ React.createElement(IconButton, { onClick: () => onChange({ position: positions.TWO, id: null }), sx: { marginLeft: '8px' }, size: "small" },
68
+ React.createElement(HighlightOffIcon, { sx: { fontSize: '16px' } }))))) : (React.createElement(React.Fragment, null,
69
+ React.createElement(Box, { display: "flex", justifyContent: "space-between" },
70
+ React.createElement(Typography, { category: "secondary", size: isPosition1Winner ? 'medium-medium' : "medium-book" }, position1Team === null || position1Team === void 0 ? void 0 : position1Team.name),
71
+ React.createElement(Typography, { category: "secondary", size: isPosition1Winner ? 'medium-medium' : "medium-book" }, isScorelessMatch ? '-' : position1Team === null || position1Team === void 0 ? void 0 : position1Team.points)),
72
+ React.createElement(Divider, { sx: { my: 2 } }),
73
+ React.createElement(Box, { display: "flex", justifyContent: "space-between" },
74
+ React.createElement(Typography, { category: "secondary", size: isPosition2Winner ? 'medium-medium' : "medium-book" }, position2Team === null || position2Team === void 0 ? void 0 : position2Team.name),
75
+ React.createElement(Typography, { category: "secondary", size: isPosition2Winner ? 'medium-medium' : "medium-book" }, isScorelessMatch ? '-' : position2Team === null || position2Team === void 0 ? void 0 : position2Team.points)))),
65
76
  React.createElement(BottomGrid, null,
66
77
  React.createElement(Box, null,
67
78
  React.createElement(Typography, { category: CATEGORY_ENUM.SECONDARY, size: SECONDARY_SIZES_ENUM.SmallBook }, dateLabel),
@@ -1 +1 @@
1
- {"version":3,"file":"DrawCard.js","sourceRoot":"","sources":["../../../../src/stories/molecules/Cards/DrawCard.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,GAAG,MAAM,mBAAmB,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,MAA6B,MAAM,sBAAsB,CAAC;AACjE,OAAO,QAAQ,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AACxD,OAAO,MAAM,MAAM,2BAA2B,CAAC;AAC/C,OAAO,UAAU,EAAE,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGpG,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;IAC7B,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,QAAQ;IACvB,YAAY,EAAE,KAAK;IACnB,OAAO,EAAE,WAAW;IACpB,KAAK,EAAE,MAAM;IACb,eAAe,EAAE,sBAAsB;IAEvC,SAAS,EAAE;QACT,MAAM,EAAE,SAAS;KAClB;CACF,CAAC,CAAC;AAEH,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;IACrC,MAAM,EAAE,gCAAgC;CACzC,CAAC,CAAC;AAEH,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;IAC7B,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,cAAc,EAAE,eAAe;IAC/B,UAAU,EAAE,MAAM;CACnB,CAAC,CAAC;AAEH,MAAM,SAAS,GAAG;IAChB,GAAG,EAAE,GAAG;IACR,GAAG,EAAE,GAAG;CACT,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAEjB;QAFiB,EAC/B,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,eAAe,EAAE,SAAS,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,OACnF,EADwF,KAAK,cAD5E,mHAEhC,CAD4G;IAE3G,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,eAAe,IAAI,EAAE,CAAC;IAEvD,MAAM,uBAAuB,GAAG,CAAC,KAAiC,EAAE,QAAgB,EAAE,EAAE;QACtF,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,KAAe,CAAC;QAExC,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;SAC5B;IACH,CAAC,CAAC;IAEF,OAAO,CACH,oBAAC,UAAU,oBACH,KAAK;QAET,oBAAC,WAAW;YACR,oBAAC,UAAU,IAAC,EAAE,EAAC,sBAAsB,IAAE,UAAU,CAAc;YAC/D,oBAAC,eAAe,IACZ,OAAO,EAAC,sBAAsB,EAC9B,EAAE,EAAC,sBAAsB,EACzB,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,uBAAuB,CAAC,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC;gBAEzD,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,oBAAC,QAAQ,IAAC,GAAG,EAAE,MAAM,CAAC,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,EAAE,IAAG,MAAM,CAAC,KAAK,CAAY,CAAC;gBAC/F,oBAAC,QAAQ,IAAC,EAAE,EAAE,EAAE,SAAS,EAAE,gCAAgC,EAAE,EAAE,KAAK,EAAC,KAAK,cAAmB,CAC/E,CACR;QAEd,oBAAC,GAAG,IAAC,EAAE,EAAE,CAAC,GAAI;QACd,oBAAC,WAAW;YACR,oBAAC,UAAU,IAAC,EAAE,EAAC,sBAAsB,IAAE,UAAU,CAAc;YAC/D,oBAAC,eAAe,IACZ,OAAO,EAAC,sBAAsB,EAC9B,EAAE,EAAC,sBAAsB,EACzB,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,uBAAuB,CAAC,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC;gBAEzD,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,oBAAC,QAAQ,IAAC,GAAG,EAAE,MAAM,CAAC,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,EAAE,IAAG,MAAM,CAAC,KAAK,CAAY,CAAC;gBAC/F,oBAAC,QAAQ,IAAC,EAAE,EAAE,EAAE,SAAS,EAAE,gCAAgC,EAAE,EAAE,KAAK,EAAC,KAAK,cAAmB,CAC/E,CACR;QACd,oBAAC,UAAU;YAEP,oBAAC,GAAG;gBACA,oBAAC,UAAU,IAAC,QAAQ,EAAE,aAAa,CAAC,SAAS,EAAE,IAAI,EAAE,oBAAoB,CAAC,SAAS,IAC9E,SAAS,CACD;gBACb,oBAAC,UAAU,IAAC,QAAQ,EAAE,aAAa,CAAC,SAAS,EAAE,IAAI,EAAE,oBAAoB,CAAC,SAAS,IAC9E,aAAa,CACL,CACX;YACN,oBAAC,MAAM,IACH,KAAK,EAAE;oBACL,OAAO,EAAE,MAAM;oBACf,cAAc,EAAE,KAAK;iBACtB,EACD,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAC,MAAM;gBAEf,oBAAC,UAAU,IAAC,QAAQ,EAAE,aAAa,CAAC,SAAS,EAAE,IAAI,EAAE,oBAAoB,CAAC,eAAe,WAE5E,CACR,CACA,CACJ,CAChB,CAAC;AACJ,CAAC"}
1
+ {"version":3,"file":"DrawCard.js","sourceRoot":"","sources":["../../../../src/stories/molecules/Cards/DrawCard.tsx"],"names":[],"mappings":"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"}
@@ -7,8 +7,12 @@ type Options = {
7
7
  label: string;
8
8
  }[];
9
9
  type OnChangeArgs = {
10
- position: string;
11
- id: string;
10
+ position: number;
11
+ id: string | null;
12
+ };
13
+ type PositionTeam = {
14
+ name: string;
15
+ points: number;
12
16
  };
13
17
  export type DrawCardProps = {
14
18
  options: Options;
@@ -16,9 +20,15 @@ export type DrawCardProps = {
16
20
  dateLabel: string;
17
21
  locationLabel: string;
18
22
  isDisabled?: boolean;
23
+ isSelectActive?: boolean;
24
+ isPosition1Winner?: boolean;
25
+ isPosition2Winner?: boolean;
26
+ isScorelessMatch?: boolean;
27
+ position1Team: PositionTeam;
28
+ position2Team: PositionTeam;
19
29
  emptyLabel?: string;
20
30
  onEditClick?: VoidFunction;
21
- onChange?: ({ position, id }: OnChangeArgs) => null;
31
+ onChange: ({ position, id }: OnChangeArgs) => void;
22
32
  };
23
33
  export interface TeamCardProps {
24
34
  title: string;
@@ -18,20 +18,20 @@ const headerRows = [
18
18
  ];
19
19
  const tableRows = [
20
20
  [
21
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
22
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
23
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
24
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
25
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
26
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
27
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
28
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
21
+ React.createElement(DrawCard, Object.assign({ isSelectActive: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
22
+ React.createElement(DrawCard, Object.assign({ isSelectActive: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
23
+ React.createElement(DrawCard, Object.assign({ isSelectActive: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
24
+ React.createElement(DrawCard, Object.assign({ isSelectActive: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
25
+ React.createElement(DrawCard, Object.assign({ isSelectActive: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
26
+ React.createElement(DrawCard, Object.assign({ isSelectActive: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
27
+ React.createElement(DrawCard, Object.assign({ isSelectActive: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
28
+ React.createElement(DrawCard, Object.assign({ isSelectActive: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
29
29
  ],
30
30
  [
31
31
  React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
32
32
  React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
33
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
34
- React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
33
+ React.createElement(DrawCard, Object.assign({ isScorelessMatch: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
34
+ React.createElement(DrawCard, Object.assign({ isScorelessMatch: true, emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
35
35
  ],
36
36
  [
37
37
  React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
@@ -1 +1 @@
1
- {"version":3,"file":"Tables.stories.js","sourceRoot":"","sources":["../../../../src/stories/organisms/Tables/Tables.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,QAAQ,MAAM,gCAAgC,CAAC;AACtD,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C,OAAO,EACL,eAAe,EAAE,gBAAgB,EAAE,eAAe,EAAE,gBAAgB,EACrE,MAAM,YAAY,CAAC;AAEpB,MAAM,qBAAqB,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;AAEvC,UAAU;AACV,eAAe;IACb,KAAK,EAAE,kBAAkB;CAC1B,CAAC;AAEF,YAAY;AACZ,SAAS,qBAAqB,CAAC,IAAwB;IACrD,OAAO,oBAAC,aAAa,oBAAK,IAAI,EAAI,CAAC;AACrC,CAAC;AAED,MAAM,UAAU,GAAG;IACjB,EAAE,IAAI,EAAE,SAAS,EAAE;IACnB,EAAE,IAAI,EAAE,cAAc,EAAE;IACxB,EAAE,IAAI,EAAE,WAAW,EAAE;CACtB,CAAC;AAEF,MAAM,SAAS,GAAG;IAChB;QACI,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;KAChE;IACD;QACI,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;KAChE;IACD;QACI,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;KAChE;IACD;QACI,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;KAChE;CACF,CAAC;AAEF,UAAU;AACV,MAAM,CAAC,MAAM,SAAS,GAAG,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxD,SAAS,CAAC,IAAI,GAAG;IACf,UAAU;IACV,SAAS;CACV,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5D,aAAa,CAAC,IAAI,GAAG;IACnB,SAAS,EAAE,eAAe;IAC1B,SAAS,EAAE,KAAK;IAChB,cAAc,EAAE,QAAQ;IACxB,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,eAAe;IAC1B,YAAY,EAAE,gBAAgB;IAC9B,qBAAqB;CACtB,CAAC"}
1
+ {"version":3,"file":"Tables.stories.js","sourceRoot":"","sources":["../../../../src/stories/organisms/Tables/Tables.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,QAAQ,MAAM,gCAAgC,CAAC;AACtD,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C,OAAO,EACL,eAAe,EAAE,gBAAgB,EAAE,eAAe,EAAE,gBAAgB,EACrE,MAAM,YAAY,CAAC;AAEpB,MAAM,qBAAqB,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;AAEvC,UAAU;AACV,eAAe;IACb,KAAK,EAAE,kBAAkB;CAC1B,CAAC;AAEF,YAAY;AACZ,SAAS,qBAAqB,CAAC,IAAwB;IACrD,OAAO,oBAAC,aAAa,oBAAK,IAAI,EAAI,CAAC;AACrC,CAAC;AAED,MAAM,UAAU,GAAG;IACjB,EAAE,IAAI,EAAE,SAAS,EAAE;IACnB,EAAE,IAAI,EAAE,cAAc,EAAE;IACxB,EAAE,IAAI,EAAE,WAAW,EAAE;CACtB,CAAC;AAEF,MAAM,SAAS,GAAG;IAChB;QACI,oBAAC,QAAQ,kBAAC,cAAc,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC5E,oBAAC,QAAQ,kBAAC,cAAc,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC5E,oBAAC,QAAQ,kBAAC,cAAc,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC5E,oBAAC,QAAQ,kBAAC,cAAc,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC5E,oBAAC,QAAQ,kBAAC,cAAc,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC5E,oBAAC,QAAQ,kBAAC,cAAc,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC5E,oBAAC,QAAQ,kBAAC,cAAc,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC5E,oBAAC,QAAQ,kBAAC,cAAc,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;KAC/E;IACD;QACI,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,gBAAgB,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC9E,oBAAC,QAAQ,kBAAC,gBAAgB,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;KACjF;IACD;QACI,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QAC7D,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;KAChE;IACD;QACI,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;KAChE;CACF,CAAC;AAEF,UAAU;AACV,MAAM,CAAC,MAAM,SAAS,GAAG,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxD,SAAS,CAAC,IAAI,GAAG;IACf,UAAU;IACV,SAAS;CACV,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5D,aAAa,CAAC,IAAI,GAAG;IACnB,SAAS,EAAE,eAAe;IAC1B,SAAS,EAAE,KAAK;IAChB,cAAc,EAAE,QAAQ;IACxB,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,eAAe;IAC1B,YAAY,EAAE,gBAAgB;IAC9B,qBAAqB;CACtB,CAAC"}
@@ -8,6 +8,10 @@ interface RowProps {
8
8
  rowData: RowData;
9
9
  labelId: string;
10
10
  }
11
+ type OnChangeArgs = {
12
+ position: number;
13
+ id: string | null;
14
+ };
11
15
  export declare const mockRowComponent: ({ rowData, labelId }: RowProps) => JSX.Element;
12
16
  export declare const MOCK_HEAD_CELLS: {
13
17
  id: string;
@@ -29,7 +33,18 @@ export declare const SAMPLE_CARD_DATA: {
29
33
  optionOne: number;
30
34
  optionTwo: number;
31
35
  };
36
+ onChange: ({ position, id }: OnChangeArgs) => void;
32
37
  dateLabel: string;
33
38
  locationLabel: string;
39
+ isPosition1Winner: boolean;
40
+ isPosition2Winner: boolean;
41
+ position1Team: {
42
+ name: string;
43
+ points: number;
44
+ };
45
+ position2Team: {
46
+ name: string;
47
+ points: number;
48
+ };
34
49
  };
35
50
  export {};
@@ -62,7 +62,18 @@ export const SAMPLE_CARD_DATA = {
62
62
  optionOne: 1,
63
63
  optionTwo: 2,
64
64
  },
65
+ onChange: ({ position, id }) => { },
65
66
  dateLabel: 'Dec 20 at 9:00am',
66
67
  locationLabel: 'Taube Tennis Center',
68
+ isPosition1Winner: true,
69
+ isPosition2Winner: false,
70
+ position1Team: {
71
+ name: 'Apples',
72
+ points: 10,
73
+ },
74
+ position2Team: {
75
+ name: 'Pears',
76
+ points: 4,
77
+ }
67
78
  };
68
79
  //# sourceMappingURL=mockData.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"mockData.js","sourceRoot":"","sources":["../../../../src/stories/organisms/Tables/mockData.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAahE,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,OAAO,EAAE,OAAO,EAAY,EAAE,EAAE;IACjE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC;IAC1C,OAAO,CACH,oBAAC,QAAQ;QACL,oBAAC,SAAS,IACN,SAAS,EAAC,IAAI,EACd,EAAE,EAAE,OAAO,EACX,KAAK,EAAC,KAAK,EACX,OAAO,EAAC,QAAQ;YAEhB,oBAAC,UAAU,QAAE,MAAM,CAAc,CACzB;QACZ,oBAAC,SAAS,IAAC,KAAK,EAAC,MAAM;YACnB,oBAAC,UAAU,QAAE,IAAI,CAAc,CACvB;QACZ,oBAAC,SAAS,IAAC,KAAK,EAAC,MAAM;YACnB,oBAAC,UAAU,QAAE,OAAO,CAAc,CAC1B,CACL,CAEd,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,KAAK,EAAE;IAChE,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,iBAAiB,EAAE,IAAI,EAAE;IAC3D,EAAE,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,KAAK,EAAE;CAAC,CAAC;AAEjE,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,YAAY;QACpB,IAAI,EAAE,WAAW;QACjB,OAAO,EAAE,eAAe;KACzB;IACD;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,aAAa;QACrB,IAAI,EAAE,gBAAgB;QACtB,OAAO,EAAE,eAAe;KACzB;IACD;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,YAAY;QACpB,IAAI,EAAE,YAAY;QAClB,OAAO,EAAE,kBAAkB;KAC5B;IACD;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,cAAc;QACtB,IAAI,EAAE,OAAO;QACb,OAAO,EAAE,mBAAmB;KAC7B;IACD;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,eAAe;QACvB,IAAI,EAAE,eAAe;QACrB,OAAO,EAAE,mBAAmB;KAC7B;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,OAAO,EAAE;QACP;YACE,EAAE,EAAE,CAAC;YACL,KAAK,EAAE,QAAQ;SAChB;QACD;YACE,EAAE,EAAE,CAAC;YACL,KAAK,EAAE,QAAQ;SAChB;KACF;IACD,eAAe,EAAE;QACf,SAAS,EAAE,CAAC;QACZ,SAAS,EAAE,CAAC;KACb;IACD,SAAS,EAAE,kBAAkB;IAC7B,aAAa,EAAE,qBAAqB;CACrC,CAAC"}
1
+ {"version":3,"file":"mockData.js","sourceRoot":"","sources":["../../../../src/stories/organisms/Tables/mockData.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAkBhE,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,OAAO,EAAE,OAAO,EAAY,EAAE,EAAE;IACjE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC;IAC1C,OAAO,CACH,oBAAC,QAAQ;QACL,oBAAC,SAAS,IACN,SAAS,EAAC,IAAI,EACd,EAAE,EAAE,OAAO,EACX,KAAK,EAAC,KAAK,EACX,OAAO,EAAC,QAAQ;YAEhB,oBAAC,UAAU,QAAE,MAAM,CAAc,CACzB;QACZ,oBAAC,SAAS,IAAC,KAAK,EAAC,MAAM;YACnB,oBAAC,UAAU,QAAE,IAAI,CAAc,CACvB;QACZ,oBAAC,SAAS,IAAC,KAAK,EAAC,MAAM;YACnB,oBAAC,UAAU,QAAE,OAAO,CAAc,CAC1B,CACL,CAEd,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,KAAK,EAAE;IAChE,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,iBAAiB,EAAE,IAAI,EAAE;IAC3D,EAAE,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,KAAK,EAAE;CAAC,CAAC;AAEjE,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,YAAY;QACpB,IAAI,EAAE,WAAW;QACjB,OAAO,EAAE,eAAe;KACzB;IACD;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,aAAa;QACrB,IAAI,EAAE,gBAAgB;QACtB,OAAO,EAAE,eAAe;KACzB;IACD;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,YAAY;QACpB,IAAI,EAAE,YAAY;QAClB,OAAO,EAAE,kBAAkB;KAC5B;IACD;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,cAAc;QACtB,IAAI,EAAE,OAAO;QACb,OAAO,EAAE,mBAAmB;KAC7B;IACD;QACE,EAAE,EAAE,CAAC;QACL,MAAM,EAAE,eAAe;QACvB,IAAI,EAAE,eAAe;QACrB,OAAO,EAAE,mBAAmB;KAC7B;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,OAAO,EAAE;QACP;YACE,EAAE,EAAE,CAAC;YACL,KAAK,EAAE,QAAQ;SAChB;QACD;YACE,EAAE,EAAE,CAAC;YACL,KAAK,EAAE,QAAQ;SAChB;KACF;IACD,eAAe,EAAE;QACf,SAAS,EAAE,CAAC;QACZ,SAAS,EAAE,CAAC;KACb;IACD,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAgB,EAAE,EAAE,GAAE,CAAC;IAChD,SAAS,EAAE,kBAAkB;IAC7B,aAAa,EAAE,qBAAqB;IACpC,iBAAiB,EAAE,IAAI;IACvB,iBAAiB,EAAE,KAAK;IACxB,aAAa,EAAE;QACb,IAAI,EAAE,QAAQ;QACd,MAAM,EAAE,EAAE;KACX;IACD,aAAa,EAAE;QACb,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,CAAC;KACV;CACF,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@universal-tennis/ui-shared",
3
- "version": "0.1.14",
3
+ "version": "0.1.16",
4
4
  "main": "dist/items.js",
5
5
  "license": "MIT",
6
6
  "homepage": "https://universaltennis.com",
@@ -3,7 +3,9 @@ import Box from '@mui/material/Box';
3
3
  import { styled } from '@mui/material/styles';
4
4
  import Select, { SelectChangeEvent } from '@mui/material/Select';
5
5
  import MenuItem from '@mui/material/MenuItem';
6
- import { FormControl, InputLabel } from '@mui/material';
6
+ import { Divider, FormControl, InputLabel } from '@mui/material';
7
+ import HighlightOffIcon from '@mui/icons-material/HighlightOff';
8
+ import IconButton from '@mui/material/IconButton';
7
9
  import Button from '../../atoms/Button/Button';
8
10
  import Typography, { SECONDARY_SIZES_ENUM, CATEGORY_ENUM } from '../../atoms/Typography/Typography';
9
11
  import { DrawCardProps } from "./sharedTypes";
@@ -21,10 +23,6 @@ const StyledCard = styled(Box)({
21
23
  },
22
24
  });
23
25
 
24
- const StyledMuiSelect = styled(Select)({
25
- border: '1px solid var(--cool-grey-600)',
26
- });
27
-
28
26
  const BottomGrid = styled(Box)({
29
27
  display: 'flex',
30
28
  alignItems: 'center',
@@ -32,17 +30,19 @@ const BottomGrid = styled(Box)({
32
30
  paddingTop: '32px',
33
31
  });
34
32
 
35
- const Positions = {
36
- ONE: '1',
37
- TWO: '2',
33
+ const positions = {
34
+ ONE: 1,
35
+ TWO: 2,
38
36
  };
39
37
 
40
38
  export default function DrawCard({
41
- options, onChange, onEditClick, selectedOptions, dateLabel, locationLabel, emptyLabel, isDisabled, ...props
39
+ options, onChange, onEditClick, selectedOptions, dateLabel, locationLabel,
40
+ emptyLabel, isDisabled, isSelectActive, isPosition1Winner, isPosition2Winner,
41
+ isScorelessMatch, position1Team, position2Team, ...props
42
42
  }: DrawCardProps) {
43
43
  const { optionOne, optionTwo } = selectedOptions || {};
44
44
 
45
- const handleOnSelectionChange = (event: SelectChangeEvent<unknown>, position: string) => {
45
+ const handleOnSelectionChange = (event: SelectChangeEvent<unknown>, position: number) => {
46
46
  const id = event.target.value as string;
47
47
 
48
48
  if (onChange) {
@@ -54,34 +54,73 @@ export default function DrawCard({
54
54
  <StyledCard
55
55
  {...props}
56
56
  >
57
- <FormControl>
58
- <InputLabel id="draw-card-select-top">{emptyLabel}</InputLabel>
59
- <StyledMuiSelect
60
- labelId="draw-card-select-top"
61
- id="draw-card-select-top"
62
- value={optionOne}
63
- disabled={isDisabled}
64
- onChange={(e) => handleOnSelectionChange(e, Positions.ONE)}
65
- >
66
- {options.map((option) => <MenuItem key={option.id} value={option.id}>{option.label}</MenuItem>)}
67
- <MenuItem sx={{ borderTop: '1px solid var(--cool-grey-500)' }} value="bye">Set bye</MenuItem>
68
- </StyledMuiSelect>
69
- </FormControl>
70
57
 
71
- <Box pt={1} />
72
- <FormControl>
73
- <InputLabel id="draw-card-select-bot">{emptyLabel}</InputLabel>
74
- <StyledMuiSelect
75
- labelId="draw-card-select-bot"
76
- id="draw-card-select-bot"
77
- value={optionTwo}
78
- disabled={isDisabled}
79
- onChange={(e) => handleOnSelectionChange(e, Positions.TWO)}
80
- >
81
- {options.map((option) => <MenuItem key={option.id} value={option.id}>{option.label}</MenuItem>)}
82
- <MenuItem sx={{ borderTop: '1px solid var(--cool-grey-500)' }} value="bye">Set bye</MenuItem>
83
- </StyledMuiSelect>
84
- </FormControl>
58
+ {isSelectActive ? (
59
+ <>
60
+ <FormControl style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
61
+ <InputLabel id="draw-card-select-top">{emptyLabel}</InputLabel>
62
+ <Select
63
+ sx={{ width: '100%' }}
64
+ labelId="draw-card-select-top"
65
+ id="draw-card-select-top"
66
+ label={emptyLabel}
67
+ value={optionOne}
68
+ disabled={isDisabled}
69
+ onChange={(e) => handleOnSelectionChange(e, positions.ONE)}
70
+ >
71
+ {options.map((option) => <MenuItem key={option.id} value={option.id}>{option.label}</MenuItem>)}
72
+ <MenuItem sx={{ borderTop: '1px solid var(--cool-grey-500)' }} value="bye">Set bye</MenuItem>
73
+ </Select>
74
+ <IconButton onClick={() => onChange({ position: positions.ONE, id: null })} sx={{ marginLeft: '8px' }} size="small">
75
+ <HighlightOffIcon sx={{ fontSize: '16px' }} />
76
+ </IconButton>
77
+ </FormControl>
78
+
79
+ <Box pt={2} />
80
+ <FormControl style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
81
+ <InputLabel id="draw-card-select-bot">{emptyLabel}</InputLabel>
82
+ <Select
83
+ sx={{ width: '100%' }}
84
+ labelId="draw-card-select-bot"
85
+ id="draw-card-select-bot"
86
+ label={emptyLabel}
87
+ value={optionTwo}
88
+ disabled={isDisabled}
89
+ onChange={(e) => handleOnSelectionChange(e, positions.TWO)}
90
+ >
91
+ {options.map((option) => <MenuItem key={option.id} value={option.id}>{option.label}</MenuItem>)}
92
+ <MenuItem sx={{ borderTop: '1px solid var(--cool-grey-500)' }} value="bye">Set bye</MenuItem>
93
+ </Select>
94
+ <IconButton onClick={() => onChange({ position: positions.TWO, id: null })} sx={{ marginLeft: '8px' }} size="small">
95
+ <HighlightOffIcon sx={{ fontSize: '16px' }} />
96
+ </IconButton>
97
+ </FormControl>
98
+ </>
99
+ ) : (
100
+ <>
101
+ <Box display="flex" justifyContent="space-between">
102
+ <Typography
103
+ category="secondary"
104
+ size={isPosition1Winner ? 'medium-medium' : "medium-book"}
105
+ >
106
+ {position1Team?.name}
107
+ </Typography>
108
+ <Typography category="secondary" size={isPosition1Winner ? 'medium-medium' : "medium-book"}>
109
+ {isScorelessMatch ? '-' : position1Team?.points}
110
+ </Typography>
111
+ </Box>
112
+ <Divider sx={{ my: 2 }} />
113
+ <Box display="flex" justifyContent="space-between">
114
+ <Typography category="secondary" size={isPosition2Winner ? 'medium-medium' : "medium-book"}>
115
+ {position2Team?.name}
116
+ </Typography>
117
+ <Typography category="secondary" size={isPosition2Winner ? 'medium-medium' : "medium-book"}>
118
+ {isScorelessMatch ? '-' : position2Team?.points}
119
+ </Typography>
120
+ </Box>
121
+ </>
122
+ )}
123
+
85
124
  <BottomGrid>
86
125
 
87
126
  <Box>
@@ -11,8 +11,13 @@ type Options = {
11
11
  }[];
12
12
 
13
13
  type OnChangeArgs = {
14
- position: string;
15
- id: string;
14
+ position: number;
15
+ id: string | null;
16
+ }
17
+
18
+ type PositionTeam = {
19
+ name: string;
20
+ points: number;
16
21
  }
17
22
 
18
23
  export type DrawCardProps = {
@@ -21,9 +26,15 @@ export type DrawCardProps = {
21
26
  dateLabel: string;
22
27
  locationLabel: string;
23
28
  isDisabled?: boolean;
29
+ isSelectActive?: boolean;
30
+ isPosition1Winner?: boolean;
31
+ isPosition2Winner?: boolean;
32
+ isScorelessMatch?: boolean;
33
+ position1Team: PositionTeam;
34
+ position2Team: PositionTeam;
24
35
  emptyLabel?: string;
25
36
  onEditClick?: VoidFunction;
26
- onChange?: ({ position, id }: OnChangeArgs) => null;
37
+ onChange: ({ position, id }: OnChangeArgs) => void;
27
38
  }
28
39
 
29
40
  export interface TeamCardProps {
@@ -26,20 +26,20 @@ const headerRows = [
26
26
 
27
27
  const tableRows = [
28
28
  [
29
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
30
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
31
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
32
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
33
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
34
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
35
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
36
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
29
+ <DrawCard isSelectActive emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
30
+ <DrawCard isSelectActive emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
31
+ <DrawCard isSelectActive emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
32
+ <DrawCard isSelectActive emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
33
+ <DrawCard isSelectActive emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
34
+ <DrawCard isSelectActive emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
35
+ <DrawCard isSelectActive emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
36
+ <DrawCard isSelectActive emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
37
37
  ],
38
38
  [
39
39
  <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
40
40
  <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
41
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
42
- <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
41
+ <DrawCard isScorelessMatch emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
42
+ <DrawCard isScorelessMatch emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
43
43
  ],
44
44
  [
45
45
  <DrawCard emptyLabel="Select a team" {...SAMPLE_CARD_DATA} />,
@@ -11,6 +11,11 @@ interface RowProps {
11
11
  rowData: RowData,
12
12
  labelId: string;
13
13
  }
14
+
15
+ type OnChangeArgs = {
16
+ position: number;
17
+ id: string | null;
18
+ }
14
19
 
15
20
  export const mockRowComponent = ({ rowData, labelId }: RowProps) => {
16
21
  const { player, session, team } = rowData;
@@ -88,6 +93,17 @@ export const SAMPLE_CARD_DATA = {
88
93
  optionOne: 1,
89
94
  optionTwo: 2,
90
95
  },
96
+ onChange: ({ position, id }: OnChangeArgs) => {},
91
97
  dateLabel: 'Dec 20 at 9:00am',
92
98
  locationLabel: 'Taube Tennis Center',
99
+ isPosition1Winner: true,
100
+ isPosition2Winner: false,
101
+ position1Team: {
102
+ name: 'Apples',
103
+ points: 10,
104
+ },
105
+ position2Team: {
106
+ name: 'Pears',
107
+ points: 4,
108
+ }
93
109
  };