# XWUIGameAchievementsPanel

An achievements gallery that renders the `achievements` array as a card grid (`columns`, default 3) with a header counting unlocked vs total. Each card shows the achievement icon, name, and description, applies an unlocked or locked style, and - when `showProgress` is on and it is still locked - a progress bar plus `progress/maxProgress` text. With `showRarity` enabled a rarity badge is tinted by tier. If more than one `categories` value is supplied, a filter button row narrows the grid by the active `filter`.

## Basic Usage

Shows a grid of achievement cards with progress bars and rarity badges.

```example
file: examples/BasicUsage.ts
html: examples/BasicUsage.html
title: Basic Usage
description: An achievements grid with unlocked/locked cards, progress bars, rarity badges, and category filters.
```

## Category Filters

A two-column grid with a category filter row, opened on the combat category.

```example
file: examples/CategoryFilters.ts
html: examples/CategoryFilters.html
title: Category Filters
description: An achievements grid with a multi-value categories filter row and an active combat filter.
```

## Compact Rarity Wall

A dense two-column trophy wall with progress bars hidden, showing only rarity badges.

```example
file: examples/CompactRarity.ts
html: examples/CompactRarity.html
title: Compact Rarity Wall
description: A compact grid of unlocked trophies with showProgress off, leaving icon, name, and rarity badge.
```

```api
```