Render the React component inside Hugo

[rluders]

Is your feature request related to a problem? Please describe. We are moving our documentation to Hugo, to keep the same layout and usability that is found today at the flowbite.com documentation. For that, one of the challenges is to convert the preview partial/component to something that must be able to render the flowbite-react component.

Describe the solution you'd like

• Write the example code - ideally use the example code to render the preview;
• Render the written example code into the preview window;
• Resize the preview window to desktop, tablet, and mobile;
• Preview windows should also be able to change the component preview to dark/light theme;

The final result must be something like this: Screencast from 10-12-2022 08:48:07 AM.webm

Describe alternatives you've considered

If it isn't possible to use the example code to render the preview, I'm open to accepting managing two source codes for the examples, one for rendering other for the example.

Additional context

I found some useful links:

https://codesandbox.io/s/l62ke?file=/src/App.js:511-527 https://reactjs.org/docs/add-react-to-a-website.html

[rluders]

I was working on this one but got stuck... So, I need some help. This issue already has a WIP PR that can give some idea (or not): https://github.com/themesberg/flowbite-react/pull/311