base-vaul 0.0.2 → 0.1.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/index.d.mts CHANGED
@@ -1,148 +1,186 @@
1
- import * as _base_ui_react from '@base-ui/react';
2
- import { Dialog } from '@base-ui/react';
3
- import * as react_jsx_runtime from 'react/jsx-runtime';
4
- import React from 'react';
1
+ import * as _base_ui_react0 from "@base-ui/react";
2
+ import { Dialog } from "@base-ui/react";
3
+ import React from "react";
4
+ import * as react_jsx_runtime0 from "react/jsx-runtime";
5
5
 
6
+ //#region src/context.d.ts
6
7
  type BaseUIMouseEvent = React.MouseEvent<HTMLDivElement> & {
7
- preventBaseUIHandler: () => void;
8
- readonly baseUIHandlerPrevented?: boolean | undefined;
8
+ preventBaseUIHandler: () => void;
9
+ readonly baseUIHandlerPrevented?: boolean | undefined;
9
10
  };
10
-
11
+ //#endregion
12
+ //#region src/index.d.ts
11
13
  interface WithFadeFromProps {
12
- /**
13
- * Array of numbers from 0 to 100 that corresponds to % of the screen a given snap point should take up.
14
- * Should go from least visible. Example `[0.2, 0.5, 0.8]`.
15
- * You can also use px values, which doesn't take screen height into account.
16
- */
17
- snapPoints: (number | string)[];
18
- /**
19
- * Index of a `snapPoint` from which the overlay fade should be applied. Defaults to the last snap point.
20
- */
21
- fadeFromIndex: number;
14
+ /**
15
+ * Array of numbers from 0 to 100 that corresponds to % of the screen a given snap point should take up.
16
+ * Should go from least visible. Example `[0.2, 0.5, 0.8]`.
17
+ * You can also use px values, which doesn't take screen height into account.
18
+ */
19
+ snapPoints: (number | string)[];
20
+ /**
21
+ * Index of a `snapPoint` from which the overlay fade should be applied. Defaults to the last snap point.
22
+ */
23
+ fadeFromIndex: number;
22
24
  }
23
25
  interface WithoutFadeFromProps {
24
- /**
25
- * Array of numbers from 0 to 100 that corresponds to % of the screen a given snap point should take up.
26
- * Should go from least visible. Example `[0.2, 0.5, 0.8]`.
27
- * You can also use px values, which doesn't take screen height into account.
28
- */
29
- snapPoints?: (number | string)[];
30
- fadeFromIndex?: never;
26
+ /**
27
+ * Array of numbers from 0 to 100 that corresponds to % of the screen a given snap point should take up.
28
+ * Should go from least visible. Example `[0.2, 0.5, 0.8]`.
29
+ * You can also use px values, which doesn't take screen height into account.
30
+ */
31
+ snapPoints?: (number | string)[];
32
+ fadeFromIndex?: never;
31
33
  }
32
34
  type DialogProps = {
33
- activeSnapPoint?: number | string | null;
34
- setActiveSnapPoint?: (snapPoint: number | string | null) => void;
35
- children?: React.ReactNode;
36
- open?: boolean;
37
- /**
38
- * Number between 0 and 1 that determines when the drawer should be closed.
39
- * Example: threshold of 0.5 would close the drawer if the user swiped for 50% of the height of the drawer or more.
40
- * @default 0.25
41
- */
42
- closeThreshold?: number;
43
- /**
44
- * When `true` the `body` doesn't get any styles assigned from Vaul
45
- */
46
- noBodyStyles?: boolean;
47
- onOpenChange?: (open: boolean) => void;
48
- shouldScaleBackground?: boolean;
49
- /**
50
- * When `false` we don't change body's background color when the drawer is open.
51
- * @default true
52
- */
53
- setBackgroundColorOnScale?: boolean;
54
- /**
55
- * Duration for which the drawer is not draggable after scrolling content inside of the drawer.
56
- * @default 500ms
57
- */
58
- scrollLockTimeout?: number;
59
- /**
60
- * When `true`, don't move the drawer upwards if there's space, but rather only change it's height so it's fully scrollable when the keyboard is open
61
- */
62
- fixed?: boolean;
63
- /**
64
- * When `true` only allows the drawer to be dragged by the `<Drawer.Handle />` component.
65
- * @default false
66
- */
67
- handleOnly?: boolean;
68
- /**
69
- * When `false` dragging, clicking outside, pressing esc, etc. will not close the drawer.
70
- * Use this in comination with the `open` prop, otherwise you won't be able to open/close the drawer.
71
- * @default true
72
- */
73
- dismissible?: boolean;
74
- onDrag?: (event: BaseUIMouseEvent, percentageDragged: number) => void;
75
- onRelease?: (event: BaseUIMouseEvent, open: boolean) => void;
76
- /**
77
- * When `false` it allows to interact with elements outside of the drawer without closing it.
78
- * @default true
79
- */
80
- modal?: boolean;
81
- nested?: boolean;
82
- onClose?: () => void;
83
- /**
84
- * Direction of the drawer. Can be `top` or `bottom`, `left`, `right`.
85
- * @default 'bottom'
86
- */
87
- direction?: "top" | "bottom" | "left" | "right";
88
- /**
89
- * Opened by default, skips initial enter animation. Still reacts to `open` state changes
90
- * @default false
91
- */
92
- defaultOpen?: boolean;
93
- /**
94
- * When set to `true` prevents scrolling on the document body on mount, and restores it on unmount.
95
- * @default false
96
- */
97
- disablePreventScroll?: boolean;
98
- /**
99
- * When `true` Vaul will reposition inputs rather than scroll then into view if the keyboard is in the way.
100
- * Setting it to `false` will fall back to the default browser behavior.
101
- * @default true when {@link snapPoints} is defined
102
- */
103
- repositionInputs?: boolean;
104
- /**
105
- * Disabled velocity based swiping for snap points.
106
- * This means that a snap point won't be skipped even if the velocity is high enough.
107
- * Useful if each snap point in a drawer is equally important.
108
- * @default false
109
- */
110
- snapToSequentialPoint?: boolean;
111
- container?: HTMLElement | null;
112
- /**
113
- * Gets triggered after the open or close animation ends, it receives an `open` argument with the `open` state of the drawer by the time the function was triggered.
114
- * Useful to revert any state changes for example.
115
- */
116
- onAnimationEnd?: (open: boolean) => void;
117
- preventScrollRestoration?: boolean;
118
- autoFocus?: boolean;
35
+ activeSnapPoint?: number | string | null;
36
+ setActiveSnapPoint?: (snapPoint: number | string | null) => void;
37
+ children?: React.ReactNode;
38
+ open?: boolean;
39
+ /**
40
+ * Number between 0 and 1 that determines when the drawer should be closed.
41
+ * Example: threshold of 0.5 would close the drawer if the user swiped for 50% of the height of the drawer or more.
42
+ * @default 0.25
43
+ */
44
+ closeThreshold?: number;
45
+ /**
46
+ * When `true` the `body` doesn't get any styles assigned from Vaul
47
+ */
48
+ noBodyStyles?: boolean;
49
+ onOpenChange?: (open: boolean) => void;
50
+ shouldScaleBackground?: boolean;
51
+ /**
52
+ * When `false` we don't change body's background color when the drawer is open.
53
+ * @default true
54
+ */
55
+ setBackgroundColorOnScale?: boolean;
56
+ /**
57
+ * Duration for which the drawer is not draggable after scrolling content inside of the drawer.
58
+ * @default 500ms
59
+ */
60
+ scrollLockTimeout?: number;
61
+ /**
62
+ * When `true`, don't move the drawer upwards if there's space, but rather only change it's height so it's fully scrollable when the keyboard is open
63
+ */
64
+ fixed?: boolean;
65
+ /**
66
+ * When `true` only allows the drawer to be dragged by the `<Drawer.Handle />` component.
67
+ * @default false
68
+ */
69
+ handleOnly?: boolean;
70
+ /**
71
+ * When `false` dragging, clicking outside, pressing esc, etc. will not close the drawer.
72
+ * Use this in comination with the `open` prop, otherwise you won't be able to open/close the drawer.
73
+ * @default true
74
+ */
75
+ dismissible?: boolean;
76
+ onDrag?: (event: BaseUIMouseEvent, percentageDragged: number) => void;
77
+ onRelease?: (event: BaseUIMouseEvent, open: boolean) => void;
78
+ /**
79
+ * When `false` it allows to interact with elements outside of the drawer without closing it.
80
+ * @default true
81
+ */
82
+ modal?: boolean;
83
+ nested?: boolean;
84
+ onClose?: () => void;
85
+ /**
86
+ * Direction of the drawer. Can be `top` or `bottom`, `left`, `right`.
87
+ * @default 'bottom'
88
+ */
89
+ direction?: "top" | "bottom" | "left" | "right";
90
+ /**
91
+ * Opened by default, skips initial enter animation. Still reacts to `open` state changes
92
+ * @default false
93
+ */
94
+ defaultOpen?: boolean;
95
+ /**
96
+ * When set to `true` prevents scrolling on the document body on mount, and restores it on unmount.
97
+ * @default false
98
+ */
99
+ disablePreventScroll?: boolean;
100
+ /**
101
+ * When `true` Vaul will reposition inputs rather than scroll then into view if the keyboard is in the way.
102
+ * Setting it to `false` will fall back to the default browser behavior.
103
+ * @default true when {@link snapPoints} is defined
104
+ */
105
+ repositionInputs?: boolean;
106
+ /**
107
+ * Disabled velocity based swiping for snap points.
108
+ * This means that a snap point won't be skipped even if the velocity is high enough.
109
+ * Useful if each snap point in a drawer is equally important.
110
+ * @default false
111
+ */
112
+ snapToSequentialPoint?: boolean;
113
+ container?: HTMLElement | null;
114
+ /**
115
+ * Gets triggered after the open or close animation ends, it receives an `open` argument with the `open` state of the drawer by the time the function was triggered.
116
+ * Useful to revert any state changes for example.
117
+ */
118
+ onAnimationEnd?: (open: boolean) => void;
119
+ preventScrollRestoration?: boolean;
120
+ autoFocus?: boolean;
119
121
  } & (WithFadeFromProps | WithoutFadeFromProps);
120
- declare function Root({ open: openProp, onOpenChange, children, onDrag: onDragProp, onRelease: onReleaseProp, snapPoints, shouldScaleBackground, setBackgroundColorOnScale, closeThreshold, scrollLockTimeout, dismissible, handleOnly, fadeFromIndex, activeSnapPoint: activeSnapPointProp, setActiveSnapPoint: setActiveSnapPointProp, fixed, modal, onClose, nested, noBodyStyles, direction, defaultOpen, disablePreventScroll, snapToSequentialPoint, preventScrollRestoration, repositionInputs, onAnimationEnd, container, autoFocus, }: DialogProps): react_jsx_runtime.JSX.Element;
121
- declare const Overlay: React.ForwardRefExoticComponent<Omit<_base_ui_react.DialogBackdropProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
122
+ declare function Root({
123
+ open: openProp,
124
+ onOpenChange,
125
+ children,
126
+ onDrag: onDragProp,
127
+ onRelease: onReleaseProp,
128
+ snapPoints,
129
+ shouldScaleBackground,
130
+ setBackgroundColorOnScale,
131
+ closeThreshold,
132
+ scrollLockTimeout,
133
+ dismissible,
134
+ handleOnly,
135
+ fadeFromIndex,
136
+ activeSnapPoint: activeSnapPointProp,
137
+ setActiveSnapPoint: setActiveSnapPointProp,
138
+ fixed,
139
+ modal,
140
+ onClose,
141
+ nested,
142
+ noBodyStyles,
143
+ direction,
144
+ defaultOpen,
145
+ disablePreventScroll,
146
+ snapToSequentialPoint,
147
+ preventScrollRestoration,
148
+ repositionInputs,
149
+ onAnimationEnd,
150
+ container,
151
+ autoFocus
152
+ }: DialogProps): react_jsx_runtime0.JSX.Element;
153
+ declare const Overlay: React.ForwardRefExoticComponent<Omit<_base_ui_react0.DialogBackdropProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
122
154
  type ContentProps = React.ComponentPropsWithoutRef<typeof Dialog.Popup>;
123
- declare const Content: React.ForwardRefExoticComponent<Omit<_base_ui_react.DialogPopupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
155
+ declare const Content: React.ForwardRefExoticComponent<Omit<_base_ui_react0.DialogPopupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
124
156
  type HandleProps = React.ComponentPropsWithoutRef<"div"> & {
125
- preventCycle?: boolean;
157
+ preventCycle?: boolean;
126
158
  };
127
159
  declare const Handle: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
128
- preventCycle?: boolean;
160
+ preventCycle?: boolean;
129
161
  } & React.RefAttributes<HTMLDivElement>>;
130
- declare function NestedRoot({ onDrag, onOpenChange, open: nestedIsOpen, ...rest }: DialogProps): react_jsx_runtime.JSX.Element;
162
+ declare function NestedRoot({
163
+ onDrag,
164
+ onOpenChange,
165
+ open: nestedIsOpen,
166
+ ...rest
167
+ }: DialogProps): react_jsx_runtime0.JSX.Element;
131
168
  type PortalProps = React.ComponentPropsWithoutRef<typeof Dialog.Portal>;
132
- declare function Portal(props: PortalProps): react_jsx_runtime.JSX.Element;
169
+ declare function Portal(props: PortalProps): react_jsx_runtime0.JSX.Element;
133
170
  declare const Drawer: {
134
- Root: typeof Root;
135
- NestedRoot: typeof NestedRoot;
136
- Content: React.ForwardRefExoticComponent<Omit<_base_ui_react.DialogPopupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
137
- Overlay: React.ForwardRefExoticComponent<Omit<_base_ui_react.DialogBackdropProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
138
- Trigger: Dialog.Trigger;
139
- Portal: typeof Portal;
140
- Handle: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
141
- preventCycle?: boolean;
142
- } & React.RefAttributes<HTMLDivElement>>;
143
- Close: React.ForwardRefExoticComponent<_base_ui_react.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
144
- Title: React.ForwardRefExoticComponent<_base_ui_react.DialogTitleProps & React.RefAttributes<HTMLParagraphElement>>;
145
- Description: React.ForwardRefExoticComponent<_base_ui_react.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
171
+ Root: typeof Root;
172
+ NestedRoot: typeof NestedRoot;
173
+ Content: React.ForwardRefExoticComponent<Omit<_base_ui_react0.DialogPopupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
174
+ Overlay: React.ForwardRefExoticComponent<Omit<_base_ui_react0.DialogBackdropProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
175
+ Trigger: Dialog.Trigger;
176
+ Portal: typeof Portal;
177
+ Handle: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
178
+ preventCycle?: boolean;
179
+ } & React.RefAttributes<HTMLDivElement>>;
180
+ Close: React.ForwardRefExoticComponent<_base_ui_react0.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
181
+ Title: React.ForwardRefExoticComponent<_base_ui_react0.DialogTitleProps & React.RefAttributes<HTMLParagraphElement>>;
182
+ Description: React.ForwardRefExoticComponent<_base_ui_react0.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
146
183
  };
147
-
148
- export { Content, type ContentProps, type DialogProps, Drawer, Handle, type HandleProps, NestedRoot, Overlay, Portal, Root, type WithFadeFromProps, type WithoutFadeFromProps };
184
+ //#endregion
185
+ export { Content, ContentProps, DialogProps, Drawer, Handle, HandleProps, NestedRoot, Overlay, Portal, Root, WithFadeFromProps, WithoutFadeFromProps };
186
+ //# sourceMappingURL=index.d.mts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.mts","names":[],"sources":["../src/context.ts","../src/index.tsx"],"sourcesContent":[],"mappings":";;;;;;KAIY,gBAAA,GAAmB,KAAA,CAAM,WAAW;;;;;;UC6B/B,iBAAA;;AD7BjB;;;;EC6BiB,UAAA,EAAA,CAAA,MAAA,GAAiB,MAAA,CAAA,EAAA;EAajB;AAUjB;;EA0CmB,aAAA,EAAA,MAAA;;AAqCL,UAzFG,oBAAA,CAyFH;EAQT;;;AAEL;;EAEE,UAAA,CAAA,EAAA,CAAA,MAAA,GAAA,MAAA,CAAA,EAAA;EACA,aAAA,CAAA,EAAA,KAAA;;AAEW,KA9FD,WAAA,GA8FC;EACX,eAAA,CAAA,EAAA,MAAA,GAAA,MAAA,GAAA,IAAA;EACA,kBAAA,CAAA,EAAA,CAAA,SAAA,EAAA,MAAA,GAAA,MAAA,GAAA,IAAA,EAAA,GAAA,IAAA;EACA,QAAA,CAAA,EA9FW,KAAA,CAAM,SA8FjB;EACA,IAAA,CAAA,EAAA,OAAA;EACA;;;;;EAKoB,cAAA,CAAA,EAAA,MAAA;EACpB;;;EAGA,YAAA,CAAA,EAAA,OAAA;EACA,YAAA,CAAA,EAAA,CAAA,IAAA,EAAA,OAAA,EAAA,GAAA,IAAA;EACA,qBAAA,CAAA,EAAA,OAAA;EACA;;;;EAIA,yBAAA,CAAA,EAAA,OAAA;EACA;;;;EAGY,iBAAA,CAAA,EAAA,MAAA;EAAA;AAyuBd;;EAAoB,KAAA,CAAA,EAAA,OAAA;EAAA;;;;EAAA,UAAA,CAAA,EAAA,OAAA;EAAA;AAwCpB;AAIA;;;EAAoB,WAAA,CAAA,EAAA,OAAA;EAAA,MAAA,CAAA,EAAA,CAAA,KAAA,EAl2BD,gBAk2BC,EAAA,iBAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAAA,SAAA,CAAA,EAAA,CAAA,KAAA,EAj2BE,gBAi2BF,EAAA,IAAA,EAAA,OAAA,EAAA,GAAA,IAAA;EAAA;;;AAmJpB;EAOa,KAAA,CAAA,EAAA,OA6GX;EA7GiB,MAAA,CAAA,EAAA,OAAA;EAAA,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EAAA;;;;;EAAA;;AAiHnB;;EAEE,WAAA,CAAA,EAAA,OAAA;EACM;;;;EAiCH,oBAAW,CAAA,EAAA,OACP;EAGO;AAOhB;;;;;;;;;;;;cAvnCc;;;;;;;;KAQT,oBAAoB;iBAET,IAAA;QACR;;;UAGE;aACG;;;;;;;;;mBASM;sBACG;;;;;;;;;;;;;;;GAenB,cAAW,kBAAA,CAAA,GAAA,CAAA;cAyuBD,SAAO,KAAA,CAAA,0BAAA,KAoClB,eAAA,CApCkB,mBAAA,GAAA,KAAA,CAAA,cAAA,0BAAA,KAAA,CAAA,cAAA;KAwCR,YAAA,GAAe,KAAA,CAAM,gCACxB,MAAA,CAAgB;cAGZ,SAAO,KAAA,CAAA,0BAAA,KA+IlB,eAAA,CA/IkB,gBAAA,GAAA,KAAA,CAAA,cAAA,0BAAA,KAAA,CAAA,cAAA;KAmJR,WAAA,GAAc,KAAA,CAAM;;;cAOnB,QAAM,KAAA,CAAA,0BAAA,KAAA,KAAA,CAAA,kBAAA,KAAA,CAAA,eAAA,iBAAA;;;iBAiHH,UAAA;;;QAGR;;GAEL,cAAW,kBAAA,CAAA,GAAA,CAAA;KA+BT,WAAA,GAAc,KAAA,CAAM,gCAChB,MAAA,CAAgB;iBAGT,MAAA,QAAc,cAAW,kBAAA,CAAA,GAAA,CAAA;cAO5B"}