quasar 2.4.7 → 2.4.11

package/src/components/tabs/QTabs.js

@@ -1,4 +1,4 @@
-import { h, ref, computed, watch, nextTick, onBeforeUnmount, onActivated, getCurrentInstance, provide } from 'vue'
+import { h, ref, computed, watch, nextTick, onBeforeUnmount, onActivated, onDeactivated, getCurrentInstance, provide } from 'vue'
 
 import QIcon from '../icon/QIcon.js'
 import QResizeObserver from '../resize-observer/QResizeObserver.js'
@@ -568,7 +568,15 @@ export default createComponent({
       unwatchRoute !== void 0 && unwatchRoute()
     })
 
-    onActivated(recalculateScroll)
+    let shouldActivate = false
+
+    onDeactivated(() => {
+      shouldActivate = true
+    })
+
+    onActivated(() => {
+      shouldActivate === true && recalculateScroll()
+    })
 
     return () => {
       const child = [

package/src/components/tree/QTree.js

@@ -58,6 +58,8 @@ export default createComponent({
     expanded: Array, // v-model:expanded
     selected: {}, // v-model:selected
 
+    noSelectionUnset: Boolean,
+
     defaultExpandAll: Boolean,
     accordion: Boolean,
 
@@ -615,7 +617,12 @@ export default createComponent({
 
       if (hasSelection.value) {
         if (meta.selectable) {
-          emit('update:selected', meta.key !== props.selected ? meta.key : null)
+          if (props.noSelectionUnset === false) {
+            emit('update:selected', meta.key !== props.selected ? meta.key : null)
+          }
+          else if (meta.key !== props.selected) {
+            emit('update:selected', meta.key || null)
+          }
         }
       }
       else {

package/src/components/tree/QTree.json

@@ -6,6 +6,7 @@
   "props": {
     "nodes": {
       "type": "Array",
+      "tsType": "QTreeNode",
       "desc": "The array of nodes that designates the tree structure",
       "required": true,
       "examples": [ "[ {...}, {...} ]" ],
@@ -106,6 +107,13 @@
       "category": "state"
     },
 
+    "no-selection-unset": {
+      "type": "Boolean",
+      "desc": "Do not allow un-selection when clicking currently selected node",
+      "category": "behavior",
+      "addedIn": "v2.4.10"
+    },
+
     "default-expand-all": {
       "type": "Boolean",
       "desc": "Allow the tree to have all its branches expanded, when first rendered",

package/src/components/uploader/uploader-core.js

@@ -436,6 +436,8 @@ export function getRenderer (getPlugin) {
     abort: state.abort
   }
 
+  // TODO: the result of this computed, especially the dynamic part, isn't currently typed
+  // This result in an error with Volar when accessing the state (eg. files array)
   const slotScope = computed(() => {
     const acc = {
       canAddFiles: canAddFiles.value,

package/src/components/uploader/xhr-uploader-plugin.json

@@ -2,6 +2,7 @@
   "props": {
     "factory": {
       "type": "Function",
+      "tsType": "QUploaderFactoryFn",
       "desc": "Function which should return an Object or a Promise resolving with an Object; For best performance, reference it from your scope and do not define it inline",
       "params": {
         "files": {
@@ -112,7 +113,7 @@
       },
       "returns": {
         "type": "String",
-        "desc": "An array consists of objects with header definitions",
+        "desc": "An array consisting of objects with header definitions",
         "__exemption": [ "examples" ]
       },
       "category": "upload"

package/src/components/virtual-scroll/use-virtual-scroll.js

@@ -1,4 +1,4 @@
-import { h, ref, computed, watch, onActivated, onBeforeMount, onBeforeUnmount, nextTick, getCurrentInstance } from 'vue'
+import { h, ref, computed, watch, onActivated, onDeactivated, onBeforeMount, onBeforeUnmount, nextTick, getCurrentInstance } from 'vue'
 
 import debounce from '../../utils/debounce.js'
 import { noop } from '../../utils/event.js'
@@ -596,9 +596,9 @@ export function useVirtualScroll ({
       : Math.ceil(scrollViewSize / virtualScrollItemSizeComputed.value)
 
     const baseSize = Math.max(
-      10,
+      1,
       view,
-      Math.ceil(props.virtualScrollSliceSize / multiplier)
+      Math.ceil((props.virtualScrollSliceSize > 0 ? props.virtualScrollSliceSize : 10) / multiplier)
     )
 
     virtualScrollSliceSizeComputed.value = {
@@ -691,7 +691,15 @@ export function useVirtualScroll ({
     setVirtualScrollSize()
   })
 
+  let shouldActivate = false
+
+  onDeactivated(() => {
+    shouldActivate = true
+  })
+
   onActivated(() => {
+    if (shouldActivate !== true) { return }
+
     const scrollEl = getVirtualScrollTarget()
 
     if (prevScrollStart !== void 0 && scrollEl !== void 0 && scrollEl !== null && scrollEl.nodeType !== 8) {

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

@@ -1,4 +1,4 @@
-import { h, ref, computed, watch, Transition, nextTick, onBeforeUnmount, onMounted, getCurrentInstance } from 'vue'
+import { h, ref, computed, watch, Transition, nextTick, onActivated, onDeactivated, onBeforeUnmount, onMounted, getCurrentInstance } from 'vue'
 
 import { isRuntimeSsrPreHydration } from '../../plugins/Platform.js'
 
@@ -402,6 +402,8 @@ export default function (state) {
             name: props.clearIcon || $q.iconSet.field.clear,
             tabindex: 0,
             type: 'button',
+            'aria-hidden': null,
+            role: null,
             onClick: clearValue
           })
         ])
@@ -530,6 +532,16 @@ export default function (state) {
   // expose public methods
   Object.assign(proxy, { focus, blur })
 
+  let shouldActivate = false
+
+  onDeactivated(() => {
+    shouldActivate = true
+  })
+
+  onActivated(() => {
+    shouldActivate === true && props.autofocus === true && proxy.focus()
+  })
+
   onMounted(() => {
     if (isRuntimeSsrPreHydration.value === true && props.for === void 0) {
       state.targetUid.value = getTargetUid()

package/src/composables/private/use-file.json

@@ -72,6 +72,7 @@
       "params": {
         "rejectedEntries": {
           "type": "Array",
+          "tsType": "QRejectedEntry",
           "desc": "Array of { failedPropValidation: string, file: File } Objects for files that do not pass the validation",
           "__exemption": ["examples"]
         }

package/src/plugins/LoadingBar.js

@@ -49,11 +49,11 @@ const Plugin = defineReactivePlugin({
     Object.assign(this, {
       start (speed) {
         barRef.value.start(speed)
-        Plugin.isActive = barRef.value.calls > 0
+        Plugin.isActive = true
       },
       stop () {
-        barRef.value.stop()
-        Plugin.isActive = barRef.value.calls > 0
+        const sessions = barRef.value.stop()
+        Plugin.isActive = sessions > 0
       },
       increment () {
         barRef.value.increment.apply(null, arguments)

package/src/plugins/LoadingBar.json

@@ -16,6 +16,14 @@
     }
   },
 
+  "props": {
+    "isActive": {
+      "type": "Boolean",
+      "desc": "Is LoadingBar active?",
+      "reactive": true
+    }
+  },
+
   "methods": {
     "start": {
       "desc": "Notify bar you've started a background activity",

package/src/plugins/Platform.js

@@ -1,6 +1,4 @@
 /* eslint-disable no-useless-escape */
-/* eslint-disable no-unused-expressions */
-/* eslint-disable no-mixed-operators */
 
 import { ref, reactive } from 'vue'
 import { injectProp } from '../utils/private/inject-obj-prop'
@@ -25,19 +23,15 @@ export let iosEmulated = false
 export let iosCorrection
 
 function getMatch (userAgent, platformMatch) {
-  const match = /(edge|edga|edgios)\/([\w.]+)/.exec(userAgent)
+  const match = /(edg|edge|edga|edgios)\/([\w.]+)/.exec(userAgent)
     || /(opr)[\/]([\w.]+)/.exec(userAgent)
     || /(vivaldi)[\/]([\w.]+)/.exec(userAgent)
     || /(chrome|crios)[\/]([\w.]+)/.exec(userAgent)
-    || /(iemobile)[\/]([\w.]+)/.exec(userAgent)
     || /(version)(applewebkit)[\/]([\w.]+).*(safari)[\/]([\w.]+)/.exec(userAgent)
     || /(webkit)[\/]([\w.]+).*(version)[\/]([\w.]+).*(safari)[\/]([\w.]+)/.exec(userAgent)
     || /(firefox|fxios)[\/]([\w.]+)/.exec(userAgent)
     || /(webkit)[\/]([\w.]+)/.exec(userAgent)
     || /(opera)(?:.*version|)[\/]([\w.]+)/.exec(userAgent)
-    || /(msie) ([\w.]+)/.exec(userAgent)
-    || (userAgent.indexOf('trident') >= 0 && /(rv)(?::| )([\w.]+)/.exec(userAgent))
-    || (userAgent.indexOf('compatible') < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec(userAgent))
     || []
 
   return {
@@ -60,6 +54,8 @@ function getPlatformMatch (userAgent) {
     || /(mac)/.exec(userAgent)
     || /(linux)/.exec(userAgent)
     || /(cros)/.exec(userAgent)
+    // TODO: Remove BlackBerry detection. BlackBerry OS, BlackBerry 10, and BlackBerry PlayBook OS
+    // is officially dead as of January 4, 2022 (https://www.blackberry.com/us/en/support/devices/end-of-life)
     || /(playbook)/.exec(userAgent)
     || /(bb)/.exec(userAgent)
     || /(blackberry)/.exec(userAgent)
@@ -151,6 +147,10 @@ function getPlatform (UA) {
     delete browser[ 'windows phone' ]
   }
 
+  // TODO: The assumption about WebKit based browsers below is not completely accurate.
+  // Google released Blink(a fork of WebKit) engine on April 3, 2013, which is really different than WebKit today.
+  // Today, one might want to check for WebKit to deal with its bugs, which is used on all browsers on iOS, and Safari browser on all platforms.
+
   // Chrome, Opera 15+, Vivaldi and Safari are webkit based browsers
   if (
     browser.chrome
@@ -167,8 +167,15 @@ function getPlatform (UA) {
     browser.webkit = true
   }
 
+  // TODO: (Qv3) rename the terms 'edge' to 'edge legacy'(or remove it) then 'edge chromium' to 'edge' to match with the known up-to-date terms
+  // Microsoft Edge is the new Chromium-based browser. Microsoft Edge Legacy is the old EdgeHTML-based browser (EOL: March 9, 2021).
+  if (browser.edg) {
+    matched.browser = 'edgechromium'
+    browser.edgeChromium = true
+  }
+
   // Blackberry browsers are marked as Safari on BlackBerry
-  if (browser.safari && browser.blackberry || browser.bb) {
+  if ((browser.safari && browser.blackberry) || browser.bb) {
     matched.browser = 'blackberry'
     browser.blackberry = true
   }

package/src/plugins/Platform.json

@@ -17,6 +17,172 @@
     "is": {
       "type": "Object",
       "desc": "Client browser details (property names depend on browser)",
+      "definition": {
+        "name": {
+          "type": "String",
+          "desc": "Browser name",
+          "examples": [ "chrome" ]
+        },
+        "platform": {
+          "type": "String",
+          "desc": "Platform name",
+          "examples": [ "mac" ]
+        },
+        "version": {
+          "type": "String",
+          "required": false,
+          "desc": "Detailed browser version",
+          "examples": [ "71.0.3578.98" ]
+        },
+        "versionNumber": {
+          "type": "Number",
+          "required": false,
+          "desc": "Major browser version as a number",
+          "examples": [ 71 ]
+        },
+
+        "desktop": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the platform is desktop"
+        },
+        "mobile": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the platform is mobile"
+        },
+        "electron": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the platform is Electron"
+        },
+        "bex": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the platform is BEX(Browser Extension)"
+        },
+        "capacitor": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the platform is Capacitor"
+        },
+        "cordova": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the platform is Cordova"
+        },
+        "nativeMobile": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the platform is a native mobile wrapper"
+        },
+        "nativeMobileWrapper": {
+          "type": "String",
+          "required": false,
+          "values": ["cordova", "capacitor"],
+          "desc": "Type of the native mobile wrapper"
+        },
+
+        "chrome": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the browser is Google Chrome"
+        },
+        "firefox": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the browser is Firefox"
+        },
+        "safari": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the browser is Safari"
+        },
+        "edgeChromium": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the browser is Microsoft Edge (Chromium)"
+        },
+        "edge": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the browser is Microsoft Edge Legacy"
+        },
+        "opera": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the browser is Opera"
+        },
+        "vivaldi": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the browser is Vivaldi"
+        },
+
+        "win": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the operating system is Windows"
+        },
+        "linux": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the operating system is Linux"
+        },
+        "mac": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the operating system is Mac OS"
+        },
+        "cros": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the operating system is Chrome OS"
+        },
+
+        "android": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the operating system is Android"
+        },
+        "ios": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the operating system is iOS"
+        },
+        "winphone": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the operating system is Windows Phone"
+        },
+
+        "iphone": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the device is an iPhone"
+        },
+        "ipad": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the device is an iPad"
+        },
+        "ipod": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the device is an iPod"
+        },
+
+        "kindle": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the device is a Kindle"
+        },
+        "silk": {
+          "type": "Boolean",
+          "required": false,
+          "desc": "Whether the browser is Amazon Silk"
+        }
+      },
       "examples": [
         "{ chrome: true, version: '71.0.3578.98', versionNumber: 71, mac: true, desktop: true, webkit: true, name: 'chrome', platform: 'mac' }"
       ]