bits-ui 1.0.0-next.8 → 1.0.0-next.81

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<{
     /**
@@ -13,12 +12,6 @@ export type NavigationMenuRootPropsWithoutHTML = WithChild<{
      * The callback to call when a menu item is selected.
      */
     onValueChange?: OnChangeFn<string>;
-    /**
-     * Whether or not the value state is controlled or not. If `true`, the component will not update
-     * the value state internally, instead it will call `onValueChange` when it would have
-     * otherwise, and it is up to you to update the `value` prop that is passed to the component.
-     */
-    controlledValue?: boolean;
     /**
      * The duration from when the mouse enters a trigger until the content opens.
      *
@@ -42,7 +35,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 +52,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 +69,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 +96,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 +108,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 +119,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 +130,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,19 +1,4 @@
-import type { NextButtonProps } from "../index.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;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const PaginationNextButton: $$__sveltets_2_IsomorphicComponent<NextButtonProps, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "ref">;
-type PaginationNextButton = InstanceType<typeof PaginationNextButton>;
+import type { PaginationNextButtonProps } from "../types.js";
+declare const PaginationNextButton: import("svelte").Component<PaginationNextButtonProps, {}, "ref">;
+type PaginationNextButton = ReturnType<typeof PaginationNextButton>;
 export default 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,19 +1,4 @@
-import type { PageProps } from "../index.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;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const PaginationPage: $$__sveltets_2_IsomorphicComponent<PageProps, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "ref">;
-type PaginationPage = InstanceType<typeof PaginationPage>;
+import type { PaginationPageProps } from "../types.js";
+declare const PaginationPage: import("svelte").Component<PaginationPageProps, {}, "ref">;
+type PaginationPage = ReturnType<typeof PaginationPage>;
 export default 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,19 +1,4 @@
-import type { PrevButtonProps } from "../index.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;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const PaginationPrevButton: $$__sveltets_2_IsomorphicComponent<PrevButtonProps, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "ref">;
-type PaginationPrevButton = InstanceType<typeof PaginationPrevButton>;
+import type { PaginationPrevButtonProps } from "../types.js";
+declare const PaginationPrevButton: import("svelte").Component<PaginationPrevButtonProps, {}, "ref">;
+type PaginationPrevButton = ReturnType<typeof PaginationPrevButton>;
 export default 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(),
@@ -16,11 +15,10 @@
 		onPageChange = noop,
 		loop = false,
 		orientation = "horizontal",
-		controlledPage = false,
 		child,
 		children,
 		...restProps
-	}: RootProps = $props();
+	}: PaginationRootProps = $props();
 
 	const rootState = usePaginationRoot({
 		id: box.with(() => id),
@@ -29,12 +27,8 @@
 		page: box.with(
 			() => page,
 			(v) => {
-				if (controlledPage) {
-					onPageChange(v);
-				} else {
-					page = v;
-					onPageChange?.(v);
-				}
+				page = v;
+				onPageChange?.(v);
 			}
 		),
 		loop: box.with(() => loop),

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

@@ -1,19 +1,4 @@
-import type { RootProps } from "../index.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;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const Pagination: $$__sveltets_2_IsomorphicComponent<RootProps, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, "page" | "ref">;
-type Pagination = InstanceType<typeof Pagination>;
+import type { PaginationRootProps } from "../types.js";
+declare const Pagination: import("svelte").Component<PaginationRootProps, {}, "ref" | "page">;
+type Pagination = ReturnType<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";

package/dist/bits/pagination/index.js

@@ -1,4 +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 * as Pagination from "./exports.js";

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

@@ -1,5 +1,5 @@
 import type { Page, PageItem } from "./types.js";
-import type { WithRefProps } from "../../internal/types.js";
+import type { BitsKeyboardEvent, BitsMouseEvent, WithRefProps } from "../../internal/types.js";
 import type { ReadableBoxedValues, WritableBoxedValues } from "../../internal/box.svelte.js";
 import { type Orientation } from "../../shared/index.js";
 type PaginationRootStateProps = WithRefProps<ReadableBoxedValues<{
@@ -27,19 +27,20 @@ declare class PaginationRootState {
     };
     pages: PageItem[];
     constructor(props: PaginationRootStateProps);
-    setPage: (page: number) => void;
-    getPageTriggerNodes: () => HTMLElement[];
-    getButtonNode: (type: "prev" | "next") => HTMLElement | null | undefined;
-    prevPage: () => void;
-    nextPage: () => void;
-    createPage: (props: PaginationPageStateProps) => PaginationPage;
-    createButton: (props: PaginationButtonStateProps) => PaginationButtonState;
+    setPage(page: number): void;
+    getPageTriggerNodes(): HTMLElement[];
+    getButtonNode(type: "prev" | "next"): HTMLElement | null | undefined;
+    hasPrevPage: boolean;
+    hasNextPage: boolean;
+    prevPage(): void;
+    nextPage(): void;
     snippetProps: {
         pages: PageItem[];
         range: {
             start: number;
             end: number;
         };
+        currentPage: number;
     };
     props: {
         readonly id: string;
@@ -49,38 +50,46 @@ declare class PaginationRootState {
 }
 type PaginationPageStateProps = WithRefProps<ReadableBoxedValues<{
     page: Page;
+    disabled: boolean;
 }>>;
-declare class PaginationPage {
+declare class PaginationPageState {
     #private;
     page: PaginationPageStateProps["page"];
     constructor(props: PaginationPageStateProps, root: PaginationRootState);
+    onclick(e: BitsMouseEvent): void;
+    onkeydown(e: BitsKeyboardEvent): void;
     props: {
         readonly id: string;
-        readonly "aria-label": `Page ${string}`;
+        readonly "aria-label": `Page ${number}`;
         readonly "data-value": `${number}`;
         readonly "data-selected": "" | undefined;
         readonly "data-pagination-page": "";
-        readonly onclick: () => void;
-        readonly onkeydown: (e: KeyboardEvent) => void;
+        readonly onclick: (e: BitsMouseEvent) => void;
+        readonly onkeydown: (e: BitsKeyboardEvent) => void;
     };
 }
 type PaginationButtonStateProps = WithRefProps<{
     type: "prev" | "next";
+}> & ReadableBoxedValues<{
+    disabled: boolean;
 }>;
 declare class PaginationButtonState {
     #private;
     id: PaginationButtonStateProps["id"];
     type: PaginationButtonStateProps["type"];
     constructor(props: PaginationButtonStateProps, root: PaginationRootState);
+    onclick(e: BitsMouseEvent): void;
+    onkeydown(e: BitsKeyboardEvent): void;
     props: {
         readonly id: string;
         readonly "data-pagination-prev": "" | undefined;
         readonly "data-pagination-next": "" | undefined;
-        readonly onclick: () => void;
-        readonly onkeydown: (e: KeyboardEvent) => void;
+        readonly disabled: boolean;
+        readonly onclick: (e: BitsMouseEvent) => void;
+        readonly onkeydown: (e: BitsKeyboardEvent) => void;
     };
 }
 export declare function usePaginationRoot(props: PaginationRootStateProps): PaginationRootState;
-export declare function usePaginationPage(props: PaginationPageStateProps): PaginationPage;
+export declare function usePaginationPage(props: PaginationPageStateProps): PaginationPageState;
 export declare function usePaginationButton(props: PaginationButtonStateProps): PaginationButtonState;
 export {};