Bug: Cannot set className and style at the same time in v5

[beebls]

Describe the bug
In web versions of tailwind, and Nativewind v4, setting both className and style on an element would combine the two styles, with duplicate definitions having the style tag's value overwrite the class.

In Nativewind v5, this no longer works. Setting only className or only style works, but when you set both, the className property is completely ignored, with only the values from style applying.

Reproduction
Please see our contribution guide: https://github.com/nativewind/nativewind/blob/main/contributing.md#opening-an-issue

Below is a github repo that contains two rn-new boilerplate projects, one using nativewind 4 and one nativewind 5. A demo code snippet in App.tsx demonstrates styling with only className, styling with only the style prop, and a combination of the two.
https://github.com/beebls/nativewind-issue-demo

Expected behavior
Using the below code snippet on nativewind 4 and 5 yields different results.

import { View } from 'react-native';
import './global.css';

export default function App() {
  return (
    <View className="h-full w-full items-center justify-center bg-red-800">
      <View className="bg-blue-400 p-4" style={{ borderWidth: 10 }}>
        <View style={{ backgroundColor: 'white', width: 100, height: 100 }}></View>
      </View>
    </View>
  );
}

Notice how the border from the style property is applied on both, but the background color and padding are only working on nativewind 4.

Additional context
I've observed this both in expo go and in dev client apps.

Additionally, this happens even if you set style={{}} or style={undefined}

[lk11601]

Also getting this, using Expo Dev Client.

[puerschel93]

Same 💀

[Bartek532]

Anyone found a solution to this?

[alexeev7a]

@marklawlor It seems that fixing this issue #192 broke it

[JeanDes-Code]

I'm experiencing the same issue in my codebase with NativeWind v5 when combining style and className props.

Environment specifics:

• The combination of style + className works properly on web builds
• It fails on native builds (tested iOS) when both props are present

Looking forward to a fix for this! 🙏
Even if Nativewind v5 is still a preview, its the only way for us to use the Expo SDK 54 and Reanimated v4 without UI issues.

[rgcjhn]

+1

[danstepanov]

Thanks for the detailed issue, assigning this to @marklawlor.

[DaltonPelkey]

I think style and className together should only be used in rare cases anyway

I strongly disagree with this. It's pretty hard to avoid within react native when using dynamic values or while working with reanimated.

[DaltonPelkey]

Well.. I guess all apps are made different. However, that is certainly not a rare occurrence in my experience 🙃

[danstepanov]

@DaltonPelkey agree this is not uncommon

[stonega]

Pls fix this