@vue-interface/dropdown-menu 2.0.0-beta.3 → 2.0.0-beta.5

package/dist/dropdown-menu.es.js

@@ -1,41 +1,24 @@
-import { h as d, resolveComponent as m, openBlock as u, createElementBlock as f, normalizeClass as w, createVNode as h, withCtx as y, renderSlot as g } from "vue";
-function s(e, t) {
-  e.props.class = `${e.props.class || ""} ${t}`.trim();
+import { h as i, Fragment as l, resolveComponent as c, openBlock as m, createElementBlock as f, normalizeClass as u, createVNode as w, withCtx as h, renderSlot as g } from "vue";
+function s(e, o) {
+  e.props.class = `${e.props.class || ""} ${o}`.trim();
 }
-function i(e, t) {
-  return (n) => {
-    typeof t == "function" && t(n), n.cancelBubble || e(n);
-  };
-}
-function p(e, t) {
-  return e.attrs.on[t] || e.type && e.type.listeners && e.componentOptions.listeners[t];
-}
-function _(e) {
-  return e && e.type && (e.type === "fragment" || typeof e.type == "symbol");
-}
-function a(e) {
-  for (const t of e) {
-    if (_(t))
-      return a(t.children);
-    t.props = Object.assign({ class: void 0 }, t.props), t.attrs = Object.assign({}, t.attrs), t.attrs.on || (t.attrs.on = {});
-    const n = t.props.class && t.props.class.match(/dropdown-item/), r = t.props.class && t.props.class.match(/dropdown-divider/);
-    t.attrs.on.click = i((o) => {
-      context.parent.$emit("click-item", o, t);
-    }, p(t, "click")), t.attrs.on.blur = i((o) => {
-      context.parent.$emit("blur-item", o, t);
-    }, p(t, "blur")), typeof t.type == "string" && t.type.match(/^h\d$/) ? s(t, "dropdown-header") : t.type === "hr" && !r ? (t.type = "div", s(t, "dropdown-divider")) : !n && !r && s(t, "dropdown-item");
+function d(e) {
+  for (const o of e) {
+    o.type === l && d(o.children), o.props = Object.assign({ class: void 0 }, o.props), o.attrs = Object.assign({}, o.attrs), o.attrs.on || (o.attrs.on = {});
+    const n = o.props.class && o.props.class.match(/dropdown-item/), t = o.props.class && o.props.class.match(/dropdown-divider/);
+    typeof o.type == "string" && o.type.match(/^h\d$/) ? s(o, "dropdown-header") : o.type === "hr" && !t ? (o.type = "div", s(o, "dropdown-divider")) : !n && !t && s(o, "dropdown-item");
   }
   return e;
 }
-const b = (e, t) => d("div", {}, a(t.slots.default())), $ = b, k = (e, t) => {
+const _ = (e, o) => i("div", {}, d(o.slots.default())), v = _, y = (e, o) => {
   const n = e.__vccOpts || e;
-  for (const [r, o] of t)
-    n[r] = o;
+  for (const [t, r] of o)
+    n[t] = r;
   return n;
 }, C = {
   name: "DropdownMenu",
   components: {
-    DropdownMenuItems: $
+    DropdownMenuItems: v
   },
   props: {
     align: {
@@ -48,27 +31,27 @@ const b = (e, t) => d("div", {}, a(t.slots.default())), $ = b, k = (e, t) => {
     show: Boolean
   }
 }, D = ["aria-labelledby"];
-function I(e, t, n, r, o, M) {
-  const l = m("dropdown-menu-items");
-  return u(), f("div", {
-    class: w(["dropdown-menu", {
+function $(e, o, n, t, r, b) {
+  const p = c("dropdown-menu-items");
+  return m(), f("div", {
+    class: u(["dropdown-menu", {
       "dropdown-menu-left": n.align === "left",
       "dropdown-menu-right": n.align === "right",
       show: n.show
     }]),
     "aria-labelledby": e.$attrs.id
   }, [
-    h(l, null, {
-      default: y(() => [
+    w(p, null, {
+      default: h(() => [
         g(e.$slots, "default", {
-          onClick: t[0] || (t[0] = (...c) => e.onItemClick && e.onItemClick(...c))
+          onClick: o[0] || (o[0] = (...a) => e.onItemClick && e.onItemClick(...a))
         })
       ]),
       _: 3
     })
   ], 10, D);
 }
-const v = /* @__PURE__ */ k(C, [["render", I]]);
+const I = /* @__PURE__ */ y(C, [["render", $]]);
 export {
-  v as DropdownMenu
+  I as DropdownMenu
 };

package/dist/dropdown-menu.umd.js

@@ -1 +1 @@
-(function(r,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(r=typeof globalThis<"u"?globalThis:r||self,n(r.DropdownMenu={},r.Vue))})(this,function(r,n){"use strict";function p(t,e){t.props.class=`${t.props.class||""} ${e}`.trim()}function d(t,e){return o=>{typeof e=="function"&&e(o),o.cancelBubble||t(o)}}function l(t,e){return t.attrs.on[e]||t.type&&t.type.listeners&&t.componentOptions.listeners[e]}function c(t){return t&&t.type&&(t.type==="fragment"||typeof t.type=="symbol")}function a(t){for(const e of t){if(c(e))return a(e.children);e.props=Object.assign({class:void 0},e.props),e.attrs=Object.assign({},e.attrs),e.attrs.on||(e.attrs.on={});const o=e.props.class&&e.props.class.match(/dropdown-item/),i=e.props.class&&e.props.class.match(/dropdown-divider/);e.attrs.on.click=d(s=>{context.parent.$emit("click-item",s,e)},l(e,"click")),e.attrs.on.blur=d(s=>{context.parent.$emit("blur-item",s,e)},l(e,"blur")),typeof e.type=="string"&&e.type.match(/^h\d$/)?p(e,"dropdown-header"):e.type==="hr"&&!i?(e.type="div",p(e,"dropdown-divider")):!o&&!i&&p(e,"dropdown-item")}return t}const u=(t,e)=>n.h("div",{},a(e.slots.default())),f=(t,e)=>{const o=t.__vccOpts||t;for(const[i,s]of e)o[i]=s;return o},m={name:"DropdownMenu",components:{DropdownMenuItems:u},props:{align:{type:String,default:"left",validate(t){return["left","right"].indexOf(t.toLowerCase())!==-1}},show:Boolean}},w=["aria-labelledby"];function h(t,e,o,i,s,D){const g=n.resolveComponent("dropdown-menu-items");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["dropdown-menu",{"dropdown-menu-left":o.align==="left","dropdown-menu-right":o.align==="right",show:o.show}]),"aria-labelledby":t.$attrs.id},[n.createVNode(g,null,{default:n.withCtx(()=>[n.renderSlot(t.$slots,"default",{onClick:e[0]||(e[0]=(..._)=>t.onItemClick&&t.onItemClick(..._))})]),_:3})],10,w)}const y=f(m,[["render",h]]);r.DropdownMenu=y,Object.defineProperties(r,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(s,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(s=typeof globalThis<"u"?globalThis:s||self,n(s.DropdownMenu={},s.Vue))})(this,function(s,n){"use strict";function d(o,e){o.props.class=`${o.props.class||""} ${e}`.trim()}function i(o){for(const e of o){e.type===n.Fragment&&i(e.children),e.props=Object.assign({class:void 0},e.props),e.attrs=Object.assign({},e.attrs),e.attrs.on||(e.attrs.on={});const t=e.props.class&&e.props.class.match(/dropdown-item/),r=e.props.class&&e.props.class.match(/dropdown-divider/);typeof e.type=="string"&&e.type.match(/^h\d$/)?d(e,"dropdown-header"):e.type==="hr"&&!r?(e.type="div",d(e,"dropdown-divider")):!t&&!r&&d(e,"dropdown-item")}return o}const a=(o,e)=>n.h("div",{},i(e.slots.default())),l=(o,e)=>{const t=o.__vccOpts||o;for(const[r,p]of e)t[r]=p;return t},c={name:"DropdownMenu",components:{DropdownMenuItems:a},props:{align:{type:String,default:"left",validate(o){return["left","right"].indexOf(o.toLowerCase())!==-1}},show:Boolean}},f=["aria-labelledby"];function u(o,e,t,r,p,g){const w=n.resolveComponent("dropdown-menu-items");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["dropdown-menu",{"dropdown-menu-left":t.align==="left","dropdown-menu-right":t.align==="right",show:t.show}]),"aria-labelledby":o.$attrs.id},[n.createVNode(w,null,{default:n.withCtx(()=>[n.renderSlot(o.$slots,"default",{onClick:e[0]||(e[0]=(...h)=>o.onItemClick&&o.onItemClick(...h))})]),_:3})],10,f)}const m=l(c,[["render",u]]);s.DropdownMenu=m,Object.defineProperties(s,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-interface/dropdown-menu",
-  "version": "2.0.0-beta.3",
+  "version": "2.0.0-beta.5",
   "description": "A Vue dropdown menu component.",
   "files": [
     "index.js",

package/src/DropdownMenuItems.vue

@@ -1,44 +1,14 @@
 <script>
-import { h, isVNode } from 'vue';
+import { Fragment, h } from 'vue';
 
 function appendClass(vnode, str) {
     vnode.props.class = `${vnode.props.class || ''} ${str}`.trim();
 }
 
-function wrap(wrapper, fn) {
-    return (e) => {
-        if(typeof fn === 'function') {
-            fn(e);
-        }
-
-        if(!e.cancelBubble) {
-            wrapper(e);
-        }
-    };
-}
-
-function listener(vnode, key) {
-    return vnode.attrs.on[key] || (
-        vnode.type &&
-        vnode.type.listeners &&
-        vnode.componentOptions.listeners[key]
-    );
-}
-
-function isDropdownItem(vnode) {
-    return vnode && vnode.type && vnode.type.name === 'DropdownItem';
-}
-
-function isFragment(vnode) {
-    // We'll go ahead and assume that if the type is a symbol, then the vnode is fragment.
-    // This may be a faulty assumption; if it is, it'll need to be changed.
-    return vnode && vnode.type && (vnode.type === 'fragment' || typeof vnode.type === 'symbol');
-}
-
-function changeMenuItems(items) {    
+function changeMenuItems(items) {
     for(const vnode of items) {
-        if(isFragment(vnode)) {
-            return changeMenuItems(vnode.children);
+        if(vnode.type === Fragment) {
+            changeMenuItems(vnode.children);
         }
 
         vnode.props = Object.assign({ class: undefined }, vnode.props);
@@ -51,14 +21,6 @@ function changeMenuItems(items) {
         const isDropdownItem = vnode.props.class && vnode.props.class.match(/dropdown-item/);
         const isDropdownDivider = vnode.props.class && vnode.props.class.match(/dropdown-divider/);
 
-        vnode.attrs.on.click = wrap(e => {
-            context.parent.$emit('click-item', e, vnode);
-        }, listener(vnode, 'click'));
-
-        vnode.attrs.on.blur = wrap(e => {
-            context.parent.$emit('blur-item', e, vnode);
-        }, listener(vnode, 'blur'));
-
         if(typeof vnode.type === 'string' && vnode.type.match(/^h\d$/)) {
             appendClass(vnode, 'dropdown-header');
         }