{"version":"1.0","type":"rich","title":"Menus with React","description":"This example shows a React-based pet selection interface with a dropdown menu displaying six animal options (dog, cat, hamster, parrot, spider, goldfish) and a large, prominent label. The code uses React’s `useState` hook to track the currently selected value, initially set to hamster, and passes it to a reusable `Dropdown` component. The `Dropdown` component renders a native `<select>` element, mapping each option object to an `<option>` tag while maintaining the controlled value through the `onSelectedValueChange` callback. The visualization relies on plain HTML form controls rather than a charting library, demonstrating React’s declarative state management.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/18309322eda94ea98f12055739ea3abb?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}