quasar 2.4.9 → 2.4.10

package/dist/types/ts-helpers.d.ts

@@ -1,11 +1,15 @@
 import { ComponentOptions, ComponentPublicInstance, ComputedOptions, MethodOptions, VNodeProps, AllowedComponentProps, ComponentCustomProps } from 'vue';
 
-export type LooseDictionary = { [index in string]: any };
-
 export type StringDictionary<T extends string> = Required<
   { [index in T]: string }
 >;
 
+// Needed to prevent TS to collapse `'value1' | 'value2' | string` to `string`, which breaks first parameter autocomplete
+// See: https://github.com/microsoft/TypeScript/issues/29729#issuecomment-832522611
+export type LiteralUnion<T extends U, U = string> =
+  | T
+  | (U & Record<never, never>);
+
 // See: https://stackoverflow.com/a/49936686/7931540
 export type DeepPartial<T> = {
   [P in keyof T]?: T[P] extends Array<infer U>

package/dist/types/utils.d.ts

@@ -1,3 +1,6 @@
+// Error on "quasar" import shown in IDE is normal, as we only have Components/Directives/Plugins types after the build step
+// The import will work correctly at runtime
+import { QUploader } from "quasar";
 import {
   ComponentOptionsMixin,
   ComponentPropsOptions,
@@ -135,4 +138,4 @@ export function createUploaderComponent<
   Emits extends EmitsOptions = []
 >(
   options: CreateUploaderComponentOptions<Props, Emits>
-): DefineComponent<Props, {}, {}, {}, {}, {}, {}, EmitsOptions>;
+): QUploader & DefineComponent<Props, {}, {}, {}, {}, {}, {}, Emits>;

package/dist/vetur/quasar-attributes.json

@@ -5559,6 +5559,10 @@
     "type": "any",
     "description": "Key of node currently selected"
   },
+  "q-tree/no-selection-unset": {
+    "type": "boolean",
+    "description": "Do not allow un-selection when clicking currently selected node"
+  },
   "q-tree/default-expand-all": {
     "type": "boolean",
     "description": "Allow the tree to have all its branches expanded, when first rendered"

package/dist/vetur/quasar-tags.json

@@ -1977,6 +1977,7 @@
       "ticked",
       "expanded",
       "selected",
+      "no-selection-unset",
       "default-expand-all",
       "accordion",
       "filter",

package/dist/web-types/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "",
   "framework": "vue",
   "name": "quasar",
-  "version": "2.4.9",
+  "version": "2.4.10",
   "contributions": {
     "html": {
       "types-syntax": "typescript",
@@ -17964,6 +17964,16 @@
               "description": "Key of node currently selected\n\nExamples:\nv-model:selected=\"selectedKey\"",
               "doc-url": "https://v2.quasar.dev/vue-components/tree"
             },
+            {
+              "name": "no-selection-unset",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "description": "Do not allow un-selection when clicking currently selected node",
+              "doc-url": "https://v2.quasar.dev/vue-components/tree",
+              "type": "boolean"
+            },
             {
               "name": "default-expand-all",
               "value": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar",
-  "version": "2.4.9",
+  "version": "2.4.10",
   "description": "Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time",
   "main": "dist/quasar.cjs.prod.js",
   "module": "dist/quasar.esm.prod.js",

package/src/components/date/QDate.js

@@ -153,7 +153,12 @@ export default createComponent({
       normalizedModel.value
         .filter(date => typeof date === 'string')
         .map(date => decodeString(date, innerMask.value, innerLocale.value))
-        .filter(date => date.dateHash !== null)
+        .filter(date =>
+          date.dateHash !== null
+          && date.day !== null
+          && date.month !== null
+          && date.year !== null
+        )
     )
 
     const rangeModel = computed(() => {

package/src/components/dialog-plugin/DialogPlugin.js

@@ -144,8 +144,8 @@ export default createComponent({
       color: vmColor.value,
       label: okLabel.value,
       ripple: false,
-      ...(Object(props.ok) === props.ok ? props.ok : { flat: true }),
       disable: okDisabled.value,
+      ...(Object(props.ok) === props.ok ? props.ok : { flat: true }),
       'data-autofocus': (props.focus === 'ok' && hasForm.value !== true) || void 0,
       onClick: onOk
     }))

package/src/components/select/QSelect.js

@@ -644,34 +644,34 @@ export default createComponent({
 
       if (typeof value === 'string' && value.length > 0) {
         const needle = value.toLocaleLowerCase()
+        const findFn = extractFn => {
+          const option = props.options.find(opt => extractFn.value(opt).toLocaleLowerCase() === needle)
 
-        let fn = opt => getOptionValue.value(opt).toLocaleLowerCase() === needle
-        let option = props.options.find(fn)
+          if (option === void 0) {
+            return false
+          }
 
-        if (option !== void 0) {
           if (innerValue.value.indexOf(option) === -1) {
             toggleOption(option)
           }
           else {
             hidePopup()
           }
-        }
-        else {
-          fn = opt => getOptionLabel.value(opt).toLocaleLowerCase() === needle
-          option = props.options.find(fn)
 
-          if (option !== void 0) {
-            if (innerValue.value.indexOf(option) === -1) {
-              toggleOption(option)
-            }
-            else {
-              hidePopup()
-            }
+          return true
+        }
+        const fillFn = afterFilter => {
+          if (findFn(getOptionValue) === true) {
+            return
           }
-          else {
-            filter(value, true)
+          if (findFn(getOptionLabel) === true || afterFilter === true) {
+            return
           }
+
+          filter(value, true, () => fillFn(true))
         }
+
+        fillFn()
       }
       else {
         state.clearValue(e)
@@ -1050,7 +1050,7 @@ export default createComponent({
       }
     }
 
-    function filter (val, keepClosed) {
+    function filter (val, keepClosed, afterUpdateFn) {
       if (props.onFilter === void 0 || (keepClosed !== true && state.focused.value !== true)) {
         return
       }
@@ -1108,6 +1108,7 @@ export default createComponent({
               }
 
               typeof afterFn === 'function' && nextTick(() => { afterFn(proxy) })
+              typeof afterUpdateFn === 'function' && nextTick(() => { afterUpdateFn(proxy) })
             })
           }
         },
@@ -1462,7 +1463,7 @@ export default createComponent({
             h('div', {
               ref: targetRef,
               key: 'd_t',
-              class: 'no-outline',
+              class: 'q-select__focus-target',
               id: state.targetUid.value,
               ...comboboxAttrs.value,
               onKeydown: onTargetKeydown,
@@ -1474,7 +1475,7 @@ export default createComponent({
           if (typeof props.autocomplete === 'string' && props.autocomplete.length > 0) {
             child.push(
               h('input', {
-                class: 'q-select__autocomplete-input no-outline',
+                class: 'q-select__autocomplete-input',
                 autocomplete: props.autocomplete,
                 onKeyup: onTargetAutocomplete
               })

package/src/components/select/QSelect.sass

@@ -12,7 +12,10 @@
     &--padding
       padding-left: 4px
 
+  &__focus-target,
   &__autocomplete-input
+    position: absolute
+    outline: 0 !important
     width: 0
     height: 0
     padding: 0

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,10 @@ export default createComponent({
 
       if (hasSelection.value) {
         if (meta.selectable) {
-          emit('update:selected', meta.key !== props.selected ? meta.key : null)
+          const val = meta.key !== props.selected ? meta.key : null
+          if (props.noSelectionUnset !== true || val !== null) {
+            emit('update:selected', val)
+          }
         }
       }
       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/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"]
         }