@fieldnotes/core 0.39.0 → 0.40.0

package/dist/index.cjs

@@ -29,6 +29,7 @@ __export(index_exports, {
   HandTool: () => HandTool,
   HistoryStack: () => HistoryStack,
   ImageTool: () => ImageTool,
+  LaserTool: () => LaserTool,
   LayerManager: () => LayerManager,
   MeasureTool: () => MeasureTool,
   NoteTool: () => NoteTool,
@@ -913,6 +914,11 @@ var KeyboardActions = class {
     if (tool?.name !== "select") return null;
     return { tool, ctx };
   }
+  selectableElements(ctx) {
+    return ctx.store.getAll().filter(
+      (el) => !el.locked && (ctx.isLayerVisible?.(el.layerId) ?? true) && !(ctx.isLayerLocked?.(el.layerId) ?? false)
+    );
+  }
   nudge(dx, dy, byCell) {
     if (this.deps.isToolActive()) return false;
     const sel = this.selectTool();
@@ -1055,12 +1061,28 @@ var KeyboardActions = class {
     }
     const sel = this.selectTool();
     if (!sel) return;
-    const ids = sel.ctx.store.getAll().filter(
-      (el) => !el.locked && (sel.ctx.isLayerVisible?.(el.layerId) ?? true) && !(sel.ctx.isLayerLocked?.(el.layerId) ?? false)
-    ).map((el) => el.id);
+    const ids = this.selectableElements(sel.ctx).map((el) => el.id);
     sel.tool.setSelection(ids);
     sel.ctx.requestRender();
   }
+  cycleSelection(direction) {
+    if (this.deps.isToolActive()) return;
+    const tm = this.deps.getToolManager();
+    const ctx = this.deps.getToolContext();
+    if (!tm || !ctx) return;
+    if (tm.activeTool?.name !== "select") ctx.switchTool?.("select");
+    const sel = this.selectTool();
+    if (!sel) return;
+    const eligible = this.selectableElements(sel.ctx).filter((el) => el.type !== "grid");
+    if (eligible.length === 0) return;
+    const idxs = sel.tool.selectedIds.map((id) => eligible.findIndex((e) => e.id === id)).filter((i) => i >= 0);
+    const anchor = idxs.length === 0 ? direction > 0 ? -1 : 0 : direction > 0 ? Math.max(...idxs) : Math.min(...idxs);
+    const next = (anchor + direction + eligible.length) % eligible.length;
+    const target = eligible[next];
+    if (!target) return;
+    sel.tool.setSelection([target.id]);
+    sel.ctx.requestRender();
+  }
   zoomToFit() {
     if (this.deps.isToolActive()) return;
     this.deps.fitToContent?.();
@@ -1165,6 +1187,8 @@ var DEFAULT_BINDINGS = [
   ["undo", ["mod+z"]],
   ["redo", ["mod+y", "mod+shift+z"]],
   ["select-all", ["mod+a"]],
+  ["cycle-selection", ["tab"]],
+  ["cycle-selection-reverse", ["shift+tab"]],
   ["copy", ["mod+c"]],
   ["duplicate", ["mod+d"]],
   ["z-forward", ["]"]],
@@ -1435,6 +1459,14 @@ var KeyboardHandler = class {
         e?.preventDefault();
         this.deps.actions.selectAll();
         return;
+      case "cycle-selection":
+        e?.preventDefault();
+        this.deps.actions.cycleSelection(1);
+        return;
+      case "cycle-selection-reverse":
+        e?.preventDefault();
+        this.deps.actions.cycleSelection(-1);
+        return;
       case "copy":
         e?.preventDefault();
         this.deps.actions.copy();
@@ -7773,6 +7805,17 @@ function renderArrowHandles(canvasCtx, arrow, zoom) {
     canvasCtx.stroke();
   }
 }
+function renderArrowHoverHandle(canvasCtx, arrow, zoom) {
+  const mid = getArrowMidpoint(arrow.from, arrow.to, arrow.bend);
+  const radius = HANDLE_RADIUS / zoom;
+  canvasCtx.fillStyle = "#2196F3";
+  canvasCtx.strokeStyle = "#2196F3";
+  canvasCtx.lineWidth = 1.5 / zoom;
+  canvasCtx.beginPath();
+  canvasCtx.arc(mid.x, mid.y, radius, 0, Math.PI * 2);
+  canvasCtx.fill();
+  canvasCtx.stroke();
+}
 
 // src/elements/snap-guides.ts
 function xAnchors(b) {
@@ -8621,7 +8664,13 @@ var SelectTool = class {
     if (this.hoveredId && this.ctx && this.mode.type === "idle") {
       if (!this._selectedIds.includes(this.hoveredId)) {
         const el = this.ctx.store.getById(this.hoveredId);
-        if (el) {
+        if (el?.type === "arrow") {
+          canvasCtx.save();
+          canvasCtx.globalAlpha = 0.35;
+          canvasCtx.setLineDash([]);
+          renderArrowHoverHandle(canvasCtx, el, this.ctx.camera.zoom);
+          canvasCtx.restore();
+        } else if (el) {
           const b = getElementBounds(el);
           if (b) {
             canvasCtx.save();
@@ -9592,8 +9641,118 @@ var TemplateTool = class {
   }
 };
 
+// src/tools/laser-tool.ts
+var DEFAULT_COLOR = "#ff3b30";
+var DEFAULT_WIDTH = 4;
+var DEFAULT_FADE_MS = 1200;
+var LaserTool = class {
+  name;
+  color;
+  width;
+  fadeMs;
+  trail = [];
+  rafId = null;
+  drawing = false;
+  optionListeners = /* @__PURE__ */ new Set();
+  constructor(options = {}) {
+    this.name = options.name ?? "laser";
+    this.color = options.color ?? DEFAULT_COLOR;
+    this.width = options.width ?? DEFAULT_WIDTH;
+    this.fadeMs = options.fadeMs ?? DEFAULT_FADE_MS;
+  }
+  now() {
+    return performance.now();
+  }
+  onActivate(ctx) {
+    ctx.setCursor?.("crosshair");
+  }
+  onDeactivate(ctx) {
+    if (this.rafId !== null) {
+      cancelAnimationFrame(this.rafId);
+      this.rafId = null;
+    }
+    this.trail = [];
+    this.drawing = false;
+    ctx.setCursor?.("default");
+    ctx.requestRender();
+  }
+  getOptions() {
+    return {
+      name: this.name,
+      color: this.color,
+      width: this.width,
+      fadeMs: this.fadeMs
+    };
+  }
+  onOptionsChange(listener) {
+    this.optionListeners.add(listener);
+    return () => this.optionListeners.delete(listener);
+  }
+  setOptions(options) {
+    if (options.color !== void 0) this.color = options.color;
+    if (options.width !== void 0) this.width = options.width;
+    if (options.fadeMs !== void 0) this.fadeMs = options.fadeMs;
+    this.notifyOptionsChange();
+  }
+  onPointerDown(state, ctx) {
+    this.drawing = true;
+    const world = ctx.camera.screenToWorld({ x: state.x, y: state.y });
+    this.trail.push({ x: world.x, y: world.y, t: this.now() });
+    this.ensureAnimating(ctx);
+  }
+  onPointerMove(state, ctx) {
+    if (!this.drawing) return;
+    const world = ctx.camera.screenToWorld({ x: state.x, y: state.y });
+    this.trail.push({ x: world.x, y: world.y, t: this.now() });
+    this.ensureAnimating(ctx);
+  }
+  onPointerUp(_state, _ctx) {
+    this.drawing = false;
+  }
+  renderOverlay(ctx) {
+    if (this.trail.length < 2) return;
+    ctx.save();
+    ctx.strokeStyle = this.color;
+    ctx.lineWidth = this.width;
+    ctx.lineCap = "round";
+    ctx.lineJoin = "round";
+    const now = this.now();
+    for (let i = 0; i < this.trail.length - 1; i++) {
+      const a = this.trail[i];
+      const b = this.trail[i + 1];
+      if (!a || !b) continue;
+      const age = now - b.t;
+      ctx.globalAlpha = Math.max(0, 1 - age / this.fadeMs);
+      ctx.beginPath();
+      ctx.moveTo(a.x, a.y);
+      ctx.lineTo(b.x, b.y);
+      ctx.stroke();
+    }
+    ctx.restore();
+  }
+  ensureAnimating(ctx) {
+    if (this.rafId === null) {
+      this.rafId = requestAnimationFrame(() => this.tick(ctx));
+    }
+  }
+  tick(ctx) {
+    const cutoff = this.now() - this.fadeMs;
+    this.trail = this.trail.filter((p) => p.t >= cutoff);
+    if (this.trail.length > 0) {
+      ctx.requestRender();
+      this.rafId = requestAnimationFrame(() => this.tick(ctx));
+    } else {
+      ctx.requestRender();
+      this.rafId = null;
+    }
+  }
+  notifyOptionsChange() {
+    for (const listener of this.optionListeners) listener();
+  }
+};
+
 // src/index.ts
-var VERSION = "0.39.0";
+var VERSION = "0.40.0";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ArrowTool,
@@ -9605,6 +9764,7 @@ var VERSION = "0.39.0";
   HandTool,
   HistoryStack,
   ImageTool,
+  LaserTool,
   LayerManager,
   MeasureTool,
   NoteTool,