@universal-tennis/ui-shared 0.1.44 → 0.1.45

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 (13) hide show
  1. package/dist/components.d.ts +1 -0
  2. package/dist/components.js +1 -1
  3. package/dist/components.js.map +1 -1
  4. package/dist/stories/molecules/AvatarWithName/AvatarWithName.d.ts +9 -9
  5. package/dist/stories/molecules/AvatarWithName/AvatarWithName.js +4 -4
  6. package/dist/stories/molecules/AvatarWithName/AvatarWithName.js.map +1 -1
  7. package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.d.ts +2 -1
  8. package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.js +10 -19
  9. package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.js.map +1 -1
  10. package/package.json +1 -1
  11. package/src/components.jsx +1 -1
  12. package/src/stories/molecules/AvatarWithName/AvatarWithName.stories.tsx +11 -19
  13. package/src/stories/molecules/AvatarWithName/AvatarWithName.tsx +9 -8
package/dist/components.d.ts CHANGED
@@ -10,6 +10,7 @@ export { default as MessageIcon } from "./stories/atoms/Icons/MessageIcon";
10
10
  export { default as SessionIcon } from "./stories/atoms/Icons/SessionIcon";
11
11
  export { default as SwapIcon } from "./stories/atoms/Icons/SwapIcon";
12
12
  export { default as Map } from "./stories/atoms/Map/Map";
13
+ export { default as AvatarWithName } from "./stories/molecules/AvatarWithName/AvatarWithName";
13
14
  export { default as ContactCard } from "./stories/molecules/Cards/ContactCard";
14
15
  export { default as DrawCard } from "./stories/molecules/Cards/DrawCard";
15
16
  export { default as TeamCard } from "./stories/molecules/Cards/TeamCard";
package/dist/components.js CHANGED
@@ -13,7 +13,7 @@ export { default as SessionIcon } from './stories/atoms/Icons/SessionIcon';
13
13
  export { default as SwapIcon } from './stories/atoms/Icons/SwapIcon';
14
14
  export { default as Map } from './stories/atoms/Map/Map';
15
15
  // MOLECULES
16
- export { default as AvatarWithName } from './stories/molecules/AvatarWithName';
16
+ export { default as AvatarWithName } from './stories/molecules/AvatarWithName/AvatarWithName';
17
17
  export { default as ContactCard } from './stories/molecules/Cards/ContactCard';
18
18
  export { default as DrawCard } from './stories/molecules/Cards/DrawCard';
19
19
  export { default as TeamCard } from './stories/molecules/Cards/TeamCard';
package/dist/components.js.map CHANGED
@@ -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,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAC9E,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,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AACrE,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,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAEzD,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAC/E,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,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,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAC9E,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,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AACrE,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,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAEzD,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,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"}
package/dist/stories/molecules/AvatarWithName/AvatarWithName.d.ts CHANGED
@@ -1,17 +1,17 @@
1
1
  /// <reference types="react" />
2
2
  export interface AvatarWithNameProps {
3
- avatarTypographyCategory: string;
4
- avatarTypographySize: string;
3
+ avatarFontCategory: string;
4
+ avatarFontSize: string;
5
5
  imgSrc: string;
6
6
  playerName: string;
7
- typographyCategory: string;
8
- typographySize: string;
7
+ fontCategory: string;
8
+ fontSize: string;
9
9
  }
10
- export default function AvatarWithName({ imgSrc, playerName, avatarTypographySize, avatarTypographyCategory, typographySize, typographyCategory }: {
10
+ export default function AvatarWithName({ imgSrc, playerName, avatarFontSize, avatarFontCategory, fontSize, fontCategory }: {
11
11
  imgSrc?: string | undefined;
12
12
  playerName?: string | undefined;
13
- avatarTypographySize?: string | undefined;
14
- avatarTypographyCategory?: string | undefined;
15
- typographySize?: string | undefined;
16
- typographyCategory?: string | undefined;
13
+ avatarFontSize?: string | undefined;
14
+ avatarFontCategory?: string | undefined;
15
+ fontSize?: string | undefined;
16
+ fontCategory?: string | undefined;
17
17
  }): JSX.Element;
package/dist/stories/molecules/AvatarWithName/AvatarWithName.js CHANGED
@@ -2,14 +2,14 @@ import React from 'react';
2
2
  import Avatar from '@mui/material/Avatar';
3
3
  import Box from '@mui/material/Box';
4
4
  import Typography from '../../atoms/Typography/Typography';
5
- export default function AvatarWithName({ imgSrc = '', playerName = '', avatarTypographySize = '', avatarTypographyCategory = '', typographySize = '', typographyCategory = '' }) {
5
+ export default function AvatarWithName({ imgSrc = '', playerName = '', avatarFontSize = 'medium-medium', avatarFontCategory = 'primary', fontSize = 'small-medium', fontCategory = 'secondary' }) {
6
6
  const getAcronym = (str) => {
7
7
  const acronym = str === null || str === void 0 ? void 0 : str.split(' ').map((word) => word.charAt(0)).join('');
8
8
  return acronym;
9
9
  };
10
10
  return (React.createElement(Box, { display: "flex", alignItems: "center" },
11
- React.createElement(Avatar, { sx: { bgcolor: 'black', marginRight: '10px' }, src: imgSrc },
12
- React.createElement(Typography, { size: avatarTypographySize, category: avatarTypographyCategory }, getAcronym(playerName))),
13
- React.createElement(Typography, { category: typographyCategory, size: typographySize }, playerName)));
11
+ React.createElement(Avatar, { sx: { backgroundColor: 'var(--black)', marginRight: '10px' }, src: imgSrc },
12
+ React.createElement(Typography, { size: avatarFontSize, category: avatarFontCategory }, getAcronym(playerName))),
13
+ React.createElement(Typography, { category: fontCategory, size: fontSize }, playerName)));
14
14
  }
15
15
  //# sourceMappingURL=AvatarWithName.js.map
package/dist/stories/molecules/AvatarWithName/AvatarWithName.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AvatarWithName.js","sourceRoot":"","sources":["../../../../src/stories/molecules/AvatarWithName/AvatarWithName.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,MAAM,MAAM,sBAAsB,CAAC;AAC1C,OAAO,GAAG,MAAM,mBAAmB,CAAC;AAEpC,OAAO,UAAU,MAAM,mCAAmC,CAAC;AAW3D,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,MAAM,GAAG,EAAE,EAAE,UAAU,GAAG,EAAE,EAAE,oBAAoB,GAAG,EAAE,EAAE,wBAAwB,GAAG,EAAE,EAAE,cAAc,GAAG,EAAE,EAAE,kBAAkB,GAAG,EAAE,EACrI;IACC,MAAM,UAAU,GAAG,CAAC,GAAW,EAAE,EAAE;QACjC,MAAM,OAAO,GAAG,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,KAAK,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;QACvE,OAAO,OAAO,CAAC;IACjB,CAAC,CAAC;IAEF,OAAO,CACH,oBAAC,GAAG,IAAC,OAAO,EAAC,MAAM,EAAC,UAAU,EAAC,QAAQ;QACnC,oBAAC,MAAM,IAAC,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM;YAC9D,oBAAC,UAAU,IAAC,IAAI,EAAE,oBAAoB,EAAE,QAAQ,EAAE,wBAAwB,IAAG,UAAU,CAAC,UAAU,CAAC,CAAc,CAC5G;QACT,oBAAC,UAAU,IAAC,QAAQ,EAAE,kBAAkB,EAAE,IAAI,EAAE,cAAc,IAAG,UAAU,CAAc,CACvF,CACT,CAAC;AACJ,CAAC"}
1
+ {"version":3,"file":"AvatarWithName.js","sourceRoot":"","sources":["../../../../src/stories/molecules/AvatarWithName/AvatarWithName.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,MAAM,MAAM,sBAAsB,CAAC;AAC1C,OAAO,GAAG,MAAM,mBAAmB,CAAC;AAEpC,OAAO,UAAU,MAAM,mCAAmC,CAAC;AAW3D,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,MAAM,GAAG,EAAE,EAAE,UAAU,GAAG,EAAE,EAAE,cAAc,GAAG,eAAe,EAC9D,kBAAkB,GAAG,SAAS,EAAE,QAAQ,GAAG,cAAc,EAAE,YAAY,GAAG,WAAW,EACtF;IACC,MAAM,UAAU,GAAG,CAAC,GAAW,EAAE,EAAE;QACjC,MAAM,OAAO,GAAG,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,KAAK,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;QACvE,OAAO,OAAO,CAAC;IACjB,CAAC,CAAC;IAEF,OAAO,CACH,oBAAC,GAAG,IAAC,OAAO,EAAC,MAAM,EAAC,UAAU,EAAC,QAAQ;QACnC,oBAAC,MAAM,IAAC,EAAE,EAAE,EAAE,eAAe,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM;YAC7E,oBAAC,UAAU,IAAC,IAAI,EAAE,cAAc,EAAE,QAAQ,EAAE,kBAAkB,IAAG,UAAU,CAAC,UAAU,CAAC,CAAc,CAChG;QACT,oBAAC,UAAU,IAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,IAAG,UAAU,CAAc,CAC3E,CACT,CAAC;AACJ,CAAC"}
package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.d.ts CHANGED
@@ -3,6 +3,7 @@ declare const _default: {
3
3
  };
4
4
  export default _default;
5
5
  export declare const Default: any;
6
- export declare const WithImageAndCustomTypography: any;
6
+ export declare const WithImage: any;
7
+ export declare const WithCustomTypography: any;
7
8
  export declare const WithNoImage: any;
8
9
  export declare const WithBrokenImage: any;
package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.js CHANGED
@@ -11,38 +11,29 @@ function AvatarWithNameTemplate(args) {
11
11
  // Stories
12
12
  export const Default = AvatarWithNameTemplate.bind({});
13
13
  Default.args = {
14
- avatarTypographyCategory: '',
15
- avatarTypographySize: "",
16
- imgSrc: '',
17
14
  playerName: "Julia Gulia",
18
- typographyCategory: "",
19
- typographySize: "",
20
15
  };
21
- export const WithImageAndCustomTypography = AvatarWithNameTemplate.bind({});
22
- WithImageAndCustomTypography.args = {
23
- avatarTypographyCategory: '',
24
- avatarTypographySize: "",
16
+ export const WithImage = AvatarWithNameTemplate.bind({});
17
+ WithImage.args = {
25
18
  imgSrc: 'https://ci-cdn.universaltennis.com/v1/player/329903/images/profile/7839bf68-b56f-486a-88ab-a52debbac709.png',
26
19
  playerName: "Julia Gulia",
27
- typographyCategory: "secondary",
28
- typographySize: "small-medium",
20
+ };
21
+ export const WithCustomTypography = AvatarWithNameTemplate.bind({});
22
+ WithCustomTypography.args = {
23
+ playerName: "Julia Gulia",
24
+ avatarFontCategory: "secondary",
25
+ avatarFontSize: "large-medium",
26
+ fontCategory: "primary",
27
+ fontSize: "medium-book"
29
28
  };
30
29
  export const WithNoImage = AvatarWithNameTemplate.bind({});
31
30
  WithNoImage.args = {
32
- avatarTypographyCategory: 'primary',
33
- avatarTypographySize: "medium-medium",
34
31
  imgSrc: '',
35
32
  playerName: "Julia Gulia",
36
- typographyCategory: "secondary",
37
- typographySize: "small-medium",
38
33
  };
39
34
  export const WithBrokenImage = AvatarWithNameTemplate.bind({});
40
35
  WithBrokenImage.args = {
41
- avatarTypographyCategory: 'primary',
42
- avatarTypographySize: "medium-medium",
43
36
  imgSrc: 'https://ci-cdn.universaltennis.com/v1/player/329903/images/profile/7839bf68-b56f-486a-88ab-a52debbac709.pn',
44
37
  playerName: "Julia Gulia",
45
- typographyCategory: "secondary",
46
- typographySize: "small-medium",
47
38
  };
48
39
  //# sourceMappingURL=AvatarWithName.stories.js.map
package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AvatarWithName.stories.js","sourceRoot":"","sources":["../../../../src/stories/molecules/AvatarWithName/AvatarWithName.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,cAAuC,MAAM,kBAAkB,CAAC;AAEvE,UAAU;AACV,eAAe;IACb,KAAK,EAAE,0BAA0B;CAClC,CAAC;AAEF,YAAY;AACZ,SAAS,sBAAsB,CAAC,IAAyB;IACvD,OAAO,oBAAC,cAAc,oBAAK,IAAI,EAAI,CAAC;AACtC,CAAC;AAED,UAAU;AACV,MAAM,CAAC,MAAM,OAAO,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvD,OAAO,CAAC,IAAI,GAAG;IACb,wBAAwB,EAAE,EAAE;IAC5B,oBAAoB,EAAE,EAAE;IACxB,MAAM,EAAE,EAAE;IACV,UAAU,EAAE,aAAa;IACzB,kBAAkB,EAAE,EAAE;IACtB,cAAc,EAAE,EAAE;CACnB,CAAC;AAEF,MAAM,CAAC,MAAM,4BAA4B,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5E,4BAA4B,CAAC,IAAI,GAAG;IAClC,wBAAwB,EAAE,EAAE;IAC5B,oBAAoB,EAAE,EAAE;IACxB,MAAM,EAAE,6GAA6G;IACrH,UAAU,EAAE,aAAa;IACzB,kBAAkB,EAAE,WAAW;IAC/B,cAAc,EAAE,cAAc;CAC/B,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3D,WAAW,CAAC,IAAI,GAAG;IACjB,wBAAwB,EAAE,SAAS;IACnC,oBAAoB,EAAE,eAAe;IACrC,MAAM,EAAE,EAAE;IACV,UAAU,EAAE,aAAa;IACzB,kBAAkB,EAAE,WAAW;IAC/B,cAAc,EAAE,cAAc;CAC/B,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC/D,eAAe,CAAC,IAAI,GAAG;IACrB,wBAAwB,EAAE,SAAS;IACnC,oBAAoB,EAAE,eAAe;IACrC,MAAM,EAAE,4GAA4G;IACpH,UAAU,EAAE,aAAa;IACzB,kBAAkB,EAAE,WAAW;IAC/B,cAAc,EAAE,cAAc;CAC/B,CAAC"}
1
+ {"version":3,"file":"AvatarWithName.stories.js","sourceRoot":"","sources":["../../../../src/stories/molecules/AvatarWithName/AvatarWithName.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,cAAuC,MAAM,kBAAkB,CAAC;AAEvE,UAAU;AACV,eAAe;IACb,KAAK,EAAE,0BAA0B;CAClC,CAAC;AAEF,YAAY;AACZ,SAAS,sBAAsB,CAAC,IAAyB;IACvD,OAAO,oBAAC,cAAc,oBAAK,IAAI,EAAI,CAAC;AACtC,CAAC;AAED,UAAU;AACV,MAAM,CAAC,MAAM,OAAO,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvD,OAAO,CAAC,IAAI,GAAG;IACb,UAAU,EAAE,aAAa;CAC1B,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzD,SAAS,CAAC,IAAI,GAAG;IACf,MAAM,EAAE,6GAA6G;IACrH,UAAU,EAAE,aAAa;CAC1B,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACpE,oBAAoB,CAAC,IAAI,GAAG;IAC1B,UAAU,EAAE,aAAa;IACzB,kBAAkB,EAAE,WAAW;IAC/B,cAAc,EAAE,cAAc;IAC9B,YAAY,EAAE,SAAS;IACvB,QAAQ,EAAE,aAAa;CACxB,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3D,WAAW,CAAC,IAAI,GAAG;IACjB,MAAM,EAAE,EAAE;IACV,UAAU,EAAE,aAAa;CAC1B,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC/D,eAAe,CAAC,IAAI,GAAG;IACrB,MAAM,EAAE,4GAA4G;IACpH,UAAU,EAAE,aAAa;CAC1B,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@universal-tennis/ui-shared",
3
- "version": "0.1.44",
3
+ "version": "0.1.45",
4
4
  "main": "dist/items.js",
5
5
  "license": "MIT",
6
6
  "homepage": "https://universaltennis.com",
package/src/components.jsx CHANGED
@@ -15,7 +15,7 @@ export { default as SwapIcon } from './stories/atoms/Icons/SwapIcon';
15
15
  export { default as Map } from './stories/atoms/Map/Map';
16
16
 
17
17
  // MOLECULES
18
- export { default as AvatarWithName } from './stories/molecules/AvatarWithName';
18
+ export { default as AvatarWithName } from './stories/molecules/AvatarWithName/AvatarWithName';
19
19
  export { default as ContactCard } from './stories/molecules/Cards/ContactCard';
20
20
  export { default as DrawCard } from './stories/molecules/Cards/DrawCard';
21
21
  export { default as TeamCard } from './stories/molecules/Cards/TeamCard';
package/src/stories/molecules/AvatarWithName/AvatarWithName.stories.tsx CHANGED
@@ -15,40 +15,32 @@ function AvatarWithNameTemplate(args: AvatarWithNameProps) {
15
15
  // Stories
16
16
  export const Default = AvatarWithNameTemplate.bind({});
17
17
  Default.args = {
18
- avatarTypographyCategory: '',
19
- avatarTypographySize: "",
20
- imgSrc: '',
21
18
  playerName: "Julia Gulia",
22
- typographyCategory: "",
23
- typographySize: "",
24
19
  };
25
20
 
26
- export const WithImageAndCustomTypography = AvatarWithNameTemplate.bind({});
27
- WithImageAndCustomTypography.args = {
28
- avatarTypographyCategory: '',
29
- avatarTypographySize: "",
21
+ export const WithImage = AvatarWithNameTemplate.bind({});
22
+ WithImage.args = {
30
23
  imgSrc: 'https://ci-cdn.universaltennis.com/v1/player/329903/images/profile/7839bf68-b56f-486a-88ab-a52debbac709.png',
31
24
  playerName: "Julia Gulia",
32
- typographyCategory: "secondary",
33
- typographySize: "small-medium",
25
+ };
26
+
27
+ export const WithCustomTypography = AvatarWithNameTemplate.bind({});
28
+ WithCustomTypography.args = {
29
+ playerName: "Julia Gulia",
30
+ avatarFontCategory: "secondary",
31
+ avatarFontSize: "large-medium",
32
+ fontCategory: "primary",
33
+ fontSize: "medium-book"
34
34
  };
35
35
 
36
36
  export const WithNoImage = AvatarWithNameTemplate.bind({});
37
37
  WithNoImage.args = {
38
- avatarTypographyCategory: 'primary',
39
- avatarTypographySize: "medium-medium",
40
38
  imgSrc: '',
41
39
  playerName: "Julia Gulia",
42
- typographyCategory: "secondary",
43
- typographySize: "small-medium",
44
40
  };
45
41
 
46
42
  export const WithBrokenImage = AvatarWithNameTemplate.bind({});
47
43
  WithBrokenImage.args = {
48
- avatarTypographyCategory: 'primary',
49
- avatarTypographySize: "medium-medium",
50
44
  imgSrc: 'https://ci-cdn.universaltennis.com/v1/player/329903/images/profile/7839bf68-b56f-486a-88ab-a52debbac709.pn',
51
45
  playerName: "Julia Gulia",
52
- typographyCategory: "secondary",
53
- typographySize: "small-medium",
54
46
  };
package/src/stories/molecules/AvatarWithName/AvatarWithName.tsx CHANGED
@@ -6,16 +6,17 @@ import Box from '@mui/material/Box';
6
6
  import Typography from '../../atoms/Typography/Typography';
7
7
 
8
8
  export interface AvatarWithNameProps {
9
- avatarTypographyCategory: string;
10
- avatarTypographySize: string;
9
+ avatarFontCategory: string;
10
+ avatarFontSize: string;
11
11
  imgSrc: string;
12
12
  playerName: string;
13
- typographyCategory: string;
14
- typographySize: string;
13
+ fontCategory: string;
14
+ fontSize: string;
15
15
  }
16
16
 
17
17
  export default function AvatarWithName({
18
- imgSrc = '', playerName = '', avatarTypographySize = '', avatarTypographyCategory = '', typographySize = '', typographyCategory = ''
18
+ imgSrc = '', playerName = '', avatarFontSize = 'medium-medium',
19
+ avatarFontCategory = 'primary', fontSize = 'small-medium', fontCategory = 'secondary'
19
20
  }) {
20
21
  const getAcronym = (str: string) => {
21
22
  const acronym = str?.split(' ').map((word) => word.charAt(0)).join('');
@@ -24,10 +25,10 @@ export default function AvatarWithName({
24
25
 
25
26
  return (
26
27
  <Box display="flex" alignItems="center">
27
- <Avatar sx={{ bgcolor: 'black', marginRight: '10px' }} src={imgSrc}>
28
- <Typography size={avatarTypographySize} category={avatarTypographyCategory}>{getAcronym(playerName)}</Typography>
28
+ <Avatar sx={{ backgroundColor: 'var(--black)', marginRight: '10px' }} src={imgSrc}>
29
+ <Typography size={avatarFontSize} category={avatarFontCategory}>{getAcronym(playerName)}</Typography>
29
30
  </Avatar>
30
- <Typography category={typographyCategory} size={typographySize}>{playerName}</Typography>
31
+ <Typography category={fontCategory} size={fontSize}>{playerName}</Typography>
31
32
  </Box>
32
33
  );
33
34
  }