Merge branch 'main' into next

vueuse · Jul 17, 2022 · c57ddc1 · c57ddc1
2 parents aa3fd69 + 3e1e098
commit c57ddc1
Show file tree

Hide file tree

Showing 18 changed files with 37 additions and 32 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/monorepo",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "private": true,
   "packageManager": "pnpm@7.1.7",
   "description": "Collection of essential Vue Composition Utilities",

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/components",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "description": "Renderless components for VueUse",
   "author": "Jacob Clevenger<https://github.com/wheatjs>",
   "license": "MIT",

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/core",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "description": "Collection of essential Vue Composition Utilities",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",

diff --git a/packages/core/useDropZone/demo.vue b/packages/core/useDropZone/demo.vue
@@ -15,7 +15,7 @@ function onDrop(files: File[] | null) {
   }
 }
 
-const dropZoneRef = ref<HTMLElement | null>(null)
+const dropZoneRef = ref<HTMLElement>()
 
 const { isOverDropZone } = useDropZone(dropZoneRef, onDrop)
 </script>

diff --git a/packages/core/useDropZone/index.md b/packages/core/useDropZone/index.md
@@ -12,7 +12,7 @@ Create an zone where files can be dropped.
 <script setup lang="ts">
 import { useDropZone } from '@vueuse/core'
 
-const dropZoneRef = ref(null)
+const dropZoneRef = ref<HTMLDivElement>()
 
 function onDrop(files: File[] | null) {
   // called when files are dropped on zone

diff --git a/packages/core/useDropZone/index.ts b/packages/core/useDropZone/index.ts
@@ -9,8 +9,8 @@ export interface UseDropZoneReturn {
 }
 
 export function useDropZone(
-  target: MaybeComputedRef<HTMLElement | null>,
-  onDrop: (files: File[] | null) => void,
+  target: MaybeComputedRef<HTMLElement | null | undefined>,
+  onDrop?: (files: File[] | null) => void,
 ): UseDropZoneReturn {
   const isOverDropZone = ref(false)
   let counter = 0
@@ -35,11 +35,7 @@ export function useDropZone(
       counter = 0
       isOverDropZone.value = false
       const files = Array.from(event.dataTransfer?.files ?? [])
-      if (files.length === 0) {
-        onDrop(null)
-        return
-      }
-      onDrop(files)
+      onDrop?.(files.length === 0 ? null : files)
     })
   }
 

diff --git a/packages/core/useFileDialog/index.ts b/packages/core/useFileDialog/index.ts
@@ -1,4 +1,4 @@
-import { readonly, ref } from 'vue-demi'
+import { type Ref, readonly, ref } from 'vue-demi'
 import type { ConfigurableDocument } from '../_configurable'
 import { defaultDocument } from '../_configurable'
 
@@ -23,13 +23,19 @@ const DEFAULT_OPTIONS: UseFileDialogOptions = {
   accept: '*',
 }
 
+export interface UseFileDialogReturn {
+  files: Ref<FileList | null>
+  open: (localOptions?: Partial<UseFileDialogOptions>) => void
+  reset: () => void
+}
+
 /**
  * Open file dialog with ease.
  *
  * @see https://vueuse.org/useFileDialog
  * @param options
  */
-export function useFileDialog(options: UseFileDialogOptions = {}) {
+export function useFileDialog(options: UseFileDialogOptions = {}): UseFileDialogReturn {
   const {
     document = defaultDocument,
   } = options
@@ -74,5 +80,3 @@ export function useFileDialog(options: UseFileDialogOptions = {}) {
     reset,
   }
 }
-
-export type UseFileDialogReturn = ReturnType<typeof useFileDialog>
diff --git a/packages/core/useInfiniteScroll/index.ts b/packages/core/useInfiniteScroll/index.ts
@@ -18,7 +18,7 @@ export interface UseInfiniteScrollOptions extends UseScrollOptions {
    *
    * @default 'bottom'
    */
-  direction?: 'top' | 'bottom'
+  direction?: 'top' | 'bottom' | 'left' | 'right'
 
   /**
    * Whether to preserve the current scroll position when loading more items.

diff --git a/packages/core/useObjectUrl/index.md b/packages/core/useObjectUrl/index.md
@@ -18,7 +18,7 @@ import { shallowRef } from 'vue'
 const file = shallowRef()
 const url = useObjectUrl(file)
 
-const onFileChange = (e) => {
+const onFileChange = (event) => {
   file.value = event.target.files[0]
 }
 </script>

diff --git a/packages/core/useSpeechSynthesis/demo.vue b/packages/core/useSpeechSynthesis/demo.vue
@@ -1,18 +1,23 @@
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, watch } from 'vue'
 import { useSpeechSynthesis } from '@vueuse/core'
 
-const voices = ref<SpeechSynthesisVoice[]>([])
-const voice = ref()
+const voice = ref<SpeechSynthesisVoice>({ lang: 'en-US' } as SpeechSynthesisVoice)
 const text = ref('Hello, everyone! Good morning!')
 
 const speech = useSpeechSynthesis(text, {
-  voice,
+  lang: voice.value.lang,
 })
 
 let synth: SpeechSynthesis
 
-if (speech.isSupported.value) {
+const voices = ref<SpeechSynthesisVoice[]>([])
+
+watch(voice, (newVoice) => {
+  speech.utterance.value.voice = newVoice
+})
+
+if (speech.isSupported) {
   // load at last
   setTimeout(() => {
     synth = window.speechSynthesis
@@ -42,7 +47,7 @@ const stop = () => {
 
 <template>
   <div>
-    <div v-if="!speech.isSupported.value">
+    <div v-if="!speech.isSupported">
       Your browser does not support SpeechSynthesis API,
       <a
         href="https://caniuse.com/mdn-api_speechsynthesis"

diff --git a/packages/electron/package.json b/packages/electron/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/electron",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "description": "Electron renderer process modules for VueUse",
   "author": "Archer Gu<https://github.com/ArcherGu>",
   "license": "MIT",

diff --git a/packages/firebase/package.json b/packages/firebase/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/firebase",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "description": "Enables realtime bindings for Firebase",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",

diff --git a/packages/integrations/package.json b/packages/integrations/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/integrations",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "description": "Integration wrappers for utility libraries",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",

diff --git a/packages/metadata/package.json b/packages/metadata/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/metadata",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "description": "Metadata for VueUse functions",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",

diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/nuxt",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "description": "VueUse Nuxt Module",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",

diff --git a/packages/router/package.json b/packages/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/router",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "description": "Utilities for vue-router",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",

diff --git a/packages/rxjs/package.json b/packages/rxjs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/rxjs",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "description": "Enables RxJS reactive functions in Vue",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",

diff --git a/packages/shared/package.json b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/shared",
-  "version": "8.9.3",
+  "version": "8.9.4",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",
   "funding": "https://github.com/sponsors/antfu",