@yamada-ui/react/dist/cjs/hooks/use-pan-event/index.cjs

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

"use client";


const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
const require_effect = require('../../utils/effect.cjs');
const require_ref = require('../../utils/ref.cjs');
const require_utils_index = require('../../utils/index.cjs');
const require_environment_provider = require('../../core/system/environment-provider.cjs');
let react = require("react");
react = require_rolldown_runtime.__toESM(react);

//#region src/hooks/use-pan-event/index.ts
const usePanEvent = ({ threshold = 3,...rest } = {}) => {
	const { getWindow } = require_environment_provider.useEnvironment();
	const onStart = require_ref.useCallbackRef(rest.onStart);
	const onMove = require_ref.useCallbackRef(rest.onMove);
	const onEnd = require_ref.useCallbackRef(rest.onEnd);
	const latestPoint = (0, react.useRef)(null);
	const unsubscribe = (0, react.useRef)([]);
	const ref = (0, react.useRef)(null);
	const cleanup = (0, react.useCallback)(() => {
		unsubscribe.current.forEach((unsubscribe$1) => unsubscribe$1());
		latestPoint.current = null;
		unsubscribe.current = [];
	}, []);
	const shouldMove = (0, react.useCallback)((point) => {
		if (threshold === 0) return true;
		if (!latestPoint.current) return true;
		return Math.sqrt(Math.pow(point.x - latestPoint.current.x, 2) + Math.pow(point.y - latestPoint.current.y, 2)) >= threshold;
	}, [threshold]);
	require_effect.useUnmountEffect(() => {
		cleanup();
	});
	return [ref, (0, react.useCallback)((props = {}) => {
		return {
			...props,
			ref: require_ref.mergeRefs(ref, props.ref),
			onPointerDown: (0, require_utils_index.utils_exports.handlerAll)(props.onPointerDown, (ev) => {
				const win = ev.nativeEvent.view ?? getWindow();
				if (!win) return;
				if ((0, require_utils_index.utils_exports.isMultiTouchEvent)(ev.nativeEvent)) return;
				if (!ref.current) return;
				ev.preventDefault();
				const point = (0, require_utils_index.utils_exports.getEventPoint)(ev.nativeEvent);
				const rect = ref.current.getBoundingClientRect();
				onStart(ev.nativeEvent, point, rect);
				latestPoint.current = point;
				unsubscribe.current.push((0, require_utils_index.utils_exports.addDomEvent)(win, "pointermove", (ev$1) => {
					if (!ref.current) return;
					const point$1 = (0, require_utils_index.utils_exports.getEventPoint)(ev$1);
					const rect$1 = ref.current.getBoundingClientRect();
					if (!shouldMove(point$1)) return;
					latestPoint.current = point$1;
					onMove(ev$1, point$1, rect$1);
				}));
				unsubscribe.current.push((0, require_utils_index.utils_exports.addDomEvent)(win, "pointerup", (ev$1) => {
					if (!ref.current) return;
					cleanup();
					onEnd(ev$1, (0, require_utils_index.utils_exports.getEventPoint)(ev$1), ref.current.getBoundingClientRect());
				}));
				unsubscribe.current.push((0, require_utils_index.utils_exports.addDomEvent)(win, "pointercancel", (ev$1) => {
					if (!ref.current) return;
					cleanup();
					onEnd(ev$1, (0, require_utils_index.utils_exports.getEventPoint)(ev$1), ref.current.getBoundingClientRect());
				}));
			})
		};
	}, [
		cleanup,
		getWindow,
		onEnd,
		onMove,
		onStart,
		shouldMove
	])];
};

//#endregion
exports.usePanEvent = usePanEvent;
//# sourceMappingURL=index.cjs.map