@react-navigation/elements 2.0.0-alpha.1 → 2.0.0-alpha.11

package/lib/typescript/src/SafeAreaProviderCompat.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
-import { StyleProp, ViewStyle } from 'react-native';
+import { type StyleProp, type ViewStyle } from 'react-native';
 type Props = {
     children: React.ReactNode;
     style?: StyleProp<ViewStyle>;
 };
-export declare function SafeAreaProviderCompat({ children, style }: Props): JSX.Element;
+export declare function SafeAreaProviderCompat({ children, style }: Props): React.JSX.Element;
 export declare namespace SafeAreaProviderCompat {
     var initialMetrics: import("react-native-safe-area-context").Metrics;
 }

package/lib/typescript/src/SafeAreaProviderCompat.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SafeAreaProviderCompat.d.ts","sourceRoot":"","sources":["../../../src/SafeAreaProviderCompat.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,SAAS,EAGT,SAAS,EACV,MAAM,cAAc,CAAC;AAOtB,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC;AAeF,wBAAgB,sBAAsB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,KAAK,eAehE;yBAfe,sBAAsB"}
+{"version":3,"file":"SafeAreaProviderCompat.d.ts","sourceRoot":"","sources":["../../../src/SafeAreaProviderCompat.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,KAAK,SAAS,EAGd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAOtB,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC;AAeF,wBAAgB,sBAAsB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,KAAK,qBAehE;yBAfe,sBAAsB"}

package/lib/typescript/src/Screen.d.ts

@@ -1,6 +1,6 @@
-import { NavigationProp, ParamListBase, RouteProp } from '@react-navigation/native';
+import { type NavigationProp, type ParamListBase, type RouteProp } from '@react-navigation/native';
 import * as React from 'react';
-import { Animated, StyleProp, ViewStyle } from 'react-native';
+import { Animated, type StyleProp, type ViewStyle } from 'react-native';
 type Props = {
     focused: boolean;
     modal?: boolean;
@@ -13,6 +13,6 @@ type Props = {
     style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
     children: React.ReactNode;
 };
-export declare function Screen(props: Props): JSX.Element;
+export declare function Screen(props: Props): React.JSX.Element;
 export {};
 //# sourceMappingURL=Screen.d.ts.map

package/lib/typescript/src/Screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Screen.d.ts","sourceRoot":"","sources":["../../../src/Screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,cAAc,EAEd,aAAa,EACb,SAAS,EACV,MAAM,0BAA0B,CAAC;AAClC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAC;AAWhF,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,cAAc,CAAC,aAAa,CAAC,CAAC;IAC1C,KAAK,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IAChC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,KAAK,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;IACzD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,wBAAgB,MAAM,CAAC,KAAK,EAAE,KAAK,eA2DlC"}
+{"version":3,"file":"Screen.d.ts","sourceRoot":"","sources":["../../../src/Screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,cAAc,EAEnB,KAAK,aAAa,EAClB,KAAK,SAAS,EACf,MAAM,0BAA0B,CAAC;AAClC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,QAAQ,EACR,KAAK,SAAS,EAGd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAWtB,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,cAAc,CAAC,aAAa,CAAC,CAAC;IAC1C,KAAK,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IAChC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,KAAK,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;IACzD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,wBAAgB,MAAM,CAAC,KAAK,EAAE,KAAK,qBA8DlC"}

package/lib/typescript/src/Text.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { type TextProps } from 'react-native';
+export declare function Text({ style, ...rest }: TextProps): React.JSX.Element;
+//# sourceMappingURL=Text.d.ts.map

package/lib/typescript/src/Text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../src/Text.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAElE,wBAAgB,IAAI,CAAC,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,qBASjD"}

package/lib/typescript/src/getNamedContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getNamedContext.d.ts","sourceRoot":"","sources":["../../../src/getNamedContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,CAAC,MAAM,CAAC;IACb,IAAI,qCAAqC,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC;CAC5E;AAKD,wBAAgB,eAAe,CAAC,CAAC,EAC/B,IAAI,EAAE,MAAM,EACZ,YAAY,EAAE,CAAC,GACd,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAalB"}
+{"version":3,"file":"getNamedContext.d.ts","sourceRoot":"","sources":["../../../src/getNamedContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,CAAC,MAAM,CAAC;IAEb,IAAI,qCAAqC,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC;CAC5E;AAKD,wBAAgB,eAAe,CAAC,CAAC,EAC/B,IAAI,EAAE,MAAM,EACZ,YAAY,EAAE,CAAC,GACd,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAalB"}

package/lib/typescript/src/index.d.ts

@@ -1,4 +1,5 @@
 export { Background } from './Background';
+export { Button } from './Button';
 export { getDefaultSidebarWidth } from './getDefaultSidebarWidth';
 export { getDefaultHeaderHeight } from './Header/getDefaultHeaderHeight';
 export { getHeaderTitle } from './Header/getHeaderTitle';
@@ -6,6 +7,7 @@ export { Header } from './Header/Header';
 export { HeaderBackButton } from './Header/HeaderBackButton';
 export { HeaderBackContext } from './Header/HeaderBackContext';
 export { HeaderBackground } from './Header/HeaderBackground';
+export { HeaderButton } from './Header/HeaderButton';
 export { HeaderHeightContext } from './Header/HeaderHeightContext';
 export { HeaderShownContext } from './Header/HeaderShownContext';
 export { HeaderTitle } from './Header/HeaderTitle';
@@ -17,6 +19,7 @@ export { PlatformPressable } from './PlatformPressable';
 export { ResourceSavingView } from './ResourceSavingView';
 export { SafeAreaProviderCompat } from './SafeAreaProviderCompat';
 export { Screen } from './Screen';
+export { Text } from './Text';
 export declare const Assets: any[];
 export * from './types';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,sBAAsB,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,eAAO,MAAM,MAAM,OAKlB,CAAC;AAEF,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,sBAAsB,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,eAAO,MAAM,MAAM,OAKlB,CAAC;AAEF,cAAc,SAAS,CAAC"}

package/lib/typescript/src/types.d.ts

@@ -140,6 +140,26 @@ export type HeaderTitleProps = {
     style?: Animated.WithAnimatedValue<StyleProp<TextStyle>>;
 };
 export type HeaderButtonProps = {
+    /**
+     * Callback to call when the button is pressed.
+     */
+    onPress?: () => void;
+    /**
+     * The `href` to use for the anchor tag on web
+     */
+    href?: string;
+    /**
+     * Whether the button is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Accessibility label for the button for screen readers.
+     */
+    accessibilityLabel?: string;
+    /**
+     * ID to locate this button in tests.
+     */
+    testID?: string;
     /**
      * Tint color for the header button.
      */
@@ -153,19 +173,15 @@ export type HeaderButtonProps = {
      */
     pressOpacity?: number;
     /**
-     * Whether it's possible to navigate back in stack.
-     */
-    canGoBack?: boolean;
-};
-export type HeaderBackButtonProps = HeaderButtonProps & {
-    /**
-     * Whether the button is disabled.
+     * Style object for the button.
      */
-    disabled?: boolean;
+    style?: StyleProp<ViewStyle>;
     /**
-     * Callback to call when the button is pressed.
+     * Content to render for the button. Usually the icon.
      */
-    onPress?: () => void;
+    children: React.ReactNode;
+};
+export type HeaderBackButtonProps = Omit<HeaderButtonProps, 'children'> & {
     /**
      * Function which returns a React Element to display custom image in header's back button.
      */
@@ -206,17 +222,5 @@ export type HeaderBackButtonProps = HeaderButtonProps & {
      * Layout of the title element in the header.
      */
     titleLayout?: Layout;
-    /**
-     * Accessibility label for the button for screen readers.
-     */
-    accessibilityLabel?: string;
-    /**
-     * ID to locate this button in tests.
-     */
-    testID?: string;
-    /**
-     * Style object for the button.
-     */
-    style?: StyleProp<ViewStyle>;
 };
 //# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/elements",
   "description": "UI Components for React Navigation",
-  "version": "2.0.0-alpha.1",
+  "version": "2.0.0-alpha.11",
   "keywords": [
     "react-native",
     "react-navigation",
@@ -36,23 +36,25 @@
     "prepack": "bob build",
     "clean": "del lib"
   },
+  "dependencies": {
+    "color": "^4.2.3"
+  },
   "devDependencies": {
-    "@react-native-masked-view/masked-view": "0.2.9",
-    "@react-navigation/native": "^7.0.0-alpha.3",
-    "@testing-library/react-native": "^11.5.0",
-    "@types/react": "~18.0.27",
-    "@types/react-native": "~0.70.8",
-    "del-cli": "^5.0.0",
+    "@react-native-masked-view/masked-view": "0.3.0",
+    "@react-navigation/native": "^7.0.0-alpha.13",
+    "@testing-library/react-native": "^12.4.3",
+    "@types/react": "~18.2.45",
+    "del-cli": "^5.1.0",
     "react": "18.2.0",
-    "react-native": "0.71.8",
-    "react-native-builder-bob": "^0.21.0",
-    "typescript": "^4.9.4"
+    "react-native": "0.73.2",
+    "react-native-builder-bob": "^0.23.2",
+    "typescript": "^5.3.3"
   },
   "peerDependencies": {
-    "@react-navigation/native": "^6.0.0",
-    "react": "*",
-    "react-native": "*",
-    "react-native-safe-area-context": ">= 3.0.0"
+    "@react-navigation/native": "^7.0.0-alpha.13",
+    "react": ">= 18.2.0",
+    "react-native": ">= 0.72.0",
+    "react-native-safe-area-context": ">= 4.0.0"
   },
   "react-native-builder-bob": {
     "source": "src",
@@ -68,5 +70,5 @@
       ]
     ]
   },
-  "gitHead": "17d212fd04d2c8d000f9fc38ae7ab9e888a0111d"
+  "gitHead": "e5eacec2515bbc499c7936df387da7cc0198ed9e"
 }

package/src/Background.tsx

@@ -1,6 +1,11 @@
 import { useTheme } from '@react-navigation/native';
 import * as React from 'react';
-import { Animated, StyleProp, ViewProps, ViewStyle } from 'react-native';
+import {
+  Animated,
+  type StyleProp,
+  type ViewProps,
+  type ViewStyle,
+} from 'react-native';
 
 type Props = Omit<ViewProps, 'style'> & {
   style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;

package/src/Button.tsx

@@ -0,0 +1,99 @@
+import { useLinkProps, useTheme } from '@react-navigation/native';
+import Color from 'color';
+import * as React from 'react';
+import { StyleSheet } from 'react-native';
+
+import {
+  PlatformPressable,
+  type Props as PlatformPressableProps,
+} from './PlatformPressable';
+import { Text } from './Text';
+
+type BaseProps = Omit<PlatformPressableProps, 'children'> & {
+  variant?: 'plain' | 'tinted' | 'filled';
+  color?: string;
+  children: string | string[];
+};
+
+type LinkProps = Omit<BaseProps, 'onPress'> &
+  Parameters<typeof useLinkProps>[0];
+
+const BUTTON_RADIUS = 40;
+
+export function Button(props: BaseProps | LinkProps) {
+  if ('screen' in props || 'action' in props) {
+    return <ButtonLink {...props} />;
+  } else {
+    return <ButtonBase {...props} />;
+  }
+}
+
+function ButtonLink({ screen, params, action, href, ...rest }: LinkProps) {
+  // @ts-expect-error: This is already type-checked by the prop types
+  const props = useLinkProps({ screen, params, action, href });
+
+  return <ButtonBase {...rest} {...props} />;
+}
+
+function ButtonBase({
+  variant = 'tinted',
+  color: customColor,
+  android_ripple,
+  style,
+  children,
+  ...rest
+}: BaseProps) {
+  const { colors, fonts } = useTheme();
+
+  const color = customColor ?? colors.primary;
+
+  let backgroundColor;
+  let textColor;
+
+  switch (variant) {
+    case 'plain':
+      backgroundColor = 'transparent';
+      textColor = color;
+      break;
+    case 'tinted':
+      backgroundColor = Color(color).fade(0.85).string();
+      textColor = color;
+      break;
+    case 'filled':
+      backgroundColor = color;
+      textColor = Color(color).isDark()
+        ? 'white'
+        : Color(color).darken(0.71).string();
+      break;
+  }
+
+  return (
+    <PlatformPressable
+      {...rest}
+      style={[{ backgroundColor }, styles.button, style]}
+      android_ripple={{
+        radius: BUTTON_RADIUS,
+        color: Color(textColor).fade(0.85).string(),
+        ...android_ripple,
+      }}
+    >
+      <Text style={[{ color: textColor }, fonts.regular, styles.text]}>
+        {children}
+      </Text>
+    </PlatformPressable>
+  );
+}
+
+const styles = StyleSheet.create({
+  button: {
+    paddingHorizontal: 24,
+    paddingVertical: 10,
+    borderRadius: BUTTON_RADIUS,
+  },
+  text: {
+    fontSize: 14,
+    lineHeight: 20,
+    letterSpacing: 0.1,
+    textAlign: 'center',
+  },
+});

package/src/Header/Header.tsx

@@ -1,5 +1,11 @@
 import * as React from 'react';
-import { Animated, Platform, StyleSheet, View, ViewStyle } from 'react-native';
+import {
+  Animated,
+  Platform,
+  StyleSheet,
+  View,
+  type ViewStyle,
+} from 'react-native';
 import {
   useSafeAreaFrame,
   useSafeAreaInsets,
@@ -48,6 +54,10 @@ export function Header(props: Props) {
 
   const isParentHeaderShown = React.useContext(HeaderShownContext);
 
+  // On models with Dynamic Island the status bar height is smaller than the safe area top inset.
+  const hasDynamicIsland = Platform.OS === 'ios' && insets.top > 50;
+  const statusBarHeight = hasDynamicIsland ? insets.top - 5 : insets.top;
+
   const {
     layout = frame,
     modal = false,
@@ -73,7 +83,7 @@ export function Header(props: Props) {
     headerShadowVisible,
     headerPressColor,
     headerPressOpacity,
-    headerStatusBarHeight = isParentHeaderShown ? 0 : insets.top,
+    headerStatusBarHeight = isParentHeaderShown ? 0 : statusBarHeight,
   } = props;
 
   const defaultHeight = getDefaultHeaderHeight(
@@ -170,7 +180,7 @@ export function Header(props: Props) {
   for (const styleProp in safeStyles) {
     // @ts-expect-error: typescript wrongly complains that styleProp cannot be used to index safeStyles
     if (safeStyles[styleProp] === undefined) {
-      // @ts-expect-error
+      // @ts-expect-error don't need to care about index signature for deletion
       // eslint-disable-next-line @typescript-eslint/no-dynamic-delete
       delete safeStyles[styleProp];
     }
@@ -210,14 +220,13 @@ export function Header(props: Props) {
       : customTitle;
 
   return (
-    <React.Fragment>
+    <Animated.View
+      pointerEvents="box-none"
+      style={[{ height, minHeight, maxHeight, opacity, transform }]}
+    >
       <Animated.View
         pointerEvents="box-none"
-        style={[
-          StyleSheet.absoluteFill,
-          { zIndex: 0 },
-          backgroundContainerStyle,
-        ]}
+        style={[StyleSheet.absoluteFill, backgroundContainerStyle]}
       >
         {headerBackground ? (
           headerBackground({ style: backgroundStyle })
@@ -225,69 +234,67 @@ export function Header(props: Props) {
           <HeaderBackground style={backgroundStyle} />
         )}
       </Animated.View>
-      <Animated.View
-        pointerEvents="box-none"
-        style={[{ height, minHeight, maxHeight, opacity, transform }]}
-      >
-        <View pointerEvents="none" style={{ height: headerStatusBarHeight }} />
-        <View pointerEvents="box-none" style={styles.content}>
-          <Animated.View
-            pointerEvents="box-none"
-            style={[
-              styles.left,
-              headerTitleAlign === 'center' && styles.expand,
-              { marginStart: insets.left },
-              leftContainerStyle,
-            ]}
-          >
-            {leftButton}
-          </Animated.View>
-          <Animated.View
-            pointerEvents="box-none"
-            style={[
-              styles.title,
-              {
-                // Avoid the title from going offscreen or overlapping buttons
-                maxWidth:
-                  headerTitleAlign === 'center'
-                    ? layout.width -
-                      ((leftButton
-                        ? headerLeftLabelVisible !== false
-                          ? 80
-                          : 32
-                        : 16) +
-                        Math.max(insets.left, insets.right)) *
-                        2
-                    : layout.width -
-                      ((leftButton ? 72 : 16) +
-                        (rightButton ? 72 : 16) +
-                        insets.left -
-                        insets.right),
-              },
-              titleContainerStyle,
-            ]}
-          >
-            {headerTitle({
-              children: title,
-              allowFontScaling: titleAllowFontScaling,
-              tintColor: headerTintColor,
-              style: titleStyle,
-            })}
-          </Animated.View>
-          <Animated.View
-            pointerEvents="box-none"
-            style={[
-              styles.right,
-              styles.expand,
-              { marginEnd: insets.right },
-              rightContainerStyle,
-            ]}
-          >
-            {rightButton}
-          </Animated.View>
-        </View>
-      </Animated.View>
-    </React.Fragment>
+      <View pointerEvents="none" style={{ height: headerStatusBarHeight }} />
+      <View pointerEvents="box-none" style={styles.content}>
+        <Animated.View
+          pointerEvents="box-none"
+          style={[
+            styles.left,
+            headerTitleAlign === 'center' && styles.expand,
+            { marginStart: insets.left },
+            leftContainerStyle,
+          ]}
+        >
+          {leftButton}
+        </Animated.View>
+        <Animated.View
+          pointerEvents="box-none"
+          style={[
+            styles.title,
+            {
+              // Avoid the title from going offscreen or overlapping buttons
+              maxWidth:
+                headerTitleAlign === 'center'
+                  ? layout.width -
+                    ((leftButton
+                      ? headerLeftLabelVisible !== false
+                        ? 80
+                        : 32
+                      : 16) +
+                      Math.max(insets.left, insets.right)) *
+                      2
+                  : layout.width -
+                    ((leftButton ? 72 : 16) +
+                      (rightButton ? 72 : 16) +
+                      insets.left -
+                      insets.right),
+            },
+            headerTitleAlign === 'left' && leftButton
+              ? { marginLeft: 4 }
+              : null,
+            titleContainerStyle,
+          ]}
+        >
+          {headerTitle({
+            children: title,
+            allowFontScaling: titleAllowFontScaling,
+            tintColor: headerTintColor,
+            style: titleStyle,
+          })}
+        </Animated.View>
+        <Animated.View
+          pointerEvents="box-none"
+          style={[
+            styles.right,
+            styles.expand,
+            { marginEnd: insets.right },
+            rightContainerStyle,
+          ]}
+        >
+          {rightButton}
+        </Animated.View>
+      </View>
+    </Animated.View>
   );
 }