---

## NotificationBadge
An unread-count badge that renders nothing when the count is 0.
The visible text is the count, capped at `99+`; the accessible name is the
localized `notifications.badge.unread` string with that same text substituted
for `{n}`, so the badge's accessible name is "Unread notifications: 3"
instead of a bare number. Pass your own `aria-label` (or any other attribute — the rest spread
reaches the badge root) to override it.

The ARIA role follows the handler, because `Badge` derives it: with an
`onclick` the badge is a `button` and a tab stop; without one it is a
`status` — a polite live region that exists from the first unread on, so a
change between two non-zero counts happens inside a region that was already
there. The first unread is not such a change: at zero the badge renders
nothing, so the region arrives together with its text. The interactive look
follows the handler too — without one the badge is not pressable and does
not look it.

**Import:** `import { NotificationBadge } from '@urbicon-ui/auth';`

### Examples
```svelte
<NotificationBadge count={store.unreadCount} onclick={() => (open = !open)} />
```

### Api
| Prop | Type | Required | Default | Description |
| --- | --- | :---: | --- | --- |
| count | `number` | yes |  | Number of unread notifications. Badge hidden when 0. |
| ...HTMLAttributes<HTMLElement> | `HTMLAttributes` | no |  | HTML attributes (excluding: 'children' | 'class' | 'onclick' | 'role') |
| class | `string` | no |  | Extra classes on the root element. In the same Tailwind bucket `class` wins over the `slotClasses` entry for the element it lands on. Presets and provider defaults sit below both. |
| onclick | `() => void` | no |  | Click handler (e.g. toggle notification center). Also what makes the badge a `button` and a tab stop. |
| preset | `string` | no |  | Apply a named preset registered via `<BlocksProvider presets={{ NotificationBadge: { … } }}>`. Resolves after the provider defaults and before this instance's own `slotClasses`, so a project-wide look lives in one place instead of being repeated at every usage site. |
| role | `BadgeProps['role']` | no |  | ARIA role, passed straight to `Badge` — its type, so the two cannot drift. Leave unset to take the derived one: `button` with an `onclick`, `status` (a polite live region) without. It narrows what the badge is announced as; it does not make it operable, so `role="button"` without an `onclick` is a button nothing can activate. |
| slotClasses | `Partial<Record<'root', string>>` | no |  | Per-slot class overrides. Slots: root. In the same Tailwind bucket `class` wins over the `slotClasses` entry for the element it lands on. Presets and provider defaults sit below both. |
| t | `PartialAuthLocale` | no |  | Locale overrides, deep-merged over the bundle registered for the active locale — English unless `registerAuthLocale` ran for it. Pass any subset, from a single string to a whole tree. |
| unstyled | `boolean` | no |  | Strip all default styling. |

Inherited from:
- Omit<HTMLAttributes<HTMLElement>, 'children' | 'class' | 'onclick' | 'role'> (omit-pattern)

### Types
```ts
type PartialAuthLocale = DeepPartial<AuthLocale>
```

```ts
type DeepPartial = T extends object ? { [K in keyof T]?: DeepPartial<T[K]> } : T
```

- `interface AuthLocale` — 8 members, definition omitted (387 lines; full definition: packages/auth/src/lib/i18n/keys.ts)

### Slots (slotClasses keys)
`root`