quasar 2.3.0 → 2.3.4

package/src/components/table/table-pagination.js

@@ -64,6 +64,10 @@ export function useTablePaginationState (vm, getCellValue) {
     nextTick(() => {
       emit('request', {
         pagination: prop.pagination || computedPagination.value,
+        // FIXME: 'props.filter' is string/object, but 'prop.filter' can be controlled by the user, and the docs are suggesting 'prop.filter' is a function
+        // So, value of 'filter' becomes function/string/object, which makes a lot of things unpredictable and can break things
+        // Either update the docs to say 'prop.filter' should be a string/object, or use 'prop.filter || props.filterMethod' or maybe get 'computedFilterFunction' here and use that instead of 'props.filterMethod'
+        // The examples on our docs are using 'filter' as a string in onRequest handler, but the JSON API is saying 'filter' is a function
         filter: prop.filter || props.filter,
         getCellValue
       })

package/src/components/tabs/QRouteTab.json

@@ -24,29 +24,7 @@
         "navigateFn": {
           "type": "Function",
           "desc": "When you need to control the time at which the tab should trigger the route navigation then set 'evt.navigate' to false and call this function; Useful if you have async work to be done before the actual route navigation",
-          "params": {
-            "to": {
-              "type": [ "String", "Object" ],
-              "desc": "Equivalent to Vue Router <router-link> 'to' property",
-              "examples": [
-                "/home/dashboard",
-                "{ name: 'my-route-name' }"
-              ],
-              "default": "Tab's 'to' property"
-            },
-
-            "append": {
-              "type": "Boolean",
-              "desc": "Equivalent to Vue Router <router-link> 'append' property",
-              "default": "Tab's 'append' property"
-            },
-
-            "replace": {
-              "type": "Boolean",
-              "desc": "Equivalent to Vue Router <router-link> 'replace' property",
-              "default": "Tab's 'replace' property"
-            }
-          },
+          "params": null,
           "returns": null
         }
       }

package/src/components/time/QTime.json

@@ -123,41 +123,49 @@
           "definition": {
             "year": {
               "type": "Number",
+              "required": true,
               "desc": "The year",
               "__exemption": [ "examples" ]
             },
             "month": {
               "type": "Number",
+              "required": true,
               "desc": "The month",
               "__exemption": [ "examples" ]
             },
             "day": {
               "type": "Number",
+              "required": true,
               "desc": "The day of the month",
               "__exemption": [ "examples" ]
             },
             "hour": {
               "type": "Number",
+              "required": true,
               "desc": "The hour",
               "__exemption": [ "examples" ]
             },
             "minute": {
               "type": "Number",
+              "required": true,
               "desc": "The minute",
               "__exemption": [ "examples" ]
             },
             "second": {
               "type": "Number",
+              "required": true,
               "desc": "The second",
               "__exemption": [ "examples" ]
             },
             "millisecond": {
               "type": "Number",
+              "required": true,
               "desc": "The millisecond",
               "__exemption": [ "examples" ]
             },
             "changed": {
               "type": "Boolean",
+              "required": true,
               "desc": "Did the model change?"
             }
           }

package/src/components/tree/QTree.json

@@ -186,9 +186,9 @@
           "reactive": true
         },
         "tree": {
-          "type": "Object",
-          "desc": "QTree instance",
-          "__exemption": [ "examples" ]
+          "type": "Component",
+          "tsType": "QTree",
+          "desc": "QTree instance"
         },
         "node": {
           "type": "Object",
@@ -226,9 +226,9 @@
           "reactive": true
         },
         "tree": {
-          "type": "Object",
-          "desc": "QTree instance",
-          "__exemption": [ "examples" ]
+          "type": "Component",
+          "tsType": "QTree",
+          "desc": "QTree instance"
         },
         "node": {
           "type": "Object",
@@ -266,9 +266,9 @@
           "reactive": true
         },
         "tree": {
-          "type": "Object",
-          "desc": "QTree instance",
-          "__exemption": [ "examples" ]
+          "type": "Component",
+          "tsType": "QTree",
+          "desc": "QTree instance"
         },
         "node": {
           "type": "Object",
@@ -306,9 +306,9 @@
           "reactive": true
         },
         "tree": {
-          "type": "Object",
-          "desc": "QTree instance",
-          "__exemption": [ "examples" ]
+          "type": "Component",
+          "tsType": "QTree",
+          "desc": "QTree instance"
         },
         "node": {
           "type": "Object",
@@ -354,21 +354,25 @@
           "definition": {
             "node": {
               "type": "Object",
+              "required": true,
               "desc": "The node to which the new nodes (the children) will be appended",
               "__exemption": [ "examples" ]
             },
             "key": {
               "type": "String",
+              "required": true,
               "desc": "The key of the node getting the newly loaded child nodes",
               "examples": [ "New Node" ]
             },
             "done": {
               "type": "Function",
+              "required": true,
               "desc": "The callback to be carried out when the loading is successful",
               "params": {
                 "children": {
                   "type": "Array",
                   "desc": "Array of nodes",
+                  "default": "[]",
                   "__exemption": [ "examples" ]
                 }
               },
@@ -376,6 +380,7 @@
             },
             "fail": {
               "type": "Function",
+              "required": true,
               "desc": "The callback to be carried out should the loading fails",
               "params": null,
               "returns": null
@@ -422,8 +427,8 @@
       "params": {
         "key": {
           "type": "Any",
-          "desc": "The key of a node",
           "required": true,
+          "desc": "The key of a node",
           "examples": [ "Node 1" ]
         }
       },
@@ -457,8 +462,8 @@
       "params": {
         "key": {
           "type": "Any",
-          "desc": "The key of a node",
           "required": true,
+          "desc": "The key of a node",
           "examples": [ "Node 1" ]
         }
       },
@@ -481,14 +486,14 @@
       "params": {
         "key": {
           "type": "Any",
-          "desc": "The key of a node",
           "required": true,
+          "desc": "The key of a node",
           "examples": [ "Node 1" ]
         },
         "state": {
           "type": "Boolean",
-          "desc": "Set to 'true' to expand the branch of the tree, otherwise 'false' collapses it",
-          "required": true
+          "required": true,
+          "desc": "Set to 'true' to expand the branch of the tree, otherwise 'false' collapses it"
         }
       }
     },
@@ -498,8 +503,8 @@
       "params": {
         "key": {
           "type": "Any",
-          "desc": "The key of a node",
           "required": true,
+          "desc": "The key of a node",
           "examples": [ "Node 1" ]
         }
       },
@@ -514,14 +519,14 @@
       "params": {
         "keys": {
           "type": "Array",
-          "desc": "The keys of nodes to tick/untick",
           "required": true,
+          "desc": "The keys of nodes to tick/untick",
           "examples": [ "[ 'Node 1', 'Node 2' ]" ]
         },
         "state": {
           "type": "Boolean",
-          "desc": "Set to 'true' to tick the checkbox of nodes, otherwise 'false' unticks them",
-          "required": true
+          "required": true,
+          "desc": "Set to 'true' to tick the checkbox of nodes, otherwise 'false' unticks them"
         }
       }
     }

package/src/components/tree/QTree.sass

@@ -130,47 +130,51 @@
     .q-tree__node-body:after
       display: none !important
 
-  &--dense .q-tree
-    &__arrow,
-    &__spinner
-      margin-right: 1px
-
-    &__img
-      height: 32px
-
-    &__tickbox
-      margin-right: 3px
-
-    &__node
-      padding: 0
-      &:after
-        top: 0
-        left: -8px
-
-    &__node-header
-      margin-top: 0
-      padding: 1px
-      &:before
-        top: 0
-        left: -8px
-        width: 8px
-
-    &__node--child
-      padding-left: 17px
-      > .q-tree__node-header:before
-        left: -25px
-        width: 21px
-
-    &__node-body
-      padding: 0 0 2px
-
-    &__node--parent > .q-tree__node-collapsible > .q-tree__node-body
-      padding: 0 0 2px 20px
-      &:after
-        left: 8px
-
-    &__children
-      padding-left: 16px
+  &--dense
+    > .q-tree__node--child > .q-tree__node-header
+      padding-left: 1px
+
+    .q-tree
+      &__arrow,
+      &__spinner
+        margin-right: 1px
+
+      &__img
+        height: 32px
+
+      &__tickbox
+        margin-right: 3px
+
+      &__node
+        padding: 0
+        &:after
+          top: 0
+          left: -8px
+
+      &__node-header
+        margin-top: 0
+        padding: 1px
+        &:before
+          top: 0
+          left: -8px
+          width: 8px
+
+      &__node--child
+        padding-left: 17px
+        > .q-tree__node-header:before
+          left: -25px
+          width: 21px
+
+      &__node-body
+        padding: 0 0 2px
+
+      &__node--parent > .q-tree__node-collapsible > .q-tree__node-body
+        padding: 0 0 2px 20px
+        &:after
+          left: 8px
+
+      &__children
+        padding-left: 16px
 
 [dir=rtl]
   .q-tree__arrow

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

@@ -11,7 +11,7 @@
         }
       },
       "returns": {
-        "type": [ "Object", "Promise" ],
+        "type": [ "Object", "Promise<any>" ],
         "desc": "Optional configuration for the upload process; You can override QUploader props in this Object (url, method, headers, formFields, fieldName, withCredentials, sendRaw); Props of these Object can also be Functions with the form of (file[s]) => value",
         "__exemption": [ "examples" ]
       },
@@ -22,6 +22,18 @@
       "type": [ "String", "Function" ],
       "desc": "URL or path to the server which handles the upload. Takes String or factory function, which returns String. Function is called right before upload; If using a function then for best performance, reference it from your scope and do not define it inline",
       "examples": [ "https://example.com/path", "files => `https://example.com?count=${files.length}`" ],
+      "params": {
+        "files": {
+          "type": "Array",
+          "desc": "Uploaded files",
+          "__exemption": [ "examples" ]
+        }
+      },
+      "returns": {
+        "type": "String",
+        "desc": "URL or path to the server which handles the upload",
+        "__exemption": [ "examples" ]
+      },
       "category": "upload"
     },
 
@@ -31,6 +43,18 @@
       "desc": "HTTP method to use for upload; Takes String or factory function which returns a String; Function is called right before upload; If using a function then for best performance, reference it from your scope and do not define it inline",
       "values": [ "POST", "PUT" ],
       "examples": [ "POST", ":method=\"files => files.length > 10 ? 'POST' : 'PUT'\"" ],
+      "params": {
+        "files": {
+          "type": "Array",
+          "desc": "Uploaded files",
+          "__exemption": [ "examples" ]
+        }
+      },
+      "returns": {
+        "type": "String",
+        "desc": "HTTP method to use for upload",
+        "__exemption": [ "examples" ]
+      },
       "category": "upload"
     },
 
@@ -42,6 +66,18 @@
         "backgroundFile",
         ":field-name=\"(file) => 'background' + file.name\""
       ],
+      "params": {
+        "files": {
+          "type": "File",
+          "desc": "The current file being processed",
+          "__exemption": [ "examples" ]
+        }
+      },
+      "returns": {
+        "type": "String",
+        "desc": "Field name for the current file upload",
+        "__exemption": [ "examples" ]
+      },
       "category": "upload"
     },
 
@@ -67,6 +103,18 @@
         "() => [{name: 'X-Custom-Timestamp', value: Date.now()}]",
         "files => [{name: 'X-Custom-Count', value: files.length}]"
       ],
+      "params": {
+        "files": {
+          "type": "Array",
+          "desc": "Uploaded files",
+          "__exemption": [ "examples" ]
+        }
+      },
+      "returns": {
+        "type": "String",
+        "desc": "An array consists of objects with header definitions",
+        "__exemption": [ "examples" ]
+      },
       "category": "upload"
     },
 
@@ -92,6 +140,18 @@
         "() => [{name: 'my-field', value: 'my-value'}]",
         "files => [{name: 'my-field', value: 'my-value' + files.length}]"
       ],
+      "params": {
+        "files": {
+          "type": "Array",
+          "desc": "Uploaded files",
+          "__exemption": [ "examples" ]
+        }
+      },
+      "returns": {
+        "type": "String",
+        "desc": "An array consists of objects with additional fields definitions (used by Form to be uploaded)",
+        "__exemption": [ "examples" ]
+      },
       "category": "upload"
     },
 
@@ -99,6 +159,18 @@
       "type": [ "Boolean", "Function" ],
       "desc": "Sets withCredentials to true on the XHR that manages the upload; Takes boolean or factory function for Boolean; Function is called right before upload; If using a function then for best performance, reference it from your scope and do not define it inline",
       "examples": [ "with-credentials", ":with-credentials=\"files => ...\"" ],
+      "params": {
+        "files": {
+          "type": "Array",
+          "desc": "Uploaded files",
+          "__exemption": [ "examples" ]
+        }
+      },
+      "returns": {
+        "type": "Boolean",
+        "desc": "If true, withCredentials will be set to true on the XHR that manages the upload",
+        "__exemption": [ "examples" ]
+      },
       "category": "upload"
     },
 
@@ -106,6 +178,18 @@
       "type": [ "Boolean", "Function" ],
       "desc": "Send raw files without wrapping into a Form(); Takes boolean or factory function for Boolean; Function is called right before upload; If using a function then for best performance, reference it from your scope and do not define it inline",
       "examples": [ "send-raw", ":send-raw=\"files => ...\"" ],
+      "params": {
+        "files": {
+          "type": "Array",
+          "desc": "Uploaded files",
+          "__exemption": [ "examples" ]
+        }
+      },
+      "returns": {
+        "type": "Boolean",
+        "desc": "If true, raw files will get sent without wrapping into a Form()",
+        "__exemption": [ "examples" ]
+      },
       "category": "upload"
     },
 
@@ -113,6 +197,18 @@
       "type": [ "Boolean", "Function" ],
       "desc": "Upload files in batch (in one XHR request); Takes boolean or factory function for Boolean; Function is called right before upload; If using a function then for best performance, reference it from your scope and do not define it inline",
       "examples": [ "files => files.length > 10" ],
+      "params": {
+        "files": {
+          "type": "Array",
+          "desc": "Uploaded files",
+          "__exemption": [ "examples" ]
+        }
+      },
+      "returns": {
+        "type": "Boolean",
+        "desc": "If true, files will be uploaded in a batch (in one XHR request)",
+        "__exemption": [ "examples" ]
+      },
       "category": "upload"
     }
   },
@@ -127,11 +223,13 @@
           "definition": {
             "files": {
               "type": "Array",
+              "required": true,
               "desc": "Uploaded files",
               "__exemption": [ "examples" ]
             },
             "xhr": {
               "type": "Object",
+              "required": true,
               "desc": "XMLHttpRequest that has been used to upload this batch of files",
               "__exemption": [ "examples" ]
             }
@@ -149,11 +247,13 @@
           "definition": {
             "files": {
               "type": "Array",
+              "required": true,
               "desc": "Files which encountered error",
               "__exemption": [ "examples" ]
             },
             "xhr": {
               "type": "Object",
+              "required": true,
               "desc": "XMLHttpRequest that has been used to upload this batch of files",
               "__exemption": [ "examples" ]
             }
@@ -171,11 +271,13 @@
           "definition": {
             "files": {
               "type": "Array",
+              "required": true,
               "desc": "Files which are now uploading",
               "__exemption": [ "examples" ]
             },
             "xhr": {
               "type": "Object",
+              "required": true,
               "desc": "XMLHttpRequest used for uploading",
               "__exemption": [ "examples" ]
             }
@@ -188,9 +290,8 @@
       "desc": "Emitted when factory function is supplied with a Promise which is rejected",
       "params": {
         "err": {
-          "type": "Object",
-          "desc": "Error Object which is the Promise rejection reason",
-          "__exemption": [ "examples" ]
+          "type": "Error",
+          "desc": "Error object which is the Promise rejection reason"
         },
         "files": {
           "type": "Array",

package/src/components/virtual-scroll/QVirtualScroll.json

@@ -67,6 +67,21 @@
     }
   },
 
+  "events": {
+    "virtual-scroll": {
+      "params": {
+        "details": {
+          "definition": {
+            "ref": {
+              "tsType": "QVirtualScroll",
+              "desc": "Vue reference to the QVirtualScroll"
+            }
+          }
+        }
+      }
+    }
+  },
+
   "slots" : {
     "before": {
       "desc": "Template slot for the elements that should be rendered before the list; Suggestion: thead before a table"

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

@@ -72,30 +72,32 @@
           "definition": {
             "index": {
               "type": "Number",
+              "required": true,
               "desc": "Index of the list item that was scrolled into view (0 based)",
               "examples": [ 30 ]
             },
             "from": {
               "type": "Number",
+              "required": true,
               "desc": "The index of the first list item that is rendered (0 based)",
               "examples": [ 10 ]
             },
             "to": {
               "type": "Number",
+              "required": true,
               "desc": "The index of the last list item that is rendered (0 based)",
               "examples": [ 50 ]
             },
             "direction": {
               "type": "String",
+              "required": true,
               "desc": "Direction of change",
               "values": [ "increase", "decrease" ]
             },
             "ref": {
-              "type": "Object",
-              "desc": "Vue reference to the QVirtualList which triggered the event",
-              "__exemption": [
-                "examples"
-              ]
+              "type": "Component",
+              "required": true,
+              "desc": "Vue reference to the component which triggered the event"
             }
           }
         }

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

@@ -75,7 +75,7 @@ export const useFieldProps = {
 export const useFieldEmits = [ 'update:modelValue', 'clear', 'focus', 'blur', 'popup-show', 'popup-hide' ]
 
 export function useFieldState () {
-  const { props, attrs, proxy } = getCurrentInstance()
+  const { props, attrs, proxy, vnode } = getCurrentInstance()
 
   const isDark = useDark(props, proxy.$q)
 
@@ -88,9 +88,9 @@ export function useFieldState () {
 
     innerLoading: ref(false),
     focused: ref(false),
-    hasPopupOpen: ref(false),
+    hasPopupOpen: false,
 
-    splitAttrs: useSplitAttrs(attrs),
+    splitAttrs: useSplitAttrs(attrs, vnode),
     targetUid: ref(getTargetUid(props.for)),
 
     rootRef: ref(null),
@@ -301,7 +301,7 @@ export default function (state) {
     focusoutTimer = setTimeout(() => {
       if (
         document.hasFocus() === true && (
-          state.hasPopupOpen.value === true
+          state.hasPopupOpen === true
           || (
             state.controlRef !== void 0
             && (

package/src/composables/private/use-refocus-target.js

@@ -16,12 +16,21 @@ export default function (props, rootRef) {
   })
 
   function refocusTarget (e) {
+    const root = rootRef.value
+
     if (e !== void 0 && e.type.indexOf('key') === 0) {
-      if (document.activeElement !== rootRef.value && rootRef.value.contains(document.activeElement) === true) {
-        rootRef.value.focus()
+      if (
+        root !== null
+        && document.activeElement !== root
+        && root.contains(document.activeElement) === true
+      ) {
+        root.focus()
       }
     }
-    else if ((e === void 0 || rootRef.value.contains(e.target) === true) && refocusRef.value !== null) {
+    else if (
+      refocusRef.value !== null
+      && (e === void 0 || (root !== null && root.contains(e.target) === true))
+    ) {
       refocusRef.value.focus()
     }
   }