Skip to content

Commit 9ee89db

Browse files
authored
Merge pull request #30 from InertiaSocial/fix/motion-v-latest
fix: compatiblity with `motion-v` 1.5.0
2 parents caf41c6 + 8445925 commit 9ee89db

File tree

9 files changed

+41
-40
lines changed

9 files changed

+41
-40
lines changed

apps/playground/pages/blocking.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script lang="ts" setup>
22
import { ref, version } from 'vue'
33
4-
import BottomSheet from '@douxcode/vue-spring-bottom-sheet'
5-
import '@douxcode/vue-spring-bottom-sheet/dist/style.css'
4+
import BottomSheet from '../../../packages/vue-spring-bottom-sheet'
5+
import '../../../packages/vue-spring-bottom-sheet/dist/style.css'
66
77
const bottomSheet = ref<InstanceType<typeof BottomSheet>>()
88
const open = ref(false)

apps/playground/pages/index.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script lang="ts" setup>
22
import { ref, version } from 'vue'
33
4-
import BottomSheet from '@douxcode/vue-spring-bottom-sheet'
5-
import '@douxcode/vue-spring-bottom-sheet/dist/style.css'
4+
import BottomSheet from '../../../packages/vue-spring-bottom-sheet'
5+
import '../../../packages/vue-spring-bottom-sheet/dist/style.css'
66
77
const bottomSheet = ref<InstanceType<typeof BottomSheet>>()
88

apps/playground/pages/snap.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script lang="ts" setup>
22
import { ref, version } from 'vue'
33
4-
import BottomSheet from '@douxcode/vue-spring-bottom-sheet'
5-
import '@douxcode/vue-spring-bottom-sheet/dist/style.css'
4+
import BottomSheet from '../../../packages/vue-spring-bottom-sheet'
5+
import '../../../packages/vue-spring-bottom-sheet/dist/style.css'
66
77
const bottomSheet = ref<InstanceType<typeof BottomSheet>>()
88
const instinctHeight = ref(0)

apps/playground/pages/sticky.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script lang="ts" setup>
22
import { ref, version } from 'vue'
33
4-
import BottomSheet from '@douxcode/vue-spring-bottom-sheet'
5-
import '@douxcode/vue-spring-bottom-sheet/dist/style.css'
4+
import BottomSheet from '../../../packages/vue-spring-bottom-sheet'
5+
import '../../../packages/vue-spring-bottom-sheet/dist/style.css'
66
77
const bottomSheet = ref<InstanceType<typeof BottomSheet>>()
88

bun.lock

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -22,20 +22,20 @@
2222
"dependencies": {
2323
"@nuxt/icon": "1.12.0",
2424
"@nuxt/ui": "3.0.2",
25-
"nuxt": "^3.16.2",
25+
"nuxt": "^3.17.3",
2626
"typescript": "^5.8.3",
27-
"vue": "^3.5.13",
28-
"vue-router": "^4.5.0",
27+
"vue": "^3.5.14",
28+
"vue-router": "^4.5.1",
2929
},
3030
},
3131
"packages/vue-spring-bottom-sheet": {
3232
"name": "@douxcode/vue-spring-bottom-sheet",
33-
"version": "2.2.2",
33+
"version": "2.4.0",
3434
"dependencies": {
3535
"@vueuse/core": "^13.2.0",
3636
"@vueuse/integrations": "^13.2.0",
3737
"focus-trap": "^7.6.4",
38-
"motion-v": "^1.0.2",
38+
"motion-v": "^1.5.0",
3939
"remeda": "^2.21.6",
4040
"vue": "^3.5.14",
4141
},
@@ -1154,7 +1154,7 @@
11541154

11551155
"fraction.js": ["fraction.js@4.3.7", "", {}, "sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew=="],
11561156

1157-
"framer-motion": ["framer-motion@12.5.0", "", { "dependencies": { "motion-dom": "^12.5.0", "motion-utils": "^12.5.0", "tslib": "^2.4.0" }, "peerDependencies": { "@emotion/is-prop-valid": "*", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0" }, "optionalPeers": ["@emotion/is-prop-valid", "react", "react-dom"] }, "sha512-buPlioFbH9/W7rDzYh1C09AuZHAk2D1xTA1BlounJ2Rb9aRg84OXexP0GLd+R83v0khURdMX7b5MKnGTaSg5iA=="],
1157+
"framer-motion": ["framer-motion@12.22.0", "", { "dependencies": { "motion-dom": "^12.22.0", "motion-utils": "^12.19.0", "tslib": "^2.4.0" }, "peerDependencies": { "@emotion/is-prop-valid": "*", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0" }, "optionalPeers": ["@emotion/is-prop-valid", "react", "react-dom"] }, "sha512-qG07rR8/mboCNU34nORbrIbBXbJzP4aDqBdr67TAIVlMryDEOwh7LXjylWovlnPCMg78ExoY0Gn2F1fV+3DNIw=="],
11581158

11591159
"fresh": ["fresh@2.0.0", "", {}, "sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A=="],
11601160

@@ -1524,11 +1524,11 @@
15241524

15251525
"module-definition": ["module-definition@5.0.1", "", { "dependencies": { "ast-module-types": "^5.0.0", "node-source-walk": "^6.0.1" }, "bin": { "module-definition": "bin/cli.js" } }, "sha512-kvw3B4G19IXk+BOXnYq/D/VeO9qfHaapMeuS7w7sNUqmGaA6hywdFHMi+VWeR9wUScXM7XjoryTffCZ5B0/8IA=="],
15261526

1527-
"motion-dom": ["motion-dom@12.6.5", "", { "dependencies": { "motion-utils": "^12.6.5" } }, "sha512-jpM9TQLXzYMWMJ7Ec7sAj0iis8oIuu6WvjI3yNKJLdrZyrsI/b2cRInDVL8dCl683zQQq19DpL9cSMP+k8T1NA=="],
1527+
"motion-dom": ["motion-dom@12.22.0", "", { "dependencies": { "motion-utils": "^12.19.0" } }, "sha512-ooH7+/BPw9gOsL9VtPhEJHE2m4ltnhMlcGMhEqA0YGNhKof7jdaszvsyThXI6LVIKshJUZ9/CP6HNqQhJfV7kw=="],
15281528

1529-
"motion-utils": ["motion-utils@12.6.5", "", {}, "sha512-IsOeKsOF+FWBhxQEDFBO6ZYC8/jlidmVbbLpe9/lXSA9j9kzGIMUuIBx2SZY+0reAS0DjZZ1i7dJp4NHrjocPw=="],
1529+
"motion-utils": ["motion-utils@12.19.0", "", {}, "sha512-BuFTHINYmV07pdWs6lj6aI63vr2N4dg0vR+td0rtrdpWOhBzIkEklZyLcvKBoEtwSqx8Jg06vUB5RS0xDiUybw=="],
15301530

1531-
"motion-v": ["motion-v@1.0.2", "", { "dependencies": { "@vueuse/core": "^10.0.0", "framer-motion": "12.5.0", "hey-listen": "^1.0.8", "motion-dom": "^12.5.0" }, "peerDependencies": { "vue": ">=3.0.0" } }, "sha512-Qn/X9Mx/5g02rjvpGtn5fht2OWTAnZoed4vLXgjM0lJgkSEtoGuadwEVypbCVH3WW1AHsns2k2okKAjpDrKu6A=="],
1531+
"motion-v": ["motion-v@1.5.0", "", { "dependencies": { "@vueuse/core": "^10.0.0", "framer-motion": "12.22.0", "hey-listen": "^1.0.8", "motion-dom": "12.22.0" }, "peerDependencies": { "vue": ">=3.0.0" } }, "sha512-AIwI0U0ZlxDgdtjZKNzSpUo+X3IKRUGNqrdf+hig3TIehxgFds4gSL3amqsx9iZIGjYnGDdlwuqxKPYR1cxiTQ=="],
15321532

15331533
"mrmime": ["mrmime@2.0.1", "", {}, "sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ=="],
15341534

packages/vue-spring-bottom-sheet/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@
6262
"@vueuse/core": "^13.2.0",
6363
"@vueuse/integrations": "^13.2.0",
6464
"focus-trap": "^7.6.4",
65-
"motion-v": "^1.0.2",
65+
"motion-v": "^1.5.0",
6666
"remeda": "^2.21.6",
6767
"vue": "^3.5.14"
6868
},

packages/vue-spring-bottom-sheet/src/BottomSheet.vue

Lines changed: 22 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -187,29 +187,30 @@ const open = async () => {
187187
188188
translateY.value = height.value
189189
190-
heightValue.set(height.value)
191-
translateYValue.set(height.value)
190+
heightValue.jump(height.value)
191+
translateYValue.jump(height.value)
192192
193-
controls = animate(heightValue, height.value, {
194-
duration: props.duration / 1000,
195-
ease: 'easeInOut',
196-
})
197-
controls = animate(translateYValue, 0, {
198-
duration: props.duration / 1000,
199-
ease: 'easeInOut',
193+
requestAnimationFrame(() => {
194+
controls = animate(heightValue, height.value, {
195+
duration: props.duration / 1000,
196+
ease: 'easeInOut',
197+
})
198+
199+
controls = animate(translateYValue, 0, {
200+
duration: props.duration / 1000,
201+
ease: 'easeInOut',
202+
onComplete: () => {
203+
if (props.blocking) {
204+
emit('opened')
205+
focusTrap.activate()
206+
}
207+
},
208+
})
200209
})
201210
202211
window.addEventListener('keydown', handleEscapeKey)
203212
204213
isOpening = false
205-
if (props.blocking) {
206-
setTimeout(() => {
207-
if (heightValue.get() < 1) {
208-
emit('opened')
209-
focusTrap.activate()
210-
}
211-
}, props.duration)
212-
}
213214
}
214215
215216
let isClosing = false
@@ -367,7 +368,9 @@ const handleContentPanStart = (_: PointerEvent, info: PanInfo) => {
367368
height.value = sheetHeight.value
368369
translateY.value = translateYValue.get()
369370
370-
controls.stop()
371+
if (controls) {
372+
controls.stop()
373+
}
371374
372375
if (!sheetScroll.value) return
373376
@@ -548,7 +551,7 @@ defineExpose({ open, close, snapToPoint })
548551
v-if="showSheet"
549552
ref="sheet"
550553
:exit="{ y: '100%', height: sheetHeight }"
551-
:initial="{ y: '100%' }"
554+
:initial="false"
552555
:style="{ y: translateYValue, height: heightValue }"
553556
:data-vsbs-shadow="!blocking"
554557
:data-vsbs-sheet-show="showSheet"
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
{"root":["./src/index.ts","./src/types.ts","./src/vite-env.d.ts","./src/composables/usesnappoints.ts","./src/utils/heightpercenttopixels.ts","./src/utils/rubberbandifoutofbounds.ts","./src/bottomsheet.vue"],"version":"5.6.3"}
1+
{"root":["./src/index.ts","./src/types.ts","./src/vite-env.d.ts","./src/composables/useSnapPoints.ts","./src/utils/heightPercentToPixels.ts","./src/utils/rubberbandIfOutOfBounds.ts","./src/BottomSheet.vue"],"version":"5.6.3"}

packages/vue-spring-bottom-sheet/tsconfig.node.json

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,12 @@
66
"module": "ESNext",
77
"skipLibCheck": true,
88

9-
/* Bundler mode */
109
"moduleResolution": "bundler",
1110
"allowImportingTsExtensions": true,
1211
"isolatedModules": true,
1312
"moduleDetection": "force",
1413
"noEmit": true,
1514

16-
/* Linting */
1715
"strict": true,
1816
"noUnusedLocals": true,
1917
"noUnusedParameters": true,

0 commit comments

Comments
 (0)