@celestia-island/hikari 0.40.33 → 0.40.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@celestia-island/hikari",
-  "version": "0.40.33",
+  "version": "0.40.34",
   "private": false,
   "type": "module",
   "description": "Hikari Vue 3 component library — production-grade UI components based on shittim-chest design system",

package/src/components/HkJsonTree.scss

@@ -29,6 +29,21 @@
   }
 }
 
+/* ONE SCROLLBAR PER WINDOW (2026-09-08 audit): inside a window surface's
+ * own scroller the bounded tree cap lit a second scrollbar under the
+ * window's — the window's scrollbar is the only one there and the tree
+ * grows with its content. Pages and standalone cards (the error landing,
+ * chat tool blocks outside windows) keep the bounded viewport above.
+ * The host's deferred overlay pass self-hides its rails once the
+ * content fits, so no attach-side change is needed. */
+.hk-modal-body-scroll .s-tool-json-tree,
+.hk-select-sheet-list .s-tool-json-tree,
+.hk-select-popout .s-tool-json-tree,
+.hk-popover-panel .s-tool-json-tree,
+.hk-drawer-body .s-tool-json-tree {
+  max-height: none;
+}
+
 .s-jt-row {
   /* Baseline alignment keeps the small type hints (boolean/number/string)
      on the value's text baseline instead of floating above it. */

package/src/components/HkProtocolModal.scss

@@ -1,15 +1,7 @@
+/* ONE SCROLLBAR PER WINDOW (2026-09-08 audit): the body grows with its
+ * content and the HkModal body scroller is THE scrollbar. The old
+ * `bodyHeight`-driven nested scroll region (with its own overlay chrome)
+ * was removed as dead API — no consumer in the family ever passed it. */
 .s-protocol-modal {
   position: relative;
 }
-
-
-/* With `bodyHeight` set the body becomes its own scroll region (nested
- * inside HkModal's body scroller) — overlay chrome only. */
-.s-protocol-modal {
-  overflow-y: auto;
-  scrollbar-width: none;
-
-  &::-webkit-scrollbar {
-    display: none;
-  }
-}

package/src/components/HkProtocolModal.tsx

@@ -1,4 +1,4 @@
-import { computed, defineComponent, onBeforeUnmount, ref, watch, type PropType } from "vue";
+import { computed, defineComponent, type PropType } from "vue";
 import {
   HMarkdownRenderer,
   HModal,
@@ -9,7 +9,6 @@ import {
 } from "@celestia-island/hikari";
 
 import { useI18n } from "../i18n/context";
-import { attachOverlayScrollbars, type OverlayScrollbarHandle } from "../composables/useOverlayScrollbar";
 
 import "./HkProtocolModal.scss";
 
@@ -21,6 +20,12 @@ import "./HkProtocolModal.scss";
  * a Decline/Accept footer. `accept`/`decline` are the caller's commit
  * actions; closing (overlay click / ESC / X) only emits `update:modelValue`
  * so the caller can decide whether close === decline.
+ *
+ * ONE SCROLLBAR PER WINDOW: the body grows with its content and the
+ * HkModal body scroller is THE scrollbar. The old `bodyHeight` prop
+ * (a height-capped scroll region nested inside the modal's own scroller —
+ * the exact double-scroll this library eliminates) was removed as dead
+ * API: no consumer in the family ever passed it.
  */
 export const HkProtocolModal = defineComponent({
   name: "HkProtocolModal",
@@ -37,8 +42,6 @@ export const HkProtocolModal = defineComponent({
     /** Allow dismissing without a decision (overlay/ESC/X). Default true. */
     closable: { type: Boolean, default: true },
     width: { type: String as PropType<ModalWidth>, default: "48rem" },
-    /** Cap the scroll body height (e.g. "60vh"). */
-    bodyHeight: { type: String, default: undefined },
   },
   emits: {
     "update:modelValue": (_v: boolean) => true,
@@ -69,32 +72,6 @@ export const HkProtocolModal = defineComponent({
       },
     ]);
 
-    // ── overlay scrollbar (shared chrome) ─────────────────────────
-    // With `bodyHeight` set the body becomes a height-capped scroll
-    // region NESTED inside HkModal's overlay-equipped body scroller —
-    // without the overlay it would be a surviving native bar (the exact
-    // double-scroll this library eliminates). Attach on mount, re-sync
-    // when the cap flips, detach on unmount.
-    const bodyRef = ref<HTMLElement | null>(null);
-    let bodyScrollbar: OverlayScrollbarHandle | null = null;
-    function syncBodyScrollbar(): void {
-      if (props.bodyHeight && bodyRef.value) {
-        if (!bodyScrollbar) bodyScrollbar = attachOverlayScrollbars(bodyRef.value);
-      } else {
-        bodyScrollbar?.detach();
-        bodyScrollbar = null;
-      }
-    }
-    function bindBodyRef(el: unknown): void {
-      bodyRef.value = (el as HTMLElement) ?? null;
-      syncBodyScrollbar();
-    }
-    watch(() => props.bodyHeight, () => syncBodyScrollbar());
-    onBeforeUnmount(() => {
-      bodyScrollbar?.detach();
-      bodyScrollbar = null;
-    });
-
     return () => (
       <HModal
         modelValue={props.modelValue}
@@ -104,11 +81,7 @@ export const HkProtocolModal = defineComponent({
         closable={props.closable}
         footerActions={footerActions.value}
       >
-        <div
-          ref={bindBodyRef}
-          class="s-protocol-modal"
-          style={props.bodyHeight ? { maxHeight: props.bodyHeight } : undefined}
-        >
+        <div class="s-protocol-modal">
           <HMarkdownRenderer content={props.content} />
         </div>
       </HModal>

package/src/components/HkToolBlock.scss

@@ -114,6 +114,22 @@
   }
 }
 
+/* ONE SCROLLBAR PER WINDOW (2026-09-08 audit, HkJsonTree tool blocks and
+   code panes): inside a window surface's own scroller the bounded pane
+   cap lit a SECOND scrollbar under the window's — one per pane in pane
+   lists like the chest todo-log modal. There the window's scrollbar is
+   the only one and the pane grows with its content. Chat message cards
+   and pages are NOT window surfaces: the bounded viewport above stays.
+   (The panes' overlay rails self-hide once the content fits, so the
+   deferred attach pass needs no changes.) */
+.hk-modal-body-scroll .s-tool-code,
+.hk-select-sheet-list .s-tool-code,
+.hk-select-popout .s-tool-code,
+.hk-popover-panel .s-tool-code,
+.hk-drawer-body .s-tool-code {
+  max-height: none;
+}
+
 .s-tool-result {
   border-left: 2px solid rgb(var(--color-success) / 40%);
   padding-left: var(--space-8, 0.5rem);
@@ -167,6 +183,15 @@
   }
 }
 
+/* Window-surface twin of the .s-tool-code rule above. */
+.hk-modal-body-scroll .s-tool-code-block,
+.hk-select-sheet-list .s-tool-code-block,
+.hk-select-popout .s-tool-code-block,
+.hk-popover-panel .s-tool-code-block,
+.hk-drawer-body .s-tool-code-block {
+  max-height: none;
+}
+
 .s-tool-code-table {
   border-collapse: collapse;
   width: 100%;

package/src/components/HkToolBlock.windowScroll.contract.test.ts

@@ -0,0 +1,93 @@
+/**
+ * Source contract: ONE SCROLLBAR PER WINDOW — tool panes (2026-09-08
+ * audit follow-up). The tool block's code panes and the shared JSON tree
+ * keep a bounded widget viewport in chat cards and on pages (the exempt
+ * content-widget class, like markdown code blocks), but INSIDE a window
+ * surface's own scroller (modal body, select sheet, popout, popover
+ * sheet/panel, drawer body) that cap lit a second scrollbar under the
+ * window's — one per pane in pane lists like the chest todo-log modal.
+ * There the window's scrollbar is the only one and the pane grows with
+ * its content.
+ */
+import { describe, expect, it } from "vitest";
+import { readFileSync } from "node:fs";
+import { dirname, join } from "node:path";
+import { fileURLToPath } from "node:url";
+
+const here = dirname(fileURLToPath(import.meta.url));
+const toolScss = readFileSync(join(here, "HkToolBlock.scss"), "utf-8");
+const treeScss = readFileSync(join(here, "HkJsonTree.scss"), "utf-8");
+const toolTsx = readFileSync(join(here, "HkToolBlock.tsx"), "utf-8");
+
+/** Window-surface scrollers — the ONE-scrollbar owners. */
+const SCROLLERS = [
+  ".hk-modal-body-scroll",
+  ".hk-select-sheet-list",
+  ".hk-select-popout",
+  ".hk-popover-panel",
+  ".hk-drawer-body",
+] as const;
+
+const PANES = [".s-tool-code", ".s-tool-code-block", ".s-tool-json-tree"] as const;
+
+/** Extract ONE balanced `{...}` declaration block following `selector`
+ *  (a naive `[^}]*` would stop at the first nested `}` — see the
+ *  HkAffixPicker single-scroll contract for the established pattern). */
+function cssBlock(src: string, selector: string): string {
+  const at = src.indexOf(selector);
+  if (at < 0) return "";
+  const open = src.indexOf("{", at);
+  if (open < 0) return "";
+  let depth = 0;
+  for (let i = open; i < src.length; i++) {
+    if (src[i] === "{") depth++;
+    else if (src[i] === "}") {
+      depth--;
+      if (depth === 0) return src.slice(open, i + 1);
+    }
+  }
+  return "";
+}
+
+describe("tool pane single-scrollbar-per-window contract", () => {
+  it("keeps the bounded widget viewport outside windows", () => {
+    expect(cssBlock(toolScss, ".s-tool-code ")).toContain("max-height: 240px");
+    expect(cssBlock(toolScss, ".s-tool-code-block ")).toContain("max-height: 240px");
+    expect(cssBlock(treeScss, ".s-tool-json-tree ")).toContain("max-height: 320px");
+  });
+
+  it("drops the cap inside every window surface scroller", () => {
+    for (const pane of PANES) {
+      for (const scroller of SCROLLERS) {
+        // The uncap rule lives next to the pane's own file: tool panes in
+        // HkToolBlock.scss, the tree in HkJsonTree.scss. Search BOTH — a
+        // rule moved between the files must not fail the pin, a rule
+        // deleted anywhere must fail it.
+        const body =
+          cssBlock(toolScss, `${scroller} ${pane}`) ||
+          cssBlock(treeScss, `${scroller} ${pane}`);
+        expect(body, `${scroller} ${pane} uncap rule exists`).toBeTruthy();
+        expect(body, `${scroller} ${pane} uncaps via max-height: none`).toContain(
+          "max-height: none",
+        );
+      }
+    }
+  });
+
+  it("no window-scroller context ever re-caps a pane with a length", () => {
+    for (const scss of [toolScss, treeScss]) {
+      for (const scroller of SCROLLERS) {
+        // Any scroller-descendant rule for a pane carrying a px/vh/rem
+        // max-height would reintroduce the nested scrollbar.
+        const re = new RegExp(
+          `${scroller.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")} [^{]*\\{[^}]*max-height:\\s*(?!none)[\\d.]`,
+        );
+        expect(scss.match(re), `${scroller} descendant px cap`).toBeNull();
+      }
+    }
+  });
+
+  it("the deferred overlay pass still targets the three panes (rails self-hide when uncapped)", () => {
+    expect(toolTsx).toContain('".s-tool-code, .s-tool-code-block, .s-tool-json-tree"');
+  });
+});