@douxcode/vue-spring-bottom-sheet 1.2.1 → 1.2.2
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/README.md +8 -8
- package/dist/BottomSheet.d.ts +12 -3
- package/dist/index.mjs +67 -69
- package/dist/style.css +1 -1
- package/package.json +14 -14
package/README.md
CHANGED
|
@@ -95,14 +95,14 @@ For Nuxt 3, just wrap component in `<ClientOnly>`
|
|
|
95
95
|
|
|
96
96
|
### Prop Definitions
|
|
97
97
|
|
|
98
|
-
| Prop | Type | Description
|
|
99
|
-
| ------------------- | -------- |
|
|
100
|
-
| snapPoints | Number[] | Defines custom snapping positions for the bottom sheet
|
|
101
|
-
| defaultSnapPoint | Number | Specifies the default snap point
|
|
102
|
-
| blocking | Boolean | Controls whether the bottom sheet blocks interactions with underlying content
|
|
103
|
-
| canSwipeClose | Boolean | Enables or disables swipe gestures for closing the sheet
|
|
104
|
-
| canOverlayClose | Boolean | Allows tapping the overlay to close the sheet
|
|
105
|
-
| expandOnContentDrag | Boolean | Enables expanding the sheet by dragging its content
|
|
98
|
+
| Prop | Type | Description | Example |
|
|
99
|
+
| ------------------- | -------- | --------------------------------------------------------------------------------------------------- | -------------------------------- |
|
|
100
|
+
| snapPoints | Number[] | Defines custom snapping positions for the bottom sheet | `:snapPoints="[300, 600, 900]"` |
|
|
101
|
+
| defaultSnapPoint | Number | Specifies the default snap point. Note that at least one snapPoint must be specified for it to work | `:default-snap-point="600"` |
|
|
102
|
+
| blocking | Boolean | Controls whether the bottom sheet blocks interactions with underlying content | `:blocking="true"` |
|
|
103
|
+
| canSwipeClose | Boolean | Enables or disables swipe gestures for closing the sheet | `:can-swipe-close="true"` |
|
|
104
|
+
| canOverlayClose | Boolean | Allows tapping the overlay to close the sheet | `:can-overlay-close="true"` |
|
|
105
|
+
| expandOnContentDrag | Boolean | Enables expanding the sheet by dragging its content | `:expand-on-content-drag="true"` |
|
|
106
106
|
|
|
107
107
|
### Default Values
|
|
108
108
|
|
package/dist/BottomSheet.d.ts
CHANGED
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
interface IProps {
|
|
2
2
|
duration?: number;
|
|
3
3
|
snapPoints?: number[];
|
|
4
|
-
|
|
4
|
+
defaultSnapPoint?: number;
|
|
5
5
|
blocking?: boolean;
|
|
6
6
|
canSwipeClose?: boolean;
|
|
7
7
|
canBackdropClose?: boolean;
|
|
8
8
|
expandOnContentDrag?: boolean;
|
|
9
9
|
}
|
|
10
10
|
declare function __VLS_template(): {
|
|
11
|
+
attrs: Partial<{}>;
|
|
11
12
|
slots: {
|
|
12
13
|
header?(_: {}): any;
|
|
13
14
|
default?(_: {}): any;
|
|
@@ -22,7 +23,7 @@ declare function __VLS_template(): {
|
|
|
22
23
|
sheetContent: HTMLDivElement;
|
|
23
24
|
sheetFooter: HTMLDivElement;
|
|
24
25
|
};
|
|
25
|
-
|
|
26
|
+
rootEl: any;
|
|
26
27
|
};
|
|
27
28
|
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
28
29
|
declare const __VLS_component: import('vue').DefineComponent<IProps, {
|
|
@@ -51,7 +52,15 @@ declare const __VLS_component: import('vue').DefineComponent<IProps, {
|
|
|
51
52
|
canSwipeClose: boolean;
|
|
52
53
|
canBackdropClose: boolean;
|
|
53
54
|
expandOnContentDrag: boolean;
|
|
54
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
55
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
56
|
+
backdrop: HTMLDivElement;
|
|
57
|
+
sheet: HTMLDivElement;
|
|
58
|
+
sheetHeader: HTMLDivElement;
|
|
59
|
+
sheetScroll: HTMLDivElement;
|
|
60
|
+
sheetContentWrapper: HTMLDivElement;
|
|
61
|
+
sheetContent: HTMLDivElement;
|
|
62
|
+
sheetFooter: HTMLDivElement;
|
|
63
|
+
}, any>;
|
|
55
64
|
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
56
65
|
export default _default;
|
|
57
66
|
type __VLS_WithTemplateSlots<T, S> = T & {
|
package/dist/index.mjs
CHANGED
|
@@ -1,54 +1,54 @@
|
|
|
1
|
-
import { computed as y, defineComponent as ve, useCssVars as de, ref as p, toRefs as ce, watch as J, nextTick as A, onMounted as fe, openBlock as ge, createBlock as pe, Teleport as he, createElementVNode as b, createVNode as me, Transition as be, withCtx as ye, withDirectives as
|
|
1
|
+
import { computed as y, defineComponent as ve, useCssVars as de, ref as p, toRefs as ce, watch as J, nextTick as A, onMounted as fe, openBlock as ge, createBlock as pe, Teleport as he, createElementVNode as b, createVNode as me, Transition as be, withCtx as ye, withDirectives as Se, vShow as we, renderSlot as R } from "vue";
|
|
2
2
|
import { useWindowSize as ke, useElementBounding as I, useScrollLock as Z } from "@vueuse/core";
|
|
3
3
|
import { useGesture as z, rubberbandIfOutOfBounds as N } from "@vueuse/gesture";
|
|
4
4
|
import { useMotionProperties as Te, useMotionTransitions as Ce, useMotionControls as De } from "@vueuse/motion";
|
|
5
5
|
import { useFocusTrap as xe } from "@vueuse/integrations/useFocusTrap";
|
|
6
|
-
function Me(
|
|
7
|
-
let e = (
|
|
6
|
+
function Me(n, u, a) {
|
|
7
|
+
let e = (o) => n(o, ...u);
|
|
8
8
|
return a === void 0 ? e : Object.assign(e, { lazy: a, lazyArgs: u });
|
|
9
9
|
}
|
|
10
|
-
function
|
|
11
|
-
let e =
|
|
12
|
-
if (e === 0) return
|
|
13
|
-
if (e === 1) return Me(
|
|
10
|
+
function Pe(n, u, a) {
|
|
11
|
+
let e = n.length - u.length;
|
|
12
|
+
if (e === 0) return n(...u);
|
|
13
|
+
if (e === 1) return Me(n, u, a);
|
|
14
14
|
throw new Error("Wrong number of arguments");
|
|
15
15
|
}
|
|
16
|
-
function
|
|
17
|
-
let s, r, f,
|
|
16
|
+
function _e(n, { triggerAt: u = "end", minQuietPeriodMs: a, maxBurstDurationMs: e, minGapMs: o, reducer: v = He }) {
|
|
17
|
+
let s, r, f, S, C = () => {
|
|
18
18
|
let d = f;
|
|
19
|
-
d !== void 0 && (f = void 0,
|
|
19
|
+
d !== void 0 && (f = void 0, n(d), o !== void 0 && (r = setTimeout(O, o)));
|
|
20
20
|
}, O = () => {
|
|
21
21
|
clearTimeout(r), r = void 0, s === void 0 && C();
|
|
22
|
-
},
|
|
23
|
-
clearTimeout(s), s = void 0,
|
|
22
|
+
}, w = () => {
|
|
23
|
+
clearTimeout(s), s = void 0, S = void 0, r === void 0 && C();
|
|
24
24
|
};
|
|
25
25
|
return { call: (...d) => {
|
|
26
26
|
let g = s === void 0 && r === void 0;
|
|
27
27
|
if ((u !== "start" || g) && (f = v(f, ...d)), !(s === void 0 && !g)) {
|
|
28
|
-
if (a !== void 0 || e !== void 0 ||
|
|
28
|
+
if (a !== void 0 || e !== void 0 || o === void 0) {
|
|
29
29
|
clearTimeout(s);
|
|
30
30
|
let h = Date.now();
|
|
31
|
-
|
|
32
|
-
let W = e === void 0 ? a ?? 0 : Math.min(a ?? e, e - (h -
|
|
33
|
-
s = setTimeout(
|
|
31
|
+
S ?? (S = h);
|
|
32
|
+
let W = e === void 0 ? a ?? 0 : Math.min(a ?? e, e - (h - S));
|
|
33
|
+
s = setTimeout(w, W);
|
|
34
34
|
}
|
|
35
35
|
u !== "end" && g && C();
|
|
36
36
|
}
|
|
37
37
|
}, cancel: () => {
|
|
38
|
-
clearTimeout(s), s = void 0,
|
|
38
|
+
clearTimeout(s), s = void 0, S = void 0, clearTimeout(r), r = void 0, f = void 0;
|
|
39
39
|
}, flush: () => {
|
|
40
|
-
|
|
40
|
+
w(), O();
|
|
41
41
|
}, get isIdle() {
|
|
42
42
|
return s === void 0 && r === void 0;
|
|
43
43
|
} };
|
|
44
44
|
}
|
|
45
45
|
var He = () => "";
|
|
46
|
-
function $(...
|
|
47
|
-
return
|
|
46
|
+
function $(...n) {
|
|
47
|
+
return Pe(Oe, n);
|
|
48
48
|
}
|
|
49
|
-
var Oe = (
|
|
50
|
-
function
|
|
51
|
-
const a = y(() =>
|
|
49
|
+
var Oe = (n, { min: u, max: a }) => u !== void 0 && n < u ? u : a !== void 0 && n > a ? a : n;
|
|
50
|
+
function Be(n, u) {
|
|
51
|
+
const a = y(() => n.value.sort()), e = y(() => a.value[0]), o = y(() => a.value[a.value.length - 1]), v = y(() => {
|
|
52
52
|
const s = a.value.reduce(
|
|
53
53
|
(r, f) => Math.abs(f - u.value) < Math.abs(r - u.value) ? f : r
|
|
54
54
|
);
|
|
@@ -56,8 +56,8 @@ function Pe(o, u) {
|
|
|
56
56
|
});
|
|
57
57
|
return {
|
|
58
58
|
minSnap: e,
|
|
59
|
-
maxSnap:
|
|
60
|
-
snapPoints:
|
|
59
|
+
maxSnap: o,
|
|
60
|
+
snapPoints: n,
|
|
61
61
|
closestSnapPointIndex: v
|
|
62
62
|
};
|
|
63
63
|
}
|
|
@@ -66,38 +66,36 @@ const Ee = { "data-vsbs-container": "" }, Ie = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
66
66
|
props: {
|
|
67
67
|
duration: { default: 250 },
|
|
68
68
|
snapPoints: {},
|
|
69
|
-
|
|
69
|
+
defaultSnapPoint: {},
|
|
70
70
|
blocking: { type: Boolean, default: !0 },
|
|
71
71
|
canSwipeClose: { type: Boolean, default: !0 },
|
|
72
72
|
canBackdropClose: { type: Boolean, default: !0 },
|
|
73
73
|
expandOnContentDrag: { type: Boolean, default: !0 }
|
|
74
74
|
},
|
|
75
75
|
emits: ["opened", "closed", "ready", "dragging-up", "dragging-down", "minHeight", "maxHeight"],
|
|
76
|
-
setup(
|
|
76
|
+
setup(n, { expose: u, emit: a }) {
|
|
77
77
|
de((i) => ({
|
|
78
|
-
"
|
|
79
|
-
"
|
|
78
|
+
"793b3c04": te.value,
|
|
79
|
+
"96eb7ec2": ae.value
|
|
80
80
|
}));
|
|
81
|
-
const e =
|
|
82
|
-
let G = xe([v, O], {
|
|
81
|
+
const e = n, o = a, v = p(null), s = p(null), r = p(null), f = p(null), S = p(null), C = p(null), O = p(null), w = p(!1), d = p(e.expandOnContentDrag), { height: g } = ke(), { height: h } = I(v), { height: W } = I(s), { height: Y } = I(r), { height: ee } = I(C), G = xe([v, O], {
|
|
83
82
|
immediate: !1,
|
|
84
83
|
fallbackFocus: () => v.value || document.body
|
|
85
|
-
})
|
|
86
|
-
const k = y(
|
|
84
|
+
}), k = y(
|
|
87
85
|
() => Math.ceil(ee.value + W.value + Y.value)
|
|
88
|
-
), te = y(() => `visibility ${e.duration}ms ease-in-out`), ae = y(() => `opacity ${e.duration}ms ease-in-out`), { motionProperties: D } = Te(v), { push: x, stop:
|
|
86
|
+
), te = y(() => `visibility ${e.duration}ms ease-in-out`), ae = y(() => `opacity ${e.duration}ms ease-in-out`), { motionProperties: D } = Te(v), { push: x, stop: ne, motionValues: M } = Ce(), { set: P, stop: F } = De(
|
|
89
87
|
D,
|
|
90
88
|
{},
|
|
91
|
-
{ push: x, motionValues: M, stop:
|
|
92
|
-
), t = p(0), l = p(0), { snapPoints:
|
|
93
|
-
minSnap:
|
|
89
|
+
{ push: x, motionValues: M, stop: ne }
|
|
90
|
+
), t = p(0), l = p(0), { snapPoints: oe } = ce(e), le = y(() => oe.value ?? [k.value]), {
|
|
91
|
+
minSnap: _,
|
|
94
92
|
maxSnap: H,
|
|
95
93
|
snapPoints: T,
|
|
96
94
|
closestSnapPointIndex: L
|
|
97
|
-
} =
|
|
95
|
+
} = Be(le, t), Q = Z(document.body), j = Z(document.documentElement), K = (i) => {
|
|
98
96
|
i.key === "Escape" && E();
|
|
99
97
|
}, ue = () => {
|
|
100
|
-
v.value && (t.value = Math.min(e.
|
|
98
|
+
v.value && (t.value = Math.min(e.defaultSnapPoint ?? _.value, g.value), P({
|
|
101
99
|
height: t.value,
|
|
102
100
|
y: t.value
|
|
103
101
|
}), x("y", 0, D, {
|
|
@@ -105,16 +103,16 @@ const Ee = { "data-vsbs-container": "" }, Ie = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
105
103
|
easings: "easeInOut",
|
|
106
104
|
bounce: 0,
|
|
107
105
|
duration: e.duration
|
|
108
|
-
}),
|
|
109
|
-
M.value.y.get() - 0 < 0.1 && (
|
|
106
|
+
}), w.value = !0, Q.value = !0, j.value = !0, window.addEventListener("keydown", K), e.blocking && setTimeout(() => {
|
|
107
|
+
M.value.y.get() - 0 < 0.1 && (o("opened"), G.activate());
|
|
110
108
|
}, e.duration));
|
|
111
109
|
}, E = () => {
|
|
112
110
|
v.value && (x("y", h.value, D, {
|
|
113
111
|
type: "tween",
|
|
114
112
|
bounce: 0,
|
|
115
113
|
duration: e.duration
|
|
116
|
-
}),
|
|
117
|
-
M.value.y.get() - h.value < 0.1 &&
|
|
114
|
+
}), w.value = !1, Q.value = !1, j.value = !1, e.blocking && G.deactivate(), window.removeEventListener("keydown", K), setTimeout(() => {
|
|
115
|
+
M.value.y.get() - h.value < 0.1 && o("closed");
|
|
118
116
|
}, e.duration));
|
|
119
117
|
}, ie = () => {
|
|
120
118
|
e.canBackdropClose && E();
|
|
@@ -131,16 +129,16 @@ const Ee = { "data-vsbs-container": "" }, Ie = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
131
129
|
});
|
|
132
130
|
}, U = ({
|
|
133
131
|
delta: [i, c],
|
|
134
|
-
direction: [
|
|
132
|
+
direction: [B, m]
|
|
135
133
|
}) => {
|
|
136
|
-
v.value && (l.value <= 0 && (t.value -= c), t.value <=
|
|
134
|
+
v.value && (l.value <= 0 && (t.value -= c), t.value <= _.value && (t.value = _.value, l.value += c, P({
|
|
137
135
|
y: e.canSwipeClose ? $(l.value, { min: 0 }) : $(N(l.value, -h.value, 0, 0.5), { min: 0 })
|
|
138
|
-
})),
|
|
136
|
+
})), P({
|
|
139
137
|
height: $(N(t.value, 0, H.value, 0.25), {
|
|
140
138
|
min: 0,
|
|
141
139
|
max: g.value
|
|
142
140
|
})
|
|
143
|
-
}), m > 0 ?
|
|
141
|
+
}), m > 0 ? o("dragging-down") : m < 0 && o("dragging-up"));
|
|
144
142
|
}, X = () => {
|
|
145
143
|
v.value && (l.value = e.canSwipeClose ? [0, t.value].reduce(
|
|
146
144
|
(i, c) => Math.abs(c - l.value) < Math.abs(i - l.value) ? c : i
|
|
@@ -184,33 +182,33 @@ const Ee = { "data-vsbs-container": "" }, Ie = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
184
182
|
{
|
|
185
183
|
onDragStart: ({ direction: [i, c] }) => {
|
|
186
184
|
t.value = h.value, l.value = M.value.y.get(), F();
|
|
187
|
-
const
|
|
188
|
-
T.value.length === 1 ? l.value === 0 &&
|
|
185
|
+
const B = f.value.scrollTop === 0, m = c > 0;
|
|
186
|
+
T.value.length === 1 ? l.value === 0 && B && (d.value = m) : (e.expandOnContentDrag && t.value !== H.value && (d.value = !0), t.value === H.value && B && (d.value = m));
|
|
189
187
|
},
|
|
190
|
-
onDrag: ({ delta: [i, c], direction: [
|
|
188
|
+
onDrag: ({ delta: [i, c], direction: [B, m] }) => {
|
|
191
189
|
if (!e.expandOnContentDrag) {
|
|
192
190
|
d.value = !1;
|
|
193
191
|
return;
|
|
194
192
|
}
|
|
195
193
|
if (!v.value) return;
|
|
196
|
-
l.value === 0 && d.value && e.expandOnContentDrag && (t.value -= c), t.value <=
|
|
194
|
+
l.value === 0 && d.value && e.expandOnContentDrag && (t.value -= c), t.value <= _.value && (t.value = _.value, d.value && e.expandOnContentDrag && (l.value += c), l.value = $(l.value, { min: 0, max: _.value }), P({
|
|
197
195
|
y: e.canSwipeClose ? l.value : N(l.value, -h.value, 0, 0.5)
|
|
198
196
|
})), t.value > H.value && (t.value = H.value), t.value = Math.min(t.value, g.value);
|
|
199
197
|
const q = f.value.scrollTop === 0;
|
|
200
|
-
T.value.length === 1 ? c < 0 && l.value === 0 && q && (d.value = !1) : t.value === H.value && (d.value = !1),
|
|
198
|
+
T.value.length === 1 ? c < 0 && l.value === 0 && q && (d.value = !1) : t.value === H.value && (d.value = !1), P({
|
|
201
199
|
height: t.value
|
|
202
|
-
}), m > 0 ?
|
|
200
|
+
}), m > 0 ? o("dragging-down") : m < 0 && o("dragging-up");
|
|
203
201
|
},
|
|
204
202
|
onDragEnd: X
|
|
205
203
|
},
|
|
206
204
|
{
|
|
207
|
-
domTarget:
|
|
205
|
+
domTarget: S,
|
|
208
206
|
drag: { filterTaps: !0 }
|
|
209
207
|
}
|
|
210
208
|
);
|
|
211
|
-
const re =
|
|
209
|
+
const re = _e(
|
|
212
210
|
() => {
|
|
213
|
-
|
|
211
|
+
o("maxHeight", g.value), A(() => {
|
|
214
212
|
t.value = T.value[L.value], V(T.value[L.value]);
|
|
215
213
|
});
|
|
216
214
|
},
|
|
@@ -219,27 +217,27 @@ const Ee = { "data-vsbs-container": "" }, Ie = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
219
217
|
return J(g, () => {
|
|
220
218
|
re.call();
|
|
221
219
|
}), J(k, () => {
|
|
222
|
-
|
|
220
|
+
o("minHeight", k.value), T.value.length === 1 && A(() => {
|
|
223
221
|
T.value[0] === k.value && V(Math.min(k.value, g.value));
|
|
224
222
|
});
|
|
225
223
|
}), fe(() => {
|
|
226
|
-
|
|
224
|
+
o("minHeight", k.value), o("maxHeight", g.value), t.value = e.defaultSnapPoint ?? Number(k.value), P({
|
|
227
225
|
height: t.value,
|
|
228
226
|
y: t.value
|
|
229
227
|
}), A(() => {
|
|
230
|
-
|
|
228
|
+
o("ready");
|
|
231
229
|
});
|
|
232
230
|
}), u({ open: ue, close: E, snapToPoint: V }), (i, c) => (ge(), pe(he, { to: "body" }, [
|
|
233
231
|
b("div", Ee, [
|
|
234
232
|
me(be, { name: "fade" }, {
|
|
235
233
|
default: ye(() => [
|
|
236
|
-
|
|
234
|
+
Se(b("div", {
|
|
237
235
|
ref_key: "backdrop",
|
|
238
236
|
ref: O,
|
|
239
237
|
"data-vsbs-backdrop": "",
|
|
240
|
-
onClick: c[0] || (c[0] = (
|
|
238
|
+
onClick: c[0] || (c[0] = (B) => ie())
|
|
241
239
|
}, null, 512), [
|
|
242
|
-
[
|
|
240
|
+
[we, w.value && i.blocking]
|
|
243
241
|
])
|
|
244
242
|
]),
|
|
245
243
|
_: 1
|
|
@@ -248,7 +246,7 @@ const Ee = { "data-vsbs-container": "" }, Ie = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
248
246
|
ref_key: "sheet",
|
|
249
247
|
ref: v,
|
|
250
248
|
"data-vsbs-shadow": !i.blocking,
|
|
251
|
-
"data-vsbs-sheet-show":
|
|
249
|
+
"data-vsbs-sheet-show": w.value,
|
|
252
250
|
"aria-modal": "true",
|
|
253
251
|
"data-vsbs-sheet": "",
|
|
254
252
|
tabindex: "-1"
|
|
@@ -268,7 +266,7 @@ const Ee = { "data-vsbs-container": "" }, Ie = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
268
266
|
}, [
|
|
269
267
|
b("div", {
|
|
270
268
|
ref_key: "sheetContentWrapper",
|
|
271
|
-
ref:
|
|
269
|
+
ref: S,
|
|
272
270
|
"data-vsbs-content-wrapper": ""
|
|
273
271
|
}, [
|
|
274
272
|
b("div", {
|
|
@@ -291,12 +289,12 @@ const Ee = { "data-vsbs-container": "" }, Ie = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
291
289
|
])
|
|
292
290
|
]));
|
|
293
291
|
}
|
|
294
|
-
}), We = (
|
|
295
|
-
const a =
|
|
296
|
-
for (const [e,
|
|
297
|
-
a[e] =
|
|
292
|
+
}), We = (n, u) => {
|
|
293
|
+
const a = n.__vccOpts || n;
|
|
294
|
+
for (const [e, o] of u)
|
|
295
|
+
a[e] = o;
|
|
298
296
|
return a;
|
|
299
|
-
}, Re = /* @__PURE__ */ We($e, [["__scopeId", "data-v-
|
|
297
|
+
}, Re = /* @__PURE__ */ We($e, [["__scopeId", "data-v-69256342"]]);
|
|
300
298
|
export {
|
|
301
299
|
Re as default
|
|
302
300
|
};
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
[data-vsbs-container][data-v-
|
|
1
|
+
[data-vsbs-container][data-v-69256342]{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:9999;visibility:visible}[data-vsbs-backdrop][data-v-69256342]{background-color:var(--vsbs-backdrop-bg, rgba(0, 0, 0, .5));top:0;right:0;bottom:0;left:0;pointer-events:auto;position:fixed;-webkit-user-select:none;user-select:none;will-change:opacity;z-index:1}[data-vsbs-shadow=true][data-v-69256342]{box-shadow:0 -5px 60px 0 var(--vsbs-shadow-color, rgba(89, 89, 89, .2))}[data-vsbs-sheet][data-v-69256342]{background-color:var(--vsbs-background, #fff);border-top-left-radius:var(--vsbs-border-radius, 16px);border-top-right-radius:var(--vsbs-border-radius, 16px);bottom:0;display:flex;flex-direction:column;left:0;margin-left:auto;margin-right:auto;max-height:inherit;max-width:var(--vsbs-max-width, 640px);pointer-events:all;position:fixed;right:0;transition:var(--793b3c04);visibility:hidden;width:100%;will-change:height;z-index:2}[data-vsbs-sheet-show=true][data-v-69256342]{visibility:visible}[data-vsbs-header][data-v-69256342]{box-shadow:0 1px 0 var(--vsbs-border-color, rgba(46, 59, 66, .125));flex-shrink:0;padding:20px var(--vsbs-padding-x, 16px) 8px;-webkit-user-select:none;user-select:none;z-index:3}[data-vsbs-header][data-v-69256342]:before{background-color:var(--vsbs-handle-background, rgba(0, 0, 0, .28));border-radius:2px;content:"";display:block;height:4px;left:50%;position:absolute;top:8px;transform:translate(-50%);width:36px}[data-vsbs-header][data-v-69256342]:empty{box-shadow:none;padding:12px var(--vsbs-padding-x, 16px) 8px}[data-vsbs-footer][data-v-69256342]{box-shadow:0 -1px 0 var(--vsbs-border-color, rgba(46, 59, 66, .125));flex-grow:0;flex-shrink:0;padding:16px var(--vsbs-padding-x, 16px);-webkit-user-select:none;user-select:none}[data-vsbs-footer][data-v-69256342]:empty{display:none}[data-vsbs-scroll][data-v-69256342]{flex-grow:1;overflow-y:auto;overscroll-behavior:contain}[data-vsbs-content-wrapper][data-v-69256342]{height:100%}[data-vsbs-content][data-v-69256342]{display:grid;padding:1vh var(--vsbs-padding-x, 16px);-webkit-user-select:none;user-select:none}.fade-enter-active[data-v-69256342],.fade-leave-active[data-v-69256342]{transition:var(--96eb7ec2)}.fade-enter-from[data-v-69256342],.fade-leave-to[data-v-69256342]{opacity:0}
|
package/package.json
CHANGED
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"url": "https://github.com/megaarmos/vue-spring-bottom-sheet/issues"
|
|
33
33
|
},
|
|
34
34
|
"private": false,
|
|
35
|
-
"version": "1.2.
|
|
35
|
+
"version": "1.2.2",
|
|
36
36
|
"type": "module",
|
|
37
37
|
"exports": {
|
|
38
38
|
".": {
|
|
@@ -60,28 +60,28 @@
|
|
|
60
60
|
"vue": ">=3.3"
|
|
61
61
|
},
|
|
62
62
|
"dependencies": {
|
|
63
|
-
"@vueuse/core": "^12.
|
|
63
|
+
"@vueuse/core": "^12.5.0",
|
|
64
64
|
"@vueuse/gesture": "^2.0.0",
|
|
65
|
-
"@vueuse/integrations": "^12.
|
|
65
|
+
"@vueuse/integrations": "^12.5.0",
|
|
66
66
|
"@vueuse/motion": "^2.2.6",
|
|
67
|
-
"focus-trap": "^7",
|
|
68
|
-
"remeda": "^2.
|
|
69
|
-
"vue": "
|
|
67
|
+
"focus-trap": "^7.6.4",
|
|
68
|
+
"remeda": "^2.20.0",
|
|
69
|
+
"vue": "^3.5.13"
|
|
70
70
|
},
|
|
71
71
|
"devDependencies": {
|
|
72
|
-
"@types/node": "^22.10.
|
|
72
|
+
"@types/node": "^22.10.10",
|
|
73
73
|
"@vitejs/plugin-vue": "^5.2.1",
|
|
74
|
-
"@vue/eslint-config-prettier": "^10.
|
|
75
|
-
"@vue/eslint-config-typescript": "^14.
|
|
74
|
+
"@vue/eslint-config-prettier": "^10.2.0",
|
|
75
|
+
"@vue/eslint-config-typescript": "^14.3.0",
|
|
76
76
|
"@vue/tsconfig": "^0.7.0",
|
|
77
77
|
"ajv": "^8.17.1",
|
|
78
|
-
"eslint": "^9.
|
|
78
|
+
"eslint": "^9.19.0",
|
|
79
79
|
"eslint-plugin-vue": "^9.32.0",
|
|
80
80
|
"prettier": "^3.4.2",
|
|
81
|
-
"typescript": "~5.6.
|
|
82
|
-
"vite": "^6.0.
|
|
83
|
-
"vite-plugin-dts": "^4.
|
|
84
|
-
"vue-tsc": "^2.
|
|
81
|
+
"typescript": "~5.6.3",
|
|
82
|
+
"vite": "^6.0.11",
|
|
83
|
+
"vite-plugin-dts": "^4.5.0",
|
|
84
|
+
"vue-tsc": "^2.2.0"
|
|
85
85
|
},
|
|
86
86
|
"files": [
|
|
87
87
|
"dist",
|