fix(watchThrottled): resolve mr conflict

.gitignore

@@ -15,4 +15,5 @@ packages/public/badge-*
 packages/*/index.mjs
 playgrounds/*/pnpm-lock.yaml
 types
-coverage
+coverage
+.eslintcache

.npmrc

@@ -1,2 +1,3 @@
 shamefully-hoist=true
 strict-peer-dependencies=false
+side-effects-cache=false

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/monorepo",
-  "version": "9.3.0",
+  "version": "9.3.1",
   "private": true,
   "packageManager": "pnpm@7.6.0",
   "description": "Collection of essential Vue Composition Utilities",
@@ -16,7 +16,7 @@
     "docs": "vue-demi-switch 3 && vitepress dev packages --open",
     "docs:build": "nr update:full && vitepress build packages && nr build:redirects && esno scripts/post-docs.ts",
     "docs:serve": "vitepress serve packages",
-    "lint": "eslint .",
+    "lint": "eslint --cache .",
     "lint:fix": "nr lint --fix",
     "publish:ci": "esno scripts/publish.ts",
     "install-fonts": "gfi install Inter && gfi install Fira Code",
@@ -36,91 +36,89 @@
   },
   "devDependencies": {
     "@antfu/eslint-config": "^0.27.0",
-    "@antfu/ni": "^0.18.0",
-    "@iconify/json": "^2.1.113",
-    "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-replace": "^4.0.0",
+    "@antfu/ni": "^0.18.2",
+    "@iconify/json": "^2.1.122",
+    "@rollup/plugin-json": "^5.0.0",
+    "@rollup/plugin-replace": "^5.0.0",
     "@type-challenges/utils": "^0.1.1",
     "@types/fs-extra": "^9.0.13",
     "@types/js-yaml": "^4.0.5",
     "@types/md5": "^2.3.2",
-    "@types/node": "^18.7.21",
+    "@types/node": "^18.11.0",
     "@types/prettier": "^2.7.1",
     "@types/semver": "^7.3.12",
     "@types/sharp": "^0.31.0",
-    "@vitest/coverage-c8": "^0.23.4",
-    "@vitest/ui": "^0.23.4",
-    "@vue/compiler-sfc": "^3.2.39",
-    "@vue/test-utils": "^2.0.2",
+    "@vitest/coverage-c8": "^0.24.3",
+    "@vitest/ui": "^0.24.3",
+    "@vue/compiler-sfc": "^3.2.41",
+    "@vue/test-utils": "^2.1.0",
     "@vueuse/core": "workspace:*",
     "@vueuse/integrations": "workspace:*",
     "@vueuse/math": "workspace:*",
     "@vueuse/rxjs": "workspace:*",
     "@vueuse/shared": "workspace:*",
-    "axios": "^0.27.2",
+    "axios": "^1.1.3",
     "bumpp": "^8.2.1",
     "consola": "^2.15.3",
     "cross-env": "^7.0.3",
     "esbuild-register": "^3.3.3",
-    "eslint": "^8.24.0",
+    "eslint": "^8.25.0",
     "esno": "^0.16.3",
     "export-size": "^0.5.2",
     "fast-glob": "^3.2.12",
-    "firebase": "^9.10.0",
+    "firebase": "^9.12.1",
     "fs-extra": "^10.1.0",
     "fuse.js": "^6.6.2",
     "google-font-installer": "^1.2.0",
     "gray-matter": "^4.0.3",
     "js-yaml": "^4.1.0",
-    "jsdom": "^20.0.0",
+    "jsdom": "^20.0.1",
     "lint-staged": "^13.0.3",
     "markdown-table": "^3.0.2",
     "md5": "^2.3.0",
-    "msw": "^0.47.3",
+    "msw": "^0.47.4",
     "node-fetch": "^3.2.10",
     "ohmyfetch": "^0.4.19",
-    "pnpm": "^7.12.2",
-    "postcss": "^8.4.16",
-    "postcss-nested": "^5.0.6",
+    "pnpm": "^7.13.5",
+    "postcss": "^8.4.18",
+    "postcss-nested": "^6.0.0",
     "prettier": "^2.7.1",
     "prism-theme-vars": "^0.2.4",
     "remove-markdown": "^0.5.0",
     "rimraf": "^3.0.2",
-    "rollup": "^2.79.1",
-    "rollup-plugin-dts": "^4.2.2",
+    "rollup": "^3.2.2",
+    "rollup-plugin-dts": "^5.0.0",
     "rollup-plugin-esbuild": "^4.10.1",
-    "sharp": "^0.31.0",
+    "sharp": "^0.31.1",
     "simple-git": "^3.14.1",
     "simple-git-hooks": "^2.8.0",
-    "typescript": "4.8.3",
-    "unocss": "^0.45.23",
-    "unplugin-icons": "^0.14.10",
-    "unplugin-vue-components": "^0.22.7",
-    "vite": "^3.1.3",
-    "vite-plugin-inspect": "^0.7.3",
+    "typescript": "4.8.4",
+    "unocss": "^0.45.29",
+    "unplugin-icons": "^0.14.12",
+    "unplugin-vue-components": "^0.22.8",
+    "vite": "^3.1.8",
+    "vite-plugin-inspect": "^0.7.5",
     "vite-plugin-pwa": "^0.13.1",
-    "vitepress": "^1.0.0-alpha.16",
-    "vitest": "^0.23.4",
-    "vue": "^3.2.39",
+    "vitepress": "^1.0.0-alpha.21",
+    "vitest": "^0.24.3",
+    "vue": "^3.2.41",
     "vue2": "npm:vue@^2.7.10"
   },
   "pnpm": {
     "neverBuiltDependencies": [
       "electron"
     ],
     "overrides": {
-      "vue-demi": "0.13.11"
-    },
-    "patchedDependencies": {
-      "vite@3.1.3": "patches/vite@3.1.3.patch"
+      "vue-demi": "0.13.11",
+      "vite": "^3.1.6"
     }
   },
   "simple-git-hooks": {
     "pre-commit": "npx lint-staged"
   },
   "lint-staged": {
     "*.{js,ts,tsx,vue,md}": [
-      "eslint --fix"
+      "eslint --cache --fix"
     ]
   }
 }

packages/.vitepress/config.ts

@@ -31,6 +31,7 @@ const Links = [
   { text: 'Ecosystem', link: '/ecosystem' },
   { text: 'Export Size', link: '/export-size' },
   { text: 'Recent Updated', link: '/functions.html#sort=updated' },
+  { text: 'Premium Video Course', link: 'https://vueschool.io/courses/vueuse-for-everyone?friend=vueuse' },
 ]
 
 const DefaultSideBar = [

packages/.vitepress/plugins/utils.ts

@@ -6,6 +6,7 @@ export const stringify = reactify(
     skipInvalid: true,
     forceQuotes: true,
     condenseFlow: true,
+    noCompatMode: true,
     quotingType: '\'',
   }),
 )

packages/.vitepress/theme/components/CourseLink.vue

@@ -0,0 +1,12 @@
+<script setup lang="ts">
+const props = defineProps<{
+  href: string
+}>()
+</script>
+
+<template>
+  <a :href="href" target="_blank" bg-green:10 px4 py3 rounded block mt2 flex items-center gap2>
+    <div i-carbon:play-filled flex-none text-lg />
+    <slot />
+  </a>
+</template>

packages/.vitepress/theme/composables/dark.ts

@@ -1,5 +1,5 @@
 import { useDark } from '@vueuse/core'
 
 export const isDark = useDark({
-  storageKey: 'vue-theme-appearance',
+  storageKey: 'vitepress-theme-appearance',
 })

packages/components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/components",
-  "version": "9.3.0",
+  "version": "9.3.1",
   "description": "Renderless components for VueUse",
   "author": "Jacob Clevenger<https://github.com/wheatjs>",
   "license": "MIT",

packages/core/index.ts

@@ -96,6 +96,7 @@ export * from './useScroll'
 export * from './useScrollLock'
 export * from './useSessionStorage'
 export * from './useShare'
+export * from './useSorted'
 export * from './useSpeechRecognition'
 export * from './useSpeechSynthesis'
 export * from './useStepper'

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/core",
-  "version": "9.3.0",
+  "version": "9.3.1",
   "description": "Collection of essential Vue Composition Utilities",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",
@@ -39,7 +39,7 @@
   "jsdelivr": "./index.iife.min.js",
   "types": "./index.d.ts",
   "dependencies": {
-    "@types/web-bluetooth": "^0.0.15",
+    "@types/web-bluetooth": "^0.0.16",
     "@vueuse/metadata": "workspace:*",
     "@vueuse/shared": "workspace:*",
     "vue-demi": "*"

packages/core/useBluetooth/index.ts

@@ -1,5 +1,5 @@
 import type { ComputedRef, Ref } from 'vue-demi'
-import { computed, ref, watch } from 'vue-demi'
+import { computed, ref, shallowRef, watch } from 'vue-demi'
 import { tryOnMounted, tryOnScopeDispose } from '@vueuse/shared'
 import type { ConfigurableNavigator } from '../_configurable'
 
@@ -55,9 +55,9 @@ export function useBluetooth(options?: UseBluetoothOptions): UseBluetoothReturn
 
   const isSupported = useSupported(() => navigator && 'bluetooth' in navigator)
 
-  const device = ref<undefined | BluetoothDevice>(undefined)
+  const device = shallowRef<undefined | BluetoothDevice>(undefined)
 
-  const error = ref<unknown | null>(null)
+  const error = shallowRef<unknown | null>(null)
 
   watch(device, () => {
     connectToBluetoothGATTServer()

packages/core/useClipboard/index.md

@@ -6,6 +6,8 @@ category: Browser
 
 Reactive [Clipboard API](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API). Provides the ability to respond to clipboard commands (cut, copy, and paste) as well as to asynchronously read from and write to the system clipboard. Access to the contents of the clipboard is gated behind the [Permissions API](https://developer.mozilla.org/en-US/docs/Web/API/Permissions_API). Without user permission, reading or altering the clipboard contents is not permitted.
 
+<CourseLink href="https://vueschool.io/lessons/reactive-browser-wrappers-in-vueuse-useclipboard?friend=vueuse">Learn how to reactively save text to the clipboard with this FREE video lesson from Vue School!</CourseLink>
+
 ## Usage
 
 ```js

packages/core/useClipboard/index.ts

@@ -3,7 +3,7 @@
 import type { MaybeComputedRef } from '@vueuse/shared'
 import { resolveUnref, useTimeoutFn } from '@vueuse/shared'
 import type { ComputedRef, Ref } from 'vue-demi'
-import { ref } from 'vue-demi'
+import { computed, ref } from 'vue-demi'
 import type { WindowEventName } from '../useEventListener'
 import { useEventListener } from '../useEventListener'
 import { useSupported } from '../useSupported'
@@ -29,6 +29,13 @@ export interface UseClipboardOptions<Source> extends ConfigurableNavigator {
    * @default 1500
    */
   copiedDuring?: number
+
+  /**
+   * Whether fallback to document.execCommand('copy') if clipboard is undefined.
+   *
+   * @default false
+   */
+  legacy?: boolean
 }
 
 export interface UseClipboardReturn<Optional> {
@@ -52,19 +59,25 @@ export function useClipboard(options: UseClipboardOptions<MaybeComputedRef<strin
     read = false,
     source,
     copiedDuring = 1500,
+    legacy = false,
   } = options
 
   const events = ['copy', 'cut']
-  const isSupported = useSupported(() => navigator && 'clipboard' in navigator)
+  const isClipboardApiSupported = useSupported(() => (navigator && 'clipboard' in navigator))
+  const isSupported = computed(() => isClipboardApiSupported.value || legacy)
   const text = ref('')
   const copied = ref(false)
-
   const timeout = useTimeoutFn(() => copied.value = false, copiedDuring)
 
   function updateText() {
-    navigator!.clipboard.readText().then((value) => {
-      text.value = value
-    })
+    if (isClipboardApiSupported.value) {
+      navigator!.clipboard.readText().then((value) => {
+        text.value = value
+      })
+    }
+    else {
+      text.value = legacyRead()
+    }
   }
 
   if (isSupported.value && read) {
@@ -74,13 +87,32 @@ export function useClipboard(options: UseClipboardOptions<MaybeComputedRef<strin
 
   async function copy(value = resolveUnref(source)) {
     if (isSupported.value && value != null) {
-      await navigator!.clipboard.writeText(value)
+      if (isClipboardApiSupported.value)
+        await navigator!.clipboard.writeText(value)
+      else
+        legacyCopy(value)
+
       text.value = value
       copied.value = true
       timeout.start()
     }
   }
 
+  function legacyCopy(value: string) {
+    const ta = document.createElement('textarea')
+    ta.value = value ?? ''
+    ta.style.position = 'absolute'
+    ta.style.opacity = '0'
+    document.body.appendChild(ta)
+    ta.select()
+    document.execCommand('copy')
+    ta.remove()
+  }
+
+  function legacyRead() {
+    return document?.getSelection?.()?.toString() ?? ''
+  }
+
   return {
     isSupported,
     text: text as ComputedRef<string>,

packages/core/useCycleList/index.md

@@ -4,7 +4,9 @@ category: Utilities
 
 # useCycleList
 
- Cycle through a list of items.
+Cycle through a list of items.
+
+<CourseLink href="https://vueschool.io/lessons/create-an-image-carousel-with-vueuse?friend=vueuse">Learn how to use useCycleList to create an image carousel with this FREE video lesson from Vue School!</CourseLink>
 
 ## Usage