@exxatdesignux/ui 0.2.19 → 0.4.0

package/consumer-extras/cursor-rules/exxat-primary-nav-secondary-panel.mdc

@@ -0,0 +1,52 @@
+---
+description: Primary sidebar item opens nested SecondaryPanel (Library pattern)
+globs: apps/web/components/**/*.tsx
+alwaysApply: false
+---
+
+# Exxat DS — primary nav → secondary panel
+
+Some hubs expose **scoped navigation** (All / My / tree / filters) in a **nested panel** between the **icon rail** and **main content** — not as **primary nav child rows**.
+
+**Reference:** **Library** — **`lib/mock/navigation.tsx`** (`secondaryPanel: "library"`), **`components/app-sidebar.tsx`**, **`components/secondary-panel.tsx`**, **`components/library-panel-activator.tsx`**, **`components/library-secondary-nav.tsx`**, **`lib/library-nav.ts`** (URL scope).
+
+## MUST (wiring)
+
+1. **`NavLinkItem`** — On the **primary** row that should drive the panel, set **`secondaryPanel`** to a **stable string id** (e.g. **`"library"`**). Keep **`url`** pointing at the **hub route**.
+2. **`SecondaryPanel` registry** — In **`components/secondary-panel.tsx`**, add **`PANELS[id]`** → component that renders **panel chrome** (title, optional search) + **your secondary nav** list. **MUST** keep ids in sync with **`NAV_PRIMARY`**.
+3. **Auto-open on route** — The hub **`client`** (or layout slot) **MUST** mount **`*PanelActivator`** that calls **`useAutoPanel(id)`** with the **same id**, so deep links and first visit open the panel while the route is mounted (e.g. **`LibraryPanelActivator`** + **`beforeSiteHeader`** on **`LibraryClient`**).
+4. **Same-route reopen** — **`AppSidebar`** already calls **`openPanel(secondaryPanel)`** when the user clicks the primary item **again** while already on that **`url`** (prevents no-op navigation). Secondary nav rows that stay on the same path **SHOULD** call **`openPanel`** on click where **Next.js `Link`** would not fire (same **`href`**).
+
+## Surface elevation (brand chrome)
+
+The nested panel sits **between** the icon rail and main content. **MUST** use the three-level stack (darkest → lightest):
+
+| Level | Surface | Token |
+|-------|---------|--------|
+| **0** | Primary sidebar | `--sidebar` (= `--brand-tint` on product themes) |
+| **1** | Secondary panel | `--secondary-panel-bg` |
+| **2** | Page canvas | `--background` |
+
+- **`NestedSecondaryPanelShell`** — **`bg-[var(--secondary-panel-bg)]`**, not **`bg-sidebar`** (same as level 0).
+- **OKLCH** — light: `color-mix(in oklch, var(--background) 40%, var(--brand-tint-light) 60%)`; dark: `color-mix(in oklch, var(--card) 32%, var(--brand-tint) 68%)`. **MUST** follow **active product** (`theme-one`, `theme-prism`, `theme-custom`) — **MUST NOT** hardcode rose for all products.
+- **`ProductProvider`** — `theme-custom` only when stored accent **differs** from product default (`accentOverrideActive`).
+
+**Authoritative detail:** **`apps/web/docs/shell-surface-elevation-pattern.md`**.
+
+## SHOULD
+
+- Drive **hub scope** from the **URL** (**`useSearchParams`** + helpers like **`parseLibraryNav`**) so **refresh**, **share link**, and **breadcrumbs** match the secondary list.
+- Keep **panel content** **Font Awesome**-aligned with the rest of the app (**`.cursor/rules/exxat-fontawesome-icons.mdc`**).
+
+## MUST NOT
+
+- Register a **`secondaryPanel`** id in **`NAV_PRIMARY`** **without** a **`PANELS`** entry and a matching **`useAutoPanel`** on the hub — users get a **collapsed sidebar** with **empty** panel space.
+- Use **`secondaryPanel`** for **full** app sections that deserve their **own primary nav rows** — reserve this for **one hub** + **inner scope** UI.
+
+## See also
+
+- **`apps/web/AGENTS.md` §4.6** — handbook summary.
+- **`apps/web/docs/shell-surface-elevation-pattern.md`** — OKLCH tokens + product theme.
+- **`.cursor/rules/exxat-library-hub-header.mdc`** — folder-scoped library header **⋯** → **Customize folder** + client-mounted sheet.
+- **`.cursor/rules/exxat-page-vs-drawer.mdc`** — when **drawer** vs **route**; secondary panel is **nav chrome**, not a workflow drawer.
+- **`.cursor/rules/exxat-kpi-flat-band.mdc`** — flat KPI strip (separate from panel fill).

package/consumer-extras/cursor-rules/exxat-reuse-before-custom.mdc

@@ -0,0 +1,34 @@
+---
+description: Exxat DS — prefer centralized reusable components; ask the user before new bespoke primitives.
+alwaysApply: true
+---
+
+# Exxat DS — reuse before custom
+
+## MUST
+
+1. **Compose first** — Use existing **`components/ui/`**, **`components/data-views/`**, **`components/templates/`**, **`PageHeader`**, **`ListPageTemplate`**, **`DataTable`**, **`KeyMetrics`**, and patterns in **`AGENTS.md` §9** before writing new layout or interaction chrome.
+2. **Search the codebase** — Grep or open the nearest hub (Placements, Team, Library) for the same UX (toolbar, drawer, metrics, board card, `ListPageViewFrame`, etc.).
+3. **Extend in place** — Prefer adding a variant, slot, or prop to a shared component over a one-off duplicate under a single route.
+
+## When the tool must ask the user
+
+**MUST pause and ask the user** (with a short option list) when, after scanning, **no reasonable reuse** exists and the implementation would add **any** of:
+
+- A **new reusable primitive** (new file under `components/` meant for multiple routes), or  
+- A **non-trivial bespoke widget** (custom data grid, chart system, modal stack, or parallel design-system fork) that is not already implied by the task.
+
+Do **not** silently ship a second stack for the same product pattern (e.g. another “table”, another metrics strip, another sidebar).
+
+If the **user or task already explicitly** approved a greenfield component (“build a new X from scratch”), you may proceed without re-asking.
+
+## MUST NOT
+
+- Add **route-only copies** of patterns that already live in **`components/`** or **`packages/ui`** without product reason.
+- Introduce **parallel primitives** (second button row, second card shell, second command surface) when an existing one can be parameterized.
+
+## See also
+
+- **`apps/web/AGENTS.md` §1** (compose / scan before new UI), **§9** architecture table  
+- **`.cursor/rules/exxat-ds-agents.mdc`**  
+- **`.cursor/rules/exxat-centralized-list-dataset.mdc`** — one dataset / one presentation path for hubs

package/consumer-extras/cursor-rules/exxat-table-properties-drawer.mdc

@@ -0,0 +1,77 @@
+---
+description: TablePropertiesDrawer must receive currentView and onViewChange when used with ListPageTemplate view tabs
+alwaysApply: true
+---
+
+# Exxat DS — Table properties + active view
+
+**Authoritative detail:** **`apps/web/AGENTS.md` §4.2**.
+
+## Why this exists
+
+`TablePropertiesDrawer` uses **`currentView`** (`DataListViewType`) for the first summary row (“Board display” vs “Table display”, matching icons/descriptions) and to show **table-only** vs **board-only** sub-panels. If **`currentView`** is omitted, the drawer assumes **table** — wrong when the tab is **Board**, **List**, or **Dashboard**.
+
+## MUST
+
+When **`ListPageTemplate`** drives **`tab.viewType`** and the page renders **`TablePropertiesDrawer`** (directly or via a toolbar slot):
+
+1. Pass **`currentView={view}`** (same value as **`tab.viewType`** passed into your table component).
+2. Pass **`onViewChange`** from **`renderContent={(tab, updateTab) => ...}`** so the drawer’s view-type tiles stay in sync with the tab:
+
+   ```tsx
+   import { dataListViewIcon, type DataListViewType } from "@/lib/data-list-view"
+
+   onViewChange={(v: DataListViewType) =>
+     updateTab({ viewType: v, icon: dataListViewIcon(v) })
+   }
+   ```
+
+3. Thread **`view`** and **`onViewChange`** through: **client → table component → drawer toolbar → `TablePropertiesDrawer`**.
+
+**Reference implementations:** `components/placements-table.tsx` (`PlacementsTable`), `components/team-client.tsx` + `team-table.tsx`, `components/compliance-client.tsx` + `compliance-table.tsx`.
+
+## Deep-linking into a specific panel
+
+`TablePropertiesDrawer` accepts an optional **`initialPanel`** prop so callsites can open the drawer focused on a named panel — `"main"` (default), `"table-display"`, `"filter"`, `"sort"`, `"group"`, `"columns"`, or `"conditional-rules"`. The current built-in use is the **Add Conditional Rule** item in every column header menu, which deep-links to the **Conditional rules** panel.
+
+### MUST
+
+1. **One state pair owns it.** `useTableState` exposes **`sheetInitialPanel`** + **`setSheetInitialPanel`** alongside `sheetOpen` / `setSheetOpen`. Read both in the drawer button; pass **`initialPanel={sheetInitialPanel}`** to `TablePropertiesDrawer`. Reference: `packages/ui/src/components/table-properties/drawer-button.tsx`.
+2. **The toolbar Properties button MUST clear the deep-link.** Otherwise the next plain "Properties" click re-opens onto whatever panel the previous deep-link set:
+
+   ```tsx
+   onClick={() => {
+     setSheetInitialPanel?.(null)
+     setSheetOpen(true)
+   }}
+   ```
+
+3. **Deep-link callsites MUST set panel + open in the same batched setState call.** Two setters in one callback land in one render, so the drawer mounts with `initialPanel` already populated — no panel-flash:
+
+   ```tsx
+   setSheetInitialPanel("conditional-rules")
+   setSheetOpen(true)
+   ```
+
+4. **From inside a Radix DropdownMenu, queue the action into `onCloseAutoFocus`.** Opening the non-modal Sheet synchronously from `DropdownMenuItem.onSelect` races with the menu close cycle. Use the `columnMenuPendingActionRef` pattern in `packages/ui/src/components/data-table/index.tsx` (or copy it) so the drawer opens after focus has returned to the trigger.
+
+### MUST NOT
+
+- Don't introduce a second source of truth for "which panel" — `sheetInitialPanel` is the only deep-link channel. The drawer's internal `sheetPanel` state stays internal.
+- Don't call `setSheetInitialPanel` from a non-deep-link callsite (e.g. a generic "open Properties" toolbar button). Leave it `null` for index opens.
+
+## View-type tile grid is uniformly square
+
+The drawer's "View type" tile grid (and the Export drawer's "File format" grid) renders through `SelectionTileGrid` with `interaction="button"` + `labelPlacement="inside"`. The shared `selectionTileClassNames` utility now applies **`aspect-square`** so every tile is the same shape regardless of how many tiles populate the last row of a `grid-cols-N` track. Two-word labels (e.g. "List & details") wrap inside the square because `leading-tight` keeps line height compact.
+
+When you compose your own tile-style picker, **prefer the shared `SelectionTileGrid`** (or `selectionTileClassNames` directly) instead of inventing flex/grid wrappers — that's the only way to keep the squares uniform across the system.
+
+## MUST NOT (overall)
+
+- Mount **`TablePropertiesDrawer`** on a multi-view list page **without** **`currentView`** when the active view is known from the tab.
+- Omit **`onViewChange`** if the product shows the **view type** control inside Properties (otherwise tiles cannot update the tab).
+
+## See also
+
+- **`apps/web/AGENTS.md` §4.2**, **§13** checklist
+- **`.cursor/rules/exxat-list-page-connected-views.mdc`**

package/consumer-extras/cursor-rules/exxat-token-discipline.mdc

@@ -0,0 +1,103 @@
+# Exxat DS — token discipline
+
+**Authoritative reference:** [`apps/web/docs/token-taxonomy.md`](mdc:apps/web/docs/token-taxonomy.md).
+**Machine-readable index:** [`packages/ui/tokens/hooks-index.json`](mdc:packages/ui/tokens/hooks-index.json) (163 tokens · 36 namespaces; regenerate via `pnpm --filter @exxatdesignux/ui tokens:index`).
+**Enforcement:** [`@exxatdesignux/eslint-plugin`](mdc:packages/eslint-plugin-exxat-ds/README.md) (rules `exxat-ds/no-hex-color`, `exxat-ds/no-deprecated-tokens`).
+
+Use this rule when adding **any** color, spacing, radius, shadow, or
+transition value to JSX, CSS, or Tailwind class strings.
+
+## MUST
+
+1. **Prefer the Exxat L0 namespace** for new code — `var(--exxat-color-surface-1)`,
+   `bg-surface-1`, `bg-brand-1`, `rounded-2`, `--exxat-spacing-4`, … (taxonomy §2.0).
+   L1 shadcn names (`--background`, `bg-brand`, `rounded-md`, …) remain as
+   back-compat aliases and continue to work — but new product surfaces should
+   read in the canonical brand-prefixed namespace.
+2. **Reach for a semantic token first.** If the value carries semantic intent
+   ("danger", "warning", "muted text", "card surface"), use the matching
+   token family from §2 of the taxonomy. Never reinvent semantic colors.
+3. **Use Tailwind utilities backed by tokens** (e.g. `bg-card`,
+   `text-muted-foreground`, `border-border-control`, `ring-ring`,
+   `bg-chip-2`, `text-chart-4`, **`bg-surface-1`**, **`bg-brand-1`**,
+   **`rounded-2`**). The L2 bridges in `globals.css` already wire
+   `--color-*` → `var(--*)` so utilities flip with theme + dark mode.
+3. **Brand accent comes from `--brand-color` / `bg-brand`** (and its family),
+   **not** `--primary` / `bg-primary`. Primary is **neutral charcoal** in
+   Exxat — see taxonomy §3.
+4. **Form-field borders** use `--control-border` (or `border-control-3` /
+   `border-control-35`) — never `--border` (which is decorative and < 3:1
+   contrast). Taxonomy §6.
+5. **Status chips and badges** route through
+   [`lib/list-status-badges.ts`](mdc:apps/web/lib/list-status-badges.ts)
+   (`LIST_HUB_STATUS_TINT_*` + `ListHubStatusBadge`) — not direct
+   `bg-green-500` / `bg-red-500` / hex literals.
+6. **KPI tints** route through `--insight-severity-*` (info / warning) — not
+   direct chart-color reuse. Trend polarity is set via
+   `MetricItem.trendPolarity` ([`exxat-kpi-trends.mdc`](mdc:.cursor/rules/exxat-kpi-trends.mdc)).
+7. **Scoped surface tokens stay scoped.** `--dt-*` is `DataTable` only,
+   `--key-metrics-*` is `KeyMetrics` only, `--leo-*` is Ask Leo only,
+   `--secondary-panel-bg` is the nested panel only. Do **not** reuse these
+   tokens outside their owning surface.
+8. **Adding a new token** — Follow the checklist in
+   [`token-taxonomy.md` §4](mdc:apps/web/docs/token-taxonomy.md). Declare
+   the primitive in `packages/ui/src/globals.css` (canonical CSS), bridge it in the same file's `@theme inline`
+   files when Tailwind utilities are needed, document it in the taxonomy,
+   and regenerate `tokens/hooks-index.json`.
+
+## MUST NOT
+
+1. **No raw hex / rgb / hsl color literals** in JSX `className` strings,
+   inline `style={{...}}`, or `.css` files outside of `globals.css` /
+   `globals.css` / theme overrides. The only places hex is legal are:
+   - `--theme-color-chrome` (consumed by `<meta name="theme-color">`)
+   - Status icon SVG paths that are part of a vendored asset
+   - **Documentation** examples (this rule, blueprints, migrations)
+2. **No raw `oklch(...)` literals** in component code — those belong in
+   `globals.css` theme blocks only. If you need a derived value, use
+   `color-mix(in oklch, var(--token) <pct>%, var(--other))` inside a token
+   declaration, not at the call site.
+3. **No deprecated tokens.** Inspect
+   [`tokens/hooks-index.json`](mdc:packages/ui/tokens/hooks-index.json) —
+   any entry with `"deprecated": true` is removed at the version named in
+   `deprecatedMessage`. Migrate before the removal window per
+   `apps/web/docs/migrations/`.
+4. **No ad-hoc Tailwind shades** for product chrome (e.g. `bg-slate-50`,
+   `text-zinc-600`, `border-gray-200`) when an Exxat semantic equivalent
+   exists. Tailwind shade utilities are reserved for transient prototyping
+   only; product code uses the semantic tokens.
+5. **No `text-primary` for the brand accent.** That maps to neutral charcoal
+   (see MUST #3).
+6. **No utility-class typos that look like tokens.** Examples that look
+   right but aren't:
+   - `bg-brand-color` — that's the *raw L1 name*; the L2 utility is `bg-brand`.
+   - `border-control` — there's no such utility; the field-border alias is `border-control-3` (3:1) or `border-control-35` (3.5:1+), or `border-[var(--control-border)]`.
+   - `text-foreground-muted` — the token is `--muted-foreground` (note the order).
+7. **No SLDS tokens** (`--slds-g-color-*`) — see
+   [`exxat-no-slds-leakage.mdc`](mdc:.cursor/rules/exxat-no-slds-leakage.mdc).
+
+## Aliases that ARE official
+
+Some L2 bridges intentionally use a **shorter alias** than the L1 primitive
+because the long name would be awkward in Tailwind utilities. Use the alias
+form, but be aware of the underlying primitive:
+
+| Alias (use in code) | L0 canonical | L1 primitive | Notes |
+|---|---|---|---|
+| `bg-brand` / `text-brand` | `--exxat-color-brand-1` | `--brand-color` | Brand accent |
+| `bg-brand-deep` / `text-brand-deep` | `--exxat-color-brand-deep` | `--brand-color-deep` | Coach marks, hero callouts |
+| `bg-brand-tint` | `--exxat-color-brand-tint-1` | `--brand-tint` | Sidebar wash |
+| `bg-surface-1` / `text-ink-1` | `--exxat-color-surface-1` / `--exxat-color-ink-1` | `--background` / `--foreground` | Page canvas + primary text — new code SHOULD prefer L0 form |
+| `rounded-1` … `rounded-6` | `--exxat-radius-1` … `--exxat-radius-6` | (no L1 equivalent — L0 is canonical for radius) | Numeric radius scale (4 / 8 / 12 / 16 / 20 / 24 px) |
+
+The full alias table is in [`token-taxonomy.md` §2.0](mdc:apps/web/docs/token-taxonomy.md) and [§2.2](mdc:apps/web/docs/token-taxonomy.md).
+
+## See also
+
+- [`apps/web/docs/token-taxonomy.md`](mdc:apps/web/docs/token-taxonomy.md) — full namespace + naming rules
+- [`apps/web/docs/migrations/`](mdc:apps/web/docs/migrations) — deprecation index
+- [`packages/ui/tokens/hooks-index.json`](mdc:packages/ui/tokens/hooks-index.json) — machine-readable
+- [`.cursor/rules/exxat-no-slds-leakage.mdc`](mdc:.cursor/rules/exxat-no-slds-leakage.mdc)
+- [`.cursor/rules/exxat-kpi-trends.mdc`](mdc:.cursor/rules/exxat-kpi-trends.mdc)
+- [`.cursor/rules/exxat-kpi-flat-band.mdc`](mdc:.cursor/rules/exxat-kpi-flat-band.mdc)
+- [`.cursor/rules/exxat-no-toast.mdc`](mdc:.cursor/rules/exxat-no-toast.mdc)

package/consumer-extras/cursor-skills/exxat-accessibility/SKILL.md

@@ -8,7 +8,7 @@ user-invocable: true
 
 Standard target: **WCAG 2.1 Level AA** (and 2.2 where noted).
 
-**Canonical for agents (MUST/MUST NOT, checklist):** `exxat-ds/AGENTS.md` **§8** in the repo (same content summarized there; this skill stays the detailed checklist + product tokens).
+**Canonical for agents (MUST/MUST NOT, checklist):** `apps/web/AGENTS.md` **§8** in the repo (same content summarized there; this skill stays the detailed checklist + product tokens).
 
 ## ARIA roles & structure (SC 1.3.1)
 

package/consumer-extras/cursor-skills/exxat-board-cards/SKILL.md

@@ -7,7 +7,7 @@ user-invocable: true
 
 # Exxat DS — board (kanban) cards
 
-**Canonical MUST/MUST NOT:** **`exxat-ds/AGENTS.md` §4.4** (or **`./AGENTS.md`** when the workspace is the `exxat-ds` app folder only). **Claude:** **`.claude/skills/exxat-board-cards/SKILL.md`** (repo root) or **`exxat-ds/.claude/skills/exxat-board-cards/SKILL.md`** (app-only workspace) — same body as this file. This skill is the **how-to**; the handbook stays the contract.
+**Canonical MUST/MUST NOT:** **`apps/web/AGENTS.md` §4.4** (or **`./AGENTS.md`** when the workspace is the `apps/web/` app folder only). **Claude:** **`.claude/skills/exxat-board-cards/SKILL.md`** (repo root) — same body as this file. This skill is the **how-to**; the handbook stays the contract.
 
 ## When to use this skill
 
@@ -39,13 +39,13 @@ Import from **`@/components/data-views/list-page-board-card`**:
 
 Prefer **two-line blocks** for stacked **primary / secondary** facts so cards match Placements’ visual rhythm.
 
-## Status badges (list hubs: Team, Compliance, Question bank, …)
+## Status badges (list hubs: Team, Compliance, Library, …)
 
 - **Maps (single source):** **`lib/list-status-badges.ts`** — per-entity `*_STATUS_LABEL`, `*_STATUS_BADGE_CLASS`, `*_STATUS_ICON`, plus semantic **`LIST_HUB_STATUS_TINT_*`** (success / warning / neutral / danger) for new domains.
 - **Component:** **`ListHubStatusBadge`** from **`@/components/list-hub-status-badge`** — **`surface="table"`** for **DataTable** cells and **list** rows; **`surface="board"`** inside **`ListPageBoardCardBadgeRow`**. Do not duplicate the shell classes on each page.
 - Use the **same** maps everywhere for that entity so copy and colors never drift.
 - **Do not** add **`uppercase`** or **`tracking-wide`** — **sentence / title case**, consistent with **`BoardStatusBadge`** on Placements (`placement-board-card.tsx`).
-- **Placements** lifecycle uses **`StatusBadge`** in **`data-list-table-cells.tsx`** — thin wrapper over **`ListHubStatusBadge`** + **`PLACEMENT_STATUS_*`** in **`list-status-badges.ts`** (same visuals as Team / Question bank).
+- **Placements** lifecycle uses **`StatusBadge`** in **`placements-table-cells.tsx`** — thin wrapper over **`ListHubStatusBadge`** + **`PLACEMENT_STATUS_*`** in **`list-status-badges.ts`** (same visuals as Team / Library).
 
 ## Avatar when mock has no `initials`
 

package/consumer-extras/cursor-skills/exxat-centralized-list-dataset/SKILL.md

@@ -60,18 +60,7 @@ Goal: **one row model**, **one filtered bag** (`tableState.rows`), **one place f
 
 ---
 
-## 6. View registry + connected body (required)
-
-- [ ] **`lib/<hub>-supported-views.ts`** — same array on **`ListPageTemplate`** (`supportedViewTypes`) and **`TablePropertiesDrawerButton`**.
-- [ ] **`ListPageConnectedViewBody`** + **`defineHubViewRenderers(supported, { … })`** — one renderer per **`DataListViewRenderKind`**; missing → **`ListPageViewNotConfigured`** (never silent dashboard).
-- [ ] Branch on **`getDataListViewRenderKind(view)`** via the connected body — not long **`if (view === "table")`** chains in the table file.
-- [ ] **`lib/data-list-view-registry.ts`** — labels/icons/render kinds stay centralized.
-
-**Canon:** `docs/data-views-pattern.md` § “View registry and connected bodies”, **`AGENTS.md` §4.1.1**.
-
----
-
-## 7. Implementation checklist (new hub or new view)
+## 6. Implementation checklist (new hub or new view)
 
 - [ ] Exactly **one** primary row array shape in **`lib/mock/<entity>.ts`** (or API).
 - [ ] **`useTableState`** seeded from that array; **child views** receive **`tableState.rows`** (or equivalent), **not** a fresh import of the mock list.
@@ -83,15 +72,15 @@ Goal: **one row model**, **one filtered bag** (`tableState.rows`), **one place f
 
 ---
 
-## 8. Reference implementations
+## 7. Reference implementations
 
-- **`components/data-list-client.tsx`** + **`data-list-table.tsx`** — Placements pattern.
+- **`components/placements-client.tsx`** + **`placements-table.tsx`** — Placements pattern.
 - **`components/team-client.tsx`** + **`team-table.tsx`**.
-- **`components/question-bank-table.tsx`** — multiple **`DataListViewType`** branches sharing **`tableState`** / **`folders`** / **`items`**.
+- **`components/library-table.tsx`** — multiple **`DataListViewType`** branches sharing **`tableState`** / **`folders`** / **`items`**.
 
 ---
 
-## 9. Centralized presentation (with the same dataset)
+## 8. Centralized presentation (with the same dataset)
 
 **Layout:** Non-table view branches wrap in **`ListPageViewFrame`** (constants in **`list-page-view-frame.tsx`**) — see **`.cursor/rules/exxat-list-page-view-shells.mdc`**.
 

package/consumer-extras/cursor-skills/exxat-collaboration-access/SKILL.md

@@ -9,7 +9,7 @@ user-invocable: true
 **Handbook:** `apps/web/AGENTS.md` §4.7  
 **Narrative:** `apps/web/docs/collaboration-access-pattern.md`  
 **Cursor rule:** `.cursor/rules/exxat-collaboration-access.mdc`  
-**Related (Question bank folder scope + ⋯ Customize folder):** `.cursor/rules/exxat-question-bank-hub-header.mdc` · `docs/question-bank-hub-header-pattern.md`
+**Related (Library folder scope + ⋯ Customize folder):** `.cursor/rules/exxat-library-hub-header.mdc` · `docs/library-hub-header-pattern.md`
 
 ## Wiring checklist
 
@@ -20,7 +20,7 @@ user-invocable: true
 5. **Access maps** — `lib/collaborator-access.ts` for Owner / Editor / Commenter / Viewer, invite options, and **`COLLABORATION_HEADER_ADD_LABEL`**.
 6. **Header** — empty roster → outline **Add collaborator**; non-empty → face rail; both open the invite sheet.
 7. **Invite sheet** — `InviteCollaboratorsDrawer`: export-style **`Sheet`**, combined email + access menu, grouped roster (name → email → role tags → access badge).
-8. **Question bank — folder URL scope** — When **`?scope=folder`**, **`QuestionBankPageHeader`** **⋯** also lists **Customize folder**; **`QuestionBankNewFolderSheet`** on **`QuestionBankClient`** — **`.cursor/rules/exxat-question-bank-hub-header.mdc`**, **`docs/question-bank-hub-header-pattern.md`**.
+8. **Library — folder URL scope** — When **`?scope=folder`**, **`LibraryPageHeader`** **⋯** also lists **Customize folder**; **`LibraryNewFolderSheet`** on **`LibraryClient`** — **`.cursor/rules/exxat-library-hub-header.mdc`**, **`docs/library-hub-header-pattern.md`**.
 
 ## MUST NOT
 
@@ -31,5 +31,5 @@ user-invocable: true
 
 ## Reference
 
-- `components/collaboration-access-flow.tsx`, `components/question-bank-page-header.tsx`, `components/question-bank-client.tsx`
+- `components/collaboration-access-flow.tsx`, `components/library-page-header.tsx`, `components/library-client.tsx`
 - `components/invite-collaborators-drawer.tsx`, `components/export-drawer.tsx`

package/consumer-extras/cursor-skills/exxat-dedicated-search-surfaces/SKILL.md

@@ -37,8 +37,8 @@ description: >-
 | Recents list | `components/dedicated-search-recents.tsx` |
 | Recents storage factory | `lib/dedicated-search-recents.ts` |
 | Optional default `q` patcher | `lib/dedicated-search-url.ts` |
-| Question bank adapter (placeholders + patch) | `lib/question-bank-dedicated-search.ts` |
-| Question bank wiring | `components/question-bank-client.tsx` |
+| Library adapter (placeholders + patch) | `lib/library-dedicated-search.ts` |
+| Library wiring | `components/library-client.tsx` |
 
 ## Cursor rule
 

package/consumer-extras/cursor-skills/exxat-ds-skill/SKILL.md

@@ -19,10 +19,10 @@ description: >
 ## 1. Project Overview
 
 - **Stack:** Next.js 16 (App Router), React, TypeScript, Tailwind CSS, shadcn/ui primitives, Font Awesome icons
-- **App root:** `exxat-ds/app/(app)/` — route group that wraps all authenticated pages
-- **Single source of truth:** `exxat-ds/AGENTS.md` for full prose explanations; this skill is the actionable summary
-- **Companion skills (narrow topics):** `exxat-fontawesome-icons`, `exxat-mono-ids`, `exxat-primary-nav-secondary-panel`, `exxat-centralized-list-dataset`, `exxat-list-page-view-shells`, `exxat-dedicated-search-surfaces`, `exxat-focused-workflow-page`, `exxat-accessibility`, `exxat-board-cards`, `exxat-collaboration-access` — live under `.cursor/skills/`; vetted copies ship with **`@exxatdesignux/ui`** in `consumer-extras/cursor-skills/` after **`pnpm --filter @exxatdesignux/ui vendor:consumer-extras`**.
-- **Question bank folder-scoped header (rule + doc):** **`.cursor/rules/exxat-question-bank-hub-header.mdc`** and **`docs/question-bank-hub-header-pattern.md`** — pair with **`exxat-primary-nav-secondary-panel`** when URL **`scope=folder`** drives the hub title.
+- **App root:** `apps/web/app/(app)/` — route group that wraps all authenticated pages
+- **Single source of truth:** `apps/web/AGENTS.md` for full prose explanations; this skill is the actionable summary
+- **Companion skills (narrow topics):** `exxat-fontawesome-icons`, `exxat-mono-ids`, `exxat-primary-nav-secondary-panel`, `exxat-centralized-list-dataset`, `exxat-list-page-view-shells`, `exxat-dedicated-search-surfaces`, `exxat-accessibility`, `exxat-board-cards`, `exxat-collaboration-access` — live under `.cursor/skills/`; vetted copies ship with **`@exxatdesignux/ui`** in `consumer-extras/cursor-skills/` after **`pnpm --filter @exxatdesignux/ui vendor:consumer-extras`**.
+- **Library folder-scoped header (rule + doc):** **`.cursor/rules/exxat-library-hub-header.mdc`** and **`docs/library-hub-header-pattern.md`** — pair with **`exxat-primary-nav-secondary-panel`** when URL **`scope=folder`** drives the hub title.
 - **Consumer repos (npm install of `@exxatdesignux/ui`):** After a version bump, read **`node_modules/@exxatdesignux/ui/CHANGELOG.md`**, run **`npx --package=@exxatdesignux/ui@latest exxat-ui sync-extras`** so **`docs/exxat-ds/consumer-upgrade-checklist.md`** and Cursor skills match the tarball, and diff the host app against **`node_modules/@exxatdesignux/ui/template/`** for anything new to port (routes, re-exports, AGENTS). Use **`exxat-ui changelog`**, **`exxat-ui update`**, and **`exxat-ui doctor`** for CLI guidance.
 
 ---
@@ -105,15 +105,15 @@ A primary nav row that owns sub-routes has **three possible shapes** — pick ex
 
 | Shape | When to use | Where it lives |
 |---|---|---|
-| **A. Collapsible children** (e.g. Question Bank → All / My / Favorites / Folders) | Small finite child list that benefits from inline browsing (≤ 40 items, no extra page chrome). | `NavLinkItem.children` rendered by **`CollapsibleNavItem`** in `app-sidebar.tsx`. |
+| **A. Collapsible children** (e.g. Library → All / My / Favorites / Folders) | Small finite child list that benefits from inline browsing (≤ 40 items, no extra page chrome). | `NavLinkItem.children` rendered by **`CollapsibleNavItem`** in `app-sidebar.tsx`. |
 | **B. Secondary panel** (separate nested rail) | Same nav row needs **scoped search / tree / metrics** alongside the hub content. | `NavLinkItem.secondaryPanel = "<id>"` + `PANELS[id]` — see companion skill `exxat-primary-nav-secondary-panel`. |
-| **C. Both A + B on one row** (Question Bank does this) | Most cases when a hub has a sub-list AND a rich rail. The sidebar still shows the collapsible children; clicking the parent route also opens the secondary panel via `useAutoPanel`. | Combine A + B; the active-state and animation rules in §3.2 still apply to the sidebar children. |
+| **C. Both A + B on one row** (Library does this) | Most cases when a hub has a sub-list AND a rich rail. The sidebar still shows the collapsible children; clicking the parent route also opens the secondary panel via `useAutoPanel`. | Combine A + B; the active-state and animation rules in §3.2 still apply to the sidebar children. |
 
 #### Active-state rules — **the single biggest mistake to avoid**
 
 1. **Expanded sidebar (full rail):** parent stays **visually neutral** when a child is active — **never double-highlight**. `isCollapsibleParentMenuButtonActive` returns `false` if `anyChildActive` so the active child row carries `data-active` alone.
 2. **Collapsed sidebar (icon rail):** the parent icon is the **only** affordance, so it lights up when **any child** route is active. Implementation: `iconRailActive = isAnyChildActive` is fed into `SidebarMenuButton.isActive` and selects `item.iconActive` (`fa-solid`) over `item.icon` (`fa-light`).
-3. **Tooltip / aria copy** in icon mode names the parent (e.g. "Question bank — open subpages"); the **popover** content lists children with their own active state so users see which sub-route is selected.
+3. **Tooltip / aria copy** in icon mode names the parent (e.g. "Library — open subpages"); the **popover** content lists children with their own active state so users see which sub-route is selected.
 
 ```tsx
 // Inside CollapsibleNavItem
@@ -259,21 +259,8 @@ ListPageTemplate
 ```
 
 **Reference implementations:**
-- **`apps/web`:** `components/list-hub-client.tsx` + `list-hub-table.tsx`, `question-bank-client.tsx` + `question-bank-table.tsx`
-- **`packages/ui/template/`** (ships with npm): `placements-client.tsx` + `placements-table.tsx`, `team-client.tsx` + `team-table.tsx` — diff template on upgrade
-
-### 4.1 View registry (do not fork `if (view === …)`)
-
-1. **`lib/data-list-view.ts`** — `DATA_LIST_VIEW_TILES` (labels/icons).
-2. **`lib/data-list-view-registry.ts`** — `renderKind`, `showsListPageHubMetricsStrip`, `dataListViewTilesForHub`.
-3. **`lib/foo-supported-views.ts`** — `export const FOO_SUPPORTED_VIEWS = ["table", "list", …] as const`.
-4. **`ListPageTemplate`** — `supportedViewTypes={FOO_SUPPORTED_VIEWS}`.
-5. **`foo-table.tsx`** — `ListPageConnectedViewBody` with renderers per kind; **`TablePropertiesDrawerButton`** gets the same **`supportedViewTypes`**.
-6. Generic bodies under **`components/data-views/`** — calendar, board template, folder grid, etc.
-
-**MUST NOT** default unknown views to dashboard KPIs — missing renderers use **`ListPageViewNotConfigured`**.
-
-**Narrative:** `docs/data-views-pattern.md` § “View registry and connected bodies”.
+- `components/team-client.tsx` + `components/team-table.tsx` — canonical pattern
+- `components/placements-client.tsx` + `components/placements-table.tsx` — Placements (most complete)
 
 **Files to create for a new hub page `Foo`:**
 | File | Purpose |
@@ -281,21 +268,19 @@ ListPageTemplate
 | `lib/mock/foo.ts` | Mock data + TypeScript interface (12+ rows) |
 | `lib/mock/foo-kpi.ts` | `fooKpiMetrics()` + `fooKpiInsight()` |
 | `components/foo-page-header.tsx` | `PageHeader` + primary CTA + ⋯ menu |
-| `lib/foo-supported-views.ts` | Views this hub implements (registry allowlist) |
-| `components/foo-table.tsx` | `ListPageConnectedViewBody` + `DataTable` + `useTableState` + Properties |
-| `components/foo-client.tsx` | `ListPageTemplate` + `supportedViewTypes` |
+| `components/foo-table.tsx` | `DataTable` + `useTableState` + `TablePropertiesDrawer` |
+| `components/foo-client.tsx` | `ListPageTemplate` orchestrator |
 | `app/(app)/foo/page.tsx` | Thin server component |
 
-**Do not** ship a **nav-linked hub** as an **empty page** or a single “replace this later” paragraph. If the route appears in **`lib/mock/navigation.tsx`**, implement the full hub (mock rows, **`ListPageTemplate`**, connected views per **`exxat-ds/AGENTS.md` §4.1**) unless the product explicitly defines a non-data shell.
+**Do not** ship a **nav-linked hub** as an **empty page** or a single “replace this later” paragraph. If the route appears in **`lib/mock/navigation.tsx`**, implement the full hub (mock rows, **`ListPageTemplate`**, connected views per **`apps/web/AGENTS.md` §4.1**) unless the product explicitly defines a non-data shell.
 
 ### Page vs drawer (actions)
 
 - **Drawer / sheet** — Use when the user needs **the current page behind them** *and* a **quick view**, **quick actions**, or a **short step** (e.g. properties, export, glance at a row).
 - **Dialog** — **Blocking** confirm/alert/short choice — **`docs/drawer-vs-dialog-pattern.md`**, **`.cursor/rules/exxat-drawer-vs-dialog.mdc`**.
 - **New page** — Use **otherwise**: **primary**, **long-form**, **multi-step**, or flows that need their **own URL** without the hub visible.
-- **Focused workflow route** — **`FocusedWorkflowPageTemplate`** + **`FocusedWorkflowSingleColumn`** | **`FocusedWorkflowStepForm`** | **`FocusedWorkflowSidebarSections`** | **`FocusedWorkflowEmptyState`** — **`docs/focused-workflow-page-pattern.md`**, **`AGENTS.md` §14**, **`exxat-focused-workflow-page`** skill. **Not** list hubs; **not** Miller columns.
 
-Align with **`exxat-ds/AGENTS.md` §6.4**, **§14**, **`docs/data-views-pattern.md`**, **`docs/drawer-vs-dialog-pattern.md`**, **`docs/focused-workflow-page-pattern.md`**, **`.cursor/rules/exxat-page-vs-drawer.mdc`**, **`.cursor/rules/exxat-drawer-vs-dialog.mdc`**, **`.cursor/rules/exxat-focused-workflow-page.mdc`**.
+Align with **`apps/web/AGENTS.md` §6.4**, **`docs/data-views-pattern.md`**, **`docs/drawer-vs-dialog-pattern.md`**, **`.cursor/rules/exxat-page-vs-drawer.mdc`**, **`.cursor/rules/exxat-drawer-vs-dialog.mdc`**.
 
 ---
 
@@ -311,7 +296,7 @@ Align with **`exxat-ds/AGENTS.md` §6.4**, **§14**, **`docs/data-views-pattern.
 | `ColumnDef` from `@/components/data-table/types` | Column type |
 | `FilterFieldDef`, `FilterOperator`, `ConditionalRule` from `@/components/table-properties/types` | Filter types |
 
-**Board (kanban) cards:** Use **`ListPageBoardCard`** and related parts from **`components/data-views/list-page-board-card.tsx`**; **`BoardCardTwoLineBlock`** / **`BoardCardIconRow`** from **`board-card-primitives.tsx`**. **List hub** status (Team, Compliance, Question bank, …): maps in **`lib/list-status-badges.ts`**; render with **`ListHubStatusBadge`** (**`surface="table"`** in table/list, **`surface="board"`** on cards); semantic tints **`LIST_HUB_STATUS_TINT_*`** for new domains; no **`uppercase`**. **Placements** uses **`StatusBadge`** in **`data-list-table-cells.tsx`** (wrapper over **`ListHubStatusBadge`** + **`PLACEMENT_STATUS_*`**). **Full rules:** **`exxat-ds/AGENTS.md` §4.4**, **`.cursor/rules/exxat-board-cards.mdc`**, **`.cursor/skills/exxat-board-cards/SKILL.md`**.
+**Board (kanban) cards:** Use **`ListPageBoardCard`** and related parts from **`components/data-views/list-page-board-card.tsx`**; **`BoardCardTwoLineBlock`** / **`BoardCardIconRow`** from **`board-card-primitives.tsx`**. **List hub** status (Team, Compliance, Library, …): maps in **`lib/list-status-badges.ts`**; render with **`ListHubStatusBadge`** (**`surface="table"`** in table/list, **`surface="board"`** on cards); semantic tints **`LIST_HUB_STATUS_TINT_*`** for new domains; no **`uppercase`**. **Placements** uses **`StatusBadge`** in **`placements-table-cells.tsx`** (wrapper over **`ListHubStatusBadge`** + **`PLACEMENT_STATUS_*`**). **Full rules:** **`apps/web/AGENTS.md` §4.4**, **`.cursor/rules/exxat-board-cards.mdc`**, **`.cursor/skills/exxat-board-cards/SKILL.md`**.
 
 **Minimum required features on any data list page:**
 - Search (wire `searchable={displayOptions.showToolbarSearch}`)
@@ -416,9 +401,9 @@ Use `PageHeader` from `@/components/page-header` for the content-area header (be
 
 When a hub is **shared**, use **`PageHeader` `variant="collaboration"`**: **empty roster** → outline **Add collaborator**; **non-empty** → face rail (faces / **`+N`** open the invite sheet). **Invite people** also lives under the entity header **⋯ More** and opens **`InviteCollaboratorsDrawer`** via **`CollaborationAccessFlow`** when possible. Library access (Owner / Editor / Commenter / Viewer) comes from **`lib/collaborator-access.ts`**; directory tags (Faculty, Program coordinator, Director) use **`PageHeaderCollaborator.roles`**.
 
-**Question bank library — folder URL scope:** When **`?scope=folder&folderId=`** applies, **⋯ More** must also offer **Customize folder** (**`QuestionBankPageHeader`** **`onCustomizeFolder`**) and the **`QuestionBankNewFolderSheet`** must be mounted on **`QuestionBankClient`** so it works on every **`ListPageTemplate`** view tab. **`.cursor/rules/exxat-question-bank-hub-header.mdc`** · **`docs/question-bank-hub-header-pattern.md`** (app: **`apps/web/docs/...`**).
+**Library library — folder URL scope:** When **`?scope=folder&folderId=`** applies, **⋯ More** must also offer **Customize folder** (**`LibraryPageHeader`** **`onCustomizeFolder`**) and the **`LibraryNewFolderSheet`** must be mounted on **`LibraryClient`** so it works on every **`ListPageTemplate`** view tab. **`.cursor/rules/exxat-library-hub-header.mdc`** · **`docs/library-hub-header-pattern.md`** (app: **`apps/web/docs/...`**).
 
-**Handbook:** `apps/web/AGENTS.md` §4.7 · **Doc:** `docs/collaboration-access-pattern.md` · **Skill:** `.cursor/skills/exxat-collaboration-access/SKILL.md` · **Reference:** Question bank header + client.
+**Handbook:** `apps/web/AGENTS.md` §4.7 · **Doc:** `docs/collaboration-access-pattern.md` · **Skill:** `.cursor/skills/exxat-collaboration-access/SKILL.md` · **Reference:** Library header + client.
 
 ---
 
@@ -621,7 +606,7 @@ Reference implementations: `new-placement-form.tsx` (Create placement = Enter on
 - **Natural language / AI:** Product **SHOULD** show **quick results in the palette** when the response fits; use **Ask Leo** (**⌘⌥K**) for **longer or complex** answers.
 - **Do not** treat the palette as a static link list only—leave room for inline AI results as they ship.
 
-**Details:** `exxat-ds/docs/command-menu-pattern.md`, **`exxat-ds/AGENTS.md` §7.1** (or `./` when the app folder is the workspace root).
+**Details:** `apps/web/docs/command-menu-pattern.md`, **`apps/web/AGENTS.md` §7.1** (or `./` when the app folder is the workspace root).
 
 ---
 
@@ -876,8 +861,8 @@ Copy and complete for every list/table/hub page:
 - [ ] Sidebar item added to `lib/mock/navigation.tsx` with light/solid icon pair
 - [ ] **Shell sidebar:** Product header uses **`ExxatProductLogo`**; school **`logoDevUrl`** + **`lib/logo-dev`**; team switcher menu **`!w-max`** (not trigger-width-only); expanded switcher **`h-auto min-h-12`** so school + program lines are not clipped; no **`CollapsibleTrigger` → `SidebarMenuButton` with `tooltip` prop**; child nav uses **popover** on icon rail per **§3.1**
 - [ ] Hub pages: `ListPageTemplate` + `DataTable` + `useTableState` + `TablePropertiesDrawer`
-- [ ] Board view: `ListPageBoardCard` shell + `ListHubStatusBadge` + `list-status-badges` when applicable (`exxat-ds/AGENTS.md` §4.4)
-- [ ] New primary hubs: not placeholder-only — full template + data + views (`exxat-ds/AGENTS.md` §4.1)
+- [ ] Board view: `ListPageBoardCard` shell + `ListHubStatusBadge` + `list-status-badges` when applicable (`apps/web/AGENTS.md` §4.4)
+- [ ] New primary hubs: not placeholder-only — full template + data + views (`apps/web/AGENTS.md` §4.1)
 - [ ] **§6.4:** Parent **context** + quick view/actions → drawer/sheet; primary or long flows → **new page** (`AGENTS.md`, `docs/data-views-pattern.md`)
 - [ ] No raw `<table>` or `ui/table` for product data lists
 - [ ] No double horizontal padding around `DataTable`

package/consumer-extras/cursor-skills/exxat-ds-skill/references/data-table-pattern.md

@@ -1,6 +1,6 @@
 # Data Table Pattern — Full Implementation Guide
 
-Reference implementation: `components/team-table.tsx` (Team) and `components/data-list-table.tsx` (Placements).
+Reference implementation: `components/team-table.tsx` (Team) and `components/placements-table.tsx` (Placements).
 
 ---
 

package/consumer-extras/cursor-skills/exxat-kpi-flat-band/SKILL.md

@@ -30,7 +30,7 @@ user-invocable: true
 
 - `apps/web/components/key-metrics.tsx` — `flatMetricsHairlineClass`, `flatBandStyle`
 - `apps/web/app/globals.css` — `--key-metrics-flat-*`
-- `question-bank-client.tsx`, `dashboard-tabs.tsx` — reference usage
+- `library-client.tsx`, `dashboard-tabs.tsx` — reference usage
 
 ## Pair with
 

package/consumer-extras/cursor-skills/exxat-list-page-view-shells/SKILL.md

@@ -21,7 +21,7 @@ description: >-
    - Pass **`maxWidthClassName={LIST_PAGE_VIEW_FRAME_MAX_WIDE}`** when the view includes toolbar rows + breadcrumbs + grid.
 2. **Do not double-gutter** — If **`DataTable`** already provides horizontal inset for the **table** view, do **not** wrap that branch in **`ListPageViewFrame`**. Use the frame on **sibling** view branches (folder, panel, etc.) only.
 3. **Reuse before inventing** — Prefer **`FolderGridView`**, **`FinderPanelView`**, **`ListPageBoardTemplate`**, **`ListPageViewFrame`**. If a new pattern appears twice, **promote** it to **`components/data-views/`** with domain-agnostic props.
-4. **Entity-specific → generic** — If logic is “any tree + any row type”, build **`components/data-views/<generic-name>.tsx`** and keep **`question-bank-*`** (or similar) as a thin composition + mock types.
+4. **Entity-specific → generic** — If logic is “any tree + any row type”, build **`components/data-views/<generic-name>.tsx`** and keep **`library-*`** (or similar) as a thin composition + mock types.
 
 ## Checklist
 

package/consumer-extras/cursor-skills/exxat-mono-ids/SKILL.md

@@ -39,11 +39,11 @@ Always include **`tabular-nums`** with **`font-mono`** so fixed-width digits ali
 
 | Surface | File |
 |---------|------|
-| Question bank table | `components/question-bank-table.tsx` — `row.questionId` |
-| Question bank list | `components/question-bank-list-view.tsx` |
-| New question subtitle | `components/new-question-composer.tsx` — `questionId` in `PageHeader` subtitle |
+| Library table | `components/library-table.tsx` — `row.questionId` |
+| Library list | `components/library-list-view.tsx` |
+| New question subtitle | `components/new-library-item-form.tsx` — `questionId` in `PageHeader` subtitle |
 | Sites record id | `components/sites-table.tsx` — `row.id` |
-| OS folder tiles | `components/question-bank-os-folder-view.tsx` |
+| OS folder tiles | `components/library-os-folder-view.tsx` |
 
 ## Review checklist