@godxjp/ui 20.2.1 → 22.0.0

package/docs/roadmap/tree-components.md

@@ -0,0 +1,151 @@
+# Tree components — audit + normalized spec
+
+> **Status:** audit complete 2026-09-10. `Tree` is NOT implemented. Read this before touching
+> anything under `src/components/**/tree-*`.
+> **Contract:** `.claude/skills/godxjp-ui-component/SKILL.md` is the hard gate. This document only
+> normalizes *what* to build; the skill owns *how*.
+
+## 1. What exists today (measured, not eyeballed)
+
+| Thing | File | What it actually is |
+| --- | --- | --- |
+| `TreeSelect` | `src/components/data-entry/tree-select.tsx` (499 L) | A real tree, but only **inside a dropdown**. Ant-aligned API. |
+| `TreeList` | `src/components/data-display/tree-list.tsx` (41 L) | **Not a tree.** A flat `<ul>` where `depth` is a number that only drives `margin-inline-start`. |
+| `tree-utils` | `src/components/data-entry/tree-utils.ts` (216 L) | Normalize / flatten / filter / descendants. Sound, reusable. Currently private to `data-entry`. |
+| `Tree` | — | **Does not exist.** |
+
+### 1a. `TreeSelect` is fine — leave it alone
+
+It is genuinely modeled on Ant Design: `treeData`, `fieldNames`, `treeCheckable`, `treeCheckStrictly`,
+`showCheckedStrategy` (`SHOW_PARENT` / `SHOW_CHILD` / `SHOW_ALL`), `loadData`, `treeTitleRender`,
+`maxTagCount`, `notFoundContent`. Markup carries `role="tree"` / `role="treeitem"` with
+`aria-expanded` / `aria-selected` / `aria-multiselectable`. It is not the problem.
+
+### 1b. `TreeList` is the problem — it promises a tree and delivers indentation
+
+Verified against the source, the CSS (`src/styles/data-display-layout.css:282-334`) and its tests:
+
+| Gap | Evidence |
+| --- | --- |
+| No nested data model | `items: TreeListItem[]` only — the caller must pre-flatten; there is no `children`. |
+| No expand / collapse | No disclosure control anywhere in the component. NameThatUI calls this the **disclosure triangle**; an indented tree that expands is an **Outline View**. `TreeList` has neither. |
+| No ARIA tree semantics | Only `aria-current`. No `role="tree"` / `role="treeitem"` / `aria-expanded` / `aria-level` / `aria-setsize` / `aria-posinset` / `aria-selected`. **Violates the mandatory WAI-ARIA APG gate.** |
+| No keyboard | No arrows, Home/End, `*`, type-ahead. Rows are not focusable at all. |
+| No selection contract | No `value` / `defaultValue` / `onValueChange`. **Violates the controlled-vocabulary rule (§2d).** |
+| No `size`, no `ref`, no `className`/`...props` | Props are literally `{ items }`. **Violates §2d.** |
+| Depth is uncapped but unstyled past 2 | Its own docs page says "Indentation is defined for depth 0-2, so flatten deeper branches". `tree-list-depth.test.tsx` asserts depth `5` sets the CSS var — which then renders at an indent nobody designed. |
+| Missing every Ant affordance | no icons, no `showLine`, no drag & drop, no virtual scroll, no async `loadData`, no search/filter highlight, no `blockNode`, no DirectoryTree. |
+
+**Conclusion:** the "tree components don't look like Ant Design" complaint is correct, and it is
+localized: `TreeSelect` is fine, `TreeList` is a cosmetic indented list, and the standalone `Tree`
+that every Ant-shaped app reaches for was never built.
+
+## 2. GATE 0 ledger — `Tree` (required before any `src/components/**` addition)
+
+| # | Criterion | Verdict | Why |
+| --- | --- | --- | --- |
+| C1 | Universal, not design-specific | **PASS** | File explorers, org charts, category pickers, permission trees, nav outlines. |
+| C2 | Encapsulates reusable behavior | **PASS** | Roving tabindex, arrow/Home/End/`*` navigation, type-ahead, expand state, tri-state check propagation, async load. |
+| C3 | Not composable from existing primitives | **PASS** | `Accordion` is single-level disclosure; `Timeline`/`NavList`/`ListRow` are flat. No primitive owns tree keyboard navigation on a page. |
+| C4 | Single responsibility + controlled-vocabulary API | **PASS** | One job (render + navigate a hierarchy); maps cleanly onto the triads in §3. |
+| C5 | Fully token-themeable | **PASS** | Indent, rail, glyph, row height all become `--tree-*` component tokens. |
+| C6 | Earns the international contract | **PASS** | Needs correct APG semantics and RTL indentation; used everywhere. |
+| C7 | Earns its bundle cost | **PASS** | Broad; also lets `TreeSelect` and `Tree` share one node renderer. |
+
+**ALL PASS → `Tree` is a framework component.**
+
+## 3. Normalized API — Ant Design name → godx controlled vocabulary
+
+`Tree` mirrors Ant Design's *capabilities*, never its *prop names* where they conflict with
+`docs/PROPS-VOCABULARY.md`. This mapping is the contract; do not invent a third spelling.
+
+| Capability | Ant Design | **godx `Tree`** |
+| --- | --- | --- |
+| Data | `treeData` | `treeData: TreeOptionProp[]` (reuse the existing `TreeOptionProp` + `TreeFieldNamesProp`) |
+| Field remap | `fieldNames` | `fieldNames` (unchanged — already in the registry) |
+| Selection | `selectedKeys` / `defaultSelectedKeys` / `onSelect` | `value` / `defaultValue` / `onValueChange` |
+| Multi-select | `multiple` | `multiple` |
+| Checkboxes | `checkedKeys` / `onCheck` | `checkedValues` / `defaultCheckedValues` / `onCheckedValuesChange` |
+| Checkbox mode | `checkable` | `checkable` |
+| Independent checks | `checkStrictly` | `checkStrictly` |
+| Expansion | `expandedKeys` / `onExpand` | `expandedValues` / `defaultExpandedValues` / `onExpandedValuesChange` |
+| Expand all | `defaultExpandAll` | `defaultExpandAll` |
+| Async children | `loadData` | `loadData` (same signature as `TreeSelect`'s) |
+| Node label render | `titleRender` | `titleRender` |
+| Connector lines | `showLine` | `showLine` |
+| Node icons | `showIcon` / `icon` | `showIcon`, per-node `icon` |
+| Full-width row | `blockNode` | *dropped* — always full-width row; that is the only correct hit area under WCAG 2.5.8 |
+| Disclosure glyph | `switcherIcon` | *dropped* — the glyph is a token (`--tree-switcher-*`), not a prop |
+| Density | — | `size: xs \| sm \| lg` (`md` is the default, never `"default"`) |
+| Directory variant | `<DirectoryTree>` | `variant="directory"` |
+| Drag & drop | `draggable` | **out of scope for v1** — file a follow-up issue |
+| Virtual scroll | `virtual` / `height` | **out of scope for v1** — cap with `ScrollArea`; file a follow-up issue |
+
+Plus the house rules: forward `ref`, spread `...props`, accept `className` + `id`, export
+`TreeProp` and `TreeProp as TreeProps` from `src/props/components/data-display.prop.ts`, and
+**register it in `src/props/registry.ts`**.
+
+## 4. Required semantics (WAI-ARIA APG "Tree View")
+
+- Container `role="tree"`, `aria-multiselectable` when `multiple` or `checkable`.
+- Each node `role="treeitem"` with `aria-level` (1-based), `aria-setsize`, `aria-posinset`,
+  `aria-selected`, and `aria-expanded` **only on nodes that have children**.
+- Grouping wrapper `role="group"`.
+- **Roving tabindex** — exactly one node has `tabIndex={0}`; all others `-1`.
+- Keyboard: `↓`/`↑` next/previous *visible* node · `→` expand, then move to first child ·
+  `←` collapse, then move to parent · `Home`/`End` first/last visible · `Enter`/`Space` select
+  (or toggle the checkbox when `checkable`) · `*` expand all siblings at the current level ·
+  type-ahead jumps to the next node whose label starts with the typed characters.
+- Under `dir="rtl"`, `→`/`←` swap meaning and indentation flips — logical CSS only
+  (`margin-inline-start`, `padding-inline-start`), never `ml-`/`pl-`/`left-`.
+- Tri-state parent checkbox: checked / unchecked / **indeterminate** when only some descendants
+  are checked (skip propagation entirely when `checkStrictly`).
+- Ships `tree.a11y.test.tsx` with `expectNoA11yViolations` — 0 violations.
+
+## 5. Tokens (tier: `src/tokens/components/tree.css`, `@import`ed from `src/tokens/base.css`)
+
+Names must pass `pnpm check:token-tiers` (`--{component}-{part}-{property}`):
+`--tree-node-height` (from the `--control-height` tier — never a literal), `--tree-indent-width`,
+`--tree-switcher-size`, `--tree-switcher-color`, `--tree-line-color`, `--tree-node-selected-background`,
+`--tree-node-hover-background`, `--tree-icon-size`. Row hit area ≥ 24×24px (WCAG 2.5.8).
+
+## 6. i18n keys (`src/i18n/messages/{en,vi,ja}.json`)
+
+`tree.expand`, `tree.collapse`, `tree.loading`, `tree.empty`, `tree.selected` (sr-only status —
+selection must never be colour-only, WCAG 1.4.1). Every `aria-label` goes through `t()`.
+
+## 7. `TreeList` — what happened to it
+
+**Superseded here, then REMOVED in 21.0.0.** The plan above ("stays exported, it has consumers")
+was written while it still had them. It stopped: the last two call sites in `godx-task`
+(`pages/tests/show.tsx`, `pages/documents/index.tsx`) moved to `Tree`, and a sweep of all four
+consumer repos (godx-task, godx-chat, ql, platform) found none left. A superseded export that
+nobody calls is not a compatibility surface, it is a second answer to a question that already has
+one — and the catalog blurb it shipped with promised a "chevron + package icon" the component
+never rendered.
+
+So it is gone, with no deprecated shim: component, types, barrel entries, tests, frame, catalog
+entry, `--tree-item-*` tokens and `.ui-tree-item` CSS. `Tree` is the replacement, and the Tree
+catalog entry carries the migration (`id`->`value`, `title`->`label`, `depth`->nesting).
+`check-mcp-pattern-imports.mjs` now denylists an import of, or JSX for, the removed export, the
+same way it denylists `Stack`/`Inline`.
+
+## 8. Shared code
+
+Move `src/components/data-entry/tree-utils.ts` to a location both groups can import
+(`src/lib/tree.ts`), re-export from the old path so `TreeSelect` keeps working, and have `Tree`
+consume the same `normalizeTreeOptions` / `flattenVisibleTree` / `getDescendantValues`.
+**One tree model, two surfaces** — do not fork the traversal logic.
+
+## 9. Definition of done
+
+Cheap gates, then this component's tests only:
+
+```
+pnpm typecheck && pnpm lint && pnpm run audit \
+  && pnpm check:prop-vocabulary && pnpm check:mcp-sync && pnpm check:mcp-orphans \
+  && pnpm check:token-tiers && pnpm check:control-sizing && pnpm check:example-imports
+pnpm vitest run src/components/data-display/__tests__ --maxWorkers=2
+```
+
+`pnpm test` / bare `pnpm vitest run` are **forbidden** — the full suite is CI's job.

package/docs/showcase/acme-portal.tsx

@@ -112,6 +112,13 @@ const THEME = `
   --warning: 41 73% 53%;  --warning-foreground: 217 61% 12%;  /* = brand gold */
   --destructive: 12 83% 44%; --destructive-foreground: 0 0% 100%;
   --info: 217 69% 47%; --info-foreground: 0 0% 100%;
+  /* A TRACK IS A QUIET SURFACE, AND THIS THEME REPOINTED --secondary AT AN ACTION COLOUR.
+     Progress reads --progress-track-background, which defaults to hsl(var(--secondary)) — a pale
+     neutral in the stock palette. Here --secondary is the navy BUTTON, so the bar's track came out
+     near-black and the fill (a MARK: nothing is written on it, so SC 1.4.11 asks 3:1 against the
+     track) measured 2.50:1 success / 2.90:1 warning on it. Naming the track is the fix; the fills
+     then sit on --muted like everywhere else. Any theme that repurposes --secondary owes this line. */
+  --progress-track-background: hsl(var(--muted));
   /* Shape - base radius + exact ACME steps; re-declare the intermediates so the scope re-resolves */
   --radius: 0.875rem;                /* 14px card */
   --radius-xs: 4px; --radius-sm: 6px; --radius-md: 10px;

package/docs/showcase/table-tree-rows.tsx

@@ -3,10 +3,10 @@
  *
  * Tree / hierarchical rows inside the real @godxjp/ui DataTable.
  *
- * The lib's `TreeList` is a flat presentational list (fixed icons, no twirl, no
- * tabular columns) — it cannot express a *tabular* hierarchy with per-row metrics,
- * a parent-only disclosure twirl, and DataTable chrome (sticky header, density,
- * sortable columns). So this composes the behaviour from real primitives:
+ * The lib's `Tree` owns the standalone tree view, but it is single-column — it
+ * cannot express a *tabular* hierarchy with per-row metrics, a parent-only
+ * disclosure twirl, and DataTable chrome (sticky header, density, sortable
+ * columns). So this composes the behaviour from real primitives:
  *
  *   row model ........ flatten an org tree to rows carrying { depth, hasChildren,
  *                      expanded }, then derive `visibleRows` from the open set.

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@godxjp/ui",
-  "version": "20.2.1",
-  "godxUiMcp": "20.2.1",
+  "version": "22.0.0",
+  "godxUiMcp": "22.0.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -213,10 +213,6 @@
       "types": "./dist/components/data-entry/date-picker.d.ts",
       "import": "./dist/components/data-entry/date-picker.js"
     },
-    "./ui/date-range-picker": {
-      "types": "./dist/components/data-entry/date-range-picker.d.ts",
-      "import": "./dist/components/data-entry/date-range-picker.js"
-    },
     "./ui/time-picker": {
       "types": "./dist/components/data-entry/time-picker.d.ts",
       "import": "./dist/components/data-entry/time-picker.js"
@@ -350,14 +346,17 @@
     "check:layout-nav-closure": "for frames in layout-flex,layout-app-shell,layout-aspect-ratio,layout-auth-shell layout-page-container,layout-resizable-panel,layout-separator,layout-sidebar layout-split-pane,layout-topbar,navigation-breadcrumb,navigation-app-setting-picker navigation-context-menu,navigation-dropdown-menu,navigation-menubar,navigation-navigation-menu navigation-steps,navigation-toolbar,navigation-tabs,navigation-pagination; do FRAMES=$frames node scripts/check-layout-nav-closure.mjs || exit 1; done",
     "check:display-runtime-evidence": "node scripts/check-display-runtime-evidence.mjs",
     "check:data-table-pagination-wrap": "node scripts/check-data-table-pagination-wrap.mjs",
+    "check:tabs-overflow-menu": "node scripts/check-tabs-overflow-menu.mjs",
     "check:button-icon-xs": "node scripts/check-button-icon-xs.mjs",
+    "check:timeline-title-fill": "node scripts/check-timeline-title-fill.mjs",
+    "check:descriptions-label-value-step": "node scripts/check-descriptions-label-value-step.mjs",
     "check:frame-contracts": "pnpm check:component-api-manifest && pnpm audit:component-cases && pnpm check:frame-coverage && pnpm check:frame-coverage-ledger && pnpm check:screen-reader-evidence && pnpm check:data-entry-owner-source && pnpm check:display-runtime-evidence",
     "check:final-touch-rtl": "node scripts/check-final-touch-rtl.mjs",
-    "check:frame-runtime": "pnpm check:data-entry-frame-runtime && pnpm check:data-entry-touch-aria && pnpm check:layout-nav-frames && pnpm check:provider-feedback-query-runtime && pnpm check:layout-nav-closure && pnpm check:final-touch-rtl && pnpm check:data-table-pagination-wrap && pnpm check:button-icon-xs",
-    "verify": "pnpm typecheck && pnpm lint && pnpm format && pnpm build && pnpm preview:build && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:no-external-assets && pnpm check:token-scale-bypass && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:frame-coverage && pnpm test",
-    "verify:static": "pnpm build && pnpm check:packed-public-contract && pnpm typecheck && pnpm typecheck:docs && pnpm lint && pnpm preview:build && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:use-client && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:token-scale-bypass && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:mcp-prop-sync && pnpm check:contrast && pnpm check:visual-audit && pnpm test",
+    "check:frame-runtime": "pnpm check:data-entry-frame-runtime && pnpm check:data-entry-touch-aria && pnpm check:layout-nav-frames && pnpm check:provider-feedback-query-runtime && pnpm check:layout-nav-closure && pnpm check:final-touch-rtl && pnpm check:data-table-pagination-wrap && pnpm check:tabs-overflow-menu && pnpm check:button-icon-xs && pnpm check:timeline-title-fill && pnpm check:descriptions-label-value-step",
+    "verify": "pnpm typecheck && pnpm lint && pnpm format && pnpm build && pnpm preview:build && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:no-external-assets && pnpm check:token-scale-bypass && pnpm check:radix-surface && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:disclosure-duplication && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:frame-coverage && pnpm test",
+    "verify:static": "pnpm build && pnpm check:packed-public-contract && pnpm typecheck && pnpm typecheck:docs && pnpm lint && pnpm preview:build && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:use-client && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:token-scale-bypass && pnpm check:radix-surface && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:disclosure-duplication && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:mcp-prop-sync && pnpm check:contrast && pnpm check:visual-audit && pnpm test",
     "verify:ci": "pnpm verify:ci:static && pnpm check:frame-contracts && pnpm test",
-    "verify:ci:static": "pnpm build && pnpm check:packed-public-contract && pnpm typecheck && pnpm typecheck:docs && pnpm lint && pnpm preview:build && pnpm check:registry && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:use-client && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:no-external-assets && pnpm check:token-scale-bypass && pnpm check:no-antd-runtime && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:gate-coverage && pnpm check:mcp-prop-sync && pnpm check:catalog-contradictions",
+    "verify:ci:static": "pnpm build && pnpm check:packed-public-contract && pnpm typecheck && pnpm typecheck:docs && pnpm lint && pnpm preview:build && pnpm check:registry && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:use-client && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:no-external-assets && pnpm check:token-scale-bypass && pnpm check:no-antd-runtime && pnpm check:radix-surface && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:disclosure-duplication && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:gate-coverage && pnpm check:mcp-prop-sync && pnpm check:catalog-contradictions && pnpm check:catalog-snippets",
     "verify:browser": "pnpm check:contrast && pnpm check:text-ink-clip && pnpm check:visual-audit",
     "verify:release": "pnpm verify:static && pnpm check:frame-contracts && pnpm check:frame-coverage && pnpm check:frame-axe",
     "verify:publish-tree": "pnpm build && pnpm check:packed-public-contract && pnpm check:use-client && pnpm check:dist-tokens-resolve",
@@ -381,6 +380,7 @@
     "check:no-hardcoded-geometry": "node scripts/check-no-hardcoded-geometry.mjs",
     "check:no-external-assets": "node scripts/check-no-external-assets.mjs",
     "check:no-hardcoded-css-values": "node scripts/check-no-hardcoded-css-values.mjs",
+    "check:disclosure-duplication": "node scripts/check-disclosure-duplication.mjs",
     "check:no-inline-magic-numbers": "node scripts/check-no-inline-magic-numbers.mjs",
     "check:no-tailwind-class-assertions": "node scripts/check-no-tailwind-class-assertions.mjs",
     "check:control-sizing": "node scripts/check-control-sizing.mjs",
@@ -388,6 +388,7 @@
     "check:typography": "node scripts/check-typography.mjs",
     "gen:component-tokens": "node scripts/gen-component-tokens.mjs",
     "check:no-antd-runtime": "node scripts/check-no-antd-runtime.mjs",
+    "check:radix-surface": "node scripts/check-radix-surface.mjs",
     "gen:email-tokens": "node scripts/gen-email-tokens.mjs",
     "check:core-isolation": "node scripts/check-core-isolation.mjs",
     "check:no-consumer-coupling": "node scripts/check-no-consumer-coupling.mjs",
@@ -412,7 +413,8 @@
     "check:frame-geometry": "node scripts/frame-geometry.mjs",
     "postinstall": "node scripts/postinstall.mjs",
     "init-agent": "node scripts/init-agent-kit.mjs",
-    "check:use-client": "node scripts/check-use-client.mjs"
+    "check:use-client": "node scripts/check-use-client.mjs",
+    "check:catalog-snippets": "node scripts/audit-catalog-snippets.mjs"
   },
   "peerDependencies": {
     "@axe-core/playwright": "*",
@@ -447,31 +449,19 @@
     "@fontsource/m-plus-2": "^5.3.0",
     "@fontsource/noto-sans-jp": "^5.3.0",
     "@radix-ui/react-accordion": "^1.2.20",
-    "@radix-ui/react-alert-dialog": "^1.1.23",
-    "@radix-ui/react-aspect-ratio": "^1.1.15",
     "@radix-ui/react-avatar": "^1.2.6",
-    "@radix-ui/react-checkbox": "^1.3.11",
     "@radix-ui/react-collapsible": "^1.1.20",
-    "@radix-ui/react-context": "^1.2.2",
     "@radix-ui/react-context-menu": "^2.3.7",
-    "@radix-ui/react-dialog": "^1.1.23",
-    "@radix-ui/react-dropdown-menu": "^2.1.24",
-    "@radix-ui/react-hover-card": "^1.1.23",
     "@radix-ui/react-label": "^2.1.15",
     "@radix-ui/react-menubar": "^1.1.24",
     "@radix-ui/react-navigation-menu": "^1.2.22",
-    "@radix-ui/react-popover": "^1.1.23",
-    "@radix-ui/react-radio-group": "^1.4.7",
     "@radix-ui/react-scroll-area": "^1.2.18",
     "@radix-ui/react-select": "^2.3.7",
     "@radix-ui/react-separator": "^1.1.15",
     "@radix-ui/react-slider": "^1.4.7",
     "@radix-ui/react-slot": "^1.3.3",
-    "@radix-ui/react-switch": "^1.3.7",
-    "@radix-ui/react-tabs": "^1.1.21",
     "@radix-ui/react-toggle": "^1.1.18",
     "@radix-ui/react-toggle-group": "^1.1.19",
-    "@radix-ui/react-tooltip": "^1.2.16",
     "@react-aria/utils": "^3.34.1",
     "@tanstack/react-table": "^9.2.4",
     "class-variance-authority": "^0.7.1",

package/scripts/ui-audit.mjs

@@ -33,7 +33,20 @@ const PALETTE =
  * Emoji in product text — Unicode "Extended_Pictographic" set (UTS #51). Catches
  * ✅🎉🔥🚀 etc. but NOT typographic punctuation (· — × ✓), which have their own rules.
  */
-const EMOJI = /\p{Extended_Pictographic}/u;
+/*
+ * EMOJI — pictographs, but NOT the three typographic marks that happen to carry the property.
+ *
+ * `\p{Extended_Pictographic}` includes U+00A9 ©, U+00AE ® and U+2122 ™. All three are
+ * `Emoji_Presentation=No`: they default to TEXT presentation, they have been in typography since
+ * long before emoji existed, and none of the reasons in this rule's message applies to them — a
+ * copyright line does not "break on Win/Linux" and does not pollute an accessible name. The
+ * catalog's own CenteredShell recipe was flagged for the `©` in its footer, which is unavoidable
+ * product copy, and every consumer with a footer would be flagged for the same thing.
+ *
+ * Followed by U+FE0F they are asking for emoji presentation on purpose, and then they ARE emoji —
+ * so that spelling is still caught.
+ */
+const EMOJI = /[\u00A9\u00AE\u2122]\uFE0F|(?![\u00A9\u00AE\u2122])\p{Extended_Pictographic}/u;
 /** Regional-indicator pairs = emoji flags (🇯🇵) — broken on Win/Linux; use Intl.DisplayNames. */
 const EMOJI_FLAG = /\p{Regional_Indicator}/u;
 
@@ -169,7 +182,7 @@ const RULES = [
     spansElement: true,
     test: new RegExp(
       "<(?:Checkbox\\.Group|Upload|Cascader|TreeSelect|Transfer|Select|SearchSelect|DatePicker|" +
-        `DateRangePicker|TimePicker|ColorPicker|LocalePicker|TimezonePicker|DateFormatPicker|TimeFormatPicker)\\b${ATTRS}\\bonChange=`,
+        `TimePicker|ColorPicker|LocalePicker|TimezonePicker|DateFormatPicker|TimeFormatPicker)\\b${ATTRS}\\bonChange=`,
       "g",
     ),
     message:
@@ -729,8 +742,8 @@ const CARD_FLUSH = new RegExp(
 // legitimately, so they are NOT matched. Whole-file pass (the pair spans lines).
 const BARE_FIELD = new RegExp(
   `<(?:label|Label)\\b${ATTRS}>[\\s\\S]{0,240}?</(?:label|Label)>\\s*` +
-    "<(?:Input|Select|Textarea|NumberInput|SearchInput|SearchSelect|DatePicker|DateRangePicker|" +
-    "TimePicker|MonthPicker|MonthRangePicker|Cascader|TreeSelect|input)\\b",
+    "<(?:Input|Select|Textarea|NumberInput|SearchInput|SearchSelect|DatePicker|" +
+    "TimePicker|Cascader|TreeSelect|input)\\b",
   "g",
 );
 

package/dist/components/data-display/tree-list.d.ts

@@ -1,13 +0,0 @@
-import type { ReactNode } from "react";
-export type TreeListItem = {
-    id: string;
-    title: ReactNode;
-    description?: ReactNode;
-    depth?: number;
-    active?: boolean;
-    badge?: ReactNode;
-};
-export type TreeListProps = {
-    items: TreeListItem[];
-};
-export declare function TreeList({ items }: TreeListProps): import("react").JSX.Element;

package/dist/components/data-display/tree-list.js

@@ -1,26 +0,0 @@
-"use client";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Badge } from "./badge.js";
-function TreeList({ items }) {
-  return /* @__PURE__ */ jsx("ul", { className: "ui-tree-list", children: items.map((item) => /* @__PURE__ */ jsxs(
-    "li",
-    {
-      className: "ui-tree-item",
-      "data-active": item.active ? "true" : void 0,
-      "data-depth": Math.max(0, item.depth ?? 0),
-      style: { "--tree-item-depth": Math.max(0, item.depth ?? 0) },
-      "aria-current": item.active ? "true" : void 0,
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "ui-tree-item-body", children: [
-          /* @__PURE__ */ jsx("div", { className: "ui-tree-item-title", children: item.title }),
-          item.description ? /* @__PURE__ */ jsx("div", { className: "ui-tree-item-description", children: item.description }) : null
-        ] }),
-        item.badge != null ? /* @__PURE__ */ jsx(Badge, { variant: "secondary", children: item.badge }) : null
-      ]
-    },
-    item.id
-  )) });
-}
-export {
-  TreeList
-};

package/dist/components/data-entry/date-range-picker.d.ts

@@ -1,11 +0,0 @@
-import * as React from "react";
-import type { DateRangePickerProp } from "../../props/components/data-entry.prop.js";
-export type { DateRangePickerProp, DateRangePickerProp as DateRangePickerProps, } from "../../props/components/data-entry.prop.js";
-/**
- * DateRangePicker — WAI-ARIA date-range combobox rendered as ONE input-styled control
- * (the established RangePicker convention): `[ from → to  ✕ 📅 ]`. The two inner fields stay
- * real, typeable ISO `yyyy-MM-dd` inputs (form-submittable via `${name}_from` /
- * `${name}_to`, screen-reader friendly, e2e-testable by filling either input); the
- * range calendar is the visual affordance.
- */
-export declare function DateRangePicker({ value: valueProp, defaultValue, onValueChange, placeholder, disabled, className, id, name, locale: localeProp, showToday, showClose, fromDate, toDate, disabledDate, cellRender, allowClear, format, parseFormat, minDate, maxDate, showWeek, presets, needConfirm, allowEmpty, order, open: openProp, defaultOpen, onOpenChange, inputReadOnly, preserveInvalidOnBlur, placement, renderExtraFooter, size, status, variant, ref, ...ariaProps }: DateRangePickerProp): React.JSX.Element;