@imperosoft/cris-webui-components 1.1.2-beta.12 → 1.1.2-beta.13

package/dist/index.js

@@ -137,6 +137,8 @@ function CrisButton({
   const pressedRef = (0, import_react.useRef)(false);
   const touchingRef = (0, import_react.useRef)(false);
   const touchStartedHereRef = (0, import_react.useRef)(false);
+  const touchStartYRef = (0, import_react.useRef)(0);
+  const touchMovedRef = (0, import_react.useRef)(false);
   const feedbackJoin = joinFeedback ?? join;
   const feedback = (0, import_cris_webui_ch5_core.useDigital)(feedbackJoin ?? 0);
   const enabledJoin = (0, import_cris_webui_ch5_core.useDigital)(joinEnable ?? 0);
@@ -219,22 +221,34 @@ function CrisButton({
       dSet(join, false);
     }
   };
-  const handleTouchStart = () => {
+  const SCROLL_THRESHOLD = 8;
+  const handleTouchStart = (e) => {
     log("handleTouchStart");
     touchStart();
     touchingRef.current = true;
     touchStartedHereRef.current = true;
+    touchMovedRef.current = false;
+    touchStartYRef.current = e.touches[0]?.clientY ?? 0;
+  };
+  const handleTouchMove = (e) => {
+    if (touchMovedRef.current) return;
+    const dy = Math.abs((e.touches[0]?.clientY ?? 0) - touchStartYRef.current);
+    if (dy > SCROLL_THRESHOLD) {
+      touchMovedRef.current = true;
+      log("touchMove: scroll detected, dy:", dy);
+    }
   };
   const handleTouchEnd = () => {
-    log("handleTouchEnd", { touchStartedHereRef: touchStartedHereRef.current });
+    log("handleTouchEnd", { touchStartedHere: touchStartedHereRef.current, moved: touchMovedRef.current });
     touchEnd();
     touchingRef.current = true;
-    if (touchStartedHereRef.current) {
+    if (touchStartedHereRef.current && !touchMovedRef.current) {
       touchStartedHereRef.current = false;
       handlePress();
       handleRelease();
     } else {
-      log("SKIPPED: touch did not start here");
+      touchStartedHereRef.current = false;
+      log("SKIPPED: touch moved or did not start here");
     }
   };
   const handleTouchCancel = () => {
@@ -242,6 +256,7 @@ function CrisButton({
     touchEnd();
     touchingRef.current = true;
     touchStartedHereRef.current = false;
+    touchMovedRef.current = false;
   };
   const handleMouseDown = () => {
     if (isTouchActive() || touchingRef.current) return;
@@ -342,7 +357,7 @@ function CrisButton({
         cursor: suppressKeyClicks ? "default" : "pointer",
         position: isFreePositioned ? void 0 : "relative",
         overflow: isFreePositioned ? void 0 : "hidden",
-        touchAction: "pan-y",
+        touchAction: "pan-x pan-y",
         userSelect: "none",
         WebkitUserSelect: "none"
       },
@@ -350,6 +365,7 @@ function CrisButton({
       onMouseUp: handleMouseUp,
       onMouseLeave: handleMouseLeave,
       onTouchStart: handleTouchStart,
+      onTouchMove: handleTouchMove,
       onTouchEnd: handleTouchEnd,
       onTouchCancel: handleTouchCancel,
       children: [