@universal-tennis/ui-shared 0.0.18 → 0.0.19

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 (5) hide show
  1. package/README.md +10 -0
  2. package/dist/stories/atoms/Typography/Typography.js +28 -4
  3. package/dist/stories/atoms/Typography/Typography.js.map +1 -1
  4. package/package.json +1 -1
  5. package/src/stories/atoms/Typography/Typography.tsx +35 -1
package/README.md CHANGED
@@ -100,6 +100,16 @@ It can now be accessed in another repo like this:
100
100
  <br />
101
101
  `import {Button} from "@universal-tennis/ui-shared";`
102
102
 
103
+ ### Development on Local
104
+
105
+ 1. Create a new branch and make changes: (for this example "sample-link-branch")
106
+ 2. Push changes to the branch / test before with storybook.
107
+ 3. Run `npm install https://kyle-universaltennis@bitbucket.org/universaltennis/ui-shared.git#sample-linked-branch` from the other repo to view these updates.
108
+ In this url (https://<USER>@bitbucket.org/<ORG>/<REPO>#<BRANCH>)
109
+ 4. You can now see the changes from your npm branch in a different repo.
110
+ you'll now see in your package.json:
111
+ ```"@universal-tennis/ui-shared": "git+https://kyle-universaltennis@bitbucket.org/universaltennis/ui-shared.git#sample-linked-branch"```
112
+
103
113
 
104
114
  ## Available Scripts
105
115
 
package/dist/stories/atoms/Typography/Typography.js CHANGED
@@ -49,28 +49,52 @@ const SECONDARY_SIZES = {
49
49
  const DisplayTypography = styled(MuiTypography)((props) => ({
50
50
  fontFamily: 'var(--display-font)',
51
51
  fontSize: DISPLAY_SIZES[props.size],
52
+ fontWeight: props.weight
52
53
  }));
53
54
  const PrimaryTypography = styled(MuiTypography)((props) => ({
54
55
  fontFamily: 'var(--primary-font)',
55
56
  fontSize: PRIMARY_SIZES[props.size],
57
+ fontWeight: props.weight
56
58
  }));
57
59
  const SecondaryTypography = styled(MuiTypography)((props) => ({
58
60
  fontFamily: 'var(--secondary-font)',
59
61
  fontSize: SECONDARY_SIZES[props.size],
60
- textTransform: props.isCap ? 'uppercase' : 'inherit'
62
+ textTransform: props.isCap ? 'uppercase' : 'inherit',
63
+ fontWeight: props.weight
61
64
  }));
62
65
  export default function Typography(_a) {
63
66
  var { children, category, size } = _a, props = __rest(_a, ["children", "category", "size"]);
64
67
  const isCap = size === null || size === void 0 ? void 0 : size.includes("cap");
68
+ let weight;
69
+ switch (true) {
70
+ case size === null || size === void 0 ? void 0 : size.includes("light"):
71
+ weight = 300;
72
+ break;
73
+ case size === null || size === void 0 ? void 0 : size.includes("book"):
74
+ weight = 400;
75
+ break;
76
+ case size === null || size === void 0 ? void 0 : size.includes("medium"):
77
+ weight = 500;
78
+ break;
79
+ case size === null || size === void 0 ? void 0 : size.includes("semibold"):
80
+ weight = 600;
81
+ break;
82
+ case size === null || size === void 0 ? void 0 : size.includes("bold"):
83
+ weight = 700;
84
+ break;
85
+ default:
86
+ weight = 500;
87
+ break;
88
+ }
65
89
  switch (category) {
66
90
  case 'primary':
67
91
  return (React.createElement(PrimaryTypography, Object.assign({ size: size }, props), children));
68
92
  case 'secondary':
69
- return (React.createElement(SecondaryTypography, Object.assign({ size: size, isCap: isCap }, props), children));
93
+ return (React.createElement(SecondaryTypography, Object.assign({ size: size, isCap: isCap, weight: weight }, props), children));
70
94
  case 'display':
71
- return (React.createElement(DisplayTypography, Object.assign({ size: size }, props), children));
95
+ return (React.createElement(DisplayTypography, Object.assign({ size: size, weight: weight }, props), children));
72
96
  default:
73
- return (React.createElement(PrimaryTypography, Object.assign({ size: size }, props), children));
97
+ return (React.createElement(PrimaryTypography, Object.assign({ size: size, weight: weight }, props), children));
74
98
  }
75
99
  }
76
100
  //# sourceMappingURL=Typography.js.map
package/dist/stories/atoms/Typography/Typography.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Typography.js","sourceRoot":"","sources":["../../../../src/stories/atoms/Typography/Typography.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Typography.js","sourceRoot":"","sources":["../../../../src/stories/atoms/Typography/Typography.tsx"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@universal-tennis/ui-shared",
3
- "version": "0.0.18",
3
+ "version": "0.0.19",
4
4
  "main": "dist/items.js",
5
5
  "license": "MIT",
6
6
  "homepage": "https://universaltennis.com",
package/src/stories/atoms/Typography/Typography.tsx CHANGED
@@ -13,6 +13,7 @@ type TypographyProps = {
13
13
  type MuiTypographyProps = {
14
14
  size?: string;
15
15
  isCap?: boolean;
16
+ weight?: number;
16
17
  }
17
18
 
18
19
  const DISPLAY_SIZES = {
@@ -54,17 +55,20 @@ const SECONDARY_SIZES = {
54
55
  const DisplayTypography = styled(MuiTypography)((props: MuiTypographyProps) => ({
55
56
  fontFamily: 'var(--display-font)',
56
57
  fontSize: DISPLAY_SIZES[props.size as keyof typeof DISPLAY_SIZES],
58
+ fontWeight: props.weight
57
59
  }));
58
60
 
59
61
  const PrimaryTypography = styled(MuiTypography)((props: MuiTypographyProps) => ({
60
62
  fontFamily: 'var(--primary-font)',
61
63
  fontSize: PRIMARY_SIZES[props.size as keyof typeof PRIMARY_SIZES],
64
+ fontWeight: props.weight
62
65
  }));
63
66
 
64
67
  const SecondaryTypography = styled(MuiTypography)((props: MuiTypographyProps) => ({
65
68
  fontFamily: 'var(--secondary-font)',
66
69
  fontSize: SECONDARY_SIZES[props.size as keyof typeof SECONDARY_SIZES],
67
- textTransform: props.isCap ? 'uppercase' : 'inherit'
70
+ textTransform: props.isCap ? 'uppercase' : 'inherit',
71
+ fontWeight: props.weight
68
72
  }));
69
73
 
70
74
  export default function Typography({
@@ -72,6 +76,33 @@ export default function Typography({
72
76
  }: TypographyProps) {
73
77
  const isCap = size?.includes("cap");
74
78
 
79
+ let weight;
80
+ switch (true) {
81
+ case size?.includes("light"):
82
+ weight = 300;
83
+ break;
84
+ case size?.includes("book"):
85
+ weight = 400;
86
+ break;
87
+
88
+ case size?.includes("medium"):
89
+ weight = 500;
90
+ break;
91
+
92
+ case size?.includes("semibold"):
93
+ weight = 600;
94
+ break;
95
+
96
+ case size?.includes("bold"):
97
+ weight = 700;
98
+
99
+ break;
100
+ default:
101
+ weight = 500;
102
+
103
+ break;
104
+ }
105
+
75
106
  switch (category) {
76
107
  case 'primary':
77
108
  return (
@@ -87,6 +118,7 @@ export default function Typography({
87
118
  <SecondaryTypography
88
119
  size={size}
89
120
  isCap={isCap}
121
+ weight={weight}
90
122
  {...props}
91
123
  >
92
124
  {children}
@@ -96,6 +128,7 @@ export default function Typography({
96
128
  return (
97
129
  <DisplayTypography
98
130
  size={size}
131
+ weight={weight}
99
132
  {...props}
100
133
  >
101
134
  {children}
@@ -105,6 +138,7 @@ export default function Typography({
105
138
  return (
106
139
  <PrimaryTypography
107
140
  size={size}
141
+ weight={weight}
108
142
  {...props}
109
143
  >
110
144
  {children}