@ark-ui/svelte 5.14.1 → 5.16.0

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

@@ -0,0 +1,32 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { LinkProps } from '@zag-js/navigation-menu'
+
+  export interface NavigationMenuLinkBaseProps extends Partial<LinkProps>, PolymorphicProps<'a'>, RefAttribute {}
+  export interface NavigationMenuLinkProps extends Assign<HTMLProps<'a'>, NavigationMenuLinkBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@zag-js/svelte'
+  import { Ark } from '../factory'
+  import { useNavigationMenuContext } from './use-navigation-menu-context'
+  import { useNavigationMenuItemPropsContext } from './use-navigation-menu-item-props-context'
+  import { createSplitProps } from '../../utils/create-split-props'
+  import type { RequiredBy } from '@zag-js/types'
+
+  let { ref = $bindable(null), ...props }: NavigationMenuLinkProps = $props()
+
+  const itemContext = useNavigationMenuItemPropsContext()
+  const value = $derived(props.value ?? itemContext?.()?.value)
+  const combinedProps = $derived(mergeProps(props, { value }) as RequiredBy<NavigationMenuLinkProps, 'value'>)
+
+  const splitLinkProps = createSplitProps<LinkProps>()
+  const [linkProps, localProps] = $derived(
+    splitLinkProps(combinedProps, ['current', 'onSelect', 'value', 'closeOnClick']),
+  )
+
+  const navigationMenu = useNavigationMenuContext()
+  const mergedProps = $derived(mergeProps(navigationMenu().getLinkProps(linkProps), localProps))
+</script>
+
+<Ark as="a" bind:ref {...mergedProps} />

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

@@ -0,0 +1,9 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { LinkProps } from '@zag-js/navigation-menu';
+export interface NavigationMenuLinkBaseProps extends Partial<LinkProps>, PolymorphicProps<'a'>, RefAttribute {
+}
+export interface NavigationMenuLinkProps extends Assign<HTMLProps<'a'>, NavigationMenuLinkBaseProps> {
+}
+declare const NavigationMenuLink: import("svelte").Component<NavigationMenuLinkProps, {}, "ref">;
+type NavigationMenuLink = ReturnType<typeof NavigationMenuLink>;
+export default NavigationMenuLink;

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

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface NavigationMenuListBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface NavigationMenuListProps extends Assign<HTMLProps<'div'>, NavigationMenuListBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@zag-js/svelte'
+  import { Ark } from '../factory'
+  import { useNavigationMenuContext } from './use-navigation-menu-context'
+
+  let { ref = $bindable(null), ...props }: NavigationMenuListProps = $props()
+
+  const navigationMenu = useNavigationMenuContext()
+  const mergedProps = $derived(mergeProps(navigationMenu().getListProps(), props))
+</script>
+
+<Ark as="div" bind:ref {...mergedProps} />

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

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface NavigationMenuListBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface NavigationMenuListProps extends Assign<HTMLProps<'div'>, NavigationMenuListBaseProps> {
+}
+declare const NavigationMenuList: import("svelte").Component<NavigationMenuListProps, {}, "ref">;
+type NavigationMenuList = ReturnType<typeof NavigationMenuList>;
+export default NavigationMenuList;

package/dist/components/navigation-menu/navigation-menu-root-provider.svelte

@@ -0,0 +1,35 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UsePresenceProps } from '../presence'
+  import type { UseNavigationMenuReturn } from './use-navigation-menu.svelte'
+
+  interface RootProviderProps {
+    value: UseNavigationMenuReturn
+  }
+
+  export interface NavigationMenuRootProviderBaseProps
+    extends RootProviderProps, PolymorphicProps<'nav'>, UsePresenceProps, RefAttribute {}
+
+  export interface NavigationMenuRootProviderProps extends Assign<
+    HTMLProps<'nav'>,
+    NavigationMenuRootProviderBaseProps
+  > {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@zag-js/svelte'
+  import { Ark } from '../factory'
+  import { NavigationMenuProvider } from './use-navigation-menu-context'
+  import { RenderStrategyPropsProvider, splitRenderStrategyProps } from '../../utils/render-strategy'
+
+  let { ref = $bindable(null), ...props }: NavigationMenuRootProviderProps = $props()
+
+  const [renderStrategyProps, localProps] = $derived(splitRenderStrategyProps(props))
+
+  const mergedProps = $derived(mergeProps(props.value().getRootProps(), localProps))
+
+  NavigationMenuProvider(() => props.value())
+  RenderStrategyPropsProvider(() => renderStrategyProps)
+</script>
+
+<Ark as="nav" bind:ref {...mergedProps} />

package/dist/components/navigation-menu/navigation-menu-root-provider.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { UsePresenceProps } from '../presence';
+import type { UseNavigationMenuReturn } from './use-navigation-menu.svelte';
+interface RootProviderProps {
+    value: UseNavigationMenuReturn;
+}
+export interface NavigationMenuRootProviderBaseProps extends RootProviderProps, PolymorphicProps<'nav'>, UsePresenceProps, RefAttribute {
+}
+export interface NavigationMenuRootProviderProps extends Assign<HTMLProps<'nav'>, NavigationMenuRootProviderBaseProps> {
+}
+declare const NavigationMenuRootProvider: import("svelte").Component<NavigationMenuRootProviderProps, {}, "ref">;
+type NavigationMenuRootProvider = ReturnType<typeof NavigationMenuRootProvider>;
+export default NavigationMenuRootProvider;

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

@@ -0,0 +1,58 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UsePresenceProps } from '../presence'
+  import type { UseNavigationMenuProps } from './use-navigation-menu.svelte'
+
+  export interface NavigationMenuRootBaseProps
+    extends UseNavigationMenuProps, UsePresenceProps, PolymorphicProps<'nav'>, RefAttribute {}
+  export interface NavigationMenuRootProps extends Assign<HTMLProps<'nav'>, NavigationMenuRootBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@zag-js/svelte'
+  import { Ark } from '../factory'
+  import { NavigationMenuProvider } from './use-navigation-menu-context'
+  import { useNavigationMenu } from './use-navigation-menu.svelte'
+  import { RenderStrategyPropsProvider, splitRenderStrategyProps } from '../../utils/render-strategy'
+  import { createSplitProps } from '../../utils/create-split-props'
+
+  let { ref = $bindable(null), value = $bindable(), ...props }: NavigationMenuRootProps = $props()
+
+  const providedId = $props.id()
+  const splitRootProps = createSplitProps<UseNavigationMenuProps>()
+
+  const [renderStrategyProps, navigationMenuProps] = $derived(splitRenderStrategyProps(props))
+  const [useNavigationMenuProps, localProps] = $derived(
+    splitRootProps(navigationMenuProps, [
+      'closeDelay',
+      'defaultValue',
+      'disableClickTrigger',
+      'disableHoverTrigger',
+      'disablePointerLeaveClose',
+      'id',
+      'ids',
+      'onValueChange',
+      'openDelay',
+      'orientation',
+      'value',
+    ]),
+  )
+
+  const machineProps = $derived<UseNavigationMenuProps>({
+    ...useNavigationMenuProps,
+    id: useNavigationMenuProps.id ?? providedId,
+    value,
+    onValueChange(details) {
+      useNavigationMenuProps.onValueChange?.(details)
+      if (value !== undefined) value = details.value
+    },
+  })
+
+  const navigationMenu = useNavigationMenu(() => machineProps)
+  const mergedProps = $derived(mergeProps(navigationMenu().getRootProps(), localProps))
+
+  RenderStrategyPropsProvider(() => renderStrategyProps)
+  NavigationMenuProvider(navigationMenu)
+</script>
+
+<Ark as="nav" bind:ref {...mergedProps} />

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

@@ -0,0 +1,10 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { UsePresenceProps } from '../presence';
+import type { UseNavigationMenuProps } from './use-navigation-menu.svelte';
+export interface NavigationMenuRootBaseProps extends UseNavigationMenuProps, UsePresenceProps, PolymorphicProps<'nav'>, RefAttribute {
+}
+export interface NavigationMenuRootProps extends Assign<HTMLProps<'nav'>, NavigationMenuRootBaseProps> {
+}
+declare const NavigationMenuRoot: import("svelte").Component<NavigationMenuRootProps, {}, "ref" | "value">;
+type NavigationMenuRoot = ReturnType<typeof NavigationMenuRoot>;
+export default NavigationMenuRoot;

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

@@ -0,0 +1,34 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { ItemProps } from '@zag-js/navigation-menu'
+
+  export interface NavigationMenuTriggerBaseProps
+    extends Omit<ItemProps, 'value'>, PolymorphicProps<'button'>, RefAttribute {}
+  export interface NavigationMenuTriggerProps extends Assign<HTMLProps<'button'>, NavigationMenuTriggerBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { createSplitProps } from '../../utils/create-split-props'
+  import { mergeProps } from '@zag-js/svelte'
+  import { ensure } from '@zag-js/utils'
+  import { Ark } from '../factory'
+  import { useNavigationMenuContext } from './use-navigation-menu-context'
+  import { useNavigationMenuItemPropsContext } from './use-navigation-menu-item-props-context'
+
+  let { ref = $bindable(null), ...props }: NavigationMenuTriggerProps = $props()
+  const splitItemProps = createSplitProps<ItemProps>()
+
+  const itemContext = useNavigationMenuItemPropsContext()
+  ensure(itemContext, () => 'NavigationMenu.Trigger must be used within NavigationMenu.Item')
+
+  const value = $derived(itemContext().value)
+  const disabled = $derived(props.disabled ?? itemContext().disabled)
+
+  const combinedProps = $derived({ ...props, value, disabled })
+  const [triggerProps, localProps] = $derived(splitItemProps(combinedProps, ['value', 'disabled']))
+
+  const navigationMenu = useNavigationMenuContext()
+  const mergedProps = $derived(mergeProps(navigationMenu().getTriggerProps(triggerProps), localProps))
+</script>
+
+<Ark as="button" bind:ref {...mergedProps} />

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

@@ -0,0 +1,9 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { ItemProps } from '@zag-js/navigation-menu';
+export interface NavigationMenuTriggerBaseProps extends Omit<ItemProps, 'value'>, PolymorphicProps<'button'>, RefAttribute {
+}
+export interface NavigationMenuTriggerProps extends Assign<HTMLProps<'button'>, NavigationMenuTriggerBaseProps> {
+}
+declare const NavigationMenuTrigger: import("svelte").Component<NavigationMenuTriggerProps, {}, "ref">;
+type NavigationMenuTrigger = ReturnType<typeof NavigationMenuTrigger>;
+export default NavigationMenuTrigger;

package/dist/components/navigation-menu/navigation-menu-viewport-positioner.svelte

@@ -0,0 +1,36 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { ViewportProps } from '@zag-js/navigation-menu'
+
+  export interface NavigationMenuViewportPositionerBaseProps
+    extends ViewportProps, PolymorphicProps<'div'>, RefAttribute {}
+  export interface NavigationMenuViewportPositionerProps extends Assign<
+    HTMLProps<'div'>,
+    NavigationMenuViewportPositionerBaseProps
+  > {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@zag-js/svelte'
+  import { Ark } from '../factory'
+  import { useNavigationMenuContext } from './use-navigation-menu-context'
+  import { setNavigationMenuViewportPropsContext } from './use-navigation-menu-viewport-props-context'
+  import { createSplitProps } from '../../utils/create-split-props'
+
+  import type { Snippet } from 'svelte'
+
+  let { ref = $bindable(null), children, ...props }: NavigationMenuViewportPositionerProps & { children?: Snippet } = $props()
+  const splitViewportProps = createSplitProps<ViewportProps>()
+  const [viewportProps, localProps] = $derived(splitViewportProps(props, ['align']))
+
+  setNavigationMenuViewportPropsContext(() => viewportProps)
+
+  const navigationMenu = useNavigationMenuContext()
+  const mergedProps = $derived(
+    mergeProps(navigationMenu().getViewportPositionerProps(viewportProps), localProps),
+  )
+</script>
+
+<Ark as="div" bind:ref {...mergedProps}>
+  {@render children?.()}
+</Ark>

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

@@ -0,0 +1,13 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { ViewportProps } from '@zag-js/navigation-menu';
+export interface NavigationMenuViewportPositionerBaseProps extends ViewportProps, PolymorphicProps<'div'>, RefAttribute {
+}
+export interface NavigationMenuViewportPositionerProps extends Assign<HTMLProps<'div'>, NavigationMenuViewportPositionerBaseProps> {
+}
+import type { Snippet } from 'svelte';
+type $$ComponentProps = NavigationMenuViewportPositionerProps & {
+    children?: Snippet;
+};
+declare const NavigationMenuViewportPositioner: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type NavigationMenuViewportPositioner = ReturnType<typeof NavigationMenuViewportPositioner>;
+export default NavigationMenuViewportPositioner;

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

@@ -0,0 +1,34 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface NavigationMenuViewportBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface NavigationMenuViewportProps extends Assign<HTMLProps<'div'>, NavigationMenuViewportBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@zag-js/svelte'
+  import { Ark } from '../factory'
+  import { usePresence } from '../presence'
+  import { useNavigationMenuContext } from './use-navigation-menu-context'
+  import { getNavigationMenuViewportPropsContext } from './use-navigation-menu-viewport-props-context'
+  import { useRenderStrategyPropsContext } from '../../utils/render-strategy'
+
+  let { ref = $bindable(null), ...props }: NavigationMenuViewportProps = $props()
+
+  const viewportPropsContext = getNavigationMenuViewportPropsContext()
+
+  const navigationMenu = useNavigationMenuContext()
+  const renderStrategyProps = useRenderStrategyPropsContext()
+  const presence = usePresence(() => ({ ...renderStrategyProps, present: navigationMenu().open }))
+  const mergedProps = $derived(
+    mergeProps(navigationMenu().getViewportProps(viewportPropsContext?.()), presence().getPresenceProps(), props),
+  )
+
+  function setNode(node: Element | null) {
+    presence().setNode(node)
+  }
+</script>
+
+{#if !presence().unmounted}
+  <Ark as="div" bind:ref {...mergedProps} {@attach setNode} />
+{/if}

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

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface NavigationMenuViewportBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface NavigationMenuViewportProps extends Assign<HTMLProps<'div'>, NavigationMenuViewportBaseProps> {
+}
+declare const NavigationMenuViewport: import("svelte").Component<NavigationMenuViewportProps, {}, "ref">;
+type NavigationMenuViewport = ReturnType<typeof NavigationMenuViewport>;
+export default NavigationMenuViewport;

package/dist/components/navigation-menu/navigation-menu.anatomy.d.ts

@@ -0,0 +1 @@
+export { anatomy as navigationMenuAnatomy } from '@zag-js/navigation-menu';

package/dist/components/navigation-menu/navigation-menu.anatomy.js

@@ -0,0 +1 @@
+export { anatomy as navigationMenuAnatomy } from '@zag-js/navigation-menu';

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

@@ -0,0 +1,14 @@
+export type { ValueChangeDetails } from '@zag-js/navigation-menu';
+export { default as Arrow, type NavigationMenuArrowBaseProps as ArrowBaseProps, type NavigationMenuArrowProps as ArrowProps, } from './navigation-menu-arrow.svelte';
+export { default as Content, type NavigationMenuContentBaseProps as ContentBaseProps, type NavigationMenuContentProps as ContentProps, } from './navigation-menu-content.svelte';
+export { default as Context, type NavigationMenuContextProps as ContextProps } from './navigation-menu-context.svelte';
+export { default as Indicator, type NavigationMenuIndicatorBaseProps as IndicatorBaseProps, type NavigationMenuIndicatorProps as IndicatorProps, } from './navigation-menu-indicator.svelte';
+export { default as Item, type NavigationMenuItemBaseProps as ItemBaseProps, type NavigationMenuItemProps as ItemProps, } from './navigation-menu-item.svelte';
+export { default as ItemIndicator, type NavigationMenuItemIndicatorBaseProps as ItemIndicatorBaseProps, type NavigationMenuItemIndicatorProps as ItemIndicatorProps, } from './navigation-menu-item-indicator.svelte';
+export { default as Link, type NavigationMenuLinkBaseProps as LinkBaseProps, type NavigationMenuLinkProps as LinkProps, } from './navigation-menu-link.svelte';
+export { default as List, type NavigationMenuListBaseProps as ListBaseProps, type NavigationMenuListProps as ListProps, } from './navigation-menu-list.svelte';
+export { default as Root, type NavigationMenuRootBaseProps as RootBaseProps, type NavigationMenuRootProps as RootProps, } from './navigation-menu-root.svelte';
+export { default as RootProvider, type NavigationMenuRootProviderBaseProps as RootProviderBaseProps, type NavigationMenuRootProviderProps as RootProviderProps, } from './navigation-menu-root-provider.svelte';
+export { default as Trigger, type NavigationMenuTriggerBaseProps as TriggerBaseProps, type NavigationMenuTriggerProps as TriggerProps, } from './navigation-menu-trigger.svelte';
+export { default as Viewport, type NavigationMenuViewportBaseProps as ViewportBaseProps, type NavigationMenuViewportProps as ViewportProps, } from './navigation-menu-viewport.svelte';
+export { default as ViewportPositioner, type NavigationMenuViewportPositionerBaseProps as ViewportPositionerBaseProps, type NavigationMenuViewportPositionerProps as ViewportPositionerProps, } from './navigation-menu-viewport-positioner.svelte';

package/dist/components/navigation-menu/navigation-menu.js

@@ -0,0 +1,13 @@
+export { default as Arrow, } from './navigation-menu-arrow.svelte';
+export { default as Content, } from './navigation-menu-content.svelte';
+export { default as Context } from './navigation-menu-context.svelte';
+export { default as Indicator, } from './navigation-menu-indicator.svelte';
+export { default as Item, } from './navigation-menu-item.svelte';
+export { default as ItemIndicator, } from './navigation-menu-item-indicator.svelte';
+export { default as Link, } from './navigation-menu-link.svelte';
+export { default as List, } from './navigation-menu-list.svelte';
+export { default as Root, } from './navigation-menu-root.svelte';
+export { default as RootProvider, } from './navigation-menu-root-provider.svelte';
+export { default as Trigger, } from './navigation-menu-trigger.svelte';
+export { default as Viewport, } from './navigation-menu-viewport.svelte';
+export { default as ViewportPositioner, } from './navigation-menu-viewport-positioner.svelte';

package/dist/components/navigation-menu/use-navigation-menu-context.d.ts

@@ -0,0 +1,4 @@
+import type { UseNavigationMenuReturn } from './use-navigation-menu.svelte';
+export interface UseNavigationMenuContext extends UseNavigationMenuReturn {
+}
+export declare const NavigationMenuProvider: (opts: UseNavigationMenuContext) => void, useNavigationMenuContext: (fallback?: UseNavigationMenuContext | undefined) => UseNavigationMenuContext;

package/dist/components/navigation-menu/use-navigation-menu-context.js

@@ -0,0 +1,4 @@
+import { createContext } from '../../utils/create-context';
+export const [NavigationMenuProvider, useNavigationMenuContext] = createContext({
+    name: 'NavigationMenuContext',
+});

package/dist/components/navigation-menu/use-navigation-menu-item-props-context.d.ts

@@ -0,0 +1,3 @@
+import type { ItemProps } from '@zag-js/navigation-menu';
+import type { Accessor } from '../../types';
+export declare const NavigationMenuItemPropsProvider: (opts: Accessor<ItemProps>) => void, useNavigationMenuItemPropsContext: (fallback?: Accessor<ItemProps> | undefined) => Accessor<ItemProps>;

package/dist/components/navigation-menu/use-navigation-menu-item-props-context.js

@@ -0,0 +1,5 @@
+import { createContext } from '../../utils/create-context';
+export const [NavigationMenuItemPropsProvider, useNavigationMenuItemPropsContext] = createContext({
+    name: 'NavigationMenuItemPropsContext',
+    strict: false,
+});

package/dist/components/navigation-menu/use-navigation-menu-viewport-props-context.d.ts

@@ -0,0 +1,3 @@
+import type { ViewportProps } from '@zag-js/navigation-menu';
+import type { Accessor } from '../../types';
+export declare const setNavigationMenuViewportPropsContext: (opts: Accessor<ViewportProps>) => void, getNavigationMenuViewportPropsContext: (fallback?: Accessor<ViewportProps> | undefined) => Accessor<ViewportProps>;

package/dist/components/navigation-menu/use-navigation-menu-viewport-props-context.js

@@ -0,0 +1,5 @@
+import { createContext } from '../../utils/create-context';
+export const [setNavigationMenuViewportPropsContext, getNavigationMenuViewportPropsContext] = createContext({
+    name: 'NavigationMenuViewportPropsContext',
+    strict: false,
+});

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

@@ -0,0 +1,9 @@
+import type { Accessor, Optional } from '../../types';
+import { type PropTypes } from '@zag-js/svelte';
+import * as navigationMenu from '@zag-js/navigation-menu';
+import { type MaybeFunction } from '@zag-js/utils';
+export interface UseNavigationMenuProps extends Optional<Omit<navigationMenu.Props, 'dir' | 'getRootNode'>, 'id'> {
+}
+export interface UseNavigationMenuReturn extends Accessor<navigationMenu.Api<PropTypes>> {
+}
+export declare const useNavigationMenu: (props?: MaybeFunction<UseNavigationMenuProps>) => UseNavigationMenuReturn;

package/dist/components/navigation-menu/use-navigation-menu.svelte.js

@@ -0,0 +1,20 @@
+import { useEnvironmentContext } from '../../providers/environment';
+import { useLocaleContext } from '../../providers/locale';
+import { normalizeProps, useMachine } from '@zag-js/svelte';
+import * as navigationMenu from '@zag-js/navigation-menu';
+import { runIfFn } from '@zag-js/utils';
+export const useNavigationMenu = (props) => {
+    const env = useEnvironmentContext();
+    const locale = useLocaleContext();
+    const machineProps = $derived.by(() => {
+        const resolvedProps = runIfFn(props);
+        return {
+            dir: locale().dir,
+            getRootNode: env().getRootNode,
+            ...resolvedProps,
+        };
+    });
+    const service = useMachine(navigationMenu.machine, () => machineProps);
+    const api = $derived(navigationMenu.connect(service, normalizeProps));
+    return () => api;
+};

package/dist/components/number-input/number-input-decrement-trigger.svelte

@@ -2,8 +2,10 @@
   import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
 
   export interface NumberInputDecrementTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
-  export interface NumberInputDecrementTriggerProps
-    extends Assign<HTMLProps<'button'>, NumberInputDecrementTriggerBaseProps> {}
+  export interface NumberInputDecrementTriggerProps extends Assign<
+    HTMLProps<'button'>,
+    NumberInputDecrementTriggerBaseProps
+  > {}
 </script>
 
 <script lang="ts">

package/dist/components/number-input/number-input-increment-trigger.svelte

@@ -2,8 +2,10 @@
   import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
 
   export interface NumberInputIncrementTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
-  export interface NumberInputIncrementTriggerProps
-    extends Assign<HTMLProps<'button'>, NumberInputIncrementTriggerBaseProps> {}
+  export interface NumberInputIncrementTriggerProps extends Assign<
+    HTMLProps<'button'>,
+    NumberInputIncrementTriggerBaseProps
+  > {}
 </script>
 
 <script lang="ts">

package/dist/components/number-input/split-number-input-props.svelte.d.ts

@@ -1,2 +1,2 @@
 import type { UseNumberInputProps } from './use-number-input.svelte';
-export declare const splitNumberInputProps: <T extends UseNumberInputProps>(props: T) => [UseNumberInputProps, Omit<T, "form" | "pattern" | "name" | "defaultValue" | "value" | "locale" | "ids" | "disabled" | "id" | "step" | "onValueChange" | "onFocusChange" | "readOnly" | "invalid" | "max" | "min" | "required" | "translations" | "allowOverflow" | "allowMouseWheel" | "clampValueOnBlur" | "focusInputOnChange" | "formatOptions" | "inputMode" | "onValueInvalid" | "spinOnPress">];
+export declare const splitNumberInputProps: <T extends UseNumberInputProps>(props: T) => [UseNumberInputProps, Omit<T, "form" | "pattern" | "name" | "defaultValue" | "value" | "locale" | "ids" | "disabled" | "id" | "step" | "onValueChange" | "onFocusChange" | "readOnly" | "invalid" | "max" | "min" | "required" | "translations" | "onValueCommit" | "allowOverflow" | "allowMouseWheel" | "clampValueOnBlur" | "focusInputOnChange" | "formatOptions" | "inputMode" | "onValueInvalid" | "spinOnPress">];

package/dist/components/number-input/split-number-input-props.svelte.js

@@ -19,6 +19,7 @@ export const splitNumberInputProps = (props) => splitFn(props, [
     'name',
     'onFocusChange',
     'onValueChange',
+    'onValueCommit',
     'onValueInvalid',
     'pattern',
     'readOnly',

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

@@ -1,7 +1,9 @@
 export type { ItemLabelDetails as PaginationItemLabelDetails, PageChangeDetails as PaginationPageChangeDetails, PageSizeChangeDetails as PaginationPageSizeChangeDetails, PageUrlDetails as PaginationPageUrlDetails, } from '@zag-js/pagination';
 export { default as PaginationContext, type PaginationContextProps } from './pagination-context.svelte';
 export { default as PaginationEllipsis, type PaginationEllipsisBaseProps, type PaginationEllipsisProps, } from './pagination-ellipsis.svelte';
+export { default as PaginationFirstTrigger, type PaginationFirstTriggerBaseProps, type PaginationFirstTriggerProps, } from './pagination-first-trigger.svelte';
 export { default as PaginationItem, type PaginationItemBaseProps, type PaginationItemProps, } from './pagination-item.svelte';
+export { default as PaginationLastTrigger, type PaginationLastTriggerBaseProps, type PaginationLastTriggerProps, } from './pagination-last-trigger.svelte';
 export { default as PaginationNextTrigger, type PaginationNextTriggerBaseProps, type PaginationNextTriggerProps, } from './pagination-next-trigger.svelte';
 export { default as PaginationPrevTrigger, type PaginationPrevTriggerBaseProps, type PaginationPrevTriggerProps, } from './pagination-prev-trigger.svelte';
 export { default as PaginationRootProvider, type PaginationRootProviderBaseProps, type PaginationRootProviderProps, } from './pagination-root-provider.svelte';

package/dist/components/pagination/index.js

@@ -1,6 +1,8 @@
 export { default as PaginationContext } from './pagination-context.svelte';
 export { default as PaginationEllipsis, } from './pagination-ellipsis.svelte';
+export { default as PaginationFirstTrigger, } from './pagination-first-trigger.svelte';
 export { default as PaginationItem, } from './pagination-item.svelte';
+export { default as PaginationLastTrigger, } from './pagination-last-trigger.svelte';
 export { default as PaginationNextTrigger, } from './pagination-next-trigger.svelte';
 export { default as PaginationPrevTrigger, } from './pagination-prev-trigger.svelte';
 export { default as PaginationRootProvider, } from './pagination-root-provider.svelte';

package/dist/components/pagination/pagination-first-trigger.svelte

@@ -0,0 +1,18 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface PaginationFirstTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
+  export interface PaginationFirstTriggerProps extends Assign<HTMLProps<'button'>, PaginationFirstTriggerBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@zag-js/svelte'
+  import { Ark } from '../factory'
+  import { usePaginationContext } from './use-pagination-context'
+
+  let { ref = $bindable(null), ...props }: PaginationFirstTriggerProps = $props()
+  const pagination = usePaginationContext()
+  const mergedProps = $derived(mergeProps(pagination().getFirstTriggerProps(), props))
+</script>
+
+<Ark as="button" bind:ref {...mergedProps} />

package/dist/components/pagination/pagination-first-trigger.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface PaginationFirstTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
+}
+export interface PaginationFirstTriggerProps extends Assign<HTMLProps<'button'>, PaginationFirstTriggerBaseProps> {
+}
+declare const PaginationFirstTrigger: import("svelte").Component<PaginationFirstTriggerProps, {}, "ref">;
+type PaginationFirstTrigger = ReturnType<typeof PaginationFirstTrigger>;
+export default PaginationFirstTrigger;

package/dist/components/pagination/pagination-last-trigger.svelte

@@ -0,0 +1,18 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface PaginationLastTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
+  export interface PaginationLastTriggerProps extends Assign<HTMLProps<'button'>, PaginationLastTriggerBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '@zag-js/svelte'
+  import { Ark } from '../factory'
+  import { usePaginationContext } from './use-pagination-context'
+
+  let { ref = $bindable(null), ...props }: PaginationLastTriggerProps = $props()
+  const pagination = usePaginationContext()
+  const mergedProps = $derived(mergeProps(pagination().getLastTriggerProps(), props))
+</script>
+
+<Ark as="button" bind:ref {...mergedProps} />

package/dist/components/pagination/pagination-last-trigger.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface PaginationLastTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
+}
+export interface PaginationLastTriggerProps extends Assign<HTMLProps<'button'>, PaginationLastTriggerBaseProps> {
+}
+declare const PaginationLastTrigger: import("svelte").Component<PaginationLastTriggerProps, {}, "ref">;
+type PaginationLastTrigger = ReturnType<typeof PaginationLastTrigger>;
+export default PaginationLastTrigger;

package/dist/components/pagination/pagination-root.svelte

@@ -18,6 +18,7 @@
 
   const [paginationProps, localProps] = $derived(
     createSplitProps<UsePaginationProps>()(props, [
+      'boundaryCount',
       'count',
       'defaultPage',
       'defaultPageSize',

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

@@ -1,7 +1,9 @@
 export type { ItemLabelDetails, PageChangeDetails, PageSizeChangeDetails, PageUrlDetails } from '@zag-js/pagination';
 export { default as Context, type PaginationContextProps as ContextProps } from './pagination-context.svelte';
 export { default as Ellipsis, type PaginationEllipsisBaseProps as EllipsisBaseProps, type PaginationEllipsisProps as EllipsisProps, } from './pagination-ellipsis.svelte';
+export { default as FirstTrigger, type PaginationFirstTriggerBaseProps as FirstTriggerBaseProps, type PaginationFirstTriggerProps as FirstTriggerProps, } from './pagination-first-trigger.svelte';
 export { default as Item, type PaginationItemBaseProps as ItemBaseProps, type PaginationItemProps as ItemProps, } from './pagination-item.svelte';
+export { default as LastTrigger, type PaginationLastTriggerBaseProps as LastTriggerBaseProps, type PaginationLastTriggerProps as LastTriggerProps, } from './pagination-last-trigger.svelte';
 export { default as NextTrigger, type PaginationNextTriggerBaseProps as NextTriggerBaseProps, type PaginationNextTriggerProps as NextTriggerProps, } from './pagination-next-trigger.svelte';
 export { default as PrevTrigger, type PaginationPrevTriggerBaseProps as PrevTriggerBaseProps, type PaginationPrevTriggerProps as PrevTriggerProps, } from './pagination-prev-trigger.svelte';
 export { default as Root, type PaginationRootBaseProps as RootBaseProps, type PaginationRootProps as RootProps, } from './pagination-root.svelte';

package/dist/components/pagination/pagination.js

@@ -1,6 +1,8 @@
 export { default as Context } from './pagination-context.svelte';
 export { default as Ellipsis, } from './pagination-ellipsis.svelte';
+export { default as FirstTrigger, } from './pagination-first-trigger.svelte';
 export { default as Item, } from './pagination-item.svelte';
+export { default as LastTrigger, } from './pagination-last-trigger.svelte';
 export { default as NextTrigger, } from './pagination-next-trigger.svelte';
 export { default as PrevTrigger, } from './pagination-prev-trigger.svelte';
 export { default as Root, } from './pagination-root.svelte';

package/dist/components/password-input/password-input-root-provider.svelte

@@ -1,6 +1,6 @@
 <script module lang="ts">
   import type { Snippet } from 'svelte'
-  import type { RefAttribute } from '../../types'
+  import type { Assign, HTMLProps, RefAttribute } from '../../types'
   import type { UsePasswordInputReturn } from './use-password-input.svelte'
 
   interface RootProviderProps {
@@ -8,7 +8,7 @@
   }
 
   export interface PasswordInputRootProviderBaseProps extends RootProviderProps, RefAttribute {}
-  export interface PasswordInputRootProviderProps extends PasswordInputRootProviderBaseProps {
+  export interface PasswordInputRootProviderProps extends Assign<HTMLProps<'div'>, PasswordInputRootProviderBaseProps> {
     children?: Snippet
   }
 </script>