bits-ui 1.0.0-next.6 → 1.0.0-next.61

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

@@ -1,4 +1,4 @@
-import type { ViewportProps } from "../index.js";
+import type { NavigationMenuViewportProps } from "../types.js";
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
@@ -12,7 +12,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const NavigationMenuViewport: $$__sveltets_2_IsomorphicComponent<ViewportProps, {
+declare const NavigationMenuViewport: $$__sveltets_2_IsomorphicComponent<NavigationMenuViewportProps, {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, "ref">;
 type NavigationMenuViewport = InstanceType<typeof NavigationMenuViewport>;

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

@@ -1,10 +1,9 @@
 <script lang="ts">
-	import { box } from "svelte-toolbelt";
-	import type { RootProps } from "../index.js";
+	import { box, mergeProps } from "svelte-toolbelt";
+	import type { NavigationMenuRootProps } from "../types.js";
 	import { useNavigationMenuRoot } from "../navigation-menu.svelte.js";
-	import { useId } from "../../../internal/useId.js";
-	import { noop } from "../../../internal/callbacks.js";
-	import { mergeProps } from "../../../internal/mergeProps.js";
+	import { useId } from "../../../internal/use-id.js";
+	import { noop } from "../../../internal/noop.js";
 
 	let {
 		child,
@@ -19,7 +18,7 @@
 		orientation = "horizontal",
 		controlledValue = false,
 		...restProps
-	}: RootProps = $props();
+	}: NavigationMenuRootProps = $props();
 
 	const rootState = useNavigationMenuRoot({
 		id: box.with(() => id),

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

@@ -1,4 +1,4 @@
-import type { RootProps } from "../index.js";
+import type { NavigationMenuRootProps } from "../types.js";
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
@@ -12,7 +12,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const NavigationMenu: $$__sveltets_2_IsomorphicComponent<RootProps, {
+declare const NavigationMenu: $$__sveltets_2_IsomorphicComponent<NavigationMenuRootProps, {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, "value" | "ref">;
 type NavigationMenu = InstanceType<typeof NavigationMenu>;

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

@@ -0,0 +1,9 @@
+export { default as Root } from "./components/navigation-menu.svelte";
+export { default as Content } from "./components/navigation-menu-content.svelte";
+export { default as Indicator } from "./components/navigation-menu-indicator.svelte";
+export { default as Item } from "./components/navigation-menu-item.svelte";
+export { default as Link } from "./components/navigation-menu-link.svelte";
+export { default as List } from "./components/navigation-menu-list.svelte";
+export { default as Trigger } from "./components/navigation-menu-trigger.svelte";
+export { default as Viewport } from "./components/navigation-menu-viewport.svelte";
+export type { NavigationMenuRootProps as RootProps, NavigationMenuItemProps as ItemProps, NavigationMenuListProps as ListProps, NavigationMenuTriggerProps as TriggerProps, NavigationMenuViewportProps as ViewportProps, NavigationMenuIndicatorProps as IndicatorProps, NavigationMenuContentProps as ContentProps, NavigationMenuLinkProps as LinkProps, } from "./types.js";

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

@@ -0,0 +1,8 @@
+export { default as Root } from "./components/navigation-menu.svelte";
+export { default as Content } from "./components/navigation-menu-content.svelte";
+export { default as Indicator } from "./components/navigation-menu-indicator.svelte";
+export { default as Item } from "./components/navigation-menu-item.svelte";
+export { default as Link } from "./components/navigation-menu-link.svelte";
+export { default as List } from "./components/navigation-menu-list.svelte";
+export { default as Trigger } from "./components/navigation-menu-trigger.svelte";
+export { default as Viewport } from "./components/navigation-menu-viewport.svelte";

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

@@ -1,9 +1 @@
-export { default as Root } from "./components/navigation-menu.svelte";
-export { default as Content } from "./components/navigation-menu-content.svelte";
-export { default as Indicator } from "./components/navigation-menu-indicator.svelte";
-export { default as Item } from "./components/navigation-menu-item.svelte";
-export { default as Link } from "./components/navigation-menu-link.svelte";
-export { default as List } from "./components/navigation-menu-list.svelte";
-export { default as Trigger } from "./components/navigation-menu-trigger.svelte";
-export { default as Viewport } from "./components/navigation-menu-viewport.svelte";
-export type { NavigationMenuRootProps as RootProps, NavigationMenuItemProps as ItemProps, NavigationMenuListProps as ListProps, NavigationMenuTriggerProps as TriggerProps, NavigationMenuViewportProps as ViewportProps, NavigationMenuIndicatorProps as IndicatorProps, NavigationMenuContentProps as ContentProps, NavigationMenuLinkProps as LinkProps, } from "./types.js";
+export * as NavigationMenu from "./exports.js";

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

@@ -1,8 +1 @@
-export { default as Root } from "./components/navigation-menu.svelte";
-export { default as Content } from "./components/navigation-menu-content.svelte";
-export { default as Indicator } from "./components/navigation-menu-indicator.svelte";
-export { default as Item } from "./components/navigation-menu-item.svelte";
-export { default as Link } from "./components/navigation-menu-link.svelte";
-export { default as List } from "./components/navigation-menu-list.svelte";
-export { default as Trigger } from "./components/navigation-menu-trigger.svelte";
-export { default as Viewport } from "./components/navigation-menu-viewport.svelte";
+export * as NavigationMenu from "./exports.js";

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

@@ -2,8 +2,8 @@ import { Previous } from "runed";
 import type { ReadableBoxedValues, WritableBoxedValues } from "../../internal/box.svelte.js";
 import type { Direction, Orientation } from "../../shared/index.js";
 import type { ElementRef, WithRefProps } from "../../internal/types.js";
-import { noop } from "../../internal/callbacks.js";
-import { useRovingFocus } from "../../internal/useRovingFocus.svelte.js";
+import { noop } from "../../internal/noop.js";
+import { useRovingFocus } from "../../internal/use-roving-focus.svelte.js";
 type NavigationMenuRootStateProps = ReadableBoxedValues<{
     id: string;
     delayDuration: number;
@@ -46,7 +46,6 @@ declare class NavigationMenuRootState {
         dir: Direction;
         "data-navigation-menu-root": string;
     };
-    createMenu(props: NavigationMenuMenuStateProps): NavigationMenuMenuState;
 }
 type NavigationMenuMenuStateProps = ReadableBoxedValues<{
     rootNavigationId: string;
@@ -86,10 +85,6 @@ declare class NavigationMenuMenuState {
     registerTrigger: (ref: ElementRef) => void;
     deRegisterTrigger: (ref: ElementRef) => void;
     getTriggerNodes: () => HTMLElement[];
-    createList(props: NavigationMenuListStateProps): NavigationMenuListState;
-    createIndicator(props: NavigationMenuIndicatorStateProps): NavigationMenuIndicatorState;
-    createViewport(props: NavigationMenuViewportStateProps): NavigationMenuViewportState;
-    createSubMenu(props: NavigationMenuSubStateProps): NavigationMenuSubState;
 }
 type NavigationMenuSubStateProps = ReadableBoxedValues<{
     id: string;
@@ -139,7 +134,7 @@ type NavigationMenuListStateProps = ReadableBoxedValues<{
 }>;
 declare class NavigationMenuListState {
     #private;
-    private menu;
+    readonly menu: NavigationMenuMenuState | NavigationMenuSubState;
     indicatorTrackRef: NavigationMenuListStateProps["indicatorTrackRef"];
     indicatorTrackId: import("svelte-toolbelt").WritableBox<string>;
     rovingFocusGroup: ReturnType<typeof useRovingFocus>;
@@ -182,9 +177,6 @@ declare class NavigationMenuItemState {
         readonly id: string;
         readonly "data-navigation-menu-item": "";
     };
-    createTrigger(props: NavigationMenuTriggerStateProps): NavigationMenuTriggerState;
-    createContent(props: NavigationMenuContentStateProps): NavigationMenuContentState;
-    createLink(props: NavigationMenuLinkStateProps): NavigationMenuLinkState;
 }
 type NavigationMenuTriggerStateProps = ReadableBoxedValues<{
     id: string;
@@ -208,7 +200,7 @@ declare class NavigationMenuTriggerState {
         readonly disabled: true | undefined;
         readonly "data-disabled": "" | undefined;
         readonly "data-state": "open" | "closed";
-        readonly "aria-expanded": "false" | "true";
+        readonly "aria-expanded": "true" | "false";
         readonly "aria-controls": string | undefined;
         readonly "data-value": string;
         readonly onpointerenter: () => void;
@@ -306,7 +298,6 @@ declare class NavigationMenuContentState {
     onFocusOutside: (e: Event) => void;
     onInteractOutside: (e: Event) => void;
     onEscapeKeydown: (e: KeyboardEvent) => void;
-    createLink(props: NavigationMenuLinkStateProps): NavigationMenuLinkState;
     props: {
         readonly id: string;
         readonly "aria-labelledby": string | undefined;
@@ -352,7 +343,6 @@ declare class NavigationMenuViewportState {
     };
 }
 export declare function useNavigationMenuRoot(props: NavigationMenuRootStateProps): NavigationMenuRootState;
-export declare function useNavigationMenuSub(props: NavigationMenuSubStateProps): NavigationMenuSubState;
 export declare function useNavigationMenuList(props: NavigationMenuListStateProps): NavigationMenuListState;
 export declare function useNavigationMenuItem(props: NavigationMenuItemStateProps): NavigationMenuItemState;
 export declare function useNavigationMenuTrigger(props: NavigationMenuTriggerStateProps): NavigationMenuTriggerState;

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

@@ -1,17 +1,15 @@
 import { untrack } from "svelte";
-import { box } from "svelte-toolbelt";
+import { afterTick, box, useRefById } from "svelte-toolbelt";
 import { Previous } from "runed";
 import { getTabbableCandidates } from "../../internal/focus.js";
 import { getAriaExpanded, getAriaHidden, getDataDisabled, getDataOpenClosed, getDataOrientation, getDisabled, } from "../../internal/attrs.js";
-import { createContext } from "../../internal/createContext.js";
-import { useId } from "../../internal/useId.js";
+import { createContext } from "../../internal/create-context.js";
+import { useId } from "../../internal/use-id.js";
 import { kbd } from "../../internal/kbd.js";
-import { useArrowNavigation } from "../../internal/useArrowNavigation.js";
-import { boxAutoReset } from "../../internal/boxAutoReset.svelte.js";
-import { useRefById } from "../../internal/useRefById.svelte.js";
-import { afterTick } from "../../internal/afterTick.js";
-import { noop } from "../../internal/callbacks.js";
-import { useRovingFocus } from "../../internal/useRovingFocus.svelte.js";
+import { useArrowNavigation } from "../../internal/use-arrow-navigation.js";
+import { boxAutoReset } from "../../internal/box-auto-reset.svelte.js";
+import { noop } from "../../internal/noop.js";
+import { useRovingFocus } from "../../internal/use-roving-focus.svelte.js";
 const [setNavigationMenuRootContext] = createContext("NavigationMenu.Root");
 const [setNavigationMenuMenuContext, getNavigationMenuMenuContext] = createContext("NavigationMenu.Root or NavigationMenu.Sub");
 const [setNavigationMenuListContext, getNavigationMenuListContext] = createContext("NavigationMenu.List");
@@ -137,9 +135,6 @@ class NavigationMenuRootState {
         dir: this.dir.current,
         [ROOT_ATTR]: "",
     }));
-    createMenu(props) {
-        return new NavigationMenuMenuState(props, this);
-    }
 }
 class NavigationMenuMenuState {
     isRoot = $state(false);
@@ -185,18 +180,6 @@ class NavigationMenuMenuState {
             .map((ref) => ref.current)
             .filter((node) => Boolean(node));
     };
-    createList(props) {
-        return new NavigationMenuListState(props, this);
-    }
-    createIndicator(props) {
-        return new NavigationMenuIndicatorState(props, this);
-    }
-    createViewport(props) {
-        return new NavigationMenuViewportState(props, this);
-    }
-    createSubMenu(props) {
-        return new NavigationMenuSubState(props, this.root);
-    }
 }
 class NavigationMenuSubState {
     id;
@@ -292,7 +275,7 @@ class NavigationMenuListState {
             onRefChange: (node) => {
                 this.menu.indicatorTrackNode = node;
             },
-            condition: () => Boolean(this.menu.root.value.current),
+            deps: () => Boolean(this.menu.root.value.current),
         });
     }
     indicatorTrackProps = $derived.by(() => ({
@@ -364,15 +347,6 @@ class NavigationMenuItemState {
         id: this.id.current,
         [ITEM_ATTR]: "",
     }));
-    createTrigger(props) {
-        return new NavigationMenuTriggerState(props, this);
-    }
-    createContent(props) {
-        return new NavigationMenuContentState(props, this);
-    }
-    createLink(props) {
-        return new NavigationMenuLinkState(props, this);
-    }
 }
 class NavigationMenuTriggerState {
     #id;
@@ -404,7 +378,7 @@ class NavigationMenuTriggerState {
             onRefChange: (node) => {
                 this.item.focusProxyNode = node;
             },
-            condition: () => this.focusProxyMounted.current,
+            deps: () => this.focusProxyMounted.current,
         });
         $effect(() => {
             this.menu.registerTrigger(this.#ref);
@@ -623,7 +597,7 @@ class NavigationMenuContentState {
             onRefChange: (node) => {
                 this.item.contentNode = node;
             },
-            condition: () => this.isMounted.current,
+            deps: () => this.isMounted.current,
         });
         $effect(() => {
             const items = this.menu.getTriggerNodes();
@@ -723,9 +697,6 @@ class NavigationMenuContentState {
         });
         newSelectedElement?.focus();
     };
-    createLink(props) {
-        return new NavigationMenuLinkState(props, this.item, this);
-    }
     props = $derived.by(() => ({
         id: this.id.current,
         "aria-labelledby": this.item.triggerNode?.id ?? undefined,
@@ -757,7 +728,7 @@ class NavigationMenuViewportState {
             onRefChange: (node) => {
                 this.menu.viewportNode = node;
             },
-            condition: () => this.open,
+            deps: () => this.open,
         });
         $effect(() => {
             this.open;
@@ -807,7 +778,7 @@ class NavigationMenuViewportState {
 }
 export function useNavigationMenuRoot(props) {
     const rootState = new NavigationMenuRootState(props);
-    const menuState = rootState.createMenu({
+    const menuState = new NavigationMenuMenuState({
         rootNavigationId: rootState.id,
         dir: rootState.dir,
         orientation: rootState.orientation,
@@ -820,43 +791,36 @@ export function useNavigationMenuRoot(props) {
         onContentLeave: rootState.onContentLeave,
         onTriggerLeave: rootState.onTriggerLeave,
         previousValue: rootState.previousValue,
-    });
+    }, rootState);
     setNavigationMenuMenuContext(menuState);
     return setNavigationMenuRootContext(rootState);
 }
-export function useNavigationMenuSub(props) {
-    const parentMenu = getNavigationMenuMenuContext();
-    if (parentMenu instanceof NavigationMenuMenuState) {
-        return setNavigationMenuMenuContext(parentMenu.createSubMenu(props));
-    }
-    throw new Error("useNavigationMenuSub must be used within a NavigationMenuMenu");
-}
 export function useNavigationMenuList(props) {
     const menuState = getNavigationMenuMenuContext();
-    return setNavigationMenuListContext(menuState.createList(props));
+    return setNavigationMenuListContext(new NavigationMenuListState(props, menuState));
 }
 export function useNavigationMenuItem(props) {
     const listState = getNavigationMenuListContext();
-    return setNavigationMenuItemContext(listState.createItem(props));
+    return setNavigationMenuItemContext(new NavigationMenuItemState(props, listState, listState.menu));
 }
 export function useNavigationMenuTrigger(props) {
-    return getNavigationMenuItemContext().createTrigger(props);
+    return new NavigationMenuTriggerState(props, getNavigationMenuItemContext());
 }
 export function useNavigationMenuContent(props) {
-    return setNavigationMenuContentContext(getNavigationMenuItemContext().createContent(props));
+    return setNavigationMenuContentContext(new NavigationMenuContentState(props, getNavigationMenuItemContext()));
 }
 export function useNavigationMenuViewport(props) {
-    return getNavigationMenuMenuContext().createViewport(props);
+    return new NavigationMenuViewportState(props, getNavigationMenuMenuContext());
 }
 export function useNavigationMenuIndicator(props) {
-    return getNavigationMenuMenuContext().createIndicator(props);
+    return new NavigationMenuIndicatorState(props, getNavigationMenuMenuContext());
 }
 export function useNavigationMenuLink(props) {
     const content = getNavigationMenuContentContext(null);
     if (content) {
-        return content.createLink(props);
+        return new NavigationMenuLinkState(props, content.item, content);
     }
-    return getNavigationMenuItemContext().createLink(props);
+    return new NavigationMenuLinkState(props, getNavigationMenuItemContext());
 }
 /// Utils
 function focusFirst(candidates) {

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

@@ -1,6 +1,5 @@
-import type { InteractOutsideEvent } from "../utilities/dismissible-layer/types.js";
 import type { OnChangeFn, WithChild, Without } from "../../internal/types.js";
-import type { PrimitiveAnchorAttributes, PrimitiveButtonAttributes, PrimitiveDivAttributes, PrimitiveElementAttributes, PrimitiveLiAttributes, PrimitiveUListAttributes } from "../../shared/attributes.js";
+import type { BitsPrimitiveAnchorAttributes, BitsPrimitiveButtonAttributes, BitsPrimitiveDivAttributes, BitsPrimitiveElementAttributes, BitsPrimitiveLiAttributes, BitsPrimitiveUListAttributes } from "../../shared/attributes.js";
 import type { Direction, Orientation } from "../../shared/index.js";
 export type NavigationMenuRootPropsWithoutHTML = WithChild<{
     /**
@@ -42,7 +41,7 @@ export type NavigationMenuRootPropsWithoutHTML = WithChild<{
      */
     orientation?: Orientation;
 }>;
-export type NavigationMenuRootProps = NavigationMenuRootPropsWithoutHTML & Without<PrimitiveElementAttributes, NavigationMenuRootPropsWithoutHTML>;
+export type NavigationMenuRootProps = NavigationMenuRootPropsWithoutHTML & Without<BitsPrimitiveElementAttributes, NavigationMenuRootPropsWithoutHTML>;
 export type NavigationMenuSubPropsWithoutHTML = WithChild<{
     /**
      * The value of the currently open menu item within the menu.
@@ -59,16 +58,16 @@ export type NavigationMenuSubPropsWithoutHTML = WithChild<{
      */
     orientation?: Orientation;
 }>;
-export type NavigationMenuSubProps = NavigationMenuSubPropsWithoutHTML & Without<PrimitiveDivAttributes, NavigationMenuSubPropsWithoutHTML>;
+export type NavigationMenuSubProps = NavigationMenuSubPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, NavigationMenuSubPropsWithoutHTML>;
 export type NavigationMenuListPropsWithoutHTML = WithChild;
-export type NavigationMenuListProps = NavigationMenuListPropsWithoutHTML & Without<PrimitiveUListAttributes, NavigationMenuListPropsWithoutHTML>;
+export type NavigationMenuListProps = NavigationMenuListPropsWithoutHTML & Without<BitsPrimitiveUListAttributes, NavigationMenuListPropsWithoutHTML>;
 export type NavigationMenuItemPropsWithoutHTML = WithChild<{
     /**
      * The value of the menu item.
      */
     value?: string;
 }>;
-export type NavigationMenuItemProps = NavigationMenuItemPropsWithoutHTML & Without<PrimitiveLiAttributes, NavigationMenuItemPropsWithoutHTML>;
+export type NavigationMenuItemProps = NavigationMenuItemPropsWithoutHTML & Without<BitsPrimitiveLiAttributes, NavigationMenuItemPropsWithoutHTML>;
 export type NavigationMenuTriggerPropsWithoutHTML = WithChild<{
     /**
      * Whether the trigger is disabled.
@@ -76,14 +75,14 @@ export type NavigationMenuTriggerPropsWithoutHTML = WithChild<{
      */
     disabled?: boolean | null | undefined;
 }>;
-export type NavigationMenuTriggerProps = NavigationMenuTriggerPropsWithoutHTML & Without<PrimitiveButtonAttributes, NavigationMenuTriggerPropsWithoutHTML>;
+export type NavigationMenuTriggerProps = NavigationMenuTriggerPropsWithoutHTML & Without<BitsPrimitiveButtonAttributes, NavigationMenuTriggerPropsWithoutHTML>;
 export type NavigationMenuContentPropsWithoutHTML = WithChild<{
     /**
      * Callback fired when an interaction occurs outside the content.
      * Default behavior can be prevented with `event.preventDefault()`
      *
      */
-    onInteractOutside?: (event: InteractOutsideEvent) => void;
+    onInteractOutside?: (event: PointerEvent) => void;
     /**
      * Callback fired when a focus event occurs outside the content.
      * Default behavior can be prevented with `event.preventDefault()`
@@ -103,7 +102,7 @@ export type NavigationMenuContentPropsWithoutHTML = WithChild<{
      */
     forceMount?: boolean;
 }>;
-export type NavigationMenuContentProps = NavigationMenuContentPropsWithoutHTML & Without<PrimitiveDivAttributes, NavigationMenuContentPropsWithoutHTML>;
+export type NavigationMenuContentProps = NavigationMenuContentPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, NavigationMenuContentPropsWithoutHTML>;
 export type NavigationMenuLinkPropsWithoutHTML = WithChild<{
     /**
      * Whether the link is the current active page
@@ -115,7 +114,7 @@ export type NavigationMenuLinkPropsWithoutHTML = WithChild<{
      */
     onSelect?: (e: Event) => void;
 }>;
-export type NavigationMenuLinkProps = NavigationMenuLinkPropsWithoutHTML & Without<PrimitiveAnchorAttributes, NavigationMenuLinkPropsWithoutHTML>;
+export type NavigationMenuLinkProps = NavigationMenuLinkPropsWithoutHTML & Without<BitsPrimitiveAnchorAttributes, NavigationMenuLinkPropsWithoutHTML>;
 export type NavigationMenuIndicatorPropsWithoutHTML = WithChild<{
     /**
      * Whether to forcefully mount the content, regardless of the open state.
@@ -126,7 +125,7 @@ export type NavigationMenuIndicatorPropsWithoutHTML = WithChild<{
      */
     forceMount?: boolean;
 }>;
-export type NavigationMenuIndicatorProps = NavigationMenuIndicatorPropsWithoutHTML & Without<PrimitiveDivAttributes, NavigationMenuIndicatorPropsWithoutHTML>;
+export type NavigationMenuIndicatorProps = NavigationMenuIndicatorPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, NavigationMenuIndicatorPropsWithoutHTML>;
 export type NavigationMenuViewportPropsWithoutHTML = WithChild<{
     /**
      * Whether to forcefully mount the content, regardless of the open state.
@@ -137,4 +136,4 @@ export type NavigationMenuViewportPropsWithoutHTML = WithChild<{
      */
     forceMount?: boolean;
 }>;
-export type NavigationMenuViewportProps = NavigationMenuViewportPropsWithoutHTML & Without<PrimitiveDivAttributes, NavigationMenuViewportPropsWithoutHTML>;
+export type NavigationMenuViewportProps = NavigationMenuViewportPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, NavigationMenuViewportPropsWithoutHTML>;

package/dist/bits/pagination/components/pagination-next-button.svelte

@@ -1,9 +1,8 @@
 <script lang="ts">
-	import { box } from "svelte-toolbelt";
-	import type { NextButtonProps } from "../index.js";
+	import { box, mergeProps } from "svelte-toolbelt";
+	import type { PaginationNextButtonProps } from "../types.js";
 	import { usePaginationButton } from "../pagination.svelte.js";
-	import { mergeProps } from "../../../internal/mergeProps.js";
-	import { useId } from "../../../internal/useId.js";
+	import { useId } from "../../../internal/use-id.js";
 
 	let {
 		id = useId(),
@@ -11,8 +10,9 @@
 		children,
 		ref = $bindable(null),
 		type = "button",
+		disabled = false,
 		...restProps
-	}: NextButtonProps = $props();
+	}: PaginationNextButtonProps = $props();
 
 	const nextButtonState = usePaginationButton({
 		type: "next",
@@ -21,6 +21,7 @@
 			() => ref,
 			(v) => (ref = v)
 		),
+		disabled: box.with(() => Boolean(disabled)),
 	});
 
 	const mergedProps = $derived(mergeProps(restProps, nextButtonState.props, { type }));

package/dist/bits/pagination/components/pagination-next-button.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { NextButtonProps } from "../index.js";
+import type { PaginationNextButtonProps } from "../types.js";
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
@@ -12,7 +12,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const PaginationNextButton: $$__sveltets_2_IsomorphicComponent<NextButtonProps, {
+declare const PaginationNextButton: $$__sveltets_2_IsomorphicComponent<PaginationNextButtonProps, {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, "ref">;
 type PaginationNextButton = InstanceType<typeof PaginationNextButton>;

package/dist/bits/pagination/components/pagination-page.svelte

@@ -1,9 +1,8 @@
 <script lang="ts">
-	import { box } from "svelte-toolbelt";
-	import type { PageProps } from "../index.js";
+	import { box, mergeProps } from "svelte-toolbelt";
+	import type { PaginationPageProps } from "../types.js";
 	import { usePaginationPage } from "../pagination.svelte.js";
-	import { mergeProps } from "../../../internal/mergeProps.js";
-	import { useId } from "../../../internal/useId.js";
+	import { useId } from "../../../internal/use-id.js";
 
 	let {
 		id = useId(),
@@ -12,8 +11,9 @@
 		children,
 		type = "button",
 		ref = $bindable(null),
+		disabled = false,
 		...restProps
-	}: PageProps = $props();
+	}: PaginationPageProps = $props();
 
 	const pageState = usePaginationPage({
 		id: box.with(() => id),
@@ -22,6 +22,7 @@
 			() => ref,
 			(v) => (ref = v)
 		),
+		disabled: box.with(() => Boolean(disabled)),
 	});
 
 	const mergedProps = $derived(mergeProps(restProps, pageState.props, { type }));

package/dist/bits/pagination/components/pagination-page.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { PageProps } from "../index.js";
+import type { PaginationPageProps } from "../types.js";
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
@@ -12,7 +12,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const PaginationPage: $$__sveltets_2_IsomorphicComponent<PageProps, {
+declare const PaginationPage: $$__sveltets_2_IsomorphicComponent<PaginationPageProps, {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, "ref">;
 type PaginationPage = InstanceType<typeof PaginationPage>;

package/dist/bits/pagination/components/pagination-prev-button.svelte

@@ -1,9 +1,8 @@
 <script lang="ts">
-	import { box } from "svelte-toolbelt";
-	import type { PrevButtonProps } from "../index.js";
+	import { box, mergeProps } from "svelte-toolbelt";
+	import type { PaginationPrevButtonProps } from "../types.js";
 	import { usePaginationButton } from "../pagination.svelte.js";
-	import { mergeProps } from "../../../internal/mergeProps.js";
-	import { useId } from "../../../internal/useId.js";
+	import { useId } from "../../../internal/use-id.js";
 
 	let {
 		id = useId(),
@@ -11,8 +10,9 @@
 		children,
 		ref = $bindable(null),
 		type = "button",
+		disabled = false,
 		...restProps
-	}: PrevButtonProps = $props();
+	}: PaginationPrevButtonProps = $props();
 
 	const prevButtonState = usePaginationButton({
 		type: "prev",
@@ -21,6 +21,7 @@
 			() => ref,
 			(v) => (ref = v)
 		),
+		disabled: box.with(() => Boolean(disabled)),
 	});
 
 	const mergedProps = $derived(mergeProps(restProps, prevButtonState.props, { type }));

package/dist/bits/pagination/components/pagination-prev-button.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { PrevButtonProps } from "../index.js";
+import type { PaginationPrevButtonProps } from "../types.js";
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
@@ -12,7 +12,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const PaginationPrevButton: $$__sveltets_2_IsomorphicComponent<PrevButtonProps, {
+declare const PaginationPrevButton: $$__sveltets_2_IsomorphicComponent<PaginationPrevButtonProps, {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, "ref">;
 type PaginationPrevButton = InstanceType<typeof PaginationPrevButton>;

package/dist/bits/pagination/components/pagination.svelte

@@ -1,10 +1,9 @@
 <script lang="ts">
-	import { box } from "svelte-toolbelt";
-	import type { RootProps } from "../index.js";
+	import { box, mergeProps } from "svelte-toolbelt";
+	import type { PaginationRootProps } from "../types.js";
 	import { usePaginationRoot } from "../pagination.svelte.js";
-	import { mergeProps } from "../../../internal/mergeProps.js";
-	import { useId } from "../../../internal/useId.js";
-	import { noop } from "../../../internal/callbacks.js";
+	import { useId } from "../../../internal/use-id.js";
+	import { noop } from "../../../internal/noop.js";
 
 	let {
 		id = useId(),
@@ -20,7 +19,7 @@
 		child,
 		children,
 		...restProps
-	}: RootProps = $props();
+	}: PaginationRootProps = $props();
 
 	const rootState = usePaginationRoot({
 		id: box.with(() => id),

package/dist/bits/pagination/components/pagination.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { RootProps } from "../index.js";
+import type { PaginationRootProps } from "../types.js";
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
@@ -12,8 +12,8 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const Pagination: $$__sveltets_2_IsomorphicComponent<RootProps, {
+declare const Pagination: $$__sveltets_2_IsomorphicComponent<PaginationRootProps, {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, "page" | "ref">;
+}, {}, {}, "ref" | "page">;
 type Pagination = InstanceType<typeof Pagination>;
 export default Pagination;

package/dist/bits/pagination/exports.d.ts

@@ -0,0 +1,5 @@
+export { default as Root } from "./components/pagination.svelte";
+export { default as PrevButton } from "./components/pagination-prev-button.svelte";
+export { default as NextButton } from "./components/pagination-next-button.svelte";
+export { default as Page } from "./components/pagination-page.svelte";
+export type { PaginationRootProps as RootProps, PaginationPrevButtonProps as PrevButtonProps, PaginationNextButtonProps as NextButtonProps, PaginationPageProps as PageProps, } from "./types.js";

package/dist/bits/pagination/exports.js

@@ -0,0 +1,4 @@
+export { default as Root } from "./components/pagination.svelte";
+export { default as PrevButton } from "./components/pagination-prev-button.svelte";
+export { default as NextButton } from "./components/pagination-next-button.svelte";
+export { default as Page } from "./components/pagination-page.svelte";

package/dist/bits/pagination/index.d.ts

@@ -1,5 +1 @@
-export { default as Root } from "./components/pagination.svelte";
-export { default as PrevButton } from "./components/pagination-prev-button.svelte";
-export { default as NextButton } from "./components/pagination-next-button.svelte";
-export { default as Page } from "./components/pagination-page.svelte";
-export type { PaginationRootProps as RootProps, PaginationPrevButtonProps as PrevButtonProps, PaginationNextButtonProps as NextButtonProps, PaginationPageProps as PageProps, } from "./types.js";
+export * as Pagination from "./exports.js";