@lightworkai.official/debug-capture 0.19.10 → 0.19.12

package/dist/live.d.ts

@@ -9,6 +9,18 @@ export interface RingingCall {
     ringUntil: string;
     side?: string | null;
 }
+/**
+ * The support host restarting (a deploy — it says 1012 as it stops): every widget on every page of every host app lost
+ * its socket in the same instant, and each came back after exactly 2 s — the whole fleet's tickets, sign-ins and
+ * sockets on the support host's one thread in the same second. Back somewhere in this window instead, at random.
+ */
+export declare const RESTART_SPREAD_MS = 15000;
+/**
+ * How long before trying again — each step ×0.5–1.5, never the same moment as every other widget's (the desk's own tabs
+ * do the same) — `restart`: the host said it restarts (1012); `slow`:
+ * refused for now (429), or nobody signed in yet; else the next step of the ladder. Pure but for the dice, for the tests.
+ */
+export declare function retryWait(how: "restart" | "slow" | null, attempt: number, roll?: () => number): number;
 /** `wss://support.example/api/presence/ws?t=…` — the support host's scheme, the socket's own path. Pure, for the tests. */
 export declare function liveSocketUrl(host: string, ticket: string): string;
 /** Where the card sends them: their request, with the call — the support host rings it there. Pure, for the tests. */

package/dist/ui/bubblePlace.d.ts

@@ -23,7 +23,8 @@
  *   STAY_MARGIN does not move it, so it does not jitter as the page settles.
 
  *   A PAGE'S OWN PLACE. The desk's rules (ปุ่มแชท › ตำแหน่งปุ่ม): pages whose path starts so — hidden there, or
- *   started in a corner at a height. The most specific rule wins; a person who moved it keeps their place.
+ *   started on a side at x in from its edge and y up from the bottom, at its own z-index (0.19.11). The most specific
+ *   rule wins; a person who moved it keeps their place (the rule's z-index still holds).
  *
  * The arithmetic is pure (bubblePlace.test.ts); `scanColumns` reads the page.
  */
@@ -80,6 +81,10 @@ export interface PlaceRule {
     show: "hide" | Side;
     /** Up from the bottom, px. */
     y: number;
+    /** In from its side's edge, px (0.19.11) — the host's own inset when the desk does not say. */
+    x?: number;
+    /** Its z-index on the page (0.19.11), the panel one above — null or absent: on top of everything. */
+    z?: number | null;
 }
 /** A rule's path as a test of a page's path: from its start, ending at a segment's end. Pure; null when malformed. */
 export declare function pathTest(pattern: string): RegExp | null;

package/dist/ui/chatBubble.d.ts

@@ -24,11 +24,17 @@ export interface BubbleSpot {
     /** Up from the bottom, px — to the bubble's lower edge. */
     y: number;
 }
-/** Let go at (px, py), its centre: the nearer side, the height it was dropped at — inside the window. Pure. */
+/**
+ * Let go at (px, py), its centre: just there (0.19.11, card f34152d3 — "move ได้เฉพาะ top/bottom left กับ top/bottom
+ * right อยากได้แบบ free hand"), measured from the nearer side so it keeps its place from that edge as the window
+ * changes; within SNAP of the edge it lines up at the inset. Inside the window. Pure.
+ */
 export declare function settleBubble(px: number, py: number, view: {
     w: number;
     h: number;
 }, inset: number, s?: number): BubbleSpot;
+/** In from its edge, keeping the whole bubble on screen. Pure. */
+export declare function clampBubbleX(x: number, viewW: number, s?: number): number;
 /** A height that keeps the whole bubble on screen. Pure. */
 export declare function clampBubbleY(y: number, viewH: number, s?: number): number;
 /** How far the call's card rises to clear the bubble: only a bubble on its side, low enough to meet it. Pure. */
@@ -42,6 +48,11 @@ export declare function anchorPanel(spot: BubbleSpot, viewH: number, s?: number)
     top?: number;
     height: number;
 };
+/**
+ * The panel by the bubble, in from the same edge as the bubble — a bubble far in from it (0.19.11) still has its whole
+ * panel on screen. Pure.
+ */
+export declare function panelInset(x: number, viewW: number): number;
 /** A dragged panel's top-left, inside the window by the margin. Pure. */
 export declare function clampPanel(p: {
     x: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lightworkai.official/debug-capture",
-  "version": "0.19.10",
+  "version": "0.19.12",
   "description": "Report-a-problem widget: rolling network/console/action capture, optional rrweb session replay, annotated screenshot, and submission to a Lightwork Support host",
   "type": "module",
   "module": "./dist/index.mjs",

package/src/live.ts

@@ -42,6 +42,22 @@ export interface RingingCall {
 }
 
 const RETRY_MS = [2000, 5000, 15_000, 30_000, 60_000];
+/**
+ * The support host restarting (a deploy — it says 1012 as it stops): every widget on every page of every host app lost
+ * its socket in the same instant, and each came back after exactly 2 s — the whole fleet's tickets, sign-ins and
+ * sockets on the support host's one thread in the same second. Back somewhere in this window instead, at random.
+ */
+export const RESTART_SPREAD_MS = 15_000;
+/**
+ * How long before trying again — each step ×0.5–1.5, never the same moment as every other widget's (the desk's own tabs
+ * do the same) — `restart`: the host said it restarts (1012); `slow`:
+ * refused for now (429), or nobody signed in yet; else the next step of the ladder. Pure but for the dice, for the tests.
+ */
+export function retryWait(how: "restart" | "slow" | null, attempt: number, roll: () => number = Math.random): number {
+  if (how === "restart") return 1000 + Math.round(roll() * RESTART_SPREAD_MS);
+  const step = how === "slow" ? RETRY_MS[RETRY_MS.length - 1]! : RETRY_MS[Math.min(attempt, RETRY_MS.length - 1)]!;
+  return Math.round(step * (0.5 + roll()));
+}
 const LIVE_STATES = new Set(["ringing", "active"]);
 const PING_MS = 20_000;
 
@@ -144,9 +160,9 @@ export function stopLiveRing(): void {
   closeCallFrame();
 }
 
-function schedule(slow = false): void {
+function schedule(how: "restart" | "slow" | null = null): void {
   if (stopped) return;
-  const wait = slow ? RETRY_MS[RETRY_MS.length - 1]! : RETRY_MS[Math.min(retry++, RETRY_MS.length - 1)]!;
+  const wait = retryWait(how, how ? retry : retry++);
   clearTimeout(reconnectTimer);
   reconnectTimer = setTimeout(() => void connect(), wait);
 }
@@ -160,7 +176,7 @@ async function connect(): Promise<void> {
       stopped = true;
       return;
     }
-    return schedule(true);
+    return schedule("slow");
   }
   tokenless = 0;
   let res: Response;
@@ -174,7 +190,8 @@ async function connect(): Promise<void> {
     stopped = true;
     return;
   }
-  if (!res.ok) return schedule(res.status === 429);
+  // Refused for now: slowly. The host restarting (its proxy answering for it): back at random within the window.
+  if (!res.ok) return schedule(res.status === 429 ? "slow" : res.status === 502 || res.status === 503 ? "restart" : null);
   let out: { calls?: boolean; ticket?: string | null; call?: RingingCall | null };
   try {
     out = await res.json();
@@ -221,10 +238,11 @@ async function connect(): Promise<void> {
       /* not ours to read */
     }
   };
-  ws.onclose = () => {
+  ws.onclose = (e) => {
     clearInterval(pinger);
     if (socket === ws) socket = null;
-    schedule();
+    // 1012: the support host is restarting — every widget heard it at once; each comes back at its own moment.
+    schedule(e.code === 1012 ? "restart" : null);
   };
 }
 

package/src/ui/bubblePlace.ts

@@ -23,7 +23,8 @@
  *   STAY_MARGIN does not move it, so it does not jitter as the page settles.
 
  *   A PAGE'S OWN PLACE. The desk's rules (ปุ่มแชท › ตำแหน่งปุ่ม): pages whose path starts so — hidden there, or
- *   started in a corner at a height. The most specific rule wins; a person who moved it keeps their place.
+ *   started on a side at x in from its edge and y up from the bottom, at its own z-index (0.19.11). The most specific
+ *   rule wins; a person who moved it keeps their place (the rule's z-index still holds).
  *
  * The arithmetic is pure (bubblePlace.test.ts); `scanColumns` reads the page.
  */
@@ -139,6 +140,10 @@ export interface PlaceRule {
   show: "hide" | Side;
   /** Up from the bottom, px. */
   y: number;
+  /** In from its side's edge, px (0.19.11) — the host's own inset when the desk does not say. */
+  x?: number;
+  /** Its z-index on the page (0.19.11), the panel one above — null or absent: on top of everything. */
+  z?: number | null;
 }
 
 /** A rule's path as a test of a page's path: from its start, ending at a segment's end. Pure; null when malformed. */

package/src/ui/chatBubble.ts

@@ -161,10 +161,21 @@ export interface BubbleSpot {
 const MARGIN = 8;
 /** The ring's card is ~180px tall at the corner: a bubble above that leaves it there. */
 const RING_ZONE = 200;
-/** Let go at (px, py), its centre: the nearer side, the height it was dropped at — inside the window. Pure. */
+/** Let go this near its edge (px past the inset), it lines up with the corner at the inset. */
+const SNAP = 24;
+/**
+ * Let go at (px, py), its centre: just there (0.19.11, card f34152d3 — "move ได้เฉพาะ top/bottom left กับ top/bottom
+ * right อยากได้แบบ free hand"), measured from the nearer side so it keeps its place from that edge as the window
+ * changes; within SNAP of the edge it lines up at the inset. Inside the window. Pure.
+ */
 export function settleBubble(px: number, py: number, view: { w: number; h: number }, inset: number, s = SIZE): BubbleSpot {
   const side = px < view.w / 2 ? "left" : "right";
-  return { side, x: inset, y: clampBubbleY(view.h - py - s / 2, view.h, s) };
+  const fromEdge = side === "left" ? px - s / 2 : view.w - px - s / 2;
+  return { side, x: fromEdge <= inset + SNAP ? inset : clampBubbleX(fromEdge, view.w, s), y: clampBubbleY(view.h - py - s / 2, view.h, s) };
+}
+/** In from its edge, keeping the whole bubble on screen. Pure. */
+export function clampBubbleX(x: number, viewW: number, s = SIZE): number {
+  return Math.round(Math.min(Math.max(x, MARGIN), Math.max(MARGIN, viewW - s - MARGIN)));
 }
 /** A height that keeps the whole bubble on screen. Pure. */
 export function clampBubbleY(y: number, viewH: number, s = SIZE): number {
@@ -184,6 +195,13 @@ export function anchorPanel(spot: BubbleSpot, viewH: number, s = SIZE): { bottom
   if (above >= 420 || above >= below) return { bottom: spot.y + s + GAP, height: Math.max(240, Math.min(640, above)) };
   return { top: viewH - spot.y + GAP, height: Math.max(240, Math.min(640, below)) };
 }
+/**
+ * The panel by the bubble, in from the same edge as the bubble — a bubble far in from it (0.19.11) still has its whole
+ * panel on screen. Pure.
+ */
+export function panelInset(x: number, viewW: number): number {
+  return Math.round(Math.max(MARGIN, Math.min(x, viewW - Math.min(PANEL_W, viewW - 32) - MARGIN)));
+}
 /** A dragged panel's top-left, inside the window by the margin. Pure. */
 export function clampPanel(p: { x: number; y: number }, box: { w: number; h: number }, view: { w: number; h: number }): { x: number; y: number } {
   return { x: Math.round(Math.min(Math.max(p.x, MARGIN), Math.max(MARGIN, view.w - box.w - MARGIN))), y: Math.round(Math.min(Math.max(p.y, MARGIN), Math.max(MARGIN, view.h - box.h - MARGIN))) };
@@ -351,10 +369,11 @@ function loadPlace(): void {
   const def = chatPlace(getConfig().chat);
   if (def) spot = { side: def.side, x: def.x, y: def.y };
   try {
-    const kept = JSON.parse(localStorage.getItem(placeKey()) ?? "null") as { bubble?: { side?: unknown; y?: unknown }; panel?: { x?: unknown; y?: unknown; h?: unknown } | null; opened?: unknown } | null;
+    const kept = JSON.parse(localStorage.getItem(placeKey()) ?? "null") as { bubble?: { side?: unknown; x?: unknown; y?: unknown }; panel?: { x?: unknown; y?: unknown; h?: unknown } | null; opened?: unknown } | null;
     const b = kept?.bubble;
     movedByHand = !!b && (b.side === "left" || b.side === "right") && typeof b.y === "number" && Number.isFinite(b.y);
-    if (movedByHand) spot = { ...spot, side: b!.side as BubbleSpot["side"], y: b!.y as number };
+    // Kept before 0.19.11 without its x: at the edge, where it was.
+    if (movedByHand) spot = { ...spot, side: b!.side as BubbleSpot["side"], y: b!.y as number, ...(typeof b!.x === "number" && Number.isFinite(b!.x) ? { x: b!.x } : {}) };
     const p = kept?.panel;
     panelAt = p && typeof p.x === "number" && typeof p.y === "number" && Number.isFinite(p.x) && Number.isFinite(p.y) ? { x: p.x, y: p.y, h: typeof p.h === "number" && p.h >= 240 ? p.h : 640 } : null;
     opened = kept?.opened === true;
@@ -364,7 +383,7 @@ function loadPlace(): void {
 }
 function savePlace(): void {
   try {
-    localStorage.setItem(placeKey(), JSON.stringify({ ...(movedByHand ? { bubble: { side: spot.side, y: spot.y } } : {}), panel: panelAt, ...(opened ? { opened: true } : {}) }));
+    localStorage.setItem(placeKey(), JSON.stringify({ ...(movedByHand ? { bubble: { side: spot.side, x: spot.x, y: spot.y } } : {}), panel: panelAt, ...(opened ? { opened: true } : {}) }));
   } catch {
     /* this visit only */
   }
@@ -406,12 +425,18 @@ function avoidSetting(): { on: boolean; extra: string | null } {
   if (own === false || deskLook?.avoid === false) return { on: false, extra: null };
   return { on: true, extra: typeof own === "string" && own.trim() ? own.trim() : null };
 }
-/** Where it wants to be on this page: put by hand — kept; else the desk's rule for the page; else the config's place. */
+/** The desk's z-index for this page (0.19.11) — null: the stylesheet's, on top of everything. */
+let ruleZ: number | null = null;
+/**
+ * Where it wants to be on this page: put by hand — kept; else the desk's rule for the page — its side, x in from that
+ * edge and y up (0.19.11: x the desk's too); else the config's place. The rule's z-index holds either way.
+ */
 function wanted(): BubbleSpot {
   const rule = placeFor(pagePath(), deskLook?.places);
   ruleHidden = rule?.show === "hide";
+  ruleZ = typeof rule?.z === "number" && Number.isFinite(rule.z) ? Math.round(Math.min(Math.max(rule.z, 0), 2147483000)) : null;
   if (movedByHand || !rule || rule.show === "hide") return spot;
-  return { side: rule.show, x: spot.x, y: rule.y };
+  return { side: rule.show, x: typeof rule.x === "number" && Number.isFinite(rule.x) ? rule.x : spot.x, y: rule.y };
 }
 /** Look at the page afresh — its columns read again as placing asks for them — and place again. */
 function rescan(): void {
@@ -473,7 +498,8 @@ const onPageSettled = (e: Event) => {
   if (ours(e.target)) return;
   const r = e.target instanceof Element ? e.target.getBoundingClientRect() : null;
   const v = view();
-  const x = spot.x;
+  // Its column where it stands — far in from the edge too (0.19.11).
+  const x = (shown ?? spot).x;
   const inColumn = !!r && r.width > 0 && (r.left < x + size || r.right > v.w - x - size);
   queueRescan(inColumn ? "soon" : "later");
 };
@@ -523,10 +549,11 @@ function layout(): void {
   const v = view();
   const want = wanted();
   const wantY = clampBubbleY(want.y, v.h, size);
+  const wantX = clampBubbleX(want.x, v.w, size);
   // While the panel is open it stays where it was opened from — never moved under the person's eyes.
-  const wish = `${pagePath()}|${want.side}|${want.x}|${wantY}`;
+  const wish = `${pagePath()}|${want.side}|${wantX}|${wantY}`;
   const prev = shown && shownFor === wish ? shown : null;
-  const home = { side: want.side, x: want.x, y: wantY };
+  const home = { side: want.side, x: wantX, y: wantY };
   const placing = !!columns && avoidSetting().on;
   const free = !isOpen || !shown ? (placing ? placeSpot(home, readColumn, v, size, MARGIN, Math.max(MARGIN, v.h - size - MARGIN), prev) : home) : shown;
   shown = { side: free.side, x: free.x, y: free.y };
@@ -537,6 +564,9 @@ function layout(): void {
   const other = at.side === "right" ? "left" : "right";
   bubble.style.display = ruleHidden && !isOpen ? "none" : "";
   Object.assign(bubble.style, { [at.side]: `${at.x}px`, [other]: "", bottom: `${y}px`, top: "" });
+  // The page's z-index (0.19.11): under the host's own layer when the desk says so — the panel just above its bubble.
+  bubble.style.zIndex = ruleZ === null ? "" : String(ruleZ);
+  panel.style.zIndex = ruleZ === null ? "" : String(ruleZ + 1);
   if (panelAt) {
     // The height it had when it was picked up — a drag moves it, never resizes it under the hand.
     const box = { w: Math.min(PANEL_W, v.w - 32), h: Math.min(panelAt.h, v.h - 2 * MARGIN) };
@@ -544,7 +574,7 @@ function layout(): void {
     Object.assign(panel.style, { left: `${p.x}px`, top: `${p.y}px`, right: "", bottom: "", height: `${box.h}px` });
   } else {
     const a = anchorPanel(at, v.h, size);
-    Object.assign(panel.style, { [at.side]: `${at.x}px`, [other]: "", bottom: a.bottom !== undefined ? `${a.bottom}px` : "", top: a.top !== undefined ? `${a.top}px` : "", height: `${a.height}px` });
+    Object.assign(panel.style, { [at.side]: `${panelInset(at.x, v.w)}px`, [other]: "", bottom: a.bottom !== undefined ? `${a.bottom}px` : "", top: a.top !== undefined ? `${a.top}px` : "", height: `${a.height}px` });
   }
   // The call's card and frame sit above the bubble while it is there and low on their side (ring.ts, callFrame.ts).
   const lift = root && root.style.display !== "none" && bubble.style.display !== "none" ? liftFor(at, size) : 0;