@surdeddd/bottom-sheet 0.2.0 → 0.4.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.
Files changed (49) hide show
  1. package/README.md +51 -21
  2. package/dist/{BottomSheetEngine-CIT9Htti.d.cts → BottomSheetEngine-BJrH7qY3.d.cts} +105 -3
  3. package/dist/{BottomSheetEngine-Df9MwBbm.d.ts → BottomSheetEngine-L05jGZvU.d.ts} +105 -3
  4. package/dist/element.cjs +1170 -196
  5. package/dist/element.d.cts +29 -5
  6. package/dist/element.d.ts +29 -5
  7. package/dist/element.iife.global.js +2 -2
  8. package/dist/element.js +1170 -196
  9. package/dist/index.cjs +1051 -220
  10. package/dist/index.d.cts +18 -3
  11. package/dist/index.d.ts +18 -3
  12. package/dist/index.js +1049 -221
  13. package/dist/integrations/formik.d.cts +1 -1
  14. package/dist/integrations/formik.d.ts +1 -1
  15. package/dist/integrations/react-hook-form.d.cts +1 -1
  16. package/dist/integrations/react-hook-form.d.ts +1 -1
  17. package/dist/overlay.cjs +181 -37
  18. package/dist/overlay.d.cts +13 -0
  19. package/dist/overlay.d.ts +13 -0
  20. package/dist/overlay.js +181 -37
  21. package/dist/preact.d.cts +1 -1
  22. package/dist/preact.d.ts +1 -1
  23. package/dist/qwik.cjs +966 -195
  24. package/dist/qwik.d.cts +4 -2
  25. package/dist/qwik.d.ts +4 -2
  26. package/dist/qwik.js +967 -196
  27. package/dist/react.cjs +1242 -272
  28. package/dist/react.d.cts +47 -5
  29. package/dist/react.d.ts +47 -5
  30. package/dist/react.js +1242 -272
  31. package/dist/solid.cjs +992 -236
  32. package/dist/solid.d.cts +299 -4
  33. package/dist/solid.d.ts +299 -4
  34. package/dist/solid.js +993 -237
  35. package/dist/solid.source.jsx +3476 -0
  36. package/dist/styles.css +67 -66
  37. package/dist/svelte-core.cjs +3415 -0
  38. package/dist/svelte-core.js +3413 -0
  39. package/dist/svelte-src/BottomSheet.svelte +308 -0
  40. package/dist/svelte-src/index.js +2 -0
  41. package/dist/svelte.cjs +1034 -207
  42. package/dist/svelte.d.cts +121 -0
  43. package/dist/svelte.d.ts +28 -3
  44. package/dist/svelte.js +1035 -208
  45. package/dist/vue.cjs +1191 -205
  46. package/dist/vue.d.cts +127 -0
  47. package/dist/vue.d.ts +57 -4
  48. package/dist/vue.js +1192 -206
  49. package/package.json +105 -45
package/dist/react.d.cts CHANGED
@@ -1,5 +1,5 @@
1
- import { b as EngineOptions, E as EngineState, j as ScrimUpdate, f as ScrimOverlayOptions, B as BottomSheetEngine, S as SnapPointDef, a as SheetMode } from './BottomSheetEngine-CIT9Htti.cjs';
2
- export { c as SnapPoint } from './BottomSheetEngine-CIT9Htti.cjs';
1
+ import { c as EngineOptions, E as EngineState, A as AnchorOptions, S as ScrimStagesOptions, p as ScrimStageDef, e as SheetEventMap, C as CloseReason, q as ScrimUpdate, m as ScrimOverlayOptions, B as BottomSheetEngine, a as SnapPointDef, b as SheetMode } from './BottomSheetEngine-BJrH7qY3.cjs';
2
+ export { d as SnapPoint } from './BottomSheetEngine-BJrH7qY3.cjs';
3
3
  import { OverlayOptions, OverlayState, Overlay as OverlayEngine } from './overlay.cjs';
4
4
  export { OverlayEdge } from './overlay.cjs';
5
5
  import * as react from 'react';
@@ -8,6 +8,15 @@ import './transform-jVfAikE9.cjs';
8
8
 
9
9
  type EngineOptionsForProps = Omit<EngineOptions, "element" | "handle" | "scrollContainer" | "backdrop" | "scrim">;
10
10
  type HeaderProp = ReactNode | ((state: EngineState) => ReactNode);
11
+ type BottomSheetAnchorProp = Omit<AnchorOptions, "element"> & {
12
+ node: ReactNode;
13
+ };
14
+ type BottomSheetScrimStageProp = Omit<ScrimStageDef, "element"> & {
15
+ node: ReactNode;
16
+ };
17
+ type BottomSheetScrimStagesProp = Omit<ScrimStagesOptions, "stages"> & {
18
+ stages: BottomSheetScrimStageProp[];
19
+ };
11
20
  type BottomSheetProps = EngineOptionsForProps & {
12
21
  backdrop?: boolean;
13
22
  closeOnBackdrop?: boolean;
@@ -18,7 +27,14 @@ type BottomSheetProps = EngineOptionsForProps & {
18
27
  leftButton?: ReactNode;
19
28
  rightButton?: ReactNode;
20
29
  screen?: ReactNode;
30
+ anchors?: BottomSheetAnchorProp[];
31
+ scrimStages?: BottomSheetScrimStagesProp;
21
32
  onChange?: (state: EngineState) => void;
33
+ onBeforeClose?: (payload: SheetEventMap["before-close"]) => void;
34
+ onOpened?: (id: string) => void;
35
+ onClosed?: () => void;
36
+ onDragStart?: (payload: SheetEventMap["dragstart"]) => void;
37
+ onDragEnd?: (payload: SheetEventMap["dragend"]) => void;
22
38
  ariaLabel?: string;
23
39
  ariaLabelledBy?: string;
24
40
  noSSR?: boolean;
@@ -26,11 +42,18 @@ type BottomSheetProps = EngineOptionsForProps & {
26
42
  type BottomSheetHandle<TId extends string = string> = {
27
43
  snapTo: (id: TId) => Promise<void>;
28
44
  open: (id?: TId) => Promise<void>;
29
- close: () => Promise<void>;
45
+ close: (reason?: CloseReason) => Promise<void>;
46
+ expand: () => Promise<void>;
47
+ collapse: () => Promise<void>;
48
+ isTop: () => boolean;
49
+ depth: () => number;
30
50
  setAllowed: (ids: TId[], snap?: TId) => void;
31
51
  setSnapPoints: (points: EngineOptions["snapPoints"], allowed?: string[]) => void;
32
52
  setScrim: (opts: ScrimUpdate) => void;
33
53
  setScrimOverlay: (opts: ScrimOverlayOptions) => () => void;
54
+ addAnchor: (opts: AnchorOptions) => () => void;
55
+ setScrimStages: (opts: ScrimStagesOptions | null) => () => void;
56
+ recompute: () => void;
34
57
  state: EngineState & {
35
58
  activeId: TId;
36
59
  };
@@ -46,7 +69,14 @@ declare const BottomSheet: react.ForwardRefExoticComponent<EngineOptionsForProps
46
69
  leftButton?: ReactNode;
47
70
  rightButton?: ReactNode;
48
71
  screen?: ReactNode;
72
+ anchors?: BottomSheetAnchorProp[];
73
+ scrimStages?: BottomSheetScrimStagesProp;
49
74
  onChange?: (state: EngineState) => void;
75
+ onBeforeClose?: (payload: SheetEventMap["before-close"]) => void;
76
+ onOpened?: (id: string) => void;
77
+ onClosed?: () => void;
78
+ onDragStart?: (payload: SheetEventMap["dragstart"]) => void;
79
+ onDragEnd?: (payload: SheetEventMap["dragend"]) => void;
50
80
  ariaLabel?: string;
51
81
  ariaLabelledBy?: string;
52
82
  noSSR?: boolean;
@@ -65,8 +95,15 @@ type UseBottomSheetReturn<TId extends string = string> = UseBottomSheetRefs & {
65
95
  };
66
96
  snapTo: (id: TId) => Promise<void>;
67
97
  open: (id?: TId) => Promise<void>;
68
- close: () => Promise<void>;
98
+ close: (reason?: CloseReason) => Promise<void>;
99
+ expand: () => Promise<void>;
100
+ collapse: () => Promise<void>;
101
+ isTop: () => boolean;
102
+ depth: () => number;
69
103
  setAllowed: (ids: TId[], snap?: TId) => void;
104
+ addAnchor: (opts: AnchorOptions) => () => void;
105
+ setScrimStages: (opts: ScrimStagesOptions | null) => () => void;
106
+ recompute: () => void;
70
107
  engine: BottomSheetEngine | null;
71
108
  getEngine: () => BottomSheetEngine | null;
72
109
  };
@@ -75,6 +112,11 @@ type HookOpts<TId extends string> = Omit<EngineOptions, "element" | "handle" | "
75
112
  allowed?: TId[] | ReadonlyArray<TId>;
76
113
  initial?: TId;
77
114
  onSnap?: (id: TId) => void;
115
+ onBeforeClose?: (payload: SheetEventMap["before-close"]) => void;
116
+ onOpened?: (id: TId) => void;
117
+ onClosed?: () => void;
118
+ onDragStart?: (payload: SheetEventMap["dragstart"]) => void;
119
+ onDragEnd?: (payload: SheetEventMap["dragend"]) => void;
78
120
  };
79
121
  declare function useBottomSheet<TId extends string = string>(opts: HookOpts<TId>): UseBottomSheetReturn<TId>;
80
122
 
@@ -94,7 +136,7 @@ type OverlayHandle = {
94
136
  toggle: () => Promise<void>;
95
137
  state: OverlayState;
96
138
  };
97
- declare const Overlay: react.ForwardRefExoticComponent<Omit<OverlayOptions, "element" | "backdrop"> & {
139
+ declare const Overlay: react.ForwardRefExoticComponent<Omit<OverlayOptions, "backdrop" | "element"> & {
98
140
  open?: boolean;
99
141
  backdrop?: boolean;
100
142
  className?: string;
package/dist/react.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { b as EngineOptions, E as EngineState, j as ScrimUpdate, f as ScrimOverlayOptions, B as BottomSheetEngine, S as SnapPointDef, a as SheetMode } from './BottomSheetEngine-Df9MwBbm.js';
2
- export { c as SnapPoint } from './BottomSheetEngine-Df9MwBbm.js';
1
+ import { c as EngineOptions, E as EngineState, A as AnchorOptions, S as ScrimStagesOptions, p as ScrimStageDef, e as SheetEventMap, C as CloseReason, q as ScrimUpdate, m as ScrimOverlayOptions, B as BottomSheetEngine, a as SnapPointDef, b as SheetMode } from './BottomSheetEngine-L05jGZvU.js';
2
+ export { d as SnapPoint } from './BottomSheetEngine-L05jGZvU.js';
3
3
  import { OverlayOptions, OverlayState, Overlay as OverlayEngine } from './overlay.js';
4
4
  export { OverlayEdge } from './overlay.js';
5
5
  import * as react from 'react';
@@ -8,6 +8,15 @@ import './transform-jVfAikE9.js';
8
8
 
9
9
  type EngineOptionsForProps = Omit<EngineOptions, "element" | "handle" | "scrollContainer" | "backdrop" | "scrim">;
10
10
  type HeaderProp = ReactNode | ((state: EngineState) => ReactNode);
11
+ type BottomSheetAnchorProp = Omit<AnchorOptions, "element"> & {
12
+ node: ReactNode;
13
+ };
14
+ type BottomSheetScrimStageProp = Omit<ScrimStageDef, "element"> & {
15
+ node: ReactNode;
16
+ };
17
+ type BottomSheetScrimStagesProp = Omit<ScrimStagesOptions, "stages"> & {
18
+ stages: BottomSheetScrimStageProp[];
19
+ };
11
20
  type BottomSheetProps = EngineOptionsForProps & {
12
21
  backdrop?: boolean;
13
22
  closeOnBackdrop?: boolean;
@@ -18,7 +27,14 @@ type BottomSheetProps = EngineOptionsForProps & {
18
27
  leftButton?: ReactNode;
19
28
  rightButton?: ReactNode;
20
29
  screen?: ReactNode;
30
+ anchors?: BottomSheetAnchorProp[];
31
+ scrimStages?: BottomSheetScrimStagesProp;
21
32
  onChange?: (state: EngineState) => void;
33
+ onBeforeClose?: (payload: SheetEventMap["before-close"]) => void;
34
+ onOpened?: (id: string) => void;
35
+ onClosed?: () => void;
36
+ onDragStart?: (payload: SheetEventMap["dragstart"]) => void;
37
+ onDragEnd?: (payload: SheetEventMap["dragend"]) => void;
22
38
  ariaLabel?: string;
23
39
  ariaLabelledBy?: string;
24
40
  noSSR?: boolean;
@@ -26,11 +42,18 @@ type BottomSheetProps = EngineOptionsForProps & {
26
42
  type BottomSheetHandle<TId extends string = string> = {
27
43
  snapTo: (id: TId) => Promise<void>;
28
44
  open: (id?: TId) => Promise<void>;
29
- close: () => Promise<void>;
45
+ close: (reason?: CloseReason) => Promise<void>;
46
+ expand: () => Promise<void>;
47
+ collapse: () => Promise<void>;
48
+ isTop: () => boolean;
49
+ depth: () => number;
30
50
  setAllowed: (ids: TId[], snap?: TId) => void;
31
51
  setSnapPoints: (points: EngineOptions["snapPoints"], allowed?: string[]) => void;
32
52
  setScrim: (opts: ScrimUpdate) => void;
33
53
  setScrimOverlay: (opts: ScrimOverlayOptions) => () => void;
54
+ addAnchor: (opts: AnchorOptions) => () => void;
55
+ setScrimStages: (opts: ScrimStagesOptions | null) => () => void;
56
+ recompute: () => void;
34
57
  state: EngineState & {
35
58
  activeId: TId;
36
59
  };
@@ -46,7 +69,14 @@ declare const BottomSheet: react.ForwardRefExoticComponent<EngineOptionsForProps
46
69
  leftButton?: ReactNode;
47
70
  rightButton?: ReactNode;
48
71
  screen?: ReactNode;
72
+ anchors?: BottomSheetAnchorProp[];
73
+ scrimStages?: BottomSheetScrimStagesProp;
49
74
  onChange?: (state: EngineState) => void;
75
+ onBeforeClose?: (payload: SheetEventMap["before-close"]) => void;
76
+ onOpened?: (id: string) => void;
77
+ onClosed?: () => void;
78
+ onDragStart?: (payload: SheetEventMap["dragstart"]) => void;
79
+ onDragEnd?: (payload: SheetEventMap["dragend"]) => void;
50
80
  ariaLabel?: string;
51
81
  ariaLabelledBy?: string;
52
82
  noSSR?: boolean;
@@ -65,8 +95,15 @@ type UseBottomSheetReturn<TId extends string = string> = UseBottomSheetRefs & {
65
95
  };
66
96
  snapTo: (id: TId) => Promise<void>;
67
97
  open: (id?: TId) => Promise<void>;
68
- close: () => Promise<void>;
98
+ close: (reason?: CloseReason) => Promise<void>;
99
+ expand: () => Promise<void>;
100
+ collapse: () => Promise<void>;
101
+ isTop: () => boolean;
102
+ depth: () => number;
69
103
  setAllowed: (ids: TId[], snap?: TId) => void;
104
+ addAnchor: (opts: AnchorOptions) => () => void;
105
+ setScrimStages: (opts: ScrimStagesOptions | null) => () => void;
106
+ recompute: () => void;
70
107
  engine: BottomSheetEngine | null;
71
108
  getEngine: () => BottomSheetEngine | null;
72
109
  };
@@ -75,6 +112,11 @@ type HookOpts<TId extends string> = Omit<EngineOptions, "element" | "handle" | "
75
112
  allowed?: TId[] | ReadonlyArray<TId>;
76
113
  initial?: TId;
77
114
  onSnap?: (id: TId) => void;
115
+ onBeforeClose?: (payload: SheetEventMap["before-close"]) => void;
116
+ onOpened?: (id: TId) => void;
117
+ onClosed?: () => void;
118
+ onDragStart?: (payload: SheetEventMap["dragstart"]) => void;
119
+ onDragEnd?: (payload: SheetEventMap["dragend"]) => void;
78
120
  };
79
121
  declare function useBottomSheet<TId extends string = string>(opts: HookOpts<TId>): UseBottomSheetReturn<TId>;
80
122
 
@@ -94,7 +136,7 @@ type OverlayHandle = {
94
136
  toggle: () => Promise<void>;
95
137
  state: OverlayState;
96
138
  };
97
- declare const Overlay: react.ForwardRefExoticComponent<Omit<OverlayOptions, "element" | "backdrop"> & {
139
+ declare const Overlay: react.ForwardRefExoticComponent<Omit<OverlayOptions, "backdrop" | "element"> & {
98
140
  open?: boolean;
99
141
  backdrop?: boolean;
100
142
  className?: string;