<!-- source-hash: e5eb0bd50db0bb0a39a6cf239ba52faf -->
A Storybook stories file that demonstrates the CheckboxWithDescription component through various interactive examples and configurations.

## Key Components

- **Meta Configuration**: Storybook metadata with component documentation and arg type definitions
- **Story Variants**: Eight different stories showcasing component states and use cases:
  - `Default` - Basic unchecked state
  - `Checked` - Pre-checked state
  - `Disabled` - Non-interactive disabled state
  - `DisabledChecked` - Disabled but checked
  - `LongDescription` - Handling longer descriptive text
  - `Controlled` - Interactive state management example
  - `SettingsGroup` - Multiple checkboxes in a settings panel
  - `AllVariants` - Complete state comparison view

## Usage Example

```typescript
import { CheckboxWithDescription } from '../components/ui/checkbox-with-description';

// Basic implementation
<CheckboxWithDescription
  id="notifications"
  title="Enable notifications"
  description="Receive email notifications when important events occur."
  checked={isEnabled}
  onCheckedChange={setIsEnabled}
/>

// Disabled state for premium features
<CheckboxWithDescription
  id="premium"
  title="Premium feature"
  description="This feature is only available on premium plans."
  checked={false}
  disabled
  onCheckedChange={() => {}}
/>
```

The stories provide comprehensive visual testing for the checkbox component, including edge cases like disabled states, long text handling, and controlled state management patterns commonly used in settings interfaces.