@weasel-js/routing 1.5.2 → 1.6.1

package/dist/react.js

@@ -1,4 +1,4 @@
-import { createDispatcher, buildDepsFromRequires, validateActionId, validateActionDefaultBinding, scopeBindings, liveScope, offhandKeyFor, makeToolOffhandAction, buildToolOffhandBindings, isDev, reportRouteConflicts, dlog, isEditableTarget, clientToCanvasRect, openPointerSession, pointerGestureId, itemsFromDataTransfer, itemsFromClipboardData } from './chunk-H5AGTB2J.js';
+import { createDispatcher, buildDepsFromRequires, validateActionId, validateActionDefaultBinding, scopeBindings, liveScope, offhandKeyFor, makeToolOffhandAction, buildToolOffhandBindings, isDev, reportRouteConflicts, dlog, isEditableTarget, clientToCanvasRect, openPointerSession, pointerGestureId, itemsFromDataTransfer, itemsFromClipboardData } from './chunk-VEC3ACV5.js';
 import { createContext, useState, useCallback, useMemo, useContext, useRef, useEffect } from 'react';
 import { jsx, Fragment } from 'react/jsx-runtime';
 import { resolveCursorTier } from '@weasel-js/cursor';
@@ -137,6 +137,7 @@ function useGestureDispatcher(opts) {
   const { canvasRef, actions, toolsById, enabled = true, keyboard = true, affordanceAt, classifyTarget, dispatcher: dispatcherOpt, clientToWorld, requestRedraw, paintedCursor, getRuleCtx, onDoubleClick, views, channels } = opts;
   const pointerChannel = channels?.pointer !== false;
   const wheelChannel = channels?.wheel !== false;
+  const pinchChannel = channels?.pinch !== false;
   const contextMenuChannel = channels?.contextMenu !== false;
   const ingestChannel = channels?.ingest !== false;
   const onDoubleClickRef = useRef(onDoubleClick);
@@ -232,7 +233,8 @@ function useGestureDispatcher(opts) {
     const ctxNow = () => ({
       ...ctxRef.current,
       depRegistry: routedDeps,
-      getRuleCtx: routedRuleCtx
+      getRuleCtx: routedRuleCtx,
+      viewId: target().id
     });
     const canvas = canvasRef.current;
     const toWorld = (cx, cy) => {
@@ -261,6 +263,14 @@ function useGestureDispatcher(opts) {
       );
       return { centroid: toCanvasLocal(centroid), spread };
     };
+    let pinchLive = false;
+    let pinchScale = 1;
+    let pinchRotation = 0;
+    const endPinch = () => {
+      pinchLive = false;
+      pinchScale = 1;
+      pinchRotation = 0;
+    };
     let multiTouchStart = null;
     const TAP_THRESHOLD_PX = 8;
     const DRAG_THRESHOLD_PX = 4;
@@ -359,6 +369,7 @@ function useGestureDispatcher(opts) {
       heldKeys.delete(e.key);
     };
     const onWindowBlur = () => {
+      endPinch();
       for (const p of [...held.values()]) p.session.cancel();
       for (const key of heldKeys) {
         const ev = {
@@ -375,6 +386,11 @@ function useGestureDispatcher(opts) {
       heldKeys.clear();
     };
     const onWheel = (e) => {
+      if (pinchLive && e.ctrlKey) {
+        e.preventDefault();
+        e.stopPropagation();
+        return;
+      }
       routeAt(null, e.clientX, e.clientY);
       const rect = canvas?.getBoundingClientRect();
       const [localX, localY] = rect ? clientToCanvasRect(rect, e.clientX, e.clientY) : [e.clientX, e.clientY];
@@ -401,6 +417,57 @@ function useGestureDispatcher(opts) {
         e.stopPropagation();
       }
     };
+    const pinchEventOf = (e, scale, rotation) => {
+      const g = e;
+      const rect = canvas?.getBoundingClientRect();
+      const cx = typeof g.clientX === "number" ? g.clientX : rect ? rect.left + rect.width / 2 : 0;
+      const cy = typeof g.clientY === "number" ? g.clientY : rect ? rect.top + rect.height / 2 : 0;
+      routeAt(null, cx, cy);
+      const [localX, localY] = rect ? clientToCanvasRect(rect, cx, cy) : [cx, cy];
+      const hitPoint = toWorld(cx, cy);
+      const affordance = target().affordanceAt?.(hitPoint) ?? void 0;
+      const body = target().classifyTarget?.(hitPoint);
+      return {
+        kind: "pinch",
+        altKey: g.altKey === true,
+        ctrlKey: g.ctrlKey === true,
+        metaKey: g.metaKey === true,
+        shiftKey: g.shiftKey === true,
+        scale,
+        rotation,
+        clientX: localX,
+        clientY: localY,
+        ...affordance !== void 0 ? { affordance } : {},
+        ...body?.body !== void 0 ? { bodyTarget: body.body } : {},
+        ...body?.kind !== void 0 ? { bodyKind: body.kind } : {}
+      };
+    };
+    const onGestureStart = (e) => {
+      endPinch();
+      const probe = pinchEventOf(e, 1, 0);
+      if (dispatcherNow().resolveOnly(probe, ctxNow()) === null) return;
+      pinchLive = true;
+      e.preventDefault();
+    };
+    const onGestureChange = (e) => {
+      const g = e;
+      const scale = typeof g.scale === "number" && g.scale > 0 ? g.scale : pinchScale;
+      const rotation = typeof g.rotation === "number" ? g.rotation : pinchRotation;
+      const step = scale / pinchScale;
+      const turn = rotation - pinchRotation;
+      pinchScale = scale;
+      pinchRotation = rotation;
+      if (dispatch(pinchEventOf(e, step, turn)) === "handled") {
+        pinchLive = true;
+        e.preventDefault();
+      } else if (pinchLive) {
+        e.preventDefault();
+      }
+    };
+    const onGestureEnd = (e) => {
+      if (pinchLive) e.preventDefault();
+      endPinch();
+    };
     const onPointerDown = (e) => {
       if ((e.button ?? 0) !== 0) return;
       if (!canvas) return;
@@ -858,6 +925,11 @@ function useGestureDispatcher(opts) {
       canvas?.addEventListener("pointermove", onHoverMove);
     }
     if (wheelChannel) canvas?.addEventListener("wheel", onWheel, { passive: false });
+    if (pinchChannel) {
+      canvas?.addEventListener("gesturestart", onGestureStart);
+      canvas?.addEventListener("gesturechange", onGestureChange);
+      canvas?.addEventListener("gestureend", onGestureEnd);
+    }
     if (contextMenuChannel) canvas?.addEventListener("contextmenu", onContextMenu);
     if (ingestChannel) {
       canvas?.addEventListener("dragenter", onDragOver);
@@ -876,6 +948,9 @@ function useGestureDispatcher(opts) {
       window.removeEventListener("keyup", scheduleHoverCursorRefresh);
       canvas?.removeEventListener("pointerleave", onHoverPointerLeave);
       canvas?.removeEventListener("wheel", onWheel);
+      canvas?.removeEventListener("gesturestart", onGestureStart);
+      canvas?.removeEventListener("gesturechange", onGestureChange);
+      canvas?.removeEventListener("gestureend", onGestureEnd);
       canvas?.removeEventListener("pointerdown", onPointerDown);
       canvas?.removeEventListener("pointermove", onHoverMove);
       canvas?.removeEventListener("contextmenu", onContextMenu);
@@ -892,7 +967,7 @@ function useGestureDispatcher(opts) {
       held.clear();
       for (const d of allDispatchers()) d.cancelAll("cancel");
     };
-  }, [enabled, keyboard, canvasRef, pointerChannel, wheelChannel, contextMenuChannel, ingestChannel]);
+  }, [enabled, keyboard, canvasRef, pointerChannel, wheelChannel, pinchChannel, contextMenuChannel, ingestChannel]);
 }
 var ActionsContext = createContext(null);
 function useMuted(base) {
@@ -1117,6 +1192,39 @@ function useAction(action) {
     return reg.register(action);
   }, [reg, action]);
 }
+function useOngoingAction(actionId) {
+  const reg = useActionsRegistry();
+  const regRef = useRef(reg);
+  regRef.current = reg;
+  const idRef = useRef(actionId);
+  idRef.current = actionId;
+  const ctrlRef = useRef(null);
+  const edit = useMemo(() => {
+    const end = (reason) => {
+      const ctrl = ctrlRef.current;
+      ctrlRef.current = null;
+      ctrl?.end(reason);
+    };
+    return {
+      input(params) {
+        if (ctrlRef.current) ctrlRef.current.update(params);
+        else ctrlRef.current = regRef.current?.begin(idRef.current, params) ?? null;
+      },
+      commit(params) {
+        if (params !== void 0) {
+          if (ctrlRef.current) ctrlRef.current.update(params);
+          else ctrlRef.current = regRef.current?.begin(idRef.current, params) ?? null;
+        }
+        end("commit");
+      },
+      cancel() {
+        end("cancel");
+      }
+    };
+  }, []);
+  useEffect(() => () => edit.commit(), [edit, actionId]);
+  return edit;
+}
 function useContributions(opts) {
   const ctx = useActiveToolContext();
   const actionsRegistry = useActionsRegistry();
@@ -1313,6 +1421,6 @@ function useTools(opts) {
   );
 }
 
-export { ActionsProvider, ActionsScope, ActiveToolContextProvider, ActiveToolContextProviderIfRoot, DepRegistryProvider, useAction, useActionsRegistry, useActiveToolContext, useContributions, useDepRegistry, useDepSource, useGestureDispatcher, useOptionalActiveToolContext, useOptionalDepRegistry, useTools };
+export { ActionsProvider, ActionsScope, ActiveToolContextProvider, ActiveToolContextProviderIfRoot, DepRegistryProvider, useAction, useActionsRegistry, useActiveToolContext, useContributions, useDepRegistry, useDepSource, useGestureDispatcher, useOngoingAction, useOptionalActiveToolContext, useOptionalDepRegistry, useTools };
 //# sourceMappingURL=react.js.map
 //# sourceMappingURL=react.js.map