# ItemBadge

A non-interactive badge indicator for list items. Similar to `ItemAction` but without press behavior (cursor: default).

## When to Use

- Status indicators in list items
- Visual badges showing state (selected, loading)
- Non-clickable indicators alongside `ItemAction` buttons

## Properties

- **`icon`** `ReactNode | 'checkmark'` — Icon or checkmark display
- **`type`** `'primary' | 'outline' | 'clear'` (default: `'clear'`) — Visual type. `isSelected` applies brand-tinted fill to `outline` and `clear`. Inherits from parent context.
- **`theme`** `'default' | 'danger' | 'success' | 'special'` (default: `'default'`) — Color theme. Inherits from parent context.
- **`isLoading`** `boolean` (default: `false`) — Show loading spinner
- **`isSelected`** `boolean` (default: `false`) — Selected state (for checkmark)
- **`tooltip`** `string | object` — Tooltip content shown on hover for icon-only badges. A string shows tooltip text; an object supports `{ title, ...tooltipProps }` for advanced configuration.

### Base Properties

Supports [Base properties](../../BaseProperties.md).

## Examples

```jsx
<ItemBadge icon="checkmark" isSelected />

<ItemBadge icon={<IconCheck />} theme="success" />

<ItemBadge isLoading />
```
