React Native Expo: What is an Alternate option for Tailwindcss TailwindProvider from nativewind

I am integrating tailwindcss in react native project using expo but the older version of tailwindcss (https://tailwindcss-react-native.vercel.app) is now deprecated and it is now nativewind (https://www.nativewind.dev/)

I am following now nativewind(https://www.nativewind.dev/)

I have added the dependencies for tailwind

yarn add nativewind
yarn add --dev tailwindcss

Then added tailwind.config.ts

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./screens/**/*.{js,ts,jsx,tsx}",
    "./pages/**/*.{js,ts,jsx,tsx}",
    "./components/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

then updated babel.config.js as

module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: ["nativewind/babel"],
  };
};

Now I am trying to add the TailwindProvider in App.js file but getting the error

import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import HomeScreen from './screens/HomeScreen';
import { TailwindProvider } from 'nativewind';
//import { TailwindProvider } from 'tailwindcss-react-native';

export default function App() {

  const Stack = createNativeStackNavigator()
  return (
    <NavigationContainer>
      <TailwindProvider>
        <Stack.Navigator>
          <Stack.Screen name='Home' component={HomeScreen} />
        </Stack.Navigator>
      </TailwindProvider>
    </NavigationContainer>
  );
}

HomeScreen.js

import { View, Text } from 'react-native'
import React from 'react'

export default function HomeScreen() {
  return (
    <View>
      <Text>HomeScreen</Text>
    </View>
  )
}

Error is :

I am stuck here how to use TailwindProvider with new API (https://www.nativewind.dev/quick-starts/expo)