V7 primary colors (#2476)

* remove Colors.primary

* remove themeColors

* update test

Author: lidord-wix

src/style/__tests__/colors.spec.js

@@ -212,9 +212,10 @@ describe('style/Colors', () => {
     });
 
     it('should return undefined for color that does not exist in our colors palette.', () => {
+      uut.anotherViolet = '#5A48F5';
       expect(uut.getSystemColorByHex('#5A48F5')).toEqual('violet30');
       expect(uut.getSystemColorByHex('#5A48F5', GetColorsByHexOptions)).toEqual(undefined);
-      expect(uut.getSystemColorByHex('#5A48F5', {validColors: [...SYSTEM_COLORS, 'primary']})).toEqual('primary');
+      expect(uut.getSystemColorByHex('#5A48F5', {validColors: [...SYSTEM_COLORS, 'anotherViolet']})).toEqual('anotherViolet');
     });
   });
 });

src/style/colors.ts

@@ -3,7 +3,7 @@ import _ from 'lodash';
 import Color from 'color';
 import {OpaqueColorValue} from 'react-native';
 import tinycolor from 'tinycolor2';
-import {colorsPalette, themeColors} from './colorsPalette';
+import {colorsPalette} from './colorsPalette';
 import DesignTokens from './designTokens';
 import DesignTokensDM from './designTokensDM';
 //@ts-ignore
@@ -20,7 +20,7 @@ export class Colors {
   private shouldSupportDarkMode = false;
 
   constructor() {
-    const colors = Object.assign(colorsPalette, themeColors);
+    const colors = Object.assign(colorsPalette);
     Object.assign(this, colors);
     this.loadSchemes({light: DesignTokens, dark: DesignTokensDM});
 
@@ -185,7 +185,7 @@ export class Colors {
       const shouldReverseOnDark =
         !options?.avoidReverseOnDark && this.shouldSupportDarkMode && Scheme.getSchemeType() === 'dark';
       const key = shouldReverseOnDark ? colorKeys[colorKeys.length - 1 - keyIndex] : tintKey;
-      
+
       const requiredColorKey = `${colorKey.slice(0, -2)}${key}`;
       const requiredColorKey1 = `${colorKey.slice(0, -1)}${key}`;
       const requiredColor = this[requiredColorKey] || this[requiredColorKey1];
@@ -355,10 +355,7 @@ function threeDigitHexToSix(value: string) {
   return value.replace(/./g, '$&$&');
 }
 
-const TypedColors = Colors as ExtendTypeWith<
-  typeof Colors,
-  typeof colorsPalette & typeof themeColors & typeof DesignTokens
->;
+const TypedColors = Colors as ExtendTypeWith<typeof Colors, typeof colorsPalette & typeof DesignTokens>;
 const colorObject = new TypedColors();
 colorObject.loadColors(colorsPalette);
 export default colorObject;

src/style/colorsPalette.ts

@@ -111,8 +111,4 @@ const extraFixColorsMap = {
   '#fff': 'white'
 };
 
-const themeColors = {
-  primary: colorsPalette.violet30
-};
-
-export {colorsPalette, themeColors, extraFixColorsMap};
+export {colorsPalette, extraFixColorsMap};