@ark-ui/vue 5.25.0 → 5.25.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.
- package/dist/components/anatomy.cjs +5 -0
- package/dist/components/anatomy.d.cts +1 -0
- package/dist/components/anatomy.d.ts +1 -0
- package/dist/components/anatomy.js +1 -0
- package/dist/components/bottom-sheet/bottom-sheet-backdrop.vue.cjs +35 -0
- package/dist/components/bottom-sheet/bottom-sheet-backdrop.vue.d.cts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-backdrop.vue.d.ts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-backdrop.vue.js +31 -0
- package/dist/components/bottom-sheet/bottom-sheet-backdrop.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-backdrop.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet-close-trigger.vue.cjs +30 -0
- package/dist/components/bottom-sheet/bottom-sheet-close-trigger.vue.d.cts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-close-trigger.vue.d.ts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-close-trigger.vue.js +26 -0
- package/dist/components/bottom-sheet/bottom-sheet-close-trigger.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-close-trigger.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet-content.vue.cjs +44 -0
- package/dist/components/bottom-sheet/bottom-sheet-content.vue.d.cts +22 -0
- package/dist/components/bottom-sheet/bottom-sheet-content.vue.d.ts +22 -0
- package/dist/components/bottom-sheet/bottom-sheet-content.vue.js +40 -0
- package/dist/components/bottom-sheet/bottom-sheet-content.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-content.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet-context.vue.cjs +18 -0
- package/dist/components/bottom-sheet/bottom-sheet-context.vue.d.cts +17 -0
- package/dist/components/bottom-sheet/bottom-sheet-context.vue.d.ts +17 -0
- package/dist/components/bottom-sheet/bottom-sheet-context.vue.js +14 -0
- package/dist/components/bottom-sheet/bottom-sheet-context.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-context.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber-indicator.vue.cjs +30 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber-indicator.vue.d.cts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber-indicator.vue.d.ts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber-indicator.vue.js +26 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber-indicator.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber-indicator.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber.vue.cjs +30 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber.vue.d.cts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber.vue.d.ts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber.vue.js +26 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-grabber.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet-root-provider.vue.cjs +34 -0
- package/dist/components/bottom-sheet/bottom-sheet-root-provider.vue.d.cts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-root-provider.vue.d.ts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-root-provider.vue.js +30 -0
- package/dist/components/bottom-sheet/bottom-sheet-root-provider.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-root-provider.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet-root.vue.cjs +70 -0
- package/dist/components/bottom-sheet/bottom-sheet-root.vue.d.cts +39 -0
- package/dist/components/bottom-sheet/bottom-sheet-root.vue.d.ts +39 -0
- package/dist/components/bottom-sheet/bottom-sheet-root.vue.js +66 -0
- package/dist/components/bottom-sheet/bottom-sheet-root.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-root.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet-title.vue.cjs +30 -0
- package/dist/components/bottom-sheet/bottom-sheet-title.vue.d.cts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-title.vue.d.ts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-title.vue.js +26 -0
- package/dist/components/bottom-sheet/bottom-sheet-title.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-title.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet-trigger.vue.cjs +30 -0
- package/dist/components/bottom-sheet/bottom-sheet-trigger.vue.d.cts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-trigger.vue.d.ts +19 -0
- package/dist/components/bottom-sheet/bottom-sheet-trigger.vue.js +26 -0
- package/dist/components/bottom-sheet/bottom-sheet-trigger.vue2.cjs +9 -0
- package/dist/components/bottom-sheet/bottom-sheet-trigger.vue2.js +5 -0
- package/dist/components/bottom-sheet/bottom-sheet.anatomy.d.cts +1 -0
- package/dist/components/bottom-sheet/bottom-sheet.anatomy.d.ts +1 -0
- package/dist/components/bottom-sheet/bottom-sheet.cjs +27 -0
- package/dist/components/bottom-sheet/bottom-sheet.d.cts +11 -0
- package/dist/components/bottom-sheet/bottom-sheet.d.ts +11 -0
- package/dist/components/bottom-sheet/bottom-sheet.js +10 -0
- package/dist/components/bottom-sheet/bottom-sheet.types.d.cts +110 -0
- package/dist/components/bottom-sheet/bottom-sheet.types.d.ts +110 -0
- package/dist/components/bottom-sheet/index.cjs +38 -0
- package/dist/components/bottom-sheet/index.d.cts +15 -0
- package/dist/components/bottom-sheet/index.d.ts +15 -0
- package/dist/components/bottom-sheet/index.js +15 -0
- package/dist/components/bottom-sheet/use-bottom-sheet-context.cjs +11 -0
- package/dist/components/bottom-sheet/use-bottom-sheet-context.d.cts +4 -0
- package/dist/components/bottom-sheet/use-bottom-sheet-context.d.ts +4 -0
- package/dist/components/bottom-sheet/use-bottom-sheet-context.js +6 -0
- package/dist/components/bottom-sheet/use-bottom-sheet.cjs +56 -0
- package/dist/components/bottom-sheet/use-bottom-sheet.d.cts +10 -0
- package/dist/components/bottom-sheet/use-bottom-sheet.d.ts +10 -0
- package/dist/components/bottom-sheet/use-bottom-sheet.js +33 -0
- package/dist/components/dialog/dialog-root.vue.d.cts +4 -4
- package/dist/components/dialog/dialog-root.vue.d.ts +4 -4
- package/dist/components/format/format-byte.vue.cjs +1 -0
- package/dist/components/format/format-byte.vue.d.cts +4 -0
- package/dist/components/format/format-byte.vue.d.ts +4 -0
- package/dist/components/format/format-byte.vue.js +1 -0
- package/dist/components/index.cjs +31 -0
- package/dist/components/index.d.cts +1 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +15 -0
- package/dist/components/popover/popover-root.vue.d.cts +2 -2
- package/dist/components/popover/popover-root.vue.d.ts +2 -2
- package/dist/index.cjs +31 -0
- package/dist/index.js +15 -0
- package/package.json +62 -61
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { HTMLAttributes, DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
|
|
2
|
+
import { PolymorphicProps } from '../factory';
|
|
3
|
+
export interface BottomSheetTriggerBaseProps extends PolymorphicProps {
|
|
4
|
+
}
|
|
5
|
+
export interface BottomSheetTriggerProps extends BottomSheetTriggerBaseProps,
|
|
6
|
+
/**
|
|
7
|
+
* @vue-ignore
|
|
8
|
+
*/
|
|
9
|
+
HTMLAttributes {
|
|
10
|
+
}
|
|
11
|
+
declare const _default: __VLS_WithTemplateSlots< DefineComponent<BottomSheetTriggerProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<BottomSheetTriggerProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
|
|
12
|
+
default?(_: {}): any;
|
|
13
|
+
}>;
|
|
14
|
+
export default _default;
|
|
15
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
16
|
+
new (): {
|
|
17
|
+
$slots: S;
|
|
18
|
+
};
|
|
19
|
+
};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
|
|
2
|
+
import { ark } from '../factory.js';
|
|
3
|
+
import { useBottomSheetContext } from './use-bottom-sheet-context.js';
|
|
4
|
+
import '@zag-js/core';
|
|
5
|
+
import { useForwardExpose } from '../../utils/use-forward-expose.js';
|
|
6
|
+
|
|
7
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
8
|
+
__name: "bottom-sheet-trigger",
|
|
9
|
+
props: {
|
|
10
|
+
asChild: { type: Boolean }
|
|
11
|
+
},
|
|
12
|
+
setup(__props) {
|
|
13
|
+
const bottomSheet = useBottomSheetContext();
|
|
14
|
+
useForwardExpose();
|
|
15
|
+
return (_ctx, _cache) => {
|
|
16
|
+
return openBlock(), createBlock(unref(ark).button, mergeProps(unref(bottomSheet).getTriggerProps(), { "as-child": _ctx.asChild }), {
|
|
17
|
+
default: withCtx(() => [
|
|
18
|
+
renderSlot(_ctx.$slots, "default")
|
|
19
|
+
]),
|
|
20
|
+
_: 3
|
|
21
|
+
}, 16, ["as-child"]);
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
|
|
26
|
+
export { _sfc_main as default };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
|
|
4
|
+
|
|
5
|
+
const bottomSheetTrigger_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-trigger.vue.cjs');
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
exports.default = bottomSheetTrigger_vue_vue_type_script_setup_true_lang.default;
|
|
@@ -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,27 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
|
+
|
|
5
|
+
const bottomSheetBackdrop_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-backdrop.vue.cjs');
|
|
6
|
+
const bottomSheetCloseTrigger_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-close-trigger.vue.cjs');
|
|
7
|
+
const bottomSheetContent_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-content.vue.cjs');
|
|
8
|
+
const bottomSheetContext_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-context.vue.cjs');
|
|
9
|
+
const bottomSheetGrabber_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-grabber.vue.cjs');
|
|
10
|
+
const bottomSheetGrabberIndicator_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-grabber-indicator.vue.cjs');
|
|
11
|
+
const bottomSheetRoot_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-root.vue.cjs');
|
|
12
|
+
const bottomSheetRootProvider_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-root-provider.vue.cjs');
|
|
13
|
+
const bottomSheetTitle_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-title.vue.cjs');
|
|
14
|
+
const bottomSheetTrigger_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-trigger.vue.cjs');
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
exports.Backdrop = bottomSheetBackdrop_vue_vue_type_script_setup_true_lang.default;
|
|
19
|
+
exports.CloseTrigger = bottomSheetCloseTrigger_vue_vue_type_script_setup_true_lang.default;
|
|
20
|
+
exports.Content = bottomSheetContent_vue_vue_type_script_setup_true_lang.default;
|
|
21
|
+
exports.Context = bottomSheetContext_vue_vue_type_script_setup_true_lang.default;
|
|
22
|
+
exports.Grabber = bottomSheetGrabber_vue_vue_type_script_setup_true_lang.default;
|
|
23
|
+
exports.GrabberIndicator = bottomSheetGrabberIndicator_vue_vue_type_script_setup_true_lang.default;
|
|
24
|
+
exports.Root = bottomSheetRoot_vue_vue_type_script_setup_true_lang.default;
|
|
25
|
+
exports.RootProvider = bottomSheetRootProvider_vue_vue_type_script_setup_true_lang.default;
|
|
26
|
+
exports.Title = bottomSheetTitle_vue_vue_type_script_setup_true_lang.default;
|
|
27
|
+
exports.Trigger = bottomSheetTrigger_vue_vue_type_script_setup_true_lang.default;
|
|
@@ -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.vue';
|
|
3
|
+
export { default as CloseTrigger, type BottomSheetCloseTriggerBaseProps as CloseTriggerBaseProps, type BottomSheetCloseTriggerProps as CloseTriggerProps, } from './bottom-sheet-close-trigger.vue';
|
|
4
|
+
export { default as Content, type BottomSheetContentBaseProps as ContentBaseProps, type BottomSheetContentProps as ContentProps, } from './bottom-sheet-content.vue';
|
|
5
|
+
export { default as Context, type BottomSheetContextProps as ContextProps } from './bottom-sheet-context.vue';
|
|
6
|
+
export { default as Grabber, type BottomSheetGrabberBaseProps as GrabberBaseProps, type BottomSheetGrabberProps as GrabberProps, } from './bottom-sheet-grabber.vue';
|
|
7
|
+
export { default as GrabberIndicator, type BottomSheetGrabberIndicatorBaseProps as GrabberIndicatorBaseProps, type BottomSheetGrabberIndicatorProps as GrabberIndicatorProps, } from './bottom-sheet-grabber-indicator.vue';
|
|
8
|
+
export { default as Root, type BottomSheetRootBaseProps as RootBaseProps, type BottomSheetRootProps as RootProps, } from './bottom-sheet-root.vue';
|
|
9
|
+
export { default as RootProvider, type BottomSheetRootProviderBaseProps as RootProviderBaseProps, type BottomSheetRootProviderProps as RootProviderProps, } from './bottom-sheet-root-provider.vue';
|
|
10
|
+
export { default as Title, type BottomSheetTitleBaseProps as TitleBaseProps, type BottomSheetTitleProps as TitleProps, } from './bottom-sheet-title.vue';
|
|
11
|
+
export { default as Trigger, type BottomSheetTriggerBaseProps as TriggerBaseProps, type BottomSheetTriggerProps as TriggerProps, } from './bottom-sheet-trigger.vue';
|
|
@@ -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.vue';
|
|
3
|
+
export { default as CloseTrigger, type BottomSheetCloseTriggerBaseProps as CloseTriggerBaseProps, type BottomSheetCloseTriggerProps as CloseTriggerProps, } from './bottom-sheet-close-trigger.vue';
|
|
4
|
+
export { default as Content, type BottomSheetContentBaseProps as ContentBaseProps, type BottomSheetContentProps as ContentProps, } from './bottom-sheet-content.vue';
|
|
5
|
+
export { default as Context, type BottomSheetContextProps as ContextProps } from './bottom-sheet-context.vue';
|
|
6
|
+
export { default as Grabber, type BottomSheetGrabberBaseProps as GrabberBaseProps, type BottomSheetGrabberProps as GrabberProps, } from './bottom-sheet-grabber.vue';
|
|
7
|
+
export { default as GrabberIndicator, type BottomSheetGrabberIndicatorBaseProps as GrabberIndicatorBaseProps, type BottomSheetGrabberIndicatorProps as GrabberIndicatorProps, } from './bottom-sheet-grabber-indicator.vue';
|
|
8
|
+
export { default as Root, type BottomSheetRootBaseProps as RootBaseProps, type BottomSheetRootProps as RootProps, } from './bottom-sheet-root.vue';
|
|
9
|
+
export { default as RootProvider, type BottomSheetRootProviderBaseProps as RootProviderBaseProps, type BottomSheetRootProviderProps as RootProviderProps, } from './bottom-sheet-root-provider.vue';
|
|
10
|
+
export { default as Title, type BottomSheetTitleBaseProps as TitleBaseProps, type BottomSheetTitleProps as TitleProps, } from './bottom-sheet-title.vue';
|
|
11
|
+
export { default as Trigger, type BottomSheetTriggerBaseProps as TriggerBaseProps, type BottomSheetTriggerProps as TriggerProps, } from './bottom-sheet-trigger.vue';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export { default as Backdrop } from './bottom-sheet-backdrop.vue.js';
|
|
2
|
+
export { default as CloseTrigger } from './bottom-sheet-close-trigger.vue.js';
|
|
3
|
+
export { default as Content } from './bottom-sheet-content.vue.js';
|
|
4
|
+
export { default as Context } from './bottom-sheet-context.vue.js';
|
|
5
|
+
export { default as Grabber } from './bottom-sheet-grabber.vue.js';
|
|
6
|
+
export { default as GrabberIndicator } from './bottom-sheet-grabber-indicator.vue.js';
|
|
7
|
+
export { default as Root } from './bottom-sheet-root.vue.js';
|
|
8
|
+
export { default as RootProvider } from './bottom-sheet-root-provider.vue.js';
|
|
9
|
+
export { default as Title } from './bottom-sheet-title.vue.js';
|
|
10
|
+
export { default as Trigger } from './bottom-sheet-trigger.vue.js';
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import type * as bottomSheet from '@zag-js/bottom-sheet';
|
|
2
|
+
export interface RootProps {
|
|
3
|
+
/**
|
|
4
|
+
* The unique identifier of the machine.
|
|
5
|
+
*/
|
|
6
|
+
id?: string;
|
|
7
|
+
/**
|
|
8
|
+
* The ids of the elements in the bottom sheet. Useful for composition.
|
|
9
|
+
*/
|
|
10
|
+
ids?: Partial<{
|
|
11
|
+
backdrop: string;
|
|
12
|
+
content: string;
|
|
13
|
+
trigger: string;
|
|
14
|
+
grabber: string;
|
|
15
|
+
grabberIndicator: string;
|
|
16
|
+
closeTrigger: string;
|
|
17
|
+
}>;
|
|
18
|
+
/**
|
|
19
|
+
* Whether to trap focus inside the sheet when it's opened.
|
|
20
|
+
* @default true
|
|
21
|
+
*/
|
|
22
|
+
trapFocus?: boolean;
|
|
23
|
+
/**
|
|
24
|
+
* Whether to prevent scrolling behind the sheet when it's opened
|
|
25
|
+
* @default true
|
|
26
|
+
*/
|
|
27
|
+
preventScroll?: boolean;
|
|
28
|
+
/**
|
|
29
|
+
* Whether to prevent pointer interaction outside the element and hide all content below it.
|
|
30
|
+
* @default true
|
|
31
|
+
*/
|
|
32
|
+
modal?: boolean;
|
|
33
|
+
/**
|
|
34
|
+
* Element to receive focus when the sheet is opened.
|
|
35
|
+
*/
|
|
36
|
+
initialFocusEl?: () => HTMLElement | null;
|
|
37
|
+
/**
|
|
38
|
+
* Element to receive focus when the sheet is closed.
|
|
39
|
+
*/
|
|
40
|
+
finalFocusEl?: () => HTMLElement | null;
|
|
41
|
+
/**
|
|
42
|
+
* Whether to restore focus to the element that had focus before the sheet was opened.
|
|
43
|
+
*/
|
|
44
|
+
restoreFocus?: boolean;
|
|
45
|
+
/**
|
|
46
|
+
* The sheet's role
|
|
47
|
+
* @default "dialog"
|
|
48
|
+
*/
|
|
49
|
+
role?: 'dialog' | 'alertdialog';
|
|
50
|
+
/**
|
|
51
|
+
* Whether the bottom sheet is open.
|
|
52
|
+
*/
|
|
53
|
+
open?: boolean;
|
|
54
|
+
/**
|
|
55
|
+
* The initial open state of the bottom sheet.
|
|
56
|
+
*/
|
|
57
|
+
defaultOpen?: boolean;
|
|
58
|
+
/**
|
|
59
|
+
* Whether to close the bottom sheet when the outside is clicked.
|
|
60
|
+
* @default true
|
|
61
|
+
*/
|
|
62
|
+
closeOnInteractOutside?: boolean;
|
|
63
|
+
/**
|
|
64
|
+
* Whether to close the bottom sheet when the escape key is pressed.
|
|
65
|
+
* @default true
|
|
66
|
+
*/
|
|
67
|
+
closeOnEscape?: boolean;
|
|
68
|
+
/**
|
|
69
|
+
* The snap points of the bottom sheet.
|
|
70
|
+
* Array of numbers or strings representing the snap points.
|
|
71
|
+
* @default [1]
|
|
72
|
+
*/
|
|
73
|
+
snapPoints?: (number | string)[];
|
|
74
|
+
/**
|
|
75
|
+
* The threshold velocity (in pixels/s) for closing the bottom sheet.
|
|
76
|
+
* @default 5
|
|
77
|
+
*/
|
|
78
|
+
swipeVelocityThreshold?: number;
|
|
79
|
+
/**
|
|
80
|
+
* The threshold distance for dismissing the bottom sheet.
|
|
81
|
+
* @default 0.25
|
|
82
|
+
*/
|
|
83
|
+
closeThreshold?: number;
|
|
84
|
+
/**
|
|
85
|
+
* Whether to prevent dragging on scrollable elements.
|
|
86
|
+
* @default true
|
|
87
|
+
*/
|
|
88
|
+
preventDragOnScroll?: boolean;
|
|
89
|
+
/**
|
|
90
|
+
* The currently active snap point.
|
|
91
|
+
*/
|
|
92
|
+
activeSnapPoint?: number | string;
|
|
93
|
+
/**
|
|
94
|
+
* The default active snap point of the bottom sheet.
|
|
95
|
+
* @default 1
|
|
96
|
+
*/
|
|
97
|
+
defaultActiveSnapPoint?: number | string;
|
|
98
|
+
}
|
|
99
|
+
export type RootEmits = {
|
|
100
|
+
/**
|
|
101
|
+
* Function called when the open state changes.
|
|
102
|
+
*/
|
|
103
|
+
openChange: [details: bottomSheet.OpenChangeDetails];
|
|
104
|
+
/**
|
|
105
|
+
* Callback fired when the active snap point changes.
|
|
106
|
+
*/
|
|
107
|
+
activeSnapPointChange: [details: {
|
|
108
|
+
snapPoint: number | string;
|
|
109
|
+
}];
|
|
110
|
+
};
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import type * as bottomSheet from '@zag-js/bottom-sheet';
|
|
2
|
+
export interface RootProps {
|
|
3
|
+
/**
|
|
4
|
+
* The unique identifier of the machine.
|
|
5
|
+
*/
|
|
6
|
+
id?: string;
|
|
7
|
+
/**
|
|
8
|
+
* The ids of the elements in the bottom sheet. Useful for composition.
|
|
9
|
+
*/
|
|
10
|
+
ids?: Partial<{
|
|
11
|
+
backdrop: string;
|
|
12
|
+
content: string;
|
|
13
|
+
trigger: string;
|
|
14
|
+
grabber: string;
|
|
15
|
+
grabberIndicator: string;
|
|
16
|
+
closeTrigger: string;
|
|
17
|
+
}>;
|
|
18
|
+
/**
|
|
19
|
+
* Whether to trap focus inside the sheet when it's opened.
|
|
20
|
+
* @default true
|
|
21
|
+
*/
|
|
22
|
+
trapFocus?: boolean;
|
|
23
|
+
/**
|
|
24
|
+
* Whether to prevent scrolling behind the sheet when it's opened
|
|
25
|
+
* @default true
|
|
26
|
+
*/
|
|
27
|
+
preventScroll?: boolean;
|
|
28
|
+
/**
|
|
29
|
+
* Whether to prevent pointer interaction outside the element and hide all content below it.
|
|
30
|
+
* @default true
|
|
31
|
+
*/
|
|
32
|
+
modal?: boolean;
|
|
33
|
+
/**
|
|
34
|
+
* Element to receive focus when the sheet is opened.
|
|
35
|
+
*/
|
|
36
|
+
initialFocusEl?: () => HTMLElement | null;
|
|
37
|
+
/**
|
|
38
|
+
* Element to receive focus when the sheet is closed.
|
|
39
|
+
*/
|
|
40
|
+
finalFocusEl?: () => HTMLElement | null;
|
|
41
|
+
/**
|
|
42
|
+
* Whether to restore focus to the element that had focus before the sheet was opened.
|
|
43
|
+
*/
|
|
44
|
+
restoreFocus?: boolean;
|
|
45
|
+
/**
|
|
46
|
+
* The sheet's role
|
|
47
|
+
* @default "dialog"
|
|
48
|
+
*/
|
|
49
|
+
role?: 'dialog' | 'alertdialog';
|
|
50
|
+
/**
|
|
51
|
+
* Whether the bottom sheet is open.
|
|
52
|
+
*/
|
|
53
|
+
open?: boolean;
|
|
54
|
+
/**
|
|
55
|
+
* The initial open state of the bottom sheet.
|
|
56
|
+
*/
|
|
57
|
+
defaultOpen?: boolean;
|
|
58
|
+
/**
|
|
59
|
+
* Whether to close the bottom sheet when the outside is clicked.
|
|
60
|
+
* @default true
|
|
61
|
+
*/
|
|
62
|
+
closeOnInteractOutside?: boolean;
|
|
63
|
+
/**
|
|
64
|
+
* Whether to close the bottom sheet when the escape key is pressed.
|
|
65
|
+
* @default true
|
|
66
|
+
*/
|
|
67
|
+
closeOnEscape?: boolean;
|
|
68
|
+
/**
|
|
69
|
+
* The snap points of the bottom sheet.
|
|
70
|
+
* Array of numbers or strings representing the snap points.
|
|
71
|
+
* @default [1]
|
|
72
|
+
*/
|
|
73
|
+
snapPoints?: (number | string)[];
|
|
74
|
+
/**
|
|
75
|
+
* The threshold velocity (in pixels/s) for closing the bottom sheet.
|
|
76
|
+
* @default 5
|
|
77
|
+
*/
|
|
78
|
+
swipeVelocityThreshold?: number;
|
|
79
|
+
/**
|
|
80
|
+
* The threshold distance for dismissing the bottom sheet.
|
|
81
|
+
* @default 0.25
|
|
82
|
+
*/
|
|
83
|
+
closeThreshold?: number;
|
|
84
|
+
/**
|
|
85
|
+
* Whether to prevent dragging on scrollable elements.
|
|
86
|
+
* @default true
|
|
87
|
+
*/
|
|
88
|
+
preventDragOnScroll?: boolean;
|
|
89
|
+
/**
|
|
90
|
+
* The currently active snap point.
|
|
91
|
+
*/
|
|
92
|
+
activeSnapPoint?: number | string;
|
|
93
|
+
/**
|
|
94
|
+
* The default active snap point of the bottom sheet.
|
|
95
|
+
* @default 1
|
|
96
|
+
*/
|
|
97
|
+
defaultActiveSnapPoint?: number | string;
|
|
98
|
+
}
|
|
99
|
+
export type RootEmits = {
|
|
100
|
+
/**
|
|
101
|
+
* Function called when the open state changes.
|
|
102
|
+
*/
|
|
103
|
+
openChange: [details: bottomSheet.OpenChangeDetails];
|
|
104
|
+
/**
|
|
105
|
+
* Callback fired when the active snap point changes.
|
|
106
|
+
*/
|
|
107
|
+
activeSnapPointChange: [details: {
|
|
108
|
+
snapPoint: number | string;
|
|
109
|
+
}];
|
|
110
|
+
};
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
|
+
|
|
5
|
+
const bottomSheetBackdrop_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-backdrop.vue.cjs');
|
|
6
|
+
const bottomSheetCloseTrigger_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-close-trigger.vue.cjs');
|
|
7
|
+
const bottomSheetContent_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-content.vue.cjs');
|
|
8
|
+
const bottomSheetContext_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-context.vue.cjs');
|
|
9
|
+
const bottomSheetGrabber_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-grabber.vue.cjs');
|
|
10
|
+
const bottomSheetGrabberIndicator_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-grabber-indicator.vue.cjs');
|
|
11
|
+
const bottomSheetRoot_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-root.vue.cjs');
|
|
12
|
+
const bottomSheetRootProvider_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-root-provider.vue.cjs');
|
|
13
|
+
const bottomSheetTitle_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-title.vue.cjs');
|
|
14
|
+
const bottomSheetTrigger_vue_vue_type_script_setup_true_lang = require('./bottom-sheet-trigger.vue.cjs');
|
|
15
|
+
const useBottomSheet = require('./use-bottom-sheet.cjs');
|
|
16
|
+
const useBottomSheetContext = require('./use-bottom-sheet-context.cjs');
|
|
17
|
+
const bottomSheet$1 = require('./bottom-sheet.cjs');
|
|
18
|
+
const bottomSheet = require('@zag-js/bottom-sheet');
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
exports.BottomSheetBackdrop = bottomSheetBackdrop_vue_vue_type_script_setup_true_lang.default;
|
|
23
|
+
exports.BottomSheetCloseTrigger = bottomSheetCloseTrigger_vue_vue_type_script_setup_true_lang.default;
|
|
24
|
+
exports.BottomSheetContent = bottomSheetContent_vue_vue_type_script_setup_true_lang.default;
|
|
25
|
+
exports.BottomSheetContext = bottomSheetContext_vue_vue_type_script_setup_true_lang.default;
|
|
26
|
+
exports.BottomSheetGrabber = bottomSheetGrabber_vue_vue_type_script_setup_true_lang.default;
|
|
27
|
+
exports.BottomSheetGrabberIndicator = bottomSheetGrabberIndicator_vue_vue_type_script_setup_true_lang.default;
|
|
28
|
+
exports.BottomSheetRoot = bottomSheetRoot_vue_vue_type_script_setup_true_lang.default;
|
|
29
|
+
exports.BottomSheetRootProvider = bottomSheetRootProvider_vue_vue_type_script_setup_true_lang.default;
|
|
30
|
+
exports.BottomSheetTitle = bottomSheetTitle_vue_vue_type_script_setup_true_lang.default;
|
|
31
|
+
exports.BottomSheetTrigger = bottomSheetTrigger_vue_vue_type_script_setup_true_lang.default;
|
|
32
|
+
exports.useBottomSheet = useBottomSheet.useBottomSheet;
|
|
33
|
+
exports.useBottomSheetContext = useBottomSheetContext.useBottomSheetContext;
|
|
34
|
+
exports.BottomSheet = bottomSheet$1;
|
|
35
|
+
Object.defineProperty(exports, "bottomSheetAnatomy", {
|
|
36
|
+
enumerable: true,
|
|
37
|
+
get: () => bottomSheet.anatomy
|
|
38
|
+
});
|
|
@@ -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.vue';
|
|
3
|
+
export { default as BottomSheetCloseTrigger, type BottomSheetCloseTriggerBaseProps, type BottomSheetCloseTriggerProps, } from './bottom-sheet-close-trigger.vue';
|
|
4
|
+
export { default as BottomSheetContent, type BottomSheetContentBaseProps, type BottomSheetContentProps, } from './bottom-sheet-content.vue';
|
|
5
|
+
export { default as BottomSheetContext, type BottomSheetContextProps } from './bottom-sheet-context.vue';
|
|
6
|
+
export { default as BottomSheetGrabber, type BottomSheetGrabberBaseProps, type BottomSheetGrabberProps, } from './bottom-sheet-grabber.vue';
|
|
7
|
+
export { default as BottomSheetGrabberIndicator, type BottomSheetGrabberIndicatorBaseProps, type BottomSheetGrabberIndicatorProps, } from './bottom-sheet-grabber-indicator.vue';
|
|
8
|
+
export { default as BottomSheetRoot, type BottomSheetRootBaseProps, type BottomSheetRootProps, } from './bottom-sheet-root.vue';
|
|
9
|
+
export { default as BottomSheetRootProvider, type BottomSheetRootProviderBaseProps, type BottomSheetRootProviderProps, } from './bottom-sheet-root-provider.vue';
|
|
10
|
+
export { default as BottomSheetTitle, type BottomSheetTitleBaseProps, type BottomSheetTitleProps, } from './bottom-sheet-title.vue';
|
|
11
|
+
export { default as BottomSheetTrigger, type BottomSheetTriggerBaseProps, type BottomSheetTriggerProps, } from './bottom-sheet-trigger.vue';
|
|
12
|
+
export { bottomSheetAnatomy } from './bottom-sheet.anatomy';
|
|
13
|
+
export { useBottomSheet, type UseBottomSheetProps, type UseBottomSheetReturn } from './use-bottom-sheet';
|
|
14
|
+
export { useBottomSheetContext, type UseBottomSheetContext } from './use-bottom-sheet-context';
|
|
15
|
+
export * as BottomSheet from './bottom-sheet';
|
|
@@ -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.vue';
|
|
3
|
+
export { default as BottomSheetCloseTrigger, type BottomSheetCloseTriggerBaseProps, type BottomSheetCloseTriggerProps, } from './bottom-sheet-close-trigger.vue';
|
|
4
|
+
export { default as BottomSheetContent, type BottomSheetContentBaseProps, type BottomSheetContentProps, } from './bottom-sheet-content.vue';
|
|
5
|
+
export { default as BottomSheetContext, type BottomSheetContextProps } from './bottom-sheet-context.vue';
|
|
6
|
+
export { default as BottomSheetGrabber, type BottomSheetGrabberBaseProps, type BottomSheetGrabberProps, } from './bottom-sheet-grabber.vue';
|
|
7
|
+
export { default as BottomSheetGrabberIndicator, type BottomSheetGrabberIndicatorBaseProps, type BottomSheetGrabberIndicatorProps, } from './bottom-sheet-grabber-indicator.vue';
|
|
8
|
+
export { default as BottomSheetRoot, type BottomSheetRootBaseProps, type BottomSheetRootProps, } from './bottom-sheet-root.vue';
|
|
9
|
+
export { default as BottomSheetRootProvider, type BottomSheetRootProviderBaseProps, type BottomSheetRootProviderProps, } from './bottom-sheet-root-provider.vue';
|
|
10
|
+
export { default as BottomSheetTitle, type BottomSheetTitleBaseProps, type BottomSheetTitleProps, } from './bottom-sheet-title.vue';
|
|
11
|
+
export { default as BottomSheetTrigger, type BottomSheetTriggerBaseProps, type BottomSheetTriggerProps, } from './bottom-sheet-trigger.vue';
|
|
12
|
+
export { bottomSheetAnatomy } from './bottom-sheet.anatomy';
|
|
13
|
+
export { useBottomSheet, type UseBottomSheetProps, type UseBottomSheetReturn } from './use-bottom-sheet';
|
|
14
|
+
export { useBottomSheetContext, type UseBottomSheetContext } from './use-bottom-sheet-context';
|
|
15
|
+
export * as BottomSheet from './bottom-sheet';
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export { default as BottomSheetBackdrop } from './bottom-sheet-backdrop.vue.js';
|
|
2
|
+
export { default as BottomSheetCloseTrigger } from './bottom-sheet-close-trigger.vue.js';
|
|
3
|
+
export { default as BottomSheetContent } from './bottom-sheet-content.vue.js';
|
|
4
|
+
export { default as BottomSheetContext } from './bottom-sheet-context.vue.js';
|
|
5
|
+
export { default as BottomSheetGrabber } from './bottom-sheet-grabber.vue.js';
|
|
6
|
+
export { default as BottomSheetGrabberIndicator } from './bottom-sheet-grabber-indicator.vue.js';
|
|
7
|
+
export { default as BottomSheetRoot } from './bottom-sheet-root.vue.js';
|
|
8
|
+
export { default as BottomSheetRootProvider } from './bottom-sheet-root-provider.vue.js';
|
|
9
|
+
export { default as BottomSheetTitle } from './bottom-sheet-title.vue.js';
|
|
10
|
+
export { default as BottomSheetTrigger } from './bottom-sheet-trigger.vue.js';
|
|
11
|
+
export { useBottomSheet } from './use-bottom-sheet.js';
|
|
12
|
+
export { useBottomSheetContext } from './use-bottom-sheet-context.js';
|
|
13
|
+
import * as bottomSheet from './bottom-sheet.js';
|
|
14
|
+
export { bottomSheet as BottomSheet };
|
|
15
|
+
export { anatomy as bottomSheetAnatomy } from '@zag-js/bottom-sheet';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
|
+
|
|
5
|
+
const createContext = require('../../utils/create-context.cjs');
|
|
6
|
+
require('@zag-js/core');
|
|
7
|
+
|
|
8
|
+
const [BottomSheetProvider, useBottomSheetContext] = createContext.createContext("BottomSheetContext");
|
|
9
|
+
|
|
10
|
+
exports.BottomSheetProvider = BottomSheetProvider;
|
|
11
|
+
exports.useBottomSheetContext = useBottomSheetContext;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { UseBottomSheetReturn } from './use-bottom-sheet';
|
|
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 { UseBottomSheetReturn } from './use-bottom-sheet';
|
|
2
|
+
export interface UseBottomSheetContext extends UseBottomSheetReturn {
|
|
3
|
+
}
|
|
4
|
+
export declare const BottomSheetProvider: (opts: UseBottomSheetContext) => void, useBottomSheetContext: (fallback?: UseBottomSheetContext | undefined) => UseBottomSheetContext;
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
|
+
|
|
5
|
+
const bottomSheet = require('@zag-js/bottom-sheet');
|
|
6
|
+
const vue$1 = require('@zag-js/vue');
|
|
7
|
+
const vue = require('vue');
|
|
8
|
+
const useEnvironmentContext = require('../../providers/environment/use-environment-context.cjs');
|
|
9
|
+
const useLocaleContext = require('../../providers/locale/use-locale-context.cjs');
|
|
10
|
+
const cleanProps = require('../../utils/clean-props.cjs');
|
|
11
|
+
|
|
12
|
+
function _interopNamespaceDefault(e) {
|
|
13
|
+
const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
|
|
14
|
+
if (e) {
|
|
15
|
+
for (const k in e) {
|
|
16
|
+
if (k !== 'default') {
|
|
17
|
+
const d = Object.getOwnPropertyDescriptor(e, k);
|
|
18
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: () => e[k]
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
n.default = e;
|
|
26
|
+
return Object.freeze(n);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
const bottomSheet__namespace = /*#__PURE__*/_interopNamespaceDefault(bottomSheet);
|
|
30
|
+
|
|
31
|
+
const useBottomSheet = (props = {}, emit) => {
|
|
32
|
+
const id = vue.useId();
|
|
33
|
+
const env = useEnvironmentContext.useEnvironmentContext(useEnvironmentContext.DEFAULT_ENVIRONMENT);
|
|
34
|
+
const locale = useLocaleContext.useLocaleContext(useLocaleContext.DEFAULT_LOCALE);
|
|
35
|
+
const context = vue.computed(() => {
|
|
36
|
+
const localeProps = vue.toValue(props);
|
|
37
|
+
return {
|
|
38
|
+
id,
|
|
39
|
+
dir: locale.value.dir,
|
|
40
|
+
getRootNode: env?.value.getRootNode,
|
|
41
|
+
...cleanProps.cleanProps(localeProps),
|
|
42
|
+
onOpenChange: (details) => {
|
|
43
|
+
emit?.("openChange", details);
|
|
44
|
+
localeProps.onOpenChange?.(details);
|
|
45
|
+
},
|
|
46
|
+
onActiveSnapPointChange: (details) => {
|
|
47
|
+
emit?.("activeSnapPointChange", details);
|
|
48
|
+
localeProps.onActiveSnapPointChange?.(details);
|
|
49
|
+
}
|
|
50
|
+
};
|
|
51
|
+
});
|
|
52
|
+
const service = vue$1.useMachine(bottomSheet__namespace.machine, context);
|
|
53
|
+
return vue.computed(() => bottomSheet__namespace.connect(service, vue$1.normalizeProps));
|
|
54
|
+
};
|
|
55
|
+
|
|
56
|
+
exports.useBottomSheet = useBottomSheet;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { PropTypes } from '@zag-js/vue';
|
|
2
|
+
import { ComputedRef, MaybeRef } from 'vue';
|
|
3
|
+
import { EmitFn, Optional } from '../../types';
|
|
4
|
+
import { RootEmits } from './bottom-sheet.types';
|
|
5
|
+
import * as bottomSheet from '@zag-js/bottom-sheet';
|
|
6
|
+
export interface UseBottomSheetProps extends Optional<Omit<bottomSheet.Props, 'dir' | 'getRootNode'>, 'id'> {
|
|
7
|
+
}
|
|
8
|
+
export interface UseBottomSheetReturn extends ComputedRef<bottomSheet.Api<PropTypes>> {
|
|
9
|
+
}
|
|
10
|
+
export declare const useBottomSheet: (props?: MaybeRef<UseBottomSheetProps>, emit?: EmitFn<RootEmits>) => UseBottomSheetReturn;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { PropTypes } from '@zag-js/vue';
|
|
2
|
+
import { ComputedRef, MaybeRef } from 'vue';
|
|
3
|
+
import { EmitFn, Optional } from '../../types';
|
|
4
|
+
import { RootEmits } from './bottom-sheet.types';
|
|
5
|
+
import * as bottomSheet from '@zag-js/bottom-sheet';
|
|
6
|
+
export interface UseBottomSheetProps extends Optional<Omit<bottomSheet.Props, 'dir' | 'getRootNode'>, 'id'> {
|
|
7
|
+
}
|
|
8
|
+
export interface UseBottomSheetReturn extends ComputedRef<bottomSheet.Api<PropTypes>> {
|
|
9
|
+
}
|
|
10
|
+
export declare const useBottomSheet: (props?: MaybeRef<UseBottomSheetProps>, emit?: EmitFn<RootEmits>) => UseBottomSheetReturn;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import * as bottomSheet from '@zag-js/bottom-sheet';
|
|
2
|
+
import { useMachine, normalizeProps } from '@zag-js/vue';
|
|
3
|
+
import { useId, computed, toValue } from 'vue';
|
|
4
|
+
import { useEnvironmentContext, DEFAULT_ENVIRONMENT } from '../../providers/environment/use-environment-context.js';
|
|
5
|
+
import { useLocaleContext, DEFAULT_LOCALE } from '../../providers/locale/use-locale-context.js';
|
|
6
|
+
import { cleanProps } from '../../utils/clean-props.js';
|
|
7
|
+
|
|
8
|
+
const useBottomSheet = (props = {}, emit) => {
|
|
9
|
+
const id = useId();
|
|
10
|
+
const env = useEnvironmentContext(DEFAULT_ENVIRONMENT);
|
|
11
|
+
const locale = useLocaleContext(DEFAULT_LOCALE);
|
|
12
|
+
const context = computed(() => {
|
|
13
|
+
const localeProps = toValue(props);
|
|
14
|
+
return {
|
|
15
|
+
id,
|
|
16
|
+
dir: locale.value.dir,
|
|
17
|
+
getRootNode: env?.value.getRootNode,
|
|
18
|
+
...cleanProps(localeProps),
|
|
19
|
+
onOpenChange: (details) => {
|
|
20
|
+
emit?.("openChange", details);
|
|
21
|
+
localeProps.onOpenChange?.(details);
|
|
22
|
+
},
|
|
23
|
+
onActiveSnapPointChange: (details) => {
|
|
24
|
+
emit?.("activeSnapPointChange", details);
|
|
25
|
+
localeProps.onActiveSnapPointChange?.(details);
|
|
26
|
+
}
|
|
27
|
+
};
|
|
28
|
+
});
|
|
29
|
+
const service = useMachine(bottomSheet.machine, context);
|
|
30
|
+
return computed(() => bottomSheet.connect(service, normalizeProps));
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
export { useBottomSheet };
|
|
@@ -38,12 +38,12 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<DialogRootProps
|
|
|
38
38
|
}>, {
|
|
39
39
|
open: boolean;
|
|
40
40
|
defaultOpen: boolean;
|
|
41
|
-
|
|
42
|
-
closeOnInteractOutside: boolean;
|
|
43
|
-
modal: boolean;
|
|
41
|
+
trapFocus: boolean;
|
|
44
42
|
preventScroll: boolean;
|
|
43
|
+
modal: boolean;
|
|
45
44
|
restoreFocus: boolean;
|
|
46
|
-
|
|
45
|
+
closeOnInteractOutside: boolean;
|
|
46
|
+
closeOnEscape: boolean;
|
|
47
47
|
}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
|
|
48
48
|
default?(_: {}): any;
|
|
49
49
|
}>;
|
|
@@ -38,12 +38,12 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<DialogRootProps
|
|
|
38
38
|
}>, {
|
|
39
39
|
open: boolean;
|
|
40
40
|
defaultOpen: boolean;
|
|
41
|
-
|
|
42
|
-
closeOnInteractOutside: boolean;
|
|
43
|
-
modal: boolean;
|
|
41
|
+
trapFocus: boolean;
|
|
44
42
|
preventScroll: boolean;
|
|
43
|
+
modal: boolean;
|
|
45
44
|
restoreFocus: boolean;
|
|
46
|
-
|
|
45
|
+
closeOnInteractOutside: boolean;
|
|
46
|
+
closeOnEscape: boolean;
|
|
47
47
|
}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
|
|
48
48
|
default?(_: {}): any;
|
|
49
49
|
}>;
|