@celestia-island/hikari 0.55.35 → 0.55.37

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@celestia-island/hikari",
-  "version": "0.55.35",
+  "version": "0.55.37",
   "private": false,
   "type": "module",
   "description": "Hikari Vue 3 component library — production-grade UI components based on shittim-chest design system",

package/src/components/HkCheckbox.scss

@@ -29,7 +29,10 @@
   width: 1.125rem;
   height: 1.125rem;
   border-radius: var(--radius-sm, 4px);
-  border: 1px solid var(--hi-color-border, rgba(100,100,100,0.08));
+  /* The resting outline is the palette border slot at FULL strength:
+   * --hi-color-border is the faint divider channel (15% alpha) and melts
+   * into white/dark surfaces. */
+  border: 1px solid rgb(var(--color-border, 100 100 100));
   background: var(--hi-color-surface, rgba(240,244,248,0.95));
   transition:
     border-color var(--duration-normal, 0.3s) ease,

package/src/components/HkModal.scss

@@ -452,21 +452,30 @@
   }
 
   .hk-modal-content {
-    // IME cap-chase guard (2026-09-21, Xiaomi WebView chest report): on
-    // adjustResize engines the keyboard animation steps the layout
-    // viewport — and with it the 100dvh term of the max-height cap —
-    // every frame. With max-height in the base transition list each step
-    // RETARGETS a 150ms transition, so a sheet that binds the cap (tall
-    // content: multi-step wizards, model pickers) stays permanently
-    // mid-transition: the box chases the viewport, layout stays dirty,
-    // and the fixed layer re-rasters per step (black-block flicker).
-    // Short sheets never bind the cap and never noticed. The cap now
-    // follows the viewport INSTANTLY on phones — which is exactly how
-    // native iOS/Android sheets track the keyboard — while the height
-    // pin (content-driven, one-shot per morph) and the clip reveal
-    // keep their transition. Desktop keeps the full list.
+    // Phone-sheet transition = clip-path ONLY (2026-09-21, two Xiaomi
+    // WebView chest reports same day):
+    //
+    // ① IME cap-chase: on adjustResize engines the keyboard animation
+    //   steps the layout viewport — and the 100dvh term of the
+    //   max-height cap — every frame. With max-height in the transition
+    //   list each step RETARGETS a 150ms transition, so a cap-bound
+    //   sheet (tall content: wizards, model pickers) stays permanently
+    //   mid-transition chasing its own viewport. The cap now follows
+    //   the viewport INSTANTLY — exactly how native sheets track the
+    //   keyboard.
+    //
+    // ② Step-change shrink flicker: useSizeMorph's clip mode pins
+    //   growth instantly and sweeps the top edge paint-only, but
+    //   SHRINKS still route through this height transition — 150ms of
+    //   per-frame layout on a fixed full-width layer, re-rastering the
+    //   moving edge every frame (wizard Prev/Next between
+    //   different-height steps showed black blocks along the top).
+    //   Shrinks now SNAP: one layout, one paint — the native-sheet
+    //   direction change. Growth keeps its animated reveal via the
+    //   clip-path sweep (the only transition left on phones).
+    //
+    // Desktop keeps the full base list (height + max-height + clip-path).
     transition:
-      height var(--duration-fast, 0.15s) var(--ease-standard, cubic-bezier(0.4, 0, 0.2, 1)),
       clip-path var(--duration-fast, 0.15s) var(--ease-standard, cubic-bezier(0.4, 0, 0.2, 1));
     // !important beats the inline maxWidth (width prop); base width: 100%
     // already applies at every viewport, so only the cap is re-asserted.

package/src/components/HkModal.sheetgap.test.ts

@@ -74,24 +74,28 @@ describe("HkModal mobile sheet spacing contract", () => {
       expect(content).not.toMatch(/max-height:\s*none/);
     });
 
-    // 2026-09-21 IME cap-chase guard (Xiaomi WebView chest report): the
-    // keyboard animation steps the layout viewport — and the 100dvh term
-    // of the cap — every frame; with max-height in the transition list
-    // each step RETARGETS a 150ms transition and a cap-bound (tall)
-    // sheet chases its own viewport, re-rastering per step (black-block
-    // flicker). The phone sheet's transition list must therefore carry
-    // ONLY the content-driven channels: the height pin (one-shot per
-    // morph) and the clip reveal. The cap itself follows the viewport
-    // instantly — native sheet behavior.
-    it("drops max-height from the phone sheet transition (IME cap-chase guard)", () => {
+    // 2026-09-21 phone-sheet transition contract (two Xiaomi WebView
+    // chest reports the same day): the mobile list carries ONLY the
+    // clip-path reveal.
+    // ① IME cap-chase: the keyboard animation steps the 100dvh cap every
+    //   frame; max-height in the transition list made cap-bound sheets
+    //   chase their own viewport. The cap follows the viewport instantly.
+    // ② Step-change shrink flicker: useSizeMorph routes clip-mode
+    //   SHRINKS through the height transition — 150ms of per-frame
+    //   layout on a fixed layer re-rastering the moving edge (wizard
+    //   Prev/Next between different-height steps showed black blocks).
+    //   With height out of the list, shrinks snap (one layout, one
+    //   paint — native-sheet behavior); growth keeps its animated
+    //   reveal through the clip-path sweep.
+    it("narrows the phone sheet transition to clip-path only (IME + shrink guards)", () => {
       // Extraction self-check: the mobile rule must exist and MUST carry
       // a transition declaration at all (its absence is the regression,
       // not a vacuous pass).
       expect(content.length, "mobile .hk-modal-content rule extracted").toBeGreaterThan(0);
       const tr = content.match(/transition:\s*([^;]+);/)?.[1] ?? "";
       expect(tr.length, "mobile sheet transition declaration present").toBeGreaterThan(0);
-      expect(tr).toMatch(/\bheight\b/);
       expect(tr).toMatch(/\bclip-path\b/);
+      expect(tr).not.toMatch(/\bheight\b/);
       expect(tr).not.toMatch(/\bmax-height\b/);
     });
 

package/src/components/HkRadio.scss

@@ -44,7 +44,10 @@
   align-items: center;
   justify-content: center;
   border-radius: 50%;
-  border: 1px solid var(--hi-color-border);
+  /* The resting outline is the palette border slot at FULL strength:
+   * --hi-color-border is the faint divider channel (15% alpha) and melts
+   * into white/dark surfaces. */
+  border: 1px solid rgb(var(--color-border, 100 100 100));
   background: var(--hi-color-surface);
   transition:
     border-color var(--duration-normal, 0.3s) ease,

package/src/composables/useSizeMorph.ts

@@ -85,9 +85,13 @@ export interface SizeMorphOptions {
  * transition, same "content rides rigidly" grammar as the modal unveil,
  * but paint/compositor-level: no per-frame layout and no per-frame
  * backdrop-filter re-raster over the resizing fixed layer (the mobile
- * patchy-flicker source, 2026-09-15 chest report). Shrinks and every
- * height-mode surface keep the height transition — the rare direction
- * is not worth the flex-compression look-ahead trade.
+ * patchy-flicker source, 2026-09-15 chest report). Height-mode
+ * surfaces and the select sheet keep the height transition for shrinks
+ * (their stylesheets list it); the phone MODAL sheet narrowed its list
+ * to clip-path-only (2026-09-21 step-change shrink report — 150ms of
+ * per-frame layout on the fixed layer re-rastered the moving edge), so
+ * its shrinks snap: the L291-style pin flip lands instantly when the
+ * stylesheet no longer transitions height.
  *
  * Reduced motion / the global animation switch stay honored: the frame's
  * transition-duration collapses to one frame under