feat(constants): replaced extraBold token value with semiBold (#570)

mr requirements
ticketmaster · Jul 29, 2019 · dcf23a1 · dcf23a1
1 parent 49e632c
commit dcf23a1
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 5 deletions.
diff --git a/src/components/Typography/H1.js b/src/components/Typography/H1.js
@@ -2,11 +2,11 @@ import styled from "styled-components";
 
 import { fontWeight, fontSize, BASE_STYLE_HEADER } from "../../mixins";
 import { largeAndUp } from "../../theme/mediaQueries";
-import { ONYX, BASE, SEMI_BOLD } from "../constants";
+import { ONYX, BASE, FONT_WEIGHT_SEMI_BOLD } from "../constants";
 import typographyClassnames from "./helpers";
 
 const H1 = styled.h1.attrs(
-  ({ weight = SEMI_BOLD, color = ONYX, variant = BASE }) => ({
+  ({ weight = FONT_WEIGHT_SEMI_BOLD, color = ONYX, variant = BASE }) => ({
     className: typographyClassnames("h1", { weight, color, variant })
   })
 )`

diff --git a/src/components/constants.tsx b/src/components/constants.tsx
@@ -55,9 +55,26 @@ export type Size = typeof SMALL | typeof REGULAR | typeof LARGE;
 
 export const ARROW_WIDTH = 12;
 
+// FONT_WEIGHTS
+export const FONT_WEIGHT_LIGHT = "light";
+export const FONT_WEIGHT_REGULAR = "regular";
+export const FONT_WEIGHT_SEMI_BOLD = "semiBold";
+
+export const FONT_WEIGHTS: ReadonlyArray<FontWeight> = [
+  FONT_WEIGHT_LIGHT,
+  FONT_WEIGHT_REGULAR,
+  FONT_WEIGHT_SEMI_BOLD
+];
+export type FontWeight =
+  | typeof FONT_WEIGHT_LIGHT
+  | typeof FONT_WEIGHT_REGULAR
+  | typeof FONT_WEIGHT_SEMI_BOLD;
+
 // WEIGHTS
-export const EXTRA_BOLD = "extraBold"; // NOTE `extraBold` TOKEN IS DEPRECATED, USE `semiBold` instead
-export const SEMI_BOLD = "semiBold";
+/**
+ * @deprecated Use `FONT_WEIGHT_SEMI_BOLD` instead
+ */
+export const EXTRA_BOLD = "extraBold"; // <-- This is here for backward compatibility
 export type Weight = typeof EXTRA_BOLD;
 
 // THEME COLORS

diff --git a/src/theme/typography.js b/src/theme/typography.js
@@ -3,7 +3,10 @@ const typography = {
     light: 300,
     regular: 400,
     semiBold: 600,
-    extraBold: 600 // NONE: `extraBold` TOKEN IS DEPRECATED, USE `semiBold` INSTEAD
+    /**
+     * @deprecated Use `semiBold` value instead
+     */
+    extraBold: 600
   },
   lineHeight: {
     body: "1.5",