confidence slider UI round: global ←/→, fraction positions, color ramp; plan-flank phantom fix

Owner UI round 2026-10-01, three rulings on the slider plus one en-route
bug:

- GLOBAL ←/→, the ↑/↓ pattern: confidence adjusts wherever focus sits
  (window keydown, typing-guarded), no click-in, no focus ring. The
  slider itself takes NO focus — tabIndex -1, mousedown prevented,
  removed from the Tab chain (rows → thinking directly again).
- Position = fraction: the thumb's scale is 0-100 with the rendered
  value the stop's own percent, so 50 sits halfway; onChange snaps to
  the nearest stop (magnet feel while dragged).
- Six-step ramp (owner pick over three bands): 0 red, 30 orange,
  50 yellow (the coin flip), 70 lime, 90 green, 100 emerald — fill AND
  handle wear the stop's color; taller 10px pill bar, custom track/thumb
  (webkit + moz), muted remainder via --muted.
- Plan-flank phantom: gating the marginalia button on a JSX element
  (always truthy) mounted an invisible clickable button in the
  bottom-right whenever a question was pending with no plan.
  planExists() now gates it (pinned in plan-window tests).
This commit is contained in:
amosblomqvist
2026-10-02 00:44:02 +03:00
parent 9b9f6372fa
commit 62cfb8112b
4 changed files with 103 additions and 33 deletions
+14 -1
View File
@@ -1,7 +1,7 @@
import { renderToStaticMarkup } from "react-dom/server";
import { describe, it } from "node:test";
import assert from "node:assert/strict";
import { PlanMarginalia } from "../components/plan-window.tsx";
import { PlanMarginalia, planExists } from "../components/plan-window.tsx";
import { blockLayout, type PopupMessage } from "../components/plan-block.tsx";
import type { PlanTree } from "../src/core/contracts.ts";
@@ -44,6 +44,19 @@ function transcript(tree: PlanTree, taggedNodeId?: string): PopupMessage[] {
];
}
describe("planExists", () => {
it("false without a tree — the phantom-click gate (owner report, 2026-10-01)", () => {
// A JSX element is always truthy; the WRAPPER must gate on real
// presence or an invisible clickable button sits in the flank.
assert.equal(planExists([]), false);
assert.equal(planExists(transcript({ nodes: [], edges: [], version: 0 })), false);
});
it("true once the transcript holds a plan tree", () => {
assert.equal(planExists(transcript(CHAIN)), true);
});
});
describe("PlanMarginalia render", () => {
it("renders nothing until a tree exists", () => {
assert.equal(renderToStaticMarkup(<PlanMarginalia messages={[]} />), "");