@slidev/client 0.25.3 → 0.25.4

package/constants.ts

@@ -1,9 +1,10 @@
-import { InjectionKey, Ref } from 'vue'
+import { ComputedRef, InjectionKey, Ref } from 'vue'
 
 export const injectionClicks: InjectionKey<Ref<number>> = Symbol('v-click-clicks')
 export const injectionClicksElements: InjectionKey<Ref<(Element | string)[]>> = Symbol('v-click-clicks-elements')
 export const injectionOrderMap: InjectionKey<Ref<Map<number, HTMLElement[]>>> = Symbol('v-click-clicks-order-map')
 export const injectionClicksDisabled: InjectionKey<Ref<boolean>> = Symbol('v-click-clicks-disabled')
+export const injectionSlideScale: InjectionKey<ComputedRef<number>> = Symbol('slidev-slide-scale')
 
 export const CLASS_VCLICK_TARGET = 'slidev-vclick-target'
 export const CLASS_VCLICK_HIDDEN = 'slidev-vclick-hidden'

package/internals/DrawingLayer.vue

@@ -1,11 +1,14 @@
 <script setup lang="ts">
-import { onMounted, ref, onBeforeUnmount } from 'vue'
+import { onMounted, ref, watch, inject, onBeforeUnmount } from 'vue'
 import { drauu, loadCanvas } from '../logic/drawings'
+import { injectionSlideScale } from '../constants'
 
+const scale = inject(injectionSlideScale)!
 const svg = ref<SVGSVGElement>()
 
 onMounted(() => {
   drauu.mount(svg.value!, svg.value!.parentElement!)
+  watch(scale, scale => drauu.options.coordinateScale = 1 / scale, { immediate: true })
   loadCanvas()
 })
 

package/internals/SlideContainer.vue

@@ -2,6 +2,7 @@
 import { useElementSize } from '@vueuse/core'
 import { computed, provide, ref, watchEffect } from 'vue'
 import { slideAspect, slideWidth, slideHeight, configs } from '../env'
+import { injectionSlideScale } from '../constants'
 
 const props = defineProps({
   width: {
@@ -50,6 +51,8 @@ const className = computed(() => ({
   'select-none': !configs.selectable,
   'slidev-code-line-numbers': configs.lineNumbers,
 }))
+
+provide(injectionSlideScale, scale)
 </script>
 
 <template>

package/logic/drawings.ts

@@ -49,6 +49,7 @@ export const drawingMode = computed({
 export const drauuOptions: DrauuOptions = reactive({
   brush,
   acceptsInputTypes: computed(() => drawingEnabled.value ? undefined : ['pen' as const]),
+  coordinateTransform: false,
 })
 export const drauu = markRaw(createDrauu(drauuOptions))
 

package/logic/nav.ts

@@ -1,8 +1,9 @@
 import { computed, Ref, ref, nextTick } from 'vue'
-import { isString, SwipeDirection, timestamp, useSwipe } from '@vueuse/core'
+import { isString, SwipeDirection, timestamp, usePointerSwipe } from '@vueuse/core'
 import { rawRoutes, router } from '../routes'
 import { configs } from '../env'
 import { useRouteQuery } from './route'
+import { isDrawing } from './drawings'
 
 export { rawRoutes, router }
 
@@ -91,15 +92,24 @@ export function go(page: number, clicks?: number) {
 
 export function useSwipeControls(root: Ref<HTMLElement | undefined>) {
   const swipeBegin = ref(0)
-  const { direction, lengthX, lengthY } = useSwipe(root, {
-    onSwipeStart() {
+  const { direction, distanceX, distanceY } = usePointerSwipe(root, {
+    onSwipeStart(e) {
+      if (e.pointerType !== 'touch')
+        return
+      if (isDrawing.value)
+        return
       swipeBegin.value = timestamp()
     },
-    onSwipeEnd() {
+    onSwipeEnd(e) {
+      if (e.pointerType !== 'touch')
+        return
       if (!swipeBegin.value)
         return
-      const x = Math.abs(lengthX.value)
-      const y = Math.abs(lengthY.value)
+      if (isDrawing.value)
+        return
+
+      const x = Math.abs(distanceX.value)
+      const y = Math.abs(distanceY.value)
       if (x / window.innerWidth > 0.3 || x > 100) {
         if (direction.value === SwipeDirection.LEFT)
           next()

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@slidev/client",
-  "version": "0.25.3",
+  "version": "0.25.4",
   "description": "Presentation slides for developers",
   "homepage": "https://sli.dev",
   "bugs": "https://github.com/slidevjs/slidev/issues",
@@ -13,13 +13,13 @@
   "author": "antfu <anthonyfu117@hotmail.com>",
   "dependencies": {
     "@antfu/utils": "^0.3.0",
-    "@slidev/parser": "0.25.3",
-    "@slidev/types": "0.25.3",
+    "@slidev/parser": "0.25.4",
+    "@slidev/types": "0.25.4",
     "@vueuse/core": "^6.4.0",
     "@vueuse/head": "^0.6.0",
     "@vueuse/motion": "^1.6.0",
     "codemirror": "^5.62.3",
-    "drauu": "^0.1.2",
+    "drauu": "^0.2.0",
     "file-saver": "^2.0.5",
     "js-base64": "^3.7.1",
     "js-yaml": "^4.1.0",