studio-engine 0.54.1 → 0.56.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b79896d29716fe1408c39d86c9e2d19d4e6dc12dd28749ff85054c29e5ba9a77
-  data.tar.gz: 033a9a7e0e4799ef5ed0522e3fb6b6d1652ab4239d7de625add1e24ac81a5386
+  metadata.gz: 2e0f0009a05bd6e06865465368969671524d772ab938b78622539d846532d387
+  data.tar.gz: cf267435b701685424683ce6031948498b52a834551762d6be055cd126b46625
 SHA512:
-  metadata.gz: dcd13075e85ee744c86ec901f62e749320f916a72c7c04b1530a5715dcdbcec3adcaa39dc1b8236327bc5a2de4238ef1585cf42853444ff92eeae0ff7cfcc702
-  data.tar.gz: 6d242c947ec1d582202bb53652091f6ab4ed111cadfa721aab578df1f89f7b8b9a9bdb4bcd9f57b5b8a15ba9d8c9200b2358668ec2058d59f0c210072e93a79a
+  metadata.gz: 366f4b22dd590398e706f01b56b75ab5f82a60ca1bd6407f288a3898721cea9ab8914dc9e90c1865028ac3458ed299d9076d3768ae3bb3b86cb51ee26704fa70
+  data.tar.gz: a45734bb24a793ad91620694aa36457ce057ed12c86b1754cc3aa6a1365e552510fcbe2eb28932273a7a41e53c755f457395252d0f014e78ae6207dafd9fb5ee

data/CHANGELOG.md

@@ -4,6 +4,80 @@ The format is [Keep a Changelog](https://keepachangelog.com/en/1.1.0/). This pro
 
 ## Unreleased
 
+### Added
+
+- **The hold-to-confirm button, with its fizz — a new ACTION family in
+  `engine-motion.css`.** A press-and-hold CTA for an action a host does not want
+  taken by accident, ported from Turf Monster where it confirms a contest entry.
+  Render `studio/hold_button`; the specimens are on `/admin/style` (Tricks →
+  "Hold to confirm").
+
+  What ships:
+
+  - **`.hold-btn`** — the face and its five states: idle, `.process` (holding,
+    with the ring filling over `--duration`), `.loading` (submitted, spinning
+    arc), `.success` (confirmed, white check) and `.error` (blocked). The idle
+    face is a gradient down the primary ramp; the confirmed face is a deeper cut
+    of the SAME ramp, because an off-family success color reads as a jump to
+    some other button.
+  - **`.hold-stack` / `.hold-fizz` / `.fizz-bit`** — the carbonation. The
+    bubbles are the button's SIBLING, never its child: the button's `transform`
+    makes it a stacking context, so a bubble inside it can never get behind its
+    background. They show only where they escape its edges.
+  - **Six zones, three colors each.** The button is cut into a 3×2 grid and a
+    bubble only wears the colors of its own zone, so a six-item palette reads as
+    six things standing around the button. Bind `--fizz-c-1..18` (three per zone,
+    in order) on the stack — statically with the `fizz_colors:` local, or live
+    with `fizz_bind:` (an Alpine expression). Turf Monster's board binds the six
+    picked teams' light / dark / alt colors. Anything unbound falls back to the
+    bubble's own hue, so the effect is never colorless.
+  - **Two levels.** `fizz_level: :lively` (the default) rests at a full boil and
+    on hover DOUBLES THE BUBBLE COUNT — a second layer, seeded apart so it lands
+    in the first one's gaps, fades in over it. `fizz_level: :calm` simmers at
+    rest and boils on hover, one layer.
+  - **Per-instance theming without new CSS.** Every color reads a `--hold-*`
+    input before its default, so an ancestor can restyle one button or a page of
+    them: `--hold-bg-from` / `--hold-bg-mid` / `--hold-bg-to` for the resting
+    face, `--hold-success-from` / `--hold-success-to` / `--hold-success-glow-rgb`
+    for the confirmed one.
+  - **`prefers-reduced-motion` switches the bubbles off**, with `!important`,
+    because the state rules are more specific than anything the media query can
+    write — without it a lively button keeps fizzing at someone who asked it not
+    to.
+
+  Per-instance behavior travels as `data-*` on the button and is evaluated
+  against the surrounding `x-data` scope: `guard`, `validate` / `validate_at`,
+  `early_action` / `early_action_at` / `early_action_guard`, `on_hold_start` and
+  `on_success`. `Studio::FizzHelper` owns the bubble table and is seeded per
+  `hold_id`, so a button scatters identically on every render (a Turbo-restored
+  page matches the one it replaced) and two buttons on a page do not fizz in
+  lockstep.
+
+- **`.studio-team-glow` rings a host that paints its own background**, and can
+  carry **two colors**.
+
+  The ring previously needed an opaque CHILD in front to cover its middle,
+  because both wedge layers are pseudo-elements at `z-index: -1 / -2` and CSS
+  paints an element's background BEFORE its negative-z descendants. A live board
+  card cannot supply that child: Turbo targets the card element itself for
+  replace and remove, so a wrapper host is orphaned every time a card leaves the
+  board. The primitive now cuts the host's own box out of both layers
+  (`padding` + `mask-composite`, the trick §1's `.studio-border-glow` already
+  used), so the ring works on the card directly.
+
+  **No-op for the wrapper shape** — its child was already covering that
+  interior. Verified side by side against both live consumers
+  (`style/_modal_specimen` and the hub's release-phase-meter): pixel-equivalent
+  before and after.
+
+  `--studio-team-glow-color-b` colors the SECOND of the two opposed wedges and
+  defaults to the first, so one-color callers see no change and a caller with a
+  pair to show — a Pokémon's two types — gets one per wedge.
+
+  The bloom twin needed care: a mask applies AFTER a filter, so its box carries a
+  transparent border twice the blur radius and its wedges stop at the padding
+  box. Without that room the halo ends on a hard line at its own edge.
+
 ### Fixed
 
 - **`.conic-surface` keeps its wash inside its own box.** The wash was an