@ponchia/ui 0.8.1 → 0.10.0

package/docs/package-contract.md

@@ -15,7 +15,7 @@ semantic versioning contract for the surfaces listed here.
 | --- | --- | --- |
 | CSS root and `dist/bronto.css` | Stable | CSS-only default bundle. CSS side-effect imports are supported in CSS-aware bundlers; Node/runtime JS root imports are not. |
 | CSS leaves | Stable additive | Direct leaves are generated as layered `dist/css/*.css` exports; raw unlayered source leaves are explicit escape hatches under `./css/unlayered/*`. |
-| JS subpaths | Stable | ESM-only public subpaths. Runtime behavior is SSR-safe and dependency-free unless a framework binding declares an optional peer. |
+| JS subpaths | Stable | ESM-only public subpaths. Runtime behavior is SSR-safe and dependency-free; framework lifecycles belong to consumers. |
 | Machine-readable data | Stable additive | JSON/data exports are for non-JS hosts, validators, renderers, and offline agents. Additive fields are allowed within a compatible minor. |
 | Shipped docs | Stable paths | Curated Markdown/text docs ship inside the npm tarball for offline readers. Generated docs are regenerated and drift-checked. |
 | Fonts | Stable path pattern | Doto assets ship under `fonts/*` with their OFL license. |
@@ -49,6 +49,7 @@ semantic versioning contract for the surfaces listed here.
 | `./css/skins.css` | `./dist/css/skins.css` | Opt-in layered CSS leaf | Stable additive | Generated layered direct-import leaf. Opt-in and not included in dist/bronto.css. |
 | `./css/dataviz.css` | `./dist/css/dataviz.css` | Opt-in layered CSS leaf | Stable additive | Generated layered direct-import leaf. Opt-in and not included in dist/bronto.css. |
 | `./css/report.css` | `./dist/css/report.css` | Opt-in layered CSS leaf | Stable additive | Generated layered direct-import leaf. Opt-in and not included in dist/bronto.css. |
+| `./css/row.css` | `./dist/css/row.css` | Bundled layered CSS leaf | Stable additive | Generated layered direct-import leaf. Also included in dist/bronto.css. |
 | `./css/figure.css` | `./dist/css/figure.css` | Opt-in layered CSS leaf | Stable additive | Generated layered direct-import leaf. Opt-in and not included in dist/bronto.css. |
 | `./css/annotations.css` | `./dist/css/annotations.css` | Opt-in layered CSS leaf | Stable additive | Generated layered direct-import leaf. Opt-in and not included in dist/bronto.css. |
 | `./css/legend.css` | `./dist/css/legend.css` | Opt-in layered CSS leaf | Stable additive | Generated layered direct-import leaf. Opt-in and not included in dist/bronto.css. |
@@ -94,6 +95,7 @@ semantic versioning contract for the surfaces listed here.
 | `./css/unlayered/skins.css` | `./css/skins.css` | Unlayered CSS leaf | Stable path | Raw authored CSS leaf for consumers that deliberately opt out of @layer bronto on that leaf. |
 | `./css/unlayered/dataviz.css` | `./css/dataviz.css` | Unlayered CSS leaf | Stable path | Raw authored CSS leaf for consumers that deliberately opt out of @layer bronto on that leaf. |
 | `./css/unlayered/report.css` | `./css/report.css` | Unlayered CSS leaf | Stable path | Raw authored CSS leaf for consumers that deliberately opt out of @layer bronto on that leaf. |
+| `./css/unlayered/row.css` | `./css/row.css` | Unlayered CSS leaf | Stable path | Raw authored CSS leaf for consumers that deliberately opt out of @layer bronto on that leaf. |
 | `./css/unlayered/figure.css` | `./css/figure.css` | Unlayered CSS leaf | Stable path | Raw authored CSS leaf for consumers that deliberately opt out of @layer bronto on that leaf. |
 | `./css/unlayered/annotations.css` | `./css/annotations.css` | Unlayered CSS leaf | Stable path | Raw authored CSS leaf for consumers that deliberately opt out of @layer bronto on that leaf. |
 | `./css/unlayered/legend.css` | `./css/legend.css` | Unlayered CSS leaf | Stable path | Raw authored CSS leaf for consumers that deliberately opt out of @layer bronto on that leaf. |
@@ -195,7 +197,6 @@ semantic versioning contract for the surfaces listed here.
 | `./behaviors/inert` | types: `./behaviors/inert.d.ts`<br>default: `./behaviors/inert.js` | Package subpath | Public | Exported package subpath. See docs/stability.md for semantic stability. |
 | `./behaviors/legend` | types: `./behaviors/legend.d.ts`<br>default: `./behaviors/legend.js` | Package subpath | Public | Exported package subpath. See docs/stability.md for semantic stability. |
 | `./behaviors/menu` | types: `./behaviors/menu.d.ts`<br>default: `./behaviors/menu.js` | Package subpath | Public | Exported package subpath. See docs/stability.md for semantic stability. |
-| `./behaviors/modal` | types: `./behaviors/modal.d.ts`<br>default: `./behaviors/modal.js` | Package subpath | Public | Exported package subpath. See docs/stability.md for semantic stability. |
 | `./behaviors/popover` | types: `./behaviors/popover.d.ts`<br>default: `./behaviors/popover.js` | Package subpath | Public | Exported package subpath. See docs/stability.md for semantic stability. |
 | `./behaviors/sources` | types: `./behaviors/sources.d.ts`<br>default: `./behaviors/sources.js` | Package subpath | Public | Exported package subpath. See docs/stability.md for semantic stability. |
 | `./behaviors/splitter` | types: `./behaviors/splitter.d.ts`<br>default: `./behaviors/splitter.js` | Package subpath | Public | Exported package subpath. See docs/stability.md for semantic stability. |
@@ -207,11 +208,6 @@ semantic versioning contract for the surfaces listed here.
 | `./glyphs` | types: `./glyphs/glyphs.d.ts`<br>default: `./glyphs/glyphs.js` | Geometry/render helper JS | Stable additive | ESM helper surface. Function names, options, and data shapes are public; rendering heuristics may tune. |
 | `./annotations` | types: `./annotations/index.d.ts`<br>default: `./annotations/index.js` | Geometry/render helper JS | Stable additive | ESM helper surface. Function names, options, and data shapes are public; rendering heuristics may tune. |
 | `./connectors` | types: `./connectors/index.d.ts`<br>default: `./connectors/index.js` | Geometry/render helper JS | Stable additive | ESM helper surface. Function names, options, and data shapes are public; rendering heuristics may tune. |
-| `./react` | types: `./react/index.d.ts`<br>default: `./react/index.js` | Framework binding JS | Deprecated in 0.7 | Compatibility wrapper over vanilla behaviors. Scheduled for removal no earlier than 0.8 under ADR-0004; use direct behavior lifecycle cleanup. |
-| `./solid` | types: `./solid/index.d.ts`<br>default: `./solid/index.js` | Framework binding JS | Deprecated in 0.7 | Compatibility wrapper over vanilla behaviors. Scheduled for removal no earlier than 0.8 under ADR-0004; use direct behavior lifecycle cleanup. |
-| `./qwik` | types: `./qwik/index.d.ts`<br>default: `./qwik/index.js` | Framework binding JS | Deprecated in 0.7 | Compatibility wrapper over vanilla behaviors. Scheduled for removal no earlier than 0.8 under ADR-0004; use direct behavior lifecycle cleanup. |
-| `./svelte` | types: `./svelte/index.d.ts`<br>default: `./svelte/index.js` | Framework binding JS | Deprecated in 0.7 | Compatibility wrapper over vanilla behaviors. Scheduled for removal no earlier than 0.8 under ADR-0004; use direct behavior lifecycle cleanup. |
-| `./vue` | types: `./vue/index.d.ts`<br>default: `./vue/index.js` | Framework binding JS | Deprecated in 0.7 | Compatibility wrapper over vanilla behaviors. Scheduled for removal no earlier than 0.8 under ADR-0004; use direct behavior lifecycle cleanup. |
 | `./skins` | types: `./tokens/skins.d.ts`<br>default: `./tokens/skins.js` | Renderer/theme helper JS | Stable additive | ESM theme data/helpers for opt-in skins, chart palettes, and external renderers. |
 | `./charts` | types: `./tokens/charts.d.ts`<br>default: `./tokens/charts.js` | Renderer/theme helper JS | Stable additive | ESM theme data/helpers for opt-in skins, chart palettes, and external renderers. |
 | `./charts.json` | `./tokens/charts.json` | Machine-readable data | Stable additive | JSON package data for non-JS/tooling consumers. Shape is public unless the paired doc marks a field internal. |
@@ -222,6 +218,10 @@ semantic versioning contract for the surfaces listed here.
 | `./vega` | types: `./tokens/vega.d.ts`<br>default: `./tokens/vega.js` | Renderer/theme helper JS | Stable additive | ESM theme data/helpers for opt-in skins, chart palettes, and external renderers. |
 | `./vega.json` | `./tokens/vega.json` | Machine-readable data | Stable additive | JSON package data for non-JS/tooling consumers. Shape is public unless the paired doc marks a field internal. |
 | `./fonts/*` | `./fonts/*` | Vendored font asset glob | Stable path pattern | Doto font files and license. Font file names are shipped assets, not JS APIs. |
+| `./docs/compositions.md` | `./docs/compositions.md` | Shipped documentation | Stable path | Markdown documentation shipped in the tarball. Paths are public reading assets within a compatible minor. |
+| `./docs/adr/0005-productive-tools-and-editorial-reports.md` | `./docs/adr/0005-productive-tools-and-editorial-reports.md` | Shipped documentation | Stable path | Markdown documentation shipped in the tarball. Paths are public reading assets within a compatible minor. |
+| `./docs/migrations/0.9-to-0.10.md` | `./docs/migrations/0.9-to-0.10.md` | Shipped documentation | Stable path | Markdown documentation shipped in the tarball. Paths are public reading assets within a compatible minor. |
+| `./docs/adr/0006-trusted-publishing.md` | `./docs/adr/0006-trusted-publishing.md` | Shipped documentation | Stable path | Markdown documentation shipped in the tarball. Paths are public reading assets within a compatible minor. |
 
 ## Shipped Files Allowlist
 
@@ -244,11 +244,6 @@ always includes `package.json`, `README.md`, `LICENSE`, and
 | `schemas` | Machine-readable schemas | Declarative JSON schemas for package-adjacent report/tooling contracts. |
 | `annotations` | Authored public JS directory | ESM source shipped as-is; adjacent declarations/maps are generated. |
 | `connectors` | Authored public JS directory | ESM source shipped as-is; adjacent declarations/maps are generated. |
-| `react` | Authored public JS directory | ESM source shipped as-is; adjacent declarations/maps are generated. |
-| `solid` | Authored public JS directory | ESM source shipped as-is; adjacent declarations/maps are generated. |
-| `qwik` | Authored public JS directory | ESM source shipped as-is; adjacent declarations/maps are generated. |
-| `svelte` | Authored public JS directory | ESM source shipped as-is; adjacent declarations/maps are generated. |
-| `vue` | Authored public JS directory | ESM source shipped as-is; adjacent declarations/maps are generated. |
 | `shiki` | Theme data | Shiki theme JSON on the governed palette. |
 | `llms.txt` | Agent entrypoint | Shipped plain-text orientation for offline LLM/agent consumers. |
 | `CHANGELOG.md` | Release record | Shipped historical release notes. |
@@ -300,10 +295,15 @@ always includes `package.json`, `README.md`, `LICENSE`, and
 | `docs/migrations/0.5-to-0.6.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
 | `docs/migrations/0.6-to-0.7.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
 | `docs/migrations/0.7-to-0.8.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
+| `docs/migrations/0.8-to-0.9.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
 | `docs/adr/0001-color-system.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
 | `docs/adr/0002-scope-and-2026-baseline.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
 | `docs/adr/0003-theme-model.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
 | `docs/adr/0004-prune-unused-adapters.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
+| `docs/compositions.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
+| `docs/adr/0005-productive-tools-and-editorial-reports.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
+| `docs/migrations/0.9-to-0.10.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
+| `docs/adr/0006-trusted-publishing.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
 
 ## Artifact Provenance
 
@@ -316,7 +316,7 @@ result. The listed gates are part of `npm run check`.
 | Package manifest | `package.json` | docs/package-contract.md | `npm run package-contract:build` | check:fresh; check:exports; check:pack; check:consumer-surface; check:consumer-types; check:publint; check:attw | The complete export/file matrix in this document is generated from the manifest; packed tarball imports, concrete file resolution, and package-level type resolution are smoke-tested in clean consumers. |
 | Token model | `tokens/index.js` | css/tokens.css; tokens/index.json; tokens/tokens.dtcg.json; tokens/resolved.json; tokens/figma.variables.json; tokens/index.d.ts | `npm run tokens:css:build; tokens:build; dtcg:build; resolved:build; figma:variables:build; dts:build` | check:fresh; check:contrast | Token names/roles are public. Resolved and Figma handoff values are visual tuning before 1.0. |
 | Class registry | `classes/index.js plus css/*.css selectors` | classes/classes.json; classes/index.d.ts; classes/vscode.css-custom-data.json; docs/reference.md | `npm run classes:json:build; dts:build; vscode:build; reference:build` | check:fresh; check:classes; check:contract | The typed registry, JSON vocabulary, and generated reference stay aligned with real selectors. |
-| Authored CSS graph | `css/core.css plus css/*.css leaves` | dist/bronto.css; dist/css/*.css (46 layered outputs) | `npm run dist:build` | check:dist; check:exports; check:component-matrix | Default bundle and direct layered leaf imports are generated from authored CSS, size-gated, and coverage-owned as foundation or component leaves. |
+| Authored CSS graph | `css/core.css plus css/*.css leaves` | dist/bronto.css; dist/css/*.css (47 layered outputs) | `npm run dist:build` | check:dist; check:exports; check:component-matrix | Default bundle and direct layered leaf imports are generated from authored CSS, size-gated, and coverage-owned as foundation or component leaves. |
 | JSDoc-authored public JS | `behaviors/; annotations/; connectors/; react/; solid/; qwik/; svelte/; vue/` | adjacent *.d.ts and *.d.ts.map files | `npm run dts:emit` | check:dts-emit; check:types; check:consumer-surface; check:consumer-types; check:behavior-matrix; check:attw; check:publint | Declarations are emitted from the shipped JS, package subpath imports are compiled from a packed clean consumer, and public behavior exports are docs/unit/browser owned. |
 | Glyph registry | `glyphs/glyphs.js` | glyphs/glyphs.d.ts | `npm run glyphs:build` | check:glyphs; check:unit | Glyph names and render options are public. The registry stays sorted and type-covered. |
 | Display colorways | `tokens/skins.js` | css/skins.css; tokens/skins.d.ts | `npm run skins:build` | check:skins; check:contrast | Skins are opt-in root-level choices and never part of dist/bronto.css. |

package/docs/reference.md

@@ -9,7 +9,7 @@ rendering of every class is the kitchen-sink demo:
 **<https://ponchia.github.io/bronto-ui/>**. Theming knobs and the token
 contract: [docs/theming.md](theming.md).
 
-- 669 classes across 183 component groups
+- 683 classes across 186 component groups
 - Import the typed registry: `import { cls, ui, cx } from '@ponchia/ui/classes'`
 - Validate markup as data (no JS/TS): `@ponchia/ui/classes.json` — the same
   vocabulary as language-neutral JSON (`groups`, `classes`, `states`,
@@ -324,6 +324,7 @@ each one matches a real selector in the stylesheet.
 | --- | --- | --- |
 | `cls.chip` | `ui-chip` | base |
 | `cls.chipAccent` | `ui-chip--accent` | modifier |
+| `cls.chipDense` | `ui-chip--dense` | modifier |
 
 ### `.ui-citation`
 
@@ -874,6 +875,8 @@ each one matches a real selector in the stylesheet.
 | `cls.menuItem` | `ui-menu__item` | part |
 | `cls.menuLabel` | `ui-menu__label` | part |
 | `cls.menuSep` | `ui-menu__sep` | part |
+| `cls.menuAtPointer` | `ui-menu--at-pointer` | modifier |
+| `cls.menuDropdown` | `ui-menu--dropdown` | modifier |
 
 ### `.ui-menu-host`
 
@@ -1117,6 +1120,17 @@ each one matches a real selector in the stylesheet.
 | --- | --- | --- |
 | `cls.reveal` | `ui-reveal` | base |
 
+### `.ui-row`
+
+| Registry key | Class | Kind |
+| --- | --- | --- |
+| `cls.row` | `ui-row` | base |
+| `cls.rowMark` | `ui-row__mark` | part |
+| `cls.rowMeta` | `ui-row__meta` | part |
+| `cls.rowTitle` | `ui-row__title` | part |
+| `cls.rowRuled` | `ui-row--ruled` | modifier |
+| `cls.rowStacked` | `ui-row--stacked` | modifier |
+
 ### `.ui-screen-only`
 
 | Registry key | Class | Kind |
@@ -1201,6 +1215,12 @@ each one matches a real selector in the stylesheet.
 | `cls.severityRowMeta` | `ui-severity-row__meta` | part |
 | `cls.severityRowTitle` | `ui-severity-row__title` | part |
 
+### `.ui-severity-tone`
+
+| Registry key | Class | Kind |
+| --- | --- | --- |
+| `cls.severityTone` | `ui-severity-tone` | base |
+
 ### `.ui-shortcut`
 
 | Registry key | Class | Kind |
@@ -1499,6 +1519,15 @@ each one matches a real selector in the stylesheet.
 | `cls.timelineItem` | `ui-timeline__item` | part |
 | `cls.timelineTime` | `ui-timeline__time` | part |
 
+### `.ui-timestrip`
+
+| Registry key | Class | Kind |
+| --- | --- | --- |
+| `cls.timestrip` | `ui-timestrip` | base |
+| `cls.timestripAxis` | `ui-timestrip__axis` | part |
+| `cls.timestripEvent` | `ui-timestrip__event` | part |
+| `cls.timestripNow` | `ui-timestrip__now` | part |
+
 ### `.ui-toast`
 
 | Registry key | Class | Kind |
@@ -1651,13 +1680,9 @@ works in any framework without a binding layer:
   families (`ui-alert`/`ui-toast`/`ui-meter`/`ui-dot`); the builders warn on an
   out-of-set tone (see usage.md). Mapping an app's own variant
   vocabulary onto a tone is application logic, not a framework class.
-- **Modal** — native `<dialog>` gets backdrop + top-layer + focus-trap
-  free. For a controlled/portal modal, add `is-open`
-  (`ui.modal({ open: true })`) for the same skin/layout, mark the overlay
-  `data-bronto-modal`, and run `initModal()` for the inert focus trap,
-  focus-return, and Escape close signal. You still own the `is-open` state,
-  backdrop, and top-layer stacking (`.is-open` is a bare grid — it does not
-  float or stack on its own).
+- **Modal** — style a native `<dialog>` with `ui-modal`; use
+  `initDialog()` for open/close triggers and focus return. Call
+  `showModal()` to open the top layer; a CSS class is not an open state.
 - **Current page** — mark the active link with `aria-current="page"`; it is
   the programmatic cue the navs honour (`ui-sitenav`, `ui-app-nav`). The
   `.is-active` class is the visual-only equivalent on `ui-app-nav`/`ui-tab`;
@@ -1705,10 +1730,10 @@ Exact mirror of the `:root` blocks in `css/tokens.css`
 
 | Token | Value |
 | --- | --- |
-| `--radius-xl` | `4px` |
-| `--radius-lg` | `3px` |
-| `--radius-md` | `2px` |
-| `--radius-sm` | `1px` |
+| `--radius-xl` | `8px` |
+| `--radius-lg` | `6px` |
+| `--radius-md` | `4px` |
+| `--radius-sm` | `2px` |
 | `--radius-pill` | `999px` |
 | `--space-2xs` | `0.25rem` |
 | `--space-xs` | `0.5rem` |
@@ -1729,12 +1754,12 @@ Exact mirror of the `:root` blocks in `css/tokens.css`
 | `--display` | `var(--dot-font)` |
 | `--display-weight` | `700` |
 | `--display-weight-strong` | `800` |
-| `--text-2xs` | `0.72rem` |
-| `--text-xs` | `0.76rem` |
-| `--text-sm` | `0.86rem` |
-| `--text-base` | `0.95rem` |
-| `--text-lg` | `1.15rem` |
-| `--text-xl` | `1.45rem` |
+| `--text-2xs` | `0.75rem` |
+| `--text-xs` | `0.8125rem` |
+| `--text-sm` | `0.875rem` |
+| `--text-base` | `1rem` |
+| `--text-lg` | `1.125rem` |
+| `--text-xl` | `1.5rem` |
 | `--tracking-wide` | `0.14em` |
 | `--tracking-wider` | `0.22em` |
 | `--ease-standard` | `cubic-bezier(0.2, 0.8, 0.2, 1)` |

package/docs/reporting.md

@@ -1,5 +1,11 @@
 # Static reports
 
+Reports use readable screen prose, a 68ch measure, sentence-case headings, and
+an independent print treatment. Put the decision before navigation. Use
+`details.ui-report__toc` for collapsed contents and `nav.ui-report__toc` for
+always-visible contents. See [composition recipes](compositions.md).
+
+
 `@ponchia/ui` can dress static, LLM-authored HTML reports without a component
 runtime. Load the normal bundle, then either opt in to the complete report kit
 or import only the leaves a narrow report actually uses.
@@ -54,18 +60,18 @@ No install? Link the same files from a CDN. Pin the version — pre-1.0, breakin
 changes ship in the minor (see [stability.md](./stability.md)):
 
 ```html
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/dist/bronto.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/dist/css/report-kit.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/bronto.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/report-kit.css" />
 ```
 
 Leaf-by-leaf CDN imports use the same `dist/css/` paths:
 
 ```html
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/dist/bronto.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/dist/css/report.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/dist/css/dataviz.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/dist/css/annotations.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/dist/css/legend.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/bronto.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/report.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/dataviz.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/annotations.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/dist/css/legend.css" />
 ```
 
 The CDN serves the package's own `fonts/` next to the CSS, so font URLs resolve
@@ -579,7 +585,7 @@ raster).
 > origin. A static report **opened from disk (`file://`) cannot import the module
 > nor fetch `vega.json`** (CORS) — load Vega + Vega-Lite + vega-embed from pinned
 > `/build/*.min.js` CDN tags and **inline the resolved `config` object**
-> (generate it with `npm run emit:theme vega light`), the file://-safe recipe in
+> (generate it with `npm run emit:theme vega light`), the `file://`-safe recipe in
 > [vega.md](./vega.md#from-a-cdn-no-bundler). For a report
 > you intend to **print/PDF**, prefer the frozen inline `<svg>` below — it has no
 > runtime, prints exactly, and sidesteps all of this.
@@ -879,7 +885,7 @@ or validation runtime.
 
 ```json
 {
-  "$schema": "https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/schemas/report-claims.v1.schema.json",
+  "$schema": "https://cdn.jsdelivr.net/npm/@ponchia/ui@0.10.0/schemas/report-claims.v1.schema.json",
   "schemaVersion": "bronto-report-claims.v1",
   "report": { "title": "Decision readiness", "type": "decision" },
   "claims": [

package/docs/stability.md

@@ -1,11 +1,11 @@
 # Public API stability
 
 `@ponchia/ui` is pre-1.0. Breaking changes ship in the minor (`0.x.0`), and
-patches are non-breaking. In practical terms: **PATCH releases (`0.8.x`) are
+patches are non-breaking. In practical terms: **PATCH releases (`0.10.x`) are
 non-breaking bug-fixes and additive changes — safe to upgrade without review;
 MINOR releases (`0.x.0`) may include breaking changes and consumers should
 review the CHANGELOG before upgrading.** Pin `~0.x` (tilde) to accept only
-patches, or `^0.x` only if you accept minor-level churn. This policy holds
+patches, or `^0.x` for the same compatible pre-1.0 minor. This policy holds
 until `1.0.0` is tagged. This matrix defines what counts as public API.
 For the exhaustive package-manifest inventory — every `exports` key, every
 shipped `files` entry, and the generated artifact provenance map — see
@@ -53,56 +53,22 @@ enough.
 
 ### Adoption evidence for 1.0
 
-This snapshot records product evidence as of 2026-07-20. Use three evidence
-classes:
-
-- **Downstream-proven:** A non-example app, site, report generator, or tool
-  imports the published surface and passes its own build or checks.
-- **Package-proven:** Packed examples, unit tests, browser tests, and type tests
-  prove compatibility, but no inspected non-example consumer imports the
-  surface.
-- **Speculative:** Neither downstream use nor a package-level executable proof
-  justifies freezing the surface into 1.0.
-
-Package-proven is necessary but does not establish demand. During the catalog
-freeze, do not expand package-only surfaces. Recheck this table against real
-consumer upgrades before the 1.0 release candidate.
-
-> **The 0.8.0 consumer audit — read this before trusting the table below.** A
-> full-surface audit of the largest downstream consumer (a Yjs-collaborative
-> spatial canvas workspace: React, Vite, ~10k lines of its own CSS) found it
-> using **26 of the 646 published classes**, and hand-rebuilding much of the
-> rest — 10 bespoke empty states, 15 error surfaces, 17 control bars, three
-> parallel severity vocabularies, its own Markdown prose layer, its own diff
-> rows, its own meters, and two copies of visually-hidden text. Thirteen
-> primitives that map almost exactly onto what it built return **zero** uses:
-> `ui-state`, `ui-prose`, `ui-diff`, `ui-code`, `ui-meter`, `ui-progress`,
-> `ui-toolstrip`, `ui-dot`, `ui-chip`, `ui-tag`, `ui-timeline`, `ui-steps`,
-> `ui-job`.
->
-> The lesson for this document is not about that consumer. It is that **"no
-> inspected consumer imports the surface" has been measuring discoverability,
-> not demand.** Those surfaces were not rejected; they were never found. The
-> opt-in leaf model is right, but nothing tells a consumer which leaf it is
-> about to reimplement — and `bronto-ui-check`, which catches part of it, was
-> installed in that consumer and had never been run. Before any 1.0 decision
-> retires a package-proven surface for lack of adoption, confirm the surface was
-> *reachable*: named in the consumer's imports, or at least in a leaf it
-> imports. Non-adoption of an unimported leaf is not evidence.
->
-> The same audit produced this release's four consumer-driven changes (the tap
-> target floor, the safe-area tokens, `ui-button__label`, and the dense tier)
-> and the ADR-0001 canvas amendment. That is the intended loop: the consumer's
-> local classes are the backlog, resolving either to a deletion there or an
-> addition here.
-
-| Surface family | Current evidence | 1.0 disposition |
-| --- | --- | --- |
-| Core CSS, class recipes, vanilla behaviors, tokens, and Tailwind bridge | Downstream-proven across five inspected non-example app, site, and service consumers. | Stabilize names and behavior contracts. Use consumer upgrades as the release-candidate proof. |
-| Report, provenance, analytical CSS, annotations, glyphs, skins, workbench CSS, chart data, and Vega theme | Downstream-proven across four inspected report, site, dashboard, and tool consumers. | Keep opt-in. Stabilize the consumed paths; do not broaden the catalog during the freeze. |
-| Controlled non-`<dialog>` modal | Package-proven by stack, portal, late-node, focus, and cleanup regressions. None of ten inspected non-example consumers initializes `initModal`. | Deprecated in 0.7; remove no earlier than 0.8 unless a real consumer adopts it. Native `<dialog>` + `initDialog` is the stable path. |
-| React, Solid, Qwik, Svelte, and Vue lifecycle adapters | Package-proven by packed examples, types, and lifecycle tests. None of ten inspected non-example consumers imports an adapter entrypoint. | Deprecated in 0.7; remove no earlier than 0.8 unless a real consumer adopts one. Vanilla behaviors remain stable. |
-| Mermaid, D2, Shiki, Figma Variables, and the report-claims schema | Package-proven by generated-data, render, schema, and drift checks. No inspected non-example consumer currently supplies downstream proof for every path. | Keep compatible through 0.8.x, but decide each 1.0 contract from adoption evidence rather than generator coverage alone. |
+Separate downstream proof from package proof. An example build verifies the
+published contract; a real application or report upgrade verifies that it is
+useful. Record the candidate version, imported surface, visual/input checks,
+and remaining consumer-specific overrides with the release.
+
+The 0.10 direction is defined by
+[ADR-0005](adr/0005-productive-tools-and-editorial-reports.md). The active
+packed examples cover vanilla, Astro, SvelteKit, React, Tailwind, and static
+reports. The unadopted framework adapters and controlled modal were removed
+following their 0.7 deprecation; see the
+[migration](migrations/0.9-to-0.10.md).
+
+Do not maximize a consumer's fraction of the class catalog. Measure repeated
+design decisions avoided and complete tasks improved. Check discoverability
+before interpreting non-adoption, and keep legitimate domain-specific CSS in
+the consumer.
 
 After 1.0, breaking changes move to majors. Until then, the table below is the
 current public-surface matrix and the release policy above still applies.
@@ -126,7 +92,6 @@ current public-surface matrix and the release policy above still applies.
 | Consumer checker (`bronto-ui-check`) | Stable additive | The installed binary lexically validates literal `ui-*` classes and unresolved reserved-token references in supported code, style, and template sources after stripping comments; Markdown prose and generated/vendor directories are excluded. Exit 0 means no findings, exit 1 means contract findings, and exit 2 means invocation/input failure. New checks may be additive; an existing valid literal cannot become an error within a patch unless the corresponding public contract was already invalid. |
 | Glyph registry/renderers (`@ponchia/ui/glyphs`) | Stable additive | Existing glyph names stay valid. New glyphs are additive. Renderer option names and accessibility defaults are public. |
 | `.ui-icon` mask renderer | Stable | Class name, `--icon-size`, currentColor inheritance, and `--icon-mask` contract are public. The internal data URL encoding is not. |
-| Framework lifecycle adapters (`react`/`solid`/`qwik`/`svelte`/`vue`) | Deprecated in 0.7 | Hook/action/directive names, optional peer behavior, root resolver support, and cleanup remain compatible through 0.7. Scheduled for removal no earlier than 0.8 under ADR-0004. Use vanilla behaviors in framework lifecycle code. |
 | Skins (`@ponchia/ui/skins`, `css/skins.css`) | Stable additive | Existing skin names stay valid. New skins are additive. Skins are root-level choices. Skin CSS is opt-in, not in the default bundle. |
 | Charts (`@ponchia/ui/charts`, `charts.json`, `css/dataviz.css`) | Stable additive | Token names, JSON shape, and 8 categorical slots are public. `css/dataviz.css` is opt-in, not in the default bundle. Exact palette values may tune if gates and release notes justify it. |
 | External renderer themes (`@ponchia/ui/mermaid`, `@ponchia/ui/mermaid.json`, `@ponchia/ui/d2`, `@ponchia/ui/d2.json`, `@ponchia/ui/vega`, `@ponchia/ui/vega.json`) | Stable additive | Theme helper names, JSON shapes, and supported renderer theme slots are public. Values are resolved colours because Mermaid, D2, and Vega cannot consume Bronto CSS variables directly. Exact colours may tune with token changes, but `check:mermaid`, `check:d2`, and `check:vega` must prove every exported theme resolves with no `var()` leaks. No renderer runtime ships. |
@@ -140,6 +105,7 @@ current public-surface matrix and the release policy above still applies.
 | Connectors (`@ponchia/ui/connectors`, `css/connectors.css`, `.ui-connector*`, `initConnectors`) | Stable additive | Connector class names, the `data-bronto-connector` attribute contract, geometry helper function names, and recipe options are public. Helper internals/heuristics may tune before 1.0. Opt-in, not in the default bundle. |
 | Spotlight (`css/spotlight.css`, `.ui-spotlight*`, `.ui-tour-note*`, `initSpotlight`) | Stable additive | Spotlight/tour-note class names, the `--spot-*` custom-property contract, and the `data-bronto-spotlight`/`data-target` attributes are public. Opt-in, not in the default bundle. Not a tour engine. |
 | Crosshair (`css/crosshair.css`, `.ui-crosshair*`, `.ui-readout`, `initCrosshair`) | Stable additive | Crosshair/readout class names, the `--crosshair-x/y` properties, the `data-bronto-crosshair` attribute, and the `bronto:crosshair:move`/`:leave` event contract are public. Opt-in. Reports pointer position only — no data mapping. |
+| Rows (`css/row.css`, `.ui-row*`) | Stable additive | Class names, the `__title` / `__meta` / `__mark` parts, the `--stacked` / `--ruled` modifiers, and the selection contract are public: `aria-selected`, `aria-current` and `.is-selected` all paint the selected state, so the visual state cannot disagree with the announced one. `__title` is the part that truncates and `__meta` is the part that does not — that asymmetry is the contract, not a detail. **In the default bundle**, unusually for a new surface: `.ui-menu__item` composes it, so a core component depends on it. Also exported standalone, which is why it appears here, but it is NOT opt-in. |
 | Selection states (`css/selection.css`, `.ui-sel*`) | Stable additive | The `.ui-sel`/`--on`/`--off`/`--maybe` emphasis classes and recipe options are public. Opt-in, cross-cutting. The host owns selection logic; Bronto only styles the states. |
 | Analytical roll-up (`css/analytical.css`) | Stable additive | A convenience `@import` of the nine analytical leaves (figure, annotations, legend, marks, connectors, spotlight, crosshair, selection, highlights). The set of leaves it bundles may grow additively; each leaf also stays individually exported. Opt-in, not in the default bundle. |
 | Sources / provenance (`css/sources.css`, `.ui-citation*`, `.ui-source-card*`, `.ui-source-list*`, `.ui-provenance*`, `.ui-src--*`, `initSources`) | Stable additive | Citation/source/provenance class names, the cross-cutting `.ui-src--*` trust-state modifiers (always paired with an author label), the optional `data-bronto-sources` / `data-bronto-source-ref` behavior contract, `bronto:source:focus`, and the `ui.citation`/`ui.source`/`ui.provenance` recipes + `cls.sourceList` are public. Opt-in, not in the default bundle. |
@@ -149,7 +115,7 @@ current public-surface matrix and the release policy above still applies.
 | Lifecycle state (`css/state.css`, `.ui-state*`, `.ui-syncbar`) | Stable additive | The `.ui-state`/`__label`/`__detail`/`--busy` classes, the canonical lifecycle state modifiers, `.ui-syncbar`, and the `ui.state` recipe are public. Opt-in, not in the default bundle. |
 | Generated / AI-trust (`css/generated.css`, `.ui-generated*`, `.ui-origin-label*`, `.ui-reasoning*`, `.ui-tool-log`, `.ui-tool-call*`) | Stable additive | The generated-content, origin-label (incl. `--ai`), reasoning-trace and tool-log/tool-call class names and the `ui.originLabel` recipe are public. Opt-in, not in the default bundle. Not a chat kit; no confidence widget. |
 | Workbench (`css/workbench.css`, `.ui-splitter*`, `.ui-inspector*`, `.ui-property*`, `.ui-selectionbar*`, `initSplitter`) | Stable additive | Splitter, inspector, property-row and selection-bar class + BEM part names are public (no recipe). `data-bronto-splitter`, `--splitter-pos`, `bronto:splitter:resize`, and the `initSplitter` cleanup contract are public. Opt-in, not in the default bundle. The host owns pane content, persistence, collapse policy, and selection state. |
-| Command palette (`css/command.css`, `.ui-command*`, `initCommand`) | Stable additive | Command class/part names, the `data-bronto-command` attribute, and the event contract — `bronto:command:select` (`detail: { value, label }`) and `bronto:command:close` — are public. Bronto filters + navigates (APG combobox/listbox); the host owns the action registry/execution. Opt-in, not in the default bundle, no global hotkey. The deprecated framework bindings remain compatible only for the 0.7 migration window. |
+| Command palette (`css/command.css`, `.ui-command*`, `initCommand`) | Stable additive | Command class/part names, the `data-bronto-command` attribute, and the event contract — `bronto:command:select` (`detail: { value, label }`) and `bronto:command:close` — are public. Bronto filters + navigates (APG combobox/listbox); the host owns the action registry/execution. Opt-in, not in the default bundle, no global hotkey. |
 | Spark microcharts (`css/spark.css`, `.ui-spark*`) | Stable additive | Spark class names and inline sizing/label slots are public. Opt-in, not in the default bundle. The host owns data reduction and accessible surrounding text. |
 | Bullet graphs (`css/bullet.css`, `.ui-bullet*`) | Stable additive | Bullet class names and measure/target/range custom-property slots are public. Opt-in, not in the default bundle. The host owns thresholds, units, and data mapping. |
 | Diffs (`css/diff.css`, `.ui-diff*`) | Stable additive | Diff container/line/gutter class names and add/remove/highlight state modifiers are public. Opt-in, not in the default bundle. Bronto styles evidence; it does not compute diffs. |
@@ -159,7 +125,6 @@ current public-surface matrix and the release policy above still applies.
 | Terms / glossary (`css/term.css`, `.ui-term`, `.ui-glossary`) | Stable additive | Term and glossary class names plus native-popover definition hooks are public. Opt-in, not in the default bundle. The host owns glossary content and terminology policy. |
 | Contents rail (`css/toc.css`, `.ui-toc*`) | Stable additive | TOC rail class/part names and current-section state classes are public. Opt-in, not in the default bundle. The host owns section observation and active-state updates. |
 | Tree outlines (`css/tree.css`, `.ui-tree*`) | Stable additive | Tree outline class names, depth styling, and native `<details>` composition are public. Opt-in, not in the default bundle. The host owns tree data, lazy loading, and selection state. |
-| Controlled-modal focus trap (`initModal`, adapter `useModal`, `data-bronto-modal`) | Deprecated in 0.7 | The controlled non-`<dialog>` path remains compatible through 0.7 and is scheduled for removal no earlier than 0.8 under ADR-0004. Use native `<dialog>` with `initDialog()`; it remains stable. |
 | Keyboard-shortcut hint (`.ui-shortcut`, `.ui-shortcut__sep`) | Stable additive | Class names for the chord/sequence hint over `.ui-kbd` are public. Ships in the core layer (class-only, no recipe). |
 | Agent and migration data (`llms.txt`, `MIGRATIONS.json`) | Stable additive | `llms.txt` stays shipped as the offline agent entrypoint. `MIGRATIONS.json` stays a machine-readable migration map for breaking renames/removals. New migration entries are additive; removal of a migration record requires the same breaking-change discipline as the surface it describes. |
 | Generated docs shipped in npm | Stable paths | Exported docs paths stay shipped and resolvable within a compatible minor. Markdown/text assets are for reading unless your runtime has a loader. Generated content may change with the source contract. |

package/docs/state.md

@@ -165,6 +165,52 @@ Colour is never the only channel (WCAG 1.4.1): `.ui-severity` carries an
 author-written label, and `.ui-severity-dot` is only for rows that **also** name
 their level in text.
 
+### Painting a mark Bronto does not ship — `.ui-severity-tone`
+
+The three classes above all draw something: a chip, a ruled row, a background
+dot. A host painting its own mark — an SVG shape, a gradient stop, a canvas —
+needs the tone as a **value** with none of that. `.ui-severity-tone` paints
+nothing and only resolves `--severity-tone` from `data-level`:
+
+```html
+<circle class="ui-severity-tone" data-level="critical" fill="var(--severity-tone)" />
+```
+
+Reach for it when `background` is not the property you need. An SVG shape
+ignores `background` entirely, so without this a consumer restates the whole
+tier table in `fill` — and then it can drift from the rows beside it.
+
+## Timestrip — `.ui-timestrip`
+
+A status list answers *what*. The strip answers **when**, on one axis, at a
+glance: a cluster of marks at the leading edge is a fresh incident, a lone mark
+pinned to the trailing edge has been wrong for a while. It takes the same
+`data-level` as the ladder, so a strip cannot disagree with the rows under it.
+
+```html
+<div class="ui-timestrip" role="img" aria-label="When these alerts started, last 24 hours">
+  <span class="ui-timestrip__axis"></span>
+  <span class="ui-timestrip__now"></span>
+  <span class="ui-timestrip__event" data-level="critical" style="--at: 0.92"></span>
+  <span class="ui-timestrip__event" data-level="warning" style="--at: 0.4"></span>
+  <span class="ui-timestrip__event" data-level="ok" data-outside style="--at: 0"></span>
+</div>
+```
+
+**This is geometry, not a chart.** The host owns the window, the clock, and the
+arithmetic: it normalises each event to a position in `0..1` and writes it as
+`--at`, where `0` is the oldest edge and `1` is now. Bronto owns the rail, the
+now marker, and the mark. There are no scales, no ticks, no axis labels, and no
+time parsing — a surface that wants those wants a chart, and Bronto
+[refuses chart scales](./frontier-primitives.md).
+
+`data-outside` marks an event older than the window. It stays at the edge at
+reduced weight rather than vanishing, because a strip reading "quiet" while a
+row says "failing for three days" is worse than one reading crowded.
+
+The strip is decorative on its own: give it an `aria-label` naming what it
+plots, and let the rows beneath it name each level in words.
+
 ## Recipe
 
 ```js
@@ -180,6 +226,7 @@ ui.job({ state: 'running' }); // "ui-job ui-job--running"
 severity('critical'); // { class: 'ui-severity', 'data-level': 'critical' }
 severity('warning', { part: 'row' }); // { class: 'ui-severity-row', … }
 severity('nope'); // { class: 'ui-severity', 'data-level': 'unknown' }
+severity('critical', { part: 'tone' }); // { class: 'ui-severity-tone', … }
 
 SEVERITY_LEVELS; // ['critical','error','warning','notice','ok'] — sort/filter from this
 ```

package/docs/theming.md

@@ -130,6 +130,22 @@ you change CSS `--accent` later.
 - **Spacing** — override the `--space-2xs … --space-2xl` scale, or use a
   preset: `data-density="compact"` / `data-density="comfortable"` on any
   element (defaults to the middle scale).
+
+  **Read this before relying on the preset.** It re-points the `--space-*`
+  scale, and only components whose padding is *expressed in that scale* move
+  with it — around 40 of them, including `ui-panel`, `ui-modal__body`,
+  `ui-evidence-item`, `ui-claim`, `ui-job`, `ui-code__body` and the report
+  surfaces. The rest carry tuned padding pairs like `0.5rem 0.55rem`, which the
+  seven-step scale cannot express, so **they do not respond at all** —
+  `ui-alert` and `ui-menu__item` are the two most likely to surprise you.
+
+  That is a real limit, not an oversight to work around: flattening a tuned pair
+  onto the nearest scale step would change how those components look at the
+  default density, which is the one nearly everyone uses. If you need a denser
+  variant of a component that does not respond, override its padding directly —
+  and if you find yourself doing that repeatedly for the same component, that is
+  worth reporting, because it is evidence for a real `--dense` modifier rather
+  than a preset that half-works.
 - **Dark surface** — the dark theme's base is a deliberately *elevated*
   near-black (`--bg: #121212`) for readability: pure black + bright text
   causes halation, and near-black-on-black surface steps are imperceptible.