Skip to content

types.d.ts doesn't type-check against React Native 0.88: Touchable, ScrollViewProps and VirtualizedListProps #548

Open

Description

@YevheniiKotyrlo

Before submitting a new issue

  • I tested using the latest version of the library, as the bug might be already fixed.
  • I tested using a supported version of react native.
  • I checked for possible duplicate issues, with possible answers.

Bug summary

react-native-css/types (the reference nativewind-env.d.ts adds) augments react-native with names and extends clauses that React Native 0.88's generated types no longer have, so a project that checks declarations (skipLibCheck: false) gets errors from it (types.d.ts at 2421ea7):

  • Touchable is no longer exported by react-native.
  • interface ScrollViewProps extends ViewProps, ScrollViewPropsIOS, ScrollViewPropsAndroid, Touchable clashes with 0.88's own ScrollViewProps, and the className the file adds to ViewProps and ImagePropsBase makes ScrollViewProps, ImageBackgroundProps and KeyboardAvoidingViewProps unable to extend both of their bases.
  • VirtualizedListProps is no longer generic, so FlatListProps<ItemT> extends VirtualizedListProps<ItemT> fails.

Library version

0.0.0-nightly.2421ea7 (main at 2421ea7), and 3.1.0-rc.0

Environment info

Windows 11 10.0.26300, Node 26.12.1, npm 12.2.1, TypeScript 7.0.2, react-native 0.88.1, react 19.3.1, @types/react 19.3.0.
No app or native build is involved: the errors come from the type check alone.

Steps to reproduce

  1. Clone the reproducible example: a package.json with react-native 0.88.1 and react-native-css 0.0.0-nightly.2421ea7, a tsconfig.json with strict and skipLibCheck: false, and an index.ts holding only import type {} from 'react-native-css/types';.
  2. npm install --ignore-scripts
  3. npx tsc -p .

Expected: no error from react-native-css/types.d.ts.

Actual, among the output (the run also prints a few errors of React Native's own declarations, which are separate):

node_modules/react-native-css/types.d.ts(6,3): error TS2305: Module '"react-native"' has no exported member 'Touchable'.
node_modules/react-native-css/types.d.ts(22,13): error TS2320: Interface 'ScrollViewProps' cannot simultaneously extend types 'Readonly<Omit<Omit<ViewProps, "experimental_accessibilityOrder">, "StickyHeaderComponent" | "alwaysBounceHorizontal" | "alwaysBounceVertical" | "automaticallyAdjustContentInsets" | ... 62 more ... | "zoomScale"> & Omit<...> & Omit<...> & Omit<...>>' and 'ViewProps'.
node_modules/react-native-css/types.d.ts(29,42): error TS2315: Type 'VirtualizedListProps' is not generic.
node_modules/react-native/types_generated/Libraries/Components/Keyboard/KeyboardAvoidingView.d.ts(40,18): error TS2320: Interface 'KeyboardAvoidingViewProps' cannot simultaneously extend types ...
  Named property 'className' of types ...
node_modules/react-native/types_generated/Libraries/Image/ImageProps.d.ts(291,18): error TS2320: Interface 'ImageBackgroundProps' cannot simultaneously extend types ...
  Named property 'className' of types ...

Reproducible example repository

https://github.com/YevheniiKotyrlo/react-native-css-types-react-native-0-88

Activity

  1. YevheniiKotyrlo commented on Oct 30, 2026

    @YevheniiKotyrlo
    ContributorAuthor

    This is the patch I apply to the published 3.1.0-rc.0 until a fix lands: it keeps every added className property and drops the extends clauses along with the imports they used, which React Native 0.88's types reject.

    diff --git a/types.d.ts b/types.d.ts
    --- a/types.d.ts
    +++ b/types.d.ts
    @@ -1,11 +1,5 @@
     /* eslint-disable @typescript-eslint/no-unused-vars */
    -import type {
    -  ScrollViewProps,
    -  ScrollViewPropsAndroid,
    -  ScrollViewPropsIOS,
    -  Touchable,
    -  VirtualizedListProps,
    -} from "react-native";
    +import type { ScrollViewProps } from "react-native";
     
     declare module "@react-native/virtualized-lists" {
       export interface VirtualizedListWithoutRenderItemProps<ItemT>
    @@ -19,17 +13,13 @@ declare module "react-native" {
       interface ButtonProps {
         className?: string;
       }
    -  interface ScrollViewProps
    -    extends ViewProps,
    -      ScrollViewPropsIOS,
    -      ScrollViewPropsAndroid,
    -      Touchable {
    +  interface ScrollViewProps {
         contentContainerClassName?: string;
       }
    -  interface FlatListProps<ItemT> extends VirtualizedListProps<ItemT> {
    +  interface FlatListProps<ItemT> {
         columnWrapperClassName?: string;
       }
    -  interface ImageBackgroundProps extends ImagePropsBase {
    +  interface ImageBackgroundProps {
         imageClassName?: string;
       }
       interface ImagePropsBase {
    @@ -47,7 +37,7 @@ declare module "react-native" {
       interface TouchableWithoutFeedbackProps {
         className?: string;
       }
    -  interface KeyboardAvoidingViewProps extends ViewProps {
    +  interface KeyboardAvoidingViewProps {
         contentContainerClassName?: string;
       }
     }
  2. dave-otf commented on Oct 31, 2026

    @dave-otf

    One diagnostic that may help separate the package augmentation from the app: run the repro once with skipLibCheck: true. If the declaration diagnostics disappear, that confirms the failure is in .d.ts checking; it is only a temporary isolation step, not a compatibility fix, and it does not validate runtime behavior. Then keep the skipLibCheck: false repro as the regression check for the eventual 0.88-compatible declarations.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions