react-native-terra-ui 0.11.12 → 0.11.13

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## [0.11.13](https://github.com/earthlin9/react-native-terra-ui/compare/v0.11.12...v0.11.13) (2026-09-18)
+
+### Bug Fixes
+
+* **ui:** [header] avoid iPad window controls ([#26](https://github.com/earthlin9/react-native-terra-ui/issues/26)) ([f11697a](https://github.com/earthlin9/react-native-terra-ui/commit/f11697a4d12b89ee20c71436bc82100216dbe624))
+
 ## [0.11.12](https://github.com/earthlin9/react-native-terra-ui/compare/v0.11.11...v0.11.12) (2026-09-17)
 
 ### Features

package/TerraUI.podspec

@@ -0,0 +1,16 @@
+require "json"
+
+package = JSON.parse(File.read(File.join(__dir__, "package.json")))
+
+Pod::Spec.new do |s|
+  s.name = "TerraUI"
+  s.version = package["version"]
+  s.summary = package["description"]
+  s.homepage = package["homepage"]
+  s.license = package["license"]
+  s.author = package["author"]
+  s.source = { :git => "https://github.com/earthling-std/react-native-terra-ui.git", :tag => "v#{s.version}" }
+  s.platforms = { :ios => "15.1" }
+  s.source_files = "ios/**/*.{h,mm}"
+  install_modules_dependencies(s)
+end

package/ios/TerraHeaderInsetsComponentView.h

@@ -0,0 +1,4 @@
+#import <React/RCTViewComponentView.h>
+
+@interface TerraHeaderInsetsComponentView : RCTViewComponentView
+@end

package/ios/TerraHeaderInsetsComponentView.mm

@@ -0,0 +1,93 @@
+#import "TerraHeaderInsetsComponentView.h"
+
+#import <react/renderer/components/TerraUISpec/ComponentDescriptors.h>
+#import <react/renderer/components/TerraUISpec/EventEmitters.h>
+#import <react/renderer/components/TerraUISpec/Props.h>
+
+using namespace facebook::react;
+
+@implementation TerraHeaderInsetsComponentView {
+  UIEdgeInsets _lastInsets;
+  BOOL _sentInsets;
+}
+
++ (ComponentDescriptorProvider)componentDescriptorProvider
+{
+  return concreteComponentDescriptorProvider<TerraHeaderInsetsComponentDescriptor>();
+}
+
+- (instancetype)initWithFrame:(CGRect)frame
+{
+  if (self = [super initWithFrame:frame]) {
+    _props = std::make_shared<const TerraHeaderInsetsProps>();
+  }
+  return self;
+}
+
+- (void)layoutSubviews
+{
+  [super layoutSubviews];
+  [self reportInsets];
+}
+
+- (void)safeAreaInsetsDidChange
+{
+  [super safeAreaInsetsDidChange];
+  [self setNeedsLayout];
+}
+
+- (void)didMoveToWindow
+{
+  [super didMoveToWindow];
+  [self setNeedsLayout];
+}
+
+- (void)layoutMarginsDidChange
+{
+  [super layoutMarginsDidChange];
+  [self setNeedsLayout];
+}
+
+- (void)updateEventEmitter:(EventEmitter::Shared const &)eventEmitter
+{
+  [super updateEventEmitter:eventEmitter];
+  [self setNeedsLayout];
+}
+
+- (void)prepareForRecycle
+{
+  [super prepareForRecycle];
+  _sentInsets = NO;
+  _lastInsets = UIEdgeInsetsZero;
+}
+
+- (void)reportInsets
+{
+  if (!self.window || !_eventEmitter || CGRectIsEmpty(self.bounds)) {
+    return;
+  }
+
+  UIEdgeInsets insets = UIEdgeInsetsZero;
+#if __IPHONE_OS_VERSION_MAX_ALLOWED >= 260000
+  if (@available(iOS 26.0, *)) {
+    if (self.traitCollection.userInterfaceIdiom == UIUserInterfaceIdiomPad) {
+      // Measure at the bar's actual position, including inside sheets. Using
+      // safeArea rather than margins leaves Terra's spacing tokens in charge.
+      UIViewLayoutRegion *region = [UIViewLayoutRegion
+          safeAreaLayoutRegionWithCornerAdaptation:UIViewLayoutRegionAdaptivityAxisHorizontal];
+      insets = [self edgeInsetsForLayoutRegion:region];
+    }
+  }
+#endif
+  insets.top = 0;
+  insets.bottom = 0;
+  if (_sentInsets && UIEdgeInsetsEqualToEdgeInsets(insets, _lastInsets)) {
+    return;
+  }
+  _sentInsets = YES;
+  _lastInsets = insets;
+  const auto emitter = std::static_pointer_cast<const TerraHeaderInsetsEventEmitter>(_eventEmitter);
+  emitter->onInsetsChange({.left = insets.left, .right = insets.right});
+}
+
+@end

package/lib/module/components/header/parts/HeaderBar.js

@@ -2,13 +2,16 @@
 
 import { View } from "react-native-unistyles/components/native/View";
 import { Text } from "react-native-unistyles/components/native/Text";
+import { useState } from "react";
 import Animated from "react-native-reanimated";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import { FONT_WEIGHT_VALUE } from "../../../utils/typography.js";
+import { resolveScreenPadding } from "../../../theme/screen-padding.js";
 import { Toolbar } from "../../toolbar/index.js";
 import { HeaderDismissButton } from "../header-buttons.js";
 import { isCustomTitle, isTextTitle } from "../utils.js";
 import { HeaderSurface } from "./HeaderSurface.js";
+import { HeaderWindowInsets } from "./HeaderWindowInsets";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /** Shared compact bar. Only the title and background animate; actions stay interactive. */
 export function HeaderBar({
@@ -26,6 +29,10 @@ export function HeaderBar({
   const {
     theme
   } = useUnistyles();
+  const [windowInsets, setWindowInsets] = useState({
+    left: 0,
+    right: 0
+  });
   const _styles = styles;
   {
     const styles = _styles.useVariants({
@@ -37,14 +44,16 @@ export function HeaderBar({
       onDismiss: onDismiss
     });
     return /*#__PURE__*/_jsxs(View, {
-      style: styles.bar,
+      style: [styles.bar, styles.windowInsets(windowInsets.left, windowInsets.right)],
       children: [/*#__PURE__*/_jsx(HeaderSurface, {
         color: color,
         animatedStyle: surfaceStyle
+      }), /*#__PURE__*/_jsx(HeaderWindowInsets, {
+        onInsetsChange: setWindowInsets
       }), (leading != null || dismissAction === "back") && /*#__PURE__*/_jsxs(Toolbar, {
         children: [dismissAction === "back" && dismiss, leading]
       }), /*#__PURE__*/_jsx(Animated.View, {
-        style: [styles.titleContainer, titleStyle],
+        style: [styles.titleContainer, styles.titleInsets(windowInsets.left, windowInsets.right, titleAlignment), titleStyle],
         pointerEvents: isCustomTitle(title) ? "box-none" : "none",
         children: isTextTitle(title) ? String(title).trim().length > 0 && /*#__PURE__*/_jsx(Text, {
           style: styles.title,
@@ -58,7 +67,16 @@ export function HeaderBar({
     });
   }
 }
-const styles = StyleSheet.create(theme => ({
+const styles = StyleSheet.create((theme, runtime) => ({
+  windowInsets: (left, right) => ({
+    paddingLeft: Math.max(resolveScreenPadding(theme, runtime.breakpoint).x, left),
+    paddingRight: Math.max(resolveScreenPadding(theme, runtime.breakpoint).x, right),
+    uni__dependencies: [0, 3]
+  }),
+  titleInsets: (left, right, alignment) => alignment === "center" ? {
+    left,
+    right
+  } : {},
   bar: {
     height: theme.layout.header.height,
     flexDirection: "row",

package/lib/module/components/header/parts/HeaderBar.js.map

@@ -1 +1 @@
-{"version":3,"names":["Animated","StyleSheet","useUnistyles","FONT_WEIGHT_VALUE","Toolbar","HeaderDismissButton","isCustomTitle","isTextTitle","HeaderSurface","jsx","_jsx","jsxs","_jsxs","HeaderBar","title","leading","trailing","titleAlignment","color","surfaceStyle","titleStyle","dismissAction","navigation","onDismiss","theme","_styles","styles","useVariants","dismiss","View","style","bar","children","animatedStyle","titleContainer","pointerEvents","String","trim","length","Text","maxFontSizeMultiplier","typography","variants","create","height","layout","header","flexDirection","alignItems","paddingHorizontal","screen","padding","x","gap","spacing","justifyContent","uni__dependencies","center","marginLeft","left","position","right","flex","fontSize","lineHeight","letterSpacing","fontWeight","textAlign"],"sourceRoot":"../../../../../src","sources":["components/header/parts/HeaderBar.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useState","Animated","StyleSheet","useUnistyles","FONT_WEIGHT_VALUE","resolveScreenPadding","Toolbar","HeaderDismissButton","isCustomTitle","isTextTitle","HeaderSurface","HeaderWindowInsets","jsx","_jsx","jsxs","_jsxs","HeaderBar","title","leading","trailing","titleAlignment","color","surfaceStyle","titleStyle","dismissAction","navigation","onDismiss","theme","windowInsets","setWindowInsets","left","right","_styles","styles","useVariants","dismiss","View","style","bar","children","animatedStyle","onInsetsChange","titleContainer","titleInsets","pointerEvents","String","trim","length","Text","maxFontSizeMultiplier","typography","variants","create","runtime","paddingLeft","Math","max","breakpoint","x","paddingRight","uni__dependencies","alignment","height","layout","header","flexDirection","alignItems","paddingHorizontal","screen","padding","gap","spacing","justifyContent","center","marginLeft","position","flex","fontSize","lineHeight","letterSpacing","fontWeight","textAlign"],"sourceRoot":"../../../../../src","sources":["components/header/parts/HeaderBar.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/header/parts/HeaderWindowInsets.ios.js

@@ -0,0 +1,29 @@
+"use strict";
+
+import { Platform } from "react-native";
+import { StyleSheet } from "react-native-unistyles";
+import TerraHeaderInsets from "../../../specs/TerraHeaderInsetsNativeComponent";
+import { jsx as _jsx } from "react/jsx-runtime";
+export function HeaderWindowInsets({
+  onInsetsChange
+}) {
+  if (Platform.OS !== "ios" || !Platform.isPad || Number.parseInt(String(Platform.Version), 10) < 26) return null;
+  return /*#__PURE__*/_jsx(TerraHeaderInsets, {
+    style: styles.probe,
+    pointerEvents: "none",
+    accessible: false,
+    onInsetsChange: ({
+      nativeEvent
+    }) => onInsetsChange(nativeEvent)
+  });
+}
+const styles = StyleSheet.create(() => ({
+  probe: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0
+  }
+}));
+//# sourceMappingURL=HeaderWindowInsets.ios.js.map

package/lib/module/components/header/parts/HeaderWindowInsets.ios.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Platform","StyleSheet","TerraHeaderInsets","jsx","_jsx","HeaderWindowInsets","onInsetsChange","OS","isPad","Number","parseInt","String","Version","style","styles","probe","pointerEvents","accessible","nativeEvent","create","position","top","left","right","bottom"],"sourceRoot":"../../../../../src","sources":["components/header/parts/HeaderWindowInsets.ios.tsx"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,cAAc;AAEvC,SAASC,UAAU,QAAQ,wBAAwB;AAEnD,OAAOC,iBAAiB;AAAwD,SAAAC,GAAA,IAAAC,IAAA;AAGhF,OAAO,SAASC,kBAAkBA,CAAC;EAAEC;AAAwC,CAAC,EAAE;EAC9E,IAAIN,QAAQ,CAACO,EAAE,KAAK,KAAK,IAAI,CAACP,QAAQ,CAACQ,KAAK,IAAIC,MAAM,CAACC,QAAQ,CAACC,MAAM,CAACX,QAAQ,CAACY,OAAO,CAAC,EAAE,EAAE,CAAC,GAAG,EAAE,EAChG,OAAO,IAAI;EAEb,oBACER,IAAA,CAACF,iBAAiB;IAChBW,KAAK,EAAEC,MAAM,CAACC,KAAM;IACpBC,aAAa,EAAC,MAAM;IACpBC,UAAU,EAAE,KAAM;IAClBX,cAAc,EAAEA,CAAC;MAAEY;IAAY,CAAC,KAAKZ,cAAc,CAACY,WAAW;EAAE,CAClE,CAAC;AAEN;AAEA,MAAMJ,MAAM,GAAGb,UAAU,CAACkB,MAAM,CAAC,OAAO;EACtCJ,KAAK,EAAE;IAAEK,QAAQ,EAAE,UAAU;IAAEC,GAAG,EAAE,CAAC;IAAEC,IAAI,EAAE,CAAC;IAAEC,KAAK,EAAE,CAAC;IAAEC,MAAM,EAAE;EAAE;AACtE,CAAC,CAAC,CAAC","ignoreList":[]}

package/lib/module/components/header/parts/HeaderWindowInsets.js

@@ -0,0 +1,7 @@
+"use strict";
+
+/** Only iPadOS needs the native window-control measurement. */
+export function HeaderWindowInsets(_) {
+  return null;
+}
+//# sourceMappingURL=HeaderWindowInsets.js.map

package/lib/module/components/header/parts/HeaderWindowInsets.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["HeaderWindowInsets","_"],"sourceRoot":"../../../../../src","sources":["components/header/parts/HeaderWindowInsets.tsx"],"mappings":";;AAIA;AACA,OAAO,SAASA,kBAAkBA,CAACC,CAA0B,EAAE;EAC7D,OAAO,IAAI;AACb","ignoreList":[]}

package/lib/module/specs/TerraHeaderInsetsNativeComponent.ts

@@ -0,0 +1,12 @@
+import type { CodegenTypes, ViewProps } from "react-native";
+import { codegenNativeComponent } from "react-native";
+
+export interface NativeProps extends ViewProps {
+  onInsetsChange?: CodegenTypes.DirectEventHandler<
+    Readonly<{ left: CodegenTypes.Double; right: CodegenTypes.Double }>
+  >;
+}
+
+export default codegenNativeComponent<NativeProps>("TerraHeaderInsets", {
+  excludedPlatforms: ["android"],
+});

package/lib/typescript/src/components/header/parts/HeaderBar.d.ts

@@ -1,4 +1,4 @@
-import type { ComponentProps, ReactNode } from "react";
+import { type ComponentProps, type ReactNode } from "react";
 import Animated from "react-native-reanimated";
 import { type HeaderDismissProps } from "../header-buttons.js";
 import { type HeaderSurfaceProps } from "./HeaderSurface.js";

package/lib/typescript/src/components/header/parts/HeaderBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderBar.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,OAAO,QAAQ,MAAM,yBAAyB,CAAC;AAK/C,OAAO,EAAuB,KAAK,kBAAkB,EAAE,MAAM,sBAAmB,CAAC;AAEjF,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,oBAAiB,CAAC;AAEzE,UAAU,cAAe,SAAQ,kBAAkB;IACjD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,cAAc,EAAE,QAAQ,GAAG,MAAM,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC;IACnD,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC;CAC5D;AAED,2FAA2F;AAC3F,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,OAAO,EACP,QAAQ,EACR,cAAc,EACd,KAAK,EACL,YAAY,EACZ,UAAU,EACV,aAAsB,EACtB,UAAU,EACV,SAAS,GACV,EAAE,cAAc,+BAsChB"}
+{"version":3,"file":"HeaderBar.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAY,MAAM,OAAO,CAAC;AAGtE,OAAO,QAAQ,MAAM,yBAAyB,CAAC;AAM/C,OAAO,EAAuB,KAAK,kBAAkB,EAAE,MAAM,sBAAmB,CAAC;AAEjF,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,oBAAiB,CAAC;AAGzE,UAAU,cAAe,SAAQ,kBAAkB;IACjD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,cAAc,EAAE,QAAQ,GAAG,MAAM,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC;IACnD,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC;CAC5D;AAED,2FAA2F;AAC3F,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,OAAO,EACP,QAAQ,EACR,cAAc,EACd,KAAK,EACL,YAAY,EACZ,UAAU,EACV,aAAsB,EACtB,UAAU,EACV,SAAS,GACV,EAAE,cAAc,+BA4ChB"}

package/lib/typescript/src/components/header/parts/HeaderWindowInsets.d.ts

@@ -0,0 +1,9 @@
+export interface HeaderWindowInsetsProps {
+    onInsetsChange: (insets: {
+        left: number;
+        right: number;
+    }) => void;
+}
+/** Only iPadOS needs the native window-control measurement. */
+export declare function HeaderWindowInsets(_: HeaderWindowInsetsProps): null;
+//# sourceMappingURL=HeaderWindowInsets.d.ts.map

package/lib/typescript/src/components/header/parts/HeaderWindowInsets.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderWindowInsets.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderWindowInsets.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,uBAAuB;IACtC,cAAc,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CACnE;AAED,+DAA+D;AAC/D,wBAAgB,kBAAkB,CAAC,CAAC,EAAE,uBAAuB,QAE5D"}

package/lib/typescript/src/components/header/parts/HeaderWindowInsets.ios.d.ts

@@ -0,0 +1,3 @@
+import type { HeaderWindowInsetsProps } from "./HeaderWindowInsets";
+export declare function HeaderWindowInsets({ onInsetsChange }: HeaderWindowInsetsProps): import("react").JSX.Element | null;
+//# sourceMappingURL=HeaderWindowInsets.ios.d.ts.map

package/lib/typescript/src/components/header/parts/HeaderWindowInsets.ios.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderWindowInsets.ios.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderWindowInsets.ios.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AAEpE,wBAAgB,kBAAkB,CAAC,EAAE,cAAc,EAAE,EAAE,uBAAuB,sCAY7E"}

package/lib/typescript/src/specs/TerraHeaderInsetsNativeComponent.d.ts

@@ -0,0 +1,10 @@
+import type { CodegenTypes, ViewProps } from "react-native";
+export interface NativeProps extends ViewProps {
+    onInsetsChange?: CodegenTypes.DirectEventHandler<Readonly<{
+        left: CodegenTypes.Double;
+        right: CodegenTypes.Double;
+    }>>;
+}
+declare const _default: import("react-native/types_generated/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeProps>;
+export default _default;
+//# sourceMappingURL=TerraHeaderInsetsNativeComponent.d.ts.map

package/lib/typescript/src/specs/TerraHeaderInsetsNativeComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TerraHeaderInsetsNativeComponent.d.ts","sourceRoot":"","sources":["../../../../src/specs/TerraHeaderInsetsNativeComponent.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG5D,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,cAAc,CAAC,EAAE,YAAY,CAAC,kBAAkB,CAC9C,QAAQ,CAAC;QAAE,IAAI,EAAE,YAAY,CAAC,MAAM,CAAC;QAAC,KAAK,EAAE,YAAY,CAAC,MAAM,CAAA;KAAE,CAAC,CACpE,CAAC;CACH;;AAED,wBAEG"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-terra-ui",
-  "version": "0.11.12",
+  "version": "0.11.13",
   "description": "Themeable React Native UI components built on react-native-unistyles",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",
@@ -21,6 +21,9 @@
   "files": [
     "src",
     "lib",
+    "ios",
+    "TerraUI.podspec",
+    "react-native.config.js",
     "CHANGELOG.md",
     "!**/__tests__",
     "!**/__fixtures__",
@@ -136,6 +139,16 @@
       }
     }
   },
+  "codegenConfig": {
+    "name": "TerraUISpec",
+    "type": "components",
+    "jsSrcsDir": "src/specs",
+    "ios": {
+      "componentProvider": {
+        "TerraHeaderInsets": "TerraHeaderInsetsComponentView"
+      }
+    }
+  },
   "create-react-native-library": {
     "type": "library",
     "languages": "js",

package/react-native.config.js

@@ -0,0 +1,7 @@
+module.exports = {
+  dependency: {
+    platforms: {
+      android: null,
+    },
+  },
+};

package/src/components/header/parts/HeaderBar.tsx

@@ -1,14 +1,16 @@
-import type { ComponentProps, ReactNode } from "react";
+import { type ComponentProps, type ReactNode, useState } from "react";
 import { Text, View } from "react-native";
 
 import Animated from "react-native-reanimated";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 
 import { FONT_WEIGHT_VALUE } from "#utils/typography";
+import { resolveScreenPadding } from "../../../theme/screen-padding";
 import { Toolbar } from "../../toolbar";
 import { HeaderDismissButton, type HeaderDismissProps } from "../header-buttons";
 import { isCustomTitle, isTextTitle } from "../utils";
 import { HeaderSurface, type HeaderSurfaceProps } from "./HeaderSurface";
+import { HeaderWindowInsets } from "./HeaderWindowInsets";
 
 interface HeaderBarProps extends HeaderDismissProps {
   title?: ReactNode;
@@ -34,13 +36,15 @@ export function HeaderBar({
   onDismiss,
 }: HeaderBarProps) {
   const { theme } = useUnistyles();
+  const [windowInsets, setWindowInsets] = useState({ left: 0, right: 0 });
   styles.useVariants({ titleAlignment });
   const dismiss = (
     <HeaderDismissButton dismissAction={dismissAction} navigation={navigation} onDismiss={onDismiss} />
   );
   return (
-    <View style={styles.bar}>
+    <View style={[styles.bar, styles.windowInsets(windowInsets.left, windowInsets.right)]}>
       <HeaderSurface color={color} animatedStyle={surfaceStyle} />
+      <HeaderWindowInsets onInsetsChange={setWindowInsets} />
       {(leading != null || dismissAction === "back") && (
         <Toolbar>
           {dismissAction === "back" && dismiss}
@@ -48,7 +52,11 @@ export function HeaderBar({
         </Toolbar>
       )}
       <Animated.View
-        style={[styles.titleContainer, titleStyle]}
+        style={[
+          styles.titleContainer,
+          styles.titleInsets(windowInsets.left, windowInsets.right, titleAlignment),
+          titleStyle,
+        ]}
         pointerEvents={isCustomTitle(title) ? "box-none" : "none"}
       >
         {isTextTitle(title)
@@ -72,7 +80,13 @@ export function HeaderBar({
   );
 }
 
-const styles = StyleSheet.create((theme) => ({
+const styles = StyleSheet.create((theme, runtime) => ({
+  windowInsets: (left: number, right: number) => ({
+    paddingLeft: Math.max(resolveScreenPadding(theme, runtime.breakpoint).x, left),
+    paddingRight: Math.max(resolveScreenPadding(theme, runtime.breakpoint).x, right),
+  }),
+  titleInsets: (left: number, right: number, alignment: "center" | "left") =>
+    alignment === "center" ? { left, right } : {},
   bar: {
     height: theme.layout.header.height,
     flexDirection: "row",

package/src/components/header/parts/HeaderWindowInsets.ios.tsx

@@ -0,0 +1,24 @@
+import { Platform } from "react-native";
+
+import { StyleSheet } from "react-native-unistyles";
+
+import TerraHeaderInsets from "../../../specs/TerraHeaderInsetsNativeComponent";
+import type { HeaderWindowInsetsProps } from "./HeaderWindowInsets";
+
+export function HeaderWindowInsets({ onInsetsChange }: HeaderWindowInsetsProps) {
+  if (Platform.OS !== "ios" || !Platform.isPad || Number.parseInt(String(Platform.Version), 10) < 26)
+    return null;
+
+  return (
+    <TerraHeaderInsets
+      style={styles.probe}
+      pointerEvents="none"
+      accessible={false}
+      onInsetsChange={({ nativeEvent }) => onInsetsChange(nativeEvent)}
+    />
+  );
+}
+
+const styles = StyleSheet.create(() => ({
+  probe: { position: "absolute", top: 0, left: 0, right: 0, bottom: 0 },
+}));

package/src/components/header/parts/HeaderWindowInsets.tsx

@@ -0,0 +1,8 @@
+export interface HeaderWindowInsetsProps {
+  onInsetsChange: (insets: { left: number; right: number }) => void;
+}
+
+/** Only iPadOS needs the native window-control measurement. */
+export function HeaderWindowInsets(_: HeaderWindowInsetsProps) {
+  return null;
+}

package/src/specs/TerraHeaderInsetsNativeComponent.ts

@@ -0,0 +1,12 @@
+import type { CodegenTypes, ViewProps } from "react-native";
+import { codegenNativeComponent } from "react-native";
+
+export interface NativeProps extends ViewProps {
+  onInsetsChange?: CodegenTypes.DirectEventHandler<
+    Readonly<{ left: CodegenTypes.Double; right: CodegenTypes.Double }>
+  >;
+}
+
+export default codegenNativeComponent<NativeProps>("TerraHeaderInsets", {
+  excludedPlatforms: ["android"],
+});