@promptctl/cc-candybar 1.8.2 → 1.8.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@promptctl/cc-candybar",
-  "version": "1.8.2",
+  "version": "1.8.3",
   "description": "Statusline renderer for Claude Code — a JSON5-configurable DSL with daemon-cached data sources, byte-clean palette-aware composition, and OSC8 click verbs.",
   "type": "module",
   "main": "./dist/index.mjs",
@@ -91,10 +91,10 @@
     "mobx": "^6.15.0"
   },
   "optionalDependencies": {
-    "@promptctl/cc-candybar-darwin-arm64": "1.8.2",
-    "@promptctl/cc-candybar-darwin-x64": "1.8.2",
-    "@promptctl/cc-candybar-linux-x64": "1.8.2",
-    "@promptctl/cc-candybar-linux-arm64": "1.8.2"
+    "@promptctl/cc-candybar-darwin-arm64": "1.8.3",
+    "@promptctl/cc-candybar-darwin-x64": "1.8.3",
+    "@promptctl/cc-candybar-linux-x64": "1.8.3",
+    "@promptctl/cc-candybar-linux-arm64": "1.8.3"
   },
   "pnpm": {
     "supportedArchitectures": {

package/src/config/default-dsl-config.ts

@@ -496,10 +496,12 @@ export const DEFAULT_DSL_CONFIG = {
     // and the render's read are one value. Empty default ⇒ the daemon's
     // "powerline" floor is in effect and styleControl shows "(default)".
     activeStyle: { kind: "state", key: "style", default: "" },
-    // The style menu's page cursor: −1 closed / 0..N open, mirroring how a theme
-    // picker's page key gates its reveal row. The stylePage action declares the
-    // int gate; this var reads it back for the reveal `when`.
-    stylePage: { kind: "state", key: "style-page", default: "-1" },
+    // The style picker's page index. Open/closed is the synthesized menus.* key
+    // the styleControl's {{ menu }} owns — NOT this var, which is purely the page
+    // the picker paginates by (default page 0; the disclosure resets it to 0 on
+    // every toggle, so a reopened menu never lands on a stale page). The stylePage
+    // action below declares the int gate this var reads back.
+    stylePage: { kind: "state", key: "style-page", default: "0" },
   },
 
   // ─── Segments ──────────────────────────────────────────────────────────────
@@ -736,26 +738,22 @@ export const DEFAULT_DSL_CONFIG = {
         " .metrics.sessionDuration .metrics.messageCount" +
         " .metrics.linesAdded .metrics.linesRemoved }}",
     },
-    // Style control — the powerline-shape switcher's trigger. [LAW:locality-or-
-    // seam] The ✦ glyph + current-style label is the REPRESENTATION; the
-    // `openStyleMenu` action is the BEHAVIOR; the name is the seam. Shows the
-    // active shape (or "(default)" when unset) and a ▸ that opens the picker
-    // row. [LAW:dataflow-not-control-flow] No display state from the provider —
-    // the label is the one "style" value the click writes and the render reads.
+    // Style control — the powerline-shape switcher. A self-contained {{ menu }}
+    // disclosure: the ✦ glyph + current-style label is the REPRESENTATION, and the
+    // ▸/▾ disclosure (whose identity is DERIVED from this segment + the applyStyle
+    // action, see menu-keys.ts) toggles the picker body, which DROPS full-width
+    // onto the line below this row when open. [LAW:one-type-per-behavior] "a menu
+    // that opens and closes" is one behavior the substrate already expresses — no
+    // bespoke open-action + page-cursor-as-open-state + when-gated reveal row.
+    // paged omitted ⇒ false ⇒ one full-width page (the 3 powerline shapes are a
+    // small domain; FlexStrip soft-wraps if needed). closeOnPick omitted ⇒ false
+    // ⇒ stay-open, so shapes can be tried in a row; the ▾ collapses.
+    // [LAW:dataflow-not-control-flow] No display state from the provider — the
+    // label is the one "style" value the click writes and the render reads.
     styleControl: {
       template:
         "✦ {{ if .activeStyle }}{{ .activeStyle }}{{ else }}(default){{ end }} " +
-        '{{ action "openStyleMenu" "▸" }}',
-      bg: "surface",
-      fg: "foreground",
-    },
-    // The expanded style picker: one full-width page (paged=false) over the
-    // `applyStyle` option domain — the 3 powerline shapes. closeOnPick defaults
-    // false (omitted here), so a pick reshapes the bar live and LEAVES THE ROW
-    // OPEN — shapes can be tried in a row; the ✕ affordance closes. The active
-    // shape is marked by the picker helper.
-    stylePicker: {
-      template: '{{ picker "applyStyle" "stylePage" }}',
+        '{{ menu "applyStyle" "stylePage" }}',
       bg: "surface",
       fg: "foreground",
     },
@@ -764,10 +762,11 @@ export const DEFAULT_DSL_CONFIG = {
   // Default layout — the canonical LayoutNode tree (`satisfies DslConfig`
   // requires the lowered form here; the terse Option-A `{ h/v/seg }` grammar is
   // the loader's authoring surface for user JSON, not this typed literal).
-  // [LAW:dataflow-not-control-flow] Two rows: an always-on control row, and a
-  // picker reveal row that EXISTS only while the style menu cursor is ≥ 0 — the
-  // row's presence is a value test on stylePage, not a branch in render code.
-  // The picker itself draws the ✕/←/→ affordances from the page + term width.
+  // [LAW:dataflow-not-control-flow] One always-on control row. The styleControl's
+  // {{ menu }} disclosure drops its picker body onto the line directly below this
+  // row when open — openness is the value of the derived menus.* key, NOT a when-
+  // gated reveal row. The picker draws the ✕/←/→ affordances from the page + term
+  // width; the vertical container stacks the dropped body under row 0.
   root: {
     kind: "container",
     direction: "vertical",
@@ -786,11 +785,6 @@ export const DEFAULT_DSL_CONFIG = {
           { kind: "segment", name: "styleControl" },
         ],
       },
-      {
-        kind: "segment",
-        name: "stylePicker",
-        when: "{{ ge (int .stylePage) 0 }}",
-      },
     ],
   },
 
@@ -814,14 +808,16 @@ export const DEFAULT_DSL_CONFIG = {
     openProject: { open: "{{ .project_dir }}" },
     openTranscript: { open: "{{ .transcript_path }}" },
 
-    // [LAW:locality-or-seam] The style picker's behaviors, decoupled by NAME
-    // from styleControl/stylePicker above. Three declarations, all gated by
-    // derivation (deriveActionValidators): openStyleMenu/stylePage write the
-    // page cursor (a literal page-open subsumed by the int gate); applyStyle
-    // writes the chosen shape, gated to the STRIP_STYLES allow-list because its
-    // value source is `from: "styles"`. The rendered click and the wire gate
-    // share that one source — a template cannot smuggle an un-gated style write.
-    openStyleMenu: { set: "style-page", to: "0" },
+    // [LAW:locality-or-seam] The style menu's behaviors, decoupled by NAME from the
+    // styleControl {{ menu }} above. The disclosure's open-state toggle + its
+    // backing state var are SYNTHESIZED by the menu pass (under the reserved
+    // menus.* namespace) — no hand-authored open/close action. These two are the
+    // picker body's effects, both gated by derivation (deriveActionValidators):
+    // applyStyle writes the chosen shape, gated to the STRIP_STYLES allow-list
+    // because its value source is `from: "styles"`; stylePage is the page cursor's
+    // unbounded int gate (←/→ navigation + the disclosure's page-0 reset). The
+    // rendered click and the wire gate share that one source — a template cannot
+    // smuggle an un-gated style write.
     applyStyle: { set: "style", from: "styles" },
     stylePage: { set: "style-page", int: true },
   },

package/src/render/menu.ts

@@ -1,10 +1,10 @@
 // [LAW:locality-or-seam] The runtime half of the `{{ menu }}` seam — sibling to
 // `{{ action }}`/`{{ picker }}`. A menu is a self-contained disclosure: an inline
 // glyph that toggles open/closed, and (when open) its body — a picker grid —
-// that DROPS onto the line(s) below the enclosing row. It composes the two
-// existing helpers, adding only the disclosure: the glyph is realized through the
-// synthesized cycle action (`renderAction`), the body through the one picker
-// renderer (`renderPicker`).
+// that DROPS onto the line(s) below the enclosing row. The body is the one picker
+// renderer (`renderPicker`); the glyph is a coupled set-state the menu composes
+// directly (like the picker's closeOnPick) — it toggles the open-state AND resets
+// the page cursor in one atomic batch, gated by the synthesized cycle action.
 //
 // [LAW:effects-at-boundaries] The helper is a PURE function of its inputs (the
 // walk-published placement + the live store): it computes the inline glyph and,
@@ -36,13 +36,14 @@
 import type { RichText } from "@promptctl/rich-js";
 import type { FuncMap } from "@promptctl/go-template-js";
 import {
+  MENU_CLOSED,
   MENU_GLYPH_CLOSED,
   MENU_GLYPH_OPEN,
-  menuActionName,
   menuMember,
   menuStateKey,
 } from "../config/menu-keys.js";
-import { readVar, renderAction, type ActionRuntime } from "./action.js";
+import { effectsUrl, VERB_SET_STATE } from "../click/wire.js";
+import { linkFragment, readVar, type ActionRuntime } from "./action.js";
 import { renderPicker } from "./picker.js";
 
 // [LAW:types-are-the-program] One menu placement: the structural fact a context-
@@ -82,6 +83,22 @@ export function collectMenuDrops(
   return fragments.flatMap((f) => (f as GlyphWithDrop)[MENU_DROP] ?? []);
 }
 
+// [LAW:single-enforcer] The page cursor's SessionState key, resolved from the page
+// ACTION name the menu binds (its second arg). renderPicker proves pageName is a
+// set-int when it builds the body, but the disclosure must reset the page even
+// while CLOSED (no body is built then), so it resolves the key here too — the SAME
+// set-int action, one source. A non-int page arg is an author error surfaced
+// loudly (composeWithDiagnostics shows it), never a silent skipped reset.
+function pageKeyOf(action: ActionRuntime, pageName: string): string {
+  const page = action.compiled.get(pageName);
+  if (!page || page.kind !== "set-int") {
+    throw new Error(
+      `{{ menu }} page action "${pageName}" must be an int action ({ set, int: true })`,
+    );
+  }
+  return page.key;
+}
+
 // Realize a `{{ menu }}` against the live placement + state: return its inline
 // glyph, carrying the (open) body as out-of-band metadata for the boundary.
 function renderMenu(
@@ -106,25 +123,51 @@ function renderMenu(
   const stateKey = menuStateKey(placement.segName, applyName, sharedKey);
   const member = menuMember(applyName);
 
-  // [LAW:single-enforcer] The disclosure glyph IS the synthesized cycle action —
-  // displays bound one-per-member (closed ▸ / open ▾), the current member's glyph
-  // renders, the click writes the successor. Same toggle as group sugar.
-  const glyph = renderAction(
-    menuActionName(stateKey, member),
-    [MENU_GLYPH_CLOSED, MENU_GLYPH_OPEN],
-    action,
-  );
-
   // [LAW:dataflow-not-control-flow] Open ⇔ the state key holds this menu's member.
-  // The body is a VALUE whose length carries open/closed — `[body]` open, `[]`
-  // closed — attached to the glyph the helper returns. No shared mutation: the
-  // boundary reads this metadata to place the body. (renderPicker is pure, so it
-  // is only built when open — skipping wasted computation, gating no effect.)
+  // A foreign value (an accordion sibling's member under a shared key) reads as
+  // closed here — exactly the binary [closed, member] cycle the synthesized action
+  // gates. This ONE read drives both the glyph and the body, so what the glyph
+  // promises and what drops below cannot disagree.
   const open = readVar(action.store, stateKey) === member;
-  const bodyLines = open
+
+  // [LAW:one-source-of-truth] / [LAW:locality-or-seam] The disclosure click is ONE
+  // atomic set-state that keeps the two split keys coherent: it toggles the open-
+  // state (the binary cycle — successor is closed when open, the member when
+  // closed) AND resets the page cursor to page 0, in one batch. So a reopened menu
+  // is never stranded on a stale page left by ←/→ before the last close. This
+  // mirrors the picker's closeOnPick page-reset fold: the picker builds its set-
+  // state URLs directly (not via renderAction) so it can couple two writes; the
+  // menu — the one part that knows BOTH the open-state key and the page key
+  // [LAW:decomposition] — does the same. The synthesized cycle action stays the
+  // GATE source (deriveActionValidators); both keys are independently gated, so the
+  // coupled batch passes the same wire gate every click does [LAW:single-enforcer].
+  const sessionId = readVar(action.store, "session.id");
+  const successor = open ? MENU_CLOSED : member;
+  const glyph = linkFragment(
+    open ? MENU_GLYPH_OPEN : MENU_GLYPH_CLOSED,
+    effectsUrl([
+      {
+        verb: VERB_SET_STATE,
+        args: [
+          sessionId,
+          stateKey,
+          successor,
+          pageKeyOf(action, pageName),
+          "0",
+        ],
+      },
+    ]),
+    false,
+  ) as GlyphWithDrop;
+
+  // [LAW:effects-at-boundaries] The body is a VALUE whose length carries open/
+  // closed — `[body]` open, `[]` closed — attached to the glyph the helper returns.
+  // No shared mutation: the boundary reads this metadata to place the body.
+  // (renderPicker is pure, so it is only built when open — skipping wasted
+  // computation, gating no effect.)
+  glyph[MENU_DROP] = open
     ? [renderPicker(applyName, pageName, closeOnPick, paged, action)]
     : [];
-  (glyph as GlyphWithDrop)[MENU_DROP] = bodyLines;
   return glyph;
 }