This example shows a modular smiley face built entirely from reusable React components, with separate Eye, Face, and Mouth elements composed into an SVG scene. It demonstrates how D3’s `arc()` generator creates the mouth’s curved path, while React’s props pass geometric values like eye offsets, radius, and stroke width. The code relies on React 18 and ReactDOM for rendering, D3 v7 for the arc, and SVG for all visual output. The face is centered at the viewport midpoint, with the mouth angle fixed between 120 and 240 degrees.