stickyflow 0.2.0 → 0.4.0

package/dist/{chunk-N6WVHOUQ.js → chunk-CSXQD3ON.js}

@@ -1,5 +1,5 @@
-import { render, formatRollingNumber, DEFAULT_ROLLING_NUMBER_STYLE } from './chunk-KFJIFHXG.js';
-import { parseContractVersion, isContractCompatible, Emitter, resolveOwner, CHANGE_COLOR, findOwnerNode, isPrimary, linkSelectionOverlay, pathSelectionOverlay, isometricSelectionOverlay, shapeSelectionOverlay, DERIVED_HEIGHT_ROLES, quickDuplicateBubbles, isCameraGesture, linkChangeOverlay, shapeChangeOverlay, startChangeFade, REDUCED_MOTION_DURATION_MS, FLASH_DURATION_MS } from './chunk-6LQJUAD4.js';
+import { render, formatRollingNumber, DEFAULT_ROLLING_NUMBER_STYLE } from './chunk-65IVT4GK.js';
+import { parseContractVersion, isContractCompatible, Emitter, resolveOwner, CHANGE_COLOR, findOwnerNode, isPrimary, linkSelectionOverlay, pathSelectionOverlay, isometricSelectionOverlay, shapeSelectionOverlay, DERIVED_HEIGHT_ROLES, quickDuplicateBubbles, isCameraGesture, linkChangeOverlay, shapeChangeOverlay, startChangeFade, REDUCED_MOTION_DURATION_MS, FLASH_DURATION_MS } from './chunk-XEN5QIIJ.js';
 
 // src/runtime/viewer/display/rootAttributesPatch.ts
 var CAMERA_OWNED_ATTRIBUTES = /* @__PURE__ */ new Set(["viewbox", "width", "height"]);
@@ -232,6 +232,14 @@ var ViewportController = class {
   setNatural(natural) {
     this.#natural = natural;
   }
+  #userPoint(clientX, clientY) {
+    const matrix = this.#svg.getScreenCTM();
+    if (!matrix) {
+      return null;
+    }
+    const point = new DOMPoint(clientX, clientY).matrixTransform(matrix.inverse());
+    return { x: point.x, y: point.y };
+  }
   zoomBy(factor, clientX, clientY) {
     const rect = this.#svg.getBoundingClientRect();
     if (rect.width <= 0 || rect.height <= 0) {
@@ -239,16 +247,19 @@ var ViewportController = class {
     }
     const centerX = clientX ?? rect.left + rect.width / 2;
     const centerY = clientY ?? rect.top + rect.height / 2;
-    const worldX = this.#view.x + (centerX - rect.left) / rect.width * this.#view.w;
-    const worldY = this.#view.y + (centerY - rect.top) / rect.height * this.#view.h;
-    this.#view = { w: this.#view.w / factor, h: this.#view.h / factor, x: 0, y: 0 };
-    this.#view.x = worldX - (centerX - rect.left) / rect.width * this.#view.w;
-    this.#view.y = worldY - (centerY - rect.top) / rect.height * this.#view.h;
+    const anchor = this.#userPoint(centerX, centerY);
+    this.#view = { ...this.#view, w: this.#view.w / factor, h: this.#view.h / factor };
+    this.apply();
+    const moved = anchor ? this.#userPoint(centerX, centerY) : null;
+    if (anchor && moved) {
+      this.#view.x += anchor.x - moved.x;
+      this.#view.y += anchor.y - moved.y;
+    }
     this.apply();
   }
   panBy(dxPixels, dyPixels) {
-    const rect = this.#svg.getBoundingClientRect();
-    const pixelsPerUnit = rect.width > 0 ? rect.width / this.#view.w : 1;
+    const scale = this.#svg.getScreenCTM()?.a;
+    const pixelsPerUnit = scale && scale > 0 ? scale : 1;
     this.#view.x -= dxPixels / pixelsPerUnit;
     this.#view.y -= dyPixels / pixelsPerUnit;
     this.apply();
@@ -381,8 +392,8 @@ function readWidgetStyle(surface) {
     return DEFAULT_ROLLING_NUMBER_STYLE;
   }
 }
-function cellsOf(box, plain) {
-  const size = Math.max(1, Math.min(box.width, box.height) * 0.28);
+function cellsOf(box, plain, fontSize = 0) {
+  const size = fontSize > 0 ? fontSize : Math.max(1, Math.min(box.width, box.height) * 0.28);
   return {
     size,
     plain,
@@ -468,7 +479,7 @@ function flattenRollingNumbers(svg) {
     const value = surface.getAttribute("data-sf-widget-value") ?? "";
     const style = readWidgetStyle(surface);
     const label = surface.querySelector("div > span:not([data-sf-rolling-digit])")?.textContent ?? "";
-    const cells = cellsOf(box, style.variant === "plain");
+    const cells = cellsOf(box, style.variant === "plain", style.fontSize);
     const labelBlock = label ? cells.size * 0.3 : 0;
     const rowWidth = value.length * cells.cellWidth + Math.max(0, value.length - 1) * cells.gap;
     const left = box.x + (box.width - rowWidth) / 2;
@@ -2024,6 +2035,7 @@ uniform vec3 uColor;
 uniform vec3 uAccent;
 uniform vec3 uGlow;
 uniform vec3 uCore;
+uniform vec3 uPeak;
 varying vec2 vUv;
 
 float wireAt(float at, float lineAt, float depth, float radius, float knob, float spread) {
@@ -2096,7 +2108,8 @@ void main() {
   vec2 q = abs(vec2(across - (tickEnd - tickLength * 0.5), tickAlong)) - vec2(tickLength * 0.5, halfTick) + corner;
   float edge = length(max(q, 0.0)) + min(max(q.x, q.y), 0.0) - corner;
   float tick = (1.0 - smoothstep(-0.75, 0.75, edge)) * inRange * mix(0.4, 1.0, tickBump);
-  vec3 tickColor = mix(uColor, vec3(1.0), tickBump);
+  vec3 peakColor = dot(uPeak, uPeak) > 0.0 ? uPeak : vec3(1.0);
+  vec3 tickColor = mix(uColor, peakColor, tickBump);
 
   float alpha = clamp(tick + line * 0.95 + glow + core, 0.0, 1.0);
   vec3 rgb = tickColor * tick + lineColor * line * 0.95 + glowColor * glow + coreColor * core;
@@ -3661,5 +3674,5 @@ function createViewer(options) {
 }
 
 export { SHADER_DEFAULTS, connectInteraction, createViewer, registerShaderProgram, shaderProgram };
-//# sourceMappingURL=chunk-N6WVHOUQ.js.map
-//# sourceMappingURL=chunk-N6WVHOUQ.js.map
+//# sourceMappingURL=chunk-CSXQD3ON.js.map
+//# sourceMappingURL=chunk-CSXQD3ON.js.map