{"version":"1.0","type":"rich","title":"Styled-Components example","description":"Styled-Components example shows how CSS-in-JS embeds styling directly within React component definitions, rendering a title, buttons, and a wrapper using styled.h1, styled.section, and styled.button. It demonstrates prop-based styling via interpolations in template literals, where a primary prop adapts button colors, and component extension through styled(Button) overrides. The code imports React, ReactDOM, and styled-components, then renders the composed UI into the #root div.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/48e524747e3e42489120a70da8f24798?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}