Accessibility (#22)

Author: rawilk

.editorconfig

@@ -9,4 +9,7 @@ indent_size = 4
 trim_trailing_whitespace = true
 
 [*.md]
-trim_trailing_whitespace = false
+trim_trailing_whitespace = false
+
+[*.scss]
+insert_final_newline = false

CHANGELOG.md

@@ -2,6 +2,25 @@
 
 All notable changes to this project will be documented here.
 
+<a name="4.0.0"></a>
+## [4.0.0](https://github.com/rawilk/vue-context/releases/tag/4.0.0)
+
+Released 2019-05-18
+
+### Added 4.0.0
+- Added support for keyboard navigation (up and down arrows).
+- Added ability to close menu on esc.
+- Added `lazy` prop as an alternative to `v-show`.
+- Added `tag` prop to specify menu tag (defaults to `<ul>`).
+
+### Changes 4.0.0
+- Default menu tag is now `<ul>` and menu is now the top-level element.
+- Changed how the menu is styled.
+
+### Updates 4.0.0
+- Updated build process and project structure.
+- Ran `npm audit fix` to fix vulnerabilities found from dependencies.
+
 <a name="3.4.2"></a>
 ## [3.4.2](https://github.com/rawilk/vue-context/releases/tag/3.4.2)
 
@@ -117,4 +136,4 @@ Released 2017-08-18
 
 Released 2017-08-17
 
-- Initial release
+- Initial release

CONTRIBUTING.md

@@ -85,6 +85,5 @@ Please follow these coding conventions when contributing to the project.
 hash arrows.
 - I leave an empty line between code and return statements.
 - I ALWAYS put spaces between properties in an object (`{ VueContext }`, not `{VueContext}`).
-- I always a function declaration and its parameters (`methodName ()`, not `methodName()`).
 - I always use single quotes over double quotes, unless it makes sense to use double quotes. If that's the case, I usually prefer to
 use template strings instead of double quotes (`` `${variable} some text that has a single quote ' in it` `` instead of `variable + " some text that has a single quote ' in it"`).

README.md

@@ -7,16 +7,12 @@
 [![VueJS version](https://img.shields.io/badge/vue.js-2.x-green.svg?style=for-the-badge)](https://vuejs.org)
 
 `vue-context` provides a simple yet flexible context menu for Vue. It is styled for the standard `<ul>` tag, but any menu template can be used.
-The menu is lightweight with its only dependency being `vue-clickaway`. The menu has some basic styles applied to it but they can be easily 
+The menu is lightweight with its only dependencies being `vue-clickaway` and `core-js`. The menu has some basic styles applied to it but they can be easily 
 overridden by your own styles.
 <br><br>
 The menu disappears when you expect by utilizing `vue-clickaway` and it also optionally disappears when clicked on.
 
-![Screenshot](screenshot.png)
-
-## Note
-The API has changed since the last major release. Check [v2 documentation](https://vue-context.com/docs/2.0/overview) 
-if you use the old version.
+![Screenshot](screenshot.jpg)
 
 ## Getting Started
 
@@ -63,10 +59,12 @@ Next add an element to the page that will trigger the context menu to appear, an
     </div>
 
     <vue-context ref="menu">
-        <ul>
-            <li @click="onClick($event.target.innerText)">Option 1</li>
-            <li @click="onClick($event.target.innerText)">Option 2</li>
-        </ul>
+        <li>
+            <a href="#" @click.prevent="onClick($event.target.innerText)">Option 1</a>
+        </li>
+        <li>
+            <a href="#" @click.prevent="onClick($event.target.innerText)">Option 2</a>
+        </li>
     </vue-context>
 
 </div>

build/webpack.mix.js

@@ -4,11 +4,11 @@ const inProduction = mix.inProduction();
 
 mix
     .setPublicPath('dist')
-    .js('src/index.js', 'vue-context.js')
+    .js('src/js/index.js', 'js/vue-context.js')
     .sourceMaps(! inProduction)
     .webpackConfig({
         output: {
             libraryTarget: 'umd',
             umdNamedDefine: true
         }
-    });
+    });