@kerfjs/ui 5.0.0-beta.112 → 5.0.0-beta.114

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,6 @@
1
1
  # Public API signatures for the UI authoring corpus
2
2
 
3
- Generated from emitted declarations for `@kerfjs/ui@5.0.0-beta.112` and `kerfjs@5.0.0-beta.112`. This bounded reference covers only APIs used by the seven-task corpus. It is interface evidence, not an implementation or runtime guarantee.
3
+ Generated from emitted declarations for `@kerfjs/ui@5.0.0-beta.114` and `kerfjs@5.0.0-beta.114`. This bounded reference covers only APIs used by the seven-task corpus. It is interface evidence, not an implementation or runtime guarantee.
4
4
 
5
5
  ## `@kerfjs/ui/css-values`
6
6
 
@@ -1,6 +1,6 @@
1
1
  # Web Awesome JSX signatures for the UI authoring corpus
2
2
 
3
- Generated from the emitted `@kerfjs/ui@5.0.0-beta.112` declaration boundary. Import `@kerfjs/ui/webawesome` for type effects when authoring direct `wa-*` JSX. The module emits no runtime behavior and does not register custom elements.
3
+ Generated from the emitted `@kerfjs/ui@5.0.0-beta.114` declaration boundary. Import `@kerfjs/ui/webawesome` for type effects when authoring direct `wa-*` JSX. The module emits no runtime behavior and does not register custom elements.
4
4
 
5
5
  ```ts
6
6
  import { KerfCustomElement } from 'kerfjs/jsx-runtime';
@@ -153,9 +153,23 @@
153
153
  :has(> .kui-choice-chips__input:checked),
154
154
  [aria-selected="true"]
155
155
  ) {
156
+ --_kui-choice-chips-border: Highlight;
157
+
156
158
  border-color: Highlight;
157
159
  color: HighlightText;
158
160
  background: Highlight;
161
+ /* Chromium otherwise paints a contrast backplate over the selected text
162
+ and icon despite the system-color pair above. Keep the opt-out local to
163
+ the selected pill so the remaining controls retain UA adjustments. */
164
+ box-shadow: inset 0 0 0 1px HighlightText;
165
+ forced-color-adjust: none;
166
+ }
167
+
168
+ .kui-choice-chips__chip:is(
169
+ :has(> .kui-choice-chips__input:checked),
170
+ [aria-selected="true"]
171
+ ):is(:has(> .kui-choice-chips__input:focus-visible), :focus-visible) {
172
+ outline-color: Highlight;
159
173
  }
160
174
 
161
175
  .kui-choice-chips__swatch {
@@ -153,9 +153,23 @@
153
153
  :has(> .kui-choice-chips__input:checked),
154
154
  [aria-selected="true"]
155
155
  ) {
156
+ --_kui-choice-chips-border: Highlight;
157
+
156
158
  border-color: Highlight;
157
159
  color: HighlightText;
158
160
  background: Highlight;
161
+ /* Chromium otherwise paints a contrast backplate over the selected text
162
+ and icon despite the system-color pair above. Keep the opt-out local to
163
+ the selected pill so the remaining controls retain UA adjustments. */
164
+ box-shadow: inset 0 0 0 1px HighlightText;
165
+ forced-color-adjust: none;
166
+ }
167
+
168
+ .kui-choice-chips__chip:is(
169
+ :has(> .kui-choice-chips__input:checked),
170
+ [aria-selected="true"]
171
+ ):is(:has(> .kui-choice-chips__input:focus-visible), :focus-visible) {
172
+ outline-color: Highlight;
159
173
  }
160
174
 
161
175
  .kui-choice-chips__swatch {
@@ -503,7 +503,10 @@ radio's accessible name is the visible label; a `swatch` or `icon` is
503
503
  `aria-hidden` decoration. The focus ring is drawn on the pill around the
504
504
  focused radio, and the checked pill adds a second pixel of border so the
505
505
  selection does not rely on hue alone; forced-colors mode paints it with
506
- `Highlight`.
506
+ `Highlight` and `HighlightText`. Selected pills opt out of the browser's
507
+ automatic color adjustment only within the pill: Chromium otherwise paints a
508
+ backplate over the label and icon. The selected edge and focus ring use system
509
+ colors; unselected and disabled pills retain normal forced-colors adjustment.
507
510
 
508
511
  With `multiple: 'toggle'`, the group renders `role="group"` with the same
509
512
  naming, and each choice is a native `<input type="checkbox">` inside its pill.
@@ -24,3 +24,23 @@ Applying `content-visibility: auto` only to the `BackdropImage` hero preserved t
24
24
  An exact 50-card counterbalanced follow-up found first-pass p95 of 18.7 ms unchanged versus 18.6 ms with hero deferral at 1440px, and 18.2 versus 18.6 ms at 390px. All four runs preserved feed scroll height; peak layers were 97 versus 33 on desktop and 44 versus 16 on narrow. The 50-card feed is near the display cadence floor, so deferral provides no measurable frame-time gain at that size. The earlier mismatched 50/52-card block is excluded from this conclusion.
25
25
 
26
26
  The 200-card hero ablation decoded 324/396 images before traversal on desktop and 352/396 on narrow, versus all images in the unchanged effect. Browser checks therefore verify that visible images are ready after scrolling to them and that feed geometry remains stable. These numbers measure a specific seeded local feed and CPU setting, not a general frame-time guarantee.
27
+
28
+ ## Residual dense-feed investigation
29
+
30
+ KF-CG0G0S used the NM-PSF3FN production bundle and seeded real server to probe the remaining 200-card cost. The published comparison had already shown that replacing the 16px CSS blur with independent 64px pre-blurred assets did not help: at 1440px and Chromium CPU4x, local p95 was 39.4–40.2ms with the filter and 42.0–49.8ms with the asset, versus 18.1–19.6ms for the archived plain-image control. Both effect modes peaked at 33 layers, versus 9 for the control. That control is historical, so this gap is not an isolated estimate of any one CSS property.
31
+
32
+ The follow-up used the same current effect bundle, 200 seeded cards, fresh browser contexts, decoded images, a 240-frame 2400px forward/reverse local path, and CPU4x. Each CSS variant was injected before warmup and run in counterbalanced order. These probes omitted CDP tracing to keep the experiment bounded; peak layer counts came from `LayerTree` and p95 from animation frames. The raw scripts and results are attached to KF-CG0G0S.
33
+
34
+ | CSS probe | 1440px local p95, two contexts | 390px local p95, two contexts | Peak layers, wide / narrow | Finding |
35
+ | ---------------------------------------------------------- | -----------------------------: | ----------------------------: | -------------------------: | ------------------------------------------------ |
36
+ | Current effect (containment block) | 34.5–46.0ms | 36.0–37.8ms | 33 / 16 | Counterbalanced reference |
37
+ | `contain: paint` on hero | 39.4–48.4ms | 34.0–35.7ms | 33 / 16 | No consistent gain; same layer count |
38
+ | `contain: paint` on backdrop | 45.8–46.7ms | 32.4–37.6ms | 33 / 16 | No consistent gain; same layer count |
39
+ | Current effect (root-deferral block) | 44.9–46.4ms | 31.1–38.1ms | 33 / 16 | Counterbalanced reference |
40
+ | `content-visibility: auto` plus aspect ratio on media root | 45.0–45.3ms | 32.1–36.9ms | 33 / 16 | Exact feed height, but no demonstrated reduction |
41
+
42
+ In the root-deferral block, initial, warmed, and post-scroll heights matched the control exactly: 56,353px wide and 157,333px narrow. This does not justify moving deferral from the hero: it adds a second offscreen containment boundary without lowering layer count or showing a repeatable p95 gain.
43
+
44
+ A separate wide-only block isolated the animated parts. Current effect p95 was 43.0–43.8ms with 33 peak layers. Hiding the dim layer yielded 38.5 and 46.1ms with 33 layers: inconclusive. Hiding the blurred copy yielded 38.9 and 40.7ms with 27 layers. Disabling parallax yielded 36.8 and 37.2ms with 27 layers. The latter two changes remove required visible behavior, so neither is a component fix. They do support the layer/timeline composition as the next investigation target rather than mutation-rescan wiring, whose cost was not implicated by this scroll experiment.
45
+
46
+ No public component change is justified by these probes. KF-QX18S3 tracks target-device validation and a lower-layer design that retains independent reverse transitions, progressive blur/dim, static fallbacks, controls, focus, and feed geometry. A physical device/browser and normal-scroll frame budget are needed before a headless Mac CPU4x result can serve as acceptance evidence.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kerfjs/ui",
3
- "version": "5.0.0-beta.112",
3
+ "version": "5.0.0-beta.114",
4
4
  "description": "Accessible, composable UI primitives for kerf applications.",
5
5
  "type": "module",
6
6
  "license": "MIT",