vue-simple-context-menu - npm Package Compare versions

Comparing version 3.1.2 to 3.1.3

CHANGELOG.md

 # CHANGELOG.md
 
+## 3.1.3
+- Fixing emitting to use kebab-case
+
 ## 3.1.2
@@ -4,0 +7,0 @@ - Build update to properly allow for iife build.

dist/vue-simple-context-menu.esm.js

@@ -68,3 +68,3 @@ import Vue from 'vue';
             this.hideContextMenu();
-            this.$emit('optionClicked', {
+            this.$emit('option-clicked', {
                 item: this.item,
@@ -71,0 +71,0 @@ option: option

dist/vue-simple-context-menu.min.js

@@ -1,1 +0,1 @@
-var VueSimpleContextMenu=function(e,n){"use strict";n=n&&n.hasOwnProperty("default")?n.default:n;"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self&&self;var t,i=(function(e,n){e.exports=function(){var e="undefined"!=typeof window&&("ontouchstart"in window||navigator.msMaxTouchPoints>0)?["touchstart","click"]:["click"],n=[];function t(n){var t="function"==typeof n;if(!t&&"object"!=typeof n)throw new Error("v-click-outside: Binding value must be a function or an object");return{handler:t?n:n.handler,middleware:n.middleware||function(e){return e},events:n.events||e}}function i(e){var n=e.el,t=e.event,i=e.handler,o=e.middleware;t.target!==n&&!n.contains(t.target)&&o(t,n)&&i(t,n)}var o={bind:function(e,o){var r=t(o.value),d=r.handler,u=r.middleware,s={el:e,eventHandlers:r.events.map(function(n){return{event:n,handler:function(n){return i({event:n,el:e,handler:d,middleware:u})}}})};s.eventHandlers.forEach(function(e){return document.addEventListener(e.event,e.handler)}),n.push(s)},update:function(e,o){var r=t(o.value),d=r.handler,u=r.middleware,s=r.events,l=n.find(function(n){return n.el===e});l.eventHandlers.forEach(function(e){return document.removeEventListener(e.event,e.handler)}),l.eventHandlers=s.map(function(n){return{event:n,handler:function(n){return i({event:n,el:e,handler:d,middleware:u})}}}),l.eventHandlers.forEach(function(e){return document.addEventListener(e.event,e.handler)})},unbind:function(e){n.find(function(n){return n.el===e}).eventHandlers.forEach(function(e){return document.removeEventListener(e.event,e.handler)})},instances:n};return{install:function(e){e.directive("click-outside",o)},directive:o}}()}(t={exports:{}},t.exports),t.exports);n.use(i);var o=function(e,n,t,i,o,r,d,u,s,l){"boolean"!=typeof d&&(s=u,u=d,d=!1);var a,c="function"==typeof t?t.options:t;if(e&&e.render&&(c.render=e.render,c.staticRenderFns=e.staticRenderFns,c._compiled=!0,o&&(c.functional=!0)),i&&(c._scopeId=i),r?(a=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,s(e)),e&&e._registeredComponents&&e._registeredComponents.add(r)},c._ssrRegister=a):n&&(a=d?function(){n.call(this,l(this.$root.$options.shadowRoot))}:function(e){n.call(this,u(e))}),a)if(c.functional){var f=c.render;c.render=function(e,n){return a.call(n),f(e,n)}}else{var v=c.beforeCreate;c.beforeCreate=v?[].concat(v,a):[a]}return t},r={name:"VueSimpleContextMenu",props:{elementId:{type:String,required:!0},options:{type:Array,required:!0}},data:function(){return{item:null,menuWidth:null,menuHeight:null}},methods:{showMenu:function(e,n){this.item=n;var t=document.getElementById(this.elementId);t&&(this.menuWidth&&this.menuHeight||(t.style.visibility="hidden",t.style.display="block",this.menuWidth=t.offsetWidth,this.menuHeight=t.offsetHeight,t.removeAttribute("style")),this.menuWidth+e.pageX>=window.innerWidth?t.style.left=e.pageX-this.menuWidth+2+"px":t.style.left=e.pageX-2+"px",this.menuHeight+e.pageY>=window.innerHeight?t.style.top=e.pageY-this.menuHeight+2+"px":t.style.top=e.pageY-2+"px",t.classList.add("vue-simple-context-menu--active"))},hideContextMenu:function(){var e=document.getElementById(this.elementId);e&&e.classList.remove("vue-simple-context-menu--active")},onClickOutside:function(){this.hideContextMenu()},optionClicked:function(e){this.hideContextMenu(),this.$emit("optionClicked",{item:this.item,option:e})}}},d=function(){var e=this,n=e.$createElement,t=e._self._c||n;return t("div",[t("ul",{directives:[{name:"click-outside",rawName:"v-click-outside",value:e.onClickOutside,expression:"onClickOutside"}],staticClass:"vue-simple-context-menu",attrs:{id:e.elementId}},e._l(e.options,function(n,i){return t("li",{key:i,staticClass:"vue-simple-context-menu__item",on:{click:function(t){return e.optionClicked(n)}}},[e._v("\n            "+e._s(n.name)+"\n        ")])}),0)])};d._withStripped=!0;var u=o({render:d,staticRenderFns:[]},void 0,r,void 0,!1,void 0,void 0,void 0);function s(e){s.installed||(s.installed=!0,e.component("VueSimpleContextMenu",u))}var l={install:s},a=null;return"undefined"!=typeof window?a=window.Vue:"undefined"!=typeof global&&(a=global.Vue),a&&a.use(l),e.install=s,e.default=u,e}({},Vue);
+var VueSimpleContextMenu=function(e,n){"use strict";n=n&&n.hasOwnProperty("default")?n.default:n;"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self&&self;var t,i=(function(e,n){e.exports=function(){var e="undefined"!=typeof window&&("ontouchstart"in window||navigator.msMaxTouchPoints>0)?["touchstart","click"]:["click"],n=[];function t(n){var t="function"==typeof n;if(!t&&"object"!=typeof n)throw new Error("v-click-outside: Binding value must be a function or an object");return{handler:t?n:n.handler,middleware:n.middleware||function(e){return e},events:n.events||e}}function i(e){var n=e.el,t=e.event,i=e.handler,o=e.middleware;t.target!==n&&!n.contains(t.target)&&o(t,n)&&i(t,n)}var o={bind:function(e,o){var r=t(o.value),d=r.handler,u=r.middleware,s={el:e,eventHandlers:r.events.map(function(n){return{event:n,handler:function(n){return i({event:n,el:e,handler:d,middleware:u})}}})};s.eventHandlers.forEach(function(e){return document.addEventListener(e.event,e.handler)}),n.push(s)},update:function(e,o){var r=t(o.value),d=r.handler,u=r.middleware,s=r.events,l=n.find(function(n){return n.el===e});l.eventHandlers.forEach(function(e){return document.removeEventListener(e.event,e.handler)}),l.eventHandlers=s.map(function(n){return{event:n,handler:function(n){return i({event:n,el:e,handler:d,middleware:u})}}}),l.eventHandlers.forEach(function(e){return document.addEventListener(e.event,e.handler)})},unbind:function(e){n.find(function(n){return n.el===e}).eventHandlers.forEach(function(e){return document.removeEventListener(e.event,e.handler)})},instances:n};return{install:function(e){e.directive("click-outside",o)},directive:o}}()}(t={exports:{}},t.exports),t.exports);n.use(i);var o=function(e,n,t,i,o,r,d,u,s,l){"boolean"!=typeof d&&(s=u,u=d,d=!1);var a,c="function"==typeof t?t.options:t;if(e&&e.render&&(c.render=e.render,c.staticRenderFns=e.staticRenderFns,c._compiled=!0,o&&(c.functional=!0)),i&&(c._scopeId=i),r?(a=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,s(e)),e&&e._registeredComponents&&e._registeredComponents.add(r)},c._ssrRegister=a):n&&(a=d?function(){n.call(this,l(this.$root.$options.shadowRoot))}:function(e){n.call(this,u(e))}),a)if(c.functional){var f=c.render;c.render=function(e,n){return a.call(n),f(e,n)}}else{var v=c.beforeCreate;c.beforeCreate=v?[].concat(v,a):[a]}return t},r={name:"VueSimpleContextMenu",props:{elementId:{type:String,required:!0},options:{type:Array,required:!0}},data:function(){return{item:null,menuWidth:null,menuHeight:null}},methods:{showMenu:function(e,n){this.item=n;var t=document.getElementById(this.elementId);t&&(this.menuWidth&&this.menuHeight||(t.style.visibility="hidden",t.style.display="block",this.menuWidth=t.offsetWidth,this.menuHeight=t.offsetHeight,t.removeAttribute("style")),this.menuWidth+e.pageX>=window.innerWidth?t.style.left=e.pageX-this.menuWidth+2+"px":t.style.left=e.pageX-2+"px",this.menuHeight+e.pageY>=window.innerHeight?t.style.top=e.pageY-this.menuHeight+2+"px":t.style.top=e.pageY-2+"px",t.classList.add("vue-simple-context-menu--active"))},hideContextMenu:function(){var e=document.getElementById(this.elementId);e&&e.classList.remove("vue-simple-context-menu--active")},onClickOutside:function(){this.hideContextMenu()},optionClicked:function(e){this.hideContextMenu(),this.$emit("option-clicked",{item:this.item,option:e})}}},d=function(){var e=this,n=e.$createElement,t=e._self._c||n;return t("div",[t("ul",{directives:[{name:"click-outside",rawName:"v-click-outside",value:e.onClickOutside,expression:"onClickOutside"}],staticClass:"vue-simple-context-menu",attrs:{id:e.elementId}},e._l(e.options,function(n,i){return t("li",{key:i,staticClass:"vue-simple-context-menu__item",on:{click:function(t){return e.optionClicked(n)}}},[e._v("\n            "+e._s(n.name)+"\n        ")])}),0)])};d._withStripped=!0;var u=o({render:d,staticRenderFns:[]},void 0,r,void 0,!1,void 0,void 0,void 0);function s(e){s.installed||(s.installed=!0,e.component("VueSimpleContextMenu",u))}var l={install:s},a=null;return"undefined"!=typeof window?a=window.Vue:"undefined"!=typeof global&&(a=global.Vue),a&&a.use(l),e.install=s,e.default=u,e}({},Vue);

dist/vue-simple-context-menu.umd.js

@@ -74,3 +74,3 @@ (function (global, factory) {
                 this.hideContextMenu();
-                this.$emit('optionClicked', {
+                this.$emit('option-clicked', {
                     item: this.item,
@@ -77,0 +77,0 @@ option: option

package.json

 {
   "name": "vue-simple-context-menu",
-  "version": "3.1.2",
+  "version": "3.1.3",
   "description": "Simple context-menu component built for Vue. Works well with both left and right clicks. Nothing too fancy, just works and is simple to use.",
@@ -5,0 +5,0 @@ "author": "John Datserakis <[e-mail]>",

README.md

@@ -76,3 +76,3 @@ # vue-simple-context-menu
     :ref="'vueSimpleContextMenu'"
-    @optionClicked="optionClicked">
+    @option-clicked="optionClicked">
 </vue-simple-context-menu>
@@ -113,3 +113,3 @@
 |---------|-------|--------------------------------|
-| optionClicked | Object | When a menu item is clicked the component will emit an event with a value containing the clicked item and the menu option that was clicked. Register for this event to capture the selection result. |
+| option-clicked | Object | When a menu item is clicked the component will emit an event with a value containing the clicked item and the menu option that was clicked. Register for this event to capture the selection result. |
 
@@ -116,0 +116,0 @@ ### SASS Structure

test/VueSimpleContextMenu.spec.js

@@ -115,4 +115,4 @@ import { shallowMount } from '@vue/test-utils'
         // Check the event was emitted properly
-        expect(wrapper.emitted().optionClicked).toBeTruthy()
+        expect(wrapper.emitted('option-clicked')).toBeTruthy()
     })
 })

No alert changes

Improved metrics

Total package byte prevSize

690274

increased by0.01%

No dependency changes