@exxatdesignux/ui 0.5.2 → 0.5.3

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # Changelog
 
+## 0.5.3
+
+### Patch Changes
+
+- **List hubs default to seven connected views.** `FULL_HUB_SUPPORTED_VIEWS` (table, list, board, dashboard, folder, panel, tree-panel) is exported from `lib/data-list-view-registry` and used as the default `supportedViewTypes` on `HubTable` and `ListPageTemplate`. `PRIMARY_HUB_SUPPORTED_VIEWS` remains for documented four-view exceptions.
+- **`prepare` builds `dist/` when missing** (`scripts/ensure-dist.mjs`) so fresh installs resolve `@exxatdesignux/ui` subpath imports without a manual build step.
+- **`nav-active` helpers** (`lib/nav-active.ts`) for single-active sidebar / secondary nav links.
+- **Vendored agent docs:** `exxat-hub-supported-views.mdc` and `hub-supported-views-pattern.md` in `consumer-extras` so npm consumers get Add view parity guardrails.
+
 ## 0.5.2
 
 ### Patch Changes

package/consumer-extras/cursor-rules/exxat-data-tables.mdc

@@ -7,7 +7,7 @@ alwaysApply: true
 
 ## Use one stack for product data lists
 
-For **any app screen that shows a browsable, filterable grid of records** (lists, directories, placements, tokens, columns showcase, etc.):
+For **any app screen that shows a browsable, filterable grid of records** (directories, tokens, columns showcase, question banks, etc.):
 
 1. **Inside `ListPageTemplate` (every primary hub + every showcase page that mounts a hub-style grid) MUST use `HubTable`** from `@/components/data-views`. `HubTable` is the **canonical** wrapper that wires `useTableState`, the toolbar (**search + filter chips + filter dropdown + sort**), the **Table properties drawer**, view-type tiles, bulk-actions, and conditional rules in one place. Pages that drop down to raw `<DataTable>` silently lose filters and Properties — **MUST NOT** ship a hub or showcase that way.
 2. **Outside `ListPageTemplate`** (rare — e.g. embedded mini-grids, modal sub-tables, drawer body lists), use `DataTable` from `@/components/data-table` directly. Even then, prefer composing a small `toolbarSlot` with `TablePropertiesDrawerButton` whenever the grid is more than a handful of rows.
@@ -17,14 +17,13 @@ For **any app screen that shows a browsable, filterable grid of records** (lists
 6. **Table properties:** Always reachable. `HubTable` mounts `TablePropertiesDrawerButton` in `toolbarSlot`; on **`ListPageTemplate`** pages with **table / list / board / dashboard** tabs it **MUST** also receive **`currentView`** and **`onViewChange`** (see **`apps/web/AGENTS.md` §4.2** and **`.cursor/rules/exxat-table-properties-drawer.mdc`**) so Properties matches the selected view.
 7. **Dropdown menus:** `DropdownMenuContent` uses the shared **`@exxatdesignux/ui`** default (**intrinsic `w-max`**, **`min-w-52`**, capped **`max-w`**) for view settings, row ⋯, column menus, and filter pickers — **pure CSS**, no **`ResizeObserver`**. Override only for deliberate narrow/wide rails (e.g. pagination **`w-20`**, account trigger-width, school switcher **`!w-max min-w-72 …`**). See **`docs/data-views-pattern.md`** (“Dropdown menus”).
 8. **Cell renderers MUST come from `@/components/data-views` (`table-cells.tsx`).** The DS ships **`ProgressCell`**, **`CurrencyCell`**, **`NumericCell`**, **`RatingCell`**, **`SignalBarsCell`**, **`BooleanToggleCell`**, **`AttachmentCountCell`**, **`ExternalLinkCell`**, **`RelativeTimeCell`**, **`PeopleAvatarRailCell`**, **`PillCell`**, **`TagListCell`**, and a generic **`RowActionsCell<TRow>`**. A `ColumnDef['cell']` for these patterns is a **one-liner** that calls the named cell. **MUST NOT** inline `Intl.NumberFormat`, raw `<a target="_blank">`, `[1,2,3,4,5].map(s => …)` star loops, paperclip + count chips, custom face-rail `AvatarGroup`s, or per-hub `DropdownMenu` overflow menus inside `cell:` — those are signals you're re-deriving a shipped primitive. Catalog: `apps/web/components/columns-showcase.tsx` (`/columns`). Skill: `.cursor/skills/exxat-token-economy/SKILL.md` §3.
+9. **Add view parity** — **`FULL_HUB_SUPPORTED_VIEWS`** + a real renderer per view — **`.cursor/rules/exxat-hub-supported-views.mdc`**, **`docs/exxat-ds/patterns/hub-supported-views-pattern.md`**.
 
 **Reference implementations:**
 
-- `components/placements-table.tsx` — full hub: paged table, board, dashboard, list, conditional rules, dashboard customize, bulk actions.
-- `components/sites-table.tsx` — table + finder/board.
-- `components/team-table.tsx` — table + dashboard + list.
-- `components/columns-showcase.tsx` — minimal hub (single `table` view); good reference for showcase pages.
-- `components/tokens-themes-client.tsx` — minimal hub + secondary panel scope.
+- `components/library-table.tsx` + `components/library-client.tsx` — **canonical** seven-view hub (All questions).
+- `components/columns-showcase.tsx` — cell-pattern catalog via **`LibraryTable`** (`columnDefs` + folder state); same Add view as Library.
+- `components/tokens-themes-client.tsx` + `components/tokens-hub-auxiliary-views.tsx` — tokens hub with **`FULL_HUB_SUPPORTED_VIEWS`**.
 
 ## Do not
 
@@ -32,12 +31,15 @@ For **any app screen that shows a browsable, filterable grid of records** (lists
 - Do **not** mount raw `<DataTable>` inside `ListPageTemplate.renderContent` — use `HubTable`. Raw `<DataTable>` does not ship the Properties drawer or filter chips; users lose discoverability.
 - Do **not** introduce a second “table component” pattern for the same product surfaces (splitting search/filters/properties across incompatible implementations).
 - Do **not** inline-implement progress bars, currency formatters, rating stars, relative-time helpers, attachment chips, external-link wrappers, face rails, type pills, tag lists, or row-action dropdowns inside a `ColumnDef['cell']`. Import the named cell from `@/components/data-views` instead. New hub with novel cell needs MUST extend `table-cells.tsx` (and ship the catalog entry in `columns-showcase.tsx`), not fork inline JSX.
+- Do **not** trim **`supportedViewTypes`** to table-only or **`PRIMARY_HUB_SUPPORTED_VIEWS`** on hubs that should match Library — see **`exxat-hub-supported-views.mdc`**.
 
 ## Exceptions
 
 - **Tiny, read-only tables inside charts or analytics cards** (e.g. chart figure captions / summary matrices) may use minimal markup when they are not primary data-list experiences — still prefer tokens and accessibility, but the full hub stack is not required there.
 - **Drawer body and dialog sub-grids** (small, secondary, scoped to a transient flow) — raw `<DataTable>` is acceptable; still expose search if rows > ~10.
+- **Documented narrow allowlists** in `lib/*-supported-views.ts` when product truly omits folder/panel/tree (comment required).
 
 ## See also
 
 - **`apps/web/AGENTS.md`** — full MUST/MUST NOT, list-page template, primary hubs, checklist.
+- **`.cursor/rules/exxat-hub-supported-views.mdc`** — Add view menu + renderer matrix.

package/consumer-extras/cursor-rules/exxat-ds-agents.mdc

@@ -40,6 +40,7 @@ Before implementing or reviewing **list / table / board / dashboard / data-heavy
 25. **No SLDS leakage** — **`.cursor/rules/exxat-no-slds-leakage.mdc`** — no `slds-*` classes, no `<lightning-*>` markup, no SLDS token names, no synthetic-shadow assumptions. ESLint catches via `exxat-ds/no-slds-classes` + `exxat-ds/no-lightning-elements` (from **`@exxatdesignux/eslint-plugin`**).
 26. **Blueprints + selection guide** — **`apps/web/docs/blueprints/`** + **`apps/web/docs/component-selection-guide.md`** — framework-agnostic specs + decision tree across the whole DS. Start there before composing a new hub.
 27. **Migrations** — **`apps/web/docs/migrations/`** — every deprecation gets a numbered entry (`NNNN-<slug>.md`). Token deprecations surface in `tokens/hooks-index.json` as `deprecated: true` and are lint-flagged.
+28. **Hub supported views (Add view parity)** — **`exxat-hub-supported-views.mdc`** + **`docs/exxat-ds/patterns/hub-supported-views-pattern.md`** — **`FULL_HUB_SUPPORTED_VIEWS`** (seven views, same as Library); sync **`ListPageTemplate`** + **`HubTable`**; real renderers per view; **`LibraryTable`** for **`LibraryItem`** catalogs; **`tokens-hub-auxiliary-views.tsx`** for tokens.
 
 ## Also read
 
@@ -50,7 +51,7 @@ Before implementing or reviewing **list / table / board / dashboard / data-heavy
 - **`apps/web/docs/blueprints/`** — framework-agnostic specs (start: `page-header.md`, `data-table.md`).
 - **`apps/web/docs/migrations/`** — token rename + removal history.
 - **`packages/ui/tokens/hooks-index.json`** — machine-readable token index (regenerate via `pnpm --filter @exxatdesignux/ui tokens:index`).
-- `.cursor/rules/exxat-data-tables.mdc`, `exxat-list-page-connected-views.mdc`, **`exxat-centralized-list-dataset.mdc`**, **`exxat-list-page-view-shells.mdc`**, **`exxat-fontawesome-icons.mdc`**, **`exxat-mono-ids.mdc`**, **`exxat-primary-nav-secondary-panel.mdc`**, **`exxat-library-hub-header.mdc`**, **`exxat-collaboration-access.mdc`**, **`exxat-dedicated-search-surfaces.mdc`**, **`exxat-kpi-trends.mdc`**, **`exxat-kpi-flat-band.mdc`**, **`exxat-drawer-vs-dialog.mdc`**, **`exxat-card-vs-list-rows.mdc`**, **`exxat-kpi-max-four.mdc`**, **`exxat-reuse-before-custom.mdc`**, `exxat-table-properties-drawer.mdc`, **`exxat-board-cards.mdc`**, **`exxat-page-vs-drawer.mdc`**, **`exxat-no-toast.mdc`**, **`exxat-command-menu.mdc`**, `exxat-kbd-shortcuts.mdc`, `exxat-accessibility.mdc` at repo root; **`apps/web/.cursor/rules/exxat-dashboard-view-charts.mdc`** for Data tab charts.
+- `.cursor/rules/exxat-data-tables.mdc`, **`exxat-hub-supported-views.mdc`**, `exxat-list-page-connected-views.mdc`, **`exxat-centralized-list-dataset.mdc`**, **`exxat-list-page-view-shells.mdc`**, **`exxat-fontawesome-icons.mdc`**, **`exxat-mono-ids.mdc`**, **`exxat-primary-nav-secondary-panel.mdc`**, **`exxat-library-hub-header.mdc`**, **`exxat-collaboration-access.mdc`**, **`exxat-dedicated-search-surfaces.mdc`**, **`exxat-kpi-trends.mdc`**, **`exxat-kpi-flat-band.mdc`**, **`exxat-drawer-vs-dialog.mdc`**, **`exxat-card-vs-list-rows.mdc`**, **`exxat-kpi-max-four.mdc`**, **`exxat-reuse-before-custom.mdc`**, `exxat-table-properties-drawer.mdc`, **`exxat-board-cards.mdc`**, **`exxat-page-vs-drawer.mdc`**, **`exxat-no-toast.mdc`**, **`exxat-command-menu.mdc`**, `exxat-kbd-shortcuts.mdc`, `exxat-accessibility.mdc` at repo root; **`apps/web/.cursor/rules/exxat-dashboard-view-charts.mdc`** for Data tab charts.
 - **`apps/web/docs/kpi-flat-band-pattern.md`**, **`apps/web/docs/shell-surface-elevation-pattern.md`** — flat KPI strip + sidebar/secondary/page OKLCH stack.
 - **`apps/web/docs/library-hub-header-pattern.md`** — folder-scoped library header **Customize folder**.
 - **`apps/web/docs/collaboration-access-pattern.md`** — shared hub face rail + invite sheet.

package/consumer-extras/cursor-rules/exxat-hub-supported-views.mdc

@@ -0,0 +1,54 @@
+---
+description: List-page hubs — FULL_HUB_SUPPORTED_VIEWS, Add view parity, and real renderers (never trimmed allowlists or placeholder list rows)
+alwaysApply: true
+---
+
+# Exxat DS — hub supported views (Add view parity)
+
+**Canonical reference:** `components/library-table.tsx` + `components/library-client.tsx` (All questions / Library).
+
+**Registry:** `FULL_HUB_SUPPORTED_VIEWS` in `@exxatdesignux/ui/lib/data-list-view-registry` (re-export `@/lib/data-list-view-registry`).
+
+## Default allowlist (seven views)
+
+Every **`ListPageTemplate`** + **`HubTable`** hub that mounts a product data grid **MUST** expose the same **Add view** menu as Library unless product documents a narrower exception in the hub’s `*-supported-views.ts` file:
+
+| # | View | Render kind | How to implement |
+|---|------|-------------|------------------|
+| 1 | Table | `data-table` | Default `HubTable` / custom `columnDefs` |
+| 2 | List | `list-with-toolbar` | **`ListPageBoardCard`** `layout="row"` via `renderListRow` — same as `library-table.tsx` |
+| 3 | Board | `board-with-toolbar` | `renderers["board-with-toolbar"]` or `renderBoardCard` + `boardGroups` |
+| 4 | Dashboard | `dashboard-with-toolbar` | `renderers["dashboard-with-toolbar"]` with **`KeyMetrics`** / charts on `state.rows` |
+| 5 | Folder | `folder-with-toolbar` | `renderers["folder-with-toolbar"]` (e.g. `LibraryOsFolderView`, `FolderGridView`) |
+| 6 | List & details | `panel-with-toolbar` | `renderers["panel-with-toolbar"]` (Miller columns — see `library-table.tsx`) |
+| 7 | Tree & details | `tree-panel-with-toolbar` | `renderers["tree-panel-with-toolbar"]` (e.g. `HubTreePanelView`) |
+
+`HubTable` and `ListPageTemplate` default to **`FULL_HUB_SUPPORTED_VIEWS`** when `supportedViewTypes` is omitted.
+
+**`PRIMARY_HUB_SUPPORTED_VIEWS`** (table, list, board, dashboard only) is for hubs that **document** they intentionally omit folder/panel/tree — not the default for new work.
+
+## MUST (every new or touched hub)
+
+1. **Sync allowlists** — Pass the **same** `supportedViewTypes` to **`ListPageTemplate`** and **`HubTable`** (or only omit on both so the default applies).
+2. **Implement every allowed view** — Each entry in `supportedViewTypes` needs a renderer (explicit `renderers` map and/or `renderListRow` / `renderBoardCard` + `boardGroups`). Dev warns when a view is allowed but missing; users see **“does not implement X view”** if you ship the allowlist without bodies.
+3. **List rows use DS chrome** — **`ListPageBoardCard`** (Library list pattern). **MUST NOT** ship a bare two-line `renderListRow` (title + mono id only).
+4. **Library-shaped rows** — Hubs on **`LibraryItem`** with a custom table (e.g. Column types) **MUST** delegate non-table views to **`LibraryTable`** (`columnDefs` + `hubLabels` + `folders` state) — do not reimplement folder/panel/tree in isolation.
+5. **Token hubs** — Use **`FULL_HUB_SUPPORTED_VIEWS`** + **`components/tokens-hub-auxiliary-views.tsx`** (`renderTokenListRow`, `buildTokensHubRenderers`) — **MUST NOT** use `supportedViewTypes={["table"]}`.
+
+## MUST NOT
+
+- Pass **`PRIMARY_HUB_SUPPORTED_VIEWS`** or `["table", "list", "board", "dashboard"]` on a hub that should match Library Add view parity.
+- Pass **`supportedViewTypes={["table"]}`** on any primary hub or showcase inside **`ListPageTemplate`**.
+- Copy **`COLUMNS_SUPPORTED_VIEWS = PRIMARY_…`** without implementing folder/panel/tree.
+- Invent a new per-page allowlist constant without a matching renderer for every listed view.
+
+## Narrow exceptions (document in code comment)
+
+- Hubs that genuinely lack calendar/folder/panel/tree (e.g. legacy Placements-only four views) — export `ENTITY_SUPPORTED_VIEWS` in `lib/*-supported-views.ts` and **comment why** it is narrower than `FULL_HUB_SUPPORTED_VIEWS`.
+- Calendar is **not** in `FULL_HUB_SUPPORTED_VIEWS`; add only when the hub implements `calendar-with-toolbar`.
+
+## See also
+
+- **`.cursor/rules/exxat-data-tables.mdc`**, **`exxat-list-page-connected-views.mdc`**, **`exxat-list-page-view-shells.mdc`**
+- **`docs/exxat-ds/patterns/hub-supported-views-pattern.md`** (vendored from monorepo `apps/web/docs/`)
+- **`docs/exxat-ds/patterns/data-views-pattern.md`**

package/consumer-extras/cursor-rules/exxat-nav-single-active.mdc

@@ -0,0 +1,31 @@
+---
+description: Sidebar and secondary nav — exactly one active item per route (longest path match)
+globs: "**/app-sidebar.tsx,**/secondary-nav.tsx,**/navigation.tsx,**/lib/nav-active.ts"
+alwaysApply: false
+---
+
+# Exxat DS — single active nav item (MUST)
+
+Only **one** primary sidebar row, collapsible child, or secondary-panel link may show the active/selected state for the current route.
+
+## MUST
+
+1. **Use shared helpers** from `@exxatdesignux/ui/lib/nav-active` (or the app copy synced from the DS template):
+   - `collectNavUrls` + `buildNavHashClaims` for the full nav tree
+   - `isNavHrefActive(pathname, url, allNavUrls, { locationHash, hashClaimsByPath })` for sidebar `SidebarMenuButton` / `isActive`
+   - `resolveActiveNavHref(pathname, allLinkHrefs)` for secondary-panel links — compare the returned href to each link’s `href` (longest prefix wins)
+2. **Never** mark a nav item active with bare `pathname === href` or `pathname.startsWith(href + "/")` when other nav targets share that prefix (e.g. `/dashboard` vs `/dashboard/students`).
+3. **Hash disambiguation** — when multiple items share the same path (e.g. `/settings` vs `/settings#appearance`), use `buildNavHashClaims` so the no-fragment row defers to the hash-specific row.
+4. **Collapsible parents** — when any child is active, the **parent** row stays visually neutral in the expanded sidebar; only the child gets `data-active` (icon rail may still highlight the parent — see `isCollapsibleParentMenuButtonActive` in `app-sidebar.tsx`).
+5. **Keep `ListPageTemplate.supportedViewTypes` and `HubTable.supportedViewTypes` in sync** on the same hub — do not pass `supportedViewTypes={["table"]}` on a primary hub unless that hub truly implements only table.
+
+## MUST NOT
+
+- Duplicate bespoke `isNavActive` / `isActive` logic that ignores longest-prefix matching.
+- Ship a new nav surface (sidebar, secondary rail, hub scope list) without wiring the helpers above.
+
+## Reference
+
+- `packages/ui/src/lib/nav-active.ts`
+- `packages/ui/template/components/sidebar/app-sidebar.tsx`
+- `packages/ui/template/components/sidebar/secondary-nav.tsx`

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

@@ -251,15 +251,20 @@ For "System" variants, use the **`SplitSystemSvg`** helper. It renders `ChromeIl
 Any **primary nav destination** that shows a list of records **must** use this composition (same as Placements / Team):
 
 ```
-ListPageTemplate
+ListPageTemplate  (supportedViewTypes = FULL_HUB_SUPPORTED_VIEWS — seven views)
   ├── PageHeader (title, subtitle with count, primary CTA, ⋯ more menu)
   ├── KeyMetrics (flat variant, single row)
   └── renderContent()
-        └── DataTable + useTableState + TablePropertiesDrawer
+        └── HubTable + useTableState + TablePropertiesDrawer + renderers per view
 ```
 
+**Add view parity (binding):** `.cursor/rules/exxat-hub-supported-views.mdc`, `apps/web/docs/hub-supported-views-pattern.md`. **MUST NOT** use `supportedViewTypes={["table"]}` or four-view-only allowlists without a documented exception. List view **MUST** use **`ListPageBoardCard`** (`library-table.tsx`).
+
 **Reference implementations:**
-- `components/team-client.tsx` + `components/team-table.tsx` — canonical pattern
+- `components/library-client.tsx` + `components/library-table.tsx` — **canonical seven-view hub** (All questions)
+- `components/columns-showcase.tsx` — custom table via **`LibraryTable`** + same seven views
+- `components/tokens-themes-client.tsx` + `components/tokens-hub-auxiliary-views.tsx`
+- `components/team-client.tsx` + `components/team-table.tsx` — entity hub pattern
 - `components/placements-client.tsx` + `components/placements-table.tsx` — Placements (most complete)
 
 **Files to create for a new hub page `Foo`:**

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

@@ -1,16 +1,26 @@
 # Data Table Pattern — Full Implementation Guide
 
-Reference implementation: `components/team-table.tsx` (Team) and `components/placements-table.tsx` (Placements).
+**Primary hub stack:** `ListPageTemplate` → **`HubTable`** (not raw `DataTable` inside hubs).
+
+**Add view parity:** `FULL_HUB_SUPPORTED_VIEWS` on **`ListPageTemplate`** + **`HubTable`**; implement every allowed view — **`.cursor/rules/exxat-hub-supported-views.mdc`**, **`apps/web/docs/hub-supported-views-pattern.md`**.
+
+**Reference implementations:**
+- `components/library-table.tsx` + `library-client.tsx` — canonical seven-view hub
+- `components/columns-showcase.tsx` — `LibraryTable` + custom `columnDefs`
+- `components/tokens-themes-client.tsx` + `tokens-hub-auxiliary-views.tsx`
+- `components/team-table.tsx`, `components/placements-table.tsx` — entity hubs
 
 ---
 
 ## Stack Summary
 
 ```
-DataTable                         ← base table component
-  └── useTableState               ← manages sort/filter/column/group state
-  └── toolbarSlot                 ← renders the properties button + drawer
-        └── TablePropertiesDrawer ← columns, density, filters, sort, conditional rules
+HubTable (inside ListPageTemplate)  ← canonical hub wrapper
+  └── DataTable                     ← base table component
+  └── useTableState                 ← sort/filter/column/group state
+  └── toolbarSlot                   ← properties button + filter chips + search
+        └── TablePropertiesDrawer
+  └── renderListRow / renderers     ← list, board, dashboard, folder, panel, tree
 ```
 
 All imports:

package/consumer-extras/cursor-skills/exxat-token-economy/SKILL.md

@@ -38,7 +38,7 @@ Open **only** these files. Skip everything else unless one of these files cites
 
 | Task | Read (minimum) | Skip (do not open) |
 |------|----------------|--------------------|
-| **Build a new hub page** (table + KPIs + view tabs) | `apps/web/components/columns-showcase.tsx` (or any reference hub), `docs/exxat-ds/handbook/HANDBOOK.md` §"How to build a hub" | `AGENTS.md`, `hub-table.tsx` source, all `*-pattern.md` |
+| **Build a new hub page** (table + KPIs + view tabs) | `apps/web/components/library-table.tsx` + `library-client.tsx`, `exxat-hub-supported-views.mdc` (or `hub-supported-views-pattern.md`) | `AGENTS.md`, `hub-table.tsx` source, all `*-pattern.md` |
 | **Add a column / cell pattern** | `apps/web/components/columns-showcase.tsx` (the live catalog) | `data-table/index.tsx`, the whole `types.ts` |
 | **Add a board / kanban view** | `apps/web/components/placements-board-card.tsx`, `exxat-board-cards.mdc` only | All other rules |
 | **Add a KPI strip** | `docs/exxat-ds/handbook/reference-implementations.md` § KPI flat band, `exxat-kpi-max-four.mdc`, `exxat-kpi-trends.mdc` | `key-metrics.tsx` source |
@@ -63,8 +63,9 @@ Answer **yes / no / N/A** to each. A **no** means re-plan; you'll save a regener
 3. **Color + icon on every status chip?** — `ListHubStatusBadge` + a tint from `lib/list-status-badges.ts` + an FA icon. Color alone fails WCAG 1.4.1.
 4. **≤ 4 KPIs on the primary strip?** — `KEY_METRICS_KPI_COUNT_MAX = 4`. A fifth becomes a `MetricInsight` or a chart.
 5. **No toasts for product feedback?** — use `LocalBanner` / `SystemBanner` / inline status. Toasts are reserved for build-tool messages.
+6. **Seven views + real bodies?** — `FULL_HUB_SUPPORTED_VIEWS` on **`ListPageTemplate`** + **`HubTable`** (sync both); every allowed view has a renderer; list uses **`ListPageBoardCard`** — not `["table"]` / `PRIMARY_HUB_SUPPORTED_VIEWS` / empty `renderers={}`.
 
-If all five are **yes**, generate. If any is **no**, either narrow the requirements
+If all six are **yes**, generate. If any is **no**, either narrow the requirements
 with **one** clarifying question or fix the gap silently and note it in your response.
 
 ---
@@ -141,8 +142,11 @@ import { PageHeader } from "@/components/page-header"
 import { KeyMetrics, type MetricItem } from "@/components/key-metrics"
 import { ListPageTemplate, type ViewTab, HubTable } from "@/components/data-views"
 
+import { FULL_HUB_SUPPORTED_VIEWS } from "@/lib/data-list-view-registry"
+
 const ENTITY_TABS: ViewTab[] = [{ id: "all", label: "All", viewType: "table", icon: "fa-table", filterId: "all" }]
-const ENTITY_SUPPORTED_VIEWS = ["table", "list", "board"] as const
+/** Seven views (Library parity) unless product documents a narrower list in lib/entity-supported-views.ts */
+const ENTITY_SUPPORTED_VIEWS = FULL_HUB_SUPPORTED_VIEWS
 
 export function EntityClient({ rows }) {
   const [tabs, setTabs] = React.useState<ViewTab[]>(ENTITY_TABS)
@@ -163,7 +167,10 @@ export function EntityClient({ rows }) {
             hubLabel="Entity" lifecycleTabLabel="Entity"
             getRowId={r => r.id} getRowSelectionLabel={r => r.name}
             defaultSort={{ key: "name", dir: "asc" }}
-            renderers={{}}
+            renderListRow={row => /* ListPageBoardCard layout="row" — copy library-table.tsx */}
+            renderers={{
+              /* board-with-toolbar, dashboard-with-toolbar, folder/panel/tree — see library-table.tsx or tokens-hub-auxiliary-views.tsx */
+            }}
           />
         )}
       />

package/consumer-extras/handbook/HANDBOOK.md

@@ -33,7 +33,7 @@ This is the **happy path** for the most common task: "I have an entity (placemen
 | 5 | Compose the page client with `PrimaryPageTemplate` → `ListPageTemplate` (KPIs in `metrics`, view tabs in `defaultTabs`, the `HubTable` in `renderContent`). | `apps/web/components/<entity>-client.tsx` | `exxat-list-page-connected-views.mdc` |
 | 6 | Add to nav (`lib/mock/navigation.tsx`). If the hub needs scoped sub-navigation (e.g. categories), declare `secondaryPanel: "<id>"` and register the panel. | `apps/web/lib/mock/navigation.tsx`, `apps/web/components/sidebar/secondary-panel.tsx` | `exxat-primary-nav-secondary-panel.mdc` |
 
-**Reference page to copy:** `apps/web/components/sites-table.tsx` (the smallest complete hub) or `apps/web/components/columns-showcase.tsx` (single-view hub with a `HubTable`).
+**Reference pages to copy:** `apps/web/components/library-table.tsx` + `library-client.tsx` (seven-view hub), `columns-showcase.tsx` (`LibraryTable` + custom columns), `tokens-themes-client.tsx` + `tokens-hub-auxiliary-views.tsx`. See **`hub-supported-views-pattern.md`** (vendored under `docs/exxat-ds/patterns/`).
 
 > **Stop signs.** If you find yourself building a parallel table stack, a second metrics strip, a custom filter row, or pasting raw `<DataTable>` into `renderContent` — **stop and re-read** `.cursor/rules/exxat-reuse-before-custom.mdc`.
 

package/consumer-extras/handbook/reference-implementations.md

@@ -27,9 +27,9 @@ If you find yourself diverging from the reference page, ask **why** before shipp
 | Hub with finder / split-panel view | `apps/web/components/sites-table.tsx` + `sites-client.tsx` | [`list-page-template`](https://github.com/ExxatDesign/Exxat-DS-Workspace/blob/main/apps/web/docs/blueprints/list-page-template.md) | [`exxat-list-page-view-shells`](../../../.cursor/rules/exxat-list-page-view-shells.mdc) | [`data-views-pattern`](../data-views-pattern.md) |
 | Hub with secondary panel scope (folder rail) | `apps/web/components/library-table.tsx` + `library-client.tsx` | [`list-page-template`](https://github.com/ExxatDesign/Exxat-DS-Workspace/blob/main/apps/web/docs/blueprints/list-page-template.md) | [`exxat-primary-nav-secondary-panel`](../../../.cursor/rules/exxat-primary-nav-secondary-panel.mdc), [`exxat-library-hub-header`](../../../.cursor/rules/exxat-library-hub-header.mdc) | [`library-hub-header-pattern`](https://github.com/ExxatDesign/Exxat-DS-Workspace/blob/main/apps/web/docs/library-hub-header-pattern.md) |
 | Hub with secondary panel scope (token categories) — **smallest** secondary-panel reference | `apps/web/components/tokens-themes-client.tsx` + `tokens-secondary-nav.tsx` | [`list-page-template`](https://github.com/ExxatDesign/Exxat-DS-Workspace/blob/main/apps/web/docs/blueprints/list-page-template.md) | [`exxat-primary-nav-secondary-panel`](../../../.cursor/rules/exxat-primary-nav-secondary-panel.mdc) | [`shell-surface-elevation-pattern`](../shell-surface-elevation-pattern.md) |
-| Single-view showcase hub (table only) — **18 SaaS cell patterns**, each rendered by an **importable named cell** from `@/components/data-views` (see "Cell primitives" table below). Categories: select, primary identity + ID + favorite, avatar + name + email, avatar group +N, type pill, difficulty signal, status chip, inline toggle, tag list, rating stars, progress bar, currency, numeric, attachment count, external link, relative time, absolute date, row actions overflow. | `apps/web/components/columns-showcase.tsx` + `columns-client.tsx` | [`list-page-template`](https://github.com/ExxatDesign/Exxat-DS-Workspace/blob/main/apps/web/docs/blueprints/list-page-template.md), [`data-table`](https://github.com/ExxatDesign/Exxat-DS-Workspace/blob/main/apps/web/docs/blueprints/data-table.md) | [`exxat-data-tables`](../../../.cursor/rules/exxat-data-tables.mdc) | — |
+| Cell-pattern catalog — **18 SaaS cell patterns** via custom `columnDefs`; **seven views** via **`LibraryTable`** (same Add view as Library). | `apps/web/components/columns-showcase.tsx` + `columns-client.tsx` | [`list-page-template`](https://github.com/ExxatDesign/Exxat-DS-Workspace/blob/main/apps/web/docs/blueprints/list-page-template.md), [`data-table`](https://github.com/ExxatDesign/Exxat-DS-Workspace/blob/main/apps/web/docs/blueprints/data-table.md), [`hub-supported-views-pattern`](https://github.com/ExxatDesign/Exxat-DS-Workspace/blob/main/apps/web/docs/hub-supported-views-pattern.md) | [`exxat-data-tables`](../../../.cursor/rules/exxat-data-tables.mdc), [`exxat-hub-supported-views`](../../../.cursor/rules/exxat-hub-supported-views.mdc) | — |
 
-> **First-time hub builder:** start with `sites-table.tsx` (smallest complete hub) or `columns-showcase.tsx` (single-view, easiest).
+> **First-time hub builder:** copy **`library-table.tsx`** + **`library-client.tsx`**; use **`columns-showcase.tsx`** for custom columns; **`tokens-themes-client.tsx`** + **`tokens-hub-auxiliary-views.tsx`** for tokens. Read **`hub-supported-views-pattern.md`** before changing Add view.
 
 ---
 

package/consumer-extras/patterns/data-views-pattern.md

@@ -6,6 +6,12 @@
 
 This document describes how list pages combine **views**, **toolbar** behavior, **filters**, **properties**, and **persistence** in this codebase.
 
+## Add view parity (seven views)
+
+**Binding:** `.cursor/rules/exxat-hub-supported-views.mdc`. **Detail:** `docs/hub-supported-views-pattern.md`.
+
+Every list hub **should** use **`FULL_HUB_SUPPORTED_VIEWS`** (table, list, board, dashboard, folder, panel, tree-panel) on both **`ListPageTemplate`** and **`HubTable`**, with a working renderer per view. **Library** (`library-table.tsx`) is the reference. Do not ship table-only or four-view allowlists on showcase/catalog hubs unless product documents an exception.
+
 ## Reuse existing components (required)
 
 **Prefer composing what already exists** over rebuilding one-off tabs, search, filters, or property panels. The **Placements** flow is the reference implementation; new list/table/board pages should wire the same building blocks with new data and column definitions.

package/consumer-extras/patterns/hub-supported-views-pattern.md

@@ -0,0 +1,53 @@
+# Hub supported views pattern (Add view parity)
+
+> **Agents:** `.cursor/rules/exxat-hub-supported-views.mdc` (binding). **Reference hub:** Library / All questions (`library-table.tsx`, `library-client.tsx`).
+
+## Problem this solves
+
+`ListPageTemplate` filters **Add view** and Properties view tiles from `supportedViewTypes`. If Column types passes four views but Library passes seven, users see inconsistent menus. If a hub allows Board but has no `board-with-toolbar` renderer, users see **“does not implement Board view”**.
+
+## Canonical allowlist
+
+Import from the registry (single source of truth):
+
+```ts
+import { FULL_HUB_SUPPORTED_VIEWS } from "@/lib/data-list-view-registry"
+// or
+import { LIBRARY_SUPPORTED_VIEWS } from "@/lib/library-supported-views" // alias of FULL
+```
+
+Seven views: **table**, **list**, **board**, **dashboard**, **folder**, **panel**, **tree-panel**.
+
+`HubTable` and `ListPageTemplate` use this list when `supportedViewTypes` is omitted.
+
+`PRIMARY_HUB_SUPPORTED_VIEWS` (four views) remains for hubs that intentionally omit folder/panel/tree — document that in `lib/<entity>-supported-views.ts`.
+
+## Wiring checklist
+
+1. **`ListPageTemplate`** — `supportedViewTypes={FULL_HUB_SUPPORTED_VIEWS}` (or entity alias).
+2. **`HubTable`** — same allowlist (or omit on both).
+3. **List** — `renderListRow` returning **`ListPageBoardCard`** `layout="row"` (copy from `library-table.tsx`).
+4. **Board** — `renderBoardCard` + `boardGroups` and/or `renderers["board-with-toolbar"]`.
+5. **Dashboard** — `renderers["dashboard-with-toolbar"]` with **`KeyMetrics`** on filtered rows.
+6. **Folder / panel / tree** — explicit `renderers` entries (Library reference) or **`LibraryTable`** for `LibraryItem` rows.
+
+## Special cases in this app
+
+| Hub | Pattern |
+|-----|---------|
+| **Library / All questions** | `LibraryTable` + `LIBRARY_SUPPORTED_VIEWS` — reference |
+| **Column types** | `LibraryTable` with `columnDefs` + `hubLabels` + `DEFAULT_LIBRARY_FOLDERS` — custom table, shared other views |
+| **Tokens & themes** | `FULL_HUB_SUPPORTED_VIEWS` + `tokens-hub-auxiliary-views.tsx` |
+| **New entity hub** | Start from `library-table.tsx` or token/columns references; never table-only unless approved |
+
+## Anti-patterns
+
+- `supportedViewTypes={["table"]}` on a `ListPageTemplate` hub.
+- `COLUMNS_SUPPORTED_VIEWS = PRIMARY_HUB_SUPPORTED_VIEWS` without board/folder/panel/tree renderers.
+- Minimal `renderListRow` with only stem + `questionId` (not product list UI).
+
+## See also
+
+- `packages/ui/src/lib/data-list-view-registry.ts`
+- `docs/exxat-ds/patterns/data-views-pattern.md`
+- `apps/web/lib/hub-connected-view-renderers.ts` — `defineHubViewRenderers` dev warnings

package/dist/components/data-table/index.js

@@ -2256,13 +2256,15 @@ function useBulkBarFixedToTableScrollEl(scrollRef, active, fullWidth) {
     const scheduled = rafThrottle(apply);
     const ro = new ResizeObserver(scheduled);
     ro.observe(el);
+    el.addEventListener("scroll", scheduled, { passive: true });
     window.addEventListener("resize", scheduled, { passive: true });
-    window.addEventListener("scroll", scheduled, { passive: true, capture: true });
+    window.addEventListener("scroll", scheduled, { passive: true });
     return () => {
       scheduled.cancel();
       ro.disconnect();
+      el.removeEventListener("scroll", scheduled);
       window.removeEventListener("resize", scheduled);
-      window.removeEventListener("scroll", scheduled, { capture: true });
+      window.removeEventListener("scroll", scheduled);
     };
   }, [active, fullWidth, scrollRef]);
   return style;
@@ -2429,11 +2431,13 @@ function DataTableInner({
     };
     update();
     const scheduled = rafThrottle(update);
-    window.addEventListener("scroll", scheduled, { passive: true, capture: true });
+    wrapEl.addEventListener("scroll", scheduled, { passive: true });
+    window.addEventListener("scroll", scheduled, { passive: true });
     window.addEventListener("resize", scheduled, { passive: true });
     return () => {
       scheduled.cancel();
-      window.removeEventListener("scroll", scheduled, { capture: true });
+      wrapEl.removeEventListener("scroll", scheduled);
+      window.removeEventListener("scroll", scheduled);
       window.removeEventListener("resize", scheduled);
     };
   }, [showColumnHeaders, rows.length, displayCols.length]);
@@ -2870,11 +2874,11 @@ function DataTableInner({
                           const rowPy = rowHeight === "compact" ? "py-1" : rowHeight === "comfortable" ? "py-4" : "py-2.5";
                           const cs = cellStyle(col.key);
                           const tdBase = cn(
-                            `px-3 ${rowPy} align-middle`,
+                            `px-3 ${rowPy} align-middle max-w-0`,
                             showGridlines && !isEdgePin && "border-e border-border last:border-e-0",
                             "border-b border-border group-last/row:border-b-0",
                             isPinned && [
-                              "z-20 pinned-cell",
+                              "z-20 pinned-cell relative",
                               "bg-dt-row-bg",
                               "group-data-[state=selected]/row:bg-dt-row-selected",
                               "group-hover/row:bg-dt-row-hover",
@@ -2924,17 +2928,17 @@ function DataTableInner({
                                   wrap && "[&_.truncate]:!whitespace-normal [&_.truncate]:!overflow-visible [&_.truncate]:!text-clip"
                                 ),
                                 style: tdStyle,
-                                children: col.cell(row, {
+                                children: /* @__PURE__ */ jsx("div", { className: "min-w-0 overflow-hidden", children: col.cell(row, {
                                   rowIndex,
                                   selected: isSelected,
                                   onSelect: (checked) => checked ? setSelected((prev) => /* @__PURE__ */ new Set([...prev, rowId])) : toggleRow(rowId)
-                                })
+                                }) })
                               },
                               col.key
                             );
                           }
                           const rawVal = String(row[col.key] ?? "");
-                          return /* @__PURE__ */ jsx("td", { className: cn(tdBase, "text-sm text-foreground/80"), style: tdStyle, children: /* @__PURE__ */ jsx("span", { className: wrap ? "whitespace-normal" : "block truncate", title: !wrap ? rawVal : void 0, children: rawVal }) }, col.key);
+                          return /* @__PURE__ */ jsx("td", { className: cn(tdBase, "text-sm text-foreground/80"), style: tdStyle, children: /* @__PURE__ */ jsx("div", { className: "min-w-0 overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: wrap ? "whitespace-normal" : "block truncate", title: !wrap ? rawVal : void 0, children: rawVal }) }) }, col.key);
                         })
                       },
                       String(rowId)