@jsenv/dom 0.17.94 → 0.17.95

package/dist/jsenv_dom.js

@@ -13253,6 +13253,14 @@ const startDragToTravel = (
   if (movingAxis && !axesLeft.includes(movingAxis)) {
     return null;
   }
+  // A link and an image are draggable without anyone asking, and the browser
+  // starts that drag about 3px in, under the threshold below: it cancels the
+  // pointer and keeps the rest of the press, so the travel never forms. Refused
+  // for this press only — one excluded above, or left to a box inside, keeps it.
+  const refuseNativeDrag = (dragStartEvent) => {
+    dragStartEvent.preventDefault();
+  };
+  element.addEventListener("dragstart", refuseNativeDrag);
   const startThreshold =
     pointerDownEvent.pointerType === "mouse"
       ? DRAG_START_THRESHOLD
@@ -13278,6 +13286,7 @@ const startDragToTravel = (
     clearTimeout(holdTimeout);
     document.documentElement.removeAttribute(GESTURE_ATTRIBUTE);
     document.documentElement.removeAttribute(WALKING_ATTRIBUTE);
+    element.removeEventListener("dragstart", refuseNativeDrag);
     window.removeEventListener("pointerup", onPressOver);
     window.removeEventListener("pointercancel", onPressOver);
   };
@@ -14091,10 +14100,11 @@ const findPanZoomSurface = (element) => {
  * @param {boolean|"kept"} [options.afterHold=false] Whether a FINGER must be held
  *   still before it pans, the page keeping its scroll until then. For a surface
  *   standing in something that scrolls; a mouse pans by travelling either way.
- *   `"kept"` asks for the wait once: from the moment the surface has the hand it
- *   pans on contact, and it asks again only after a pointer has gone down away
- *   from it. `data-hand-kept` is on the element for as long as it holds the hand
- *   that way, a hand touching it or not.
+ *   `"kept"` asks for the wait once: from the moment a finger has given the
+ *   surface the hand it pans on contact, and it asks again only after a pointer
+ *   has gone down away from it. `data-hand-kept` is on the element for as long
+ *   as it holds the hand that way, a hand touching it or not; a mouse pan never
+ *   sets it.
  * @param {"auto"|"always"} [options.wheelZoom="auto"] Whether a BARE wheel zooms.
  *   `"auto"` gives it to whatever scrolls around the surface when there is one,
  *   and zooms when there is none; `"always"` takes it back, for a surface that
@@ -14115,8 +14125,8 @@ const installPanZoom = (
   } = {},
 ) => {
   // Whether a finger still owes the wait. Constant under a plain `afterHold`;
-  // under `"kept"` it is spent the first time the surface is given the hand and
-  // asked for again once the hand has gone elsewhere.
+  // under `"kept"` it is spent the first time a finger gives the surface the hand
+  // and asked for again once the hand has gone elsewhere.
   let holdIsOwed = Boolean(afterHold);
   const reflectHoldOwed = () => {
     // What a touch may do is settled before it lands, so the mode is in the DOM
@@ -14195,10 +14205,14 @@ const installPanZoom = (
 
   const activate = (anchorWhere, event) => {
     active = true;
-    if (afterHold === "kept" && holdIsOwed && onPan) {
-      // Asked for and given: whatever proved it — the hold, a second finger, a
-      // mouse travelling — the surface is the hand's from here. What it keeps
-      // is the pan on contact, which a surface that does not pan has none of.
+    if (
+      afterHold === "kept" &&
+      [...pointers.values()].some((pointer) => pointer.waitsForHold)
+    ) {
+      // Spent by the finger that owed it, whether the hold or a second finger
+      // proved it: the surface is the hand's from here. A mouse never owed the
+      // wait, so it neither spends it nor marks it — and a surface that does not
+      // pan asks no finger to wait, having no pan on contact to keep.
       keepTheHand();
     }
     for (const pointer of pointers.values()) {
@@ -14379,6 +14393,16 @@ const installPanZoom = (
     }
   };
 
+  // A link and an image are draggable without anyone asking, and the browser
+  // starts that drag about 3px in, under `threshold`: it cancels the pointer and
+  // keeps the rest of the press, so the pan never forms. Refused only while the
+  // surface reads a press — one yielded to something inside never got here.
+  const refuseNativeDrag = (dragStartEvent) => {
+    if (pointers.size > 0) {
+      dragStartEvent.preventDefault();
+    }
+  };
+
   // What the first event of the burst going on settled: a key let go of (or
   // pressed) halfway through must not hand a zoom to the page mid-gesture, and
   // a burst has no end but a silence.
@@ -14448,6 +14472,10 @@ const installPanZoom = (
   element.addEventListener("touchmove", preventTouchScroll, {
     passive: false,
   });
+  // Without a pan, one pointer is whatever else reads it, its drag included.
+  if (onPan) {
+    element.addEventListener("dragstart", refuseNativeDrag);
+  }
   if (onZoom) {
     element.addEventListener("wheel", onWheel, { passive: false });
   }
@@ -14459,6 +14487,7 @@ const installPanZoom = (
     element.removeEventListener("pointerdown", onPointerDown);
     element.removeEventListener("lostpointercapture", onLostPointerCapture);
     element.removeEventListener("touchmove", preventTouchScroll);
+    element.removeEventListener("dragstart", refuseNativeDrag);
     element.removeEventListener("wheel", onWheel);
     window.removeEventListener("pointerdown", onPointerDownAway, true);
     element.removeAttribute(SURFACE_ATTRIBUTE);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/dom",
-  "version": "0.17.94",
+  "version": "0.17.95",
   "type": "module",
   "description": "DOM utilities for writing frontend code",
   "repository": {