@vueuse/nuxt 7.2.1 → 7.4.1

package/index.cjs

@@ -1,6 +1,6 @@
 // CommonJS proxy to bypass jiti transforms from nuxt 2 and using native ESM
 module.exports = function(...args) {
-  return import('./index.ts').then(m => m.default.call(this, ...args))
+  return import('./index.mjs').then(m => m.default.call(this, ...args))
 }
 
 module.exports.meta = require('./package.json')

package/index.mjs

@@ -3,7 +3,7 @@ import { dirname, resolve } from 'path';
 import { fileURLToPath } from 'url';
 import { isPackageExists } from 'local-pkg';
 
-const _dirname = typeof __dirname === "undefined" ? dirname(fileURLToPath(import.meta.url)) : __dirname;
+const _dirname = dirname(fileURLToPath(import.meta.url));
 const disabledFunctions = [
   "useFetch",
   "toRefs",
@@ -24,6 +24,7 @@ const packages = [
 const fullPackages = packages.map((p) => `@vueuse/${p}`);
 function VueUseModule() {
   const { nuxt } = this;
+  const options = nuxt.options.vueuse || {};
   nuxt.hook("vite:extend", ({ config }) => {
     config.optimizeDeps = config.optimizeDeps || {};
     config.optimizeDeps.exclude = config.optimizeDeps.exclude || [];
@@ -31,38 +32,45 @@ function VueUseModule() {
   });
   nuxt.options.build = nuxt.options.build || {};
   nuxt.options.build.transpile = nuxt.options.build.transpile || [];
-  nuxt.options.build.transpile.push("@vueuse/nuxt");
+  nuxt.options.build.transpile.push("@vueuse/nuxt", "@vueuse/core", "@vueuse/shared");
   let indexes;
-  nuxt.hook("autoImports:sources", (sources) => {
-    if (sources.find((i) => fullPackages.includes(i.from)))
-      return;
-    if (!indexes) {
-      try {
-        indexes = JSON.parse(fs.readFileSync(resolve(_dirname, "./indexes.json"), "utf-8"));
-        indexes == null ? void 0 : indexes.functions.forEach((i) => {
-          if (i.package === "shared")
-            i.package = "core";
-        });
-      } catch (e) {
-        throw new Error("[@vueuse/nuxt] Failed to load indexes.json");
+  if (options.ssrHandlers) {
+    const pluginPath = resolve(_dirname, "./ssr-plugin.mjs");
+    nuxt.options.plugins = nuxt.options.plugins || [];
+    nuxt.options.plugins.push(pluginPath);
+  }
+  if (options.autoImports !== false) {
+    nuxt.hook("autoImports:sources", (sources) => {
+      if (sources.find((i) => fullPackages.includes(i.from)))
+        return;
+      if (!indexes) {
+        try {
+          indexes = JSON.parse(fs.readFileSync(resolve(_dirname, "./indexes.json"), "utf-8"));
+          indexes == null ? void 0 : indexes.functions.forEach((i) => {
+            if (i.package === "shared")
+              i.package = "core";
+          });
+        } catch (e) {
+          throw new Error("[@vueuse/nuxt] Failed to load indexes.json");
+        }
       }
-    }
-    if (!indexes)
-      return;
-    for (const pkg of packages) {
-      if (pkg === "core")
-        continue;
-      if (!isPackageExists(`@vueuse/${pkg}`))
-        continue;
-      const functions = indexes.functions.filter((i) => (i.package === "core" || i.package === "shared") && !i.internal);
-      if (functions.length) {
-        sources.push({
-          from: `@vueuse/${pkg}`,
-          names: indexes.functions.filter((i) => i.package === pkg && !i.internal).map((i) => i.name).filter((i) => i.length >= 4 && !disabledFunctions.includes(i))
-        });
+      if (!indexes)
+        return;
+      for (const pkg of packages) {
+        if (pkg === "shared")
+          continue;
+        if (!isPackageExists(`@vueuse/${pkg}`))
+          continue;
+        const functions = indexes.functions.filter((i) => (i.package === "core" || i.package === "shared") && !i.internal);
+        if (functions.length) {
+          sources.push({
+            from: `@vueuse/${pkg}`,
+            names: indexes.functions.filter((i) => i.package === pkg && !i.internal).map((i) => i.name).filter((i) => i.length >= 4 && !disabledFunctions.includes(i))
+          });
+        }
       }
-    }
-  });
+    });
+  }
 }
 
 export { VueUseModule as default };

package/indexes.json

@@ -35,7 +35,10 @@
       "external": [
         "@vueuse/core",
         "@vueuse/shared",
-        "local-pkg"
+        "local-pkg",
+        "fs",
+        "path",
+        "url"
       ],
       "dir": "packages/nuxt",
       "docs": "https://vueuse.org/nuxt/README.html"
@@ -629,6 +632,14 @@
       "category": "Browser",
       "description": "reactive [Clipboard API](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API)"
     },
+    {
+      "name": "useColorMode",
+      "package": "core",
+      "component": true,
+      "docs": "https://vueuse.org/core/useColorMode/",
+      "category": "Browser",
+      "description": "reactive color mode (dark / light / customs) with auto data persistence"
+    },
     {
       "name": "useConfirmDialog",
       "package": "core",
@@ -643,6 +654,13 @@
       "category": "Browser",
       "description": "manipulate CSS variables"
     },
+    {
+      "name": "useCycleList",
+      "package": "core",
+      "docs": "https://vueuse.org/core/useCycleList/",
+      "category": "Utilities",
+      "description": "cycle through a list of items"
+    },
     {
       "name": "useDark",
       "package": "core",
@@ -721,6 +739,13 @@
       "category": "Sensors",
       "description": "reactive [bounding box](https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect) of an HTML element"
     },
+    {
+      "name": "useElementByPoint",
+      "package": "core",
+      "docs": "https://vueuse.org/core/useElementByPoint/",
+      "category": "Sensors",
+      "description": "reactive element by point"
+    },
     {
       "name": "useElementHover",
       "package": "core",
@@ -926,6 +951,13 @@
       "category": "Sensors",
       "description": "watch for changes being made to the DOM tree"
     },
+    {
+      "name": "useNavigatorLanguage",
+      "package": "core",
+      "docs": "https://vueuse.org/core/useNavigatorLanguage/",
+      "category": "Sensors",
+      "description": "watch for changes being made to the navigator language preference by the user"
+    },
     {
       "name": "useNetwork",
       "package": "core",
@@ -1032,6 +1064,14 @@
       "category": "Sensors",
       "description": "reports changes to the dimensions of an Element's content or the border-box"
     },
+    {
+      "name": "useScreenSafeArea",
+      "package": "core",
+      "component": true,
+      "docs": "https://vueuse.org/core/useScreenSafeArea/",
+      "category": "Browser",
+      "description": "reactive `env(safe-area-inset-*)`"
+    },
     {
       "name": "useScriptTag",
       "package": "core",
@@ -1088,6 +1128,13 @@
       "category": "State",
       "description": "reactive [LocalStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)/[SessionStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage)"
     },
+    {
+      "name": "useStorageAsync",
+      "package": "core",
+      "docs": "https://vueuse.org/core/useStorageAsync/",
+      "category": "State",
+      "description": "reactive Storage in with async support"
+    },
     {
       "name": "useSwipe",
       "package": "core",
@@ -1102,6 +1149,13 @@
       "category": "Component",
       "description": "shorthand for binding refs to template elements and components inside `v-for`"
     },
+    {
+      "name": "useTextSelection",
+      "package": "core",
+      "docs": "https://vueuse.org/core/useTextSelection/",
+      "category": "Sensors",
+      "description": "reactively track user text selection based on [`Window.getSelection`](https://developer.mozilla.org/en-US/docs/Web/API/Window/getSelection)"
+    },
     {
       "name": "useThrottledRefHistory",
       "package": "core",
@@ -1318,6 +1372,13 @@
       "category": "@RxJS",
       "description": "use an Observable"
     },
+    {
+      "name": "useSubject",
+      "package": "rxjs",
+      "docs": "https://vueuse.org/rxjs/useSubject/",
+      "category": "@RxJS",
+      "description": "bind Subject to ref and propagate value changes both ways"
+    },
     {
       "name": "useSubscription",
       "package": "rxjs",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/nuxt",
-  "version": "7.2.1",
+  "version": "7.4.1",
   "description": "VueUse Nuxt Module",
   "keywords": [
     "vue",
@@ -9,6 +9,10 @@
     "nuxt3",
     "nuxt-module"
   ],
+  "homepage": "https://github.com/vueuse/vueuse/tree/main/packages/nuxt#readme",
+  "bugs": {
+    "url": "https://github.com/vueuse/vueuse/issues"
+  },
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -17,6 +21,7 @@
   },
   "funding": "https://github.com/sponsors/antfu",
   "author": "Anthony Fu <https://github.com/antfu>",
+  "sideEffects": false,
   "exports": {
     ".": {
       "import": "./index.mjs",
@@ -26,15 +31,10 @@
     "./*": "./*"
   },
   "main": "./index.cjs",
-  "types": "./index.d.ts",
   "module": "./index.mjs",
-  "sideEffects": false,
-  "bugs": {
-    "url": "https://github.com/vueuse/vueuse/issues"
-  },
-  "homepage": "https://github.com/vueuse/vueuse/tree/main/packages/nuxt#readme",
+  "types": "./index.d.ts",
   "dependencies": {
-    "@vueuse/core": "7.2.1",
+    "@vueuse/core": "7.4.1",
     "local-pkg": "^0.4.0",
     "vue-demi": "*"
   }

package/ssr-plugin.mjs

@@ -0,0 +1,48 @@
+import { setSSRHandler } from '@vueuse/core'
+import { useMeta } from '#meta'
+import { useCookie } from '#app'
+
+setSSRHandler('getDefaultStorage', () => {
+  const cookieMap = new Map()
+  return {
+    getItem: (key) => {
+      if (!cookieMap.get(key))
+        cookieMap.set(key, useCookie(key))
+      return cookieMap.get(key).value
+    },
+    setItem: (key, value) => {
+      if (!cookieMap.get(key))
+        cookieMap.set(key, useCookie(key))
+      cookieMap.get(key).value = value
+    },
+    removeItem: (key) => {
+      if (!cookieMap.get(key))
+        cookieMap.set(key, useCookie(key))
+      cookieMap.get(key).value = undefined
+    },
+  }
+})
+
+if (process.server) {
+  setSSRHandler('updateHTMLAttrs', (selector, attr, value) => {
+    if (selector === 'html') {
+      useMeta({
+        htmlAttrs: {
+          [attr]: value,
+        },
+      })
+    }
+    else if (selector === 'body') {
+      useMeta({
+        bodyAttrs: {
+          [attr]: value,
+        },
+      })
+    }
+    else {
+      throw new Error(`Unsupported meta selector "${selector}" in SSR`)
+    }
+  })
+}
+
+export default () => {}