bits-ui 2.8.8 → 2.8.10

package/dist/bits/context-menu/components/context-menu-content.svelte

@@ -41,6 +41,12 @@
 	function handleInteractOutside(e: PointerEvent) {
 		onInteractOutside(e);
 		if (e.defaultPrevented) return;
+
+		// don't close if the interaction is with a submenu content or items
+		if (e.target && e.target instanceof Element) {
+			const subContentSelector = `[${contentState.parentMenu.root.getBitsAttr("sub-content")}]`;
+			if (e.target.closest(subContentSelector)) return;
+		}
 		contentState.parentMenu.onClose();
 	}
 

package/dist/bits/dropdown-menu/components/dropdown-menu-content.svelte

@@ -41,6 +41,12 @@
 		if (e.defaultPrevented) return;
 		onInteractOutside(e);
 		if (e.defaultPrevented) return;
+
+		// don't close if the interaction is with a submenu content or items
+		if (e.target && e.target instanceof Element) {
+			const subContentSelector = `[${contentState.parentMenu.root.getBitsAttr("sub-content")}]`;
+			if (e.target.closest(subContentSelector)) return;
+		}
 		contentState.parentMenu.onClose();
 	}
 	function handleEscapeKeydown(e: KeyboardEvent) {

package/dist/bits/menu/components/menu-content.svelte

@@ -42,6 +42,11 @@
 	function handleInteractOutside(e: PointerEvent) {
 		onInteractOutside(e);
 		if (e.defaultPrevented) return;
+		// don't close if the interaction is with a submenu content or items
+		if (e.target && e.target instanceof Element) {
+			const subContentSelector = `[${contentState.parentMenu.root.getBitsAttr("sub-content")}]`;
+			if (e.target.closest(subContentSelector)) return;
+		}
 		contentState.parentMenu.onClose();
 	}
 

package/dist/bits/menu/menu.svelte.js

@@ -423,15 +423,13 @@ export class MenuItemState {
             return;
         const selectEvent = new CustomEvent("menuitemselect", { bubbles: true, cancelable: true });
         this.opts.onSelect.current(selectEvent);
-        afterTick(() => {
-            if (selectEvent.defaultPrevented) {
-                this.item.content.parentMenu.root.isUsingKeyboard.current = false;
-                return;
-            }
-            if (this.opts.closeOnSelect.current) {
-                this.item.content.parentMenu.root.opts.onClose();
-            }
-        });
+        if (selectEvent.defaultPrevented) {
+            this.item.content.parentMenu.root.isUsingKeyboard.current = false;
+            return;
+        }
+        if (this.opts.closeOnSelect.current) {
+            this.item.content.parentMenu.root.opts.onClose();
+        }
     }
     onkeydown(e) {
         const isTypingAhead = this.item.content.search !== "";

package/dist/bits/navigation-menu/navigation-menu.svelte.d.ts

@@ -10,7 +10,6 @@ import { type Direction, type Orientation } from "../../shared/index.js";
 import type { BitsFocusEvent, BitsKeyboardEvent, BitsMouseEvent, BitsPointerEvent, RefAttachment } from "../../internal/types.js";
 import type { FocusEventHandler, KeyboardEventHandler, MouseEventHandler, PointerEventHandler } from "svelte/elements";
 import { RovingFocusGroup } from "../../internal/roving-focus-group.js";
-declare const navigationMenuAttrs: import("../../internal/attrs.js").CreateBitsAttrsReturn<readonly ["root", "sub", "item", "list", "trigger", "content", "link", "viewport", "menu", "indicator"]>;
 export declare const NavigationMenuItemContext: Context<NavigationMenuItemState>;
 interface NavigationMenuProviderStateOpts extends ReadableBoxedValues<{
     dir: Direction;
@@ -122,6 +121,7 @@ export declare class NavigationMenuItemState {
     #private;
     static create(opts: NavigationMenuItemStateOpts): NavigationMenuItemState;
     readonly opts: NavigationMenuItemStateOpts;
+    readonly attachment: RefAttachment;
     readonly listContext: NavigationMenuListState;
     contentNode: HTMLElement | null;
     triggerNode: HTMLElement | null;
@@ -142,7 +142,6 @@ export declare class NavigationMenuItemState {
     onRootContentClose: () => void;
     onContentFocusOutside: () => void;
     props: {
-        readonly [navigationMenuAttrs.item]: "";
         readonly id: string;
     };
 }

package/dist/bits/navigation-menu/navigation-menu.svelte.js

@@ -248,6 +248,7 @@ export class NavigationMenuItemState {
         return NavigationMenuItemContext.set(new NavigationMenuItemState(opts, NavigationMenuListContext.get()));
     }
     opts;
+    attachment;
     listContext;
     contentNode = $state(null);
     triggerNode = $state(null);
@@ -264,6 +265,7 @@ export class NavigationMenuItemState {
         this.opts = opts;
         this.listContext = listContext;
         this.domContext = new DOMContext(opts.ref);
+        this.attachment = attachRef(this.opts.ref);
     }
     #handleContentEntry = (side = "start") => {
         if (!this.contentNode)
@@ -287,6 +289,7 @@ export class NavigationMenuItemState {
     props = $derived.by(() => ({
         id: this.opts.id.current,
         [navigationMenuAttrs.item]: "",
+        ...this.attachment,
     }));
 }
 export class NavigationMenuTriggerState {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bits-ui",
-  "version": "2.8.8",
+  "version": "2.8.10",
   "license": "MIT",
   "repository": "github:huntabyte/bits-ui",
   "funding": "https://github.com/sponsors/huntabyte",
@@ -41,8 +41,8 @@
     "@floating-ui/core": "^1.7.1",
     "@floating-ui/dom": "^1.7.1",
     "esm-env": "^1.1.2",
-    "runed": "^0.28.0",
-    "svelte-toolbelt": "^0.9.2",
+    "runed": "^0.29.1",
+    "svelte-toolbelt": "^0.9.3",
     "tabbable": "^6.2.0"
   },
   "peerDependencies": {