@hero-design/rn 8.131.3 → 8.132.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hero-design/rn",
-  "version": "8.131.3",
+  "version": "8.132.0",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -36,7 +36,7 @@
     "nanoid": "^5.0.9"
   },
   "peerDependencies": {
-    "@hero-design/react-native-month-year-picker": "^8.46.0",
+    "@hero-design/react-native-month-year-picker": "^8.46.1",
     "@ptomasroos/react-native-multi-slider": "^2.2.2",
     "@react-native-community/datetimepicker": "^8.4.4",
     "@react-native-community/slider": "^5.0.1",
@@ -56,16 +56,16 @@
     "@babel/plugin-proposal-class-properties": "^7.18.6",
     "@babel/plugin-proposal-private-methods": "^7.18.6",
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
-    "@babel/preset-env": "^7.25.3",
+    "@babel/preset-env": "^7.29.7",
     "@babel/preset-react": "^7.26.3",
     "@babel/preset-typescript": "^7.27.0",
-    "@babel/runtime": "^7.25.0",
+    "@babel/runtime": "^7.29.7",
     "@emotion/jest": "^11.11.0",
     "@eslint/compat": "^1.1.1",
     "@eslint/eslintrc": "^3.1.0",
     "@eslint/js": "^9.8.0",
-    "@hero-design/eslint-plugin": "9.2.3",
-    "@hero-design/react-native-month-year-picker": "^8.46.0",
+    "@hero-design/eslint-plugin": "9.2.4",
+    "@hero-design/react-native-month-year-picker": "^8.46.1",
     "@ptomasroos/react-native-multi-slider": "^2.2.2",
     "@react-native-community/datetimepicker": "8.4.4",
     "@react-native-community/slider": "^5.0.1",
@@ -89,11 +89,11 @@
     "babel-plugin-inline-import": "^3.0.0",
     "core-js": "^3.33.0",
     "eslint": "^8.57.0",
-    "eslint-config-hd": "8.42.6",
+    "eslint-config-hd": "8.42.7",
     "expo-linear-gradient": "55.0.9",
-    "jest": "^29.2.1",
+    "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.2.1",
-    "jest-junit": "^16.0.0",
+    "jest-junit": "^17.0.0",
     "prettier-config-hd": "8.42.4",
     "react": "19.1.0",
     "react-dom": "19.1.0",

package/src/index.ts

@@ -16,7 +16,11 @@ import theme, {
   withTheme,
   ehWorkSystemPalette,
   ehJobsSystemPalette,
+  ehWorkShadowPalette,
+  ehJobsShadowPalette,
+  ehWorkDarkShadowPalette,
 } from './theme';
+import type { ShadowPalette } from './theme';
 import { scale } from './utils/scale';
 
 import Accordion from './components/Accordion';
@@ -108,6 +112,9 @@ export {
   ehWorkDarkSystemPalette,
   ehWorkSystemPalette,
   ehJobsSystemPalette,
+  ehWorkShadowPalette,
+  ehJobsShadowPalette,
+  ehWorkDarkShadowPalette,
   Accordion,
   Alert,
   AppCue,
@@ -178,3 +185,5 @@ export {
 };
 
 export * from './types';
+
+export type { ShadowPalette };

package/src/theme/getTheme.ts

@@ -58,7 +58,12 @@ import getToastTheme from './components/toast';
 import getToolbarTheme from './components/toolbar';
 import getTypographyTheme from './components/typography';
 
-import type { GlobalTheme, Scale, SystemPalette } from './global';
+import type {
+  GlobalTheme,
+  Scale,
+  ShadowPalette,
+  SystemPalette,
+} from './global';
 import getSearchTheme from './components/search';
 import getMapPinTheme from './components/mapPin';
 import getFloatingIslandTheme from './components/floatingIsland';
@@ -132,9 +137,10 @@ type Theme = GlobalTheme & {
 
 const getTheme = (
   scale: Scale = defaultScale,
-  systemPallete: SystemPalette = swagSystemPalette
+  systemPallete: SystemPalette = swagSystemPalette,
+  shadowPalette: ShadowPalette | undefined = undefined
 ): Theme => {
-  const globalTheme = getGlobalTheme(scale, systemPallete);
+  const globalTheme = getGlobalTheme(scale, systemPallete, shadowPalette);
   return {
     themeMode: systemPallete.themeMode,
     ...globalTheme,

package/src/theme/global/index.ts

@@ -18,9 +18,14 @@ import { getBorderWidths, getRadii } from './borders';
 import type { Scale } from './scale';
 import type { GradientToken, Gradients, SystemPalette } from './colors/types';
 import { getShadows } from './shadows';
+import type { ShadowPalette } from './shadows/types';
 import getGradients from './colors/gradients';
 
-const getGlobalTheme = (scale: Scale, systemPalette: SystemPalette) => {
+const getGlobalTheme = (
+  scale: Scale,
+  systemPalette: SystemPalette,
+  shadowPalette?: ShadowPalette
+) => {
   const fonts = getFonts(scale.font);
   const fontSizes = getFontSizes(scale.fontSize);
   const lineHeights = getLineHeights(fontSizes);
@@ -28,7 +33,7 @@ const getGlobalTheme = (scale: Scale, systemPalette: SystemPalette) => {
   const space = getSpace(scale.space);
   const sizes = getSizes(scale.size);
   const radii = getRadii(scale.radius);
-  const shadows = getShadows(systemPalette);
+  const shadows = getShadows(systemPalette, shadowPalette);
   const gradients = getGradients(systemPalette);
 
   return {
@@ -49,7 +54,14 @@ const getGlobalTheme = (scale: Scale, systemPalette: SystemPalette) => {
 
 type GlobalTheme = ReturnType<typeof getGlobalTheme>;
 
-export type { GlobalTheme, GradientToken, Gradients, Scale, SystemPalette };
+export type {
+  GlobalTheme,
+  GradientToken,
+  Gradients,
+  Scale,
+  ShadowPalette,
+  SystemPalette,
+};
 
 export {
   getGlobalTheme,

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

@@ -3,22 +3,24 @@ import ehJobsShadowPalette from './ehJobs';
 import ehWorkDarkShadowPalette from './ehWorkDark';
 
 import type { SystemPalette } from '../colors/types';
+import type { ShadowPalette } from './types';
 
-const getShadows = (palette: SystemPalette) => {
-  switch (palette.name) {
-    case 'swagLight':
-      return ehWorkShadowPalette;
-    case 'ehWork':
-      return ehWorkShadowPalette;
-    case 'swagLightJobs':
-      return ehJobsShadowPalette;
-    case 'ehJobs':
-      return ehJobsShadowPalette;
-    case 'ehWorkDark':
-      return ehWorkDarkShadowPalette;
-    default:
-      return ehWorkShadowPalette;
+const shadowPaletteMap: Record<string, ShadowPalette> = {
+  swagLight: ehWorkShadowPalette,
+  ehWork: ehWorkShadowPalette,
+  swagLightJobs: ehJobsShadowPalette,
+  ehJobs: ehJobsShadowPalette,
+  ehWorkDark: ehWorkDarkShadowPalette,
+};
+
+const getShadows = (
+  palette: SystemPalette,
+  customShadowPalette?: ShadowPalette
+): ShadowPalette => {
+  if (customShadowPalette) {
+    return customShadowPalette;
   }
+  return shadowPaletteMap[palette.name ?? ''] ?? ehWorkShadowPalette;
 };
 
 export { getShadows };

package/src/theme/index.ts

@@ -14,12 +14,16 @@ import {
   ehWorkSystemPalette,
   ehJobsSystemPalette,
 } from './global';
+import type { ShadowPalette } from './global/shadows/types';
+import ehWorkShadowPalette from './global/shadows/ehWork';
+import ehJobsShadowPalette from './global/shadows/ehJobs';
+import ehWorkDarkShadowPalette from './global/shadows/ehWorkDark';
 
 import type { Theme } from './getTheme';
 
 const defaultTheme = getTheme();
 
-export type { Theme };
+export type { ShadowPalette, Theme };
 
 export {
   withTheme,
@@ -38,6 +42,9 @@ export {
   ehWorkDarkSystemPalette,
   ehWorkSystemPalette,
   ehJobsSystemPalette,
+  ehWorkShadowPalette,
+  ehJobsShadowPalette,
+  ehWorkDarkShadowPalette,
 };
 
 export default defaultTheme;

package/types/index.d.ts

@@ -1,5 +1,6 @@
 import styled from '@emotion/native';
-import theme, { getTheme, ThemeProvider, useTheme, swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, ehWorkDarkSystemPalette, ThemeSwitcher, withTheme, ehWorkSystemPalette, ehJobsSystemPalette } from './theme';
+import theme, { getTheme, ThemeProvider, useTheme, swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, ehWorkDarkSystemPalette, ThemeSwitcher, withTheme, ehWorkSystemPalette, ehJobsSystemPalette, ehWorkShadowPalette, ehJobsShadowPalette, ehWorkDarkShadowPalette } from './theme';
+import type { ShadowPalette } from './theme';
 import { scale } from './utils/scale';
 import Accordion from './components/Accordion';
 import Alert from './components/Alert';
@@ -61,5 +62,6 @@ import FloatingIsland from './components/FloatingIsland';
 import LocaleProvider from './components/LocaleProvider';
 import FilterTrigger from './components/FilterTrigger';
 import InlineLoader, { type InlineLoaderProps } from './components/InlineLoader';
-export { theme, getTheme, useTheme, scale, ThemeProvider, ThemeSwitcher, withTheme, swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, ehWorkDarkSystemPalette, ehWorkSystemPalette, ehJobsSystemPalette, Accordion, Alert, AppCue, Attachment, Avatar, useAvatarColors, Badge, BottomNavigation, BottomSheet, Box, Button, Calendar, Card, Chart, Carousel, Chip, Collapse, Checkbox, ContentNavigator, DatePicker, Divider, Drawer, Empty, Error, FAB, FlatListWithFAB, Icon, Illustration, type IllustrationName, IllustrationList, Image, HeroDesignProvider, MapPin, List, PinInput, Progress, Portal, PageControl, Skeleton, Slider, Spinner, Swipeable, Radio, Search, SegmentedControl, ScrollViewWithFAB, SectionHeading, SectionListWithFAB, Select, Success, Switch, Tabs, Tag, TextInput, TimePicker, Toast, Toolbar, Typography, Rate, RefreshControl, RichTextEditor, FloatingIsland, LocaleProvider, FilterTrigger, InlineLoader, type InlineLoaderProps, styled, };
+export { theme, getTheme, useTheme, scale, ThemeProvider, ThemeSwitcher, withTheme, swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, ehWorkDarkSystemPalette, ehWorkSystemPalette, ehJobsSystemPalette, ehWorkShadowPalette, ehJobsShadowPalette, ehWorkDarkShadowPalette, Accordion, Alert, AppCue, Attachment, Avatar, useAvatarColors, Badge, BottomNavigation, BottomSheet, Box, Button, Calendar, Card, Chart, Carousel, Chip, Collapse, Checkbox, ContentNavigator, DatePicker, Divider, Drawer, Empty, Error, FAB, FlatListWithFAB, Icon, Illustration, type IllustrationName, IllustrationList, Image, HeroDesignProvider, MapPin, List, PinInput, Progress, Portal, PageControl, Skeleton, Slider, Spinner, Swipeable, Radio, Search, SegmentedControl, ScrollViewWithFAB, SectionHeading, SectionListWithFAB, Select, Success, Switch, Tabs, Tag, TextInput, TimePicker, Toast, Toolbar, Typography, Rate, RefreshControl, RichTextEditor, FloatingIsland, LocaleProvider, FilterTrigger, InlineLoader, type InlineLoaderProps, styled, };
 export * from './types';
+export type { ShadowPalette };

package/types/theme/getTheme.d.ts

@@ -46,7 +46,7 @@ import getTimePickerTheme from './components/timePicker';
 import getToastTheme from './components/toast';
 import getToolbarTheme from './components/toolbar';
 import getTypographyTheme from './components/typography';
-import type { GlobalTheme, Scale, SystemPalette } from './global';
+import type { GlobalTheme, Scale, ShadowPalette, SystemPalette } from './global';
 import getSearchTheme from './components/search';
 import getMapPinTheme from './components/mapPin';
 import getFloatingIslandTheme from './components/floatingIsland';
@@ -116,6 +116,6 @@ type Theme = GlobalTheme & {
         segmentedControl: ReturnType<typeof getSegmentedControlTheme>;
     };
 };
-declare const getTheme: (scale?: Scale, systemPallete?: SystemPalette) => Theme;
+declare const getTheme: (scale?: Scale, systemPallete?: SystemPalette, shadowPalette?: ShadowPalette | undefined) => Theme;
 export default getTheme;
 export type { Theme };

package/types/theme/global/index.d.ts

@@ -12,7 +12,8 @@ import ehWorkSystemPalette from './colors/ehWork';
 import ehJobsSystemPalette from './colors/ehJobs';
 import type { Scale } from './scale';
 import type { GradientToken, Gradients, SystemPalette } from './colors/types';
-declare const getGlobalTheme: (scale: Scale, systemPalette: SystemPalette) => {
+import type { ShadowPalette } from './shadows/types';
+declare const getGlobalTheme: (scale: Scale, systemPalette: SystemPalette, shadowPalette?: ShadowPalette) => {
     colors: {
         gradients: Gradients;
         defaultGlobalSurface: string;
@@ -72,8 +73,8 @@ declare const getGlobalTheme: (scale: Scale, systemPalette: SystemPalette) => {
     space: import("./space").Space;
     sizes: import("./sizes").Sizes;
     radii: import("./borders").Radii;
-    shadows: import("./shadows/types").ShadowPalette;
+    shadows: ShadowPalette;
 };
 type GlobalTheme = ReturnType<typeof getGlobalTheme>;
-export type { GlobalTheme, GradientToken, Gradients, Scale, SystemPalette };
+export type { GlobalTheme, GradientToken, Gradients, Scale, ShadowPalette, SystemPalette, };
 export { getGlobalTheme, defaultScale, swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, ehWorkDarkSystemPalette, ehWorkSystemPalette, ehJobsSystemPalette, };

package/types/theme/global/shadows/index.d.ts

@@ -1,3 +1,4 @@
 import type { SystemPalette } from '../colors/types';
-declare const getShadows: (palette: SystemPalette) => import("./types").ShadowPalette;
+import type { ShadowPalette } from './types';
+declare const getShadows: (palette: SystemPalette, customShadowPalette?: ShadowPalette) => ShadowPalette;
 export { getShadows };

package/types/theme/index.d.ts

@@ -2,8 +2,12 @@ import getTheme from './getTheme';
 import ThemeProvider, { useTheme } from './ThemeProvider';
 import ThemeSwitcher, { withTheme } from './ThemeSwitcher';
 import { swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, ehWorkDarkSystemPalette, ehWorkSystemPalette, ehJobsSystemPalette } from './global';
+import type { ShadowPalette } from './global/shadows/types';
+import ehWorkShadowPalette from './global/shadows/ehWork';
+import ehJobsShadowPalette from './global/shadows/ehJobs';
+import ehWorkDarkShadowPalette from './global/shadows/ehWorkDark';
 import type { Theme } from './getTheme';
 declare const defaultTheme: Theme;
-export type { Theme };
-export { withTheme, getTheme, ThemeProvider, ThemeSwitcher, useTheme, swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, ehWorkDarkSystemPalette, ehWorkSystemPalette, ehJobsSystemPalette, };
+export type { ShadowPalette, Theme };
+export { withTheme, getTheme, ThemeProvider, ThemeSwitcher, useTheme, swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, ehWorkDarkSystemPalette, ehWorkSystemPalette, ehJobsSystemPalette, ehWorkShadowPalette, ehJobsShadowPalette, ehWorkDarkShadowPalette, };
 export default defaultTheme;