Merge branch 'master' into dev

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vuetify",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "author": {
     "name": "John Leider",
     "email": "john@vuetifyjs.com"

src/components/VBreadcrumbs/VBreadcrumbs.js

@@ -0,0 +1,88 @@
+import '../../stylus/components/_breadcrumbs.styl'
+import Themeable from '../../mixins/themeable'
+
+/* @vue/component */
+export default {
+  name: 'v-breadcrumbs',
+
+  mixins: [Themeable],
+
+  props: {
+    divider: {
+      type: String,
+      default: '/'
+    },
+    large: Boolean,
+    justifyCenter: Boolean,
+    justifyEnd: Boolean
+  },
+
+  computed: {
+    classes () {
+      return {
+        'v-breadcrumbs--large': this.large,
+        ...this.themeClasses
+      }
+    },
+    computedDivider () {
+      return this.$slots.divider
+        ? this.$slots.divider
+        : this.divider
+    },
+    styles () {
+      const justify = this.justifyCenter
+        ? 'center'
+        : this.justifyEnd
+          ? 'flex-end'
+          : 'flex-start'
+
+      return {
+        'justify-content': justify
+      }
+    }
+  },
+
+  methods: {
+    /**
+     * Add dividers between
+     * v-breadcrumbs-item
+     *
+     * @return {array}
+     */
+    genChildren () {
+      if (!this.$slots.default) return null
+
+      const h = this.$createElement
+      const children = []
+      const dividerData = { staticClass: 'v-breadcrumbs__divider' }
+
+      let createDividers = false
+      for (let i = 0; i < this.$slots.default.length; i++) {
+        const elm = this.$slots.default[i]
+
+        if (
+          !elm.componentOptions ||
+          elm.componentOptions.Ctor.options.name !== 'v-breadcrumbs-item'
+        ) {
+          children.push(elm)
+        } else {
+          if (createDividers) {
+            children.push(h('li', dividerData, this.computedDivider))
+          }
+          children.push(elm)
+          createDividers = true
+        }
+      }
+
+      return children
+    }
+  },
+
+  render (h) {
+    return h('ul', {
+      staticClass: 'v-breadcrumbs',
+      'class': this.classes,
+      style: this.styles
+    }, this.genChildren())
+  }
+}

src/components/VCombobox/VCombobox.js

@@ -89,9 +89,15 @@ export default {
     },
     // Requires a manual definition
     // to overwrite removal in v-autocomplete
-    onEnterDown () {
-      this.updateSelf()
+    onEnterDown (e) {
+      e.preventDefault()
+
       VSelect.methods.onEnterDown.call(this)
+
+      // If has menu index, let v-select-list handle
+      if (this.getMenuIndex() > -1) return
+
+      this.updateSelf()
     },
     onKeyDown (e) {
       const keyCode = e.keyCode

src/components/VDialog/VDialog.js

@@ -13,7 +13,7 @@ import ClickOutside from '../../directives/click-outside'
 
 // Helpers
 import { getZIndex, convertToUnit } from '../../util/helpers'
-import SlotProvider from '../../util/SlotProvider'
+import ThemeProvider from '../../util/ThemeProvider'
 
 /* @vue/component */
 export default {
@@ -218,11 +218,9 @@ export default {
       style: { zIndex: this.activeZIndex },
       ref: 'content'
     }, [
-      this.$createElement(SlotProvider, {
+      this.$createElement(ThemeProvider, {
         props: {
-          provide: {
-            theme: { isDark: this.$vuetify.dark || this.dark }
-          }
+          dark: this.$vuetify.dark || this.dark
         }
       }, [dialog])
     ]))

src/components/VImg/VImg.ts

@@ -38,7 +38,7 @@ export default VResponsive.extend({
       default: 'center center'
     },
     transition: {
-      type: String,
+      type: [Boolean, String],
       default: 'fade-transition'
     }
   },
@@ -80,26 +80,28 @@ export default VResponsive.extend({
       if (this.gradient) backgroundImage.push(`linear-gradient(${this.gradient})`)
       if (src) backgroundImage.push(`url("${src}")`)
 
+      const image = this.$createElement('div', {
+        staticClass: 'v-image__image',
+        class: {
+          'v-image__image--preload': this.isLoading,
+          'v-image__image--contain': this.contain,
+          'v-image__image--cover': !this.contain
+        },
+        style: {
+          backgroundImage: backgroundImage.join(', '),
+          backgroundPosition: this.position
+        },
+        key: +this.isLoading
+      })
+
+      if (!this.transition) return image
+
       return this.$createElement('transition', {
         attrs: {
           name: this.transition,
           mode: 'in-out'
         }
-      }, [
-        this.$createElement('div', {
-          staticClass: 'v-image__image',
-          class: {
-            'v-image__image--preload': this.isLoading,
-            'v-image__image--contain': this.contain,
-            'v-image__image--cover': !this.contain
-          },
-          style: {
-            backgroundImage: backgroundImage.join(', '),
-            backgroundPosition: this.position
-          },
-          key: +this.isLoading
-        })
-      ])
+      }, [image])
     }
   },
 
@@ -186,13 +188,17 @@ export default VResponsive.extend({
     },
     __genPlaceholder (): VNode | void {
       if (this.$slots.placeholder) {
-        const placeholder = this.$createElement('div', {
-          staticClass: 'v-image__placeholder'
-        }, this.$slots.placeholder)
+        const placeholder = this.isLoading
+          ? [this.$createElement('div', {
+            staticClass: 'v-image__placeholder'
+          }, this.$slots.placeholder)]
+          : []
+
+        if (!this.transition) return placeholder[0]
 
         return this.$createElement('transition', {
           attrs: { name: this.transition }
-        }, this.isLoading ? [placeholder] : [])
+        }, placeholder)
       }
     }
   },

src/components/VList/VListTileAction.js

@@ -6,7 +6,10 @@ export default {
 
   render (h, { data, children }) {
     data.staticClass = data.staticClass ? `v-list__tile__action ${data.staticClass}` : 'v-list__tile__action'
-    if ((children || []).length > 1) data.staticClass += ' v-list__tile__action--stack'
+    const filteredChild = children.filter(VNode => {
+      return VNode.isComment === false && VNode.text !== ' '
+    })
+    if (filteredChild.length > 1) data.staticClass += ' v-list__tile__action--stack'
 
     return h('div', data, children)
   }

src/components/VMenu/VMenu.js

@@ -22,7 +22,7 @@ import Resize from '../../directives/resize'
 
 // Helpers
 import { convertToUnit } from '../../util/helpers'
-import SlotProvider from '../../util/SlotProvider'
+import ThemeProvider from '../../util/ThemeProvider'
 
 /* @vue/component */
 export default Vue.extend({
@@ -205,11 +205,9 @@ export default Vue.extend({
 
     return h('div', data, [
       this.genActivator(),
-      this.$createElement(SlotProvider, {
+      this.$createElement(ThemeProvider, {
         props: {
-          provide: {
-            theme: { isDark: this.$vuetify.dark || this.dark }
-          }
+          dark: this.$vuetify.dark || this.dark
         }
       }, [this.genTransition()])
     ])

src/components/VSelect/VSelect.js

@@ -566,7 +566,7 @@ export default {
       if (this.isMenuActive && this.$refs.menu) this.$refs.menu.changeListIndex(e)
 
       // This should do something different
-      if (keyCode === keyCodes.enter) return this.onEnterDown()
+      if (keyCode === keyCodes.enter) return this.onEnterDown(e)
 
       // If escape deactivate the menu
       if (keyCode === keyCodes.esc) return this.onEscDown(e)

src/components/VSlider/VSlider.js

@@ -402,15 +402,15 @@ export default {
 
       if ('touches' in e) {
         this.app.addEventListener('touchmove', this.onMouseMove, options)
-        addOnceEventListener(this.app, 'touchend', this.onMouseUp)
+        addOnceEventListener(this.app, 'touchend', this.onSliderMouseUp)
       } else {
         this.app.addEventListener('mousemove', this.onMouseMove, options)
-        addOnceEventListener(this.app, 'mouseup', this.onMouseUp)
+        addOnceEventListener(this.app, 'mouseup', this.onSliderMouseUp)
       }
 
       this.$emit('start', this.internalValue)
     },
-    onMouseUp () {
+    onSliderMouseUp () {
       this.keyPressed = 0
       const options = { passive: true }
       this.isActive = false

src/components/VStepper/VStepper.js

@@ -10,7 +10,8 @@ export default {
 
   provide () {
     return {
-      stepClick: this.stepClick
+      stepClick: this.stepClick,
+      isVertical: this.vertical
     }
   },
 

src/components/VStepper/VStepperContent.js

@@ -10,6 +10,12 @@ import { convertToUnit } from '../../util/helpers'
 export default {
   name: 'v-stepper-content',
 
+  inject: {
+    isVerticalProvided: {
+      from: 'isVertical'
+    }
+  },
+
   props: {
     step: {
       type: [Number, String],
@@ -24,7 +30,7 @@ export default {
       // previous comparison
       isActive: null,
       isReverse: false,
-      isVertical: false
+      isVertical: this.isVerticalProvided
     }
   },
 

src/stylus/components/_selection-controls.styl

@@ -42,11 +42,15 @@ rtl(v-selection-control-rtl, "v-input--selection-controls")
     input
       position: absolute
       opacity: 0
+      width: 100%
+      height: 100%
+      cursor: pointer
+      user-select: none
 
     // Sibling selector to avoid targeting v-radio-group's label
     & + .v-label
-      user-select: none
       cursor: pointer
+      user-select: none
 
   &__ripple
     cursor: pointer

src/util/ThemeProvider.ts

@@ -0,0 +1,12 @@
+import { VNode } from 'vue'
+import Themeable from '../mixins/themeable'
+import mixins from './mixins'
+
+/* @vue/component */
+export default mixins(Themeable).extend({
+  name: 'theme-provider',
+
+  render (): VNode {
+    return this.$slots.default! && this.$slots.default.find(node => !node.isComment && node.text !== ' ')!
+  }
+})