{"version":"1.0","type":"rich","title":"React Router Drills","description":"The visualization demonstrates an email client drill-down interface, showing how users navigate from an inbox summary to individual message details. It renders a three-pane layout with a message list and content preview, using React Router to manage view transitions between mailbox folders and selected emails. The drill interaction relies on `react-router-dom`’s `Link` components and `useParams` hooks to update the URL and conditionally render the active message. The example uses mock email data stored in a static JavaScript array, with no external data fetching or animation libraries. The interface updates synchronously as route changes trigger component re-renders.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-5c23c61723ef24588ca9c5f35c5f2374?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}