<!-- source-hash: 1772e21e417f4b4cc048f5de339ed4fa -->
A React component that renders a customizable moon SVG icon, typically used for dark mode toggle buttons or theme switchers.

## Key Components

- **MoonIcon**: Main React functional component that renders an SVG moon icon
- **MoonIconProps**: TypeScript interface defining optional props for customization
  - `className`: CSS class for styling
  - `width`: Icon width (default: 23px)
  - `height`: Icon height (default: 24px)

## Usage Example

```typescript
import { MoonIcon } from './moon-icon';

// Basic usage with defaults
<MoonIcon />

// Customized with props
<MoonIcon 
  className="text-gray-600 hover:text-gray-800" 
  width={32} 
  height={32} 
/>

// In a theme toggle button
<button onClick={toggleDarkMode}>
  <MoonIcon className="w-6 h-6" />
  Switch to Dark Mode
</button>
```

The SVG uses `currentColor` for the fill, allowing it to inherit the text color from its parent element for easy theming. The icon features a crescent moon design with a detailed path that creates a modern, clean appearance suitable for UI controls.