@fremtind/jkl-react-hooks/build/esm/useSwipeGesture.js

Jøkul react button components

import {
  useCallback,
  useRef
} from "react";
function getGesturePointFromEvent(event) {
  return {
    x: event.clientX,
    y: event.clientY
  };
}
function useSwipeGesture(options) {
  const swipeHandled = useRef(false);
  const gestureStartPosition = useRef();
  const {
    onClick,
    onChange,
    onPointerCancel,
    onPointerDown,
    onPointerMove,
    onPointerUp
  } = options;
  const handleClick = useCallback(
    (event) => {
      if (!swipeHandled.current) {
        onClick == null ? void 0 : onClick(event);
      }
      swipeHandled.current = false;
    },
    [onClick]
  );
  const handleGestureStart = useCallback(
    (event) => {
      var _a, _b;
      event.preventDefault();
      (_b = (_a = event.target).setPointerCapture) == null ? void 0 : _b.call(_a, event.pointerId);
      gestureStartPosition.current = getGesturePointFromEvent(event);
      swipeHandled.current = false;
      onPointerDown == null ? void 0 : onPointerDown(event);
    },
    [onPointerDown]
  );
  const handleGestureMove = useCallback(
    (event) => {
      event.preventDefault();
      if (!gestureStartPosition.current) {
        return;
      }
      const { x: currentX } = getGesturePointFromEvent(event);
      const { x: startX } = gestureStartPosition.current;
      if (currentX - startX > 10 && onChange && swipeHandled.current !== "on") {
        onChange(event, true);
        swipeHandled.current = "on";
        gestureStartPosition.current = getGesturePointFromEvent(event);
      } else if (startX - currentX > 10 && onChange && swipeHandled.current !== "off") {
        onChange(event, false);
        swipeHandled.current = "off";
        gestureStartPosition.current = getGesturePointFromEvent(event);
      }
      onPointerMove == null ? void 0 : onPointerMove(event);
    },
    [onPointerMove, onChange]
  );
  const handleGestureEnd = useCallback(
    (event) => {
      var _a, _b;
      event.preventDefault();
      (_b = (_a = event.target).releasePointerCapture) == null ? void 0 : _b.call(_a, event.pointerId);
      gestureStartPosition.current = void 0;
      event.type === "pointerup" ? onPointerUp == null ? void 0 : onPointerUp(event) : onPointerCancel == null ? void 0 : onPointerCancel(event);
    },
    [onPointerUp, onPointerCancel]
  );
  return {
    swipeHandled,
    gestureHandlers: {
      onClick: handleClick,
      onPointerDown: handleGestureStart,
      onPointerMove: handleGestureMove,
      onPointerUp: handleGestureEnd,
      onPointerCancel: handleGestureEnd
    }
  };
}
export {
  useSwipeGesture
};
//# sourceMappingURL=useSwipeGesture.js.map