<!-- source-hash: bb1ffa286d88de8a31723d725683e4b3 -->
A React SVG component that renders a check mark icon inside a circle, commonly used to indicate success, completion, or validation states.

## Key Components

- **CheckCircleIcon** - Main functional component that renders the SVG icon
- **CheckCircleIconProps** - TypeScript interface extending standard SVG props with optional className
- **SVG Paths** - Two path elements: one for the circle outline and one for the check mark

## Usage Example

```typescript
import { CheckCircleIcon } from './check-circle-icon'

// Basic usage with default styling
<CheckCircleIcon />

// Custom color and size
<CheckCircleIcon 
  color="#22c55e" 
  width={32} 
  height={32} 
  className="success-icon" 
/>

// In a success message
<div className="flex items-center gap-2">
  <CheckCircleIcon color="#10b981" />
  <span>Task completed successfully!</span>
</div>

// With additional SVG props
<CheckCircleIcon 
  color="#059669"
  className="animate-pulse"
  onClick={() => handleClick()}
  aria-label="Success indicator"
/>
```

The component defaults to a 24x24 pixel size with dark gray color (`#1A1A1A`) but accepts all standard SVG properties for customization. The icon features a clean, modern design with proper accessibility support through standard SVG attributes.