@justai/cuts 0.129.4 → 0.129.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@justai/cuts",
-  "version": "0.129.4",
+  "version": "0.129.6",
   "description": "A persona's named parts \u2014 the page shell that holds them, and the cuts themselves.",
   "license": "UNLICENSED",
   "repository": {

package/src/Toolbar.astro

@@ -457,12 +457,21 @@ import AuthMount from "./AuthMount.astro";
    * Opacity and pointer-events here; the INERT that takes them out of the tab order is set in the
    * script, because CSS cannot. The transition matters more than it looks: chrome that snaps away
    * reads as breaking, chrome that withdraws reads as dimming the house lights. */
-  :global(html[data-stage="playing"]) .tb-nav-group,
-  :global(html[data-stage="playing"]) .tb-right,
-  :global(html[data-stage="playing"]) .tb-title {
-    opacity: 0.16; pointer-events: none;
-    transition: opacity 0.4s var(--ease-out);
-  }
+  /* ── IN THE DARK, NOT DISABLED — how this row goes quiet while a game plays ─────────────────
+   * queries: toolbar looks disabled · faded but clickable · toolbar during a game · theater
+   *
+   * Three versions of quieting, each struck by the founder. Fading the elements was the last one:
+   * *"neden disable mis gibi gozukuyor ama tiklanabiliyor? tiklanabiliyorsa disable gibi
+   * gozukmemeli."* Right - reduced opacity IS the visual language of disabled, and nothing
+   * clickable may speak it.
+   *
+   * The answer was in the theater metaphor the whole time: in a dark cinema the seats are not
+   * disabled, they are in the dark. So the elements keep their full strength and the ROW STEPS
+   * UNDER THE ROOM'S DIM - below the .pr-room layer the stage protocol hangs over the page - and
+   * darkens with everything else in one coherent light change. The dim takes no pointer events,
+   * so every control underneath works exactly as it looks like it should: like chrome in a dark
+   * room, waiting. */
+  :global(html[data-stage="playing"]) .tb-slot { z-index: 20; }
   /* icon-only section nav — current cut highlighted */
   .tb-nav {
     display: grid; place-items: center; width: 38px; height: 36px;
@@ -628,16 +637,29 @@ import AuthMount from "./AuthMount.astro";
   // Both or neither — see the props above. When both are set the strip names the SECTIONS; core's
   // default, which names the persona and its handle, is left entirely alone otherwise. Nothing here
   // reproduces that default, which is the point: `.pname` and `.handle` stay core's business.
-  // ── the stage: the row's whole part is to withdraw and come back ──────────────────────────
-  // queries: toolbar during a game · the nav is unreachable while playing
-  // The nav fades by CSS; inert is what CSS cannot do — out of the tab order and the accessibility
-  // tree, so a keyboard or a screen reader is not walking chrome the player left. The game draws
-  // its own pause and fullscreen — see the markup comment above for the decision.
-  document.addEventListener("justai:stage", (e: any) => {
-    const playing = e?.detail?.mode === "playing";
-    document.querySelector(".tb-nav-group")?.toggleAttribute("inert", playing);
-    document.querySelector(".tb-right")?.toggleAttribute("inert", playing);
-  });
+  // ── the stage: the row stays LIVE, and using it pauses the game ───────────────────────────
+  // queries: toolbar during a game · tapping posts while playing · auto pause · data-stage-silent
+  //
+  // The row went inert for one version and the founder unlocked it: every control stays enabled,
+  // and touching ANY of them while a game is playing asks the game to pause first — so a player who
+  // reaches for the posts mid-flight gets a paused gull and the feed, in one tap. The event is not
+  // blocked: the action proceeds naturally while the pause lands beside it (a locked page still
+  // scrolls programmatically, so even the hash navigation works before the unlock).
+  //
+  // Declarative seam, as asked: an element that must NOT pause the game opts out by carrying
+  // `data-stage-silent` — on itself or any ancestor. Everything else pauses by default, because a
+  // rule with a default and an opt-out survives a fleet; a per-element opt-in is the third copy
+  // that forgets.
+  document.querySelector(".toolbar")?.addEventListener(
+    "click",
+    (e) => {
+      if (document.documentElement.dataset.stage !== "playing") return;
+      const hit = (e.target as Element | null)?.closest?.("a, button, select, [role=button]");
+      if (!hit || hit.closest("[data-stage-silent]")) return;
+      document.dispatchEvent(new CustomEvent("justai:pause-request"));
+    },
+    true,
+  );
 
   const bar = document.querySelector(".toolbar") as HTMLElement | null;
   const kt = bar?.dataset.kernelTitle;