@react-navigation/native 8.0.0-alpha.11 → 8.0.0-alpha.12

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

@@ -13,70 +13,64 @@ export declare function useBuildAction(): (href: string) => {
             key: string;
             index: number;
             routeNames: string[];
-            history?: unknown[];
+            history?: unknown[] | undefined;
             routes: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>[];
             type: string;
             stale: false;
         }>>;
-        path?: string;
+        path?: string | undefined;
     };
 } | {
     type: "GO_BACK";
-    source?: string;
-    target?: string;
+    source?: string | undefined;
+    target?: string | undefined;
 } | {
     type: "NAVIGATE";
     payload: {
         name: string;
-        params?: object;
-        path
-        /**
-         * Helper to build a href for a screen based on the linking options.
-         */
-        ? /**
-         * Helper to build a href for a screen based on the linking options.
-         */: string;
-        merge?: boolean;
-        pop?: boolean;
+        params?: object | undefined;
+        path?: string | undefined;
+        merge?: boolean | undefined;
+        pop?: boolean | undefined;
     };
-    source?: string;
-    target?: string;
+    source?: string | undefined;
+    target?: string | undefined;
 } | {
     type: "SET_PARAMS";
     payload: {
-        params?: object;
+        params?: object | undefined;
     };
-    source?: string;
-    target?: string;
+    source?: string | undefined;
+    target?: string | undefined;
 } | {
     type: "REPLACE_PARAMS";
     payload: {
-        params?: object;
+        params?: object | undefined;
     };
-    source?: string;
-    target?: string;
+    source?: string | undefined;
+    target?: string | undefined;
 } | {
     type: "PUSH_PARAMS";
     payload: {
-        params?: object;
+        params?: object | undefined;
     };
-    source?: string;
-    target?: string;
+    source?: string | undefined;
+    target?: string | undefined;
 } | {
     type: "PRELOAD";
     payload: {
         name: string;
-        params?: object;
+        params?: object | undefined;
     };
-    source?: string;
-    target?: string;
+    source?: string | undefined;
+    target?: string | undefined;
 } | {
     readonly type: "RESET";
-    readonly payload: (Readonly<{
+    readonly payload: Readonly<{
         key: string;
         index: number;
         routeNames: string[];
-        history?: unknown[];
+        history?: unknown[] | undefined;
         routes: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>[];
         type: string;
         stale: false;
@@ -84,7 +78,7 @@ export declare function useBuildAction(): (href: string) => {
         key: string;
         index: number;
         routeNames: string[];
-        history?: unknown[];
+        history?: unknown[] | undefined;
         routes: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>[];
         type: string;
         stale: false;
@@ -92,13 +86,13 @@ export declare function useBuildAction(): (href: string) => {
         key: string;
         index: number;
         routeNames: string[];
-        history?: unknown[];
+        history?: unknown[] | undefined;
         routes: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>[];
         type: string;
         stale: false;
     }>, "routes"> & {
         routes: Omit<import("@react-navigation/routers").Route<string>, "key">[];
-    })) | undefined;
+    });
 };
 /**
  * Helpers to build href or action based on the linking options.
@@ -115,70 +109,64 @@ export declare function useLinkBuilder(): {
                 key: string;
                 index: number;
                 routeNames: string[];
-                history?: unknown[];
+                history?: unknown[] | undefined;
                 routes: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>[];
                 type: string;
                 stale: false;
             }>>;
-            path?: string;
+            path?: string | undefined;
         };
     } | {
         type: "GO_BACK";
-        source?: string;
-        target?: string;
+        source?: string | undefined;
+        target?: string | undefined;
     } | {
         type: "NAVIGATE";
         payload: {
             name: string;
-            params?: object;
-            path
-            /**
-             * Helper to build a href for a screen based on the linking options.
-             */
-            ? /**
-             * Helper to build a href for a screen based on the linking options.
-             */: string;
-            merge?: boolean;
-            pop?: boolean;
+            params?: object | undefined;
+            path?: string | undefined;
+            merge?: boolean | undefined;
+            pop?: boolean | undefined;
         };
-        source?: string;
-        target?: string;
+        source?: string | undefined;
+        target?: string | undefined;
     } | {
         type: "SET_PARAMS";
         payload: {
-            params?: object;
+            params?: object | undefined;
         };
-        source?: string;
-        target?: string;
+        source?: string | undefined;
+        target?: string | undefined;
     } | {
         type: "REPLACE_PARAMS";
         payload: {
-            params?: object;
+            params?: object | undefined;
         };
-        source?: string;
-        target?: string;
+        source?: string | undefined;
+        target?: string | undefined;
     } | {
         type: "PUSH_PARAMS";
         payload: {
-            params?: object;
+            params?: object | undefined;
         };
-        source?: string;
-        target?: string;
+        source?: string | undefined;
+        target?: string | undefined;
     } | {
         type: "PRELOAD";
         payload: {
             name: string;
-            params?: object;
+            params?: object | undefined;
         };
-        source?: string;
-        target?: string;
+        source?: string | undefined;
+        target?: string | undefined;
     } | {
         readonly type: "RESET";
-        readonly payload: (Readonly<{
+        readonly payload: Readonly<{
             key: string;
             index: number;
             routeNames: string[];
-            history?: unknown[];
+            history?: unknown[] | undefined;
             routes: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>[];
             type: string;
             stale: false;
@@ -186,7 +174,7 @@ export declare function useLinkBuilder(): {
             key: string;
             index: number;
             routeNames: string[];
-            history?: unknown[];
+            history?: unknown[] | undefined;
             routes: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>[];
             type: string;
             stale: false;
@@ -194,13 +182,13 @@ export declare function useLinkBuilder(): {
             key: string;
             index: number;
             routeNames: string[];
-            history?: unknown[];
+            history?: unknown[] | undefined;
             routes: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>[];
             type: string;
             stale: false;
         }>, "routes"> & {
             routes: Omit<import("@react-navigation/routers").Route<string>, "key">[];
-        })) | undefined;
+        });
     };
 };
 //# sourceMappingURL=useLinkBuilder.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useLinkBuilder.d.ts","sourceRoot":"","sources":["../../../src/useLinkBuilder.tsx"],"names":[],"mappings":"AAkBA;;GAEG;AACH,wBAAgB,YAAY,WAWjB,MAAM,WAAW,MAAM,wBAmEjC;AAED;;GAEG;AACH,wBAAgB,cAAc,WAOnB,MAAM;;;;;;;;;;;;;;;;;;;;;;;cAhGgC,CAAC;;QAGlD;;WAEG;QACH,CAHA,CAAA;;WAEG;aADgB,CAAC;WAAsB,CAAC;;;;;;;cAQxB,CAAC;;;;;;;cAKhB,CAAH;;;;;;;cAK0B,CAAC;;;;;;;;cAGmB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwF/C;AAED;;;;GAIG;AACH,wBAAgB,cAAc;sBAvGnB,MAAM,WAAW,MAAM;wBA+EvB,MAAM;;;;;;;;;;;;;;;;;;;;;;;kBAhGgC,CAAC;;YAGlD;;eAEG;YACH,CAHA,CAAA;;eAEG;iBADgB,CAAC;eAAsB,CAAC;;;;;;;kBAQxB,CAAC;;;;;;;kBAKhB,CAAH;;;;;;;kBAK0B,CAAC;;;;;;;;kBAGmB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuG/C"}
+{"version":3,"file":"useLinkBuilder.d.ts","sourceRoot":"","sources":["../../../src/useLinkBuilder.tsx"],"names":[],"mappings":"AAwBA;;GAEG;AACH,wBAAgB,YAAY,WAWjB,MAAM,WAAW,MAAM,wBAmEjC;AAED;;GAEG;AACH,wBAAgB,cAAc,WAOnB,MAAM;;;;;;;;;;;;;;;;;;;;;;;cAlGX,CAAL;YAAkC,CAAC;aAMzB,CAAC;WAAkC,CAAC;;;;;;;cAUxB,CAAC;;;;;;;cAKhB,CAAA;;;;;;;cAMK,CAAC;;;;;;;;cAIJ,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoFT;AAED;;;;GAIG;AACH,wBAAgB,cAAc;sBAvGnB,MAAM,WAAW,MAAM;wBA+EvB,MAAM;;;;;;;;;;;;;;;;;;;;;;;kBAlGX,CAAL;gBAAkC,CAAC;iBAMzB,CAAC;eAAkC,CAAC;;;;;;;kBAUxB,CAAC;;;;;;;kBAKhB,CAAA;;;;;;;kBAMK,CAAC;;;;;;;;kBAIJ,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmGT"}

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

@@ -1 +1 @@
-{"version":3,"file":"useLinkProps.d.ts","sourceRoot":"","sources":["../../../src/useLinkProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,gBAAgB,EAKrB,KAAK,aAAa,EACnB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,qBAAqB,EAAY,MAAM,cAAc,CAAC;AAIpE,MAAM,MAAM,SAAS,CACnB,SAAS,SAAS,EAAE,GAAG,aAAa,EACpC,SAAS,SAAS,MAAM,SAAS,GAAG,MAAM,SAAS,IAEjD,CAAC;IACC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,gBAAgB,CAAC;CAC3B,GAAG,CAAC,SAAS,SAAS,OAAO,GAC1B,SAAS,SAAS,SAAS,CAAC,SAAS,CAAC,GACpC;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,MAAM,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAAE,GACpD;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAAE,GACrD,KAAK,CAAC,CAAC,GACX;IACE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,gBAAgB,CAAC;IACzB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AA+BN;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAC1B,KAAK,CAAC,SAAS,SAAS,EAAE,GAAG,aAAa,EAC1C,KAAK,CAAC,SAAS,SAAS,MAAM,SAAS,GAAG,MAAM,SAAS,EACzD,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,SAAS,CAAC,SAAS,EAAE,SAAS,CAAC;;;kBAM3D,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,GAAG,qBAAqB;EAwG9E"}
+{"version":3,"file":"useLinkProps.d.ts","sourceRoot":"","sources":["../../../src/useLinkProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,gBAAgB,EAGrB,KAAK,aAAa,EACnB,MAAM,wBAAwB,CAAC;AAChC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,qBAAqB,EAAY,MAAM,cAAc,CAAC;AAIpE,MAAM,MAAM,SAAS,CACnB,SAAS,SAAS,EAAE,GAAG,aAAa,EACpC,SAAS,SAAS,MAAM,SAAS,GAAG,MAAM,SAAS,IAEjD,CAAC;IACC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,gBAAgB,CAAC;CAC3B,GAAG,CAAC,SAAS,SAAS,OAAO,GAC1B,SAAS,SAAS,SAAS,CAAC,SAAS,CAAC,GACpC;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,MAAM,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAAE,GACpD;IAAE,MAAM,EAAE,SAAS,CAAC;IAAC,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAAE,GACrD,KAAK,CAAC,CAAC,GACX;IACE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,gBAAgB,CAAC;IACzB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AAEN;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAC1B,KAAK,CAAC,SAAS,SAAS,EAAE,GAAG,aAAa,EAC1C,KAAK,CAAC,SAAS,SAAS,MAAM,SAAS,GAAG,MAAM,SAAS,EACzD,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,SAAS,CAAC,SAAS,EAAE,SAAS,CAAC;;;kBAM3D,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,GAAG,qBAAqB;EAuG9E"}

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

@@ -12,46 +12,46 @@ export declare function useLinking(ref: React.RefObject<NavigationContainerRef<P
         key: string;
         index: number;
         routeNames: string[];
-        history?: unknown[];
+        history?: unknown[] | undefined;
         routes: import("@react-navigation/routers").NavigationRoute<ParamListBase, string>[];
         type: string;
         stale: false;
     }>, "stale" | "routes">> & Readonly<{
-        stale?: true;
+        stale?: true | undefined;
         routes: import("@react-navigation/routers").PartialRoute<Readonly<{
             key: string;
             name: string;
-            path?: string;
+            path?: string | undefined;
             history?: {
                 type: "params";
                 params: object;
-            }[];
+            }[] | undefined;
         } & Readonly<{
             params?: Readonly<object | undefined>;
         }>>>[];
     }> & {
-        state?: Partial<Omit<Readonly<{
+        state?: (Partial<Omit<Readonly<{
             key: string;
             index: number;
             routeNames: string[];
-            history?: unknown[];
+            history?: unknown[] | undefined;
             routes: import("@react-navigation/routers").NavigationRoute<ParamListBase, string>[];
             type: string;
             stale: false;
         }>, "stale" | "routes">> & Readonly<{
-            stale?: true;
+            stale?: true | undefined;
             routes: import("@react-navigation/routers").PartialRoute<Readonly<{
                 key: string;
                 name: string;
-                path?: string;
+                path?: string | undefined;
                 history?: {
                     type: "params";
                     params: object;
-                }[];
+                }[] | undefined;
             } & Readonly<{
                 params?: Readonly<object | undefined>;
             }>>>[];
-        }> & /*elided*/ any;
+        }> & /*elided*/ any) | undefined;
     }) | undefined>;
 };
 export {};

package/lib/typescript/src/useLinking.native.d.ts

@@ -8,90 +8,90 @@ export declare function useLinking(ref: React.RefObject<NavigationContainerRef<P
         key: string;
         index: number;
         routeNames: string[];
-        history?: unknown[];
+        history?: unknown[] | undefined;
         routes: import("@react-navigation/routers").NavigationRoute<ParamListBase, string>[];
         type: string;
         stale: false;
     }>, "stale" | "routes">> & Readonly<{
-        stale?: true;
+        stale?: true | undefined;
         routes: import("@react-navigation/routers").PartialRoute<Readonly<{
             key: string;
             name: string;
-            path?: string;
+            path?: string | undefined;
             history?: {
                 type: "params";
                 params: object;
-            }[];
+            }[] | undefined;
         } & Readonly<{
             params?: Readonly<object | undefined>;
         }>>>[];
     }> & {
-        state?: Partial<Omit<Readonly<{
+        state?: (Partial<Omit<Readonly<{
             key: string;
             index: number;
             routeNames: string[];
-            history?: unknown[];
+            history?: unknown[] | undefined;
             routes: import("@react-navigation/routers").NavigationRoute<ParamListBase, string>[];
             type: string;
             stale: false;
         }>, "stale" | "routes">> & Readonly<{
-            stale?: true;
+            stale?: true | undefined;
             routes: import("@react-navigation/routers").PartialRoute<Readonly<{
                 key: string;
                 name: string;
-                path?: string;
+                path?: string | undefined;
                 history?: {
                     type: "params";
                     params: object;
-                }[];
+                }[] | undefined;
             } & Readonly<{
                 params?: Readonly<object | undefined>;
             }>>>[];
-        }> & /*elided*/ any;
+        }> & /*elided*/ any) | undefined;
     }) | undefined> | Promise<(Partial<Omit<Readonly<{
         key: string;
         index: number;
         routeNames: string[];
-        history?: unknown[];
+        history?: unknown[] | undefined;
         routes: import("@react-navigation/routers").NavigationRoute<ParamListBase, string>[];
         type: string;
         stale: false;
     }>, "stale" | "routes">> & Readonly<{
-        stale?: true;
+        stale?: true | undefined;
         routes: import("@react-navigation/routers").PartialRoute<Readonly<{
             key: string;
             name: string;
-            path?: string;
+            path?: string | undefined;
             history?: {
                 type: "params";
                 params: object;
-            }[];
+            }[] | undefined;
         } & Readonly<{
             params?: Readonly<object | undefined>;
         }>>>[];
     }> & {
-        state?: Partial<Omit<Readonly<{
+        state?: (Partial<Omit<Readonly<{
             key: string;
             index: number;
             routeNames: string[];
-            history?: unknown[];
+            history?: unknown[] | undefined;
             routes: import("@react-navigation/routers").NavigationRoute<ParamListBase, string>[];
             type: string;
             stale: false;
         }>, "stale" | "routes">> & Readonly<{
-            stale?: true;
+            stale?: true | undefined;
             routes: import("@react-navigation/routers").PartialRoute<Readonly<{
                 key: string;
                 name: string;
-                path?: string;
+                path?: string | undefined;
                 history?: {
                     type: "params";
                     params: object;
-                }[];
+                }[] | undefined;
             } & Readonly<{
                 params?: Readonly<object | undefined>;
             }>>>[];
-        }> & /*elided*/ any;
+        }> & /*elided*/ any) | undefined;
     }) | undefined>;
 };
 export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-navigation/native",
   "description": "React Native integration for React Navigation",
-  "version": "8.0.0-alpha.11",
+  "version": "8.0.0-alpha.12",
   "keywords": [
     "react-native",
     "react-navigation",
@@ -57,7 +57,7 @@
     "clean": "del lib"
   },
   "dependencies": {
-    "@react-navigation/core": "^8.0.0-alpha.4",
+    "@react-navigation/core": "^8.0.0-alpha.5",
     "escape-string-regexp": "^4.0.0",
     "fast-deep-equal": "^3.1.3",
     "nanoid": "^3.3.11",
@@ -66,15 +66,15 @@
   },
   "devDependencies": {
     "@jest/globals": "^30.0.0",
-    "@testing-library/react-native": "^13.2.1",
-    "@types/react": "~19.1.10",
+    "@testing-library/react-native": "^13.3.3",
+    "@types/react": "~19.2.2",
     "@types/react-dom": "~19.1.7",
     "del-cli": "^6.0.0",
-    "react": "19.1.0",
-    "react-dom": "19.1.0",
-    "react-native": "0.81.4",
+    "react": "19.2.0",
+    "react-dom": "19.2.0",
+    "react-native": "0.83.2",
     "react-native-builder-bob": "^0.40.12",
-    "react-test-renderer": "19.1.0",
+    "react-test-renderer": "19.2.0",
     "typescript": "^5.9.2"
   },
   "peerDependencies": {
@@ -114,9 +114,12 @@
       "components": {
         "ReactNavigationSFSymbolView": {
           "className": "ReactNavigationSFSymbolView"
+        },
+        "ReactNavigationCornerInsetView": {
+          "className": "ReactNavigationCornerInsetView"
         }
       }
     }
   },
-  "gitHead": "faad2ee23945a5a27090cfb837a35d1db25147ab"
+  "gitHead": "4ac6c41c1f751fba9dd82db050865bc71f3310f5"
 }

package/src/ServerContext.tsx

@@ -1,10 +1,12 @@
 import * as React from 'react';
 
 export type ServerContextType = {
-  location?: {
-    pathname: string;
-    search: string;
-  };
+  location?:
+    | {
+        pathname: string;
+        search: string;
+      }
+    | undefined;
 };
 
 export const ServerContext = React.createContext<ServerContextType | undefined>(

package/src/index.tsx

@@ -2,6 +2,11 @@ export { createStaticNavigation } from './createStaticNavigation';
 export { Link } from './Link';
 export { LinkingContext } from './LinkingContext';
 export { LocaleDirContext } from './LocaleDirContext';
+export {
+  type CornerInsetProps,
+  type CornerInsetRef,
+  CornerInset as UNSTABLE_CornerInset,
+} from './native/CornerInset';
 export {
   MaterialSymbol,
   type MaterialSymbolProps,

package/src/native/CornerInset.ios.tsx

@@ -0,0 +1,82 @@
+import { NavigationContainerRefContext } from '@react-navigation/core';
+import * as React from 'react';
+import { Dimensions } from 'react-native';
+
+// eslint-disable-next-line import-x/extensions
+import type { CornerInsetProps, CornerInsetRef } from './CornerInset.tsx';
+import ReactNavigationCornerInsetViewNativeComponent, {
+  Commands,
+} from './ReactNavigationCornerInsetViewNativeComponent';
+
+function CornerInsetIOS(
+  props: CornerInsetProps,
+  ref: React.Ref<CornerInsetRef>
+) {
+  const root = React.use(NavigationContainerRefContext);
+
+  const nativeRef =
+    React.useRef<
+      React.ElementRef<typeof ReactNavigationCornerInsetViewNativeComponent>
+    >(null);
+
+  const relayout = React.useCallback(() => {
+    if (nativeRef.current) {
+      Commands.relayout(nativeRef.current);
+    }
+  }, []);
+
+  React.useEffect(() => {
+    if (root == null) {
+      return;
+    }
+
+    let animationFrameHandle: number | null = null;
+
+    // We freeze the corner insets after initial measurements
+    // This is to avoid the insets getting out of sync during transitions
+    // We trigger a relayout explicitly on window resize and transition end
+    const unsubscribeWindowResize = Dimensions.addEventListener(
+      'change',
+      () => {
+        if (animationFrameHandle) {
+          cancelAnimationFrame(animationFrameHandle);
+        }
+
+        // When window is unmaximized, calling relayout immediately doesn't work
+        // So we delay it to the next frame as a workaround
+        animationFrameHandle = requestAnimationFrame(() => {
+          relayout();
+        });
+      }
+    );
+
+    const unsubscribeTransition = root.addListener('__unsafe_event__', (e) => {
+      if (e.data.type === 'transitionEnd') {
+        relayout();
+      }
+    });
+
+    return () => {
+      if (animationFrameHandle) {
+        cancelAnimationFrame(animationFrameHandle);
+      }
+
+      unsubscribeWindowResize.remove();
+      unsubscribeTransition();
+    };
+  }, [root, relayout]);
+
+  React.useImperativeHandle(
+    ref,
+    () => ({
+      relayout,
+    }),
+    [relayout]
+  );
+
+  return (
+    <ReactNavigationCornerInsetViewNativeComponent {...props} ref={nativeRef} />
+  );
+}
+
+export const CornerInset = React.forwardRef(CornerInsetIOS);

package/src/native/CornerInset.tsx

@@ -0,0 +1,41 @@
+import * as React from 'react';
+import { View } from 'react-native';
+
+export type CornerInsetProps = {
+  /**
+   * The direction of the content that should be inset.
+   */
+  direction: 'vertical' | 'horizontal';
+  /**
+   * The edge where the inset should be applied.
+   */
+  edge: 'top' | 'right' | 'bottom' | 'left';
+  /**
+   * Whether to collapse to 0 when corner inset matches the baseline inset.
+   * e.g. it will be 0 for corners without traffic lights on iPadOS.
+   *
+   * @default true
+   */
+  adaptive?: boolean;
+} & React.ComponentProps<typeof View>;
+
+export type CornerInsetRef = {
+  relayout(): void;
+};
+
+function CornerInsetBase(
+  props: CornerInsetProps,
+  ref: React.Ref<CornerInsetRef>
+) {
+  React.useImperativeHandle(
+    ref,
+    () => ({
+      relayout() {},
+    }),
+    []
+  );
+
+  return <View {...props} />;
+}
+
+export const CornerInset = React.forwardRef(CornerInsetBase);

package/src/native/ReactNavigationCornerInsetViewNativeComponent.ts

@@ -0,0 +1,32 @@
+/* eslint-disable import-x/no-default-export */
+import * as React from 'react';
+import {
+  codegenNativeCommands,
+  codegenNativeComponent,
+  CodegenTypes,
+  type HostComponent,
+  type ViewProps,
+} from 'react-native';
+
+export interface NativeProps extends ViewProps {
+  direction?: CodegenTypes.WithDefault<'vertical' | 'horizontal', 'vertical'>;
+  edge?: CodegenTypes.WithDefault<'top' | 'right' | 'bottom' | 'left', 'top'>;
+  adaptive?: CodegenTypes.WithDefault<boolean, true>;
+}
+
+interface NativeCommands {
+  // FIXME: codegen fails with ComponentRef
+  // so we currently use the deprecated ElementRef
+  relayout(viewRef: React.ElementRef<HostComponent<NativeProps>>): void;
+}
+
+export const Commands = codegenNativeCommands<NativeCommands>({
+  supportedCommands: ['relayout'],
+});
+
+export default codegenNativeComponent<NativeProps>(
+  'ReactNavigationCornerInsetView',
+  {
+    interfaceOnly: true,
+  }
+) as HostComponent<NativeProps>;