@wildmason/aegis 1.15.0 → 1.16.0

package/CHANGELOG.md

@@ -10,13 +10,84 @@ page; both were written at the time, so the entries are sourced rather than
 reconstructed from memory. Anything before 1.8.0 lives in `git log` only, and is
 deliberately not summarised here rather than guessed at.
 
-**Releases from 1.12.0 onward carry no git tag.** They were published through the
-GitHub OIDC workflow, which does not tag, so `git tag` stops at `v1.11.0` and the
-tag names before that are inconsistent (`1.4.4`, `v1.5.1`). Version links below
-are omitted where no tag exists rather than pointed at a URL that 404s.
+**Releases 1.12.0 through 1.14.1 carry no git tag.** They were published through
+the GitHub OIDC workflow, which does not tag, so `git tag` skips from `v1.11.0` to
+`v1.15.0`, and the tag names before that are inconsistent (`1.4.4`, `v1.5.1`).
+Version links below are omitted where no tag exists rather than pointed at a URL
+that 404s.
 
 ## [Unreleased]
 
+_No unreleased changes._
+
+## [1.16.0] - 2026-09-01
+
+### Added
+
+- `.wm-kbd--on-accent` — the key cap for an accent fill. The base `.wm-kbd` is
+  `--wm-bg-sunken` inside `--wm-border-input`: a recess in a *surface*, and both
+  tokens are wrong the moment the cap sits on `.wm-btn--primary`. The modifier
+  carries no fill of its own, so the cap's label **is** the button's label and
+  inherits the contrast that pair already guarantees; only its edge is new, drawn
+  as `--wm-color-accent-text` at 75% over whatever is behind. Mixing toward
+  `transparent` rather than toward `--wm-color-accent` is what lets one
+  declaration serve the rest fill and the hover fill both.
+- `check:accent-contrast` — measures `.wm-btn--primary`'s label on both of its
+  fills, the new cap's edge on both, and how far the hover fill sits from the rest
+  fill, across every theme. Its destructive twin has had a guard since
+  white-on-danger was caught failing 8 of 12 themes; the accent button is the same
+  shape and had none.
+
+  The separation bar is there because the first pass shipped without one and eight
+  hovers came out invisible: the derivation took the smallest lightness step that
+  cleared contrast, which is a hover nobody can see. It is expressed as a Weber
+  fraction, `|L_hover - L_rest| / L_rest >= 0.14`, because an ABSOLUTE distance
+  cannot separate the accepted values from the rejected ones at any threshold —
+  sorted by OKLab distance an accepted theme sits below a rejected one. Normalised
+  by the rest fill's own lightness they separate cleanly, and 0.14 is the low end
+  of the band occupied by the three hovers this repo already shipped and nobody
+  ever complained about.
+
+### Fixed
+
+- **`.wm-btn--primary:hover` failed WCAG AA on warm-light: white on
+  `--wm-color-accent-hover` `#2aa198` measured 3.16:1.** The cause was
+  structural rather than one bad value. On five themes the hover was the
+  palette's *second accent* rather than a lighter or darker step of the first
+  — Solarized cyan behind Solarized blue, Dracula pink behind Dracula purple,
+  Monokai orange behind Monokai magenta. A hue jump promises nothing about the
+  label riding on it, so the label's contrast was whatever the two palette
+  entries happened to be, and on hover it also missed APCA Lc 60 on nine themes,
+  as low as Lc 28.7. Nine hover values are now the accent's own hue and chroma at
+  a different OKLCh lightness, moved *away* from the label, far enough to clear the
+  separation bar as well as the contrast bars. Where sRGB cannot hold the accent's
+  chroma at the higher lightness — vampires-kiss and twilight-peach — the colour
+  is gamut mapped with hue and lightness held and chroma reduced, rather than
+  clamped per channel, which shifts hue.
+- `--wm-color-accent-text` on arctic-night, vampires-kiss and twilight-peach was
+  short of APCA Lc 60 on the rest fill by 0.1, 0.3 and 1.4. Each moved a little
+  further from its fill in OKLCh lightness — hue and chroma held, two of the
+  three by under five values out of 255.
+- `DESIGN_LANGUAGE.md` §13 claimed `.wm-kbd` was "used identically in Helm
+  (command palette) and Slate (sidebar search button)". Neither consumer used it
+  at all. Helm draws seven key badges from five component-local rules; Slate draws
+  none. `check:docs` gates class *existence* in both directions and cannot see a
+  false claim about who uses one, so this was found by looking.
+
+### Known limitation
+
+- **Four accents cannot reach APCA Lc 60 with any label, and are pinned rather
+  than repaired. All four clear WCAG on both fills** — WCAG is the bar this
+  package ships to and no theme is exempt from it; APCA Lc 60 is the bar it
+  reaches for, enforced the same way because a bar nothing enforces decays. A
+  pinned theme is behind an aspiration, not broken. Pure white and pure black bracket every achievable Lc, and on
+  posh-sandalwood (`#f92672`, best 40.7 dark / 68.8 white — but white measures
+  3.79:1 and fails WCAG outright), source-control-dark (`#3fb950`, 54.6),
+  crepuscular-sky (`#c09d06`, 55.7) and wildmason (`#82a682`, 57.8), neither end
+  reaches it. Clearing the bar means changing the accent itself, which is each
+  theme's brand colour. The shortfalls are recorded to one decimal in
+  `check-accent-contrast.mjs`, which fails if one drifts in either direction.
+
 ## [1.15.0] - 2026-09-01
 
 ### Added
@@ -231,6 +302,8 @@ are omitted where no tag exists rather than pointed at a URL that 404s.
 Releases before 1.8.0 are in `git log`. See also `wiki/products/Aegis - Health.md`
 for the decisions behind these changes, including the ones decided against.
 
-[Unreleased]: https://github.com/wildmason/aegis/compare/master...HEAD
+[Unreleased]: https://github.com/wildmason/aegis/compare/v1.16.0...HEAD
+[1.16.0]: https://github.com/wildmason/aegis/releases/tag/v1.16.0
+[1.15.0]: https://github.com/wildmason/aegis/releases/tag/v1.15.0
 [1.11.0]: https://github.com/wildmason/aegis/releases/tag/v1.11.0
 [1.9.0]: https://github.com/wildmason/aegis/releases/tag/v1.9.0

package/inputs.css

@@ -1586,3 +1586,48 @@ select.wm-input {
   color: var(--wm-text-muted);
   pointer-events: none;
 }
+
+/* ----------------------------------------------------------------
+   On an accent fill — .wm-kbd--on-accent
+   ----------------------------------------------------------------
+   A plain .wm-kbd is --wm-bg-sunken inside --wm-border-input: a
+   recess in a surface. Put one on .wm-btn--primary and both tokens
+   are answering the wrong question — the fill is a surface colour
+   stranded on the accent, and the border is tuned to separate from
+   surfaces rather than from a saturated fill.
+
+   This modifier carries no fill of its own. It borrows the button's,
+   which means the cap's label IS the button's label and inherits the
+   contrast that pair already guarantees; nothing about the text needs
+   measuring twice. The edge is the label colour at 75% over whatever
+   sits behind it, and mixing toward `transparent` rather than toward
+   a named fill is what lets ONE declaration serve both the rest fill
+   and the hover fill — a mix toward --wm-color-accent could only
+   ever be correct for one of the two.
+
+   75% is held by check-accent-contrast.mjs against both fills on
+   every theme. The binding case is posh-sandalwood, where the edge
+   measures 3.47:1 against WCAG 1.4.11's 3:1.
+
+   Usage — inside an accent button:
+     <button class="wm-btn wm-btn--primary">
+       Accept
+       <span class="wm-kbd-combo">
+         <kbd class="wm-kbd wm-kbd--on-accent">Ctrl</kbd>
+         <kbd class="wm-kbd wm-kbd--on-accent">Enter</kbd>
+       </span>
+     </button>
+   ---------------------------------------------------------------- */
+
+.wm-kbd--on-accent {
+  color: var(--wm-color-accent-text);
+  background: transparent;
+  border-color: color-mix(in srgb, var(--wm-color-accent-text) 75%, transparent);
+}
+
+/* The combo's `+` is --wm-text-muted, a surface colour, so it is as wrong on
+   an accent fill as the cap's own tokens were. Same share as the edge, so
+   there is one number to keep in step rather than two. */
+.wm-kbd-combo > .wm-kbd--on-accent + .wm-kbd--on-accent::before {
+  color: color-mix(in srgb, currentColor 75%, transparent);
+}

package/package.json

@@ -1,64 +1,65 @@
-{
-  "name": "@wildmason/aegis",
-  "version": "1.15.0",
-  "description": "Aegis design system \u00e2\u20ac\u201d CSS tokens and Angular component library",
-  "scripts": {
-    "check:offline-fonts": "node scripts/check-offline-fonts.mjs",
-    "build": "npm run check:offline-fonts && npm run check:destructive-contrast && npm run check:semantic-contrast && npm run check:tooltip-contrast && npm run check:docs && ng-packagr -p ng-package.json",
-    "prepublishOnly": "npm run build",
-    "check:destructive-contrast": "node scripts/check-destructive-contrast.mjs",
-    "check:semantic-contrast": "node scripts/check-semantic-contrast.mjs",
-    "check:tooltip-contrast": "node scripts/check-tooltip-contrast.mjs",
-    "check:docs": "node scripts/check-design-language.mjs"
-  },
-  "files": [
-    "CHANGELOG.md",
-    "dist",
-    "fonts",
-    "themes.css",
-    "inputs.css"
-  ],
-  "exports": {
-    "./themes.css": "./themes.css",
-    "./inputs.css": "./inputs.css",
-    "./components": {
-      "types": "./dist/types/wildmason-aegis.d.ts",
-      "default": "./dist/fesm2022/wildmason-aegis.mjs"
-    }
-  },
-  "peerDependencies": {
-    "@angular/cdk": ">=21",
-    "@angular/core": ">=21",
-    "@tauri-apps/api": ">=2",
-    "rxjs": ">=7",
-    "tslib": "^2.3.0"
-  },
-  "devDependencies": {
-    "@angular/cdk": "^21.0.0",
-    "@angular/common": "21.2.1",
-    "@angular/compiler": "21.2.1",
-    "@angular/compiler-cli": "21.2.1",
-    "@angular/core": "21.2.1",
-    "@angular/forms": "21.2.1",
-    "@angular/platform-browser": "21.2.1",
-    "@tauri-apps/api": "^2.10.1",
-    "ng-packagr": "^21.0.0",
-    "tslib": "^2.8.1",
-    "typescript": "^5.9.2"
-  },
-  "keywords": [
-    "design-system",
-    "css",
-    "angular",
-    "tokens"
-  ],
-  "license": "MIT",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/wildmason/aegis.git"
-  },
-  "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org"
-  }
-}
+{
+  "name": "@wildmason/aegis",
+  "version": "1.16.0",
+  "description": "Aegis design system \u00e2\u20ac\u201d CSS tokens and Angular component library",
+  "scripts": {
+    "check:offline-fonts": "node scripts/check-offline-fonts.mjs",
+    "build": "npm run check:offline-fonts && npm run check:destructive-contrast && npm run check:semantic-contrast && npm run check:accent-contrast && npm run check:tooltip-contrast && npm run check:docs && ng-packagr -p ng-package.json",
+    "prepublishOnly": "npm run build",
+    "check:destructive-contrast": "node scripts/check-destructive-contrast.mjs",
+    "check:semantic-contrast": "node scripts/check-semantic-contrast.mjs",
+    "check:tooltip-contrast": "node scripts/check-tooltip-contrast.mjs",
+    "check:accent-contrast": "node scripts/check-accent-contrast.mjs",
+    "check:docs": "node scripts/check-design-language.mjs"
+  },
+  "files": [
+    "CHANGELOG.md",
+    "dist",
+    "fonts",
+    "themes.css",
+    "inputs.css"
+  ],
+  "exports": {
+    "./themes.css": "./themes.css",
+    "./inputs.css": "./inputs.css",
+    "./components": {
+      "types": "./dist/types/wildmason-aegis.d.ts",
+      "default": "./dist/fesm2022/wildmason-aegis.mjs"
+    }
+  },
+  "peerDependencies": {
+    "@angular/cdk": ">=21",
+    "@angular/core": ">=21",
+    "@tauri-apps/api": ">=2",
+    "rxjs": ">=7",
+    "tslib": "^2.3.0"
+  },
+  "devDependencies": {
+    "@angular/cdk": "^21.0.0",
+    "@angular/common": "21.2.1",
+    "@angular/compiler": "21.2.1",
+    "@angular/compiler-cli": "21.2.1",
+    "@angular/core": "21.2.1",
+    "@angular/forms": "21.2.1",
+    "@angular/platform-browser": "21.2.1",
+    "@tauri-apps/api": "^2.10.1",
+    "ng-packagr": "^21.0.0",
+    "tslib": "^2.8.1",
+    "typescript": "^5.9.2"
+  },
+  "keywords": [
+    "design-system",
+    "css",
+    "angular",
+    "tokens"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/wildmason/aegis.git"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org"
+  }
+}

package/themes.css

@@ -354,7 +354,7 @@
 
   /* Accent */
   --wm-color-accent: #105987;
-  --wm-color-accent-hover: #2aa198;
+  --wm-color-accent-hover: #004771;
   --wm-color-accent-text: #ffffff;
   --wm-color-accent-readable: #004066;
 
@@ -500,8 +500,8 @@
 
   /* Accent — light teal requires dark text */
   --wm-color-accent: #8fc4d3;
-  --wm-color-accent-hover: #81a1c1;
-  --wm-color-accent-text: #2e3440;
+  --wm-color-accent-hover: #b2e8f7;
+  --wm-color-accent-text: #2c323e;
   --wm-color-accent-readable: #a5dbea;
 
   /* Semantic */
@@ -577,8 +577,8 @@
 
   /* Accent — slightly lighter than canonical purple for card contrast */
   --wm-color-accent: #c9a7fa;
-  --wm-color-accent-hover: #ff79c6;
-  --wm-color-accent-text: #282a36;
+  --wm-color-accent-hover: #e5d5ff;
+  --wm-color-accent-text: #242632;
   --wm-color-accent-readable: #dcc6fe;
 
   /* Semantic */
@@ -657,8 +657,8 @@
 
   /* Accent — warm peach */
   --wm-color-accent: #f5986a;
-  --wm-color-accent-hover: #f08458;
-  --wm-color-accent-text: #1c1d2e;
+  --wm-color-accent-hover: #ffc7ac;
+  --wm-color-accent-text: #0e0e1e;
   --wm-color-accent-readable: #fead85;
 
   /* Semantic */
@@ -737,7 +737,7 @@
 
   /* Accent — thistle (muted lavender) */
   --wm-color-accent: #c4a8d8;
-  --wm-color-accent-hover: #9e7abf;
+  --wm-color-accent-hover: #e7cafc;
   --wm-color-accent-text: #1a1715;
   --wm-color-accent-readable: #d8bced;
 
@@ -884,7 +884,7 @@
 
   /* Accent — Monokai hot pink */
   --wm-color-accent: #f92672;
-  --wm-color-accent-hover: #fd971f;
+  --wm-color-accent-hover: #ff8dc2;
   --wm-color-accent-text: #1c1c15;
   /* #ff8ac4 was chosen for the WCAG failure (#f92672 is 2.9:1 on bg-float) and
      cleared 5.03:1, but measures APCA Lc 51.4 there. See the note in :root. */
@@ -964,7 +964,7 @@
 
   /* Accent — golden orange, the crepuscular ray color */
   --wm-color-accent: #c09d06;
-  --wm-color-accent-hover: #b15000;
+  --wm-color-accent-hover: #e0bd3f;
   --wm-color-accent-text: #060810;
   --wm-color-accent-readable: #dcb83a;
 
@@ -1041,7 +1041,7 @@
 
   /* Accent — medium green, needs dark text for contrast */
   --wm-color-accent: #3fb950;
-  --wm-color-accent-hover: #58a6ff;
+  --wm-color-accent-hover: #62d96f;
   --wm-color-accent-text: #0d1117;
   --wm-color-accent-readable: #5dd46a;
 
@@ -1118,7 +1118,7 @@
 
   /* Accent — Forest Moss Green */
   --wm-color-accent: #82a682;
-  --wm-color-accent-hover: #94b894;
+  --wm-color-accent-hover: #9fc59f;
   --wm-color-accent-text: #161817;
   /* #9bc99b was chosen for the WCAG failure (#82a682 is 3.30:1 on bg-float) and
      cleared 4.74:1, but measures APCA Lc 54.3 there. See the note in :root. */