quasar 2.5.4 → 2.5.5

package/src/components/slider/use-slider.js

@@ -7,7 +7,7 @@ import { useFormProps, useFormInject } from '../../composables/private/use-form.
 
 import { between } from '../../utils/format.js'
 import { position } from '../../utils/event.js'
-import { isNumber } from '../../utils/private/is.js'
+import { isNumber, isPlainObject } from '../../utils/private/is.js'
 import { hDir } from '../../utils/private/render.js'
 
 const markerPrefixClass = 'q-slider__marker-labels'
@@ -340,7 +340,7 @@ export default function ({ updateValue, updatePosition, getDragging, formAttrs }
     if (typeof def === 'function') {
       return markerTicks.value.map(value => {
         const item = def(value)
-        return Object(item) === item ? { ...item, value } : { value, label: item }
+        return isPlainObject(item) === true ? { ...item, value } : { value, label: item }
       })
     }
 
@@ -348,14 +348,14 @@ export default function ({ updateValue, updatePosition, getDragging, formAttrs }
 
     if (Array.isArray(def) === true) {
       return def
-        .map(item => (Object(item) === item ? item : { value: item }))
+        .map(item => (isPlainObject(item) === true ? item : { value: item }))
         .filter(filterFn)
     }
 
     return Object.keys(def).map(key => {
       const item = def[ key ]
       const value = Number(key)
-      return Object(item) === item ? { ...item, value } : { value, label: item }
+      return isPlainObject(item) === true ? { ...item, value } : { value, label: item }
     }).filter(filterFn)
   }
 

package/src/components/stepper/QStep.json

@@ -45,6 +45,7 @@
 
     "done-icon": {
       "extends": "icon",
+      "desc": "Icon name following Quasar convention; If 'none' (String) is used as value, then it will defer to prefix or the regular icon for this state; Make sure you have the icon library installed unless you are using 'img:' prefix",
       "category": "header"
     },
 
@@ -55,6 +56,7 @@
 
     "active-icon": {
       "extends": "icon",
+      "desc": "Icon name following Quasar convention; If 'none' (String) is used as value, then it will defer to prefix or the regular icon for this state; Make sure you have the icon library installed unless you are using 'img:' prefix",
       "category": "header"
     },
 
@@ -65,6 +67,7 @@
 
     "error-icon": {
       "extends": "icon",
+      "desc": "Icon name following Quasar convention; If 'none' (String) is used as value, then it will defer to prefix or the regular icon for this state; Make sure you have the icon library installed unless you are using 'img:' prefix",
       "category": "header"
     },
 

package/src/components/stepper/QStepper.json

@@ -54,6 +54,7 @@
 
     "done-icon": {
       "extends": "icon",
+      "desc": "Icon name following Quasar convention; If 'none' (String) is used as value, then it will defer to prefix or the regular icon for this state; Make sure you have the icon library installed unless you are using 'img:' prefix",
       "category": "header"
     },
 
@@ -64,6 +65,7 @@
 
     "active-icon": {
       "extends": "icon",
+      "desc": "Icon name following Quasar convention; If 'none' (String) is used as value, then it will defer to prefix or the regular icon for this state; Make sure you have the icon library installed unless you are using 'img:' prefix",
       "category": "header"
     },
 
@@ -74,6 +76,7 @@
 
     "error-icon": {
       "extends": "icon",
+      "desc": "Icon name following Quasar convention; If 'none' (String) is used as value, then it will defer to prefix or the regular icon for this state; Make sure you have the icon library installed unless you are using 'img:' prefix",
       "category": "header"
     },
 

package/src/components/stepper/QStepper.sass

@@ -52,6 +52,7 @@
     &--error
       color: var(--q-negative)
 
+    &--error-with-icon
       .q-stepper__dot
         background: transparent !important
         span

package/src/components/stepper/StepHeader.js

@@ -47,23 +47,36 @@ export default createComponent({
 
     const hasPrefix = computed(() => {
       return props.step.prefix
-        && isActive.value === false
-        && isError.value === false
-        && isDone.value === false
+        && (isActive.value === false || props.stepper.activeIcon === 'none')
+        && (isError.value === false || props.stepper.errorIcon === 'none')
+        && (isDone.value === false || props.stepper.doneIcon === 'none')
     })
 
     const icon = computed(() => {
+      const defaultIcon = props.step.icon || props.stepper.inactiveIcon
+
       if (isActive.value === true) {
-        return props.step.activeIcon || props.stepper.activeIcon || $q.iconSet.stepper.active
+        const icon = props.step.activeIcon || props.stepper.activeIcon
+        return icon === 'none'
+          ? defaultIcon
+          : icon || $q.iconSet.stepper.active
       }
+
       if (isError.value === true) {
-        return props.step.errorIcon || props.stepper.errorIcon || $q.iconSet.stepper.error
+        const icon = props.step.errorIcon || props.stepper.errorIcon
+        return icon === 'none'
+          ? defaultIcon
+          : icon || $q.iconSet.stepper.error
       }
+
       if (isDisable.value === false && isDone.value === true) {
-        return props.step.doneIcon || props.stepper.doneIcon || $q.iconSet.stepper.done
+        const icon = props.step.doneIcon || props.stepper.doneIcon
+        return icon === 'none'
+          ? defaultIcon
+          : icon || $q.iconSet.stepper.done
       }
 
-      return props.step.icon || props.stepper.inactiveIcon
+      return defaultIcon
     })
 
     const color = computed(() => {
@@ -90,7 +103,9 @@ export default createComponent({
     const classes = computed(() => {
       return 'q-stepper__tab col-grow flex items-center no-wrap relative-position'
         + (color.value !== void 0 ? ` text-${ color.value }` : '')
-        + (isError.value === true ? ' q-stepper__tab--error' : '')
+        + (isError.value === true
+          ? ' q-stepper__tab--error q-stepper__tab--error-with-' + (hasPrefix.value === true ? 'prefix' : 'icon')
+          : '')
         + (isActive.value === true ? ' q-stepper__tab--active' : '')
         + (isDone.value === true ? ' q-stepper__tab--done' : '')
         + (headerNav.value === true ? ' q-stepper__tab--navigation q-focusable q-hoverable' : '')

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

@@ -1,7 +1,7 @@
 import { computed } from 'vue'
 
 import { sortDate } from '../../utils/private/sort.js'
-import { isNumber, isDate } from '../../utils/private/is.js'
+import { isNumber, isDate, isPlainObject } from '../../utils/private/is.js'
 
 export const useTableSortProps = {
   sortMethod: Function,
@@ -73,7 +73,7 @@ export function useTableSort (props, computedPagination, colList, setPagination)
   function sort (col /* String(col name) or Object(col definition) */) {
     let sortOrder = props.columnSortOrder
 
-    if (col === Object(col)) {
+    if (isPlainObject(col) === true) {
       if (col.sortOrder) {
         sortOrder = col.sortOrder
       }

package/src/components/time/QTime.js

@@ -86,12 +86,14 @@ export default createComponent({
     const mask = computed(() => getMask())
     const locale = computed(() => getLocale())
 
+    const defaultDateModel = computed(() => getDefaultDateModel())
+
     const model = __splitDate(
       props.modelValue,
-      getMask(),
-      getLocale(),
+      mask.value, // initial mask
+      locale.value, // initial locale
       props.calendar,
-      getDefaultDateModel()
+      defaultDateModel.value
     )
 
     const view = ref(getViewByModel(model))
@@ -131,8 +133,6 @@ export default createComponent({
       }
     })
 
-    const defaultDateModel = computed(() => getDefaultDateModel())
-
     const computedFormat24h = computed(() => (
       props.format24h !== null
         ? props.format24h

package/src/install-quasar.js

@@ -10,6 +10,7 @@ import IconSet from './icon-set.js'
 
 import { quasarKey } from './utils/private/symbols.js'
 import { globalConfig, globalConfigIsFrozen, freezeGlobalConfig } from './utils/private/global-config.js'
+import { isPlainObject } from './utils/private/is.js'
 
 const autoInstalledPlugins = [
   Platform,
@@ -46,13 +47,13 @@ function prepareApp (app, uiOpts, pluginOpts) {
   installPlugins(pluginOpts, autoInstalledPlugins)
 
   uiOpts.components !== void 0 && Object.values(uiOpts.components).forEach(c => {
-    if (Object(c) === c && c.name !== void 0) {
+    if (isPlainObject(c) === true && c.name !== void 0) {
       app.component(c.name, c)
     }
   })
 
   uiOpts.directives !== void 0 && Object.values(uiOpts.directives).forEach(d => {
-    if (Object(d) === d && d.name !== void 0) {
+    if (isPlainObject(d) === true && d.name !== void 0) {
       app.directive(d.name, d)
     }
   })
@@ -74,45 +75,45 @@ function prepareApp (app, uiOpts, pluginOpts) {
 
 export default __QUASAR_SSR_SERVER__
   ? function (parentApp, opts = {}, ssrContext) {
-      const $q = {
-        version: __QUASAR_VERSION__,
-        config: opts.config || {}
-      }
-
-      Object.assign(ssrContext, {
-        $q,
-        _meta: {
-          htmlAttrs: '',
-          headTags: '',
-          endingHeadTags: '',
-          bodyClasses: '',
-          bodyAttrs: 'data-server-rendered',
-          bodyTags: ''
-        }
-      })
-
-      if (ssrContext._modules === void 0) {
-        // not OK. means the SSR build is not using @quasar/ssr-helpers,
-        // but we shouldn't crash the app
-        ssrContext._modules = []
-      }
+    const $q = {
+      version: __QUASAR_VERSION__,
+      config: opts.config || {}
+    }
 
-      if (ssrContext.onRendered === void 0) {
-        // not OK. means the SSR build is not using @quasar/ssr-helpers,
-        // but we shouldn't crash the app
-        ssrContext.onRendered = () => {}
+    Object.assign(ssrContext, {
+      $q,
+      _meta: {
+        htmlAttrs: '',
+        headTags: '',
+        endingHeadTags: '',
+        bodyClasses: '',
+        bodyAttrs: 'data-server-rendered',
+        bodyTags: ''
       }
+    })
 
-      parentApp.config.globalProperties.ssrContext = ssrContext
+    if (ssrContext._modules === void 0) {
+      // not OK. means the SSR build is not using @quasar/ssr-helpers,
+      // but we shouldn't crash the app
+      ssrContext._modules = []
+    }
 
-      prepareApp(parentApp, opts, {
-        parentApp,
-        $q,
-        lang: opts.lang,
-        iconSet: opts.iconSet,
-        ssrContext
-      })
+    if (ssrContext.onRendered === void 0) {
+      // not OK. means the SSR build is not using @quasar/ssr-helpers,
+      // but we shouldn't crash the app
+      ssrContext.onRendered = () => {}
     }
+
+    parentApp.config.globalProperties.ssrContext = ssrContext
+
+    prepareApp(parentApp, opts, {
+      parentApp,
+      $q,
+      lang: opts.lang,
+      iconSet: opts.iconSet,
+      ssrContext
+    })
+  }
   : function (parentApp, opts = {}) {
     const $q = { version: __QUASAR_VERSION__ }
 

package/src/plugins/Loading.js

@@ -5,6 +5,7 @@ import QSpinner from '../components/spinner/QSpinner.js'
 import defineReactivePlugin from '../utils/private/define-reactive-plugin.js'
 import { createGlobalNode, removeGlobalNode } from '../utils/private/global-nodes.js'
 import preventScroll from '../utils/prevent-scroll.js'
+import { isPlainObject } from '../utils/private/is.js'
 
 let
   app,
@@ -34,7 +35,7 @@ const Plugin = defineReactivePlugin({
   show (opts) {
     if (__QUASAR_SSR_SERVER__) { return }
 
-    props = opts === Object(opts) && opts.ignoreDefaults === true
+    props = isPlainObject(opts) === true && opts.ignoreDefaults === true
       ? { ...originalDefaults, ...opts }
       : { ...defaults, ...opts }
 
@@ -135,7 +136,7 @@ const Plugin = defineReactivePlugin({
 
   setDefaults (opts) {
     if (__QUASAR_SSR_SERVER__ !== true) {
-      opts === Object(opts) && Object.assign(defaults, opts)
+      isPlainObject(opts) === true && Object.assign(defaults, opts)
     }
   },
 

package/src/plugins/LoadingBar.js

@@ -6,6 +6,7 @@ import { createGlobalNode } from '../utils/private/global-nodes.js'
 import { createChildApp } from '../install-quasar.js'
 
 import QAjaxBar from '../components/ajax-bar/QAjaxBar.js'
+import { isPlainObject } from '../utils/private/is.js'
 
 const barRef = ref(null)
 
@@ -59,7 +60,7 @@ const Plugin = defineReactivePlugin({
         barRef.value.increment.apply(null, arguments)
       },
       setDefaults (opts) {
-        if (opts === Object(opts)) {
+        if (isPlainObject(opts) === true) {
           Object.assign(props.value, opts)
         }
       }

package/src/plugins/Notify.js

@@ -9,6 +9,7 @@ import { createComponent } from '../utils/private/create.js'
 import { noop } from '../utils/event.js'
 import { createGlobalNode } from '../utils/private/global-nodes.js'
 import { createChildApp } from '../install-quasar.js'
+import { isPlainObject } from '../utils/private/is.js'
 
 let uid = 0
 
@@ -72,7 +73,7 @@ function addNotification (config, $q, originalApi) {
     Object.assign(notif, defaults)
   }
 
-  if (Object(config) !== config) {
+  if (isPlainObject(config) === false) {
     if (notif.type) {
       Object.assign(notif, notifTypes[ notif.type ])
     }
@@ -396,7 +397,11 @@ function getComponent () {
           if (meta.hasMedia === true) {
             if (notif.spinner !== false) {
               mainChild.push(
-                h(notif.spinner, { class: 'q-notification__spinner q-notification__spinner--' + meta.leftClass })
+                h(notif.spinner, {
+                  class: 'q-notification__spinner q-notification__spinner--' + meta.leftClass,
+                  color: notif.spinnerColor,
+                  size: notif.spinnerSize
+                })
               )
             }
             else if (notif.icon) {
@@ -404,6 +409,8 @@ function getComponent () {
                 h(QIcon, {
                   class: 'q-notification__icon q-notification__icon--' + meta.leftClass,
                   name: notif.icon,
+                  color: notif.iconColor,
+                  size: notif.iconSize,
                   role: 'img'
                 })
               )
@@ -484,12 +491,12 @@ function getComponent () {
 export default {
   setDefaults (opts) {
     if (__QUASAR_SSR_SERVER__ !== true) {
-      opts === Object(opts) && Object.assign(defaults, opts)
+      isPlainObject(opts) === true && Object.assign(defaults, opts)
     }
   },
 
   registerType (typeName, typeOpts) {
-    if (__QUASAR_SSR_SERVER__ !== true && typeOpts === Object(typeOpts)) {
+    if (__QUASAR_SSR_SERVER__ !== true && isPlainObject(typeOpts) === true) {
       notifTypes[ typeName ] = typeOpts
     }
   },

package/src/plugins/Notify.json

@@ -43,6 +43,16 @@
         "extends": "icon"
       },
 
+      "iconColor": {
+        "extends": "color",
+        "addedIn": "v2.5.5"
+      },
+
+      "iconSize": {
+        "extends": "size",
+        "addedIn": "v2.5.5"
+      },
+
       "avatar": {
         "type": "String",
         "desc": "URL to an avatar/image; Suggestion: use public folder",
@@ -58,6 +68,16 @@
         "desc": "Useful for notifications that are updated; Displays the default Quasar spinner instead of an avatar or icon"
       },
 
+      "spinnerColor": {
+        "extends": "color",
+        "addedIn": "v2.5.5"
+      },
+
+      "spinnerSize": {
+        "extends": "size",
+        "addedIn": "v2.5.5"
+      },
+
       "position": {
         "type": "String",
         "desc": "Window side/corner to stick to",
@@ -202,6 +222,16 @@
               "extends": "icon"
             },
 
+            "iconColor": {
+              "extends": "color",
+              "addedIn": "v2.5.5"
+            },
+
+            "iconSize": {
+              "extends": "size",
+              "addedIn": "v2.5.5"
+            },
+
             "avatar": {
               "type": "String",
               "desc": "URL to an avatar/image; Suggestion: public folder",
@@ -218,6 +248,16 @@
               "examples": [ true, "QSpinnerBars" ]
             },
 
+            "spinnerColor": {
+              "extends": "color",
+              "addedIn": "v2.5.5"
+            },
+
+            "spinnerSize": {
+              "extends": "size",
+              "addedIn": "v2.5.5"
+            },
+
             "position": {
               "type": "String",
               "desc": "Window side/corner to stick to",
@@ -388,6 +428,16 @@
                 "extends": "icon"
               },
 
+              "iconColor": {
+                "extends": "color",
+                "addedIn": "v2.5.5"
+              },
+
+              "iconSize": {
+                "extends": "size",
+                "addedIn": "v2.5.5"
+              },
+
               "avatar": {
                 "type": "String",
                 "desc": "URL to an avatar/image; Suggestion: use public folder",
@@ -404,6 +454,16 @@
                 "__exemption": [ "examples" ]
               },
 
+              "spinnerColor": {
+                "extends": "color",
+                "addedIn": "v2.5.5"
+              },
+
+              "spinnerSize": {
+                "extends": "size",
+                "addedIn": "v2.5.5"
+              },
+
               "progress": {
                 "type": "Boolean",
                 "desc": "Show progress bar to detail when notification will disappear automatically (unless timeout is 0)"
@@ -523,6 +583,16 @@
               "extends": "icon"
             },
 
+            "iconColor": {
+              "extends": "color",
+              "addedIn": "v2.5.5"
+            },
+
+            "iconSize": {
+              "extends": "size",
+              "addedIn": "v2.5.5"
+            },
+
             "avatar": {
               "type": "String",
               "desc": "URL to an avatar/image; Suggestion: use public folder",
@@ -531,7 +601,7 @@
                 "(relative path format) require('./my_img.jpg')",
                 "(URL) https://some-site.net/some-img.gif"
               ]
-          },
+            },
 
             "spinner": {
               "type": [ "Boolean", "Component" ],
@@ -539,6 +609,16 @@
               "__exemption": [ "examples" ]
             },
 
+            "spinnerColor": {
+              "extends": "color",
+              "addedIn": "v2.5.5"
+            },
+
+            "spinnerSize": {
+              "extends": "size",
+              "addedIn": "v2.5.5"
+            },
+
             "position": {
               "type": "String",
               "desc": "Window side/corner to stick to",
@@ -706,6 +786,16 @@
               "extends": "icon"
             },
 
+            "iconColor": {
+              "extends": "color",
+              "addedIn": "v2.5.5"
+            },
+
+            "iconSize": {
+              "extends": "size",
+              "addedIn": "v2.5.5"
+            },
+
             "avatar": {
               "type": "String",
               "desc": "URL to an avatar/image; Suggestion: use public folder",
@@ -714,7 +804,7 @@
                 "(relative path format) require('./my_img.jpg')",
                 "(URL) https://some-site.net/some-img.gif"
               ]
-          },
+            },
 
             "spinner": {
               "type": [ "Boolean", "Component" ],
@@ -722,6 +812,16 @@
               "__exemption": [ "examples" ]
             },
 
+            "spinnerColor": {
+              "extends": "color",
+              "addedIn": "v2.5.5"
+            },
+
+            "spinnerSize": {
+              "extends": "size",
+              "addedIn": "v2.5.5"
+            },
+
             "position": {
               "type": "String",
               "desc": "Window side/corner to stick to",

package/src/utils/create-uploader-component.js

@@ -2,6 +2,7 @@ import { coreProps, coreEmits, getRenderer } from '../components/uploader/upload
 
 import { createComponent } from './private/create.js'
 import getEmitsObject from './private/get-emits-object.js'
+import { isPlainObject } from './private/is.js'
 
 const coreEmitsObject = getEmitsObject(coreEmits)
 
@@ -13,7 +14,7 @@ export default ({ name, props, emits, injectPlugin }) => createComponent({
     ...props
   },
 
-  emits: Object(emits) === emits
+  emits: isPlainObject(emits) === true
     ? { ...coreEmitsObject, ...emits }
     : [ ...coreEmits, ...emits ],
 

package/src/utils/extend.js

@@ -1,32 +1,4 @@
-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) {} // eslint-disable-line
-
-  return key === undefined || hasOwn.call(obj, key)
-}
+import { isPlainObject } from './private/is'
 
 export default function extend () {
   let
@@ -42,7 +14,7 @@ export default function extend () {
     i = 2
   }
 
-  if (Object(target) !== target && type(target) !== 'function') {
+  if (Object(target) !== target && typeof target !== 'function') {
     target = {}
   }
 
@@ -61,18 +33,18 @@ export default function extend () {
           continue
         }
 
-        if (deep && copy && (isPlainObject(copy) || (copyIsArray = type(copy) === 'array'))) {
+        if (deep && copy && (isPlainObject(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 && isPlainObject(src) === true ? src : {}
           }
 
           target[ name ] = extend(deep, clone, copy)
         }
-        else if (copy !== undefined) {
+        else if (copy !== void 0) {
           target[ name ] = copy
         }
       }