@ponchia/ui 0.8.0 → 0.8.1

package/CHANGELOG.md

@@ -5,6 +5,51 @@
 |> `^0` / `*` wildcard does **not** protect you. See README → Versioning, and
 |> the deprecation policy in CONTRIBUTING.md.
 
+## 0.8.1 — 2026-08-11
+
+A packaging fix, plus dependency hygiene. **No published CSS, token, class, or
+type artifact changed** — `dist/`, `css/`, `tokens/` and `classes/` are byte-for-byte
+identical to 0.8.0. If you are on 0.8.0 and do not read the migration guide from
+the package, there is nothing here for you.
+
+### Fixed
+
+- **`docs/migrations/0.7-to-0.8.md` was missing from the published package.**
+  0.8.0's one breaking change is the colorway canvas re-point, `CHANGELOG.md`
+  and `MIGRATIONS.json` both point at that guide, and it was not in the tarball —
+  so a consumer following the pointer from an offline install got nothing. The
+  guide was written, linked, and gated by `check:doc-links`; it was simply never
+  added to `package.json`'s hand-maintained `files` array.
+- **The gate that should have caught it was circular.** `check-pack.mjs` derived
+  its set of shipped docs *from* `files`, so it proved every listed doc ships and
+  could never prove a doc that exists is listed. It now asserts the other
+  direction for the two directories the published package itself references —
+  `docs/migrations/` (from `MIGRATIONS.json`) and `docs/adr/` (from
+  `docs/architecture.md`) — where a missing file costs a reader a dead pointer.
+  Other `docs/` pages stay opt-in: the package ships a curated subset by design.
+
+### Changed
+
+- **Dependency sweep** — ten Dependabot PRs landed as one reviewed change. Every
+  advisory was **devDependency-scoped**; the package declares no runtime
+  dependencies and `npm audit --omit=dev` was already clean, so none of them
+  ever reached a consumer. `npm audit` now reports 0 across the whole tree
+  (`fast-uri`, `js-yaml`, `nanoid`, `pdfjs-dist`, `postcss`, `shell-quote`,
+  `tar`, `undici`), the toolchain moved (`jsdom` 30, `knip` 6.32, `prettier`
+  3.9.6, `publint` 0.3.23, `react`/`react-dom` 19.2.8, `solid-js` 1.9.14,
+  `stylelint` 17.14.1, `vega` 6.3.1, `@arethetypeswrong/cli` 0.18.5), the pinned
+  action SHAs moved, and the Astro example moved to Astro 7 (verified building
+  against the packed 0.8.0 tarball).
+
+### Not taken
+
+- **TypeScript 7.** Its default export is now `{ version, versionMajorMinor }` —
+  the compiler-API namespace moved in the native port — so `ts.ScriptTarget` is
+  `undefined` and `scripts/lib/import-policy.mjs` throws at `check:exports`.
+  Adapting this repository's AST tooling to that API is real work with its own
+  review, and there is no security driver: TypeScript is not in any advisory
+  here. Pinned to `^6.0.3`; Dependabot's dev-group PR stays open for it.
+
 ## 0.8.0 — 2026-08-11
 
 A single-consumer release. A full-surface audit of the largest downstream

package/README.md

@@ -81,7 +81,7 @@ Or drop it in with no build step, straight from a CDN (replace the version only
 when deliberately upgrading across a breaking pre-1.0 minor):
 
 ```html
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.0/dist/bronto.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/dist/bronto.css">
 ```
 
 ## Quick start

package/docs/migrations/0.7-to-0.8.md

@@ -0,0 +1,216 @@
+# Migrating 0.7 to 0.8
+
+Machine-readable migration graph: [`MIGRATIONS.json`](../../MIGRATIONS.json) —
+it has no entry for this pair, because nothing was renamed or removed. Every
+class, token, attribute, and export valid in 0.7 is still valid.
+
+0.8.0 comes from auditing one real consumer's stylesheet in full. It repairs an
+accessibility floor, adds three surfaces that consumer had to hand-write, and
+changes what a colorway does. Only the last of those needs a decision from you.
+
+## 1. Decide what your skins should look like — the one breaking change
+
+**Only affects you if you set `data-bronto-skin`.** If you don't, skip to §2.
+
+Until 0.7, a colorway moved `--accent` and nothing else; the neutral canvas
+stayed grey, and ADR-0001 step 4 said so. From 0.8 a colorway also re-points ten
+canvas tokens per theme:
+
+```
+--bg  --bg-elevated  --panel  --panel-strong  --panel-soft
+--line  --line-strong  --text  --text-soft  --text-dim
+```
+
+So "Amber CRT" now actually renders amber. Nothing in your source changes and no
+checker will flag anything — the break is purely visual, which is why it is
+worth reading rather than discovering.
+
+**Contrast is not a regression risk.** Each neutral keeps the core token's OKLCH
+*lightness* exactly and moves only hue plus a small chroma, and `check-contrast`
+re-measures all 21 gated pairings per skin per theme. Status colours
+(`--success` / `--warning` / `--danger` / `--info`) are untouched by design: a
+warning must look like a warning in every skin.
+
+### If you already hand-wrote a canvas for a skin
+
+Delete it. That workaround is what motivated this change, and a hand-rolled
+version is almost certainly not contrast-gated, probably covers one theme, and
+probably misses whichever skin nobody opened.
+
+### If you want the 0.7 look back
+
+Re-declare the ten tokens after the skin import. They are ordinary custom
+properties on a `:root[data-bronto-skin=…]` selector inside `@layer bronto`, so
+un-layered app CSS wins without a specificity fight:
+
+```css
+@import '@ponchia/ui';
+@import '@ponchia/ui/css/skins.css';
+
+/* Keep the neutral canvas grey under every colorway. */
+:root[data-bronto-skin] {
+  --bg: #f4f4f2;
+  --bg-elevated: #fbfbfa;
+  --panel: #ffffff;
+  --panel-strong: #ffffff;
+  --panel-soft: #ececea;
+  --line: #d8d8d4;
+  --line-strong: #a8a8a2;
+  --text: #0a0a0a;
+  --text-soft: #353533;
+  --text-dim: #686863;
+}
+```
+
+(Those are the 0.7 light values; take the dark set from `tokens/resolved.json`
+and repeat under `:root[data-theme='dark'][data-bronto-skin]`.)
+
+## 2. Delete your tap-target workaround
+
+The coarse-pointer floor was written as a bare `2.9rem`, and `css/base.css` sets
+`html { font-size: 0.9375rem }` — so it resolved to **43.5px**, half a pixel
+under the 44 that WCAG 2.5.5 and both platform HIGs require, and less than that
+under any host with a smaller root. If you noticed and declared your own 44px
+floor, you can now drop it:
+
+```diff
+-:root { --touch-target: 44px; }
+-
+-@media (pointer: coarse) {
+-  .my-control { min-block-size: var(--touch-target); }
+-}
+```
+
+Bronto's controls float to `var(--tap-target)` — `max(44px, 2.9rem)` — on their
+own. For your *own* controls, consume the token rather than a literal:
+
+```css
+@media (pointer: coarse) {
+  .my-control {
+    min-block-size: var(--tap-target); /* 44px floor, WCAG 2.5.5 */
+  }
+}
+```
+
+`--tap-target-min` is the WCAG 2.5.8 AA 24px floor, for controls that only have
+to clear the smaller bar. Both clamp in px on purpose: **keep the clamp if you
+override them.** A bare rem is how a 44px floor quietly becomes 43.5px.
+
+## 3. Delete your safe-area declarations
+
+0.7 had no `env()` awareness at all. If you declared your own insets, drop them —
+the same four names now ship:
+
+```diff
+-:root {
+-  --safe-area-top: env(safe-area-inset-top, 0px);
+-  --safe-area-bottom: env(safe-area-inset-bottom, 0px);
+-}
+```
+
+Eight viewport-anchored surfaces now read them: the app rail and topbar, a
+sticky site header, the skip link, both toast stacks, the drawer modal, and the
+lightbox. Every rule uses `max(<authored>, var(--safe-area-*))`, so **desktop
+rendering is unchanged**.
+
+They are indirected through custom properties rather than calling `env()` at the
+point of use, which matters twice: a desktop test runner cannot emulate `env()`
+but can override a property, and a host running inside its own chrome (an
+embedded webview, a kiosk frame) can declare the real insets. Follow the same
+convention for your own floating chrome:
+
+```css
+.my-floating-bar {
+  inset-block-end: max(1rem, var(--safe-area-bottom));
+}
+```
+
+## 4. Two new opt-in ergonomics
+
+Neither is required; both replace a common workaround.
+
+**`ui-button__label`** — an icon button can keep its words for the accessible
+name and for text-based test selectors while giving back the pixels. One markup
+shape serves both forms, and no `aria-label` can drift out of sync with the
+visible wording:
+
+```html
+<button class="ui-button ui-button--icon">
+  <span class="ui-icon" style="--icon-mask: …"></span>
+  <span class="ui-button__label">Delete</span>
+</button>
+```
+
+Drop `--icon` and the same markup renders glyph + word. The slot ellipsises
+rather than wrapping, so a labelled button in a tight bar shrinks instead of
+pushing its neighbours out.
+
+**`ui-button--dense`** — for bars whose *height* is the constraint: a pane title
+bar, a packed toolbar, a table row's actions. It lowers only the visual floor,
+to `--tap-target-min`. The coarse-pointer block still floats it to the full
+`--tap-target`, so a control you shrink for a mouse is never shrunk for a
+finger. `ui.button({ size: 'dense' })` in the recipe API.
+
+## 5. Retire your own severity vocabulary
+
+Nothing forces this, but it is the reason most likely to have produced
+divergent code. Bronto shipped the tones without the **scale**, so consumers
+invented tier names — and inside one app they drift, because each surface was
+written on a different day. If you have more than one, `css/state.css` now
+publishes the canonical ladder:
+
+```
+critical › error › warning › notice › ok      (+ unknown, outside the order)
+```
+
+```js
+import { severity, SEVERITY_LEVELS } from '@ponchia/ui/classes';
+
+severity('critical');                  // { class: 'ui-severity', 'data-level': 'critical' }
+severity('warning', { part: 'row' });  // { class: 'ui-severity-row', … }
+SEVERITY_LEVELS;                       // sort and filter from this, not a local copy
+```
+
+The level travels on `data-level` — one attribute name — so a chip, a row, a
+dot, and your own element all read the same selector, and your own element can
+take `var(--severity-tone)` without copying a colour table.
+
+Map your existing tiers onto it rather than keeping both. `unknown` is the
+landing spot for anything unmeasured or stale; do **not** map it to `ok`, which
+is an assertion of health and is how a dead collector reads as a healthy system.
+
+## 6. Other surfaces you may be hand-rolling
+
+Each of these replaced something a real consumer had built locally. None is
+required.
+
+- **`.ui-pane`** — a grab header, an in-place rename input, and an actions slot
+  that scrolls rather than pushing its last control past the clipped edge. If
+  you have a node/window/panel with a draggable title bar, this is it.
+  `.ui-panel` is still just a padded card.
+- **`.ui-toolstrip--pane`** — a control bar belonging to one pane rather than to
+  the app: no frame of its own, and it refuses to wrap so a second row cannot
+  resize live content underneath. Mark the shrinking element with
+  `.ui-toolstrip__fill`.
+- **`.ui-selectionbar--anchored`** (and the same on `.ui-toolstrip`) — viewport
+  anchoring for a floating bar, safe-area aware. Use
+  `--anchor-block-start` for the bar that must *not* sit under the thumb.
+- **`.ui-empty-state__glyph/__lead/__hint`** and **`--invite`** — the three
+  parts every empty surface re-invents, plus the distinction between reporting
+  absence and offering the next action.
+
+## 7. If you read `tokens.dtcg.json`
+
+Six new scale tokens are **deliberately absent** from it, listed in the root
+extension's `omittedCssVariables`: the two tap-target floors are `max()`
+comparisons and the four safe-area insets are `env()` reads, and neither has a
+conforming DTCG shape. Emitting one arm of a clamp, or the 0px fallback of an
+`env()`, would publish a value that is wrong everywhere it matters. Read
+`tokens.json` for the authored CSS. This is the same treatment `--shadow` and
+the em trackings already get.
+
+## Nothing else changed
+
+No class was renamed or removed. No export moved. `bronto-ui-check` will not
+report anything new for a 0.7-clean consumer — which is worth stating plainly,
+because the one breaking change in this release is invisible to it.

package/docs/package-contract.md

@@ -299,6 +299,7 @@ always includes `package.json`, `README.md`, `LICENSE`, and
 | `docs/migrations/0.4-to-0.5.md` | Shipped documentation | Curated Markdown reading asset shipped in the npm tarball. |
 | `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/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. |

package/docs/reporting.md

@@ -54,18 +54,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.0/dist/bronto.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.0/dist/css/report-kit.css" />
+<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" />
 ```
 
 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.0/dist/bronto.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.0/dist/css/report.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.0/dist/css/dataviz.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.0/dist/css/annotations.css" />
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.0/dist/css/legend.css" />
+<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" />
 ```
 
 The CDN serves the package's own `fonts/` next to the CSS, so font URLs resolve
@@ -879,7 +879,7 @@ or validation runtime.
 
 ```json
 {
-  "$schema": "https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.0/schemas/report-claims.v1.schema.json",
+  "$schema": "https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/schemas/report-claims.v1.schema.json",
   "schemaVersion": "bronto-report-claims.v1",
   "report": { "title": "Decision readiness", "type": "decision" },
   "claims": [

package/llms.txt

@@ -45,7 +45,7 @@ the path changes from source `css/` to built `dist/css/`:
 <!-- installed locally -->
 <link rel="stylesheet" href="./node_modules/@ponchia/ui/dist/css/<leaf>.css" />
 <!-- or from a CDN; pin the version (pre-1.0, breaking changes ship in the minor) -->
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.0/dist/css/<leaf>.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.8.1/dist/css/<leaf>.css" />
 ```
 
 The flattened default bundle is `dist/bronto.css` (bundler shorthand

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ponchia/ui",
-  "version": "0.8.0",
+  "version": "0.8.1",
   "type": "module",
   "description": "CSS-first identity and UI layer for services, tools, sites, and reports — works in HTML, every framework, and PDF, no component runtime. Shared app shell, forms, tables, workflow chrome, plus opt-in analytical/report primitives. Monochrome with one rationed accent. Zero runtime dependencies.",
   "keywords": [
@@ -113,6 +113,7 @@
     "docs/migrations/0.4-to-0.5.md",
     "docs/migrations/0.5-to-0.6.md",
     "docs/migrations/0.6-to-0.7.md",
+    "docs/migrations/0.7-to-0.8.md",
     "docs/adr/0001-color-system.md",
     "docs/adr/0002-scope-and-2026-baseline.md",
     "docs/adr/0003-theme-model.md",
@@ -213,24 +214,24 @@
     "prepublishOnly": "npm run build:artifacts && npm run check"
   },
   "devDependencies": {
-    "@arethetypeswrong/cli": "^0.18.4",
+    "@arethetypeswrong/cli": "^0.18.5",
     "@axe-core/playwright": "^4.11.3",
     "@builder.io/qwik": "^1.20.0",
     "@playwright/test": "1.60.0",
     "github-actionlint": "^1.7.12",
-    "jsdom": "^29.1.1",
-    "knip": "^6.23.0",
-    "pdfjs-dist": "^6.1.200",
-    "prettier": "^3.9.1",
-    "publint": "^0.3.21",
-    "react": "^19.2.7",
-    "react-dom": "^19.2.7",
-    "solid-js": "^1.9.13",
-    "stylelint": "^17.14.0",
+    "jsdom": "^30.0.1",
+    "knip": "^6.32.1",
+    "pdfjs-dist": "^6.2.108",
+    "prettier": "^3.9.6",
+    "publint": "^0.3.23",
+    "react": "^19.2.8",
+    "react-dom": "^19.2.8",
+    "solid-js": "^1.9.14",
+    "stylelint": "^17.14.1",
     "stylelint-config-standard": "^40.0.0",
     "stylelint-use-logical": "^2.1.3",
     "typescript": "^6.0.3",
-    "vega": "^6.2.0",
+    "vega": "^6.3.1",
     "vega-lite": "^6.4.3"
   },
   "peerDependencies": {