fix(MdListItem): allow multiple actions (#1760)

Samuell1 · web-flow · commit 714ee9f6b7b4 · 2018-06-11T13:22:39.000+02:00
* fix(MdListItem): allow multiple actions

* refactor(MdListItem): refactor hasChildrenButtons function

* refactor(MdListItem): remove const

* feat(MdListItem): remove prefixed user-select
diff --git a/src/components/MdList/MdListItem/MdListItem.vue b/src/components/MdList/MdListItem/MdListItem.vue
@@ -2,6 +2,7 @@
   import MdInteractionEvents from 'core/utils/MdInteractionEvents'
   import MdRouterLinkProps from 'core/utils/MdRouterLinkProps'
   import MdListItemDefault from './MdListItemDefault'
+  import MdListItemFakeButton from './MdListItemFakeButton'
   import MdListItemButton from './MdListItemButton'
   import MdListItemLink from './MdListItemLink'
   import MdListItemRouter from './MdListItemRouter'
@@ -22,6 +23,10 @@
     }
   }
 
+  function hasChildrenButtons (childrens) {
+    return childrens.default.some(children => children.componentOptions && children.componentOptions.tag === 'md-button')
+  }
+
   function shouldRenderButtonWithListener (listeners) {
     let listenerNames = Object.keys(listeners)
     let shouldRender = false
@@ -39,7 +44,7 @@
     return parent && parent.$router && props.to
   }
 
-  function createListComponent (props, parent, listeners) {
+  function createListComponent (props, parent, listeners, children) {
     if (hasExpansion(props)) {
       return MdListItemExpand
     }
@@ -62,6 +67,9 @@
     }
 
     if (shouldRenderButtonWithListener(listeners)) {
+      if (hasChildrenButtons(children)) {
+        return MdListItemFakeButton
+      }
       return MdListItemButton
     }
 
@@ -76,7 +84,7 @@
     },
     render (createElement, { parent, props, listeners, data, slots }) {
       let children = slots()
-      let listComponent = createListComponent(props, parent, listeners)
+      let listComponent = createListComponent(props, parent, listeners, children)
       let staticClass = 'md-list-item'
 
       if (data.staticClass) {
diff --git a/src/components/MdList/MdListItem/MdListItemFakeButton.vue b/src/components/MdList/MdListItem/MdListItemFakeButton.vue
@@ -0,0 +1,16 @@
+<template>
+  <div class="md-list-item-fake-button" :disabled="disabled">
+    <md-list-item-content :md-disabled="isDisabled">
+      <slot />
+    </md-list-item-content>
+  </div>
+</template>
+
+<script>
+  import MdListItemMixin from './MdListItemMixin'
+
+  export default {
+    name: 'MdListItemFakeButton',
+    mixins: [MdListItemMixin]
+  }
+</script>
