quasar 2.18.6 → 2.19.0

package/src/plugins/loading-bar/LoadingBar.js

@@ -10,68 +10,73 @@ import { isObject } from '../../utils/is/is.js'
 
 const barRef = ref(null)
 
-const Plugin = createReactivePlugin({
-  isActive: false
-}, {
-  start: noop,
-  stop: noop,
-  increment: noop,
-  setDefaults: noop,
-
-  install ({ $q, parentApp }) {
-    $q.loadingBar = this
-
-    if (__QUASAR_SSR_SERVER__) return
-
-    if (this.__installed === true) {
-      if ($q.config.loadingBar !== void 0) {
-        this.setDefaults($q.config.loadingBar)
+const Plugin = createReactivePlugin(
+  {
+    isActive: false
+  },
+  {
+    start: noop,
+    stop: noop,
+    increment: noop,
+    setDefaults: noop,
+
+    install({ $q, parentApp }) {
+      $q.loadingBar = this
+
+      if (__QUASAR_SSR_SERVER__) return
+
+      if (this.__installed === true) {
+        if ($q.config.loadingBar !== void 0) {
+          this.setDefaults($q.config.loadingBar)
+        }
+        return
       }
-      return
-    }
 
-    const props = ref(
-      $q.config.loadingBar !== void 0
-        ? { ...$q.config.loadingBar }
-        : {}
-    )
+      const props = ref(
+        $q.config.loadingBar !== void 0 ? { ...$q.config.loadingBar } : {}
+      )
 
-    function onStart () {
-      Plugin.isActive = true
-    }
+      function onStart() {
+        Plugin.isActive = true
+      }
 
-    function onStop () {
-      Plugin.isActive = false
-    }
+      function onStop() {
+        Plugin.isActive = false
+      }
 
-    const el = createGlobalNode('q-loading-bar')
-
-    createChildApp({
-      name: 'LoadingBar',
-
-      // hide App from Vue devtools
-      devtools: { hide: true },
-
-      setup: () => () => h(QAjaxBar, { ...props.value, onStart, onStop, ref: barRef })
-    }, parentApp).mount(el)
-
-    Object.assign(this, {
-      start (speed) {
-        barRef.value.start(speed)
-      },
-      stop () {
-        barRef.value.stop()
-      },
-      increment () {
-        barRef.value.increment.apply(null, arguments)
-      },
-      setDefaults (opts) {
-        if (isObject(opts) === true) {
-          Object.assign(props.value, opts)
+      const el = createGlobalNode('q-loading-bar')
+
+      createChildApp(
+        {
+          name: 'LoadingBar',
+
+          // hide App from Vue devtools
+          devtools: { hide: true },
+
+          setup: () => () =>
+            h(QAjaxBar, { ...props.value, onStart, onStop, ref: barRef })
+        },
+        parentApp
+      ).mount(el)
+
+      Object.assign(this, {
+        start(speed) {
+          barRef.value.start(speed)
+        },
+        stop() {
+          barRef.value.stop()
+        },
+        increment() {
+          barRef.value.increment.apply(null, arguments)
+        },
+        setDefaults(opts) {
+          if (isObject(opts) === true) {
+            Object.assign(props.value, opts)
+          }
         }
-      }
-    })
+      })
+    }
   }
-})
+)
 
 export default Plugin

package/src/plugins/loading-bar/LoadingBar.json

@@ -10,7 +10,7 @@
     "type": "Object",
     "tsType": "QLoadingBarOptions",
     "desc": "QAjaxBar component props, EXCEPT for 'hijack-filter' in quasar.config file (if using Quasar CLI)",
-    "examples": [ "{ position: 'bottom', reverse: true }" ]
+    "examples": ["{ position: 'bottom', reverse: true }"]
   },
 
   "props": {
@@ -59,7 +59,7 @@
           "tsType": "QLoadingBarOptions",
           "required": true,
           "desc": "QAjaxBar component props",
-          "examples": [ "{ position: 'bottom', reverse: true }" ]
+          "examples": ["{ position: 'bottom', reverse: true }"]
         }
       },
       "returns": null

package/src/plugins/meta/Meta.js

@@ -1,10 +1,11 @@
 import { isRuntimeSsrPreHydration } from '../platform/Platform.js'
 import extend from '../../utils/extend/extend.js'
 
-let updateId = null, currentClientMeta
+let updateId = null,
+  currentClientMeta
 export const clientList = []
 
-function normalize (meta) {
+function normalize(meta) {
   if (meta.title) {
     meta.title = meta.titleTemplate
       ? meta.titleTemplate(meta.title)
@@ -12,20 +13,21 @@ function normalize (meta) {
     delete meta.titleTemplate
   }
 
-  ;[ [ 'meta', 'content' ], [ 'link', 'href' ] ].forEach(type => {
-    const
-      metaType = meta[ type[ 0 ] ],
-      metaProp = type[ 1 ]
+  ;[
+    ['meta', 'content'],
+    ['link', 'href']
+  ].forEach(type => {
+    const metaType = meta[type[0]],
+      metaProp = type[1]
 
     for (const name in metaType) {
-      const metaLink = metaType[ name ]
+      const metaLink = metaType[name]
 
       if (metaLink.template) {
         if (Object.keys(metaLink).length === 1) {
-          delete metaType[ name ]
-        }
-        else {
-          metaLink[ metaProp ] = metaLink.template(metaLink[ metaProp ] || '')
+          delete metaType[name]
+        } else {
+          metaLink[metaProp] = metaLink.template(metaLink[metaProp] || '')
           delete metaLink.template
         }
       }
@@ -33,27 +35,28 @@ function normalize (meta) {
   })
 }
 
-function changed (old, def) {
+function changed(old, def) {
   if (Object.keys(old).length !== Object.keys(def).length) {
     return true
   }
   for (const key in old) {
-    if (old[ key ] !== def[ key ]) {
+    if (old[key] !== def[key]) {
       return true
     }
   }
 }
 
-function bodyFilter (name) {
-  return [ 'class', 'style' ].includes(name) === false
+function bodyFilter(name) {
+  return ['class', 'style'].includes(name) === false
 }
 
-function htmlFilter (name) {
-  return [ 'lang', 'dir' ].includes(name) === false
+function htmlFilter(name) {
+  return ['lang', 'dir'].includes(name) === false
 }
 
-function diff (meta, other) {
-  const add = {}, remove = {}
+function diff(meta, other) {
+  const add = {},
+    remove = {}
 
   if (meta === void 0) {
     return { add: other, remove }
@@ -63,29 +66,29 @@ function diff (meta, other) {
     add.title = other.title
   }
 
-  ;[ 'meta', 'link', 'script', 'htmlAttr', 'bodyAttr' ].forEach(type => {
-    const old = meta[ type ], cur = other[ type ]
-    remove[ type ] = []
+  ;['meta', 'link', 'script', 'htmlAttr', 'bodyAttr'].forEach(type => {
+    const old = meta[type],
+      cur = other[type]
+    remove[type] = []
 
     if (old === void 0 || old === null) {
-      add[ type ] = cur
+      add[type] = cur
       return
     }
 
-    add[ type ] = {}
+    add[type] = {}
 
     for (const key in old) {
       if (cur.hasOwnProperty(key) === false) {
-        remove[ type ].push(key)
+        remove[type].push(key)
       }
     }
     for (const key in cur) {
       if (old.hasOwnProperty(key) === false) {
-        add[ type ][ key ] = cur[ key ]
-      }
-      else if (changed(old[ key ], cur[ key ]) === true) {
-        remove[ type ].push(key)
-        add[ type ][ key ] = cur[ key ]
+        add[type][key] = cur[key]
+      } else if (changed(old[key], cur[key]) === true) {
+        remove[type].push(key)
+        add[type][key] = cur[key]
       }
     }
   })
@@ -93,15 +96,15 @@ function diff (meta, other) {
   return { add, remove }
 }
 
-function apply ({ add, remove }) {
+function apply({ add, remove }) {
   if (add.title) {
     document.title = add.title
   }
 
   if (Object.keys(remove).length !== 0) {
-    [ 'meta', 'link', 'script' ].forEach(type => {
-      remove[ type ].forEach(name => {
-        document.head.querySelector(`${ type }[data-qmeta="${ name }"]`).remove()
+    ;['meta', 'link', 'script'].forEach(type => {
+      remove[type].forEach(name => {
+        document.head.querySelector(`${type}[data-qmeta="${name}"]`).remove()
       })
     })
     remove.htmlAttr.filter(htmlFilter).forEach(name => {
@@ -112,61 +115,65 @@ function apply ({ add, remove }) {
     })
   }
 
-  ;[ 'meta', 'link', 'script' ].forEach(type => {
-    const metaType = add[ type ]
+  ;['meta', 'link', 'script'].forEach(type => {
+    const metaType = add[type]
 
     for (const name in metaType) {
       const tag = document.createElement(type)
-      for (const att in metaType[ name ]) {
+      for (const att in metaType[name]) {
         if (att !== 'innerHTML') {
-          tag.setAttribute(att, metaType[ name ][ att ])
+          tag.setAttribute(att, metaType[name][att])
         }
       }
       tag.setAttribute('data-qmeta', name)
       if (type === 'script') {
-        tag.innerHTML = metaType[ name ].innerHTML || ''
+        tag.innerHTML = metaType[name].innerHTML || ''
       }
       document.head.appendChild(tag)
     }
   })
-  Object.keys(add.htmlAttr).filter(htmlFilter).forEach(name => {
-    document.documentElement.setAttribute(name, add.htmlAttr[ name ] || '')
-  })
-  Object.keys(add.bodyAttr).filter(bodyFilter).forEach(name => {
-    document.body.setAttribute(name, add.bodyAttr[ name ] || '')
-  })
+  Object.keys(add.htmlAttr)
+    .filter(htmlFilter)
+    .forEach(name => {
+      document.documentElement.setAttribute(name, add.htmlAttr[name] || '')
+    })
+  Object.keys(add.bodyAttr)
+    .filter(bodyFilter)
+    .forEach(name => {
+      document.body.setAttribute(name, add.bodyAttr[name] || '')
+    })
 }
 
-function getAttr (seed) {
+function getAttr(seed) {
   return att => {
-    const val = seed[ att ]
-    return att + (val !== true && val !== void 0 ? `="${ val }"` : '')
+    const val = seed[att]
+    return att + (val !== true && val !== void 0 ? `="${val}"` : '')
   }
 }
 
-function getHead (meta) {
+function getHead(meta) {
   let output = ''
   if (meta.title) {
-    output += `<title>${ meta.title }</title>`
+    output += `<title>${meta.title}</title>`
   }
-  ;[ 'meta', 'link', 'script' ].forEach(type => {
-    const metaType = meta[ type ]
+  ;['meta', 'link', 'script'].forEach(type => {
+    const metaType = meta[type]
 
     for (const att in metaType) {
-      const attrs = Object.keys(metaType[ att ])
-        .filter(att => att !== 'innerHTML')
-        .map(getAttr(metaType[ att ]))
+      const attrs = Object.keys(metaType[att])
+        .filter(item => item !== 'innerHTML')
+        .map(getAttr(metaType[att]))
 
-      output += `<${ type } ${ attrs.join(' ') } data-qmeta="${ att }">`
+      output += `<${type} ${attrs.join(' ')} data-qmeta="${att}">`
       if (type === 'script') {
-        output += (metaType[ att ].innerHTML || '') + '</script>'
+        output += (metaType[att].innerHTML || '') + '</script>'
       }
     }
   })
   return output
 }
 
-function injectServerMeta (ssrContext) {
+function injectServerMeta(ssrContext) {
   const data = {
     title: '',
     titleTemplate: null,
@@ -180,24 +187,22 @@ function injectServerMeta (ssrContext) {
   const list = ssrContext.__qMetaList
 
   for (let i = 0; i < list.length; i++) {
-    extend(true, data, list[ i ])
+    extend(true, data, list[i])
   }
 
   normalize(data)
 
-  const nonce = ssrContext.nonce !== void 0
-    ? ` nonce="${ ssrContext.nonce }"`
-    : ''
+  const nonce =
+    ssrContext.nonce !== void 0 ? ` nonce="${ssrContext.nonce}"` : ''
 
   const ctx = ssrContext._meta
 
   const htmlAttr = Object.keys(data.htmlAttr).filter(htmlFilter)
 
   if (htmlAttr.length !== 0) {
-    ctx.htmlAttrs += (
-      (ctx.htmlAttrs.length !== 0 ? ' ' : '')
-      + htmlAttr.map(getAttr(data.htmlAttr)).join(' ')
-    )
+    ctx.htmlAttrs +=
+      (ctx.htmlAttrs.length !== 0 ? ' ' : '') +
+      htmlAttr.map(getAttr(data.htmlAttr)).join(' ')
   }
 
   ctx.headTags += getHead(data)
@@ -205,19 +210,22 @@ function injectServerMeta (ssrContext) {
   const bodyAttr = Object.keys(data.bodyAttr).filter(bodyFilter)
 
   if (bodyAttr.length !== 0) {
-    ctx.bodyAttrs += (
-      (ctx.bodyAttrs.length !== 0 ? ' ' : '')
-      + bodyAttr.map(getAttr(data.bodyAttr)).join(' ')
-    )
+    ctx.bodyAttrs +=
+      (ctx.bodyAttrs.length !== 0 ? ' ' : '') +
+      bodyAttr.map(getAttr(data.bodyAttr)).join(' ')
   }
 
-  ctx.bodyTags += Object.keys(data.noscript)
-    .map(name => `<noscript data-qmeta="${ name }">${ data.noscript[ name ] }</noscript>`)
-    .join('')
-    + `<script${ nonce } id="qmeta-init">window.__Q_META__=${ delete data.noscript && JSON.stringify(data) }</script>`
+  ctx.bodyTags +=
+    Object.keys(data.noscript)
+      .map(
+        name =>
+          `<noscript data-qmeta="${name}">${data.noscript[name]}</noscript>`
+      )
+      .join('') +
+    `<script${nonce} id="qmeta-init">window.__Q_META__=${delete data.noscript && JSON.stringify(data)}</script>`
 }
 
-function updateClientMeta () {
+function updateClientMeta() {
   updateId = null
 
   const data = {
@@ -231,7 +239,7 @@ function updateClientMeta () {
   }
 
   for (let i = 0; i < clientList.length; i++) {
-    const { active, val } = clientList[ i ]
+    const { active, val } = clientList[i]
 
     if (active === true) {
       extend(true, data, val)
@@ -244,13 +252,13 @@ function updateClientMeta () {
   currentClientMeta = data
 }
 
-export function planClientUpdate () {
-  updateId !== null && clearTimeout(updateId)
+export function planClientUpdate() {
+  if (updateId !== null) clearTimeout(updateId)
   updateId = setTimeout(updateClientMeta, 50)
 }
 
 export default {
-  install (opts) {
+  install(opts) {
     if (__QUASAR_SSR_SERVER__) {
       const { ssrContext } = opts
 
@@ -258,8 +266,10 @@ export default {
       ssrContext.onRendered(() => {
         injectServerMeta(ssrContext)
       })
-    }
-    else if (this.__installed !== true && isRuntimeSsrPreHydration.value === true) {
+    } else if (
+      this.__installed !== true &&
+      isRuntimeSsrPreHydration.value === true
+    ) {
       currentClientMeta = window.__Q_META__
       document.getElementById('qmeta-init').remove()
     }