# XWUIChip

A compact tag/chip for labels, categories or removable items. Supports five semantic variants (`default`/`primary`/`success`/`warning`/`error`), the full canonical `XWUISize` scale (`xxxxs`…`xxxxl`; landing tiles use `xxxxs` ≈ half of `sm`), an optional leading `icon` or `avatar`, and `closable`/`clickable` modes. A closable chip renders a close button (firing `onClose` after a brief animation), while a clickable chip becomes a keyboard-focusable button that fires `onClick`.

## Basic Usage

A plain text chip with no variant or extras.

```example
file: examples/BasicUsage.ts
html: examples/BasicUsage.html
title: Basic Usage
description: Plain text chip.
```

## Closable

A primary chip with a close (x) button that dismisses it on click.

```example
file: examples/Closable.ts
html: examples/Closable.html
title: Closable
description: Dismissible chip with close (x) button.
```

## Sizes

Canonical XWUISize densities (`xxxxs`…`lg`) side-by-side.

```example
file: examples/Sizes.ts
html: examples/Sizes.html
title: Sizes
description: xxxxs…lg on the shared XWUISize scale.
```

## Variants

The default, primary, success, warning and error semantic color variants.

```example
file: examples/Variants.ts
html: examples/Variants.html
title: Variants
description: default / primary / success / warning / error.
```

## With Icon

A success chip prefixed with a leading icon.

```example
file: examples/WithIcon.ts
html: examples/WithIcon.html
title: With Icon
description: Chip with a leading icon.
```

```api
```