refactor: updating brand color object to singular and reducing nesting

src/js/brandColor/brandColor.ts

@@ -0,0 +1,68 @@
+import { BrandColor } from './brandColor.types';
+
+export const brandColor: BrandColor = {
+  white000: '#ffffff',
+  white010: '#fcfcfc',
+  black000: '#000000',
+  grey030: '#fafbfc',
+  grey040: '#f2f4f6',
+  grey100: '#d6d9dc',
+  grey200: '#bbc0c5',
+  grey300: '#9fa6ae',
+  grey400: '#848c96',
+  grey500: '#6a737d',
+  grey600: '#535a61',
+  grey700: '#3b4046',
+  grey750: '#2e3339',
+  grey800: '#24272a',
+  grey900: '#141618',
+  blue000: '#eaf6ff',
+  blue100: '#a7d9fe',
+  blue200: '#75c4fd',
+  blue300: '#43aefc',
+  blue400: '#1098fc',
+  blue500: '#0376c9',
+  blue600: '#0260a4',
+  blue700: '#024272',
+  blue800: '#01253f',
+  blue900: '#00080d',
+  orange000: '#fef5ef',
+  orange100: '#fde2cf',
+  orange200: '#fbc49d',
+  orange300: '#faa66c',
+  orange400: '#f8883b',
+  orange500: '#f66a0a',
+  orange600: '#c65507',
+  orange700: '#954005',
+  orange800: '#632b04',
+  orange900: '#321602',
+  green000: '#f3fcf5',
+  green100: '#d6ffdf',
+  green200: '#afecbd',
+  green300: '#86e29b',
+  green400: '#5dd879',
+  green500: '#28a745',
+  green600: '#1e7e34',
+  green700: '#145523',
+  green800: '#0a2c12',
+  green900: '#041007',
+  red000: '#fcf2f3',
+  red100: '#f7d5d8',
+  red200: '#f1b9be',
+  red300: '#e88f97',
+  red400: '#e06470',
+  red500: '#d73847',
+  red600: '#b92534',
+  red700: '#8e1d28',
+  red800: '#64141c',
+  red900: '#3a0c10',
+  purple500: '#8b45b6',
+  violet300: '#cfb5f0',
+  yellow000: '#fffdf8',
+  yellow100: '#fefcde',
+  yellow200: '#fff2c5',
+  yellow300: '#ffeaa3',
+  yellow400: '#ffdf70',
+  yellow500: '#ffd33d',
+  yellow600: '#ffc70a',
+};

src/js/brandColor/brandColor.types.ts

@@ -0,0 +1,66 @@
+export interface BrandColor {
+  white000: string;
+  white010: string;
+  black000: string;
+  grey030: string;
+  grey040: string;
+  grey100: string;
+  grey200: string;
+  grey300: string;
+  grey400: string;
+  grey500: string;
+  grey600: string;
+  grey700: string;
+  grey750: string;
+  grey800: string;
+  grey900: string;
+  blue000: string;
+  blue100: string;
+  blue200: string;
+  blue300: string;
+  blue400: string;
+  blue500: string;
+  blue600: string;
+  blue700: string;
+  blue800: string;
+  blue900: string;
+  orange000: string;
+  orange100: string;
+  orange200: string;
+  orange300: string;
+  orange400: string;
+  orange500: string;
+  orange600: string;
+  orange700: string;
+  orange800: string;
+  orange900: string;
+  green000: string;
+  green100: string;
+  green200: string;
+  green300: string;
+  green400: string;
+  green500: string;
+  green600: string;
+  green700: string;
+  green800: string;
+  green900: string;
+  red000: string;
+  red100: string;
+  red200: string;
+  red300: string;
+  red400: string;
+  red500: string;
+  red600: string;
+  red700: string;
+  red800: string;
+  red900: string;
+  purple500: string;
+  violet300: string;
+  yellow000: string;
+  yellow100: string;
+  yellow200: string;
+  yellow300: string;
+  yellow400: string;
+  yellow500: string;
+  yellow600: string;
+}

src/js/brandColor/index.ts

@@ -0,0 +1 @@
+export { brandColor } from './brandColor';

src/js/index.ts

@@ -1,7 +1,7 @@
 export { Theme } from './themes';
 export { lightTheme } from './themes';
 export { darkTheme } from './themes';
-export { brandColors } from './brandColors';
+export { brandColor } from './brandColor';
 
 // DEPRECATED in favor of importing theme objects above
 export { colors } from './colors';