quasar 2.5.1 → 2.5.5

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/plugins/Screen.js

@@ -1,4 +1,4 @@
-import { isRuntimeSsrPreHydration } from './Platform.js'
+import { isRuntimeSsrPreHydration, client } from './Platform.js'
 
 import defineReactivePlugin from '../utils/private/define-reactive-plugin.js'
 import { listenOpts, noop } from '../utils/event.js'
@@ -60,11 +60,15 @@ export default defineReactivePlugin({
 
     const { visualViewport } = window
     const target = visualViewport || window
-    const getSize = visualViewport === void 0
-      ? () => [ window.innerWidth, window.innerHeight ]
+    const scrollingElement = document.scrollingElement || document.documentElement
+    const getSize = visualViewport === void 0 || client.is.mobile === true
+      ? () => [
+          Math.max(window.innerWidth, scrollingElement.clientWidth),
+          Math.max(window.innerHeight, scrollingElement.clientHeight)
+        ]
       : () => [
-          visualViewport.width * visualViewport.scale + window.innerWidth - document.scrollingElement.clientWidth,
-          visualViewport.height * visualViewport.scale + window.innerHeight - document.scrollingElement.clientHeight
+          visualViewport.width * visualViewport.scale + window.innerWidth - scrollingElement.clientWidth,
+          visualViewport.height * visualViewport.scale + window.innerHeight - scrollingElement.clientHeight
         ]
 
     const classes = $q.config.screen !== void 0 && $q.config.screen.bodyClasses === true

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
         }
       }

package/src/utils/morph.js

@@ -1,3 +1,5 @@
+import { isPlainObject } from './private/is'
+
 let id = 0
 let offsetBase = void 0
 
@@ -443,7 +445,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 (isPlainObject(options.style) === true) {
         for (const prop in options.style) {
           elTo.style[ prop ] = options.style[ prop ]
         }
@@ -880,8 +882,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
           }
 
@@ -944,24 +946,24 @@ export default function morph (_options) {
         : (
             options.waitFor === 'transitionend'
               ? new Promise(resolve => {
-                  const timer = setTimeout(() => {
-                    endFn()
-                  }, 400)
-
-                  const endFn = ev => {
-                    clearTimeout(timer)
+                const timer = setTimeout(() => {
+                  endFn()
+                }, 400)
 
-                    if (elTo) {
-                      elTo.removeEventListener('transitionend', endFn)
-                      elTo.removeEventListener('transitioncancel', endFn)
-                    }
+                const endFn = ev => {
+                  clearTimeout(timer)
 
-                    resolve()
+                  if (elTo) {
+                    elTo.removeEventListener('transitionend', endFn)
+                    elTo.removeEventListener('transitioncancel', endFn)
                   }
 
-                  elTo.addEventListener('transitionend', endFn)
-                  elTo.addEventListener('transitioncancel', endFn)
-                })
+                  resolve()
+                }
+
+                elTo.addEventListener('transitionend', endFn)
+                elTo.addEventListener('transitioncancel', endFn)
+              })
               : options.waitFor
           )
 

package/src/utils/private/is.js

@@ -120,17 +120,8 @@ 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)
-}
-
-export function isObject (v) {
-  return Object(v) === v
+export function isPlainObject (v) {
+  return Object.prototype.toString.call(v) === '[object Object]'
 }
 
 export function isDate (v) {
@@ -144,7 +135,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/private/web-storage.js

@@ -1,10 +1,11 @@
 import { noop } from '../event.js'
+import { isDate, isRegexp } from './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') {