@ultraviolet/ui 3.21.1 → 3.22.0

package/dist/components/Popover/styles.css.js

@@ -4,28 +4,30 @@ import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
 
 //#region src/components/Popover/styles.css.ts
 var popoverStyle;
-var init_styles_css = __esmMin(() => {
-	init_styles_css_ts_vanilla();
-	popoverStyle = {
-		popover: createRuntimeFn({
-			defaultClassName: "uv_1awdzfa0",
-			variantClassNames: {
-				sentiment: {
-					neutral: "uv_1awdzfa1",
-					primary: "uv_1awdzfa2"
+function init_styles_css() {
+	return (init_styles_css = __esmMin(() => {
+		/* @__PURE__ */ init_styles_css_ts_vanilla();
+		popoverStyle = {
+			popover: createRuntimeFn({
+				defaultClassName: "uv_1awdzfa0",
+				variantClassNames: {
+					sentiment: {
+						neutral: "uv_1awdzfa1",
+						primary: "uv_1awdzfa2"
+					},
+					size: {
+						large: "uv_1awdzfa3",
+						medium: "uv_1awdzfa4",
+						small: "uv_1awdzfa5"
+					}
 				},
-				size: {
-					large: "uv_1awdzfa3",
-					medium: "uv_1awdzfa4",
-					small: "uv_1awdzfa5"
-				}
-			},
-			defaultVariants: {},
-			compoundVariants: []
-		}),
-		stack: "uv_1awdzfa6"
-	};
-});
+				defaultVariants: {},
+				compoundVariants: []
+			}),
+			stack: "uv_1awdzfa6"
+		};
+	}))();
+}
 
 //#endregion
 init_styles_css();

package/dist/components/Popover/styles.css.ts.vanilla.js

@@ -1,7 +1,9 @@
 import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
 
 //#region src/components/Popover/styles.css.ts.vanilla.css
-var init_styles_css_ts_vanilla = __esmMin(() => {});
+function init_styles_css_ts_vanilla() {
+	return (init_styles_css_ts_vanilla = __esmMin(() => {}))();
+}
 
 //#endregion
 init_styles_css_ts_vanilla();

package/dist/components/Popup/helpers.js

@@ -2,187 +2,166 @@ import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
 
 //#region src/components/Popup/helpers.ts
 var PLACEMENTS, isGenericPlacement, DEFAULT_ARROW_WIDTH, SPACE, DEFAULT_POSITIONS, getOrderOfPlacement, getHorizontalSpacing, getVerticalSpacing, computePlacement, findOffsetParent, getVerticalOverflow, getHorizontalOverflow, getPopupOverflowFromParent, placementBottom, placementLeft, placementRight, placementNested, placementTop, computePositions;
-var init_helpers = __esmMin(() => {
-	PLACEMENTS = [
-		"top",
-		"right",
-		"bottom",
-		"left",
-		"nested-menu"
-	];
-	isGenericPlacement = (placement) => PLACEMENTS.includes(placement);
-	DEFAULT_ARROW_WIDTH = 8;
-	SPACE = 4;
-	DEFAULT_POSITIONS = {
-		arrowLeft: 0,
-		arrowTop: 0,
-		arrowTransform: "translate(-50%, -50)",
-		placement: "top",
-		popupInitialPosition: "translate3d(0px, 0px, 0)",
-		popupPosition: "translate3d(0px, 0px, 0)",
-		rotate: 135
-	};
-	getOrderOfPlacement = (autoPlacement) => {
-		if (autoPlacement === "auto-bottom") return [
-			"bottom",
+function init_helpers() {
+	return (init_helpers = __esmMin(() => {
+		PLACEMENTS = [
 			"top",
-			"left",
-			"right"
-		];
-		if (autoPlacement === "auto-left") return [
-			"left",
 			"right",
-			"top",
-			"bottom"
-		];
-		if (autoPlacement === "auto-right") return [
-			"right",
-			"left",
-			"top",
-			"bottom"
-		];
-		return [
-			"top",
 			"bottom",
 			"left",
-			"right"
+			"nested-menu"
 		];
-	};
-	getHorizontalSpacing = (arrowWidth) => arrowWidth + SPACE * 2;
-	getVerticalSpacing = (arrowWidth) => arrowWidth + SPACE;
-	computePlacement = ({ childrenStructuredRef, popupStructuredRef, offsetParentRect, offsetParent, popupPortalTarget, isNestedMenu, autoPlacement, arrowWidth }) => {
-		const { top: childrenTop, bottom: childrenBottom, left: childrenLeft, right: childrenRight, width: childrenWidth, height: childrenHeight } = childrenStructuredRef;
-		const orderOfPlacement = getOrderOfPlacement(autoPlacement !== null && autoPlacement !== void 0 ? autoPlacement : "auto");
-		const { top: parentTop, left: parentLeft } = offsetParentRect;
-		const isPopupPortalTargetBody = popupPortalTarget === document.body || offsetParent === document.body;
-		const overloadedChildrenLeft = isPopupPortalTargetBody ? childrenLeft : childrenLeft - parentLeft;
-		const overloadedChildrenTop = isPopupPortalTargetBody ? childrenTop : childrenTop - parentTop;
-		const overloadedChildrenBottom = isPopupPortalTargetBody ? childrenBottom : childrenTop - parentTop + childrenHeight;
-		const overloadedChildrenRight = isPopupPortalTargetBody ? childrenRight : childrenLeft - parentLeft + childrenWidth;
-		const { width: popupWidth, height: popupHeight } = popupStructuredRef;
-		if (isNestedMenu) {
-			if (overloadedChildrenRight + popupWidth > window.innerWidth) return "left";
-			return "right";
-		}
-		const conditionsOfPlacement = {
-			bottom: overloadedChildrenBottom + getVerticalSpacing(arrowWidth) + popupHeight <= window.innerHeight,
-			left: overloadedChildrenLeft - getHorizontalSpacing(arrowWidth) - popupWidth >= 0,
-			right: overloadedChildrenRight + getHorizontalSpacing(arrowWidth) + popupWidth <= window.innerWidth,
-			top: overloadedChildrenTop - getVerticalSpacing(arrowWidth) - popupHeight >= 0
+		isGenericPlacement = (placement) => PLACEMENTS.includes(placement);
+		DEFAULT_ARROW_WIDTH = 8;
+		SPACE = 4;
+		DEFAULT_POSITIONS = {
+			arrowLeft: 0,
+			arrowTop: 0,
+			arrowTransform: "translate(-50%, -50)",
+			placement: "top",
+			popupInitialPosition: "translate3d(0px, 0px, 0)",
+			popupPosition: "translate3d(0px, 0px, 0)",
+			rotate: 135
 		};
-		return orderOfPlacement.find((placement) => conditionsOfPlacement[placement]) || orderOfPlacement[3];
-	};
-	findOffsetParent = (element) => {
-		var _element$current;
-		const offsetParent = element === null || element === void 0 || (_element$current = element.current) === null || _element$current === void 0 ? void 0 : _element$current.offsetParent;
-		if (offsetParent && ![
-			"TH",
-			"TD",
-			"TABLE"
-		].includes(offsetParent.tagName)) return offsetParent;
-		let currentElement = element === null || element === void 0 ? void 0 : element.current;
-		while (currentElement && currentElement.tagName !== "BODY") {
-			const { position } = window.getComputedStyle(currentElement);
-			if (position !== "static") return currentElement;
-			currentElement = currentElement.parentElement;
-		}
-		return document.body;
-	};
-	getVerticalOverflow = (childrenRect, offsetParentRect, popupHalfWidthWithArrow, popupWidth) => {
-		const { left: parentLeft, right: parentRight } = offsetParentRect;
-		const { left: childrenLeft, width: childrenWidth } = childrenRect;
-		const popupLeft = childrenLeft + childrenWidth / 2 - popupWidth / 2;
-		const popupRight = popupLeft + popupWidth;
-		if (popupRight > parentRight) {
-			if (Math.abs(popupRight - parentRight) > popupHalfWidthWithArrow) return -popupHalfWidthWithArrow;
-			return parentRight - popupRight;
-		}
-		if (popupLeft < parentLeft) {
-			if (Math.abs(popupLeft - parentLeft) > popupHalfWidthWithArrow) return popupHalfWidthWithArrow;
-			return Math.abs(popupLeft - parentLeft);
-		}
-	};
-	getHorizontalOverflow = (childrenRect, offsetParentRect, popupHeight, popupHalfHeightWithArrow) => {
-		const { top: parentTop, bottom: parentBottom } = offsetParentRect;
-		const { top: childrenTop, height: childrenHeight } = childrenRect;
-		const popupTop = childrenTop + childrenHeight / 2 - popupHeight / 2;
-		const popupBottom = popupTop + popupHeight;
-		if (popupTop < parentTop) {
-			if (Math.abs(popupTop - parentTop) > popupHalfHeightWithArrow) return popupHalfHeightWithArrow;
-			return Math.abs(popupTop - parentTop);
-		}
-		if (popupBottom > parentBottom) {
-			if (Math.abs(popupBottom - parentBottom) > popupHalfHeightWithArrow) return -popupHalfHeightWithArrow;
-			return parentBottom - popupBottom;
-		}
-	};
-	getPopupOverflowFromParent = (position, offsetParentRect, childrenRect, popupStructuredRef, arrowWidth) => {
-		const { width: popupWidth, height: popupHeight } = popupStructuredRef;
-		const popupHalfWidthWithArrow = popupWidth / 2 - arrowWidth - 1;
-		const popupHalfHeightWithArrow = popupHeight / 2 - arrowWidth - 1;
-		if (position === "top" || position === "bottom") {
-			const overflow = getVerticalOverflow(childrenRect, offsetParentRect, popupHalfWidthWithArrow, popupWidth);
-			if (overflow) return overflow;
-		}
-		if (position === "left" || position === "right") {
-			const overflow = getHorizontalOverflow(childrenRect, offsetParentRect, popupHeight, popupHalfHeightWithArrow);
-			if (overflow) return overflow;
-		}
-		return 0;
-	};
-	placementBottom = (isAligned, overloadedChildrenLeft, childrenWidth, popupWidth, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, isPopupPortalTargetBody) => {
-		const positionX = isAligned ? overloadedChildrenLeft : overloadedChildrenLeft + childrenWidth / 2 - popupWidth / 2;
-		const positionY = overloadedChildrenTop + scrollTopValue + childrenHeight + getVerticalSpacing(arrowWidth);
-		const computedPositionX = isAligned ? positionX : positionX + popupOverflow;
-		const finalPositionX = isPopupPortalTargetBody ? Math.max(computedPositionX, 0) : computedPositionX;
-		return {
-			arrowLeft: overloadedChildrenLeft + childrenWidth / 2 - finalPositionX,
-			arrowTop: -arrowWidth - 5,
-			arrowTransform: "",
-			placement: "bottom",
-			popupInitialPosition: `translate3d(${finalPositionX}px, ${positionY}px, 0)`,
-			popupPosition: `translate3d(${finalPositionX}px, ${positionY}px, 0)`,
-			rotate: 180
+		getOrderOfPlacement = (autoPlacement) => {
+			if (autoPlacement === "auto-bottom") return [
+				"bottom",
+				"top",
+				"left",
+				"right"
+			];
+			if (autoPlacement === "auto-left") return [
+				"left",
+				"right",
+				"top",
+				"bottom"
+			];
+			if (autoPlacement === "auto-right") return [
+				"right",
+				"left",
+				"top",
+				"bottom"
+			];
+			return [
+				"top",
+				"bottom",
+				"left",
+				"right"
+			];
+		};
+		getHorizontalSpacing = (arrowWidth) => arrowWidth + 8;
+		getVerticalSpacing = (arrowWidth) => arrowWidth + SPACE;
+		computePlacement = ({ childrenStructuredRef, popupStructuredRef, offsetParentRect, offsetParent, popupPortalTarget, isNestedMenu, autoPlacement, arrowWidth }) => {
+			const { top: childrenTop, bottom: childrenBottom, left: childrenLeft, right: childrenRight, width: childrenWidth, height: childrenHeight } = childrenStructuredRef;
+			const orderOfPlacement = getOrderOfPlacement(autoPlacement !== null && autoPlacement !== void 0 ? autoPlacement : "auto");
+			const { top: parentTop, left: parentLeft } = offsetParentRect;
+			const isPopupPortalTargetBody = popupPortalTarget === document.body || offsetParent === document.body;
+			const overloadedChildrenLeft = isPopupPortalTargetBody ? childrenLeft : childrenLeft - parentLeft;
+			const overloadedChildrenTop = isPopupPortalTargetBody ? childrenTop : childrenTop - parentTop;
+			const overloadedChildrenBottom = isPopupPortalTargetBody ? childrenBottom : childrenTop - parentTop + childrenHeight;
+			const overloadedChildrenRight = isPopupPortalTargetBody ? childrenRight : childrenLeft - parentLeft + childrenWidth;
+			const { width: popupWidth, height: popupHeight } = popupStructuredRef;
+			if (isNestedMenu) {
+				if (overloadedChildrenRight + popupWidth > window.innerWidth) return "left";
+				return "right";
+			}
+			const conditionsOfPlacement = {
+				bottom: overloadedChildrenBottom + getVerticalSpacing(arrowWidth) + popupHeight <= window.innerHeight,
+				left: overloadedChildrenLeft - getHorizontalSpacing(arrowWidth) - popupWidth >= 0,
+				right: overloadedChildrenRight + getHorizontalSpacing(arrowWidth) + popupWidth <= window.innerWidth,
+				top: overloadedChildrenTop - getVerticalSpacing(arrowWidth) - popupHeight >= 0
+			};
+			return orderOfPlacement.find((placement) => conditionsOfPlacement[placement]) || orderOfPlacement[3];
 		};
-	};
-	placementLeft = (isAligned, overloadedChildrenLeft, popupWidth, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight) => {
-		const positionX = overloadedChildrenLeft - popupWidth - getHorizontalSpacing(arrowWidth);
-		const positionY = isAligned ? overloadedChildrenTop + scrollTopValue : overloadedChildrenTop + scrollTopValue - popupHeight / 2 + childrenHeight / 2;
-		return {
-			arrowLeft: popupWidth + arrowWidth + 5,
-			arrowTop: isAligned ? childrenHeight / 2 - arrowWidth : popupHeight / 2 - popupOverflow,
-			arrowTransform: "translate(-50%, -50%)",
-			placement: "left",
-			popupInitialPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
-			popupPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
-			rotate: -90
+		findOffsetParent = (element) => {
+			var _element$current;
+			const offsetParent = element === null || element === void 0 || (_element$current = element.current) === null || _element$current === void 0 ? void 0 : _element$current.offsetParent;
+			if (offsetParent && ![
+				"TH",
+				"TD",
+				"TABLE"
+			].includes(offsetParent.tagName)) return offsetParent;
+			let currentElement = element === null || element === void 0 ? void 0 : element.current;
+			while (currentElement && currentElement.tagName !== "BODY") {
+				const { position } = window.getComputedStyle(currentElement);
+				if (position !== "static") return currentElement;
+				currentElement = currentElement.parentElement;
+			}
+			return document.body;
 		};
-	};
-	placementRight = (isAligned, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight, overloadedChildrenRight) => {
-		const positionX = overloadedChildrenRight + getHorizontalSpacing(arrowWidth);
-		const positionY = isAligned ? overloadedChildrenTop + scrollTopValue : overloadedChildrenTop + scrollTopValue - popupHeight / 2 + childrenHeight / 2;
-		return {
-			arrowLeft: -arrowWidth - 5,
-			arrowTop: isAligned ? childrenHeight / 2 - arrowWidth : popupHeight / 2 - popupOverflow,
-			arrowTransform: "translate(50%, -50%)",
-			placement: "right",
-			popupInitialPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
-			popupPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
-			rotate: 90
+		getVerticalOverflow = (childrenRect, offsetParentRect, popupHalfWidthWithArrow, popupWidth) => {
+			const { left: parentLeft, right: parentRight } = offsetParentRect;
+			const { left: childrenLeft, width: childrenWidth } = childrenRect;
+			const popupLeft = childrenLeft + childrenWidth / 2 - popupWidth / 2;
+			const popupRight = popupLeft + popupWidth;
+			if (popupRight > parentRight) {
+				if (Math.abs(popupRight - parentRight) > popupHalfWidthWithArrow) return -popupHalfWidthWithArrow;
+				return parentRight - popupRight;
+			}
+			if (popupLeft < parentLeft) {
+				if (Math.abs(popupLeft - parentLeft) > popupHalfWidthWithArrow) return popupHalfWidthWithArrow;
+				return Math.abs(popupLeft - parentLeft);
+			}
 		};
-	};
-	placementNested = (isAligned, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight, overloadedChildrenRight, childrenRect, offsetParent, offsetParentRect, popupStructuredRef, overloadedChildrenLeft, popupWidth, popupPortalTarget) => {
-		if (computePlacement({
-			childrenStructuredRef: childrenRect,
-			isNestedMenu: true,
-			offsetParent,
-			offsetParentRect,
-			popupPortalTarget,
-			popupStructuredRef,
-			arrowWidth
-		}) === "right") {
+		getHorizontalOverflow = (childrenRect, offsetParentRect, popupHeight, popupHalfHeightWithArrow) => {
+			const { top: parentTop, bottom: parentBottom } = offsetParentRect;
+			const { top: childrenTop, height: childrenHeight } = childrenRect;
+			const popupTop = childrenTop + childrenHeight / 2 - popupHeight / 2;
+			const popupBottom = popupTop + popupHeight;
+			if (popupTop < parentTop) {
+				if (Math.abs(popupTop - parentTop) > popupHalfHeightWithArrow) return popupHalfHeightWithArrow;
+				return Math.abs(popupTop - parentTop);
+			}
+			if (popupBottom > parentBottom) {
+				if (Math.abs(popupBottom - parentBottom) > popupHalfHeightWithArrow) return -popupHalfHeightWithArrow;
+				return parentBottom - popupBottom;
+			}
+		};
+		getPopupOverflowFromParent = (position, offsetParentRect, childrenRect, popupStructuredRef, arrowWidth) => {
+			const { width: popupWidth, height: popupHeight } = popupStructuredRef;
+			const popupHalfWidthWithArrow = popupWidth / 2 - arrowWidth - 1;
+			const popupHalfHeightWithArrow = popupHeight / 2 - arrowWidth - 1;
+			if (position === "top" || position === "bottom") {
+				const overflow = getVerticalOverflow(childrenRect, offsetParentRect, popupHalfWidthWithArrow, popupWidth);
+				if (overflow) return overflow;
+			}
+			if (position === "left" || position === "right") {
+				const overflow = getHorizontalOverflow(childrenRect, offsetParentRect, popupHeight, popupHalfHeightWithArrow);
+				if (overflow) return overflow;
+			}
+			return 0;
+		};
+		placementBottom = (isAligned, overloadedChildrenLeft, childrenWidth, popupWidth, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, isPopupPortalTargetBody) => {
+			const positionX = isAligned ? overloadedChildrenLeft : overloadedChildrenLeft + childrenWidth / 2 - popupWidth / 2;
+			const positionY = overloadedChildrenTop + scrollTopValue + childrenHeight + getVerticalSpacing(arrowWidth);
+			const computedPositionX = isAligned ? positionX : positionX + popupOverflow;
+			const finalPositionX = isPopupPortalTargetBody ? Math.max(computedPositionX, 0) : computedPositionX;
+			return {
+				arrowLeft: overloadedChildrenLeft + childrenWidth / 2 - finalPositionX,
+				arrowTop: -arrowWidth - 5,
+				arrowTransform: "",
+				placement: "bottom",
+				popupInitialPosition: `translate3d(${finalPositionX}px, ${positionY}px, 0)`,
+				popupPosition: `translate3d(${finalPositionX}px, ${positionY}px, 0)`,
+				rotate: 180
+			};
+		};
+		placementLeft = (isAligned, overloadedChildrenLeft, popupWidth, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight) => {
+			const positionX = overloadedChildrenLeft - popupWidth - getHorizontalSpacing(arrowWidth);
+			const positionY = isAligned ? overloadedChildrenTop + scrollTopValue : overloadedChildrenTop + scrollTopValue - popupHeight / 2 + childrenHeight / 2;
+			return {
+				arrowLeft: popupWidth + arrowWidth + 5,
+				arrowTop: isAligned ? childrenHeight / 2 - arrowWidth : popupHeight / 2 - popupOverflow,
+				arrowTransform: "translate(-50%, -50%)",
+				placement: "left",
+				popupInitialPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
+				popupPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
+				rotate: -90
+			};
+		};
+		placementRight = (isAligned, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight, overloadedChildrenRight) => {
 			const positionX = overloadedChildrenRight + getHorizontalSpacing(arrowWidth);
-			const positionY = isAligned ? overloadedChildrenTop + scrollTopValue : overloadedChildrenTop + scrollTopValue - popupHeight / 8;
+			const positionY = isAligned ? overloadedChildrenTop + scrollTopValue : overloadedChildrenTop + scrollTopValue - popupHeight / 2 + childrenHeight / 2;
 			return {
 				arrowLeft: -arrowWidth - 5,
 				arrowTop: isAligned ? childrenHeight / 2 - arrowWidth : popupHeight / 2 - popupOverflow,
@@ -192,79 +171,102 @@ var init_helpers = __esmMin(() => {
 				popupPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
 				rotate: 90
 			};
-		}
-		const positionX = overloadedChildrenLeft - popupWidth - getHorizontalSpacing(arrowWidth);
-		const positionY = isAligned ? overloadedChildrenTop + scrollTopValue : overloadedChildrenTop + scrollTopValue - popupHeight / 2 + childrenHeight / 2;
-		return {
-			arrowLeft: popupWidth + arrowWidth + 5,
-			arrowTop: isAligned ? childrenHeight / 2 - arrowWidth : popupHeight / 2 - popupOverflow,
-			arrowTransform: "translate(-50%, -50%)",
-			placement: "left",
-			popupInitialPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
-			popupPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
-			rotate: -90
 		};
-	};
-	placementTop = (isAligned, overloadedChildrenTop, scrollTopValue, arrowWidth, popupOverflow, popupHeight, overloadedChildrenLeft, popupWidth, childrenWidth, isPopupPortalTargetBody) => {
-		const positionX = isAligned ? overloadedChildrenLeft : overloadedChildrenLeft + childrenWidth / 2 - popupWidth / 2;
-		const positionY = overloadedChildrenTop + scrollTopValue - popupHeight - getVerticalSpacing(arrowWidth);
-		const computedPositionX = isAligned ? positionX : positionX + popupOverflow;
-		const finalPositionX = isPopupPortalTargetBody ? Math.max(computedPositionX, 0) : computedPositionX;
-		return {
-			arrowLeft: overloadedChildrenLeft + childrenWidth / 2 - finalPositionX,
-			arrowTop: popupHeight - 1,
-			arrowTransform: "",
-			placement: "top",
-			popupInitialPosition: `translate3d(${finalPositionX}px, ${positionY}px, 0)`,
-			popupPosition: `translate3d(${finalPositionX}px, ${positionY}px, 0)`,
-			rotate: 0
+		placementNested = (isAligned, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight, overloadedChildrenRight, childrenRect, offsetParent, offsetParentRect, popupStructuredRef, overloadedChildrenLeft, popupWidth, popupPortalTarget) => {
+			if (computePlacement({
+				childrenStructuredRef: childrenRect,
+				isNestedMenu: true,
+				offsetParent,
+				offsetParentRect,
+				popupPortalTarget,
+				popupStructuredRef,
+				arrowWidth
+			}) === "right") {
+				const positionX = overloadedChildrenRight + getHorizontalSpacing(arrowWidth);
+				const positionY = isAligned ? overloadedChildrenTop + scrollTopValue : overloadedChildrenTop + scrollTopValue - popupHeight / 8;
+				return {
+					arrowLeft: -arrowWidth - 5,
+					arrowTop: isAligned ? childrenHeight / 2 - arrowWidth : popupHeight / 2 - popupOverflow,
+					arrowTransform: "translate(50%, -50%)",
+					placement: "right",
+					popupInitialPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
+					popupPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
+					rotate: 90
+				};
+			}
+			const positionX = overloadedChildrenLeft - popupWidth - getHorizontalSpacing(arrowWidth);
+			const positionY = isAligned ? overloadedChildrenTop + scrollTopValue : overloadedChildrenTop + scrollTopValue - popupHeight / 2 + childrenHeight / 2;
+			return {
+				arrowLeft: popupWidth + arrowWidth + 5,
+				arrowTop: isAligned ? childrenHeight / 2 - arrowWidth : popupHeight / 2 - popupOverflow,
+				arrowTransform: "translate(-50%, -50%)",
+				placement: "left",
+				popupInitialPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
+				popupPosition: `translate3d(${positionX}px, ${positionY + popupOverflow}px, 0)`,
+				rotate: -90
+			};
 		};
-	};
-	computePositions = ({ placement, childrenRef, popupRef, popupPortalTarget, hasArrow, align }) => {
-		var _offsetParent$getBoun;
-		var _window$innerWidth;
-		var _window;
-		var _window$innerHeight;
-		var _window2;
-		const arrowWidth = hasArrow ? 8 : 0;
-		const childrenRect = childrenRef.current.getBoundingClientRect();
-		const offsetParent = findOffsetParent(childrenRef);
-		const offsetParentRect = (_offsetParent$getBoun = offsetParent === null || offsetParent === void 0 ? void 0 : offsetParent.getBoundingClientRect()) !== null && _offsetParent$getBoun !== void 0 ? _offsetParent$getBoun : {
-			left: 0,
-			right: (_window$innerWidth = (_window = window) === null || _window === void 0 ? void 0 : _window.innerWidth) !== null && _window$innerWidth !== void 0 ? _window$innerWidth : 0,
-			top: 0,
-			bottom: (_window$innerHeight = (_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.innerHeight) !== null && _window$innerHeight !== void 0 ? _window$innerHeight : 0
+		placementTop = (isAligned, overloadedChildrenTop, scrollTopValue, arrowWidth, popupOverflow, popupHeight, overloadedChildrenLeft, popupWidth, childrenWidth, isPopupPortalTargetBody) => {
+			const positionX = isAligned ? overloadedChildrenLeft : overloadedChildrenLeft + childrenWidth / 2 - popupWidth / 2;
+			const positionY = overloadedChildrenTop + scrollTopValue - popupHeight - getVerticalSpacing(arrowWidth);
+			const computedPositionX = isAligned ? positionX : positionX + popupOverflow;
+			const finalPositionX = isPopupPortalTargetBody ? Math.max(computedPositionX, 0) : computedPositionX;
+			return {
+				arrowLeft: overloadedChildrenLeft + childrenWidth / 2 - finalPositionX,
+				arrowTop: popupHeight - 1,
+				arrowTransform: "",
+				placement: "top",
+				popupInitialPosition: `translate3d(${finalPositionX}px, ${positionY}px, 0)`,
+				popupPosition: `translate3d(${finalPositionX}px, ${positionY}px, 0)`,
+				rotate: 0
+			};
+		};
+		computePositions = ({ placement, childrenRef, popupRef, popupPortalTarget, hasArrow, align }) => {
+			var _offsetParent$getBoun;
+			var _window$innerWidth;
+			var _window;
+			var _window$innerHeight;
+			var _window2;
+			const arrowWidth = hasArrow ? 8 : 0;
+			const childrenRect = childrenRef.current.getBoundingClientRect();
+			const offsetParent = findOffsetParent(childrenRef);
+			const offsetParentRect = (_offsetParent$getBoun = offsetParent === null || offsetParent === void 0 ? void 0 : offsetParent.getBoundingClientRect()) !== null && _offsetParent$getBoun !== void 0 ? _offsetParent$getBoun : {
+				left: 0,
+				right: (_window$innerWidth = (_window = window) === null || _window === void 0 ? void 0 : _window.innerWidth) !== null && _window$innerWidth !== void 0 ? _window$innerWidth : 0,
+				top: 0,
+				bottom: (_window$innerHeight = (_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.innerHeight) !== null && _window$innerHeight !== void 0 ? _window$innerHeight : 0
+			};
+			const popupStructuredRef = popupRef.current.getBoundingClientRect();
+			const placementBasedOnWindowSize = isGenericPlacement(placement) ? placement : computePlacement({
+				autoPlacement: placement,
+				childrenStructuredRef: childrenRect,
+				offsetParent,
+				offsetParentRect,
+				popupPortalTarget,
+				popupStructuredRef,
+				arrowWidth
+			});
+			const { top: childrenTop, left: childrenLeft, right: childrenRight, width: childrenWidth, height: childrenHeight } = childrenRect;
+			const { top: parentTop, left: parentLeft } = offsetParentRect;
+			const { width: popupWidth, height: popupHeight } = popupStructuredRef;
+			const isPopupPortalTargetBody = popupPortalTarget === document.body || offsetParent === document.body;
+			const scrollTopValue = isPopupPortalTargetBody ? document.documentElement.scrollTop : offsetParent.scrollTop;
+			const overloadedChildrenLeft = isPopupPortalTargetBody ? childrenLeft : childrenLeft - parentLeft;
+			const overloadedChildrenTop = isPopupPortalTargetBody ? childrenTop : childrenTop - parentTop;
+			const overloadedChildrenRight = isPopupPortalTargetBody ? childrenRight : childrenLeft - parentLeft + childrenWidth;
+			const popupOverflow = getPopupOverflowFromParent(placementBasedOnWindowSize, offsetParentRect, childrenRect, popupStructuredRef, arrowWidth);
+			const isAligned = align === "start";
+			switch (placementBasedOnWindowSize) {
+				case "bottom": return placementBottom(isAligned, overloadedChildrenLeft, childrenWidth, popupWidth, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, isPopupPortalTargetBody);
+				case "left": return placementLeft(isAligned, overloadedChildrenLeft, popupWidth, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight);
+				case "right": return placementRight(isAligned, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight, overloadedChildrenRight);
+				case "nested-menu": return placementNested(isAligned, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight, overloadedChildrenRight, childrenRect, offsetParent, offsetParentRect, popupStructuredRef, overloadedChildrenLeft, popupWidth, popupPortalTarget);
+				case "top": return placementTop(isAligned, overloadedChildrenTop, scrollTopValue, arrowWidth, popupOverflow, popupHeight, overloadedChildrenLeft, popupWidth, childrenWidth, isPopupPortalTargetBody);
+				default: return placementTop(isAligned, overloadedChildrenTop, scrollTopValue, arrowWidth, popupOverflow, popupHeight, overloadedChildrenLeft, popupWidth, childrenWidth, isPopupPortalTargetBody);
+			}
 		};
-		const popupStructuredRef = popupRef.current.getBoundingClientRect();
-		const placementBasedOnWindowSize = isGenericPlacement(placement) ? placement : computePlacement({
-			autoPlacement: placement,
-			childrenStructuredRef: childrenRect,
-			offsetParent,
-			offsetParentRect,
-			popupPortalTarget,
-			popupStructuredRef,
-			arrowWidth
-		});
-		const { top: childrenTop, left: childrenLeft, right: childrenRight, width: childrenWidth, height: childrenHeight } = childrenRect;
-		const { top: parentTop, left: parentLeft } = offsetParentRect;
-		const { width: popupWidth, height: popupHeight } = popupStructuredRef;
-		const isPopupPortalTargetBody = popupPortalTarget === document.body || offsetParent === document.body;
-		const scrollTopValue = isPopupPortalTargetBody ? document.documentElement.scrollTop : offsetParent.scrollTop;
-		const overloadedChildrenLeft = isPopupPortalTargetBody ? childrenLeft : childrenLeft - parentLeft;
-		const overloadedChildrenTop = isPopupPortalTargetBody ? childrenTop : childrenTop - parentTop;
-		const overloadedChildrenRight = isPopupPortalTargetBody ? childrenRight : childrenLeft - parentLeft + childrenWidth;
-		const popupOverflow = getPopupOverflowFromParent(placementBasedOnWindowSize, offsetParentRect, childrenRect, popupStructuredRef, arrowWidth);
-		const isAligned = align === "start";
-		switch (placementBasedOnWindowSize) {
-			case "bottom": return placementBottom(isAligned, overloadedChildrenLeft, childrenWidth, popupWidth, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, isPopupPortalTargetBody);
-			case "left": return placementLeft(isAligned, overloadedChildrenLeft, popupWidth, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight);
-			case "right": return placementRight(isAligned, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight, overloadedChildrenRight);
-			case "nested-menu": return placementNested(isAligned, overloadedChildrenTop, scrollTopValue, childrenHeight, arrowWidth, popupOverflow, popupHeight, overloadedChildrenRight, childrenRect, offsetParent, offsetParentRect, popupStructuredRef, overloadedChildrenLeft, popupWidth, popupPortalTarget);
-			case "top": return placementTop(isAligned, overloadedChildrenTop, scrollTopValue, arrowWidth, popupOverflow, popupHeight, overloadedChildrenLeft, popupWidth, childrenWidth, isPopupPortalTargetBody);
-			default: return placementTop(isAligned, overloadedChildrenTop, scrollTopValue, arrowWidth, popupOverflow, popupHeight, overloadedChildrenLeft, popupWidth, childrenWidth, isPopupPortalTargetBody);
-		}
-	};
-});
+	}))();
+}
 
 //#endregion
 init_helpers();

package/dist/components/Popup/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Popup/index.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,oBAAoB,EAEpB,SAAS,EACT,GAAG,EACH,SAAS,EACV,MAAM,OAAO,CAAA;AAId,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAkB3D,MAAM,MAAM,aAAa,GAAG;IAC1B,SAAS,EAAE,MAAM,CAAA;IACjB,QAAQ,EAAE,MAAM,CAAA;IAChB,cAAc,EAAE,MAAM,CAAA;IACtB,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;IACd,oBAAoB,EAAE,MAAM,CAAA;IAC5B,aAAa,EAAE,MAAM,CAAA;CACtB,CAAA;AAUD,KAAK,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,CAAA;AAEnE,KAAK,UAAU,GAAG;IAChB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,QAAQ,EACJ,SAAS,GACT,CAAC,CAAC,WAAW,EAAE;QACb,SAAS,CAAC,EAAE,MAAM,CAAA;QAClB,MAAM,EAAE,MAAM,IAAI,CAAA;QAClB,OAAO,EAAE,MAAM,IAAI,CAAA;QACnB,cAAc,EAAE,MAAM,IAAI,CAAA;QAC1B,cAAc,EAAE,MAAM,IAAI,CAAA;QAC1B,GAAG,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;KACtC,KAAK,SAAS,CAAC,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC1B;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,GAAG,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IACrC,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,oBAAoB,CAAA;IAChC,eAAe,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,CAAA;IACjE,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;;OAGG;IACH,YAAY,CAAC,EAAE,WAAW,CAAA;IAC1B;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;AAkCD;;GAEG;AACH,eAAO,MAAM,KAAK,uGA0cjB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Popup/index.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,oBAAoB,EAEpB,SAAS,EACT,GAAG,EACH,SAAS,EACV,MAAM,OAAO,CAAA;AAId,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAkB3D,MAAM,MAAM,aAAa,GAAG;IAC1B,SAAS,EAAE,MAAM,CAAA;IACjB,QAAQ,EAAE,MAAM,CAAA;IAChB,cAAc,EAAE,MAAM,CAAA;IACtB,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;IACd,oBAAoB,EAAE,MAAM,CAAA;IAC5B,aAAa,EAAE,MAAM,CAAA;CACtB,CAAA;AAUD,KAAK,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,CAAA;AAEnE,KAAK,UAAU,GAAG;IAChB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,QAAQ,EACJ,SAAS,GACT,CAAC,CAAC,WAAW,EAAE;QACb,SAAS,CAAC,EAAE,MAAM,CAAA;QAClB,MAAM,EAAE,MAAM,IAAI,CAAA;QAClB,OAAO,EAAE,MAAM,IAAI,CAAA;QACnB,cAAc,EAAE,MAAM,IAAI,CAAA;QAC1B,cAAc,EAAE,MAAM,IAAI,CAAA;QAC1B,GAAG,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;KACtC,KAAK,SAAS,CAAC,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC1B;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,GAAG,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IACrC,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,oBAAoB,CAAA;IAChC,eAAe,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,CAAA;IACjE,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;;OAGG;IACH,YAAY,CAAC,EAAE,WAAW,CAAA;IAC1B;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;AAkCD;;GAEG;AACH,eAAO,MAAM,KAAK,uGAgdjB,CAAA"}