@imperosoft/cris-webui-components 1.1.3 → 1.1.4

package/dist/index.mjs

@@ -102,6 +102,8 @@ function CrisButton({
   const touchStartedHereRef = useRef(false);
   const touchStartYRef = useRef(0);
   const touchMovedRef = useRef(false);
+  const touchPressTimerRef = useRef(null);
+  const touchPressedRef = useRef(false);
   const feedbackJoin = joinFeedback ?? join;
   const feedback = useDigital(feedbackJoin ?? 0);
   const enabledJoin = useDigital(joinEnable ?? 0);
@@ -125,6 +127,10 @@ function CrisButton({
   }, [isVisible, join, smartId, dSet]);
   useEffect(() => {
     return () => {
+      if (touchPressTimerRef.current) {
+        clearTimeout(touchPressTimerRef.current);
+        touchPressTimerRef.current = null;
+      }
       if (pressedRef.current && join != null && smartId == null) {
         log("UNMOUNT RELEASE - component unmounting while pressed");
         dSet(join, false);
@@ -185,40 +191,77 @@ function CrisButton({
     }
   };
   const SCROLL_THRESHOLD = 8;
+  const PRESS_DELAY = 80;
+  const cancelPressTimer = () => {
+    if (touchPressTimerRef.current) {
+      clearTimeout(touchPressTimerRef.current);
+      touchPressTimerRef.current = null;
+    }
+  };
   const handleTouchStart = (e) => {
     log("handleTouchStart");
     touchStart();
     touchingRef.current = true;
     touchStartedHereRef.current = true;
     touchMovedRef.current = false;
+    touchPressedRef.current = false;
     touchStartYRef.current = e.touches[0]?.clientY ?? 0;
+    cancelPressTimer();
+    touchPressTimerRef.current = setTimeout(() => {
+      touchPressTimerRef.current = null;
+      if (touchStartedHereRef.current && !touchMovedRef.current) {
+        touchPressedRef.current = true;
+        handlePress();
+        log("delayed press fired");
+      }
+    }, PRESS_DELAY);
   };
   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);
+      cancelPressTimer();
+      if (touchPressedRef.current) {
+        touchPressedRef.current = false;
+        handleRelease();
+        log("touchMove: scroll detected after press, releasing");
+      } else {
+        log("touchMove: scroll detected, press cancelled");
+      }
     }
   };
   const handleTouchEnd = () => {
-    log("handleTouchEnd", { touchStartedHere: touchStartedHereRef.current, moved: touchMovedRef.current });
+    log("handleTouchEnd", { started: touchStartedHereRef.current, moved: touchMovedRef.current, pressed: touchPressedRef.current });
+    cancelPressTimer();
     touchEnd();
     touchingRef.current = true;
-    if (touchStartedHereRef.current && !touchMovedRef.current) {
+    if (!touchStartedHereRef.current || touchMovedRef.current) {
       touchStartedHereRef.current = false;
-      handlePress();
+      touchPressedRef.current = false;
+      log("SKIPPED: touch moved or did not start here");
+      return;
+    }
+    touchStartedHereRef.current = false;
+    if (touchPressedRef.current) {
+      touchPressedRef.current = false;
       handleRelease();
     } else {
-      touchStartedHereRef.current = false;
-      log("SKIPPED: touch moved or did not start here");
+      touchPressedRef.current = false;
+      handlePress();
+      handleRelease();
     }
   };
   const handleTouchCancel = () => {
     log("handleTouchCancel (scroll detected)");
+    cancelPressTimer();
     touchEnd();
     touchingRef.current = true;
     touchStartedHereRef.current = false;
+    if (touchPressedRef.current) {
+      touchPressedRef.current = false;
+      handleRelease();
+    }
     touchMovedRef.current = false;
   };
   const handleMouseDown = () => {