@mantine/core/cjs/utils/Floating/use-context-menu-handlers.cjs

React components library focused on usability, accessibility and developer experience

"use client";
const require_create_event_handler = require("../../core/utils/create-event-handler/create-event-handler.cjs");
let react = require("react");
let _mantine_hooks = require("@mantine/hooks");
//#region packages/@mantine/core/src/utils/Floating/use-context-menu-handlers.ts
function useContextMenuHandlers({ childProps, disabled, opened, longPressDelay = 500, setReference, open }) {
	const touchActiveRef = (0, react.useRef)(false);
	const gestureHandledRef = (0, react.useRef)(false);
	const touchTargetRef = (0, react.useRef)(null);
	const disabledRef = (0, react.useRef)(disabled);
	disabledRef.current = disabled;
	const openAtPoint = (clientX, clientY, contextElement) => {
		setReference({
			getBoundingClientRect: () => ({
				x: clientX,
				y: clientY,
				width: 0,
				height: 0,
				top: clientY,
				left: clientX,
				right: clientX,
				bottom: clientY,
				toJSON: () => void 0
			}),
			contextElement
		});
		open();
	};
	const onMouseDown = require_create_event_handler.createEventHandler(childProps.onMouseDown, (event) => {
		if (disabled) return;
		if (event.button === 2) event.stopPropagation();
	});
	const onContextMenu = require_create_event_handler.createEventHandler(childProps.onContextMenu, (event) => {
		if (disabled || event.defaultPrevented) return;
		event.preventDefault();
		if (gestureHandledRef.current) return;
		openAtPoint(event.clientX, event.clientY, event.currentTarget);
		if (touchActiveRef.current) gestureHandledRef.current = true;
	});
	const longPressHandlers = (0, _mantine_hooks.useLongPress)((event) => {
		if (disabledRef.current || gestureHandledRef.current) return;
		const touchEvent = event;
		const touch = touchEvent.touches[0] ?? touchEvent.changedTouches[0];
		if (!touch) return;
		openAtPoint(touch.clientX, touch.clientY, touchTargetRef.current);
		gestureHandledRef.current = true;
	}, {
		threshold: longPressDelay,
		events: ["touch"],
		cancelOnMove: true,
		onStart: (event) => {
			touchActiveRef.current = true;
			gestureHandledRef.current = false;
			touchTargetRef.current = event.currentTarget;
		},
		onFinish: (event) => {
			touchActiveRef.current = false;
			gestureHandledRef.current = false;
			if (!disabledRef.current) event.preventDefault();
		},
		onCancel: () => {
			touchActiveRef.current = false;
			gestureHandledRef.current = false;
		}
	});
	return {
		onContextMenu,
		onMouseDown,
		onTouchStart: require_create_event_handler.createEventHandler(childProps.onTouchStart, longPressHandlers.onTouchStart),
		onTouchEnd: require_create_event_handler.createEventHandler(childProps.onTouchEnd, longPressHandlers.onTouchEnd),
		onTouchCancel: require_create_event_handler.createEventHandler(childProps.onTouchCancel, longPressHandlers.onTouchCancel),
		onTouchMove: require_create_event_handler.createEventHandler(childProps.onTouchMove, longPressHandlers.onTouchMove),
		style: disabled ? childProps.style : {
			...childProps.style,
			WebkitTouchCallout: "none",
			WebkitUserSelect: "none",
			userSelect: "none"
		},
		"data-expanded": opened ? true : void 0
	};
}
//#endregion
exports.useContextMenuHandlers = useContextMenuHandlers;

//# sourceMappingURL=use-context-menu-handlers.cjs.map