Viewport(Hidden) Not Working in Version 2.8.3

[hahahumble]

Describe the bug The viewport is not functioning in version 2.8.3. When I reverted back to version 2.7.1, it started working normally again.

To Reproduce CodeSandbox

Environment:

• NextJS (v14.0.3)
• React (v18.2.0)

[blvdmitry]

Does this happen to you only on codesandbox or in other environments as well? I think it might be related to the viewport theming, where I've stopped precompiling media queries before publishing the package (since they can change based on the product theme). It should still work as expected if you have postcss.config.js file with the Reshaped postcss config.

Can you check if your project has it included? https://reshaped.so/docs/getting-started/integrations/next#add-a-postcss-config

[hahahumble]

This situation only occurs in CodeSandbox.

It also happened in my local project before, but was resolved after I imported the generated media.css.

[blvdmitry]

I guess I should update the default template to use Vite or Webpack directly on codesandbox to make sure this works out of the box. Curious why it doesn't work for you out of the box and you had to manually import a media file though, it should get imported automatically. Is your setup available publicly or otherwise can you also check if there are any difference compared to https://github.com/formaat-design/reshaped/tree/main/examples/starter-next?

[hahahumble]

I've figured out the reason. I didn't use the destructuring assignment syntax in the postcss configuration file, which is why I needed to manually import media.css.

const config = require('reshaped/config/postcss');

[blvdmitry]

Ah, makes sense, thanks for sharing. I'll see if I can highlight that in the docs better