@ark-ui/svelte 5.10.0 → 5.10.1

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.
Files changed (57) hide show
  1. package/dist/components/anatomy.d.ts +1 -0
  2. package/dist/components/anatomy.js +1 -0
  3. package/dist/components/angle-slider/use-angle-slider.svelte.d.ts +1 -1
  4. package/dist/components/avatar/use-avatar.svelte.d.ts +1 -1
  5. package/dist/components/bottom-sheet/bottom-sheet-backdrop.svelte +32 -0
  6. package/dist/components/bottom-sheet/bottom-sheet-backdrop.svelte.d.ts +9 -0
  7. package/dist/components/bottom-sheet/bottom-sheet-close-trigger.svelte +19 -0
  8. package/dist/components/bottom-sheet/bottom-sheet-close-trigger.svelte.d.ts +8 -0
  9. package/dist/components/bottom-sheet/bottom-sheet-content.svelte +39 -0
  10. package/dist/components/bottom-sheet/bottom-sheet-content.svelte.d.ts +10 -0
  11. package/dist/components/bottom-sheet/bottom-sheet-context.svelte +18 -0
  12. package/dist/components/bottom-sheet/bottom-sheet-context.svelte.d.ts +8 -0
  13. package/dist/components/bottom-sheet/bottom-sheet-grabber-indicator.svelte +20 -0
  14. package/dist/components/bottom-sheet/bottom-sheet-grabber-indicator.svelte.d.ts +8 -0
  15. package/dist/components/bottom-sheet/bottom-sheet-grabber.svelte +19 -0
  16. package/dist/components/bottom-sheet/bottom-sheet-grabber.svelte.d.ts +8 -0
  17. package/dist/components/bottom-sheet/bottom-sheet-root-provider.svelte +36 -0
  18. package/dist/components/bottom-sheet/bottom-sheet-root-provider.svelte.d.ts +11 -0
  19. package/dist/components/bottom-sheet/bottom-sheet-root.svelte +52 -0
  20. package/dist/components/bottom-sheet/bottom-sheet-root.svelte.d.ts +11 -0
  21. package/dist/components/bottom-sheet/bottom-sheet-title.svelte +19 -0
  22. package/dist/components/bottom-sheet/bottom-sheet-title.svelte.d.ts +8 -0
  23. package/dist/components/bottom-sheet/bottom-sheet-trigger.svelte +29 -0
  24. package/dist/components/bottom-sheet/bottom-sheet-trigger.svelte.d.ts +8 -0
  25. package/dist/components/bottom-sheet/bottom-sheet.anatomy.d.ts +1 -0
  26. package/dist/components/bottom-sheet/bottom-sheet.anatomy.js +1 -0
  27. package/dist/components/bottom-sheet/bottom-sheet.d.ts +11 -0
  28. package/dist/components/bottom-sheet/bottom-sheet.js +10 -0
  29. package/dist/components/bottom-sheet/index.d.ts +15 -0
  30. package/dist/components/bottom-sheet/index.js +14 -0
  31. package/dist/components/bottom-sheet/use-bottom-sheet-context.d.ts +4 -0
  32. package/dist/components/bottom-sheet/use-bottom-sheet-context.js +4 -0
  33. package/dist/components/bottom-sheet/use-bottom-sheet.svelte.d.ts +9 -0
  34. package/dist/components/bottom-sheet/use-bottom-sheet.svelte.js +20 -0
  35. package/dist/components/carousel/use-carousel.svelte.d.ts +1 -1
  36. package/dist/components/checkbox/checkbox.anatomy.d.ts +1 -1
  37. package/dist/components/color-picker/color-picker.anatomy.d.ts +1 -1
  38. package/dist/components/color-picker/split-color-picker-props.svelte.d.ts +1 -1
  39. package/dist/components/combobox/combobox.anatomy.d.ts +1 -1
  40. package/dist/components/date-picker/date-picker.anatomy.d.ts +1 -1
  41. package/dist/components/editable/editable-split-props.d.ts +1 -1
  42. package/dist/components/format/format-byte.svelte +4 -0
  43. package/dist/components/format/format-byte.svelte.d.ts +4 -0
  44. package/dist/components/index.d.ts +1 -0
  45. package/dist/components/index.js +1 -0
  46. package/dist/components/listbox/listbox.anatomy.d.ts +1 -1
  47. package/dist/components/progress/use-progress.svelte.d.ts +1 -1
  48. package/dist/components/qr-code/use-qr-code.svelte.d.ts +1 -1
  49. package/dist/components/segment-group/segment-group.anatomy.d.ts +2 -2
  50. package/dist/components/select/select-positioner.svelte +5 -1
  51. package/dist/components/signature-pad/use-signature-pad.svelte.d.ts +1 -1
  52. package/dist/components/slider/use-slider.svelte.d.ts +1 -1
  53. package/dist/components/steps/use-steps.svelte.d.ts +1 -1
  54. package/dist/components/switch/use-switch.svelte.d.ts +1 -1
  55. package/dist/components/timer/use-timer.svelte.d.ts +1 -1
  56. package/dist/components/tour/tour.anatomy.d.ts +1 -1
  57. package/package.json +88 -75
@@ -2,6 +2,7 @@ export * from '@zag-js/anatomy';
2
2
  export { accordionAnatomy } from './accordion/accordion.anatomy';
3
3
  export { angleSliderAnatomy } from './angle-slider/angle-slider.anatomy';
4
4
  export { avatarAnatomy } from './avatar/avatar.anatomy';
5
+ export { bottomSheetAnatomy } from './bottom-sheet/bottom-sheet.anatomy';
5
6
  export { carouselAnatomy } from './carousel/carousel.anatomy';
6
7
  export { checkboxAnatomy } from './checkbox/checkbox.anatomy';
7
8
  export { clipboardAnatomy } from './clipboard/clipboard.anatomy';
@@ -2,6 +2,7 @@ export * from '@zag-js/anatomy';
2
2
  export { accordionAnatomy } from './accordion/accordion.anatomy';
3
3
  export { angleSliderAnatomy } from './angle-slider/angle-slider.anatomy';
4
4
  export { avatarAnatomy } from './avatar/avatar.anatomy';
5
+ export { bottomSheetAnatomy } from './bottom-sheet/bottom-sheet.anatomy';
5
6
  export { carouselAnatomy } from './carousel/carousel.anatomy';
6
7
  export { checkboxAnatomy } from './checkbox/checkbox.anatomy';
7
8
  export { clipboardAnatomy } from './clipboard/clipboard.anatomy';
@@ -6,4 +6,4 @@ export interface UseAngleSliderProps extends Omit<angleSlider.Props, 'dir' | 'ge
6
6
  }
7
7
  export interface UseAngleSliderReturn extends Accessor<angleSlider.Api<PropTypes>> {
8
8
  }
9
- export declare const useAngleSlider: (props: MaybeFunction<UseAngleSliderProps>) => () => angleSlider.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useAngleSlider: (props: MaybeFunction<UseAngleSliderProps>) => () => angleSlider.Api<PropTypes>;
@@ -6,4 +6,4 @@ export interface UseAvatarProps extends Omit<avatar.Props, 'dir' | 'getRootNode'
6
6
  }
7
7
  export interface UseAvatarReturn extends Accessor<avatar.Api<PropTypes>> {
8
8
  }
9
- export declare const useAvatar: (props: MaybeFunction<UseAvatarProps>) => () => avatar.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useAvatar: (props: MaybeFunction<UseAvatarProps>) => () => avatar.Api<PropTypes>;
@@ -0,0 +1,32 @@
1
+ <script module lang="ts">
2
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
3
+
4
+ export interface BottomSheetBackdropBaseProps extends PolymorphicProps<'div'>, RefAttribute {
5
+ ref?: Element | null
6
+ }
7
+ export interface BottomSheetBackdropProps extends Assign<HTMLProps<'div'>, BottomSheetBackdropBaseProps> {}
8
+ </script>
9
+
10
+ <script lang="ts">
11
+ import { useRenderStrategyPropsContext } from '../../utils/render-strategy'
12
+ import { mergeProps } from '@zag-js/svelte'
13
+ import { Ark } from '../factory'
14
+ import { usePresence } from '../presence'
15
+ import { useBottomSheetContext } from './use-bottom-sheet-context'
16
+
17
+ let { ref = $bindable(null), ...props }: BottomSheetBackdropProps = $props()
18
+
19
+ const bottomSheet = useBottomSheetContext()
20
+ const renderStrategyProps = useRenderStrategyPropsContext()
21
+
22
+ const presence = usePresence(() => ({ ...renderStrategyProps, present: bottomSheet().open }))
23
+ const mergedProps = $derived(mergeProps(bottomSheet().getBackdropProps(), presence().getPresenceProps(), props))
24
+
25
+ function setNode(node: Element | null) {
26
+ presence().setNode(node)
27
+ }
28
+ </script>
29
+
30
+ {#if !presence().unmounted}
31
+ <Ark as="div" bind:ref {...mergedProps} {@attach setNode} />
32
+ {/if}
@@ -0,0 +1,9 @@
1
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
2
+ export interface BottomSheetBackdropBaseProps extends PolymorphicProps<'div'>, RefAttribute {
3
+ ref?: Element | null;
4
+ }
5
+ export interface BottomSheetBackdropProps extends Assign<HTMLProps<'div'>, BottomSheetBackdropBaseProps> {
6
+ }
7
+ declare const BottomSheetBackdrop: import("svelte").Component<BottomSheetBackdropProps, {}, "ref">;
8
+ type BottomSheetBackdrop = ReturnType<typeof BottomSheetBackdrop>;
9
+ export default BottomSheetBackdrop;
@@ -0,0 +1,19 @@
1
+ <script module lang="ts">
2
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
3
+
4
+ export interface BottomSheetCloseTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
5
+ export interface BottomSheetCloseTriggerProps extends Assign<HTMLProps<'button'>, BottomSheetCloseTriggerBaseProps> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import { mergeProps } from '@zag-js/svelte'
10
+ import { Ark } from '../factory'
11
+ import { useBottomSheetContext } from './use-bottom-sheet-context'
12
+
13
+ let { ref = $bindable(null), ...props }: BottomSheetCloseTriggerProps = $props()
14
+
15
+ const bottomSheet = useBottomSheetContext()
16
+ const mergedProps = $derived(mergeProps(bottomSheet().getCloseTriggerProps(), props))
17
+ </script>
18
+
19
+ <Ark as="button" bind:ref {...mergedProps} />
@@ -0,0 +1,8 @@
1
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
2
+ export interface BottomSheetCloseTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
3
+ }
4
+ export interface BottomSheetCloseTriggerProps extends Assign<HTMLProps<'button'>, BottomSheetCloseTriggerBaseProps> {
5
+ }
6
+ declare const BottomSheetCloseTrigger: import("svelte").Component<BottomSheetCloseTriggerProps, {}, "ref">;
7
+ type BottomSheetCloseTrigger = ReturnType<typeof BottomSheetCloseTrigger>;
8
+ export default BottomSheetCloseTrigger;
@@ -0,0 +1,39 @@
1
+ <script module lang="ts">
2
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
3
+ import type { ContentProps } from '@zag-js/bottom-sheet'
4
+
5
+ export interface BottomSheetContentBaseProps extends PolymorphicProps<'div'>, ContentProps, RefAttribute {
6
+ ref?: Element | null
7
+ }
8
+ export interface BottomSheetContentProps
9
+ extends Assign<Omit<HTMLProps<'div'>, 'draggable'>, BottomSheetContentBaseProps> {}
10
+ </script>
11
+
12
+ <script lang="ts">
13
+ import { mergeProps } from '@zag-js/svelte'
14
+ import { Ark } from '../factory'
15
+ import { usePresenceContext } from '../presence'
16
+ import { createSplitProps } from '../../utils/create-split-props'
17
+ import { useBottomSheetContext } from './use-bottom-sheet-context'
18
+
19
+ let { ref = $bindable(null), ...props }: BottomSheetContentProps = $props()
20
+
21
+ const [contentProps, localProps] = $derived(createSplitProps<ContentProps>()(props, ['draggable']))
22
+ const bottomSheet = useBottomSheetContext()
23
+ const presence = usePresenceContext()
24
+ const mergedProps = $derived(
25
+ mergeProps(
26
+ bottomSheet().getContentProps({ draggable: true, ...contentProps }),
27
+ presence().getPresenceProps(),
28
+ localProps,
29
+ ),
30
+ )
31
+
32
+ function setNode(node: Element | null) {
33
+ presence().setNode(node)
34
+ }
35
+ </script>
36
+
37
+ {#if !presence().unmounted}
38
+ <Ark as="div" bind:ref {...mergedProps} {@attach setNode} />
39
+ {/if}
@@ -0,0 +1,10 @@
1
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
2
+ import type { ContentProps } from '@zag-js/bottom-sheet';
3
+ export interface BottomSheetContentBaseProps extends PolymorphicProps<'div'>, ContentProps, RefAttribute {
4
+ ref?: Element | null;
5
+ }
6
+ export interface BottomSheetContentProps extends Assign<Omit<HTMLProps<'div'>, 'draggable'>, BottomSheetContentBaseProps> {
7
+ }
8
+ declare const BottomSheetContent: import("svelte").Component<BottomSheetContentProps, {}, "ref">;
9
+ type BottomSheetContent = ReturnType<typeof BottomSheetContent>;
10
+ export default BottomSheetContent;
@@ -0,0 +1,18 @@
1
+ <script module lang="ts">
2
+ import type { Snippet } from 'svelte'
3
+ import type { UseBottomSheetContext } from './use-bottom-sheet-context'
4
+
5
+ export interface BottomSheetContextProps {
6
+ children: Snippet<[UseBottomSheetContext]>
7
+ }
8
+ </script>
9
+
10
+ <script lang="ts">
11
+ import { useBottomSheetContext } from './use-bottom-sheet-context'
12
+
13
+ const { children }: BottomSheetContextProps = $props()
14
+
15
+ const bottomSheet = useBottomSheetContext()
16
+ </script>
17
+
18
+ {@render children(bottomSheet)}
@@ -0,0 +1,8 @@
1
+ import type { Snippet } from 'svelte';
2
+ import type { UseBottomSheetContext } from './use-bottom-sheet-context';
3
+ export interface BottomSheetContextProps {
4
+ children: Snippet<[UseBottomSheetContext]>;
5
+ }
6
+ declare const BottomSheetContext: import("svelte").Component<BottomSheetContextProps, {}, "">;
7
+ type BottomSheetContext = ReturnType<typeof BottomSheetContext>;
8
+ export default BottomSheetContext;
@@ -0,0 +1,20 @@
1
+ <script module lang="ts">
2
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
3
+
4
+ export interface BottomSheetGrabberIndicatorBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
5
+ export interface BottomSheetGrabberIndicatorProps
6
+ extends Assign<HTMLProps<'div'>, BottomSheetGrabberIndicatorBaseProps> {}
7
+ </script>
8
+
9
+ <script lang="ts">
10
+ import { mergeProps } from '@zag-js/svelte'
11
+ import { Ark } from '../factory'
12
+ import { useBottomSheetContext } from './use-bottom-sheet-context'
13
+
14
+ let { ref = $bindable(null), ...props }: BottomSheetGrabberIndicatorProps = $props()
15
+
16
+ const bottomSheet = useBottomSheetContext()
17
+ const mergedProps = $derived(mergeProps(bottomSheet().getGrabberIndicatorProps(), props))
18
+ </script>
19
+
20
+ <Ark as="div" bind:ref {...mergedProps} />
@@ -0,0 +1,8 @@
1
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
2
+ export interface BottomSheetGrabberIndicatorBaseProps extends PolymorphicProps<'div'>, RefAttribute {
3
+ }
4
+ export interface BottomSheetGrabberIndicatorProps extends Assign<HTMLProps<'div'>, BottomSheetGrabberIndicatorBaseProps> {
5
+ }
6
+ declare const BottomSheetGrabberIndicator: import("svelte").Component<BottomSheetGrabberIndicatorProps, {}, "ref">;
7
+ type BottomSheetGrabberIndicator = ReturnType<typeof BottomSheetGrabberIndicator>;
8
+ export default BottomSheetGrabberIndicator;
@@ -0,0 +1,19 @@
1
+ <script module lang="ts">
2
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
3
+
4
+ export interface BottomSheetGrabberBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
5
+ export interface BottomSheetGrabberProps extends Assign<HTMLProps<'div'>, BottomSheetGrabberBaseProps> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import { mergeProps } from '@zag-js/svelte'
10
+ import { Ark } from '../factory'
11
+ import { useBottomSheetContext } from './use-bottom-sheet-context'
12
+
13
+ let { ref = $bindable(null), ...props }: BottomSheetGrabberProps = $props()
14
+
15
+ const bottomSheet = useBottomSheetContext()
16
+ const mergedProps = $derived(mergeProps(bottomSheet().getGrabberProps(), props))
17
+ </script>
18
+
19
+ <Ark as="div" bind:ref {...mergedProps} />
@@ -0,0 +1,8 @@
1
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
2
+ export interface BottomSheetGrabberBaseProps extends PolymorphicProps<'div'>, RefAttribute {
3
+ }
4
+ export interface BottomSheetGrabberProps extends Assign<HTMLProps<'div'>, BottomSheetGrabberBaseProps> {
5
+ }
6
+ declare const BottomSheetGrabber: import("svelte").Component<BottomSheetGrabberProps, {}, "ref">;
7
+ type BottomSheetGrabber = ReturnType<typeof BottomSheetGrabber>;
8
+ export default BottomSheetGrabber;
@@ -0,0 +1,36 @@
1
+ <script module lang="ts">
2
+ import type { Snippet } from 'svelte'
3
+ import type { UseBottomSheetReturn } from './use-bottom-sheet.svelte'
4
+
5
+ export interface BottomSheetRootProviderBaseProps {
6
+ value: UseBottomSheetReturn
7
+ }
8
+ export interface BottomSheetRootProviderProps extends BottomSheetRootProviderBaseProps {
9
+ children?: Snippet
10
+ }
11
+ </script>
12
+
13
+ <script lang="ts">
14
+ import { RenderStrategyPropsProvider, splitRenderStrategyProps } from '../../utils/render-strategy'
15
+ import { PresenceProvider, usePresence } from '../presence'
16
+ import { splitPresenceProps } from '../presence/split-presence-props.svelte'
17
+ import { BottomSheetProvider } from './use-bottom-sheet-context'
18
+
19
+ let { value, children, ...props }: BottomSheetRootProviderProps = $props()
20
+
21
+ const [presenceProps] = $derived(splitPresenceProps(props))
22
+ const [renderStrategyProps] = $derived(splitRenderStrategyProps(presenceProps))
23
+
24
+ const presenceMachineProps = $derived.by(() => ({
25
+ ...presenceProps,
26
+ present: value().open,
27
+ }))
28
+
29
+ const presence = usePresence(() => presenceMachineProps)
30
+
31
+ BottomSheetProvider(value)
32
+ RenderStrategyPropsProvider(() => renderStrategyProps)
33
+ PresenceProvider(presence)
34
+ </script>
35
+
36
+ {@render children?.()}
@@ -0,0 +1,11 @@
1
+ import type { Snippet } from 'svelte';
2
+ import type { UseBottomSheetReturn } from './use-bottom-sheet.svelte';
3
+ export interface BottomSheetRootProviderBaseProps {
4
+ value: UseBottomSheetReturn;
5
+ }
6
+ export interface BottomSheetRootProviderProps extends BottomSheetRootProviderBaseProps {
7
+ children?: Snippet;
8
+ }
9
+ declare const BottomSheetRootProvider: import("svelte").Component<BottomSheetRootProviderProps, {}, "">;
10
+ type BottomSheetRootProvider = ReturnType<typeof BottomSheetRootProvider>;
11
+ export default BottomSheetRootProvider;
@@ -0,0 +1,52 @@
1
+ <script module lang="ts">
2
+ import type { Snippet } from 'svelte'
3
+ import type { UsePresenceProps } from '../presence'
4
+ import type { UseBottomSheetProps } from './use-bottom-sheet.svelte'
5
+
6
+ export interface BottomSheetRootBaseProps extends UseBottomSheetProps, UsePresenceProps {}
7
+ export interface BottomSheetRootProps extends BottomSheetRootBaseProps {
8
+ children?: Snippet
9
+ }
10
+ </script>
11
+
12
+ <script lang="ts">
13
+ import { PresenceProvider, usePresence } from '../presence'
14
+ import { splitPresenceProps } from '../presence/split-presence-props.svelte'
15
+ import { RenderStrategyPropsProvider, splitRenderStrategyProps } from '../../utils/render-strategy'
16
+ import { BottomSheetProvider } from './use-bottom-sheet-context'
17
+ import { useBottomSheet } from './use-bottom-sheet.svelte'
18
+
19
+ let { open = $bindable(), children, ...props }: BottomSheetRootProps = $props()
20
+
21
+ const providedId = $props.id()
22
+
23
+ const [presenceProps, localProps] = $derived(splitPresenceProps(props))
24
+ const [renderStrategyProps] = $derived(splitRenderStrategyProps(presenceProps))
25
+
26
+ const machineProps = $derived.by<UseBottomSheetProps>(() => {
27
+ return {
28
+ ...localProps,
29
+ id: localProps.id ?? providedId,
30
+ open,
31
+ onOpenChange(details) {
32
+ localProps.onOpenChange?.(details)
33
+ if (open !== undefined) open = details.open
34
+ },
35
+ }
36
+ })
37
+
38
+ const bottomSheet = useBottomSheet(() => machineProps)
39
+
40
+ const presenceMachineProps = $derived.by<UsePresenceProps>(() => ({
41
+ ...presenceProps,
42
+ present: bottomSheet().open,
43
+ }))
44
+
45
+ const presence = usePresence(() => presenceMachineProps)
46
+
47
+ BottomSheetProvider(bottomSheet)
48
+ RenderStrategyPropsProvider(() => renderStrategyProps)
49
+ PresenceProvider(presence)
50
+ </script>
51
+
52
+ {@render children?.()}
@@ -0,0 +1,11 @@
1
+ import type { Snippet } from 'svelte';
2
+ import type { UsePresenceProps } from '../presence';
3
+ import type { UseBottomSheetProps } from './use-bottom-sheet.svelte';
4
+ export interface BottomSheetRootBaseProps extends UseBottomSheetProps, UsePresenceProps {
5
+ }
6
+ export interface BottomSheetRootProps extends BottomSheetRootBaseProps {
7
+ children?: Snippet;
8
+ }
9
+ declare const BottomSheetRoot: import("svelte").Component<BottomSheetRootProps, {}, "open">;
10
+ type BottomSheetRoot = ReturnType<typeof BottomSheetRoot>;
11
+ export default BottomSheetRoot;
@@ -0,0 +1,19 @@
1
+ <script module lang="ts">
2
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
3
+
4
+ export interface BottomSheetTitleBaseProps extends PolymorphicProps<'h2'>, RefAttribute {}
5
+ export interface BottomSheetTitleProps extends Assign<HTMLProps<'h2'>, BottomSheetTitleBaseProps> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import { mergeProps } from '@zag-js/svelte'
10
+ import { Ark } from '../factory'
11
+ import { useBottomSheetContext } from './use-bottom-sheet-context'
12
+
13
+ let { ref = $bindable(null), ...props }: BottomSheetTitleProps = $props()
14
+
15
+ const bottomSheet = useBottomSheetContext()
16
+ const mergedProps = $derived(mergeProps(bottomSheet().getTitleProps(), props))
17
+ </script>
18
+
19
+ <Ark as="h2" bind:ref {...mergedProps} />
@@ -0,0 +1,8 @@
1
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
2
+ export interface BottomSheetTitleBaseProps extends PolymorphicProps<'h2'>, RefAttribute {
3
+ }
4
+ export interface BottomSheetTitleProps extends Assign<HTMLProps<'h2'>, BottomSheetTitleBaseProps> {
5
+ }
6
+ declare const BottomSheetTitle: import("svelte").Component<BottomSheetTitleProps, {}, "ref">;
7
+ type BottomSheetTitle = ReturnType<typeof BottomSheetTitle>;
8
+ export default BottomSheetTitle;
@@ -0,0 +1,29 @@
1
+ <script module lang="ts">
2
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
3
+
4
+ export interface BottomSheetTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
5
+ export interface BottomSheetTriggerProps extends Assign<HTMLProps<'button'>, BottomSheetTriggerBaseProps> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import { mergeProps } from '@zag-js/svelte'
10
+ import { Ark } from '../factory'
11
+ import { usePresenceContext } from '../presence'
12
+ import { useBottomSheetContext } from './use-bottom-sheet-context'
13
+
14
+ let { ref = $bindable(null), ...props }: BottomSheetTriggerProps = $props()
15
+
16
+ const bottomSheet = useBottomSheetContext()
17
+ const presence = usePresenceContext()
18
+ const mergedProps = $derived(
19
+ mergeProps(
20
+ {
21
+ ...bottomSheet().getTriggerProps(),
22
+ 'aria-controls': presence().unmounted ? undefined : bottomSheet().getTriggerProps()['aria-controls'],
23
+ },
24
+ props,
25
+ ),
26
+ )
27
+ </script>
28
+
29
+ <Ark as="button" bind:ref {...mergedProps} />
@@ -0,0 +1,8 @@
1
+ import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
2
+ export interface BottomSheetTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
3
+ }
4
+ export interface BottomSheetTriggerProps extends Assign<HTMLProps<'button'>, BottomSheetTriggerBaseProps> {
5
+ }
6
+ declare const BottomSheetTrigger: import("svelte").Component<BottomSheetTriggerProps, {}, "ref">;
7
+ type BottomSheetTrigger = ReturnType<typeof BottomSheetTrigger>;
8
+ export default BottomSheetTrigger;
@@ -0,0 +1 @@
1
+ export { anatomy as bottomSheetAnatomy } from '@zag-js/bottom-sheet';
@@ -0,0 +1 @@
1
+ export { anatomy as bottomSheetAnatomy } from '@zag-js/bottom-sheet';
@@ -0,0 +1,11 @@
1
+ export type { OpenChangeDetails } from '@zag-js/bottom-sheet';
2
+ export { default as Backdrop, type BottomSheetBackdropBaseProps as BackdropBaseProps, type BottomSheetBackdropProps as BackdropProps, } from './bottom-sheet-backdrop.svelte';
3
+ export { default as CloseTrigger, type BottomSheetCloseTriggerBaseProps as CloseTriggerBaseProps, type BottomSheetCloseTriggerProps as CloseTriggerProps, } from './bottom-sheet-close-trigger.svelte';
4
+ export { default as Content, type BottomSheetContentBaseProps as ContentBaseProps, type BottomSheetContentProps as ContentProps, } from './bottom-sheet-content.svelte';
5
+ export { default as Context, type BottomSheetContextProps as ContextProps } from './bottom-sheet-context.svelte';
6
+ export { default as Grabber, type BottomSheetGrabberBaseProps as GrabberBaseProps, type BottomSheetGrabberProps as GrabberProps, } from './bottom-sheet-grabber.svelte';
7
+ export { default as GrabberIndicator, type BottomSheetGrabberIndicatorBaseProps as GrabberIndicatorBaseProps, type BottomSheetGrabberIndicatorProps as GrabberIndicatorProps, } from './bottom-sheet-grabber-indicator.svelte';
8
+ export { default as Root, type BottomSheetRootBaseProps as RootBaseProps, type BottomSheetRootProps as RootProps, } from './bottom-sheet-root.svelte';
9
+ export { default as RootProvider, type BottomSheetRootProviderBaseProps as RootProviderBaseProps, type BottomSheetRootProviderProps as RootProviderProps, } from './bottom-sheet-root-provider.svelte';
10
+ export { default as Title, type BottomSheetTitleBaseProps as TitleBaseProps, type BottomSheetTitleProps as TitleProps, } from './bottom-sheet-title.svelte';
11
+ export { default as Trigger, type BottomSheetTriggerBaseProps as TriggerBaseProps, type BottomSheetTriggerProps as TriggerProps, } from './bottom-sheet-trigger.svelte';
@@ -0,0 +1,10 @@
1
+ export { default as Backdrop, } from './bottom-sheet-backdrop.svelte';
2
+ export { default as CloseTrigger, } from './bottom-sheet-close-trigger.svelte';
3
+ export { default as Content, } from './bottom-sheet-content.svelte';
4
+ export { default as Context } from './bottom-sheet-context.svelte';
5
+ export { default as Grabber, } from './bottom-sheet-grabber.svelte';
6
+ export { default as GrabberIndicator, } from './bottom-sheet-grabber-indicator.svelte';
7
+ export { default as Root, } from './bottom-sheet-root.svelte';
8
+ export { default as RootProvider, } from './bottom-sheet-root-provider.svelte';
9
+ export { default as Title, } from './bottom-sheet-title.svelte';
10
+ export { default as Trigger, } from './bottom-sheet-trigger.svelte';
@@ -0,0 +1,15 @@
1
+ export type { OpenChangeDetails as BottomSheetOpenChangeDetails } from '@zag-js/bottom-sheet';
2
+ export { default as BottomSheetBackdrop, type BottomSheetBackdropBaseProps, type BottomSheetBackdropProps, } from './bottom-sheet-backdrop.svelte';
3
+ export { default as BottomSheetCloseTrigger, type BottomSheetCloseTriggerBaseProps, type BottomSheetCloseTriggerProps, } from './bottom-sheet-close-trigger.svelte';
4
+ export { default as BottomSheetContent, type BottomSheetContentBaseProps, type BottomSheetContentProps, } from './bottom-sheet-content.svelte';
5
+ export { default as BottomSheetContext, type BottomSheetContextProps } from './bottom-sheet-context.svelte';
6
+ export { default as BottomSheetGrabber, type BottomSheetGrabberBaseProps, type BottomSheetGrabberProps, } from './bottom-sheet-grabber.svelte';
7
+ export { default as BottomSheetGrabberIndicator, type BottomSheetGrabberIndicatorBaseProps, type BottomSheetGrabberIndicatorProps, } from './bottom-sheet-grabber-indicator.svelte';
8
+ export { default as BottomSheetRoot, type BottomSheetRootBaseProps, type BottomSheetRootProps, } from './bottom-sheet-root.svelte';
9
+ export { default as BottomSheetRootProvider, type BottomSheetRootProviderBaseProps, type BottomSheetRootProviderProps, } from './bottom-sheet-root-provider.svelte';
10
+ export { default as BottomSheetTitle, type BottomSheetTitleBaseProps, type BottomSheetTitleProps, } from './bottom-sheet-title.svelte';
11
+ export { default as BottomSheetTrigger, type BottomSheetTriggerBaseProps, type BottomSheetTriggerProps, } from './bottom-sheet-trigger.svelte';
12
+ export { bottomSheetAnatomy } from './bottom-sheet.anatomy';
13
+ export { useBottomSheetContext, type UseBottomSheetContext } from './use-bottom-sheet-context';
14
+ export { useBottomSheet, type UseBottomSheetProps, type UseBottomSheetReturn } from './use-bottom-sheet.svelte';
15
+ export * as BottomSheet from './bottom-sheet';
@@ -0,0 +1,14 @@
1
+ export { default as BottomSheetBackdrop, } from './bottom-sheet-backdrop.svelte';
2
+ export { default as BottomSheetCloseTrigger, } from './bottom-sheet-close-trigger.svelte';
3
+ export { default as BottomSheetContent, } from './bottom-sheet-content.svelte';
4
+ export { default as BottomSheetContext } from './bottom-sheet-context.svelte';
5
+ export { default as BottomSheetGrabber, } from './bottom-sheet-grabber.svelte';
6
+ export { default as BottomSheetGrabberIndicator, } from './bottom-sheet-grabber-indicator.svelte';
7
+ export { default as BottomSheetRoot, } from './bottom-sheet-root.svelte';
8
+ export { default as BottomSheetRootProvider, } from './bottom-sheet-root-provider.svelte';
9
+ export { default as BottomSheetTitle, } from './bottom-sheet-title.svelte';
10
+ export { default as BottomSheetTrigger, } from './bottom-sheet-trigger.svelte';
11
+ export { bottomSheetAnatomy } from './bottom-sheet.anatomy';
12
+ export { useBottomSheetContext } from './use-bottom-sheet-context';
13
+ export { useBottomSheet } from './use-bottom-sheet.svelte';
14
+ export * as BottomSheet from './bottom-sheet';
@@ -0,0 +1,4 @@
1
+ import type { UseBottomSheetReturn } from './use-bottom-sheet.svelte';
2
+ export interface UseBottomSheetContext extends UseBottomSheetReturn {
3
+ }
4
+ export declare const BottomSheetProvider: (opts: UseBottomSheetContext) => void, useBottomSheetContext: (fallback?: UseBottomSheetContext | undefined) => UseBottomSheetContext;
@@ -0,0 +1,4 @@
1
+ import { createContext } from '../../utils/create-context';
2
+ export const [BottomSheetProvider, useBottomSheetContext] = createContext({
3
+ name: 'BottomSheetContext',
4
+ });
@@ -0,0 +1,9 @@
1
+ import type { Accessor, Optional } from '../../types';
2
+ import * as bottomSheet from '@zag-js/bottom-sheet';
3
+ import { type PropTypes } from '@zag-js/svelte';
4
+ import { type MaybeFunction } from '@zag-js/utils';
5
+ export interface UseBottomSheetProps extends Optional<Omit<bottomSheet.Props, 'getRootNode' | 'dir'>, 'id'> {
6
+ }
7
+ export interface UseBottomSheetReturn extends Accessor<bottomSheet.Api<PropTypes>> {
8
+ }
9
+ export declare const useBottomSheet: (props: MaybeFunction<UseBottomSheetProps>) => UseBottomSheetReturn;
@@ -0,0 +1,20 @@
1
+ import { useEnvironmentContext } from '../../providers/environment';
2
+ import { useLocaleContext } from '../../providers/locale';
3
+ import * as bottomSheet from '@zag-js/bottom-sheet';
4
+ import { normalizeProps, useMachine } from '@zag-js/svelte';
5
+ import { runIfFn } from '@zag-js/utils';
6
+ export const useBottomSheet = (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(bottomSheet.machine, () => machineProps);
18
+ const api = $derived(bottomSheet.connect(service, normalizeProps));
19
+ return () => api;
20
+ };
@@ -6,4 +6,4 @@ export interface UseCarouselProps extends Optional<Omit<carousel.Props, 'dir' |
6
6
  }
7
7
  export interface UseCarouselReturn extends Accessor<carousel.Api<PropTypes>> {
8
8
  }
9
- export declare const useCarousel: (props?: MaybeFunction<UseCarouselProps>) => () => carousel.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useCarousel: (props?: MaybeFunction<UseCarouselProps>) => () => carousel.Api<PropTypes>;
@@ -1 +1 @@
1
- export declare const checkboxAnatomy: import("@zag-js/anatomy").AnatomyInstance<"label" | "group" | "root" | "control" | "indicator">;
1
+ export declare const checkboxAnatomy: import("@zag-js/anatomy").AnatomyInstance<"label" | "root" | "group" | "control" | "indicator">;
@@ -1 +1 @@
1
- export declare const colorPickerAnatomy: import("@zag-js/anatomy").AnatomyInstance<"area" | "label" | "view" | "root" | "content" | "trigger" | "control" | "positioner" | "formatSelect" | "areaThumb" | "channelInput" | "channelSliderTrack" | "channelSliderThumb" | "valueText" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderValueText" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger">;
1
+ export declare const colorPickerAnatomy: import("@zag-js/anatomy").AnatomyInstance<"area" | "label" | "view" | "root" | "content" | "trigger" | "control" | "valueText" | "positioner" | "formatSelect" | "areaThumb" | "channelInput" | "channelSliderTrack" | "channelSliderThumb" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderValueText" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger">;
@@ -1,2 +1,2 @@
1
1
  import type { UseColorPickerProps } from './use-color-picker.svelte';
2
- export declare const splitColorPickerProps: <T extends UseColorPickerProps>(props: T) => [UseColorPickerProps, Omit<T, "name" | "defaultValue" | "value" | "open" | "ids" | "defaultOpen" | "onOpenChange" | "disabled" | "id" | "inline" | "onValueChange" | "onValueChangeEnd" | "readOnly" | "invalid" | "required" | "positioning" | "initialFocusEl" | "format" | "defaultFormat" | "onFormatChange" | "closeOnSelect" | "openAutoFocus" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside">];
2
+ export declare const splitColorPickerProps: <T extends UseColorPickerProps>(props: T) => [UseColorPickerProps, Omit<T, "name" | "defaultValue" | "value" | "open" | "ids" | "defaultOpen" | "onOpenChange" | "disabled" | "id" | "inline" | "onValueChange" | "onValueChangeEnd" | "readOnly" | "invalid" | "required" | "initialFocusEl" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "positioning" | "format" | "defaultFormat" | "onFormatChange" | "closeOnSelect" | "openAutoFocus">];
@@ -1 +1 @@
1
- export declare const comboboxAnatomy: import("@zag-js/anatomy").AnatomyInstance<"input" | "label" | "list" | "root" | "content" | "trigger" | "control" | "positioner" | "clearTrigger" | "item" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
1
+ export declare const comboboxAnatomy: import("@zag-js/anatomy").AnatomyInstance<"input" | "label" | "root" | "content" | "trigger" | "list" | "item" | "control" | "itemGroup" | "positioner" | "clearTrigger" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
@@ -1 +1 @@
1
- export declare const datePickerAnatomy: import("@zag-js/anatomy").AnatomyInstance<"input" | "label" | "table" | "view" | "root" | "content" | "trigger" | "control" | "positioner" | "clearTrigger" | "monthSelect" | "nextTrigger" | "presetTrigger" | "prevTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
1
+ export declare const datePickerAnatomy: import("@zag-js/anatomy").AnatomyInstance<"input" | "label" | "table" | "view" | "root" | "content" | "trigger" | "control" | "nextTrigger" | "prevTrigger" | "positioner" | "clearTrigger" | "tableHeader" | "tableBody" | "tableRow" | "viewTrigger" | "monthSelect" | "yearSelect" | "presetTrigger" | "rangeText" | "tableCell" | "tableCellTrigger" | "tableHead" | "viewControl">;
@@ -1,2 +1,2 @@
1
1
  import type { UseEditableProps } from './use-editable.svelte';
2
- export declare function splitEditableProps<T extends UseEditableProps>(props: T): [UseEditableProps, Omit<T, "form" | "name" | "defaultValue" | "value" | "ids" | "disabled" | "id" | "placeholder" | "onValueChange" | "readOnly" | "invalid" | "required" | "translations" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "finalFocusEl" | "autoResize" | "activationMode" | "submitMode" | "selectOnFocus" | "edit" | "defaultEdit" | "onEditChange" | "maxLength" | "onValueRevert" | "onValueCommit">];
2
+ export declare function splitEditableProps<T extends UseEditableProps>(props: T): [UseEditableProps, Omit<T, "form" | "name" | "defaultValue" | "value" | "ids" | "disabled" | "id" | "placeholder" | "onValueChange" | "readOnly" | "invalid" | "required" | "finalFocusEl" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "translations" | "autoResize" | "activationMode" | "submitMode" | "selectOnFocus" | "edit" | "defaultEdit" | "onEditChange" | "maxLength" | "onValueRevert" | "onValueCommit">];
@@ -8,6 +8,10 @@
8
8
  * The unit display
9
9
  */
10
10
  unitDisplay?: 'long' | 'short' | 'narrow'
11
+ /**
12
+ * The unit system to use for formatting
13
+ */
14
+ unitSystem?: 'decimal' | 'binary'
11
15
  /**
12
16
  * The byte size to format
13
17
  */
@@ -7,6 +7,10 @@ export interface FormatByteProps {
7
7
  * The unit display
8
8
  */
9
9
  unitDisplay?: 'long' | 'short' | 'narrow';
10
+ /**
11
+ * The unit system to use for formatting
12
+ */
13
+ unitSystem?: 'decimal' | 'binary';
10
14
  /**
11
15
  * The byte size to format
12
16
  */
@@ -1,6 +1,7 @@
1
1
  export * from './accordion';
2
2
  export * from './angle-slider';
3
3
  export * from './avatar';
4
+ export * from './bottom-sheet';
4
5
  export * from './carousel';
5
6
  export * from './checkbox';
6
7
  export * from './client-only';
@@ -1,6 +1,7 @@
1
1
  export * from './accordion';
2
2
  export * from './angle-slider';
3
3
  export * from './avatar';
4
+ export * from './bottom-sheet';
4
5
  export * from './carousel';
5
6
  export * from './checkbox';
6
7
  export * from './client-only';
@@ -1 +1 @@
1
- export declare const listboxAnatomy: import("@zag-js/anatomy").AnatomyInstance<"input" | "label" | "root" | "content" | "valueText" | "item" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
1
+ export declare const listboxAnatomy: import("@zag-js/anatomy").AnatomyInstance<"input" | "label" | "root" | "content" | "item" | "valueText" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
@@ -6,4 +6,4 @@ export interface UseProgressProps extends Omit<progress.Props, 'dir' | 'getRootN
6
6
  }
7
7
  export interface UseProgressReturn extends Accessor<progress.Api<PropTypes>> {
8
8
  }
9
- export declare const useProgress: (props: MaybeFunction<UseProgressProps>) => () => progress.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useProgress: (props: MaybeFunction<UseProgressProps>) => () => progress.Api<PropTypes>;
@@ -6,4 +6,4 @@ export interface UseQrCodeProps extends Omit<qrcode.Props, 'dir' | 'getRootNode'
6
6
  }
7
7
  export interface UseQrCodeReturn extends Accessor<qrcode.Api<PropTypes>> {
8
8
  }
9
- export declare const useQrCode: (props: MaybeFunction<UseQrCodeProps>) => () => qrcode.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useQrCode: (props: MaybeFunction<UseQrCodeProps>) => () => qrcode.Api<PropTypes>;
@@ -1,2 +1,2 @@
1
- export declare const segmentGroupAnatomy: import("@zag-js/anatomy").Anatomy<"label" | "root" | "indicator" | "item" | "itemText" | "itemControl">;
2
- export declare const parts: Record<"label" | "root" | "indicator" | "item" | "itemText" | "itemControl", import("@zag-js/anatomy").AnatomyPart>;
1
+ export declare const segmentGroupAnatomy: import("@zag-js/anatomy").Anatomy<"label" | "root" | "item" | "indicator" | "itemText" | "itemControl">;
2
+ export declare const parts: Record<"label" | "root" | "item" | "indicator" | "itemText" | "itemControl", import("@zag-js/anatomy").AnatomyPart>;
@@ -8,11 +8,15 @@
8
8
  <script lang="ts">
9
9
  import { mergeProps } from '@zag-js/svelte'
10
10
  import { Ark } from '../factory'
11
+ import { usePresenceContext } from '../presence'
11
12
  import { useSelectContext } from './use-select-context'
12
13
 
13
14
  let { ref = $bindable(null), ...props }: SelectPositionerProps = $props()
14
15
  const select = useSelectContext()
16
+ const presence = usePresenceContext()
15
17
  const mergedProps = $derived(mergeProps(select().getPositionerProps(), props))
16
18
  </script>
17
19
 
18
- <Ark as="div" bind:ref {...mergedProps} />
20
+ {#if !presence().unmounted}
21
+ <Ark as="div" bind:ref {...mergedProps} />
22
+ {/if}
@@ -6,4 +6,4 @@ export interface UseSignaturePadProps extends Optional<Omit<signaturePad.Props,
6
6
  }
7
7
  export interface UseSignaturePadReturn extends Accessor<signaturePad.Api<PropTypes>> {
8
8
  }
9
- export declare const useSignaturePad: (props?: MaybeFunction<UseSignaturePadProps>) => () => signaturePad.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useSignaturePad: (props?: MaybeFunction<UseSignaturePadProps>) => () => signaturePad.Api<PropTypes>;
@@ -6,4 +6,4 @@ export interface UseSliderProps extends Omit<slider.Props, 'dir' | 'getRootNode'
6
6
  }
7
7
  export interface UseSliderReturn extends Accessor<slider.Api<PropTypes>> {
8
8
  }
9
- export declare const useSlider: (props: MaybeFunction<UseSliderProps>) => () => slider.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useSlider: (props: MaybeFunction<UseSliderProps>) => () => slider.Api<PropTypes>;
@@ -6,4 +6,4 @@ export interface UseStepsProps extends Optional<Omit<steps.Props, 'dir' | 'getRo
6
6
  }
7
7
  export interface UseStepsReturn extends Accessor<steps.Api<PropTypes>> {
8
8
  }
9
- export declare const useSteps: (props?: MaybeFunction<UseStepsProps>) => () => steps.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useSteps: (props?: MaybeFunction<UseStepsProps>) => () => steps.Api<PropTypes>;
@@ -6,4 +6,4 @@ export interface UseSwitchProps extends Optional<Omit<zagSwitch.Props, 'dir' | '
6
6
  }
7
7
  export interface UseSwitchReturn extends Accessor<zagSwitch.Api<PropTypes>> {
8
8
  }
9
- export declare const useSwitch: (props?: MaybeFunction<UseSwitchProps>) => () => zagSwitch.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useSwitch: (props?: MaybeFunction<UseSwitchProps>) => () => zagSwitch.Api<PropTypes>;
@@ -6,4 +6,4 @@ export interface UseTimerProps extends Omit<timer.Props, 'dir' | 'getRootNode'>
6
6
  }
7
7
  export interface UseTimerReturn extends Accessor<timer.Api<PropTypes>> {
8
8
  }
9
- export declare const useTimer: (props: MaybeFunction<UseTimerProps>) => () => timer.Api<import("@zag-js/types").PropTypes>;
9
+ export declare const useTimer: (props: MaybeFunction<UseTimerProps>) => () => timer.Api<PropTypes>;
@@ -1 +1 @@
1
- export declare const tourAnatomy: import("@zag-js/anatomy").AnatomyInstance<"title" | "content" | "control" | "positioner" | "description" | "arrow" | "actionTrigger" | "closeTrigger" | "progressText" | "arrowTip" | "backdrop" | "spotlight">;
1
+ export declare const tourAnatomy: import("@zag-js/anatomy").AnatomyInstance<"title" | "content" | "control" | "backdrop" | "closeTrigger" | "positioner" | "description" | "arrow" | "actionTrigger" | "progressText" | "arrowTip" | "spotlight">;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ark-ui/svelte",
3
3
  "type": "module",
4
- "version": "5.10.0",
4
+ "version": "5.10.1",
5
5
  "description": "A collection of unstyled, accessible UI components for Svelte",
6
6
  "keywords": [
7
7
  "accordion",
@@ -66,27 +66,33 @@
66
66
  "exports": {
67
67
  ".": {
68
68
  "types": "./dist/index.d.ts",
69
- "svelte": "./dist/index.js"
69
+ "svelte": "./dist/index.js",
70
+ "default": "./dist/index.js"
70
71
  },
71
72
  "./anatomy": {
72
73
  "types": "./dist/components/anatomy.d.ts",
73
- "svelte": "./dist/components/anatomy.js"
74
+ "svelte": "./dist/components/anatomy.js",
75
+ "default": "./dist/components/anatomy.js"
74
76
  },
75
77
  "./environment": {
76
78
  "types": "./dist/providers/environment/index.d.ts",
77
- "svelte": "./dist/providers/environment/index.js"
79
+ "svelte": "./dist/providers/environment/index.js",
80
+ "default": "./dist/providers/environment/index.js"
78
81
  },
79
82
  "./locale": {
80
83
  "types": "./dist/providers/locale/index.d.ts",
81
- "svelte": "./dist/providers/locale/index.js"
84
+ "svelte": "./dist/providers/locale/index.js",
85
+ "default": "./dist/providers/locale/index.js"
82
86
  },
83
87
  "./utils": {
84
88
  "types": "./dist/utils/index.d.ts",
85
- "svelte": "./dist/utils/index.js"
89
+ "svelte": "./dist/utils/index.js",
90
+ "default": "./dist/utils/index.js"
86
91
  },
87
92
  "./*": {
88
93
  "types": "./dist/components/*/index.d.ts",
89
- "svelte": "./dist/components/*/index.js"
94
+ "svelte": "./dist/components/*/index.js",
95
+ "default": "./dist/components/*/index.js"
90
96
  }
91
97
  },
92
98
  "scripts": {
@@ -107,16 +113,22 @@
107
113
  "svelte": "./dist/index.js",
108
114
  "exports.\\..svelte": "./dist/index.js",
109
115
  "exports.\\..types": "./dist/index.d.ts",
116
+ "exports.\\..default": "./dist/index.js",
110
117
  "exports.\\./anatomy.svelte": "./dist/components/anatomy.js",
111
118
  "exports.\\./anatomy.types": "./dist/components/anatomy.d.ts",
119
+ "exports.\\./anatomy.default": "./dist/components/anatomy.js",
112
120
  "exports.\\./locale.svelte": "./dist/providers/locale/index.js",
113
121
  "exports.\\./locale.types": "./dist/providers/locale/index.d.ts",
122
+ "exports.\\./locale.default": "./dist/providers/locale/index.js",
114
123
  "exports.\\./environment.svelte": "./dist/providers/environment/index.js",
115
124
  "exports.\\./environment.types": "./dist/providers/environment/index.d.ts",
125
+ "exports.\\./environment.default": "./dist/providers/environment/index.js",
116
126
  "exports.\\./utils.svelte": "./dist/utils/index.js",
117
127
  "exports.\\./utils.types": "./dist/utils/index.d.ts",
128
+ "exports.\\./utils.default": "./dist/utils/index.js",
118
129
  "exports.\\./*.svelte": "./dist/components/*/index.js",
119
- "exports.\\./*.types": "./dist/components/*/index.d.ts"
130
+ "exports.\\./*.types": "./dist/components/*/index.d.ts",
131
+ "exports.\\./*.default": "./dist/components/*/index.js"
120
132
  }
121
133
  },
122
134
  "publishConfig": {
@@ -125,74 +137,75 @@
125
137
  "sideEffects": false,
126
138
  "dependencies": {
127
139
  "@internationalized/date": "3.9.0",
128
- "@zag-js/accordion": "1.24.1",
129
- "@zag-js/anatomy": "1.24.1",
130
- "@zag-js/angle-slider": "1.24.1",
131
- "@zag-js/async-list": "1.24.1",
132
- "@zag-js/auto-resize": "1.24.1",
133
- "@zag-js/avatar": "1.24.1",
134
- "@zag-js/carousel": "1.24.1",
135
- "@zag-js/checkbox": "1.24.1",
136
- "@zag-js/clipboard": "1.24.1",
137
- "@zag-js/collapsible": "1.24.1",
138
- "@zag-js/collection": "1.24.1",
139
- "@zag-js/color-picker": "1.24.1",
140
- "@zag-js/color-utils": "1.24.1",
141
- "@zag-js/combobox": "1.24.1",
142
- "@zag-js/core": "1.24.1",
143
- "@zag-js/date-picker": "1.24.1",
144
- "@zag-js/date-utils": "1.24.1",
145
- "@zag-js/dialog": "1.24.1",
146
- "@zag-js/dom-query": "1.24.1",
147
- "@zag-js/editable": "1.24.1",
148
- "@zag-js/file-upload": "1.24.1",
149
- "@zag-js/file-utils": "1.24.1",
150
- "@zag-js/floating-panel": "1.24.1",
151
- "@zag-js/focus-trap": "1.24.1",
152
- "@zag-js/highlight-word": "1.24.1",
153
- "@zag-js/hover-card": "1.24.1",
154
- "@zag-js/i18n-utils": "1.24.1",
155
- "@zag-js/json-tree-utils": "1.24.1",
156
- "@zag-js/listbox": "1.24.1",
157
- "@zag-js/menu": "1.24.1",
158
- "@zag-js/number-input": "1.24.1",
159
- "@zag-js/pagination": "1.24.1",
160
- "@zag-js/password-input": "1.24.1",
161
- "@zag-js/pin-input": "1.24.1",
162
- "@zag-js/popover": "1.24.1",
163
- "@zag-js/presence": "1.24.1",
164
- "@zag-js/progress": "1.24.1",
165
- "@zag-js/qr-code": "1.24.1",
166
- "@zag-js/radio-group": "1.24.1",
167
- "@zag-js/rating-group": "1.24.1",
168
- "@zag-js/scroll-area": "1.24.1",
169
- "@zag-js/select": "1.24.1",
170
- "@zag-js/signature-pad": "1.24.1",
171
- "@zag-js/slider": "1.24.1",
172
- "@zag-js/splitter": "1.24.1",
173
- "@zag-js/steps": "1.24.1",
174
- "@zag-js/svelte": "1.24.1",
175
- "@zag-js/switch": "1.24.1",
176
- "@zag-js/tabs": "1.24.1",
177
- "@zag-js/tags-input": "1.24.1",
178
- "@zag-js/timer": "1.24.1",
179
- "@zag-js/toast": "1.24.1",
180
- "@zag-js/toggle": "1.24.1",
181
- "@zag-js/toggle-group": "1.24.1",
182
- "@zag-js/tooltip": "1.24.1",
183
- "@zag-js/tour": "1.24.1",
184
- "@zag-js/tree-view": "1.24.1",
185
- "@zag-js/types": "1.24.1",
186
- "@zag-js/utils": "1.24.1"
140
+ "@zag-js/accordion": "1.24.2",
141
+ "@zag-js/anatomy": "1.24.2",
142
+ "@zag-js/angle-slider": "1.24.2",
143
+ "@zag-js/async-list": "1.24.2",
144
+ "@zag-js/auto-resize": "1.24.2",
145
+ "@zag-js/avatar": "1.24.2",
146
+ "@zag-js/bottom-sheet": "1.24.2",
147
+ "@zag-js/carousel": "1.24.2",
148
+ "@zag-js/checkbox": "1.24.2",
149
+ "@zag-js/clipboard": "1.24.2",
150
+ "@zag-js/collapsible": "1.24.2",
151
+ "@zag-js/collection": "1.24.2",
152
+ "@zag-js/color-picker": "1.24.2",
153
+ "@zag-js/color-utils": "1.24.2",
154
+ "@zag-js/combobox": "1.24.2",
155
+ "@zag-js/core": "1.24.2",
156
+ "@zag-js/date-picker": "1.24.2",
157
+ "@zag-js/date-utils": "1.24.2",
158
+ "@zag-js/dialog": "1.24.2",
159
+ "@zag-js/dom-query": "1.24.2",
160
+ "@zag-js/editable": "1.24.2",
161
+ "@zag-js/file-upload": "1.24.2",
162
+ "@zag-js/file-utils": "1.24.2",
163
+ "@zag-js/floating-panel": "1.24.2",
164
+ "@zag-js/focus-trap": "1.24.2",
165
+ "@zag-js/highlight-word": "1.24.2",
166
+ "@zag-js/hover-card": "1.24.2",
167
+ "@zag-js/i18n-utils": "1.24.2",
168
+ "@zag-js/json-tree-utils": "1.24.2",
169
+ "@zag-js/listbox": "1.24.2",
170
+ "@zag-js/menu": "1.24.2",
171
+ "@zag-js/number-input": "1.24.2",
172
+ "@zag-js/pagination": "1.24.2",
173
+ "@zag-js/password-input": "1.24.2",
174
+ "@zag-js/pin-input": "1.24.2",
175
+ "@zag-js/popover": "1.24.2",
176
+ "@zag-js/presence": "1.24.2",
177
+ "@zag-js/progress": "1.24.2",
178
+ "@zag-js/qr-code": "1.24.2",
179
+ "@zag-js/radio-group": "1.24.2",
180
+ "@zag-js/rating-group": "1.24.2",
181
+ "@zag-js/scroll-area": "1.24.2",
182
+ "@zag-js/select": "1.24.2",
183
+ "@zag-js/signature-pad": "1.24.2",
184
+ "@zag-js/slider": "1.24.2",
185
+ "@zag-js/splitter": "1.24.2",
186
+ "@zag-js/steps": "1.24.2",
187
+ "@zag-js/svelte": "1.24.2",
188
+ "@zag-js/switch": "1.24.2",
189
+ "@zag-js/tabs": "1.24.2",
190
+ "@zag-js/tags-input": "1.24.2",
191
+ "@zag-js/timer": "1.24.2",
192
+ "@zag-js/toast": "1.24.2",
193
+ "@zag-js/toggle": "1.24.2",
194
+ "@zag-js/toggle-group": "1.24.2",
195
+ "@zag-js/tooltip": "1.24.2",
196
+ "@zag-js/tour": "1.24.2",
197
+ "@zag-js/tree-view": "1.24.2",
198
+ "@zag-js/types": "1.24.2",
199
+ "@zag-js/utils": "1.24.2"
187
200
  },
188
201
  "devDependencies": {
189
- "@storybook/addon-a11y": "9.1.5",
190
- "@storybook/sveltekit": "9.1.5",
202
+ "@storybook/addon-a11y": "9.1.7",
203
+ "@storybook/sveltekit": "9.1.7",
191
204
  "@sveltejs/adapter-auto": "6.1.0",
192
- "@sveltejs/kit": "2.39.1",
193
- "@sveltejs/package": "2.5.1",
205
+ "@sveltejs/kit": "2.42.2",
206
+ "@sveltejs/package": "2.5.3",
194
207
  "@sveltejs/vite-plugin-svelte": "6.2.0",
195
- "@tanstack/svelte-form": "1.20.0",
208
+ "@tanstack/svelte-form": "1.23.0",
196
209
  "@testing-library/dom": "10.4.1",
197
210
  "@testing-library/jest-dom": "6.8.0",
198
211
  "@testing-library/svelte": "5.2.8",
@@ -202,12 +215,12 @@
202
215
  "image-conversion": "2.1.1",
203
216
  "jsdom": "26.1.0",
204
217
  "lucide-svelte": "0.544.0",
205
- "storybook": "9.1.5",
206
- "svelte": "5.38.10",
218
+ "storybook": "9.1.7",
219
+ "svelte": "5.39.4",
207
220
  "svelte-check": "4.3.1",
208
221
  "tslib": "2.8.1",
209
222
  "typescript": "5.9.2",
210
- "vite": "7.1.5",
223
+ "vite": "7.1.6",
211
224
  "vitest": "3.2.4",
212
225
  "vitest-axe": "1.0.0-pre.5"
213
226
  },