@yahoo/uds-mobile 1.6.5 → 1.8.0-beta.1

package/generated/styles.d.ts

@@ -30,6 +30,7 @@ export declare const styles: {
     borderTopStartRadius?: number;
     borderTopWidth?: number;
     borderWidth?: number;
+    boxShadow?: string;
     color?: string;
     columnGap?: number;
     display?: 'flex' | 'none' | 'contents';
@@ -1201,6 +1202,36 @@ export declare const styles: {
       | undefined;
     textAlign?: 'center' | 'justify' | undefined;
     textTransform?: 'none' | 'capitalize' | 'uppercase' | 'lowercase' | undefined;
+    dropShadow?:
+      | 'none'
+      | 'elevation-0'
+      | 'elevation-1'
+      | 'elevation-2'
+      | 'elevation-3'
+      | 'elevation-4'
+      | 'elevation-5'
+      | 'xs'
+      | 'sm'
+      | 'md'
+      | 'lg'
+      | 'xl'
+      | '2xl'
+      | undefined;
+    insetShadow?:
+      | 'none'
+      | 'xs'
+      | 'sm'
+      | 'md'
+      | 'lg'
+      | 'xl'
+      | '2xl'
+      | 'xs-invert'
+      | 'sm-invert'
+      | 'md-invert'
+      | 'lg-invert'
+      | 'xl-invert'
+      | '2xl-invert'
+      | undefined;
     iconSize?: 'xs' | 'sm' | 'md' | 'lg' | undefined;
     avatarSize?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | undefined;
   }) => void;
@@ -1217,7 +1248,7 @@ export declare const avatarStyles: {
   };
   text: {
     color: string;
-    fontFamily: 'YASans' | 'YASans-Medium';
+    fontFamily: 'YahooProductSans' | 'YahooProductSans-Medium';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1263,7 +1294,7 @@ export declare const badgeStyles: {
     borderWidth: number;
   };
   text: {
-    fontFamily: 'YASans-SmBd';
+    fontFamily: 'YahooProductSans-Medium';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1340,7 +1371,7 @@ export declare const buttonStyles: {
     boxShadow: string;
   };
   text: {
-    fontFamily: 'YASans-SmBd';
+    fontFamily: 'YahooProductSans-Medium';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1440,7 +1471,7 @@ export declare const buttonStyles: {
 export declare const checkboxStyles: {
   root: { gap: number };
   text: {
-    fontFamily: 'YASans';
+    fontFamily: 'YahooProductSans';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1496,7 +1527,7 @@ export declare const chipStyles: {
   };
   text: {
     color: string;
-    fontFamily: 'YASans-SmBd';
+    fontFamily: 'YahooProductSans-Medium';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1533,7 +1564,7 @@ export declare const dividerStyles: {
   root: { gap: number };
   label: {
     color: string;
-    fontFamily: 'YASans-SmBd';
+    fontFamily: 'YahooProductSans-Medium';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1563,7 +1594,7 @@ export declare const inputStyles: {
   endIcon: { fontSize: number; iconSizeToken: 'md'; lineHeight: number; color: string };
   helperIcon: { fontSize: number; iconSizeToken: 'sm'; lineHeight: number; color: string };
   helperText: {
-    fontFamily: 'YASans';
+    fontFamily: 'YahooProductSans';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1574,7 +1605,7 @@ export declare const inputStyles: {
   inputWrapper: {
     borderWidth: number;
     borderRadius: number;
-    fontFamily: 'YASans';
+    fontFamily: 'YahooProductSans';
     fontSize: number;
     gap: number;
     letterSpacing: number;
@@ -1585,7 +1616,7 @@ export declare const inputStyles: {
     borderColor: string;
   };
   label: {
-    fontFamily: 'YASans';
+    fontFamily: 'YahooProductSans';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1680,7 +1711,7 @@ export declare const inputStyles: {
 
 export declare const linkStyles: {
   root: {
-    fontFamily: 'YASans' | 'YASans-Medium' | 'YASans-SmBd';
+    fontFamily: 'YahooProductSans' | 'YahooProductSans-Medium';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1799,7 +1830,7 @@ export declare const menuItemStyles: {
 export declare const radioStyles: {
   root: { gap: number };
   text: {
-    fontFamily: 'YASans';
+    fontFamily: 'YahooProductSans';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
@@ -1840,7 +1871,12 @@ export declare const radioStyles: {
 
 export declare const switchStyles: {
   root: { gap: number; paddingHorizontal: number; paddingVertical: number };
-  text: { fontFamily: 'YASans'; fontSize: number; letterSpacing: number; lineHeight: number };
+  text: {
+    fontFamily: 'YahooProductSans';
+    fontSize: number;
+    letterSpacing: number;
+    lineHeight: number;
+  };
   handle: { height: number; width: number; backgroundColor: string; boxShadow: string };
   handleIcon: { fontSize: number; iconSizeToken: 'sm'; lineHeight: number; color: string };
   switch: {
@@ -1863,11 +1899,25 @@ export declare const switchStyles: {
 };
 
 export declare const toastStyles: {
-  root: { borderRadius: number; gap: number; paddingHorizontal: number; paddingVertical: number };
+  root: {
+    borderRadius: number;
+    borderWidth: number;
+    boxShadow: string;
+    gap: number;
+    paddingHorizontal: number;
+    paddingVertical: number;
+    backgroundColor: string;
+    borderColor: string;
+  };
   text: { color: string };
   icon: { fontSize: number; iconSizeToken: 'md'; lineHeight: number; color: string };
   closeIcon: { fontSize: number; iconSizeToken: 'sm'; lineHeight: number; color: string };
-  label: { fontFamily: 'YASans-SmBd'; fontSize: number; letterSpacing: number; lineHeight: number };
+  label: {
+    fontFamily: 'YahooProductSans-Medium';
+    fontSize: number;
+    letterSpacing: number;
+    lineHeight: number;
+  };
 } & {
   useVariants: (
     variants:
@@ -1892,15 +1942,25 @@ export declare const tooltipStyles: {
   root: { gap: number; paddingHorizontal: number; paddingVertical: number };
   text: { color: string };
   icon: { fontSize: number; iconSizeToken: 'xs'; lineHeight: number; color: string };
-  body: { fontFamily: 'YASans-SmBd'; fontSize: number; letterSpacing: number; lineHeight: number };
+  body: {
+    fontFamily: 'YahooProductSans-Medium';
+    fontSize: number;
+    letterSpacing: number;
+    lineHeight: number;
+  };
   endContent: {
-    fontFamily: 'YASans-Medium';
+    fontFamily: 'YahooProductSans-Medium';
     fontSize: number;
     letterSpacing: number;
     lineHeight: number;
   };
   svg: { borderRadius: number; backgroundColor: string };
-  title: { fontFamily: 'YASans-SmBd'; fontSize: number; letterSpacing: number; lineHeight: number };
+  title: {
+    fontFamily: 'YahooProductSans-Medium';
+    fontSize: number;
+    letterSpacing: number;
+    lineHeight: number;
+  };
 } & {
   useVariants: (
     variants:
@@ -3036,6 +3096,36 @@ export type StyleProps = {
     | undefined;
   textAlign?: 'center' | 'justify' | undefined;
   textTransform?: 'none' | 'capitalize' | 'uppercase' | 'lowercase' | undefined;
+  dropShadow?:
+    | 'none'
+    | 'elevation-0'
+    | 'elevation-1'
+    | 'elevation-2'
+    | 'elevation-3'
+    | 'elevation-4'
+    | 'elevation-5'
+    | 'xs'
+    | 'sm'
+    | 'md'
+    | 'lg'
+    | 'xl'
+    | '2xl'
+    | undefined;
+  insetShadow?:
+    | 'none'
+    | 'xs'
+    | 'sm'
+    | 'md'
+    | 'lg'
+    | 'xl'
+    | '2xl'
+    | 'xs-invert'
+    | 'sm-invert'
+    | 'md-invert'
+    | 'lg-invert'
+    | 'xl-invert'
+    | '2xl-invert'
+    | undefined;
   iconSize?: 'xs' | 'sm' | 'md' | 'lg' | undefined;
   avatarSize?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | undefined;
 };

package/generated/styles.mjs

@@ -1287,6 +1287,36 @@ const styles = StyleSheet.create((theme) => ({
         uppercase: { textTransform: 'uppercase' },
         lowercase: { textTransform: 'lowercase' },
       },
+      dropShadow: {
+        none: { boxShadow: theme.boxShadow.drop['none'] },
+        'elevation-0': { boxShadow: theme.boxShadow.drop['elevation-0'] },
+        'elevation-1': { boxShadow: theme.boxShadow.drop['elevation-1'] },
+        'elevation-2': { boxShadow: theme.boxShadow.drop['elevation-2'] },
+        'elevation-3': { boxShadow: theme.boxShadow.drop['elevation-3'] },
+        'elevation-4': { boxShadow: theme.boxShadow.drop['elevation-4'] },
+        'elevation-5': { boxShadow: theme.boxShadow.drop['elevation-5'] },
+        xs: { boxShadow: theme.boxShadow.drop['xs'] },
+        sm: { boxShadow: theme.boxShadow.drop['sm'] },
+        md: { boxShadow: theme.boxShadow.drop['md'] },
+        lg: { boxShadow: theme.boxShadow.drop['lg'] },
+        xl: { boxShadow: theme.boxShadow.drop['xl'] },
+        '2xl': { boxShadow: theme.boxShadow.drop['2xl'] },
+      },
+      insetShadow: {
+        none: { boxShadow: theme.boxShadow.inset['none'] },
+        xs: { boxShadow: theme.boxShadow.inset['xs'] },
+        sm: { boxShadow: theme.boxShadow.inset['sm'] },
+        md: { boxShadow: theme.boxShadow.inset['md'] },
+        lg: { boxShadow: theme.boxShadow.inset['lg'] },
+        xl: { boxShadow: theme.boxShadow.inset['xl'] },
+        '2xl': { boxShadow: theme.boxShadow.inset['2xl'] },
+        'xs-invert': { boxShadow: theme.boxShadow.inset['xs-invert'] },
+        'sm-invert': { boxShadow: theme.boxShadow.inset['sm-invert'] },
+        'md-invert': { boxShadow: theme.boxShadow.inset['md-invert'] },
+        'lg-invert': { boxShadow: theme.boxShadow.inset['lg-invert'] },
+        'xl-invert': { boxShadow: theme.boxShadow.inset['xl-invert'] },
+        '2xl-invert': { boxShadow: theme.boxShadow.inset['2xl-invert'] },
+      },
       iconSize: {
         xs: { width: theme.iconSize['xs'], height: theme.iconSize['xs'] },
         sm: { width: theme.iconSize['sm'], height: theme.iconSize['sm'] },

package/generated/unistyles.d.ts

@@ -3968,6 +3968,8 @@ interface ComponentTheme {
   };
   'toast/size/default/root/rest': {
     borderRadius: number;
+    borderWidth: number;
+    boxShadow: string;
     gap: number;
     paddingHorizontal: number;
     paddingVertical: number;
@@ -3978,6 +3980,10 @@ interface ComponentTheme {
   'toast/variant/error/icon/rest': {
     color: string;
   };
+  'toast/variant/error/root/rest': {
+    backgroundColor: string;
+    borderColor: string;
+  };
   'toast/variant/error/rootText/rest': {
     color: string;
   };
@@ -3987,6 +3993,10 @@ interface ComponentTheme {
   'toast/variant/info/icon/rest': {
     color: string;
   };
+  'toast/variant/info/root/rest': {
+    backgroundColor: string;
+    borderColor: string;
+  };
   'toast/variant/info/rootText/rest': {
     color: string;
   };
@@ -3996,6 +4006,10 @@ interface ComponentTheme {
   'toast/variant/loading/icon/rest': {
     color: string;
   };
+  'toast/variant/loading/root/rest': {
+    backgroundColor: string;
+    borderColor: string;
+  };
   'toast/variant/loading/rootText/rest': {
     color: string;
   };
@@ -4005,6 +4019,10 @@ interface ComponentTheme {
   'toast/variant/success/icon/rest': {
     color: string;
   };
+  'toast/variant/success/root/rest': {
+    backgroundColor: string;
+    borderColor: string;
+  };
   'toast/variant/success/rootText/rest': {
     color: string;
   };
@@ -4014,6 +4032,10 @@ interface ComponentTheme {
   'toast/variant/warning/icon/rest': {
     color: string;
   };
+  'toast/variant/warning/root/rest': {
+    backgroundColor: string;
+    borderColor: string;
+  };
   'toast/variant/warning/rootText/rest': {
     color: string;
   };
@@ -4588,20 +4610,38 @@ export interface AppTheme {
     'ui5/emphasized': TypographyVariant;
     'ui6/emphasized': TypographyVariant;
   };
-  shadow: {
-    'elevation-0': number;
-    'elevation-1': number;
-    'elevation-2': number;
-    'elevation-3': number;
-    'elevation-4': number;
-    'elevation-5': number;
-    none: number;
-    xs: number;
-    sm: number;
-    md: number;
-    lg: number;
-    xl: number;
-    '2xl': number;
+  shadow: Record<string, number>;
+  boxShadow: {
+    drop: {
+      'elevation-0': string;
+      'elevation-1': string;
+      'elevation-2': string;
+      'elevation-3': string;
+      'elevation-4': string;
+      'elevation-5': string;
+      none: string;
+      xs: string;
+      sm: string;
+      md: string;
+      lg: string;
+      xl: string;
+      '2xl': string;
+    };
+    inset: {
+      none: string;
+      xs: string;
+      sm: string;
+      md: string;
+      lg: string;
+      xl: string;
+      '2xl': string;
+      'xs-invert': string;
+      'sm-invert': string;
+      'md-invert': string;
+      'lg-invert': string;
+      'xl-invert': string;
+      '2xl-invert': string;
+    };
   };
   components: ComponentTheme;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yahoo/uds-mobile",
-  "version": "1.6.5",
+  "version": "1.8.0-beta.1",
   "type": "module",
   "bin": {
     "uds-mobile": "./cli/uds-mobile.js"
@@ -234,9 +234,9 @@
     "lodash-es": "^4.17.23"
   },
   "peerDependencies": {
-    "expo-font": "~14.0.0",
+    "expo-font": "~55.0.0",
     "react": "*",
-    "react-native": ">=0.81.0",
+    "react-native": ">=0.83.0",
     "react-native-edge-to-edge": ">=1.0.0",
     "react-native-nitro-modules": ">=0.32.0",
     "react-native-reanimated": ">=4.0.0",