Adds a "use client" directive to the BlocksRenderer component
Updates the pack-up plugin with a new plugin so that the custom directive doesn't get stripped. Solution from this comment, also used by react query
Why is it needed?
To prevent React from running these components on the server, as they require client-only APIs. See #10
I first tried to offer proper server component support by removing the use of React context. It made the DX quite a bit worse with lots of prop drilling. But it also wasn't enough as we're also using useRef, so I chose to go client-only instead.
How to test it?
Create a Next app with the app router, import and use the renderer, it shouldn't throw an error anymore.
What does it do?
Why is it needed?
To prevent React from running these components on the server, as they require client-only APIs. See #10
I first tried to offer proper server component support by removing the use of React context. It made the DX quite a bit worse with lots of prop drilling. But it also wasn't enough as we're also using useRef, so I chose to go client-only instead.
How to test it?
Create a Next app with the app router, import and use the renderer, it shouldn't throw an error anymore.
Related issue(s)/PR(s)
Fixes #10