@mantine/core/cjs/components/Tooltip/use-tooltip.cjs

React components library focused on usability, accessibility and developer experience

"use client";
require("../../_virtual/_rolldown/runtime.cjs");
const require_TooltipGroup = require("./TooltipGroup/TooltipGroup.cjs");
let react = require("react");
let _mantine_hooks = require("@mantine/hooks");
let _floating_ui_react = require("@floating-ui/react");
//#region packages/@mantine/core/src/components/Tooltip/use-tooltip.ts
function getDefaultMiddlewares(middlewares) {
	if (middlewares === void 0) return {
		shift: true,
		flip: true
	};
	const result = { ...middlewares };
	if (middlewares.shift === void 0) result.shift = true;
	if (middlewares.flip === void 0) result.flip = true;
	return result;
}
function getTooltipMiddlewares(settings) {
	const middlewaresOptions = getDefaultMiddlewares(settings.middlewares);
	const middlewares = [(0, _floating_ui_react.offset)(settings.offset)];
	if (middlewaresOptions.shift) middlewares.push((0, _floating_ui_react.shift)(typeof middlewaresOptions.shift === "boolean" ? { padding: 8 } : {
		padding: 8,
		...middlewaresOptions.shift
	}));
	if (middlewaresOptions.flip) middlewares.push(typeof middlewaresOptions.flip === "boolean" ? (0, _floating_ui_react.flip)() : (0, _floating_ui_react.flip)(middlewaresOptions.flip));
	middlewares.push((0, _floating_ui_react.arrow)({
		element: settings.arrowRef,
		padding: settings.arrowOffset
	}));
	if (middlewaresOptions.inline) middlewares.push(typeof middlewaresOptions.inline === "boolean" ? (0, _floating_ui_react.inline)() : (0, _floating_ui_react.inline)(middlewaresOptions.inline));
	else if (settings.inline) middlewares.push((0, _floating_ui_react.inline)());
	return middlewares;
}
function useTooltip(settings) {
	const [uncontrolledOpened, setUncontrolledOpened] = (0, react.useState)(settings.defaultOpened);
	const opened = typeof settings.opened === "boolean" ? settings.opened : uncontrolledOpened;
	const withinGroup = (0, react.use)(require_TooltipGroup.TooltipGroupContext).withinGroup;
	const uid = (0, _mantine_hooks.useId)();
	const onChange = (0, react.useCallback)((_opened) => {
		setUncontrolledOpened(_opened);
		if (_opened) setCurrentId(uid);
	}, [uid]);
	const { x, y, context, refs, placement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {} } } = (0, _floating_ui_react.useFloating)({
		strategy: settings.strategy,
		placement: settings.position,
		open: opened,
		onOpenChange: onChange,
		middleware: getTooltipMiddlewares(settings),
		whileElementsMounted: _floating_ui_react.autoUpdate
	});
	const { delay: groupDelay, currentId, setCurrentId } = (0, _floating_ui_react.useDelayGroup)(context, { id: uid });
	const { getReferenceProps, getFloatingProps } = (0, _floating_ui_react.useInteractions)([
		(0, _floating_ui_react.useHover)(context, {
			enabled: settings.events?.hover,
			delay: withinGroup ? groupDelay : {
				open: settings.openDelay,
				close: settings.closeDelay
			},
			mouseOnly: !settings.events?.touch
		}),
		(0, _floating_ui_react.useFocus)(context, {
			enabled: settings.events?.focus,
			visibleOnly: true
		}),
		(0, _floating_ui_react.useRole)(context, { role: "tooltip" }),
		(0, _floating_ui_react.useDismiss)(context, { enabled: typeof settings.opened === "undefined" })
	]);
	(0, _mantine_hooks.useDidUpdate)(() => {
		settings.onPositionChange?.(placement);
	}, [placement]);
	const isGroupPhase = opened && currentId && currentId !== uid;
	return {
		x,
		y,
		arrowX,
		arrowY,
		reference: refs.setReference,
		floating: refs.setFloating,
		getFloatingProps,
		getReferenceProps,
		isGroupPhase,
		opened,
		placement
	};
}
//#endregion
exports.useTooltip = useTooltip;

//# sourceMappingURL=use-tooltip.cjs.map