@universal-tennis/ui-shared 0.1.46 → 0.1.47

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 (8) hide show
  1. package/dist/stories/molecules/AvatarWithName/AvatarWithName.js +5 -1
  2. package/dist/stories/molecules/AvatarWithName/AvatarWithName.js.map +1 -1
  3. package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.d.ts +1 -0
  4. package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.js +5 -0
  5. package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.js.map +1 -1
  6. package/package.json +1 -1
  7. package/src/stories/molecules/AvatarWithName/AvatarWithName.stories.tsx +6 -0
  8. package/src/stories/molecules/AvatarWithName/AvatarWithName.tsx +9 -2
package/dist/stories/molecules/AvatarWithName/AvatarWithName.js CHANGED
@@ -8,6 +8,10 @@ export default function AvatarWithName({ avatarOnly = false, imgSrc = '', player
8
8
  const acronym = str === null || str === void 0 ? void 0 : str.split(' ').map((word) => word.charAt(0)).join('');
9
9
  return acronym;
10
10
  };
11
+ const getTruncatedName = (name) => {
12
+ const maxCharacterLimit = 24;
13
+ return (name.length > maxCharacterLimit ? `${name.slice(0, maxCharacterLimit)}...` : name);
14
+ };
11
15
  const AvatarComponent = (React.createElement(Avatar, { sx: {
12
16
  backgroundColor: 'var(--black)', marginRight: '10px', width: `${avatarWidth}`, height: `${avatarHeight}`
13
17
  }, src: imgSrc },
@@ -15,6 +19,6 @@ export default function AvatarWithName({ avatarOnly = false, imgSrc = '', player
15
19
  return (avatarOnly ? (AvatarComponent) : (React.createElement(Box, { display: "flex", alignItems: "center" },
16
20
  AvatarComponent,
17
21
  href ? (React.createElement(Link, { href: href, sx: { textDecoration: 'none' } },
18
- React.createElement(Typography, { category: fontCategory, size: fontSize }, playerName))) : React.createElement(Typography, { category: fontCategory, size: fontSize }, playerName))));
22
+ React.createElement(Typography, { category: fontCategory, size: fontSize }, getTruncatedName(playerName)))) : React.createElement(Typography, { category: fontCategory, size: fontSize }, getTruncatedName(playerName)))));
19
23
  }
20
24
  //# 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;AACpC,OAAO,IAAI,MAAM,oBAAoB,CAAC;AAEtC,OAAO,UAAU,MAAM,mCAAmC,CAAC;AAe3D,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,UAAU,GAAG,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,UAAU,GAAG,EAAE,EAAE,cAAc,GAAG,eAAe,EAAE,IAAI,GAAG,EAAE,EAC7F,kBAAkB,GAAG,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,YAAY,GAAG,MAAM,EAAE,QAAQ,GAAG,cAAc,EAAE,YAAY,GAAG,WAAW,EACnI;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,MAAM,eAAe,GAAG,CACpB,oBAAC,MAAM,IACH,EAAE,EAAE;YACF,eAAe,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,WAAW,EAAE,EAAE,MAAM,EAAE,GAAG,YAAY,EAAE;SACzG,EACD,GAAG,EAAE,MAAM;QAEX,oBAAC,UAAU,IAAC,IAAI,EAAE,cAAc,EAAE,QAAQ,EAAE,kBAAkB,IAAG,UAAU,CAAC,UAAU,CAAC,CAAc,CAChG,CACZ,CAAC;IAEF,OAAO,CACL,UAAU,CAAC,CAAC,CAAC,CACX,eAAe,CAChB,CAAC,CAAC,CAAC,CACA,oBAAC,GAAG,IAAC,OAAO,EAAC,MAAM,EAAC,UAAU,EAAC,QAAQ;QAClC,eAAe;QACf,IAAI,CAAC,CAAC,CAAC,CACJ,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,MAAM,EAAE;YAC5C,oBAAC,UAAU,IAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,IAAG,UAAU,CAAc,CAC1E,CACV,CAAC,CAAC,CAAC,oBAAC,UAAU,IAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,IAAG,UAAU,CAAc,CAC/E,CACT,CACF,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;AACpC,OAAO,IAAI,MAAM,oBAAoB,CAAC;AAEtC,OAAO,UAAU,MAAM,mCAAmC,CAAC;AAe3D,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,UAAU,GAAG,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,UAAU,GAAG,EAAE,EAAE,cAAc,GAAG,eAAe,EAAE,IAAI,GAAG,EAAE,EAC7F,kBAAkB,GAAG,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,YAAY,GAAG,MAAM,EAAE,QAAQ,GAAG,cAAc,EAAE,YAAY,GAAG,WAAW,EACnI;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,MAAM,gBAAgB,GAAG,CAAC,IAAW,EAAE,EAAE;QACvC,MAAM,iBAAiB,GAAG,EAAE,CAAC;QAC7B,OAAO,CACL,IAAI,CAAC,MAAM,GAAG,iBAAiB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,iBAAiB,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAClF,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CACpB,oBAAC,MAAM,IACH,EAAE,EAAE;YACF,eAAe,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,WAAW,EAAE,EAAE,MAAM,EAAE,GAAG,YAAY,EAAE;SACzG,EACD,GAAG,EAAE,MAAM;QAEX,oBAAC,UAAU,IAAC,IAAI,EAAE,cAAc,EAAE,QAAQ,EAAE,kBAAkB,IAAG,UAAU,CAAC,UAAU,CAAC,CAAc,CAChG,CACZ,CAAC;IAEF,OAAO,CACL,UAAU,CAAC,CAAC,CAAC,CACX,eAAe,CAChB,CAAC,CAAC,CAAC,CACA,oBAAC,GAAG,IAAC,OAAO,EAAC,MAAM,EAAC,UAAU,EAAC,QAAQ;QAClC,eAAe;QACf,IAAI,CAAC,CAAC,CAAC,CACJ,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,MAAM,EAAE;YAC5C,oBAAC,UAAU,IAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,IAAG,gBAAgB,CAAC,UAAU,CAAC,CAAc,CAC5F,CACV,CAAC,CAAC,CAAC,oBAAC,UAAU,IAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,IAAG,gBAAgB,CAAC,UAAU,CAAC,CAAc,CACjG,CACT,CACF,CAAC;AACJ,CAAC"}
package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.d.ts CHANGED
@@ -10,3 +10,4 @@ export declare const WithAvatarOnly: any;
10
10
  export declare const WithNoImage: any;
11
11
  export declare const WithBrokenImage: any;
12
12
  export declare const WithLink: any;
13
+ export declare const WithLongName: any;
package/dist/stories/molecules/AvatarWithName/AvatarWithName.stories.js CHANGED
@@ -55,4 +55,9 @@ WithLink.args = {
55
55
  href: "https://www.reddit.com",
56
56
  playerName: "Julia Gulia",
57
57
  };
58
+ export const WithLongName = AvatarWithNameTemplate.bind({});
59
+ WithLongName.args = {
60
+ imgSrc: 'https://ci-cdn.universaltennis.com/v1/player/329903/images/profile/7839bf68-b56f-486a-88ab-a52debbac709.png',
61
+ playerName: "Julia Guliauliauliauliauliauliauliauliauliaulia",
62
+ };
58
63
  //# 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,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,oBAAoB,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACpE,oBAAoB,CAAC,IAAI,GAAG;IAC1B,UAAU,EAAE,aAAa;IACzB,WAAW,EAAE,MAAM;IACnB,YAAY,EAAE,MAAM;IACpB,kBAAkB,EAAE,SAAS;IAC7B,cAAc,EAAE,YAAY;CAC7B,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC9D,cAAc,CAAC,IAAI,GAAG;IACpB,UAAU,EAAE,IAAI;IAChB,UAAU,EAAE,aAAa;CAC1B,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;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxD,QAAQ,CAAC,IAAI,GAAG;IACd,MAAM,EAAE,6GAA6G;IACrH,IAAI,EAAE,wBAAwB;IAC9B,UAAU,EAAE,aAAa;CAC1B,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,oBAAoB,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACpE,oBAAoB,CAAC,IAAI,GAAG;IAC1B,UAAU,EAAE,aAAa;IACzB,WAAW,EAAE,MAAM;IACnB,YAAY,EAAE,MAAM;IACpB,kBAAkB,EAAE,SAAS;IAC7B,cAAc,EAAE,YAAY;CAC7B,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC9D,cAAc,CAAC,IAAI,GAAG;IACpB,UAAU,EAAE,IAAI;IAChB,UAAU,EAAE,aAAa;CAC1B,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;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxD,QAAQ,CAAC,IAAI,GAAG;IACd,MAAM,EAAE,6GAA6G;IACrH,IAAI,EAAE,wBAAwB;IAC9B,UAAU,EAAE,aAAa;CAC1B,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5D,YAAY,CAAC,IAAI,GAAG;IAClB,MAAM,EAAE,6GAA6G;IACrH,UAAU,EAAE,iDAAiD;CAC9D,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@universal-tennis/ui-shared",
3
- "version": "0.1.46",
3
+ "version": "0.1.47",
4
4
  "main": "dist/items.js",
5
5
  "license": "MIT",
6
6
  "homepage": "https://universaltennis.com",
package/src/stories/molecules/AvatarWithName/AvatarWithName.stories.tsx CHANGED
@@ -66,3 +66,9 @@ WithLink.args = {
66
66
  href: "https://www.reddit.com",
67
67
  playerName: "Julia Gulia",
68
68
  };
69
+
70
+ export const WithLongName = AvatarWithNameTemplate.bind({});
71
+ WithLongName.args = {
72
+ imgSrc: 'https://ci-cdn.universaltennis.com/v1/player/329903/images/profile/7839bf68-b56f-486a-88ab-a52debbac709.png',
73
+ playerName: "Julia Guliauliauliauliauliauliauliauliauliaulia",
74
+ };
package/src/stories/molecules/AvatarWithName/AvatarWithName.tsx CHANGED
@@ -28,6 +28,13 @@ export default function AvatarWithName({
28
28
  return acronym;
29
29
  };
30
30
 
31
+ const getTruncatedName = (name:string) => {
32
+ const maxCharacterLimit = 24;
33
+ return (
34
+ name.length > maxCharacterLimit ? `${name.slice(0, maxCharacterLimit)}...` : name
35
+ );
36
+ };
37
+
31
38
  const AvatarComponent = (
32
39
  <Avatar
33
40
  sx={{
@@ -47,9 +54,9 @@ export default function AvatarWithName({
47
54
  {AvatarComponent}
48
55
  {href ? (
49
56
  <Link href={href} sx={{ textDecoration: 'none' }}>
50
- <Typography category={fontCategory} size={fontSize}>{playerName}</Typography>
57
+ <Typography category={fontCategory} size={fontSize}>{getTruncatedName(playerName)}</Typography>
51
58
  </Link>
52
- ) : <Typography category={fontCategory} size={fontSize}>{playerName}</Typography>}
59
+ ) : <Typography category={fontCategory} size={fontSize}>{getTruncatedName(playerName)}</Typography>}
53
60
  </Box>
54
61
  )
55
62
  );