@godxjp/ui 19.1.0 → 19.2.0

package/README.md

@@ -1,7 +1,6 @@
 # @godxjp/ui
 
-The shared React UI framework for every godx surface (admin, agency portal,
-handheld). Built on shadcn + Radix UI + Tailwind CSS v4. **~98 components**, fully catalogued.
+The shared React UI framework for every godx surface (admin, agency portal, handheld).
 
 - 📦 **npm:** `@godxjp/ui` (published) · MCP server `@godxjp/ui-mcp`
 - 🌐 **Live preview / catalog:** **https://godx-jp.github.io/godxjp-ui/** (components · tokens · props)
@@ -15,23 +14,9 @@ npm i @godxjp/ui
 
 ## Role & boundary — read this first
 
-This package is **the single source of UI truth**. It is shared, versioned
-infrastructure, which means two things are non-negotiable:
-
-- **Editing it requires explicit session permission** (the hard gate — see
-  [DEVELOPMENT.md](./docs/DEVELOPMENT.md#0-what-this-package-is--and-the-boundary-it-must-keep)).
-  By default the package is off-limits; consumers _compose_ its primitives, they
-  don't fork them.
-- **It is generic and presentational only.** No app i18n (`useTranslation`), no
-  Inertia (`router`/`<Form>`), no Wayfinder routes, no business entities or domain
-  logic, no product copy, no raw colors. Those are **consumer-layer** concerns — they
-  must never leak into this package. The framework ships **its own theme**, so a
-  consumer imports the styles and needs **zero** extra theme configuration.
-- **The root export is runtime-neutral.** Importing `@godxjp/ui` (or its primitive
-  subpaths) forces **no** foreign runtime — React Router, TanStack Query, react-hook-form
-  and the i18n singleton live ONLY on their adapter subpaths (`./form`, `./query`, `./app`).
-  A CI guard (`pnpm check:core-isolation`) traces the root dist graph and fails the build if
-  an adapter ever leaks into the root barrel.
+This package is **the single source of UI truth**. It is shared, versioned infrastructure, which means two things are non-negotiable:
+
+- **Editing it requires explicit session permission** (the hard gate — see [DEVELOPMENT.md](./docs/DEVELOPMENT.md#0-what-this-package-is--and-the-boundary-it-must-keep)). By default the package is off-limits; consumers _compose_ its primitives, they don't fork them. - **It is generic and presentational only.** No app i18n (`useTranslation`), no Inertia (`router`/`<Form>`), no Wayfinder routes, no business entities or domain logic, no product copy, no raw colors. Those are **consumer-layer** concerns — they must never leak into this package.
 
 > Deciding whether a component belongs here vs. app-level? Use the
 > **`godx-ui-component-placement`** skill.
@@ -56,10 +41,7 @@ examples/        *.preview.tsx — Storybook-style stories (rendered by the prev
 preview/         The preview app (vite, :6008) → also deployed to GitHub Pages
 ```
 
-A value is defined **once** as a CSS var (`--primary`), mapped to a utility in the
-`@theme` block (`--color-primary: hsl(var(--primary))`), and consumed as `bg-primary`.
-Components emit `data-slot` / `data-*`; the look lives in `styles/*-layout.css`. See
-[DEVELOPMENT.md §1](./docs/DEVELOPMENT.md#1-architecture--the-layers-bottom-up).
+A value is defined **once** as a CSS var (`--primary`), mapped to a utility in the `@theme` block (`--color-primary: hsl(var(--primary))`), and consumed as `bg-primary`. Components emit `data-slot` / `data-*`; the look lives in `styles/*-layout.css`. See [DEVELOPMENT.md §1](./docs/DEVELOPMENT.md#1-architecture--the-layers-bottom-up).
 
 ---
 
@@ -81,21 +63,16 @@ Components emit `data-slot` / `data-*`; the look lives in `styles/*-layout.css`.
 | **shadcn paths**   | `@godxjp/ui/ui`           | Thin re-exports for shadcn-style imports (tree-shakeable)                                                                                                                                                                               |
 | **Admin (legacy)** | `@godxjp/ui/admin`        | Compound admin exports                                                                                                                                                                                                                  |
 
-> **Renamed / removed** — use the new names; the old aliases were **removed in v11** (they are no
-> longer exported at runtime). See the [migration table](#migrating-6--11) below.
-
 ---
 
 ## Migrating 6 → 11
 
-The v11 line dropped the deprecated compatibility aliases entirely — they are no longer exported
-at runtime, and their leftover `*Prop` types and README references have now been removed too (issue
-#99). Replace these at the call site:
+Replace these at the call site:
 
 | Removed / renamed (≤ v8)                  | Replacement (v11)                                   |
 | ----------------------------------------- | --------------------------------------------------- |
-| `Stack`                                   | `Flex direction="col"` (the default direction)      |
-| `Inline`                                  | `Flex direction="row"`                              |
+| `Stack`                                   | `Flex direction="col"`                              |
+| `Inline`                                  | `Flex` (default `direction="row"`)                  |
 | `Autocomplete`                            | `Select` with `showSearch` + `options`              |
 | `CountrySelect`                           | `AppSettingPicker kind="country"`                   |
 | `LocalePicker`                            | `AppSettingPicker kind="language"`                  |
@@ -110,103 +87,38 @@ at runtime, and their leftover `*Prop` types and README references have now been
 | `StatusBadge`                             | `Badge` (`status` / `tone`)                         |
 | `DialogConfirm` / `Dialog mode="confirm"` | `AlertDialog`                                       |
 
-The full data-grid feature set (sort / search / column visibility / paging) is now
-built into the one `DataTable` (`@godxjp/ui/data-display`) — TanStack-powered, with
-the lean `data` + `columns` API for the common case and the compound parts
-(`DataTable.Search` / `.ViewOptions` / `.Pagination` …) for the rich chrome. The
-separate `@godxjp/ui/data-grid` (`DataGrid`) subpath has been merged in and removed.
+The full data-grid feature set (sort / search / column visibility / paging) is now built into the one `DataTable` (`@godxjp/ui/data-display`) — TanStack-powered, with the lean `data` + `columns` API for the common case and the compound parts (`DataTable.Search` / `.ViewOptions` / `.Pagination` …) for the rich chrome. The separate `@godxjp/ui/data-grid` (`DataGrid`) subpath has been merged in and removed.
 
 ---
 
 ## Consumer setup — theme is self-contained
 
-The framework ships colors, the type scale, the wa-iro palette, and (opt-in)
-bundled fonts (M PLUS 2 + Noto Sans JP fallback via `@fontsource`). A consumer's entire
-styling surface is **one import + content sources** — no `:root` overrides, no
-font `<link>`:
+The framework ships colors, the type scale, the wa-iro palette, and (opt-in) bundled fonts (M PLUS 2 + Noto Sans JP fallback via `@fontsource`). A consumer's entire styling surface is **one import + content sources** — no `:root` overrides, no font `<link>`:
 
 ```css
 /* resources/css/app.css */
 @import "@godxjp/ui/styles";
-@source '../js/**/*.{ts,tsx}';
-@source '../views';
+@source "../js/**/*.{ts,tsx}";
+@source "../views";
 ```
 
 ### Slim build — ship only the CSS you use
 
-`@godxjp/ui/styles` is the zero-config all-in-one (every component's CSS +
-bundled fonts). To ship only what you render, import the foundation plus the
-per-layer files you need (mirrors the JS subpaths — the CSS tree-shakes too):
-
-```css
-@import "@godxjp/ui/styles/base"; /* required: tokens + tailwind + base layer */
-@import "@godxjp/ui/styles/control"; /* Button, Input, Select, Textarea, toggles */
-@import "@godxjp/ui/styles/form-layout"; /* FormField */
-@import "@godxjp/ui/styles/dialog-layout"; /* Dialog */
-/* …only the layers you use. Layer files need `base` first (they use @layer/@apply). */
-@import "@godxjp/ui/styles/fonts"; /* optional bundled faces — MUST come after `base` */
-```
-
-Skip `@godxjp/ui/styles/fonts` when you manage fonts yourself (next/font, etc.)
-and set the font tokens instead (see below). A marketing site using ~10
-components typically drops component CSS from ~142K → ~26K gzip.
-
-> **Import order rule — `fonts` after `base`.** `styles/base` pulls in the token
-> layers, whose font-agnostic `:root { --font-sans-base: <system stack> }` sits at
-> the same specificity (0,1,0) as the bundle's fill, so the later import wins.
-> Import `styles/fonts` first and the bundled faces silently never apply while the
-> ~800 KB of `@font-face` still ships. The all-in-one `@godxjp/ui/styles` entry
-> already orders this correctly.
-
-### Fonts — token-driven, per-language, no library hardcoding
-
-The base ships NO hardcoded brand face. Supply your own faces and set tokens —
-one face everywhere, or per-language (no `[lang]` selectors to write):
+`@godxjp/ui/styles` is the zero-config all-in-one (every component's CSS + bundled fonts). Managing fonts yourself (next/font, a system stack, an extension that must not ship font files)? Load the same layers without the faces:
 
 ```css
-:root {
-  --font-sans-base: var(--my-latin), system-ui, sans-serif; /* default face */
-  --font-sans-ja: "Noto Sans JP", var(--font-sans-base); /* lang="ja" */
-  --font-sans-vi: "Montserrat", var(--font-sans-base); /* lang="vi" */
-  /* also: --font-sans-ko, --font-sans-zh-hans, --font-sans-zh-hant */
-}
+@import "@godxjp/ui/styles/core"; /* every component layer, no @font-face */
 ```
 
-`styles/base.css` wires each `[lang]` to its slot (falling back to
-`--font-sans-base`); the opt-in `styles/fonts` overwrites `--font-sans-base` (and
-`--font-sans-vi`) with the bundled DXS stack — **M PLUS 2** primary with **Noto
-Sans JP** as the CJK fallback.
-
-> **The bundled faces changed in v18.** v16 bundled Noto Sans JP + Montserrat;
-> v18 bundles M PLUS 2 (primary, incl. Vietnamese coverage) + Noto Sans JP (CJK
-> fallback). If your design spec named the v16 faces, set the tokens yourself
-> instead of relying on the bundle.
-
-```tsx
-import { AppProvider } from "@godxjp/ui/app"; // locale, tz, date/time format
-import { PageContainer } from "@godxjp/ui/layout"; // every page wraps in this
-```
-
-### Mandatory consumer rules
-
-1. **Every page** uses `<PageContainer title subtitle extra footer>`.
-2. **Mobile-first** — verify at 320–390px in preview / browser.
-3. **Spacing via `Flex` `gap` + `ResponsiveGrid`** — no Tailwind `p-*` /
-   `gap-*` / `space-x|y-*` for app layout (see `docs/SPACING.md`).
-4. **Semantic tokens only** — no raw colors / hex / `dark:` overrides.
-5. **Dates** display via `formatDate` from `@godxjp/ui/datetime`.
-6. **`AppProvider`** wraps the app for locale / timezone / date-time format.
-7. **Audit** — `npm run ui:audit` must report 0 errors for touched files.
-
-Full app-developer rules: [ui-standardization.md](../../.claude/skills/frontend-design/rules/ui-standardization.md).
-
----
+> **Do not cherry-pick `*-layout.css` files.** Layers depend on each other (a
+> Select's rows, a menu's surface, a form's rhythm live in shared rules) and a
+> missing layer fails silently: menus render with no background, rows with no
+> height. `styles` and `styles/core` are the two supported entries; the runtime
+> `visual-audit` flags a page whose layers are incomplete (`css-layers-missing`).
 
 ## Golden ratio (φ ≈ 1.618)
 
-One token `--phi-unit` drives page/section/card spacing; micro control gaps use the
-4px grid. Density (`compact` | `default` | `comfortable`) retunes `--phi-unit` with
-control + table heights together.
+One token `--phi-unit` drives page/section/card spacing; micro control gaps use the 4px grid. Density (`compact` | `default` | `comfortable`) retunes `--phi-unit` with control + table heights together.
 
 | App API                           | φ level             |
 | --------------------------------- | ------------------- |
@@ -238,10 +150,7 @@ pnpm release --ui <patch|minor|major> --mcp <…|skip>   # publish lib + MCP in
 
 ### Runtime visual audit (Playwright + axe-core)
 
-`scripts/visual-audit.mjs` drives a **real browser** over a running app and runs axe-core plus
-computed-style heuristics (target size, OKLCH accent chroma, rendered emoji, mis-laid-out alerts) —
-catching what the static `pnpm audit` (source regexes) can't see. Playwright + `@axe-core/playwright`
-are **optional peers**, installed only by apps that run the audit.
+`scripts/visual-audit.mjs` drives a **real browser** over a running app and runs axe-core plus computed-style heuristics (target size, OKLCH accent chroma, rendered emoji, mis-laid-out alerts) — catching what the static `pnpm audit` (source regexes) can't see. Playwright + `@axe-core/playwright` are **optional peers**, installed only by apps that run the audit.
 
 ```bash
 # from a consumer, against its running dev/preview server:
@@ -250,30 +159,18 @@ node node_modules/@godxjp/ui/scripts/visual-audit.mjs http://localhost:5173 --fo
 node node_modules/@godxjp/ui/scripts/visual-audit.mjs --strict http://localhost:5173       # CI gate
 ```
 
-**Tested peer range** (pin one of these): `playwright >=1.55 <2` (tested 1.61.1) ·
-`@axe-core/playwright >=4.10 <5` (tested 4.12.1) · `axe-core >=4.10 <5` (tested 4.12.1). Playwright
-1.55+ is required for the `browser.newContext()` → `context.newPage()` flow axe expects; older
-`browser.newPage()` throws _"Please use browser.newContext()"_.
+**Tested peer range** (pin one of these): `playwright >=1.55 <2` (tested 1.61.1) · `@axe-core/playwright >=4.10 <5` (tested 4.12.1) · `axe-core >=4.10 <5` (tested 4.12.1). Playwright 1.55+ is required for the `browser.newContext()` → `context.newPage()` flow axe expects; older `browser.newPage()` throws _"Please use browser.newContext()"_.
 
-`--format json` **always** emits valid JSON — even on bootstrap failure — with a `status`
-(`ok` · `partial` · `error`) that separates **infrastructure errors** (missing peers, page won't
-load, axe won't inject → `errors[]`, `summary: null`/flagged) from **product findings** (`findings[]`).
-A tool failure can therefore never be misread as "zero violations". `pnpm check:visual-audit` is the
-CI smoke test: it serves a fixture page tripping all five rule families and asserts each one fires.
+`--format json` **always** emits valid JSON — even on bootstrap failure — with a `status` (`ok` · `partial` · `error`) that separates **infrastructure errors** (missing peers, page won't load, axe won't inject → `errors[]`, `summary: null`/flagged) from **product findings** (`findings[]`). A tool failure can therefore never be misread as "zero violations". `pnpm check:visual-audit` is the CI smoke test: it serves a fixture page tripping all five rule families and asserts each one fires.
 
-This repo ships two packages — `@godxjp/ui` (this dir) and `@godxjp/ui-mcp` (`mcp/`). They keep
-separate version lines but release together via `pnpm release`; see DEVELOPMENT.md §6.
-The **preview app auto-deploys to [GitHub Pages](https://godx-jp.github.io/godxjp-ui/)** on every push to `main`
-(`.github/workflows/preview-pages.yml`) — which doubles as the CI gate for `preview:build`.
+This repo ships two packages — `@godxjp/ui` (this dir) and `@godxjp/ui-mcp` (`mcp/`). They keep separate version lines but release together via `pnpm release`; see DEVELOPMENT.md §6. The **preview app auto-deploys to [GitHub Pages](https://godx-jp.github.io/godxjp-ui/)** on every push to `main` (`.github/workflows/preview-pages.yml`) — which doubles as the CI gate for `preview:build`.
 
-→ **[docs/DEVELOPMENT.md](./docs/DEVELOPMENT.md)** is the contributor guideline (the
-boundary, the layers, how to add/extend a component, verification).
+→ **[docs/DEVELOPMENT.md](./docs/DEVELOPMENT.md)** is the contributor guideline (the boundary, the layers, how to add/extend a component, verification).
 
 ## Docs index
 
 - [docs/DEVELOPMENT.md](./docs/DEVELOPMENT.md) — contributor guideline (start here to edit the package)
 - [docs/STANDARDS-vocabulary-tokens.md](./docs/STANDARDS-vocabulary-tokens.md) — the 22 vocabulary + token rules (CI-enforced)
-- [docs/roadmap/post-7.0.0.md](./docs/roadmap/post-7.0.0.md) — shipped log (7.0→9.2) + key decisions
 - [docs/COMPONENTS.md](./docs/COMPONENTS.md) · [docs/TOKENS.md](./docs/TOKENS.md) · [docs/SPACING.md](./docs/SPACING.md)
 - [docs/PROPS-VOCABULARY.md](./docs/PROPS-VOCABULARY.md) · [docs/PROPS-REGISTRY.md](./docs/PROPS-REGISTRY.md)
 - [docs/DATETIME.md](./docs/DATETIME.md) · [docs/FORMS.md](./docs/FORMS.md) · [docs/TESTING.md](./docs/TESTING.md)

package/dist/app/theme-axes.d.ts

@@ -1,15 +1,7 @@
 import type { PageDensityProp } from "../props/vocabulary/layout.prop.js";
 /** Light / dark spine — `data-theme` (alias of the legacy `.dark` class). */
 export type AppTheme = "light" | "dark";
-/**
- * Primary-palette preset — `data-brand`. `null` = keep the app's own `--primary`.
- *
- * `"dxs"` is the CANONICAL DXS preset: unlike the per-vertical tints it also binds the canonical
- * hosted-identity surface contract (auth measure/density/insets + the brand-green identity mark),
- * so every surface matches the canonical artboards with no consumer page CSS (gh#214). See
- * `src/tokens/axes.css` for the bindings and `@godxjp/ui/theme/dxs.canonical.css` for the
- * copy-free stylesheet entry point.
- */
+/** Primary-palette preset — `data-brand`. `null` = keep the app's own `--primary`. */
 export type AppBrand = "brand" | "crm" | "logistics" | "partner" | "slate" | "dxs";
 /** Control / table / spacing density — `data-density` (same vocab as PageContainer). */
 export type AppDensity = PageDensityProp;
@@ -19,9 +11,7 @@ export declare const APP_THEMES: readonly ["light", "dark"];
 export declare const APP_BRANDS: readonly ["brand", "crm", "logistics", "partner", "slate", "dxs"];
 export declare const APP_DENSITIES: readonly ["compact", "default", "comfortable"];
 export declare const APP_FONT_SIZES: readonly ["sm", "default", "lg"];
-/** The axes as held by AppProvider. `brand: null` opts out (app token wins).
- * `scaling: null` defers to the density preset; a number is the continuous global
- * size multiplier (the `--scaling` factor / Radix model) and overrides the preset. */
+/** The axes as held by AppProvider. `brand: null` opts out (app token wins). */
 export type AppThemeAxes = {
     theme: AppTheme;
     brand: AppBrand | null;
@@ -34,8 +24,7 @@ export declare const isAppBrand: (v: unknown) => v is AppBrand;
 export declare const isAppDensity: (v: unknown) => v is AppDensity;
 export declare const isAppFontSize: (v: unknown) => v is AppFontSize;
 /**
- * Write the axis attributes onto a root element (default `<html>`). Pass `brand: null`
- * to remove `data-brand` so the app's own `--primary` token applies. SSR-safe: callers
- * guard `typeof document`. Exported for non-React / imperative consumers too.
+ * Write the axis attributes onto a root element (default `<html>`). Pass `brand: null` to remove
+ * `data-brand` so the app's own `--primary` token applies.
  */
 export declare function applyThemeAxes(el: HTMLElement, axes: Partial<AppThemeAxes>): void;

package/dist/app/timezones.d.ts

@@ -2,10 +2,7 @@ import type { AppLocale } from "./types.js";
 /** Curated preset — pass to `<AppProvider timezoneOptions={APP_TIMEZONE_PRESET} />`. */
 export declare const APP_TIMEZONE_PRESET: readonly ["UTC", "Asia/Ho_Chi_Minh", "Asia/Bangkok", "Asia/Singapore", "Asia/Jakarta", "Asia/Manila", "Asia/Kuala_Lumpur", "Asia/Yangon", "Asia/Phnom_Penh", "Asia/Vientiane", "Asia/Brunei", "Asia/Tokyo", "Asia/Seoul", "Asia/Shanghai", "Asia/Hong_Kong", "Asia/Taipei", "Asia/Ulaanbaatar", "Asia/Kolkata", "Asia/Karachi", "Asia/Dhaka", "Asia/Colombo", "Asia/Dubai", "Asia/Riyadh", "Asia/Qatar", "Asia/Tehran", "Asia/Jerusalem", "Europe/London", "Europe/Paris", "Europe/Berlin", "Europe/Amsterdam", "Europe/Rome", "Europe/Madrid", "Europe/Moscow", "Europe/Istanbul", "America/New_York", "America/Chicago", "America/Denver", "America/Los_Angeles", "America/Toronto", "America/Vancouver", "America/Mexico_City", "America/Sao_Paulo", "America/Buenos_Aires", "Australia/Sydney", "Australia/Melbourne", "Australia/Perth", "Pacific/Auckland"];
 export type AppTimezonePreset = (typeof APP_TIMEZONE_PRESET)[number];
-/**
- * Preferred IANA ids not returned by all runtimes (e.g. Node lists `Asia/Saigon` only).
- * Keys are app-facing ids; values are Intl-canonical ids for offset lookup.
- */
+/** Preferred IANA ids not returned by all runtimes (e.g. Node lists `Asia/Saigon` only). */
 export declare const TIMEZONE_ALIASES: Record<string, string>;
 /** Map app id → Intl id for `DateTimeFormat` / validation. */
 export declare function resolveTimezoneForIntl(timezone: string): string;

package/dist/components/charts/area-chart.d.ts

@@ -1,8 +1,7 @@
 import type { AreaChartProp } from "../../props/components/charts.prop.js";
 export type { AreaChartProp, AreaChartProp as AreaChartProps, } from "../../props/components/charts.prop.js";
 /**
- * Area chart — magnitude over an ordered category axis. `stacked` accumulates
- * series; `curved` smooths the line. Import from the tree-shaken
- * `@godxjp/ui/charts` entry; requires the `recharts` optional peer.
+ * Area chart — magnitude over an ordered category axis. `stacked` accumulates series; `curved`
+ * smooths the line.
  */
 export declare function AreaChart(props: AreaChartProp): import("react").JSX.Element;

package/dist/components/charts/bar-chart.d.ts

@@ -1,8 +1,7 @@
 import type { BarChartProp } from "../../props/components/charts.prop.js";
 export type { BarChartProp, BarChartProp as BarChartProps, } from "../../props/components/charts.prop.js";
 /**
- * Bar chart — compare a value across categories. `stacked` stacks series into one
- * bar; `horizontal` puts the category axis on the left. Import from the
- * tree-shaken `@godxjp/ui/charts` entry; requires the `recharts` optional peer.
+ * Bar chart — compare a value across categories. `stacked` stacks series into one bar;
+ * `horizontal` puts the category axis on the left.
  */
 export declare function BarChart(props: BarChartProp): import("react").JSX.Element;

package/dist/components/charts/chart-frame.d.ts

@@ -1,15 +1,11 @@
 import * as React from "react";
 /**
- * Shared chart chrome — owns the cross-cutting concerns every chart needs so the
- * individual chart wrappers stay tiny:
- *   - a11y: a `<figure>` with a visible `<figcaption>` title and a screen-reader
- *     text alternative (WCAG 1.1.1) describing the plotted data, with the SVG
- *     itself marked `role="img"` so AT announces one labelled graphic.
- *   - i18n: a locale-aware `Intl.NumberFormat` shared by axis ticks + tooltips.
- *   - tokens: the `--chart-1..6` palette + size→height tiers.
- *
- * Internal — NOT a public catalog primitive (re-exported only through the chart
- * wrappers). See check-mcp-orphans ALLOWLIST.
+ * Shared chart chrome — owns the cross-cutting concerns every chart needs so the individual chart
+ * wrappers stay tiny: - a11y: a `<figure>` with a visible `<figcaption>` title and a screen-reader
+ * text alternative (WCAG 1.1.1) describing the plotted data, with the SVG itself marked
+ * `role="img"` so AT announces one labelled graphic. - i18n: a locale-aware `Intl.NumberFormat`
+ * shared by axis ticks + tooltips. - tokens: the `--chart-1..6` palette + size→height tiers.
+ * Internal — NOT a public catalog primitive (re-exported only through the chart wrappers).
  */
 /** Canonical decorative chart palette (foundation tokens). */
 export declare const CHART_COLORS: readonly ["var(--chart-1)", "var(--chart-2)", "var(--chart-3)", "var(--chart-4)", "var(--chart-5)", "var(--chart-6)"];
@@ -30,12 +26,7 @@ type ChartFrameProps = {
     imgSummary: string;
     /** True when there is data to plot (otherwise children render an empty state). */
     hasData: boolean;
-    /**
-     * Canvas height in px. OPTIONAL: recharts needs a measured pixel box, but a
-     * CSS-drawn chart leaves it undefined and sizes its plot from a token tier
-     * instead (`size` → `data-size` → `--*-plot-height`), so no geometry is baked
-     * into an inline style.
-     */
+    /** Canvas height in px. */
     height?: number;
     /** Mirrored onto the figure as `data-size` so CSS can pick a token height tier. */
     size?: "xs" | "sm" | "md" | "lg";

package/dist/components/charts/chart-summary.d.ts

@@ -35,8 +35,8 @@ export declare function buildTrendSummary(data: ChartDatum[], categoryKey: strin
  */
 export declare function trendRatios(data: ChartDatum[], valueKey: string): number[];
 /**
- * Resolve `emphasizedIndex` against a row count. Negative counts from the end
- * (`-1` = the latest datum). Out-of-range → no emphasis.
+ * Resolve `emphasizedIndex` against a row count. Negative counts from the end (`-1` = the latest
+ * datum).
  */
 export declare function resolveEmphasizedIndex(index: number | undefined, length: number): number;
 export {};

package/dist/components/charts/compact-bar-trend.d.ts

@@ -2,29 +2,14 @@ import * as React from "react";
 import type { CompactBarTrendProp } from "../../props/components/charts.prop.js";
 export type { CompactBarTrendProp, CompactBarTrendProp as CompactBarTrendProps, } from "../../props/components/charts.prop.js";
 /**
- * CompactBarTrend — a **dependency-free** compact vertical bar trend for dashboard
- * summary cards (a seven-day "new organizations" strip, a weekly activity pulse…).
- *
- * Unlike `BarChart` it does NOT need the `recharts` optional peer: the marks are
- * token-sized CSS blocks, so a consumer that may not add dependencies still gets a
- * real framework chart instead of a page-local grid with inline heights.
- *
- * - **Geometry is entirely token-owned** — `--chart-trend-plot-height-{xs,sm,md,lg}`,
- *   `--chart-trend-bar-{gap,radius,max-width,min-height}`. The only inline value is
- *   the datum itself (`--chart-trend-bar-value`, a 0..1 ratio of the largest bar).
- * - **Colour is token-owned** — muted marks read `--chart-trend-bar-background`
- *   (default `hsl(var(--muted-foreground) / .75)`), the emphasized mark reads
- *   `--chart-trend-bar-emphasis-background` (default `hsl(var(--primary))`).
- * - **a11y** — reuses `ChartFrame`: a `<figure>` with a visible `<figcaption>`, a
- *   `role="img"` plot named by a localized one-line summary, and a visually-hidden
- *   per-category value list referenced through `aria-describedby` (WCAG 1.1.1). The
- *   emphasized bar is ALSO named in that list, so the highlight is never
- *   colour-only (WCAG 1.4.1). The graphic holds no focusable elements — anything
- *   interactive belongs in `footer`, which renders outside the graphic.
- * - **i18n** — values are formatted with the active locale's `Intl.NumberFormat`;
- *   every generated string comes from `t()`.
- *
- * Import from `@godxjp/ui/charts/compact-bar-trend`. The isolated public entry keeps
- * consumers without the optional `recharts` peer away from the peer-backed charts barrel.
+ * CompactBarTrend — a **dependency-free** compact vertical bar trend for dashboard summary cards
+ * (a seven-day "new organizations" strip, a weekly activity pulse…). The only inline value is the
+ * datum itself (`--chart-trend-bar-value`, a 0..1 ratio of the largest bar). - **Colour is
+ * token-owned** — muted marks read `--chart-trend-bar-background` (default
+ * `hsl(var(--muted-foreground) / .75)`), the emphasized mark reads
+ * `--chart-trend-bar-emphasis-background` (default `hsl(var(--primary))`). - **a11y** — reuses
+ * `ChartFrame`: a `<figure>` with a visible `<figcaption>`, a `role="img"` plot named by a
+ * localized one-line summary, and a visually-hidden per-category value list referenced through
+ * `aria-describedby` (WCAG 1.1.1).
  */
 export declare function CompactBarTrend({ data, categoryKey, valueKey, label, description, size, emphasizedIndex, showCategoryLabels, numberFormat, footer, emptyMessage, className, id, ref, }: CompactBarTrendProp): React.JSX.Element;

package/dist/components/charts/index.d.ts

@@ -1,9 +1,4 @@
-/**
- * Charts entry — `@godxjp/ui/charts`. Isolated from the main barrel so the
- * `recharts` dependency is only pulled in when a consumer imports a chart
- * (tree-shaking: `sideEffects: false` + a dedicated tsup entry + recharts as an
- * optional peer dependency).
- */
+/** Charts entry — `@godxjp/ui/charts`. */
 export { LineChart } from "./line-chart.js";
 export type { LineChartProp, LineChartProps } from "./line-chart.js";
 export { BarChart } from "./bar-chart.js";

package/dist/components/data-display/badge.d.ts

@@ -8,13 +8,6 @@ export type BadgeVariant = "default" | "secondary" | "outline" | "dashed";
  * for a SOLID brand fill use `variant="default"`.
  */
 export type BadgeTone = ToneProp | "primary";
-/**
- * NO `text-xs` here (gh#260): a font-size utility lands in `@layer utilities`, which always beats
- * the `@layer components` rule in badge-layout.css — making the documented `--badge-font-size`
- * knob structurally inert. Font-size (and the line-height `text-xs` used to carry) are owned by
- * badge-layout.css via `--badge-font-size` / `--badge-line-height`, whose defaults reproduce the
- * old `text-xs` rendering exactly.
- */
 declare const badgeVariants: (props?: ({
     variant?: "dashed" | "default" | "outline" | "secondary" | null | undefined;
     shape?: "default" | "pill" | "sharp" | null | undefined;
@@ -32,11 +25,8 @@ export interface BadgeProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "
 }
 export declare function Badge({ className, variant, shape, tone, icon, status, children, ...props }: BadgeProps): React.JSX.Element;
 /**
- * Status-aware badge with the shared domain-status-to-tone mapping.
- *
- * `Badge` remains the general-purpose primitive. Prefer `StatusBadge` when the
- * `status` prop drives presentation so status colours remain consistent across
- * products.
+ * Status-aware badge with the shared domain-status-to-tone mapping. `Badge` remains the
+ * general-purpose primitive.
  */
 export declare const StatusBadge: typeof Badge;
 export {};

package/dist/components/data-display/card.d.ts

@@ -5,15 +5,11 @@ import type { HeadingLevelProp } from "../../props/vocabulary/index.js";
  *  stripe (default) or the full perimeter. */
 type CardAccent = "primary" | "success" | "warning" | "info" | "attention" | "destructive";
 /**
- * Where the semantic `accent` tone is drawn.
- *
- * - `"edge"` (default) — the leading-edge stripe on `border-inline-start` only, at the
- *   `--card-accent-rail-width` measure (6px). The classic "this row needs a look" rail.
- * - `"perimeter"` — a full attention border around the WHOLE card in the same semantic
- *   tone, measured by `--card-accent-perimeter-width` + `--card-accent-perimeter-ring-width`.
- *   This is what `variant="featured"` does, except the tone is yours instead of `--primary`,
- *   so a card can shout "action required" (`accent="attention"`) or "this failed"
- *   (`accent="destructive"`) without borrowing the brand colour.
+ * Where the semantic `accent` tone is drawn. - `"edge"` (default) — the leading-edge stripe on
+ * `border-inline-start` only, at the `--card-accent-rail-width` measure (6px). This is what
+ * `variant="featured"` does, except the tone is yours instead of `--primary`, so a card can shout
+ * "action required" (`accent="attention"`) or "this failed" (`accent="destructive"`) without
+ * borrowing the brand colour.
  */
 type CardAccentPlacement = "edge" | "perimeter";
 /** Surface fill — plain card, muted band, borderless outline, or emphasized featured ring. */
@@ -52,38 +48,22 @@ export declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttri
     banded?: boolean;
 } & React.RefAttributes<HTMLDivElement>>;
 export type CardTitleProps = React.HTMLAttributes<HTMLHeadingElement> & {
-    /**
-     * Semantic heading level (`h1`–`h4`). Default `3`. Choose it to keep the
-     * document outline valid (`h1 → h2 → h3`, no skipped levels) for the page the
-     * card sits on — NOT for visual size: the title's size is fixed by the
-     * `--card-title-*` tokens and does not change with `level`. A section card
-     * directly under a page `h1` uses `level={2}`; a card nested inside an
-     * already-`h2` section uses `level={3}` (the default).
-     */
+    /** Semantic heading level (`h1`–`h4`). Default `3`. */
     level?: HeadingLevelProp;
     /**
-     * Render a different element than the `level` heading. Use `"p"` / `"div"`
-     * when the card title is a styled label rather than a section heading in the
-     * outline (so it is not announced as a heading and cannot skip a level).
-     * Overrides `level`.
+     * Render a different element than the `level` heading. Use `"p"` / `"div"` when the card title
+     * is a styled label rather than a section heading in the outline (so it is not announced as a
+     * heading and cannot skip a level).
      */
     as?: "h1" | "h2" | "h3" | "h4" | "p" | "div";
 };
 export declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & {
-    /**
-     * Semantic heading level (`h1`–`h4`). Default `3`. Choose it to keep the
-     * document outline valid (`h1 → h2 → h3`, no skipped levels) for the page the
-     * card sits on — NOT for visual size: the title's size is fixed by the
-     * `--card-title-*` tokens and does not change with `level`. A section card
-     * directly under a page `h1` uses `level={2}`; a card nested inside an
-     * already-`h2` section uses `level={3}` (the default).
-     */
+    /** Semantic heading level (`h1`–`h4`). Default `3`. */
     level?: HeadingLevelProp;
     /**
-     * Render a different element than the `level` heading. Use `"p"` / `"div"`
-     * when the card title is a styled label rather than a section heading in the
-     * outline (so it is not announced as a heading and cannot skip a level).
-     * Overrides `level`.
+     * Render a different element than the `level` heading. Use `"p"` / `"div"` when the card title
+     * is a styled label rather than a section heading in the outline (so it is not announced as a
+     * heading and cannot skip a level).
      */
     as?: "h1" | "h2" | "h3" | "h4" | "p" | "div";
 } & React.RefAttributes<HTMLHeadingElement>>;
@@ -121,12 +101,10 @@ export type CardBarProps = React.HTMLAttributes<HTMLDivElement> & {
     extra?: React.ReactNode;
 };
 /**
- * CardBar — a horizontal bar (view tabs, toolbar, filter chips) that can sit at
- * ANY position inside a Card. It draws its own separators FROM its position: a
- * top bar gets a bottom border, a bottom bar gets a top border, a middle bar
- * gets both, and a sole child gets none (the card border is enough). The main
- * area scrolls horizontally; the `extra` slot is pinned to the inline-end edge
- * for actions (column settings, save view, …).
+ * CardBar — a horizontal bar (view tabs, toolbar, filter chips) that can sit at ANY position
+ * inside a Card. It draws its own separators FROM its position: a top bar gets a bottom border, a
+ * bottom bar gets a top border, a middle bar gets both, and a sole child gets none (the card
+ * border is enough).
  */
 export declare const CardBar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
     /** Right-aligned actions slot (settings/save), Ant `tabBarExtraContent`-style. */
@@ -136,8 +114,10 @@ export type StatCardProps = React.HTMLAttributes<HTMLDivElement> & {
     label: React.ReactNode;
     value: React.ReactNode;
     hint?: React.ReactNode;
-    /** Optional leading icon, rendered as a tinted medallion above the metric. Decorative
-     *  (aria-hidden) — the label carries the meaning. Tint via --stat-card-icon-* tokens. */
+    /**
+     * Optional leading icon, rendered as a tinted medallion above the metric. Decorative
+     * (aria-hidden) — the label carries the meaning.
+     */
     icon?: LucideIcon;
     /** Optional compact trend text beside the value. Avoid badge-like deltas. */
     delta?: React.ReactNode;

package/dist/components/data-display/carousel.d.ts

@@ -27,8 +27,7 @@ export declare const CarouselNext: React.ForwardRefExoticComponent<Omit<React.De
 /**
  * Dot indicators — one round dot per scroll snap, the active one widened + filled. Reads the Embla
  * api from context (no `setApi` plumbing needed); each dot is a real `<button>` with an i18n
- * accessible name and `aria-current` on the active slide, calling `scrollTo(i)`. Drop it inside
- * `<Carousel>` after the track: `<CarouselContent/> … <CarouselDots/>`.
+ * accessible name and `aria-current` on the active slide, calling `scrollTo(i)`.
  */
 export declare const CarouselDots: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/components/data-display/code-block.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import type { CodeBlockProp } from "../../props/components/data-display.prop.js";
+export type { CodeBlockProp, CodeBlockProp as CodeBlockProps };
+export declare const CodeBlock: React.ForwardRefExoticComponent<CodeBlockProp & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLPreElement>, HTMLPreElement>, "ref">, keyof CodeBlockProp> & React.RefAttributes<HTMLPreElement>>;

package/dist/components/data-display/code-block.js

@@ -0,0 +1,24 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../lib/utils.js";
+const CodeBlock = React.forwardRef(function CodeBlock2({ children, wrap = true, maxHeight = "none", size = "sm", language, className, ...rest }, ref) {
+  const scrolls = maxHeight !== "none" || !wrap;
+  return /* @__PURE__ */ jsx(
+    "pre",
+    {
+      ref,
+      "data-slot": "code-block",
+      "data-wrap": wrap ? void 0 : "false",
+      "data-max-height": maxHeight === "none" ? void 0 : maxHeight,
+      "data-size": size === "sm" ? void 0 : size,
+      "data-language": language,
+      tabIndex: scrolls ? 0 : void 0,
+      className: cn("ui-code-block", className),
+      ...rest,
+      children: /* @__PURE__ */ jsx("code", { children })
+    }
+  );
+});
+export {
+  CodeBlock
+};