@tamagui/floating 2.7.7 → 3.0.0-beta.637.1

package/dist/cjs/interactions/safePolygon.native.cjs

@@ -0,0 +1,294 @@
+"use strict";
+
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+};
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var safePolygon_exports = {};
+__export(safePolygon_exports, { safePolygon: () => safePolygon });
+module.exports = __toCommonJS(safePolygon_exports);
+var import_utils = require("./utils.native.js");
+function isPointInPolygon(point, polygon) {
+	var [x, y] = point;
+	var isInside2 = false;
+	var length = polygon.length;
+	for (var i = 0, j = length - 1; i < length; j = i++) {
+		var [xi, yi] = polygon[i] || [0, 0];
+		var [xj, yj] = polygon[j] || [0, 0];
+		var intersect = yi >= y !== yj >= y && x <= (xj - xi) * (y - yi) / (yj - yi) + xi;
+		if (intersect) {
+			isInside2 = !isInside2;
+		}
+	}
+	return isInside2;
+}
+function isInside(point, rect) {
+	return point[0] >= rect.x && point[0] <= rect.x + rect.width && point[1] >= rect.y && point[1] <= rect.y + rect.height;
+}
+var debugSvg = null;
+function debugDrawPolygon(polygon, trough, cursor, anchor) {
+	if (!debugSvg) {
+		debugSvg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+		debugSvg.id = "__safe-polygon-debug";
+		Object.assign(debugSvg.style, {
+			position: "fixed",
+			inset: "0",
+			width: "100vw",
+			height: "100vh",
+			pointerEvents: "none",
+			zIndex: "999999"
+		});
+		document.body.appendChild(debugSvg);
+	}
+	debugSvg.innerHTML = "";
+	if (trough.length) {
+		var troughEl = document.createElementNS("http://www.w3.org/2000/svg", "polygon");
+		troughEl.setAttribute("points", trough.map(function(p) {
+			return p.join(",");
+		}).join(" "));
+		troughEl.setAttribute("fill", "rgba(0,100,255,0.15)");
+		troughEl.setAttribute("stroke", "rgba(0,100,255,0.6)");
+		troughEl.setAttribute("stroke-width", "1");
+		debugSvg.appendChild(troughEl);
+	}
+	if (polygon.length) {
+		var polyEl = document.createElementNS("http://www.w3.org/2000/svg", "polygon");
+		polyEl.setAttribute("points", polygon.map(function(p) {
+			return p.join(",");
+		}).join(" "));
+		polyEl.setAttribute("fill", "rgba(255,50,50,0.2)");
+		polyEl.setAttribute("stroke", "rgba(255,50,50,0.8)");
+		polyEl.setAttribute("stroke-width", "1.5");
+		debugSvg.appendChild(polyEl);
+	}
+	var anchorCircle = document.createElementNS("http://www.w3.org/2000/svg", "circle");
+	anchorCircle.setAttribute("cx", String(anchor[0]));
+	anchorCircle.setAttribute("cy", String(anchor[1]));
+	anchorCircle.setAttribute("r", "5");
+	anchorCircle.setAttribute("fill", "lime");
+	anchorCircle.setAttribute("stroke", "darkgreen");
+	anchorCircle.setAttribute("stroke-width", "1.5");
+	debugSvg.appendChild(anchorCircle);
+	var cursorCircle = document.createElementNS("http://www.w3.org/2000/svg", "circle");
+	cursorCircle.setAttribute("cx", String(cursor[0]));
+	cursorCircle.setAttribute("cy", String(cursor[1]));
+	cursorCircle.setAttribute("r", "4");
+	cursorCircle.setAttribute("fill", "yellow");
+	cursorCircle.setAttribute("stroke", "orange");
+	cursorCircle.setAttribute("stroke-width", "1.5");
+	debugSvg.appendChild(cursorCircle);
+}
+function debugClear() {
+	if (debugSvg) {
+		debugSvg.remove();
+		debugSvg = null;
+	}
+}
+function safePolygon() {
+	var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
+	var { buffer = .5, blockPointerEvents = false, requireIntent = true, __debug = false } = options;
+	var timeoutRef = { current: -1 };
+	var hasLanded = false;
+	var lastX = null;
+	var lastY = null;
+	var lastCursorTime = typeof performance !== "undefined" ? performance.now() : 0;
+	function getCursorSpeed(x, y) {
+		var currentTime = performance.now();
+		var elapsedTime = currentTime - lastCursorTime;
+		if (lastX === null || lastY === null || elapsedTime === 0) {
+			lastX = x;
+			lastY = y;
+			lastCursorTime = currentTime;
+			return null;
+		}
+		var deltaX = x - lastX;
+		var deltaY = y - lastY;
+		var distance = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
+		var speed = distance / elapsedTime;
+		lastX = x;
+		lastY = y;
+		lastCursorTime = currentTime;
+		return speed;
+	}
+	var fn = function(param) {
+		var { x, y, placement, elements, onClose } = param;
+		hasLanded = false;
+		lastX = null;
+		lastY = null;
+		return function onMouseMove(event) {
+			function close() {
+				(0, import_utils.clearTimeoutIfSet)(timeoutRef);
+				onClose();
+			}
+			(0, import_utils.clearTimeoutIfSet)(timeoutRef);
+			var _elements_domReference;
+			var domReference = (_elements_domReference = elements.domReference) !== null && _elements_domReference !== void 0 ? _elements_domReference : elements.reference;
+			if (!domReference || !elements.floating || placement == null || x == null || y == null) {
+				return;
+			}
+			var { clientX, clientY } = event;
+			var clientPoint = [clientX, clientY];
+			var target = (0, import_utils.getTarget)(event);
+			var isLeave = event.type === "mouseleave";
+			var isOverFloatingEl = (0, import_utils.contains)(elements.floating, target);
+			var isOverReferenceEl = (0, import_utils.contains)(domReference, target);
+			var refRect = domReference.getBoundingClientRect();
+			var rect = elements.floating.getBoundingClientRect();
+			var side = placement.split("-")[0];
+			var cursorLeaveFromRight = x > rect.right - rect.width / 2;
+			var cursorLeaveFromBottom = y > rect.bottom - rect.height / 2;
+			var isOverReferenceRect = isInside(clientPoint, refRect);
+			var isFloatingWider = rect.width > refRect.width;
+			var isFloatingTaller = rect.height > refRect.height;
+			var left = (isFloatingWider ? refRect : rect).left;
+			var right = (isFloatingWider ? refRect : rect).right;
+			var top = (isFloatingTaller ? refRect : rect).top;
+			var bottom = (isFloatingTaller ? refRect : rect).bottom;
+			if (isOverFloatingEl) {
+				hasLanded = true;
+				if (!isLeave) {
+					return;
+				}
+			}
+			if (isOverReferenceEl) {
+				hasLanded = false;
+			}
+			if (isOverReferenceEl && !isLeave) {
+				hasLanded = true;
+				return;
+			}
+			if (!isOverReferenceEl && isOverReferenceRect && !isLeave) {
+				return;
+			}
+			if (isLeave && event.relatedTarget && (0, import_utils.contains)(elements.floating, event.relatedTarget)) {
+				return;
+			}
+			if (side === "top" && y >= refRect.bottom - 1 || side === "bottom" && y <= refRect.top + 1 || side === "left" && x >= refRect.right - 1 || side === "right" && x <= refRect.left + 1) {
+				return close();
+			}
+			var rectPoly = [];
+			switch (side) {
+				case "top":
+					rectPoly = [
+						[left, refRect.top + 1],
+						[left, rect.bottom - 1],
+						[right, rect.bottom - 1],
+						[right, refRect.top + 1]
+					];
+					break;
+				case "bottom":
+					rectPoly = [
+						[left, rect.top + 1],
+						[left, refRect.bottom - 1],
+						[right, refRect.bottom - 1],
+						[right, rect.top + 1]
+					];
+					break;
+				case "left":
+					rectPoly = [
+						[rect.right - 1, bottom],
+						[rect.right - 1, top],
+						[refRect.left + 1, top],
+						[refRect.left + 1, bottom]
+					];
+					break;
+				case "right":
+					rectPoly = [
+						[refRect.right - 1, bottom],
+						[refRect.right - 1, top],
+						[rect.left + 1, top],
+						[rect.left + 1, bottom]
+					];
+					break;
+			}
+			function getPolygon(param2) {
+				var [x2, y2] = param2;
+				switch (side) {
+					case "top": {
+						var cursorPointOne = [isFloatingWider ? x2 + buffer / 2 : cursorLeaveFromRight ? x2 + buffer * 4 : x2 - buffer * 4, y2 + buffer + 1];
+						var cursorPointTwo = [isFloatingWider ? x2 - buffer / 2 : cursorLeaveFromRight ? x2 + buffer * 4 : x2 - buffer * 4, y2 + buffer + 1];
+						var commonPoints = [[rect.left, cursorLeaveFromRight ? rect.bottom - buffer : isFloatingWider ? rect.bottom - buffer : rect.top], [rect.right, cursorLeaveFromRight ? isFloatingWider ? rect.bottom - buffer : rect.top : rect.bottom - buffer]];
+						return [
+							cursorPointOne,
+							cursorPointTwo,
+							...commonPoints
+						];
+					}
+					case "bottom": {
+						var cursorPointOne1 = [isFloatingWider ? x2 + buffer / 2 : cursorLeaveFromRight ? x2 + buffer * 4 : x2 - buffer * 4, y2 - buffer];
+						var cursorPointTwo1 = [isFloatingWider ? x2 - buffer / 2 : cursorLeaveFromRight ? x2 + buffer * 4 : x2 - buffer * 4, y2 - buffer];
+						var commonPoints1 = [[rect.left, cursorLeaveFromRight ? rect.top + buffer : isFloatingWider ? rect.top + buffer : rect.bottom], [rect.right, cursorLeaveFromRight ? isFloatingWider ? rect.top + buffer : rect.bottom : rect.top + buffer]];
+						return [
+							cursorPointOne1,
+							cursorPointTwo1,
+							...commonPoints1
+						];
+					}
+					case "left": {
+						var cursorPointOne2 = [x2 + buffer + 1, isFloatingTaller ? y2 + buffer / 2 : cursorLeaveFromBottom ? y2 + buffer * 4 : y2 - buffer * 4];
+						var cursorPointTwo2 = [x2 + buffer + 1, isFloatingTaller ? y2 - buffer / 2 : cursorLeaveFromBottom ? y2 + buffer * 4 : y2 - buffer * 4];
+						var commonPoints2 = [[cursorLeaveFromBottom ? rect.right - buffer : isFloatingTaller ? rect.right - buffer : rect.left, rect.top], [cursorLeaveFromBottom ? isFloatingTaller ? rect.right - buffer : rect.left : rect.right - buffer, rect.bottom]];
+						return [
+							...commonPoints2,
+							cursorPointOne2,
+							cursorPointTwo2
+						];
+					}
+					case "right": {
+						var cursorPointOne3 = [x2 - buffer, isFloatingTaller ? y2 + buffer / 2 : cursorLeaveFromBottom ? y2 + buffer * 4 : y2 - buffer * 4];
+						var cursorPointTwo3 = [x2 - buffer, isFloatingTaller ? y2 - buffer / 2 : cursorLeaveFromBottom ? y2 + buffer * 4 : y2 - buffer * 4];
+						var commonPoints3 = [[cursorLeaveFromBottom ? rect.left + buffer : isFloatingTaller ? rect.left + buffer : rect.right, rect.top], [cursorLeaveFromBottom ? isFloatingTaller ? rect.left + buffer : rect.right : rect.left + buffer, rect.bottom]];
+						return [
+							cursorPointOne3,
+							cursorPointTwo3,
+							...commonPoints3
+						];
+					}
+				}
+			}
+			var poly = getPolygon([x, y]);
+			if (__debug) {
+				debugDrawPolygon(poly, rectPoly, clientPoint, [x, y]);
+			}
+			if (isPointInPolygon([clientX, clientY], rectPoly)) {
+				return;
+			}
+			if (hasLanded && !isOverReferenceRect) {
+				if (__debug) debugClear();
+				return close();
+			}
+			if (isPointInPolygon([clientX, clientY], poly)) {
+				return;
+			}
+			if (!isLeave && requireIntent) {
+				var cursorSpeed = getCursorSpeed(clientX, clientY);
+				var cursorSpeedThreshold = .1;
+				if (cursorSpeed !== null && cursorSpeed < cursorSpeedThreshold) {
+					if (__debug) debugClear();
+					return close();
+				}
+			}
+			if (__debug) debugClear();
+			close();
+		};
+	};
+	fn.__options = { blockPointerEvents };
+	return fn;
+}