solid-baseui 0.1.0-alpha.1 → 0.1.0-alpha.2

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

@@ -1,7 +1,7 @@
 import { t as __exportAll } from "../rolldown-runtime-D7D4PA-g.js";
 import { t as useRender } from "../useRender-CryVdCjs.js";
 import { n as resolveClass, t as resolveStyle } from "../resolveStyle-XCSFDHAL.js";
-import { composeEventHandlers } from "../internals/composeEventHandlers.js";
+import { composeEventHandlers, liveEventHandler } from "../internals/composeEventHandlers.js";
 import { t as runOnceAnimationsFinish } from "../runOnceAnimationsFinish-CYq38H8J.js";
 import { t as createTransitionStatus } from "../createTransitionStatus-184v7j3-.js";
 import { isServer, mergeProps, ssrElement } from "@solidjs/web";
@@ -110,10 +110,10 @@ function AvatarImage(props) {
 	}));
 	const classValue = createMemo(() => props.keepMounted || transition.mounted() ? resolveClass(props.class, state()) : void 0);
 	const styleValue = createMemo(() => props.keepMounted || transition.mounted() ? resolveStyle(props.style, state()) : void 0);
-	const onLoad = composeEventHandlers(() => props.onLoad, () => () => {
+	const onLoad = composeEventHandlers(liveEventHandler(() => props.onLoad), () => {
 		if (props.keepMounted) setImageLoadingStatus("loaded");
 	});
-	const onError = composeEventHandlers(() => props.onError, () => () => {
+	const onError = composeEventHandlers(liveEventHandler(() => props.onError), () => {
 		if (props.keepMounted) setImageLoadingStatus("error");
 	});
 	createEffect(() => ({

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

@@ -1,6 +1,6 @@
 import { t as useRender } from "../useRender-CryVdCjs.js";
 import { n as resolveClass, t as resolveStyle } from "../resolveStyle-XCSFDHAL.js";
-import { composeEventHandlers } from "../internals/composeEventHandlers.js";
+import { composeEventHandlers, liveEventHandler } from "../internals/composeEventHandlers.js";
 import { mergeProps, ssrElement } from "@solidjs/web";
 import { createMemo, omit, onSettled, untrack } from "solid-js";
 //#region src/button/Button.tsx
@@ -23,11 +23,11 @@ function Button(props) {
 		return disabled() ? "true" : void 0;
 	});
 	const tabIndex = createMemo(() => !nativeButton() && disabled() && !focusableWhenDisabled() ? -1 : 0);
-	const onClick = composeEventHandlers(() => untrack(() => props.disabled ?? false ? preventInteraction : void 0), () => eventProps.onClick);
-	const onMouseDown = composeEventHandlers(() => untrack(() => props.disabled ?? false ? stopInteraction : void 0), () => eventProps.onMouseDown);
-	const onPointerDown = composeEventHandlers(() => untrack(() => props.disabled ?? false ? preventInteraction : void 0), () => eventProps.onPointerDown);
-	const onKeyDown = composeEventHandlers(() => untrack(() => props.disabled ?? false ? props.focusableWhenDisabled ?? false ? preventFocusableDisabledKeyDown : stopInteraction : void 0), () => eventProps.onKeyDown, () => untrack(() => props.nativeButton ?? true ? void 0 : handleNonNativeKeyDown));
-	const onKeyUp = composeEventHandlers(() => untrack(() => props.disabled ?? false ? stopInteraction : void 0), () => eventProps.onKeyUp, () => untrack(() => props.nativeButton ?? true ? void 0 : handleNonNativeKeyUp));
+	const onClick = composeEventHandlers(liveEventHandler(() => untrack(() => props.disabled ?? false ? preventInteraction : void 0)), liveEventHandler(() => eventProps.onClick));
+	const onMouseDown = composeEventHandlers(liveEventHandler(() => untrack(() => props.disabled ?? false ? stopInteraction : void 0)), liveEventHandler(() => eventProps.onMouseDown));
+	const onPointerDown = composeEventHandlers(liveEventHandler(() => untrack(() => props.disabled ?? false ? preventInteraction : void 0)), liveEventHandler(() => eventProps.onPointerDown));
+	const onKeyDown = composeEventHandlers(liveEventHandler(() => untrack(() => props.disabled ?? false ? props.focusableWhenDisabled ?? false ? preventFocusableDisabledKeyDown : stopInteraction : void 0)), liveEventHandler(() => eventProps.onKeyDown), liveEventHandler(() => untrack(() => props.nativeButton ?? true ? void 0 : handleNonNativeKeyDown)));
+	const onKeyUp = composeEventHandlers(liveEventHandler(() => untrack(() => props.disabled ?? false ? stopInteraction : void 0)), liveEventHandler(() => eventProps.onKeyUp), liveEventHandler(() => untrack(() => props.nativeButton ?? true ? void 0 : handleNonNativeKeyUp)));
 	onSettled(() => {});
 	return useRender(props, () => state(), (props) => ssrElement("button", props, void 0, true))(mergeProps({
 		ref: [((value) => value), eventProps.ref],

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

@@ -3,11 +3,11 @@ import { t as useRender } from "../useRender-CryVdCjs.js";
 import { getStateAttributesProps } from "../internals/getStateAttributesProps.js";
 import { n as resolveClass, t as resolveStyle } from "../resolveStyle-XCSFDHAL.js";
 import { transitionStatusMapping } from "../internals/stateAttributesMapping.js";
-import { composeEventHandlers } from "../internals/composeEventHandlers.js";
+import { composeEventHandlers, liveEventHandler } from "../internals/composeEventHandlers.js";
 import { t as runOnceAnimationsFinish } from "../runOnceAnimationsFinish-CYq38H8J.js";
 import { t as createTransitionStatus } from "../createTransitionStatus-184v7j3-.js";
 import { fieldStateAttributesMapping } from "../internals/field-constants.js";
-import { n as useFieldRootContext } from "../FieldRootContext-IC-LWzVp.js";
+import { r as useFieldRootContext } from "../FieldRootContext-Bfpna6gA.js";
 import { n as useFormContext } from "../FormContext-CYwo_ZnB.js";
 import { r as useLabelableContext } from "../LabelableContext-BTeF0IWb.js";
 import { t as createLabelableId } from "../createLabelableId-WMUKtY6s.js";
@@ -136,11 +136,11 @@ function CheckboxRoot(props) {
 		value: checked,
 		getControl: () => rootElement() ?? null
 	};
-	const callExternalBlur = composeEventHandlers(() => internalProps.onBlur);
-	const callExternalClick = composeEventHandlers(() => internalProps.onClick);
-	const callExternalFocus = composeEventHandlers(() => internalProps.onFocus);
-	const callExternalKeyDown = composeEventHandlers(() => internalProps.onKeyDown);
-	const callExternalKeyUp = composeEventHandlers(() => internalProps.onKeyUp);
+	const callExternalBlur = composeEventHandlers(liveEventHandler(() => internalProps.onBlur));
+	const callExternalClick = composeEventHandlers(liveEventHandler(() => internalProps.onClick));
+	const callExternalFocus = composeEventHandlers(liveEventHandler(() => internalProps.onFocus));
+	const callExternalKeyDown = composeEventHandlers(liveEventHandler(() => internalProps.onKeyDown));
+	const callExternalKeyUp = composeEventHandlers(liveEventHandler(() => internalProps.onKeyUp));
 	function handleClick(event) {
 		if (suppressEnterClick) {
 			event.preventDefault();

package/dist/lib/server/checkbox-group/index.js

@@ -2,7 +2,7 @@ import { t as useRender } from "../useRender-CryVdCjs.js";
 import { getStateAttributesProps } from "../internals/getStateAttributesProps.js";
 import { n as resolveClass, t as resolveStyle } from "../resolveStyle-XCSFDHAL.js";
 import { fieldStateAttributesMapping } from "../internals/field-constants.js";
-import { n as useFieldRootContext } from "../FieldRootContext-IC-LWzVp.js";
+import { r as useFieldRootContext } from "../FieldRootContext-Bfpna6gA.js";
 import { n as useFormContext } from "../FormContext-CYwo_ZnB.js";
 import { r as useLabelableContext } from "../LabelableContext-BTeF0IWb.js";
 import { t as createLabelableId } from "../createLabelableId-WMUKtY6s.js";

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

@@ -6,7 +6,7 @@ import { n as resolveClass, t as resolveStyle } from "../resolveStyle-XCSFDHAL.j
 import { n as createCollapsibleTransitionStatus, t as createCollapsiblePanel } from "../createCollapsiblePanel-B45kTe6v.js";
 import { createChangeEventDetails } from "../internals/createBaseUIEventDetails.js";
 import { transitionStatusMapping } from "../internals/stateAttributesMapping.js";
-import { composeEventHandlers } from "../internals/composeEventHandlers.js";
+import { composeEventHandlers, liveEventHandler } from "../internals/composeEventHandlers.js";
 import { memo, mergeProps, ssrElement } from "@solidjs/web";
 import { Show, createContext, createEffect, createMemo, createSignal, createUniqueId, flush, omit, onCleanup, untrack, useContext } from "solid-js";
 //#region src/collapsible/root/CollapsibleRootContext.ts
@@ -109,13 +109,13 @@ function CollapsibleTrigger(props) {
 	const classValue = createMemo(() => resolveClass(props.class, state()));
 	const styleValue = createMemo(() => resolveStyle(props.style, state()));
 	const stateAttributes = createMemo(() => getStateAttributesProps(state(), collapsibleTriggerStateAttributesMapping));
-	const onClick = composeEventHandlers(() => untrack(() => disabled() ? preventInteraction : void 0), () => internalProps.onClick, () => (event) => {
+	const onClick = composeEventHandlers(liveEventHandler(() => untrack(() => disabled() ? preventInteraction : void 0)), liveEventHandler(() => internalProps.onClick), (event) => {
 		context.requestOpenChange(!context.open(), event, triggerPress);
 	});
-	const onMouseDown = composeEventHandlers(() => untrack(() => disabled() ? stopInteraction : void 0), () => internalProps.onMouseDown);
-	const onPointerDown = composeEventHandlers(() => untrack(() => disabled() ? preventInteraction : void 0), () => internalProps.onPointerDown);
-	const onKeyDown = composeEventHandlers(() => untrack(() => disabled() ? preventDisabledKeyDown : void 0), () => internalProps.onKeyDown, () => untrack(() => nativeButton() ? void 0 : handleNonNativeKeyDown));
-	const onKeyUp = composeEventHandlers(() => untrack(() => disabled() ? stopInteraction : void 0), () => internalProps.onKeyUp, () => untrack(() => nativeButton() ? void 0 : handleNonNativeKeyUp));
+	const onMouseDown = composeEventHandlers(liveEventHandler(() => untrack(() => disabled() ? stopInteraction : void 0)), liveEventHandler(() => internalProps.onMouseDown));
+	const onPointerDown = composeEventHandlers(liveEventHandler(() => untrack(() => disabled() ? preventInteraction : void 0)), liveEventHandler(() => internalProps.onPointerDown));
+	const onKeyDown = composeEventHandlers(liveEventHandler(() => untrack(() => disabled() ? preventDisabledKeyDown : void 0)), liveEventHandler(() => internalProps.onKeyDown), liveEventHandler(() => untrack(() => nativeButton() ? void 0 : handleNonNativeKeyDown)));
+	const onKeyUp = composeEventHandlers(liveEventHandler(() => untrack(() => disabled() ? stopInteraction : void 0)), liveEventHandler(() => internalProps.onKeyUp), liveEventHandler(() => untrack(() => nativeButton() ? void 0 : handleNonNativeKeyUp)));
 	const ariaDisabled = createMemo(() => nativeButton() ? disabled() ? "true" : "false" : disabled() ? "true" : void 0);
 	const ariaExpanded = createMemo(() => context.open() ? "true" : "false");
 	return useRender(props, () => state(), (props) => ssrElement("button", props, void 0, true))(mergeProps({

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

@@ -5,22 +5,18 @@ import { E as pointer, S as listNavigation, b as keyboard, n as chipRemovePress,
 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 { composeEventHandlers, liveEventHandler } from "../internals/composeEventHandlers.js";
 import { t as runOnceAnimationsFinish } from "../runOnceAnimationsFinish-CYq38H8J.js";
-import { A as getFilter, C as getIndexAfterChipRemoval, D as ComboboxTrigger, E as useRequiredComboboxChipsContext, F as stringifyAsLabel, M as hasNullItemLabel, N as resolveMultipleLabels, O as AriaCombobox, P as resolveSelectedLabel, S as getChipNavigationKeys, T as ComboboxChipsContext, _ as ComboboxClear, a as ComboboxItem, b as handleInputPress, c as ComboboxGroup, d as ComboboxPositioner, f as ComboboxBackdrop, g as ComboboxCollection, h as ComboboxList, i as ComboboxRow, j as flattenItems, k as useComboboxRootContext, l as ComboboxArrow, m as ComboboxStatus, n as ComboboxSeparator, o as useComboboxItemContext, p as ComboboxPortal, r as ComboboxEmpty, s as ComboboxGroupLabel, t as useFilteredItems, u as ComboboxPopup, v as ComboboxIcon, w as ComboboxChipRegistry, x as ComboboxInput, y as ComboboxInputGroup } from "../useFilteredItems-DCxq20Is.js";
+import { A as getFilter, C as getIndexAfterChipRemoval, D as ComboboxTrigger, E as useRequiredComboboxChipsContext, F as stringifyAsLabel, M as hasNullItemLabel, N as resolveMultipleLabels, O as AriaCombobox, P as resolveSelectedLabel, S as getChipNavigationKeys, T as ComboboxChipsContext, _ as ComboboxClear, a as ComboboxItem, b as handleInputPress, c as ComboboxGroup, d as ComboboxPositioner, f as ComboboxBackdrop, g as ComboboxCollection, h as ComboboxList, i as ComboboxRow, j as flattenItems, k as useComboboxRootContext, l as ComboboxArrow, m as ComboboxStatus, n as ComboboxSeparator, o as useComboboxItemContext, p as ComboboxPortal, r as ComboboxEmpty, s as ComboboxGroupLabel, t as useFilteredItems, u as ComboboxPopup, v as ComboboxIcon, w as ComboboxChipRegistry, x as ComboboxInput, y as ComboboxInputGroup } from "../useFilteredItems-BmhL0nf1.js";
 import { t as createTransitionStatus } from "../createTransitionStatus-184v7j3-.js";
 import { a as stopButtonInteraction, n as handleNonNativeButtonKeyUp, r as preventButtonInteraction, t as handleNonNativeButtonKeyDown } from "../buttonSemantics-BSwDxJhh.js";
 import { n as useDirection } from "../DirectionContext-YORWLF08.js";
 import { fieldStateAttributesMapping } from "../internals/field-constants.js";
-import { a as defaultItemEquality, i as compareItemEquality, n as isSolidAccessor, o as findItemIndex } from "../mergeStyleValue-BwJ10_X2.js";
+import { a as findItemIndex, i as defaultItemEquality, r as compareItemEquality, t as isSolidAccessor } from "../isSolidAccessor-CZpzAH5l.js";
 import { r as useLabelableContext } from "../LabelableContext-BTeF0IWb.js";
 import { memo, mergeProps, ssrElement } from "@solidjs/web";
 import { Show, createContext, createEffect, createMemo, createSignal, flush, omit, onCleanup, untrack, useContext } from "solid-js";
 //#region src/combobox/root/ComboboxRoot.tsx
-/**
-* Groups all parts of the combobox.
-* Doesn't render its own HTML element.
-*/
 function ComboboxRoot(rawProps) {
 	const props = rawProps;
 	const others = omit(props, "multiple", "value", "defaultValue", "onValueChange", "autoComplete", "items");
@@ -79,8 +75,8 @@ function ComboboxLabel(props) {
 	function preventPointerFocus(event) {
 		event.preventDefault();
 	}
-	const onClick = composeEventHandlers(() => internalProps.onClick, () => focusControl);
-	const onPointerDown = composeEventHandlers(() => internalProps.onPointerDown, () => preventPointerFocus);
+	const onClick = composeEventHandlers(liveEventHandler(() => internalProps.onClick), focusControl);
+	const onPointerDown = composeEventHandlers(liveEventHandler(() => internalProps.onPointerDown), preventPointerFocus);
 	createEffect(id, (currentId) => {
 		context.store.setLabelId(currentId);
 		const unregister = labelable.registerLabelId(currentId);
@@ -187,7 +183,7 @@ function ComboboxChips(props) {
 	const classValue = createMemo(() => resolveClass(props.class, state));
 	const styleValue = createMemo(() => resolveStyle(props.style, state));
 	const others = omit(allProps, "render", "class", "onMouseDown", "ref", "style");
-	const onMouseDown = composeEventHandlers(() => internalProps.onMouseDown, () => (event) => handleInputPress(event, context, context.disabled(), context.readOnly()));
+	const onMouseDown = composeEventHandlers(liveEventHandler(() => internalProps.onMouseDown), (event) => handleInputPress(event, context, context.disabled()));
 	createEffect(() => context.store.open(), (open) => {
 		if (open) setHighlightedChipIndex(void 0);
 	});
@@ -249,7 +245,7 @@ function ComboboxChip(props) {
 	const classValue = createMemo(() => resolveClass(props.class, state()));
 	const styleValue = createMemo(() => resolveStyle(props.style, state()));
 	const stateAttributes = createMemo(() => getStateAttributesProps(state()));
-	const others = omit(allProps, "render", "class", "onKeyDown", "ref", "style");
+	const others = omit(allProps, "render", "class", "onContextMenu", "onKeyDown", "onMouseDown", "ref", "style");
 	function resolveNextIndex(event) {
 		const current = index();
 		const [previousChipKey, nextChipKey] = getChipNavigationKeys(direction());
@@ -297,7 +293,9 @@ function ComboboxChip(props) {
 		if (nextIndex === void 0) context.focusInput();
 		else chips.chips.elements()[nextIndex]?.focus();
 	}
-	const onKeyDown = composeEventHandlers(() => internalProps.onKeyDown, () => handleKeyDown);
+	const onKeyDown = composeEventHandlers(liveEventHandler(() => internalProps.onKeyDown), handleKeyDown);
+	const onMouseDown = composeEventHandlers(liveEventHandler(() => internalProps.onMouseDown));
+	const onContextMenu = composeEventHandlers(liveEventHandler(() => internalProps.onContextMenu));
 	const Render = useRender(props, () => state(), (props) => ssrElement("div", props, void 0, true));
 	return ComboboxChipContext({
 		value: { index },
@@ -320,7 +318,9 @@ function ComboboxChip(props) {
 				get style() {
 					return styleValue();
 				},
-				onKeyDown
+				onKeyDown,
+				onMouseDown,
+				onContextMenu
 			}, stateAttributes, others));
 		}
 	});
@@ -374,10 +374,10 @@ function ComboboxChipRemove(props) {
 		event.preventDefault();
 		if (!details.isPropagationAllowed) event.stopPropagation();
 	}
-	const onClick = composeEventHandlers(() => untrack(() => disabled() ? preventButtonInteraction : void 0), () => internalProps.onClick, () => handleClick);
-	const onKeyDown = composeEventHandlers(() => internalProps.onKeyDown, () => handleKeyDown, () => untrack(() => nativeButton() ? void 0 : handleNonNativeButtonKeyDown));
-	const onKeyUp = composeEventHandlers(() => untrack(() => disabled() ? stopButtonInteraction : void 0), () => internalProps.onKeyUp, () => untrack(() => nativeButton() ? void 0 : handleNonNativeButtonKeyUp));
-	const onMouseDown = composeEventHandlers(() => internalProps.onMouseDown, () => (event) => event.preventDefault());
+	const onClick = composeEventHandlers(liveEventHandler(() => untrack(() => disabled() ? preventButtonInteraction : void 0)), liveEventHandler(() => internalProps.onClick), handleClick);
+	const onKeyDown = composeEventHandlers(liveEventHandler(() => internalProps.onKeyDown), handleKeyDown, liveEventHandler(() => untrack(() => nativeButton() ? void 0 : handleNonNativeButtonKeyDown)));
+	const onKeyUp = composeEventHandlers(liveEventHandler(() => untrack(() => disabled() ? stopButtonInteraction : void 0)), liveEventHandler(() => internalProps.onKeyUp), liveEventHandler(() => untrack(() => nativeButton() ? void 0 : handleNonNativeButtonKeyUp)));
+	const onMouseDown = composeEventHandlers(liveEventHandler(() => internalProps.onMouseDown), (event) => event.preventDefault());
 	return useRender(props, () => state(), (props) => ssrElement("button", props, void 0, true))(mergeProps({
 		ref: [internalProps.ref],
 		get type() {
@@ -385,7 +385,7 @@ function ComboboxChipRemove(props) {
 		},
 		tabindex: -1,
 		get ["aria-disabled"]() {
-			return !nativeButton() && disabled() ? "true" : void 0;
+			return disabled() || context.readOnly() ? "true" : void 0;
 		},
 		get ["class"]() {
 			return classValue();

package/dist/lib/server/{compositeNavigation-BRVT1C38.js → compositeNavigation-D5jKM4yk.js}

@@ -1,4 +1,4 @@
-import { o as isElementVisible } from "./dom-Crg_2R-j.js";
+import { s as isElementVisible } from "./dom-D8_aB1yy.js";
 //#region src/internals/overlay/compositeNavigation.ts
 function isListIndexDisabled(list, index, disabledIndices) {
 	if (typeof disabledIndices === "function" ? disabledIndices(index) : disabledIndices?.includes(index) ?? false) return true;
@@ -39,6 +39,37 @@ function getNavigatedIndex(options) {
 	} else if (orientation !== "vertical" && (key === "ArrowRight" || key === "ArrowLeft")) direction = key === "ArrowRight" !== rtl ? 1 : -1;
 	if (!direction) return currentIndex;
 	if (currentIndex === -1) return direction === 1 ? min : max;
+	if (orientation === "both" && (key === "ArrowDown" || key === "ArrowUp")) {
+		const rows = [];
+		let previousRow = null;
+		let hasRows = false;
+		list.forEach((element, index) => {
+			if (!element) return;
+			const row = element.closest("[role=\"row\"]");
+			hasRows ||= row !== null;
+			if (row !== previousRow || rows.length === 0) rows.push([]);
+			rows[rows.length - 1].push(index);
+			previousRow = row;
+		});
+		const rowIndex = rows.findIndex((row) => row.includes(currentIndex));
+		if (hasRows && rowIndex !== -1) {
+			const column = rows[rowIndex].indexOf(currentIndex);
+			let nextRow = rowIndex;
+			for (let remaining = rows.length; remaining > 0; remaining--) {
+				nextRow += direction;
+				if (nextRow < 0 || nextRow >= rows.length) {
+					if (!loop || list.some((element) => !element)) return currentIndex;
+					nextRow = nextRow < 0 ? rows.length - 1 : 0;
+				}
+				const row = rows[nextRow];
+				for (let col = Math.min(column, row.length - 1); col >= 0; col--) {
+					const candidate = row[col];
+					if (!isListIndexDisabled(list, candidate, disabledIndices)) return candidate;
+				}
+			}
+			return currentIndex;
+		}
+	}
 	const next = findNonDisabledListIndex(list, {
 		startingIndex: currentIndex,
 		decrement: direction === -1,

package/dist/lib/server/{constants-D7ciIzsV.js → constants-ByqXubhO.js}

@@ -1,5 +1,5 @@
-import { c as isHTMLElement, m as ownerWindow, n as contains, p as ownerDocument, r as getEventTarget } from "./dom-Crg_2R-j.js";
-import { r as hasScrollableAncestor, t as findScrollableTouchTarget } from "./scrollable-CjsSxbGr.js";
+import { h as ownerWindow, i as getEventTarget, l as isHTMLElement, m as ownerDocument, n as contains } from "./dom-D8_aB1yy.js";
+import { r as hasScrollableAncestor, t as findScrollableTouchTarget } from "./scrollable-C9Pgq8T5.js";
 import { createSignal } from "solid-js";
 //#region src/internals/clamp.ts
 function clamp(value, min, max) {

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

@@ -4,10 +4,10 @@ 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-B2KsiiLb.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-rR8ZN7YR.js";
+import { composeEventHandlers, liveEventHandler } from "../internals/composeEventHandlers.js";
+import { i as getEventTarget, n as contains } from "../dom-D8_aB1yy.js";
+import { i as pressableTriggerOpenStateMapping } from "../popupStateMapping-VHqr6M4H.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-BMQKlOvU.js";
 import { t as Separator } from "../Separator-DTvtnxzP.js";
 import { mergeProps, ssrElement } from "@solidjs/web";
 import { createEffect, createMemo, createSignal, omit, onCleanup } from "solid-js";
@@ -176,11 +176,11 @@ function ContextMenuTrigger(props) {
 		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);
+	const onContextMenu = composeEventHandlers(liveEventHandler(() => internalProps.onContextMenu), handleContextMenu);
+	const onTouchStart = composeEventHandlers(liveEventHandler(() => internalProps.onTouchStart), handleTouchStart);
+	const onTouchMove = composeEventHandlers(liveEventHandler(() => internalProps.onTouchMove), handleTouchMove);
+	const onTouchEnd = composeEventHandlers(liveEventHandler(() => internalProps.onTouchEnd), cancelLongPress);
+	const onTouchCancel = composeEventHandlers(liveEventHandler(() => internalProps.onTouchCancel), cancelLongPress);
 	createEffect(() => ({
 		trigger: element(),
 		disabled: disabled(),

package/dist/lib/server/{createAnchorPositioning-B5Y0WEev.js → createAnchorPositioning-DrQYe7RS.js}

@@ -1,4 +1,4 @@
-import { m as ownerWindow, p as ownerDocument } from "./dom-Crg_2R-j.js";
+import { h as ownerWindow, m as ownerDocument } from "./dom-D8_aB1yy.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

package/dist/lib/server/{createAnchoredPopupScrollLock-DFuUrykR.js → createAnchoredPopupScrollLock-q6gnOSmv.js}

@@ -1,5 +1,5 @@
-import { p as ownerDocument } from "./dom-Crg_2R-j.js";
-import { n as createScrollLock } from "./InternalBackdrop-C_iDPVR-.js";
+import { m as ownerDocument } from "./dom-D8_aB1yy.js";
+import { n as createScrollLock } from "./InternalBackdrop-D_2zAWnl.js";
 //#region src/internals/overlay/createAnchoredPopupScrollLock.ts
 function shouldLockAnchoredPopup(options) {
 	if (!options.enabled) return false;

package/dist/lib/server/{createClickInteraction-BYsMgvup.js → createClickInteraction-D7oc1Vco.js}

@@ -1,6 +1,6 @@
 import "./internals/reasons.js";
 import { createChangeEventDetails } from "./internals/createBaseUIEventDetails.js";
-import { f as isTypeableElement } from "./dom-Crg_2R-j.js";
+import { p as isTypeableElement } from "./dom-D8_aB1yy.js";
 import { onCleanup } from "solid-js";
 //#region src/internals/overlay/createClickInteraction.ts
 function clickLike(event) {

package/dist/lib/server/{createFocusInteraction-DMyKsniI.js → createFocusInteraction-DFKr4G7a.js}

@@ -1,6 +1,6 @@
 import { j as triggerFocus } from "./internals/reasons.js";
 import { createChangeEventDetails } from "./internals/createBaseUIEventDetails.js";
-import { m as ownerWindow, n as contains, p as ownerDocument, t as activeElement } from "./dom-Crg_2R-j.js";
+import { h as ownerWindow, m as ownerDocument, n as contains, t as activeElement } from "./dom-D8_aB1yy.js";
 import { createEffect, onCleanup } from "solid-js";
 //#region src/internals/overlay/createFocusInteraction.ts
 function matchesFocusVisible(element) {

package/dist/lib/server/{createPopupAutoResize-ImBjwdj_.js → createPopupAutoResize-Cg0-lLf4.js}

@@ -1,5 +1,5 @@
 import { t as runOnceAnimationsFinish } from "./runOnceAnimationsFinish-CYq38H8J.js";
-import { c as isHTMLElement, m as ownerWindow } from "./dom-Crg_2R-j.js";
+import { h as ownerWindow, l as isHTMLElement } from "./dom-D8_aB1yy.js";
 import { createEffect, untrack } from "solid-js";
 //#region src/internals/overlay/createPopupAutoResize.ts
 function getCssDimensions(element) {

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

@@ -1,6 +1,6 @@
 import { t as __exportAll } from "../rolldown-runtime-D7D4PA-g.js";
-import { a as DialogTitle, c as DialogDescription, i as DialogTrigger, l as DialogClose, n as createDialogHandle, o as DialogPortal, p as DialogRoot, r as DialogViewport, t as DialogHandle } from "../DialogHandle-nJSSy_jM.js";
-import { n as DialogBackdrop, t as DialogPopup } from "../DialogPopup-Da1aIxVA.js";
+import { a as DialogTitle, c as DialogDescription, i as DialogTrigger, l as DialogClose, n as createDialogHandle, o as DialogPortal, p as DialogRoot, r as DialogViewport, t as DialogHandle } from "../DialogHandle-BGIISmG7.js";
+import { n as DialogBackdrop, t as DialogPopup } from "../DialogPopup-C2ZDGf42.js";
 //#region src/dialog/index.parts.ts
 var index_parts_exports = /* @__PURE__ */ __exportAll({
 	Backdrop: () => DialogBackdrop,

package/dist/lib/server/{dom-Crg_2R-j.js → dom-D8_aB1yy.js}

@@ -25,6 +25,19 @@ function contains(parent, child) {
 function getEventTarget(event) {
 	return event.composedPath?.()[0] ?? event.target;
 }
+/** Solid RC.6 Portal exposes a live logical parent through each inserted root's _$host. */
+function containsWithPortals(parent, child) {
+	if (!parent || !child?.nodeType) return false;
+	if (parent.contains(child)) return true;
+	let current = child;
+	const visited = /* @__PURE__ */ new Set();
+	while (current && !visited.has(current)) {
+		if (current === parent) return true;
+		visited.add(current);
+		current = current._$host || current.parentNode || (isShadowRoot(current) ? current.host : null);
+	}
+	return false;
+}
 function isEventTargetWithin(event, node) {
 	if (!node) return false;
 	const path = event.composedPath?.();
@@ -64,4 +77,4 @@ function isTypeableCombobox(element) {
 	return element?.getAttribute("role") === "combobox" && isTypeableElement(element);
 }
 //#endregion
-export { isElement as a, isHTMLElement as c, isTypeableCombobox as d, isTypeableElement as f, getFloatingFocusElement as i, isInteractiveElement as l, ownerWindow as m, contains as n, isElementVisible as o, ownerDocument as p, getEventTarget as r, isEventTargetWithin as s, activeElement as t, isShadowRoot as u };
+export { getFloatingFocusElement as a, isEventTargetWithin as c, isShadowRoot as d, isTypeableCombobox as f, ownerWindow as h, getEventTarget as i, isHTMLElement as l, ownerDocument as m, contains as n, isElement as o, isTypeableElement as p, containsWithPortals as r, isElementVisible as s, activeElement as t, isInteractiveElement as u };

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

@@ -5,15 +5,15 @@ import { a as closeWatcher, k as swipe } from "../internals/reasons.js";
 import { n as resolveClass, t as resolveStyle } from "../resolveStyle-XCSFDHAL.js";
 import { createChangeEventDetails } from "../internals/createBaseUIEventDetails.js";
 import { TransitionStatusDataAttributes } from "../internals/stateAttributesMapping.js";
-import { composeEventHandlers } from "../internals/composeEventHandlers.js";
-import { a as isElement, c as isHTMLElement, l as isInteractiveElement, m as ownerWindow, n as contains, p as ownerDocument, r as getEventTarget, t as activeElement } from "../dom-Crg_2R-j.js";
-import { n as createTriggerRegistration } from "../PopupStore-kHjFPiQ5.js";
-import { r as popupTransitionStateMapping, t as CommonPopupDataAttributes } from "../popupStateMapping-B2KsiiLb.js";
-import { t as FocusManager } from "../FocusManager-1LfoCsya.js";
-import { a as DialogTitle, c as DialogDescription, d as dialogTransitionStateAttributesMapping, f as mergeDialogStyles, h as useDialogRootContext, i as DialogTrigger, l as DialogClose, m as renderDialogRoot, o as DialogPortal, r as DialogViewport, s as useDialogPortalContext, t as DialogHandle } from "../DialogHandle-nJSSy_jM.js";
-import { n as getComposedParentNode, t as findScrollableTouchTarget } from "../scrollable-CjsSxbGr.js";
+import { composeEventHandlers, liveEventHandler } from "../internals/composeEventHandlers.js";
+import { h as ownerWindow, i as getEventTarget, l as isHTMLElement, m as ownerDocument, n as contains, o as isElement, t as activeElement, u as isInteractiveElement } from "../dom-D8_aB1yy.js";
+import { n as createTriggerRegistration } from "../PopupStore-evylvVnN.js";
+import { r as popupTransitionStateMapping, t as CommonPopupDataAttributes } from "../popupStateMapping-VHqr6M4H.js";
+import { t as FocusManager } from "../FocusManager-D-xgblGs.js";
+import { a as DialogTitle, c as DialogDescription, d as dialogTransitionStateAttributesMapping, f as mergeDialogStyles, h as useDialogRootContext, i as DialogTrigger, l as DialogClose, m as renderDialogRoot, o as DialogPortal, r as DialogViewport, s as useDialogPortalContext, t as DialogHandle } from "../DialogHandle-BGIISmG7.js";
+import { n as getComposedParentNode, t as findScrollableTouchTarget } from "../scrollable-C9Pgq8T5.js";
 import { t as isAndroid } from "../platform-DYukKUir.js";
-import { a as getElementTransform, i as getDisplacement, o as getElementAtPoint, r as createSwipeDismiss, s as clamp, t as BASE_UI_SWIPE_IGNORE_SELECTOR } from "../constants-D7ciIzsV.js";
+import { a as getElementTransform, i as getDisplacement, o as getElementAtPoint, r as createSwipeDismiss, s as clamp, t as BASE_UI_SWIPE_IGNORE_SELECTOR } from "../constants-ByqXubhO.js";
 import { mergeProps, ssrElement } from "@solidjs/web";
 import { Show, createContext, createEffect, createMemo, createSignal, createUniqueId, flush, merge, omit, onCleanup, onSettled, untrack, useContext } from "solid-js";
 //#region src/drawer/popup/DrawerPopupCssVars.ts
@@ -502,10 +502,12 @@ function DrawerPopup(props) {
 		measuredPopupHeight = offsetHeight;
 		drawer.onPopupHeightChange(offsetHeight);
 	}
+	const lifecycleElement = createMemo(() => context.store.track().popupElement);
+	const lifecycleOpen = createMemo(() => context.store.open());
 	createEffect(() => ({
 		mounted: context.presence.mounted(),
 		nestedDrawerOpen: nestedDrawerOpen(),
-		element: context.store.track().popupElement
+		element: lifecycleElement()
 	}), (state) => {
 		if (!state.mounted) {
 			measuredPopupHeight = 0;
@@ -520,7 +522,7 @@ function DrawerPopup(props) {
 		resizeObserver.observe(state.element);
 		return () => resizeObserver.disconnect();
 	});
-	createEffect(() => context.store.track().popupElement, (element) => {
+	createEffect(lifecycleElement, (element) => {
 		function syncNestedSwipeProgress() {
 			if (!element) return;
 			const progress = drawer.nestedSwipeProgressStore.getSnapshot();
@@ -534,7 +536,7 @@ function DrawerPopup(props) {
 		};
 	});
 	createEffect(() => ({
-		open: context.store.open(),
+		open: lifecycleOpen(),
 		frontmostHeight: drawer.frontmostHeight()
 	}), (state) => {
 		if (!state.open) return;
@@ -542,7 +544,7 @@ function DrawerPopup(props) {
 		return () => drawer.notifyParentFrontmostHeight?.(0);
 	});
 	createEffect(() => ({
-		open: context.store.open(),
+		open: lifecycleOpen(),
 		transitionStatus: context.presence.transitionStatus()
 	}), (state) => {
 		if (!drawer.notifyParentHasNestedDrawer) return;
@@ -604,7 +606,7 @@ function DrawerPopup(props) {
 	});
 	const id = createMemo(() => internalProps.id ?? context.store.context.floatingId);
 	const initialFocus = createMemo(() => internalProps.initialFocus ?? (() => context.store.state.popupElement));
-	const onKeyDown = composeEventHandlers(() => internalProps.onKeyDown, () => (event) => {
+	const onKeyDown = composeEventHandlers(liveEventHandler(() => internalProps.onKeyDown), (event) => {
 		if (COMPOSITE_KEYS.has(event.key)) event.stopPropagation();
 	});
 	createEffect(() => id(), (currentId) => {
@@ -1140,27 +1142,27 @@ function DrawerSwipeArea(props) {
 		"touch-action": resolveTouchAction(resolvedSwipeDirection())
 	}, resolveStyle(props.style, state())));
 	const stateAttributes = createMemo(() => getStateAttributesProps(state(), stateAttributesMapping));
-	const onPointerDown = composeEventHandlers(() => internalProps.onPointerDown, () => (event) => {
+	const onPointerDown = composeEventHandlers(liveEventHandler(() => internalProps.onPointerDown), (event) => {
 		if (event.pointerType === "touch") return;
 		swipe$2.pointerHandlers.onPointerDown(event);
 		if (event.cancelable) event.preventDefault();
 	});
-	const onPointerMove = composeEventHandlers(() => internalProps.onPointerMove, () => (event) => {
+	const onPointerMove = composeEventHandlers(liveEventHandler(() => internalProps.onPointerMove), (event) => {
 		if (event.pointerType === "touch") return;
 		swipe$2.pointerHandlers.onPointerMove(event);
 	});
-	const onPointerUp = composeEventHandlers(() => internalProps.onPointerUp, () => (event) => {
+	const onPointerUp = composeEventHandlers(liveEventHandler(() => internalProps.onPointerUp), (event) => {
 		if (event.pointerType === "touch") return;
 		swipe$2.pointerHandlers.onPointerUp(event);
 	});
-	const onPointerCancel = composeEventHandlers(() => internalProps.onPointerCancel, () => (event) => {
+	const onPointerCancel = composeEventHandlers(liveEventHandler(() => internalProps.onPointerCancel), (event) => {
 		if (event.pointerType === "touch") return;
 		swipe$2.pointerHandlers.onPointerCancel(event);
 	});
-	const onTouchStart = composeEventHandlers(() => internalProps.onTouchStart, () => (event) => swipe$2.touchHandlers.onTouchStart(event));
-	const onTouchMove = composeEventHandlers(() => internalProps.onTouchMove, () => (event) => swipe$2.touchHandlers.onTouchMove(event));
-	const onTouchEnd = composeEventHandlers(() => internalProps.onTouchEnd, () => (event) => swipe$2.touchHandlers.onTouchEnd(event));
-	const onTouchCancel = composeEventHandlers(() => internalProps.onTouchCancel, () => (event) => swipe$2.touchHandlers.onTouchCancel(event));
+	const onTouchStart = composeEventHandlers(liveEventHandler(() => internalProps.onTouchStart), (event) => swipe$2.touchHandlers.onTouchStart(event));
+	const onTouchMove = composeEventHandlers(liveEventHandler(() => internalProps.onTouchMove), (event) => swipe$2.touchHandlers.onTouchMove(event));
+	const onTouchEnd = composeEventHandlers(liveEventHandler(() => internalProps.onTouchEnd), (event) => swipe$2.touchHandlers.onTouchEnd(event));
+	const onTouchCancel = composeEventHandlers(liveEventHandler(() => internalProps.onTouchCancel), (event) => swipe$2.touchHandlers.onTouchCancel(event));
 	return Render(mergeProps({
 		ref: [((element) => setSwipeAreaElement(element)), internalProps.ref],
 		get id() {
@@ -1517,11 +1519,13 @@ function DrawerViewport(props) {
 			setSwipeDismissed(true);
 		}
 	});
+	const lifecycleOpen = createMemo(open);
+	const touchRootElement = createMemo(() => context.viewportElement() ?? store.track().popupElement);
 	createEffect(() => ({
 		mounted: mounted(),
 		nestedDrawerOpen: nestedDrawerOpen(),
-		open: open(),
-		rootElement: context.viewportElement() ?? store.track().popupElement,
+		open: lifecycleOpen(),
+		rootElement: touchRootElement(),
 		axis: scrollAxis(),
 		direction: swipeDirection()
 	}), (state) => {
@@ -1587,13 +1591,13 @@ function DrawerViewport(props) {
 		if (!state.range || state.swiping) return;
 		untrack(() => applySwipeProgress(!state.open || state.nested ? 0 : state.progress ?? 0, true, false));
 	});
-	createEffect(() => open(), (isOpen) => {
+	createEffect(lifecycleOpen, (isOpen) => {
 		if (!drawer.notifyParentSwipeProgressChange) return;
 		if (!isOpen) drawer.notifyParentSwipeProgressChange(0);
 		return () => drawer.notifyParentSwipeProgressChange?.(0);
 	});
-	createEffect(() => open(), (isOpen) => {
-		if (!isOpen) return;
+	createEffect(() => open(), (isOpen, wasOpen) => {
+		if (!isOpen || isOpen === wasOpen) return;
 		untrack(() => {
 			if (!drawer.swipeAreaActive.current) swipe$1.reset();
 			clearSwipeRelease();
@@ -1627,7 +1631,7 @@ function DrawerViewport(props) {
 		lastPointerType = "";
 		return event.pointerType !== "touch";
 	}
-	const onPointerDown = composeEventHandlers(() => internalProps.onPointerDown, () => (event) => {
+	const onPointerDown = composeEventHandlers(liveEventHandler(() => internalProps.onPointerDown), (event) => {
 		lastPointerType = event.pointerType;
 		ignoreNextTouchStartFromPen = event.pointerType === "pen";
 		if (!open() || !mounted() || nestedDrawerOpen()) return;
@@ -1637,17 +1641,17 @@ function DrawerViewport(props) {
 		if (event.pointerType === "touch") return;
 		swipe$1.pointerHandlers.onPointerDown(event);
 	});
-	const onPointerMove = composeEventHandlers(() => internalProps.onPointerMove, () => (event) => {
+	const onPointerMove = composeEventHandlers(liveEventHandler(() => internalProps.onPointerMove), (event) => {
 		if (event.pointerType === "touch") return;
 		swipe$1.pointerHandlers.onPointerMove(event);
 	});
-	const onPointerUp = composeEventHandlers(() => internalProps.onPointerUp, () => (event) => {
+	const onPointerUp = composeEventHandlers(liveEventHandler(() => internalProps.onPointerUp), (event) => {
 		if (handlePointerEnd(event)) swipe$1.pointerHandlers.onPointerUp(event);
 	});
-	const onPointerCancel = composeEventHandlers(() => internalProps.onPointerCancel, () => (event) => {
+	const onPointerCancel = composeEventHandlers(liveEventHandler(() => internalProps.onPointerCancel), (event) => {
 		if (handlePointerEnd(event)) swipe$1.pointerHandlers.onPointerCancel(event);
 	});
-	const onTouchStart = composeEventHandlers(() => internalProps.onTouchStart, () => (event) => {
+	const onTouchStart = composeEventHandlers(liveEventHandler(() => internalProps.onTouchStart), (event) => {
 		if (lastPointerType === "pen" && ignoreNextTouchStartFromPen) {
 			ignoreNextTouchStartFromPen = false;
 			resetTouchSwipeState(false);
@@ -1695,12 +1699,12 @@ function DrawerViewport(props) {
 		};
 		swipe$1.touchHandlers.onTouchStart(event);
 	});
-	const onTouchEnd = composeEventHandlers(() => internalProps.onTouchEnd, () => (event) => {
+	const onTouchEnd = composeEventHandlers(liveEventHandler(() => internalProps.onTouchEnd), (event) => {
 		virtualKeyboard?.onTouchEnd(event);
 		resetTouchTrackingState();
 		swipe$1.touchHandlers.onTouchEnd(event);
 	});
-	const onTouchCancel = composeEventHandlers(() => internalProps.onTouchCancel, () => (event) => {
+	const onTouchCancel = composeEventHandlers(liveEventHandler(() => internalProps.onTouchCancel), (event) => {
 		virtualKeyboard?.onTouchCancel();
 		resetTouchTrackingState();
 		swipe$1.touchHandlers.onTouchCancel(event);
@@ -1988,7 +1992,7 @@ function DrawerVirtualKeyboardProvider(props) {
 			restorePreemptedFocus = overrideGeometryDuringFocus(target, (keyboardViewport.top + keyboardViewport.bottom - rect.top - rect.bottom) / 2);
 		}
 		function alignFocusedKeyboardTarget() {
-			keyboardFocusFrame = void 0;
+			cancelKeyboardFocusFrame();
 			consumePreemptedFocus();
 			const target = focusedKeyboardTarget;
 			if (nestedDrawerOpen || !target || !contains(rootElement, target)) {