solid-baseui 0.1.0-alpha.0

package/dist/lib/server/context-menu/index.js

@@ -0,0 +1,263 @@
+import { t as __exportAll } from "../rolldown-runtime-D7D4PA-g.js";
+import { getStateAttributesProps } from "../internals/getStateAttributesProps.js";
+import { N as triggerPress, t as cancelOpen } from "../internals/reasons.js";
+import { n as resolveClass, t as resolveStyle } from "../resolveStyle-XCSFDHAL.js";
+import { createChangeEventDetails } from "../internals/createBaseUIEventDetails.js";
+import { composeEventHandlers } from "../internals/composeEventHandlers.js";
+import { n as contains, r as getEventTarget } from "../dom-Crg_2R-j.js";
+import { i as pressableTriggerOpenStateMapping } from "../popupStateMapping-nKoUwoke.js";
+import { C as useMenuRootContext, E as useContextMenuRootContext, S as MenuRootContext, T as ContextMenuRootContext, a as MenuRadioGroup, b as mergeMenuStyles, c as MenuCheckboxItem, d as MenuGroupLabel, f as MenuGroup, h as MenuPositioner, i as MenuRadioItem, l as MenuItem, m as MenuPopup, n as MenuSubmenuRoot, o as MenuLinkItem, p as MenuArrow, r as MenuRadioItemIndicator, s as MenuCheckboxItemIndicator, t as MenuSubmenuTrigger, v as MenuPortal, x as MenuRoot, y as MenuBackdrop } from "../MenuSubmenuTrigger-DA4gsv6z.js";
+import { t as Separator } from "../Separator-vhhYxWGr.js";
+import { Dynamic, mergeProps } from "@solidjs/web";
+import { createEffect, createMemo, createSignal, omit, onCleanup } from "solid-js";
+//#region src/context-menu/root/ContextMenuRoot.tsx
+/** Groups all parts of a context menu without rendering an element. */
+function ContextMenuRoot(props) {
+	const [anchor, setAnchor] = createSignal(createInitialAnchor(), { ownedWrite: true });
+	return ContextMenuRootContext({
+		value: {
+			anchor,
+			setAnchor,
+			initialCursorPoint: { current: null },
+			allowOutsidePressDismissal: { current: false }
+		},
+		get children() {
+			return MenuRootContext({
+				value: void 0,
+				get children() {
+					return MenuRoot({
+						get defaultOpen() {
+							return props.defaultOpen;
+						},
+						get loopFocus() {
+							return props.loopFocus;
+						},
+						get highlightItemOnHover() {
+							return props.highlightItemOnHover;
+						},
+						get onOpenChange() {
+							return props.onOpenChange;
+						},
+						get onOpenChangeComplete() {
+							return props.onOpenChangeComplete;
+						},
+						get open() {
+							return props.open;
+						},
+						get orientation() {
+							return props.orientation;
+						},
+						get disabled() {
+							return props.disabled;
+						},
+						get closeParentOnEsc() {
+							return props.closeParentOnEsc;
+						},
+						get actionsRef() {
+							return props.actionsRef;
+						},
+						get children() {
+							return props.children;
+						}
+					});
+				}
+			});
+		}
+	});
+}
+function createInitialAnchor() {
+	return { getBoundingClientRect() {
+		return {
+			x: 0,
+			y: 0,
+			left: 0,
+			top: 0,
+			right: 0,
+			bottom: 0,
+			width: 0,
+			height: 0,
+			toJSON: () => ({})
+		};
+	} };
+}
+//#endregion
+//#region src/context-menu/trigger/ContextMenuTrigger.tsx
+var LONG_PRESS_DELAY = 500;
+/** An area that opens the menu on right click or long press. */
+function ContextMenuTrigger(props) {
+	const context = useContextMenuRootContext(false);
+	const menu = useMenuRootContext();
+	const internalProps = props;
+	const allProps = props;
+	const [element, setElement] = createSignal(null, { ownedWrite: true });
+	const open = createMemo(() => menu.store.open());
+	const disabled = createMemo(() => menu.store.disabled());
+	const state = createMemo(() => ({ open: open() }));
+	const classValue = createMemo(() => resolveClass(props.class, state()));
+	const styleValue = createMemo(() => mergeMenuStyles({ "-webkit-touch-callout": "none" }, resolveStyle(props.style, state())));
+	const stateAttributes = createMemo(() => getStateAttributesProps(state(), pressableTriggerOpenStateMapping));
+	const others = omit(allProps, "as", "class", "onContextMenu", "onTouchCancel", "onTouchEnd", "onTouchMove", "onTouchStart", "ref", "style");
+	let touchPosition = null;
+	let longPressTimer;
+	let allowMouseUpTimer;
+	let allowMouseUp = false;
+	let mouseUpController;
+	function openAtPoint(x, y, event) {
+		const trigger = element();
+		if (!trigger) return;
+		const anchor = createPointAnchor(trigger, x, y, event.type.startsWith("touch"));
+		context.initialCursorPoint.current = {
+			x,
+			y
+		};
+		context.setAnchor(anchor);
+		menu.store.setOpenMethod(event.type.startsWith("touch") ? "touch" : "mouse");
+		menu.store.context.floatingRoot.update({
+			domReferenceElement: trigger,
+			referenceElement: trigger,
+			positionReference: anchor
+		});
+		allowMouseUp = false;
+		menu.store.setOpen(true, createChangeEventDetails(triggerPress, event));
+		clearTimeout(allowMouseUpTimer);
+		allowMouseUpTimer = setTimeout(() => {
+			allowMouseUp = true;
+		}, LONG_PRESS_DELAY);
+	}
+	function handleContextMenu(event) {
+		const trigger = element();
+		if (!trigger || disabled()) return;
+		menu.store.allowMouseUpTrigger = true;
+		event.preventDefault();
+		event.stopPropagation();
+		openAtPoint(event.clientX, event.clientY, event);
+		mouseUpController?.abort();
+		const controller = new ((trigger.ownerDocument.defaultView?.AbortController) ?? AbortController)();
+		mouseUpController = controller;
+		trigger.ownerDocument.addEventListener("mouseup", (mouseEvent) => {
+			menu.store.allowMouseUpTrigger = false;
+			if (!allowMouseUp) return;
+			clearTimeout(allowMouseUpTimer);
+			allowMouseUp = false;
+			const target = getEventTarget(mouseEvent);
+			if (contains(menu.store.track().positionerElement, target)) return;
+			const rootId = menu.store.rootNodeId();
+			if (rootId && target?.closest(`[data-rootownerid="${rootId}"]`)) return;
+			menu.store.setOpen(false, createChangeEventDetails(cancelOpen, mouseEvent));
+		}, {
+			once: true,
+			signal: controller.signal
+		});
+	}
+	function cancelLongPress() {
+		clearTimeout(longPressTimer);
+		touchPosition = null;
+	}
+	function handleTouchStart(event) {
+		cancelLongPress();
+		menu.store.allowMouseUpTrigger = false;
+		if (disabled() || event.touches.length !== 1) return;
+		event.stopPropagation();
+		const touch = event.touches[0];
+		touchPosition = {
+			x: touch.clientX,
+			y: touch.clientY
+		};
+		longPressTimer = setTimeout(() => {
+			if (touchPosition && !disabled()) openAtPoint(touchPosition.x, touchPosition.y, event);
+		}, LONG_PRESS_DELAY);
+	}
+	function handleTouchMove(event) {
+		if (!touchPosition || event.touches.length !== 1) {
+			cancelLongPress();
+			return;
+		}
+		const touch = event.touches[0];
+		if (Math.abs(touch.clientX - touchPosition.x) > 10 || Math.abs(touch.clientY - touchPosition.y) > 10) cancelLongPress();
+	}
+	const onContextMenu = composeEventHandlers(() => internalProps.onContextMenu, () => handleContextMenu);
+	const onTouchStart = composeEventHandlers(() => internalProps.onTouchStart, () => handleTouchStart);
+	const onTouchMove = composeEventHandlers(() => internalProps.onTouchMove, () => handleTouchMove);
+	const onTouchEnd = composeEventHandlers(() => internalProps.onTouchEnd, () => cancelLongPress);
+	const onTouchCancel = composeEventHandlers(() => internalProps.onTouchCancel, () => cancelLongPress);
+	createEffect(() => ({
+		trigger: element(),
+		disabled: disabled(),
+		backdrop: menu.backdropElement(),
+		internalBackdrop: menu.internalBackdropElement()
+	}), (current) => {
+		if (!current.trigger || current.disabled) return;
+		const suppressNativeMenu = (event) => {
+			const target = getEventTarget(event);
+			if (contains(current.trigger, target) || contains(current.backdrop, target) || contains(current.internalBackdrop, target)) event.preventDefault();
+		};
+		current.trigger.ownerDocument.addEventListener("contextmenu", suppressNativeMenu);
+		return () => current.trigger?.ownerDocument.removeEventListener("contextmenu", suppressNativeMenu);
+	});
+	onCleanup(() => {
+		cancelLongPress();
+		clearTimeout(allowMouseUpTimer);
+		mouseUpController?.abort();
+	});
+	return Dynamic(mergeProps({
+		get component() {
+			return props.as ?? "div";
+		},
+		ref: [((value) => setElement(value)), internalProps.ref],
+		get ["class"]() {
+			return classValue();
+		},
+		get style() {
+			return styleValue();
+		},
+		onContextMenu,
+		onTouchStart,
+		onTouchMove,
+		onTouchEnd,
+		onTouchCancel
+	}, stateAttributes, others));
+}
+function createPointAnchor(contextElement, x, y, touch) {
+	return {
+		contextElement,
+		getBoundingClientRect() {
+			const size = touch ? 10 : 0;
+			return {
+				x,
+				y,
+				left: x,
+				top: y,
+				right: x + size,
+				bottom: y + size,
+				width: size,
+				height: size,
+				toJSON: () => ({})
+			};
+		}
+	};
+}
+//#endregion
+//#region src/context-menu/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Arrow: () => MenuArrow,
+	Backdrop: () => MenuBackdrop,
+	CheckboxItem: () => MenuCheckboxItem,
+	CheckboxItemIndicator: () => MenuCheckboxItemIndicator,
+	Group: () => MenuGroup,
+	GroupLabel: () => MenuGroupLabel,
+	Item: () => MenuItem,
+	LinkItem: () => MenuLinkItem,
+	Popup: () => MenuPopup,
+	Portal: () => MenuPortal,
+	Positioner: () => MenuPositioner,
+	RadioGroup: () => MenuRadioGroup,
+	RadioItem: () => MenuRadioItem,
+	RadioItemIndicator: () => MenuRadioItemIndicator,
+	Root: () => ContextMenuRoot,
+	Separator: () => Separator,
+	SubmenuRoot: () => MenuSubmenuRoot,
+	SubmenuTrigger: () => MenuSubmenuTrigger,
+	Trigger: () => ContextMenuTrigger
+});
+//#endregion
+export { index_parts_exports as ContextMenu };

package/dist/lib/server/createAnchorPositioning-C-cVOPwz.js

@@ -0,0 +1,381 @@
+import { m as ownerWindow, p as ownerDocument } from "./dom-Crg_2R-j.js";
+import { createEffect, createMemo, createSignal } from "solid-js";
+import { autoUpdate, computePosition, detectOverflow, flip, limitShift, offset, shift, size } from "@floating-ui/dom";
+//#region src/internals/overlay/createFloatingPosition.ts
+var INITIAL_STATE = {
+	x: 0,
+	y: 0,
+	placement: "bottom",
+	strategy: "absolute",
+	middlewareData: {},
+	isPositioned: false
+};
+function createFloatingPosition(options) {
+	const [state, setState] = createSignal(INITIAL_STATE, { ownedWrite: true });
+	let currentUpdate = async () => {};
+	let generation = 0;
+	createEffect(() => ({
+		reference: options.reference(),
+		floating: options.floating(),
+		open: options.open?.(),
+		placement: options.placement?.() ?? "bottom",
+		strategy: options.strategy?.() ?? "absolute",
+		middleware: options.middleware?.().filter((item) => item != null) ?? [],
+		autoUpdateOptions: options.autoUpdate?.() ?? {}
+	}), (config) => {
+		const effectGeneration = ++generation;
+		if (!config.reference || !config.floating) {
+			currentUpdate = async () => {};
+			setState({
+				...INITIAL_STATE,
+				placement: config.placement,
+				strategy: config.strategy
+			});
+			return;
+		}
+		let request = 0;
+		currentUpdate = async () => {
+			const currentRequest = ++request;
+			const result = await computePosition(config.reference, config.floating, {
+				placement: config.placement,
+				strategy: config.strategy,
+				middleware: config.middleware
+			});
+			if (generation === effectGeneration && request === currentRequest) setState({
+				...result,
+				isPositioned: config.open !== false
+			});
+		};
+		if (config.open === false) setState((previous) => ({
+			...previous,
+			isPositioned: false
+		}));
+		if (config.autoUpdateOptions === false) {
+			currentUpdate();
+			return;
+		}
+		return autoUpdate(config.reference, config.floating, () => void currentUpdate(), config.autoUpdateOptions);
+	});
+	return {
+		state,
+		styles: createMemo(() => {
+			const current = state();
+			if (!current.isPositioned) return {
+				position: "fixed",
+				top: "0px",
+				left: "0px"
+			};
+			if (options.transform?.() ?? true) {
+				const dpr = ownerWindow(options.floating()).devicePixelRatio || 1;
+				const x = Math.round(current.x * dpr) / dpr;
+				const y = Math.round(current.y * dpr) / dpr;
+				return {
+					position: current.strategy,
+					top: 0,
+					left: 0,
+					transform: `translate(${x}px, ${y}px)`,
+					"will-change": dpr >= 1.5 ? "transform" : void 0
+				};
+			}
+			return {
+				position: current.strategy,
+				left: `${Math.round(current.x)}px`,
+				top: `${Math.round(current.y)}px`
+			};
+		}),
+		update: () => currentUpdate()
+	};
+}
+//#endregion
+//#region src/internals/overlay/createAnchorPositioning.ts
+function getSide(placement) {
+	return placement.split("-")[0];
+}
+function getAlignment(placement) {
+	return placement.split("-")[1];
+}
+function paddingObject(padding) {
+	if (typeof padding === "number") return {
+		top: padding,
+		right: padding,
+		bottom: padding,
+		left: padding
+	};
+	return {
+		top: padding.top ?? 0,
+		right: padding.right ?? 0,
+		bottom: padding.bottom ?? 0,
+		left: padding.left ?? 0
+	};
+}
+function baseArrow(options) {
+	return {
+		name: "arrow",
+		options,
+		async fn(state) {
+			const { x, y, placement, rects, platform, elements, middlewareData } = state;
+			const { element, padding = 0, offsetParent = "real" } = typeof options === "function" ? options(state) : options;
+			if (!element) return {};
+			const axis = ["top", "bottom"].includes(getSide(placement)) ? "x" : "y";
+			const length = axis === "x" ? "width" : "height";
+			const minProp = axis === "x" ? "left" : "top";
+			const maxProp = axis === "x" ? "right" : "bottom";
+			const clientProp = axis === "x" ? "clientWidth" : "clientHeight";
+			const dimensions = await platform.getDimensions(element);
+			const coords = {
+				x,
+				y
+			};
+			const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
+			const startDiff = coords[axis] - rects.reference[axis];
+			const offsetParentElement = offsetParent === "real" ? await platform.getOffsetParent?.(element) : elements.floating;
+			let clientSize = elements.floating[clientProp] || rects.floating[length];
+			if (!clientSize || !await platform.isElement?.(offsetParentElement)) clientSize = elements.floating[clientProp] || rects.floating[length];
+			const centerToReference = endDiff / 2 - startDiff / 2;
+			const paddingValues = paddingObject(padding);
+			const largestPadding = clientSize / 2 - dimensions[length] / 2 - 1;
+			const minPadding = Math.min(paddingValues[minProp], largestPadding);
+			const maxPadding = Math.min(paddingValues[maxProp], largestPadding);
+			const min = minPadding;
+			const max = clientSize - dimensions[length] - maxPadding;
+			const center = clientSize / 2 - dimensions[length] / 2 + centerToReference;
+			const arrowOffset = Math.max(min, Math.min(center, max));
+			const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== arrowOffset && rects.reference[length] / 2 - (center < min ? minPadding : maxPadding) - dimensions[length] / 2 < 0;
+			const alignmentOffset = shouldAddOffset ? center < min ? center - min : center - max : 0;
+			return {
+				[axis]: coords[axis] + alignmentOffset,
+				data: {
+					[axis]: arrowOffset,
+					centerOffset: center - arrowOffset - alignmentOffset,
+					...shouldAddOffset ? { alignmentOffset } : void 0
+				},
+				reset: shouldAddOffset
+			};
+		}
+	};
+}
+var hideReference = {
+	name: "hide",
+	async fn(state) {
+		const { width, height, x, y } = state.rects.reference;
+		const anchorHidden = width === 0 && height === 0 && x === 0 && y === 0;
+		const overflow = await detectOverflow(state, { elementContext: "reference" });
+		return { data: { referenceHidden: anchorHidden || overflow.top - height >= 0 || overflow.right - width >= 0 || overflow.bottom - height >= 0 || overflow.left - width >= 0 } };
+	}
+};
+function physicalSide(side, rtl) {
+	if (side === "inline-start") return rtl ? "right" : "left";
+	if (side === "inline-end") return rtl ? "left" : "right";
+	return side;
+}
+function logicalSide(requested, rendered, rtl) {
+	if (requested !== "inline-start" && requested !== "inline-end") return rendered;
+	if (rendered === "right") return rtl ? "inline-start" : "inline-end";
+	if (rendered === "left") return rtl ? "inline-end" : "inline-start";
+	return rendered;
+}
+function offsetData(state, requested, rtl) {
+	return {
+		side: logicalSide(requested, getSide(state.placement), rtl),
+		align: getAlignment(state.placement) ?? "center",
+		anchor: {
+			width: state.rects.reference.width,
+			height: state.rects.reference.height
+		},
+		positioner: {
+			width: state.rects.floating.width,
+			height: state.rects.floating.height
+		}
+	};
+}
+function createAnchorPositioning(options) {
+	const [arrowElement, setArrowElement] = createSignal(null, { ownedWrite: true });
+	const [availableWidth, setAvailableWidth] = createSignal("100vw", { ownedWrite: true });
+	const [availableHeight, setAvailableHeight] = createSignal("100vh", { ownedWrite: true });
+	const [anchorWidth, setAnchorWidth] = createSignal(void 0, { ownedWrite: true });
+	const [anchorHeight, setAnchorHeight] = createSignal(void 0, { ownedWrite: true });
+	const rtl = () => options.direction?.() === "rtl";
+	const requestedSide = () => options.side?.() ?? "bottom";
+	const requestedAlign = () => options.align?.() ?? "center";
+	const placement = createMemo(() => {
+		const side = physicalSide(requestedSide(), rtl());
+		const align = requestedAlign();
+		return align === "center" ? side : `${side}-${align}`;
+	});
+	const middleware = createMemo(() => {
+		const collision = options.collisionAvoidance?.() ?? {};
+		const sideMode = collision.side ?? "flip";
+		const alignMode = collision.align ?? "flip";
+		const fallbackAxisSide = collision.fallbackAxisSide ?? "end";
+		const sticky = options.sticky?.() ?? false;
+		const shiftCrossAxis = options.shiftCrossAxis?.() ?? false;
+		const collisionPadding = paddingObject(options.collisionPadding?.() ?? 5);
+		const boundary = options.collisionBoundary?.();
+		const common = {
+			boundary: boundary === "clipping-ancestors" || boundary === void 0 ? "clippingAncestors" : boundary,
+			padding: collisionPadding
+		};
+		const sideOffset = options.sideOffset?.() ?? 0;
+		const alignOffset = options.alignOffset?.() ?? 0;
+		const currentArrowElement = arrowElement();
+		const currentFloatingElement = options.floating();
+		const arrowPadding = options.arrowPadding?.() ?? 5;
+		const offsetMiddleware = offset((state) => {
+			const data = offsetData(state, requestedSide(), rtl());
+			const mainAxis = typeof sideOffset === "function" ? sideOffset(data) : sideOffset;
+			const alignmentAxis = typeof alignOffset === "function" ? alignOffset(data) : alignOffset;
+			return {
+				mainAxis,
+				crossAxis: alignmentAxis,
+				alignmentAxis
+			};
+		});
+		const shiftDisabled = alignMode === "none" && sideMode !== "shift";
+		const crossAxis = !shiftDisabled && (sticky || shiftCrossAxis || sideMode === "shift");
+		const bias = 1;
+		const side = requestedSide();
+		const flipMiddleware = sideMode === "none" ? null : flip({
+			...common,
+			padding: {
+				top: collisionPadding.top + bias + (side === "bottom" ? bias : 0),
+				right: collisionPadding.right + bias + (side === "left" ? bias : 0),
+				bottom: collisionPadding.bottom + bias + (side === "top" ? bias : 0),
+				left: collisionPadding.left + bias + (side === "right" ? bias : 0)
+			},
+			mainAxis: !shiftCrossAxis && sideMode === "flip",
+			crossAxis: alignMode === "flip" ? "alignment" : false,
+			fallbackAxisSideDirection: fallbackAxisSide
+		});
+		const shiftMiddleware = shiftDisabled ? null : shift({
+			...common,
+			rootBoundary: options.shiftRootBoundary?.(),
+			mainAxis: alignMode !== "none",
+			crossAxis,
+			limiter: sticky || shiftCrossAxis ? void 0 : limitShift((state) => {
+				const arrow = currentArrowElement;
+				if (!arrow) return {};
+				const rect = arrow.getBoundingClientRect();
+				const sideAxis = ["top", "bottom"].includes(getSide(state.placement)) ? "y" : "x";
+				const arrowSize = sideAxis === "y" ? rect.width : rect.height;
+				const paddingAmount = sideAxis === "y" ? collisionPadding.left + collisionPadding.right : collisionPadding.top + collisionPadding.bottom;
+				return { offset: arrowSize / 2 + paddingAmount / 2 };
+			})
+		});
+		const collisions = sideMode === "shift" || alignMode === "shift" || requestedAlign() === "center" ? [shiftMiddleware, flipMiddleware] : [flipMiddleware, shiftMiddleware];
+		return [
+			options.inlineMiddleware?.(),
+			offsetMiddleware,
+			...collisions,
+			size({
+				...common,
+				apply({ elements, availableWidth, availableHeight, rects }) {
+					if (!options.mounted()) return;
+					elements.floating.style.setProperty("--available-width", `${availableWidth}px`);
+					elements.floating.style.setProperty("--available-height", `${availableHeight}px`);
+					setAvailableWidth(`${availableWidth}px`);
+					setAvailableHeight(`${availableHeight}px`);
+					const dpr = ownerWindow(elements.floating).devicePixelRatio || 1;
+					const { x, y, width, height } = rects.reference;
+					const anchorWidth = (Math.round((x + width) * dpr) - Math.round(x * dpr)) / dpr;
+					const anchorHeight = (Math.round((y + height) * dpr) - Math.round(y * dpr)) / dpr;
+					elements.floating.style.setProperty("--anchor-width", `${anchorWidth}px`);
+					elements.floating.style.setProperty("--anchor-height", `${anchorHeight}px`);
+					setAnchorWidth(`${anchorWidth}px`);
+					setAnchorHeight(`${anchorHeight}px`);
+				}
+			}),
+			baseArrow(() => ({
+				element: currentArrowElement ?? ownerDocument(currentFloatingElement).createElement("div"),
+				padding: arrowPadding,
+				offsetParent: "floating"
+			})),
+			{
+				name: "transformOrigin",
+				fn(state) {
+					const renderedSide = getSide(state.placement);
+					const arrow = currentArrowElement;
+					const arrowX = state.middlewareData.arrow?.x ?? 0;
+					const arrowY = state.middlewareData.arrow?.y ?? 0;
+					const transformX = arrowX + (arrow?.clientWidth ?? 0) / 2;
+					const transformY = arrowY + (arrow?.clientHeight ?? 0) / 2;
+					const sideOffsetValue = typeof sideOffset === "function" ? sideOffset(offsetData(state, requestedSide(), rtl())) : sideOffset;
+					const adjacent = {
+						top: `${transformX}px calc(100% + ${sideOffsetValue}px)`,
+						bottom: `${transformX}px ${-sideOffsetValue}px`,
+						left: `calc(100% + ${sideOffsetValue}px) ${transformY}px`,
+						right: `${-sideOffsetValue}px ${transformY}px`
+					}[renderedSide];
+					const overlap = `${transformX}px ${state.rects.reference.y + state.rects.reference.height / 2 - state.y}px`;
+					const overlaps = Math.abs(state.middlewareData.shift?.y ?? 0) > sideOffsetValue;
+					state.elements.floating.style.setProperty("--transform-origin", crossAxis && ["top", "bottom"].includes(renderedSide) && overlaps ? overlap : adjacent);
+					return {};
+				}
+			},
+			hideReference,
+			options.adaptiveOriginMiddleware?.()
+		];
+	});
+	createEffect(() => options.floating(), (floating) => {
+		if (floating) {
+			floating.style.setProperty("--available-width", "100vw");
+			floating.style.setProperty("--available-height", "100vh");
+		}
+	});
+	const position = createFloatingPosition({
+		reference: () => options.mounted() ? options.reference() : null,
+		floating: options.floating,
+		open: options.mounted,
+		placement,
+		strategy: () => options.positionMethod?.() ?? "absolute",
+		middleware,
+		transform: () => !options.adaptiveOriginMiddleware?.(),
+		autoUpdate: () => ({
+			elementResize: !(options.disableAnchorTracking?.() ?? false) && typeof ResizeObserver !== "undefined",
+			layoutShift: !(options.disableAnchorTracking?.() ?? false) && typeof IntersectionObserver !== "undefined"
+		})
+	});
+	const styles = createMemo(() => {
+		const current = position.state();
+		const sizeVariables = {
+			"--available-width": availableWidth(),
+			"--available-height": availableHeight(),
+			"--anchor-width": anchorWidth(),
+			"--anchor-height": anchorHeight()
+		};
+		const adaptive = current.middlewareData.adaptiveOrigin;
+		if (adaptive && current.isPositioned) return {
+			...sizeVariables,
+			position: current.strategy,
+			[adaptive.sideX ?? "left"]: `${current.x}px`,
+			[adaptive.sideY ?? "top"]: `${current.y}px`
+		};
+		return {
+			...sizeVariables,
+			...position.styles(),
+			opacity: current.isPositioned ? void 0 : 0
+		};
+	});
+	const renderedSide = createMemo(() => logicalSide(requestedSide(), getSide(position.state().placement), rtl()));
+	const renderedAlign = createMemo(() => getAlignment(position.state().placement) ?? "center");
+	const arrowStyles = createMemo(() => {
+		const arrow = position.state().middlewareData.arrow;
+		return {
+			position: "absolute",
+			top: arrow?.y === void 0 ? void 0 : `${arrow.y}px`,
+			left: arrow?.x === void 0 ? void 0 : `${arrow.x}px`
+		};
+	});
+	return {
+		state: position.state,
+		styles,
+		arrowStyles,
+		renderedSide,
+		renderedAlign,
+		anchorHidden: () => Boolean(position.state().middlewareData.hide?.referenceHidden),
+		arrowUncentered: () => (position.state().middlewareData.arrow?.centerOffset ?? 0) !== 0,
+		setArrowElement,
+		update: position.update
+	};
+}
+//#endregion
+export { createAnchorPositioning as t };

package/dist/lib/server/createAnchoredPopupScrollLock-DFuUrykR.js

@@ -0,0 +1,20 @@
+import { p as ownerDocument } from "./dom-Crg_2R-j.js";
+import { n as createScrollLock } from "./InternalBackdrop-C_iDPVR-.js";
+//#region src/internals/overlay/createAnchoredPopupScrollLock.ts
+function shouldLockAnchoredPopup(options) {
+	if (!options.enabled) return false;
+	if (!options.touchOpen) return true;
+	if (!options.positioner) return false;
+	const width = options.positioner.offsetWidth;
+	const viewportWidth = ownerDocument(options.positioner).documentElement.clientWidth;
+	return width > 0 && viewportWidth > 0 && width >= viewportWidth - 20;
+}
+function createAnchoredPopupScrollLock(options) {
+	createScrollLock(() => shouldLockAnchoredPopup({
+		enabled: options.enabled(),
+		touchOpen: options.touchOpen(),
+		positioner: options.positioner()
+	}), options.reference);
+}
+//#endregion
+export { createAnchoredPopupScrollLock as t };