@ark-ui/svelte 5.14.0 → 5.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/anatomy.d.ts +1 -0
- package/dist/components/anatomy.js +1 -0
- package/dist/components/checkbox/use-checkbox-group.svelte.js +9 -5
- package/dist/components/date-picker/date-picker-root.svelte +3 -1
- package/dist/components/fieldset/fieldset-error-text.svelte +3 -1
- package/dist/components/fieldset/use-fieldset.svelte.d.ts +5 -0
- package/dist/components/fieldset/use-fieldset.svelte.js +5 -0
- package/dist/components/navigation-menu/index.d.ts +18 -0
- package/dist/components/navigation-menu/index.js +17 -0
- package/dist/components/navigation-menu/navigation-menu-arrow.svelte +19 -0
- package/dist/components/navigation-menu/navigation-menu-arrow.svelte.d.ts +8 -0
- package/dist/components/navigation-menu/navigation-menu-content.svelte +63 -0
- package/dist/components/navigation-menu/navigation-menu-content.svelte.d.ts +9 -0
- package/dist/components/navigation-menu/navigation-menu-context.svelte +18 -0
- package/dist/components/navigation-menu/navigation-menu-context.svelte.d.ts +8 -0
- package/dist/components/navigation-menu/navigation-menu-indicator.svelte +29 -0
- package/dist/components/navigation-menu/navigation-menu-indicator.svelte.d.ts +8 -0
- package/dist/components/navigation-menu/navigation-menu-item-indicator.svelte +22 -0
- package/dist/components/navigation-menu/navigation-menu-item-indicator.svelte.d.ts +8 -0
- package/dist/components/navigation-menu/navigation-menu-item.svelte +26 -0
- package/dist/components/navigation-menu/navigation-menu-item.svelte.d.ts +9 -0
- package/dist/components/navigation-menu/navigation-menu-link.svelte +32 -0
- package/dist/components/navigation-menu/navigation-menu-link.svelte.d.ts +9 -0
- package/dist/components/navigation-menu/navigation-menu-list.svelte +19 -0
- package/dist/components/navigation-menu/navigation-menu-list.svelte.d.ts +8 -0
- package/dist/components/navigation-menu/navigation-menu-root-provider.svelte +36 -0
- package/dist/components/navigation-menu/navigation-menu-root-provider.svelte.d.ts +13 -0
- package/dist/components/navigation-menu/navigation-menu-root.svelte +61 -0
- package/dist/components/navigation-menu/navigation-menu-root.svelte.d.ts +10 -0
- package/dist/components/navigation-menu/navigation-menu-trigger.svelte +36 -0
- package/dist/components/navigation-menu/navigation-menu-trigger.svelte.d.ts +9 -0
- package/dist/components/navigation-menu/navigation-menu-viewport-positioner.svelte +29 -0
- package/dist/components/navigation-menu/navigation-menu-viewport-positioner.svelte.d.ts +9 -0
- package/dist/components/navigation-menu/navigation-menu-viewport.svelte +36 -0
- package/dist/components/navigation-menu/navigation-menu-viewport.svelte.d.ts +9 -0
- package/dist/components/navigation-menu/navigation-menu.anatomy.d.ts +1 -0
- package/dist/components/navigation-menu/navigation-menu.anatomy.js +1 -0
- package/dist/components/navigation-menu/navigation-menu.d.ts +14 -0
- package/dist/components/navigation-menu/navigation-menu.js +13 -0
- package/dist/components/navigation-menu/use-navigation-menu-context.d.ts +4 -0
- package/dist/components/navigation-menu/use-navigation-menu-context.js +4 -0
- package/dist/components/navigation-menu/use-navigation-menu-item-props-context.d.ts +3 -0
- package/dist/components/navigation-menu/use-navigation-menu-item-props-context.js +5 -0
- package/dist/components/navigation-menu/use-navigation-menu.svelte.d.ts +9 -0
- package/dist/components/navigation-menu/use-navigation-menu.svelte.js +20 -0
- package/dist/components/number-input/split-number-input-props.svelte.d.ts +1 -1
- package/dist/components/number-input/split-number-input-props.svelte.js +1 -0
- package/dist/components/pagination/index.d.ts +2 -0
- package/dist/components/pagination/index.js +2 -0
- package/dist/components/pagination/pagination-first-trigger.svelte +18 -0
- package/dist/components/pagination/pagination-first-trigger.svelte.d.ts +8 -0
- package/dist/components/pagination/pagination-last-trigger.svelte +18 -0
- package/dist/components/pagination/pagination-last-trigger.svelte.d.ts +8 -0
- package/dist/components/pagination/pagination-root.svelte +1 -0
- package/dist/components/pagination/pagination.d.ts +2 -0
- package/dist/components/pagination/pagination.js +2 -0
- package/dist/components/radio-group/radio-group-root.svelte +2 -0
- package/dist/components/radio-group/use-radio-group.svelte.js +8 -0
- package/dist/components/segment-group/split-segment-group-props.svelte.d.ts +1 -1
- package/dist/components/segment-group/split-segment-group-props.svelte.js +2 -0
- package/dist/components/tree-view/tree-view-split-props.d.ts +1 -1
- package/dist/components/tree-view/tree-view-split-props.js +1 -0
- package/package.json +70 -69
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
|
|
2
|
+
import type { ItemProps } from '@zag-js/navigation-menu';
|
|
3
|
+
export interface NavigationMenuTriggerBaseProps extends Omit<ItemProps, 'value'>, PolymorphicProps<'button'>, RefAttribute {
|
|
4
|
+
}
|
|
5
|
+
export interface NavigationMenuTriggerProps extends Assign<HTMLProps<'button'>, NavigationMenuTriggerBaseProps> {
|
|
6
|
+
}
|
|
7
|
+
declare const NavigationMenuTrigger: import("svelte").Component<NavigationMenuTriggerProps, {}, "ref">;
|
|
8
|
+
type NavigationMenuTrigger = ReturnType<typeof NavigationMenuTrigger>;
|
|
9
|
+
export default NavigationMenuTrigger;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
<script module lang="ts">
|
|
2
|
+
import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
|
|
3
|
+
import type { ViewportProps } from '@zag-js/navigation-menu'
|
|
4
|
+
|
|
5
|
+
export interface NavigationMenuViewportPositionerBaseProps
|
|
6
|
+
extends ViewportProps,
|
|
7
|
+
PolymorphicProps<'div'>,
|
|
8
|
+
RefAttribute {}
|
|
9
|
+
export interface NavigationMenuViewportPositionerProps
|
|
10
|
+
extends Assign<HTMLProps<'div'>, NavigationMenuViewportPositionerBaseProps> {}
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<script lang="ts">
|
|
14
|
+
import { mergeProps } from '@zag-js/svelte'
|
|
15
|
+
import { Ark } from '../factory'
|
|
16
|
+
import { useNavigationMenuContext } from './use-navigation-menu-context'
|
|
17
|
+
import { createSplitProps } from '../../utils/create-split-props'
|
|
18
|
+
|
|
19
|
+
let { ref = $bindable(null), ...props }: NavigationMenuViewportPositionerProps = $props()
|
|
20
|
+
const splitViewportProps = createSplitProps<ViewportProps>()
|
|
21
|
+
const [viewportPositionerProps, localProps] = $derived(splitViewportProps(props, ['align']))
|
|
22
|
+
|
|
23
|
+
const navigationMenu = useNavigationMenuContext()
|
|
24
|
+
const mergedProps = $derived(
|
|
25
|
+
mergeProps(navigationMenu().getViewportPositionerProps(viewportPositionerProps), localProps),
|
|
26
|
+
)
|
|
27
|
+
</script>
|
|
28
|
+
|
|
29
|
+
<Ark as="div" bind:ref {...mergedProps} />
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
|
|
2
|
+
import type { ViewportProps } from '@zag-js/navigation-menu';
|
|
3
|
+
export interface NavigationMenuViewportPositionerBaseProps extends ViewportProps, PolymorphicProps<'div'>, RefAttribute {
|
|
4
|
+
}
|
|
5
|
+
export interface NavigationMenuViewportPositionerProps extends Assign<HTMLProps<'div'>, NavigationMenuViewportPositionerBaseProps> {
|
|
6
|
+
}
|
|
7
|
+
declare const NavigationMenuViewportPositioner: import("svelte").Component<NavigationMenuViewportPositionerProps, {}, "ref">;
|
|
8
|
+
type NavigationMenuViewportPositioner = ReturnType<typeof NavigationMenuViewportPositioner>;
|
|
9
|
+
export default NavigationMenuViewportPositioner;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
<script module lang="ts">
|
|
2
|
+
import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
|
|
3
|
+
import type { ViewportProps } from '@zag-js/navigation-menu'
|
|
4
|
+
|
|
5
|
+
export interface NavigationMenuViewportBaseProps extends ViewportProps, PolymorphicProps<'div'>, RefAttribute {}
|
|
6
|
+
export interface NavigationMenuViewportProps extends Assign<HTMLProps<'div'>, NavigationMenuViewportBaseProps> {}
|
|
7
|
+
</script>
|
|
8
|
+
|
|
9
|
+
<script lang="ts">
|
|
10
|
+
import { mergeProps } from '@zag-js/svelte'
|
|
11
|
+
import { Ark } from '../factory'
|
|
12
|
+
import { usePresence } from '../presence'
|
|
13
|
+
import { useNavigationMenuContext } from './use-navigation-menu-context'
|
|
14
|
+
import { useRenderStrategyPropsContext } from '../../utils/render-strategy'
|
|
15
|
+
import { createSplitProps } from '../../utils/create-split-props'
|
|
16
|
+
|
|
17
|
+
let { ref = $bindable(null), ...props }: NavigationMenuViewportProps = $props()
|
|
18
|
+
|
|
19
|
+
const splitViewportProps = createSplitProps<ViewportProps>()
|
|
20
|
+
const [viewportProps, localProps] = $derived(splitViewportProps(props, ['align']))
|
|
21
|
+
|
|
22
|
+
const navigationMenu = useNavigationMenuContext()
|
|
23
|
+
const renderStrategyProps = useRenderStrategyPropsContext()
|
|
24
|
+
const presence = usePresence(() => ({ ...renderStrategyProps, present: navigationMenu().open }))
|
|
25
|
+
const mergedProps = $derived(
|
|
26
|
+
mergeProps(navigationMenu().getViewportProps(viewportProps), presence().getPresenceProps(), localProps),
|
|
27
|
+
)
|
|
28
|
+
|
|
29
|
+
function setNode(node: Element | null) {
|
|
30
|
+
presence().setNode(node)
|
|
31
|
+
}
|
|
32
|
+
</script>
|
|
33
|
+
|
|
34
|
+
{#if !presence().unmounted}
|
|
35
|
+
<Ark as="div" bind:ref {...mergedProps} {@attach setNode} />
|
|
36
|
+
{/if}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
|
|
2
|
+
import type { ViewportProps } from '@zag-js/navigation-menu';
|
|
3
|
+
export interface NavigationMenuViewportBaseProps extends ViewportProps, PolymorphicProps<'div'>, RefAttribute {
|
|
4
|
+
}
|
|
5
|
+
export interface NavigationMenuViewportProps extends Assign<HTMLProps<'div'>, NavigationMenuViewportBaseProps> {
|
|
6
|
+
}
|
|
7
|
+
declare const NavigationMenuViewport: import("svelte").Component<NavigationMenuViewportProps, {}, "ref">;
|
|
8
|
+
type NavigationMenuViewport = ReturnType<typeof NavigationMenuViewport>;
|
|
9
|
+
export default NavigationMenuViewport;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { anatomy as navigationMenuAnatomy } from '@zag-js/navigation-menu';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { anatomy as navigationMenuAnatomy } from '@zag-js/navigation-menu';
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export type { ValueChangeDetails } from '@zag-js/navigation-menu';
|
|
2
|
+
export { default as Arrow, type NavigationMenuArrowBaseProps as ArrowBaseProps, type NavigationMenuArrowProps as ArrowProps, } from './navigation-menu-arrow.svelte';
|
|
3
|
+
export { default as Content, type NavigationMenuContentBaseProps as ContentBaseProps, type NavigationMenuContentProps as ContentProps, } from './navigation-menu-content.svelte';
|
|
4
|
+
export { default as Context, type NavigationMenuContextProps as ContextProps } from './navigation-menu-context.svelte';
|
|
5
|
+
export { default as Indicator, type NavigationMenuIndicatorBaseProps as IndicatorBaseProps, type NavigationMenuIndicatorProps as IndicatorProps, } from './navigation-menu-indicator.svelte';
|
|
6
|
+
export { default as Item, type NavigationMenuItemBaseProps as ItemBaseProps, type NavigationMenuItemProps as ItemProps, } from './navigation-menu-item.svelte';
|
|
7
|
+
export { default as ItemIndicator, type NavigationMenuItemIndicatorBaseProps as ItemIndicatorBaseProps, type NavigationMenuItemIndicatorProps as ItemIndicatorProps, } from './navigation-menu-item-indicator.svelte';
|
|
8
|
+
export { default as Link, type NavigationMenuLinkBaseProps as LinkBaseProps, type NavigationMenuLinkProps as LinkProps, } from './navigation-menu-link.svelte';
|
|
9
|
+
export { default as List, type NavigationMenuListBaseProps as ListBaseProps, type NavigationMenuListProps as ListProps, } from './navigation-menu-list.svelte';
|
|
10
|
+
export { default as Root, type NavigationMenuRootBaseProps as RootBaseProps, type NavigationMenuRootProps as RootProps, } from './navigation-menu-root.svelte';
|
|
11
|
+
export { default as RootProvider, type NavigationMenuRootProviderBaseProps as RootProviderBaseProps, type NavigationMenuRootProviderProps as RootProviderProps, } from './navigation-menu-root-provider.svelte';
|
|
12
|
+
export { default as Trigger, type NavigationMenuTriggerBaseProps as TriggerBaseProps, type NavigationMenuTriggerProps as TriggerProps, } from './navigation-menu-trigger.svelte';
|
|
13
|
+
export { default as Viewport, type NavigationMenuViewportBaseProps as ViewportBaseProps, type NavigationMenuViewportProps as ViewportProps, } from './navigation-menu-viewport.svelte';
|
|
14
|
+
export { default as ViewportPositioner, type NavigationMenuViewportPositionerBaseProps as ViewportPositionerBaseProps, type NavigationMenuViewportPositionerProps as ViewportPositionerProps, } from './navigation-menu-viewport-positioner.svelte';
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export { default as Arrow, } from './navigation-menu-arrow.svelte';
|
|
2
|
+
export { default as Content, } from './navigation-menu-content.svelte';
|
|
3
|
+
export { default as Context } from './navigation-menu-context.svelte';
|
|
4
|
+
export { default as Indicator, } from './navigation-menu-indicator.svelte';
|
|
5
|
+
export { default as Item, } from './navigation-menu-item.svelte';
|
|
6
|
+
export { default as ItemIndicator, } from './navigation-menu-item-indicator.svelte';
|
|
7
|
+
export { default as Link, } from './navigation-menu-link.svelte';
|
|
8
|
+
export { default as List, } from './navigation-menu-list.svelte';
|
|
9
|
+
export { default as Root, } from './navigation-menu-root.svelte';
|
|
10
|
+
export { default as RootProvider, } from './navigation-menu-root-provider.svelte';
|
|
11
|
+
export { default as Trigger, } from './navigation-menu-trigger.svelte';
|
|
12
|
+
export { default as Viewport, } from './navigation-menu-viewport.svelte';
|
|
13
|
+
export { default as ViewportPositioner, } from './navigation-menu-viewport-positioner.svelte';
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { UseNavigationMenuReturn } from './use-navigation-menu.svelte';
|
|
2
|
+
export interface UseNavigationMenuContext extends UseNavigationMenuReturn {
|
|
3
|
+
}
|
|
4
|
+
export declare const NavigationMenuProvider: (opts: UseNavigationMenuContext) => void, useNavigationMenuContext: (fallback?: UseNavigationMenuContext | undefined) => UseNavigationMenuContext;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import type { ItemProps } from '@zag-js/navigation-menu';
|
|
2
|
+
import type { Accessor } from '../../types';
|
|
3
|
+
export declare const NavigationMenuItemPropsProvider: (opts: Accessor<ItemProps>) => void, useNavigationMenuItemPropsContext: (fallback?: Accessor<ItemProps> | undefined) => Accessor<ItemProps>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { Accessor, Optional } from '../../types';
|
|
2
|
+
import { type PropTypes } from '@zag-js/svelte';
|
|
3
|
+
import * as navigationMenu from '@zag-js/navigation-menu';
|
|
4
|
+
import { type MaybeFunction } from '@zag-js/utils';
|
|
5
|
+
export interface UseNavigationMenuProps extends Optional<Omit<navigationMenu.Props, 'dir' | 'getRootNode'>, 'id'> {
|
|
6
|
+
}
|
|
7
|
+
export interface UseNavigationMenuReturn extends Accessor<navigationMenu.Api<PropTypes>> {
|
|
8
|
+
}
|
|
9
|
+
export declare const useNavigationMenu: (props?: MaybeFunction<UseNavigationMenuProps>) => UseNavigationMenuReturn;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { useEnvironmentContext } from '../../providers/environment';
|
|
2
|
+
import { useLocaleContext } from '../../providers/locale';
|
|
3
|
+
import { normalizeProps, useMachine } from '@zag-js/svelte';
|
|
4
|
+
import * as navigationMenu from '@zag-js/navigation-menu';
|
|
5
|
+
import { runIfFn } from '@zag-js/utils';
|
|
6
|
+
export const useNavigationMenu = (props) => {
|
|
7
|
+
const env = useEnvironmentContext();
|
|
8
|
+
const locale = useLocaleContext();
|
|
9
|
+
const machineProps = $derived.by(() => {
|
|
10
|
+
const resolvedProps = runIfFn(props);
|
|
11
|
+
return {
|
|
12
|
+
dir: locale().dir,
|
|
13
|
+
getRootNode: env().getRootNode,
|
|
14
|
+
...resolvedProps,
|
|
15
|
+
};
|
|
16
|
+
});
|
|
17
|
+
const service = useMachine(navigationMenu.machine, () => machineProps);
|
|
18
|
+
const api = $derived(navigationMenu.connect(service, normalizeProps));
|
|
19
|
+
return () => api;
|
|
20
|
+
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import type { UseNumberInputProps } from './use-number-input.svelte';
|
|
2
|
-
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">];
|
|
2
|
+
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">];
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
export type { ItemLabelDetails as PaginationItemLabelDetails, PageChangeDetails as PaginationPageChangeDetails, PageSizeChangeDetails as PaginationPageSizeChangeDetails, PageUrlDetails as PaginationPageUrlDetails, } from '@zag-js/pagination';
|
|
2
2
|
export { default as PaginationContext, type PaginationContextProps } from './pagination-context.svelte';
|
|
3
3
|
export { default as PaginationEllipsis, type PaginationEllipsisBaseProps, type PaginationEllipsisProps, } from './pagination-ellipsis.svelte';
|
|
4
|
+
export { default as PaginationFirstTrigger, type PaginationFirstTriggerBaseProps, type PaginationFirstTriggerProps, } from './pagination-first-trigger.svelte';
|
|
4
5
|
export { default as PaginationItem, type PaginationItemBaseProps, type PaginationItemProps, } from './pagination-item.svelte';
|
|
6
|
+
export { default as PaginationLastTrigger, type PaginationLastTriggerBaseProps, type PaginationLastTriggerProps, } from './pagination-last-trigger.svelte';
|
|
5
7
|
export { default as PaginationNextTrigger, type PaginationNextTriggerBaseProps, type PaginationNextTriggerProps, } from './pagination-next-trigger.svelte';
|
|
6
8
|
export { default as PaginationPrevTrigger, type PaginationPrevTriggerBaseProps, type PaginationPrevTriggerProps, } from './pagination-prev-trigger.svelte';
|
|
7
9
|
export { default as PaginationRootProvider, type PaginationRootProviderBaseProps, type PaginationRootProviderProps, } from './pagination-root-provider.svelte';
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
export { default as PaginationContext } from './pagination-context.svelte';
|
|
2
2
|
export { default as PaginationEllipsis, } from './pagination-ellipsis.svelte';
|
|
3
|
+
export { default as PaginationFirstTrigger, } from './pagination-first-trigger.svelte';
|
|
3
4
|
export { default as PaginationItem, } from './pagination-item.svelte';
|
|
5
|
+
export { default as PaginationLastTrigger, } from './pagination-last-trigger.svelte';
|
|
4
6
|
export { default as PaginationNextTrigger, } from './pagination-next-trigger.svelte';
|
|
5
7
|
export { default as PaginationPrevTrigger, } from './pagination-prev-trigger.svelte';
|
|
6
8
|
export { default as PaginationRootProvider, } from './pagination-root-provider.svelte';
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
<script module lang="ts">
|
|
2
|
+
import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
|
|
3
|
+
|
|
4
|
+
export interface PaginationFirstTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
|
|
5
|
+
export interface PaginationFirstTriggerProps extends Assign<HTMLProps<'button'>, PaginationFirstTriggerBaseProps> {}
|
|
6
|
+
</script>
|
|
7
|
+
|
|
8
|
+
<script lang="ts">
|
|
9
|
+
import { mergeProps } from '@zag-js/svelte'
|
|
10
|
+
import { Ark } from '../factory'
|
|
11
|
+
import { usePaginationContext } from './use-pagination-context'
|
|
12
|
+
|
|
13
|
+
let { ref = $bindable(null), ...props }: PaginationFirstTriggerProps = $props()
|
|
14
|
+
const pagination = usePaginationContext()
|
|
15
|
+
const mergedProps = $derived(mergeProps(pagination().getFirstTriggerProps(), props))
|
|
16
|
+
</script>
|
|
17
|
+
|
|
18
|
+
<Ark as="button" bind:ref {...mergedProps} />
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
|
|
2
|
+
export interface PaginationFirstTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
|
|
3
|
+
}
|
|
4
|
+
export interface PaginationFirstTriggerProps extends Assign<HTMLProps<'button'>, PaginationFirstTriggerBaseProps> {
|
|
5
|
+
}
|
|
6
|
+
declare const PaginationFirstTrigger: import("svelte").Component<PaginationFirstTriggerProps, {}, "ref">;
|
|
7
|
+
type PaginationFirstTrigger = ReturnType<typeof PaginationFirstTrigger>;
|
|
8
|
+
export default PaginationFirstTrigger;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
<script module lang="ts">
|
|
2
|
+
import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
|
|
3
|
+
|
|
4
|
+
export interface PaginationLastTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
|
|
5
|
+
export interface PaginationLastTriggerProps extends Assign<HTMLProps<'button'>, PaginationLastTriggerBaseProps> {}
|
|
6
|
+
</script>
|
|
7
|
+
|
|
8
|
+
<script lang="ts">
|
|
9
|
+
import { mergeProps } from '@zag-js/svelte'
|
|
10
|
+
import { Ark } from '../factory'
|
|
11
|
+
import { usePaginationContext } from './use-pagination-context'
|
|
12
|
+
|
|
13
|
+
let { ref = $bindable(null), ...props }: PaginationLastTriggerProps = $props()
|
|
14
|
+
const pagination = usePaginationContext()
|
|
15
|
+
const mergedProps = $derived(mergeProps(pagination().getLastTriggerProps(), props))
|
|
16
|
+
</script>
|
|
17
|
+
|
|
18
|
+
<Ark as="button" bind:ref {...mergedProps} />
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
|
|
2
|
+
export interface PaginationLastTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
|
|
3
|
+
}
|
|
4
|
+
export interface PaginationLastTriggerProps extends Assign<HTMLProps<'button'>, PaginationLastTriggerBaseProps> {
|
|
5
|
+
}
|
|
6
|
+
declare const PaginationLastTrigger: import("svelte").Component<PaginationLastTriggerProps, {}, "ref">;
|
|
7
|
+
type PaginationLastTrigger = ReturnType<typeof PaginationLastTrigger>;
|
|
8
|
+
export default PaginationLastTrigger;
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
export type { ItemLabelDetails, PageChangeDetails, PageSizeChangeDetails, PageUrlDetails } from '@zag-js/pagination';
|
|
2
2
|
export { default as Context, type PaginationContextProps as ContextProps } from './pagination-context.svelte';
|
|
3
3
|
export { default as Ellipsis, type PaginationEllipsisBaseProps as EllipsisBaseProps, type PaginationEllipsisProps as EllipsisProps, } from './pagination-ellipsis.svelte';
|
|
4
|
+
export { default as FirstTrigger, type PaginationFirstTriggerBaseProps as FirstTriggerBaseProps, type PaginationFirstTriggerProps as FirstTriggerProps, } from './pagination-first-trigger.svelte';
|
|
4
5
|
export { default as Item, type PaginationItemBaseProps as ItemBaseProps, type PaginationItemProps as ItemProps, } from './pagination-item.svelte';
|
|
6
|
+
export { default as LastTrigger, type PaginationLastTriggerBaseProps as LastTriggerBaseProps, type PaginationLastTriggerProps as LastTriggerProps, } from './pagination-last-trigger.svelte';
|
|
5
7
|
export { default as NextTrigger, type PaginationNextTriggerBaseProps as NextTriggerBaseProps, type PaginationNextTriggerProps as NextTriggerProps, } from './pagination-next-trigger.svelte';
|
|
6
8
|
export { default as PrevTrigger, type PaginationPrevTriggerBaseProps as PrevTriggerBaseProps, type PaginationPrevTriggerProps as PrevTriggerProps, } from './pagination-prev-trigger.svelte';
|
|
7
9
|
export { default as Root, type PaginationRootBaseProps as RootBaseProps, type PaginationRootProps as RootProps, } from './pagination-root.svelte';
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
export { default as Context } from './pagination-context.svelte';
|
|
2
2
|
export { default as Ellipsis, } from './pagination-ellipsis.svelte';
|
|
3
|
+
export { default as FirstTrigger, } from './pagination-first-trigger.svelte';
|
|
3
4
|
export { default as Item, } from './pagination-item.svelte';
|
|
5
|
+
export { default as LastTrigger, } from './pagination-last-trigger.svelte';
|
|
4
6
|
export { default as NextTrigger, } from './pagination-next-trigger.svelte';
|
|
5
7
|
export { default as PrevTrigger, } from './pagination-prev-trigger.svelte';
|
|
6
8
|
export { default as Root, } from './pagination-root.svelte';
|
|
@@ -2,13 +2,21 @@ import * as radio from '@zag-js/radio-group';
|
|
|
2
2
|
import { normalizeProps, useMachine } from '@zag-js/svelte';
|
|
3
3
|
import { runIfFn } from '@zag-js/utils';
|
|
4
4
|
import { useEnvironmentContext, useLocaleContext } from '../../providers';
|
|
5
|
+
import { useFieldsetContext } from '../fieldset';
|
|
5
6
|
export const useRadioGroup = (props) => {
|
|
6
7
|
const env = useEnvironmentContext();
|
|
7
8
|
const locale = useLocaleContext();
|
|
9
|
+
const fieldset = useFieldsetContext();
|
|
8
10
|
const resolvedProps = $derived.by(() => {
|
|
9
11
|
const localProps = runIfFn(props);
|
|
12
|
+
const fieldsetContext = fieldset?.();
|
|
10
13
|
return {
|
|
14
|
+
ids: {
|
|
15
|
+
label: fieldsetContext?.ids?.legend,
|
|
16
|
+
},
|
|
11
17
|
dir: locale().dir,
|
|
18
|
+
disabled: fieldsetContext?.disabled,
|
|
19
|
+
invalid: fieldsetContext?.invalid,
|
|
12
20
|
getRootNode: env().getRootNode,
|
|
13
21
|
...localProps,
|
|
14
22
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import type { UseSegmentGroupProps } from './use-segment-group.svelte';
|
|
2
|
-
export declare const splitSegmentGroupProps: <T extends UseSegmentGroupProps>(props: T) => [UseSegmentGroupProps, Omit<T, "form" | "name" | "defaultValue" | "value" | "ids" | "disabled" | "id" | "onValueChange" | "orientation" | "readOnly">];
|
|
2
|
+
export declare const splitSegmentGroupProps: <T extends UseSegmentGroupProps>(props: T) => [UseSegmentGroupProps, Omit<T, "form" | "name" | "defaultValue" | "value" | "ids" | "disabled" | "id" | "onValueChange" | "orientation" | "readOnly" | "invalid" | "required">];
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { TreeNode } from '../collection';
|
|
2
2
|
import type { UseTreeViewProps } from './use-tree-view.svelte';
|
|
3
|
-
export declare function splitTreeViewProps<T extends UseTreeViewProps<TreeNode>>(props: T): [UseTreeViewProps<any>, Omit<T, "ids" | "id" | "onFocusChange" | "onCheckedChange" | "collection" | "selectionMode" | "focusedValue" | "defaultFocusedValue" | "expandedValue" | "defaultExpandedValue" | "selectedValue" | "defaultSelectedValue" | "defaultCheckedValue" | "checkedValue" | "onExpandedChange" | "onSelectionChange" | "canRename" | "onRenameStart" | "onBeforeRename" | "onRenameComplete" | "onLoadChildrenComplete" | "onLoadChildrenError" | "expandOnClick" | "typeahead" | "loadChildren">];
|
|
3
|
+
export declare function splitTreeViewProps<T extends UseTreeViewProps<TreeNode>>(props: T): [UseTreeViewProps<any>, Omit<T, "ids" | "id" | "onFocusChange" | "onCheckedChange" | "collection" | "selectionMode" | "scrollToIndexFn" | "focusedValue" | "defaultFocusedValue" | "expandedValue" | "defaultExpandedValue" | "selectedValue" | "defaultSelectedValue" | "defaultCheckedValue" | "checkedValue" | "onExpandedChange" | "onSelectionChange" | "canRename" | "onRenameStart" | "onBeforeRename" | "onRenameComplete" | "onLoadChildrenComplete" | "onLoadChildrenError" | "expandOnClick" | "typeahead" | "loadChildren">];
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ark-ui/svelte",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "5.
|
|
4
|
+
"version": "5.15.0",
|
|
5
5
|
"description": "A collection of unstyled, accessible UI components for Svelte",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"accordion",
|
|
@@ -137,78 +137,79 @@
|
|
|
137
137
|
"sideEffects": false,
|
|
138
138
|
"dependencies": {
|
|
139
139
|
"@internationalized/date": "3.10.0",
|
|
140
|
-
"@zag-js/accordion": "1.
|
|
141
|
-
"@zag-js/anatomy": "1.
|
|
142
|
-
"@zag-js/angle-slider": "1.
|
|
143
|
-
"@zag-js/async-list": "1.
|
|
144
|
-
"@zag-js/auto-resize": "1.
|
|
145
|
-
"@zag-js/avatar": "1.
|
|
146
|
-
"@zag-js/bottom-sheet": "1.
|
|
147
|
-
"@zag-js/carousel": "1.
|
|
148
|
-
"@zag-js/checkbox": "1.
|
|
149
|
-
"@zag-js/clipboard": "1.
|
|
150
|
-
"@zag-js/collapsible": "1.
|
|
151
|
-
"@zag-js/collection": "1.
|
|
152
|
-
"@zag-js/color-picker": "1.
|
|
153
|
-
"@zag-js/color-utils": "1.
|
|
154
|
-
"@zag-js/combobox": "1.
|
|
155
|
-
"@zag-js/core": "1.
|
|
156
|
-
"@zag-js/date-picker": "1.
|
|
157
|
-
"@zag-js/date-utils": "1.
|
|
158
|
-
"@zag-js/dialog": "1.
|
|
159
|
-
"@zag-js/dom-query": "1.
|
|
160
|
-
"@zag-js/editable": "1.
|
|
161
|
-
"@zag-js/file-upload": "1.
|
|
162
|
-
"@zag-js/file-utils": "1.
|
|
163
|
-
"@zag-js/floating-panel": "1.
|
|
164
|
-
"@zag-js/focus-trap": "1.
|
|
165
|
-
"@zag-js/highlight-word": "1.
|
|
166
|
-
"@zag-js/hover-card": "1.
|
|
167
|
-
"@zag-js/image-cropper": "1.
|
|
168
|
-
"@zag-js/i18n-utils": "1.
|
|
169
|
-
"@zag-js/json-tree-utils": "1.
|
|
170
|
-
"@zag-js/listbox": "1.
|
|
171
|
-
"@zag-js/marquee": "1.
|
|
172
|
-
"@zag-js/menu": "1.
|
|
173
|
-
"@zag-js/
|
|
174
|
-
"@zag-js/
|
|
175
|
-
"@zag-js/
|
|
176
|
-
"@zag-js/
|
|
177
|
-
"@zag-js/
|
|
178
|
-
"@zag-js/
|
|
179
|
-
"@zag-js/
|
|
180
|
-
"@zag-js/
|
|
181
|
-
"@zag-js/
|
|
182
|
-
"@zag-js/
|
|
183
|
-
"@zag-js/
|
|
184
|
-
"@zag-js/
|
|
185
|
-
"@zag-js/
|
|
186
|
-
"@zag-js/
|
|
187
|
-
"@zag-js/
|
|
188
|
-
"@zag-js/
|
|
189
|
-
"@zag-js/
|
|
190
|
-
"@zag-js/
|
|
191
|
-
"@zag-js/
|
|
192
|
-
"@zag-js/
|
|
193
|
-
"@zag-js/
|
|
194
|
-
"@zag-js/
|
|
195
|
-
"@zag-js/
|
|
196
|
-
"@zag-js/toggle
|
|
197
|
-
"@zag-js/
|
|
198
|
-
"@zag-js/
|
|
199
|
-
"@zag-js/
|
|
200
|
-
"@zag-js/
|
|
201
|
-
"@zag-js/
|
|
140
|
+
"@zag-js/accordion": "1.31.1",
|
|
141
|
+
"@zag-js/anatomy": "1.31.1",
|
|
142
|
+
"@zag-js/angle-slider": "1.31.1",
|
|
143
|
+
"@zag-js/async-list": "1.31.1",
|
|
144
|
+
"@zag-js/auto-resize": "1.31.1",
|
|
145
|
+
"@zag-js/avatar": "1.31.1",
|
|
146
|
+
"@zag-js/bottom-sheet": "1.31.1",
|
|
147
|
+
"@zag-js/carousel": "1.31.1",
|
|
148
|
+
"@zag-js/checkbox": "1.31.1",
|
|
149
|
+
"@zag-js/clipboard": "1.31.1",
|
|
150
|
+
"@zag-js/collapsible": "1.31.1",
|
|
151
|
+
"@zag-js/collection": "1.31.1",
|
|
152
|
+
"@zag-js/color-picker": "1.31.1",
|
|
153
|
+
"@zag-js/color-utils": "1.31.1",
|
|
154
|
+
"@zag-js/combobox": "1.31.1",
|
|
155
|
+
"@zag-js/core": "1.31.1",
|
|
156
|
+
"@zag-js/date-picker": "1.31.1",
|
|
157
|
+
"@zag-js/date-utils": "1.31.1",
|
|
158
|
+
"@zag-js/dialog": "1.31.1",
|
|
159
|
+
"@zag-js/dom-query": "1.31.1",
|
|
160
|
+
"@zag-js/editable": "1.31.1",
|
|
161
|
+
"@zag-js/file-upload": "1.31.1",
|
|
162
|
+
"@zag-js/file-utils": "1.31.1",
|
|
163
|
+
"@zag-js/floating-panel": "1.31.1",
|
|
164
|
+
"@zag-js/focus-trap": "1.31.1",
|
|
165
|
+
"@zag-js/highlight-word": "1.31.1",
|
|
166
|
+
"@zag-js/hover-card": "1.31.1",
|
|
167
|
+
"@zag-js/image-cropper": "1.31.1",
|
|
168
|
+
"@zag-js/i18n-utils": "1.31.1",
|
|
169
|
+
"@zag-js/json-tree-utils": "1.31.1",
|
|
170
|
+
"@zag-js/listbox": "1.31.1",
|
|
171
|
+
"@zag-js/marquee": "1.31.1",
|
|
172
|
+
"@zag-js/menu": "1.31.1",
|
|
173
|
+
"@zag-js/navigation-menu": "1.31.1",
|
|
174
|
+
"@zag-js/number-input": "1.31.1",
|
|
175
|
+
"@zag-js/pagination": "1.31.1",
|
|
176
|
+
"@zag-js/password-input": "1.31.1",
|
|
177
|
+
"@zag-js/pin-input": "1.31.1",
|
|
178
|
+
"@zag-js/popover": "1.31.1",
|
|
179
|
+
"@zag-js/presence": "1.31.1",
|
|
180
|
+
"@zag-js/progress": "1.31.1",
|
|
181
|
+
"@zag-js/qr-code": "1.31.1",
|
|
182
|
+
"@zag-js/radio-group": "1.31.1",
|
|
183
|
+
"@zag-js/rating-group": "1.31.1",
|
|
184
|
+
"@zag-js/scroll-area": "1.31.1",
|
|
185
|
+
"@zag-js/select": "1.31.1",
|
|
186
|
+
"@zag-js/signature-pad": "1.31.1",
|
|
187
|
+
"@zag-js/slider": "1.31.1",
|
|
188
|
+
"@zag-js/splitter": "1.31.1",
|
|
189
|
+
"@zag-js/steps": "1.31.1",
|
|
190
|
+
"@zag-js/svelte": "1.31.1",
|
|
191
|
+
"@zag-js/switch": "1.31.1",
|
|
192
|
+
"@zag-js/tabs": "1.31.1",
|
|
193
|
+
"@zag-js/tags-input": "1.31.1",
|
|
194
|
+
"@zag-js/timer": "1.31.1",
|
|
195
|
+
"@zag-js/toast": "1.31.1",
|
|
196
|
+
"@zag-js/toggle": "1.31.1",
|
|
197
|
+
"@zag-js/toggle-group": "1.31.1",
|
|
198
|
+
"@zag-js/tooltip": "1.31.1",
|
|
199
|
+
"@zag-js/tour": "1.31.1",
|
|
200
|
+
"@zag-js/tree-view": "1.31.1",
|
|
201
|
+
"@zag-js/types": "1.31.1",
|
|
202
|
+
"@zag-js/utils": "1.31.1"
|
|
202
203
|
},
|
|
203
204
|
"devDependencies": {
|
|
204
205
|
"@storybook/addon-a11y": "9.1.16",
|
|
205
206
|
"@storybook/svelte": "9.1.16",
|
|
206
207
|
"@storybook/sveltekit": "9.1.16",
|
|
207
208
|
"@sveltejs/adapter-auto": "7.0.0",
|
|
208
|
-
"@sveltejs/kit": "2.
|
|
209
|
-
"@sveltejs/package": "2.5.
|
|
209
|
+
"@sveltejs/kit": "2.49.0",
|
|
210
|
+
"@sveltejs/package": "2.5.7",
|
|
210
211
|
"@sveltejs/vite-plugin-svelte": "6.2.1",
|
|
211
|
-
"@tanstack/svelte-form": "1.
|
|
212
|
+
"@tanstack/svelte-form": "1.26.0",
|
|
212
213
|
"@testing-library/dom": "10.4.1",
|
|
213
214
|
"@testing-library/jest-dom": "6.9.1",
|
|
214
215
|
"@testing-library/svelte": "5.2.9",
|
|
@@ -218,13 +219,13 @@
|
|
|
218
219
|
"clean-package": "2.2.0",
|
|
219
220
|
"image-conversion": "2.1.1",
|
|
220
221
|
"jsdom": "26.1.0",
|
|
221
|
-
"lucide-svelte": "0.
|
|
222
|
+
"lucide-svelte": "0.555.0",
|
|
222
223
|
"storybook": "9.1.16",
|
|
223
|
-
"svelte": "5.
|
|
224
|
+
"svelte": "5.45.2",
|
|
224
225
|
"svelte-check": "4.3.4",
|
|
225
226
|
"tslib": "2.8.1",
|
|
226
227
|
"typescript": "5.9.3",
|
|
227
|
-
"vite": "7.2.
|
|
228
|
+
"vite": "7.2.4",
|
|
228
229
|
"vitest": "^4.0.0",
|
|
229
230
|
"vitest-axe": "1.0.0-pre.5"
|
|
230
231
|
},
|