Responsive breakpoint classes are applied in reverse logic

[Anacpsycho]

When using responsive breakpoint keywords (sm:, md:, lg:, xl:) inside Flexbox elements, width classes (w-) are applied incorrectly.

Expected behavior:

If I set sm:w-12 w-6, I expect:

On small screens (up to sm) → w-12 should be applied

On larger screens → w-6 should be applied

Observed behavior:

On small screens, w-6 is applied instead of w-12

On larger screens, w-12 is still applied, ignoring instead of w-6

Reproducer
https://stackblitz.com/edit/qy4mszln?file=src%2FApp.jsx

System Information
System:
OS: Windows 11 10.0.22631
CPU: (20) x64 13th Gen Intel(R) Core(TM) i7-1370P
Memory: 12.02 GB / 31.66 GB
Binaries:
Node: 22.11.0 - C:\Program Files\nodejs\node.EXE
npm: 10.9.0 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: Chromium (131.0.2903.70)
Internet Explorer: 11.0.22621.3527
primereact: 10.8.5
react: 18.3.1

Steps to reproduce the behavior
open stackblitz code
resize the preview to small -> w-6 applied
resize the preview to large -> w-12 applied

Expected behavior
open stackblitz code
resize the preview to small -> w-12 applied
resize the preview to large -> w-6 applied