solid-baseui 0.1.0-alpha.0

package/dist/lib/server/tooltip/index.js

@@ -0,0 +1,1092 @@
+import { t as __exportAll } from "../rolldown-runtime-D7D4PA-g.js";
+import { getStateAttributesProps } from "../internals/getStateAttributesProps.js";
+import { M as triggerHover, N as triggerPress, d as imperativeAction, s as disabled, w as none } from "../internals/reasons.js";
+import { n as resolveClass, t as resolveStyle } from "../resolveStyle-XCSFDHAL.js";
+import { createChangeEventDetails } from "../internals/createBaseUIEventDetails.js";
+import { transitionStatusMapping } from "../internals/stateAttributesMapping.js";
+import { composeEventHandlers } from "../internals/composeEventHandlers.js";
+import { a as isElement, m as ownerWindow, n as contains, r as getEventTarget } from "../dom-Crg_2R-j.js";
+import { t as PopupViewport } from "../PopupViewport-3r_KTFwX.js";
+import { t as createAnchorPositioning } from "../createAnchorPositioning-C-cVOPwz.js";
+import { c as useFloatingTree, i as createFloatingNode, n as FloatingTreeContext, r as FloatingTreeStore, s as useFloatingParentNodeId, t as FloatingParentNodeContext } from "../FloatingTree-z1JPD1dR.js";
+import { a as createPopupPresence, n as createTriggerRegistration, o as createDismiss, t as PopupStore } from "../PopupStore-DEs3FAEe.js";
+import { t as createFocusInteraction } from "../createFocusInteraction-EIS0QOel.js";
+import { n as createInitialPositioning, r as createHoverInteraction, t as safePolygon } from "../safePolygon-CAm5RJGv.js";
+import { a as triggerOpenStateMapping, o as PopupPortal } from "../popupStateMapping-nKoUwoke.js";
+import { i as createPopupHandleStore, n as DetachedPopupStore, r as attachPopupHandle, t as BasePopupHandle } from "../PopupHandle-DthPgNjy.js";
+import { t as setRef } from "../setRef-Bt70sW7c.js";
+import { n as useDirection } from "../DirectionContext-YORWLF08.js";
+import { Dynamic, escape, memo, mergeProps } from "@solidjs/web";
+import { $REFRESH, Show, createContext, createEffect, createMemo, createRoot, createSignal, createUniqueId, omit, onCleanup, untrack, useContext } from "solid-js";
+//#region src/internals/overlay/createClientPoint.ts
+function createClientPoint(options) {
+	let x = null;
+	let y = null;
+	let removeWindowListener;
+	let suspended = false;
+	const resetReference = () => {
+		options.context.set("positionReference", options.context.state.referenceElement);
+	};
+	const updateReference = (event, directReferenceEvent = false) => {
+		if (!(options.enabled?.() ?? true) || options.axis() === "none") {
+			resetReference();
+			return;
+		}
+		const openEvent = options.context.context.data.openEvent;
+		if (options.context.state.open && (!openEvent || ![
+			"mouseenter",
+			"mousemove",
+			"pointerenter",
+			"pointermove"
+		].includes(openEvent.type))) {
+			resetReference();
+			return;
+		}
+		if (contains(options.context.state.floatingElement, getEventTarget(event))) {
+			suspended = true;
+			return;
+		}
+		if (directReferenceEvent) suspended = false;
+		else if (suspended) return;
+		x = event.clientX;
+		y = event.clientY;
+		const reference = options.context.state.domReferenceElement;
+		if (!reference) return;
+		const virtual = {
+			contextElement: reference,
+			getBoundingClientRect() {
+				const rect = reference.getBoundingClientRect();
+				const axis = options.axis();
+				const left = axis === "y" ? rect.left : x ?? rect.left;
+				const top = axis === "x" ? rect.top : y ?? rect.top;
+				const width = axis === "y" || axis === "none" ? rect.width : 0;
+				const height = axis === "x" || axis === "none" ? rect.height : 0;
+				return {
+					x: left,
+					y: top,
+					left,
+					top,
+					right: left + width,
+					bottom: top + height,
+					width,
+					height,
+					toJSON: () => ({})
+				};
+			}
+		};
+		options.context.set("positionReference", virtual);
+	};
+	createEffect(() => ({
+		axis: options.axis(),
+		enabled: options.enabled?.() ?? true,
+		open: options.context.track().open,
+		reference: options.context.track().domReferenceElement,
+		openEvent: options.context.context.data.openEvent
+	}), (state) => {
+		removeWindowListener?.();
+		removeWindowListener = void 0;
+		if (!state.enabled || state.axis === "none" || !state.reference) {
+			resetReference();
+			return;
+		}
+		if (!state.open) return;
+		if (!state.openEvent || ![
+			"mouseenter",
+			"mousemove",
+			"pointerenter",
+			"pointermove"
+		].includes(state.openEvent.type)) {
+			resetReference();
+			return;
+		}
+		const windowNode = ownerWindow(state.reference);
+		suspended = false;
+		const handleWindowMove = (event) => updateReference(event);
+		windowNode.addEventListener("mousemove", handleWindowMove);
+		removeWindowListener = () => windowNode.removeEventListener("mousemove", handleWindowMove);
+		return removeWindowListener;
+	});
+	onCleanup(() => {
+		removeWindowListener?.();
+		options.context.set("positionReference", null);
+	});
+	return { onMouseMove: (event) => updateReference(event, true) };
+}
+//#endregion
+//#region src/internals/overlay/createDelayGroup.ts
+function normalizeDelay(delay) {
+	return typeof delay === "number" ? {
+		open: delay,
+		close: delay
+	} : {
+		open: delay?.open ?? 0,
+		close: delay?.close ?? 0
+	};
+}
+function createDelayGroup(options) {
+	let currentIdValue = null;
+	let instantIdValues = /* @__PURE__ */ new Set();
+	let instantPhase = false;
+	const consumers = /* @__PURE__ */ new Map();
+	const notify = () => {
+		for (const [id, consumer] of consumers) consumer.setInstant?.(instantIdValues.has(id));
+	};
+	const delay = () => {
+		const current = normalizeDelay(options.delay());
+		return instantPhase ? {
+			open: 0,
+			close: current.close
+		} : current;
+	};
+	const currentId = () => currentIdValue;
+	let resetTimer;
+	onCleanup(() => clearTimeout(resetTimer));
+	return {
+		delay,
+		currentId,
+		isInstant: (id) => instantIdValues.has(id),
+		subscribe(id, closeSibling, setInstant) {
+			consumers.set(id, {
+				closeSibling,
+				setInstant
+			});
+			setInstant?.(instantIdValues.has(id));
+			return () => consumers.delete(id);
+		},
+		open(id, owner) {
+			clearTimeout(resetTimer);
+			const previous = currentIdValue;
+			if (previous && previous !== id) {
+				instantIdValues = /* @__PURE__ */ new Set([
+					...consumers.keys(),
+					previous,
+					id
+				]);
+				for (const [consumerId, consumer] of consumers) if (consumerId !== id && consumer.closeSibling !== owner) consumer.closeSibling();
+			}
+			currentIdValue = id;
+			instantPhase = true;
+			notify();
+		},
+		close(id) {
+			const nextInstantIds = new Set(instantIdValues);
+			nextInstantIds.delete(id);
+			instantIdValues = nextInstantIds;
+			notify();
+			if (currentIdValue !== id) return;
+			clearTimeout(resetTimer);
+			resetTimer = setTimeout(() => {
+				if (currentIdValue === id) {
+					currentIdValue = null;
+					instantIdValues = /* @__PURE__ */ new Set();
+					instantPhase = false;
+					notify();
+				}
+			}, options.timeout?.() ?? 400);
+		}
+	};
+}
+//#endregion
+//#region src/tooltip/provider/TooltipProviderContext.ts
+var MISSING_CONTEXT$3 = Symbol("TooltipProviderContext");
+var TooltipProviderContext = createContext(MISSING_CONTEXT$3);
+function useTooltipProviderContext() {
+	const context = useContext(TooltipProviderContext);
+	return context === MISSING_CONTEXT$3 ? void 0 : context;
+}
+//#endregion
+//#region src/tooltip/provider/TooltipProvider.tsx
+/** Shares hover delays so adjacent tooltips can open without waiting again. */
+function TooltipProvider(props) {
+	return TooltipProviderContext({
+		value: {
+			delay: () => props.delay,
+			group: createDelayGroup({
+				delay: () => ({
+					open: props.delay,
+					close: props.closeDelay
+				}),
+				timeout: () => props.timeout ?? 400
+			})
+		},
+		get children() {
+			return props.children;
+		}
+	});
+}
+//#endregion
+//#region src/tooltip/store/TooltipStore.ts
+var TooltipStore = class extends PopupStore {
+	triggerData = /* @__PURE__ */ new Map();
+	disabledAccessor;
+	disableHoverablePopupAccessor;
+	trackCursorAxisAccessor;
+	lastReasonAccessor;
+	setLastReason;
+	instantPhaseAccessor;
+	setInstantPhaseSignal;
+	closeOnClickAccessor;
+	setCloseOnClick;
+	closeDelayAccessor;
+	setCloseDelay;
+	delayGroup;
+	delayGroupId;
+	delayGroupOwner;
+	constructor(options) {
+		super(options);
+		this.disabledAccessor = options.disabled;
+		this.disableHoverablePopupAccessor = options.disableHoverablePopup;
+		this.trackCursorAxisAccessor = options.trackCursorAxis;
+		const [lastReason, setLastReason] = createSignal(null, { ownedWrite: true });
+		this.lastReasonAccessor = lastReason;
+		this.setLastReason = setLastReason;
+		const [instantPhase, setInstantPhase] = createSignal(false, { ownedWrite: true });
+		this.instantPhaseAccessor = instantPhase;
+		this.setInstantPhaseSignal = setInstantPhase;
+		const [closeOnClick, setCloseOnClick] = createSignal(true, { ownedWrite: true });
+		this.closeOnClickAccessor = closeOnClick;
+		this.setCloseOnClick = setCloseOnClick;
+		const [closeDelay, setCloseDelay] = createSignal(0, { ownedWrite: true });
+		this.closeDelayAccessor = closeDelay;
+		this.setCloseDelay = setCloseDelay;
+	}
+	open() {
+		return !(this.disabledAccessor?.() ?? false) && super.open();
+	}
+	rawOpen() {
+		return super.open();
+	}
+	disabled() {
+		return this.disabledAccessor();
+	}
+	disableHoverablePopup() {
+		return this.disableHoverablePopupAccessor();
+	}
+	trackCursorAxis() {
+		return this.trackCursorAxisAccessor();
+	}
+	lastOpenChangeReason() {
+		return this.lastReasonAccessor();
+	}
+	isInstantPhase() {
+		return this.instantPhaseAccessor();
+	}
+	setInstantPhase(value) {
+		this.setInstantPhaseSignal(value);
+	}
+	closeOnClick() {
+		return this.closeOnClickAccessor();
+	}
+	closeDelay() {
+		return this.closeDelayAccessor();
+	}
+	configureDelayGroup(group, id, owner) {
+		this.delayGroup = group;
+		this.delayGroupId = id;
+		this.delayGroupOwner = owner;
+	}
+	syncDelayGroup(open) {
+		if (!this.delayGroup || this.delayGroupId === void 0) return;
+		if (open) this.delayGroup.open(this.delayGroupId, this.delayGroupOwner);
+		else this.delayGroup.close(this.delayGroupId);
+	}
+	setTriggerData(id, data) {
+		this.triggerData.set(id, data);
+	}
+	removeTriggerData(id) {
+		this.triggerData.delete(id);
+	}
+	syncTriggerData(activeId, open) {
+		const data = this.triggerData.get(activeId ?? "");
+		this.setCloseOnClick(data?.closeOnClick ?? true);
+		this.setCloseDelay(data?.closeDelay ?? 0);
+		if (data && open) this.set("payload", data.payload);
+	}
+	setOpen(open, details) {
+		if (open && this.disabled()) return false;
+		const accepted = super.setOpen(open, details);
+		if (accepted) {
+			this.setLastReason(details.reason);
+			this.syncDelayGroup(this.open());
+		}
+		return accepted;
+	}
+	cancelPendingOpen(event) {
+		this.context.floatingRoot.dispatchOpenChange(false, createChangeEventDetails(triggerPress, event));
+	}
+};
+var DetachedTooltipStore = class extends DetachedPopupStore {
+	disabled() {
+		return false;
+	}
+	disableHoverablePopup() {
+		return false;
+	}
+	trackCursorAxis() {
+		return "none";
+	}
+	closeOnClick() {
+		return true;
+	}
+	closeDelay() {
+		return 0;
+	}
+	setTriggerData(_id, _data) {}
+	removeTriggerData(_id) {}
+	syncTriggerData(_activeId, _open) {}
+	cancelPendingOpen(_event) {}
+};
+//#endregion
+//#region src/tooltip/root/TooltipRootContext.ts
+var MISSING_CONTEXT$2 = Symbol("TooltipRootContext");
+var TooltipRootContext = createContext(MISSING_CONTEXT$2);
+function useTooltipRootContext(optional = false) {
+	const context = useContext(TooltipRootContext);
+	if (context === MISSING_CONTEXT$2) {
+		if (optional) return;
+		throw new Error("Base UI: TooltipRootContext is missing. Tooltip parts must be placed within <Tooltip.Root>.");
+	}
+	return context;
+}
+//#endregion
+//#region src/tooltip/root/TooltipRoot.tsx
+/** Groups all parts of the tooltip without rendering an element. */
+function TooltipRoot(props) {
+	const parentTree = useFloatingTree();
+	const parentNodeId = useFloatingParentNodeId();
+	const provider = useTooltipProviderContext();
+	const tree = parentTree ?? new FloatingTreeStore();
+	const nodeId = createUniqueId();
+	const delayGroupId = Symbol("TooltipRoot");
+	const floatingId = createUniqueId();
+	const controlledOpen = untrack(() => props.open !== void 0);
+	const controlledTriggerId = untrack(() => props.triggerId !== void 0);
+	const store = new TooltipStore({
+		controlledOpen: () => controlledOpen ? props.open : void 0,
+		controlledTriggerId: () => controlledTriggerId ? props.triggerId : void 0,
+		disabled: () => props.disabled ?? false,
+		disableHoverablePopup: () => props.disableHoverablePopup ?? false,
+		trackCursorAxis: () => props.trackCursorAxis ?? "none",
+		floatingId,
+		nested: parentNodeId !== null,
+		nodeId,
+		onOpenChange: () => props.onOpenChange,
+		onOpenChangeComplete: () => props.onOpenChangeComplete
+	});
+	store.update({
+		open: controlledOpen ? Boolean(untrack(() => props.open)) : Boolean(untrack(() => props.defaultOpen)),
+		activeTriggerId: untrack(() => props.defaultTriggerId ?? null)
+	});
+	const payload = store.access((state) => state.payload);
+	const node = createFloatingNode({
+		tree,
+		id: nodeId,
+		parentId: parentNodeId,
+		context: () => store.context.floatingRoot
+	});
+	const presence = createPopupPresence(store, () => store.track().popupElement);
+	const context = {
+		store,
+		tree,
+		presence
+	};
+	store.configureTriggerUnmount({ closeOnActiveTriggerUnmount: true });
+	attachPopupHandle(() => props.handle, store);
+	const dismiss = createDismiss({
+		context: store.context.floatingRoot,
+		tree: () => tree,
+		enabled: () => !store.disabled(),
+		referencePress: () => store.closeOnClick()
+	});
+	const clientPoint = createClientPoint({
+		context: store.context.floatingRoot,
+		axis: () => store.trackCursorAxis(),
+		enabled: () => !store.disabled() && store.trackCursorAxis() !== "none"
+	});
+	function handleReferencePress(event) {
+		if (!store.closeOnClick()) return;
+		if (store.open()) dismiss.onReferencePress(event);
+		else store.cancelPendingOpen(event);
+	}
+	store.setInteractionProps({
+		activeTriggerProps: {
+			onClick: handleReferencePress,
+			onKeyDown: dismiss.onKeyDown,
+			onMouseMove: clientPoint.onMouseMove,
+			onPointerDown: handleReferencePress
+		},
+		inactiveTriggerProps: {
+			onClick: handleReferencePress,
+			onKeyDown: dismiss.onKeyDown,
+			onMouseMove: clientPoint.onMouseMove,
+			onPointerDown: handleReferencePress
+		},
+		popupProps: { onKeyDown: dismiss.onKeyDown }
+	});
+	createEffect(() => ({
+		open: store.open(),
+		activeTriggerId: store.activeTriggerId()
+	}), () => untrack(() => store.reconcileTriggers()));
+	createEffect(() => ({
+		disabled: store.disabled(),
+		rawOpen: store.rawOpen()
+	}), (state) => {
+		if (state.disabled && state.rawOpen) store.setOpen(false, createChangeEventDetails(disabled));
+	});
+	if (provider) {
+		let groupActive = true;
+		const closeForDelayGroup = () => {
+			if (!store.open()) return;
+			queueMicrotask(() => {
+				if (groupActive && provider.group.currentId() !== delayGroupId && store.open()) store.setOpen(false, createChangeEventDetails(none));
+			});
+		};
+		const unsubscribe = provider.group.subscribe(delayGroupId, closeForDelayGroup, (instant) => store.setInstantPhase(instant));
+		store.configureDelayGroup(provider.group, delayGroupId, closeForDelayGroup);
+		store.syncDelayGroup(untrack(() => store.open()));
+		onCleanup(() => {
+			groupActive = false;
+			unsubscribe();
+		});
+		if (controlledOpen) createEffect(() => store.open(), (open) => queueMicrotask(() => store.syncDelayGroup(open)));
+	}
+	let previousInstantType = null;
+	createEffect(() => ({
+		transitionStatus: store.track().transitionStatus,
+		instantPhase: store.isInstantPhase(),
+		reason: store.lastOpenChangeReason(),
+		instantType: store.track().instantType
+	}), (state) => {
+		if (state.transitionStatus === "ending" && state.reason === "none" || state.transitionStatus !== "ending" && state.instantPhase) {
+			if (state.instantType !== "delay") {
+				previousInstantType = state.instantType;
+				store.set("instantType", "delay");
+			}
+		} else if (previousInstantType !== null) {
+			store.set("instantType", previousInstantType);
+			previousInstantType = null;
+		}
+	});
+	createEffect(() => ({
+		open: store.open(),
+		activeTriggerId: store.activeTriggerId()
+	}), (state) => {
+		if (state.open && state.activeTriggerId == null) store.set("payload", void 0);
+	});
+	const actions = {
+		unmount: presence.forceUnmount,
+		close() {
+			store.setOpen(false, createChangeEventDetails(imperativeAction));
+		}
+	};
+	createEffect(() => props.actionsRef, (ref) => ref?.(actions));
+	function TooltipRootContent() {
+		const child = createMemo(() => props.children);
+		const initialChild = untrack(child);
+		let content = initialChild;
+		if (typeof initialChild === "function") content = initialChild.name === "bound read" && Object.prototype.hasOwnProperty.call(initialChild, $REFRESH) ? memo(() => {
+			return escape(child());
+		}) : untrack(() => initialChild({ payload }));
+		return content;
+	}
+	onCleanup(() => store.clearInteractionProps());
+	return TooltipRootContext({
+		value: context,
+		get children() {
+			return FloatingTreeContext({
+				value: tree,
+				get children() {
+					return FloatingParentNodeContext({
+						get value() {
+							return node.id ?? null;
+						},
+						get children() {
+							return TooltipRootContent({});
+						}
+					});
+				}
+			});
+		}
+	});
+}
+//#endregion
+//#region src/tooltip/trigger/TooltipTrigger.tsx
+var OPEN_DELAY = 600;
+var TOOLTIP_TRIGGER_IDENTIFIER = "data-base-ui-tooltip-trigger";
+/** An element that opens the tooltip on hover or keyboard focus. */
+function TooltipTrigger(props) {
+	const root = useTooltipRootContext(true);
+	const provider = useTooltipProviderContext();
+	const internalProps = props;
+	if (!root && !untrack(() => internalProps.handle)) throw new Error("Base UI: <Tooltip.Trigger> must be either used within a <Tooltip.Root> component or provided with a handle.");
+	const allProps = props;
+	const generatedId = `base-ui-${createUniqueId()}`;
+	const id = createMemo(() => internalProps.id || generatedId);
+	const [element, setElement] = createSignal(null, { ownedWrite: true });
+	const handleStore = createPopupHandleStore(() => internalProps.handle);
+	const store = createMemo(() => handleStore() ?? root?.store ?? new DetachedTooltipStore());
+	const markerDisabled = createMemo(() => internalProps.disabled ?? store().disabled());
+	const interactionDisabled = createMemo(() => store().disabled() || (internalProps.disabled ?? false));
+	const open = createMemo(() => store().open() && store().activeTriggerId() === id());
+	const state = createMemo(() => ({ open: open() }));
+	const classValue = createMemo(() => resolveClass(props.class, state()));
+	const styleValue = createMemo(() => resolveStyle(props.style, state()));
+	const stateAttributes = createMemo(() => getStateAttributesProps(state(), triggerOpenStateMapping));
+	const others = omit(allProps, "as", "class", "closeDelay", "closeOnClick", "delay", "disabled", "handle", "id", "onBlur", "onClick", "onFocus", "onKeyDown", "onMouseLeave", "onMouseMove", "onMouseOver", "onPointerDown", "onPointerEnter", "payload", "ref", "style");
+	let focusHandlers;
+	let hoverControls;
+	let nestedTriggerHovered = false;
+	let pointerType = "";
+	let nestedOpenTimer;
+	const triggerData = createMemo(() => ({
+		payload: internalProps.payload,
+		closeOnClick: internalProps.closeOnClick ?? true,
+		closeDelay: internalProps.closeDelay ?? 0
+	}));
+	createTriggerRegistration(store, id, element, () => ({ payload: internalProps.payload }));
+	createEffect(() => {
+		const currentStore = store();
+		return {
+			store: currentStore,
+			id: id(),
+			data: triggerData(),
+			activeId: currentStore.activeTriggerId(),
+			open: currentStore.open()
+		};
+	}, (current) => {
+		current.store.setTriggerData(current.id, current.data);
+		current.store.syncTriggerData(current.activeId, current.open);
+		return () => current.store.removeTriggerData(current.id);
+	});
+	function getOpenDelay() {
+		if (!provider) return internalProps.delay ?? OPEN_DELAY;
+		if (provider.group.delay().open === 0) return 0;
+		return internalProps.delay ?? provider.delay() ?? OPEN_DELAY;
+	}
+	function getCloseDelay() {
+		if (internalProps.closeDelay !== void 0) return internalProps.closeDelay;
+		return provider?.group.delay().close ?? 0;
+	}
+	createEffect(() => ({
+		store: store(),
+		element: element()
+	}), (current) => {
+		if (!(current.store instanceof TooltipStore) || !current.element) {
+			focusHandlers = void 0;
+			hoverControls = void 0;
+			return;
+		}
+		const liveStore = current.store;
+		return createRoot((dispose) => {
+			hoverControls = createHoverInteraction({
+				context: liveStore.context.floatingRoot,
+				reference: element,
+				floating: () => liveStore.track().positionerElement,
+				tree: () => root?.tree,
+				enabled: () => !interactionDisabled(),
+				floatingEnabled: () => !interactionDisabled() && liveStore.activeTriggerId() === id(),
+				delay: () => ({
+					open: getOpenDelay(),
+					close: getCloseDelay()
+				}),
+				restMs: () => getOpenDelay(),
+				handleClose: () => liveStore.disableHoverablePopup() || liveStore.trackCursorAxis() === "both" ? void 0 : safePolygon(),
+				mouseOnly: () => true,
+				shouldOpen: () => !nestedTriggerHovered
+			});
+			focusHandlers = createFocusInteraction({
+				context: liveStore.context.floatingRoot,
+				enabled: () => !interactionDisabled()
+			});
+			return () => {
+				dispose();
+				focusHandlers = void 0;
+				hoverControls = void 0;
+			};
+		});
+	});
+	function isEnabledNestedTriggerTarget(target) {
+		const trigger = element();
+		const nearest = closestEnabledTooltipTrigger(target);
+		return Boolean(trigger && nearest && nearest !== trigger && contains(trigger, nearest));
+	}
+	function handleNestedTriggerHover(event) {
+		const wasNested = nestedTriggerHovered;
+		const target = getEventTarget(event);
+		nestedTriggerHovered = isElement(target) && isEnabledNestedTriggerTarget(target);
+		if (nestedTriggerHovered) {
+			hoverControls?.cancelPendingOpen();
+			clearTimeout(nestedOpenTimer);
+		}
+		const current = store();
+		if (nestedTriggerHovered && current.open() && current instanceof TooltipStore && current.lastOpenChangeReason() === "trigger-hover") {
+			current.setOpen(false, createChangeEventDetails(triggerHover, event));
+			return;
+		}
+		const trigger = element();
+		if (wasNested && !nestedTriggerHovered && trigger && isElement(target) && contains(trigger, target) && !interactionDisabled() && !current.open() && isMouseLikePointerType(pointerType)) {
+			const openParent = () => {
+				if (!nestedTriggerHovered && !interactionDisabled() && !current.open()) current.setOpen(true, createChangeEventDetails(triggerHover, event, trigger));
+			};
+			const delay = getOpenDelay();
+			clearTimeout(nestedOpenTimer);
+			if (delay === 0) openParent();
+			else nestedOpenTimer = setTimeout(openParent, delay);
+		}
+	}
+	function handleFocus(event) {
+		const target = getEventTarget(event);
+		if (!isElement(target) || !isEnabledNestedTriggerTarget(target)) focusHandlers?.onFocus(event);
+	}
+	function handleTriggerPress(event) {
+		const current = store();
+		if (!(internalProps.closeOnClick ?? true)) return;
+		if (current.open()) current.setOpen(false, createChangeEventDetails(triggerPress, event, element() ?? void 0));
+		else {
+			current.cancelPendingOpen(event);
+			hoverControls?.cancelPendingOpen();
+		}
+	}
+	function getRootHandler(name) {
+		const current = store();
+		if (!(current instanceof TooltipStore)) return;
+		const handler = (current.activeTriggerId() === id() ? current.state.activeTriggerProps : current.state.inactiveTriggerProps)[name];
+		return typeof handler === "function" ? handler : void 0;
+	}
+	function handlePointerDown(event) {
+		pointerType = event.pointerType;
+		handleTriggerPress(event);
+	}
+	function handlePointerEnter(event) {
+		pointerType = event.pointerType;
+	}
+	function getRootKeyDownHandler() {
+		return getRootHandler("onKeyDown");
+	}
+	function getRootMouseMoveHandler() {
+		return getRootHandler("onMouseMove");
+	}
+	const onBlur = composeEventHandlers(() => internalProps.onBlur, () => (event) => focusHandlers?.onBlur(event));
+	const onClick = composeEventHandlers(() => internalProps.onClick, () => handleTriggerPress);
+	const onFocus = composeEventHandlers(() => internalProps.onFocus, () => handleFocus);
+	const onKeyDown = composeEventHandlers(() => internalProps.onKeyDown, getRootKeyDownHandler);
+	const onMouseLeave = composeEventHandlers(() => internalProps.onMouseLeave, () => () => {
+		nestedTriggerHovered = false;
+		pointerType = "";
+		clearTimeout(nestedOpenTimer);
+		focusHandlers?.onPointerLeave();
+	});
+	const onMouseMove = composeEventHandlers(() => internalProps.onMouseMove, getRootMouseMoveHandler);
+	const onMouseOver = composeEventHandlers(() => internalProps.onMouseOver, () => handleNestedTriggerHover);
+	const onPointerDown = composeEventHandlers(() => internalProps.onPointerDown, () => handlePointerDown);
+	const onPointerEnter = composeEventHandlers(() => internalProps.onPointerEnter, () => handlePointerEnter);
+	onCleanup(() => clearTimeout(nestedOpenTimer));
+	return Dynamic(mergeProps({
+		get component() {
+			return props.as ?? "button";
+		},
+		ref: [((value) => setElement(value)), internalProps.ref],
+		get id() {
+			return id();
+		},
+		type: "button",
+		get ["data-trigger-disabled"]() {
+			return markerDisabled() ? "" : void 0;
+		},
+		get ["data-base-ui-tooltip-trigger"]() {
+			return markerDisabled() ? void 0 : "";
+		},
+		get ["class"]() {
+			return classValue();
+		},
+		get style() {
+			return styleValue();
+		},
+		onBlur,
+		onClick,
+		onFocus,
+		onKeyDown,
+		onMouseLeave,
+		onMouseMove,
+		onMouseOver,
+		onPointerDown,
+		onPointerEnter
+	}, stateAttributes, others));
+}
+function closestEnabledTooltipTrigger(element) {
+	let current = element;
+	while (current) {
+		const trigger = current.closest(`[${TOOLTIP_TRIGGER_IDENTIFIER}]`);
+		if (trigger) return trigger;
+		const root = current.getRootNode();
+		current = "host" in root && isElement(root.host) ? root.host : null;
+	}
+	return null;
+}
+function isMouseLikePointerType(pointerType) {
+	return pointerType === "" || pointerType === "mouse" || pointerType === "pen";
+}
+//#endregion
+//#region src/tooltip/portal/TooltipPortalContext.ts
+var MISSING_CONTEXT$1 = Symbol("TooltipPortalContext");
+var TooltipPortalContext = createContext(MISSING_CONTEXT$1);
+function useTooltipPortalContext() {
+	const context = useContext(TooltipPortalContext);
+	if (context === MISSING_CONTEXT$1) throw new Error("Base UI: <Tooltip.Portal> is missing.");
+	return context;
+}
+//#endregion
+//#region src/tooltip/portal/TooltipPortal.tsx
+/** Moves the tooltip layer into a portal appended to the document body by default. */
+function TooltipPortal(props) {
+	const context = useTooltipRootContext();
+	const internalProps = props;
+	const allProps = props;
+	const keepMounted = createMemo(() => internalProps.keepMounted ?? false);
+	const shouldRender = createMemo(() => context.presence.mounted() || keepMounted());
+	const state = {};
+	const classValue = createMemo(() => resolveClass(props.class, state));
+	const styleValue = createMemo(() => resolveStyle(props.style, state));
+	const others = omit(allProps, "as", "class", "container", "keepMounted", "ref", "style");
+	const portalContext = { keepMounted };
+	return Show({
+		get when() {
+			return shouldRender();
+		},
+		get children() {
+			return TooltipPortalContext({
+				value: portalContext,
+				get children() {
+					return PopupPortal(mergeProps({
+						get as() {
+							return props.as;
+						},
+						lite: true,
+						get container() {
+							return internalProps.container;
+						},
+						ref: (element) => {
+							if (internalProps.ref) setRef(internalProps.ref, element);
+						},
+						get ["class"]() {
+							return classValue();
+						},
+						get style() {
+							return styleValue();
+						}
+					}, others, { get children() {
+						return props.children;
+					} }));
+				}
+			});
+		}
+	});
+}
+//#endregion
+//#region src/tooltip/utils/mergeTooltipStyles.ts
+function mergeTooltipStyles(internal, external) {
+	if (typeof external === "string") {
+		const serialized = Object.entries(internal).filter((entry) => entry[1] != null).map(([property, value]) => `${property}:${String(value)}`).join(";");
+		return serialized ? `${serialized};${external}` : external;
+	}
+	return {
+		...internal,
+		...external || void 0
+	};
+}
+//#endregion
+//#region src/tooltip/utils/stateAttributesMapping.ts
+var OPEN = { "data-open": "" };
+var CLOSED = { "data-closed": "" };
+var ANCHOR_HIDDEN = { "data-anchor-hidden": "" };
+var UNCENTERED = { "data-uncentered": "" };
+var TRANSITIONING = { "data-transitioning": "" };
+var tooltipPositionerStateMapping = {
+	open: (value) => value ? OPEN : CLOSED,
+	side: (value) => ({ "data-side": value }),
+	align: (value) => ({ "data-align": value }),
+	anchorHidden: (value) => value ? ANCHOR_HIDDEN : null,
+	instant: (value) => value ? { "data-instant": value } : null
+};
+var tooltipPopupStateMapping = {
+	open: (value) => value ? OPEN : CLOSED,
+	side: (value) => ({ "data-side": value }),
+	align: (value) => ({ "data-align": value }),
+	instant: (value) => value ? { "data-instant": value } : null,
+	...transitionStatusMapping
+};
+var tooltipArrowStateMapping = {
+	open: (value) => value ? OPEN : CLOSED,
+	side: (value) => ({ "data-side": value }),
+	align: (value) => ({ "data-align": value }),
+	uncentered: (value) => value ? UNCENTERED : null,
+	instant: (value) => value ? { "data-instant": value } : null
+};
+var tooltipViewportStateMapping = {
+	activationDirection: (value) => value !== void 0 ? { "data-activation-direction": value } : null,
+	transitioning: (value) => value ? TRANSITIONING : null,
+	instant: (value) => value ? { "data-instant": value } : null
+};
+//#endregion
+//#region src/tooltip/positioner/TooltipPositionerContext.ts
+var MISSING_CONTEXT = Symbol("TooltipPositionerContext");
+var TooltipPositionerContext = createContext(MISSING_CONTEXT);
+function useTooltipPositionerContext() {
+	const context = useContext(TooltipPositionerContext);
+	if (context === MISSING_CONTEXT) throw new Error("Base UI: TooltipPositionerContext is missing. TooltipPositioner parts must be placed within <Tooltip.Positioner>.");
+	return context;
+}
+//#endregion
+//#region src/tooltip/positioner/TooltipPositioner.tsx
+/** Positions the tooltip against its active trigger. */
+function TooltipPositioner(props) {
+	useTooltipPortalContext();
+	const context = useTooltipRootContext();
+	const direction = useDirection();
+	const internalProps = props;
+	const allProps = props;
+	const [element, setElement] = createSignal(null, { ownedWrite: true });
+	const positioning = createAnchorPositioning({
+		reference: () => resolveAnchor(internalProps.anchor) ?? context.store.context.floatingRoot.referenceElement(),
+		floating: element,
+		mounted: context.presence.mounted,
+		direction,
+		positionMethod: () => internalProps.positionMethod ?? "absolute",
+		side: () => internalProps.side ?? "top",
+		sideOffset: () => internalProps.sideOffset ?? 0,
+		align: () => internalProps.align ?? "center",
+		alignOffset: () => internalProps.alignOffset ?? 0,
+		collisionBoundary: () => internalProps.collisionBoundary ?? "clipping-ancestors",
+		collisionPadding: () => internalProps.collisionPadding ?? 5,
+		arrowPadding: () => internalProps.arrowPadding ?? 5,
+		sticky: () => internalProps.sticky ?? false,
+		disableAnchorTracking: () => internalProps.disableAnchorTracking ?? false,
+		collisionAvoidance: () => internalProps.collisionAvoidance ?? { fallbackAxisSide: "end" },
+		adaptiveOriginMiddleware: () => context.store.track().adaptiveOriginMiddleware
+	});
+	const initialPositioning = createInitialPositioning(() => context.store.open(), () => positioning.state().isPositioned);
+	const state = createMemo(() => ({
+		open: context.store.open(),
+		side: positioning.renderedSide(),
+		align: positioning.renderedAlign(),
+		anchorHidden: positioning.anchorHidden(),
+		instant: context.store.trackCursorAxis() !== "none" ? "tracking-cursor" : context.store.track().instantType ?? (initialPositioning() ? "initial" : void 0)
+	}));
+	const classValue = createMemo(() => resolveClass(props.class, state()));
+	const styleValue = createMemo(() => mergeTooltipStyles({
+		...positioning.styles(),
+		"pointer-events": !context.store.open() || context.store.trackCursorAxis() === "both" || context.store.disableHoverablePopup() ? "none" : void 0
+	}, resolveStyle(props.style, state())));
+	const stateAttributes = createMemo(() => getStateAttributesProps(state(), tooltipPositionerStateMapping));
+	const others = omit(allProps, "align", "alignOffset", "anchor", "arrowPadding", "as", "class", "collisionAvoidance", "collisionBoundary", "collisionPadding", "disableAnchorTracking", "positionMethod", "ref", "side", "sideOffset", "sticky", "style");
+	const positionerContext = {
+		side: positioning.renderedSide,
+		align: positioning.renderedAlign,
+		arrowStyles: positioning.arrowStyles,
+		arrowUncentered: positioning.arrowUncentered,
+		setArrowElement: positioning.setArrowElement
+	};
+	createEffect(() => positioning.state().placement, (placement) => {
+		context.store.context.floatingRoot.context.data.placement = placement;
+	});
+	onCleanup(() => {
+		if (context.store.state.positionerElement === element()) context.store.setPositionerElement(null);
+		delete context.store.context.floatingRoot.context.data.placement;
+	});
+	return TooltipPositionerContext({
+		value: positionerContext,
+		get children() {
+			return Dynamic(mergeProps({
+				get component() {
+					return props.as ?? "div";
+				},
+				ref: [((value) => {
+					setElement(value);
+					context.store.setPositionerElement(value);
+				}), internalProps.ref],
+				role: "presentation",
+				get hidden() {
+					return !context.presence.mounted();
+				},
+				get ["class"]() {
+					return classValue();
+				},
+				get style() {
+					return styleValue();
+				}
+			}, stateAttributes, others));
+		}
+	});
+}
+function resolveAnchor(anchor) {
+	if (typeof anchor === "function") return anchor();
+	if (anchor && "current" in anchor) return anchor.current;
+	return anchor;
+}
+//#endregion
+//#region src/tooltip/popup/TooltipPopup.tsx
+/** A container for the tooltip contents. */
+function TooltipPopup(props) {
+	const context = useTooltipRootContext();
+	const positioner = useTooltipPositionerContext();
+	const internalProps = props;
+	const allProps = props;
+	const state = createMemo(() => ({
+		open: context.store.open(),
+		side: positioner.side(),
+		align: positioner.align(),
+		instant: context.store.track().instantType,
+		transitionStatus: context.store.track().transitionStatus
+	}));
+	const classValue = createMemo(() => resolveClass(props.class, state()));
+	const styleValue = createMemo(() => resolveStyle(props.style, state()));
+	const stateAttributes = createMemo(() => getStateAttributesProps(state(), tooltipPopupStateMapping));
+	const others = omit(allProps, "as", "class", "onKeyDown", "ref", "style");
+	const onKeyDown = composeEventHandlers(() => internalProps.onKeyDown, () => {
+		const handler = context.store.state.popupProps.onKeyDown;
+		return typeof handler === "function" ? handler : void 0;
+	});
+	let popupElement = null;
+	onCleanup(() => {
+		if (context.store.state.popupElement === popupElement) context.store.setPopupElement(null);
+	});
+	return Dynamic(mergeProps({
+		get component() {
+			return props.as ?? "div";
+		},
+		ref: [((element) => {
+			popupElement = element;
+			context.store.setPopupElement(element);
+		}), internalProps.ref],
+		tabIndex: -1,
+		"data-base-ui-focusable": "",
+		get hidden() {
+			return !context.presence.mounted();
+		},
+		get ["class"]() {
+			return classValue();
+		},
+		get style() {
+			return styleValue();
+		},
+		onKeyDown
+	}, stateAttributes, others));
+}
+//#endregion
+//#region src/tooltip/viewport/TooltipViewport.tsx
+/** Displays animated content transitions when one tooltip has multiple triggers. */
+function TooltipViewport(props) {
+	const context = useTooltipRootContext();
+	const positioner = useTooltipPositionerContext();
+	const internalProps = props;
+	const allProps = props;
+	const [activationDirection, setActivationDirection] = createSignal();
+	const [transitioning, setTransitioning] = createSignal(false);
+	const state = createMemo(() => ({
+		activationDirection: activationDirection(),
+		transitioning: transitioning(),
+		instant: context.store.track().instantType
+	}));
+	const classValue = createMemo(() => resolveClass(props.class, state()));
+	const styleValue = createMemo(() => resolveStyle(props.style, state()));
+	const stateAttributes = createMemo(() => getStateAttributesProps(state(), tooltipViewportStateMapping));
+	const others = omit(allProps, "as", "children", "class", "ref", "style");
+	return Dynamic(mergeProps({
+		get component() {
+			return props.as ?? "div";
+		},
+		ref: [internalProps.ref],
+		get ["class"]() {
+			return classValue();
+		},
+		get style() {
+			return styleValue();
+		}
+	}, stateAttributes, others, { get children() {
+		return PopupViewport({
+			get store() {
+				return context.store;
+			},
+			get side() {
+				return positioner.side();
+			},
+			onStateChange: (nextState) => {
+				setActivationDirection(nextState.activationDirection);
+				setTransitioning(nextState.transitioning);
+			},
+			get children() {
+				return props.children;
+			}
+		});
+	} }));
+}
+//#endregion
+//#region src/tooltip/arrow/TooltipArrow.tsx
+/** Displays an arrow positioned against the tooltip anchor. */
+function TooltipArrow(props) {
+	const context = useTooltipRootContext();
+	const positioner = useTooltipPositionerContext();
+	const internalProps = props;
+	const allProps = props;
+	const state = createMemo(() => ({
+		open: context.store.open(),
+		side: positioner.side(),
+		align: positioner.align(),
+		uncentered: positioner.arrowUncentered(),
+		instant: context.store.track().instantType
+	}));
+	const classValue = createMemo(() => resolveClass(props.class, state()));
+	const styleValue = createMemo(() => mergeTooltipStyles(positioner.arrowStyles(), resolveStyle(props.style, state())));
+	const stateAttributes = createMemo(() => getStateAttributesProps(state(), tooltipArrowStateMapping));
+	const others = omit(allProps, "as", "class", "ref", "style");
+	onCleanup(() => positioner.setArrowElement(null));
+	return Dynamic(mergeProps({
+		get component() {
+			return props.as ?? "div";
+		},
+		ref: [((element) => positioner.setArrowElement(element)), internalProps.ref],
+		"aria-hidden": "true",
+		get ["class"]() {
+			return classValue();
+		},
+		get style() {
+			return styleValue();
+		}
+	}, stateAttributes, others));
+}
+//#endregion
+//#region src/tooltip/store/TooltipHandle.ts
+/** Imperatively controls a Tooltip and connects detached triggers to its Root. */
+var TooltipHandle = class extends BasePopupHandle {
+	constructor() {
+		super("Tooltip", true, new DetachedTooltipStore());
+	}
+	open(triggerId) {
+		this.openByTrigger(triggerId);
+	}
+	close() {
+		this.closePopup();
+	}
+	get isOpen() {
+		return this.attachedStore?.open() ?? false;
+	}
+};
+function createTooltipHandle() {
+	return new TooltipHandle();
+}
+//#endregion
+//#region src/tooltip/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Arrow: () => TooltipArrow,
+	Handle: () => TooltipHandle,
+	Popup: () => TooltipPopup,
+	Portal: () => TooltipPortal,
+	Positioner: () => TooltipPositioner,
+	Provider: () => TooltipProvider,
+	Root: () => TooltipRoot,
+	Trigger: () => TooltipTrigger,
+	Viewport: () => TooltipViewport,
+	createHandle: () => createTooltipHandle
+});
+//#endregion
+export { index_parts_exports as Tooltip };