quasar 1.18.3 → 1.18.6

package/src/components/stepper/QStepper.sass

@@ -53,10 +53,12 @@
       color: $negative
       color: var(--q-color-negative)
 
+    &--error-with-icon
       .q-stepper__dot
         background: transparent !important
         span
           color: currentColor
+        .q-icon
           font-size: 24px
 
   &__header

package/src/components/stepper/QStepper.styl

@@ -53,10 +53,12 @@
       color: $negative
       color: var(--q-color-negative)
 
+    &--error-with-icon
       .q-stepper__dot
         background: transparent !important
         span
           color: currentColor
+        .q-icon
           font-size: 24px
 
   &__header

package/src/components/stepper/StepHeader.js

@@ -53,23 +53,36 @@ export default Vue.extend({
 
     hasPrefix () {
       return this.step.prefix &&
-        this.isActive === false &&
-        this.isError === false &&
-        this.isDone === false
+        (this.isActive === false || this.stepper.activeIcon === 'none') &&
+        (this.isError === false || this.stepper.errorIcon === 'none') &&
+        (this.isDone === false || this.stepper.doneIcon === 'none')
     },
 
     icon () {
+      const defaultIcon = this.step.icon || this.stepper.inactiveIcon
+
       if (this.isActive === true) {
-        return this.step.activeIcon || this.stepper.activeIcon || this.$q.iconSet.stepper.active
+        const icon = this.step.activeIcon || this.stepper.activeIcon
+        return icon === 'none'
+          ? defaultIcon
+          : icon || this.$q.iconSet.stepper.active
       }
+
       if (this.isError === true) {
-        return this.step.errorIcon || this.stepper.errorIcon || this.$q.iconSet.stepper.error
+        const icon = this.step.errorIcon || this.stepper.errorIcon
+        return icon === 'none'
+          ? defaultIcon
+          : icon || this.$q.iconSet.stepper.error
       }
+
       if (this.isDisable === false && this.isDone === true) {
-        return this.step.doneIcon || this.stepper.doneIcon || this.$q.iconSet.stepper.done
+        const icon = this.step.doneIcon || this.stepper.doneIcon
+        return icon === 'none'
+          ? defaultIcon
+          : icon || this.$q.iconSet.stepper.done
       }
 
-      return this.step.icon || this.stepper.inactiveIcon
+      return defaultIcon
     },
 
     color () {
@@ -96,7 +109,9 @@ export default Vue.extend({
     classes () {
       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' : '') +
+        (this.isError === true
+          ? ' q-stepper__tab--error q-stepper__tab--error-with-' + (this.hasPrefix === true ? 'prefix' : 'icon')
+          : '') +
         (this.isActive === true ? ' q-stepper__tab--active' : '') +
         (this.isDone === true ? ' q-stepper__tab--done' : '') +
         (this.headerNav === true ? ' q-stepper__tab--navigation q-focusable q-hoverable' : '') +

package/src/components/table/table-sort.js

@@ -1,5 +1,5 @@
 import { sortDate } from '../../utils/sort.js'
-import { isNumber, isDate } from '../../utils/is.js'
+import { isNumber, isDate, isObject } from '../../utils/is.js'
 
 export default {
   props: {
@@ -71,7 +71,7 @@ export default {
     sort (col /* String(col name) or Object(col definition) */) {
       let sortOrder = this.columnSortOrder
 
-      if (col === Object(col)) {
+      if (isObject(col) === true) {
         if (col.sortOrder) {
           sortOrder = col.sortOrder
         }

package/src/components/uploader/QUploaderBase.js

@@ -441,7 +441,10 @@ export default Vue.extend({
         'disabled q-uploader--disable': this.disable
       },
       on: this.canAddFiles === true
-        ? cache(this, 'drag', { dragover: this.__onDragOver })
+        ? cache(this, 'drag', {
+          dragover: this.__onDragOver,
+          dragleave: this.__onDragLeave
+        })
         : null
     }, children)
   }

package/src/mixins/datetime.js

@@ -75,7 +75,9 @@ export default {
 
   methods: {
     __getLocale () {
-      return this.locale || this.$q.lang.date
+      return this.locale !== void 0
+        ? { ...this.$q.lang.date, ...this.locale }
+        : this.$q.lang.date
     },
 
     __getCurrentDate (dateOnly) {

package/src/mixins/file.js

@@ -180,7 +180,7 @@ export default {
 
     __onDragLeave (e) {
       stopAndPrevent(e)
-      this.dnd = false
+      e.relatedTarget !== this.$refs.dnd && (this.dnd = false)
     },
 
     __onDrop (e) {
@@ -198,6 +198,7 @@ export default {
       if (this.dnd === true) {
         return h('div', {
           staticClass: `q-${type}__dnd absolute-full`,
+          ref: 'dnd',
           on: cache(this, 'dnd', {
             dragenter: stopAndPreventDrag,
             dragover: stopAndPreventDrag,

package/src/mixins/mask.js

@@ -301,7 +301,7 @@ export default {
         ? this.__unmask(masked)
         : masked
 
-      this.value !== val && this.__emitValue(val, true)
+      String(this.value) !== val && this.__emitValue(val, true)
     },
 
     __moveCursorForPaste (inp, start, end) {

package/src/plugins/Loading.js

@@ -3,6 +3,7 @@ import Vue from 'vue'
 import QSpinner from '../components/spinner/QSpinner.js'
 import { isSSR } from './Platform.js'
 import cache from '../utils/cache.js'
+import { isObject } from '../utils/is.js'
 import { preventScroll } from '../mixins/prevent-scroll.js'
 
 let
@@ -29,7 +30,7 @@ const Loading = {
   show (opts) {
     if (isSSR === true) { return }
 
-    props = opts === Object(opts) && opts.ignoreDefaults === true
+    props = isObject(opts) === true && opts.ignoreDefaults === true
       ? { ...originalDefaults, ...opts }
       : { ...defaults, ...opts }
 
@@ -125,7 +126,7 @@ const Loading = {
   },
 
   setDefaults (opts) {
-    opts === Object(opts) && Object.assign(defaults, opts)
+    isObject(opts) === true && Object.assign(defaults, opts)
   },
 
   install ({ $q, cfg: { loading } }) {

package/src/plugins/LoadingBar.js

@@ -2,6 +2,7 @@ import Vue from 'vue'
 
 import { isSSR } from './Platform.js'
 import { noop } from '../utils/event.js'
+import { isObject } from '../utils/is.js'
 import QAjaxBar from '../components/ajax-bar/QAjaxBar.js'
 
 export default {
@@ -21,6 +22,15 @@ export default {
     const props = cfg.loadingBar !== void 0
       ? { ...cfg.loadingBar }
       : {}
+    const on = {
+      start: () => {
+        this.isActive = true
+      },
+
+      stop: () => {
+        this.isActive = false
+      }
+    }
 
     const bar = new Vue({
       name: 'LoadingBar',
@@ -35,22 +45,17 @@ export default {
 
       render: h => h(QAjaxBar, {
         ref: 'bar',
-        props
+        props,
+        on
       })
     }).$mount().$refs.bar
 
     Object.assign(this, {
-      start: speed => {
-        bar.start(speed)
-        this.isActive = bar.isActive = true
-      },
-      stop: () => {
-        const sessions = bar.stop()
-        this.isActive = bar.isActive = sessions > 0
-      },
+      start: bar.start,
+      stop: bar.stop,
       increment: bar.increment,
       setDefaults: opts => {
-        opts === Object(opts) && Object.assign(props, opts)
+        isObject(opts) === true && Object.assign(props, opts)
         bar.$parent.$forceUpdate()
       }
     })

package/src/plugins/Notify.js

@@ -8,6 +8,8 @@ import QSpinner from '../components/spinner/QSpinner.js'
 import { noop } from '../utils/event.js'
 import { getBodyFullscreenElement } from '../utils/dom.js'
 import debounce from '../utils/debounce.js'
+import { isObject } from '../utils/is.js'
+
 import { isSSR } from './Platform.js'
 
 let uid = 0, vm
@@ -71,7 +73,7 @@ function addNotification (config, vm, originalApi) {
     Object.assign(notif, defaults)
   }
 
-  if (Object(config) !== config) {
+  if (isObject(config) === false) {
     if (notif.type) {
       Object.assign(notif, notifTypes[notif.type])
     }
@@ -407,7 +409,8 @@ const Notifications = {
           if (notif.spinner !== false) {
             mainChild.push(
               h(notif.spinner, {
-                staticClass: 'q-notification__spinner q-notification__spinner--' + meta.leftClass
+                staticClass: 'q-notification__spinner q-notification__spinner--' + meta.leftClass,
+                props: { color: notif.spinnerColor, size: notif.spinnerSize }
               })
             )
           }
@@ -416,7 +419,7 @@ const Notifications = {
               h(QIcon, {
                 staticClass: 'q-notification__icon q-notification__icon--' + meta.leftClass,
                 attrs: { role: 'img' },
-                props: { name: notif.icon }
+                props: { name: notif.icon, color: notif.iconColor, size: notif.iconSize }
               })
             )
           }
@@ -518,13 +521,13 @@ const Notifications = {
 
 export default {
   setDefaults (opts) {
-    if (isSSR !== true && opts === Object(opts)) {
+    if (isSSR !== true && isObject(opts) === true) {
       Object.assign(defaults, opts)
     }
   },
 
   registerType (typeName, typeOpts) {
-    if (isSSR !== true && typeOpts === Object(typeOpts)) {
+    if (isSSR !== true && isObject(typeOpts) === true) {
       notifTypes[typeName] = typeOpts
     }
   },

package/src/plugins/Notify.json

@@ -45,6 +45,16 @@
         "extends": "icon"
       },
 
+      "iconColor": {
+        "extends": "color",
+        "addedIn": "v1.18.5"
+      },
+
+      "iconSize": {
+        "extends": "size",
+        "addedIn": "v1.18.5"
+      },
+
       "avatar": {
         "type": "String",
         "desc": "URL to an avatar/image; Suggestion: use public folder",
@@ -61,6 +71,16 @@
         "addedIn": "v1.14.0"
       },
 
+      "spinnerColor": {
+        "extends": "color",
+        "addedIn": "v1.18.5"
+      },
+
+      "spinnerSize": {
+        "extends": "size",
+        "addedIn": "v1.18.5"
+      },
+
       "position": {
         "type": "String",
         "desc": "Window side/corner to stick to",
@@ -215,6 +235,16 @@
               "extends": "icon"
             },
 
+            "iconColor": {
+              "extends": "color",
+              "addedIn": "v1.18.5"
+            },
+
+            "iconSize": {
+              "extends": "size",
+              "addedIn": "v1.18.5"
+            },
+
             "avatar": {
               "type": "String",
               "desc": "URL to an avatar/image; Suggestion: use public folder",
@@ -232,6 +262,16 @@
               "addedIn": "v1.14.0"
             },
 
+            "spinnerColor": {
+              "extends": "color",
+              "addedIn": "v1.18.5"
+            },
+
+            "spinnerSize": {
+              "extends": "size",
+              "addedIn": "v1.18.5"
+            },
+
             "position": {
               "type": "String",
               "desc": "Window side/corner to stick to",
@@ -413,6 +453,16 @@
                 "extends": "icon"
               },
 
+              "iconColor": {
+                "extends": "color",
+                "addedIn": "v1.18.5"
+              },
+
+              "iconSize": {
+                "extends": "size",
+                "addedIn": "v1.18.5"
+              },
+
               "avatar": {
                 "type": "String",
                 "desc": "URL to an avatar/image; Suggestion: use public folder",
@@ -430,6 +480,16 @@
                 "addedIn": "v1.14.0"
               },
 
+              "spinnerColor": {
+                "extends": "color",
+                "addedIn": "v1.18.5"
+              },
+
+              "spinnerSize": {
+                "extends": "size",
+                "addedIn": "v1.18.5"
+              },
+
               "progress": {
                 "type": "Boolean",
                 "desc": "Show progress bar to detail when notification will disappear automatically (unless timeout is 0)",
@@ -554,6 +614,16 @@
               "extends": "icon"
             },
 
+            "iconColor": {
+              "extends": "color",
+              "addedIn": "v1.18.5"
+            },
+
+            "iconSize": {
+              "extends": "size",
+              "addedIn": "v1.18.5"
+            },
+
             "avatar": {
               "type": "String",
               "desc": "URL to an avatar/image; Suggestion: use public folder",
@@ -571,6 +641,16 @@
               "addedIn": "v1.14.0"
             },
 
+            "spinnerColor": {
+              "extends": "color",
+              "addedIn": "v1.18.5"
+            },
+
+            "spinnerSize": {
+              "extends": "size",
+              "addedIn": "v1.18.5"
+            },
+
             "position": {
               "type": "String",
               "desc": "Window side/corner to stick to",
@@ -748,6 +828,16 @@
               "extends": "icon"
             },
 
+            "iconColor": {
+              "extends": "color",
+              "addedIn": "v1.18.5"
+            },
+
+            "iconSize": {
+              "extends": "size",
+              "addedIn": "v1.18.5"
+            },
+
             "avatar": {
               "type": "String",
               "desc": "URL to an avatar/image; Suggestion: use public folder",
@@ -765,6 +855,16 @@
               "addedIn": "v1.14.0"
             },
 
+            "spinnerColor": {
+              "extends": "color",
+              "addedIn": "v1.18.5"
+            },
+
+            "spinnerSize": {
+              "extends": "size",
+              "addedIn": "v1.18.5"
+            },
+
             "position": {
               "type": "String",
               "desc": "Window side/corner to stick to",

package/src/utils/extend.js

@@ -1,48 +1,20 @@
-const
-  toString = Object.prototype.toString,
-  hasOwn = Object.prototype.hasOwnProperty,
-  class2type = {}
-
-'Boolean Number String Function Array Date RegExp Object'.split(' ').forEach(name => {
-  class2type['[object ' + name + ']'] = name.toLowerCase()
-})
-
-function type (obj) {
-  return obj === null ? String(obj) : class2type[toString.call(obj)] || 'object'
-}
-
-function isPlainObject (obj) {
-  if (!obj || type(obj) !== 'object') {
-    return false
-  }
-
-  if (obj.constructor &&
-    !hasOwn.call(obj, 'constructor') &&
-    !hasOwn.call(obj.constructor.prototype, 'isPrototypeOf')) {
-    return false
-  }
-
-  let key
-  for (key in obj) {}
-
-  return key === void 0 || hasOwn.call(obj, key)
-}
+import { isObject } from './is'
 
 export default function extend () {
   let
     options, name, src, copy, copyIsArray, clone,
-    target = arguments[0] || {},
+    target = arguments[ 0 ] || {},
     i = 1,
     deep = false
   const length = arguments.length
 
   if (typeof target === 'boolean') {
     deep = target
-    target = arguments[1] || {}
+    target = arguments[ 1 ] || {}
     i = 2
   }
 
-  if (Object(target) !== target && type(target) !== 'function') {
+  if (Object(target) !== target && typeof target !== 'function') {
     target = {}
   }
 
@@ -52,28 +24,28 @@ export default function extend () {
   }
 
   for (; i < length; i++) {
-    if ((options = arguments[i]) !== null) {
+    if ((options = arguments[ i ]) !== null) {
       for (name in options) {
-        src = target[name]
-        copy = options[name]
+        src = target[ name ]
+        copy = options[ name ]
 
         if (target === copy) {
           continue
         }
 
-        if (deep && copy && (isPlainObject(copy) || (copyIsArray = type(copy) === 'array'))) {
+        if (deep && copy && (isObject(copy) === true || (copyIsArray = Array.isArray(copy) === true))) {
           if (copyIsArray) {
             copyIsArray = false
-            clone = src && type(src) === 'array' ? src : []
+            clone = src && Array.isArray(src) === true ? src : []
           }
           else {
-            clone = src && isPlainObject(src) ? src : {}
+            clone = src && isObject(src) === true ? src : {}
           }
 
-          target[name] = extend(deep, clone, copy)
+          target[ name ] = extend(deep, clone, copy)
         }
         else if (copy !== void 0) {
-          target[name] = copy
+          target[ name ] = copy
         }
       }
     }

package/src/utils/is.js

@@ -120,17 +120,11 @@ export function isDeepEqual (a, b) {
   return a !== a && b !== b // eslint-disable-line no-self-compare
 }
 
-export function isPrintableChar (v) {
-  return (v > 47 && v < 58) || // number keys
-    v === 32 || v === 13 || // spacebar & return key(s) (if you want to allow carriage returns)
-    (v > 64 && v < 91) || // letter keys
-    (v > 95 && v < 112) || // numpad keys
-    (v > 185 && v < 193) || // ;=,-./` (in order)
-    (v > 218 && v < 223)
-}
-
+// not perfect, but what we ARE interested is for Arrays not to slip in
+// as spread operator will mess things up in various areas
+// see https://jsbench.me/tbl0iliyax/1
 export function isObject (v) {
-  return Object(v) === v
+  return v !== null && typeof v === 'object' && Array.isArray(v) !== true
 }
 
 export function isDate (v) {
@@ -144,7 +138,3 @@ export function isRegexp (v) {
 export function isNumber (v) {
   return typeof v === 'number' && isFinite(v)
 }
-
-export function isString (v) {
-  return typeof v === 'string'
-}

package/src/utils/morph.js

@@ -1,4 +1,5 @@
 import { getElement } from './dom.js'
+import { isObject } from './is'
 
 let id = 0
 let offsetBase = void 0
@@ -433,7 +434,7 @@ export default function morph (_options) {
       if (typeof options.style === 'string') {
         elTo.style.cssText += ' ' + options.style
       }
-      else if (options.style === Object(options.style)) {
+      else if (isObject(options.style) === true) {
         for (const prop in options.style) {
           elTo.style[prop] = options.style[prop]
         }
@@ -870,8 +871,8 @@ export default function morph (_options) {
         elToClone.style.animation = `${options.duration}ms ${options.easing} ${options.delay}ms ${animationDirection} ${options.fill} ${qAnimId}-to`
         elTo.style.animation = `${options.duration}ms ${options.easing} ${options.delay}ms ${animationDirection} ${options.fill} ${qAnimId}`
 
-        const cleanup = ev => {
-          if (ev === Object(ev) && ev.animationName !== qAnimId) {
+        const cleanup = evt => {
+          if (evt === Object(evt) && evt.animationName !== qAnimId) {
             return
           }
 

package/src/utils/web-storage.js

@@ -1,10 +1,11 @@
 import { noop } from '../utils/event.js'
+import { isDate, isRegexp } from '../utils/is.js'
 
 function encode (value) {
-  if (Object.prototype.toString.call(value) === '[object Date]') {
+  if (isDate(value) === true) {
     return '__q_date|' + value.toUTCString()
   }
-  if (Object.prototype.toString.call(value) === '[object RegExp]') {
+  if (isRegexp(value) === true) {
     return '__q_expr|' + value.source
   }
   if (typeof value === 'number') {