@basic-ui/core 0.0.34 → 0.0.37

package/build/esm/hooks/useGestureHandlers.js

@@ -15,14 +15,16 @@ export const initialGestureHandlersState = {
   yPrev: 0,
   yVelocity: 0,
   startTime: 0,
-  down: false
+  down: false,
+  scrollLocked: false
 };
 const FRAMERATE_CONST = 1000 / 60; // 60 fps
 
 const VELOCITY_DEPR_FACTOR = FRAMERATE_CONST * 2;
 export function gestureHandlers(set, containerRef, options = {}) {
   const {
-    ensureTargetIsContainer = false
+    ensureTargetIsContainer = false,
+    minTouchDelta = 0
   } = options; // Common handlers
 
   const handleUp = () => {
@@ -66,7 +68,8 @@ export function gestureHandlers(set, containerRef, options = {}) {
         yInitial: pageY,
         yPrev: pageY,
         startTime: Date.now(),
-        down: true
+        down: true,
+        scrollLocked: false
       });
 
       return newState;
@@ -95,14 +98,23 @@ export function gestureHandlers(set, containerRef, options = {}) {
     }
 
     set(state => {
+      function getDeltaSum(currentPos, initialPos, prevPos) {
+        if (state.scrollLocked || Math.abs(currentPos - initialPos) >= minTouchDelta) {
+          state.scrollLocked = true;
+          return currentPos - prevPos;
+        }
+
+        return 0;
+      }
+
       const target = containerRef && containerRef.current || e.target;
       const deltaTime = Date.now() - state.startTime;
       const width = target ? target.offsetWidth : NaN;
-      const xDelta = pageX - state.xInitial;
+      const xDelta = state.xDelta + getDeltaSum(pageX, state.xInitial, state.x);
       const xDeltaPercent = xDelta * 100 / width;
       const xVelocity = calcVelocity(xDelta, deltaTime, state.xVelocity);
       const height = target ? target.offsetHeight : NaN;
-      const yDelta = pageY - state.yInitial;
+      const yDelta = state.yDelta + getDeltaSum(pageY, state.yInitial, state.y);
       const yDeltaPercent = yDelta * 100 / height;
       const yVelocity = calcVelocity(yDelta, deltaTime, state.yVelocity);
 

package/build/esm/hooks/useGestureHandlers.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useGestureHandlers.ts"],"names":["useRef","initialGestureHandlersState","target","x","xDelta","xDeltaPercent","xInitial","xPrev","xVelocity","y","yDelta","yDeltaPercent","yInitial","yPrev","yVelocity","startTime","down","FRAMERATE_CONST","VELOCITY_DEPR_FACTOR","gestureHandlers","set","containerRef","options","ensureTargetIsContainer","handleUp","state","deltaTime","Date","now","calcVelocity","newState","handleDown","e","pageX","pageY","deltaSpace","prevVelocity","speed","depr","Math","min","handleMove","cancelable","preventDefault","current","width","offsetWidth","NaN","height","offsetHeight","handleTouchMove","touches","item","handleTouchStart","length","window","addEventListener","passive","handleTouchEnd","removeEventListener","handleMouseDown","button","handleMouseUp","onMouseDown","onTouchStart","useGestureHandlers","onGesture","cb","handlers"],"mappings":"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","sourcesContent":["import { useRef } from 'react';\nimport type * as React from 'react';\n\nexport interface GestureHandlersState {\n  target: null | EventTarget;\n  x: number;\n  xDelta: number;\n  xDeltaPercent: number;\n  xInitial: number;\n  xPrev: number;\n  xVelocity: number;\n  y: number;\n  yDelta: number;\n  yDeltaPercent: number;\n  yInitial: number;\n  yPrev: number;\n  yVelocity: number;\n  startTime: number;\n  down: boolean;\n}\n\ntype SetStateFunc<S> = (\n  state: (prevState: Readonly<S>) => S,\n  callback?: () => void\n) => void;\n\nexport interface GestureHandlersReturn {\n  onMouseDown: (e: React.MouseEvent<HTMLElement>) => void;\n  onTouchStart: (e: React.TouchEvent<HTMLElement>) => void;\n}\n\nexport interface GestureHandlerOptions {\n  ensureTargetIsContainer?: boolean;\n}\n\nexport const initialGestureHandlersState: GestureHandlersState = {\n  target: null,\n  x: 0,\n  xDelta: 0,\n  xDeltaPercent: 0,\n  xInitial: 0,\n  xPrev: 0,\n  xVelocity: 0,\n  y: 0,\n  yDelta: 0,\n  yDeltaPercent: 0,\n  yInitial: 0,\n  yPrev: 0,\n  yVelocity: 0,\n  startTime: 0,\n  down: false,\n};\n\nconst FRAMERATE_CONST = 1000 / 60; // 60 fps\nconst VELOCITY_DEPR_FACTOR = FRAMERATE_CONST * 2;\n\nexport function gestureHandlers(\n  set: SetStateFunc<GestureHandlersState>,\n  containerRef?: React.MutableRefObject<HTMLElement | null>,\n  options: GestureHandlerOptions = {}\n): GestureHandlersReturn {\n  const { ensureTargetIsContainer = false } = options;\n\n  // Common handlers\n  const handleUp = () => {\n    set((state: GestureHandlersState) => {\n      const deltaTime = Date.now() - state.startTime;\n      const xDelta = state.x - state.xInitial;\n      const yDelta = state.y - state.yInitial;\n      const xVelocity = calcVelocity(xDelta, deltaTime, state.xVelocity);\n      const yVelocity = calcVelocity(yDelta, deltaTime, state.yVelocity);\n      const newState: GestureHandlersState = {\n        ...state,\n        xVelocity,\n        yVelocity,\n        target: null,\n        down: false,\n      };\n\n      return newState;\n    });\n  };\n\n  const handleDown = (e: MouseEvent) => {\n    const { target, pageX, pageY } = e;\n\n    set((state: GestureHandlersState) => {\n      const newState = {\n        ...state,\n        target,\n        x: pageX,\n        xDelta: 0,\n        xDeltaPercent: 0,\n        xVelocity: 0,\n        xInitial: pageX,\n        xPrev: pageX,\n        y: pageY,\n        yDelta: 0,\n        yDeltaPercent: 0,\n        yVelocity: 0,\n        yInitial: pageY,\n        yPrev: pageY,\n        startTime: Date.now(),\n        down: true,\n      };\n\n      return newState;\n    });\n  };\n\n  function calcVelocity(\n    deltaSpace: number,\n    deltaTime: number,\n    prevVelocity: number\n  ) {\n    if (deltaTime < 1) {\n      deltaTime = 1;\n    }\n    const speed = deltaSpace / deltaTime;\n    const depr = 0.5 + Math.min(deltaTime / VELOCITY_DEPR_FACTOR, 0.5);\n    return speed * depr + prevVelocity * (1 - depr);\n  }\n\n  function handleMove(e: MouseEvent) {\n    const { pageX, pageY } = e;\n    if (e.cancelable) {\n      // prevent drag & drop behaviour from browser\n      e.preventDefault && e.preventDefault();\n    }\n\n    set((state: GestureHandlersState) => {\n      const target =\n        (containerRef && containerRef.current) || (e as any).target;\n\n      const deltaTime = Date.now() - state.startTime;\n\n      const width = target ? target.offsetWidth : NaN;\n      const xDelta = pageX - state.xInitial;\n      const xDeltaPercent = (xDelta * 100) / width;\n      const xVelocity = calcVelocity(xDelta, deltaTime, state.xVelocity);\n\n      const height = target ? target.offsetHeight : NaN;\n      const yDelta = pageY - state.yInitial;\n      const yDeltaPercent = (yDelta * 100) / height;\n      const yVelocity = calcVelocity(yDelta, deltaTime, state.yVelocity);\n\n      const newState = {\n        ...state,\n        xDelta,\n        xDeltaPercent,\n        x: pageX,\n        xPrev: state.x,\n        xVelocity,\n        yDelta,\n        yDeltaPercent,\n        y: pageY,\n        yPrev: state.y,\n        yVelocity,\n      };\n\n      return newState;\n    });\n  }\n\n  // Touch handlers\n\n  /* eslint-disable @typescript-eslint/no-use-before-define */\n  function handleTouchMove(e: TouchEvent) {\n    if (e.cancelable) {\n      // prevent drag & drop behaviour from browser\n      e.preventDefault();\n    }\n    handleMove(e.touches.item(0) as any);\n  }\n\n  function handleTouchStart(e: React.TouchEvent<HTMLElement>) {\n    // making sure we're not dragging the element when more than one finger press the screen\n    const { touches } = e;\n    if (touches.length > 1) {\n      return;\n    }\n\n    if (\n      ensureTargetIsContainer &&\n      containerRef &&\n      e.target !== containerRef.current\n    ) {\n      return;\n    }\n\n    window.addEventListener('touchmove', handleTouchMove, { passive: false });\n    window.addEventListener('touchend', handleTouchEnd);\n    window.addEventListener('touchcancel', handleTouchEnd);\n    handleDown(e.touches.item(0) as any);\n  }\n\n  function handleTouchEnd() {\n    window.removeEventListener('touchmove', handleTouchMove);\n    window.removeEventListener('touchend', handleTouchEnd);\n    window.removeEventListener('touchcancel', handleTouchEnd);\n    handleUp();\n  }\n\n  // Mouse handlers\n  function handleMouseDown(e: React.MouseEvent<HTMLElement>) {\n    if (\n      ensureTargetIsContainer &&\n      containerRef &&\n      e.target !== containerRef.current\n    ) {\n      return;\n    }\n\n    if (e.button === 0) {\n      window.addEventListener('mousemove', handleMove);\n      window.addEventListener('mouseup', handleMouseUp);\n      handleDown(e as any);\n    }\n  }\n\n  function handleMouseUp() {\n    window.removeEventListener('mousemove', handleMove);\n    window.removeEventListener('mouseup', handleMouseUp);\n    handleUp();\n  }\n  /* eslint-enable @typescript-eslint/no-use-before-define */\n\n  return {\n    onMouseDown: handleMouseDown,\n    onTouchStart: handleTouchStart,\n  };\n}\n\nexport const useGestureHandlers = (\n  containerRef: React.MutableRefObject<HTMLElement | null> | undefined,\n  onGesture: (e: GestureHandlersState) => void,\n  options: GestureHandlerOptions = {}\n) => {\n  const state = useRef({ ...initialGestureHandlersState });\n\n  const set = (\n    cb: (prevState: GestureHandlersState) => GestureHandlersState\n  ) => {\n    state.current = cb(state.current);\n    onGesture && onGesture(state.current);\n\n    return state.current;\n  };\n\n  const handlers = gestureHandlers(set, containerRef, options);\n\n  return { state: state.current, handlers };\n};\n"],"file":"useGestureHandlers.js"}
+{"version":3,"sources":["../../../src/hooks/useGestureHandlers.ts"],"names":["useRef","initialGestureHandlersState","target","x","xDelta","xDeltaPercent","xInitial","xPrev","xVelocity","y","yDelta","yDeltaPercent","yInitial","yPrev","yVelocity","startTime","down","scrollLocked","FRAMERATE_CONST","VELOCITY_DEPR_FACTOR","gestureHandlers","set","containerRef","options","ensureTargetIsContainer","minTouchDelta","handleUp","state","deltaTime","Date","now","calcVelocity","newState","handleDown","e","pageX","pageY","deltaSpace","prevVelocity","speed","depr","Math","min","handleMove","cancelable","preventDefault","getDeltaSum","currentPos","initialPos","prevPos","abs","current","width","offsetWidth","NaN","height","offsetHeight","handleTouchMove","touches","item","handleTouchStart","length","window","addEventListener","passive","handleTouchEnd","removeEventListener","handleMouseDown","button","handleMouseUp","onMouseDown","onTouchStart","useGestureHandlers","onGesture","cb","handlers"],"mappings":"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","sourcesContent":["import { useRef } from 'react';\nimport type * as React from 'react';\n\nexport interface GestureHandlersState {\n  target: null | EventTarget;\n  x: number;\n  xDelta: number;\n  xDeltaPercent: number;\n  xInitial: number;\n  xPrev: number;\n  xVelocity: number;\n  y: number;\n  yDelta: number;\n  yDeltaPercent: number;\n  yInitial: number;\n  yPrev: number;\n  yVelocity: number;\n  startTime: number;\n  down: boolean;\n  scrollLocked: boolean;\n}\n\ntype SetStateFunc<S> = (\n  state: (prevState: Readonly<S>) => S,\n  callback?: () => void\n) => void;\n\nexport interface GestureHandlersReturn {\n  onMouseDown: (e: React.MouseEvent<HTMLElement>) => void;\n  onTouchStart: (e: React.TouchEvent<HTMLElement>) => void;\n}\n\nexport interface GestureHandlerOptions {\n  ensureTargetIsContainer?: boolean;\n  minTouchDelta?: number;\n}\n\nexport const initialGestureHandlersState: GestureHandlersState = {\n  target: null,\n  x: 0,\n  xDelta: 0,\n  xDeltaPercent: 0,\n  xInitial: 0,\n  xPrev: 0,\n  xVelocity: 0,\n  y: 0,\n  yDelta: 0,\n  yDeltaPercent: 0,\n  yInitial: 0,\n  yPrev: 0,\n  yVelocity: 0,\n  startTime: 0,\n  down: false,\n  scrollLocked: false,\n};\n\nconst FRAMERATE_CONST = 1000 / 60; // 60 fps\nconst VELOCITY_DEPR_FACTOR = FRAMERATE_CONST * 2;\n\nexport function gestureHandlers(\n  set: SetStateFunc<GestureHandlersState>,\n  containerRef?: React.MutableRefObject<HTMLElement | null>,\n  options: GestureHandlerOptions = {}\n): GestureHandlersReturn {\n  const { ensureTargetIsContainer = false, minTouchDelta = 0 } = options;\n\n  // Common handlers\n  const handleUp = () => {\n    set((state: GestureHandlersState) => {\n      const deltaTime = Date.now() - state.startTime;\n      const xDelta = state.x - state.xInitial;\n      const yDelta = state.y - state.yInitial;\n      const xVelocity = calcVelocity(xDelta, deltaTime, state.xVelocity);\n      const yVelocity = calcVelocity(yDelta, deltaTime, state.yVelocity);\n      const newState: GestureHandlersState = {\n        ...state,\n        xVelocity,\n        yVelocity,\n        target: null,\n        down: false,\n      };\n\n      return newState;\n    });\n  };\n\n  const handleDown = (e: MouseEvent) => {\n    const { target, pageX, pageY } = e;\n\n    set((state: GestureHandlersState) => {\n      const newState = {\n        ...state,\n        target,\n        x: pageX,\n        xDelta: 0,\n        xDeltaPercent: 0,\n        xVelocity: 0,\n        xInitial: pageX,\n        xPrev: pageX,\n        y: pageY,\n        yDelta: 0,\n        yDeltaPercent: 0,\n        yVelocity: 0,\n        yInitial: pageY,\n        yPrev: pageY,\n        startTime: Date.now(),\n        down: true,\n        scrollLocked: false,\n      };\n\n      return newState;\n    });\n  };\n\n  function calcVelocity(\n    deltaSpace: number,\n    deltaTime: number,\n    prevVelocity: number\n  ) {\n    if (deltaTime < 1) {\n      deltaTime = 1;\n    }\n    const speed = deltaSpace / deltaTime;\n    const depr = 0.5 + Math.min(deltaTime / VELOCITY_DEPR_FACTOR, 0.5);\n    return speed * depr + prevVelocity * (1 - depr);\n  }\n\n  function handleMove(e: MouseEvent) {\n    const { pageX, pageY } = e;\n    if (e.cancelable) {\n      // prevent drag & drop behaviour from browser\n      e.preventDefault && e.preventDefault();\n    }\n\n    set((state: GestureHandlersState) => {\n      function getDeltaSum(\n        currentPos: number,\n        initialPos: number,\n        prevPos: number\n      ): number {\n        if (\n          state.scrollLocked ||\n          Math.abs(currentPos - initialPos) >= minTouchDelta\n        ) {\n          state.scrollLocked = true;\n          return currentPos - prevPos;\n        }\n        return 0;\n      }\n\n      const target =\n        (containerRef && containerRef.current) || (e as any).target;\n\n      const deltaTime = Date.now() - state.startTime;\n\n      const width = target ? target.offsetWidth : NaN;\n      const xDelta = state.xDelta + getDeltaSum(pageX, state.xInitial, state.x);\n      const xDeltaPercent = (xDelta * 100) / width;\n      const xVelocity = calcVelocity(xDelta, deltaTime, state.xVelocity);\n\n      const height = target ? target.offsetHeight : NaN;\n      const yDelta = state.yDelta + getDeltaSum(pageY, state.yInitial, state.y);\n      const yDeltaPercent = (yDelta * 100) / height;\n      const yVelocity = calcVelocity(yDelta, deltaTime, state.yVelocity);\n\n      const newState = {\n        ...state,\n        xDelta,\n        xDeltaPercent,\n        x: pageX,\n        xPrev: state.x,\n        xVelocity,\n        yDelta,\n        yDeltaPercent,\n        y: pageY,\n        yPrev: state.y,\n        yVelocity,\n      };\n\n      return newState;\n    });\n  }\n\n  // Touch handlers\n\n  /* eslint-disable @typescript-eslint/no-use-before-define */\n  function handleTouchMove(e: TouchEvent) {\n    if (e.cancelable) {\n      // prevent drag & drop behaviour from browser\n      e.preventDefault();\n    }\n    handleMove(e.touches.item(0) as any);\n  }\n\n  function handleTouchStart(e: React.TouchEvent<HTMLElement>) {\n    // making sure we're not dragging the element when more than one finger press the screen\n    const { touches } = e;\n    if (touches.length > 1) {\n      return;\n    }\n\n    if (\n      ensureTargetIsContainer &&\n      containerRef &&\n      e.target !== containerRef.current\n    ) {\n      return;\n    }\n\n    window.addEventListener('touchmove', handleTouchMove, { passive: false });\n    window.addEventListener('touchend', handleTouchEnd);\n    window.addEventListener('touchcancel', handleTouchEnd);\n    handleDown(e.touches.item(0) as any);\n  }\n\n  function handleTouchEnd() {\n    window.removeEventListener('touchmove', handleTouchMove);\n    window.removeEventListener('touchend', handleTouchEnd);\n    window.removeEventListener('touchcancel', handleTouchEnd);\n    handleUp();\n  }\n\n  // Mouse handlers\n  function handleMouseDown(e: React.MouseEvent<HTMLElement>) {\n    if (\n      ensureTargetIsContainer &&\n      containerRef &&\n      e.target !== containerRef.current\n    ) {\n      return;\n    }\n\n    if (e.button === 0) {\n      window.addEventListener('mousemove', handleMove);\n      window.addEventListener('mouseup', handleMouseUp);\n      handleDown(e as any);\n    }\n  }\n\n  function handleMouseUp() {\n    window.removeEventListener('mousemove', handleMove);\n    window.removeEventListener('mouseup', handleMouseUp);\n    handleUp();\n  }\n  /* eslint-enable @typescript-eslint/no-use-before-define */\n\n  return {\n    onMouseDown: handleMouseDown,\n    onTouchStart: handleTouchStart,\n  };\n}\n\nexport const useGestureHandlers = (\n  containerRef: React.MutableRefObject<HTMLElement | null> | undefined,\n  onGesture: (e: GestureHandlersState) => void,\n  options: GestureHandlerOptions = {}\n) => {\n  const state = useRef({ ...initialGestureHandlersState });\n\n  const set = (\n    cb: (prevState: GestureHandlersState) => GestureHandlersState\n  ) => {\n    state.current = cb(state.current);\n    onGesture && onGesture(state.current);\n\n    return state.current;\n  };\n\n  const handlers = gestureHandlers(set, containerRef, options);\n\n  return { state: state.current, handlers };\n};\n"],"file":"useGestureHandlers.js"}