Dafrok · semiaddict · Feb 27, 2022 · Feb 27, 2022 · Feb 28, 2022 · Jan 13, 2023
diff --git a/.browserslistrc b/.browserslistrc
@@ -0,0 +1,4 @@
+> 1%
+last 2 versions
+not dead
+not ie 11
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -2,19 +2,35 @@ const isProduction = process.env.NODE_ENV === 'production'
 
 module.exports = {
   root: true,
+  extends: [
+    'plugin:vue/vue3-recommended'
+  ],
   parserOptions: {
-    parser: 'babel-eslint',
+    parser: '@babel/eslint-parser',
     sourceType: 'module'
   },
-  extends: ['standard', 'plugin:vue/recommended'],
-  plugins: ['vue'],
-  overrides: [{
-    files: ['**/*.spec.js'],
-    plugins: ['jest'],
-    env: {
-      jest: true
+  overrides: [
+    {
+      files: [
+        '**/*.spec.js'
+      ],
+      plugins: [
+        'jest'
+      ],
+      env: {
+        jest: true
+      }
+    },
+    {
+      files: [
+        '**/__tests__/*.{j,t}s?(x)',
+        '**/tests/unit/**/*.spec.{j,t}s?(x)'
+      ],
+      env: {
+        jest: true
+      }
     }
-  }],
+  ],
   rules: {
     'arrow-parens': 'off',
     'generator-star-spacing': 'off',

diff --git a/README.md b/README.md
@@ -5,7 +5,7 @@
 [![github license](https://badgen.net/github/license/dafrok/v-hotkey)](https://github.com/dafrok/v-hotkey/blob/master/LICENSE)
 [![js standard style](https://badgen.net/badge/code%20style/standard/pink)](https://standardjs.com)
 
-Vue 2.x directive for binding hotkeys to components.
+Vue 3.x directive for binding hotkeys to components.
 
 ## Play with me
 
@@ -22,10 +22,14 @@ $ yarn add v-hotkey
 ## Usage
 
 ```javascript
-import Vue from 'vue'
+import { createApp } from 'vue'
 import VueHotkey from 'v-hotkey'
 
-Vue.use(VueHotkey)
+const app = createApp({
+  /* ... */
+})
+app.use(VueHotkey)
+
 ```
 
 ```vue
@@ -119,10 +123,13 @@ This ability to provide their own key code alias for developers who using keyboa
 ### Definition
 
 ```javascript
-import Vue from 'vue'
+import { createApp } from 'vue'
 import VueHotkey from 'v-hotkey'
 
-Vue.use(VueHotkey, {
+const app = createApp({
+  /* ... */
+})
+app.use(VueHotkey, {
   '①': 49 // the key code of character '1'
 })
 ```
@@ -133,13 +140,15 @@ Vue.use(VueHotkey, {
 <span v-hotkey="keymap"></span>
 <script>
 export default {
-  foo () {
-    console.log('Hooray!')
+  methods: {
+    foo () {
+      console.log('Hooray!')
+    },
   },
   computed: {
     keymap () {
       return {
-        '①': foo
+        '①': this.foo
       }
     }
   }

diff --git a/babel.config.js b/babel.config.js
@@ -1,5 +1,5 @@
-'use strict'
-
 module.exports = {
-  presets: ['@babel/preset-env']
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
 }
diff --git a/docs/css/chunk-vendors.023d53d0.css b/docs/css/chunk-vendors.023d53d0.css
diff --git a/docs/css/chunk-vendors.aa245b99.css b/docs/css/chunk-vendors.aa245b99.css
diff --git a/docs/css/index.3233b882.css b/docs/css/index.3233b882.css
diff --git a/docs/css/index.a639c980.css b/docs/css/index.a639c980.css
diff --git a/docs/favicon.ico b/docs/favicon.ico
diff --git a/docs/img/bg.b458a270.jpg → docs/img/bg.406dcc74.jpg b/docs/img/bg.b458a270.jpg → docs/img/bg.406dcc74.jpg
diff --git a/docs/index.html b/docs/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta content="ie=edge" http-equiv=x-ua-compatible><title>V-Hotkey</title><link href=/v-hotkey/css/chunk-vendors.aa245b99.css rel=stylesheet><link href=/v-hotkey/css/index.a639c980.css rel=stylesheet></head><body><div id=app></div><script src=/v-hotkey/js/chunk-vendors.6c30874f.js></script><script src=/v-hotkey/js/index.91841365.js></script></body></html>
+<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/v-hotkey/favicon.ico"><title>V-Hotkey</title><script defer="defer" src="/v-hotkey/js/chunk-vendors.45213b80.js"></script><script defer="defer" src="/v-hotkey/js/index.f64fdb76.js"></script><link href="/v-hotkey/css/chunk-vendors.023d53d0.css" rel="stylesheet"><link href="/v-hotkey/css/index.3233b882.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but V-Hotkey doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
diff --git a/docs/js/chunk-vendors.45213b80.js b/docs/js/chunk-vendors.45213b80.js
diff --git a/docs/js/chunk-vendors.45213b80.js.map b/docs/js/chunk-vendors.45213b80.js.map
diff --git a/docs/js/chunk-vendors.6c30874f.js b/docs/js/chunk-vendors.6c30874f.js
diff --git a/docs/js/chunk-vendors.6c30874f.js.map b/docs/js/chunk-vendors.6c30874f.js.map
diff --git a/docs/js/index.91841365.js b/docs/js/index.91841365.js
diff --git a/docs/js/index.91841365.js.map b/docs/js/index.91841365.js.map
diff --git a/docs/js/index.f64fdb76.js b/docs/js/index.f64fdb76.js
diff --git a/docs/js/index.f64fdb76.js.map b/docs/js/index.f64fdb76.js.map
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta content="ie=edge" http-equiv=x-ua-compatible><title>V-Hotkey</title><link href=/v-hotkey/css/chunk-vendors.aa245b99.css rel=stylesheet><link href=/v-hotkey/css/index.a639c980.css rel=stylesheet></head><body><div id=app></div><script src=/v-hotkey/js/chunk-vendors.6c30874f.js></script><script src=/v-hotkey/js/index.91841365.js></script></body></html>
		<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/v-hotkey/favicon.ico"><title>V-Hotkey</title><script defer="defer" src="/v-hotkey/js/chunk-vendors.45213b80.js"></script><script defer="defer" src="/v-hotkey/js/index.f64fdb76.js"></script><link href="/v-hotkey/css/chunk-vendors.023d53d0.css" rel="stylesheet"><link href="/v-hotkey/css/index.3233b882.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but V-Hotkey doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>