npm - @universal-tennis/ui-shared - Versions diffs - 0.1.55 → 0.1.56 - Mend

@universal-tennis/ui-shared 0.1.55 → 0.1.56

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 (33) hide show

package/dist/components.d.ts CHANGED Viewed

@@ -17,11 +17,14 @@ export { default as SessionIcon } from "./stories/atoms/Icons/SessionIcon";
 export { default as SwapIcon } from "./stories/atoms/Icons/SwapIcon";
 export { default as VisibilityIcon } from "./stories/atoms/Icons/VisibilityIcon";
 export { default as VisibilityOffIcon } from "./stories/atoms/Icons/VisibilityOffIcon";
+export { default as WinnerIndicatorIcon } from "./stories/atoms/Icons/WinnerIndicatorIcon";
 export { default as AvatarWithName } from "./stories/molecules/AvatarWithName/AvatarWithName";
 export { default as ContactCard } from "./stories/molecules/Cards/ContactCard";
 export { default as DrawCard } from "./stories/molecules/Cards/DrawCard";
 export { default as SquareAvatarWithName } from "./stories/molecules/SquareAvatarWithName/SquareAvatarWithName";
 export { default as TeamCard } from "./stories/molecules/Cards/TeamCard";
+export { default as TeamDrawCard } from "./stories/molecules/Cards/TeamDrawCard";
 export { default as DrawCardTable } from "./stories/organisms/Tables/DrawCardTable";
 export { default as FullPageModal } from "./stories/organisms/Modals/FullPageModal";
 export { default as SortableTable } from "./stories/organisms/Tables/SortableTable";
+export { default as TeamDrawCardTable } from "./stories/organisms/Tables/TeamDrawCardTable";

package/dist/components.js CHANGED Viewed

@@ -20,14 +20,17 @@ export { default as SessionIcon } from './stories/atoms/Icons/SessionIcon';
 export { default as SwapIcon } from './stories/atoms/Icons/SwapIcon';
 export { default as VisibilityIcon } from './stories/atoms/Icons/VisibilityIcon';
 export { default as VisibilityOffIcon } from './stories/atoms/Icons/VisibilityOffIcon';
+export { default as WinnerIndicatorIcon } from './stories/atoms/Icons/WinnerIndicatorIcon';
 // MOLECULES
 export { default as AvatarWithName } from './stories/molecules/AvatarWithName/AvatarWithName';
 export { default as ContactCard } from './stories/molecules/Cards/ContactCard';
 export { default as DrawCard } from './stories/molecules/Cards/DrawCard';
 export { default as SquareAvatarWithName } from './stories/molecules/SquareAvatarWithName/SquareAvatarWithName';
 export { default as TeamCard } from './stories/molecules/Cards/TeamCard';
+export { default as TeamDrawCard } from './stories/molecules/Cards/TeamDrawCard';
 // ORGANISMS
 export { default as DrawCardTable } from './stories/organisms/Tables/DrawCardTable';
 export { default as FullPageModal } from './stories/organisms/Modals/FullPageModal';
 export { default as SortableTable } from './stories/organisms/Tables/SortableTable';
+export { default as TeamDrawCardTable } from './stories/organisms/Tables/TeamDrawCardTable';
 //# sourceMappingURL=components.js.map

package/dist/components.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"components.js","sourceRoot":"","sources":["../src/components.jsx"],"names":[],"mappings":"AAAA,OAAO,oCAAoC,CAAC;AAE5C,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAE9E,gBAAgB;AAChB,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,6CAA6C,CAAC;AAC/F,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,0CAA0C,CAAC;AACzF,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,8CAA8C,CAAC;AACjG,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kCAAkC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,sCAAsC,CAAC;AACjF,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yCAAyC,CAAC;~~AAEvF~~,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,mDAAmD,CAAC;AAC9F,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAC/E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,+DAA+D,CAAC;AAChH,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oCAAoC,CAAC;~~AAEzE~~,aAAa;AACb,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC"}
1	+ {"version":3,"file":"components.js","sourceRoot":"","sources":["../src/components.jsx"],"names":[],"mappings":"AAAA,OAAO,oCAAoC,CAAC;AAE5C,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAE9E,gBAAgB;AAChB,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,6CAA6C,CAAC;AAC/F,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,0CAA0C,CAAC;AACzF,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,8CAA8C,CAAC;AACjG,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kCAAkC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,sCAAsC,CAAC;AACjF,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yCAAyC,CAAC;AACvF,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAE3F,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,mDAAmD,CAAC;AAC9F,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAC/E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,+DAA+D,CAAC;AAChH,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAEjF,aAAa;AACb,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,8CAA8C,CAAC"}

package/dist/stories/atoms/Icons/Icons.stories.d.ts CHANGED Viewed

@@ -18,3 +18,4 @@ export declare const Session: any;
 export declare const Swap: any;
 export declare const Visibility: any;
 export declare const VisibilityOff: any;
+export declare const WinnerIndicator: any;

package/dist/stories/atoms/Icons/Icons.stories.js CHANGED Viewed

@@ -15,6 +15,7 @@ import SessionIcon from './SessionIcon';
 import SwapIcon from './SwapIcon';
 import VisibilityIcon from './VisibilityIcon';
 import VisibilityOffIcon from './VisibilityOffIcon';
+import WinnerIndicatorIcon from './WinnerIndicatorIcon';
 // Default
 export default {
     title: 'Atoms/Icons',
@@ -68,6 +69,9 @@ function VisibilityIconTemplate(args) {
 function VisibilityOffIconTemplate(args) {
     return React.createElement(VisibilityOffIcon, Object.assign({}, args));
 }
+function WinnerIndicatorIconTemplate(args) {
+    return React.createElement(WinnerIndicatorIcon, Object.assign({}, args));
+}
 // Stories
 export const Add = AddIconTemplate.bind({});
 Add.args = {
@@ -149,4 +153,8 @@ VisibilityOff.args = {
     size: 150,
     color: 'black'
 };
+export const WinnerIndicator = WinnerIndicatorIconTemplate.bind({});
+WinnerIndicator.args = {
+    isBlack: true
+};
 //# sourceMappingURL=Icons.stories.js.map

package/dist/stories/atoms/Icons/Icons.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Icons.stories.js","sourceRoot":"","sources":["../../../../src/stories/atoms/Icons/Icons.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,OAAO,MAAM,WAAW,CAAC;AAChC,OAAO,qBAAqB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AACtD,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;AACxD,OAAO,sBAAsB,MAAM,0BAA0B,CAAC;AAC9D,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,SAAS,MAAM,aAAa,CAAC;AACpC,OAAO,SAAS,MAAM,aAAa,CAAC;AACpC,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;~~AAGpD~~,UAAU;AACV,eAAe;IACb,KAAK,EAAE,aAAa;CACrB,CAAC;AAEF,YAAY;AACZ,SAAS,eAAe,CAAC,IAAe;IACtC,OAAO,oBAAC,OAAO,oBAAK,IAAI,EAAI,CAAC;AAC/B,CAAC;AAED,SAAS,6BAA6B,CAAC,IAAe;IACpD,OAAO,oBAAC,qBAAqB,oBAAK,IAAI,EAAI,CAAC;AAC7C,CAAC;AAED,SAAS,0BAA0B,CAAC,IAAe;IACjD,OAAO,oBAAC,kBAAkB,oBAAK,IAAI,EAAI,CAAC;AAC1C,CAAC;AAED,SAAS,2BAA2B,CAAC,IAAe;IAClD,OAAO,oBAAC,mBAAmB,oBAAK,IAAI,EAAI,CAAC;AAC3C,CAAC;AAED,SAAS,8BAA8B,CAAC,IAAe;IACrD,OAAO,oBAAC,sBAAsB,oBAAK,IAAI,EAAI,CAAC;AAC9C,CAAC;AAED,SAAS,oBAAoB,CAAC,IAAe;IAC3C,OAAO,oBAAC,YAAY,oBAAK,IAAI,EAAI,CAAC;AACpC,CAAC;AAED,SAAS,iBAAiB,CAAC,IAAe;IACxC,OAAO,oBAAC,SAAS,oBAAK,IAAI,EAAI,CAAC;AACjC,CAAC;AAED,SAAS,iBAAiB,CAAC,IAAe;IACxC,OAAO,oBAAC,SAAS,oBAAK,IAAI,EAAI,CAAC;AACjC,CAAC;AAED,SAAS,kBAAkB,CAAC,IAAe;IACzC,OAAO,oBAAC,UAAU,oBAAK,IAAI,EAAI,CAAC;AAClC,CAAC;AAED,SAAS,gBAAgB,CAAC,IAAe;IACvC,OAAO,oBAAC,QAAQ,oBAAK,IAAI,EAAI,CAAC;AAChC,CAAC;AAED,SAAS,oBAAoB,CAAC,IAAe;IAC3C,OAAO,oBAAC,YAAY,oBAAK,IAAI,EAAI,CAAC;AACpC,CAAC;AAED,SAAS,mBAAmB,CAAC,IAAe;IAC1C,OAAO,oBAAC,WAAW,oBAAK,IAAI,EAAI,CAAC;AACnC,CAAC;AAED,SAAS,mBAAmB,CAAC,IAAe;IAC1C,OAAO,oBAAC,WAAW,oBAAK,IAAI,EAAI,CAAC;AACnC,CAAC;AAED,SAAS,gBAAgB,CAAC,IAAe;IACvC,OAAO,oBAAC,QAAQ,oBAAK,IAAI,EAAI,CAAC;AAChC,CAAC;AAED,SAAS,sBAAsB,CAAC,IAAe;IAC7C,OAAO,oBAAC,cAAc,oBAAK,IAAI,EAAI,CAAC;AACtC,CAAC;AAED,SAAS,yBAAyB,CAAC,IAAe;IAChD,OAAO,oBAAC,iBAAiB,oBAAK,IAAI,EAAI,CAAC;AACzC,CAAC;AAED,UAAU;AACV,MAAM,CAAC,MAAM,GAAG,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,GAAG,CAAC,IAAI,GAAG;IACT,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,MAAM;CACd,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,6BAA6B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxE,iBAAiB,CAAC,IAAI,GAAG;IACvB,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,QAAQ;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,0BAA0B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAClE,cAAc,CAAC,IAAI,GAAG;IACpB,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,KAAK;CACb,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,2BAA2B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACpE,eAAe,CAAC,IAAI,GAAG;IACrB,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,8BAA8B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1E,kBAAkB,CAAC,IAAI,GAAG;IACxB,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,oBAAoB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACtD,QAAQ,CAAC,IAAI,GAAG;IACd,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,KAAK,CAAC,IAAI,GAAG;IACX,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,QAAQ;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,KAAK,CAAC,IAAI,GAAG;IACX,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,QAAQ;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,kBAAkB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAClD,MAAM,CAAC,IAAI,GAAG;IACZ,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,QAAQ;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC9C,IAAI,CAAC,IAAI,GAAG;IACV,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,oBAAoB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACtD,QAAQ,CAAC,IAAI,GAAG;IACd,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,MAAM;CACd,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACpD,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,MAAM;CACd,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACpD,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,KAAK;CACb,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC9C,IAAI,CAAC,IAAI,GAAG;IACV,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,MAAM;CACd,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1D,UAAU,CAAC,IAAI,GAAG;IAChB,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,yBAAyB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChE,aAAa,CAAC,IAAI,GAAG;IACnB,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,OAAO;CACf,CAAC"}
1	+ {"version":3,"file":"Icons.stories.js","sourceRoot":"","sources":["../../../../src/stories/atoms/Icons/Icons.stories.tsx"],"names":[],"mappings":"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"}

package/dist/stories/atoms/Icons/WinnerIndicatorIcon.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { WinnerIndicatorIconProps } from './sharedTypes';
+export default function WinnerIndicatorIcon({ sx, isBlack }: WinnerIndicatorIconProps): JSX.Element;

package/dist/stories/atoms/Icons/WinnerIndicatorIcon.js ADDED Viewed

@@ -0,0 +1,32 @@
+import React from 'react';
+import Box from '@mui/material/Box';
+const arrowStyles = {
+    borderTop: '10px solid transparent',
+    borderBottom: '10px solid transparent',
+    borderLeft: '10px solid white',
+    height: 0,
+    width: 0
+};
+const rectangleStyles = {
+    background: 'white',
+    height: 20,
+    width: 3
+};
+const blackArrowStyles = {
+    borderTop: '8px solid transparent',
+    borderBottom: '8px solid transparent',
+    borderLeft: '8px solid black',
+    height: 0,
+    width: 0
+};
+const blackRectangleStyles = {
+    background: 'black',
+    height: 16,
+    width: 3
+};
+export default function WinnerIndicatorIcon({ sx, isBlack }) {
+    return (React.createElement(Box, { sx: sx, display: "flex" },
+        React.createElement(Box, { style: isBlack ? blackRectangleStyles : rectangleStyles }),
+        React.createElement(Box, { style: isBlack ? blackArrowStyles : arrowStyles })));
+}
+//# sourceMappingURL=WinnerIndicatorIcon.js.map

package/dist/stories/atoms/Icons/WinnerIndicatorIcon.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"WinnerIndicatorIcon.js","sourceRoot":"","sources":["../../../../src/stories/atoms/Icons/WinnerIndicatorIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,GAAG,MAAM,mBAAmB,CAAC;AAGpC,MAAM,WAAW,GAAG;IAClB,SAAS,EAAE,wBAAwB;IACnC,YAAY,EAAE,wBAAwB;IACtC,UAAU,EAAE,kBAAkB;IAC9B,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,CAAC;CACT,CAAC;AACF,MAAM,eAAe,GAAG;IACtB,UAAU,EAAE,OAAO;IACnB,MAAM,EAAE,EAAE;IACV,KAAK,EAAE,CAAC;CACT,CAAC;AAEF,MAAM,gBAAgB,GAAG;IACvB,SAAS,EAAE,uBAAuB;IAClC,YAAY,EAAE,uBAAuB;IACrC,UAAU,EAAE,iBAAiB;IAC7B,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,CAAC;CACT,CAAC;AAEF,MAAM,oBAAoB,GAAG;IAC3B,UAAU,EAAE,OAAO;IACnB,MAAM,EAAE,EAAE;IACV,KAAK,EAAE,CAAC;CACT,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAAE,EAAE,EAAE,OAAO,EAA4B;IACnF,OAAO,CACH,oBAAC,GAAG,IAAC,EAAE,EAAE,EAAE,EAAE,OAAO,EAAC,MAAM;QACvB,oBAAC,GAAG,IAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,eAAe,GAAI;QAChE,oBAAC,GAAG,IAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,WAAW,GAAI,CACtD,CACT,CAAC;AACJ,CAAC"}

package/dist/stories/atoms/Icons/sharedTypes.d.ts CHANGED Viewed

@@ -1,4 +1,9 @@
+import { SxProps } from '@mui/material';
 export interface IconProps {
     size: number;
     color: string;
 }
+export interface WinnerIndicatorIconProps {
+    sx?: SxProps;
+    isBlack?: boolean;
+}

package/dist/stories/molecules/Cards/TeamDrawCard.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { TeamDrawCardProps } from "./sharedTypes";
+export default function TeamDrawCard({ dateLabel, locationLabel, timeLabel, matchInfo, isPosition1Winner, isPosition2Winner, isScorelessMatch, position1Team, position2Team, ...props }: TeamDrawCardProps): JSX.Element;

package/dist/stories/molecules/Cards/TeamDrawCard.js ADDED Viewed

@@ -0,0 +1,94 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+import WinnerIndicatorIcon from 'stories/atoms/Icons/WinnerIndicatorIcon';
+import Typography, { SECONDARY_SIZES_ENUM, CATEGORY_ENUM } from '../../atoms/Typography/Typography';
+import SquareAvatarWithName from '../SquareAvatarWithName/SquareAvatarWithName';
+const StyledCard = styled(Box)({
+    display: 'flex',
+    flexDirection: 'column',
+    borderRadius: '4px',
+    padding: '16px 24px',
+    width: '100%',
+    height: '100px',
+    backgroundColor: 'var(--white)',
+    border: '1px solid var(--cool-grey-600)',
+    marginLeft: '25px',
+    marginRight: '25px',
+    position: 'relative'
+});
+const BottomGrid = styled(Box)({
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    paddingTop: '8px',
+});
+export default function TeamDrawCard(_a) {
+    var { dateLabel, locationLabel, timeLabel, matchInfo, isPosition1Winner, isPosition2Winner, isScorelessMatch, position1Team, position2Team } = _a, props = __rest(_a, ["dateLabel", "locationLabel", "timeLabel", "matchInfo", "isPosition1Winner", "isPosition2Winner", "isScorelessMatch", "position1Team", "position2Team"]);
+    const { MediumMedium, MediumBook, XSmallBook } = SECONDARY_SIZES_ENUM;
+    const { SECONDARY } = CATEGORY_ENUM;
+    return (React.createElement(StyledCard, Object.assign({ className: "team-draw-card" }, props),
+        React.createElement(Box, { display: "flex", justifyContent: "space-between", mb: 0.5 },
+            isPosition1Winner && React.createElement(WinnerIndicatorIcon, { isBlack: true, sx: { position: "absolute", left: 0, top: 20 } }),
+            React.createElement(Box, { display: "flex", alignItems: "center", gap: 0.5 },
+                React.createElement(SquareAvatarWithName, { name: position1Team === null || position1Team === void 0 ? void 0 : position1Team.name, fontSize: isPosition1Winner ? MediumMedium : MediumBook, href: position1Team.href, isBye: !(position1Team === null || position1Team === void 0 ? void 0 : position1Team.name) }),
+                React.createElement(Typography, { category: SECONDARY, size: XSmallBook, color: "var(--cool-grey-600)" },
+                    "(", position1Team === null || position1Team === void 0 ? void 0 :
+                    position1Team.record,
+                    ")")),
+            React.createElement(Typography, { category: SECONDARY, size: isPosition1Winner ? MediumMedium : MediumBook }, isScorelessMatch ? '-' : position1Team === null || position1Team === void 0 ? void 0 : position1Team.points)),
+        React.createElement(Box, { display: "flex", justifyContent: "space-between" },
+            isPosition2Winner && React.createElement(WinnerIndicatorIcon, { isBlack: true, sx: { position: "absolute", left: 0, top: 50 } }),
+            React.createElement(Box, { display: "flex", alignItems: "center", gap: 0.5 },
+                React.createElement(SquareAvatarWithName, { name: position2Team === null || position2Team === void 0 ? void 0 : position2Team.name, fontSize: isPosition2Winner ? MediumMedium : MediumBook, href: position2Team.href, isBye: !(position2Team === null || position2Team === void 0 ? void 0 : position2Team.name) }),
+                React.createElement(Typography, { category: SECONDARY, size: XSmallBook, color: "var(--cool-grey-600)" },
+                    "(", position2Team === null || position2Team === void 0 ? void 0 :
+                    position2Team.record,
+                    ")")),
+            React.createElement(Typography, { category: SECONDARY, size: isPosition2Winner ? MediumMedium : MediumBook }, isScorelessMatch ? '-' : position2Team === null || position2Team === void 0 ? void 0 : position2Team.points)),
+        React.createElement(BottomGrid, null,
+            React.createElement(Box, null,
+                React.createElement(Box, { display: "flex" },
+                    React.createElement(Typography, { style: {
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                            display: '-webkit-box',
+                            WebkitBoxOrient: 'vertical',
+                            WebkitLineClamp: 1,
+                        }, category: SECONDARY, size: XSmallBook }, dateLabel),
+                    React.createElement(Typography, { category: SECONDARY, size: XSmallBook, pl: 0.5, pr: 0.5 }, "\u2022"),
+                    React.createElement(Typography, { style: {
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                            display: '-webkit-box',
+                            WebkitBoxOrient: 'vertical',
+                            WebkitLineClamp: 1,
+                        }, category: SECONDARY, size: XSmallBook }, timeLabel),
+                    React.createElement(Typography, { category: SECONDARY, size: XSmallBook, pl: 0.5, pr: 0.5 }, "\u2022"),
+                    React.createElement(Typography, { style: {
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                            display: '-webkit-box',
+                            WebkitBoxOrient: 'vertical',
+                            WebkitLineClamp: 1,
+                        }, category: SECONDARY, size: XSmallBook }, matchInfo)),
+                React.createElement(Typography, { style: {
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        display: '-webkit-box',
+                        WebkitBoxOrient: 'vertical',
+                        WebkitLineClamp: 1,
+                    }, category: SECONDARY, size: XSmallBook }, locationLabel)))));
+}
+//# sourceMappingURL=TeamDrawCard.js.map

package/dist/stories/molecules/Cards/TeamDrawCard.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TeamDrawCard.js","sourceRoot":"","sources":["../../../../src/stories/molecules/Cards/TeamDrawCard.tsx"],"names":[],"mappings":"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"}

package/dist/stories/molecules/Cards/sharedTypes.d.ts CHANGED Viewed

@@ -13,6 +13,8 @@ type OnChangeArgs = {
 type PositionTeam = {
     name: string;
     points: number;
+    href?: string;
+    record?: number;
 };
 export type DrawCardProps = {
     options: Options;
@@ -33,6 +35,17 @@ export type DrawCardProps = {
     onViewClick?: VoidFunction;
     onChange: ({ position, id }: OnChangeArgs) => void;
 };
+export type TeamDrawCardProps = {
+    dateLabel: string;
+    locationLabel: string;
+    timeLabel: string;
+    matchInfo?: string;
+    isPosition1Winner?: boolean;
+    isPosition2Winner?: boolean;
+    isScorelessMatch?: boolean;
+    position1Team: PositionTeam;
+    position2Team: PositionTeam;
+};
 export interface TeamCardProps {
     title: string;
     description: string;

package/dist/stories/organisms/Tables/Tables.stories.d.ts CHANGED Viewed

@@ -3,4 +3,6 @@ declare const _default: {
 };
 export default _default;
 export declare const DrawTable: any;
+export declare const TeamDrawTable: any;
+export declare const MobileTeamDrawTable: any;
 export declare const SortableTable: any;

package/dist/stories/organisms/Tables/Tables.stories.js CHANGED Viewed

@@ -1,7 +1,9 @@
 import React from 'react';
+import TeamDrawCard from 'stories/molecules/Cards/TeamDrawCard';
 import DrawCard from '../../molecules/Cards/DrawCard';
 import DrawCardTable from './DrawCardTable';
-import { MOCK_HEAD_CELLS, mockRowComponent, MOCK_TABLE_DATA, SAMPLE_CARD_DATA } from './mockData';
+import TeamDrawCardTable from './TeamDrawCardTable';
+import { MOCK_HEAD_CELLS, mockRowComponent, MOCK_TABLE_DATA, SAMPLE_CARD_DATA, SAMPLE_TEAM_PAGE_CARD_DATA } from './mockData';
 const onOrderPropertyChange = () => { };
 // Default
 export default {
@@ -11,6 +13,9 @@ export default {
 function DrawCardTableTemplate(args) {
     return React.createElement(DrawCardTable, Object.assign({}, args));
 }
+function TeamDrawCardTableTemplate(args) {
+    return React.createElement(TeamDrawCardTable, Object.assign({}, args));
+}
 const headerRows = [
     { name: 'Round 1' },
     { name: 'Quarterfinal' },
@@ -41,12 +46,38 @@ const tableRows = [
         React.createElement(DrawCard, Object.assign({ emptyLabel: "Select a team" }, SAMPLE_CARD_DATA)),
     ],
 ];
+const teamTableRows = [
+    [
+        React.createElement(TeamDrawCard, Object.assign({}, SAMPLE_TEAM_PAGE_CARD_DATA)),
+        React.createElement(TeamDrawCard, Object.assign({}, SAMPLE_TEAM_PAGE_CARD_DATA)),
+        React.createElement(TeamDrawCard, Object.assign({ isScorelessMatch: true }, SAMPLE_TEAM_PAGE_CARD_DATA)),
+        React.createElement(TeamDrawCard, Object.assign({ isScorelessMatch: true }, SAMPLE_TEAM_PAGE_CARD_DATA)),
+    ],
+    [
+        React.createElement(TeamDrawCard, Object.assign({}, SAMPLE_TEAM_PAGE_CARD_DATA)),
+        React.createElement(TeamDrawCard, Object.assign({}, SAMPLE_TEAM_PAGE_CARD_DATA)),
+    ],
+    [
+        React.createElement(TeamDrawCard, Object.assign({}, SAMPLE_TEAM_PAGE_CARD_DATA)),
+    ],
+];
 // Stories
 export const DrawTable = DrawCardTableTemplate.bind({});
 DrawTable.args = {
     headerRows,
     tableRows,
 };
+export const TeamDrawTable = TeamDrawCardTableTemplate.bind({});
+TeamDrawTable.args = {
+    headerRows,
+    tableRows: teamTableRows,
+};
+export const MobileTeamDrawTable = TeamDrawCardTableTemplate.bind({});
+MobileTeamDrawTable.args = {
+    headerRows,
+    tableRows: teamTableRows,
+    isMobile: true
+};
 export const SortableTable = DrawCardTableTemplate.bind({});
 SortableTable.args = {
     headCells: MOCK_HEAD_CELLS,

package/dist/stories/organisms/Tables/Tables.stories.js.map CHANGED Viewed

	@@ -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,cAAc,QAAC,WAAW,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QACxF,oBAAC,QAAQ,kBAAC,cAAc,QAAC,WAAW,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,IAAE,aAAa,EAAC,IAAI,IAAG;QAC3G,oBAAC,QAAQ,kBAAC,cAAc,QAAC,WAAW,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QACxF,oBAAC,QAAQ,kBAAC,cAAc,QAAC,WAAW,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,IAAE,aAAa,EAAC,IAAI,IAAG;QAC3G,oBAAC,QAAQ,kBAAC,cAAc,QAAC,WAAW,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QACxF,oBAAC,QAAQ,kBAAC,cAAc,QAAC,WAAW,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;QACxF,oBAAC,QAAQ,kBAAC,cAAc,QAAC,WAAW,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,IAAE,aAAa,EAAC,IAAI,IAAG;QAC3G,oBAAC,QAAQ,kBAAC,cAAc,QAAC,WAAW,QAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,EAAI;KAC3F;IACD;QACI,oBAAC,QAAQ,kBAAC,UAAU,EAAC,eAAe,IAAK,gBAAgB,IAAE,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC,IAAI;QACpF,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"}
1	+ {"version":3,"file":"Tables.stories.js","sourceRoot":"","sources":["../../../../src/stories/organisms/Tables/Tables.stories.tsx"],"names":[],"mappings":"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"}

package/dist/stories/organisms/Tables/TeamDrawCardTable.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DrawCardTableProps } from './sharedTypes';
+export default function TeamDrawCardTable({ headerRows, tableRows, isMobile, ...props }: DrawCardTableProps): JSX.Element | null;

package/dist/stories/organisms/Tables/TeamDrawCardTable.js ADDED Viewed

@@ -0,0 +1,95 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import { styled } from '@mui/material/styles';
+import Grid from '@mui/material/Grid';
+import ArrowForwardIosOutlinedIcon from '@mui/icons-material/ArrowForwardIosOutlined';
+import ArrowBackIosOutlinedIcon from '@mui/icons-material/ArrowBackIosOutlined';
+import Typography from '../../atoms/Typography/Typography';
+const StyledHeader = styled(Grid)({
+    alignItems: 'center',
+    justifyContent: 'center',
+    display: 'flex',
+});
+const StyledGrid = styled(Grid)({
+    '&:nth-last-child(-n+2) .team-draw-card': {
+        '&:before': {
+            position: 'absolute',
+            content: '""',
+            width: '25px',
+            height: '1px',
+            left: 0,
+            top: '50%',
+            backgroundColor: 'var(--cool-grey-600)',
+            transform: 'translateX(-100%)',
+        },
+    },
+    '&:nth-child(-n+2) .team-draw-card': {
+        '&:after': {
+            position: 'absolute',
+            content: '""',
+            width: '25px',
+            height: '1px',
+            right: 0,
+            top: '50%',
+            backgroundColor: 'var(--cool-grey-600)',
+            transform: 'translateX(100%)',
+        },
+    },
+});
+const GridSections = styled(Box)({
+    display: 'flex',
+    alignItems: 'center',
+    paddingTop: '8px',
+    paddingBottom: '8px',
+});
+const TableMobileSection = styled(Grid) `
+  flex-direction: column;
+`;
+export default function TeamDrawCardTable(_a) {
+    var { headerRows, tableRows, isMobile } = _a, props = __rest(_a, ["headerRows", "tableRows", "isMobile"]);
+    const [activeStep, setActiveStep] = React.useState(0);
+    const handleNext = () => {
+        setActiveStep((prevActiveStep) => prevActiveStep + 1);
+    };
+    const handleBack = () => {
+        setActiveStep((prevActiveStep) => prevActiveStep - 1);
+    };
+    if (!headerRows || !tableRows)
+        return null;
+    const totalColumns = Math.floor(12 / headerRows.length);
+    const formatTableRows = tableRows.map((row, index) => {
+        if (index > 2)
+            return; // Table can only support 3 columns
+        const rowSectionsHeight = `${100 / tableRows[index].length}%`;
+        const sectionAmount = tableRows[index].length;
+        return (React.createElement(StyledGrid, { key: index, xs: totalColumns }, [...Array(sectionAmount)].map((section, idx) => (React.createElement(GridSections, { key: idx, sx: { height: rowSectionsHeight } }, row[idx])))));
+    });
+    const formatDesktopRows = (React.createElement(React.Fragment, null,
+        React.createElement(Grid, { container: true, sx: { height: '60px' } }, headerRows.map((row) => (React.createElement(StyledHeader, { key: row.name, xs: totalColumns },
+            React.createElement(Typography, { category: "secondary", size: "small-medium-cap" }, row.name))))),
+        React.createElement(Grid, { container: true }, formatTableRows)));
+    const formatMobileRows = (React.createElement(Box, null,
+        React.createElement(Grid, { container: true, justifyContent: "space-between" },
+            React.createElement(Button, { color: "inherit", disabled: activeStep === 0, onClick: handleBack, sx: { mr: 1, alignSelf: 'flex-start' } },
+                React.createElement(ArrowBackIosOutlinedIcon, null)),
+            React.createElement(StyledHeader, { xs: totalColumns },
+                React.createElement(Typography, { category: "secondary", size: "small-medium-cap" }, headerRows[activeStep].name)),
+            React.createElement(Button, { onClick: handleNext, disabled: activeStep === tableRows.length - 1 },
+                React.createElement(ArrowForwardIosOutlinedIcon, null))),
+        React.createElement(TableMobileSection, { container: true },
+            React.createElement(GridSections, { sx: { display: 'flex', flexDirection: 'column', gap: '10px' } }, tableRows[activeStep]))));
+    return (React.createElement(Box, Object.assign({}, props, { sx: { flexGrow: 1 }, "aria-label": "draw table" }), isMobile ? formatMobileRows : formatDesktopRows));
+}
+//# sourceMappingURL=TeamDrawCardTable.js.map

package/dist/stories/organisms/Tables/TeamDrawCardTable.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TeamDrawCardTable.js","sourceRoot":"","sources":["../../../../src/stories/organisms/Tables/TeamDrawCardTable.tsx"],"names":[],"mappings":"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"}

package/dist/stories/organisms/Tables/mockData.d.ts CHANGED Viewed

@@ -47,4 +47,24 @@ export declare const SAMPLE_CARD_DATA: {
         points: number;
     };
 };
+export declare const SAMPLE_TEAM_PAGE_CARD_DATA: {
+    dateLabel: string;
+    timeLabel: string;
+    locationLabel: string;
+    matchInfo: string;
+    isPosition1Winner: boolean;
+    isPosition2Winner: boolean;
+    position1Team: {
+        name: string;
+        points: number;
+        href: string;
+        record: number;
+    };
+    position2Team: {
+        name: string;
+        points: number;
+        href: string;
+        record: number;
+    };
+};
 export {};

package/dist/stories/organisms/Tables/mockData.js CHANGED Viewed

@@ -76,4 +76,24 @@ export const SAMPLE_CARD_DATA = {
         points: 4,
     }
 };
+export const SAMPLE_TEAM_PAGE_CARD_DATA = {
+    dateLabel: 'Dec 20',
+    timeLabel: '9:00pm',
+    locationLabel: 'Taube Tennis Center',
+    matchInfo: 'Round 1, Match 2',
+    isPosition1Winner: true,
+    isPosition2Winner: false,
+    position1Team: {
+        name: 'Apples',
+        points: 10,
+        href: 'https://www.reddit.com',
+        record: 2
+    },
+    position2Team: {
+        name: 'Pears',
+        points: 4,
+        href: 'https://www.reddit.com',
+        record: 2
+    }
+};
 //# sourceMappingURL=mockData.js.map

package/dist/stories/organisms/Tables/mockData.js.map CHANGED Viewed

	@@ -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;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,GAAG;IAClB,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"}
1	+ {"version":3,"file":"mockData.js","sourceRoot":"","sources":["../../../../src/stories/organisms/Tables/mockData.tsx"],"names":[],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@universal-tennis/ui-shared",
-  "version": "0.1.55",
+  "version": "0.1.56",
   "main": "dist/items.js",
   "license": "MIT",
   "homepage": "https://universaltennis.com",

package/src/components.jsx CHANGED Viewed

@@ -22,6 +22,7 @@ export { default as SessionIcon } from './stories/atoms/Icons/SessionIcon';
 export { default as SwapIcon } from './stories/atoms/Icons/SwapIcon';
 export { default as VisibilityIcon } from './stories/atoms/Icons/VisibilityIcon';
 export { default as VisibilityOffIcon } from './stories/atoms/Icons/VisibilityOffIcon';
+export { default as WinnerIndicatorIcon } from './stories/atoms/Icons/WinnerIndicatorIcon';
 // MOLECULES
 export { default as AvatarWithName } from './stories/molecules/AvatarWithName/AvatarWithName';
@@ -29,8 +30,10 @@ export { default as ContactCard } from './stories/molecules/Cards/ContactCard';
 export { default as DrawCard } from './stories/molecules/Cards/DrawCard';
 export { default as SquareAvatarWithName } from './stories/molecules/SquareAvatarWithName/SquareAvatarWithName';
 export { default as TeamCard } from './stories/molecules/Cards/TeamCard';
+export { default as TeamDrawCard } from './stories/molecules/Cards/TeamDrawCard';
 // ORGANISMS
 export { default as DrawCardTable } from './stories/organisms/Tables/DrawCardTable';
 export { default as FullPageModal } from './stories/organisms/Modals/FullPageModal';
 export { default as SortableTable } from './stories/organisms/Tables/SortableTable';
+export { default as TeamDrawCardTable } from './stories/organisms/Tables/TeamDrawCardTable';

package/src/stories/atoms/Icons/Icons.stories.tsx CHANGED Viewed

@@ -16,7 +16,8 @@ import SessionIcon from './SessionIcon';
 import SwapIcon from './SwapIcon';
 import VisibilityIcon from './VisibilityIcon';
 import VisibilityOffIcon from './VisibilityOffIcon';
-import { IconProps } from './sharedTypes';
+import WinnerIndicatorIcon from './WinnerIndicatorIcon';
+import { IconProps, WinnerIndicatorIconProps } from './sharedTypes';
 // Default
 export default {
@@ -88,6 +89,10 @@ function VisibilityOffIconTemplate(args: IconProps) {
   return <VisibilityOffIcon {...args} />;
 }
+function WinnerIndicatorIconTemplate(args: WinnerIndicatorIconProps) {
+  return <WinnerIndicatorIcon {...args} />;
+}
 // Stories
 export const Add = AddIconTemplate.bind({});
 Add.args = {
@@ -184,3 +189,8 @@ VisibilityOff.args = {
   size: 150,
   color: 'black'
 };
+export const WinnerIndicator = WinnerIndicatorIconTemplate.bind({});
+WinnerIndicator.args = {
+  isBlack: true
+};

package/src/stories/atoms/Icons/WinnerIndicatorIcon.tsx ADDED Viewed

@@ -0,0 +1,39 @@
+import React from 'react';
+import Box from '@mui/material/Box';
+import { WinnerIndicatorIconProps } from './sharedTypes';
+const arrowStyles = {
+  borderTop: '10px solid transparent',
+  borderBottom: '10px solid transparent',
+  borderLeft: '10px solid white',
+  height: 0,
+  width: 0
+};
+const rectangleStyles = {
+  background: 'white',
+  height: 20,
+  width: 3
+};
+const blackArrowStyles = {
+  borderTop: '8px solid transparent',
+  borderBottom: '8px solid transparent',
+  borderLeft: '8px solid black',
+  height: 0,
+  width: 0
+};
+const blackRectangleStyles = {
+  background: 'black',
+  height: 16,
+  width: 3
+};
+export default function WinnerIndicatorIcon({ sx, isBlack }: WinnerIndicatorIconProps) {
+  return (
+      <Box sx={sx} display="flex">
+          <Box style={isBlack ? blackRectangleStyles : rectangleStyles} />
+          <Box style={isBlack ? blackArrowStyles : arrowStyles} />
+      </Box>
+  );
+}

package/src/stories/atoms/Icons/sharedTypes.tsx CHANGED Viewed

@@ -1,4 +1,10 @@
+import { SxProps } from '@mui/material';
 export interface IconProps {
     size: number;
     color: string;
   }
+export interface WinnerIndicatorIconProps {
+  sx?: SxProps;
+  isBlack?: boolean;
+}

package/src/stories/molecules/Cards/TeamDrawCard.tsx ADDED Viewed

@@ -0,0 +1,154 @@
+import React from 'react';
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+import WinnerIndicatorIcon from 'stories/atoms/Icons/WinnerIndicatorIcon';
+import Typography, { SECONDARY_SIZES_ENUM, CATEGORY_ENUM } from '../../atoms/Typography/Typography';
+import SquareAvatarWithName from '../SquareAvatarWithName/SquareAvatarWithName';
+import { TeamDrawCardProps } from "./sharedTypes";
+const StyledCard = styled(Box)({
+  display: 'flex',
+  flexDirection: 'column',
+  borderRadius: '4px',
+  padding: '16px 24px',
+  width: '100%',
+  height: '100px',
+  backgroundColor: 'var(--white)',
+  border: '1px solid var(--cool-grey-600)',
+  marginLeft: '25px',
+  marginRight: '25px',
+  position: 'relative'
+});
+const BottomGrid = styled(Box)({
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'space-between',
+  paddingTop: '8px',
+});
+export default function TeamDrawCard({
+  dateLabel, locationLabel, timeLabel, matchInfo,
+  isPosition1Winner, isPosition2Winner,
+  isScorelessMatch, position1Team, position2Team, ...props
+}: TeamDrawCardProps) {
+  const { MediumMedium, MediumBook, XSmallBook } = SECONDARY_SIZES_ENUM;
+  const { SECONDARY } = CATEGORY_ENUM;
+  return (
+      <StyledCard className="team-draw-card" {...props}>
+          <Box display="flex" justifyContent="space-between" mb={0.5}>
+              {isPosition1Winner && <WinnerIndicatorIcon isBlack sx={{ position: "absolute", left: 0, top: 20 }} />}
+              <Box display="flex" alignItems="center" gap={0.5}>
+                  <SquareAvatarWithName
+                      name={position1Team?.name}
+                      fontSize={isPosition1Winner ? MediumMedium : MediumBook}
+                      href={position1Team.href}
+                      isBye={!position1Team?.name}
+                  />
+                  <Typography category={SECONDARY} size={XSmallBook} color="var(--cool-grey-600)">
+                      (
+                      {position1Team?.record}
+                      )
+                  </Typography>
+              </Box>
+              <Typography category={SECONDARY} size={isPosition1Winner ? MediumMedium : MediumBook}>
+                  {isScorelessMatch ? '-' : position1Team?.points}
+              </Typography>
+          </Box>
+          <Box display="flex" justifyContent="space-between">
+              {isPosition2Winner && <WinnerIndicatorIcon isBlack sx={{ position: "absolute", left: 0, top: 50 }} />}
+              <Box display="flex" alignItems="center" gap={0.5}>
+                  <SquareAvatarWithName
+                      name={position2Team?.name}
+                      fontSize={isPosition2Winner ? MediumMedium : MediumBook}
+                      href={position2Team.href}
+                      isBye={!position2Team?.name}
+                  />
+                  <Typography category={SECONDARY} size={XSmallBook} color="var(--cool-grey-600)">
+                      (
+                      {position2Team?.record}
+                      )
+                  </Typography>
+              </Box>
+              <Typography category={SECONDARY} size={isPosition2Winner ? MediumMedium : MediumBook}>
+                  {isScorelessMatch ? '-' : position2Team?.points}
+              </Typography>
+          </Box>
+          <BottomGrid>
+              <Box>
+                  <Box display="flex">
+                      <Typography
+                          style={{
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                            display: '-webkit-box',
+                            WebkitBoxOrient: 'vertical',
+                            WebkitLineClamp: 1,
+                          }}
+                          category={SECONDARY}
+                          size={XSmallBook}
+                      >
+                          {dateLabel}
+                      </Typography>
+                      <Typography
+                          category={SECONDARY}
+                          size={XSmallBook}
+                          pl={0.5}
+                          pr={0.5}
+                      >
+                          &bull;
+                      </Typography>
+                      <Typography
+                          style={{
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                            display: '-webkit-box',
+                            WebkitBoxOrient: 'vertical',
+                            WebkitLineClamp: 1,
+                          }}
+                          category={SECONDARY}
+                          size={XSmallBook}
+                      >
+                          {timeLabel}
+                      </Typography>
+                      <Typography
+                          category={SECONDARY}
+                          size={XSmallBook}
+                          pl={0.5}
+                          pr={0.5}
+                      >
+                          &bull;
+                      </Typography>
+                      <Typography
+                          style={{
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                            display: '-webkit-box',
+                            WebkitBoxOrient: 'vertical',
+                            WebkitLineClamp: 1,
+                          }}
+                          category={SECONDARY}
+                          size={XSmallBook}
+                      >
+                          {matchInfo}
+                      </Typography>
+                  </Box>
+                  <Typography
+                      style={{
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        display: '-webkit-box',
+                        WebkitBoxOrient: 'vertical',
+                        WebkitLineClamp: 1,
+                      }}
+                      category={SECONDARY}
+                      size={XSmallBook}
+                  >
+                      {locationLabel}
+                  </Typography>
+              </Box>
+          </BottomGrid>
+      </StyledCard>
+  );
+}

package/src/stories/molecules/Cards/sharedTypes.ts CHANGED Viewed

@@ -18,6 +18,8 @@ type OnChangeArgs = {
 type PositionTeam = {
   name: string;
   points: number;
+  href?: string;
+  record?: number;
 }
 export type DrawCardProps = {
@@ -40,6 +42,18 @@ export type DrawCardProps = {
     onChange: ({ position, id }: OnChangeArgs) => void;
   }
+export type TeamDrawCardProps = {
+    dateLabel: string;
+    locationLabel: string;
+    timeLabel: string;
+    matchInfo?: string;
+    isPosition1Winner?: boolean;
+    isPosition2Winner?: boolean;
+    isScorelessMatch?: boolean;
+    position1Team: PositionTeam;
+    position2Team: PositionTeam;
+  }
 export interface TeamCardProps {
     title: string;
     description: string;

package/src/stories/organisms/Tables/Tables.stories.tsx CHANGED Viewed

@@ -1,9 +1,11 @@
 import React from 'react';
+import TeamDrawCard from 'stories/molecules/Cards/TeamDrawCard';
 import DrawCard from '../../molecules/Cards/DrawCard';
 import DrawCardTable from './DrawCardTable';
+import TeamDrawCardTable from './TeamDrawCardTable';
 import { DrawCardTableProps } from './sharedTypes';
 import {
-  MOCK_HEAD_CELLS, mockRowComponent, MOCK_TABLE_DATA, SAMPLE_CARD_DATA
+  MOCK_HEAD_CELLS, mockRowComponent, MOCK_TABLE_DATA, SAMPLE_CARD_DATA, SAMPLE_TEAM_PAGE_CARD_DATA
 } from './mockData';
 const onOrderPropertyChange = () => {};
@@ -18,6 +20,10 @@ function DrawCardTableTemplate(args: DrawCardTableProps) {
   return <DrawCardTable {...args} />;
 }
+function TeamDrawCardTableTemplate(args: DrawCardTableProps) {
+  return <TeamDrawCardTable {...args} />;
+}
 const headerRows = [
   { name: 'Round 1' },
   { name: 'Quarterfinal' },
@@ -50,6 +56,22 @@ const tableRows = [
   ],
 ];
+const teamTableRows = [
+  [
+      <TeamDrawCard {...SAMPLE_TEAM_PAGE_CARD_DATA} />,
+      <TeamDrawCard {...SAMPLE_TEAM_PAGE_CARD_DATA} />,
+      <TeamDrawCard isScorelessMatch {...SAMPLE_TEAM_PAGE_CARD_DATA} />,
+      <TeamDrawCard isScorelessMatch {...SAMPLE_TEAM_PAGE_CARD_DATA} />,
+  ],
+  [
+      <TeamDrawCard {...SAMPLE_TEAM_PAGE_CARD_DATA} />,
+      <TeamDrawCard {...SAMPLE_TEAM_PAGE_CARD_DATA} />,
+  ],
+  [
+      <TeamDrawCard {...SAMPLE_TEAM_PAGE_CARD_DATA} />,
+  ],
+];
 // Stories
 export const DrawTable = DrawCardTableTemplate.bind({});
 DrawTable.args = {
@@ -57,6 +79,19 @@ DrawTable.args = {
   tableRows,
 };
+export const TeamDrawTable = TeamDrawCardTableTemplate.bind({});
+TeamDrawTable.args = {
+  headerRows,
+  tableRows: teamTableRows,
+};
+export const MobileTeamDrawTable = TeamDrawCardTableTemplate.bind({});
+MobileTeamDrawTable.args = {
+  headerRows,
+  tableRows: teamTableRows,
+  isMobile: true
+};
 export const SortableTable = DrawCardTableTemplate.bind({});
 SortableTable.args = {
   headCells: MOCK_HEAD_CELLS,

package/src/stories/organisms/Tables/TeamDrawCardTable.tsx ADDED Viewed

@@ -0,0 +1,137 @@
+import React from 'react';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import { styled } from '@mui/material/styles';
+import Grid from '@mui/material/Grid';
+import ArrowForwardIosOutlinedIcon from '@mui/icons-material/ArrowForwardIosOutlined';
+import ArrowBackIosOutlinedIcon from '@mui/icons-material/ArrowBackIosOutlined';
+import Typography from '../../atoms/Typography/Typography';
+import { DrawCardTableProps } from './sharedTypes';
+const StyledHeader = styled(Grid)({
+  alignItems: 'center',
+  justifyContent: 'center',
+  display: 'flex',
+});
+const StyledGrid = styled(Grid)({
+  '&:nth-last-child(-n+2) .team-draw-card': {
+    '&:before': {
+      position: 'absolute',
+      content: '""',
+      width: '25px',
+      height: '1px',
+      left: 0,
+      top: '50%',
+      backgroundColor: 'var(--cool-grey-600)',
+      transform: 'translateX(-100%)',
+    },
+  },
+  '&:nth-child(-n+2) .team-draw-card': {
+    '&:after': {
+      position: 'absolute',
+      content: '""',
+      width: '25px',
+      height: '1px',
+      right: 0,
+      top: '50%',
+      backgroundColor: 'var(--cool-grey-600)',
+      transform: 'translateX(100%)',
+    },
+  },
+});
+const GridSections = styled(Box)({
+  display: 'flex',
+  alignItems: 'center',
+  paddingTop: '8px',
+  paddingBottom: '8px',
+});
+const TableMobileSection = styled(Grid)`
+  flex-direction: column;
+`;
+export default function TeamDrawCardTable({
+  headerRows,
+  tableRows,
+  isMobile,
+  ...props
+}: DrawCardTableProps) {
+  const [activeStep, setActiveStep] = React.useState(0);
+  const handleNext = () => {
+    setActiveStep((prevActiveStep) => prevActiveStep + 1);
+  };
+  const handleBack = () => {
+    setActiveStep((prevActiveStep) => prevActiveStep - 1);
+  };
+  if (!headerRows || !tableRows) return null;
+  const totalColumns = Math.floor(12 / headerRows.length);
+  const formatTableRows = tableRows.map((row, index) => {
+    if (index > 2) return; // Table can only support 3 columns
+    const rowSectionsHeight = `${100 / tableRows[index].length}%`;
+    const sectionAmount = tableRows[index].length;
+    return (
+        <StyledGrid key={index} xs={totalColumns}>
+            {[...Array(sectionAmount)].map((section, idx) => (
+                <GridSections key={idx} sx={{ height: rowSectionsHeight }}>
+                    {row[idx]}
+                </GridSections>
+            ))}
+        </StyledGrid>
+    );
+  });
+  const formatDesktopRows = (
+      <>
+          <Grid container sx={{ height: '60px' }}>
+              {headerRows.map((row) => (
+                  <StyledHeader key={row.name} xs={totalColumns}>
+                      <Typography category="secondary" size="small-medium-cap">{row.name}</Typography>
+                  </StyledHeader>
+              ))}
+          </Grid>
+          <Grid container>
+              {formatTableRows}
+          </Grid>
+      </>
+  );
+  const formatMobileRows = (
+      <Box>
+          <Grid container justifyContent="space-between">
+              <Button
+                  color="inherit"
+                  disabled={activeStep === 0}
+                  onClick={handleBack}
+                  sx={{ mr: 1, alignSelf: 'flex-start' }}
+              >
+                  <ArrowBackIosOutlinedIcon />
+              </Button>
+              <StyledHeader xs={totalColumns}>
+                  <Typography category="secondary" size="small-medium-cap">{headerRows[activeStep].name}</Typography>
+              </StyledHeader>
+              <Button onClick={handleNext} disabled={activeStep === tableRows.length - 1}>
+                  <ArrowForwardIosOutlinedIcon />
+              </Button>
+          </Grid>
+          <TableMobileSection container>
+              <GridSections sx={{ display: 'flex', flexDirection: 'column', gap: '10px' }}>
+                  {tableRows[activeStep]}
+              </GridSections>
+          </TableMobileSection>
+      </Box>
+  );
+  return (
+      <Box {...props} sx={{ flexGrow: 1 }} aria-label="draw table">
+          {isMobile ? formatMobileRows : formatDesktopRows}
+      </Box>
+  );
+}

package/src/stories/organisms/Tables/mockData.tsx CHANGED Viewed

@@ -107,3 +107,24 @@ export const SAMPLE_CARD_DATA = {
     points: 4,
   }
 };
+export const SAMPLE_TEAM_PAGE_CARD_DATA = {
+  dateLabel: 'Dec 20',
+  timeLabel: '9:00pm',
+  locationLabel: 'Taube Tennis Center',
+  matchInfo: 'Round 1, Match 2',
+  isPosition1Winner: true,
+  isPosition2Winner: false,
+  position1Team: {
+    name: 'Apples',
+    points: 10,
+    href: 'https://www.reddit.com',
+    record: 2
+  },
+  position2Team: {
+    name: 'Pears',
+    points: 4,
+    href: 'https://www.reddit.com',
+    record: 2
+  }
+};