feat(*): upgrade to vue 2.7.x

.all-contributorsrc

@@ -49,24 +49,14 @@
       ]
     },
     {
-      "login": "NeoLSN",
-      "name": "Jason Yang/楊朝傑",
-      "avatar_url": "https://avatars1.githubusercontent.com/u/5782106?v=4",
-      "profile": "https://github.com/NeoLSN",
+      "login": "adamdehaven",
+      "name": "Adam DeHaven",
+      "avatar_url": "https://avatars.githubusercontent.com/u/2229946?v=4",
+      "profile": "https://www.adamdehaven.com",
       "contributions": [
-        "bug",
-        "code"
-      ]
-    },
-    {
-      "login": "axelhzf",
-      "name": "Axel Hernández Ferrera",
-      "avatar_url": "https://avatars1.githubusercontent.com/u/175627?v=4",
-      "profile": "http://axelhzf.com",
-      "contributions": [
-        "bug",
         "code",
-        "example"
+        "doc",
+        "maintenance"
       ]
     }
   ],

.eslintrc.js

@@ -3,7 +3,7 @@ module.exports = {
   env: {
     node: true
   },
-  'extends': [
+  extends: [
     'plugin:vue/essential',
     '@vue/standard',
     '@vue/typescript'
@@ -12,7 +12,7 @@ module.exports = {
     'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
     'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
     'promise/param-names': 'off',
-    'no-multiple-empty-lines': ['error', { 'max': 1, 'maxEOF': 1 }],
+    'no-multiple-empty-lines': ['error', { max: 1, maxEOF: 1 }],
     'no-trailing-spaces': 'error',
     'eol-last': 'error'
   },

.github/CODEOWNERS

@@ -0,0 +1,5 @@
+# CI settings
+/.github/ @adamdehaven
+
+# Deployment settings
+/netlify.toml @adamdehaven

.github/workflows/main.yml

@@ -4,9 +4,11 @@ on:
   push:
     branches:
     - master
+    - next
   pull_request:
     branches:
     - master
+    - next
 
 jobs:
   test:

babel.config.js

@@ -1,6 +1,5 @@
 module.exports = {
   presets: [
-    'vca-jsx',
-    '@vue/app'
+    '@vue/cli-plugin-babel/preset'
   ]
 }

docs/.vitepress/config.js → docs/.vuepress/config.js

@@ -13,7 +13,33 @@ module.exports = {
       { text: 'Getting Started', link: '/guide/getting-started' },
       { text: 'API Reference', link: '/configuration' }
     ],
-    sidebar: {
+    sidebar: [
+      {
+        title: 'Guide',
+        collapsable: false,
+        children: [
+          {
+            title: 'Getting Started',
+            path: '/guide/getting-started'
+          }
+        ]
+      },
+      {
+        title: 'APIs',
+        collapsable: false,
+        children: [
+          {
+              title: 'Configuration',
+              path: '/configuration'
+            },
+            {
+              title: 'Features',
+              path: '/features'
+            }
+        ]
+      }
+    ],
+    sidebarOld: {
       '/': [
         {
           text: 'Guide',

docs/.vuepress/styles/index.styl

@@ -0,0 +1,5 @@
+.navbar .logo
+  margin-right 0.5rem !important
+
+.custom-block.tip
+  border-color var(--c-brand-light)

docs/.vuepress/styles/palette.styl

@@ -0,0 +1 @@
+$accentColor = #0089eb

docs/features.md

@@ -7,9 +7,7 @@ lang: en-US
 
 ## Prefetching
 
-Prefetching can be useful for when you anticipate user actions, like hovering
-over a link. SWRV exposes the `mutate` function so that results can be stored in
-the SWRV cache at a predetermined time.
+Prefetching can be useful for when you anticipate user actions, like hovering over a link. SWRV exposes the `mutate` function so that results can be stored in the SWRV cache at a predetermined time.
 
 ```ts
 import { mutate } from 'swrv'
@@ -26,9 +24,7 @@ function prefetch() {
 
 ## Dependent Fetching
 
-swrv also allows you to fetch data that depends on other data. It ensures the
-maximum possible parallelism (avoiding waterfalls), as well as serial fetching
-when a piece of dynamic data is required for the next data fetch to happen.
+swrv also allows you to fetch data that depends on other data. It ensures the maximum possible parallelism (avoiding waterfalls), as well as serial fetching when a piece of dynamic data is required for the next data fetch to happen.
 
 ```vue
 <template>
@@ -62,10 +58,7 @@ export default {
 
 ## Stale-if-error
 
-One of the benefits of a stale content caching strategy is that the cache can be
-served when requests fail.`swrv` uses a
-[stale-if-error](https://tools.ietf.org/html/rfc5861#section-4) strategy and
-will maintain `data` in the cache even if a `useSWRV` fetch returns an `error`.
+One of the benefits of a stale content caching strategy is that the cache can be served when requests fail.`swrv` uses a [stale-if-error](https://tools.ietf.org/html/rfc5861#section-4) strategy and will maintain `data` in the cache even if a `useSWRV` fetch returns an `error`.
 
 ```vue
 <template>
@@ -102,10 +95,7 @@ export default {
 
 ### useSwrvState
 
-Sometimes you might want to know the exact state where swrv is during
-stale-while-revalidate lifecyle. This is helpful when representing the UI as a
-function of state. Here is one way to detect state using a user-land composable
-`useSwrvState` function:
+Sometimes you might want to know the exact state where swrv is during stale-while-revalidate lifecyle. This is helpful when representing the UI as a function of state. Here is one way to detect state using a user-land composable `useSwrvState` function:
 
 ```js
 import { ref, watchEffect } from '@vue/composition-api'
@@ -198,13 +188,7 @@ export default {
 
 ### Vuex
 
-Most of the features of swrv handle the complex logic / ceremony that you'd have
-to implement yourself inside a vuex store. All swrv instances use the same
-global cache, so if you are using swrv alongside vuex, you can use global
-watchers on resolved swrv returned refs. It is encouraged to wrap useSWRV in a
-custom composable function so that you can do application level side effects if
-desired (e.g. dispatch a vuex action when data changes to log events or perform
-some logic).
+Most of the features of swrv handle the complex logic / ceremony that you'd have to implement yourself inside a vuex store. All swrv instances use the same global cache, so if you are using swrv alongside vuex, you can use global watchers on resolved swrv returned refs. It is encouraged to wrap useSWRV in a custom composable function so that you can do application level side effects if desired (e.g. dispatch a vuex action when data changes to log events or perform some logic).
 
 Vue 3 example
 
@@ -245,9 +229,7 @@ export default defineComponent({
 
 ## Error Handling
 
-Since `error` is returned as a Vue Ref, you can use watchers to handle any
-onError callback functionality. Check out
-[the test](https://github.com/Kong/swrv/blob/a063c4aa142a5a13dbd39496cefab7aef54e610c/tests/use-swrv.spec.tsx#L481).
+Since `error` is returned as a Vue Ref, you can use watchers to handle any onError callback functionality. Check out [the test](https://github.com/Kong/swrv/blob/a063c4aa142a5a13dbd39496cefab7aef54e610c/tests/use-swrv.spec.tsx#L481).
 
 ```ts
 export default {
@@ -270,14 +252,11 @@ export default {
 
 ## Cache
 
-By default, a custom cache implementation is used to store fetcher response
-data cache, in-flight promise cache, and ref cache. Response data cache can be 
-customized via the `config.cache` property. Built in cache adapters:
+By default, a custom cache implementation is used to store fetcher response data cache, in-flight promise cache, and ref cache. Response data cache can be customized via the `config.cache` property. Built in cache adapters:
 
 ### localStorage
 
-A common usage case to have a better _offline_ experience is to read from
-`localStorage`. Checkout the [PWA example](/examples/pwa/) for more inspiration.
+A common usage case to have a better _offline_ experience is to read from `localStorage`. Checkout the [PWA example](/examples/pwa/) for more inspiration.
 
 ```ts
 import useSWRV from 'swrv'
@@ -298,11 +277,7 @@ function useTodos () {
 
 ### Serve from cache only
 
-To only retrieve a swrv cache response without revalidating, you can set the fetcher function to `null` from the useSWRV
-call. This can be useful when there is some higher level swrv composable that is always sending data to other instances,
-so you can assume that composables with a `null` fetcher will have data available. This 
-[isn't very intuitive](https://github.com/Kong/swrv/issues/148), so will be looking for ways to improve this api in the
-future.
+To only retrieve a swrv cache response without revalidating, you can set the fetcher function to `null` from the useSWRV call. This can be useful when there is some higher level swrv composable that is always sending data to other instances, so you can assume that composables with a `null` fetcher will have data available. This [isn't very intuitive](https://github.com/Kong/swrv/issues/148), so will be looking for ways to improve this api in the future.
 
 ```ts
 // Component A

docs/guide/getting-started.md

@@ -11,15 +11,9 @@ lang: en-US
 
 ## Overview
 
-`swrv` (pronounced "swerve") is a library using
-[@vue/composition-api](https://github.com/vuejs/composition-api) hooks for
-remote data fetching. It is largely a port of
-[swr](https://github.com/zeit/swr).
+`swrv` (pronounced "swerve") is a library using [Vue Composition API](https://vuejs.org/guide/extras/composition-api-faq.html) hooks for remote data fetching. It is largely a port of [swr](https://github.com/zeit/swr).
 
-The name “SWR” is derived from stale-while-revalidate, a cache invalidation
-strategy popularized by HTTP [RFC 5861](https://tools.ietf.org/html/rfc5861).
-SWR first returns the data from cache (stale), then sends the fetch request
-(revalidate), and finally comes with the up-to-date data again.
+The name “SWR” is derived from stale-while-revalidate, a cache invalidation strategy popularized by HTTP [RFC 5861](https://tools.ietf.org/html/rfc5861). SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the up-to-date data again.
 
 ## Features
 
@@ -36,18 +30,15 @@ SWR first returns the data from cache (stale), then sends the fetch request
 - Customizable cache implementation
 - Error Retry
 
-With `swrv`, components will get a stream of data updates constantly and
-automatically. Thus, the UI will be always fast and reactive.
+With `swrv`, components will get a stream of data updates constantly and automatically. Thus, the UI will be always fast and reactive.
 
 ## Installation
 
 ```shell
 yarn add swrv
 ```
 
-If you want to try out Vue 3 support, install the beta release and
-check out the [Vite example](https://github.com/Kong/swrv/tree/next/examples/vite).
-`swrv` code for Vue 3.0 exists on `next` branch.
+If you want to try out Vue 3 support, install the beta release and check out the [Vite example](https://github.com/Kong/swrv/tree/next/examples/vite). `swrv` code for Vue 3.0 exists on `next` branch.
 
 ```shell
 yarn add swrv@beta
@@ -80,18 +71,8 @@ export default {
 </script>
 ```
 
-In this example, the Vue Hook `useSWRV` accepts a `key` and a `fetcher`
-function. `key` is a unique identifier of the request, normally the URL of the
-API. And the fetcher accepts key as its parameter and returns the data
-asynchronously.
-
-`useSWRV` also returns 2 values: `data` and `error`. When the request (fetcher)
-is not yet finished, data will be `undefined`. And when we get a response, it
-sets `data` and `error` based on the result of fetcher and rerenders the
-component. This is because `data` and `error` are Vue
-[Refs](https://vue-composition-api-rfc.netlify.com/#detailed-design), and their
-values will be set by the fetcher response.
-
-Note that fetcher can be any asynchronous function, so you can use your favorite
-data-fetching library to handle that part. When omitted, swrv falls back to the 
-browser [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API).
+In this example, the Vue Hook `useSWRV` accepts a `key` and a `fetcher` function. `key` is a unique identifier of the request, normally the URL of the API. And the fetcher accepts key as its parameter and returns the data asynchronously.
+
+`useSWRV` also returns 2 values: `data` and `error`. When the request (fetcher) is not yet finished, data will be `undefined`. And when we get a response, it sets `data` and `error` based on the result of fetcher and rerenders the component. This is because `data` and `error` are Vue [Refs](https://vuejs.org/api/reactivity-core.html#ref), and their values will be set by the fetcher response.
+
+Note that fetcher can be any asynchronous function, so you can use your favorite data-fetching library to handle that part. When omitted, swrv falls back to the  browser [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API).

docs/index.md

@@ -2,27 +2,23 @@
 home: true
 heroText: swrv
 heroImage: /logo_45.png
-tagline: Data fetching for Vue Composition Api
+tagline: Data fetching for Vue via the Composition API
 actionText: Get Started →
 actionLink: /guide/getting-started
 features:
 - title: Feature-rich Data Fetching
   details: Transport and protocol agnostic data fetching, revalidation on focus,
     polling, in-flight de-duplication.
-- title: Vue Composition Api
+- title: Vue Composition API
   details: Start developing with power of Vue 3, using the reactivity system of
-    the Vue composition api. Supports both Vue 3 and @vue/composition-api
+    the Vue Composition API.
 - title: Stale-while-revalidate
   details: Uses cache to serve pages fast, while revalidating data sources producing an eventually consistent UI.
-footer: Copyright © 2020-present Kong
 ---
 
 `swrv` (pronounced _"swerve"_) is a library for for data fetching. It is largely a port of [swr](https://github.com/vercel/swr).
 
-The name “SWR” is derived from stale-while-revalidate, a cache invalidation
-strategy popularized by HTTP RFC 5861. SWR first returns the data from cache 
-(stale), then sends the fetch request (revalidate), and finally comes with the
-up-to-date data again.
+The name “SWR” is derived from stale-while-revalidate, a cache invalidation strategy popularized by HTTP RFC 5861. SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the up-to-date data again.
 
 ```vue
 <template>
@@ -52,6 +48,8 @@ export default {
 </script>
 ```
 
-:sparkles: [Read the blogpost](https://guuu.io/2020/data-fetching-vue-composition-api/) 
-introducing swrv
+:sparkles: [Read the blogpost](https://guuu.io/2020/data-fetching-vue-composition-api/) introducing swrv
 
+::: slot footer
+Copyright © 2020-present [Kong](https://konghq.com)
+:::

examples/axios-typescript-nuxt/README.md

@@ -0,0 +1,3 @@
+# Axios TypeScript Nuxt Example
+
+> Note: This example is no longer functional now that SSR support is broken as of the Vue 2.7 upgrade

examples/axios-typescript-nuxt/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "axios-typescript-nuxt",
+  "name": "swrv-axios-typescript-nuxt-example",
   "version": "1.0.0",
   "description": "My neat Nuxt.js project",
   "author": " ",