@solid2-aria/components 0.0.0-stage → 0.0.1

package/dist/server/popover.js

@@ -0,0 +1,455 @@
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-aria-components/src/Popover.tsx.
+ * Modified for Solid Aria: adapted components, contexts, refs, dialog semantics, animation state, and reactive properties for Solid 2; uses Solid class props.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { createContextProps, createRenderProps, dom } from "./utils.js";
+import { OverlayTriggerStateContext } from "./overlay-contexts.js";
+import { OverlayArrowContext } from "./overlay-arrow.js";
+import { mergeProps } from "@solid2-aria/core/utils/merge-props";
+import { Show, createContext, createEffect, createSignal, merge, onSettled, untrack, useContext } from "solid-js";
+import { memo, mergeProps as mergeProps$1 } from "@solidjs/web";
+import { requireValue } from "@solid2-aria/core/utils/require-value";
+import { filterDOMProps } from "@solid2-aria/core/utils/filter-dom-props";
+import { createIsHidden } from "@solid2-aria/core/collections/hidden";
+import { getInteractionModality } from "@solid2-aria/core/interactions/create-focus-visible";
+import { focusSafely } from "@solid2-aria/core/interactions/focus-safely";
+import { createPopover } from "@solid2-aria/core/overlays/create-popover";
+import { DismissButton } from "@solid2-aria/core/overlays/dismiss-button";
+import { Overlay } from "@solid2-aria/core/overlays/overlay";
+import { createEnterAnimation, createExitAnimation } from "@solid2-aria/core/utils/animation";
+import { isFocusWithin } from "@solid2-aria/core/utils/shadowdom/dom-functions";
+import { createOverlayTriggerState } from "@solid2-aria/stately/overlays/create-overlay-trigger-state";
+// src/popover.tsx
+var _m$ = Symbol();
+var _m$2 = Symbol();
+var _m$3 = Symbol();
+var _m$4 = Symbol();
+var _m$5 = Symbol();
+var _m$6 = Symbol();
+var _m$7 = Symbol();
+var _d$ = {
+	get() {
+		return this[_m$].UNSTABLE_portalContainer;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$2 = {
+	get() {
+		const exiting = this[_m$2];
+		return exiting();
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$3 = {
+	get() {
+		return !(this[_m$].isNonModal === true);
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$4 = {
+	get() {
+		const props = this[_m$];
+		const ref = this[_m$3];
+		const setRef = this[_m$4];
+		const state = this[_m$5];
+		const exiting = this[_m$2];
+		return PopoverInner({
+			props,
+			popoverRef: ref,
+			setPopoverRef: (element) => {
+				setRef(element);
+			},
+			state,
+			exiting
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$(_p, _p2, _p3, _p4, _p5) {
+	this[_m$] = _p;
+	this[_m$2] = _p2;
+	this[_m$3] = _p3;
+	this[_m$4] = _p4;
+	this[_m$5] = _p5;
+	Object.defineProperty(this, "portalContainer", _d$);
+	Object.defineProperty(this, "isExiting", _d$2);
+	Object.defineProperty(this, "shouldContainFocus", _d$3);
+	Object.defineProperty(this, "children", _d$4);
+}
+_P$.prototype = Object.prototype;
+var _d$5 = {
+	get() {
+		const state = this[_m$];
+		const exiting = this[_m$2];
+		return state.isOpen || exiting();
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$6 = {
+	get() {
+		const props = this[_m$3];
+		const exiting = this[_m$2];
+		const ref = this[_m$4];
+		const setRef = this[_m$5];
+		const state = this[_m$];
+		return Overlay(new _P$(props, exiting, ref, setRef, state));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$2(_p6, _p7, _p8, _p9, _p0) {
+	this[_m$] = _p6;
+	this[_m$2] = _p7;
+	this[_m$3] = _p8;
+	this[_m$4] = _p9;
+	this[_m$5] = _p0;
+	Object.defineProperty(this, "when", _d$5);
+	Object.defineProperty(this, "children", _d$6);
+}
+_P$2.prototype = Object.prototype;
+var _d$7 = {
+	get() {
+		return this[_m$].state.close;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$3(_p1) {
+	this[_m$] = _p1;
+	Object.defineProperty(this, "onDismiss", _d$7);
+}
+_P$3.prototype = Object.prototype;
+var _d$8 = {
+	get() {
+		const args = this[_m$];
+		return [PopoverContext, ...args.props.clearContexts ?? []];
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$9 = {
+	get() {
+		return this[_m$2].children;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$4(_p10, _p11) {
+	this[_m$] = _p10;
+	this[_m$2] = _p11;
+	Object.defineProperty(this, "contexts", _d$8);
+	Object.defineProperty(this, "children", _d$9);
+}
+_P$4.prototype = Object.prototype;
+var _d$10 = {
+	get() {
+		return this[_m$].state.close;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$5(_p12) {
+	this[_m$] = _p12;
+	Object.defineProperty(this, "onDismiss", _d$10);
+}
+_P$5.prototype = Object.prototype;
+var _d$11 = {
+	get() {
+		const aria = this[_m$];
+		const setArrowRef = this[_m$2];
+		return mergeProps(merge(() => aria.arrowProps ?? {}), {
+			get placement() {
+				return aria.placement;
+			},
+			ref: (element) => {
+				setArrowRef(element);
+			}
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$12 = {
+	get() {
+		const args = this[_m$3];
+		const render = this[_m$4];
+		return [
+			memo(() => {
+				return memo(() => {
+					return !(args.props.isNonModal === true);
+				})() && DismissButton(new _P$3(args));
+			}),
+			ClearContexts(new _P$4(args, render)),
+			DismissButton(new _P$5(args))
+		];
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$6(_p13, _p14, _p15, _p16) {
+	this[_m$] = _p13;
+	this[_m$2] = _p14;
+	this[_m$3] = _p15;
+	this[_m$4] = _p16;
+	Object.defineProperty(this, "value", _d$11);
+	Object.defineProperty(this, "children", _d$12);
+}
+_P$6.prototype = Object.prototype;
+var _d$13 = {
+	get() {
+		const isDialog = this[_m$];
+		const args = this[_m$2];
+		return memo(() => {
+			return !!isDialog();
+		})() ? args.props.id : void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$14 = {
+	get() {
+		const isDialog = this[_m$];
+		return isDialog() ? "dialog" : void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$15 = {
+	get() {
+		const isDialog = this[_m$];
+		return isDialog() ? -1 : void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$16 = {
+	get() {
+		return this[_m$2].props["aria-label"];
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$17 = {
+	get() {
+		return this[_m$2].props["aria-labelledby"];
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$18 = {
+	get() {
+		const args = this[_m$2];
+		return memo(() => {
+			return !!(args.props.slot === false || args.props.slot === "");
+		})() ? void 0 : args.props.slot ?? void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$19 = {
+	get() {
+		const aria = this[_m$3];
+		const triggerWidth = this[_m$4];
+		const render = this[_m$5];
+		return {
+			...typeof aria.popoverProps.style === "object" ? aria.popoverProps.style : void 0,
+			"--trigger-anchor-point": aria.triggerAnchorPoint ? `${aria.triggerAnchorPoint.x}px ${aria.triggerAnchorPoint.y}px` : void 0,
+			"--trigger-width": triggerWidth(),
+			...typeof render.style === "object" ? render.style : void 0
+		};
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$20 = {
+	get() {
+		return this[_m$6].trigger;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$21 = {
+	get() {
+		return this[_m$6].placement;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$22 = {
+	get() {
+		return this[_m$6].isEntering || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$23 = {
+	get() {
+		return this[_m$6].isExiting || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$24 = {
+	get() {
+		const aria = this[_m$3];
+		const setArrowRef = this[_m$7];
+		const args = this[_m$2];
+		const render = this[_m$5];
+		return OverlayArrowContext(new _P$6(aria, setArrowRef, args, render));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$7(_p17, _p18, _p19, _p20, _p21, _p22, _p23, _p24) {
+	this[_m$] = _p17;
+	this[_m$2] = _p18;
+	this[_m$3] = _p19;
+	this[_m$4] = _p20;
+	this[_m$5] = _p21;
+	this[_m$6] = _p22;
+	this[_m$7] = _p23;
+	this.ref = _p24;
+	Object.defineProperty(this, "id", _d$13);
+	Object.defineProperty(this, "role", _d$14);
+	Object.defineProperty(this, "tabindex", _d$15);
+	Object.defineProperty(this, "aria-label", _d$16);
+	Object.defineProperty(this, "aria-labelledby", _d$17);
+	Object.defineProperty(this, "slot", _d$18);
+	Object.defineProperty(this, "style", _d$19);
+	Object.defineProperty(this, "data-trigger", _d$20);
+	Object.defineProperty(this, "data-placement", _d$21);
+	Object.defineProperty(this, "data-entering", _d$22);
+	Object.defineProperty(this, "data-exiting", _d$23);
+	Object.defineProperty(this, "children", _d$24);
+}
+_P$7.prototype = Object.prototype;
+const fallbackTrigger = () => null;
+const PopoverContext = createContext(null);
+function Popover(input) {
+	if (createIsHidden()) return memo(() => {
+		return input.children;
+	});
+	const [props, ref, setRef] = createContextProps(input, untrack(() => input.ref), PopoverContext);
+	const context = useContext(OverlayTriggerStateContext);
+	const local = createOverlayTriggerState(props);
+	const state = untrack(() => props.isOpen !== void 0 || props.defaultOpen !== void 0 || !context) ? local : requireValue(context, "Expected context");
+	const exitAnimation = createExitAnimation(ref, () => state.isOpen, (element) => untrack(() => props.onExit)?.(element));
+	const exiting = () => props.isExiting === true || props.shouldSkipAnimation !== true && exitAnimation();
+	return Show(new _P$2(state, exiting, props, ref, setRef));
+}
+function PopoverInner(args) {
+	onSettled(() => () => {
+		args.setPopoverRef(null);
+	});
+	const [arrowRef, setArrowRef] = createSignal(null, { ownedWrite: true });
+	const aria = createPopover(mergeProps(merge(() => args.props ?? {}), {
+		arrowRef,
+		get offset() {
+			return args.props.offset ?? 8;
+		},
+		get placement() {
+			return args.props.placement ?? "bottom";
+		},
+		get popoverRef() {
+			return args.popoverRef;
+		},
+		get triggerRef() {
+			return args.props.triggerRef ?? fallbackTrigger;
+		}
+	}), untrack(() => args.state));
+	const entering = createEnterAnimation(untrack(() => args.popoverRef), () => aria.placement !== null, (element) => untrack(() => args.props.onEnter)?.(element));
+	const [isDialog, setDialog] = createSignal(untrack(() => args.props.trigger === "PreviewTrigger"));
+	createEffect(() => [args.popoverRef(), args.props.isNonModal !== true || args.props.trigger === "SubmenuTrigger" || args.props.trigger === "PreviewTrigger"], ([element, required]) => {
+		setDialog(!!element && required && !element.querySelector("[role=\"dialog\"]"));
+	});
+	createEffect(() => [
+		isDialog(),
+		args.popoverRef(),
+		args.props.trigger
+	], ([dialog, element, trigger]) => {
+		if (dialog && element && trigger !== "PreviewTrigger") onSettled(() => {
+			if ((trigger !== "SubmenuTrigger" || getInteractionModality() !== "pointer") && !isFocusWithin(element)) focusSafely(element);
+		});
+	});
+	const values = {
+		get isEntering() {
+			return args.props.isEntering === true || args.props.shouldSkipAnimation !== true && entering();
+		},
+		get isExiting() {
+			return args.exiting();
+		},
+		get placement() {
+			return aria.placement;
+		},
+		get trigger() {
+			return args.props.trigger;
+		}
+	};
+	const render = createRenderProps(mergeProps(merge(() => args.props ?? {}), {
+		defaultClass: "solid2-aria-Popover",
+		values
+	}));
+	const [triggerWidth, setTriggerWidth] = createSignal();
+	createEffect(() => args.props.triggerRef?.(), (trigger) => {
+		if (!trigger) return;
+		const measure = () => {
+			setTriggerWidth(`${trigger.getBoundingClientRect().width}px`);
+		};
+		measure();
+		const observer = new ResizeObserver(measure);
+		observer.observe(trigger);
+		return () => {
+			observer.disconnect();
+		};
+	}, { ssrSource: "client" });
+	return [memo(() => {
+		return memo(() => {
+			return !(args.props.isNonModal === true);
+		})() && dom.div(mergeProps$1(() => {
+			return aria.underlayProps;
+		}, {
+			style: {
+				inset: "0",
+				position: "fixed"
+			},
+			"data-testid": "underlay"
+		}));
+	}), dom.div(mergeProps$1(() => {
+		return mergeProps(filterDOMProps(args.props, { global: true }), merge(() => aria.popoverProps ?? {}), render);
+	}, new _P$7(isDialog, args, aria, triggerWidth, render, values, setArrowRef, (element) => {
+		args.setPopoverRef(element);
+	})))];
+}
+function ClearContexts(props) {
+	const contexts = untrack(() => props.contexts);
+	const render = (index) => {
+		const Current = contexts[index];
+		return Current ? Current({
+			value: null,
+			get children() {
+				return render(index + 1);
+			}
+		}) : props.children;
+	};
+	return untrack(() => render(0));
+}
+export { Popover, PopoverContext };
+
+//# sourceMappingURL=popover.js.map

package/dist/server/popover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover.js","names":["popoverRef={ref}","setPopoverRef={(element: HTMLElement | null) => {\n            setRef(element);\n          }}","{!(args.props.isNonModal === true) && (\n            <DismissButton onDismiss={args.state.close} />\n          )}","isDialog() ? args.props.id : undefined","args.props.slot === false || args.props.slot === \"\"\n            ? undefined\n            : (args.props.slot ?? undefined)","{input.children as JSX.Element}","{!(args.props.isNonModal === true) && (\n        <dom.div\n          {...aria.underlayProps}\n          style={{ inset: \"0\", position: \"fixed\" }}\n          data-testid=\"underlay\"\n        />\n      )}","dom.div","<dom.div\n          {...aria.underlayProps}\n          style={{ inset: \"0\", position: \"fixed\" }}\n          data-testid=\"underlay\"\n        />","style={{ inset: \"0\", position: \"fixed\" }}","<dom.div\n        {...mergeProps(\n          filterDOMProps(args.props, { global: true }),\n          merge(() => aria.popoverProps ?? {}),\n          render\n        )}\n        ref={(element: HTMLElement) => {\n          args.setPopoverRef(element);\n        }}\n        id={isDialog() ? args.props.id : undefined}\n        role={isDialog() ? \"dialog\" : undefined}\n        tabindex={isDialog() ? -1 : undefined}\n        aria-label={args.props[\"aria-label\"]}\n        aria-labelledby={args.props[\"aria-labelledby\"]}\n        slot={\n          args.props.slot === false || args.props.slot === \"\"\n            ? undefined\n            : (args.props.slot ?? undefined)\n        }\n        style={{\n          ...(typeof aria.popoverProps.style === \"object\"\n            ? aria.popoverProps.style\n            : undefined),\n          \"--trigger-anchor-point\": aria.triggerAnchorPoint\n            ? `${aria.triggerAnchorPoint.x}px ${aria.triggerAnchorPoint.y}px`\n            : undefined,\n          \"--trigger-width\": triggerWidth(),\n          ...(typeof render.style === \"object\" ? render.style : undefined),\n        }}\n        data-trigger={values.trigger}\n        data-placement={values.placement}\n        data-entering={values.isEntering || undefined}\n        data-exiting={values.isExiting || undefined}\n      >\n        <OverlayArrowContext\n          value={mergeProps(\n            merge(() => aria.arrowProps ?? {}),\n            {\n              get placement() {\n                return aria.placement;\n              },\n              ref: (element: HTMLDivElement) => {\n                setArrowRef(element);\n              },\n            }\n          )}\n        >\n          {!(args.props.isNonModal === true) && (\n            <DismissButton onDismiss={args.state.close} />\n          )}\n          <ClearContexts\n            contexts={[PopoverContext, ...(args.props.clearContexts ?? [])]}\n          >\n            {render.children}\n          </ClearContexts>\n          <DismissButton onDismiss={args.state.close} />\n        </OverlayArrowContext>\n      </dom.div>","value={null}","_$memo","_$mergeProps"],"sources":["../../src/popover.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n/*\n * Derived from Adobe React Spectrum: packages/react-aria-components/src/Popover.tsx.\n * Modified for Solid Aria: adapted components, contexts, refs, dialog semantics, animation state, and reactive properties for Solid 2; uses Solid class props.\n * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.\n */\n\nimport { createIsHidden } from \"@solid2-aria/core/collections/hidden\";\nimport { getInteractionModality } from \"@solid2-aria/core/interactions/create-focus-visible\";\nimport { focusSafely } from \"@solid2-aria/core/interactions/focus-safely\";\nimport type { PlacementAxis } from \"@solid2-aria/core/overlays/create-overlay-position\";\nimport { createPopover } from \"@solid2-aria/core/overlays/create-popover\";\nimport type { AriaPopoverProps } from \"@solid2-aria/core/overlays/create-popover\";\nimport { DismissButton } from \"@solid2-aria/core/overlays/dismiss-button\";\nimport { Overlay } from \"@solid2-aria/core/overlays/overlay\";\nimport {\n  createEnterAnimation,\n  createExitAnimation,\n} from \"@solid2-aria/core/utils/animation\";\nimport { filterDOMProps } from \"@solid2-aria/core/utils/filter-dom-props\";\nimport { mergeProps } from \"@solid2-aria/core/utils/merge-props\";\nimport { requireValue } from \"@solid2-aria/core/utils/require-value\";\nimport { isFocusWithin } from \"@solid2-aria/core/utils/shadowdom/dom-functions\";\nimport { createOverlayTriggerState } from \"@solid2-aria/stately/overlays/create-overlay-trigger-state\";\nimport type { OverlayTriggerProps } from \"@solid2-aria/stately/overlays/create-overlay-trigger-state\";\nimport type { GlobalDOMAttributes } from \"@solid2-aria/types-shared-web\";\nimport type { JSX } from \"@solidjs/web\";\nimport {\n  merge,\n  createSignal,\n  createContext,\n  createEffect,\n  onSettled,\n  Show,\n  useContext,\n  untrack,\n} from \"solid-js\";\nimport type { Accessor } from \"solid-js\";\n\nimport { OverlayArrowContext } from \"./overlay-arrow\";\nimport { OverlayTriggerStateContext } from \"./overlay-contexts\";\nimport { dom, createContextProps, createRenderProps } from \"./utils\";\nimport type { ContextValue, Ref, RenderProps, SlotProps } from \"./utils\";\n\nconst fallbackTrigger = () => null;\n\nexport interface PopoverRenderProps {\n  trigger: string | undefined;\n  placement: PlacementAxis | null;\n  isEntering: boolean;\n  isExiting: boolean;\n}\n\ntype ClearableContext = (props: {\n  value: null;\n  children: JSX.Element;\n}) => JSX.Element;\n\nexport interface PopoverProps\n  extends\n    Omit<AriaPopoverProps, \"triggerRef\" | \"popoverRef\" | \"arrowRef\">,\n    OverlayTriggerProps,\n    Pick<\n      JSX.HTMLAttributes<HTMLElement>,\n      | Extract<\n          keyof GlobalDOMAttributes<HTMLElement>,\n          keyof JSX.HTMLAttributes<HTMLElement>\n        >\n      | \"id\"\n      | \"aria-label\"\n      | \"aria-labelledby\"\n      | \"aria-describedby\"\n      | \"aria-details\"\n    >,\n    SlotProps,\n    RenderProps<PopoverRenderProps> {\n  ref?: Ref<HTMLElement>;\n  triggerRef?: Accessor<Element | null>;\n  trigger?: string;\n  clearContexts?: ClearableContext[];\n  isEntering?: boolean;\n  isExiting?: boolean;\n  /** Whether automatic entry and exit animations should be skipped when swapping overlays. */\n  shouldSkipAnimation?: boolean;\n  UNSTABLE_portalContainer?: Element;\n  onEnter?: (element: HTMLElement) => void | Promise<void>;\n  onExit?: (element: HTMLElement) => void | Promise<void>;\n}\n\nexport const PopoverContext =\n  createContext<ContextValue<PopoverProps, HTMLElement>>(null);\n\nexport function Popover(input: PopoverProps): JSX.Element {\n  if (createIsHidden()) {\n    // SAFETY: The hidden collection renderer must still visit the popup's child thunk to discover its items.\n    // oxlint-disable-next-line typescript/no-unsafe-type-assertion, solid/components-return-once -- The renderer resolves deferred JSX children inside the hidden collection owner. Static collection traversal and context registration are fixed when the owner is created.\n    return <>{input.children as JSX.Element}</>;\n  }\n\n  const [props, ref, setRef] = createContextProps(\n    input,\n    untrack(() => input.ref),\n    PopoverContext\n  );\n\n  const context = useContext(OverlayTriggerStateContext);\n  const local = createOverlayTriggerState(props);\n\n  const state = untrack(\n    () =>\n      props.isOpen !== undefined || props.defaultOpen !== undefined || !context\n  )\n    ? local\n    : requireValue(context, \"Expected context\");\n\n  const exitAnimation = createExitAnimation(\n    ref,\n    () => state.isOpen,\n    (element): void | Promise<void> => untrack(() => props.onExit)?.(element)\n  );\n\n  const exiting = () =>\n    props.isExiting === true ||\n    (props.shouldSkipAnimation !== true && exitAnimation());\n\n  return (\n    <Show when={state.isOpen || exiting()}>\n      <Overlay\n        portalContainer={props.UNSTABLE_portalContainer}\n        isExiting={exiting()}\n        shouldContainFocus={!(props.isNonModal === true)}\n      >\n        <PopoverInner\n          props={props}\n          popoverRef={ref}\n          setPopoverRef={(element: HTMLElement | null) => {\n            setRef(element);\n          }}\n          state={state}\n          exiting={exiting}\n        />\n      </Overlay>\n    </Show>\n  );\n}\n\nfunction PopoverInner(args: {\n  props: PopoverProps;\n  popoverRef: Accessor<HTMLElement | null>;\n  setPopoverRef: (element: HTMLElement | null) => void;\n  state: ReturnType<typeof createOverlayTriggerState>;\n  exiting: () => boolean;\n}): JSX.Element {\n  onSettled(() => () => {\n    args.setPopoverRef(null);\n  });\n\n  const [arrowRef, setArrowRef] = createSignal<HTMLDivElement | null>(null, {\n    ownedWrite: true,\n  });\n\n  const aria = createPopover(\n    mergeProps(\n      merge(() => args.props ?? {}),\n      {\n        arrowRef,\n        get offset() {\n          return args.props.offset ?? 8;\n        },\n        get placement() {\n          return args.props.placement ?? \"bottom\";\n        },\n        get popoverRef() {\n          return args.popoverRef;\n        },\n        get triggerRef() {\n          return args.props.triggerRef ?? fallbackTrigger;\n        },\n      }\n    ),\n    untrack(() => args.state)\n  );\n\n  const entering = createEnterAnimation(\n    untrack(() => args.popoverRef),\n    () => aria.placement !== null,\n    (element): void | Promise<void> =>\n      untrack(() => args.props.onEnter)?.(element)\n  );\n\n  const [isDialog, setDialog] = createSignal(\n    untrack(() => args.props.trigger === \"PreviewTrigger\")\n  );\n\n  createEffect(\n    () =>\n      [\n        args.popoverRef(),\n        args.props.isNonModal !== true ||\n          args.props.trigger === \"SubmenuTrigger\" ||\n          args.props.trigger === \"PreviewTrigger\",\n      ] as const,\n    ([element, required]) => {\n      setDialog(\n        !!element && required && !element.querySelector('[role=\"dialog\"]')\n      );\n    }\n  );\n\n  createEffect(\n    () => [isDialog(), args.popoverRef(), args.props.trigger] as const,\n    ([dialog, element, trigger]) => {\n      if (dialog && element && trigger !== \"PreviewTrigger\") {\n        onSettled(() => {\n          if (\n            (trigger !== \"SubmenuTrigger\" ||\n              getInteractionModality() !== \"pointer\") &&\n            !isFocusWithin(element)\n          ) {\n            focusSafely(element);\n          }\n        });\n      }\n    }\n  );\n\n  const values: PopoverRenderProps = {\n    get isEntering() {\n      return (\n        args.props.isEntering === true ||\n        (args.props.shouldSkipAnimation !== true && entering())\n      );\n    },\n    get isExiting() {\n      return args.exiting();\n    },\n    get placement() {\n      return aria.placement;\n    },\n    get trigger() {\n      return args.props.trigger;\n    },\n  };\n\n  const render = createRenderProps(\n    mergeProps(\n      merge(() => args.props ?? {}),\n      { defaultClass: \"solid2-aria-Popover\", values }\n    )\n  );\n\n  const [triggerWidth, setTriggerWidth] = createSignal<string>();\n  createEffect(\n    () => args.props.triggerRef?.(),\n    (trigger) => {\n      if (!trigger) {\n        return;\n      }\n\n      const measure = () => {\n        setTriggerWidth(`${trigger.getBoundingClientRect().width}px`);\n      };\n\n      measure();\n      const observer = new ResizeObserver(measure);\n      observer.observe(trigger);\n\n      // oxlint-disable-next-line typescript/consistent-return -- Setup returns cleanup only when the observed element exists.\n      return () => {\n        observer.disconnect();\n      };\n    },\n    { ssrSource: \"client\" }\n  );\n\n  return (\n    <>\n      {!(args.props.isNonModal === true) && (\n        <dom.div\n          {...aria.underlayProps}\n          style={{ inset: \"0\", position: \"fixed\" }}\n          data-testid=\"underlay\"\n        />\n      )}\n      <dom.div\n        {...mergeProps(\n          filterDOMProps(args.props, { global: true }),\n          merge(() => aria.popoverProps ?? {}),\n          render\n        )}\n        ref={(element: HTMLElement) => {\n          args.setPopoverRef(element);\n        }}\n        id={isDialog() ? args.props.id : undefined}\n        role={isDialog() ? \"dialog\" : undefined}\n        tabindex={isDialog() ? -1 : undefined}\n        aria-label={args.props[\"aria-label\"]}\n        aria-labelledby={args.props[\"aria-labelledby\"]}\n        slot={\n          args.props.slot === false || args.props.slot === \"\"\n            ? undefined\n            : (args.props.slot ?? undefined)\n        }\n        style={{\n          ...(typeof aria.popoverProps.style === \"object\"\n            ? aria.popoverProps.style\n            : undefined),\n          \"--trigger-anchor-point\": aria.triggerAnchorPoint\n            ? `${aria.triggerAnchorPoint.x}px ${aria.triggerAnchorPoint.y}px`\n            : undefined,\n          \"--trigger-width\": triggerWidth(),\n          ...(typeof render.style === \"object\" ? render.style : undefined),\n        }}\n        data-trigger={values.trigger}\n        data-placement={values.placement}\n        data-entering={values.isEntering || undefined}\n        data-exiting={values.isExiting || undefined}\n      >\n        <OverlayArrowContext\n          value={mergeProps(\n            merge(() => aria.arrowProps ?? {}),\n            {\n              get placement() {\n                return aria.placement;\n              },\n              ref: (element: HTMLDivElement) => {\n                setArrowRef(element);\n              },\n            }\n          )}\n        >\n          {!(args.props.isNonModal === true) && (\n            <DismissButton onDismiss={args.state.close} />\n          )}\n          <ClearContexts\n            contexts={[PopoverContext, ...(args.props.clearContexts ?? [])]}\n          >\n            {render.children}\n          </ClearContexts>\n          <DismissButton onDismiss={args.state.close} />\n        </OverlayArrowContext>\n      </dom.div>\n    </>\n  );\n}\n\nfunction ClearContexts(props: {\n  contexts: ClearableContext[];\n  children?: JSX.Element;\n}): JSX.Element {\n  const contexts = untrack(() => props.contexts);\n\n  const render = (index: number): JSX.Element => {\n    const Current = contexts[index];\n\n    return Current ? (\n      <Current value={null}>{render(index + 1)}</Current>\n    ) : (\n      props.children\n    );\n  };\n\n  return untrack(() => render(0));\n}\n"],"mappings":"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"}

package/dist/server/preview-trigger.js

@@ -0,0 +1,153 @@
+/*
+ * Copyright 2026 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-aria-components/src/PreviewTrigger.tsx.
+ * Modified for Solid Aria: adapted components, contexts, refs, warmup animation skipping, and reactive properties for Solid 2.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { OverlayTriggerStateContext } from "./overlay-contexts.js";
+import { PopoverContext } from "./popover.js";
+import { mergeProps } from "@solid2-aria/core/utils/merge-props";
+import { createSignal, merge } from "solid-js";
+import { mergeProps as mergeProps$1 } from "@solidjs/web";
+import { FocusableProvider } from "@solid2-aria/core/interactions/create-focusable";
+import { createPreviewTrigger } from "@solid2-aria/core/tooltip/create-preview-trigger";
+import { createTooltipTriggerState } from "@solid2-aria/stately/tooltip/create-tooltip-trigger-state";
+// src/preview-trigger.tsx
+var _m$ = Symbol();
+var _m$2 = Symbol();
+var _m$3 = Symbol();
+var _m$4 = Symbol();
+var _m$5 = Symbol();
+var _m$6 = Symbol();
+var _d$ = {
+	get() {
+		return this[_m$].children;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$(_p) {
+	this[_m$] = _p;
+	Object.defineProperty(this, "children", _d$);
+}
+_P$.prototype = Object.prototype;
+var _d$2 = {
+	get() {
+		const aria = this[_m$];
+		const setPopoverRef = this[_m$2];
+		const state = this[_m$3];
+		const triggerRef = this[_m$4];
+		return mergeProps(merge(() => aria.popoverProps ?? {}), {
+			isNonModal: true,
+			ref: (element) => {
+				setPopoverRef(element);
+			},
+			get shouldSkipAnimation() {
+				return state.shouldSkipAnimation;
+			},
+			trigger: "PreviewTrigger",
+			triggerRef
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$3 = {
+	get() {
+		const setTriggerRef = this[_m$5];
+		const aria = this[_m$];
+		const props = this[_m$6];
+		return FocusableProvider(mergeProps$1({ ref: (element) => {
+			setTriggerRef(element);
+		} }, () => {
+			return aria.triggerProps;
+		}, new _P$(props)));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$2(_p2, _p3, _p4, _p5, _p6, _p7) {
+	this[_m$] = _p2;
+	this[_m$2] = _p3;
+	this[_m$3] = _p4;
+	this[_m$4] = _p5;
+	this[_m$5] = _p6;
+	this[_m$6] = _p7;
+	Object.defineProperty(this, "value", _d$2);
+	Object.defineProperty(this, "children", _d$3);
+}
+_P$2.prototype = Object.prototype;
+var _d$4 = {
+	get() {
+		const aria = this[_m$];
+		const setPopoverRef = this[_m$2];
+		const state = this[_m$3];
+		const triggerRef = this[_m$4];
+		const setTriggerRef = this[_m$5];
+		const props = this[_m$6];
+		return PopoverContext(new _P$2(aria, setPopoverRef, state, triggerRef, setTriggerRef, props));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$3(_p8, _p9, _p0, _p1, _p10, _p11, _p12) {
+	this[_m$] = _p8;
+	this[_m$2] = _p9;
+	this[_m$3] = _p0;
+	this[_m$4] = _p1;
+	this[_m$5] = _p10;
+	this[_m$6] = _p11;
+	this.value = _p12;
+	Object.defineProperty(this, "children", _d$4);
+}
+_P$3.prototype = Object.prototype;
+function PreviewTrigger(props) {
+	const [triggerRef, setTriggerRef] = createSignal(null, { ownedWrite: true });
+	const [popoverRef, setPopoverRef] = createSignal(null, { ownedWrite: true });
+	const state = createTooltipTriggerState(mergeProps(props, {
+		get closeDelay() {
+			return props.closeDelay ?? 200;
+		},
+		get delay() {
+			return props.delay ?? 600;
+		}
+	}));
+	const aria = createPreviewTrigger(mergeProps(props, {
+		popoverRef,
+		triggerRef
+	}), state);
+	return OverlayTriggerStateContext(new _P$3(aria, setPopoverRef, state, triggerRef, setTriggerRef, props, {
+		close() {
+			state.close();
+		},
+		get isOpen() {
+			return state.isOpen;
+		},
+		open() {
+			state.open();
+		},
+		point: null,
+		setOpen(open) {
+			if (open) state.open();
+			else state.close();
+		},
+		setPoint() {},
+		toggle() {
+			if (state.isOpen) state.close();
+			else state.open();
+		}
+	}));
+}
+export { PreviewTrigger };
+
+//# sourceMappingURL=preview-trigger.js.map

package/dist/server/preview-trigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-trigger.js","names":["ref={(element: FocusableElement) => {\n            setTriggerRef(element);\n          }}","_$mergeProps"],"sources":["../../src/preview-trigger.tsx"],"sourcesContent":["/*\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n/*\n * Derived from Adobe React Spectrum: packages/react-aria-components/src/PreviewTrigger.tsx.\n * Modified for Solid Aria: adapted components, contexts, refs, warmup animation skipping, and reactive properties for Solid 2.\n * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.\n */\n\nimport { FocusableProvider } from \"@solid2-aria/core/interactions/create-focusable\";\nimport { createPreviewTrigger } from \"@solid2-aria/core/tooltip/create-preview-trigger\";\nimport type { AriaPreviewTriggerProps } from \"@solid2-aria/core/tooltip/create-preview-trigger\";\nimport { mergeProps } from \"@solid2-aria/core/utils/merge-props\";\nimport type { OverlayTriggerState } from \"@solid2-aria/stately/overlays/create-overlay-trigger-state\";\nimport { createTooltipTriggerState } from \"@solid2-aria/stately/tooltip/create-tooltip-trigger-state\";\nimport type { FocusableElement } from \"@solid2-aria/types-shared\";\nimport type { JSX } from \"@solidjs/web\";\nimport { merge, createSignal } from \"solid-js\";\n\nimport { OverlayTriggerStateContext } from \"./dialog\";\nimport { PopoverContext } from \"./popover\";\n\nexport interface PreviewTriggerProps extends AriaPreviewTriggerProps {\n  children?: JSX.Element;\n  delay?: number;\n  closeDelay?: number;\n}\n\nexport function PreviewTrigger(props: PreviewTriggerProps): JSX.Element {\n  const [triggerRef, setTriggerRef] = createSignal<FocusableElement | null>(\n    null,\n    {\n      ownedWrite: true,\n    }\n  );\n\n  const [popoverRef, setPopoverRef] = createSignal<HTMLElement | null>(null, {\n    ownedWrite: true,\n  });\n\n  const state = createTooltipTriggerState(\n    mergeProps(props, {\n      get closeDelay() {\n        return props.closeDelay ?? 200;\n      },\n      get delay() {\n        return props.delay ?? 600;\n      },\n    })\n  );\n\n  const aria = createPreviewTrigger(\n    mergeProps(props, { popoverRef, triggerRef }),\n    state\n  );\n\n  const overlay: OverlayTriggerState = {\n    close() {\n      state.close();\n    },\n    get isOpen() {\n      return state.isOpen;\n    },\n    open() {\n      state.open();\n    },\n    point: null,\n    setOpen(open) {\n      if (open) {\n        state.open();\n      } else {\n        state.close();\n      }\n    },\n    setPoint() {\n      /* empty */\n    },\n    toggle() {\n      if (state.isOpen) {\n        state.close();\n      } else {\n        state.open();\n      }\n    },\n  };\n\n  return (\n    <OverlayTriggerStateContext value={overlay}>\n      <PopoverContext\n        value={mergeProps(\n          merge(() => aria.popoverProps ?? {}),\n          {\n            isNonModal: true,\n            ref: (element: HTMLElement) => {\n              setPopoverRef(element);\n            },\n            get shouldSkipAnimation() {\n              return state.shouldSkipAnimation;\n            },\n            trigger: \"PreviewTrigger\",\n            triggerRef,\n          }\n        )}\n      >\n        <FocusableProvider\n          ref={(element: FocusableElement) => {\n            setTriggerRef(element);\n          }}\n          {...aria.triggerProps}\n        >\n          {props.children}\n        </FocusableProvider>\n      </PopoverContext>\n    </OverlayTriggerStateContext>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsHU,O,SAAC,CAAM;;;;;;;;;;;;;;;;EArBT,OAAO,WACL,YAAY,KAAK,gBAAgB,CAAC,CAAC,GACnC;GACE,YAAY;GACZ,MAAM,YAAyB;IAC7B,cAAc,OAAO;GACvB;GACA,IAAI,sBAAsB;IACxB,OAAO,MAAM;GACf;GACA,SAAS;GACT;EACF,CACF;;;;;;;;;;EAEA,OAAA,kBAAAC,aAAA,EACED,MAAM,YAA8B;GAClC,cAAc,OAAO;EACvB,EAIiB,SAHjB;GAAI,OAAA,KAAK;EAAY,GAJvB,IAAA,IAMG,KACgB,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;EAvBrB,OAAA,eAAA,IAAA,KAEgB,MAIR,eAGO,OAGT,YAMA,eAID,KAEW,CAAA;;;;;;;;;;;;;;;;AApFtB,SAAgB,eAAe,OAAyC;CACtE,MAAM,CAAC,YAAY,iBAAiB,aAClC,MACA,EACE,YAAY,KACd,CACF;CAEA,MAAM,CAAC,YAAY,iBAAiB,aAAiC,MAAM,EACzE,YAAY,KACd,CAAC;CAED,MAAM,QAAQ,0BACZ,WAAW,OAAO;EAChB,IAAI,aAAa;GACf,OAAO,MAAM,cAAc;EAC7B;EACA,IAAI,QAAQ;GACV,OAAO,MAAM,SAAS;EACxB;CACF,CAAC,CACH;CAEA,MAAM,OAAO,qBACX,WAAW,OAAO;EAAE;EAAY;CAAW,CAAC,GAC5C,KACF;CAgCA,OAAA,2BACE,IAAA,KAGkB,MAIR,eAGO,OAGT,YAMA,eAID,OAvB4B;EA9BnC,QAAQ;GACN,MAAM,MAAM;EACd;EACA,IAAI,SAAS;GACX,OAAO,MAAM;EACf;EACA,OAAO;GACL,MAAM,KAAK;EACb;EACA,OAAO;EACP,QAAQ,MAAM;GACZ,IAAI,MACF,MAAM,KAAK;QAEX,MAAM,MAAM;EAEhB;EACA,WAAW,CAEX;EACA,SAAS;GACP,IAAI,MAAM,QACR,MAAM,MAAM;QAEZ,MAAM,KAAK;EAEf;CAImC,CA0BP,CAAA;AAEhC"}