Smiley Face Part VI
A grid of eighteen randomized smiley faces demonstrates the reusability of React components for generative SVG graphics. Each face, rendered via a `Face` component composed of `BackgroundCircle`, `Eyes`, and `Mouth` subcomponents, varies in stroke width, eye offset, eye radius, and mouth dimensions using `Math.random()`. The `Mouth` component relies on the `d3.arc()` API to generate its path, while the `FaceContainer` wraps all elements in an SVG group centered via a transform. The faces are generated from an array produced by `d3.range()`, with ReactDOM mounting the output.