@basic-ui/core 0.0.33 → 0.0.36

package/build/esm/hooks/useFocusState.d.ts

@@ -4,8 +4,8 @@ export declare function useFocusState<T>(props?: {
     onBlur?: React.FocusEventHandler<T>;
 }): {
     bind: {
-        onFocus: import("../utils/wrapEvent").CustomEventHandler<import("react").FocusEvent<T>, []>;
-        onBlur: import("../utils/wrapEvent").CustomEventHandler<import("react").FocusEvent<T>, []>;
+        onFocus: import("../utils/wrapEvent").CustomEventHandler<import("react").FocusEvent<T, Element>, []>;
+        onBlur: import("../utils/wrapEvent").CustomEventHandler<import("react").FocusEvent<T, Element>, []>;
     };
     hasFocus: boolean;
 };

package/build/esm/hooks/useGestureHandlers.d.ts

@@ -13,7 +13,9 @@ export interface GestureHandlersState {
     yInitial: number;
     yPrev: number;
     yVelocity: number;
+    startTime: number;
     down: boolean;
+    scrollLocked: boolean;
 }
 declare type SetStateFunc<S> = (state: (prevState: Readonly<S>) => S, callback?: () => void) => void;
 export interface GestureHandlersReturn {
@@ -22,6 +24,7 @@ export interface GestureHandlersReturn {
 }
 export interface GestureHandlerOptions {
     ensureTargetIsContainer?: boolean;
+    minTouchDelta?: number;
 }
 export declare const initialGestureHandlersState: GestureHandlersState;
 export declare function gestureHandlers(set: SetStateFunc<GestureHandlersState>, containerRef?: React.MutableRefObject<HTMLElement | null>, options?: GestureHandlerOptions): GestureHandlersReturn;
@@ -40,7 +43,9 @@ export declare const useGestureHandlers: (containerRef: React.MutableRefObject<H
         yInitial: number;
         yPrev: number;
         yVelocity: number;
+        startTime: number;
         down: boolean;
+        scrollLocked: boolean;
     };
     handlers: GestureHandlersReturn;
 };

package/build/esm/hooks/useGestureHandlers.js

@@ -14,16 +14,30 @@ export const initialGestureHandlersState = {
   yInitial: 0,
   yPrev: 0,
   yVelocity: 0,
-  down: false
+  startTime: 0,
+  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 = () => {
     set(state => {
+      const deltaTime = Date.now() - state.startTime;
+      const xDelta = state.x - state.xInitial;
+      const yDelta = state.y - state.yInitial;
+      const xVelocity = calcVelocity(xDelta, deltaTime, state.xVelocity);
+      const yVelocity = calcVelocity(yDelta, deltaTime, state.yVelocity);
+
       const newState = _extends({}, state, {
+        xVelocity,
+        yVelocity,
         target: null,
         down: false
       });
@@ -53,42 +67,68 @@ export function gestureHandlers(set, containerRef, options = {}) {
         yVelocity: 0,
         yInitial: pageY,
         yPrev: pageY,
-        down: true
+        startTime: Date.now(),
+        down: true,
+        scrollLocked: false
       });
 
       return newState;
     });
   };
 
+  function calcVelocity(deltaSpace, deltaTime, prevVelocity) {
+    if (deltaTime < 1) {
+      deltaTime = 1;
+    }
+
+    const speed = deltaSpace / deltaTime;
+    const depr = 0.5 + Math.min(deltaTime / VELOCITY_DEPR_FACTOR, 0.5);
+    return speed * depr + prevVelocity * (1 - depr);
+  }
+
   function handleMove(e) {
     const {
       pageX,
-      movementX,
-      pageY,
-      movementY
+      pageY
     } = e;
-    e.preventDefault && e.preventDefault(); // prevent drag & drop behaviour from browser
+
+    if (e.cancelable) {
+      // prevent drag & drop behaviour from browser
+      e.preventDefault && e.preventDefault();
+    }
 
     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);
 
       const newState = _extends({}, state, {
         xDelta,
         xDeltaPercent,
         x: pageX,
         xPrev: state.x,
-        xVelocity: movementX,
+        xVelocity,
         yDelta,
         yDeltaPercent,
         y: pageY,
         yPrev: state.y,
-        yVelocity: movementY
+        yVelocity
       });
 
       return newState;
@@ -99,7 +139,11 @@ export function gestureHandlers(set, containerRef, options = {}) {
 
 
   function handleTouchMove(e) {
-    e.preventDefault();
+    if (e.cancelable) {
+      // prevent drag & drop behaviour from browser
+      e.preventDefault();
+    }
+
     handleMove(e.touches.item(0));
   }
 

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","down","gestureHandlers","set","containerRef","options","ensureTargetIsContainer","handleUp","state","newState","handleDown","e","pageX","pageY","handleMove","movementX","movementY","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  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  down: false,\n};\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 newState: GestureHandlersState = {\n        ...state,\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        down: true,\n      };\n\n      return newState;\n    });\n  };\n\n  function handleMove(e: MouseEvent) {\n    const { pageX, movementX, pageY, movementY } = e;\n    e.preventDefault && e.preventDefault(); // prevent drag & drop behaviour from browser\n\n    set((state: GestureHandlersState) => {\n      const target =\n        (containerRef && containerRef.current) || (e as any).target;\n\n      const width = target ? target.offsetWidth : NaN;\n      const xDelta = pageX - state.xInitial;\n      const xDeltaPercent = (xDelta * 100) / width;\n\n      const height = target ? target.offsetHeight : NaN;\n      const yDelta = pageY - state.yInitial;\n      const yDeltaPercent = (yDelta * 100) / height;\n\n      const newState = {\n        ...state,\n        xDelta,\n        xDeltaPercent,\n        x: pageX,\n        xPrev: state.x,\n        xVelocity: movementX,\n        yDelta,\n        yDeltaPercent,\n        y: pageY,\n        yPrev: state.y,\n        yVelocity: movementY,\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    e.preventDefault();\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":";AAAA,SAASA,MAAT,QAAuB,OAAvB;AAqCA,OAAO,MAAMC,2BAAiD,GAAG;AAC/DC,EAAAA,MAAM,EAAE,IADuD;AAE/DC,EAAAA,CAAC,EAAE,CAF4D;AAG/DC,EAAAA,MAAM,EAAE,CAHuD;AAI/DC,EAAAA,aAAa,EAAE,CAJgD;AAK/DC,EAAAA,QAAQ,EAAE,CALqD;AAM/DC,EAAAA,KAAK,EAAE,CANwD;AAO/DC,EAAAA,SAAS,EAAE,CAPoD;AAQ/DC,EAAAA,CAAC,EAAE,CAR4D;AAS/DC,EAAAA,MAAM,EAAE,CATuD;AAU/DC,EAAAA,aAAa,EAAE,CAVgD;AAW/DC,EAAAA,QAAQ,EAAE,CAXqD;AAY/DC,EAAAA,KAAK,EAAE,CAZwD;AAa/DC,EAAAA,SAAS,EAAE,CAboD;AAc/DC,EAAAA,SAAS,EAAE,CAdoD;AAe/DC,EAAAA,IAAI,EAAE,KAfyD;AAgB/DC,EAAAA,YAAY,EAAE;AAhBiD,CAA1D;AAmBP,MAAMC,eAAe,GAAG,OAAO,EAA/B,C,CAAmC;;AACnC,MAAMC,oBAAoB,GAAGD,eAAe,GAAG,CAA/C;AAEA,OAAO,SAASE,eAAT,CACLC,GADK,EAELC,YAFK,EAGLC,OAA8B,GAAG,EAH5B,EAIkB;AACvB,QAAM;AAAEC,IAAAA,uBAAuB,GAAG,KAA5B;AAAmCC,IAAAA,aAAa,GAAG;AAAnD,MAAyDF,OAA/D,CADuB,CAGvB;;AACA,QAAMG,QAAQ,GAAG,MAAM;AACrBL,IAAAA,GAAG,CAAEM,KAAD,IAAiC;AACnC,YAAMC,SAAS,GAAGC,IAAI,CAACC,GAAL,KAAaH,KAAK,CAACZ,SAArC;AACA,YAAMX,MAAM,GAAGuB,KAAK,CAACxB,CAAN,GAAUwB,KAAK,CAACrB,QAA/B;AACA,YAAMI,MAAM,GAAGiB,KAAK,CAAClB,CAAN,GAAUkB,KAAK,CAACf,QAA/B;AACA,YAAMJ,SAAS,GAAGuB,YAAY,CAAC3B,MAAD,EAASwB,SAAT,EAAoBD,KAAK,CAACnB,SAA1B,CAA9B;AACA,YAAMM,SAAS,GAAGiB,YAAY,CAACrB,MAAD,EAASkB,SAAT,EAAoBD,KAAK,CAACb,SAA1B,CAA9B;;AACA,YAAMkB,QAA8B,gBAC/BL,KAD+B;AAElCnB,QAAAA,SAFkC;AAGlCM,QAAAA,SAHkC;AAIlCZ,QAAAA,MAAM,EAAE,IAJ0B;AAKlCc,QAAAA,IAAI,EAAE;AAL4B,QAApC;;AAQA,aAAOgB,QAAP;AACD,KAfE,CAAH;AAgBD,GAjBD;;AAmBA,QAAMC,UAAU,GAAIC,CAAD,IAAmB;AACpC,UAAM;AAAEhC,MAAAA,MAAF;AAAUiC,MAAAA,KAAV;AAAiBC,MAAAA;AAAjB,QAA2BF,CAAjC;AAEAb,IAAAA,GAAG,CAAEM,KAAD,IAAiC;AACnC,YAAMK,QAAQ,gBACTL,KADS;AAEZzB,QAAAA,MAFY;AAGZC,QAAAA,CAAC,EAAEgC,KAHS;AAIZ/B,QAAAA,MAAM,EAAE,CAJI;AAKZC,QAAAA,aAAa,EAAE,CALH;AAMZG,QAAAA,SAAS,EAAE,CANC;AAOZF,QAAAA,QAAQ,EAAE6B,KAPE;AAQZ5B,QAAAA,KAAK,EAAE4B,KARK;AASZ1B,QAAAA,CAAC,EAAE2B,KATS;AAUZ1B,QAAAA,MAAM,EAAE,CAVI;AAWZC,QAAAA,aAAa,EAAE,CAXH;AAYZG,QAAAA,SAAS,EAAE,CAZC;AAaZF,QAAAA,QAAQ,EAAEwB,KAbE;AAcZvB,QAAAA,KAAK,EAAEuB,KAdK;AAeZrB,QAAAA,SAAS,EAAEc,IAAI,CAACC,GAAL,EAfC;AAgBZd,QAAAA,IAAI,EAAE,IAhBM;AAiBZC,QAAAA,YAAY,EAAE;AAjBF,QAAd;;AAoBA,aAAOe,QAAP;AACD,KAtBE,CAAH;AAuBD,GA1BD;;AA4BA,WAASD,YAAT,CACEM,UADF,EAEET,SAFF,EAGEU,YAHF,EAIE;AACA,QAAIV,SAAS,GAAG,CAAhB,EAAmB;AACjBA,MAAAA,SAAS,GAAG,CAAZ;AACD;;AACD,UAAMW,KAAK,GAAGF,UAAU,GAAGT,SAA3B;AACA,UAAMY,IAAI,GAAG,MAAMC,IAAI,CAACC,GAAL,CAASd,SAAS,GAAGT,oBAArB,EAA2C,GAA3C,CAAnB;AACA,WAAOoB,KAAK,GAAGC,IAAR,GAAeF,YAAY,IAAI,IAAIE,IAAR,CAAlC;AACD;;AAED,WAASG,UAAT,CAAoBT,CAApB,EAAmC;AACjC,UAAM;AAAEC,MAAAA,KAAF;AAASC,MAAAA;AAAT,QAAmBF,CAAzB;;AACA,QAAIA,CAAC,CAACU,UAAN,EAAkB;AAChB;AACAV,MAAAA,CAAC,CAACW,cAAF,IAAoBX,CAAC,CAACW,cAAF,EAApB;AACD;;AAEDxB,IAAAA,GAAG,CAAEM,KAAD,IAAiC;AACnC,eAASmB,WAAT,CACEC,UADF,EAEEC,UAFF,EAGEC,OAHF,EAIU;AACR,YACEtB,KAAK,CAACV,YAAN,IACAwB,IAAI,CAACS,GAAL,CAASH,UAAU,GAAGC,UAAtB,KAAqCvB,aAFvC,EAGE;AACAE,UAAAA,KAAK,CAACV,YAAN,GAAqB,IAArB;AACA,iBAAO8B,UAAU,GAAGE,OAApB;AACD;;AACD,eAAO,CAAP;AACD;;AAED,YAAM/C,MAAM,GACToB,YAAY,IAAIA,YAAY,CAAC6B,OAA9B,IAA2CjB,CAAD,CAAWhC,MADvD;AAGA,YAAM0B,SAAS,GAAGC,IAAI,CAACC,GAAL,KAAaH,KAAK,CAACZ,SAArC;AAEA,YAAMqC,KAAK,GAAGlD,MAAM,GAAGA,MAAM,CAACmD,WAAV,GAAwBC,GAA5C;AACA,YAAMlD,MAAM,GAAGuB,KAAK,CAACvB,MAAN,GAAe0C,WAAW,CAACX,KAAD,EAAQR,KAAK,CAACrB,QAAd,EAAwBqB,KAAK,CAACxB,CAA9B,CAAzC;AACA,YAAME,aAAa,GAAID,MAAM,GAAG,GAAV,GAAiBgD,KAAvC;AACA,YAAM5C,SAAS,GAAGuB,YAAY,CAAC3B,MAAD,EAASwB,SAAT,EAAoBD,KAAK,CAACnB,SAA1B,CAA9B;AAEA,YAAM+C,MAAM,GAAGrD,MAAM,GAAGA,MAAM,CAACsD,YAAV,GAAyBF,GAA9C;AACA,YAAM5C,MAAM,GAAGiB,KAAK,CAACjB,MAAN,GAAeoC,WAAW,CAACV,KAAD,EAAQT,KAAK,CAACf,QAAd,EAAwBe,KAAK,CAAClB,CAA9B,CAAzC;AACA,YAAME,aAAa,GAAID,MAAM,GAAG,GAAV,GAAiB6C,MAAvC;AACA,YAAMzC,SAAS,GAAGiB,YAAY,CAACrB,MAAD,EAASkB,SAAT,EAAoBD,KAAK,CAACb,SAA1B,CAA9B;;AAEA,YAAMkB,QAAQ,gBACTL,KADS;AAEZvB,QAAAA,MAFY;AAGZC,QAAAA,aAHY;AAIZF,QAAAA,CAAC,EAAEgC,KAJS;AAKZ5B,QAAAA,KAAK,EAAEoB,KAAK,CAACxB,CALD;AAMZK,QAAAA,SANY;AAOZE,QAAAA,MAPY;AAQZC,QAAAA,aARY;AASZF,QAAAA,CAAC,EAAE2B,KATS;AAUZvB,QAAAA,KAAK,EAAEc,KAAK,CAAClB,CAVD;AAWZK,QAAAA;AAXY,QAAd;;AAcA,aAAOkB,QAAP;AACD,KA9CE,CAAH;AA+CD,GAtHsB,CAwHvB;;AAEA;;;AACA,WAASyB,eAAT,CAAyBvB,CAAzB,EAAwC;AACtC,QAAIA,CAAC,CAACU,UAAN,EAAkB;AAChB;AACAV,MAAAA,CAAC,CAACW,cAAF;AACD;;AACDF,IAAAA,UAAU,CAACT,CAAC,CAACwB,OAAF,CAAUC,IAAV,CAAe,CAAf,CAAD,CAAV;AACD;;AAED,WAASC,gBAAT,CAA0B1B,CAA1B,EAA4D;AAC1D;AACA,UAAM;AAAEwB,MAAAA;AAAF,QAAcxB,CAApB;;AACA,QAAIwB,OAAO,CAACG,MAAR,GAAiB,CAArB,EAAwB;AACtB;AACD;;AAED,QACErC,uBAAuB,IACvBF,YADA,IAEAY,CAAC,CAAChC,MAAF,KAAaoB,YAAY,CAAC6B,OAH5B,EAIE;AACA;AACD;;AAEDW,IAAAA,MAAM,CAACC,gBAAP,CAAwB,WAAxB,EAAqCN,eAArC,EAAsD;AAAEO,MAAAA,OAAO,EAAE;AAAX,KAAtD;AACAF,IAAAA,MAAM,CAACC,gBAAP,CAAwB,UAAxB,EAAoCE,cAApC;AACAH,IAAAA,MAAM,CAACC,gBAAP,CAAwB,aAAxB,EAAuCE,cAAvC;AACAhC,IAAAA,UAAU,CAACC,CAAC,CAACwB,OAAF,CAAUC,IAAV,CAAe,CAAf,CAAD,CAAV;AACD;;AAED,WAASM,cAAT,GAA0B;AACxBH,IAAAA,MAAM,CAACI,mBAAP,CAA2B,WAA3B,EAAwCT,eAAxC;AACAK,IAAAA,MAAM,CAACI,mBAAP,CAA2B,UAA3B,EAAuCD,cAAvC;AACAH,IAAAA,MAAM,CAACI,mBAAP,CAA2B,aAA3B,EAA0CD,cAA1C;AACAvC,IAAAA,QAAQ;AACT,GA7JsB,CA+JvB;;;AACA,WAASyC,eAAT,CAAyBjC,CAAzB,EAA2D;AACzD,QACEV,uBAAuB,IACvBF,YADA,IAEAY,CAAC,CAAChC,MAAF,KAAaoB,YAAY,CAAC6B,OAH5B,EAIE;AACA;AACD;;AAED,QAAIjB,CAAC,CAACkC,MAAF,KAAa,CAAjB,EAAoB;AAClBN,MAAAA,MAAM,CAACC,gBAAP,CAAwB,WAAxB,EAAqCpB,UAArC;AACAmB,MAAAA,MAAM,CAACC,gBAAP,CAAwB,SAAxB,EAAmCM,aAAnC;AACApC,MAAAA,UAAU,CAACC,CAAD,CAAV;AACD;AACF;;AAED,WAASmC,aAAT,GAAyB;AACvBP,IAAAA,MAAM,CAACI,mBAAP,CAA2B,WAA3B,EAAwCvB,UAAxC;AACAmB,IAAAA,MAAM,CAACI,mBAAP,CAA2B,SAA3B,EAAsCG,aAAtC;AACA3C,IAAAA,QAAQ;AACT;AACD;;;AAEA,SAAO;AACL4C,IAAAA,WAAW,EAAEH,eADR;AAELI,IAAAA,YAAY,EAAEX;AAFT,GAAP;AAID;AAED,OAAO,MAAMY,kBAAkB,GAAG,CAChClD,YADgC,EAEhCmD,SAFgC,EAGhClD,OAA8B,GAAG,EAHD,KAI7B;AACH,QAAMI,KAAK,GAAG3B,MAAM,cAAMC,2BAAN,EAApB;;AAEA,QAAMoB,GAAG,GACPqD,EADU,IAEP;AACH/C,IAAAA,KAAK,CAACwB,OAAN,GAAgBuB,EAAE,CAAC/C,KAAK,CAACwB,OAAP,CAAlB;AACAsB,IAAAA,SAAS,IAAIA,SAAS,CAAC9C,KAAK,CAACwB,OAAP,CAAtB;AAEA,WAAOxB,KAAK,CAACwB,OAAb;AACD,GAPD;;AASA,QAAMwB,QAAQ,GAAGvD,eAAe,CAACC,GAAD,EAAMC,YAAN,EAAoBC,OAApB,CAAhC;AAEA,SAAO;AAAEI,IAAAA,KAAK,EAAEA,KAAK,CAACwB,OAAf;AAAwBwB,IAAAA;AAAxB,GAAP;AACD,CAnBM","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"}