@mkbabb/glass-ui 3.4.0 → 3.5.0

package/src/styles/instrument-rail.css

@@ -17,6 +17,9 @@
 
 @layer components {
     .instrument-rail {
+        /* AW.W15 — consume the shared twin-line α pair (the sibling-divider
+           ::before/::after rules below read --twin-line-catch/--twin-line-shadow). */
+        @apply twin-line-divider;
         position: relative;
         display: flex;
         flex-direction: column;
@@ -71,13 +74,17 @@
        a sibling ::before/::after stack keeps consumers free of manual
        <ChassisDivider> slotting. Status header is excluded — the
        opening-edge status light reads as a region, not a sibling. */
+    /* AW.W15 — the twin-line α pair reads from the shared `twin-line-divider`
+       tokens (`@apply`ed on `.instrument-rail` above; dark-adaptive there), so
+       the prior per-variant light pair + the `.dark` re-declaration collapse
+       onto the single source. */
     .instrument-rail[data-divider-rule][data-variant="vertical"]
         > :not(:first-child):not(.instrument-rail-status)::before {
         content: "";
         display: block;
         height: 1px;
         margin-block-end: 1px;
-        background: rgb(255 255 255 / 0.10);
+        background: var(--twin-line-catch);
     }
 
     .instrument-rail[data-divider-rule][data-variant="vertical"]
@@ -86,7 +93,7 @@
         display: block;
         height: 1px;
         margin-block-start: -1px;
-        background: rgb(0 0 0 / 0.12);
+        background: var(--twin-line-shadow);
     }
 
     .instrument-rail[data-divider-rule][data-variant="horizontal"]
@@ -95,7 +102,7 @@
         display: block;
         width: 1px;
         margin-inline-end: 1px;
-        background: rgb(255 255 255 / 0.10);
+        background: var(--twin-line-catch);
     }
 
     .instrument-rail[data-divider-rule][data-variant="horizontal"]
@@ -104,15 +111,7 @@
         display: block;
         width: 1px;
         margin-inline-start: -1px;
-        background: rgb(0 0 0 / 0.12);
-    }
-
-    .dark .instrument-rail[data-divider-rule] > :not(:first-child):not(.instrument-rail-status)::before {
-        background: rgb(255 255 255 / 0.06);
-    }
-
-    .dark .instrument-rail[data-divider-rule] > :not(:first-child):not(.instrument-rail-status)::after {
-        background: rgb(0 0 0 / 0.18);
+        background: var(--twin-line-shadow);
     }
 
     /* Status header — pinned to the opening edge, flush against the

package/src/styles/tokens.css

@@ -146,7 +146,7 @@
          snappy: (0.35s, ζ=0.65)  — quick crisp, overshoot ~+6.8%
          bouncy: (0.50s, ζ=0.45)  — emphatic overshoot ~+20.5%
          gentle: (0.70s, ζ=1.00)  — patient critically-damped
-         dock:   (0.50s, ζ=0.50)  — dock expand/collapse morph, overshoot ~+18.5%
+         dock:   (0.32s, ζ=0.70)  — dock expand/collapse morph, overshoot ~+4.6%
 
        Note on `smooth`: at ζ=0.86 the analytic solver produces a peak
        of 1.00498 (+0.5%) at the 24% slot — mathematically present but
@@ -160,7 +160,7 @@
     --spring-snappy: linear(0, 0.10438 2.041%, 0.32622 4.082%, 0.56668 6.122%, 0.77153 8.163%, 0.91961 10.204%, 1.01073 12.245%, 1.05549 14.286%, 1.06804 16.327%, 1.06171 18.367%, 1.04686 20.408%, 1.03044 22.449%, 1.01629 24.490%, 1.00596 26.531%, 0.99954 28.571%, 0.99633 30.612%, 0.99537 32.653%, 0.99575 34.694%, 0.99674 36.735%, 0.99786 38.776%, 0.99884 40.816%, 0.99956 42.857%, 1.00001 44.898%, 1.00024 46.939%, 1.00000 48.980%, 1.00000 51.020%, 1.00000 53.061%, 1.00000 55.102%, 1.00000 57.143%, 1.00000 59.184%, 1.00000 61.224%, 1.00000 63.265%, 1.00000 65.306%, 1.00000 67.347%, 1.00000 69.388%, 1.00000 71.429%, 1.00000 73.469%, 1.00000 75.510%, 1.00000 77.551%, 1.00000 79.592%, 1.00000 81.633%, 1.00000 83.673%, 1.00000 85.714%, 1.00000 87.755%, 1.00000 89.796%, 1.00000 91.837%, 1.00000 93.878%, 1.00000 95.918%, 1.00000 97.959%, 1);
     --spring-bouncy: linear(0, 0.11105 2.041%, 0.36430 4.082%, 0.65496 6.122%, 0.90929 8.163%, 1.08828 10.204%, 1.18289 12.245%, 1.20482 14.286%, 1.17641 16.327%, 1.12214 18.367%, 1.06276 20.408%, 1.01239 22.449%, 0.97809 24.490%, 0.96099 26.531%, 0.95826 28.571%, 0.96514 30.612%, 0.97666 32.653%, 0.98873 34.694%, 0.99867 36.735%, 1.00520 38.776%, 1.00825 40.816%, 1.00847 42.857%, 1.00686 44.898%, 1.00443 46.939%, 1.00199 48.980%, 1.00004 51.020%, 0.99880 53.061%, 0.99827 55.102%, 0.99829 57.143%, 0.99866 59.184%, 0.99916 61.224%, 0.99966 63.265%, 1.00004 65.306%, 1.00027 67.347%, 1.00000 69.388%, 1.00000 71.429%, 1.00000 73.469%, 1.00000 75.510%, 1.00000 77.551%, 1.00000 79.592%, 1.00000 81.633%, 1.00000 83.673%, 1.00000 85.714%, 1.00000 87.755%, 1.00000 89.796%, 1.00000 91.837%, 1.00000 93.878%, 1.00000 95.918%, 1.00000 97.959%, 1);
     --spring-gentle: linear(0, 0.09415 2.041%, 0.27374 4.082%, 0.45506 6.122%, 0.60779 8.163%, 0.72570 10.204%, 0.81213 12.245%, 0.87336 14.286%, 0.91570 16.327%, 0.94445 18.367%, 0.96371 20.408%, 0.97645 22.449%, 0.98481 24.490%, 0.99025 26.531%, 0.99377 28.571%, 0.99604 30.612%, 0.99749 32.653%, 0.99841 34.694%, 0.99900 36.735%, 0.99937 38.776%, 0.99961 40.816%, 0.99975 42.857%, 0.99985 44.898%, 1.00000 46.939%, 1.00000 48.980%, 1.00000 51.020%, 1.00000 53.061%, 1.00000 55.102%, 1.00000 57.143%, 1.00000 59.184%, 1.00000 61.224%, 1.00000 63.265%, 1.00000 65.306%, 1.00000 67.347%, 1.00000 69.388%, 1.00000 71.429%, 1.00000 73.469%, 1.00000 75.510%, 1.00000 77.551%, 1.00000 79.592%, 1.00000 81.633%, 1.00000 83.673%, 1.00000 85.714%, 1.00000 87.755%, 1.00000 89.796%, 1.00000 91.837%, 1.00000 93.878%, 1.00000 95.918%, 1.00000 97.959%, 1);
-    --spring-dock: linear(0, 0.10932 2.041%, 0.35412 4.082%, 0.63074 6.122%, 0.87072 8.163%, 1.04044 10.204%, 1.13391 12.245%, 1.16292 14.286%, 1.14748 16.327%, 1.10854 18.367%, 1.06337 20.408%, 1.02357 22.449%, 0.99499 24.490%, 0.97889 26.531%, 0.97350 28.571%, 0.97561 30.612%, 0.98178 32.653%, 0.98915 34.694%, 0.99574 36.735%, 1.00055 38.776%, 1.00332 40.816%, 1.00431 42.857%, 1.00403 44.898%, 1.00305 46.939%, 1.00186 48.980%, 1.00076 51.020%, 0.99996 53.061%, 0.99948 55.102%, 0.99930 57.143%, 0.99933 59.184%, 0.99949 61.224%, 0.99968 63.265%, 0.99986 65.306%, 1.00000 67.347%, 1.00008 69.388%, 1.00000 71.429%, 1.00000 73.469%, 1.00000 75.510%, 1.00000 77.551%, 1.00000 79.592%, 1.00000 81.633%, 1.00000 83.673%, 1.00000 85.714%, 1.00000 87.755%, 1.00000 89.796%, 1.00000 91.837%, 1.00000 93.878%, 1.00000 95.918%, 1.00000 97.959%, 1);
+    --spring-dock: linear(0, 0.10282 2.041%, 0.31773 4.082%, 0.54783 6.122%, 0.74309 8.163%, 0.88550 10.204%, 0.97598 12.245%, 1.02452 14.286%, 1.04368 16.327%, 1.04501 18.367%, 1.03739 20.408%, 1.02681 22.449%, 1.01672 24.490%, 1.00873 26.531%, 1.00323 28.571%, 0.99996 30.612%, 0.99837 32.653%, 0.99789 34.694%, 0.99805 36.735%, 0.99848 38.776%, 0.99897 40.816%, 0.99940 42.857%, 0.99972 44.898%, 0.99993 46.939%, 1.00004 48.980%, 1.00000 51.020%, 1.00000 53.061%, 1.00000 55.102%, 1.00000 57.143%, 1.00000 59.184%, 1.00000 61.224%, 1.00000 63.265%, 1.00000 65.306%, 1.00000 67.347%, 1.00000 69.388%, 1.00000 71.429%, 1.00000 73.469%, 1.00000 75.510%, 1.00000 77.551%, 1.00000 79.592%, 1.00000 81.633%, 1.00000 83.673%, 1.00000 85.714%, 1.00000 87.755%, 1.00000 89.796%, 1.00000 91.837%, 1.00000 93.878%, 1.00000 95.918%, 1.00000 97.959%, 1);
 
     /* Core cubic-bezier (exits, fallbacks, non-spring uses) */
     --motion-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
@@ -1287,17 +1287,19 @@
        both engine paths are timing-IDENTICAL: the FLIP fallback (via
        `--dock-motion-resize`), the native View-Transition group (its
        `animation-timing-function`), AND the runtime SpringProgress driver
-       (AU.W8.3) consume this same `(0.5, 0.5)` source curve. Retires the AQ.W6
+       (AU.W8.3) consume this same `(0.32, 0.7)` source curve. Retires the AQ.W6
        fork where the VT path ran `--vt-ease` (apple-spring, +27.5% overshoot)
        while the FLIP ran the snappy spring. `--vt-ease` still defaults the
        other VT recipes (`.gl-list-item`).
 
        AU.W8 — RETARGET snappy → dock. `--spring-snappy` (ζ=0.65, +6.8%) read as
        mechanical: a stiff plateau at ~48% with too little overshoot to feel
-       alive ("not iOS-smooth"). `--spring-dock` ((0.5, 0.5), ~+18.5%) sits in
-       the springy 15-30% band — the user-felt iOS bounce. The runtime driver's
-       DOCK_SPRING const MIRRORS the (0.5, 0.5) PRESETS row, so the CSS token and
-       the JS-driven morph are bit-identical. */
+       alive ("not iOS-smooth"). AW.W2 then retuned the dock spring to the
+       iOS-control register: `--spring-dock` ((0.32, 0.7), ~+4.6%) settles snappy
+       with a restrained overshoot — the felt iOS dock morph, off the prior
+       playful +18.5% register. The runtime driver's DOCK_SPRING const MIRRORS the
+       (0.32, 0.7) PRESETS row, so the CSS token and the JS-driven morph are
+       bit-identical. */
     --dock-resize-spring: var(--spring-dock);
 
     /* AT.W7-dock-b — dock-control press micro-feedback spring. A TRANSFORM-ONLY

package/src/styles/utilities.css

@@ -688,6 +688,26 @@
     }
 }
 
+/* ── Twin-line divider — the chassis catch-light / under-shadow groove ───────
+   AW.W15 DRY extraction. The twin-line idiom (a 1px white catch-light over a
+   1px black under-shadow reading as one engraved hairline groove) is the
+   chassis-divider signature. The exact light/dark α pair was DUPLICATED in
+   `instrument-chassis.css` (`.bezel-line.top`/`.bottom`) and `instrument-rail.css`
+   (the sibling `::before`/`::after`). This utility is the SINGLE source of that
+   α pair: it publishes `--twin-line-catch` (the top catch-light) and
+   `--twin-line-shadow` (the bottom under-shadow) as cascade tokens, dark-adaptive
+   by construction (the `.dark &` arm re-resolves them). Both consumers read the
+   tokens; a retint touches one rule. Real DRY, ≥2 consumers. */
+@utility twin-line-divider {
+    --twin-line-catch: rgb(255 255 255 / 0.10);
+    --twin-line-shadow: rgb(0 0 0 / 0.12);
+
+    :where(.dark) & {
+        --twin-line-catch: rgb(255 255 255 / 0.06);
+        --twin-line-shadow: rgb(0 0 0 / 0.18);
+    }
+}
+
 /* ── Control transition recipe (AU.W8b.4) ───────────────────────────────
    Shared compound transition for interactive controls that animate their
    surface (background-color/color/box-shadow/border-color) on the four-state

package/src/styles/view-transition.css

@@ -61,6 +61,30 @@
     animation-timing-function: var(--dock-resize-spring, var(--spring-dock));
 }
 
+/* AW.W3 — typed directional dock curves. The swap tags the active transition
+ * `dock-expand` / `dock-collapse` (the outer collapsed↔expanded pair) and
+ * `layer-forward` / `layer-back` (the inner DockLayerGroup pane swap) via the
+ * `types` argument to `startViewTransition` (Chrome 140+; feature-detected, the
+ * untyped fallback is the symmetric `.gl-dock-layer` curve above). iOS-feel
+ * motion is ASYMMETRIC — a snappier exit, a softer entry-overshoot. EXPAND
+ * (and forward) lead with the overshooting `--spring-dock`; COLLAPSE (and back)
+ * exit on the non-overshooting `--spring-snappy` (a quicker settle, no bounce on
+ * the way out). The shorter `--duration-fast` on the exit reads as the crisp
+ * dismiss. A non-typed engine never matches these — it runs the symmetric curve,
+ * which is the acceptable contract. PRM zeroes the animation (the `@media` at
+ * the top of this file). */
+:active-view-transition-type(dock-expand) ::view-transition-group(.gl-dock-layer),
+:active-view-transition-type(layer-forward) ::view-transition-group(.gl-dock-layer) {
+    animation-duration: var(--vt-duration, var(--duration-normal));
+    animation-timing-function: var(--dock-resize-spring, var(--spring-dock));
+}
+
+:active-view-transition-type(dock-collapse) ::view-transition-group(.gl-dock-layer),
+:active-view-transition-type(layer-back) ::view-transition-group(.gl-dock-layer) {
+    animation-duration: var(--vt-duration-exit, var(--duration-fast));
+    animation-timing-function: var(--spring-snappy);
+}
+
 @keyframes gl-vt-slide-in  { from { opacity: 0; translate: 0 var(--vt-rise, 8px); } }
 @keyframes gl-vt-slide-out { to   { opacity: 0; translate: 0 var(--vt-rise, 8px); } }
 

package/dist/useClipboard-D8vFyRCa.js

@@ -1,97 +0,0 @@
-import { getCurrentScope as e, onMounted as t, onScopeDispose as n, ref as r, toValue as i, watch as a } from "vue";
-//#region src/composables/dom/useTokenColor.ts
-function o(o, s = {}) {
-	let c = s.fallback ?? "", l = r(c);
-	function u() {
-		if (typeof document > "u") return c;
-		let e = i(o);
-		if (!e) return c;
-		let t = (s.element ? i(s.element) : null) ?? document.documentElement;
-		return t && getComputedStyle(t).getPropertyValue(e).trim() || c;
-	}
-	function d() {
-		l.value = u();
-	}
-	if (d(), t(d), typeof document < "u") {
-		let t = new MutationObserver(d);
-		t.observe(document.documentElement, {
-			attributes: !0,
-			attributeFilter: ["class"]
-		});
-		let r = typeof window < "u" && window.matchMedia ? window.matchMedia("(prefers-color-scheme: dark)") : null;
-		r?.addEventListener?.("change", d), e() && n(() => {
-			t.disconnect(), r?.removeEventListener?.("change", d);
-		});
-	}
-	return a(() => i(o), d), s.element !== void 0 && a(() => i(s.element), d), {
-		value: l,
-		refresh: d
-	};
-}
-//#endregion
-//#region src/composables/dom/useClipboard.ts
-async function s(e) {
-	if (typeof navigator > "u" || !navigator.clipboard?.writeText) return {
-		ok: !1,
-		reason: "no-api"
-	};
-	try {
-		return await navigator.clipboard.writeText(e), { ok: !0 };
-	} catch {
-		return {
-			ok: !1,
-			reason: "clipboard-api"
-		};
-	}
-}
-function c(e) {
-	if (typeof document > "u") return {
-		ok: !1,
-		reason: "no-api"
-	};
-	let t = document.createElement("textarea");
-	t.value = e, t.setAttribute("readonly", ""), t.style.position = "fixed", t.style.top = "-9999px", document.body.appendChild(t), t.select();
-	let n = !1;
-	try {
-		n = document.execCommand("copy");
-	} catch {
-		n = !1;
-	}
-	return document.body.removeChild(t), n ? { ok: !0 } : {
-		ok: !1,
-		reason: "exec-command"
-	};
-}
-async function l(e, t) {
-	let n = await s(e);
-	if (n.ok) return n;
-	let r = c(e);
-	if (r.ok) return r;
-	let i = r.reason ?? n.reason ?? "no-api";
-	return t?.(i), {
-		ok: !1,
-		reason: i
-	};
-}
-async function u(e, t = {}) {
-	let { ok: n } = await l(e, t.onCopyError);
-	return n;
-}
-function d(e = {}) {
-	let t = e.resetMs ?? 1500, i = r(!1), a = null;
-	function o() {
-		a != null && (clearTimeout(a), a = null);
-	}
-	async function s(n) {
-		let r = await l(n, e.onCopyError);
-		return r.ok && (i.value = !0, o(), a = setTimeout(() => {
-			i.value = !1, a = null;
-		}, t)), r;
-	}
-	return n(o), {
-		copied: i,
-		copy: s
-	};
-}
-//#endregion
-export { d as n, o as r, u as t };

package/dist/useViewTransition-D4ssvnXZ.js

@@ -1,18 +0,0 @@
-//#region src/composables/motion/useViewTransition.ts
-function e() {
-	return typeof document < "u" && typeof document.startViewTransition == "function";
-}
-function t(e) {
-	let t = typeof document > "u" ? void 0 : document;
-	if (!t || typeof t.startViewTransition != "function") return e(), {
-		finished: Promise.resolve(),
-		transitioned: !1
-	};
-	let n = t.startViewTransition(() => e());
-	return n.ready?.catch(() => {}), {
-		finished: n.finished.then(() => void 0, () => void 0),
-		transitioned: !0
-	};
-}
-//#endregion
-export { e as n, t };