@solid2-aria/components 0.0.0-stage → 0.0.1

package/dist/server/menu.js

@@ -0,0 +1,1188 @@
+/*
+ * 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/Menu.tsx.
+ * Modified for Solid Aria: adapted collection ownership, contexts, accessibility primitives, and reactive properties for Solid 2; uses Solid class props and press responders for custom triggers.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { DEFAULT_SLOT, assignRef, createContextProps, createRenderProps, createSlot, createSlottedContext, dom } from "./utils.js";
+import { FieldInputContext, SelectableCollectionContext } from "./autocomplete.js";
+import { CollectionRendererContext, SectionContext } from "./collection.js";
+import { TextContext } from "./text.js";
+import { SelectionIndicatorContext } from "./selection-indicator.js";
+import { HeaderContext } from "./header.js";
+import { OverlayTriggerStateContext } from "./overlay-contexts.js";
+import { PopoverContext } from "./popover.js";
+import { KeyboardContext } from "./keyboard.js";
+import { mergeProps } from "@solid2-aria/core/utils/merge-props";
+import { Show, createContext, createMemo, createSignal, merge, omit, untrack, useContext } from "solid-js";
+import { applyRef, dynamic, escape, memo, mergeProps as mergeProps$1, scope, ssr, ssrHydrationKey, ssrStyleProperties, ssrStyleProperty } from "@solidjs/web";
+import { BaseCollection, CollectionNode, ItemNode, LoaderNode, SectionNode } from "@solid2-aria/core/collections/base-collection";
+import { Collection, CollectionBuilder, createBranchComponent, createLeafComponent } from "@solid2-aria/core/collections/collection-builder";
+import { filterDOMProps } from "@solid2-aria/core/utils/filter-dom-props";
+import { createHover } from "@solid2-aria/core/interactions/create-hover";
+import { isTruthy } from "@solid2-aria/core/utils/truthy";
+import { createIsHidden } from "@solid2-aria/core/collections/hidden";
+import { createLoadMoreSentinel } from "@solid2-aria/core/utils/create-load-more-sentinel";
+import { createMenuTriggerState } from "@solid2-aria/stately/menu/create-menu-trigger-state";
+import { PressResponder } from "@solid2-aria/core/interactions/press-responder";
+import { createMenu } from "@solid2-aria/core/menu/create-menu";
+import { createMenuItem } from "@solid2-aria/core/menu/create-menu-item";
+import { createMenuSection } from "@solid2-aria/core/menu/create-menu-section";
+import { createMenuTrigger } from "@solid2-aria/core/menu/create-menu-trigger";
+import { createSubmenuTrigger } from "@solid2-aria/core/menu/create-submenu-trigger";
+import { createSubmenuTriggerState } from "@solid2-aria/stately/menu/create-submenu-trigger-state";
+import { createMultipleSelectionState } from "@solid2-aria/stately/selection/create-multiple-selection-state";
+import { SelectionManager } from "@solid2-aria/stately/selection/selection-manager";
+import { createTreeState } from "@solid2-aria/stately/tree/create-tree-state";
+// src/menu.tsx
+var _tmpl$ = [
+	"<div",
+	" role=\"menuitem\" style=\"",
+	"\">",
+	"</div>"
+];
+var _tmpl$2 = [
+	"<div",
+	" style=\"",
+	"\" inert><div data-testid=\"loadMoreSentinel\" style=\"",
+	"\"></div></div>"
+];
+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 _m$8 = Symbol();
+var _m$9 = Symbol();
+var _d$ = {
+	get() {
+		return this[_m$].isOpen;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$2 = {
+	get() {
+		return this[_m$2].children;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$(_p, _p2, _p3) {
+	this[_m$] = _p;
+	this[_m$2] = _p2;
+	Object.defineProperty(this, "isPressed", _d$);
+	this.ref = _p3;
+	Object.defineProperty(this, "children", _d$2);
+}
+_P$.prototype = Object.prototype;
+var _d$3 = {
+	get() {
+		const scrollRef = this[_m$];
+		const ref = this[_m$2];
+		const aria = this[_m$3];
+		const props = this[_m$4];
+		return mergeProps({
+			get placement() {
+				return "bottom start";
+			},
+			scrollRef,
+			trigger: "MenuTrigger",
+			triggerRef: ref
+		}, {
+			get "aria-labelledby"() {
+				return aria.menuProps["aria-labelledby"];
+			},
+			get offset() {
+				return props.trigger === "contextMenu" ? 0 : void 0;
+			}
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$4 = {
+	get() {
+		const aria = this[_m$3];
+		const state = this[_m$5];
+		const props = this[_m$4];
+		const setRef = this[_m$6];
+		return PressResponder(mergeProps$1(() => {
+			return merge(() => aria.menuTriggerProps ?? {});
+		}, new _P$(state, props, (element) => {
+			setRef(element);
+		})));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$2(_p4, _p5, _p6, _p7, _p8, _p9) {
+	this[_m$] = _p4;
+	this[_m$2] = _p5;
+	this[_m$3] = _p6;
+	this[_m$4] = _p7;
+	this[_m$5] = _p8;
+	this[_m$6] = _p9;
+	Object.defineProperty(this, "value", _d$3);
+	Object.defineProperty(this, "children", _d$4);
+}
+_P$2.prototype = Object.prototype;
+var _d$5 = {
+	get() {
+		const scrollRef = this[_m$];
+		const ref = this[_m$2];
+		const aria = this[_m$3];
+		const props = this[_m$4];
+		const state = this[_m$5];
+		const setRef = this[_m$6];
+		return PopoverContext(new _P$2(scrollRef, ref, aria, props, state, setRef));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$3(_p0, _p1, _p10, _p11, _p12, _p13, _p14) {
+	this[_m$] = _p0;
+	this[_m$2] = _p1;
+	this[_m$3] = _p10;
+	this[_m$4] = _p11;
+	this[_m$5] = _p12;
+	this[_m$6] = _p13;
+	this.value = _p14;
+	Object.defineProperty(this, "children", _d$5);
+}
+_P$3.prototype = Object.prototype;
+var _d$6 = {
+	get() {
+		const scrollRef = this[_m$];
+		const ref = this[_m$2];
+		const aria = this[_m$3];
+		const props = this[_m$4];
+		const state = this[_m$5];
+		const setRef = this[_m$6];
+		return RootMenuTriggerStateContext(new _P$3(scrollRef, ref, aria, props, state, setRef, state));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$4(_p15, _p16, _p17, _p18, _p19, _p20, _p21) {
+	this[_m$] = _p15;
+	this[_m$2] = _p16;
+	this[_m$3] = _p17;
+	this[_m$4] = _p18;
+	this[_m$5] = _p19;
+	this[_m$6] = _p20;
+	this.value = _p21;
+	Object.defineProperty(this, "children", _d$6);
+}
+_P$4.prototype = Object.prototype;
+var _d$7 = {
+	get() {
+		const aria = this[_m$];
+		const setScrollRef = this[_m$2];
+		return mergeProps(merge(() => aria.menuProps ?? {}), { ref: (element) => {
+			setScrollRef(element);
+		} });
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$8 = {
+	get() {
+		const scrollRef = this[_m$3];
+		const ref = this[_m$4];
+		const aria = this[_m$];
+		const props = this[_m$5];
+		const state = this[_m$6];
+		const setRef = this[_m$7];
+		return OverlayTriggerStateContext(new _P$4(scrollRef, ref, aria, props, state, setRef, state));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$5(_p22, _p23, _p24, _p25, _p26, _p27, _p28) {
+	this[_m$] = _p22;
+	this[_m$2] = _p23;
+	this[_m$3] = _p24;
+	this[_m$4] = _p25;
+	this[_m$5] = _p26;
+	this[_m$6] = _p27;
+	this[_m$7] = _p28;
+	Object.defineProperty(this, "value", _d$7);
+	Object.defineProperty(this, "children", _d$8);
+}
+_P$5.prototype = Object.prototype;
+var _d$9 = {
+	get() {
+		const props = this[_m$];
+		return Collection(props);
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$6(_p29, _p30, _p31) {
+	this[_m$] = _p29;
+	this.createCollection = _p30;
+	Object.defineProperty(this, "content", _d$9);
+	this.children = _p31;
+}
+_P$6.prototype = Object.prototype;
+var _d$10 = {
+	get() {
+		return this[_m$].collection;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$7(_p32, _p33) {
+	this[_m$] = _p32;
+	Object.defineProperty(this, "collection", _d$10);
+	this.scrollRef = _p33;
+}
+_P$7.prototype = Object.prototype;
+var _d$11 = {
+	get() {
+		const Root = this[_m$];
+		const state = this[_m$2];
+		const ref = this[_m$3];
+		return Root(new _P$7(state, ref));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$8(_p34, _p35, _p36, _p37) {
+	this[_m$] = _p34;
+	this[_m$2] = _p35;
+	this[_m$3] = _p36;
+	this.value = _p37;
+	Object.defineProperty(this, "children", _d$11);
+}
+_P$8.prototype = Object.prototype;
+var _d$12 = {
+	get() {
+		const Root = this[_m$];
+		const state = this[_m$2];
+		const ref = this[_m$3];
+		return SectionContext(new _P$8(Root, state, ref, {
+			name: "MenuSection",
+			render: (sectionProps, sectionRef, node, defaultClass) => MenuSectionInner(sectionProps, sectionRef, node, defaultClass)
+		}));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$9(_p38, _p39, _p40, _p41) {
+	this[_m$] = _p38;
+	this[_m$2] = _p39;
+	this[_m$3] = _p40;
+	this.value = _p41;
+	Object.defineProperty(this, "children", _d$12);
+}
+_P$9.prototype = Object.prototype;
+var _d$13 = {
+	get() {
+		const Root = this[_m$];
+		const state = this[_m$2];
+		const ref = this[_m$3];
+		return FieldInputContext(new _P$9(Root, state, ref, null));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$10(_p42, _p43, _p44, _p45) {
+	this[_m$] = _p42;
+	this[_m$2] = _p43;
+	this[_m$3] = _p44;
+	this.value = _p45;
+	Object.defineProperty(this, "children", _d$13);
+}
+_P$10.prototype = Object.prototype;
+var _d$14 = {
+	get() {
+		const Root = this[_m$];
+		const state = this[_m$2];
+		const ref = this[_m$3];
+		return SelectableCollectionContext(new _P$10(Root, state, ref, null));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$11(_p46, _p47, _p48, _p49) {
+	this[_m$] = _p46;
+	this[_m$2] = _p47;
+	this[_m$3] = _p48;
+	this.value = _p49;
+	Object.defineProperty(this, "children", _d$14);
+}
+_P$11.prototype = Object.prototype;
+var _d$15 = {
+	get() {
+		const Root = this[_m$];
+		const state = this[_m$2];
+		const ref = this[_m$3];
+		const props = this[_m$4];
+		return MenuItemContext(new _P$11(Root, state, ref, { get shouldCloseOnSelect() {
+			return props.shouldCloseOnSelect;
+		} }));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$12(_p50, _p51, _p52, _p53, _p54) {
+	this[_m$] = _p50;
+	this[_m$2] = _p51;
+	this[_m$3] = _p52;
+	this[_m$4] = _p53;
+	this.value = _p54;
+	Object.defineProperty(this, "children", _d$15);
+}
+_P$12.prototype = Object.prototype;
+var _d$16 = {
+	get() {
+		const Root = this[_m$];
+		const state = this[_m$2];
+		const ref = this[_m$3];
+		const props = this[_m$4];
+		return SubmenuContext(new _P$12(Root, state, ref, props, {
+			parentMenuRef: ref,
+			get shouldUseVirtualFocus() {
+				return props.shouldUseVirtualFocus;
+			}
+		}));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$13(_p55, _p56, _p57, _p58, _p59) {
+	this[_m$] = _p55;
+	this[_m$2] = _p56;
+	this[_m$3] = _p57;
+	this[_m$4] = _p58;
+	this.value = _p59;
+	Object.defineProperty(this, "children", _d$16);
+}
+_P$13.prototype = Object.prototype;
+var _d$17 = {
+	get() {
+		const state = this[_m$];
+		return untrack(() => state.selectionManager);
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$18 = {
+	get() {
+		const Root = this[_m$2];
+		const state = this[_m$];
+		const ref = this[_m$3];
+		const props = this[_m$4];
+		const trigger = this[_m$5];
+		return RootMenuTriggerStateContext(new _P$13(Root, state, ref, props, trigger));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$14(_p60, _p61, _p62, _p63, _p64) {
+	this[_m$] = _p60;
+	this[_m$2] = _p61;
+	this[_m$3] = _p62;
+	this[_m$4] = _p63;
+	this[_m$5] = _p64;
+	Object.defineProperty(this, "value", _d$17);
+	Object.defineProperty(this, "children", _d$18);
+}
+_P$14.prototype = Object.prototype;
+var _d$19 = {
+	get() {
+		const state = this[_m$];
+		const Root = this[_m$2];
+		const ref = this[_m$3];
+		const props = this[_m$4];
+		const trigger = this[_m$5];
+		return SelectionManagerContext(new _P$14(state, Root, ref, props, trigger));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$15(_p65, _p66, _p67, _p68, _p69, _p70) {
+	this[_m$] = _p65;
+	this[_m$2] = _p66;
+	this[_m$3] = _p67;
+	this[_m$4] = _p68;
+	this[_m$5] = _p69;
+	this.value = _p70;
+	Object.defineProperty(this, "children", _d$19);
+}
+_P$15.prototype = Object.prototype;
+var _d$20 = {
+	get() {
+		return this[_m$].slot ?? void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$21 = {
+	get() {
+		return this[_m$2].collection.size === 0 || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$22 = {
+	get() {
+		const state = this[_m$2];
+		const Root = this[_m$3];
+		const ref = this[_m$4];
+		const props = this[_m$];
+		const trigger = this[_m$5];
+		return [MenuStateContext(new _P$15(state, Root, ref, props, trigger, state)), memo(() => {
+			var _v$, _v$2;
+			return memo(() => {
+				return !!(state.collection.size === 0 && props.renderEmptyState);
+			})() ? (_v$ = ssrHydrationKey(), _v$2 = scope(() => {
+				return escape(props.renderEmptyState());
+			}), ssr(_tmpl$, _v$, ssrStyleProperty("display:", "contents"), _v$2)) : null;
+		})];
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$16(_p71, _p72, _p73, _p74, _p75, _p76) {
+	this[_m$] = _p71;
+	this[_m$2] = _p72;
+	this[_m$3] = _p73;
+	this[_m$4] = _p74;
+	this[_m$5] = _p75;
+	this.ref = _p76;
+	Object.defineProperty(this, "slot", _d$20);
+	Object.defineProperty(this, "data-empty", _d$21);
+	Object.defineProperty(this, "children", _d$22);
+}
+_P$16.prototype = Object.prototype;
+var _d$23 = {
+	get() {
+		return this[_m$].collection;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$17(_p77, _p78) {
+	this[_m$] = _p77;
+	Object.defineProperty(this, "collection", _d$23);
+	this.parent = _p78;
+}
+_P$17.prototype = Object.prototype;
+var _d$24 = {
+	get() {
+		const Branch = this[_m$];
+		const state = this[_m$2];
+		const node = this[_m$3];
+		return Branch(new _P$17(state, node));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$18(_p79, _p80, _p81, _p82) {
+	this[_m$] = _p79;
+	this[_m$2] = _p80;
+	this[_m$3] = _p81;
+	this.value = _p82;
+	Object.defineProperty(this, "children", _d$24);
+}
+_P$18.prototype = Object.prototype;
+var _d$25 = {
+	get() {
+		const manager = this[_m$];
+		return untrack(manager);
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$26 = {
+	get() {
+		const Branch = this[_m$2];
+		const state = this[_m$3];
+		const node = this[_m$4];
+		const props = this[_m$5];
+		const context = this[_m$6];
+		return MenuItemContext(new _P$18(Branch, state, node, { get shouldCloseOnSelect() {
+			return props.shouldCloseOnSelect ?? context?.shouldCloseOnSelect;
+		} }));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$19(_p83, _p84, _p85, _p86, _p87, _p88) {
+	this[_m$] = _p83;
+	this[_m$2] = _p84;
+	this[_m$3] = _p85;
+	this[_m$4] = _p86;
+	this[_m$5] = _p87;
+	this[_m$6] = _p88;
+	Object.defineProperty(this, "value", _d$25);
+	Object.defineProperty(this, "children", _d$26);
+}
+_P$19.prototype = Object.prototype;
+var _d$27 = {
+	get() {
+		const aria = this[_m$];
+		const registerHeading = this[_m$2];
+		return mergeProps(merge(() => aria.headingProps ?? {}), { registerSlot: registerHeading });
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$28 = {
+	get() {
+		const manager = this[_m$3];
+		const Branch = this[_m$4];
+		const state = this[_m$5];
+		const node = this[_m$6];
+		const props = this[_m$7];
+		const context = this[_m$8];
+		return SelectionManagerContext(new _P$19(manager, Branch, state, node, props, context));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$20(_p89, _p90, _p91, _p92, _p93, _p94, _p95, _p96) {
+	this[_m$] = _p89;
+	this[_m$2] = _p90;
+	this[_m$3] = _p91;
+	this[_m$4] = _p92;
+	this[_m$5] = _p93;
+	this[_m$6] = _p94;
+	this[_m$7] = _p95;
+	this[_m$8] = _p96;
+	Object.defineProperty(this, "value", _d$27);
+	Object.defineProperty(this, "children", _d$28);
+}
+_P$20.prototype = Object.prototype;
+var _d$29 = {
+	get() {
+		return this[_m$].children;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$21(_p97, _p98) {
+	this[_m$] = _p97;
+	this.value = _p98;
+	Object.defineProperty(this, "children", _d$29);
+}
+_P$21.prototype = Object.prototype;
+var _d$30 = {
+	get() {
+		return this[_m$].keyboardShortcutProps;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$31 = {
+	get() {
+		const render = this[_m$2];
+		const aria = this[_m$];
+		return SelectionIndicatorContext(new _P$21(render, { get isSelected() {
+			return aria.isSelected;
+		} }));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$22(_p99, _p100) {
+	this[_m$] = _p99;
+	this[_m$2] = _p100;
+	Object.defineProperty(this, "value", _d$30);
+	Object.defineProperty(this, "children", _d$31);
+}
+_P$22.prototype = Object.prototype;
+var _d$32 = {
+	get() {
+		const aria = this[_m$];
+		const render = this[_m$2];
+		return KeyboardContext(new _P$22(aria, render));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$23(_p101, _p102, _p103) {
+	this[_m$] = _p101;
+	this[_m$2] = _p102;
+	this.value = _p103;
+	Object.defineProperty(this, "children", _d$32);
+}
+_P$23.prototype = Object.prototype;
+var _d$33 = {
+	get() {
+		return this[_m$].isSelected || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$34 = {
+	get() {
+		return this[_m$].isDisabled || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$35 = {
+	get() {
+		return this[_m$2].isHovered || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$36 = {
+	get() {
+		return this[_m$].isFocused || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$37 = {
+	get() {
+		return this[_m$].isFocusVisible || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$38 = {
+	get() {
+		return this[_m$].isPressed || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$39 = {
+	get() {
+		return this[_m$3].hasSubmenu || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$40 = {
+	get() {
+		return this[_m$3].isOpen || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$41 = {
+	get() {
+		const manager = this[_m$4];
+		return memo(() => {
+			return manager.selectionMode === "none";
+		})() ? void 0 : manager.selectionMode;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$42 = {
+	get() {
+		const aria = this[_m$];
+		const render = this[_m$5];
+		return TextContext(new _P$23(aria, render, { slots: {
+			get [DEFAULT_SLOT]() {
+				return aria.labelProps;
+			},
+			get description() {
+				return aria.descriptionProps;
+			},
+			get label() {
+				return aria.labelProps;
+			}
+		} }));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$24(_p104, _p105, _p106, _p107, _p108, _p109) {
+	this[_m$] = _p104;
+	this[_m$2] = _p105;
+	this[_m$3] = _p106;
+	this[_m$4] = _p107;
+	this[_m$5] = _p108;
+	this.ref = _p109;
+	Object.defineProperty(this, "data-selected", _d$33);
+	Object.defineProperty(this, "data-disabled", _d$34);
+	Object.defineProperty(this, "data-hovered", _d$35);
+	Object.defineProperty(this, "data-focused", _d$36);
+	Object.defineProperty(this, "data-focus-visible", _d$37);
+	Object.defineProperty(this, "data-pressed", _d$38);
+	Object.defineProperty(this, "data-has-submenu", _d$39);
+	Object.defineProperty(this, "data-open", _d$40);
+	Object.defineProperty(this, "data-selection-mode", _d$41);
+	Object.defineProperty(this, "children", _d$42);
+}
+_P$24.prototype = Object.prototype;
+var _d$43 = {
+	get() {
+		return this[_m$].collection;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$25(_p110, _p111) {
+	this[_m$] = _p110;
+	Object.defineProperty(this, "collection", _d$43);
+	this.parent = _p111;
+}
+_P$25.prototype = Object.prototype;
+var _d$44 = {
+	get() {
+		return this[_m$].renderPopover();
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$26(_p112, _p113) {
+	this[_m$] = _p112;
+	this.value = _p113;
+	Object.defineProperty(this, "children", _d$44);
+}
+_P$26.prototype = Object.prototype;
+var _d$45 = {
+	get() {
+		const aria = this[_m$];
+		const itemRef = this[_m$2];
+		return mergeProps(merge(() => aria.popoverProps ?? {}), {
+			get "aria-labelledby"() {
+				return aria.submenuProps["aria-labelledby"];
+			},
+			get placement() {
+				return "end top";
+			},
+			trigger: "SubmenuTrigger",
+			triggerRef: itemRef
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$46 = {
+	get() {
+		const Branch = this[_m$3];
+		const state = this[_m$4];
+		const item = this[_m$5];
+		const props = this[_m$6];
+		return [Branch(new _P$25(state, item)), SubmenuCaptureContext(new _P$26(props, true))];
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$27(_p114, _p115, _p116, _p117, _p118, _p119) {
+	this[_m$] = _p114;
+	this[_m$2] = _p115;
+	this[_m$3] = _p116;
+	this[_m$4] = _p117;
+	this[_m$5] = _p118;
+	this[_m$6] = _p119;
+	Object.defineProperty(this, "value", _d$45);
+	Object.defineProperty(this, "children", _d$46);
+}
+_P$27.prototype = Object.prototype;
+var _d$47 = {
+	get() {
+		const aria = this[_m$];
+		const itemRef = this[_m$2];
+		const Branch = this[_m$3];
+		const state = this[_m$4];
+		const item = this[_m$5];
+		const props = this[_m$6];
+		return PopoverContext(new _P$27(aria, itemRef, Branch, state, item, props));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$28(_p120, _p121, _p122, _p123, _p124, _p125, _p126) {
+	this[_m$] = _p120;
+	this[_m$2] = _p121;
+	this[_m$3] = _p122;
+	this[_m$4] = _p123;
+	this[_m$5] = _p124;
+	this[_m$6] = _p125;
+	this.value = _p126;
+	Object.defineProperty(this, "children", _d$47);
+}
+_P$28.prototype = Object.prototype;
+var _d$48 = {
+	get() {
+		const aria = this[_m$];
+		const setSubmenuRef = this[_m$2];
+		return mergeProps(merge(() => aria.submenuProps ?? {}), { ref: (element) => {
+			setSubmenuRef(element);
+		} });
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$49 = {
+	get() {
+		const aria = this[_m$];
+		const itemRef = this[_m$3];
+		const Branch = this[_m$4];
+		const state = this[_m$5];
+		const item = this[_m$6];
+		const props = this[_m$7];
+		const trigger = this[_m$8];
+		return OverlayTriggerStateContext(new _P$28(aria, itemRef, Branch, state, item, props, trigger));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$29(_p127, _p128, _p129, _p130, _p131, _p132, _p133, _p134) {
+	this[_m$] = _p127;
+	this[_m$2] = _p128;
+	this[_m$3] = _p129;
+	this[_m$4] = _p130;
+	this[_m$5] = _p131;
+	this[_m$6] = _p132;
+	this[_m$7] = _p133;
+	this[_m$8] = _p134;
+	Object.defineProperty(this, "value", _d$48);
+	Object.defineProperty(this, "children", _d$49);
+}
+_P$29.prototype = Object.prototype;
+var _d$50 = {
+	get() {
+		const aria = this[_m$];
+		const setItemRef = this[_m$2];
+		return mergeProps(merge(() => aria.submenuTriggerProps ?? {}), {
+			onAction: void 0,
+			ref: (element) => {
+				setItemRef(element);
+			}
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$51 = {
+	get() {
+		const aria = this[_m$];
+		const setSubmenuRef = this[_m$3];
+		const itemRef = this[_m$4];
+		const Branch = this[_m$5];
+		const state = this[_m$6];
+		const item = this[_m$7];
+		const props = this[_m$8];
+		const trigger = this[_m$9];
+		return MenuContext(new _P$29(aria, setSubmenuRef, itemRef, Branch, state, item, props, trigger));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$30(_p135, _p136, _p137, _p138, _p139, _p140, _p141, _p142, _p143) {
+	this[_m$] = _p135;
+	this[_m$2] = _p136;
+	this[_m$3] = _p137;
+	this[_m$4] = _p138;
+	this[_m$5] = _p139;
+	this[_m$6] = _p140;
+	this[_m$7] = _p141;
+	this[_m$8] = _p142;
+	this[_m$9] = _p143;
+	Object.defineProperty(this, "value", _d$50);
+	Object.defineProperty(this, "children", _d$51);
+}
+_P$30.prototype = Object.prototype;
+var _d$52 = {
+	get() {
+		return this[_m$].children;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$31(_p144, _p145, _p146, _p147) {
+	this[_m$] = _p144;
+	this.ref = _p145;
+	this.role = _p146;
+	this.tabindex = _p147;
+	Object.defineProperty(this, "children", _d$52);
+}
+_P$31.prototype = Object.prototype;
+var _d$53 = {
+	get() {
+		return this[_m$].isLoading;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$54 = {
+	get() {
+		const props = this[_m$];
+		const render = this[_m$2];
+		const forwardedRef = this[_m$3];
+		return dom.div(mergeProps$1(() => {
+			return filterDOMProps(props, { global: true });
+		}, render, new _P$31(render, (element) => {
+			assignRef(forwardedRef, element);
+		}, "menuitem", -1)));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$32(_p148, _p149, _p150) {
+	this[_m$] = _p148;
+	this[_m$2] = _p149;
+	this[_m$3] = _p150;
+	Object.defineProperty(this, "when", _d$53);
+	Object.defineProperty(this, "children", _d$54);
+}
+_P$32.prototype = Object.prototype;
+const MenuContext = createContext(null);
+const MenuStateContext = createContext(null);
+const RootMenuTriggerStateContext = createContext(null);
+const SelectionManagerContext = createContext(null);
+const MenuItemContext = createContext(null);
+const SubmenuContext = createContext(null);
+const SubmenuCaptureContext = createContext(false);
+function MenuTrigger(props) {
+	const [scrollRef, setScrollRef] = createSignal(null, { ownedWrite: true });
+	if (createIsHidden()) return null;
+	const state = createMenuTriggerState(props);
+	const [ref, setRef] = createSignal(null, { ownedWrite: true });
+	const aria = createMenuTrigger(mergeProps(props, { get type() {
+		return "menu";
+	} }), state, ref);
+	return MenuContext(new _P$5(aria, setScrollRef, scrollRef, ref, props, state, setRef));
+}
+function Menu(input) {
+	const [props, , setRef] = createContextProps(input, untrack(() => input.ref), MenuContext);
+	return CollectionBuilder(new _P$6(props, () => new BaseCollection(), (collection) => MenuInner({
+		props,
+		collection,
+		menuRef: setRef
+	})));
+}
+function MenuInner(input) {
+	const [props, ref, setRef] = createContextProps(untrack(() => input.props), untrack(() => input.menuRef), SelectableCollectionContext);
+	const renderer = useContext(CollectionRendererContext);
+	const Root = renderer.CollectionRoot;
+	const state = createTreeState(mergeProps(omit(props, "items", "filter"), {
+		children: void 0,
+		get collection() {
+			return props.filter ? input.collection.filter(props.filter) : input.collection;
+		}
+	}));
+	const trigger = useContext(RootMenuTriggerStateContext) ?? createMenuTriggerState({});
+	const aria = createMenu(mergeProps(omit(props, "items", "children"), {
+		get isVirtualized() {
+			return renderer.isVirtualized;
+		},
+		get onClose() {
+			return props.onClose ?? trigger.close;
+		}
+	}), state, ref);
+	const render = createRenderProps(mergeProps(props, {
+		children: void 0,
+		defaultClass: "solid2-aria-Menu",
+		values: { get isEmpty() {
+			return state.collection.size === 0;
+		} }
+	}));
+	return dom.div(mergeProps$1(() => {
+		return mergeProps(filterDOMProps(props, { global: true }), render, merge(() => aria.menuProps ?? {}));
+	}, new _P$16(props, state, Root, ref, trigger, (element) => {
+		setRef(element);
+	})));
+}
+var GroupSelectionManager = class extends SelectionManager {
+	parent;
+	constructor(parent, state) {
+		super(parent.collection, state);
+		this.parent = parent;
+	}
+	get focusedKey() {
+		return this.parent.focusedKey;
+	}
+	get isFocused() {
+		return this.parent.isFocused;
+	}
+	setFocusedKey(key, strategy) {
+		this.parent.setFocusedKey(key, strategy);
+	}
+	setFocused(value) {
+		this.parent.setFocused(value);
+	}
+	get childFocusStrategy() {
+		return this.parent.childFocusStrategy;
+	}
+};
+function MenuSectionInner(props, ref, node, defaultClass = "solid2-aria-MenuSection") {
+	const state = useContext(MenuStateContext);
+	const parent = useContext(SelectionManagerContext);
+	if (!state || !parent) throw new Error("MenuSection must be rendered in a Menu.");
+	const Branch = useContext(CollectionRendererContext).CollectionBranch;
+	const [registerHeading, heading] = createSlot();
+	const aria = createMenuSection({
+		get "aria-label"() {
+			return props["aria-label"] ?? void 0;
+		},
+		get heading() {
+			return heading();
+		}
+	});
+	const selection = createMultipleSelectionState(props);
+	const manager = createMemo(() => props.selectionMode === null || props.selectionMode === void 0 ? parent : new GroupSelectionManager(parent, selection));
+	const context = createSlottedContext(MenuItemContext);
+	return dom.section(mergeProps$1(() => {
+		return mergeProps(omit(filterDOMProps(props, { global: true }), "id"), merge(() => aria.groupProps ?? {}));
+	}, {
+		ref(r$) {
+			var _ref$ = ref;
+			typeof _ref$ === "function" || Array.isArray(_ref$) ? applyRef(_ref$, r$) : ref = r$;
+		},
+		get render() {
+			return props.render;
+		},
+		get "class"() {
+			return props.class ?? defaultClass;
+		},
+		get style() {
+			return props.style;
+		},
+		get children() {
+			return HeaderContext(new _P$20(aria, registerHeading, manager, Branch, state, node, props, context));
+		}
+	}));
+}
+const MenuSectionCollection = createBranchComponent(SectionNode, MenuSectionInner);
+const MenuItemCollection = createLeafComponent(ItemNode, (input, forwardedRef, node) => {
+	const [props, ref, setRef] = createContextProps(input, forwardedRef, MenuItemContext);
+	const context = createSlottedContext(MenuItemContext);
+	const state = useContext(MenuStateContext);
+	if (!state) throw new Error("MenuItem must be rendered in a Menu.");
+	const manager = useContext(SelectionManagerContext) ?? state.selectionManager;
+	const renderer = useContext(CollectionRendererContext);
+	const aria = createMenuItem(mergeProps(omit(props, "id", "onAction"), context ? omit(context, "id", "onAction") : void 0, {
+		get isVirtualized() {
+			return renderer.isVirtualized;
+		},
+		get key() {
+			return node.key;
+		},
+		selectionManager: manager
+	}), state, ref);
+	const hover = createHover(mergeProps(props, { get isDisabled() {
+		return aria.isDisabled;
+	} }));
+	const values = {
+		get hasSubmenu() {
+			return !!context?.["aria-haspopup"];
+		},
+		get isDisabled() {
+			return aria.isDisabled;
+		},
+		get isFocusVisible() {
+			return aria.isFocusVisible;
+		},
+		get isFocused() {
+			return aria.isFocused;
+		},
+		get isHovered() {
+			return hover.isHovered;
+		},
+		get isOpen() {
+			return context?.isOpen === true;
+		},
+		get isPressed() {
+			return aria.isPressed;
+		},
+		get isSelected() {
+			return aria.isSelected;
+		},
+		get selectionBehavior() {
+			return manager.selectionBehavior;
+		},
+		get selectionMode() {
+			return manager.selectionMode;
+		}
+	};
+	const render = createRenderProps(mergeProps(props, {
+		defaultClass: "solid2-aria-MenuItem",
+		values
+	}));
+	return dynamic(() => isTruthy(props.href) ? dom.a : dom.div)(mergeProps$1(() => {
+		return mergeProps(omit(filterDOMProps(props, { global: true }), "id", "onClick"), render, merge(() => aria.menuItemProps ?? {}), merge(() => hover.hoverProps ?? {}));
+	}, new _P$24(aria, hover, values, manager, render, (element) => {
+		setRef(element);
+	})));
+});
+var SubmenuTriggerNode = class extends CollectionNode {
+	static type = "submenutrigger";
+	filter(collection, target, filter) {
+		const item = this.firstChildKey === null || this.firstChildKey === void 0 ? null : collection.getItem(this.firstChildKey);
+		if (item && filter(item.textValue, this)) {
+			const clone = this.clone();
+			target.addDescendants(clone, collection);
+			return clone;
+		}
+		return null;
+	}
+};
+const SubmenuTriggerCollection = createBranchComponent(SubmenuTriggerNode, (props, forwardedRef, item) => {
+	const [submenuRef, setSubmenuRef] = createSignal(null, { ownedWrite: true });
+	const state = useContext(MenuStateContext);
+	const root = useContext(RootMenuTriggerStateContext);
+	const parent = useContext(SubmenuContext);
+	if (!state || !root || !parent) throw new Error("SubmenuTrigger must be rendered in a Menu.");
+	const Branch = useContext(CollectionRendererContext).CollectionBranch;
+	const trigger = createSubmenuTriggerState({ triggerKey: item.key }, root);
+	const [itemRef, setItemRef] = createSignal(null, { ownedWrite: true });
+	const aria = createSubmenuTrigger(mergeProps(props, parent, { submenuRef }), trigger, itemRef);
+	return MenuItemContext(new _P$30(aria, setItemRef, setSubmenuRef, itemRef, Branch, state, item, props, trigger));
+}, (props) => untrack(() => props.children[0]));
+const MenuLoadMoreItemCollection = createLeafComponent(LoaderNode, (props, forwardedRef, _node) => {
+	var _v$3;
+	const state = useContext(MenuStateContext);
+	if (!state) throw new Error("MenuLoadMoreItem must be rendered in a Menu.");
+	const [sentinel, setSentinel] = createSignal(null, { ownedWrite: true });
+	createLoadMoreSentinel(mergeProps(props, { get collection() {
+		return state.collection;
+	} }), sentinel);
+	const render = createRenderProps(mergeProps(props, {
+		defaultClass: "solid2-aria-MenuLoadingIndicator",
+		values: void 0
+	}));
+	return [(_v$3 = ssrHydrationKey(), ssr(_tmpl$2, _v$3, ssrStyleProperties("height:", 0, "position:", "relative", "width:", 0), ssrStyleProperties("height:", "1px", "position:", "absolute", "width:", "1px"))), Show(new _P$32(props, render, forwardedRef))];
+});
+function MenuSection(props) {
+	return MenuSectionCollection(mergeProps$1(props, { ref: (element) => {
+		assignRef(untrack(() => props.ref), element);
+	} }));
+}
+function MenuItem(props) {
+	if (useContext(SubmenuCaptureContext) && !createIsHidden()) return null;
+	return MenuItemCollection(mergeProps$1(props, { ref: (element) => {
+		assignRef(untrack(() => props.ref), element);
+	} }));
+}
+function SubmenuTrigger(props) {
+	return SubmenuTriggerCollection(mergeProps$1(props, {
+		renderPopover: () => props.children[1],
+		ref: (element) => {
+			assignRef(untrack(() => props.ref), element);
+		}
+	}));
+}
+function MenuLoadMoreItem(props) {
+	return MenuLoadMoreItemCollection(mergeProps$1(props, { ref: (element) => {
+		assignRef(untrack(() => props.ref), element);
+	} }));
+}
+export { Menu, MenuContext, MenuItem, MenuLoadMoreItem, MenuSection, MenuStateContext, MenuTrigger, RootMenuTriggerStateContext, SubmenuTrigger };
+
+//# sourceMappingURL=menu.js.map