@douxcode/vue-spring-bottom-sheet 1.1.0 → 1.1.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/README.md +2 -0
- package/dist/index.mjs +44 -15
- package/dist/style.css +1 -1
- package/package.json +10 -3
package/README.md
CHANGED
package/dist/index.mjs
CHANGED
|
@@ -16,8 +16,8 @@ function De(n, u, a) {
|
|
|
16
16
|
function xe(n, { triggerAt: u = "end", minQuietPeriodMs: a, maxBurstDurationMs: t, minGapMs: o, reducer: c = Me }) {
|
|
17
17
|
let s, r, f, y, T = () => {
|
|
18
18
|
let v = f;
|
|
19
|
-
v !== void 0 && (f = void 0, n(v), o !== void 0 && (r = setTimeout(
|
|
20
|
-
},
|
|
19
|
+
v !== void 0 && (f = void 0, n(v), o !== void 0 && (r = setTimeout(P, o)));
|
|
20
|
+
}, P = () => {
|
|
21
21
|
clearTimeout(r), r = void 0, s === void 0 && T();
|
|
22
22
|
}, w = () => {
|
|
23
23
|
clearTimeout(s), s = void 0, y = void 0, r === void 0 && T();
|
|
@@ -37,7 +37,7 @@ function xe(n, { triggerAt: u = "end", minQuietPeriodMs: a, maxBurstDurationMs:
|
|
|
37
37
|
}, cancel: () => {
|
|
38
38
|
clearTimeout(s), s = void 0, y = void 0, clearTimeout(r), r = void 0, f = void 0;
|
|
39
39
|
}, flush: () => {
|
|
40
|
-
w(),
|
|
40
|
+
w(), P();
|
|
41
41
|
}, get isIdle() {
|
|
42
42
|
return s === void 0 && r === void 0;
|
|
43
43
|
} };
|
|
@@ -61,7 +61,7 @@ function Be(n, u) {
|
|
|
61
61
|
closestSnapPointIndex: c
|
|
62
62
|
};
|
|
63
63
|
}
|
|
64
|
-
const He = { "data-vsbs-container": "" },
|
|
64
|
+
const He = { "data-vsbs-container": "" }, Pe = ["data-vsbs-shadow", "data-vsbs-sheet-show"], Oe = /* @__PURE__ */ ie({
|
|
65
65
|
__name: "BottomSheet",
|
|
66
66
|
props: {
|
|
67
67
|
snapPoints: {},
|
|
@@ -73,7 +73,18 @@ const He = { "data-vsbs-container": "" }, Oe = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
73
73
|
},
|
|
74
74
|
emits: ["opened", "closed", "ready", "dragging-up", "dragging-down", "minHeight", "maxHeight"],
|
|
75
75
|
setup(n, { expose: u, emit: a }) {
|
|
76
|
-
const t = n, o = a, c = h(null), s = h(null), r = h(null), f = h(null), y = h(null), T = h(null),
|
|
76
|
+
const t = n, o = a, c = h(null), s = h(null), r = h(null), f = h(null), y = h(null), T = h(null), P = h(null), w = h(!1), v = h(t.expandOnContentDrag), { height: g } = be(), { height: p } = I(c), { height: W } = I(s), { height: q } = I(r), { height: J } = I(T), { activate: Z, deactivate: Y } = Te([c, P], { immediate: !1 }), S = H(
|
|
77
|
+
() => Math.ceil(J.value + W.value + q.value)
|
|
78
|
+
), { motionProperties: C } = we(c), { push: D, stop: ee, motionValues: x } = Se(), { set: M, stop: X } = ke(
|
|
79
|
+
C,
|
|
80
|
+
{},
|
|
81
|
+
{ push: D, motionValues: x, stop: ee }
|
|
82
|
+
), e = h(0), l = h(0), { snapPoints: te } = se(t), ae = H(() => te.value ?? [S.value]), {
|
|
83
|
+
minSnap: _,
|
|
84
|
+
maxSnap: B,
|
|
85
|
+
snapPoints: k,
|
|
86
|
+
closestSnapPointIndex: A
|
|
87
|
+
} = Be(ae, e), G = ye(document.body), Q = (i) => {
|
|
77
88
|
i.key === "Escape" && E();
|
|
78
89
|
}, ne = () => {
|
|
79
90
|
c.value && (e.value = Math.min(t.defaultBreakpoint ?? _.value, g.value), M({
|
|
@@ -99,14 +110,32 @@ const He = { "data-vsbs-container": "" }, Oe = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
99
110
|
bounce: 0,
|
|
100
111
|
duration: 300
|
|
101
112
|
});
|
|
102
|
-
}, j = ({
|
|
113
|
+
}, j = ({
|
|
114
|
+
delta: [i, d],
|
|
115
|
+
direction: [O, m]
|
|
116
|
+
}) => {
|
|
103
117
|
c.value && (l.value <= 0 && (e.value -= d), e.value <= _.value && (e.value = _.value, l.value += d, M({
|
|
104
118
|
y: t.canSwipeClose ? $(l.value, { min: 0 }) : $(V(l.value, -p.value, 0, 0.5), { min: 0 })
|
|
105
119
|
})), M({
|
|
106
|
-
height: $(V(e.value, 0, B.value, 0.25), {
|
|
120
|
+
height: $(V(e.value, 0, B.value, 0.25), {
|
|
121
|
+
min: 0,
|
|
122
|
+
max: g.value
|
|
123
|
+
})
|
|
107
124
|
}), m > 0 ? o("dragging-down") : m < 0 && o("dragging-up"));
|
|
108
125
|
}, L = () => {
|
|
109
|
-
c.value && (l.value = t.canSwipeClose ? [0, e.value].reduce(
|
|
126
|
+
c.value && (l.value = t.canSwipeClose ? [0, e.value].reduce(
|
|
127
|
+
(i, d) => Math.abs(d - l.value) < Math.abs(i - l.value) ? d : i
|
|
128
|
+
) : 0, D("y", l.value, C, {
|
|
129
|
+
type: "tween",
|
|
130
|
+
easings: "easeInOut",
|
|
131
|
+
bounce: 0,
|
|
132
|
+
duration: 300
|
|
133
|
+
}), l.value === e.value && (l.value = 0, E()), e.value = Math.min(k.value[A.value], g.value), D("height", e.value, C, {
|
|
134
|
+
type: "tween",
|
|
135
|
+
easings: "easeInOut",
|
|
136
|
+
bounce: 0,
|
|
137
|
+
duration: 300
|
|
138
|
+
}));
|
|
110
139
|
};
|
|
111
140
|
R(
|
|
112
141
|
{
|
|
@@ -136,10 +165,10 @@ const He = { "data-vsbs-container": "" }, Oe = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
136
165
|
{
|
|
137
166
|
onDragStart: ({ direction: [i, d] }) => {
|
|
138
167
|
e.value = p.value, l.value = x.value.y.get(), X();
|
|
139
|
-
const
|
|
140
|
-
k.value.length === 1 ? l.value === 0 &&
|
|
168
|
+
const O = f.value.scrollTop === 0, m = d > 0;
|
|
169
|
+
k.value.length === 1 ? l.value === 0 && O && (v.value = m) : (t.expandOnContentDrag && e.value !== B.value && (v.value = !0), e.value === B.value && O && (v.value = m));
|
|
141
170
|
},
|
|
142
|
-
onDrag: ({ delta: [i, d], direction: [
|
|
171
|
+
onDrag: ({ delta: [i, d], direction: [O, m] }) => {
|
|
143
172
|
if (!t.expandOnContentDrag) {
|
|
144
173
|
v.value = !1;
|
|
145
174
|
return;
|
|
@@ -187,9 +216,9 @@ const He = { "data-vsbs-container": "" }, Oe = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
187
216
|
default: he(() => [
|
|
188
217
|
pe(b("div", {
|
|
189
218
|
ref_key: "backdrop",
|
|
190
|
-
ref:
|
|
219
|
+
ref: P,
|
|
191
220
|
"data-vsbs-backdrop": "",
|
|
192
|
-
onClick: d[0] || (d[0] = (
|
|
221
|
+
onClick: d[0] || (d[0] = (O) => oe())
|
|
193
222
|
}, null, 512), [
|
|
194
223
|
[me, w.value && i.blocking]
|
|
195
224
|
])
|
|
@@ -239,7 +268,7 @@ const He = { "data-vsbs-container": "" }, Oe = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
239
268
|
}, [
|
|
240
269
|
N(i.$slots, "footer", {}, void 0, !0)
|
|
241
270
|
], 512)
|
|
242
|
-
], 8,
|
|
271
|
+
], 8, Pe)
|
|
243
272
|
])
|
|
244
273
|
]));
|
|
245
274
|
}
|
|
@@ -248,7 +277,7 @@ const He = { "data-vsbs-container": "" }, Oe = ["data-vsbs-shadow", "data-vsbs-s
|
|
|
248
277
|
for (const [t, o] of u)
|
|
249
278
|
a[t] = o;
|
|
250
279
|
return a;
|
|
251
|
-
}, Fe = /* @__PURE__ */ Ee(
|
|
280
|
+
}, Fe = /* @__PURE__ */ Ee(Oe, [["__scopeId", "data-v-84fc7f9f"]]);
|
|
252
281
|
export {
|
|
253
282
|
Fe as default
|
|
254
283
|
};
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
[data-vsbs-backdrop][data-v-
|
|
1
|
+
[data-vsbs-backdrop][data-v-84fc7f9f]{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:100}[data-vsbs-shadow=true][data-v-84fc7f9f]{box-shadow:0 -5px 60px 0 var(--vsbs-shadow-color, rgba(89, 89, 89, .2))}[data-vsbs-sheet][data-v-84fc7f9f]{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:visibility .3s ease-in-out;visibility:hidden;width:100%;will-change:height;z-index:100}[data-vsbs-sheet-show=true][data-v-84fc7f9f]{visibility:visible}[data-vsbs-header][data-v-84fc7f9f]{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:1}[data-vsbs-header][data-v-84fc7f9f]: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-84fc7f9f]:empty{box-shadow:none;padding:12px var(--vsbs-padding-x, 16px) 8px}[data-vsbs-footer][data-v-84fc7f9f]{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-84fc7f9f]:empty{display:none}[data-vsbs-scroll][data-v-84fc7f9f]{flex-grow:1;overflow-y:auto;overscroll-behavior:contain}[data-vsbs-content-wrapper][data-v-84fc7f9f]{height:100%}[data-vsbs-content][data-v-84fc7f9f]{display:grid;padding:1vh var(--vsbs-padding-x, 16px);-webkit-user-select:none;user-select:none}.fade-enter-active[data-v-84fc7f9f],.fade-leave-active[data-v-84fc7f9f]{transition:opacity .3s ease}.fade-enter-from[data-v-84fc7f9f],.fade-leave-to[data-v-84fc7f9f]{opacity:0}
|
package/package.json
CHANGED
|
@@ -27,12 +27,12 @@
|
|
|
27
27
|
"type": "git",
|
|
28
28
|
"url": "https://github.com/megaarmos/vue-spring-bottom-sheet.git"
|
|
29
29
|
},
|
|
30
|
-
"homepage": "https://
|
|
30
|
+
"homepage": "https://megaarmos.douxcode.com/vue-spring-bottom-sheet/",
|
|
31
31
|
"bugs": {
|
|
32
32
|
"url": "https://github.com/megaarmos/vue-spring-bottom-sheet/issues"
|
|
33
33
|
},
|
|
34
34
|
"private": false,
|
|
35
|
-
"version": "1.1.
|
|
35
|
+
"version": "1.1.1",
|
|
36
36
|
"type": "module",
|
|
37
37
|
"exports": {
|
|
38
38
|
".": {
|
|
@@ -49,7 +49,9 @@
|
|
|
49
49
|
"scripts": {
|
|
50
50
|
"build": "vue-tsc -b && vite build",
|
|
51
51
|
"build:watch": "vite build --watch",
|
|
52
|
-
"
|
|
52
|
+
"type-check": "vue-tsc --build",
|
|
53
|
+
"lint": "eslint . --fix",
|
|
54
|
+
"format": "prettier --write src/",
|
|
53
55
|
"publish": "npm run build && npm publish --access public"
|
|
54
56
|
},
|
|
55
57
|
"peerDependencies": {
|
|
@@ -67,6 +69,11 @@
|
|
|
67
69
|
"vue": "^3.5.13"
|
|
68
70
|
},
|
|
69
71
|
"devDependencies": {
|
|
72
|
+
"ajv": "^8.17.1",
|
|
73
|
+
"@vue/eslint-config-prettier": "^10.1.0",
|
|
74
|
+
"@vue/eslint-config-typescript": "^14.2.0",
|
|
75
|
+
"eslint": "^9.17.0",
|
|
76
|
+
"eslint-plugin-vue": "^9.32.0",
|
|
70
77
|
"@types/node": "^22.10.2",
|
|
71
78
|
"@vitejs/plugin-vue": "^5.2.1",
|
|
72
79
|
"@vue/tsconfig": "^0.7.0",
|