@weasel-js/guides 1.15.0 → 1.15.2

package/dist/index.js

@@ -1,6 +1,6 @@
 import { useState, useRef, useCallback, useEffect } from 'react';
-import { sceneBoxFrames, scenePoseFrame, useLatest, viewportWorldRect, tickedSegment, measuredSegmentCommands, AUTO_POSE_DESCRIPTOR, visualBoundsViaDescriptor, rectFromPlane, unionAABB, createTransformOp, asNodeId, sceneUnitScopes, screenToWorld, nodeGates, resolveStrokeWidth, resolveUnit, axisUnits, resolveScoped } from '@weasel-js/core';
-import { pointInPolygon, invert, mat3, applyToPoint, pxExtent, PATH_M, PATH_L, PATH_Z, pxExtentInFrame } from '@weasel-js/geom';
+import { sceneBoxFrames, scenePoseFrame, useLatest, viewportWorldRect, viewWorldToScreen, tickedSegment, measuredSegmentCommands, AUTO_POSE_DESCRIPTOR, visualBoundsViaDescriptor, rectFromPlane, unionAABB, sceneMagnification, asNodeId, createTransformOp, sceneUnitScopes, screenToWorld, nodeGates, resolveStrokeWidth, resolveUnit, axisUnits, resolveScoped } from '@weasel-js/core';
+import { pointInPolygon, invert, mat3, distance2, rectContainsPointHalfOpen, applyToPoint, pxExtent, PATH_M, PATH_L, PATH_Z, pxExtentInFrame } from '@weasel-js/geom';
 
 // src/grid/roundToCell.ts
 function roundToCell(value, cellSize) {
@@ -592,26 +592,27 @@ function createGuidesLayer(opts) {
       const guides = opts.getGuides();
       const gaps = opts.getGaps?.() ?? [];
       if (guides.length === 0 && gaps.length === 0) return [];
-      const sx = (x) => (x - view.x) * view.scale.x;
-      const sy = (y) => (y - view.y) * view.scale.y;
       const out = [];
       for (const g of guides) {
         const span2 = spanned ? g.span : void 0;
         if (g.axis === "x") {
-          const x = sx(g.offset);
+          const lo3 = viewWorldToScreen(view, { x: g.offset, y: span2?.min ?? 0 });
+          const x = lo3.x;
           if (x < -lineWidth || x > dims.width + lineWidth) continue;
-          const path = span2 ? tickedSegment(x, sy(span2.min), x, sy(span2.max), ticks) : tickedSegment(x, 0, x, dims.height, 0);
+          const path = span2 ? tickedSegment(x, lo3.y, x, viewWorldToScreen(view, { x: g.offset, y: span2.max }).y, ticks) : tickedSegment(x, 0, x, dims.height, 0);
           out.push({ kind: "path", path, stroke });
         } else {
-          const y = sy(g.offset);
+          const lo3 = viewWorldToScreen(view, { x: span2?.min ?? 0, y: g.offset });
+          const y = lo3.y;
           if (y < -lineWidth || y > dims.height + lineWidth) continue;
-          const path = span2 ? tickedSegment(sx(span2.min), y, sx(span2.max), y, ticks) : tickedSegment(0, y, dims.width, y, 0);
+          const path = span2 ? tickedSegment(lo3.x, y, viewWorldToScreen(view, { x: span2.max, y: g.offset }).x, y, ticks) : tickedSegment(0, y, dims.width, y, 0);
           out.push({ kind: "path", path, stroke });
         }
       }
       for (const g of gaps) {
-        const [x0, y0, x1, y1] = g.axis === "x" ? [sx(g.min), sy(g.at), sx(g.max), sy(g.at)] : [sx(g.at), sy(g.min), sx(g.at), sy(g.max)];
-        out.push(...measuredSegmentCommands(x0, y0, x1, y1, ticks, gapStroke, format?.(g.max - g.min) ?? null, gapColor));
+        const a = viewWorldToScreen(view, g.axis === "x" ? { x: g.min, y: g.at } : { x: g.at, y: g.min });
+        const b = viewWorldToScreen(view, g.axis === "x" ? { x: g.max, y: g.at } : { x: g.at, y: g.max });
+        out.push(...measuredSegmentCommands(a.x, a.y, b.x, b.y, ticks, gapStroke, format?.(g.max - g.min) ?? null, gapColor));
       }
       return out;
     }
@@ -942,8 +943,6 @@ function extentAcross(q, p, axis, delta) {
   const lo3 = c === "x" ? landed.x : landed.y;
   return [lo3, lo3 + (c === "x" ? landed.width : landed.height)];
 }
-
-// src/sources/spacing.ts
 var TRANSLATE = [
   { axis: "x", edge: "both", rate: { x: 1, y: 0 } },
   { axis: "y", edge: "both", rate: { x: 0, y: 1 } }
@@ -952,9 +951,9 @@ function movingSides(q) {
   return q.sides ? q.sides.map((s) => ({ axis: s.axis, edge: s.side, rate: s.rate })) : TRANSLATE;
 }
 var measureAll = (boxes) => ({ boxes, x: measureGapSpans(boxes, "x"), y: measureGapSpans(boxes, "y") });
-function gapMark(g, color) {
+function gapMark(g, color, magnification) {
   const ends = g.axis === "x" ? { from: { x: g.min, y: g.at }, to: { x: g.max, y: g.at } } : { from: { x: g.at, y: g.min }, to: { x: g.at, y: g.max } };
-  return { kind: "gap", ...ends, value: g.max - g.min, ...color === void 0 ? {} : { color } };
+  return { kind: "gap", ...ends, value: (g.max - g.min) / magnification, ...color === void 0 ? {} : { color } };
 }
 function spacingSnapSource(opts = {}) {
   const fromScene = cachedPerScene(measureAll, opts.filter);
@@ -971,6 +970,7 @@ function spacingSnapSource(opts = {}) {
       const reach = q.reachWorld(q.reachPx);
       const refs = { x: referenceGaps(box, measured.x), y: referenceGaps(box, measured.y) };
       const seen = /* @__PURE__ */ new Set();
+      const magnification = q.scene && q.ids?.length ? sceneMagnification(q.scene, q.ids.map(asNodeId)) : 1;
       for (const { axis, edge, rate } of movingSides(q)) {
         const speed = Math.hypot(rate.x, rate.y);
         for (const o of spacingOffers(box, axis, edge, measured.boxes, refs[axis])) {
@@ -982,7 +982,7 @@ function spacingSnapSource(opts = {}) {
             locus: sideLine(probe.at, rate, o.delta),
             mark: (delta) => {
               const landed = landedBox(q, delta) ?? box;
-              return equalGaps(landed, axis, o.size, measured.boxes, refs[axis]).map((g) => gapMark(g, opts.color));
+              return equalGaps(landed, axis, o.size, measured.boxes, refs[axis]).map((g) => gapMark(g, opts.color, magnification));
             }
           };
         }
@@ -1033,10 +1033,13 @@ function measureAxis(from, to, axis, out) {
 }
 
 // src/spacingHints/distanceReadout.ts
-function marksOf(r, color) {
+function marksOf(r, color, magnification) {
   const c = color === void 0 ? {} : { color };
   return [
-    ...r.gaps.map((g) => g.axis === "x" ? { kind: "distance", from: { x: g.min, y: g.at }, to: { x: g.max, y: g.at }, value: g.max - g.min, ...c } : { kind: "distance", from: { x: g.at, y: g.min }, to: { x: g.at, y: g.max }, value: g.max - g.min, ...c }),
+    ...r.gaps.map((g) => {
+      const value = (g.max - g.min) / magnification;
+      return g.axis === "x" ? { kind: "distance", from: { x: g.min, y: g.at }, to: { x: g.max, y: g.at }, value, ...c } : { kind: "distance", from: { x: g.at, y: g.min }, to: { x: g.at, y: g.max }, value, ...c };
+    }),
     ...r.leaders.flatMap((l) => {
       if (l.span === void 0) return [];
       return [l.axis === "x" ? { kind: "line", from: { x: l.offset, y: l.span.min }, to: { x: l.offset, y: l.span.max }, ...c } : { kind: "line", from: { x: l.span.min, y: l.offset }, to: { x: l.span.max, y: l.offset }, ...c }];
@@ -1061,10 +1064,10 @@ function distanceReadout(opts = {}) {
   const modifier = opts.modifier ?? "alt";
   let shown = EMPTY;
   let store = null;
-  const show = (next) => {
+  const show = (next, magnification = 1) => {
     if (next === shown || next.gaps.length === 0 && shown.gaps.length === 0) return;
     shown = next;
-    store?.set(marksOf(next, opts.color));
+    store?.set(marksOf(next, opts.color, magnification));
   };
   const action = {
     id: `${id}.measure`,
@@ -1084,7 +1087,8 @@ function distanceReadout(opts = {}) {
         const hit = nodeAtPoint(p.world, subtreeOf(scene, ids));
         const from = worldUnionOf(scene, ids, { poseDescriptor });
         const [to] = hit === null ? [] : worldBoundsOf(scene, [hit], { poseDescriptor });
-        show(from === null || to === void 0 ? EMPTY : measureDistances(from, to));
+        if (from === null || to === void 0) show(EMPTY);
+        else show(measureDistances(from, to), sceneMagnification(scene, [...ids, hit]));
       }
     }
   };
@@ -1132,19 +1136,12 @@ function createSpacingHintsPreset(opts = {}) {
   if (opts.readout !== false) contributions.push(distanceReadout({ ...opts.readout, ...color }));
   return { id, snapSources, contributions };
 }
-
-// src/layout/snaps.ts
-function dist2(a, b) {
-  const dx = a.x - b.x;
-  const dy = a.y - b.y;
-  return dx * dx + dy * dy;
-}
 function nearestOf(targets, pointer) {
   if (targets.length === 0) return null;
   let best = targets[0];
-  let bestD = dist2(best.origin, pointer);
+  let bestD = distance2(best.origin, pointer);
   for (let i = 1; i < targets.length; i++) {
-    const d = dist2(targets[i].origin, pointer);
+    const d = distance2(targets[i].origin, pointer);
     if (d < bestD) {
       bestD = d;
       best = targets[i];
@@ -1164,18 +1161,15 @@ function nearestWithin(opts) {
     pickTarget(targets, pointer) {
       const got = nearestOf(targets, pointer);
       if (got === null) return null;
-      return dist2(got.origin, pointer) <= tol2 ? got : null;
+      return distance2(got.origin, pointer) <= tol2 ? got : null;
     }
   };
 }
-function rectContains(r, p) {
-  return p.x >= r.x && p.x < r.x + r.width && p.y >= r.y && p.y < r.y + r.height;
-}
 function containedThenNearest() {
   return {
     pickTarget(targets, pointer) {
       for (const t of targets) {
-        if (t.hitBounds && rectContains(t.hitBounds, pointer)) return t;
+        if (t.hitBounds && rectContainsPointHalfOpen(t.hitBounds, pointer.x, pointer.y)) return t;
       }
       return nearestOf(targets, pointer);
     }
@@ -1188,8 +1182,8 @@ function cellAt() {
   return {
     pickTarget(targets, pointer) {
       for (const t of targets) {
-        if (t.hitBounds && rectContains(t.hitBounds, pointer)) return t;
-        if (isCellMeta(t.meta) && rectContains(t.meta.cellRect, pointer)) return t;
+        if (t.hitBounds && rectContainsPointHalfOpen(t.hitBounds, pointer.x, pointer.y)) return t;
+        if (isCellMeta(t.meta) && rectContainsPointHalfOpen(t.meta.cellRect, pointer.x, pointer.y)) return t;
       }
       return nearestOf(targets, pointer);
     }