@spectral_labs/ui 1.5.1 → 1.5.3

package/dist/internal/menu-context/menu-context.svelte.js

@@ -1,8 +1,67 @@
 import { getContext, setContext } from 'svelte';
+import { SvelteSet } from 'svelte/reactivity';
 const MENU_KEY = Symbol('sp-menu');
+/**
+ * Builds a `MenuContext` with a per-menu submenu registry.
+ * SSR-safe: no DOM access happens here — only event handlers touch the DOM.
+ */
+export function createMenuContext(options) {
+    const subs = new SvelteSet();
+    return {
+        close: options.close,
+        registerSub(sub) {
+            subs.add(sub);
+            return () => {
+                subs.delete(sub);
+            };
+        },
+        onItemEnter(event) {
+            if (subs.size === 0)
+                return;
+            const point = { x: event.clientX, y: event.clientY };
+            for (const sub of subs) {
+                if (sub.ownsTarget(event.target))
+                    continue;
+                if (sub.isPointerInGrace(point))
+                    continue;
+                sub.closeSub();
+            }
+        },
+        closeOtherSubs(keep) {
+            for (const sub of subs) {
+                if (sub !== keep)
+                    sub.closeSub();
+            }
+        },
+    };
+}
 export function setMenuContext(ctx) {
     setContext(MENU_KEY, ctx);
 }
 export function getMenuContext() {
     return getContext(MENU_KEY);
 }
+/** Class hook of the inline submenu content (shared by every menu family). */
+export const MENU_SUB_CONTENT_SELECTOR = '.sp-dropdown-menu-sub-content';
+/**
+ * Whether `candidate` belongs to `container`'s own menu level.
+ *
+ * Submenu content renders INLINE inside the parent menu content (no portal),
+ * so a naive `querySelectorAll('[data-roving-focus-item]')` on the parent
+ * leaks the submenu's items into the parent's roving/typeahead collections.
+ * A candidate is "own level" when its closest sub-content ancestor is either
+ * absent, the container itself (items directly inside a sub-content), or
+ * outside the container.
+ */
+export function isOwnLevelMenuItem(container, candidate) {
+    const subAncestor = candidate.closest(MENU_SUB_CONTENT_SELECTOR);
+    return subAncestor === null || subAncestor === container || !container.contains(subAncestor);
+}
+/**
+ * Returns the enabled roving candidates that belong to `container`'s own
+ * menu level (excluding rows nested in an open submenu). Used for roving
+ * focus, typeahead and open-autofocus in every menu content.
+ */
+export function getOwnLevelMenuItems(container) {
+    return Array.from(container.querySelectorAll('[data-roving-focus-item]:not([data-disabled])')).filter((el) => isOwnLevelMenuItem(container, el));
+}

package/dist/internal/roving-focus/roving-focus.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"roving-focus.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/internal/roving-focus/roving-focus.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAKlD;;;;;GAKG;AACH,qBAAa,gBAAgB;;gBAGf,KAAK,EAAE,gBAAgB;IAInC;;;OAGG;IACH,aAAa,CAAC,SAAS,EAAE,WAAW,GAAG,WAAW,EAAE;IAMpD;;;;;;;OAOG;IACH,aAAa,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,aAAa,GAAG,IAAI;IA2DjE;;;;;;OAMG;IACH,WAAW,CAAC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC;CAOpE"}
+{"version":3,"file":"roving-focus.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/internal/roving-focus/roving-focus.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAKlD;;;;;GAKG;AACH,qBAAa,gBAAgB;;gBAGf,KAAK,EAAE,gBAAgB;IAInC;;;OAGG;IACH,aAAa,CAAC,SAAS,EAAE,WAAW,GAAG,WAAW,EAAE;IAOpD;;;;;;;OAOG;IACH,aAAa,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,aAAa,GAAG,IAAI;IA2DjE;;;;;;OAMG;IACH,WAAW,CAAC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC;CAOpE"}

package/dist/internal/roving-focus/roving-focus.svelte.js

@@ -17,8 +17,9 @@ export class RovingFocusGroup {
      */
     getCandidates(container) {
         const selector = this.#props.candidateSelector ?? DEFAULT_CANDIDATE_SELECTOR;
+        const filter = this.#props.candidateFilter;
         const all = Array.from(container.querySelectorAll(selector));
-        return all.filter((el) => !el.hasAttribute('data-disabled'));
+        return all.filter((el) => !el.hasAttribute('data-disabled') && (filter?.(el) ?? true));
     }
     /**
      * Handles keyboard navigation within the roving focus group.

package/dist/internal/roving-focus/types.d.ts

@@ -8,5 +8,11 @@ export interface RovingFocusProps {
     loop?: boolean;
     /** CSS selector or data attribute for candidate elements. */
     candidateSelector?: string;
+    /**
+     * Optional predicate applied on top of `candidateSelector`.
+     * Return `false` to exclude a matched element from the collection
+     * (e.g. menu contents exclude rows nested in an open submenu).
+     */
+    candidateFilter?: (candidate: HTMLElement) => boolean;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/internal/roving-focus/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/internal/roving-focus/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAE/D,MAAM,WAAW,gBAAgB;IAC/B,oCAAoC;IACpC,WAAW,EAAE,WAAW,CAAA;IACxB,sBAAsB;IACtB,GAAG,CAAC,EAAE,SAAS,CAAA;IACf,mCAAmC;IACnC,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,6DAA6D;IAC7D,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/internal/roving-focus/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAE/D,MAAM,WAAW,gBAAgB;IAC/B,oCAAoC;IACpC,WAAW,EAAE,WAAW,CAAA;IACxB,sBAAsB;IACtB,GAAG,CAAC,EAAE,SAAS,CAAA;IACf,mCAAmC;IACnC,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,6DAA6D;IAC7D,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE,WAAW,KAAK,OAAO,CAAA;CACtD"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@spectral_labs/ui",
   "type": "module",
-  "version": "1.5.1",
+  "version": "1.5.3",
   "publishConfig": {
     "registry": "https://registry.npmjs.org",
     "access": "public"