react-x11 2.23.2 → 2.24.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-x11",
-  "version": "2.23.2",
+  "version": "2.24.0",
   "description": "react renderer with X11 as a target",
   "main": "./src/index.js",
   "files": [

package/src/node.d.ts

@@ -515,6 +515,16 @@ export declare class Node {
    * paint, whatever the props. A translucent element answers `null`.
    */
   opaqueRect(): Rect | null;
+  /**
+   * How far this element's own drawing reaches past its box, in device
+   * pixels on every side — 0, the default, for an element that stays inside
+   * it. Core claims and culls the element by its box grown by this, as it
+   * does for an outline or a shadow; an element that paints past its box
+   * without saying so leaves the old ink's edge behind when it changes. Read
+   * when the cached paint bounds are rebuilt: answer a bound for anything
+   * the element may draw, not for what it drew last.
+   */
+  paintOverhang(): number;
   /**
    * The rect this paint pass is repainting, or null when it is repainting
    * the whole window — and null outside a paint, which means the same

package/src/nodes/invalidate.js

@@ -114,6 +114,26 @@ export class NodeInvalidate {
     return null;
   }
 
+  /**
+   * How far this element's own drawing reaches past its box — device
+   * pixels, on every side — or 0, the default, for one that stays inside
+   * it. Core claims and culls the element, and sizes a fade's surface, by
+   * the box grown by it, as it does for an outline or a shadow. Drawing
+   * past the box without saying so, an element was claimed by its box
+   * alone: an edit left the old ink's edge behind and drew the new one's
+   * without it, and a row scrolled just out of view lost the ink it still
+   * put in. A code chip padded past the run it sits behind is the case —
+   * at the start of a line the pad is outside the box.
+   *
+   * Read whenever the cached paint bounds are rebuilt, which a claim of the
+   * node does: answer a bound that holds for anything the element may
+   * draw, not for what it drew last, or the claim after a change stops
+   * covering what the frame before put down.
+   */
+  paintOverhang() {
+    return 0;
+  }
+
   /**
    * A layout-affecting change confined to this node: claim the subtree as
    * it stands now, and queue it for a second claim once layout has run —
@@ -206,7 +226,8 @@ export class NodeInvalidate {
 
   /**
    * This node's own rect, grown by anything it draws outside it — the
-   * outline and the shadow, the only two. Per node rather than once at the
+   * outline and the shadow, and whatever an element says it draws past its
+   * box (`paintOverhang`). Per node rather than once at the
    * top, because either can belong to any node and the bound has to cover it
    * wherever it is; and the outline is counted even when the ring is
    * currently *off*, because the frame that erases it is claimed after the
@@ -219,7 +240,11 @@ export class NodeInvalidate {
    * instead, where both the old style and the new one are in hand.
    */
   _ownPaintBounds() {
-    const extent = Math.max(this._outlineExtent(), this._shadowExtent());
+    const extent = Math.max(
+      this._outlineExtent(),
+      this._shadowExtent(),
+      this.paintOverhang() || 0,
+    );
     if (extent <= 0) return this.abs;
     return {
       x: this.abs.x - extent,
@@ -549,15 +574,6 @@ export class WindowInvalidate {
     return damageToPaint(rects);
   }
 
-  /**
-   * The rects this frame will repaint, or null for the whole window.
-   *
-   * Clamped to the window: damage is recorded when a node invalidates, and
-   * the window may have been resized since. A region that no longer
-   * intersects the window means there is nothing to do, but the frame still
-   * has to clear the flag, so it degrades to a full repaint rather than
-   * painting nothing.
-   */
   /**
    * How many rects a frame's damage may hold before `addDamageRect` merges
    * the closest pair. Four on X11 (`MAX_DAMAGE_RECTS`), where every pass
@@ -571,6 +587,17 @@ export class WindowInvalidate {
     return Number.isInteger(cap) && cap > 0 ? cap : MAX_DAMAGE_RECTS;
   }
 
+  /**
+   * The rects this frame will repaint, or null for the whole window.
+   *
+   * Clamped to the window: damage is recorded when a node invalidates, and
+   * the window may have been resized since — or the node drew past its
+   * edge, where a claim lands whole. A frame whose every claim lies outside
+   * the window has nothing to repaint and paints nothing, as a frame whose
+   * claims were all answered on layers does; it used to repaint the whole
+   * window, so a card dragged past the edge of a graph, or a pan that
+   * claimed only its far side, cost a full frame.
+   */
   _takeDamage(width, height) {
     const damage = this._damage;
     this._damage = null;
@@ -608,7 +635,11 @@ export class WindowInvalidate {
       if (clamped === FULL_DAMAGE) return null;
       if (clamped) rects.push(clamped);
     }
-    if (!rects.length) return null;
+    if (!rects.length) {
+      this._lastDamageRects = [];
+      this._lastDamage = { x: 0, y: 0, width: 0, height: 0 };
+      return [];
+    }
     this._lastDamageRects = damageToPaint(rects);
     this._lastDamage = rectsBounds(this._lastDamageRects);
     return this._lastDamageRects;

package/src/nodes/paint.js

@@ -355,11 +355,15 @@ export class NodePaint {
   }
 
   /** `order` painted in turn, each child culled against the window, its
-   *  clipping ancestors and the pass. */
+   *  clipping ancestors and the pass — by what it paints, not by its box: a
+   *  row scrolled just out of a pane still reaches into it with whatever
+   *  hangs off it, a descender past a trimmed line box or a child that
+   *  overflows it, and culled by its box it drew none of that in a full
+   *  repaint while a scroll's copy carried it. */
   _paintChildList(ctx, order) {
     for (const child of order) {
       if (child._promoted) continue; // on a layer of its own: a hole here
-      if (child._offscreen(child.abs, DAMAGE_SLOP)) continue;
+      if (child._offscreen(child._subtreeBounds(), DAMAGE_SLOP)) continue;
       if (child._outsideDamage()) continue;
       child.paint(ctx);
     }
@@ -371,8 +375,9 @@ export class NodePaint {
    */
   _paintsInto(rect) {
     if (this._promoted) return false;
-    if (!rectsOverlap(this._subtreeBounds(), rect, DAMAGE_SLOP)) return false;
-    return !this._offscreen(this.abs, DAMAGE_SLOP);
+    const reach = this._subtreeBounds();
+    if (!rectsOverlap(reach, rect, DAMAGE_SLOP)) return false;
+    return !this._offscreen(reach, DAMAGE_SLOP);
   }
 
   /**