quasar 2.8.2 → 2.8.3

package/dist/types/api/validation.d.ts

@@ -1,4 +1,24 @@
 // Keep in sync with ui/src/utils/patterns.js
-export type EmbeddedValidationRule = "date" | "time" | "fulltime" | "timeOrFulltime" | "email" | "hexColor" | "hexaColor" | "hexOrHexaColor" | "rgbColor" | "rgbaColor" | "rgbOrRgbaColor" | "hexOrRgbColor" | "hexaOrRgbaColor" | "anyColor";
+export type EmbeddedValidationRule =
+  | "date"
+  | "time"
+  | "fulltime"
+  | "timeOrFulltime"
+  | "email"
+  | "hexColor"
+  | "hexaColor"
+  | "hexOrHexaColor"
+  | "rgbColor"
+  | "rgbaColor"
+  | "rgbOrRgbaColor"
+  | "hexOrRgbColor"
+  | "hexaOrRgbaColor"
+  | "anyColor";
 
-export type ValidationRule<T = any> = EmbeddedValidationRule | ((value: T) => boolean | string | Promise<boolean | string>);
+type EmbeddedValidationRuleFn<T = any> = (value: T) => boolean;
+export type ValidationRule<T = any> =
+  | EmbeddedValidationRule
+  | ((
+      value: T,
+      rules: Record<EmbeddedValidationRule, EmbeddedValidationRuleFn<T>>
+    ) => boolean | string | Promise<boolean | string>);

package/dist/types/index.d.ts

@@ -12858,6 +12858,10 @@ export interface QUploader extends ComponentPublicInstance<QUploaderProps> {
    * The component state is set as busy; User should not be able to interact with the component
    */
   readonly isBusy: boolean;
+  /**
+   * The component is uploading files
+   */
+  readonly isUploading: boolean;
 }
 
 export interface QUploaderAddTriggerProps {}
@@ -13662,14 +13666,7 @@ declare module "./globals" {
      * @returns Chainable Object
      */
     dialog: (opts: QDialogOptions) => DialogChainObject;
-    /**
-     * Activate and show
-     * @param opts All props are optional
-     * @returns Calling this function with no parameters hides the group; When called with one Object parameter then it updates the Loading group (specified properties are shallow merged with the group ones; note that group cannot be changed while updating and it is ignored)
-     */
-    loading: (
-      opts?: QLoadingShowOptions
-    ) => (props?: QLoadingUpdateOptions) => void;
+    loading: Loading;
     loadingBar: LoadingBar;
     localStorage: LocalStorage;
     /**

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

@@ -2,7 +2,7 @@
   "$schema": "",
   "framework": "vue",
   "name": "quasar",
-  "version": "2.8.2",
+  "version": "2.8.3",
   "contributions": {
     "html": {
       "types-syntax": "typescript",
@@ -5783,7 +5783,7 @@
                 "kind": "expression",
                 "type": "any[]"
               },
-              "description": "Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules\n\nExamples:\n:rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"\n:rules=\"[ 'fulltime' ]\"",
+              "description": "Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules\n\nExamples:\n:rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"\n:rules=\"[ 'fulltime' ]\"\n:rules=\"[ (val, rules) => rules.email(val) || 'Please enter a valid email address' ]\"",
               "doc-url": "https://v2.quasar.dev/vue-components/field"
             },
             {
@@ -6347,7 +6347,7 @@
                 "kind": "expression",
                 "type": "any[]"
               },
-              "description": "Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules\n\nExamples:\n:rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"\n:rules=\"[ 'fulltime' ]\"",
+              "description": "Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules\n\nExamples:\n:rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"\n:rules=\"[ 'fulltime' ]\"\n:rules=\"[ (val, rules) => rules.email(val) || 'Please enter a valid email address' ]\"",
               "doc-url": "https://v2.quasar.dev/vue-components/file"
             },
             {
@@ -7777,7 +7777,7 @@
                 "kind": "expression",
                 "type": "any[]"
               },
-              "description": "Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules\n\nExamples:\n:rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"\n:rules=\"[ 'fulltime' ]\"",
+              "description": "Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules\n\nExamples:\n:rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"\n:rules=\"[ 'fulltime' ]\"\n:rules=\"[ (val, rules) => rules.email(val) || 'Please enter a valid email address' ]\"",
               "doc-url": "https://v2.quasar.dev/vue-components/input"
             },
             {
@@ -12169,7 +12169,7 @@
                 "kind": "expression",
                 "type": "any[]"
               },
-              "description": "Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules\n\nExamples:\n:rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"\n:rules=\"[ 'fulltime' ]\"",
+              "description": "Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules\n\nExamples:\n:rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"\n:rules=\"[ 'fulltime' ]\"\n:rules=\"[ (val, rules) => rules.email(val) || 'Please enter a valid email address' ]\"",
               "doc-url": "https://v2.quasar.dev/vue-components/select"
             },
             {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar",
-  "version": "2.8.2",
+  "version": "2.8.3",
   "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/input/QInput.js

@@ -43,6 +43,9 @@ export default createComponent({
   ],
 
   setup (props, { emit, attrs }) {
+    const { proxy } = getCurrentInstance()
+    const { $q } = proxy
+
     const temp = {}
     let emitCachedValue = NaN, typedNumber, stopValueWatcher, emitTimer, emitValueFn
 
@@ -289,21 +292,24 @@ export default createComponent({
 
     // textarea only
     function adjustHeight () {
-      const inp = inputRef.value
-      if (inp !== null) {
-        const parentStyle = inp.parentNode.style
-        const { overflow } = inp.style
-
-        // reset height of textarea to a small size to detect the real height
-        // but keep the total control size the same
-        parentStyle.marginBottom = (inp.scrollHeight - 1) + 'px'
-        inp.style.height = '1px'
-        inp.style.overflow = 'hidden'
-
-        inp.style.height = inp.scrollHeight + 'px'
-        inp.style.overflow = overflow
-        parentStyle.marginBottom = ''
-      }
+      requestAnimationFrame(() => {
+        const inp = inputRef.value
+        if (inp !== null) {
+          const parentStyle = inp.parentNode.style
+          const { overflow } = inp.style
+
+          // reset height of textarea to a small size to detect the real height
+          // but keep the total control size the same
+          // Firefox rulez #14263, #14344
+          $q.platform.is.firefox !== true && (inp.style.overflow = 'hidden')
+          inp.style.height = '1px'
+          parentStyle.marginBottom = (inp.scrollHeight - 1) + 'px'
+
+          inp.style.height = inp.scrollHeight + 'px'
+          inp.style.overflow = overflow
+          parentStyle.marginBottom = ''
+        }
+      })
     }
 
     function onChange (e) {
@@ -406,8 +412,7 @@ export default createComponent({
     const renderFn = useField(state)
 
     // expose public methods
-    const vm = getCurrentInstance()
-    Object.assign(vm.proxy, {
+    Object.assign(proxy, {
       focus,
       select,
       getNativeElement: () => inputRef.value

package/src/components/uploader/QUploader.json

@@ -258,6 +258,11 @@
     "isBusy": {
       "type": "Boolean",
       "desc": "The component state is set as busy; User should not be able to interact with the component"
+    },
+
+    "isUploading": {
+      "type": "Boolean",
+      "desc": "The component is uploading files"
     }
   }
 }

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

@@ -129,11 +129,13 @@ export default function ({
       file.__key = file.webkitRelativePath + file.lastModified + file.name + file.size
     })
 
-    // Avoid duplicate files
-    const filenameMap = currentFileList.map(entry => entry.__key)
-    files = filterFiles(files, rejectedFiles, 'duplicate', file => {
-      return filenameMap.includes(file.__key) === false
-    })
+    if (append !== true) {
+      // Avoid duplicate files
+      const filenameMap = currentFileList.map(entry => entry.__key)
+      files = filterFiles(files, rejectedFiles, 'duplicate', file => {
+        return filenameMap.includes(file.__key) === false
+      })
+    }
 
     if (files.length === 0) { return done() }
 

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

@@ -144,7 +144,7 @@ export default function (focused, innerLoading) {
       let res
 
       if (typeof rule === 'function') {
-        res = rule(val)
+        res = rule(val, testPattern)
       }
       else if (typeof rule === 'string' && testPattern[ rule ] !== void 0) {
         res = testPattern[ rule ](val)

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

@@ -32,7 +32,8 @@
       "desc": "Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules",
       "examples": [
         ":rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"",
-        ":rules=\"[ 'fulltime' ]\""
+        ":rules=\"[ 'fulltime' ]\"",
+        ":rules=\"[ (val, rules) => rules.email(val) || 'Please enter a valid email address' ]\""
       ],
       "category": "behavior"
     },

package/src/plugins/Loading.json

@@ -74,7 +74,6 @@
 
   "methods": {
     "show": {
-      "tsInjectionPoint": true,
       "desc": "Activate and show",
       "params": {
         "opts": {