@tollbooth-dpyc/web 1.7.0 → 1.7.1

package/dist/react/DebugPanel.d.ts

@@ -14,8 +14,8 @@
  * Touch-first: every control is a real button at least 40px square, nothing
  * hides behind hover, and the page under the bar stays tappable.
  *
- * The panel keeps its own space: beside the fixed bar it renders an in-flow
- * spacer as tall as the bar is right now (collapsed or open, measured with a
+ * While open, the panel keeps its own space: beside the fixed bar it renders
+ * an in-flow spacer as tall as the log is right now (measured with a
  * ResizeObserver) plus the iOS safe-area inset, so the page's last line can
  * always scroll clear of it. Mount it LAST in the app shell so that spacer is
  * the last thing in the page's flow.

package/dist/react/DebugPanel.js

@@ -15,8 +15,8 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
  * Touch-first: every control is a real button at least 40px square, nothing
  * hides behind hover, and the page under the bar stays tappable.
  *
- * The panel keeps its own space: beside the fixed bar it renders an in-flow
- * spacer as tall as the bar is right now (collapsed or open, measured with a
+ * While open, the panel keeps its own space: beside the fixed bar it renders
+ * an in-flow spacer as tall as the log is right now (measured with a
  * ResizeObserver) plus the iOS safe-area inset, so the page's last line can
  * always scroll clear of it. Mount it LAST in the app shell so that spacer is
  * the last thing in the page's flow.
@@ -25,7 +25,7 @@ import { useEffect, useRef, useState } from "react";
 import { onProofExpired } from "../client.js";
 import { captureGlobalErrors, clearDebug, debugLogText, debugPush, debugSeverity, } from "../debugLog.js";
 import { readStored, writeStored } from "../storage.js";
-import { debugSpacerHeight, debugSpacerPx } from "./debugSpacer.js";
+import { debugSpacerPx, debugSpacerRoom } from "./debugSpacer.js";
 import { useDebugLog } from "./useDebugLog.js";
 const OPEN_KEY = "debug-open";
 const TYPE_INK = {
@@ -100,7 +100,7 @@ export default function DebugPanel({ title = "Debug", defaultOpen = false, captu
         : notices > 0
             ? "bg-[var(--tb-notice-bg)] text-[var(--tb-notice-ink)] border-[var(--tb-notice-line)]"
             : "bg-[var(--tb-surface-2)] text-[var(--tb-ink)] border-[var(--tb-line)]";
-    return (_jsxs(_Fragment, { children: [_jsx("div", { "aria-hidden": "true", "data-tb-debug-spacer": "", style: { height: debugSpacerHeight(barHeight), flexShrink: 0 } }), _jsxs("div", { ref: barRef, className: "pointer-events-none fixed inset-x-0 bottom-0 z-50 flex flex-col items-end", children: [_jsxs("div", { className: "pointer-events-auto flex flex-wrap justify-end gap-1 pr-3", children: [open && (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", onClick: copy, className: plainTab, "aria-label": "Copy the whole log", children: copied === "ok" ? "Copied" : copied === "failed" ? "Copy failed" : "Copy" }), _jsx("button", { type: "button", onClick: clearDebug, className: plainTab, children: "Clear" })] })), _jsxs("button", { type: "button", onClick: toggle, "aria-expanded": open, className: `${tab} ${toggleTone}`, children: [open ? "Hide" : title, " (", log.length, failures > 0 ? ` · ${failures} err` : "", notices > 0 ? ` · ${notices} notice` : "", ")"] })] }), open && (_jsxs("div", { className: "pointer-events-auto max-h-[40vh] w-full overflow-y-auto border-t border-[var(--tb-line)] bg-[var(--tb-surface)] p-3 font-mono text-xs text-[var(--tb-ink)]", children: [children && _jsx("div", { className: "mb-2 border-b border-[var(--tb-line)] pb-2 font-sans", children: children }), log.length === 0 && _jsx("div", { className: "text-[var(--tb-muted)]", children: "No MCP activity yet." }), log.map((entry, i) => {
+    return (_jsxs(_Fragment, { children: [_jsx("div", { "aria-hidden": "true", "data-tb-debug-spacer": "", style: { height: debugSpacerRoom(open, barHeight), flexShrink: 0 } }), _jsxs("div", { ref: barRef, className: "pointer-events-none fixed inset-x-0 bottom-0 z-50 flex flex-col items-end", children: [_jsxs("div", { className: "pointer-events-auto flex flex-wrap justify-end gap-1 pr-3", children: [open && (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", onClick: copy, className: plainTab, "aria-label": "Copy the whole log", children: copied === "ok" ? "Copied" : copied === "failed" ? "Copy failed" : "Copy" }), _jsx("button", { type: "button", onClick: clearDebug, className: plainTab, children: "Clear" })] })), _jsxs("button", { type: "button", onClick: toggle, "aria-expanded": open, className: `${tab} ${toggleTone}`, children: [open ? "Hide" : title, " (", log.length, failures > 0 ? ` · ${failures} err` : "", notices > 0 ? ` · ${notices} notice` : "", ")"] })] }), open && (_jsxs("div", { className: "pointer-events-auto max-h-[40vh] w-full overflow-y-auto border-t border-[var(--tb-line)] bg-[var(--tb-surface)] p-3 font-mono text-xs text-[var(--tb-ink)]", children: [children && _jsx("div", { className: "mb-2 border-b border-[var(--tb-line)] pb-2 font-sans", children: children }), log.length === 0 && _jsx("div", { className: "text-[var(--tb-muted)]", children: "No MCP activity yet." }), log.map((entry, i) => {
                                 const sev = debugSeverity(entry);
                                 const flag = sev === "ok" ? null : FLAGGED[sev];
                                 return (_jsxs("div", { className: `-mx-1 flex gap-2 rounded px-1 py-0.5 ${flag?.row ?? ""}`, children: [_jsx("span", { className: "shrink-0 text-[var(--tb-muted)]", children: entry.ts }), _jsxs("span", { className: `w-14 shrink-0 ${flag?.ink ?? TYPE_INK[entry.type]}`, children: [sev === "notice" ? "notice" : entry.type, sev === "failure" && entry.type !== "error" ? " !" : ""] }), _jsx("span", { className: `min-w-0 break-all ${flag?.ink ?? ""}`, children: entry.message })] }, log.length - i));

package/dist/react/debugSpacer.d.ts

@@ -1,11 +1,13 @@
 /**
- * The room the DebugPanel keeps for itself.
+ * The room the DebugPanel keeps for itself — only while its log is open.
  *
- * The panel is fixed to the bottom of the viewport, so on its own it would sit
- * over whatever the page puts last — on a phone, a loading quote or a Save
- * button. Beside it the panel renders an in-flow spacer as tall as the panel is
- * right now (the collapsed tab, or the open log), plus the iOS home-indicator
- * inset, so the page can always scroll its last line clear of the bar.
+ * The panel is fixed to the bottom of the viewport. Collapsed, it is one small
+ * tab in the corner and overlays the page: an in-flow spacer for it stole a
+ * whole row from every screen (owner, 2026-09-27: "we want an overlay and not
+ * a row stealer"). Open, the log is tall and would hide whatever the page puts
+ * last — a Save button, a loading quote — so then, and only then, the panel
+ * renders an in-flow spacer as tall as it is, plus the iOS home-indicator
+ * inset, so the page can scroll its last line clear.
  */
 /** The collapsed tab: one `min-h-10` (2.5rem) button. Used until measured. */
 export declare const DEBUG_BAR_PX = 40;
@@ -13,3 +15,5 @@ export declare const DEBUG_BAR_PX = 40;
 export declare function debugSpacerPx(measured: number | null | undefined): number;
 /** The spacer's CSS height: the panel's height plus the safe-area inset. */
 export declare function debugSpacerHeight(measured: number | null | undefined): string;
+/** What the spacer takes: nothing while the panel is collapsed, its height while open. */
+export declare function debugSpacerRoom(open: boolean, measured: number | null | undefined): string;

package/dist/react/debugSpacer.js

@@ -1,11 +1,13 @@
 /**
- * The room the DebugPanel keeps for itself.
+ * The room the DebugPanel keeps for itself — only while its log is open.
  *
- * The panel is fixed to the bottom of the viewport, so on its own it would sit
- * over whatever the page puts last — on a phone, a loading quote or a Save
- * button. Beside it the panel renders an in-flow spacer as tall as the panel is
- * right now (the collapsed tab, or the open log), plus the iOS home-indicator
- * inset, so the page can always scroll its last line clear of the bar.
+ * The panel is fixed to the bottom of the viewport. Collapsed, it is one small
+ * tab in the corner and overlays the page: an in-flow spacer for it stole a
+ * whole row from every screen (owner, 2026-09-27: "we want an overlay and not
+ * a row stealer"). Open, the log is tall and would hide whatever the page puts
+ * last — a Save button, a loading quote — so then, and only then, the panel
+ * renders an in-flow spacer as tall as it is, plus the iOS home-indicator
+ * inset, so the page can scroll its last line clear.
  */
 /** The collapsed tab: one `min-h-10` (2.5rem) button. Used until measured. */
 export const DEBUG_BAR_PX = 40;
@@ -19,3 +21,7 @@ export function debugSpacerPx(measured) {
 export function debugSpacerHeight(measured) {
     return `calc(${debugSpacerPx(measured)}px + env(safe-area-inset-bottom, 0px))`;
 }
+/** What the spacer takes: nothing while the panel is collapsed, its height while open. */
+export function debugSpacerRoom(open, measured) {
+    return open ? debugSpacerHeight(measured) : "0px";
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tollbooth-dpyc/web",
-  "version": "1.7.0",
+  "version": "1.7.1",
   "description": "Shared browser SDK for Tollbooth DPYC operator front ends: npub sign-in, proofs, MCP client, profile and wallet",
   "license": "Apache-2.0",
   "author": "Lonnie VanZandt",