quasar - npm Package Compare versions

Comparing version 1.0.0-alpha.23 to 1.0.0-alpha.24

dist/api/QSelect.json

@@ -404,3 +404,3 @@ {
   "scopedSlots": {
-    "selected": {
+    "selected-item": {
       "desc": "Override default selection slot; Suggestion: QChip",
@@ -407,0 +407,0 @@ "scope": {

dist/babel-transforms/imports.js

@@ -154,2 +154,3 @@ const map = {
   "scroll": "src/utils/scroll.js",
+  "slot": "src/utils/slot.js",
   "throttle": "src/utils/throttle.js",
@@ -156,0 +157,0 @@ "uid": "src/utils/uid.js"

dist/icon-set/eva-icons.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/icon-set/fontawesome-v5-pro.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/icon-set/fontawesome-v5.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/icon-set/ionicons-v4.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/icon-set/material-icons.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/icon-set/mdi-v3.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/ar.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/bg.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/ca.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/cs.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/da.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/de.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/el.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/en-uk.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/en-us.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/es.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/fa-ir.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/fi.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/fr.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/gn.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/he.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/hr.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/hu.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/id.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/it.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/ja.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/ko-kr.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/lu.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/lv.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/ms.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/nb-no.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/nl.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/pl.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/pt-br.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/pt.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/ro.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/ru.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/sk.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/sl.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/sr.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/sv.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/th.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/tr.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/uk.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/vi.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/zh-hans.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/lang/zh-hant.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/quasar.ie.polyfills.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

dist/quasar.ie.polyfills.umd.min.js

 /*!
- * Quasar Framework v1.0.0-alpha.23
+ * Quasar Framework v1.0.0-alpha.24
  * (c) 2016-present Razvan Stoenescu
@@ -4,0 +4,0 @@ * Released under the MIT License.

package.json

 {
   "name": "quasar",
-  "version": "1.0.0-alpha.23",
+  "version": "1.0.0-alpha.24",
   "description": "Build responsive SPA, SSR, PWA, Hybrid Mobile Apps and Electron apps, all simultaneously using the same codebase",
@@ -94,9 +94,9 @@ "module": "src/index.esm.js",
     "url-loader": "^1.0.1",
-    "vue": "^2.5.22",
+    "vue": "^2.6.2",
     "vue-loader": "^15.6.2",
     "vue-router": "^3.0.2",
-    "vue-server-renderer": "^2.5.22",
+    "vue-server-renderer": "^2.6.2",
     "vue-style-loader": "^4.1.2",
-    "vue-template-compiler": "^2.5.22",
-    "webpack": "^4.29.0",
+    "vue-template-compiler": "^2.6.2",
+    "webpack": "^4.29.1",
     "webpack-chain": "^4.8.0",
@@ -103,0 +103,0 @@ "webpack-dev-middleware": "^3.5.1",

src/components/avatar/QAvatar.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 import QIcon from '../icon/QIcon.js'
@@ -45,5 +47,5 @@
     __getContent (h) {
-      return this.icon
-        ? [ h(QIcon, { props: { name: this.icon } }) ].concat(this.$slots.default)
-        : this.$slots.default
+      return this.icon !== void 0
+        ? [ h(QIcon, { props: { name: this.icon } }) ].concat(slot(this, 'default'))
+        : slot(this, 'default')
     }
@@ -50,0 +52,0 @@ },

src/components/badge/QBadge.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -41,4 +43,4 @@ name: 'QBadge',
       class: this.classes
-    }, this.label !== void 0 ? [ this.label ] : this.$slots.default)
+    }, this.label !== void 0 ? [ this.label ] : slot(this, 'default'))
   }
 })

src/components/banner/QBanner.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -13,3 +15,3 @@ name: 'QBanner',
   render (h) {
-    const actions = this.$slots.action
+    const actions = slot(this, 'action')
 
@@ -27,7 +29,7 @@ return h('div', {
         staticClass: 'q-banner__avatar col-auto row items-center'
-      }, this.$slots.avatar),
+      }, slot(this, 'avatar')),
 
       h('div', {
         staticClass: 'q-banner__content col text-body2'
-      }, this.$slots.default),
+      }, slot(this, 'default')),
 
@@ -34,0 +36,0 @@ actions !== void 0

src/components/bar/QBar.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -21,4 +23,4 @@ name: 'QBar',
       class: this.classes
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/breadcrumbs/QBreadcrumbs.js

 import Vue from 'vue'
 
 import AlignMixin from '../../mixins/align.js'
+import slot from '../../utils/slot.js'
 
@@ -46,3 +47,4 @@ export default Vue.extend({
   render (h) {
-    if (!this.$slots.default) { return }
+    const node = slot(this, 'default')
+    if (node === void 0) { return }
 
@@ -53,7 +55,7 @@ let els = 1
       child = [],
-      len = this.$slots.default.filter(c => c.tag !== void 0 && c.tag.endsWith('-QBreadcrumbsEl')).length,
+      len = node.filter(c => c.tag !== void 0 && c.tag.endsWith('-QBreadcrumbsEl')).length,
       separator = this.$scopedSlots.separator || (() => this.separator)
 
-    for (const i in this.$slots.default) {
-      const comp = this.$slots.default[i]
+    for (const i in node) {
+      const comp = node[i]
       if (comp.tag !== void 0 && comp.tag.endsWith('-QBreadcrumbsEl')) {
@@ -71,3 +73,3 @@ const middle = els < len
             staticClass: 'q-breadcrumbs__separator', class: this.sepClass
-          }, [ separator() ]))
+          }, separator()))
         }
@@ -74,0 +76,0 @@ }

src/components/breadcrumbs/QBreadcrumbsEl.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 import QIcon from '../icon/QIcon.js'
@@ -32,4 +34,4 @@ import { RouterLinkMixin } from '../../mixins/router-link.js'
 
-    ].concat(this.$slots.default))
+    ].concat(slot(this, 'default')))
   }
 })

src/components/btn/QBtn.js

@@ -8,2 +8,3 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
 import { stopAndPrevent } from '../../utils/event.js'
@@ -81,3 +82,3 @@
     const
-      inner = [].concat(this.$slots.default),
+      inner = [].concat(slot(this, 'default')),
       data = {
@@ -152,3 +153,3 @@ staticClass: 'q-btn inline relative-position q-btn-item non-selectable',
             staticClass: 'absolute-full flex flex-center'
-          }, this.$slots.loading !== void 0 ? this.$slots.loading : [ h(QSpinner) ])
+          }, this.$scopedSlots.loading !== void 0 ? this.$scopedSlots.loading() : [ h(QSpinner) ])
         ] : void 0)
@@ -155,0 +156,0 @@ : null

src/components/btn/QBtnDropdown.js

@@ -10,2 +10,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -92,3 +94,3 @@ name: 'QBtnDropdown',
         }
-      }, this.$slots.default)
+      }, slot(this, 'default'))
     ]
@@ -95,0 +97,0 @@

src/components/btn/QBtnGroup.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -28,4 +30,4 @@ name: 'QBtnGroup',
       class: this.classes
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/card/QCard.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -23,4 +25,4 @@ name: 'QCard',
       }
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/card/QCardActions.js

@@ -5,2 +5,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -25,4 +27,4 @@ name: 'QCardActions',
       class: this.classes
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/card/QCardSection.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -9,4 +11,4 @@ name: 'QCardSection',
       staticClass: 'q-card__section relative-position'
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/carousel/QCarousel.js

@@ -6,2 +6,3 @@ import Vue from 'vue'
 import { isNumber } from '../../utils/is.js'
+import slot from '../../utils/slot.js'
 
@@ -164,19 +165,19 @@ export default Vue.extend({
 
-      return node.concat(this.$slots.control)
-    }
-  },
+      return node.concat(slot(this, 'control'))
+    },
 
-  render (h) {
-    return h('div', {
-      staticClass: 'q-carousel relative-position overflow-hidden',
-      class: this.classes
-    }, [
-      h('div', {
-        staticClass: 'q-carousel__slides-container',
-        style: this.style,
-        directives: this.panelDirectives
+    __render (h) {
+      return h('div', {
+        staticClass: 'q-carousel relative-position overflow-hidden',
+        class: this.classes
       }, [
-        this.__getPanelContent(h)
-      ])
-    ].concat(this.__getContent(h)))
+        h('div', {
+          staticClass: 'q-carousel__slides-container',
+          style: this.style,
+          directives: this.panelDirectives
+        }, [
+          this.__getPanelContent(h)
+        ])
+      ].concat(this.__getContent(h)))
+    }
   },
@@ -183,0 +184,0 @@

src/components/carousel/QCarouselControl.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -33,4 +35,4 @@ name: 'QCarouselControl',
       class: this.classes
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/carousel/QCarouselSlide.js

@@ -5,2 +5,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -31,4 +33,4 @@ name: 'QCarouselSlide',
       style: this.style
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/chat/QChatMessage.js

@@ -75,5 +75,4 @@ import Vue from 'vue'
           class: this.textClass
-        }, [
-          this.$slots.default,
-          this.stamp
+        }, this.$scopedSlots.default().concat([
+          this.stamp !== void 0
             ? h('div', {
@@ -84,3 +83,3 @@ staticClass: 'q-message-stamp',
             : null
-        ])
+        ]))
       ])
@@ -105,13 +104,15 @@ }
       }, [
-        this.$slots.avatar || (
-          this.avatar
-            ? h('img', {
-              staticClass: 'q-message-avatar col-auto',
-              attrs: { src: this.avatar }
-            })
-            : null
-        ),
+        this.$scopedSlots.avatar !== void 0
+          ? this.$scopedSlots.avatar()
+          : (
+            this.avatar !== void 0
+              ? h('img', {
+                staticClass: 'q-message-avatar col-auto',
+                attrs: { src: this.avatar }
+              })
+              : null
+          ),
 
         h('div', { class: this.sizeClass }, [
-          this.name
+          this.name !== void 0
             ? h('div', {
@@ -123,4 +124,4 @@ staticClass: 'q-message-name',
 
-          this.text ? this.__getText(h) : null,
-          this.$slots.default ? this.__getMessage(h) : null
+          this.text !== void 0 ? this.__getText(h) : null,
+          this.$scopedSlots.default !== void 0 ? this.__getMessage(h) : null
         ])
@@ -127,0 +128,0 @@ ])

src/components/checkbox/QCheckbox.js

@@ -5,2 +5,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -84,7 +86,9 @@ name: 'QCheckbox',
 
-      (this.label !== void 0 || this.$slots.default !== void 0) && h('div', {
-        staticClass: 'q-checkbox__label q-anchor--skip'
-      }, (this.label !== void 0 ? [ this.label ] : []).concat(this.$slots.default))
+      this.label !== void 0 || this.$scopedSlots.default !== void 0
+        ? h('div', {
+          staticClass: 'q-checkbox__label q-anchor--skip'
+        }, (this.label !== void 0 ? [ this.label ] : []).concat(slot(this, 'default')))
+        : null
     ])
   }
 })

src/components/chip/QChip.js

@@ -6,2 +6,3 @@ import Vue from 'vue'
 import { stopAndPrevent } from '../../utils/event.js'
+import slot from '../../utils/slot.js'
 
@@ -107,3 +108,3 @@ export default Vue.extend({
         staticClass: 'q-chip__content row no-wrap items-center q-anchor--skip'
-      }, this.label !== void 0 ? [ this.label ] : this.$slots.default))
+      }, this.label !== void 0 ? [ this.label ] : slot(this, 'default')))
 
@@ -110,0 +111,0 @@ this.iconRight && child.push(h(QIcon, {

src/components/circular-progress/QCircularProgress.js

@@ -164,3 +164,3 @@ import Vue from 'vue'
           style: { fontSize: this.fontSize }
-        }, this.$slots.default || [ h('div', [ this.value ]) ])
+        }, this.$scopedSlots.default !== void 0 ? this.$scopedSlots.default() : [ h('div', [ this.value ]) ])
         : null
@@ -167,0 +167,0 @@ ])

src/components/dialog/QDialog.js

@@ -8,2 +8,3 @@ import Vue from 'vue'
 import EscapeKey from '../../utils/escape-key.js'
+import slot from '../../utils/slot.js'
 
@@ -236,3 +237,3 @@ let modalsOpened = 0
             attrs: { tabindex: -1 }
-          }, this.$slots.default) : null
+          }, slot(this, 'default')) : null
         ])
@@ -239,0 +240,0 @@ ])

src/components/editor/editor-utils.js

@@ -11,2 +11,4 @@ import QBtn from '../btn/QBtn.js'
 
+import slot from '../../utils/slot.js'
+
 function run (e, btn, vm) {
@@ -182,3 +184,3 @@ if (btn.handler) {
         if (btn.type === 'slot') {
-          return vm.$slots[btn.slot]
+          return slot(vm, btn.slot)
         }
@@ -185,0 +187,0 @@

src/components/fab/QFab.js

@@ -7,2 +7,3 @@ import Vue from 'vue'
 import ModelToggleMixin from '../../mixins/model-toggle.js'
+import slot from '../../utils/slot.js'
 
@@ -45,2 +46,6 @@ export default Vue.extend({
   render (h) {
+    const tooltip = this.$scopedSlots.tooltip !== void 0
+      ? this.$scopedSlots.tooltip()
+      : []
+
     return h('div', {
@@ -64,4 +69,3 @@ staticClass: 'q-fab z-fab row inline justify-center',
         }
-      }, [
-        this.$slots.tooltip,
+      }, tooltip.concat([
         h(QIcon, {
@@ -75,3 +79,3 @@ staticClass: 'q-fab__icon absolute-full',
         })
-      ]),
+      ])),
 
@@ -81,5 +85,5 @@ h('div', {
         class: `q-fab__actions--${this.direction}`
-      }, this.$slots.default)
+      }, slot(this, 'default'))
     ])
   }
 })

src/components/fab/QFabAction.js

@@ -5,2 +5,3 @@ import Vue from 'vue'
 import FabMixin from './fab-mixin.js'
+import slot from '../../utils/slot.js'
 
@@ -49,4 +50,4 @@ export default Vue.extend({
       }
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/field/QField.js

@@ -6,2 +6,3 @@ import Vue from 'vue'
 import ValidateMixin from '../../mixins/validate.js'
+import slot from '../../utils/slot.js'
 
@@ -111,6 +112,6 @@ export default Vue.extend({
 
-        this.$slots.prepend !== void 0 ? h('div', {
+        this.$scopedSlots.prepend !== void 0 ? h('div', {
           staticClass: 'q-field__prepend q-field__marginal row no-wrap items-center',
           key: 'prepend'
-        }, this.$slots.prepend) : null,
+        }, this.$scopedSlots.prepend()) : null,
 
@@ -138,3 +139,3 @@ h('div', {
             ? this.__getDefaultSlot(h)
-            : this.$slots.default
+            : slot(this, 'default')
         )),
@@ -156,7 +157,7 @@
 
-        this.$slots.append !== void 0
+        this.$scopedSlots.append !== void 0
           ? h('div', {
             staticClass: 'q-field__append q-field__marginal row no-wrap items-center',
             key: 'append'
-          }, this.$slots.append)
+          }, this.$scopedSlots.append())
           : null,
@@ -182,3 +183,3 @@
         else {
-          msg = this.$slots.error
+          msg = slot(this, 'error')
           key = 'q--slot-error'
@@ -193,3 +194,3 @@ }
         else {
-          msg = this.$slots.hint
+          msg = slot(this, 'hint')
           key = 'q--slot-hint'
@@ -209,5 +210,5 @@ }
 
-        this.counter === true || this.$slots.counter !== void 0 ? h('div', {
+        this.counter === true || this.$scopedSlots.counter !== void 0 ? h('div', {
           staticClass: 'q-field__counter'
-        }, this.$slots.counter || [ this.computedCounter ]) : null
+        }, this.$scopedSlots.counter !== void 0 ? this.$scopedSlots.counter() : [ this.computedCounter ]) : null
       ])
@@ -222,5 +223,5 @@ }
     }, [
-      this.$slots.before !== void 0 ? h('div', {
+      this.$scopedSlots.before !== void 0 ? h('div', {
         staticClass: 'q-field__before q-field__marginal row no-wrap items-center'
-      }, this.$slots.before) : null,
+      }, this.$scopedSlots.before()) : null,
 
@@ -240,7 +241,7 @@ h('div', {
 
-      this.$slots.after !== void 0 ? h('div', {
+      this.$scopedSlots.after !== void 0 ? h('div', {
         staticClass: 'q-field__after q-field__marginal row no-wrap items-center'
-      }, this.$slots.after) : null
+      }, this.$scopedSlots.after()) : null
     ])
   }
 })

src/components/icon/QIcon.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -77,5 +79,5 @@ name: 'QIcon',
       this.content,
-      this.$slots.default
+      slot(this, 'default')
     ])
   }
 })

src/components/img/QImg.js

@@ -5,2 +5,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -174,10 +176,10 @@ name: 'QImg',
           staticClass: 'q-img__content absolute-full'
-        }, this.$slots.default)
+        }, slot(this, 'default'))
       }
 
-      const content = this.isLoading
+      const content = this.isLoading === true
         ? h('div', {
           key: 'placeholder',
           staticClass: 'q-img__loading absolute-full flex flex-center'
-        }, this.$slots.loading || [
+        }, this.$scopedSlots.loading !== void 0 ? this.$scopedSlots.loading() : [
           h(QSpinner, {
@@ -193,3 +195,3 @@ props: {
           staticClass: 'q-img__content absolute-full'
-        }, this.hasError === true ? this.$slots.error : this.$slots.default)
+        }, slot(this, this.hasError === true ? 'error' : 'default'))
 
@@ -196,0 +198,0 @@ return h('transition', {

src/components/infinite-scroll/QInfiniteScroll.js

@@ -7,2 +7,3 @@ import Vue from 'vue'
 import { listenOpts } from '../../utils/event.js'
+import slot from '../../utils/slot.js'
 
@@ -120,5 +121,9 @@ export default Vue.extend({
   render (h) {
-    return h('div', { staticClass: 'q-infinite-scroll' }, this.$slots.default.concat([
+    const content = this.$scopedSlots.default !== void 0
+      ? this.$scopedSlots.default()
+      : []
+
+    return h('div', { staticClass: 'q-infinite-scroll' }, content.concat([
       this.fetching
-        ? h('div', { staticClass: 'q-infinite-scroll__loading' }, this.$slots.loading)
+        ? h('div', { staticClass: 'q-infinite-scroll__loading' }, slot(this, 'loading'))
         : null
@@ -125,0 +130,0 @@ ]))

src/components/inner-loading/QInnerLoading.js

@@ -24,10 +24,12 @@ import Vue from 'vue'
   render (h) {
-    const content = this.$slots.default || [
-      h(QSpinner, {
-        props: {
-          size: this.size,
-          color: this.color
-        }
-      })
-    ]
+    const content = this.$scopedSlots.default !== void 0
+      ? this.$scopedSlots.default()
+      : [
+        h(QSpinner, {
+          props: {
+            size: this.size,
+            color: this.color
+          }
+        })
+      ]
 
@@ -34,0 +36,0 @@ return h('transition', {

src/components/knob/QKnob.js

@@ -5,2 +5,3 @@ import Vue from 'vue'
 import { between, normalizeToInterval } from '../../utils/format.js'
+import slot from '../../utils/slot.js'
 
@@ -220,4 +221,4 @@ import QCircularProgress from '../circular-progress/QCircularProgress.js'
 
-    return h(QCircularProgress, data, this.$slots.default)
+    return h(QCircularProgress, data, slot(this, 'default'))
   }
 })

src/components/layout/QDrawer.js

@@ -7,2 +7,3 @@ import Vue from 'vue'
 import preventScroll from '../../utils/prevent-scroll.js'
+import slot from '../../utils/slot.js'
 
@@ -42,3 +43,3 @@ const duration = 150
       type: Number,
-      default: 60
+      default: 57
     },
@@ -511,3 +512,3 @@ breakpoint: {
         style: this.contentStyle
-      }, this.isMini && this.$slots.mini !== void 0 ? this.$slots.mini : this.$slots.default)
+      }, this.isMini && this.$scopedSlots.mini !== void 0 ? this.$scopedSlots.mini() : slot(this, 'default'))
     ]
@@ -514,0 +515,0 @@

src/components/layout/QFooter.js

@@ -6,2 +6,3 @@ import Vue from 'vue'
 import { onSSR } from '../../plugins/Platform.js'
+import slot from '../../utils/slot.js'
 
@@ -139,3 +140,3 @@ export default Vue.extend({
         : null
-    ].concat(this.$slots.default))
+    ].concat(slot(this, 'default')))
   },
@@ -142,0 +143,0 @@

src/components/layout/QHeader.js

@@ -5,2 +5,3 @@ import Vue from 'vue'
 import CanRenderMixin from '../../mixins/can-render.js'
+import slot from '../../utils/slot.js'
 
@@ -126,3 +127,3 @@ export default Vue.extend({
         : null
-    ].concat(this.$slots.default))
+    ].concat(slot(this, 'default')))
   },
@@ -129,0 +130,0 @@

src/components/layout/QLayout.js

@@ -7,2 +7,3 @@ import Vue from 'vue'
 import { getScrollbarWidth } from '../../utils/scroll.js'
+import slot from '../../utils/slot.js'
 
@@ -110,3 +111,3 @@ export default Vue.extend({
       }),
-      this.$slots.default
+      slot(this, 'default')
     ])
@@ -113,0 +114,0 @@

src/components/layout/QPage.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -49,4 +51,4 @@ name: 'QPage',
       class: this.classes
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/layout/QPageContainer.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -43,4 +45,4 @@ name: 'QPageContainer',
       style: this.style
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/layout/QPageSticky.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -116,2 +118,4 @@ name: 'QPageSticky',
   render (h) {
+    const content = slot(this, 'default')
+
     return h('div', {
@@ -122,7 +126,7 @@ staticClass: 'q-page-sticky q-layout__section--animate row flex-center',
     },
-    this.expand
-      ? this.$slots.default
-      : [ h('div', this.$slots.default) ]
+    this.expand === true
+      ? content
+      : [ h('div', content) ]
     )
   }
 })

src/components/linear-progress/QLinearProgress.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 function width (val) {
@@ -84,4 +86,4 @@ return { transform: `scale3d(${val},1,1)` }
       }) : null
-    ].concat(this.$slots.default))
+    ].concat(slot(this, 'default')))
   }
 })

src/components/list/QExpansionItem.js

@@ -13,2 +13,3 @@ import Vue from 'vue'
 import { stopAndPrevent } from '../../utils/event.js'
+import slot from '../../utils/slot.js'
 
@@ -128,4 +129,4 @@ const eventName = 'q:expansion-item:close'
 
-      if (this.$slots.header) {
-        child = [].concat(this.$slots.header)
+      if (this.$scopedSlots.header !== void 0) {
+        child = [].concat(this.$scopedSlots.header())
       }
@@ -196,3 +197,3 @@ else {
             directives: [{ name: 'show', value: this.showing }]
-          }, this.$slots.default)
+          }, slot(this, 'default'))
         ])
@@ -199,0 +200,0 @@ ]

src/components/list/QItem.js

 import Vue from 'vue'
 
 import { RouterLinkMixin } from '../../mixins/router-link.js'
+import slot from '../../utils/slot.js'
 
@@ -68,3 +69,3 @@ export default Vue.extend({
     __getContent (h) {
-      const child = [].concat(this.$slots.default)
+      const child = [].concat(slot(this, 'default'))
       this.isClickable === true && child.unshift(h('div', { staticClass: 'q-focus-helper' }))
@@ -71,0 +72,0 @@ return child

src/components/list/QItemLabel.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -42,4 +44,4 @@ name: 'QItemLabel',
       class: this.classes
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/list/QItemSection.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -34,4 +36,4 @@ name: 'QItemSection',
       class: this.classes
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/list/QList.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -30,4 +32,4 @@ name: 'QList',
       class: this.classes
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/list/QSlideItem.js

@@ -5,2 +5,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -32,3 +34,3 @@ name: 'QSlideItem',
 
-        if (this.$slots.left !== void 0) {
+        if (this.$scopedSlots.left !== void 0) {
           const slot = this.$refs.leftContent
@@ -39,3 +41,3 @@ slot.style.transform = `scale3d(1,1,1)`
 
-        if (this.$slots.right !== void 0) {
+        if (this.$scopedSlots.right !== void 0) {
           const slot = this.$refs.rightContent
@@ -64,4 +66,4 @@ slot.style.transform = `scale3d(1,1,1)`
       if (
-        (this.$slots.left === void 0 && evt.direction === 'right') ||
-        (this.$slots.right === void 0 && evt.direction === 'left')
+        (this.$scopedSlots.left === void 0 && evt.direction === 'right') ||
+        (this.$scopedSlots.right === void 0 && evt.direction === 'left')
       ) {
@@ -101,4 +103,4 @@ node.style.transform = `translate3d(0,0,0)`
       content = [],
-      left = this.$slots.left !== void 0,
-      right = this.$slots.right !== void 0
+      left = this.$scopedSlots.left !== void 0,
+      right = this.$scopedSlots.right !== void 0
 
@@ -112,3 +114,3 @@ if (left) {
         }, [
-          h('div', { ref: 'leftContent' }, this.$slots.left)
+          h('div', { ref: 'leftContent' }, slot(this, 'left'))
         ])
@@ -125,3 +127,3 @@ )
         }, [
-          h('div', { ref: 'rightContent' }, this.$slots.right)
+          h('div', { ref: 'rightContent' }, slot(this, 'right'))
         ])
@@ -142,3 +144,3 @@ )
         }] : null
-      }, this.$slots.default)
+      }, slot(this, 'default'))
     )
@@ -145,0 +147,0 @@

src/components/menu/QMenu.js

@@ -14,2 +14,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 import {
@@ -209,3 +211,3 @@ validatePosition, validateOffset, setPosition, parsePosition
           }] : null
-        }, this.$slots.default) : null
+        }, slot(this, 'default')) : null
       ])
@@ -212,0 +214,0 @@ }

src/components/no-ssr/QNoSsr.js

 import Vue from 'vue'
 
 import CanRenderMixin from '../../mixins/can-render.js'
+import slot from '../../utils/slot.js'
 
@@ -19,17 +20,21 @@ export default Vue.extend({
   render (h) {
-    if (this.canRender) {
-      const slot = this.$slots.default
-      return slot !== void 0 && slot.length > 1
-        ? h(this.tag, slot)
-        : (slot ? slot[0] : null)
+    if (this.canRender === true) {
+      const node = slot(this, 'default')
+      return node === void 0
+        ? node
+        : (node.length > 1 ? h(this.tag, node) : node[0])
     }
 
-    if (this.$slots.placeholder) {
-      const slot = this.$slots.placeholder
-      return slot !== void 0 && slot.length > 1
-        ? h(this.tag, { staticClass: 'q-no-ssr-placeholder' }, slot)
-        : (slot ? slot[0] : null)
+    if (this.$scopedSlots.placeholder !== void 0) {
+      const node = slot(this, 'placeholder')
+      return node === void 0
+        ? node
+        : (
+          node.length > 1
+            ? h(this.tag, { staticClass: 'q-no-ssr-placeholder' }, node)
+            : node[0]
+        )
     }
 
-    if (this.placeholder) {
+    if (this.placeholder !== void 0) {
       return h(this.tag, { staticClass: 'q-no-ssr-placeholder' }, [
@@ -36,0 +41,0 @@ this.placeholder

src/components/parallax/QParallax.js

@@ -9,2 +9,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -91,4 +93,4 @@ name: 'QParallax',
       }, [
-        this.$slots.media !== void 0
-          ? this.$slots.media
+        this.$scopedSlots.media !== void 0
+          ? this.$scopedSlots.media()
           : h('img', {
@@ -106,4 +108,4 @@ ref: 'media',
         this.$scopedSlots.content !== void 0
-          ? [ this.$scopedSlots.content({ percentScrolled: this.percentScrolled }) ]
-          : this.$slots.default
+          ? this.$scopedSlots.content({ percentScrolled: this.percentScrolled })
+          : slot(this, 'default')
       )
@@ -121,4 +123,4 @@ ])
 
-    this.media = this.$slots.media
-      ? this.$slots.media[0].elm
+    this.media = this.$scopedSlots.media !== void 0
+      ? this.$scopedSlots.media()[0].elm
       : this.$refs.media
@@ -125,0 +127,0 @@

src/components/popup-edit/QPopupEdit.js

@@ -8,2 +8,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -76,4 +78,6 @@ name: 'QPopupEdit',
       const
-        child = [].concat(this.$slots.default),
-        title = this.$slots.title || this.title
+        child = [].concat(slot(this, 'default')),
+        title = this.$scopedSlots.title !== void 0
+          ? this.$scopedSlots.title()
+          : this.title
 
@@ -80,0 +84,0 @@ title && child.unshift(

src/components/popup-proxy/QPopupProxy.js

@@ -7,2 +7,3 @@ import Vue from 'vue'
 import AnchorMixin from '../../mixins/anchor.js'
+import slot from '../../utils/slot.js'
 
@@ -101,4 +102,4 @@ export default Vue.extend({
 
-    return h(component, data, this.$slots.default)
+    return h(component, data, slot(this, 'default'))
   }
 })

src/components/pull-to-refresh/QPullToRefresh.js

@@ -9,2 +9,3 @@ import Vue from 'vue'
 import { between } from '../../utils/format.js'
+import slot from '../../utils/slot.js'
 
@@ -169,3 +170,3 @@ const
         class: this.pulling ? 'no-pointer-events' : null
-      }, this.$slots.default),
+      }, slot(this, 'default')),
 
@@ -172,0 +173,0 @@ h('div', {

src/components/radio/QRadio.js

 import Vue from 'vue'
 
 import { stopAndPrevent } from '../../utils/event.js'
+import slot from '../../utils/slot.js'
 
@@ -99,7 +100,9 @@ export default Vue.extend({
 
-      (this.label !== void 0 || this.$slots.default !== void 0) && h('div', {
-        staticClass: 'q-radio__label q-anchor--skip'
-      }, (this.label !== void 0 ? [ this.label ] : []).concat(this.$slots.default))
+      this.label !== void 0 || this.$scopedSlots.default !== void 0
+        ? h('div', {
+          staticClass: 'q-radio__label q-anchor--skip'
+        }, (this.label !== void 0 ? [ this.label ] : []).concat(slot(this, 'default')))
+        : null
     ])
   }
 })

src/components/scroll-area/QScrollArea.js

@@ -6,2 +6,3 @@ import Vue from 'vue'
 import { setScrollPosition } from '../../utils/scroll.js'
+import slot from '../../utils/slot.js'
 import QResizeObserver from '../observer/QResizeObserver.js'
@@ -180,3 +181,3 @@ import QScrollObserver from '../observer/QScrollObserver.js'
           staticClass: 'scroll relative-position fit'
-        }, this.$slots.default)
+        }, slot(this, 'default'))
       ])
@@ -215,3 +216,3 @@ }
           }),
-          this.$slots.default
+          slot(this, 'default')
         ]),
@@ -218,0 +219,0 @@ h(QScrollObserver, {

src/components/select/QSelect.js

@@ -14,2 +14,3 @@ import Vue from 'vue'
 import uid from '../../utils/uid.js'
+import slot from '../../utils/slot.js'
 import { isDeepEqual } from '../../utils/is.js'
@@ -474,8 +475,8 @@ import { stopAndPrevent } from '../../utils/event.js'
 
-      if (this.$scopedSlots.selected !== void 0) {
-        return this.selectedScope.map(scope => this.$scopedSlots.selected(scope))
+      if (this.$scopedSlots['selected-item'] !== void 0) {
+        return this.selectedScope.map(scope => this.$scopedSlots['selected-item'](scope))
       }
 
-      if (this.$slots.selected !== void 0) {
-        return this.$slots.selected
+      if (this.$scopedSlots.selected !== void 0) {
+        return this.$scopedSlots.selected()
       }
@@ -558,3 +559,3 @@
         this.editable === false ||
-        (this.noOptions === true && this.$slots['no-option'] === void 0)
+        (this.noOptions === true && this.$scopedSlots['no-option'] === void 0)
       ) {
@@ -579,3 +580,3 @@ return
             }
-          }, this.noOptions === true ? this.$slots['no-option'] : this.__getOptions(h))
+          }, this.noOptions === true ? slot(this, 'no-option') : this.__getOptions(h))
           : null
@@ -589,4 +590,4 @@ ])
           ? (
-            this.$slots.loading !== void 0
-              ? this.$slots.loading
+            this.$scopedSlots.loading !== void 0
+              ? this.$scopedSlots.loading()
               : h(QSpinner, { props: { color: this.color } })
@@ -678,3 +679,3 @@ )
         }
-        else if (this.noOptions !== true || this.$slots['no-option'] !== void 0) {
+        else if (this.noOptions !== true || this.$scopedSlots['no-option'] !== void 0) {
           this.menu = true
@@ -681,0 +682,0 @@ }

src/components/select/QSelect.json

@@ -164,3 +164,3 @@ {
   "scopedSlots": {
-    "selected": {
+    "selected-item": {
       "desc": "Override default selection slot; Suggestion: QChip",
@@ -167,0 +167,0 @@ "scope": {

src/components/slide-transition/QSlideTransition.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -101,4 +103,4 @@ name: 'QSlideTransition',
       }
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/splitter/QSplitter.js

@@ -5,2 +5,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -124,3 +126,3 @@ name: 'QSplitter',
         style: this.beforeStyle
-      }, this.$slots.before),
+      }, slot(this, 'before')),
 
@@ -150,5 +152,5 @@ h('div', {
         style: this.afterStyle
-      }, this.$slots.after)
-    ].concat(this.$slots.default))
+      }, slot(this, 'after'))
+    ].concat(slot(this, 'default')))
   }
 })

src/components/stepper/QStep.js

@@ -7,2 +7,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -58,3 +60,3 @@ name: 'QStep',
           staticClass: 'q-stepper__step-inner'
-        }, this.$slots.default)
+        }, slot(this, 'default'))
       ])
@@ -61,0 +63,0 @@ : null

src/components/stepper/QStepper.js

@@ -5,2 +5,3 @@ import Vue from 'vue'
 import StepHeader from './StepHeader.js'
+import slot from '../../utils/slot.js'
 
@@ -55,3 +56,3 @@ export default Vue.extend({
         return [
-          h('div', { staticClass: 'q-stepper__content' }, this.$slots.default)
+          h('div', { staticClass: 'q-stepper__content' }, slot(this, 'default'))
         ]
@@ -86,11 +87,11 @@ }
       ]
+    },
+
+    __render (h) {
+      return h('div', {
+        staticClass: 'q-stepper',
+        class: this.classes
+      }, this.__getContent(h).concat(slot(this, 'navigation')))
     }
-  },
-
-  render (h) {
-    return h('div', {
-      staticClass: 'q-stepper',
-      class: this.classes
-    }, this.__getContent(h).concat(this.$slots.navigation))
   }
 })

src/components/stepper/QStepperNavigation.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -9,4 +11,4 @@ name: 'QStepperNavigation',
       staticClass: 'q-stepper__nav'
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/tab-panels/QTabPanel.js

 import Vue from 'vue'
 
 import { PanelChildMixin } from '../../mixins/panel.js'
+import slot from '../../utils/slot.js'
 
@@ -14,4 +15,4 @@ export default Vue.extend({
       attrs: { role: 'tabpanel' }
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/tab-panels/QTabPanels.js

@@ -10,8 +10,10 @@ import Vue from 'vue'
 
-  render (h) {
-    return h('div', {
-      staticClass: 'q-tab-panels relative-position',
-      directives: this.panelDirectives
-    }, this.__getPanelContent(h))
+  methods: {
+    __render (h) {
+      return h('div', {
+        staticClass: 'q-tab-panels relative-position',
+        directives: this.panelDirectives
+      }, this.__getPanelContent(h))
+    }
   }
 })

src/components/table/QMarkupTable.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -37,5 +39,5 @@ name: 'QMarkupTable',
     }, [
-      h('table', { staticClass: 'q-table' }, this.$slots.default)
+      h('table', { staticClass: 'q-table' }, slot(this, 'default'))
     ])
   }
 })

src/components/table/QTd.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -15,3 +17,3 @@ name: 'QTd',
         class: { 'q-table--col-auto-width': this.autoWidth }
-      }, this.$slots.default)
+      }, slot(this, 'default'))
     }
@@ -33,4 +35,4 @@
         (this.autoWidth === true ? ' q-table--col-auto-width' : '')
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/table/QTh.js

@@ -5,2 +5,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -18,3 +20,3 @@ name: 'QTh',
         class: this.autoWidth === true ? 'q-table--col-auto-width' : null
-      }, this.$slots.default)
+      }, slot(this, 'default'))
     }
@@ -25,3 +27,3 @@
       name = this.$vnode.key,
-      child = [].concat(this.$slots.default)
+      child = [].concat(slot(this, 'default'))
 
@@ -28,0 +30,0 @@ if (name) {

src/components/table/QTr.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -16,5 +18,5 @@ name: 'QTr',
         : { class: this.props.__trClass },
-      this.$slots.default
+      slot(this, 'default')
     )
   }
 })

src/components/tabs/QTab.js

@@ -7,2 +7,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -103,3 +105,3 @@ name: 'QTab',
           class: this.tabs.inlineLabel === true ? 'row no-wrap q-tab__content--inline' : 'column'
-        }, content.concat(this.$slots.default))
+        }, content.concat(slot(this, 'default')))
       ]
@@ -106,0 +108,0 @@

src/components/tabs/QTabs.js

@@ -6,2 +6,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 function getIndicatorClass (color, top) {
@@ -320,3 +322,3 @@ return `absolute-${top ? 'top' : 'bottom'}${color ? ` text-${color}` : ''}`
         class: this.alignClass
-      }, this.$slots.default),
+      }, slot(this, 'default')),
 
@@ -323,0 +325,0 @@ h(QIcon, {

src/components/timeline/QTimeline.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -44,4 +46,4 @@ name: 'QTimeline',
       class: this.classes
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/timeline/QTimelineEntry.js

@@ -5,2 +5,4 @@ import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -59,3 +61,3 @@ name: 'QTimelineEntry',
           { staticClass: 'q-timeline__heading-title' },
-          this.$slots.default
+          slot(this, 'default')
         )
@@ -86,3 +88,3 @@ ]
         h('h6', { staticClass: 'q-timeline__title' }, [ this.title ])
-      ].concat(this.$slots.default))
+      ].concat(slot(this, 'default')))
     ]
@@ -89,0 +91,0 @@

src/components/toggle/QToggle.js

@@ -6,2 +6,3 @@ import Vue from 'vue'
 import QIcon from '../icon/QIcon.js'
+import slot from '../../utils/slot.js'
 
@@ -93,5 +94,5 @@ export default Vue.extend({
         staticClass: 'q-toggle__label q-anchor--skip'
-      }, (this.label !== void 0 ? [ this.label ] : []).concat(this.$slots.default))
+      }, (this.label !== void 0 ? [ this.label ] : []).concat(slot(this, 'default')))
     ])
   }
 })

src/components/toolbar/QToolbar.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -14,4 +16,4 @@ name: 'QToolbar',
       class: this.inset ? 'q-toolbar--inset' : null
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/toolbar/QToolbarTitle.js

 import Vue from 'vue'
 
+import slot from '../../utils/slot.js'
+
 export default Vue.extend({
@@ -14,4 +16,4 @@ name: 'QToolbarTitle',
       class: this.shrink ? 'col-auto' : null
-    }, this.$slots.default)
+    }, slot(this, 'default'))
   }
 })

src/components/tooltip/QTooltip.js

@@ -10,2 +10,3 @@ import Vue from 'vue'
 import { listenOpts } from '../../utils/event.js'
+import slot from '../../utils/slot.js'
 import {
@@ -216,3 +217,3 @@ validatePosition, validateOffset, setPosition, parsePosition
           style: this.contentStyle
-        }, this.$slots.default) : null
+        }, slot(this, 'default')) : null
       ])
@@ -219,0 +220,0 @@ }

src/components/uploader/uploader-base-mixin.js

@@ -337,3 +337,3 @@ import QBtn from '../btn/QBtn.js'
       if (this.$scopedSlots.list !== void 0) {
-        return [ this.$scopedSlots.list(this) ]
+        return this.$scopedSlots.list(this)
       }
@@ -340,0 +340,0 @@

src/mixins/panel.js

@@ -86,3 +86,3 @@ import TouchSwipe from '../directives/TouchSwipe'
     __getPanelIndex (name) {
-      return this.$slots.default.findIndex(panel => {
+      return this.panels.findIndex(panel => {
         const opt = panel.componentOptions
@@ -97,3 +97,3 @@ return opt &&
     __getAllPanels () {
-      return this.$slots.default.filter(
+      return this.panels.filter(
         panel => panel.componentOptions !== void 0 && panel.componentOptions.propsData.name !== void 0
@@ -104,3 +104,3 @@ )
     __getAvailablePanels () {
-      return this.$slots.default.filter(panel => {
+      return this.panels.filter(panel => {
         const opt = panel.componentOptions
@@ -116,3 +116,3 @@ return opt &&
       let index = startIndex + direction
-      const slots = this.$slots.default
+      const slots = this.panels
 
@@ -154,3 +154,3 @@ while (index > -1 && index < slots.length) {
     __getPanelContent (h) {
-      if (this.$slots.default === void 0) {
+      if (this.panels.length === 0) {
         return
@@ -161,3 +161,3 @@ }
         this.__updatePanelIndex() &&
-        this.$slots.default[this.panelIndex]
+        this.panels[this.panelIndex]
 
@@ -177,2 +177,10 @@ return [
     }
+  },
+
+  render (h) {
+    this.panels = this.$scopedSlots.default !== void 0
+      ? this.$scopedSlots.default()
+      : []
+
+    return this.__render(h)
   }
@@ -179,0 +187,0 @@ }

src/mixins/validate.js

@@ -80,2 +80,4 @@ import { testPattern } from '../utils/patterns.js'
         this.innerError = error
+      }
+      if (this.innerErrorMessage !== msg) {
         this.innerErrorMessage = msg
@@ -82,0 +84,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

4670584

increased by0.18%

Number of package files

759

increased by0.13%

Lines of code

110258

increased by0.14%

No dependency changes