@hero-design/rn 8.91.8 → 8.92.0

package/src/index.ts

@@ -13,6 +13,8 @@ import theme, {
   ehWorkDarkSystemPalette,
   ThemeSwitcher,
   withTheme,
+  ehWorkSystemPalette,
+  ehJobsSystemPalette,
 } from './theme';
 import { scale } from './utils/scale';
 
@@ -92,6 +94,8 @@ export {
   walletSystemPalette,
   eBensSystemPalette,
   ehWorkDarkSystemPalette,
+  ehWorkSystemPalette,
+  ehJobsSystemPalette,
   Accordion,
   Alert,
   AppCue,

package/src/theme/ThemeSwitcher.tsx

@@ -11,6 +11,7 @@ import {
   swagDarkSystemPalette,
   ehWorkDarkSystemPalette,
   swagLightSystemPalette,
+  swagLightJobsSystemPalette,
 } from './global';
 import ThemeProvider from './ThemeProvider';
 
@@ -22,7 +23,9 @@ type ThemeName =
   | 'jobs'
   | 'wallet'
   | 'eBens'
-  | 'ehWorkDark';
+  | 'ehWorkDark'
+  | 'ehWork'
+  | 'ehJobs';
 
 const ThemeSwitcher = ({
   name = 'swag',
@@ -46,9 +49,12 @@ const ThemeSwitcher = ({
       case 'swagDark':
         return getTheme(defaultScale, swagDarkSystemPalette);
       case 'swagLight':
+      case 'ehWork':
         return getTheme(defaultScale, swagLightSystemPalette);
       case 'ehWorkDark':
         return getTheme(defaultScale, ehWorkDarkSystemPalette);
+      case 'ehJobs':
+        return getTheme(defaultScale, swagLightJobsSystemPalette);
     }
   }, [name]);
   return <ThemeProvider theme={theme}>{children}</ThemeProvider>;
@@ -66,5 +72,4 @@ export const withTheme =
       </ThemeSwitcher>
     );
   };
-
 export default ThemeSwitcher;

package/src/theme/global/colors/__tests__/__snapshots__/ehJobs.spec.ts.snap

@@ -0,0 +1,54 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ehJobs returns correct theme object 1`] = `
+{
+  "archived": "#abacaf",
+  "archivedSurface": "#dadbde",
+  "black": "#000000",
+  "darkGlobalSurface": "#001f23",
+  "decorativePrimary": "#fdfbff",
+  "decorativePrimarySurface": "#dacce4",
+  "decorativeSecondary": "#fdfbff",
+  "decorativeSecondarySurface": "#d9f6ff",
+  "defaultGlobalSurface": "#ffffff",
+  "defaultSurface": "#fdfbff",
+  "disabledOnDefaultGlobalSurface": "#bfc1c5",
+  "disabledOutline": "#bfc1c5",
+  "error": "#f46363",
+  "errorSurface": "#fcebe7",
+  "highlightedSurface": "#f1e9fb",
+  "inactiveOnDefaultGlobalSurface": "#808f91",
+  "inactiveOutline": "#808f91",
+  "info": "#b5c3fd",
+  "infoSurface": "#ecf0ff",
+  "mutedArchived": "#bcbdbf",
+  "mutedError": "#f68282",
+  "mutedInfo": "#c4cffd",
+  "mutedOnDefaultGlobalSurface": "#4d6265",
+  "mutedSuccess": "#7bd897",
+  "mutedWarning": "#ffcb8d",
+  "name": "ehJobs",
+  "neutralGlobalSurface": "#f6f6f7",
+  "onArchivedSurface": "#606065",
+  "onDarkGlobalSurface": "#ffffff",
+  "onDefaultGlobalSurface": "#121214",
+  "onErrorSurface": "#cb300a",
+  "onInfoSurface": "#355bfb",
+  "onPrimary": "#fdfbff",
+  "onSecondary": "#460078",
+  "onSuccessSurface": "#017d6d",
+  "onWarningSurface": "#ac5d00",
+  "overlayGlobalSurface": "#000000",
+  "pressedSurface": "#380060",
+  "primary": "#460078",
+  "primaryOutline": "#121214",
+  "secondary": "#40d1ff",
+  "secondaryHighlightedSurface": "#ecfaff",
+  "secondaryOutline": "#e8e9ea",
+  "success": "#5ace7d",
+  "successSurface": "#f0fef4",
+  "warning": "#ffbe71",
+  "warningSurface": "#fff6eb",
+  "white": "#ffffff",
+}
+`;

package/src/theme/global/colors/__tests__/__snapshots__/ehWork.spec.js.snap

@@ -0,0 +1,53 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ehWork returns correct theme object 1`] = `
+{
+  "archived": "#abacaf",
+  "archivedSurface": "#dadbde",
+  "black": "#000000",
+  "darkGlobalSurface": "#001f23",
+  "decorativePrimary": "#fdfbff",
+  "decorativePrimarySurface": "#dacce4",
+  "decorativeSecondary": "#fdfbff",
+  "decorativeSecondarySurface": "#f0e6ff",
+  "defaultGlobalSurface": "#ffffff",
+  "defaultSurface": "#fdfbff",
+  "disabledOnDefaultGlobalSurface": "#bfc1c5",
+  "disabledOutline": "#bfc1c5",
+  "error": "#f46363",
+  "errorSurface": "#fcebe7",
+  "highlightedSurface": "#f1e9fb",
+  "inactiveOnDefaultGlobalSurface": "#808f91",
+  "inactiveOutline": "#808f91",
+  "info": "#b5c3fd",
+  "infoSurface": "#ecf0ff",
+  "mutedArchived": "#bcbdbf",
+  "mutedError": "#f68282",
+  "mutedInfo": "#c4cffd",
+  "mutedOnDefaultGlobalSurface": "#4d6265",
+  "mutedSuccess": "#7bd897",
+  "mutedWarning": "#ffcb8d",
+  "name": "ehWork",
+  "neutralGlobalSurface": "#f6f6f7",
+  "onArchivedSurface": "#606065",
+  "onDarkGlobalSurface": "#ffffff",
+  "onDefaultGlobalSurface": "#121214",
+  "onErrorSurface": "#cb300a",
+  "onInfoSurface": "#355bfb",
+  "onPrimary": "#fdfbff",
+  "onSecondary": "#ffffff",
+  "onSuccessSurface": "#017d6d",
+  "onWarningSurface": "#ac5d00",
+  "overlayGlobalSurface": "#000000",
+  "pressedSurface": "#380060",
+  "primary": "#460078",
+  "primaryOutline": "#121214",
+  "secondary": "#b382fd",
+  "secondaryOutline": "#e8e9ea",
+  "success": "#5ace7d",
+  "successSurface": "#f0fef4",
+  "warning": "#ffbe71",
+  "warningSurface": "#fff6eb",
+  "white": "#ffffff",
+}
+`;

package/src/theme/global/colors/__tests__/ehJobs.spec.ts

@@ -0,0 +1,7 @@
+import ehJobs from '../ehJobs';
+
+describe('ehJobs', () => {
+  it('returns correct theme object', () => {
+    expect(ehJobs).toMatchSnapshot();
+  });
+});

package/src/theme/global/colors/__tests__/ehWork.spec.js

@@ -0,0 +1,7 @@
+import ehWork from '../ehWork';
+
+describe('ehWork', () => {
+  it('returns correct theme object', () => {
+    expect(ehWork).toMatchSnapshot();
+  });
+});

package/src/theme/global/colors/ehJobs.ts

@@ -0,0 +1,14 @@
+import swagLightSystemPalette from './swagSystemPalette';
+import { SystemPalette } from './types';
+
+const ehJobsSystemPalette: SystemPalette = {
+  ...swagLightSystemPalette,
+  name: 'ehJobs',
+  secondary: '#40d1ff',
+  onSecondary: '#460078',
+  secondaryHighlightedSurface: '#ecfaff',
+  decorativeSecondary: '#fdfbff',
+  decorativeSecondarySurface: '#d9f6ff',
+};
+
+export default ehJobsSystemPalette;

package/src/theme/global/colors/ehWork.ts

@@ -0,0 +1,27 @@
+import { swagLightPalette as palette } from '@hero-design/colors';
+import type { SystemPalette, BrandSystemPalette } from './types';
+import swagLightGlobalPalette from './swagLightGlobal';
+
+const ehWorkBrandSystemPalette: BrandSystemPalette = {
+  primary: '#460078',
+  onPrimary: '#fdfbff',
+  secondary: '#b382fd',
+  onSecondary: palette.white,
+  defaultSurface: '#fdfbff',
+  highlightedSurface: palette.violetLight90,
+  pressedSurface: '#380060',
+  decorativePrimary: '#fdfbff',
+  decorativePrimarySurface: '#dacce4',
+  decorativeSecondary: '#fdfbff',
+  decorativeSecondarySurface: '#f0e6ff',
+};
+
+const ehWorkSystemPalette: SystemPalette = {
+  // Global
+  ...swagLightGlobalPalette,
+  // Brand
+  ...ehWorkBrandSystemPalette,
+  name: 'ehWork',
+};
+
+export default ehWorkSystemPalette;

package/src/theme/global/colors/swagLight.ts

@@ -1,26 +1,11 @@
-import { swagLightPalette as palette } from '@hero-design/colors';
-import type { SystemPalette, BrandSystemPalette } from './types';
-import swagLightGlobalPalette from './swagLightGlobal';
-
-const swagBrandSystemPallete: BrandSystemPalette = {
-  primary: '#460078',
-  onPrimary: '#fdfbff',
-  secondary: '#b382fd',
-  onSecondary: palette.white,
-  defaultSurface: '#fdfbff',
-  highlightedSurface: palette.violetLight90,
-  pressedSurface: '#380060',
-  decorativePrimary: '#fdfbff',
-  decorativePrimarySurface: '#dacce4',
-  decorativeSecondary: '#fdfbff',
-  decorativeSecondarySurface: '#f0e6ff',
-};
+import ehWorkSystemPalette from './ehWork';
+import { SystemPalette } from './types';
 
+/**
+ * @deprecated This palette is deprecated and will be removed in the next major release.
+ */
 const swagSystemPalette: SystemPalette = {
-  // Global
-  ...swagLightGlobalPalette,
-  // Brand
-  ...swagBrandSystemPallete,
+  ...ehWorkSystemPalette,
   name: 'swagLight',
 };
 

package/src/theme/global/colors/swagLightJobs.ts

@@ -1,14 +1,12 @@
-import swagLightSystemPalette from './swagLight';
+import ehJobsSystemPalette from './ehJobs';
 import { SystemPalette } from './types';
 
+/**
+ * @deprecated This palette is deprecated and will be removed in the next major release.
+ */
 const swagLightJobsSystemPalette: SystemPalette = {
-  ...swagLightSystemPalette,
+  ...ehJobsSystemPalette,
   name: 'swagLightJobs',
-  secondary: '#40d1ff',
-  onSecondary: '#460078',
-  secondaryHighlightedSurface: '#ecfaff',
-  decorativeSecondary: '#fdfbff',
-  decorativeSecondarySurface: '#d9f6ff',
 };
 
 export default swagLightJobsSystemPalette;

package/src/theme/global/colors/swagSystemPalette.ts

@@ -0,0 +1,9 @@
+import ehWorkSystemPalette from './ehWork';
+import { SystemPalette } from './types';
+
+export const swagSystemPalette: SystemPalette = {
+  ...ehWorkSystemPalette,
+  name: 'swagLight',
+};
+
+export default swagSystemPalette;

package/src/theme/global/colors/types.ts

@@ -65,7 +65,12 @@ export type BrandSystemPalette = {
 };
 
 export type ThemeMode = 'light' | 'dark';
-export type ThemeName = 'swagLight' | 'swagLightJobs' | 'ehWorkDark';
+export type ThemeName =
+  | 'swagLight'
+  | 'swagLightJobs'
+  | 'ehWorkDark'
+  | 'ehWork'
+  | 'ehJobs';
 export type SystemPalette = GlobalSystemPalette &
   BrandSystemPalette & {
     themeMode?: ThemeMode;

package/src/theme/global/index.ts

@@ -8,6 +8,8 @@ import jobsSystemPalette from './colors/jobs';
 import walletSystemPalette from './colors/wallet';
 import eBensSystemPalette from './colors/eBens';
 import ehWorkDarkSystemPalette from './colors/ehWorkDark';
+import ehWorkSystemPalette from './colors/ehWork';
+import ehJobsSystemPalette from './colors/ehJobs';
 
 import { getFonts, getFontSizes, getLineHeights } from './typography';
 import { getSpace } from './space';
@@ -58,4 +60,6 @@ export {
   walletSystemPalette,
   eBensSystemPalette,
   ehWorkDarkSystemPalette,
+  ehWorkSystemPalette,
+  ehJobsSystemPalette,
 };

package/src/theme/global/shadows/__tests__/__snapshots__/{swagLightJobs.spec.ts.snap → ehJobs.spec.ts.snap}

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`swagLightJobsShadowPalette returns correct theme object 1`] = `
+exports[`ehJobsShadowPalette returns correct theme object 1`] = `
 {
   "deep": {
     "elevation": 10,

package/src/theme/global/shadows/__tests__/ehJobs.spec.ts

@@ -0,0 +1,7 @@
+import ehJobsShadowPalette from '../ehJobs';
+
+describe('ehJobsShadowPalette', () => {
+  it('returns correct theme object', () => {
+    expect(ehJobsShadowPalette).toMatchSnapshot();
+  });
+});

package/src/theme/global/shadows/__tests__/ehWork.spec.ts

@@ -0,0 +1,7 @@
+import ehWorkShadowPalette from '../ehWork';
+
+describe('swagLightShadowPalette', () => {
+  it('returns correct theme object', () => {
+    expect(ehWorkShadowPalette).toMatchSnapshot();
+  });
+});

package/src/theme/global/shadows/__tests__/index.spec.ts

@@ -1,21 +1,25 @@
-import swagLightSystemPalette from '../../colors/swagLight';
+import swagLightSystemPalette from '../../colors/swagSystemPalette';
 import swagLightJobsSystemPalette from '../../colors/swagLightJobs';
 import ehWorkDarkSystemPalette from '../../colors/ehWorkDark';
+import ehWorkSystemPalette from '../../colors/ehWork';
+import ehJobsSystemPalette from '../../colors/ehJobs';
 import swagSystemPalette from '../../colors/swag';
 import { getShadows } from '../index';
-import swagLightShadowPalette from '../swagLight';
-import swagLightJobsShadowPalette from '../swagLightJobs';
+import ehWorkShadowPalette from '../ehWork';
+import ehJobsShadowPalette from '../ehJobs';
 import ehWorkDarkShadowPalette from '../ehWorkDark';
 
 describe('getShadows', () => {
   it.each`
     colorPalette                  | shadowPalette
-    ${swagLightSystemPalette}     | ${swagLightShadowPalette}
-    ${swagLightJobsSystemPalette} | ${swagLightJobsShadowPalette}
+    ${swagLightSystemPalette}     | ${ehWorkShadowPalette}
+    ${swagLightJobsSystemPalette} | ${ehJobsShadowPalette}
     ${ehWorkDarkSystemPalette}    | ${ehWorkDarkShadowPalette}
-    ${swagSystemPalette}          | ${swagLightShadowPalette}
+    ${swagSystemPalette}          | ${ehWorkShadowPalette}
+    ${ehWorkSystemPalette}        | ${ehWorkShadowPalette}
+    ${ehJobsSystemPalette}        | ${ehJobsShadowPalette}
   `(
-    'should return the correct shadow palette for $colorPalette',
+    'should return the correct shadow palette for $colorPalette.name',
     ({ colorPalette, shadowPalette }) => {
       const actual = getShadows(colorPalette);
       expect(actual).toEqual(shadowPalette);

package/src/theme/global/shadows/{swagLightJobs.ts → ehJobs.ts}

@@ -1,13 +1,13 @@
 import type { ShadowPalette } from './types';
-import swagLightJobsSystemPalette from '../colors/swagLightJobs';
+import ehWorkSystemPalette from '../colors/ehWork';
 
-const swagLightJobsShadowPalette: ShadowPalette = {
+const ehJobsShadowPalette: ShadowPalette = {
   default: {
     shadowOffset: {
       width: 0,
       height: 2,
     },
-    shadowColor: swagLightJobsSystemPalette.primaryOutline,
+    shadowColor: ehWorkSystemPalette.primaryOutline,
     shadowOpacity: 0.12,
     shadowRadius: 4,
     elevation: 3,
@@ -34,4 +34,4 @@ const swagLightJobsShadowPalette: ShadowPalette = {
   },
 };
 
-export default swagLightJobsShadowPalette;
+export default ehJobsShadowPalette;

package/src/theme/global/shadows/{swagLight.ts → ehWork.ts}

@@ -1,6 +1,6 @@
 import type { ShadowPalette } from './types';
 
-const swagLightShadowPalette: ShadowPalette = {
+const ehWorkShadowPalette: ShadowPalette = {
   default: {
     shadowOffset: {
       width: 0,
@@ -33,4 +33,4 @@ const swagLightShadowPalette: ShadowPalette = {
   },
 };
 
-export default swagLightShadowPalette;
+export default ehWorkShadowPalette;

package/src/theme/global/shadows/index.ts

@@ -1,5 +1,5 @@
-import swagLightShadowPalette from './swagLight';
-import swagLightJobsShadowPalette from './swagLightJobs';
+import ehWorkShadowPalette from './ehWork';
+import ehJobsShadowPalette from './ehJobs';
 import ehWorkDarkShadowPalette from './ehWorkDark';
 
 import { SystemPalette } from '../colors/types';
@@ -7,13 +7,17 @@ import { SystemPalette } from '../colors/types';
 const getShadows = (palette: SystemPalette) => {
   switch (palette.name) {
     case 'swagLight':
-      return swagLightShadowPalette;
+      return ehWorkShadowPalette;
+    case 'ehWork':
+      return ehWorkShadowPalette;
     case 'swagLightJobs':
-      return swagLightJobsShadowPalette;
+      return ehJobsShadowPalette;
+    case 'ehJobs':
+      return ehJobsShadowPalette;
     case 'ehWorkDark':
       return ehWorkDarkShadowPalette;
     default:
-      return swagLightShadowPalette;
+      return ehWorkShadowPalette;
   }
 };
 

package/src/theme/index.ts

@@ -11,6 +11,8 @@ import {
   walletSystemPalette,
   eBensSystemPalette,
   ehWorkDarkSystemPalette,
+  ehWorkSystemPalette,
+  ehJobsSystemPalette,
 } from './global';
 
 import type { Theme } from './getTheme';
@@ -34,6 +36,8 @@ export {
   walletSystemPalette,
   eBensSystemPalette,
   ehWorkDarkSystemPalette,
+  ehWorkSystemPalette,
+  ehJobsSystemPalette,
 };
 
 export default defaultTheme;