graphein 0.16.0 → 0.16.1

package/dist/index.d.ts

@@ -354,6 +354,14 @@ declare class RoughPen {
     private readonly rng;
     constructor(ctx: RoughContext, style?: Partial<RoughStyle>);
     private resolve;
+    /**
+     * Run `draw` with `factor` folded into the *ambient* `globalAlpha`, then restore
+     * it. Callers honoring a cross-highlight set `ctx.globalAlpha` below 1 to dim a
+     * non-selected mark; composing (rather than overwriting and resetting to 1) keeps
+     * that dim while still applying the pen's own fill/stroke translucency, so sketch
+     * marks dim during a highlight exactly like their solid-rendered counterparts.
+     */
+    private withAlpha;
     /** A symmetric random offset in [-x, x], scaled by a length-based gain. */
     private off;
     /**

package/dist/index.js

@@ -1291,6 +1291,20 @@ var RoughPen = class {
   resolve(opts) {
     return { ...this.base, ...opts };
   }
+  /**
+   * Run `draw` with `factor` folded into the *ambient* `globalAlpha`, then restore
+   * it. Callers honoring a cross-highlight set `ctx.globalAlpha` below 1 to dim a
+   * non-selected mark; composing (rather than overwriting and resetting to 1) keeps
+   * that dim while still applying the pen's own fill/stroke translucency, so sketch
+   * marks dim during a highlight exactly like their solid-rendered counterparts.
+   */
+  withAlpha(factor, draw) {
+    const ctx = this.ctx;
+    const prev = ctx.globalAlpha;
+    ctx.globalAlpha = prev * factor;
+    draw();
+    ctx.globalAlpha = prev;
+  }
   /** A symmetric random offset in [-x, x], scaled by a length-based gain. */
   off(x, gain) {
     return gain * (this.rng() * 2 * x - x);
@@ -1375,9 +1389,7 @@ var RoughPen = class {
     ctx.lineCap = "round";
     ctx.lineJoin = "round";
     ctx.strokeStyle = m.stroke ?? "#000";
-    ctx.globalAlpha = m.strokeAlpha ?? 1;
-    ctx.stroke();
-    ctx.globalAlpha = 1;
+    this.withAlpha(m.strokeAlpha ?? 1, () => ctx.stroke());
   }
   /** Fill a closed polygon with hachure / cross-hatch / solid. */
   fillPolygon(points, m) {
@@ -1388,9 +1400,7 @@ var RoughPen = class {
       this.tracePolyline(points, { ...m, roughness: m.roughness * 0.6 }, true);
       ctx.closePath();
       ctx.fillStyle = m.fill;
-      ctx.globalAlpha = m.fillAlpha ?? 1;
-      ctx.fill();
-      ctx.globalAlpha = 1;
+      this.withAlpha(m.fillAlpha ?? 1, () => ctx.fill());
       return;
     }
     const gap = m.hachureGap > 0 ? m.hachureGap : Math.max(3, m.strokeWidth * 3.2);
@@ -1406,9 +1416,7 @@ var RoughPen = class {
     ctx.lineWidth = weight;
     ctx.lineCap = "round";
     ctx.strokeStyle = m.fill;
-    ctx.globalAlpha = m.fillAlpha ?? 0.85;
-    ctx.stroke();
-    ctx.globalAlpha = 1;
+    this.withAlpha(m.fillAlpha ?? 0.85, () => ctx.stroke());
   }
   /** Hand-drawn open polyline (axis rules, box-plot whiskers, short features). */
   polyline(points, opts = {}) {
@@ -1482,9 +1490,7 @@ var RoughPen = class {
       ctx.beginPath();
       this.traceSmoothClosed(pts);
       ctx.fillStyle = m.fill;
-      ctx.globalAlpha = m.fillAlpha ?? 1;
-      ctx.fill();
-      ctx.globalAlpha = 1;
+      this.withAlpha(m.fillAlpha ?? 1, () => ctx.fill());
     }
     if (m.stroke) {
       ctx.beginPath();