react-native-screens 5.0.0-alpha.1 → 5.0.0-alpha.3

package/src/components/stack/index.ts

@@ -2,7 +2,7 @@ import { StackHost } from './host';
 import { StackScreen } from './screen';
 import { StackHeaderConfig } from './header';
 
-export type { StackHostProps } from './host';
+export type { StackHostProps, StackHostColorScheme } from './host';
 
 export type {
   OnDismissEventPayload,
@@ -19,6 +19,9 @@ export type {
   StackHeaderConfigRef,
   // Android
   StackHeaderTypeAndroid,
+  StackHeaderTitleHorizontalGravityAndroid,
+  StackHeaderTitleVerticalGravityAndroid,
+  StackHeaderCollapsedTitleGravityModeAndroid,
   StackHeaderBackgroundSubviewCollapseModeAndroid,
   StackHeaderToolbarSubviewAndroid,
   StackHeaderBackgroundSubviewAndroid,
@@ -35,7 +38,9 @@ export type {
   StackHeaderToolbarMenuItemShowAsActionAndroid,
   StackHeaderToolbarMenuItemTypeAndroid,
   // iOS
+  StackHeaderBackButtonDisplayModeIOS,
   StackHeaderConfigPropsIOS,
+  StackHeaderAppearanceIOS,
   StackHeaderInlineItemIOS,
   StackHeaderInlineCustomItemIOS,
   StackHeaderTitleCustomItemIOS,

package/src/components/tabs/host/TabsHost.ios.tsx

@@ -48,6 +48,7 @@ function TabsHost(props: TabsHostProps) {
       {...filteredBaseProps}
       // iOS-specific
       layoutDirection={direction}
+      tabBarHiddenAnimationEnabled={ios?.tabBarHiddenAnimationEnabled}
       tabBarControllerMode={ios?.tabBarControllerMode}
       tabBarMinimizeBehavior={ios?.tabBarMinimizeBehavior}
       tabBarTintColor={ios?.tabBarTintColor}

package/src/components/tabs/host/TabsHost.ios.types.ts

@@ -34,6 +34,22 @@ export type TabBarMinimizeBehavior =
 export type TabBarControllerMode = 'automatic' | 'tabBar' | 'tabSidebar';
 
 export interface TabsHostPropsIOS {
+  /**
+   * @summary Whether changes of `tabBarHidden` are animated.
+   *
+   * When `true`, the tab bar is hidden and shown with the system transition
+   * (`UITabBarController.setTabBarHidden(_:animated:)`). When `false`, the
+   * tab bar disappears and reappears immediately.
+   *
+   * Available starting from iOS 18. On earlier versions the tab bar visibility
+   * is never animated, regardless of this prop.
+   *
+   * @default true
+   *
+   * @platform ios
+   * @supported iOS 18 or higher
+   */
+  tabBarHiddenAnimationEnabled?: boolean | undefined;
   /**
    * @summary Specifies the color used for selected tab's text and icon color.
    *

package/src/components/tabs/host/TabsHost.types.ts

@@ -181,6 +181,9 @@ export interface TabsHostPropsBase {
   /**
    * @summary Hides the tab bar.
    *
+   * On iOS 18+, whether the change is animated is controlled by
+   * `ios.tabBarHiddenAnimationEnabled`.
+   *
    * @default false
    *
    * @platform android, ios

package/src/components/tabs/screen/TabsScreen.types.ts

@@ -110,9 +110,13 @@ export interface TabsScreenPropsBase {
    * Note that:
    * - some components (like `SplitHost`) may choose not to query
    *   its child components,
-   * - Stack v4 implementation **ALWAYS** returns some supported
-   *   orientations (`allButUpsideDown` by default), overriding
-   *   orientation from tab screen.
+   * - Stack v4 (legacy) implementation returns some supported orientations,
+   *   overriding orientation from the tab screen **unless** the Stack v4
+   *   screen has no explicit `screenOrientation` prop and
+   *   `featureFlags.experiment.iosOrientationInheritanceFixEnabled` is
+   *   enabled (the default), in which case it returns `inherit` and no
+   *   longer overrides the parent (see
+   *   https://github.com/software-mansion/react-native-screens/pull/4408).
    *
    * The following values are currently supported:
    *

package/src/experimental/index.ts

@@ -6,3 +6,4 @@
 // Components & types
 
 export * from '../components/safe-area';
+export * from '../components/scroll-to-top-guard';

package/src/fabric/ScrollViewMarkerNativeComponent.ts

@@ -1,6 +1,10 @@
 'use client';
 
-import type { CodegenTypes as CT, ViewProps } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  HostComponent,
+  ViewProps,
+} from 'react-native';
 import { codegenNativeComponent } from 'react-native';
 
 type ScrollEdgeEffect = 'automatic' | 'hard' | 'soft' | 'hidden';
@@ -12,4 +16,6 @@ interface NativeProps extends ViewProps {
   bottomScrollEdgeEffect?: CT.WithDefault<ScrollEdgeEffect, 'automatic'>;
 }
 
-export default codegenNativeComponent<NativeProps>('RNSScrollViewMarker');
+export default codegenNativeComponent<NativeProps>(
+  'RNSScrollViewMarker',
+) as HostComponent<NativeProps>;

package/src/fabric/legacy/FullWindowOverlayNativeComponent.ts

@@ -1,7 +1,11 @@
 'use client';
 
 import { codegenNativeComponent } from 'react-native';
-import type { CodegenTypes as CT, ViewProps } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  HostComponent,
+  ViewProps,
+} from 'react-native';
 
 // Internal export, not part of stable library API.
 export interface NativeProps extends ViewProps {
@@ -10,4 +14,4 @@ export interface NativeProps extends ViewProps {
 
 export default codegenNativeComponent<NativeProps>('RNSFullWindowOverlay', {
   interfaceOnly: true,
-});
+}) as HostComponent<NativeProps>;

package/src/fabric/legacy/ModalScreenNativeComponent.ts

@@ -1,7 +1,12 @@
 'use client';
 
 import { codegenNativeComponent } from 'react-native';
-import type { CodegenTypes as CT, ViewProps, ColorValue } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  HostComponent,
+  ViewProps,
+  ColorValue,
+} from 'react-native';
 
 // eslint-disable-next-line @typescript-eslint/ban-types
 type ScreenEvent = Readonly<{}>;
@@ -122,8 +127,9 @@ export interface NativeProps extends ViewProps {
   rightScrollEdgeEffect?: CT.WithDefault<ScrollEdgeEffect, 'automatic'>;
   topScrollEdgeEffect?: CT.WithDefault<ScrollEdgeEffect, 'automatic'>;
   synchronousShadowStateUpdatesEnabled?: CT.WithDefault<boolean, true>;
+  iosOrientationInheritanceFixEnabled?: CT.WithDefault<boolean, true>;
 }
 
 export default codegenNativeComponent<NativeProps>('RNSModalScreen', {
   interfaceOnly: true,
-});
+}) as HostComponent<NativeProps>;

package/src/fabric/legacy/ScreenContainerNativeComponent.ts

@@ -1,8 +1,11 @@
 'use client';
 
 import { codegenNativeComponent } from 'react-native';
-import type { ViewProps } from 'react-native';
+import type { HostComponent, ViewProps } from 'react-native';
 
 interface NativeProps extends ViewProps {}
 
-export default codegenNativeComponent<NativeProps>('RNSScreenContainer', {});
+export default codegenNativeComponent<NativeProps>(
+  'RNSScreenContainer',
+  {},
+) as HostComponent<NativeProps>;

package/src/fabric/legacy/ScreenContentWrapperNativeComponent.ts

@@ -1,9 +1,9 @@
 import { codegenNativeComponent } from 'react-native';
-import type { ViewProps } from 'react-native';
+import type { HostComponent, ViewProps } from 'react-native';
 
 export interface NativeProps extends ViewProps {}
 
 export default codegenNativeComponent<NativeProps>(
   'RNSScreenContentWrapper',
   {},
-);
+) as HostComponent<NativeProps>;

package/src/fabric/legacy/ScreenFooterNativeComponent.ts

@@ -1,6 +1,9 @@
 import { codegenNativeComponent } from 'react-native';
-import type { ViewProps } from 'react-native';
+import type { HostComponent, ViewProps } from 'react-native';
 
 export interface NativeProps extends ViewProps {}
 
-export default codegenNativeComponent<NativeProps>('RNSScreenFooter', {});
+export default codegenNativeComponent<NativeProps>(
+  'RNSScreenFooter',
+  {},
+) as HostComponent<NativeProps>;

package/src/fabric/legacy/ScreenNativeComponent.ts

@@ -1,7 +1,12 @@
 'use client';
 
 import { codegenNativeComponent } from 'react-native';
-import type { CodegenTypes as CT, ViewProps, ColorValue } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  HostComponent,
+  ViewProps,
+  ColorValue,
+} from 'react-native';
 
 // eslint-disable-next-line @typescript-eslint/ban-types
 type ScreenEvent = Readonly<{}>;
@@ -126,8 +131,9 @@ export interface NativeProps extends ViewProps {
     boolean,
     true
   >;
+  iosOrientationInheritanceFixEnabled?: CT.WithDefault<boolean, true>;
 }
 
 export default codegenNativeComponent<NativeProps>('RNSScreen', {
   interfaceOnly: true,
-});
+}) as HostComponent<NativeProps>;

package/src/fabric/legacy/ScreenNavigationContainerNativeComponent.ts

@@ -1,11 +1,11 @@
 'use client';
 
 import { codegenNativeComponent } from 'react-native';
-import type { ViewProps } from 'react-native';
+import type { HostComponent, ViewProps } from 'react-native';
 
 interface NativeProps extends ViewProps {}
 
 export default codegenNativeComponent<NativeProps>(
   'RNSScreenNavigationContainer',
   {},
-);
+) as HostComponent<NativeProps>;

package/src/fabric/legacy/ScreenStackHeaderConfigNativeComponent.ts

@@ -1,7 +1,12 @@
 'use client';
 
 import { codegenNativeComponent } from 'react-native';
-import type { CodegenTypes as CT, ViewProps, ColorValue } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  HostComponent,
+  ViewProps,
+  ColorValue,
+} from 'react-native';
 
 type DirectionType = 'rtl' | 'ltr';
 
@@ -47,7 +52,7 @@ export interface NativeProps extends ViewProps {
   backTitle?: string | undefined;
   backTitleFontFamily?: string | undefined;
   backTitleFontSize?: CT.Int32 | undefined;
-  backTitleVisible?: CT.WithDefault<boolean, 'true'>;
+  backTitleVisible?: CT.WithDefault<boolean, true>;
   color?: ColorValue | undefined;
   direction?: CT.WithDefault<DirectionType, 'ltr'>;
   hidden?: boolean | undefined;
@@ -96,4 +101,4 @@ export default codegenNativeComponent<NativeProps>(
   {
     interfaceOnly: true,
   },
-);
+) as HostComponent<NativeProps>;

package/src/fabric/legacy/ScreenStackHeaderSubviewNativeComponent.ts

@@ -1,7 +1,11 @@
 'use client';
 
 import { codegenNativeComponent } from 'react-native';
-import type { CodegenTypes as CT, ViewProps } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  HostComponent,
+  ViewProps,
+} from 'react-native';
 
 export type HeaderSubviewTypes =
   | 'back'
@@ -22,4 +26,4 @@ export default codegenNativeComponent<NativeProps>(
   {
     interfaceOnly: true,
   },
-);
+) as HostComponent<NativeProps>;

package/src/fabric/legacy/ScreenStackNativeComponent.ts

@@ -1,7 +1,12 @@
 'use client';
 
 import { codegenNativeComponent } from 'react-native';
-import type { CodegenTypes as CT, ViewProps, ColorValue } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  HostComponent,
+  ViewProps,
+  ColorValue,
+} from 'react-native';
 
 // eslint-disable-next-line @typescript-eslint/ban-types
 type FinishTransitioningEvent = Readonly<{}>;
@@ -14,4 +19,7 @@ export interface NativeProps extends ViewProps {
     | undefined;
 }
 
-export default codegenNativeComponent<NativeProps>('RNSScreenStack', {});
+export default codegenNativeComponent<NativeProps>(
+  'RNSScreenStack',
+  {},
+) as HostComponent<NativeProps>;

package/src/fabric/legacy/SearchBarNativeComponent.ts

@@ -76,15 +76,15 @@ export interface NativeProps extends ViewProps {
 type ComponentType = HostComponent<NativeProps>;
 
 interface NativeCommands {
-  blur: (viewRef: React.ElementRef<ComponentType>) => void;
-  focus: (viewRef: React.ElementRef<ComponentType>) => void;
-  clearText: (viewRef: React.ElementRef<ComponentType>) => void;
+  blur: (instance: React.ComponentRef<ComponentType>) => void;
+  focus: (instance: React.ComponentRef<ComponentType>) => void;
+  clearText: (instance: React.ComponentRef<ComponentType>) => void;
   toggleCancelButton: (
-    viewRef: React.ElementRef<ComponentType>,
+    instance: React.ComponentRef<ComponentType>,
     flag: boolean,
   ) => void;
-  setText: (viewRef: React.ElementRef<ComponentType>, text: string) => void;
-  cancelSearch: (viewRef: React.ElementRef<ComponentType>) => void;
+  setText: (instance: React.ComponentRef<ComponentType>, text: string) => void;
+  cancelSearch: (instance: React.ComponentRef<ComponentType>) => void;
 }
 
 export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({
@@ -98,4 +98,7 @@ export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({
   ],
 });
 
-export default codegenNativeComponent<NativeProps>('RNSSearchBar', {});
+export default codegenNativeComponent<NativeProps>(
+  'RNSSearchBar',
+  {},
+) as HostComponent<NativeProps>;

package/src/fabric/modals/form-sheet/FormSheetContentWrapperNativeComponent.ts

@@ -1,10 +1,10 @@
 'use client';
 
-import type { ViewProps } from 'react-native';
+import type { HostComponent, ViewProps } from 'react-native';
 import { codegenNativeComponent } from 'react-native';
 
 interface NativeProps extends ViewProps {}
 
 export default codegenNativeComponent<NativeProps>(
   'RNSFormSheetContentWrapper',
-);
+) as HostComponent<NativeProps>;

package/src/fabric/modals/form-sheet/FormSheetHostNativeComponent.ts

@@ -1,6 +1,11 @@
 'use client';
 
-import type { CodegenTypes as CT, ColorValue, ViewProps } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  ColorValue,
+  HostComponent,
+  ViewProps,
+} from 'react-native';
 import { codegenNativeComponent } from 'react-native';
 
 // eslint-disable-next-line @typescript-eslint/ban-types
@@ -44,4 +49,4 @@ interface NativeProps extends ViewProps {
 
 export default codegenNativeComponent<NativeProps>('RNSFormSheetHost', {
   interfaceOnly: true,
-});
+}) as HostComponent<NativeProps>;

package/src/fabric/safe-area/SafeAreaViewNativeComponent.ts

@@ -2,7 +2,11 @@
 // https://github.com/AppAndFlow/react-native-safe-area-context/blob/v5.6.1/src/specs/NativeSafeAreaView.ts
 
 import { codegenNativeComponent } from 'react-native';
-import type { CodegenTypes as CT, ViewProps } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  HostComponent,
+  ViewProps,
+} from 'react-native';
 
 type InsetType = 'all' | 'system' | 'interface';
 
@@ -21,4 +25,4 @@ export interface NativeProps extends ViewProps {
 
 export default codegenNativeComponent<NativeProps>('RNSSafeAreaView', {
   interfaceOnly: true,
-});
+}) as HostComponent<NativeProps>;

package/src/fabric/scroll-to-top-guard/ScrollToTopGuardNativeComponent.ts

@@ -0,0 +1,10 @@
+'use client';
+
+import { codegenNativeComponent } from 'react-native';
+import type { HostComponent, ViewProps } from 'react-native';
+
+export interface NativeProps extends ViewProps {}
+
+export default codegenNativeComponent<NativeProps>('RNSScrollToTopGuard', {
+  excludedPlatforms: ['android'],
+}) as HostComponent<NativeProps>;

package/src/fabric/split/SplitHostNativeComponent.ts

@@ -112,7 +112,7 @@ type ComponentType = HostComponent<NativeProps>;
 
 interface NativeCommands {
   showColumn: (
-    viewRef: React.ElementRef<ComponentType>,
+    viewRef: React.ComponentRef<ComponentType>,
     column: string,
   ) => void;
 }
@@ -121,4 +121,7 @@ export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({
   supportedCommands: ['showColumn'],
 });
 
-export default codegenNativeComponent<NativeProps>('RNSSplitHost', {});
+export default codegenNativeComponent<NativeProps>(
+  'RNSSplitHost',
+  {},
+) as HostComponent<NativeProps>;

package/src/fabric/split/SplitScreenNativeComponent.ts

@@ -1,6 +1,10 @@
 'use client';
 
-import type { CodegenTypes as CT, ViewProps } from 'react-native';
+import type {
+  CodegenTypes as CT,
+  HostComponent,
+  ViewProps,
+} from 'react-native';
 import { codegenNativeComponent } from 'react-native';
 
 // eslint-disable-next-line @typescript-eslint/ban-types
@@ -21,4 +25,4 @@ interface NativeProps extends ViewProps {
 
 export default codegenNativeComponent<NativeProps>('RNSSplitScreen', {
   interfaceOnly: true,
-});
+}) as HostComponent<NativeProps>;

package/src/fabric/stack/StackHeaderConfigAndroidNativeComponent.ts

@@ -13,6 +13,14 @@ import type { UnsafeMixed } from '../codegenUtils';
 
 type StackHeaderTypeAndroid = 'small' | 'medium' | 'large';
 
+type StackHeaderTitleHorizontalGravityAndroid = 'start' | 'center' | 'end';
+
+type StackHeaderTitleVerticalGravityAndroid = 'top' | 'center' | 'bottom';
+
+type StackHeaderCollapsedTitleGravityModeAndroid =
+  | 'entireSpace'
+  | 'availableSpace';
+
 export type StackHeaderToolbarMenuItemPressEventAndroid = Readonly<{
   id: string;
 }>;
@@ -84,6 +92,8 @@ export type StackHeaderToolbarMenuElementAndroid =
 
 export interface NativeProps extends ViewProps {
   title?: string | undefined;
+  subtitle?: string | undefined;
+  maxLines?: CT.WithDefault<CT.Int32, 1>;
   hidden?: CT.WithDefault<boolean, false>;
   transparent?: CT.WithDefault<boolean, false>;
   backButtonHidden?: CT.WithDefault<boolean, false>;
@@ -91,18 +101,88 @@ export interface NativeProps extends ViewProps {
   // Android-specific props
   type?: CT.WithDefault<StackHeaderTypeAndroid, 'small'>;
 
+  titleCentered?: CT.WithDefault<boolean, false>;
+  subtitleCentered?: CT.WithDefault<boolean, false>;
+
+  expandedTitleHorizontalGravity?: CT.WithDefault<
+    StackHeaderTitleHorizontalGravityAndroid,
+    'start'
+  >;
+  expandedTitleVerticalGravity?: CT.WithDefault<
+    StackHeaderTitleVerticalGravityAndroid,
+    'bottom'
+  >;
+  collapsedTitleHorizontalGravity?: CT.WithDefault<
+    StackHeaderTitleHorizontalGravityAndroid,
+    'start'
+  >;
+  collapsedTitleVerticalGravity?: CT.WithDefault<
+    StackHeaderTitleVerticalGravityAndroid,
+    'center'
+  >;
+  collapsedTitleGravityMode?: CT.WithDefault<
+    StackHeaderCollapsedTitleGravityModeAndroid,
+    'availableSpace'
+  >;
+
+  contentInsetStart?: CT.WithDefault<CT.Float, -1.0>;
+  contentInsetEnd?: CT.WithDefault<CT.Float, -1.0>;
+
+  titleColor?: ColorValue | undefined;
+  titleFontFamily?: string | undefined;
+  titleFontSize?: CT.WithDefault<CT.Float, -1.0>;
+  titleFontWeight?: string | undefined;
+  titleFontStyle?: string | undefined;
+  subtitleColor?: ColorValue | undefined;
+  subtitleFontFamily?: string | undefined;
+  subtitleFontSize?: CT.WithDefault<CT.Float, -1.0>;
+  subtitleFontWeight?: string | undefined;
+  subtitleFontStyle?: string | undefined;
+  expandedTitleColor?: ColorValue | undefined;
+  expandedTitleFontFamily?: string | undefined;
+  expandedTitleFontSize?: CT.WithDefault<CT.Float, -1.0>;
+  expandedTitleFontWeight?: string | undefined;
+  expandedTitleFontStyle?: string | undefined;
+  collapsedTitleColor?: ColorValue | undefined;
+  collapsedTitleFontFamily?: string | undefined;
+  collapsedTitleFontSize?: CT.WithDefault<CT.Float, -1.0>;
+  collapsedTitleFontWeight?: string | undefined;
+  collapsedTitleFontStyle?: string | undefined;
+  expandedSubtitleColor?: ColorValue | undefined;
+  expandedSubtitleFontFamily?: string | undefined;
+  expandedSubtitleFontSize?: CT.WithDefault<CT.Float, -1.0>;
+  expandedSubtitleFontWeight?: string | undefined;
+  expandedSubtitleFontStyle?: string | undefined;
+  collapsedSubtitleColor?: ColorValue | undefined;
+  collapsedSubtitleFontFamily?: string | undefined;
+  collapsedSubtitleFontSize?: CT.WithDefault<CT.Float, -1.0>;
+  collapsedSubtitleFontWeight?: string | undefined;
+  collapsedSubtitleFontStyle?: string | undefined;
+
   backButtonTintColorNormal?: ColorValue | undefined;
   backButtonTintColorPressed?: ColorValue | undefined;
   backButtonTintColorFocused?: ColorValue | undefined;
   backButtonDrawableIconResourceName?: string | undefined;
   backButtonImageIconResource?: ImageSource | undefined;
 
+  overflowIconTintColorNormal?: ColorValue | undefined;
+  overflowIconTintColorPressed?: ColorValue | undefined;
+  overflowIconTintColorFocused?: ColorValue | undefined;
+  overflowIconDrawableIconResourceName?: string | undefined;
+  overflowIconImageIconResource?: ImageSource | undefined;
+
   scrollFlagScroll?: CT.WithDefault<boolean, false>;
   scrollFlagEnterAlways?: CT.WithDefault<boolean, false>;
   scrollFlagEnterAlwaysCollapsed?: CT.WithDefault<boolean, false>;
   scrollFlagExitUntilCollapsed?: CT.WithDefault<boolean, false>;
   scrollFlagSnap?: CT.WithDefault<boolean, false>;
 
+  liftOnScroll?: CT.WithDefault<boolean, true>;
+
+  backgroundColor?: ColorValue | undefined;
+  scrolledBackgroundColor?: ColorValue | undefined;
+  statusBarScrimColor?: ColorValue | undefined;
+
   toolbarMenu?: UnsafeMixed<StackHeaderToolbarMenuBaseAndroid> | undefined;
   toolbarMenuGroupDividerEnabled?: CT.WithDefault<boolean, false>;
   onToolbarMenuItemPress?:
@@ -142,4 +222,4 @@ export default codegenNativeComponent<NativeProps>(
     interfaceOnly: true,
     excludedPlatforms: ['iOS'],
   },
-);
+) as HostComponent<NativeProps>;

package/src/fabric/stack/StackHeaderConfigIOSNativeComponent.ts

@@ -3,12 +3,38 @@
 import type {
   CodegenTypes as CT,
   HostComponent,
+  ProcessedColorValue,
   ViewProps,
 } from 'react-native';
 import { codegenNativeCommands, codegenNativeComponent } from 'react-native';
-import { PlatformIconIOS } from './StackHeaderItemIOSNativeComponent';
+import type {
+  PlatformIconIOS,
+  StackHeaderMenuIOS,
+} from './StackHeaderItemIOSNativeComponent';
 import { UnsafeMixed } from '../codegenUtils';
 
+type BackButtonDisplayMode = 'default' | 'generic' | 'minimal';
+
+export type HeaderAppearance = {
+  titleFontFamily?: string | undefined;
+  titleFontSize?: CT.Float | undefined;
+  titleFontWeight?: string | undefined;
+  titleFontStyle?: string | undefined;
+  titleFontColor?: ProcessedColorValue | null | undefined;
+
+  largeTitleFontFamily?: string | undefined;
+  largeTitleFontSize?: CT.Float | undefined;
+  largeTitleFontWeight?: string | undefined;
+  largeTitleFontStyle?: string | undefined;
+  largeTitleFontColor?: ProcessedColorValue | null | undefined;
+
+  subtitleFontFamily?: string | undefined;
+  subtitleFontSize?: CT.Float | undefined;
+  subtitleFontWeight?: string | undefined;
+  subtitleFontStyle?: string | undefined;
+  subtitleFontColor?: ProcessedColorValue | null | undefined;
+};
+
 export type MenuItemPressEvent = Readonly<{ menuItemId: string }>;
 
 export type MenuSelectionChangeEvent = Readonly<{
@@ -24,10 +50,21 @@ export interface NativeProps extends ViewProps {
   backButtonHidden?: CT.WithDefault<boolean, false>;
 
   // iOS-specific props
+  backButtonTitle?: string | undefined;
+  backButtonDisplayMode?: CT.WithDefault<BackButtonDisplayMode, 'default'>;
+  backButtonMenuEnabled?: CT.WithDefault<boolean, true>;
+
   largeTitle?: string | undefined;
   largeSubtitle?: string | undefined;
   largeTitleEnabled?: CT.WithDefault<boolean, false>;
 
+  prompt?: string | undefined;
+
+  titleMenu?: UnsafeMixed<StackHeaderMenuIOS> | undefined;
+
+  standardAppearance?: UnsafeMixed<HeaderAppearance> | undefined;
+  scrollEdgeAppearance?: UnsafeMixed<HeaderAppearance> | undefined;
+
   onMenuItemPress?: CT.DirectEventHandler<MenuItemPressEvent> | undefined;
   onMenuSelectionChange?:
     | CT.DirectEventHandler<MenuSelectionChangeEvent>
@@ -68,4 +105,4 @@ export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({
 export default codegenNativeComponent<NativeProps>('RNSStackHeaderConfigIOS', {
   interfaceOnly: true,
   excludedPlatforms: ['android'],
-});
+}) as HostComponent<NativeProps>;

package/src/fabric/stack/StackHeaderItemIOSNativeComponent.ts

@@ -2,6 +2,7 @@
 
 import type {
   CodegenTypes as CT,
+  HostComponent,
   ImageResolvedAssetSource,
   ViewProps,
 } from 'react-native';
@@ -69,6 +70,8 @@ export type PlatformIconIOS =
 export interface NativeProps extends ViewProps {
   placement?: CT.WithDefault<Placement, 'trailing'>;
   itemId?: string | undefined;
+  identifier?: string | undefined;
+  hidesSharedBackground?: CT.WithDefault<boolean, false>;
   title?: string | undefined;
   icon?: UnsafeMixed<PlatformIconIOS> | undefined;
   menu?: UnsafeMixed<StackHeaderMenuIOS> | undefined;
@@ -79,4 +82,4 @@ export interface NativeProps extends ViewProps {
 export default codegenNativeComponent<NativeProps>('RNSStackHeaderItemIOS', {
   interfaceOnly: true,
   excludedPlatforms: ['android'],
-});
+}) as HostComponent<NativeProps>;