React Native 0.88 Strict TS API Incompatibility

[leotm]

Spotted couple things upgrading RN 0.87.0-nightly to 0.88.0-nightly, for context

• React Native 0.88.0-nightly leotm/react-native-template-new-architecture#2031
• Upgrade React Native from 0.87.0-nightly to 0.88.0-nightly leotm/react-native-template-new-architecture#2040
• react-native-safe-area-context types incompat with 0.88.0-nightly leotm/react-native-template-new-architecture#2041

RN 0.88 includes a breaking change

• Enable Strict TS API by default (#57490) react/react-native#57490

both tsgo and classic tsc with skipLibCheck: true skip .d.ts declarations

but not .ts/.tsx src files in node_modules

yarn run tsgo
node_modules/react-native-safe-area-context/src/SafeArea.types.ts:46:3 - error TS2344: Type 'HostComponent<NativeProps>' does not satisfy the constraint 'abstract new (...args: any) => any'.
  Type 'HostComponent<NativeProps>' provides no match for the signature 'new (...args: any): any'.

46   typeof NativeSafeAreaView
     ~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/react-native-safe-area-context/src/SafeAreaContext.tsx:122:24 - error TS7006: Parameter 'e' implicitly has an 'any' type.

122       onInsetsChange={(e) => {
                           ~

node_modules/react-native-safe-area-context/src/specs/NativeSafeAreaProvider.ts:4:8 - error TS2307: Cannot find module 'react-native/Libraries/Types/CodegenTypes' or its corresponding type declarations.

4 } from 'react-native/Libraries/Types/CodegenTypes';
         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/react-native-safe-area-context/src/specs/NativeSafeAreaProvider.ts:5:36 - error TS2307: Cannot find module 'react-native/Libraries/Utilities/codegenNativeComponent' or its corresponding type declarations.

5 import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
                                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/react-native-safe-area-context/src/specs/NativeSafeAreaView.ts:1:36 - error TS2307: Cannot find module 'react-native/Libraries/Utilities/codegenNativeComponent' or its corresponding type declarations.

1 import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
                                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/react-native-safe-area-context/src/specs/NativeSafeAreaView.ts:2:34 - error TS2307: Cannot find module 'react-native/Libraries/Types/CodegenTypes' or its corresponding type declarations.

2 import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes';
                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Found 6 errors in 4 files.

Errors  Files
     1  node_modules/react-native-safe-area-context/src/SafeArea.types.ts:46
     1  node_modules/react-native-safe-area-context/src/SafeAreaContext.tsx:122
     2  node_modules/react-native-safe-area-context/src/specs/NativeSafeAreaProvider.ts:4
     2  node_modules/react-native-safe-area-context/src/specs/NativeSafeAreaView.ts:1

which affects react-native-safe-area-context@5.8.0

the workaround is for apps to opt out

// tsconfig.json
{
  "extends": "@react-native/typescript-config",
  "compilerOptions": {
    ...
    "customConditions": ["react-native-legacy-deep-imports"]
  }
}

or patch the breaking changes which can be dealt with by either patching
(simpler) package.json
or
the src files (including the type declarations if skipLibCheck is false)

i'll raise both sub-issues with this as parent then link both PRs

(upstream template is on react-native-safe-area-context ^5.5.2, so next ver bump w the fixes will get picked up)

[leotm]

doh looks like i can't Create sub-issue, i'll raise separately

• [RN 0.88] Add modern exports field to package.json #742
• [RN 0.88] Replace deep RN imports with public API #743

[leotm]

just realised creating a repro from scratch only apps consuming

import mockSafeAreaContext from 'react-native-safe-area-context/jest/mock'

are affected

either way both changes are likely still worth it