quasar 1.19.3 → 1.19.4

package/dist/web-types/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "",
   "framework": "vue",
   "name": "quasar",
-  "version": "1.19.3",
+  "version": "1.19.4",
   "contributions": {
     "html": {
       "types-syntax": "typescript",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar",
-  "version": "1.19.3",
+  "version": "1.19.4",
   "description": "Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time",
   "module": "src/index.esm.js",
   "typings": "dist/types/index.d.ts",

package/src/components/carousel/QCarousel.js

@@ -99,11 +99,11 @@ export default Vue.extend({
     },
 
     transitionPrevComputed () {
-      return this.transitionPrev || `fade`
+      return this.transitionPrev || 'fade'
     },
 
     transitionNextComputed () {
-      return this.transitionNext || `fade`
+      return this.transitionNext || 'fade'
     }
   },
 

package/src/components/chat/QChatMessage.js

@@ -35,7 +35,7 @@ export default Vue.extend({
     },
 
     containerClass () {
-      return `q-message-container row items-end no-wrap` +
+      return 'q-message-container row items-end no-wrap' +
         (this.sent === true ? ' reverse' : '')
     },
 
@@ -85,9 +85,9 @@ export default Vue.extend({
         ]
       }
 
-      const content = withSlots === true
-        ? (contentList.length > 1 ? (text => text) : (text => h('div', [ text ])))
-        : (text => h('div', { domProps: { [domPropText]: text } }))
+      const content = withSlots !== true
+        ? text => h('div', { domProps: { [domPropText]: text } })
+        : (contentList.length > 1 ? text => text : text => h('div', [text]))
 
       return contentList.map((msg, index) => h('div', {
         key: index,

package/src/components/date/QDate.js

@@ -129,9 +129,9 @@ export default Vue.extend({
       const type = this.landscape === true ? 'landscape' : 'portrait'
       return `q-date q-date--${type} q-date--${type}-${this.minimal === true ? 'minimal' : 'standard'}` +
         (this.isDark === true ? ' q-date--dark q-dark' : '') +
-        (this.bordered === true ? ` q-date--bordered` : '') +
-        (this.square === true ? ` q-date--square no-border-radius` : '') +
-        (this.flat === true ? ` q-date--flat no-shadow` : '') +
+        (this.bordered === true ? ' q-date--bordered' : '') +
+        (this.square === true ? ' q-date--square no-border-radius' : '') +
+        (this.flat === true ? ' q-date--flat no-shadow' : '') +
         (this.disable === true ? ' disabled' : (this.readonly === true ? ' q-date--readonly' : ''))
     },
 
@@ -663,7 +663,7 @@ export default Vue.extend({
       }
 
       res.forEach(day => {
-        let cls = `q-date__calendar-item `
+        let cls = 'q-date__calendar-item '
 
         if (day.fill === true) {
           cls += 'q-date__calendar-item--fill'

package/src/components/drawer/QDrawer.js

@@ -699,7 +699,7 @@ export default Vue.extend({
     child.push(
       h('aside', {
         ref: 'content',
-        staticClass: `q-drawer`,
+        staticClass: 'q-drawer',
         class: this.classes,
         style: this.style,
         on: this.onNativeEvents,

package/src/components/editor/QEditor.js

@@ -510,7 +510,7 @@ export default Vue.extend({
         'div',
         {
           ref: 'content',
-          staticClass: `q-editor__content`,
+          staticClass: 'q-editor__content',
           style: this.innerStyle,
           class: this.innerClass,
           attrs: {

package/src/components/field/QField.sass

@@ -126,6 +126,7 @@ $field-transition-label-right-up: .324s cubic-bezier(.4,0,.2,1)
     width: 100%
     min-width: 0 // needed for FF
     outline: 0 !important // needed for FF
+    user-select: auto
 
     &:-webkit-autofill
       -webkit-animation-name: q-autofill

package/src/components/field/QField.styl

@@ -126,6 +126,7 @@ $field-transition-label-right-up = .324s cubic-bezier(.4,0,.2,1)
     width: 100%
     min-width: 0 // needed for FF
     outline: 0 !important // needed for FF
+    user-select: auto
 
     &:-webkit-autofill
       -webkit-animation-name: q-autofill

package/src/components/markup-table/QMarkupTable.js

@@ -26,12 +26,12 @@ export default Vue.extend({
   computed: {
     classes () {
       return `q-table--${this.separator}-separator` +
-        (this.isDark === true ? ` q-table--dark q-table__card--dark q-dark` : '') +
-        (this.dense === true ? ` q-table--dense` : '') +
-        (this.flat === true ? ` q-table--flat` : '') +
-        (this.bordered === true ? ` q-table--bordered` : '') +
-        (this.square === true ? ` q-table--square` : '') +
-        (this.wrapCells === false ? ` q-table--no-wrap` : '')
+        (this.isDark === true ? ' q-table--dark q-table__card--dark q-dark' : '') +
+        (this.dense === true ? ' q-table--dense' : '') +
+        (this.flat === true ? ' q-table--flat' : '') +
+        (this.bordered === true ? ' q-table--bordered' : '') +
+        (this.square === true ? ' q-table--square' : '') +
+        (this.wrapCells === false ? ' q-table--no-wrap' : '')
     }
   },
 

package/src/components/select/QSelect.js

@@ -973,6 +973,7 @@ export default Vue.extend({
             attrs: {
               id: isTarget === true ? this.targetUid : void 0,
               tabindex: this.tabindex,
+              'data-autofocus': (fromDialog !== true && this.autofocus) || void 0,
               ...attrs
             },
             on: cache(this, 'f-tget', {

package/src/components/stepper/StepHeader.js

@@ -107,7 +107,7 @@ export default Vue.extend({
     },
 
     classes () {
-      return `q-stepper__tab col-grow flex items-center no-wrap relative-position` +
+      return 'q-stepper__tab col-grow flex items-center no-wrap relative-position' +
         (this.color !== void 0 ? ` text-${this.color}` : '') +
         (this.isError === true
           ? ' q-stepper__tab--error q-stepper__tab--error-with-' + (this.hasPrefix === true ? 'prefix' : 'icon')

package/src/components/table/QTable.js

@@ -211,20 +211,20 @@ export default Vue.extend({
     },
 
     cardDefaultClass () {
-      return ` q-table__card` +
+      return ' q-table__card' +
         (this.isDark === true ? ' q-table__card--dark q-dark' : '') +
-        (this.square === true ? ` q-table--square` : '') +
-        (this.flat === true ? ` q-table--flat` : '') +
-        (this.bordered === true ? ` q-table--bordered` : '')
+        (this.square === true ? ' q-table--square' : '') +
+        (this.flat === true ? ' q-table--flat' : '') +
+        (this.bordered === true ? ' q-table--bordered' : '')
     },
 
     __containerClass () {
       return `q-table__container q-table--${this.separator}-separator column no-wrap` +
         (this.grid === true ? ' q-table--grid' : this.cardDefaultClass) +
-        (this.isDark === true ? ` q-table--dark` : '') +
-        (this.dense === true ? ` q-table--dense` : '') +
-        (this.wrapCells === false ? ` q-table--no-wrap` : '') +
-        (this.inFullscreen === true ? ` fullscreen scroll` : '')
+        (this.isDark === true ? ' q-table--dark' : '') +
+        (this.dense === true ? ' q-table--dense' : '') +
+        (this.wrapCells === false ? ' q-table--no-wrap' : '') +
+        (this.inFullscreen === true ? ' fullscreen scroll' : '')
     },
 
     containerClass () {

package/src/components/time/QTime.js

@@ -113,9 +113,9 @@ export default Vue.extend({
       return `q-time q-time--${this.landscape === true ? 'landscape' : 'portrait'}` +
         (this.isDark === true ? ' q-time--dark q-dark' : '') +
         (this.disable === true ? ' disabled' : (this.readonly === true ? ' q-time--readonly' : '')) +
-        (this.bordered === true ? ` q-time--bordered` : '') +
-        (this.square === true ? ` q-time--square no-border-radius` : '') +
-        (this.flat === true ? ` q-time--flat no-shadow` : '')
+        (this.bordered === true ? ' q-time--bordered' : '') +
+        (this.square === true ? ' q-time--square no-border-radius' : '') +
+        (this.flat === true ? ' q-time--flat no-shadow' : '')
     },
 
     stringModel () {

package/src/components/tree/QTree.js

@@ -79,7 +79,7 @@ export default Vue.extend({
     classes () {
       return `q-tree q-tree--${this.dense === true ? 'dense' : 'standard'}` +
         (this.noConnectors === true ? ' q-tree--no-connectors' : '') +
-        (this.isDark === true ? ` q-tree--dark` : '') +
+        (this.isDark === true ? ' q-tree--dark' : '') +
         (this.color !== void 0 ? ` text-${this.color}` : '')
     },
 
@@ -385,7 +385,7 @@ export default Vue.extend({
       }
 
       if (emit === true) {
-        this.$emit(`update:expanded`, target)
+        this.$emit('update:expanded', target)
       }
       else {
         this.innerExpanded = target
@@ -415,7 +415,7 @@ export default Vue.extend({
       }
 
       if (emit === true) {
-        this.$emit(`update:ticked`, target)
+        this.$emit('update:ticked', target)
       }
     },
 
@@ -449,7 +449,7 @@ export default Vue.extend({
     __getNodeMedia (h, node) {
       if (node.icon !== void 0) {
         return h(QIcon, {
-          staticClass: `q-tree__icon q-mr-sm`,
+          staticClass: 'q-tree__icon q-mr-sm',
           props: { name: node.icon, color: node.iconColor }
         })
       }

package/src/components/tree/QTree.sass

@@ -102,10 +102,10 @@
   &__arrow,
   &__spinner
     font-size: 16px
+    margin-right: 4px
 
   &__arrow
     transition: transform .3s
-    margin-right: 4px
 
     &--rotate
       transform: rotate3d(0, 0, 1, 90deg)

package/src/components/tree/QTree.styl

@@ -102,10 +102,10 @@
   &__arrow,
   &__spinner
     font-size: 16px
+    margin-right: 4px
 
   &__arrow
     transition: transform .3s
-    margin-right: 4px
 
     &--rotate
       transform: rotate3d(0, 0, 1, 90deg)

package/src/components/uploader/QUploader.sass

@@ -22,7 +22,7 @@
     &::-webkit-file-upload-button
       cursor: pointer
 
-  &__header, &__file
+  &__file
     &:before
       content: ''
       border-top-left-radius: inherit

package/src/components/uploader/QUploader.styl

@@ -22,7 +22,7 @@
     &::-webkit-file-upload-button
       cursor: pointer
 
-  &__header, &__file
+  &__file
     &:before
       content: ''
       border-top-left-radius: inherit

package/src/components/virtual-scroll/QVirtualScroll.js

@@ -131,7 +131,7 @@ export default Vue.extend({
 
   render (h) {
     if (this.$scopedSlots.default === void 0) {
-      console.error(`QVirtualScroll: default scoped slot is required for rendering`, this)
+      console.error('QVirtualScroll: default scoped slot is required for rendering', this)
       return
     }
 

package/src/directives/TouchSwipe.js

@@ -250,7 +250,7 @@ export default {
 
     client.has.touch === true && addEvt(ctx, 'main', [
       [ el, 'touchstart', 'touchStart', `passive${modifiers.capture === true ? 'Capture' : ''}` ],
-      [ el, 'touchmove', 'noop', `notPassiveCapture` ]
+      [ el, 'touchmove', 'noop', 'notPassiveCapture' ]
     ])
   },
 

package/src/mixins/fab.js

@@ -62,7 +62,7 @@ export default {
         return {
           action: 'push',
           data: {
-            staticClass: `q-fab__label q-tooltip--style q-fab__label--external` +
+            staticClass: 'q-fab__label q-tooltip--style q-fab__label--external' +
               ` q-fab__label--external-${this.labelPosition}` +
               (hideLabel === true ? ' q-fab__label--external-hidden' : ''),
             style: this.labelStyle,

package/src/plugins/Meta.js

@@ -199,7 +199,7 @@ function getHead (meta) {
 
       output += `<${type} ${attrs.join(' ')} data-qmeta="${att}">`
       if (type === 'script') {
-        output += (metaType[att].innerHTML || '') + `</script>`
+        output += `${metaType[att].innerHTML || ''}</script>`
       }
     }
   })

package/src/plugins/Screen.js

@@ -159,7 +159,7 @@ export default {
 
       // due to optimizations, this would be left out otherwise
       classes === true && this.name === 'xs' &&
-        document.body.classList.add(`screen--xs`)
+        document.body.classList.add('screen--xs')
     }
 
     if (fromSSR === true) {

package/src/utils/patterns.js

@@ -18,7 +18,7 @@ export const testPattern = {
   // This is a basic helper validation.
   // For something more complex (like RFC 822) you should write and use your own rule.
   // We won't be accepting PRs to enhance the one below because of the reason above.
-  email: v => /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(v),
+  email: v => /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(v),
 
   hexColor: v => hex.test(v),
   hexaColor: v => hexa.test(v),