quasar 1.19.2 → 1.19.5

package/dist/quasar.umd.modern.js

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v1.19.2
+ * Quasar Framework v1.19.5
  * (c) 2015-present Razvan Stoenescu
  * Released under the MIT License.
  */
@@ -12,7 +12,7 @@
 
   Vue = Vue && Object.prototype.hasOwnProperty.call(Vue, 'default') ? Vue['default'] : Vue;
 
-  var version = "1.19.2";
+  var version = "1.19.5";
 
   /* eslint-disable no-useless-escape */
 
@@ -743,7 +743,7 @@
 
         // due to optimizations, this would be left out otherwise
         classes === true && this.name === 'xs' &&
-          document.body.classList.add(`screen--xs`);
+          document.body.classList.add('screen--xs');
       };
 
       if (fromSSR === true) {
@@ -6351,7 +6351,7 @@
 
       client.has.touch === true && addEvt(ctx, 'main', [
         [ el, 'touchstart', 'touchStart', `passive${modifiers.capture === true ? 'Capture' : ''}` ],
-        [ el, 'touchmove', 'noop', `notPassiveCapture` ]
+        [ el, 'touchmove', 'noop', 'notPassiveCapture' ]
       ]);
     },
 
@@ -6972,11 +6972,11 @@
       },
 
       transitionPrevComputed () {
-        return this.transitionPrev || `fade`
+        return this.transitionPrev || 'fade'
       },
 
       transitionNextComputed () {
-        return this.transitionNext || `fade`
+        return this.transitionNext || 'fade'
       }
     },
 
@@ -7236,7 +7236,7 @@
       },
 
       containerClass () {
-        return `q-message-container row items-end no-wrap` +
+        return 'q-message-container row items-end no-wrap' +
           (this.sent === true ? ' reverse' : '')
       },
 
@@ -7286,9 +7286,9 @@
           ]
         }
 
-        const content = withSlots === true
-          ? (contentList.length > 1 ? (text => text) : (text => h('div', [ text ])))
-          : (text => h('div', { domProps: { [domPropText]: text } }));
+        const content = withSlots !== true
+          ? text => h('div', { domProps: { [domPropText]: text } })
+          : (contentList.length > 1 ? text => text : text => h('div', [text]));
 
         return contentList.map((msg, index) => h('div', {
           key: index,
@@ -8067,11 +8067,11 @@
     timeOrFulltime: v => /^([0-1]?\d|2[0-3]):[0-5]\d(:[0-5]\d)?$/.test(v),
 
     // -- RFC 5322 --
-    // -- Added in v2.6.6 --
+    // -- Added in v1.18.10 --
     // This is a basic helper validation.
     // For something more complex (like RFC 822) you should write and use your own rule.
     // We won't be accepting PRs to enhance the one below because of the reason above.
-    email: v => /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(v),
+    email: v => /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(v),
 
     hexColor: v => hex.test(v),
     hexaColor: v => hexa.test(v),
@@ -12396,7 +12396,7 @@
     YY (date, _, forcedYear) {
       // workaround for < 1900 with new Date()
       const y = this.YYYY(date, _, forcedYear) % 100;
-      return y > 0
+      return y >= 0
         ? pad(y)
         : '-' + pad(Math.abs(y))
     },
@@ -12785,9 +12785,9 @@
         const type = this.landscape === true ? 'landscape' : 'portrait';
         return `q-date q-date--${type} q-date--${type}-${this.minimal === true ? 'minimal' : 'standard'}` +
           (this.isDark === true ? ' q-date--dark q-dark' : '') +
-          (this.bordered === true ? ` q-date--bordered` : '') +
-          (this.square === true ? ` q-date--square no-border-radius` : '') +
-          (this.flat === true ? ` q-date--flat no-shadow` : '') +
+          (this.bordered === true ? ' q-date--bordered' : '') +
+          (this.square === true ? ' q-date--square no-border-radius' : '') +
+          (this.flat === true ? ' q-date--flat no-shadow' : '') +
           (this.disable === true ? ' disabled' : (this.readonly === true ? ' q-date--readonly' : ''))
       },
 
@@ -13319,7 +13319,7 @@
         }
 
         res.forEach(day => {
-          let cls = `q-date__calendar-item `;
+          let cls = 'q-date__calendar-item ';
 
           if (day.fill === true) {
             cls += 'q-date__calendar-item--fill';
@@ -15402,7 +15402,7 @@
       child.push(
         h('aside', {
           ref: 'content',
-          staticClass: `q-drawer`,
+          staticClass: 'q-drawer',
           class: this.classes,
           style: this.style,
           on: this.onNativeEvents,
@@ -17102,7 +17102,7 @@
           'div',
           {
             ref: 'content',
-            staticClass: `q-editor__content`,
+            staticClass: 'q-editor__content',
             style: this.innerStyle,
             class: this.innerClass,
             attrs: {
@@ -17519,7 +17519,7 @@
         let child;
 
         if (this.$scopedSlots.header !== void 0) {
-          child = [].concat(this.$scopedSlots.header());
+          child = [].concat(this.$scopedSlots.header({ expanded: this.showing === true }));
         }
         else {
           child = [
@@ -17706,7 +17706,7 @@
           return {
             action: 'push',
             data: {
-              staticClass: `q-fab__label q-tooltip--style q-fab__label--external` +
+              staticClass: 'q-fab__label q-tooltip--style q-fab__label--external' +
                 ` q-fab__label--external-${this.labelPosition}` +
                 (hideLabel === true ? ' q-fab__label--external-hidden' : ''),
               style: this.labelStyle,
@@ -18389,11 +18389,9 @@
       floatingLabel () {
         return this.stackLabel === true ||
           this.focused === true ||
-          (
-            this.inputValue !== void 0 && this.hideSelected === true
-              ? this.inputValue.length > 0
-              : this.hasValue === true
-          ) ||
+          typeof this.inputValue === 'number' ||
+          (typeof this.inputValue === 'string' && this.inputValue.length > 0) ||
+          (this.hideSelected !== true && this.hasValue === true) ||
           (
             this.displayValue !== void 0 &&
             this.displayValue !== null &&
@@ -19263,6 +19261,11 @@
 
       __addFiles (e, fileList) {
         const files = this.__processFiles(e, fileList, this.innerValue, this.isAppending);
+        const fileInput = this.__getFileInput();
+
+        if (fileInput !== void 0) {
+          fileInput.value = '';
+        }
 
         // if nothing to do...
         if (files === void 0) { return }
@@ -22401,12 +22404,12 @@
     computed: {
       classes () {
         return `q-table--${this.separator}-separator` +
-          (this.isDark === true ? ` q-table--dark q-table__card--dark q-dark` : '') +
-          (this.dense === true ? ` q-table--dense` : '') +
-          (this.flat === true ? ` q-table--flat` : '') +
-          (this.bordered === true ? ` q-table--bordered` : '') +
-          (this.square === true ? ` q-table--square` : '') +
-          (this.wrapCells === false ? ` q-table--no-wrap` : '')
+          (this.isDark === true ? ' q-table--dark q-table__card--dark q-dark' : '') +
+          (this.dense === true ? ' q-table--dense' : '') +
+          (this.flat === true ? ' q-table--flat' : '') +
+          (this.bordered === true ? ' q-table--bordered' : '') +
+          (this.square === true ? ' q-table--square' : '') +
+          (this.wrapCells === false ? ' q-table--no-wrap' : '')
       }
     },
 
@@ -25238,6 +25241,8 @@
     }
   });
 
+  const getMinThumbSize = size => (size >= 250 ? 50 : Math.ceil(size / 5));
+
   const axisList = [ 'vertical', 'horizontal' ];
   const dirProps = {
     vertical: { offset: 'offsetY', scroll: 'scrollTop', dir: 'down', dist: 'y' },
@@ -25355,7 +25360,7 @@
         return Math.round(
           between(
             this.container.vertical * this.container.vertical / this.scroll.vertical.size,
-            50,
+            getMinThumbSize(this.container.vertical),
             this.container.vertical
           )
         )
@@ -25365,7 +25370,7 @@
         return Math.round(
           between(
             this.container.horizontal * this.container.horizontal / this.scroll.horizontal.size,
-            50,
+            getMinThumbSize(this.container.horizontal),
             this.container.horizontal
           )
         )
@@ -26910,20 +26915,35 @@
       },
 
       comboboxAttrs () {
-        return {
+        const attrs = {
+          tabindex: this.tabindex,
           role: 'combobox',
-          'aria-multiselectable': this.multiple === true ? 'true' : 'false',
+          'aria-label': this.label,
+          'aria-autocomplete': this.useInput === true ? 'list' : 'none',
           'aria-expanded': this.menu === true ? 'true' : 'false',
           'aria-owns': `${this.targetUid}_lb`,
-          'aria-activedescendant': `${this.targetUid}_${this.optionIndex}`
+          'aria-controls': `${this.targetUid}_lb`
+        };
+
+        if (this.optionIndex >= 0) {
+          attrs['aria-activedescendant'] = `${this.targetUid}_${this.optionIndex}`;
         }
+
+        return attrs
       },
 
       listboxAttrs () {
-        return {
+        const attrs = {
+          id: `${this.targetUid}_lb`,
           role: 'listbox',
-          id: `${this.targetUid}_lb`
+          'aria-multiselectable': this.multiple === true ? 'true' : 'false'
+        };
+
+        if (this.optionIndex >= 0) {
+          attrs['aria-activedescendant'] = `${this.targetUid}_${this.optionIndex}`;
         }
+
+        return attrs
       }
     },
 
@@ -27002,6 +27022,9 @@
               true
             );
 
+            this.dialogFieldFocused = false;
+            document.activeElement.blur();
+
             this.hidePopup();
           }
 
@@ -27073,15 +27096,18 @@
           while (index !== -1 && index !== this.optionIndex && this.isOptionDisabled(this.options[index]) === true)
 
           if (this.optionIndex !== index) {
-            this.setOptionIndex(index);
-            this.scrollTo(index);
+            cancelAnimationFrame(this.moveAnimationFrame);
+            this.moveAnimationFrame = requestAnimationFrame(() => {
+              this.setOptionIndex(index);
+              this.scrollTo(index);
 
-            if (skipInputValue !== true && this.useInput === true && this.fillInput === true) {
-              this.__setInputValue(index >= 0
-                ? this.getOptionLabel(this.options[index])
-                : this.defaultInputValue
-              );
-            }
+              if (skipInputValue !== true && this.useInput === true && this.fillInput === true) {
+                this.__setInputValue(index >= 0
+                  ? this.getOptionLabel(this.options[index])
+                  : this.defaultInputValue
+                );
+              }
+            });
           }
         }
       },
@@ -27415,7 +27441,7 @@
 
         if (this.useChips === true) {
           return this.selectedScope.map((scope, i) => h(QChip, {
-            key: 'option-' + i,
+            key: 'rem#' + i,
             props: {
               removable: this.editable === true && this.isOptionDisabled(scope.opt) !== true,
               dense: true,
@@ -27458,13 +27484,14 @@
           const attrs = isTarget === true ? this.comboboxAttrs : void 0;
 
           child.push(
-            h('div', {
+            h('input', {
               ref: isTarget === true ? 'target' : void 0,
               key: 'd_t',
               staticClass: 'q-select__focus-target',
               attrs: {
                 id: isTarget === true ? this.targetUid : void 0,
-                tabindex: this.tabindex,
+                readonly: true,
+                'data-autofocus': (fromDialog === true ? isTarget === true : this.autofocus) || void 0,
                 ...attrs
               },
               on: cache(this, 'f-tget', {
@@ -27478,6 +27505,7 @@
           if (isTarget === true && typeof this.autocomplete === 'string' && this.autocomplete.length > 0) {
             child.push(
               h('input', {
+                key: 'autoinp',
                 staticClass: 'q-select__autocomplete-input',
                 attrs: { autocomplete: this.autocomplete },
                 on: cache(this, 'autoinp', {
@@ -27514,6 +27542,12 @@
           return void 0
         }
 
+        if (this.noOptions === true) {
+          return this.$scopedSlots['no-option'] !== void 0
+            ? this.$scopedSlots['no-option']({ inputValue: this.inputValue })
+            : void 0
+        }
+
         if (
           this.$scopedSlots.option !== void 0 &&
           this.__optionScopeCache.optionSlot !== this.$scopedSlots.option
@@ -27583,9 +27617,8 @@
             ...attrs,
             id: isTarget === true ? this.targetUid : void 0,
             maxlength: this.maxlength, // this is converted to prop by QField
-            tabindex: this.tabindex,
             autocomplete: this.autocomplete,
-            'data-autofocus': (fromDialog !== true && this.autofocus) || void 0,
+            'data-autofocus': (fromDialog === true ? isTarget === true : this.autofocus) || void 0,
             disabled: this.disable === true,
             readonly: this.readonly === true
           },
@@ -27704,6 +27737,7 @@
                   }
                   else {
                     this.menu = true;
+                    this.hasDialog === true && (this.dialog = true);
                   }
                 }
 
@@ -27742,15 +27776,13 @@
             focusout(e);
           },
           click: e => {
-            if (this.hasDialog !== true) {
-              // label from QField will propagate click on the input (except IE)
-              prevent(e);
+            // label from QField will propagate click on the input (except IE)
+            prevent(e);
 
-              if (this.menu === true) {
-                this.__closeMenu();
-                this.$refs.target !== void 0 && this.$refs.target.focus();
-                return
-              }
+            if (this.hasDialog !== true && this.menu === true) {
+              this.__closeMenu();
+              this.$refs.target !== void 0 && this.$refs.target.focus();
+              return
             }
 
             this.showPopup(e);
@@ -27771,15 +27803,8 @@
       },
 
       __getMenu (h) {
-        const child = this.noOptions === true
-          ? (
-            this.$scopedSlots['no-option'] !== void 0
-              ? this.$scopedSlots['no-option']({ inputValue: this.inputValue })
-              : null
-          )
-          : this.__getOptions(h);
-
         return h(QMenu, {
+          key: 'menu',
           ref: 'menu',
           props: {
             value: this.menu,
@@ -27805,7 +27830,7 @@
             'before-hide': this.__closeMenu,
             show: this.__onMenuShow
           })
-        }, child)
+        }, this.__getOptions(h))
       },
 
       __onMenuShow () {
@@ -27856,8 +27881,9 @@
 
         this.menu === true && content.push(
           h('div', {
+            key: 'virtMenu',
             ref: 'menuContent',
-            staticClass: 'scroll',
+            staticClass: 'col scroll',
             class: this.menuContentClass,
             style: this.popupContentStyle,
             attrs: this.listboxAttrs,
@@ -27865,18 +27891,11 @@
               click: prevent,
               '&scroll': this.__onVirtualScrollEvt
             })
-          }, (
-            this.noOptions === true
-              ? (
-                this.$scopedSlots['no-option'] !== void 0
-                  ? this.$scopedSlots['no-option']({ inputValue: this.inputValue })
-                  : null
-              )
-              : this.__getOptions(h)
-          ))
+          }, this.__getOptions(h))
         );
 
         return h(QDialog, {
+          key: 'dialog',
           ref: 'dialog',
           props: {
             value: this.dialog,
@@ -27900,13 +27919,17 @@
       },
 
       __onDialogBeforeHide () {
-        if (client.is.mobile !== true) {
+        if (this.useInput !== true || this.$q.platform.is.desktop === true) {
           this.$refs.dialog.__refocusTarget = this.$el.querySelector('.q-field__native > [tabindex]:last-child');
         }
         this.focused = false;
+        this.dialogFieldFocused = false;
       },
 
       __onDialogHide (e) {
+        if (this.$q.platform.is.desktop !== true) {
+          document.activeElement.blur();
+        }
         this.hidePopup();
         this.focused === false && this.$emit('blur', e);
         this.__resetInputValue();
@@ -30998,7 +31021,7 @@
       },
 
       classes () {
-        return `q-stepper__tab col-grow flex items-center no-wrap relative-position` +
+        return 'q-stepper__tab col-grow flex items-center no-wrap relative-position' +
           (this.color !== void 0 ? ` text-${this.color}` : '') +
           (this.isError === true
             ? ' q-stepper__tab--error q-stepper__tab--error-with-' + (this.hasPrefix === true ? 'prefix' : 'icon')
@@ -32184,7 +32207,7 @@
 
     render (h) {
       if (this.$scopedSlots.default === void 0) {
-        console.error(`QVirtualScroll: default scoped slot is required for rendering`, this);
+        console.error('QVirtualScroll: default scoped slot is required for rendering', this);
         return
       }
 
@@ -32918,20 +32941,20 @@
       },
 
       cardDefaultClass () {
-        return ` q-table__card` +
+        return ' q-table__card' +
           (this.isDark === true ? ' q-table__card--dark q-dark' : '') +
-          (this.square === true ? ` q-table--square` : '') +
-          (this.flat === true ? ` q-table--flat` : '') +
-          (this.bordered === true ? ` q-table--bordered` : '')
+          (this.square === true ? ' q-table--square' : '') +
+          (this.flat === true ? ' q-table--flat' : '') +
+          (this.bordered === true ? ' q-table--bordered' : '')
       },
 
       __containerClass () {
         return `q-table__container q-table--${this.separator}-separator column no-wrap` +
           (this.grid === true ? ' q-table--grid' : this.cardDefaultClass) +
-          (this.isDark === true ? ` q-table--dark` : '') +
-          (this.dense === true ? ` q-table--dense` : '') +
-          (this.wrapCells === false ? ` q-table--no-wrap` : '') +
-          (this.inFullscreen === true ? ` fullscreen scroll` : '')
+          (this.isDark === true ? ' q-table--dark' : '') +
+          (this.dense === true ? ' q-table--dense' : '') +
+          (this.wrapCells === false ? ' q-table--no-wrap' : '') +
+          (this.inFullscreen === true ? ' fullscreen scroll' : '')
       },
 
       containerClass () {
@@ -33462,9 +33485,9 @@
         return `q-time q-time--${this.landscape === true ? 'landscape' : 'portrait'}` +
           (this.isDark === true ? ' q-time--dark q-dark' : '') +
           (this.disable === true ? ' disabled' : (this.readonly === true ? ' q-time--readonly' : '')) +
-          (this.bordered === true ? ` q-time--bordered` : '') +
-          (this.square === true ? ` q-time--square no-border-radius` : '') +
-          (this.flat === true ? ` q-time--flat no-shadow` : '')
+          (this.bordered === true ? ' q-time--bordered' : '') +
+          (this.square === true ? ' q-time--square no-border-radius' : '') +
+          (this.flat === true ? ' q-time--flat no-shadow' : '')
       },
 
       stringModel () {
@@ -34519,7 +34542,7 @@
       classes () {
         return `q-tree q-tree--${this.dense === true ? 'dense' : 'standard'}` +
           (this.noConnectors === true ? ' q-tree--no-connectors' : '') +
-          (this.isDark === true ? ` q-tree--dark` : '') +
+          (this.isDark === true ? ' q-tree--dark' : '') +
           (this.color !== void 0 ? ` text-${this.color}` : '')
       },
 
@@ -34825,7 +34848,7 @@
         }
 
         if (emit === true) {
-          this.$emit(`update:expanded`, target);
+          this.$emit('update:expanded', target);
         }
         else {
           this.innerExpanded = target;
@@ -34855,7 +34878,7 @@
         }
 
         if (emit === true) {
-          this.$emit(`update:ticked`, target);
+          this.$emit('update:ticked', target);
         }
       },
 
@@ -34889,7 +34912,7 @@
       __getNodeMedia (h, node) {
         if (node.icon !== void 0) {
           return h(QIcon, {
-            staticClass: `q-tree__icon q-mr-sm`,
+            staticClass: 'q-tree__icon q-mr-sm',
             props: { name: node.icon, color: node.iconColor }
           })
         }
@@ -35359,14 +35382,14 @@
 
       __addFiles (e, fileList) {
         const localFiles = this.__processFiles(e, fileList, this.files, true);
-
-        if (localFiles === void 0) { return }
-
         const fileInput = this.__getFileInput();
+
         if (fileInput !== void 0) {
           fileInput.value = '';
         }
 
+        if (localFiles === void 0) { return }
+
         localFiles.forEach(file => {
           this.__updateFile(file, 'idle');
           this.uploadSize += file.size;
@@ -39449,7 +39472,7 @@
 
         output += `<${type} ${attrs.join(' ')} data-qmeta="${att}">`;
         if (type === 'script') {
-          output += (metaType[att].innerHTML || '') + `</script>`;
+          output += `${metaType[att].innerHTML || ''}</script>`;
         }
       }
     });