quasar 2.11.2 → 2.11.4

package/src/components/slide-item/QSlideItem.js

@@ -40,7 +40,7 @@ export default createComponent({
 
     const contentRef = ref(null)
 
-    let timer, pan = {}, dirRefs = {}, dirContentRefs = {}
+    let timer = null, pan = {}, dirRefs = {}, dirContentRefs = {}
 
     const langDir = computed(() => (
       $q.lang.rtl === true
@@ -91,7 +91,9 @@ export default createComponent({
         if (pan.scale === 1) {
           node.style.transform = `translate${ pan.axis }(${ pan.dir * 100 }%)`
 
+          timer !== null && clearTimeout(timer)
           timer = setTimeout(() => {
+            timer = null
             emit(pan.showing, { reset })
             emit('action', { side: pan.showing, reset })
           }, 230)
@@ -162,7 +164,7 @@ export default createComponent({
     })
 
     onBeforeUnmount(() => {
-      clearTimeout(timer)
+      timer !== null && clearTimeout(timer)
     })
 
     // expose public methods

package/src/components/slide-transition/QSlideTransition.js

@@ -17,15 +17,23 @@ export default createComponent({
 
   setup (props, { slots, emit }) {
     let animating = false, doneFn, element
-    let timer, timerFallback, animListener, lastEvent
+    let timer = null, timerFallback = null, animListener, lastEvent
 
     function cleanup () {
       doneFn && doneFn()
       doneFn = null
       animating = false
 
-      clearTimeout(timer)
-      clearTimeout(timerFallback)
+      if (timer !== null) {
+        clearTimeout(timer)
+        timer = null
+      }
+
+      if (timerFallback !== null) {
+        clearTimeout(timerFallback)
+        timerFallback = null
+      }
+
       element !== void 0 && element.removeEventListener('transitionend', animListener)
       animListener = null
     }
@@ -64,8 +72,11 @@ export default createComponent({
       begin(el, pos, done)
 
       timer = setTimeout(() => {
+        timer = null
         el.style.height = `${ el.scrollHeight }px`
         animListener = evt => {
+          timerFallback = null
+
           if (Object(evt) !== evt || evt.target === el) {
             end(el, 'show')
           }
@@ -90,8 +101,11 @@ export default createComponent({
       begin(el, pos, done)
 
       timer = setTimeout(() => {
+        timer = null
         el.style.height = 0
         animListener = evt => {
+          timerFallback = null
+
           if (Object(evt) !== evt || evt.target === el) {
             end(el, 'hide')
           }

package/src/components/tabs/QTabs.js

@@ -88,7 +88,7 @@ export default createComponent({
     const tabDataListLen = ref(0)
     const hasFocus = ref(false)
 
-    let animateTimer, scrollTimer, unwatchRoute
+    let animateTimer = null, scrollTimer = null, unwatchRoute
 
     const tabProps = computed(() => ({
       activeClass: props.activeClass,
@@ -224,7 +224,10 @@ export default createComponent({
           oldEl = oldTab.tabIndicatorRef.value,
           newEl = newTab.tabIndicatorRef.value
 
-        clearTimeout(animateTimer)
+        if (animateTimer !== null) {
+          clearTimeout(animateTimer)
+          animateTimer = null
+        }
 
         oldEl.style.transition = 'none'
         oldEl.style.transform = 'none'
@@ -242,6 +245,7 @@ export default createComponent({
         // allow scope updates to kick in (QRouteTab needs more time)
         registerAnimateTick(() => {
           animateTimer = setTimeout(() => {
+            animateTimer = null
             newEl.style.transition = 'transform .25s cubic-bezier(.4, 0, .2, 1)'
             newEl.style.transform = 'none'
           }, 70)
@@ -294,7 +298,7 @@ export default createComponent({
     }
 
     function animScrollTo (value) {
-      stopAnimScroll()
+      scrollTimer !== null && clearInterval(scrollTimer)
       scrollTimer = setInterval(() => {
         if (scrollTowards(value) === true) {
           stopAnimScroll()
@@ -311,7 +315,10 @@ export default createComponent({
     }
 
     function stopAnimScroll () {
-      clearInterval(scrollTimer)
+      if (scrollTimer !== null) {
+        clearInterval(scrollTimer)
+        scrollTimer = null
+      }
     }
 
     function onKbdNavigate (keyCode, fromEl) {
@@ -615,7 +622,7 @@ export default createComponent({
     provide(tabsKey, $tabs)
 
     function cleanup () {
-      clearTimeout(animateTimer)
+      animateTimer !== null && clearTimeout(animateTimer)
       stopAnimScroll()
       unwatchRoute !== void 0 && unwatchRoute()
     }

package/src/components/tooltip/QTooltip.js

@@ -107,7 +107,7 @@ export default createComponent({
 
     Object.assign(anchorEvents, { delayShow, delayHide })
 
-    const { showPortal, hidePortal, renderPortal } = usePortal(vm, innerRef, renderPortalContent)
+    const { showPortal, hidePortal, renderPortal } = usePortal(vm, innerRef, renderPortalContent, 'tooltip')
 
     // if we're on mobile, let's improve the experience
     // by closing it when user taps outside of it

package/src/composables/private/use-anchor.js

@@ -21,7 +21,7 @@ export default function ({
 
   const anchorEl = ref(null)
 
-  let touchTimer
+  let touchTimer = null
 
   function canShow (evt) {
     // abort with no parent configured or on multi-touch
@@ -80,6 +80,7 @@ export default function ({
         ])
 
         touchTimer = setTimeout(() => {
+          touchTimer = null
           proxy.show(evt)
           evt.qAnchorHandled = true
         }, 300)
@@ -87,7 +88,11 @@ export default function ({
 
       mobileCleanup (evt) {
         anchorEl.value.classList.remove('non-selectable')
-        clearTimeout(touchTimer)
+
+        if (touchTimer !== null) {
+          clearTimeout(touchTimer)
+          touchTimer = null
+        }
 
         if (showing.value === true && evt !== void 0) {
           clearSelection()
@@ -201,7 +206,7 @@ export default function ({
   })
 
   onBeforeUnmount(() => {
-    clearTimeout(touchTimer)
+    touchTimer !== null && clearTimeout(touchTimer)
     unconfigureAnchorEl()
   })
 

package/src/composables/private/use-field.js

@@ -122,7 +122,7 @@ export default function (state) {
   const { props, emit, slots, attrs, proxy } = getCurrentInstance()
   const { $q } = proxy
 
-  let focusoutTimer
+  let focusoutTimer = null
 
   if (state.hasValue === void 0) {
     state.hasValue = computed(() => fieldValueIsFilled(props.modelValue))
@@ -288,7 +288,11 @@ export default function (state) {
   }
 
   function onControlFocusin (e) {
-    clearTimeout(focusoutTimer)
+    if (focusoutTimer !== null) {
+      clearTimeout(focusoutTimer)
+      focusoutTimer = null
+    }
+
     if (state.editable.value === true && state.focused.value === false) {
       state.focused.value = true
       emit('focus', e)
@@ -296,8 +300,10 @@ export default function (state) {
   }
 
   function onControlFocusout (e, then) {
-    clearTimeout(focusoutTimer)
+    focusoutTimer !== null && clearTimeout(focusoutTimer)
     focusoutTimer = setTimeout(() => {
+      focusoutTimer = null
+
       if (
         document.hasFocus() === true && (
           state.hasPopupOpen === true
@@ -547,7 +553,7 @@ export default function (state) {
   })
 
   onBeforeUnmount(() => {
-    clearTimeout(focusoutTimer)
+    focusoutTimer !== null && clearTimeout(focusoutTimer)
   })
 
   // expose public methods

package/src/composables/private/use-portal.js

@@ -26,7 +26,7 @@ function isOnGlobalDialog (vm) {
 // Warning!
 // You MUST specify "inheritAttrs: false" in your component
 
-export default function (vm, innerRef, renderPortalContent, checkGlobalDialog) {
+export default function (vm, innerRef, renderPortalContent, type) {
   // showing, including while in show/hide transition
   const portalIsActive = ref(false)
 
@@ -46,7 +46,7 @@ export default function (vm, innerRef, renderPortalContent, checkGlobalDialog) {
 
   let portalEl = null
   const focusObj = {}
-  const onGlobalDialog = checkGlobalDialog === true && isOnGlobalDialog(vm)
+  const onGlobalDialog = type === 'dialog' && isOnGlobalDialog(vm)
 
   function showPortal (isReady) {
     if (isReady === true) {
@@ -59,7 +59,7 @@ export default function (vm, innerRef, renderPortalContent, checkGlobalDialog) {
 
     if (portalIsActive.value === false) {
       if (onGlobalDialog === false && portalEl === null) {
-        portalEl = createGlobalNode()
+        portalEl = createGlobalNode(false, type)
       }
 
       portalIsActive.value = true

package/src/composables/private/use-timeout.js

@@ -9,11 +9,14 @@ import { vmIsDestroyed } from '../../utils/private/vm'
  */
 
 export default function () {
-  let timer
+  let timer = null
   const vm = getCurrentInstance()
 
   function removeTimeout () {
-    clearTimeout(timer)
+    if (timer !== null) {
+      clearTimeout(timer)
+      timer = null
+    }
   }
 
   onDeactivated(removeTimeout)
@@ -23,7 +26,7 @@ export default function () {
     removeTimeout,
 
     registerTimeout (fn, delay) {
-      clearTimeout(timer)
+      removeTimeout(timer)
 
       if (vmIsDestroyed(vm) === false) {
         timer = setTimeout(fn, delay)

package/src/css/core/visibility.sass

@@ -40,6 +40,8 @@
   visibility: hidden !important
   transition: none !important
   animation: none !important
+.invisible svg *
+  display: none
 .transparent
   background: transparent !important
 

package/src/directives/TouchHold.js

@@ -74,6 +74,7 @@ export default createDirective(__QUASAR_SSR_SERVER__
               : ctx.touchSensitivity
 
             ctx.timer = setTimeout(() => {
+              ctx.timer = void 0
               clearSelection()
               ctx.triggered = true
 
@@ -90,10 +91,13 @@ export default createDirective(__QUASAR_SSR_SERVER__
           move (evt) {
             const { top, left } = position(evt)
             if (
-              Math.abs(left - ctx.origin.left) >= ctx.sensitivity
-              || Math.abs(top - ctx.origin.top) >= ctx.sensitivity
+              ctx.timer !== void 0 && (
+                Math.abs(left - ctx.origin.left) >= ctx.sensitivity
+                || Math.abs(top - ctx.origin.top) >= ctx.sensitivity
+              )
             ) {
               clearTimeout(ctx.timer)
+              ctx.timer = void 0
             }
           },
 
@@ -106,8 +110,9 @@ export default createDirective(__QUASAR_SSR_SERVER__
             if (ctx.triggered === true) {
               evt !== void 0 && stopAndPrevent(evt)
             }
-            else {
+            else if (ctx.timer !== void 0) {
               clearTimeout(ctx.timer)
+              ctx.timer = void 0
             }
           }
         }
@@ -159,7 +164,7 @@ export default createDirective(__QUASAR_SSR_SERVER__
           cleanEvt(ctx, 'main')
           cleanEvt(ctx, 'temp')
 
-          clearTimeout(ctx.timer)
+          ctx.timer !== void 0 && clearTimeout(ctx.timer)
           ctx.styleCleanup !== void 0 && ctx.styleCleanup()
 
           delete el.__qtouchhold

package/src/directives/TouchRepeat.js

@@ -138,6 +138,8 @@ export default createDirective(__QUASAR_SSR_SERVER__
             }
 
             const fn = () => {
+              ctx.timer = void 0
+
               if (ctx.event === void 0) {
                 return
               }
@@ -181,8 +183,9 @@ export default createDirective(__QUASAR_SSR_SERVER__
           },
 
           move (evt) {
-            if (ctx.event !== void 0 && shouldEnd(evt, ctx.origin) === true) {
+            if (ctx.event !== void 0 && ctx.timer !== void 0 && shouldEnd(evt, ctx.origin) === true) {
               clearTimeout(ctx.timer)
+              ctx.timer = void 0
             }
           },
 
@@ -195,7 +198,11 @@ export default createDirective(__QUASAR_SSR_SERVER__
             evt !== void 0 && ctx.event.repeatCount > 0 && stopAndPrevent(evt)
 
             cleanEvt(ctx, 'temp')
-            clearTimeout(ctx.timer)
+
+            if (ctx.timer !== void 0) {
+              clearTimeout(ctx.timer)
+              ctx.timer = void 0
+            }
 
             ctx.event = void 0
           }
@@ -244,7 +251,7 @@ export default createDirective(__QUASAR_SSR_SERVER__
         const ctx = el.__qtouchrepeat
 
         if (ctx !== void 0) {
-          clearTimeout(ctx.timer)
+          ctx.timer !== void 0 && clearTimeout(ctx.timer)
 
           cleanEvt(ctx, 'main')
           cleanEvt(ctx, 'temp')

package/src/lang.js

@@ -40,25 +40,30 @@ const Plugin = defineReactivePlugin({
         return
       }
 
-      const dir = lang.rtl === true ? 'rtl' : 'ltr'
-      const attrs = `lang=${ lang.isoName } dir=${ dir }`
-
       lang.set = ssrContext.$q.lang.set
 
-      ssrContext._meta.htmlAttrs = ssrContext.__qPrevLang !== void 0
-        ? ssrContext._meta.htmlAttrs.replace(ssrContext.__qPrevLang, attrs)
-        : attrs
+      if (ssrContext.$q.config.lang === void 0 || ssrContext.$q.config.lang.noHtmlAttrs !== true) {
+        const dir = lang.rtl === true ? 'rtl' : 'ltr'
+        const attrs = `lang=${ lang.isoName } dir=${ dir }`
+
+        ssrContext._meta.htmlAttrs = ssrContext.__qPrevLang !== void 0
+          ? ssrContext._meta.htmlAttrs.replace(ssrContext.__qPrevLang, attrs)
+          : attrs
+
+        ssrContext.__qPrevLang = attrs
+      }
 
-      ssrContext.__qPrevLang = attrs
       ssrContext.$q.lang = lang
     }
     else {
-      const el = document.documentElement
-      el.setAttribute('dir', lang.rtl === true ? 'rtl' : 'ltr')
-      el.setAttribute('lang', lang.isoName)
-
       lang.set = Plugin.set
 
+      if (Plugin.__langConfig === void 0 || Plugin.__langConfig.noHtmlAttrs !== true) {
+        const el = document.documentElement
+        el.setAttribute('dir', lang.rtl === true ? 'rtl' : 'ltr')
+        el.setAttribute('lang', lang.isoName)
+      }
+
       Object.assign(Plugin.__langPack, lang)
 
       Plugin.props = lang
@@ -87,6 +92,7 @@ const Plugin = defineReactivePlugin({
     }
     else {
       $q.lang = Plugin.__langPack
+      Plugin.__langConfig = $q.config.lang
 
       if (this.__installed === true) {
         lang !== void 0 && this.set(lang)

package/src/plugins/Loading.js

@@ -11,7 +11,7 @@ let
   app,
   vm,
   uid = 0,
-  timeout,
+  timeout = null,
   props = {},
   activeGroups = {}
 
@@ -61,10 +61,10 @@ const Plugin = defineReactivePlugin({
     }
     else {
       props.uid = ++uid
-      clearTimeout(timeout)
+      timeout !== null && clearTimeout(timeout)
 
       timeout = setTimeout(() => {
-        timeout = void 0
+        timeout = null
 
         const el = createGlobalNode('q-loading')
 
@@ -174,9 +174,9 @@ const Plugin = defineReactivePlugin({
         }
       }
 
-      if (timeout !== void 0) {
+      if (timeout !== null) {
         clearTimeout(timeout)
-        timeout = void 0
+        timeout = null
       }
 
       Plugin.isActive = false

package/src/plugins/Meta.js

@@ -1,7 +1,7 @@
 import { isRuntimeSsrPreHydration } from './Platform.js'
 import extend from '../utils/extend.js'
 
-let updateId, currentClientMeta
+let updateId = null, currentClientMeta
 export const clientList = []
 
 function normalize (meta) {
@@ -218,6 +218,8 @@ function injectServerMeta (ssrContext) {
 }
 
 function updateClientMeta () {
+  updateId = null
+
   const data = {
     title: '',
     titleTemplate: null,
@@ -243,7 +245,7 @@ function updateClientMeta () {
 }
 
 export function planClientUpdate () {
-  clearTimeout(updateId)
+  updateId !== null && clearTimeout(updateId)
   updateId = setTimeout(updateClientMeta, 50)
 }
 

package/src/plugins/Notify.js

@@ -225,7 +225,10 @@ function addNotification (config, $q, originalApi) {
 
   if (originalApi !== void 0) {
     // reset timeout if any
-    clearTimeout(originalApi.notif.meta.timer)
+    if (originalApi.notif.meta.timer) {
+      clearTimeout(originalApi.notif.meta.timer)
+      originalApi.notif.meta.timer = void 0
+    }
 
     // retain uid
     notif.meta.uid = originalApi.notif.meta.uid
@@ -261,7 +264,10 @@ function addNotification (config, $q, originalApi) {
     // ok, so it's NOT a new one
     else {
       // reset timeout if any
-      clearTimeout(original.meta.timer)
+      if (original.meta.timer) {
+        clearTimeout(original.meta.timer)
+        original.meta.timer = void 0
+      }
 
       if (notif.badgePosition !== void 0) {
         if (badgePositions.includes(notif.badgePosition) === false) {
@@ -291,6 +297,7 @@ function addNotification (config, $q, originalApi) {
 
   if (notif.timeout > 0) {
     notif.meta.timer = setTimeout(() => {
+      notif.meta.timer = void 0
       dismiss()
     }, notif.timeout + /* show duration */ 1000)
   }
@@ -339,7 +346,10 @@ function addNotification (config, $q, originalApi) {
 }
 
 function removeNotification (notif) {
-  clearTimeout(notif.meta.timer)
+  if (notif.meta.timer) {
+    clearTimeout(notif.meta.timer)
+    notif.meta.timer = void 0
+  }
 
   const index = notificationsList[ notif.position ].value.indexOf(notif)
   if (index !== -1) {

package/src/utils/debounce.js

@@ -1,25 +1,28 @@
 export default function (fn, wait = 250, immediate) {
-  let timeout
+  let timer = null
 
   function debounced (/* ...args */) {
     const args = arguments
 
     const later = () => {
-      timeout = void 0
+      timer = null
       if (immediate !== true) {
         fn.apply(this, args)
       }
     }
 
-    clearTimeout(timeout)
-    if (immediate === true && timeout === void 0) {
+    if (timer !== null) {
+      clearTimeout(timer)
+    }
+    else if (immediate === true) {
       fn.apply(this, args)
     }
-    timeout = setTimeout(later, wait)
+
+    timer = setTimeout(later, wait)
   }
 
   debounced.cancel = () => {
-    clearTimeout(timeout)
+    timer !== null && clearTimeout(timer)
   }
 
   return debounced

package/src/utils/morph.js

@@ -950,12 +950,11 @@ export default function morph (_options) {
         : (
             options.waitFor === 'transitionend'
               ? new Promise(resolve => {
-                const timer = setTimeout(() => {
-                  endFn()
-                }, 400)
-
-                const endFn = ev => {
-                  clearTimeout(timer)
+                const endFn = () => {
+                  if (timer !== null) {
+                    clearTimeout(timer)
+                    timer = null
+                  }
 
                   if (elTo) {
                     elTo.removeEventListener('transitionend', endFn)
@@ -965,6 +964,8 @@ export default function morph (_options) {
                   resolve()
                 }
 
+                let timer = setTimeout(endFn, 400)
+
                 elTo.addEventListener('transitionend', endFn)
                 elTo.addEventListener('transitioncancel', endFn)
               })

package/src/utils/prevent-scroll.js

@@ -10,7 +10,7 @@ let
   vpPendingUpdate = false,
   bodyLeft,
   bodyTop,
-  closeTimer
+  closeTimer = null
 
 function onWheel (e) {
   if (shouldPreventScroll(e)) {
@@ -157,9 +157,9 @@ export default function (state) {
   if (state === true) {
     registered++
 
-    if (closeTimer !== void 0) {
+    if (closeTimer !== null) {
       clearTimeout(closeTimer)
-      closeTimer = void 0
+      closeTimer = null
       return
     }
 
@@ -181,11 +181,10 @@ export default function (state) {
     action = 'remove'
 
     if (client.is.ios === true && client.is.nativeMobile === true) {
-      clearTimeout(closeTimer)
-
+      closeTimer !== null && clearTimeout(closeTimer)
       closeTimer = setTimeout(() => {
         apply(action)
-        closeTimer = void 0
+        closeTimer = null
       }, 100)
       return
     }

package/src/utils/private/click-outside.js

@@ -1,14 +1,17 @@
 import { listenOpts } from '../event.js'
 import { portalProxyList } from '../private/portal.js'
 
-let timer
+let timer = null
 
 const
   { notPassiveCapture } = listenOpts,
   registeredList = []
 
 function globalHandler (evt) {
-  clearTimeout(timer)
+  if (timer !== null) {
+    clearTimeout(timer)
+    timer = null
+  }
 
   const target = evt.target
 
@@ -81,7 +84,11 @@ export function removeClickOutside (clickOutsideProps) {
     registeredList.splice(index, 1)
 
     if (registeredList.length === 0) {
-      clearTimeout(timer)
+      if (timer !== null) {
+        clearTimeout(timer)
+        timer = null
+      }
+
       document.removeEventListener('mousedown', globalHandler, notPassiveCapture)
       document.removeEventListener('touchstart', globalHandler, notPassiveCapture)
     }

package/src/utils/private/global-dialog.js

@@ -54,7 +54,7 @@ export default function (DefaultComponent, supportsCustomComponent, parentApp) {
 
     let vm, emittedOK = false
     const dialogRef = ref(null)
-    const el = createGlobalNode()
+    const el = createGlobalNode(false, 'dialog')
 
     const applyState = cmd => {
       if (dialogRef.value !== null && dialogRef.value[ cmd ] !== void 0) {